/*==================================================
responsive.css
==================================================*/

/***********************
1400px
************************/

@media (max-width:1400px){

.container{

max-width:1140px;

}

.hero h1{

font-size:3.7rem;

}

.section-title{

font-size:2.4rem;

}

}

/***********************
1200px
************************/

@media (max-width:1200px){

.hero{

padding-top:160px;

}

.hero h1{

font-size:3.2rem;

}

.display-5{

font-size:2.5rem;

}

.py-6{

padding:100px 0;

}

.service-card{

padding:32px;

}

.portfolio-body{

padding:25px;

}

}

/***********************
992px
************************/

@media (max-width:992px){

.navbar{

padding:15px 0;

}

.navbar-collapse{

padding-top:25px;

}

.nav-link{

margin-left:0;

padding:12px 0;

}

.hero{

text-align:center;

padding-top:140px;

}

.hero .row{

flex-direction:column-reverse;

}

.hero img{

max-width:80%;

margin:0 auto 60px;

}

.hero h1{

font-size:2.9rem;

}

.hero .lead{

font-size:1.15rem;

}

.hero .d-flex{

justify-content:center;

}

.section-title{

font-size:2.2rem;

}

.about{

text-align:center;

}

.about img{

margin-bottom:50px;

}

.cta-section{

text-align:center;

}

.footer{

text-align:center;

}

.footer .social-links{

justify-content:center;

}

}

/***********************
768px
************************/

@media (max-width:768px){

.display-3{

font-size:2.6rem;

}

.display-5{

font-size:2rem;

}

.hero{

padding-top:130px;

}

.hero img{

max-width:100%;

}

.hero h1{

font-size:2.5rem;

}

.hero .lead{

font-size:1.05rem;

}

.section-title{

font-size:1.9rem;

}

.section-description{

font-size:1rem;

}

.py-6{

padding:80px 0;

}

.service-card{

padding:28px;

}

.process-box{

padding:26px 18px;

}

.process-number{

width:48px;
height:48px;

font-size:1rem;

}

.portfolio-body{

padding:22px;

}

.cta-section h2{

font-size:2rem;

}

.btn-lg{

width:100%;

margin-bottom:12px;

}

}

/***********************
576px
************************/

@media (max-width:576px){

.navbar-brand img{

height:42px;

}

.hero{

padding-top:120px;

}

.hero h1{

font-size:2.1rem;

line-height:1.2;

}

.hero .lead{

font-size:1rem;

}

.section-title{

font-size:1.7rem;

}

.service-card{

padding:24px;

border-radius:18px;

}

.service-icon{

width:60px;

height:60px;

}

.service-icon i{

font-size:28px;

}

.process-box{

padding:22px 14px;

}

.process-number{

width:44px;
height:44px;

font-size:.95rem;

}

.portfolio-card{

border-radius:18px;

}

.scroll-top{

width:42px;

height:42px;

bottom:18px;

right:18px;

}

.footer{

padding:70px 0 30px;

}

.footer h5{

margin-top:20px;

}

.social-links a{

width:38px;

height:38px;

}

}

/***********************
400px
************************/

@media (max-width:400px){

.hero h1{

font-size:1.85rem;

}

.section-title{

font-size:1.5rem;

}

.btn{

font-size:.95rem;

padding:13px 20px;

}

.hero .badge{

font-size:.75rem;

}

}

/***********************
Landscape Phones
************************/

@media (max-height:500px){

.hero{

min-height:auto;

padding:160px 0 80px;

}

}

/***********************
Large Screens
************************/

@media (min-width:1600px){

.container{

max-width:1380px;

}

.hero h1{

font-size:4.8rem;

}

.display-5{

font-size:3.2rem;

}

.section-title{

font-size:3rem;

}

}

/***********************
Print
************************/

@media print{

.navbar,
.footer,
.cta-section{

display:none;

}

body{

background:#fff;

color:#000;

}

a{

text-decoration:none;

color:#000;

}

}