/*
Theme Name: Elmbridge Museum Website
Author: GB / Powered by Reason (poweredbyreason.co.uk)
Feb 2021
Version: 1.0
*/

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, button {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

a {
	text-decoration: none;
	border-bottom: 1px dashed #3b3b3b;
	color: #3b3b3b;
	font-weight: 600;
}

p {
	margin-bottom: 20px;
	font-size: 1em;
}

ul li {
	margin-left: 40px;
}


strong {
	font-weight: 600;
}

body {
	font-family: "Montserrat";
	color: #3b3b3b;
	line-height: 1.4em;
}

.row {
	width: 100%;
	position: relative;
}


.outerContainer {
	width: 90%;
	max-width: 1800px;
	min-width: 1440px;
	margin: 0 auto;
	position: relative;
	overflow-x: visible !important;
	box-sizing: border-box;
}


.container {
	width: 85%;
	max-width: 1440px;
	margin: 0 auto;
	position: relative;
	overflow-x: visible !important;
	box-sizing: border-box;
}

.fullWidth {
	width: calc(100% - 40px);
	margin: 0 20px;
}

.halfWidth {
	width: calc((100% / 2) - 40px);
	margin: 0 20px;
	float: left;
}

.quarterWidth {

	width: calc((100% / 4) - 40px);
	margin: 0 20px;
	float: left;
	
}

.oneThird {
	width: calc((100% / 3) - 40px);
	margin: 0 20px;
	float: left;
}

.twoThirds {
	width: calc(((100% / 3) * 2) - 40px);
	margin: 0 20px;
	float: left;
}

.oneFifth {
	width: calc((100% / 5) - 40px);
	margin: 0 20px;
	float: left;
}

.twoFifths {
	width: calc(((100% / 5) * 2) - 40px);
	margin: 0 20px;
	float: left;
}

.threeFifths {
	width: calc(((100% / 5) * 3) - 40px);
	margin: 0 20px;
	float: left;
}

.fourFifths {
	width: calc(((100% / 5) * 4) - 40px);
	margin: 0 20px;
	float: left;
}

.oneQuarter {
	width: calc((100% / 4) - 40px);
	margin: 0 20px;
	float: left;
}

.threeQuarters {
	width: calc(((100% / 4) * 3) - 40px);
	margin: 0 20px;
	float: left;
}


header {
	position: fixed;
	width: 100%;
	z-index: 9998;
	padding: 20px 0;
	transition: 0.2s;
}

header.bgGreen {
	box-shadow: 0 1px 5px -1px rgba(0,0,0,0.4);
}

.prominent {
	text-align: center;
}

.fullWidth.prominent {

}

.fullWidth.prominent h1 {
	font-size: 3.4em;

}

.fullWidth.prominent p {
	max-width: 30%;
	margin: 0 auto;
	margin-bottom: 20px;
	font-size: 1.2em;
}

.bar.prominent {
	display: none;
}



.White {
	background-color: #fff;
	color: #000 !important;
}

.White a {
	color: #000;
}


header .logo img {
	max-height: 50px;
	width: auto;
	float: left;
	margin-bottom: 20px;
}


.menuHidden {
	position: fixed;
	width: 100%;
	margin: 0 auto;
	z-index:9999;
	display: none;
	height: 5px;
	background-color: #21CAB9;
}

.menuHiddenTab {
	padding: 10px;
	border-radius: 0 0 10px 10px;
	width: 100px;
	margin: 0 auto;
	background-color: #21CAB9;
	text-align: center;
	font-color: #fff;
	font-weight: 600;
	color: #fff;
	font-size: 0.8em;
	box-shadow: 0 1px 5px -1px rgba(0,0,0,0.4);

}


.subMenu {
	min-width: 200px;
	max-width: 80%; 
	display:inline-block; 
	padding: 20px; 
	border-radius: 0 0 10px 10px; 
	display:none;
}

.subMenu li {
	margin-left: 0;
	list-style-type: none;
	margin-left: 10px;
	
}

.subMenu a:hover {
	color: #2e1586;
}

.subMenuTab {
	display:inline-block; 
	font-size: 0.9em; 
	color: #fff; 
	font-weight: 600;
}




header a {
	border-bottom: 0;
	color: inherit;
}


.logoElmbridge {
color: inherit; font-weight: 600; font-size: 25px; top: 17px; left: 27px; position: absolute;
}
.logoMuseum {
color: inherit; font-weight: 600; font-size: 25px; top: 36px; left: 27px; position: absolute;
}

header:hover  .logoElmbridge::after {
	content: 'lmbridge';
}
header:hover  .logoMuseum::after {
	content: 'useum';
}

header:hover .logo {
	opacity: 1 !important;
	transition: 0.2s;
}


.headerBar {
	float: right;
	margin-top: 30px;
	text-align: center;
}


.headerSocial {

	height: 30px;
	width: auto;
}


header .menuList {
	float: left;
}

.menuList li {
	margin-left: 0;
	float: left;
	list-style-type: none;
	margin-right: 15px;
}

.menuList a {
	text-decoration: none;
	color: inherit;
}

.White .menuList a {
	color: inherit;
}

header .searchBox {
	float: left;
	margin-right: 10px;
	margin-top: -10px;
}

header .searchBox .inputBox {
	font-size: 1em;
	border-radius: 9px;
	border: 0;
	padding: 10px;
	max-width: 100%;
	width: 300px;
}


.menuBar, .menuBarDark {
	float: right;
	padding: 8px 10px;
	border-radius: 4px;
	margin-top: -2px;
	margin-left: 20px;
	color: #fff;
    font-weight: 200;
    font-size: 1.6em;
    padding-top: 1px;
}



.headerMenu {
	height: 20px;
	width: auto;
	margin-left: 20px;
}

.hero .container {
	//text-align: center;
	padding-top: 90px;
}




.hero .container p {
	padding-top: 20px;
}

.hero {
	color: #fff;
}

.hero h1 {
	font-size: 3em;
}


.breadcrumb {
	display: inline-block;
}

.breadcrumb li {
	margin-left: 0;
	float: left;
	list-style: none;
}

.breadcrumb li a {
	text-decoration: none;
	border-bottom: 0 !important;
}

.breadcrumb ul {
	display: inline-block;
	margin-bottom: -6px;
}


button, .button {
	padding: 10px 30px;
	border-radius: 4px;
	font-weight: 600;
	display: inline-block;
    margin-top: 20px;
	margin-right: 10px;
    color: #fff;
    background-color: #838383;
    border-bottom: 0;

}

button:hover, .button:hover {
	box-shadow: 3px 3px 0px 2px #919191;
}


.noMargin {
	margin: 0;

}


.btnSmall {
	font-size: 0.8em;
	padding: 8px 20px;
}

.button {
	text-decoration: none;
}



.bgWhite {
	background-color: #fff;
	color: #131313;
}

.bgClear {
	background-color: none;
	color: #fff;
}

.bgBlue {
	background-color: #1365c7;
	color: #fff;
}

.bgBlue a {
	color: #fff;
	border-color: #fff;
}

.bgPurple {
	background-color: #2e1586;
	color: #fff;
}

.bgGreen {
	background-color: #21CAB9;
	color: #131313;
}

.bgGreen .menuHidden {
background-color: #21CAB9;
}

.bgClear .menuHidden {
background-color: #21CAB9;
}

.bgGrey {
	background-color: #e6e6e6;
	color: #131313;
}

.bgRed {
	background-color: #bf002e;
	color: #fff;
}

.bgLightRed {
	background-color: #fc5f58;
	color: #fff;
}

.bgYellow {
	background-color: #fbd230;
	color: #131313;
}

.menuBarDark {
	display: none;
}

header.bgYellow .menuBar, header.bgGreen .menuBar {
display: none;
}

header.bgYellow .menuBarDark, header.bgGreen .menuBarDark {
display: block;
}

.bgPink {
	background-color: #feb5c3;
	color: #000;
}

.bgHotPink {
	background-color: #fd259a;
	color: #000;
}


.blue {
	color: #2e1586;
}

.green {
	color: #21CAB9;
}

.grey {
	color: #c3c3c3;
}

.red {
	color: #fc5f58;
}

.yellow {
	color: #fbd230;
}

.pink {
	color: #feb5c3;
}


h1 {
	font-size: 3em;
	font-weight: 600;
	line-height: 1.2em;
}

h2 {
	font-size: 1.8em;
	font-weight: 600;
	margin-bottom: 20px;
	line-height: 1.2em;
}

h3 {
	font-size: 1.4em;
	font-weight: 600;
	margin-bottom: 20px;
	line-height: 1.2em;
}

h4 {
	font-size: 1.2em;
	font-weight: 600;
	margin-bottom: 20px;
	line-height: 1.2em;
}





.bottomMargin {
	margin-bottom: 40px;
}

.bottomDoubleMargin {
	margin-bottom: 80px;
}

.topMargin {
	margin-top: 40px;
}

.topDoubleMargin {
	margin-top: 80px;
}

.footerContent {
	
	
	padding: 40px 0;

}

.mainMenu {
	background-color: #fff;
	color: #3b3b3b;
	/*position: fixed;*/
	width: 100%;
	top: 0;
	left: 0;
	padding: 30px;
	box-sizing: border-box;
	box-shadow: 0px -6px 4px 4px rgba(0,0,0,0.3);
	z-index:9999;
	display:none;
	box-shadow: 0px 2px 8px 5px rgba(0,0,0,0.4);
	padding-top: 100px;
	overflow: hidden;
}

.mainMenu ul {
	margin-top: 20px;
}

.mainMenu ul li a {
	color: #3b3b3b;
	text-decoration: none;
		font-weight: 400 !important;
}

.mainMenu ul li a:hover {
	border-bottom: 1px dashed #fff;
}


.mainMenu ul li {

	margin-left: 0;
	font-size: 1em;
	list-style: none;
	margin-bottom: 10px;
}

.mainMenu p {
	font-weight: 600;
	font-size: 1.1em;
	margin-bottom: 0;
}



.closeMainMenu {
	line-height: 1;
	font-size: 2em;
	font-weight: 600;
	color: #fff;
	position: absolute;
	right: 20px;
	top: 20px;
	background-color: #fc5c58;
	border-radius: 4px;
	padding: 10px 15px;
	z-index: 9999;
}


.mainMenu .oneQuarter {
	min-height: 260px;
	margin-bottom: 40px;
}


.slick-dots {
text-align: center;
position: absolute;
bottom: 20px;
margin: 0 auto;
width: 100%;
}

.slick-dots li {
	margin-left: 0;
	list-style: none;
	display: inline-block;
}

.slick-dots button {
	height: 20px;
	width: 20px;
	background-color: #fff;
	border: 4px solid #fff;
	font-size: 0;
	line-height: 0;
	list-style: none;
	padding: 0;
	margin: 0;
	border-radius: 10px;
	margin-right: 10px;
	box-shadow: 0 0 0 3px gray;
}

.slick-dots .slick-active button  {
	background-color: #0d79cb;
}

.slick-slide {
	box-sizing: border-box;
}


.bar {
	display: block;
	width: 20%;
	height: 4px;
	margin: 20px 0;
	background-color: #fff;
}

.bgGreen .bar {
	background-color: #fbd230;
}




/* News and Visit Block */

.newsAndVisit {
	display: flex; align-items: stretch;
}

.newsAndVisit .title {
	font-weight: 600;
}

.newsAndVisit p {
	margin-top: 10px;
}

.newsAndVisit .leftPanel, .rightPanel {
	padding: 40px 0;
	box-sizing: border-box;
}

.newsAndVisit .leftPanel{
	padding-right: 20px;
}

.newsAndVisit .rightPanel p {
	margin-bottom: 20px;
}

.newsAndVisit .rightPanel a {
	font-weight: 600;
	width: 100%;
	display: block;
	margin-top: 5px;
	text-decoration: none;
}

.newsAndVisit .rightPanel .red {
	padding-bottom: 5px;
	border-bottom: 2px solid #fc5f58;	
}

.newsAndVisit .rightPanel .green {
	padding-bottom: 5px;
	border-bottom: 2px solid #21cab9;	
}

.newsAndVisit .rightPanel .blue {
	padding-bottom: 5px;
	border-bottom: 2px solid #2e1586;	
}



/* END News and Visit Block */


/* Whats on carousel */

.whatsOnCarousel {
	text-align: center;
	padding: 60px 0;
	overflow: hidden;
}


.whatsOnCarousel .categories li {
	display: inline-block;
	margin: 25px 15px;
}


.whatsOnCarousel .categories li .active {
	color: #21CAB9;
}

.whatsOnCarousel > .container > .itemContainer {
	margin-top: 20px;
}

.whatsOnCarousel > .container > .itemContainer > .item {

	border-radius: 10px;
	background-color: #fff;
	margin-bottom: 40px;

}

.whatsOnCarousel .itemImage {
	background-size: cover; position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}

.whatsOnCarousel .itemContent {
	padding: 20px 0;
	box-sizing: border-box;
	text-align: left;
}

.whatsOnCarousel .itemContent .title {
	font-weight: 600;
	margin-bottom: 10px;
	display: block;
}

.whatsOnCarousel .itemContent .date {
	font-weight: 600;
	margin-bottom: 10px;
	display: block;
	border-bottom: 1px solid lightgrey;
	padding-bottom: 5px;
}



/* END Whats on carousel */



/* Promo Block */

.planBox {
	display: flex;
	padding: 80px 0;
	padding-top: 120px;
}

.planBox .left {
	margin-left: 20px;
	width: 250px;
	float: left;
}

.planBox .right {
	margin-left: 10px;
	float: left;
	left: 300px;
	height: 350px;
	margin-top: -38px;
	z-index: 500;
	width: calc(100% - 300px);
	

}


.planBox .bar {
	background-color: #21CAB9;
}

.planBox .container {
	position: relative;
}

.planBox .title {
	display: block;
	font-weight: 600;
	margin-bottom: 10px;
}

.planBox .circle {

	position: absolute;
	padding: 40px 0;
	box-shadow: 0 0 0 10px #21CAB9;
	border-radius: 50%;
	padding: 200px;
	top: -70px;
	left: -70px;
	z-index: 600;
	pointer-events: none;
	

}

.planBox .mediaColumn img {
	width: 100%;
	height: auto;
}

.planBox .internalPadding {
	padding: 40px;
	overflow: hidden;
}














/* Promo Block */

.bigPromo > .container {

}


.bigPromo .bar {
	background-color: #21CAB9;
}

.bigPromo .container {
	position: relative;
}

.bigPromo .title {
	display: block;
	font-weight: 600;
	margin-bottom: 10px;
}

.bigPromo .circle {

	
	padding: 40px 0;
	border: 6px solid #21CAB9;
	border-radius: 500px;
	padding: 60px;

}

.bigPromo .mediaColumn img {
	width: 100%;
	height: auto;
}

.bigPromo .internalPadding {
	padding: 40px 0;
	overflow: hidden;
}


.bigPromoSubVideo {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}

.bigPromoSubVideo iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.bgWhite .button {
 background-color: #21cab9;
 color: #000;
}

.bgBlue .button {
 background-color: #21cab9;
 color: #000;
}


.bgGreen .button {
 background-color: #fbd230;
 color: #000;
}

.bgYellow .button {
 background-color: #1365c7;
 color: #fff;
}

.bgRed .button {
	background-color: #fbd230;
	color: #000;
}

.bgPink .button {
	 background-color: #1365c7;
	 color: #fff;
}



/* End promo block */


/* general content */

.generalContent {
overflow: hidden;
}

.generalContent h2 {
color: #2e1586;
}

.generalContent h3 {
	font-size: 1em;}

.generalContent .alignright {
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
}

.generalContent .alignleft {
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
}


.aligncenter {
	margin: 0 auto;
}

.alignleft {
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
}

.alignright {
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
}


.generalContent.megaImage .alignright {
	float: right;
	margin-left: 40px;
	margin-bottom: 20px;
}

.generalContent.megaImage .alignleft {
	float: left;
	margin-right: 40px;
	margin-bottom: 20px;
}



.generalContent img {
	max-width: 100%;
	height: auto;
	box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2);
	border-radius: 2px;	

}

