/**
 * @version		$Id: style.css 1 2011-01-03 15:39 Phu $
 * @package		vFramework6.theme
 * @copyright	(C) 2010 Vipcom. All rights reserved.
 * @link  		http://www.vipcom.vn
 * @license		Commercial, see license.php
 */
@charset "UTF-8";
/**
 * RESET
 */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,
samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,caption,
table,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}
body{line-height:1.2;}
ol,ul{list-style:none;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after, q:before,q:after{content:'';content:none;}
:focus{outline:none;}
* {outline: none;}
ins{text-decoration:none;}
del{text-decoration:line-through;}
table{border-collapse:collapse;border-spacing:0;}
/* End RESET */
/**
 * GRIDS - Tạo lưới trên giao diện web.
 */
.container{width:960px; padding:0;margin:auto; position:relative;} /* A container should group all your columns. */
.col-1{width:270px; float:left;background:#ececec;}
.col-2{width:690px; float:left;}
.col-3{width:328px; float:left;}
.col-4{width:328px; float:right;}
.row{width:100%;clear:both; overflow:hidden; _overflow:visible; _height:1%;}
.row-2{padding:10px 10px 0 10px; width:670px; clear:both; overflow:hidden; _overflow:visible; _height:1%;}
.header{height:160px; background:#ececec;}
.clear {clear:both;}
/* End GRIDS */

/**
 * LAYOUT - Trang trí các khối: màu nền, khung viền, hình ảnh,...
 * Trong một số trường hợp, có thể gộp chung vào phần Grids
 * hoặc tách riêng hẳn vào phần định nghĩa cho từng Module
 * Lưu ý: Chiều rộng sử dụng % để vừa với chiều rộng cột đã tạo ở Grids
 */
iframe{width:100%;height:500px;}
.logo{background: url(images/logo.png) bottom center no-repeat;}
.left-menu-box{width:265px; height:333px; background: url(images/left-menu-bg.png) top left no-repeat;}
.footer{text-align:center;margin:10px 0px;}
.box{font-size:13px;border: 1px solid #c4c3c3; padding:20px;}

#menu li{float:left;position:relative;margin-right:2px;}
#menu li a, #menu li a:visited {
  height:160px;
	display: block;
	float: left;
	background: url(images/menu-item.png) top left repeat-x;
	white-space: nowrap;
	padding: 138px 18px 0px 18px;
	font-size: 14px;
	text-decoration: none;
}
#menu li a:hover{background: url(images/menu-hover.png) top left repeat-x;}
#menu li a.active{background: url(images/menu-active.png) top left repeat-x;color:#fff;}

#menu-left {width:265px; height:333px; background: url(images/left-menu-bg.png) top left no-repeat;padding-top:30px;}
#menu-left ul li {display:block; margin-bottom:8px; padding:0 5px 8px 15px; text-align:center;background: url(images/left-menu-item.png) bottom center no-repeat;}
#menu-left ul li a {color:#ffffff; text-decoration:none;}
#menu-left ul li a:hover, #menu-left ul li a.active {color:#fa7a35; text-decoration:none;}
/* End LAYOUT */


/**
 * TYPO
 */
body{font-family:Verdana;font-size:11px;}
#menu{font-family:Times New Roman;}
#menu-left{text-transform: uppercase;}

.tiny{font-size: .6em;}
.small{font-size: .8em;}
.large{font-size: 1.2em;}

a, a:visited {color:#222;text-decoration:none;}
a:hover, a:focus{text-decoration:underline;}
a:active{color:#fa7a35;}


/**
 * CONTENT
 */
#content-wrapper{}
#content-cat{width:100%;margin-bottom:20px;}
#content-cat h2{font-size:16px;}
#content-cat ul li.hot{margin-bottom:10px;background:none;padding:0;}
#content-cat ul li.hot a{font-weight:bold;}
#content-cat ul li.hot img{float:left;margin-right:10px; margin-bottom:15px; max-height:100px;}
#content-cat ul li{background: url(images/dot.gif) 5px 4px no-repeat;padding: 0 0 3px 20px;}
#content-cat ul li a{}
#content-cat ul li span{font-size:10px;color:#666;}
#content-cat .more{text-align:right;}

#content-list{}
#content-list ul li.hot a{font-weight:bold;font-size:16px;}
#content-list ul li{margin-bottom:15px;clear:both;}
#content-list ul li a{font-weight:bold;}
#content-list ul li span{font-size:10px;color:#666;}
#content-list ul li img{float:left;margin-right:10px; margin-bottom:15px; max-height:100px;}

.block-home{margin-bottom:15px;}
.block-home h3{	width:110px;
	text-align:center;
	padding: 7px 20px 7px 10px;
	background: url(images/nav-bg.png) bottom right no-repeat;
}
.block-home div {border: 1px solid #c4c3c3;padding:10px 10px 0 10px;clear:both;}
.block-home span {width:11px;height:11px;cursor:pointer;display:block;float:right;margin:2px;position:relative;top:13px;}
.block-home span.next {background: url(images/next.gif) 0 0 no-repeat;}
.block-home span.prev {background: url(images/prev.gif) 0 0 no-repeat;}
.block-home ul {}
.block-home ul li{margin-bottom:15px;clear:both;min-height:100px;}
.block-home ul li a{font-weight:bold;}
.block-home ul li span{font-size:10px;color:#666;}
.block-home ul li img{float:left;margin-right:10px; margin-bottom:15px; max-height:100px;}

#block-left{border: 1px solid #c4c3c3; padding:10px;margin:10px;position:relative;}
#block-left h3{position:relative;left:-11px;width:150px;background:#fa7a35;text-align:center;margin-bottom:10px;padding:7px 20px 7px 10px;}
#block-left ul li{margin-bottom:15px;clear:both;height:75px;}
#block-left ul li a{font-weight:bold;}
#block-left ul li span{font-size:10px;color:#666;}
#block-left ul li img{float:left;margin-right:10px; margin-bottom:15px; max-height:75px;}

#block-banner{border: 1px solid #c4c3c3; padding:10px;margin:10px;text-align:center;}

#content-next{margin-top:30px;}
#content-next h5{padding-bottom:5px;margin-bottom:5px; border-bottom:#dbdbdb 1px dashed;}
#content-next{margin-top:15px;}
#content-next ul li{background: url(images/dot.png) 15px 4px no-repeat;padding: 0 0 3px 40px;}
#content-next ul li a{}
#content-next ul li span{font-size:10px;color:#666;}

/* Content View */
#content{line-height:1.4;}
#content h1{
	font-family: Times New Roman, Arial, Verdana;
	font-weight: bold;
	font-size: 24px;
	color: #000000;
	line-height:1;
}
#content h2, #content h3, #content h4, #content h5, #content h6{line-height:1;}
#content p{margin-bottom: 15px;}
#content a{}
#content a:hover{}
#content table{}
#content ol{}
#content ul{}
#content pre, #content code{}
#content blockquote{}
#content img{}
#content table.border {border-collapse : collapse;border: 1px solid #CCCCCC;empty-cells : show;font-weight:normal;}
#content table.border th {background-color:#E0E0E0;text-align:center;font-weight:bold;padding:2px;border: 1px solid #CCCCCC;}
#content table.border td {text-align:left;padding:2px;border: 1px solid #CCCCCC;}
#content table.border td.center {text-align:center;}
#content ul, #content ol {margin:5px 0 15px 30px;}
#content ul li, #content ol li {margin-bottom:3px;}
/* End Content View */


/**
 * FORM - Trang trí các biểu mẫu
 */
form fieldset {-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius:5px; padding-top:5px; padding-left:5px; border:1px solid #ccc; }
form fieldset legend {font-size:1.4em; padding:0 5px;}
form input[type=text], form input[type=email], form input[type=url] {-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px; height:20px; margin-bottom:5px; border:1px solid #ccc; padding:4px 0 1px 5px;}
form label {display:block; height:20px; font-size:1.2em;}
input[type=text],input[type=password] {}
/* End FORM */


/**
 * PAGING
 */
#paging-wrapper{}
#paging {margin-top:20px;text-align:center;}
#paging a {
	text-decoration:none;
	margin:2px;
	padding:2px 6px 2px 6px;
	border: 1px solid #DDDDDD;
}
#paging a:hover {
	text-decoration:none;
	margin:2px;
	padding:7px 12px 7px 12px;
	border: 1px solid #DDDDDD;
}
#paging .active {
	background:#e2e2e2;
	text-decoration:none;
	font-weight: bold;
	margin:2px;
	padding:2px 5px 2px 5px;
	border: 1px solid #CCCCCC;
}
/* End PAGING */

/* NAV */
#nav {
	width:150px;
	text-align:center;
	padding: 7px 20px 7px 10px;
	background: url(images/nav-bg.png) bottom right no-repeat;
}
#nav ul li a {
	font-size: 11px;
	font-weight: bold;
	color: #fa7a35;
	text-transform: uppercase;
}

/* CONTACT */
#contact{margin-top:20px;}
#contact form {margin-top:15px;}
#contact form input[type=text], form input[type=email], form input[type=url] {-moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px; height:20px; margin-bottom:5px; border:1px solid #ccc; padding:4px 0 1px 5px; width:300px;}
#contact table th, #contact table td {padding:3px;}
#contact table th {text-align: right; vertical-align:top;padding-top:10px;}
#contact form textarea {width:400px; height:200px;}