/* CSS Document */
body,td,th {
	font-family: arial;
	font-size: 10px;
	background: url(stripes.gif);
}

p { margin-top: 0px; margin-bottom: 0px; }


/*
//
//
//  Main Sections
//
//
*/

.wholesite{
width: 960px;
height: 617px;
/*background: url(curls2.png);*/
padding: 0px 100px 100px 100px;
margin: auto;
}



.fullwidthmain{
width: 956px;
height: 358px;
float: left;
margin-top: 15px;
background-color: black;
border-color: #63516b;
border-style: solid;
border-width: 2px 2px 0px 2px;
}

.sliderarea{
width: 956px;
height: 100px;
float: left;
background-color: black;
border-color: #63516b;
border-style: solid;
border-width: 0px 2px 2px 2px;
}

.mainportfolio{ width: 960px; height: 460px; float: left; margin-top: 15px;} 
/* (same as full width main but no border */

/* modifier for contact form*/
.details{
background-color: white;
padding: 10px;
width: 936px;
height: 435px;
float: left;
margin-top: 15px;
border-color: #63516b;
border-style: solid;
border-width: 2px;
}

/*contact form sections*/

.formsection{
padding: 2px;
}


/*
//
//
// Constant Main Menu
//
//
*/

.menu{ width: 500px; height: 20px; float: right; padding-top: 40px; }

