/*
Theme Name: Peppa Pig
Theme URI: n/a
Author: Raffaele Malanga / Els van Bloois
Author URI: https://farstudios.com/
Description: Theme for PeppaPigLive.com
Version: 1.0
License: no license, use a theme from https://wordpress.org/themes/ instead.
License URI: n/a
Tags: n/a
Text Domain: peppapig
*/

/* generic things */

html,body,h1,h2,h3,h4,h5,h6,p,ul,li,blockquote,form{
	padding:0;
	margin:0;
}
*{
	box-sizing:border-box;
}
html {
	font-size:16px; /* for rem base */
	scroll-behavior: smooth;
	/* note: this replaces the javascript version, which is not accessible due to the 'return false' setting. */
}
.skip-link,
.site-nav li.icon a span{
	position:fixed;
	top:-4000rem;
	left:-4000rem;
}
.skip-link:focus,
#toggle a:focus span.skip-link{
	top:3rem;
	left:2rem;
	background:black;
	color:white;
	padding:.5rem 1rem;
	border:2px dotted white;
	text-decoration:none;
	text-transform:uppercase;
	font-size:100%;
	text-indent:0 !important; /* to override text-indent from burger nav */
	z-index:10002;
}
.admin-bar .skip-link:focus,
#toggle a:focus span.skip-link{
	top:4rem;
}
iframe,
img{
	max-width:100%;
}

/* colours */

/*
#3fbfef - blue background
#007dc3 - blue text + button bg
#00446a - blue text link mouseover colour
#88B9F7 - blue separator lines
#76c76d - green
#fa48a8 - pink
#f7f28d - yellow
#333366 - facebook blue
#6f6f6f - grey

*/
body{
	/* background:#fff; */
	background:#3fbfef; /* to avoid the white flash below the topnav bar when scrolling too fast */
	color:#000;
}
.linkbar{
	background:#fff;
	color:#fa48a8;
}
.linkbar:after{
	content:" ";
	display:block;
	width:100%;
	height:11px;
	position:absolute;
	left:0;
	bottom:-11px;
	background:url(img/link-bar-background.png) transparent repeat center bottom;
}
#masthead{
	background:#3fbfef;
}
#nav{
	background:#3fbfef;
	background-position:center top;
	background-repeat:no-repeat;
	background-image:url(img/background-page.png);
}
/*
.page-id-593 #nav{
	background-color:#55c0eb;
}
*/
#content{
	background:#76c76d;
	background-position:center top;
	background-repeat:repeat-x;
	/* background-attachment:fixed; */
}
.page-id-593 #content{
	background-color:#E8F7FF; /* lightblue for snow background image */
}
.page-template-page-resources #content{
	background:#007DC3;
	color:#fff;
}
.page-id-2 #page{
	background:#3fbfef;
	background-position:center top;
	background-repeat:no-repeat;
	background-image:url(img/background-page.png);

}
.page-id-2 #content{
	background-color:#74B84C;
	background-image:url(img/background-splash.gif);
}
.page-template-page-show-main #content{
	min-height:calc(530px); /* to make sure the image is not cut off */
	background-image:url(img/background-fundayout-hero.png);
}
@media(max-width:768px){
	.page-template-page-show-main #content{
		min-height:150vw; /* to make sure the image is not cut off */
		background-position:center bottom;
		background-image:url(img/background-fundayout-hero-mobile.png);
		background-size:100% auto;
	}
}
@media(max-width:620px){
	.page-template-page-show-main #content{
		min-height:150vw; /* to make sure the image is not cut off */
		background-position:center;
		background-image:url(img/background-fundayout-hero-mobile.png);
		background-size:100% auto;
	}
}
@media(max-width:360px){
	.page-template-page-show-main #content{
		min-height:170vw; /* to make sure the image is not cut off */
		background-position:center bottom;
		background-image:url(img/background-fundayout-hero-mobile.png);
		background-size:100% auto;
	}
}

