/* BASE */
.container {overflow:hidden}
html {scroll-behavior:smooth}

body {
    --wp--style--root--padding-top: 2rem ;
    --wp--style--root--padding-right: 5vw ;
    --wp--style--root--padding-bottom: 2rem ;
    --wp--style--root--padding-left: 5vw ;
}
.wrapper {
	padding-left: var(--wp--style--root--padding-right); 
	padding-right: var(--wp--style--root--padding-left);
	max-width: var(--wp--style--global--content-size);
	margin-left: auto !important;
	margin-right: auto !important;
}
.wp-block-cover {
	padding-left: var(--wp--style--root--padding-right); 
	padding-right: var(--wp--style--root--padding-left);
}


	@media only screen and (min-width:801px) {
	    .mobile-only {display:none !important}
	}
	@media only screen and (max-width:800px) {	
		body {
		    --wp--style--root--padding-top: 1rem;
		    --wp--style--root--padding-right: 1rem;
		    --wp--style--root--padding-bottom: 1rem;
		    --wp--style--root--padding-left: 1rem;
		}
		.desktop-only {display:none !important}
	}





/* Animations */
a {transition:all 200ms ease-in-out; color:#D93832;}
.fade {opacity:0;transition:opacity 1s}
.fadeLeft {opacity:0;transform:translate3d(-100px, 0, 0);transition:opacity 1s, transform 1s;transition-timing-function:cubic-bezier(.175, .885, .32, 1.275)}
.fadeRight {opacity:0;transform:translate3d(100px, 0, 0);transition:opacity 1s, transform 1s;transition-timing-function:cubic-bezier(.175, .885, .32, 1.275)}
.fadeUp {opacity:0;transform:translate3d(0, 100px, 0);transition:opacity 1s, transform 1s}
.animate {opacity:1;transform:translateX(0);transform:translateY(0)}





/* Fonts */
body {font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:400; font-stretch:normal; color:#1B1B1B; -webkit-font-smoothing:antialiased;  -moz-osx-font-smoothing:grayscale}
h1 {font-size:3.5em; line-height:110%}
h2 {font-size:2.5em; line-height:110%}
h3 {font-size:1.5em; line-height:150%}
h4 {font-size:1.5em; line-height:150%}
h5 {font-size:1em; line-height:150%}
h6 {font-size:0.85em; line-height:150%}
p {line-height:160%}

h3.has-x-large-font-size {font-size:100px !important}
h3.has-x-large-font-size sub {font-size:20px !important}

.entry-content ul li {margin:0.5em 0; line-height:150%;}
	
	@media only screen and (max-width:1240px) {
		h1 {font-size:3.25em}
		h2 {font-size:2.35em}
		h3 {font-size:1.35em}
		h4 {font-size:1.35em}
	}
	@media only screen and (max-width:1024px) {
		h1 {font-size:3em}
		h2 {font-size:2em}
		h3 {font-size:1.25em}
		h4 {font-size:1.25em}
	}
	@media only screen and (max-width:800px) {
		h1 {font-size:2.25em}
		h2 {font-size:1.75em}
		h3 {font-size:1.2em}
		h4 {font-size:1.2em}
		p.has-x-large-font-size {font-size:1.75em !important}
		
		h2 br,
		.cta br {display:none;} {display:none;}
		
		.wp-block-group.alignfull.has-global-padding {
			padding-left: var(--wp--style--root--padding-right); 
			padding-right: var(--wp--style--root--padding-left);
		}		 
		.wp-block-spacer[style*="height:2vh"],
		.wp-block-spacer[style*="height:3vh"],
		.wp-block-spacer[style*="height:4vh"],
		.wp-block-spacer[style*="height:5vh"],
		.wp-block-spacer[style*="height:10vh"] {
		    height:1.5em !important
		}
		.wp-block-spacer[style*="height:110px"] {
		    height:100px !important
		}
		
	}
	@media screen and (min-width:1025px) {
		.cta h2.has-x-large-font-size {font-size:5.5vh !important;}
		
	}




.has-black-background-color {background-color:#1B1B1B !important;}
.greylogos img {opacity:0.5; transition:all 250ms ease-in-out}
.greylogos img:hover {opacity:1;}



/* Big Bold Headings */
	
*[style*="font-size:140px"] {line-height:100%; letter-spacing:-0.08em}

	@media only screen and (min-width:1600px) {
		*[style*="font-size:140px"] {font-size:160px !important}
	}
	@media only screen and (max-width:1400px) {
		*[style*="font-size:140px"] {font-size:125px !important; letter-spacing:-0.07em}
	}
	@media only screen and (max-width:1200px) {
		*[style*="font-size:140px"] {font-size:100px !important; letter-spacing:-0.06em}
	}
	@media only screen and (max-width:1000px) {
		*[style*="font-size:140px"] {font-size:75px !important; letter-spacing:-0.05em}
	}
	




/* Links */
.wp-block-button__link {font-weight:bold}
.entry-content a {color:#D93832;}




.home-swiper .swiper-slide {width: 40% !important;}




/* .header Bar */
header{display:block; padding:0; width:100%; z-index:1000; position:absolute; top:0px; left:0px; background-color:rgba(30,30,30,0.7)}
header.light{background-color:transparent}

.header-grid {display:grid; grid-template-columns:400px auto; grid-column-gap:0; align-items:center; margin:0 5vw;}

/* NEW MENU */
.logo img {display:inline-block; vertical-align:bottom; width:auto;height:48px}
.logo-connect, 
.logo-solutions {vertical-align:bottom; }
.logo-connect.visible, 
.logo-solutions.visible {display:inline-block}
.logo-connect.visible img, 
.logo-solutions.visible img {width:auto;height:30px}

header.light .logo-connect.visible img, 
header.light .logo-solutions.visible img {filter: invert(85%);}

.mega-menu {padding:0 5vw !important; background:#2E2E2E; display:none}
ul#menu-connect-menu, ul#menu-solutions-menu, .logo-connect, .logo-solutions {display:none}

.arrow-expand {width:33px; height:33px; margin-left:6px; display:inline-block; vertical-align:bottom; text-align:right;  transition:all 250ms ease-in-out}	
.arrow-expand img {width:33px !important; height:33px !important; display:inline-block; transition:all 250ms ease-in-out}
.arrow-expand.open img {transform:rotate(180deg);}

ul#menu-connect-menu.visible, ul#menu-solutions-menu.visible, ul#menu.visible {display:inline-block}
ul#menu-connect-menu.hidden, ul#menu-solutions-menu.hidden, ul#menu.hidden {display:none}


/* Desktop Menu System */
@media screen and (min-width:1241px) {
	
	.mega-menu .wp-block-column {position:relative; padding:5vh 0;}
	.mega-menu .wp-block-column:after {position:absolute; bottom:0px; left:50%; width:0%; height:5px; background:#D93832; content:""; display:block; transition:all 200ms ease-in-out;}
	.mega-menu .wp-block-column:hover:after {width:100%; left:0%;}		
	
	.mega-menu ul, .mega-menu ul li {list-style-type:none; margin:0; padding:0;}
	.mega-menu ul {padding-top:1em;}
	.mega-menu ul li {padding:0.5em 0;}
	.mega-menu ul li a {text-decoration:none;}
	.mega-menu ul li a:after {content:""; display:inline-block; vertical-align:middle; width:15px; height:15px; line-height:100%; margin:-2px 0 0 15px; 
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23' height='24' fill='none' stroke='%23D93832' stroke-width='4' xmlns:v='https://vecta.io/nano'%3E%3Cpath d='M9.899 2l9.899 9.9-9.899 9.9m8.938-10.038H.412'/%3E%3C/svg%3E");
	background-size:15px;}

	.desktopMenu {text-align:right; height:110px}
	.desktopMenu ul {list-style-type:none;margin:0 auto;padding:0;position:static;z-index:1001; text-align:center; display:inline-block}
	.desktopMenu li {float:left;position:relative; margin:0;text-align:center; padding:0 1vw}
	.desktopMenu li a {display:block; height:110px; line-height:110px; padding:0; color:white; text-decoration:none; font-weight:400}
	
	header.light .desktopMenu li a {color:#1B1B1B}
		
	.desktopMenu li.btn {padding:0; margin:20px 0 0 10px}
	.desktopMenu li.btn a {height:70px; line-height:70px; color:white !important; font-weight:bold; padding:0 20px; background:#D93832;}
	.desktopMenu li.btn a:hover {transform:scale(1.1)}
	
	.desktopMenu li.current:hover a {background:none;color:#D93832}
	.desktopMenu .current_page_item a {font-weight:bold}

	.desktopMenu li:after/*, .desktopMenu .current_page_item:after*/ {content:""; height:3px; width:0px; background:#D93832; display:block; margin-top:-2px; margin-right:50%}
	.desktopMenu li:hover:after/*, .desktopMenu .current_page_item:after*/ {width:100%; margin-right:0%}
	
	.desktopMenu li.menu-item-has-children > a:after  {content:"\F282"; transition:all 200ms ease-in-out; font-family:"bootstrap-icons"; display:inline-block; vertical-align:middle; line-height:100%; margin:0 0 0 5px; color:#D93832;font-size:0.75em; font-weight:bold;}				
	.desktopMenu li.menu-item-has-children:hover > a:after  {opacity:0;}		
	
	/* Main Menu */
	.desktopMenu li {position:relative}
	.desktopMenu li:after/*,
	.desktopMenu li.current-menu-item:after*/ {transition:all 200ms ease-in-out; content:""; height:3px; width:0%; background:#D93832; display:block; position:absolute; bottom:-3px; left:50%; right:50%; }
	.desktopMenu li:hover:after/*, .desktopMenu li.current-menu-item:after*/ {width:100%; left:0%}
	
	/* 2nd Level */
	.desktopMenu li ul {position:absolute; top:110px; left:0px; width:250px; z-index:1010; background:#1b1b1b; overflow:hidden; display:none}
	.desktopMenu li:hover ul a {background:#1b1b1b; color:white}
	.desktopMenu li:hover ul a:hover,
	.desktopMenu li li:hover > a {color:#D93832}
	.desktopMenu li ul li {display:block;width:100%;font-size:90%; padding:0; float:none;text-align:left;width:auto;position:relative;margin:0; z-index:1010}
	.desktopMenu li ul li a {width:100%;height:auto!important;background:#D93832;color:#fff;display:block;padding:1em;line-height:125%!important;text-transform:none;font-weight:400; border-bottom:1px solid rgba(255,255,255,0.2); border-top:0}
	.desktopMenu ul li a:hover + .desktopMenu ul ul, .desktopMenu ul li:hover ul {display:block}
	.desktopMenu li ul li:last-of-type a{border:0}
	.desktopMenu ul ul li.menu-item-has-children>a:after {color:#222;display:inline-block;content:'\203A';font-size:12px;float:right}

	.desktopMenu li ul .current_page_item:after {display:none}
	
	.menu-panel, .sidebar-toggle, .mobileNav, .desktopMenu ul ul li:after {display:none}
}

@media screen and (min-width:1241px) and (max-width:1450px) {
	.header-grid {grid-template-columns:340px auto; margin:0 1.5vw;}
	
	.logo img {height:44px}
	.logo-connect.visible img, 
	.logo-solutions.visible img {width:auto;height:28px}
	.desktopMenu li {padding:0 0.7vw}
		
	.desktopMenu li.btn {margin-left:0.7vw}
	.desktopMenu li.btn a {padding:0 15px}

}


/* Mobile Menu System */
@media screen and (max-width:1240px) {
	.desktopMenu, .mega-menu, .arrow-expand {display:none !important}

	.header-grid {grid-template-columns:400px auto;margin:0 2vw;}
	.logo{padding:10px 0}
	
	
	/* Animated Burger Menu */ 
	.sidebar-toggle {position:absolute; z-index:100002; top:0px; right:0px; font-weight:400; font-size:100%; width:70px; height:70px; cursor:pointer; padding:0; margin:0; border:none; outline:0; background:transparent; min-width:50px}
	.sidebar-toggle span, .sidebar-toggle span:before, .sidebar-toggle span:after {cursor:pointer; border-radius:10px; height:3px; width:30px; left:20px; top:33px; background:#999; position:absolute; display:block; content:''}
	.sidebar-toggle span:before {top:-10px; left:0px}
	.sidebar-toggle span:after {top:10px;  left:0px}
	.sidebar-toggle span, .sidebar-toggle span:before, .sidebar-toggle span:after {transition:all 250ms ease-in-out}
	.open-menu .sidebar-toggle span {background-color:transparent}
	.open-menu .sidebar-toggle span:before, .sidebar-toggle.active span:after {top:0}
	.open-menu .sidebar-toggle span:before {transform:rotate(45deg); top:0px; left:0px}
	.open-menu .sidebar-toggle span:after {transform:rotate(-45deg); top:0px;  left:0px}	
		
	.swipe-area, .filter-swipe-area {position:absolute;width:100%;left:auto;right:0;top:0;height:100%;z-index:0}
	
	.menu-panel {background:#1b1b1b; position:fixed; z-index:100001;overflow-y:auto; top:0px; right:-100%; width:100%; height:100%; box-sizing:border-box; left:auto; transition:right 0.25s ease-in-out}
	.container.open-menu .menu-panel {left:auto;right:0px}

	/* Menu System */
	.menu-panel {padding:0; height:100%;}
	.menu {padding:70px 0;}
	.menu ul {margin:0; padding:0 2em;}
	.menu-panel * {box-sizing:border-box}
	.menu-panel {list-style:none;margin:0;padding:0;display:block;clear:both;}
	.menu-panel li {border-top:1px solid rgba(255,255,255,0.2); position:relative;overflow:hidden; transition:all .4s ease; font-size:125%}
	.menu-panel li a {padding:1em 0; display:flex;flex-direction:row;justify-content:space-between;align-items:center;text-decoration:none;color:white}
	
	.menu-panel li.open {border-color:rgba(255,255,255,0.2)}
	.menu-panel li::after {content:"";display:block;clear:both}
	.menu-panel li>a>svg {display:block;position:relative; width:14px;float:right;transition:all .3s ease}
	.menu-panel li.open > a > svg {transform:rotate(45deg)}
	.menu-panel li.open > ul {display:block; border:0}
	.menu li>ul {display:none;height:0;margin:0; padding:0 1em 1em; overflow:hidden;transition:height 350ms ease-in-out}
	.menu-panel ul.is-visible {display:block}
	.menu-panel ul ul li {border:0; font-size:90%}
	
	.menu-panel ul ul a, .menu-panel ul li.open ul a {padding:0.5em 0; color:white; font-weight:normal}
	.menu-panel a:hover, .menu-panel li.open a, .menu-panel li.open ul a:hover {color:white;}
	
	.menu-panel li.btn {border:0; margin:1em 0; padding:0; background:#D93832;}
	.menu-panel li.btn a {display:block; padding:1em; color:white; text-align:center; font-weight:bold;}	
}

@media screen and (max-width:600px) {
	.header-grid {display:block; margin:0 1.5em;}
	
	.logo img {height:44px}
	.logo-connect.visible img, 
	.logo-solutions.visible img {width:auto;height:28px}
	
	.sidebar-toggle span, .sidebar-toggle span:before, .sidebar-toggle span:after {top:28px}
	.sidebar-toggle span:before {top:-10px; left:0px}
	.sidebar-toggle span:after {top:10px;  left:0px}
	
}
@media screen and (max-width:400px) {
	.header-grid {display:block; margin:0 1em;}
	
	.logo img {height:32px}
	.logo-connect.visible img, 
	.logo-solutions.visible img {width:auto;height:19px}

}







/* 404 Page */
.fourOfour {text-align:center; padding:15vh 0}



.footer .wp-block-separator {border-top: 1px solid!important}






/* Form Elements */
.wpcf7 {padding:2vh 5vh; margin:0; background-color:#D9D6D3;}
.wpcf7-form-control-wrap, .wpcf7 .wpcf7-list-item {padding:0; margin:0; display:block; position:relative}

.wpcf7 input, .wpcf7 textarea, .wpcf7 select { font-family:inherit; display:block; width:100%; min-width:100%; padding: calc(0.667em + 2px) 0; margin:0; text-indent:1em; border:1px solid #1B1B1B; background:white; color:#1B1B1B; font-size:100%; border-radius:0px}
.wpcf7 input:focus, .wpcf7 textarea:focus, .wpcf7 select:focus {background:white}

.wpcf7 input.wpcf7-date, 
.wpcf7 select {height:45px; line-height:45px; padding:0; text-indent:0.75em}

.wpcf7 input[type="checkbox"] {display:inline-block; width:auto; min-width:14px; padding: 0px; text-indent:0; }

input.wpcf7-not-valid {border-color:red}

::-webkit-input-placeholder {color:#777}
:-moz-placeholder {color:#777}
::-moz-placeholder {color:#777}
:-ms-input-placeholder {color:#777}
.wpcf7 p br {display:none}
.wpcf7 input[type=submit] {margin:0 !important; padding: calc(0.667em + 2px) 0; width:auto; min-width:150px; border:0; display:block; background:#D93832; color:white; font-weight:bold; text-indent:0}

	.wpcf7 p .wpcf7-form-control-wrap:after,
	.wpcf7 div .wpcf7-form-control-wrap:after {content:""; position:absolute; font-family:"bootstrap-icons"; right:0.6em; top:0.6em; font-size:1.25em; color:inherit}
	.wpcf7 p.name .wpcf7-form-control-wrap:after {content:"\F4D3"}
	.wpcf7 p.mail .wpcf7-form-control-wrap:after,
	.wpcf7 div.mail .wpcf7-form-control-wrap:after {content:"\F32F"}
	.wpcf7 p.subject .wpcf7-form-control-wrap:after {content:"\F431"}
	.wpcf7 p.message .wpcf7-form-control-wrap:after {content:"\F252"}
	.wpcf7 p.company .wpcf7-form-control-wrap:after {content:"\F1DD"}
	.wpcf7 p.phone .wpcf7-form-control-wrap:after {content:"\F5C1"}
	.wpcf7 p.connections .wpcf7-form-control-wrap:after {content:"\F2EE"}
	.wpcf7 p.data .wpcf7-form-control-wrap:after {content:"\F54C"}
	.wpcf7 p.device .wpcf7-form-control-wrap:after {content:"\F77C"}
	.wpcf7 p.website .wpcf7-form-control-wrap:after {content:"\F3EE"}
	.wpcf7 p.postcode .wpcf7-form-control-wrap:after {content:"\F3E8"}
	
	/* Contact Form 7 output */
	div.wpcf7-response-output {font-weight:bold; font-size:100%; line-height:125%; border:0 !important; padding:0 !important; margin:0 !important; color:red}
	div.wpcf7-mail-sent-ok {font-size:100%; line-height:125%; color:#1B1B1B; font-weight:bold}
	.wpcf7-not-valid-tip {display:block; padding:0; color:red !important; font-size:90%}

		@media only screen and (max-width:800px) {
			.wpcf7 {padding:1.5em}
		}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	


/* Check List */
ul.checks {list-style-type:none; margin:1.5em 0; padding:0}
ul.checks li {list-style-type:none; position:relative; padding:0 0 0 35px; margin:0.75em 0; line-height:150%}
ul.checks li:before {content:"\F26B"; position:absolute; font-family:"bootstrap-icons"; font-size:1.25em; top:0px; left:0px}






/*Accordion*/
.accordion {width:100%;min-height:150px;margin:1em 0;clear:both}
.accordion .data {padding:1.5em 0;display:none}
.accordion .wp-block-fseblocks-accordion-item {box-shadow:none !important; margin:0}
.accordion-item {cursor:pointer;position:relative; background:white;color:#1B1B1B;line-height:125%;display:block;text-decoration:none;padding:0.75em 2em 0.75em 0; margin:1px 0 0;font-weight:500;font-size:125%; border-top:1px solid #eee}
.accordion-item:after {content:"+";font-weight:400;font-size:100%; position:absolute; right:0px; top:0.75em}
.accordion-item.open {font-weight:700}
.accordion-item.open:after {content:"-"}
.wp-block-fseblocks-accordion-item .accordion-item, .accordion .data {}
.wp-block-group.has-background .wp-block-fseblocks-accordion-item .accordion-item, .accordion .data {}
.accordion .data {padding-top:4px}

	@media only screen and (max-width:800px) {
		.accordion-item {font-size:100%}
		
	}





/*Tabs*/
.wp-block-fseblocks-tabs .tabs {margin:20px;padding:0;list-style:none;position:relative}
.wp-block-fseblocks-tabs .tabs li {display:inline-block;cursor:pointer;color:#1B1B1B;padding:5px 10px}
.wp-block-fseblocks-tabs .tabs li.active-tab {border-bottom:none;position:relative}
.wp-block-fseblocks-tabs .tabs li img {width:120px;height:auto;margin-right:10px;vertical-align:middle}
.wp-block-fseblocks-tabs .tabs-content {margin:20px;padding:0;list-style:none}
.wp-block-fseblocks-tabs .tabs-content:first-child > li {display:none}
.wp-block-fseblocks-tabs.vertical {display:grid;grid-template-columns:33% 66%}
.wp-block-fseblocks-tabs.vertical ul.tabs {display:flex;flex-direction:column}
.wp-block-fseblocks-tabs.vertical .tabs li img {width:180px}





.wp-block-fseblocks-content-slider {position:relative;}

/* Swiper Pagination */
.swiper-pagination{bottom:3vh !important}
.swiper-pagination-bullet{background:white !important;opacity:0.25 !important; margin:0 0.25em !important}
.swiper-pagination-bullet.swiper-pagination-bullet-active{opacity:1 !important;background:white !important}

/* Swiper Arrows (bootstrap) */
	.wp-block-viewport-content-slider {position:relative !important}
	.wp-block-viewport-content-slider .viewport-swiper-nav{height:1px !important;margin:0px !important}
	.swiper-button-next,.swiper-button-prev{top:-40px !important; left:auto !important; right:0px !important; width:50px !important;height:50px !important;margin-top:0px;z-index:10}
	.swiper-button-prev{left:auto; right:60px !important}
	.swiper-button-next{right:0px !important}
	.swiper-button-next:after,.swiper-button-prev:after{width:50px;height:50px;background-size:50px;font-family:"bootstrap-icons" !important; content:"\F135" !important; color:#D93832}
	.swiper-button-prev:after{ content:"\F12C" !important}





figure.red-grad,
figure.red-grad img,
.wp-block-cover.red-grad {position:relative; z-index:1;}
figure.red-grad:after,
.wp-block-cover.red-grad:after {content:""; position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:2; background: rgb(217,56,50);
background: radial-gradient(circle, rgba(217,56,50,0) 50%, rgba(217,56,50,0.5) 100%)}
.wp-block-cover.red-grad .wp-block-cover__inner-container,
.wp-block-cover.red-grad .wp-block-cover__background { z-index:3}




/* Blog */


.blog-listings {display:grid;grid-template-columns:repeat(3,1fr);grid-column-gap:5vw;grid-row-gap:5vh; margin:5vh 0}
.blog-listings .post {position:relative; padding:0; }

.blog-listings .thumb-image {position:relative; z-index:1; overflow:hidden; display:flex; max-height:25vh;}
.blog-listings .thumb-image img {flex-grow:1; object-fit:cover; object-position:0% 25%;  width:100%; height:100%; position:relative; z-index:1; position:absolute;top:0;left:0;bottom:0;right:0}
.blog-listings .thumb-image:before{content:"";display:block;padding-top:60%;/* initial ratio of 1:1*/}

.blog-listings .post-copy {padding:1em 0 2em !important; position:relative}
.blog-listings .post-copy time {font-size:0.8em; opacity:0.6; display:block;}
.blog-listings .post-copy a {text-decoration:none}
.blog-listings .post-copy h3 {padding:0; margin:0.5em 0;}
.blog-listings .post-copy h3 a {color:#1b1b1b}

.blog-listings .post-copy .more {position:absolute; bottom:0em; left:0em;}

.pagination {text-align:center; margin:7.5vh 0}
	.pagination a, .pagination span {border-radius:0px; font-weight:bold; color:white; padding:1em 1.5em !important; margin:0; display:inline-block; text-decoration:none; background:#1b1b1b}
		.pagination a.prev, .pagination a.next { margin:0; background:#1b1b1b; color:white}
		.pagination a.prev {float:left}
		.pagination a.next {float:right}
		.pagination a.prev:before, 
		.pagination a.next:after {display:inline-block; vertical-align:middle; font-size:75%}
		.pagination a.prev:before {content:"\276E"; margin-right:0.4em}
		.pagination a.next:after {content:"\276F"; margin-left:0.4em}	
		.pagination span.current {text-decoration:none; background:white; color:black}
		.pagination a.disabled, .pagination a.disabled:hover {opacity:0.2}

/* Single Post Page */
.single-post .header,
.privacy-policy .header,
.page-id-401 .header,
.page-id-403 .header {background:#041946}


	@media only screen and (max-width:800px) {
		.blog-listings .post-list .post, .blog-listings {display:block}
		.blog-listings .post-content .column {padding:1em 0}
		.blog-listings .post {margin:1em 0; display:block}

		.titlearea {text-align:center; padding:5vh 0}
	}


/* Single Post Page */
.titlearea {text-align:center; padding:7.5vh 0}
.titlearea h1, .titlearea h4 {max-width:800px; margin:0 auto}
.titlearea h1 {padding:0.5em 0 0}
.single-post .post-featured-image,
.single-post .post-content {max-width:1000px; margin:0 auto}
.single-post .post-featured-image {text-align:center; margin:0 auto 5vh; position:relative;}

	
.thumb-image:after,	
.single-post .post-featured-image:after {content:""; position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:2; background: rgb(217,56,50);
	background: radial-gradient(circle, rgba(217,56,50,0) 50%, rgba(217,56,50,0.5) 100%)}
.single-post .post-content {padding-bottom:10vh}
.single-post meta {font-size:85%;}
	
	
	/* FAQ Section */
	.wp-block-yoast-faq-block {margin-bottom:2em}
	.wp-block-yoast-faq-block .schema-faq-section{background:white;  border:1px solid #eee; border-radius:3px; margin:0 0 0.5em; padding:0}

		/* layout */ 
		.wp-block-yoast-faq-block .schema-faq-question{display:block;padding:1.25em;position:relative; color:#333; line-height:125%; cursor:pointer}
		.wp-block-yoast-faq-block.fcp-faq .schema-faq-question{cursor:pointer}
		.wp-block-yoast-faq-block .schema-faq-answer{margin:0;padding:20px}
	
		/* bullet before a question */ 
		.wp-block-yoast-faq-block .schema-faq-question,.wp-block-yoast-faq-block .schema-faq-answer{padding-left:50px}
		.wp-block-yoast-faq-block .schema-faq-question:before{transition:all 0.1s 0.1s ease; content:'\002B';  display:block; width:20px;height:20px;position:absolute; color:#D93832; left:15px; top:20px; font-size:22px; text-align:center; font-weight:400}
		.wp-block-yoast-faq-block.fcp-faq .fcp-opened .schema-faq-question:before{transform:rotate(-45deg)}
	
		.schema-faq-answer{display:none; padding-left:1em}
		.schema-faq-question.collapse:before{transition:all 0.1s 0.1s ease;content: "-"}
	
		/* transition */ 
		.wp-block-yoast-faq-block.fcp-faq .schema-faq-answer{max-height:0;overflow:hidden;border-bottom-width:0;padding-top:0;padding-bottom:0;transition:padding-bottom 0.25s ease-in,max-height 0.25s ease-in,padding-top 0.25s 0.25s ease-out,border-bottom-width 0s 0.25s linear}
		.wp-block-yoast-faq-block .fcp-opened .schema-faq-answer{max-height:9999px;border-bottom-width:1px;padding-top:12px;padding-bottom:20px;transition:padding-top 0.25s ease-in,max-height 0.25s 0.25s linear,padding-bottom 0.25s 0.25s ease}









/*THEME*/

/* Images */
img {width:100%}

/* Contain Content */
/*.wrapper, .wp-block-group__inner-container, .tabs.wp-block-acf-repeatertab {padding:0 5vw; width:100%; margin:0 auto; max-width:1400px; position:relative}
*/

@media screen and (min-width:782px) {
	.mobileOnly {display:none !important}
}
@media screen and (max-width:781px) {
	.wrapper {padding:0 20px}
	.desktopOnly {display:none !important}
	.hideImgMobile {display:none !important}
	div[style*="min-height:50vh"] {height: 25vh !important;max-height: 25vh !important;min-height: 25vh !important;}
}


.logocarousel {padding:0; width:100%; margin:0 auto; max-width:1400px; position:relative; overflow:hidden}










/* Grids / Columns */
.two-columns, .three-columns, .four-columns, .five-columns {margin:1em 0; position:relative}
.two-columns {display:grid;grid-template-columns:repeat(2,1fr);grid-column-gap:2em; grid-row-gap:2em}
.three-columns{display:grid;grid-template-columns:repeat(3,1fr);grid-column-gap:2em}
.four-columns{display:grid;grid-template-columns:repeat(4,1fr);grid-column-gap:2em}
.five-columns {display:grid;grid-template-columns:repeat(5,1fr);grid-column-gap:2em}

	@media screen and (min-width:768px) {
		.two-columns.twothirds-third .column:last-of-type {text-align:right}
	}
	@media screen and (max-width:1024px) {
		.two-columns.twothirds-third .column:last-of-type p {padding:0}
		.two-columns.twothirds-third .column:last-of-type p .btn {margin:0}
	}
	@media screen and (max-width:767px) {
		.row {display:block; padding:6vh 0}
		.two-columns {display:grid;grid-template-columns:repeat(1,1fr)}
		.three-columns{grid-template-columns:repeat(1,1fr);grid-column-gap:0}
		.four-columns{grid-template-columns:repeat(2,1fr);grid-column-gap:15px}
		.five-columns {grid-template-columns:repeat(2,1fr);grid-column-gap:15px}
	}



/* Title bar */
.titlebar {margin:0; padding:0;}
.titlebar h1 {padding:0}	
	
	@media screen and (max-width:1024px) {
		
	}
	
	
	
	
	

	
	
	
















/* Table */
.wp-block-table {margin:1em 0; overflow-x:none;  border:1px solid #d9d4d4}
.wp-block-table th {background:#F23C2B; color:white; font-weight:bold; line-height:125%; padding:0.75em; border:0; font-size:1.25em; vertical-align:top}
.wp-block-table td {padding:1em; border:0; line-height:150%; vertical-align:top}
.wp-block-table td img {max-width:24px !important; width:24px !important; height:24px !important}
.wp-block-table tr:nth-of-type(even) td {background:#d9d4d4}
.wp-block-table.glance tr td:nth-of-type(2) {min-width:150px; font-weight:600}
.wp-block-table thead {border-bottom: 0;}

	@media only screen and (max-width:800px) {
		.wp-block-table th {font-size:1em}
		
	}

/* Projects Listings Page 
- - - - - - - - - - - - - - - -  */

/* Projects */
.project-image img, .project-thumb img {height:auto}
.single-project-content {max-width:1000px; margin:0 auto 10vh}

.project-listings .project {position:relative; padding:0; background:white; border-radius:3px; box-shadow:0px 0px 25px rgba(0,0,0,0.1); height:100%}
.thumb-image {position:relative; z-index:1; height:22vh; overflow:hidden; display:flex}
.thumb-image img {flex-grow:1; object-fit:cover; border-radius:3px 3px 0 0; position:relative; z-index:1}
.project-listings .project, .project-listings .project:hover {text-decoration:none; cursor:pointer}
.project-listings .project .copy {padding:1em 1.5em 1.5em; position:relative}
.project-listings .project h3 {font-size:125%; padding:0 0 0.5em}
.project-listings .project h3 a {color:#333; font-weight:bold}
.project-listings .project a {font-weight:normal; font-size:90%}

	@media only screen and (min-width:769px) {
		.project-listings {display:grid;grid-template-columns:repeat(3,1fr); grid-column-gap:3vw; grid-row-gap:3vw; margin: 0}
	}
	@media only screen and (max-width:768px) {
		.project-listings {display:block}
		.project-listings .project {margin:2em 0; display:block}
	}

.yoast-breadcrumbs {display: none }




















/* Start Old styles */




/* j */

.rightside {overflow:hidden}
.project-cats li.active a {color: #1B1B1B}


	@media screen and (min-width:1025px) {
		.sidebar-grid {display:grid; grid-template-columns:250px auto; grid-column-gap:2vw; align-items:start}
	}





/* Gutenberg Brendan */
.greybg {padding:10vh 0}
.greybg {background:#58595b; color:white; position:relative; z-index:1}

.logos {padding:5vh 0 3vh}
.logos .wp-block-columns {margin-top:1em}
.logos .wp-block-columns .wp-block-column {display:grid;grid-template-columns:repeat(6,1fr); grid-column-gap:3vw; align-items:center}
.logos .wp-block-image img {width:auto !important; height:auto !important; max-width:100%; max-height:150px}
.logos .wp-block-image, .logos .wp-block-image figure {text-align:center}

.home blockquote cite {position:relative; padding:30px 0 0 100px; margin-top:1em}
.home blockquote cite:before {position:absolute; top:0px; left:0px; content:""; border:4px solid #f5f5f5; background:url(https://solareff.co.za/wp-content/uploads/2021/11/jaco-min.jpg) center center no-repeat; background-size:80px; width:80px; height:80px; display:inline-block; border-radius:50%} 

.feature-icons {margin:1em 0}
	.feature-icons  .wp-block-column {border-right:1px solid #777}
	.feature-icons  .wp-block-column:last-of-type {border-right:0}
	.feature-icons img {width:auto !important; height:auto !important; max-height:80px !important; max-width:200px; filter: brightness(0) invert(1)}
	.feature-icons figcaption {font-weight:bold; font-size:100%; line-height:150%; padding:0.5em 1em 0 0}
	
.link-blocks {position:relative; z-index:2; margin-top:-5vh}	
	.link-blocks .wp-block-image {padding:3vh 3vw; text-align:center; background:white; border-radius:3px; box-shadow:0px 0px 25px rgba(0,0,0,0.1)}
	.link-blocks img {width:auto !important; height:80px !important}
	.link-blocks figcaption {font-weight:bold; font-size:150%; line-height:150%; padding-top:0.5em}
	.link-blocks a {color:#333}

/* Guten Slider */
.home .slide-content { align-items:normal !important; color:white !important; padding:0 5vw !important; width:100%; margin:0 auto; max-width:1200px; position:relative}
.home .slide-content h1, .home .slide-content h2, .home .slide-content h6 {text-align:left !important}
.home .slide-content h1, .home .slide-content h2 {width:70% !important; max-width:70% !important}
.home .bg-image:after {position:absolute; content:""; top:0px; left:0px; width:100%; height:100%; background: rgb(249,249,249); background: linear-gradient(90deg, rgba(90,90,90,0.5) 0%, rgba(90,90,90,0) 75%)}

.banner-overlay {position:relative; z-index:5; margin:-5vh 0 5vh 0 ; padding:5vh 5vw; text-align:left; background:white; border-radius:3px; box-shadow:0px 0px 25px rgba(0,0,0,0.1)}

.yoast-breadcrumbs {background:#fafafa; padding:1.5em; font-size:80%; line-height:120%; color:#999; margin:0 0 5vh; border-radius:3px}

.wp-block-media-text {position:relative; z-index:1; margin:0}
.wp-block-media-text:before {position:absolute; z-index:-1; content:""; width:75%;  border-radius:3px; height:100%; top:0px; right:0px; background: rgb(249,249,249); background: linear-gradient(180deg, rgba(249,249,249,1) 0%, rgba(255,255,255,1) 75%)}
.wp-block-media-text.has-media-on-the-right:before {right:auto; left:0px}
.wp-block-media-text__media {text-align:left}
.wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {text-align:right}
.wp-block-media-text__media, .fade-in-element img {max-width:95%; height:auto; box-shadow:0px 0px 25px rgba(0,0,0,0.2); margin:4vh 0; border-radius:3px}
	
.wp-block-image.icon {}	
.icon img	{width:75px !important; height:75px !important; opacity:0.75}
	
	

@media screen and (max-width:1150px) {
	div[style*="flex-basis:47%"] {flex-basis:45.5% !important}
}
@media screen and (max-width:1024px) {
	.logos .wp-block-columns .wp-block-column {grid-template-columns:repeat(3,1fr)}
}
@media screen and (max-width:800px) {
	.force-2cols{display:grid !important;grid-template-columns:repeat(2,1fr);grid-column-gap:1em;grid-row-gap:2em; align-items:start;}
	.force-2cols p br {display:none;}
}













@keyframes fade-in {
    from {opacity: 0;transform: translate3d(0,40px,0)}
    to {opacity: 1; transform: translate3d(0,0,0)}
}
.fade-in-element {
  animation: fade-in 1.5s;
}
img{height:auto}













/* Logo Carousel */
.logocarousel .swiper-slide {height:120px}
.logocarousel .logo {text-align:center; height:100%}
	.logocarousel .logo img {max-width:150px; max-height:120px; position:relative; top:50%;transform:translateY(-50%); width:auto !important; max-width:100% !important; display:inline-block !important}







.futuretalent {border:1px solid #eee; border-radius:3px; padding:1.5em; margin:1.5em 0}
.futuretalent .wp-block-group__inner-container {padding:0em}
.futuretalent img {width:75px; height:75px}
.futuretalent h3 {padding:10px 0}

/*ie notice*/
.ie-notice {position:-webkit-sticky;position:sticky;top:0;padding:25px;z-index:99999;background:#c01018; width:100%}
.ie-notice p {font-weight:600; text-align:center; color: white}
.ie-notice a {color: white; text-decoration: underline}

/* Covid-19 Notice */
.corona-notice {display:block; text-align:center; padding:1em; border-top:1px solid #ddd; border-top: 4px solid #006532}
	.corona-notice .image, .corona-notice .numbers {padding:0.5em}
	.corona-notice .numbers {line-height:160%}
	.corona-notice .image img {max-width:90%}
	.corona-notice a {text-decoration:underline}
	
	@media all and (min-width:768px)  {
		.corona-notice .image, .corona-notice .numbers {display:inline-block; vertical-align:middle}
		.corona-notice .image, .corona-notice .numbers {padding:1em}
		.corona-notice .numbers {text-align:left}
		.corona-notice .numbers a {font-weight:bold}
	}

/* End Old styles */