html,body{
	width:100%;
	height:100%;
	margin-top:0px;
	margin-left:0px;
	margin-right:0px;
	margin-bottom:0px;
}

body,
.tracuuBG {
		font-family:Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #333;
		background:url(../img/login_bg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top right;

	}
	
.libBG {
		font-family:Arial, Helvetica, sans-serif;
		font-size: 12px;
		color: #333;
		background:url(../img/bookshelves1.jpg) #A49A90 repeat-x fixed;
		margin-top:0px;
		margin-left:0px;
		margin-right:0px;
		margin-bottom:0px;
	}	
	.header{ height:500px; position:relative; }
	.logo{ background:url(../img/logo.png) no-repeat 0 0; background-size: contain!important; width:570px; padding-left:100px; line-height:40px; height:110px; margin:auto;position:relative; padding-top:10px;top:10px;
	font-size:30px; color:#333; font-weight:bold;}
	
	.logo2{ background:url(../img/logo2.png) no-repeat 0 0; width:355px; background-size: contain!important; padding-left:100px; line-height:40px; height:92px; margin:auto;position:relative; padding-top:10px;top:20px;
	font-size:30px; color:#0027B3; font-weight:bold;}
	
	h3 {
		margin: 0px;
		padding: 0px;	
	}
	.split{padding-left:30px; background: url(../img/book_xoan.jpg) repeat-y;}
	.sub{ font-size:16px; line-height:22px; color:#555;}
	.suggestionsBox {
		position: relative;
		left: 0px;
		margin: 0px 0px 0px 0px;
		width: 205px;
		background-color: #CCCCCC;
		/*-moz-border-radius: 7px;
		-webkit-border-radius: 7px;*/
		border: 1px solid #555;	
		color: #0000CC;
	}
	
	.suggestionList {
		margin: 0px;
		padding: 0px;
	}
	
	.suggestionList li {
		
		margin: 0px 0px 0px 0px;
		padding: 0px;
		cursor: pointer;
		list-style:none;
		white-space: normal;
	}
	
	.suggestionList li:hover {
		background-color: #659CD8;
	}


.content {
	background-color:#ffffff;
	padding:10px;
	border:1px solid #464c54; 	
	font-family:Arial, Helvetica, sans-serif;
	background-image:url(images/content_bottom.jpg);
	background-repeat:repeat-x;	 
	background-position:bottom;	
}
#content_2, #content_3 { display:none; }

.content ul {
	margin:0px;
	padding:0px 20px 0px 20px;
}
.content ul li {
	list-style:none;
	border-bottom:1px solid #d6dde0;
	padding-top:15px;
	padding-bottom:15px;
	font-size:13px;
}
.content ul li:last-child {
	border-bottom:none;
}
.content ul li a {
	text-decoration:none;
	color:#3e4346;
}
.content ul li a small {
	color:#8b959c;
	font-size:9px;
	text-transform:uppercase;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	position:relative;
	left:4px;
	top:0px;
}
.content ul li a:hover {
	color:#036;
}
.content ul li a:hover small {
	color:#036;
}

.suggestionList{ position:absolute;
	background:#0099CC;
	padding:10px;
	width:330px;
	color:#FFF;
	font-size:12px;
	display:none;
	filter: alpha(opacity=80);
	opacity: 0.8;
	-moz-opacity: 0.8;);
	border: 1px solid #555;
	z-index:1000;
	overflow:hidden;
}
.contentWrap{ z-index:10;}

.libContentWrap{width:800px; margin:auto;  margin-top:30px; }

#searchResult,#resultTratu,#searchDetail{ width:800px; margin:auto; margin-top:30px;  }
.divShadow{ -webkit-box-shadow: 5px 5px 5px #ccc;  box-shadow: 5px 5px 5px #ccc;-moz-box-shadow: 5px 5px 5px #ccc;}
.rowex { color:#666;}
.tableList { width:100%; border:1px solid #099; background:#FFF;}
.tableList th{ text-align:left; line-height:22px; background:url(../img/th.png) repeat-x; color:#FFF; padding:3px;}
.tableList td{ text-align:left; line-height:22px;  padding:3px;}

.tableList td.row0{ background:#D2EFFF;}
.tableList td.row1{ background:#F8FBFC;}

.question{ background:url(../img/hoi.png) no-repeat bottom left; height:100px;}	

.answer{ background:url(../img/dap.png) no-repeat bottom right; height:100px;}	
#rstEng{ font-size:16px; font-weight:bold; color:#F60; margin-left:40px; position:relative; width:620px;}
#rstVi{ font-size:16px; font-weight:bold; color:#060; margin-left:40px; width:620px;}

.box1{ width:698px; margin-left:100px;}
.box1 .bottom{ background:url(../img/bl.png) no-repeat bottom left; padding-bottom:10px; height:80px;}
.box1 .top{ background:url(../img/tl.png) no-repeat top left; padding-top:10px;}

.box2{ width:698px; margin-right:100px;}
.box2 .bottom{ background:url(../img/br.png) no-repeat bottom left;padding-bottom:10px;height:80px;}
.box2 .top{ background:url(../img/tr.png) no-repeat top left;padding-top:10px;}

.paging { text-align:right; margin-top:20px;}
.paging a{ padding:3px;}
.red{ color:#F00;}

.body_7,.body_24,.body_25,.body_26,.body_27,.body_7,.body_9,.body_10,.body_11,.body_12,.body_35{background:url(../img/bg.jpg) center center no-repeat fixed #02275b!important;}

.body_1,.body_4,.body_5,.body_6,.body_8,.body_19,.body_21,.body_22,.body_23,.food{ background:url(../img/food.jpg) center center no-repeat;}

.body_3,.body_21, .body_28, .body_29, .body_30,.body_31, .body_14, .body_15,.body_16, .body_17,  .language{ background:url(../img/ngonngu.jpg) center center no-repeat;}

.body_36{ background:url(../img/document.jpg) center center no-repeat #1e0403;}

.gt-icon{
	background:url(../img/icon.png) no-repeat scroll 0 0 transparent;
	background-position:-19px 0px;
	cursor:pointer;
    border: 1px solid transparent;
    border-radius: 2px 2px 2px 2px;
    float: left;
    height: 15px;
    margin-right: 0.3em;
    width: 18px;
}
.gt-icon-on{
	background:url(../img/icon.png) no-repeat scroll 0 0 transparent;
	background-position:-19px -19px;
	cursor:pointer;
    border: 1px solid transparent;
    border-radius: 2px 2px 2px 2px;
    float: left;
    height: 18px;
    margin-right: 0.3em;
    width: 18px;	
	}
	
.pathWrapContent{
	margin-left:250px; color:#555;
}
.pathWrap a:link,.pathWrap a:visited{ color:#000; text-decoration:none;}
/*#wrapCate ul{ margin:0px; padding:0px;}
#wrapCate li{ float:left; list-style:none; padding:3px 3px;}
#wrapCate a:link,#wrapCate a:visited{text-decoration:none; color:#333; white-space:nowrap; display:block; background:url(../img/cate_right.png) no-repeat top left;}
#wrapCate a span{ background:url(../img/cate_left.png) top right no-repeat; display:block; margin-left:10px; line-height:25px; padding:0px 15px 10px 0px;}*/

.divWrap{ width:1000px; margin:auto;}

.soundIcon{background:url(../img/iconsound.png) no-repeat; width:40px; height:50px; line-height:50px; padding-left:40px; display:inline-block; cursor:pointer;}

.soundIconOn{ display:inline-block; background:url(../img/iconsound.png) no-repeat; width:40px; height:50px; line-height:50px;background-position:left -50px; cursor:pointer; padding-left:55px;  cursor:pointer;}


.loginWrap {
	background-image:url("../img/loginform.png") ;
	background-size: cover;
	color: #333;
	height: 306px;
	left: 50%;
	margin: auto;
	position: absolute;
	top: 50%;
	width: 424px;
}
.loginInner { position:absolute;top:150px; left:80px;}
.error { color:#F00;}

.loginInfo{ position:absolute; background:#328AA4; border:1px solid #666; z-index:9999; color:#FFF; padding:10px;}

.bodyContent {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #999999;
    border-radius: 10px 10px 10px 10px;
    margin: 20px 0;
    position: relative;
    width: 790px;
}
.bodyContent .boxHead {
    background: url("../img/pathbg.png") no-repeat scroll left top transparent;
    height: 15px;
    left: -1px;
    position: absolute;
    top: -7px;
    width: 792px;
}
.bodyContent .boxBottom {
    background: url("../img/pathbg.png") no-repeat scroll left bottom transparent;
    bottom: -7px;
    height: 15px;
    left: -1px;
    position: absolute;
    width: 792px;
}
.bodyContent .boxContent {
    margin: 15px 25px;
}

.messageBox{ border:2px dashed #036; font-size:16px; color:#006; font-weight:bold; width:200px; margin:auto;}

.currsor{ cursor:pointer;}
/*
.txtBox{ height:23px; line-height:24px;}
.buttonSearch{ height:27px;line-height:23px;}
.txtBoxSelect{ height:28px;line-height:23px;}*/

.bookCate{ background:url(../img/book_row.jpg) repeat-y; width:800px; height:488px; position:absolute; left:50%; bottom:-2px; margin-left:-400px;}
.innerWrap { margin:35px 10px 0px 10px;}
.backDoor { height:488px;position:relative; margin-top:-18px; margin-left:53px; margin-right:53px; overflow:hidden; z-index:800}
.bookHead{ background:url(../img/bookshelves_bg.png) repeat-x; height:34px; z-index:999; position:absolute; top:-17px; left:-10px; right:-10px; width:820px;}

.bookCate a:link,.bookCate a:visited{ display:block; width:150px; height:80px; margin-left:10px; margin-bottom:40px; float:left; color:#333; text-decoration:none; font-weight:bold;}
.bookCate a:link .bookName,.bookCate a:visited .bookName{ text-align:center; margin-top:8px;}
.bookIcon{ width:80px; height:80px; margin:auto; background:url(../img/book.png);}

.itemIcon49{ background:url(../img/fmusic.png)}
.itemIcon50{ background:url(../img/video.png)}
.itemIcon51{ background:url(../img/entertainment_icon.png)}

.bookCate a:hover .bookIcon{ background-position:0 -80px;}

.left_door{ background:url(../img/left_door.png) no-repeat center right; position:absolute; top:17px; left:0px; height:488px; width:347px;  z-index:99;cursor: pointer;}

.right_door{ background:url(../img/right_door.png) no-repeat center left; position:absolute; top:17px; right:0px; height:488px; width:347px;  z-index:99; cursor: pointer;}

.libtableList{ line-height:25px; border:1px solid #ccc;}
.libtableList a:link,.libtableList a:visited{text-decoration:none; color:#666;}
.libtableList a:visited{color:#333;}
.libtableList .title{ font-size:14px; font-weight:bold; color:#333; }
.libtableList th{font-size:14px; font-weight:bold; white-space:nowrap}
.libtableList .shortDes{ color:#666}
.libtableList th{ background:url(../img/wood.png); border-bottom:1px solid #ccc; color:#FFF;}
.libtableList .row_0{ background:url(../img/wood2.png); border-bottom:1px solid #ccc; color:#333;}
.libtableList .row_1{ background:#f1f1f1; border-bottom:1px solid #ccc; color:#333;}

.iconLib{ display:block; height:42px; width:42px; background:url(../img/icon_book1.png) no-repeat;}
.iconLib_1{ background:url(../img/icon_book3.png);}
.iconLib_3 { background:url(../img/icon_audio.png);}
.itemIconBack { background:url(../img/green_arrow_up.png);}

.booktile{font-size:16px; font-weight:bold;  }
.bookinfo { border:1px solid #ccc; background:#DCD6DA; margin:10px 0px;border-radius:10px; padding:2px 10px;}
.bookcontent{ line-height:25px;}
.bookcontent .split{padding-left:30px; background: url(../img/book_xoan.jpg) repeat-y;}

.bttoolbar{ background:url(../img/icon_toolbar.png) no-repeat;  width:36px; height:36px; display:block;  float:left;}

.bttop:link,.btback:visited{ background-position:0px 0px;}
.bttop:hover{ background-position:0px -36px;}

.bthome:link,.btback:visited{ background-position:-36px 0px;}
.bthome:hover{ background-position:-36px -36px;}

.btback:link,.btback:visited{ background-position:-72px 0px;}
.btback:hover{ background-position:-72px -36px;}

.toolbar{margin:10px; float:right; clear:both;}
.shortdes{ margin:10px 0px;}

.libLogo{ color:#333; background:url(../img/logo_small.png) no-repeat; font-size:20px; line-height:20px; height:50px;padding-left: 70px;}
.sublib,
.sublib a:link,.sublib a:visited{ color:#333; text-decoration:none; font-size:12px; line-height:22px;}
.flashContent{ margin:0px!important;}
.otherItem{
	line-height:22px;
	margin-top:10px;
	border-top:1px solid #CCC;
}
.otherItem h2{ margin:5px 0px; padding:0px;}
.otherItem a:link,.otherItem a:visited{ color:#333; text-decoration:none;}
.otherItem a:hover{ text-decoration:underline;}
.otherMusic ul{ margin:0px; padding-left:20px;}
.otherMusic a:link,.otherMusic a:visited{ color:#333; text-decoration:none;}
.otherMusic a:hover{ text-decoration:underline;}

.searchBox { background:url(../img/search_bg.png) no-repeat; width:500px; height:38px; padding-top:3px;}
.searchBox .txtBox{ background:transparent;  width:380px; border:0px; }

.searchBox2 { background:url(../img/search_bg3.png) no-repeat; width:671px; height:69px; padding-top:3px;}
.searchBox2 .txtBox{ background:transparent;  width:370px; border:0px;  }
.searchBox2 .searchInner { margin-left:50px; margin-top:15px; margin-right:30px;}
.searchBox2 .txtBoxSelect{ border:0px;}
.mainmenuWrap{ position:absolute;background:#FFF; right:0px; z-index:9999; border-radius:10px; border:1px solid #ccc; display:none; opacity:0.9; filter:alpha(opacity=90);}

ul#topnav {
	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
	font-size: 1.1em;
	margin-top:-4px;
}
ul#topnav li{
	margin: 0;
	padding: 0;
	overflow: hidden;  /*--Important - Masking out the hover state by default--*/
	float: left;
	height:32px;
}
ul#topnav a, ul#topnav span { /*--The <a> and <span> share the same properties since the <span>  will be a duplicate of the <a> tag--*/
	padding: 7px 7px;
	float: left;
	text-decoration: none;
	color: #555;
	background: url(../img/a_bg.gif) repeat-x;
	clear: both;
	width: 100%;
	height: 20px;
	line-height: 20px; /*--Vertical alignment of text--*/
}
ul#topnav a{ /*--This is basically the hover state of navigation--*/
	color: #000;
	background-position: left bottom;
}
ul#topnav span{ /*--Default state of navigation--*/
	background-position: left top;
}
.itemReport{ clear:both; height:25px;}
.errorItem{ background:url(../img/btnReport.png) no-repeat; display:inline-block; width:97px;height:27px; text-decoration:none; color:#333; font-weight:bold;}
.errorItem span{ margin:5px 0px 3px 25px; display:inline-block;}

.cursor { cursor:pointer;}

.tracuuBG  .logo,.tracuuBG  .logo a:link,.tracuuBG  .logo a:visited, .tracuuBG  .logo .sublib{ color:#FFF;}
.body_0 .header { background:none;}

.shadow{text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black}

/* Styles for screens 768px or wider */
@media screen and (min-width: 768px) {
	/* Custom styles for this breakpoint */
}

/* Styles for screens 1024px or wider */
@media screen and (min-width: 1024px) {
	/* Custom styles for this breakpoint */

}

/* Styles for screens 1366px or wider */
@media screen and (min-width: 1366px) {
	/* Custom styles for this breakpoint */
	.loginWrap{
		margin-left: -150px;
		margin-top: -120px;
	}
}

/* Styles for screens 1600px or wider */
@media screen and (min-width: 1600px) {
	/* Custom styles for this breakpoint */
	.loginWrap {
		margin-left: -50px;
		margin-top: 0px;
	}
}


