/*
	99Lime.com HTML KickStart by Joshua Gatcke
	style.css

*/

/*---------------------------------
	IMPORTS
-----------------------------------*/
@import url(https://fonts.googleapis.com/css?family=Arimo:400,700);
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;700&family=Raleway:wght@300;400;700;800&display=swap');

/*---------------------------------
	OVERRIDES
-----------------------------------*/
h1,h2,h3,h4,h5,h6{
font-family: "Raleway", arial, verdana, sans-serif;
font-weight:normal;
}

thead th,
tbody th{
font-family: "Open Sans", arial, verdana, sans-serif;
}

button,
a.btn,
input[type="submit"],
input[type="reset"],
input[type="button"]{
font-family: "Opens Sans", arial, verdana, sans-serif;
}

.menu{
font-family: "Opens Sans", arial, verdana, sans-serif;
}

blockquote{
font-family: "Opens Sans", arial, verdana, sans-serif;
}

/*---------------------------------
	LAYOUT
-----------------------------------*/
body{
margin:0;
padding:0 0 0 0;
color:#000;
background:#fff;
font:normal 0.9em/150% 'Opens Sans', arial, verdana, sans-serif;
text-shadow: 0 0 1px transparent; /* google font pixelation fix */
}

#wrap{
width:100%;
background:#fff;
margin:30px auto 30px auto;
padding:0 2%;
border:1px solid #ccc;
}


#footer{
text-align:center;
padding:20px;
margin:0;
border-top:1px solid #ddd;
color:#999;
font-size:0.8em;
text-shadow:0px 1px 1px #fff;
position: relative;
top:0;
left:0;
background:#fff;
}

	#link-top{
	display:none;
	}

/* NAV BAR*/
.navbar{
position:fixed;
top:0;
left:0;
width: 100%;
background:#000;
color:#fff;
z-index:1000;
}

	.navbar #logo{
	position:absolute;
	top:0;
	right:0;
	padding:0.5em 1em;
	font-size: 1.7em;
	color:#efefef;
	text-decoration:none;
	}

	.navbar span{
	color:#86dc00;
	}


	.navbar ul{
	display:inline-block;
	margin:0;
	padding:0;
	}

		.navbar li{
		margin:0;
		padding:0;
		list-style-type:0;
		display:inline-block;
		}

		.navbar li a{
		display:inline-block;
		color:#efefef;
		padding:1em 1.3em;
		text-decoration:none;
		text-transform: uppercase;
		line-height:100%;
		font-size: 1.2em;
		}

.callout{
background:#4598ef;/*#86dc00;*/
padding:3em 0;
color:#fff;
box-shadow:inset 0 0 10px rgba(0,0,0,0.2);
text-align: center;
text-shadow:0px 1px 3px rgba(0,0,0,0.2);
display:block;
}
	.callout + div.grid{margin-top:50px;}
	 a.callout{cursor:pointer;}
	 .callout i.icon-4x{font-size:6em;}
	 .callout h4{margin-bottom:30px;}
	 .callout-top{margin:50px 0 0 0;}
	 .callout p{margin-bottom:0;}
	 .callout .button{margin-top:10px;}
	 .callout.green{background:#19ad0b;/*#86dc00;*/}

#mc_embed_signup{
padding:30px 0;
}

#ui-preview{
border:5px solid #ddd;
margin:30px 0;
display:block;
}

