/*	-------------------------------------------------------------
	KillPorn
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
	Description: 	Mega KillPorn homepage
	Author: 		Le Tung Lam
	Author URI: 	http://letunglam.com/
	
	Updated by: 	Le Tuan Hiep
	Updated time:   2009-06-01
	-------------------------------------------------------------	*/

/*	-------------------------------------------------------------
	Base Body Styles
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	@import 'reset.css';	
	body {
	    background: url(images/bg.gif);
	    color: #999;
	    font-size: 12px;
		line-height: 16px; 
		font-family: Arial, Helvetica, sans-serif;
	    text-align: center;
	}
	
/*	-------------------------------------------------------------
	Common Styles
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	h2 {
	    color: #a2bfed;
	    font-size: 18px;
	    padding-bottom: 10px;
	}
	h3 {
	    color: #FFAA00;
	    font-size: 14px;
	    padding-bottom: 10px;
	}
	b{
		color: #ccc;
	}
	.box-content h2 {
	    padding-bottom: 20px;
	}
	ul, ol {
	    margin: 0 1.5em 1.5em 1.5em;
	}
	li{
		padding-bottom: 5px;
	}
	ul {
	    list-style-type: circle;
	}
	
	ol {
	    list-style-type: decimal;
	}
	
	dl {
	    margin: 0 0 1.5em 0;
	}
	
	dl dt {
	    font-weight: bold;
	}
	
	dd {
	    margin-left: 1.5em;
	}
	
	a {
	    color: #999;
	    text-decoration: underline;
	}
	
	a:hover {
	    color: #fa0;
	}
	
	a img {
	    border: 0;
	}
	p{
		padding-bottom: 15px;
	}
	label { font-weight: bold; }
	
/*	-------------------------------------------------------------
	Form
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/	
	/* Fieldsets */
	fieldset    { padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc; }
	legend      { font-weight: bold; font-size:1.2em; }
	
	/* Text fields */
	input.text, input.title   { width: 300px; margin:0.5em 0.5em 0.5em 0; color: #fff; }
	input.text, input.title   { border:1px solid #666; background:#333; padding:5px; }
	input.text:focus,
	input.title:focus         { background:#444; }
	input.title               { font-size:1.5em; }
	
	/* Textareas */
	textarea            { width: 400px; height: 250px; margin:0.5em 0.5em 0.5em 0; }
	textarea            { border:1px solid #666; background:#333; padding:5px; color: #fff; }
	textarea:focus      { background:#444;; }
	
	/* Select fields */
	select              { border:1px solid #ccc; background:#f6f6f6; width:200px; }
	select:focus        { border:1px solid #999; background:#fff; }
	
	
	/* Success, error & notice boxes for messages and errors. */
	.error,
	.notice, 
	.success    { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }
	.error      { background: #FBE3E4; color: #D12F19; border-color: #FBC2C4; }
	.notice     { background: #FFF6BF; color: #817134; border-color: #FFD324; }
	.success    { background: #E6EFC2; color: #529214; border-color: #C6D880; }
	.error a    { color: #D12F19; }
	.notice a   { color: #817134; }
	.success a  { color: #529214; }
	
/*	-------------------------------------------------------------
	Layout Styles
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/	
	.download{
		width: 279px;
		height: 52px;
		overflow: hidden;
		background: url(images/download.gif) no-repeat;
		margin-bottom: 10px;
	}
	.download a{
		width: 155px;
		height: 52px;
		text-indent: -9999px;
		display: block;
		overflow: hidden;
		float: right;
	}
	.download span{
		padding: 17px 15px;
		display: block;
		font-size: 12px;
		float: left;
		width: 90px;
	}

/*	-------------------------------------------------------------
	Site Structures
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	#wrapper {
	    width: 980px;
	    margin: 0 auto;
	    text-align: left;
	}
	#right {
	    float: right;
		width: 60%;
	}
	#left {
	    float: left;
		width: 35%;
	}

/*	-------------------------------------------------------------
	Header
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	#header {
	    padding: 15px 0;
	}
	
	#logo {
	    float: left;
	}
	
	#logo h1 a {
	    background: url(images/logo.gif) no-repeat;
	    display: block;
	    height: 60px;
	    text-indent: -9999px;
	    overflow: hidden;
	}
	
	#nav {
	    width: 550px;
	    height: 53px;
	    float: right;
	    list-style-type: none;
		margin: 0;
	}
	#nav li{
		padding: 0;
		float: left;
		display: inline;
	}
	#nav a {
	    display: block;
	    float: left;
	    height: 53px;
	    text-indent: -9999px;
	    overflow: hidden;
	    background: url(images/menu_bg.gif) no-repeat;
	}
	
	#nav_download a {
	    width: 101px;
	}
	
	#nav_download a:hover,#nav_download a.active {
	    background-position: 0 -53px;
	}
	
	#nav_intro a {
	    width: 114px;
	    background-position: -101px 0;
	}
	
	#nav_intro a:hover,#nav_intro a.active {
	    background-position: -101px -53px;
	}
	
	#nav_blog a {
	    width: 110px;
	    background-position: -215px 0;
	}
	
	#nav_blog a:hover,#nav_blog a.active {
	    background-position: -215px -53px;
	}
	
	#nav_guide a {
	    width: 115px;
	    background-position: -325px 0;
	}
	
	#nav_guide a:hover,#nav_guide a.active {
	    background-position: -325px -53px;
	}
	
	#nav_contact a {
	    width: 100px;
	    background-position: -440px 0;
	}
	
	#nav_contact a:hover,#nav_contact a.active {
	    background-position: -440px -53px;
	}
	
	#banner {
	    background: url(images/banner.png) no-repeat top;
	    height: 233px;
	    overflow: hidden;
	    padding-bottom: 20px;
	}
	
	#logo {
	    width: 412px;
	    float: left;
	}
	
/*	-------------------------------------------------------------
	Content Page
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/	

	.box {background:url(images/box-bl.gif) no-repeat 0 100%}
	.box  .in1{background:url(images/box-br.gif) no-repeat 100% 100%}
	.box  .in2{background:url(images/box-tl.gif) no-repeat 0 0}
	.box  .in3{background:url(images/box-tr.gif) no-repeat 100% 0;padding:15px}
	
	#box1, #box2, #box3 {
	    float: left;
	    margin-right: 15px;
	    overflow: hidden;
	}
	
	#box1 {
	    width: 315px;
	    /*background: url(images/box_1.gif) no-repeat;*/
	}
	
	#box2 {
	    width: 294px;
	}
	
	#box3 {
	    width: 339px;
	    margin-right: 0;
	}
	

	.box-content{
		background: url(images/box_top.gif) no-repeat top;
		padding-top: 10px;
	}
	.box-content .box-inside{
		background: #1b1b1b url(images/dot.gif) repeat-y 370px 0;
		padding-left:10px;
	}
	.box-content .box-inside-one{
		background: #1b1b1b;
		padding-left:10px;
	}
	.box-end{
		background: url(images/box_bottom.gif) no-repeat bottom;
	}
	#box3 .inside{
	    background: url(images/box-inside.gif) no-repeat;
		height:203px;
		padding-top:15px;
		width:303px;
		
	}
	#box3 .inside img {border:0;margin:15px 15px 0}
	#box3  .powerby {color:#2b2b2b;font-weight:bold;position:relative;top:-20px}
	
	#footer{
		position: relative;
		height: 59px;
		margin: 15px 0;
		text-align: center;
		padding: 10px 0;
	}
	#footer p{
		padding-bottom: 5px;
		color: #666;
	}
	#footer a{
		padding: 0 10px;
	}
	.foot-logo a{
	position:absolute;
	}
	.foot-logo a{
	display: block;
	top:30px;
	}
	#foo-log-vnpt a{
	left: 260px;
	width: 48px;
	height: 46px;
	background: url(images/foot-log-vnpt.gif) no-repeat;
	}
	#foo-log-vdc a{
	left: 510px;
	top: 34px;
	width:40px;
	height:43px;
	background: url(images/vdclogo.gif) no-repeat;
	}

	#foo-log-vega a{
	right: 108px;
	width: 102px;
	height:45px;
	background: url(images/foot-log-vega.gif) no-repeat;
	}
	
/*	-------------------------------------------------------------
	Clearing floats without extra markup
	Based on How To Clear Floats Without Structural Markup by PiE
	[http://www.positioniseverything.net/easyclearing.html]
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
	
	.clear {
	    display: inline-block;
	}
	
	.clear:after, .container:after {
	    content: ".";
	    display: block;
	    height: 0;
	    clear: both;
	    visibility: hidden;
	}
	
	* html .clear {
	    height: 1%;
	}
	
	.clear {
	    display: block;
	}