@charset "utf-8";
/* Playstone CSS Document */

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, sub, sup, tt, var,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; 
	padding: 0; 
	border: 0; 
	outline: 0; 
	font-weight: inherit; 
	font-style: inherit; 
	font-size: 100%;
	font-family: inherit; 
	vertical-align: baseline; 
	list-style: none;}
body {
	font-size: 62.5%; 
	font-family: Arial, sans-serif; 
	color: #333; 
	text-align: center;
	background: #f4f4f4 url(/images/body-low-2.png) 0 0 repeat-x; 
	margin: 0; 
	padding: 0; 
	height: 100%;}
body#page1 {
	background-image: url(/images/body-high-2.png);}
img {
	border: none;}

/* main elements and fonts
================================================ */
h2 {
	font: normal 2.2em Arial, serif; 
	color: #9c0226; 
	background: url(/images/line-grey.png) bottom repeat-x; 
	padding: .7em 0 .3em 0; 
	margin: .5em 0 .6em 0;}
h2 span {
	font-size: .5em;}
h3 {
	font: normal 1.7em Arial, serif; 
	color: #9c0226; 
	background: url(/images/line-grey.png) bottom repeat-x; 
	padding: .7em 0 .3em 0; 
	margin: 1em 0 .6em 0;}
p {
	font: normal 1.2em/1.6em Arial, sans-serif; 
	padding-bottom: 1em;}
p.intro {
	font-size: 1.5em; 
	color: #000;}
p.info, blockquote {
	font-family: Arial, serif; 
	font-style: italic; 
	background: url(/images/information.png) 0 .1em no-repeat; 
	padding-left: 20px; 
	margin-bottom: 1em;}
b {
	color: #000;}
em {
	font-style: italic;}
li {
	font-size: 1.2em;}
a {
	color: #9c0226; 
	text-decoration: none;}
a:hover {
	color: #9c0226; 
	text-decoration: underline;}
img.floatleft {
	float:left;
	padding-left:0px;
	padding-right:5px;
	padding-bottom:0px;
}

/* top header
================================================ */
#header {
	position: relative; 
	width: 960px; 
	height: 70px; 
	margin: 0 auto;}
#header h1 a {
	position: absolute; 
	top: 0px; 
	left: 0; 
	width: 280px; 
	height: 80px; 
	background: url(/images/logo-2.png) no-repeat; 
	text-indent: -9999px; 
	text-decoration: none; 
	border: none;}

/* top banner
================================================ */
#banner {
	position: relative; 
	width: 960px; 
	height: 99px; 
	text-align: left; 
	padding: 0 20px; 
	margin: 0 auto;}
#page1 #banner {
	height: 260px; 
	background: url(/images/halo.jpg) 0 1px no-repeat;}
#banner h2 {
	font-size: 3.6em; 
	font-family: Arial, sans-serif; 
	line-height: 99px; 
	color: #9c0226; 
	letter-spacing: .1em; 
	background: none; 
	padding: 0; 
	margin: 0;}

/* top intro section
================================================ */
#intro {
	position: absolute; 
	width: 380px; 
	height: 215px; 
	text-align: left; 
	margin-top: 25px;}
#intro h2 {
	font: normal 2em Arial, serif;}
#intro h2 span {
	font-size: 1em; 
	font-style: italic; 
	color: #001933;}
#intro div {
	position: absolute; 
	width: 100%; 
	top: 40px; 
	background: url(/images/line-blue.png) top repeat-x;}
#intro ul {
	background: url(/images/line-blue.png) bottom repeat-x; 
	padding: 5px 0;}
#intro li {
	font-size: 1.3em; 
	color: #001933; 
	background: url(/images/ok.png) 0 .4em no-repeat; 
	padding: 6px 0 6px 22px;}

/* navigation
================================================ */
#nav {
	float: right; 
	list-style: none; 
	margin-top: 22px;}
#nav li {
	display: inline;} /* IE6 fix */
#nav a {
	float: left; 
	display: block; 
	font-weight: normal; 
	font-family: Arial, sans-serif; 
	color: #FFFFFF; 
	text-decoration: none; 
	text-transform: uppercase; 
	padding: 6px 8px; 
	border: 1px solid #9c0226; 
	margin: 0 10px;}
#nav a:hover {
	color: #000000;}
