@CHARSET "UTF-8";

/**
*	BODY
*/

body {
	overflow: scroll;
	background: #e2fcf8;
}

.lecture-region {
	background: #e2fcf8 !important;
}

/**
* 	HOME SLIDE
*/

.tv4 {
	background: url('../media/banner-moi-2.png') no-repeat;
    background-size: 100% auto;
}
.homepage-banner {
	background: url('../media/banner-moi-2.png') no-repeat;
    background-size: 100% auto;
	background-position: bottom;
}
.auto-height { 				height: 190px; }
@media (min-width: 480px) { .auto-height {
    height: 190px;
}}
@media (min-width: 768px) { .auto-height {
    height: 270px;
}}
@media (min-width: 992px) { .auto-height {
    height: 370px;
}}
@media (min-width: 1200px) { .auto-height {
    height: 575px;
}}

.auto-height-sub { 				height: 125px; }
@media (min-width: 480px) { .auto-height-sub {
    height: 125px;
}}
@media (min-width: 768px) { .auto-height-sub {
    height: 195px;
}}
@media (min-width: 992px) { .auto-height-sub {
    height: 260px;
}}
@media (min-width: 1200px) { .auto-height-sub {
    height: 375px;
}}

.auto-top { 				margin-top: 10px; }
@media (min-width: 480px) { .auto-top {
    margin-top: 70px;
}}
@media (min-width: 768px) { .auto-top {
    margin-top: 70px;
}}
@media (min-width: 992px) { .auto-top {
    margin-top: 100px;
}}
@media (min-width: 1200px) { .auto-top {
    margin-top: 190px;
}}

.auto-top-sub { 				margin-top: 10px; }
@media (min-width: 480px) { .auto-top-sub {
    margin-top: 0;
}}
@media (min-width: 768px) { .auto-top-sub {
    margin-top: 0;
}}
@media (min-width: 992px) { .auto-top-sub {
    margin-top: 0;
}}
@media (min-width: 1200px) { .auto-top-sub {
    margin-top: 0px;
}}

/**
*	MAIN MENU
*/
#mainMenu {
	width: 				100%;
	position:			relative;
	top: 				-30px;
	left: 				10px;
	z-index: 			1;
	background: 		url('../media/bg-menu.png');
	background-size: 	100% 100%;
}

@media (min-width: 768px) { #mainMenu {
    left: auto;
}}

#mainMenu li {
	text-align: 		center;
	color: 				#fff;
	font-weight:		bold;
}

#mainMenu li {
    width: 	33.33%;
	float:	left;
}

.nav>li>a:hover, .nav>li>a:focus {
	background: inherit;
	box-shadow:	0px 1px 5px;
}

@media (min-width: 480px) {
	#mainMenu li {
        width: 	16%;
	height: 70px;
    }
    #mainMenu {
        top: 0;
        left: 20px;
    }
}

@media (min-width: 768px) {
	#mainMenu li {
        width: 	14.2857%;
    }
}
@media (min-width: 992px) {
    #mainMenu li {
        width: 	14.2857%;
    }
}
@media (min-width: 1200px) {
    #mainMenu li {
        width: 	14.2857%;
    }
}

#mainMenu li a {
	color: 				#fff !important;
	border: 			1px solid;
	background:			#0C8FF1;
}




.lecture-section-heading {
	background: 		none;
	border-bottom:		2px solid #333;
}

.border-bottom {
	border-bottom: 2px solid darkblue;
}
/**
*	4 COLUMNS DETAIL LAYOUT
*/

.img-4-columns img {
	height: 160px;
}

.columns-4 .header, .columns-4 h2 {
	padding: 			5px;
	margin:				0;
	text-align:			center;
	color: 				#fff;
	font-size:			16px;
	font-weight:		bold;
}

.columns-4 a, .columns-4 p, .columns-4 span {
	color: 				#fff;
}

.columns-4 .layout-row {
	margin-top: 10px;
}

.columns-4 .column{
	width: 				22%;
	margin-right: 		4%;
	float: 				left;
	background:			#ca9fe4;
}

.columns-4-detail .column {
	background:			#ca9fe4;
}

