/* -----------------------------------*/
/* ---------->>> GLOBAL <<<-----------*/ 
/* -----------------------------------*/


body, dd, dl, dt, fieldset, legend, blockquote, form, h1, h2, h3, h4, h5, h6, li, ol, ul {
	margin: 0;
	border: 0 none #FFFFFF;
	padding: 0;
	}

h1, h2, h3, h4, h5, h6 {	font-weight:normal;	font-family: "Trebuchet MS",Verdana, Arial, Helvetica, sans-serif;}

h1 {	font-size:2.8em;	line-height:1.2em}
h2 {	font-size:2em;	line-height:1em;	padding-bottom:15px}
h3 {	font-size:1em}

ul {	list-style:none}

html, body {height:100%}

a {			color:#FFF;	text-decoration:underline;	background-color:transparant}
a:hover {	text-decoration:none}
a:visited {	font-style:italic}

img {border: 0}
	
/* -----------------------------------*/
/* ------>>> GLOBAL STYLING <<<-------*/ 
/* -----------------------------------*/

.navbar-collapse {
	max-height: none !important;
}


#benefits li {background: transparent url(../images/tick.gif) 25px 0.1em no-repeat;	padding-left:50px;	line-height:2em;	padding-bottom:0.1em}
#benefits strong {font-weight:normal;	font-size:1.1em}	

#logo strong {font-size:2.8em;	line-height:1.2em}
#logo p {	margin:5px;	font-size:1.2em}

#navigation {
	border-top:1px solid #FFF;
	background-color:#3C386A;
	padding-left:10px;
	}
	
#navigation ul {
	list-style:none;
	height:2.5em;
	padding:5px 0;
	}
#navigation li {float:left}
#navigation li a {line-height:2.4em}

#navigation li a,#navigation li a:hover,#navigation li a:visited, #navigation li.current {
	color:#FFF;	
	padding:2px 10px;
	margin-right:10px;
	border:1px solid #FFF;
	text-decoration:none;
	}	
#navigation li a:hover, #navigation li.current {
	background-color:#000;
	line-height:2em;
	}
	
#products h1 {font-size:1.8em;	padding:5px 0 10px 0}
#products h2 {font-size:1.8em}
#products h3 {background-color:#000;	color:#FFF;	text-align:center;}
div.feature img {	padding:15px 0}
div.feature h3 {	padding:5px 0;	font-size:1.2em}
div.feature div.header {
	background-color:#3C386A;
	color:#FFF;
	text-align:center;
	font-size:0.9em;
	}
#products div.productFeatures {padding-top:10px}
#products div.productFeatures h1, #products div.productFeatures h2 {	padding-left:10px;	color:#3C386A}
#products div.productFeatures h2 {font-size:1.4em}
#products div.productFeatures p {padding:0 10px}
#products div.productFeatures h1 {	font-size:1.6em}
#products div.productLinks h2 {	font-size:1.2em;	padding-left:10px;}

