/* ========================= Module Configurable Banner Start ======================== */
.ip3-edit .banner-with-parallax-main-wrapper, .ip3-edit .configurable-banner-wrapper {z-index: 0;}
.configurable-banner-main-wrapper .configurable-banner-wrapper{margin-top: 0; height: auto; min-height: 440px; display: flex; align-items: center; width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; overflow: hidden; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.configurable-banner-main-wrapper .small-banner{min-height: 295px;}
.configurable-banner-wrapper::before{content: ''; display: block; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.3); position: absolute; z-index: 0;}
.configurable-banner-wrapper .banner-wrapper{width: 100%; max-width: 1100px; padding-top: 0; margin-left: auto; margin-right: auto; position: relative; z-index: 2;}
.configurable-banner-wrapper .banner-wrapper .banner-wrapper-caption{position: static; display: block; padding-left: 20px; padding-right: 20px;}
.configurable-banner-wrapper .banner-wrapper .banner-wrapper-caption .title{text-transform: uppercase; color: var(--color-ffffff); line-height: 1.1;}
.configurable-banner-wrapper .banner-wrapper .banner-wrapper-caption .h2{font-weight:700;}
.configurable-banner-wrapper .banner-wrapper .banner-wrapper-caption p{color: var(--color-ffffff); font-family: var(--font-roboto-light); margin: 5px; font-size: 2.1vw; line-height: 1;}

@media screen and (max-width: 767px){
  .configurable-banner-main-wrapper .configurable-banner-wrapper{min-height: 183px;}
  .configurable-banner-wrapper .banner-wrapper .banner-wrapper-caption .title{font-size: 2.8rem; margin: 0; line-height: 1.1;}
}

@media only screen and (min-width: 768px) and (max-width: 990px) and (orientation: portrait){
  .configurable-banner-wrapper .banner-wrapper .banner-wrapper-caption p{margin: 5px; font-size: 2.4vw; line-height: 1;}
}

