/*Colors:
Lighter Red: #e74640
Hinks Red:   #DB211B
Darker Red:  #7f1310


Saturated Red: #f50800;




*/


/*******************************************************************************
Util Classes
*******************************************************************************/
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700');

/*Filters*/
.filter-red{
    filter: grayscale(60%) brightness(45%) sepia(60%) hue-rotate(-45deg) saturate(400%) contrast(1.1)
}


.standard-width{
    max-width: 1200px;
}

.animate-opacity-hidden{
    opacity: 0;
}
h1,h2,h3,h4,h5,h6{
    color: #DB211B;
    font-weight: 400;
}
p{}
body{
    font-family: 'Open Sans', sans-serif;
}

.center-child{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row;
}

.blank-link{
    color: inherit;
    text-decoration: inherit;
    background-color: inherit;
}
.blank-link:hover{
    color: inherit;
}

.red-bar{
    position: relative;
}
.red-bar::before{
    height: 3px;
    width: 110px;
    background-color: #DB211B;

    content: ' ';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
}
/* Remove the before section if .after is present.*/
.red-bar.after::before{
    content: '';
    display: none;
}
.red-bar.after::after{
    height: 3px;
    width: 110px;
    background-color: #DB211B;

    content: ' ';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
}




.center-split{
    display: flex;
    justify-content: center;
    flex-direction: row;
}
.center-split .v-center{
    align-items: center;
}
.center-split .left{
    flex-basis: 50%;
    flex-grow: 0;
    flex-shrink: 0;
}
.center-split .right{
    flex-basis: 50%;
    flex-grow: 0;
    flex-shrink: 0;
}
.center-split .left .wrapper{
	padding-right: 2%;
}
.center-split .right .wrapper{
	padding-left: 2%;
}
@media screen and (max-width: 800px){
	.center-split .left .wrapper{
	padding-right: 0%;
}
.center-split .right .wrapper{
	padding-left: 0%;
}
}
/*Sizes*/




/*Section Padder*/

.vp-tiny{
    padding-top: 20px;
    padding-bottom: 20px;
}
.vp-small{
    padding-top:    40px ;
    padding-bottom: 40px ;
}
.vp-default{
    padding-top:    80px ;
    padding-bottom: 80px ;
}
.vp-large{
    padding-top:    120px;
    padding-bottom: 120px;
}

.vp-none{
    padding-top: 0px;
    padding-bottom: 0px;
}
.vp-notop{
    padding-top: 0px;
}
.vp-nobot{
    padding-bottom: 0px;
}


.hp-tiny{
    padding-left: 20px;
    padding-right: 20px;
}
.hp-small{
    padding-left : 40px ;
    padding-right: 40px ;
}
.hp-default{
    padding-left : 80px ;
    padding-right: 80px ;
}
.hp-large{
    padding-left : 120px;
    padding-right: 120px;
}

.hp-none{
    padding-left: 0px;
    padding-right: 0px;
}
.hp-noleft{
    padding-left: 0px;
}
.hp-noright{
    padding-right: 0px;
}



/************************************
default
************************************/
a{
    color: #DB211B;
    transition: color 0.5s;
}
a:hover{
    color: #e74640;
    text-decoration: none;
}
/*******************************************************************************
********************************************************************************
********************************************************************************
HEADER MENU
********************************************************************************
********************************************************************************
*******************************************************************************/

#site-header{
    display: flex;
    flex-direction: row;
    align-items: center;

    position:fixed;

    background-color: #fff;
    z-index: 999;
}
.menu-width{
    width:100%;
    /*max-width: 1200px;*/
    max-width: 1300px;
    clear: both;
    margin:auto;
}
.header-inner{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header-inner img{
    height: 50px;
    padding-left: 20px;
}

/*
#menu-left{
    max-width: 300px;
}
#menu-left img{
    height: 50px;
    padding-left: 20px;
}
*/

/*Spacer to push content down*/
.menu-spacer{
    height: 110px;
    width: 100%;
    background-color: #fff;
}



.scrolled-down #site-header{
    height: 60px;
}




.menu-toggle{
    z-index: 1000;
}

@media screen and (max-width: 1023px){
    .menu-spacer{
        height: 70px;
    }
}


@media screen and (max-width: 1220px){
	ul#main-menu li {
		padding: 10px 5px !important;
	}
}


/*mobile menu*/
#mobile-menu{
    background-color: #fff;

    top: 70px;
    height: 100%;
    height: calc(100% - 70px);
    z-index: 2000;
}
#mobile-menu li{
    padding: 10px;
    padding-left: 20px;
}
#menu-main-menu{
    padding-top: 25px;
}
#menu-main-menu li{
    padding: 5px 20px;
}


.scrolled-down #mobile-menu{
    top: 60px;
    height: 100%;
    height: calc(100% - 60px);
}




/*
MEGA MENU
*/


.mega-menu{
    width: 100%;
    position: fixed;
    top: 110px;

    z-index: 900;
    display: none;

    transition: top 0.5s, max-height 0.5s;

    max-height: 80vh;
    max-height: calc(100vh - 210px); /*Override default for browsers that support calc, with 100px buffer zone so the mouse can still leave the menu */
    overflow-x: hidden;
    overflow-y: auto;

    font-size: 0.9rem;

    background-color: #eee;
}
.mega-menu.fixIE{
    width: 99.999%;
}
.mega-menu ul{
    list-style: none;
    margin: 0;
}
.scrolled-down .mega-menu{
    top: 60px;
    max-height: calc(100vh - 160px); /*Override default for browsers that support calc, with 100px buffer zone so the mouse can still leave the menu*/
}
.mega-menu.mega-active{
    /*display: flex;
    flex-direction: column;
    align-items: center;*/
    display: block;
}
.mega-menu .background{
    display: flex;
    width: 100%;
    flex-direction: row;
}
.mega-menu .background > .bg-left,
.mega-menu .background > .bg-right{
    flex: 1 0 1px;
    /*margin-bottom: 160px;*/
    position: relative;
}
.mega-menu .background > .bg-right{
    background-color: #fff;
}

.mega-menu .mega-content {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;

    list-style: none;
    margin: 0;

    width:100%; /*Slick.js Fix*/
}
.mega-menu .mega-content > li{

    margin: 0;
    float: none;
    width:auto;
}

#mega-menu-col-1{
    flex: 0 0 17%;
}
#mega-menu-col-1 > *{
    padding-left: 20px;
}
#mega-menu-col-1 .menu-mega-menu-col-1-container{
    overflow: auto;
    padding-top: 20px;
    font-weight: 600;
}

#mega-menu-col-1 .contact-detail{
    font-size: 0.85rem;
    margin-bottom: 5px;
}
#mega-menu-col-1 .contact-detail.top{
    margin-top: 30px;
}
#mega-menu-col-1 .contact-detail.bot{
    margin-bottom: 30px;
}
#mega-menu-col-1 .contact-detail span{
    color: #f00;
    font-weight: 600;
}
#mega-menu-col-1 .contact-detail a{
    color: #999;
}
#mega-menu-col-1 .contact-address{
    font-size: 0.85rem;
    color:#999
}


#mega-menu-col-2{
    flex: 0 0 31%;
    background-color: #fff;
}



#mega-menu-col-3{
    flex: 0 0 28%;
    background-color: #fff;
}

#mega-menu-col-3 > ul:last-of-type{
    padding-top: 0;
}


#mega-menu-col-4{
    flex: 0 0 24%;
    background-color: #fff;
    overflow:hidden;
}
#mega-menu-col-4 > .padding-wrapper{
    padding: 20px 0;
}



.mega-menu .mega-content .mega-menu-header{
    width: 100%;
    font-weight: 600;
    color: #DB211B;
}
.mega-menu .mega-content .mega-menu-list a{
    color: #999;
    font-size: 0.8rem;
}
.mega-menu .mega-content .mega-menu-list a:hover{
    color: #e74640;
}
.mega-menu .mega-content .mega-menu-list-section{
    padding: 20px 40px;
    overflow: auto;
}


.mega-menu .mega-legal{
    height: auto;
    width: 100%;

    background-color: #eee;
}
.mega-menu .mega-legal > .padding-wrapper{
    margin: auto;
    padding: 20px 0;
    overflow:auto;
}
.mega-menu .mega-legal .bn-logo{
    height: 30px;
    margin-bottom: 10px;
}
.mega-menu .mega-legal p{
    margin: 0;
    font-size: 0.8rem;
}

.mega-menu .mega-legal .legal-wrapper{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
.mega-menu .mega-legal .legal-wrapper .legal-left,
.mega-menu .mega-legal .legal-wrapper .legal-right{
    flex: 0 0 50%;
}
@media screen and (max-width: 1024px){
    .mega-menu{
        top: 70px;
    }
}

/*******************************************************************************
Menu
*******************************************************************************/

#menu-right{
    position: relative;
    right: 75px;
}


#main-menu{
    display: inline-block;
}

ul#main-menu{
    margin: 0;
    list-style: none;
}

ul#main-menu li{
    width: auto;
    display:inline-block;
    padding: 10px;
}
ul#main-menu li a{
    color: #333;
    font-weight: 600;

    transition: color 0.5s;
    text-decoration: none;
    text-transform: none;
    letter-spacing: 0px;
    font-size: 1rem;
    padding: 0px;
}
ul#main-menu li a:hover{
    color: #DB211B;
    text-decoration: none;
}



/* Fancy Menu slidey animation */
ul#main-menu li a{ position: relative }
ul#main-menu li a::after{
    content: ' ';
    display: inline-block;
    height: 3px;
    background-color: #DB211B;
    position: absolute;
    bottom: -5px;
    left: 2.5%;

    width: 0%;
    transition: width 1s;
}
ul#main-menu li.current_page_item a::after,
ul#main-menu li a:hover::after{
    width: 95%;
}


/*******************************************************************************
Menu - Social Icons
*******************************************************************************/
#social-wrapper{
    display: inline-block;
    margin-left: 10px;
    /*margin-right: 50px;*/
    margin-right: 10px;
}
#social-wrapper a{
    float: left;
    /*border: #333 2px solid;*/
    border-radius: 50%;
    margin-left: 10px;
    width: 30px;
    height: 30px;
    text-align: center;


}
#social-wrapper a:first-child{
    margin-left: 0;
}
#social-wrapper a i{
    font-size: 15px;
    color: #DB211B;
    line-height: 15px;

    position:relative;
    top: 0px;
    left: 1px;

    transition: color 0.5s;
}
.footer-social a:hover i,
#social-wrapper a:hover i{
    color: #333;
}

