u { display: none; }
* { margin: 0; padding: 0; }
header#main { display: block; }
a img { border-style: none; }

body {
	font-family: 'Montserrat',arial,sans-serif;
	background-color: #000;
	background-image:url(../images/convulsions-full.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	color: #333;
	}
body#photos { background-image:url(../images/convulsions-sepia.jpg); }

h1 {
	width: 96vw;
	position: relative; z-index: 1;
	padding: 0.3vh 0.3vw;
	font-size: 120%;
	font-weight: 700;
	color: #d3d32a;
	background-color: #000;
	border-color: #d3d32a;
	border-width: 6px;
	border-style: solid;
	}

p {
	padding-top: 0.5em;
	line-height: 1.5;
	}
footer {
	width: 90%;
	margin: 0 auto;
	}
footer p { margin-bottom: 1em; }
footer h4 {
	background-color: #999;
	border: none;
	cursor: pointer;
	width: 100vw;
	padding: 0.2em 0;
	color: #bbb;
	font-weight: 400;
	font-size: 100%;
	/* default fallback */
	background: rgb(75, 75, 75) transparent;
	/* nice browsers */
	background: rgba(75, 75, 75, 0.8);
	}

ol { margin: 0.5em 0 0.5em 1em; }

.img {
	text-align: center;
	font-size: 90%;
	}
.right {
	float: right;
	margin: 0 0 0.5em 1em;
	}
.left {
	float: left;
	margin: 0 1em 0.5em 0;
	}
 .full { width: 100%; }

.hide { display: none; }
.cleft { clear: left; }
.cright { clear: right; }
.cboth { clear: both; }
	
	
/* =========================================================================
// HEADER
/* ========================================================================= */

	


/* =============================================================================
// NAV
/* ============================================================================= */


header nav ul { display: none; }
header nav ul.subhead { font-size: 90%; }
header nav ul, header nav li, .accordion-toggle { width: 100%; }
header nav li a {
	width: 100%;
	display: block;
	text-align: center;
	color: #fff;
	text-decoration: none;
	padding: 0.5em 0;
	/* default fallback */
	background: rgb(51, 102, 153) transparent;
	/* nice browsers */
	background: rgba(51, 102, 153, 0.6);
	/* IE 6/7 */
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#44336699, endColorstr=#44336699);
	/* IE8 */    
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#44336699, endColorstr=#44336699)";
	}
header nav li.index a::before {
	content: "\f015";
	font-family: fontawesome;
	}
header nav li.facebook a::before {
	content: "\f082";
	font-family: fontawesome;
	}
h4.accordian-toggle {
	width: 100vw;
	height: 20px;
	padding: 15px 0;
	position: absolute; top: 0; left: 0;
	border-width: 0;
	cursor: pointer;
	text-align: center;
	background-color: #335166;
	color: #fff;
	}

/* =============================================================================
// BODY
/* ============================================================================= */


#locales {
	position: relative; top: 1em; left: 1em;
	color: #fff;
	}
#calendar {
	max-width: 70vw;
	max-height: 70vh;
	overflow: auto;
	margin: 40px auto;
	padding: 0 10px;
	}

#datedgigslist div {
	text-align: center;
	margin-bottom: 3vh;
	}


/* =============================================================================
// FOOTER
/* ============================================================================= */


footer {
	position: fixed; z-index: 10;
	bottom: 0;
	left: 0;
	width: 100%;
	text-align: center;
	}
footer div { font-size: 85%; line-height: 1; }

ul#social {
	list-style: none;
	padding: 0.5em 0;
	}
ul#social li {
	display: inline-block;
	vertical-align: top;
	}

ul#social li a { text-decoration: none; }
ul#social li a:link { color: #c60; }
ul#social li a:hover,
ul#social li a.fa:hover { color: #000; }
ul#social li a:visited { color: #000; }

ul#social li img {
	height: 40px;
	float: left;
	margin-left: 0.5em;
	}


/* =============================================================================
// #TOP ARROW STYLE
/* ============================================================================= */


.cd-top.cd-is-visible {
	/* the button becomes visible */
	visibility: visible;
	opacity: 1;
	}
.cd-top.cd-fade-out {
	/* if the user keeps scrolling down, the button is out of focus and becomes less visible */
	opacity: .5;
	}
.cd-top {
	display: inline-block;
	height: 40px;
	width: 40px;
	position: fixed;
	bottom: 40px;
	right: 10px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	/* image replacement properties */
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	background: rgba(200, 200, 42, 0.8) url(../images/cd-top-arrow.svg) no-repeat center 50%;
	visibility: hidden;
	opacity: 0;
	-webkit-transition: opacity .3s 0s, visibility 0s .3s;
	-moz-transition: opacity .3s 0s, visibility 0s .3s;
	transition: opacity .3s 0s, visibility 0s .3s;
	}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
	-webkit-transition: opacity .3s 0s, visibility 0s 0s;
	-moz-transition: opacity .3s 0s, visibility 0s 0s;
	transition: opacity .3s 0s, visibility 0s 0s;
	}