* { box-sizing: border-box; 
duration: 30s;
}

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

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

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

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.ticker-wrap {
  position: fixed;
  top: 0;
  width: 100%;
  overflow: hidden;
  height: 3rem;
  background-color: red; 
  color:#fff;
  padding-left: 100%;
  box-sizing: content-box;
    z-index:1;
}

  .ticker {
    display: inline-block;
    height: 3rem;
    line-height: 1.8rem;  
    white-space: nowrap;
    padding-right: 100%;
    box-sizing: content-box;
    -webkit-animation-iteration-count: infinite; 
            animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
   -webkit-animation-name: ticker;
           animation-name: ticker;
    -webkit-animation-duration: 20s;
            animation-duration: 20s;
  }

    .ticker-item {
      display: inline-block;
      padding: 0 2rem;
      font-size: 2rem;
      color: white;   
    }
    
    @-webkit-keyframes ticker2 {
  0% {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

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

  100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
    
    .ticker-wrap2 {
   position: static;
  width: 100%;
  overflow: hidden;
  /*height: 4rem;*/
  padding-left: 100%;
  box-sizing: content-box;
}

  .ticker2 {
    display: inline-block;
    /*height: 4rem;*/
    line-height: 1rem;  
    /*white-space: nowrap;*/
    padding-right: 100%;
    box-sizing: content-box;
    width:100%;

    -webkit-animation-iteration-count: infinite; 
            animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
   -webkit-animation-name: ticker;
           animation-name: ticker;
    -webkit-animation-duration: 35s;
            animation-duration: 35s;
  }

    .ticker-item2 {
      display: inline-block;
      padding: 0 2rem;
      font-size: 2rem;
      color: white;  
    }

#header {background:#000;padding:0 150px 0 150px;overflow:hidden;position:sticky;top:3rem;z-index:1;}
.hdInfo {text-align:right;color:#fff;padding-right:8px;}
.contentBx {background:orange; padding:10px;color:#fff;}


/* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {
  background-color: transparent;
  /*width:250px;*/
  height: 300px;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
  margin-top:-120px;
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: left;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  background-color: #f96020;
  color: white;
  padding:15px;
}

/* Style the back side */
.flip-card-back {
  background-color: #1b242b;
  color: white;
  transform: rotateY(180deg);
}

.flip-card-back img {width:100%;height:300px;object-fit:cover;}

.flip {padding:0px 150px 0px 150px;font-family:'Raleway';}
.flip i {position:absolute;font-size:2.5em;left:15px;}
.flip-card-front p {position:absolute;bottom:25px;text-align:left;font-size:1.2em;}

.services {background:#efefef;overflow:hidden;border:1px solid #efefef;margin-top:300px;padding:30px 150px 30px 150px;clear:left;}
.contact {background:#f96020;color:#fff;overflow:hidden;padding:30px 150px 30px 150px;}
.contactImg {float:left;margin:5px;}
.why {padding:30px 150px 30px 150px;overflow:hidden;}
.why .col_4 {background:#efefef;padding:0px 15px 15px 15px;height:230px;}
.why i {background:#f96020;color:#fff;display:block;text-align:center;font:20px/43px 'FontAwesome';width:43px;border-radius:50%;margin:20px 0 15px;}
.testimonials {background:#efefef;padding:30px 150px 30px 150px;overflow:hidden;}
.testimonials .col_4 {background:#fff; padding:15px; height:230px;}
/*.testimonials .col_4 p:before {content: '"';color: #f96020;font-size: 100px;position: relative;top: 25px;float: left;padding-right: 10px;}*/
h2 {font-size:1.5em !important;font-weight:300;}
h6 {font-size:0.8em !important;}
.how {padding:30px 150px 30px 150px;overflow:hidden;}
.how .align_left {margin:5px 5px 5px 0px;}
.schedule {padding:30px 90px 30px 90px;overflow:hidden;}
.counter {padding:30px 150px 30px 150px;background:#1b242b;overflow:hidden;color:#fff;}
.call-to-action {overflow:hidden;color:#fff;background:#f96020;padding:0 150px 0 150px;}
.call-to-action .col_3 {padding:30px;background:url('../templates/css/img/border.png'); background-size:100%;background-position:left center;min-height:200px;padding:40px 25px 40px 10px;}

.call-to-action .col_9 {padding:15px 30px;}
.call-to-action .col_3 h1, .call-to-action .col_3 h2, .call-to-action .col_3 h6 {padding:0;margin:0;line-height:1em;}
.call-to-action img {width:100%;height:100%;object-fit:cover;}
.coup th, .coup td {padding:7px 2px;}
.coup td h2 strong {top:3px; position:relative;}
.footer {background:#000;overflow:hidden;padding: 0px 150px 0px 150px;}
.counter p {display:inline;}
.num {color:#f96020;font-size:2.5em;float:left;font-weight:bold; padding-right:15px;}
/*p.timer.num:after {content: '|';padding: 0px 0px 0px 10px;font-weight: 300;}*/

.testimonials h6, .why h6, .counter h6 {color:#ccc !important;font-weight:bold;}

strong,b  {font-weight:800 !important;color:inherit !important;}
.align_left {float:left;}
.align_right {float:right;}

.align_center, .center {text-align:center;margin:0 auto;}
.counter strong, b {color:#fff !important;}
.counterImgs img {width:25%;float:left;padding:0; margin:0;height:259px;object-fit:cover;}

.scrollB {display: block;overflow: hidden;}
.scrollBtxt {padding: 5px;animation-name: scrlb;animation-duration: 3s;animation-iteration-count: 1;transition: all 300ms ease-in;}
@keyframes scrlb {
  from {transform: matrix(1, 0, 0, 1, 500, 5)}
  to {transform: matrix(1, 0, 0, 1, 0, 5)}
}



/* ============================================================== 
    # Fun Factor 
=================================================================== */
.fun-fact {
  margin-top: 15px;
}

.fun-fact .timer {
  color: #f96020;
  font-family: "Raleway",sans-serif;
  font-size: 30px;
  font-weight: 700;
  margin-top: 10px;
}

.fun-fact span.medium {
  color: #fff;
  display: block;
  font-size: 18px;
  margin-top: 10px;
  font-family: "Raleway",sans-serif;
  font-weight:300;
}

.sList ul {width:470px; overflow:hidden;margin-bottom:20px;}
.sList li:before {content:'>'; color:#f96020; padding-right:10px;font-weight:bold;}
.sList li {float:left; display:inline;width:50%;font-size:12px;}

.location {height:300px;overflow:hidden;}
.location img {width:100%; height:100%; object-fit:cover;}
.hAlt {color:#f96020;font-weight:900;}
.schedule h2 {padding:0;margin:0;}
.schedule img {margin-right:50px;}

.menu {background:transparent !important;border:0 !important;text-align:right;}
.menu li a {text-shadow:none !important;color:#fff !important;padding:20px 5px !important;}
.menu li a:hover, .menu li.hover>a {background:none !important;color:#fff;opacity:0.8;}

.col_4:last-child p.timer:after {content:'+';color:#f96020;font-weight:900;padding:0;}
.divider {float: left;font-size: 30px;padding: 0px 15px 0px 0px;color: #efefef !important;font-weight: 300 !important;font-family:'Raleway';}
blockquote:before {content: '\f10d';position: relative;left: 0; color: #f96020; font-family: 'fontawesome'; font-size:24px;float:left;top:10px;padding-right:10px;}
blockquote {margin:0;}

@media (max-width:1262px) {
    #header .col_2, #header .col_9, #header .col_1 {float:none;text-align:center;margin:0 auto;width:100%;}
   .menu {text-align:center;}
   .hdInfo {text-align:center;padding:0;}
   .call-to-action .col_3 {width:35%;}
   .call-to-action .col_9 {width:60%;}
    
}

@media (max-width:990px) {
     #header {padding:0 50px 0 50px;}
    .flip .col_3{width:48%;margin-top:0;}
    .how .col_3 {width:48%;}
    .flip, .call-to-action {padding:0 50px 0 50px;}
    .services {margin-top:60px;padding:30px 50px 30px 50px;}
    .how, .why, .counter, .testimonials, .contact, .footer {padding:30px 50px 30px 50px;}
    .why .col_4 {height:280px;}
    .schedule {padding:30px 50px 30px 50px;}
    .footer {text-align:center;}
    .sList ul {width:100%;}
    .sList li {float:none;display:block; width:100%;}

}

@media (max-width:788px) {
    .counter .col_4 {float:none; width:100%;}
    .fun-fact {text-align:center;}
    .num {float:none;padding-right:0;}
    .divider {display:none !important;}
    .schedule {text-align:center;}
    .schedule img {float:none !important;margin:0 0 0 -30px;}
    .contact .col_4 {float:none; width:100%;margin-top:15px;}
    .counterImgs img {width:50%;}
    .menu li a {padding:5px 5px !important;}

    }
    


@media (max-width:640px) {
    .flip .col_3, .how .col_3, .why .col_4, .testimonials .col_4 {width:100%;float:none;}
    .how .col_3 {margin-top:30px;}
    .services .col_6 {float:none; width:100%;}
    .call-to-action .col_3 {width:50%;}
   .call-to-action .col_9 {width:48%;}
   .call-to-action {padding: 0 10px 0 10px;}
}