/* ! Reset */
body, html{ font-family: 'Inter', Arial, Helvetica, sans-serif; font-size: 16px; box-sizing: border-box;margin: 0;padding: 0;}*,*:before,*:after{ box-sizing: border-box; }h1,h2,h3,h4,h5,h6, p, ol, ul{margin: 0 0 1rem 0;padding: 0;}ol,ul{list-style-type: none;}img{height: auto;}h1{font-size: 4rem;} h2{font-size: 3rem;} h3{font-size: 2rem;} h4{font-size: 1rem;} h5{font-size: 0.8rem;} h6{font-size: 0.6rem;}a{text-decoration:none}


::selection{
  background: #3384a6;
  color: #fff;
  
  
  

}

#logo
{
	
	float: left;
	width: 150px;
}









.spacer{height: 100px;}
.spacer1{height: 50px;}
.spacer1{height: 40px;}
.spacer2 {height: 35px;}
.spacer3 {height: 25px;}

/* Menu */
:root { --menu-bg: rgb(255, 255, 255); --menu-color: #1d1d1f; }

.header{ background-color: var(--menu-bg); position: fixed; top:0;  left:0; z-index: 9999; width: 100%; padding: 10px 15px;
/*Opacity start*/
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=95);
-moz-opacity: 0.97;
-khtml-opacity: 0.97;
opacity: 0.97;
/*Opacity end*/
box-shadow: 0 0 65px 10px rgba(0, 0, 0, 0.469); }
.header__content{max-width: 1200px;width: 100%;margin: 0 auto; display: flex;justify-content: space-between;}

.header__logo,
.header__quick{display: flex; align-items: center;color:var(--menu-color)}

.header__menu{padding: 0;margin: 0;}
.header__menu li{display: inline-block;}
.header__menu li a{color:var(--menu-color); opacity: 0.8;display: block;padding: 30px;font-size: 15px;}

