body {
    background: #fff none repeat scroll 0 0;
    font-family: Roboto, Tahoma, arial, sans-serif;
    font-size: 14px;
    margin: 0;
    padding: 0;
    line-height: 1.25;
    color: #000;
}
.bgfooter{
    background: #fff url("http://hocmai.vn/image.php?width=1357&image=http://hocmai.vn/luyen-thi-quoc-gia/luyen-thi-pen-c/images/fbg2.jpg") no-repeat scroll center bottom;
}
a {
    outline: medium none;
}
a:focus, a:hover{
    outline: none;
    text-decoration: none;
}
img{
    max-width: 100%;
    height: auto;
}
#page{
    background: #fff;
    min-width: 1160px;
    margin: 0 auto;
    position: relative;
}
.wrapper{
    margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
    position: relative;
    width: 1190px;
}
.hide-step{
    display: block;
}
.rbc{
    font-family: "Roboto Condensed", Roboto, Tahoma, arial, sans-serif;
}
.bebas{
    font-family: "UTM Bebas", "Roboto Condensed", Roboto, Tahoma, arial, sans-serif;
}
.next-bt-wr {
    margin: 10px auto;
    text-align: center;
}

.fix-height{
    /*height: 1px;*/
    /*overflow: hidden;*/
}
.hidebt{
    display: none!important;
}
/* ------------- Header ----------- */
#banner{
    background: #333 url("/hoc-mien-phi-pen-i/images/new-bg.jpg") no-repeat scroll center 0;
    color: #000000;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.logo img {
    filter: invert(100%);
    -webkit-filter: invert(100%);
}
#highlight:before {
    background: rgba(255,255,255,0.9) none repeat scroll 0 0;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0;
}

#highlight .head {
    display: block;
    border-bottom: solid 1px #000000;
    margin-bottom: 60px;
    padding-bottom: 5px;
}

#site-logo {
    margin-left: 30px;
    margin-right: 10px;
    display: inline-block;
}

#highlight .head .social-link {
    display: inline-block;
    margin-right: 40px;
    margin-top: 5px;
}

#header, #highlight{
     position: relative;
     z-index: 2;
 }

#header{
    background: rgba(255, 255, 255, 0.09) none repeat scroll 0 0;
    color: #a6a8a8;
    height: 58px;
    padding: 9px 38px 0;
}

.logo {
    float: left;
}
.name-slogan {
    float: left;
    margin-left: 10px;
}
.site-name {
    margin: 10px 0 0 0;
    font-size: 16px;
    line-height: 1;
    padding: 5px 0 6px;
}
.name-slogan p {
    margin: 0;
}
.site-name a {
    color: #000000;
    font-weight: 900;
}
.site-slogan {
    color: #000000;
    font-size: 12.8px;
    font-style: italic;
    line-height: 1;
}
.site-name a:hover, .site-name a:active, .site-name a:focus {
    color: #009fd0;
    text-decoration: none;
}

/* ---------- Highlight ---------- */
.hl-title {
    color: #000000;
    font-size: 39px;
    font-weight: 300;
    margin: 0px auto 15px;
    padding: 0;
    position: relative;
    text-align: center;
    text-transform: uppercase;
}
.hl-title > strong {
    color: #000000;
    font-weight: 600;
}
.hl-title >strong span {
    color: #fcff00;
}

.at-title {
    color: #fff;
    font-size: 24px;
    font-weight: 500;
    margin: 15px auto 15px;
    padding: 0;
    position: relative;
    text-align: center;
}


.color-orange {
    color: #ff6600 !important;
}

.hl-list {
    font-size: 16px;
    font-weight: 300;
    color: #666666;
    list-style: outside none none;
    margin: 50px auto 35px;
    padding: 0 10px;
}
.hl-list > li {
    background-position: center 0;
    background-repeat: no-repeat;
    float: left;
    padding: 70px 0px 10px;
    text-align: center;
    width: 380px;
    font-weight: 500;
}

.feedback-button {
    display: inline-block;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    cursor: pointer;
    margin: 20px 0;
    padding: 12px 22px;
    font-size: 28px;
    font-weight: 900;
    border: none;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    color: white;
    -o-text-overflow: clip;
    text-overflow: clip;
    background: -webkit-linear-gradient(0deg, #f6891f 0, #f6891f 100%);
    background: -moz-linear-gradient(90deg, #f6891f 0, #f6891f 100%);
    background: linear-gradient(90deg, #f6891f 0, #f6891f 100%);
    background-position: 50% 50%;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: auto auto;
    background-size: auto auto;
    -webkit-box-shadow: 0 10px 0 0 #cc6600 ;
    box-shadow: 0 10px 0 0 #cc6600 ;
}

.feedback-button:hover {
    color: white;
    background-image: -webkit-linear-gradient(-90deg, #cc6600 0, #f6891f 100%);
    background-image: -moz-linear-gradient(180deg, #cc6600 0, #f6891f 100%);
    background-image: linear-gradient(180deg, #cc6600 0, #f6891f 100%);
    background-position: 50% 50%;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: auto auto;
    background-size: auto auto;
}

.feedback-button:active {
    color: white;
    background-image: -webkit-linear-gradient(-90deg, #cc6600 0, #f6891f 100%);
    background-image: -moz-linear-gradient(180deg, #cc6600 0, #f6891f 100%);
    background-image: linear-gradient(180deg, #cc6600 0, #f6891f 100%);
    background-position: 50% 50%;
    -webkit-background-origin: padding-box;
    background-origin: padding-box;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    -webkit-background-size: auto auto;
    background-size: auto auto;
}

.hl-title-2 {
    color: red;
    font-size: 28px;
    font-weight: 600;
    margin: 60px auto 0px;
    padding: 0;
    position: relative;
    text-align: center;
    text-transform: uppercase;
}

.hl-title-3 {
    color: red;
    font-size: 26px;
    font-weight: 300;
    margin: 5px auto;
    padding: 0;
    position: relative;
    text-align: center;
}

.hl-list > li > span {
    color: #f65c22;
}
.hl-list > li:nth-child(1) {
    background-image: url("/hoc-mien-phi-pen-i/images/free-learn-2/learn-table.png");
}
.hl-list > li:nth-child(2) {
    background-image: url("/hoc-mien-phi-pen-i/images/free-learn-2/video-play.png");
}
.hl-list > li:nth-child(3) {
    background-image: url("/hoc-mien-phi-pen-i/images/free-learn-2/group-people.png");
}
.hl-list > li:nth-child(4) {
    background-image: url("/hoc-mien-phi-pen-i/images/free-learn-2/saving.png");
}
#highlight .next-bt {
    margin: 20px 0;
}

.c-section .date {
    display: inline-block;
    margin: 0px 4px;
    border: solid 2px #FFDAB5;
    border-radius: 130px;
    padding: 10px 25px;
}

.hl-count-box {
    position: absolute;
    bottom: 75px;
    left: 50px;
    text-align: center;
    border-radius: 5px;
    color: #000000;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.left-cta {
    display: inline-block;
    text-align: center;
}

#highlight .next-bt-wr {
    margin-bottom: 40px;
}

#highlight .next-bt-wr .next-bt {
    background-image: none;
    background-color: #f6891f;
    font-size: 28px;
    font-weight: 900;
    -webkit-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
}

/*----------course---------*/
#course .teacher-tabs > li a {
    border: 1px solid #fff;
    border-radius: 10px;
    display: block;
    font-size: 13px;
    background: #f8a600 none repeat scroll 0 0;
    color: #323232;
    font-weight: 900;
    text-transform: uppercase;
}

.course-video-learn {
    display: block;
    height: 100%;
    position: relative;
}
.course-video-learn::before {
    background: rgba(0, 0, 0, 0) url("/hoc-mien-phi-pen-i/images/free-learn-2/play_white.png") no-repeat scroll center center;
    content: "";
    display: block;
    height: 60px;
    left: 50%;
    margin: -19px 0 0 -27px;
    opacity: 0.65;
    position: absolute;
    top: 50%;
    width: 60px;
    z-index: 2;
}

#updateInfoModal .modal-body p {
    text-align: center;
}
.course-video-learn:hover:before{
    opacity: 0.85;
}

#course .teacher-tabs > li.active a {
    background-color: #f6891f;
}

#course .tab-content .tab-pane {
    margin-top: 50px;
}

#course {
    -webkit-box-shadow: inset 0px -50px 60px -10px rgba(0,0,0,0.2);
    -moz-box-shadow: inset 0px -50px 60px -10px rgba(0,0,0,0.2);
    box-shadow: inset 0px -50px 60px -10px rgba(0,0,0,0.2);
    text-align: center;
    background: #FFFFff url("../images/free-learn/course-background.png") repeat scroll 0 0;
    padding-bottom: 60px;
}

.video-trailer-course {
    margin: auto;
    width: 640px;
    height: 390px;
}
.c-header h2 {
    display: inline-block;
    margin: 36px auto 25px;
    font-size: 36px;
    font-weight: 900;
}

.slide-wrapper {
    position: relative;
}
.slide-wrapper .button-left {
    display: inline-block;
    position: absolute;
    left: 0;
    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */
    transform: rotate(180deg);
    top: 50%;
    z-index: 1000;
}

.slide-wrapper .button-right {
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 0;
    z-index: 1000;
}

.slide-wrapper .button-left a {
    display: block;
}

.slide-wrapper .c-description {
    width: 520px;
    min-height: 420px;
    background-color: white;
    padding: 15px;
    -webkit-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
}
.slide-wrapper .c-description .c-content {
    border: solid 2px #eaeaea;
    min-height: 390px;
}
.slide-wrapper .c-description .c-title {
    color: #004981;
    font-size: 16px;
    font-weight: 900;
    padding: 0 15px;
    text-transform: uppercase;
}

.slide-wrapper .c-description .slide-bot {
    width: 100%;
    display: inline-block;
}
.slide-wrapper .c-description .c-content .course-video {
    width: 50%;
    height: auto;
    margin: 0px;
    display: inline-block;
    padding: 0 0 15px 15px;
}

.slide-wrapper .c-description .c-content .cr-btn {
    width: 50%;
    display: inline-block;
    margin-top: 10%;
}

.slide-wrapper .c-description .c-content .cr-btn .next-bt:hover {
    background-color: #ff7033;
}

.slide-wrapper .c-description .c-content .cr-btn .next-bt {
    background-color: #f6891f;
    background-image: none;
    border-radius: 7px;
    color: #f8f8f9;
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
    line-height: 40px;
    text-transform: uppercase;
    min-width: 100px;
    -webkit-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    padding: 0 30px;
}

.slide-wrapper .c-description .c-content .cr-btn .next-bt i {
    padding: 0 5px;
}

.slide-wrapper .c-description .c-content .course-des {
    background: transparent url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images3/course-struct.png") no-repeat 0 0;
    margin-left: 20px;
    text-align: left;
    padding-left: 30px;
    font-weight: 300;
}

.slide-wrapper .c-description .c-content .teacher-des {
    background: transparent url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images3/teach-style.png") no-repeat 0 0;
    margin-left: 20px;
    text-align: left;
    padding-left: 30px;
    border: none;
    height: auto;
}

.slide-wrapper .c-description .c-content .teacher-sol {
    background: transparent url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images3/medal.png") no-repeat 0 0;
    margin-left: 20px;
    text-align: left;
    padding-left: 30px;
    font-weight: 300;
}

#course .tab-content .slide-wrapper {
    width: 1024px;
    margin: auto;
}

