@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800);
@import url(http://fonts.googleapis.com/css?family=Montserrat:400,700);


/* UTILITY STYLES */
.text-red			{ color: #E81D25; }
.text-gray			{ color: #969696; }
.text-light-gray	{ color: #C0C0C0; }
.text-black			{ color: #202020; }
.text-white			{ color: #FFFFFF; }

.bg-red				{ background-color: #E81D25; }
.bg-gray			{ background-color: #969696; }
.bg-light-gray		{ background-color: #C0C0C0; }
.bg-black			{ background-color: #202020; }
.bg-white			{ background-color: #FFFFFF; }



	* { font-family: "Open Sans", "Segoe UI", Helvetica, sans-serif; font-size: 14px; margin: 0; padding: 0; color: #202020; }
	div { border: solid 0px #202020; }
	
	a { color: #E81D25; text-decoration: none; }
	a:hover { color: #E81D25; text-decoration: underline; }
	a:active { color: #E81D25; text-decoration: underline; }
	a:visited, .current, a.nav-button:hover { color: #E81D25; text-decoration: underline; }
	
	.btn, .btn:visited {
		-webkit-background-clip: border-box;
		-webkit-background-origin: padding-box;
		-webkit-background-size: auto;
		-webkit-box-shadow: rgba(0, 0, 0, 0.2) 0px -6px 0px 0px inset;
		-webkit-font-smoothing: antialiased;
		-webkit-transition-delay: 0s;
		-webkit-transition-duration: 0.3s;
		-webkit-transition-property: all;
		-webkit-transition-timing-function: ease;
		background-attachment: scroll;
		background-clip: border-box;
		background-color: #C0C0C0;
		background-image: none;
		background-origin: padding-box;
		background-size: auto;
		border-bottom-color: rgb(255, 255, 255);
		border-bottom-left-radius: 4px;
		border-bottom-right-radius: 4px;
		border-bottom-style: none;
		border-bottom-width: 0px;
		border-image-outset: 0px;
		border-image-repeat: stretch;
		border-image-slice: 100%;
		border-image-source: none;
		border-image-width: 1;
		border-left-color: rgb(255, 255, 255);
		border-left-style: none;
		border-left-width: 0px;
		border-right-color: rgb(255, 255, 255);
		border-right-style: none;
		border-right-width: 0px;
		border-top-color: rgb(255, 255, 255);
		border-top-left-radius: 4px;
		border-top-right-radius: 4px;
		border-top-style: none;
		border-top-width: 0px;
		box-shadow: rgba(0, 0, 0, 0.2) 0px -6px 0px 0px inset;
		color: rgb(255, 255, 255);
		display: inline-block;
		font-family: "Montserrat";
		font-size: 16px;
		font-style: normal;
		font-variant: normal;
		font-weight: 600;
		line-height: 19.2000007629395px;
		padding: 12px;
		text-align: center;
		text-decoration: none;
		transition-delay: 0s;
		transition-duration: 0.3s;
		transition-property: all;
		transition-timing-function: ease;
		vertical-align: middle;
	}
	.btn.btn-default, .btn.btn-default:visited {
		background: #C0C0C0;
		color: rgb(0,102,153);
		font-weight: 600;
		-webkit-box-shadow: inset 0px -6px 0px 0px rgba(0,0,0,0.2);
		-moz-box-shadow: inset 0px -6px 0px 0px rgba(0,0,0,0.2);
		box-shadow: inset 0px -6px 0px 0px rgba(0,0,0,0.2);
	}
	.btn.btn-default:hover, .btn.btn-default:active {
		background: #969696;
		color: rgb(0,68,124);
		font-weight: 600;
		-webkit-box-shadow: inset 0px 6px 0px 0px rgba(0,0,0,0.2);
		-moz-box-shadow: inset 0px 6px 0px 0px rgba(0,0,0,0.2);
		box-shadow: inset 0px 6px 0px 0px rgba(0,0,0,0.2);
	}
	.btn:hover, .btn:active {
		background: #C0C0C0;
		text-decoration: none;
		-webkit-box-shadow: inset 0px 6px 0px 0px rgba(0,0,0,0.2);
		-moz-box-shadow: inset 0px 6px 0px 0px rgba(0,0,0,0.2);
		box-shadow: inset 0px 6px 0px 0px rgba(0,0,0,0.2);
	}
	.btn.btn-primary, .btn.btn-primary:visited {
		background: #E81D25;
		font-weight: 600;
	}
	.btn.btn-primary:hover, .btn.btn-primary:active {
		background: #9f3429;
		font-weight: 600;
	}
	.btn.btn-lg, .btn.btn-lg:visited, .btn.btn-lg:active {
		font-size: large;
	}
	
	
	a.tile { display:block; position: relative; width:100%; height: 100%; box-shadow: 0px -40px 80px rgba(0,0,0,.5) inset; }
	a.tile:hover { box-shadow: 0px 0px 200px rgba(0,0,0,1) inset; color: #FFFFFF; }
	a.tile:active { top: 4px; left: 2px; }
	a.tile span.tileText { position: absolute; bottom: 10px; right: 10px; font-weight: 300; font-size: 30px; color: #FFFFFF; }

	address { font-style: inherit; }
	
	div#container { width: 100%; }
	div.blockContent { width: 480px; min-height: 480px; margin: auto; padding-top: 100px; padding-bottom: 100px; padding-left: 20px; padding-right: 20px; }
		
	div#header { width: 100%; min-height: 480px; margin: auto; background: #202020 url('../images/stone-bg.jpg') fixed top center no-repeat; color: #C0C0C0; }

	div#nav { display: none; }
	div#nav { width: 100px; min-height: 2000px; padding: 10px; position: fixed; top: 0px; left: 100px; text-align: right; background: #202020 url('../images/blade-bg.jpg') 0px 0px no-repeat; box-shadow: 0px 0px 10px rgba(0,0,0,0.5); z-index: 999;}
	
	div#services { width: 100%; background: #EEEEEE url('../images/paper-bg.jpg') fixed top right no-repeat; box-shadow: 0px -1px 10px rgba(0,0,0,0.5); }
	
	div#case-studies { width: 100%; background: #696969 url('../images/hamon-bg.jpg') fixed top center no-repeat; color: #FFFFFF; box-shadow: 0px -1px 10px rgba(0,0,0,0.5); }
	div#case-studies div.blockContent { min-height: 860px; }

	div#examples { width: 100%; background: #202020 url('../images/stone-bg.jpg') fixed bottom center no-repeat; color: #FFFFFF; box-shadow: 0px -1px 10px rgba(0,0,0,0.5); }
	div#examples div.blockContent { min-height: 860px; }

	div#about { width: 100%; background: #FFFFFF url('../images/snow-bg.jpg') fixed top center no-repeat; color: #202020; box-shadow: 0px -1px 10px rgba(0,0,0,0.5); }
	div#about div.blockContent { min-height: 960px; }
	
	div#contact { width: 100%; background: #EA1520 url('../images/watercolor-bg.jpg') fixed top center no-repeat; color: #FFFFFF; box-shadow: 0px -1px 10px rgba(0,0,0,0.5); }

	div.error {
		background: #FFFFFF;
		border: 1px solid #EA1520;
		padding: 10px;
		box-shadow: 1px 1px 5px rgba(0,0,0,0.5);
	}
	
	em {
		font-weight: 700;
		font-style: normal;
	}

	form#contactform {
		background: #FFFFFF url('../images/paper-bg.jpg') top left no-repeat;
		margin: 0px;
		padding: 20px;
		box-shadow: 2px 2px 10px rgba(0,0,0,0.5);
		min-height: 500px;
	}

	form#contactform fieldset {
		border: 0px;
		margin: 0px;
		padding: 0px;
	}

	form#contactform span {
		display: block;
		float: right;
	}
	
	form#contactform label {
		display: block;
		margin-top: 10px;
		font-weight: 700;
	}

	form#contactform p {
		display: block;
		margin-bottom: 40px;
	}

	form#contactform label.radio {
		display: inline;
		margin: 0;
		padding-left: 5px;
		padding-right: 10px;
		font-weight: 400;
	}
	
	form#contactform button {
		width: 100px;
		height: 24px;
		border: 0;
		background-color: #202020;
		color: #FFFFFF;
	}
	
	form#contactform button:hover {
		background-color: #EA1520;
	}
	
	form#contactform button:active {
		background-color: #00000;
	}

	form#contactform #message {
		margin-top: 200px;
	}
	
	form#contactform textarea {
		width: 100%;
		height: 80px;
	}
	
	
	h1 { font-weight: 300; font-size: 30px; clear: both; }
	h1#title {
		font-family: "Montserrat";
		font-size: 45px;
		color: #606060;
		text-align: center;
		text-transform: uppercase;
		font-weight: 700;
		margin: 0px;
		padding: 0px;
		margin-top: 100px;
		letter-spacing: 12px;
		line-height: 50px;
	}
	h2#subtitle {
		font-family: "Montserrat";
		font-size: 85px;
		color: #EA1520;
		text-align: center;
		text-transform: uppercase;
		font-weight: 400;
		margin: 0px;
		padding: 0px;
		margin-top: 0px;
		margin-bottom: 50px;
		letter-spacing: 5px;
		line-height: 90px;
	}
	
	h2 {
		font-family: "Montserrat";
		text-transform: uppercase;
		font-size: 50px;
		color: #202020;
		font-weight: 300;
		line-height: 40px;
		margin-top: 40px;
		margin-bottom: 16px;
		clear: both;
	}
	div#case-studies h2, div#examples h2 { font-size: 50px; color: #C0C0C0; font-weight: 300;}
	h3 { font-weight: 400; font-size: 20px; margin-top: 20px; clear: both; }
	
	img#logoImage { height: 140px; }
	
	li { margin: 0; padding: 0; list-style: none; }
	
	p#description {
		font-size: 16px;
		color: #C0C0C0;
		text-align: center;
		font-weight: 300;
		margin: 0px;
		padding: 0px;
		margin-top: 80px;
	}

	p#status {
		font-size: 16px;
		color: #C0C0C0;
		text-align: center;
		font-weight: 300;
		margin: 0px;
		padding: 0px;
		margin-top: 20px;
	}


	/* overlay style */

	.simple_overlay {
		/* must be initially hidden */
		display:none;
		
		/* place overlay on top of other elements */
		z-index:10000;
		
		/* styling */
		background-color:#333;
		
		width:1000px;
		height:500px;
		border:1px solid #666;
		
		/* CSS3 styling for latest browsers */
		-moz-box-shadow:0 0 90px 5px #000;
		-webkit-box-shadow: 0 0 90px #000;
	}
	
	/* close button positioned on upper right corner */
	.simple_overlay .close {
		background-image: url(/images/overlay/close.png);
		position: absolute;
		right: 10px;
		top: 10px;
		cursor: pointer;
		height: 35px;
		width: 35px;
		z-index:10010;
	}

	div#case-studies .caption, div#case-studies .caption { background-color: rgba(0,0,0,.8)}
	
	div#case-studies .caption_link, div#case-studies .caption_link { margin-left: 20px; color: #EA1520;}
	
	/* end overlay style */
	

	.slides_container {
		width:1000px;
		height:500px;
	}

	.slides_container div {
		width:1000px;
		height:500px;
		display:block;
	}

 	.slides_container img {
		margin-left: auto;
		margin-right: auto;
	}
   
	.slides_container div .caption {
		z-index:500;
		position:absolute;
		bottom:-35px;
		left:0;
		height:30px;
		padding:5px 20px 0 20px;
		background:#000;
		background:rgba(0,0,0,.5);
		width:1000px;
		font-size:1.3em;
		line-height:1.33;
		color:#FFFFFF;
		border-top:1px solid #000;
		text-shadow:none;
	}

	.slides_container div .caption p {
		color:#FFFFFF;		
	}

	.carousel a.next,.carousel a.prev {
		position:absolute;
		top:250px;
		left:10px;
		width:24px;
		height:43px;
		display:block;
		z-index:999999;
	}
	
	.carousel a.next {
		left:970px;
	}


	ul { padding: 0px; margin: 0px; }
	ul.nav_menu li { margin-top: 10px; margin-bottom: 10px; }
	ul.examples, ul.case-studies { margin: 0px; padding: 0px; }
	ul.examples li, ul.case-studies li { display: block; float: left; width: 230px; height: 230px;  margin-right: 10px; margin-bottom: 10px; padding: 0px; text-align: right; font-weight: 300; font-size: 50px; }
	ul.case-studies li a.tile { background-color: #FFFFFF; }
	ul.case-studies li a.tile#chase { background: url('/images/case-studies/chase/tile.png') top left no-repeat; }
	ul.case-studies li a.tile#cnnmoney { background: url('/images/case-studies/cnnmoney/tile.png') top left no-repeat; }
	ul.case-studies li a.tile#ie6countdown { background: url('/images/case-studies/ie6countdown/tile.png') top left no-repeat; }
	ul.case-studies li a.tile#officeformac { background: url('/images/case-studies/officeformac/tile.png') top left no-repeat; }
	ul.case-studies li a.tile#pella { background: url('/images/case-studies/pella/tile.png') top left no-repeat; }
	ul.case-studies li a.tile#visualstudio { background: url('/images/case-studies/visualstudio/tile.png') top left no-repeat; }
	ul.examples li a.tile { background-color: #696969; }
	ul.examples li a.tile#strategybrief { background: url('/images/examples/strategybrief/tile.png') top left no-repeat; }
	ul.services { width: 50%; }