@media (max-width: 768px) {
  .header__menu{   
    position: absolute; top:60px; left:0; background-color: var(--menu-bg); width: 100%; height: 100vh;
    height: 0vh; overflow: hidden;transition: all 1s cubic-bezier(.215, .61, .355, 1);
  }

  .header__menu li{width: 100%;border-bottom: 1px solid #444}
  .menu-open .header__menu{height: 100vh;padding: 3%;}

  .icon-hamburger{height: 50px;width: 40px;margin-left: 20px;padding-top: 5px;}
  .icon-hamburger span{height: 2px; width: 30px;background: var(--menu-color);position: relative;display: block;margin-top: 11px;transition: all 0.2s cubic-bezier(.215, .61, .355, 1);}

  .menu-open .icon-hamburger span:nth-child(1){transform: rotate(45deg) translateY(9px);}
  .menu-open .icon-hamburger span:nth-child(2){transform: rotate(-45deg) translateY(-9px);}

  .header__quick{display: flex; justify-content: flex-end; width: 50%;}

}

/* ! Title System */
h1, .text-1 {font-size: 3.5rem;margin-bottom:0.5rem}
h2, .text-2 {font-size: 2.4rem;margin-bottom:1rem}
h3, .text-3  {font-size: 1.8rem;margin-bottom:1rem}
h4, p, .text-4 {font-size: 1rem;margin-bottom:1rem; line-height: 1.5;}
a{color: rgb(64, 102, 176);
  cursor: pointer;
}
.white {color: rgb(255, 255, 255)}


/* ! Button System */



.button {
  display: inline-block;
  margin: 40px auto 5px auto;
  position: relative;
  top: 0px;
  background-color: white!important;
  border-radius: 10px;
  padding: 10px 40px;
  font-size: 18px;
  color: white;
  background: -webkit-linear-gradient(25deg, #82b69187, #4ab76587);
  background-size: 130%;
  background-position: left;
  transition: all 0.3s;
  border: 0px;
}

.button:hover {
  top: -4px;
  background-position: right;
}

.button1 {
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
}


/* ! Cover */
.cover{ 
  text-align: center; padding:10px; margin:0px; min-height:600px; width:100%; 
  display:flex; flex-direction:column; justify-content:center; 
  background-position: center center; background-size:cover;
}
.cover * {color:#fff}

.cover1{ 
  text-align: center; padding:10px; margin:0px; min-height:60px; width:100%; 
  display:flex; flex-direction:column; justify-content:center; 
  background-position: center center; background-size:cover;
}
.cover1 * {color:#fff}

.footer {background: rgb(31, 56, 98);color:rgb(171, 165, 165); padding: 4%; color: #fff;
  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.681);
  border-radius: 20px 20px 0px 0px;

}












/* ! Grid System */
.grid { margin: 0 auto; padding: 0 15px; max-width: 1250px; display: flex; flex-flow: row; flex-wrap: wrap;}
.grid--center{justify-content: center;}
.col{ flex: 1;}

[class*='col-'] { position: relative;padding: 0 15px;}
.grid .grid [class*='col-'] {padding: 0px;}

.col-20{ width: 20%; }
.col-25{ width: 25%; }
.col-30{ width: 30%; }
.col-33{ width: 33.33%; }
.col-50{ width: 50%; }

.col-admin{ width: 50%;   border: 0.5px solid black;
}

.col-501{ width: 50%; padding: 0px;}
.col-70{ width: 70%; }



.col-80{ width: 80%; }
.col-100{ width: 100%; }

@media (max-width: 991px) {
    .tab-20 { width: 20%; }
    .tab-25 { width: 25%; }
    .tab-33 { width: 33.33%; }
    .tab-50 { width: 50%; }
    .tab-100 { width: 100%; }
    .spacerr {height: 100px;}
}

@media (max-width: 768px) {
    [class*='col-'] { width: 100%;}
    .sma-20 { width: 20%; }
    .sma-25 { width: 25%; }
    .sma-33 { width: 33.33%; }
    .sma-50 { width: 50%; }
    .sma-100 { width: 100%; }
    .spacerr {height: 100px;}
}

/* ! Helpers  */
.mt-0{margin-top: 0 }
.mt-1{margin-top: 10px}
.mt-2{margin-top: 20px}
.mt-3{margin-top: 40px}
.mt-4{margin-top: 100px }

.mb-0{margin-bottom: 0}
.mb-1{margin-bottom: 10px}
.mb-2{margin-bottom: 20px}
.mb-3{margin-bottom: 40px}
.mb-4{margin-bottom: 100px}

.p-0{padding: 0}
.p-1{padding: 10px}
.p-2{padding: 20px}
.p-3{padding: 40px}
.p-4{padding: 100px}

.pt-1{padding-top: 10px;}
.pt-3{padding-top: 20px;}
.pt-3{padding-top: 40px;}
.pt-4{padding-top: 15vh;}

.pb-1{padding-bottom: 10px;}
.pb-2{padding-bottom: 20px;}
.pb-3{padding-bottom: 40px;}
.pb-4{padding-bottom: 15vh;}

.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }
.img-res { width: 100%; height: auto; margin-bottom: 20px;vertical-align: middle;}
.img-round {border-radius: 100%;}

.img-res2 { width: 50%; height: auto; margin-bottom: 20px;}
.img-round2 {border-radius: 80px;} 

.relative {position: relative}
.round {border-radius: 35px; width: 95%;}
.img-round1 {border-radius: 100px; width: 70%;}
.img-round2 {border-radius: 100px; width: 75%;}
.change {width: 50%;}
.change1 {width: 30%;}
.change2 {width: 10%;}

.img-res1 { width: 90%; height: auto; margin-bottom: 20px;vertical-align: middle; padding-top: -10px}


.blob {position: absolute;top: -40%; left: -10%;width: 120%; z-index: -1;}
.blob1 {position: absolute;top: -5%; left: -20%;width: 120%; z-index: -1; width: 130%;}
.blob2 {position: absolute;top: 58%; left: -11%;width: 120%; z-index: -1; width: 100%;}
.blob3 {position: absolute;top: -40%; left: -9%; z-index: -1; width: 115%;}
.blob4 {position: absolute;top: 10%; left: -9%; z-index: -1; width: 80%;}
.blob5 {position: absolute;top: -35%; left: -10%;width: 120%; z-index: -1;}









.ekw_contact_form {
  padding: 60px;
  border: 1px solid #d0d0d0;
  border-radius: 400px 100px 200px 50px;
  box-shadow: 0 0 30px 0 rgba(0,0,0,.09);
  margin: auto;
  max-width: 600px;
}
.ekw_calendar {
  padding: 60px;
  border: 1px solid #d0d0d0;
  border-radius: 400px 100px 200px 50px;
  box-shadow: 0 0 30px 0 rgba(0,0,0,.09);
  margin: auto;
  max-width: 1000px;
}
.ekw_contact_form1 {
  padding: 60px;
  border: 1px solid #d0d0d0;
  border-radius: 400px 100px 200px 200px;
  box-shadow: 0 0 30px 0 rgba(0,0,0,.09);
  margin: auto;
  max-width: 600px;
}
.ekw_contact_form2 {
  padding: 60px;
  border: 1px solid #d0d0d0;
  border-radius: 400px 100px 200px 200px;
  box-shadow: 0 0 30px 0 rgba(0,0,0,.09);
  margin: auto;
  max-width: 600px;
}

.ekw_contact_form button {
  display: block;
  margin: 40px auto 5px auto;
  position: relative;
  top: 0px;
  background-color: white!important;
  border-radius: 10px;
  padding: 10px 40px;
  font-size: 18px;
  color: white;
  background: -webkit-linear-gradient(25deg, #4A44F287, #B12CFF87);
  background-size: 130%;
  background-position: left;
  transition: all 0.3s;
  border: 0px;
}
.ekw_contact_form1 button {
  display: block;
  margin: 40px auto 5px auto;
  position: relative;
  top: 0px;
  background-color: white!important;
  border-radius: 10px;
  padding: 10px 40px;
  font-size: 18px;
  color: white;
  background: -webkit-linear-gradient(25deg, #529d5a87, #36b43e87);
  background-size: 130%;
  background-position: left;
  transition: all 0.3s;
  border: 0px;
}
.ekw_contact_form2 button {
  display: block;
  margin: 40px auto 5px auto;
  position: relative;
  top: 0px;
  background-color: white!important;
  border-radius: 10px;
  padding: 10px 40px;
  font-size: 18px;
  color: white;
  background: -webkit-linear-gradient(25deg, #45714387, #33a53f87);
  background-size: 130%;
  background-position: left;
  transition: all 0.3s;
  border: 0px;
}



.ekw_contact_form button:hover {
  top: -4px;
  background-position: right;
}
.ekw_contact_form1 button:hover {
  top: -4px;
  background-position: right;
  box-shadow: 0 0 20px 0 rgba(0,0,0,.09);
}
.ekw_contact_form2 button:hover {
  top: -4px;
  background-position: right;
}

.ekw_input_container {
  width: 100%;
  display: inline-flex;
  align-items: center;
  background-color: white;
  border: 1px solid #e6e6e6;;
  border-radius: 8px;
  padding: 5px 20px 5px 20px;
  margin-bottom: 10px;
}
.ekw_input_container:hover {
  box-shadow: 0 0 20px 0 rgba(0,0,0,.09);
}

.ekw_input_container input, textarea {
  width: 100%;
  font-size: 16px;
  border: 1px solid white!important;
  -webkit-appearance: none!important;
  -moz-appearance: none!important;
  appearance: none!important;
  padding: 15px 18px;
  transition: all 0.2s;
  color: #3d4459;
}
.ekw_input_container > input:focus {
  border: 1px solid #a5afb8!important;
  background-color: #fafafa;
}
.ekw_input_container span {
  user-select: none;
  font-size: 30px;
  background: -webkit-linear-gradient(45deg, #4A44F2, #B12CFF);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 margin-right: 20px;
}







.ekw_input_container1 {
  width: 100%;
  display: inline-flex;
  align-items: center;
  background-color: white;
  border: 1px solid #e6e6e6;;
  border-radius: 8px;
  padding: 5px 20px 5px 20px;
  margin-bottom: 10px;
}
.ekw_input_container1:hover {
  box-shadow: 0 0 20px 0 rgba(0,0,0,.09);
}

.ekw_input_container1 input, textarea {
  width: 100%;
  font-size: 16px;
  border: 1px solid white!important;
  -webkit-appearance: none!important;
  -moz-appearance: none!important;
  appearance: none!important;
  padding: 15px 18px;
  transition: all 0.2s;
  color: #3d4459;
}
.ekw_input_container1 > input:focus {
  border: 1px solid #a5afb8!important;
  background-color: #fafafa;
}
.ekw_input_container1 span {
  user-select: none;
  font-size: 30px;
  background: -webkit-linear-gradient(45deg, #317245, #35b24e);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 margin-right: 20px;
}

.ekw_input_container2 {
  width: 100%;
  display: inline-flex;
  align-items: center;
  background-color: white;
  border: 1px solid #e6e6e6;;
  border-radius: 8px;
  padding: 5px 20px 5px 20px;
  margin-bottom: 10px;
}
.ekw_input_container2:hover {
  box-shadow: 0 0 20px 0 rgba(75, 134, 36, 0.264);
}

.ekw_input_container2 input, textarea {
  width: 100%;
  font-size: 16px;
  border: 1px solid white!important;
  -webkit-appearance: none!important;
  -moz-appearance: none!important;
  appearance: none!important;
  padding: 15px 18px;
  transition: all 0.2s;
  color: #3d4459;
}
.ekw_input_container2 > input:focus {
  border: 1px solid #a5afb8!important;
  background-color: #fafafa;
}
.ekw_input_container2 span {
  user-select: none;
  font-size: 30px;
  background: -webkit-linear-gradient(45deg, #317245, #35b24e);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 margin-right: 20px;
}



















input[type='checkbox'] {
-webkit-appearance: none!important;
appearance: none!important;
}
input[type='checkbox']::before {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  font-family: 'Material Icons';
  content: 'check';
  width: 21px;
  height: 21px;
  font-size: 16px;
  font-weight: 900;
  position: relative;
  background: -webkit-linear-gradient(45deg, #ffffff, #ffffff);
  border: 1px solid #B12CFF;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  border-radius: 6px;
  margin-right: 10px;
  padding: 1px;
  transition: all 0.8s;
}

input[type='checkbox']:checked::before {
  content: 'check';
  border: 2px solid #B12CFF;
  padding: 0px;
  font-size: 16px;
  background: -webkit-linear-gradient(45deg, #4A44F2, #B12CFF);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
}
@-moz-keyframes ekw_amination_rotate { 100% { -moz-transform: rotate(-360deg); } }
@-webkit-keyframes ekw_amination_rotate { 100% { -webkit-transform: rotate(-360deg); } }
@keyframes ekw_amination_rotate { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }

.ekw_loading_container {
  background-color: #f3f3f3c2;
  background-blend-mode: overlay;
  position: fixed;
  display: flex;
  align-items: center;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100;
}
.ekw_loading_cirle {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin: auto;
  box-shadow: 0px 1px 10px 6px rgba(0,0,0,0.12);
  border-radius: 20px;
  min-height: 200px;
  padding: 25px;
  background-color: white;
}
.ekw_loading_cirle .ekw_loading_text {
  display: flex;
  margin: auto 20px;
  font-size: 21px;
  font-weight: 900;
  letter-spacing: 2px;
  background: -webkit-linear-gradient(45deg, #4A44F2, #B12CFF);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
}
.ekw_loading_cirle .ekw_loading_point {
  background: -webkit-linear-gradient(45deg, #4A44F2, #B12CFF);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  font-size: 62px;
  margin: 0 5px;
  opacity: 0;
}
.ekw_loading_cirle svg {
  -webkit-animation:ekw_amination_rotate 2s linear infinite;
  -moz-animation:ekw_amination_rotate 2s linear infinite;
  animation:ekw_amination_rotate 2s linear infinite;
}
.ekw_text_center {
  text-align: center;
}




.label {
  color: white;
  padding: 8px;
  -webkit-text-fill-color: #a5afb8;
}

.trr { text-align: right;
  
}

@media (max-width: 768px) {
  .hide { visibility:hidden !important; text-indent: -9999px;
    display: none;
  

  
  }
  .more { width: 120%; 
  

  
  }
  

}






.gradient-border {

  --white: linear-gradient (white, white):
  
  --gradient: linear-gradient(to right, #31CCCC, #3B86DE);
  
  border: solid 0.25rem transparent; 
  border-radius: 0.5rem;
  
  background:
  var(--white) padding-box,
  var(--gradient) border-box;
}



table {
  border-collapse: collapse;
  margin: 20px auto;
  max-width: 600px;
  width: 100%;
  padding: 60px;

border-radius: 30px 30px 30px 30px;
box-shadow: 0 0 30px 0 rgba(22, 183, 19, 0.336);
}

.table {
  border-collapse: collapse;
  margin: 20px auto;
  max-width: 600px;
  width: 100%;
  padding: 60px;

border-radius: 30px 30px 30px 30px;
box-shadow: 0 0 30px 0 rgba(27, 46, 27, 0.336);



}

.table1 {
  border-collapse: collapse;
  margin: 20px auto;
  max-width: 600px;
  width: 100%;
  padding: 60px;

border-radius: 10px 10px 10px 10px;
box-shadow: 0 0 30px 0 rgba(27, 46, 27, 0.336);



}
th {
  

  background-color: #f2f2f2;
  font-weight: bold;
  padding: 10px;
  text-align: left;
}

td {
  border-radius: 30px 30px 30px 30px;

  border-bottom: 1px solid #ddd;
  padding: 10px;
  text-align: left;
  

}

tr:nth-child(even) {
  background-color: #f9f9f9;
}

.phone {
  width: 55%; height: auto; margin-bottom: 20px; margin-left:auto;
  margin-right:auto;
  

}
.sponsor {
  width: 100%; height: auto; margin-bottom: 20px; margin-left:auto;
  margin-right:auto;
  

}

/* player video */



#my-video {
  width: 100%;
  height: auto;
}

#my-video::-webkit-media-controls-start-playback-button {
display: none;
}

#my-video::-webkit-media-controls-play-button {
background-image: url('playy.svg');
}

#my-video::-webkit-media-controls-pause-button {
background-image: url('pause.svg');
}



#my-video::-webkit-media-controls-timeline {
height: 2px;
background-color: rgb(98, 204, 193);
border-radius: 2.5px;
}

#my-video::-webkit-media-controls-current-time-display,
#my-video::-webkit-media-controls-time-remaining-display {
color: rgb(98, 204, 193);
font-size: 15px;
font-weight: bold;
}

#my-video::-webkit-media-controls-mute-button,
#my-video::-webkit-media-controls-volume-slider-container,
#my-video::-webkit-media-controls-volume-slider,
#my-video::-webkit-media-controls-fullscreen-button {
display: none;
}

.containerr {
  max-height: 200px;
  
}
.parallax {
  position: relative;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: scroll;
}

.parallax-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url('https://images5.alphacoders.com/109/1091574.png');
  background-size: cover;
  background-position: center center;
  z-index: -1;
  transform: translateZ(0);
}

.parallax-content {
  padding: 50px;
}

.ekw_input_container3 {
  width: 100%;
  display: inline-flex;
  align-items: center;
  background-color: white;
  border: 1px solid #e6e6e6;;
  border-radius: 8px;
  padding: 5px 20px 5px 20px;
  margin-bottom: 10px;
}
.ekw_input_container3:hover {
  box-shadow: 0 0 40px 0 rgba(240, 45, 45, 0.386);
}

.ekw_input_container3 input, textarea {
  width: 100%;
  font-size: 16px;
  border: 1px solid white!important;
  -webkit-appearance: none!important;
  -moz-appearance: none!important;
  appearance: none!important;
  padding: 15px 18px;
  transition: all 0.2s;
  color: #3d4459;
}
.ekw_input_container3 > input:focus {
  border: 1px solid #a5afb8!important;
  background-color: #fafafa;
}
.ekw_input_container3 span {
  user-select: none;
  font-size: 30px;
  background: -webkit-linear-gradient(45deg, rgb(156, 57,75), rgb(148, 57, 74));
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 margin-right: 20px;
}

.ekw_input_container4 {
  width: 100%;
  display: inline-flex;
  align-items: center;
  background-color: white;
  border: 1px solid #e6e6e6;;
  border-radius: 8px;
  padding: 5px 20px 5px 20px;
  margin-bottom: 10px;
}
.ekw_input_container4:hover {
  box-shadow: 0 0 20px 0 rgba(232, 198, 75, 0.669);
}

.ekw_input_container4 input, textarea {
  width: 100%;
  font-size: 16px;
  border: 1px solid white!important;
  -webkit-appearance: none!important;
  -moz-appearance: none!important;
  appearance: none!important;
  padding: 15px 18px;
  transition: all 0.2s;
  color: #3d4459;
}
.ekw_input_container4 > input:focus {
  border: 1px solid #a5afb8!important;
  background-color: #fafafa;
}
.ekw_input_container4 span {
  user-select: none;
  font-size: 30px;
  background: -webkit-linear-gradient(45deg, rgb(241, 192,70), rgb(236, 190, 71));
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 margin-right: 20px;
}






.ekw_input_container5 {
  width: 100%;
  display: inline-flex;
  align-items: center;
  background-color: white;
  border: 1px solid #e6e6e6;;
  border-radius: 8px;
  padding: 5px 20px 5px 20px;
  margin-bottom: 10px;
}
.ekw_input_container5:hover {
  box-shadow: 0 0 40px 0 rgba(37, 143, 214, 0.667);
}

.ekw_input_container5 input, textarea {
  width: 100%;
  font-size: 16px;
  border: 1px solid white!important;
  -webkit-appearance: none!important;
  -moz-appearance: none!important;
  appearance: none!important;
  padding: 15px 18px;
  transition: all 0.2s;
  color: #3d4459;
}
.ekw_input_container5 > input:focus {
  border: 1px solid #a5afb8!important;
  background-color: #fafafa;
}
.ekw_input_container5 span {
  user-select: none;
  font-size: 30px;
  background: -webkit-linear-gradient(45deg, rgb(72, 155,195), rgb(74, 150, 188));
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 margin-right: 20px;
}


.calendar {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-gap: 20px;
  border-collapse: separate;
  border-spacing: 5px;
}

.calendar-day {
  text-align: right;
  padding-right: 5px;
  border: 1px solid #ccc;
  border-right-width: 0;
}

.calendar-day:last-child {
  border-right-width: 1px;
}

.calendar-event {
  background-color: #6181a16c;
  padding: 1px;
  margin: 5px 0;
  border: 1px solid #ccc;
  border-top-width: 0;
}

.calendar-event:first-child {
  border-top-width: 1px;
}


.buttonform {display: block;
margin: 40px auto 5px auto;
position: relative;
top: 0px;
background-color: white!important;
border-radius: 10px;
padding: 10px 40px;
font-size: 18px;
color: white;
background: -webkit-linear-gradient(25deg, #529d5a87, #36b43e87);
background-size: 130%;
background-position: left;
transition: all 0.3s;
border: 0px;
}
.buttonform:hover {
  top: -4px;
  background-position: right;
}



 




        
        .conttainer {
            max-width: 1400px;
            margin: 0 auto;
            padding: 20px;
        }
        
        
        

        
        .seearch-container {
            position: relative;
            max-width: 600px;
            margin: 0 auto;
            display: flex;
            align-items: center;
        }
        
        .seearch-box {
            width: 100%;
            padding: 15px 20px;
            border: 1px solid #ddd;
            border-radius: 30px;
            font-size: 1rem;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
            transition: all 0.3s ease;
            padding-right: 60px;
        }
        
        .seearch-box:focus {
            outline: none;
            border-color: #3498db;
            box-shadow: 0 2px 10px rgba(52, 152, 219, 0.2);
        }
        
        .seearch-btn {
            position: absolute;
            right: 5px;
            background: #3498db;
            color: white;
            border: none;
            border-radius: 30px;
            padding: 10px 20px;
            cursor: pointer;
            transition: all 0.3s ease;
            height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .seearch-btn:hover {
            background: #2980b9;
        }
        
        .map-container {
            display: flex;
            flex-direction: column;
            gap: 30px;
        }
        
        @media (min-width: 992px) {
            .map-container {
                flex-direction: row;
            }
            
            .map-panel {
                flex: 1;
            }
        }
        
        .map-panel {
            background: white;
            border-radius: 8px;
            box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
            overflow: hidden;
        }
        
        .map-header {
            padding: 15px 20px;
            background: #2c3e50;
            color: white;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        
        .map-header h2 {
            font-weight: 400;
            font-size: 1.2rem;
        }
        
        .view-toggle {
            background: rgba(255, 255, 255, 0.2);
            border: none;
            color: white;
            padding: 5px 10px;
            border-radius: 4px;
            cursor: pointer;
        }
        
        .map-content {
            height: 400px;
            position: relative;
            overflow: hidden;
        }
        
        #map-2d-container {
            width: 100%;
            height: 100%;
            overflow: hidden;
            position: relative;
            background-color: #2c3e50;
        }
        
        #map-2d {
            width: 800px;
            height: 600px;
            background-color: #eaeaea;
            position: relative;
            transform-origin: 0 0;
            transition: transform 0.3s ease;
        }
        
        
        
        .zoom-btn {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    background: white;
    border: 1px solid #3498db;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
    font-size: 16px;
    color: #2c3e50;
    font-weight: bold;
    transition: all 0.2s ease;
}

.zoom-btn:hover {
    background: #3498db;
    color: white;
    transform: scale(1.05);
}
        
        #map-3d {
            width: 100%;
            height: 100%;
        }
        
        .location-marker {
          
    position: absolute;
    width: 24px;
    height: 24px;
    background: #e74c3c;
    border-radius: 50%;
    transform: translate(-50%, -50%); /* Centra il marcatore sul punto */
    box-shadow: 0 0 0 rgba(231, 76, 60, 0.4);
    animation: pulse 1.5s infinite;
    cursor: pointer;
    z-index: 100;
    pointer-events: auto;
}

.location-marker::after {
    content: '';
    position: absolute;
    width: 12px;
    height: 12px;
    background: white;
    border-radius: 50%;
    top: 6px;
    left: 6px;
}
        
        @keyframes pulse {
            0% {
                box-shadow: 0 0 0 0 rgba(231, 76, 60, 0.4);
            }
            70% {
                box-shadow: 0 0 0 10px rgba(231, 76, 60, 0);
            }
            100% {
                box-shadow: 0 0 0 0 rgba(231, 76, 60, 0);
            }
        }
        
        .info-box {
            position: absolute;
            background: white;
            padding: 15px;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
            z-index: 200;
            max-width: 250px;
            display: none;
        }
        
        .info-box h3 {
            margin-bottom: 8px;
            color: #2c3e50;
        }
        
        .info-box p {
            margin-bottom: 5px;
            font-size: 0.9rem;
        }
        
        .close-btn {
            position: absolute;
            top: 10px;
            right: 10px;
            background: none;
            border: none;
            font-size: 1.2rem;
            cursor: pointer;
            color: #7f8c8d;
        }
        
        .instructions {
            margin-top: 30px;
            padding: 20px;
            background: white;
            border-radius: 8px;
            box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
        }
        
        .instructions h2 {
            margin-bottom: 15px;
            color: #2c3e50;
            font-weight: 400;
        }
        
        .instructions ol {
            margin-left: 20px;
        }
        
        .instructions li {
            margin-bottom: 10px;
        }
        
        .no-results {
            text-align: center;
            padding: 20px;
            color: #e74c3c;
            display: none;
        }
        
        .hidden {
            display: none;
        }
        
        .modal {
            display: none;
            position: fixed;
            z-index: 1000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.8);
            align-items: center;
            justify-content: center;
        }
        
        .modal-content {
            background-color: white;
            padding: 20px;
            border-radius: 8px;
            max-width: 90%;
            max-height: 90%;
            overflow: auto;
            position: relative;
        }
        
        .close-modal {
            position: absolute;
            top: 10px;
            right: 15px;
            font-size: 28px;
            font-weight: bold;
            cursor: pointer;
            color: #2c3e50;
        }
        
        .fullscreen-map {
            width: 100%;
            height: 80vh;
        }

        .conttainer2 {
    width: 100%; /* Forziamo ogni contenitore ad occupare una riga intera */
    /* Puoi aggiungere anche un po' di spazio tra le due mappe, se necessario */
    margin-bottom: 50px; 
}

.conttainer {
    width: 100%; /* Forziamo ogni contenitore ad occupare una riga intera */
    /* Puoi aggiungere anche un po' di spazio tra le due mappe, se necessario */
    margin-bottom: 50px; 
}

/* RESPONSIVE PER SMARTPHONE */
@media (max-width: 768px) {
    .conttainer, .conttainer2 {
        padding: 10px;
        max-width: 100%;
    }
    
    .map-content {
        height: 300px !important; /* Riduci l'altezza su mobile */
    }
  }
    


    @media (max-width: 768px) {
    #map-2d {
        width: 800px !important;   /* Larghezza originale desktop */
        height: 600px !important;  /* Altezza originale desktop */
        min-width: 800px;
        min-height: 600px;
        transform-origin: 0 0;
    }
    #map-2d-secondo {
        width: 2191px !important;   /* NUOVA Larghezza REALE */
        height: 2172px !important;  /* NUOVA Altezza REALE */
        min-width: 2191px;
        min-height: 2172px;
        transform-origin: 0 0;
    }
    
    #map-2d-container, #map-2d-container-secondo {
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        width: 100%;
        height: 60vh;
        background: #f0f0f0;
    }
    
    /* Migliora lo scrolling */
    #map-2d-container::-webkit-scrollbar, 
    #map-2d-container-secondo::-webkit-scrollbar {
        width: 8px;
        height: 8px;
    }
    
    #map-2d-container::-webkit-scrollbar-thumb,
    #map-2d-container-secondo::-webkit-scrollbar-thumb {
        background: #3498db;
        border-radius: 4px;
    }
}

    
    
    
    
    
    .seearch-container {
        max-width: 100%;
        margin: 0 10px;
    }
    
    .seearch-box {
        padding: 12px 15px;
        font-size: 16px; /* Migliora la leggibilità su mobile */
    }
    
    .map-header h2 {
        font-size: 1rem; /* Riduci dimensione titoli */
    }
    
    


