@charset "UTF-8";

/* the main style sheet containing tag definitions and core styles
   1. TAGS 
   2. SITE COMPONENTS
   3. ENTRY COMPONENTS
   4. HOME PAGE COMPONENTS
   5. CONTACT COMPONENTS
   6. SITE NAVIGATION


PINK: D60640

*/

/*********************************************************************************************************************/
/* 														1. TAGS														 */
/*********************************************************************************************************************/
	body {
		margin: 0;
		padding: 0;
		background: #000 url("../images/template/pattern.gif") top center repeat;
		font-family: 'Yanone Kaffeesatz', arial, serif;
		color: #333;
		line-height: 1.4;
		font-size: 14px;
	}
	h1, h2, h3, h4, h5, h6 {
		margin: 0;
		padding: 0;
		line-height: 1.1;
	}
	h1 {
		margin-bottom: 0;
		font-size: 28px;
	}
	
	h2, h6 {
		font-size: 24px;
		font-weight: normal;
	}
	h6 { font-size:20px; margin: 10px 0;}
	h4 {
		color:#D60640;
		text-transform: uppercase;
		font-size: 18px;
		margin-top: 15px;
	}
	fieldset {
		margin: 0;
		padding: 0;
		border: none;
	}
	
	img { border: none; }
	a {color: #D60640;}
	a:hover { text-decoration: none; }
	p a {
		color: #D60640;
		text-decoration: none;
		border-bottom: 1px solid #D60640;
	}
	p a:hover { 
		border: none;
		background-color: #D60640;
		color: #fff;
		-webkit-transition-property: background;
  		-webkit-transition-duration: 0.3s;
 		-webkit-transition-timing-function: ease;
	}
	p {
		line-height: 1.7;
		color: #333;
	}
	input,
	password,
	date,
	textarea { 
		line-height: 1;
		font-family: 'Yanone Kaffeesatz', arial, serif;
	}
	::-moz-selection{
        background: #D60640; 
        color: #fff;
	}
	::selection {
        background: #D60640; /* Safari */
        color: #fff;
	}
	:outline { border: none; }
	
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
	    display:block;
	}
	
/*********************************************************************************************************************/
/* 														2. SITE COMPONENTS											*/
/*********************************************************************************************************************/

	.wrap {
		max-width: 960px;
		margin: 0px auto;
		clear: both;
	}
	.btn {

		color: #666;
		padding: 15px 30px;
		background: #ccc;
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#ffffff'); /* for IE */
		
		background-image: -webkit-gradient(
		    linear,
		    left bottom,
		    left top,
		    color-stop(0, rgb(204,204,204)),
		    color-stop(1, rgb(255,255,255))
		);
		background-image: -moz-linear-gradient(
		    center bottom,
		    rgb(204,204,204) 0%,
		    rgb(255,255,255) 100%
		);		
		-webkit-border-radius: 2em;
		-moz-border-radius: 2em;
		border-radius: 2em;
		font-size: 20px;
		text-transform: uppercase;
		text-align: center;
		text-decoration: none;
		margin: 20px auto 30px;
		display:inline-block;
		border:none;
		
		-webkit-transition-property: color;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: color;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: color;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: color;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
		border:2px #999 solid;
	}
	
	.btn:hover,
	.btn:focus {
		border: 2px #D60640 solid;
		background: #d7f6f9; 
		color: #333;
		box-shadow: 0px 0px 10px #57d3df inset;
	}
	.content input[type="text"],
	.content textarea {
		background-color:#ebf0f3;
		border:2px solid #999;
		height:30px;
		box-shadow: 0px 0px 5px #aaa inset;
		border-radius: 5px;
		padding: 2px 10px;
		font-size: 15px;
		
		-webkit-transition-property: border, background;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: border, background;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: border, background;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: border, background;	  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;

	}
	
	.content input[type="text"]:focus,
	.content textarea:focus {
		border: 2px #D60640 solid;
		background: #d7f6f9;
	}

/***************************************************/
/********************************* MAIN HEADER *****/
/***************************************************/

	header.site h1 a {
		float: left;
		width: 230px;
		height: 80px;
		background: url(../images/template/headspace_logo.png) no-repeat;
		text-indent: -999em;
		margin-top: 20px;
	}
	nav#utility,
	#search {
		float: right;
		display: block;
		margin-top: 5px;
	}
	#search input { 
		float: right; 
		display: block;
		
		/* CSS3 Transitions */
		-webkit-transition-property: border;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: border;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: border;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: border;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#search input[type="text"] {
		border: none;
		border-bottom: 1px #666 solid;
		width: 150px;
		padding: 2px 0px 2px 10px;
		background: none;
		color:#989898;
		font-size: 16px;
	}
	#search input[type="text"]:focus {
		color:#D60640;
	}
	#search input[type="submit"] {
		cursor: pointer;
		width: 21px;
		height: 25px;
		text-indent: -999em;
		bordeR: none;
		border-bottom: 1px #666 solid;
		background: url(../images/template/btn-search.png) no-repeat 0px 3px;
	}
	#search input[type="submit"]:hover {
		background-position: 0px -33px;
	}
	#search:hover input {
		border-bottom: 1px #D60640 solid;
	}



/***************************************************/
/************************************* CONTENT *****/
/***************************************************/
	hgroup.site {
		padding: 20px 0 20px;
		display: block;
	}
	hgroup.site h2 {
		font-family: 'Raleway', arial, serif;
		color: #fff;
		font-size: 60px;
		padding: 0;
		margin: 40px 0 0 0;
		font-weight: 300;
		line-height: 70px;
	}
	hgroup.site h2.alt {
		font-size: 35px;
	}
	hgroup.site h2.alt span {
		font-size: 60px;
		color:#D60640;
		font-family: 'Yanone Kaffeesatz', arial, serif;
		font-weight: bold;
	}
	.content {
		background: #fff;
		overflow:hidden;
		padding: 30px 0;
		width:100%;
	}
	.content h3 {
		font-size: 21px;
		letter-spacing: 0.3px;
		line-height: 1.5;
		font-weight: normal;	
		color:#333;
	}
	.content hgroup {
		overflow:hidden;
		padding: 0;
		margin: 25px 0 26px;
		border-bottom: 5px solid #666;
	}
	.content hgroup a {
		float: right;
		font-size: 15px;
		text-transform: uppercase;
		padding-top: 5px;
		color: #666;
		text-decoration: none;
	}
	.content hgroup a:hover {
		color: #333;
	}
	.content hgroup h3 {
		margin: 0;
		padding: 0;
		text-transform: uppercase;
		color: #666;
		font-size: 18px;
		float: left;
		max-width: 300px;
	}
	.content ul,
	.content ul li {
		margin: 0;
		padding: 0;
		list-style: circle inside;
		line-height: 1;
	}
	.content ul li {
		margin-top: 5px;
	}
	#two_col > div {
		margin: 0;
		padding: 0;
		width: 49%;
		float: left;
	}
	
	#two_col > div:first-child {
		margin-right: 2%;
		width: 49%;
	}
	aside.right {
		width: 32%;
		float: right;
	}	
	aside.right > hgroup + div img {
		width: 100%
	}


/***************************************************/
/*									 PROJECTS 	   */
/***************************************************/
	#work {
		clear:both;
	}
	#work ul {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	#work ul li {
		width: 25%;
		display:block;
		float:left;
		height: 200px;
	}
	
	#work #team-list li {
		height: auto;
	}
	
