@charset "utf-8";

/*
Theme Name: Stiles Petersfield
Version: 1.0
Author: creativeworkz
Author URI: http://www.creativeworkz.co.uk

*/

*{
  margin: 0;
  padding: 0;
}

html, body{
 height:100%;
}

html{
  font-size: 100%;
}

p {
	margin-bottom:10px;
}

h1, h2, h3, h4, h5, h6 {
	margin-bottom:10px;
}

textarea {	
	background:url(images/text-area-bg.png) left top;
}

body {
	margin: 0px;
	padding:0px;
	font-family: "Georgia", "Lucida Sans Unicode", Arial, Helvetica, Sans, FreeSans, Jamrul, Garuda, Kalimati;
	color:#000000;
	min-height:100%;
  	height:auto !important; /* ie6 ignores it */
  	height:100%; /* fix */
	
}

a{
  color: #2d83d5;
  text-decoration: none;
}

fieldset{
	padding:15px;
}

legend {
	padding:5px;
}

a:hover{
  color: #fff;
  background: #2d83d5;
  text-decoration: none;
}


#page-wrap {
	background:url(images/header-bg.jpg) repeat-x left top;
}

#page-wrap-two {
	background: transparent url(images/header-center.jpg) no-repeat center top;
	width: 100%;
  	display:block;
	height:230px;
	
}
#page {
	background-repeat: no-repeat;
	background-position: left top;
	margin: 0 auto;
	width:950px;
}


#main-wrap {
  position:relative;		/* IE7 overflow bugfix */
  clear:both;
  float:left;
  width:100%;
  overflow:hidden;			/* chops off any overhanging divs */
}

#mid-wrap, #side-wrap {
  float:left;
  width:100%;
  position:relative;
}

#mid, #sidebar, #sidebar2 {
  float:left;
  position:relative;
  padding:0;
  overflow:hidden;
}

#page #main-wrap #mid-wrap { right:0%;   /* width of the 2nd column, 0 because it doesnt exist */ }
#page #main-wrap #side-wrap { right:70%; /* width of the main column */ }

#page #main-wrap #mid {
  width:70%;			/* width of main column */
  left:70%;				/* same */
}

#page #main-wrap #sidebar {
  width:30%;			/* width of the sidebar */
  left:70%;
}

#content {
	margin-top:20px;
	float:left;
	width: 95%;
	color:#333333;
	font-size:12px;
	text-align:justify;
}

#content p {
	
	margin-bottom:20px;
}

#content h1 {
	color: #2d83d5;
	padding-left:20px;
	font-size:24px;
	background:url(images/content-pointer.png) no-repeat top left;
	
}

#content h2 {
	color:#3a4c58;
	font-size:20px;
	margin-bottom:20px;

}

#content ul li {
	list-style:url(images/bullet.png);
	margin-left:25px;
	margin-bottom:10px;
	padding-left:5px;
}


.entry {
	background:url(images/entry-shadow.png) no-repeat top left;
	padding-left:30px;
	padding-top:30px;
}

.entry h4 {
  font-weight: normal;
  font-size: 22px;
  color:#a7a7a7;
  margin-bottom:20px;
  border-bottom:1px dotted #CCCCCC;
}



#sidebar {
	float:left;
	

}
#footer-wrap {
 	margin-top: 8em;
	padding-top: 2.5em;
	padding-bottom: 1em;
  	width: 100%;
	background:url(images/footer-bg.jpg) left top;
  	text-align: center;
	color:#3a4c58;
	font-size:12px;
	border-top:1px solid #e7e7e7;
	border-bottom:1px solid #e7e7e7;

}

#footer {

  	width: 60%;
	margin:0 auto;
	min-width:900px;


}

/* Begin Images */
p img {
	padding: 0;
	max-width: 100%;
	}

/*	Using 'class="alignright"' on an image will (who would've
	thought?!) align the image to the right. And using 'class="centered',
	will of course center the image. This is much better than using
	align="center", being much more futureproof (and valid) */

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
	}

img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
	}

img {
	border:0;
}

.alignright {
	float: right;
	}

.alignleft {
	float: left
	}
/* End Images */

#sidebar li {
	list-style:none;
	list-style-type:none;
}

.description {
	padding-top:12px;
	color:#f1f1f1;
	font-size:small;
	
}

#title-wrap {
	height:120px;
}

.title-name  {
	padding-left:45px;
	padding-top:94px;
	font-size:30px;
	color:#f1f1f1;
}

.title-name a {
	font-size:20px;
	color:#f1f1f1;
	text-decoration:none;	
}

.title-name a:hover {
	font-size:20px;
	color:#f1f1f1;
	text-decoration:none;	
	background:none;	
}


#header{
  	height: 230px;
  	z-index: 2; /* fix for stupid ie6/7 bug */
  	position:relative;
}



#tabs{
 font-size:14px;
 width: 100%;
 line-height:normal;
 position: absolute;
 bottom: 0;
 left: 0;
}

#tabs ul{
 list-style:none;
}

