/*
++++++++++ COLORS ++++++++++++++++++++++++++++++++++++++++++++++++
#00a9db 	Blue				Links
#1fc22f  	Green				Green Button Color and Link Rollover Color
#1cb12b		Green Dark	Green Button Rollover Color
#f6f6f6  	Light Grey 	backgrounds + borders
#999999		Grey 				text

+++++++++++ CONTENTS +++++++++++++++++++++++++++++++++++++++++++++
 -  Structure moves from generic to specific
 
 1. CSS RESETS & OVERRIDES
 2. LINKS & TYPE
 3. MAIN LAYOUT
 4. SECONDARY LAYOUT STRUCTURES
 5. FORM ELEMENTS
 6. MISCELLANEOUS
*/

/* ++++++ 1. CSS RESETS AND OVERRIDES ++++++++++++++++++++++++++
http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain)*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
/*b,*/ u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video
	{margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {display: block;}

body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,
q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}

/*Clearfix - Now "group" - Dan Cederholm*/
.group:after {visibility: hidden;display: block;content: "";clear: both;height: 0;}
* html .group             { zoom: 1; } /* IE6 */
*:first-child+html .group { zoom: 1; } /* IE7 */

/* +++++ 2. LINKS & TYPE ++++++++++++++++++++++++++++++++++++++ */
body {font-size:16px; font-family: 'Montserrat', sans-serif; color: #000000;
			background: #fff url(../jpg/nav-backround.jpg) no-repeat center -10px;
			-webkit-font-smoothing:antialiased;}

