/*
Theme Name:   Twenty Twenty Child
Description:  Twenty Twenty Child Theme
Author:       Mooch
Template:     twentytwenty
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain:  twentytwentychild
*/

/* Generic */
body {
	font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
	font-weight: 400;
    font-style: normal;
    letter-spacing: 0em;
    text-transform: none;
    font-size: 1.85rem;
}

h1, h2, h3 {
	font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
	margin: 0;
	margin-bottom: 32px;
	font-weight: 700;
    font-style: normal;
    letter-spacing: 0em;
}

h1 {
	font-size: 6.4rem;
	max-width: unset !important;
}

h2 {
	font-size: 4.4rem;
}

h3 {
	font-size: 2.85rem;
}

h4 {
	font-size: 1.95rem;
}

p {
	margin: 0;
	line-height: 1.2em;
	padding-bottom: 20px;
}

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

section {
	padding: 0;
}

@media only screen and (max-width: 600px) {
	h1 {
		font-size: 4.4rem;
	}
}

/* Header */
#site-header {
	position: fixed;
	width: 100%;
	background-color: transparent !important;
}

#site-header .header-titles .site-logo img {
	height: 140px !important;
}

#site-header .header-inner {
	padding-top: 45px;
}

/* === Front Page === */
/* Front Page Title */
.front-page-header {
	background-image: url('/wp-content/uploads/2023/02/placeholder-background.png');
	background-size: cover;
	width: 100%;
	position: relative;
}

.front-page-header .content-container {
	width: 58%;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

@media only screen and (max-width: 700px) {
	.front-page-header .content-container {
		width: 90% !important;
	}
}

.front-page-header .content-container p, .front-page-header .content-container h1, .front-page-header .content-container h3{
	color: white;
	text-align: center;
}

.front-page-header .content-container h1, .front-page-header .content-container h3{
    text-transform: uppercase;
}

.front-page-header .content-container h3{
	color: #00aeef;
}

/* Extra */
.front-page-header-bot {
    background-color: #00aeef;
    position: relative;
    height: 500px;
}

.front-page-header-bot .content-container {
	width: 58%;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

@media only screen and (max-width: 700px) {
	.front-page-header-bot .content-container {
		width: 90% !important;
	}
}

.front-page-header-bot .content-container p, .front-page-header .content-container h1, .front-page-header .content-container h3{
	color: white;
	text-align: center;
}

.front-page-header-bot .content-container h1, .front-page-header .content-container h3{
    text-transform: uppercase;
    color: white;
    text-align: center;
}

.front-page-header-bot .content-container h3{
	color: white;
    text-align: center;
}



.front-page-header video {
    object-fit: cover;
    height: 100%;
}

.front-page-header {
	height: 60vh;
}

@media only screen and (min-width: 1000px) {
	.front-page-header {
		height: 100vh;
	}
}

/* Front Page Menu */
#front-page-menu .menu-container {
	height: 900px;
	display: flex;
}

#front-page-menu .menu-container .column {
	height: 100%;
	width: 50%;
	max-width: 90%;
	position: relative;
	background-size: cover;
	/* background-position: -248px 0px; DISABLED */
	background-image: url(/wp-content/uploads/2023/02/placeholder-background.png);
}

#front-page-menu .menu-container .mobile-text {
	color: black;
	background-color: white;
	width: 80%;
	font-family: oswald;
	font-weight: 700;
	font-size: 2.5rem;
	text-align: center;
	padding: 17px 0px;
	bottom: 0px;
	position: absolute;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	font-size: 2.8rem !important;
	transition: bottom 0.4s !important;
	transition-delay: 0 !important;
}

#front-page-menu .menu-container .mobile-text-span {
	display: none;
}

#front-page-menu .menu-container .column-text {
	color: white;
	position: absolute;
	bottom: 100px;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	transition: bottom 0.4s !important;
	transition-delay: 0 !important;
}

#front-page-menu .menu-container .column:hover > .column-text  {
	bottom: 200px;
}

#front-page-menu .menu-container .ind-button {
	background-color: #00b0f0 !important;
	position: absolute;
	bottom: 130px;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	transition: opacity 0.4s !important;
	transition-delay: 0 !important;
	color: white;
	opacity: 0;
	font-size: 1.8rem;
	font-weight: 700;
	font-family: Oswald !important;
	padding: .5rem 6rem;
	min-width: 180px;
	text-align: center;
	text-decoration: none;
}

#front-page-menu .menu-container .column:hover .ind-button  {
	opacity: 1;
}

@media only screen and (max-width: 860px) {
	#front-page-menu .menu-container {
		position: static;
		display: block;
		margin-top: 15px;
		margin-bottom: 15px;
		height: auto;
		color: white;
	}

	#front-page-menu .menu-container .column {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
		margin-top: 25px;
		margin-bottom: 25px;
		max-height: 525px;
		height: 525px;
		background-position: 0px 0px;
	}

	#front-page-menu .menu-container .column-text {
		display: none;
	}

	#front-page-menu .menu-container .ind-button-wrapper {
		display: none;
	}

	#front-page-menu .menu-container .mobile-text-span {
		display: block;
	}
}

/* Front Page Bottom */
.front-page-bottom {
	height: 800px;
	display: flex;
	background-size: cover;
}

.front-page-bottom .left-column {
	width: 45%;
	height: 100%;
	position: relative;
	background-image: url(/wp-content/uploads/2023/02/placeholder-background.png);
}

.front-page-bottom .right-column {
	width: 55%;
	height: 100%;
	position: relative;
}

.front-page-bottom h2 {
	color: white;
	width: 60%;
	text-align: center;
	position: absolute;
	bottom: 100px;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);
}

