/*********************************************
 * Hero Banner
**********************************************/
.twc-hero-banner {
    --hb-spacing-bottom:70px;
    width:var(--twc-100vw); margin-left:calc(-1 * var(--twc-gap-side));
}
.twc-hero-banner__inner {
    position:relative; min-height:100vh;
    padding:calc(var(--twc-header-height) + 20px) 0 var(--hb-spacing-bottom);
}
.twc-hero-banner__thumbnail {overflow:hidden;}
.twc-hero-banner__image-bg {
    height:100%;
    transition:transform 10s ease; transform:scale(1.1);
}
.page-loaded .twc-hero-banner__image-bg {transform:scale(1);}
.twc-hero-banner__image-bg:before {background:rgba(0, 0, 0, .5);}

/* Content */
.twc-hero-banner__content {
    --twc-size-h1:var(--twc-size-60);
    --twc-spacing-heading:40px;
    width:100%;
}
.twc-hero-banner__content-inner {max-width:800px;}
.main_content .twc-hero-banner__content hr {
    border-bottom-color:rgba(255, 255, 255, .2); max-width:385px;
    margin-bottom:var(--twc-spacing-40);
}

/* button scroll */
.twc-hero-banner__scroll-down-button {
    position:absolute; right:var(--twc-gap-side); bottom:55px;
}
.twc-hero-banner__scroll-down-button button {
    font-weight:300; letter-spacing:.05em; position:relative; text-transform:lowercase;
    padding-bottom:25px; background:rgba(255, 255, 25, 0);
}
.twc-hero-banner__scroll-down-button button:before {
    font-family:var(--twc-font-icomoon); content:"\e951";
    font-size:36px; color:var(--twc-color-secondary); line-height:1;
    position:absolute; right:0; bottom:0;
}
.twc-hero-banner__scroll-down-button button:hover {color:var(--twc-color-secondary);}

/*********************************************
 * Hero Banner Responsive
**********************************************/
@media only screen and (max-width:1180px) {
    /* button scroll */
    .twc-hero-banner__scroll-down-button {bottom:var(--twc-gap-container);}
}

@media only screen and (max-width:1024px) {
    .twc-hero-banner__inner {min-height:calc(100vh - 55px);}
    html.safari .twc-hero-banner__inner {min-height:calc(100vh - 55px - 59px);}
    html.brave-browser .twc-hero-banner__inner {min-height:calc(100vh - 55px - 45px);}
}

@media only screen and (max-width:480px) {
    /* hide thumbnail desktop */
    .has-mobile-image .twc-hero-banner__image-bg.desktop {display:none;}
}