/* ----------------------------------------------------------------------------------------------------------------------
 * 
 * HTML TAGS
 *
---------------------------------------------------------------------------------------------------------------------- */

body {margin: 0; text-align: center; background: #fff; font: 16px/1.5 Arial, Helvetica, sans-serif; color: #000;}

/* Default Link Styles */
a, a:active, a:visited {color:#607890;}
a:hover {color:#036;}

/* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

/* Headers */
h1, h2, h3 {margin: 0; padding: 0; font-weight: bold;}
h1 {font-size: 24px; padding: 40px 0 20px 0;}
	h1:first-child {padding-top: 0;}
h2 {font-size: 20px; padding-top: 20px; clear: both;}
h4 {font-size: 20px;}

/* Lists, Paragraphs and Other Content */
ul {list-style: square;}
p {padding: 0 0 15px 0;}

address {margin: 0 0 15px 0;}

/* Forms */
form label {float: left; display: block; width: 160px; line-height: 22px;}
form input[type=text],
textarea {border: 1px solid #9f9f9f; background: #fff url("images/layout/input-bg.gif") top left repeat-x; padding: 3px; margin-bottom: 3px; width: 250px;}
	form input[type=text]:focus {border-color: #222;}
form textarea {margin-left: 160px; font: inherit; height: 100px;}
form input[type=submit] {margin-left: 160px; border: none; width: 258px; background: #7d7d7d; color: #fff; padding: 5px 0;}

/* Selection Highlight Colours */
/* ::-moz-selection{ background: #FF5E99; color:#fff; text-shadow: none; }		/* Mozilla */
/* ::selection { background:#FF5E99; color:#fff; text-shadow: none; } 			/* Everything else but iOS */
/* a:link { -webkit-tap-highlight-color: #FF5E99; }							/* iOS */

/* Placeholder Styles 
::-webkit-input-placeholder {color: red;}
:-moz-placeholder {color: red;}
*/


/* ----------------------------------------------------------------------------------------------------------------------
 * 
 * HELPER & UNIVERSAL CLASSES
 *
---------------------------------------------------------------------------------------------------------------------- */


/* Positioning */
.center {text-align: center;}
.right {text-align: right;}

.image-left {float: left; margin: 10px 20px 10px 0;}
.image-right {float: right; margin: 10px 0 20px 10px;}
.image-right.aside {padding: 0 0 0 20px; margin: 0 0 0 20px; border-left: 1px solid #ccc;}

/* Contact Maps */
.contact-map {text-align: right; font-size: 14px;}
.contact-map a {text-decoration: none;}

/* Clearing and Margin Resets */
.clear {clear: both;}
.noclear {clear: none;}
.nomargin-top {margin-top: 0; padding-top: 0;}
.nomargin-bottom {margin-bottom: 0; padding-bottom: 0;}

/* Clearfix - if you're in to that */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; } /* Hides from IE-mac \*/
.clearfix { display: block; }

/* Faux Rules */
.hr {border-top: 1px solid #ccc; height: 1px; margin: 40px 0 20px 0;}

/* Back to Top */
.topbutton {border-bottom: 1px dotted #3c6dc9; text-transform: uppercase; font-size: 12px; text-align: right; padding-top: 10px;}

/* Icons! */
.phone {padding-left: 20px; background: url("images/icons/phone.gif") left no-repeat;}
.email {padding-left: 20px; background: url("images/icons/email.gif") left no-repeat;}
.fax {padding-left: 20px; background: url("images/icons/page.png") left no-repeat;}
.map {padding-left: 20px; background: url("images/icons/map.gif") left no-repeat;}
.pdf {padding: 5px 0 5px 20px; background: url("images/icons/pdf.png") left no-repeat; font-size:10px; color:#aaa;}

/* Custom List Classes */
ul.ticklist {list-style: none; margin: 0; padding: 10px 0;}
ul.ticklist li {padding: 5px 0 5px 25px; background: url("images/icons/tick.png") left no-repeat;}
ul.colourlist li {color: #ccc;}
ul.colourlist li span {color: #222;}

/* Generic Body Text Class */
.body {line-height: 1.5; word-spacing: 0.03em; letter-spacing: 0.03em;}

/* Image Replacement */
.ir { display:block; text-indent:-999em; overflow:hidden; background-repeat: no-repeat; }

/* JQUI Tabs Styles */
.ui-tabs .ui-tabs-hide {display: none;}

/* Snippet Master Reset */
.mceContentBody {background-image: none !important; background-color: #fff !important; color: #000 !important;}

/* ----------------------------------------------------------------------------------------------------------------------
 * 
 * LAYOUT
 *
---------------------------------------------------------------------------------------------------------------------- */

#container {margin: 0px auto; width: 960px; text-align: left;}
	
	header {}
		#headerNav {clear: both; background: url("images/layout/tab-bg.gif") bottom left repeat-x; height: 44px;}
			#headerNav ul, #headerNav li {list-style: none; margin: 0; padding: 0; float: left;}
			#headerNav a {display: block; float: left; line-height: 44px; padding: 0 42px; font-weight: bold; text-decoration: none; text-shadow: 1px 1px 0 #fff;}
			#headerNav a:hover {background: url("images/layout/tab-hover.gif") bottom left repeat-x;}
			#headerNav a.current {background: url("images/layout/tab-active.gif") bottom left repeat-x;}
			
			/* Floating Contact Button Right - Clients Request, Looks Terribad */
			#headerNav ul {width: 960px;}
			#headerNav li:last-child {float: right;}
			
		#showcase {height: 190px; background: url("images/layout/showcase.jpg") top left no-repeat;}
		
	#contentContainer {padding: 10px; background: url("images/layout/content-bg.gif") top left repeat-x; font-size: 15px;}
		.leftCol {float: left; width: 633px;}
		.rightCol {float: right; width: 297px;}
			.leftCol.body {width: 613px; padding-right: 20px;}
	
	#callnow {padding-bottom: 7px; line-height: 46px; text-align: center; background: url("images/layout/callnow-bg.gif") bottom left repeat-x;}
		#callnow strong {font-size: 18px;}
	
	footer {text-align: center; font-size: 12px; padding: 10px 0;}
		#footerLeft {float: left;}
			#footerLeft a {padding: 0 10px;}
		#footerRight {float: right;}
/* ----------------------------------------------------------------------------------------------------------------------
 * 
 * PAGE SPECIFCS
 *
---------------------------------------------------------------------------------------------------------------------- */

/* Homepage Boxes */
#homeBoxes {padding-top: 10px;}
#homeBoxes a {display: block; margin: 0 0 10px 10px; width: 204px; height: 204px; float: left; position: relative; text-decoration: none; color: #222;}
#homeBoxes a.first {margin-left: 0px;}
#homeBoxes h1 {top: 0; font-size: 18px;}
#homeBoxes h2 {bottom: 0; font-size: 16px; display: none;}
#homeBoxes h1, #homeBoxes h2 {position: absolute; padding: 10px; width: 184px; font-weight: normal;
	background: #f8de20; 					/* CSS2.1 */
	background: rgba(248,222,32,0.8); 		/* CSS3 */
	}
	#homeBoxes a:hover h2 {display: block;}

/* Product Layout */
h1.pageTitle {text-align: center; font-style: italic; padding: 15px 0;}
.productLayout {}
	.productLayout > div {float: left; width: 296px; margin: 0 20px 20px 0;}
	.productLayout > div img {float: left;}
	.productLayout > div p {margin-left: 110px; padding-bottom: 0; margin-bottom: 0;}

.listBox {background: #ecf1f7;}
.listBox h2 {font-size: 16px; text-decoration: underline; padding: 20px 0 15px;}
.listBox h3 {padding: 14px 0 20px; font-weight: bold; font-style: italic;}

/* Galleries */
.gallery a img {border: 1px solid #ccc; padding: 1px;}
.gallery a:hover img {border-color: #222;}

/* Contact */
#contactForm {padding-top: 20px;}
.contactMap {padding-top: 10px;}

/* ----------------------------------------------------------------------------------------------------------------------
 * 
 * PRINT STYLES
 * inlined to avoid required HTTP connection www.phpied.com/delay-loading-your-print-css/ 
 *
---------------------------------------------------------------------------------------------------------------------- */

@media print {
  /* Some Default Styles */
  * { background: transparent !important; color: #444 !important; text-shadow: none; }
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a:after { content: " (" attr(href) ")"; } 
  abbr:after { content: " (" attr(title) ")"; }
  .ir a:after { content: ""; }  /* Don't show links for images */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}

/* ----------------------------------------------------------------------------------------------------------------------
 * 
 * MOBILE STYLES
 * Grade-A Mobile Browsers (Opera Mobile, iPhone Safari, Android) Only
 *
---------------------------------------------------------------------------------------------------------------------- */

@media screen and (max-device-width: 480px) { 
  /* Prevent iOS, WinMobile from adjusting font size */
  html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } 
}