@charset "utf-8";
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background: #bbbdd4 url(images/blue-gradiant.jpg) repeat-x fixed top left;
	text-align: center;
	padding: 0;
	margin: 0;
}

#container {
	background-color: #FFFFFF;
	width: 790px;
	margin-left: auto;
	margin-top: 20px;
	margin-right: auto;
	padding-top:5px;
	text-align: center;
	margin-bottom:20px;
}

/* header and navbar code */
#header {
	background-image: url(images/header-beakers-scaled-pipe.jpg);
	background-repeat: no-repeat;
	background-position: left;
	padding: 0px;
	height: 126px;
	width: 762px;
	margin-right: 14px;
	margin-bottom: 0px;
	margin-left: 14px;
	margin-top: 15px
}

#header h1 {
	background-image: url(images/sublime-logo.gif);
	background-repeat: no-repeat;
	background-position: left;
	margin-left:220px;
	height: 126px;
	width: 323px;
	float:left;
	text-indent:-50000px
	}
	
#header-right {
	background-image: url(images/header-clean-exchanger.jpg);
	background-repeat: no-repeat;
	background-position: left;
	height: 126px;
	width: 219px;
	float:right;
	}
#titlebar {
	background-image: url(images/beakers2.jpg);
	background-repeat: no-repeat;
	background-position: left;
	height: 20px;
	width: 762px;
	margin: 0px 14px;
}

#tagline {
	background-color: #FFFFFF;
	background-image: url(images/beakers3-long.jpg);
	background-position: left;
	padding: 0px;
	height: 34px;
	width: 534px;
	margin-left: 14px;
	float:left;
	background-repeat: no-repeat;
}

#notag {
	background-color: #FFFFFF;
	background-image: url(images/beakers3-long.jpg);
	background-position: left top;
	background-repeat: no-repeat;
	padding: 0px;
	width: 762px;
	margin-top:0px;
	margin-left: 14px;
	padding-top: 20px;
	
	}

#tagline h2 {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 17px;
	font-weight: bold;
	color: #75705B;
	margin-top: 12px;
	margin-bottom: 0px;
}

#mainsub h2 {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #85806B;
}



#mainsub{
	background-image: url(images/beaker3subnav.jpg);
	background-color: #ffffff;
	background-position: top left;
	padding: 0px;
	margin: 0px 14px;
	/*float:left; */
	
	width:762px;
	background-repeat: no-repeat;
	text-align:left;
	}

#mainsub div{
	clear:both;
	width:500px;
	text-align: right;
	margin: 0px 0px 0px 50px;
	padding: 10px 0px 0px 0px;
	}

#mainsub div img{
	float:right;
	margin-left:20px;
	height:117px;
	width:300px
	}

#mainsub #subnav {
	background-color: #a39a7a;
	height: 15px;
	width: 762px;
	padding:0px;
	background-image: url(images/beaker3subnav.jpg);
	background-position: top left;
	background-repeat: no-repeat;
	margin: 0px;
	clear:none;
	}

#subnav li {
	display: inline;
	float: left;
	font-size: 10px;
	font-weight:700;
	margin: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 20px;
	color: #FFFFFF;
	list-style-type: none;
	height:15px;
}

#subnav ul {
	margin: 0px;
	padding: 0px;
	}



#titlebar ul{
	list-style-type: none;
	margin-top: 0;
	margin-right: 0px;
	margin-bottom: 0;
	margin-left: -45px;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0;
	padding-left: 0px;
	/*background-image: url(images/navbar_06.jpg); */
	width: 593px;
	/*background-repeat: repeat-x; */
}

#titlebar ul li{
	display: inline;
	float: left;
	font-size: 10px;
	font-weight:900;
	margin: 0px;
	padding-top: 1px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 15px;
	color: #FFFFFF;
	list-style-type: none;
	height:14px;
	/*background-color: #5D553E;*/
}

#navback {
	background-image: url(images/navbar_06.jpg);
	background-repeat: repeat-x;
	background-position: left;
	width: 588px;
	height: 20px;
	margin-left: 174px;
}


#titlebar a:link, #titlebar a:visited, #subnav a:link, #subnav a:visited {
	color: #FFFFFF;
	text-decoration: none;
	text-transform:uppercase;
}

