/* -------------------------------------------------------------------------
Storm Publishing - screen styles

last update: 11 November 2008
author: Matt Williams MA & Andy Gosling
email: info@thinkstorm.co.uk
------------------------------------------------------------------------- */


/* colours

storm yellow = #EF5293;
storm publishing magenta = #EF5293;

------------------------------------------------------------------------- */

/* layout
------------------------------------------------------------------------- */

body {
	/*background:url("../images/baseline18px.gif") 0 -4px;*/
	font-size: 100%;
	font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", Arial, sans-serif;
	color: #383838;

}

#wrapper {

	width: 980px;
	margin: 0;
	/*background:url("../images/column_guide.gif") 0 0;*/
	text-align: left;
}

#wrapper:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

#content {
	width: 980px;
	
}

.project #content {
	padding-top: 20px;
}

#footer,
#work .workIntro #footer,
#work .project #footer {
	width: 980px;
	margin: 0 auto;
	clear: both;
	
}

#work #footer {
	margin: 1.6363em 0 0 0;
}

#footer:after {
    	content: "."; 
    	display: block; 
    	height: 0; 
    	clear: both; 
    	visibility: hidden;
}

#standardleftcolumn{
float: left;
width: 200px;

}

/* typography
------------------------------------------------------------------------- */

p {
	font-size: 1em;
	line-height: 1.4em;
	margin: 0 0 1.6363em 0;
}



h1 {
	font-size: 1.4545em; /* 16px */
	line-height: 1.125em;
	margin: 0 0 1.125em 0;
	font-weight: normal;
	color: #333;
}

h2 {
	font-size: 1.1818em; /* 13px */
	line-height: 1.3846em;
	margin: 0 0 1.3846em 0;
	font-weight: normal;
	color: #333;
}

h3 {
	font-size: 1em;
	line-height: 1.6363em;
	margin: 0 0 0 0;
	color: #333;
}

h5{
margin-top: 17px;
font-size: 0.875em;
color: #ef4f91;
margin-bottom: 2px;
font-weight: bold;

}

#contact #maincolumn p.company{
margin-top: 10px;
font-size: 0.6875em;
color: #8a8a8a;
font-weight: bold;
}
#contact #maincolumn p.company2{
margin-top: 40px;
font-size: 0.6875em;
color: #8a8a8a;
font-weight: bold;
}
#contact #maincolumn p.jobtitle{
font-size: 0.625em;
color: #333;
}
#contact #maincolumn p.email{
margin: 8px 0 14px;
font-size: 0.6875em;
color: #333;
}
#contact #maincolumn p.phone, #contact #maincolumn p.mobile{
font-size: 0.6875em;
color: #000;
}

h3.newSubHead{
font-size:0.6785em;
color: #000;
font-weight: bold;
}
#home h3.newSubHead{
margin-top: 20px;
font-size:0.6785em;
color: #000;
font-weight: bold;
}
h3.newSubHeadPink{
font-size:0.6785em;
color: #ef4f91;
font-weight: bold;
}

h4{
margin:14px 0 12px;
font-size: 1em;
}
li {
	font-size: 1em;
	line-height: 1.6363em;
}

#content ul li {
	margin-bottom: 0.8181em;
	padding-left: 12px;
	background: url("../images/bullet2.gif") no-repeat 0 0.6em;
}

strong {
	font-weight: normal;
	color: #111;
}

.rule {
	float: right;
	clear: right;
	background: url("../images/h_rule.gif") no-repeat -120px 0;
	height: 1.6363em;
	margin: 0 0 1.6363em 0;
	width: 100%;
}

/* hyperlinks */
/*
p a:link, p a:visited,
li a:link, li a:visited,
h2 a:link, h2 a:visited,
h3 a:link, h3 a:visited {
	background-color: transparent;
	padding: 1px 2px 1px 2px;
	text-decoration: none;
	color: #000;
	background-color: #EF5293;
}

p a:hover, p a:active,
li a:hover, li a:active,
h2 a:hover, h2 a:active,
h3 a:hover, h3 a:active {
	background-color: #333;
	color: #FFF;
} */


a.textlink:link, a.textlink:visited{
font-size: 0.875em;
text-decoration: none;
color: #000;
padding-bottom: 2px;
border-bottom: 1px solid #bc1378;
}
a.textlink:hover{
color: #a0a0a0;
}






/* header
------------------------------------------------------------------------- */

