/*===================== TABLE OF CONTENT =======================

1. Reset
2. Body Style
3. Placeholders & Highlights
4. Container & Grid
5. Headings
6. Buttons
7. Form
8. Paddings & Margins
9. Breadcrumbs
10. Custom Style
11. Header
12. Intro
13. Footer
14. About Page
15. Locations Page
16. Services Page
17. News Page
18. Contact Page
19. Price Table Page

=============================================================*/
/* ================================================================================== 
1. Reset
===================================================================================== */
*, *::after, *::before { margin: 0; padding: 0; -webkit-box-sizing: inherit; box-sizing: inherit; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none; } a, a:active, a:hover, a:focus { outline: none; } abbr[title] { border-bottom: 1px dotted; } dfn { font-style: italic; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { border: 0; max-width: 100%; } svg:not(:root) { overflow: hidden; } hr { -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; margin-top: 30px; margin-bottom: 35px; border-width: 0; border-top: 1px solid #e1e1e1; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } input:focus, select:focus, textarea:focus, button:focus { outline: none; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } input[type="checkbox"], input[type="radio"] { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"] { -webkit-appearance: textfield; -webkit-box-sizing: content-box; box-sizing: content-box; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: bold; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } input, textarea, button, select, a { -webkit-tap-highlight-color: transparent; } a { color: inherit; text-decoration: none; -webkit-transition: all 0.6s ease; -o-transition: all 0.6s ease; transition: all 0.6s ease; } strong { font-weight: 700; }
.fancybox__button--zoo, .fancybox__button--slideshow, .fancybox__button--fullscreen, .fancybox__button--thumbs, .fancybox__button--zoom{
  display: none;
}
.none{
  display: none;
}
ul, ol { padding-left: 4rem; }

/* ================================================================================== 
2. Body Style
===================================================================================== */
html {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  font-size: 56.25%;
  word-wrap: break-word;
}
@media only screen and (min-width: 80.0625em) {
  /*1281px*/
  html {
    font-size: 62.5%;
  }
}
body {
  font-family: "Mulish", sans-serif;
  font-weight: 300;
  line-height: 1.6;
  color:#000;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 1.7rem;
  
}
main{
  position: relative;
}
/* ================================================================================== 
3. Placeholders & Highlights
===================================================================================== */
::-webkit-input-placeholder { color: inherit; opacity: 1 !important; }
:-moz-placeholder { color: inherit; opacity: 1; }
::-moz-placeholder { color: inherit; opacity: 1; }
:-ms-input-placeholder { color: inherit; }
::-moz-selection { background-color: #305f9c;  color: #fff; }  
::selection { background-color: #305f9c; color: #fff }
/* ================================================================================== 
4. Container & Grid
===================================================================================== */
.container {
  position: relative;
  width: 100%;
  max-width: 148rem;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0 2rem;
}
.container-lg{
  max-width: 185rem;
}
.container-sm{
  max-width: 80rem;
}
.container-md{
  max-width: 120rem;
}
.container-xl{
  max-width: 192rem;
  padding: 0;
}
/* ================================================================================== 
5. Headings
===================================================================================== */

h1, h2, h3, h4, h5, h6 { margin-bottom: 2rem; font-weight: 700;line-height:1.4; }
h1{ font-size: 2.6rem; }
.title h1, .title h2{ font-size: 2.6rem;font-weight: 400; }
p { margin-bottom: 2rem; }
.title{ margin-bottom:4rem; }
.title-center{text-align: center;}
@media only screen and (min-width: 48.0625em) {
  /*769px*/
  h1{ font-size: 3.6rem; }
.title h1, .title h2{ font-size: 3.6rem }
}

/* ================================================================================== 
6. Buttons
===================================================================================== */

.btn {
	display: inline-block;
	padding: 1.3rem 3rem;
	font-weight: 400;
  border-top-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  font-weight: 700;

}
.btn-primary{
  background-color: #305f9c;
  color: #fff;
}
.btn-secondary{
  background-color: rgba(255,255,255,.3);
  color: #fff;
}
.btn-primary:hover{
  background-color: #f9355d;
}
.btn-secondary:hover{
  background-color: #305f9c;
}
/* ================================================================================== 
7. Form
===================================================================================== */
input,
textarea, select {
  display: block;
  width: 100%;
  background-color: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.3);
  font-size: 1.5rem;
  border-radius: 5px;
  padding: 1.5rem 1rem;
  color: #fff;
  font-weight: 400;

}
textarea{
  resize: vertical;
  height: 19rem;
}
input:focus,
textarea:focus, select:focus {
  border-color: #305f9c;

}
label {
  display: block;
  margin-bottom: 0.5rem;
  color: #fff;
  font-weight: 600;
}
button {
  transition: all 0.4s ease-in-out;
  border:0;
}
fieldset{
  border: 0;
  margin-bottom: 2rem;
}
label.check-wrapper {
  position: relative;
  padding-left: 3rem;
  margin-bottom: 1rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-transform: none;
}
.check-wrapper input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.checkmark {
  position: absolute;
  top: 3px;
  left: 0;
  height: 1.5rem;
  width: 1.5rem;
  border: 1px solid #43515a;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.check-wrapper input:checked ~ .checkmark:after {
  display: block;
}
.check-wrapper .checkmark::after {
  left: 0.4rem;
  top: 0.2rem;
  width: 0.5rem;
  height: 1rem;
  border: solid #43515a;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}


/* ================================================================================== 
8. Paddings & Margins
===================================================================================== */
.space {
  padding: 5rem 0;
}
.mt-5{
  margin-top: 5rem;
}
.no-pt{
  padding-top: 0 !important;
}
.no-pb{
  padding-bottom: 0 !important;
}
@media only screen and (min-width: 64.0625em) {
  /*1025px*/
  .space {
    padding: 10rem 0;
  }
  
}
/* .menu-item-has-children za wp sub parent*/
/* .current_page_item za wp active link u navigaciji*/
/* ================================================================================== 
9. Breadcrumbs
===================================================================================== */
.breadcrumbs{
  background-color: #e1e1e1;
  padding: 1rem 0;
  font-size: 1.4rem;
}
.breadcrumbs ul{
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
}
.breadcrumbs ul li{
  display: inline-block;
  font-weight: 600;

}
.breadcrumbs ul li::after{
  content: '|';
  display: inline-block;
  margin: 0 1rem;
}
.breadcrumbs ul li a{
  display: inline-block;
  font-weight: 400;
}
.breadcrumbs ul li:last-child:after{
  content: none;
}
/* ================================================================================== 
10. Custom Style
===================================================================================== */
.list ul{
  list-style: none;
  padding: 0;
  margin: 0;
}
.list ul li {
	position: relative;
	padding-left: 3rem;
	margin-bottom: 1rem;
}
.list ul li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 7px;
	width: 1.8rem;
	height: 1.8rem;
	background-image: url(images/list.svg);
	background-repeat: no-repeat;
	background-size: 1.8rem;
}
/* ================================================================================== 
11. Header
===================================================================================== */
header{
  /*position: fixed;*/
  left: 0;
  top: 0;
  width: 100%;
  background-color: transparent;
  z-index: 10;
  color: #fff;
  transition: all .4s ease-in-out;
  padding: 1rem 0;

}
header .btn{
  padding: 1rem 4rem;
  margin-left: auto;
  display: none;
}
header.scrolled{
  background-color: #011b26;
}
header ul{
  list-style: none;
  padding: 0;
  margin: 0;
}
header .container{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
header nav{
  position: fixed;
  top:0;
  right: 0;
  width: 100%;
  height: 100%;
  min-height: 100vh;
  background-color: #011b26;
  transition: all .4s ease-in-out;
  transform: translateY(-100%);
  opacity: 0;
  visibility: hidden;
  padding: 2rem;
  padding-top: 10rem;
  z-index: 1;

}
header nav.open{
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
}
header nav li{
  display: block;
}
header nav li  a{
  display: block;
  padding: 1rem 2rem;
  font-weight: 500;
  font-size: 2rem;
  position: relative;
}
header nav li a::after{
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  background-color: #fff;
  transition: all .4s ease-in-out;
  opacity: 0;

}
header nav li a:hover::after{
  width: 100%;
  opacity: 1;
}
.header-logo{
  display: block;
}
.header-logo img{
  display: block;
  width:18rem;
  height: auto;

}
.lang{
  margin-left: auto;
  margin-right: 2rem;
  font-weight: 500;
  font-size: 1.8rem;
}
.menu-toggle{
  display: block;
  order: 3;
  width: 60px;
  height: 45px;
  position: relative;
  z-index: 1001;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg) scale(0.4);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  margin-right: -2rem;
}
.menu-toggle span {
  display: block;
  position: absolute;
  height: 6px;
  width: 100%;
  background: #fff;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

.menu-toggle span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

.menu-toggle span:nth-child(2) {
  top: 18px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

.menu-toggle span:nth-child(3) {
  top: 36px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

.menu-toggle.open span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -3px;
  left: 8px;
  background: #fff;
}

.menu-toggle.open span:nth-child(2) {
  width: 0%;
  opacity: 0;
  background: #fff;
}

.menu-toggle.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 39px;
  left: 8px;
  background: #fff;
}
.mobile-info{
  padding-left: 2rem;
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 1px dashed rgba(255,255,255,.4);
}
@media only screen and (min-width: 37.5625em) {
  /*601px*/
  header nav{
    width: 40rem;
  }
  .lang{
    margin-left: 4rem;
  }
  header .btn{
    display: inline-block;
  }
  .header-logo img{
    width:24rem;
  }
}
@media only screen and (min-width: 64.0625em) {
  /*1025px*/
  header nav{
   position: static;
   top: auto;
   right: auto;
   width: auto;
   height: auto;
   min-height: auto;
   background-color: transparent;
   transform: none;
   transition: none;
   opacity: 1;
   visibility: visible;
   overflow-y: visible;
   margin-left: auto;
   margin-right: 5rem;
   padding: 0;
   display: block;
  }
  header nav li{
    display: inline-block;
  }
  header nav li  a{
    display: inline-block;
    font-size: 1.8rem;
    padding: 2rem 2rem;
  }
  .menu-toggle{
    display: none;
  }
  .mobile-info{
    display: none;
  }
  header .btn{
    margin-left: 0;
  }
  .lang{
    margin-left: 5rem;
    margin-right: 0;
  }
}
@media only screen and (min-width: 80.0625em) {
  /*1281px*/
  .header-logo img{
    width: 30rem
  }
  header nav{
    margin-right: 10rem;
  }

}

/* ================================================================================== 
12. Intro
===================================================================================== */
.intro{
  width: 100%;
  position: relative;
  /*height: 100vh;*/
}
@media (max-width: 767px) {
  .intro {
/*    height: 70vh;*/
height: 100%;
  }
}
/*.intro-overlay{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.4);
  z-index: 1;
}*/
header {
  width: 100%;
  background-color: rgba(0,0,0,.4);
}
.intro-text{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}
.intro-text .container{
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.intro-inner{
  max-width: 100rem;
  width: 100%;
  color: #fff;
  text-align: center;
}
.intro-inner h2{
  font-size: 2.6rem;
  font-weight: 300;
  margin-bottom: 3rem;
}
@media only screen and (min-width: 30.0625em) {
  /*481px*/
  .intro-inner h2{
    font-size: 3.2rem;
  }
}
@media only screen and (min-width: 48.0625em) {
  /*769px*/
  .intro-inner h2{
    font-size: 4rem;
  }
}
/* ================================================================================== 
13. Footer
===================================================================================== */
footer{
  background-color: #011b26;
  color: #fff;
  padding: 1rem 0;
}
footer ul{
  list-style: none;
  padding: 0;
  margin: 0;
}
footer .container{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
footer article{
  width: 100%;
  margin-bottom: 3rem;
}
footer article:last-child{
  margin-bottom: 0;
}
footer .btn{
  padding: 0.5rem 3rem;
  margin-bottom: 2rem;
}
footer ul{
  list-style: none;
  padding: 0;
  margin: 0;
}
footer ul li{
  margin-bottom: 5px;
}
.newsletter .btn{
  margin-bottom: 0;
  margin-top: 2rem;
}
.newsletter{
  width: 100%
}
.newsletter input{
  background-color: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.3);
  font-size: 1.5rem;
  border-radius: 5px;
  padding: 1.5rem 1rem;
}
.newsletter input:focus{
  border-color: #305f9c;
}
.copyright{
  padding: 1rem 0;
  background-color: #43515a;
  color: #fff;
  
}
.copyright p{
  margin-bottom: 0;
}
.copyright .container{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 1.4rem;
  font-weight: 500;
  text-align: center;
}
.social{
  display: flex;
  flex-direction: row;
  gap:1rem;
  margin-top: 1rem;
}
.social a{
  display: block;
}
.social img{
  display: block;
  width: 3rem;
  height: auto;
}

@media only screen and (min-width: 30.0625em) {
  /*481px*/
  .newsletter{
    width: 40rem;
  }
}
@media only screen and (min-width: 48.0625em) {
  /*769px*/
  .copyright .container{
    flex-direction: row;
    justify-content: space-between;
  }
  .social{
    margin-top: 0;
  }
}
@media only screen and (min-width: 64.0625em) {
  /*1025px*/
  footer .container{
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    text-align: left;
  }
  footer article{
    width: auto;
    margin-bottom: 0;
  }
}
/* ================================================================================== 
14. About Page
===================================================================================== */
.top-image{
  width: 100%;
  position: relative;
}
/*.top-image::before{
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.4);
}*/
.top-image img{
  display: block;
  width: 100%;
/*  height: 40rem;*/
  /*object-fit: cover;*/
}


.about-wrapper-text{
  width: 100%;
  background-color: #011b26;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5rem 2rem;
}
.about-wrapper-image{
  width: 100%;
}
.about-wrapper-image img{
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.about-wrapper-image iframe{
  display: block;
  width: 100%;
  height: 600px;
}

.about-icons-wrapper article{
  width: 100%;
  padding: 0 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-bottom: 2rem;
}
.icon{
  width: 10rem;
  height: 10rem;
  border-radius: 50%;
  background-color: #f7f7f7;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 3rem;
}
.icon img{
  display: block;
  width: 5rem;
  height: 5rem;
  object-fit: contain;
}
@media only screen and (min-width: 42.5625em) {
  /*681px*/
  .about-text{
    column-count: 2;
    column-gap: 5rem;
  }
  .about-icons-wrapper{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .about-icons-wrapper article{
    width: 50%;
  }
}
@media only screen and (min-width: 64.0625em) {
  /*1025px*/
  .about-icons-wrapper article{
    width: 25%;
  }
}
@media only screen and (min-width: 75.0625em) {
  /*1201px*/
  .about-wrapper{
    display: flex;
    flex-direction: row;
  }
  .about-wrapper-text{
    width: 50%;
    padding: 0;
  }
  .about-wrapper-image{
    width: 50%;
  }
  .about-wrapper-image img{
    height: 100%;
  }
  .about-inner{
    max-width: 70%;
  }
}
/* ================================================================================== 
15. Locations Page
===================================================================================== */
.top-height{
  width: 100%;
  height: 7rem;
  background-color: #011b26; 
  position: relative;
  z-index: 0;
}
#map {
  height: 700px;
  width: 100%;
  z-index: 0;
  margin-bottom: 30px;
}
.marker-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 300px;
}

.responsive-img {
  width: 100%;
  max-width: 300px;
  max-height: 200px;
  object-fit: cover;
  border-radius: 8px; /* Optional: Add rounded corners */
}
.locations-slider {
    overflow: hidden;
    width: 100%;
    cursor: grab;
}

.locations-wrapper {
    display: flex;
    flex-wrap: wrap; /* Allow items to wrap to new rows */
    gap: 1rem; /* Spacing between items */
    justify-content: space-between; /* Distribute items evenly */
    padding-top: 30px; /* Retain existing padding */
}

.marker-info {
    flex: 1 1 calc(30% - 1rem); /* Allow items to grow, shrink, and set base width */
    max-width: calc(30% - 1rem); /* Prevent items from exceeding this width */
    box-sizing: border-box; /* Include padding and border in width calculation */
    text-align: center; /* Center content inside */
    text-decoration: none; /* Remove underline for links */
    color: inherit; /* Inherit text color */
    padding-top: 20px;
}
@media (max-width: 768px) {
  #map {
    height: 500px;
  }
  .responsive-img {
    max-height: 100px;
  }
  .marker-info {
    max-width: none;
    width: 100%;
    box-sizing: border-box; /* Include padding and border in width calculation */
    text-align: center; /* Center content inside */
    text-decoration: none; /* Remove underline for links */
    color: inherit; /* Inherit text color */
    padding-top: 20px;
    flex: auto;
  }
}
.locations-wrapper a img{
  display: block;
  width: 100%;
  height: auto;
  transition: all .4s ease-in-out;
  margin-bottom: 2rem;
}
.locations-wrapper a h4{
  font-size: 1.5rem;
  color: #b0b0b0;
  margin-bottom: 1rem;
  padding:0px 20px 0px 20px;
}
.locations-wrapper a h3{
  padding:0px 20px 0px 20px;
}
.locations-wrapper a:hover{
  box-shadow: 0 19px 37px 5px rgba(0,0,0,.05);
}
.location-single-image img{
  display: block;
  width: 100%;
  height: auto;
}
.location-single-image{
  margin: 5rem 0;
}
.top-btn{
  display: flex;
  justify-content:flex-end;
}
.btn-arrow{
  background-image: url(images/arrow-left-white.svg);
  background-repeat: no-repeat;
  background-size: 2rem;
  background-position: left 2rem center;
  padding-left: 6rem;
}
.location-description {
  margin-bottom: 5rem;
}

.articles-container {
  display: flex; /* Enables the row layout */
  flex-wrap: nowrap; /* Prevents articles from wrapping to the next line */
  gap: 2rem; /* Adds space between articles */
}

.location-description article {
  background-color: #f7f7f7;
  padding: 3rem;
  flex: 1 1 calc(20% - 2rem); /* Each article takes about 20% width of the row */
  box-sizing: border-box;
  margin-bottom: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.contact-article {
  text-align: center; /* Centers the last article */
}

/* For smaller screens, articles should stack vertically */
@media (max-width: 768px) {
  .location-description article {
    width: 100%; /* Makes articles take full width on smaller screens */
    margin-bottom: 1rem; /* Adjusts space between stacked articles */
  }

  .articles-container {
    flex-direction: column; /* Stacks the articles vertically */
    gap: 1rem; /* Adjusts the gap between articles */
  }
}

/* Styling for the iframe container to ensure it's on a new row */
.iframe-container {
  width: 100%; /* Makes the iframe container take the full width */
  margin-top: 2rem; /* Adds space above the iframe */
}

.location-description article h4 {
	font-size: 1.5rem;
	color: #b0b0b0;
	margin-bottom: 1rem;
}
.location-map{
  width: 100%;
}
.location-map iframe{
  width: 100%;
  height: 40rem;
  display: block;
}
.locations-wrapper-lg {
  margin-bottom: 5rem;
}
.locations-wrapper-lg .locations-wrapper{
  width: 100%;
}
.locations-map-lg{
  width: 58%;
  display: none;
}
.locations-map-lg iframe{
  width: 100%;
  height: calc(100vh - 22rem);
  display: block;
}
.locations-filter {
	padding: 2rem 0;
	background-color: #43515a;
	margin-bottom: 3rem;
}
.locations-filter form{
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap:2rem
}
.locations-filter  fieldset{
  margin: 0;
}
.locations-filter form select {
	width: 100%;
	border-radius: 5px;
	border: 1px solid transparent;
	margin: 0;
	font-size: 1.6rem;
	background: rgba(255,255,255,.2);
	color: #fff;
}
.locations-filter form select option{
  color: #000;
}
.locations-wrapper-lg{
    width: 100%;
  }
/* ================================================================================== 
16. Services Page
===================================================================================== */
.text-center{
  margin: 0 auto;
  text-align: center;
  margin-bottom: 5rem;
  max-width: 90rem;
  width: 100%;
}

.services-icons-wrapper a{
  display: block;
  width:100%;
  border:1px solid #e7e7e7;
  padding: 3rem;
  border-radius: 1rem;
  margin-bottom: 3rem;
}
.services-icons-wrapper a:hover{
  box-shadow: 0 19px 37px 5px rgba(0,0,0,.05);
}
.service-single-image img{
  display: block;
  width: 100%;
  height: auto;
}
.service-single-image{
  margin: 5rem 0;
}
@media only screen and (min-width: 40.0625em) {
  /*641px*/
  .services-icons-wrapper{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap:3%
  }
  .services-icons-wrapper a{
    width:48.5%;
  }
}
@media only screen and (min-width: 64.0625em) {
  /*1025px*/
  .text-center{
    margin-bottom: 10rem;
  }
  .services-icons-wrapper a{
    width:31.3%;
  }
}
/* ================================================================================== 
17. News Page
===================================================================================== */

.news-wrapper article{
  width: 100%;
  margin-bottom: 3rem;
  border-top-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  overflow: hidden;
  background-color: #f7f7f7;
  padding-bottom: 2rem;
  display: flex;
  flex-direction: column;

}
.news-wrapper article img{
  display: block;
  width: 100%;
  height: auto;
  transition: all .4s ease-in-out;

}
.news-image:hover img{
  transform: scale(1.2);
}
.news-image{
  overflow: hidden;
  display: block;
}
.news-wrapper article h3{
  font-weight: 600;
  padding: 2rem;
  font-size: 1.8rem;
  margin-bottom: 0;
  transition: all  .4s ease-in-out;
}
.news-wrapper article h3:hover{
  color: #305f9c;
}
.news-wrapper article p{
  padding: 0 2rem;
}
.news-wrapper article .btn{
  margin-top: auto;
  color: #305f9c;
}
.article-image{
  margin: 5rem 0;
}
.article-date{
  color: #305f9c;
  font-size: 1.4rem;
  font-weight: 600;
}
@media only screen and (min-width: 37.5625em) {
  /*601px*/
  .news-wrapper{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap:3%;
  }
  .news-wrapper article{
    width: 48.5%;
  }
}
@media only screen and (min-width: 56.3125em) {
  /*901px*/
  .news-wrapper article{
    width: 31.3%;
  }
}
/* ================================================================================== 
18. Contact Page
===================================================================================== */
.contact-wrapper{
  display: flex;
  flex-direction: column-reverse;
}
.contact-form{
  width: 100%;
  background-color: #011b26;
  padding: 5rem 2rem;
}
.contact-text{
  width: 100%;
  padding: 5rem 2rem;

  text-align: center;
}
.contact-map iframe{
  width: 100%;
  height: 40rem;
  display: block;
}
.contact-text .social{
  justify-content: center;
}
@media only screen and (min-width: 42.5625em) {
  /*681px*/
  .contact-wrapper{
    flex-direction: row;
    justify-content: space-between;
  }
  .contact-form{
    width: 50%;
    background-color: #011b26;
    padding: 5rem;
  }
  .contact-text{
    width: 50%;
    padding: 5rem;
    text-align: left;
  
  }
  .contact-text .social{
    justify-content: flex-start;
  }
}
@media only screen and (min-width: 61.3125em) {
  /*981px*/
  .contact-form form{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .contact-form fieldset{
    width: 49%;
  }
  .contact-form fieldset.w-100{
    width: 100%;
  }
}
@media only screen and (min-width: 75.0625em) {
  /*1201px*/
  .contact-form{
    padding: 10rem;
  }
  .contact-text{
    padding: 10rem;
  
  }
}
/* ================================================================================== 
19. Price Table Page
===================================================================================== */
.price-btns{
  display: flex;
  gap:1rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.price-table-text{
  margin-bottom: 5rem;
}
.price-btns .btn {
	padding-left: 7rem;
	background-image: url(images/doc-white.svg);
	background-repeat: no-repeat;
	background-position: left 2.5rem center;
	background-size: 2rem;
}
@media only screen and (min-width: 30.0625em) {
  /*481px*/
  .price-btns{
    flex-direction: row;
    align-items: flex-start;
  }
}

/* Add any necessary styling for the slider */
.slider {
    white-space: nowrap; /* Prevents text from wrapping */
    overflow: hidden; 
    display: inline-block;
}

/* Animation for sliding */
@keyframes slide {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-100%);
    }
}

/* Apply animation */
.animate {
    animation: slide 20s linear infinite; /* Adjust duration as needed */
}
@media only screen and (min-width: 30.0625em) {
  .overlay-footer {
    position: relative;
    background-image: url(https://hooh.media/images/f.png);
    background-size: 100% 100%; /* Cover the entire width, maintain aspect ratio */
    background-position: center; /* Center the background image */
    background-repeat: no-repeat; /* Prevent image from repeating */
  }

  .overlay-footer::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4); /* Semi-transparent overlay */
    z-index: 1; /* Ensure the overlay is behind the content */
  }

  .footer-content {
    position: relative;
    z-index: 2; /* Ensure the content is above the overlay */
  }
}

/* Apply black transparent background to input fields */
#subscribeForm input[type="email"],
#subscribeForm input[type="text"],
#subscribeForm input[type="checkbox"] {
    background-color: rgba(0, 0, 0, 0.5); /* Adjust the alpha value as needed */
    color: #fff; /* Text color */
    border: none; /* Remove border */
    padding: 10px; /* Add padding for better appearance */
}

/* Style checkbox label */
.check-wrapper {
    color: #fff; /* Text color */
}

.check-wrapper a {
    color: blue; /* Link color */
}

.check-wrapper a:hover {
    text-decoration: underline; /* Underline on hover */
}
@media (max-width: 768px) {
    .hide-on-mobile {
        display: none;
    }
}