.page-id-10 #content{
	background-image:url(img/background-tour.png);
}
.page-id-12 #content{
	background-image:url(img/background-story.png);
}
.page-id-14 #content{
	background-image:url(img/background-cast.png);
}
.page-id-16 #content{
	background-image:url(img/background-characters.png);
}
.page-id-18 #content{
	background-image:url(img/background-video.png);
}
.page-id-20 #content{
	background-image:url(img/background-gallery.png);
}
.page-id-22 #content{
	background-image:url(img/background-reviews.png);
}
.page-id-593 #content{
	min-height:48.75rem; /* 780px */
	background-image:url(img/background-christmas.png);
}

.bio #content,
#content .hentry{
	background:#f7f28d;
	color:#007dc3;
}
.page-template-page-resources #content .hentry{
	background:#A8DFF4;
	color:#007dc3;
}
.page-template-page-resources #content .hentry a{
	color:#fa48a8;
}
.page-template-page-resources #content .hentry .resources li div{
	background:#007dc3;
	color:#fff;
}
#content .hentry.nobg{
	background:transparent;
	color:#fff;
}
.postcode-box{
	background:#fff;
	border-color:#fa48a8;
}
.tourdates li{
	border-color:#fa48a8;
}
.reviewsblock{
	border-color:#88B9F7;
}
.review{
	background:#76c76d;
	color:#f7f28d;
	border-color:#fff;
	box-shadow:0 9px rgba(0,0,0,.25);
}
.review .byline{
	color:#fff;
}
.videobox,
.bx-viewport{
	border-color:#fff;
	box-shadow:0 9px rgba(0,0,0,.25);
}
.pink{
	color:#fa48a8;
}
.facebook-blue{
	color:#333366;
}
.items li .portrait{
	border-color:#fff;
}
h1 span.role,
h2 span.role{
	color:#6f6f6f;
}

/* footer border deco */
.site-content{
	position:relative;
}
.site-content:after{
	content:" ";
	display:block;
	width:100%;
	height:2.7rem;
	position:absolute;
	left:0;
	bottom:0;
	background:url(img/footer-top2.png) #007DC3 repeat-x center top;
}
.page-template-page-home .site-content:after{
	background-image:url(img/shortcut-index-top.png);
}
.page-id-593 .site-content:after{
	background-image:url(img/footer-top-xmas.png);
}
.page-template-page-resources .site-content:after,
.page-template-page-show-main .site-content:after{
	display:none;
}
.bio .site-content:after{
	display:none;
}
.footerextra .outer{
	position:relative;
	padding-bottom:1px; /* to keep the colour inside */
}
.footerextra .inner{
	padding:3rem 0 2rem 0;
}
.footerextra .separator{
	position:absolute;
	left:0;
	top:100%;
	width:100%;
	background-repeat:repeat;
	background-position:center top;
	z-index:1;
}
.page-id-211 .entry-content h3{
	color:#333;
}
.bordershow img,
.facebookbox{
	background:#fff;
	border-color:#fff;
}
.facebookbox,
.shortcuts li img{
	box-shadow:0 9px rgba(0,0,0,.25);
}

hr{
	background-color:#fa48a8;
}
#tcfaqmenu{
	border-color:#88B9F7;
}
#tcfaqmenu p{
	color:#333;
}

.tourtabs li a,
.tourtabs li span.tourtabbuttoninactive{
	color:#f7f28d;
	border-color:#fff;
	box-shadow:0 9px rgba(0,0,0,.25);
}
.tourtabs li a{
	background:#fa48a8;
}
.tourtabs li a:focus,
.tourtabs li a:hover,
.tourtabs li a:active,
.tourtabs li span.tourtabbuttoninactive{
	background:#007DC9;
}



.tourdates span.phone{
	color:#fa48a8;
}
#colophon{
	position:relative;
	background:#fff;
}
#colophon:before{
	content:" ";
	display:block;
	width:100%;
	height:11px;
	position:absolute;
	left:0;
	top:0;
	background:url(img/footer-top.png) #fff repeat-x center bottom;
}
ul.socialmedia li a{
	background-size:contain;
}
ul.socialmedia li a.icon-fb{
	background-image:url(img/facebook.png);
}
ul.socialmedia li a.icon-tw{
	background-image:url(img/twitter.png);
}
ul.socialmedia li a.icon-yt{
	background-image:url(img/youtube.png);
}
ul.socialmedia li a.icon-signup{
	background-image:url(img/signup.png);
}
ul.socialmedia li a.icon-fb:hover{
	background-image:url(img/facebook-over.png);
}
ul.socialmedia li a.icon-tw:hover{
	background-image:url(img/twitter-over.png);
}
ul.socialmedia li a.icon-yt:hover{
	background-image:url(img/youtube-over.png);
}
ul.socialmedia li a.icon-signup:hover{
	background-image:url(img/signup-over.png);
}



