* { 
	font-size: 13px; 
}

*:not(.fa):not(.glyphicon) { 
	font-family:"Segoe UI", Helvetica, sans-serif;  
}

html[data-font="helvetica"] *:not(.fa):not(.glyphicon) {
	font-family: Helvetica;
}
html[data-font="segoe-ui"] *:not(.fa):not(.glyphicon) {
	font-family: "Segoe UI";
}
html[data-font="sans-serif"] *:not(.fa):not(.glyphicon) {
	font-family: sans-serif;
}
html[data-font="tahoma"] *:not(.fa):not(.glyphicon) {
	font-family: tahoma;
}
html[data-font="time-new-roman"] *:not(.fa):not(.glyphicon) {
	font-family: "Time New Roman";
}

html[data-size="xs"] * {
	font-size: 8px;
}
html[data-size="sm"] * {
	font-size: 13px;
}
html[data-size="md"] * {
	font-size: 16px;
}
html[data-size="lg"] * {
	font-size: 24px;
}

body { background: #e8ebf1; }
.navbar-toggle {border-radius: 0;}
.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th { padding: 8px; line-height: 1.42857143; vertical-align: middle; border: 1px solid #ddd; }
.navbar.navbar-fixed-top { /*top: 28px;*/ background-color: #003466; /*border-top: 1px solid #94cfcb; border-bottom: 1px solid #94cfcb;*/ background-image: none; box-shadow: none; }
.navbar-default .navbar-nav > li > a { color: #fff; text-transform: uppercase; }
.viettel-logo { margin-top: -5px; }
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .open > a { background-image: none; }
    .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover,
    .navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover,
    .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav > .open > a:hover { color: #fff; background-color: #0072BB; }
.togmb { margin-right: 15px; }
.menuct { }
.navbar-brand, .navbar-nav > li > a { text-shadow: none; }
.navbar-brand { width: auto; }
.navbar .label-username { text-transform: initial; }
.navbar .user-avatar { display: -webkit-inline-box; width: 35px; border-radius: 50%; border: 2px solid #FFF; border-width: 2px !important; }
.navbar .user-login-info { padding: 8px 7px 7px 7px !important; }
.navbar .mail-icon { padding: 15px 7px 9px 7px !important; }
.navbar .mail-icon .glyphicon { font-size: 20px; }
.navbar .label-username {
    text-transform: initial;
    max-width: 150px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: -5px;
}
#dnn_contentPane.DNNEmptyPane { display: none; }
#dnn_contentPane { min-height: 50%; background-color: #FFF; border: 1px solid #CCC; }
a { color: #333; text-decoration: none; }
    a:hover { color: #0072BB; text-decoration: none; }
.block-title .fa { color: #0072BB; margin-right: 10px; }
.block-title span { color: #0072BB; font-weight: bold; }
.block-title { margin-bottom: 15px; }
table.course-table { border-collapse: collapse; width: 100%; border: 1px solid #CCC; }
    table.course-table td { padding: 10px 15px; }
    table.course-table tr.table-header { background: #fafafa; text-align: center; font-weight: bold; color: #000; }
    table.course-table td a { color: #000; }
    table.course-table tr:not(.table-header):hover { background: #E8EBF2; }
.progress { border-radius: 0; box-shadow: none; background-image: none; background: #CFCFCF; height: 15px; margin-bottom: 0; }
.progress-bar { line-height: 16px; }
.btn-primary { background: #003466; color: #fff !important; border: 0; }
    .btn-primary:focus, .btn-primary:hover { background-color: #0072BB; }
.btn-default { color: #333; background: #E6E6E6; border-color: #ADADAD; }
.btn-disable { pointer-events: none; background: #E6E6E6; color: #333; border-color: #ADADAD; }
.alert-password { display: none; }
.row-item:nth-child(2) { margin-left: 30px; }
.block-row .row-item { display: inline-block; }
    .block-row .row-item .fa { color: #0A89AD; margin-right: 5px; }

.hotboy-tab .tab-item { display: inline-block; height: 30px; font-weight: bold; padding: 0 30px; line-height: 30px; position: relative; cursor: pointer; }
    .hotboy-tab .tab-item.tab-active { background: #D58432; color: #FFF; }
        .hotboy-tab .tab-item.tab-active:after { position: absolute; width: 5px; height: 5px; bottom: 8px; margin: auto; left: 0; right: 0; font-family: 'Glyphicons Halflings'; content: "\e252"; color: #D58432; font-size: 10px; }
.block-content .tab-content { visibility: hidden; position: absolute; top: -999; }
    .block-content .tab-content.tab-active { position: relative; visibility: visible; top: 0; }
.test-soft-item { display: inline-block; margin: 30px; text-align: center; font-weight: bold; color: #000; text-decoration: none !important; cursor: pointer; }
.test-soft-name { margin-top: 15px; }
.test-soft-label { font-weight: bold; }
.vsContainerLeft > table:first-of-type { margin: 15px; }
.vsContainerLeft { height: 100%; }
.page-content { height: 100%; }
.left-menu-exam { padding: 15px; }
.exam-time { color: #028C87; text-align: center; margin-bottom: 15px; }
    .exam-time span:not(.haicham) { background: #028C87; color: #fff; margin: 1px; width: 30px; display: inline-block; font-size: 36px; line-height: 40px; height: 40px; padding: 0 5px; border-radius: 3px; }
    .exam-time span.haicham { font-size: 36px; line-height: 40px; height: 40px; padding: 0 1px; margin: 1px; width: 10px; display: inline-block; }
    .exam-time span.alert.haicham { color: red; }
    .exam-time span.alert:not(.haicham) { -webkit-animation: nhapnhay 0.5s infinite; -moz-animation: nhapnhay 0.5s infinite; -o-animation: nhapnhay 0.5s infinite; animation: nhapnhay 0.5s infinite; }
.Question * { font-weight: normal; }
.Question .Content input + label { margin-left: 5px; }
.Question .Content .question { border-bottom: 1px dashed #003466; margin-bottom: 15px; }
.Question .Header > span > span { font-weight: bold; }
.list-question-items > tbody > tr { border-bottom: 1px solid #003466; }
#Exam_Question .Question .Content { border: none; }
#Exam_Pagging { display: none; }
.mm, .ss { font-size: 13px; color: #000; display: inline-block; margin: 5px 30px; }
.hr { display: block; width: 100%; height: 1px; background-color: #CCC; }
#list-question-shortcut { margin: 15px 0; height: calc(100% - 200px); }
.scrollable .overview { width: 100%; }
.block-question-shortcut { display: inline-block; background-color: #888; margin: 5px; width: calc(100% / 6 - 10px); height: 30px; color: #FFF; font-size: 14px; text-align: center; line-height: 30px; cursor: pointer; }
.answered { background: #028C87; }
.marked { background: #E18C35; }
.defaulted { background: #888; }
div#shortcut-description { margin: 15px 0; }
    div#shortcut-description > .des-item > div { width: 25px; height: 25px; border-radius: 50%; display: inline-block; margin-bottom: -7px; }
    div#shortcut-description > .des-item { display: inline-block; margin: 0 5px 15px 0; }
.test-cmd { margin: auto; position: absolute; bottom: 0; left: 0; right: 0; padding: 5px 15px; }
.scrollable .scroll-bar.vertical .thumb { margin-left: 10px; }

@-webkit-keyframes nhapnhay {
    0% { background: #fafafa; }
    100% { background: red; }
}

@-moz-keyframes nhapnhay {
    0% { background: #fafafa; }
    100% { background: red; }
}

@-o-keyframes nhapnhay {
    0% { background: #fafafa; }
    100% { background: red; }
}

@keyframes nhapnhay {
    0% { background: #fafafa; }
    100% { background: red; }
}
/*** COLOR ***/
.blue-1 { color: #0072BB; }
.blue-2 { color: #0072BB; }
.blue-3 { color: #0072BB; }
.red { color: #fc5044; }
.orange { color: #e28e36; }
.green { color: #078b01; }

/*** BACKGROUND ***/
.bgblue-1 { background: #0072BB; }
.bgblue-2 { background: #0072BB; }
.bgblue-3 { background: #0072BB; }
.bgred { background: #fc5044; }
.bgorange { background: #e28e36; }
.bggreen { background: #d6f3f1; }
a.bgblue-1:hover { background: #003466; }

/*** FONT ***/
.f1d0 { font-size: 1em; }
.f1d1 { font-size: 1.1em; }
.f1d2 { font-size: 1.2em; }
.f1d3 { font-size: 1.3em; }
.f1d4 { font-size: 1.4em; }
.f1d5 { font-size: 1.5em; }
.f1d6 { font-size: 1.6em; }
.f1d7 { font-size: 1.7em; }
.f1d8 { font-size: 1.8em; }
.f1d9 { font-size: 1.9em; }

/**** PARAGRAP ****/
.h10px { height: 10px; }
.no-padding { padding: 0; }
.no-padding-left { padding-left: 0; }
.no-padding-right { padding-right: 0; }

/**** HEADER ****/
.tnheader .navbar-default .navbar-toggle { border: 0; }
.tnheader .navbar-toggle { background-color: transparent; border: 0; border-radius: 0; float: left; margin: 8px 0; padding: 5px; position: relative; }
.tnheader .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover { background: none; }
.tnheader .navbar-toggle .icon-bars { border-radius: 50%; display: block; height: 5px; width: 5px; }
.navbar-default .menuct { margin-top: 10px; }
.navbar-default .navbar-toggle .icon-bar { background: #fff; height: 3px; }
.navbar-toggle .icon-bar + .icon-bar { margin-top: 6px; }
.navbar-default .navbar-toggle .icon-bars { background: #fff; }
.navbar-toggle .icon-bars + .icon-bars { margin-top: 4px; }
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover { background-color: transparent; }

/******************* / MEDIA QUERY / **********************/
/****************** Created by: HUNGPV ********************/


/*** LARGE DESKTOP ****/
@media (min-width: 1200px) {
    #dnn_contentPane { padding: 15px; }
    #dnnBodyContent { padding-left: 30px; padding-right: 30px; padding-bottom: 30px; }
    .tn-userprofile .usernotify, .tn-userprofile .userinfo { padding: 15px; }
    .tn-login { padding: 50px 15px; }
        .tn-login .form-login { background: #fff; border: 1px solid #d5d5d5; padding: 30px; margin: 30px; }
    .hotboy-tab { background-color: #E8EBF2; padding: 0px 15px; width: calc(100% + 30px); margin: 15px -15px; }
}

/*** DESKTOP ****/
@media (max-width: 1200px) {
    #dnn_contentPane { padding: 15px; }
    #dnnBodyContent { padding-left: 30px; padding-right: 30px; padding-bottom: 30px; }
    .tn-userprofile .usernotify, .tn-userprofile .userinfo { padding: 15px; }
    .tn-login { padding: 50px 15px; }
        .tn-login .form-login { background: #fff; border: 1px solid #d5d5d5; padding: 30px; margin: 30px; }
    .hotboy-tab { background-color: #E8EBF2; padding: 0px 15px; width: calc(100% + 30px); margin: 15px -15px; }
}

/*** TABLET ****/
@media (max-width: 992px) {
    #dnn_contentPane { padding: 5px; }
    #dnnBodyContent { padding-left: 5px; padding-right: 5px; padding-bottom: 5px; }
    .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 { min-height: 1px; padding-left: 5px; padding-right: 5px; position: relative; }
    .tn-userprofile .usernotify, .tn-userprofile .userinfo { padding: 5px; }
    .tn-login { padding: 20px 0px; }
        .tn-login .form-login { background: #fff; border: 1px solid #d5d5d5; padding: 5px; margin: 0px; }
    .hotboy-tab { background-color: #E8EBF2; padding: 0px 15px; width: calc(100% + 10px); margin: 15px -5px; }
}


/*** MOBILE ****/
@media (max-width: 676px) {
    #dnn_contentPane { padding: 5px; }
    #dnnBodyContent { padding-left: 5px; padding-right: 5px; padding-bottom: 5px; }
    .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 { min-height: 1px; padding-left: 5px; padding-right: 5px; position: relative; }
    .tn-userprofile .usernotify, .tn-userprofile .userinfo { padding: 5px; }
    .tn-login { padding: 20px 0px; }
        .tn-login .form-login { background: #fff; border: 1px solid #d5d5d5; padding: 10px; margin: 0px; }
    .hotboy-tab { background-color: #E8EBF2; padding: 0px 15px; width: calc(100% + 10px); margin: 15px -5px; }
}
@media (min-width: 768px) and (max-width: 802px) {
	.nav>li>a {
		padding: 15px 10px;
	}
}

.flyer-header {
        padding: 5px 75px 5px 10px;
        font-weight: bold;
        color: #003466;
        position: relative;
        text-align: left;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }
    .flyer-header .flyer-command {
        position: absolute;
        right: 0;
        top: 0;
        color: #3E3E3E;
    }
    .flyer-header .fa {
        cursor: pointer;
        display: inline-block;
        border: 1px solid #ccc;
        height: 27px;
        width: 35px;
        line-height: 27px;
        text-align: center;
        border-top: 0;
        border-right: 0;
        border-bottom: 0;
    }
    .flyer-header .fa:hover {
        background: #ddd;
    }
    .flyer-content iframe {
        width: 100%;
        height: calc(100vh - 30px);
    }
    .flyer-header img {
        margin-top: -5px;
        margin-right: 10px;
    }
.main-content-player {
	position: relative;
	height: calc(100% - 50px);
	background-color: white;
}

.htmIFrame {
	height: calc(100vh - 90px) !important;
	width: 100% !important;
}

.player_full {
	cursor: pointer;
}

.fullscreen .block-title {
	padding: 0 20px 6px !important;
}
.fullscreen .htmIFrame {
	height: calc(100vh - 25px) !important;
	width: 100% !important;
}

/* override css by vucuongkg 7/10/2015 fix some UI error*/
.RadTreeView_Simple, .RadTreeView_Simple a.rtIn, .RadTreeView_Simple .rtEdit .rtIn input { color: #000; font: 13px/18px "Segoe UI", Helvetica,Arial,sans-serif; }
.navbar-collapse {
        max-height: calc(100% - 65px) !important;
    }
    .glyphicon.glyphicon-th.navbar-toggle {
        border: 1px solid #fff;
        color: #fff;
        font-size: 22px;
        height: 41px;
        width: 44px;
        line-height: 35px;
        padding: 0px 0px 0 2px;
    }
    @media (max-width: 500px) {
        .main {
            padding: 10px 0;
        }
    }
    @media (max-width: 767px) {
        .sidebar {
            display: block;
            position: fixed;
            top: 54px;
            right: -250px;
            z-index: 100;
            background-color: #fff;
            width: 250px;
            height: 100%;
            transition: right 0.5s ease;
            overflow:auto;
            max-height: 100vh;
        }

        .sidebar.shaw {
            right: 0;
            display: block;
        }
 
    }
.ModuleTitle_SubMenu {
            z-index: 999;
            border: 1px solid #ccc;
            background: #fff
        }
        img {
            max-width: 100%;
        }
.css-treeview li a, .css-treeview li span {
    margin-left: 5px;
    color: #000;
    display: inline-block;
    text-indent: 0;
    width: calc(100% - 10px);
}
.css-treeview label, .css-treeview a, .css-treeview label::before {
    vertical-align: top;
}
.css-treeview label::before {
	margin: 5px 3px 0 -10px;
	display: inline-block;
}
.css-treeview li.has-child label, .css-treeview li.no-child {
    width: 100%;
}
.android-webkit .css-treeview li a, .android-webkit .css-treeview li span {
    width: 95%;
}
.android-webkit .css-treeview input ~ ul {
	display: none
}
.android-webkit .css-treeview input:checked:not(:disabled) ~ ul {
	display: block
}
.android-webkit .flyer-content iframe  {
	height: 95%
}
.android-webkit .main-content-player {
	height: 90%
}
.safari-webkit {
    -webkit-overflow-scrolling: touch;
    -webkit-touch-callout: none;
}
@media (width: 768px) {
    .main {
        margin-left: 33%;
        width: 67%;
    }
}

#dnn_Header_pnNotLogin.navbar-right .dropdown-menu>li>a {
    padding: 3px 5px;
}
