/* GENERAL STYLES */
/* GENERAL STYLES */
/*
=============================================================
	Site: 		Quilo.co.uk
	Version:	1.0.0
	Author:		Warren Buckley
	Site:		http://ww.creativewebspecialist.co.uk
=============================================================	
*/

/*
=============================================================
	Common Styles
=============================================================
*/

.wrapper {

margin:0 auto;
width:960px;
background-repeat:no-repeat;
	background-position:top left;
	
	/* Move this into Umbraco, so Samster can update easily */
	background-image:url(../Images/Bgs/mainBG2.jpg);
}
.left
{
	float:left;
}

.right
{
	float:right;
}

.clearBoth
{
	clear:both;
}

.clearLeft
{
	clear:left;
}

.clearRight
{
	clear:right;
}

h2
{
	font-size:28px;
	font-weight:bold;
	letter-spacing:-1px;
	margin-bottom:18px;
        color: #fff;
        border-bottom: 1px dotted #fff;
        font-family: helvetica;
        
}

h3
{
	font-size:20px;
	font-weight:bold;
	letter-spacing:-1px;
	margin:30px 0 0 0;
        color: #eb277e;
        font-family: helvetica, trebuchet;
}
h4
{
	font-size:15px;
	font-weight:bold;
	letter-spacing:-1px;
	margin:30px 0 0 0;
        color: #35a9e5;
        font-family: helvetica, trebuchet;
}
p
{
	margin:0 0 20px 0;
}

.noMarginTop
{
	margin-top:0;
}

a
{
	color:#1791f8;
	text-decoration:none;
}

a:hover
{
	text-decoration:underline;
}

/*
=============================================================
	Quilo site
=============================================================
*/

body
{
	font-family:Arial, Helvetica, Verdana, sans-serif;
	color:#8c8c8c;
	font-size:11px;
       
	
	background-color:#131616;
	
	
}

#header
{
	
margin:0;
	display:block;
	height:94px;
	width:946px	/*946 - 29px = 917px */
        
}


.siteHeader
{
	display:block;
	height:95px;
	width:497px;
	
	/*
	FOR DEBUG
		background-color:red;
		opacity:0.5;
	*/
}

/* applied so user can rollover logo for link, that matches siteHeader dimensions */
.siteHeader a
{
	display:block;
	height:100%;
	width:100%;
	
	text-indent:-1000000px;	/* Used to move the text off the page with large  negative value */
}

/* site navi */
#header ul li
{
	float:left;
	line-height:86px;
			
	font-size:16px;
}

#header ul li a
{
	color:#FFFFFF;
	text-decoration:none;
	font-weight:normal;
	
	padding:0 13px 0 10px;
	
	background-image:url(../Images/Misc/navi_vert_bar.gif);
	background-position:top right;
	background-repeat:repeat-y;
}

#header ul li a:hover
{
	
	text-decoration:underline;
	font-weight:normal;
}

#header ul li.last a
{
	background-image:none;
}

.headerFeature
{
	margin:40px 0 0 325px;
	width:660px;
        

	/*
	FOR DEBUG
		background-color:red;
		opacity:0.5;
	*/
	
}

.headerFeatureText
{
	width:275px;
	height:200px;
	overflow:hidden;

	/*
	FOR DEBUG	
	
		background-color:green;
		opacity:0.5;
	*/
	
}

.headerFeatureText h2
{
	margin:0 0 14px 0;
}

.headerFeatureImages
{
	width:283px;
	margin:6px 21px 0 0;
	
	color:black;

	/*
	FOR DEBUG
	
		background-color:yellow;
		opacity:0.5;
	*/
	
}


.headerFeatureImgTop
{
	width:283px;
	margin-top:4px;
}

.headerFeatureImgTop .left
{
	padding-left:5px;
}

.headerFeatureImgTop .right
{
	 padding-right:3px;
}


.headerFeatureImgBottom
{
	width:283px;
	margin-top:11px;
}

.headerFeatureImgBottom .left
{
	padding-left:5px;
}

.headerFeatureImgBottom .right
{
	 padding-right:3px;
}



.columnsContainer
{
	margin:254px 0 120px 0;
	width:945px;
}

.colOne
{
	width:293px;
	margin-right:12px;
	
	/*
	FOR DEBUG
	
		background-color:yellow;
		opacity:0.5;
	*/
}

.colTwo
{
	width:352px;
	margin-right:12px;
	
	/*
	FOR DEBUG
	
		background-color:blue;
		opacity:0.5;
	*/
}

.colTwoWide
{
	width:625px;
	margin-right:12px;
	
	/*
	FOR DEBUG
	
		background-color:blue;
		opacity:0.5;
	*/
	
}

