

   /* ----------------                                  ---------------- */
  /* --------                  Global Elements                 -------- */
 /* ----------------                                  ---------------- */


:root{
	--left: calc(50% - 740px);
	--width: calc(100% - (50% - 740px));
	--widthboth: calc(100% - (100% - 1480px));
	--heightgap: calc(100% - 140px);
}

@media (max-width:1700px){
	:root{
		--left: calc((100% - 1280px) / 4);
		--width:calc(100% - ((100% - 1280px) / 4));
		--widthboth: calc(100% - ((100% - 1280px) / 2));
	}
}
@media (max-width:1376px){
	:root{
		--left: 24px;
		--width: calc(100% - 24px);
		--widthboth: calc(100% - 48px);
	}
}

.line { position: absolute; background:var(--white); z-index: 3; height:0px; width:0px;}
.line.vert { height:0%;  left:var(--left); width:1px; top:0; transition:1.5s height ease-in-out; }
.line.vert.opaque { height:100%; transition:1.5s height ease-in-out; }

.line.horiz { width:0%;  left:var(--left); height:1px; top:100px; transition:1.5s width 1.2s ease-in-out; }
.line.horiz.opaque { width:var(--width);  transition:1.5s width 1.2s ease-in-out; }

.line.bottom { top:unset; bottom:74px;}
.line.left { left:var(--left); }
.line.right { right:var(--left); left:unset;}
.line.horiz.widthboth.opaque { width:var(--widthboth);}
.line.horiz.widthboth { left:unset; right:var(--left);}
.line.vert.right.opaque {height: calc(100% - 75px);transition: 1.5s height ease-in-out;}
.line.vert.bottom { height:0px; bottom:unset; top:calc(100% - 75px);}
.line.vert.bottom.opaque { height:75px;}

