/*-----------------------------------------------------------------------------
	Hyla Philippines Stylesheet v1.0
	By: Lester Reyes (jlrworks.com)
	Main Stylesheet
-----------------------------------------------------------------------------*/

body {
	background: #76C815 url(../images/bg-overall.jpg) repeat-x 0 0;
	font-family: "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
	margin-bottom: 0;
	margin-top: 0;
}

#wrapper {
	color: #FFFFFF;
	clear: both;
	font-size: 11px;
	margin-bottom: 10px;
}

#page {
	background: transparent url(../images/bg-page-bottom.png) no-repeat bottom left;
	clear: both;
	margin: 0 56px 0 72px;
	padding-bottom: 150px;
}

#page-footer {
	clear: both;
}

blockquote {
	background: transparent url(../images/quote.gif) no-repeat 5px 5px;
	color: #FF6600;
	font-style: italic;
	padding: 0;
}

a {
	color: #3775E2;
	text-decoration: none;
}

a:hover {
	color: #00BADA;
}

blockquote p 	{ padding: 0 20px 0 30px; }
hr 				{ background: #CCC; height: 1px; }
img				{ margin: 0; }
p {
	text-align: left;
}
p img			{ float: none; }
a.button 		{ float: left; }
input 			{ padding-left: 0; border: 1px solid #CCCCCC;  }
ul 				{ margin-left: 15px; list-style-type: none; }
ul li 			{ padding: 3px 0 3px 9px; background: url(../images/icons/bullet_square_grey.gif) left 5px no-repeat; }
ol				{ margin-left: 35px; }
ol li {
	background-image: none;
}
label			{ font-weight: normal; }
.small			{ font-size: .9em; }
.nomargin		{ margin: 0; }
a.button, button { font-weight: normal; }

table {
	border-collapse: collapse;
}

h2 a {
	color: #3B4A25;
	text-decoration: none;
}

h3, h3 a {
	color: #0B7FBF;
	font-size: 1.3em;
	font-weight: bold;
 	letter-spacing: 0px;
	line-height: 1.2;
	margin-bottom: 7px;
	text-decoration: none;
}

h4 {
	margin-bottom: 5px;
}

em {
	font-size: 10px;
}

acronym {
	border-bottom: 1px dotted #505050;
	cursor: help;
}

/*-----------------------------------------------------------------------------
	Header
-----------------------------------------------------------------------------*/

#header {
	background: transparent url(../images/bg-header.jpg) no-repeat 0 0;
	clear: both;
	height: 175px;
}

#logo {
}

#logo h1.logo-title {
	margin: 0;
}

#logo a {
	display: block;
	height: 175px;
	margin-left: 41px;
	text-decoration: none;
	text-indent: -10000px;
	width: 831px;
}

/*-----------------------------------------------------------------------------
	Navigation & Buttons
-----------------------------------------------------------------------------*/

#nav {
	padding: 0;
}

#nav-inner {
	background: transparent url(../images/bg-nav.jpg) no-repeat 56px 0;
	height: 60px;
	text-align: center;
}

#nav ul {
	margin: 0 auto;
	padding: 0;
	width: 800px;
}

#nav ul li {
	background: none;
	float: left;
	height: 25px;
	line-height: 25px;
	list-style-type: none;
	margin: 0;
	padding: 12px 10px 0 10px;
}

#nav ul li a {
	color: #FFFFFF;
	display: block;
	float: left;
	font-family: Verdana, Tahoma, Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
	font-weight: bold;
	text-align: center;
	text-transform: uppercase;
}

#nav ul li a:hover {
	color: #EEEEEE;
}

/*-----------------------------------------------------------------------------
	Main Content
-----------------------------------------------------------------------------*/
#maincontent {
	background-color: #FFFFFF;
	clear: both;
	color: #505050;
	margin: 0 16px 0 0;
	width: 800px;
}

#maincontent-inner {
	padding: 5px 10px;
}

#maincontent h2.title {
	border-bottom: 1px solid #CCCC33;
	color: #00AEFF;
	font-family: "Lucida Grande", Verdana, sans-serif;
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 1em;
}

