body {

	background-color:#EEEEF6;

	text-align:center;

	margin:0;

	padding:0;

	font-family: Geneva, "Tahoma", "Trebuchet MS",  Arial, Helvetica, sans-serif;

	font-size:11px;

}


.medicine-img { margin:0 auto; width:auto; text-align:center; } 
*html .medicine-img img { z-index:-1; }
.medicine-tb { float:left; width:166px; text-align:center; }
.small { color:#697f83; font-size:9px; text-align:center; }

/*-------------------------------------------------------------- 

		structure

-------------------------------------------------------------- */

#wrap {

	width:990px;

	background: url(../images/shadow.jpg) repeat-y top;

	margin:0 auto;

	position: relative;

}

#content {

	width:950px;

	background: url(../images/content-bg.gif) repeat-y top;

	text-align:left;

	margin:0 auto;

	padding-bottom:10px;

	position: relative;

}

#util-nav {
    position: absolute;
    z-index: 1;
    top: 8px;
    right: 25px;
    font-size: 12px;
    }

#masthead {

	background: url(../images/header.jpg) no-repeat top;

}

#navcontainer {

	background: #F1EB95 url(../images/nav-bg.jpg) repeat-x top;/*yellow*/

	height:40px;

}

#header {

	background: url(../images/home-intro.jpg) no-repeat bottom;

	height:220px;

	width:950px;

	position:relative;

	border-top:1px solid #B5B18B;/*tan*/

	position:relative;
	z-index:0;

}


*html #header { z-index:-1; }

#sec-header {

	background: url(../images/sec-header.jpg) no-repeat bottom;

	height:120px;

	border-bottom:5px solid white;

	margin-bottom:10px;

	position:relative;

	border-top:1px solid #B5B18B;/*tan*/

	z-index:0;

}



*html #sec-header { z-index:-1; }



#intro {

	background: #FFF3C3 url(../images/home-bg.jpg) no-repeat top;

	border-bottom:8px solid white;

	padding-top:10px;

	margin-bottom:10px;

}

#intro ul {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 20px;
    font-size: 14px;
}

#intro ul li { margin-top: 5px; }



#footer {

	clear:both;

	background-color: #EEEEF6;

	background-image: url(../images/footer.jpg);

	background-repeat: no-repeat;

	background-position: top;

	width:988px;

	margin:0 auto;

	padding-top:30px;

	position: relative;

	top: 0px;

	left: 0px;

}

/*-------------------------------------------------------------- 

		logo

-------------------------------------------------------------- */

#logo {

	width:400px;

	height:100px;

	position:relative;

	font-size:10px;

	line-height:14px;

	padding:0;

	margin:0;

}

#logo a {

	color:#E95D21;

	text-decoration:none;

	padding:0;

}

#logo span {

	background: url(../images/purest-colloids.jpg) no-repeat top left;

	position:absolute;

	width:100%;

	height:100%;

}

/*-------------------------------------------------------------- 

		typography

-------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 { 

	margin:0 10px;

	padding:0;

	color:#3561A0;/*blue*/

	font-family:Geneva, "Tahoma", "Trebuchet MS", Arial, Helvetica, sans-serif;

	font-weight:normal;

}


