/*
Theme Name: loudgroup
Theme URI: http://www.loudgroup.com
Description: 2 column
Version: 1.0
Author: Kay James
*/


/* details
Grid: 
- 920px wide
- 80px col width
- 25px gutter 
Colour:
- F0007F mag
- 00A0C6 cyan
- FFFF00 yellow
- 333333 text black-grey
- 9D9D9D grey lines
- 7A7A7D grey links
- 9A9A8F 959597 grey large link text
- CCCCCC grey link boxes 
Typefaces-sizes
- 25px (menu)
- 55px

- 48px
- 13px

- 17px
- 12px
Type
Subtraction notes problems with helvetica rendering
so used Arial 12px and below, helvetica below
'Helvetica Neue', Helvetica, Arial,

*/

/*USEFUL BITS OF CSS TO APPLY TO ELEMENTS AS REQUIRED
.clear { clear: both; }
.clearl { clear: left; }
.clearr { clear: right; }
.hide  { display: none; }
.hiddennav {
	position: absolute;
	width:1px;
	left: -9999px;
}
*/


/*--BASE GLOBAL UNCHANGED--*/
* {
	 margin:0;
	 padding:0;
	}
html, body {
	 padding: 0;
	 margin: 0;
	}

/*--block elements--*/
h1, h2, h3, h4, h5, h6, p, blockquote, form, label, ul, ol, dl, fieldset, address {
 margin-bottom: 0.25em;
}
/*--other global--*/
ol, ul,li {
	 list-style: none;
	}
img {
	 border:0;
	}
a img,:link img,:visited img { 
	 border: 0; 
	}	/*-- remove borders on img links --*/
:link,:visited { 
	 text-decoration:none; 
	} /*--remove underlines on links --*/





/*--AMEND BASIC STYLES--*/	
body {
	background-color:#FFFFFF;
	color:#333333;
}
/*--global type--*/
body, h1, h2, h3, h4, h5, h6, ol, ul, li, p, input, textarea, select {
	font-family: helvetica, arial, sans-serif;
	color: #333333;
	}
 /*#container,  #wrapper, #sidebar {background-color:#FFFFFF;}*/





/*-- STRUCTURE --*/
/*--centre content and then fix align to left--*/
body {
 	text-align: center;
	}
#wrapper {
 width: 890px;
 margin: 0 auto;
}	
#container {
 	width: 840px;
 	margin: 0 auto;
	text-align: left;
 	}


/*--MAIN FLOATS--*/

#header {
	height: 188px;
	text-align:left;
	/* image as background - background: url(../images/latestimage.jpg) no-repeat left top; */
	}
	
#latestImage {
	width: 535px;
	height: 188px;
	background: url(images/brochurescom2.jpg) no-repeat left top;
	float: left;
	}	/* image as iimage */
/*#logo {
	height:93px; 
	margin-left: 16px;
	}*/
#mainnav {
 	width: 840px;
 	margin: 0 auto;
	text-align: left;
	}
#contentwrap {
 	width: 840px;
 	margin: 0 auto;
	text-align: left;
	}
	
#maincontent {
	 width: 500px;
	 float: left;
	 margin-bottom: 25px; /*25*/	
	}
	body.contact #maincontent {
 margin-bottom: 0px;	}
#sidebar {
	width: 315px;
	float: right;
	margin-bottom: 25px;
	}

#footer, #base {
 	clear: both;
	} /* force divs below the divs above */


/*--INNER FLOATS--*/

/*-- MAIN STYLES --*/
#pagesummary {
		padding: 18px 0px 0px 0px;/*23*/
		margin: 0px 0px 21px 0px;/*20*/
		border-top: 1px solid #9D9D9D;
		}
#contentwrap {
		padding: 23px 0px 0px 0px;
		margin: 0px 0px 0px 0px; /*0 0 25 0*/
		border-top: 1px solid #9D9D9D;
		}
