/*
 Theme Name:   Womens Club
 Theme URI:    http://rgspaces.org.uk/womensclub
 Description:  The Friends of University of Reading Theme
 Author:       Annette Haworth
 Author URI:   http://rgspaces.org.uk
 rTemplate:     twentythirteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  the-friends
*/
/* need to be added to do the standard WP CSS stuff (adding things as we find them Sept 2024 AEH) */
.aligncenter {
  display: block;
  margin: 0 auto;
  }
  /* end of stuff we are shoving in as and when needed for standard WP stuff */
* {
	  margin: 0;
}
body {font-family: Arial, Helvetica, sans-serif; --w: 60vw;}
#headerimg {
	position: relative;
	width: var(--w);
	aspect-ratio: 3 / 1;
	background-color: white;
	/*background-image: url(https://rgspaces.org.uk/womensclub/wp-content/uploads/hoflanduor.png);*/
	/*background-image: url(https://rgspaces.org.uk/womensclub/wp-content/uploads/Banner-photo-e1759421481109.jpg);*/
	background-image: url(https://rgspaces.org.uk/womensclub/wp-content/uploads/cover-e1759571412827.jpg);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	margin-bottom: 20px;
}
#headerimg::after {
	/*content: 'Thomas Hofland, A View of White Knights from the Park with a Lady Sketching, c.1816, oil on canvas. University of Reading Art Collection, UAC/10236.';*/
	content: 'Club members at the Summer Party';
	position: relative;
	top: 100%;
	right: 0;
	font-size: 10px;
	width: var(---w);
	width: 100%;
	text-align: right;
	display: flex;
	justify-content: right;
}

#headerimg h1 {
	background-image: linear-gradient(transparent 0 15%, rgba(255, 255, 255, 0.5) 15% 90%, transparent 90% 100%);
	position: absolute;
	top: 35%;
	width: 100%;
}
#headerimg h1 a {
	text-decoration: none;
}
h1.entry-title {color:black;font-style:normal;font-weight:normal;}
#header {
	display: flex;
	color: black;
	justify-content: center;
	font-family: serif;
}
#header a { color: black; font-weight: normal; font-family: Ariel, Helvetica, sans-serif; font-size: 3vw;padding: 0; }
#header {
	  position: relative;
	  z-index: 2;
	  top: 15%;
	  text-align: center;
	  width: var(--w);
	  background-image: linear-gradient(rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));
	  background-size: 100% 2.8em;
	  background-repeat: no-repeat;
	  background-position: 0 55%;
	  left: 50%;
	  transform: translateX(-50%);
}
#page {
	  position: relative;
	  width: var(--w);
	  margin: 0 auto;
}
#page hr {
	display: none;
}
#footer p:last-child {
	display: none;
}
/* added by annette 27 august 2024 to give back aa gap for p elements */
p {
  margin-bottom: 1em;
}
a, a:visited { text-decoration: none; color: black; }
ul {list-style-type: none; width: 40vw;}
.lcp_catlist li { clear: both; padding-top: 1.5em;}
.lcp_catlist li div { padding-bottom: 1em;}
.lcp_catlist li > a { float: left; font-size: 9px;}
.lcp_catlist li img { padding: 0 2em 0 0; }
.lcp_catlist li div:first-child { font-weight: bold; font-size: 1.3em;}
ul.lcp_catlist { margin: 0 auto; }
#primary {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}
h2 {
	font-weight: normal;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	width: fit-content;
	padding-top: 1vw;
	font-size: 3vw;
}
#menu > ul{
  display: flex;
  flex-direction: row;
  width: 100vw;
  justify-content: center;
  left: -20vw;
  position: relative;
}
#menu > ul > li {
	margin: 2vw;
}
@media screen and (max-width: 1024px) {
	#menu > ul {
		left: 0;
	}
body {
	--w: 100vw;
	}
#headerimg h1 {
	min-height: 15%;
	display: flex;
	align-items: center;
	justify-content: center;
	}
}
@media screen and (max-width: 600px) {
	#menu > ul {
		flex-direction: column;
		z-index: 10;
		padding-bottom: 1vw;`
	}
	#menu > ul > li {
		display: none;
	}
	#menu > ul.show > li {
		display: block;
	}
	#menu > ul::before {
		content: 'X';
		position: relative;
		color: transparent;
		background-image: linear-gradient(black 0 10%, transparent 10% 45%, black 45% 55%, transparent 55% 90%, black 90% 100%);
		background-repeat: no-repeat;
		position: relative;
		height: 1em;
		width: 1em;
		font-size: 4vw;
		display: inline-block;
		padding: 1vw;
	}
	#menu > ul.show::before {
		color: black;
		background: transparent;
	}
	#content {
		padding: 1vw;
	}
}