/* BASE (Initital Setup)
=====================================
	#RESET
	#HTML5
	#CLEARFIX
	#BASE TYPOGRAPHY
===================================== */

/* #RESET
================================================== */                        
* {
	margin: 0;
	padding: 0;
}

/* #HTML5
================================================== */
 section, footer, aside, nav, article, figure {
	    display: block;
}

/* #CLEARFIX
================================================== */
.group:before,
.group:after {
    content: "";
    display: table;
} 
.group:after {
    clear: both;
}
.group {
    zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}

/* #BASE TYPOGRAPHY
================================================== */

/*
=================================================
	Basic text sizing
=================================================
	Set your main font size for paragraph

	Reference
	62.5%  => 10px
	68.8%  => 11px
	75%    => 12px
	81.3%  => 13px
	87.5%  => 14px
	100%   => 16px
	112.5% => 18px
	125%   => 20px

*/

body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 100%; /* 16px */
	line-height: 1.5em;
	/* [disabled]color: #333; */
}

/*
Using a Traditional scale: 6, 7, 8, 9, 10, 11, 12, 14, 16, 18, 21, 24, 36, 48, 60, 72
	if base is 16:
	h1 = 48 pixels → 48 ÷ 16 = 3 em
	h2 = 36 pixels → 36 ÷ 16 = 2.25 em
	h3 = 24 pixels → 24 ÷ 16 = 1.5 em
	h4 = 21 pixels → 21 ÷ 16 = 1.3125 em
	h5 = 18 pixels → 18 ÷ 16 = 1.125 em
	h6 = 16 pixels → 16 ÷ 16 = 1 em
*/
h1, h2, h3, h4, h5, h6 { margin-bottom: .5em; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
h1 { font-size: 3em; line-height: 1.15em; } /* line height: 55 ÷ 48 = ~1.15em */
h2 { font-size: 2.25em; line-height: 1.2em; }
h3 { font-size: 1.5em; line-height: 1.25em; }
h4 { font-size: 1.3125em; line-height: 1.3em; }
h5 { font-size: 1.125em; line-height: 1.35em; }
h6 { font-size: 1em; line-height: 1.4em; }

/* #Paragraphs 
================================================== */
p { 
	margin-bottom: 1.25em; 
}
p+p {
  text-indent: 1em;
  margin-top: -1.25em;
}

/* #Links
================================================== */
a { color: #39c; text-decoration: none; outline: 0; }
a:hover, a:focus { color: #39c; }
p a, p a:visited { line-height: inherit; }

/* #Lists
================================================== */
ul, ol {  
	margin: 0 0 1.25em 0; 
	clear: both;
}

ul li ul, ul li ol, ol li ul, ol li ol {
	margin: 0; 
}

li {
	clear: both;
	margin: 0 0 0 1.875em;
}

/* #Block Quotes
================================================== */
blockquote {
  margin: 1em 0;
  padding: 1em;
  border-top: 3px solid #aaa;
  border-bottom: 3px solid #aaa;
  background: #eee;
  color: #444;
}


/* #Images
================================================== */
img.scale-with-grid {
	max-width: 100%;
	height: auto; 
	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
	border-radius: 1em;
}

.home #banner-fade .bjqs {
	max-width: 100%;
	height: auto; 
	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
	border-radius: 1em;	
}

.slider {
	max-width: 100%;
	height: auto; 
}

a img {
	border: none;
}


/* LAYOUT/GRID
===================================== */

/*
* 12 Column Grid Adapted From/Based on Skeleton V1.0.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 5/20/2011
*/

.container {
	width: 960px;
	margin: 0 auto;
}

.container .row { 
	margin-bottom: 20px; 
	clear: both;
}

.container .column, .container .columns {
	display: inline;
	float: left;
	margin-left: 10px;
	margin-right: 10px;
}

/*****************************
12 Columns @ 960
((960/12) - 20) * 1 = 60
*****************************/

/* columns */
.container .eight.columns { width: 620px; }
.container .ten.columns { width: 780px; }
.container .twelve.columns { width: 940px; }

/* fractional/semantic columns */
.container .one-fourth.column { width: 220px; }
.container .one-third.column { width: 300px; }
.container .one-half.column { width: 460px; }

/* Offsets */	
.container .offset-by-one { margin-left: 80px; }
.container .offset-by-two { margin-left: 160px; }

/* #TABLET 
================================================== */	
@media only screen and (min-width: 768px) and (max-width: 959px) {

/*****************************
12 Columns @ 768
((768/12) - 20) * 1 = 44
*****************************/

/* main container */
.container { width: 768px; }

/* columns */
.container .eight.columns { width: 492px; }
.container .ten.columns { width: 620px; }		
.container .twelve.columns { width: 748px; }

/* fractional/semantic columns */
.container .one-fourth.column { width: 172px; }
.container .one-third.column { width: 236px; }
.container .one-half.column	{ width: 364px; }	

/* Offsets */	
.container .offset-by-one { margin-left: 64px; }
.container .offset-by-two { margin-left: 128px; }

/* Misc */


}

/* #MOBILE 
================================================== */	
@media only screen and (max-width: 767px) {

/*****************************
Fluid Full Width Columns (100%)
*****************************/

/* main container */
.container { width: 90%; margin: 0 5%;}

/* columns */
.container .eight.columns { width: 100%; margin: 0;}
.container .ten.columns { width: 100%; margin: 0;}
.container .twelve.columns { width: 100%; margin: 0;}

/* fractional/semantic columns */
.container .one-fourth.column { width: 45%; margin: 0 5% 0 0; }
.container .one-third.column { width: 100%; margin: 0; }
.container .one-half.column { width: 100%; margin: 0;}

/* Offsets */	
.container .offset-by-one { margin-left: 0; }
.container .offset-by-two { margin-left: 0; }

	
}

/* SITE SPECIFIC CSS
===================================== */
/* Header */



/* Main Nav */

nav#mainnav {
	margin: 0em 0;
	border-top: 1px solid #d5d5d5;
	border-bottom: 1px solid #d5d5d5;
	padding: 0px 0;
	margin-left: 10px;
	margin-right: 10px;
	overflow:hidden;
	margin-bottom: 30px;
}

nav#mainnav ul {
	list-style: none;
	float: left;
	left: 50%;
   	position:relative;
	margin: 0;
}