#tabs li{
 display:inline;
 float: left;
 position: relative;
 margin: 0;
 padding: 0;
 margin-right:5px;
}

#tabs a {
 float:left;
 background:url(images/tab-left.png) no-repeat left top;
 color:#0470a0;
 padding-left:9px;
 margin-right:3px;
 text-decoration:none;
 color:#cfcfcf;
 cursor: pointer; /* IE 7 bug-fix */
}

#tabs a span{
 float:left;
 display:block;
 background:url(images/tab-right.png) no-repeat right top;
 height: 29px;
 padding-right: 10px;
}

#tabs a span span{
 display:block;
 background:none;
 height: auto;
 padding: 4px 4px 0 4px;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs a span {float:none;}
/* End IE5-Mac hack */
#tabs a:hover span {
 color:#cfcfcf;
}

#tabs a:hover{
 background-position:0% -29px;
 color: #2d83d5;
}
#tabs a:hover span{
 background-position:100% -29px;
 color: #2d83d5;
}

#tabs a.active, #tabs li.current_page_item a, #tabs li.current-cat a,
#tabs li.current_page_item a:hover, #tabs li.current-cat a:hover {
 background-position:0% -29px;
 color: #2d83d5;
}
#tabs a.active span, #tabs li.current_page_item a span, #tabs li.current-cat a span,
#tabs li.current_page_item a:hover span, #tabs li.current-cat a:hover span{
 background-position:100% -29px;
 color: #2d83d5;
}


/* sub-menus */
#tabs ul li{
 float:left;
 position:relative;
 
}

#tabs ul ul {
  background:url(images/footer-bg.jpg) left top;
  position: absolute;
  display: none;
  width:150px;
  top: 29px;
  left: 0;
  margin: 0;
  padding: 4px 0;
  line-height: 100%;
  border-left: 1px solid #999;
  border-right: 1px solid #999;
  border-bottom: 1px solid #999;
  -moz-border-radius-bottomleft: 4px;
  -moz-border-radius-bottomright: 4px;
}

#tabs ul ul ul{
  border: 1px solid #999;
  -moz-border-radius: 4px;
}

#tabs ul a.active ul, #tabs ul li.current_page_item ul,  #tabs ul li.current-cat ul{
  background: #fff;
}

#tabs ul.active ul ul, #tabs ul li.current_page_item ul ul, #tabs ul li.current-cat ul ul{
  border: 1px solid #666666 !important;
}

#tabs ul li ul a{
	
  height:auto;
  float:left;
  background: none;
  margin: 0;
  padding: 4px 10px;
  color: #000;
  font-weight: normal;
  line-height: 125%;
}

#tabs ul li ul a span, #tabs ul li ul a span span{
  margin: 0;
  padding: 0;
  height: auto;
  float: none;
}

#tabs ul ul a:hover, #tabs ul ul a:hover,
#tabs ul a.active ul a:hover, #tabs ul li.current_page_item ul a:hover, #tabs ul li.current-cat ul a:hover{
  color:#fff;
}

#tabs ul li ul a span, #tabs ul li ul a span{
  background: none;
}

#tabs ul ul ul{
  top:auto;
}

#tabs ul li ul ul {
  left:100px;
  top: 4px;
  z-index:100;
}

#tabs ul li:hover ul ul, #tabs ul li:hover ul ul ul, #tabs ul li:hover ul ul ul ul{
  display:none;
}
#tabs ul li:hover ul, #tabs ul li li:hover ul, #tabs ul li li li:hover ul, #tabs ul li li li li:hover ul{
  display:block;
}


#sidebar h2, #sidebar2 h2{
  font-family: "Georgia", "Lucida Sans Unicode", Arial, Helvetica, Sans, FreeSans, Jamrul, Garuda, Kalimati;
  font-weight: normal;
  font-size: 130%;
  margin: 1em 0 .4em;
  color:#a7a7a7;
  border-bottom:1px dotted #CCCCCC;
}


#sidebar-wrap1{
  background: transparent url(images/side-start.png) no-repeat left top;
  padding-left: 28px;
  margin-top: 95px;
  height: 100%;
  min-height:400px;
}

#sidebar-wrap2{
  background: transparent url(images/side-bg.png) no-repeat right top;
  padding-right: 40px;
  padding-top: 30px;
  padding-left:10px;
  height: 100%;
  min-height:400px;
}

#sidebar li, #sidebar2 li{
  list-style-type: none;
  line-height: 140%;
  margin: 0;
  padding: 0;
  list-style-position: outside; /* ie 7 bugfix */
}

/* sidebar menu */

#sidebar ul.nav{
  margin-top: 1.8em;
}

#sidebar ul.nav li{
  list-style-type: none;
  background: transparent url(images/div-h.gif) repeat-x left bottom;
  padding: 2px 0 3px 0;
  margin: 0;
  position: relative;
}

/* no bg on the last menu item */
#sidebar ul.nav li.last{
  background: none
}


#sidebar ul.nav ul{
  margin: 0px 0 12px;
}

