@charset "UTF-8";

/* Simple fluid media

   Note: Fluid media requires that you remove the media's height and width attributes from the HTML

   http://www.alistapart.com/articles/fluid-images/ 

*/

img, object, embed, video {

	max-width: 100%;

}



/* IE 6 does not support max-width so default to width 100% */

.ie6 img {

	width:100%;

}

input::-moz-focus-inner { 

  border: 0; 

}

a:focus, input, textarea, h3 {

	outline-style: none;

	border: 0;	

}

/*

	Dreamweaver Fluid Grid Properties

	----------------------------------

	dw-num-cols-mobile:		4;

	dw-num-cols-tablet:		8;

	dw-num-cols-desktop:	12;

	dw-gutter-percentage:	25;

	

	Inspiration from "Responsive Web Design" by Ethan Marcotte 

	http://www.alistapart.com/articles/responsive-web-design

	

	and Golden Grid System by Joni Korpi

	http://goldengridsystem.com/

*/

* {

  margin: 0;

}

html, body {

  height: 100%;

}

body {

	font-family: "ff-meta-serif-web-pro",sans-serif;

	font-size: 100%;	

}

a {

	outline: 0;	

}

.fluid {

	clear: both;

	margin-left: 0;

	width: 100%;

	float: left;

	display: block;

}



.fluidList {

    list-style:none;

    list-style-image:none;

    margin:0;

    padding:0;        

}

ins {

	text-decoration: none;

}

del {

	text-decoration: line-through;

}



table {

	border-collapse: collapse;

	border-spacing: 0;

}

header {

	width: auto;

	margin: 0;

	border-top: solid 15px #333;

	border-bottom: dotted 1px #333;

}

ul {

	list-style: none;	

	margin: 0 0 10px;

	padding: 0;

	text-indent: 0.75em;

}



#page_wrap {

	margin: 0;

	padding: 0;

}

#title {

	width: 90%;

	margin: 0 auto;

	padding: 0;

}



#title h1{

	width: auto;

	text-transform: none;

	margin: 25px 0em 15px 0em;

	font-size: 1.4em;

	color: #999;

	text-align: center;

	margin: 0;

	padding: 10px 0;

}

#main_content {

	max-width: auto;

	margin: 2em auto 0em auto;

}



#left_content {

	float: none;

	width: auto;

	margin: 0;

	padding: 0;

	

}

#right_content {

	width: auto;

	float: none;	

}



aside {

	width: auto;

	margin: 0em 0.5em 0em 1em;

	padding: 10px 0px 20px 20px;

}

aside h2 {

	font-family: "ff-meta-web-pro",sans-serif;

	font-size: 1em;

	font-weight: bold;

	font-style: italic;

	margin: 0.75em 0em 1em 0em;

	margin: 15px 0 8px;





}

aside ul {

	font-size: 0.75em;

	color: #999;

	margin: 0;

}

aside li {

	line-height: 1.5em;

}

.content, .content_recent, .lastcontent {

	margin: 0;

	padding: 20px;

	border-bottom: solid 1px #999;	

}

.content_hp {

	margin: 10px auto 40px;

}

.content_hp h1 {

	font-family: "ff-meta-web-pro",sans-serif;

	font-size: 1em;

	font-weight: bold;

	font-style: italic;

	padding: 10px 0 10px;

}

.content_hp p{

	padding: 0 2%;

	font-size: 0.9em;

	line-height: 1.5em;	

}

.content_block{

	width: auto;

	margin: 0;

	padding: 0px 0px 10px 0px;

}

.content_block img {

	border: 1px solid #999;	

}

.content_block h2 {

	font-family: "ff-meta-web-pro",sans-serif;

	font-size: 1.2em;

	font-weight: bold;

	font-style: italic;

	margin: 1.2em 0em 1em 0em;

}

.entry h1 {

	font-size: 1.2em;

	margin-top: 20px;

}

.entry em {

	font-size: 0.75em;

}

.content_block b {

	font-weight: bold;	

}

.arrow_red {

	background: url(../images/arrow_red.png) no-repeat;

}

.arrow_grey {

	background: url(../images/arrow_gray.png) no-repeat;

}

.bwWrapper {

    position: relative;

    display: block;

}



h1 {

	font-family: "ff-meta-web-pro",sans-serif;

	font-weight: bold;

	font-size: 2em;

}

h3 {

	font-family: "ff-meta-web-pro",sans-serif;

	border-bottom: 1px dotted #666;	

	margin: 5px 0 0;

}

h4 {

	font-family: "ff-meta-web-pro",sans-serif;

	font-weight: bold;

	font-size: 0.75em;

	text-transform: uppercase;

	letter-spacing: 0.05em;

	margin: 15px 0 4px;

}

p {

	font-family: "ff-meta-serif-web-pro",serif;

	font-size: 0.75em;

	margin: 0 0 6px;

	line-height: 1.5em;

}

ul, li {

	font-family: "ff-meta-serif-web-pro",serif;

}

a:link {

	outline: 0;

	color: #900;

	text-decoration: none;

}

h3 {

	position: relative;

	outline: 0;

	color: #900;

	text-decoration: none;

	-webkit-transition: all 0.25s ease-in-out;

	-moz-transition: all 0.25s ease-in-out;

	-ms-transition: all 0.25s ease-in-out;

	-o-transition: all 0.25s ease-in-out;

	transition: all 0.25s ease-in-out;

}

