@charset "utf-8";
/* CSS Document */
/* Oh Happy Days of CSS Styling the Web :) */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: 100%;
font-family: inherit;
vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: black;
background: white;
}
ol, ul {
list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}

html {
height:100%; 
}

body {
font: 0.7em Arial, Helvetica, sans-serif;
color:#fff;
height:100%;
}

#bg_purple {
background:url(/img/bg.jpg) top center no-repeat #312146;
min-height:100%;
}

#pinboard_wrapper {

}

#pinboard_tile {
background:url(/img/pb_main.jpg) repeat-y top center; 
}

#pinboard_content {
background:url(/img/pb_main.jpg) no-repeat top center;
}

#maincontentholder {
width:980px;
margin: 0 auto;
}

#pinboard_footer {
clear:both;
background:url(/img/pb_footer.jpg) no-repeat top center;
padding-top: 35px;
height:41px;
color:#202021;
}

#pinboard_footer a {
color:#202021;
text-decoration:none;
border:none;
}

#pinboard_footer a:hover {
color:#202021;
text-decoration:none;
border-bottom:1px dotted #202021;
}

#copyright {
text-align:center;
font-size:.9em;
font-weight:bold;
padding-bottom:3px;
}

#navlinks {
text-align:center;
font-size:.9em;
font-weight:bold;
}

.frontext {
color:#131313;
font-size:1.0em;
}

.frontext a {
color:#131313;
text-decoration:none;
font-weight:bold;
}

.frontext a:hover {
color:#131313;
text-decoration:none;
font-weight:bold;
border-bottom:1px dotted #131313;
} 

.frontext a:visited {
text-decoration:none;
font-weight:bold;
} 

h1 {
	float:left;	
	display:inline-block;
	width:312px;
	height:160px;
	overflow:hidden;
}

h1 a {
	display:block;
	float:left;
	width:312px;
	height:160px;
	cursor:pointer;
}

h1 a span{
	display:block;
	width:312px;
	height:160px;
}

hr {
border-bottom:1px dotted #202021;
margin: 10px;
}


#envweb {
background:url(/img/env_web.png) no-repeat;
}

#envprint {
background:url(/img/env_print.png) no-repeat;
}

#envbrochure {
background:url(/img/env_brochure.png) no-repeat;
}

#envmisc {
background:url(/img/env_misc.png) no-repeat;
}

#envsignage {
background:url(/img/env_signage.png) no-repeat;
}

#envcorp {
background:url(/img/env_stationery.png) no-repeat;
}

#envhome {
		background:url(/img/env.png) no-repeat;
}

#envcontact {
background:url(/img/env_contact.png) no-repeat;
}

#envtest {
background:url(/img/env_testimonial.png) no-repeat;
}

#envblog {
background:url(/img/env_blog.png) no-repeat;
}

h5 {
color: #6a2d91;
margin-bottom: 15px;
font: bold 20px Corbel;
}

h2 {
font-size: 16px;
font-weight: bold;
color: #6a2d91;
}

h2 a {
text-decoration: none;
color: #6a2d91;
}

#nav {
	float:left;
	width:451px;
	height:152px;	
}

#nav li {
	float:left;
	height:152px;
}

#nav li a{
	display:block;
	height:152px;
	overflow:hidden;
	cursor:pointer;
}

#nav li a span{
	display:block;
	height:152px;
}

#nav #about a{
	width:77px;
}

#nav #brand a{
	width:129px;
}

#nav #contact a{
	width:79px;
}

#nav #design a{
	width:74px;
}

#nav #explore a{
	width:92px;
}

#nav #about a span{
	background:url(/img/n_about.png) no-repeat;
	width:77px;
}

#nav #brand a span{
	background:url(/img/n_brand.png) no-repeat;
	width:129px;
}

#nav #contact a span{
	background:url(/img/n_contact.png) no-repeat;
	width:79px;
}

#nav #design a span{
	background:url(/img/n_design.png) no-repeat;
	width:74px;
}

#nav #explore a span{
	background:url(/img/n_explore.png) no-repeat;
	width:92px;
}

