*{
    padding:0;
    margin:0;
    font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
body{
    min-height:100vh;
}
.logos{
    width:150px; 
    height:100px;
    padding: 0 60px;
 }
nav{
    background-color:white;
    box-shadow:3px 3px  5px rgb(0, 0,0,0.2);
    display: flex;
}
nav ul{
    width:100%;
    list-style:none;
    display:flex;
    justify-content:flex-end;
    align-items:center;
}
nav li{
    height:50px;
}
nav a{
    height:100%;
    padding:0 30px;
    text-decoration:none;
    display:flex;
    align-items:center;
    color:black;
}
nav a:hover{
    color: brown;
}
.sidebar{
    position:fixed;
    top:0;
    right:0;
    height:100vh;
    width:250px;
    z-index: 999;
    background-color:rgba(255, 255, 255, 0.3);
    backdrop-filter:blur(10px);
    box-shadow:-10px 0 10px rgb(0, 0,0,0.2);
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-start;
    
}
.sidebar li{
    width:100%;
}
.sidebar a{
    width:100%;
}
.menu-button{
    display:none;
}

.home{
    position:relative;
    width: 100%;
    height:70vh;
    text-decoration:none;
    background:url(images/A.jpeg);
    background-size:cover;
    background-position:center;
    display:flex;
    align-items:center;
    padding:40px 50px;

}


.content{
    max-width:500px;
}
.content  h2{
    font-size:3em;
}
.content  h4{
    font-size:2em;
}
.content p{
    padding: 10px 0 40px 0;
}
.learn{
    width:200px;
    height:30px;
    color:white;
    background-color:brown;
    border-radius:50px;
    border:0;
    font-weight:bold;
}
.learn:hover{
background-color: black;
}



.choose{
    width:100%;
    height:auto;
    background-color:#F1F1EC;
    ;
    }
    .wrap-choose{
    margin:auto;
    width:70%;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
    }
    
    .nonvisible-box{
    width:350px;
    height:300px;
    /* box-shadow:5px 5px 5px 5px rgba(0,0,0,0.1);*/
    border-radius:25px;
    margin:30px;
    text-align:center;
    }
    .choose h4{
    text-align:center;
    padding-top:40px;
    }
    .choose hr{
    margin:auto;
    width:100px;
    }
    .nonvisible-box img{
        width:100px;
        height:auto;
        
        }
    .nonvisible-box img{
    padding-top:20px;
    
    }
    .nonvisible-box p{
    padding-top:20px;
    
    }
    .nonvisible-box p{
    padding-top:20px;
    
    }
    .nonvisible-box h3{
    padding-top:20px;
    color:#3c0802;
    
    }



.advert{
    padding-top:80px;
    width:100%;
    height:auto;

}
.advertwrap{
        margin:auto;
        width:90%;
        display:flex;
        flex-direction:row;
        justify-content:space-between;
        align-items:center;
}
.ads{
    width:45%;
    height:500px;
    text-align:center;

}
.ads img{
    max-width:100%;
    height:auto;
}
.ads2{
    width:40%;
    height:50%;
    align-items:center;
}

.ads2 img{
    max-width:100%;
    height:auto;
}
.details{
    padding-top:80px;
    width:100%;
    height:auto;
    text-align:center;
}

.works{
    width:100%;
    height:auto;
    background-color:#ffffff;
    ;
    }
    .wrap-works{
    margin:auto;
    width:70%;
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
    }
    
    .box{
    width:400px;
    height:350px;
    box-shadow:5px 5px 5px 5px rgba(0,0,0,0.1);
    border-radius:25px;
    margin:30px;
    text-align:center;
    }
    .works h4{
    text-align:center;
    padding-top:40px;
    }
    .works hr{
    margin:auto;
    width:100px;
    }
    .box img{
        width:150px;
        height:auto;
        
        }
    .box img{
    padding-top:1px;
    
    }
    .box p{
    padding-top:10px;
    
    }
   
    .box h3{
    padding-top:5px;
    color:#3c0802;
    
    }

    .design{
        margin:auto;
        padding-top:100px;
        width:100%;
        background-image:url(images/ggs.jpeg);
        background-size: cover;
        background-position:center;
        height:auto;
    }
    .design h2{
        text-align: center;
        color:white;
        font-weight: bold;
    }
    .designcover{
        margin:auto;
        width:100%;
        height:auto;
        padding:10px;
        display:flex;
        flex-direction:row;
        justify-content:space-evenly;
    }

    .patner{
        width:100%;
        padding-top:100px;
        text-align:center;
    }
    .patner h3{
       padding-top:50px;
       font-weight:bolder;
    }
   
    .patnerCover{
        padding-top:20px;
        width:70%;
        margin: auto;
        display:flex;
        flex-direction:row;
        justify-content:space-between;
        align-items:center;
    }
        .frame{
        width:400px;
        height:350px;
      /*  box-shadow:5px 5px 5px 5px rgba(0,0,0,0.1);*/
        border-radius:25px;
        margin:30px;
        text-align:center;
        }
        .frame img{
            max-width:100%;
            height:350px;
        }

    
.footer{
    padding-top:200px;
    background-color: #2a2a2a;
    color:white;
    text-align:center;
}

.footer h3{
    padding:50px 10px;

}

/*contacts*/

.contacts{
    width:100%;
    background-image:url(images/ggg.jpeg);
    background-size: cover;
    background-position:center;
    height:400px;

}
.contactwrap{
    width:100%;
    height:auto;
    align-items: center;
    padding-top:100px;
    display:flex;
    justify-content: center;
}
    
.contacts p{
    background-color:white;
    width:150px;
    height:50px;
    border-radius:10px;
    text-align: center;
    padding-top:20px;
}

.message-container{
    width:100%;
    padding-top:70px;
    margin:30px;
}
.messageWarp{
    width:90%;
    height:300px;
    display:flex;
    flex-direction:row;
 justify-content: space-around;

}
.message1 h2{
    color: #3c0802;
   
}
.boxes{
    width:250px;
    height:180px;
    box-shadow:5px 5px 5px 5px rgba(0,0,0,0.1);
    border-radius:25px;
    margin:30px;
    text-align:center;
}
.boxes img{
    width:60px;
    height:auto;
    padding-top:20px;
}

.forms{
    width:400px;
    height:400px;
    align-items:center;
    border-radius:20px;
    padding:50px 40px;
    box-shadow:5px 5px 5px 5px rgba(0,0,0,0.1);


}
input[type=text],input[type=email]{
    border:0;
    border-radius:10px;
    width:400px;
    height:50px;
    margin:20px 5px;
    background-color: #f4f4f4;
  
}
::placeholder{
    padding:10px 8px;

}
input[type=submit]{
    border:0;
    width:200px;
    height:50px;
    border-radius:20px;
    color: white;
    background-color: #3c0802;
}
input[type=submit]:hover{
    color:white;
    background-color:black;
}


/*About*/
.about{
    width:100%;
    background-image:url(images/page-heading-bg.jpg);
    background-size: cover;
    background-position:center;
    height:100vh;
}
.aboutwrap{
    padding-top:200px;
    color:white;
    align-items:center;
    width: 100%;
}
.aboutwrap h2{
    text-align: center;
    padding-top: 40px;
}
.aboutwrap p{
    text-align: center;
    padding-top: 40px;
}

/*business consulting*/
.business{
    width:100%;
    background-image:url(images/page-heading-bg.jpg);
    background-size: cover;
    background-position:center;
    height:100vh;
}
.businesswrap{
    padding-top:200px;
    color:white;
    align-items:center;
    width: 100%;
}
.businesswrap h2{
    text-align: center;
    padding-top: 40px;

}.businesswrap p{
    text-align: center;
    padding-top: 40px;
}

/*RealEstate*/
.estate{
    width:100%;
    background-image:url(images/banner-02.jpg);
    background-size: cover;
    background-position:center;
    height:500px;
    
}
.estatewrap{
    padding-top:50px;
    color:white;
    align-items:center;
    width: 100%;

}
.estatewrap h2{
    text-align: center;
    padding-top: 40px;
}
.estatewrap p{
    text-align: center;
    padding-top: 40px;
}
.estImage{
    padding-top:80px;
    width:100%;
    height:auto;

}
.estimagWrap{
    width:100%;
    display: flex;
    flex-direction:row;
    align-items: center;
    justify-content:space-around;

}
.wrap{
    width:400px;
    height:300px;
    box-shadow:5px 5px 5px 5px rgba(0,0,0,0.1);
    border-radius:25px;
    margin:30px;
}
.wrap img{
    max-width:100%;
    height:300px;
}

@media (max-width: 800px) {
    .hideOnmobile{
        display:none;
    }
    .menu-button{
        display:block;
    }
    .wrap-choose{
        flex-direction:column;
    }
    .wrap-works{
        flex-direction:column;
    }
    .advertwrap{
        flex-direction: column;
    }
    .designcover{
        flex-direction:column;
    }
    .patnerCover{
        flex-direction: column;
    }
    .messageWarp{
        flex-direction:column;
    }
    .estimagWrap{
        flex-direction: column;
    }

}
@media (max-width:400px) {
    .sidebar{
        width:100%;
    }
   
}