h1 a,
h2 a { color:#3561A0; text-decoration:none; }

h1 a:hover,
h2 a:hover { text-decoration:underline; }


h1 { font-size: 20px; line-height:24px; margin-bottom:10px;}

h2 { font-size: 18px; line-height:20px; margin-bottom:7px;}

h2.product-head {clear: both; border-bottom: 1px solid #000; }

h3 { font-size: 16px; line-height:20px; margin-bottom:7px; color:#990000;/*red*/}

h4 { font-size: 14px; font-weight:bold; margin-bottom:7px;}

h5 { font-size: 12px; font-weight:bold; margin-bottom:7px;}

h6 { font-size: 11px; }

p, q {

	margin: 0 10px 14px 10px ;

	padding:0;
	
	line-height: 17px;

}

ul {

	margin: 0 10px 14px 25px;

	padding:0;

	/*list-style-position:outside;*/

}

ol {

	margin: 0 10px 14px 30px ;

	padding:0;

	list-style-position:outside;

}

a {color:#7E2425; }/*red*/

a:hover {color:#014971;}/*blue*/

/*a:visited {color:#7E3726;}/*faded red*/

a img {border:none;}



#header h1 {padding:20px 0 0 240px;}

#header-title {padding:20px 0 0 250px; font-size: 20px; line-height:24px; margin-bottom:10px; color:#3561A0;/*blue*/ font-family:Geneva, "Tahoma", "Trebuchet MS", Arial, Helvetica, sans-serif;}

#header p {padding:5px 0 5px 240px; width:250px; font-size:13px;color:#3561A0;/*blue*/}

#sec-header h1 {padding:30px 0 0 120px;}

.big {font-size:30px; line-height:35px;}

 .btn {

	background-color:#7996A3;/*blue*/

	border: 1px outset #7996A3;/*blue*/

	color:white;

	font-size:10px;

	padding:2px;
	font-size: 15px;

} 

.btn:hover {

	background-color:#7E2425;/*red*/

	border:1px outset #7E2425;/*red*/

} 



a.btn, a.btn:visited {

	text-decoration:none; 

	padding:5px;

	background-color:#7E2425;/*red*/

	border:2px outset #7E2425;/*red*/

}

a.btn:hover {

	color:white;

	background-color:#7996A3;/*blue*/

	border: 2px outset #7996A3;/*blue*/

}

hr {

	clear:both; 

	height:4px; 

	background-color:#7996A3;/*blue*/ 

	border-top:1px solid #3561A0;/*blue*/

	margin:10px 0;

}

a.pdf {
	background: url(/images/pdf-icon.gif) top left no-repeat;
	padding-left: 20px;
}

a.offsite {
	background: url(/images/offsite.gif) top left no-repeat;
	padding-left: 16px;
}

/*-------------------------------------------------------------- 

		images

-------------------------------------------------------------- */

.pic-right {float:right; margin:5px;}


/* Starburst for product pages */

#starburst {
    background: url(/images/starburst.png) no-repeat;
    width: 112px;
    height: 113px;
    color: #fff;
    text-align: center;
}
    
.product-page {
    position: absolute;
    left: 600px;
    top: 500px;
}

.starburst-text {
    margin: 30px 0 0 5px;
    width: 100px;
    font-size: 15px;
    line-height: 16px;
}

/*-------------------------------------------------------------- 

		nav

-------------------------------------------------------------- */

#nav  {

	list-style: none;

	font-size:15px;

	margin:0 0 0 10px;

	padding:0;

}

#nav a {

	display: block;

	color:#33537A;/*blue*/

	text-decoration:none;

	padding:10px 25px;

	font-weight: normal;

	border-right:1px solid #B5B18B;/*tan*/

}

#nav li a.last {border-right:none;}

#nav li a.red {color:#990000;}/*red*/

#nav a:hover {background: #C2BF8B url(../images/nav-hover.jpg) repeat-x top;}

#nav li {

	float: left;

	margin:0;

	padding:0;

}

#nav li ul {

	position: absolute;

	background-color:#FEFDE5;/*light yellow*/

	width: 16em;

	left: -999em;

	z-index:100;

	font-size:10px;

	margin:0;

	padding:0;

	border-bottom:1px solid #B5B18B;/*tan*/

	border-left:1px solid #B5B18B;/*tan*/

}

#nav li li {

	display:block;

	width: 16em;

}

#nav li ul a {

	border-bottom:1px solid #E7E3AC;/*dark yellow*/

	padding:5px 10px;

}



/*#nav li ul a:hover { background:#E7E3AC;}

#nav li:hover ul {left: auto;}

#nav li:hover ul, #nav li.sfhover ul {left: auto;}

#nav li:hover, #nav li.hover {position: static;}

*/


#nav ul { padding:0px;  }
#nav li { position:relative; }
#nav ul li { list-style-type:none; float:none; z-index:100; }
#nav ul li a { background-color:#FEFDE5; border-bottom:1px solid #E7E3AC; display:block; clear:both; position:static;  }






#nav ul,
#nav ul ul { border:1px solid #E7E3AC; margin-left:0px;}


#nav ul li a:hover, 
#nav ul li.sfhover { background:#E7E3AC; text-decoration:none; }

#nav ul li a { text-decoration:none; }


#nav ul, 
#nav li:hover ul ul, 
#nav li.sfhover ul ul,
#nav li li:hover ul, 
#nav li li.sfhover ul,
#nav li li li:hover ul, 
#nav li li li.sfhover ul { position:absolute; left: -999em; z-index:9999; }

#nav li:hover ul ul, 
#nav li.sfhover ul ul,
#nav li li:hover ul ul, 
#nav li li.sfhover ul ul { margin-left:160px ; top:0;  position:absolute; left: -999em; z-index:9999;  }


/**html #nav li:hover ul ul, 
*html #nav li.sfhover ul ul,
*html #nav li li:hover ul ul, 
*html #nav li li.sfhover ul ul { margin-left:160px; }
*/
#nav li:hover ul, 
#nav li.sfhover ul, 
#nav li li:hover ul, 
#nav li li.sfhover ul,
#nav li li li:hover ul, 
#nav li li li.sfhover ul
{ left:0; width:auto; }


