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

@font-face {
    font-family: "DaunKeo";
    src: url('http://ccc.gov.kh/fonts/DaunKeo.eot'); /* IE9 Compat Modes */
    src: url('http://ccc.gov.kh/fonts/DaunKeo.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('http://ccc.gov.kh/fonts/DaunKeo.woff2') format('woff2'), /* Super Modern Browsers */
       url('http://ccc.gov.kh/fonts/DaunKeo.woff') format('woff'), /* Pretty Modern Browsers */
       url('http://ccc.gov.kh/fonts/DaunKeo.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('http://ccc.gov.kh/fonts/DaunKeo.svg#svgFontName') format('svg'); /* Legacy iOS */
}
@font-face {	   
	font-family: "KhmerOSmuol";
    src: url('http://ccc.gov.kh/fonts/KhmerOSmuol.eot'); /* IE9 Compat Modes */
    src: url('http://ccc.gov.kh/fonts/KhmerOSmuol.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('http://ccc.gov.kh/fonts/KhmerOSmuol.woff2') format('woff2'), /* Super Modern Browsers */
       url('http://ccc.gov.kh/fonts/KhmerOSmuol.woff') format('woff'), /* Pretty Modern Browsers */
       url('http://ccc.gov.kh/fonts/KhmerOSmuol.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('http://ccc.gov.kh/fonts/KhmerOSmuol.svg#svgFontName') format('svg'); /* Legacy iOS */
}


*{
	padding: 0;
	margin: 0;
	-webkit-box-sizing: border-box;
	/* [disabled]-moz-box-sizing:border-box; */
	box-sizing: border-box;
}

.img{
	width:1300px;
	height:auto;
	display:block;
}
.headertop{
	background:#3b5998;
	z-index:1300;
	max-width:1300px;
	width:100%;
	height:auto;
	margin:0px auto;
	display:block;

}
.headerdiv{
	background:#3b5998;
	z-index:1140;
	max-width:1140px;
	width:100%;
	height:auto;
	margin:0px auto;
	display:block;
}

.headertoplibrary{
	background:#3b5998;
	z-index:1140;
	max-width:1140px;
	width:100%;
	height:auto;
	margin:0px auto;
	display:inline-block;

}
.headertop_slide{
	background:#f2f2f2;
	width:100%;
	height:35px;
	z-index:1300;
	max-width:1300px;
	margin:0px auto;
	display:block;
	color:#3b5998;
	border-bottom:solid 1px #fff;
}

.newspaper{
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;	
}

body{
	background:#3b5998;
	}

#menu_bar{
	display:none;
}

#menu_bar_left{
		display:block;
		padding:5px 5px 5px 5px;
		overflow:hidden;
		width: 90%;
		float:left;
}

#menu_bar_rigth{
		display:block;
		padding:5px 5px 5px 5px;
		overflow:hidden;
		width: 10%;
		float: right;
}
#headerlibrary{
	width:100%;
	background:#3b5998;
	display:block;
	position:relative;
	height:auto;
	font-family: 'DaunKeo';font-size: 15px; font-weight:600;
	
}

header{
	width:100%;
	background:#3b5998;
	font-family: 'DaunKeo';font-size: 15px; font-weight:600;
	
}

header nav{
	background:#DAA520;
	z-index:1300;
	max-width:1300px;
	width:100%;
	margin:0px auto;
	border-radius:3px 3px 0 0;

}

header nav ul{
	list-style:none;
}

header nav ul li{
	display:inline-block;
	position:relative;

	
}

header nav ul li:hover{
	background:#3b5998;

}

header nav ul li a{
	color:#fff;
	display:block;
	text-decoration:none;
	padding:10px 15px 10px 15px;
	
}

header nav ul li a span{
	margin-right:10px;
	margin-left:5px;
}

header nav ul li:hover .children{
	display:block;
}

header nav ul li .children{
	display:none;
	position:absolute;
	background:#DAA520;
	z-index:1000;
	width:200%;
	font-family: 'DaunKeo';font-size: 14px; font-weight:normal;
}

header nav ul li .children li{
	display:block;
	overflow:hidden;
	border-bottom:1px solid rgba(255,255,255,.5);

}

header nav ul li .children li:hover{
	background:#3b5998;
}

header nav ul li .children li a{
	display:block;
	padding:5px 5px 5px 10px;
	
}

header nav ul li .children li a span{
	position:relative;
	float:right;
	top:3px;
	margin-right:0px;
	margin-left:10px;
	
}

header nav ul li .caret{
	position:relative;
	top:3px;
	margin-right:0px;
	margin-left:10px;
	
}

.imgFlage {
	margin-bottom:5px;
	margin-top:8px;
	margin-left:10px;
	margin-right:10px;
	
	height:22px;
	width:24px;
	float:right;
}