/* Project Overview Page */
	#work ul li > div {
		padding: 12px;
		margin: 0 0 10px 0;
		
		-webkit-transition-property:background;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property:background;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property:background;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property:background;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#work ul li > div:hover {
		background: #D6063F;
	}
	#work ul li > div h3 {
		color: #D6063F;
		font-size: 20px;
		line-height:1;
	}
	#work ul li > div h4 {
		color: #666;
		font-size: 15px;
		text-transform: uppercase;
	}	
	#work ul li > div:hover h3 { color:#fff;}
	#work ul li > div:hover h4 { color:#000;}
	#work ul li > div img {
		width:100%;
	}
	#work #details {
		width: 33.5%;
		float: right;

	}
	#work #details > a:first-child {
		text-transform: uppercase;
		text-decoration: none;
		font-weight: bold;
		font-size: 15px;	
		
	}
	#work #details hgroup {
		border-top: 1px #999 solid;
		border-bottom: 1px #999 solid;
		margin: 10px 0;
	}
	#work #details h1 {
		color:#666;
		font-size: 35px;
		font-weight: normal;
		margin: 5px 0;
	}
	#work #details h2 {
		text-transform: uppercase;
		color:#666;
		font-size:15px;
		margin: 0 0 10px;
	}
	#work #details p {
		line-height: 1.3;
		font-size: 15px;
	}
	#work .links {
		margin-bottom: 15px;
	}
	#work .links a {
		margin: 0 0 0px 0;
		font-size: 24px;
		text-decoration: none;
		bordeR:none;
		padding: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		display:block;
		
		-webkit-transition-property: background, color;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: background, color;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: background, color;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: background, color;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#work .links a:hover {
		background: #D60640;
		color:#fff;
	}
	#work #details h3 {
		font-size: 21px;
		letter-spacing: 0.3px;
		line-height: 1.5;
		font-weight: normal;	
		color:#333;
		width: 100%;
		display: block;
		margin-top: 10px;
		border-bottom: 5px solid #666;
	}
	#work #details h3 + ul li {
		display: inline-block;
	    margin: 0;
    	padding: 0;
	    width: 50%;
	}
	#work #details h3 + ul li a {
	    display: block;
	    padding: 5px; 
	    
	    /* CSS3 Transitions */
		-webkit-transition-property: background;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: background;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: background;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: background;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#work #details h3 + ul li a:hover {
		background: #D60640;
	}
	#work #details h3 + ul li a img {
		 display: block;
	    width: 100%; 
	}
	#projects-list {

		width: 100%;

		margin-top: 0px;	
	}
	#hide_projects {
		display:block;
		width: 200px;
		margin: 10px auto 20px;
		padding: 5px 0;
		color:#fff;
		font-size: 20px;
		background:#333;
		border-radius: 10px;
		text-align: center;
		text-transform: uppercase;
		text-decoration: none; 
	}
	#hide_projects:hover {
		background: #D60640;
	}
	#projects-list ul {
		margin: 0;
		padding: 0;
		list-style:none;
	}
	#projects-list ul li {
		margin: 0;
		padding: 0;
		display:inline-block;
		width:25%;
	}
	#projects-list ul li a {
		display:block;
		padding: 9px;
	}
	#projects-list ul li a:hover {
		background: #D60640;
	}
	#projects-list ul li a img {
		display:block;
		width:100%;
	}
	
	/* GALLERY */
	#gallery {
		margin: 0;
		/*width: 74%;*/
		width:62.5%;
		padding: 0;
		float:left;
		position: relative;
		overflow:hidden;
		border: 5px solid #444;
	}
	#gallery > img {
		max-width: 600px;
		width: 100%;
		display: block;
		float: left;		
	}
	#gallery > div img {
		max-width: 600px;
		width: 100%;
		display: block;
		float: left;
	}
	#testimonial {
		float: left;
		clear:left;
		width:62.5%;

	}
	#testimonial blockquote {
		padding: 0;
		margin: 10px 0;
		font-size: 22px;
		line-height: 1.2;
		color:#333;
	}
	#testimonial cite {
		color:#333;
		font-style: normal;
	}
	#testimonial cite:before { content: "-"; }
	
	
	/* PROJECTS THUMB LIST */
	#projects-list article {
		margin: 0;
		padding: 0;
		floaT: left;
		width: 50%;
	}
	#projects-list article a {
		width: 100%;
		display:block;
		float: left;
		position: relative;
		text-decoration: none;
		cursor: pointer;
	}
	#projects-list article a span {
		position: absolute;
		width: 91%;
		bottom: 0;
		left: 0;
		padding:5%;
		background: #D60640;
		opacity: 0.0;
		filter: alpha(opacity=0);
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
		color:#fff;
		font-size: 20px;
		
		/* CSS3 Transitions */
		-webkit-transition-property: opacity;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: opacity;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: opacity;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: opacity;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#projects-list article a:hover span {
		opacity: 0.8;
		filter: alpha(opacity=80);
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	}
	#projects-list article a img {
		width: 100%;
		float: left;
		display: block;
	}
	
	#team-list li {
		height: auto;
	}
	
	
	
	
/***************************************************/
/*									 COMPANY 	   */
/***************************************************/
	#company .left {
		width: 60%;
		floaT:left;
		margin-right: 7%;
	}
	#company ul {
		padding: 0;
		margin: 0;
		list-style: none;
	}
	#company ul li {
		padding: 0;
		margin: 0;	
		width: 25%;
		display: inline-block;
	}
	#company ul li a {
		display: block;
		padding: 5px;
		
		/* CSS3 Transitions */
		-webkit-transition-property: background;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: background;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: background;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: background;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#company ul li a:hover { background: #D60640; }
	#company ul li a img { 
		width: 100%;
		display:block; 
	}
	
/***************************************************/
/*									 ERROR PAGE	   */
/***************************************************/
	#error .wrap {
		border-bottom: 2px #333 solid;
		overflow:hidden;
		width: 100%;
		clear: both;
		padding: 50px 0 0 0;
	}
	#error img {
		float: right;
	}
	#error .wrap > div {
		float: left;
		display:block;
		width: 30%;
		clear:left;
		color: #fff;
	}
	#error .wrap > div h2 { font-size: 48px;}
	#error .wrap > div p {
		color: #999;
		font-size: 20px;
		line-height: 1.3;
		font-family: 'Raleway', arial, serif;
	}


/***************************************************/
/*								BLOG & SEARCH 	   */
/***************************************************/
	#blog .wrap > div:first-child {
		width: 75%;
		float: left;
	}
	#blog aside {
		width: 20%;
		float:right;
	}
	#search_section article,
	#blog article {
		margin: 0 0 20px;
		padding: 12px 10px 15px 10px;
		border-bottom: 1px solid #CCC;
	}
	#blog article ul,
	#blog article ul li {
		line-height:1.0;
		font-family: 'Lato', sans-serif;
		font-size: 14px;	
		color:#333;
	}
	#search_section article h3,
	#blog article h2 {
		line-height: 1.1;
		font-weight: bold;
		font-size: 45px;
		margin: 0 0 10px 0;
	}
	#search_section article h3,
	#search_section article h3 a,
	#blog article h2,
	#blog article h2 a {
		text-decoration: none;
		color: #333;
	}
	#search_section article h3 a:hover,
	#blog article h2 a:hover {
		color:#D60640;
	}
	#search_section article p,
	#blog article p {
		margin: 0 0 20px 0;
		font-size: 17px;
		line-height:1.5;
		font-family: 'Lato', sans-serif;
		font-size: 14px;
	}
	#search_section article h3 + p,
	#blog article h2 + p {
		margin-bottom: 20px;
		font-size: 15px;
		font-family: 'Yanone Kaffeesatz', arial, serif;
		line-height: 10px;
		line-height:1.5;
	}
	#search_section article p > strong,
	#blog article p > strong { margin-left: 15px }
	#search_section article p > strong:first-child,
	#blog article p > strong:first-child { margin: 0;}
	#search_section article p span,
	#search_section article p strong,
	#blog article p span,
	#blog article p strong {
		text-transform: uppercase;
		font-size: 14px;
	}
	#search_section a,
	#blog article,
	#blog article a {
		-webkit-transition-property: color, background;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: color, background;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: color, background;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: color, background;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#search_section article span.comment,
	#search_section article span.file,
	#blog article span.comment,
	#blog article span.file {
		display: inline-block;
		width: 15px;
		margin: 0px 3px 0 5px;
		height: 20px;
		background: url(../images/template/icons-list.gif) no-repeat 0px 3px;
	}
	#search_section article span.comment,
	#blog article span.comment {
		background-position: right 3px;
	}
	#blog aside {
		margin-top: 20px;
		font-size: 17px;
	}
	#blog aside h3 {
		font-weight: normal;
		color:#666;
		line-height: 1.2;
	}
	#blog aside h3:first-child {
		font-family: 'Raleway', arial, serif;
		font-size: 18px;
		line-height: 1.5;
	}
	#blog aside ul {
		margin: 0 0 30px 0;
		padding: 0;
		list-style: none;
	}
	#blog aside ul li {
		margin: 0;
		padding: 2px 0;
		list-style: none;
	}
	#rss a{
		line-height: 1;
	}
	#rss span {
		margin:8px 8px 0 0;
		width: 14px;
		height: 16px;		
		background: url(../images/template/icon-rss.gif) no-repeat;
		float:left;
	}
	.latestcomment p {
		font-size: 14px;
	}
	.latestcomment p:first-child {
		font-size: 25px;
		line-height: 1.0;
		margin: 10px 0 0;
		font-family: 'Raleway', arial, serif;
	}
	
	