.columns-4 .column h3 {
	font-size:			14px;
	font-weight:		bold;
	text-align:			center;
	margin: 			0;
	height:				40px;
	line-height:		40px;
}

.columns-4 .column .image img {
	width: 				100%;
	height: 			auto;
}

.columns-4-detail .column h3 {
	background: 		#9c74b4;
}

.columns-4 .column.last {
	margin-right: 		0%;
}

.columns-4 .lesson {
	padding: 			10px;
}

.columns-4 .separator {
	width: 				30%;
	height: 			3px;
	background: 		#fff;
	margin-left:		10px;
}

.columns-4 .lesson-detail {
	padding-left: 		5px;
	margin-top: 		10px;
}

.columns-4 .lesson-detail li {
	padding: 			5px;
	margin: 			0px;
	text-indent: 		0;
	list-style-type: 	none;
	
}

.columns-4 .lesson-detail li a {
	position: 			relative;
	left: 				-10px;
	
}

.columns-4 .lesson-detail li.course:before {
	content: 			"\e043";
    font-family: 		'Glyphicons Halflings';
    font-size: 			9px;
    position: 			relative;
    margin-right: 		10px;
    top: 				3px;
    color: 				#fff;
}

.columns-4 .lesson-detail li.practice:before {
	content: 			"\270f";
    font-family: 		'Glyphicons Halflings';
    font-size: 			9px;
    position: 			relative;
    margin-right: 		10px;
    top: 				3px;
    color: 				#fff;
}

/**
*	5 COLUMNS 2 ROWS LAYOUT
*/

.columns-5-rows-2 .header, .columns-5-rows-2 h2 {
	padding: 			5px;
	margin:				0;
	text-align:			center;
	color: 				#fff;
	font-size:			16px;
	font-weight:		bold;
}

.columns-5-rows-2 .layout-row {
	margin-top: 		10px;
}

.columns-5-rows-2 .column{
	width: 				16%;
	margin-right: 		5%;
	height: 			35px;
	float: 				left;
}

.columns-5-rows-2 .column.last {
	margin-right: 		0;
}

.columns-5-rows-2 h3, .columns-5-rows-2 a {
	color: 				#fff;
	text-decoration: 	none;
}

.columns-5-rows-2 .column h3 {
	font-size:			14px;
	font-weight:		bold;
	text-align:			center;
	margin: 			0;
	line-height:		35px;
}

/**
*	5 COLUMNS LAYOUT
*/

.img-5-columns img {
	margin: 0 auto;
	height: 95px;
}

.columns-5 .header, .columns-5 h2 {
	padding: 			5px;
	margin:				0;
	text-align:			center;
	color: 				#fff;
	font-size:			16px;
	font-weight:		bold;
}

.columns-5 .layout-row {
	margin-top: 		10px;
}

.columns-5 h3, .columns-5 a, .columns-5 span, .columns-5 p {
	color: 				#fff;
	text-decoration: 	none;
}

.columns-5 .column{
	width: 				16%;
	margin-right: 		5%;
	float: 				left;
}

.columns-5 .column.last {
	margin-right: 		0;
}

.columns-5 .column h3 {
	font-size:			14px;
	font-weight:		bold;
	text-align:			center;
	margin: 			0;
	line-height:		35px;
}

.columns-5 .column .image img {
	width: 				100%;
	height: 			auto;
}

/**
*	HOME
*/
.lesson-detail {
	padding: 0;
	margin: 10px;
	padding-bottom: 30px;
}
.lesson-detail li{
	list-style: none;
	padding: 0;
	margin: 0;
	margin-top: 10px;
}

.lesson {
	padding-top: 10px;
	color: #fff;
	padding-left: 10px;
}

.separator {
	background: #fff;
	width: 80px;
	height: 5px;
	margin: 10px;
	margin-bottom: 20px;
}

.carousel .col-sm-3 > div, .carousel .col-sm-15 > h3{
	border-collapse: separate;
	border-radius: 	2px;
	border: 3px solid #d399ff;
}

.carousel .col-sm-3 > div:hover, .carousel .col-sm-15 > h3:hover {
	box-shadow:		0px 1px 8px;
}

