/*=========================================================
        RESPONSIVE.CSS
=========================================================*/


/*==============================
        Large Desktop
===============================*/

@media (min-width:1400px){

.container{

max-width:1320px;

}

.hero-section h1{

font-size:4.5rem;

}

}


/*==============================
        Laptop
===============================*/

@media (max-width:1200px){

.hero-section h1{

font-size:3.4rem;

}

.section-title{

font-size:2.5rem;

}

.timeline-content{

width:42%;

}

}


/*==============================
        Tablet
===============================*/

@media (max-width:992px){

section{

padding:70px 0;

}

.hero-section{

text-align:center;

padding-top:120px;

min-height:auto;

}

.hero-img{

margin-top:40px;

max-width: 100%;

margin-left:auto;

margin-right:auto;

}

.navbar-collapse{

background:#fff;

padding:20px;

border-radius:15px;

margin-top:15px;

box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.nav-link{

margin:10px 0;

}

.timeline::before{

left:30px;

}

.timeline-item{

flex-direction:row!important;

padding-left:70px;

}

.timeline-icon{

position:absolute;

left:0;

}

.timeline-content{

width:100%;

}

.contact-section .row{

row-gap:40px;

}

}


/*==============================
        Mobile
===============================*/

@media (max-width:768px){

.hero-section h1{

font-size:2.4rem;

}

.hero-section .lead{

font-size:1rem;

}

.section-title{

font-size:2rem;

}

.btn{

width:100%;

margin-bottom:15px;

}

.about-card{

padding:25px;

}

.about-icon{

width:70px;

height:70px;

font-size:1.7rem;

}

.gallery-card img{

height:220px;

}

.stat-card{

padding:20px;

}

.registration-card .card-body{

padding:25px;

}

.contact-form{

padding:25px;

}

.footer{

text-align:center;

}

.scroll-top{

right:20px;

bottom:20px;

width:50px;

height:50px;

}

}


/*==============================
        Small Mobile
===============================*/

@media (max-width:576px){

.hero-section{

padding-top:100px;

}

.hero-section h1{

font-size:2rem;

}

.hero-tag{

font-size:.8rem;

}

.logo{

width:45px;

}

.navbar-brand h5{

font-size:.9rem;

}

.section-title{

font-size:1.8rem;

}

.timeline-item{

padding-left:60px;

}

.timeline-icon{

width:55px;

height:55px;

font-size:1.2rem;

}

.timeline-content{

padding:18px;

}

.gallery-card img{

height:200px;

}

.about-card{

padding:20px;

}

.contact-section iframe{

height:250px;

}

}


/*==============================
        Ultra Small
===============================*/

@media (max-width:380px){

.hero-section h1{

font-size:1.8rem;

}

.btn{

font-size:.9rem;

padding:10px 18px;

}

.section-title{

font-size:1.6rem;

}

.hero-img{

max-width:280px;

}

.about-icon{

width:60px;

height:60px;

font-size:1.3rem;

}

.gallery-card img{

height:180px;

}

}


/*=========================================================
        END
=========================================================*/