/*=========================================================
                    RESPONSIVE.CSS
        Global Responsive Utilities
==========================================================*/


/*=========================================================
                    LARGE DEVICES
        (1200px and below)
==========================================================*/

@media (max-width:1200px){

.container{

    max-width:1140px;

}

}


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

@media (max-width:992px){

.container{

    max-width:960px;

}

body{

    overflow-x:hidden;

}

.hide-tablet{

    display:none !important;

}

.text-center-tablet{

    text-align:center !important;

}

.w-tablet-100{

    width:100% !important;

}

}


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

@media (max-width:768px){

.container{

    max-width:720px;

}

.section-padding{

    padding:60px 0 !important;

}

.hide-mobile{

    display:none !important;

}

.text-center-mobile{

    text-align:center !important;

}

.w-mobile-100{

    width:100% !important;

}

.mobile-flex-column{

    display:flex;
    flex-direction:column;
}

.mobile-gap{

    gap:20px;

}

.mobile-mt{

    margin-top:25px;

}

.mobile-mb{

    margin-bottom:25px;

}

.mobile-p{

    padding:20px !important;

}

.mobile-scroll{

    overflow-x:auto;

}

}


/*=========================================================
                SMALL MOBILE
        (576px and below)
==========================================================*/

@media (max-width:576px){

.container{

    padding-left:15px;

    padding-right:15px;

}

.section-padding{

    padding:50px 0 !important;

}

.mobile-title{

    font-size:28px !important;

}

.mobile-subtitle{

    font-size:16px !important;

}

.mobile-text{

    font-size:14px !important;

}

.mobile-btn{

    width:100%;

}

.mobile-radius{

    border-radius:12px !important;

}

.mobile-shadow{

    box-shadow:0 8px 20px rgba(0,0,0,.08);

}

}


/*=========================================================
                EXTRA SMALL
        (400px and below)
==========================================================*/

@media (max-width:400px){

.container{

    padding-left:12px;

    padding-right:12px;

}

.mobile-title{

    font-size:24px !important;

}

.mobile-subtitle{

    font-size:15px !important;

}

.mobile-text{

    font-size:13px !important;

}

}


/*=========================================================
                VERY SMALL DEVICES
        (320px and below)
==========================================================*/

@media (max-width:320px){

.container{

    padding-left:10px;

    padding-right:10px;

}

.mobile-title{

    font-size:22px !important;

}

.mobile-text{

    font-size:12px !important;

}

}