.footer-social{

}
.footer-social a{
    padding: 10px;
}
.footer-social a:first-child{
    padding-left: 0;
}


/*
MENU RESPONSIVE
*/
@media screen and (max-width: 1100px){
    #social-wrapper{
        margin-right: 60px;
        top: 2px;
        position: relative;
    }
    .menu-toggle {
        display: block;
        top: 35px;
    }
    .scrolled-down .menu-toggle{
        top: 15px;
    }
    ul#main-menu{
        display: none;
    }
    .products-mega-menu.mega-menu{
        display: none !important;
    }

}

@media screen and (max-width: 1023px){
    .menu-toggle {
        top: 15px;
    }
}

@media screen and (max-width: 500px){
    #social-wrapper{
        display: none;
    }
}





/*******************************************************************************
********************************************************************************
********************************************************************************
HOMEPAGE
********************************************************************************
********************************************************************************
*******************************************************************************/

.hero-wrapper{
    height: 600px;
    position:relative;
    overflow: hidden; /*hide squares overflow*/
}

.hero-wrapper .slide-holder,
.hero-wrapper .slide-holder > div,
.hero-wrapper .slide-holder > div > div,
.hero-wrapper .hero-holder, /*Styling for non sliding heros*/
.hero-wrapper .hero-inner,
.hero-wrapper .hero-inner > div{
    height: 100%;
}

.hero-holder,
.slide-holder{
    height: 100%;
    width:100%;
}

.hero-inner{
    position: relative;
    height: 100%;
    width: 100%;


}
.hero-holder .slide-holder .slick-slider{
    overflow:hidden
}


.hero-inner .slide-bg,
.hero-inner .slide-image-bg,
.hero-inner .slide-inner{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.hero-inner .slide-bg{
    background-color: #7f1310;
    z-index:1;
}
.hero-inner .slide-image-bg{
    filter: grayscale(50%);
    opacity: 0.25;
    z-index: 2;
    background-size: cover;
    background-position: center;
}

.slide-image-behind .slide-bg{
    opacity: .75;
    z-index: 1;
    background-color: #a51212;
}
.slide-image-behind .slide-image-bg{
    opacity: 1;
    filter: none;
    z-index: 1;
}

.hero-inner .slide-inner{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    color: #fff;
    z-index:3;
    height:100%;
}
.hero-inner .slide-inner > div{
    flex-shrink: 0;
    flex-grow: 1;
    flex-basis: 50%;
}

.hero-inner .slide-inner h1{
    color: #fff;
    font-size: 4em;
    font-weight: 600;
    margin-bottom: 1rem;
}
.hero-inner .slide-inner a.bn-button{
    margin-left: 3px;
}

.hero-inner .slide-inner .right > *:first-child{position:relative;}
.hero-inner .slide-inner .right > *:first-child::before{
    content: ' ';
    display: inline-block;
    height: 3px;
    background-color: #fff;
    position: absolute;
    top: -1rem;
    width: 110px;
}
.hero-inner .slide-inner .right *{
    font-size: 1.5rem;
    line-height: 1.7rem;
}




/*IE Tweaks*/





@media screen and (max-width: 700px){
    .hero-wrapper{
        height: 500px;
    }
    .hero-wrapper.no-hero-content{
        height: 60vh;
    }
    .hero-inner .slide-inner{
        flex-direction: column;
    }
    .hero-inner .slide-inner h1{
        font-size: 2rem;
    }
    .hero-inner .slide-inner .left{
        margin-bottom: 80px;
        text-align: center;

    }
    .hero-wrapper.no-hero-content .hero-inner .slide-inner .left{
        margin-bottom: 0;
    }
    .hero-inner .slide-inner a.bn-button{
        margin-left: auto;
        margin-right: auto;
        float: none;
    }
    .hero-inner .slide-inner .right *{
        font-size: 1.1rem;
        line-height: 1.3rem;
    }

    .hero-inner .slide-inner{
        justify-content: center;
    }
    .hero-inner .slide-inner > div {
        flex-grow: 0;
        width: 100%;
        flex-basis: auto;
    }
}
/*******************************************************************************
********************************************************************************
********************************************************************************
ABOUT
********************************************************************************
********************************************************************************
*******************************************************************************/
.footer-contact{
    padding: 0 40px;
}
#intro-text{
    color: #333;
    /*Use hp-small instead*/
}

#intro-text .wrapper{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: stretch;
}
#intro-text .wrapper > *{
    flex-grow:1;
    flex-basis: 50%;
    flex-shrink: 0;

}
#intro-text .left p:last-child,
#intro-text .right p:last-child{
    margin-bottom: 0;
}

#intro-text .left p:first-child {
    color: #DB211B;
    font-weight: 600;
}


@media screen and (max-width: 700px){
    #intro-text .wrapper{
        flex-wrap: wrap;

    }
    #intro-text .wrapper > *{
        flex: 1 1 100%;
        padding-left: 0;
        padding-right: 0;
    }
}


#timeline-container{
    position:relative;
}
#timeline-container .timeline-bar{
    background-color: #f50800;
    height: 100%;
    position: absolute;
    top: 0;
    width: 80px;
    opacity: 1;
    left: calc(50% - 40px);
}
#timeline-container .timeline-row{
    display: flex;
    flex-direction: row-reverse;
    width: 100%;
    height: auto; /*+80 to compensate for padding!*/
	justify-content: space-between;
}
#timeline-container .timeline-row:nth-child(2n+1){
    flex-direction: row;
}

#timeline-container .timeline-row .content-text{
    flex-basis: 35%;
    flex-grow: 0;
    flex-shrink: 0;
    position:relative;
}
#timeline-container .timeline-row .content-text .numerator{
    position: relative;
    margin-bottom: 20px;
}
#timeline-container .timeline-row .content-text .numerator::before{
    content: ' ';
    display: inline-block;
    width: 100px;
    height: 16px;
    background-color: #DB211B;
}
#timeline-container .timeline-row .content-text .numerator span{
    font-size: 20px;
    line-height: 20px;
    padding: 0;
    padding-left: 0px;
    margin: 0;
    padding-left: 5px;
    position: relative;
    bottom: 1px;
    color: #DB211B;
}
#timeline-container .timeline-row .content-image{
    flex-basis: 35%;
    flex-grow: 0;
    flex-shrink: 0;
}

#timeline-container .timeline-row .content-image > img{
	/*max-width: 500px;*/
	max-width: 100%;
}

#timeline-container .timeline-row{

}

/*parallax*/
#timeline-container.bg-geometric-para > .bg-canvas{
    height: 95%;
    top: -20vh;
}

@media screen and (max-width: 700px){
    #timeline-container .timeline-bar{
        left: auto;
        right: 10px;
        width: 40px;
    }
    #timeline-container .timeline-row{
        flex-wrap: wrap;
    }
    #timeline-container .timeline-row .content-text .wrapper{
        padding-right: 40px;
        padding-bottom: 40px;
    }
    #timeline-container .timeline-row .content-text,
    #timeline-container .timeline-row .content-image{
        flex: 1 1 100%;
    }
    #timeline-container .timeline-row .content-image{
        padding-top: 10px;
    }
    #timeline-container .timeline-row .content-image > img{
        max-width: 100%;
        width: 100%;
    }
}


/*******************************************************************************
********************************************************************************
********************************************************************************
TEAM PAGE
********************************************************************************
********************************************************************************
*******************************************************************************/

.page-template-template-team #team-full .team-member-card{
}





.team-card-container{
    display: flex;
    flex-direction: row;
}
.team-card-container.all{
    flex-wrap:wrap;
}
.team-card-container.all > .team-member-card{
    flex-basis: 240px;
    flex-grow: 1;
    flex-shrink: 0;
}

@media screen and (min-width: 1100px){
    .team-card-container.all > .team-member-card{
        flex-basis: 20%;
        flex-grow: 0;
    }
}


/*******************************************************************************
********************************************************************************
********************************************************************************
BLOG PAGE
********************************************************************************
********************************************************************************
*******************************************************************************/

/*Blog Page*/


.blog-title{
    padding-top: 10px;
    margin-bottom: 0;
}



.blog-top > div{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}
.blog-top > div > .left{
    /*flex: 0 0 59%;*/
    flex: 0 0 100%;
    min-height: 500px;
}
.blog-top > div > .right{
    flex: 0 0 39%;
}
@media screen and (max-width: 900px){
    .blog-top > div > .left{
        flex-basis: 100%;
        padding-bottom: 20px;
    }
    .blog-top > div > .right{
        flex-basis: 100%;
    }
}


.blog-featured{

}
/*Responsivise*/
/*
.article-thumbnail-container article.featured:nth-child(2n+1) > .padding-wrapper{
    padding-right: 10px;
}
.article-thumbnail-container article.featured:nth-child(2n) > .padding-wrapper{
    padding-left: 10px;
}
*/
@media screen and (max-width: 900px){
    /*
    .article-thumbnail-container article.featured:nth-child(2n+1) > .padding-wrapper,
    .blog-featured article.featured:nth-child(2n+1) > .padding-wrapper{
        padding-right: 0px;
    }
    .article-thumbnail-container article.featured:nth-child(2n) > .padding-wrapper,
    .blog-featured article.featured:nth-child(2n) > .padding-wrapper{
        padding-left: 0px;
    }
    .blog-featured article.featured{
        flex: 0 0 100%;
        padding: 10px 0; /*!important;*//*
    }
    */
}

.blog-categories{

}

.blog-categories .category-title{
    color: #fff;
}
.blog-categories .category-title.red-bar::before{
    top: -20px;
    left: 2px;
}


article.blog{
    color: #DB211B;
}
article.blog .padding-wrapper{
    display: flex;
    flex-direction: row;
    height: 100%;
}
article.blog .left{
    flex: 1 1 55%;
    display: flex;
}
article.blog .left .blank-link{
    display: flex;
    width: 100%;
}
article.blog .left .image-container{
    display: flex;
    width: 100%;
}
article.blog .left .image-container .image-canvas{
    width: 100%;
    background-position: center;
    background-size: cover;
}
article.blog .right{
    flex: 10 0 45%;
}
article.blog .right > .padding-wrapper{


    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;

}
article.blog .right .top{
}
article.blog .right .top p{
    color: #333;
}
article.blog .right .bottom{

    display: flex;
    justify-content: center;
    flex-direction: row;

    margin-top: auto;
    margin-bottom: 0;
    color: #333;
}

