@import url('https://fonts.googleapis.com/css?family=Poppins:300,500,400,600,700,800');
@import url(https://fonts.googleapis.com/css?family=Sanchez:400italic,400);
@import url('normalize.css');

/* 1. RESET. ====================================================*/

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html,
body,
div,
span,
applet,
object,
iframe,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
   margin: 0;
   padding: 0;
   border: 0;
   font-size: 100%;
   font: inherit;
}

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
   display: block;
}

body {
   overflow-x: hidden;
   text-rendering: optimizeSpeed;
   background: #FFF;
}

html {
   font-size: 24px;
   font-weight: 100;
   line-height: 1.5;
}

/* 2. TYPOGRAPHY. ====================================================*/
/* h1, h2, h3, h4, h5, h6, p, ul,ol{ margin-top: 0; margin-bottom: 1rem; color: #323B3C; } h1, h2, h3, h4, h5, h6 { margin-bottom: 0.5rem; line-height: 1.1; font-family: 'UTMHelve'; } h1, .h1 { font-size: 1.602rem; font-weight: 600; } h2, .h2 { font-size: 1.424rem; font-weight: 600; color: #35414b; } h3, .h3 { font-size: 0.90rem; color: #35414b; font-weight: 600; } h4, .h4 { font-size: 0.85rem; color: #35414b; margin-bottom: 5px; } h5, .h5 { font-size: 0.70rem; color: #3AB3DF; font-weight: 500; text-transform: uppercase; } h6, .h6 { font-size: 0.889rem; text-transform: uppercase; font-weight: 500; color: #262626; } p { font-size: 15px; font-family: 'UTMHelve'; color: #8C8C9E; font-weight: 400; line-height: 2; margin-bottom: 0px; } a { color: #FFF; text-decoration: none; transition: 0.3s; } a:hover { color: #3AB3DF; text-decoration: none; } */

/* 3. SPACE AND ALIGMENT. ====================================================*/
.container,
.container-fluid {
   margin: 3rem auto 3rem auto;
}

section {
   position: relative;
}

.inner-color {
   padding: 1px 0px;
   background-color: #F7FAFA;
}

/* 4. PRELOADER ====================================================*/
#loader-wrapper {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 1031;
   background-color: #F2F2F2;
}

.loader2 {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   text-align: center;
}

.loader {
   max-width: 150px;
   width: 100%;
   height: auto;
   stroke-linecap: round;
}

circle {
   fill: none;
   stroke-width: 3.5;
   -webkit-animation-name: preloader;
   animation-name: preloader;
   -webkit-animation-duration: 3s;
   animation-duration: 3s;
   -webkit-animation-iteration-count: infinite;
   animation-iteration-count: infinite;
   -webkit-animation-timing-function: ease-in-out;
   animation-timing-function: ease-in-out;
   -webkit-transform-origin: 170px 170px;
   transform-origin: 170px 170px;
   will-change: transform;
}

circle:nth-of-type(1) {
   stroke-dasharray: 550px;
}

circle:nth-of-type(2) {
   stroke-dasharray: 500px;
}

circle:nth-of-type(3) {
   stroke-dasharray: 450px;
}

circle:nth-of-type(4) {
   stroke-dasharray: 300px;
}

circle:nth-of-type(1) {
   -webkit-animation-delay: -0.15s;
   animation-delay: -0.15s;
}

circle:nth-of-type(2) {
   -webkit-animation-delay: -0.3s;
   animation-delay: -0.3s;
}

circle:nth-of-type(3) {
   -webkit-animation-delay: -0.45s;
   animation-delay: -0.45s;
}

circle:nth-of-type(4) {
   -webkit-animation-delay: -0.6s;
   animation-delay: -0.6s;
}

@-webkit-keyframes preloader {
   50% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
   }
}

@keyframes preloader {
   50% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
   }
}

/* 5. BUTTONS. ====================================================*/
.btn {
   display: inline-block;
   text-align: center;
   white-space: nowrap;
   vertical-align: middle;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   font-family: 'UTMHelve';
   border: none;
   letter-spacing: 1px;
}

.btn-custom {
   color: #FFF;
   transition: 0.9s;
   padding: 0.25rem 1rem;
   font-size: 0.60rem;
   background: #eb662d;
   border: solid 2px #eb662d;
}

.btn-custom:hover {
   color: #FFF;
   background: #3AB3DF;
   border: solid 2px #3AB3DF;
}

.btn-custom:focus,
.btn-custom.focus {
   box-shadow: none;
}

