body {
	margin: 0px;
	font-family: arial, helvetica, verdana;
	font-size: small;
	background-color: #000000;
	color: #000000;
}

img {
	border: none;
}

a:link {
	color: #000000;
	text-decoration: underline;
}

a:active, a:visited {
	color: #000000;
	text-decoration: underline;
}

a:hover {
	text-decoration: none;
	}

#container {
	width: 100%;
}

header	{
	position: relative;
}

#banner	{
	width: 100%;
	display: block
}

	@media (min-width: 480px) {

		#logo {
			position: absolute;
			left: 4px;
			top: 65px;
		}
	}
	
	@media (max-width: 480px) {

		#logo {
			position: absolute;
			left: 4px;
			top: 60px;
		}
	}

#logo img	{
	width: 100%
}

#icons {
	position: absolute;
	left: 10px;
	top: 10px;
}

	@media (min-width: 480px) {

		#icons img {
			float: left;
			margin-left: 0px;
			margin-right: 10px;
			height: 32px;
		}
	}

	@media (max-width: 480px) {

		#icons img {
			float: left;
			margin-left: 0px;
			margin-right: 9px;
			height: 30px;
		}
	}

nav	{
	background-color: #000000;	
	overflow: hidden;
	/* ^ TEMP ? */
	position: relative;
	color: #FFFFFF;
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
}

nav .hi	{
	background-color: #FFFFFF;
	color: #000000;
}

nav ul	{
	margin: 0px;
	padding: 0px;
	list-style: none;
}

	@media (min-width: 480px) {

		nav li {
			padding: 5px 10px 5px 10px;
			font-size: 150%;
			font-weight: bold;
			float: left;
		}
	}

	@media (max-width: 480px) {

		nav li {
			padding: 5px 10px 5px 10px;
			font-size: 100%;
			font-weight: bold;
			float: left;
		}
	}

nav a:link {
	color: #FFFFFF;
	font-size: 100%;
	text-decoration: none;
	font-weight: normal;
}

nav a:active,
nav a:visited {
	color: #FFFFFF;
	text-decoration: none;
	font-weight: normal;
}

nav a:hover {
	text-decoration: underline;
	font-weight: normal;
	}
	
main	{
	background: rgba(255, 255, 255, 0.85);
	padding: 1.8% 1.4% 1.8% 1.4%;
	text-align: left;
	overflow: hidden;
	display: block;
}

main img {
	background-color: #FFFFFF;
	padding: 0px;
	border: solid 1px #AAAAAA;
	max-width: 100%;
}

/* used only on front page for portrait and legendary live pic on News page*/
#main_pic	{
	width: 100%;
	max-width: 400px;
}

table	{
	border-collapse: collapse;
}

main td, main th	{
	padding: 3px;
	border: solid 1px #AAAAAA;
	}

main td p	{
	padding-bottom: 0px;
}

main td img	{
	border: 0px;
	width: 25px;
	height: 25px;
	margin-left: 4px; /* <-- check! */
}
/* had to add #main to all the above to lose the border round the Facebook gig icon... */

p	{
	margin: 0px;
	padding-top: 0px;
	padding-bottom: 8px;
}

h1	{
	font-size: 150%;
	margin-bottom: 0px;
	padding-bottom: 5px;
}

.youtube {
    position: relative;
    width: 100%;
    height: 0px;
    padding-bottom: 60%;
}
.video {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

hr	{
	margin-bottom: 6px;
	clear: both;
}

.gig_date	{
	width: 30%;
	min-width: 155px;
}
/* ^ improve this and add the td in at the begining... */

.venue	{
	float: left;
	clear: none;
}

.fb	{
	float: right;
	clear: none;
}

.album {
	background: rgba(255, 255, 255, 0.5);
	margin-bottom: 5px;
	border: solid 1px #AAAAAA;
	width: 97%;
	padding: 1%;
	clear: both;
}

.album h1	{
	font-size: 100%;
}

.album h1 em	{
	font-weight: normal;
	font-style: normal;
}

.album li	{
	text-align: left;
}

.album img	{
	width: 30%;
	max-width: 180px;
	float: right;
	margin-left: 1%;
	margin-right: 2%;
}

ol li	{
	margin-bottom: 4px;
}

*/

.online_stores	{
	width: 100%;
}

.online_stores img	{
	width: 22%;
	margin-right: 0.2%;
	margin-bottom: 5px;
}

#contact_form {
	border: 1px solid #000000;
	background: #FFFFFF;
	width: 95%;
	padding: 2%;
	overflow: hidden;
}

#contact_form label {
	padding-top: 2px;
	text-align: left;
	float: left;
	clear: both;
}

#contact_form input.field {
	float: left;
	padding: 2px;
	border: solid 1px #000000;
	width: 50%;
	background-color: #e3dfc2;
	font-size: large;
	margin: 0px 0px 10px 0px;
	clear: both;
}

#contact_form textarea {
	float: left;
	padding: 2px;
	border: solid 1px #000000;
	width: 98.5%;
	background-color: #e3dfc2;
	font-family: arial, helvetica, verdana;
	font-size: large;
	margin: 0px 0px 10px 0px;
	clear: both;
	overflow: auto;
}

#contact_form input.button {
	border: solid 2px #000000;
	font-size: large;
	width: 85px;
	height: 40px;
	float: left;
	clear: both;
}

.small	{
	font-size: 80%
}

#footer_normal {
	display: none;
}

#footer_mobile {
	background-color: #000000;
	overflow: hidden;
}

#footer_content	{
	margin: 0 auto;
	width: 270px;
	/* ^ KEY TO MAKING IT CENTER!! */
}

#footer_content p	{
	padding-top: 6px;
	padding-bottom: 0px;
	font-size: small;
	text-align: center;
	color: #FFFFFF;
}

#footer_content img	{
	margin: 4px;
	padding: 1px;
	border: solid 1px #AAAAAA;
	width: 120px;
	height: 40px;
}