.hl-hs-count {
    text-align: center;
    border: solid 2px #ff7033;
    margin-bottom: 8px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 5px;
    padding: 4px;
    display: inline-block;
}

.hl-hs-count .count {
    font-size: 16px;
    color: #fcff00;
    font-weight: 900;
}

.hl-hs-count .c-title {
    font-size: 10px;
}

.hl-count-box .c-box {
    background: transparent;
    text-align: center;
    padding: 19px 44px;
    border-radius: 5px;
}

.hl-count-box .c-box .hasCountdown {
    background: none;
    border: none;
}

.c-section .date .c-number {
    font-size: 35px;
    color: #000000;
    font-weight: 900;
}
.c-section .date p {
    font-size: 20px;
    margin: 0;
}

.c-section .separator {
    vertical-align: top;
    font-size: 46px;
    color: #fcff00;
    display: none;
}
.c-box .cd-title {
    font-size: 20px;
    margin-bottom: 10px;
}

/*----------- Program --------------*/


#program {
    /*background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(160,160,160,0.4) 100%); *//* FF3.6+ *//*
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(160,160,160,0.4))); *//* Chrome,Safari4+ *//*
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(160,160,160,0.4) 100%); *//* Chrome10+,Safari5.1+ *//*
    background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(160,160,160,0.4) 100%); *//* Opera 11.10+ *//*
    background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(160,160,160,0.4) 100%); *//* IE10+ *//*
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(160,160,160,0.4) 100%); *//* W3C */
    padding-bottom: 15px;
    padding-top: 10px;
    background-size: 80%;
    position: relative;
    text-align: center;
}

#program .p-head {
    display: inline-block;
    background-color: #4f87b3;
    color: white;
    font-size: 26px;
    font-weight: 900;
    padding: 10px 37px;
    border-radius: 10px;
    margin-bottom: 20px;
    margin-top: 20px;
}

#program .p-list {
    width: 100%;
    text-align: left;
}
#program .p-list ul {
    list-style: none;
    padding-left: 300px;
    padding-right: 300px;
    font-size: 20px;
    margin-bottom: 20px;
}

#program .p-list ul li {
    margin: 4px 0px;
}

#program .p-list ul li i {
    margin-right: 10px;
}

#program .p-header {
    color: #fff;
    margin: 0px auto 36px;
    padding: 0;
    position: relative;
    text-align: center;
    text-transform: uppercase;
}
#program .p-header h2 {
    font-size: 36px;
    font-weight: 900;
}

.text-through {
    text-decoration: line-through;
}

#program .p-content {
    padding-left: 145px;
}

#program .p-content .p-selling {
    list-style: none;
    font-size: 24px;
    font-weight: 700;
    padding: 0;
}

#program .p-bottom {
    text-align: center;
    margin: 43px auto;
    bottom: 0;
    position: absolute;
    left: 43.5%;
}

#program .p-bottom .next-bt {
    background-image: none;
    background-color: #f26822;
    line-height: 40px;
    min-width: 180px;
    padding: 0 10px;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 18px;
    -webkit-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
}
#program .p-bottom .next-bt-wr {
    position: relative;
    display: inline-block;
    margin: auto;
}

#program .p-bottom .box-count-hs {
    position: absolute;
    top: -110px;
    left: -225px;
    height: 190px;
    width: 250px;
    background: transparent url("/hoc-mien-phi-pen-i/images/free-learn-2/talk-box.png") no-repeat 0 0;
}
#program .p-bottom .box-count-in {
    height: 170px;
    width: 210px;
    text-align: center;
    margin: 10px 0 0 8px;
    background: transparent url("/hoc-mien-phi-pen-i/images/free-learn-2/talk-box-2.png") no-repeat 0 0;
}
#program .p-bottom .box-count-in .count {
    font-size: 40px;
    font-weight: 900;
    padding-top: 30px;
}

#program .p-bottom .box-count-in .c-title {
    font-size: 18px;
    font-weight: 700;
}



#program .p-content .p-selling li {
    margin: 8px 0;
}

#program .p-content .p-selling li i {
    margin-right: 10px;
}

#addedPackageModal .content-inf {
    padding: 0 40px;
}
#addedPackageModal .content-inf .note {
    background-color: #E4E4E4;
    padding: 5px 15px;
    border-radius: 5px;
}