.imgDynamic {
	transition: 0.5s;
}

.imgDynamic:hover {
	transition: 0.5s;
	transform: rotate(4deg);
}


.videoContainer {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}

.videoContainer iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.generalContent.megaImage img {
	border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
	box-shadow: 0 0 1px 15px #fbd230;
	border: 10px #fff solid;
	padding: 4px;
	box-sizing: border-box;
	background-color: #dbdbdb;
}	
		
.generalContent.megaImage .wp-caption-text {
	width: 75%;
	margin: 0 auto;
	display: block;
	background-color: #fbd230;
	position: relative;
	padding: 10px;
	top: 14px;
	text-align: center;
	font-size: 0.9em;
	border-radius: 255px 15px 255px 38px/15px 225px 83px 255px;		
}


.generalContent.megaImage.empYellow img {
	box-shadow: 0 0 1px 15px #fbd230;
}
.generalContent.megaImage.empYellow .wp-caption-text {
	background-color: #fbd230;
}

.generalContent.megaImage.empRed img {
	box-shadow: 0 0 1px 15px #bf002e;
}
.generalContent.megaImage.empRed .wp-caption-text {
	background-color: #bf002e;
	color: #fff;
}

.generalContent.megaImage.empBlue img {
	box-shadow: 0 0 1px 15px #1365c7;
}
.generalContent.megaImage.empBlue .wp-caption-text {
	background-color: #1365c7;
	color: #fff;
}

