/*TitlingGothicFB Normal Standard
font-family: titling-gothic-fb, sans-serif;





font-family: titling-gothic-fb-wide, sans-serif;

*/
@import url('https://fonts.googleapis.com/css2?family=Zilla+Slab:wght@300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@100;300;400&display=swap');
html, body{ height: 100%; }
body{font-family: 'DM Sans', sans-serif;font-size:16px;background-size:100%;background:#fff;background-attachment:fixed; padding-top:100px }
.container-fluid{padding:0 8%}
.container-fluid-full{padding:0 30px}
.container-fluid.right-zero{padding:0 15px 0 8%}
.container-fluid.left-zero{padding:0 8% 0 15px}
img{}

h1,h2,h3,h4,h5,h6{font-weight:700;margin:0;font-family: 'DM Sans', sans-serif;line-height:initial}
h1{font-size:38px}
h2{font-size:32px}
h3{font-size:28px}
h4{font-size:24px}
h5{font-size:18px}
h6{font-size:13px}
.head-zero{font-size:70px; line-height:76px;}
.head-one{font-size:44px; line-height:60px}
.head-f-dm{font-family:'DM Sans', sans-serif !important; font-weight:500}
.p-one{font-size:20px; line-height:36px}
.p-two{font-size:18px; line-height:30px}
p{font-size:16px;line-height:26px; margin-bottom:0}
li{list-style:none}
a{c outline:none !important}
a:hover{text-decoration:none}
*{padding:0;margin:0}
.op-5{opacity:0.5}
.gl-ml{margin-left:10%}
.dm-sans{font-family: 'DM Sans', sans-serif !important}
.ls-2{letter-spacing:2px}
.ls-4{letter-spacing:4px}

.btn{padding:0; font-weight:600}
.white{background:#fff; height:100%}
.cap{text-transform:uppercase}
.lh-0{line-height:0}
.t-white{color:#fff}
.fw-300{font-weight:300;}
.fw-400{font-weight:400;}
.fw-500{font-weight:500;}
.fw-600{font-weight:600;}
.fw-700{font-weight:700;}

span.highlight{content:'';  background:#ffe1bc}


.btn-normal{color:#fff; background:#FF2E57;border-radius:40px; text-transform:uppercase; font-weight:300; display:inline-block;font-size:14px; transition:all ease-in-out 0.2s; padding:12px 24px;}
.btn-normal img{transition:all ease-in-out 0.2s}
.btn-normal:hover img{margin-left:4px}
.btn-normal:hover{margin-left:4px; padding-right:21px;color:#1C1C1C;}

.btn-border{color:#333; border:solid 2px #FF2E57;border-radius:40px; text-transform:uppercase; font-weight:300; display:inline-block;font-size:14px; transition:all ease-in-out 0.2s; padding:12px 24px;}
.btn-border img{transition:all ease-in-out 0.2s}
.btn-border:hover img{margin-left:4px}
.btn-border:hover{margin-left:4px; padding-right:21px;color:#1C1C1C;}

.sec-pad{padding:80px 0 100px 0}
.sec-pad-one{padding:70px 0}
.sec-pad-one-b{padding-bottom:70px}
.sec-pad-one-t{padding-top:70px}

.sec-pad-two{padding:100px 0}
.sec-pad-two-b{padding-bottom:100px}
.sec-pad-two-t{padding-top:100px}

.p-large{font-family: 'Playfair Display', serif; font-size:18px; line-height:30px}
.p-x-large{font-family: 'Playfair Display', serif; font-size:20px; line-height:32px}
.bg-blue{background:#0053A6}
.bg-grey{background:#F6F6F6}
.sec-info{font-size:12px; letter-spacing:2px}
.form-group label{color:#fff;}

.events .slider--item{outline:none}

header{position:fixed; width:100%; z-index:999999;top:0; background:white; min-height:100px; padding-top:16px;}

header .right .btn{margin-right:60px}

.header{height:100px; padding:0 40px;transition:all ease-in-out 0.2s;}
.header .brand img, .scrollheader .brand img{width:150px;transition:all ease-in-out 0.2s;}
.header .brand{display:block; width:150px;overflow:hidden;transition:all ease-in-out 0.2s;	}

.scrollheader{padding:0 40px;height:50px;transition:all ease-in-out 0.2s; background:white; box-shadow:0 0 10px rgba(0,0,0,0.3)}

.scrollheader .brand img{width:74px}
.scrollheader .hamburger {top: -2px;right: 10px;}
.scrollheader .nav {clip-path: circle(29px at calc(100% - 0px - 30px) calc(-15px + 30px));}
.scrollheader .btn-yellow {padding: 5px 14px;}
.scrollheader .submenu{top:-40px;}
.scrollheader .inline-menu{top:-20px;}
.scrollheader nav.inline-menu .mega-menu{top: 43px; z-index:9999999}

header .submenu { position:relative; top:0;transition:all ease-in-out 0.2s;}
header .submenu a{color:#0053A6; display:inline-block; padding-left:16px; float:right; position:relative; top:0}

.footer{background:#121212; color:#fff;}
.footer a{color:#fff;}
.footer a:hover, .footer .links a:hover, .footer .links.two a:hover{color:#0053A6;}
.footer h5{font-weight:300}
.footer .links a{float:left; display:block; padding:0px 0 12px 0; width:50%; text-transform:uppercase; font-size:12px; color:#fff}
.footer .links a{float:left; display:block; padding:0px 0 12px 0; width:50%; text-transform:uppercase; font-size:12px; color:#fff}
.footer .links.two a{float:left; display:block; padding:0px 0 12px 0; width:100%; text-transform:uppercase; font-size:12px; color:#fff}
.floating-wpp{z-index:99}

/*nav*/
nav{padding-top:15px}
nav h4 {font-size: 15px ;line-height: 30px !important; margin: 0 !important; font-family:DM Sans}
nav .plans {margin:7px -2px 0 -2px;}
nav .plans .planner{background:#F3F3F3; border-radius:5px; width:48%; float:left; margin:1% 1%; text-align:center; min-height:58px; padding-top:14px;}
nav .plans.programs-menu .planner{background:#F3F3F3; border-radius:5px; width:100%; float:left; margin:1% 1%; text-align:center;min-height: 47px;padding-top: 9px;}
nav .plans .planner h4{font-size:20px; display:inline-block; position:relative; color: #000;}
nav .plans .planner sup{font-size:7px; position:absolute; top:5px;vertical-align: baseline;line-height: 0;}
nav .plans .planner img{height:16px; margin-bottom:8px;}
nav.inline-menu{ transition:all ease-in-out 0.2s;line-height:2.0rem;  float:left; position:relative; width:100%; top:8px}
nav.inline-menu > ul { display:block; margin:0; text-align:center; margin-right:-16px }
nav.inline-menu ul > li{ display:inline-block; vertical-align:middle; margin:0; }
nav.inline-menu > ul:last-of-type li > a:hover{ }
nav.inline-menu > ul > li > a { padding:0px 16px; color:#000; font-weight:500;text-decoration:none; display:block; float:left; cursor:pointer;height:32px; position:relative; }
nav.inline-menu > ul > li > a:hover {background: url(../images/smile.svg) no-repeat center 14px;background-size: 30px;}
nav.inline-menu > ul > li > a img{position:absolute; right:3px;}

nav.inline-menu .mega-menu-inner .three.columns:last-of-type ul { border:0; }
nav.inline-menu .mega-menu { width:100%; /*display:block !important ;*/ top:96px; text-align:left; list-style: none; position:fixed; height:auto; background:#fff; box-shadow:0 0 10px rgba(0,0,0,0.1); padding: 40px 20px; z-index:20; left:0 }
nav.inline-menu .mega-menu.about { width:300px;  left:0; position:absolute; top:32px; padding:10px 20px }
nav.inline-menu .mega-menu.about a{display:block; color:#000; padding:8px 0}
nav.inline-menu .mega-menu .item{transition:all ease-in-out 0.2s;color:#363636; width:19%; float:left; text-align:center; padding:70px 0 30px 0; border-right: solid 1px #e5e5e5; display:block; min-height:170px;}
nav.inline-menu .mega-menu .item.first{color:#363636; width:24%; float:left; text-align:left; padding:20px 30px 20px 20px; border-right: solid 1px #e5e5e5; display:block;}
/* Menu Inline */
nav.inline-menu .mega-menu .item h4 sup { font-size: 15px; position: absolute;top: 6px;font-weight: 300;}
nav.inline-menu .mega-menu .item h4 {text-transform:uppercase;margin: 15px 0;position: relative; display: inline-block; font-weight:400}
nav.inline-menu .mega-menu .item span {opacity:0; transition:all ease-in-out 0.2s; font-size:13px; position:relative; bottom:-5px}
nav.inline-menu .mega-menu .item:hover span{opacity:1; bottom:0px}
nav.inline-menu .mega-menu .item:hover {padding:50px 0 40px 0}
nav.inline-menu .mega-menu .item.first:hover {padding:20px 30px 20px 20px}
nav.inline-menu .mega-menu.more{width:300px; position:absolute; right:0;padding: 0}
nav.inline-menu .mega-menu.more a{display:block;padding:10px 15px}
nav.inline-menu .mega-menu.more a:hover{background:#f1f1f1}


.contact-ribbon .item{border-radius:8px;padding:50px 40px; }
.contact-ribbon .item h3{color:#fff; float:left;}
.contact-ribbon .item a{ float:right;}
.quick{position:fixed; left:0; top:40%; z-index:9999999999999999999999999999999}

 .btn-container .btn-wt {
	 position:fixed;
	 bottom:30px;

left:30px;
	 display: inline-block;
	 -webkit-transition-duration: 0.3s;
	 transition-duration: 0.3s;
	 -webkit-transition-property: -webkit-transform;
	 transition-property: transform;
	 -webkit-transform: translateZ(0);
	 -ms-transform: translateZ(0);
	 transform: translateZ(0);
	 box-shadow: 0 0 1px rgba(0, 0, 0, 0);
	 -webkit-transform: translateY(-6px);
	 -ms-transform: translateY(-6px);
	 transform: translateY(-6px);
	 -webkit-animation-name: hover;
	 animation-name: hover;
	 -webkit-animation-duration: 1.5s;
	 animation-duration: 1.5s;
	 -webkit-animation-delay: 0.3s;
	 animation-delay: 0.3s;
	 -webkit-animation-timing-function: linear;
	 animation-timing-function: linear;
	 -webkit-animation-iteration-count: infinite;
	 animation-iteration-count: infinite;
	 -webkit-animation-direction: alternate;
	 animation-direction: alternate;
	  z-index:9999999999999999999999999999999;
}
 .btn-container .btn-wt:before {
	 pointer-events: none;
	 position: absolute;
	 z-index: -1;
	 content: '';
	 top: 100%;
	 left: 5%;
	 height: 10px;
	 width: 90%;
	 opacity: 0;
	 background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
	 background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
	 -webkit-transition-duration: 0.3s;
	 transition-duration: 0.3s;
	 -webkit-transition-property: -webkit-transform, opacity;
	 transition-property: transform, opacity;
	 opacity: 0.4;
	 -webkit-transform: translateY(6px);
	 -ms-transform: translateY(6px);
	 transform: translateY(6px);
	 -webkit-animation-name: hover-shadow;
	 animation-name: hover-shadow;
	 -webkit-animation-duration: 1.5s;
	 animation-duration: 1.5s;
	 -webkit-animation-delay: 0.3s;
	 animation-delay: 0.3s;
	 -webkit-animation-timing-function: linear;
	 animation-timing-function: linear;
	 -webkit-animation-iteration-count: infinite;
	 animation-iteration-count: infinite;
	 -webkit-animation-direction: alternate;
	 animation-direction: alternate;
}
.btn-container .btn-wt:hover {
	 
}
 @keyframes hover {
	 50% {
		 -webkit-transform: translateY(-3px);
		 -ms-transform: translateY(-3px);
		 transform: translateY(-3px);
	}
	 100% {
		 -webkit-transform: translateY(-6px);
		 -ms-transform: translateY(-6px);
		 transform: translateY(-6px);
	}
}
 @-webkit-keyframes hover-shadow {
	 0% {
		 -webkit-transform: translateY(6px);
		 transform: translateY(6px);
		 opacity: 0.4;
	}
	 50% {
		 -webkit-transform: translateY(3px);
		 transform: translateY(3px);
		 opacity: 1;
	}
	 100% {
		 -webkit-transform: translateY(6px);
		 transform: translateY(6px);
		 opacity: 0.4;
	}
}
 @keyframes hover-shadow {
	 0% {
		 -webkit-transform: translateY(6px);
		 -ms-transform: translateY(6px);
		 transform: translateY(6px);
		 opacity: 0.4;
	}
	 50% {
		 -webkit-transform: translateY(3px);
		 -ms-transform: translateY(3px);
		 transform: translateY(3px);
		 opacity: 1;
	}
	 100% {
		 -webkit-transform: translateY(6px);
		 -ms-transform: translateY(6px);
		 transform: translateY(6px);
		 opacity: 0.4;
	}
}
 @-webkit-keyframes hover {
	 50% {
		 -webkit-transform: translateY(-3px);
		 transform: translateY(-3px);
	}
	 100% {
		 -webkit-transform: translateY(-6px);
		 transform: translateY(-6px);
	}
}
 @keyframes hover {
	 50% {
		 -webkit-transform: translateY(-3px);
		 -ms-transform: translateY(-3px);
		 transform: translateY(-3px);
	}
	 100% {
		 -webkit-transform: translateY(-6px);
		 -ms-transform: translateY(-6px);
		 transform: translateY(-6px);
	}
}
 


header.mobile nav {
    height: 100%;
    position: fixed;
    bottom: 0;
    width: 100%;
    transform: translateX(100%);
    transition: transform 460ms ease-in-out;
    background: white;
	z-index: 11;
	overflow-y: scroll;
	padding:25px;
}
header.mobile nav ul {
    margin:0;
    padding:20px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
}
header.mobile nav ul>li {
    list-style: none;
    color: #fff;
    cursor: pointer;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
     transition: .25s;
	 float:left;
	 width:50%;
}
header.mobile nav ul>li span {
    display: block;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.50);
}
header.mobile nav ul>li a { color: #000;
    cursor: pointer;
    text-decoration: none;
	padding: 15px 10px;
	display:block;
	position:relative;
	font-size:16px;
}
header.mobile nav ul>li a img{position:absolute;right:12px;top:20px;}
header.mobile nav ul>li:hover {

}
header.mobile input[type="checkbox"]:checked ~ nav {
  transform: translateX(0);
}
header.mobile input[type=checkbox] {
  box-sizing: border-box;
  display: none;
  transition: all 0.25s;
}
header.mobile .menuIconToggle {
  box-sizing: border-box;
  cursor: pointer;
  position: fixed;
  z-index: 40;
  height: 100%;
  width: 100%;
  top: 13px;
  right: 15px;
  height: 22px;
  width: 38px;
  transition: all 0.3s;
}
header.mobile .hamb-line {
  box-sizing: border-box;
  position: absolute;
  height: 2px;
  width: 100%;
  background-color: #000;
  transition: all 0.25s;
}
header.mobile .hor {
       transition: all 0.3s;
    box-sizing: border-box;
    position: absolute;
    float: left;
    margin-top: 18px;
    color: #000;
    background: none;
    font-size: 11px;
    letter-spacing: 2.6px;
}
}
header.mobile .dia.l-1 {
  position: relative;
  box-sizing: border-box;
  float: left;
  transition: all .45s;
}
header.mobile .dia.l-2 {
  box-sizing: border-box;
  position: relative;
  float: left;
  margin-top: 10px;
  transition: all .45s;
}
header.mobile input[type=checkbox]:checked ~ .menuIconToggle > .hor {
  box-sizing: border-box;
  opacity: 0;
  transition: all .25s;
}
header.mobile input[type=checkbox]:checked ~ .menuIconToggle > .dia.l-1 {
  box-sizing: border-box;
  transform: rotate(135deg);
  margin-top: 12px;
  transition: all .45s;
  background:#000;
}
header.mobile input[type=checkbox]:checked ~ .menuIconToggle > .dia.l-2 {
  box-sizing: border-box;
  transform: rotate(-135deg);
  margin-top: 12px;
  transition: all .45s;
  background:#000;
}


header .btn-primary-cta{ line-height: 14px;
	background: #825FC5 url(../images/arw-left.svg) no-repeat 89% center;
	border-radius: 34px;
	font-size: 16px;
	background-size: 16px;
	color: #fff;
	padding: 15px 53px 15px 27px;
	display: inline-block;
	position: relative;
	transition: all 0.4s cubic-bezier(0.42, 0, 0.58, 1);
}


header .btn-primary-cta:hover {background-color: #8B65BB;}

*/




/* #Progress
================================================== */

.progress-wrap {
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: block;
	border-radius: 50px;
	box-shadow: inset  0 0 0 2px rgba(255,255,255,0.2);
	z-index: 10000;
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}
.progress-wrap svg path { 
	fill: none; 
}
.progress-wrap svg.progress-circle path {
	stroke: #000	;
	stroke-width: 4;
	box-sizing: border-box;
	-webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}

/* #Cursor
================================================== */

.cursor,
.cursor2,
.cursor3{
	position: fixed;
	border-radius: 50%;	
	transform: translateX(-50%) translateY(-50%);
	pointer-events: none;
	left: -100px;
	top: 50%;
	-webkit-transition: all 300ms linear;
	transition: all 300ms linear;
}
.cursor{
	background-color: red;
	z-index: 99999;
	height: 0;
	width: 0;
}
.cursor2,.cursor3{
	height: 46px;
	width: 46px;
	z-index:99998;
	-webkit-transition:all 0.3s ease-out;
	transition:all 0.3s ease-out
}
.cursor2.hover,
.cursor3.hover{
	-webkit-transform:scale(1.4) translateX(-35%) translateY(-35%);
	transform:scale(1.4) translateX(-35%) translateY(-35%);
	border:none
}
.cursor2{
}
.cursor2.hover{
	background: rgba(255,255,255,0.5);
}
.cursor2.hover .progress-wrap {
	box-shadow: inset  0 0 0 2px rgba(255,255,255,0);
}
.cursor2.hover .progress-wrap svg.progress-circle path {
	opacity: 0.4;
}


@-webkit-keyframes border-transform{
    0%,100% { border-radius: 63% 37% 54% 46% / 55% 48% 52% 45%; } 
	14% { border-radius: 40% 60% 54% 46% / 49% 60% 40% 51%; } 
	28% { border-radius: 54% 46% 38% 62% / 49% 70% 30% 51%; } 
	42% { border-radius: 61% 39% 55% 45% / 61% 38% 62% 39%; } 
	56% { border-radius: 61% 39% 67% 33% / 70% 50% 50% 30%; } 
	70% { border-radius: 50% 50% 34% 66% / 56% 68% 32% 44%; } 
	84% { border-radius: 46% 54% 50% 50% / 35% 61% 39% 65%; } 
}
@keyframes border-transform{
    0%,100% { border-radius: 63% 37% 54% 46% / 55% 48% 52% 45%; } 
	14% { border-radius: 40% 60% 54% 46% / 49% 60% 40% 51%; } 
	28% { border-radius: 54% 46% 38% 62% / 49% 70% 30% 51%; } 
	42% { border-radius: 61% 39% 55% 45% / 61% 38% 62% 39%; } 
	56% { border-radius: 61% 39% 67% 33% / 70% 50% 50% 30%; } 
	70% { border-radius: 50% 50% 34% 66% / 56% 68% 32% 44%; } 
	84% { border-radius: 46% 54% 50% 50% / 35% 61% 39% 65%; } 
}

/*text reveal*/


 h1.splitting .char {
	 transition: transform 0.3s cubic-bezier(0.3, 0, 0.3, 1), opacity 0.3s linear;
	 transition-delay: calc(20ms * var(--char-index));
}
 h1.splitting[data-scroll="out"] .char {
	 opacity: 0.1;
	 transform: translateY(0.25em);
}
.author{text-align:right}

@media (max-width: 575.98px) {
	.main-menu, .submenu{display:none;}
	.header .brand img, .scrollheader .brand img { width: 100px;}
	.header {height: 60px;padding: 0 15px}
	body {padding-top:60px;}
	.slider .slider--item{height:65vh}
	.sec-pad{padding:40px 0 50px 0}
	.sec-pad-one{padding:40px 0}
	.sec-pad-one-b{padding-bottom:40px}
	.sec-pad-one-t{padding-top:40px}
	.sec-pad-two{padding:40px 0}
	.sec-pad-two-b{padding:40px 0}
	.p-x-large { font-size: 16px;line-height: 26px;}
	h1{font-size:28px; font-weight:500}
	h2{font-size:26px}
	h3{font-size:24px}
	h4{font-size:22px}
	h5{font-size:18px}
	h6{font-size:13px}
	
	.sec-info { font-size: 10px;line-height: 22px; padding:0 40px;}
.p-large {font-size: 16px;line-height: 26px;}
header {  min-height: 61px; padding: 12px 10px;}
header.mobile .menuIconToggle{top: 19px; right: 16px;}
nav .plans .planner h4{font-size:13px;    font-weight: 500;}
nav .plans .planner sup {font-size: 12px;}
.footer .links.two a{width:50%}
.footer .ftr-logo{text-align:center}
.footer .get-in-touch{text-align:center; border-bottom:solid 1px #424242}
.footer .website {border-bottom:solid 1px #424242}
.author{text-align:center;}
.footer-copyright{text-align:center}
.footer-copyright p{font-size:12px;}
.form-title h2{font-size:24px;    font-weight: 300;}
.breadcrumb{font-size:12px; padding:10px 0 }
 .btn-container .btn-wt img{width:52px; bottom:15px; left:15px;}
 
 .contact-ribbon .item{ text-align:center}
.contact-ribbon .item h3{width:100%}
.contact-ribbon .item a{ float:initial; width:100%; margin-top:30px;}
}


@media (min-width: 576px) and (max-width: 767.98px) {
	.main-menu{display:none;}
}

@media (min-width: 768px) and (max-width: 991.98px) { }


@media (min-width: 992px) and (max-width: 1199.98px) {  }


@media (min-width: 1200px) {  }