body{
margin: 0px;
padding: 0px;
top: 0px;
background-color: rgb(161, 161, 107);
}
    ::-webkit-scrollbar {
      width: 10px;
    }

    ::-webkit-scrollbar-track {
      background-color: #ddd;
    }

    ::-webkit-scrollbar-thumb {
background-color: #988561;
border-radius: 20px;
transition: all 0.5S ease-in-out;
    }

    ::-webkit-scrollbar-thumb:hover {
background-color: #136902;
    }

.count{
display: flex;
position: relative;
height: 90dvh;
width: 100%;
background-color: #08150f;
justify-content: center;
align-items: center;
background-image: url(images/Alepp1.jpg);
background-size: cover;
z-index: 0;
}
.count::before{
background-color: rgba(0, 10, 0, 0.6);
content: "";
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
z-index: 1;
}
.d1{
width: 40%;
z-index: 2;
float: right;
}
.d2{
width: 60%;
z-index: 2;
float: left;
color: white;
margin: 20px;
align-items: center;
justify-content: center;
}
.p1 {
border-top: 2px solid wheat;
padding-top: 20px;
font-size: 20px;
}
.d2 h1{
padding-bottom: 20px;
}
@media(max-width: 768px){
.count{
flex-direction: column;
width: 100%;
z-index: 0;
padding: 0px;
}
.d1{
width: 100%;
z-index: 2;
margin-top: 20px;
}
.d2{
width: 100%;
z-index: 2;
padding: 20px 20px;
}
}
/*---------------------------------------------*/
.count1{
display: flex;
position: relative;
justify-content: center;
background-size: cover;
z-index: 0;
border-radius: 20px;
margin:50px 20px 0px  ;
overflow: hidden;
}
.d3{
width: 50%;
float: right;
padding: 20px 20px ;
background-color: #d5f1d5;

}
.d4{
width: 50%;
padding: 0px;
margin: 0px;
}
.roya{
height: 100%;
width: 100%;
}
.d3 p {
font-size: 20px;
}
.d3 h1{
padding: 0px 0px 20px ;
border-bottom: 2px solid black;
margin-bottom: 30px;
}
@media(max-width: 768px){
.count1{
flex-direction: column;
width: 100%;
z-index: 0;
padding: 20px;
margin: 0px;
margin-top: 30px;
overflow: hidden;
}
.d4{
width: 100%;
margin-bottom: 0px;
}
.d3{
width: 100%;
padding: 10px 20px;
}
.t1{
border-radius: 40px 40px 0px 0px ;
}
.b2{
border-radius: 0px 0px 40px 40px;
}
}
/*---------------------------------------------*/
footer{
margin-top: 50px;
background-color: rgba;
}
.bos
{
display: flex;
position: relative;
align-items: center;
justify-content: center;
margin: 50px 0px;
}
.h1{
text-align: center;
background-color: #054239;
width: 60%;
margin: auto;
padding: 20px;
border-radius: 50px 5px ;
border-bottom: 5px solid #bea16b;
color: white !important;
}
.card{
height: fit-content !important;
margin: 20px;
width: 20%;
border-radius: 50px !important;
overflow: hidden;
padding-bottom: 20px;
background-color: #eee7d9 !important;
}
.card1{
scale: 1.09;
}
.profile{
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url(https://wallpapers.com/images/hd/black-and-green-abstract-liquid-cyu7i06wgucxoq5g.jpg);
    background-size: cover;
    color:#bea16b;
    z-index: 0;
}
.profile i{
    font-size: 100%;
    width: 100%;
    height: 100%;
    text-align: center;
    line-height: 1;
    font-size: 180px;
  padding-top: 40px;
}
@media(max-width: 768px){
.bos{
display: block;
}
.card{
margin: 20px 0px;
padding: 20px;
width: 100%;
}
.card1{
scale: 1;
}
}