.generalContent.megaImage.empPink img {
	box-shadow: 0 0 1px 15px #feb5c3;
}
.generalContent.megaImage.empPink .wp-caption-text {
	background-color: #feb5c3;
	color: #000;
}

.generalContent.megaImage.empPurple img {
	box-shadow: 0 0 1px 15px #2e1586;
}
.generalContent.megaImage.empPurple .wp-caption-text {
	background-color: #2e1586;
	color: #fff;
}

.generalContent.megaImage.empGrey img {
	box-shadow: 0 0 1px 15px #e6e6e6;
}
.generalContent.megaImage.empGrey .wp-caption-text {
	background-color: #e6e6e6;
	color: #131313;
}

.generalContent.megaImage.empLightRed img {
	box-shadow: 0 0 1px 15px #fc5f58;
}
.generalContent.megaImage.empLightRed .wp-caption-text {
	background-color: #fc5f58;
	color: #fff;
}

.generalContent.megaImage.empGreen img {
	box-shadow: 0 0 1px 15px #21CAB9;
}
.generalContent.megaImage.empGreen .wp-caption-text {
	background-color: #21CAB9;
	color: #131313;
}



.megaImage.Blue img {
box-shadow: 0 0 1px 15px blue;	
}

.megaImage.Blue .wp-caption-text {
background-color: blue;
}