#sidebar ul.nav ul ul{
  margin: 0px 0 8px; /* lower bottom-padding for 2+ level menu */
}

/* 2nd level menu */
#sidebar ul.nav li li{
  background: none;
  padding: 0;
  margin-left: 25px;
}

/* 3rd ... n levels */
#sidebar ul.nav li li li{
  margin-left: 10px;
}

#sidebar ul.nav li a{
  background: none;
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 110%;
  padding: 3px 27px 3px 8px;
  color: #000;
  cursor: pointer;
}

#sidebar ul.nav li a:hover{
  background: #efefee url(images/side-nav-bg.png) repeat-y right top;
  color: #ed2124;
}

#sidebar ul.nav li a span{
  background: transparent url(images/b1.png) no-repeat left 3px;
  padding-left: 17px;
  display: block;
}

#sidebar ul.nav li a:hover span{
  background-position: left -97px;
  color: #ed2124;
}

#sidebar ul.nav li li a{
  text-transform: none;
  font-size: 100%;
  padding: 0;
}

#sidebar ul.nav li li a:hover{
  background: none
}

#sidebar ul.nav li li a span{
  background: none;
  padding: 0;
}

#sidebar ul.nav li a.rss{
  background: transparent url(images/side-nav-rss.gif) no-repeat left top;
  display: none;
  width:26px;
  position: absolute;
  height: 13px;
  right: 0;
  padding: 0 4px 0 0;
  margin-top: 2px;
  top: 0;
  text-decoration: none;
  cursor: pointer;
  z-index: 5;
}

#sidebar ul.nav li li a.rss{
  visibility: hidden;
}

#sidebar ul.nav li a.rss:hover{
  background-position: 0px -13px;
}


/* sidebar content box */

#sidebar .box, #sidebar2 .box{
  margin: 16px 0 2px;
}

#sidebar .box h2, #sidebar2 .box h2{
  background: transparent url(images/side-box-top.png) no-repeat left bottom;
  padding: 4px 0 4px 20px;
  color: #8d8b8b;
  margin: 20px 0 0 0;
}

#sidebar .box ul, #sidebar2 .box ul{
  background: transparent url(images/side-box-bg.png) repeat-y left bottom;
  padding: 10px 20px;
  display: block;
}

#sidebar .box ul ul, #sidebar2 .box ul ul{ background: none; }
#sidebar .box ul li, #sidebar2 .box ul li{ line-height: 150%; }

#sidebar .box caption, #sidebar2 .box caption{
  text-align: left;
  font-weight: bold;
}

#sidebar li.linkcat li, #sidebar2 li.linkcat li,
.widget.widget_links ul li, .widget.widget_meta ul li, .widget.widget_categories ul li, .widget.widget_archive ul li, .widget.widget_pages ul li, .widget.widget_recent_entries ul li{
   background: transparent url(images/bullet-arrow.jpg) no-repeat left 6px;
}

#sidebar li.linkcat a, #sidebar2 li.linkcat a,
.widget.widget_links ul li a, .widget.widget_meta ul li a, .widget.widget_categories ul li a, .widget.widget_archive ul li a, .widget.widget_pages ul li a, .widget.widget_recent_entries ul li a{
   text-decoration: none;
   margin-left: 22px;
   margin-top: 2px;
   display: inline-block;
}




.clear {
	clear:both;
}


.widget_calendar table#wp-calendar{
  width: 100%;
  border: 1px solid #ccc;
}

.widget_calendar table#wp-calendar th, .widget_calendar table#wp-calendar td{
  text-align: center;
}

.contact-1 {
	background: transparent url(images/bullet-arrow.jpg) no-repeat center left;
	color:#3d505a;
	height:25px;
	padding-left:25px;
	font-size:18px;
	
	
}

.contact-2 {
	/*background:url(images/contact-2.jpg) top left no-repeat; */
	background: transparent url(images/bullet-arrow.jpg) no-repeat center left;
	font-size:11px;
	height:25px;
	padding-left:25px;
	
}

#searchtab{
  background: transparent url(images/search-bg.png) no-repeat left top;
  height: 40px;
  position: relative;
}

#searchtab .inside{
  background: transparent url(images/search-go.png) no-repeat right top;
  height: 40px;
}

#searchtab input{
  border: 0;
  background: none;
  font-size: 12px;
  padding: 0px;
}

#searchtab input.searchfield, #searchtab input#s{
  position: absolute;
  top: 7px;
  left: 10px;
  color:#333333;
  padding: 0px;
  margin: 0;
  width: 80%;
}

#searchtab input.searchfield:focus, #searchtab input#s:focus{ color: #000; }

#searchtab input.searchbutton, #searchtab input#searchsubmit{
  position: absolute;
  right: 5px;
  top: 6px;
  color:#FFF;
  text-transform: uppercase;
  padding: 0px;
  margin: 0;
  cursor:pointer;
}

#searchtab label{ display: none; }
#searchtab input.searchbutton:hover{ color: #fff; }