.carousel .col-sm-3 > div > .img-4-columns {
	border-collapse: separate;
	border-radius: 	5px 5px 0 0;
}

/**
*	LECTURE
*/



.lecture-page {
	/*background: 		url('../media/banner.jpg');*/
}


.lecture-region {
	position: 	relative;
	background: url('../media/background.png');
	top:		-30px;
}

.lecture-bird {
	background: 		url('../media/lecture-bird.png');
	width: 296px;
	height: 224px;
	position: absolute;
	top: 0;
	left: 0;
}

.lecture-bird-2 {
	background: 		url('../media/bird-2.png');
	width: 351px;
	height: 153px;
	position: absolute;
	top: 0;
	right: 0;
}

.columns-lecture {
	height:				580px;
}

.lecture-page h1 {
	font-family:		cursive;
	font-weight:		bold;
	color:				purple;
	margin-top:			30px;
	position: relative;
	top: 30px;
}
.lecture-detail h1 {
	position: initial;
}
.lecture-menu ul {
    list-style-type: 		none;
	list-style-position: 	outside;
	padding-left:			0;
}

@media (max-width: 480px) {
	.lecture-page h1 {
		top: 0;
	}
}

@media (min-width: 992px) { 
	.cau-tao-tu .lecture-menu ul {
		position: 				relative;
		top:					215px;
	}
	
	.tu-loai .lecture-menu ul {
		position: 				relative;
		top:					190px;
	}
	
	.chuyen-de-ve-cau .lecture-menu ul {
		position: 				relative;
		top:					265px;
	}
	
	.dau-cau .lecture-menu ul {
		position: 				relative;
		top:					155px;
	}
}

@media (min-width: 1200px) {
.cau-tao-tu .lecture-menu ul {
	position: 				relative;
	top:					225px;
}
.tu-loai .lecture-menu ul {
	position: 				relative;
	top:					210px;
}
.chuyen-de-ve-cau .lecture-menu ul {
	position: 				relative;
	top:					265px;
}
.dau-cau .lecture-menu ul {
	position: 				relative;
	top:					160px;
}
}

.lecture-menu ul li {
	background: 		#fff;
	margin-top:			10px;
	padding-top:		8px;
	padding-bottom:		8px;
	padding-left:		10px;
	position:			relative;
	border-radius:		5px;
	border: 			3px solid #debd00;
}

.lecture-menu ul li:hover {
	background: 		#debd00;
}

.lecture-menu ul li a {
	color: 				#333;
}

.lecture-menu ul li:before {
	content:			"";
	background:			url('../media/lecture-bullet-flower.png');
	display: 			inline-block;
	width:				61px;
	height:				61px;
	position: 			absolute;
	top:				-15px;
	left:				-35px;
}

.lecture-girl-cartoon {
	background:			url('../media/lecture-cartoon-girl.png') no-repeat;
	width:				215px;
	height:				108px;
	position:			absolute;
	bottom:				20px;
	left:				65px;
	background-size: 	80%;
}

.lecture-children-cartoon {
	background:			url('../media/children.png') no-repeat;
	width:				369px;
	height:				72px;
}

.lecture-kids-cartoon {
	background:			url('../media/kids.png') no-repeat;
	width:				528px;
	height:				135px;
}

.lecture-girl2-cartoon {
	background:			url('../media/girl2.png') no-repeat;
	width:				247px;
	height:				157px;
}

.lecture-index {
	
	width:				100%;
	height:				auto;
	position:			relative;
	margin-top:			30px;
}

.lecture-index h2 a {
	color:				#fff;
}

@media (min-width: 480px) { .lecture-index {
	background:			none;
}}