#addedPackageModal .button-orange {
    background-image: none;
    background-color: #f26822;
    margin: 10px auto;
    display: inline-block;
    border: none;
    -webkit-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
    box-shadow: 5px 5px 3px 0px rgba(0,0,0,0.2);
}

#addedPackageModal .btn-wrapper {
    display: block;
    text-align: center;
}

#errorModal .modal-dialog {
    width: 500px;
}

#errorModal .modal-dialog .modal-message {
    text-align: left;
    padding-left: 25px;
}
#errorModal .modal-dialog .modal-header h4{
    color: red;
}

#updateInfoModal .modal-content {
    border: none;
}

#updateInfoModal .modal-content .modal-title {
    color: white;
}

#updateInfoModal.stmodal .control-group label {
    color: #000000;
}

#updateInfoModal.stmodal .control-group textarea,
#updateInfoModal.stmodal .control-group input[type="text"],
#updateInfoModal.stmodal .control-group input[type="email"] {
    border-color: #aaaaaa;
}
#updateInfoModal.stmodal .reg-submit {
    background: none repeat scroll 0 0 #2a70b8;
    background: none repeat scroll 0 0 #2a70b8;
    float: right;
    margin: 0px 25px;
    border-radius: 5px;
}

#updateInfoModal .custom-combobox .custom-combobox-toggle {
    color: #2a70b8;
}

/* -------------- Carousel ------------- */
.carousel-control.left, .carousel-control.right {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    height: 50px;
    margin-top: -40px;
    top: 50%;
    width: 40px;
}
.carousel-control.left{
    left: 0;
}
.carousel-control.right{
    right: 0;
}
.carousel-control, .carousel-control:hover, .carousel-control:focus{
    color: #f5aa75;
    opacity: 1;
}
.carousel-control .glyphicon {
    font-size: 35px;
    height: 40px;
    left: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    top: 0;
    width: 40px;
}

/* -------------- Giáo viên -------------- */
.teachers-box .wrapper {
    background: #3c3c3c url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images3/teacher-bg.jpg") no-repeat scroll center 0;
    color: #fff;
}
.t-title {
    font-size: 24px;
    font-weight: 900;
    margin: 20px auto 0;
    padding: 0 30px;
    text-align: center;
}
.t-title > span{
    border-bottom: 1px solid;
}
.t-title .star {
    background: rgba(0, 0, 0, 0) url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/star-white.png") no-repeat scroll 0 0;
    display: inline-block;
    height: 19px;
    margin: 0 15px;
    width: 80px;
}
.t-des {
    font-size: 20px;
    font-weight: 100;
    margin: 10px auto 20px;
    padding: 0 30px;
    text-align: center;
}

.teacher-tabs {
    margin: 10px auto;
    padding: 0;
    text-align: center;
}
.teacher-tabs > li {
    color: #323232;
    display: inline-block;
    height: 30px;
    line-height: 30px;
    margin: 0 3px;
    width: 130px;
}
.teacher-tabs > li a {
    border: 1px solid #fff;
    border-radius: 10px;
    color: #fff;
    display: block;
    font-size: 16px;
    font-weight: 300;
}
.teacher-tabs > li.active a {
    background: #fff none repeat scroll 0 0;
    color: #323232;
}
.carousel-teacher {
    margin: 0 auto;
    padding: 15px 0 0;
    width: auto;
}
.carousel-teacher-inner {
    margin: 0 auto;
    text-align: center;
    width: auto;
}
.teachers {
    display: inline-block;
    margin: 0 auto;
    padding: 0;
}
.teacher {
    border: 1px solid #fff;
    float: left;
    list-style: outside none none;
    margin: 0 13px;
    padding: 10px;
    position: relative;
    text-align: left;
    width: 242px;
}
.teacher-image-wr {
    cursor: pointer;
    height: 131px;
    overflow: hidden;
    padding: 0;
    position: relative;
    text-align: center;
    width: 100%;
}
.teacher-video-learn {
    display: block;
    height: 100%;
    position: relative;
}
.teacher-video-learn::before {
    background: rgba(0, 0, 0, 0) url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/yt-play-icon.png") no-repeat scroll center center;
    content: "";
    display: block;
    height: 38px;
    left: 50%;
    margin: -19px 0 0 -27px;
    opacity: 0.65;
    position: absolute;
    top: 50%;
    width: 53px;
    z-index: 2;
}
.teacher-video-learn:hover:before{
    opacity: 0.85;
}
.teacher-name {
    font-size: 17px;
    font-weight: bold;
    margin: 15px auto 10px;
    text-align: center;
}
.teacher-detail-bt {
    color: #fff;
    font-size: 18px;
    font-weight: 500;
}
.teacher-detail-bt:hover{
    color: #000;
}
.teacher-des {
    border-bottom: 1px dashed;
    font-size: 14px;
    font-weight: 300;
    height: 8.5em;
    margin: 10px auto 5px;
    overflow: hidden;
    padding-bottom: 10px;
}
.teacher-sol {
    font-size: 14px;
    height: 3.8em;
    overflow: hidden;
}
.teacher-subject {
    background: #27557b none repeat scroll 0 0;
    color: #fff;
    font-size: 17px;
    font-style: italic;
    font-weight: 500;
    height: 30px;
    line-height: 30px;
    margin-left: 105px;
    padding: 0 20px;
    position: relative;
    right: 0;
    text-align: center;
    width: 125px;
}

.teacher-learn-trial-bt {
    background: #a63704 url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images3/icon/bt-bg.png") repeat scroll 0 0;
    border-radius: 10px;
    color: #fff;
    display: inline-block;
    font-size: 19px;
    font-weight: 500;
    line-height: 46px;
    margin: 15px auto 5px;
    padding: 0 15px;
    text-transform: uppercase;
}