.front-page-bottom .center-div {
	width: 40%;
	text-align: center;
	position: absolute;
	bottom: 50%;
	left: 50%;
	-ms-transform: translate(-50%, 40%);
	transform: translate(-50%, 40%);
}

.front-page-bottom .center-div a {
	color: white;
	font-size: 1.8rem;
	font-weight: 700;
	font-family: Oswald !important;
	padding: .8rem 6rem;
	min-width: 180px;
	text-align: center;
	text-decoration: none;
	background-color: #00aeef;
}


@media only screen and (max-width: 1000px) {
	.front-page-bottom {
		display: grid;
	}
	
	.front-page-bottom .left-column, .front-page-bottom .right-column {
		width: 100%;
	}
	
	.front-page-bottom h2 {
		font-size: 3.4rem;
	}
	
	.front-page-bottom .center-div {
		width: 90%;
	}

}

/* === Global === */
/* Global Header */
.global-title-heading {
	width: 100%;
	height: 500px;
	/* background-image: url(/wp-content/uploads/2023/02/placeholder-background.png); */
	background-size: cover;
	position: relative;
}

.global-title-heading h1 {
	position: absolute;
	bottom: 113px;
	left: 50%;
	-ms-transform: translate(-50%, 0%);
	transform: translate(-50%, 0%);
	font-size: 5.4rem;
	text-transform: uppercase;
	color: white;
}

@media only screen and (max-width: 600px) {
	.global-title-heading h1 {
		width: 100%;
		text-align: center;
	}
}

/* Footer */
#site-footer .section-inner {
    width: 85vw !important;
    margin-left: auto;
    margin-right: auto;
    max-width: unset;
}

#site-footer .flex-component {

    width: 40%;
}

#site-footer .flex-component.menu {

    width: 55%;
}

#site-footer .flex-component a {
    color: white;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 2.8rem;
}

#site-footer .flex-component.menu {
    display: flex;
    justify-content: space-evenly;
}

#site-footer .flex-component.menu a {
    color: white;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-weight: 600;
    font-size: 2rem;
}

#site-footer .flex-component:last-child {
}

@media only screen and (max-width: 1400px) {
    #site-footer .section-inner {
        display: block;
        text-align: center;
    }
    
    #site-footer .flex-component {
        width: 100%;
		margin-left: auto;
		margin-left: auto;
		justify-content: space-evenly;
    }
	
	#site-footer .flex-component.menu {
        width: 100%;
    }
    #site-footer .flex-component.menu a {
        font-size: 2.3vw;
        margin-top: 10px;
    }
}

/* Global Contact Block */
.global-contact-block {
	width: 90%;
	max-width: 1920px;
	/* height: 400px; */
	margin-left: auto;
	margin-right: auto;
	background-image: url(/wp-content/uploads/2023/03/erodex-banner-2.jpg);
	background-position: center;
	background-size: cover;
	position: relative;
}

.global-contact-block .inner-div{
	padding-top: 100px;
	padding-bottom: 100px;
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	color: white;
	text-align: center;
}

.global-contact-block .inner-div h2 {
	font-size: 3.8rem;
	text-transform: uppercase;
}

.global-contact-block .inner-div p {
	margin-bottom: 80px;
}

.global-contact-block .inner-div a {
	color: white;
	font-size: 1.8rem;
	font-weight: 700;
	font-family: Oswald !important;
	padding: .8rem 6rem;
	min-width: 180px;
	text-align: center;
	text-decoration: none;
	background-color: #00aeef;
}

@media only screen and (max-width: 1000px) {
	.front-page-bottom h2 {
		font-size: 3rem;
	}
	
	.global-contact-block {
		/* height: 600px; */
	}
}

.global-contact-block .bottom-flex {
	display: flex;
	width: 100%;
}

.global-contact-block .bottom-flex div {
	background-color: #00aeef;
	height: 38px;
}

.global-contact-block .bottom-flex #first-bit {
	width: 60%;
}

.global-contact-block .bottom-flex #second-bit {
	width: 30%;
	margin-left: 8px;
	margin-right: 8px;
}

.global-contact-block .bottom-flex #third-bit {
	width: 12%;
}

/* Text Block */
.simple-text-block {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}

.simple-text-block h2 {
	text-transform: uppercase;
}

/* === Shop === */
.main_products_page {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 40px;
}

.woocommerce-LoopProduct-link.woocommerce-loop-product__link {
	width: 100%;
}

.woocommerce-LoopProduct-link.woocommerce-loop-product__link img {
	width: 100%;
}

.woocommerce-LoopProduct-link.woocommerce-loop-product__link .price{
    display: none !important;
}

.product .add_to_cart_button {
    display: none;
}

.woocommerce-loop-product__title {
    text-align: center;
}

/* Filter Styles */
.wpc-label-item div label span a {
    width: 100% !important;
    text-align: center;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 2.4rem;
    font-weight: 700 !important;
}

.widget.widget_wpc_filters_widget .wpc-filter-label-wrapper {
    background-color: transparent;
    border-radius: 0px !important;
    border: 2px solid #00aeef !important;
}

.widget.widget_wpc_filters_widget .wpc-filter-label-wrapper a {
    color: black;
    padding: 20px 45px;
    
}

.wpc-filters-widget-main-wrapper .wpc-filters-labels li.wpc-term-item input:checked+label {
    background-color: #00aeef;
    border-radius: 0px;
}

.wpc-filters-widget-main-wrapper .wpc-filters-labels li.wpc-term-item input:checked+label a {
    color: white !important;
}

.wpc-filters-widget-main-wrapper input.wpc-label-input:checked+label span.wpc-filter-label-wrapper {
    background-color: unset !important;
}

.wpc-term-item-content-wrapper label {
    border: 10px #00aeef !important;
}