.colThree
{
	width:275px;
	
	/*
	FOR DEBUG
	
		background-color:green;
		opacity:0.5;
	*/
}

.button
{
	background-image:url(../Images/Misc/button_right.gif);
	background-repeat:no-repeat;
	background-position:top right;
	float:left;
	
	height:20px;
	margin:5px 0 0 0;
	
	font-size:13px;
	font-weight:bold;
	text-decoration:none;
	color:#FFFFFF;
}

.button span
{
	background-image:url(../Images/Misc/button_left.gif);
	background-repeat:no-repeat;
	background-position:top left;
	margin-right:12px;
	padding-left:4px;
	
	float:left;
	
	height:20px;
	line-height:21px;
	display:block;		
}

.photoBorder
{
	border:10px solid #f0e9dc;
	border-bottom:13px solid #f0e9dc;
	
	margin:22px 0 0 0;
	position:relative;
}

.leftMargin-15
{
	margin-left:15px;
}

.imageCaption
{
	opacity:0.8;
	filter:alpha(opacity=80);
	
	position:absolute;
	bottom:0;
	left:0;
	display:none;
	
	background-color:#000000;
	font-size:20px;
	letter-spacing:-1px;
	
	width:100%;
	height:50%;
}

.imageCaption p
{
	margin:15px;
}

/*
====================
Contact form
====================
*/

label
{
	width:153px;
	float:left;
	line-height:20px;
}

input, textarea
{
	width:270px;
	margin:0 0 10px 0;
}

.submitBtnContainer
{
	border-top:1px solid #4d4d4d;
	border-bottom:1px solid #4d4d4d;
	padding:2px 0 2px 152px;
	margin:20px 0 0 0;
}

input.submitBtn
{
	width:auto;
	margin:0;	
}

/*
=============================
Feature slider styles
=============================
*/

.featureContainer
{
	height:388px;   /* height: 400px - 6px - 6px = 388px */
	width:613px;    /* width: 625px - 6px - 6px = 613px */
		
	overflow:hidden;			
	position:relative;
	
	/*background-image:url(../Images/Bgs/feature_border_bg.gif);*/      /* Not used CSS border as was cauing problems*/
	margin:25px 0 20px 0;
	border:6px solid #F0E9DC;
}
	
		.features
		{
		    width:613px;
			height:388px;
			left:0px;			
			position:relative;
			
			background-image:url(../Images/Bgs/feature_slider_bg.gif);
			background-repeat:repeat-x;
		}
	
		.features div
		{
			float:left;
			position:relative;
			
			width:613px;
			height:388px;					
		}
		
		.features h4
		{
		    font-size:18px;
		    font-weight:bold;
		    margin:14px 0 38px 27px;
		}
		
		.features img
		{
		    width:560px;
		    margin:0 0 0 26px;
		}
		
		.leftFeatureSlider
		{
		    position:absolute;
		    top:50%;
		    left:0;
		    
		    display:block;
		    width:20px;
		    height:112px;
		    margin-top:-56px;		    
		    
		    background-image:url(../Images/Misc/feature_slider_left.png);
		    background-repeat:no-repeat;
		}
		
		.rightFeatureSlider
		{
		    position:absolute;
		    top:50%;
		    right:0;
		    
		    display:block;
		    width:20px;
		    height:112px;
		    margin-top:-56px;		    
		    
		    background-image:url(../Images/Misc/feature_slider_right.png);
		    background-repeat:no-repeat;
		}
		
		
		.leftFeatureSlider, .rightFeatureSlider
		{
		    cursor:pointer;
		}

ul.flickrthum }

margin: 0 0 10px 0;

}


Homepage feat panels CSS
==============================================
.feat{
	width:960px; 
	height:auto; 
	margin:0 auto; 
	border-top:1px solid #ccc; 
	padding-top:0px; 
	overflow:hidden;
       margin-bottom:55px;
		}

	.feat-left, 
	.feat-center, 
	.feat-right { 
		width:300px; 

		 
		margin-top:15px;  
		}
	.feat-left, 
	.feat-center {
		float:left; 
		padding-right:7px;
		border-right:0px solid #ccc;
		}
	.feat-center { 
		padding-left:7px;}
	.feat-right { 
		float:right; 
		padding-left:7px; }
	}

.feattext }
   padidng:  12px; 0 0 0;
}

#footer
{
	line-height:40px;
	height:58px;
	padding:0 0 0 24px;
	background-color: red;
	border-top:1px solid #333333;
	
	font-size:10px;
	letter-spacing:0;
}



/* EDITOR PROPERTIES */


/* EDITOR PROPERTIES */