@media screen and (max-width: 700px){

}


/*Big article*/
article.big{
    height: 100%;
}




.article-thumbnail-container{
    display: flex;
    flex-direction: row;
    flex-wrap:wrap;
    justify-content: space-between;
    width: 100%;
}

article.featured{
    flex: 0 0 49%;
    /*height: 300px;*/
    min-height: 300px;
}
@media screen and (max-width: 1000px){
    article.featured{
        flex: 0 0 100%;
    }
}

article.featured > .padding-wrapper{

}

article.featured .left{

}
article.featured .right{

}
article.featured h3{
    font-size: 1.3rem;
}

article.blog .image-canvas{
    position: relative;
    overflow: hidden
}
article.blog .image-canvas::before{
    display: block;
    content: ' ';
    width: 100%;
    height:100%;
    position: absolute;
    left: -100%;
    right: 0;

    background-color: #DB211B;
    opacity: 0.7;

    transition: left 1s ease, opacity 1s ease-in;

}
article.blog:hover .image-canvas::before{
    left: 0;
    opacity: 0.2;
}

article.blog .right{
    transition: background-color 1s;
}
article.blog:hover .right{
    background-color: #ddd;
}
/*ie fixes*/
.iefix-wrapper{
    width: 100%;
    height: 100%;
}




/*List of articles..*/
.blog.list{

}
.blog.list >div{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /*height: 450px;*/
}
.blog.list .list-item{
    width: 100%;

    display: flex;
    justify-content: space-between;
    flex-direction: column;
}
.blog.list .list-item .title{
    line-height: 1.5rem;
}
.blog.list .list-item .title a{
    font-size: 1.5rem;
    color: #DB211B;
}
.blog.list .list-item .title a:hover{
    text-decoration: none;
}
.blog.list .list-item .meta{
    margin-top: 10px;
    margin-bottom: 20px;
}
.blog.list .list-item .meta span{
    /*font-size: 0.8rem;/**/
    /*color: #DB211B;/**/
}




.article-thumbnail-container.default{
    justify-content: space-between;
}
article.default{
    /*flex: 1 0 300px;*/
    flex: 0 0 33.33%;
}
article.default > div{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-left: 10px;
    padding-right: 10px;
}
article.default:first-child > div{
	padding-left: 0;
}
article.default:last-child > div{
	padding-right: 0;	
}
article.default .image-container{
    height: 200px;
    width: 100%;
}
article.default .image-container .image-canvas{
    height: 100%;
    width: 100%;
    background-position: center;
    background-size: cover;
}
article.default .title{
    font-size: 1.3rem;
}
article.default p{
	font-size: 1rem;
	font-weight: 300;
	color: #333;
}
article.default .bottom{
    margin-top: auto;
    border-bottom: 3px solid #DB211B;
    padding-bottom: 10px;

}
article.default .bottom span{
    font-size: 0.9rem;
    line-height: 1.1rem;

    /*color: #DB211B;*/
    padding-bottom: 5px;
}


article.default .image-canvas{
    position: relative;
    overflow: hidden
}
article.default .image-canvas::before{
    display: block;
    content: ' ';
    width: 100%;
    height:100%;
    position: absolute;
    left: -100%;
    right: 0;

    background-color: #DB211B;
    opacity: 0.7;

    transition: left 1s ease, opacity 1s ease-in;

}
article.default:hover .image-canvas::before{
    left: 0;
    opacity: 0.2;
}

article.default .blank-link{
    padding-top: 10px;
}

@media screen and (max-width: 1200px){
    article.default{
        flex: 0 0 50%;
    }
}
@media screen and (max-width: 800px){
    article.default{
        flex-basis: 100%;
    }


    article.featured{
        flex-basis: 100%;
    }

    .article-thumbnail-container article.featured:nth-child(2n+1) > .padding-wrapper,
    .article-thumbnail-container article.featured:nth-child(2n) > .padding-wrapper{
        padding-left: 0;
        padding-right: 0;
    }
}
@media screen and (max-width: 600px){
    article.blog > .padding-wrapper{
        flex-direction: column;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    article.blog > .padding-wrapper > .left,
    article.blog > .padding-wrapper > .right{
        flex-basis: auto;
    }

    article.blog > .padding-wrapper > .left{
        height: 300px;
    }
    article.blog > .padding-wrapper > .right > .padding-wrapper{
        height: auto;
    }/**/
    article.blog .right .bottom{
        justify-content: flex-start;
    }
    article.blog.big {
        height: auto;
    }
}

/*Category Tweaks*/
#post-archive-container{
    display: flex;
    flex-direction: row;
}

#post-archive{
    flex-basis: 250px;
    flex-shrink: 0;
    flex-grow: 0;
    padding-top: 25px; /*Equalize with the product thumbnails*/
}
#post-index-category{
    flex-basis:75%;
    flex-shrink: 1;
    flex-grow: 1;
}

#post-sidebar{

}
#post-sidebar h1{
    color: #DB211B;
}
#post-sidebar ul{
    list-style: none;
    margin: 0;
}
#post-sidebar a{
    color: #DB211B;
}



/*******************************************************************************
********************************************************************************
********************************************************************************
Contact
********************************************************************************
********************************************************************************
*******************************************************************************/



.contact .map-wrapper iframe{
    width: 100%;
    height: 350px;
    float: left;
}
.footer-contact .left,
.contact .address .left{
    color: #333;
    flex: 50%
}
.footer-contact .right,
.contact .address .right{
    flex: 50%
}
.footer-contact.left a,
.contact .address .left a{
    color: #DB211B;
}
.footer-contact .left .red-bar,
.contact .address .left .red-bar{
    padding-top: 20px;
}

.footer-contact .left .wrapper > *{
    padding-right: 10px;
}

@media screen and (max-width: 700px){
    .contact .address .center-split,
    .footer-contact .center-split{
        flex-wrap: wrap;
    }
    .contact .address .left,
    .contact .address .right,
    .footer-contact .center-split .left,
    .footer-contact .center-split .right{
        flex: 0 0 100%;
    }
}

/*******************************************************************************
********************************************************************************
********************************************************************************
Blog Single
********************************************************************************
********************************************************************************
*******************************************************************************/

.blog-single-page{
    display: flex;
    flex-direction: row;
}
.blog-single-page .page-left{
    flex: 0 0 70%;
}
.blog-single-page .page-right{
    flex: 0 0 30%;
}
.blog-single-page .page-left > .padding-wrapper{
    padding-left: 20px;
    padding-right: 10px;
}

.blog-single-page .page-right > .padding-wrapper{
    padding-left: 10px;
    padding-right: 20px;
}

.blog-single-page .related-articles{
    display: flex;
    flex-direction: column;
	flex-wrap: wrap;
}
.blog-single-page .related-articles h3{
    font-size: 1.5rem;
    padding-top: 20px;
}
.blog-single-page .related-articles article{
}

@media screen and (max-width: 950px){
    .blog-single-page{
        flex-direction: column;
    }
    .blog-single-page .page-left{
        flex: auto;
        width: 100%
    }
    .blog-single-page .page-right{
        flex: auto;
        width: 100%;
    }
    .blog-single-page .related-articles{
        flex-direction: row;
    }
	.blog-single-page .related-articles > .title{
		width: 100%;
	}
	
	.blog-single-page .related-articles > article{
		flex: 0 0 33.33%
	}
	.blog-single-page .related-articles > article:nth-child(2) > .padding-wrapper{
		padding-left: 0;
	}
	.blog-single-page .related-articles > article:nth-child(4) > .padding-wrapper{
		padding-right: 0;
	}
	
	.blog-single-page .page-left > .padding-wrapper{
		padding-left: 40px;
		padding-right: 40px;
	}

	.blog-single-page .page-right > .padding-wrapper{
		padding-left: 40px;
		padding-right: 40px;
	}
}
/*******************************************************************************
********************************************************************************
********************************************************************************
FOOTER
********************************************************************************
********************************************************************************
*******************************************************************************/
/*
#site-footer{

}
#site-footer .footer-wrapper *{
    color: #DB211B;
}

.footer-wrapper{
    display: flex;
    width: 100%;
    flex-direction: row;
    justify-content: space-between;
    margin: auto;
}

.footer-wrapper .footer-column{
    width: 25%;
    position:relative;
    margin-top: 80px
}
.footer-wrapper .footer-column::before{
    content: ' ';
    display: inline-block;
    height: 3px;
    background-color: #DB211B;
    position: absolute;
    top: -25px;
    left: 0;
    width: 50%;

}


@media screen and (max-width: 700px){
    .footer-wrapper{
        flex-wrap: wrap;
    }
    .footer-wrapper .footer-column{
        flex: 1 1 50%;
    }
}

@media screen and (max-width: 480px){
    .footer-wrapper .footer-column{
        flex: 1 1 100%;
    }
}



#footer-legal{
    text-align: center;
    color: #888;
}


#partner-logos{
    text-align: center;
}
#partner-logos > div {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
#partner-logos > div > * {
    padding: 10px;
}
*/
#site-footer{
    border-top: #f00 3px solid;
    font-size: 0.9rem;
    color: #777;
}
#site-footer p{
    font-size: 0.9rem;
}
#site-footer a{
    float: none;
}


.footer-main{
    display: flex;
    flex-direction: row;
    justify-content: space-between;

}

.footer-main > div{
    flex: 0 0 24%;
}

.footer-main .footer-col-1{
    flex: 0 0 20%;
}
.footer-main .footer-col-2{
    flex: 0 0 30%;
}
.footer-main .footer-col-3{
    flex: 0 0 25%;
}
.footer-main .footer-col-4{
    flex: 0 0 25%;
}















/*menu col*/
.footer-main .footer-col-1{

}
.footer-main .footer-col-1 a{
    color: #777;
}

/*contact col*/
.footer-main .footer-col-2{

}
.footer-main .footer-col-2 a{
    color: #777;
}

/*social col*/
.footer-main .footer-col-2{

}


/*bn logos col*/
.footer-col-3 .logos{
    flex: 0 0 25%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
    height: auto;
    padding-bottom: 20px;
}
#site-footer .footer-col-3 .logos a{
    float: right;
    transition: opacity 0.5;
    padding: 5px;
}
#site-footer .footer-col-3 .logos a:first-child{
    padding-left: 0;
}
#site-footer .footer-col-3 .logos a:hover{
    opacity: 0.75;
}