/***************************************************/
/*									 COMMENTS 	   */
/***************************************************/

	
	#comment-form fieldset {
		width: 60%;
		float: left;
	}
	#comment-form fieldset + fieldset {
		width: 40%;
	}
	#comment-form fieldset label,
	#comment-form fieldset input[type="text"],
	#comment-form fieldset textarea {
		display: block;
		clear:both;
		width: 90%;
	}
	#comment-form fieldset input[type="text"]:focus,
	#comment-form fieldset textarea:focus {

	}
	#comment-form fieldset label { 
		font-size: 16px; 
		margin: 20px 0 3px;
	}
	#comment-form fieldset .cb label + label {
		margin-top: 0;
	}
	#comment-form fieldset textarea {
		height: 150px;
	}
	#comment-form fieldset input[type="submit"] {
		bordeR: none;

		background: #ccc;
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#ffffff'); /* for IE */
		color: #666;
		padding: 15px 30px;
		
		background-image: -webkit-gradient(
		    linear,
		    left bottom,
		    left top,
		    color-stop(0, rgb(204,204,204)),
		    color-stop(1, rgb(255,255,255))
		);
		background-image: -moz-linear-gradient(
		    center bottom,
		    rgb(204,204,204) 0%,
		    rgb(255,255,255) 100%
		);		
		-webkit-border-radius: 2em;
		-moz-border-radius: 2em;
		border-radius: 2em;
		font-size: 20px;
		text-transform: uppercase;
		text-align: center;
		text-decoration: none;
		margin: 20px auto 30px;
		display:inline-block;
		
		-webkit-transition-property: color, background;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: color, background;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: color, background;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: color, background;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#comment-form fieldset input[type="submit"]:focus,
	#comment-form fieldset input[type="submit"]:hover {
		background-color: #fff;
		color: #fff;

		background: #ccc;
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cccccc'); /* for IE */
		background-image: -webkit-gradient(
		    linear,
		    left bottom,
		    left top,
		    color-stop(0, rgb(255,59,114)),
		    color-stop(1, rgb(214,6,64))
		);
		background-image: -moz-linear-gradient(
		    center bottom,
		    rgb(255,59,114) 0%,
		    rgb(214,6,64) 100%
		);		
		-webkit-border-radius: 2em;
		-moz-border-radius: 2em;
		border-radius: 2em;
		font-size: 20px;
		text-transform: uppercase;
		text-align: center;
		text-decoration: none;
		margin: 20px auto 30px;
		display:inline-block;
	}

	.addthis_toolbox { margin: -10px 0 20px; }
	#comment-form fieldset input[type="text"] { padding: 7px 5px; }
	
	#comment-list ul,
	#comment-list ul li {
		padding: 0;
		margin: 0;
		list-style: none;
	}
	#comment-list ul li { margin-bottom: 10px; }
	#comment-list ul li > p:first-child {
		background: #999;
		color:#fff;
		padding: 5px;
		margin: 0;
		-webkit-transition-property: color, background;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: color, background;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: color, background;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: color, background;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#comment-list ul li:hover > p:first-child {
		background: #D60640;
	}
	#comment-list ul li > div {
		font-size: 16px;
		background-color:#efefef;
		padding: 1px 15px;
	}
	
	#comment-list p {
		font-family: "lato", arial;
		font-size: 13px;
	}
		
/***************************************************/
/*									 HOME	 	   */
/***************************************************/
	#home #blog article { 
		margin: 0; 
		padding: 12px 10px 15px 10px; 
	}
	#home #blog article h2 { 
		font-size: 30px; 
		margin: 0 0 5px 0;
	}
	#home #blog article:hover {
		background: #D60640;
		color:#fff;
	}
	#home #blog article h2 + p {
		margin-bottom: 0px;
		color:#333;
	}
	#home #blog article p > strong { margin-left: 7px color:#333; }
	#home #blog article p > strong:first-child { margin-left: 0px }
	#home #blog article:hover p a { border-color:#fff;}
	#home #blog article:hover h2,
	#home #blog article:hover a,
	#home #blog article:hover p { color:#fff; }


/***************************************************/
/*									 FOOTER 	   */
/***************************************************/
	footer.site > div {
		width: 25%;
		display: inline-block;
		color:#fff;
		margin: 45px 0 0;
		vertical-align:top;
	}
	footer.site > div h4 { 
		font-sizE: 24px;
		margin: 0 0 5px;
		font-weight:normal;
	}
	footer.site > div h4 + p { 
		margin: 0;
		font-size: 16px;
		color:#999;
		line-height: 1.2;
	}
	#social_links {
		width: 48%;
	}
	#social_links ul,
	#social_links li {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	#social_links ul li {
		display: inline-block;
	}
	#social_links ul li a {
		display:block;
		margin: 0 20px 0 0;
		
		-webkit-transition-property:color;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property:color;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property:color;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property:color;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#social_links ul li a:hover { color: #D60640;}
	#social_links ul li a span {
		display: block;
		floaT:left;
		width: 25px;
		height: 25px;
		margin: 0 7px 0 0;
		background: url(../images/template/icons-social.png) no-repeat;
		
		-webkit-transition-property:background;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property:background;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property:background;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property:background;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#social_links ul li.email a span { background-position: 0px 3px; }
	#social_links ul li.rss a span { background-position: -38px 0px; }
	#social_links ul li.facebook a span { background-position:  -74px 0px; }
	
	#social_links ul li.email a:hover span { background-position: 0px -33px; }
	#social_links ul li.rss a:hover span { background-position: -38px -35px; }
	#social_links ul li.facebook a:hover span { background-position:  -74px -36px; }

	#social_links input {
		font-size: 20px;
		float:left;
		line-height:1;
		color:#fff;
		border: none;
		margin: 30px 0 0 0;
		padding: 5px 10px;
		
		-webkit-transition-property:background;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property:background;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property:background;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property:background;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#social_links input[type="text"] {
		background: #666;
		width: 50%;
	}
	#social_links input[type="text"]:focus {
		background: #D60640;

	}
	#social_links input[type="submit"] {
		background: none;
		cursor: pointer;
		padding: 4px 10px 4px;
		line-height: 1.3;
		text-transform: uppercase;
	}
	#social_links input[type="submit"]:hover {
		background:#860227;
	}
	.copyright {
		color:#999;
		font-size: 14px;
		margin-bottom: 50px;
	}

#footer .phone_address {
	float: left;
	margin-right: 50px;
}

#footer h4 {
	color: #fff;
	font-size: 25px;
	font-weight: normal;
	margin: 0;
	padding: 0;
}

#footer .phone_address p {
	font-size: 16px;
	margin: 0;
	line-height: 16px;
	color: #999;
}

#social_links a {
	font-size: 19px;
	text-decoration: none;
	color: #fff;
	text-transform: uppercase;
}


#footer .copyright {
	clear: left;
	padding-top: 20px;
	color: #999;
	font-size: 14px;
}


