/*****************************************************************************************************************************
                 II IS STRICTLY FORBIDDEN AND UNLAWFUL TO COPY HTML, CSS AND OTHER CONTENT OF THIS WEBSITE.
                 2025 BunnyBox. ALL RIGHTS RESERVED.
*****************************************************************************************************************************/


/* Do not remove this line */

*{       		-webkit-box-sizing:border-box;
				-moz-box-sizing:border-box;
				box-sizing:border-box;
				}
	

/********************************************************************
                           FONT DEFINITIONS
********************************************************************/
		 

.rethink-sans-<uniquifier>{
				font-family: "Rethink Sans", sans-serif;
				font-optical-sizing: auto;
				font-weight: 500;
				font-style: normal;
				}
				

/********************************************************************
                           GENERAL SETTINGS
********************************************************************/

html, body{      margin:0px;
                 padding:0px;
                 height:100%;
				 font-family:"Poppins", sans-serif;
				 }
				 
h1{              margin:0px;
                 padding:0px 0px 20px 0px;
                 font-size:3.5rem;
                 text-align:center;
				 text-decoration:underline 4px;
                 color:#000000;
                 }

@media screen and (max-width:900px){
  h1{ 		     font-size:3rem;;
                 }
}

h1.white{        color:#FFFFFF;
                 }


h2{              margin:0px;
                 padding:10px 0px 10px 0px;
                 font-size:3rem;
                 text-align:center;
				 text-decoration:underline 4px;
                 color:#FFFFFF;
                 }

@media screen and (max-width:900px){
  h2{ 		     font-size:2.5rem;;
                 }
}
				 
h2.white{        color:#f6edd9;
                 }
				 
h3{              margin:0px;
                 padding:20px 0px 0px 0px;
                 font-size:2.5rem;
                 color:#002255;
				 text-decoration:underline;
                 }
				 
@media screen and (max-width:900px){
  h3{ 		     font-size:2rem;;
                 }
				 
}

h3.white{        color:#FFFFFF;
                 }		
				 
h4{              margin:0px;
                 padding:20px 0px 0px 0px;
                 font-size:2rem;
                 color:#002255;
                 }
				 
@media screen and (max-width:900px){
  h4{ 		     font-size:1.5rem;;
                 }
				 
}

h4.white{        color:#ffffff;
                 }	

a:link{          text-decoration:none;
                 color:#000000;
                 }
				 
				 
a:link.white{    text-decoration:underline;
                 color:#FFFFFF;
                 }
				 

a:visited{       text-decoration:none;
                 color:#e3f7d3;
                 }


a:hover{         color:#e3f7d3;
                 }



p{               margin:40px 0px 40px 0px;
                 font-size:1.7rem;
                 }
@media screen and (max-width:900px){
  p{ 		     font-size:1.2rem;;
                 }
				 
}

p.top a:link{    margin:0px 0px 0px 0px;
                 padding:5px 0px 10px 5px;
                 float:right;
                 font-size:0.6em;
                 color:#000000;
                 border-top:1px solid #000000;
				 text-decoration:none;
                 }

p.top a:link.white{
                 color:#FFFFFF;
                 border-top:1px solid #FFFFFF;
                 }

p.top a:hover{   color:#f6edd9;
                 border-top:1px solid #f6edd9;
                 }

p.top a:hover.white{
                 color:#f6edd9;
                 border-top:1px solid #f6edd9;
                 }

.break{          margin:0px;
                 padding:0px;
                 clear:both;
                 }

.justify{        text-align:justify;
                 }

.center{         text-align:center;
                 }

.italic{         font-style:italic;
                 }

.noshow{         display:none;
                 }

.bold{           font-weight:bolder;
                 }


/********************************************************************
                           WEBSITE CONTAINER
********************************************************************/

#wrapper{        min-height:100%;
                 position:relative;
                 }


/********************************************************************
                           HEADER & LOGO
********************************************************************/

header{          margin:0px;
                 padding:5px 0px 0px 80px;
				 display:block:
				 float:left;
                 width:100%;
                 }

@media screen and (max-width:900px){
  header{ 		 margin:0px auto;
                 padding:5px 0px 0px 20px;
                 width:100%;
                 }
}