.footer-col-3 .logos img{
    height: 50px;
    width: auto;
    max-height: none;
    max-width: none;
}


.footer-main .footer-col-3 .diamond-social-icons{
    justify-content: flex-start;
}
.footer-main .footer-col-3 .diamond-social-icons a{
    color: #fff;
}
.footer-main .footer-col-3 .diamond-social-icons a:first-child{
    margin-left: 7px;
}

/*logo col*/
.footer-main .footer-col-4{

}
.footer-main .footer-col-4 img{
    max-width: 150px;
    height: auto;
}
.footer-main .footer-col-4 a{
    color: #777;
}







.footer-legal{
 display: flex;
}
.footer-legal .legalese{
    flex: 0 0 100%;
    text-align: center;
}




@media screen and (max-width: 900px){
    .footer-main{
        flex-wrap: wrap;
    }
    .footer-main .footer-col-1,
    .footer-main .footer-col-2,
    .footer-main .footer-col-3,
    .footer-main .footer-col-4{
        padding: 20px 0;
    }
    .footer-main .footer-col-1{
        flex: 0 0 50%;
    }
    .footer-main .footer-col-1 img{
        padding-left: 20px;
    }
    .footer-main .footer-col-2{
        flex: 0 0 50%;
    }
    .footer-main .footer-col-3{
        flex: 0 0 50%;
    }
    .footer-main .footer-col-4{
        flex: 0 0 50%;
    }
	.footer-main .hp-tiny{
		padding: 0;
	}
}

@media screen and (max-width: 530px){
    .footer-main .footer-col-1,
    .footer-main .footer-col-2,
    .footer-main .footer-col-3,
    .footer-main .footer-col-4{
        flex: 0 0 100%;
    }
}



#site-footer ul{
    height: auto;
	column-count: 2;
    /*display: flex;
	flex-wrap: wrap;
    flex-direction: column;*/

}
#site-footer ul li{
    width:100%;
	/*width: auto;*/
}

/*******************************************************************************
********************************************************************************
********************************************************************************
Reusables
********************************************************************************
********************************************************************************
*******************************************************************************/

/*******************************************************************************
full-width-image-bar
*******************************************************************************/
.full-width-image-bar{
    display:flex;
    flex-direction: row;
    width:100%;

    background-position: center;
    background-size: cover;

    position: relative;
}
.full-width-image-bar::before{
    display: block;
    content: ' ';

    position: absolute;
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;

    background-color: #000;
    opacity: 0.3;
}
.full-width-image-bar > div{
    width: 100%;
    z-index:1
}
.full-width-image-bar .wrapper{
    height: 500px;
    display: flex;
    width: 50%;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
}
.full-width-image-bar.right .wrapper{
    float:right;
}
.full-width-image-bar .wrapper > *{
    color: #fff;
}
.full-width-image-bar .wrapper .bn-button{
    margin-top: 10px;
}

.full-width-image-bar .wrapper > *:first-child{position:relative;}
.full-width-image-bar .wrapper > *:first-child::before{
    content: ' ';
    display: inline-block;
    width: 120px;
    background-color: #DB211B;
    height: 3px;
    position: absolute;
    top: -15px;
    left: 0px;
}

@media screen and (max-width: 700px){
    .full-width-image-bar .wrapper{
        width: 100%;
        float: left;
        padding-left: 40px;
        padding-right: 40px;
    }
}
/*//////////////////////////////////////////////////////////////////////////////
/full-width-image-bar
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
Splitsection - Diamond
*******************************************************************************/
.splitsection-diamond{
    display: flex;
    margin: 0 auto;
    flex-direction: row;
}


.splitsection-diamond h1,
.splitsection-diamond h2,
.splitsection-diamond h3,
.splitsection-diamond h4,
.splitsection-diamond h5,
.splitsection-diamond h6{
    color: #333;
}


.splitsection-diamond .text-wrapper{
    flex: 1 0 40%;
    color: #DB211B;
}
.splitsection-diamond .text-wrapper > *:first-child{
    position: relative;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.splitsection-diamond .text-wrapper > *:first-child::before{
    content: ' ';
    display: inline-block;
    height: 3px;
    background-color: #DB211B;
    position: absolute;
    top: -1rem;
    width: 100px;
    left: .1rem;
}
.splitsection-diamond .diamond-bounding-box{
    flex: 0 0 auto;
    width: 300px;
}
.splitsection-diamond .image-wrapper{
    width: 200px;
    height: 200px;
    overflow:hidden;
    transform:rotateZ(45deg);

    position: relative;
}
.splitsection-diamond .image-wrapper .image-canvas{
    transform:rotateZ(-45deg);
    background-position: center;
    background-size: cover;

    position:absolute;
    top:    -100px;
    left:   -100px;
    right:  -100px;
    bottom: -100px;
}

@media screen and (max-width: 700px){
    .diamond-bounding-box{
        display: none;
    }
}

/*//////////////////////////////////////////////////////////////////////////////
/Splitsection Diamond
//////////////////////////////////////////////////////////////////////////////*/

/*******************************************************************************
Split Image CTAs
*******************************************************************************/

.image-cta-wrapper{
    display:flex;
    flex-direction: row;
    width:100%;

}
.image-cta-wrapper .image-cta{
    flex: 1 0 200px;
    height: 600px;
    background-position: center;
    background-size: cover;
    position:relative;

}
/*Hover overlay*/
.image-cta-wrapper .image-cta::before{
    content: ' ';

    top:    0;
    bottom: 0;
    left:   0;
    right:  0;
    position:absolute;

    background-color: #000;
    opacity: 0.4;

    transition: opacity 1s, background-color 1s;
}
.image-cta-wrapper .image-cta:hover::before{
    background-color: #DB211B;
    opacity: 0.75;
}

/*add fun red bar to first element in the cta*/
.image-cta-wrapper .image-cta > *:first-child{
    position: relative;
    color: #fff;
}
.image-cta-wrapper .image-cta > *:first-child::before{
    content: ' ';
    display: inline-block;
    height: 3px;
    background-color: #DB211B;
    position: absolute;
    top: -1rem;
    width: 100px;
    left: .1rem;
}


@media screen and (max-width: 700px){
    .image-cta-wrapper{
        flex-direction: column;
    }
    .image-cta-wrapper .image-cta{
        width: 100%;
        flex-basis: 300px;
        margin-bottom: 10px;
    }
    .image-cta-wrapper .image-cta:last-child{
        margin-bottom: 0px;
    }
}
/*//////////////////////////////////////////////////////////////////////////////
/Split Image CTA
//////////////////////////////////////////////////////////////////////////////*/

/*******************************************************************************
Buttons
*******************************************************************************/

.bn-button{
    display: inline-block;
    float:left;
}

/*styles*/

.bn-button.rounded{
    border: 1px solid;
    border-radius: 17px !important;
    padding: 8px 20px;
    font-size: 16px;
    line-height: 16px;
    font-weight: 600;
    min-width: 140px;
    text-align: center;
}


/*colors*/

/*red text, hover bg red*/
a.bn-button.c-primary,
.bn-button.c-primary{
    color: #fff;
    background-color: #DB211B;
    /*border-color: #333;*/
    border: 0px;
    transition: color 0.5s, background-color 0.5s;
}
a.bn-button.c-primary:hover,
.bn-button.c-primary:hover{
    color: #DB211B;
    background-color: #ddd;
    text-decoration: none;
}

/*white>red text, invis>white bg*/
a.bn-button.c-transparent,
.bn-button.c-transparent{
    color: #fff;
    background-color: transparent;
    border-color: #fff;
    transition: color 0.5s, background-color 0.5s;
}
a.bn-button.c-transparent:hover,
.bn-button.c-transparent:hover{
    color: #DB211B;
    background-color: #fff;
    text-decoration: none;
}


/*//////////////////////////////////////////////////////////////////////////////
/Buttons
//////////////////////////////////////////////////////////////////////////////*/

/*******************************************************************************
Slideup Image Section
*******************************************************************************/

.slideup-image-section{
    display: flex;
    width: 100%;
}
.slideup-image-section .wrapper{
    flex-grow: 1;
    flex-basis: 0;

    background-position:center;
    background-size: cover;
    height:600px;

    display: flex;
    justify-content: flex-end;
    flex-direction: column;

    position: relative;
    z-index: 0;
}
.slideup-image-section .wrapper::before{
    position:absolute;
    content: ' ';
    display: block;

    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    z-index: -1;
    background-color: rgba(0,0,0,0.4);
}

.slideup-image-section .wrapper > *:first-child{
    position:relative;
    z-index: 2;
}
.slideup-image-section .wrapper > *:first-child::before{
    content: ' ';
    display: inline-block;
    height: 3px;
    background-color: #DB211B;
    position: absolute;
    top: -1rem;
    width: 100px;
    left: .1rem;
}

.slideup-image-section .wrapper > *:first-child,
.slideup-image-section .wrapper .content *{
    color: #fff;
}
.slideup-image-section .wrapper > * {
    z-index: 1;
}

.slideup-image-section .wrapper .content{
    height: 0px;
    opacity: 0;
    transition: height 1s, opacity 1.2s;
    overflow: hidden;
}
.slideup-image-section .wrapper:hover .content{
    height: 250px;
    opacity: 1;
}

@media screen and (max-width: 700px){
    .slideup-image-section{
        flex-direction: column;
    }
    .slideup-image-section .wrapper{
        height: auto;
        flex-basis:auto;
        flex-grow: 1;
        justify-content: flex-start;
    }
    .slideup-image-section .wrapper .content{
        height: auto;
        opacity: 1
    }
    .slideup-image-section .wrapper:hover .content{
        height: auto;
    }
}
/*//////////////////////////////////////////////////////////////////////////////
/Slideup Image Section
//////////////////////////////////////////////////////////////////////////////*/

/*******************************************************************************
Team Slider
*******************************************************************************/
.team-slider{

}
.team-slider .slick-track{
    height: 100%;
}
.team-slider .slick-list{
    height: 100%;
}

.team-card-container,
.team-slider .team-card-slider{
    display: flex;
    flex-direction: row;

    height: 400px;


}

.team-slider .team-member-card,
.team-card-container .team-member-card{
    position: relative;
    flex-grow: 1;
    flex-basis: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.team-slider .team-member-card > .padding-wrapper,
.team-card-container .team-member-card > .padding-wrapper{
    padding: 40px;
	/*padding-bottom: 40px;*/
	padding-bottom: 100px;
	transition: all 1s;
}

.team-card-container .team-member-card:hover > .padding-wrapper,
.team-slider .team-member-card:hover > .padding-wrapper{
	padding-bottom: 40px;
}

.team-member-card .bg-image{
    background-position: center;
    background-size: cover;
    position:absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    filter:grayscale(95%);
}

.team-card-container .team-member-card .wrapper::before,
.team-slider .team-member-card .wrapper::before{
    position:absolute;
    content: ' ';
    display: block;

    /*top: 0px;*/
    left: 0px;
    bottom: 0px;
    right: 0px;

    background-color: #000;
    opacity: 0.2;
    transition: opacity 1s, background-color 1s;
    z-index: 0;
	
	/* ADDED 24-3-2022 WHEN CHANGING TO CIRCULAR TEAM IMAGES */
	padding-top: 100%;
    height: 0;
    top: 50%;
    transform: translateY(-50%);
	border-radius: 50%;
}

.team-card-container .team-member-card .wrapper .content,
.team-slider .team-member-card .wrapper .content{
    z-index: 1;
    position:relative;
}
.team-card-container .team-member-card:hover .wrapper::before,
.team-slider .team-member-card:hover .wrapper::before{
    background-color: #DB211B;
    opacity: 0.6;
}
.team-card-container .team-member-card .wrapper,
.team-slider .team-member-card .wrapper{

}



.team-slider .team-member-card h3,
.team-card-container .team-member-card h3{
	font-size: 1.5rem;
}

.team-card-container .team-member-card .wrapper > *:first-child,
.team-slider .team-member-card .wrapper > *:first-child{
    position: relative;
}
.team-card-container .team-member-card .wrapper > *:first-child::before,
.team-slider .team-member-card .wrapper > *:first-child::before{
    content: ' ';
    display: inline-block;
    height: 3px;
    background-color: #DB211B;
    position: absolute;
    top: -1rem;
    width: 100px;
    left: .1rem;

    transition: background-color 1s;
}
.team-card-container .team-member-card:hover .wrapper > *:first-child::before,
.team-slider .team-member-card:hover .wrapper > *:first-child::before{
    background-color: #fff;
}
.team-card-container .team-member-card .wrapper > *:first-child,
.team-card-container .team-member-card .wrapper > .content *,
.team-slider .team-member-card .wrapper > *:first-child,
.team-slider .team-member-card .wrapper > .content * {
    color: #fff;
}

.team-card-container .team-member-card .wrapper .content,
.team-slider .team-member-card .wrapper .content{
    width: 100%;
    height: 0px;

    opacity: 0;
    transition: opacity 1.2s, height 1s;
    overflow: hidden;
	
	
}
.team-card-container .team-member-card:hover .wrapper .content,
.team-slider .team-member-card:hover .wrapper .content{
    height: 200px;
    opacity: 1;
}

.team-card-container .team-member-card .wrapper .content p,
.team-slider .team-member-card .wrapper .content p{
	font-size: 0.9rem;
}



.team-slider .progress-area{
    display: flex;
    justify-content: space-around;
}
.team-slider .progress-area .progress-text{
    width: 255px;
    flex-grow: 0;
    flex-shrink: 0;
}
.team-slider .progress-area .progress-text p{
    margin: 0;
}
.team-slider .progress-area .wrapper{
    flex-grow:1
}
.team-slider .progress-area .progress-button{
    width: 101px; /*255px; APfix*/
    flex-grow: 0;
    flex-shrink: 0;
}
@media screen and (max-width: 700px){
	.team-slider .progress-area .progress-button{
		width: auto;
	}
}

.touch .team-slider .progress-area .progress-text .touch-text,
.team-slider .progress-area .progress-text .notouch-text{
    display: inline;
}
.touch .team-slider .progress-area .progress-text .notouch-text,
.team-slider .progress-area .progress-text .touch-text{
    display: none;
}
/*team slider progress thing*/

.team-slider .progress-area{
    display: flex;
    flex-direction: row;
    align-items: center;
}
.team-slider .progress-area .wrapper{
    padding: 0 40px;
    width: 100%;
}
.team-slider .progress-display{
    position: relative;
	width: 100%;
}
.team-slider .progress-display #team-slider-range{
	width: 100%;
	transform: rotateZ(180deg);
}
/*team card container tweaks*/
.team-card-container{
    height: auto;
}
.team-card-container .team-member-card{
    height: 400px;
}
.team-card-container.modal-popups .team-member-card{
    cursor: pointer;
}




.slick-track{
}



@media screen and (max-width: 700px){
    .team-slider #progress-area > * {
        flex-grow: 0;
        flex-basis: auto;
    }
    .team-slider .progress-area{
        flex-direction: column;
        justify-content: space-between;
        height: 200px;
    }
    .team-slider .progress-text{
        text-align: center;
    }


    .team-card-container .team-member-card .wrapper .content,
    .team-slider .team-member-card .wrapper .content{
        height: auto;
        opacity: 1;
    }
    .team-card-container .team-member-card:hover .wrapper .content,
    .team-slider .team-member-card:hover .wrapper .content{
        height: auto;
    }
}
/*//////////////////////////////////////////////////////////////////////////////
/Team Slider
//////////////////////////////////////////////////////////////////////////////*/