#titlebar a:hover, #subnav a:hover {
	color: #FF47FF;
}

#subnav a:hover {
	 color: #AA47AA; 
}

#titlebar a:active {
	color:#FAB63B;
}

/*hilite current page */
#titlebar a.active {
	color:#FAE63B;
	cursor:default;
}

/*footer code */
#footer, #footer p {
	font-size: 9px;
	font-weight: bold;
	color: #999988;
	text-align: center;
	clear: both;
	height:4em;
	vertical-align: middle;
	line-height:2.5em;
	margin-bottom:10px
}

#footer a {
	color: #999988;
	padding-right: .7em;
}

/* generic styles */

.sectionHeader {
	font-size: 9.5px;
	background-color: #c3bdb2;
	text-align: center;
	padding: 0;
	margin-top: 0px;
	font-weight: bold;
	margin-bottom: 0px;
}

.sectionHeaderDark{
	font-size: 9.5px;
	background-color: #5D553E;
	text-align: center;
	padding: 0;
	margin-top: 0px;
	font-weight: bold;
	margin-bottom: 0px;
	color:#ffffff;
	}
	
.trademarkname{
	background:url(images/sublime-name.gif) no-repeat;
	position:relative;
}
.trademarkname strong{
	position:absolute;
	left:-9000px;
}

.super {
	font-size:65%;
	vertical-align:text-top
	}

.outline {
	background-color: #FFFFFF;
	border: 2px solid #c3bdb2;
}

.pdf {
	 background: transparent url(images/pdficon_small.gif) no-repeat top left;
	 padding-left:20px;
	 font-size:14px;
	}
/*
body.product .outline {
	border: 2px solid #5D553E;
	}
*/
.outlinedark {
	background-color: #e6e7dd;
	border: 2px solid #c3bdb2;
}

.greyback {
	background-color: #e6e7dd;
	border: none;
	}

.outlineblue {
	background-color: #d2cfd6;
	border: 2px solid #c3bdb2;
	}

li strong {
	color:#53256d;
	}

img.left {
	float:left;
	margin:.5em .5em .5em 0em;
	vertical-align:text-top;
}

img.right {
	float:right;
	margin: .5em 0em .5em .5em;
	vertical-align:text-top;
	}

img.full {
	margin-left:auto;
	margin-right:auto;
	margin-top:10px;
	margin-bottom:10px;
	}

/* 3 column home page layout */

#leftcol {
	padding: 1px, 0px, 1px, 0px;
	float: left;
	width: 262px;
	margin-left: 14px;
	background-color: #e6e7dd;
	margin-top: 0px;
	padding-top:1px;
	height:30em;
}

#middlecol {
	padding: 1px, 0px, 1px, 0px;
	background-color: #E6E7DD;
	width: 262px;
	margin-left: 284px;
	margin-top: 34px;
	padding-top:1px;
	height:30em;
}

#highlights {
	position:relative;
	margin-right: 14px;
	margin-top:14px;
	float: right;
	width: 215px;
	background-color: #ffffff;
	border: 2px solid #c3bdb2;
	text-align: left;
	padding-bottom: 100px;
	height:24.5em;
}



#highlights ul {
	padding: 0px;
	list-style-position: inside;
	list-style-type: disc;
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 0px;
	margin-left: 10px;
	overflow: hidden;
}


#highlights ul li {
	margin-bottom: 7px;
	/*font-size:10px */
	font-size:65%;
	clear:right;

}

#highlights ul li img{
	/*
	float:left; 
	margin-right: 5px;
	margin-top: 5px;
	*/
	float:right;
	margin-left: 5px;
	margin-bottom:5px;
	display:block;
	
}

#infobox {
	/*background-color: #d6d3d9;*/
	position:absolute;
	height:13.5em;
	border: transparent;
	bottom:1px;
	left:0px;
	width: 215px;
	font-weight: bold;
	font-size: 10px;
	padding-top: 0px;
	margin-top: 0px;
	padding-bottom:0px;
	z-index:100;
	
}

.infoLabel {
	color:#79786f;
	padding-left:3px;
	font-size:10px;
	}
#applicationlist {
	margin-left:10px;
	margin-right:10px;
	text-align:left;
	height:5.5em;	
}
#applicationlist ul {
	margin-top:.3em
	}

