.header-banner .header-banner-title {
    color: #fff;
    background-color: #F37021;
    padding: 18px 36px 10px 36px;
    text-decoration: none;
    font-size: 18px;
    font-family: 'Raleway', 'Microsoft JhengHei', system-ui, sans-serif;
    font-weight: 800;
    display: block;
    margin: 0;
}

.header-banner .header-banner-text {
    color: #fff;
    background-color: #F37021;
    padding: 0px 36px 16px 36px;
    text-decoration: none;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    display: block;
    margin: 0;
}


/* Mobile Container CSS */

.body-container-m {
    background-color: #FFF9F4;
}

.bluRr {
    opacity: 40%;
}

.vidcontainers {
    margin: 50px 0;
}

.timer-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.footer-wrap-m {
    margin-bottom: 80px;
}

.footer-m {
    margin: 20px 40px;
}

.footer-m>p {
    margin-top: 40px;
    margin-bottom: 30px;
}

.footer-m img {
    /*height: 70px;*/
	max-width: 100%;
}

@media (min-width: 992px) and (max-width: 1280px) {
	.nav-container {
		max-width: 850px;
	}
	.nav-container .nav-item {
		max-width: 220px;
	}
}

@media screen and (max-width: 1200px) {
    .header-banner-title-1:lang(zh-TW) {
        margin-left: -18px;
    }
    .header-banner {
        padding-top: 155px;
        background-color: #F37021;
        width: 100%;
        margin: 0;
    }
}


@media screen and (max-width: 1200px) {
    body {
        overflow-x: visible;
    }
    .header-and-nav {
        display: none !important;
    }
    .footer {
        display: none !important;
    }
    .mobile-view {
        display: block;
        min-width: 560px;
    }
    .body-container {
        background-color: #FFF9F4;
        justify-content: center;
        margin: unset;
    }
    .white-container {
        max-width: none;
        margin-top: 0;
    }
    .header-banner-title-1:lang(zh-TW) {
        margin-left: -18px;
    }
    .grid-4vidcontainer {
        height: initial;
        margin: 0;
        width: 100%;
        background-color: #FFF9F4;
        justify-content: center;
    }
    .grid-2vidcontainer {
        background-color: #FFF9F4;
        justify-content: center;
        align-content: center;
    }
    .grid-2vidcontainer .row {
        justify-content: center;
    }
    .white-container-title {
        padding: 0%;
        margin-top: -4px;
    }
    .white-container-title-colored::after {
        display: none;
    }
    .white-container-title-colored {
        background-color: #FFECE0;
        color: #F37021;
        height: 60px;
        margin: 0;
        padding: 10px 0px 18px 0px;
        border-top: 8px solid #F37021;
    }
    .white-container-title-colored>p {
        scroll-margin-top: 175px;
        padding: 0;
        text-align: left;
        padding-left: 28px;
        background-color: #FFECE0;
    }
    /* p#best-practice-sharing-anchor {
        padding-top: 172px;
        margin-top: -172px;
    } */
    .white-container-title-text {
        color: #F37021;
        font-family: 'Raleway', 'Microsoft JhengHei', system-ui, sans-serif;
        font-weight: 600;
        font-size: 20px;
    }
    .expand-button-div-collapsed {
        background-color: #FFF9F4;
    }
    .grid-2vidcontainer.show .row {
        height: unset;
        margin: 0;
        justify-content: center;
    }
    .grid-2vidcontainer.collapsing .row {
        margin: 0;
    }
    .flexbox-hover:hover .flexbox-shadow {
        background: #B0A89D;
        z-index: 0;
        position: absolute;
        width: 80%;
        height: 110%;
        /* transition: 0.3s ease-in-out; */
        /* transform: translateX(12.5%); */
    }
    /* video container mobile css */
    .flexbox-bigwrap {
        max-width: 450px;
		width: 100%;
    }
    .flexbox-padding {
        max-width: 450px;
		width: 100%;
    }
	.flexbox-wrap {
		width: 100%;
	}
    .videocss {
        max-height: none;
    }
    .flexbox-text {
        min-height: 160px;
    }
    .image-stack_item-top {
        top: 112px;
        left: 45%;
    }
    #JC-Clap-Logo {
        height: unset; /*78px; */
        width: unset; /* 100% */
        max-width: 100%;
		max-height: 70px;
    }
    .mobile-header {
        overflow: hidden;
        background-color: #fff;
        padding-top: 35px;
        padding-bottom: 0px;
    }
    .container-fluid {
        padding: 0;
        /*min-width: 560px;*/
    }
    .mobile-header #navHeader {
        width: 100%;
        display: block;
    }
    .mobile-header .m-lang-switcher {
	    position: static !important;
    }
    .mobile-header #mobileNavButton {
	    position: static !important;
    }
    .mobile-header #navHeader.collapse:not(.show) {
        display: none;
    }
    .mobile-header #navHeader.collapse.show {
        display: block;
    }
    .mobile-header>a {
        color: #333;
        background-color: #fff;
        padding: 22px 16px 28px 16px;
        text-decoration: none;
        font-size: 17px;
        display: block;
    }
    .mobile-header>a.imgarea {
        color: #333;
        background-color: #fff;
        /*padding: 26px 190px 14px 25px;*/
	flex:1;
        text-decoration: none;
        font-size: 17px;
        display: block;
    }
    #navHeader>a {
        color: #fff;
        background-color: #F37021;
        padding: 25px 16px;
        text-decoration: none;
        font-size: 18px;
        font-family: 'Raleway', 'Microsoft JhengHei', system-ui, sans-serif;
        font-weight: 800;
        display: block;
	width: 100%;
	white-space: normal;
    }
    .mobile-header a.icon {
        background: #fff;
        display: block;
        position: absolute;
        right: 20px;
        top: 55px;
    }
    .mobile-header a.icon>img {
        height: 47px;
    }
    .active {
        background-color: #04AA6D;
        color: white;
    }
    .header-banner {
        padding-top: 155px;
        background-color: #F37021;
        width: 100%;
        margin: 0;
    }
    .pdfcontainer {
        margin-top: 1em;
    }
}


@media screen and (max-width: 413px) {
    .header-banner-title {
        height: 82px;
    }
    .white-container-title {
        margin-top: -2px;
    }
}

@media screen and (max-width: 480px) {
    
    .header-banner-text {
        height: 58px;
    }
}

.modal-backdrop.show {
	width: 100%;
    height: 100%;
}
#langMenuModal.modal {
	padding-right: 0px !important;
}
#langMenuModal.modal.show {
	padding-right: 0px !important;
	display: flex !important;
    justify-content: center;
    align-items: center;
}
#langMenuModal.modal .modal-content {
	background: #424242;
    padding: 15px;
    border-radius: 20px;
}
#langMenuModal.modal .modal-content form {
	font-size: 35px;
	color: white;
}
.lang-radio-item {
	display: flex; 
	align-items: center;
}
.lang-radio-item input {
	margin-right: 20px;
}