.carousel-teacher .carousel-control.left, .carousel-teacher .carousel-control.right {
    height: 43px;
    margin-top: 0;
    top: 155px;
    width: 40px;
}
.carousel-teacher .carousel-control.left{
    left: 5px;
}
.carousel-teacher .carousel-control.right{
    right: 5px;
}
.carousel-teacher .carousel-control .glyphicon {
    background: #323232 none repeat scroll 0 0;
    border-radius: 10px;
    color: rgba(255, 255, 255, 0.5);
    font-size: 22px;
    height: 40px;
    line-height: 40px;
    text-shadow: none;
    width: 40px;
}
.carousel-teacher .carousel-control.left .glyphicon{
    padding-right: 5px;
}
.carousel-teacher .carousel-control.right .glyphicon{
    padding-left: 5px;
}
.carousel-teacher .carousel-control:hover .glyphicon{
    color: rgba(255, 255, 255, 0.8);
}
.carousel-teacher .carousel-control.left .glyphicon,
.carousel-teacher .carousel-control.right .glyphicon {
    box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.35);
}
.teacher-indicators {
    left: 0;
    margin: 10px auto 30px;
    position: relative;
    top: 0;
}
.teacher-indicators li,.teacher-indicators li.active{
    border: medium none;
    height: 28px;
    width: 28px;
    margin: 1px;
}
.teacher-indicators li.active {
    background: url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/indicator.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.teacher-indicators li {
    background: url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/indicator.png") no-repeat scroll -26px 0 rgba(0, 0, 0, 0);
}
.rsdes {
    display: inline-block;
    font-size: 27px;
    height: 50px;
    line-height: 50px;
}
.reverse-bt {
    background: #ff9000 none repeat scroll 0 0;
    color: #fff;
    display: inline-block;
    font-size: 27px;
    height: 50px;
    line-height: 50px;
    margin: 0 20px;
    padding: 0 65px 0 40px;
    position: relative;
}
.reverse-bt:before {
    background: rgba(0, 0, 0, 0) url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/ic3.png") no-repeat scroll center center;
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    right: 18px;
    top: 0;
    width: 22px;
}
.teachers-box .next-bt {
    font-size: 22px;
    height: 46px;
    line-height: 46px;
    margin: 10px;
    min-width: 280px;
}
/* ----------- Courses -----------*/
.courses-box {
    background: #fff none no-repeat scroll center bottom;
    padding: 10px 0 0;
}
.st-title {
    color: #0565ab;
    font-size: 40px;
    font-weight: bold;
    margin: 0 0 15px;
    text-align: center;
}

.course-wrapper {
    background: #fff none repeat scroll 0 0;
    border-color: #4d4d4d;
    border-style: solid;
    border-width: 20px 5px 22px;
    box-shadow: 0 14px 5px 0 rgba(0, 0, 0, 0.35);
    margin: 10px auto 20px;
    padding-left: 140px;
    position: relative;
    width: 762px;
}
.course-image {
    text-align: center;
}
.course-teacher-wr {
    background: #ff910a none repeat scroll 0 0;
    color: #fff;
    font-size: 18px;
    height: 280px;
    left: 5px;
    padding: 23px 10px;
    position: absolute;
    text-align: center;
    top: -23px;
    width: 130px;
}
.course-teacher-wr:after {
    border-color: #ff910a transparent transparent;
    border-style: solid;
    border-width: 21px 65px 0;
    content: "";
    display: block;
    height: 0;
    left: 0;
    position: absolute;
    top: 100%;
    width: 0;
}

.course-subject {
    font-size: 18px;
    font-weight: 500;
    margin: 0 auto 10px;
    text-transform: uppercase;
}
.course-teacher-img {
    background: #ccc none repeat scroll 0 0;
    border: 5px solid #fff;
    height: 128px;
    margin: 0 auto;
    text-align: center;
    width: 98px;
}
.course-teacher > span {
    display: block;
    text-align: left;
}
.course-teacher-degree {
    font-size: 10px;
    font-weight: 500;
    margin: 10px auto 5px;
}
.course-teacher-name {
    font-size: 11px;
    font-weight: 500;
    min-height: 2.5em;
    text-transform: uppercase;
}
.teacher-detail-view {
    background: #cb7811 none repeat scroll 0 0;
    border-radius: 5px;
    color: #fff;
    display: block;
    font-size: 13px;
    font-style: italic;
    height: 28px;
    line-height: 26px;
    margin: 10px auto 0;
    width: 95px;
}

.course {
    height: 430px;
    margin: 0 25px;
    padding: 20px 0 0;
}
.course-name {
    color: #ff910a;
    font-size: 17px;
    margin: 0 0 10px;
}

.course-description > p,
.course-fee{
    padding: 10px 15px;
}
.course-action {
    padding: 15px 0;
}
.course-description {
    color: #0565ab;
    font-size: 14px;
    list-style: outside none square;
    padding-left: 1em;
    text-align: justify;
}
.course-description p {
    color: #080808;
    font-size: 13px;
    font-weight: 300;
}
.course-description strong {
    font-weight: 900;
}
.course-video {
    float: left;
    margin-right: 20px;
    width: 304px;
    height: 183px;
}
.learn-free-bt-wr {
    background: rgba(0, 0, 0, 0) url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/lfbt.png") no-repeat scroll center top;
    float: right;
    margin: 19px 0 0;
    padding: 122px 0 10px;
}
.learn-free-bt {
    background: #ff8a00 none repeat scroll 0 0;
    border-radius: 10px;
    color: #fff;
    display: inline-block;
    font-size: 25px;
    font-weight: bold;
    height: 42px;
    line-height: 45px;
    margin: 0 auto;
    padding: 0 15px;
    text-align: center;
    text-transform: uppercase;
}
.learn-free-bt:hover, .learn-free-bt:focus{
    text-decoration: none;
}
.courses-box .next-bt-wr {
    margin-top: -55px;
    position: relative;
    z-index: 9;
}

/* --- Course Slide --- */
.flipster{
    overflow-x: hidden;
    overflow-y: hidden;
}
.flipster-course {
    margin: 0 auto 20px;
}
.flipster-course .flip-prev {
    transform: translateX(-45%) translateZ(0px) rotateY(80deg) scale(0.8);
}
.flipster-course .flip-next {
    transform: translateX(45%) translateZ(0px) rotateY(-80deg) scale(0.8);
}
.flipster-course .flip-past {
    transform: translateX(-60%) translateZ(0px) rotateY(80deg) scale(0.7);
}
.flipster-course .flip-future {
    transform: translateX(60%) translateZ(0px) rotateY(-80deg) scale(0.7);
}
.flipster-course .flip-prev:before,
.flipster-course .flip-next:before,
.flipster-course .flip-past:before,
.flipster-course .flip-future:before{
    content: "";
    display: block;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
}
.flipster-carousel .flip-prev:before {
    background: rgba(230, 80, 39, 0.5) none repeat scroll 0 0;
}
.flipster-carousel .flip-next:before {
    background: rgba(255, 145, 10, 0.5) none repeat scroll 0 0;
}
.flipster-carousel .flip-past:before {
    background: rgba(84, 179, 127, 0.5) none repeat scroll 0 0;
}
.flipster-carousel .flip-future:before {
    background: rgba(49, 138, 137, 0.5) none repeat scroll 0 0;
}
/* ----------- Modal ------------- */
.modal{
    font-size: 14px;
}
.modal-backdrop.in{
    opacity: 0.8;
}
.modal-dialog.modal-sm{
    width: 400px;
}
.modal-header {
    padding: 10px 15px;
    background-color: #2a70b8;
}
.modal-title {
    color: white;
    font-size: 18px;
    font-weight: bold;
    padding: 0 15px;
    text-align: center;
    text-transform: uppercase;
}
.modal textarea{
    resize: none;
}
.control-group {
    margin-bottom: 10px;
}
.control-group label {
    float: left;
    font-weight: normal;
    line-height: 36px;
    min-width: 85px;
}
.control-group textarea,
.control-group input[type="text"], .control-group input[type="email"] {
    background: none repeat scroll 0 0 #e4f8e6;
    border: 1px solid #339900;
    padding: 5px 10px;
    width: 283px;
}
.stmodal .control-group input[type="checkbox"],
.stmodal .control-group input[type="radio"]{
    float: left;
    margin: 14px 0;
}
.control-group textarea{
    height: 108px;
}
.control-group input[type="text"], .control-group input[type="email"]{
    height: 36px;
}
.control-mwr {
    float: left;
}
.control-message {
    font-size: 14px;
    margin: 5px 0;
}
.control-mwr.error .control-message{
    color: red;
}
.reg-submit {
    background: none repeat scroll 0 0 #759c11;
    border: medium none;
    border-radius: 5px;
    color: #fff;
    display: block;
    font-size: 20px;
    font-weight: bold;
    height: 60px;
    margin: 20px auto 0;
    padding: 10px 30px;
    text-transform: uppercase;
    width: 100%;
}
.reg-submit:hover{
    background: none repeat scroll 0 0 #56730c;
}

.confirm-content {
    font-size: 14px;
    text-align: center;
}
.time-group {
    margin: 20px auto 0;
    padding: 0;
    width: 400px;
}
.time-group > li {
    float: left;
    font-size: 20px;
    list-style: outside none none;
    margin-bottom: 10px;
    margin-right: 10px;
    width: 190px;
}
.modal-stitle {
    font-size: 16px;
    font-style: italic;
    text-align: center;
}
.reg-submit.time-submit {
    width: auto;
}
.stmodal .modal-dialog{
    width: 540px;
}
.stmodal .modal-content {
    background: url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/book.png") no-repeat scroll right bottom #f0ebdf;
    border-radius: 0;
}
.stmodal .modal-header{
    border-bottom: none;
}
.stmodal .modal-title {
    color: #ff3c00;
    font-size: 21px;
}
.stmodal .control-group label {
    color: #ff6000;
    font-size: 18px;
    min-width: 170px;
    margin-left: 20px;
}
.stmodal .control-group textarea,
.stmodal .control-group input[type="text"],
.stmodal .control-group input[type="email"]
{
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #ff6000;
    width: 295px;
}
.stmodal .register-issues {
    display: block;
    margin-top: -20px;
}
.stmodal .register-issues .control-group{
    margin: 0 auto;
    width: 430px;
}
.stmodal .register-issues .control-group label{
    display: block;
    float: none;
    margin: 0;
}
.stmodal .register-issues .control-group textarea,
.stmodal .register-issues .control-group input[type="text"],
.stmodal .register-issues .control-group input[type="email"] {
    display: block;
    width: 430px;
}
.stmodal .reg-submit {
    background: none repeat scroll 0 0 #31a9a3;
    border-radius: 0;
    font-weight: normal;
    height: 45px;
    margin: 20px 0px 10px 125px;
    width: 210px;
}
.modal-message{
    text-align: center;
}
.modal-ads{
    text-align: center;
    margin: 10px 0;
}
/* --------- Video modal --------- */
.videos.clearfix {
    margin: 0;
    padding: 0;
}
.video-item {
    float: left;
    list-style: outside none none;
    margin: 10px 5px;
    width: 279px;
}
.video-item:nth-child(3n+1){
    clear: both;
}
.video {
    display: block;
    position: relative;
}
.icon-play {
    display: none;
    color: #cc181e;
    font-size: 50px;
    height: 50px;
    left: 50%;
    margin: -25px 0 0 -25px;
    opacity: 0.63;
    position: absolute;
    top: 50%;
    width: 50px;
}
.video:hover .icon-play{
    display: block;
}
#colorbox{
    font-family: arial, sans-serif;
    font-size: 13px;
}
.main-help-wr {
    margin: 10px 0;
    text-align: center;
}
.main-help {
    background: url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/help.png") no-repeat scroll right 0 rgba(0, 0, 0, 0);
    color: #f0901d;
    display: inline-block;
    font-size: 22px;
    height: 70px;
    padding-right: 70px;
    padding-top: 40px;
}
.main-help:hover, .main-help:focus{
    color: #759c11;
    text-decoration: none;
}
.video-title {
    font-family: Tahoma,arial,sans-serif;
    font-size: 15px;
    font-weight: bold;
    margin: 15px 0 0;
    text-align: center;
}