/* END general content */


.item {
	box-sizing: border-box;
}



.ctaBoxes > .container > .itemContainer {
	margin-top: 20px;
}


.ctaBoxes .itemImage {
	background-size: cover;
	background-position: center;
	position: relative;
	padding-bottom: 70%; /* 16:9 */
	height: 0;
}



.ctaBoxes .itemOver {
	position: absolute;
	left: 0;
	padding: 20px;
	box-sizing: border-box;
	top: 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	transition: 0.2s;
 
}

.ctaBoxes .itemOver:hover {
	transition: 0.2s;
	opacity: 1;
}

.ctaBoxes .itemOver .title {
	font-weight: 600;
	margin-bottom: 10px;
	display: block;
}


.ctaBoxes {
	text-align: center;
	padding: 60px 0;
	overflow: hidden;
}


.ctaBoxes .categories li {
	display: inline-block;
	margin: 25px 15px;
}


.ctaBoxes .categories li .active {
	color: #21CAB9;
}

.ctaBoxes > .container > .itemContainer {
	margin-top: 20px;
}

.ctaBoxes > .container > .itemContainer .slick-slide {

margin: 30px;

}

.ctaBoxes .itemImage {
	background-size: cover; position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}

.ctaBoxes .itemContent {
	padding: 20px;
	box-sizing: border-box;
	text-align: left;
}

.ctaBoxes .itemContent .title {
	font-weight: 600;
	margin-bottom: 10px;
	display: block;
}

.ctaBoxes .slick-slide .item {
	margin-right: 30px;
}



/* END CTA BOXES */



/* ACCORDION */



.accordionBlock {
	text-align: center;
	padding: 40px 0;
	width: 100%;
	padding-right: 20px;
	box-sizing: border-box;
}


.accordionItem:first-child {

	border-top: 2px solid #000;

}

.accordionItem {
	border-bottom: 2px solid #000;
	text-align: left;
	padding-top: 15px;
}

.accordionTitle {
	font-size: 1.2em;
	font-weight: 600;
	display: block;
	margin-bottom: 15px;
	cursor: pointer;
}
.accordionContent {
	display: none;
}




/* END ACCORDION */


/* TAB BOXES */

.tabBoxes {
	overflow: hidden;
	padding: 40px 0;
}

.tabRow {
	text-align: center;
	display: block;
	margin-bottom: 40px;
}

.tabBoxesContainer {
	overflow: hidden; padding: 10px; display: flex;
}


.tabRow li {
	display: block;
	padding: 20px;
	font-weight: 600;
	text-align: left;
	text-decoration: none;
	margin: 10px 0;

}

.tabRow li.active {
 box-shadow: 0px 2px 0px 2px rgba(0,0,0,0.4);
}

.tabRow li:hover {
	transform: scale(1.05);
	transition: 0.2s;
}



.tabRow li a {
	text-decoration: none;
}

