/*=========================================================
VS TECH CCTV SOLUTIONS
Responsive Styles
Version : 1.0
=========================================================*/


/*=========================================================
XXL DEVICES
1400px and below
=========================================================*/

@media (max-width:1400px){

.container{
    max-width:1140px;
}

}


/*=========================================================
LARGE LAPTOP
1200px and below
=========================================================*/

@media (max-width:1200px){

.container{
    max-width:960px;
}

section{
    padding:90px 0;
}

h1{
    font-size:56px;
}

h2{
    font-size:46px;
}

}


/*=========================================================
LAPTOP
992px and below
=========================================================*/

@media (max-width:992px){

.container{
    max-width:720px;
}

section{
    padding:80px 0;
}

h1{
    font-size:48px;
}

h2{
    font-size:40px;
}

h3{
    font-size:28px;
}

.btn-primary-custom,
.btn-outline-custom{

    width:100%;
    justify-content:center;

}

.text-center-lg{
    text-align:center;
}

.mt-lg-40{
    margin-top:40px;
}

}


/*=========================================================
TABLET
768px and below
=========================================================*/

@media (max-width:768px){

.container{
    max-width:540px;
}

section{
    padding:70px 0;
}

h1{
    font-size:42px;
}

h2{
    font-size:34px;
}

h3{
    font-size:26px;
}

h4{
    font-size:22px;
}

p{

    font-size:15px;

}

.section-title{

    text-align:center;

}

.section-description{

    text-align:center;

}

.mobile-center{

    text-align:center;

}

.mobile-hide{

    display:none !important;

}

}


/*=========================================================
MOBILE
576px and below
=========================================================*/

@media (max-width:576px){

.container{

    padding-left:20px;

    padding-right:20px;

}

section{

    padding:60px 0;

}

h1{

    font-size:36px;

}

h2{

    font-size:30px;

}

h3{

    font-size:24px;

}

h4{

    font-size:20px;

}

p{

    font-size:15px;

}

.section-badge{

    font-size:13px;

    padding:7px 16px;

}

.btn-primary-custom,
.btn-outline-custom{

    height:50px;

    font-size:15px;

}

.card-premium{

    border-radius:16px;

}

}


/*=========================================================
SMALL MOBILE
400px and below
=========================================================*/

@media (max-width:400px){

section{

    padding:50px 0;

}

h1{

    font-size:32px;

}

h2{

    font-size:28px;

}

h3{

    font-size:22px;

}

body{

    font-size:15px;

}

.btn-primary-custom,
.btn-outline-custom{

    height:48px;

    font-size:14px;

    padding:0 20px;

}

}


/*=========================================================
LANDSCAPE MOBILE
=========================================================*/

@media (max-height:500px) and (orientation:landscape){

section{

    padding:50px 0;

}

}


/*=========================================================
UTILITY CLASSES
=========================================================*/

.desktop-only{

    display:block;

}

.mobile-only{

    display:none;

}

@media (max-width:768px){

.desktop-only{

    display:none;

}

.mobile-only{

    display:block;

}

}


/*=========================================================
END
=========================================================*/