.wpc-filters-section {
    width: 100% !important;
    max-width: 100% !important;
}
/* End Filter Styles */

/* === Sectors === */
/* Sectors List */
.sectors-container {
	width: 90%;
	display: flex;
	margin-left: auto;
	margin-right: auto;
	max-width: 1920px;
}

.sectors-container a {
	width: 100%;
	min-height: 200px;
	height: 18vw;
	margin-top: 20px;
}

.sectors-container .sectors-box {
	width: 100%;
	height: 100%;
	position: relative;
	background-image: url(/wp-content/uploads/2023/02/placeholder-background.png);
	background-size: cover;
}

.sectors-container a:nth-child(2) {
	margin-left: 0.8%;
	margin-right: 0.8%;
}

.sectors-container .sectors-box h4 {
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: 10px;
	color: white;
	text-transform: uppercase;
}

@media only screen and (max-width: 1100px) {
	.sectors-container {
		width: 85%;
		display: block;
	}
	
	.sectors-container a {
		height: 250px;
		margin-bottom: 20px;
		display: block;
	}
	
	.sectors-contaioner .sectors-box {
		max-width: 640px;
    	margin-left: auto;
    	margin-right: auto;
	}
	
	.sectors-container a:nth-child(2) {
		margin-left: 0;
		margin-right: 0;
	}
}

/* === About US === */
.meet-the-team-block {
	width: 100%;
	background-color: #00aeef;
	padding-left: 10%;
	padding-right: 10%;
}

.meet-the-team-block h2 {
	text-transform: uppercase;
	padding-top: 100px;
	color: white;
}

.meet-the-team-block p {
	color: white;
	margin-bottom: 90px;
}

.meet-the-team-block .meet-holder {
	width: 100%;
	display: flex;
}

.meet-the-team-block .meet-holder .meet-column {
	width: 100%;
}

.meet-the-team-block .meet-holder .meet-column:nth-child(2) {
	margin-left: 0.8%;
	margin-right: 0.8%;
}


.meet-the-team-block .meet-holder .meet-column img {
	width: 100%;
    height: 17.5vw !important;
    object-fit: cover;
}

.meet-the-team-block .meet-holder .meet-column h4 {
	text-align: center;
	color: white;
	font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-weight: 700;
	font-size: 2.8rem;
	margin-top: 1.8vw;
    margin-bottom: 8px;
}

.meet-the-team-block .meet-holder .meet-column p {
	text-align: center;
	color: white;
	margin-bottom: 1.8vw;
}



.meet-the-team-block .meet-holder .meet-column .meet-socials {
	display: flex;
	width: 100%;
	margin-bottom: 50px;
	margin-top: -30px;
}

.meet-the-team-block .meet-socials {
    justify-content: space-evenly;
    width: 15% !important;
    min-width: 82px;
    margin-left: auto;
    margin-right: auto;;
    margin-top: 0px !important;
}

.meet-the-team-block .meet-socials a {
    width: auto !important;
    margin: 0 !important;
}

.meet-the-team-block p {
    margin-bottom: 10px !important;
}

@media only screen and (max-width: 1200px) {
    
    .meet-the-team-block p {
        margin-bottom: 50px;
    }
    
    .meet-the-team-block .meet-holder {
        display: block;
    }
    
    .meet-the-team-block .meet-holder .meet-column {
        max-width: 600px;
        margin-left: auto !important;
        margin-right: auto !important;
    }
    
    .meet-the-team-block .meet-holder .meet-column img {
        height: 50vw !important;
    }
}

/* === Case Studies === */
.case-studies-section {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}

.case-studies-section .post-row {
	display: flex;
}

.case-studies-section .post-row a {
	width: 100%;
	margin-bottom: 12px;
	display: block;
}

.case-studies-section .post-row a:nth-child(2) {
	margin-left: 0.8%;
	margin-right: 0.8%;
}

.case-studies-section .post-row a .ind-post h3 {
	color: black;
    font-size: 2.15rem;
    margin-top: 12px;
    margin-bottom: 4px;
}

.case-studies-section .post-row a .ind-post p {
	color: #00aeef;
    font-size: 1.45rem;
}