/*#nav ul, 
#nav li:hover ul ul, 
#nav li.sfhover ul ul,
#nav li li:hover ul, 
#nav li li.sfhover ul,
#nav li li li:hover ul, 
#nav li li li.sfhover ul { position:absolute; left: -999em; z-index:9999; }

#nav li:hover ul ul, 
#nav li.sfhover ul ul,
#nav li li:hover ul, 
#nav li li.sfhover ul,
#nav li li li:hover ul, 
#nav li li li.sfhover ul { margin-left:150px ; top:0;  position:absolute; left: -999em; z-index:9999;  }

#nav li:hover ul, 
#nav li.sfhover ul, 
#nav li li:hover ul, 
#nav li li.sfhover ul
{ left:0; width:auto; }*/









/*-------------------------------------------------------------- 

		side nav

-------------------------------------------------------------- */

.sidenav ul {

	width:190px;

	padding:0;

	margin:0 0 15px 0;

}

.sidenav li {margin:0; padding:0; display:inline; } /* to fix li margin/padding in ie */

.sidenav ul{

	list-style-type:none;

	font-size:11px;

	margin:0;

	padding:0;

}

.sidenav a {

	color:#014971;/*blue*/

	display: block;

	padding: 5px 5px 4px 20px;

	text-decoration:none;

	border-bottom:1px solid #9CB5BA;/*med blue*/

}

.sidenav a:hover {

	color: white;

	background-color:#9CB5BA;/*med blue*/

}

.sidenav li ul {

	background-color:#8AAEC3;/*lighter med blue*/

	font-size:11px;

}

