html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin:0;
	padding:0;
	border:0;
	font-weight:inherit;
	font-style:inherit;	
	font-size:100%;
	font-family:inherit;
	vertical-align:baseline;
}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:center;font-weight:normal;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;padding:0px; margin:0px}

body {
font-size:75%;
color:#000;
font-family:"trebuchet", Calibri,"Helvetica Neue", Arial, Helvetica, sans-serif;
background:#666;
line-height:1.5;
}
h1, h2, h3, h4, h5, h6 {font-weight:normal;}
h1 {font-size:3em;line-height:1;margin-bottom:0.5em;}
h2 {font-size:23px;margin:0 0 20px 0 }
h3 {font-size:1.5em;line-height:1;margin-bottom:1em;}
h4 {font-size:1.2em;line-height:1.25;margin-bottom:1.25em;}
h5 {font-size:1em;font-weight:bold;margin-bottom:1.5em;}
h6 {font-size:1em;font-weight:bold;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin:0;}
p {margin:0 0 1.5em;}
p img.left {float:left;margin:1.5em 1.5em 1.5em 0;padding:0;}
p img.right {float:right;margin:1.5em 0 1.5em 1.5em;}
a:focus, a:hover {background:#000;color:#666}
a {color:#000;text-decoration:underline;}
blockquote {margin:1.5em;color:#666;font-style:italic;}
em, dfn {font-style:italic;}
dfn {font-weight:bold;}
sup, sub {line-height:0;}
abbr, acronym {border-bottom:1px dotted #666;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre {margin:1.5em 0;white-space:pre;}
pre, code, tt {font:1em 'andale mono', 'lucida console', monospace;line-height:1.5;}
li ul, li ol {margin:0 1.5em;}
ul, ol {margin:0 1.5em 0 3.5em;}
ul {list-style-type:none;}
ol {list-style-type:decimal;}
dl {margin:0 0 1.5em 0;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}
table {margin-bottom:1.4em;width:100%;}
th {font-weight:bold;}
thead th {background:#c3d9ff;}
th, td, caption {padding:4px 10px 4px 5px;}
tr.even td {background:#e5ecf9;}
tfoot {font-style:italic;}
caption {background:#eee;}
.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.med {font-size:16px; line-height:18px;}
.large {font-size:20px; line-height:19px;}
.hide {display:none;}
.quiet {color:#666;}
.question {font-weight:bold; color:#222;}
.highlight {background:#d6f7f0;}
.added {background:#060;color:#fff;}
.removed {background:#900;color:#fff;}
.first {margin-left:0;padding-left:0;}
.last {margin-right:0;padding-right:0;}
.top {margin-top:0;padding-top:0;}
.bottom {margin-bottom:0;padding-bottom:0;}
.clear {clear:  both;}
a.clean{text-decoration:none; background: none}


#container {
       width: 950px;
       margin: 0 auto 0 auto;
       padding: 25px 20px 35px 20px;
       background: #FFF;
}
div#content {
	clear: both;
        min-height: 83vh;
}
div#footer {
	clear: both;
}

p.links {
	margin: 0;
	color: #000;
	text-transform: uppercase;
}
p.links a {
	text-decoration: none;
	color: white;
	padding: 3px;
	background: #000;
}
p.links a:hover {
	color: #000;
	background: #efefef;
}
hr.seperator {
	clear: both;
	border: none;
	background-color: #ccc;
	height: 1px;
}
div.thumb {
	background-color: #eee;
	float: left;
	padding: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
}
div.thumb h3 {
	text-transform: uppercase;
	font-weight: bold;
	font-size: 13px;
}
div.thumb h3 a {
	color: black;
	text-decoration: none;
}
div.thumb h3 a:hover {
	border-bottom: 1px solid #999;}
div.thumb img {
	width: 200px;
	height: 200px;
}
div.thumb p {
	text-align: center;
	margin: 0;
}
.row {
	height: 130px;
	clear: both;
	margin-bottom: 20px;
	width:950px;
}

.seeallbox {
	width:100px;
	margin-left:3px;
	padding-top:17px;
	text-align:center;
	background: #777;
	float:left;
	color: #fff;
	height:83px;
	cursor: pointer;
}

.image {
	margin: 0px;
	height: 100px;
	float:left;
	width: 821px;
}

.title {
	width: 100%;
	margin: 0px;
	background: #efefef;
	padding-left: 10px;
}

.title a {
	font-size: 18px;
	color: #666;
	text-decoration:none;
}
div#headline {
	text-align:center;
	margin-top: -10px;
	padding:5px;
	line-height: 1.1;
}
div#ziplinks{
	text-align:center;
	padding:5px;
	background-color:#000;
	min-width:80%;
}
div#notes{
	font-size:16px;
	margin: 20px;
}
span.headliner {
	font-weight:bold; 
	font-size:40px;
	text-decoration:none;
	white-space: nowrap;
}

DIV#map_canvas {
    width: 500px;
    height: 300px;
    float:right;
    border:4px solid black;
    display: none;
}
DIV#actionlinks {
    margin-bottom: 10px;
    float: right;
    clear: right;
    margin-right: 30px;
}
DIV#actionlinks a {
font-size:2vw;
    margin-bottom: 10px;
}

td {
	vertical-align: middle;
}
p#notice, .errors {
    color: #8f006f;
    font-size:1.8vw;
    padding: 5px 0px;
    background: #ecf6d8;
    margin: 0px;
}

DIV#collection_albums {
	width:  710px;
	clear:  both;
}
DIV#collection_albums span {
	position: relative;
	display:  block;
	float:  left;
	padding:  5px;
}
DIV#collection_albums IMG.delete {
	display:  block;
	vertical-align: top;
	position: absolute;
	cursor:  pointer;
	right:  8px;
	top:  8px;
}
DIV#action_links {
    float: right;
    clear: right;
    margin-right: 30px;
}
DIV#navigation img{
  	margin-bottom:2px;
  	padding:4px;
  	vertical-align:middle;
 	cursor:pointer;
}
DIV#navigation img:hover{
  	background: #efefef;
 	color: black;
}

