/*************************************************
Avery Printall Inc. www.averyprint.ca
Created by gldstudio.com
Copyright and other stuff 2009
*************************************************/
/*CSS hard reset*/
html{color:#000;background:#818588;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}del,ins{text-decoration:none;}

/*Begin CSS*/

#home, #decals, #digital, #screen, #specialities, #contact {
	background: #fff url(../images/bg_top.jpg) top repeat-x;
}

::selection{ /* Safari and Opera */  
    background:#ffcb05;  
    color:#000;  
}  
::-moz-selection{ /* Firefox */  
    background:#ffcb05;  
    color:#000;  
} 

#top-wrapper {
	width: 100%;
	background: url(../images/bg_bottom.jpg) bottom repeat-x;
}

#container {
	width: 900px;
	margin: 0 auto;
}

#maps {
	font: normal 0.8em Arial, Helvetica, sans-serif;
}

#header h1 a{
	display: block;
	position: relative;
	float: left;
	width: 305px; height: 70px;
	background: url(../images/logo_full.jpg) 0 0 no-repeat;
	text-indent: -9999px;
	outline: none; border: 0;
	margin: 0 0 30px 0;
}
	#header h1 a:hover{
		background: url(../images/logo_full.jpg) 0 -70px no-repeat;
	}
	#header h1 a:active {
		top: 1px;
	}
	
#header h3 a {
	display: block;
	float: right;
	width: 170px; height: 70px;
	text-indent: -9999px;
	background: url(../images/contact.jpg) 0 0 no-repeat;
	outline: none; border: 0;
}
	#header h3 a:hover {
		background-position: 0 -70px;
	}
	#header h3 a:active {
		background-position: 0 -140px;
	}

#nav-bar {
	width: 900px; height: 80px;
}

p.ftp a{
	float: left;
	display: none;
	margin: 5px 0 0 0;
	background: url(../images/clientftp.jpg) 0 0 no-repeat;
	width: 108px; height: 35px;
	text-indent: -9999px;
	font: normal 1em verdana, sans-serif;
}
	p.ftp a:hover{
		background-position: 0 -35px;
	}
	p.ftp a:active{
		background-position: 0 -70px;
	}

#navigation {
	list-style-type: none;
	float: right;
	width: 526px; height: 80px;
}
	#navigation li {
		float: left;
	}
		#navigation li a {
			display: block;
			height: 50px;
			background: url(../images/navigation.jpg) no-repeat 0 0;
			text-indent: -9999px;
			margin: 0 0 0 20px;
		}
		
			#navigation li#nav-home a {
				width: 75px;
				background-position: 0 0;
			}
				#navigation li#nav-home a:hover {
					background-position: 0 -80px;
				}
				
			#navigation li#nav-industrial a{
				width: 86px;
				background-position: -99px 0; 
			}
				#navigation li#nav-industrial a:hover{
					background-position: -99px -80px;
				}
				
			#navigation li#nav-digital a{
				width: 86px;
				background-position: -209px 0;
			}
				#navigation li#nav-digital a:hover{
					background-position: -209px -80px;
				}
				
			#navigation li#nav-screen a{
				width: 86px;
				background-position: -321px 0;
			}
				#navigation li#nav-screen a:hover{
					background-position: -321px -80px;
				}
				
			#navigation li#nav-specialities a{
				width: 92px;
				background-position: -434px 0;
			}
				#navigation li#nav-specialities a:hover{
					background-position: -434px -80px;
				}
				
			#home #navigation li#nav-home a {
				height: 80px;
				background-position: 0 -160px;
			}
			#decals #navigation li#nav-industrial a {
				height: 80px;
				background-position: -99px -160px;
			}
			#digital #navigation li#nav-digital a {
				height: 80px;
				background-position: -209px -160px;
			}
			#screen #navigation li#nav-screen a {
				height: 80px;
				background-position: -321px -160px;
			}
			#specialities #navigation li#nav-specialities a {
				height: 80px;
				background-position: -434px -160px;
			}
		

#featured {
	width: 900px; height: 280px;
}

h2.name {
   position: absolute;
   text-transform: lowercase;
   top: 150px;
   left: 0;
   width: 100%;
}

h2.name span {
   color: white;
   font: normal italic 30px/34px Georgia, Serif;
   background: rgb(0, 0, 0); /* fallback color */
   background: rgba(0, 0, 0, 0.7);
   padding: 5px 10px;
}

h2.name span.spacer {
   padding:0 10px;
}

#content {
	width: 900px;
	clear: both;
}
	#content p {
		padding-bottom: 10px;
		text-shadow: 1px 1px 1px rgba(255,255,255,.4);
	}

#overview-main {
	width: 665px;
	float: left;
}
	#overview-main p {
		font-size: 0.9em;
	}

#overview-menu {
	float: left;
}

#who-we-are, #what-we-do, #where-we-are {
	font: normal 0.9em/2em Arial, Helvetica, sans-serif;
	color: #303030;
	width: 400px; min-height: 250px;
	float: right;
}

