/*
Theme Name: Rehau
Author: GWP Inc.
Description: Rehau Child Theme
Version: 1.0
Template: bootstrap-component-blox
*/

@font-face {
    font-family: 'Brix Sans Black';
    src: url('fonts/BrixSansBlack.eot');
    src: url('fonts/BrixSansBlack.eot?#iefix') format('embedded-opentype'),
         url('fonts/BrixSansBlack.woff2') format('woff2'),
         url('fonts/BrixSansBlack.woff') format('woff'),
         url('fonts/BrixSansBlack.ttf')  format('truetype'),
         url('fonts/BrixSansBlack.svg#Brix Sans') format('svg');
}

@font-face {
  font-family: 'BrixSansBold';
  src: url(fonts/BrixSansBold.eot);
  src: url(fonts/BrixSansBold.eot?#iefix) format('embedded-opentype'),
       url(fonts/BrixSansBold.ttf) format('truetype'),
       url(fonts/BrixSansBold.woff) format('woff'),
       url(fonts/BrixSansBold.woff2) format('woff2'),
       url(fonts/BrixSansBold.otf) format('otf'),
       url(fonts/BrixSansBold.svg#BrixSansBold) format('svg');
}

@font-face {
    font-family: 'Brix Sans Light';
    src: url('fonts/BrixSansLight.eot');
    src: url('fonts/BrixSansLight.eot?#iefix') format('embedded-opentype'),
         url('fonts/BrixSansLight.woff2') format('woff2'),
         url('fonts/BrixSansLight.woff') format('woff'),
         url('fonts/BrixSansLight.ttf')  format('truetype'),
         url('fonts/BrixSansLight.svg#Brix Sans') format('svg');
}

@font-face {
    font-family: 'Brix Sans Regular';
    src: url('fonts/BrixSansRegular.eot');
    src: url('fonts/BrixSansRegular.eot?#iefix') format('embedded-opentype'),
         url('fonts/BrixSansRegular.woff2') format('woff2'),
         url('fonts/BrixSansRegular.woff') format('woff'),
         url('fonts/BrixSansRegular.ttf')  format('truetype'),
         url('fonts/BrixSansRegular.svg#Brix Sans') format('svg');
}

:root {
	--rh-red: #DD0060;
	--rh-teal: #37A58C;
	--rh-dark: #000;
	--rh-grey: #4E4E4E;
    --rh-font:  'Brix Sans Light';
}

/* ===== Global ===== */

html,
body { 
	overflow-x: hidden;
	font-family: var(--rh-font);
	color: var(--rh-dark);
}

a,
a:hover {
	text-decoration: none;
}

/* ===== Custom Classes ===== */

.z-front {
	z-index: 5;
}

.z-back {
	z-index: 1;
}

.fw-bold {
	font-family: 'BrixSansBold';
}

.fw-light {
	font-family: 'Brix Sans Light';
}

#rh-footer-widgets .rh-has-links a {
    color: #fff;
}

#rh-footer-widgets .rh-has-links a:hover {
    color: var(--rh-teal);
}
.object-fit {
    object-fit: cover;
}

.h-300 {
    height: 200px;
}

/* ===== Text Color ===== */

.rh-text-red {
	color: var(--rh-red);
}

.rh-text-teal {
	color: var(--rh-teal);
}

.rh-text-dark {
	color: var(--rh-dark);
}

.rh-text-grey {
	color: var(--rh-grey);
}

/* ===== Background Color ===== */

.rh-bg-red {
	background-color: var(--rh-red);
}

.rh-bg-teal {
	background-color: var(--rh-teal);
}

.rh-bg-dark {
	background-color: var(--rh-dark);
}

.rh-bg-grey {
	background-color: var(--rh-grey);
}

/* ===== Button ===== */

.btn {
	border-radius: 0px;
	padding: 10px 25px;
	font-size: 20px;
	text-transform: uppercase;
	font-family: 'Brix Sans Black';
}

.rh-btn-red {
	background-color: var(--rh-red);
	color: #fff;
}

.rh-btn-red:hover {
	background-color: var(--rh-red);
	color: #fff;
	opacity: .8
}

.rh-btn-teal {
	background-color: var(--rh-teal);
	color: #fff;
}