#header {
clear: both;
	position: relative;
	height: 89px;
margin-bottom:3em;
	background: url("../images/h_rule.gif") no-repeat 200px 88px;
}

#home #header {
	margin-bottom: 3em;
}

#header #logo {
	position: absolute;
	top: 0;
	left: 0;
}

#header #tagline {
clear: both;
color: #5f5f5f;
	margin-top: 40px;
	float: right;
	width: 250px;
	text-align: right;
	font-size: 0.875em;
}
#header #tagline em{
font-style: normal;
color: #bc1378;
}

#wrapper #time{
height: 56px;
float: right;
}

#work #maincolumn h4{
margin-top: 0;
}
#work #maincolumn p{
padding-right: 20px;
}
#work #workSummaries #last{
margin-right:0;
}
#contact #maincolumn p{
margin:0;
margin-bottom: 4px;
padding:0;
font-size: 0.875em;
color: #383838;
line-height: 1em;
}
/* primary navigation
------------------------------------------------------------------------- */

#primaryNav {
	float: left;
	margin: 0;
	font-size: 0.625em;
	width: 163px;
}

#primaryNav li {

	line-height: 1em;
	/* padding-top: 5px;
	padding-bottom: 5px; */
	border-bottom: 1px solid #d4d2d1;
}

#primaryNav li a:link, #primaryNav li a:visited {
width: 86px;
padding: 7px 0 7px 77px;
height: 100%;
	background-color: transparent;
	text-decoration: none;
	color: #666;
	border: none;
}

#primaryNav li a:hover, #primaryNav li a:active {
height: 100%;
	background-color: #EF5293;
	color: #111;
}

/* active menu items */

#wrapper #primaryNav li .current {
	background-color: #EF5293;
	color: #111;
}

#primaryNav li#lastlist{
border-bottom: none;
}

/* -------------------------------------------------- */
#projectNav {
	float: left;
	margin: 0;
	padding-top: 20px;
	border-top:#000 solid 3px;
	margin-top:20px;
	font-size: 0.625em;
	width: 163px;
}

#projectNav li {

	line-height: 1em;
	/* padding-top: 5px;
	padding-bottom: 5px; */
	border-bottom: 1px solid #d4d2d1;
}

#projectNav li a:link, #projectNav li a:visited {
width: 86px;
padding: 7px 0 7px 77px;
height: 100%;
	background-color: transparent;
	text-decoration: none;
	color: #666;
	border: none;
}

#projectNav li a:hover, #projectNav li a:active {
height: 100%;
	background-color: #EF5293;
	color: #111;
}

/* active menu items */

#wrapper #projectNav li .current {
	background-color: #EF5293;
	color: #111;
}

#projectNav li:last-child{
border-bottom: none;
}
/* ----------------------------------------------------*/

li {
float:left;
margin:0;
padding:0;
}
li a {
display:block;
height:100%;
color:#FFF;
text-decoration:none;
}
li a {
background:url(http://www.stormpublishing.co.uk/assets/images/bg2.gif) repeat 0 0;
}
li a:hover, li a:focus, li a:active {
background-position:-200px 0;
}
#primaryNav a {
background:url(http://www.stormpublishing.co.uk/assets/images/bg2.gif) repeat 0 0;
}
#projectNav a {
background:url(http://www.stormpublishing.co.uk/assets/images/bg3.gif) repeat 0 0;
}

ul#categorylist{
background-image: none;
background: #FFF;
color: #818181;
margin-top: 12px;
font-size: 0.625em;

}

ul#categorylist li{
background-color: transparent !important;
background-image: none;
color: #818181;
line-height: 1em;
padding: 2px 0;
margin:2px 0;
float: none;
margin-top: 1px;
}

ul#categorylist li a:link, ul#categorylist li a:visited{
display: inline;
background-color: transparent !important;
background-image: none;
color: #818181;
border-bottom: 1px solid #ededed;

}

ul#categorylist li a:hover{
color: #000;
}
/* secondary navigation
------------------------------------------------------------------------- */

#secondaryNav {
	float: left;
	text-align: right;
	display:block;
	width: 94px;
}

#secondaryNav li a:link, #secondaryNav li a:visited {
	padding: 2px 4px;
	text-decoration: none;
	color: #666;
	border: none;
}

#secondaryNav li a:hover, #secondaryNav li a:active {
	background-color: #EF5293;
	color: #111;
}

