*{
	margin: 0;
	padding: 0;
	font-family: 'Phetsarath_OT';
	font-size: 11pt; 
	
}

body{
	background-image: url('../img/bg.jpg');
	background-repeat: repeat-x;
	background-color: #4bd2fd;
}

table, td, th{
	font-size: 95%;
}

td a{
	font-size: inherit;
}


h1{
	font-size: 2em;
	font-family: inherit;
}

h2{
	font-size: 1.5em;
}

#ict_wrapper{
	width: 85%;
	background-color: #FFFFFF;
	margin: 0.1em auto;
	box-shadow: 0 0 0.8em 0 rgba(0,0,0,0.4),
		inset 0 -0.3em 0.5em -1.5em #03E3EC,
		inset 0 0.5em 0.5em -1.5em #FFFFFF,
		inset 0 1em 0 0 rgba(255,255,255,0.1);
}

#ict_header{
	height: 10em;
	/* border: solid thin; 
	box-shadow: 0 0 0.5em 0 rgba(0,0,0,0.6),
		inset 0 -1.5em 1.5em -1.5em #82D8E8,
		inset 0 1.5em 1.5em -1.5em #82D8E8,
		inset 0 0.7em 0 0 rgba(255,255,255,0.1);
	*/
}
#ict_header img{
	width: 100%;
	height: 9.9em;
	border: solid thin #CB4335;
	border-radius: 0 0 0.5em 0.5em;
	
}
#topbar{
	margin-top: 0.2em;
	position: relative;				
	background-color: #CB4335;
	box-shadow: 0 0 0.5em 0 rgba(0,0,0,0.6),
		inset 0 -1.5em 1.5em -1.5em #B2F0FC,
		inset 0 1.5em 1.5em -1.5em #FFFFFF,
		inset 0 0.7em 0 0 rgba(255,255,255,0.1);	
	display: inline-block;
	width: 100%;
	border-radius: 0.5em;
}


#topbar li{
	list-style: none;
	display: inline-block;
	padding: 0.5em;	
	font-weight: bold;
	font-size: 9pt;
}

#topbar a{
	text-decoration: none;
	color: #FFFFFF;	
	cursor: pointer;
	padding: 0.5em;
	border-left: solid thin;
}

#topbar a:hover{
	background-color: #FFE2BC;	
	color: #000000;
}

#ict_zone{
	position: relative;
}

#left_bar{
	float: left;
	width: 12em;
	margin-bottom: 0.5em;
}

#ict_content{
	margin-left: 12em;
	position: relative;
	padding-left: 0.5em;
	padding-bottom: 0.3em;
}

#right_bar{
	float: right;
	width: 12em;
	margin-bottom: 0.5em;
}

#centerindex{			
	margin-right: 12.1em;
	padding-top: 0.5em;
	
}
#centerindex .picture{
	height: 25em;
}
/* ---------------------------------- Menu Box ------------------------------ */
.ict_box{
	margin-top: 0.2em;
	border: solid thin #CB4335;
	padding: 0.3em;
	border-radius: 0.5em;
	box-shadow: 0 0 0.5em 0 rgba(0,0,0,0.4),
		inset 0 -1.2em 1.5em -1.5em #03E3EC,
		inset 0 1.5em 1.5em -1.5em #FFFFFF,
		inset 0 0.3em 0 0 rgba(255,255,255,0.1);
	
}
.ict_box h1{
	background-color: #CB4335;
	margin-bottom: 0.5em;
	padding: 0.5em;
	font-size: 0.9em;
	letter-spacing: 0.2em;
	border-radius: 0.5em 0.5em 0 0;
	box-shadow: 0 0 0.3em 0 rgba(0,0,0,0.4),
		inset 0 -1.5em 1.5em -1.5em #FFFFFF,
		inset 0 1.5em 1.5em -1.5em #FFFFFF,
		inset 0 1em 0 0 rgba(255,255,255,0.1);
}

.menutitle{		
	background-color: #CB4335;
	margin-bottom: 0.5em;
	padding: 0.5em;
	font-size: 0.9em;
	letter-spacing: 0.2em;
	border-radius: 0.5em 0.5em 0 0;
	box-shadow: 0 0 0.3em 0 rgba(0,0,0,0.4),
		inset 0 -1.5em 1.5em -1.5em #FFFFFF,
		inset 0 1.5em 1.5em -1.5em #FFFFFF,
		inset 0 1em 0 0 rgba(255,255,255,0.1);
}

