/*Theme Name: Rawsterne v3
Theme URI: http://www.rawsterne.co.uk
Description: Personal Portfolio of John Rawsterne
Version: 1.0
Author: John Rawsterne
Author URI: http://www.rawsterne.co.uk/
*/

/* reset.css from blueprint */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,code,del,dfn,em,img,q,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
margin:0;
padding:0;
border:0;
font-weight:inherit;
font-style:inherit;
font-size:100%;
font-family:inherit;
/*vertical-align:baseline;*/
}

body {
line-height:1.5;
}

table {
border-collapse:separate;
border-spacing:0;
}

caption,th,td {
text-align:left;
font-weight:normal;
}

table,td,th {
vertical-align:middle;
}

blockquote:before,blockquote:after,q:before,q:after {
content:"";
}

blockquote,q {
quotes:"" "";
}

a img {
border:none;
}

/* typography.css from blueprint */
body {
font-size:75%;
color:#222;
background:#fff;
font-family:Arial, Helvetica, sans-serif;
}

h1,h2,h3,h4,h5,h6 {
font-family:"Century Gothic",Tahoma, Arial, sans-serif;
font-weight:normal;
color:#111;
}

h1 {
font-size:3em;
line-height:1;
margin-bottom:.5em;
}

h2 {
font-size:2em;
margin-bottom:.75em;
}

h3 {
font-size:1.5em;
line-height:1;
margin-bottom:1em;
}

h4 {
font-size:1.2em;
line-height:1.25;
margin-bottom:1.25em;
}

h5 {
font-size:1em;
font-weight:bold;
margin-bottom:1.5em;
}

h6 {
font-size:1em;
font-weight:bold;
}

h1 img,h2 img,h3 img,h4 img,h5 img,h6 img {
margin:0;
}

p {
margin:0 0 1.5em;
}

p img.left {
float:left;
margin:1.5em 1.5em 1.5em 0;
padding:0;
}

p img.right {
float:right;
margin:1.5em 0 1.5em 1.5em;
}

a:focus,a:hover {
color:#000;
}

a {
color:#009;
text-decoration:underline;
}

blockquote {
margin:1.5em;
}

strong {
font-weight:bold;
}

em,dfn {
font-style:italic;
}

dfn {
font-weight:bold;
}

sup,sub {
line-height:0;
}

abbr,acronym {
border-bottom:1px dotted #666;
}

address {
margin:0 0 1.5em;
font-style:italic;
}

del {
color:#666;
}

pre {
margin:1.5em 0;
white-space:pre;
}

pre,code,tt {
font:1em 'andale mono', 'lucida console', monospace;
line-height:1.5;
}

li ul,li ol {
margin:0 1.5em;
}

ul,ol {
margin:0 1.5em 1.5em;
}

ul {
list-style-type:disc;
}

ol {
list-style-type:decimal;
}

dl {
margin:0 0 1.5em;
}

dl dt {
font-weight:bold;
}

dd {
margin-left:1.5em;
}

table {
margin-bottom:1.4em;
width:100%;
}

th {
font-weight:bold;
}

thead th {
background:#c3d9ff;
}

th,td,caption {
padding:4px 10px 4px 5px;
}

tr.even td {
background:#e5ecf9;
}

tfoot {
font-style:italic;
}

caption {
background:#eee;
}

.small {
font-size:.8em;
margin-bottom:1.875em;
line-height:1.875em;
}

.large {
font-size:1.2em;
line-height:2.5em;
margin-bottom:1.25em;
}

.hide {
display:none;
}

.quiet {
color:#666;
}

.loud {
color:#000;
}

.highlight {
background:#ff0;
}

.added {
background:#060;
color:#fff;
}

.removed {
background:#900;
color:#fff;
}

.first {
margin-left:0;
padding-left:0;
}

.last {
margin-right:0;
padding-right:0;
}

.top {
margin-top:0;
padding-top:0;
}

.bottom {
margin-bottom:0;
padding-bottom:0;
}

/* global stuff */
.clearfix:after {
content:".";
display:block;
height:0;
clear:both;
visibility:hidden;
}

a,a:visited {
color:#0076a3;
text-decoration:none;
border-bottom:#0076a3 1px solid;
}

a:hover {
border-bottom:#a00 1px dashed;
text-decoration:none;
color:#a00;
}

/* body */
body {
background:#292f31;
color:#000;
}

/* layout */
.container {
width:960px;
margin:0 auto;
position:relative;
overflow:hidden;
}

/* header */
#header {
background:url(images/header-bg.png) repeat-x left top;
height:240px;
}

#header h1 {
text-indent:-9999em;
overflow:hidden;
width:162px;
height:49px;
background:url(images/logo.png) no-repeat left top;
position:absolute;
top:27px;
left:0;
}

#header h1 a{
display:block;
width:162px;
height:49px;
}