.rh-btn-teal:hover {
	background-color: var(--rh-teal);
	color: #fff;
	opacity: .8
}

.rh-btn-grey {
	background-color: var(--rh-grey);
	color: #fff;
}

.rh-btn-grey:hover {
	background-color: var(--rh-grey);
	color: #fff;
	opacity: .8
}

.rh-btn-dark {
	background-color: var(--rh-dark);
	color: #fff;
}

.rh-btn-dark:hover {
	background-color: var(--rh-dark);
	color: #fff;
	opacity: .8
}

.rh-btn-teal-outline {
    border: 2px solid var(--rh-dark);
}

.rh-btn-teal-outline:hover {
    border: 2px solid var(--rh-teal)!important;
    color: #fff!important;
    background: var(--rh-teal)!important;
}

.rh-btn-active {
    background: var(--rh-teal)!important;
    border-color: var(--rh-teal)!important;
    color: #fff!important;
}

/* ===== Navbar ===== */

#navbar-main-menu .nav-link {
	color: var(--rh-dark);
	text-transform: uppercase;
}

#bcb-main-navbar img {
    max-width: 200px;
}

/* ===== Toggler ===== */

#toggler:focus, 
#toggler:active {
    outline: 0;
}

#toggler span {
    width: 30px;
    height: 3px;
    display: block;
    background-color: var(--rh-dark);
    margin: 7px 0;
    -webkit-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
}

#toggler span:nth-child(1) {
    -webkit-transform: translatey(10px) rotate(-45deg);
        -ms-transform: translatey(10px) rotate(-45deg);
            transform: translatey(10px) rotate(-45deg);
}

#toggler span:nth-child(2) {
    opacity: 1;
    width: 0;
}

#toggler span:nth-child(3) {
    -webkit-transform: translatey(-10px) rotate(45deg);
        -ms-transform: translatey(-10px) rotate(45deg);
            transform: translatey(-10px) rotate(45deg);  
}

#toggler.collapsed span {
    -webkit-transform: translatey(0) rotate(0deg);
        -ms-transform: translatey(0) rotate(0deg);
            transform: translatey(0) rotate(0deg);
    opacity: 1;
    width: 30px;   
}

/* ===== Home ===== */

#rh-intro .rh-bg-teal {
    position: relative;
    bottom: 100px;
}

.rh-white-line {
    background: #fff;
    height: 23px;
    width: 115px;
    position: absolute;
    left: 0;
    bottom: 30px;
}

.rh-black-line {
    background: #000;
    height: 23px;
    width: 240px;
    position: absolute;
    left: -240px;
    bottom: 30px;
}

#rh-home-why .rh-line {
    width: 180px;
    height: 24px;
    background: var(--rh-teal);
}

/* ===== Intro ===== */

.page-template-edgeband #rh-intro sup {
	font-size: 12px
}

#rh-intro img {
    transition: all .3s;
}

#rh-intro .overflow-hidden:hover img {
    transform: scale(1.1);
}

#rh-intro .overflow-hidden .rh-scale {
    transform: scale(1.2);
}

#rh-intro .overflow-hidden:hover .rh-scale {
    transform: scale(1.3);
}

/* ===== Slider ===== */

#rh-surface-slider .rh-line {
    height: 24px;
    width: 180px;
    background: var(--rh-teal);
}

/* ===== Has Form ===== */

.has-form .wpforms-container {
	margin-bottom: 0!important;
	margin-top: 0!important;
}

.has-form .wpforms-submit {
	color: #fff!important;
	background: var(--rh-red)!important;
	padding: 10px 20px!important;
	text-transform: uppercase!important;
	border: none!important;
	font-weight: bold!important;
}

/* ===== Footer ===== */

footer {	
	background: var(--rh-dark);
	color: #fff;
}

footer a {
	color: rgba(255,255,255,0.8);
}

footer a:hover {
	color: rgba(255,255,255,0.6);
}


@media (max-width: 992px) {
    
    #rh-intro .position-absolute {
        position: static!important;
    }
    
    .h-350 {
        height: 420px!important;
    }
    
    .h-300 {
        height: 200px;
    }
}

@media (max-width: 768px) {}

@media (max-width: 576px) {}