/* 
* 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
*/


/* Table of Content
==================================================
	#Reset & Basics
	#Basic Styles
	#Site Styles
	#Typography
	#Links
	#Lists
	#Images
	#Buttons
	#Tabs
	#Forms
	#Misc */


/* #Reset & Basics (Inspired by E. Meyers)
================================================== */
	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; }
	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; }
		
		
/* #Basic Styles
================================================== */
	body { 
		font: 14px/21px Arial, sans-serif;
		color: #333231; 
		-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
		-webkit-text-size-adjust: none;
 }
	

/* #Typography
================================================== */
	h1, h2, h3, h4, h5, h6 { 
		color: #333231; font-family: "Century Gothic", Arial, sans-serif; }
	h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
	h1 { font-size: 38px; line-height: 44px; margin-bottom: 12px;}
	h2 { font-size: 33px; line-height: 38px; margin-bottom: 10px; }
	h3 { font-size: 28px; line-height: 34px; margin-bottom: 8px; }
	h4 { font-size: 21px; line-height: 30px; margin-bottom: 4px; }
	h5 { font-size: 17px; line-height: 24px; }
	h6 { font-size: 14px; line-height: 21px; }
	.subheader { color: #777; }

	p { margin: 0 0 20px 0; line-height: 17px; font-size: 13px; font-family: "Century Gothic", Arial, Helvetica; }
	p img { margin: 0; }
	p.lead { font-size: 21px; line-height: 27px; color: #777;  }
	
	em, i { font-style: italic; }
	strong, b { font-weight: bold; color: #444444; }
	small { font-size: 80%; }
	
/*	Blockquotes  */
	blockquote, blockquote p { font-size: 17px; line-height: 24px; color: #777; font-style: italic; }
	blockquote { margin: 0 0 20px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; }
	blockquote cite { display: block; font-size: 12px; color: #555; }
	blockquote cite:before { content: "\2014 \0020"; }
	blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; }
	
	hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 10px 0 30px; height: 0; }


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

/* #Lists
================================================== */
	ul, ol { margin-bottom: 20px; }
	ul { list-style: none outside; }
	ol { list-style: decimal; }
	ol, ul.square, ul.circle, ul.disc { margin-left: 30px; }
	ul.square { list-style: square outside; }
	ul.circle { list-style: circle outside; }
	ul.disc { list-style: disc outside; }
	ul ul, ul ol,
	ol ol, ol ul { margin: 4px 0 5px 30px; font-size: 90%;  }
	li { line-height: 18px; margin-bottom: 12px; }
	ul.large li { line-height: 21px; }
	li p { line-height: 21px; }
	
/* #Images
================================================== */
/*
	The purpose of the below declaration is to make sure images don't 
	exceed the width of columns they are put into when resizing window. 
	Unfortunately, this declaration breaks certain lightbox, slider or other plugins,
	so the best solution is to individually call these properties on images that 
	are children of the grid that you want to resize with grid. 

	img { 
		max-width: 100%;
		height: auto; }
		
*/


/* #Buttons
================================================== */
	
	a.button, 
	button,
	input[type="submit"],
	input[type="reset"],
	input[type="button"] {
		background-color: #b2d671; /* Old browsers */
		border: none;
	  padding: 20px;
	  border: 1px solid #b2d671;
	  padding-top: 25px;
	  padding-bottom: 25px;
	  color: #ffffff;
	  display: inline-block;
	  font-size: 26px;
	  font-weight: bold;
	  text-decoration: none;
	  cursor: pointer;
	  margin-bottom: 20px;
	  line-height: 21px;
	  font-family: "Century Gothic", Arial, sans-serif; 
	  border-radius: 5px;
	  text-transform: uppercase;
	}
    a.button:hover, 
	button:hover,
	input[type="submit"]:hover,
	input[type="reset"]:hover,
	input[type="button"]:hover {
		background: #168dbf;; color: #ffffff; /* Old browsers */ }
    a.button:active, 
    button:active,
	input[type="submit"]:active,
	input[type="reset"]:active,
	input[type="button"]:active {
        background: #071d49; color: #ffffff; /* Old browsers */ }
	
	.button.full-width, 
	button.full-width,
	input[type="submit"].full-width,
	input[type="reset"].full-width,
	input[type="button"].full-width { 
		width: 100%;
		padding-left: 0 !important;
		padding-right: 0 !important;
		text-align: center; }
	input[type=search] {
	    -webkit-appearance: textfield;
	    -webkit-box-sizing: content-box;
	    font-family: inherit;
	    font-size: 100%;
    }
    input::-webkit-search-decoration,
    input::-webkit-search-cancel-button {
	    display: none;
    }
    .header input[type=search],
    .footer input[type=search]
    {
        background-color: #ededed;
        border: solid 1px #cccccc;
        border-right: none;
        padding: 0px 0px 0px 10px;
        width: 250px;
        /*
        -webkit-border-radius: 10em 0 0 10em;
        -moz-border-radius: 10em 0 0 10em;
        border-radius: 10em 0 0 10em;
        */
    }
    .header input.searchbtn,
    .footer input.searchbtn
    {
        border: none;
        padding: 0;
        margin: 0;
        background: none;
        background: #ededed url(../images/search.png) no-repeat right center;
        /*
        -webkit-border-radius: 0 10em 10em 0;
        -moz-border-radius: 0 10em 10em 0;
        border-radius: 0 10em 10em 0;
        */
        border: solid 1px #cccccc;
        border-left: none;
        float: left;
        margin-top: 45px;
        width: 30px;
        height: 27px;
    }
    /* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) 
	{
	    .header input[type=search],
        .footer input[type=search]
        {
        }
        .header input.searchbtn, 
        .footer input.searchbtn
        {
            margin-top: 10px;
        }
	}
	@media only screen and (min-width: 480px) and (max-width: 767px) 
	{
	}
	@media only screen and (max-width: 479px) 
	{
	}
	
/* #Tabs (activate in app.js)
================================================== */
	ul.tabs { 
		display: block;
		margin: 0 0 20px 0;
		padding: 0;
		border-bottom: solid 1px #ddd; }
	ul.tabs li { 
		display: block;
		width: auto;
		height: 30px;
		padding: 0;
		float: left;
		margin-bottom: 0; }
	ul.tabs li a { 
		display: block; 
		text-decoration: none;
		width: auto; 
		height: 29px; 
		padding: 0px 20px; 
		line-height: 30px; 
		border: solid 1px #ddd;
		border-width: 1px 0 0 1px; 
		margin: 0;  
		background: #f5f5f5;
		font-size: 13px; }
	ul.tabs li a.active { 
		background: #fff; 
		height: 30px;
		position: relative;
		top: -4px;
		padding-top: 4px;
		border-right-width: 1px;
		margin: 0 -1px 0 0;
		color: #111;
		-moz-border-radius-topleft: 2px;
		-webkit-border-top-left-radius: 2px;
		border-top-left-radius: 2px;
		-moz-border-radius-topright: 2px;
		-webkit-border-top-right-radius: 2px;
		border-top-right-radius: 2px; }
	ul.tabs li:first-child a {
		-moz-border-radius-topleft: 2px;
		-webkit-border-top-left-radius: 2px;
		border-top-left-radius: 2px; }
	ul.tabs li:last-child a {
		border-width: 1px 1px 0 1px;
		-moz-border-radius-topright: 2px;
		-webkit-border-top-right-radius: 2px;
		border-top-right-radius: 2px; }
	
	ul.tabs-content { margin: 0; display: block; }
	ul.tabs-content > li { display:none; }
	ul.tabs-content > li.active { display: block; }
		
	/* Clearfixing tabs for beautiful stacking */
	ul.tabs:before,
	ul.tabs:after {
	  content: '\0020';
	  display: block;
	  overflow: hidden;
	  visibility: hidden;
	  width: 0;
	  height: 0; }
	ul.tabs:after {
	  clear: both; }
	ul.tabs {
	  zoom: 1; }
			
			
/* #Forms
================================================== */

	form {  }
	fieldset { 
		margin-bottom: 20px; }
	input[type="text"], 
	input[type="password"],
	input[type="email"],
	textarea, 
	input[type="number"],
	select {
		border: none;
		padding: 6px 4px;
		outline: none;
		font: 13px Arial, sans-serif;
		color: #444444;
		margin: 0;
		max-width: 100%;
		display: block;
		background: #e1e1e1; }
	select { 
		padding: 0; }
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="email"]:focus, 
	textarea:focus {
		border: 1px solid #aaa;
 		-moz-box-shadow: 0 0 3px rgba(0,0,0,.2);
		-webkit-box-shadow: 0 0 3px rgba(0,0,0,.2);
		box-shadow:  0 0 3px rgba(0,0,0,.2); }
	textarea {
		min-height: 60px; }
	label,
	legend { 
		display: block;
		font-weight: bold;
		font-size: 13px;  }
	select { 
		width: 220px; }
	input[type="checkbox"] {
		display: inline; }
	label span,
	legend span {
		font-weight: normal;
		font-size: 13px;
		color: #444444; }
		
/* #Misc
================================================== */
	.remove-bottom { margin-bottom: 0 !important; }
	.half-bottom { margin-bottom: 10px !important; }
	.add-bottom { margin-bottom: 20px !important; }