#nav a:hover span {
	background-position: 0 -62px;
	color: #1B1F28;
}

#nav #about a:hover span{
	background:url(/img/nav_abouto.png) no-repeat;
	width:77px;
}

#nav #brand a:hover span{
	background:url(/img/nav_brando.png) no-repeat;
	width:129px;
}

#nav #contact a:hover span{
	background:url(/img/nav_contacto.png) no-repeat;
	width:79px;
}

#nav #design a:hover span{
	background:url(/img/nav_designo.png) no-repeat;
	width:74px;
}

#nav #explore a:hover span{
	background:url(/img/nav_exploreo.png) no-repeat;
	width:94px;
}

#topcontent {
position:absolute;
z-index:100;
}

#contentarea {
	padding-top:180px;
	padding-left:50px;
	padding-right:20px;
	background:url(/img/content_bg.jpg) no-repeat 30px 76px ;
width:750px;
}

#contentarea p {
padding-right:50px;
color:#202021;
font-size:1.1em;
line-height:1.5em;
}

#contentarea p strong {
	color:#202021;
	margin-bottom:10px;
	font-weight:bold;
	color:#6a2d91;
	text-transform:uppercase;
}

#contentarea a strong {
	color:#202021;
	font-weight:bold;
	color:#6a2d91;
}

#featwork {
float:left;
margin-bottom:30px;
}

#featwork li {
float:left;
margin-right:20px;
}

#featwork li a{
width: 355px;
height: 255px;
}

#featwork li a span{
position:absolute;
background:none;
}

#designtabs {
clear:both;
margin-bottom:35px;
float: left;
display: block;
height: 20px;
overflow: hidden;
cursor:pointer;
}

#designtabs li {
display: block;
float:left;
margin-right:20px;
}

#designtabs li a{
display: block;
height: 20px;
overflow: hidden;
}

#designtabs li a span{
display: block;
position:absolute;
width: 100%;
height: 20px;
}

#designtabs li a:hover span{
position:absolute;
}

#designtabs #print a{
width:39px;
cursor:pointer;
}

#designtabs #corporate a{
width:96px;
cursor:pointer;
}

#designtabs #signage a{
width:105px;
cursor:pointer;
}

#designtabs #brochure a{
width:73px;
cursor:pointer;
}

#designtabs #webdesign a{
width:84px;
cursor:pointer;
}

#designtabs #misc a{
width:34px;
cursor:pointer;
}

#designtabs #print a span{
background:url(/img/print.png) no-repeat;
width:39px;
}

#designtabs #corporate a span{
background:url(/img/corporate.png) no-repeat;
width:96px;
}

#designtabs #signage a span{
background:url(/img/signage.png) no-repeat;
width:105px;
}

#designtabs #brochure a span{
background:url(/img/brochures.png) no-repeat;
width:73px;
}

#designtabs #webdesign a span{
background:url(/img/webdesign.png) no-repeat;
width:84px;
}

#designtabs #misc a span{
background:url(/img/misc.png) no-repeat;
width:34px;
}

#designtabs #print a:hover span{
background:url(/img/printo.png) no-repeat;
width:39px;
}

#designtabs #corporate a:hover span{
background:url(/img/corporateo.png) no-repeat;
width:96px;
}

#designtabs #signage a:hover span{
background:url(/img/signageo.png) no-repeat;
width:105px;
}

#designtabs #brochure a:hover span{
background:url(/img/brochureso.png) no-repeat;
width:73px;
}

#designtabs #webdesign a:hover span{
background:url(/img/webdesigno.png) no-repeat;
width:84px;
}

#designtabs #misc a:hover span{
background:url(/img/misco.png) no-repeat;
width:34px;
}

#area {
width: 730px;
}

#area a {
color:#202021;
text-decoration:none;
border:none;
font-weight:bold;
}

#area a:hover {
color:#202021;
text-decoration:none;
}

#area a:visited {
color:#000;
text-decoration:none;
font-weight:bold;
}

#designarea {
width: 700px;
}

.printwork{
display: inline-block;
float: left;
text-align: left;
margin: 0 40px 0 0;
color: #343333;
font-size: .9em;
height: 220px;
width:200px;

}

