:root {
		/*area colours*/
		--bg-color: #726e5d;/*not visible if background image is tiled*/
		--header-color:#d3ccab;
		--main-color: #f8f4e1;
		--footer-color:var(--header-color);
		--button-color: #8d936c;
		--divider-color:#3B2727;
		/*text colours*/
		
		--button-text-color: #ffffff;
		--text-default-color:#222222;
		--heading-color:#333333;
		/*link colours*/
		--hover-color:#333333;
		--visited-color:#50647e;
		--link-color:#6e839f;
	}


body {padding: 0; margin: 0; background:var(--bg-color);
		font-family: 'Vollkorn Regular', Georgia, serif; color:var(--text-default-color);}

.home {background:var(--bg-color) url('../images/backgrounds/mossy-desat-fade.jpg'); background-repeat: repeat-x; }

p {font-size: 1.2em; color:var(--text-default-color);}
ul {color:var(--text-default-color);}
		
h1, h2 {margin:0; padding:0; font-size: 1.8em; color:var(--heading-color);}		
.container {width:100%; max-width:1200px; margin:0 auto; padding-top:30px; }
.header {width:100%; margin: 0 auto; padding:0; background:var(--header-color); border-top-left-radius: 20px; border-top-right-radius: 20px;}

h3 {color:var(--heading-color); font-style: italic;}

#logo {display:block; padding:5px; margin:0 auto;}
#strap {display:block; margin:0 auto; font-size:1.5em; text-align: center;}

a {color:var(--link-color);}
a:hover {color:var(--hover-color);}
a:visited {color:var(--visited-color);}

.content {width:100%; margin: 0 auto; padding:0; float:left; background:var(--main-color);}
.holder {width:100%; margin: 0 auto; padding:0; clear:both; border-top: 1px dotted var(--divider-color);}
.box {margin:0; padding:30px 15px;}
.boxwide {width:70%; margin:0; padding:30px 15px;}
.left {float: left; width:30%; }
.right {float: right;padding-top:30px; width:62%;}

.no-border {border-top: 0px!important;}

.content ul {font-size: 1.2em;}

.footer {width:100%; margin: 0 auto; background:var(--footer-color); float:left; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; margin-bottom:20px;}

.footerlinks {list-style:none; margin:5px; float:left;}
.footer a {color:#fff; font-weight:bold; }
.footer li {padding-top:7px;}
.footer ul {margin: 1%;}

.button {display: block; clear: both;}
.button a {
  background-color:var(--button-color);
  border: none;
  color: var(--button-text-color);
  padding: 12px 30px;
  text-align: center;
  text-decoration: none;
  margin:5px 0px;
  display:inline-block;
  font-size: 1.5em;
  border-radius: 10px;
}

.albums {
		         list-style-type:none; display:inline;}
		         
		         .albums ul li {display:inline; width:200px; }
		         
		         .albumcontainer {width:200px; float:left; padding-right:32px; padding-bottom: 30px; padding-left:5px; height:250px;}
		         
		         .albumcontainer img {padding-bottom:5px; float:left;}

.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;

}		         

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

body, html {background: var(--bg-color);}
#logo {width:100%; max-width:345px; height: auto; margin:0 auto; padding:0;}
.box {width:90%; padding:5px; float: left; margin:0 auto;}
.boxwide {width:90%; padding:5px; float: left; margin:0 auto;}
.right {padding:5px;}
.holder {padding: 10px 0 20px 0; }
.footer ul {width: 70%; margin: 0 auto;}
.footer a {font-size: 1.2em; text-decoration:none;}
.footer {border-bottom-left-radius: 0; border-bottom-right-radius: 0; margin-bottom:0;}
.container {padding-top:0;}
.header{border-top-left-radius: 0; border-top-right-radius: 0;}
.home {background: var(--bg-color) url('../images/backgrounds/nobg.png');}

}