a{
	color:inherit;
}
.review .byline a{
	color:#007dc3;
}
.review .byline a:focus,
.review .byline a:hover,
.review .byline a:active{
	color:#00446a;
}
.linkbar a:focus,
.linkbar a:hover,
.linkbar a:active{
	color:#007dc3;
}
.tourdates li span.book a{
	background:#fa48a8;
	color:#fff;
}
.tourdates li span.book a:focus,
.tourdates li span.book a:hover,
.tourdates li span.book a:active{
	background:#007dc3;
}
#tcfaqmenu a{
	color:#fa48a8;
}
#tcfaqmenu a:focus,
#tcfaqmenu a:hover,
#tcfaqmenu a:active{
	color:#007dc3;
}

input[type="text"],
textarea{
	border-color:#f6f6f6;
	background:#fff;
	color:#000;
}
input[type=submit]{
	border-color:#f6f6f6;
	background:#fa48a8;
	color:#fff;
}
a.button{
	border-color:#fff;
	background:#fa48a8;
	color:#fff;
	box-shadow:0 9px rgba(0,0,0,.25);
}
a#BtnGetCurrentLocation{
	padding-left:calc(30px + 1.6em);
	background-image:url(img/pin.png);
	background-repeat:no-repeat;
	background-position:.8em center;
}
#colophon a.button{
	box-shadow:none;
}
a.fbbutton{
	background:#333366;
}
input[type=submit]:focus,
input[type=submit]:hover,
input[type=submit]:active,
a.button:focus,
a.button:hover,
a.button:active{
	background:#007dc9;
}



/* fonts */
@font-face {
    font-family: 'peppabold';
    src: url('fonts/peppabold-webfont.eot');
    src: url('fonts/peppabold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/peppabold-webfont.woff2') format('woff2'),
         url('fonts/peppabold-webfont.woff') format('woff'),
         url('fonts/peppabold-webfont.ttf') format('truetype'),
         url('fonts/peppabold-webfont.svg#peppabold') format('svg');
    font-weight: normal;
    font-style: normal;

}
body{
	font-family:'peppabold',Arial,sans-serif;
	font-size:100%;
	line-height:1;
}
input,textarea{
	font-family:'peppabold',Arial,sans-serif;
}
cite{
	font-style:normal;
}
h1,h2,h3,h4,h5,h6{
	font-weight:400;
}
h1,h2{
	font-size:1.75rem;
	line-height:1.2;
	margin-bottom:0.3em;
}
h1 span.role,
h2 span.role{
	font-size:1rem;
}

h3{
	font-size:1.4rem;
	line-height:1.2;
	margin-bottom:.6em;
}
.postcode-box .locations h3,
p,ul,ol,form,input,textarea{
	font-size:1.2rem;
	line-height:1.6;
	margin-bottom:.8em;
}
h1.site-title,
p.site-title{
	font-size:1.2rem !important;
	font-weight:400 !important;
	line-height:1.6 !important;
	margin-bottom:.8em !important;
}	

.linkbar p,
.linkbar ul{
	font-size:1rem;
	margin-bottom:0;
}
.review .stars,
.review blockquote p{
	font-size:1.4rem;
	line-height:1;
	margin-bottom:0;
}
.review .byline{
	font-size:1rem;
	line-height:1.2;
	padding-top:.6em;
}
.items li span.role{
	font-size:.85rem;
}
p.smalltext,
p small{
	font-size:.85rem;
}
#tcfaqmenu p,
#tcfaqmenu ul{
	font-size:1.4rem;
}
.page-template-page-resources #content .hentry .resources li div{
	font-size:1.2rem;
	line-height:1.5;
}
#colophon p{
	font-size:1rem;
}