/* current items */

body.cat1 #secondaryNav li a.category1,
body.cat2 #secondaryNav li a.category2,
body.cat3 #secondaryNav li a.category3,
body.cat4 #secondaryNav li a.category4,
body.cat5 #secondaryNav li a.category5,
body.cat6 #secondaryNav li a.category6,
body.cat7 #secondaryNav li a.category7,
body.cat8 #secondaryNav li a.category8,
body.cat9 #secondaryNav li a.category9,
body.cat10 #secondaryNav li a.category10,
body.cat11 #secondaryNav li a.category11,
body.cat14 #secondaryNav li a.category14,
body.cat15 #secondaryNav li a.category15 {
	background-color: #EF5293;
	color: #000;
}

/* banner
------------------------------------------------------------------------- */

#maincolumn {
	float: right;
	width: 780px;
	padding-bottom: 45px;
}

#maincolumn p {
font-size:0.6875em;
padding-right: 100px;
}

#maincolumnleft{
width: 514px;
margin-right: 16px;
float: left;
}
#maincolumnright{
padding-top:52px;
width: 250px;
float: left;
}

#project #maincolumnright{
padding-top:32px;
}

.serviceoutline li{
float: none;
}

#innerleft{
float:left;
width: 514px;
margin-right: 16px;
}
#innerright{
float: left;
width: 227px;
margin-left:23px;

}

#innerright a:link, #innerright a:visited{
color:#383838;
text-decoration: none;
padding-bottom: 1px;
border-bottom: 1px solid #bd1479;
}
#innerright a:hover{
color: #000;
}


#map{
width: 510px;
height: 386px;
border: 2px solid #bd1479;
}

/* breadcrumb
------------------------------------------------------------------------- */

#breadcrumb {
	clear: both;
	width: 780px;
	color: #AAA;
	font-size: 0.909em;
	line-height: 1.8em;
	margin: 0 0 1.8em 120px;
}

#breadcrumb a:link, #breadcrumb a:visited {
	background-color: #FFF;
	padding: 1px 1px 0 1px;
	text-decoration: none;
	color: #AAA;
	border-bottom: 1px solid #EF5293;
}

#breadcrumb a:hover, #breadcrumb a:active {
	background-color: #EF5293;
	color: #111;
	border-bottom: 1px solid #EF5293;
}

/* homepage layout
------------------------------------------------------------------------- */

#home #intro {
	font-size: 1.4545em; /* 16px */
	line-height: 1.6363em;
	margin: 0 0 1.125em 0;
}

#home #primaryContent {
	float: left;
	background: #666;
	width: 635px;
	margin: 0 280px 1.6363em 0;
}

#home #secondaryContent {
	float: right;
	width: 980px;
	background: url("../images/h_rule.gif") no-repeat right top;
margin-top:10px;
	padding-top: 50px;
}

#home #primaryContent p {
	padding-left: 120px;
}


#home #workSummaries {
float: right;
	margin-left: 120px;
}
#workSummaries {
float: left;

}

#home .summary {
	float: left;
	width: 250px;
	margin: 0 15px 1.6363em 0;
	background: none;
}
#home .summary:last-child{
margin-right: 0px;
}

#home .rule {
	background-position: 0 0;
	margin-top: 1.6363em;
}

#home #last {
	margin-right: 0;
}

#twocolumncontent{
margin-top:10px;
padding-top:50px;
clear: both;
min-height: 300px;
background: url("../images/h_rule.gif") no-repeat right top;
}
#twocolumncontent img{
margin-top: 20px;
border: 2px solid #bc1378;
}
#twocolumncontent #leftCol{
min-height: 1px;
display: block;
float: left;
width: 200px;
}
#twocolumncontent #midCol{
float: left;
width: 514px;
margin-right: 16px;
}
#twocolumncontent p{
font-size: 0.6875em;
line-height: 1.4em;
margin-right: 100px;
color: #5b5b5b;
}
#twocolumncontent p.intropara{
font-size: 0.8125em;
line-height: 1.4em;
margin-right: 100px;
}
#twocolumncontent h3.newSubHead{
margin-bottom: 15px;
}
#twocolumncontent #rightCol{
float: left;
width: 250px;
}


/* work section layout
------------------------------------------------------------------------- */

/* work intro page */

#work .workIntro #primaryContent {
	float: right;
	width: 795px;
	margin: 0 0 1.6363em 0;
}

