@charset "UTF-8";

/* Splashbacks.com */
/* Website design and build by Creare */

/* Reset */
*												{ margin: 0; padding: 0 ; }
body											{ background: url(images/bg.gif) repeat-x; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 75%; line-height: 1.8em; }
img												{ border: none; outline: none; }

/* Typography */
h1, h2, h3										{ color: #292e31; font-family: Georgia, "Times New Roman", Times, serif; font-weight: normal; padding: 5px 0 5px 0; }
p												{ padding: 0 0 15px 0;  }
.numbertext, .smallnumbertext					{ color: #FFF; font-size: 2.1em; text-shadow: 2px 2px 2px #333; }
.smallnumbertext								{ font-size: 1.6em; font-weight: bold; }
.footerhead										{ color: #FFF; font-family: Georgia, "Times New Roman", Times, serif; font-size: 1.4em; padding: 15px 0 0 0; font-weight: normal; }
.footertext										{ color: #FFF; margin: 0; padding:0; font-size: 0.8em; }
.sidebarhead									{ color: #292e31; font-family: Georgia, "Times New Roman", Times, serif; padding: 5px 0 5px 0; font-size: 2em; font-weight: bold; }
.adr											{ margin:0; padding:0; }
.price											{ font-size: 1.2em; color: #090; }
.formstyle2										{ font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 1em; }

/* Form */
.miniformstyle									{ clear: both; padding: 3px; margin: 2px; }
.colourtable td									{ padding: 3px; }

/* Structure */
#pagewrap										{ width: 900px; margin: 0 auto; overflow: hidden; }

/* Header */
#header											{ width: 900px; height: 148px; background: url(images/headerbg.jpg) no-repeat; clear: both; }
#logo											{ width: 296px; height: 36px; float: left; padding: 80px 0 0 0; }
#number											{ width: 300px; height: 30px; float: right; padding: 85px 0 0 0; text-align: right; }

/* Main Nav */
#mainnavwrap									{ width: 900px; height: 40px; }
ul#mainnav										{ width: 900px; height: 32px; display: block; padding: 8px 0 0 0; }
ul#mainnav li									{ display: inline; }
ul#mainnav li a									{ padding: 11px 20px 14px 20px; color: #FFF; text-decoration: none; }
ul#mainnav li a:hover							{ background: #75adc0; color: #FFF; }

/* Flash */
#flashwrap										{ width: 900px; height: 247px; }
#vid-pres-wrap_wrapper						    { float: right; width: 184px; height: 234px; margin: 12px 0 0 0; }

/* Main Content */
#maincontentwrap								{ width: 900px; overflow: hidden; clear: both; padding: 20px 0 0 0; }
#maincontentwrap p								{ font-size: 1.1em; }
#maincontent									{ width: 590px; min-height: 500px; overflow: hidden; float: left; padding: 0 20px 0 0; border-right: #CCC solid 1px; }
#sidebar										{ width: 250px; overflow: hidden; float: right; }

/* Footer */
#footerwrap										{ width: 100%; overflow: hidden; background: #264454; }
#footer											{ width: 900px; margin: 0 auto; padding: 0 0 7px 0;}
.footerbox										{ width: 300px; float: left; overflow: hidden; }
.footerboxright									{ width: 300px; float: right; overflow: hidden; padding: 20px 0 0 0; }
.footerboxright a								{ color: #FFF; }
.footerlist li a								{ color: #FFF; text-decoration: none; font-size: 0.8em; }
.footerlist li a:hover							{ text-decoration: underline; }
#footer .footerlist								{ line-height: 1.6em; }

/* Contact us Page */
fieldset										{ padding: 10px; }
legend											{ padding: 5px; }
.formfield										{ font-size: 1em; font-family: Arial, Helvetica, sans-serif; }

/* Store Page */
.product										{ border: #999 1px solid; height: 130px; padding: 20px; margin: 0 0 15px 0; clear: both; }
.producttext									{ width: 350px; overflow: hidden; float: left; padding: 25px 0 0 0; }
.producttext p									{ padding: 0; overflow: hidden; }	
.paypalbutton									{ float: right; width: 170px; overflow: hidden; }

/* Seperator */
#seperator										{ background: #e9e9e9; margin: 15px 0 0 0; padding: 0 0 4px 0; }
#innerseperator									{ width: 900px; margin: 0 auto; text-align:center; }
#innerseperator a								{ color: #999; font-size: 0.8em; }
hr												{ border: none; height: 1px; margin: 15px 0 15px 0; background:#CCC; }

/* Designer */
.imagewrap										{ width: 590px; height: 450px; overflow: hidden; text-align: right; position: relative; margin: 5px 0 10px 0;}
.imagewrap img									{ float: right; }
.threeimage										{ margin: 0 15px 0 0; }
.doubleimage									{ margin: 0 12px 0 0; }
.blackcaption									{ width: 570px; padding: 10px; background: url(images/blackpng.png) repeat; position: absolute; bottom: 0; left: 0; z-index: 1; color: #fff; text-align: left; }
#maincontent .blackcaption p					{ margin: 0; padding: 0; }



/* You can alter this CSS in order to give SmoothDivScroll your own look'n'feel */

/* Invisible left hotspot */
div.scrollingHotSpotLeft
{
	/* The hotspots have a minimum width of 100 pixels and if there is room the will grow
    and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste. */
	min-width: 75px;
	width: 10%;
	height: 100%;
	/* There is a big background image and it's used to solve some problems I experienced
    in Internet Explorer 6. */
	background-image: url(../images/big_transparent.gif);
	background-repeat: repeat;
	background-position: center center;
	position: absolute;
	z-index: 200;
	left: 0;
	/*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
	cursor: url(../images/cursors/cursor_arrow_left.cur), url(images/cursors/cursor_arrow_left.cur),w-resize;
}

/* Visible left hotspot */
div.scrollingHotSpotLeftVisible
{
	background-image: url(../images/arrow_left.gif);				
	background-color: #fff;
	background-repeat: no-repeat;
	opacity: 0.35; /* Standard CSS3 opacity setting */
	-moz-opacity: 0.35; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */
	filter: alpha(opacity = 35); /* Opacity for Internet Explorer. */
	zoom: 1; /* Trigger "hasLayout" in Internet Explorer 6 or older versions */
}

/* Invisible right hotspot */
div.scrollingHotSpotRight
{
	min-width: 75px;
	width: 10%;
	height: 100%;
	background-image: url(../images/big_transparent.gif);
	background-repeat: repeat;
	background-position: center center;
	position: absolute;
	z-index: 200;
	right: 0;
	cursor: url(../images/cursors/cursor_arrow_right.cur), url(images/cursors/cursor_arrow_right.cur),e-resize;
}

/* Visible right hotspot */
div.scrollingHotSpotRightVisible
{
	background-image: url(../images/arrow_right.gif);
	background-color: #fff;
	background-repeat: no-repeat;
	opacity: 0.35;
	filter: alpha(opacity = 35);
	-moz-opacity: 0.35;
	zoom: 1;
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
div.scrollWrapper
{
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%;
}

div.scrollableArea
{
	position: relative;
	width: auto;
	height: 100%;
}

#slider-wrap { width: 900px; position: relative; height: 246px; }
#slider-wrap div.scrollableArea img { float: left; padding: 0; }

#home-slider-wrap { width: 710px; position: relative; height: 246px; float: left; }
#home-slider-wrap div.scrollableArea img { float: left; padding: 0; }
	
#slider-info {   background: #ffffff; background: rgba(225, 225, 225, 0.9);
    padding: 20px;
    position: absolute;
    right: 20px;
    top: 15px;
	-moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; font-family: Georgia, "Times New Roman", Times, serif;
	 }
#slider-info p { font-size: 1.3em; font-weight: bold; padding: 0 0 5px 0; }
#slider-info ul { font-size: 1.1em; }
#slider-info ul li { background: url(images/tick-icon.png) no-repeat; list-style-type: none; padding: 0 0 3px 30px; }