#logobox{        margin:0px;
                 width:100%;
                 padding:0px;
				 height:auto;
				 max-height:350px;
                 max-width:400px;
				 overflow:hidden;
                 }

img.logo{        margin:0px;
                 padding:0px;
				 width:75%;
                 }

/********************************************************************
                           MAIN NAVIGATION
********************************************************************/

#navi{           margin:15px auto;
                 padding:10px;
                 width:100%;
                 overflow:auto;
				 background:#526d42;
                 border-top:0px solid #84a170;
                 border-bottom:0px solid #84a170;
                 }

#navi li{        display: inline;
                 list-style:none;
                 }

#navi li a{      margin:0px;
                 padding:10px;
                 float:left;
                 display: inline-block;
				 height:50px;
                 width:25%;
                 transition:0.3s;

                 font-size:1.4rem;
                 font-weight:500;
                 text-align:center;
                 text-decoration:none;
				 color:#ffffff;
                 }

#navi li a:hover{color:#f6edd9;
                 }

#navi li a.on{   color:#f6edd9;
                 }

/* Hide the list item that contains the link that should open and close the topnav on small screens */

#navi li.icon{   display:none;
                 }


@media screen and (max-width:900px){
  #navi li:not(:first-child){
                 display:none;
                 }

  #navi li.icon{ margin:-5px 10px 0px 0px;
                 float:right;
                 display: inline-block;
                 font-weight:bolder;
                 font-size:1.5rem;
                 }
}

/* The "responsive" class is added to the #navi with JavaScript when the user clicks on the icon. This class makes the #navi look good on small screens */

@media screen and (max-width:900px){
  #navi.responsive{
                 min-height:60px;
                 height:auto;
                 position:relative;
                 }

  #navi.responsive li.icon{
                 position:absolute;
                 right:0px;
                 top:0px;
                 }

  #navi.responsive li{
                 float:none;
                 display:inline;
                 }

  #navi.responsive li a{
                 padding-left:25px;
                 width:100%;
                 display:block;
                 text-align:left;
                 }
  #navi.responsive li a:hover{
                 padding-left:35px;
                 }
}


/********************************************************************
                           MAIN CONTENT FORMATTING
********************************************************************/

.box{            margin:0px auto;
                 padding:40px 15px 40px 15px;
                 max-width:900px;
                 width:auto;
                 }

section{         margin:30px 0px 30px 0px;
                 padding:0px 0px 0px 0px;
				 min-height:20vh;
                 color:#000000;
				 background:;
                 }

.section2{       margin:30px 0px 30px 0px;
                 padding:0px 0px 0px 0px;
                 color:#FFFFFF;
                 background:#526d42;
                 }

.image{          margin:150px 0px 150px 0px;
                 }
				 
@media screen and (max-width:900px){
 .image{ 		 margin:50px 0px 50px 0px;
                 width:100%;
                 }
}

.lastsection{    margin:0px 0px 0px 0px;
				 padding:0px 0px 250px 0px;
                 clear:both;
				 color:#FFFFFF;
                 background:#526d42;
                 }


/********************************************************************
                           SECTION IMAGES
********************************************************************/

.imgbox{         margin:0px auto;
                 padding:0px;
                 max-height:500px;
                 max-width:1100px;
                 width:auto;
                 overflow:hidden;
                 }


.imgbg{          margin:0px auto;
				 padding:0px;
				 display:block;
                 opacity:0.80;
				 width:75%;
                 filter:alpha(opacity=100);
                 }
@media screen and (max-width:900px){
 .imgbg{ 		 margin:0px;
                 width:100%;
                 }
}
				 
.imgbgcenter{    margin:0px 0px -12px 0px;
				 float:center;
                 opacity:0.70;
				 width:75%;
                 filter:alpha(opacity=100);
                 }
				 
.imgbgright{     margin:15px 0px 15px 20px;
				 float:right;
                 opacity:0.80;
				 width:35%;
                 filter:alpha(opacity=100);
                 }

@media screen and (max-width:900px){
 .imgbgright{ 	 margin:0px 0px 20px 20px;
                 }
}
	
	
.imgbgleft{      margin:20px 0px 20px 20px;
				 float:right;
                 opacity:0.80;
				 width:35%;
                 filter:alpha(opacity=100);
                 }

