/*
Theme Name: 	TopoZone
Author:         Derek Ashauer
Author URI:     http://www.ashwebstudio.com
*/
@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);
/* Resets */
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%; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 120%; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
input { vertical-align: middle; }
input[type="submit"] { cursor: pointer; }

/* WordPress required styles */
.alignright { float: right; margin: 0 0 10px 15px; }
.alignleft { float: left; margin: 0 15px 10px 0; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin-top: 10px; margin-bottom: 10px; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
.wp-caption img { margin: 0; padding: 0; border: 0 none; }
.wp-caption-dd { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; }
.screen-reader-text { display: none; }

/* ----------------------------------- */
/* COMMON
/* ----------------------------------- */
body { background: #FFF url(images/bg.png) center top repeat; text-align: center; }
p, div, li, h1, h2, h3, h4, td, th, input, select, textarea { font: normal 15px/1.48 "Montserrat", sans-serif; color: #4d4d4d; }
p, h1, h2, h3, h4, section ul, section ol, section table { margin-bottom: 15px; }
h1, h2, h3 { line-height: 1.1; color: #000; }
a img, :link img, :visited img { border: none }
a { color: #0bb4aa; text-decoration: underline; }
a:hover { color: #41cdc5; }
div.clear { clear: both; overflow: hidden; height: 1px; }
input { vertical-align: middle; }
.cf:before, .cf:after { content: " "; display: table; }
.cf:after { clear: both; }
.cf { *zoom: 1; }
.gfield { margin-left: 0 !important; }

#wrapper { position: relative; width: 100%; }
.container { width: 100%; max-width: 1060px; margin: 0 auto; text-align: left; }

.button { background: none; border: 1px solid #999; padding: 8px 18px; text-decoration: none; font-size: 13px; text-transform: uppercase; display: inline-block; margin-top: 15px; cursor: pointer; }
.button:hover { background: #41cdc5; color: #FFF; }

#header, #header nav {
	-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}

/* ----------------------------------- */
/* HEADER
/* ----------------------------------- */
#header { padding: 15px 0; background: #000; z-index: 9999; }
/*
#header.is_stuck { padding: 15px 0; }
#header.is_stuck nav { margin-top: 10px; }
*/

#logo { float: left; font-size: 30px; text-decoration: none; color: #FFF; text-transform: uppercase; }

#quick-search { float: right; margin: 10px 0 0 40px; }
/*
#quick-search { display: none; background: #383838 url(images/bg-dark.png) center top repeat; padding: 25px 0; color: #FFF; font-size: 18px; }
*/
#quick-search input, #quick-search button { background: none; border: none; color: #FFF; }
#quick-search input { border-bottom: 1px solid #FFF; font-size: 14px; width: 160px; }
#quick-search select { font-size: 14px; }
#quick-search button { font-size: 18px; cursor: pointer; }
#quick-search .topozone-search { margin: 0 auto; }
#quick-search .container { text-align: center; }

#header nav { margin-top: 15px; }
#header nav ul { float: right; }
#header nav li { float: left; list-style: none; margin: 0 0 0 20px; padding: 0 0 10px 20px; position: relative; font-size: 16px; }
#header nav li a { text-decoration: none; color: #FFF; }

#header nav li .sub-menu { left: -9999em; position: absolute; top: 35px; z-index: 100; background: #FF0000; padding: 7px 20px 15px 20px; }
#header nav li:hover .sub-menu { left: 0; }
#header nav li .sub-menu li { float: none; border: none; background: none; margin: 0; padding: 0; }
#header nav li .sub-menu li:before { display: none; }
#header nav li .sub-menu a { color: #FFF; background: none; padding: 0; white-space: nowrap; height: auto; line-height: 1.4; margin: 3px 0 0 0; font-size: 15px; text-transform: none; }
#header nav li .sub-menu a:hover { color: #CCC; }
.sub-menu:before { content:""; position:absolute; top:-10px; left:20px; bottom:auto; left:auto; border-width:0 10px 10px; border-color:#FF0000 transparent; z-index: 50; border-style:solid; display:block; width:0; }

#mobile-menu, #search-menu { display: none; }

/* ----------------------------------- */
/* HOME
/* ----------------------------------- */
#banner { position: relative; height: 480px; }
#search { padding-top: 140px; text-align: center; width: 550px; max-width: 100%; margin: 0 auto; position: relative; z-index: 555; }
#search h1 { font-size: 42px; font-weight: 600; color: #FFF; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); }
#search-box { background: rgba(0,0,0,.5); border-radius: 8px; padding: 5px 30px; }
#search-box input { border: none; background: transparent; color: #FFF; font-size: 18px;  vertical-align: middle; }
#search-box ::-webkit-input-placeholder { color: #FFF; }
#search-box :-moz-placeholder { color: #FFF; }
#search-box ::-moz-placeholder { color: #FFF; }
#search-box :-ms-input-placeholder { color: #FFF; }
#search input[type="text"] { width: 80%; }
#search input[type="submit"] { font-family: "FontAwesome"; font-size: 32px; padding: 0; }

#slideshow { position: absolute; top: 0; width: 100%; }
#slideshow li { height: 480px; background-size: cover; }
#slideshow li .links { position: absolute; bottom: 30px; text-align: left; width: 96%; max-width: 96%; padding: 0 2%; }
#slideshow li .links a { text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.7); color: #FFF; text-decoration: none; }
#slideshow li .links a.photo-credit { font-size: 15px; }
#slideshow li .links a.place-link { float: right; font-size: 18px; font-weight: 600; }
#slideshow li .links a.place-link i { color: #0bb4aa; }
#slideshow span { font-family: "FontAwesome"; position: absolute; top: 40%; z-index: 999; }
#slideshow span a { font-size: 60px; color: #FFF; text-decoration: none; }
#slideshow-next { right: 25px; }
#slideshow-prev { left: 25px; }

.home #main section ol li { list-style: none; margin: 0 0 40px 0; clear: left; }
.home #main section ol li img { float: left; max-width: 25%; height: auto; margin: 0 0 40px 0; }
.home #main section ol li h2, .home #main section ol li p { margin: 0 0 4px 30%; }
.home #main section ol li h2 a { color: #000; text-decoration: none; }
.home #main section ol li h2 { font-size: 20px; }
.home #main section ol li p a { text-decoration: none; text-transform: uppercase; font-weight: 400; font-size: 12px; }

#states { padding: 0 0 75px 0; }
#states h2 { font-size: 30px; text-align: center; }
#states .columns { margin-bottom: 50px; }

#interactive-map { margin: 0 auto 50px auto; max-width: 780px; }
#map-tip p { color: #FFF !important; }

/*
.home #main.container { text-align: center; }
.home #main h1 { font-size: 40px; margin: 0 0 8px 0; }
.home #main p.tagline { font-size: 24px; color: #666; }
.home #main h2 { font-size: 20px; }

.topozone-search { max-width: 400px; text-align: left; }
.topozone-search label { width: 150px; float: left; text-align: right; padding: 0 20px 0 0; }
.topozone-search span.desc { display: block; font-size: 12px; color: #999; margin-left: 170px; }
.topozone-search input[type="submit"] { margin-left: 170px; }

.home #main .topozone-search { margin: 0 auto 75px auto; }

#welcome { width: 45%; float: left; margin: 0 0 50px 0; text-align: left; }
#welcome p { font-size: 22px; }

#recent-blog { width: 45%; float: right; margin: 0 0 50px 0; text-align: left; }
#recent-blog h2 { margin: 0 0 20px 0; }
#recent-blog li { clear: both; margin: 0 0 25px 0; list-style: none; }
#recent-blog li a { text-decoration: none; }
#recent-blog li img { float: left; width: 75px; height: 75px; }
#recent-blog li h3, #recent-blog li p { margin: 0 0 7px 100px; }
#recent-blog li h3 { font-size: 18px; }
#recent-blog li p { font-size: 13px; color: #666; }
*/

/* ----------------------------------- */
/* SUB PAGES
/* ----------------------------------- */
#main { padding: 50px 0; }

#crumb { font-size: 12px; color: #999; margin: 0 0 5px 0; }
#crumb a { color: #999; text-decoration: none; }
#crumb a:hover { text-decoration: underline; }

#main section { float: left; width: 70%; }
#main section li { margin-left: 25px; }
#main section h1 { font-weight: normal; font-size: 30px; }
#main section h2 { font-size: 24px; font-weight: normal; }
#main section h3 { font-size: 16px; margin: 0 0 5px 0; }
#main section img { max-width: 100%; height: auto; }

#main .topozone-search { margin: 0 0 40px 0; }

#map { width: 100%; height: 500px; }
.tax-location #map { margin-bottom: 40px; }
#map-by { display: none; }
.map-print #map { width: 650px !important; height: 760px !important; margin: 0 auto 30px auto; }
.map-print h1 { text-align: center; font-size: 20px; }
.map-print p#print-link { font-size: 16px; }
body #main section #map img { max-width: none !important; }

table#places { width: 100%; }
table#places th { font-weight: bold; padding: 0 0 5px 0; border-bottom: 1px solid #CCC; }
table#places td { padding: 5px 0; border-bottom: 1px solid #EFEFEF; }

.columns {
    -moz-column-width: 11.5em; /* Firefox */
    -webkit-column-width: 11.5em; /* webkit, Safari, Chrome */
    column-width: 11.5em;
    list-style-type: none !important;
}
.columns li { margin-left: 0 !important; list-style: none; }
/* correct webkit/chrome uneven margin on the first column*/
.columns li:first-child {
    margin-top:0px;
}

#data p { font-size: 18px; }

#main aside { float: right; width: 25%; }

.rpwe-summary { margin-left: 65px; }

/* Blog */
article.post { margin: 0 0 50px 0; clear: both; }
article.post img { float: left; margin: 0 0 30px 0; }
article.post h2, article.post p { margin-left: 175px; }

.nav-links { text-align: center; }
.nav-links a { display: inline-block; margin: 0 5px; }

/* ----------------------------------- */
/* FOOTER
/* ----------------------------------- */
#footer { padding: 20px 0; background: #000; }
#footer p { font-size: 13px; color: #FFF; }
#footer a { color: #FFF; }

#social { float: right; font-size: 22px; }
#social a { margin-left: 10px; }

/* ----------------------------------- */
/* MOBILE
/* ----------------------------------- */

@media screen and (max-width: 980px) {

	.container { padding-left: 5%; padding-right: 5%; width: 90%; }

	#mobile-menu { float: right; display: block; font-size: 30px; color: #FFF; margin-left: 30px; }
	#header nav { margin-top: 0; }
	#header nav ul { display: none; }
	#header nav.open ul { display: block; float: none; clear: both; }
	#header nav ul { overflow-y: scroll; position: fixed; z-index: 999; top: 0; right: -230px; margin: 0; background: #000; width: 230px; height: 100%; float: none; }
	#header nav li { display: block; float: none; font-size: 16px; text-align: center; margin: 0; padding: 0; text-align: left; border-bottom: 1px solid #333; }
	#header nav li:before { display: none; }
	#header nav li a { color: #FFF; padding: 15px 20px; height: auto; font-size: 20px; display: block; }
	#header nav li .sub-menu { position: static; background: #333; display: none; padding: 10px 0 20px 0; margin: 0; }
	#header nav li .sub-menu.active { display: block; }
	#header nav li .sub-menu li { border: none; padding: 2px 20px; }
	#header nav li .sub-menu li a { font-weight: normal; font-size: 15px; padding: 5px 0; }
	#header nav li .sub-menu li a:hover { color: #c3ddea; }
	#header nav li.current_page_item a { border: none; }
	.sub-menu:before { display: none; }

}

@media screen and (max-width: 759px) {

	.home #main h1 { font-size: 30px;  }
	.home #main p.tagline { font-size: 18px; margin: 0 0 8px 0; }

	#welcome p { font-size: 16px; }

	#welcome, #recent-blog, #main section, #main aside { width: 100%; float: none; margin: 0 0 50px 0; }

	#map { height: 300px; }

	.topozone-search label { width: 120px; }
	.topozone-search input[type="submit"] { margin-left: 140px; }

	article.post img { float: none; margin: 0 0 20px 0; }
	article.post h2, article.post p { margin-left: 0; }

	#search-menu { display: block; float: right; color: #FFF; font-size: 30px; }
	#quick-search { display: none; }
	#quick-search { float: none; text-align: center; clear: both; }

}

@media screen and (max-width: 568px) {
	#logo { font-size: 24px; }
	#mobile-menu, #search-menu { font-size: 24px; }

	.topozone-search label { width: 80px; }
	.topozone-search input[type="submit"] { margin-left: 100px; }

	#search { padding: 70px 10% 0 10%; max-width: 80%; }
	#search h1 { font-size: 24px; }
	#search-box input { font-size: 16px; }
	#search input[type="text"] { width: 80%; font-size: 13px; }
	#search input[type="submit"] { font-size: 20px; -webkit-appearance: none; }

	#slideshow li, #banner { height: 300px; }
	#slideshow span a { font-size: 30px; }
	#slideshow li .links a.photo-credit, #slideshow li .links a.place-link { font-size: 13px; }

}

/* ----------------------------------- */
/* PRINT
/* ----------------------------------- */
@media print {
	#header { display: none; }
}

/* ----------------------------------- */
/* RESPONSIVE MAP OVERRIDE
/* ----------------------------------- */

@media screen and (min-width: 780px) {
	#map_base svg {
		height:530px;
	}
}