/* GENERAL */
h5 a {color:#000000 !important;}

/* LAYOUT */
section.content-element.content-hero-plane:first-child {
    background: #000;
    margin-top: 0;
    padding: 24px 0;
    margin-bottom: 48px;
}

/* HERO */
body {padding: 0px; margin: 0px;}   
    
.BreadcrumbNav {
    background-color: rgba(0,0,0,0) !important;
    color: #fff;
    z-index: 2;
    position: relative;
    }

.BreadcrumbNav__Items {
    opacity: .5;
}
    
#hero_container {height: 56.25vw; max-height: 900px; min-height: 600px; position: relative; margin-top:-48px; z-index:1;}   
    
#hero {
    display: flex;
    justify-content: center;
    align-content: center;
    height: 100%;
    overflow: hidden;
    background: #000000;
    }   

video {
    position: absolute;
    z-index: 0;
    object-fit: cover;
    width:100%;
    height:100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 1;
    }   
    
.hero_content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    text-align: center;
    padding: 100px 10%;
    }   

.content-hero.text_over_image .container--wrapper {
	pointer-events: none;
	}

.content-hero-content-box {
	pointer-events: all;
	}

.hero_title h2 {
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.77px;
    text-shadow: none;
    font-family: OstrichProper,Arial,sans-serif;
    -webkit-font-smoothing: antialiased;
    line-height: 1;
    }   

.hero_title h2 span {
    color: #b2ff33;
    font-family: OstrichProperInline-Open,Arial,sans-serif;
    letter-spacing:5px;
    font-weight: normal;
    }

.hero_title .content-hero__overline {
    padding-bottom: 12px;
    color: #fff;
    display: block;
    line-height: 15px
    }
    
.hero_content .button {text-transform: uppercase; } 

.hero_ctas {
    display: flex;
    justify-content: center;
    padding: 0px 0px 24px 0px;
    min-height: 96px;
    }
    
    .cta_stack {display: flex; flex-direction: column;margin: 24px;}
    
    .cta_tag {
    font-size: 1rem;
    line-height: 1rem;
    text-align: center;
    letter-spacing: 1.5px;
    color: #fff;
    text-transform: uppercase;
        margin-bottom: 12px;
    }
    
.cta_spacer {width: 1px; background: #fff; min-height: 96px; margin:0;} 

#hero_container h2 {
    font-size: 64px;
}


