body {
    direction: ltr !important;
    text-align: left !important;
}

.ltr {
    direction: ltr !important;
    text-align: left !important;
}
.text-title{
    font-weight: bold;

    font-size: 27px;
    letter-spacing: 0px;
    color: #707070;
    opacity: 1;
    font-family: 'DUBAILIGHT';
}
.text-detail{
    font-family: 'DUBAILIGHT';
    font-size: 18px;
    letter-spacing: 0px;
    opacity: 1;

    color: #707070;
}

.main-slider .img-fill .info{right: 0px;text-align: left;  left: 17vw;}
.main-slider .img-fill .r{
    top: -4.5vw;
    left: 9vw;
    position: absolute;
    font-size: 9vw;
    font-weight: 700;
    color: var(--dark-blue-color);
}
.main-slider .slick-active .r{animation:fadeInRight 1.3s both 0.7s;  visibility:visible;}
.main-slider .slick-active h3{  animation:fadeInRight 1s both 0.6s;  visibility:visible;  }

.slick-dotted.slick-slider{margin-bottom: 0}
.slick-dots{      bottom: 1.5vw;  }
.slick-dots li,.slick-dots li button{width: 0.5vw;height: 0.5vw;}
.slick-dots li.slick-active button:before{        background-color: var(--dark-blue-color);  }
.slick-dots li button:before{
    content: '';
    background-color: var(--light-blue-color);
    width: 0.5vw;
    height: 0.5vw;
    opacity: 1;
}
.slick-dots li button:hover:before, .slick-dots li button:focus:before{opacity: 1}
#services .service-link .business-service{text-align: left}
#services .service-link .bs-service-desc{padding: 0 2vw 0 4vw;}
#services .service-link .business-service{
    max-height: 17vw;
    height: 100vh;
    min-height: 17vw;
    bottom: -211px;
}
#company-name .logo-story{left: 35.5vw;}
#company-name .logo-story img{    margin: 1.9vw 1.7vw;}
#company-name .c-n-text{padding: 2vw 15.5vw 2vw 8.5vw;}
#packages .tabs .package-type{text-align: left;}
#packages .tabs .package-type .package-icon ul li,#packages .tabs .package-type .package-icon ul li:first-child {
    float: left;
    padding-right: 2.2vw;
}
#packages .package-img img{-webkit-transform: scaleX(-1);  transform: scaleX(-1);}
#partners .partners{left: calc((100% - 90%) ); }
#hotspot{  background-image: url({{ asset('img/new/hotspot-bg-en.png')}});  }
#hotspot .hotspot-detail{text-align: left;}
#hotspot .customer-slider .customer-title{text-align: left;}
.pulse-box{
    right:-2%;}


#our-mark{text-align: left}
.main-slider .img-fill  .s{
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    visibility: hidden;
    /* text-transform: uppercase; */
    line-height: 1;
    margin-bottom: 0;
    color: var(--bold-success-color);
    font-size: 6vw;
    font-weight: 700;
    height: auto;
}
.main-slider .slick-active .s{  animation:fadeInRight 1s both 0.7s;  visibility:visible;  }

.main-slider .img-fill .slider-p{
    font-size: 3vw;color: var(--dark-blue-color);
    max-width: 24vw;
    /* margin: auto; */
    margin-top: 15px;
    height: auto;
    text-align: justify;
    overflow: hidden;
    visibility: hidden;
}
.main-slider .slick-active .slider-p{  animation:fadeInUp 1s both 0.7s;  visibility:visible;  }

.main-slider .slick-active .slider-p span{animation:fadeInLeft 1.3s both 0.7s;  visibility:visible;}

