/*
CSS RESPONSIVE ON DEVICE
 */

/*=============== START DESKTOP ====================*/

@media only screen 
and (min-width : 1400px) {
	
.container {
        max-width: 1300px;
    }

}

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

/*=============== START IPAD ====================*/

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1023px) {
	
.header-mobile-wrapper {
    height: 95px;
}

.header-mobile-logo a img {
    max-width: 90px;
}

.header-mobile-hotline>a {
    padding: 15px 30px;
    font-size: 18px;
}

span#icon-menu-mobile>div {
    width: 35px;
    height: 3px;
    margin: 3px 0;
}

.slide-home-item-content>h2 {
    font-size: 3rem;
}

.slide-home-item-content {
    top: 12%;
}

.about-us-img {
    padding: 0 65px;
    margin-bottom: 5rem;
}

.services-box {
    grid-template-columns: 1fr 1fr;
}

.quytrinh-box {
    grid-template-columns: repeat(3, 1fr);
}

.quytrinh-box:before {
    display: none;
}

.hethong-content {
    padding: 0;
    margin-bottom: 3rem;
}

.hethong-contact {
    padding-right: 5rem;
}

section.hethong {
    padding-top: 0;
}

.footer-block.footer-link {
    padding: 0;
}

.footer-block.footer-logo {
    text-align: center;
    margin-bottom: 3rem;
    padding: 0 120px;
}

.quytrinh-item span {
    font-size: 4rem;
}

ul#main-menu-home>li {
    display: block;
    margin-bottom: 25px;
}

.about-us-img:before {
    left: 25px;
    top: -30px;
}


}		
/*=============== END IPAD ====================*/



/*=============== START MOBILE ====================*/

@media only screen 
and (max-width : 767px) {
	
h2.header-page-title {
    font-size: 18px;
}

section.bg-breadcrumb {
    padding: 30px 0;
}

.contact-3-info {
    flex-wrap: wrap;
}

.contact-3-info-item {
    flex: 0 0 100%;
    margin-bottom: 20px;
    padding: 0 15px;
}

.form-contact-3-row-top {
    flex-wrap: wrap;
    margin-bottom: 0;
}

.form-contact-3-row-top>div {
    flex: 0 0 100%;
    margin-bottom: 15px;
}

section.about>.container>.row {
    flex-direction: column-reverse;
}

.about-us-img {
    margin-top: 3rem;
    padding: 0;
}

.about-us-img-badge {
    right: 0;
    bottom: 0;
}

section.about {
    padding: 4rem 0;
}

ul.about-us-content-list {
    gap: 10px;
}

ul.about-us-content-list li {
    padding: 20px 10px;
}

ul.about-us-content-list li h4 {
    font-size: 13px;
}

.about-us-content h2 {
    font-size: 2.4rem;
}

.about-us-img:before {
    left: -15px;
    top: -15px;
}

.title-home h2 {
    font-size: 2.4rem;
    padding: 0 60px;
    line-height: 1.3;
}

.title-home h2:before {
    width: 60px;
    height: 3px;
    bottom: -15px;
}

.services-box {
    grid-template-columns: 1fr;
    gap: 15px;
}

section.services {
    padding: 4rem 0;
}

.project-title>h2 {
    font-size: 2.5rem;
}

div#owl-project .owl-nav button {
    top: -50px;
}

.project-title {
    margin-bottom: 7rem;
}

div#owl-project .owl-dots {
    bottom: -25px;
}

section.project {
    padding-top: 4rem;
}

.quytrinh-box {
    grid-template-columns: repeat(2, 1fr);
}

.quytrinh-box:before {
    display: none;
}

.quytrinh-item span {
    font-size: 4rem;
}

.quytrinh-header>h2 {
    font-size: 2.4rem;
}

.thitruong-item a h3 {
    font-size: 15px;
}

.title-home {
    margin-bottom: 4rem;
}

section.hethong {
    padding-top: 0;
    padding-bottom: 4rem;
}

.hethong-content {
    padding: 0;
    margin: 0;
}

.hethong-content h2 {
    font-size: 2.6rem;
}

.hethong-content p {
    font-size: 16px;
}

.hethong-contact {
    padding: 3rem;
}

.hethong-contact h2 {
    font-size: 2.4rem;
}

.hethong-contact-btn>a {
    padding: 15px 10px;
    width: 100%;
    text-align: center;
}

.footer-block.footer-logo {
    text-align: center;
    margin-bottom: 2rem;
}

.footer-block.footer-link {
    padding: 0;
    margin-bottom: 3rem;
}

ul#main-menu-home>li {
    display: block;
    margin-bottom: 25px;
}

div#owl-slide-desktop .owl-item img {
    height: 400px !important;
}

.slide-home-item-content>h2 {
    font-size: 2rem;
}

.slide-home-item-content {
    left: 5%;
    width: 90%;
}

.slide-home-item-content-btn>a {
    padding: 8px 20px;
    font-size: 13px;
}

h1.v-title-single-post {
    font-size: 22px;
}

h2.v-title-widget span {
    font-size: 16px;
}


}

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



/*=============== START MOBILE < 320px ====================*/

/* Desktops and laptops ----------- */
@media only screen 
and (max-width : 320px) {
	


}

/*=============== END MOBILE < 320px====================*/