#where-we-are ul li {
	font: normal 0.9em/2em Arial, Helvetica, sans-serif;
	color: #303030;
	text-shadow: 1px 1px 1px rgba(255,255,255,.4);
}
	#where-we-are ul li span {
		font: normal 16px Georgia, serif;
		padding-right: 15px;
		color: #252525;
	}
	#where-we-are a {
		text-decoration: underline;
		color: #303030;
	}
		#where-we-are a:hover {
			text-decoration: none;
		}

#services {
	float: right;
	width: 235px;
	min-height: 200px;
	background: url(../images/vert_div.png) top left no-repeat;
}
	#services h3 {
		color: #696d70;
		margin-left: 20px;
		font: italic 24px Georgia, serif;
		text-transform: lowercase;
		text-shadow: 0 1px 1px #fff;
	}

.services-list {
	margin: 20px 0 0 50px;
	font: normal 0.8em Arial, Helvetica, sans-serif;
	color: #303030;
	text-transform: lowercase;
}

.content-list {
	margin-top: -20px;
	margin-bottom: 30px;
}

a.ultima {
	padding-left: 23px;
	position: relative;
}	
	a.ultima img {
		margin-bottom: 20px;
	}
	
	a.ultima:active {
		top:1px;
	}

.services-list li {
	margin: 18px 0;
	list-style-image: url(../images/check.gif);
}
	.services-list li a {
		text-decoration: underline;
		color: #303030;
		display: block;
		text-shadow: 1px 1px 1px rgba(255,255,255,.4);
	}
		.services-list li a:hover {
			text-decoration: none;
		}
		
#gallery {
	margin: 10px 0 30px 0;
	float: left;
}
	#gallery li {
		display: inline;
		margin: 0 20px;
	}
		#gallery li a img{
			outline: 5px solid #6a6a6a;
		}
			#gallery li a:hover img{
			outline: 5px solid #333;
		}
		
.image {
   position: relative;
   width: 100%; /* for IE 6 */
}

.sub-image {
   position: relative;
   margin-bottom: 20px;
   width: 100%; /* for IE 6 */
}

#featured h2 {
   position: absolute;
   top: 150px;
   left: 0;
   width: 100%;
}

#featured h2 span {
   color: white;
   font: italic 36px/40px Geprgia, Serif;
   font-weight: lighter;
   background: rgb(0, 0, 0); /* fallback color */
   background: rgba(0, 0, 0, 0.7);
   padding: 5px;
}

#featured h2 span.spacer {
   padding:0 5px;
}

.featureSlide .wrapper h2.name {
   position: absolute;
   top: 180px;
   left: 0;
   width: 100%;
}

h2.name {
   position: absolute;
   top: 150px;
   left: 0;
   width: 100%;
}

h2.name span {
   color: white;
   font: normal italic 30px/34px Georgia, Serif;
   background: rgb(0, 0, 0); /* fallback color */
   background: rgba(0, 0, 0, 0.7);
   padding: 5px 10px;
}

h2.name span.spacer {
   padding:0 10px;
}

h4 {
	margin: 0 0 10px 0;
	font: normal italic 1.2em Georgia, Serif;
	text-shadow: 1px 1px 1px rgba(255,255,255,.2);
}

#main {
	width: 645px; min-height: 450px;
	padding: 0 20px 0 0;
	background: url(../images/div_lg.png) top right no-repeat;
}

	#main p {
		font: normal 0.8em/1.9em Arial, Helvetica, sans-serif;
		color: #303030;
		padding: 0 10px 15px 10px;
	}
	
	#main p a {
		color: #303030;
	}
		#main p a:hover {
			text-decoration: none;
		}
	
	#main h3 {
		padding: 5px 0 10px 10px;
	}
	
#main p span {
	font: normal italic 0.9em Georgia, serif;
	color: #404040;
}
	
#contact #main {
	background: url(../images/div_med.png) top right no-repeat;
}
		
#sidebar {
	width: 215px;
	float: right;
	clear: both;
}

h3 {
	color: #303030;
	font: italic 22px Georgia, serif;
	text-transform: lowercase;
	text-shadow: 0 1px 1px #bebebe;
}

.services {
	background: url(../images/ico_services.png) 0 0 no-repeat;
	padding-left: 38px;
	height: 35px;
}

.testimonials {
	background: url(../images/ico_testimonials.png) 0 0 no-repeat;
	padding-left: 38px;
	height: 35px;
}

.plain-list {
	margin: 10px 0 30px 20px;
	font: normal 0.8em/1.7em Arial, Helvetica, sans-serif;
	color: #6f6f6f;
}
	.plain-list li {
		margin: 5px 0;
	}
		.plain-list li a {
			text-decoration: underline;
			color: #303030;
		}
			.plain-list li a:hover {
				text-decoration: none;
			}

.quote {
	width: 195px;
	margin: 15px 10px;
}