DIV#albums, DIV.page{
	margin-left:15px
}

div#topbutton
{
	position:fixed;
	top: 30px;
	right: 20px;
	background: url("../images/topbutton.png");
        height: 100px;
        width: 100px;
}
@media screen and (min-width: 1001px) {
  div#container
{
	margin-top:70px;
}
  div#bottomnav{
	display:block;
	width:100%;
        overflow:hidden;
	height: 70px;
        background-color: #000;
        position:absolute;
	top: 0px;
	left:0px;
	text-align: center;        
  }
  div#bottomnavbtns{
	margin-left: auto;
        margin-right: auto;
        margin-top:14px;
	max-width:90%;
  }
  .btm_btn{
        display:inline;
        max-width: 145px;
	margin-top:0px;
	margin-left:70px;
	margin-right:70px;
	cursor:pointer;
        clear:none;
  }
  .btm_btn img{
	vertical-align:middle;
	height: 40px;
  }
  div#searchfrm{
        position:fixed;
        top: 70px;
	left:400px;
        width:350px;
        font-size:20px;
  }
  #searchbox2{
        font-size:20px;
  }
  div#commentfrm{
        position:fixed;
        top: 250px;
	left:320px;
        font-size: 25px;
	max-width: 500px;
	margin: auto;
  }
  #txtbox{
	font-size:25px;
  }
  #sendbtn{
	width:80px;
	margin-left:42%
  }
  #go_btn{
	width:25px;
	vertical-align:middle;
  }
}
@media screen and (max-width: 1000px) {
  div#container
  {
	margin-bottom:7vh;
	overflow:hidden;
  }
  div#bottomnav{
	display:sticky;
	width:100%;
        overflow:hidden;
	height: 7vh;
        background-color: #000;
        position:fixed;
	bottom: -3px;
	left:0px;
	text-align: center;        
  }
  div#bottomnavbtns{
	margin-left: auto;
        margin-right: auto;
        margin-top:1.5vh;
	width:95vw;
  }
  .btm_btn{
        display:inline;
        max-width: 132px;
	margin-top:0px;
	margin-left:4.2vw;
	margin-right:4.2vw;
        cursor:pointer;
        clear:none;
  }
  .btm_btn img{
	vertical-align:middle;
	height: 3vh;
  }
  div#searchfrm{
        position:relative;
	width:95%;
	font-size:4vw;
  }
  #searchbox2{
        font-size:4vw;
  }
  div#commentfrm{
        position:relative;
	width:95%;
        font-size: 4vw;
  }
  #txtbox{
	font-size:4vw;
  }
  #sendbtn{
	width:15vw;
	margin-left:25%
  }
  #go_btn{
	width:6vw;
	vertical-align:middle;
  }
}
DIV#searchfrm
{
	background-color: rgba(30,30,30,1.0);
	padding:30px;
        color: #FFF;
        font-size: 3vw;
}

/* The Modal (background) */
.modal {
 	display: none; /* Hidden by default */
 	position: fixed; /* Stay in place */
 	z-index: 1; /* Sit on top */
 	left: 0;
 	top: 0;
  	width: 100%; /* Full width */
 	height: 100%; /* Full height */
 	overflow: hidden; /* Enable scroll if needed */
 	background-color: rgb(0,0,0); /* Fallback color */
 	background-color: rgba(0,0,0,0.7); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
        color: #DDD;
 	background-color: rgba(50,50,50,1.0);
 	font-size: 3vw;
  	margin: 20% auto; /* 15% from the top and centered */
	padding: 20px;
	width: 80%; /* Could be more or less, depending on screen size */
	max-width: 750px;
	max-height: 500px;
	text-align: center;
}

/* The Close Button */
.close {
	color: #aaa;
	position:relative;
	font-size: 50px;
	margin-top:-20px;
	font-weight: bold;
	float:right;
}

.close:hover,
.close:focus {
	color: black;
	text-decoration: none;
	cursor: pointer;
}
DIV#commentfrm
{
	background-color: rgba(30,30,30,1.0);
	padding:2vw;
        color: #FFF;
}
DIV#menuz
{
	background-color: rgba(30,30,30,0.7);
	padding:30px;
	max-width: 900px;
	margin: 100px auto;
}
DIV#menuz a
{
	text-decoration:none;
        background:none;
	border:0;
}
DIV#login form label, DIV#register form label{
	font-size:3vh;
}
DIV#login form input, DIV#register form input{
	flex-grow:1; font-size: 3vh; padding:1vh; border:2px solid #95035c
}
.backbtn
{
	background-color: #ebdbc6; margin-top:3vh; height: 5vh; text-align:center; cursor:pointer; font-size:3.5vh; padding-bottom:.6vh
}
div#login, div#register, div#choose
{
	max-width:800px; margin: 0 auto;
}
.field_with_errors{
	background-color:#95035c;
}