@media (min-width: 768px) { .lecture-index {
    height: 			580px;
	background: 		url('../media/book.png') no-repeat;
	background-size:	100% 100%;
	padding-top:		60px;
}

.luyen-tu-va-cau .lecture-index, .de-thi-tong-hop .lecture-index {
	height:					3063px;
	background: 		url('../media/luyentuvacau-background.png') no-repeat;
	background-size:	100% 100%;
	top:				-150px;
	padding-top: 		200px;
	position:			relative;
}

.cau-tao-tu .lecture-index {
    height: 				615px;
}
.tu-loai .lecture-index {
    height: 				570px;
}
.chuyen-de-ve-cau .lecture-index {
    height: 				770px;
}
.chuyen-de-ve-cau .lecture-girl-cartoon {
	right: 					65px;
	left: 					auto;
}
.dau-cau .lecture-index {
    height: 				460px;
}
.dau-cau .lecture-item {
	padding-bottom: 		50px;
}
.chinh-ta .lecture-index {
	height:					1217px;
	background: 		url('../media/book-chinhta.png') no-repeat;
	background-size:	100% 100%;
	top:				-120px;
	position:			relative;
}
.chinh-ta .lecture-girl-cartoon {
	right: 					65px;
	left: 					auto;
}
.tap-doc-hieu .lecture-index {
    height: 				820px;
	background:			url('../media/lecture-open-book-large-full.png') no-repeat;
	background-size:	100% 100%;
}

.tap-doc-hieu .lecture-index h2 {
	top: 90px;
}

.tap-doc-hieu .lecture-girl-cartoon {
	right: 					65px;
	left: 					auto;
}
/*
.de-thi-tong-hop .lecture-index {
	background:			url('../media/lecture-open-book-large-full.png') no-repeat;
	background-size:	100% 100%;
}*/
}
@media (min-width: 1200px) { .lecture-index {
	height:					625px;
}
.cau-tao-tu .lecture-index {
    height: 				595px;
}
.tu-loai .lecture-index {
    height: 				550px;
}
.chuyen-de-ve-cau .lecture-index {
    height: 				725px;
}
.chuyen-de-ve-cau .lecture-girl-cartoon {
	right: 					65px;
	left: 					auto;
}
.dau-cau .lecture-index {
    height: 				470px;
}
.dau-cau .lecture-item {
	padding-bottom: 		50px;
}

.chinh-ta .lecture-index {
    height: 				745px;
}

.chinh-ta .lecture-girl-cartoon {
	right: 					65px;
	left: 					auto;
}
.mo-rong-von-tu .lecture-index {
    height: 				595px;
	top:				-120px;
	position:			relative;
}

.mo-rong-von-tu .lecture-index h2 {
	top: 122px;
}

.tap-doc-hieu .lecture-index {
    height: 				830px;
}

.tap-doc-hieu .lecture-index h2 {
	top: 138px;
}

.tap-doc-hieu .lecture-title {
	height:					50px;
}

.tap-doc-hieu .lecture-girl-cartoon {
	right: 					65px;
	left: 					auto;
}
}


@media (min-width: 1200px) { .lecture-index {    
	height: 				2517px;
	background:				url('../media/book-chinhta.png');
	background-size:		100% 100%;
	background-repeat:		no-repeat;
	padding-top:			190px;
	top: 					-150px;
}
.tap-lam-van .lecture-index h2 {
	top: 42px;
}

.cau-tao-tu .lecture-index {
    height: 				600px;
}
.tu-loai .lecture-index {
    height: 				560px;
}
.chuyen-de-ve-cau .lecture-index {
    height: 				680px;
}

.chuyen-de-ve-cau .lecture-girl-cartoon {
	right: 					65px;
	left: 					auto;
}

.dau-cau .lecture-index {
    height: 				460px;
}
.dau-cau .lecture-item {
	padding-bottom: 		50px;
}
.chinh-ta .lecture-index h2 {
	top: 42px;
}
.chinh-ta .lecture-index {
    height: 				1217px;
	padding-top:			120px;
}

.chinh-ta .lecture-girl-cartoon {
	right: 					65px;
	left: 					auto;
}

.mo-rong-von-tu .lecture-index {
    height: 				2160px;
}

.tap-doc-hieu .lecture-index {
    height: 				2379px;
	background:				url('../media/book-chinhta.png');
	background-size:		100% 100%;
	background-repeat:		no-repeat;
}

.tap-doc-hieu .lecture-title {
	height:					50px;
}

.tap-doc-hieu .lecture-girl-cartoon {
	right: 					65px;
	left: 					auto;
}
}



