﻿/* -----------------------------------------------------------------------------------------------------------------

	Webteam at Furness.net
	
	SCREEN - Core Stylesheet
	
	Web					: http://web.furness.net
	Filename    		: css/home.css
	Last Updated		: 20. 04. 2010
	Copyright			: (c) 2010 Chris Sharp
	Author				: Chris Sharp - Furness Internet
	Web					: http://www.csharpdesign.co.uk | http://www.furness.net
	
--------------------------------------------------------------------------------------------------------------------*/

/*-------------------------------------------------------------------------------------------------------------------

	Table of Contents
	
	01. =@font-face
	02. =Structure
	03. =Links
	04. =Header
	05. =Nav
	06. =Headings
	07. =Typography
	08. =Containers
	09. =Images
	10. =Footer

	11. =Work Page
	12. =Case Study Page
	13. =Sidebar
	14. =Contact Form
	15. =Team Page
    16. =Blog Page
 		
--------------------------------------------------------------------------------------------------------------------*/

/*-------------------------------------------------------------------------------------------------------------------

	=@font-face
 		
--------------------------------------------------------------------------------------------------------------------*/

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on April 13, 2010 */



@font-face {
	font-family: 'MuseoSlab500';
	src: url('../fonts/museo_slab_500.eot');
	src: local('../Museo Slab'), local('../MuseoSlab-500'), url('../fonts/museo_slab_500.woff') format('woff'), url('../fonts/museo_slab_500.ttf') format('truetype');
}

@font-face {
	font-family: 'MuseoSlab500Italic';
	src: url('../fonts/museo_slab_500italic.eot');
	src: local('../Museo Slab'), local('../MuseoSlab-500Italic'), url('../fonts/museo_slab_500italic.woff') format('woff'), url('../fonts/museo_slab_500italic.ttf') format('truetype');
}

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on April 1, 2010 10:16:01 AM America/New_York */



@font-face {
	font-family: 'MarketingScriptRegular';
	src: url('../fonts/MarketingScript.eot');
	src: local('../Marketing Script'), local('../MarketingScript'), url('../fonts/MarketingScript.woff') format('woff'), url('../fonts/MarketingScript.ttf') format('truetype'), url('../fonts/MarketingScript.svg#MarketingScript') format('svg');
}


/*-------------------------------------------------------------------------------------------------------------------

	=Structure
 		
--------------------------------------------------------------------------------------------------------------------*/

body { 
	background: #FBF9F3 url('../images/site/bg_body.jpg') repeat-x left top;
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 62.5%;
	margin: 0;
	padding: 0;
	text-align: center; /*Tricks IE into centering the wrapper div*/
}

body#page { 
	background: #FBF9F3 url('../images/site/bg_body_page.jpg') repeat-x left top;
}

#wrapper {
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
	position: relative;
	text-align: left; /*For IE5 - Aligning text in the wrapper to the left gets it back in the proper position*/
	width: 960px;
}

/*-------------------------------------------------------------------------------------------------------------------

	=Links
 		
--------------------------------------------------------------------------------------------------------------------*/

a {text-decoration: none;}
a:link {color: #276AA3;}
a:hover {
	color: #103F66;
	text-decoration: underline;
}
a:visited {color: #3880BE;}
a:focus {color: #103F66;}

/*-------------------------------------------------------------------------------------------------------------------

	=Header
 		
--------------------------------------------------------------------------------------------------------------------*/

div#header {
	background: url('../images/site/bg_header.jpg') no-repeat left top;
	height: 141px;
}

#header p {
	background: url('../images/site/icon_mail.png') no-repeat left center; 
	color: #494136;
	font: italic 1.1em Georgia, Cambria, serif;
	float: right;
	margin-top: 34px;
	padding: 4px 0 4px 24px;
}

ul.contact-details li.getintouch {
	font-family: Cambria, Georgia, serif;
	font-size: 1.2em;
}

ul.contact-details {
	float: right;
	margin-top: 34px;
}

ul.contact-details li { 
	color: #494136;
	font: italic 1.1em Georgia, Cambria, serif;
	float: right;
	list-style-type: none;
	padding: 4px 0 4px 22px;
	margin:0px 0px 0px 20px;
}

ul.contact-details li.phone {
	background: url('../images/site/mobile_phone.png') no-repeat left center;
	color: #A3590F;
}

ul.contact-details li.email {
	background: url('../images/site/icon_mail.png') no-repeat left center;
}

img.logo {
	float: left;
	margin-top: 30px;
}

/*-------------------------------------------------------------------------------------------------------------------

	=Nav
 		
--------------------------------------------------------------------------------------------------------------------*/

ul#nav {
	clear: right;
	display:inline;
	float:right;
	height: 17px;
	list-style:none;
	overflow: hidden;
	padding: 20px 0 20px 0;
}