/* -------- Button -------*/
#colorbox, #cboxOverlay, #cboxWrapper{
    z-index: 99999;
}
.modal{
    z-index: 9999999;
}
.help-fixed {
    bottom: 15px;
    display: block;
    position: fixed;
    right: 10px;
    z-index: 999999;
}
.bdfix {
    border: 2px solid;
    border-radius: 3px;
}
.help-fixed > span {
    background: none repeat scroll 0 0 #ff6065;
    border-radius: 10px;
    box-shadow: 0 9px 0 rgba(219, 31, 5, 1), 0 9px 25px rgba(0, 0, 0, 0.7);
    color: #fff;
    display: block;
    font-family: arial, sans-serif;
    font-size: 20px;
    font-weight: bold;
    padding: 10px;
    text-align: center;
    width: 200px;
}
.rediret-dat-cho {
    background: url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/dat-cho.png") no-repeat scroll center center rgba(0, 0, 0, 0);
    display: block;
    height: 304px;
    text-indent: -999em;
}
/* ----------- Footer -----------*/
#footer {
    background: #2a2a2a none repeat scroll 0 0;
    color: #fff;
    margin: 0;
    padding: 0;
}
.copyright {
    font-size: 14px;
    font-weight: 500;
    line-height: 60px;
    padding: 5px 20px;
    text-align: center;
}

/* ------- Back top ------- */
#back-top-wrapper {
    bottom: 200px;
    overflow: hidden;
    position: fixed;
    right: 20px;
    visibility: hidden;
    z-index: 99;
}
#back-top {
    background: none repeat scroll 0 0 #fff;
    border: 2px solid #ff797e;
    cursor: pointer;
    height: 48px;
    margin: 0;
    transition: background 0.5s ease 0s, border-color 0.5s ease 0s;
    width: 48px;
}
#back-top:hover {
    background: none repeat scroll 0 0 #ff797e;
    border-color: #ff797e;
}
#back-top span {
    background: url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/sprite/icons.png") no-repeat scroll -158px 0 rgba(0, 0, 0, 0);
    display: block;
    height: 15px;
    margin: 16px auto;
    width: 24px;
}
#back-top:hover span {
    background-position: -158px -22px;
}
@-webkit-keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.3);
        transform: scale(.3);
        visibility: visible;
    }
    50% {
        opacity: 1;
        -webkit-transform: scale(1.05);
        transform: scale(1.05);
    }
    70% {
        -webkit-transform: scale(.9);
        transform: scale(.9);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
        visibility: visible;
    }
}
@keyframes bounceIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.3);
        -ms-transform: scale(.3);
        transform: scale(.3);
        visibility: visible;
    }
    50% {
        opacity: 1;
        -webkit-transform: scale(1.05);
        -ms-transform: scale(1.05);
        transform: scale(1.05);
    }
    70% {
        -webkit-transform: scale(.9);
        -ms-transform: scale(.9);
        transform: scale(.9);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        visibility: visible;
    }
}
.bounceIn {
    -webkit-animation: bounceIn .40s linear forwards;
    -o-animation: bounceIn .40s linear forwards;
    animation: bounceIn .40s linear forwards;
}
@-webkit-keyframes bounceOut {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    25% {
        -webkit-transform: scale(.95);
        transform: scale(.95);
    }
    50% {
        opacity: 1;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(.3);
        transform: scale(.3);
        visibility: hidden;
    }
}
@-o-keyframes bounceOut {
    0% {
        -o-transform: scale(1);
        transform: scale(1);
    }
    25% {
        -o-transform: scale(.95);
        transform: scale(.95);
    }
    50% {
        opacity: 1;
        -o-transform: scale(1.1);
        transform: scale(1.1);
    }
    100% {
        opacity: 0;
        -o-transform: scale(.3);
        transform: scale(.3);
        visibility: hidden;
    }
}
@keyframes bounceOut {
    0% {
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
    }
    25% {
        -webkit-transform: scale(.95);
        -ms-transform: scale(.95);
        transform: scale(.95);
    }
    50% {
        opacity: 1;
        -webkit-transform: scale(1.1);
        -ms-transform: scale(1.1);
        transform: scale(1.1);
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(.3);
        -ms-transform: scale(.3);
        transform: scale(.3);
        visibility: hidden;
    }
}
.bounceOut {
    visibility: visible;
    -webkit-animation: bounceOut .40s linear forwards;
    -o-animation: bounceOut .40s linear forwards;
    animation: bounceOut .40s linear forwards;
}

/* -------- Đặt chỗ banner ------- */
#dat-cho {
    background: none repeat scroll 0 0 #fff;
    text-align: center;
}
/* -------  Popup left ------*/
.popup-left {
    bottom: 40px;
    left: 0;
    position: fixed;
    z-index: 9;
}
.main-button-wrapper {
    display: none;
    background: none repeat scroll 0 0 #f4a134;
    clear: both;
    float: left;
    height: 63px;
    margin-top: 8px;
    padding: 3px;
}
.main-button {
    border: 1px dashed #fff;
    color: #fff;
    display: table;
    font-size: 19px;
    height: 57px;
    padding: 0 5px;
    text-transform: uppercase;
}
.main-button span{
    display: table-cell;
    vertical-align: middle;
}
a.main-button:hover, a.main-button:focus {
    text-decoration: none;
}
.main-button.download-bt {
    background: url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/download-icon.png") no-repeat scroll 12px center rgba(0, 0, 0, 0);
    margin-left: 20px;
    padding-left: 55px;
    width: 250px;
}
.main-button.test-bt {
    background: url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/ttts-icon.png") no-repeat scroll 14px center rgba(0, 0, 0, 0);
    margin-left: 20px;
    padding-left: 70px;
    padding-right: 50px;
    width: 250px;
}
/* ---------- Social --------- */
.social-link {
    float: right;
    padding: 20px 0 0 0;
    text-align: right;
}
.social-wr {
    text-align: right;
}
.social-wr .fb-like, .social-wr .gp-like {
    display: inline-block;
    height: 20px;
    overflow-y: hidden;
}
.social-box-wr {
    position: fixed;
    right: 10px;
    top: 110px;
}
.social-box-wr .fb-like, .social-box-wr .gp-like{
    margin-bottom: 10px;
}
#videosModal {
    z-index: 9999;
}

