
/* Tablet Portrait Only */
@media (min-width: 600px) and (max-width: 899px) {
    .paradoxTitle{
        font-size: clamp(2rem, 5vw + 1rem, 2.5rem);
    }
}

/* Tablet Portrait */
@media (min-width: 600px) {
    .paradoxTitle{
        font-size: clamp(2rem, 5vw + 1rem, 2.5rem);
    }
}


/* Tablet Landscape only */
@media (min-width: 900px) and (max-width: 1199px) {
    .paradoxTitle{
        font-size: clamp(2rem, 5vw + 1rem, 2.5rem);
    }

}


/* Tablet */
@media (min-width: 900px) {
    .mainSection{
        margin-block: auto;
    }
    #parallex{
        background-size: 25%;
    }
    .paradoxTitle{
        font-size: clamp(2rem, 5vw + 1rem, 2.5rem);
    }
}

/* Monitors only*/
@media (min-width: 1200px) and (max-width: 1799px) {
}


/* Desktops */
@media (min-width: 1200px) {
}

/* Big Displays */
@media (min-width: 1800px) {
}


/* Phone view */
@media (max-width: 599px) {

    :root{
        --heading-font-size: 3rem ;
        --subheading-font-size: 1.6rem;
        --button-font-size:1.4rem;
    }
    .mobileView{
        display: block;
        margin-block-start: 50px ;
      }
    .mainSection{
        display: none;
    }
    .col img {
        width: 4.5rem;
      }

    .col h2{
        width: 100%;
    }
    .col{
        width: 50%;
    }
    .full{width: 100%;}

    #parallax{
        min-height:28vh;
        background-position: 50% 80%;
        background-size: 40%;
    }
    .popup{
        width: 90%;
    }
    .paragraph h2{
        font-size: 1.35em;
      }
}