/*========== banner =============*/
#banner{
	width:100%;
	margin:0 auto;
	height:auto;
	background:transparent url(images/bg_banner.jpg) repeat-x center 100%;
	overflow:hidden;
	position:relative;
	background-size:auto 100%;
	padding:0;
	border-bottom:10px #7e2a28 solid;
}
#banner > .main{position:relative;}
#banner .left{
	float:left;
	width:45%;
	text-align:center;margin:0 auto;
	height:100%;
}
#banner .left img{
	margin-top:10%;
	width:auto;
	padding-left:1%;
	position:relative;
	top:3px;
	left:2%;
	text-align:center;
	height:auto;
}
#banner .right{
	float:right;
	width:50%;
	position:relative;
	right:5%;
	height:auto;
	padding:0;
}
#banner .right .bn1{
	width:100%;
	padding-top:6%;
	display:block;
	text-align:center;
	float:left;
	height:auto;
}
#banner .right .bn1 img{padding-right:2%;}
#banner .right .bn2{width:100%;clear:both;text-align:center;}
#banner .right .bn2 img{}
#banner .right .bn3, #banner .right .bn4, #banner .right .bn5{width:33%;float:left;text-align:center;margin-top:2%;}
#banner .bstuvan{max-width:321px;padding-top:4%;text-align:center;clear:both;margin:0 auto;max-height:58px;position:relative;}	
#banner .bstuvan a{
	width:321px;height:58px; background:url(images/tuvan_normal.png) no-repeat center;
	background-size:100%;
	
	text-align:center;
	display:block;
}
#banner .bstuvan a:hover{
	transition:all 0.2s ease;
	background:url(images/tuvan_hover.png) no-repeat center;
	background-size:100%;
	animation-name: pulssing;
	-webkit-animation-name: pulssing;
	animation-duration: 1s;	
	-webkit-animation-duration: 1s;
	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

@keyframes pulssing {
	0% {
		transform: scale(1);
		opacity: 1;		
	}
	50% {
		transform: scale(0.9);
		opacity: 1;	
	}	
	100% {
		transform: scale(1);
		opacity: 1;	
	}			
}