.hero_content .button span {
font-size: 10px;
background-color: #000;
color: #fff;
padding: 2px 4px 1px;
transition-duration: .3s;
transition-timing-function: ease-in-out;
margin-left: 7px;
display: inline-block;
float: right;
line-height: 12px;
}
.hero_content .button:hover span {background-color: #fff; color: #000;}


    

/* CARDS */
.content-hero--wrapper {-webkit-font-smoothing: antialiased;}
.content-hero:hover {cursor:pointer !important;}

section.content-section>.title-container {
    padding-top: 0px !important;
}
section.content-section {
padding-bottom: 0px !important;
}
.text_over_image .content-hero-content-box.text-color--white h2,
.text_over_image .content-hero-content-box.text-color--black h2,
.text_over_image .content-hero-content-box.text-color--white h3,
.text_over_image .content-hero-content-box.text-color--black h3 {
    font-family: 'din-2014';
    font-weight: bold;
    text-transform: none;
    font-size: 36px;
    line-height: 44px;
    text-shadow:none;
}

.col-md-4.text_over_image .content-hero-content-box.text-color--white h2,
.col-md-4.text_over_image .content-hero-content-box.text-color--black h2,
.col-md-4.text_over_image .content-hero-content-box.text-color--white h3,
.col-md-4.text_over_image .content-hero-content-box.text-color--black h3 {
    font-size: 26px;
    line-height: 32px;
}

.col-md-4.text_over_image .content-hero-content-box.box-background--transparent {
    margin: 12px 0 24px 0;
}

.content-hero__overline {
    font-size: 12px;
    margin: 0 0 6px 0 !important;
    line-height: 15px;
    text-transform: uppercase;
    letter-spacing: 2px;
    text-shadow:none;
}

.content-hero__title {
    margin: 0 0 6px 0 !important;
}
.text-color--black .content-hero__title a {
    color: #000;
}
.content-hero--wrapper:hover .image {
    transform:scale(1.1);
    transition: .5s ease all;
}
.content-hero--wrapper .image {
    transform:scale(1.0);
    transition: .5s ease all;
}

/* CTAs */
.content-hero .button {
    background:none;
    position:relative;
    color: #ffffff;
    text-transform:none !important;
    letter-spacing:0px;
    padding: 5px 0 5px 0 !important;
    font-weight: bold;
    letter-spacing: .05em;
    background-image: linear-gradient(0deg, #9BE81B 0%, #9BE81B 100%);
	background-repeat: no-repeat;
	background-size: 100% 3px;
	background-position: 0 100%;
	transition: background-size 0.5s ease, padding 0.25s ease;
	overflow: visible;
}

.text-color--black .button {color:#000000;}

.content-hero .button:hover {
    background:none;
	background-image: linear-gradient(0deg, #b2ff33 0%, #b2ff33 100%);
	background-size: 100% 100%;
	transition: background-size 0.25s ease, padding 0.25s ease, color .25s ease;
	color:#000000;
    padding: 5px 24px 5px 5px !important;
}

.content-hero .button:after {
    content: '→' ;
    display: block;
    color: #000000;
    position:absolute;
    top: 4px;
    right:5px;
    font-weight:bold;
    opacity:0;
}

.content-hero .button:hover:after {
    opacity:1;
}

.content-hero .content-hero-content-box .content-hero-link {margin-top:0 !important; margin-right:0px !important;}
.async-hide { opacity: 0 !important}

.content-hero.col-md-12 {
    margin-left: 12px !important;
    margin-right: 12px !important;
    flex-basis: calc(100% - 24px) !important;
    }

.col-md-12.text_over_image .content-hero-content-box.text-color--white h2 {
	font-family: 'OstrichProper', 'din-2014';
    text-transform: uppercase;
    font-size: 48px;
    line-height: 48px;
    margin-top: 18px !important;
}    




/* MEDIA QUERIES */

@media screen and (max-width: 1300px) {
/*.content-hero .content-hero-content-box .content-hero-link {display:none !important;}*/
}

@media screen and (max-width: 1000px) {
  .col-md-6.text_over_image .content-hero-content-box.text-color--white h2, .col-md-4.text_over_image .content-hero-content-box.text-color--black h2,
  .col-md-6.text_over_image .content-hero-content-box.text-color--white h3, .col-md-4.text_over_image .content-hero-content-box.text-color--black h3 {
    font-size: 26px;
    line-height: 32px;
    }

  .text_over_image .content-hero-content-box.text-color--white h2, .text_over_image .content-hero-content-box.text-color--black h2,
  .text_over_image .content-hero-content-box.text-color--white h3, .text_over_image .content-hero-content-box.text-color--black h3 {
     font-size: 26px;
    line-height: 32px;


}
  .col-md-4.text_over_image .content-hero-content-box.text-color--white h2, .col-md-4.text_over_image .content-hero-content-box.text-color--black h2,
  .col-md-4.text_over_image .content-hero-content-box.text-color--white h3, .col-md-4.text_over_image .content-hero-content-box.text-color--black h3 {
    font-size: 20px;
    line-height: 24px;
    }
}

@media screen and (max-width: 768px) {
  /* HERO */
    #hero_container h2 {
        font-size: 3.1rem;
    }
    #hero.image {
        background-position: center center !important;
        background-size: cover !important;
    }
    
    .hero_content {
        padding: 125px 5% 75px 5% !important;
    } 
    
    #hero_container {
        margin-top:0px !important;
    }

  /*CARDS */
  .col-md-6.text_over_image .content-hero-content-box.text-color--white h2, .col-md-4.text_over_image .content-hero-content-box.text-color--black h2,
  .col-md-6.text_over_image .content-hero-content-box.text-color--white h3, .col-md-4.text_over_image .content-hero-content-box.text-color--black h3 {
        font-size: 20px;
        line-height: 24px;
    }

  .text_over_image .content-hero-content-box.text-color--white h2, .text_over_image .content-hero-content-box.text-color--black h2,
  .text_over_image .content-hero-content-box.text-color--white h3, .text_over_image .content-hero-content-box.text-color--black h3 {
        font-size: 20px;
        line-height: 24px;
    }
}
@media screen and (max-width: 991px) {
    .col-md-6.text_over_image .content-hero-content-box.box-background--transparent {
        margin: 12px 0 24px 0;
    }
}
@media only screen and (max-width: 600px)    {
    /* HERO */
    .hero_ctas {flex-direction: column;}    
    .cta_spacer {display: none;}    
    .hero_content .button {margin: 0px 0px;}    
    .cta_stack {margin: 12px;}
    .video video {display: none;}

    }



@media screen and (width <= 414px) {
    /* HERO */
    #hero_container h2 {
        font-size: 2.4rem;
    }
    #hero_container h2:lang(ja) {
        font-size: 2rem;
        font-weight: bold;
    }    
    .hero_title h2 span:lang(ja) {
        font-weight: bold;
    }
}