/*** Banner With Parallax ****/
.banner-with-parallax-main-wrapper {height: 668px; position: relative; width: 100%; overflow: hidden;}
.banner-with-parallax-main-wrapper.no-parallax{margin-top: 0; height: 668px; display: flex; align-items: center; width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; overflow: hidden; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.banner-with-parallax-main-wrapper .banner-parallax-desktop-bg{background-position: center center; background-repeat: no-repeat; background-size: cover; float: left; height: 100%; position: fixed; top: 0; width: 100%; /*z-index: 0; background-attachment: fixed;*/ background-position-y: 0; z-index: -1;}
.banner-with-parallax-main-wrapper .banner-parallax-mobile-bg{display:none;}
.banner-with-parallax-main-wrapper .banner-with-parallax-plane{display: block; width: 45%; height: auto; position: absolute; bottom: 0; top: auto; z-index: 1; right: 0; left: auto;}
.banner-with-parallax-main-wrapper .banner-wrapper{position: relative; z-index: 2; padding-top: 200px;}
.banner-with-parallax-main-wrapper.no-parallax .banner-wrapper{padding-top: 0; background: rgba(0, 0, 0, 0.01);}
.banner-with-parallax-main-wrapper .banner-wrapper .banner-caption{vertical-align: middle;}
.banner-with-parallax-main-wrapper .banner-wrapper .banner-caption p{font-family: var(--font-roboto-light); font-size: 2rem; line-height: 1.5; color: var(--color-ffffff); font-weight: 300; margin: 0 0 10px;}
.banner-with-parallax-main-wrapper .description-box h1{margin-top: 0; color: var(--color-ffffff); text-transform: uppercase; max-width: none;}
.banner-with-parallax-main-wrapper.no-parallax .description-box h1{max-width: 600px; text-shadow: 0 0 3px #111;}
.banner-with-parallax-main-wrapper.no-parallax .description-box p{text-shadow: 0 0 3px #111;}
.banner-with-parallax-main-wrapper .description-box p{font-family: var(--font-roboto-regular); font-size: 2rem; line-height: 1.5; color: var(--color-ffffff); font-weight: 400; max-width: 540px; line-height: 1.5; margin: 0;}
.banner-with-parallax-main-wrapper .description-box .secondary-cta{padding: 16px 30px; color: #fff; border: 2px solid #cb0024; background-color: #cb0024; font-size: 1.4rem; line-height: 1.4; letter-spacing: 2px; text-transform: uppercase; text-decoration: none; display: inline-block; transition: all 200ms ease-in-out; margin-top: 20px;}
.banner-with-parallax-main-wrapper .description-box .secondary-cta:hover{color: #cb0024; background-color: transparent;}

@media screen and (min-width: 1800px){
  .banner-with-parallax-main-wrapper .banner-with-parallax-plane{width: 40%;}
}

@media screen and (max-width: 1450px) {
  .banner-with-parallax-main-wrapper .banner-with-parallax-plane{width: 54%;}
}

@media screen and (max-width: 1200px) {
  .banner-with-parallax-main-wrapper{height: 540px;}
  .banner-with-parallax-main-wrapper .banner-with-parallax-plane{width: 60%;}
  .banner-with-parallax-main-wrapper .banner-wrapper{padding-top: 150px;}
}

@media screen and (max-width: 1060px) {
  .banner-with-parallax-main-wrapper, .banner-with-parallax-main-wrapper.no-parallax{height: 470px;}
}

@media screen and (max-width: 991px) {
  .banner-with-parallax-main-wrapper{height: 450px;}
  .banner-with-parallax-main-wrapper .banner-wrapper{padding-top: 120px;}
  .banner-with-parallax-main-wrapper .description-box h1{font-size: 3.0rem;}
  .banner-with-parallax-main-wrapper .description-box p{font-size: 1.6rem;}
  .banner-with-parallax-main-wrapper .banner-parallax-desktop-bg{display: none;}
  .banner-with-parallax-main-wrapper .banner-parallax-mobile-bg{display: block; background-position: center -50px; background-repeat: no-repeat; background-size: cover; float: left; height: 100%; position: fixed; top: 0; width: 100%; /*z-index: 0; background-attachment: fixed;*/ z-index: -1;}
  
  .banner-with-parallax-main-wrapper .banner-wrapper .banner-caption p{font-size:1.6rem;}
}

@media screen and (max-width: 768px) {
  .banner-with-parallax-main-wrapper,.banner-with-parallax-main-wrapper.no-parallax{height: 410px;}
  .banner-with-parallax-main-wrapper .banner-with-parallax-plane{width: 70%;}
  .banner-with-parallax-main-wrapper .banner-wrapper{padding-top: 100px;}
}

@media screen and (max-width: 660px) {
  .banner-with-parallax-main-wrapper .banner-wrapper{max-width: 480px; padding-top: 100px;}
}

@media screen and (max-width: 512px) {
  .banner-with-parallax-main-wrapper{height: 222px;}  
  .banner-with-parallax-main-wrapper.no-parallax{height: 320px;}  
  .banner-with-parallax-main-wrapper .banner-with-parallax-plane{height: 222px;}  
  .banner-with-parallax-main-wrapper .banner-wrapper {padding-top: 40px;}  
  .banner-with-parallax-main-wrapper .description-box h1{margin-bottom: 0;}  
  .banner-with-parallax-main-wrapper .description-box h1 br{display:none;}  
  .banner-with-parallax-main-wrapper.no-parallax .banner-wrapper{padding: 0 4px 0;}
}

@media screen and (max-width: 380px) {
  .banner-with-parallax-main-wrapper .banner-wrapper{max-width: 335px; padding-top: 50px;}
}
/* ========================= Module Configurable Banner End ======================== */



/* ========================= Module Video Banner Start ======================== */

.video-banner-main {height: 668px; position: relative; width: 100vw; overflow: hidden; background-size: cover;}
.video-banner-wrapper{position: absolute; display: flex; height: 100%; z-index:1; width: 100%; justify-content: center; align-items: center;}

h1.video-banner-title {text-transform: uppercase; color: #fff; max-width: 590px; text-shadow: 0 0 3px var(--color-111111);}
p.video-banner-text {margin: 0px 0px 10px;}
.video-banner-text {color: #FFFFFF; text-shadow: 0 0 3px #111; max-width: 590px; margin-left: 0; text-align: left;}
.video-banner-main .banner-video {position: relative; padding-bottom: 56.25%; height: 0; top:0; display: inline-block; width: 100%;}
.video-banner-main .banner-video iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
iframe {border: 0; display: block; overflow: hidden;}

/* Media query for content*/

@media screen and (max-width: 1200px) {
  .video-banner-content {max-width:840px;}
}

@media screen and (max-width: 992px) {
  .video-banner-content {max-width:724px;}
}

@media screen and (max-width: 768px) {
  .video-banner-content {max-width:620px;}
}

@media screen and (max-width: 660px) {
  .video-banner-content {max-width:480px;}
}

@media screen and (max-width: 512px) {
  .video-banner-content {max-width:374px;}
}

@media screen and (max-width: 370px) {
  .video-banner-content {max-width:310px;}
}
@media (max-width:767px) {
  h1.video-banner-title {font-size: 3rem; line-height: 1.2;}
}

/* media query for video */
@media screen and (max-width: 1200px) {
  .video-banner-main {height:540px;}
}

@media screen and (max-width: 992px) {
  .video-banner-main {height:450px;}
}

@media screen and (max-width: 768px) {
  .video-banner-main {height:420px;}
}

@media screen and (max-width: 767px) {
  .video-banner-main {height:auto;}
}
/* ========================= Module Video Banner End ======================== */
