@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Playfair:ital,opsz,wght@0,5..1200,300..900;1,5..1200,300..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
html, body { font-family: "Roboto", sans-serif; margin:0;padding:0px;font-size:12pt; line-height:1.5;color:#151515}
.logohome  {vertical-align:top;-webkit-animation: fadeIn 2s; animation: fadeIn 2s;text-align:left;padding:4px 4px 0 4px;background-color:#ffffff;position:relative;}
.logohome img {max-width:200px;display:block;padding:0;margin:0;}
.logosm  {vertical-align:top;-webkit-animation: fadeIn 2s; animation: fadeIn 2s;text-align:left;padding:4px 8px 0px 8px;background-color:#151515}
.logosm img {max-width:200px;}


/* MENU MOBILE */
#navigation{display:none;}
.navigation ul {list-style: none;position: absolute; top:80px;left:0; z-index: 4; padding:0 20px; background-color:#ffffff;width:100%; box-sizing:border-box; margin:0;}
.navigation ul li {padding: 12px 4px;box-sizing: border-box; color: #333333;font-size:16pt;}
.navigation ul li:hover{ color: #151515;}
.navigation ul li a {text-decoration: none;color: #333333;}
.navigation ul li a:hover{ color: #151515;}
.navigation ul li ul {list-style: none; position: relative; transition: all 0.5s ease; }
.navigation ul li ul li {padding: 8px 20px;}
.menubtn{position:absolute;right:4px;top:0; font-size:32pt;}

@media (min-width:650px) {
.menubtn{display:none;}
#navigation {display:inline-block !important;}
.navigation {width:100%; vertical-align:top}
.navigation ul {text-align: right; font-weight:bold; vertical-align:top; top:30px; right:4px; background-color:transparent;}
.navigation ul li {display: inline-block; position:relative; vertical-align:top; padding: 0 2%; margin:0px;}
}
@media (min-width:1100px) {
.navigation ul li {max-width:20%;}	
}

/*END MENU  */

.transdiv {padding: 0px; background-color:transparent; position:relative;}
.sanddiv {padding: 0px; background-color:#E0D5C3; color:#06283b;position:relative;}
.whitediv {padding: 0px; background-color:#Ffffff; color:#06283b;position:relative;}
.navydiv {padding: 0px; background-color:#8A7864; color:#ffffff;position:relative;}

.newsletter {position:relative;padding:20px; background-color:#ffffff;top:-60px;margin:auto;z-index:1;text-align:center;}

.padding {padding:8px 10px 20px 10px;}
@media (min-width:700px) {
html, body { font-size:14pt; line-height:1.5;}
 .padding {padding:10px 60px 30px 60px; }
}

h1,h2,h3,h4 {  font-family: "Playfair", serif;font-weight: 300; font-style: italic;}
h1 { font-size:28pt;}

h2{font-weight:700; font-size:18pt;}
@supports (animation-timeline: view()) {
  @keyframes fade-in {
    from { opacity: 0 }
    to   { opacity: 1 }
  }
h2 {
    animation: fade-in auto linear both;
    animation-timeline: scroll();
    animation-range: 0% 100px;
  }
}

h3{font-size:20pt;margin:0; padding:4px;}
.bigblue {font-size: 24pt;}
.large {font-size: 28pt;}
.blue {font-weight:bold; }
.green {font-style: italic; }
.ital{font-weight:600; font-style: italic;}
.caps{text-transform:uppercase;font-size:14pt;position:relative;}
.header{text-shadow: #FFFFFF 1px 0 10px;}
.strikeout{color:#8A7864;text-decoration:line-through}

@media (min-width:700px) {
  h1 { font-size:36pt;}
.header h1 {padding-left:36%;}
.header .caps {padding-left:46%}
.header p { padding-left:50%}
  h2{font-size:28pt;}
  h3{font-size:24pt;}
  .bigblue {font-size: 24pt;}
  .caps{font-size:18pt;}
}

.backimg {    position: relative; 
    height: auto;
    width: 100%;
      background-size: cover;
      background-repeat: no-repeat;
      background-position:center;
}

.backimg-cover {
      position: absolute;
      background-color:#ffffff;
      width:100%;
      height:100%;
      top: 0px;
      right: 0px;
      bottom: 0px;
      left: 0px;
      opacity:0.6;
}

.one-third img {width:100%}
.third {width:100%;padding:2%; box-sizing:border-box;}
.half {width:100%;position:relative; box-sizing:border-box; vertical-align:top;padding:10px;margin:0;z-index:1;}
@media (min-width:700px) {
  .third {width:31.33%; display:inline-block; margin:1%;vertical-align: top;}	
  .one-third {width:33.33%;display: inline-block;vertical-align: top;}
  .two-third {width:64.33%; display:inline-block; margin:1%;}
  .half {width:50%; display:inline-block;padding:20px;}	
 .leftimg {position:absolute;right:0; max-height:100%}
}

.bar {width: 98%; text-align:left}
.box {background-color:#a2dbe8; box-sizing:border-box; border:1px solid #151515; border-radius:6px; margin:-38px 0 30px -5px;padding: 40px; }
.bubble {background-color:#ffffff; box-sizing:border-box; border:2px solid #151515; color:#151515; border-radius:6px;padding: 10px; }
.boxtitle{margin-right:0;margin-bottom:0px;vertical-align:bottom;font-weight:bold;color:#aabfa1; font-size: 36pt;}

@media (min-width:650px) {
.bar {width: 60%; text-align:center;}
}

.modbox {
  border: 2px solid #151515;
  padding:30px 20px;
  width:48%;
  margin:1%;
  display:inline-block;
  text-align:left;
  background-color:#E0D5C3;
  color:#ffffff; 
  position:relative;
  text-align:center;
}
@media (min-width:700px) {
  .modbox {width:23%;}
}

.modbox a {text-decoration:none;color:#151515}
.modbox h2 {color:#ffffff;  z-index:2; }
.modbox:hover {
  background-color:#151515;
}
.modboximg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position:center;
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
  opacity:0.3;
  z-index:0;
}

.modsection{padding:60px;}
.bignum{opacity:0.4; color:#aabfa1; font-size:100pt;left:30px;top:-80px;position:absolute;}
.downarrw {font-size:48pt; text-decoration:none; z-index:5;position:relative;padding:0 20px;margin-top:-20px; color:#ffffff;}
.downarrw:hover{padding-top:30px;margin-top:20px;}


.storeitem {position:relative;width:99%;display:inline-block; box-sizing:border-box; vertical-align:top; padding: 4px; margin:0.5%; background-color:#ffffff;text-align:center;color:#151515;min-height:300px;}
.courseitem {position:relative;width:99%;display:inline-block; box-sizing:border-box; vertical-align:top; padding: 4px; margin:0.5%; background-color:#ffffff;text-align:center;}
.courseitem img {max-width:300px; width:100%;padding:0;margin:0;}
.storeitem img {max-width:100px;width:100%;padding:4px;margin:0;}
.storeitem p {font-size:12pt;padding:0;margin:0;}
.storeitem:hover p {font-size:14pt}
.bottom {position:absolute;bottom:0;left:1%;font-size:14pt;text-align:center;width: 98%;}
@media (min-width:450px) {
.storeitem {width:48%;}
.storeitem img {max-width:150px;}
}

@media (min-width:850px) {
.storeitem {width:23%;}
.courseitem {width:32%;}
.bottom {font-size:18pt;}
}

.block {position:relative;width:99%;min-height: 180px;display:inline-block; box-sizing:border-box; vertical-align:top; padding: 8px; margin:0.5%; border:2px solid #aabfa1;text-align:center;cursor:pointer;}
@media (min-width:650px) {
.block {width:48%;min-height: 275px;}
}
@media (min-width:950px) {
.block {width:23%; min-height: 250px; }
}


/* Buttons
末末末末末末末末末末末末末末末末末末末末末末末末末 */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  padding: 6px 12px;
  color: #ffffff;
  text-align: center;
  font-size: 10pt;
  text-decoration: none;
  white-space: nowrap;
  background-color: #aabfa1;
  border-radius: 24px;
  border: 1px solid #151515;
  cursor: pointer;
font-family: "Parisienne", cursive;
  box-sizing: border-box; }

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
  background-color: #7f8f78;
  outline: 0; }

.buttongreen, buttongreen.a, a.buttongreen {
  display: inline-block;
  padding: 12px 30px;
  color: #ffffff;
  text-align: center;
  font-size: 12pt;
  text-decoration: none;
  white-space: nowrap;
  background-color:  #aabfa1;
  border-radius: 24px;
  border: 1px solid #151515;
  cursor: pointer;
  box-sizing: border-box; }

.buttongreen:hover,
buttongreen:hover,
a.buttongreen:hover
{
  background-color: #7f8f78;
  outline: 0; }

.buttonblue, buttonblue.a, a.buttonblue {
  display: inline-block;
  padding: 12px 30px;
  color: #ffffff;
  text-align: center;
  font-size: 12pt;
  text-decoration: none;
  white-space: nowrap;
  background-color: #8A7864;
  border-radius: 24px;
  border: 1px solid #151515;
  cursor: pointer;
  box-sizing: border-box; }

.buttonblue:hover,
buttonblue:hover,
a.buttonblue:hover
 {
  background-color: #C1A68E;
  outline: 0; }

.popup {
	position:fixed;
	width:90%;
	margin:auto;
        padding:8px;
 	box-sizing:border-box;
	left:5%;
	top:5%;
	max-height:90%;
	z-index:4;
border:4px solid #7c9f24;
background-color:#ffffff;
overflow: auto;      
}
@media (min-width:650px) {
  .popup {
     
  }
}
.popup-back{position: fixed;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0,0,0, 0.8);z-index:2;}
.exitbtn {
	position: absolute;
	right: 2px;
	top: 0px;
	cursor: pointer;	
	text-align: center;
	z-index: 5;
	font-size:22pt;
	padding: 0px 8px;
 	box-sizing:border-box; 
        margin:0;
        color:#8A7864;
}


/* TESTIMONIAL SLIDER / CAROUSEL */

.border {
  border: 8px #c3c3c3;
  border-style: double none double none;
  text-align:center;
  width:98%;
  max-width:1200px;
  margin:20px auto;
  padding:20px;
  box-sizing:border-box;
}

.carousel{
  width: 100%;
  margin-top: 0px;
  margin-bottom: 20px;
  margin-left: auto;
  margin-right: auto;
  max-width: 900px;
  overflow-x: hidden;
  position: relative;
  display: flex;
  justify-content: flex-start;
  border-radius: 13px;
}
.carousel-inner{
  height: 100%;
  box-sizing:border-box;
  /* min-width: 400%; */
  display: flex;
  transition: all ease .5s;
  text-align:center;
}
.carousel-item{
  flex: 1;
  height: 100%;
  margin:0 50px 0 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
   font-size:10pt;
}
@media (min-width:650px) {
  .carousel-item{font-size:14pt;}
}
.carousel-item h1{
  opacity: .5;
}
.carousel-controls {
  display: inline-block;
  font-size: 30pt;
  height: 40px;
  width: 40px;
  cursor: pointer;
  opacity: .5;
}
.carousel-controls .prev{
  position: absolute;
  top: 40%;
  left: 0px;
}
.carousel-controls .next{
  position: absolute;
  top: 40%;
  right: 0px;
}
.prev:hover, .next:hover{
  opacity: 1;
}
.carousel-indicators{
  position: absolute;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}
.carousel-indicators span{
  display: inline-block;
  background-color: white;
  width: 30px;
  height: 4px;
  border-radius: 2px;
  opacity: .5;
  cursor: pointer;
  margin: 3px;
}
.carousel-indicators span.active{
  opacity: 1;
}
.quote {font-size:56pt;padding:10px 0 0 0;margin:0;line-height:1;opacity:0.5}

  /* COUNTDOWN TIME */
  #clockdiv{
  color: #ffffff;
  display: inline-block;
  font-weight: 100;
  text-align: center;
  font-size: 18pt;
}
.smalltext{
  padding-top: 2px;
  font-size: 10pt;
}
@media (min-width:650px) {
  #clockdiv{font-size: 42pt;}
  .smalltext{  font-size: 12pt;}
}

#clockdiv > div{
  padding: 2px;
  border-radius: 3px;
  background: #06283b;
  display: inline-block;
}

#clockdiv div > span{
  padding: 8px;
  border-radius: 3px;
  background: #aabfa1;
  display: inline-block;
}

* Animations */
.bounce {
    font-size: 5rem;
    width: 100%;
    margin: 3rem auto;
    display: inline-flex;
    justify-content: center;
    -webkit-box-reflect: below -20px linear-gradient(transparent, #211e1e2e);
}
.bounce span {
    display: inline-flex;
    font-family: "Play", sans-serif;
    animation: bounce 1s ;
}
@keyframes bounce {
    0%,
    50%,
    100% {
        transform: translateY(0);
    }
    25% {
        transform: translateY(-20px);
    }
}


.animated {
  -webkit-animation-duration: 1000ms;
  -moz-animation-duration: 1000ms;
  -ms-animation-duration: 1000ms;
  -o-animation-duration: 1000ms;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInTop {
  -webkit-animation-name: slideInTop;
  animation-name: slideInTop;
  animation-delay: 1s;
}

@-webkit-keyframes slideInTop {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInTop {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}



@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100px, 0);
    transform: translate3d(0, 100px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100px, 0);
    transform: translate3d(0, 100px, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-50px, 0, 0);
    transform: translate3d(-50px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-50px, 0, 0);
    transform: translate3d(-50px, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeIn {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=(0));
  opacity: 0;
}
.fadeIn.animated {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}
@media only screen and (max-width: 767px) {
  .fadeInDown,
  .fadeInLeft,
  .fadeInRight,
  .fadeInUp {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=(0));
    opacity: 0;
  }
  .fadeInDown.animated,
  .fadeInLeft.animated,
  .fadeInRight.animated,
  .fadeInUp.animated {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
  }
}
@media only screen and (min-width: 768px) {
  .fadeInUp {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=(0));
    opacity: 0;
  }
  .fadeInUp.animated {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
  }
  .fadeInDown {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=(0));
    opacity: 0;
  }
  .fadeInDown.animated {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
  }
  .fadeInLeft {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=(0));
    opacity: 0;
  }
  .fadeInLeft.animated {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
  }
  .fadeInRight {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=(0));
    opacity: 0;
  }
  .fadeInRight.animated {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
  }
}