.pointer {
          cursor: pointer;
      }
.textMarquee{
	font-family: 'DaunKeo';font-size: 13px;
	font-style:normal;
	padding-top:5px;
}
.textMarquee-kh{
	font-family: 'DaunKeo';font-size: 13px;
	font-style:normal;
	font-weight:100;
	color:#000;
	padding-top:5px;
	padding-bottom:2px;
}

.headersearch{
	background:#f2f2f2;
	width:100%;
	height:50px;
	z-index:1140;
	max-width:1140px;
	margin:0px auto;
	display:inline-block;
	color:#3b5998;
	border-bottom:solid 1px #fff;
}
.headersearchright{
  width:15%;
  float:left;
  display:block;
}
.headersearchright-one{
  width:10%;
  float:left;
  display:none;
}
.headersearchleft{
  width:83%;
  float:right;
}
.headersearchleft-one{
  width:88%;
  float:right;
  display:none;
}
.buttoncategory {
  background-color: #4CAF50; /* Green */
  border: none;
  color: white;
  padding: 12px 40px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  transition-duration: 0.4s;
  border-radius: 4px;
  cursor: pointer;
  position: relative;
}

.buttoncategory-one {
  background-color: #4CAF50; /* Green */
  border: none;
  color: white;
  padding: 12px 20px;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  margin: 4px 2px;
  transition-duration: 0.4s;
  border-radius: 4px;
  cursor: pointer;
  position: relative;
  display: none;
}
.button1 {
  background-color: #3b5998; 
  color: white; 
  border: 1px solid #e7e7e7;
}
.dropdown {
  position: relative;
  display: inline-block;
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  font-family:'DaunKeo';font-size: 13px;
  font-style:normal;
}

.dropdown-content a {
  color: black;
  padding: 4px 8px;
  text-decoration: none;
  display: block;
  border:1px solid #e7e7e7;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.button1:hover{
  background-color: #4CAF50;
  color: black;
  display: block;
}
.dropdown-content:hover{
  color: black;
  display: block;
}
.dropdown:hover .dropdown-content {
  display: block;
}

.buttonsearch {
  background-color: #4CAF50; /* Green */
  border: none;
  color: white;
  padding: 12px 14px;
  text-align: center;
  text-decoration: none;
  display: block;
  font-size: 14px;
  margin: 4px 2px;
  transition-duration: 0.4s;
  border-radius: 4px;
  cursor: pointer;
  float: right;
}

.button2 {
  background-color: #3b5998; 
  color: white; 
  border: 1px solid #e7e7e7;
}

.button2:hover{
  background-color: #4CAF50;
  color: black;
  
}

.button3 {
  background-color: #3b5998; 
  color: white; 
  display: block;
  width: 35px;
  height:35px;
  margin: 0px 4px;
  transition-duration: 0.4s;
  border-radius: 4px;
  border:none;
  cursor: pointer;
  float: right;
}

.button3:hover{
  background-color: #4CAF50;
}

.inputsearch{
  width:87%;
  padding: 12px 12px;
  text-align: left;
  text-decoration: none;
  display: block;
  font-size: 14px;
  margin: 4px 0px;
  border: 1px solid #ccc;
  border-radius: 4px;
 -webkit-appearance: none;
 -moz-appearance: none;
  appearance: none;
  float: right;
}

.inputsearch-sub{
  width:80%;
  padding: 8px 8px;
  text-align: left;
  text-decoration: none;
  display: block;
  font-size: 14px;
  margin:0px 0px;
  border: 1px solid #ccc;
  border-radius: 2px;
  box-sizing: border-box;
 -webkit-appearance: none;
 -moz-appearance: none;
  appearance: none;
  float: right;
}

.headercenter{
  width:60%;
  font-family: 'KhmerOSmuol'; 
  font-size: 12px;
  font-weight: normal;
  color:#DAA520;
  margin-top:20px;
  float:left;
  display:block;
}
.headercenterone{
  width:65%;
  font-family: 'KhmerOSmuol'; 
  font-size: 12px;
  font-weight: normal;
  color:#DAA520;
  margin-top:20px;
  float:left;
  display:block;
}
.headerleft{
  min-width:20%;
  margin-top:10px;
  margin-bottom:10px;
  float:left;
  display:block;
}

.headerright{
  min-width:20%;
  margin-top:10px;
  float:right;
  display:block;
}
.headerrightone{
  min-width:15%;
  margin-top:30px;
  float:right;
  display:block;
}
.headerlogo{
	width: 125px;
	height: 120px;
}

