*{
    padding: 0px;
    margin: 0px;
    box-sizing: border-box;
    font-family:Calibri;
    border:none;
    background-repeat: no-repeat;
    text-decoration: none;
}
main{
    width: 100%;
    height: 100vh;
    background-color: beige;
    position:relative;
  
    margin: 0 auto;
}
header{
    width: 100%;
    height: 15vh;
    display: flex;
    background-image: linear-gradient(to bottom, blue , white);
    
}
#logoleft {
    width: 10%;
    height: 99%;
    background-image: url(/WebImages/LogoLeft.png);
    background-repeat: no-repeat;
    background-size:contain;
   
    
   
}
#webtitle{
     width: 30%;
    height: 99%;
   
}
#webtitle h1{
    padding: 40px 0;
  
}
#bismillah{
     width: 50%;
     height: 99%;
     background-image: url(/WebImages/bis3r.png);
     background-repeat: no-repeat;
     background-size: contain;

}
#logoright {
    width: 10%;
    height: 99%;
    background-image: url(/WebImages/LogoRight.png);
    background-repeat: no-repeat;
    background-size:contain;
    background-position: right bottom;
   
}
nav{
    width: 100%;
    /*height:5vh;*/
    display: flex;
    background-image: url(/WebImages/Black11.png); 
    background-image: linear-gradient(to bottom,gray,black); 
   
}

nav #navbar ul{
    list-style: none;
    /* background-image: linear-gradient(to bottom,black, gray); */
   
}
nav #navbar li{
   
    display:inline-block;
    background-image: url(/WebImages/Black11.png); 
   
  
}
nav #navbar li a{
    display: block;
    color:white;
    font-weight: bolder;
    font-family:Arial;
    font-size: 12px;
    width: 90px;
    height: 32px;
      padding: 4px 0;  
      
}
nav #navbar ul li a:hover{
     background-image: url(/WebImages/Black22.png);   
    /* background-image: linear-gradient(to bottom,gray,black); */
   
   
}
nav #searchbar input{
    display: inline-block;
   margin: 5px;
    width: 250px;
   height: 25px;
  border-radius: 10px; 
}
section{
    display: flex;
    /*width:100%;*/
    /*height:65vh*/
}
aside{
    width: 20%;
    height: 75vh;
    /* background-color: aquamarine; */
    
}
aside ul{
    width: 100%;
}
aside ul li{
    display: block;
    background-image: url(/WebImages/Silver1.png);
}
aside ul li a{
    display: block;
    background-image: url(/WebImages/Silver1.png);
    background-size: cover;;
    font-weight: bolder;
    font-size: 12px;
    width: 100%;
    height: 40px;
    padding: 9px 0 0 30px;

}
aside ul li a:hover{
     background-image: url(/WebImages/Silver2.png);
}


#details{
    width: 65%;
    height: 75vh;
 background-image: linear-gradient(to bottom,LightSlateGray , white );
 
}
article{
    width: 15%;
    height: 75vh;
    background-color: aquamarine;
    
}
#box2 ul{
    width: 100%;
}
#box2 ul li{
    display: block;
    background-image: url(/WebImages/Silver1.png);
}

#box2 ul li a{
    display: block;
    background-image: url(/WebImages/Silver1.png);
    background-size: cover;;
    font-weight: bolder;
    font-size: 12px;
    width: 100%;
    height: 40px;
    padding: 9px 0 0 30px;

}
#box2 ul li a:hover{
     background-image: url(/WebImages/Silver2.png);
}
article #box3{
   width: 99%;
   height: 20vh;  
   background-image: url(/WebImages/tolet2.png);
   background-size:contain;


}
footer{
  
    width: 100%;
    height:5vh;
    background-color:rgb(29, 29, 28);
   
    display: flex;
    
   
}
footer p{
    margin: auto;
    text-align: center;
    color: white;
    font-weight: bolder;
}