/*******************************************************************************
Newsletter Signup Bar
*******************************************************************************/
.newsletter-signup{

}
.newsletter-signup .newsletter-fields{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
.newsletter-signup .text{
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: auto;
    color: #DB211B;
    font-size: 22px;

}
.newsletter-signup .newsletter-email{
    flex-basis: 300px;
    flex-shrink: 0;
    flex-grow: 1;
    padding: 0 20px;
}
.newsletter-signup .newsletter-email .wpcf7-email{
    border: none;
    background: transparent;
    margin: 0;
    border-bottom: #DB211B solid 1px;
    padding: 0px;
}
.newsletter-signup .newsletter-email .wpcf7-email::placeholder
.newsletter-signup .newsletter-email .wpcf7-email:-ms-input-placeholder {
    color: #e74640;
    opacity: 0.5;
}
.newsletter-signup .wpcf7-submit{
    margin: 0;
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: auto;
}
div.wpcf7 .ajax-loader{
    display: none;
}

@media screen and (max-width: 700px){
    .newsletter-signup .newsletter-fields{
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        height: 150px;
    }
    .newsletter-signup .newsletter-fields > *{
        flex-grow: 0;
        flex-basis: auto;
        flex-shrink: 0;
    }
    .newsletter-signup .your-email{
    }

    .newsletter-signup .text{
        text-align: center;
    }
}
/*//////////////////////////////////////////////////////////////////////////////
/Newsletter Signup Bar
//////////////////////////////////////////////////////////////////////////////*/

/*******************************************************************************
Backgrounds
*******************************************************************************/

/*OFFWHITE TRANSPARENT*/

.bg-offwhite{
    background-color: rgba(238, 238, 238, 0.7);
}



/*GEOMETRIC*/

.bg-geometric{
    position: relative;
}
.bg-geometric-para{
    position: relative;
    overflow: hidden;
}


.bg-geometric::before,
.bg-geometric-para > .bg-canvas{
    position: absolute;

    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: -1;

    background-image: url('/wp-content/themes/bn/img/assets/gplaypattern.png');
    opacity: 1; /*0.7;*/
}
.bg-geometric::before{
    content: ' ';
    display: block;
}
.bg-geometric-para > .bg-canvas{
    height: 300%;
    top: -100%;
}


/*GEOMETRIC PARALLAX SUPPORT*/

/*
.parallax-container.bg-geometric::before{
    content: '';
    display: none;
}
.parallax-container.bg-geometric > .bg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -1;
    transform: translateZ(-2px) scale(3);
    background-image: url('/wp-content/themes/bn/img/assets/gplaypattern.png');
}
*/


/*PARALLAX FUN*/
/*
.parallax-container{
    perspective: 1px;
    transform-style: preserve-3d;
    height: 100vh;
    overflow-x: hidden;
    overflow-y: scroll;
}
.parallax-group{
    flex: 1 0 auto;
    position: relative;
    height: 100vh;
    z-index: -1;
}
.parallax-none{
    display: block;
    position: relative;
    background-color: white;
    z-index: 1;
}


.parallax-container .p-back{
    transform: translateZ(-1px) scale(2);
}
.parallax-container .p-deep_back{
    transform: translateZ(-2px) scale(3);
}
*/

/*
Parallax Depth Correction:
Scale(x) where
x = 1 + (translateZ * -1) / perspective
*/










/* SQUAREZ */

.bg-squares{
    position: relative;
}
.bg-squares > .bg-canvas{
    position: absolute;

    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: -1;
}

.bg-squares > .bg-canvas{
    background-size: cover;
    background-position: center;
    background-image: url('/wp-content/uploads/2018/06/Home-Page-Pattern.png');
}
.bg-squares.flip > .bg-canvas{
    background-image: url('/wp-content/uploads/2018/06/Home-Page-Pattern-flip.png');
}


#diamond-section-2.bg-squares > .bg-canvas,
#diamond-section-1.bg-squares > .bg-canvas{
    height: 120%;
    top: -20%;
}



.mega-menu .bg-left > .bg-canvas{
    background-image: url('/wp-content/uploads/2018/06/MegaMenu-Pattern-left.png');
    background-size: contain;
    background-repeat: no-repeat;
    transform: scale(1.2);
}
.mega-menu .bg-right > .bg-canvas{
    background-image: url('/wp-content/uploads/2018/06/MegaMenu-Pattern-right.png');
    z-index: 1;
    background-size: contain;
    background-repeat: no-repeat;
    transform: scale(1.2);
}

#intro-text.bg-squares > .bg-canvas{
    height: 120%;
    top: -20%;
}

/*//////////////////////////////////////////////////////////////////////////////
/Backgrounds
//////////////////////////////////////////////////////////////////////////////*/

/*******************************************************************************
Team Modal Window
*******************************************************************************/
.team-modal{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;

    width: 1200px;
    max-height: 80vh;
    height: 1000px;
    background-color: #fff;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 2;

    position:relative;/*Safari fix for zindexing*/
}
.active .team-modal{
    visibility: visible;
}
.inactive .team-modal{
    visibility: hidden;
}
.team-modal-bg{
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    z-index: 100;

    transition: opacity 0.5s;
    opacity:0;
}
.team-modal-bg.inactive{
    visibility: hidden; /*Corrected by team-modal-bg.active*/
}
.team-modal-bg::before{
    content: ' ';
    display: block;

    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    z-index: 1;

    background-color: #DB211B;
    opacity: 0.4;
}
.team-modal-bg.active{
    visibility: visible;/*flex to work with .center-child*/
    opacity: 1;
}

