@media only screen and (max-width: 1220px) and (min-width: 991px) {
    .inner {
        width: 85%;
    }
}
@media only screen and (max-width: 991px) {
    html {
        overflow-x: hidden;
    }
    body {
        overflow-x: hidden;
        display: block;
    }
    .inner {
        width: 85%;
    }
    #header {
        z-index: 3;
    }
    #header {
        position: relative;
        padding: 15px 0;
    }
    #header i.fa-bars {
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        z-index: 2;
        font-size: 30px;
        color: #0099DA;
        left: 4%;
    }
    #header nav {
        width: 70%;
        background: #0099DA;
        left: -70%;
        position: fixed;
        height: 100%;
        top: 0;
        z-index: 6;
        padding: 25px 0;
        transition: all 0.5s;
    }
    #header nav.active {
        left: 0;
        transition: all 0.5s;
    }
    #header nav ul.flex {
        display: block;
    }
    #header nav ul li a {
        padding: 15px 20px;
        border-bottom: 1px solid rgba(255,255,255,0.1);
        color: #fff;
        font-size: 16px;
    }
    #header nav ul li.has-child i.fa-sort-desc {
        right: 4%;
        top: 10px;
        transform: initial;
        color: #fff;
        font-size: 18px;
    }
    #header nav > ul > li > ul {
        position: relative;
    }
    #header nav > ul > li > ul > li > a {
        padding-left: 30px;
    }
    #header nav .fa-window-close {
        display: block;
        position: absolute;
        color: #fff;
        font-size: 20px;
        right: 3%;
        top: 1%;
        z-index: 5;
        cursor: pointer;
    }
    #header nav .socials-menu {
        display: flex;
        margin: 17px 17px;
    }
    #header nav .socials-menu span {
        width: 25px;
        margin-right: 10px;
    }
    #header .socials {
        display: none;
    }
    #header .logo {
        text-align: center;
        width: 100%;
    }
    #header .logo img {
        width: 120px;
        margin: 0 auto;
    }
    #header .header-top {
        height: 25px;
    }
    #header .header-top .contact a {
        height: 25px;
        line-height: 25px;
    }
    #header .header-top .inner {
        width: 100%;
    }
    #header .socials ul li.contact {
        display: block;
    }
    #header .right-header .btn-contact {
        display: none;
    }
    #header .right-header .icon-lang {
        margin-left: 0;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 4%;
    }
    #slider {
        padding: 50px 0;
        background-size: cover;
    }
    #slider.digital {
        background-size: cover;
    }
    #slider h2 {
        font-size: 35px;
        line-height: 40px;
        letter-spacing: 0px;
    }
    #slider .info-slider {
        width: 100%;
    }
    #slider p.text {
        font-size: 16px;
        line-height: 25px;
        margin: 20px 0 30px;
    }
    #about {
        width: 100%;
    }
    #about h2 {
        font-size: 35px;
    }
    #about .left-about p.text {
        font-size: 20px;
        margin: 20px 0 10px;
    }
    #about .left-about p.des {
        text-align: justify;
    }
    #about .right-about p.img {
        width: 80%;
        margin: 30px auto 0;
    }
    #about .left-about p.des {
        margin-bottom: 30px;
    }
    #about {
        padding: 40px 0;
    }
    #vision {
        width: 100%;
        margin-bottom: 0;
    }
    #vision .ar-vision h3 {
        font-size: 18px;
    }
    .ar-vision {
        margin-bottom: 25px;
    }
    #vision .ar-vision h3:after {
        display: none;
    }
    #vision .ar-vision p {
        margin-bottom: 0;
    }
    #vision .ar-vision p.img img {
        width: 75%;
    }
    #vision {
        padding: 50px 0;
    }
    #solutions .top-solutions h2 {
        font-size: 18px;
        width: 100%;
        line-height: 26px;
    }
    #solutions .top-solutions p.text {
        margin-top: 10px;
        line-height: 23px;
    }
    #solutions .top-solutions {
        padding: 50px 0;
    }
    #box-solutions {
        margin-top: 20px;
    }
    #box-solutions .ar-solutions {
        margin-bottom: 20px;
    }
    #subcribe .box-sub {
        padding: 25px;
    }
    #subcribe .box-sub h2 {
        font-size: 16px;
        line-height: 30px;
        margin-top: 10px;
    }
    #subcribe .box-sub:after {
        display: none;
    }
    #subcribe .box-sub button {
        font-size: 16px;
    }
    #subcribe .box-sub .btn-submit {
        margin-top: 0px;
    }
    #why h2.title {
        font-size: 24px;
        line-height: 30px;
    }
    #why {
        padding: 50px 0;
    }
    #footer nav#nav-footer {
        display: none;
    }
    #footer .right-footer .top-right > div {
        text-align: left;
        padding: 0 15px;
        display: flex;
        align-items: center;
    }
    #footer .right-footer .top-right > div p.icon {
        width: 25px;
        margin-right: 10px;
    }
    #footer .right-footer .top-right > div p.icon img {
        width: 100%;
    }
    #footer .right-footer {
        margin-top: 20px;
    }
    #footer .right-footer .sub {
        margin-top: 20px;
    }
    #subcribe .box-sub .title {
        font-size: 14px;
    }
    #footer .copyright .language {
        display: none !important;
    }
    #footer .cpr-right {
        justify-content: center !important;
    }
    #footer .mid {
        padding: 50px 0;
    }
    #header nav ul li.active {
        border-top: 0;
    }

    #header nav>ul>li>ul {
        background: rgba(255,255,255,0.1);
    }
    #use h2.title {
        font-size: 30px;
    }
    #use p.slogan {
        width: 100%;
        font-size: 16px;
        line-height: 22px;
    }
    #use {
        background-size: cover;
        padding: 50px 0;
    }
    .ar-use {
        margin-bottom: 30px;
    }
    #use .ar-use h3 {
        line-height: 28px;
    }
    #service h2.title {
        font-size: 25px;
    }
    #service p.text-top {
        width: 100%;
        font-size: 16px;
        line-height: 22px;
        margin: 25px auto 40px;
    }
    #service {
        padding: 50px 0;
    }
    #service .ar-service {
        margin-bottom: 15px;
    }
    #box-bottom h2 {
        font-size: 16px;
        line-height: 30px;
    }
    #box-bottom {
        padding: 40px 0;
    }
    #about-in .title-about {
        padding: 40px 0px;
    }
    #about-in h2 {
        font-size: 30px;
        letter-spacing: 0;
    }
    #about-in .about-breadcrumb {
        margin-bottom: 0;
    }
    #about-in .about-info {
        padding: 30px 0;
    }
    #about-in .left-about h3 {
        font-size: 40px;
        line-height: 40px;
    }
    #about-in .left-about p.text {
        font-size: 16px;
        line-height: 26px;
        margin: 20px 0;
    }
    #about-in .right-about {
        margin-top: 30px;
    }
    #header nav ul li a:hover {
        color: #fff;
    }
    #wrapper-main {
        background: url(../img/bg_bottom.png) no-repeat center top 0;
    }
    #about .right-about p.img img {
        width: 100%;
    }
    .bubble_deco {
        width: 90%;
        top: 60%;
    }
    .icon-lang {
        width: 25px;
        right: 5%;
    }
    #slider .inner {
        width: 85%;
    }
    #about .inner {
        width: 85%;
    }

    /* Maketing */
    .tab-maketing {
        display: none;
    }
    #main-maketing .content-maketing .title {
        font-size: 18px;
        line-height: 25px;
    }
    #main-maketing .content-maketing h2 {
        font-size: 20px;
        width: 100%;
        margin: 20px auto 25px;
        line-height: 34px;
    }
    #main-maketing .content-maketing .box {
        width: 140px;
        height: 140px;
        margin: 0 10px 15px;
    }
    #main-maketing .content-maketing .box p.icon img {
        height: 25px;
    }
    #main-maketing .content-maketing .box p.no {
        font-size: 17px;
        margin: 10px 0 6px;
    }
    #main-maketing p.btn-quote {
        margin-top: 30px;
    }
    #main-maketing .content-maketing {
        padding: 40px 0;
    }
    #reason .box-ser p.text {
        min-height: auto;
    }
    #regis-form #box-form {
        width: 100%;
        border-radius: 10px;
        padding: 25px;
    }
    #regis-form h2, #reason h2, #ma-service h2 {
        font-size: 25px;
        line-height: 32px;
    }
    #regis-form #box-form input[type="text"] {
        padding: 5px 0;
    }
    #regis-form #box-form .box-field {
        margin-bottom: 30px;
    }
    #regis-form #box-form label {
        margin-bottom: 5px;
    }
    #regis-form #box-form label[for="agree"] {
        line-height: 20px;
    }
    #regis-form p.btn-re button {
        margin: 30px auto 0;
        font-size: 15px;
    }
    #regis-form p.btn-re {
        text-align: center;
    }
    #main-maketing .content-maketing {
        background-size: cover;
    }
    #ma-service .slogan, #regis-form .slogan {
        font-size: 14px;
    }
    #main-maketing {
        padding-top: 0;
    }
    #ma-service {
        padding: 40px 0;
    }
    
    /* Website */
    #wrapper {
        margin-top: 0;
    }
    #experience {
        padding-top: 0;
    }
    #experience .content-experience:before {
        display: none;
    }
    #experience .content-experience:after {
        display: none;
    }
    #experience .content-experience {
        padding: 50px 0 40px;
    }
    #experience .content-experience h2 {
        font-size: 18px;
    }
    #experience .content-experience .title {
        font-size: 22px;
        line-height: 32px;
        margin: 25px 0;
    }
    #experience p.btn-quote {
        margin-top: 30px;
    }
    #customer .slogan {
        font-size: 14px;
        margin: 30px 0;
    }
    #customer .slogan {
        font-size: 14px;
        margin: 30px 0;
    }
    #customer p.btn-quote {
        margin-top: 35px;
    }
    #other h2 {
        font-size: 25px;
    }
    #other dl dt {
        font-size: 14px;
        padding-right: 35px;
        line-height: 24px;
    }
    #other dl {
        padding-right: 10px;
        padding-left: 10px;
    }
    #other {
        padding: 40px 0 0;
    }
    #customer h2 {
        font-size: 25px;
    }
    #customer {
        padding: 50px 0 0;
    }
}

@media only screen and (max-width: 767px) {
    #footer .cpr-right {
        margin-top: 20px;
    }
    #footer .copyright small {
        text-align: center;
    }
    #box-solutions .btn-more {
        margin-top: 15px;
    }
    #box-bottom {
        background-size: cover;
    }
}