@media only screen and (max-width: 480px) and (min-width: 240px) {

    #services .service-link {
        margin: 0 auto 20px auto;
    }

    #services .service-link .business-service {
        max-height: 190px;
        height: 100vh;
        min-height: 150px;
        bottom: -150px;
    }

    #services .service-link .bs-service-title {
        padding: 10px 5px;
        font-size: 15px;
    }

    #services .service-link .bs-service-desc {
        font-size: 13px;
        padding: 0px 15px;
        line-height: 1.2;
    }

    #company-name .c-n-bg {
        padding: 100px 0;
    }

    #company-name .logo-story {
        width: 80px;
        height: 80px;
        top: 160px;
        left: 200px;
    }

    #company-name .logo-story img {
        margin: 16px 16px;
    }

    #company-name .c-n-text {
        padding: 20px 8.5vw 20px 8.5vw;
    }

    #company-name .c-n-text .c-n-text-title {
        font-size: 20px;
        line-height: 7.2vw;
    }

    #company-name .c-n-text .c-n-text-dec {
        font-size: 15px;
    }

    #packages {
        padding: 30px 0 0 0;
    }

    #packages .transformer-tabs a {
        font-size: 15px;
    }
    #packages .transformer-tabs li{text-align: left}
    #packages .transformer-tabs li .active::after, #packages .transformer-tabs a.active::after {
        height: 1px;
    }

    #packages .tabs .package-type {
        padding: 30px 0;
    }

    #packages .tabs .package-type .type-title {
        font-size: 15px;
        line-height: 1.2;
    }

    #packages .tabs .package-type .type-dec {
        font-size: 13px;
        width: 100%;
    }

    #packages .tabs .package-type .package-icon {
        width: 100%;
        height: 35px;
        margin-bottom: 30px;
    }

    #packages .tabs .package-type .package-icon ul li {
        width: 20%
    }

    #packages .tabs .package-type .package-icon ul li img {
        width: 60%;
    }

    #packages .tabs .package-type .btn-more {
        padding: 5px 5px;
        width: 40%;
        font-size: 12px;
        border: 1px solid var(--bold-success-color);
    }

    #partners {
        padding: 20px 0 10px 0;
    }

    #partners .item {
        height: 90px;
    }

    #partners .partners {
        height: 90px;
    }

    #hotspot{  height: 350px;  background-size: cover;  }
    #hotspot .hotspot-title{font-size: 20px;}
    #hotspot .hotspot-dec{font-size: 15px;width: 100%}
    #hotspot .hotspot-detail .hotspot-btn .btn-more,#hotspot .hotspot-detail .hotspot-btn .btn-customer{padding: 5px 5px;  width: 40%;  font-size: 12px;}
    #hotspot .customer-slider .customer-title{font-size: 15px}
    #hotspot .customer-slider .customer-title{font-size: 15px}
    #hotspot .customer-slider .customers{width: 70%}
    .main-slider .img-fill img {
        height: 100%
    }

    .main-slider .img-fill, .slick-slider {
        height: 600px;
    }

    /*.slick-track{width: 100%!important;}*/
    .slick-slider {
        width: 100% !important;
    }

    .main-slider .img-fill .info {
        top: 20%;
        height: auto;
        width: 70%;
        right: 35px;
    }

    .main-slider .img-fill h3 {
        font-size: 20px;
        margin-bottom: 20px
    }

    .main-slider .img-fill h3 span {
        font-size: 35px;
    }

    .main-slider .img-fill p {
        max-width: 100%;
        font-size: 15px
    }

    .main-slider .slick-active .btn-slider {
        padding: 5px 5px;
        width: 95px;
        font-size: 12px;
        border: 1px solid var(--bold-success-color);
    }

    .main-slider .img-fill .slider-p {
        height: auto;
        font-size: 25px;
        max-width: 100%;
    }

    .main-slider .img-fill .r {
        top: -2px;
        left: 76px;
        font-size: 45px;
    }

    .main-slider .img-fill img {
        height: 100%
    }

    .main-slider .img-fill, .slick-slider {
        height: 600px;
    }

    /*.slick-track{width: 100%!important;}*/
    .slick-slider {
        width: 100% !important;
    }

    .main-slider .img-fill .info {
        top: 20%;
        height: auto;
        width: 70%;
        right: 35px;
    }

    .main-slider .img-fill h3 {
        font-size: 20px;
        margin-bottom: 20px
    }

    .main-slider .img-fill h3 span {
        font-size: 35px;
    }

    .main-slider .img-fill p {
        max-width: 100%;
        font-size: 15px;
        height: 80px
    }

    .main-slider .slick-active .btn-slider {
        padding: 5px 5px;
        width: 95px;
        font-size: 12px;
        border: 1px solid var(--bold-success-color);
    }

    .main-slider .img-fill .slider-p {
        font-size: 25px;
        max-width: 100%;
    }

    .main-slider .img-fill .slider-p span {
        top: 45px;
        left: 0;
        font-size: 45px;
    }

    .main-slider .img-fill .s {
        font-size: 35px;
    }

    #our-mark {
        height: 35px;
    }

    #our-mark img {
        width: 105px;
        top: 8px;
    }

    #random {
        display: none
    }
    .pulse-box{
        display: none;
    }

}
@media only screen and (max-width: 767px) and (min-width: 480px){
    .section-header h3{font-size: 20px}
    #services .service-link{  margin: 0 auto 20px auto; width: 350px; }
    #services .service-link .business-service {
        max-height: 210px;
        height: 100vh;
        min-height: 210px;
        bottom: -170px;
    }
    #services .service-link:hover .business-service {
        bottom: -35px;
    }
    #services .service-link .bs-service-title{  padding: 10px 5px;  font-size: 15px;  }
    #services .service-link .bs-service-desc{    font-size: 13px;  padding: 0 30px;}

    #company-name .c-n-bg{padding: 100px 0;}
    #company-name .logo-story{
        width: 80px;
        height: 80px;
        top: 160px;
        left:350px;
    }
    #company-name .logo-story img{  margin: 16px 14px;  }
    #company-name .c-n-text{  padding:20px 8.5vw 20px 8.5vw;  }
    #company-name .c-n-text .c-n-text-title{    font-size: 20px;  line-height: 1}
    #company-name .c-n-text .c-n-text-dec{font-size: 15px;}

    #packages{    padding: 30px 0 0 0;}
    #packages .transformer-tabs li{text-align: left}
    #packages .transformer-tabs a{font-size: 15px;}
    #packages .transformer-tabs li .active::after, #packages .transformer-tabs a.active::after{height: 1px;}
    #packages .tabs .package-type{padding: 30px 0 0 0;}
    #packages .tabs .package-type .type-title{  font-size: 17px;  line-height: 1.2;  }
    #packages .tabs .package-type .type-dec{  font-size: 15px;width: 98%;  }
    #packages .tabs .package-type .package-icon{  width: 100%; height: 35px;margin-bottom: 30px; }
    #packages .tabs .package-type .package-icon ul li{width: 45px;padding-right: 0}
    #packages .tabs .package-type .package-icon ul li img{  width:30px;  }
    #packages .tabs .package-type .btn-more{
        padding: 5px 5px;
        width: 88px;
        font-size: 13px;
        border: 1px solid var(--bold-success-color);
    }
    #packages .package-img img{width: 50%;margin: 0 auto;display: block;}
    #partners{padding: 30px 0;}
    #partners .item{height: 90px;}
    #partners .partners{height: 90px;}

    #hotspot{  height: 350px;  background-size: cover;  }
    #hotspot .hotspot-title{font-size: 20px;}
    #hotspot .hotspot-dec{font-size: 15px;width: 70%}
    #hotspot .hotspot-detail .hotspot-btn .btn-more,#hotspot .hotspot-detail .hotspot-btn .btn-customer{
        padding: 5px 5px;
        width: 88px;
        font-size: 13px;  }
    #hotspot .hotspot-detail .hotspot-btn .btn-customer{width: 98px;}
    #hotspot .customer-slider .customer-title{font-size: 15px}
    #hotspot .customer-slider .customers{width: 70%}

    .slick-slider{height: 400px;}
    .main-slider .img-fill{height: 100%}
    .main-slider .img-fill img{height: 400px;}
    .main-slider .img-fill .info{left: 60px;top: 30%;}
    .main-slider .img-fill h3{font-size: 20px;}
    .main-slider .img-fill p{font-size: 15px;height: auto;  max-width: 80%;}
    .main-slider .img-fill .btn-slider {
        padding: 5px;
        width: 88px;
        font-size: 13px;}
    .main-slider .img-fill .slider-p{height: auto}
    .main-slider .img-fill .r{    top: -23px;}
    #random{display: none}

    /*.blocks-box, .slick-slider, .slick-slider .item{width: 318px!important;  margin: 0 auto;}*/
    .pulse-box{
        display: none;
    }

    #our-mark {
        height: 35px;
    }

    #our-mark img {
        width: 105px;
        top: 8px;
    }

}
@media only screen and (max-width: 991px) and (min-width: 768px){
    .slick-slider{height: 41vw;}
    .main-slider .img-fill{height: 100%}
    .main-slider .img-fill img{height: 41vw;}
    .main-slider .img-fill .info{left: 12vw;}
    .main-slider .img-fill p{height: auto;font-size: 15px;max-width: 40vw}
    .main-slider .img-fill h3{margin-bottom: 0}
    .main-slider .img-fill .r {
        top: -4vw;}
    .main-slider .img-fill .btn-slider{
        padding: 5px 5px;
        width: 88px;
        font-size: 13px;
    }
    .section-header h3{font-size: 20px;}
    #services .service-link .business-service{    bottom: -109px;}
    #services .service-link .bs-service-title{  font-size:15px;  }
    #company-name .logo-story{left: 37vw;}
    #company-name .c-n-text .c-n-text-title{font-size: 20px;line-height: 1}
    #company-name .c-n-text .c-n-text-dec{font-size: 15px;}
    #company-name .c-n-text{    padding: 3vw 8.5vw 2vw 11.5vw;}
    #packages{padding: 30px 0 0 0}
    #packages .transformer-tabs a{font-size: 15px;}
    #packages .tabs .package-type .type-title{font-size: 20px;}
    #packages .tabs .package-type .type-dec{font-size: 15px; width: 85%;}
    #packages .tabs .package-type .package-icon{height: 40px;}
    #packages .tabs .package-type .package-icon ul li{width: 45px;padding-right: 0}
    #packages .tabs .package-type .package-icon ul li img{  width:30px;  }
    #packages .tabs .package-type .btn-more{
        padding: 5px 5px;
        width: 88px;
        font-size: 13px;
        border: 1px solid var(--bold-success-color);
    }

    #hotspot{  height: 350px;  background-size: cover; padding: 30px 0; }
    #hotspot .hotspot-detail{padding: 0}
    #hotspot .hotspot-title{font-size: 20px;}
    #hotspot .hotspot-dec{font-size: 15px;width: 90%}
    #hotspot .hotspot-detail .hotspot-btn .btn-more,#hotspot .hotspot-detail .hotspot-btn .btn-customer{padding: 5px 5px;  width: 88px;  font-size: 13px;}
    #hotspot .customer-slider .customer-title{font-size: 15px}
    #hotspot .customer-slider .customers{width: 60%}
    #hotspot .hotspot-detail .hotspot-btn .btn-customer{
        width: 98px;
    }
    #our-mark {  height: 45px;  }
    #our-mark img {     width: 115px;  top: 12px;  }
    .pulse-box{
        display: none;
    }
}
@media  (min-width: 1800px) {
    .main-slider .img-fill p{height: auto}
    .main-slider .NextArrow,.main-slider .PrevArrow{width: 3vw;height: 3vw;font: 2vw/1.5vw FontAwesome;}
    #services .service-link .business-service{bottom: -13.5vw;}
    #packages .transformer-tabs a{margin: 1rem;}
    .main-owl .owl-dots .owl-dot span, .partners .owl-dots .owl-dot span, .services .owl-dots .owl-dot span{width: 0.5vw;
        height: 0.5vw;
        margin: 0.3vw 0.1vw;}
    svg.pulse-svg {
        width: 3vw;
        height: 3vw;
    }

    .main-slider .img-fill .slider-p{height: auto;margin-bottom: 2vw;}
    .main-slider .img-fill p{margin: 2vw 0}
}