/*****************************************************************
	RESET: based on http://meyerweb.com/eric/thoughts/2008/01/15/resetting-again/
*****************************************************************/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, tt, var,
b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, 
tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;}

body {line-height: 1;}
ul {list-style: none outside none;}
ol {margin: 0 0 0 20px;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: none;}
:focus {outline: 0 none;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse; border-spacing: 0;}

article, aside, dialog, details, figcaption, figure, footer, header, hgroup, nav, section {display: block;}


/*****************************************************************
	BASE
*****************************************************************/

body {position: relative; margin: 0; padding: 0; font: normal 1em/1.5 'Open Sans', Helvetica, Arial, sans-serif; color: #333333; background: #fff;}

/*  HEADINGS  */
h1 {margin: 0; padding: 0; font-size: 2em; font-weight: normal; letter-spacing: -1px;}
h2 {margin: 0; padding: 0; font-size: 1.35em; font-weight: normal;}
h3 {margin: 0; padding: 0; font-size: 1.15em; font-weight: bold; text-transform: uppercase; letter-spacing: -1px;}
h4 {margin: 0; padding: 0; font-size: 1.0em; font-weight: normal;}
h5 {margin: 0; padding: 0; font-size: .75em; font-weight: normal;}
h6 {margin: 0; padding: 0; font-size: .5em; font-weight: normal;}


/*  LINKS  */
a:link {color: #cc991b; text-decoration: none; border-bottom: 1px solid #cc991b;}
a:visited {color: #cc991b; text-decoration: none; border-bottom: 1px solid #cc991b;}
a:hover {color: #000; text-decoration: none; border-bottom: 1px solid #000;}


/*  BUTTONS  */
.button {padding: 7px 10px; background: #333; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-align: center; text-transform: uppercase; color: #fff; text-shadow: 1px 1px 1px #666;}
.button:link {color: #fff; border-bottom: none;}
.button:visited {color: #fff;}
.button:hover {color: #fff;}


/*  GENERAL ELEMENTS  */
.bg-white {background: #fff;}
.bg-dark {background: #333 url('../images/bg-dark.jpg') repeat;}
img {max-width: 100%; display: block;}
p {margin: 15px 0; line-height: 1.6;}
.lowercase {text-transform: lowercase;}


/*  SELF CLEARING FLOATS  */
header:after, section:after, footer:after, .contents:after, .columns:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}


/*  LAYOUT  */
header {clear: both; margin: 0; padding: 0;}
section {clear: both; margin: 0; padding: 40px 0;}
footer {clear: both; margin: 0; padding: 40px 0;}
.contents {position: relative; margin: 0 auto; padding: 0; width: 960px; clear: both;}
.columns {margin: 0; padding: 15px 0;}

.column {display: inline; float: left; margin: 0 10px;}
.column.sixteen {width: 940px;}
.column.fifteen {width: 880px;}
.column.fourteen {width: 820px;}
.column.thirteen {width: 760px;}
.column.twelve {width: 700px;}
.column.eleven {width: 640px;}
.column.ten {width: 580px;}
.column.nine {width: 520px;}
.column.eight {width: 460px;}
.column.seven {width: 400px;}
.column.six {width: 340px;}
.column.five {width: 280px;}
.column.four {width: 220px;}
.column.three {width: 160px;}
.column.two {width: 100px;}
.column.one {width: 40px;}
.column.one-fifth {width: 172px;}
.column.one-third {width: 300px;}
.column.two-thirds {width: 620px;}


/*  HEADER  */
header {border-top: 4px solid #333; background: #fff; padding: 10px 0; border-bottom: 1px solid #dcdcdc; }
header #logo {float: left; margin: 7px 0 0 0; padding: 0;}

header nav {float: right; margin: 0 auto; padding: 20px 0; text-align: center;}
header nav ul {list-style: none; margin: 0 auto; padding: 0;}
header nav ul li {display: inline; margin: 0; padding: 0 20px; border-right: 1px solid #dcdcdc;}
header nav ul li.last {border-right: none; padding: 0 0 0 20px;}
header nav ul li a:link {text-transform: uppercase; color: #333; font-size: .9em; border-bottom: none;}
header nav ul li a:visited {text-transform: uppercase; color: #333; font-size: .9em; border-bottom: none;}
header nav ul li a:hover {text-transform: uppercase; color: #cc991b; font-size: .9em; border-bottom: 1px solid #cc991b;}
header nav ul li a.current {}
header nav ul li.highlight a:link {text-transform: uppercase; color: #fff; font-weight: normal;}
header nav ul li.highlight a:visited {text-transform: uppercase; color: #fff; font-weight: normal;}
header nav ul li.highlight a:hover {text-transform: uppercase; color: #fff; font-weight: normal;}
header nav ul li.highlight {margin: 38px 20px 0 0;}


/*  GENERAL  */
.page-title {display: inline; margin: 0; padding: 0; font-size: 2em; font-weight: normal; text-transform: uppercase; letter-spacing: -1px; color: #fff; text-shadow: 2px 2px 2px #000;}
.sub-nav {display: inline; margin: 0 0 20px 0; padding: 0 10px; text-shadow: 2px 2px 2px #000;}
.sub-nav li {display: inline; color: #fff; padding: 0 10px;}
.sub-nav li a:link {color: #ddd; text-decoration: none; border-bottom: none;}
.sub-nav li a:visited {color: #ddd; border-bottom: none;}
.sub-nav li a:hover {color: #cc991b; border-bottom: 1px solid #cc991b;}
.google-map {position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden;}
.google-map iframe, .google-map object, .google-map embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}


/*  HOME  */
.home-pic img {border: 1px solid #fff;}
.home-pic:hover {-moz-transform:scale(1.02); -webkit-transform:scale(1.02); -ms-transform:scale(1.02); transform:scale(1.02);}


/*  FORMS  */
.simpleform {margin: 10px 0 0 0;}
.simpleform .field {margin: 0 0 20px 0; padding: 0;}
.simpleform label {display: block; margin: 0;}
.simpleform input[type="text"] {font-size: .8em; padding: 3px 5px 1px 5px; height: 20px; font-family: 'Open Sans', Helvetica, Arial, sans-serif; vertical-align: baseline; width: 300px;}
.simpleform textarea {font-size: .8em; padding: 3px 5px 1px 5px; height: 125px; font-family: 'Open Sans', Helvetica, Arial, sans-serif; vertical-align: baseline; width: 305px;}
.simpleform input[type="submit"] {cursor: pointer;}


/*  FOOTER  */
footer {color: #333; background: #fff6e9; border-top: 1px solid #dcdcdc; font-size: .8em;}
footer .copyright {text-align: left; margin: 20px 0 0 0; padding: 10px 0 0 0;}


/*  WREKXZ N EFFECTS  */
.eazy-eaze {-moz-transition: all .2s ease; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease;}
.eazy-eaze:hover {}
.gray-matter {background: 0 0 #f4f4f4;}
.white-matter {background: 0 0 #fff;}


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

/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {
        .contents {width: 768px;}
        .column.sixteen {width: 748px;}
        .column.fifteen {width: 700px;}
        .column.fourteen {width: 652px;}
        .column.thirteen {width: 604px;}
        .column.twelve {width: 556px;}
        .column.eleven {width: 508px;}
        .column.ten {width: 460px;}
        .column.nine {width: 412px;}
        .column.eight {width: 364px;}
        .column.seven {width: 316px;}
        .column.six {width: 268px;}
        .column.five {width: 220px;}
        .column.four {width: 172px;}
        .column.three {width: 124px;}
        .column.two {width: 76px;}
        .column.one {width: 28px;}
        .column.one-fifth {width: 133px;}
        .column.one-third {width: 236px;}
        .column.two-thirds {width: 492px;}
    }


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
        .contents {width: 300px;}
        .column {margin: 0;}
        .column.sixteen,
        .column.fifteen,
        .column.fourteen,
        .column.thirteen,
        .column.twelve,
        .column.eleven,
        .column.ten,
        .column.nine,
        .column.eight,
        .column.seven,
        .column.six,
        .column.five,
        .column.four,
        .column.three,
        .column.two,
        .column.one,
        .column.one-fifth,
        .column.one-third,
        .column.two-thirds {width: 300px;}
    }


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
        .contents {width: 420px;}
        .column {margin: 0;}
        .column.sixteen,
        .column.fifteen,
        .column.fourteen,
        .column.thirteen,
        .column.twelve,
        .column.eleven,
        .column.ten,
        .column.nine,
        .column.eight,
        .column.seven,
        .column.six,
        .column.five,
        .column.four,
        .column.three,
        .column.two,
        .column.one,
        .column.one-fifth,
        .column.one-third,
        .column.two-thirds {width: 420px;}
    }
    
/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		header #logo {float: none; margin: 0 auto; text-align: center;}
		header #logo img {margin: 0 auto; text-align: center;}
		header nav {float: none;}
		
		.sub-nav {display: block; margin: 0; padding: 0;}
		.sub-nav li {padding: 0 10px 0 0;}
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {

	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		header #site-title h1 {font-size: 1.5em; font-weight: bold; text-transform: uppercase;}
		header #site-title h2 {font-size: 1em; font-weight: normal;}
		header #logo {margin: 20px auto 0 auto;}
		
		header nav ul li, header nav ul li.last  {display: block; margin: 10px 0; padding: 4px; border-right: none; background: #ebebeb;}
		header nav ul li a, header nav ul li a:link, header nav ul li a:visited {display: block; border-bottom: 1px solid #ebebeb;}
		
		.home-pic {margin: 0 auto 40px auto; padding: 0; text-align: center;}
		.home-pic img {margin: 0 auto; text-align: center;}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {

	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		.simpleform input[type="text"] {width: 280px;}
		.simpleform textarea {width: 285px;}
	}