@media only screen and (max-width: 1200px) {
    
    .case-studies-section .post-row {
        display: block;
    }
    
    .case-studies-section .post-row a .ind-post {
        max-width: 600px;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

.case-studies-section .post-row a .ind-post.case img {
    height: 380px !important;
    object-fit: cover;
	width: 100%;
}

.case-studies-section .post-row a .ind-post.news img {
    height: 360px !important;
    object-fit: cover;
    width: 100%;
}

@media only screen and (min-width: 1200px) {
    .case-studies-section .post-row a .ind-post.case img {
        height: 18vw !important;
    }
	.case-studies-section .post-row a .ind-post.news img {
        height: 22vw !important;
    }
}

.case-studies-section .post-row a {
    position: relative;
}

.case-studies-section .post-row a .ind-post button {
    position: absolute !important;
    bottom: 0px !important;
}

/* === Careers Vacancies === */
.text-with-image {
	width: 100%;
	display: flex;
	
	
	height: 742px;
}

.text-with-image .section-text {
	width: 60%;
	background-color: #00aeef;
	position: relative;
}

.text-with-image .section-text .holder {
	width: 70%;
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	color: white;
}

.text-with-image .section-text .holder h3 {
	text-transform: uppercase;
}

.text-with-image .section-image {
	width: 40%;
}

.text-with-image .section-image img {
	height: 100%;
	width: 100%;
	object-fit: cover;
}

@media only screen and (max-width: 1200px) {
    .text-with-image {
        display: block;
        height: unset;
    }

    .text-with-image .section-text {
        width: 100%;
    }
    
    .text-with-image .section-text .holder {
        position: unset;
        transform: none;
        margin-left: auto;
        margin-right: auto;
        padding-top: 50px;
        padding-bottom: 30px;
        width: 90%;
    }
    
    .text-with-image .section-image {
        width: 100%;
    }
}

.text-with-image .section-image.show-mobile {
    display: none;
}
    
.text-with-image .section-image.hide-mobile {
    display: block;
}

@media only screen and (max-width: 1200px) {
    .text-with-image .section-image.show-mobile {
        display: block;
    }
    
    .text-with-image .section-image.hide-mobile {
        display: none;
    }
}

/* Vacancies  Block */
.vacancies-block p, .vacancies-block h2 {
	width: 100%;
	text-align: center;
}

.vacancies-block h2 {
	text-transform: uppercase;
    font-size: 3.5rem;
}

.vacancies-block .vacancies {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 15px;
}

.vacancies-block .vacancies .vacancy {
	width: 100%;
	border: 1px solid black;
}

.vacancies-block .vacancies .vacancy .coloured-section {
	width: 8%;
	background-color: #00aeef;
	border-right: 1px solid black;
	max-width: 56px;
}

.vacancies-block .vacancies .vacancy .main .holder h4, .vacancies-block .vacancies .vacancy .main .holder p {
    text-align: left;
	width: 95%;
    margin: 0 !important;
}

.vacancies-block .vacancies .vacancy .main .holder h4 {
    margin-bottom: 30px !important;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    text-transform: uppercase;
}

.vacancies-block .vacancies .vacancy .main .holder p {
    font-size: 1.5rem;
}

@media only screen and (max-width: 1000px) {
    .vacancies-block .vacancies {
        display: block;
    }

    .vacancies-block .vacancies .vacancy {
        width: 100%;
        margin: 0 !important;
    }

    .vacancies-block .vacancies .vacancy:nth-child(1) {
        margin-bottom: 15px !important;
    }
    
    .vacancies-block .vacancies .vacancy .main .holder {
        
        margin-top: 10px;
        margin-bottom: 50px;
    }
}

/* === Apprenticeships === */

.large-page-header {
	height: 100vh;
}


.large-page-header .image {
	height: 55%;
	background-image: url('/wp-content/uploads/2023/03/best-practice-logo.png');
	background-color: white;
	background-size: 1500px;
    background-repeat: no-repeat;
    background-position: center;
}

.large-page-header .content {
	height: 45%;
	background-color: #00aeef;
	
	color: white;
	text-align: center;
}

.large-page-header .content .holder {
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.large-page-header .content .holder p {
	width: 60%;
	margin-left: auto;
	margin-right: auto;
}

/* === Individual Sectors === */
/* Main Portion */
.sector-content {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
	display: flex;
}

.sector-content .sector-image {
	width: 50%;
}

.sector-content .sector-image img {
	height: 100%;
	object-fit: cover;
}

.sector-content .sector-body {
	width: 50%;
	position: relative;
}

.sector-content .sector-body .holder {
	position: relative;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 80%;
	margin-top: 12px;
	margin-bottom: 114px;
}

@media only screen and (max-width: 1200px) {
    
    .sector-content {
        width: 95%;
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

    .sector-content .sector-image {
        width: 100%;
    }

    .sector-content .sector-body {
        width: 100%;
    }
    
    .sector-content .sector-body .holder {
        width: 100%;
        position: unset;
        transform: none;
        margin-top: 100px;
    }
}

.go-back-button {
    width: 80%;
    margin: 60px auto 40px auto;
}

.go-back-button a {
    text-transform: uppercase;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-weight: 700;
    text-decoration: underline;
    color: black;
    text-decoration-color: #00aeef;
    font-size: 2.1rem;
}

/* Products Shop Area */
.micro-shop {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}

.micro-shop .intro hr {
	border-top: 3px solid black;
	margin-bottom: 0px;
}

.micro-shop .intro h4 {
	margin-top: 0;
    transform: translateY(-16px);
    background-color: white;
    width: 20%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}

@media only screen and (max-width: 1200px) {
	.micro-shop .intro h4 {
		width: 40%;
	}
}

/*** HEADER ***/
.toggle.nav-toggle {
    position: absolute;
    right: 10px;
}

.mobile-menu {
    display: none !important;
}

.expanded-menu {
    display: block !important;
    margin-top: 10vw;
}

.menu-modal-inner {
    background-color: #00aeef !important;
    display: flex;
    justify-content: stretch;
    overflow: auto;
    -ms-overflow-style: auto;
    text-align: center;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    margin: 0;
    font-weight: 700;
}

.menu-modal-inner a {
    color: white !important;
	padding: 24px 0;
    text-transform: uppercase;
}

.menu-modal-inner li {
    border: 0px;
    
}


.menu-modal-inner li.menu-item-has-children .ancestor-wrapper {
    border: 0px;
    position: relative !important;
}

.menu-modal-inner li .ancestor-wrapper > a {
    font-size: 3.3rem !important;
}

.menu-modal-inner button.sub-menu-toggle {
    border: 0px;
    position: absolute;
    
    height: 100%;
    margin: 0;
    width: 100%;
}

.menu-modal-inner button.sub-menu-toggle svg {
    width: 50px;
    position: absolute;
    top: 45%;
    left: 60%;
}



@media only screen and (max-width: 600px) {
    .menu-modal-inner button.sub-menu-toggle svg {
        left: 70%;
    }
}

.menu-top {
}

#site-header .header-inner.section-inner {
    position: relative !important;
}

#site-header .header-inner.section-inner .toggle-text {
    display: none;
}
/*** END old HEADER ***/

/** Menu Modifiactions **/
.toggle-icon {
    z-index: 9999 !important;
}

@media only screen and (min-width: 1000px) {
    #site-header .sidebar-nav {
        position: fixed;
        right: 0px;
        top: 0px;
        background-color: #00aeef;
        height: 100vh;
        width: 85px;
    }

    #site-header .sidebar-nav .toggle.nav-toggle {
        display: block;
        position: initial !important;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        margin-top: 30px;
    }
    
    
    
    .expanded-menu {
        margin-top: 60px;
    }
    .modal-menu a {
        text-align: left;
        margin-left: 100px;
    }
    
    .menu-modal-inner button.sub-menu-toggle svg {
        left: 250px !important;
    }
}