#header h2 {
text-indent:-9999em;
overflow:hidden;
width:960px;
height:75px;
background:url(images/tagline.png) no-repeat left top;
position:absolute;
top:105px;
left:0;
}

#header .container {
height:240px;
background:url(images/header-highlight.png) no-repeat left top;
}

#navigation,#navigation li {
list-style:none;
}

#navigation {
position:absolute;
right:0;
top:0;
text-align:right;
}

#navigation li {
float:left;
margin:0 0 0 20px;
}

#navigation li a {
color:#7b7b7b;
font:bold 1em Arial,sans-serif;
text-transform:uppercase;
border:0;
padding:44px 10px 5px;
display:block;
background:url(images/nav-bg.png) no-repeat 50% top;
}

#navigation li a:hover {
color:#fff;
background-position:50% -80px;
}

#content {
background:#fff;
position:relative;
overflow:hidden;
}

#content .container {
padding:2em 0 5em;
}

#home-info {
width:960px;
padding:15px 0 0;
background:url(images/box-3-bg.png) no-repeat left top;
margin:3em 0 0;
}

#home-info ul,#home-info li {
list-style:none;
margin:0;
}

#home-info li.column {
width:240px;
float:left;
padding:10px 30px;
margin-left:30px;
}

/*li.middle-col{width:266px;border-left:#f0f0f0 2px solid;border-right:#f0f0f0 2px solid;}*/
#home-info h3 {
color:#FFFFFF;
font-weight:bold;
margin:0 0 0.25em 65px;
}

#home-info h4 {
color:#718085;
margin:0 0 3em 65px;
}

#home-info blockquote {
padding:0;
margin:0;
}

#home-info .middle-col li {
padding-left:15px;
background:url(images/bullet.png) no-repeat left center;
}

#home-info li.first-col {
margin-left:0;
}

#home-info-bottom {
height:15px;
background: url(images/box-3-bg.png) no-repeat left bottom;
}

/* slider */
#slider {
margin:0 auto;
width:820px;
height:260px;
position:relative;
}

#slider-wrap {
background:transparent url(images/slider-bg.png) no-repeat scroll left top;
height:260px;
margin:0 auto;
padding:40px 70px;
position:relative;
width:820px;
}

#slider-thumbs {
float:left;
width:580px;
}

#slider-text {
float:right;
width:240px;
height:260px;
position:relative;
}

#slider ul,#slider li {
margin:0;
padding:0;
list-style:none;
}

#prevBtn,#nextBtn {
display:block;
width:26px;
height:36px;
position:absolute;
left:5px;
top:125px;
}

#nextBtn {
left:929px;
}

#prevBtn,#nextBtn {
display:block;
width:26px;
height:36px;
background:url(images/button-left.png) no-repeat 0 0;
text-indent:-9999em;
overflow:hidden;
border:0;
}

a#prevBtn:hover,a#nextBtn:hover {
border:0;
}

a#nextBtn {
background:url(images/button-right.png) no-repeat 0 0;
}

#slider-thumbs img {
width:540px;
height:240px;
padding:10px 8px;
}

#slider-thumbs a {
border:0;
}

#slider-text a.view-more {
display:block;
width:220px;
background:url(images/featured-link-bg.png) repeat-y left top;
padding:5px 10px;
color:#7a7979;
text-align:right;
border:0;
}

#slider-text a.view-more:hover {
background:#ccc;
color:#000;
border:0;
}

/* portfolio */
#portfolio, #portfolio li{
list-style:none;
margin:0;
padding:0;
}

#portfolio{
margin:0 0 2em 0;
overflow:hidden;
width:960px;
}

#portfolio li{
float:left;
width:300px;
height:200px;
margin-bottom:30px;
}

#home #portfolio li{
margin-bottom:0;
}

#portfolio li.middle{
margin-left:30px;
margin-right:30px;
}

#portfolio li a{
display:block;
border:0;
width:280px;
height:180px;
padding:9px;
background:#eee;
border:#ddd 1px solid;
}

#sub-cats, #sub-cats li{
list-style:none;
margin:0;
padding:0;
}

#sub-cats{
margin:0 0 3em 0;
width:960px;
}

#sub-cats li{
float:left;
margin:0 20px 0 0;
}

#sub-cats li a{
display:block;
border:0;
background:#e6e6e6;
padding:5px 20px;
}

#sub-cats li a:hover, #sub-cats li.current-cat a{
background:#292f31;
color:#ddd;
}

#main-column{float:right;width:620px;height:auto;}

#sub-column{float:left;width:300px}

#sub-column li.section{
border-bottom:#eee 2px solid;
padding-bottom:2em;
padding-top:2em;
}

#main-column img{
padding:9px;
background:#eee;
border:#ddd 1px solid;
margin:0 0 1em 0;
}

#sub-column ul{
list-style:none;
padding:0;
margin:0;
}