div.productFeatures li, #imagery li {background: transparent url(../images/bullet.gif) 10px 0.3em no-repeat}
div.productLinks li a {background: transparent url(../images/arrow.gif) 16px 0.5em no-repeat;	color:#000;	text-decoration:none}
div.productLinks li a:hover {	text-decoration:underline}
div.productFeatures li, #imagery li, div.productLinks li a {padding-left:25px;	line-height:1em;	padding-bottom:8px}
div.productLinks strong {color:#3C386A}
div.productLinks {	padding:20px 0}


/* -----------------------------------*/
/* --------->>> PROD PAGE <<<---------*/ 
/* -----------------------------------*/

.contact {
	display: block;
	clear: both;
}

.navbar-inverse {
background-color: #333 !important;
border-color: #000;
}

#content {clear:both}
#imagery {
	float:right;
	width:445px;
	height:100%;
	background: #FFF url(../images/prod-shadow.gif) top left repeat-y;
	padding-left:30px;
	}
#content h1 {	font-size:3em;	color:#3C386A;	padding:20px 10px;	border-bottom:1px solid #3C386A}

div.pricepoint {
position: absolute;
top: 0px;
left: 30px;
width: 190px;
font-size: 0.7em;
	}

h2.type, h2.price {
font-size: 22px !important;
}
	
h2.type {background-color:#3C386A;	border-bottom:1px solid #FFF}
h2.comingsoon {background-color:#666}

h2.price {background-color:#000}
h2.type, h2.price {	color:#FFF;	padding:10px 15px;	font-weight:800}

.proddetail {padding:10px;	margin-bottom:20px;	clear:right;float: left;;width:50%;}
.proddetail img {	float:right;	width:150px;	border:1px solid #3C386A;	margin:0 10px 20px 15px}

#details {	padding:10px 10px;	margin-right:460px}
#details h2, #details h1 {	border:none}
#details h1 {font-size:1.8em;	padding:20px 0 10px 0}
#details h2 {font-size:1.6em}
th {width:200px;	font-weight:800;	color:#3C386A;	padding-left:25px}

/* -----------------------------------*/
/* --------->>> FOOTER <<<------------*/ 
/* -----------------------------------*/

#footer .partner {padding: 5px;margin:5px;background-color: #FFF;}
#footer img {display: inline-block;}
#footer {	clear:both;	width:100%;	background-color:#000;	color:#FFF;	padding-top:10px; text-align: center;}
#footer div.links {float:left;	width:45%;	padding-left:30px;	font-size:2em;	margin-bottom:30px}
#footer li {padding:7px}
#footer li a {background: transparent url(../images/arrow-footer.gif) 10px 0.3em no-repeat;	padding-left:25px;	text-decoration:none}
#footer li a:hover {background: transparent url(../images/arrow-footer-ro.gif) 20px 0.3em no-repeat;	padding-left:35px}
#footer a {color:#FFF}
#footer p {	text-align:center;	display: inline-block;}
#footer p a {text-decoration:none}
#footer p a:hover {text-decoration:underline}
#footer h1 {padding:10px; border-bottom:none;	color:#FFF}

div.contactInfo {	float:right;	width:40%;	font-size:1.2em;	padding:20px;	margin-bottom:30px}
div.contactInfo h3 {	padding:10px}
div.contactInfo a {	color:#000;	text-decoration:underline}

div.enquiryFormFields {float:left;	width:50%;	padding:10px;	padding-top:20px;	font-size:1.2em;}
div.enquiryFormFields p {
	clear: both;
	padding-top:0;
	padding-bottom:10px;
	margin:3px;
	} 
div.enquiryFormFields p.checkbox {padding-bottom:0}
  
div.enquiryFormFields label {
  float: left;
  width: 35%;
  text-align: right;
  margin-right:10px;
  }

div.enquiryFormFields input, div.enquiryFormFields select, div.enquiryFormFields textarea {
	width:200px;
	float: left;
	text-align: left;
	padding-right:5%;
	margin-bottom:10px; 
	margin-left:5px; 
	}	
div.enquiryFormFields select {width:auto;	min-width:200px}
div.enquiryFormFields input.box {
	width:11px;
	margin:0;
	margin-right:10px;
	margin-top:3px}
	
	
div.enquiryFormFields textarea {	width:200px}
div.enquiryFormFields h2 {margin:0;	clear:both}
	
div.enquiryFormFields input.button {
	width:auto;
	margin:5px 10px;
	float:none;
	text-align:center;
	}
div.enquiryFormFields h5 {text-align:center;	margin:5px}

#payment {margin:10px auto;	padding:15px;	text-align:center}

input.button {font-size:1.4em;	padding:5px}






/************************************ NEW CSS ******************************************/

#logo tel a {
	color: #FFF;
}

#logo img {
	width: 100%;
	max-width: 310px;
	height: auto;
}

.suppliers img {
	width: 100%;
	height: auto;
	max-width: 120px !important;
}

.feature .feature-inner {
	padding: 0 10px;
	border:1px solid #CCC;
	background-color: #FFF;
}

.feature h2 {
	padding: 20px !important;
	margin-top: 10px !important;
	background-color: #000;
}

.feature h2 a {
	display: block;
	clear: both;
}
.jumbotron {
padding-top: 28px !important;
padding-bottom: 28px !important;
}
.jumbotron {
	padding: 30px;
	margin-top: 0 !important;
	margin-bottom: 0 !important;
	color: #FFF !important;
	background-color: #000 !important;
}

.jumbotron p {
	font-size: inherit !important;
}

#pro.jumbotron {
	color: #333 !important;
	background-color: #EEE !important;
	padding-top: 0 !important;
}

#benefits .why {
	font-size: 22px !important;
}

.navbar {
	margin-bottom: 0 !important;
	border-radius: 0 !important;
}

#products img {
	width: 100%;
	height: auto;
}

#product_page img {
	width: 100% !important;
	height: auto !important;
}

.suppliers {
	margin-top: 10px;
}

.suppliers img {
	padding: 10px;
	background-color: #FFF;
}

hr {
	border-top: 1px solid #DDD !important;
}

@media (max-width: 991px) {
	#logo {
		text-align: center !important;
		margin-top: 30px;
	}
	#pro.jumbotron {
		margin: 0;
		padding: 0; 
	}

	.suppliers {
		display: none;
	}

	#benefits {
		display: none;
	}

	.hidebar {
		display: none !important;
	}
}

@media (min-width: 768px) {
	.navbar-brand {
		display: none !important;
	}
}