.btn-custom.disabled,
.btn-custom:disabled {
   color: #fff;
   background-color: #3AB3DF;
   border-color: #3AB3DF;
}

.btn-custom:not(:disabled):not(.disabled):active,
.btn-custom:not(:disabled):not(.disabled).active,
.show>.btn-custom.dropdown-toggle {
   color: #fff;
   background-color: none;
   border-color: none;
}

.btn-custom:not(:disabled):not(.disabled):active:focus,
.btn-custom:not(:disabled):not(.disabled).active:focus,
.show>.btn-custom.dropdown-toggle:focus {
   box-shadow: none;
}

a.btn-slider {
   display: inline-block;
   text-decoration: none;
   color: #FFF;
   font-weight: bold;
   font-size: 14px;
   position: relative;
   padding: 0.5rem 2rem;
   overflow: hidden;
   transition: 0.3s ease;
   margin-bottom: 0px;
   font-family: 'UTMHelve';
   background-color: #eb662d;
}

a.btn-slider:before {
   content: '';
   display: block;
   height: 100%;
   width: 100%;
   border-bottom: 2px solid #eb662d;
   border-left: 2px solid #eb662d;
   position: absolute;
   left: 0;
   bottom: 0;
   transition: 0.3s ease;
}

a.btn-slider:after {
   content: '';
   display: block;
   height: 100%;
   width: 100%;
   border-top: 2px solid #eb662d;
   border-right: 2px solid #eb662d;
   position: absolute;
   right: 0;
   top: 0;
   transition: 0.3s ease;
}

a.btn-slider:hover:before,
a.btn-slider:hover:after {
   width: 1rem;
   height: 1rem;
   border-color: #FFF;
}

a.btn-slider:focus,
.a.btn-slide.focus {
   box-shadow: none;
}

a.btn-slider.disabled,
.a.btn-slide:disabled {
   color: #fff;
   background-color: #3AB3DF;
   border-color: #3AB3DF;
}

.btn-reply {
   color: #FFF;
   transition: 0.9s;
   padding: 4px 10px;
   font-size: 0.60rem;
   background: #eb662d;
   border: solid 2px #eb662d;
   font-size: 13px;
   border-radius: 0px;
   position: absolute;
   right: 0;
}

.btn-reply:hover {
   color: #FFF;
   background: #3AB3DF;
   border: solid 2px #3AB3DF;
}

.btn-reply:focus,
.btn-reply.focus {
   box-shadow: none;
}

.btn-reply.disabled,
.btn-reply:disabled {
   color: #fff;
   background-color: #3AB3DF;
   border-color: #3AB3DF;
}

.btn-reply:not(:disabled):not(.disabled):active,
.btn-reply:not(:disabled):not(.disabled).active,
.show>.btn-reply.dropdown-toggle {
   color: #fff;
   background-color: none;
   border-color: none;
}

.btn-reply:not(:disabled):not(.disabled):active:focus,
.btn-reply:not(:disabled):not(.disabled).active:focus,
.show>.btn-reply.dropdown-toggle:focus {
   box-shadow: none;
}

.btn-booking {
   color: #FFF;
   transition: 0.9s;
   padding: 0.375rem 0.70rem;
   font-size: 0.60rem;
   background: #eb662d;
   border: solid 2px #eb662d;
   font-size: 13px;
   border-radius: 20px;
   text-transform: none;
}

.btn-booking:hover {
   color: #FFF;
   background: #e95516;
   border: solid 2px #e95516;
}

.btn-booking:focus,
.btn-reply.focus {
   box-shadow: none;
}

.btn-booking.disabled,
.btn-booking:disabled {
   color: #fff;
   background-color: #EF8354;
   border-color: #EF8354;
}

.btn-booking:not(:disabled):not(.disabled):active,
.btn-booking:not(:disabled):not(.disabled).active,
.show>.btn-booking.dropdown-toggle {
   color: #fff;
   background-color: none;
   border-color: none;
}

.btn-booking:not(:disabled):not(.disabled):active:focus,
.btn-booking:not(:disabled):not(.disabled).active:focus,
.show>.btn-booking.dropdown-toggle:focus {
   box-shadow: none;
}

/* 6. HEADER. ====================================================*/
.top-header {
   background-color: #78C700;
   min-height: 52px;
   width: 100%;
   clear: both;
   top: 0;
   z-index: 99;
}

.top-header .container {
   padding: 0px;
}

.top-header p {
   margin-bottom: 0px;
   color: #fff;
   font-size: 14px;
}