@media(min-width:520px){
	h1,h2{
		font-size:3rem;
	}
	h1 span.role,
	h2 span.role{
		font-size:2rem;
	}
	h3{
		font-size:1.8rem;
	}
	.postcode-box .locations h3,
	p,ul,ol,form,input,textarea{
		font-size:1.5rem;
	}
	h1.site-title,
	p.site-title{
		font-size:1.5rem !important;
	}	
	.linkbar p,
	.linkbar ul{
		font-size:1.2rem;
	}
	.review .stars,
	.review blockquote p{
		font-size:2rem;
	}
	.review .byline{
		font-size:1.15rem;
	}
	#tcfaqmenu p,
	#tcfaqmenu ul{
		font-size:1.6rem;
	}
}

/* text-deco */

.linkbar a,
#toggle a,
.items a,
.tourtabs a,
.tourdates a,
#tcfaqmenu a,
.backlink a,
a.button{
	text-decoration:none;
}


/* layout */

#nav,
.outer{
	padding:0 2vw;
}
.inner{
	max-width:61rem;
	margin:0 auto;
}
.linkbar{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	z-index:10001;
}
.admin-bar .linkbar{
	top:32px;
}
@media(max-width:782px){
	.admin-bar .linkbar{
		top:46px;
	}
}
.linkbar ul{
	list-style:none;
}
.linkbar ul li{
	display:inline-block;
	margin-right:2rem;
}
#page{
	padding-top:13rem; /* same as #masthead height */
}
#nav{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:0;
	min-height:13rem; /* enough height for logo + nav menus */
	padding-top:3rem; /* room for the linkbar */
	transition:all .5s ease-in-out 0s;
	z-index:10000;
}
.scrolled #nav{
	min-height:6rem; /* enough height for logo + nav menus */
	padding-top:.5rem;
}
.admin-bar #nav{
	top:32px;
}

@media(max-width:782px){
	.admin-bar #nav{
		top:46px;
	}
}
#nav .inner{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
}
.site-branding{
	width:11.25rem;
	max-width:17.25rem;
	transition:width .5s ease-in-out 0s;
	order:0;
}
.page-template-page-show-main .site-branding{
	width:calc(100% - 35rem);
}

.scrolled .site-branding{
	width:6rem !important; /* also needs to work on show main pages */
	padding-top:.5rem;
}
.site-branding a,
.site-branding a img{
	display:block;
	width:100%;
}
#toggle{
	display:none;
	order:1;
}
#navcontent{
	order:2;
}
.site-nav{
	display:flex;
	justify-content:flex-end;
	width:35rem; /* enough for the original 7 menu items and their images */
}
.site-nav .main-navigation{
	text-align:center;
}
.site-nav .navi{
	display:inline-block;
}
.site-nav li{
	height:4.6875rem;
	display:inline-block;
	margin-left:1rem;
}
.site-nav li a,
.site-nav li a img{
	display:block;
	height:100%;
	transition:all .2s ease-in-out 0s;
}
.site-nav li a:focus,
.site-nav li a:hover,
.site-nav li a:active{
	transform:scale(1.1);
}

#primary{
	padding-top:2rem;
}
.hentry{
	padding:5%;
	border-radius:1.25rem;
}
.wideonly{
	display:none;
}
@media(min-width:490px){
	.wideonly{
		display:block;
	}
	.mobileonly{
		display:none;
	}
}

hr{
	border-width:0;
	width:100%;
	height:1px;
	margin:1.5rem 0;
}
.imgbox{
	margin-bottom:1rem;
}
.showmainintro{
	max-width:100%;
	text-align:center;
	margin:0 auto;
}
.sideimg{
	display:flex;
	justify-content:flex-start;
	gap:2rem;
}
.sideimg.imgonright .imgcol{
	order:2;
}
@media(max-width:480px){
	.sideimg{
		flex-wrap:wrap;
	}
	.sideimg .imgcol,
	.sideimg .txtcol{
		width:100%;
	}
}