.social-link .account {
    display: inline-block;
    margin-right: 10px;

}

.social-link .account a {
    color: #000000;
}
.social-link .account a:hover {
    color: #dcdcdc;
}

/* ----------- Đặt chỗ ------------ */
#reserve {
    padding: 10px 0;
    position: relative;
}
#reserve .wrapper {
    background: rgba(0, 0, 0, 0) url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images3/bgdc.jpg") no-repeat scroll center 0;
    border-radius: 8px;
    height: 840px;
    padding: 0 70px;
    color: #fff;
}
.reserve-title {
    font-size: 36px;
    font-weight: 500;
    margin: 20px 0 40px;
    text-align: center;
}
.reserve-title > span {
    border-bottom: 1px solid;
}
.reserve-des {
    font-size: 26px;
    margin: 20px 0;
    text-align: center;
}
.cta {
    background: #1f405e none repeat scroll 0 0;
    box-shadow: 0 3px 38px 0 rgba(0, 0, 0, 0.5) inset;
    padding: 20px 15px;
}
.cta-box {
    background: rgba(0, 0, 0, 0) url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images3/cta.png?v=2") no-repeat scroll right 0;
    height: 265px;
    padding: 60px 30px 30px 426px;
}
.numdown {
    color: #fff;
    font-size: 19px;
    left: 50%;
    padding: 15px 0 0 28px;
    top: 380px;
}
.numdown > span {
    display: inline-block;
    float: left;
    line-height: 30px;
}
.numdown > span:nth-child(2) {
    font-size: 62px;
    font-weight: 300;
    line-height: 62px;
    padding: 0;
}
.numdown > span:nth-child(1) {
    font-weight: 500;
    padding: 15px 0;
    width: 185px;
}
.reserve-now {
    background: #f26522 none repeat scroll 0 0;
    border-radius: 10px;
    box-shadow: 0 11px 0 #d15317;
    color: #fff;
    display: block;
    font-size: 28px;
    height: 80px;
    left: 50%;
    line-height: 80px;
    margin-left: -190px;
    padding: 0;
    text-align: center;
    text-transform: uppercase;
    top: 450px;
    width: 275px;
}
.clockdown {
    left: 50%;
    padding: 0 0 0 5px;
    top: 295px;
    z-index: 3;
}
.clockdownTitle {
    color: #de3c0d;
    float: left;
    font-size: 30px;
    font-weight: bold;
    height: 53px;
    line-height: 53px;
    padding: 0 15px;
    text-align: center;
    text-transform: uppercase;
}
.count-down.hasCountdown {
    border: medium none;
    float: left;
    background: #285b94;
    background: -moz-linear-gradient(top,  rgba(121,153,242,1) 0%, rgba(40,91,148,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(121,153,242,1)), color-stop(100%,rgba(40,91,148,1)));
    background: -webkit-linear-gradient(top,  rgba(121,153,242,1) 0%,rgba(40,91,148,1) 100%);
    background: -o-linear-gradient(top,  rgba(121,153,242,1) 0%,rgba(40,91,148,1) 100%);
    background: -ms-linear-gradient(top,  rgba(121,153,242,1) 0%,rgba(40,91,148,1) 100%);
    background: linear-gradient(to bottom,  rgba(121,153,242,1) 0%,rgba(40,91,148,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7999f2', endColorstr='#285b94',GradientType=0 );
}
.count-down::after {
    clear: both;
    content: "";
    display: block;
    height: 0;
    overflow: hidden;
}
.cd-section {
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    margin: 0 2px;
    padding: 0 15px;
}
.cd-section .cd-number {
    background: transparent none repeat scroll 0 0;
    color: #f9ff5e;
    display: inline-block;
    font-size: 38px;
    font-weight: 700;
    height: 53px;
    line-height: 53px;
    margin: 0;
    position: relative;
}
.countdown_holding span {
    color: #fff;
}

#reserve .next-bt-wr {
    margin: 20px 0 30px;
}

/* -------- Video học thử --------- */
.mt-tabs-wr{
    margin: 15px 0 0;
    text-align: center;
}
.mt-tabs {
    display: inline-block;
    margin: 0 auto;
    padding: 0;
}
.mt-tabs > li {
    float: left;
    list-style: outside none none;
    margin: 5px 2px;
    text-align: center;
    width: 120px;
}
.mt-tabs > li a {
    border: 1px solid #188dbf;
    border-radius: 8px;
    color: #0565ab;
    display: block;
    font-size: 18px;
    font-weight: 300;
    height: 34px;
    line-height: 32px;
    transition: all 100ms ease 0s;
}
.mt-tabs > li.active a, .mt-tabs > li a:hover, .mt-tabs > li a:focus{
    background: #0565ab none repeat scroll 0 0;
    color: #fff;
}
.popup-bottom-left {
    display: none;
    bottom: 0;
    left: 50%;
    margin-left: -350px;
    position: fixed;
    z-index: 999;
}
.close-popup {
    background: #ccc none repeat scroll 0 0;
    color: red;
    cursor: pointer;
    font-size: 20px;
    height: 30px;
    line-height: 25px;
    position: absolute;
    right: 0;
    text-align: center;
    width: 30px;
    top:0;
}

.hl-bt-act {
    bottom: 30px;
    left: 0;
    position: fixed;
    width: 330px;
    z-index: 99;
}
.rank-go-bt {
    background: rgba(0, 0, 0, 0) url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/dat-cho-pen-c.gif") no-repeat scroll left 0;
    color: #fff;
    display: block;
    font-size: 26px;
    height: 38px;
    line-height: 38px;
    margin-bottom: 5px;
    padding-left: 30px;
    text-align: left;
    text-indent: -999em;
    text-transform: uppercase;
    width: 206px;
}
.test-go-bt {
    background: rgba(0, 0, 0, 0) url("/luyen-thi-quoc-gia/luyen-thi-pen-c/images/tim-hieu-dat-cho-pen-c.gif") no-repeat scroll left 0;
    color: #fff;
    display: block;
    font-size: 22px;
    height: 43px;
    line-height: 43px;
    padding-left: 30px;
    text-align: left;
    text-indent: -999em;
    text-transform: uppercase;
    width: 254px;
}

#comments {
    padding: 0 70px;
}
#comment-box {
    background: #fff none repeat scroll 0 0;
    margin: 20px auto;
    padding: 20px;
    width: 1024px;
}