.tabContent {
	overflow: hidden;
}

.imageBlock img {
	width: 100%;
	height: auto;
	border-radius: 10px;
	box-shadow: 0px 0px 4px 1px rgba(0,0,0,0.2); 
}

.tabby {
	display: none;
}

.tabby:first-child {
	display: block;
}

/* END TAB BOXES */



/* BLOG */

.blogListing {
	overflow: hidden;
	padding: 60px 0;
}



.blogListing .categories li {
	display: inline-block;
	margin: 25px 15px;
}


.blogListing .categories li .active {
	color: #21CAB9;
}

.blogListing > .container > .fourFifths > .itemContainer {
	margin-top: 20px;
}

.blogListing > .container > .fourFifths .itemContainer > .item {

}

.blogListing .itemImage {
	background-size: cover; position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}

.blogListing .itemContent {
	padding: 20px;
	box-sizing: border-box;
	text-align: left;
}

.blogListing .itemContent .title {
	font-weight: 600;
	margin-bottom: 10px;
	display: block;
}

.blogListing .item {
	margin-bottom: 40px;
}


.blogCol {
	text-align: right;
	box-sizing: border-box;
}

.blogCol ul {
margin-left: 0;
}

.blogCol li {
	margin-left: 0;
	list-style: none;
}

.blogCol li a {
	text-decoration: none;
	color: #525252;
}

.blogCol li a:hover {
	border-bottom: 1px dashed #525252;
}

.blogCol h3 {
	margin-top: 10px;
	margin-bottom: 5px;
}

/* END BLOG */

.pagination {

	margin: 20px 20px;

}



.paginationBlock {
	text-align: center;
	text-decoration: none;
	color: #525252;
	margin-right: 10px;	
	height: 25px;
	width: 25px;
	background-color: #fff;
	display: inline-block;
	border: 1px solid #525252;
}

.paginationBlock:hover {
	background-color: #cecece;
}

.paginationBlock.active {	
	height: 25px;
	width: 25px;
	background-color: #21CAB9;
	color: #fff;
	border: 1px solid #21CAB9;
}

.paginationBlock.active:hover {	
	opacity: 0.8;
}



/* MEGA MENU */

	.megaMenu {
		display: none;
		position: absolute;
		width: 100%;
		top: 44px;
		left:0;
		box-sizing: border-box;
		z-index: 9997;
		text-align: left;
		/*transform: rotate(1deg);*/
	}
	
	.megaMenuSpacer {
		height: 30px;
	}

	.megaMenu .container {
		position: relative;
		padding: 40px;
		color: #fff;
		box-sizing: border-box;
		width: 80vw;
		max-width: 1200px;
		height: 313px;
		//border-radius: 67px;
		overflow: hidden;
		background-color: rgba(0,0,0,0.9);
		border: 10px solid #fbd230;
		box-shadow: 0 0 0px 10px rgba(0,0,0,0.9);
		border-radius: 226px 115px 215px 115px/215px 325px 255px 255px;

	}

	.topMenuLink li a {
	z-index: 9998;

	}
	
	.topMenuLink:hover .megaMenu {
		display: block;
	}


	.menuImage {
	height: 70px; position: absolute; left:0; z-index:9998;
	display: none;
	top: -10px;
	}

	.topMenuLink:hover .menuImage {
		display: block;
	}

	
	.megaTitle {
		font-size: 1.5em;
		font-weight: 700;
		margin-bottom: 10px;
		display: block;
	}
	
	
	.megaLink {
		color: #fff !important;
		text-decoration: none;
		display: block;
		margin-bottom: 10px;
		font-weight: 400;
	}	
	
	.megaLink:hover {
	color: #fc5f58 !important;
	}
	
	
	.megaLike {
		color: #fff;
		padding-bottom: 20px;
		border-bottom: 1px dashed #fff;

	}
	
	.megaLike .title {
		font-size: 1.2em;
		font-weight: 600;
	}
	
	.megaMenu .whatsOnBlock {
		color: #fff;
	}
	
	
/* END MEGA MENU */

/* FORMS */

	.inputBox {
	
		padding: 10px 15px;
		font-size: 1em;
		border: 0;
		border-radius: 4px;
		background-color: #fff;
		width: 100%;
		box-sizing: border-box;
		min-height: 37px;
		height: 37px;
	
	}


.inputSmall.is40 {
	width: 40px;
}


.inputSmall.is60 {
	width: 60px;
}

.inputSmall.is80 {
	width: 80px;
}

.inputSmall.is100 {
	width: 100px;
}

	

.radioRow {
	margin-top: 20px;
	overflow: hidden;
}

.radioRow span {
	width: 100%;
	font-size: 0.9em;
	font-weight: 600;
	display: block;
	overflow: hidden;
}
	
.radioRow label {
	display: inline-block !important;
	float: left;

}


.radioRow input {
	display:inline-block !important;
	float: left;
}
.radioRow .inputBox {
	width: auto;
	margin-right: 10px;
}

.selectInput {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background: url(data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA0Ljk1IDEwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9LmNscy0ye2ZpbGw6IzQ0NDt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPmFycm93czwvdGl0bGU+PHJlY3QgY2xhc3M9ImNscy0xIiB3aWR0aD0iNC45NSIgaGVpZ2h0PSIxMCIvPjxwb2x5Z29uIGNsYXNzPSJjbHMtMiIgcG9pbnRzPSIxLjQxIDQuNjcgMi40OCAzLjE4IDMuNTQgNC42NyAxLjQxIDQuNjciLz48cG9seWdvbiBjbGFzcz0iY2xzLTIiIHBvaW50cz0iMy41NCA1LjMzIDIuNDggNi44MiAxLjQxIDUuMzMgMy41NCA1LjMzIi8+PC9zdmc+) no-repeat 95% 50%;
	background-color: #fff;
}




