/*
Theme Name: HK Theme Developer
Theme URI:  http://khanhbui.net
Author: Khanh Bui - bvkhanh88@gmail.com
Author URI: https://khanhbui.net
Description: This theme is an engaging WordPress theme that is designed to help boost social shares and get you more viral traffic from the web's top social media websites.
Version: 2.0 (Updated: 21/12/2019 12:00)
License: GNU General Public License v2.0
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hkt
Template: hkt-simple
*/

/*@font-face {*/
/*font-family: 'UTM';*/
/*src: url('assets/fonts/UTM-HelvetIns.ttf');*/
/*font-weight: 400;*/
/*font-style: normal;*/
/*}*/

html body {
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-shadow: none !important;
}
@media (min-width: 576px) {
    html body {font-size: 14px;line-height: 1.6;}
}
.hkt-gap-5 {margin-left: -2.5px;margin-right: -2.5px;}
.hkt-gap-5 > [class*="col-"], .hkt-gap-5 > [class*="kc_col"] {padding: 0 2.5px;}
.hkt-gap-10 {margin-left: -5px;margin-right: -5px;}
.hkt-gap-10 > [class*="col-"], .hkt-gap-10 > [class*="kc_col"] {padding: 0 5px;}
.hkt-gap-15 {margin-left: -7.5px;margin-right: -7.5px;}
.hkt-gap-15 > [class*="col-"], .hkt-gap-15 > [class*="kc_col"] {padding: 0 7.5px;}
.hkt-gap-20 {margin-left: -10px;margin-right: -10px;}
.hkt-gap-20 > [class*="col-"], .hkt-gap-20 > [class*="kc_col"] {padding: 0 10px;}
.hkt-gap-25 {margin-left: -12.5px;margin-right: -12.5px;}
.hkt-gap-25 > [class*="col-"], .hkt-gap-25 > [class*="kc_col"] {padding: 0 12.5px;}
.hkt-gap-30 {margin-left: -15px;margin-right: -15px;}
.hkt-gap-30 > [class*="col-"], .hkt-gap-30 > [class*="kc_col"] {padding: 0 15px;}

/* COLOR && SOMETHING */
#wrapper {background: #fff;}
#wrapper.boxed {max-width: none;}
.boxed #main-content {padding: 0 10px;background-color: #fff;}
.boxed #site-footer {padding: 20px;background-color: #fff;box-shadow: none;}
.boxed footer#site-footer .copyrights {background-color: #fff;border: none;}