#maincontent h2.sub-title {
	color: #3B69D6;
	font-size: 14px;
	font-weight: bold;
}

#maincontent h3.title {
	font-family: "Lucida Grande", Verdana, sans-serif;
	font-size: 16px;
}

#maincontent h3.sub-title {
	color: #13906A;
	font-size: 15px;
}

#maincontent h3.georgia {
	font-family: Georgia, "Times New Roman", "Bitstream Vera Serif", serif;
}

#maincontent h4.title {
	color: #FFFFFF;
	font-family: "Lucida Grande", Verdana, sans-serif;
}

#maincontent h4.sub-title {
	color: #FF6600;
}

/*-----------------------------------------------------------------------------
	Footer
-----------------------------------------------------------------------------*/

#footer {
	background: transparent url(../images/bg-footer.gif) no-repeat 72px 0;
	font-size: 10px;
	height: 32px;
	line-height: 32px;
	text-align: center;
}

/*-----------------------------------------------------------------------------
	Divisions
-----------------------------------------------------------------------------*/

div.panel-left {
	float: left;
	width: 274px;
}

div.panel-left div.panel-inner {
	margin: 0 10px 0 0;
}

div.panel-right {
	float: left;
	width: 506px;
}

div.panel-right div.panel-inner {
	padding-right: 5px;
}

div.left-top {
	background: #389511 url(../images/left-top.jpg) no-repeat 0 0;
	color: #EEEEEE;
	padding: 15px 10px 5px 10px;
}

div.left-top a {
	color: #D9DDE9;
}

div.left-top a:hover {
	color: #AFBBDE;
}

div.left-bottom {
	background: transparent url(../images/left-bottom.jpg) no-repeat 0 0;
	height: 15px;
}

/*-----------------------------------------------------------------------------
	Elements
-----------------------------------------------------------------------------*/
/** about-us **/
ul.about-us-tabs {
	border-bottom: 1px solid #CCCC33;
	margin: 0 0 15px 0;
}

ul.about-us-tabs li {
	background: none;
	float: left;
	font-weight: bold;
	padding: 2px 5px;
}

ul.about-us-tabs li a {
	font-weight: normal;
}

span.year {
	color: #FF0000;
	font-size: 10px;
	font-weight: bold;
}

/** product **/
div.tab-content {
	margin-bottom: 1em;
	padding-bottom: 1em;
}

ul.product-tabs,
ul.product-accessories {
	margin: 0;
}

ul.product-tabs li {
	margin: 5px 0;
	padding: 0;
}

ul.product-tabs li a {
	background: transparent url(../images/bg-tabs.gif) no-repeat 0 0;
	color: #999900;
	display: block;
	height: 27px;
	line-height: 24px;
	padding-left: 10px;
	width: 240px;
}

ul.product-tabs li a:hover {
	background: transparent url(../images/bg-tabs.gif) no-repeat 0 -27px;
	color: #FF6600;
}

ul.product-tabs li.ui-tabs-selected a {
	font-weight: bold;
}

ul.product-tabs li.ui-tabs-selected a:hover {
	background: transparent url(../images/bg-tabs.gif) no-repeat 0 0;
	color: #999900;
}

ul.product-accessories li {
	background: none;
	float: left;
	margin: 2px 3px;
	min-height: 170px;
	padding: 0;
	text-align: center;
	width: 116px;
}

ul.product-accessories li a {
	border: 1px solid #EEEEEE;
	display: block;
	height: 110px;
	width: 110px;
}

ul.product-accessories li a:hover {
	border: 1px solid #CCCCCC;
}

ul.product-accessories li span {
	font-weight: bold;
}

table.specs td.th {
	text-align: right;
}

table.specs td,
table.compare td,
table.compare th {
	padding: 4px 6px;
	vertical-align: middle;
}

table.specs td.th,
table.compare th {
	background-color: #EEEEEE;
	font-weight: bold;
}

table.compare td.th {
	font-weight: bold;
}

