kayitol.css

*{


    padding: 0;
    margin: 0;
    box-sizing: border-box;
    
    }
    
    
    html { 
      background: url(books.jpg) no-repeat center center fixed; 
      font-family: sans-serif;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
    }
    
    .menu-bar{
      background: black;
      text-align: center;
    }
    .menu-bar ul{
    display:  inline-flex;
    list-style: none;
    }
    
    .menu-bar ul li{
      width: 150px;
      margin: 15px;
      padding: 15px;
     
      }
      .menu-bar ul li a{
    text-decoration: none;
        color: white;
      }
      
      .active, .menu-bar ul li:hover{
        background: #ADD8E6;
        border-radius: 10px;
      }
    
      @import url(https://fonts.googleapis.com/css?family=Open+Sans);
    
      body{
        background: #f2f2f2;
        font-family: 'Open Sans', sans-serif;
      }
      
      .search {
        width: 100%;
        position: relative;
        display: flex;
      }
      
      .searchTerm {
        width: 100%;
        border: 3px solid black;
        border-right: none;
        padding: 5px;
        height: 36px;
        border-radius: 5px 0 0 5px;
        outline: none;
        color: #9DBFAF;
      }
      
      .searchTerm:focus{
        color: black;
      }
      
      .searchButton {
        width: 40px;
        height: 36px;
        border: 1px solid black;
        background: black;
        text-align: center;
        color: #fff;
        border-radius: 0 5px 5px 0;
        cursor: pointer;
        font-size: 40px;
      }
      
     
      .wrap{
        width: 40%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
      }
    
      .menu-bar img{
        
         position: absolute;
    
         left: 0px;
         top: 0px;
         width: 230px;
     
         
      }