@charset "utf-8";
/* Import Font */
@IMPORT url("font.css");
body,h1,h2,h3,h4,h5,h6,form,input,select,ul,p,textarea { margin: 0px; padding: 0; }
body{ color: #475057;}
img { border: none; -ms-interpolation-mode: bicubic; }
table { border-collapse: collapse; }
a { color: #0e1329; text-decoration: none; transition: color 0.15s ease-in-out 0s; }
a:hover { color: #000; text-decoration: none;}
ul { list-style: inside; }
ul li { list-style: none; }
ul li { margin: 0px; padding: 0px; }
.clr { clear: both; }
.box_title img{ max-width: 100%;}

.box_header{ border-top: 3px solid #2088c9; padding-bottom: 22px; background-color: #FFF; width: 100%; top: 0; left: 0; z-index: 99999; position: relative;}
.box_header .container{ position: relative;}
.box_header .logo{ display: inline-block; margin-top: 38px;}
.box_header .contact{ float: right; height: 34px; padding: 5px 0 0 48px; border-radius: 0 0 8px 8px;}
.box_header .contact .hotline{ float: left; color: #f85f2b; padding: 1px 30px 1px 0; margin-top: 2px; border-right: 1px solid #f85f2b; font-family: "GOTHICB";}
.box_header .contact .hotline i{ border: 1px solid #f85f2b; border-radius: 50%; text-align: center; width: 20px; height: 20px; line-height: 20px; margin-right: 2px;}
.box_header .contact .hotline span{ font-size: 15px;}
.box_header .contact .hotline a{ color: #f85f2b; }
.box_header .contact .socail{ float: left; padding-left: 28px; margin-top: 3px;}
.box_header .contact .socail a{ display: inline-block; margin: 0 2px;}
.box_header .contact .socail a img{ width: 25px; height: 25px; }
.box_header .contact .socail a i{border: 1px solid #b7b7b7; font-size: 10px; width: 20px; height: 20px; text-align: center; line-height: 20px; background-color: #FFF; border-radius: 50%;}
.box_header .contact .socail a.facebook i{ color: #4e588f;}
.box_header .contact .socail a.google i{ color: #cf4b3b;}
.box_header .contact .socail a.youtube i{ color: #d73c31;}
.box_header .contact:after{ content: ""; clear: both;}
.box_header .menu{ margin: 15px 0 0; padding: 0; list-style: none; float: right;}
.box_header .menu li{ display: inline-block; padding-left: 35px;}
.box_header .menu li a{ font-size: 15px; color: #2c3339; font-family: "HelveticaNeue-Medium";}
.box_header .menu li a:hover{ color: #0f9e1d;}
.box_header .menu li a.my_btn{ display: inline-block; background-color: #0f9e1d; color: #FFF; font-size: 13px; border-radius: 50px; padding: 5px 15px 5px; font-weight: normal;}
.box_header .menu li a.my_btn:hover{ background-color: #ed1c24;}
.box_header .menu_mobile{ position: absolute; top: 10px; right: 10px; width: 30px;}
.box_header .menu_mobile .item{ display: block; height: 2px; background-color: #CCC; margin-bottom: 4px;}

.box_header.sticky{ position: fixed; top: 0px; z-index: 999; border-bottom: 1px solid #EEE; -webkit-animation: mySticky 1s; -moz-animation: mySticky 1s; animation: mySticky 1s; animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out; -moz-animation-timing-function: ease-in-out; padding: 0 0; backface-visibility: hidden; -moz-backface-visibility: hidden; -webkit-backface-visibility: hidden; transform: translateY(0); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transition: transform 2s ease-in-out; -webkit-transition: -webkit-transform 2s ease-in-out; -moz-transition: transform 2s ease-in-out; }
.box_header.sticky .menu li a.last{ padding-right: 20px;}
.box_header.sticky .box_user{ display: block; padding: 10px 0 0;}
.box_header.sticky .box_user li a{ display: inline-block; padding: 5px 20px; color: #404041; font-size: 13px; font-weight: 600; height: auto; line-height: normal;}
.box_header.sticky .box_user li a:hover{ color: #0088cc;}
.box_header.sticky .box_user_login{ display: block;}
.box_header.sticky .box_user_login .dropdown-toggle{ background: none !important; height: 50px; line-height: 50px; margin: 0 0 0 20px;}
.box_header.sticky .box_user_login .dropdown-toggle:focus{ background: none;}
.box_header.sticky .box_user_login .dropdown-toggle:hover{ background: none;}
.box_header.sticky .box_user_login .dropdown-toggle img{ vertical-align: top; margin-top: 5px;}
.box_header.sticky .box_user_login.navbar-nav>li>.dropdown-menu:BEFORE{ right: 12px;}
.box_header.sticky .box_user_login.navbar-nav>li>.dropdown-menu:AFTER{ right: 13px;}
.box_header.sticky .box_user_login.navbar-nav>li>a{ padding: 15px 20px;}
.box_header.sticky .box_user_login.navbar-nav>li>a:hover{ background: none; color: #000;}

.box_banner img{ width: 100%;}

.box_youHave{ padding: 100px 0;}
.box_youHave .box_video{ margin-top: 38px; }
.box_youHave .content .box_title { font-size: 30px; padding-left: 34px; font-family: "HelveticaNeue-Medium"; color: #2088c9; margin-bottom: 15px;}
.box_youHave .content .desc{ padding-right: 40px; text-align: justify;}
.box_youHave .content .desc .item{ color: #233142; padding-left: 34px; position: relative; margin-bottom: 6px;}
.box_youHave .content .desc .item::before{ position: absolute; content: '\f00d'; font-family: "FontAwesome"; color: #bdc3c7; left: 0; }

.box_course{ height: 600px; overflow: hidden;}
.box_course .image{ width: 50%; float: left; height: 600px; background: url(../img/khoa-hoc-1.jpg) no-repeat left; background-size: cover;}
.box_course .image img{ width: 100%;}
.box_course .box_content{ width: 50%; float: left; margin-left: -28px; margin-top: 70px;}
.box_course .box_content .box_title { font-size: 30px; padding-left: 96px; font-family: "HelveticaNeue-Medium"; color: #2088c9; margin-bottom: 25px;}
.box_course .box_content .item{ padding: 0 0 20px 96px; }
.box_course .box_content .item .title{ font-size: 20px; font-family: "HelveticaNeue-Medium"; margin-bottom: 10px; color: #233142;}
.box_course .box_content .item_1{ background: url(../img/khoa-hoc-2.png) no-repeat;}
.box_course .box_content .item_2{ background: url(../img/khoa-hoc-3.png) no-repeat;}
.box_course .box_content .item_3{ background: url(../img/khoa-hoc-4.png) no-repeat;}
.box_course .box_content .item_4{ background: url(../img/khoa-hoc-5.png) no-repeat;}

.box_worry{ padding: 45px 0; background: #e7474d; overflow: hidden; }
.box_worry .box_text{ width: 50%; float: left; text-align: right; font-size: 27px; font-weight: 300; color: #FFF;}
.box_worry .box_btn{ width: 50%; float: left; padding-left: 60px; }
.box_worry .my_btn{ font-size: 23px; font-family: "HelveticaNeue-Medium"; color: #FFF; padding: 18px 54px; background: #0f9e1d; border: none; border-radius: 50px; margin-top: 7px; text-transform: uppercase;}

.box_give { padding: 100px 0;}
.box_give .container{ padding: 0 100px; }
.box_give .head{ text-align: center; padding-bottom: 60px; }
.box_give .box_title{ font-size: 30px; color: #2088c9; margin-bottom: 22px; font-family: "HelveticaNeue-Medium";}
.box_give .box_content{ padding: 0 100px;}
.box_give .box_content .item{ height: 375px; background: #ebebeb; padding: 60px 38px; margin-bottom: 20px; border-radius: 10px;}
.box_give .box_content .image{ margin-bottom: 40px; padding-left: 35px;}
.box_give .box_content .desc p{ font-size: 20px;}
.box_give .box_content .desc .title{ font-size: 25px; font-family: "HelveticaNeue-Medium"; margin-bottom: 15px; color: #233142;}
.box_give .box_btn{ text-align: center; margin-top: 20px; }
.box_give .my_btn{ font-size: 23px; font-family: "HelveticaNeue-Medium"; color: #FFF; padding: 18px 54px; background: #0f9e1d; border: none; border-radius: 50px; margin-top: 7px; text-transform: uppercase;}


.box_contentCourse{ padding: 100px 0; background: url(../img/noi-dung-1.jpg) no-repeat; background-size: cover; background-attachment: fixed;}
.box_contentCourse .head{ text-align: center; color: #FFF; padding: 0 0 26px; position: relative;}
.box_contentCourse .head::before{ content: ''; position: absolute; height: 3px; width: 60px; background: #2088c9; bottom: 0; margin-left: -30px;}
.box_contentCourse .box_title{ font-size: 35px; }
.box_contentCourse .text{ font-size: 20px;}
.box_contentCourse .box_content{ padding: 60px 0 0;}
.box_contentCourse .wrapper{ }
.box_contentCourse .wrapper .my_panel{ margin-bottom: 4px; border: 1px solid #515b67;}
.box_contentCourse .wrapper .my_panel .title{overflow: hidden; padding: 23px 60px; font-size: 25px; cursor: pointer; font-family: "HelveticaNeue-Medium"; background: rgba(105,114, 126, 0.2); color: #FFF; position: relative;}
.box_contentCourse .wrapper .my_panel .title .btn_title { display: table; float: left; background: #2088c9; padding: 15px 18px; font-size: 25px; border: none; border-radius: 10px; color: #FFF; margin-right: 10px; font-family: "HelveticaNeue-Medium";}
.box_contentCourse .wrapper .my_panel .title .padding{ padding-top: 14px; display: inline-block;}
.box_contentCourse .wrapper .my_panel .content{ display: none; background: #FFF;}
.box_contentCourse .wrapper .my_panel .content div{ cursor: pointer; padding: 10px 24px 10px 95px;; border-top: 1px solid #e1e1e1; font-size: 15px; color: #424e53; position: relative;}
.box_contentCourse .wrapper .my_panel .content div:BEFORE{ content: "\f0da"; font-family: "FontAwesome"; position: absolute; top: 13px; left: 45px; width: 20px; height: 20px; line-height: 17px;  text-indent: 7px; border: 2px solid #4b565b; color: #4b565b; font-size: 14px; border-radius: 50%;}
.box_contentCourse .wrapper .my_panel .content div:hover{ background-color: #ed243c; color: #FFF;}
.box_contentCourse .wrapper .my_panel .content div:hover:BEFORE{ color: #FFF; border-color: #FFF;}
.box_contentCourse .wrapper .my_panel.active .content{ display: block;}
.box_contentCourse .input-group-btn{ position: absolute; top: 30px; right: 244px; }
.box_contentCourse .input-group-btn .seeDetail{ height: 50px; line-height: 50px; padding: 0 20px;  border-radius:  6px 0 0 6px !important; font-size: 20px; background: rgba(105,114, 126, 0.2); color: #FFF;}
.box_contentCourse .input-group-btn .detail{ height: 50px; line-height: 50px; padding: 0 20px;  border-radius:  0px 6px 6px 0; !important; background: rgba(105,114, 126, 0.2); color: #FFF;}
.box_contentCourse .input-group-btn .detail i{ font-size: 20px; margin-top: 16px;}

.box_teacher{ padding: 100px 0 0; }
.box_teacher .image img{ max-width: 100%; }
.box_teacher .box_content{ margin-top: 140px; text-align: justify;}
.box_teacher .box_content .head{ padding-bottom: 20px; position: relative; margin-bottom: 27px; }
.box_teacher .box_content .head::before{ content: ''; position: absolute; height: 2px; width: 200px; background: #cccccc; bottom: 0; }
.box_teacher .box_content .head .box_title{ font-size: 60px; color: #2088c9;}
.box_teacher .box_content .head .text{ font-size: 27px; color: #233142; }
.box_teacher .box_content .desc .item{ padding-left: 34px; margin-bottom: 25px; position: relative;}
.box_teacher .box_content .desc .item::before{ content: '\f054'; position: absolute; font-family: "FontAwesome"; font-size: 17px; left: 0; top: 3px; color: #bdc3c7;}

.box_student{ background: url('../img/hoc-sinh.jpg'); background-size: cover; color: #FFF; padding: 100px 0;}
.box_student .tenten{ text-align: center;}
.box_student .text{ text-align: center; font-size: 20px;}
.box_student .text .name{ font-size: 25px;}
.box_student .text .job{ font-style: italic; }
.box_student .text .feel{ margin-top: 15px;}


.box_dangKy{ margin: 100px 0; position: relative; padding: 50px 0;}
.box_dangKy::before{ content: ''; position: absolute; width: 60%; height: 100%; background: url(../img/dang-ky.jpg) no-repeat 40px 0;  background-size: cover; top: 0; }
.box_dangKy .box_form{ background: #FFF; padding: 70px 36px; border-radius: 10px; border: 1px solid #c2c2c2;}
.box_dangKy .box_form .box_title{ font-size: 40px; font-family: "HelveticaNeue-Medium"; text-align: center; margin-bottom: 37px; }
.box_dangKy .box_content .box_title{font-size: 35px; text-align: center; margin-bottom: 34px;}
.box_dangKy .box_title span{ display: block;}
.box_dangKy .box_form .form-control{ height: 60px; border-radius: 7px; padding: 4px 50px; border-color: #5a626c; font-size: 20px; color: #585b5c; }
.box_dangKy .box_form .form-control::-webkit-input-placeholder { color: #a3a3a3;  font-size: 20px; color: #585b5c; }
.box_dangKy .box_form .form-control:-moz-placeholder {color: #a3a3a3; font-size: 20px; color: #585b5c; }
.box_dangKy .box_form .form-control::-moz-placeholder {color: #a3a3a3; font-size: 20px; color: #585b5c; }
.box_dangKy .box_form .form-control:-ms-input-placeholder {color: #a3a3a3; font-size: 20px; color: #585b5c; }
.box_dangKy .box_form .send{ text-align: center; }
.box_dangKy .box_form .send .btn-submit{ padding: 10px 20px; background: #ed253d; font-size: 20px; font-family: "HelveticaNeue-Medium"; border: none; color: #fff; margin-top: 25px; text-transform: uppercase; border-radius: 50px; }
.box_dangKy .box_form label{ font-weight: 400;}

.box_dangKy .end_sales .title{ font-size: 17px; text-align: center; }
.box_dangKy .end_sales{ overflow: hidden; width: 402px; max-width: 100%; margin: 30px auto 0; }
.box_dangKy .end_sales .title{text-align: center; margin-bottom: 10px; }
.box_dangKy .end_sales .timer .boxe{ width: 93px; text-align: center; color: #fff; float: left; margin-left: 10px; }
.box_dangKy .end_sales .timer .boxe:FIRST-CHILD{ margin-left: 0;}
.box_dangKy .end_sales .timer .boxe span{ font-size: 77px; font-family: "seguibl"; display: block; font-family: "UTM-Bebas"; background: #FFF; color: #233142; margin-bottom: 15px; }
.box_dangKy .end_sales .timer .boxe #seconds{ color: #cd0209; }

.box_dangKy .box_content{ color: #FFF; padding-top: 100px;}
.box_dangKy .box_content .text_just{width: 420px; max-width: 100%; margin: 0 auto; font-size: 30px; padding-right: 80px; text-align: right;}
.box_dangKy .box_content .gia { width: 420px; max-width: 100%; border: 2px solid #FFF; border-radius: 50px; overflow: hidden; margin: 0 auto; font-family: "UTM-Bebas";}
.box_dangKy .box_content .gia .sales{ font-size: 45px; width: 50%; float: left; height: 80px; line-height: 80px; text-align: center; }
.box_dangKy .box_content .gia .sales span{ display: inline-block;  position: relative; }
.box_dangKy .box_content .gia .sales span::before{content: ''; position: absolute; width: 100%; height: 4px; background: #fff; top: 43px; }
.box_dangKy .box_content .gia .price{ position: relative; background: #ed253d; color: #fff; font-size: 60px; padding: 0 5px; height: 80px; width: 50%; float: left; text-align: center; display: table;}
.box_dangKy .box_content .gia .price p{ display: table-cell; vertical-align: middle; line-height: 26px;}
.box_dangKy .box_content .gia .price p span{ font-size: 18px; display: block; position: absolute; top: 2px;}
.box_dangKy .box_content .desc .text{ text-align: center; font-size: 20px; }
.box_dangKy .has-error .form-control { border-color: #a94442 !important;}

.box_footer{ background-color: #24333b; padding: 80px 0; color: #FFF;}
.box_footer .box_title{ font-family: "UTM-Bebas"; color: #FFF; font-size: 25px;}
.box_footer .box_content{ padding-top: 20px;}
.box_footer .about{ padding-bottom: 50px;}
.box_footer .about .logo{ padding-bottom: 25px; padding-top: 8px;}
.box_footer .social{ display: inline-block; margin-left: 30px;}
.box_footer .item{ padding-bottom: 15px;}
.box_footer .item .image{ width: 80px; float: left; margin-right: 10px;}
.box_footer .item .image img{ width: 100%;}
.box_footer a{ color: #FFF;}
.box_footer a:hover{ color: #EEE;}

/* Defined */
@-webkit-keyframes mySticky { from { margin-top: -150px } to { magrin-top: 0 } }
@-moz-keyframes mySticky { from { margin-top: -150px } to { magrin-top: 0 } }
@keyframes mySticky { from { margin-top: -150px } to { magrin-top: 0 } }

.popup_video{ background: url("/assets/landing/cau-chuyen-thanh-cong/img/loader.gif") no-repeat center 40% rgba(0, 0, 0, 0.8); position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 999999;}
.popup_video .popup_content{ width: 80%; margin: 0 auto; margin-top: 5%; position: relative;}
.popup_video .popup_close{ position: absolute; top: -18px; right: -13px; font-size: 30px; color: #FF0000; line-height: 100%;}

iframe[name="google_conversion_frame"]{ height: 0;}

/*RESPONSIVE*/
@media ( min-width : 1200px) {
  .popup_video .popup_content{ width: 60%;}
  .container{ max-width: 100%;}
}

@media ( max-width : 1200px) {
  .popup_video .popup_content{ width: 50%;}
}

@media all and (min-width: 993px) and (max-width: 1200px) {
    .container{ max-width: 100%;}
}

@media ( max-width : 1000px) {
    body{ font-size: 15px;}

    .menu_mobile_bg{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); z-index: 99998;}

    .box_header{  position: fixed; border: 0; border-bottom: 1px solid #CCC; padding: 20px 0 0 0;}
    .box_header .row{  position: relative; width: 100%; top: -3px; padding-bottom: 10px;}
    .box_header .position{ position: absolute; right: -23px; top: -23px;}
    .box_header .contact{ padding: 5px 0;}
    .box_header .contact .hotline{ font-size: 12px; padding: 1px 7px 1px 0;}
    .box_header .contact .socail{padding-left: 5px; }
    .box_header .contact .socail a i{ line-height: 18px; width: 18px; height: 18px; }
    .box_header .container{ position: relative;}
    .box_header .logo{ margin-top: 5px !important;}
    .box_header .menu_mobile{ top: 13px;}
    .box_header .menu_mobile .item{ background-color: #999;}
    .box_header.sticky{ padding-bottom: 0 !important;}
    .box_header .menu{ position: fixed; top: 0; left: 0; z-index: 99999; width: 60%; height: 100%; background-color: #2088c9; overflow: auto; margin: 0; padding: 20px 0;}
    .box_header .menu li{ display: block; padding: 15px 20px;}
    .box_header .menu li a{ text-transform: uppercase; color: #FFF;}
    .box_header .menu li a:hover{ color: #222;}
    .box_header .menu li a.my_btn{ background-color: #ed1c24; font-size: 16px;}

    .box_banner{ padding-top: 40px;}

    .box_youHave{ padding: 50px 0;}
    .box_youHave .content .desc{ padding: 0;}
    .box_youHave .content .box_title{ margin: 0;}

    .box_course .box_content{ margin: 20px 0 0 -28px; padding: 0 !important; }

    .box_give,.box_contentCourse,.box_teacher,.box_student{ padding: 50px 0;}
    .box_give .container{ padding: 0 10px;}
	.box_give .box_content{ padding: 0;}
	
	.box_contentCourse .wrapper .my_panel .title{ padding: 10px 15px; font-size: 18px;}
	.box_contentCourse .wrapper .my_panel .title .btn_title{ display: block; padding: 8px 13px; font-size: 19px;}
	.box_contentCourse .input-group-btn{ right: 155px; top: 17px;}
	.box_contentCourse .input-group-btn .seeDetail{ height: 30px;line-height: 30px;padding: 0 15px;font-size: 15px;}
	.box_contentCourse .input-group-btn .detail {height: 30px;line-height: 30px;padding: 0 15px;}
	.box_contentCourse .input-group-btn .detail i {font-size: 15px;margin-top: 8px;}
	
	.box_teacher .box_content{ margin: 0;}
	.box_teacher .box_content .head{ margin-bottom: 16px;}
	.box_teacher .box_content .head .box_title{ font-size: 30px; }
	.box_teacher .box_content .head .text{ font-size: 18px; }
	.box_teacher .box_content .desc .item{ margin-bottom: 0;}
	
	.box_dangKy .box_content .gia .price{ font-size: 54px;}
	.box_dangKy .box_content .gia .sales{ font-size: 37px;}
	.box_dangKy .end_sales .timer .boxe{ width: 80px;}
	
	.box_contentCourse .box_content{ padding-top: 20px;}
    .popup_video .popup_content{ width: calc(100% - 40px); top: 10%;}
}

@media ( max-width : 767px) {
    .box_title{ font-size: 25px !important;}
	.box_youHave{ padding: 30px 0;}
    .box_youHave .content .desc{ margin-bottom: 10px;}
    .box_course{ height: auto; margin-bottom: 30px;}
    .box_course .image{ display: none;}
    .box_course .box_content{ width: 100%; margin: 0; padding-left: 10px !important;}
    .box_course .box_content .item{ padding: 0 0 15px 53px;}
    .box_course .box_content .item_1,.box_course .box_content .item_2,.box_course .box_content .item_3,.box_course .box_content .item_4{ background-size: 40px;}
    .box_course .box_content .box_title{ padding-left: 53px; margin-bottom: 20px;}

    .box_worry .box_text{ font-size: 20px; width: 100%; text-align: center; margin-bottom: 10px;}
    .box_worry .box_btn{ width: 100%; padding: 0;text-align: center;}
    .box_worry .box_text br{ display: block;}
    .box_worry .my_btn{ padding: 10px 37px; font-size: 17px; margin-top: 3px;}

    .box_give .box_content .item{ padding: 15px 19px; height: auto;}
    .box_give .box_content .image{ margin-bottom: 21px; }
    .box_contentCourse .wrapper .my_panel .title br{ display: none;}
    .box_contentCourse .input-group-btn{ position: initial; top: 10px; }
    .box_contentCourse .wrapper .my_panel .title .padding{ display: inline-block; padding-bottom: 10px; }

    .box_teacher .image img{ margin-bottom: 20px;}
    .box_teacher .box_content .desc .item {margin-bottom: 10px;}
    .box_dangKy{ margin: 30px 0;}

    .box_dangKy::before{ width: 100%; background: url(../img/dang-ky.jpg) no-repeat 0px 0; background-size: cover;}
    .box_dangKy .box_content{ padding: 0;}
    .box_dangKy .box_form{ margin-top: 20px;}

    .befor{ width: 100%;}
    .slick-track{ height: 242px !important; }

  .popup_video .popup_content{ width: calc(100% - 30px); top: 20%;}

}

@media ( max-width : 480px) {
}

@media ( max-width : 360px) {
}