/*
  960 Grid System ~ Core CSS.
  Learn more ~ http://960.gs/

  Licensed under GPL and MIT.
*/

/*
  Forces backgrounds to span full width,
  even if there is horizontal scrolling.
  Increase this if your layout is wider.

  Note: IE6 works fine without this fix.
*/

/* Mobile only style */
/*@media (max-width: 999px) {

	.container_24 {
		width:440px;
	}

.container_24{
  max-width: 440px;
  min-width: 320px;
  margin: 0 auto;
  padding:0 0 0 3%;
}

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
  margin-left: 10px;
  margin-right: 10px;
	  display: inline;
  float: left;
}
.alpha, .omega {
  margin-left: 0;
  margin-right: 0;
}
.align_center, .align_right {
  text-align: left;
}

}*/

/* `Grid >> 24 Columns
----------------------------------------------------------------------------------------------------*/

.container_24 .grid_1 {
  width: 30px;
}

.container_24 .grid_2 {
  width: 70px;
}

.container_24 .grid_3 {
  width: 110px;
}

.container_24 .grid_4 {
  width: 150px;
}

.container_24 .grid_5 {
  width: 190px;
}

.container_24 .grid_6 {
  width: 230px;
}

.container_24 .grid_7 {
  width: 270px;
}

.container_24 .grid_8 {
  width: 310px;
}

.container_24 .grid_9 {
  width: 350px;
}

.container_24 .grid_10 {
  width: 390px;
}

.container_24 .grid_11 {
  width: 430px;
}

.container_24 .grid_12 {
  width: 470px;
}

.container_24 .grid_13 {
  width: 510px;
}

.container_24 .grid_14 {
  width: 550px;
}

.container_24 .grid_15 {
  width: 590px;
}

.container_24 .grid_16 {
  width: 630px;
}

.container_24 .grid_17 {
  width: 670px;
}

.container_24 .grid_18 {
  width: 710px;
}

.container_24 .grid_19 {
  width: 750px;
}

.container_24 .grid_20 {
  width: 790px;
}

.container_24 .grid_21 {
  width: 830px;
}

.container_24 .grid_22 {
  width: 870px;
}

.container_24 .grid_23 {
  width: 910px;
}

.container_24 .grid_24 {
  width: 950px;
}

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */

.clearfix:before,
.clearfix:after,
.container_24:before,
.container_24:after {
  content: '.';
  display: block;
  overflow: hidden;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
  width: 0;
  height: 0;
}

.clearfix:after,
.container_24:after {
  clear: both;
}

/*
  The following zoom:1 rule is specifically for IE6 + IE7.
  Move to separate stylesheet if invalid CSS is a problem.
*/

.clearfix,
.container_24 {
  zoom: 1;
}



/* HTML5 Boilerplate  */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: sans-serif; color: #222; }
body { margin: 0; font-size: 1em; line-height: 1.4; }


img { border: 0; -ms-interpolation-mode: bicubic; }


table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }

.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }




/* FONTS */
@font-face {
    font-family: 'PermanentMarker';
    src: url('/fonts/PermanentMarker-webfont.eot');
    src: url('/fonts/PermanentMarker-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/PermanentMarker-webfont.woff') format('woff'),
         url('/fonts/PermanentMarker-webfont.ttf') format('truetype'),
         url('/fonts/PermanentMarker-webfont.svg#PermanentMarkerRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'Oswald';
    src: url('/fonts/Oswald-Light-webfont.eot');
    src: url('/fonts/Oswald-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/Oswald-Light-webfont.woff') format('woff'),
         url('/fonts/Oswald-Light-webfont.ttf') format('truetype'),
         url('/fonts/Oswald-Light-webfont.svg#OswaldLight') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'CabinSketch';
    src: url('/fonts/CabinSketch-Regular-webfont.eot');
    src: url('/fonts/CabinSketch-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/CabinSketch-Regular-webfont.woff') format('woff'),
         url('/fonts/CabinSketch-Regular-webfont.ttf') format('truetype'),
         url('/fonts/CabinSketch-Regular-webfont.svg#CabinSketchRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'CabinSketchBold';
    src: url('/fonts/CabinSketch-Bold-webfont.eot');
    src: url('/fonts/CabinSketch-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/CabinSketch-Bold-webfont.woff') format('woff'),
         url('/fonts/CabinSketch-Bold-webfont.ttf') format('truetype'),
         url('/fonts/CabinSketch-Bold-webfont.svg#CabinSketchBold') format('svg');
    font-weight: normal;
    font-style: normal;

}





body {
	font-family:"Oswald", "Lucida Grande", Helvetica, Arial, sans-serif;
	font-size:18px;
	line-height:28px;
	color:#fff;
	background:url('/images/bg-repeat.png') repeat #29ABE2 ;
	  -webkit-text-size-adjust: none;	  /* Prevent font scaling in landscape */
}

/*@media (max-width: 999px) {

	.container_24 > * {
		max-width:97%;
	}

}*/

a, a:visited {text-decoration:none;color:#fff; } /* white */
a:hover, a:active {color:#BFEBF7;} /* light blue */


a.button, a.button:visited {
	color:#29ABE2;
	font-size:19px;
	font-family:"PermanentMarker", "Lucida Grande", Helvetica, Arial, sans-serif;
	text-transform:uppercase;
	font-weight:300;
	line-height:36px;
	margin:0 0 20px;
	height:44px;
	padding:0 10px;
	width:205px;
	display:block;
	background:url(/images/button.png) no-repeat top center;
}
a.button:hover, a.button:active {
	color:#29ABE2;
	background-position:bottom center;
}
	
h1 {
	font-family:"CabinSketchBold", "Lucida Grande", Helvetica, Arial, sans-serif;
	font-size:100px;
	font-weight:300;
	line-height:100px;
	margin:20px 0 0;
	letter-spacing:-3px;
}

h2 {
	font-family:"CabinSketch", "Lucida Grande", Helvetica, Arial, sans-serif;
	font-size:40px;
	font-weight:300;
	letter-spacing:1px;
	text-transform:uppercase;
	font-weight:300;
	line-height:40px;
	margin:0;
	
}
h3 {
	font-size:40px;
	font-family:"CabinSketchBold", "Lucida Grande", Helvetica, Arial, sans-serif;
	text-transform:uppercase;
	font-weight:300;
	line-height:40px;
	margin:0 0 20px;

}

h4 {
	font-size:20px;
	font-family:"PermanentMarker", "Lucida Grande", Helvetica, Arial, sans-serif;
	text-transform:uppercase;
	font-weight:300;
	line-height:20px;
	margin:0 0 20px;
	
}

header {	
	margin-top:20px;
	background:url(/images/header-bg.png) no-repeat 480px 140px;
	
}

header h4 {
	font-size:40px;
	line-height:40px;
	margin:40px 0 0;

}
header p {
	font-size:18px;
    line-height: 26px;
	margin:0 0 40px;
	font-family:"PermanentMarker", "Lucida Grande", Helvetica, Arial, sans-serif;
	font-weight:300;
}

header img {
	float:right;
}

header ul {
	margin:20px 0 20px;
	padding:0;
}

header ul li {
	list-style-type:none;
	font-size:26px;
	font-family:"CabinSketch", "Lucida Grande", Helvetica, Arial, sans-serif;
	text-transform:uppercase;
	font-weight:300;
	text-align:right;
	
}

#headshot img {
	margin-top:20px;
}
/*@media (max-width: 999px) {
	header {
		background-position:0 130px;
	}
	header h1 {
		font-size:80px;
		line-height:80px;
	}
	
	header ul {
		display:block;
	}
	header ul li {
		float:left;
		display:inline;
		margin-right:20px;
		font-size:24px;
		text-align:center;
	}
	header h4 {
		margin-top:80px;
	}
	header p {
	}
	h3 {
		padding-left:33px;
	}
	aside {
		width:100% !important;
	}	
	#headshot img {
		float:none;
		margin-top:40px;
	}
}*/
.hr {
	background:url('/images/hr.png') no-repeat bottom center;
	padding-bottom:40px;
	margin-bottom:40px;
}


article {
	background:url('/images/article-bg.png') no-repeat 8px 0px;	
    padding: 20px 40px;
    width: 370px;
	
}

article img {
	margin:6px 0px 15px;
	text-align:center;
}

	
/* FOOTER STYLES */
footer p {
	text-align:center;
	padding-bottom:40px;
}