.cd-top.cd-is-visible {
	/* the button becomes visible */
	visibility: visible;
	opacity: 1;
	}
.cd-top.cd-fade-out {
	/* if the user keeps scrolling down, the button is out of focus and becomes less visible */
	opacity: .5;
	}
.no-touch .cd-top:hover {
	background-color: #e86256;
	opacity: 1;
	}


/* =========================================================================
// BUTTONS
/* ========================================================================= */

div.button { margin: 1em 0; }
a.button, span.button {
	display: block;
	text-align: center;
  		font-weight: 700;
  		font-size: 1.2em;
	padding: 0.3em;
	text-decoration: none;
	color: #036;
	background-color: #eff;
	
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	box-shadow:
		0 0 0 4px #ddd,
		0 0 0 9px #0090d3;
	}
a.button:active { background-color: #ddd; }
article a.button,
article span.button { width: 100%; }
#map aside span.button {
	position: relative; left: 6px; top: 6px;
	width: 93%;
	}
i.lmf { cursor: pointer; }
.venue-info {
	border: 1px solid #fff;
	padding: 1vw;
	margin-top: 1vw;
	display: none;
	}
	


/* =============================================================================
// #FORMS
/* ============================================================================= */

form div { padding: 0.5em; }

form div.textinput label,
form div.textinput input,
form div.textinput textarea,
form div.textinput span {
	font-size: 100%;
	display: inline-block;
	vertical-align: top;
	}
label {
	width: 20%;
	border-bottom: 1px solid #ccc;
	}
textarea { margin-bottom: 0.5em; }

form div.textinput input,
form div.textinput textarea {
	padding: 0.3em;
	border-color: #0090d3;
	border-width: 1px;
	border-style: solid;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	}
form div.submit input { margin-left: 20%; }
fieldset {
	background-color: #e3d3a3;
	margin-bottom: 1em;
	border-color: #0090d3;
	border-width: 1px;
	border-style: solid;
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	}
fieldset#blankfieldset { background-color: #f1f7e8; }
legend {
	margin-left: 30px;
	color: #fff;
	background-color: #666;
	padding: 2px;
	border-color: #999;
	border-width: 1px;
	border-style: solid;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}

.styled select {
	background: transparent;
	width: 5em;
	font-size: 100%;
	overflow: hidden;
	height: 1.5em;
	position: relative; left: -2px; top: -2px;
	}
.styled.long select { width: 40em; }

.styled {
	display: inline-block;
	width: 3.9em;
	border-color: #0090d3;
	border-width: 1px;
	border-style: solid;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	overflow: hidden;
	background: url(../images/select-arrow.png) 96% / 20% no-repeat #efefef;
	}
.styled.long {
	width: 38.9em;
	background: url(../images/select-arrow.png) 98% / 2% no-repeat #efefef;
	}

select.notowned option.notowned { display: none; }


/* =============================================================================
// #TESTIMONIALS
/* ============================================================================= */



/* =============================================================================
// #SLIDESHOW
/* ============================================================================= */


#slideshow {
	float: right;
	margin-left: 40px;
	position: absolute;
	width: 260px;
	height: 380px;
	padding: 10px;
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
	}

#slideshow > div {
	position: absolute;
	top: 10px;
	left: 10px;
	right: 10px;
	bottom: 10px;
	}

#slideshow > div img {
	width: 260px;
	max-height: 380px;
	}

	


/* =============================================================================
// #GALLERY
/* ============================================================================= */

#photos div.sample {
	display: inline-block;
	margin: 1vw;
	width: 24vw;
	height: 16vw;
	box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.2);
	}
#photos div.sample a {
	display: block;
	width: 24vw;
	height: 16vw;
	overflow: hidden;
	}
#photos div.sample img { width: 100%; height: 100%; }
	


/* =============================================================================
// FULL SCREEN
/* ============================================================================= */

