/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */
	/*Header Block*/
	header { background:url(../images/bg_headerline-x.png) repeat-x top left; text-align:center;}
	div.header_block { width:940px; padding:31px 0 0 0; margin:0 auto; position:relative; text-align:left}
	/*Main Navugation*/
	nav.head_nav { border-top:#2fc29e 1px solid; border-bottom:#2fc29e 1px solid; padding:1px 0; margin-bottom:70px}
	nav.head_nav ul {border-top:#2fc29e 1px solid; border-bottom:#2fc29e 1px solid; list-style:none; margin:0; padding:18px 100px 18px 195px; display:block; overflow:hidden}
	nav.head_nav ul li { margin:0; float:left; padding:0 6px 0 0; background:url(../images/menu_marker.png) no-repeat right center;}
	nav.head_nav ul li.second { padding:0 190px 0 0px; background:none;}
	nav.head_nav ul li.last { background:none;}
	nav.head_nav ul li a {font-size:18px; line-height:20px; color:#ffffff; text-transform:uppercase; font-family:'YanoneKaffeesatzThin'; display:block; padding:0 15px; text-decoration:none}
	nav.head_nav ul li a:hover {color:#2fc29e; text-decoration:none }
	nav.head_nav ul li.act a {color:#2fc29e; text-decoration:none}
	/*Logo*/
	.logo { position:absolute; right:50%; margin-right:-80px; top:5px; background:url(../images/bg_main.png) repeat; width:160px; height:140px;}
	.logo a { background:url(../images/bg_logo.png) no-repeat; width:150px; height:145px; position:absolute; top:-5px; left:5px; display:block; color:#fff; font-size:37px; line-height:39px; text-align:center; text-transform:uppercase; text-decoration:none; font-family:'YanoneKaffeesatzLight'}
	.logo a span { display:block; text-align:center; padding:25px 0 9px 0; color:#ffffff; font-size:18px; line-height:20px; font-family:'YanoneKaffeesatzLight'}
	/*Slider*/
	.top_slider { width:940px; margin:0 auto; z-index:100; overflow:hidden}
	#top_slider { margin-bottom:100px!important}
	/*Animated Blocks*/
	.sti-menu { width:960px; margin:0 0 45px 0}
	.sti-menu li { width:220px; margin:0 10px; height:330px}
	.sti-icon {left:31px; top:75px;	width:158px; height:158px;}
	.sti-menu li a h3 {top:250px; left:0px; padding:0px 20px 0 25px; line-height:21px; text-transform:none!important}
	.sti-menu li a h2 {top:20px; left:0px; padding:0; font-size:26px;}
	.sti-icon-design{background-image:url(../images/icons/icon_block1.png);}
	.sti-icon-commerce{background-image:url(../images/icons/icon_block2.png);}
	.sti-icon-marketing{background-image:url(../images/icons/icon_block3.png);}
	.sti-icon-print{background-image:url(../images/icons/icon_block4.png);}
	/*Footer*/
	footer { background:url(../images/bg_headerline-x.png) repeat-x bottom left; text-align:center; padding:20px 0 38px 0; text-align:center}
	.footer { width:940px; margin:0 auto; padding:30px 0 30px 0; background:#5e5f5f; text-align:left}
	.footer .copy { float:left; color:#ffffff; line-height:24px; font-size:11px; padding:0 0 0 60px}
	.footer .social { float:right; text-align:left; padding:0 60px 0 0}
	.footer .social ul { list-style:none; margin:0; padding:0}
	.footer .social ul li { padding:0 0 0 16px; margin:0; width:24px; height:24px; float:left}
	.footer .social ul li a { width:24px; height:24px; display:block; }
	.footer .social ul li a.soc_rss { background:url(../images/icons/ico_rss.png) no-repeat; }
	.footer .social ul li a.soc_facebook { background:url(../images/icons/ico_f.png) no-repeat; }
	.footer .social ul li a.soc_flicker { background:url(../images/icons/ico_flick.png) no-repeat; }
	.footer .social ul li a.soc_twitter { background:url(../images/icons/ico_t.png) no-repeat; }
	
	/*Dividers*/
	.divider {background:url(../images/sep_cont1.png) repeat-y;}
	.divider40 {background-position:40.7% 0}
	.divider60 {background-position:59.4% 0}
	.block_mar40 { margin-bottom:40px!important}
	
	ul.portfolio li .portfolio_overlay .zoom  { display:block}
	
	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
	body { overflow-x:hidden}
	/*Header Block*/
	header { background:url(../images/bg_headerline-x.png) repeat-x top left; text-align:center;}
	div.header_block { width:748px; padding:31px 0 0 0; margin:0 auto; position:relative; text-align:left}
	/*Main Navugation*/
	nav.head_nav { border-top:#2fc29e 1px solid; border-bottom:#2fc29e 1px solid; padding:1px 0}
	nav.head_nav ul {border-top:#2fc29e 1px solid; border-bottom:#2fc29e 1px solid; list-style:none; margin:0; padding:18px 94px 18px 99px; display:block; overflow:hidden}
	/*Slider*/
	.top_slider { width:767px; margin:0 auto; z-index:100; overflow:hidden}
	/*Animated Blocks*/
	.sti-menu { width:768px; margin:0 0 45px 0}
	.sti-menu li { width:172px; margin:0 10px; height:330px; padding-bottom:15px}
	.sti-icon {left:7px; top:65px;	width:158px; height:158px;}
	.sti-menu li a h3 {top:230px; left:0px; padding:0px 10px 0 10px;}
	.sti-menu li a h2 {top:10px; left:0px; padding:0; font-size:26px;}
	/*Footer*/
	.footer { width:768px; margin:0 auto; padding:30px 0 30px 0; background:#5e5f5f; text-align:left}
	
	/*Fixes*/
	ul.featured_images li { margin:0; padding:0 20px 10px 0px; border:none; float:left}
	ul.featured_images li:first-child { padding:0 20px 10px 0px; border:none}
	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
	body { overflow-x:hidden}
	/*Header Block*/
	header { background:url(../images/bg_headerline-x.png) repeat-x top left; text-align:center;}
	div.header_block { width:420px; padding:31px 0 0 0; margin:0 auto; position:relative; text-align:left}
	/*Main Navugation*/
	nav.head_nav { border-top:#2fc29e 1px solid; border-bottom:#2fc29e 1px solid; padding:1px 0}
	nav.head_nav ul {border-top:#2fc29e 1px solid; border-bottom:#2fc29e 1px solid; list-style:none; margin:0; padding:18px 15px 8px 15px; display:block; overflow:hidden}
	nav.head_nav ul li { margin:0; float:left; padding:0 0 10px 0; background:none;}
	nav.head_nav ul li.even { padding:0 190px 10px 0 }
	nav.head_nav ul li.second { padding:0 0 10px 0}
	nav.head_nav ul li a {font-size:18px; line-height:20px; color:#ffffff; text-transform:uppercase; font-family:'YanoneKaffeesatzThin'; display:block; padding:0 15px; text-decoration:none}
	nav.head_nav ul li a:hover {color:#2fc29e; text-decoration:none }
	/*Slider*/
	.top_slider { width:420px; margin:0 auto; z-index:100; overflow:hidden}
	#top_slider { margin-bottom:75px!important}
	/*Animated Blocks*/
	.sti-menu { width:420px; margin:0 0 45px 0}
	.sti-menu li { width:190px; margin:0 10px; height:330px; padding-bottom:15px}
	.sti-icon {left:16px; top:65px;	width:158px; height:158px;}
	.sti-menu li a h3 {top:230px; left:0px; padding:0px 10px 0 10px;}
	.sti-menu li a h2 {top:10px; left:0px; padding:0; font-size:26px;}
	/*Footer*/
	.footer { width:420px; margin:0 auto; padding:30px 0 30px 0; background:#5e5f5f; text-align:left}
	.footer .copy { float:left; color:#ffffff; line-height:24px; font-size:11px; padding:0 0 0 30px}
	.footer .social { float:right; text-align:left; padding:0 30px 0 0}
	.footer .social ul { list-style:none; margin:0; padding:0}
	
	ul.portfolio li .portfolio_overlay .zoom { display:none}
	/*Fixes*/
	ul.featured_images li { margin:0; padding:0 20px 10px 0px; border:none; float:left}
	ul.featured_images li:first-child { padding:0 20px 10px 0px; border:none}	
	.columns { padding-bottom:40px}
	.block_mar40 { margin-bottom:0px!important}
	/*Dividers*/
	.divider {background:none}
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
	body { overflow-x:hidden}
	/*Header Block*/
	header { background:url(../images/bg_headerline-x.png) repeat-x top left; text-align:center;}
	div.header_block { width:300px; padding:31px 0 0 0; margin:0 auto; position:relative; text-align:left}
	/*Main Navugation*/
	nav.head_nav { border-top:#2fc29e 1px solid; border-bottom:#2fc29e 1px solid; padding:1px 0; margin-bottom:25px}
	nav.head_nav ul {border-top:#2fc29e 1px solid; border-bottom:#2fc29e 1px solid; list-style:none; margin:0; padding:18px 15px 8px 15px; display:block; overflow:hidden}
	nav.head_nav ul li { margin:0; float:none; padding:0 0 10px 0; background:none; clear:both}
	nav.head_nav ul li.second { padding:0 0 10px 0}
	nav.head_nav ul li a {font-size:18px; line-height:20px; color:#ffffff; text-transform:uppercase; font-family:'YanoneKaffeesatzThin'; display:block; padding:0 15px; text-decoration:none}
	nav.head_nav ul li a:hover {color:#2fc29e; text-decoration:none }
	/*Logo*/
	.logo { position:absolute; right:10px!important; margin:0px; top:5px; background:url(../images/bg_main.png) repeat; width:160px; height:140px;}
	.logo a { background:url(../images/bg_logo.png) no-repeat; width:150px; height:145px; position:absolute; top:-5px; left:5px; display:block; color:#fff; font-size:37px; line-height:39px; text-align:center; text-transform:uppercase; text-decoration:none; font-family:'YanoneKaffeesatzLight'}
	.logo a span { display:block; text-align:center; padding:25px 0 9px 0; color:#ffffff; font-size:18px; line-height:20px; font-family:'YanoneKaffeesatzLight'}	
	/*Slider*/
	.top_slider { width:300px; margin:0 auto; z-index:100; overflow:hidden}
	#top_slider { margin-bottom:50px!important}	
	/*Animated Blocks*/
	.sti-menu { width:300px; margin:0 0 45px 0}
	.sti-menu li { width:130px; margin:0 10px; height:330px; padding-bottom:15px}
	.sti-icon {left:10px; top:70px;	width:110px; height:110px;}
	.sti-menu li a h3 {top:195px; left:0px; padding:0px 10px 0 10px; line-height:20px}
	.sti-menu li a h2 {top:10px; left:0px; padding:0; ; font-size:26px; line-height:26px}
	.sti-icon-design{background-image:url(../images/icons/icon_block1t.png);}
	.sti-icon-commerce{background-image:url(../images/icons/icon_block2t.png);}
	.sti-icon-marketing{background-image:url(../images/icons/icon_block3t.png);}
	.sti-icon-print{background-image:url(../images/icons/icon_block4t.png);}
	/*Footer*/
	.footer { width:300px; margin:0 auto; padding:15px 0 20px 0; background:#5e5f5f; text-align:left}
	.footer .copy { float:none; color:#ffffff; line-height:24px; font-size:11px; padding:0 0 0 0px; text-align:center; width:100%; clear:both}
	.footer .social { float:none; text-align:left; padding:10px 0px 0 65px; clear:both; text-align:center}
	.footer .social ul { list-style:none; margin:0; padding:0;}

	/*Fixes*/
	ul.featured_images li { margin:0; padding:0 20px 10px 0px; border:none; float:left}
	ul.featured_images li:first-child { padding:0 20px 10px 0px; border:none}	
	.columns { padding-bottom:30px}
	.block_mar40 { margin-bottom:0px!important}
	/*Dividers*/
	.divider {background:none}
	ul.portfolio li .portfolio_overlay .zoom { display:none}
	}


/* #Page Styles
================================================== */

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		/*header { background:#ffff00; height:100px}*/
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		/*header { background:#ff00ff; height:100px}*/
	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		/*header { background:#00ff00; height:100px}*/
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
		/*header { background:#0000ff; height:100px}*/
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		/*header { background:#ff0000; height:100px}*/
	}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/