/* REQUEST FORM */

	
	#requestproposal {
		width:730px;
		padding:0px;
		position: relative;
		overflow: hidden;
		background-color:#151515;
	}
	#proposal_wrap {
		width: 2920px;
	}
	.rp_page {
		width: 710px;
		float: left;
		display: block;
		margin-right: 20px;
		overflow:hidden;
	}
	.nyroModalCont .rp_page h3 { /* I have to include the .nyroModalCont as it is styled below. */
		font-size: 20px;
		margin-top: 15px;
	}
	.rp_page input[type="text"],
	.rp_page textarea {
		font-size: 15px;
		padding: 5px;
		width: 98%;
		font-family: "lato", arial;
	}
	.rp_page input[type="text"]:focus,
	.rp_page textarea:focus {
		border:2px #D60640 solid;
		background: #d7f6f9;
	}
	.rp_page textarea { height: 50px; }
	.rp_page label {
		color:#999;
		margin: 0;
	}
	.rp_page label.error { color:#D60640; } 
	.rp_page .two_col,
	.rp_page .three_col { overflow:hidden; }
	.rp_page .two_col > div {
		width: 48%;
		padding-left: 2%;
		float: left;
	}
	.rp_page .two_col input[type="text"] { width: 93%; }
	.rp_page .two_col > div:first-child { padding: 0 2% 0 0; }
	.rp_page .two_col + .two_col {margin-top: 10px;}
	.rp_page .three_col > div,
	.rp_page .three_col.cb > label {
		width: 33%;
		float: left;
	}
	/* PAGE 2 and 3 */
	#proposalpage2 textarea,
	#proposalpage3 textarea {
		margin-bottom: 20px;
	}
	.rp_page textarea.alt {
		height: 100px;
	}
	.rp_page input[type="text"].error { border: 2px #D60640 solid; }
	
/* ARROW BAR STYLES */
	.arrowbar {
		position: absolute;
		bottom: 0;
		height: 60px;
		width: 100%;
	}
	.arrowbar input[type="submit"] {
		float:right;
		margin:0;
	}
	.arrowbar a.formback {
		background: url(../images/template/arw_left-sm.gif) top left no-repeat;
		margin:0 0 0 10px;
		float:left;
	}
	.arrowbar a.formforward {
		background: url(../images/template/arw_right-sm.gif) top right no-repeat;
		margin:0 25px 0 0;	
		float:right;	
	}	
	.arrowbar a.formforward:hover {
		background-position:bottom right;
		margin:0 20px 0 0;	
	}
	.arrowbar a.formback:hover {
		background-position:bottom left;
		margin:0 10px 0 0;	
	}
	.arrowbar a.formback, 
	.arrowbar a.formforward {
		display:block;
		text-indent:-999em;
		height:57px;
		width:28px;
		padding:0;
		opacity: 0.6;
		filter: alpha(opacity=60);
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
		
		/* CSS3 Transitions */
		-webkit-transition-property: opacity, margin, padding;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: opacity, margin, padding;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: opacity, margin, padding;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: opacity, margin, padding;	  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
		
	}

#requestproposal .require_msg {
	float:right;
	margin: -50px 20px 0 0;
}




#requestproposal p {color:#999;margin:0;}

#requestproposal h1 {margin-bottom:35px;}

#requestproposal h3, #requestproposal h2, #requestproposal h1 {
	color:white;
	display:block;
	clear:both;
}
#requestproposal h2 {
	margin-bottom: 20px;
}



#requestproposal span {
	color:#D60640;
	font-size: .9em;
}

/* REQUEST FORM SECTIONS */

.proposalthanks {	
	height:200px;
	margin-top:325px;
	text-align: center;
	overflow:hidden;
}


/* REQUEST FORM TABS */

#proposaltabs {
width: 100%;
padding-bottom: 20px;	
}

nav#rftabs ul {
	display:table;
	margin:0;
	padding: 0;
	list-style: none;
}

nav#rftabs ul li {
	margin: 0;
	padding: 0;
	display: table-cell;
}

nav#rftabs {
	text-align: center;
	text-transform: uppercase;
	font-size: 15px;
}

nav#rftabs ul li a {
	margin: 0;
	padding: 0;
	display:block;
	color: #666;	
	border-bottom: 5px solid #333;
	text-decoration: none;
	width:236px;
	height:25px;
	letter-spacing: 0.3px;
	
	/* CSS3 Transitions */
	-webkit-transition-property:color, border;  
	-webkit-transition-duration: 0.2s, 0.2s;  
	-webkit-transition-timing-function: linear, ease-in;  
	
	-moz-transition-property:color, border;  
	-moz-transition-duration: 0.2s, 0.2s;  
	-moz-transition-timing-function: linear, ease-in;  
	
	-o-transition-property:color, border;  
	-o-transition-duration: 0.2s, 0.2s;  
	-o-transition-timing-function: linear, ease-in;  
	
	transition-property:color, border;  
	transition-duration: 0.2s, 0.2s;  
	transition-timing-function: linear, ease-in;
}

nav#rftabs ul li.current a,
nav#rftabs ul li a:hover {
	border-bottom: 5px solid #D60640;
	color: #fff;
}

	

/*********************************************************************************************************************/
/* 														3. ENTRY COMPONENTS											*/
/*********************************************************************************************************************/



.heading h3 {
	color: #333;
	font-size: 22px;
	font-weight: 300;
}




/*********************************************************************************************************************/
/* 														4. HOME PAGE COMPONENTS										*/
/*********************************************************************************************************************/
	#mast {
		clear:both;
		overflow:hidden;
		text-align:center;
	}
	#mast h3 {
		color:#fff;
		font-size: 24px;
		
		font-weight: normal;
		text-transform: uppercase;
		line-height: 1.4;
		margin: 20px 0 0 0;
	}


#banner_1 {
	float: left;
	width: 959px;
	margin-top: 30px;
}



#banner_button {
	overflow: hidden;
	display: block;
	margin-top: 30px;
}

#banner_button a {
	width: 320px;
	height: 10px;
	background: #fff;
	float: left;
	text-indent: -9999px;
}

#banner_button a:hover, #banner_button a.current {
	background: #D60640;
}

#home_banner_wrap h3, #home_banner_wrap .button {
	clear: both;
	text-align: center;
}

#home_banner_wrap h3 {
	color: #fff;
	text-align: center;
	font-size: 25px;
	text-transform: uppercase;
	font-weight: 300;
}

	
/*********************************************************************************************************************/
/* 														5. PRODUCTS COMPONENTS										*/
/*********************************************************************************************************************/
	#products h3 {
		margin-bottom: 20px;
	}
	#products article {
		display:block;
		clear:both;
		width: 100%;
		overflow:hidden;
		margin-bottom: 30px;
	}
	#products article h2 {
		color:#333;
		margin: 10px 0 5px ;
	}
	#products article > img,
	#products article > div {
		float: left;
	}
	#products article > div {
		width: 50%;
		margin: 3% 0 0 5%;
	}
	#products article > div p { 
		margin: 0;
		font-family: "lato", arial;

		line-height: 1.2
	}
	#products article > div > a {
		background: #D60640;
		color:#fff;
		padding: 2px 25px;
		border-radius: 15px;
		margin-top: 15px;

		display:block;
		float: left;
		clear:both;
		text-transform: uppercase;
		text-decoration: none;
		font-size: 17px;
		
		-webkit-transition-property:background, margin;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property:background, margin;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property:background, margin;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property:background, margin;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	#products article > div > a:hover {
		margin-left: 5px;
		background: #4dbbc5;
	}

/*********************************************************************************************************************/
/* 														5. SERVICES COMPONENTS										*/
/*********************************************************************************************************************/

	/* OVERVIEW BG */
	#services { background: #fff url(../images/template/bg-cloud_blk.gif) no-repeat center 30px; }	

	#service_entry ul,
	#services nav ul {
		margin: 0 auto;
		padding: 0;
		list-style: none;
		background: url(../images/template/nav-service_lg.gif) no-repeat;
		width: 471px;
		height: 471px;
		overflow: hidden;
	}
	
	#service_entry { position: relative; }
	#service_entry nav {
		position: absolute;
		right: 0;
		z-index: 2;
		top: 35px;

	}
	#service_entry nav ul {
		margin: 0;
		width: 217px;
		height: 217px;
		background: url(../images/template/nav-service_sm.png) no-repeat;
	}
	#service_entry nav ul li,
	#services nav ul li {
		margin: 0;
		padding: 0;
		list-style:none;
	}
	#service_entry nav ul li a,
	#services nav ul li a {
		padding: 0;
		margin: 0;
		text-transform: uppercase;
		color: #fff;
		text-align: center;
		text-decoration: none;
		font-size: 40px;
		font-weight: 700;
		
		/* Turn it off so we can fade it in */
		opacity: 0;
		filter: alpha(opacity=0);
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
		
		/* CSS3 Transitions */
		-webkit-transition-property: opacity;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: opacity;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: opacity;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: opacity;	  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}	
	/* Hover, fade in baby */
	#service_entry nav ul li.current a,
	#service_entry nav ul li a:hover,
	#services nav ul li a:hover { 
		opacity: 1; 
		filter: alpha(opacity=100);
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	}
	/* Hide the text*/
	#service_entry nav ul li a span,
	#services nav ul li a span {
		display: block;
		float: left;
		text-indent: -999em;
	}

