/*=========================================
Responsive CSS
River Fountain
==========================================*/

/* Large Devices */
@media (max-width: 1199px){

.container{
    max-width:960px;
}

.hero-title{
    font-size:48px;
}

.section-title{
    font-size:36px;
}

}

/* Medium Devices */
@media (max-width:991px){

.container{
    max-width:720px;
}

.topbar{
    display:none;
}

.navbar-nav{
    text-align:center;
}

.navbar-nav .nav-item{
    margin:10px 0;
}

.hero-section{
    padding:80px 0;
}

.hero-title{
    font-size:40px;
}

.section-title{
    font-size:32px;
}

.about-image{
    margin-top:30px;
}

.service-card{
    margin-bottom:30px;
}

.project-card{
    margin-bottom:30px;
}

.blog-card{
    margin-bottom:30px;
}

.footer-widget{
    margin-bottom:40px;
}

}

/* Tablet */
@media (max-width:767px){

.container{
    max-width:100%;
}

.hero-section{
    text-align:center;
    padding:70px 0;
}

.hero-title{
    font-size:34px;
}

.hero-subtitle{
    font-size:18px;
}

.section-title{
    font-size:28px;
}

.page-banner{
    padding:60px 0;
    text-align:center;
}

.page-banner h1{
    font-size:34px;
}

.about-image img,
.project-card img,
.blog-card img,
.service-card img{
    width:100%;
    height:auto;
}

.counter-box{
    margin-bottom:25px;
}

.team-card{
    margin-bottom:30px;
}

.testimonial-card{
    margin-bottom:30px;
}

.contact-form{
    margin-top:30px;
}

.footer{
    text-align:center;
}

.footer-widget{
    margin-bottom:35px;
}

}

/* Mobile */
@media (max-width:575px){

.hero-section{
    padding:50px 0;
}

.hero-title{
    font-size:28px;
    line-height:1.4;
}

.hero-subtitle{
    font-size:16px;
}

.section-title{
    font-size:24px;
}

.page-banner{
    padding:45px 0;
}

.page-banner h1{
    font-size:26px;
}

.btn{
    width:100%;
    margin-bottom:10px;
}

.navbar-brand img{
    max-height:55px;
}

.logo img{
    max-width:180px;
}

.service-card,
.project-card,
.blog-card,
.team-card,
.testimonial-card{
    margin-bottom:25px;
}

.blog-image img{
    height:220px;
    object-fit:cover;
}

.sidebar{
    margin-top:40px;
}

.blog-details img{
    width:100%;
    height:auto;
}

table{
    display:block;
    overflow-x:auto;
}

iframe{
    width:100%;
}

}

/* Extra Small */
@media (max-width:400px){

.hero-title{
    font-size:24px;
}

.section-title{
    font-size:22px;
}

.page-banner h1{
    font-size:22px;
}

.navbar-brand img{
    max-height:45px;
}

}