/****************
Purple Texture Template by tupence - http://templates.tupence.co.uk
NOTE - I've used some longhand in this document to make editing easier
*****************/

/***************************
 RESET BROWSER DEFAULTS 
***************************/
html, body, div, h1, h2, h3, h4, h5, h6, p, a, img, ul, li, fieldset, form, label, legend, header{
margin:0;
padding:0;
border:0;
}
/* render html5 elements as block in non-supported browsers */
header, footer, section, nav { /*add any other html5 elements you use*/
display: block;
}
/*********************
GENERAL LAYOUT
********************/
body{
background:url(bodybg02.jpg) top left repeat #dcd3dc;
background-attachment:fixed;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:.875em;
text-align:center;
}
#wrapper{
width:960px;
margin:0 auto;
text-align:left;
}
/****************
GENERAL FONTS & LINKS
****************/
/***Text***/
p{
line-height:1.4em;
margin-bottom:10px;
font-size:.97em;
color:#353535;
}
ul{
margin-top:10px;
padding-bottom:10px;
}
li{
margin:2px 20px;
line-height:1.2em;
font-size:.97em;
color:#353535;
}
/*** Headings ***/
h2, h3, h4{
font-family: "Times New Roman", Times, serif;
letter-spacing:0.05em;
font-weight:normal;
margin-bottom:5px;
}
h2{
font-size:2.2em;
text-shadow: 1px 1px 2px #9E9D8F;
margin-bottom:20px;
color:#746da9;
}
h2 span.tag {
font-size: 0.45em;
text-transform: uppercase;
color: #999;
font-family: Arial, Helvetica, sans-serif;
text-shadow: none;
display: block;
padding-top:2px;
}
h3, h4{
color:#625b97;
}
/*** Links ***/
a:link{
color:#3f5f8b;
}
a:visited{
color:#753f8b;
}
a:active, a:hover, a:focus{
text-decoration:none;
background:#e6dbea;
}

/*********
HEADER
*******/
header{
width:100%;
overflow:hidden;
height:150px;
background:url(headerbg.jpg) top left repeat #a690bc;
border-bottom:4px solid #9785a8;
-webkit-box-shadow: rgba(184, 183, 183, .75) 0 4px 4px;
-moz-box-shadow: rgba(184, 183, 183, .75) 0 4px 4px;
box-shadow: rgba(184, 183, 183, .75) 0 4px 4px;
}
/***** Masthead *****/
#masthead{
width:960px;
margin:0 auto;
}
#masthead h1{ /*Site Name Styling*/
float:left;
text-indent:-9999px;
height:132px;
width:440px;
background:url(masthead.png) center no-repeat;
}
/**** Skip navigation links ****/
#skipnav{
text-align:left;
font-size:80%;
padding:0 0 0 10px;
}
#skipnav a{
position:absolute; 
left:-9999em; /*move the skip navigation links off the page*/
width:200px; 
z-index:999; 
display:block;
}
#skipnav a:focus{
left:10px; /*bring the links back onto the page when in focus*/
top:0; 
color:#fff; 
background-color:#373737;
padding:10px; 
font-weight:bold; 
text-decoration:underline;
}
/***** NAVIGATION *****/
nav{
width:500px; /*if you change this width you must also change with width of 'masthead h1' above so they total 960px*/
float:right;
margin-top:30px;
}
nav ul{
list-style-type:none;
}
nav li{
font-family:"Times New Roman", Times, serif;
display:inline-block;
font-size:1.4em;
word-spacing:2px;
margin:10px;
}
nav a:link, nav a:visited{
text-decoration:none;
color:#f6e8f6;
font-weight:bold;
text-shadow: 0 0 8px #1a1a1a;
padding:10px;
}
nav a:active, nav a:hover, nav a:focus, nav a.now{
color:#fff;
text-shadow: 0 1px 0 #3d3d3b;
background:transparent;
}