@media(max-width:599px){
	.footerextra .twocols .col{
		max-width:490px;
		margin:0 auto 2rem auto;
	}
}
@media(min-width:600px){
	.twocols{
		display:flex;
		flex-wrap:wrap;
		justify-content:space-between;
		margin-bottom:2rem;
	}
	.twocols .col{
		width:calc(50% - 1rem);
	}
	.col .reviewsblock:first-child{
		border-top-width:0;
		padding-top:0;
	}
}
.shortcuts ul{
	list-style:none;
	margin-bottom:0;
}
.shortcuts ul li{
	display:block;
	margin-bottom:2rem;
}
.shortcuts ul li:last-child{
	margin-bottom:0;
}
.shortcuts li a{
	display:block;
}
.shortcuts li a img{
	display:block;
}
.bordershow img,
.facebookbox{
	display:block;
	border-width:5px;
	border-style:solid;
	border-radius:1.25rem;
	overflow:hidden;
}
.facebookbox{
	padding:1rem;
}

.postcode-box{
	text-align:center;
	padding:1rem;
	border-width:1px;
	border-style:solid;
}
#postcodesearchform{
	display:flex;
	justify-content:center;
	max-width:36rem;
	margin:0 auto;
}
#postcodesearchform input[type=text]{
	width:calc(100% - 5rem);
}
.postcode-box .locations,
.postcode-box .nearestvenues{
	text-align:left;
}
.postcode-box .locations h3,
.postcode-box .locations ul,
.postcode-box .locations ul li{
	display:inline-block;
	margin-right:.6em;
}
.postcode-box ul{
	list-style:none;
}
.postcode-box .nearestvenues a{
	margin-left:1rem;
}

.tourtabs li{
	display:inline-block;
	margin-right:1em;
}
.tourtabs li a,
.tourtabs li span.tourtabbuttoninactive{
	display:block;
	padding:1rem;
	border-width:5px;
	border-style:solid;
	border-radius:1.25rem;
	margin-bottom:1.5rem;
}
.maplistwrapper{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:flex-start; /* very important so the .map does not get stretched! */
	/* if the .map gets stretched, the positions will be off on different screens! */
	gap:2rem;
}
.maplistwrapper .map{
	width:clamp(13rem, 60% - 1rem, 100%);
}
.maplistwrapper .list{
	width:clamp(13rem, 35%, 100%);
}
@media(max-width:540px){
	.maplistwrapper .map,
	.maplistwrapper .list{
		width:100%;
	}
	.maplistwrapper .list ul{
		columns:2;
		gap:1em;
	}
}
.maplistwrapper .map img.mapimage{
	display:block;
	width:100%;
	margin:0;
	/* if the position or size needs to change, this must be applied to .map, */
	/* since all the positons of the markers are relative to .map */
}
.maplistwrapper .map{
	position:relative;
}
.maplistwrapper .map li{
	position:absolute;
	width:12%;
	margin-left:-6%;
	margin-top:-6%;
}
.maplistwrapper .map li a{
	display:block;
	width:100%;
	padding-top:100%;
}
.maplistwrapper .map li img{
	display:none;
	width:100%;
}

.maplistwrapper .map li#mapnr1{
	top:23%;
	left:52%;
}
.maplistwrapper .map li#mapnr2{
	top:44%;
	left:35%;
}
.maplistwrapper .map li#mapnr3{
	top:50%;
	left:75%;
}
.maplistwrapper .map li#mapnr4{
	top:52%;
	left:60%;
}
.maplistwrapper .map li#mapnr5{
	top:59%;
	left:25%;
}
.maplistwrapper .map li#mapnr6{
	top:66%;
	left:72%;
}
.maplistwrapper .map li#mapnr7{
	top:69%;
	left:53%;
}
.maplistwrapper .map li#mapnr8{
	top:69%;
	left:92%;
}
.maplistwrapper .map li#mapnr9{
	top:76%;
	left:82%;
}
.maplistwrapper .map li#mapnr10{
	top:83%;
	left:56%;
}
.maplistwrapper .map li#mapnr11{
	top:85%;
	left:81%;
}
.maplistwrapper .map li#mapnr12{
	top:82%;
	left:93%;
}