#maincontent, #sidebar, #maincontentportfolio {
		padding: 0px 0px 23px 0px;
		margin: 0px 0px 50px 0px;
		/*border-bottom: 1px solid #9D9D9D;*/
		}
		
		
#sidebar {
		border-bottom: 1px solid #9D9D9D;
		}
#maincontent, #maincontentportfolio {
		padding: 0px 0px 5px 0px;
		}	
#sidebar {
		padding: 0px 0px 5px 0px;
		}	
.module {
	margin-bottom: 23px; /* with h1 = 25px*/
	}
	
.divider {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 25px 0px;
		border-bottom: 1px solid #9D9D9D;
		height: 15px;
		}
.dividermiddle {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 35px 0px;
		border-bottom: 1px solid #9D9D9D;
		height: 15px;
		}	
#maincontentportfolio .divider {
		padding: 0px 0px 0px 0px;
		margin: 0px 15px 25px 0px;
		border-bottom: 1px solid #9D9D9D;
		height: 15px;
		}		
		
		
#leftside {width: 225px; float: left;}
#rightside {width:225px; float: right;}		

#floatwrap {
 clear: both;
}
	
	
/*-- IMAGES --*/
img.nowrap {
	display: block;
	margin: 8px 0px 11px 0px;
	padding-bottom: 0px;
	border-bottom: 1px solid #9D9D9D;
	width: 100%;
	}	
#latestImage img {
	height: 188px;
	}	
	
.post img {
	margin-bottom:16px;
}	
#sidebar img {
	margin-bottom:20px;
}	
	
	/*--LOGO--*/
	#logo {
	width: 340px;
	margin: 0;
	padding:0;
	float: right;
}
#logo a {
	text-indent: -999em;
	height: 188px;
	display: block;
	background: url(imgs/LoudLogo.gif) no-repeat left bottom;
	padding:0;
	margin:0;
}
			

/*--TYPOGRAPHY--*/
#pagesummary {
	font-size: 55px;
	line-height: 63px;/*55*/
	letter-spacing: -0.025em;
	color: #F0007F;
	}
	
h1	{
	font-family: helvetica, arial, sans-serif;
	font-size: 48px;
	line-height: 50px;
	font-weight: normal;
	letter-spacing: -0.025em;
	color: #7A7A7D; /*#F0007F*/
	margin-bottom: 7px;
	}
	
h2	{
	font-family: helvetica, arial, sans-serif;
	font-size: 18px; /*24*/
	line-height: 20px; /*25*/
	font-weight: normal;
	letter-spacing: -0.012em;
	color: #7A7A7D; /* #F0007F */
	margin-bottom: 4px; /*7*/
	margin-top: 6px;
	}	
h3 {
	font-weight: bold;
	font-size: 14px;
	line-height: 20px;
	margin-bottom: 3px;
	color: #7A7A7D;
	margin-top: 2px;
	}	
/*#pagesummary h1 {
	font-size: 55px;
	line-height: 63px;
	letter-spacing: -0.025em;
	color: #FFFFFF;
	background-color: #F0007F;
	padding: 10px;
	}*/
	
#pagesummary h1 {
	font-size: 55px;
	line-height: 63px;/*55*/
	letter-spacing: -0.025em;
margin-bottom: 10px; /*20*/
color: #F0007F;
	}		
	
/*.ro {
	color: #FFFFFF;
	background-color: #F0007F;
	padding: 10px;
	}*/	
	
.ro {
	color: #FFFFFF;
	background: url(imgs/bgd.gif) repeat left top;
	padding: 0px 10px 1px 0px;
	}	
		
#pagesummary ul {
display: inline;
	}	
#pagesummary li {
	font-size: 55px;
	line-height: 63px;/*55*/
	letter-spacing: -0.025em;
	color: #F0007F;
	display: inline;
	/*padding-right: 40px;
	margin-right: 0px;
	background: #FFFFFF url(../imgs/dash-g.gif) no-repeat right top;	 
	*/}
	
.slash {
	color: #DDDDDD;
	}