ul#nav li {
	display:inline;
	font-family: 'MuseoSlab500Italic', Helvetica, Arial, sans-serif;
	font-size: 1.4em;
	font-weight: bold;
	padding: 18px 17px 20px 17px;
	letter-spacing: 1px;
	text-shadow: 1px 1px #EEEEEE;
}

ul#nav li:last-child {
	padding-right: 0;
}

ul#nav li a {
	height: 41px;
	padding-top: 16px;
	padding-bottom: 11px;
	text-decoration: none;
}

ul#nav li.active {
	background: url('../images/site/menu_underline.jpg') repeat-x left bottom;
	color: #9E5914;
	margin: 0 17px 0 17px;
	padding: 0;
	padding-bottom: 4px;
}

ul#nav li.active:last-child {
	margin: 0 0 0 17px;	
}

ul#nav li a:hover {
	color: #103F66;
}


/*-------------------------------------------------------------------------------------------------------------------

	=Headings
 		
--------------------------------------------------------------------------------------------------------------------*/

h1 {
	font-family: 'MuseoSlab500', Arial, sans-serif;
	color: #626367;
	font-size: 2.8em;
	line-height: 1.3em;
	padding-bottom: 18px;
	margin-top: 42px;
	
	text-shadow: 2px 2px #fff;
}

h1 span {
	color: #71A129;
}


h1.blog {
	color: #3980B4 !important;
	font-weight: 400;
}

h2 {
	font-family: 'MuseoSlab500', Arial, sans-serif;
	color: #434241;
	font-size: 2em;
	line-height: 1.3em;
	margin-bottom: 24px;
}

.request h2 {
	color: #985E24;
	margin-bottom: 6px;
}

h3 {
	font-size: 2.4em;
}


h3.blog {
	font-size: 1.9em;
}

h3.blog span {
	color: #8C857E;
	font: 0.7em italic Georgia, Cambria, serif;
	padding-bottom: 42px;
	width: 300px;
}


h3.team {
	color: #A87A56; /* A16739 */
	font-size: 3.4em;
	line-height: 1.2em;
}

.team-figure h3 {
	margin-bottom: 3px;
}

.figure h4 {
	color: #3A3932;
	font-family: Georgia, Cambria, serif;
	font-size: 1.4em;
	font-style: normal;
	margin-top: 24px;
	margin-bottom: 8px;
}

h5 {
	font-size: 1.8em;
}

h3, h5 {
	font-family: 'MarketingScriptRegular', Cambria, Georgia, serif;
	color: #333;
	margin-bottom: 20px;
}

h6 {
	color: #333333;
	font: italic 1.2em Georgia, Cambria, serif;
}

/*-------------------------------------------------------------------------------------------------------------------

	=Typography
 		
--------------------------------------------------------------------------------------------------------------------*/

#main p {
	color: #8C857E;
	font: 1.4em/1.5em Georgia, Cambria, serif;
	padding-bottom: 42px;
	width: 300px;
}

#main p a {
	font-style: italic;
}

#main404 p {
	color: #8C857E;
	font: 1.4em/1.5em Georgia, Cambria, serif;
	padding-bottom: 42px;
	width: 300px;
}