.lecture-left, .lecture-right {
	float: 				left;
	width: 				100%;
	padding-left: 		10%;
	padding-top:		30px;
}

@media (min-width: 480px) { .lecture-left, .lecture-right {
    width: 				100%;
}}

@media (min-width: 768px) { .lecture-left, .lecture-right {
    width: 				50%;
}}

.lecture-right {
	padding-left:		8%;
}

.chinh-ta .lecture-right {
	padding-left: 		0;
}

.chinh-ta .left {
	width: 				45%;
}

.chinh-ta .right {
	width:				55%;
}

.lecture-index h2 {
	display: 			block;
    width: 				220px;
    color: 				#fff;
    padding: 			10px;
    border-radius: 		10px 10px 0 0;
	position:			absolute;
	top:				140px;
	left:				70px;
	font-size:			18px;
	font-weight: 		bold;
	height:				40px;
	
}

.lecture-index h2.tab1 {
	
}

.lecture-index h2.tab2 {
	left: 300px;
}

.lecture-index h2.tab3 {
	left: 530px;
}

h3.lecture-section-heading {
	margin-top:			0;
	padding:			10px;
	width:				300px;
	font-size:			17px;
	font-weight:		bold;
}

.lecture-item {
	padding-left: 		10px;
	position:			relative;
	margin-left:		40px;
	margin-right:		40px;
	padding-bottom:		5px;
	padding-right:		10px;
}

.chinh-ta .lecture-item {
	margin-right: 		0;
	padding-right:		0;
}

.lecture-item:before {
	position:			absolute;
	left:				-55px;
	width:				44px;
	height:				51px;
	display:			block;
	font-size:			15px;
	line-height:		16px;
	font-weight:		bold;
	color:				#333;
	background: 		url('../media/icon-lecture.png');
	text-align:			center;
	padding:			5px;
}
.pd-top-30 {
	padding-top:		30px;
}
.pd-10-percent {
	padding-left: 		10%;
}

.num1:before {
	content:			"Bài 1";
}

.num2:before {
	content:			"Bài 2";
}

.num3:before {
	content:			"Bài 3";
}

.num4:before {
	content:			"Bài 4";
}

.num5:before {
	content:			"Bài 5";
}

.num6:before {
	content:			"Bài 6";
}

.num7:before {
	content:			"Bài 7";
}

.num8:before {
	content:			"Bài 8";
}

.num9:before {
	content:			"Bài 9";
}
.num10:before {
	content:			"Bài 10";
}
.num11:before {
	content:			"Bài 11";
}
.num12:before {
	content:			"Bài 12";
}
.num13:before {
	content:			"Bài 13";
}
.num14:before {
	content:			"Bài 14";
}
.num15:before {
	content:			"Bài 15";
}
.num16:before {
	content:			"Bài 16";
}
.num17:before {
	content:			"Bài 17";
}
.num18:before {
	content:			"Bài 18";
}
.num19:before {
	content:			"Bài 19";
}
.num20:before {
	content:			"Bài 20";
}
.num21:before {
	content:			"Bài 21";
}
.num22:before {
	content:			"Bài 22";
}
.num23:before {
	content:			"Bài 23";
}
.num24:before {
	content:			"Bài 24";
}
.num25:before {
	content:			"Bài 25";
}

.lecture-title {
	font-weight:		bold;
	padding-top:		5px;
	padding-bottom:		5px;
}

.lecture-detail, .lecture-practice {
	padding-left:		20px;
	white-space:		normal;
}

.lecture-detail a, .lecture-practice a {
	color:				#333;
}

.lecture-detail:before {
	content:			" ";
	display:			inline-block;
	width:				20px;
	height:				15px;
	background:			url('../media/lecture-video-icon.png') no-repeat;
	margin-right:		5px;
}

.lecture-practice:before {
	content:			" ";
	display:			inline-block;
	width:				20px;
	height:				20px;
	background:			url('../media/lecture-homework-icon.png') no-repeat;
	margin-right:		5px;
}

.lecture-image {
	position: absolute;
	top: 55px;
	left: -70px;
}

.img-4-columns {
	text-align: center;
}

.mo-rong-von-tu .lecture-image {
	width: 				80px;
}