#sub-column ul ul{
list-style:square;
margin:0 0 0 0;
list-style-position:inside;
}

#sub-column blockquote{
margin:0;
padding:0;
}

#page #sub-column{
float:right;
background:#eee;
padding:20px;
width:260px;
}

#page #main-column{
float:left;
}

div.testimonial{
background:#eee url(images/quote-left.png) no-repeat 40px 20px;
padding:20px 60px 0 120px;
font-size:1.2em;
margin:0 0 2em 0;
overflow:hidden;
border:#ddd 2px solid;
}

div.testimonial blockquote{
background:url(images/quote-right.png) no-repeat right bottom;
padding:0 60px 0 0;
margin:0;
}

li.testimonial{
padding:30px 40px 30px 60px;
background:#eee url(images/quote-left.png) no-repeat 10px 10px;
margin:0 0 2em 0;
}


#freelance-status{
text-indent:-9999em;
overflow:hidden;
line-height:normal;
padding:0;
margin:0 0 1em 0;
background:url(images/freelance-available.png) no-repeat left top;
width:260px;
height:170px;
}

a#sidebar-services,a#sidebar-portfolio, a#sidebar-testimonials{
display:block;
text-indent:-9999em;
overflow:hidden;
line-height:normal;
padding:0;
margin:0 0 2em 0;
background:url(images/buttons-sidebar.png) no-repeat left top;
width:260px;
height:80px;
border:0;
}

a#sidebar-services{
background-position:-260px 0;
}

a#sidebar-portfolio{
background-position:-520px 0;
}

a#sidebar-testimonials{
}


a#sidebar-services:hover{
background-position: -260px -80px;
border:0;
}

a#sidebar-portfolio:hover{
background-position: -520px -80px;
border:0;
}

a#sidebar-testimonials:hover{
background-position: 0 -80px;
border:0;
}

.divider{
margin:5em 0;
width:960px;
height:26px;
background:url(images/divider.png) no-repeat left top;
}

#main-column img#profile-pic{float:left;margin:0 30px 10px 0;}

/* forms */
.wpcf7-form label{
display:block;
}

div.wpcf7-mail-sent-ok{
background:#339988;
border:0 none;
color:#FFFFFF;
font-size:2em;
margin:1.5em 0;
padding:0.5em;
text-align:center;
}

div.wpcf7{
background:#F6F6F6;
border:1px solid #DDDDDD;
margin:0;
padding:30px;
}

#search-form{
background: url(images/sidebar-search-bg.png) no-repeat left top;
border:0;
padding:77px 0 0 20px;
height:50px;
width:240px;
margin:0 0 2em 0;
}

#sub-column ul#category-list{
margin:0 0 2em 0;
list-style:square;
list-style-position:inside;
}

#sub-column ul#category-list li{
margin:0 0 1em 0;
}

#sub-column ul#category-list ul{
list-style:none;
margin:0 0 0 30px;
}


/* footer */
#footer {
background:url(images/footer-bg.png) repeat-x left top;
padding:8em 0 2em;
color:#556166;
overflow:hidden;
}

#footer h4{
color:#ccc;
text-transform:uppercase;
}

#footer a{
color:#7f9199;
border-bottom:#7f9199 1px solid;
text-decoration:none;
}

#footer a:hover{
border-bottom:#a00 1px dashed;
text-decoration:none;
color:#a00;
}

#footer ul,#footer li {
margin:0;
padding:0;
list-style:none;
}

#footer ul#columns{
width:960px;
background:url(images/footer-boxes.png) no-repeat left top;
}

#footer .box-bottom{
background:url(images/footer-boxes.png) no-repeat left bottom;
width:960px;
height:20px;
margin:0 0 2em 0;
}

#footer ul#columns li.column {
width:240px;
float:left;
padding:30px;
margin-left:30px;
}

#footer ul#columns li.first-col {
margin-left:0;
}

#footer .twitter-feed{
border-top:#16191a 1px dotted;
}

#footer .twitter-feed li{
padding:1em 0;
border-bottom:#16191a 1px dotted;
}

#footer .twitter-feed li small{
display:block;
padding:5px 0 10px 0;
}

#footer #useful-links li{
list-style:square;
list-style-position:inside;
margin:0 0 10px 0;
}

#footer #latest-work li{
float:left;
width:110px;
height:110px;
margin:0 0 10px 0;
}

#footer #latest-work li.first-col{
margin-right:10px;
}

#footer #latest-work li a{
border:0;
padding:5px;
background:#556166;
display:block;
width:100px;
height:100px;
}

#footer #latest-work li a:hover{
background:#fff;
}

#footer a#follow-me{
margin-top:1em;
text-indent:-9999em;
overflow:hidden;
width:240px;
height:65px;
display:block;
background:url(images/twitter-follow-me.png) no-repeat left top;
border:0;
}

#footer a#follow-me:hover{
border:0;
}