.header-left {
   float: left;
   margin-bottom: 5px;
   background-color: #3AB3DF;
   width: 680px;
   margin-left: -450px;
   text-align: right;
   padding: 10px 20px 12px 0px;
}

.header-left p::before {
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   content: "\f095";
   margin-right: 10px;
}

.header-left strong {
   font-weight: 600;
}

.header-right {
   float: right;
   padding: 5px 0px;
}

.ht-right-email {
   display: inline-block;
   margin-right: 10px;
   border-right: 1px solid rgba(255, 255, 255, 0.5);
   padding-right: 15px;
}

.ht-right-email p::before {
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   content: "\f0e0";
   margin-right: 10px;
}

.ht-right-social {
   display: inline-block;
   margin-right: 10px;
   color: #FFF;
   font-size: 15px;
}

header {
   position: relative;
   height: 100%;
   z-index: 100;
}

header .container {
   margin: auto;
}

/* 7. FOOTER. ====================================================*/
footer {
   background-color: #467A21; color: #fff;
}



.fi-fas {
   float: left;
   margin-right: 15px;
   color: #3AB3DF;
   line-height: 0.5;
   margin-bottom: 10px;
}

.fi-fas .fas {
   font-size: 14px;
}

.span-fi {
   clear: both;
   margin: 20px 0px;
}

.span-fi p {
   font-size: 13px;
}

.media-post {
   clear: both;
   height: 70px;
}

.media-thumb {
   width: 70px;
   float: left;
   margin-right: 15px;
}

.media-thumb img {
   width: 100%;
}

.media-caption h5 {
   color: #FFF;
   font-size: 14px;
   line-height: 1.3;
}

.media-caption p {
   margin-top: -5px;
   font-size: 13px;
}


.popular-links ul li {
   font-family: 'UTMHelve';
   color: #FFF;
   font-size: 14px;
   font-weight: 400;
   line-height: 2.5;
   list-style-type: none;
}

.popular-links ul li:before {
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   content: "\f101";
   margin-right: 10px;
}

.gb-photos {
   padding: 3px;
}

.gb-photos img {
   width: 100%;
}


.fb-copyright {
   float: left;
}

.fb-copyright p {
   color: #FFF;
   font-size: 14px;
}

.fb-social {
   float: right;
   color: #FFF;
   font-size: 15px;
}

.span-fb-social {
   display: inline-block;
   margin-right: 20px;
}

.last-box {
   margin-right: 0px;
}

/* 8. PAGES STYLES. ====================================================*/
.sections {
   background-image: url("../img/images/pages-bg.jpg");
   height: 500px;
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
   position: relative;
}