.team-modal .controls{
    flex: 0 0 100%;
    justify-content: flex-end;
    flex-direction: row;
    display: flex;
    height: 10%;
    align-items: center;
}
.team-modal .content{
    flex: 0 0 100%;
    min-height: 90%;
    align-items: flex-start;

}
.team-modal .content #thumbnail{
    margin-bottom: 20px;
    max-width: 80%;
    height: auto;
    /*width: 100%;*/
	max-height: 40vh;
}
.team-modal .content #subtitle{
    color: #333;
}

.team-modal .content h1,
.team-modal .content h2,
.team-modal .content h3,
.team-modal .content h4,
.team-modal .content h5{
    color: #DB211B;
    font-weight: 300;
}

.team-modal .content h1{
    font-size: 4rem;
}
.team-modal .content h2{
    font-size: 3rem;
}
.team-modal .content h3{
    font-size: 2rem;
}
.team-modal .content h4{
    font-size: 1.8rem;
}
.team-modal .content h5{
    font-size: 1.5rem;
}
@media screen and (max-width: 800px){
	.team-modal{
		padding: 20px;
		top: 30px;
	}
	
    .team-modal .content{
        flex-wrap: wrap;
    }
	.team-modal .content h2{
		font-size: 1.5rem;
	}
	.team-modal .content h3{
		font-size: 1.2rem;
	}
	.team-modal .content p{
		font-size: 0.9rem;
	}
    .team-modal .content > div{
        flex: 0 0 100%;
    }
    .team-modal .content .right{
        margin-top: 20px;
    }
}
/*//////////////////////////////////////////////////////////////////////////////
/Team Modal Window
//////////////////////////////////////////////////////////////////////////////*/

/*******************************************************************************
Products Stuff
*******************************************************************************/




/*cat n tax pages*/

#product-archive-container{
    display: flex;
    flex-direction: row;
}

#product-archive{
    flex-basis: 250px;
    flex-shrink: 0;
    flex-grow: 0;
    padding-top: 25px; /*Equalize with the product thumbnails*/
}
#product-index-category{
    flex-basis:75%;
    flex-shrink: 1;
    flex-grow: 1;
}

@media screen and (max-width: 600px){
    #product-archive-container{
        flex-wrap: wrap;
    }

    #product-archive{
        flex-basis: 100%;
    }
    #product-index-category{
        flex-basis: 100%;
    }
    #product-archive-container .product-thumbnail > .wrapper{
        padding-left: 0;
        padding-right: 0;
    }
}

/*thumbnail*/
.product-thumbnail-container{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 75%;
    color: #DB211B;
    justify-content: flex-start;
}
.product-thumbnail{
    flex: 0 0 32%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0 0.665%;
}
.product-thumbnail > .wrapper{

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.product-thumbnail > .wrapper > .blank-link{
    height: 100%;
}
.product-thumbnail .image-container {
    width: 100%;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 200px;
    overflow: hidden;
}
.product-thumbnail .image-container .image-canvas{
    width:100%;
    height: 300px;/*Change height of .product-thumbnail .image-container*/
    background-size: cover;
    background-position: center;
}
.product-thumbnail .title {
    font-size: 1.3rem;
}
.product-thumbnail .excerpt {
    font-size: 1rem;
    font-weight: 300;
    color: #333;
}
.product-thumbnail .categories {
    width: 100%;
    display: inline-block;
    padding-top: 5px;
}
.product-thumbnail .categories a{
    font-size: 0.7rem;
    color: #DB211B;
    margin-right: 10px;
}
.product-thumbnail .categories a:last-child{
    margin-right: 0;
}


/*swissssshhhhh*/
.product-thumbnail:hover{
    cursor: pointer;
}

.product-thumbnail .image-container .image-canvas{
    position: relative;
}
.product-thumbnail .image-container .image-canvas::before{
    display: block;
    content: ' ';
    width: 100%;
    height:100%;
    position: absolute;
    left: -100%;
    right: 0;

    background-color: #DB211B;
    opacity: 0.7;

    transition: left 1s ease, opacity 1s ease-in;

}
.product-thumbnail:hover .image-container .image-canvas::before{
    left: 0;
    opacity: 0.2;
}

@media screen and (max-width: 1200px){
    .product-thumbnail{
        flex: 1 0 300px;
    }

}

/*Products Sidebar*/


#page{
    overflow-x: visible;
}

#products-sidebar{
    position: sticky;
    top: 100px;
}
#products-sidebar h1{
    color: #DB211B;
}
#products-sidebar ul{
    list-style: none;
    margin: 0;
}
#products-sidebar a{
    color: #DB211B;
}







/*
product Single
*/

/*
#product-bottom-text .left,
#product-bottom-text .right{
    flex: 50%;
}
*/


.footer-contact .right p:first-child {
    margin-top: 20px;
}
.footer-contact .left p:first-child {
    color: #DB211B;
    font-weight: 600;
}


/*// Products Sidebar //*/

/*//////////////////////////////////////////////////////////////////////////////
/Products Stuff
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
Fancy Links
*******************************************************************************/



.slide-links-container a{
    padding-left: 0px;
    position: relative;
    transition: padding-left 1s;
}
.slide-links-container a:hover{
    padding-left: 25px;
}

.slide-links-container a::before{
    content: ' ';
    display: block;
    height: 2px;

    position:absolute;
    left: 0;
    top: 50%;
    top: calc(50% - 1px);

    width: 0px;
    background-color: #DB211B;
    opacity: 0;
    transition: width 1s, opacity 1s;
}
.slide-links-container a:hover::before{
    width: 20px;
    opacity: 1;
}

/*//////////////////////////////////////////////////////////////////////////////
/Fancy Links
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
Category Row
*******************************************************************************/
.category-row-container{
    display: flex;
    flex-direction: row;

    width: 100%;
}
.category-row-container .category-outer{
    flex: 0 0 33.33%;
    height: 250px;
    position: relative;
}
.category-row-container .category-bg{
    background-size: cover;
    background-position: center;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.category-row-container .category-inner{
    width: 100%;
    height: 100%;
}
.category-row-container .category-title{
    background-size: cover;
    background-position: center;
}

.category-outer .category-bg{
    overflow: hidden
}

.category-row-container .category-bg::after{
    position:absolute;
    display: block;
    content: ' ';
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color: rgba(0,0,0,0.4);
    transition: left 1s ease;
}
.category-outer:hover .category-bg::after{
    left: 100%;
}

.category-outer .category-bg::before{
    display: block;
    content: ' ';
    width: 100%;
    height:100%;
    position: absolute;
    left: -100%;
    right: 0;

    background-color: #DB211B;
    opacity: 0.7;

    transition: left 1s ease, opacity 1s ease-in;

}
.category-outer:hover .category-bg::before{
    left: 0;
    opacity: 0.2;
}

@media screen and (max-width: 700px){
    .category-row-container{
        flex-wrap: wrap;
    }

    .category-row-container .category-outer{
        flex: 1 0 100%;
    }


}
/*//////////////////////////////////////////////////////////////////////////////
/Category Row
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
Default Contact Form
*******************************************************************************/


.form-container {
    width: 100%;
    float: left;
    margin-top: 30px;
}
.form-container .form-left,
.form-container .form-right{
    width: 49%;
    float: left;
}
.form-container .form-left{
    padding-right: 5px;
}
.form-container .form-right{
    padding-left: 5px;
}
@media screen and (max-width: 700px){
    .form-container .form-left,
    .form-container .form-right{
        width: 100%;
        /*padding: 0 20px;*/
    }
}
.form-container .form-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-left: 0;
    margin-right: 0;
}
.form-container .form-row .form-item {
    float: left;
    display: flex;
}
.form-container .form-row .form-item > p{
    display: none;
}
.form-container .form-row .form-item .label-wrapper {
    width: 90px;
    text-align: right;
    padding-right: 10px;/*move to child if ie hates this*/

}
.form-container .form-row .form-item .input-wrapper {
    flex: 20 1 0%;
}
.form-container .form-row .form-item .input-wrapper input,
.form-container .form-row .form-item .input-wrapper textarea{
    border: #999 1px solid;
    border-radius: 20px;
    background: rgba(255,255,255,0.25);
    font-size: .85rem;
}
.form-container .form-row .form-item .input-wrapper input{
    height: 40px;
}
.form-container .form-row .form-item .input-wrapper span,
.form-container .form-row .form-item .input-wrapper input{
    width: 100%;
    margin: 0;
}
.form-container .form-row .form-item.half {
    width: 49%;
}
.form-container .form-row .form-item.half .label-wrapper{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;

}
.form-container .form-row .form-item .label-wrapper label{
    font-weight: 600;
    font-size: .85rem;
}
.form-container .form-row .form-item.half .input-wrapper span{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
}

.form-container .form-row .form-item.full {
    width: 100%;
}

.form-container .form-row.send-form {

}
.form-container .form-row.send-form .left {
    /*margin-left: 100px;*/
    flex: 1 1 50%;
}
.form-container .form-row.send-form .right {
    flex: 0 0 350px;
}
.form-container .form-row.send-form .right input{
    margin: 0;
    float: right;
}
.form-container .form-row.send-form .disclaimer {
    color: #333;
    font-size: .85rem;
}


.form-container .form-row .form-item input.wpcf7-not-valid{
    border-color: #f00;

}
.form-container .form-row .form-item .input-wrapper span.wpcf7-not-valid-tip{
    display: none;
}
div.wpcf7-validation-errors{
    width: 100%;
    border-radius: 20px;
    background-color: #f0eba3;
    border-color: #f0eba3;
}
div.wpcf7-mail-sent-ok{
    width: 100%;
    border-radius: 20px;
    background-color: #568641;
    border-color: #568641;
}

.form-container .form-left,
.form-container .form-right{
    width: 100%;
    padding: 0;
}
.form-container .form-left > p,
.form-container .form-right > p{
    display: none;
}
.form-container .form-left {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}
.form-container .form-left > .form-row{
    flex: 0 0 49%;
}
/*//////////////////////////////////////////////////////////////////////////////
/Default Contact Form
//////////////////////////////////////////////////////////////////////////////*/



