Template:Wiki Club Deoband/hero.css

  .wcd-hero {
   background:linear-gradient(to bottom,#FFF,#c1d2e5);
  
    display: flex;
    flex-direction:column;
    align-items: center;
    justify-content: center;
    padding-bottom:5px;
   }
 
 .wcd-hero  ul {
   gap: 5px;
   list-style-type:none;
   list-style-image: none;
   display: flex; /* grid-column: 2; */ 
   flex-wrap:wrap; 
   align-items: flex-start;
   flex-direction: row;
   margin:5px;
  }
  .wcd-hero ul li  a {
   font-family: "Tajawal",sans-serif;
   color:#000000;
   display: flex;
    align-items: center;
    padding: 8px 20px;
    font-weight:600;
    text-decoration: none;
   }

 .wcd-hero ul li {
   border-radius: 50vh ;
 } 

 .wcd-hero ul li:hover {
   background: #42c181;
  
  }

  .wcd-hero ul li:hover a {
   color:white;
 }
 .wcd-hero ul li.selected {
     background: #339966;
 }
 .wcd-hero ul li.selected a {
   color:white;
 }

 .wcd-hero .header{
   display:flex;
   flex-direction:row;
   width:100%;
   gap:10px;
   align-items:center; 
   margin-top:20px;
 }
 .wcd-hero .header .logo {
   width:180px;
   height:150px;
   background:url("https://upload.wikimedia.org/wikipedia/commons/0/0f/Circle_-_Darul_Uloom_Deoband.png") no-repeat;
   background-position:center; 
   background-size:150px;
 }
 .wcd-hero .header .title{
    flex:1;
    color:#405070; 
  }
 .wcd-hero .header div {
    text-align:center;
  }

@media (max-width: 800px) {
  .wcd-hero .header {
     flex-direction:column;
  }
  .wcd-hero .header .title {
  	 display:none;
  }
}