.sections:before {
   content: '';
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   background-image: linear-gradient(to bottom right, #3AB3DF, #3AB3DF);
   opacity: 0.6;
}

.sections .container {
   margin: 0px auto;
}

.pages-title {
   position: absolute;
   bottom: 30px;
   color: #FFF;
}

.pages-title span {
   font-weight: 600;
   font-size: 2rem;
}

.pages-title h1 {
   font-size: 1rem;
   color: #FFF;
   font-weight: 400;
   margin-bottom: 5px;
}

.pages-title p {
   color: #FFF;
}

.breadcrumb {
   background: transparent;
   padding: 0px;
   position: relative;
}

.breadcrumb li {
   display: inline-block;
   float: left;
   font-size: 16px;
   font-family: 'UTMHelve';
   color: #FFF;
}

.breadcrumb li::after {
   display: inline-block;
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   content: "\f054";
   margin: 10px;
   color: #FFF;
   font-size: 14px;
   line-height: 2;
   margin: 0 0.80rem;
}

.breadcrumb li:last-of-type::after {
   display: none;
}

.breadcrumb li.current {
   margin-top: 2px;
}

.section-title {
   width: 50%;
   margin: auto auto 1.7rem;
   text-align: center;
}

.section-title h2 {
   margin-bottom: 5px;
   font-weight: 600;
}

.section-title h2:after {
   background: #3AB3DF;
   content: '';
   display: block;
   height: 5px;
   margin: 15px auto;
   width: 80px;
}

.section-title p {
   line-height: 1.8;
}

/* 31. SCROLLING TOP. ====================================================*/
@media only screen and (min-width: 1024px) {
   main p {
      font-size: 20px;
      font-size: 1.25rem;
   }
}

.cd-top {
   display: inline-block;
   height: 40px;
   width: 40px;
   position: fixed;
   bottom: 40px;
   right: 10px;
   overflow: hidden;
   text-indent: 100%;
   white-space: nowrap;
   background: #8dc63f url(../images/icon/arrow_to_top_icon.svg) no-repeat center 50%;
   visibility: hidden;
   border-radius: 50%;
   z-index: 4;
}

.cd-top.cd-is-visible,
.cd-top.cd-fade-out,
.no-touch .cd-top:hover {
   -webkit-transition: opacity .3s 0s, visibility 0s 0s;
   -moz-transition: opacity .3s 0s, visibility 0s 0s;
   transition: opacity .3s 0s, visibility 0s 0s;
}

.cd-top.cd-is-visible {
   /* the button becomes visible */
   visibility: visible;
   opacity: 1;
}

.cd-top.cd-fade-out {
   /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
   opacity: .5;
}

.no-touch .cd-top:hover {
   background-color: #3AB3DF;
}

@media only screen and (min-width: 768px) {
   .cd-top {
      right: 20px;
      bottom: 20px;
   }
}

@media only screen and (min-width: 1024px) {
   .cd-top {
      height: 60px;
      width: 60px;
      right: 30px;
      bottom: 30px;
   }
}

/* 32. SLIDER. ====================================================*/
.home-slider {
   width: 100%;
   position: relative;
   z-index: 2;
}

.carousel-item {
   height: 900px;
   min-height: 350px;
   background: no-repeat center center scroll;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

.carousel-item:before {
   content: '';
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   background-image: linear-gradient(to bottom right, #000, #000);
   opacity: 0.2;
}

.carousel-item .container {
   margin: 0rem auto;
}

.slider-caption {
   position: absolute;
   top: 40%;
   text-align: left;
}

.slider-caption h2 {
   font-weight: 400;
}

.slider-caption span {
   font-weight: 700;
   text-transform: uppercase;
   font-style: normal;
}

.display-4 {
   color: #FFF;
   font-size: 2.5rem;
   line-height: 1.2;
}

.lead {
   color: #FFF;
   font-size: 18px;
   font-weight: 300;
   width: 70%;
}

.animated {
   -webkit-animation-duration: 1.5s;
   animation-duration: 1.5s;
}

@-webkit-keyframes fadeInRight {
   from {
      opacity: 0;
      -webkit-transform: translate3d(100px, 0, 0);
      transform: translate3d(100px, 0, 0);
   }

   to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
   }
}

@keyframes fadeInRight {
   from {
      opacity: 0;
      -webkit-transform: translate3d(100px, 0, 0);
      transform: translate3d(100px, 0, 0);
   }

   to {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
   }
}

.fadeInRight {
   -webkit-animation-name: fadeInRight;
   animation-name: fadeInRight;
}

.carousel-control-prev,
.carousel-control-next {
   position: absolute;
   top: 10%;
   bottom: 0;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
   display: inline-block;
   width: 40px;
   height: 40px;
   background: transparent no-repeat center center;
   background-size: 50% 50%;
   background-color: #35414b;
}

.carousel-control-prev-icon {
   background-image: url("../img/master/left-arrow.svg");
}

.carousel-control-next-icon {
   background-image: url("../img/master/right-arrow.svg");
}

.carousel-indicators li {
   box-sizing: content-box;
   -ms-flex: 0 1 auto;
   flex: 0 1 auto;
   width: 40px;
   height: 4px;
   margin-right: 3px;
   margin-left: 3px;
   text-indent: -999px;
   cursor: pointer;
   background-color: #fff;
   background-clip: padding-box;
   border-top: 10px solid transparent;
   border-bottom: 10px solid transparent;
   opacity: .5;
   transition: opacity 0.6s ease;
}

.carousel-indicators .active {
   opacity: 1;
   background-color: #EEC344;
}

.btn-more {
   margin-top: 1.5rem;
}

/* 33. HOME PAGE ONE. ====================================================*/
.front-layers {
   background-color: #FFF;
   box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
   margin-top: -180px;
   z-index: 3;
   position: relative;
}

.front-layers .row {
   margin: 0px;
}

.thumbnail-col {
   background-image: url("../img/images/gallery5.jpg");
   height: 285px;
   background-repeat: no-repeat;
   background-size: cover;
   position: relative;
}

.thumbnail-col:before {
   content: '';
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   background-image: linear-gradient(to bottom right, #3AB3DF, #3AB3DF);
   opacity: 0.6;
}

.info-layer {
   position: absolute;
   bottom: 20px;
   left: 20px;
   z-index: 1;
   width: 100%;
}

.if-icon {
   width: 60px;
   height: 60px;
   float: left;
   margin-right: 10px;
}

.if-icon img {
   width: 100%
}

.if-caption {
   width: auto;
}

.if-caption h4 {
   color: #FFF;
   font-weight: 400;
   line-height: 1.2;
}

.if-caption span {
   font-weight: 600;
}

.layer-col {
   padding: 2rem 1.5rem;
   background-color: #FFF;
}

.layer-col .span-schedule {
   margin-top: 20px;
}

.layer-col .span-schedule .list-group-item {
   position: relative;
   display: block;
   padding: 0.50rem 0rem;
   margin-bottom: -1px;
   background-color: #fff;
   font-family: 'UTMHelve';
   font-size: 14px;
   font-weight: 500;
   color: #516163;
}

.layer-col .span-schedule .list-group-item .badge {
   display: inline-block;
   padding: 5px 10px;
   font-size: 100%;
   font-weight: 700;
   line-height: 1;
   text-align: center;
   white-space: nowrap;
   vertical-align: baseline;
   border-radius: 5px;
   float: right;
   font-family: 'UTMHelve';
   background: transparent;
   color: #516163;
   font-weight: 400;
}

.layer-col .span-schedule .list-group-item a {
   color: #516163;
   text-decoration: none;
   transition: 0.6s;
}

.layer-col .span-schedule .list-group-item a:hover {
   color: #3AB3DF;
   text-decoration: none;
}

.form-col {
   padding: 2rem 1.5rem;
   background-color: #3AB3DF;
}

.form-col .row .col-md-6 {
   padding: 0px;
   padding-right: 10px;
}

.form-col h3 {
   margin-bottom: 1rem;
   color: #FFF;
}

.layer-contact {
   display: block;
   width: 100%;
   height: calc(1.5rem + 2px);
   padding: 0.375rem 0.75rem;
   font-size: 13px;
   font-family: 'UTMHelve';
   font-weight: 400;
   line-height: 1.5;
   color: #495057;
   background-color: #F7FAFA;
   background-clip: padding-box;
   border: none;
   border-radius: 0.25rem;
   transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   margin: 3px 0px;
   transition: 0.6s;
   border-radius: 0px;
   border-radius: 20px;
}

.layer-contact::-ms-expand {
   background-color: transparent;
   border: 0;
}

.layer-contact:focus {
   color: #FFF;
   background-color: #e0ebeb;
   border-color: none;
   outline: 0;
   box-shadow: none;
}

.home-about {
   padding-right: 1rem;
}

.home-about h2 {
   line-height: 1.2;
   margin-bottom: 1rem;
}

.home-about strong {
   font-weight: 600;
}

.home-about p {
   margin-bottom: 1.5rem;
}

.home-about h5::before {
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   content: "\f58d";
   color: #3AB3DF;
   margin-right: 10px;
}

.home-about h5 {
   color: #DDD;
}

.home-about-img img {
   width: 100%;
}

.ha-bullets p {
   margin-bottom: 0px;
   line-height: 2.5;
}

.bullets-left p::before {
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   content: "\f00c";
   color: #3AB3DF;
   margin-right: 10px;
}

.bullets-right p::before {
   font-family: "Font Awesome 5 Free";
   font-weight: 900;
   content: "\f00c";
   color: #3AB3DF;
   margin-right: 10px;
}

.bullets-left {
   float: left;
}

.bullets-right {
   float: right;
}

.signature-alt {
   width: 150px;
}

.signature-alt img {
   width: 100%;
   margin-top: 1rem;
}

.services-carousel .slide .service-box {
   margin: 10px;
}

.parallax-section {
   background-image: url("../img/images/img65.jpg");
   height: 500px;
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
   position: relative;
}

.parallax-section:before {
   content: '';
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   background-image: linear-gradient(to bottom right, #FFF, #FFF);
   opacity: 0.3;
}

.parallax-label {
   background-color: #FFF;
   border-left: solid 5px #3AB3DF;
   margin: 0;
   position: absolute;
   top: 50%;
   -ms-transform: translateY(-50%);
   transform: translateY(-50%);
   max-width: 600px;
   padding: 2rem;
   box-shadow: 0 0 10px rgba(204, 204, 204, 0.6);
   -moz-box-shadow: 0 0 10px rgba(204, 204, 204, 0.6);
   -webkit-box-shadow: 0 0 10px rgba(204, 204, 204, 0.6);
   -o-box-shadow: 0 0 10px rgba(204, 204, 204, 0.6);
}

.parallax-label h2 {
   font-style: italic;
}

.parallax-label p {
   margin-bottom: 1rem;
}