/*              JBVisions Styles               */
/* -------------------------------------------
                 Global Styles
---------------------------------------------- */
html, body {background-color:#fff;
	font-family:sans-serif;
	color:#555;
	margin:0; padding:0; border:0;
}
body {font-size:62.5%;
}
acronym, abbr, .notate {cursor: help; border-bottom: 1px dotted #333;}

.orangesmall {color:#f60; background-color:inherit; font-size:100%;}
.orangebold, label {color:#f60; background-color:inherit; font-weight:bold;}
.greysmall {color:#333; background-color:inherit; font-weight:normal;font-size:80%;}
.greybold {color:#333; background-color:inherit; font-weight:bold;}
.creamback {color:inherit; background-color:#ffc;}
.peachback {color:inherit; background-color:#fec;}
input, textarea {background-color:#fec;color:inherit;}
input:focus, select:focus, textarea:focus {background:#cfc;}
input:hover, select:hover, textarea:hover {background:#cfc;}
a:link {color:#f60; background-color:inherit; text-decoration:underline;}
a:visited {color:#f60; background-color:inherit; text-decoration:underline;}
a:focus {color:#390; background-color:inherit; text-decoration:none;}
a:hover {color:#390; background-color:inherit; text-decoration:none;}
a:active {color:#390; background-color:inherit; text-decoration:none;}

blockquote {
	margin:2% 0% 0% 0%;
	padding:0px 5px 0px 10px;
	border:0;
	background-image: url('/images/oquotes.gif');
	background-position: left top;
	background-repeat: no-repeat;
}

blockquote p {border:0; margin:0; padding:0;text-indent:5px;}
blockquote p {
	background-image: url('/images/oquotesend.gif');
	background-position: right bottom;
	background-repeat: no-repeat;
}
em {font-weight:bold;color:#f60; background-color:inherit; font-size:100%;font-style:normal;}
cite {color:#f60;background-color:inherit;font-style:italic; font-family: sans-serif;
}
.standout {font-size:120%;font-weight:bold;color:#f60;background-color:#fff;text-align:left;text-transform:uppercase;}
.standout2 {font-size:120%;font-weight:bold;color:#f90;background-color:#fff;text-align:left;text-transform:uppercase;
	padding:0% 0% 0% 3%;}
.standout3 {font-size:120%;font-weight:bold;color:#fc9;background-color:#fff;text-align:left;text-transform:uppercase;
	padding:0% 0% 0% 6%;}
.portbox {clear:both;
	margin:0% 0% 3% 0%;
	overflow:hidden;}
.codeblock {border:4px ridge #ccc;color:#333;background-color:#fff;margin:0% 5% 0% 5%;padding:2%;}
/* ----------------------------------------------
    Faux columns to hold the side border images
    - outer1 holds the left border image
    - outer2 places the right border image
    For small screen devices these are removed
    - container holds the entire page content
------------------------------------------------- */

#outer1 {
	border: 0 none; width:100%; margin:auto;
	background-image: none;
	background-color:#fff;
	color:#ffc;
	/* width:expression(document.body.clientWidth > 302? "300px": "auto" ); /* this is to force IE5/6 to use a max width  */

}
#outer2 {
	border: 0 none; width:100%; margin:auto;
	background-image: none;
}

#container {
	border: 0; width:100%; margin:auto; max-width:300px;
}

/* ----------------------------------------------
    Navigation for accessibility at the top
------------------------------------------------- */
#accessbar {font-size:100%;
	font-weight:bold;
	list-style-type:none;
	text-align:left; 
	margin:0;
	padding:1% 0% 1% 0%;
	width:100%;
	max-width:300px;
	clear:both;
	float:none;
}

#accessbar ul, #accessbar li {display:block;
	margin:0; padding: 0.5% 0%  0.5% 1%;
}

#accessbar a:link, #accessbar a:visited {
	padding:0;
	margin:0;
	text-decoration:underline;
	color:#f60;
	background-color:inherit;
}

#accessbar a:focus, #accessbar a:hover, #accessbar a:active {
	background-color:#fc6;
	color: #333;
	background-image: none;
}

/* for the tooltips on the switcher */
a.info{
    position:relative; /*this is the key*/
    z-index:24; background-color:inherit;
    color:#000;
    text-decoration:none}

a.info:focus, a.info:hover, a.info:active{z-index:25;background:#fff;}

a.info span{display: none}

a.info:focus span, a.info:hover span, a.info:active span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    top:15px; left:0px; width:100px;
    padding:2px;
    background-color:#333; color:#fff;
    border:3px solid #f60;
    font-weight:bold;
    font-size:110%;
    text-align: center;}
/* -------------------------------
Hide switcher for current style
------------------------------- */
.handheld {
	display:none;
}
/* ---------------------------------------------
    The heading block with picture and text
------------------------------------------------ */
#headtext { background-color:#444;
	color:#fff;
	font-family:sans-serif;
	padding:0;
	margin: 0;
	width: 100%;
	height: 100%;
	clear:right;
	overflow:hidden;
	max-width:300px;
}

#headtext h1, #headtext h2 { 
	border-bottom:2px solid #ccc;
}
.dark {display:none;}
#headtext h1 {
	text-indent:3px;
	color:#ccc;
	background-color:inherit;
	font-size:250%;
	font-weight:bold;
	padding: 2%;
	margin:0;
	letter-spacing:normal;
}

#headtext h2 {
	color:#fc6;
	background-color:inherit;
	font-size:150%;
	text-indent:3px;
	background-image:none;
	background-position: right top;
	background-repeat:no-repeat;
	margin:0;
}
#headtext img {margin:0;}
/* ----------------------------------------
     The horizontal navigation bar
------------------------------------------- */
#hnavbar {
	background-color:#ccc;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:110%;
	font-weight:bold;
	text-align:left;
	text-transform:uppercase;
	color:#fff;
	background-image: none;
	width:100%;
	height:auto;
	margin: 0;
	padding:1% 0% 1% 0%;
	clear:both;
	max-width:300px;
}

#hnavbar ul, #hnavbar li {display:block;
	list-style-type:none;
	margin:0; padding: 0.5% 0%  0.5% 1%;
}

#hnavbar a:link, #hnavbar a:visited {
	padding:0;
	margin:0;
	text-decoration:underline;
	color:#555;
	background-color:inherit;
}

#hnavbar a:focus, #hnavbar a:hover, #hnavbar a:active {
	background-color:#fc6;
	color: #fff;
	background-image: none;
}

/* -------------------------------------------- */
/* This is to set up the current page indicator */
/* -------------------------------------------- */
body#home a#homenav,
body#design a#designnav,
body#service a#servicenav,
body#portfolio a#portnav,
body#pricing a#pricenav,
body#contact a#contactnav,
body#search a#searchnav,
body#access a#accessnav,
body#webby a#webbynav,
body#hang a#hangnav,
body#tabl a#tablenav,
body#switch a#switchnav,
body#use a#usenav,
body#tower a#towernav,
body#round a#roundnav,
body#privacy a#privnav,
body#nowrap a#nowrapnav,
body#freebie a#freebienav,
body#samples a#samplenav { color: #fff;
	background-color:inherit;
	background-image: url('../images/omenuback.jpg');
	text-decoration:none;
}

/* ---------------------------------
    This is the main content block 
   --------------------------------- */
#contentblock {color:#555;
	background-color:#fff;
	width:100%;
	clear:both;
	margin: 1% auto 0% auto;
}

/* ---------------------------------
    This is the left inner content
   --------------------------------- */
.blurbbox {float:none;
    color: #555;
	background-color:inherit;
    font-size:120%;
	font-family:sans-serif;
	border:1px solid #ca2;
	background-image:url('/images/ofadeborder.jpg');
	background-position: left bottom;
	background-repeat:repeat-x;
	width:99%;
	max-width:300px;
	padding:0;
	margin: 0;
	text-align:justify;
	overflow:hidden;
}

.blurbbox dt {font-weight:bold; color:#f60;background-color:inherit;margin:20px 0 10px 0;}
.blurbbox dd {padding:10px 0 10px 0;}
.blurbbox p, .blurbbox li, .blurbbox dl  {padding: 0 1% 0 1%;
	max-width:300px;
}
.blurbbox ul  {padding: 0% 0% 0% 2%;}
.blurbbox form {padding: 3% 1% 3% 1%;}
.blurbbox fieldset {border:0;}
.blurbbox legend {display:none;}

.blurbbox h3, .blurbbox h4, .blurbbox h5 {
	font-family:Tahoma, Arial, Verdana, Helvetica, sans-serif;
	font-size:150%;
	letter-spacing:normal;
	color:#555;
	background-color:#fff;
	border-bottom:2px solid #ccc;
	background-image: url('/images/backgrounds/osmalleye.gif');
	background-position: 99% 1% ;
	background-repeat:no-repeat;
	margin:6% 2% 2% 2%;
}
.blurbbox h3 {font-size:150%;}
.blurbbox h4 {font-size:130%;background-image:none;}
.blurbbox h5 {font-size:110%;background-image:none;border:0;}
q { margin:0px;
	padding:12px;
	background-image: url('/images/oquotes.gif');
	background-position: left top;
	background-repeat: no-repeat;font-weight:bold;
}
#contentstart { color: #333;
	background-color:#fff;
}
dt strong {
  color : #009900;background-color:inherit;
}
/* Start table structure */
#Summary, #Caption {
	width: 28em;
}

