@font-face {
  font-family: "Beatrice-Regular";
    src: url('/css/fonts/beatrice_regular-webfont.woff') format('woff'),
         url('/css/fonts/beatrice_regular-webfont.woff2') format('woff2'),
         url('/css/fonts/beatrice_regular-webfont.otf') format('opentype');
}


/* VARIABLES */



:root {
  --default-font: Beatrice-Regular, serif;
  --default-font-size: 17px;
  --default-input-font-size: 17px;

  --col-primary: #FFF;

  --col-primary-rgb: 29,62,203;

  --col-accent: #000000;
  --col-accent-rgb: 237, 121, 209;

  --col-text: #FFF;
  --col-input: #FFF;
  --col-placeholder: #000;
  --col-input-bg: transparent;

  --col-button: #FFF;
  --col-button-rgb: 255, 255, 255;

  --col-link: #FFF;
  --col-link-rgb: 0,0,0;

  --col-link-hover: #000000;
  --col-link-hover-rgb: 0, 0, 0;

  --col-error: #FF9494;
  --col-error-rgb: 255, 51, 0;

  --col-attention: #ff6633;
  --col-attention-rgb: 255, 51, 0;

  --col-warning: #f5b00e;
  --col-warning-rgb: 245, 176, 14;

  --col-missing: #FF9494;
  --col-missing-rgb: 255, 51, 0;

  --col-burger: #fff;

  --col-border: #000000;
  --col-border-rgb: 112, 112, 112;

  --dim-site-width: 1920px;
  --dim-default-space: 0;
  --dim-input-height: 30px;


  --vh: 1vh;
}

/* theme */

body { font-weight: normal; font-size: 18px; }
html.overlay-active, html.overlay-active body { max-height: 100vh; overflow: hidden;}

/*CORE HTML*/
p { line-height: 1.4; font-weight: 400}
p.short  { width: 72%; margin-left: 0; margin-right: auto}
p.shorter  { width: 60%; margin-left: 0; margin-right: auto}
p.large { font-size: 50px; font-weight: 800; }
p.extra-large { font-size: 136px; font-weight: 800; padding: 0 40px;}
p.very-large { font-size: 120px; font-weight: 800; }
p.medium { font-size: 30px; line-height: 1.66;}
p.smaller { font-size: 16px; }
a { }
b, strong { font-weight: 800}

h1 { font-size: 100px; font-weight: 800;; line-height: 1.2; margin-bottom: 0px; color: var(--col-primary)}
h2 { font-size: 80px; font-weight: 800;; color: var(--col-primary); line-height: 1.25; margin-bottom: 70px; }
h2.large { font-size: 100px;  line-height: 1.2; }

h1:last-child, h2:last-child { margin-bottom: 0 !important}