.figure p a {
	font-family: Georgia, Cambria, serif;
	font-size: 1.1em;
	font-style: italic;
	line-height: 1.9em;
}

.module p, .module-page p {
	color: #666;
	font-family: Georgia, Cambria, serif;
	font-size: 1.1em;
	font-style: italic;
	line-height: 1.6em;
	margin-bottom: 24px;
}
 
.page-container a {
	margin-bottom: 14px;
}

.module p.quote, .module-page p.quote {
	font-size: 1.4em;
	line-height: 1.6em;
	margin-left: 28px;
	margin-bottom: 22px;
}

p.client-name, #content p.client-name {
	color: #494136;
}

.module-subfooter p {
	margin-bottom: 18px;
}

.module-subfooter li {
	margin-bottom: 6px;
}

.module-subfooter p, li {
	color: #666;
	font-size: 1.1em;
	line-height: 1.6em;
}

/*  Footer icons  */

.module-subfooter li.design {
	background: white url('../images/site/icon_web.png') no-repeat left center;
	padding-left: 24px;
}

.module-subfooter li.code {
	background: white url('../images/site/icon_code.png') no-repeat left center;
	padding-left: 24px;
}

.module-subfooter li.cms {
	background: white url('../images/site/icon_cms.png') no-repeat left center;
	padding-left: 24px;
}

.module-subfooter li.seo {
	background: white url('../images/site/cog.png') no-repeat left center;
	padding-left: 24px;
}

.module-subfooter li.hosting {
	background: white url('../images/site/server.png') no-repeat left center;
	padding-left: 24px;
}

.module-subfooter li.twitter {
	background: url('../images/site/icon_twitter.png') no-repeat left center;
	padding-left: 24px;
}

/*  Footer icons end  */

.module-subfooter ul.services li {
	margin-bottom: 10px;
}

.module-subfooter ul.contact li {
	margin-bottom: 4px;
}

p.team-intro {
	border-bottom: 1px solid #D9D4C6;
	overflow: hidden;
	padding-bottom: 24px;
}

/*-------------------------------------------------------------------------------------------------------------------

	=Containers
 		
--------------------------------------------------------------------------------------------------------------------*/

div#main {
	background: url('../images/site/bg_main.jpg') no-repeat left top;
	clear: both;
	height: 453px;
	width: 960px;
	overflow: hidden;
}

div#main404 {
	background: none;
	clear: both;
	height: 453px;
	width: 960px;
	overflow: hidden;
}


div#submain {
	background: url('../images/site/bg_submain_repeat.jpg') repeat-x left top;
	width: 100%;
	text-align: left;
}

div.submain-container {
	background: url('../images/site/bg_submain.jpg') no-repeat left top;
	height: 345px;
	margin: 0 auto;
	overflow: hidden;
	width: 960px;
}

div.module {
	float: left;
	margin-top: 18px;
}

div.Testimonials {
	margin-right: 31px;
	width: 300px;
}

div#subfooter {
	background: white url('../images/site/bg_subfooter.jpg') repeat-x left top;
	clear: both;
	height: 237px;
	text-align: left;
	width: 100%
}

div.subfooter-container {
	margin: 0 auto;
	overflow: hidden;
	width: 952px;
}

div.module-subfooter {
	float: left;
	margin: 30px 0 0 0;
	width: 300px;
}

div.module-subfooter.padding {
	padding-left: 26px;
}

/*-------------------------------------------------------------------------------------------------------------------

	=Images
 		
--------------------------------------------------------------------------------------------------------------------*/

img.button {
	margin-right: 3px;
}

img.thumb {
	border: 1px solid #D7D4D0;
	float: right;
	margin: 0 0 10px 10px;
	padding: 4px;
}

img.quotemark {
	float: left;
}

.module-subfooter img {
	float: right;
	margin-left: 14px;
}

img.mouse {
	margin-bottom: 2.4em;
}