#applicationlist ul li {
	font-size:10px;
	margin-top:.3em;
	margin-left:2px;
	}

/* 3col no tag */

#colback{
	background-image: url(images/2col.gif);
	width:504px;
	float:left
	}

#colmain {
	padding: 1px, 0px, 1px, 0px;
	width: 247px;
	margin-left: 0px;
	background-color: #e6e7dd;
	margin-top: 0px;
	padding-top:1px;
	float:left;
}

#colsec {
	padding: 1px, 0px, 1px, 0px;
	width: 247px;
	margin-left: 10px;
	background-color: #e6e7dd;
	margin-top: 0px;
	padding-top:1px;
	float:right
	}

#colside {
	padding: 1px, 0px, 1px, 0px;
	width: 247px;
	margin-right: 0px;
	margin-top: 0px;
	padding-top:1px;
	float:right;
	}

/* 2 col layout */

#sidebar {
	margin-right: 14px;
	margin-top:14px;
	float: right;
	width: 215px;
	background-color: #FFFFFF;
	border: thin solid #c3bdb2;
	text-align: left;
	font-size:10px
	}

#main {
	padding: 1px, 0px, 1px, 0px;
	float: left;
	width: 533px;
	margin-left: 14px;
	background-color: #e6e7dd;
	margin-top: 0px;
	padding-top:1px;
	}

#notag #main {
	margin-left:0px;
	}
	
#notag #sidebar {
	margin-right: 0px;
	margin-top: 0px;
	padding-top:1px;
	}
	
body.about #background {
	background: url(images/faux-column2.gif) repeat-y
	}
	
body.about #sidebar {
	border: none;
	background-color: #e1e49f;
	font-size: 100%;
	}
/* 2/3 1/3 layout */
body.twothird #main {
	width:500px;
	}
	
body.twothird #sidebar {
	width:250px;
	}
	
td.maincol {
	background-color: #e6e7dd;
	margin-top: 0px;
	padding: 1px, 0px, 1px, 0px;
	text-align:left;
	width:500px;
	vertical-align: top;
	}

td.sidebar {
	margin-top: 0px;
	padding: 1px, 0px, 1px, 0px;
	text-align:left;
	width:250px;
	vertical-align: top
	}

#leftcol p, #middlecol p, #highlights p, #sidebar p, #main p, #notag p, td.maincol p, td.sidebar p  {
	text-align: left;
	margin-top: 0px;
	margin-bottom: 10px;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}

#notag li{
	padding: 0px 10px;
	text-align:left;
	margin-top:.3em;
	font-size:70%;
	}
	
#notag ol li{
	list-style-position: outside;
	padding:0px;
	margin-left:1em;
	font-size:10px;
	}
	
#notag ol {
	padding-left: 0px;
	margin-left: 30px;
	}
#notag ul{
	margin-bottom:10px;
	}
	
h2  {
	text-align: left;
	margin-top: 10px;
	margin-bottom: .1em;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 10px;
	padding-right: 10px;
}

h3  {
	text-align: left;
	margin-top: 10px;
	margin-bottom: .1em;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 10px;
	padding-right: 10px;
	font-size:70%;
	font-weight:550;
}

#question-list {
	padding: 0px 10px 10px 0px;
	}

#question-list li {
	margin-top:1em;
	}

#maincol h1 {
	padding:10px;
	font-weight:bold;
	}

/* News Page
-------------------------------------------------------------------------------------------------*/

body.news #newsmain li {
	width:300px;
	margin-left: 100px;
	padding-top: 2em;
	clear:both;
	font-size:12px;
	}
	
body.news #newsmain li h3
{
	font-size: 100%;
	padding: 0 0;
	margin: 0 0;
}

body.news #newsmain li h4
{
	font-size: 90%;
	padding: 0 0 8px 0;
	margin: 0 0;
	font-weight: 400;
}

#newsmain {
	float:right;
	width:530px;
	padding-top:10px
	}
#newsmain h1 {
	margin:0px 10px;
	font-size:17px;
	font-weight:bold;
	text-align:center
	}

#newsmain li img {
	float:right;
	margin-left:.5em;
	}
	