.printwork img{
margin: 3px;
border: 1px solid gray;
text-align: left;
}


.cardwork{
display: inline-block;
float: left;
text-align: left;
margin: 0 40px 0 0;
color: #343333;
font-size: .9em;
height: 180px;
width:200px;

}

.cardwork img{
margin: 3px;
border: 1px solid gray;
text-align: left;
}

#sidebar {
width:153px;
position: absolute;
background:url(/img/sidebar_bg2.png) no-repeat top left;
z-index:120;
top:0;
margin-left: 755px;
padding: 20px 30px 20px 45px;
}

#sidebar p {
margin-bottom: 1em; 
}

#sidebar a {
color:#d2d2d2;
text-decoration:none;
font-weight:bold;
}

#sidebar a:hover {
color:#d2d2d2;
text-decoration:none;
}

#sidebar a:visited {
color:#d2d2d2;
text-decoration:none;
font-weight:bold;
}

#sidebar li a {
	color:#d2d2d2;
	text-decoration:none;
	font-weight:bold;
	line-height:1.6em;
}

#sidebar li a:hover {
	border-bottom: 1px dotted #fff;
	color:#fff;
	text-decoration:none;
}

#sidebar li a:visited {
	color:#d2d2d2;
	text-decoration:none;
	font-weight:bold;
}

h3 {
font-size: 10px;
margin-bottom:15px;
color: #6a2d91;
font-style: italic;
}

h3 a{
font-weight: bold;
font-size: 10px;
margin-bottom:15px;
color: #6a2d91;
font-style: italic;
text-decoration:none;
}

h3 a:hover{
border-bottom: 1px dotted #6a2d91;
color: #6a2d91;
font-style: italic;
}


h4 {	
	color: #fff;
	font-weight: bold;
	font-size: 1.2em;
	line-height:1.8em;
	margin-top:20px;
}

.clear {
clear:both; 
padding-bottom: 12px;
}


#preload {
visibility: hidden;
display: none;
}

#mailform {
height: 30px;
padding: 10px;
padding-left: 20px;
font-size: 1.1em;
color: white;
width: 380px;
}
.field {
padding: 5px;
background-color: #6a2d91;
color: #fff;
font: 1em arial;
border: none;
}

.txt_email {
padding: 5px;
width: 150px;
background-color: #6a2d91;
color: #fff;
font: 1em arial;
border: none;
margin-left: 10px;
margin-right: 10px;
}
.contactfield {
background-color: 6a2d91;
color: #fff;
font: 1em arial;
border: none;
width: 250px;
height: 12px;
margin-top: 5px;
margin-right: 15px;
margin-bottom: 5px;
padding: 5px;
}

#enqtype {
height: 25px;
}

#enqtype, #q1, #q4, #q5, #q8, #q9, #q10 {
color: #fff;
}

#how {
height: 25px;
}

#how, #q1, #q4, #q5, #q8, #q9, #q10 {
color: #fff;
}

#msg {
height: 109px;
}

.post_info_bottom {
padding-top: 15px;
font-weight: bold;
color: #6a2d91;
font-size: 12px;
}

.post_info_bottom a{
text-decoration: none;
color: #6a2d91;
}

.prevnextc {
padding-top: 15px;
padding-bottom: 15px;
text-decoration: none;
font-weight: bold;
font-style: italic;
}

.prevnextc a{
color: #332a62;
text-decoration: none;
}

#commentform p {
padding-bottom: 10px;
}

.commentinfo {
padding-top: 5px;
color: #6a2d91;
font-weight: bold;
}

.blogcomment {
	margin-bottom: 15px;
	margin-top: 20px;
	color: #6a2d91;
	padding: 10px 10px 10px 50px;
	font-size: 12px;
	width: 550px;
	background: #e6ebe5 url(../img/dialog.png) no-repeat 10px 10px;
}

.blogcommentinfo {
	padding-top: 5px;
	font-size: 10px;
}

.blogcommentcomment {
	color: #6a2d91;
}

.clear {
	clear: both;
}