.maplistwrapper ul{
	list-style:none;
}
.maplistwrapper ul li img{
	vertical-align:middle;
	margin-right:1em;
}
.tourdates{
	list-style:none;
	text-align:center;
}
.tourdates li{
	display:flex;
	flex-wrap:wrap;
	padding:1em 0;
	border-width:0 0 1px 0;
	border-style:solid;
}
.tourdates li span{
	display:inline-block;
	width:100%;
	vertical-align:top;
}
.tourdates li span.city{
	width:auto;
	text-transform:uppercase;
}
.tourdates li span.boxoffice{
	width:auto;
}
.tourdates li span.book a{
	display:block;
	width:8em;
	text-align:center;
	border-radius:.5rem;
	margin-left:auto;
	margin-right:auto;
}
.tourdates li span.book a{
	margin-top:.5em;
}
.tourdates li span.phone.hidden{
	display:none;
}
@media(min-width:360px){
	.tourdates li span.venue br,
	.tourdates li span.phone br{
		display:none;
	}
	.tourdates li span.boxoffice:after{
		content:":";
	}
}
@media(min-width:800px){
	.tourdates{
		text-align:left;
	}
	.tourdates li span.date,
	.tourdates li span.venuefull{
		width:50%;
	}
	.tourdates li span.phone,
	.tourdates li span.book{
		width:50%;
		text-align:right;
	}
	.tourdates li span.book a,
	.tourdates li span.book span.onsalesoon{
		margin-right:0;
	}
	.tourdates li span.phone{
		text-align:right;
	}
	.tourdates li span.phone.hidden{
		display:block;
	}
	.tourdates li span.date{order:0;}
	.tourdates li span.phone{order:1;}
	.tourdates li span.venuefull{order:2;}
	.tourdates li span.book{order:3;}
}
@media(min-width:1000px){
	.tourdates li span.date{order:0;}
	.tourdates li span.phone{order:0;}
	.tourdates li span.venuefull{order:0;}
	.tourdates li span.book{order:0;}

	.tourdates li span.venue br,
	.tourdates li span.phone br{
		display:initial;
	}
	.tourdates li span.date{
		width:30%;
		padding-right:1em;
	}
	.tourdates li span.venuefull{
		width:27%;
	}
	.tourdates li span.phone{
		width:20%;
		text-align:left;
	}
	.tourdates li span.boxoffice:after{
		display:none;
	}	
	.tourdates li span.phone.hidden{
		display:inline-block;
	}
	.tourdates li span.book{
		width:23%;
	}
	.tourdates li span.book a{
		margin-top:0;
	}
}
.belowtourdates{
	text-align:center;
	padding:.6em 0 1.2em 0;
}

.facebookcta{
	padding-top:2rem;
	text-align:center;
}
a.button{
	display:inline-block;
	text-align:center;
	padding:.5em .8em;
	border-width:5px;
	border-style:solid;
	border-radius:.75rem;
}
input{
	display:inline-block;
	padding:.5em .8em;
	border-width:5px;
	border-style:solid;
}