/* END FORMS */


/* COLLECTIONS */

	.formBox {
	
		border-radius: 10px;
		padding: 20px;
		box-sizing: border-box;
	
	}

	.formBox label {
		font-size: 0.9em;
		font-weight: 600;
		margin-top: 10px;
		display: block;	
	}



	.collectionResult {
	
		border-radius: 4px;
		padding: 20px;
		box-sizing: border-box;
		margin-bottom: 20px;
		background-color: #e6e6e6;

	}


.detailPopup label {

	display: inline-block;
	width: 175px;
	font-weight: 600;
	margin-bottom: 10px;

}

.detailPopup .slick-prev {
	left: 0;
}

.detailPopup .slick-next {
	right: 0;
	margin-right: 0;
}


.collectionAdd {
	transition: 0.4s;
}

.collectionAdd:hover {
	transition: 0.4s;
	background-color: #fc5f58;
}




.collectionAdd:hover:after {
	content: ' Add to my collection';

}


.counter {

	font-weight: 600;
	padding: 6px 12px;
	border-radius: 5px;
	display: inline-block;
	background-color: #fff;

}

.interestItem {
	display: inline-block;
	float: left;
	padding: 10px 15px;
	margin: 5px;
	border-radius: 20px;
}


.curatedItem {



}



/* END COLLECTIONS */


/* DASHBOARD */

	.dashboardBlock {
	
		margin-bottom: 40px;
		border-bottom: 2px solid #525252;
		padding-bottom: 20px;
	
	}

.dashboardMessage {
	margin-bottom: 20px;
}

.dashboardItem {

	border-bottom: 1px solid lightgrey;
	margin-bottom: 20px;
	padding: 20px;
	border-radius: 10px;
	

}

.lozenge {
	display:inline-block;
	padding: 5px 10px;
	border-radius: 5px;
	font-size: 0.8em;
}



/* END DASHBOARD */



.theShape {
border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
}

.theBorder {
		border: 10px solid #1365c7;
		box-shadow: 0 0 0px 10px rgba(0,0,0,0.9);
}

.theHighlight {
	box-shadow: 3px 3px 0px 2px gray;
}

.theShadow {
	box-shadow: 1px 2px 4px 1px rgba(0,0,0,0.3);
}

.theFrame {
	border: 10px solid #ffffff;
	box-shadow: 0 0 0px 7px rgba(0,0,0,0.3);
	border-radius: 10px;
}

.theShape.theFrame {
	border: 10px solid #ffffff;
	box-shadow: 0 0 0px 7px rgba(0,0,0,0.3);
	border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
}


/* STORY HIGHLIGHT */

.storySlide {
	
	overflow: hidden;
	padding: 40px;
	background-position: center;
	background-size: 100%;
	border-radius: 20px;
	box-sizing: border-box;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,0.3);
	color: #525252;

}


.storySlide .left {
	box-sizing: border-box;
	padding-right: 50px;
}

.slick-arrow {
	position: absolute;
	bottom: -50px;
	z-index: 9990;
}

.slick-prev {
	left: 40px;
}

.slick-next {
	right: 40px;
}
.storyHighlight .slick-disabled {
	display: none;
}

.storyHighlight .slick-dots {
	bottom: -40px;
}

.storyImage {
		
	border-radius: 14px;
	position: relative;
	border: 10px solid #fff;
	border-bottom: 40px solid #fff;
	box-shadow: 1px 1px 3px 3px rgba(0,0,0,0.3);
	margin: 0 auto;
	max-width: 100%;
	box-sizing: border-box;
		
}
	
.left .storyImage {
	transform: rotate(-4deg);
}	
	
.right .storyImage {
	transform: rotate(4deg);
}	
	

	
.superImg:after {
		    display: block;
    content: "";
    width: 30px;
    height: 50px;
			background-image: url('<?php echo get_template_directory_uri(); ?>/assets/tape.png');
}



/* END STORY HIGHLIGHT */


/* IMAGE HIGHLIGHT */


.imageHighlightImage {
	max-width: 50%;
	height: 130%;
	top: 0;
	right: 0;
	border-radius: 10px;
	border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
  	box-shadow: 0 0 1px 15px #fff;
  	position: absolute;
  	transform: translateY(-15%);
}

.imageHighlight .rowBox {
	border-radius: 10px;
	border-radius: 263px 15px 225px 24px/10px 225px 15px 180px;
	position: relative;
	overflow: hidden;
}

.imageHighlight .contentBox {
	box-sizing: border-box;
	float: right;
	padding-left: 50px;
	padding-top: 40px;
	padding-bottom: 40px;
	padding-right: 50px;
	max-width:50%;
}

.imageHighlight {
	left: 0;
	right: none;
}

.left .imageHighlightImage {
		left: 0;

}

.right .contentBox {

	float: left;

}

.imageHighlight .imageBox {
	text-align: center;
	height: 250px;
	float: right;
	padding: 0px;
	max-width:50%;
}





/* END IMAGE HIGHLIGHT */


/* IMAGE CAROUSEL */

.imageCarousel .slick-prev, .imageCarousel .slick-next {
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	cursor: pointer;
	height: 60px;
	width: 60px;
	background-color: lightgray;
	color: #fff;
	text-align: center;
	border-radius: 50%;
	padding: 0;
	border: 4px solid #fff;
	font-size: 0;
	
}


