.homepage-hero-module {
    border-right: none;
    border-left: none;
    margin-top: 80px;
    position: relative;
}
.no-video .video-container video,
.touch .video-container video {
    display: none;
}
.no-video .video-container .poster,
.touch .video-container .poster {
    display: block !important;
}

.video-container .poster img {
    width: 100%;
    bottom: 0;
    position: absolute;
}
.video-container .filter {
    z-index: 100;
    position: absolute;
    background: rgba(0, 0, 0, 0.4);
    width: 100%;
}
.video-container video {
    position: absolute;
    z-index: 0;
    bottom: 0;
}
.video-container video.fillWidth {
    width: 100%;
}
.video-container .title-container {
    z-index: 1000;
    position: absolute;
    top: 25%;
    width: 100%;
    text-align: center;
    color: #fff;
}
.headline > h1 {
    margin: 0;
    text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
    font-size: 5em;
    color: rgba(255, 255, 255, 1);
}
.headline > h3 {
    text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
    color: rgba(255, 255, 255, 1);
}
.text-white{
    color: #fff !important;
    text-shadow: 1px 1px 2px black;
}

/*TEST additions for xperi layout*/
.hero-banner .image {
 height:0;
 padding-top:40%;
 background-size:cover;
 background-position:50%;
 background-repeat:no-repeat
}
.hero-banner .image video {
 position:absolute;
 top:0;
 left:0;
 right:0;
 bottom:0
}
.hero-banner .information {
 position:absolute;
 bottom:0;
 left:0;
 right:0;
 color:#fff;
 padding:9.375%
}

.hero-banner .information h2 {
 font-weight:100;
 font-size:2.625em;
 text-transform:uppercase;
 text-shadow: 2px 2px 3px rgba(0,0,0,0.6);
 font-weight:300;
 max-width:60%;
 color:#fff;
 padding-top: 0.75em;
 margin:.25em 0
}

@media only screen and (min-width:1200px) {
.hero-banner .information span { 
  background: rgba(0, 0, 0, 0.75);
  color: #fff; 
  display: inline;
  
  /* Needs prefixing */
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}}

.hero-banner .information .button {
 color:#fff
}
.hero-banner .information .button:hover {
 color:#FFF
}
.hero-banner .information.logo-bottom h2 {
 margin-top:0
}
.hero-banner .information.logo-bottom i {
 margin-bottom:2em
}
.archive-banner.hero-banner .image {
 background-color:#000
}
.archive-banner.hero-banner .information {
 bottom:auto;
 top:50%;
 -webkit-transform:translateY(-50%);
 transform:translateY(-50%)
}