.masthead:not(#main-panel-1) .line.horiz { transition:1.5s width 0s ease-in-out; }
.masthead:not(#main-panel-1) .line#mastheadline3 { transition:.25s height 1.5s ease-in-out; }

.semicircle-outer { width:40px; height:80px; bottom:34px; left:var(--left); overflow: hidden; background:transparent;}
.semicircle-mid { position: absolute; width:40px; height:80px; top:0; left:-40px; overflow: hidden; background:transparent;}
.semicircle-inner { position: absolute; width:80px; height:80px; top:0px; right:-40px; border:1px solid var(--white); border-radius: 100vh; background:transparent;}

.semicircle-outer .semicircle-mid { transform:rotate(0deg); transition:1s transform 1.75s ease-in-out; }
.semicircle-outer.opaque .semicircle-mid { transform:rotate(180deg); transition:1s transform 1.75s ease-in-out; transform-origin: right; }


.line.header { position:fixed; top:0px; width:var(--left);left:0; height: 110px; z-index: 9;}
.line.header .lineinner { position:absolute; bottom:0px; width:var(--left); border:var(--midnight) 1px solid; border-bottom:none; border-left:none; opacity:0; transition:.5s height ease-in, .5s width .5s ease-out; right:-1px; height:0px; }
.line.header.opaque .lineinner { opacity:1; transition:.5s height ease-in, .5s width .5s ease-out; width:calc(100% + 1px); height:55px;}

@media (max-width:575px){
	.line.header{ height: 67px;}
}

.insights.page-panel { padding-top:0px; padding-bottom: 0px;}
.insight-shelf { position:relative; padding-top:50px;}
.insights.page-panel .insight-shelf-1 {padding-top:90px;}

.horiz_runner  {position: relative;top: 0;left: 0;height: 1px;width: 100%;display: block;}

.entry-content .horiz_runner {
	position: absolute;
	bottom: 0;
	top:unset;
}

.flex-panel-outer .horiz_runner {position: absolute;top: unset;bottom: -1px;}


.horiz_runner .horiz_inner { display: block;min-height:1px; position: relative; left:var(--left); width:var(--widthboth);}
.horiz_runner .horiz_inner::before { width:0px; height:1px; content: ''; position: absolute; left:0; top:0; background:var(--midnight); z-index: 3; transition: 1s width ease-in-out; }
.horiz_runner.opaque .horiz_inner::before { width:100%; transition: 1s width ease-in-out;}
.horiz_runner:nth-of-type(2n) .horiz_inner::before { left:unset; right:0;}

.horiz_runner.brick-runner .horiz_inner.brick-inner{ height:23px;margin-top:-25px; width:0px; opacity:0; transition: 1s width ease-in-out, 0s opacity 1s linear; position: relative;}
.horiz_runner.brick-runner.opaque .horiz_inner.brick-inner{ width:var(--widthboth); opacity:1; transition: 1s width ease-in-out;}
.horiz_runner.brick-runner .horiz_inner.brick-inner::before{ opacity:1; border:1px solid var(--midnight); border-left:none; border-right:none; height:23px; background: url("/wp-content/themes/peninsula/images/bricks.png") 0px -1px repeat; width:100%;}
.horiz_runner.brick-runner .left-border{ height:25px; left: 0px; content: ''; width:1px; background: var(--midnight); top:0; position: absolute;}
.horiz_runner.brick-runner .horiz_inner.brick-inner::after{ height:25px; right: 0px; content: ''; width:1px; background: var(--midnight); top:0; position: absolute;}


.shelf-runner { z-index: 3; position: absolute;  height:0px; width:0px; background:var(--midnight);}  
.shelf-runner.vert-1 { left:var(--left); top:0px; width:1px; height:0px; transition:.75s height ease-in-out;}  
.shelf-runner.vert-1.opaque { height:90px; transition:.75s height ease-in-out;}  
.shelf-runner.vert-1.tee.bottom::after { position: absolute; bottom: 0; left: 0; width:0; height: 1px; content:'';  transition:.25s all 0s ease-in-out; background:var(--midnight); }
.shelf-runner.vert-1.tee.bottom.opaque::after { left:-10px; width:21px; transition:.25s all .75s ease-in-out;}

.shelf-runner.vert-2 { left:var(--left); top:140px; width:1px; height:0px; transition:.75s height .75s ease-in-out;}  
.shelf-runner.vert-2.opaque { height:var(--heightgap); transition:.75s height .75s ease-in-out;}  
.shelf-runner.vert-2.tee.top::after { position: absolute; top: 0; left: 0; width:0; height: 1px; content:'';  transition:.25s all 1.5s ease-in-out; background:var(--midnight); }
.shelf-runner.vert-2.tee.top.opaque::after { left:-10px; width:21px; transition:.25s all .25s ease-in-out;}

.insight-shelf:nth-of-type(2n) .shelf-runner.vert-1,
.insight-shelf:nth-of-type(2n) .shelf-runner.vert-2,
.flex-panel-outer .shelf-runner.vert-1,
.flex-panel-outer .shelf-runner.vert-2,
.side-right .shelf-runner.vert-1,
.side-right .shelf-runner.vert-2 { left:unset; right:var(--left); }
.side-left .shelf-runner.vert-1,
.side-left .shelf-runner.vert-2 { left:var(--left); right:unset; }

.insight-shelf:nth-last-of-type(2) { padding-bottom:35px !important; }
.insight-shelf:last-child { padding-top: 24px;}

@media (min-width:1024px){
	.side-right .door { width:0; height:80px; border:1px solid var(--midnight); border-left:none; border-right: none; position: absolute; overflow: hidden; right: var(--left); bottom:127px; transition: .5s width ease-in-out; opacity: 1 !important;}
	.side-right .door.opaque { width:40px; transition: .5s width ease-in-out;}
	.side-right .door .door-top { top:-40px; right:-40px; width:80px; height:80px; position: absolute; border-radius: 100vh; border:1px solid var(--midnight);}
	.side-right .door .door-bottom { top:40px; right:-40px; width:80px; height:80px; position: absolute; border-radius: 100vh; border:1px solid var(--midnight);}
}



.dots-panel { width:var(--widthboth); right:var(--left); height:23px; position: absolute; opacity:0; transition:0s opacity 1s;   bottom: 0; overflow: hidden;}
.dots-panel.opaque { opacity:1; transition: 0s opacity;}
.dots-panel .dots-panel-inner::before{ height:25px; left: 0px; content: ''; width:1px; background: var(--midnight); top:0; position: absolute;}
.dots-panel .dots-panel-inner::after{ height:25px; right: 0px; content: ''; width:1px; background: var(--midnight); top:0; position: absolute;}
.dots-panel .dots-panel-inner { width:0px; height:23px; background: url("/wp-content/themes/peninsula/images/diagonal.png") right -1px repeat; background-size: auto 100%; transition: 1s width ease-in-out;border-top:1px solid var(--midnight); border-bottom:1px solid var(--midnight); position: absolute; right: 0; top:0;}
.dots-panel.opaque .dots-panel-inner {transition: 1s width ease-in-out; width:100%;}

footer#footer {	background-color: var(--white);	padding: 150px 0 75px;}
footer .flexPanel {	position: relative;	z-index: 2;	flex-wrap: wrap;max-width: 564px; justify-content: center; margin: 0 auto;}
footer .flexPanel .widget_media_image img { max-width:419px !important; margin:0 auto !important;   width: 100%;}

.footer-2 { width:100%; border-top:1px solid var(--midnight); border-bottom:1px solid var(--midnight); padding:38px; }
.menu-footer-container ul {display: flex;justify-content: center;}
.menu-footer-container ul li a {text-transform: uppercase; font-size: 14px; font-weight: 600; text-decoration: none;color: var(--midnight);	letter-spacing:5.5px;}
#menu-main-menu li > a{color: var(--midnight); font-weight: 600;}

#menu-main-menu a:hover {
	background: var(--red);
	color: var(--white);
}
#menu-social {
	display: flex;
	justify-content: center; gap:40px;
}
.social{ width:47px; height:47px;margin-left: 0;}
.social a{ width:47px; height:47px; margin-top:0 !important; }
.social a::before, .social a::after {width: 47px;	height: 47px; background-size: contain;}
#copyright { text-align:center; font-weight: 300;font-size: 14px;color: var(--midnight);letter-spacing: 4px;line-height: 28px; margin-bottom: 100px; text-transform: uppercase;}


