/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

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%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

body{font-family:"proxima-nova";line-height:1.4;}

header{width:25%;float:left;background: #0d1f2d;position:relative;}

header h1{width:100%;height:240px;background:#0d1f2d url('/assets/img/staithes_fest.jpg') center center no-repeat;background-size:220px;text-indent:-100000px;}

header nav{padding:1rem;box-sizing:border-box;padding-bottom:1rem;}
header nav a.menu{display:none;}
header nav ul{box-sizing:border-box;border-bottom:1px solid #fff;padding-bottom:2rem;}
header nav ul li{line-height:2rem;}
header nav ul li ul{border-bottom:none;padding-bottom:0px;margin-left:2rem;display:none;}
header nav ul li.selected ul,header nav ul li.ancestor ul{display:block;}
header nav ul li a{color:#fff;text-decoration: none;}
header nav ul li a:hover{color:#ccc;}
header nav ul li.selected a,header nav ul li.ancestor a{text-decoration: underline;}
header nav ul li.selected ul li a,header nav ul li.ancestor ul li a{text-decoration: none;}
header nav ul li.ancestor ul li.selected a{text-decoration: underline;}

header .intro{padding:1rem;}
header .intro p{margin-bottom:1rem;color:#fff;}
header .intro p:last-child{margin-bottom:0px;}

header .intro a{
	color:#fff;
}

header img{background:#fff;padding:1rem;box-sizing:border-box;width:100%;height:auto;margin-bottom:-10px;margin-top:1rem;}

.page{width:75%;float:left;position:relative;}
.page .hero{width:100%;height:280px;background:#ccc;margin-bottom:2rem;position:relative;overflow:hidden;}
.page .hero img{width:100%;height:auto;}
.page .hero p{position:absolute;bottom:0px;right:0px;padding:4px 8px;font-size:0.8rem;color:#ccc;background:#fff;}
.page .hero p a{color:#ccc;}
.page .content{width:100%;float:left;box-sizing:border-box;padding:1rem;}
.page .content h1{font-size:3rem;font-weight:700;color: #0d1f2d;margin-bottom:1rem;}
.page .content h2{font-size:3rem;font-weight:700;color: #0d1f2d;margin-bottom:1rem;}
.page .content h3{font-size:2.4rem;font-weight:700;color: #0d1f2d;margin-bottom:1rem;}
.page .content p{color:#222;margin-bottom:1rem;max-width:700px;}
.page .content ul{color:#222;margin-bottom:1rem;list-style-type:disc;margin-left:2rem;}
.page .content ol{color:#222;margin-bottom:1rem;list-style-type:decimal;margin-left:2rem;}
.page .content strong{font-weight:700;}
.page .content img{max-width:100%;height:auto;}
.page a.button{background: #0d1f2d;color:#fff;text-decoration: none;font-weight:700;padding:0.5rem 1rem;margin-bottom:0.5rem;float:left;}
.page p.date,.page p.meta{color:#747474;font-style:italic;}
.page a{color: #0d1f2d;}
.page a:hover{color:#ccc;}

.content-block{width:100%;float:left;margin-bottom:1rem;display:block;background:#f1f2f2;}
.content-block .image{width:300px;}
.content-block .image img{max-width:100%;height:auto;float:left;}
.content-block .text{padding:1rem;float:left;background:#f1f2f2;display:block;}
.content-block .text p{max-width:700px;}
.content-block .text h2{font-size:2rem;}
.content-block .text h2 small{color:#222;font-size:1rem;}

.content-block.swap .text{width:100%;box-sizing:border-box;}
.content-block.swap .image{float:right;padding:1rem;background:#fff;margin-left:2rem;margin-bottom:2rem;}

.content-block-small{width:300px;margin-right:2rem;float:left;margin-bottom:1rem;}
.content-block-small img{width:100%;height:auto;margin-bottom:-7px;aspect-ratio: 1 / 1;object-fit: cover;}
.page .content-block-small h3{display:block;width:100%;background:#f1f2f2;color: #0d1f2d;text-align: center;font-size:1.4rem;line-height:3rem;}
.content-block-small a{color: #0d1f2d;text-decoration: none;}

footer{margin-top:2rem;padding:2rem 1rem;box-sizing:border-box;float:right;border-top:1px solid #ccc;width:100%;}
footer p{color:#ccc;font-size:0.8rem;}
.page footer p a{color:#747474;border-bottom:1px dotted #eee;text-decoration: none;}
.page footer p a:hover{color:#222;}

iframe{max-width:100%;}

.page .content p.alphabet{max-width:100%;font-size:1.4rem;}
p.alphabet a{margin-right:1rem;}

p.social{font-size:2rem;margin-bottom:0px;}
p.social a{text-decoration: none;}
p.social a{margin-right:1rem;}

form .input{width:100%;float:left;border-bottom:1px solid #eee;padding:20px;box-sizing:border-box;}
form textarea{clear:both;width:600px;max-width:100%;margin-bottom:1em;float:left;}
form label{float:left;width:100%;}
form input[type=submit]{clear:both;background:#ccc;color:#fff;border:none;padding:10px 30px;font-size:1em;font-family:'proxima nova';clear:left;cursor:pointer;}
form input[type=submit]:hover{background: #0d1f2d;}

@media screen and (max-width:1500px){
	header{width:25%;}
	.page{width:75%;}
	.page .hero img{height:100%;width:auto;}
	
	.content-block .image{width:30%;}
	.content-block .text{box-sizing: border-box;width:70%;}
}

@media screen and (max-width:1150px){
	header{width:30%;}
	.page{width:70%;}
	header .intro{display:none;}
	header nav ul{border-bottom:none;padding-bottom:0px;}
	.page .hero img{margin-left:-200px;}
}

@media screen and (max-width:990px){
	header img{display:none;}
	header h1{float:left;box-sizing:border-box;background-size:140px;width:30%;height:140px;}
	header nav{padding:0px;width:50%;float:right;z-index:2000;position:relative;}
	header nav a.menu{display:block;color:#fff;font-size:1.4rem;text-decoration: none;line-height:140px;margin-right:1rem;float:right;}
	header nav ul{position:absolute;top:140px;right:0px;width:300px;padding:1rem;background: #0d1f2d;text-align:left;display:none;}
	header nav ul li{overflow:hidden;}
	header nav ul li ul{position:relative;top:0px;padding:0px;margin:0px;left:2rem;background:none;}
	header h1{width:280px;padding:0px 1rem;}
	header{width:100%;}
	.page{width:100%;}
	.page .hero img{margin-left:-200px;}
}

@media screen and (max-width:680px){
	header h1{width:50%;box-sizing: border-box;}
	footer p{font-size:0.8rem;}
}

@media screen and (max-width:620px){
	.page .content h1{}
	.page .content h2{font-size:2.4rem;}
	.page .content h3{font-size:2rem;}
	.page .hero{height:200px;}
}

@media screen and (max-width:400px){
	header h1{height:100px;background-size:100px;}
	header nav a.menu{line-height:100px;}
	header nav ul{top:100px;}
	.content-block .image{width:100%;}
	.content-block .text{box-sizing: border-box;width:100%;}
	.page .hero{height:140px;}
	.content-block.swap .image{padding:0px;}
}

@media screen and (max-width:300px){
	header nav ul{width:100%;}
}

.ml-embedded.mobile{
	display:none;
}

.ml-embedded.desktop{
	display:none;
}

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

	.ml-embedded.desktop{
		display:none;
	}
	
	.ml-embedded.mobile{
		display:none;
	}

}