@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Open+Sans:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quando&display=swap');

:root {
	--blue: #417abd;
	--dark-blue: #002870;
	--light-blue: #c4dfff;
	--red: red;
	--inner-width: 1100px;
	--button-hover:#66a2e6;
	--burgundy:#700027;
}

body, html{width:100%; height: 100%; margin: 0px; padding: 0px; box-sizing: border-box; color: #666}

body{font-size:16px; font-family: 'Open Sans', sans-serif;}

div{background-repeat: no-repeat; background-position: center; background-size: cover; background-repeat: no-repeat; position: relative}

h1, h2, h3{font-weight:normal; line-height: normal; font-family: 'Quando', serif;}
h1{font-size:32px; border-left:10px solid var(--light-blue); color:var(--burgundy); padding: 15px 0 15px 20px; margin: 40px 0}
h2{font-size:22px; color:var(--dark-blue); margin: 40px 0 20px}
h3{font-size:20px; color:var(--blue);}
h4{font-size:16px; color:var(--blue);}

a{text-decoration: none; color:var(--burgundy)}
a:hover{color: var(--dark-blue)}

img{max-width: 100%}

a, a:active, a:focus{outline: none;}

input[type=text], input[type=email], input[type=tel], input[type=date], input[type=number]{border:1px solid #7F959B; padding: 8px; color:#7F959B; margin: 5px 0}
select{padding:10px}
textarea{font-family: 'Open Sans', sans-serif;}
main{min-height: 600px; line-height: 32px}

.flex{display:flex; justify-content: space-between; align-items: stretch}
.flex > div{flex-grow: 1}

.center{text-align: center}
.burgundy{color:var(--burgundy)}

.priceflex > div{width:100%; max-width:32%; box-sizing: border-box; margin: 0 0 30px; border-radius:16px; padding: 0 20px; color: #fff;box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.3);}
.priceflex > div:nth-of-type(1){background-color: #71bf44}
.priceflex > div:nth-of-type(2){background-color: #f9a51b; padding: 0 15px}
.priceflex > div:nth-of-type(3){background-color: #00b59d}
.priceflex h3{color: #fff; padding-bottom: 15px; border-bottom:3px solid rgba(255, 255, 255, .4)}

.priceflex table{margin-bottom: 30px; font-size:14.5px; width:100%}
.priceflex td{border-bottom:1px solid rgba(255, 255, 255, .4); padding: 0 10px 0 0}
.priceflex tr > td:first-of-type{font-size: 13px; font-weight:700 }
.priceflex tr > td:last-of-type{padding-right:0px}

.priceflex tr:first-of-type > td{font-size: 13px; font-weight:700}

.post-edit-link{background-color:var(--blue); display: inline-block; padding: 2px 10px; color:#fff; font-size:12px; transition:all 0.3s ease; margin: 20px 0; border-radius:10px}
.post-edit-link:hover{background-color: var(--button-hover) !important}

.fixedwidth{max-width:var(--inner-width); width:100%; margin: 0 auto}

.hpCols{display:flex; justify-content: space-between; align-items: stretch; margin: 0 auto 60px}
.hpCols > div{flex-grow:1; width:100%}
.hpCols > div:first-of-type{max-width:30%; padding-right: 30px; border-right:3px solid #efefef}
.hpCols > div:first-of-type h2{margin: 20px 0 10px; padding: 0px}
.hpCols > div:first-of-type p{margin: 0px; padding: 0px 0px 15px}
.hpCols > div:last-of-type{max-width:70%; padding-left: 30px}
.hpCols iframe{margin: 0px auto}

.hpCols .fa-facebook-square{color:royalblue; font-size: 30px}
.hpCols > div:last-of-type > p:first-of-type{font-size:24px; font-family: 'Quando', serif; color:var(--dark-blue)}

/* Buttons */
.button{background-color:var(--blue); display: inline-block; padding: 10px 80px 10px 30px; border-top-right-radius:26px; border-bottom-left-radius:26px;transition: background 0.3s ease; font-size:22px; color:#f7f4ec; position: relative; cursor:pointer; line-height: normal; border:0px}
.button:hover{background-color: var(--button-hover) !important}

.menubutton{display:block; margin: 5px auto 30px; padding: 20px; border:2px solid #707070; text-transform: uppercase; letter-spacing: 3px; font-size:18px; max-width: 200px; transition:all 300ms ease}
.menubutton:hover{background-color: #707070; color: var(--red); transform:scale(1.06)}

.errorfield{border:1px solid red}
.view-article{display: none}
.articlecredit{text-transform: uppercase; font-weight:700; color:#3A4245}

.contentTextBlock{text-align: center; padding: 0px}
.fa-times{cursor:pointer}
.fa-times:hover{opacity:0.8}

.hero{width:100%; padding-bottom: 20%; background-size: cover; background-position: center}

.heroanimation{width:100%; background-color:#efefef; padding-bottom: 32%; overflow: hidden}
.heroanimation div{transition:all 3s ease}
.heroanimation .bg{width:100%; padding-bottom: 32%; z-index: 1; position: absolute; top:0px; left:0px; filter: blur(4px);}
.heroanimation .fg{width:100%; padding-bottom: 32%; z-index: 2; position: absolute; top:0px; left:0px; background-size:contain}
.heroanimation .strapline{text-align: center; color:#fff; font-size: 35px; text-shadow:1px 1px 5px #000; display: flex; justify-content: space-around; align-items: center; width:100%; height:100%; z-index: 3; position: absolute; top:0px; left:0px; font-family: 'Quando', serif; transition:all 2s ease; opacity: 1}

.bg.reveal{filter: blur(0px);}
.fg.reveal{opacity:0; transform:scale(0.9); filter: blur(8px);}
.heroanimation .revealtext{transform: translate(-1100px, 0px); opacity: 0}

.sizeFlex{display: flex; justify-content: space-between; align-items: stretch; background-color: #efefef; padding: 20px 40px 40px; border-radius:20px}
.sizeFlex > div{flex-grow:1; width:30%; padding: 0 5px; text-align: center; font-weight:700; color: var(--burgundy)}
.sizeFlex img{width:100%; height: auto; max-width:100%; box-shadow:1px 1px 10px #333}
.sizeFlex p{padding: 0px; margin: 0 0 10px}

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
	background-color: #000
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.coversFlex{display: flex; justify-content: space-between; align-items: stretch; margin: 30px auto}
.coversFlex > div{flex-grow:1; max-width:32%}
.coversFlex img{max-width: 100%; box-shadow:3px 3px 10px #aaa}

header{background-color: var(--burgundy); color:#fff}

#masthead{display: flex; justify-content: center; align-items: center; flex-wrap:nowrap; align-content: space-between; z-index: 10; font-size:14px; max-width:1200px; margin: 0px auto; padding: 10px 0; width:98%; color: #fff}
#masthead a{color:#fff}
#masthead > div{flex-grow:1; width:100%}


#mainnav{text-align: right; color:#000; text-transform: uppercase; font-size:14px}
#mainnav ul{list-style: none; margin: 0px; padding: 0px}
#mainnav ul > li{padding: 6px 15px; margin: 0px; display: inline-block; position: relative}
#mainnav > ul > li:last-of-type{background-color:#fff; color: var(--dark-blue); border-radius:3px; padding-left: 15px; margin-left: 20px; transition: all 300ms ease}
#mainnav > ul > li:last-of-type a{color: var(--dark-blue)}
#mainnav > ul > li > a{display:block; cursor:pointer; transition:all 300ms ease; padding: 2px 0px}
#mainnav > ul > li > a:hover{opacity:0.7}
#mainnav > ul > li:last-of-type > a{border:0px; transition:all 300ms ease}
#mainnav > ul > li:last-of-type > a:hover{border:0px; color: #fff}
#mainnav > ul > li:last-of-type:hover{background-color: var(--button-hover); opacity: 1}

#mainnav ul > li  ul{position: absolute; top:29px; left:0px; display: none; min-width: 180px; padding:0px}
#mainnav ul > li  ul > li{display:block; padding:0px}
#mainnav ul > li  ul > li > a{display:block; background-color: var(--dark-blue); text-align: left; padding: 8px 5px 8px 15px; transition:all 300ms ease}
#mainnav ul > li  ul > li > a:hover{ background-color: var(--red)}
#mainnav ul > li  ul > li:first-of-type{padding-top: 30px}
#mainnav ul > li  ul > li:last-of-type{padding-bottom: 10px}

#mainnav .current-menu-item a{}
#mainnav > ul > li > ul .current-menu-item a{border:0px; background-color: var(--red)}
 
#mobnavbutton{border-radius:2px; width:26px; height: 30px; position: absolute; top:32px; right:32px; cursor:pointer; display:none; z-index: 50; font-size:18px}
#mobnavbutton > div{margin: 5px 0; border:0px; border:2px solid #fff}

#mobnav{text-transform: uppercase; background-color: #fff; color: #3A4245; position: fixed; top:0px; left:0px; z-index: 80; display: none;  width:100%; height: 100%}
#mobnav ul{list-style: none; margin: 0px; padding: 0px}
#mobnav ul > li{padding: 0px; margin: 0px; display: block; position: relative}
#mobnav a{display:block; padding: 10px; cursor:pointer; text-transform: uppercase; text-align: center; letter-spacing: 4px; border-top:1px solid #ccc}

#mobnav ul > li  ul{display: none}
#mobnav ul > li  ul > li{display:block}
#mobnav ul > li  ul > li > a{background-color: #F7F4EC}
	
#mobnav a i{position: absolute; right:60px; top:15px; transition:all 100ms ease}

#mobNavMasthead{display:flex; justify-content: space-between; align-items: center; padding: 15px 0}
#mobNavMasthead > div{flex-grow:1}
#mobNavMasthead > div:first-of-type{width:90px; height: 44px; background-size: contain; background-position: center left 30px; background-repeat: no-repeat; background-image: url(/wp-content/uploads/2020/06/logo-mv-top.png)}
#mobNavMasthead > div:last-of-type{padding: 0 36px 0 0; text-align: right}
#mobNavMasthead i{font-size: 30px; color: #000}

.logo{max-width: 140px}
.moblogo{cursor:pointer}


footer{background-color: var(--burgundy); background-image: url(/wp-content/uploads/2020/06/footer-background.jpg); margin-top: 90px; background-repeat: no-repeat; background-size: cover; padding: 60px 0; color: #fff; background-image: url(/wp-content/uploads/2020/08/footer-bg.jpg); background-position: center}
footer a{color: #fff; transition:all 300ms ease}
footer a:hover{color: #ccc}

#footerInner{display:flex; align-items: stretch; width:98%; max-width:1200px; font-size:14px; margin: 0 auto}
#footerInner > div{flex-grow:1; padding: 5px; flex-basis:30%}
#footerInner > div:nth-of-type(1){max-width:200px}
#footerInner > div:nth-of-type(2){padding-left: 30px}
#footerInner > div:nth-of-type(3){max-width:360px}



.footersocials i{font-size:22px; margin: 15px 15px 0 0}

#menu-footer-menu{list-style: none; padding: 0px; margin: 0px; column-count:2}
#menu-footer-menu > li{display:block; padding: 4px 0px; margin: 0px}

#credit{text-align: right; width:98%; max-width: 1200px; margin: 0px auto; padding:15px 0 30px; font-size:12px}

.threeBox{display: flex; align-items: stretch; color: #fff; margin: 0px 0 0}
.threeBox > div{flex-grow: 1; flex-basis: 33%; background-size: cover; background-position: center; padding: 20px 30px 30px; position: relative; box-sizing: border-box; overflow: hidden}
.threeBox > div:nth-of-type(2){margin: 0 10px}
.threeBox h2{margin: 0px; padding: 0px; height: 80px; max-width: 50%; font-size:30px; color: #fff}
.threeBox p{font-size:14px}

.evCopy{background-color: rgba(0,0,0,0.5); max-width:45%; width:45%; height:100%; position: absolute; top:0px; right:-220px; padding: 10px; box-sizing: border-box; line-height: 20px; transition:right 600ms ease}

.threeBox > div:hover .evCopy{right:0px}

.fourBox{display: flex; align-items: stretch; justify-content: space-between; color: #fff; margin: 30px auto 10px; flex-wrap: no-wrap; max-width: 1200px}
.fourBox > div{flex-grow: 1; background-size: cover; background-position: center; padding: 20px 30px 30px; position: relative; max-width:285px; min-width:285px; height: 400px}

.fourBox .button{position: absolute; bottom:0px; right:0px}

.twoBox{display: flex; align-items: stretch; margin: 0px}
.twoBox > div{flex-grow:1; min-height: 500px; padding: 60px 90px 60px; flex-basis: 50%; position: relative}
.twoBox > div:first-of-type{}
.twoBox h2{padding-top: 0px; margin-top: 0px; color: #3A4245}
.twoBox p{}


.googlemapframe > div:last-of-type{padding:0px}
.googlemapframe iframe{margin:0px; padding: 0px; width:100%; height:500px; position: absolute; top:-14px; left:0px}

.floating_texture{height: 0px; width: 100%; position: relative; z-index: 10}
.floating_texture > div{background-image:url(/wp-content/uploads/2020/06/texture-strip.jpg); background-size: cover; height: 40px; width:100%; position: absolute; top:0px; left:0px; opacity: 0.6}

.floating_texture_bottom{height: 0px; width: 100%; position: relative; z-index: 20;}
.floating_texture_bottom > div{background-image:url(/wp-content/uploads/2020/06/texture-strip.jpg); background-size: cover; height: 40px; width:100%; position: absolute; bottom:0px; left:0px; opacity: 0.6}


.leaderBox{display: flex; align-items:stretch; margin: 30px auto; justify-content:space-between; max-width: 1100px}
.leaderBox > div{max-width:46%; flex-grow: 1; padding-top:30px; padding-bottom: 30px}
.leaderBox > div:first-of-type{padding-right:15px; border-bottom:2px solid #B2A39B;}
.leaderBox > div:last-of-type{padding-left:15px}
.leaderbox h2{padding-bottom:30px; font-size: 40px}

.leaderBox p{}



.bookingform{text-align: center; color: #fff; padding: 15px; z-index: 1}
.bookingform h2{font-size:38px; color:#FFFFFF}

.teamlist{display:flex; align-items: stretch; justify-content: space-between; flex-wrap: wrap; max-width: 1012px; margin: 60px auto}
.teamlist > div{flex-basis:33%; max-width: 280px; margin: 0 0 60px}
.teamlist h3{font-size:20px; color: #3A4245 !important; padding: 0px; margin: 0px}
.jobtitle{text-transform: uppercase; font-size: 12px; color:#3A4245; letter-spacing: 3px}
.teamexcerpt{color:#000000; font-size: 14px; line-height: 22px; padding: 15px 0}
.teamThumb{padding-bottom: 100%; background-size: cover; margin: 0 auto 10px}

.teamlist .flex{font-size:14px; font-weight:600}
.teamlist .flex > div:last-of-type{font-size: 26px; text-align: right}
.teamlist i:hover{opacity:0.8}

#signupform{}
#signupform input{margin: 15px 0; width:80%; max-width: 300px}

#bookButton{z-index: 100; font-family: 'Abril Fatface', cursive; font-size:24px; padding: 15px; background-color: #3A4245; color: #fff; text-align: center; width:100%; position: fixed; bottom:0px; left:0px; cursor:pointer; display:none}

#bookmenu{z-index: 101; padding: 30px; background-color: #3A4245; color: #fff; text-align: center; width:100%; position: fixed; top:0px; left:0px; height: 100%; display: none}
#bookmenu i{position: absolute; top:30px; right:30px; font-size:30px; color: #FDF6E5; cursor:pointer; z-index: 110}
#bookmenu i:hover{opacity:0.8}

.filterswitches{text-align: center; text-transform: uppercase; font-weight:600; margin: 30px 0 60px; letter-spacing: 3px}
.filterswitches span{cursor:pointer}
.filterswitches .active{color: #7F959B}

.evcontent p{max-width:1100px; margin: 0 auto;padding: 60px 0 0}

.photoTextBlock{display: inline-block; width:100%; max-width:532px; margin: 30px 0 30px 100px}
.photoTextBlock h2{color: #3A4245; font-size:36px}
.photoTextBlock > div:first-of-type{padding-bottom: 56%}
.photoTextBlock > div:last-of-type{}
.photoTextBlock:nth-of-type(odd){margin-right: 20px}

#findoutmoresWrap{text-align: center; padding: 60px 10px; max-width:1080px; margin: 0 auto}
#findoutmoresWrap .button{margin: 40px 0 0}
#findoutmoresWrap h2{font-size:36px}

.pagelinks{width:100%;; max-width:1080px; margin: 0px auto; display:block; padding: 30px 0}
.pagelinks > a{display: inline-block; border:1px solid #efefef; padding: 2px 10px; border-radius:3px; transition:all 200ms ease}
.pagelinks > a:hover{background-color: var(--blue); color: #fff; border-color:var(--blue)}

div.wpcf7-validation-errors, div.wpcf7-acceptance-missing{border:0px; border-color:#fff}

.enqformflex{align-items: stretch; max-width:838px; margin:0 auto}
.enqformflex > div{text-align: left; flex-grow: 1}
.enqformflex > div:last-of-type{width:473px}
.enqformflex label{font-size:14px; letter-spacing: 3px; text-transform: uppercase}
.enqformflex input{border:0px; border-radius:4px; padding: 10px; font-size:14px; color: #3A4245; background-color: #F7F4EC}
.enqformflex textarea{font-size:14px; color: #3A4245; border-radius:4px; padding: 10px; width:100%; min-height:250px; background-color: #F7F4EC}
.enquiryform select{width:100%; max-width:838px; margin: 0 auto; background-color: #F7F4EC; border-radius:4px}

.eatr-reviews-skeleton-container > div:last-of-type{display:none}


/* Woocommerce */
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button{
	background-color:var(--blue);
	font-weight:inherit;
	margin: 0 auto;
	border-radius:inherit;
	padding: 10px 80px 10px 30px; 
	border-top-right-radius:26px; 
	border-bottom-left-radius:26px;
	transition: background 0.3s ease; 
	font-size:22px; font-family: 'Abril Fatface', cursive; 
	color:#f7f4ec; 
	position: relative; 
	cursor:pointer; 
	line-height: normal; 
	border:0px;
	display:inline-block
}

.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{text-align:center}

.woocommerce-loop-product__title{text-align: center; font-size:22px !important; color: #3A4245; padding-bottom: 0px}

.woocommerce ul.products li.product .price{color:#3A4245; font-size:20px; text-align: center;}
.woocommerce ul.products li.product .price::before{content: "From ";}

.woocommerce-result-count, .woocommerce-ordering{display:none}

.productfilters{text-align: center; text-transform:uppercase; letter-spacing: 3px; font-weight:700; color:#3A4245; margin: 0 auto 20px}
.productfilters ul{list-style: none; padding:0px; margin:0px; height: inherit}
.productfilters li{display: inline-block; padding: 0 16px; border-right:2px solid #3A4245}
.productfilters li:first-of-type{border:0px}
.productfilters li:last-of-type{border:0px}
.productfilters a{padding:0px; margin:0px; display: inline; transition:all 200ms ease}
.productfilters a:hover{color:var(--blue)}

.greywrap{background-color: #efefef; margin:0px; padding: 40px 0}

.printpanel{padding: 0 0 60px}

.fixedwidth table{width:100%}
.fixedwidth td{padding: 10px; border-bottom:1px solid rgb(255, 255, 255, 0.3)}
.fixedwidth tbody > tr:first-of-type{font-weight:700}
.fixedwidth tbody > tr > td:first-of-type{font-weight:700}

.deadlineTable{color: #fff; margin-bottom:90px !important}
.deadlineTable td{width:33%}
.deadlineTable > tbody > tr > td:nth-of-type(1){background-color: #71bf44}
.deadlineTable > tbody > tr > td:nth-of-type(2){background-color: #f9a51b}
.deadlineTable > tbody > tr > td:nth-of-type(3){background-color: #00b59d}

.deadlineTable > tbody > tr:first-of-type > td:first-of-type{border-top-left-radius:12px}
.deadlineTable > tbody > tr:first-of-type > td:last-of-type{border-top-right-radius:12px}

.deadlineTable > tbody > tr:last-of-type > td:first-of-type{border-bottom-left-radius:12px}
.deadlineTable > tbody > tr:last-of-type > td:last-of-type{border-bottom-right-radius:12px}

.deadlineTable > tbody > tr:first-of-type > td:first-of-type{background-color: #52982a}
.deadlineTable > tbody > tr:first-of-type > td:nth-of-type(2){background-color: #e89000}
.deadlineTable > tbody > tr:first-of-type > td:nth-of-type(3){background-color: #018f7c}

@media (max-width: 1200px) {
	#mainnav{display: none}
	#mobnavbutton{display:block}
}

@media (max-width: 1200px) {
	.fixedwidth{max-width:90%}
}

@media (max-width: 900px) {
	.heroanimation .strapline{font-size:30px}
	.hpCols{flex-direction: column-reverse}
	.hpCols > div{width:100%; max-width:100% !important; padding: 20px !important}
}

@media (max-width: 800px) {
	#footerInner{flex-direction: column; max-width:90%; margin: 0 auto 40px}
	#footerInner > div{width:100%; max-width:100%; min-width:100%}
	#footerInner > div:nth-of-type(1){text-align: center; padding-bottom: 40px}
	#footerInner > div:nth-of-type(3){text-align: center; padding-top: 40px}
	#footerInner > div:nth-of-type(1) img{max-width: 200px}
	#credit{text-align: center}
	.heroanimation .strapline{font-size:24px}
	.flex{flex-direction: column}
	.flex > div{max-width:100% !important; width:100%}
	.priceflex > div{}
}


@media (max-width: 700px) {
	.heroanimation .strapline{font-size:22px}
	.sizeFlex{flex-direction: column}
	.sizeFlex > div{width:100%; max-width:100% !important}
}
@media (max-width: 600px) {
	.heroanimation .strapline{font-size:20px}
}
@media (max-width: 400px) {

}