/********************************************************************
                           SECTION IMAGES
********************************************************************/

ul.bulleta{      margin:100px auto 50px auto;
                 padding:25px;
                 list-style:none;
                 font-size:1.6rem;
                 color:#FFFFFF;
                 background:#41493b;
				 border:1px solid #41493b;
				 border-radius:6px;
                 }

ul.bulleta li{   margin:0px 0px 20px 0px;
                 display:block;
                 }

ul.bulleta li a{ margin:0px 0px 0px 0px;
                 padding:0px;
                 color:#FFFFFF;
                 }

ul.bulleta li a:hover{
                 color:#f6edd9;
                 }


ul.bulleta li.tel::before{
                content:"\0260E \0020";
                 }

ul.bulleta li.mail::before{
                content:"\02709 \0020";
                 }

ul.bulleta li.address::before{
                 content:"\25C9 \0020";
                 }
				 
ul.bulleta li.social::before{
				content: url('social_icon.png');
				padding-right:10px;
				}



/********************************************************************
                           AMENITY LIST WITH ICONS
********************************************************************/

.amenitybox{     margin:100px auto 50px auto;
                 padding:0px 10px 0px 10px;
                 height:auto;
                 max-width:100%;
                 list-style:none;
                 }

/*LIST BOX*/

ul.amenities{    margin:0px auto 0px auto;
                 padding:0px auto 0px auto;
                 min-width:150px;
                 width:50%;
                 float:left;
                 height:auto;
                 list-style:none;
                 }

@media only screen and (max-width:600px){
                 ul.amenities{
                 padding:0px;
                 width:100%;
                 }
}

.amenities li{   margin:0px;
                 padding:20px 0px 50px 100px;
                 background-position: 0px 0px 0px 0px;
                 background-repeat: no-repeat;
				 font-size:1.6rem;
                 }

@media only screen and (max-width:600px){
                 ul.amenities li{
                 padding:20px 0px 50px 100px;
                 }
}


/********************************************************************
                           Plan-
********************************************************************/

.container{	width:100%;
			min-height:60vh;
			}
			
			
.container h2{
			padding:50px 0px;
			font-size:35px;
			text-align:center;
			}
			
.price-row{	width:100%;
			max-width:1100px;
			margin:auto;
			display:grid;
			grid-template-columns:repeat(auto-fit,minmax(250px, 1fr));
			grid-gap:25px;
			}
			
.price-col{
			padding:10% 5%;
			color:#002255;
			text-align:center;
			background:#ffffff;/*1f283b*/
			border:1px solid #002255;
			border-radius:10px;
}

.price-col h3{
			margin:20px 0px 40px 0px;
			font-size:40px;
			font-weight:600;
			text-align:center;
			}
			
.price-col h3 span{
			font-size:20px;
			}
			
.price-col p{
			margin:10px 0px 0px 0px;
			font-size:30px;
			background:;
			}
			
.price-col p.small{
			font-size:15px;
			}

.price-col ul{
			margin:20px 0px 0px 0px;
			padding:0px 15px 0px 15px;
			text-align:left;
			color:#002255;
			list-style:none;
			}

.price-col ul li{
			margin:15px 0px;
			}

.price-col ul li::before{
			margin-right:5px;
			content: '\2713';
			color:#008000;
			font-weight:bold;
			}

.price-col ul li.na::before{
			content: '\2716';
			color:#e33058;
			}


.price-col button{
			margin-top:30px;
			padding:14px 0px;
			width:100%;
			background:#002255;

			border:1px solid #002255;
			border-radius:6px;
			cursor:pointer;	
			transition:background 0.5s;
			color:#ffffff;
			font-size:18px;
			}

.price-col button:hover{
			background:#4791FF;
			}



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

footer{          padding:10px 0px 0px 0px;
                 width:100%;
                 position:absolute;
                 bottom:0px;
                 left:0px;
                 text-align:center;
                 font-size:0.8rem;
				 background:#FFFFFF;
                 }

footer a:link{   border-top:0px solid;
                 color:#000000;
                 }

footer a:hover{  color:#0044AA;
                 }

footer a:visited{ color:#000000;
                 }

footer img.logo{ margin:25px 0px 25px 0px;
                 padding:0px;
                 width:25%;
                 }