@media(max-width: 820px){

    body {
        margin: 0rem;
        padding: 0rem;
    }

    .hideOnMobile {
        display: none;
    }

    .main-logo {
        width: 5.5rem;
        height: 5.5rem;
   }
    .navbar-button {
        display: block;
    } 

    .blank {
        display: none;
    }

    .romance-texts h1 {
       font-size: 3rem;
    }

    .header-btn {
        width: 15rem;
        height: 3.3rem;
        border-radius: 5px;
        padding: .8rem;
        font-size: 1.3rem;
    }

    .page2-images {
       flex-direction: column;
    }

    .page2-images img {
       width: 70%;
       height: auto;
       margin: 0 auto;
    }

    .dots {
        gap: 1.3rem;
    }

   .icon-dot {
        width: 1.3rem;
        height: 1.3rem;
       
    }

}


@media(max-width: 450px){
    .romance-texts h1 {
       font-size: 2.2rem;
       
    }

}


@media(max-width: 465px){
    .sidebar {
        width: 100%;
    }

}