@import 'https://fonts.googleapis.com/css?family=Roboto:300,500,700';

html {
  text-align: center;    
  width: 1250px;
}

body
    {   
        min-height: 100%;
        background-color: white
    }

ul
    {
        list-style-type: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background-color: steelblue;
        font-family:'Roboto';
        width: auto;
    }

li 
    {
        float: left;
    }

li a
    {
        display: inline-block;
        color: black;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
        transition: none;
    }   


h1
    {   color: black;
        font-family: 'Roboto';
        font-size: 58px;
        margin-left: 0px;
        padding-left: 50px;
        margin-top: 50px;
        text-align: left;
        width: auto;
    
    }

h2  
    {   
        color: black;
        font-family: 'Roboto';
        font-size: 24px;
        padding left: 10px;
        margin-top: 0px;
        text-align: left;
        width: auto; 
    }

h3  
    {
        background-color: steelblue;
        color:white;
        font-family: 'Roboto';
        font-size: 26px;
        margin-top: 100px;
        text-align: center;
        width: auto;
    }
h4
    {
        background-color: white;
        color: black;
        font-family:'Roboto';
        font-size: 13px;
        margin-left: 80px;
        text-align: center;
     }

footer
        {  
            color: dimgrey;
            font-family:'Roboto';
            margin-top: 700px;
            font-size: 10px;
            text-align: center;
            width: auto;
        }

@media screen and (max-width:500px) {
    html {
  text-align: center;    
  width: 100%;
}
    
    li {float:none;}
	h1 {width: 100%; font-size: 21px; margin-top: 300px;}
    h2 {width: 100%; font-size: 23px; }
    h3 {margin-top: 0px; width: 100%; text-align: left;} 
    h4 {margin-top: 100px; width: 100%; text-align: left; font-size: 10px; margin-left: 12px;}
    footer
        {margin-top: 100px; width: 100%; font-size: 7px;}
    
}