@media screen and (max-width: 1024px) {
     .apple {
        padding-right: 2%;
    }
    
    .topwindowout {
        margin-left: 20.3125%; /*20.3125%*/
        width:79.6875%;
    }
    
    .topwindowin {
        margin-left: 1%;
        margin-right:1%;
        width: 97.5%;
    }
    
    .navtext {
        font-size: 2em;
        margin-left: 3%;
        margin-top: .5em;
    }
    
    .midwindowtext {
        margin-left: 9%;
    }
    
    .midwindowmid {
        margin-left: 1px;
    }
    
    .backwindowtoptext {
        font-size: 2.4em;
        margin-left: 33%
    }
    
     .backwindowtext {
         margin-left: 8%;       
    }
    
    h1 {
        margin-left: 1%;
        margin-top: 60px;
    }
    
    h2 {
        margin-left: 1%;
        margin-top:15px;
    }
    
    h3 {
        margin-left:.5%;
    }
}
}

@media screen and (max-width: 768px){    
    .apple {
        padding-right: 2%;
    }
    
    .topwindowout {
        margin-left: 20.3125%; /*20.3125%*/
        width:79.6875%;
    }
    
    .topwindowin {
        margin-left: 1%;
        margin-right:1%;
        width: 97.5%;
    }
    
    .navtext {
        font-size: 2em;
        margin-left: 3%;
        margin-top: .5em;
    }
    
    .midwindowtext {
        margin-left: 9%;
    }
    
    .midwindowmid {
        margin-left: 1px;
    }
    
    .backwindowtoptext {
        font-size: 2.4em;
        margin-left: 33%;
        content: 'tablet ver.';
    }
    
     .backwindowtext {
         margin-left: 8%;       
    }
    
    h1 {
        margin-left: 1%;
        margin-top: 60px;
    }
    
    h2 {
        margin-left: 1%;
        margin-top:15px;
    }
    
    h3 {
        margin-left:.5%;
    }
}

@media screen and (max-width: 500px){
    .apple {
        padding-right: 4%;
    }
    
    .navtext {
        font-size: 2em;
        margin-left: 4%;
        margin-top: .5em;.5
    }
    
    .backwindowtoptext {
        font-size: 2.2em;
        margin-left: 25%;
        margin-top: 18px;
    }
    
    .topwindowin {
        margin-left: 1.5%;
        width: 96.5%;
    }
    
    .topwindowout {
        margin-left: 1.25%;
        margin-right: 1.25%;
        margin-top: 70px;
        width:98.5%;
        }
    
    p {
        margin-left: 4%;
    }
    
    h1 {
        margin-left: .5%;
        margin-top: 60px;
        font-size:3.5em;
    }
    
    h2 {
        margin-left: .25%;
        margin-top: 15px;
        font-size: 2em;
    }
    
    h3 {
        margin-left: 3.5%;
        font-size: 1em;
    }
    
    .backwindow {
        height:300px;
    }
    
    .backwindowbottom {
        display:none;
    }
}