nav#mainnav ul li {
	float: left;
	clear: none;
	margin: 0 1px;
	position:relative;
	right:50%;
}

nav#mainnav ul li a {
	float: left;
	padding: .5em 1.25em;
	color: #000;
	font-weight: bold;
}

nav#mainnav ul li a:hover {
	background: #bfe0f0;
}

nav#mainnav ul li a small {
	display: block;
	font-size: .625em;
	line-height: .625em;
	color: #999;
	font-weight: normal;
	white-space:nowrap;
}

nav#mainnav ul li.selected a {
	background: #ececec;
}


article .twelve img {
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 
	
}


/* Main Slider */
.home #slider .twelve.columns {
}

.home #slider {
	position: relative;
	top: 50%;
	left: 50%;
	margin-top: 50px;
	margin-left: -350px;
}


/* Main Content */

h3.byline, h3.date {
	font-size: .625em;
	line-height: .625em;
	color: #999;
	font-weight: normal;
}

h2+h3.byline {
	margin-top: -1.5em;
}

h3.byline+a img {
	margin: .75em 0;
}

h3.byline+p {
	margin: 1.75em 0 1.25em 0;
}

a img:hover {
	filter: invert(10%);
	-webkit-filter: invert(10%);
	-moz-filter: invert(10%);
	-o-filter: invert(10%);
	-ms-filter: invert(10%);
}

