:root {
    --color1:#18E0FF;
    --color2:#FACF39;
    --color3:#354A5F;
  }


.height-33-container p{
    font-family: 'Roboto Slab', serif;
    color:white;
    font-size: 22px;
    text-shadow: 1px 1px 15px black;
}


#photo-section2{
    display:none;
}

.our-fleet-cover-button 
{
    background-color:var(--color1);
    opacity:0.9;
    padding:1vh;
    font-weight: bold;
}

.index-cover-title, h1{
    color: white;
    padding:2vw;
    margin:0;
}




.cover h2{
    font-family: 'Roboto Slab', serif;
    font-weight: 400;
}


/*START Contact Form CSS*/
.contact-container{
    background:linear-gradient(var(--color3), var(--color1));
    display: flex;
    align-items: center;
    flex-direction: column;
}
/*Contact-Left side of container*/
.contact-left{
    display: flex;
    flex-direction: column;
    gap:1rem;
    align-items: center;
    
}
.contact-left-title h2{
    font-weight:600;
    color:var(--color2);
    font-size: 2rem;
    margin-bottom: 0.35rem;
}

.contact-left-title hr{
    border:none;
    Width:13rem;
    height:0.2rem;
    background-color: var(--color2);
    border-radius: 0.9rem;
    margin-bottom: 1.8rem;
}
.contact-inputs{
    width: 80vw;
    height:4rem;
    border:none;
    outline:none;
    padding-left:2rem;
    font-weight: 500;
    color:#666;
    border-radius:3.5rem;
}

.contact-left textarea{
    height:10rem;
    padding-top:1.1rem;
    border-radius:1.8rem;
}
.contact-inputs:focus{
    border:0.2rem solid var(--color2);
}
.contact-inputs::placeholder{
    color:#a9a9a9;
}

.contact-left button{
    background-color: var(--color2); /*rgba(166, 59, 0, 0.7);*/
    box-shadow: 1px 1px 3px rgba(0,62,69,0.3);
    border-radius: 5px;
    border:2px solid rgba(53, 74, 95,0.9);
    text-decoration: none;
    font-size: 2.5vh;
    color:rgba(0,62,69,0.9);
    padding:1vh;
    font-family: 'Montserrat', sans-serif;
    letter-spacing: 3px;
    transition: 0.55s;
    opacity:0.7;
    margin:1rem;
}

/*END Left Side of Container*/
 /*Right Side of Container*/
 #paragraph-apology {
    padding: 0 2rem;
}

/*End Right side of container*/

/*END CONTACT FORM CSS*/


/*from old website css*/
.cover{
    background:url(../images/Responsive/Phone/student_pilot_license_san_diego_with_instructor.jpg) 50% no-repeat;
    background-size: cover!important;
}
.height-33-container p{
    font-family: 'Roboto Slab', serif;
    color:white;
    font-size: 22px;
    text-shadow: 1px 1px 15px black;
}





.index-cover-title, h1{
    color: white;
    padding:2vw;
    margin:0;
}

#never-drive-boring{
    font-size: 2em;
    font-weight: 600;
    font-family: 'Roboto', serif;
    text-shadow: 1px 1px 5px rgba(0,62,69,0.5);
    margin:0;
    padding-top:4vw;
}

#proximity-car-rental{
    font-family: 'Roboto Slab', serif;
    font-size: 1.5em;
    font-weight: 400;
    
    text-shadow: 1px 1px 5px rgba(0,62,69,0.5);
}

.cover h2{
    font-family: 'Roboto Slab', serif;
    font-weight: 400;
}

#index-cover-button, #index-cover-button-2{
    padding:1.5vh 2vw;
}

#index-cover-button-2{
    color:var(--color2);
    border:2px solid #e6f4f1;
}

#index-cover-button-2:hover{
    background-color:rgba(166, 59, 0, 0.4)
}

    
@media all and (min-width:480px){
    .cover{
        background:url(../images/Desktop/san_diego_private_pilot_intro_flight_lesson.jpg) 50% no-repeat;
    }
    .contact-left-title h2{
        font-size: 3rem;
    }

    .contact-left-title hr{
        Width:19rem;
        height:0.35rem;
    }
   
}

@media all and (min-width:600px){
    #never-drive-boring{
        font-size:50px;
    }

}

@media all and (min-width:900px){
    #never-drive-boring{
        font-size:65px;
    }

    .width-30-desktop{
        width:35vw;
    }
}
/*end from old website CSS*/


@media all and (min-width:900px){
   
    #photo-section2{
        
        display: flex;
        align-self:stretch;
        width:30vw;
        justify-content: space-evenly;
    }
    .photo-section-photo{
        width:80%;
    }

    /*START Contact Form (Media Query)*/
    .contact-container{
        flex-direction: row;
        align-items: center;
        justify-content: space-evenly;
    }
    
    .contact-left{
        width: 70vw;
        padding:0 2rem 2rem 2rem;
    }
    .contact-photo{
        width:80%;
    }
    .contact-inputs{
        width: 100%;
    }
    /*End Contact Form (Media Query)*/
}