.sidenav li ul a
{ background:#efeeb8; padding:3px 5px 3px 30px;}

.sidenav li li ul a { background:#ecf4df; padding-left:50px; }


.learning ul li ul li {
    padding: 0;
}

.learning ul li a.header { font-size: 10px;  }

.learning ul li a.header:hover {
    color: #014971;
    background-color: #c6d4d8;
}

.nfirst { font-size: 13px; }

/*-------------------------------------------------------------- 

		Mesosilver List

-------------------------------------------------------------- */


ul.meso-list { font-size: 13px; }


/*-------------------------------------------------------------- 

		Columns

-------------------------------------------------------------- */



/* Use this class together with the .span-x classes

   to create any compsition of columns in a layout.

   Nesting columns works like a charm (remember .first and .last). */

   

.column {

  float: left;

  margin-right: 10px;

  padding: 0;

}

* html .column { overflow-x: hidden; } /* IE6 fix */



/* Add this class to a column if you want a border on its 

   right hand side. This should be customized to fit your needs. */



.border {

  padding-right: 4px;

  margin-right: 5px;

  border-right: 1px solid #ddd;

}

/* Use these classes to set how wide a column should be. */

.span-5   { width: 190px; }



.span-7   { width: 270px; }

.span-8   { width: 310px; }

.span-9   { width: 350px; }

.span-10  { width: 390px; }



.span-14  { width: 550px; }

.span-19  { width: 750px; }

.span-24  { width: 950px; margin: 0; }



/* The last element in a multi-column block needs this class. */

.last     { margin-right: 0; }

.clear {clear:both;}

.prepend-5   { padding-left: 200px; } 

.append-5   { padding-right: 200px; }

.advertising {float:left;width:200px;}

#login {

	position:absolute;

	top:0;

	left:760px;

	width:190px;

	padding-top:10px;

}

#login p {padding:0; font-size:10px; clear:both; color:#333;}

#login .smallform p {width:180px; padding:0; margin:3px 0;}

.sidenav {width:190px; position:absolute; top:270px; left:0; float:left; }
.badge {width:190px; position:absolute; left:0; float:left; }

*html .sidenav { z-index:-2;  }



/*-------------------------------------------------------------- 

		footer

-------------------------------------------------------------- */

#footer p {color:#333333; font-size:10px; text-align:left; margin:5px;}

#footer a {color:#97ABD5;}

#footer div {margin-left:10px;}



/*-------------------------------------------------------------- 

		forms

-------------------------------------------------------------- */

.contact input.btn {

	color:white;

	background-color:#990000;/*red*/

	border: 1px outset #990000;/*red*/

}

.contact input.btn:hover {

	background-color:#7996A3;/*blue*/

	border: 1px outset #7996A3;/*blue*/

}

.contact {margin:5px 10px 20px 20px; }

.contact label {

	width: 12em;

	float: left;

	font-size:10px;

	text-align: right;

	margin-right: 0.5em;

	display: block;

}

.contact input {

	color: #000;

	border: 1px outset #014971;/*blue*/

}

.contact textarea {

	color: #000;

	border: 1px outset #014971;/*blue*/

}

.contact fieldset {

	width: 90%;

	border: 1px outset #014971;/*blue*/

	background-color:#FFFFDF/*cream*/

}

.contact legend {

	padding: 5px;

	margin:5px 25px;

	color:#990000;/*red*/

	font-size:12px;

	font-weight:bold;

}

.smallform {width:190px; margin:0; padding:0;}

.smallform p {margin:5px; color:#333;}

.smallform label {

	width: 65px;

	float: left;

	font-size:10px;

	text-align: right;

	margin-right: 5px;

	display: block;

	font-weight:bold;

}

.smallform input {

	color: #000;

	border: 1px outset #014971;/*blue*/

	width:9em;

	font-size:10px;

}

.smallform input.small { width:1.5em;}

.smallform input.btn {

	color:white;

	background-color:#7996A3;/*blue*/

	border: 1px outset #7996A3;/*blue*/

	float:right;

	margin:3px 18px 10px 0;

	width:6em;

}

.smallform input.btn:hover {

	background-color:#6E0107;/*red*/

	border: 1px outset #6E0107;/*red*/

}

/*-------------------------------------------------------------- 

		prices

-------------------------------------------------------------- */

table.prices {

	border:1px solid white;



	margin: 0 0 0 10px;

	

}

.prices th {

	background-color:#7996A3;/*blue*/

	font-weight:bold;

	color:white;

	padding:5px 12px;

	border-bottom:1px solid white;

}

.prices td {

	background-color:#FEFDE5;/*light yellow*/

	padding:5px 12px;

}

.prices td.white {

	background-color:white; 

	border-top:1px solid white;

	padding-top:10px;

}

.prices input.btn {

	background-color:#7E2425;/*red*/

	border:1px outset #7E2425;/*red*/

	color:white;

	font-size:10px;

	padding:2px;

}

.prices input.btn:hover {

	background-color:#7996A3;/*blue*/

	border: 1px outset #7996A3;/*blue*/

}



.headerbtn {

	margin-left: 250px; 

	margin-top: -20px;

}


.left { text-align:left; }
.right { text-align:right; }







.CalHead

{

	font-weight: bold;

	font-size: 8px;

	color: #111111;

	font-family: Tahoma, Verdana, Sans-Serif;

	text-align: center;

}

.Cal

{

	font-size: 8px;

	color: #111111;

	font-family: Tahoma, Verdana, Sans-Serif;

	text-align: center;

}

.potencySubHead

{

	font-size: 10px;

	font-weight: bold;

	color: #AF3527;

	font-family:  Verdana, Tahoma, Sans-Serif;

}

.potencyNote

{

	font-size: 10px;

	font-weight: bold;

	color: #30527a;

	font-family: Verdana, Tahoma, Sans-Serif;

}

.tableHeader

{

	border-right: #30527a 1px solid;

	border-top: #30527a 1px solid;

	font-weight: bold;

	border-left: #30527a 1px solid;

	color: #30527a;

	border-bottom: #30527a 1px solid;

	font-family: Tahoma, Verdana, Helvetica, sans-serif;

	background-color: #b5c8e7;

	font-size: 11px;

}

.tableCell

{

	border-right: #30527a 1px solid;

	border-top: #30527a 1px solid;

	border-left: #30527a 1px solid;

	color: #111111;

	border-bottom: #30527a 1px solid;

	font-family: Tahoma, Verdana, Helvetica, sans-serif;

	font-size: 11px;

}




.trufiber td,
.enzalase td { padding:5px; }





/* ########################### For 404 Download Brochures Page ########################### */

.partners-area { margin:0; padding:0; width:100%; }

.partners-area li { display:inline; }
.partners-area li a { background-image:url(https://www.purestcolloids.com/images/brochure-downloads.gif); display:block; /*float:left;*/ height:116px; /*margin-left:10px;*/ margin:0 auto; width:250px;  }

.partners-area1 a { background-position:0px 0px; width:250px; }
.partners-area1 a:hover, .partners-area1 a:active { background-position:0px 116px; }

.partners-area2 a { background-position:250px 0px; width:250px; }
.partners-area2 a:hover, .partners-area2 a:active { background-position:250px 116px; }

.partners-area li span { display:none; }

#showbatchhelp, #showppmhelp, .bMulti {
    background-color:#fff;
    border-radius:15px;
    color:#000;
    display:none; 
    min-width:400px;
    min-height: 180px;
box-shadow: 0 0 25px 5px #999;
color: #111;
padding: 25px;
}
.b-close{
    cursor:pointer;
    position:absolute;
    right:10px;
    top:5px;
}