.main-content > p, .main-content > h1, .main-content > h2, .main-content > h3, .main-content > h4, .main-content > h5, .main-content > h6, .main-content > h7, .main-content > h8  {
	width: 80%;
    margin-left: auto;
    margin-right: auto;
}

@media only screen and (max-width: 1000px) {
	.main-content > p, .main-content > h1, .main-content > h2, .main-content > h3, .main-content > h4, .main-content > h5, .main-content > h6, .main-content > h7, .main-content > h8  {
		width: 93%;
		margin-left: auto;
		margin-right: auto;
	}
}


/** TEMP TO REMOVE ================================================================= **/
.primary-menu,.header-toggles {
    display: none !important;
}


#site-header {
    position: absolute !important;   
}

/** Tabs **/
.sp-tab__lay-default {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
	margin-top: 50px;
}

.sp-tab__lay-default .sp-tab__tab-pane,.sp-tab__lay-default .sp-tab__nav{
    border: 0 !important;
}


.sp-tab__lay-default .sp-tab__nav li {
    background-color: #00aeef !important;
    width: 14%;
    min-width: 200px;
    border: 0 !important;
    text-transform: uppercase;
	min-height: 38px;
}

.sp-tab__lay-default .sp-tab__nav li label.sp-tab__active {
    background-color: #ffffff !important;
    border: 1px black solid !important;
}

.sp-tab__lay-default .sp-tab__nav li label.sp-tab__active span h4 {
    color: black !important;
}

.sp-tab__lay-default .sp-tab__nav li label {
    border: 0 !important;
	padding-top: 0px !important;
	padding-bottom: 0px !important;
	text-align: center;
}

.sp-tab__lay-default .sp-tab__nav li label span h4 {
    color: white !important;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
}

/** Woocommerce **/
.woocommerce-breadcrumb {
	display: none;
}

.related.products .button {
    display: none;
}


/* Temp Anchor <a> Modifications */
/*a {
    text-transform: uppercase;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-weight: 700;
    text-decoration: underline;
    color: black;
    text-decoration-color: #00aeef;
    font-size: 2.1rem;
} */

/* Experimental <p> modifier */
p {
	padding: 0;
}

.go-back a {
    color: black;
}

.products-list .products > li a img {
    height: 350px;
    object-fit: cover;
}

.product_meta, .upsells, .related.products .wqoecf_enquiry_button {
    display: none;
}

/* Front Page Extra */
.front-page-bottom {
    display: block;
    height: auto;
}

.front-page-bottom .left-column {
    width: 100%;
    height: 800px;
    background-position: bottom;
}

.front-page-bottom .right-column {
    width: 100%;
    height: 250px;
    background-color: #00aeef;
}

.front-page-bottom .right-column a {
    background-color: white;
    color: #00aeef;
    border: 1px solid white;
}

.front-page-bottom .right-column h3 {
    color: white;
}

.front-page-bottom .right-column a:hover {
    background-color: #00aeef;
    color: white;
}




.front-page-bottom .left-column h2 {
    width: 26%;
    bottom: 50px;
}

@media only screen and (max-width: 1200px) {
    .front-page-bottom .left-column h2 {
        width: 70%;
    }
}

/* Fix Form heigh issue */
.wpcf7 form {
	max-height: unset !important;
}

/* More form stlying */
.ind-form p {
    font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 2rem;
    margin-bottom: 10px !important;
    margin-top: 15px !important;
    display: block;
}

.ind-form .wpcf7-file {
    color: white;
}

.ind-form input.wpcf7-submit {
    border: 1px solid transparent;
    transition-property: background-color;
    transition-property: border-color;
}

.ind-form input.wpcf7-submit:hover {
    background-color: transparent;
    border: 1px solid black;
}

.wpcf7-not-valid-tip {
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 2.1.4rem;
    text-transform: uppercase;
}

.wpcf7-response-output {
    border: 2px solid #dc3232 !important;
    color: #dc3232;
}


.hide-mobile {
	display: block;
}


.hide-desktop {
	display: none;
}

@media only screen and (max-width: 1200px) {
    .hide-mobile {
		display: none;
	}
	
	.hide-desktop {
		display: block;
	}
}

/* Sidebar Hover */
.icon-filter-hov:hover {
    filter: invert(0.2);
    transition-property: filter;
    transition-timing-function: ease-in-out;
    transition-duration: 0.2s;
}

/* SIdebar Icon */
@media only screen and (max-width: 1000px) {
	.side-bar-icon {
		display: none;
	}
}

#site-footer {
	z-index: -100;
    position: relative;
    bottom: 0;
}

.side-bar-icon img {
    max-height: 40px;
    width: 100%;
    object-fit: contain;
}

.side-bar-icon {
    width: 100% !important;
    
}

.wpcf7-form-control-wrap select {
    width: 100%;
    padding: 20px;
    border: 0px;
    font-size: 1.7rem;
}

/* Enquire Button */
.woocommerce a.wqoecf_enquiry_button {
    border-radius: 0px !important;
    border: 1px solid #00aeef;
    margin-top: 10px;
}