.map-content {
    touch-action: pan-x pan-y;
}

@media (max-width: 768px) {
    .location-marker {
        width: 20px;
        height: 20px;
    }
    
    .location-marker::after {
        width: 8px;
        height: 8px;
        top: 6px;
        left: 6px;
    }
    
    .info-box {
        max-width: 200px;
        padding: 10px;
        font-size: 0.8rem;
    }
}


#map-2d-container, #map-2d-container-secondo {
    background-color: transparent !important; /* Rimuove il blu */
}

#map-2d, #map-2d-secondo {
    background-color: #eaeaea; /* Sfondo grigio chiaro uniforme */
}


/* Galleria */

.galleria-container {
            max-width: 1400px;
            margin: 0 auto;
            padding: 60px 20px;
            position: relative;
            background-color: inherit; /* Eredita dal parent */

        }

        .galleria-title {
            text-align: center;
            font-family: 'Inter', sans-serif;
            font-size: 2.5rem;
            font-weight: 300;
            color: #2c3e50;
            margin-bottom: 50px;
        }

        .galleria-wrapper {
            position: relative;
            display: flex;
            align-items: center;
            gap: 30px;
        }

        .galleria-orizzontale {
            display: flex;
            gap: 30px;
            overflow-x: hidden;
            scroll-behavior: smooth;
            padding: 20px 0;
            width: 100%;
        }

        .galleria-item {
            flex: 0 0 calc(50% - 15px);
            min-width: calc(50% - 15px);
            height: 500px;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 8px 40px rgba(0, 0, 0, 0.02);
            transition: all 0.4s ease;
            position: relative;
            

        }

        .galleria-img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-radius: 20px;
            transition: transform 0.4s ease;
        }

        .galleria-item:hover .galleria-img {
            transform: scale(1.03);
        }

        /* Frecce di navigazione */
        .galleria-btn {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 60px;
            height: 60px;
            background: white;
            border: none;
            border-radius: 50%;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.5rem;
            color: #2c3e50;
            transition: all 0.3s ease;
            z-index: 10;
        }

        .galleria-btn:hover {
            background: rgb(31, 56, 98);
            color: white;
            transform: translateY(-50%) scale(1.1);
        }

        .galleria-btn.prev {
            left: 10px;
        }

        .galleria-btn.next {
            right: 10px;
        }

        .galleria-btn:disabled {
            opacity: 0.3;
            cursor: not-allowed;
            transform: translateY(-50%) scale(1);
        }

        .galleria-btn:disabled:hover {
            background: white;
            color: #2c3e50;
        }

        /* Indicatori */
        .galleria-indicators {
            display: flex;
            justify-content: center;
            gap: 12px;
            margin-top: 30px;
        }

        .indicator {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background: #ddd;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .indicator.active {
            background: rgb(31, 56, 98);
            transform: scale(1.2);
        }

        /* Responsive */
        @media (max-width: 1200px) {
            .galleria-btn.prev {
                left: 10px;
            }
            
            .galleria-btn.next {
                right: 10px;
            }
        }

        @media (max-width: 768px) {
            .galleria-item {
                flex: 0 0 100%;
                min-width: 100%;
                height: 400px;
            }
            
            .galleria-btn {
                width: 50px;
                height: 50px;
                font-size: 1.2rem;
            }
            
            .galleria-title {
                font-size: 2rem;
            }
        }

        @media (max-width: 480px) {
            .galleria-item {
                height: 300px;
            }
            
            .galleria-btn {
                width: 40px;
                height: 40px;
                font-size: 1rem;
            }
        }