@media screen and (min-width: 1200px) {
	
	section { position: relative; }
	
	/* =========================================================================
	// HEADER
	/* ========================================================================= */

	h4.accordian-toggle { display: none; }
	
	a#homelink {
		position: fixed; z-index: 3;
		top: 2px; right: 2px;
		width: 20vw;
		}
	a#homelink img { width: 100%; }
	#animate {
		position: relative;
		width: 40vw;
		}
	
	h1 {
		position: relative; left: 1vw; top: 4vh;
		font-size: 2.7vh;
		-webkit-border-radius: 9px;
		-moz-border-radius: 9px;
		border-radius: 9px;
		box-shadow:
			0 0 0 6px #e25327,
			0 0 0 12px orange;
		}
	
	header nav ul { display: block; }
	header { height: 7vh; width: auto; }
	header nav ul {
		width: auto;
		padding: 2vh 0.5vw;
		}
	header nav ul li {
		width: 8vw;
		margin-right: 0.5vw;
		display: inline-block;
		vertical-align: top;
		}
	header nav ul li a {
		display: block;
		width: 100%;
		font-size: 2.3vh;
		padding: 1vh 0 1vh;
		text-align: center;
		text-decoration: none;
		font-weight: 700;
		color: #333;
		
		-webkit-border-radius: 6px;
		-moz-border-radius: 6px;
		border-radius: 6px;
		
		/* default fallback */
		background: rgb(255, 255, 255) transparent;
		/* nice browsers */
		background: rgba(255, 255, 255, 0.8);
		}
	
	header nav ul li.about a, header nav ul li.photos a { background-color: #e25327; color: #fff; }
	header nav ul li.music a, header nav ul li.dates a { background-color: #ffa600; }
	header nav ul li.videos a, header nav ul li.contact a { background-color: #d3d32a; }
	
	header nav ul li.highlight a { background-color: #fff; color: #000; }
	
	header nav ul li.index a {
		background-color: transparent;
		padding: 0;
		}
	header nav ul li.index a::before {
	content: "\f015";
	font: 200% fontawesome;
	color: #fff;
	}
	
	header nav ul li.facebook {
		width: 3vw;
		position: relative; top: -0.5vw; left: 1vw;
		}
	header nav ul li.facebook a { width: 100%; heifht: 100%; }
	header nav ul li.facebook a::before {
	content: "\f082";
	font: 200% fontawesome;
	color: #000;
	}
	
	
	/* =========================================================================
	// BODY
	/* ========================================================================= */

	#index article,
	#about article,
	#music article,
	#dates article,
	#contact article,
	#login article,
	#register article,
	#parent-edit article {
		position: relative; top: 15vh; z-index: 2;
		width: 50vw;
		padding: 2vh 2vw;
		font-size: 2.3vh;
		background-color: #d3d32a;
		border-color: orange;
		border-width: 6px;
		border-style: solid;
		-webkit-border-radius: 9px;
		-moz-border-radius: 9px;
		border-radius: 9px;
		box-shadow: 0 0 0 6px #e25327;
		margin-left: 40vw;
		}
	#index aside { position: absolute; top: 30vh; left: 2vw; }
	#about article {
		margin-left: 5vw;
		height: 60vh;
		width: 85vw;
		column-count: 2;
		column-gap: 3vw;
		overflow: auto;
		}
	aside {
		display: block;
		width: auto;
		position: absolute; top: 20vh; left: 2vw;
		}
	#about aside { position: absolute; top: 15vh; left: 0; }
	#about aside img { width: 40vw; }
	#press article {
		margin-top: 10vh;
		padding: 1vh 0 0 3vw;
		}
	#press div.snippet {
		display: inline-block;
		vertical-align: top;
		width: 25vw;
		height: 60vh;
		overflow: auto;
		padding: 2vh 2vw;
		margin-right: 2vw;
		background-color: #d3d32a;
		border-color: orange;
		border-width: 6px;
		border-style: solid;
		-webkit-border-radius: 9px;
		-moz-border-radius: 9px;
		border-radius: 9px;
		box-shadow: 0 0 0 6px #e25327;
		}
	#music article,
	#photos article,
	#dates article {
		position: relative; top: 8vh;
		width: 80vw;
		height: 67vh;
		margin: auto;
		overflow: auto;
		}
	#contact article {
		position: relative; top: 15vh;
		margin: auto;
		}
	#music article img {
		width: 100%;
		}

	

	/* =============================================================================
	// FOOTER
	/* ============================================================================= */

	.accordian-tail { display: none; }
	
	
	/* =========================================================================
	// PARTICULAR
	/* ========================================================================= */
	
	#dateSelector {
		position: absolute; top: 2vh; right: 4vw;
		text-align: center;
		}
	
	div.playlist {
		width: 49%;
		display: inline-block;
		vertical-align: top;
		margin-top: 5vh;
		}
	div.jp-audio { margin: auto; }
	div.playlist h3 {
		background-color: #7a007c;
		color: #fff;
		font-size: 1.3vw;
		text-align: center;
		width: 80%;
		margin: 0 auto 0.3vw;
		height: 4vw;
		border: 6px solid #7a007c;
		-webkit-border-radius: 9px;
		-moz-border-radius: 9px;
		border-radius: 9px;
		}
	
	}