body
		{
    background-color:white;
 		color:black;
 		font-size:12pt;
 		margin:0px;
    padding-top:0px;
		}
a {text-decoration:none}

/* BODY CONTAINER */


.body-container
	 	{
		border:green 0px solid;
	 	box-shadow: 0 0 0px grey;
	 	}

		
/* Base style for all sections */
section {
  min-height: 200px;
  text-align: center;
  padding: 20px 20px;
  font-family: Arial, sans-serif;
}

/* Style each section by ID */
#home 
{
  top:0px;
  margin-top:0px;
  background: linear-gradient(135deg, #667eea, #764ba2);
  color: white;
}

#home h1 { font-size: 3rem; }

#gallery {
  background: #f4f4f4;
  color: #333;
}

#about {
  background: white;
  color: black;
}
#about p { max-width: 600px; margin: 20px auto; }

#contact 
{
  background: #00bcd4;
  color: black;
  text-align:left;
  border-top:solid 0px #001F3F;
}


#contact a { 
  color: yellow; 
  text-decoration: none;
  font-weight: bold;
}
#contact a:hover { text-decoration: underline; }


.home_content
 {
   padding-top:130px;
 }


/***************************** HEADER ********************************/	 		

/* HEADER */

	.header
		{
		z-index: 9999 !important;
		position:fixed;
 		top:0px;
 		left:0px;
		right:0px;
		background:white;
    margin:4px;
		border: solid 1px #667eea;
 		border-bottom:solid 1px #667eea;
 		border-top:#764ba2 0px solid;
 		border-left:0px;
 		border-right:0px;
		border-bottom-left-radius:30px;
		border-bottom-right-radius:30px;
 		height:95px;
 		box-shadow: 0px 0px 0px whitesmoke;
 		}
 		
 		
/* LOGO */

	.logo
		{
		position:absolute;
		top:5px;
		left:10px;
		height:auto;
 		width:85px;
		}

/* MENU */

	.menu
		{
		position: absolute;
		right:95px;
		padding-top:25px;
		} 	
		
	a.menu-nav:link
		{
		color:white;
		text-decoration:none;
		font-family: 'Roboto', sans-serif;
		font-size:20px;
		font-stretch:condensed;
		}

.link-container
	{
	    border:solid white 0px;
	    background-color:RGBA(220,230,255,0.95);
	    border-radius:10px;
	    text-align:;
	}

	
	/******** Drop Down Menu ********/
/* Dropdown Button */
.dropbtn 
   {
    position:fixed;
    right:10px;
    width:30px;
    height:30px;
   }
   

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: fixed;
  left:0px;
  padding-top:10px;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: fixed;
  text-align: center;
  top:85px;
  background-color:rgb(127,102,126,0.90);
  width: 100%;
  border-bottom-left-radius:5px;
  border-bottom-right-radius:5px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index:999 !important;
}

/* Links inside the dropdown */
.dropdown-content a {
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  font-family:Arial;
  display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}

/****End of Dropdown Menu******/
	

/***************************** END OF HEADER **************************/


 

.slideshow {
  position: relative;
  padding-top:0px;
  max-width: 1100px;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 0px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

/* Hide radio buttons */
.slideshow input {
  display: none;
}

.slides {
  display: flex;
  width: 400%; /* 4 slides = 400% */
  transition: transform 0.6s ease;
}

.slide {
  width: 25%; /* 100% / 4 slides */
  position: relative;
}

.slide img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  display: block;
}

.caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, rgba(0,0,0,0.8));
  color: white;
  padding: 40px 20px 20px;
}
.caption h3 {
  margin: 0 0 8px 0;
  font-size: 24px;
}
.caption p {
  margin: 0;
  opacity: 0.9;
}

/* Move slides based on checked radio */
#slide1:checked ~ .slides { transform: translateX(0); }
#slide2:checked ~ .slides { transform: translateX(-25%); }
#slide3:checked ~ .slides { transform: translateX(-50%); }
#slide4:checked ~ .slides { transform: translateX(-75%); }

/* Navigation dots */
.navigation {
  position: absolute;
  bottom: 2px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 10px;
  z-index: 10;
}
.dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255,255,255,0.5);
  cursor: pointer;
  transition: background 0.3s;
}
.dot:hover {
  background: rgba(255,255,255,0.8);
}
#slide1:checked ~ .navigation label[for="slide1"],
#slide2:checked ~ .navigation label[for="slide2"],
#slide3:checked ~ .navigation label[for="slide3"],
#slide4:checked ~ .navigation label[for="slide4"] {
  background: #3068E6;
}

/* Arrows */
.arrows label {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.5);
  color: white;
  padding: 16px 12px;
  cursor: pointer;
  font-size: 20px;
  user-select: none;
  z-index: 10;
  display: none;
}
.arrows label:hover {
  background: rgba(0,0,0,0.8);
}
.prev { left: 0; border-radius: 0 6px 6px 0; }
.next { right: 0; border-radius: 6px 0 0 6px; }

/* Show correct arrows for each slide */
#slide1:checked ~ .arrows .prev1,
#slide1:checked ~ .arrows .next1,
#slide2:checked ~ .arrows .prev2,
#slide2:checked ~ .arrows .next2,
#slide3:checked ~ .arrows .prev3,
#slide3:checked ~ .arrows .next3,
#slide4:checked ~ .arrows .prev4,
#slide4:checked ~ .arrows .next4 {
  display: block;
}

/* Auto-slide animation */
@keyframes autoplay {
  0% { transform: translateX(0); }
  20% { transform: translateX(0); }
  25% { transform: translateX(-25%); }
  45% { transform: translateX(-25%); }
  50% { transform: translateX(-50%); }
  70% { transform: translateX(-50%); }
  75% { transform: translateX(-75%); }
  95% { transform: translateX(-75%); }
  100% { transform: translateX(0); }
}

/* Remove this block if you don't want auto-slide */
.slides {
  animation: autoplay 20s infinite;
}
.slideshow:hover .slides {
  animation-play-state: paused;
}

/* Mobile */
@media (max-width: 768px) {
  .slide img { height: 250px; }
  .caption h3 { font-size: 18px; }
  .caption p { font-size: 14px; }
  .arrows label { padding: 12px 8px; font-size: 16px; }
}



.call_link a
 {
   position:absolute;
   z-index:9999 !important;
 }

.call_now
 {
   background:olive;
   border:solid 1px orange;
   border-radius:60px;
   width:150px;
   height:30px;
   color:white;
   margin:10px;
   text-align:center;
   font-size:16px;
   padding-top:10px;
 }

.call_now a
 {
   color:white;
 }

.about_container
{
  background: #F0FBFF;
  border: solid 1px #C2FFFE;
  border-radius:20px;
  margin:15px;
  padding:5px;
}

.contact_email
 {
   padding-left:100px;
 }

.contact_whatsapp
 {
   padding-left:100px;
 }

.contact_location
 {
   padding-left:100px;
 }


/*********************************** FOOTER ***************************/

	.footer
		{
		position:;
    bottom:0px;
 		padding-left:10px;
 		padding-top:10px;
 		background-color:#001F3F;
 		border:orange 0px solid;
 		border-bottom:orange 0px solid;
 		border-top:grey 0px solid;
 		border-left:0px;
 		border-right:0px;
 		height:60px;
 		width:100vw;
		}
		

/* COPYRIGHT TEXT */

	.copyright-text
		{
		color:silver;
		font-size:10px;
		padding:5px;
		}		

		
/******************* END of FOOTER ****************************************************/