/* project page */

#work #primaryContentImage {
	float: left;
	width: 515px;
	margin: 0 0 1.6363em 0;
}

#work #primaryContentImage img {
	margin: 0 0 1.6363em 0;
}

#work #primaryContentText {
	position: relative;
	float: left;
	width: 235px;
	margin: 0 0 1.6363em 30px;
}

#work p.related {
	background: url("../images/dot_rule.gif") no-repeat 0 0;
	margin: 0;
	padding-top: 1.6363em;
}

#work #secondaryContent {
	float: left;
	width: 515px;
	margin: 0 0 1.6363em 0;
}

#work #secondaryContent h2 {
	font-size: 1.6363em; /* 18px */
	line-height: 1em;
	margin: 0 0 1em 0;
}

#work #secondaryContent p {
	width: 250px;
}

#work #secondaryContent p.intro {
	font-size: 1.1818em; /* 13px */
	line-height: 1.3846em;
	margin: 0 0 1.3846em 0;
	width: 515px;
}

#work #tertiaryContent {
	float: left;
	width: 265px;
	margin-left: 15px;
}

#work #tertiaryContent h2 {
	margin: 0 0 1.3846em 0;
}


#work #maincolumn .projectpost{
display: relative;
padding-bottom: 40px;
margin-bottom:30px;
border-bottom: 1px solid #d4d2d1;
}

#work #maincolumn .projectpost .leftside{
min-height: 1px;
float: left;
width: 250px;
margin-right: 16px;
}
#work #maincolumn .projectpost .leftside img{
width: 250px;

}
#work #maincolumn .projectpost .rightside{
width: 514px;
float: left;
}
#work #maincolumn .projectpost .rightside p{
padding-right: 70px;
}
#work #maincolumn .projectpost .rightside h3{
margin-bottom: 12px;
}


#project #maincolumn #gallery{
position: relative;
margin-bottom: 40px;
}


#project #maincolumn #gallery img{

padding: 0;
margin: 0;
}


.navposts{
margin-top: 20px;
border-top: 3px solid #000;
padding-top: 18px;
font-size: 0.6875em;
height: 24px;
float: right;
width: 250px;
}
.navposts #prevproj{
margin-right:14px;
float: left;
height: 24px;
padding-left: 26px;
padding-top: 5px;
background: url("http://www.stormpublishing.co.uk/assets/images/previousbtn.gif") no-repeat left top;
}

.navposts #nextproj{
padding-top: 5px;
float: left;
height: 24px;
padding-right: 26px;
background: url("http://www.stormpublishing.co.uk/assets/images/nextbtn.gif") no-repeat right top;
}

#maincolumn .projectpost .rightside a.textlink {
font-size:0.625em;
}
#maincolumn .projectpost .rightside a.textlink:link, #maincolumn .projectpost .rightside a.textlink:visited {
border-bottom:1px solid #BC1378;
display: inline-block;
vertical-align: bottom; 
color:#000000;
padding-bottom:2px;
text-decoration:none;
}
#maincolumn .projectpost .rightside a.textlink:hover{
color:#666;
}

#top{
font-size: 0.625em;
background:url("http://www.stormpublishing.co.uk/assets/images/topbut.jpg") no-repeat left top;
float: right;
width: 102px;
height: 32px;
text-align: center;
padding-top: 10px;
}

#top a:link, #top a:visited{

text-decoration: none;
color: #FFF;
}
#top a:hover{
color: #ef4f91;
}


/* summary panels */

.summary {
	float: left;
	width: 250px;
	margin: 0 15px 1.6363em 0;
	background: url("../images/dot_rule.gif") no-repeat left bottom;
	height: 1%;
}

.summary img {
	margin: 0;
	padding: 0;
}

.summary a:link img,
.summary a:visited img {
	border: 2px solid #ef4f91 !important;
}

.summary a:hover img,
.summary a:active img  {
	border: 2px solid #555 !important;
}

.summary p {
padding-right: 15px;
	margin: 5px 0 1.6363em 0;
	height: 1%;
}

.summary p span {
	color: #AAA;
}

#wrapper .summary p.project {
	margin-bottom: 0;
}

.workIntro .summary p a:link, .workIntro .summary p a:visited ef4f91

.workIntro .summary p a:hover, .workIntro .summary p a:active  {
	background-color: #EF5293;
	color: #000;
}

#home .summary {
	margin-right: 15px;
}