.imageCarousel .slick-prev:before {
  content: "<";
  color: #fff;
font-size: 45px;
line-height: 50px;
}

.imageCarousel .slick-next:before {
  content: ">";
  color: #fff;
font-size: 45px;
line-height: 50px;
}

.imageCarousel .slick-dots {
position: absolute;
bottom: 40px;
width: 100%;
padding-right: 40px;
box-sizing: border-box;
text-align: right;

}



/* END IMAGE CAROUSEL */


/* RESOURCES BLOCK */

.filters-button-group button {
	transition: 0.3s;
	position: relative;
}


.filters-button-group .is-checked:after {
	content: url('/wp-content/themes/elmbridge/assets/button_active.png');
	position: absolute;
	top: 0;
	right: 0;
	top: -10px;
	right: -10px;
}


/* END RESOURCES BLOCK */


/* COLLECTIONS BLOCK */


.collections button.narratives {
	border-color: #1365c7;
	background-color: #1365c7;
}

.collections .item.narratives {
	box-shadow: 0 0 0 7px #1365c7;
}

.collections button.objects-in-focus {
	background-color: #fbd230;
	color: #000;
}

.collections button.classifications {
	background-color: #fc5f58;
	color: #000;
}

.collections .item.classifications {
	box-shadow: 0 0 0 7px #fc5c58;
}

.collections .item.objects-in-focus {
	box-shadow: 0 0 0 7px #fbd230;
}


.button-group.filters-button-group {
	margin-bottom: 40px;
	display: inline-block;
	padding: 0 20px;
	padding-bottom: 25px;
}


.classifications:hover > .itemContent {
	visibility: visible !important;
}



.button-group.filters-button-group span {
	font-size: 1.4em;
	font-weight: 600;
	transform: rotate(2deg);
	display: inline-block;
	margin-right: 20px;
	color: #000;
	text-shadow: 1px 2px 1px rgba(255,255,255,0.8);
}


.galleryModal {
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.6);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	display: none;
	text-align: center;
}

.modalImage {
	margin: 0 auto;
	background-color: white;
	border-radius: 10px;
	border: 2px #525252 solid;
	text-align: center;
	overflow: hidden;
	margin-top: 10px;
	padding: 20px;
	width: auto;
	box-sizing: border-box;
	max-width: 80vw;
	max-height: 90vh;
	display: inline-block;
}	


.modalImage img {
    max-width: 80vw;
    max-height: 80vh;
	border-radius: 10px;
}



/* END COLLECTIONS BLOCK */




/* DISCOVER BLOCK */


.item {
	margin-bottom: 40px;
}



.discoveryBlock > .container > .itemContainer {
	margin-top: 20px;
}


.discoveryBlock .itemImage {
	background-size: cover;
	background-position: center;
	position: relative;
	padding-bottom: 70%; /* 16:9 */
	height: 0;
}



.discoveryBlock .itemOver {
	position: absolute;
	left: 0;
	padding: 20px;
	box-sizing: border-box;
	top: 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	transition: 0.2s;
 
}

.discoveryBlock .itemOver:hover {
	transition: 0.2s;
	opacity: 1;
}

.discoveryBlock .itemOver .title {
	font-weight: 600;
	margin-bottom: 10px;
	display: block;
}


.discoveryBlock {
	text-align: center;
	padding: 60px 0;
	overflow: hidden;
}


.discoveryBlock .categories li {
	display: inline-block;
	margin: 25px 15px;
}


.discoveryBlock .categories li .active {
	color: #21CAB9;
}

.discoveryBlock > .container > .itemContainer {
	margin-top: 20px;
}

.discoveryBlock > .container > .itemContainer .slick-slide {

margin: 30px;

}

.discoveryBlock .itemImage {
	background-size: cover; position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}

.discoveryBlock .itemContent {
	padding: 20px;
	box-sizing: border-box;
	text-align: left;
}

.discoveryBlock .itemContent .title {
	font-weight: 600;
	margin-bottom: 10px;
	display: block;
}

.discoveryBlock .slick-slide .item {
	margin-right: 30px;
}








/* END DISCOVER BLOCK */


/* TIMELINE */


.timelineBlock .halfWidth.left {
	width: calc(50% - 1px);
	float: left;
	border-right: 2px solid #2e1586;
}

.timelineBlock .image {
	box-sizing: border-box;
}

.timelineBlock .halfWidth.right {
	width: calc(50% - 1px);
	float: right;
	border-left: 2px solid #2e1586;
	text-align: right;
}


.timelineBlock .dot {
	height: 20px;
	width: 20px;
	border-radius: 50%;
	background-color: #2e1586;
	float: right;
}


.timelineBlock .vertical.dot {
	padding: 20px;
	background-color: #fff;
	border-radius: 30px;
	border: 4px #2e1586 solid;
	float: right;
	font-size: 1.6em;
	color: #2e1586;
	font-weight: 600;
	width: auto;
}



.timelineBlock .dot.left {

	float: right;
	transform: translate(50%, -50%);

}
.timelineBlock .dot.right {

	float: left;
	transform: translate(-50%, -50%);

}


.timelineBlock .verticalItem:last-child::after {

}

.timelineBlock .endBlob {

	border: 5px solid #2e1586;
	height: 60px;
	width: 60px;
	border-radius: 50%;
	background-color: #fff;
	margin: 0 auto;

}

/* END TIMELINE */


/* ACTION BOX */