/*CONTAINERS*/
#mainbody { background: #676767;}
article { background: #DCEDF8; max-width: 1920px; margin-left:auto; margin-right: auto; padding-top: 60px }
body.article-home article { padding-top: 0px }


section { padding: 0px; }
section, section.masthead {max-width: 1920px; background: transparent; }
section.full {max-width: 1920px; padding:0}
section.masthead, section.max, section.flush { padding: 0}
/*section.masthead  { max-width: 100%;}*/

div.image > img, div.image > a > img, div.thumbnail > img, div.thumbnail > a > img { display: block; width: 100%;}
/*BUTTONS*/
a.btn { background-color: var(--col-primary); color: #fff; width: 350px; font-size: 20px; border-radius: 40px; font-weight: 800; line-height: 80px; padding-left: 32px;  text-align: left; position: relative; transition: all .3s linear}
a.btn:hover { background-color: #ED79D1;}
a.btn:after { content:""; background: url(/img/svg/arrow2.svg) no-repeat center center; background-size: contain; width: 30px; height: 100%; position: absolute; right: 40px; top: 0}
a.btn.btn-pink { color: #fff; background: #ED79D1}
a.btn.btn-pink:hover { background-color: var(--col-primary);}
a.btn.btn-pink:after { background: url(/img/svg/arrow2.svg) no-repeat center center; background-size: contain;}
a.btn.btn-white { color: var(--col-primary);  background: #ffffff}
a.btn.btn-white:hover { color: #fff;  background-color: #ED79D1}
a.btn.btn-white:after { background: url(/img/svg/arrow.svg) no-repeat center center; background-size: contain;}
a.btn2 {width: auto; padding-right: 80px;}
a.btn3 {display: table; margin: 10px 0 0 auto; width: 30px;}
a.btn3 img {display: block; width: 100%;}
div.buttons { display: flex; justify-content: center; gap: 20px; margin: 0 auto}

/*CAPTIONS*/

/*COLOURS*/
.yellow { color: var(--col-accent);}
.b-yellow { background-color: var(--col-accent);}
.b-black {background-color: #000 !important;}

.blue { color: #1D3ECB;}
.bg-blue{ background-color: #1D3ECB;}
.pink { color: #ED79D1;}
.bg-pink { background-color: #ED79D1;}




/*****************  HEADER AND FOOTER  ********************/

header { background: #1D3ECB; width: 100%; max-width: 1920px; left: 50%; transform: translate3D(-50%, 0, 0); position: fixed; margin: 0 auto; transition: all .3s ease-in; height: 60px;}
header div.tagline { position: absolute; top: 0; right: 0px; }
header div.tagline a { display: block; line-height: 60px; padding: 0 24px; color: #fff; background-color: #ED79D1; font-size: 20px; font-weight: 800; transition: all .3s ease-in}
header div.tagline a:hover { background-color: var(--col-primary); }
div.burger { display: block;}

header div.logo { display: block; margin: 0 auto; width: 120px; padding-top: 7px}
header div.logo a { display: block; width: 100%; }
header div.logo a img { display: block; width: 100%; }
header nav { position: absolute; left: 0; width: 100%; top: -200vh; opacity: 0; background: #1D3ECB; height: calc(100vh - 60px); transition: all .4s cubic-bezier(0.250, 0.460, 0.450, 0.940)}
header.active nav { top: 60px; opacity: 1}
header nav ul { display: flex; flex-direction: column; gap: 10px; justify-content: space-between; align-items: center; padding: 80px 20px; height: 100%; }
header nav ul li > a { display: block; font-size: 60px; font-weight: 800; color: #fff;  text-align: center; transition: all .3s linear }
header nav ul li > a:hover { color: #ED79D1}
header nav div.social {display: flex; gap: 25px; padding-top: 40px;}
header nav div.social a { font-size: 20px; color: #fff;}


body.article-home header  { display: none}

footer {  padding: 0 0 50px 0; z-index: 3; background: #000;}
footer div.logo {  margin: 0 auto 30px}
footer div.logo a {  display: block; width: 100%; }
footer div.logo a img {  display: block; width: 100%; margin: 0 auto; max-width: 245px}
footer div.contact {  display: block; width: 100%; margin: 0 auto; text-align: center;}
footer div.contact p {  line-height: 2}
footer div.contact p a {  font-size:20px; font-weight: 800}

div.copyright { margin-top: 40px; text-align: center;}
div.copyright p {font-size: 12px; text-align: center; font-weight:500}

/*****************  CONTENT PAGES ********************/

.white * { color: #fff !important}
div.flex-2 {display: flex; gap: 0px; }
div.align-center {display: flex; align-items: center;justify-content: flex-start;}
div.flex-3 {display: flex; gap: 0px;}
div.form-flex {display: flex; gap: 0px;}
div.form-flex {display: flex; gap: 0px;}
.split > * { width: 50% !important}
.split-2-1 > * { width: 66.66% !important}
.split-2-1 > :last-child { width: 33.34% !important}
.split-1-2 > * { width: 33.34% !important}
.split-1-2 > :last-child { width: 66.66% !important}
.split-1-1-1 > * { width: 33.33% !important}
.split-1-1-1 > :nth-child(2) { width: 33.34% !important}

/*****************  Registration Form ********************/
.top-spacing:nth-child(1) {padding-top: 120px;}
.top-spacing:nth-child(2) {padding-top: 100px;}
.top-spacing:nth-child(3) {padding-top: 3.10%;}
.top-spacing:nth-child(4) {padding-top: 5.10%;}
.top-spacing:nth-child(5) {padding-top: 10.10%;}


.page-color{
  background-color: transparent;
}

.form-size{width:65%;max-width: 780px}

::placeholder{
  color: var(--col-input);
  opacity: 1;
}


.footer-style{
  padding: 0 2.5% 0 2.5%;
  text-align: center;
}

.text-style-1{
  text-align: center;
  padding: 0 7% 0 7%;
  font-size: 20px;
}
.img-style{
  padding: 0 5% 0 5%;
}

.footer-spacing{
  padding: 100px 0 0 0;
}

.error-message{
  color: var(--col-missing);
  padding: 0 0 0 0;
  font-size: 10px;
}

.submit-button{
  padding: 0 0 0 0;
}

.consent-style{
  padding: 10px 0 0 0;
}

p.nobel{
  font-family: nobel, sans-serif;
  font-weight: 300;
  font-style: normal; 
  letter-spacing: 3px;
}

span.nobel{
  font-family: nobel, sans-serif;
  font-weight: 300;
  font-style: normal;
  font-size: 14px;
}

p.mobile-response { font-size: 23px; }

@media only screen and (max-width: 760px) {
  div.form-flex.mobile-adjust-760{
      display:block;
    }
  .form-size{width:60%;}
  div.field.mobile-adjust-field{padding: 0 0 15px 0;}

  .submit-button{
    padding: 0 0 0 0;
  }

  .top-spacing:nth-child(1) {padding-top: 90px;}
}

@media only screen and (max-width: 500px) {
  div.form-flex.mobile-adjust-500{
      display:block;
    }

  .top-spacing:nth-child(1) {padding-top: 60px;}

  .submit-button{
    padding: 0 0 0 0;
  }

  .footer-style{
    padding: 0 3.5% 3.5% 3.5%;
    text-align: center;
  }

  .text-style-1{
    text-align: center;
    padding: 0 7% 0 7%;
    font-size: 15px;
  }

  p.mobile-response { font-size: 19px; }
  
  .span-width{
    width: 100px; 
}