.ict_box li{
	list-style-type: none;
	border-bottom: dotted thin;
	padding: 0.3em;
}
.ict_box li:hover{
	background-color: #DAF9FC
}
.ict_box a{
	text-decoration: none;
}
.ict_box p{
	padding-top: 0.3em;
}
/*
.ict_box input[type='text'], input[type='password']{
	/*
	width: 93%;
	padding: 0.2em;
	
}
*/

.input_index{
	width: 93%;
}

/* ---------------------------------- Footer ------------------------------ */
#ict_footer{
	clear: both;
	line-height: 2em;
	text-align: center;
	background-color: #CB4335
	color: #FFFFFF;
	font-weight: bold;
	box-shadow: 0 0 0.5em 0 rgba(0,0,0,0.6),
		inset 0 -1.5em 1.5em -1.5em #B2F0FC,
		inset 0 1.5em 1.5em -1.5em #FFFFFF,
		inset 0 0.7em 0 0 rgba(255,255,255,0.1);
	border-radius: 0.5em;
	
}
#ict_footer p{
	font-size: 9pt;
	font-weight: normal;
}
/* -------------------------------- Element ------------------------------- */
.centered {
	text-align: center;
}
/* ----------------------------------------------- LOGIN FORM ------------------------- */
#loginform{
	position:relative;
	margin: 3em auto;
	padding: 0 0.5em 0.7em 0.5em;
	width: 15em;
	border-radius: 0.3em;
	border: solid thin #C57100;
	box-shadow: 0 0 0.5em #82D8E8;
	text-align: center;
	
}
#loginform h1{
	font-size: 1.4em;
	border-bottom: dotted thin;
	padding: 0.9em 0 0.5em 0;
	margin-bottom: 0.9em;
}
#loginform input[type="submit"] {
	padding: 0.5em 1.3em;
	margin-top: 0.8em;	
	font-weight: bold;
	cursor: pointer;		
}

#loginform input{
	padding: 0.3em 0.2em;
	margin-top: 0.1em
	
}

#loginform p{
	margin-top: 0.5em;
}
/********************************* LOGIN INFI ***********************************/
.loginfo{
	position: absolute;
	right: 0;
	line-height: 1.3em;
	border: dotted thin #0054E3;
	border-radius: 0.5em;
	margin: 0.2em;
	margin-top: 0.3em;
	padding: 0.5em;
	
	box-shadow: 0 0 1.5em 0 rgba(0,0,0,0.4),
		inset 0 -1.5em 1.5em -1.5em #FFC373,
		inset 0 1.5em 1.5em -1.5em #FFC373,
		inset 0 1em 0 0 rgba(255,255,255,0.1);
}

/* -------------------------------News Box -----------------------------------*/

.news{
	width: 100%;
	margin: 0.5em 0;	
}
.news td{
	border: dotted thin;
	
}


.newstitle{
	padding: 0.7em 0 0.7em 0.3em;
	
}

.newsdescription{
	margin-left: 0.3em;
}


.newsthumnail{
	width: 5em;
	padding: 0.2em;
}

.picthumnail{
	height: 6em;
}


.headtitle{
	font-size: 1.2em;
	padding: 0.2em 0 0.4em 0;
	padding-top: 0.8em;
	margin-bottom: 0.8em;
	border-bottom: solid thin #0fb0cf;
}

/* Add Media Queries by Dethsada 03/04/2014 */

@media screen and (max-width: 320px) {
 /* Add your styles for devices with a maximum width of 320 */
 #ict_wrapper{width: 80%;}
}
 
@media screen and (max-width: 480px) {
 /* Add your styles for devices with a maximum width of 480 */
 #ict_wrapper{width: 85%;}
}
 
@media screen and (max-width: 768px) {
 /* Add your styles for devices with a maximum width of 768 */
 #ict_wrapper{width: 85%;}
}
 
@media screen and (max-width: 1024px) {
 /* Add your styles for devices with a maximum width of 1024 */
 #ict_wrapper{ width: 95%;}
}
 
/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
   /* Add your styles for devices with a maximum width of 1024 */
   #ict_wrapper {width: 98%;}
   
}
/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
  /* Add your styles for devices with a maximum width of 768 */
  #ict_wrapper{width: 95%;}
}

/******************************************************/