/* Small devices (landscape phones, 576px and up) */
@media (min-width: 220px) and (max-width: 576px) {
    .container{
        width: 100%;
        max-width: 100vw;   
        padding: 0 1rem;
    }
    .header,
    .footer{
        width: 100vw;
    }
    
    .header{
        overflow: hidden;
		height: 150px;
    }
	
	header.fixed {
		height: 100px;
	}
    
    .flex-row{
        flex-direction: column;
    }
    
    .flex-space-btwn{
      justify-content: center;    
    }
        
    .hero{
        width: 100vw;
		height: 830px;
        background-position: top left;
    }
    
    .site-logo,
    .site-info{
        flex: 0 0 98%;
        max-width: 98%;
    }
    
    .site-logo img{
        height: 65px;
        text-align: center;
    }

    .site-info img{
        height: 80px;
        text-align: center;    
    }

    .spacer{
        display:none;
    }
    
    
    .admission-form {
        flex: 0 0 98%;
        max-width: 98%;
        position: absolute;
        top: 50px;
        padding:0px;
    }
    
    .gen-form{
        width: 100%;
        position: relative;
        max-width: 100%;
    }
    
    .section-left,
    .section-right{
        flex: 0 0 98%;
        max-width: 98%;
    }
    
    .section-right{
        background-position: top center;
        background-position: calc(50% + 105px) calc(50% + 10px);
    }
    
    .section-left h1{
        font-size: 35px;
    }
    
    .section-left p{
        font-size: 20px;
        line-height: 30px;
    }
    
    .slide-show{
        width: 100vw;
        padding: 0.5rem;
    }
    .slider{
        width: 100vw;
    }
    
    .text-section{
        left:10px;
        right: 10px;
        width: 94%;
        min-height: 100px; 
        height: auto;
        padding-bottom: 2rem;
    }
    
    .text-section h1{
         font-size: 35px;
    }
    
    .testimonial-slider{
        top:10px;
        border:0px solid red;
    }
    
    .testimonial-content{
        width: 98%;
        padding:0.5rem 1rem;
        transform: translate(-50%, -35%);
    }
    
    .testimonial-content p{
        font-size: 14px;
        letter-spacing: 1px;
        word-spacing: 1px;
    }
    
    .contact{
        width: 95%;
        left: 10px;
        right: 10px;
    }
    
    .contact h3{
        padding-top: 20px;
    }
    
    .contact .flex-row{
        flex-direction: row;
    }
}


/* Medium devices (tablets, 768px and up) */
@media (min-width: 577px) and (max-width: 992px) {

    .container{
        width: 100%;
        max-width: 100vw;   
        padding: 0 1rem;
    }
    .header,
    .footer{
        width: 100vw;
    }
    
    .header{
        overflow: hidden;
    }
    
    .site-logo img{
        height: 80px;
        text-align: center;
    }

    .site-info img{
        height: 80px;
        text-align: center;    
    }
    
    
    
    .spacer{
         flex: 0 0 38%;
        max-width: 38%;
    }

    .admission-form {
        flex: 0 0 58%;
        max-width: 58%;
        display: flex;
        padding:0px;
    }    

     .section-left h1{
        font-size: 35px;
    }
    
    .section-left p{
        font-size: 20px;
        line-height: 30px;
    }
   
        .testimonial-slider{
        top:10px;
        border:0px solid red;
    }
    
    .testimonial-content{
        width: 98%;
        padding:0.5rem 1rem;
        transform: translate(-50%, -35%);
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 993px) {
  /* CSS rules specific to extra large devices */
 
}