.about-us .title-content h3 {
    margin-top: 0;
}

.about-us__contents {
    display: flex;
    align-items: center
}

.about-us {
    padding: 30px 0
}
.about-us .container-fluid {
    width: 100%
}

.about-us .about-us__item {
    width: 20%;
    float: left;
    text-align: center
}

.about-us .about-us__item a {
    display: inline-block
}

.about-us .about-us__item a img {
    margin-bottom: 15px;
    width: 50%
}

.about-us .about-us__item a span {
    font-size: 14px;
    display: block;
    text-transform: uppercase;
    color: #000;
    font-weight: 500
}

.about-us .about-us__item:hover {
    transform: translateY(-10%);
    transition: all .5s ease
}

.about-us .about-us__item:hover span {
    color: #4682b4
}

.about-us__inner {
    padding: 0;
    margin: 0 auto;
}

@media (max-width: 767px) {
    .about-us__inner {
        display: table;
        text-align: center;
    }

    .about-us .about-us__item {
        display: inline-table;
        margin-top: 15px;
        width: 50%;
        float: none;
    }    

    .about-us .about-us__item a img {
        max-width: 50px;
        width: 100%;
    }
}
.business .title-content {
    margin-bottom: 0
}

.business .business__left {
    width: 33.3333333333%
}

.business .business__right {
    width: 66.6666666667%
}

.business > .nav-tabs > li {
    display: block;
    float: inherit;
    width: 100%;
    margin-bottom: 0
}

    .business > .nav-tabs > li > a {
        margin-right: 0;
        border-style: none;
        border-radius: 0;
        font-size: 18px;
        color: #c90;
        font-weight: 300;
        padding: 0;
        line-height: 62px;
        padding-left: 88px;
        border-bottom: 1px solid #ccc
    }