.masthead:not(#main-panel-1) #mastheadline00 { left: unset; right:var(--left); top:-90px; height:0px; background:var(--midnight); }
.masthead:not(#main-panel-1) #mastheadline00.opaque { height:90px;}

.line.horiz.bottom.widthboth::after { content:''; width:0px; right:0px; bottom:0px; height:0px; border-radius: 100vh 0 0 0; border:1px solid var(--white); position:absolute; transition:.5s height 0s ease-in-out, 0s opacity .5s; opacity: 0;}
.line.horiz.bottom.widthboth::before { content:''; width:0px; left:0px; bottom:0px; height:0px; border-radius: 100vh 0 0 0; border:1px solid var(--white); position:absolute; transition:.5s height 0s ease-in-out, 0s opacity .5s; opacity: 0;}

.line.horiz.bottom.widthboth.opaque::after { height:40px; width:40px; transition:.5s all 1.5s ease-in-out, 0s opacity 1.5s; opacity: 1;}
.line.horiz.bottom.widthboth.opaque::before { height:40px; width:40px; transition:.5s all 1.5s ease-in-out, 0s opacity 1.5s; opacity: 1;}

.venue-runner { position: relative;}

.venue-runner::before { position: absolute; bottom:-20px; width:0px; height:1px; background:var(--white); content: ''; right:166px; transition:.75s width ease-in-out; }
.venue-runner.opaque::before { width:calc(100% - 166px); transition:1.5s width 1s ease-in-out; }

.venue-runner::after { position: absolute;  bottom: -91px;  width: 174px;  height: 260px; content: ''; right:0; background:url(/wp-content/uploads/2024/01/gar-hall-white.svg) no-repeat; background-size: contain; opacity: 0; transition:.25s width .75s ease-in-out; }
.venue-runner.opaque::after { transition:.5s opacity .5s ease-in-out; opacity: 1;}


.side-right .pageinner .flexPanel {
	width: calc(100% - 52px);
	margin: 0 auto 0 -20px;
}
@media (max-width: 1400px) {
  .side-right .pageinner .flexPanel{ margin: 0 auto 0 24px; }
}
@media (max-width: 991px) {
  .side-right .pageinner .flexPanel{ margin: 0 auto 0 -20px; width: calc(100% + 16px);}
}


.slider .slick-slide .pane::before,
.sliders .pane.slick-slide::before { background:var(--midnight); width:100%; height: 100%; left: 0; top: 0; content: ''; position: absolute; opacity: .43; z-index: 3;}

@media (max-width: 990px) {
	.flexPanel .event_color_panel.cell_4,
	.tribe-events-single-event-description.cell_8{    width: 100%;  }
	footer .pageinner {	width: calc(100% - 50px);	margin: 0 25px;}
}

@media (max-width:1200px) {
	.news-items .meta_top .month, .tribe-override .meta_top .month{font-size: 16px;}
}


@media (max-width:1300px) {
	.desktop-nav .navLogo img { margin-left:24px;}
}

@media (max-width:990px) and (min-width:640px) {
	.page-panel.side-left { padding-left: 30px;}
}