/* wheel part placement*/
	#service_entry nav ul li.top_wheel a,
	#services nav ul li.top_wheel a {
		width: 335px;
		height: 118px;
		float: right;
		position:relative;
		left:-69px;
		z-index:10;
		background: url(../images/template/service-plan.png) top center no-repeat;
	}
	#service_entry nav ul li.right_wheel a,
	#services nav ul li.right_wheel a {
		width: 118px;
		height: 333px;
		float: right;
		position:relative;
		top:-50px;
		left: -2px;
		background: url(../images/template/service-design.png) top center no-repeat;
	}
	#service_entry nav ul li.bottom_wheel a,
	#services nav ul li.bottom_wheel a {
		width: 335px;
		height: 118px;
		clear: both;
		float: left;
		padding-top: 20px;
		position:relative;
		top: -100px;
		left: 67px;
		background: url(../images/template/service-code.png) top center no-repeat;
	}
	#service_entry nav ul li.left_wheel a,
	#services nav ul li.left_wheel a {
		width: 118px;
		height: 333px;
		float: left;
		position:relative;
		top: 68px;
		background: url(../images/template/service-promote.png) top center no-repeat;
	}
	#service_entry nav ul li.top_wheel a {
		left:-30px;
		z-index:10;
		width: 156px;
		height: 56px;
		background: url(../images/template/service-plan_sm.png) top center no-repeat;
	}
	#service_entry nav ul li.top_wheel.current a { background: url(../images/template/service-plan_cur.png) top center no-repeat; }
	#service_entry nav ul li.right_wheel a {
		top:-25px;
		left: 0px;
		width: 56px;
		height: 154px;
		background: url(../images/template/service-design_sm.png) top center no-repeat;
	}
	#service_entry nav ul li.right_wheel.current a { background: url(../images/template/service-design_cur.png) top center no-repeat; }
	#service_entry nav ul li.bottom_wheel a {
		top: -49px;
		left: 30px;
		width: 156px;
		height: 56px;
		background: url(../images/template/service-code_sm.png) top center no-repeat;
	}
	#service_entry nav ul li.bottom_wheel.current a { background: url(../images/template/service-code_cur.png) top center no-repeat; }
	
	#service_entry nav ul li.left_wheel a {
		top: 31px;
		width: 56px;
		height: 154px;
		background: url(../images/template/service-promote_sm.png) top center no-repeat;
	}
	#service_entry nav ul li.left_wheel.current a { background: url(../images/template/service-promote_cur.png) top center no-repeat; }



	/***************************************************/
	/*					SAME FOR EACH SECTION 	 	   */
	/***************************************************/
	#plan .wrap,
	#design .wrap,
	#code .wrap,
	#promote .wrap { position: relative; }

	#plan.content .wrap h3,
	#design.content .wrap h3,
	#code.content .wrap h3,
	#promote.content .wrap h3 { 
		font-weight: 600;
		font-size: 30px;
		color: #333;
		margin-bottom: 0;
	}
	
	#plan.content .wrap p,
	#design.content .wrap p,
	#code.content .wrap p,
	#promote.content .wrap p { 
		font-size: 14px;
		line-height: 1.3;
		margin: 0;
		font-family: "lato", arial;
	}
	
	/***************************************************/
	/*									 PLAN 	 	   */
	/***************************************************/
	#plan .wrap { 
		position: relative;
		height: 840px;
		background: #fff url(../images/template/bg-plan.jpg) no-repeat 15px 0px; 
	}
	
	#strategy, #brand, #social {
		position: absolute;
		display:block;
	}
	#strategy {
		width: 300px;
		right: 0;
		top: 315px;
	}
	#brand {
		top: 235px;
		width: 235px;	
	}
	#social {
		top: 685px;
		left: 170px;
		width: 610px;
	}
	
	/***************************************************/
	/*									 DESIGN	 	   */
	/***************************************************/
	#design .wrap { background: #fff url(../images/template/bg-design.gif) no-repeat 0 0; }
	#experience,
	#copy,
	#testing {
		margin-left: 550px;
		margin-bottom: 30px;
	}
	#experience { padding-top: 125px; }

	/***************************************************/
	/*									 CODE	 	   */
	/***************************************************/
	#code .wrap { 
		min-height: 1238px;
		background: #fff url(../images/template/bg-code.gif) no-repeat 0 0; 
	}
	#web_mobile { padding: 100px 0 30px;}
	#web_mobile,
	#iphone {
		margin-left: 450px;
		width: 490px;
	}
	#cms {
		width: 615px;
		padding: 210px 0 0 0;
	}
	
	/***************************************************/
	/*									 PROMOTE 	   */
	/***************************************************/
	#promote { padding: 0; }
	#promote .wrap { 
		padding-bottom: 50px;
		background: #fff url(../images/template/bg-promote.gif) no-repeat 0 0px; 
	}
	#social_media { padding-top: 165px; }
	#social_media,
	#search_engine,
	#advertising {
		width: 345px;
		margin-left: 610px;
		padding-bottom: 30px;
	}
	#email_marketing {
		width: 485px;
		margin-top: -210px;
	}




/*********************************************************************************************************************/
/* 														5. CONTACT COMPONENTS										*/
/*********************************************************************************************************************/

	#contact {
		padding-top: 0;
	}
	#contact .wrap {
		background: url(../images/template/bg-cloud.gif) no-repeat center top;
		overflow:hidden;
		padding-top: 20px;
	}
	#contact .wrap > div {
		width: 65%;
		padding-left: 5%;
		display:inline-block;
		vertical-align:top;
	}
	
	#contact_head a.btn {
		float: right;
		margin-bottom: -20px;
	}
	#contact h2 {
		margin: 30px 0 10px;
	}
	#contact h3 {
		width: 29%;
		display:inline-block;
		vertical-align:top;
	}
	.address {
	
	}
	#contact .wrap > div p{
		width: 29%;
		display: inline-block;
	}
	#contact .wrap > div p {
		margin:0;
		font-size:20px;
		font-weight: 100;
	}
	#contact .wrap > div p span {
		font-weight: 500;
		font-size: 30px;
		line-height:0.8;
	}

	#contact label {
		display:block;
		font-size: 20px;
		font-weight: 100;
		margin: 10px 0 0;
	}
	#contact label.error {
		color:#f00;
		margin: 0;
		font-size: 15px;
	}
	#contact input[type="text"],
	#contact textarea {
		width:300px;
	}
	#contact textarea { height: 200px;}
	
	#contact input[type="text"].error,
	#contact textarea.error {
		border-color:#f00;
	}
	
	#contact input[type="text"]:focus,
	#contact textarea:focus {
		border: 2px #D60640 solid;
		background: #d7f6f9;
	}
	#contact input[type="submit"] {
		clear:both;
		display: block;
		float: none;
		margin: 20px 0 0 0;
		-webkit-transition-property: border, background, color;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: border, background, color;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: border, background, color;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: border, background, color;	  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}



/*********************************************************************************************************************/
/* 														5. TOOLS COMPONENTS											*/
/*********************************************************************************************************************/
	#tools .wrap > div {
		width: 100%;
		overflow:hidden;
	}
	#tools .wrap > div article {
		width:33%;
		display: block;
		float:left;
	}
	#tools .wrap > div article img {
		width: 75%;
	}
	#tools h3 {
		margin-bottom: 30px;
	}	
	#tools h2,
	#tools p {
		color:#333333;
		margin:0;
		width: 90%;
	}
	#tools .wrap > div article p {
		margin-bottom:30px;
		font-size: 16px;
		margin-top: 5px;
		line-height:1.2
	}
	#tools img {
		border:3px solid #999999;
		margin:0;
	}
	
/*********************************************************************************************************************/
/* 														SEARCH SECTION												*/
/*********************************************************************************************************************/
	#search_section {
		
	}


/*********************************************************************************************************************/
/* 														6. SITE NAVIGATION											*/
/*********************************************************************************************************************/

	header.site nav ul {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	header.site nav ul li {
		margin: 0;
		padding: 0;
		float: left;
	}

	nav#primary {
		width: 100%;
		float: right;
		text-align: left;
		text-transform: uppercase;
		font-size: 21px;
		padding: 0;
		margin: 15px 0 0 0;
	}
	nav#primary ul { 
		width: 100%; 
		float: right;
	}
	nav#primary ul li a {
		color: #666;	
		border-bottom: 5px solid #333;
		text-decoration: none;
		width: 100%;
		padding:0 0 0 25%;
		display: block;
		letter-spacing: 0.3px;
		
		/* CSS3 Transitions */
		-webkit-transition-property:color, border;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property:color, border;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property:color, border;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property:color, border;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	
	nav#primary ul li.current a,
	nav#primary ul li a:hover, nav#primary ul li a:active {
		border-bottom: 5px solid #D60640;
		color: #fff;
	}
	
	/* UTILITY */
	nav#utility { margin-top: 5px; }
	nav#utility ul li { padding: 0 !important; }
	nav#utility ul li a {
		text-transform: uppercase;
		margin: 0 10px 0 0;
		font-size: 14px;
		padding: 3px;
		color: #999;
		font-weight: normal;
		text-decoration: none;
		
		-webkit-transition-property: color;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: color;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: color;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: color;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	nav#utility ul li a:hover { color:#D60640; }