.tablestyle {
	width: 90%;
	margin: 2% 0% 2% 5%;
	border: solid #666;
	border-width: 1px 0 0 1px;
	border-collapse: collapse;
}

.tablestyle th, .tablestyle td {
	border: solid 1px #666;
	padding: 0.2em;
}
/* End table structure */

/* Start table colour scheme  */
.tablescheme, .tablescheme th, .tablescheme td {
	border-color: #666;
}

.tablescheme .even {
	background-color: #dfc; color:inherit;
}

.tablescheme th, .tablescheme thead td {
	background-color: #B1B1B1;color:#fff;
}

.tablescheme th.firstColumn {
	background-color: #D1D1D1; color:inherit;
}
/* End table colour scheme  */
/* ----------------------------------
    This is the right content column 
   ---------------------------------- */
#rightbar {
	float:none;
    color: #555;
    font-size:110%;
	font-family:sans-serif;
	border:1px solid #ca2;
	background-color:inherit;
	background-image: none;
	background-position: right top;
	background-repeat:no-repeat;
	width:99%;
	max-width:300px;
	padding:0;
	margin: 0;
}
#rightbar p {padding: 0 2% 0 2%;}

#rightbar h2, #rightbar h3 {
	font-family:sans-serif;
	font-size:150%;
	letter-spacing:-1px;
	border-bottom:2px solid #ccc;
	background-image:none;
	margin:0;
	margin:6% 2% 2% 2%;
}

#rightbar h3 {font-size: 130%;}

#rightbar li {list-style-type:none;
	margin:0;}

/* ------ miscellaneous styles ------  */
/* Shrink images to fit within viewport
some phones can't scroll horizontally. */
img	{max-width: 100%;
	}

.imgleft {float:left;
	border:0;
}
.portimg {margin: 0% 3% 0% 0%;
	border:1px solid #ccc;
	float:left;
}
.iwa {
	text-align:center;}

/* -----------------------------
    footer
-------------------------------- */

#footer {font-size:100%;
	font-weight:bold;
	text-align:left; 
	margin:auto;
	padding:3px 0px 5px 3px;
	width:100%;
	max-width:300px;
	clear:both;
}

#footer ul, #footer li {display:block;
	margin:0; padding: 0.5% 0%  0.5% 1%;
	list-style-type:none;
}

#footer a:link, #footer a:visited {
	padding:0;
	margin-left:1px;
	text-decoration:underline;
	color:#f60;
	background-color:inherit;
}

#footer a:focus, #footer a:hover, #footer a:active {
	background-color:#fc6;
	color: #333;
	background-image: none;
		text-decoration:none;
}