.woocommerce a.wqoecf_enquiry_button:hover {
    background-color: transparent !important;
    color: black !important;
    border: 1px solid black;
}

.woocommerce a.wqoecf_enquiry_button:hover::before {
    filter: invert(1);
}

/* Related Products Fix */
.related.products .woocommerce-LoopProduct-link img {
    height: 300px;
    object-fit: cover;
}

/* Box reater margin fix */
@media only screen and (max-width: 1000px) {
    .box-repeater-box img {
        margin-bottom: 15px;
    }
}

/* Box repeater hover effect */
.box-repeater-box:hover {
    filter: invert(0.15);
    transition-duration: 300ms !important;
    transition-property: filter;
}

.box-repeater-box:hover h4.Overlay, .box-repeater-box:hover h4.overlap {
    color: #00aeef !important;
    transition-duration: 300ms !important;
    transition-property: color;
}

/* Min Height fix */
#site-content {
	min-height: 90vh;
}

/* Improving mobile functionality */
.sidebar-nav .nav-toggle .toggle-inner {
    padding-top: 20px;
}

.sidebar-nav .nav-toggle.active .toggle-inner {
    display: none;
}

.search-toggle {
    display: none !important;
}

.menu-modal.cover-modal.header-footer-group {
    z-index: 100;
}

@media only screen and (max-width: 700px) {
    .products-list .products li {
        width: 100% !important;
    }
}

@media only screen and (max-width: 1000px) {
    .global-title-heading #page-title {
        font-size: 3rem !important;
        text-align: center;
        width: 98%;
    }
}

@media only screen and (max-width: 1200px) {
    .case-studies-section .post-row a .ind-post button {
        bottom: -50px !important;
        
    }
    
    .case-studies-section .post-row a .ind-post {
        position: relative;
    }
    
    
    .case-studies-section .post-row a {
        margin: 0 !important;
        margin-top: 5px !important;
    }
}

@media only screen and (max-width: 700px) {
    .image-with-text .image-section img {
        max-height: 500px;
    }
}

#map {
    height: 700px;
}

@media only screen and (max-width: 1000px) {
    #map {
        position: absolute;
        width: 100vw !important;
        left: 0 !important;
        margin-top: -485px;
    }
    
    .locations h3 {
        margin-bottom: 500px;
    }
}

.box-repeater h4 {
    text-align: center;
    width: 80%;
}

/* Product Edit */
.woocommerce .products .woocommerce-loop-product__title {
    color: white !important;
    background-color: #00aeef;
    text-align: center;
    padding: 5px 50px;
    margin-bottom: 25px !important;
    font-size: 16px !important;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    transition: margin-bottom 100ms, background-color 100ms;
}


.woocommerce .products a:hover .woocommerce-loop-product__title {
    background-color: #0094cb;
}

.products-list .woocommerce .products a:hover .woocommerce-loop-product__title {
    margin-bottom: 40px !important;
}

@media only screen and (max-width: 1700px) {
	.woocommerce .products .woocommerce-loop-product__title {
		padding: 5px 10px !important;
	}
}

/* Download PDF Button */
#download-pdf-button a {
    background-color: #00aeef;
    border-radius: 0px !important;
    border: 1px solid #00aeef;
    margin-top: 10px;
    color: #fff !important;
    white-space: nowrap;
    padding: 0.618em 1em;
    font-weight: 700;
    border-radius: 3px;
    display: inline-block;
    box-shadow: none;
}

#download-pdf-button a:hover {
    background-color: transparent !important;
    color: black !important;
    border: 1px solid black;
}

/* Blue Stripe */
.blue_stripe {
    background-color: #00aeef;
    width: 100% !important;
    padding: 10px 0;
}

/* List fix */
.main-content > ul {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

/* Contact new text */
p.contact-title-phone, p.contact-title-email {
    width: 100% !important;
    text-align: center;
    text-transform: uppercase;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
}

p.contact-title-phone {
    padding-top: 50px;
    padding-bottom: 0;
}

p.contact-title-email {
    padding-top: 15px;
    margin-bottom: -50px;
}

/* Breadcrumbs */
#breadcrumb-holder {
    text-align: center;
    background-color: #00aeef;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    height: auto;
	width: 100%;
}

#breadcrumb-holder a{
    color: white;
	text-align: center;
}

#breadcrumb-holder a:hover{
    text-decoration: underline;
}

/* Extra Bread */
#breadcrumbs {
    text-align: center;
    background-color: #00aeef;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    height: auto;
	width: 100%;
}

#breadcrumbs a{
    color: white;
	text-align: center;
}

#breadcrumbs a:hover{
    text-decoration: underline;
}

.color-accent,.color-accent-hover:hover,.color-accent-hover:focus,:root .has-accent-color,.has-drop-cap:not(:focus):first-letter,.wp-block-button.is-style-outline,a {
	color: black;
    text-decoration: underline;
    font-weight: bold;
}

/* Spacing Issues */
.wqoecf_enquiry_button {
    margin-top: 30px !important;
}

.summary.entry-summary {
    margin-bottom: 15px !important;
}

/* New Header */
@media only screen and (min-width: 700px) {
    .global-title-heading {
        min-height: 320px;
        height: 25vw;
    }
}

@media only screen and (min-width: 700px) {
    .global-title-heading {
        min-height: 320px;
        height: 25vw;
    }
}

@media only screen and (max-width: 1000px) {
    #page-title {
        bottom: 80px;
    }
}

@media only screen and (max-width: 700px) {
    .global-title-heading {
        height: 280px;
        min-height: unset;
    }
}

/* Recaptcha Bade */
.grecaptcha-badge {
    z-index: 9999;
}