.nyroModalCont > div img {
	max-width: 125px;
	padding-right: 15px;
	float: left;
	width: 25%;
}

.nyroModalCont > div > div {
	float: left;
	width: 70%;
}
.nyroModalCont h2 {
	color:#0B4D91;
	font-weight: normal;
}
.nyroModalCont h2 span {
	color:#939393;
}
.nyroModalBg {
	position: fixed;
	overflow: hidden;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
}
.nmReposition {
	position: absolute;
	
}
	.nyroModalCloseButton {

		text-decoration: none;
		font-size: 18px;
		padding: 10px 4px 7px;
		line-height: 1;
		display:block;
		font-weight: normal;
		top: 3px;
		right: 3px;
		border-radius: 20px;
		background: #1f1f1f;
		width: 20px;
		text-align: center;
		font-size: 12px;
		font-family: 'Raleway', arial, serif;
		color:#fff;
		z-index: 3000;
		content: "X";
	}
	.nyroModalCloseButton:hover {
		background: #D60640;
	}
.nyroModalTitle {
	top: -26px;
	left: 0;
	margin: 0;
    font-size: 1.1em;
	color: #ddd;
}
	.nyroModalCont {
		z-index: 3000;
		position: absolute;
		box-shadow: 0px 0px 15px #999;
		margin: 25px;
		padding: 7px;
		background: #151515;
		height: auto;
	}
	.nyroModalCont h2 {
		color:#ccc;
		font-size: 30px;
	}
	.nyroModalCont h3 {
		font-size: 14px;
		font-weight: normal;
		color:#666;
	}
	.nyroModalCont p {
		font-size: 16px;
		letter-spacing: 0.3px;
		color:#ccc;
	}
	
.nyroModalCont iframe {
	width: 600px;
	height: 400px;
}
.nyroModalError {
	border: 4px solid red;
	color: red;
	width: 250px;
	height: 250px;
}
.nyroModalError div {
	min-width: 0;
	min-height: 0;
	padding: 10px;
}
.nyroModalLink, .nyroModalDom, .nyroModalForm, .nyroModalFormFile {
	position: relative;
	padding: 10px;
	min-height: 250px;
	min-width: 250px;
	max-width: 730px;
}
.nyroModalImage, .nyroModalSwf, .nyroModalIframe, .nyroModalIframeForm {
	position: relative;
	overflow: hidden;
}
.nyroModalImage img {
    vertical-align: top;
}
.nyroModalHidden {
	left: -9999em;
	top: -9999em;
}
.nyroModalLoad {
	position: absolute;
	width: 100px;
	height: 100px;
	padding: 0;
	background: #333 url(../images/template/ajax-loader2.gif) no-repeat center center;
	border-radius: 50px;
}
.nyroModalPrev, .nyroModalNext {
	outline: none;
	position: absolute;
	top: 0;
	height: 60%;
	width: 150px;
	min-height: 50px;
	max-height: 300px;
	cursor: pointer;
	text-indent: -9999em;
	background: transparent url('data:image/gif;base64,AAAA') left 20% no-repeat;
}
.nyroModalImage .nyroModalPrev, .nyroModalImage .nyroModalNext {
	height: 100%;
	width: 40%;
	max-height: none;
}
.nyroModalPrev {
	left: 0;
}
.nyroModalPrev:hover {
	background-image: url(http://headspacedesign.ca/images/template/prev.gif);
}
.nyroModalNext {
	right: 0;
	background-position: right 20%;
}
.nyroModalNext:hover {
	background-position: right 20%;
	background-image: url(http://headspacedesign.ca/images/template/next.gif);
}



	
/*********************************************************************************************************************/
/* 														CODA SLIDER													 */
/*********************************************************************************************************************/

/* Most common stuff you'll need to change */
	
	/* Use this to keep the slider content contained in a box even when JavaScript is disabled */
	.coda-slider-no-js .coda-slider { height: 200px; overflow: auto !important; }
	
	/* Change the width of the entire slider (without dynamic arrows) */
 	.coda-slider-wrapper {
 		width: 100%;
 	}
	.coda-slider,
	.coda-slider .panel {
		width: 100%;
		overflow:hidden;
		min-height: 400px;
	}
	
	.coda-slider .panel .pwrap {
		padding: 55px;
	}
	.coda-slider .panel .video { 
		float: left; 
		width: 60%;
	}
	.coda-slider .panel .img {
		float: left;
		width: 50%;
		margin-right: 5%;
	}
	.coda-slider .panel .txt {
		float: left;
		width: 45%;
	}
	.coda-slider .panel .img img { width: 100%; }
	.coda-slider .panel h2 {
		font-family: 'Raleway', arial, serif;
		color: #fff;
		font-size: 65px;
		width: 100%;
		line-height: 60px;
		margin: 110px 0 0 0;
		text-align: center;	
		float: left;
	}
	.coda-slider .panel h2 a {
		color:#fff;
		text-decoration: none;
		/* CSS3 Transitions */
		-webkit-transition-property: color, font-size;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: color,  font-size;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: color, margin;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: color, margin;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	.coda-slider .panel h2 a:hover {
		font-size: 60px;
		color:#D60640;
	}
	.coda-slider .panel h3 {
		font-size: 40px;
		color:#fff;
	}
	.coda-slider .panel p {
		color:#fff;
		font-size: 22px;
		line-height: 1.1;
		margin-top: 10px;
	}
	
	/* Change margin and width of the slider (with dynamic arrows) */
	.coda-slider-wrapper.arrows .coda-slider, 
	.coda-slider-wrapper.arrows .coda-slider .panel { width: 100%;  }

	
/* Arrow styling */
	.coda-nav-left a, 
	.coda-nav-right a {
		margin-top: 120px;
		float:left;
		display:block;
		position: absolute;
		z-index: 10;
		border-radius: 10px;	
		padding: 10px 20px;	
		opacity: 0.6;
		filter: alpha(opacity=60);
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
		
		/* CSS3 Transitions */
		-webkit-transition-property: opacity, margin;  
		-webkit-transition-duration: 0.2s, 0.2s;  
		-webkit-transition-timing-function: linear, ease-in;  
		
		-moz-transition-property: opacity, margin;  
		-moz-transition-duration: 0.2s, 0.2s;  
		-moz-transition-timing-function: linear, ease-in;  
		
		-o-transition-property: opacity, margin;  
		-o-transition-duration: 0.2s, 0.2s;  
		-o-transition-timing-function: linear, ease-in;  
		
		transition-property: opacity, margin;  
		transition-duration: 0.2s, 0.2s;  
		transition-timing-function: linear, ease-in;
	}
	.coda-nav-left a {
		float: left;
		margin-left: -93px;
	}
	.coda-nav-right a {
		float: left;
		margin-left: -20px;
	}
	#gallery .coda-nav-left a {
		margin-left: 0px;
	}
	#gallery .coda-nav-right a {
		margin-left: -113px;
	}

	.coda-nav-left a span, 
	.coda-nav-right a span {
		display: block;
		width: 73px;
		height: 142px;
		text-indent: -999em;
	}
	#gallery a {
		display: none;
	}
	#gallery:hover a {
		display: block;
	}
	#gallery .coda-slider .panel { min-height: 400px; }
	

	.coda-nav-left a span { background: url(../images/template/arw_left-lg.gif) top left no-repeat; }
	

	.coda-nav-right a span { background: url(../images/template/arw_right-lg.gif) top right no-repeat; }
	
	/* CODA HOVER STATES */
	.coda-nav-left a:hover {
		opacity: 1;
		filter: alpha(opacity=100);
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
		margin-left: -98px;
	}
	.coda-nav-right a:hover {
		opacity: 1;
		filter: alpha(opacity=100);
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
		margin-left: -15px;
	}
	/* CODA SPAN HOVER STATES */

	.coda-nav-left a:hover span {  background-position: 0px -142px; }
	.coda-nav-right a:hover span { background-position:  0px -142px; }