#page1 #nav li#button1 a, 
#page2 #nav li#button2 a,
#page3 #nav li#button3 a,
#page4 #nav li#button4 a,
#page5 #nav li#button5 a,
#page6 #nav li#button6 a {
	background: #122c49; 
	color: #fff; 
	border: 1px solid #011327;}

/* content area
================================================ */
#content {
	width: 1000px; 
	text-align: left; 
	margin: 10px auto 50px auto; 
	overflow: auto;}
.checklist li {
	line-height: 1.6em; 
	background: url(/images/tick.png) left 1px no-repeat; 
	padding: 0 0 .5em 20px;}
.right {
	float: right;}
.entries li a {
	display: block; 
	width: 230px; 
	line-height: 1.6em; 
	color: #333; 
	text-decoration: none; 
	background: url(/images/page.png) 3px .7em no-repeat; 
	padding: .5em 0 .5em 20px; 
	border-bottom: 1px dotted #bbb;}
.entries li a:hover {
	color: #369; 
	background-color: #fff;}
.entries li a.selected {
	font-weight: bold; 
	color: #000;}
.strong_text { 
	font-weight:bold;}
.design_by {
	font-size:0.8em;}

/* column
================================================ */
.col {
	float: left; 
	padding: 10px 20px;}
.narrow {
	float: left; 
	width: 250px;}
.medium {
	float: left; 
	width: 380px;}
.semiwide {
	float: left; 
	width: 450px;}
.wide {
	float: left; 
	width: 670px;}
.fullwidth {
	float: left;
	width: 950px;
}
.col_inside {
	float: left; 
	padding: 10px 20px 0px 0px;
}
.col_left {
	float:left;
	width:300px;
}
/* service page layout
================================================ */
#service td {
	width: 335px; 
	vertical-align: top; 
	padding: 10px 40px 10px 0;}
.service {
	padding: 8px 0;}
.service h3 {
	font: bold 1.3em Arial, sans-serif; 
	background: none; 
	padding: 0; 
	margin: 0 0 .3em 0;}
.service img {
	float: left; 
	width: 64px; 
	height: 64px; 
	margin-right: 17px; 
	display:block;}
.service p {
	padding-bottom: 0; 
	margin-left: 65px;}

/* portfolio layout
================================================ */
#project {
	margin-top: 40px; 
	overflow: hidden;}
#project a img {
	width: 620px; 
	height: 270px; 
	padding: 0 25px;} 

/* home page slideshow layout
================================================ */
#slideshow {
	position: absolute; 
	width: 500px; 
	height: 220px; 
	left: 440px; 
	top: 25px;}
#slides {
	height: 220px; 
	overflow: hidden;} /* in case JS is off */
#controller {
	display: none;}
.jFlowPrev, .jFlowNext {
	position: absolute; 
	top: 89px; 
	display: block; 
	width: 41px; 
	height: 41px; 
	text-indent: -9999px; 
	cursor: pointer;}
.jFlowPrev {
	left: -50px; 
	background: url(/images/button-prev.png) no-repeat scroll top right;}
.jFlowNext {
	right: -50px; 
	background: url(/images/button-next.png) no-repeat scroll top right;}	
.jFlowPrev:active, .jFlowNext:active {
	background-position: bottom right; outline: none;}

/* page footer
================================================ */
#footer {
	width: 960px; 
	padding: 10px 0; 
	margin: 0 auto; 
	border-top: 5px solid #9c0226; 
	overflow: auto;}
#footer p {
	padding: 0;}
#footer p#left {
	float: left;}
#footer p#right {
	float: right;}

/* sample SMS table
================================================ */
#sms td {
	font: bold 1.4em Arial, sans-serif; 
	padding: 10px 40px 10px 0;}
.sms {
	padding: 8px 0;}
.sms p {
	padding-bottom: 0; 
	margin-left: 65px;}

/* Table CSS layout */

.datatable {
	/*border: 1px solid #1E79CB;*/
	font-size: 1em; 
	font-family: Arial, sans-serif; 
	padding: 2px 0px 2px 0px;
	width: 95%;
}
.datatable tr.row1 td{
	/*background-color:#CCC;*/
	padding: 5px 0px 5px 0px;
}

.datatable tr.row2 td{
	background-color:#999;
}