@media screen and (max-width:600px) {
    /* HOME PAGE SECTIONS*/
    /* NAV */
    #desktop-nav{
        display: none;
    }

/* HAMBURGER MENU */
    .links-container{
    flex-flow: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: .5rem;
    position: fixed;
    top: 0;
    right: -100%;
    z-index: 10;
    width: 200px;
    transition: .75s ease-out;
    background-color: rgb(253, 243, 211, .3);
    backdrop-filter: blur(20px);
    }

    nav a{
        box-sizing: border-box;
        width: 100%;
        height: auto;
        padding: 20px 30px;
        justify-content: flex-start;
    }

    .close{
        padding: 20px;
        display: block;
    }

    .open{
        display: flex;
        align-items: center;
        justify-content: space-around;
        width: 100%;
    }

    #sidebar-active:checked ~ .links-container{
        right: 0;
    }

    #sidebar-active:checked ~ #overlay{
        height: 100%;
        width: 100%;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 9;
    }

    .home-link img{
        scale: 3.5;
    }

    .links-container{
        & .home-link{
            display: none;
        }
    }

    /* LANDING */
    #landing{
        & .landing-text h1{
            font-size: 70px;
        }

        & .landing-img{
            width: 300px;
            height: 300px;

            & img{
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
        }
    }

    .container{
        padding: 0;
    }

    /* DETS ONE */
    #dets_one{
        & .dets_one_header{
    
            & h2{
                font-size: xx-large;
            }

            & h3{
                font-size: x-large;
            }
        }

        & .dets_one_row{
            width: 280px;
        }
    }

    /* DETS_TWO */
    #dets_two{

        & .square{
            width: 240px;
            height: 240px;
            top: calc(50% - 115px);
            left: calc(50% - 115px);

            & .inner-square{
                & h1{
                    font-size: larger;
                }
            }
        }
    }

    .stack-area{
        flex-flow: column;

        & .left-stack{
            flex-basis: 10%;

            & h2{
                font-size: 60px;
            }
        }

        & .right-stack{
            flex-basis: 30%;
            height: 50vh;
        }
    }

    /* STAR */
    #star{
        margin-top: 4rem;

        & .star_row{

            & .leader{
                width: 300px;
                height: 400px;
            }

            & .text-box{
                width: 300px;
                margin-bottom: 2rem;
            }
        }
    }

    /* PROJECTS */
    #projects{
        margin-top: 4rem;

        .scroller-header{
            font-size: 35px;
        }
    }

    /* FOOTER */
    footer{

        & .foot_row{
            flex-flow: column;
            gap: 4rem;
        }

        & .inner-footer{
            height: 100px;
            display: flex;
            justify-content: center;
            /* align-items: center; */
            flex-flow: column;
            gap: .5rem;
        }
    }

    /* ABOUT PAGE */
    #abt-one{

        & .abt_row_two{

            & .left{
                height: 400px;
                width: 300px;    
            }

            & .right h3{
                text-align: center;
            }
        }
    }

    /* .artistic{
        background-size: contain;
        background-repeat: no-repeat;
    } */

    /* DETS THREE */
    #dets_three{
        min-height: 100vh;
        .scroller-header{
            font-size: 32px;
        }
    }

    .dets_abt{
        margin-bottom: 4rem;
    }

    /* SUSTAINABLE */
    #sustainable{    
        & .sustainable-row{
            gap: 0;
            padding: 0;

            & .left{
                width: 300px;

                & h2{
                    text-align: center;
                }
            }

            & .right{
                width: 300px;
                height: 300px;
                margin-bottom: 2rem;
            }
        }
    }

    /* PROJECTS */
    .proj_abt{
        margin-bottom: 3rem;
    }

    /* STAR ABOUT */
    .star{
        min-height: 120vh;
        & .star_row{
            padding: 0;

            & .leader{
                width: 300px;
                height: 400px;
            }

            & .text-box{
                padding: 10px;
                width: 300px;
            }
        }
    }

    /* CONTACT US */
    #contact-landing{

        & .contact-art{
            
            & h1{
                font-size: 55px;
            }
        }

    }

    #contact-form{

        & .form-header{
            & h4{
                font-size: 60px;
            }
        }

        & form{

            & .form-group{
                width: 250px;
            }
        }
    }
}

@media screen and (max-width:320px) {
    /* HOME PAGE SECTIONS */

    /* LANDING */
    #landing{
        & .landing-img{
            width: 250px;
            height: 250px;
        }
    }

    #dets_two{

        & .square{
            width: 220px;
            height: 220px;
        }
    }

    #star{

        & .star_row{
            & .leader{
                width: 250px;
                height: 350px;
            }
    
            & .text-box{
                width: 270px;
            }
        }
    }

    /* ABOUT PAGE */
    #abt-one{

        & .abt_row_two{

            & .left{
                height: 350px;
                width: 250px;
            }
        }
    }

    /* SUSTAINABLE */
    #sustainable{
        & .sustainable-row{

            & .left{
                width: 250px;
            }
            & .right{
                width: 250px;
                height: 250px;
            }
        }
    }
}