/* Tabbed nav */
	.coda-nav {
		margin: 30px 0 0 0;
		display: block;
		clear:both;
		float:left;
		width: 100%
	}
	.coda-nav ul {
		padding: 0;
		margin: 0;
	}
	.coda-nav ul li {
		padding: 0;
		margin: 0;	
		display: block;
		float: left;
		width: 33.3333%;
	}
	.coda-nav li a {
		width: 100%;
		height: 10px;
		background: #fff;
		float: left;
		text-indent: -9999px;
		
		-webkit-transition: background-color 0.2s ease-in;  
		-moz-transition:background-color 0.2s ease-in;  
		-o-transition:background-color 0.2s ease-in;  
		transition:background-color 0.2s ease-in; 
	}
	.coda-nav li a:hover, 
	.coda-nav li a.current {
		background: #D60640;
	}

		
	/* Miscellaneous */
	.coda-slider-wrapper { clear: both; overflow: hidden }
	.coda-slider { float: left; overflow: hidden; position: relative }
	.coda-slider .panel { display: block; float: left }
	.coda-slider .panel-container { position: relative }
	.coda-nav-left, .coda-nav-right { float: left }
	.coda-nav-left a, .coda-nav-right a { display: block; text-align: center; text-decoration: none }
	
	
	
	/* WORK SECTION */
	#work .coda-nav  { display: none; }
	#work .coda-slider,
	#work .coda-slider .panel {
		height: auto;
	}
	
	
/*********************************************************************************************************************/
/* 														MEDIA QUERIES												 */
/*********************************************************************************************************************/

/***************************************************/
/*						Smaller then 1180	 	   */
/***************************************************/


	@media screen and (max-width: 1180px) {
		
		.coda-nav-left a, 
		.coda-nav-right a {
			margin-top: 160px;
			opacity: 1;
			filter: alpha(opacity=100);
			-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
			padding: 10px 0;
		}
		.coda-nav-left a { margin-left: 5px; }
		.coda-nav-right a { margin-left: -33px; }
		
		#work .coda-nav-left a { margin-left: 5px; }
		#work .coda-nav-left a:hover { margin-left: 0px; }

		#work .coda-nav-right a { margin-left: -35px; }
		#work .coda-nav-right a:hover { margin-left: -30px; }

		.coda-nav-left a span, 
		.coda-nav-right a span {
			width: 28px;
			height: 57px;
		}

		.coda-nav-left a span { background: url(../images/template/arw_left-sm.gif) top left no-repeat; }

		.coda-nav-right a span { background: url(../images/template/arw_right-sm.gif) top right no-repeat; }
		.coda-nav-left a:hover { margin-left: 0px; }
		.coda-nav-right a:hover { margin-left: -28px; }

		.coda-nav-left a:hover span {  background-position: 0px -57px; }

		.coda-nav-right a:hover span { background-position:  0px -57px; }
		
	}
	

@media screen and (min-width: 920px) {
	header.site nav#primary {
		width: 70%;
	}
	header.site nav#primary ul li {
		width: 15%;
		padding: 0;
	}
}

/***************************************************/
/*						Smaller then 970	 	   */
/***************************************************/
	@media screen and (max-width: 970px) {
		

		.coda-slider .panel-container > .panel:first-child h2 {
			margin: 115px 0 0 0;
			font-size: 55px;
		}
		.coda-slider .panel h3 {
			font-size: 35px;
		}
		#two_col > div:first-child,
		#two_col > div {
			width: 48%;
		}
		.content > .wrap, #comment-form, #comment-list, header.site, section#mast, div#two_col, footer.site {
			padding: 0 10px;
		}
	
	}

/***************************************************/
/*						Smaller then 920	 	   */
/***************************************************/
	@media screen and (max-width: 920px) {
		.coda-slider,
		.coda-slider .panel { height: auto; }
		h1 { margin-top: 30px; }
		header.site nav#primary {
			position: absolute;
			background: #333;
			overflow:hidden;
			margin-top: 0px;
			top: 0;
			left: 0;
			right: 0;
			margin: 0 auto;
			width: 100%;
			text-align: center;
		}
		nav#primary ul {
			float: none;
			display:block;
		}
		header.site nav#primary ul li {
			font-size: 17px;
			display: block;
			float: left;
			width: 16.6%;
		}
		header.site nav#primary ul li a {
			display: block;
			float: left;
			padding: 0;
			margin-left: 0px;
			bordeR:none;
			width: 100%;
		}
		header.site nav#primary ul li:first-child a { margin: 0; }
		header.site nav#primary ul li a:hover { background: #D60640; }
		.coda-slider .panel h2 {
		    font-size: 45px;
		    line-height:1;
		    margin: 0px 0 0 5%;
		    width: 35%;
		}
		.coda-slider .panel-container > .panel:first-child { width: 100%; }
		.coda-slider .panel-container > .panel:first-child h2 { width: 100%; }
		#projects article a span { font-size: 14px; }
		#home #blog article h2 { font-size: 25px; }
		#blog article p strong,
		#home #blog article h2 + p { font-size: 12px; }	
		#blog article p > strong { margin-left: 5px; }
		#blog article p strong:first-child { margin-left: 0; }
		
	}
	
/***************************************************/
/*						Smaller then 845	 	   */
/***************************************************/
	@media screen and (max-width: 845px) {
		#work .coda-slider .panel { min-height: 0px !important; }
		.coda-slider .panel h3 { font-size: 31px; }
		#comment-form fieldset input[type="submit"],
		#comment-form fieldset input[type="submit"]:hover,
		#comment-form fieldset input[type="submit"]:focus {
			font-size: 17px;
			padding: 10px 25px;
		}
		
	}
	
/***************************************************/
/*						Smaller then 768	 	   */
/***************************************************/
	@media screen and (max-width: 768px) {
		
		#comment-form fieldset input[type="submit"],
		#comment-form fieldset input[type="submit"]:hover,
		#comment-form fieldset input[type="submit"]:focus {
			font-size: 17px;
			padding: 10px 25px;
			display: block;
			margin: 10px 0;
		}
		#social_links ul li {
			display: block;
			float: none;
			margin-bottom: 10px;
		}
		.coda-slider .panel h3 { font-size: 30px; }
		.coda-slider .panel p { font-size: 18px; }
		
		.btn nyroModal, #contact_head .btn {
		display: none;
		}
	}
	
	
	
