@media screen and (min-width:601px) {
    h1 {
        color: chartreuse;
        margin-left: auto;
        margin-right: auto;
        font-family: 'Rubik Dirt', cursive;
    }
    h2 { 
        color:  chartreuse;
        opacity: 90%;
        font-family: 'Rubik Dirt', cursive;
    
       
    }
    p {
        color: greenyellow;
        font-family: sans-serif;
        font-size: 12pt;
    }
    #section1 {
        position: absolute;
        height: 500px; 
        margin-left: auto;
        margin-right: auto;
        background-color: hotpink;
        color: aqua;
    }

    .cheese {
        margin: 5%;
    }
    
    .div {
        background-color: greenyellow;
        width: 140px; 
        height: 100%;
        z-index: 30;
        position: absolute;
        margin: 0px;
    }
    body {
        background-color: black;
    }
    .textfield {
        width: 120px;
        margin-left: 10%;
        color: black;
        font-family: 'Rubik Dirt', cursive;
        
    }
    a:hover {
        background-color: black;
        opacity: 50%;
        color: yellowgreen;
        font-family: 'Rubik Dirt', cursive;
    }
    .divmaincontent {
        height: 100%;
        z-index: 2;
        position: relative;
        margin-left: 170px;
        
    }
}
/* style="height: 100%; z-index: 2; position: relative; margin-left: 170px;"*/

@media screen and (max-width:600px){
    h1 {
        color: black;
        font-family: 'Caveat Brush', cursive;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        font-size: 36pt;
    }
    h2 { 
        font-family: 'Caveat Brush', cursive;
        color: darkblue;
        font-size: 30pt;
    }
    body {
        background-color: mintcream;
    }
    p {
        font-family: serif;
        color: darkslategray;
        font-size: 18pt;
    }
    .div {
        background-color: cornflowerblue;
        font-family: 'Caveat Brush', cursive;
        width: 100%;
        height: 90px;
        margin: 0px;
    }
    .textfield {
        width: 90%;
        font-family: 'Caveat Brush', cursive;
        margin-top: auto;
        margin-bottom: auto;
        color: white;
        z-index: 45;
        top: -36px;
        font-size: 14pt;
        text-align: center;
    }
    .divmaincontent {
        margin: 5%;
        width: 90%;
        z-index: 2;
        position: relative;
        height: 100%;
        
    }
    a:any-link {
        color: darkblue;
        text-decoration: none;
    }
    a:hover {
        background-color: darkblue;
        opacity: 50%;
        color: white;
        font-family: 'Caveat Brush', cursive;
    }
    a:visited {
        text-decoration: none;
    }
    #horizontalimg1 {
        margin-left: auto;
        margin-right: auto;
        max-width: 400px;
        max-height: 320px;
    }
    #horizontalimg2 {
        margin-left: auto;
        margin-right: auto;
        max-width: 400px;
        max-height: 268px; 
    }
}