#newsarchive {
	width:217px;
	float:left;
	}
	
#newsarchive ul, #newsmain ul {
	list-style-type:none;
	text-align:left;
	}	
/* typography */
body {
	font-size: 100%;
	}

h1 {
	font-size: 125%;
	font-weight: normal;
	margin-top: 0em;
	margin-bottom: 0em;/*both set to zero and padding in header div is used intead to deal with compound ie pc problems that are beyound summary in a simple comment.*/
	}
h2 {
	font-size: 75%;
	font-weight: 600;
	}
h4 {
	font-size: 70%;
	margin: 1.2em 0em .5em 0em;
	font-weight: bold;
	}
h5 {
	font-size: 100%;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
h6 {
	font-size: 80%;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
img {
	border: 0;
	}

ul, ol{
	font-size: 100%;
	padding: 0px;
	margin: 0px;
	}
	
	
li {
	font-size: 60%;
	line-height: 1.3em;
	margin-top: 0.2em;
	margin-bottom: 0.1em; 
	padding: 0px;
	list-style-position: inside;
	}
	
p {
	font-size: 70%;
	line-height: 1.3em;
	margin: 1.2em 0em 1.2em 0em;
	}
	
pre {/*moz 1.0/1.1/1.2.1, net 7.0/7.01 make this way too small, but i'm not going to go larger because monospace tends to run you into overflow pretty quick. prior moz and net are okay.*/
	font-family: monospace;
	font-size: 1.0em;
	}
dt{
   font-style:italic;
   font-weight:bold;
   text-align:left;
   font-size:90%;
   margin:1em 10px .5em 10px;
  }
dd {
   text-align:left;
   margin:0px 10px;
   font-size:75%
	}

dd p {
	font-size:100%
	}

/* form styles */


fieldset {
	margin: 1em 20px 1em 20px;
	/* padding: .5em; */
	border: 1px solid #ccc;
	text-align:left;
	font-size: 10px;
	padding-left:70px
	}
	
	
body #main form fieldset p {
	margin: .5em 0 .5em 0;
	padding: 0 .5em 0 .5em;
	font-size: 10px;
	}
	
legend {
	font-weight: bold;
	color: black;
	}

label {
	float: left;
	width: 10em;
}

label.long {
	display:block;
	float:none;
	width:auto;
	margin-bottom:1em;
	margin-top:1.5em;
}

input {
	width: 200px;
	font-size:10px;
}

select, textarea{
	font-size: 12px
	}
	
#comments {
	font-size:12px;
	width:26em;
	height:17ex;
	}
	

	
input.radio, input.checkbox, input.submit {
	width:auto;
	}

fieldset.checkbox{
	margin: 1em 20px 1em 20px;
	padding: 0 .5em 0 70px;
	border: none;
	background: transparent;
}

fieldset.checkbox h3{
	width: 10em;
	float: left;
	font-size:1em;
	font-weight: normal;
	margin-bottom: .5em;
}

fieldset.checkbox h3.long{
	font-size:1em;
	font-weight: normal;
	display:block;
	float:none;
	width:auto;
}

fieldset.checkbox div{
	width: 13em;
	float: left;
	text-align: right;
	margin-top: 0px;
	padding-top: 0px
}

.clear {
	clear:both;
}

fieldset.checkbox label {
	width: 3em;
	float: none;
	display: inline;
}

#main form fieldset.checkbox p {
	margin: .2em 0;
	padding: 0px;
	text-align:right;
	
}
.error {
	color:red;
	font-weight:bold;
	}

#form-optional 
	{	
	FONT-WEIGHT: bold;	
	BACKGROUND-REPEAT: no-repeat;
	cursor: pointer;
	}
	
.opened#form-optional {	
	padding-left:1.5em;
	BACKGROUND-POSITION: 0 0px;	
	BACKGROUND-IMAGE: url(images/open-arrow.gif)} 
	
.closed#form-optional {	
	padding-left:1.5em;
	BACKGROUND-POSITION: 0 0px;	
	BACKGROUND-IMAGE: url(images/close-arrow.gif)}
	
.mceContentBody {
font-size:16px;
}

.mceContentBody td, .mceContentBody th, .mceContentBody pre {
font-size:inherit;
}