#pagesummary li.end {
	background: none;	 
	}	
	
#sidebar h1	{
	font-family: helvetica, arial, sans-serif;
	font-size: 17px;
	line-height: 1em;
	font-weight: bold;
	letter-spacing: 0em;
	color: #F0007F;
	margin-bottom: 2px;/*0*/
	}
/*h2,h3,h4,h5,h6*/
p.intro,
.post { 
	margin-bottom:23px;/*28.5*/
	}
p, ul, li 	{
	font-family: helvetica, arial, sans-serif;
	font-size: 13px;
	line-height: 20px; /*19*/
	font-weight: normal;
	margin-bottom: 10px;	
	}	
	
	
#maincontentportfolio p {
	margin-right: 25px;
	} /* fix for portfolio section */
	
		
	.post ul {
	margin: 0px;
	padding: 0px;
}
	.post li{
	background-image: url(images/bulletsquare.gif);
	background-repeat: no-repeat;
	background-position: left 3px;
	padding-left: 16px;
}
#sidebar ul {
	}
#sidebar li {
	font-family: arial, helvetica, sans-serif;
	font-size: 12px;
	line-height: 15px;
	margin-bottom: 0px;
	}
#sidebar p {
	font-family: arial, helvetica, sans-serif;
	font-size: 12px;
	line-height: 15px;
	margin-bottom: 0px;/*4*/
	}
	
.module ul#navigation li {
	display: inline;
}	
	

	
	
	
	
/*--Links--*/	

a:link,
a:visited {
 	text-decoration:none;
 	color:#7A7A7D;
 	border:0;
	}
a:hover,
a:active,
a:focus {
 	text-decoration:underline;
	color:#F0007F;
	border:0;
	background:none;
	}
	
#maincontent p a:link,
#maincontent p a:visited,
#maincontent ul a:link,
#maincontent ul a:visited,
.internalnav  a:link,
.internalnav a:visited,
#maincontentportfolio .post p a:link,
#maincontentportfolio .post p a:visited{
 	text-decoration:none;
 	color:#333333;
 	border:0;
	background: #CCCCCC;
	font-weight: bold;
	}
#maincontent p a:hover,
#maincontent p a:active,
#maincontent p a:focus,
#maincontent ul a:hover,
#maincontent ul a:active,
#maincontent ul a:focus,
.internalnav  a:hover,
.internalnav  a:active,
.internalnav  a:focus,
#maincontentportfolio .post p a:hover,
#maincontentportfolio .post p a:active,
#maincontentportfolio .post p a:focus {
 	text-decoration:underline;
	color:#333333;
	border:0;
	background:none;
	font-weight: bold;
	}			

	
	
	
	

	
	
	
	
	
	
/*--NAVIGATION with images--*/	


/*use nav as part of list*/	
#mainnav {
font-family: helvetica, arial, sans-serif;
	font-size: 25px;
	line-height: 1.0em;
	font-weight: normal;
	/*background:transparent url(../imgs/mainNav.gif) no-repeat left top;*/	
	height: 34px;	
	}
	
ul#topnav {
	position:relative;
	top:0px;
	left:0px;
	width:500px;
	float:left;
	height:33px;
	margin: 0;
	
	
	}
ul#topnav li {
	padding:0 0px 0px 0px;
	margin:0;
	display:block;
	float:left;
	
	text-indent:-9999px;
	}
ul#topnav li#ncontact {
	background:none;
	text-indent:-9999px;	
	}	
ul#topnav li a {
	border:0;
	display:block;
	text-decoration:none;
	overflow:hidden;
	background:transparent url(imgs/mainNav.gif) no-repeat;
	
	}
li#nabout a {
	width:90px;
	height:33px;
	 }
 	
li#nabout a:link, 
li#nabout a:visited {	
	background-position: 0px 0px;
	} 	 
li#nabout a:hover, 
li#nabout a:focus
li#nabout a.current {	
	background-position:0px -67px;
	}
 
li#nwork a {
	width:82px;
	height:33px;
	 }
	  
