@charset "utf-8";
/* CSS Document */

*{margin:0; padding:0;}

.clorgray {color:#333;}
.clorred {color:#73010c;}
.clorred2{color:#f30}
.cloryellow {color:#fde800;}
.clorblue {color:#3b5998;}
.cl1{color:#999;}
.cl2{color:#666;}
.fl {float:left;}
.fr {float:right;}
.mal3 {margin-left:3%;}
.mar3 {margin-right:3%;}
a:link {text-decoration:none;}

.header {width:80%; height:80px;background:white;margin:auto;}
.share span{line-height: 80px;text-align:center;font-size:20px;font-family:Roboto Slab;font-weight:bold;background-size:contain;background-position:center;}
.span1 {width:120px;height:80px;background:url(../image/share.png);display:inline-block;padding-left:20px;color:white;background-repeat: no-repeat;}
.span2 {width:56px;height:80px;background:url(../image/share2.png);display:inline-block;color:#2a4a8a;background-repeat:no-repeat;}

.banner{width:80%;height:auto; margin:auto;background:#ce3e42;}
.box-videogioithieu{width:80%;height:auto;margin:auto;margin-top:0.75%;}
.hocthumienphi{width:80%;height:auto;background:#242c42;margin:auto;position:relative;overflow:hidden;text-align:center;}
.box-hocthu{width:90%;height:auto;margin:auto;}
.hocthumienphi h3 {font-family:Roboto Slab;font-weight:bold;color:#ce3e42;padding:10px 20px;background-color:white;width:60%;margin:auto;border-radius:5px;display:inline-block;margin-top:1%;margin-bottom:1%;}
.mon3 {width:20%;height:auto;display:inline-block;padding-bottom:3%;}
.videoGT {width:100%;height:auto;border:1px solid #cccccc;display:inline-block;}
.mon{width:23.5%;height:auto;background:#242c42;float:left;margin-left:1.2%;margin-top:1%;border-radius:5px;margin-bottom:1%;position:relative;}
.thongtinGV{padding: 12px 20px;display:block;background:#cdcdcd;text-align:center;border-radius:0px 0px 5px 5px;}
.thongtinGV span {font-family:Roboto Slab;color:#333;font-size:18px;padding-left:5px;}
.thongtinGV:hover span{text-decoration:underline;}
.play{z-index:2;position:absolute;width:100%;height:80%; background:url(../image/play.png) no-repeat center;background-size:20%}
.mon:hover .play {background-size:23%;}
.mon:hover {background:#2c3652;}
.monfree{width:23.5%;height:auto;float:left;margin-left:1.2%;margin-top:1%;border-radius:5px;margin-bottom:1%;position:relative;}
.play2{z-index:2;position:absolute;width:100%;height:100%; background:url(../image/play.png) no-repeat center;background-size:20%}
.monfree:hover .play2 {background-size:23%;}
.banner2{width:80%;height:auto;margin:auto;background:#01476e;}
.cackhoahoc {width:80%;height:auto;margin:auto;background:#cdcdcd;position:relative;overflow:hidden;}
.title2{width:50%;height:auto;}
.cackhoahoc h1 {font-family:UTM Avo bold;text-align:center; color:#01476e;margin-top:70px;text-transform:uppercase;}
.cackhoahoc p {font-family:UTM Avo regular;text-align:center; font-size:22px;color:#01476e; }
.chitietkhoa {width:50%;height:auto;background:white;}
.chitietkhoa li {list-style:none;border-bottom:1px solid #cdcdcd;width:100%}
.chitietkhoa li h3{padding:5px 20px 0px 20px;font-family:Roboto Slab;font-weight:bold;color:#333;}
.chitietkhoa li span{padding:0px 20px 10px 20px;font-family:UTM Avo regular;padding-bottom:10px;display:inline-block;color:#aaa;}

.ykienhocsinh{width:80%;height:auto;background:#89bdd7;margin:auto;background-image:url(../image/banner3.png);background-repeat:no-repeat;background-position:bottom;background-size:100%;position:relative;overflow:hidden; }
.title3{padding:10px;display:block;}
.box-ykien{width:55%;height:70%;margin:auto;background:white;border-radius:5px 5px 0px 0px;position:relative;overflow:hidden;}
.anhhocsinh {float:left;width:30%;height:100%}
.box-ykien h3 {font-family:UTM Avo bold;padding:20px 20px 5px 20px;display:block;color:#333;}
.box-ykien span {font-family:UTM Avo regular;color:#333;}
.box-ykien p {font-family:UTM Avo regular;padding:15px 15px;display:block;color:#333;}
.baochi {width:80%;height:auto;margin:auto;background:#cdcdcd;}
.baochi a{padding:10px 0px 10px 20px;display:inline-block;}

.datcho{width:80%;height:auto;background:#01476e;margin:auto; }
.title4{padding:10px;display:block;}
.timedatcho{width:80%;height:auto;;margin:auto;border:2px solid white;}
.dieukiendatcho {color:white;font-family:UTM Avo regular;font-size:18px;width:87%;height:auto;margin:auto;padding:10px}
.clickdatcho {padding:20px;display:block;}
.box-danhsach{width:80%;height:auto;margin:auto;}
.box-danhsach table {width:100%;border-collapse: collapse;}
.box-danhsach table tr, td {border:1px solid #cdcdcd;text-align:center;}
.box-danhsach table h4, p {padding:10px;font-size:18px;font-family:UTM Avo regular;}

.box-comment {width:80%;height:auto;background:white;position:relative;overflow:hidden;margin:auto}
textarea {
    border: 1px solid #dedede;
    color: #777;
    resize: none;
    padding: 4px;
	margin-left:1%;
    height: 50px;
    width: 100%;}
	
.btnSmall {
    background-color: #eee;
    border: 1px solid #cdcdcd;
    border-radius: 4px;
    color: #333 !important;
    font-size: 12px;
	margin-top:0.5%;
	margin-left:1%;
    padding: 5px 15px;
}

.clearfix {padding:10px;border-bottom:1px dashed #cdcdcd;position:relative;overflow:hidden;list-style:none;font-size:14px;}

.clearfix img {width:4%;height:4%;border-radius:50%;background:white;margin-top:15px}

.innerWrap {width:96%;height:auto;position:relative;overflow:hidden;}

.innerWrap span {padding-bottom:0.5%;color:#a1a1a1;display:block;margin-left:1%;}

.commentchild{width:100%;height:auto;position:relative;overflow:hidden;background:#e6ecf2;}

.cmchild{width:100%;height:auto;position:relative;overflow:hidden;}
.commentchild2{width:100%;height:auto;position:relative;overflow:hidden;display:none;}

.pop {
		width:100%;
		height:100%;
		position:fixed;
		z-index:3;
		top:0px;
		left:0px;
		background:rgba(0, 0, 0, 0.68);
		visibility:hidden;
		}
		
.popvideo {
		width:60%;
		height:auto;
		position:fixed;
		z-index:5;
		top:13%;
		left:20%;
		background:white;
		border:6px solid white;
		visibility:hidden;
		-webkit-transform:scale(0);
		-webkit-transition:all ease 0.5s;
		}
		
		
.video{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}

.video iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

.pophienlen {
		visibility:visible;}
		
.popvideohienlen {
		-webkit-transform:scale(1);
		visibility:visible;}
		
.exit{position:fixed;z-index:999;top:-15px;right:-15px;}

.popvideofree {
		width:60%;
		height:auto;
		position:fixed;
		z-index:5;
		top:13%;
		left:20%;
		background:white;
		border:6px solid white;
		visibility:hidden;
		-webkit-transform:scale(0);
		-webkit-transition:all ease 0.5s;
		}
		
		
.popvideofreehienlen {
		-webkit-transform:scale(1);
		visibility:visible;}
		
.footer {width:80%;height:auto;margin:auto;margin-top:2%; font-family:Arial, Helvetica, sans-serif; font-size:14px;border-top:2px solid #cff1ff;}
.item {width:24%;height:auto; float:left;margin-top:2%;margin-left:1%;}

.item ul {margin-top:3%;list-style-position:inside;color:#0bb4eb ;margin-left:2%;}
.ft2{width:100%;height:auto;position:relative;overflow:hidden;text-align:center;margin-top:2%;display:inline-block;}
.ft2 a{font-weight:bold;padding:0px 20px;color:#666}
.ft2 a:hover{text-decoration:underline;}
.border {border-right:2px solid #666;}
.ft2 p {color:#999;font-family:Arial, Helvetica, sans-serif;font-size:14px;}
		




@font-face {
	font-family:UTM Avo regular;
	src:url(../font/UTMAvo.ttf);
	}
	
@font-face {
	font-family:UTM Avo regular;
	src:url(../font/utmavo-webfont.eot);
	}
	
@font-face {
	font-family:UTM Avo regular;
	src:url(../font/utmavo-webfont.woff);
	}
	
@font-face {
	font-family:UTM Avo bold;
	src:url(../font/UTMAvoBold.ttf);
	}
	
@font-face {
	font-family:UTM Avo bold;
	src:url(../font/utmavobold-webfont.eot);
	}
	
@font-face {
	font-family:UTM Avo bold;
	src:url(../font/utmavobold-webfont.woff);
	}
	
@font-face {
	font-family:UTM Avo bold;
	src:url(../font/utmavobold-webfont.woff2);
	}
	
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 400;
    src: local("Roboto Italic"), local("Roboto-Italic"), url("//fonts.gstatic.com/s/roboto/v15/WxrXJa0C3KdtC7lMafG4dRTbgVql8nDJpwnrE27mub0.woff2") format("woff2");
    unicode-range: U+460-52F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 400;
    src: local("Roboto Italic"), local("Roboto-Italic"), url("//fonts.gstatic.com/s/roboto/v15/OpXUqTo0UgQQhGj_SFdLWBTbgVql8nDJpwnrE27mub0.woff2") format("woff2");
    unicode-range: U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 400;
    src: local("Roboto Italic"), local("Roboto-Italic"), url("//fonts.gstatic.com/s/roboto/v15/1hZf02POANh32k2VkgEoUBTbgVql8nDJpwnrE27mub0.woff2") format("woff2");
    unicode-range: U+1F00-1FFF;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 400;
    src: local("Roboto Italic"), local("Roboto-Italic"), url("//fonts.gstatic.com/s/roboto/v15/cDKhRaXnQTOVbaoxwdOr9xTbgVql8nDJpwnrE27mub0.woff2") format("woff2");
    unicode-range: U+370-3FF;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 400;
    src: local("Roboto Italic"), local("Roboto-Italic"), url("//fonts.gstatic.com/s/roboto/v15/K23cxWVTrIFD6DJsEVi07RTbgVql8nDJpwnrE27mub0.woff2") format("woff2");
    unicode-range: U+102-103, U+1EA0-1EF9, U+20AB;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 400;
    src: local("Roboto Italic"), local("Roboto-Italic"), url("//fonts.gstatic.com/s/roboto/v15/vSzulfKSK0LLjjfeaxcREhTbgVql8nDJpwnrE27mub0.woff2") format("woff2");
    unicode-range: U+100-24F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 400;
    src: local("Roboto Italic"), local("Roboto-Italic"), url("//fonts.gstatic.com/s/roboto/v15/vPcynSL0qHq_6dX7lKVByfesZW2xOQ-xsNqO47m55DA.woff2") format("woff2");
    unicode-range: U+0-FF, U+131, U+152-153, U+2C6, U+2DA, U+2DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 500;
    src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url("//fonts.gstatic.com/s/roboto/v15/OLffGBTaF0XFOW1gnuHF0TTOQ_MqJVwkKsUn0wKzc2I.woff2") format("woff2");
    unicode-range: U+460-52F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 500;
    src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url("//fonts.gstatic.com/s/roboto/v15/OLffGBTaF0XFOW1gnuHF0TUj_cnvWIuuBMVgbX098Mw.woff2") format("woff2");
    unicode-range: U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 500;
    src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url("//fonts.gstatic.com/s/roboto/v15/OLffGBTaF0XFOW1gnuHF0UbcKLIaa1LC45dFaAfauRA.woff2") format("woff2");
    unicode-range: U+1F00-1FFF;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 500;
    src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url("//fonts.gstatic.com/s/roboto/v15/OLffGBTaF0XFOW1gnuHF0Wo_sUJ8uO4YLWRInS22T3Y.woff2") format("woff2");
    unicode-range: U+370-3FF;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 500;
    src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url("//fonts.gstatic.com/s/roboto/v15/OLffGBTaF0XFOW1gnuHF0b6up8jxqWt8HVA3mDhkV_0.woff2") format("woff2");
    unicode-range: U+102-103, U+1EA0-1EF9, U+20AB;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 500;
    src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url("//fonts.gstatic.com/s/roboto/v15/OLffGBTaF0XFOW1gnuHF0SYE0-AqJ3nfInTTiDXDjU4.woff2") format("woff2");
    unicode-range: U+100-24F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: "Roboto";
    font-style: italic;
    font-weight: 500;
    src: local("Roboto Medium Italic"), local("Roboto-MediumItalic"), url("//fonts.gstatic.com/s/roboto/v15/OLffGBTaF0XFOW1gnuHF0Y4P5ICox8Kq3LLUNMylGO4.woff2") format("woff2");
    unicode-range: U+0-FF, U+131, U+152-153, U+2C6, U+2DA, U+2DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    src: local("Roboto Regular"), local("Roboto-Regular"), url("//fonts.gstatic.com/s/roboto/v15/ek4gzZ-GeXAPcSbHtCeQI_esZW2xOQ-xsNqO47m55DA.woff2") format("woff2");
    unicode-range: U+460-52F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    src: local("Roboto Regular"), local("Roboto-Regular"), url("//fonts.gstatic.com/s/roboto/v15/mErvLBYg_cXG3rLvUsKT_fesZW2xOQ-xsNqO47m55DA.woff2") format("woff2");
    unicode-range: U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    src: local("Roboto Regular"), local("Roboto-Regular"), url("//fonts.gstatic.com/s/roboto/v15/-2n2p-_Y08sg57CNWQfKNvesZW2xOQ-xsNqO47m55DA.woff2") format("woff2");
    unicode-range: U+1F00-1FFF;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    src: local("Roboto Regular"), local("Roboto-Regular"), url("//fonts.gstatic.com/s/roboto/v15/u0TOpm082MNkS5K0Q4rhqvesZW2xOQ-xsNqO47m55DA.woff2") format("woff2");
    unicode-range: U+370-3FF;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    src: local("Roboto Regular"), local("Roboto-Regular"), url("//fonts.gstatic.com/s/roboto/v15/NdF9MtnOpLzo-noMoG0miPesZW2xOQ-xsNqO47m55DA.woff2") format("woff2");
    unicode-range: U+102-103, U+1EA0-1EF9, U+20AB;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    src: local("Roboto Regular"), local("Roboto-Regular"), url("//fonts.gstatic.com/s/roboto/v15/Fcx7Wwv8OzT71A3E1XOAjvesZW2xOQ-xsNqO47m55DA.woff2") format("woff2");
    unicode-range: U+100-24F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 400;
    src: local("Roboto Regular"), local("Roboto-Regular"), url("//fonts.gstatic.com/s/roboto/v15/CWB0XYA8bzo0kSThX0UTuA.woff2") format("woff2");
    unicode-range: U+0-FF, U+131, U+152-153, U+2C6, U+2DA, U+2DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    src: local("Roboto Medium"), local("Roboto-Medium"), url("//fonts.gstatic.com/s/roboto/v15/ZLqKeelYbATG60EpZBSDyxJtnKITppOI_IvcXXDNrsc.woff2") format("woff2");
    unicode-range: U+460-52F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    src: local("Roboto Medium"), local("Roboto-Medium"), url("//fonts.gstatic.com/s/roboto/v15/oHi30kwQWvpCWqAhzHcCSBJtnKITppOI_IvcXXDNrsc.woff2") format("woff2");
    unicode-range: U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    src: local("Roboto Medium"), local("Roboto-Medium"), url("//fonts.gstatic.com/s/roboto/v15/rGvHdJnr2l75qb0YND9NyBJtnKITppOI_IvcXXDNrsc.woff2") format("woff2");
    unicode-range: U+1F00-1FFF;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    src: local("Roboto Medium"), local("Roboto-Medium"), url("//fonts.gstatic.com/s/roboto/v15/mx9Uck6uB63VIKFYnEMXrRJtnKITppOI_IvcXXDNrsc.woff2") format("woff2");
    unicode-range: U+370-3FF;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    src: local("Roboto Medium"), local("Roboto-Medium"), url("//fonts.gstatic.com/s/roboto/v15/mbmhprMH69Zi6eEPBYVFhRJtnKITppOI_IvcXXDNrsc.woff2") format("woff2");
    unicode-range: U+102-103, U+1EA0-1EF9, U+20AB;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    src: local("Roboto Medium"), local("Roboto-Medium"), url("//fonts.gstatic.com/s/roboto/v15/oOeFwZNlrTefzLYmlVV1UBJtnKITppOI_IvcXXDNrsc.woff2") format("woff2");
    unicode-range: U+100-24F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
    font-family: "Roboto";
    font-style: normal;
    font-weight: 500;
    src: local("Roboto Medium"), local("Roboto-Medium"), url("//fonts.gstatic.com/s/roboto/v15/RxZJdnzeo3R5zSexge8UUVtXRa8TVwTICgirnJhmVJw.woff2") format("woff2");
    unicode-range: U+0-FF, U+131, U+152-153, U+2C6, U+2DA, U+2DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
	
	
@media screen and (max-width: 960px) {.thongtinGV{padding: 5px 5px;}
									   .thongtinGV span {font-size:16px}
									   .box-ykien{width:100%;border-radius:0px;}
									   }	
	
@media screen and (max-width: 640px) {.header {width:100%}
									  .banner{width:100%}
									  .banner2{width:100%}
									  .ykienhocsinh{width:100%;background-image:none;}
									  .baochi {width:100%}
									  .datcho{width:100%}
									  .cackhoahoc{width:100%}
									  .box-danhsach{width:100%}
									  .box-comment {width:100%}
									  .hocthumienphi {width:100%;}
									  .box-hocthu{width:95%;}
									  .footer {width:100%;font-size:12px;}
									  .item {width:48%;}
									  .exit{top:0;right:-5px;}
									  .exit img{width:80%;}
									  .popvideo {width:100%;left:0;border:0px;}
									  .mon{width:49%;margin-left:1%;}
									  .monfree{width:49%;margin-left:1%;}
									  .box-videogioithieu{width:100%}}
									
@media screen and (max-width: 480px) {.title2{width:100%}
									   .cackhoahoc h1{margin-top:10px; font-size:24px;}
									   .chitietkhoa {width:100%}
									   .box-danhsach table h4, p{font-size:16px;}
									   .mon3 {width:48%;}
									   .hocthumienphi h3{width:90%;}
									   .item {width:100%;}
									   .footer {font-size:16px;}
									   }
											
@media screen and (max-width: 420px) {.header {width:100%}
											.span1{width:80px}
											.span2{width:40px}
											.header img {margin-top:15px;}
											.thongtinGV span {font-size:14px}
											.hocthumienphi h3{font-size:16px;}
											}