@charset "UTF-8";
/* CSS Document */

body {
background: #fff;
margin:0 auto;
height: 100%;
color:#666;
font-size:100%;
font-family:'robotolight', "Helvetica Neue", Helvetica, Arial, sans-serif;
text-align: center;
padding: 0;
margin:0;}

p {
margin: 0 0 12px 0;
line-height: 140%;
}
	
ul {margin:0 0 10px 10px;}

li {margin: 0 0 5px 13px;}

strong {
	font-family:'robotobold', "Helvetica Neue", Helvetica, Arial, sans-serif;
	color:#406FB9;
	font-weight:normal;}
	
em, i {
	font-family:'robotolight_italic', "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-style:normal;}

a, a:link, a:visited {
	color:#2fba5d;
	text-decoration: none;}

a:hover {color:#87eb2e;}
a:focus, a:active {color:#87eb2e;}


/* responsive mostly fluid layout (each layout div has a class assigned which governs how the divs move when viewport size changes) */

   .container {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: -o-flex;
      display: flex;
      -webkit-flex-flow: row wrap;
	  -moz-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
      -o-flex-flow: row wrap;
      flex-flow: row wrap;
	  margin-left: auto;
      margin-right: auto;
   }

	 
 .c1 {width: 100%;} /*header*/
 .c2 {} /*header h1*/
 .c3 {} /*nav*/
 .c4 {width: 100%} /*content*/
 .c5 {width: 100%} /* bg */
 .c6 {width: 300px} /*column_l*/
 .c7 {width: 60%} /*column_r*/
 .c7a {width: 100%} /*column_r with no image in column_l*/
 .c8 {width: 100%;} /*footer*/


#wrapper {
	padding:40px 0;
	clear:both;}

header {
	text-align: justify;
	padding: 0 10%;
	margin: 0 0 30px 0;
	background: transparent;
	}
	
header h1, header nav {display:inline-block;}
	
header h1 {
	font-family:'liberation_sansregular','robotolight', "Helvetica Neue", Helvetica, Arial, sans-serif;
	color:#2fba5d;
	font-size:250%;
    height: 100%;
	margin:0;
	float:left;
	}
	
header h1 a, header h1 a:link, header h1 a:visited {
	color:#2fba5d;
	text-decoration: none;}
	
header h1 a:hover {color:#a6f487;}
header h1 a:focus, #header h1 a:active {color:#87eb2e;}

	
nav { 
	padding: 0;
	vertical-align: top;
	height:100%;
	float:right;}

nav:after {
	content:"";
	display:table;
	clear:both;}

nav ul {
	display:inline-block;
	border-radius: 2px;
	padding:0;
	margin:0;
	list-style: none;
	position: relative;}
	
nav ul li {
	margin: 0;
	display:inline-block;
	padding: 0 5px;}

nav a, nav a:link, nav a:visited {
	display:block;
	padding:7px 10px 9px;
	margin:5px auto 0;
	color:#929292;
	border-radius: 2px;
	font-size:125%;
	line-height:18px;
	text-decoration:none;}

nav a:hover, nav .on a:hover {
	background-color: #a6f487;
	color:#929292;}	

.on a, .on a:link, .on a:visited {
	background: #2fba5d;
	color:#fff;}

.menu {display:none;}
.social {}
	
	
#bg {background: transparent url('images/green.jpg') no-repeat left bottom ;
	height:50px;	
	z-index:-1000;
	margin: 0 0 20px 0;}


#content {
	text-align:left;
	margin: 40px 20% 0 20%;	
	min-height:400px;
	min-width:850px;
	}

#content p {	font-size:115%;
	line-height:150%;}

#column {padding:0 8%;}

#column_l {padding:0 40px 0 0;
	float:left;}
	
#column_r {padding: 0;
	float:left;}

.splash {font-size:105%;}
	
.splash p {line-height:180%;}

.item_container {}

.divider {
	width:100%;
	margin: 40px 0 50px;
	border-top: solid 1px #c4d9bc;}

.clear {clear:both;}

.link img {vertical-align:middle;}	
.link {text-align:right;}


.space {padding:0 10px;}

.large img {	margin: 30px 0 0; }

.design {font-size:85%;}

.design a, .design a:link, .design a:visited {color:#a1a1a1;}
.design a:hover {color:#87eb2e;}

#home {
	width:100%;
	margin: 60px 0 10px;
	padding:10px 0;
	font-size:100%;
	text-align:center;
	border-top: solid 1px #c4d9bc;
	border-bottom: solid 1px #c4d9bc;}

	
	
h1 {	
	font-weight:normal;
	font-family:'robotoregular', "Helvetica Neue", Helvetica, Arial, sans-serif;
	margin:0 0 30px;
	font-size:220%;
	color:#2fba5d;
	line-height:100%;}
	
h2 {	
	font-weight:normal;
	margin:0 0 15px;
	font-size:190%;
	color:#2fba5d;
	line-height:100%;}
	
h3 {	
	font-weight:normal;
	margin:0 0 5px 0;
	font-size:140%;
	color:#666;}
	
h4 {
	font-weight:normal;
	margin:0 0 15px;
	font-size:130%;
	color:#2fba5d;}

h5 {
	font-weight:normal;
	margin: -5px 0 15px 0;
	line-height:120%;
	font-size:115%;
	}

h6 {
	font-family:'robotolight_italic', "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:100%;}
	
	

#footer {
	background:#fff;
	text-align:center;
	color:#a1a1a1;
	clear:both;
	padding:20px 0;
	margin: 0;}


	


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


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

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

}


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


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