table.compare th,
table.compare td {
	text-align: center;
}

span.mini {
	font-size: 10px;
	font-style: italic;
}

div.product-demo {
	clear: both;
	height: 204px;
	margin: 0 auto;
	padding-bottom: 20px;
	width: 400px;
}

div.filter-demo {
	clear: both;
	height: 290px;
	width: 506px;
}

/** dust-mites **/
div.micron {
	margin: 0 auto;
	margin-bottom: 1.5em;
	width: 400px;
}

/** versus **/
blockquote.hepa {
	color: #505050;
	font-style: normal;
}

/** contact-us **/
div.map img {
	border: 1px solid #CCCCCC;
	padding: 2px;
}

div.contact-form {
	text-align: left;
}

div.contact-form div.note {
	background-color: #F2FBEA;
	border: 1px solid #999933;
	margin: 10px 0;
	padding: 5px;
}

div.contact-form {
	padding-bottom: 15px;
}

div.contact-form fieldset {
	border-bottom: 1px solid #999933;
	margin: 0 0 7px 0;
	padding: 0;
}

div.contact-form label {
	color: #356AA0;
	float: left;
	font-size: 12px;
	font-weight: bold;
	line-height: 40px;
}

div.contact-form input.custom,
div.contact-form textarea {
	float: right;
	width: 300px;
}

div.contact-form textarea {
	height: 200px;
}

div.input-buttons input.button {
	padding: 4px;
}

.senderror {
	background-color: #FBE3E4;
	border: 1px solid #FF0000;
	font-size: 10px;
	font-weight: bold;
	padding: 5px;
}

.sendsuccess {
	background-color: #CDEB8B;
	border: 1px solid #999933;
	font-size: 10px;
	font-weight: bold;
	padding: 5px;
}

.goback {
	margin-top: 10px;
	text-align: center;
}

.goback a {
	font-weight: bold;
}

/*-----------------------------------------------------------------------------
	Images
-----------------------------------------------------------------------------*/

img.left {
	float: left;
	margin: 0 5px 10px 0;
	text-align: left;
}

img.right {
	float: right;
	margin: -5px 5px 10px 10px;
	text-align: right;
}

img.center {
	text-align: center;
}

/*-----------------------------------------------------------------------------
	Misc
-----------------------------------------------------------------------------*/

.clear {
	clear: both;
}

.hidden {
	display: none;
	visibility: hidden;
}

.float-left {
	float: left;
}

.float-right {
	float: right;
}

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

.align-center {
	text-align: center;
}

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

.align-justify {
	text-align: justify;
}

.align-justify p {
	text-align: justify;
}

.mall5 {
	margin: 5px;
}

.mall10 {
	margin: 10px;
}

.mlr10 {
	margin-left: 10px;
	margin-right: 10px;
}

.mtb10 {
	margin-bottom: 10px;
	margin-top: 10px;
}

.mrb10 {
	margin-bottom: 10px;
	margin-right: 10px;
}

.mlb10 {
	margin-bottom: 10px;
	margin-left: 10px;
}

.mb10 {
	margin-bottom: 10px;
}

.ml10 {
	margin-left: 10px;
}

.mr10 {
	margin-right: 10px;
}

.mt10 {
	margin-top: 10px;
}

.pall5 {
	padding: 5px;
}

.pall10 {
	padding: 10px;
}

.plr10 {
	padding-left: 10px;
	padding-right: 10px;
}

.ptb10 {
	padding-bottom: 10px;
	padding-top: 10px;
}

.pall20 {
	padding: 20px;
}

.nomar {
	margin: 0;
}

.nopad {
	padding: 0;
}

.border-left {
	border-left: 1px solid #6A7596;
}

.border-right {
	border-right: 1px solid #6A7596;
}

.divider {
	border-bottom: 1px solid #6A7596;
	margin: 0 10px;
}

.white {
	color: #FFFFFF;
}

.black {
	color: #000000;
}

.size11 {
	font-size: 11px;
}

.underline {
	text-decoration: underline;
}