@charset "UTF-8";
/* CSS Document */
/* 
CASTROL COLOR SCHEME
GREEN -- #009A4E;
RED -- #ED1B2F;
GREY -- #333;
*/
/*
use "_" to define the CSS properties that use for IE6 only
use "/" to define the CSS properties that use for IE7 only
*/
#content-header { background-image:url(../img/bg-content-top.png); width:560px; height:120px; float:left; }
#content-header h1 { color:#009A4E; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-weight:bold; font-size:36px; line-height:0.25em; display:block; width:240px; float:left; margin:15px 0px 5px 10px; /margin:5px 0px 5px 10px; padding:0px; letter-spacing: -0.05em; position:relative;}
p.preface {padding:20px 35px 5px 0px; margin:0px; color:#333;}
.preface img {display:block; padding:2px; background-color:#FFF; border:#CCC 1px solid; margin:0px 10px 10px -40px; float:left;}
p.breadcrumbs {width:520px; margin:5px 0px 0px 10px; padding:0px; /margin-top:-5px; display:block; float:left; color:#666;}
p.breadcrumbs a {text-decoration:none; color:#666;}
p.breadcrumbs a:hover {color:#ED1B2F;}

#content-body {width:560px; background-image:url(../img/bg-content-body.jpg); background-repeat:no-repeat; background-color:#FFF; float:left;}

.content-main {width:340px; padding:0px 10px 0px 10px; margin:0px; float:left;}
.content-main h2 {width:320px; padding:0px; margin:0px 0px 10px 0px; display:block; font-size:18px; line-height:1.25em; }
.content-main ul {list-style:none; display:block; margin:0px; padding:0px; border-bottom:#333 1px dotted;}
.content-main li {padding:5px 0px 5px 0px; border-top:#333 1px dotted; }
.content-main li a {text-decoration:none; color:#333;}
.content-main li a:hover {color:#ED1B2F; background-image:url(../img/bg-hilight.png);}
.content-main li span {display:block; margin-top:5px; font-size:10px; color:#666;}

.content-comment-list ul {list-style:none; display:block; margin:0px; padding:0px; border-bottom:#333 1px dotted;}
.content-comment-list li {padding:5px 0px 5px 0px; border-top:#333 1px dotted; }
.content-comment-list li a {color:#009A4E; text-decoration:underline;}
.content-comment-list li span {display:block; margin-top:5px; font-size:10px; color:#666;}

.content-comment-form {/*border-top:#CCC 1px solid;*/ padding-bottom:10px;}
.content-comment-form form {margin:0px; padding:10px 0px 0px 0px;}
.content-comment-form textarea {background-color:#FFF; border:#CCC 1px solid; width:320px; padding:5px; font-family:Arial, Helvetica, sans-serif; color:#333; font-size:1em;}
input.submit-button {background-color:#009A4E; color:#FFF; padding:3px 5px 3px 5px; border:#FFF 1px solid; margin-left:230px; width:100px;}
input.submit-button:hover {cursor:pointer; background-color:#ED1B2F;}

.pagination ul {border:none; float:right;}
.pagination li {border:none; display:block; padding:0px; margin:10px 10px 0px 0px; float:left;}
.pagination li a {color:#009A4E; text-decoration:none; display:block;}
.pagination li a:hover {color:#ED1B2F; text-decoration:none; display:block;}

/*CONTENT IMAGES*/
#content-img {width:340px; float:left; margin-bottom:10px;}
#content-img img {border:#CCC 1px solid; padding:2px 2px 5px 2px; background-color:#FFF;}
#content-img a {text-decoration:none;}

/*SUB CONTENT (SIDEBAR)*/
.content-sub {width:180px; padding:0px 10px 0px 0px; margin:0px; float:right;}
.content-sub h3 { margin:0px 0px 10px 0px; padding:0px; display:block; font-size:18px; line-height:1.25em; width: 180px;}
.content-sub ul {display:block; margin:0px 0px 10px 0px; padding:0px; list-style:none;}
.content-sub li {display:block; width:180px; padding-bottom:5px; border-bottom:#333 1px dotted;}
.content-sub li a {color:#333; text-decoration:none;}
.content-sub li a:hover {color:#333; text-decoration:none; background-image:url(../img/bg-hilight.png);}

#content-bottom {width:560px; height:20px; margin:0px; padding:0px; background-image:url(../img/bg-content-bottom.png); float:left;}
* html #content-bottom{
	margin-top:-10px;
	display:inline;
	border:none;
}

/*Q&A WITH CASTROL GURU*/
#question-submit {width:180px; height:60px; display:block;margin-bottom:10px;}
#question-submit h3 {display:none;}
#question-submit span {width:180px; height:60px;}
#question-submit span a {text-decoration:none; background-image:url(../img/bg-question-submit.png); background-position:0px 0px; width:180px; height:60px; display:block;}
#question-submit span a:hover {background-image:url(../img/bg-question-submit.png); background-position:0px 60px;}

/*Fancy text box which conduct by SPAN shape*/
.fancy-txt {font-size:36px; display:block;}

/*GURU PROFILE*/
#guru-profile {}
#guru-profile h2 {font-size:18px; margin:0px 0px 10px 0px; padding:0px;}
#guru-profile img {padding:5px; border:#CCC 1px solid; background-color:#FFF; display:block; margin-bottom:10px;}

/*Stuffs teaser*/
/*TIPS-TRICKS & Q-A*/
.teaser-box-left {width:260px; height:360px; float:left; padding:60px 10px 10px 10px; background-image:url(../img/bg-tips.png); margin-top:-20px; color:#333;}
.teaser-box-right {width:260px; height:360px; float:left; padding:60px 10px 10px 10px; background-image:url(../img/bg-qa.png); margin-top:-20px; color:#333;}
.teaser-box-left h2, .teaser-box-right h2 {margin:-10px 0px 5px 0px; padding-top:10px;}
.teaser-box-left h2 a, .teaser-box-right h2 a {text-decoration:none; color:#333; display:block;}
.teaser-box-left h2 a:hover, .teaser-box-right h2 a:hover {color:#333; background-image:url(../img/bg-hilight.png); background-repeat:no-repeat;}
.teaser-box-left ul, .teaser-box-right ul {display:block; list-style:none; margin:0px 0px 0px 20px; padding:0px;}
.teaser-box-left li, .teaser-box-right li {display:block; margin:0px 0px 5px 0px; padding-top:10px;}
* html .teaser-box-left li { margin:0px; padding:0px;}
* html .teaser-box-right li { margin:0px; padding:0px;}
.teaser-box-left li a, .teaser-box-right li a {color:#333; text-decoration:none; display:block;}
.teaser-box-left li a:hover, .teaser-box-right li a:hover {color:#ED1B2F; background-image:url(../img/bg-hilight.png); background-repeat:no-repeat;}


.content-full {width:540px; padding:0px 10px 0px 10px; margin:0px; float:left;}
.content-full-comment-form {width:540; display:block; margin:10px 0px 10px 0px; padding-bottom:10px; border-bottom:#999 1px dotted; float:left;}
.content-full-comment-form form {margin:0px; padding:0px;}
.content-full-comment-form textarea {margin:0px; padding:5px; background-color:#FFF; border:#CCC 1px solid; font-family:Arial, Helvetica, sans-serif; font-size:12px; width:520px;}
.content-full-comment-form span {display:block; float:right; width:540px;}
input.content-full-submit-button {background-color:#009A4E; color:#FFF; padding:3px 5px 3px 5px; border:#FFF 1px solid; margin-right:5px; width:100px; float:right;}
input.content-full-submit-button:hover {cursor:pointer; background-color:#ED1B2F;}