@media only screen and (max-width:1200px) {
 .hero-banner .information h2 {
  font-size:2em
 }
}
@media only screen and (max-width:1024px) {
 .hero-banner .information {
  background:#221f1f;
  background:linear-gradient(90deg,#221f1f 0,#CC0000 0,#CC0000 0,#0b0815);
  position:relative;
  top:auto;
  left:auto;
  right:auto;
  bottom:auto;
  padding:2em
 }
 .hero-banner .information h2 {
  font-size:1.6em;
  color:#fff
 }
 .hero-banner .information .button {
  padding:0;
  border-left:0;
  border-right:0;
  text-transform:none;
  background:initial;
  text-indent:0;
  transition:none;
  display:block;
  width:40px;
  height:40px;
  position:relative;
  outline:0;
  cursor:pointer;
  transition:color .3s ease;
  text-indent:-999em;
  position:absolute;
  right:2em;
  top:50%;
  -webkit-transform:translateY(-50%);
  transform:translateY(-50%)
 }
 .hero-banner .information .button:after,.hero-banner .information .button:before {
  height:auto;
  left:auto;
  right:auto;
  width:auto;
  background:transparent;
  max-width:none
 }
 .hero-banner .information .button:before {
  top:auto;
  right:auto;
  transition:none
 }
 .hero-banner .information .button:after {
  bottom:auto;
  left:auto;
  height:auto;
  -webkit-transform:none;
  transform:none;
  transition:none
 }
 .hero-banner .information .button:hover {
  cursor:auto;
  border-left:0;
  border-right:0;
  background:none;
  color:#fff;
  transition:none
 }
 .hero-banner .information .button:hover:after,.hero-banner .information .button:hover:before {
  max-width:none
 }
 .hero-banner .information .button:after {
  z-index:5;
  content:"";
  display:block;
  position:absolute;
  top:0;
  left:0;
  right:0;
  bottom:0;
  background:url(cover/circleIcon.svg);
  background-size:contain;
  background-repeat:no-repeat;
  opacity:1;
  transition:opacity .3s ease
 }
 .hero-banner .information .button:before {
  transition:color .3s ease;
  text-indent:0;
  content:"";
  position:absolute;
  font:normal normal normal 14px/1 FontAwesome;
  text-rendering:auto;
  text-align:center;
  top:50%;
  left:50%;
  font-size:18px;
  -webkit-transform:translateX(-50%) translateY(-50%);
  transform:translateX(-50%) translateY(-50%);
  margin-left:2px
 }
 .hero-banner .information .button:hover,.hero-banner .information .button:hover i {
  color:#FFF
 }
 .hero-banner .information .button:hover:after {
  opacity:.5
 }
 .hero-banner .information .button span {
  display:none
 }
 .hero-banner.archive-banner .information {
  -webkit-transform:none;
  transform:none;
  top:auto
 }
}
@media only screen and (max-width:768px) {
 .hero-banner .information h2 {
  font-size:1.375em
 }
}
@media only screen and (min-width:1025px) {
 .wrap-featured.hero-banner .image video {
  height:100%;
  width:auto;
  -webkit-transform:translate(-50%,-50%);
  transform:translate(-50%,-50%);
  left:50%;
  top:50%
 }
 .wrap-featured.hero-banner .information {
  top:0;
  bottom:auto
 }
 .wrap-featured.hero-banner {
  width:70%;
  float:left;
  clear:none;
  padding-top:39.35%;
  position:relative
 }
 .wrap-featured.hero-banner .image {
  width:100%;
  height:100%;
  top:0;
  left:0;
  position:absolute
 }
 #feature-carousel.wrap-featured {
  width:30%;
  float:right;
  clear:none;
  position:relative;
  padding:39.4% 0 0;
  background:#fff
 }
 .wrap-featured.features .feature {
  width:100%;
  position:relative;
  height:33.3%
 }
 .wrap-featured.features .feature .image {
  margin:0;
  padding:0;
  height:100%;
  position:relative
 }
 .wrap-featured.features .feature .image:after {
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  height:60%;
  width:100%;
  background:linear-gradient(180deg,hsla(0,0%,60%,0) 0,#000);
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#00999999",endColorstr="#000000",GradientType=0)
 }
 .wrap-featured.features .feature a {
  display:block;
  height:100%
 }
 .wrap-featured .wrap-feature {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%
 }
 .wrap-featured.features .feature h4 {
  position:absolute;
  bottom:5%;
  margin:0 5%;
  text-align:left
 }
 .wrap-featured-hero {
  position:relative
 }
}
@media only screen and (max-width:1025px) {
 .wrap-featured.hero-banner .image {
  position:relative;
  padding-top:55%
 }
}
@media only screen and (max-width:768px) {
 .wrap-featured.hero-banner .image video {
  display:none
 }
}
.features {
 background:#221f1f;
 background:linear-gradient(90deg,#221f1f 0,#CC0000 0,#CC0000 0,#0b0815);
 padding:3.5% 2.5%
}
.features .feature {
 width:33.3336%;
 float:left;
 text-align:center;
 color:#fff
}
.features .feature a {
 color:#fff
}
.features .feature .image {
 height:0;
 padding-top:30%;
 background-color:#510000;
 background-size:cover;
 background-position:50%;
 background-repeat:no-repeat;
 margin-bottom:1em;
 opacity:1;
 transition:opacity .3s ease-in
}
.features .feature h4 {
 text-transform:uppercase;
 transition:color .3s ease-in
}
.features .feature .image,.features .feature h4 {
 margin:0 21%
}
.features .feature h4 {
 margin-top:1em
}
.features .feature a:hover .image {
 opacity:.7
}
.features .feature a:hover h4 {
 color:#510000
}
.features.four-items .feature {
 width:25%
}
.features .slick-arrow {
 display:block;
 width:40px;
 height:40px;
 position:relative;
 outline:0;
 cursor:pointer;
 transition:color .3s ease;
 text-indent:-999em;
 border:0;
 top:50%;
 left:auto;
 right:auto;
 -webkit-appearance:none;
 -moz-appearance:none;
 appearance:none;
 background:transparent;
 color:#fff;
 z-index:7;
 -webkit-transform:translateY(-50%);
 transform:translateY(-50%)
}
.features .slick-arrow:after {
 z-index:5;
 content:"";
 display:block;
 position:absolute;
 top:0;
 left:0;
 right:0;
 bottom:0;
 background:url(cover/circleIcon.svg);
 background-size:contain;
 background-repeat:no-repeat;
 opacity:1;
 transition:opacity .3s ease
}
.features .slick-arrow:before {
 transition:color .3s ease;
 text-indent:0;
 content:"";
 position:absolute;
 font:normal normal normal 14px/1 FontAwesome;
 text-rendering:auto;
 text-align:center;
 top:50%;
 left:50%;
 font-size:18px;
 -webkit-transform:translateX(-50%) translateY(-50%);
 transform:translateX(-50%) translateY(-50%);
 margin-right:2px
}
.features .slick-arrow:hover,.features .slick-arrow:hover i {
 color:#510000
}
.features .slick-arrow:hover:after {
 opacity:.5
}
.features .slick-arrow.slick-prev {
 position:absolute;
 left:2.5%
}
.features .slick-arrow.slick-next {
 position:absolute;
 right:2.5%
}
.features .slick-arrow.slick-next:before {
 content:"\f105"
}
@media only screen and (max-width:1024px) {
 .features {
  background:#fff
 }
 .features .feature {
  width:100%;
  float:none;
  clear:both;
  overflow:hidden;
  position:relative;
  background:#d11919;
  margin-bottom:1em
 }
 .features .feature .image {
  margin:0;
  width:40%;
  float:left;
  padding-top:20%
 }
 .features .feature h4 {
  width:60%;
  margin:0;
  position:absolute;
  right:0;
  top:50%;
  -webkit-transform:translateY(-50%);
  transform:translateY(-50%);
  text-align:left;
  padding:0 1em
 }
 .features .feature:nth-child(2n) {
  background:#d11919
 }
 .features .feature:nth-child(3n) {
  background:#d11919
 }
 .features .feature:nth-child(4n) {
  background:#d11919
 }
}
@media only screen and (max-width:768px) {
 .features {
  padding:25px 0;
  margin:0
 }
 .features .feature {
  margin-bottom:12px
 }
 .features .feature h4 {
  font-size:.8em
 }
 .features .feature:nth-of-type(2) {
  margin-bottom:0
 }
 .features .feature:nth-of-type(n+3) {
  display:none
 }
}
.button {
 letter-spacing:.2em;
 display:inline-block;
 background: rgba(0, 0, 0, 0.75);
 margin-top: 1em;
 padding:1em 2em;
 position:relative;
 border-left:1px solid #fff;
 border-right:1px solid #fff;
 color:#FFF;
 font-size: 1em;
 text-decoration:none;
 text-transform:uppercase;
 font-weight:500;
 transition:border-color-left .2s ease .4s,border-color-right .2s ease .2s
}
.button:after,.button:before {
 content:"";
 position:absolute;
 display:block;
 height:1px;
 left:0;
 right:0;
 z-index:5;
 width:100%;
 background:linear-gradient(90deg,#fff 0,#fff 98%,#fff 99%,#fff);
 max-width:100%
}
.button:before {
 top:0;
 right:auto;
 transition:max-width .2s ease
}
.button:after {
 bottom:0;
 left:auto;
 height:1px;
 -webkit-transform:none;
 transform:none;
 transition:max-width .2s ease .2s
}
.button:hover {
 cursor:pointer;
 border-left:1px solid transparent;
 border-right:1px solid transparent;
 color:#FFF;
 transition:border-left .1s ease .1s,border-right .1s ease .2s,background .1s ease .2s,color .2s ease-in
}
.button:hover:after,.button:hover:before {
 max-width:0
}

.newsEventButton a {
  background-color: black;
  color: white;
  padding: .25em .5em;
  text-decoration: none;
  text-transform: uppercase;
}

.newsEventButton a:hover {
  background-color: #555;
}

.newsEventButton a:active {
  background-color: black;
}

.newsEvent a {
  color: black;
  text-decoration: none;
}
hr.newsEvent {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}
    
p.newsEvent {
 font-size: .85em;
 text-decoration:none;
 text-transform:uppercase;
 font-weight:100;
}
h3.newsEvent {
 font-size: 1.3em;
 text-decoration:none;
 text-transform:uppercase;
 font-weight:500;
 margin-top: .3em;
 padding: .2em;
}