/*-------------------------------------------------------------------------------------------------------------------

	=Footer
 		
--------------------------------------------------------------------------------------------------------------------*/

div#footer {
	background: url('../images/site/bg_footer.jpg') repeat-x left top;
	clear: both;
	height: 76px;
	text-align: left;
	width: 100%;
}

div.footer-container {
	background: url('../images/site/bg_footer.jpg') no-repeat left top;
	height: 56px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
	padding-top: 20px;
	position:relative;
	width: 960px;
}

#footer p {
	color: #999;
	font: italic 1.1em Georgia, Cambria, serif;
	padding-bottom: 4px;
	
}

#footer p.siteby {
	float: right;
}

/*-------------------------------------------------------------------------------------------------------------------

	=Work Page
 		
--------------------------------------------------------------------------------------------------------------------*/
div#content {
	border-top: 1px solid #D9D4C6;
	padding-top: 34px;
	width: 960px;
}



div#submain-page {
	background: url('../images/site/bg_submain_page.jpg') repeat-x left top;
	clear: both;
	margin-top: 24px;
	width: 100%;
	text-align: left;
}

div.submain-container-page {
	background: url('../images/site/bg_submain_page.jpg') no-repeat left top;
	height: 124px;
	margin: 0 auto;
	overflow: hidden; 
	width: 960px;
}

div.request img {
	float: right;
	margin-top: 4px;
}

div.request {
	margin: 0 auto;
	margin-top: 30px;
	width: 540px;
}

.request p {
	color: #736D5C;
	font: italic 1.2em Georgia, Cambria, serif;
}

img.latestwork {
	float: right;
	margin: 34px 18px 0 0;
}

#content p {
	color: #666;
	font-size: 1.1em;
	line-height: 1.7em;
	margin-bottom: 1.8em;
}


div.figure.one {
	margin-right: 29px;
	overflow: hidden;
	position: relative;
}

div.figure {
	background: url('../images/site/bg_casestudy_thumb.png') no-repeat left top;
	float: left;
	margin-bottom: 8px;
	height: 360px;
	overflow: hidden;
	position: relative;
	padding: 12px 0 24px 12px;
	width: 288px;
}

.figure a img {
	position: relative; /* Image positioned relatively so the hover overlays the image*/
}

/*
.figure img a:hover {
	background: url('../images/site/icon_magnifying_glass2.png') no-repeat center center;
	position: absolute;
}

.figure a:hover:after {
	background-image: url('../images/site/icon_magnifying_glass.png');
	background-repeat: no-repeat;
	background-position: 69px;
	background-color: rgb(158, 89, 20);
	background-color: rgba(158, 89, 20, 0.8);
	color: #fff;
	content: attr(title);
	display: block;
	font-size: 1.1em;
	height: 20px;
	padding-top: 10px;
	padding-left: 18px;
	position: absolute;
	text-decoration: none;
	text-align: center;
	top: 84px;
	width: 256px;
}
*/
.figure a.workpic span.zoom-icon {
	left: 40%;
	position: absolute;
	top: 35%;
	visibility: hidden; 	
}

.figure a.workpic:hover span.zoom-icon {
	visibility: visible;
}

.figure a.workpic{
	display: block;
	position: relative;
  	text-decoration: none; 	
}


/*-------------------------------------------------------------------------------------------------------------------

	=Case Study Page
 		
--------------------------------------------------------------------------------------------------------------------*/

.services-list ul {
	margin-bottom: 24px;
	width: 294px;
	border: 1px solid red;
}

.services-list li {
	background: url('../images/site/bullet_tick.png') no-repeat left center;
	margin-bottom: 6px;
	padding-left: 18px;
}

div.page-container {
	clear: right;
	float: right;
	margin-top: 18px;
	width: 626px;
}

div.module-page {
	float: left;
	margin-right: 20px;
	width: 290px;
}

#content a {
	font-family: Georgia, Cambria, serif;
	font-style: italic;
	margin-bottom: 24px;
}

