/* YUI reset stuff */
html{color:#000;background:#fff;margin: 0; padding: 0;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;font-variant:normal;}
/* to preserve line-height and selector appearance */
/*sup {vertical-align:text-top;}*/
/*sub {vertical-align:text-bottom;}*/
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
/*to enable resizing for IE*/
input,textarea,select{*font-size:100%;}
/*because legend doesn't inherit in IE */
legend{color:#000;}

html {background:transparent url("../img/bg_checkered.png") repeat; font-family:Arial, Helvetica, sans-serif; font-size:16px;}
body{margin-top:20px;}
strong{font-weight:bold;}
em{font-style:italic;}
code{font-family:Courier,monospace;}
ol{margin-left:0.5em;}
ol li{margin-left:1em;list-style-type:decimal;padding:4px 0px;}
dt, dd{padding:6px 0px;}
dt{font-style:italic;}
a{ color: #227bbd; text-decoration:none;}
a:hover{color:#f33;}
.left{float:left;}
.right{float:right;}
.clear{clear:both;}

#container {position: relative; width: 910px; margin: -20px auto 0; padding: 0; background: #fff;}

#nav {position:relative; width:910px; height:92px; margin: 0; padding: 20px 0; background:#fff url("../img/header.png") center center no-repeat;}
#nav ul {position: absolute; top: 52px; left: 225px; overflow:hidden; list-style: none; height: 32px; margin: 0; text-transform:uppercase;}
#nav ul li {float:left; margin: 0;}
#nav a {float: left; width: 150px; height: 32px;margin: 0;  color:#333; font-weight: bold; line-height: 32px; text-align: center; text-transform: uppercase;}
#nav a:hover {color:#f33;}

.intro {width: 820px; height: 122px; margin: 0 auto; padding: 1px 45px; background: url("../img/intro.png") center no-repeat;}
.intro p {margin: 1em 0; padding: 0 20px 0 110px; color: #949494; font-size: 0.813em;}
.intro p+p {color: #1a6180; font-weight: bold;}

p.question {width: 772px; height: 59px; margin: 20px auto; background: url("../img/question-bg.png") center top no-repeat; color: #afe6f9; font-size: 1.438em; line-height: 51px; text-align: center;}
p.question strong {color: #fff; font-style: italic;}

.yes {float: left; width: 372px; height: 186px; background: url("../img/box-yes.png") no-repeat;}
.yes p {margin: 0; padding: 15px 15px 0 125px; color: #ddf7ff; font-size: 1.063em; text-align: center;}
.yes p strong {color: #fff; font-size: 1.294em;}
.yes form {width: 226px; height: 31px; margin: 10px 0 0 125px; padding: 2px; background: url("../img/code-bg.png") no-repeat; text-align: right;}
.yes form button {width: 39px; height: 31px; margin: 0; border: none; background: url("../img/code-button.png") 0 0 no-repeat; color: #fff; font-size: 0.875em; font-weight: bold; text-align: center; vertical-align: middle;}
.yes form input {width: 175px; margin: 0; padding: 4px 0; border: none; vertical-align: middle;}
.no {float: right; width: 372px; height: 186px; background: url("../img/box-no.png") no-repeat;}
.no p {margin: 0; padding: 15px 25px 0 145px; color: #e9e9e9; font-size: 1.063em; text-align: center;}
.no p strong {color: #fff; font-size: 1.294em;}
.no p a {color: #fff;}
.no p a:hover {color: #FFC90D;}

#inner{
	overflow: hidden;
	width:774px;
	margin:0px auto;
	padding:0px 63px 55px;
}
#banner_ad{
    margin: 0 auto;
	width:730px;
}

#code{
	background:white url("../img/bg_code.png") 0px 0px no-repeat;
	width:261px;
	height:126px;
	color:white;
	font-weight:bold;
	padding:12px 0 0 12px;
}
#code form{
	padding:12px 0px;
}
#code input.text{
	border:solid 1px #aaa;
	padding:4px 8px;
}
#content{
	border-top:dashed 2px #aaa;
	clear:both;
	padding-top:12px;
}
h2.tab{ width:130px; padding: 0; background: url("../img/tab_red.gif") 0 0 no-repeat; color:#fff; font-size: 1.125em; font-weight:bold; line-height: 30px; text-align: center; text-transform: lowercase; }
h3{
	font-weight:bold;
}
div.box{
	width:480px;
	margin-bottom:36px;
}
div.box div.top{
	height:16px;
	line-height:16px;
	background:transparent url("../img/box_480px_t.gif") no-repeat;
}
div.box div.bg{
	overflow:hidden;
	padding:0px 12px;
	background:transparent url("../img/box_480px_bg.gif") repeat-y;
}
div.box div.bot{
	height:8px;
	background:transparent url("../img/box_480px_b.gif") no-repeat;
	clear:both;
}
div.box.small{
	width:273px;
}
div.box.small div.top{
	background:transparent url("../img/box_280px_t.gif") no-repeat;
}
div.box.small div.bg{
	background:transparent url("../img/box_280px_bg.gif") repeat-y;
}
div.box.small div.bot{
	background:transparent url("../img/box_280px_b.gif") no-repeat;
}
div.box.info div.top{
	height:31px;
	background:transparent url("../img/sidebox-top.png") no-repeat;
}
div.box.info div.top h2{
	color:white;
	font-weight:bold;
	padding:0 12px;
	margin: 0;
	line-height: 31px;
}
div.box.tutorial{
	width:800px;
	position:relative;
}
div.box.tutorial div.icon{
	height:80px;
	width:81px;
	position:absolute;
	top:-18px;
	left:-48px;
}
div.box.tutorial div.icon.preparatory{
	background:transparent url("../img/icons_pat_small.gif") 0px 0px no-repeat;
}
div.box.tutorial div.icon.solution{
	background:transparent url("../img/icons_pat_small.gif") -81px 0px no-repeat;
}
div.box.tutorial div.icon.tip{
	background:transparent url("../img/icons_pat_small.gif") -162px 0px no-repeat;
}
div.box.tutorial div.top{
	height:24px;
	background:transparent url("../img/box_760px_t.gif") no-repeat;
}
div.box.tutorial div.bg{
	background:transparent url("../img/box_760px_bg.gif") repeat-y;
	padding:24px;
}
div.box.tutorial div.bot{
	height:10px;
	background:transparent url("../img/box_760px_b.gif") no-repeat;
}
div.box.tutorial h3{
	font-weight:bold;
	font-size:140%;
	padding-bottom:8px;
}
div.box.tutorial div.content{
	border-top:dashed 2px #aaa;
	padding-top:12px;
}
div.box p{
	padding:12px 0px;
}
div#nav_pat ul li{
	overflow:hidden;
	float:left;
	width:140px;
	height:140px;
	text-align:center;
}
div#nav_pat ul li a{
	height:100px;
	width:101px;
	text-decoration:none;
	display:block;
	color:#333;
}

div#nav_pat ul li a span{
	position:relative;
	top:100px;

}
div#nav_pat ul li.preparatory a{
	background:transparent url("../img/icons_pat.gif") 0px 0px no-repeat;
}
div#nav_pat ul li.solution a{
	background:transparent url("../img/icons_pat.gif") -101px 0px no-repeat;
}
div#nav_pat ul li.tip a{
	background:transparent url("../img/icons_pat.gif") -202px 0px no-repeat;
}
div#nav_pat ul li.preparatory a:hover{
	background:transparent url("../img/icons_pat.gif") 0px -100px no-repeat;
}
div#nav_pat ul li.solution a:hover{
	background:transparent url("../img/icons_pat.gif") -101px -100px no-repeat;
}
div#nav_pat ul li.tip a:hover{
	background:transparent url("../img/icons_pat.gif") -202px -100px no-repeat;
}
div#welcome{
	padding:24px 0px;
}
#subjects ul{
	padding:0px 36px;
	margin:12px 0px 36px 0px;
}
#subjects li.title{
	color:#333;
	padding:8px 0px;
	font-weight:bold;
}
#subjects li, #links li a, #disclaimer {
	color:#999;
}
#subjects ul.left{
	border-right:solid 1px #aaa;
}
a, #subjects span.new{
	color:#227BBD;
	font-weight:bold;
}
#welcome_img{
	text-align:center;
}
.info{
	margin:24px 0 0 0;
}
.info li, #question li{
	width:80%;
	padding:12px 0;
	margin:0 4%;
	border-bottom:solid 1px #aaa;
}
.info li.last, #question li.last{
	border-bottom:none;
}
.info li a{
	text-decoration:none;
}
a:hover, #links li a:hover, #disclaimer a:hover{
	color:#f33;
}
div#disclaimer{width: 910px; margin:0 auto;background: #fff; font-size: 0.875em; text-align:center;}
div#disclaimer a {font-weight: normal;}
div#disclaimer ul {margin: 0 20px; padding: 20px 0; border-top: 1px solid #dedede;}
div#content ol, div#content ol li{
	list-style-type:none;
}
ul.questionOptions{
	clear:both;
	list-style-type:none;
}
ul.questionOptions li{
	list-style-type:none;
	float:left;
	padding:0;
	margin:8px;
}
ul.questionOptions li p{
	margin:12px 0px 12px 32px;
	width:200px;
}
ul.questionOptions li a{
	display:block;
	overflow:hidden;
	width:50px;
	height:50px;
}
ul.questionOptions li a span{
	display:none;
}
ul.questionOptions li.preparation a{
	background:transparent url("../img/icons_pat_50px.gif") 0px 0px no-repeat;
}
ul.questionOptions li.answer a{
	background:transparent url("../img/icons_pat_50px.gif") -50px 0px no-repeat;
}
ul.questionOptions li.tip a{
	background:transparent url("../img/icons_pat_50px.gif") -100px 0px no-repeat;
}
ul.questionOptions li.preparation a:hover{
	background:transparent url("../img/icons_pat_50px.gif") 0px -50px no-repeat;
}
ul.questionOptions li.answer a:hover{
	background:transparent url("../img/icons_pat_50px.gif") -50px -50px no-repeat;
}
ul.questionOptions li.tip a:hover{
	background:transparent url("../img/icons_pat_50px.gif") -100px -50px no-repeat;
}
#samples ul{
	margin:12px 0px 24px 0px;

}
#samples ul li{
	padding:8px 0px;
}
/* IE6 hacks here */
/* * html #nav{ */  /* relative positioning doesn't work for nav bar in IE6 */
	/*width:855px;*/
	/*margin:0px auto;*/
/*}*/