.link{
width: 100px;
height: 26px;
float: left;
padding-top: 4px;
font-size: 12px;
color:  #e3cfef;
text-decoration: none;
text-align: center;
}
.on{   color:  #452238; text-decoration: underline; font-weight: bold; background-color: #e3cfef; }
.link:hover{ text-decoration: underline; }

/*
//
//
// Left Hand Area
//
//
*/


/* clear to hold portfolio section buttons */
.left{
height: 459px;
width: 305px;
float: left;
}


.leftprices{
height: 455px;
width: 286px;
margin-right: 15px;
float: left;
border-color: #63516b;
border-style: solid;
border-width: 2px;
background-color: #ffffff;
}


/*
// Left side on main portfolio page (larger section buttons)
*/

a.sectionbutton{
height: 109px;
width: 256px;
background-color: white;
float: left;
padding:15px;
border-color: #63516b;
border-style: solid;
border-width: 2px;
text-decoration: none;
}
a.sectionbutton:hover{ border-color: #b6aad4; }
.lowerbutton{ margin-top: 15px; }


/*
// Left side on inner portfolio pages (section buttons) 
*/


/* Larger window for selected button */
.leftsectionportfolio{
height: 378px;
width: 286px;
float: left;
background-color: #ffffff;
border-color: #63516b;
border-style: solid;
border-width: 2px;
}

a.portfoliobutton{
width: 272px;
float: left;
background-color: white;
border-color: #63516b;
border-style: solid;
border-width: 2px;
padding-top: 6px;
padding-bottom: 6px;
padding-left: 14px;
text-decoration: none;
}

a.portfoliobutton:hover{ border-color: #b6aad4; }
a.portfoliobutton2:hover{ border-color: #b6aad4; }

/* Modifiers for location of button */
.buttonabove{ margin-bottom: 4px; }
.buttonbelow{ margin-top: 4px; }


/*
//
// Portfolio Pages menu
//
*/


/* 
// Titles
*/

a.subsectiontitle{
font-size: 14px;
margin-top: 10px;
color: #3b164b;
text-decoration: none;
width: 250px;
height: 20px;
float: left;
cursor: pointer;
}

a.subsectiontitle:hover{ text-decoration: underline; }


/*
// Thumbnails
*/


.subThumbs{ display: none; }
.subThumbsShow{ float:left; display: inline;}

.thumbholder{ width: 256px; float: left; margin-left: 15px; }
.thumb{ 		
width: 33px; 
height: 33px;
margin-right: 9px;
margin-bottom: 9px;
border-style: solid;
border-color: black;
border-width: 1px;
float: left;
cursor: pointer;
}


/* 
// Small text area - comments on portfolio images
*/

.designtextarea{
width: 236px;
float: left;
margin-top: 20px;
border-color: #63516b;
border-style: solid;
border-width: 1px;
background-color: white;
font-size: 12px;
color: #707e79;
padding: 4px;
}

.designtextareahidden{ border-color: #63516b; border-style: solid; border-width: 0px; }


/*
//
//
// Right Hand Area 
//
//
*/

/* plain version of the right hand side area (no background image)  */
.rightsection{
height: 455px;
width: 651px;
background-color: white;
float: left;
border-color: #63516b;
border-style: solid;
border-width: 2px;
}

/* Right Side images or adjustments  */
.webdesignimg{ 		background: url(webdesign.jpg);   }
.webdesignsubimg{ 	background: url(webdesign2.jpg);}
.retouchimg{ 		background: url(retouch.jpg);     }
.retouchsubimg{ 	background: url(retouch2.jpg);    }
.photoimg{			background: url(photography.jpg); }
.photosubimg{		background: url(photography2.jpg);}
.portfolioimg{ 		background: url(portfolio.jpg);   }
.pricingimg{		background: url(pricing.jpg);}
.aboutimg{			background: url(about.jpg);}	
.aboutsubimg{		background: url(about2.jpg);}
.aboutsubimgblack{	background: url(about3.jpg);}	
.photos{			height: 445px; width: 641px; padding-left: 10px; padding-top: 10px;}


/* 
// Right hand side content holders
*/

/* Text holder for information pages */
.littlecenter{
margin: auto;
margin-top: 50px;
text-align: justify;
height: 400px;
width: 600px;
}

.imageholder{ margin: auto; border-color: black; border-style: solid; border-width: 1px; }

/* Client info page */
.clientinfo2{ width: 300px; height: 105px; float: left; margin-left: 5px; }
.clientinfo{  width: 240px; height: 105px; float: left; margin-left: 5px;}





a.pricesSubMenuItem{
font-size: 12px;
margin-top: 5px;
margin-left: 25px;
color: #8b9e9a;
text-decoration: none;
width: 160px;
height: 20px;
float: left;
cursor: pointer;
}

.priceon{ font-weight: bold; text-decoration: underline; }

a.pricesSubMenuItem:hover{
font-size: 12px;
margin-top: 5px;
margin-left: 25px;
color: #8b9e9a;
text-decoration: underline;
width: 160px;
height: 20px;
float: left;
cursor: pointer;
}

a.pricesMenuItem{

margin-top: 10px;
margin-left: 10px;
color: #3b164b;
font-weight: bold;
text-decoration: none;
width: 160px;
height: 20px;
float: left;
cursor: pointer;
}

a.pricesMenuItem:hover{
font-size: 12px;
margin-top: 10px;
margin-left: 10px;
color: #3b164b;
font-weight: bold;
text-decoration: underline;
width: 160px;
height: 20px;
float: left;
cursor: pointer;
}

.sections{
height: 43px;
width: 960px;
float: left;
}


/*
//
//
//  Texts and colours
//
//
*/

.pink{      	font-size: 14px; color: #ead7f2; font-weight: bold;}
.grey{       	float: left; font-size: 14px; color: #707e79; }
.darkgrey{      float: left; font-size: 14px; color: #333333; }
.white{			float: left; font-size: 14px; color: white;}
.greyscroll{   	float: left; font-size: 14px; color: #707e79; height: 450px; overflow: auto; margin: 20px;}
.greypadding{   margin: 15px; font-size: 14px; color: #707e79; }
.darkgreypadding{	margin: 15px; font-size: 14px; color: #2e3231;}
.greysmall{  	font-size: 12px; color: #3b164b; }
.green{      	font-size: 16px; color: #7896bc; text-decoration: none;}
.purple{     	font-size: 16px; color: #841284; text-decoration: none;}
.red{        	font-size: 16px; color: #8e0d1f; text-decoration: none;}
.greenprices{	color: #7896bc; font-size: 16px; text-decoration: none; margin-top: 15px; margin-left: 15px; width: 250px; height: 20px; float: left; cursor: pointer;}
.purpleprices{  color: #841284; font-size: 16px; text-decoration: none; margin-top: 10px; margin-left: 15px;  width: 250px; height: 20px; float: left; cursor: pointer;}
.redprices{     color: #8e0d1f; font-size: 16px; text-decoration: none; margin-top: 10px; margin-left: 15px;  width: 250px; height: 20px; float: left; cursor: pointer;}
.blackprices{	color: black; font-size: 16px; text-decoration: none; margin-top: 15px; margin-left: 15px; width: 250px; height: 20px; float: left; cursor: pointer;}
.redabout{		margin-top: 15px;}
.blackprices:hover{ text-decoration: underline;}
.pricetext{     color: #a455a1; font-weight: bold;}
.redprices:hover{ text-decoration: underline;}
.greenprices:hover{ text-decoration: underline;}
.purpleprices:hover{ text-decoration: underline;}


a.redpadding{	float: left; margin-left: 15px; margin-top: 15px; font-size: 16px; color: #8e0d1f; text-decoration: none;}
a.greenpadding{ float: left; margin-left: 15px; margin-top: 15px; font-size: 16px; color: #7896bc; text-decoration: none;}
a.purplepadding{float: left; margin-left: 15px; margin-top: 15px; font-size: 16px; color: #841284; text-decoration: none;}
.greensmall{ 	font-size: 14px; color: #7896bc; font-weight: bold;}
.greensmall2{	font-size: 14px; color: #7896bc; font-weight: bold; cursor: pointer;}
.purplesmall{	font-size: 14px; color: #841284; font-weight: bold;}
.purplesmall2{	font-size: 14px; color: #841284; font-weight: bold; cursor: pointer;}
.redsmall{    	font-size: 14px; color: #8e0d1f; font-weight: bold;}
.redsmall2{   	font-size: 14px; color: #8e0d1f; font-weight: bold;  cursor: pointer;}
.firstpagetext{ font-family: Verdana; font-size: 25px; color: white; display: none; margin-top: 456px; float: right; width: 956px; height: 100px; background: black;}
.contacttext{	font-family: Verdana; font-size: 12px; color: black; width: 100px; height: 20px; float: left;}
.text{		    font-family: Verdana; font-size: 12px; color: black;}
.errortext{		font-family: Verdana; font-size: 14px; color: red;}




/*
//
//  Small constant elements
//
*/

.home{ 		    height: 70px; width: 105px; float: left; border: none;}
.subheader{ 	height: 35px; width: 960px; float: left; padding-top: 15px; background: url(subheaderback.png);}
.header{ 		height: 70px; width: 960px; float: left; background: url(header.png); }
.footer{ 		height: 7px;  width: 960px; float: left; background-color: #220818; margin-top: 15px;}
.subheaderindex{height: 50px; width: 960px; float: left; }
.subheaderright{height: 50px; width: 240px; float: left; background: url(subheaderbackindex.png);}
a.subheaderleft{	height: 50px; width: 720px; float: left; background: url(clientarea.png);}



/*
//
// Index Images
//
*/

.randomimage1{display:none; margin: auto; height: 290px; width:770px; background: url("intro/1.jpg");}
.randomimage2{display:none; margin: auto; height: 290px; width:770px; background: url("intro/2.jpg");}
.randomimage3{display:none; margin: auto; height: 290px; width:770px; background: url("intro/3.jpg");}
.randomimage4{display:none; margin: auto; height: 290px; width:770px; background: url("intro/4.jpg");}
.randomimage5{display:none; margin: auto; height: 290px; width:770px; background: url("intro/5.jpg");}
.randomimage6{display:none; margin: auto; height: 290px; width:770px; background: url("intro/6.jpg");}