@-webkit-keyframes pulssing {
	0% {
		-webkit-transform: scale(1);
		opacity: 1;		
	}
	50% {
		-webkit-transform: scale(0.9);
		opacity: 1;	
	}	
	100% {
		-webkit-transform: scale(1);
		opacity: 1;	
	}			
}
#menukhh{padding:10px 0 10px 0;margin:0}
#menukhh ul{width:100%;max-width:720px; margin:0 auto; padding:1%;}
#menukhh ul li{
	width:31.3%;
	min-width:214px;
	float:left;
	display:inline-block;
	text-align:center;
	
	height:105px;
	margin:1%;
}
#menukhh ul li a{
	position:relative;
	height:105px;
	display:block;
	line-height:18px;
	overflow:hidden;
	color:#fff;	
}
#menukhh ul li a span{
	height:105px;
	left:107px;
	width:87px;
	padding:0 10px;
	text-align:center;
	position:relative;
	vertical-align:middle;
	background:#ff6f6f;
	display:table-cell;
	text-align:center; 
}
#menukhh ul li:nth-child(2) span{background:#71a543}
#menukhh ul li:nth-child(3) span{background:#ffae00}
#menukhh ul li:nth-child(4) span{background:#349ab7}
#menukhh ul li a:hover span{
	left:0px;
	transition:0.4 all ease;
	width:214px;
	-webkit-transition:0.5s ease;
	-moz-transition:0.5s ease;
	-o-transition:0.5s ease;
	transition:0.5s ease;
}
#menukhh ul li:nth-child(1) a{background:url(../images/kehoachhoa/menu1.jpg) no-repeat left center;}
#menukhh ul li:nth-child(2){background:url(../images/kehoachhoa/menu2.jpg) no-repeat left center;}
#menukhh ul li:nth-child(3){background:url(../images/kehoachhoa/menu3.jpg) no-repeat left center;}
#menukhh ul li:nth-child(4){background:url(../images/kehoachhoa/menu4.jpg) no-repeat left center;}
#content-khh{margin:0;padding:0;}
#content-khh .answer{background:#f8f8f8;padding:25px 0}
#content-khh .answer .pic{width:35%;float:left;text-align:center;}
#content-khh .answer .right{width:60%;float:left;padding:20px 0;padding:2%;background:#4cae3f;color:#fff;margin-right:1%;}
#content-khh .answer .right h1{text-transform:uppercase;font-size:20px;}
#content-khh .answer .right p{width:100%;margin:0 auto;padding:10px 0;}
#content-khh .tyle{margin:0;padding:0;padding-bottom:25px;}
#content-khh .tyle h3{width:90%;margin:0 auto;color:#000;text-align:center;font-size:20px;padding-top:20px;text-transform:uppercase;}
#content-khh .tyle .pic{
	width:40%;
	float:left; 
	text-align:center;
	margin:0 auto; 
	color:#fff;
	margin-top:20px;
}
#content-khh .tyle .desc{
	width:57%;
	padding:1.5%; 
	float:left;
	min-height:275px;
	background:url(images/bg_1.jpg) no-repeat right bottom;
}
#content-khh .bienphap{margin:0;padding:0 0 20px 0;background:#f8f8f8}
#content-khh .bienphap h3{
	width:90%;
	margin:0 auto;
	color:#000;
	text-align:center;
	font-size:20px;
	padding:20px 0;
	text-transform:uppercase;
}
#content-khh .bienphap .left{
	width:50%;float:left;
}
#content-khh .bienphap .left .block{
	width:42%;
	margin:1%;
	padding:3%; 
	float:left;
	background:#4cae3f;
	border-radius:5px;
	-webkit-border-radius:5px;
	color:#fff;
	min-height:180px;
}
#content-khh .bienphap .left strong{text-align:center;display:block;text-transform:uppercase;padding:5px 0}
#content-khh .bienphap .left p{color:#fff;}
#content-khh .bienphap .right{
	width:46%;float:left;padding:0.5% 2%;
}
#content-khh .bienphap .right p.list-pp{background:#7e2a28;color:#fff;padding:20px;text-align:center;font-size:18px;}
#content-khh .bienphap .right ul{margin-top:20px;padding:0;}
#content-khh .bienphap .right ul li{background:url(images/icon1.jpg) no-repeat left center;padding:10px 0 10px 40px;}
#content-khh .bienphap .right .arrow{text-align:center;padding:20px 0;}
#content-khh .bienphap .right strong{width:78%;margin:0 auto; color:#175679;display:block; text-align:center;text-transform:uppercase;}
#content-khh .luutrinh{margin:0;padding:0; background:#7e2a28 !important;}
#content-khh .luutrinh h3{
	width:90%;
	margin:0 auto;
	color:#000;
	text-align:center;
	color:#fff;
	font-size:20px;
	padding:20px 0;
	text-transform:uppercase;
}
#content-khh .luutrinh .col{width:14.2%;float:left;text-align:center;}
#content-khh .luutrinh .col p{width:80%;margin:0 auto;color:#fff;padding:10px 0 25px 0;}
.choose-thoidiem{margin:0;}
.choose-thoidiem h3{
	width:90%;
	margin:0 auto;
	color:#000;
	text-align:center;
	font-size:20px;
	padding:20px 0 0 0;
	text-transform:uppercase;
}
.choose-thoidiem .block-week{
	width:23%;float:left;margin:2% 1%;text-align:center;
}
.choose-thoidiem .block-week p:nth-child(2){width:96%;margin:0 auto; text-align:justify;padding:20px 0 0 0;}
#content-khh .answer-mangthai{margin:0;padding:0;background:#eeeeee;}