/* Chatbox */
#tidio-chat-iframe {
    right: 80px !important;
    bottom: 65px !important;
	z-index: 9999999999 !important;
}

@media only screen and (max-width: 999px) {
    #tidio-chat-iframe {
        right: -10px !important;
        bottom: 65px !important;
    }
}

/* map */

#map iframe, #map div {
    height: 100% !important;
    width: 100% !important;
}

#tidio-chat-iframe {
    max-width: 500px !important;
}

/* Additional CSS */

#site-footer {
    z-index: 50 !important;
position: relative;
bottom: 0;
}

.sidebar-nav {
    z-index: 100 !important;
}

.color-accent, .color-accent-hover:hover, .color-accent-hover:focus, :root .has-accent-color, .has-drop-cap:not(:focus):first-letter, .wp-block-button.is-style-outline, a {
color: black;
text-decoration: underline;
font-weight: bold;
}

#breadcrumb-holder p span {
display: inline-block !important;
}

.breadcrumb_last {
max-width: 400px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: clip;
}

@media only screen and (max-width: 900px) {
.breadcrumb_last {
    max-width: 30vw;
            transform: translate(0px, 3px);
}
}

@media only screen and (max-width: 1000px) {
.toggle-inner {
    background-color: #00aeef;
    padding: 12px;
}

.toggle-icon {
    margin-top: -7px;
}
}

@media only screen and (max-width: 700px) {
.global-title-heading h1#page-title, .global-title-heading h1 {
    bottom: 40px !important;
    font-size: 3rem !important;
}
	
  .global-title-heading h2 {
    bottom: 40px !important;
    font-size: 3rem !important;
}
}

/* Menu Bit */
.menu-text {
position: absolute !important;
top: 25px;
right: 9px;
font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
font-size: 2.2rem;
}

#site-header div.sidebar-nav button.toggle.nav-toggle {
position: relative !important;
}

@media only screen and (max-width: 1000px) {
.menu-text {
    top: 2px;
    left: 12px;
}

#site-header div.sidebar-nav button.toggle.nav-toggle {
    position: absolute !important;
    right: 40px;
    top: -23px;
}

#site-header div.sidebar-nav button.toggle.nav-toggle .toggle-inner .toggle-icon {
    width: 60px !important;
}
}

.wp-element-caption {
    width: 80%;
    margin: 5px auto !important;
    text-align: center;
}

/* Homepagemutebtn */

#homemutebtn {
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    padding: 12px;
}

/* Temporary Homepage Video Edit */

@media only screen and (max-width: 800px) {
    #homevid {
        display: none !important;
    }
    
    #homevid-mobile {
        display: block !important;
		max-height: 60vh;
    }
    
    .front-page-header {
        height: auto !important;
		max-height: 60vh;
    }
}

/* Granslate Move n hide */
#gt_float_wrapper {
    right: 100px !important;
    bottom: 13px !important;
    transition: 300ms;
    opacity: 1 !important;
    z-index: 750 !important;
}

#gt_float_wrapper.hideMode {
    bottom: 20px !important;
    opacity: 0 !important;
}

.grecaptcha-badge {
    z-index: 999 !important;
}

@media only screen and (max-width: 500px) {
    #gt_float_wrapper {
        right: 10px !important;
        bottom: 80px !important;
    }
    
    #gt_float_wrapper.hideMode {
        bottom: 80px !important;
        opacity: 1 !important;
    }
}

#gt_float_wrapper {
    z-index: 999999999999 !important;
}

.grecaptcha-badge {
    z-index: 99999999999999 !important;
}

.image-with-text img {
	width: 100%;
}

.icon-columns {
	padding-bottom: 95px;
}

@media only screen and (max-width: 1200px) {
    .image-with-text p {
        padding-bottom: 35px;
    }
}

/* Shop Live */
.summary .shopify-buy-frame.shopify-buy-frame--product > iframe {
    display: block !important;
    height: 110px !important;
}

.shopify-buy-frame--toggle.is-sticky {
    border-top: 2px solid white;
    border-left: 2px solid white;
    border-bottom: 2px solid white;
    border-radius: 20px 0 0 20px;
    overflow: hidden;
    position: fixed !important;
    right: 0 !important;
    bottom: 5% !important;
    top: unset !important;
    z-index: 2147483645 !important;
}






.trustpilot-widget.mobile {
    display: none;
}

@media only screen and (max-width: 1000px) {
    .trustpilot-widget.mobile {
        display: block !important;
        margin-bottom: 20px !important;
        transform: translateY(-5px);
    }
    
    .trustpilot-widget.desktop {
        display: none !important;
    }
}

.country-selector {
    transform: translateX(-70px);
    z-index: 999999999999999999999999999999 !important;
}

div > .grecaptcha-badge {
    z-index: 9000 !important;
}


@media only screen and (max-width: 1000px) {
    .shopify-buy-frame--toggle.is-sticky {
        bottom: 40% !important;
    }
}

@media only screen and (max-width: 500px) {
    .grecaptcha-badge {
        transform: translateY(-40px) !important;
    }
    
    #tidio-chat #tidio-chat-iframe {
        transform: translateY(30px) !important;
    }
    
    .country-selector {
        transform: translateX(25px);
    }
}

/* Lang */
html[lang="ar"] .image-with-text .text-section > div > * {
    transform: translateX(-10vw);
}

html[lang="ar"] .owl-carousel {
    display: none !important;
}

@media only screen and (max-width: 1200px) {
    html[lang="ar"] .image-with-text .text-section > div > * {
        transform: translateX(-50px);
    }
}

@media only screen and (max-width: 1000px) {
    html[lang="ar"] .image-with-text .text-section > div > * {
        transform: translateX(0px);
    }
}