/* HOME SPECIFIC */
.home #section1 .twelve .columns {
	text-align: center;
	background: #fff;
	padding: 4em 0;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	margin-bottom: 1em;
	margin-top: 0px;
	color: #0F9;
}

.home #section1 .header {
	color: #9FF;
	
}

.home #section1 .font {
		
}

.home #section2 .twelve.columns {
	text-align: center;
	border-top: 1px solid #d5d5d5;
	border-bottom: 1px solid #d5d5d5;
	margin-bottom: 2em;
	margin-top: 0px;
	padding: 20px 0 0 0;
}



.home #section3 .twelve.columns {
	text-align: center;
	border-top: 1px solid #d5d5d5;
	border-bottom: 1px solid #d5d5d5;
	margin-bottom: 2em;
	margin-top: 0px;
	padding: 20px 0 0 0;
}

.home #section3 {

}

.home #section3 ul {
	list-style: none;
	margin: 2em 0;
}

.home #section3 ul li {
	position: relative;
	padding: 0 0 1em 0em;
}

.home #section3 ul li h3 {
	margin: 0em 0 .25em 0;
}




/*******************************************************************/
.home #section4 .twelve.columns {
	text-align: center;
	background: #fff;
	padding: 0em 0;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	margin-bottom: 0em;
	margin-top: 0px;
}
.home #section4 h3 {
	border-top: 1px solid #d5d5d5;
	border-bottom: 1px solid #d5d5d5;
	margin-top: 1em;	
}

.home #section4 p {
	text-align: center;
	font-size: 1.3125em;
	line-height: 1.5em;
	padding: 0em 10%;
	border-bottom: 1px solid #d5d5d5;
	margin: 0 0 1em 0;
}

.home #section1 .twelve.columns {
	text-align: center;
	background: #fff;
	padding: 4em 0;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	margin-bottom: 1em;
	margin-top: 10px;
}


.readmore {
	white-space:nowrap;
}

/* SUB Page specific */

.sub article h1 {
	text-align: center;
	margin: .15em 0;
}

.sub article h2 {
	text-align: center;
	font-size: 1.5em;
	line-height: 1.25em;
	font-weight: normal;
	margin-bottom: 1em;
}

.sub article h3.date {
	text-align: center;
	margin-bottom: 3em;
}

.sub article h4 {
	text-transform: uppercase;
}

.sub article h5 {
	margin: 0;
}

.sub article p:first-of-type {
	font-size: 1.3125em;
	line-height: 1.33em;
}

.sub article p:first-of-type:first-line {
	text-transform: uppercase;
	font-weight: bold; 
	font-size: 1.1em;
}

.sub article blockquote {
  padding: 2em 3em;
}

.sub #section1 .twelve.columns {
	text-align: center;
	background: #fff;
	padding-bottom: 2em;
	border-bottom: 1px solid #000;
	margin-bottom: 1em;
	margin-top: 10px;
}

.sub #section1 .twelve .columns img {
	padding: 0 0 4em 0;
}

.sub #section1 h1 {
	text-align: center;
	margin: .75em 0 .5em 0;
	width: 96%;
	padding: 0 2%;
}

.sub #section1 p {
	font-size: 1.5em;
	line-height: 1.25em;
	text-align: center;
	width: 60%;
	padding: 0 20%;
	margin-bottom: 0;
}

.sub.products h4 {
	font-size: 1.125em;
	line-height: 1em;
	margin: .5em 0 0 0;
}

.sub.products h4 a {
	color: #000;
}

.sub.products .productsection h2 {
	text-align: center;
	border-top: 1px solid #d5d5d5;
	padding-top: .5em;
	margin-top: 1em;
}

.sub.products .productsection h3 {
	text-align: center;
	border-bottom: 1px solid #d5d5d5;
	padding-bottom: 1.5em;
}