.quote p.copy {
	font: italic 0.9em/1.3em Georgia, serif;
	color: #646464;
	background: url(../images/quote-bg.png) 0 0 no-repeat;
	padding: 20px 10px 10px 20px;
}
.quote-bottom {
	background: url(../images/quote-bg.png) 0 -460px no-repeat;
}
	.quote-bottom p {
		text-align: right;
		color: #303030;
		font: normal 0.8em Arial, Helvetica, sans-serif;
		padding: 35px 0 0 0;
	}
		.quote-bottom p span {
			display: block;
			font: italic 12px/16px Georgia, serif;
		}
#footer-wrapper {
	background: url(../images/bg_footer.jpg) top repeat-x;
	clear: both;
	padding: 25px 0 0 0;
}
	#footer {
		width: 900px; height: 100px;
		margin: 0 auto;
		font: normal 0.8em/1.6em Arial, Helvetica, sans-serif;
	}
		#footer a {
			color: #ffcd00;
			position: relative;
			text-decoration: underline;
			text-shadow: 1px 1px 1px rgba(0,0,0,.2);
		}
			#footer a:hover {
				text-decoration: none;
			}
			#footer a:active {
				top: 1px;
			}
		#foot-left {
			width: 300px;
			float: left;
		}
		#foot-left h1 {
			font: normal 2.5em Georgia, serif;
			color: #242424;
			text-shadow: 0 1px 1px #9b9c9e;
		}
		
		#foot-right {
			width: 450px;
			float: right;
			color: #242424;
			text-shadow: 1px 1px 1px rgba(255,255,255,.4);
		}
			#foot-right ul {
				width: 450px;
				display: block;
				clear: both;
				float: right;
			}
			#foot-right ul li{
				float: right;
				margin: 0 0 0 6px;
			}
			
.clearfix {
	zoom: 1; /* IE Fix */
}
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

/* begin tab styles */

/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .tabs-nav {
        display: none;
    }
}

/* Skin */
.tabs-nav {
    list-style: none;
    float: left;
    width: 240px;
    margin: 0;
    padding: 0 0 0 4px;
}
.tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.tabs-nav li {
    float: left;
    margin: 0 0 0 1px;
    min-width: 84px; /* be nice to Opera */
}
.tabs-nav a, .tabs-nav a span {
    padding: 0 10px;
}
.tabs-nav a {
    display: block;
    width: 240px; height: 75px;
    padding-left: 0;
    color: #696d70;
    font-family: Georgia, serif;
    font-size: 18px;
    line-height: 4;
    font-style: italic;
    text-align: center;
    text-decoration: none;
    background-position: bottom left;
    background-repeat: no-repeat;
    white-space: nowrap; /* required in IE 6 */
    text-shadow: 0 1px 1px #fff;
      
}

#overview-menu li a span {
	top: 20px;
}
.tabs-nav .tabs-selected a {
    color: #363634;
    background-position: top left;
}

#overview-menu li a:active, #overview-menu li a:hover{
	background-position: top left;
    background-repeat: no-repeat;
}

#overview-menu li a#who {
	background-image: url(../images/ico_who_full.png);
}
#overview-menu li a#what {
	background-image: url(../images/ico_what_full.png);
}
#overview-menu li a#where {
	background-image: url(../images/ico_where_full.png);
}

.tabs-nav .tabs-selected a, .tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active {
	background-position: top left no-repeat;
	/*background-image: url(../images/overview_active.png);  !!!!Come back to this later!!!! */
    outline: 0; /* prevent dotted border in Firefox */
}
.tabs-nav a, .tabs-nav .tabs-disabled a:hover, .tabs-nav .tabs-disabled a:focus, .tabs-nav .tabs-disabled a:active {
	background-position: top left no-repeat;
}
.tabs-nav a span {
    width: 64px; /* IE 6 treats width as min-width */
    min-width: 64px;
    height: 18px; /* IE 6 treats height as min-height */
    min-height: 18px;
    padding-top: 6px;
    padding-right: 0;
}
*>.tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}
.tabs-nav .tabs-selected a span {
    padding-top: 7px;
}

#overview-main li.tabs-selected {
	background: url(../images/overview_active.png) top center no-repeat;
}
.tabs-nav .tabs-selected a span, .tabs-nav a:hover span, .tabs-nav a:focus span, .tabs-nav a:active span {
    background-position: 0 -50px;
}
.tabs-nav a span, .tabs-nav .tabs-disabled a:hover span, .tabs-nav .tabs-disabled a:focus span, .tabs-nav .tabs-disabled a:active span {
    background-position: 0 0;
}
.tabs-nav .tabs-selected a:link, .tabs-nav .tabs-selected a:visited, .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.tabs-nav .tabs-disabled {
    opacity: .4;
}
.tabs-container {
    padding: 1em 8px;
}
.tabs-loading em {
    padding: 0 0 0 20px;
    background: url(loading.gif) no-repeat 0 50%;
}