#postcodesearchform input[type=text]{
	border-width:5px 0 5px 5px;
}
.reviewsblock{
	padding-top:1.25rem;
	padding-bottom:1rem;
	border-top-width:1px;
	border-top-style:solid;
}
.review{
	padding:1rem;
	border-width:5px;
	border-style:solid;
	border-radius:1.25rem;
	margin-bottom:1.5rem;
}
.review .byline{
	display:block;
}
.review .byline a{
	white-space:nowrap;
}
.videowrapper,
.gallerywrapper{
	/* to include the caption */
	text-align:center;
	margin-bottom:3rem;
}
.videobox{
	position:relative;
	width:100%;
	height:0;
	padding-top:56.25%;
	border-width:5px;
	border-style:solid;
	border-radius:1.25rem;
	margin-bottom:1.5rem;
	overflow:hidden;
}
.videobox iframe{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.bx-viewport{
	border-width:5px;
	border-style:solid;
	border-radius:1.25rem;
	overflow:hidden;
}
.videowrapper .caption,
.gallerywrapper .caption{
}
.items{
	list-style:none;
	display:flex;
	flex-wrap:wrap;
	margin-left:-1%;
	margin-right:-1%;
	margin-left:-.5rem;
	margin-right:-.5rem;
}
.items li{
	width:50%;
	padding:1%;
	padding:.5rem;
	text-align:center;
	margin-bottom:4%;
}
.items li a,
.items li span{
	display:block;
}
.items li .portrait{
	border-width:5px;
	border-style:solid;
	border-radius:1.25rem;
	overflow:hidden;
	transition:all .2s ease-in-out 0s;
	max-width:300px;
	margin:0 auto;
}
.items li .portrait img{
	display:block;
	transition:all .2s ease-in-out 0s;
}
.items li a:focus .portrait,
.items li a:hover .portrait,
.items li a:active .portrait{
	transform:scale(1.1);
}
.items li a:focus img,
.items li a:hover img,
.items li a:active img{
	transform:scale(1.05);
}
.items li span.name{
	padding-top:.2em;
}

@media(min-width:520px){
	.items li{
		width:33.33%;
	}
}
@media(min-width:800px){
	.items li{
		width:25%;
	}
}
@media(max-width:320px){
	.items li{
		width:100%;
	}
}
.fancybox-slide--iframe .fancybox-content{
	max-width:62rem !important;
	border-radius:1.25rem;
	overflow:hidden !important;
}
.bio .portrait img{
	border-radius:1.25rem;
	margin-bottom:1rem;
}

#tcfaqmenu{
	text-align:center;
	padding:1em 0;
	border-width:1px 0;
	border-style:solid;
}
#tcfaqmenu p,
#tcfaqmenu ul,
#tcfaqmenu ul li{
	display:inline-block;
	margin-bottom:0;
}
#tcfaqmenu ul li:before{
	content:" | ";
	padding:0 .2em;
}
#tcfaqmenu ul li:first-child:before{
	content:" ";
}
.site-main{
	padding-bottom:170px !important;
}
.page-template-page-resources #content .hentry .resources li div{
	display:inline-block;
	padding:0 .7em .2em .7em;
	border-radius:1em;
	margin:0 auto;
}
p.backlink{
	padding-top:1em;
	text-align:center;
}
#colophon{
	text-align:center;
	padding-top:2rem;
	padding-bottom:4rem;
}
#colopon ul{
	list-style:none;
}
#colophon ul li{
	display:inline-block;
}
ul.socialmedia li{
	padding:.2em;
}
ul.socialmedia li a{
	display:inline-block;
	width:3rem;
	height:3rem;
}
ul.socialmedia li a span{
	display:inline-block;
	width:3rem;
	text-indent:4rem;
	overflow:hidden;
}
ul.socialmedia li a.icon-signup{
	width:12.6875rem;
}
ul.socialmedia li a.icon-signup span{
	width:12.6875rem;
	text-indent:12.6875rem;
	white-space:nowrap; /* otherwise 'up' goes on 2nd line */
}

ul.footerlogos{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-around;
}
ul.footerlogos li a{
	display:inline-block;
}


/* pagination */
/* kriesi */

.pagination{
	text-align:center;
	padding:3rem 0;
}
.pagepn{
	text-indent:-250rem;
	background-repeat:no-repeat;
	background-position:center;
	background-size:auto 1rem;
}
.page-first{background-image:url(img/page-first.png);}
.page-prev{background-image:url(img/page-prev.png);}
.page-next{background-image:url(img/page-next.png);}
.page-last{background-image:url(img/page-last.png);}

.pagination a,
.pagination span{
	display:inline-block;
	width:1.75rem;
	height:1.75rem;
	font-size:.875rem;
	font-weight:600;
	line-height:1.75rem;
	border-radius:1.75rem;
	box-sizing:border-box;
	padding-top:.1rem;
}
.pagination a.inactive{
	opacity:0.5;
	cursor:default;
}
.page-numbers{
	color:inherit;
	margin:0 .5rem;
}
.page-numbers.current{
	background:#FF5229;
	color:#fff;
}
.page-prev{
	margin-left:-.5rem;
	margin-right:.5rem;
}
.page-next{
	margin-right:-.5rem;
	margin-left:.5rem;
}


/* webkit things */

input[type=text],
input[type=search],
input[type=button],
input[type=email],
input[type=submit],
textarea{
	-webkit-appearance:none;
	-webkit-border-radius:0;
}
*{
	-webkit-text-size-adjust:100%;
}

/* Where placeholder needs to obey the styles */