.button {
    display: inline-block;
    vertical-align: top;
    position: relative;
    overflow: hidden;
    min-width: 96px;
    line-height: 46px;
    padding: 0 24px;
    font-size: 14px;
    color: white;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px #154c86;
    background-color: #247edd;
    background-clip: padding-box;
    border: 1px solid;
    border-color: #1c65b2 #18589c #18589c;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), 0 1px 2px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), 0 1px 2px rgba(0, 0, 0, 0.2);
    background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
    background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
    background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
}
.button:before {
    content: '';
    position: absolute;
    top: -25%;
    bottom: -25%;
    left: -20%;
    right: -20%;
    border-radius: 50%;
    background: transparent;
    -webkit-box-shadow: inset 0 0 38px rgba(255, 255, 255, 0.5);
    box-shadow: inset 0 0 38px rgba(255, 255, 255, 0.5);
}
.button:hover, .button:focus {
    background-color: #1a74d3;
    color: #fff;
}
.button:active {
    color: rgba(255, 255, 255, 0.9);
    text-shadow: 0 -1px #154c86;
    background: #1f71c8;
    color: #fff;
    border-color: #113f70 #154c86 #1c65b2;
    -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.4);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.4);
    background-image: -webkit-linear-gradient(top, #1a5da5, #3a8be0);
    background-image: -moz-linear-gradient(top, #1a5da5, #3a8be0);
    background-image: -o-linear-gradient(top, #1a5da5, #3a8be0);
    background-image: linear-gradient(to bottom, #1a5da5, #3a8be0);
}
.button:active:before {
    top: -50%;
    bottom: -125%;
    left: -15%;
    right: -15%;
    -webkit-box-shadow: inset 0 0 96px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 0 96px rgba(0, 0, 0, 0.2);
}

.button-green {
    text-shadow: 0 1px #0d4d09;
    background-color: #1ca913;
    border-color: #147b0e #11640b #11640b;
}
.button-green:hover, .button-green:focus {
    background-color: #159b0d;
    color: #fff;
}
.button-green:active {
    text-shadow: 0 -1px #0d4d09;
    background: #189210;
    color: #fff;
    border-color: #093606 #0d4d09 #147b0e;
    background-image: -webkit-linear-gradient(top, #126d0c, #20c016);
    background-image: -moz-linear-gradient(top, #126d0c, #20c016);
    background-image: -o-linear-gradient(top, #126d0c, #20c016);
    background-image: linear-gradient(to bottom, #126d0c, #20c016);
}
.red{
    color: #ff0000;
}
.button-red {
    text-shadow: 0 1px #72100d;
    background-color: #cd1d18;
    border-color: #9f1713 #891310 #891310;
}
.button-red:hover, .button-red:focus {
    background-color: #c01511;
    color: #fff;
}
.button-red:active {
    text-shadow: 0 -1px #72100d;
    background: #b61a15;
    color: #fff;
    border-color: #5b0d0b #72100d #9f1713;
    background-image: -webkit-linear-gradient(top, #921511, #e4201b);
    background-image: -moz-linear-gradient(top, #921511, #e4201b);
    background-image: -o-linear-gradient(top, #921511, #e4201b);
    background-image: linear-gradient(to bottom, #921511, #e4201b);
}

.modal-body p{
    margin: 10px 0;
}
.login-box-left {
    margin: auto;
    width: 185px;
}
.edit-login {
    display: inline-block;
    font-size: 16px;
    margin: 0;
    padding: 5px 10px;
    width: 100%;
}
.btn-login {
    background: none repeat scroll 0 0 #fe4e00;
    border: medium none;
    display: inline-block;
    font-size: 16px;
    margin: 0;
    padding: 5px 10px;
}

.login-element-wr {
    margin-bottom: 10px;
}
.social-login {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.social-login > li {
    margin-bottom: 5px;
}

.social-login a {
    display: block;
}

.direct-login {
    text-align: center;
    display: block;
}
.login-box-right {
    width: 100%;
    text-align: center;
}
.lbt {
    margin: 0 0 10px;
}
/* ----------- Quy trình ----------- */
.bt {
    background-color: #bb4407;
    background-image: url("/su-kien/dat-cho-pen-c/images2/btbg.png");
    background-repeat: repeat-x;
    border-radius: 15px;
    box-shadow: 2px 3px 3px 0 rgba(0, 0, 0, 0.75);
    color: #fff;
    display: inline-block;
}
.p-box {
    border: 4px solid #0361af;
    border-radius: 15px;
    margin: 20px auto;
    padding: 20px 15px 15px;
    width: 860px;
}
.p-title {
    color: #23649b;
    font-size: 47px;
    font-style: italic;
    margin: 0 0 20px;
    text-align: center;
}
.steps {
    background: #23649b url("/su-kien/dat-cho-pen-c/images3/quy-trinh.png") no-repeat scroll center 20px;
    border-radius: 12px;
    color: #fff;
    list-style: outside none none;
    margin: 0;
    padding: 200px 0 0;
}
.steps > li {
    float: left;
    list-style: outside none none;
    margin: 0 20px;
    width: 234px;
}
.step-title {
    font-size: 16px;
    margin: 5px 0 20px;
    text-align: center;
}
.step-des {
    border: 1px dotted #fff;
    border-radius: 15px;
    font-size: 16px;
    height: 115px;
    margin: 20px 0;
    padding: 15px;
}
.action-bt {
    background-position: 0 -205px;
    border-radius: 12px;
    font-size: 18px;
    height: 35px;
    line-height: 35px;
    margin: 0 0 20px;
    padding: 0 30px;
    text-transform: uppercase;
}
.num-reserved-2 {
    background: transparent url("/su-kien/dat-cho-pen-c/images2/clock2-bg.png") no-repeat scroll center center;
    color: #fe4304;
    font-size: 50px;
    font-weight: bold;
    height: 164px;
    line-height: 52px;
    margin: -25px auto 0;
    padding: 56px 355px 56px 60px;
    text-align: center;
    width: 683px;
}

/* --------- Cal table ---------- */
.cal-block .table{
    margin: 0;
}
.table.package-table-header tr:nth-child(2n+1) {
    background: #e1e0e0 none repeat scroll 0 0;
}
.table.package-table-header tr:nth-child(2n) {
    background: #eee none repeat scroll 0 0;
}
.package-table-header tr>td:nth-child(1), .packages-table  tr>td:nth-child(1){
    padding-left: 25px;
    width: 450px;
}
.package-table-header tr>td:nth-child(2), .packages-table  tr>td:nth-child(2),
.package-table-header tr>td:nth-child(3), .packages-table  tr>td:nth-child(3){
    width: 150px;
}
.package-table-header tr>td:nth-child(2), .package-table-header tr>td:nth-child(3),
.package-table-header tr>td:nth-child(4), .packages-table tr>td:nth-child(4){
    text-align: center;
}
.package-table-header tr>td:nth-child(4){
    padding-right: 30px;
}
.packages-table tr:nth-child(2n) {
    background: #ededed none repeat scroll 0 0;
}
.package-box {
    height: 195px;
    overflow-y: scroll;
}
.package-fee, .package-new-fee {
    display: block;
    padding-right: 35px;
    text-align: right;
}
.package-name, .package-fee{
    color: #0063b5;
}
.package-new-fee{
    color: #ff0000;
}
.total-fee.package-fee {
    color: #fa6666;
    text-decoration: line-through;
}
.total-label {
    color: #023b6a;
}
.bkw {
    padding: 10px 5px;
}
.bkw #banking {
    float: left;
    margin: 1px 7px 0 0;
}
.banking-label {
    color: #023b6a;
    cursor: pointer;
    float: left;
    font-weight: normal;
    margin: 0;
    width: 580px;
}
.banking-label > span {
    color: #ff0000;
    font-weight: bold;
}
.cal-list {
    color: #003764;
    padding-left: 20px;
}
.cal-list > li {
    padding-left: 5px;
}
.real-money-label {
    display: inline-block;
    width: 525px;
}
.real-money{
    display: inline-block;
    color: #ff0000;
    font-weight: bold;
    text-align: right;
    width: 150px;
}
.cal-reserve-now {
    font-size: 16px;
    height: 36px;
    line-height: 36px;
    margin: -10px 0 0 20px;
    padding: 0 20px;
}
#xem-hoc-phi .modal-dialog{
    margin: 0 auto;
}

.ui-autocomplete {
    z-index: 10000000000;
    max-height: 160px;
    overflow-y: scroll;
    font-family: Roboto, Tahoma, arial, sans-serif;
    font-size: 14px;
    line-height: 1.25;
    color: #000;
}

.ui-autocomplete li a {
    border-radius: 0;
    -webkit-border-radius: 0px;
}
.custom-combobox-input {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #ff6000;
    width: 295px;
    height: 36px;
    padding: 5px 25px 5px 10px;
    font-family: Roboto, Tahoma, arial, sans-serif;
    font-size: 14px;
    line-height: 1.25;
    color: #000;
}

.custom-combobox {
    position: relative;
}

.custom-combobox .custom-combobox-toggle {
    position: absolute;
    top: 10px;
    right: 0px;
    border-radius: 0px;
    border: none;
    width: 20px;
    height: 34px;
    color: #ff6000;
}
.count-down-course-2 {
    border: none;
    background-color: transparent;
    display: inline-block;
}

.count-down-course-2 .c-section .date .c-number {
    font-size: 50px;
    color: #ff6000;
    font-weight: 900;
}

.count-down-course-2 .c-section {
    background: transparent;
    text-align: center;
    padding: 4px 10px;
    border: dashed 2px #ff6000;
    border-radius: 5px;
}

.count-down-course-2 .c-section .separator {
    vertical-align: top;
    font-size: 35px;
    color: #ff6000;
}

.count-down-course-2 .c-section .date p {
    font-size: 20px;
    margin: 0;
}

.p-content .p-selling .box-count-time {
    display: inline-block;
    vertical-align: middle;
    margin-left: 20px;
}

.count-down-course-2 {
    border: none;
    background-color: transparent;
    display: inline-block;
}

.count-down-course-2 .c-section .date .c-number {
    font-size: 40px;
    color: #ff6000;
    font-weight: 900;
}

.count-down-course-2 .c-section {
    background: transparent;
    text-align: center;
    padding: 4px 10px;
    border: dashed 2px #ff6000;
    border-radius: 5px;
}


.count-down-course-2 .c-section .date p {
    font-size: 15px;
    margin: 0;
}

.p-content .p-selling .box-count-time {
    display: inline-block;
    vertical-align: middle;
    margin-left: 20px;
}

#banner-x {
    position: fixed;
    top: 180px;
    left: 0;
    z-index: 1000000000000;

}

#loginModal .modal-body {
    padding: 15px 15px 20px 15px;
}

/*--------- Custom style --------*/

#listFreeCourse .modal-body {
    padding: 20px;
    background: #2a70b8 none repeat scroll 0 0;
}

#listFreeCourse .modal-body .list-container {
    background: white none repeat scroll 0 0;
    border: 2px dashed #ccc;
    padding: 20px 20px 45px 20px;
}

#listFreeCourse .modal-body .close {
    margin-top: -20px;
    margin-right: -15px;
}

#listFreeCourse .modal-header {
    padding: 0;
    height: 0;
    margin: 0;
    min-height: 0;
    border: none;
}

#listFreeCourse .modal-body-title {
    font-size: 50px;
    font-weight: 300;
    text-align: center;
    color: #2a70b8;
}

#listFreeCourse .modal-body .registed-courses .title{
    font-size: 24px;
    margin: 10px 0;
    color: #2a70b8;
    font-weight: 600;
}

#listFreeCourse .tbl-courses {
    width: 100%;
    font-size: 18px;
    text-align: center;

}

#listFreeCourse .tbl-courses thead tr {
    height: 50px;
    background-color: #e1e1e1;
}