a:link, a:visited {text-decoration: none; color: #00a9db;}
a:hover, a:active {text-decoration: none; color: #1fc22f;}
	
h1 	{font-size:2.2em; font-weight: 400; text-transform: uppercase; letter-spacing: 0.06em; line-height: 1.1em;
		margin: .6em 0 0 0;}
h1 strong {font-weight: 700;}
h1 span {display:block;}

h2 {font-size:.7em; letter-spacing: 0.09em; line-height: 1.6em; color: #ffffff; background-color:#000; text-align: center; margin: 1em 2.5em; padding: .2em; }
h2 strong {font-weight: 700;}
h2 span {text-transform: uppercase;}
h2 a:link {color: #ffffff; border-bottom: 1px solid white;}
h2 a:hover {color: #00a9db; border-bottom: 1px solid #00a9db;}

h3 	{margin: 1.9em 0 -.3em 0; font-weight: 700;}
p 	{font-size:.75em; line-height: 1.8em; font-weight: 400; margin: .5em 0 0 0;}
	
em	{display:block; float:right; margin: 1.9em 1em 0 0;font-weight: 700;} 
em a::after {content: " »";}		

dl {margin: 1.9em 0 0;}
dt {font-weight: 700; margin: 0 0 .5em 0;}
dd {font-size:.8em; color:#999999; line-height: 1.5em;}

.capText, dt {font-size:.75em; text-transform: uppercase; letter-spacing: 0.09em; line-height: 1.6em;}
.tiny {font-size:.8em; line-height: 1.5em; margin-bottom: 2em; color: #999999; font-family: verdana, tahoma, sans-serif;}
.centerText {text-align: center;}

/* +++++ 3. MAIN LAYOUT +++++++++++++++++++++++++++++++++++++++ */
.matte {width:1014px; padding: 0 0 2em 0; margin: 0 auto;}
.matteInner {width:1014px; padding: 0 0  0em 0; margin: 0 auto;}

.twoCol {width:621px; float: left; padding: 0 0 0 0;}
.twoColRight {width:621px; float: left; padding: 0 0 0 0;}
.oneCol {width: 338px; float: left; padding:0 0 0 0;}

/* +++++ 4. SECONDARY LAYOUT STRUCTURES +++++++++++++++++++++++ */
.navMain {font-weight: 700; padding-top: 12px; margin-bottom:-1.5em; }
.navMain ul	{margin-top: 23px;}
.navLogo {display: block; float: left; margin: 0 0 0 -5px;}
.broad li {display: block; float: left; margin: 0 0 0 2em;}
.narrow li {display: block; float: left; margin: 0 0 0 1.5em;}
.navForm {display: block; float: left; margin: 0 0 0 0;}

a.navAccount {font-family: 'Permanent Marker', sans-serif;  font-size: 1.3em;color:#000000; margin-left: 1.5em; float: right;}

.breadcrumb {margin: 21px 0 -12px;}
.breadcrumb li {display: block; float:left; margin: 0 5px 0 0;}
.breadcrumb li:after {content: " / "; color:#999999;}
.breadcrumbCenter {display: table; margin: 0 auto -12px;}

.tags a:link 	{display: block; float:left; padding:0 5px; margin: 7px 7px 0 0; border-radius:3px; background-color: #f6f6f6;}
.tags a:hover {background-color: #1fc22f; color: #ffffff;}

.downloads {display: block; float: left; font-size: 1em; margin: 0 0 0 0;}
.downloads dt {display: block; float: left; width: 5em; height:2em; margin: 0 .9em .5em 0; text-align: right;}
.downloads dd {display: block; float: left; margin: 0 .5em .8em 0; }
.downloads a {background-color: #1fc22f; color: #ffffff; padding:.2em .5em;  border-radius:3px;}
.downloads a:hover {background-color: #1cb12b;}

.fiveGrid {font-size:.75em; line-height:1.4em; text-align: center;}
.fiveGrid a:link {display: block; float:left; height:165px; width:105px; padding: 4px; margin: 7px 14px 0 0; background-color:#f6f6f6;}
.fiveGrid a:hover {background-color: #1fc22f; color: #ffffff;}
.fiveGrid img {max-width:105px; max-height:105px;}
.fiveGrid .imgHolder {width:105px; height:105px;}

.threeGrid {font-size:.75em; line-height:1.4em; text-align: center; }
.threeGrid a:link {display: block; float:left; height: 10em; width:7.4em; padding: .4em; margin: 1em .2em 0 0; background-color:#f6f6f6;}
.threeGrid a:hover {background-color: #1fc22f; color: #ffffff;}
.threeGrid img {max-width:90px; max-height:90px;}
.threeGrid .imgHolder {width:90px; height:90px;}

.commentary ul {width: 100%; display: block; float: left;}
.commentary li {margin: 0 0 1em 1em; display: block; float:right;}
.commentary .reply {margin: 0 0 0 1.5em; width: 95%; /* <--- fallback if needed */ width: calc(100% - 1.1em);}

.colMenu {width: 148px; display: block; float: left; margin: 1em 0 2em 0;}
.colMenu a {display:block; padding: .5em 0; border-bottom: 1px solid #f6f6f6;}

.activity {width: 295px; display: block; float: left; margin: 1em 0 2em 0; font-size:.75em; letter-spacing: 0.09em; line-height: 1.6em;}
.activity li {display:block; border-bottom: 1px solid #f6f6f6; padding: .5em 0;}

.foot {margin: 2em 0;color:#999999;}
.foot ul {margin: 1em 0;}
.foot li {display: block; float:left;}
.foot li:after {content: "|"; margin: 0 10px;}

div.tabs {
}
ul.tabsNavigation {display: table; margin: 1.5em auto .4em; color: #999999; text-transform: uppercase; font-size:.75em;letter-spacing: 0.09em;line-height: 1.6em;}
ul.tabsNavigation li {display:block; float: left;}
ul.tabsNavigation li a {padding: .5em 1em; background:#f6f6f6; border:1px solid #f6f6f6; border-bottom: 1px solid #e1e1e1;}
ul.tabsNavigation li a:hover { background:#1fc22f; border:1px solid #1fc22f; color: #ffffff; }
ul.tabsNavigation li a.current {background:#ffffff; color:#222; border:1px solid #e1e1e1; border-bottom:3px solid #ffffff;}
div.tabsContent { border:1px solid #e1e1e1; padding:.7em; margin: 5px; display:none; box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.08); font-family:'Lucida Console', monospace; font-size: .7em; line-height: 1.4em; color:#999999; height: 6em; overflow: auto;}
div.tabsContent.currentTab {display:block;}

.blocker {display: block; float: left;}

/* +++++ 5. FORM ELEMENTS +++++++++++++++++++++++++++++++++++++ */

.navSearch {display: block;float:left; margin:-5px 0 0 21px; padding: 4px 4px; background-image: url("../png/search-backer.png"); background-repeat:no-repeat; background-position-x: left;}
.navSearch input[type=text] {width: 200px; border:none; border-radius:3px; margin: 0; height: 2.4em; padding: 0 .5em; vertical-align: top;}
.navSearch input[type=submit] {background-image:url(../gif/search.gif);font-size:0px;width:25px;height:25px; border: none; background-color:transparent;}

.supSearch {display: block;float:left; margin:2em 0; padding: 4px 4px; background-image: url("../png/search-backer.png"); background-repeat:no-repeat; background-position-x: left;}
.supSearch input[type=text] {width: 200px; border:none; border-radius:3px; margin: 0; height: 2.4em; padding: 0 .5em; vertical-align: top;}
.supSearch input[type=submit] {background-image:url(../gif/search.gif);font-size:0px;width:25px;height:25px; border: none; background-color:transparent;}


#loginForm, #joinForm {display:none; box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.08); background: #fbfbfb; margin: 1em 0; padding: .5em 0 1.5em 0; }

.loginForm input, .microForm input, textarea {font-size:1em; line-height: 1.7em; border: 1px solid #e1e1e1; border-radius:3px; vertical-align: top; box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.08); display: block;}
																							;
.loginForm input[type=checkbox] {margin: .2em 0 0 0;}
.loginForm input[type=submit] 	{margin: 1em 0 0 0; border: none; color:#ffffff; text-transform: uppercase; letter-spacing: 0.09em; background:#1fc22f; width:100%;}
.loginForm input[type=submit]:hover {background:#1cb12b;}
.loginForm {width:19em; margin: 0 auto;}

.rememberMe {margin: .5em 0 0 0;}

.microForm input[type=submit] 			{color:#999999; background-color: #f6f6f6; border: 1px solid #e1e1e1; box-shadow:none; margin: .5em 0 1em; text-transform: uppercase; letter-spacing: 0.09em;}
.microForm input[type=submit]:hover {color:#999999; background-color: #f6f6f6; box-shadow:0px 0px 2px 0px rgba(0,0,0,0.2);}
.microForm input[type=submit]:active{box-shadow:inset 0px 0px 2px 0px rgba(0,0,0,0.2);}

label.capText {display:block; margin: 1em 0 .25em 0;}

input[type=text], input[type=password] {padding: 0 .5em; height: 2em; width:94%; /* <--- fallback if needed */ width: calc(100% - 1.1em);}
input[type=submit] {height: 2em;}
input {font-family: 'Montserrat', sans-serif; color: #000000; font-size: 1em; font-weight: 400;}
textarea { width:100%; height: 5em; resize: none; padding: .5em; overflow-y: hidden; color: #999999; font-size: .9em;}
textarea:focus, input:focus {background-color:#ffffff; border: 1px solid #e5e700; outline: none; }

/* +++++ 6. MISCELLANEOUS +++++++++++++++++++++++++++++++++++++ */
.headBar h3 {float:left;}

.featuredImage {position:relative; max-width:302px; max-height:302px; margin:-.5em auto 1.5em; text-align:center;}
.featuredImage .theImage {max-width: 302px; max-height: 302px; margin: .3em 0 0 0;}
.featuredImage .btn {position:absolute; bottom:-3.5em; background-color:#FFFFFF; width: 55px; height: 55px; margin: 0 0 -.25em 0;}
.featuredImage .btnLeft {left:0em;}
.featuredImage .btnRight {right:0em;}
.featuredImage .tools img {margin: 0;}

.rateHire {text-align: center; margin-top: .75em;}
.rateHire img {margin: 0 .2em 0 0;}
.rateHire.span, .rateHire.span a:link {vertical-align: top;}

.billboard {margin: 21px 0 0 0;}
.googleAd {min-height: 250px;}
.closeX	{position:absolute; display:block; right:0em; width:1em; height:1em; margin: 2.2em 0; padding: .5em; background-color: #ffffff; color:#00a9db; font-weight: bold; border-radius: 3px 0 0 3px; -moz-box-shadow:0px 0px 4px 0px rgba(0,0,0,0.08); -webkit-box-shadow:0px 0px 4px 0px rgba(0,0,0,0.08); box-shadow:0px 0px 4px 0px rgba(0,0,0,0.08); }
.closeX:hover {background-color:#f8fafa;}

.fbButton {background: #3c57a7; padding: 6px 8px 4px 8px; border-radius: 3px; color: #ffffff; font-size: 1.1em; font-family: Helvetica, Arial, Sans-Serif; visibility:hidden;}
.fbButton span {font-family:Arial,Helvetica; text-transform:none; letter-spacing: 0; color:#ffffff;}
.fbButton img {margin: 8px 6px 0 0;}

.shareButtons	{margin: 1em 0;}
.shareButtons a:link { width: 32px; height: 32px; margin: .5em .5em; border: 0; display: inline; }
.shareButtons.first {margin-left:.4em;}

.oneColVideo {margin: .5em .5em 0 0;}

a:link.last, li.last, li.last:after, .last {content: ""; margin-right:0; border: 0px;}
a[href], input[type='submit'], input[type='image'], label[for], select, button, .navClick, .closeX {cursor:pointer;}

/* Search page fixes */
.caption {vertical-align: middle;}
.imtab td {vertical-align: middle;}
.qa h2 {color: white;}