/*******************************************************************************
Twitter Feed
*******************************************************************************/

#twitter-bar{
    background-size: cover;
    background-position: center;

    position:relative;

}
#twitter-bar > .bg-canvas{
    position:absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    background-color: rgba(0,0,0,0.5);
}
#twitter-bar > .wrapper{

}


.twitter-slide-inner{
    position: relative;
    margin-top: 30px;
}
.twitter-slide-inner > .wrapper{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items:stretch;
    position: relative;
}
.twitter-slide-inner > .bg-canvas{
    position: absolute;
    top:0;
    left: 0;
    right: 0;
    bottom: 0;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    font-size: 3rem;
    color: #00aced;
    z-index: -1;
}
.twitter-slide-inner .tweet{
    flex: 0 0 40%;
    display: flex;
    position: relative;
    height: 210px;
}
.twitter-slide .tweet > .padding-wrapper{

    background-color: #fff;

    padding: 20px;
    margin-top: 30px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%; /*ie fix */
}

.twitter-slide .tweet:nth-child(1) > .padding-wrapper,
.twitter-slide .tweet:nth-child(2) > .padding-wrapper{
    margin-top: 0;
}


/*TRIANGLES!*/
.twitter-slide .tweet > .padding-wrapper::after{
    content: ' ';
    display: block;

    position: absolute;

    width: 0;
    height: 0;

    z-index: -1;
}

.twitter-slide .tweet:nth-child(1) > .padding-wrapper::after{
    border-bottom: 45px solid #fff;
    border-right: 60px solid transparent;

    right: -12%;
    bottom: 50%;
}

.twitter-slide .tweet:nth-child(2) > .padding-wrapper::after{
    border-bottom: 45px solid #fff;
    border-left: 60px solid transparent;

    left: -12%;
    bottom: 50%;
}

.twitter-slide .tweet:nth-child(3) > .padding-wrapper::after{
    border-top: 45px solid #fff;
    border-right: 60px solid transparent;

    right: -12%;
    top: 50%;
}

.twitter-slide .tweet:nth-child(4) > .padding-wrapper::after{
    border-top: 45px solid #fff;
    border-left: 60px solid transparent;

    left: -12%;
    top: 50%;
}


/*Red Border*/
.twitter-slide .tweet:nth-child(1) > .padding-wrapper,
.twitter-slide .tweet:nth-child(3) > .padding-wrapper{
    border-left: 3px solid #f00;
}

.twitter-slide .tweet:nth-child(2) > .padding-wrapper,
.twitter-slide .tweet:nth-child(4) > .padding-wrapper{
    border-right: 3px solid #f00;
}

#twitter-bar .title-bar{
    z-index: 99;
    position: absolute;
}
#twitter-bar .title-bar h3 a{
    color: #fff;
}
#twitter-bar .title-bar h3 a:hover{
    color: #f00;
}



@media screen and (max-width: 700px){
    .twitter-slide-inner > .bg-canvas{
        justify-content: flex-start;
    }
    #twitter-bar .twitter-slide .tweet{
        flex: 100%;
    }
    #twitter-bar .twitter-slide .tweet > .padding-wrapper{
        flex: 100%;
        flex: 100%;
        border: none;
        margin-top: 30px;
        border-left: 3px solid #f00;
    }
    #twitter-bar .twitter-slide .tweet:first-child{
        margin-top: 100px;
    }
    #twitter-bar .twitter-slide .tweet > .padding-wrapper::after{
        display: none;
    }
    #twitter-bar .twitter-slide .tweet,
    #twitter-bar .twitter-slide .tweet > .padding-wrapper,
    #twitter-bar .twitter-slide .tweet > .padding-wrapper > div{
        height: auto;
    }
}


/*//////////////////////////////////////////////////////////////////////////////
/Twitter Feed
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
slideable Article
*******************************************************************************/

article.slideable{

}
article.slideable .padding-wrapper{
    display: flex;
    flex-direction: column;
    padding: 20px 0;
}

article.slideable .image-container{
    height: 150px;
}
article.slideable .image-container a,
article.slideable .image-container .image-canvas{
    width: 100%;
    height: 100%;
}
article.slideable .image-container .image-canvas{
    background-size: cover;
    background-position: center;
}

article.slideable .title{
    color: #777;
    font-size: 0.9rem;
    margin-top: 10px;
}



.product-slider-button{
    display: inline-block;
}
.product-slider-button img{
    background-color: #DB211B;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    padding: 5px;


}


/*//////////////////////////////////////////////////////////////////////////////
/slideable Article
//////////////////////////////////////////////////////////////////////////////*/

/*******************************************************************************
Diamond Social Icons
*******************************************************************************/



.diamond-social-icons{
    display: flex;
    flex-direction: row;
    justify-content:flex-end;
    align-items: center;
    height: 100%;
    width: 100%;

    position: relative;/*Social Diamond Fixes*/
    z-index: 1;/*Social Diamond Fixes*/
}

.diamond-social-icons a{
    color: #fff;

    position: relative;
    height: 30px;
    width: 30px;
    font-size: 18px;
    flex: 0 0 30px;
    margin: 0 15px;

    display: flex;
    justify-content: center;
}
.diamond-social-icons a::before{
    background-color: #aaa;

    width: 100%;
    height: 100%;
    display: block;
    content: ' ';
    position: absolute;
    transform: rotateZ(45deg);
    z-index: -1;

    transition: background-color 0.5s;

}
.diamond-social-icons a:hover::before{
    background-color: #f00;
}
.diamond-social-icons a i{
    /*
    position: relative;
    top: 6px;
    */
    line-height: 30px;
    width: 30px;
    text-align: center;
}



/*//////////////////////////////////////////////////////////////////////////////
/Diamond Social Icons
//////////////////////////////////////////////////////////////////////////////*/

/*******************************************************************************
Hero Shapes
*******************************************************************************/

.shapes-hero{
    overflow: hidden;
}
.shapes-hero .slide-bg{
    display: none;
}
.shapes-hero .slide-inner{
    position:relative;
}
.shapes-hero .slide-image-bg{
    filter:none;
    opacity: 1;
}



.shapes-hero .hero-inner{
    display: block;
    align-items: auto;
    justify-content: auto;
    flex-direction: none;
    overflow: hidden;
}

.shapes-hero .hero-inner .left,
.shapes-hero .hero-inner .right{
    z-index: 1;
}



.slide-shapes-bg{
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1 !important;
    top: -230px; /*Parallax Offset*/
}
.slide-shapes-bg .square{
    position: absolute;
    width: 400px;
    height: 400px;
    background-color: #DB211B;
}

.slide-shapes-bg #pos-1.square{
    top: 100px;
    left: auto;
    right: auto;
    bottom: auto;
    transform: rotateZ(45deg);
    opacity: 0.75;

    top: -12px;
}
.slide-shapes-bg #pos-2.square{
    top: 100px;
    left: 305px;
    right: auto;
    bottom: auto;
    transform: rotateZ(45deg);
    opacity: 0.7;

    top: 269px;
}
.slide-shapes-bg #pos-3.square{
    top: 100px;
    left: -305px;
    right: auto;
    bottom: auto;
    transform: rotateZ(45deg);
    opacity: 0.7;

    top: 269px;
}
.slide-shapes-bg #pos-4.square{
    top: 404px;
    left: auto;
    right: auto;
    bottom: auto;
    transform: rotateZ(45deg);
    opacity: 0.7;

    top: 573px;
}
.slide-shapes-bg #pos-5.square{
    top: -183px;
    left: 588px;
    right: auto;
    bottom: auto;
    transform: rotateZ(45deg);
    opacity: 0.5;
}
.slide-shapes-bg #pos-6.square{
    top: 383px;
    left: 588px;
    right: auto;
    bottom: auto;
    transform: rotateZ(45deg);
    opacity: 0.5;
}
.slide-shapes-bg #pos-7.square{
    top: -205px;
    left: auto;
    right: auto;
    bottom: auto;
    transform: rotateZ(45deg);
    opacity: 0.7;

    top: -33px;
}
.slide-shapes-bg #pos-8.square{
    top: 100px;
    left: auto;
    right: auto;
    bottom: auto;
    transform: scale(2.079) rotateZ(45deg);
    opacity: 0.4;
}
.slide-shapes-bg #pos-9.square{
    top: 100px;
    left: -610px;
    right: auto;
    bottom: auto;
    transform: scale(2.079) rotateZ(45deg);
    opacity: 0.4;
}

.ie_noparallax .slide-shapes-bg #pos-1.square{top: 100px;}
.ie_noparallax .slide-shapes-bg #pos-2.square{top: 100px;}
.ie_noparallax .slide-shapes-bg #pos-3.square{top: 100px;}
.ie_noparallax .slide-shapes-bg #pos-4.square{top: 404px;}
.ie_noparallax .slide-shapes-bg #pos-5.square{top: -183px;}
.ie_noparallax .slide-shapes-bg #pos-6.square{top: 383px;}
.ie_noparallax .slide-shapes-bg #pos-7.square{top: -205px;}
.ie_noparallax .slide-shapes-bg #pos-8.square{top: 100px;}
.ie_noparallax .slide-shapes-bg #pos-9.square{top: 100px;}
.ie_noparallax .slide-shapes-bg{top: 0;}
/*//////////////////////////////////////////////////////////////////////////////
/Hero Shapes
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
Vacancy Modal Window
*******************************************************************************/
.vacancy-modal{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;

    width: 1200px;
    max-height: 80vh;
    height: 1000px;
    background-color: #fff;
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 2;

    position:relative;/*Safari fix for zindexing*/
}
.active .vacancy-modal{
    visibility: visible;
}
.inactive .vacancy-modal{
    visibility: hidden;
}
.vacancy-modal-bg{
    display: flex;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    z-index: 100;

    transition: opacity 0.5s;
    opacity:0;
}
.vacancy-modal-bg.inactive{
    visibility: hidden; /*Corrected by team-modal-bg.active*/
}
.vacancy-modal-bg::before{
    content: ' ';
    display: block;

    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;

    z-index: 1;

    background-color: #DB211B;
    opacity: 0.4;
}
.vacancy-modal-bg.active{
    visibility: visible;/*flex to work with .center-child*/
    opacity: 1;
}