#home .summary img {
	margin: 0 0 15px 0;
}

#home .summary p {
	margin-bottom: 8px;
	font-size: 0.6875em;
}
#home #workSummaries .summary p {
	margin-bottom: 18px;
	font-size: 0.6875em;
}




/*
#home .summary h4 a:link, #home .summary h4 a:visited{
text-decoration: none;
padding-left: 0;
margin-left: 0;
font-weight: bold;
font-size:1em;
	background: #FFF;
	color: #ef4f91;

}
#home .summary h4 a:hover{
	color: #000;
}
*/
h4 a:link, h4 a:visited{
text-decoration: none;
padding-left: 0;
margin-left: 0;
font-weight: bold;
font-size:1em;
	background: #FFF;
	color: #ef4f91;

}
h4 a:hover{
	color: #000;
}
#work_concepts h4, #services h4{
font-weight: bold;
font-size:1em;
	background: #FFF;
	color: #ef4f91;
}
#work_concepts #maincolumn p{
padding-right:0;
}

#services #maincolumn p{
padding-right:210px;
}
.serviceoutline h4{
margin-top: 0;
}

.serviceoutline li{
padding-bottom: 15px;
}

.conceptinfo{
width: 780px;
display: relative;
padding-bottom: 20px;
margin-bottom: 30px;
border-bottom: 1px solid #d4d2d1;
}


.conceptleft{
margin-top: 15px;
width: 514px;
margin-right: 16px;
float: left;
}

.conceptright{

width: 250px;
float: left;
}






#work .intro .summary {
	margin-right: 15px;
}

#work .section .summary {
	float: left;
	width: 250px;
	margin: 0 15px 0 0;
}

/* approach section layout
------------------------------------------------------------------------- */

#approach #primaryContent {
	float: left;
	width: 480px;
	margin: 0 0 1.6363em 0;
}

#approach #primaryContent h1 {
	font-size: 1.6363em; /* 18px */
	line-height: 1em;
	margin: 0 0 1em 0;
}

#approach #primaryContent h2 {
	margin: 2.7692em 0 1.3846em 0;
}

#approach #primaryContent p.intro {
	font-size: 1.1818em; /* 13px */
	line-height: 1.3846em;
	margin: 0 0 1.3846em 0;
	color: #333;
}

#approach #secondaryContent {
	clear: right;
	float: right;
	width: 250px;
	margin: 0 15px 1.3846em 0;
}

#approach #secondaryContent h2 {
	margin: 0 0 1.3846em 0;
}

/* contact section layout
------------------------------------------------------------------------- */

#contact #primaryContent {
	float: left;
	width: 530px;
	margin: 0 0 1.6363em 120px;
}

#contact #primaryContent p.intro {
	font-size: 1.1818em; /* 13px */
	line-height: 1.3846em;
	margin: 0 0 2.7692em 0;
	color: #333;
	width: 505px;
}

#contact #primaryContent .column {
	float: left;
	width: 250px;
	margin-right: 15px;
}

#contact #primaryContent img {
	margin-bottom: 1.6363em;
}

#contact #primaryContent .column h2,
#contact #primaryContent .column p {
	margin-bottom: 0;
}

#contact #primaryContent .column h3 {
	margin-bottom: 1.6363em;
	color: #666;
}

#contact #secondaryContent {
	float: left;
	width: 250px;
	margin: 0 0 1.6363em 0;
}

/* footer
------------------------------------------------------------------------- */


#footer {
background:url("../images/footer.gif") no-repeat;
padding-top: 58px;
font-size: 0.625em;
}

#footer em{
font-style: normal;
font-weight: bold;
}

#footer .leftcolumn {
clear : both;
float: left;
width: 200px;
height: 50px;
}
#footer .rightcolumn{
padding-top:14px;
}
#footer .rightcolumn a:link, #footer .rightcolumn a:visited{
text-decoration: none;
color: #000;
padding-bottom: 2px;
border-bottom: 1px solid #bc1378;
}
#footer .rightcolumn a:hover{
color: #a0a0a0;
}
#footer img{
float: right;
}

#footer p {
	margin-bottom: 0;
	color: #AAA;
}

#footer p.alignRight {
	text-align: right;
}

#footer p strong {
	font-weight: normal;
	color: #666;
}

.clear{
clear: both;
}


.image_pad {

	margin: 10px 0px 0px 200px;
}