.sub.products .productsubsection h4 {
	font-size: 1.5em;
	line-height: 1.25em;
	width: 70%; 
	padding: 2em 15% .5em 15%;
}

.sub.products .productsubsection p {
	width: 70%; 
	padding: 0 15%;
}

.sub.products .right .column {
	float: right;
}

.sub.products .productsubsection img+img {
	margin: 1em 0 0 0;
}

/* contact page */

.sub .subsection h5 {
	border-top: 1px solid #d5d5d5;
	padding-top: .5em;
	margin-top: .5em;
}

.sub .subsection h3 {
	border-bottom: 1px solid #d5d5d5;
	padding-bottom: 1.5em;
}

.sub address {
	font-style: normal;
	margin-bottom: 1.25em;
}

.sub form {
	margin: 1.75em 0;
}

.sub form label {
	display: block;
}

.sub form input, .sub form textarea {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1em;
	line-height: 1.15em;
	display: block;
	margin-bottom: 1.25em;
	width: 100%;
	color: #666;
	padding: .25em;
}

.sub form textarea {
	border: 1px solid #b7b7b7;
}

.sub form input#contact_submit {
	width: auto;
	color: #3399cc;
}

.sub form input#contact_submit:hover {
	color: #06F;
}

/* Footer */

footer {
	background: #F1F1F1;
	border-top: 1px solid #ccc;
	padding: 40px 0 100px 0;
	margin-top: 100px;
}

footer .logo {
	float: left;
	margin: 0 0 2em 0;
}

footer .logo h2 {
	margin: 0;
	font-size: 2em;
}

footer .logo h2 a {
	color: #F00;
}

footer p#copyright {
	font-size: .625em;
	line-height: .625em;
	color: #999;
	margin: 0;
}

footer nav#footernav {
	text-align: center;
	float: right;
	color: #0F0;
}

footer nav#footernav ul {
	list-style: none;
}

footer nav#footernav ul li {
	clear: none;
	margin: 0 10px;
	float: left;
}

footer nav#footernav ul li a {
	float: left;
	padding: 7px 10px;
	color: #000;
	font-weight: bold;
	color: #666;
}

footer nav#footernav ul li.selected a:hover {
	color: #000;
}

footer nav#footernav ul li a:hover {
	color: #bfe0f0;
}

footer nav#footernav ul li.selected a {
	background: #F2F2F2;
	color: #000;
}

footer .container .logo a {
	background-image: url(../img/FirstLink_Logo.gif);
	background-repeat: no-repeat;
	display: block;
	width: 180px;
	height: 120px;
	overflow:hidden;
	text-align: center;
}

footer .container .logo h2 {
	text-indent: -9000px;	
}

footer nav#footernav ul li a small {
	display: block;
	font-size: .625em;
	line-height: .625em;
	color: #999;
	font-weight: normal;
}



/*BANNER
==================================== */
/* Basic jQuery Slider essential styles */

ul.bjqs { 
	position:relative; 
	list-style:none;
	padding:0;
	margin:0;
	overflow:hidden; 
	display:none;
}

li.bjqs-slide {
	position:absolute; 
	display:none;
}

ul.bjqs-controls {
	list-style:none;
	margin:0;padding:0;
	z-index:9999;
}

ul.bjqs-controls.v-centered li a {
	position:absolute;
}

ul.bjqs-controls.v-centered li.bjqs-next a { 
	right:0;
}

ul.bjqs-controls.v-centered li.bjqs-prev a {
	left:0;
}

ol.bjqs-markers { list-style: none; 
	padding: 0; 
	margin: 0; 
	width:100%;
}

ol.bjqs-markers.h-centered {
	text-align: center;
}

ol.bjqs-markers li {
	display:inline;
}

ol.bjqs-markers li a {
	display:inline-block;
}

p.bjqs-caption{display:block;width:96%;margin:0;padding:2%;position:absolute;bottom:0;}
#banner-fade {color: #000;}