#listFreeCourse .tbl-courses thead th,
#listFreeCourse .tbl-courses tbody td {
    border-right: 2px solid white;
    text-align: center;
}

#listFreeCourse .tbl-courses tbody td span {
    color: #ffa200;
}

#listFreeCourse .tbl-courses tbody tr {
    height: 50px;
}

#listFreeCourse .tbl-courses tbody tr:nth-child(even) {
    background-color: #ececec;
}

#listFreeCourse .btn-fl.extent-trial {
    -webkit-box-shadow: 0px 2px 0px #fb7b7b;
    -moz-box-shadow: 0px 2px 0px #fb7b7b;
    box-shadow: 0px 2px 0px #fb7b7b;
    background: #ca0606;
}

#listFreeCourse .btn-fl.extent-trial:hover {
    background: #ca0606;
}

#listFreeCourse .btn-fl.buy {
    -webkit-box-shadow: 0px 2px 0px #286090;
    -moz-box-shadow: 0px 2px 0px #286090;
    box-shadow: 0px 2px 0px #286090;
    background: #2a70b8;
}

#listFreeCourse .btn-fl.buy:hover {
    background: #2a70b8;
}

#listFreeCourse .btn-fl {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0px 2px 0px #bb7700;
    -moz-box-shadow: 0px 2px 0px #bb7700;
    box-shadow: 0px 2px 0px #bb7700;
    color: #ffffff;
    font-size: 18px;
    background: #ffa200;
    padding: 3px 12px 3px 12px;
    margin: 0 25px;
    text-decoration: none;
    min-width: 100px;
}

#listFreeCourse .btn-fl:hover {
    background: #ffa200;
    text-decoration: none;
}

#listFreeCourse .modal-body .other-course .other-title {
    font-size: 24px;
    margin: 10px 0;
    color: #ffa200;
    font-weight: 600;
}

#listFreeCourse .nav-tabs {
    border: none;
    height: 50px;
}

#listFreeCourse .nav-tabs > li {
    width: 16.66%;
    border-right: 4px solid white;
    background-color: #e1e1e1;
    text-align: center;
    height: 50px;
    margin: 0;
}

#listFreeCourse .nav-tabs > li.active,
#listFreeCourse .nav-tabs > li:hover
{
    background-color: #ffa200;
}

#listFreeCourse .nav-tabs > li a {
    background-color: transparent;
    border: none;
    height: 50px;
    font-size: 18px;
    color: #555555;
    padding: 15px;
}

#listFreeCourse .list-head {
    margin-top: 30px;
    font-size: 18px;
    height: 25px;
    width: 100%;
}

#listFreeCourse .list-head .lh-name {
    min-width: 40%;
    display: inline-block;
}

#listFreeCourse .list-head .lh-action {
    display: inline-block;
    text-align: center;
    min-width: 10%;
}

#listFreeCourse .course-container {
    padding: 0;
    width: 100%;
    font-size: 18px;
    margin-top: 30px;
}

#listFreeCourse .course-container tr {
    height: 36px;
}

#listFreeCourse .course-container tr td {
    padding: 5px 0;
    font-size: 16px;
}

#listFreeCourse .course-container button {
    font-size: 16px;
}

#listFreeCourse .free-exercise {
    margin-top: 30px;
}

#listFreeCourse .fe-title {
    font-size: 24px;
    color: #2a70b8;
}

#listFreeCourse .fe-list {
    font-size: 18px;
    font-weight: 600;
    margin: 20px 0 15px 0;
}

#listFreeCourse .free-exercise table {
    list-style: none;
    padding: 0;
    width: 100%;
    margin-top: 30px;
}

#listFreeCourse .free-exercise table tr {
    width: 100%;
    font-size: 16px;
    height: 34px;
}

#listFreeCourse .free-exercise table a {
    width: 100%;
    display: block;
}

#listFreeCourse .free-exercise table a:hover,
#listFreeCourse .free-exercise table a:focus {
    text-decoration: none;
}

#listFreeCourse .free-exercise table .download {
    color: red;
}

#listFreeCourse .exercise {
    padding-top: 30px;
    border-top: 1px solid #ddd;
    margin-top: 70px;
}

#listFreeCourse .info {
    color: red;
    padding-top: 10px;
}

#listFreeCourse .course-container tbody tr:nth-child(even){
    background-color: #ececec;
}

.count-course {
    cursor: pointer;
    height: 29px;
    width: 29px;
    background-color: #2b6fb8;
    position: relative;
    border-radius: 5px;
    padding: 5px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
    margin-right: 10px;
}

.count-course .count {
    position: absolute;
    color: white;
    background-color: red;
    border-radius: 3px;
    padding: 0px 4px;
    top: -4px;
    right: -4px;
    font-size: 11px;
}

.login {
    display: inline-block;
    margin-right: 10px;
}

.login a {
    color: white;
    font-size: 16px;
}