/* Phone */
@media (min-width:0px) and (max-width:700px){

    .navbarLogo{width:40vw;
    height:auto;}

    /*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ Index.html @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
    /* ------------------------------------ Hero Section ------------------------------------ */
    .heroSection{height:650px;}

    .gradientCover{height:650px;}

    .heroDescriptor{width:90vw;
        margin:auto;
        margin-top:100px;
        display:flex;
        flex-direction:column;
        align-items: center;
        justify-content: space-evenly;}

    /*.heroDescriptor > p, h1{width:90%;
        margin:auto;}*/

    .heroDescriptor > button{margin:auto;
    margin-top:10px;}

    .gradientCover{background: rgb(114,114,114,0.5);}
    /* ------------------------------------ End of Hero Section ------------------------------------ */
    /* ------------------------------------ Plan Section ------------------------------------ */

    #cardContainer{display:none!important;}

    #cardAccordionContainer{display:flex;
    width:100%;}

    #cardAccordionContainer > *{width:100%;}

    .planSection{background-size:cover;
    display:flex;
    flex-direction: column;}

    .planGradient{display:none;}

    .planDescription{width:85vw;
    margin-bottom:30px;
    padding:20px;}

    .planContainer{width:100vw;}

    .plan{width:90%;
    height:500px;}

    .planHeader > h1{padding:5px !important;}

    /* ------------------------------------ End of Plan Section ------------------------------------ */

    /* ------------------------------------ Contact Section ------------------------------------ */

    .contactSection{padding-bottom:20px;
    padding-top:20px;
    height:auto;}

    .contactImg{display:none;}

    .inputContainer{min-width:100%;
    justify-content: start;}

    .inputContainer > h1{margin-top:0px;
    margin-bottom:0px;
    text-align:center;}

    .contactInput{margin-left:auto;}

    /* ------------------------------------ End of Contact Section ------------------------------------ */

    /*------------------------------------------ Providers Section ------------------------------------------ */

    .sliderContainer{width:200vw;}

    .imgSlider{min-width:400%;
    animation: 20s slide infinite linear;}

    /*------------------------------------------ End of Providers Section ------------------------------------------ */
    
    /* ------------------------------------ Questions Section ------------------------------------ */

    .questionsContainer{flex-direction:column;}

    .questionsText{display:none;}

    .questionsText > p{display:none;}

    .accordionContainer{min-width: 90%;}

    .accordionTitle{display:flex;
    text-align:center;
    align-items: center;}

    .accordionTitle > h1{height:50px;}

    /* ------------------------------------ End of Questions Section ------------------------------------ */

    /* ------------------------------------ Footer ------------------------------------ */

    .footerSection{flex-direction:column-reverse;}

    .footerSection > div{width:90%;}

    .footerSection > div > a{font-size:25px;
    margin-top:15px;
    margin-bottom:15px;}

    .phoneLink{display:block;}

    #footerLogo{width:90%;}

    /* ------------------------------------ End of Footer ------------------------------------ */
    /*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ End of Index.html @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
    /*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ Contact.html @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */

    #contactHeroSection{display:flex;
    flex-direction:column;
    height:auto;}

    #contactHeroDescriptor{margin-top:0px;
    height:300px;
    margin-bottom:10px;
    justify-content: space-around;}

    #conHeroText2{top:15px;}

    .contactFormContainer{width:100%;}

    .contactPageForm{margin-top:0px;
    min-width:0px;}

    .contactArrow{display:none;}

    .contactHeroText{text-align: center;}

    /*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ End of Contact.html @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */

    /*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ About.html @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */

    #aboutHeroSection{height:auto;}

    #aboutTitle{width:90vw;
    height:auto;
    margin: auto;
    margin-top:15vh;
    margin-bottom: 0px;}

    .descriptionSection{height:auto;
    flex-direction:column-reverse;}

    .descriptionSection > p{width:95%;}

    .descriptionImg{width:50%;
        margin:auto;}

    #aboutRoundedFlag{width:80%;}

    /*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ End of About.html @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */

    /* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ Services.html @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */

    #servicesHeroSection{height:650px;
    background-position:10%;
    background-size:175vh;}

    #servicesHeroSection > .heroDescriptor{width:90%;
    margin-top:115px;}

    #servicesHeroSection > .heroDescriptor > p::before{
        content:"Choosing the right insurance plan is essential for your security and peace of mind. At Genesis Life & Health, we simplify the insurance process to help you find the best health, life, or business coverage tailored to your needs. Our expert team guides you through the options without the usual hassle.";
    }
    
    #servicesHeroSection > .heroDescriptor > p{width:95%;
        font-size: 18px;
    }
    
    /*@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ End of Services.html @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
}