h3:hover, h3:active {

	color: #666;

	text-decoration: none;

	-webkit-transform: translate(5px, 0px);

	-moz-transform: translate(5px, 0px);

	-ms-transform: translate(5px, 0px);

	-o-transform: translate(5px, 0px);

	transform: translate(5px, 0px);

}

a:hover, a:active {

	color: #666;

	text-decoration: none;

}

a:visited {

	outline: 0;

	color: #666;

	text-decoration: none;

}

.page_wrap {

	min-height: 100%;

  	/* equal to footer height */

  	margin-bottom: -150px;

}

.page_wrap:after {

  content: "";

  display: block;

}

.site_footer, .page_wrap:after {

  /* .push must be the same height as footer */

  height: 150px; 

}



/* Old GD Styles */



.gd_project {

	width: auto;

	float: none;

	margin: 0 2% 20px;

}

.gd_project a:link , .gd_project a:active{

	color: #900;

	text-decoration: none;

	margin-top: 10px;

	font-style: oblique;

}

.gd_project a:hover, .gd_project a:visited {

	color: #960;

	text-decoration: none;

	margin-top: 10px;

	font-style: oblique;

}

footer {

	background-color: #333;

	width: auto;

	color: #999;

	font-weight: normal;

	font-size: 0.85em;

	letter-spacing: 0.1em;	

	line-height: 30px;

	padding-left: 2%;

}



nav {

	width: auto;

	padding: 10px 0;

	float: left;
	
	display: hidden;

}

nav a{

	color: #666;

	text-align: right;

}

nav a:visited {

	color: #666;

	text-align: right;

}

nav a:hover {

	color: #900;

	text-align: right;

}





/* Mobile Layout: 480px and below. */

  

.gridContainer {

	margin-left: auto;

	margin-right: auto;

	width: 96.45%;

	padding-left: 2.275%;

	padding-right: 2.275%;

	clear: none;

	float: none;

}



#div1 {

}

.zeroMargin_mobile {

    margin-left: 0;

}

.hide_mobile {

    display: none;

}

.aside_list {

	float: none;

}



.aside_list {

	float: none;	

}

#title h1 {

	text-align: center;

}





/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */



@media only screen and (min-width: 481px) {

	

body {

	font-size: 105%;	

}



.gridContainer {

	width: 90.675%;

	padding-left: 1.1625%;

	padding-right: 1.1625%;

	clear: none;

	float: none;

	margin-left: auto;

}

#div1 {

}

.zeroMargin_tablet {

    margin-left: 0;

}

.hide_tablet {

    display: none;

}

.hide_mobile {

    display: block;

}

.gd_project {

	width: 28%;

	float: left;

	margin: 0 2% 20px;

}

#title h1{

	text-align: left;

	font-size: 2.25em;

	margin: 25px 0em 15px 0em;

	padding: 10px;

}



.aside_list {

	float: left;

	margin-right: 20px;

}



nav {

	font-size: 90%;

	float: right;

	width: auto;

}

nav li {

	display: inline;

}



}



/* Desktop Layout: 769px to a max of 1024px.  Inherits styles from: Mobile Layout and Tablet Layout. */



@media only screen and (min-width: 769px) {



body {

	font-size: 110%;	

}







.gridContainer {

	width: auto;

	max-width: 1232px;

	padding-left: 0.75%;

	padding-right: 0.75%;

	clear: none;

	float: none;

	margin-left: auto;

}

#div1 {

}

.zeroMargin_desktop {

    margin-left: 0;

}

.hide_desktop {

    display: none;

}

.content_hp p{

	font-size: 0.9em;

	line-height: 1.5em;

	margin: 0 0 15px;	

}

.columns {

	columns: 200px 2;

	-webkit-columns: 200px 2; /* Safari and Chrome */

	-moz-columns: 200px 2; /* Firefox */

	margin: 15px 0;

}

.columns_3 {

	columns: 200px 3;

	-webkit-columns: 200px 3; /* Safari and Chrome */

	-moz-columns: 200px 3; /* Firefox */

	margin: 15px 0;

}

#title {

	max-width: 1232px;

	margin: 0 auto;	

}

#title h1{

	font-size: 2.75em;

	color: #999;

	margin: 25px 0em 15px 0em;

	padding: 10px;

	width: auto;

}





#main_content {

	max-width: auto;

	margin: 2em auto 0em auto;

	padding: 20px;

}

#left_content {

	float: left;

	width: 65%;

	margin: 0px 20px 0px 10px;

	

	

}

#right_content {

	float: left;

	width: 25%;	

}

aside {

	border-left: dotted 1px #333;

}

.aside_list {

	float: none;

	margin-right: none;

}

.content_hp p {

	columns: 200px 2;

	-webkit-columns: 200px 2; /* Safari and Chrome */

	-moz-columns: 200px 2; /* Firefox */

}

}

@media only screen and (min-width: 1025px) {



#title h1{

	float: left;

	font-size: 3em;

	color: #999;

	margin: 25px 0em 15px 0em;

	padding: 10px;

	width: 65%;

}

nav {

	font-size: 80%;

	float: right;

	width: 30%;

}

}