/***************************************************/
/*						Smaller then 650	 	   */
/***************************************************/
	@media screen and (max-width: 650px) {
		
		header.site { padding: 0; }
		header.site h1 {
			width: 220px;
			margin: 0 auto;
		}
		header.site h1 a { margin-top: 120px; }
		nav#utility,
		form#search {
			top: 40px;
			position: absolute;
			left: 10px;
		}
		form#search { right: 0; }
		form#search fieldset {
			width: 90%;
			display: block;
			margin: 0 auto;
		}		
		hgroup.site { padding-bottom: 0px; }
		hgroup.site h2 {
			font-size: 3em;
			margin-top: 0px;
			margin-bottom: 20px;
			text-align:center;
			line-height: 1;
		}
		#mast h3 { padding-bottom: 30px; }
		#mast a.btn { display:none; }
		.content { padding-top:10px; }
		.content .wrap { padding: 0 10px; }
		#work .coda-slider-wrapper { padding: 0; }
		.content h3 {
			padding: 0px;
			font-size: 18px;
		}
		#company .left,
		aside.right {
			float: none;
			width: 100%;
		}
		.content hgroup { margin-bottom: 5px; }
		#company ul li { width: 24%; }
		footer.site.wrap { padding: 0 20px; }
		footer.site > div { width: 49%; }
		#social_links { 
			width: 100%;
			float: none;
		}
		#social_links ul li {
			display:block;
			padding-top: 10px;
		}
		#social_links ul li:first-child { padding-top: 0;}
		#social_links ul li.email a {
			width: 116px;
			margin: 0 auto;
		}
		#social_links ul li.rss a {
			width: 84px;
			margin: 0 auto;
		}
		#social_links ul li.facebook a {
			width: 90px;
			margin: 0 auto;
		}
		#social_links input[type="text"] {
			width: 66%;
			padding: 5px 2% 5px;
		}
		#social_links input[type="submit"] { width: 29%; }
		.copyright { text-align: center; }
		.nyroModalCont > div > div {
			float: none;
			width: 100%;
		}
		.nyroModalLink, .nyroModalDom, .nyroModalForm, .nyroModalFormFile {  padding-right: 0; }
		.nyroModalCont { margin: 5px; }
		.nyroModalCont > div img {
			width: 110px;
			float: right;
			border: 2px #D60640 solid;
			margin: 0 5px 10px 10px;
			padding: 0;
		}
		.nyroModalTitle {display:none;}
			
		#service_entry ul,
		#services nav ul {
			margin: 0;
			width: 217px;
			height: 217px;
			background: url(../images/template/nav-service_sm.png) no-repeat;
		}
		#services nav {
			width: 217px;
			margin: 0 auto;
		}
		
		#services { background: #fff url(../images/template/bg-cloud_blk.gif) no-repeat center -100px; }	
		#service_entry { position: relative; }
		#service_entry nav {
			width: 217px;
			margin: 0 auto 20px;
			position: relative;
			top: auto;
			right: auto;
		}

		#service_entry nav ul li,
		#services nav ul li {
			margin: 0;
			padding: 0;
			list-style:none;
		}
		#service_entry nav ul li a,
		#services nav ul li a {
			padding: 0;
			margin: 0;
			text-transform: uppercase;
			color: #fff;
			text-align: center;
			text-decoration: none;
			font-size: 40px;
			font-weight: 700;
			
			/* Turn it off so we can fade it in */
			opacity: 0;
			filter: alpha(opacity=0);
			-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
			
			/* CSS3 Transitions */
			-webkit-transition-property: opacity;  
			-webkit-transition-duration: 0.2s, 0.2s;  
			-webkit-transition-timing-function: linear, ease-in;  
			
			-moz-transition-property: opacity;  
			-moz-transition-duration: 0.2s, 0.2s;  
			-moz-transition-timing-function: linear, ease-in;  
			
			-o-transition-property: opacity;  
			-o-transition-duration: 0.2s, 0.2s;  
			-o-transition-timing-function: linear, ease-in;  
			
			transition-property: opacity;	  
			transition-duration: 0.2s, 0.2s;  
			transition-timing-function: linear, ease-in;
		}	
		/* Hover, fade in baby */
		#service_entry nav ul li.current a,
		#service_entry nav ul li a:hover,
		#services nav ul li a:hover { 
			opacity: 1; 
			filter: alpha(opacity=100);
			-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
		}
		/* Hide the text*/
		#service_entry nav ul li a span,
		#services nav ul li a span {
			display: block;
			float: left;
			text-indent: -999em;
		}
	
	/* wheel part placement*/
		#service_entry nav ul li.top_wheel a,
		#services nav ul li.top_wheel a {
			float: right;
			position:relative;
			left:-31px;

			z-index:10;
			width: 156px;
			height: 56px;
			background: url(../images/template/service-plan_sm.png) top center no-repeat;
		}
		#service_entry nav ul li.right_wheel a,
		#services nav ul li.right_wheel a {
			float: right;
			position:relative;
			top:-25px;
			left: 0px;
			width: 56px;
			height: 154px;
			background: url(../images/template/service-design_sm.png) top center no-repeat;
		}
		#service_entry nav ul li.bottom_wheel a,
		#services nav ul li.bottom_wheel a {
			clear: both;
			float: left;
			padding-top: 20px;
			position:relative;
			top: -49px;
			left: 30px;
			width: 156px;
			height: 56px;
			background: url(../images/template/service-code_sm.png) top center no-repeat;
		}
		#service_entry nav ul li.left_wheel a,
		#services nav ul li.left_wheel a {
			float: left;
			position:relative;
			top: 31px;
			left: -1px;
			width: 56px;
			height: 154px;
			background: url(../images/template/service-promote_sm.png) top center no-repeat;
		}

		#service_entry nav ul li.top_wheel.current a { background: url(../images/template/service-plan_cur.png) top center no-repeat; }

		#service_entry nav ul li.right_wheel.current a { background: url(../images/template/service-design_cur.png) top center no-repeat; }

		#service_entry nav ul li.bottom_wheel.current a { background: url(../images/template/service-code_cur.png) top center no-repeat; }
		
		#service_entry nav ul li.left_wheel a {

		}
		#service_entry nav ul li.left_wheel.current a { background: url(../images/template/service-promote_cur.png) top center no-repeat; }
	
		#plan .wrap,
		#design .wrap,
		#code .wrap,
		#promote .wrap { background: none; }
		
		#plan .wrap,
		#code .wrap { min-height: 0; height: auto; }
		
		#experience, #copy, #testing, #strategy, #brand, #social, #email_marketing,  #social_media, #advertising, #search_engine, #social_media, #web_mobile, #iphone, #cms {
			padding: 10px 0 10px;
			margin: 0;
			position: relative;
			width: auto;
			top: auto;
			right: auto;
			left: auto;
			bottom: auto;
		}
		header.site + .coda-slider-wrapper { display: none; }
		#mast  {padding: 0 20px;}
		#two_col > div:first-child, #two_col > div {
			float: left;
			width: 100%;
			clear:both;
			display: block;
		}
		#two_col > div + div { margin-top: 20px; }
		#projects-list article a span { font-size: 13px;}
		#projects-list article {
			width: 49%;
			margin: 0.5%;
		}
		#work #details {
			float: none;
			width: 100%;
			margin-top: 10px;
		}
		#gallery {
			float: none;
			width: 100%;
		}
		#work #team-list li img { width:50%; }
		#work ul li {
			width: 33.33%;
		}
		#work ul li > div  {
			height: 155px;
		}
		#home #blog article h2 {
		    font-size: 24px;
		    margin: 0 0 5px;
		}
		.m_break {
			display:block; 
			margin-left: -7px;
		}
		#home #blog article {padding-bottom: 0;}
		#tools .wrap > div article {
			display:block;
			width: 100%;
			border-bottom: 1px #ccc solid;
			padding: 20px 0;
		}
		#tools h2, #tools p { width: 100%; }
		#tools .wrap > div article p { margin-bottom: 0px; }
		#tools .wrap > div article img {
			width: 100px !important;
			height: 70px !important;
			margin-right: 10px;
			float: left;
		}
		#blog .wrap > div:first-child  { width: 100%; }
		#blog .wrap, #blog .wrap > div {
			margin: 0;
			padding: 0;
			width: 100%;
			float: none;
		}
		#blog .right { display: none; }
		#contact .wrap { padding: 20px 10px}
		
	
		
		#contact .wrap div, #contact .wrap h3 {
			float: none;
			width: 100%;
			padding: 0;
			margin-bottom: 10px;
			text-align:center;
		}
		#contact .wrap > div {margin-top: 15px;}
		#contact .wrap > div p { 
			width: 49%; 
			font-size: 16px;
		}
		#contact .wrap > div p span { font-size: 24px }
		#contact input[type="submit"] {
			width: 170px;
			margin: 30px auto 0;
		}
		
		#work #details div.links + h3,
		#team-list { display: none; }
		#testimonial { width: 100%; }
		#gallery { width: 98%; }
		
		hgroup.site h2.alt {
			font-size: 25px;
		}
		hgroup.site h2.alt span {
			font-size: 40px;
		}

	}	
	
/***************************************************/
/*						Smaller then 550	 	   */
/***************************************************/
	@media screen and (max-width: 550px) {
		form#search,
		nav#utility {
			top: 50px;
		}
		header.site nav#primary ul {
			width: 320px;
			margin: 0 auto;

			overflow:hidden;
		}
		header.site nav#primary ul li {
			font-size: 17px;
			display: block;
			float: left;
			width: 33%;
			text-align: left;

		}
		header.site nav#primary ul li a {
			display: block;
			float: none;
			padding: 10px;
			margin-left: 0px;
			bordeR:none;
			width: auto;
			text-align:center;
		}
		
	}
	
/***************************************************/
/*						Smaller then 480	 	   */
/***************************************************/
	@media screen and (max-width: 480px) {
		
		#search_section article p img, #blog article p img {
			max-width: 100% !important;
			height: auto !important;
		}
		
		#contact input[type="text"], 
		#contact textarea  {
			width: 80%;
		}
		#comment-form fieldset + fieldset,
		#comment-form fieldset { 
			width: 100%;
			float: none;
		}
		#comment-form fieldset input[type="submit"],
		#comment-form fieldset input[type="submit"]:hover,
		#comment-form fieldset input[type="submit"]:focus {
			font-size: 20px;
			text-transform: uppercase;
			text-align: center;
			text-decoration: none;
			margin: 20px auto 30px;
			display:inline-block;
		}
		#work ul {
			padding-left: 10%;
		}
		#work ul li {
			width: 50%;
			margin-bottom: 10px;
		}
		#search_section article h3, #blog article h2 {
   			font-size: 30px;
   		}
   		hgroup.site h2.alt {
			font-size: 20px;
		}
		hgroup.site h2.alt span {
			font-size: 30px;
		}
		
		.nyroModalCont {
			margin-top: 200px !important;
			width: 90%  !important;
			height:auto  !important;
			overflow: scroll  !important;
		}
		
		.nyroModalCloseButton {
			position: absolute;
			top:-10px;
		}
	}