/*-------------------------------------------------------------------------------------------------------------------

	=Sidebar
 		
--------------------------------------------------------------------------------------------------------------------*/

div#sidebar {
	float: right;
	width: 300px;
}

div#blog-sidebar {
	width: 300px;
}

#sidebar ul {
	margin-bottom: 30px;
}

#sidebar li.twitter {
	background: url('../images/site/icon_twitter.png') no-repeat left center;
	padding-left: 24px;
}

#sidebar li.rss {
	background: url('../images/site/rss_button.jpg') no-repeat left center;
	padding-left: 39px;
	padding-top: 20px;
	height: 35px;
}
/*-------------------------------------------------------------------------------------------------------------------

	=Contact Form
 		
--------------------------------------------------------------------------------------------------------------------*/

#form {
	background-color: #F7F4EB;
	border: 1px solid #DAD5C7;
	margin: 0;
	margin-bottom: 34px;
	padding: 34px 34px 14px 34px;
	width: 552px;
}

img.formIcon {
	float: right;
	margin: 8px 0 0 0;
}

.required {
	color: #996633;
	font-weight: 400;
}

.asterisk {
	color: #CC3300;
}

#content p.formTitles {
	font-size: 1.2em;
	font-weight: bold;
	color: #666666;
	margin: 0;
	padding: 14px 0 8px 0;
}

input, textarea {
	color: #666666;
	background: #F2ECDE;
	border: 1px solid #D8CFBE;
	padding: 6px;
	margin: 0;
}

input#submit.emailButton {
	border: none;
	color: #FBFBFB;
	font-family: Georgia, Cambria, serif;
	font-size: 1.1em;
	margin-top: 20px;
	padding: 4px 4px 8px 4px;
	background: url('../images/site/button_send.png') no-repeat top left;
	width: 98px;
	height: 39px;
	cursor: pointer;
}

input:focus, textarea:focus{
	border: 1px solid #D8CFBE;
	background-color: #FFF;
}

input[type=text]:focus, input[type=password]:focus {
  outline: 0 none;
}

img.form-icon {
	float: right;
	margin-left: 24px;
}

/*-------------------------------------------------------------------------------------------------------------------

	=Team Page
 		
--------------------------------------------------------------------------------------------------------------------*/

#team-container {
	overflow: hidden;
	padding-top: 14px;
	width: 620px;
}

div.team-figure {
	float: left;
	margin-right: 20px;
	min-height: 240px;
	overflow: hidden;
	width: 300px;	
}

div.end {
	margin-right: 0;
}

#content p.jobtitle {
	color: #71A129;
	font: italic 1.2em Georgia, Cambria, serif;
	margin-bottom: 24px;
}
/*-------------------------------------------------------------------------------------------------------------------

	=Blog Page
 		
--------------------------------------------------------------------------------------------------------------------*/

div#submain_blog 
{
   	background: url('../images/site/bg_submain_repeat.jpg') repeat-x left top;
	width: 100%;
}

div.blog-content {
	border-top: 1px solid #D9D4C6;
	padding-top: 34px;
	width: 630px;
}

.blog-content p {
	color: #666;
	font-size: 1.5em;
	line-height: 1.7em;
	margin-bottom: 1.8em;
}

.blog-content-inner p {
	color: #666;
	font-size: 1.5em;
	line-height: 1.7em;
	margin-bottom: 1.8em;
}

.blog-summary p {
	color: #666;
	font-size: 1.5em;
	line-height: 1.7em;
	margin-bottom: 1.8em;
}

.blog-content-inner img {
    background-image: url('../images/site/blog_img.jpg') ;
    background-repeat:no-repeat;
    display: block;
    padding: 15px 15px 15px 15px;
}

.blog-summary img {
    background-image: url('../images/site/blog_img.jpg') ;
    background-repeat:no-repeat;
    display: block;
    padding: 15px 15px 15px 15px;
    margin:  0px 20px 5px 0;
    float: left;
}