#hkt-navigation, .sidebar .widget > h3, footer#site-footer .copyrights, .cat-box-title h2 span, .widget .tagcloud a.tag-cloud-link {background-color: #29487d;color: #fff;}
#mobile-nav-toggle {color: #29487d;right: 12px;left: auto;top: 11px;}
.cat-box-title h2 {border-color: #29487d;}
h1.category {border-color: #dfdfdf;border-width: 1px;}
.widget h2, .widget h3, .widget h4, .widget h5, .widget h6 {font-family: 'Roboto', sans-serif;}
.hkt-pagination a:hover, .hkt-pagination span.current {background-color: #333!important;color: #fff!important;border-color: #333;}

.entry-content a {color: #333;}
#topcontrol {background: #29487d;}

/* Fix KingConposer */
@media (min-width: 992px) {
    .hkt .kc-row-container.kc-container .kc-wrap-columns, .hkt .kc_row.kc_row_inner {margin-left: -10px;margin-right: -10px;}
    .hkt .kc_column, .hkt .kc_column_inner {padding-left: 10px;padding-right: 10px;}
    .hkt .kc-row-container.kc-container .kc-wrap-columns, .hkt .kc_row.kc_row_inner {width: calc(100% + 20px);}
}
@media (max-width: 992px) {
    .kc_single_image img {width: 100%;}
}
@media (max-width: 767px) {
    .kc_column {margin-bottom: 15px;}
}

section.kc_row {padding: 25px 10px;}
.kc_row.gray {background-color: #f2f2f2;}
.kc_row.yellow {background-color: #FFF8C2;}
.kc_row .kc-container {padding: 0;}
.kc_row .kc_text_block.center, .kc_row .kc_text_block.center p {text-align: center;}
.kc_row .kc_text_block {margin-bottom: 30px;}
.kc_row h3 {font-size: 35px;margin: 0 0 15px;}
.kc_row h3 strong, .kc_row h3 b {color: #5bd2ec;}
.entry-content .kc-image-gallery img {border: none;}
.kc_single_image p {line-height: 1.4;}
@media (min-width: 768px) {
    .kc_row .kc_text_block p {font-size: 15px;}
}
.hkt-row-stretch.kc_row:not(.kc_row_inner) {float: none;width: auto;}


/*-- GENERAL --*/
.home .main-container #page, .page-id-120 .main-container #page, .page-id-121 .main-container #page {padding-left: 0;padding-right: 0;}
@media (min-width: 992px) {
    .boxed #site-header {background-color: transparent;box-shadow: none;}
}
@media (min-width: 1200px) {
    .wide .main-container {width: 100%;max-width: none;}
    .boxed .inner-wrapper, .hkt-container, .hkt-content .container {width: 1200px;margin: 0 auto;max-width: 100%;}
    #site-header .container, #hkt-navigation .navigation {width: 1200px;margin: 0 auto;float: none;max-width: 100%;}
    .row-header.d-flex #hkt-navigation .navigation {width: auto;}

    #hkt-navigation.sticky-navigation-active {}
}
.sidebar.col-sidebar {float: none;width: 100%;padding: 0;}
h1.title + .post-listing {margin-top: 20px;}
@media (max-width: 991px) {
    [data-breadcrumb="show"] #page {padding-top: 0;}
}

input {
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    -ms-transition: all .3s ease;
    transition: all .3s ease;
}
.wpcf7-form .wpcf7-form-control-wrap {position: static}
.wpcf7-form .wpcf7-not-valid-tip {font-size: 13px !important;font-weight: 400;margin-top: 10px}
.wpcf7-form .wpcf7-not-valid {content: '';background: rgba(255, 255, 255, .1) url(assets/images/btn-close-error.png) no-repeat 98%;border: 1px solid #f00;}
.wpcf7-form .wpcf7-not-valid-tip {display: none !important}
.wpcf7-form .wpcf7-validation-errors {max-width: 600px;border: 1px solid #f00;}
input.wpcf7-submit {background-color: #37445f;border: 1px solid #37445f;}

pre {
    display: block;
    padding: 9.5px;
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.42857143;
    color: #333;
    word-break: break-all;
    word-wrap: break-word;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    border-radius: 4px;
}
pre code,
pre .line-number {
    /* Ukuran line-height antara teks di dalam tag <code> dan <span class="line-number"> harus sama! */
    font: normal normal 14px/1.6 Monaco, "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
    color: #555;
    display: block;
}
pre .line-number {float: left;margin: 1.5px 1em 0 -1em;border-right: 1px solid;text-align: right;}
pre .line-number span {display: block;padding: 0 .5em 0 1em;}
pre .cl {display: block;clear: both;}


/**
* HEADER
* ----------------------------------------------------------------------------
*/
#wrapper {max-width: 1130px;}
@media (min-width: 992px) {
    #header {display: none;}
}
#hkt-navigation {background-color: #111;}
.navigation ul#mainmenu, .navigation ul.menu {float: right;}

.flags {position: absolute;top: 9px;left: 6px;}
.flags img {max-height: 30px;padding: 0 5px;}
@media (max-width: 991px) {
    .flags {top: 9px;left: auto;right: 45px;}
}

@media (max-width: 991px) {
    .navigation ul#mainmenu {float: none;}
    #hkt-navigation .nav-footer {display: none!important;}
}

.navigation ul.menu {display: none!important;}
.home .navigation ul#mainmenu, .page-id-120 .navigation ul#mainmenu-jp, .page-id-121 .navigation ul#mainmenu-en  {display: block!important;}



/**
* MAIN & SIDEBAR
* ----------------------------------------------------------------------------
*/
/* Contact Form 7 */
form.wpcf7-form h3 {border-bottom: 2px solid #29487d;font-size: 22px;font-weight: bold;}
.wpcf7-form p {}
form.wpcf7-form label {max-width: 100%;margin-bottom: 0;}
.wpcf7-form input, .wpcf7-form textarea, .wpcf7-form select {color: #666666;background: transparent;border-radius: 3px;border: 1px solid #D8D8D8;}
.wpcf7-form input:not([type="submit"]):not([type="radio"]):not([type="checkbox"]), .wpcf7-form select, .wpcf7-form textarea {max-width: 100%;padding: 8px;}
@media (min-width: 1200px) {
    .wpcf7-form input:not([type="submit"]):not([type="radio"]):not([type="checkbox"]), .wpcf7-form select, .wpcf7-form textarea {width: 600px;}
}
.wpcf7-form textarea {height: 150px;}
input.wpcf7-submit {cursor: pointer;padding: 5px 25px!important;color: #fff;background-color: #29487d;border: 1px solid #29487d;}
form.wpcf7-form input.wpcf7-submit:hover {cursor: pointer;color: #333;background-color: #fff;}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output {width: 600px;max-width: 100%;margin: 10px 0;}
footer .wpcf7-form .wpcf7-response-output {margin: 0;}
footer .wpcf7-form input {color: #ffffff;width: 100%;max-width: 330px;}

.wpcf7 {position: relative;width: 600px;max-width: 100%;}
.wpcf7-form .ajax-loader, .wpcf7 .wpcf7-spinner {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-12px, -12px);
}

.wpcf7-form .wpcf7-form-control-wrap {position: static}
.wpcf7-form .wpcf7-not-valid-tip {font-size: 13px !important;font-weight: 400;margin-top: 10px}
.wpcf7-form .wpcf7-not-valid {content: '';background: rgba(255, 255, 255, .1) url(assets/images/btn-close-error.png) no-repeat 98%;border: 1px solid #f00;}
.wpcf7-form .wpcf7-not-valid-tip {display: none !important}
.wpcf7-form .wpcf7-validation-errors {max-width: 600px;border: 1px solid #f00;}


.page #page {padding-top: 0;padding-bottom: 0;}
.home .clear {height: 0;}
body.home, .home #wrapper {background-color: #f1f2f2;}
section.kc_row {margin-bottom: 10px;}
section.kc_row .kc_title {text-align: center;margin-bottom: 25px;}

/* HOME PAGE STYLE */
#banner {padding: 0;}
#banner .kc_row_inner {
    max-width: 300px;
    position: absolute;
    top: 40px;
    right: 30px;
    background-color: #168dd2;
    color: #fff;
}
#banner .kc_row_inner .kc-contact-form7 {margin-top: 65px;padding: 15px;}
#banner .wpcf7-form input {background-color: #fff;outline: none;}
#banner .wpcf7-form input:not([type="radio"]) {width: 100%;}
#banner .wpcf7-form input.wpcf7-submit {
    background-color: #1eaa90;
    border: none;
    text-transform: uppercase;
    width: 100%;
    padding: 8px!important;
}
#banner .wpcf7-form p {margin-bottom: 15px;text-align: center;}
#banner .kc-countdown-timer {
    display: flex;
    justify-content: center;
    position: absolute;
    top: 20px;
    left: 22px;
}
#banner .kc-countdown-timer .group {padding: 5px 10px;background-color: #222;margin: 0;}
#banner .kc-countdown-timer .group > span {display: block;line-height: 1;text-transform: capitalize;}
#banner .wpcf7-response-output {text-align: center;}
#banner div.wpcf7 .ajax-loader {position: absolute;margin-top: 10px;}
#banner .wpcf7-form p.tuvan {
	text-transform: uppercase;
	background-color: #fa9d00;
	padding: 10px;
    border-radius: 5px;
    text-align: center;
}
#banner .wpcf7-form p.tuvan a {color: #fff;}
#banner .frm-input {padding: 15px 10px 5px;margin-bottom: 10px;background: rgba(0,0,0,0.3);}

.kc_single_image.on-mb {display: none!important;}
@media (max-width: 991px) {
    .kc_single_image.on-pc {display: none!important;}
    .kc_single_image.on-mb {display: block!important;}
}

#btn-dangkyform {background-color: #ffea9e;}
#btn-dangkyform .kc-elm {text-align: center;}
#btn-dangkyform .kc-elm a {color: #fff;text-transform: uppercase;}
@media (max-width: 767px) {
	#btn-dangkyform .kc_button {min-width: 230px;max-width: 100%;margin-bottom: 15px;}
}

#dem {background-color: #524630;color: #fff;}
#dem .kc_text_block {margin-bottom: 0;text-align: center;}
#dem .kc_text_block p {text-align: center;margin-bottom: 0;}
#dem .kc_text_block p:first-child {font-size: 2.8rem;text-transform: uppercase;letter-spacing: 1px;line-height: 1;}
#dem .kc_text_block p:first-child b {font-size: 90%;letter-spacing: 2px;}
#dem .kc_text_block p:nth-child(2) b {color: #ffdc3a;}

section.kc_row h2 {color: #000;text-transform: uppercase;font-weight: 600;font-size: 1.8rem;margin-top: 0;}
section.kc_row ul {list-style: none;overflow: hidden;margin: 0;}
section.kc_row .kc_text_block {margin-bottom: 0;}

section.bg-img .kc_text_block h2 {text-align: center;margin-bottom: 30px;}
@media (max-width: 991px) {
    section.bg-img .kc_text_block h2 {text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;font-size: 15px;}
}
section.bg-img ul li {font-size: 18px;}
section.bg-img ul li b, section.bg-img ul li strong {font-weight: 600;}
section.bg-img .kc_text_block p > a {display: table;margin: 0 auto;padding: 5px 30px;border-radius: 20px;background-color: #fa9d00;color: #fff;font-size: 20px;font-weight: 600;text-transform: uppercase;}

#section-3 {background: url(assets/images/bg-section-3.jpg);background-position: right top;background-size: cover;}
#section-3 .kc_text_block {max-width: 695px;margin-left: 9%;}
#section-3 ul li {width: 50%;float: left;margin-bottom: 23px;padding: 15px 20px;line-height: 1.4;}
#section-3 ul li b {color: #cd0a0a;}
#section-3 .kc_text_block p > a {background-color: #fa9d00}

#section-4 {background: url("/wp-content/uploads/2021/10/bg-sec-04.jpg");background-size: cover;}
#section-4 .kc_text_block {max-width: 700px;float: right;}
#section-4 .kc_text_block h2 {margin-bottom: 0;}
#section-4 ul {margin-left: 2rem;}
#section-4 ul li {margin-bottom: 0;padding: 14px;line-height: 1.4;}
#section-4 ul li b, #section-4 ul li strong {color: #cd0a0a;}

#section-5 {background: #524630 url(assets/images/bg-section-5.jpg);color: #fff;}
#section-5 .kc_text_block h2 {color: #fff;}
#section-5 ul {margin-bottom: 20px!important;}
@media (min-width: 992px) {
    #section-5 ul {max-width: 1000px;margin: 0 auto;display: flex;justify-content: space-between;column-gap: 30px;}
    #section-5 ul li {text-align: center;}
}
#section-5 ul li {font-size: 1.05rem;list-style: none;}
#section-5 ul li strong {font-size: 1.25rem;text-transform: uppercase;}
#section-5 .kc_text_block p > a {background-color: #c81f17;border: 1px solid #efefef;}

#section-6 {padding: 0 10px;}
#section-6 .kc_title {text-align: center;display: none;margin-bottom: 10px;}
#section-6 .ca-nhan {
    background: #ffea9e;
    margin: 0;
    background-image: url(https://www.k-sei.com/core/hktheme/assets/images/canhan.png);
    background-size: 37% 53%;
    background-position: -10px bottom;
    background-repeat: no-repeat;
    padding: 50px;
    z-index: 1;
}
#section-6 .to-chuc {
    background: #ffab0f;
    margin: 0;
    padding: 50px;
    background-image: url(https://www.k-sei.com/core/hktheme/assets/images/tochuc.png);
    background-size: 37% 53%;
    background-position: 100% bottom;
    background-repeat: no-repeat;
}
#section-6 .image {
    position: absolute;
    top: 15px;
    left: 50%;
    z-index: 3;
    transform: translateX(-50%);
    text-align: center;
}
#section-6 .image img {max-width: 140px;}
#section-6 .ca-nhan, #section-6 .to-chuc {display: flex;justify-content: center;}
#section-6 h3.heading-title {font-size: 1.8rem;text-align: center;text-transform: uppercase;margin-bottom: 30px;font-weight: 600;}
#section-6 h4 {font-size: 1.2rem;text-align: center;text-transform: uppercase;font-weight: 600;margin-bottom: 15px;}
#section-6 .text-field p {text-shadow: 0 3px 3px rgba(0,0,0,0.25);margin-bottom: 1rem;font-weight: 600;}
.ca-nhan .text-field p {color: #ff0000;}
.to-chuc .text-field p {color: #fff;text-align: center;}
#section-6 .view-more {
    position: absolute;
    bottom: 30px;
    left: 50%;
    z-index: 3;
    transform: translateX(-50%);
    display: block;
    padding: 3px 10px;
    color: #fff;
    border-radius: 5px;
    background: #f00;
    box-shadow: 0px 3px 3px rgba(0,0,0,0.25);
    border: 1px solid #f00;
    transition: 0.3s;
    display: none;
}
#section-6 .view-more:hover {color: #f00;background: #fff;}
@media (max-width: 991px) {
    #section-6 .kc_title {display: block;}
}
@media (max-width: 767px) {
    #section-6 .view-more {bottom: auto;top: 55%;}
}
@media (max-width: 575px) {
    #section-6 .view-more {bottom: auto;top: 60%;}
}


#section-7 {background-color: #fff2af; color: #333;padding: 80px 10px 40px;}
#section-7 .learning-process {
    max-width: 1030px;
    margin: 0 auto;
    border: 2px dashed #000;
    border-radius: 20px;
}
@media (min-width: 992px) {
    .lp-wrap>div {margin-top: -50px;}
}
.lp-wrap .number {
    display: block;
    margin: 0 auto;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 25px solid #f59b29;
    font-size: 30px;
    line-height: 50px;
    text-align: center;
    font-weight: bold;
    background: #fff2af;
    transition: 0.3s;
    cursor: pointer;
}
.lp-wrap .number:hover {transform: translateY(-20px);}
.lp-wrap .text {
    padding-top: 10px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.4;
}
.learning-process a.view-detail {
    display: table;
    background: #f59b29;
    padding: 10px 30px;
    border-radius: 10px;
    font-size: 16px;
    font-weight: bold;
    position: relative;
    margin: 0 auto;
    transform: translateY(50%);
    visibility: hidden;
}

#lop_hoc {background-color: #f59b29;}
#lop_hoc .kc_single_image {text-align: center;}
@media (min-width: 992px) {
    #lop_hoc .kc_single_image {margin: 0 auto;float: none;}
}
#lop_hoc .kc-raw-code {display: flex;justify-content: center;}
.view-video-btn {display: flex;grid-gap: 20px;margin-top: 30px;}
.view-video-btn a {padding: 10px 15px;background-color: #1eaa90;color: #fff;font-size: 1.2rem;}

@media (max-width: 991px) {
    #site-header #logo {text-align: left;padding-left: 20px;letter-spacing: 10px;visibility: hidden;font-size: 0;height: 40px;}
    .header-logo {background-color: #222;}
    .header-logo a {color: #fff;}
    #mobile-nav-toggle {color: #feaf3e;font-size: 37px;top: 6px;}

    section.kc_row h2 {font-size: 1.2rem;color: #333!important;}
    #banner .kc_row_inner {position: unset;max-width: unset;}
    #banner .kc-countdown-timer {left: 45px;}
    #dem .kc_text_block p:first-child {font-size: 2rem;}
    #section-3 .kc_text_block {margin-left: 0;}
    #section-3 ul li {width: 100%;padding: 10px;margin-bottom: 0;}
    section.bg-img .kc_text_block p > a {font-size: 1.05rem;}
    #section-4 ul {margin-left: 1rem;}
    #section-4 ul li {padding: 10px 0;}
    #section-5 ul li {padding: 10px;}
    #section-6 .to-chuc, #section-6 .ca-nhan {padding: 0 30px;}
    #section-7 {padding: 15px;}
    #section-7 .learning-process {padding-top: 20px;}
}



/**
* FOOTER
* ----------------------------------------------------------------------------
*/
@media (min-width: 1200px) {
    footer#site-footer .copyrights {padding: 5px 0;}
}
.social .list-inline-item a {
    display: block;
    width: 30px;
    height: 30px;
    line-height: 30px!important;
    text-align: center;
    border-radius: 50%;
    color: #fff!important;
    background-color: #3a589b;
    margin-left: 3px!important;
    font-size: 14px!important;
    font-weight: 400!important;
    box-shadow: 0 0 5px #333;
}
.social .list-inline-item.twitter a {background-color: #55acee;}
.social .list-inline-item.google-plus a {background-color: #cf3427;}
.social .list-inline-item a:hover {transform: scale(1.2) translate(0);}

footer#site-footer .copyrights {display: none;padding: 10px;}

footer#site-footer {
    background-color: #fff;
    -webkit-box-shadow: 0 4px 15px 0 rgba(185,185,185,1);
     -moz-box-shadow: 0 4px 15px 0 rgba(185,185,185,1);
     box-shadow: 0 4px 15px 0 rgba(185,185,185,1);

    min-width: 300px;
    margin-top: 10px;
    margin-bottom: 20px;
}
footer#site-footer .inner {padding: 25px 15px 0;}
footer#site-footer > .inner .row > [class*="col-"]:last-child {display: flex;flex-direction: column;justify-content: space-between;}
#site-footer .widget > h3 {color: #050505;font-size: 1rem;text-transform: none;font-weight: 600;margin-bottom: 0;padding-bottom: 3px;}
#site-footer .widget_text {margin-bottom: 20px;}
footer#site-footer .footer-bot p {text-align: right;font-size: 80%;color: #949391;}

footer#site-footer .f-social a {font-size: 1.8rem;padding: 5px 10px;}
footer#site-footer .f-social a.fa-facebook {color: blue;}
footer#site-footer .f-social a.fa-youtube {color: red;}

.box-contactus {
    display: flex;
    flex-direction: column;
    position: fixed;
    left: 30px;
    bottom: 30px;
    z-index: 999;
}
.box-contactus img {max-width: 40px;}
.box-contactus span {
	color: #567AFF;
	display: inline-block;
	-webkit-animation: alo-circle-img-anim 1s infinite ease-in-out;
    -moz-animation: alo-circle-img-anim 1s infinite ease-in-out;
    -ms-animation: alo-circle-img-anim 1s infinite ease-in-out;
    -o-animation: alo-circle-img-anim 1s infinite ease-in-out;
    animation: alo-circle-img-anim 1s infinite ease-in-out;
}
.box-contactus svg {width: 60px;height: 60px;}


/**
* MOBILE
* ----------------------------------------------------------------------------
*/
@media (max-width: 767px) {
    .kc-elm {margin-bottom: 0;}
    #slider .kc_col-sm-3 .kc-col-container > *:not(.hkt-menu-category) {display: none;}
    #slider .hkt-menu-category {margin-bottom: 0;}
    .category-list ul.sub-menu li a:before {content: "";}
    .category-list ul.sub-menu li {padding-left: 20px!important;}
}

@media (max-width: 991px) {
    .navigation.mobile-menu-wrapper {width: 200px;}
    .mobile-menu-active .main-container {left: 200px;}
}



/*-- CSS BLOCK --*/
