@media (min-width: 1300px) { .container { max-width: 1264px; } }
body { font-family: 'Roboto', sans-serif; font-size: 16px; line-height: 27px; color: #797e83; overflow-x: hidden; }

p { font-size: 16px; line-height: 27px; color: #797e83; }
@media (max-width: 767px) { p { font-size: 15px; line-height: 22px; } }
@media (max-width: 575px) { p { font-size: 14px; line-height: 20px; } }

h1 { font-size: 42px; line-height: 1.3em; font-weight: bold; font-family: 'Poppins', sans-serif; color: #444444; margin-bottom: 36px; }
h1 span { color: #207fc3; }
@media (max-width: 1199px) { h1 { font-size: 36px; } }
@media (max-width: 575px) { h1 { font-size: 21px; } }

h2 { font-size: 42px; line-height: 1.3em; font-weight: bold; font-family: 'Poppins', sans-serif; color: #444444; margin-bottom: 50px; }
@media (max-width: 1199px) { h2 { font-size: 36px; margin-bottom: 30px; } }
@media (max-width: 767px) { h2 { font-size: 26px; margin-bottom: 30px; } }
@media (max-width: 575px) { h2 { font-size: 21px; margin-bottom: 20px; } }
h2 span { color: #207fc3; }

h3 { font-size: 26px; line-height: 1.2em; font-weight: bold; font-family: 'Poppins', sans-serif; color: #444444; margin-bottom: 25px; }
@media (max-width: 575px) { h3 { font-size: 22px; margin-bottom: 20px; } }

.color { color: #1e76bd; }

.decor { background-color: #1e76bd; width: 53px; height: 3px; margin: -9px auto 39px; }
@media (max-width: 575px) { .decor { margin: -5px auto 20px; } }

.btn, .btn:focus, .btn:active { display: inline-flex; position: relative; overflow: hidden; cursor: pointer; text-shadow: none; font-size: 16px; line-height: 20px; font-family: 'Poppins', sans-serif; font-weight: 500; letter-spacing: .5px; padding: 20px 36px; color: #fff; border: 0; border-radius: 30px; text-transform: uppercase; background: #444444; outline: none !important; box-shadow: none; -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; transition: 0.3s; }
@media (max-width: 1199px) { .btn, .btn:focus, .btn:active { font-size: 14px; line-height: 18px; padding: 15px 25px; border-radius: 25px; } }
@media (max-width: 767px) { .btn, .btn:focus, .btn:active { font-size: 11px; line-height: 20px; padding: 10px 15px; border-radius: 20px; } }
.btn [class*='icon'], .btn:focus [class*='icon'], .btn:active [class*='icon'] { position: relative; top: 5px; font-size: .8em; -moz-transition: 0.3s; -o-transition: 0.3s; -webkit-transition: 0.3s; transition: 0.3s; }
@media (max-width: 767px) { .btn [class*='icon'], .btn:focus [class*='icon'], .btn:active [class*='icon'] { top: 3px; font-size: 1.1em; } }
.btn [class*='icon']:first-child, .btn:focus [class*='icon']:first-child, .btn:active [class*='icon']:first-child { transform: translateX(-55px); opacity: 0; width: 0; }
.btn [class*='icon']:last-child, .btn:focus [class*='icon']:last-child, .btn:active [class*='icon']:last-child { padding-left: 10px; }
@media (max-width: 1199px) { .btn [class*='icon']:last-child, .btn:focus [class*='icon']:last-child, .btn:active [class*='icon']:last-child { padding-left: .6em; } }
.btn.icn-left [class*='icon']:first-child, .btn:focus.icn-left [class*='icon']:first-child, .btn:active.icn-left [class*='icon']:first-child { width: auto; padding-right: 10px; transform: translateX(0); opacity: 1; }
@media (max-width: 1199px) { .btn.icn-left [class*='icon']:first-child, .btn:focus.icn-left [class*='icon']:first-child, .btn:active.icn-left [class*='icon']:first-child { padding-right: .6em; } }
.btn.icn-left [class*='icon']:last-child, .btn:focus.icn-left [class*='icon']:last-child, .btn:active.icn-left [class*='icon']:last-child { width: 0; padding-left: 0; transform: translateX(55px); opacity: 0; }
.btn:hover, .btn:focus:hover, .btn:active:hover { color: #fff; }
.btn:hover [class*='icon']:first-child, .btn:focus:hover [class*='icon']:first-child, .btn:active:hover [class*='icon']:first-child { width: auto; padding-right: 10px; transform: translateX(0); opacity: 1; }
@media (max-width: 1199px) { .btn:hover [class*='icon']:first-child, .btn:focus:hover [class*='icon']:first-child, .btn:active:hover [class*='icon']:first-child { padding-right: .6em; } }
.btn:hover [class*='icon']:last-child, .btn:focus:hover [class*='icon']:last-child, .btn:active:hover [class*='icon']:last-child { width: 0; padding-left: 0; transform: translateX(55px); opacity: 0; }
.btn:hover.icn-left [class*='icon']:first-child, .btn:focus:hover.icn-left [class*='icon']:first-child, .btn:active:hover.icn-left [class*='icon']:first-child { width: 0; padding-right: 0; transform: translateX(-55px); opacity: 0; }
.btn:hover.icn-left [class*='icon']:last-child, .btn:focus:hover.icn-left [class*='icon']:last-child, .btn:active:hover.icn-left [class*='icon']:last-child { width: auto; padding-left: 10px; transform: translateX(0); opacity: 1; }
@media (max-width: 1199px) { .btn:hover.icn-left [class*='icon']:last-child, .btn:focus:hover.icn-left [class*='icon']:last-child, .btn:active:hover.icn-left [class*='icon']:last-child { padding-left: .6em; } }

.btn-fill, .btn-fill:focus, .btn-fill:active { background: #1f7ec2; background: -moz-linear-gradient(left, #1f7ec2 0%, #24a3dd 100%); background: -webkit-gradient(left top, right top, color-stop(0%, #1f7ec2), color-stop(100%, #24a3dd)); background: -webkit-linear-gradient(left, #1f7ec2 0%, #24a3dd 100%); background: -o-linear-gradient(left, #1f7ec2 0%, #24a3dd 100%); background: -ms-linear-gradient(left, #1f7ec2 0%, #24a3dd 100%); background: linear-gradient(to right, #1f7ec2 0%, #24a3dd 100%); -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); }
.btn-fill:hover, .btn-fill:focus:hover, .btn-fill:active:hover { -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); box-shadow: 0 0 20px rgba(0, 0, 0, 0.15); color: #fff; }
.btn-fill:hover [class*='icon'], .btn-fill:focus:hover [class*='icon'], .btn-fill:active:hover [class*='icon'] { color: #fff; }

.btn + .btn { margin-left: 30px; }
@media (max-width: 767px) { .btn + .btn { margin-left: 15px; } }
@media (max-width: 575px) { .btn + .btn { margin-left: 5px; } }

.section { overflow: hidden; }

.max-625 { max-width: 625px; margin-left: auto; margin-right: auto; }

.intro-text { margin-bottom: 50px; max-width: 980px; margin-left: auto; margin-right: auto; }
@media (max-width: 420px) { .intro-text { margin-bottom: 30px; } }

.list-skins {
    margin-top: 110px;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
}

@media (max-width: 1199px) {
    .list-skins {
        margin-top: 80px;
        flex-wrap: wrap;
    }
}

@media (max-width: 991px) {
    .list-skins {
        margin-top: 40px;
    }
}

@media (max-width: 767px) {
    .list-skins {
        margin-top: 30px;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .list-skins .skin-item {
        width: 100%;
    }
}

.list-skins .skin-item {
    position: relative;
    flex: 1;
    margin: 0 15px 15px;
    min-width: calc(14.28% - 30px);
}

@media (max-width: 1199px) {
    .list-skins .skin-item {
        min-width: calc(33.333% - 30px);
    }

    .list-skins .skin-item:nth-child(3) ~ .skin-item {
        margin-top: 30px;
    }
}

@media (max-width: 767px) {
    .list-skins .skin-item {
        min-width: calc(50% - 30px);
    }

    .list-skins .skin-item:nth-child(2) ~ .skin-item {
        margin-top: 30px;
    }
}

.list-skins .skin-item > a {
    display: block;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
}

.list-skins .screen-img {
    height: 374px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 767px) {
    .list-skins .screen-img {
        height: 280px;
    }
}

@media (max-width: 575px) {
    .list-skins .screen-img {
        height: 220px;
    }
}

.screen--last { pointer-events: none; }

.screen-img img { width: 100%; position: absolute; left: 0; top: 0; z-index: 0; transform: translateY(0); transition: all 2s ease-out .1s; }

.section-02 { padding-top: 140px; padding-bottom: 150px; }
@media (max-width: 767px) { .section-02 { padding-top: 70px; padding-bottom: 70px; } }

.section-03 { overflow: visible; position: relative; padding-top: 90px; min-height: 100vh; }
.section-03 .container-fluid { display: flex; flex-direction: column; }
@media (max-width: 575px) { .section-03 { padding-top: 140px; } }

.section-08 { padding-top: 160px; padding-bottom: 160px; background-image: url(../images/medin-bg-02.jpg); background-size: cover; background-position: center center; }
@media (max-width: 767px) { .section-08 { padding-top: 80px; padding-bottom: 80px; } }

.section-04 { padding-top: 140px; padding-bottom: 150px; }
@media (max-width: 767px) { .section-04 { padding-top: 70px; padding-bottom: 70px; } }
@media (min-width: 576px) { .section-04 h2 { font-size: 38px; margin-bottom: 44px; } }
@media (max-width: 575px) { .section-04 h2 { font-size: 28px; } }

.section-05 { padding-top: 240px; padding-bottom: 240px; color: #fff; background-image: url(../images/bg-video.jpg); background-size: cover; background-position: center center; }
@media (max-width: 1600px) { .section-05 { padding-top: 180px; padding-bottom: 180px; } }
@media (max-width: 1199px) { .section-05 { padding-top: 140px; padding-bottom: 140px; } }
@media (max-width: 767px) { .section-05 { padding-top: 70px; padding-bottom: 70px; } }
.section-05 h3 { margin-bottom: 10px; }
.section-05 h3, .section-05 p { color: #fff; }

.section-06 { padding-top: 140px; padding-bottom: 150px; }
@media (max-width: 767px) { .section-06 { padding-top: 70px; padding-bottom: 70px; } }
@media (min-width: 576px) { .section-06 h3 { font-size: 38px; margin-bottom: 44px; } }
@media (max-width: 575px) { .section-06 h3 { font-size: 28px; } }

.features { margin-top: -65px; }

.feature { margin-top: 65px; }
.feature img { margin-bottom: 22px; }
.feature h5 { margin-bottom: 13px; font-size: 19px; line-height: 1.2em; font-weight: bold; font-family: 'Poppins', sans-serif; color: #444; }
@media (max-width: 767px) { .feature h5 { font-size: 16px; } }
.feature p { margin: 0; font-size: 15px; line-height: 22px; }

.feature-box { display: flex; align-items: center; margin-bottom: 20px; }

.feature-icon { display: flex; align-items: center; justify-content: center; min-width: 129px; height: 129px; margin-right: 40px; background-color: #fff; box-shadow: 5px 0 22px rgba(0, 0, 0, 0.07); }
.feature-icon img { max-width: 80%; }
@media (max-width: 575px) { .feature-icon { min-width: 90px; height: 90px; margin-right: 20px; } }

.feature-icon-text { font-size: 16px; line-height: 27px; font-family: 'Roboto', sans-serif; color: #797e83; }
.feature-icon-text h5 { font-size: 19px; color: #444; font-family: 'Poppins', sans-serif; font-weight: 700; }
@media (max-width: 575px) { .feature-icon-text h5 { font-size: 16px; } }
.feature-icon-text p { margin-bottom: 0; }

.section-07 { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; text-align: center; height: 520px; background-image: url(../images/medin-bg-03.jpg); background-size: cover; background-position: center bottom; }
.section-07 .section-content { margin: 0 auto 60px; max-width: 910px; }
@media (max-width: 767px) { .section-07 .section-content { margin-bottom: 20px; } }
@media (max-width: 767px) { .section-07 { max-height: 300px; } }
@media (max-width: 750px) { .section-07 h1 { font-size: 28px; } }

@media (min-width: 768px) { .video-wrap { margin-left: 40px; } }
.video-wrap a { display: inline-block; background-color: #02102a; }
.video-wrap a img { display: block; -moz-transition: 0.5s; -o-transition: 0.5s; -webkit-transition: 0.5s; transition: 0.5s; }
.video-wrap a:hover img { opacity: .85; }

.screen-new { z-index: 100; }

.label-new { position: absolute; top: -7%; right: 0; color: #fff; text-decoration: none !important; width: 84px; height: 84px; }
@media (max-width: 1199px) { .label-new { top: 50px; width: 64px; height: 64px; } }
.label-new:after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; animation: pulse 3s ease-in-out infinite; border-radius: 50%; background-color: #ff1a3a; box-shadow: 0 9px 20px rgba(255, 26, 58, 0.6); }
.label-new span.text { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-direction: column; height: 100%; width: 100%; align-items: center; justify-content: center; position: relative; z-index: 1; font-size: 16px; line-height: 1.2em; font-weight: 400; font-family: "Poppins"; }
.label-new span.text span:last-child { font-size: 18px; font-weight: 600; }

@keyframes pulse { 0% { transform: scale(1); }
  50% { transform: scale(1.35); }
  100% { transform: scale(1); } }
header { display: flex; align-items: center; position: fixed; z-index: 100; top: 0; left: 0; width: 100%; padding: 23px 40px; background-color: rgba(255, 255, 255, 0.8); transition: padding .2s; }
header .logo { max-width: 205px; }
@media (max-width: 991px) { header .logo { max-width: 160px; } }
@media (max-width: 767px) { header .logo { max-width: 130px; } }
@media (max-width: 479px) { header .logo { max-width: 120px; } }
@media (max-width: 1199px) { header { padding: 23px 30px; } }
@media (max-width: 991px) { header { padding: 15px 15px; flex-wrap: wrap; } }

header.sticky { padding-top: 9px; padding-bottom: 9px; }

.header-left, .header-right { min-width: 300px; }
@media (max-width: 1199px) { .header-left, .header-right { min-width: 0; } }

.header-right { margin-left: auto; }

.header-menu { flex: 1; }
.header-menu .navbar { justify-content: center; }
@media (max-width: 575px) { .header-menu { min-width: 100%; order: 3; }
  .header-menu .navbar { justify-content: flex-start; margin-left: -15px; } }

.navbar-nav { display: flex; flex-direction: row; }

.navbar-nav .nav-item { padding: 0 35px; }
@media (max-width: 1600px) { .navbar-nav .nav-item { padding: 0 20px; } }
@media (max-width: 1199px) { .navbar-nav .nav-item { padding: 0 15px; } }
@media (max-width: 991px) { .navbar-nav .nav-item { padding: 0 7px; } }
@media (max-width: 767px) { .navbar-nav .nav-item { padding: 0 5px; } }
@media (max-width: 575px) { .navbar-nav .nav-item { padding: 0 12px; } }
.navbar-nav .nav-item a { position: relative; font-size: 16px; line-height: 25px; font-weight: bold; font-family: "Poppins"; color: #444; letter-spacing: .6px; }
@media (max-width: 991px) { .navbar-nav .nav-item a { font-size: 12px; line-height: 15px; font-weight: 700; letter-spacing: 0; } }

#slide-line { position: absolute; transition: all .3s ease; display: block; position: absolute; bottom: 4px; height: 4px; background: #1f7ec2; background: -moz-linear-gradient(left, #1f7ec2 0%, #24a3dd 100%); background: -webkit-gradient(left top, right top, color-stop(0%, #1f7ec2), color-stop(100%, #24a3dd)); background: -webkit-linear-gradient(left, #1f7ec2 0%, #24a3dd 100%); background: -o-linear-gradient(left, #1f7ec2 0%, #24a3dd 100%); background: -ms-linear-gradient(left, #1f7ec2 0%, #24a3dd 100%); background: linear-gradient(to right, #1f7ec2 0%, #24a3dd 100%); }
@media (max-width: 767px) { #slide-line { bottom: 2px; height: 2px; } }

.h1-lg { display: inline-block; font-size: calc(38px + 8.44vw); line-height: 1em; font-weight: bold; margin: 0 0 -.1em; color: #fafafa; white-space: nowrap; position: relative; left: 50%; transform: translateX(-50%); }
@media (max-width: 1800px) { .h1-lg { font-size: calc(38px + 8vw); } }
@media (max-width: 1600px) { .h1-lg { font-size: calc(30px + 7.5vw); } }
@media (max-width: 1199px) { .h1-lg { font-size: calc(28px + 6.5vw); } }
@media (max-width: 575px) { .h1-lg { display: none; } }

.h1-lg { background: linear-gradient(to right, #fafafa 20%, #f3fbff 40%, #f3fbff 60%, #fafafa 80%); background-size: 200% auto; background-clip: text; text-fill-color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: shine 5s linear infinite; }
@keyframes shine { to { background-position: 200% center; } }
.skin-title { margin-bottom: 21px; font-size: 19px; line-height: 24px; font-weight: bold; font-family: "Poppins"; color: #444; letter-spacing: .15px; }
@media (max-width: 767px) { .skin-title { font-size: 17px; margin-bottom: 15px; } }
@media (max-width: 575px) { .skin-title { font-size: 15px; margin-bottom: 10px; } }

.video-btn-circle { margin-top: 5px; padding: 0 0 0 .2em; display: flex; align-items: center; justify-content: center; width: 77px; height: 77px; background-color: #f49c00; border-radius: 50%; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3); font-size: 27px; color: #fff; transition: 0.2s; }

@media (max-width: 1023px) { .video-btn-circle { width: 64px; height: 64px; font-size: 22px; } }
.video-btn-circle:hover { box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3); background-color: #fff; color: #f49c00; text-decoration: none; }