/*Mobile*/
@media only screen and (max-width: 799px){
    html{
        font-size: 20px;/*set the base font size to be used*/
    }

    nav{/*Make size adjustments for mobile*/
        width: 100%;
        height: 100px;

        padding: 0;
    }

    nav a{
        color: #CFDFE6;
        text-decoration: none;
    }

    footer{
        padding-left: 5%;
        padding-right: 5%;
        width: 90%;
        min-height: 100px;
    }
    
    /*STYLING FOR CLASSES*/
    .btn img{
        height: 55px;
        width: auto;
    
        float: left;
        margin-right: 35px;
        margin-left: 15px;
        margin-top: 23px;
    }
    
    .btn_main img{
        height: 90px;
        width: auto;
    
        float: center;
        margin-right: 30px;
        margin-left: 30px;
        margin-top: 5px;
    }
    
    .btn_social img{
        width: 60px;
        height: auto;
        padding-left: 10px;
        padding-right: 10px;
    }

    .mob_nav_btn img{
        height: 40px;
        width: auto;

        padding-left: 15px;
        padding-right: 20px;
    }
    
    .float_img_clear{
        clear: left;
    }

    .background-light{
        min-height: 30vh;
    }
    
    .background-dark{
        min-height: 30vh;
    }

    .viewport-top-pad-25{
        margin-top: 15vh;
    }

    .proj-group{
        width: 85vw;
        height: auto;
        float: left;
        font-size: 1.5em;
    }

    .proj-image{
        width: 85vw;
        padding-top: 1em;
        padding-left: 0.5em;
        float: none;
    }

    .about-image{
        float: none;
    }

    .project-links{
        float: none;
        width: 100%;
    }

    .project-click{
        width: 10%;
    }

    .youtube-embed-size{
        width: 85vw;
        height: 35vh;
    }
    
    .profile-image{
        width: fit-content;
        height: auto;
    }

    .profile-image img{
        width: 80%;
    }
    
    .profile-padding{
        width: 100%;
        height: 2vh;
    }
    
    .profile-text{
        width: 100%;
        text-align: left;
        padding-bottom: 5vh;
    }
    
    /*STYLING FOR IDS*/
    #desk_btn_bar{
        display: none;
    }

    #mob_btn_bar{
        width: 100%;
        height: 100%;
    }

    #mob_btn_block{
        background-color: black;
        border: #FFFFFF;
        position: fixed;
        top: 97px;
        padding: 5%;
        padding-bottom: 0;

        width: 90%;
        font-size: 1.5em;

        display: none;

        font-family: 'Fredoka', sans-serif;
        font-weight: 500;
    }

    #youtube img{
        width: 85vw;
        padding-top: 1em;
    }

    #intro_section img{
        max-width: 95vw;
        padding-top: 15vh;
        padding-bottom: 15vh;
    }
    
    #footer_copy{
        padding-top: 15px;
        width: 100%;
        text-align: center;
    }
    
    #footer_logo{
        padding-top: 15px;
        width: 100%;
        text-align: center;
    }
    
    #footer_social{
        width: 100%;
        text-align: center;
    }
    
    #footer_logo_img{
        height: 130px;
        width: auto;
    }
}