.answer-mangthai h3{
	width:90%;
	margin:0 auto;
	color:#000;
	text-align:center;
	font-size:20px;
	padding:20px 0 0 0;
	text-transform:uppercase;
}
.answer-mangthai p.details{font-size:15px; width:90%;margin:0 auto; color:#387c13;text-align:center;text-transform:uppercase;font-weight:800;}
#content-khh .answer-mangthai .col-mangthai{width:23%;float:left;margin:1%;text-align:center;padding:2% 0;}
#content-khh .answer-mangthai p:nth-child(1){min-height:185px;text-align:center;margin:0 auto;padding:0;position:relative;left:6px;}
#content-khh .answer-mangthai p:nth-child(2):not(.details){width:98px;margin:0 auto;padding:0;min-height:110px;margin-top:-127px; text-align:center;text-transform:uppercase}
#content-khh .answer-mangthai p:nth-child(3):not(.details){
	padding:15px;
	text-align:justify;
	margin-top:20px;
	background:#fff;
	border-radius:10px;
	-webkit-border-radius:10px;
	min-height:270px;
}
#content-khh .csyt h4{
	width:90%;
	margin:0 auto;
	color:#000;
	text-align:center;
	font-size:20px;
	padding:20px 0;
	text-transform:uppercase;
}
#content-khh .csyt h4 p{font-size:15px;color:#387c13;}
#content-khh .csyt .block-yte{width:23%;margin:1%;float:left;text-align:center;min-height:230px;}
#content-khh .csyt .block-yte p{max-width:212px; text-align:justify;margin:0 auto;padding-top:10px;}

@media screen and (max-width:1024px) {
	#banner{overflow:hidden;margin:0;padding:0;
	background-size:180% 100%;}
	#banner .right .bn2{width:100%;}
	#banner .right .bn2 img{width:100%;}
	#banner .right .bn1 img{width:100%;}	
	#banner .left img{width:100%;top:-2px;left:1%; z-index:10;float:left !important;text-align:left !important;}
	#banner .right .bn3 img, #banner .right .bn4 img, #banner .right .bn5 img{width:86%;}
}
@media screen and (max-width:800px) {
	#banner{margin-top:60px;}
	#banner .left{position:relative;top:2px;}
	#banner .right .bn1{padding-top:15%;}
	#banner .bstuvan{display:none;}
	#menukhh .details{background:#0295a4;width:96%;max-width:400px; float:none;margin:0 auto; padding:2%;color:#fff;}
	#menukhh .details span{margin:0 auto;}
	#menukhh ul{width:96%;float:none;margin:0 auto;max-width:450px;}
	#menukhh ul li{
		width:48%;
	}
	#content-khh .answer .pic, #content-khh .answer .right{width:96%;margin:0 auto; float:left;text-align:center;max-width:450px;float:none;}
	#content-khh .tyle .pic,#content-khh .tyle .desc {
		width:96%;
		float:none; 
		max-width:450px;
		margin:0 auto;
		margin-top:25px; 
	}
	#content-khh .answer-mangthai .col-mangthai{width:96%;margin:20px auto;float:none;max-width:450px;}
	#content-khh .answer-mangthai p:nth-child(2):not(.details){  min-height: 75px;margin-top:10px;}
	#content-khh .csyt .block-yte{
		  width: 96%;
		  margin: 20px auto;
		  float: none;
		  text-align: center;
		  min-height: 230px;
	}

	
	
	#content-khh .bienphap .left{
		width:96%;margin:0 auto; float:none;
	}
	#content-khh .bienphap .left .block{
		width:42%;
		margin:1%;
		padding:3%; 
		float:left;
		background:#4cae3f;
		border-radius:5px;
		-webkit-border-radius:5px;
		color:#fff;
		min-height:180px;
	}
	#content-khh .bienphap .left, #content-khh .bienphap .right{
		clear:both;
		width:96%;margin:0 auto; float:none;max-width:450px;
	}
	#content-khh .bienphap .left .block{
		width:92%;margin:15px auto;
	}
	#content-khh .luutrinh .col{width:50%;}
	#content-khh .luutrinh .col:nth-child(4),
	#content-khh .luutrinh .col:nth-child(6){clear:both;}
	#content-khh .block-week{
		width:96%;max-width:450px; margin:20px auto;float:none;
	}
	.answer-mangthai .col-mangthai{width:96%;max-width:450px; margin:20px auto;float:none;}
	
	
}
@media screen and (max-width:480px) {
	#menukhh ul{max-width:214px;}
	#menukhh ul li{
		float:none;
		width:96%;
		margin:1%;
		margin-top:10px;
	}
}