body{
    background-color:#f7f9f9; 
    color:#121010;  
    font-family:Arial, Helvetica, sans-serif;
    font-size:18px;
    font-weight:normal;
    line-height:1.4em;
    margin:0;
   
   } 

header {

    background-color:#ffffff ;
    width:100%;
    color:#fff;
    
}

h1 {
    text-align:center;
    background-color:#ffffff; 
    color:#333;  
    font-family:Arial, Helvetica, sans-serif;
    font-size:40px;
    
}

  

   #navbar{
    background-color:#ffffff ;
    color:#fff;
   }

   #navbar ul{
    padding:0;
    list-style:none;
    }

    #navbar li{
        display:inline;

    }

    #navbar a{
        color:#fff;
        text-decoration:none;
        font-size: 20px;
        padding-right:20px;
    }

   

   #main-header{
    text-align:center;
    margin-top: 50%;
  
    color:rgb(36, 35, 35);

   }

   .compare{
   
    padding-left: 10%;
    
    align-content: center;
    align-items:stretch;
  }


   #showcase{
      
    text-align:center;

   /*
    min-height:500px;
     */
   }

   img {
    max-width: 100%;
    height : auto;

   }

   #showcase h1{
    color:white;
    font-size: 50px;
    line-height:1.6em;
    padding-top: 30px;

   }

   #main{
    float:left;
    width:100%;
    padding:0 45px;
    box-sizing:border-box;

   }

   #sidebar{
    float:right;
    background:#333;
    color:#fff;
    width:30%;
    padding:10px;
    box-sizing:border-box;
   }

   #main-footer{
    background:#ffffff;
    color:#fff;
    text-align:center;
    padding: 20px;
    margin-top: 40px;

   }

   @media(max-width:600px){
    #main{
        width:100%;
        float:none;
    }

    #sidebar{
        width:100%;
        float:none;
    }

   }