.actionItem {
width: 100%; padding: 20px; margin-bottom: 20px;position: relative;overflow: visible; box-sizing: border-box;
}

.actionItem a {
	color: #525252;
	font-weight: 400;
	border-color: #525252;
}



/* END ACTION BOX */



.msgBar {
	display: none;
	position: fixed;
	bottom: 70px;
	right: 100px;
	width: 300px;
	max-width: 90%;
	text-align: center;
	z-index: 9999;
	margin: 0 auto;

}

.messbox {
	padding: 10px;
	font-size: 1.2em;
	font-weight: bold;
	color: #fff;
	background-color: #21CAB9;
	width: 100%;
	margin: 0 auto;
	padding: 40px;
	border-radius: 20px;
}


.errormessage {

background-color: #bf002e;
border-radius: 4px;
color: #fff;
font-weight: 600;
padding: 20px;

}



/* Footer */

footer img {
	max-width: 90%;
}


.footerContent {
	font-size: 0.9em;
	padding: 30px 0;
	box-sizing: border-box;
	overflow: hidden;
}

.footerMenu {
	text-align: right;
}

.footerMenu li {
	display: inline-block;
	margin-left: 20px;
}

.footerContent a {
	color: #fff;
	text-decoration: none;
	border-bottom: 1px dashed #fff;
}

.socialIcon {
	width: 40px;
	height: 40px;
	display: inline-block;
	float: right;
	margin-left: 10px;
	transition: 0.4s;
	background-color: #1365c7;
	background-size: 100%;
}

.socialIcon:hover {
	border-radius: 10px;
	transition: 0.1s
}

.newsletterSignup {

background-color: #1365c7;
border: 0;
border-bottom: 1px #c3c3c3 solid;;
padding: 10px 0;
font-size: 1em;
margin-right: 20px;
color: #fff;

}



.pageNav {
	margin: 40px 0;
	padding: 30px;
	overflow: hidden;
}



/* END Footer */



/* Search Results */

.searchResults h2 span {
	display: inline-block;
	padding: 5px 10px;
	background-color: #1365c7;
	color: #fff;
}

.sortBy li {
	position: relative;
}

.sortBy a {
	border-bottom: 0;
}

.sortBy li.active::after {

	content: url('/wp-content/themes/elmbridge/assets/button_active.png');
	position: absolute;
	top: 0;
	right: 0;
	top: -10px;
	right: -10px;

}


/* END SEARCh results */


.individualComment {
	padding: 20px;
	box-sizing: border-box;
	margin-bottom: 20px;
}





/* MEDIA QUERIES */

@media screen and (max-width:1500px) {
	.container { width: 1140px;}

}

@media screen and (max-width:1280px) {
	.whatsOnBlock .title {font-size: 1.8em;}
	footer .quarterWidth {width: calc(50% - 40px); text-align: center; }
}

@media screen and (max-width:1200px) {
	.container {width: 95%;}
	.oneFifth { width: calc(100% - 20px);}

}


@media screen and (max-width:1150px) {
	.fullWidth {width: calc(100% - 20px);}
	.oneThird {width: calc(33.333% - 20px);}
	.twoThirds {width: calc(66.6667% - 20px);}
	.fullWidth.prominent p {max-width: 80%;}
	.bigPromo .oneThird.contentColumn {width: calc(50% - 40px);}
	.mainMenu .oneQuarter {width: calc(50% - 40px);}
}

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


.footerMega .halfWidth { text-align: center;}
.footerContent .halfWidth { text-align: center;}
.footerMega .socialIcon {float: none; display: inline-block; margin-top: 20px;}
.footerMenu {text-align: center; margin-top: 20px;}
.storyHighlight .storySlide {background: none !important; background-color: #fff !important;}




}

@media screen and (max-width:850px) {
	.container {width: 95%;}
	.fullWidth {width: calc(100% - 40px);}
	.halfWidth {width: calc(100% - 40px);}	
	.oneThird {width: calc(50% - 40px);}
	.twoThirds {width: calc(100% - 40px);}
	.fourFifths { width: calc(100% - 40px);}
	.threeFifths {width: calc(100% - 40px);}
	.twoFifths {width: calc(100% - 40px);}
	.headerBar {margin-top: 0; width: calc(100% - 100px);}
	.logoMuseum:after, .logoElmbridge:after {opacity: 0;}
	.theHighlight{ margin-right: 5px;}
	.tabBoxesContainer .oneThird { width: calc(100% - 20px); margin-left: 10px !important;}
	.actionBox .oneThird { width: calc(100% - 20px); margin-top: 40px;}
	.actionBox .container {background-image: none !important;}
	.bigPromo .oneThird.contentColumn {width: calc(100% - 40px);}
	.bigPromo .oneThird.mediaColumn {width: calc(100% - 40px);}
	.menuList li {float: right;margin-right: 10px;font-size: 0.9em;}
}


@media screen and (max-width:790px) {
	.container {width: 100%;}
	.tabBoxesContainer { display: block; }
	.newsAndVisit { display: block; background-image: none !important;}
	.newsAndVisit .twoFifths { width: calc(100%); margin: 0; padding: 20px; box-sizing: border-box; }
	.newsAndVisit .threeFifths { width: 100%; }
	.halfWidth {width: calc(100% - 40px);}
}

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

	footer .quarterWidth {width: calc(100% - 40px); text-align: center; }
	.oneThird {width: calc(100% - 40px);}
	.mainMenu .oneQuarter {width: calc(100% - 40px); min-height: 20px;}


}