.alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba }
.section_slider { margin-bottom: 0px }
    .section_slider .home-slider .slider-text { position: absolute; top: 50%; transform: translate(0, -50%); left: 0px; right: 0; text-align: left; border-radius: 5px; color: #fff; z-index: 2; transition: 2s all; opacity: 0 }
        .section_slider .home-slider .slider-text .slider-content { max-width: 767px }
            .section_slider .home-slider .slider-text .slider-content .title { color: #fff; font-size: 46px; line-height: 1.2; position: relative; transition: 1.4s all; margin-bottom: 15px }
            .section_slider .home-slider .slider-text .slider-content .sup-title { color: #fff; font-size: 18px; transition: 1.4s all; margin-bottom: 15px; display: block }
            .section_slider .home-slider .slider-text .slider-content .button { background-color: var(--mainColor); color: #fff; padding: 15px 35px; border: 0; display: inline-block; font-size: 16px; text-transform: uppercase; font-weight: 600; margin-top: 20px; border-radius: 5px; overflow: hidden; position: relative; z-index: 2 }
                .section_slider .home-slider .slider-text .slider-content .button:after { content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 100%; background-color: var(--mainColor2); z-index: -1; -webkit-transform-origin: right top; transform-origin: right top; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transition: transform 0.8s cubic-bezier(1, 0, 0, 1); -webkit-transition: -webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); transition: -webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); transition: transform 0.8s cubic-bezier(1, 0, 0, 1); transition: transform 0.8s cubic-bezier(1, 0, 0, 1),-webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); vertical-align: top }
                .section_slider .home-slider .slider-text .slider-content .button:hover { color: #fff }
                    .section_slider .home-slider .slider-text .slider-content .button:hover:after { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(1); transform: scale(1); opacity: 1 }
    .section_slider .home-slider .swiper-slide { position: relative; text-align: center }
        .section_slider .home-slider .swiper-slide img { display: block; margin: 0 auto }
        .section_slider .home-slider .swiper-slide.swiper-slide-active .slider-text { opacity: 1 }
    /*.section_slider .home-slider .swiper-slide:after { content: ''; position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: rgba(31,31,31,0.5) }*/
    .section_slider .home-slider .swiper-button-next:after, .section_slider .home-slider .swiper-button-prev:after { font-size: 20px; color: #000 }
    .section_slider .swiper-pagination { bottom: 50px; position: absolute }

@media (max-width: 767px) {
    .section_slider .swiper-pagination { bottom: 10px }
}

@keyframes wave-animate {
    0% { transform: scale(0); opacity: 1; transform-origin: center }
    100% { transform: scale(3); opacity: 0; transform-origin: center }
}

.section_about { padding: 50px 0px }
    .section_about .about-image { position: relative; text-align: center }
        .section_about .about-image img { max-width: 100%; border-radius: 5px }
        /*.section_about .about-image:after { content: ''; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 7; border-radius: 5px; background-color: rgba(18,18,18,0.5) }*/
        .section_about .about-image .block_video_play { position: absolute; left: 50%; top: 50%; z-index: 8; border-radius: 5px; background-color: var(--mainColor); transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transition: all .3s ease-in-out }
            .section_about .about-image .block_video_play .popup-youtube { width: 50px; height: 50px; display: flex; align-items: center; justify-content: center }
                .section_about .about-image .block_video_play .popup-youtube .video-icon { height: 16px; display: flex }
                    .section_about .about-image .block_video_play .popup-youtube .video-icon svg { width: 14px; height: 16px }
            .section_about .about-image .block_video_play:hover { background-color: var(--mainColor2) }
        .section_about .about-image .video-waves .waves { position: absolute; top: 50%; background: transparent; left: 50%; width: 25px; height: 25px; margin-left: -12px; margin-top: -12px; border-radius: 5px; -webkit-backface-visibility: hidden }
            .section_about .about-image .video-waves .waves:before { position: absolute; background: var(--mainColor); margin-left: -12px; margin-top: -12px; width: 50px; height: 50px; content: ""; display: block; border-radius: 5px; -webkit-backface-visibility: hidden; animation: wave-animate 3s infinite ease-out }
            .section_about .about-image .video-waves .waves:after { position: absolute; background: var(--mainColor); margin-left: -12px; margin-top: -12px; width: 50px; height: 50px; content: ""; display: block; border-radius: 5px; -webkit-backface-visibility: hidden; opacity: 0; animation: wave-animate 3s 1.5s infinite ease-out }

@media (max-width: 991px) {
    .section_about .about-image { margin-top: 20px }
}

.section_about .about-content .top-title { color: var(--mainColor2); font-size: 30px; font-weight: 600; display: block; margin-bottom: 10px; text-transform: uppercase }
.section_about .about-content .title { color: var(--textColor); font-size: 38px; font-weight: bold; margin-bottom: 20px }

@media (max-width: 767px) {
    .section_about .about-content .title { font-size: 32px }
}

.section_about .about-content .desc { color: var(--textColor); font-size: 16px; margin-bottom: 15px; line-height: 24px }
.section_about .about-content .single-about { margin-top: 10px; margin-bottom: 20px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08); padding: 15px; border-radius: 10px; }
    .section_about .about-content .single-about .icon { display: block; margin-bottom: 25px }
        .section_about .about-content .single-about .icon img { height: 50px }
    .section_about .about-content .single-about h3 { color: var(--textColor); font-size: 24px; font-weight: bold; margin-bottom: 10px }
    .section_about .about-content .single-about p { color: var(--textColor); font-size: 16px; line-height: 24px; margin-bottom: 20px; text-align: justify; }
    .section_about .about-content .single-about .read-more { font-weight: 500; font-size: 15px; color: var(--textColor) }
        .section_about .about-content .single-about .read-more:hover { color: var(--mainColor) }
            .section_about .about-content .single-about .read-more:hover svg { fill: var(--mainColor) }

@media (max-width: 991px) {
    .section_about .col-right { order: -1 }
}

.section_statistic { padding-bottom: 80px }
    .section_statistic .item { display: flex; align-items: center; gap: 30px }
        .section_statistic .item .icon img { max-height: 60px }
        .section_statistic .item .content .counter-number-wrapper { color: var(--mainColor); font-size: 48px; font-weight: bold; line-height: 1.1em }
        .section_statistic .item .content .static-title { color: var(--textColor); font-size: 14px; font-weight: 600; text-transform: uppercase }

@media (max-width: 991px) {
    .section_statistic .item { margin-bottom: 20px }
}

.section_banner { position: relative; padding: 80px 0px; background-image: url(background_banner-1.jpg); background-position: center center; background-repeat: no-repeat; background-size: cover }
    .section_banner .banner-content { width: 100%; max-width: 768px; position: relative; margin: 0px auto; text-align: center }
        .section_banner .banner-content h2 { color: #fff; font-size: 38px; font-weight: 500; margin-bottom: 20px }

@media (max-width: 500px) {
    .section_banner .banner-content h2 { font-size: 33px }
        .section_banner .banner-content h2 br { display: none }
}

.section_banner .banner-content .banner-ctas .cta { background-color: var(--mainColor); color: #fff; padding: 15px 35px; border: 0; display: inline-block; font-size: 16px; text-transform: uppercase; font-weight: 600; margin-top: 20px; border-radius: 5px; overflow: hidden; position: relative; z-index: 2 }
    .section_banner .banner-content .banner-ctas .cta:after { content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 100%; background-color: var(--mainColor2); z-index: -1; -webkit-transform-origin: right top; transform-origin: right top; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transition: transform 0.8s cubic-bezier(1, 0, 0, 1); -webkit-transition: -webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); transition: -webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); transition: transform 0.8s cubic-bezier(1, 0, 0, 1); transition: transform 0.8s cubic-bezier(1, 0, 0, 1),-webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); vertical-align: top }
    .section_banner .banner-content .banner-ctas .cta:hover { color: #fff }
        .section_banner .banner-content .banner-ctas .cta:hover:after { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(1); transform: scale(1); opacity: 1 }
.section_banner:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #1F1F1F; opacity: 0.8 }
.section_progress { position: relative; padding: 80px 0px 0px }

@media (max-width: 991px) {
    .section_progress { padding: 60px 0px }
}

.section_progress .block-title { text-align: left }
    .section_progress .block-title .top-title { color: var(--mainColor) }
    .section_progress .block-title h2 { color: #fff }
    .section_progress .block-title p { color: #fff; font-size: 16px; margin-bottom: 15px }
.section_progress:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #007dc2; opacity: 0.8 }
.section_progress .all-skill-bar { margin-bottom: 20px }
    .section_progress .all-skill-bar .progress { vertical-align: baseline; -webkit-appearance: none; -moz-appearance: none; display: block; width: 100%; border: 0; background-color: #f8f8f8; margin-bottom: 10px; height: 18px; border-radius: 500px; overflow: hidden }
        .section_progress .all-skill-bar .progress .progress-bar { color: #fff; height: 100%; line-height: 18px; text-align: center; background-color: var(--mainColor); transition: width .6s ease }
    .section_progress .all-skill-bar .progress-title { color: #fff; font-size: 16px; font-weight: bold }
.section_whychoose { padding: 80px 0px }
    .section_whychoose .block-title { text-align: left }
        .section_whychoose .block-title p { color: var(--textColor); font-size: 16px }
    .section_whychoose .whychoose-content .why-box { display: table; width: 100%; position: relative; margin-bottom: 20px }
        .section_whychoose .whychoose-content .why-box .box-icon { display: table-cell; vertical-align: top; width: 50px }
            .section_whychoose .whychoose-content .why-box .box-icon img { width: 50px }
        .section_whychoose .whychoose-content .why-box .box-content { display: table-cell; vertical-align: top; padding-left: 15px }
            .section_whychoose .whychoose-content .why-box .box-content h3 { color: var(--textColor); font-size: 20px; font-weight: bold; margin-bottom: 7px }
            .section_whychoose .whychoose-content .why-box .box-content p { color: var(--textColor); font-size: 16px; text-align: justify; }
    .section_whychoose .whychoose-image { position: relative }
        .section_whychoose .whychoose-image img { max-width: 100% }
.section_team { position: relative; padding: 80px 0px; background-image: url(background_team-1.jpg); background-position: center center; background-repeat: no-repeat; background-size: cover }
    .section_team .container-fluid { padding: 0px 40px }

@media (max-width: 767px) {
    .section_team .container-fluid { padding: 0px 15px }
}

.section_team .block-content .swiper-slide { padding-bottom: 30px }
.section_team .team-item { position: relative; z-index: 1; transition: 0.3s; padding-bottom: 30px }
    .section_team .team-item .team-image { position: relative }
        .section_team .team-item .team-image .thumb { display: block; position: relative; padding-bottom: 111% }
            .section_team .team-item .team-image .thumb img { left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 100%; max-height: 100%; width: auto !important; height: auto !important; position: absolute; transition: all .4s ease; border-radius: 10px }
    .section_team .team-item .team-info { padding: 15px; background: #fff; position: absolute; z-index: 1; left: 30px; bottom: 0px; width: calc(100% - 50px); border-radius: 5px; box-shadow: 6px 5px 16px 0px rgba(0,0,0,0.15); transition: 0.5s }
        .section_team .team-item .team-info .name a { color: var(--textColor); font-size: 20px; font-weight: bold }

@media (max-width: 1199px) {
    .section_team .team-item .team-info .name a { font-size: 18px }
}

@media (max-width: 767px) {
    .section_team .team-item .team-info .name a { font-size: 15px }
}

.section_team .team-item .team-info .name a:hover { color: var(--mainColor) }
.section_team .team-item .team-info .department { font-size: 14px; color: #989898; padding-top: 6px; text-transform: uppercase }

@media (max-width: 1199px) {
    .section_team .team-item .team-info .department { font-size: 13px }
}

@media (max-width: 1199px) {
    .section_team .team-item .team-info { left: 15px; padding: 10px; width: calc(100% - 30px) }
}

.section_team .team-item .social { display: flex; flex-direction: column; position: absolute; top: 15px; right: 15px; transition: 0.4s; pointer-events: none }
    .section_team .team-item .social a { width: 35px; height: 35px; border-radius: 50%; text-align: center; pointer-events: auto; margin-bottom: 10px; box-shadow: 6px 5px 16px 0px rgba(0,0,0,0.15); transition-property: all, transform; transition-duration: 0.5s; opacity: 0; transform: translateX(10px); display: flex; align-items: center; justify-content: center; background-color: #fff }
        .section_team .team-item .social a img { width: 15px }
        .section_team .team-item .social a:nth-child(2) { transition-delay: 0s, 0.1s }
        .section_team .team-item .social a:nth-child(3) { transition-delay: 0s, 0.2s }
        .section_team .team-item .social a:nth-child(4) { transition-delay: 0s, 0.3s }
        .section_team .team-item .social a:nth-child(5) { transition-delay: 0s, 0.4s }
        .section_team .team-item .social a:hover { background-color: var(--mainColor) }
            .section_team .team-item .social a:hover img { filter: brightness(0) invert(1) }
.section_team .team-item:hover .team-info { bottom: 60px }

@media (max-width: 1199px) {
    .section_team .team-item:hover .team-info { bottom: 40px }
}

.section_team .team-item:hover .social a { opacity: 1; transform: translate(0); pointer-events: auto; visibility: visible }
.section_view_product { position: relative; padding: 60px 0px; background-image: url(background_view_product-1.jpg); background-position: center center; background-repeat: no-repeat; background-size: cover }

@media (max-width: 767px) {
    .section_view_product .col-left { text-align: center }
}

.section_view_product .col-left p { margin: 0; color: #fff; font-size: 32px; font-weight: bold }

@media (max-width: 767px) {
    .section_view_product .col-left p { font-size: 28px }
}

.section_view_product .col-right { text-align: right }

@media (max-width: 767px) {
    .section_view_product .col-right { text-align: center; margin-top: 10px }
}

.section_view_product .col-right a { color: var(--mainColor); font-size: 16px; font-weight: 600; padding: 15px 30px; border: 0; display: inline-block; text-transform: uppercase; border-radius: 5px; overflow: hidden; position: relative; z-index: 2; background-color: #fff }
    .section_view_product .col-right a:after { content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 100%; background-color: var(--mainColor); z-index: -1; -webkit-transform-origin: right top; transform-origin: right top; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transition: transform 0.8s cubic-bezier(1, 0, 0, 1); -webkit-transition: -webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); transition: -webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); transition: transform 0.8s cubic-bezier(1, 0, 0, 1); transition: transform 0.8s cubic-bezier(1, 0, 0, 1),-webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); vertical-align: top }
    .section_view_product .col-right a:hover { color: #fff }
        .section_view_product .col-right a:hover:after { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(1); transform: scale(1); opacity: 1 }
.section_view_product:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #1F1F1F; opacity: 0.8 }
.section_blog { padding: 80px 0px }
    .section_blog .item-blog { position: relative }
        .section_blog .item-blog .block-thumb { position: relative }
            .section_blog .item-blog .block-thumb .thumb { display: block; position: relative; padding-bottom: 70% }
                .section_blog .item-blog .block-thumb .thumb img { left: 50%; top: 50%; transform: translate(-50%, -50%); max-width: 100%; max-height: 100%; width: auto !important; height: auto !important; position: absolute; transition: all .4s ease }
        .section_blog .item-blog .block-content { padding: 10px 0px }
            .section_blog .item-blog .block-content h3 { margin: 0 0 6px }
                .section_blog .item-blog .block-content h3 a { font-size: 17px; font-weight: bold; color: var(--mainColor2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: initial; overflow: hidden; line-height: 1.4; min-height: 42px; word-wrap: break-word }
                    .section_blog .item-blog .block-content h3 a:hover { color: var(--mainColor) }
            .section_blog .item-blog .block-content .time-post { position: relative; font-size: 14px; font-weight: 600; color: var(--textColor); margin: 0 0 10px }
                .section_blog .item-blog .block-content .time-post .author-post { display: inline-block; vertical-align: middle; margin-right: 5px }
                .section_blog .item-blog .block-content .time-post .date-post { display: inline-block; vertical-align: middle }
                .section_blog .item-blog .block-content .time-post svg { width: 15px; height: 15px; margin-top: -3px; margin-right: 2px; fill: var(--mainColor) }
            .section_blog .item-blog .block-content .article-content { color: #535353; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; white-space: initial; overflow: hidden; text-align: justify; }

@media (max-width: 991px) {
    .section_blog .item-blog { margin-bottom: 30px }
}

@media (max-width: 767px) {
    .section_blog { padding: 40px 0px }
}

.swiper-button-next:after, .swiper-button-prev:after { font-size: 16px; font-weight: bold; color: #333 }
.text-white { color: white !important; }

.section_values .desc { font-size: 15px; }