/*******************
CONTENT
********************/
#content{
background:#faf3ff;
position:relative; /*enables us to place the bottom part over the top of the footer*/
margin-bottom:-40px;
margin-top:15px;
padding:20px;
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
-webkit-box-shadow: rgba(184, 183, 183, .75) 0 1px 5px;
-moz-box-shadow: rgba(184, 183, 183, .75) 0 1px 5px;
box-shadow: rgba(184, 183, 183, .75) 0 1px 5px;
}
#content section{
margin:10px 0;
padding:10px;
background:#fff;
border:1px solid #c6afdc;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
-webkit-box-shadow: rgba(184, 183, 183, .75) 0 1px 2px;
-moz-box-shadow: rgba(184, 183, 183, .75) 0 1px 2px;
box-shadow: rgba(184, 183, 183, .75) 0 1px 2px;
}
/*** Images ***/
.imgcenter{
text-align:center;
}
/*** SEARCH BOX ***/
section#search{
background-image:url(search.jpg);
background-repeat:repeat;
background-color:#a690bc;
padding:25px;
text-align:center;
margin:10px 0 30px 0;
-webkit-box-shadow: rgba(150, 148, 148, .75) 0 1px 5px;
-moz-box-shadow: rgba(150, 148, 148, .75) 0 1px 5px;
box-shadow: rgba(150, 148, 148, .75) 0 1px 5px;
}
#search fieldset label, legend{
display:none;
}
#search input#term {
width:650px;
background:#ece4f4;
padding:5px;
font-size:1.4em;
color:#6f6f6f;
border:4px solid #c6afdc;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
-webkit-box-shadow: 0 0 4px rgba(0,0,0, .55); 
-moz-box-shadow: 0 0 4px rgba(0,0,0, .55); 
box-shadow: 0 0 4px rgba(0,0,0, .55);
}
#search input#term:focus{
background:#dcd3dc;
color:#303030;
}
#search input#searchbutton {
width:100px;
vertical-align:top;
margin-left:15px;
padding:10px 6px;
background-color:#c7b5d9; /* Fallback for browsers that don't support gradients */
background: -moz-linear-gradient(top, #e5deec, #a88cc5);
background: -o-linear-gradient(top, #e5deec, #a88cc5);
background:-webkit-gradient(linear, left top, left bottom, from(#e5deec), to(#a88cc5));
background: -webkit-linear-gradient(top, #e5deec, #a88cc5);
background: linear-gradient(top, #e5deec, #a88cc5);
font-family:Arial, Helvetica, sans-serif;
font-size:1.1em;
color:#4e4e4c;
text-shadow: 0px 1px 0px #d3d3d3;
letter-spacing:.045em;
border:1px solid #b9a0d4;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
-webkit-box-shadow: 0 0 6px rgba(0,0,0, .35); 
-moz-box-shadow: 0 0 6px rgba(0,0,0, .45); 
box-shadow: 0 0 6px rgba(0,0,0, .45);
}
#search input#searchbutton:hover{
cursor:pointer;
-webkit-box-shadow: 0 0 3px rgba(0,0,0, .35); 
-moz-box-shadow: 0 0 3px rgba(0,0,0, .35); 
box-shadow: 0 0 3px rgba(0,0,0, .35);6f607e
}
#search input#searchbutton:focus{
-webkit-box-shadow: 0 0 1px rgba(0,0,0, .25); 
-moz-box-shadow: 0 0 1px rgba(0,0,0, .25); 
box-shadow: 0 0 1px rgba(0,0,0, .25);
background:#9282a2;
color:#fff;
}
/*** MAIN ***/
section#main img{
background: #f9eff9;
padding: 10px;
margin:10px 0;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0 0 10px rgba(132, 132, 132, .65);
-moz-box-shadow: 0 0 10px rgba(132, 132, 132, .65);
box-shadow: 0 0 10px rgba(132, 132, 132, .65);
}
/*** SIDE1 ***/
section#side1{
float:left;
width:420px;
}
/*** SIDE2 ***/
section#side2{
float:right;
width:420px;
background:#ebe5f2;
}
/*** FULLWIDTH ***/
section#fullwidth{
clear:both;
}
section#fullwidth ul{
list-style-type:none;
}
section#fullwidth ul li{
float: left;
padding:0;
margin:10px;
list-style-type:none;
font-family: 'Reenie Beanie', arial, serif;
font-size:1.4em;
text-align:center;
}
section#fullwidth ul li a{
float: left;
width:260px;
padding: 5px 5px 8px 5px;
text-decoration:none;
color:#666;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-moz-transform: rotate(1deg);
-o-transform: rotate(1deg);
transform: rotate(1deg);
-webkit-box-shadow: 0 0 10px rgba(132, 132, 132, .65);
-moz-box-shadow: 0 0 10px rgba(132, 132, 132, .65);
box-shadow: 0 0 10px rgba(132, 132, 132, .65);
}
section#fullwidth ul li:nth-child(even) a {/*rotate alternate images the opposite way*/
-moz-transform: rotate(-1deg);
-o-transform: rotate(-1deg);
transform: rotate(-1deg);
}
section#fullwidth ul a:after { /*place the link's title under the image*/
content: attr(title);
}
section#fullwidth ul li a:hover{
background:#fff;
}

/*******************
FOOTER
********************/
footer{
background-image:url(footer.jpg);
background-repeat:repeat;
background-color:#a690bc;
padding:50px 30px 10px 30px;
color:#e9e9e9;
font-size:.9em;
}
footer a{
color:#e2d9f9;
}
footer a:active, footer a:hover, footer a:focus{
background:#6f5d7b;
}

/*******************
BASE
********************/
#base{
margin:15px 0 50px 0;
font-size:.8em;
}
#base a{
color:#4b3f67;
}
#base a:active, #base a:hover, #base a:focus{
color:#000;
text-decoration:none;
}