
:root {
  --ibg-dark: #fff1de;    /* --ibg-dark: #fcf1db;  */
  --ibg-light: #fffdf5;   /* --ibg-light: #fffbf1; */
  
  --l-blue: #1db8ff;
  --m-blue: #1794d1;
  --d-blue: #0076c4;
  --b-blue: #0e5a98;
}

body {
  overflow-x: hidden;
  font-family: 'Roboto Slab', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
}

/*p {font-family: Montserrat, sans-serif; font-size: 14px; letter-spacing: 0px; color: #303030; font-weight: 100; line-height: 1.75;}*/

p {font-size: 18px; line-height: 24px; margin-top: 0; margin-bottom: 20px; font-weight: 400; color: #303030; font-family: 'Fira Sans Condensed', sans-serif; letter-spacing: 0px;}
 .textLeft {text-align: left;}
 .textRight {text-align: right;}
 .textCenter {text-align: center;}
 .textjustify {text-align: justify;}

li {font-size: 18px; line-height: 20px; margin-top: 0; margin-bottom: 10px; font-weight: 400; color: #303030; font-family: 'Fira Sans Condensed', sans-serif; letter-spacing: 0px; padding:0px; text-align: left;}

 .textLeft {text-align: left;}
 .textRight {text-align: right;}
 .textCenter {text-align: center;}
 .textjustify {text-align: justify;}

 .text-danger {font-size: 10px; line-height: 12px; color: #F00;}
 .help-block {font-size: 10px; line-height: 12px; color: #F00;}
 

/*#news1Text p {font-size: 16px; line-height: 22px;}*/

#news1Modal p, #news2Modal p, #news3Modal p,
#news1Modal li, #news2Modal li, #news3Modal li {font-size: 16px; line-height: 22px; padding:0px;}

/*#newsModal p {font-size: 16px; line-height: 22px;}*/
/*#newsModal li {font-size: 16px; line-height: 22px; padding-top:0px; padding-bottom:0px; margin-top:0px; margin-bottom:0px;}*/

section#news img {display: block; opacity: 1; transition: opacity ease-out 0.3s; transform: scale(1, 1); -webkit-transition: all 1s; transition: all 1s;}
section#news img:hover {-webkit-transition: all ease 0.3s; transition: all ease 0.3s; opacity: 0.6;}

section#about img:hover {transform: scale(1.1, 1.1); opacity: 1; -webkit-transition: all ease 0.3s; transition: all ease 0.3s;}
.newsImg {opacity: .1; background-color:#093;}

section#news p {opacity: .8;}

a {color: #69F;}
a:hover {color: #36F;}
.text-primary {color: #fed136 !important;}

h1, h4, h5, h6         {font-weight: 100; font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}

h2 {font-size: 32px; margin-top: 0; margin-bottom: 20px; text-align: center; font-weight: 700; color: #069; font-style:italic; font-family: 'Fira Sans Condensed'}
h3 {font-size: 16px; margin-top: 0; margin-bottom: 20px; text-align: center; font-weight: 600; color: #666; font-style: italic; font-family: 'Merriweather', serif; line-height: 1.5;}

@media (min-width: 576px) {h2 {font-size: 32px;} h3 {font-size: 18px;}}
@media (min-width: 768px) {h2 {font-size: 34px;} h3 {font-size: 20px;}}
@media (min-width: 992px) {h2 {font-size: 37px;} h3 {font-size: 23px;}}
@media (min-width: 1200px) {h2 {font-size: 40px;} h3 {font-size: 26px;}}



section h4.icons {font-size: 22px; margin-top: 10px; margin-bottom: 10px; text-align: center; font-weight: 900; color: #069; font-family: 'Merriweather', serif; letter-spacing: 0px;}
/*section h4.icons {font-size: 22px; margin-top: 10px; margin-bottom: 10px; text-align: center; font-weight: 500; color: #808080; font-family: 'Fira Sans Condensed', sans-serif; letter-spacing: 0px;}*/


section h4.contactAddress {font-size: 25px; margin-top: 10px; margin-bottom: 20px; text-align: center; font-weight: 500; color: #ffffff; font-family: 'Fira Sans Condensed', sans-serif; letter-spacing: 0px;}
section h4.contactPhone {font-size: 32px; margin-top: 10px; margin-bottom: 20px; text-align: center; font-weight: 500; color: #ffffff; font-family: 'Fira Sans Condensed', sans-serif; letter-spacing: 0px;}


/* ---------------------- Section -------------------------------- */     
section {padding: 30px 0;}

@media (min-width: 768px) {section {padding: 50px 0;}}

/* ---------------------- Buttons -------------------------------- */     
.btn {font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; font-weight: 700;}
.btn-xl {font-size: 18px; padding: 20px 40px;}

.btn-primary {background-color: var(--m-blue); border-color: #6d4898;}
.btn-primary:active, .btn-primary:focus, .btn-primary:hover {background-color: var(--d-blue) !important; border-color: #fed136 !important; color: white;}
.btn-primary:active, .btn-primary:focus {-webkit-box-shadow: 0 0 0 0.2rem rgba(254, 209, 55, 0.5) !important; box-shadow: 0 0 0 0.2rem rgba(254, 209, 55, 0.5) !important;}

.btn-close-modal {position: absolute; top: 25px; right: 23px; width: 50px; height: 50px; cursor: pointer; z-index:500; opacity: 0.5 !important;}
.btn-close-modal:hover {opacity: .8 !important;;}


.btnReserve {font-size: 16px !important; padding: 11px !important;}

.btnReserveNow {color: #6c4797;}
.btnReserveNowHover {font-size: 23px; letter-spacing: 2px; border:none;}


/* ---------------------- Selection -------------------------------- */     
::selection {background: #fce6bb; text-shadow: none;}
img::selection {background: transparent;}
img::-moz-selection {background: transparent;}

/* ---------------------- Navigation Bar -------------------------------- */     
#mainNav {background-color: var(--d-blue); padding-top: 10px; padding-bottom: 10px; background-image:url(../logo/header-shadow.png);} /* Colapsed */  

#mainNav .navbar-toggler {font-size: 25px; right: 0; text-transform: uppercase; color: white; border: 0; background-color: var(--d-blue);}
#mainNav .navbar-toggler:hover {transform: scale(1.1, 1.1); opacity: 0.7;}
#mainNav .navbar-toggler {-webkit-transition: all 0.3s; transition: all 0.1s;}

.ekontOffice:hover {transform: scale(1.01, 1.01); opacity: 0.9;}
.ekontOffice {-webkit-transition: all 0.3s; transition: all 0.1s;}


#mainNav .navbar-reserve {font-size: 15px; right: 0; padding: 8px 10px; text-transform: uppercase; color: white; border: 0; background-color: #a36229;}
#mainNav .navbar-reserve:hover {transform: scale(1.1, 1.1); opacity: 0.7;}
#mainNav .navbar-reserve {-webkit-transition: all 0.3s; transition: all 0.1s;}

#mainNav .navbar-brand:hover {transform: scale(1.1, 1.1); opacity: 0.7;}
#mainNav .navbar-brand {-webkit-transition: all 0.3s; transition: all 0.3s;}

#mainNav .navbar-nav .nav-item .nav-link {font-size: 100%; font-weight: 400; padding: 0.75em 0; letter-spacing: 1px; color: #faf2eb; text-shadow: 0px 0px #000;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}

.dropdown-item {font-size: 90%; font-weight: 400; padding: 0.2em 1em; letter-spacing: 1px; color: #000000;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}


#mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover {color: #fed136;} /* Menu active color */


@media (min-width: 992px) { /* Full */
  #mainNav {padding-top: 10px; padding-bottom: 20px; -webkit-transition: padding-top 0.3s, padding-bottom 0.3s; transition: padding-top 0.3s, padding-bottom 0.3s; border: none; background-image:url(../logo/header-shadow.png); background-color:transparent;}
  #mainNav .navbar-brand {-webkit-transition: all 0.3s; transition: all 0.3s; padding-top:15px;}
  #mainNav .navbar-nav .nav-item .nav-link {padding-top: 1.3em; padding-bottom: 0.9em; padding-left: .4em; padding-right: .4em; !important;}
  #mainNav.navbar-shrink {padding-top: 0px; padding-bottom: 10px; background-color: var(--m-blue);}
  #mainNav .navbar-brand:hover {transform: scale(1.1, 1.1); opacity: 0.7;}
  #mainNav .navbar-shrink .navbar-brand {font-size: 1.25em;}
}
@media (min-width: 1200px) {
  #mainNav .navbar-nav .nav-item .nav-link { padding-top:20px; padding-left: .9em; padding-right: .9em; !important;}
  #mainNav {padding-top: 10px; padding-bottom: 20px; -webkit-transition: padding-top 0.3s, padding-bottom 0.3s; transition: padding-top 0.3s, padding-bottom 0.3s; border: none; background-image:url(../logo/header-shadow.png); background-color:transparent;}
}


/* ---------------------- Header -------------------------------- */     

  
  .photoc-x {background-image:url('../img/top-4.jpg');}

  .containerHeaderCarousel {z-index: 20; background-color: var(--ibg-light);}
  .containerTopLogo {padding: 30px 0px; z-index: 21; position:absolute; top: 0;}

  .headerLogo {position: absolute; top: 10%; left: 10%;}
                              .headerLogo {width:80%; height: auto; margin-top:50px; margin-left:10px;  margin-right:10px; position: absolute; top: 8%;}}
  @media (min-width: 576px)  {.headerLogo {width:80%; height: auto; margin-top:50px; margin-left:10px;  margin-right:10px; position: absolute; top: 8%;}}
  @media (min-width: 768px)  {.headerLogo {width:350px; height: auto; margin-top:10%; margin-left:10%; position: absolute; top: 10%; left: 10%;}}
  @media (min-width: 992px)  {.headerLogo {width:500px; height: auto; margin-top:10%; margin-left:10%; position: absolute; top: 10%; left: 10%;}}
  @media (min-width: 1200px) {.headerLogo {width:550px; height: auto; margin-top:10%; margin-left:10%; position: absolute; top: 5%; left: 10%;}}

  .headerLogo       {display: block; opacity: 1; transition: opacity ease-out 1s; transform: scale(1, 1); -webkit-transition: all 1s; transition: all 1s;}
  .headerLogo:hover {display: block; opacity: .8; opacity ease-in 1s; transform: scale(1.05, 1.05);        -webkit-transition: all 1s; transition: all 1s;}

/*
  #headerCarousel.carousel-fade.carousel-item {display: block; opacity: 0; transition: opacity ease-out 2s;}
  #headerCarousel.carousel-fade.carousel-item.active {display: block; opacity: 1; opacity ease-in 2s;}
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {z-index: 0; opacity: 0; transition: 2s 2s opacity;}



  .carousel-fade .active.carousel-item-left,
  .carousel-fade .active.carousel-item-right {transition: 1s 0s opacity;}
*/

  .headerCarouselCaption {position: absolute; right:5%; left:5%; bottom: 20px; z-index: 10; padding-top: 20px; padding-bottom: 20px; color: #fff; text-align: center;}

#headerCarousel .carousel-item {height: 100vh; min-height: 350px; background: no-repeat center center scroll; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;}



/* Animate Header Carousel background  ------------------------------------------------------------- */

  .headerTitle {font-size:24px; line-height:1.5; text-shadow:1px 1px 4px black; color:#FFF; font-weight:700; opacity: .8;}
  @media (min-width: 576px)  {.headerTitle {font-size: 40px;}}
  @media (min-width: 768px)  {.headerTitle {font-size: 48px;}}
  @media (min-width: 992px)  {.headerTitle {font-size: 56px;}}
  @media (min-width: 1200px) {.headerTitle {font-size: 48px;}}



.image1 {background-image: url("../img/top-1.jpg"); background-size: cover; background-position: center center;}
  @media (min-width: 576px)  {.image1 {background-image: url("../img/top-2.jpg"); background-size: cover; background-position: center center;}}
  @media (min-width: 768px)  {.image1 {background-image: url("../img/top-3.jpg"); background-size: cover; background-position: center center;}}
  @media (min-width: 992px)  {.image1 {background-image: url("../img/top-4.jpg"); background-size: cover; background-position: center center;}}
  @media (min-width: 1200px) {.image1 {background-image: url("../img/top-5.jpg"); background-size: cover; background-position: center center;}}




.image2 {background-image: url("../img/top-5.jpg");  background-size: cover; background-position: center center;}
.image3 {background-image: url("../img/top-9.jpg");  background-size: cover; background-position: center center;}
.image4 {background-image: url("../img/top-11.jpg"); background-size: cover; background-position: center center;}
.image5 {background-image: url("../img/top-15.jpg"); background-size: cover; background-position: center center;}

.wrap {display: inline-block; width: 100%; height: 100%; float: left; overflow: hidden;}
.bg {positon: absolute; width: 100%; height: 100%; top: 0px; left: 0px;}

@-webkit-keyframes zoom-b {0% {-ms-transform: scale(1, 1); transform: scale(1, 1) translateZ(1px);}	100% {-ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) translateZ(1px);}}
@-moz-keyframes zoom-b    {0% {-ms-transform: scale(1, 1); transform: scale(1, 1) translateZ(1px);}	100% {-ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) translateZ(1px);}}
@-o-keyframes zoom-b      {0% {-ms-transform: scale(1, 1); transform: scale(1, 1) translateZ(1px);}	100% {-ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) translateZ(1px);}}
@keyframes zoom-b         {0% {-ms-transform: scale(1, 1); transform: scale(1, 1) translateZ(1px);}	100% {-ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) translateZ(1px);}}
.type-b {
  -webkit-animation: zoom-b 10s linear infinite alternate; /* Safari 4+ */
  -moz-animation:    zoom-b 10s linear infinite alternate; /* Fx 5+ */
  -o-animation:      zoom-b 10s linear infinite alternate; /* Opera 12+ */
  animation:         zoom-b 10s linear infinite alternate; /* IE 10+, Fx 29+ */
}

@-webkit-keyframes zoom-c {0% {-ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) translateZ(1px);}	100% {-ms-transform: scale(1, 1); transform: scale(1, 1) translateZ(1px);}}
@-moz-keyframes zoom-c    {0% {-ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) translateZ(1px);}	100% {-ms-transform: scale(1, 1); transform: scale(1, 1) translateZ(1px);}}
@-o-keyframes zoom-c      {0% {-ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) translateZ(1px);}	100% {-ms-transform: scale(1, 1); transform: scale(1, 1) translateZ(1px);}}
@keyframes zoom-c         {0% {-ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1) translateZ(1px);}	100% {-ms-transform: scale(1, 1); transform: scale(1, 1) translateZ(1px);}}
.type-c {
  -webkit-animation: zoom-c 10s linear infinite alternate; /* Safari 4+ */
  -moz-animation:    zoom-c 10s linear infinite alternate; /* Fx 5+ */
  -o-animation:      zoom-c 10s linear infinite alternate; /* Opera 12+ */
  animation:         zoom-c 10s linear infinite alternate; /* IE 10+, Fx 29+ */
}


/*
@-webkit-keyframes zoom-a {0% { background-size: 100% auto;} 100% { background-size: 120% auto; }}
@-moz-keyframes zoom-a    {0% { background-size: 100% auto;} 100% { background-size: 120% auto; }}
@-o-keyframes zoom-a      {0% { background-size: 100% auto;} 100% { background-size: 120% auto; }}
@keyframes zoom-a         {0% { background-size: 100% auto;} 100% { background-size: 120% auto; }}

.type-a {
  -webkit-animation: zoom-a 10s linear infinite alternate; 
  -moz-animation:    zoom-a 10s linear infinite alternate; 
  -o-animation:      zoom-a 10s linear infinite alternate; 
  animation:         zoom-a 10s linear infinite alternate; 
}
*/

/* Animate Header Carousel background  --  end  ----------------------------------------------------------- */



  .headerShadow {position: absolute; top: 0%; left: 0px; width: 100%; height: 125px; margin-top: 0px; margin-left:0px; z-index:-100;}


  .headerTitle {font-size:24px; line-height:1.5; text-shadow:1px 1px 4px black; color:#FFF; font-weight:700; opacity: .8;}
  @media (min-width: 576px)  {.headerTitle {font-size: 40px;}}
  @media (min-width: 768px)  {.headerTitle {font-size: 48px;}}
  @media (min-width: 992px)  {.headerTitle {font-size: 56px;}}
  @media (min-width: 1200px) {.headerTitle {font-size: 48px;}}

.waterDesc:hover {transform: scale(1.01, 1.01); opacity: .8;}
.waterModal .modal-content button:hover {transform: scale(1.1, 1.1); opacity: 1;}
.waterModal .modal-content button {-webkit-transition: all 0.3s; transition: all 0.1s;  opacity: 0.5;}


.vcenter {margin-top:80px; margin-bottom:auto;}



header.masthead {text-align: center; color: white; background-image: url("../img/header-bg.jpg"); background-repeat: no-repeat; background-attachment: scroll; background-position: center center; background-size: cover;}

header.masthead .intro-text {padding-top: 150px; padding-bottom: 100px;}
header.masthead .intro-text .intro-lead-in {font-size: 22px; font-style: italic; line-height: 22px; margin-bottom: 25px;
  font-family: 'Droid Serif', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}

header.masthead .intro-text .intro-heading {font-size: 50px; font-weight: 700; line-height: 50px; margin-bottom: 25px;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}

@media (min-width: 768px) {
  header.masthead .intro-text {padding-top: 300px; padding-bottom: 200px;}
  header.masthead .intro-text .intro-lead-in {font-size: 40px; font-style: italic; line-height: 40px; margin-bottom: 25px;
    font-family: 'Droid Serif', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}
  header.masthead .intro-text .intro-heading {font-size: 75px; font-weight: 700; line-height: 75px; margin-bottom: 50px;
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}
}

/* ---------------------- About -------------------------------- */     

h2 {text-align: center !important;}
h4 {text-align: center !important;}
/*p {text-align: center !important;} */

@media (min-width: 768px) {
#missionText. h2 {text-align: left !important;}
#missionText. h4 {text-align: left !important;}
#missionText. p {text-align: left !important;}
}

.missionVideoContainer {padding: 0px; margin: 0px;}
#missionVideo {padding: 0px; margin: 0px;}


.service-heading {
  margin: 15px 0;
  text-transform: none;
}
/*
#gallery .gallery-item {right: 0; margin: 0 0 15px;}
#gallery .gallery-item .gallery-link {position: relative; display: block; max-width: 400px; margin: 0 auto; cursor: pointer;}
#gallery .gallery-item .gallery-link .gallery-hover {position: absolute; width: 100%; height: 100%; -webkit-transition: all ease 0.1s; transition: all ease 0.1s; opacity: 0; background: rgba(254, 209, 54, 0.9);}
#gallery .gallery-item .gallery-link .gallery-hover:hover {opacity: .5;}
#gallery .gallery-item .gallery-link .gallery-hover .gallery-hover-content {font-size: 20px; position: absolute; top: 50%; width: 100%; height: 20px; margin-top: -12px; text-align: center; color: white;}
#gallery .gallery-item .gallery-link .gallery-hover .gallery-hover-content i {margin-top: -12px;}
#gallery .gallery-item .gallery-link .gallery-hover .gallery-hover-content h3,
#gallery .gallery-item .gallery-link .gallery-hover .gallery-hover-content h4 {margin: 0;}
#gallery .gallery-item .gallery-caption {max-width: 400px; margin: 0 auto; padding: 25px; text-align: center; background-color: #fff;}
#gallery .gallery-item .gallery-caption h4 {margin: 0; text-transform: none;}
#gallery .gallery-item .gallery-caption p {font-size: 16px; font-style: italic; margin: 0;
  font-family: 'Droid Serif', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}
#gallery * {z-index: 2;}
@media (min-width: 767px) {#gallery .gallery-item {margin: 0 0 30px;}}
/*

/* Water Modal ---------------------------------------------------------------------------------------------------------------------- */
.waterModal {text-align: center; padding: 0!important;}
.waterModal .modal-dialog {margin-left: auto; margin-right: auto; padding-right: 0px; max-width: 90vmin; max-height: 90vmin;}
.waterModal .modal-content {margin:0px; padding:0px;  display: block; margin:auto; background-color:var(--ibg-dark);}
.waterModal .modal-body img {margin:10px; max-width:80vmin; max-height:80vmin; display: block; margin-left:auto; margin-right:auto;}
.waterDesc:hover {transform: scale(1.01, 1.01); opacity: .8;}
.waterModal .modal-content button:hover {transform: scale(1.1, 1.1); opacity: 1;}
.waterModal .modal-content button {-webkit-transition: all 0.3s; transition: all 0.1s;  opacity: 0.5;}
.waterModal .close-modal {position: absolute; top: 25px; right: 25px; width: 50px; height: 50px; cursor: pointer; background-color: "";}
.waterModal .close-modal:hover {opacity: 0.3;}

.waterModalClose {position:absolute; top:10px; right:10px; z-index:300; filter: invert(40%)}


/* Conditions Modal ---------------------------------------------------------------------------------------------------------------------- */

.ekontLocatorModal .modal-dialog {margin-left: auto; margin-right: auto; padding-right: 0px; width:100%; height:100vh; max-width: 100%; max-height: 100%;}
.ekontLocatorModal .modal-content {margin:0px; padding:0px;  display: block; margin:auto; background-color: var(--ibg-dark);}

.ekontLocatorModal .modal-body {max-height: 100vh; overflow-y: auto;	}
.ekontLocatorModal .modal-body {
   max-height: calc(100vh - 120px); // to adjust you can change 180px
   overflow-y: auto;
   }


.conditionsModal {text-align: center;}

.conditionsTitle {font-size:20px;}
.conditionsSubTitle {font-size:19px; font-weight:500; margin-bottom:5px;}

.conditionsModal .modal-dialog {margin-left: auto; margin-right: auto; padding-right: 0px; max-width: 100%; max-height: auto;}
@media (min-width: 576px)  {.conditionsModal .modal-dialog {max-width: 536px;} .conditionsTitle {font-size:23px;} .conditionsSubTitle {font-size:21px;}}
@media (min-width: 768px)  {.conditionsModal .modal-dialog {max-width: 728px;} .conditionsTitle {font-size:26px;} .conditionsSubTitle {font-size:23px;}}
@media (min-width: 992px)  {.conditionsModal .modal-dialog {max-width: 952px;} .conditionsTitle {font-size:28px;} .conditionsSubTitle {font-size:25px;}}
@media (min-width: 1200px) {.conditionsModal .modal-dialog {max-width: 1140x;} .conditionsTitle {font-size:30px;} .conditionsSubTitle {font-size:26px;}}
.conditionsModal .modal-content {margin:0px; padding:0px;  display: block; margin:auto; background-color: var(--ibg-dark);}
.conditionsModalClose {position:absolute; top:15px; right:15px; z-index:300; filter: invert(15%);}
.conditionsModalClose:hover {opacity: 0.7;}

/* -------------------------------------------------------------------------------------------------------------------------------------------------------- */
#galleryModal.container-fluid {padding: 0px; width: 100vw; height: 100vh; background-color: transparent;  align-items: center; padding-right: 0px !important; vertical-align:middle;}
#galleryCarousel.carousel {margin-left:15px; margin-right:15px; margin-top:15px; margin-bottom:10px; max-width:100vw; max-height:100hv; padding-right: 0px !important; vertical-align:middle;}
#galleryCarousel .carousel-inner img {width: auto; height: auto; max-height: calc(100vh - 30px); max-width: calc(100vw - 30px); vertical-align:middle; border-radius: 0.5rem; align-items: center;}
#galleryCarousel .carousel-control-prev-icon,
#galleryCarousel .carousel-control-next-icon {height: 40%; width: 40%; filter: opacity(70%);}
#galleryCarousel .carousel-control-close {position: absolute; top: 0; right: 0; z-index: 2; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: center;
  justify-content: center; width: 6%; height: 10.7%; color: #fff; text-align: center; opacity: 0.5; transition: opacity 0.15s ease;}
@media (prefers-reduced-motion: reduce) {#galleryCarousel .carousel-control-close {transition: none;}}
.carousel-control-close:hover, .carousel-control-close:focus {color: #fff; text-decoration: none; outline: 0; opacity: 0.9;}
.carousel-control-close-icon {display: inline-block; width: 40px; height: 40px; background: no-repeat 50% / 100% 100%;}
.carousel-control-close-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3e%3cpath d='M1.41 0l-1.41 1.41.72.72 1.78 1.81-1.78 1.78-.72.69 1.41 1.44.72-.72 1.81-1.81 1.78 1.81.69.72 1.44-1.44-.72-.69-1.81-1.78 1.81-1.81.72-.72-1.44-1.41-.69.72-1.78 1.78-1.81-1.78-.72-.72z'/%3e%3c/svg%3e");
}
 
/*--------------------------------------------------------------------------------------------------*/ 

.close-icon {display: inline-block; width: 25px; height: 25px; background: no-repeat 50% / 100% 100%;}
@media (min-width: 576px) {.close-icon {width: 30px; height: 30px;}}
@media (min-width: 768px) {.close-icon {width: 35px; height: 35px;}}
@media (min-width: 992px) {.close-icon {width: 40px; height: 40px;}}
@media (min-width: 1200px) {.close-icon {width: 50px; height: 50px;}}

/*
.close-icon {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 8 8'%3e%3cpath d='M1.41 0l-1.41 1.41.72.72 1.78 1.81-1.78 1.78-.72.69 1.41 1.44.72-.72 1.81-1.81 1.78 1.81.69.72 1.44-1.44-.72-.69-1.81-1.78 1.81-1.81.72-.72-1.44-1.41-.69.72-1.78 1.78-1.81-1.78-.72-.72z'/%3e%3c/svg%3e");}
*/
.close-icon {background-image: url(../img/x-8x.png);}



    carousel-control-close-icon {height: 80%; width: 80%; opacity(10%);}

    section#compliments {background-color: var(--ibg-dark); background-image:url(../img/bg-spa-2.png); background-repeat: no-repeat; background-position: center;}
    section#compliments .background-image {opacity: 0.2;}

    section#compliments .carousel.carousel-control-prev.icon {color: #036;}

	#bravoCarousel .carousel-indicators {filter: invert(60%)}

	#bravoCarousel .carousel-control-prev-icon,
	#bravoCarousel .carousel-control-next-icon {height: 40%; width: 40%; filter: invert(40%)}

	#headerCarousel .carousel-control-prev-icon,
	#headerCarousel .carousel-control-next-icon {height: 30%; width: 30%; filter: opacity(75%)}


section#mission {background-image: url("../img/top-12.jpg"); background-repeat: no-repeat; background-position: center;}
section#mission .section-heading {color: #fff;}

/* section#order {background-image: url("../img/top-3.jpg"); background-repeat: no-repeat; background-position: center;} */
section#contact .section-heading {color: #fff;}
section#contact .form-group {margin-bottom: 25px;}
section#contact .form-group input, 
section#contact .form-group textarea {padding: 10px;}
section#contact .form-group input.form-control {height: auto;}
section#contact .form-group textarea.form-control {height: 188px;}
section#contact .form-control:focus {border-color: #fed136; -webkit-box-shadow: none; box-shadow: none;}

/* section#contact {background-image: url("../img/top-3.jpg"); background-repeat: no-repeat; background-position: center;} */
section#order .section-heading {color: #fff;}

section#order .form-group {margin-top: 5px;}
section#order .form-group {margin-bottom: 5px;}

section#order .form-group input, 
section#order .form-group textarea {padding: 10px;}
section#order .form-group input.form-control {height: auto;}
section#order .form-group textarea.form-control {height: 88px;}
section#order .form-control:focus {border-color: #fed136; -webkit-box-shadow: none; box-shadow: none;}



/*
section#contact ::-webkit-input-placeholder {font-weight: 400; color: #333333;}
section#contact :-moz-placeholder {font-weight: 400; color: #333333;}
section#contact ::-moz-placeholder {font-weight: 400; color: #333333;}
section#contact :-ms-input-placeholder {font-weight: 400; color: #333333;}
*/
/*
section#contact ::-webkit-input-placeholder {font-weight: 400; color: #333333;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}
section#contact :-moz-placeholder {font-weight: 400; color: #333333;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}
section#contact ::-moz-placeholder {font-weight: 400; color: #333333;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}
section#contact :-ms-input-placeholder {font-weight: 400; color: #333333;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}
*/

footer {padding: 25px 0; text-align: center;}
footer span.copyright {font-size: 90%; line-height: 40px; text-transform: none;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}

footer ul.quicklinks {font-size: 90%; line-height: 40px; margin-bottom: 0; text-transform: none;
  font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';}

ul.social-buttons {margin-bottom: 0;}

ul.social-buttons li a {font-size: 20px; line-height: 50px; display: block; width: 50px; height: 50px; -webkit-transition: all 0.3s; transition: all 0.3s; color: white; border-radius: 100%; outline: none; background-color: #212529;}

ul.social-buttons li a:active, ul.social-buttons li a:focus, ul.social-buttons li a:hover {background-color: #fed136;}

    .bgi-dark {background-color: var(--ibg-dark);}
    .bgi-light {background-color: var(--ibg-light);}

.map-responsive{
    overflow:hidden;
    padding-bottom:25%; /* 56.25% */
    position:relative;
}
.map-responsive iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

.form-control {
  opacity: 0.8;
}

