*{

    margin:0;

    padding:0;

    box-sizing:border-box;

    font-family: "Roboto", Arial, sans-serif;

}

body{

    line-height:1.6;

    color:#333;
	
	font-family: "Roboto", Arial, sans-serif;

}

header{

    background:#14532d;

    color:#fff;

    padding:15px 20px;

    position:sticky;

    top:0;

    z-index:1000;

}

	img {

    width: 100%;

}

.floating-contact{
    position:fixed;
    right:20px;
    bottom:20px;
    display:flex;
    flex-direction:column;
    gap:10px;
    z-index:9999;
}
.floating-contact a{
    width:55px;
    height55px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    text-decoration:none;
    font-size:24px;
    box-shadow:0 4px 10px rgba(0,0,0,.2);
}

.call-btn{background:#007bff; width: 48px;}
.sms-btn{background:#6c757d; width: 48px;}
.viber-btn{background:#7360f2; width: 48px;}
.whatsapp-btn{background:#25D366; width: 48px;}

.floating-contact img {
    width: 48px;
}

.space {

    width: 100%;

    margin-right: auto;

    margin-left: auto;

    clear: both;

}



.video-container {

    position: relative;

    padding-bottom: 56.25%;

    padding-top: 30px;

    height: 0;

    overflow: hidden;

    margin-right: auto;

    margin-left: auto;

}

.video-container iframe,

.video-container object,

.video-container embed {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

}

.navbar{

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.logo{

    width: 10%;

}

nav ul{

    display:flex;

    list-style:none;
	
	font-family: "Roboto", Arial, sans-serif;

}

nav ul li{

    margin-left:20px;

}

nav ul li a{

    color:#fff;

    text-decoration:none;

    font-weight:bold;

}

.hero{

    background:linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)),

    url('https://images.unsplash.com/photo-1566073771259-6a8506099945?q=80&w=1200') center/cover no-repeat;

    color:white;

    height:70vh;

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

    padding:20px;

}

.hero h1{

    font-size:48px;

}

.container{

    width:90%;

    max-width:1200px;

    margin:auto;

    padding:40px 0;

}

.card-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));

    gap:20px;

}

.card{

    background:#f4f4f4;

    border-radius:10px;

    overflow:hidden;

    box-shadow:0 4px 8px rgba(0,0,0,0.1);

}

.card img{

    width:100%;

    height:200px;

    object-fit:cover;

}

.card-content{

    padding:20px;

}

.btn{

    display:inline-block;

    background:#15803d;

    color:white;

    padding:10px 20px;

    text-decoration:none;

    border-radius:5px;

    margin-top:10px;

}

footer{

    background:#14532d;

    color:white;

    text-align:center;

    padding:20px;

    margin-top:40px;

}

.property-banner{

    height:50vh;

    background-size:cover;

    background-position:center;

    display:flex;

    align-items:center;

    justify-content:center;

    color:white;

    text-align:center;

}

.property-banner h1{

    font-size:42px;

    background:rgba(0,0,0,0.5);

    padding:20px;

}

form{

    background:#f4f4f4;

    padding:30px;

    border-radius:10px;

}

form input, form textarea{

    width:100%;

    padding:12px;

    margin-bottom:15px;

    border:1px solid #ccc;

    border-radius:5px;

}

form button{

    background:#15803d;

    color:white;

    border:none;

    padding:12px 25px;

    cursor:pointer;

    border-radius:5px;

}

.menu-toggle{

    display:none;

    font-size:28px;

    cursor:pointer;

}

@media(max-width:768px){

    nav ul{

        flex-direction:column;

        display:none;

        width:100%;

        background:#14532d;

        margin-top:15px;

    }

    nav ul.show{

        display:flex;

    }

    nav ul li{

        margin:15px;

    }

    .menu-toggle{

        display:block;

    }

    .navbar{

        flex-direction:column;

        align-items:flex-start;

    }

    .hero h1{

        font-size:34px;

    }

}



/*  GRID COLUMN SETUP   ==================================================================== */



.col {

	display: block;

	float: left;

	margin-bottom: 0;

	margin-left: 0;

	margin-right: 2px;

	margin-top: 0;

}

.col:first-child {

	margin-left: 2px;

}



/* all browsers except IE6 and lower */





/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */



@media only screen and (max-width: 480px) {

	.col {

		margin: 1% 0 1% 0%;

	}

}



/*  GRID OF FOUR   ============================================================================= */



.span_4_of_4 {

	width: 100%;

}

.span_3_of_4 {

	width: 75%;

	margin-left: 3px;

	margin-right: 2px;

}

.span_2_of_4 {

	width: 49%;

	font-size: 1.0 em;

	margin-top: 20px;

	text-align: left;

}

.span_1_of_4 {

	padding: 0.1em;

	width: 24%;

}



/*  GRID OF THREE   ============================================================================= */



.span_3_of_3 {

	width: 100%;

}

.span_2_of_3 {

	width: 65%;

	font-size: 1.0 em;

	text-align: left;

	padding: 0.2em;

}

.span_1_of_3 {

	padding: 0.2em;

	width: 32.5%;

}



/*  GRID OF TWO   ============================================================================= */



.span_2_of_2 {

	width: 100%;

}

.span_1_of_2 {

	width: 48%;

	text-align: justify;

	font-size: 0.3 em;

	margin-right: 5px;

	margin-left: 5px;

}





    /* ================= MOBILE ================= */

    @media (max-width: 768px) {



      .hamburger {

        display:flex;

      }



     /* RESPONSIVE */

@media (max-width: 768px) {



    .menu {

        position: absolute;

        top: 60px;

        left: 0;

        background: #00a8a8;

        width: 100%;

        flex-direction: column;

        display: none;

    }



    .menu.active {

        display: flex;

    }



    .menu li {

        text-align: center;

    }



    .menu li ul {

        position: static;

        display: none;

    }



    .menu li.active ul {

        display: block;

    }



    .menu-toggle {

        display: block;

    }



      .hero h1 {

        font-size:30px;

      }

	  

	  .span_2_of_3 {

		width: 100%;

	}

	.span_1_of_3 {

		width: 100%;

		padding: 0.1em;

	}

	.span_2_of_2 {

		width: 100%;

	}

	.span_1_of_2 {

		width: 99%;

	}

		.span_2_of_4 {

		width: 100%;

	}

	.inqbutton {

		width: 80%;

	}

	.maincontainer {

		width: 95%;

		margin-right: auto;

		margin-left: auto;

		padding: 3px;

		text-align: left;

	}

	.span_3_of_4 {

		width: 100%;

	}

	.span_1_of_4 {

		width: 49%;

	}

    }

	

	/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */



@media only screen and (max-width: 640px) {
	
	.logo{

    width: 90%;

}

	.maincontainer {

	width: 90%;

	margin-right: auto;

	margin-left: auto;

	padding: 3px;

	background-image: none;

}

	.span_1_of_4 {

		width: 98%;

	}

	.span_2_of_4 {

		width: 100%;

	}

	.span_1_of_3 {

		width: 100% !important;	

	}

	.span_2_of_3 {

		width: 100%;

	}

	.header {

		width: 100%;

		margin-right: auto;

		margin-left: auto;

	}

	.homecontainer {

	width: 64%;

	padding-right: 1px;

	}

   .text1 {

	    font-size: 1.0em;

		

   }

   p {

	    text-align: justify !important;   

	}

	

}