.business > .nav-tabs .tabs-title {
    background: linear-gradient(90deg, #02297e, #1a77c7, #5da988, #c2e20c);
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    line-height: 70px;
    padding-left: 70px
}

.business .nav-tabs > li.active > a:focus, .business .nav-tabs > li.active > a:hover, .business .nav > li > a:focus, .business .nav > li > a:hover, .business > .nav-tabs > li.active > a {
    font-weight: 700;
    color: #c90;
    background: 0 0;
    border-style: none;
    border-bottom: 1px solid #ccc
}

.business__tab--inner-item {
    width: 50%
}

.business__tab--inner .nav-tabs > li {
    display: block;
    float: inherit;
    width: 100%;
    margin-bottom: 0
}

    .business__tab--inner .nav-tabs > li > a {
        margin-right: 0;
        border-style: none;
        border-radius: 0;
        font-size: 17px;
        color: #c90;
        font-weight: 300;
        padding: 0;
        line-height: 52px;
        padding-left: 88px;
        border-bottom: 1px solid #ccc;
        overflow: hidden
    }

        .business__tab--inner .nav-tabs > li > a i {
            font-size: 30px;
            line-height: 51px;
            margin-right: 35px
        }

.business__tab--inner .nav-tabs .tabs-title {
    background: linear-gradient(90deg, #02297e, #1a77c7, #5da988, #c2e20c);
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    line-height: 70px;
    padding-left: 70px
}

.business__tab--inner .nav-tabs > li.active > a, .business__tab--inner .nav-tabs > li.active > a:focus, .business__tab--inner .nav-tabs > li.active > a:hover, .business__tab--inner .nav > li > a:focus, .business__tab--inner .nav > li > a:hover {
    font-weight: 700;
    color: #c90;
    background: 0 0;
    border-style: none;
    border-bottom: 1px solid #ccc
}

.business__tab--inner-link {
    display: block
}

    .business__tab--inner-link img {
        width: 100%
    }

.business > ul {
    margin: 0;
    padding: 0;
    float: left;
    width: 95%;
    margin-top: 10px
}

.business ul, .business > ul {
    list-style: none
}

    .business ul li {
        position: relative
    }

.li-title {
    text-transform: uppercase;
    font-weight: 700;
    color: #fff;
    background: #1292cd;
    background: -moz-linear-gradient(left, #1292cd 0, #bbd040 100%);
    background: -webkit-gradient(left top, right top, color-stop(0, #1292cd), color-stop(100%, #bbd040));
    background: -webkit-linear-gradient(left, #1292cd, #bbd040);
    background: -o-linear-gradient(left, #1292cd 0, #bbd040 100%);
    background: -ms-linear-gradient(left, #1292cd 0, #bbd040 100%);
    background: linear-gradient(90deg, #1292cd 0, #bbd040)
}

.business ul li a, .li-title {
    border-bottom: 1px solid #ddd
}

.business ul li a {
    background: #fff;
    display: block;
    padding: 10px 0;
    color: #d19f0f
}

    .business ul li a:hover {
        font-weight: 700
    }

.business-list > li > ul, .business-list > li > ul > li > ul {
    display: none;
    min-width: 216px;
    z-index: 9999
}

    .no-touch .business-list > li:hover > ul,
    .no-touch .business-list > li > ul > li:hover > ul,
    .business-list > li.active > ul,
    .business-list > li > ul > li.active > ul {
        display: block;
        position: absolute;
        top: 0;
        left: 100%
    }

    .business-list > li > ul > li > a, .business-list > li > ul > li > ul > li > a {
        padding: 10px 0 10px 30px;
        text-align: left;
        font-size: 14px
    }

    .business-list > li > ul > li > ul > li > a {
        background: rgba(215, 243, 254, .9)
    }

.business-list ul {
    width: 40% !important;
    margin: 0
}

.business ul li {
    text-align: left
}

    .business ul li a {
        padding-left: 55px;
        text-align: left;
        font-size: 15px
    }

.li-title {
    text-align: left
}

.business ul .li-title a {
    background: 0 0;
    color: #fff;
    margin: 0;
    border-style: none;
    font-size: 16px
}

.business-list li a img {
    float: right;
    width: 12px;
    margin-right: 15px;
    margin-top: 2px
}

.business-list > li > ul > li > a > img {
    margin-top: 2px;
    width: 10px
}

.business-list-content {
    float: left;
    text-align: right
}

    .business-list-content img {
        width: 100%;
        height: 400px
    }

.business-inner {
    background: url(../images/home-business.png) no-repeat;
    padding: 40px 0;
    display: flex;
    align-items: center
}

    .business-inner .container {
        height: auto
    }

    .business-inner .row {
        height: auto !important
    }


@media (max-width: 1199px) {

    /* .business-list>li.active>ul, */
    .business-list > li:hover > ul, .business-list > li > ul > li:hover > ul,
    .business-list > li:active > ul, .business-list > li > ul > li:active > ul {
        position: absolute;
        display: block;
        top: 42px;
        left: 0;
        width: 100% !important;
    }

    .business-list-content img {
        height: auto;
    }
}

@media (max-width: 768px) {

    .business-list > li > ul > li > a > img {
        transform: rotate(90deg);
        transition: transform .3s;
    }

    .business-list > li.active > ul > li.active > a > img {
        transform: rotate(-90deg);
    }

    .business-list > li:hover > ul li.active ul,
    .business-list > li > ul > li:hover > ul li.active ul,
    .business-list > li.active > ul li.active ul,
    .business-list > li > ul > li.active > ul li.active ul {
        position: static;
        top: auto;
        left: auto;
        display: block;
    }

    .business-list > li:hover > ul li ul,
    .business-list > li > ul > li:hover > ul li ul,
    .business-list > li.active > ul li ul,
    .business-list > li > ul > li.active > ul li ul {
        display: none;
    }
}

.news-slider {
    margin-bottom: 30px
}

    .news-slider .lastest-new__item--readmore {
        padding-right: 0
    }

    .news-slider .slick-prev {
        right: 40%;
        left: auto;
        background: #0077c0;
        z-index: 2;
        width: 40px;
        height: 40px
    }

    .news-slider .slick-next {
        left: 60%;
        right: auto;
        background: #fff;
        width: 40px;
        height: 40px
    }

    .news-slider .slick-prev:before {
        color: #fff;
        font-family: FontAwesome;
        content: "\F177";
        font-size: 20px;

    }

    .news-slider .slick-next:before {
        color: #0077c0;
        font-family: FontAwesome;
        content: "\F178";
        font-size: 20px;
    }

.news-slider__item {
    background: #f1f0f0;
    position: relative
}

.news-slider__item--img {
    width: 60%;
    padding-bottom: 0;
    position: relative
}

    .news-slider__item--img img {
        width: 100%;
        min-height: 100%;
        max-height: 400px;
    }

    .news-slider__item--img .news-slider__item--link-title {
        outline: 0;
        text-transform: uppercase;
        display: inline-block;
        text-align: left;
        position: absolute;
        left: 40px;
        right: 40px;
        bottom: 20px;
        text-align: center;
        height: 50px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #1292cd;
        background: -moz-linear-gradient(left, #1292cd 0, #bbd040 100%);
        background: -webkit-gradient(left top, right top, color-stop(0, #1292cd), color-stop(100%, #bbd040));
        background: -webkit-linear-gradient(left, #1292cd, #bbd040);
        background: -o-linear-gradient(left, #1292cd 0, #bbd040 100%);
        background: -ms-linear-gradient(left, #1292cd 0, #bbd040 100%);
        background: linear-gradient(90deg, #1292cd 0, #bbd040)
    }

        .news-slider__item--img .news-slider__item--link-title a {
            color: #fff;
            font-size: 16px;
            display: inline-block;
            height: 19px;
            overflow: hidden
        }

.news-slider__item--inner {
    padding: 0 50px;
    width: 40%;
    float: right;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center
}

    .news-slider__item--inner .news__item--link-icon {
        position: absolute;
        bottom: 29px;
        right: 50px
    }

        .news-slider__item--inner .news__item--link-icon img {
            width: 40px
        }

.news-slider__item--title {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 16px;
    color: #333;
    margin-bottom: 10px;
    display: block;
    height: 44px;
    overflow: hidden
}

    .news-slider__item--title:hover {
        color: #4682b4
    }

.news-slider__item--text {
    color: #333;
    margin-bottom: 4px;
    font-size: 15px;
    text-align: justify;
    max-height: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* lasted new */

.lastest-new__item {
    margin-bottom: 30px
}

.lastest-new__item--inner {
    overflow: hidden;
    padding-left: 20px
}

.lastest-new__item--title {
    text-transform: uppercase;
    display: block;
    font-weight: 600;
    margin-bottom: 10px;
    color: #333;
    overflow: hidden;
    height: 42px;
    font-size: 14px
}

    .lastest-new__item--title:hover {
        color: #4682b4
    }

.lastest-new__item--text,
.description-box {
    color: #000;
    height: 60px;
    overflow: hidden;
    text-align: justify
}

.lastest-new__item--readmore {
    text-align: right;
    padding-right: 2px;
    margin-top: 5px;
}

    .lastest-new__item--readmore a {
        display: inline-block;
        outline: 0
    }

.astest-new__item--img {
    width: 39%
}

@media (min-width: 1023px) and (max-width: 1199px) {
    .news-slider__item--title {
        font-size: 15px;
    }

    .news-slider__item--text {
        font-size: 14px;
        max-height: 165px;
    }

    .news-slider__item--inner .news__item--link-icon {
        bottom: 15px;
    }
}

@media (max-width: 1022px) {
    .news-slider__item--img {
        float: none !important;
        width: 100%;
    }

    .news-slider__item--inner {
        display: block;
        position: static;
        padding: 30px 40px;
        width: 100%;
        float: none;
    }

        .news-slider__item--inner .news__item--link-icon {
            position: static;
        }

    .news-slider .slick-prev {
        top: 30%;
        right: auto;
        left: 0;
        transform: none;
    }

    .news-slider .slick-next {
        top: 30%;
        right: 0;
        left: auto;
        transform: none;
    }
}

@media (max-width: 767px) {
    .news-slider__item--inner {
        padding: 20px 15px;
    }

    .news-slider__item--img .news-slider__item--link-title {
        bottom: 10px;
        left: 15px;
        right: 15px;
    }

    .news-slider .slick-prev,
    .news-slider .slick-next {
        top: 12%;
        bottom: auto;
        transform: none;
    }

    .news-slider .slick-prev {
        left: 0;
    }

    .news-slider .slick-next {
        right: 0;
    }
}

.vsip_new_home img {
    max-height: 130px;
}

.img_sustainbility img {
    max-height: 600px;
}

@media(max-width: 768px) {
    .news-slider__item--img .news-slider__item--link-title a {
        overflow: auto;
    }

    .news-slider__item--title {
        display: none;
    }
}

.news__item {
    border: none;
    padding: 0;
    margin-bottom: 10px
}

    .news__item .news__item--img {
        display: block;
        margin-bottom: 12px;
    }

        .news__item .news__item--img img {
            width: 100%
        }

    .news__item .news__item--title {
        font-size: 16px;
        color: #333;
        font-weight: 600;
        text-transform: uppercase;
        display: block;
        margin-bottom: 0;
        height: 25px;
        overflow: hidden
    }

        .news__item .news__item--title:hover {
            color: #4682b4
        }

    .news__item p,
    .news__item .description-box {
        line-height: 22px;
        color: #000;
        height: 66px;
        overflow: hidden;
        margin-bottom: 0
    }

    .news__item .news__item--link-icon {
        display: inline-block
    }

.news__item--link-icon img {
    width: 35px
}

.news__item--link-icon:hover {
    opacity: .5
}

@media (min-width: 768px) {
    .news__item .news__item--img {
        height: 300px;
    }
}
.events {
    margin-bottom: 0
}

.events .width-100 {
    height: 100%
}

.events img {
    display: inline-block;
    width: 70%
}

.events h4 {
    display: inline-block;
    text-align: center;
    font-size: 13px;
    color: #000;
    font-weight: 700;
    margin: 0;
    text-transform: uppercase
}

.events h4 span {
    display: block;
    margin-top: 5px
}

    .events a.pull-right {
        font-size: 17px;
        color: #000;
        line-height: 50px;
        padding: 0 25px;
        display: inline-block;
        border-radius: 6px;
        border: 1px solid #000
    }

        .events a.pull-right:hover {
            background: #bbd040;
            border: 1px solid #bbd040;
            color: #fff !important
        }

#clock, #clock-2,
.clock {
    font-size: 17px
}

#clock span, 
#clock-2 span,
.clock span {
    color: #fff;
    background: #c3cf21;
    line-height: 50px;
    width: 50px;
    text-align: center;
    display: inline-block;
    margin-left: 5px
}

.events-img {
    height: calc(67% - 77px)
}

.events-img img {
    width: 100%;
    height: 100%
}

.upcoming-events {
    height: 150px;
    display: flex;
    align-items: center
}

.upcoming-events .container, .upcoming-events .container .row {
    height: 100%
}

.upcoming-events [class*=col-] {
    height: 100%;
    display: flex;
    align-items: center
}

@media (min-width: 1023px) and (max-width: 1199px) {
    .events a {
        padding: 0 15px;
        font-size: 15px;
        line-height: 40px;
    }

    #clock, 
    #clock-2,
    .clock {
        font-size: 15px
    }
    
    #clock span, 
    #clock-2 span,
    .clock span {
        line-height: 40px;
        width: 40px;
    }    
}

@media (max-width: 1022px) {
    #clock, #clock-2,
    .clock {
        font-size: 11px
    }
    
    #clock span, 
    #clock-2 span,
    .clock span {
        line-height: 35px;
        width: 35px;
    }   
    
    .events a {
        padding: 0 15px;
        font-size: 11px;
        line-height: 35px;
    }  
}

@media (min-width: 768px) and (max-width: 1022px) {
    .upcoming-events .container .row {
        display: flex;
        align-content: space-between;
    }
    .upcoming-events [class*=col-] {
        padding: 0;
        padding-left: 10px;
    }

    .upcoming-events [class*=col-]:nth-child(1) {
        -webkit-flex: 1 1 20%; /* Safari 6.1+ */
        -ms-flex: 1 1 20%; /* IE 10 */ 
        flex: 1 1 20%;
    }

    .upcoming-events [class*=col-]:nth-child(2) {
        -webkit-flex: 1 1 30%; /* Safari 6.1+ */
        -ms-flex: 1 1 30%; /* IE 10 */ 
        flex: 1 1 30%;
    }

    .upcoming-events [class*=col-]:nth-child(3) {
        -webkit-flex: 1 1 35%; /* Safari 6.1+ */
        -ms-flex: 1 1 35%; /* IE 10 */ 
        flex: 1 1 35%;
    }    

    .upcoming-events [class*=col-]:nth-child(4) {
        -webkit-flex: 1 1 15%; /* Safari 6.1+ */
        -ms-flex: 1 1 15%; /* IE 10 */ 
        flex: 1 1 15%;
    }  
}

@media (max-width: 767px) {
    .events-img {
        height: auto;
    }

    .upcoming-events {
        display: block;
        height: auto;
    }

    .upcoming-events [class*=col-] {
        display: block;
        flex: none;
    }

    .events img {
        display: block;
        margin: 10px auto 15px;
        width: auto;
        height: auto;
        max-width: 100%;
        float: none !important;
    }

    .events h4 {
        display: block;
        margin-bottom: 15px;
        float: none !important;
    }

    .events #clock,
    .events .clock {
        margin-bottom: 15px;
        float: none !important;
        text-align: center;
    }

    .events a {
        float: none !important;
        display: block;
        margin-bottom: 15px;
        width: 100%;
        text-align: center;
    }
    .events .our-events a {
        margin-bottom: 0;
        font-size: 20px;
        padding: 0;
        text-align: left;
    }
}
.banner-slider__item .banner-slider__title .description-box {
    line-height: 24px;
    color: #fff;
}

@media (max-width: 640px) {
    .banner-slider__item .banner-slider__title .description-box {
        font-size: 14px;
    }
}

.business-inner {
    background: url(../images/home-business.png) no-repeat;
    background-repeat: round;
}

a {
    color: #000;
}

@media (max-width: 768px) {
    .banner-slider__item .banner-slider__title .description-box {
        line-height: 25px;
    }
}

@media (max-width: 378px) {
    /* .banner-slider__item .banner-slider__title .description-box {
        line-height: 14px;
    } */
}

/*Banner*/

.slick_slide_hp .hp_banner-slider__inner {
    position: absolute;
    top: 20px;
    left: 30px;
    width: 500px;
    height: auto;
    background: #54a1f0;
    color: #fff;
    padding: 10px;
    width: 100%;
    background: rgba(0,182,223,.7);
    margin-bottom: 8.7%;
    max-width: 720px;
}


.hp_banner-slider__inner .description-box {
    color: #fff;
}

.slick_slide_hp .slick-next {
    right: 20px;
    width: 45px;
    height: 45px;
}

.slick_slide_hp .slick-prev:before, .slick-next:before {
    font-size: 45px;
}

.slick_slide_hp .slick-dots li button:before {
    font-size: 13px;
}

.slick_slide_hp .slick-prev {
    left: 20px;
    width: 45px;
    height: 45px;
    z-index: 1;
}

.slick_slide_hp .slick-dots {
    bottom: 30px;
}

@media only screen and (min-device-width : 1336px) and (max-device-width : 1800px) {
    .slick_slide_hp img {
        width: 100%;
        height: 570px;
    }
}

@media only screen and (min-width: 1800px) {
    .slick_slide_hp img {
        width: 100%;
        height: 712px;
    }
}

@media (max-width: 767px) {
    .slick_slide_hp .hp_banner-slider__inner {
        left: 0;
    }
}

.slick_slide_hp .slick-slide img {
    width: 100% !important;
}