.vacancy-modal .controls{
    flex: 0 0 100%;
    justify-content: flex-end;
    flex-direction: row;
    display: flex;
    height: 10%;
    align-items: center;
}
.vacancy-modal .content{
    flex: 0 0 100%;
    min-height: 90%;
    align-items: flex-start;

}
.vacancy-modal .content #thumbnail{
    margin-bottom: 20px;
    max-width: 80%;
    height: auto;
    width: 100%;
}
.vacancy-modal .content #subtitle{
    color: #333;
}

.vacancy-modal .content h1,
.vacancy-modal .content h2,
.vacancy-modal .content h3,
.vacancy-modal .content h4,
.vacancy-modal .content h5{
    color: #DB211B;
    font-weight: 300;
}

.vacancy-modal .content h1{
    font-size: 4rem;
}
.vacancy-modal .content h2{
    font-size: 3rem;
}
.vacancy-modal .content h3{
    font-size: 2rem;
}
.vacancy-modal .content h4{
    font-size: 1.8rem;
}
.vacancy-modal .content h5{
    font-size: 1.5rem;
}

@media screen and (max-width: 800px){
    .vacancy-modal .content{
        flex-wrap: wrap;
    }
    .vacancy-modal .content > div{
        flex: 0 0 100%;
    }
}
/*//////////////////////////////////////////////////////////////////////////////
/Vacancy Modal Window
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
Megamenu Toggle
*******************************************************************************/


#mega-menu-toggle{
    display: block;
    position: relative;
    top: 0;
    right: 0;
}

.scrolled-down #mega-menu-toggle{
}
@media screen and (max-width: 1100px){
    #mega-menu-toggle{
        display: none;
    }
}

/*//////////////////////////////////////////////////////////////////////////////
/Megamenu Toggle
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
Homepage hero tweaks
*******************************************************************************/

#homepage-hero .hero-inner > div{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
#homepage-hero #hero-video{
    height: auto;
    width: auto;
	min-width: 100%;
	min-height: 100%;
	position:relative;
	top: 50%;
	transform: translateY(-50%);

}
/*//////////////////////////////////////////////////////////////////////////////
/Homepage hero tweaks
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
   Team Page Tweaks
*******************************************************************************/


#team-full > div {
    display: flex;
    flex-direction: row;
    justify-content: center;
}
#team-full .team-card-sidebar{
    flex: 0 0 25%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
#team-full .team-card-container{
    flex: 0 0 75%;
}

#team-full .team-card-container.all > .team-member-card{
    flex: 0 0 33.33%;
}

#team-full .team-card-sidebar{
    padding: 0 40px;
}

#team-full .group-button-wrapper{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    padding-bottom: 10px;
}
#team-full .group-button{
    min-width: 160px;
	width: 100%;
	max-width: 350px;
}

#team-full .group-loaded > div{
    display: none;
}
#team-full .group-loaded .part-of-loaded-group{
    display: inherit;
}
@media screen and (min-width: 1600px){
	#team-full .team-card-container.all > .team-member-card{
		flex: 0 0 25%;
	}
}
@media screen and (max-width: 1000px){
	#team-full .team-card-container.all > .team-member-card{
		flex: 0 0 50%;
	}
}
@media screen and (max-width: 800px){
	#team-full > div {
    	flex-direction: column;
	}
	#team-full .team-card-sidebar{
		flex: auto;
		padding-bottom: 20px;
	}
	#team-full .team-card-container{
		flex: auto;
	}
	
	#team-full .team-card-container.all > .team-member-card{
		flex: auto;
		width: 100%;
	}
	.page-template-template-team #intro-text > .vp-default{
		padding-bottom: 20px;
	}
	.page-template-template-team #intro-text > div > div > .right{
		display: none;
	}
}
/*//////////////////////////////////////////////////////////////////////////////
/ Team Page Tweaks
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
sssssssssssssssssssssssssss
*******************************************************************************/





/*//////////////////////////////////////////////////////////////////////////////
/ssssssssssssssssssssssss
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
sssssssssssssssssssssssssss
*******************************************************************************/





/*//////////////////////////////////////////////////////////////////////////////
/ssssssssssssssssssssssss
//////////////////////////////////////////////////////////////////////////////*/
/*******************************************************************************
sssssssssssssssssssssssssss
*******************************************************************************/





/*//////////////////////////////////////////////////////////////////////////////
/ssssssssssssssssssssssss
//////////////////////////////////////////////////////////////////////////////*/












/*TWEAAAKZ*/

/* Fix so it doesnt cause a double scrollbar with parallax*/
/*
#wpadminbar{
    position: absolute;
    top: 0;

}
*/

html{
    margin-top: 0 !important;
}

/*Fix for non parallax pages*/
/*
#page{
    width: 100%;

}
*/

/* Remove post views counter */
.post-views{
    display: none;
}



/*Basic table styling for posts*/

table.red{
    width: 100%
}
table.red th,
table.red td{
    padding: 10px;
}
table.red tr:nth-child(2n){
    background-color: #f2f2f2;
}
table.red tr:nth-child(2n+1){
    background-color: transparent;
}
table.red tr:first-child{
    background-color: #AD312D;
    color: white;
}


.single-post-slider{
    z-index: 2; /*Raise post slider above bg squares*/
}
.product-slider-button{
    cursor: pointer;
    transition: opacity 0.5s;
}
.product-slider-button:hover{
    opacity: 0.8;
}

/*Pagination*/
.pagination-wrapper{
    width: 100%;
    float: left;
    display: flex;
    justify-content: center;
    align-items: center;

    padding-top: 10px;
}
.pagination{
    display: inline;
    float: none;
    width: auto;
}

.pagination li{

}
.pagination li a{
    color: #fff;
    background-color: #dc7d79;
    transition: background-color 0.5s, color 0.5s;
}
.pagination li a:hover{
    color: #fff;
    background-color: #d04843;
}
.pagination li span.current{
    color: #e07e7b;
    background-color: #8c2a26;
}








.get-in-touch-card{
    border: #999 1px solid;
    padding: 20px 40px;
    border-radius: 10px;

    overflow: auto;
}
.get-in-touch-card .top{
    margin-bottom: 20px;
    overflow:auto;

}
.get-in-touch-card .top p{
    font-weight: 600;
}





.icon-button{
    /*height: 1.6rem;*/
    border-radius: 0.8rem;
    float: left;
    clear: both;
    background-color: #999;
	color:#fff;
	display: flex;
    justify-content: space-between;
    flex-direction: row;
    align-items: center;
	transition: background-color 0.5s;
	margin-right: 10px;
    margin-bottom: 5px;
	padding: 2px 12px;
}
.icon-button:first-child{
    margin-top: 0;
}
.icon-button i{
    /*padding: 0 10px;*/
	padding: 0 10px 0 2px;
	margin-right: 8px;
    border-right: 1px solid #fff;
    font-size: 0.95rem;
    line-height: 1rem;
    color: #fff;
}
.icon-button i::before{  }
.icon-button i::after{  }

.icon-button span{
    font-size: 0.9rem;
    padding: 0 20px;
    line-height: 1rem;
    color: #fff;
}
.icon-button:hover{
    color: #fff;
    background-color: #DB211B;
}
#site-footer a.icon-button{
    float: left; /* override */
}




.vacancy-row{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    border-top: #999 1px solid;
    padding: 20px 0;
}
.vacancy-row:last-child{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    border-bottom: #999 1px solid;
}
.vacancy-row .title{
    flex: 0 0 40%;
}
.vacancy-row .title p{
    color: #333;
    font-weight: 600;
    margin: 0;
}
.vacancy-row .type{
    color: #999;
    flex: 0 0 20%;
}
.vacancy-row .view{
    flex: 0 0 20%;
}

@media screen and (max-width: 800px){
    .vacancies .vacancy-row{
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .vacancies .vacancy-row > *{
        padding-top: 10px;
    }
    .vacancies .vacancy-row > *:first-child{
        padding-top: 0px;
    }
}

















/*



Lighter Red: #e74640
Hinks Red:   #DB211B
Darker Red:  #7f1310


*/




/*******************************************************************************
hacky tweakz
*******************************************************************************/

#mega-menu-toggle{
    width: 170px;
}
#mega-menu-toggle .text{
    width: 120px;
    position: relative;
    left: 50px;
    text-indent: 0;
    text-align: left;
}
#mega-menu-toggle .burger{
    width: 50px;
    position: absolute;
    height: 50px;
    top: -5px;
    left: -5px;
	transition: top 0.5s;
}
.scrolled-down #mega-menu-toggle .burger{
	top: -10px;
}

/*
vacancies testimonials
*/
.page-template-template-vacancies .diamond-wrapper .bg-canvas{
    background-size: contain;
    background-repeat: no-repeat;
}










/* thanks to https://www.cssportal.com/style-input-range/ */
input[type=range] {
  height: 21px;
  -webkit-appearance: none;
  margin: 10px 0;
  width: 100%;
}
input[type=range]:focus {
  outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000;
  background: #DB211B;
  border-radius: 0px;
  border: 0px solid #000000;
}
input[type=range]::-webkit-slider-thumb {
  box-shadow: 0px 0px 1px #000000;
  border: 0px solid #000000;
  height: 15px;
  width: 15px;
  border-radius: 15px;
  background: #DB211B;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -6px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
  background: #DB211B;
}
input[type=range]::-moz-range-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: 0px 0px 0px #000000;
  background: #DB211B;
  border-radius: 0px;
  border: 0px solid #000000;
}
input[type=range]::-moz-range-thumb {
  box-shadow: 0px 0px 1px #000000;
  border: 0px solid #000000;
  height: 15px;
  width: 15px;
  border-radius: 15px;
  background: #DB211B;
  cursor: pointer;
}
input[type=range]::-ms-track {
  width: 100%;
  height: 3px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #DB211B;
  border: 0px solid #000000;
  border-radius: 0px;
  box-shadow: 0px 0px 0px #000000;
}
input[type=range]::-ms-fill-upper {
  background: #DB211B;
  border: 0px solid #000000;
  border-radius: 0px;
  box-shadow: 0px 0px 0px #000000;
}
input[type=range]::-ms-thumb {
  margin-top: 1px;
  box-shadow: 0px 0px 1px #000000;
  border: 0px solid #000000;
  height: 15px;
  width: 15px;
  border-radius: 15px;
  background: #DB211B;
  cursor: pointer;
}
input[type=range]:focus::-ms-fill-lower {
  background: #DB211B;
}
input[type=range]:focus::-ms-fill-upper {
  background: #DB211B;
}