li#nwork a:link, 
li#nwork a:visited {	
	background-position: -90px 0px;
	} 	 
li#nwork a:hover, 
li#nwork a:focus {	
	background-position:-90px -67px; 
	} 
	

li#nclients a {
	width:101px;
	height:33px;
	 }

li#nclients a:link, 
li#nclients a:visited {	
	background-position: -172px 0px; 
	} 	 
li#nclients a:hover, 
li#nclients a:focus{	
	background-position:-172px -67px;
	} 
	
li#ncontact a {
	width:90px;/*104*/
	height:33px;
	 }
		
li#ncontact a:link, 
li#ncontact a:visited {	
	background-position: -276px 0px; 
	} 	 
li#ncontact a:hover, 
li#ncontact a:focus {	
	background-position: -276px -67px;
	} 


 	
	#footer #copyright {
		border-top: 1px solid #9D9D9D;}
	
	#copyright {
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 50px 0px;
		color: #999999;
		font-family: arial, helvetica, sans-serif;
	font-size: 10px;
	line-height: 15px;
	/*border-top: 1px solid #CCCCCC;*/
		}
	
	
	
	
	
	
	
	
	
/*--BACKGROUND CHECKS--*/
/*
body {background-color:#FFCC99;}
#wrapper {background-color:#FFFFFF;}
#container {background-color:#00FF00;}
#contentwrap {background-color:#00FFFF;}
#maincontent {background-color:#99FF00;}
#sidebar {background-color:#993333;}
ul#topnav {background-color:#99FF00;}
#logo {background-color:#FFFFFF;}
#header {background-color:#CC00FF;}
#maincontent {
	background-image: url(../imgs/baselineGrid.gif);
	background-repeat: repeat;
	background-position: left 13px;
	filter: Alpha(Opacity=50%);
}


#container {
	
	background-image: url(../imgs/divisions.png);
	background-repeat: repeat-y;
	background-position: left top;
	filter: Alpha(Opacity=50%);
}
#sidebar {
	background-image: url(../imgs/baselineGrid.gif);
	background-repeat: repeat;
	background-position: left 13px;
	filter: Alpha(Opacity=50%);
}
*/

#nav-internal {
	float: right;
	margin-bottom: 0px;
	}


/*--styles to remove default bullet style--*/
	#portfoliomain li{
	background: none;
	padding-left: 20px;
}


/*-- styles for portfolio--*/
#portfoliomain img {
	margin: 0px 12px 12px 0px;
	padding: 0px;
	height: 132px;
	width: 158px;
}


#portfoliomain li {
	display: inline;
	margin: 0px;
	padding: 0px;
}

#portfoliomain ul {
	margin: 18px 0px 12px 0px;
}


#portfoliomain ul li a,
#portfoliomain ul li  a:link,
#portfoliomain ul li  a:visited {
 	text-decoration:none;
 	color:#333333;
 	border:0;
	background: none;
	font-weight: bold;
	}
#portfoliomain ul li :hover,
#portfoliomain ul li :active,
#portfoliomain ul li :focus {
 	text-decoration:underline;
	color:#333333;
	border:0;
	background:none;
	font-weight: bold;
	}	
#maincontentportfolio {
	 width: 520px;
	 float: left;
	 margin-bottom: 25px; /*25*/	
	}	
	
	
	
	
	
.internalnav a {margin-right: 12px;}	



/*--POSTS CLIENT AREA--*/			
a.posts-l,
a.posts-l:link,
a.posts-l:visited {
 	text-decoration:none;
 	color:#7A7A7D;
 	border:0;
	font-size: 24px;
	letter-spacing: -0.014em;
	}
a.posts-l:hover,
a.posts-l:active,
a.posts-l:focus {
 	text-decoration:underline;
	color:#F0007F;
	border:0;
	background:none;
	}	
	
.posts-l .divider {
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 25px 0px;
	border-bottom: 1px solid #9D9D9D;
	height: 5px;
	}