/*------------------------------------------------------------------------
# vannyneo4 - June 01 - 2010
# ------------------------------------------------------------------------
# Author: hoainam12k
# Websites:  http://www.vannyneo.com -  Email: hoainam12k@gmail.com
-------------------------------------------------------------------------*/

body {font: 0.75em/1.7em Verdana,Arial,Geneva,Helvetica,sans-serif; color: #333; background: url(../images/bg.png) repeat-x center top #F4F4F4}
a {text-decoration: none; outline: none; color: #000;}
/*a:visited {} */
a:hover,
li a.active {text-decoration: none; color: #00A6DD;}
/*a:active {}*/
a img {border: none}
ul li {list-style: none}
h1, h2, #content h3, .service-label {font: bold 2.5em/1.33em Arial, Helvetica, sans-serif; text-shadow:1px 1px 2px #C2C2C2; margin: 10px 0;}
#content h3 {font: bold 1.5em/1.33em Arial, Helvetica, sans-serif; margin: 10px 0; padding-bottom: 4px; border-bottom: 1px solid #EFEFEF}

.htop {background:url(../images/htop.png) no-repeat center top}
.pagewrap { width: 980px; margin: 0 auto; padding: 0 10px}

/* -----------------------------------*/
/* ---------->>> HEADER <<<-----------*/
/* -----------------------------------*/
#header {height: 168px;position: relative;}
#logo {position: absolute; left: 0px; top: 44px;}
#homepage #logo {left: 14px;}
#logo h1 {background: url(../images/sprite.png) no-repeat -57px -216px; }
#logo a {display: block; width: 200px; height: 102px; text-indent: -5000em;}


ul#nav {position: absolute; right: 0; top: 0px; height: 40px; width: 980px; font: bold 1.167em Arial, Helvetica, sans-serif; text-align: right; text-transform:uppercase; z-index: 99}
ul#nav li {list-style: none; background: none; margin: 0; padding: 0; display: inline; position: relative; z-index: 2}
ul#nav li a {color: #FFF; line-height: 40px; padding: 0 18px}
ul#nav li.back {position: absolute; background: url(../images/sprite.png) no-repeat -279px -216px; top: 0; height: 40px;z-index: 1}


#content {width: 620px; float: left; background: #fff; border: 1px solid #E2E2E2; padding: 20px}
a.vnforum {background: url(../images/sprite.png) no-repeat -647px -147px; position:fixed; text-indent:-500em; height:118px; width:33px; z-index:100000; top:159px; right:0;}

/*home*/
#col1,
#col2,
#col3 {width: 310px; float: left; margin-left: 15px; padding: 5px 0; display: inline}
#homepage .col23 {width: 635px; float: right; padding: 5px 0; margin-right: 5px; display: inline}
.col23 #col2 {margin-left: 0}
.col23 #col2,
.col23 #col3 {padding: 10px 0 5px}
.hol {height: 1px}
#homepage .column ul li {zoom: 1;}
	.slideshow {width: 635px; height: 300px; position: relative; overflow: hidden}
	/*auto paging*/
	ul.homebl {width:310px; overflow:hidden; position:relative; padding: 0 0 10px; margin:0}
	.swControls { position:absolute;bottom: 5px; right: 8px}
	.swPage {float: left; width: 310px;}
	a.swShowPage {background:url(../images/sprite.png) no-repeat 0 -181px; float:left; height:12px; margin:4px 3px; text-indent:-9999px; width:12px;}
	a.swShowPage:hover,
	a.swShowPage.active { background-position: -12px -181px;}
	.swSlider {position: absolute;}

.onfb {background: #FFF; margin-bottom: 10px}

/*node*/
.node {margin-bottom: 20px}
.node-img,
.field-field-pic {margin: 13px 0 18px; text-align: center}
.imgcenter,
.ic {text-align: center; margin: 10px 0}
.dn {display: none}
.node-img img,
.field-field-pic img,
.galimg img {padding: 10px; background: url(../images/nodeimg.gif) repeat left top}
h2.title,
h1.title {font: bold 2.5em/1.33em Arial, Helvetica, sans-serif; text-shadow:1px 1px 2px #C2C2C2; margin: 0}
.title a:focus {background: #F4F4F4; border-bottom: 1px solid #E9E9E9}
.node-desc {margin: 0 0 10px}
.il {float: left; width: 430px;font: 1em Arial, Helvetica, sans-serif; color: #999; margin-top: 19px}
	.il .name {background:url(../images/sprite.png) no-repeat left -50px; padding: 8px 0}
	.name1 {color: #999;font: 1em Arial, Helvetica, sans-serif;}
	/*.tags {float: left; width: 336px;}*/
	.tags {color: #999; margin-top: 8px; background: url(../images/sprite.png) no-repeat -658px -265px; padding-left: 25px}
	.cm {float: right; text-align: right; width: 90px}
.ir {float: right; width: 180px;}
	.buzzthis_button {float: right}
	.tweetmeme_button,
	.facebook_button {float: right; margin: 4px 0 0 8px}
.node .content a {text-decoration:underline}
	.node-body h1.title {margin-bottom: 0}
	.node-body table {border: 1px solid #999}
	.node-body table td {padding: 6px}
	.node-body .name {color: #999;padding: 0 0 8px;font: 1em Arial, Helvetica, sans-serif;}
	.node-body img {max-width: 100%}
	.node .content h2 a,
	.node .content h3 a {text-decoration:none}
	.node-dd {margin-bottom: 8px}
	.node-dd a {text-indent: -500em; display: block; float: right;background: url(../images/sprite.png) no-repeat -302px -148px;width: 104px; height: 30px}
 	a.dd-demo {background-position: -302px -148px;}
	a.dd-demo:hover {background-position:-302px -179px}
	a.dd-download {background-position: -197px -148px;}
	a.dd-download:hover {background-position:-197px -179px}
	.cap {font-style: italic; text-align: center; font-size: 0.917em; padding: 0 0 6px !important; margin-top: -10px}
	.flashcontent {text-align: center}	
	.share {margin: 15px 0}
	.share .s-tweet {float: left; width: 62px;}
	.share a {display: block; float: left; width: 62px; height: 62px; background:url(../images/social.png) no-repeat left top}
	.share a.s-delicious {background-position: -186px 0; text-indent: -500em}
	.share a.s-digg {background-position: -248px 0; text-indent: -500em}
	.share a.s-stumbleupon {background-position: -372px 0; text-indent: -500em}
	.share a.s-reddit {background-position: -310px 0; text-indent: -500em}
	.share a.s-google {background-position: -434px 0; text-indent: -500em}
	.share a.s-yahoo {background-position: -496px 0; text-indent: -500em}
	.share a.s-linkhay {background-position: -558px 0; text-indent: -500em}
	.ggplus {width: 93px; float: left}
	.fblteaster {width: 430px; float: left}
	.fblike {padding: 10px; background: #E8F0F9; border: 1px solid #ABD2E9; margin: 10px 0}
		.fblike h3 {margin: 0 0 6px!important; padding: 0 !important; color: #3A5796; border: none !important}
	/*bai tuong tu*/
	.lq-body .blcontent {border: none; padding: 0 0 0 16px; background: none}
	.lq-body .blcontent .field-item {padding: 3px 0}
	/*typo*/
	.content p {padding: 6px 0}
	.content ul {padding: 8px 0 8px 25px}
	.content ul li {list-style: disc; padding: 4px 0}
	.content ul li ol li {list-style: decimal inside; padding: 4px 0 4px 15px}
	
/* node-gallery */
.galtop {margin-bottom: 10px}
.views-row-odd .gallery,
.views-row-even .gallery {width: 300px; margin-bottom: 20px;float: left}
.views-row-even .gallery {float: right}
.galtitle {background: #222; color: #fff}
.galhv .galtitle {background: #00A6DD;}
.galtitle a {color: #FFF}
.galtitle h2 {float: left; font: italic 16px "Times New Roman", Times, serif; width: 256px; padding: 0 0 0 8px; text-shadow:1px 1px 2px #707070}
.gal-go {float: right; display: none; width: 16px; height: 16px; background:url(../images/sprite.png) no-repeat -286px -272px; text-indent: -500em; margin: 12px 10px 0 0}
.galhv .gal-go {display: block}
.galimg,
.galinfo {margin: 12px 0 0 0}
.galimg img {padding: 5px}

.galtags {float: left; width: 458px; background: url(../images/sprite.png) no-repeat -658px -265px; padding: 0 0 0 30px;}
.galgo {float: right; width: 120px;}
.galgo a {background: url(../images/sprite.png) #00A6DD no-repeat -280px -265px; color: #FFF; display: block; padding: 4px 0 5px 29px}

.galtop h2.title {float: left; width: 570px}
.galtop .gthweb {float: right; width: 30px; position: relative; font-size: 0.917em}
a#galadd {position: absolute; right: 0; top: 0;display: block; width: 30px; height: 32px;background: url(../images/sprite.png) no-repeat 0 -204px; text-indent: -500em; z-index: 20}
#gthwc {position: absolute; width: 400px; height: 170px; background: url(../images/sprite.png) no-repeat 0 -427px; padding: 25px; right: 2px; top: 5px; z-index: 10; display: none}
#gthwc h3 {margin: 0 0 5px}
.gthwconfirm {text-align: center; margin: 10px 0 0}
a.gthok,
a.gthcancel {padding: 7px 20px; background: #00A6DD; color: #fff}
a.gthcancel {background: #727272}
a.gthok:hover,
a.gthcancel:hover {color: #EAEAEA}


/*view list*/
.nodelist {border-bottom: 1px solid #E9E9E9; padding: 13px 0;}
.nodelist h2.title {font-size: 1.33em; margin: 0 0 5px; text-shadow: none}
.nodelist h2.title a {color: #3C3C3C}
.nodelist h2.title a:hover,
.nodelisthv h2.title a {color: #00A6DD}
.nltags,
.nlinfo {font-size: 11px; color: #999;}
.nltags {float: left; width: 398px;background: url(../images/sprite.png) no-repeat -658px -265px; padding-left: 24px;}
.nlinfo,
.nlshare {float: right; width: 168px; margin-left: 4px; text-align: right; }
.nlshare {width: 20px; height: 24px; position: relative}
.nllike {width: 80px; height: 24px;float: left;}
a.simpleshare {background: url(../images/sprite.png) no-repeat -57px -147px; width: 20px; height: 18px; display: block; position: absolute; left: 3px; top: 1px}
a.simpleshare:hover {background-position: -57px -166px;width: 120px; height: 24px; left: 0; top: -2px}
.listpager {margin-top: 10px}
div.simpleshare-popup {position:fixed;bottom:0px;right:0px;left:0px;z-index:1000;padding:20px 60px 20px 20px; display:none;-moz-box-shadow: #999 0px 0px 5px;-webkit-box-shadow: #999 0px 0px 5px;
  font-size:18px;line-height:30px;font-weight:300;color:#fff;background:url(../images/black90.png);}
div.simpleshare-popup a { color:#fff; }
.simpleshare-popup h2 {font-size: 1.75em; text-shadow: 1px 1px 2px #353535}
div.simpleshare-popup span.close {cursor:pointer;padding:0px 5px;line-height:20px;font-size:11px;background:#999;color:#fff; display:block;position:absolute;}

div.simpleshare-popup ul.links { margin:10px 0px 0px; }
div.simpleshare-popup ul.links a {-moz-border-radius:15px;-webkit-border-radius:15px;float: left; background:#222;padding:0px 15px;margin-right:10px;}
div.simpleshare-popup span.close {float:right; padding:0px;width:20px;height:20px; overflow:hidden;text-indent:-999px; top:20px;right:20px; background:url(../images/sprite.png) no-repeat -57px -193px;}

/*author*/
.vn-author {background: #E9E9E9; padding: 13px}
.vna-picture {width: 100px; float: left}
	.vna-picture img {border: 2px solid #F4F4F4}
.vna-info {width: 480px; float: left}
	.vna-info h4 {border-bottom: 1px dashed #A6A6A6;border-top: 1px dashed #A6A6A6; padding: 4px 0 4px 10px; text-transform:uppercase; margin-bottom: 6px}
	
/*comment*/
.comment {border: 1px solid #E2E2E2; background: #fff; padding: 16px;margin-top: 9px}
	.cm-author {width: 80px; float: left}
	.cm-author img {width: 60px; height: 60px;border: 2px solid #E2E2E2; }
	.cm-content {margin-left: 80px}	
	.indented {margin-left: 30px; padding-left: 30px; background: url(../images/indented.png) no-repeat left top}
.comment ul.links li {text-transform:uppercase; font: 0.833em Arial, Helvetica, sans-serif; padding: 0 6px 0 0}
.comment ul.links li a {color: #999}
.comment ul.links li a:hover {color: #00A6DD;}
.cma {font: 1em Arial, Helvetica, sans-serif;}
.cmd {color: #666; font: 0.917em Arial, Helvetica, sans-serif;}
.cmct {margin-top: 7px;}

.binhluan-timestamp {font-size: 0.75em; color: #999}

/*book*/
.book-navigation .page-links {border-top: 1px solid #888;border-bottom: 1px solid #888;text-align: center;padding: 0.5em;}
.book-navigation .page-previous {text-align: left;width: 42%;display: block;float: left; /* LTR */}
.book-navigation .page-up {margin: 0 5%;width: 4%;display: block;float: left; /* LTR */}
.book-navigation .page-next {text-align: right;width: 42%;display: block;float: right;}
.blcontent .book-block-menu ul li ul li {font: 1em Arial, Helvetica, sans-serif; padding: 6px 0 6px 10px}

#homepage .blcontent li.hv {background: url(../images/bl.gif) repeat-y left top}
#sidebar {width: 310px; float: right}
#block-timkiem .blcontent {padding: 13px 10px 10px}

/*panel*/
#panelwrap {position: absolute; right: 0; top: 40px; font-size: 0.75em; font-weight: bold; z-index: 100}
#panelwrap a {color: #00A6DD;}
#panel {width: 282px; height: 79px;background: url(../images/sprite.png) 0 -323px; position: absolute; top: -200px; right: 0; padding: 15px 0 0 13px}
#panel a {display: block; float: left; width: 62px; height: 62px; background-image: url(../images/sprite.png); margin-right: 7px; text-indent: -500em}
#panel a.pn-default {background-position: -295px -323px}
#panel a.pn-list {background-position: -357px -323px}
#panel a.pn-rss {background-position: -419px -323px;}
#panel a.pn-twitter {background-position: -481px -323px;}


/*paging*/
.pagerw {background: url(../images/sprite.png) no-repeat left -95px; margin: 0; height: 38px; color: #FFF;}
ul.pager-list {float: left}
ul.pager-links {float: right}
.pagerw li {margin: 0; padding: 0; display:inline; float: left}
.pagerw li a {color: #333; display: block; float: left; padding: 7px 12px}
.pagerw li a:hover {color: #FFF; background: #000}
.pagerw li.back {background: #C00; position: absolute; bottom: 3px; height: 36px; z-index:1}
.pagerw li.pager-current {padding: 7px 10px; background: #00A6DD;}
.pagerw li.pager-ellipsis {padding: 10px}

/*block*/
.block {margin-bottom: 10px}
.bl-head {background: url(../images/sprite.png) no-repeat left top; height: 34px; font: 1.333em/34px Arial, Helvetica, sans-serif; color: #fff; padding-left: 12px;}
.blcontent {border-bottom: 1px solid #E2E2E2; background: url(../images/bl.png) repeat 0 0}
.blcontent ul {margin: 0; padding: 0}
.blcontent ul li {font:1.08em Arial, Helvetica, sans-serif; border-bottom: 1px solid #EEEEEE; padding: 8px 15px; margin: 0}

.blcontent ul li a:visited {color: #333;}
.blcontent ul li a:hover,
.blcontent ul li a.active {color: #00A6DD}

#block-tagadelic-2 .blcontent {padding: 15px}
.blcontent ul.popular li {line-height: 20px}
a.blpcm {color: #595959; text-transform:uppercase; font-size: 0.75em; float: right}
a.blpcm span {background: url(../images/sprite.png) no-repeat -419px -147px; padding-left: 11px;}
a.blpcm:hover {color: #39AEE2}
a.blpcm:hover span {background-position:-419px -161px;}
#block-boost-stats {display: none}

/*link hay trong thang*/
.lh {width: 304px; height: 304px; float: left;background: url(../images/nodeimg.gif) repeat left top; position: relative; margin-bottom: 10px}
.lhhv {background: url(../images/lhhv.gif) repeat left top}
	.lhimg {position: absolute; left: 7px; top: 7px; z-index: 1}
	.lhtrans {position: absolute; left: 7px; top: 7px; z-index: 2; background: url(../images/lhtrans.png) no-repeat left top; width: 290px; height: 290px}
	#content .lh h3 {color: #FFF; position: absolute; left: 18px; top: 8px; line-height: 25px; width: 266px; z-index: 3; border: none; text-shadow: none}
	#content .lh h3 a {text-decoration:none;color: #FFF;}
	
/*footer*/
#footer {background: #33373C; border-top: 9px solid #6C7279; padding: 10px 0 30px; color: #F5F5F5; margin-top: 15px;}
#footer a {color: #F5F5F5; text-decoration: underline}
#homepage #footer .pagewrap {width: 950px}

/* slidemenu */
#slidemenu {position:fixed; left: 5px; bottom: 10px;}
#slidemenu a {display: block;width: 40px; height: 40px; background: url(../images/sprite.png) no-repeat 0 -428px; margin: 5px 0 0; text-indent: -500em}
#slidemenu a.sm-training {background-position: 0 -551px;}
#slidemenu a.sm-vnwg {background-position: 0 -510px;}
#slidemenu a.sm-qaa {background-position: 0 -469px;}
	
/**/
.fll,
.alignleft {float: left}
.flr,
.alignright {float: right}
.w50 {width: 49%}
.w30 {width: 30%}
.w70 {width: 69%}
.w40 {width: 40%}
.w60 {width: 59%}
.code {font-family: "Courier New", Courier, monospace;}
.mbt10 {margin: 0 0 10px}

/*overriden drupal */
ul.links li {display: inline}
ul.primary {border: none; -moz-border-radius-topleft:5px;
-moz-border-radius-topright:5px;
background:url(../images/black90.png) repeat scroll 0 0 transparent;
bottom:0;color:#CCCCCC;height:25px;padding:5px;position:fixed;right:20px;z-index:1000; margin: 0; line-height: 25px}
ul.primary li,
ul.primary li a,
ul.primary li.active a,
ul.primary li a:hover {background: none; border: none; color: #ccc}
ul.primary li a:hover,
ul.primary li.active a {color: #fff}
.smileys-box {display: none}

.form-submit { -moz-box-shadow:0 1px 1px #DDDDDD; -moz-border-radius:3px 3px 3px 3px; background:url(../images/bleeds.png) repeat-x scroll 0 -41px #F4F4F4; border-color:#DDDDDD #DDDDDD #CCCCCC; border-style:solid; border-width:1px; color:#333333; cursor:pointer; font-weight:normal; padding:2px 10px; text-align:center; }
.form-submit:hover { border-color:#999 #999 #888; background:#888 url(../images/bleeds.png) 0px 0px repeat-x; color:#fff; }

.input,
select { padding:2px; border-width:2px; border-style:solid; border-color:#e8e8e8 #f0f0f0 #f8f8f8; background:#fff; color:#666; max-width:100%; min-width: 200px}
.input:hover,
select:hover,
.input:focus,
select:focus { color:#333; border-color:#ace; }

.ie6warning {position: absolute; left: 220px; top: 50px; background: #C8F2F7; border: 1px solid #00A6DD; padding: 10px; width: 700px}
.ie6warning .fll div {font: bold 18px Arial, Helvetica, sans-serif}
.ie6warning .fll p {font-size: 11px}

#mobilect {padding: 20px}


/* Clearfix */
* html .clearfix {
    height: 1%; /* IE5-6 */
}

.clearfix {
    display: inline-block; /* IE7xhtml*/
}

html[xmlns] .clearfix {
    display: block; /* O */
}

.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
    line-height: 0;
    font-size: 1px;
    overflow: hidden;
}