/* Shop */
.shop-button {
    display: block !important;
    background-color: unset;
    padding: unset !important;
    position: relative !important;
    width: 100%;
    height: 30px;
}

.shop-button a {
    background-color: unset;
    white-space: nowrap;
    color: white;
    text-decoration: unset;
    font-family: oswald, Helvetica Neue, Helvetica, Arial, sans-serif;
    font-size: 2.2rem;
    color: white;
    position: absolute !important; 
    top: 7px;
    right: 15px;
}

/* Trustpilot */
.trustpilot-widget.desktop {
    display: block !important;
}

@media only screen and (max-width: 1000px) {
    .trustpilot-widget.desktop {
        display: none !important;
    }
    
    .trustpilot-widget.mobile {
        display: block !important;
    }
}

@media only screen and (max-width: 1000px) {
    .shop-button {
        display: none !important;
    }
}

/* New Product Filter */
@media only screen and (max-width: 1200px) {
	.wpfCheckboxHier {
		border: 2px solid #0d9ace;
		overflow: hidden;
		padding: 0 5px;
	}
	
    .products-list {
        position: relative;
    }
    
    .product-list-left {
        position: fixed;
        top: 0;
        left: -320px;
        z-index: 999;
        background-color: white;
        border-right: 3px solid #0d9ace;
        width: 320px;
        height: 100vh;
        overflow: visible;
        transition: 200ms left;
    }
    
    .product-list-left.active {
        left: 0;
    }
    
    .product-list-left > div {
        overflow-y: scroll;
        height: 100%;
        padding-top: 20px;
        padding-bottom: 60px;
        margin: unset;
        width: 100%;
        max-width: unset;
    }
    
    .product-list-right {
        width: 100%;
    }
    
    .filter-but {
        display: block !important;
        position: absolute;
        top: 65px;
        right: 0;
        text-decoration: none;
        color: white;
        background-color: #0d9ace;
        padding: 7px 15px;
        border-radius: 0 12px 12px 0;
        transform: translateX(100%);
        cursor: pointer;
    } 
}

@media only screen and (min-width: 700px) and (max-width: 1510px) {
    .products-list li.product {
        width: 48% !important;
    }
}

@media only screen and (max-width: 400px) {
    .product-list-left {
        left: -250px;
        width: 250px;
    }
}

/* New Sticky Header */
.grecaptcha-badge {
    display: none !important;
}

@media only screen and (max-width: 1000px) {
	#cmplz-manage-consent button {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		width: 100vw !important;
		border-radius: unset !important;
		height: 32px !important;
		font-size: 14px !important;
		padding: 0 !important;
		box-shadow: unset !important;
	}
}



#site-header #sticky-header {
    position: fixed;
    background-color: #00aeef;
    z-index: 9999999 !important;
    border-bottom: 1px solid white;
	left: 0;
	top: 31px;
}

#site-header #sticky-header .inside {
    padding: 15px 0px;
    width: 90%;
    margin: auto;
    display: flex;
    height: 100%;
}

#site-header #sticky-header .inside .image-wrapper {
    width: 40%;
    display: block;
}

#site-header #sticky-header .inside .image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    transform: translateY(5px);
}

#site-header #sticky-header .inside .buttons {
    position: relative;
    width: 80%;
    display: flex;
    justify-content: right;
}

#site-header #sticky-header .inside .buttons .head-icon {
    width: 30px;
    height: 30px;
    margin: auto 8px;
}

#site-header #sticky-header .inside .buttons > button.nav-toggle {
    display: block !important;
    margin: auto 0 !important;
    margin-left: 20px !important;
    width: 38px !important;
    position: static !important;
}

#site-header #sticky-header .inside .buttons > button.nav-toggle .toggle-text {
    display: none;
}

#site-header #sticky-header .inside .buttons > button.nav-toggle .toggle-inner {
    display: relative;
    width: 100%;
    height: 20px !important;
}

#site-header #sticky-header .inside .buttons > button.nav-toggle .toggle-inner::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 3.5px;
    background-color: white;
    top: 0;
    left: 0;
}

#site-header #sticky-header .inside .buttons > button.nav-toggle .toggle-inner::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 3.5px;
    background-color: white;
    bottom: 0;
    left: 0;
}

@media only screen and (max-width: 700px) {
	body {
		padding-top: 120px !important;
	}
}

@media only screen and (max-width: 500px) {
    #site-header #sticky-header .inside .buttons #lang-switcher {
        margin-right: 30px !important;
    }
    
    #site-header #sticky-header .inside .buttons .head-icon {
        margin: auto 5px;
    }
	
	#site-header #sticky-header .inside .buttons .head-icon {
		height: 27px;
		width: 27px;
	}
	
	body {
		padding-top: 100px !important;
	}
}

#site-header #sticky-header {
	display: none;
}

@media only screen and (max-width: 999px) {
	#site-header #sticky-header {
		display: block !important;
	}
	
	body {
		padding-top: 140px;
	}
}

@media only screen and (max-width: 1000px) {
	.header-inner {
		display: none !important;
	}
}/* ----------------------------------------------
Inter variable font. Usage:

@supports (font-variation-settings: normal) {
	html { font-family: 'Inter var', sans-serif; }
}
---------------------------------------------- */

@font-face {
	font-family: "Inter var";
	font-weight: 100 900; /* stylelint-disable-line font-weight-notation */
	font-style: normal;
	font-display: swap;
	src: url(twentytwenty/assets/fonts/inter/Inter-upright-var.woff2) format("woff2");
}

@font-face {
	font-family: "Inter var";
	font-weight: 100 900; /* stylelint-disable-line font-weight-notation */
	font-style: italic;
	font-display: swap;
	src: url(twentytwenty/assets/fonts/inter/Inter-italic-var.woff2) format("woff2");
}