.headericons{
	width: 30px;
	height: 30px;
	float:right;
	margin-top:10px;
}
.headericons-sub{
	width: 30px;
	height: 30px;
}
@media screen and (max-width:960px){
	body{
		padding-top:70px;
	}
	
	header{
	width:100%;
	background:#3b5998;
	font-family: 'DaunKeo';font-size: 14px;
	font-style:normal;
	
	}
	.body-library{
	margin-top:-70px;

    }
	.headerlogo{
		width: 82px;
		height: 80px;
	}
	.headersearchleft{
		width:70%;
		float:right;
	
	}
	.headercenter{
		font-size: 8px;
		width:60%;
		margin-top:5px;
		margin-bottom:5px;
	}
	.headercenterone{
		font-size: 11px;
		width:65%;
		margin-top:5px;
		margin-bottom:5px;
	}
	.headerleft{
	  margin-top:5px;
	  margin-bottom:5px;
	}

	.headerright{
	  margin-top:5px;
	}
	.headerrightone{
	  margin-top:25px;
	}
	.headertop{
		display:none;
		/*display:block;
		width:100%;
		position:fixed;
		top:0px;*/
	
	}
	.headertop_slide{
		display:block;
		width:100%;
		height:auto;
		margin-top:12px;
		background:#fff;
		padding:5px auto;
	
	}
	.headertoplibrary{
	  padding-left:5px;
	  padding-right:5px;
	}
	.headersearch{
	  padding-left:5px;
	  padding-right:5px;
	}
	#menu_bar{
		display:block;
		width:100%;
		position:absolute;
		top:0px;
		/*top:168px;*/
		background:#3b5998;
	}
	
	#menu_bar_left{
		display:block;
		padding:5px 5px 5px 5px;
		overflow:hidden;
		width: 84%;
		float:left;
		background:none;
	}
	
	#menu_bar_rigth{
		display:block;
		padding:25px 10px 15px 5px;
		width: 14%;
		background:none;
	}
	.menu_bar .bt_menu{
		display:block;
		padding:5px 5px 5px 5px;
		color:#fff;
		overflow:hidden;
		font-size:16px;
		font-weight:bold;
		text-decoration:none;
		width: 19%;
		
	}
	
	#menu_bar span{
		float:right;
		font-size:30px;
		color:#ffffff;
		
	}
	
	header nav{
		width:100%;
		height:auto;
		position:absolute;
		right:100%;
		margin:0;
	
		
	}
	
	header nav ul li{
		display:block;
		border-bottom:1px solid rgba(255,255,255,.5);
		font-family: 'DaunKeo';font-size: 14px;
	    font-style:normal;
		
	}
	
	header nav ul li a{
		display:block;
		
	}
	
	header nav ul li:hover .children{
		display:none;
	}
	
	header nav ul li .children{
		width:100%;
		position:relative;
		
	}
	
	header nav ul li .children li a{
		margin-left:20px;
		
		
	}
	
	header nav ul li .caret{
		float:right;
	}
	.imgFlage {
		float:left;
		
	}
	.textMarquee-kh{
		font-family: 'DaunKeo';font-size: 12px;
		font-style:normal;
		padding-top:4px;
	}

	.inputsearch{
	  width:80%;
	}
}
@media screen and (max-width: 600px) {
		
	.headertop_slide{
		display:block;
		width:100%;
		background:#fff;
		padding:5px auto;
	
	}
	.headerrightone{
	  margin-top:20px;
	}
	.textMarquee-kh{
    	font-family: 'DaunKeo';font-size: 13px;
    	font-style:normal;
    	font-weight:100%;
    	height:28px;
    	color:#000;
    	padding-top:5px;
	}
	.headericons{
	    width: 20px;
	    height: 20px;
    }
	.headerlogo{
		width: 62px;
		height: 60px;
	}
	.headercenter{
	    padding-top:5px;
		font-size: 5px;
	}
	.headercenterone{
		font-size: 8px;
		margin-top:5px;
		margin-bottom:5px;
	}
	.headersearchleft{
		width:100%;
		float:right;
	}
	.headersearch{
		width:100%;
		height:auto;
	}
	.buttoncategory {
	  display: none;
	}
	.buttoncategory-one {
	  display: block;
	  font-size: 20px;
	  padding: 7px 8px;
	}

	.headersearchright{
	  
	  display:none;
	}
	.headersearchright-one{
	  width:10%;
	  display:block;
	}
	.headersearchleft{
	  display:none;
	}
	.headersearchleft-one{
	  width:88%;
	  display:block;
	}
	.inputsearch{
      width:75%;
      padding: 8px 4px;
      font-size: 14px;
      margin: 4px 0px;

	}
	.buttonsearch {
	  padding: 9.5px 3px;
      font-size: 11px;

	}

}