/*kab 2019*/
/*colours*/
/* #eee; pale grey */
/* #5B676d medium greenish grey */
/* #013E39  dark pine green */

/*------------------reset----------------*/
/*reset browser defaults - does this support usability even though it overwrites user defaults? */

body {
width:100%;
}

figure > image {
width:80%;
height:auto;
}


body, html, a, * {
margin:0;
padding:0;
font-size:16px;
font-family: Raleway, "Open Sans";
color:#013E39; /*deep pine green */
}

/*changes box model to have padding not increase size of element, as per Christina Truong.  REvised from Morten where was just asterisk in place of html.*/

html {
  box-sizing: border-box;
}

*, *:before, *:after {
box-sizing:inherit;

}

/* ---------------skip to content----------- */
a#skipNav {
position:absolute;
top:-50px;
left:-50px;
color:white;
background-color:white;
}

/*---------global----------*/



/* Add padding to all of the .container child elements */
.site {
padding: 2em;
width:100%;
}

#masthead-full {
background:#000 url("../images/RamblinRector_smallwhiteroses_2021June.jpg") 20% 70% no-repeat;
/*background:#000 url(../images/gardenflowerslayers.jpg) 80% 100%;*/
/*background:#000 url(../images/annavalley-snowytrees.png) 50% 60% no-repeat;*/
/*background:#000 url(../images/fl_sunrise_roses_fence_2.jpeg) 30%   60% */
/* opacity set on image not text */
/* background-size:contain; */
}

section#masthead-full img {
    opacity:.5;
    }


h1  {
    opacity:1;
    }


 main {
	 margin: 0;
/*	padding:2em;*/
	padding:0;
	 }

.siteDescrip {
margin-left:2em;
}


p{
margin-right: 1.1em;
margin-bottom:1.2em;
}

h1 {
font-size:1.6em;
padding-top:2px;
color:#013e39;
line-height:1.4em;

}



h2 {
font-size:1.2em;
padding-top:1px;
}

ul {
list-style-position:inside;

}



li a:hover {
box-shadow: 12px 6px 0 1px rgba(56, 73, 56, .2);
background-color:#556A71;
}

li a {
text-decoration:none;
}

a.current-page:hover {
font-weight:900;
}

.clear {
clear:both;
}



h2 {
/*font-variant:small-caps;*/
margin-bottom:.2em;
}

aside {
/*background:	#ccc;*/
font-size:2em;
padding:0;
font-family: Raleway, "open sans";
margin-bottom:2em;

}

.author {
	font-family:"times New Roman", serif;
	font-size:.8em;
	}

address {
font-size:.8em;
color:white;
background:#013E39;
padding:1em 4em;
}

address a {
color:white;
background-color:#013E39;
font-size:.8em;
}


.container {   /*enable zero marging or padding on figures in page */
margin:0;
padding:0;
}

@media only screen and (min-width:900px){
	.main-content {
		columns:1;
		padding-right:4em;
		margin-right:auto;
		margin-left:auto;
		}


	p {
		font-size:1.2em;
		line-height:1.6em;
		color:#999;
}
	h3 {
		/* margin-left:1em; */
	/* 	padding-top:1em; */
		font-size:2em;
		line-height:1.4em;
		color:#999;
		}
 h3#filtered {margin-left:1em;}


}


#masthead-about {
background: url(../images/fl_rosefence2.jpg) 20% 80% no-repeat;
}

#masthead-home {
    background: url(../images/RamblinRector_smallwhiteroses_2021June_dash.jpg) 50% 80% no-repeat;
    opacity:95%;
    background-size:cover;
}

#masthead-tech {
    background: url(../images/fl_rosefence2.jpg) 50% 60% no-repeat;
    opacity:95%;
    background-size:cover;
}


#masthead-gallery {
    background: url(../images/Europeangoldfinch2021.jpg) 50% 30% no-repeat;
    opacity:95%;
    background-size:cover;
}

#masthead-work {
    background: url(../images/NT_lesstravelledpaths_cows_belisk_480.jpeg) 50% 60% no-repeat;
    opacity:95%;
    background-size:cover;
}

#masthead-personal {
    background: url(../images/LymeRegisBay_Banner.png) 50% 80% no-repeat;
    opacity:95%;
    background-size:cover;
}

.productlist {
margin-bottom:1em;
}

ul li {
	list-style-type: square;
	/*padding:2px;*/
	}

ul.resources li {
	list-style-type: none;
	font: 1em "Times New Roman";
	margin-left:1em;

	}

h1 {
	color:#013E39;
	text-align:center;
	margin:0;
	letter-spacing:.1em;
	font-size:2em;

	}



ul.product list {
margin-left:5px;

}



@media only screen and (min-width:900px){
/*
	.main-content {
		columns:1;
		padding-right:2em;
		margin-right:auto;
		margin-left:5%;

		}
 */

	h1 {
	letter-spacing:.2em;
	font-size:4.6em;
	line-height:4em;
	}

	p {
		font-size:.8em;
		line-height:3em;
		}



	aside p  {
	width:100%;
	line-height:110%;

	}

	h3{

		font-size:2em;
		color:#013E39
		}

	h4{
		color:#013c39;
		}




}




/* ============================================================
   GALLERY COVER BANNER  —  added 15 Aug 2026
   All gallery pages now carry <section id="masthead-gallery">
   around the logo and the two nav bars, matching the home page.
   A minimum height so the photograph is actually visible.
   ============================================================ */

#masthead-gallery {
    background-size: cover;
    min-height: 34vh;

    /* was: display:flex; flex-direction:column; justify-content:space-between;
       space-between pushes the children to the far ends of the box, which
       is exactly the gap between the top nav and the sub nav. A plain
       block stacks them tight and lets the photo fill what is left.
       15 Aug 2026. */
    }

@media only screen and (min-width: 700px) {
    #masthead-gallery { min-height: 40vh; }
}