/* Demo CSS - You do not need this css in your own slider */

#banner-fade,
#banner-slide{
	margin-bottom: 0px;
}

ul.bjqs-controls.v-centered li a{
	display:block;
	padding:0px;
	background:#fff;
	color:#000;
	text-decoration: none;
}

ul.bjqs-controls.v-centered li a:hover{
	background:#bfe0f0;
	color:#000;
}

ol.bjqs-markers li a{
	padding:5px 0px;
	background:#000;
	color:#fff;
	margin:5px;
	text-decoration: none;
}

ol.bjqs-markers li.active-marker a,
ol.bjqs-markers li a:hover{
	background: #999;
	color: #bfe0f0;
}

p.bjqs-caption{
	background: rgba(255,255,255,0.5);
}


/* MEDIA QUERIES
===================================== */


/* #MOBILE */
@media only screen and (max-width: 767px) {

body {
	font-size: 88.88%;
}


nav#mainnav { 
	text-align: center;
	width: 100%; 
	margin-left: 0%;
	margin-right: 0%;
}

nav#mainnav ul {
	float: none;
	left: auto;
}

nav#mainnav ul li {
	float: none;
	position:relative;
	right: auto;
}

nav#mainnav ul li a {
	display: block;
	float: none;
	padding: .5em 1.25em;
	border-bottom: 1px solid #efefef;
}

nav#mainnav ul li:last-child a {
	border-bottom: none;
}

.home #section1 h2 {
	
}

.home #section1 p {
	font-size: 1em;
	line-height: 1.25em;
}

.home #section2 h2 {
}

.home #section4 ul.left {
	margin: 2em 0 0 0;
}

.home #section4 ul.right {
	margin: 0 0 2em 0;
}

.home #section4 ul.left li, .home #section4 ul.right li {
	margin: 0;
}

.sub #section1 h1 {
	font-size: 2em;
	line-height: 1.15em;
}

.sub #section1 p {
	font-size: 1em;
	line-height: 1.25em;
	width: 70%;
	padding: 0 15%;
}

.sub article h1 {
	font-size: 2em;
	line-height: 1.15em;
}

.sub article h2 {
	font-size: 1.3em;
	line-height: 1.15em;
}

.sub article p:first-of-type {
	font-size: 1em;
	line-height: 1.5em;
}

.sub article blockquote {
	padding: 1em 1.5em;
}

.sub.products .productsection h4 {
	font-size: 1em;
	line-height: 1.25em;
}

.sub.products .productsection p {
	font-size: .8em;
	line-height: 1.15em;
}

.sub.products .productsubsection h4 {
	font-size: 1.25em;
	line-height: 1.25em;
	width: 100%;
	margin: .5em 0 0 0; 
	padding: 0 0 .4em 0;
}

.sub.products .productsubsection p {
	font-size: 1em;
	line-height: 1.25em;
	width: 100%; 
	padding: 0;
}

footer nav#footernav {
	clear: both;
	text-align: center;
	float: none;
	border-top: 2px solid #ccc;
	border-bottom: 2px solid #ccc;
}

footer nav#footernav ul {
	margin: 1px 0;
	padding: 0;
}

footer nav#footernav ul li {
	float: none;
	margin: 0;
	padding: 0;
}

footer nav#footernav ul li a {
	display: block;
	float: none;
	border-top: none;
	margin: 0;
	padding: .5em;
}

footer nav#footernav ul li.selected a {
	background: #ddd;
	color: #000;
}

footer nav#footernav ul li a:hover {
	border-top: none;
	background: #bfe0f0;
	color: #4E4E4E;
}

footer nav#footernav ul li.selected a:hover {
	border-top: none;
}

/**********************************************/
/* Main Slider */
.home #slider .twelve.columns {
}

.home #slider {
	position: relative;
	top: 50%;
	left: 50%;
	margin-top: 50px;
	margin-left: -330px;
}