/*  FONTS
====================================*/



/*  DEFAULT
====================================*/

img {
    max-width: 100%;
    height: auto;
}

a{
    transition: all .3s;
    text-decoration: none;
}

svg {
    fill: currentColor;
}

.icon {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    fill: currentColor;
    vertical-align: -0.15em;
}

.icon-xs {
    width: 0.5rem;
    height: 0.5rem;
}

.icon-sm {
    width: 0.75rem;
    height: 0.75rem;
}

.icon-md {
    width: 1.5rem;
    height: 1.5rem;
    vertical-align: -0.35em;
}

.icon-2x {
    width: 2rem;
    height: 2rem;
}

.icon-24 {
    width: 1.5rem;
    height: 1.5rem;
}

.icon-28 {
    width: 28px;
    height: 28px;
}

.icon-38 {
    width: 38px;
    height: 38px;
}

.icon-3x {
    width: 3rem;
    height: 3rem;
}

.icon-4x {
    width: 4rem !important;
    height: 4rem !important;
}

.icon-5x {
    width: 5rem;
    height: 5rem;
}

.circle {
    display:inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.help-block {
    font-size: 13px;
    padding: 0.25rem 0;
    display: block;
}

.has-error .error {
    color: #b30000 !important;
}

.has-error .form-control,
.has-error .custom-checkbox .custom-control-label::before {
    border-color: #b30000 !important;
}

.has-error .form-control::placeholder,
.has-error .custom-checkbox .custom-control-label {
    color: red !important;
}

.block {
    position: relative;
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.block-top {
    padding-top: 2rem;
}

.block-bottom {
    padding-bottom: 2rem;
}

.title-bottom-line {
    position: relative;
    padding-bottom: 1rem;
}
.title-bottom-line:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 4.8rem;
    height: 5px;
    border-radius: 3px;
    background-image: linear-gradient(45deg, #026bb2, #7FBBDD);;
}
.title-border-left {
    position: relative;
    padding-left: 2rem;
    font-size:1.25rem;
    margin-bottom: 1.75rem
}
.title-border-left:after {
    content: "";
    position: absolute;
    left: 0;
    top:50%;
    width: 1.25rem;
    height: 5px;
    border-radius: 3px;
    background-image: linear-gradient(45deg, #071F93, #026bb2);;
}
.title-bottom-line.text-center:after {
    left: 50%;
    margin-left:-2.4rem;
}
.box {
    position: relative;
    display: block;
    width: 100%;
    padding: 1rem;
    margin-bottom: 1.5rem;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 3px 5px 1rem rgba(0, 0, 0, 0.1);
    transition: all 0.3s;
}
/* Box Icon */
.box-icon {
    display:flex;
    padding: 0.75rem 0rem;
    background-size:auto 100%;
    box-shadow:none;
}
.box-icon__icon {
    align-items: center;
    color:#F91942;
    line-height: 0;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.3s;
    margin-bottom:.5rem
}
.box-icon__body {
    align-items:center;
    flex:1 1 auto;
    line-height: 1.4;
}

.box-icon:hover .box-icon__icon {
    background-color:transparent;
    color: #fff;
}
/* Box Icon */
.box-icon_shadow {
    display:block;
    padding: .75rem 1.25rem;
    border-radius: .5rem;
    background-size:auto 100%;
    box-shadow: 0px 5px 1rem rgba(0, 0, 0, 0.1);
    position: relative;
    border: 1px solid #fff;
}
.box-icon_shadow:hover {color:#ff7b02 }
.box-icon_shadow::before, .box-icon_shadow::after {
  width: 100%;
  height:100%;
  z-index: 3;
  content:'';
  position: absolute;
  top:0;
  left:0;
  box-sizing: border-box;
  -webkit-transform: scale(0);
  transition: 0.5s;
  border: 1px solid #ff7b02;
  border-radius: .5rem;
}
.box-icon_shadow.box::before {
  border-bottom:1px solid #ff7b02;
  border-left:1px solid #ff7b02;
  -webkit-transform-origin: 0 100%;
  border-radius: .5rem;
}

.box-icon_shadow.box::after {
  border-top:1px solid #ff7b02;
  border-right:1px solid #ff7b02;
  -webkit-transform-origin: 100% 0%;border-radius: .5rem;
}

.box-icon_shadow:hover::after, .box-icon_shadow:hover::before {
  -webkit-transform: scale(1);
}

.box-square{
    box-shadow: none;
    border: 1px solid #009FC7;
    border-radius: 0 9px 9px 9px;
    position: relative;
    transition: all .3s;
}
.box-square .box-icon__icon{ width: auto; justify-content: center; margin-bottom: .5rem;}
.box-square .box-icon__body{ padding-left: 0; color: #001341;transition: all .3s; }
.box-square:before{
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    top: 0;
    background-color: #EBFAFF;
    display: block;
    clip-path: circle(30.5% at 0 0);
    transition: all .3s;
}
.box-square:hover {background-color:rgba(0,183,214,0.8);
position: relative;
color: #fff;
}
.box-square:hover .box-icon__body{ color: #fff }
.box-square:hover .box-icon__icon svg path{fill:#fff !important;}
.box-square:hover:before{
    z-index: -2;
    clip-path: circle(45.5% at 0% 0%);
    background-image: linear-gradient(-45deg, #071F93,#026bb2,#026bb2,#071F93);
}
.box-square:hover:after{content: "";
    position: absolute;
    left: 0;
    width: 100%;
    z-index: -1;
    height: 100%;
    top: 0;
    background-color: #fff;
    display: block;
    clip-path: circle(30.0% at 0% 0%);
}

.box-round {
    padding:0.5rem;
    margin-bottom: 1rem;
}

.box-round__image {
    border-radius: 0 26px 26px 26px;
    width:100%;
    height: 100%;
    object-fit: cover;
}

.box-round .title-bottom-line {
    font-size:30px;
}
.box-round p {
    margin-bottom: 0;
}

.accordion .card {margin: 0 -.75rem;}
.accordion .card-body {height: 200px; overflow-y: scroll; margin:0 1rem 0 .5rem;}
.accordion > .card > .card-header .btn span{display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;}
.accordion .card-body::-webkit-scrollbar-track
{
    border-radius: 5px;
    background-color: #F5F5F5;
}

.accordion .card-body::-webkit-scrollbar
{
    width: 5px;
    background-color: #F5F5F5;
}

.accordion .card-body::-webkit-scrollbar-thumb
{
    border-radius: 5px;
    background-color: #026bb2;
}

.nav-pills .btn-secondary span {color: #001341}
.nav-pills .btn-secondary.active:hover span,
.nav-pills .btn-secondary:hover span {color: #fff;}
.nav-pills .btn-secondary.active span {color: #F84726}

/*  PAGE HERO
====================================*/
.page-hero {
    background-image:url(../img/bg-hero.jpg);
    background-size:cover
}
.page-hero__wrapper {
    position: relative;
    align-items: center;
    display: flex;
    justify-content: center;
    width: 100%;
    text-align:center;
}
.page-hero .page-hero__title {
    font-size: 2rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: .5rem;
}
.page-hero {
    position: relative;
    min-height: 200px;
}

.page-hero__image {
    width:100%;
    height: 100%;
    object-fit: cover;
}
.page-hero__body {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.page-hero__title {
    color:#fff;
    font-size: 36px;
    font-weight: 400;
    text-transform: uppercase;
}

.page-hero .breadcrumb { font-size:13px;    margin: 0;
    padding: 0;
    background-color: transparent;
}
.page-hero .breadcrumb .breadcrumb-item,
.page-hero .breadcrumb .breadcrumb-item a {
        color:#fff;
}
.page-hero .breadcrumb-item + .breadcrumb-item::before {
        color:#fff;
        content:">";
    }
    .page-hero .breadcrumb .breadcrumb-item:hover a,
.page-hero .breadcrumb .breadcrumb-item.active {color:#F84726;}


/*  WIDGET
====================================*/
.widget-title {
    position: relative;
    color:#001341;
    font-weight: normal;
}
.widget-title span {
    position: relative;
    display:inline-block;
    padding-right: 0.75rem;
    background-color:#fff;
}
.widget-title:before {
    content:"";
    position: absolute;
    left: 0;
    top: 11px;
    width: 100%;
    height: 2px;
    background-color: #E8E8E8;
}
.widget-category ul li{
    border-bottom: 1px solid rgba(188,188,188,0.39);
}

.widget-category ul li a {
    position: relative;
    display: block;
    padding: 0.5rem 0 0.5rem 1.25rem;
    color: #393939;
    font-size: .875rem;
}

    .widget-category ul li a::before {
        content: "";
        position: absolute;
        left: 0;
        top: 19px;
        width: 7px;
        height: 3px;
        background-color: #D7D7D7;
    }

    .widget-category ul li a:hover,
    .widget-category ul li.active a {
        color: #F84726;
        text-decoration: none;
    }

        .widget-category ul li.active a:before,
        .widget-category ul li a:hover:before {
            background-color: #F84726;
        }
.widget-map ul {
    display: flex;
    flex-wrap: wrap;
}

    .widget-map ul li {
        flex: 0 0 auto;
        margin:.25rem;
    }

        .widget-map ul li a, .tag {
            color: #8D8D8D;
            border-radius: 4px;
            color: #8D8D8D;
            font-size: 14px;
            padding: 8px;
            text-decoration: none;
            border: 1px solid #DBDBDB;
            display:inline-block
        }
            .widget-map ul li a .icon, .tag .icon {
                vertical-align: -0.30em;
                fill: #F84726;
            }

            .widget-map ul li a:hover, .tag:hover {
                background-color: #F84726;
                color: #fff;
            }
        .widget-map ul li:hover a .icon {
            fill: #fff;
        }
/*  HEADER
====================================*/
.header {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
}
.header .header-top__menu a{
    color: #01164a;
}
.header .header-top__menu a:hover{
    color: #026bb2;
}
    
.header-button a:hover{color:#A4D7DE !important;}    

.navbar .container{border-top:1px solid #D4EBF7; }

.navbar-brand__logo {
    width: 210px;
}

.header-right {
    display: flex;
    align-items: center;
}
.header-lang {
    position: relative;
    margin-left:1rem;
    padding-left: 0.5rem;
}
.header-lang:before {
    content:"";
    position: absolute;
    left:0;
    width:1px;
    height:60%;
    top:20%;
    background-color:#6DAEC7;
}
.header-lang .dropdown-menu {
    min-width: 1rem;
}

.header-lang .dropdown-toggle::after {
    margin-left: 0.5em;
    vertical-align: 0.125em;
    border-top: 4px solid #026bb2;
    border-right: 3px solid transparent;
    border-bottom: 0;
    border-left: 3px solid transparent;
}

.header-lang .dropdown-item,
.header-lang .dropdown-toggle {
    display: flex;
    align-items: center;
}
.header-lang .dropdown-toggle::after {
    margin-left:0.5rem;
}
.navbar-nav .dropdown-toggle::after {
    margin-left: 0.5em;
    vertical-align: 0.125em;
    border-top: 4px solid #026bb2;
    border-right: 3px solid transparent;
    border-bottom: 0;
    border-left: 3px solid transparent;
}
.navbar-nav .nav-item{margin:0 .25rem;}
.navbar-nav .nav-link{
     border: 0;
    border-top: 4px solid transparent;
    color: #fff;
    font-size: .875rem;
}
.navbar-nav .nav-link:hover,
.navbar-nav .dropdown:hover .nav-link {
   border: 0;
   border-top: 4px solid #fff
}
.navbar-nav .nav-link.active {
    color: #fff;
    background-color: #F91942;
    border-color: #F91942;
}


.header-lang .dropdown-item span,
.header-lang .nav-link span {
    margin-left: 0.375rem;
}
.header-lang .dropdown-menu {
    min-width: 2rem;
}
.header-lang .dropdown-menu a{
    padding: 0.25rem 1rem;
}

.navbar-toggler {
    position: relative;
    height: 2rem;
    width: 2rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    margin-left: .5rem;
    background-color:transparent;
}

.navbar-toggler i {
    display: block;
    position: absolute;
    top: 9px;
    right: 22.5%;
    width: 55%;
    height: 3px;
    transition: all 0.4s;
    border-radius: 1rem;
    background-color: #004675;
}

.navbar-toggler i:nth-child(2) {
    top: 15px;
    transition: all 0s;
}

.navbar-toggler i:nth-child(3) {
    top: 21px;
}

.menu--open,
.menu--open body {
    overflow: hidden;
}

.menu--open .navbar-toggler,
.btn-toggler.active {
    z-index: 19999;
}

.menu--open .navbar-toggler i:first-child,
.navbar-toggler.active i:first-child {
    top: 15px;
    -webkit-transform: rotate(135deg) !important;
    transform: rotate(135deg) !important;
}

.menu--open .navbar-toggler i:nth-child(2),
.navbar-toggler.active i:nth-child(2) {
    opacity: 0;
    left: 60px;
}

.menu--open .navbar-toggler i:nth-child(3),
.navbar-toggler.active i:nth-child(3) {
    top: 15px;
    -wekit-transform: rotate(-135deg) !important;
    transform: rotate(-135deg) !important;
}

.menu--open .bg-navbar {
    visibility: visible;
    z-index: 5999;
    opacity: 0.8;
}

.bg-navbar,
.bg-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: -1;
    visibility: hidden;
    opacity: 0;
    transition: all 0.3s;
}

.header--fixed .header .navbar,
.header-color.header--fixed .navbar {
    -webkit-animation: transform-top 0.4s;
    animation: transform-top 0.4s;
    height:74px;
}

.header--fixed .navbar {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    -webkit-animation: transform-top 0.4s;
    animation: transform-top 0.4s;
    z-index: 16999;
    background-color: #fff;
    box-shadow: 0 0 1rem rgba(0, 0, 0, 0.15);
}


/*  MAIN SLIDER
====================================*/
.main-slider {
    position: relative;
}
.main-slider .slick-slider{
    border: 1px solid #ddd; padding: 5px;
}
.main-slider .slick-track {
    display: flex;
}

.main-slider .slick-slide {
    position: relative;
    display: flex;
    height:auto;
}

.main-slider *:focus{outline: none}
.main-slider .slider_top-text {
    position: relative;
}
.main-slider  .slider_content-text{color: #2c63b4}
.main-slider .slider_top-text span{
    background-color: #edf9ff;
    padding-right: 10px;
}
.main-slider .slider_top-text:before {
    content: "";
    width: 38%;
    height: 1px;
    background-color: #136C9F;
    display: inline-block;
    position: absolute;
    transform: translateY(12px);
    right: 0;
    top: 0;
    z-index: -1;
}
.main-slider .slider-title {
    font-size: 3rem;
    color: #00B7D6;
    font-weight: 500
}
.main-slider .slider-media {
    position: relative;
    z-index:20;
}
.main-slider .slider-image {
    display: inline-block;
}
.main-slider .custom-dots {
    position: absolute;
    top:50%;
    transform: translateY(-50%);
    left:0%;
    width: 100%;
    z-index: 10;
    
}
.main-slider .slick-next{right: 0; background-color: #fff;}
.main-slider .slick-prev{left: 0;background-color: #fff;}
.main-slider .slick-dots {
    transform: translate(50%,0);
    margin:0;
    padding:0rem;
}

/*  MAIN
====================================*/

/* Block About */

.block-about{position: relative; background: url(../img/about-bg.png) no-repeat left bottom; background-size: 50% 100%}
.block-about_text{
    display: block;
    color: rgba(255,255, 255, .1);
    font-weight: lighter;
    position: absolute;
    bottom: 0;
    left:2%;
    font-size: 280px;
    line-height: .5;
    pointer-events: none;
    z-index: 1;
}

.block-whychoose { position: relative;}
.block-whychoose:before{clip-path: ellipse(30% 45% at 0% 50%);width: 10rem; content: ""; position: absolute;
    height: 10rem; background-color: #EBFAFF; left: 0; top: 25%; display: block}

.block-whychoose .whychoose-form{
    position: relative;
}
.block-whychoose .whychoose-form:before,
.block-whychoose .whychoose-form:after {
    content: "";
    position: absolute;
    left: 0;
    z-index: -1;
    top: 3rem;
    display: block;
    clip-path: circle(50% at 100% 50%);
    width: 4rem;
    height: 10rem;
    background-image: linear-gradient(45deg, rgba(8, 239, 239, .2),rgba(7, 31, 147, .2));
}
.block-whychoose .whychoose-form:after {
    clip-path: circle(30% at 100% 50%);
    background-color: #fff;
    background-image: none;
}

.block-whychoose .bg-bottom{transition: all .3s;}
.block-whychoose .bg-bottom:before,
.block-whychoose .bg-bottom:after {
    content: "";
    transition: all .3s;
    position: absolute;
    right: -2rem;
    z-index: -1;
    bottom: -1.5rem;
    display: block;
    clip-path: circle(50% at 50% 50%);
    width: 25rem;
    height: 25rem;
    background-image: linear-gradient(45deg, rgba(8, 239, 239, 1),rgba(7, 31, 147, 1));
}
.block-whychoose .bg-bottom:after {
    clip-path: circle(35% at 50% 50%);
    background-color: #fff;
    background-image: none
}


/* Block Home Blog */
.home-blog{
    background: url(../img/bg_home_blog.png) no-repeat center;
}

.blog-item {
    position: relative;
    overflow: hidden;
    margin-bottom: 1.5rem;
}

.blog-item__media {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    overflow: hidden;
    border-radius: 4px;
    margin-bottom: 0;
    height: 200px;
}


.blog-item__image {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 4px;
    object-fit: cover;
    transition: transform 0.4s;
}

.blog-item__date {
    font-size: 14px;
}

.blog-item__title {
    font-size: 1rem;
    margin: 1rem 0 .75rem;
    color: #313131;
}

.blog-item__title a {
    color: inherit;
    text-decoration: none;
}
.blog-item_summary{font-size: .975rem}

.blog-item:hover .blog-item__image {
    transform: scale(1.05);
}
.blog-box {margin-top:-3rem; position: relative;}

.blog-box_bottom {border-top: 1px solid #BFBFBF; padding-top: 1rem;}
.blog-box_bottom date .icon { fill: #F84726;}

.blog-item:hover .blog-item__title {
    color: #F84726;
}

.blog-item .blog-read_more{
    color: #F84726;
    transition: all .3s;
    text-decoration: none;
    font-size: 12px;
    text-transform: uppercase;
}
.blog-item .blog-read_more span{
display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.375rem;
    color: #F84726;
    border: 2px solid #F84726;
    border-radius: 50%;
    margin-right: 0.5rem;
    transition: all 0.3s;
}
.blog-item .blog-read_more:hover{
    color: #313131;
    text-decoration: none
}
.blog-item .blog-read_more:hover span{
    border-color: #F84726;
    background-color: #F84726;
    color: #fff;
}

.blog-meta li:nth-child(n+2) {
    padding-left: .5rem
}
.blog-meta li a{
    border: 1px solid #DBDBDB;
    border-radius: 4px;
    color: #8D8D8D;
    font-size: 12px;
    padding: 8px;
    text-decoration: none
}
.blog-meta li a .icon{
    vertical-align: -0.30em;
    fill: #F84726;
}
.blog-meta li:hover a{background-color:#F84726; color: #fff; }
.blog-meta li:hover a .icon{
    vertical-align: -0.30em;
    fill: #fff;
}


.js-blog-list .slick-list {
    margin-left: -1rem;
    margin-right: -1rem;
}

.js-blog-list .slick-slide {
    padding-left: 1rem;
    padding-right: 1rem;
}

.js-blog-list .slick-arrow {
    top: 50%;
    width: 2rem;
    height: 2rem;
    margin-top: -1rem;
}


.js-blog-list .slick-prev {
    left: -3rem;
}

.js-blog-list .slick-next {
    right: -3rem;
}








/*  FOOTER
====================================*/
.footer { background:#011341 url('../img/bg-footer.png') no-repeat center; background-size:cover  }
.footer .title-bottom-line {font-size: 1rem;}
.footer .title-bottom-line:after {width: 2.5rem;}

.footer-menu li a{font-size:.75rem; color: #fff; text-decoration: none; line-height: normal;}
.footer-menu li:hover a{color: #F84726}




.footer-bottom{
    background-color:#0A2653;
}


/*  PAGE HERO
====================================*/
.page-hero__title {
    font-size:22px;
    font-weight: 400;
    color: #000;
}



.figure-text {
    color: #fff;
    text-align: center;
    padding:0.5rem;
    font-weight: 500;
    background-color:#192E3F;
}


/*  CROSS BROWSER
====================================*/
/*Internet Explorer */
/* IE-10 */
/* Safari */
.safari .form-control,
.safari .btn {
    line-height: normal;
}


/*  MEDIA QUERY
====================================*/
@media (max-width: 1399px) {

}
@media (max-width: 1199px) {

    html,
    body {
        overflow-x: hidden;
    }

    .header {box-shadow: 0 6px 14px rgba(0, 0, 0, .15) }

    .navbar-collapse {
        position: fixed;
        display: block !important;
        align-items: flex-start;
        left: 0;
        top: 0;
        padding: 7rem 2rem 2rem 2rem;
        width: 100%;
        height: 100vh !important;
        max-width: 40rem;
        transform: translateX(-110%);
        background-color: rgba(255, 255, 255, 1);
        box-shadow: 0 0 1rem rgba(0, 0, 0, 0.16);
        transition: transform 0.5s;
        overflow: hidden;
        overflow-y: auto;
        z-index: 999;
    }
    .menu--open .navbar-brand {
        position: relative;
        z-index: 7999;
        top: -30px;
    }

    .menu--open .navbar-collapse {
        transform: translateX(0%);
        z-index: 6999;
    }

   
    .navbar-nav {
        margin-bottom: 1.5rem;
    }

    .navbar-nav .nav-link {
        padding:1rem 1rem .5rem;
        border-bottom: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 0;
    }

    .navbar-nav .nav-item:last-child .nav-link {
        border-bottom-width: 0;
    }

    .navbar-nav .dropdown-toggle::after {
        position: absolute;
        right: 7px;
        top: 25px;
        transition: all 0.3s;
    }

    .navbar-nav .dropdown.show .dropdown-toggle::after {
        transform: rotate(180deg);
    }

    .navbar-nav .dropdown-menu {
        background-color: transparent;
        border: 0;
        border-bottom: 1px solid rgba(0,0,0,0.075);
        box-shadow:none;
    }

    .navbar-nav .dropdown-item {
        padding-left: 1rem;
        padding-right: 1rem;
        color: #707070;
        font-size:14px;
    }

    .navbar-nav .dropdown-item.active {
        color: #FEC82E;
    }

    .navbar .social-menu {
        text-align:center;
        display:flex;
        max-width:280px;
    }
    .navbar .social-menu li {
        flex:1 1 auto;
    }
    .navbar .social-menu li a {
        margin-right: 0;
    }
    

    .main-slider  {
        margin-top: 5rem
    }
}

@media (max-width: 991px) {
   
   .main-slider{
    margin-top: 2rem;
    background-position: 70% 0;
   }
    .main-slider .slider-text {
        line-height: 1.4;
    }
    .main-slider .slider-media {
        text-align: center;
        padding-left:0;
        padding-right:0;
    }
    .main-slider .slider-title,
    .main-slider .slider_content-text{color: #fff}
    .main-slider .slider_top-text:before{
        background-color: #fff;
        width: 25%
    }
    .main-slider .slider_top-text span{
        background-color: transparent;
        color: #fff;
    }

    .main-slider .slider-media img {
        margin: 0 auto;
    }
    .main-slider .slider-content {
        padding-top:4rem;
        width: 100%;
        text-align: center
    }
    .main-slider .slider-content img {
        max-height: 3.5rem;
    }

    .block-media__body {
        margin-bottom: -3rem;
    }

    .navbar .social-menu li .icon {
        width:1.5rem;
        height:1.5rem;
        color: #707070;
    }
    .main-slider .slider-body {
        text-align: center;
    }
    .main-slider .slider-media img {
        max-height: 35rem;
    }
    .main-slider .play-icon {
        padding:0.5rem;
    }
    .main-slider .play-icon__inner {
        width:2.5rem;
        height:2.5rem;
    }
    .main-slider .custom-dots {
        text-align: center;
    }
    
    
}

@media (max-width: 767px) {

    html,
    body {
        overflow-x: hidden;
    }

    .header-top__link span,
    .main-slider .slick-slide:after,
    .article-prev-next .content-banner__text,
    .header-lang .nav-link span,
    .header-lang:before {
        display:none;
    }
    .navbar {
        padding-top:0.75rem;
        padding-bottom:0.75rem;
    }
    .header-button a {
        padding-left: 1rem;
        padding-right: 1rem;
        flex: 1 1 auto;
    }

    .header--fixed .header .navbar {
        height: 72px;
    }
    .navbar-collapse {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .navbar .social-menu {
        max-width:100%;
    }
    .header-lang {
        margin-left: 0;
        padding-left:0;
    }
    
    .header-right {
        margin-left:auto;
    }
    .main-slider .slick-slide {
        padding-bottom:0;
    }
    .main-slider .slider-text {
        font-size:22px;
    }
    .main-slider .btn {
        padding: 0.5rem 0.5rem;
        font-size:13px;
    }
    .main-slider .custom-dots {
        bottom:0.5rem;
    }
    .box-step {
        width: calc(100% - 3rem);
        margin-left: auto;
        margin-right: auto;
    }
    .box-step {
        margin-bottom:2.5rem;
    }
    .content-banner__body {
        padding:1rem;
    }
    .content-banner__title {
        font-size:14px;
        margin-bottom: 0.5rem;
    }
    .block-contact .h4 {
        line-height: 1.6;
        font-size: 14px;
        max-width: 60%;
        margin: 1rem auto;
    }

    .footer-social {
        padding:1rem;
        background-color: #F4F4F4;
        border-radius: 5px;
        margin-bottom:1rem;
    }

}

@media (max-width: 567px) {
    .card-product .js-chart {
        max-height: 2.5rem;
    }
}

@media (max-width: 374px) {}

@media (min-width: 568px) {}

@media (min-width: 568px) and (max-width: 767px) {}

@media (min-width: 768px) {
    .block {
        padding-top: 2.5rem;
        padding-bottom: 2.5rem;
    }

    .block-top {
        padding-top: 2.5rem;
    }

    .block-bottom {
        padding-bottom: 2.5rem;
    }

    .icon-md-2x {
        width: 2rem;
        height: 2rem;
    }

    .icon-md-3x {
        width: 3rem;
        height: 3rem;
    }

    .icon-md-4x {
        width: 4rem;
        height: 5rem;
    }

    .icon-md-5x {
        width: 5rem;
        height: 5rem;
    }

    .box-step {
        margin-bottom: 0 !important;
    }
}

@media (min-width: 568px) and (max-width: 991px) {}

@media (min-width: 768px) and (max-width: 991px) {
    
}

@media (min-width: 992px) {
    .box {
        margin-bottom: 1rem;
    }
    .main-slider .slider-content {
        margin-top: -20%;
    }
    .main-slider .slider-media {
        text-align:right;
        justify-content: flex-end;
        align-items: flex-end;
    }
    .box-icontext {
        padding:1.5rem;
    }
    .widget {
        margin-bottom: 2rem;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {}

@media (min-width: 1200px) {

    .block {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .block-top {
        padding-top: 4rem;
    }

    .block-bottom {
        padding-bottom: 4rem;
    }
    .widget {
        margin-bottom: 2.5rem;
    }
}

@media (min-width: 1360px) {}

@media (min-width: 1600px) {
    
    .main-slider .slick-slide:after {
        background-size: auto 100%;
    } 
}

@media (min-width: 1200px) and (max-width: 1899px) {}

@media (min-width: 1900px) {
    .block {
        padding-top: 4.5rem;
        padding-bottom: 4.5rem;
    }

    .block-top {
        padding-top: 4.5rem;
    }

    .block-bottom {
        padding-bottom: 4.5rem;
    }

}

@media (min-width: 2100px) {}

@media (min-width: 2500px) {}

::selection {
    color: #ffffff;
    background-color: #2a2a2a;
}

::-moz-selection {
    color: #ffffff;
    background-color: #2a2a2a;
}

::-webkit-scrollbar-track {
    background-color: #f4f4f4;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-thumb {
    cursor: pointer;
    background: #026bb2;
    border-radius: 0;
}