/* fix the stupid placeholder colour */
/* separate rules, because: "a group of selectors containing an invalid selector is invalid". */
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	font-family:'peppabold',Arial,sans-serif;
	font-size:1.2rem;
	color:#666;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	font-family:'peppabold',Arial,sans-serif;
	font-size:1.2rem;
	color:#666;
	opacity:1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
	font-family:'peppabold',Arial,sans-serif;
	font-size:1.2rem;
	color:#666;
	opacity:1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
	font-family:'peppabold',Arial,sans-serif;
	font-size:1.2rem;
	color:#666;
}
::-ms-input-placeholder { /* Microsoft Edge */
	font-family:'peppabold',Arial,sans-serif;
	font-size:1.2rem;
	color:#666;
}
@media(min-width:520px){
	::-webkit-input-placeholder { /* WebKit, Blink, Edge */
		font-size:1.5rem;
	}
	:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
		font-size:1.5rem;
	}
	::-moz-placeholder { /* Mozilla Firefox 19+ */
		font-size:1.5rem;
	}
	:-ms-input-placeholder { /* Internet Explorer 10-11 */
		font-size:1.5rem;
	}
	::-ms-input-placeholder { /* Microsoft Edge */
		font-size:1.5rem;
	}
}

@media(max-width:900px){
	.linkbar ul li.wide-only{
		display:none;
	}
}

@media(max-width:790px){

/* temp */

/* end temp */

	.site-branding{
		width:6rem !important; /* also needs to work on show main pages */;
	}
	#page{
		padding-top:9rem; /* same as #nav height */
	}
	#nav{
		min-height:9rem;
		height:9rem; /* enough to show the logo */
		overflow:hidden;
		background:#3fbfef;
	}
	.scrolled #nav{
		min-height:6rem;
		height:6rem;
	}
	#nav .inner{
		align-items:flex-start;
	}
	#toggle{
		display:block;
		width:3rem;
		height:4rem; /* same height as #nav when #nav is closed */
		color:#fff;
		order:1;
		padding-top:1.5rem;
	}
	#toggle a{
		display:block;
		width:100%;
		height:100%;
		font-size:1.5rem;
		text-indent:-3em;
	}
	#toggle a span.burger{
		display:block;
		width:100%;
		height:100%;
		margin-top:-1.2em;
	}
	#toggle a span.burger:before,
	#toggle a span.burger:after{
		content:" ";
		display:block;
		width:3rem;
	}
	#toggle a.navisclosed span.burger:after{
		box-shadow: 0 8px 0 2px #ffffff, 0 16px 0 2px #ffffff, 0 24px 0 2px #ffffff;
	}
	#toggle a.navisopen span.burger:before{
		transform:rotate(-20deg) translate(-6px, 0);
		box-shadow:0 16px 0 2px #ffffff;
	}
	#toggle a.navisopen span.burger:after{
		transform:rotate(20deg) translate(6px, 0);
		box-shadow:0 16px 0 2px #ffffff;
	}
	#navcontent{
		width:100%;
		display:none;
	}
	#navcontent #site-navigation{
		display:block;
	}
	.site-anv .nav-menu{
		display:flex;
		flex-wrap:wrap;
		justify-content:space-around;
	}
	.site-nav li{
		width:auto;
		height:auto;
		text-align:center;
		padding:0 4vw 2vw 4vw;
		margin:0 auto;
	}
	
	
	.toggled-on #nav,
	#nav:target{
		height:100%;
	}
	@media(max-height:550px){
		.toggled-on #nav,
		#nav:target{
			overflow:auto;
		}
	}

	.toggled-on #navcontent,
	#nav:target #navcontent{
		display:block;
		padding-bottom:5rem;
		/* to make sure that even with the admin bar, there will be */
		/* a scrollbar for the last items in the list */
	}
	@media(max-width:560px){
		.site-nav li{
			height:6rem;
		}
	}
	@media(max-width:490px){
		.site-nav li{
			height:5.5rem;
		}
	}
	#nav .navisopen,
	#nav:target .navisclosed,
	.toggled-on #nav .navisclosed{
		display:none;
	}
	#nav .navisclosed,
	#nav:target .navisopen,
	.toggled-on #nav .navisopen{
		display:block;
	}

}
@media(max-width:359px){
	.linkbar ul li.hide-on-mobile{
		display:none;
	}
}