@import "../assets/css/download.css";


#mainBanner.bannerSeminar, #mainBanner.bannerOffshore {
    background: url(/mc03/assets/images/offshore-mutualfund/img-banner-offshore-d.jpg) no-repeat;
    background-size: cover;
    background-position-y: 48px;
}
.bannerOffshore .bannerHeader-LvOne {
	text-shadow: 4px 4px black;
}	

.bannerSeminar .bannerHeader-wrapper,
.bannerOffshore .bannerHeader-wrapper {
	height: 404px;
	line-height: 404px;
}
.bannerOffshore .bannerHeader-LvOne {
	font-size: 80px;
	color: #FFF;
	text-align: left;
	line-height: 1;
	top: initial;
}
.contentHeader-LvOne{
	
}
.yt-icon {
	float: right;
	width: 64px;
	margin-top: -15px;
	margin-right: -35px;
}
.sub-grey {
	color: #6D6E71;
	font-family: "DB Heavent";
	font-size: 25px;
	font-style: normal;
	font-weight: 500;
	line-height: 40px;
}
.card-height {
	height: 90px;
}
.nav-link:before {
	content: "";
	width: 16px;
	height: 16px;
	display: inline-block;
	border-radius: 60px;
	border: 3px solid #ddd;
	margin-right: 5px;
}
.nav-link.active:before {
	content: "";
	width: 16px;
	height: 16px;
	background-color: #F37021;
	display: inline-block;
	border-radius: 60px;
	border: 3px solid #ddd;
}
.nav-tabs .nav-item {
	margin-bottom: -1px;
	width: 50%;
	text-align: center;
}
.nav-tabs .nav-link {
	border: none !important;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	color: black !important;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
	background-color: #002561;
	border-color: #dee2e6 #dee2e6 #fff;
	border-radius: 10px 10px 0px 0px;
	color: white !important;
}
#iframe-1 {
width: 100%;
}
#iframe-2 {
width: 100%;
}
.downloadWrapper .card-header.active .btn, .downloadWrapper .card-header .btn.collapsed:hover {
	font-family: "DB Heavent Ori Med" !important;
	font-weight: 100 !important;
}
.downloadWrapper .card-header .btn {
	font-family: "DB Heavent Ori Med";
}
.btn-w180 {
	width: 280px !important;
	border-radius: 2.75rem;
	padding: 0.25rem;
}
.img-pdf-grey {
	border: 1px solid #dee2e6 !important;
}
.download-program .card:last-child,
.download-manual .card:last-child,
.download-application .card:last-child,
.download-form .card:last-child {
	padding: 0;
}
.q1-padding {
	padding-top: 70px;
	padding-bottom: 70px;
	display: flex;
	margin: auto;
	justify-content: space-between;
}
.q2-padding {
	padding-top: 48px;
	padding-bottom: 48px;
	margin: auto;
	justify-content: space-between;
}
.q1-mg {
	font-size: 20px;
	color: black;
}
.q1-padding2 {
	padding-bottom: 70px;
	display: flex;
	margin: auto;
	justify-content: space-between;
}
.font-weight-bold {
	font-family: "DB Heavent Ori Med";
	font-weight: normal;
}
.fon-weight-normal {
	font-family: "DB Heavent";
	font-weight: normal;
}
.downloadWrapper {
	counter-reset: faq;
}
.downloadWrapper h5 .btn-link::before {
	counter-increment: faq;
	content: counter(faq);
	width: 40px;
	height: 40px;
	display: inline-block;
	text-align: center;
	border-radius: 50px;
	background: #F37021;
	color: #FFF;
	line-height: 41px;
	margin-right: 15px;
}
.fs-bg-orange-b {
	background-color: #f37021;
}
.bannerOffshore .bannerHeader-LvOne{
	text-align: right;
}
.row.offsh-item-wraper {
	row-gap: 70px;
	padding: 100px 0 0;
}
.list-group {
	flex-wrap: wrap;
}
.list-group-item {
	border: none;
	background-color: transparent;
	padding: 10px 12px;
}
.offsh-filter-wrapper .btn-filter {	
	border-radius: 50px;
	border: 1px solid #6973A0;
	background: #FFF;
	color: #000;
	text-align: center;
	font-family: "DB Heavent";
	font-size: 26px;
	font-style: normal;
	font-weight: 400;
	line-height: 40px;
	padding: 4px 32px;
}
.offsh-filter-wrapper .btn-filter.active,
.offsh-filter-wrapper .btn-filter:hover {
	background: #6973A0;
	color: #FFF;
}
.list-header h5 {
	color: #FFF;
}
.offsh-item {
	display: block;
	opacity: 1;
	transition: opacity .3s, display .3s allow-discrete;
}
.hide {	
	display: none;
	opacity: 0;
	transition: opacity 1s,	display 1s allow-discrete;
}
@starting-style {
	.offsh-item {
		opacity: 0;
	}
}
.why-container {
	padding-top: 75px;
	padding-bottom: 50px;
}
.why-wrapper {
	border-radius: 20px;
	border: 1px solid #D9D9D9;
	background: url(/mc03/offshore-mutualfund/image/bg-why.png) no-repeat;
	background-blend-mode: normal, normal, soft-light, normal;
	background-position-y: -100px;
	background-size: 225%;
	background-position: center;
	/*box-shadow: 0px 4px 100px 5px rgba(0, 0, 0, 0.20);*/
	padding: 80px 24px 48px 24px;
	position: relative;
}
.why-wrapper .img-why-icon {
	position: absolute;
	top: -72px;
	left: 50%;
	transform: translate(-50%, 0px);
	width: 124px;
	height: 124px;
	border-radius: 100px;
	background: url("/mc03/offshore-mutualfund/image/icon-why1.png") no-repeat #d1d1d1;
}
.why-wrapper h3 {
	text-align: center;
	color: #FFF;
	font-family: 'DB Heavent Light';
}
.why-wrapper h4 {
	color: #FFF;
	font-family: 'DB Heavent Light';
}
#carouselWhyIndicators .carousel-indicators {
	position: absolute;
}
#carouselWhyIndicators .carousel-indicators li {
	width: 10px;
	height: 10px;
	margin-right: 10px;
	border-radius: 100px;
	background: #D9D9D9;
}
#carouselWhyIndicators .carousel-indicators li.active {
	background: #6973A0;
}
.grid-container-list .grid-list {
	/* min-width: 440px;
	min-height: 320px; */
	background-position-y: -100px;
	/* background-size: 225%; */
}
.grid-container-list .grid-list img.img-why-icon {
	width: 124px;
	height: 124px;
	border-radius: 100px;
	background: url("/mc03/offshore-mutualfund/image/icon-why1.png") no-repeat #d1d1d1;
}
.count-number-reset {
	counter-reset: countnum;
}
.count-number {
	text-align: left;
}
.count-number:before {	
	counter-increment: countnum;
	content: counter(countnum) " .";
}
.font-color-red {
	color: rgb(255, 0, 0);
}


@media (min-width: 786px) {
	.grid-container-list .grid-list {
		background-blend-mode: color;
		background-color: #ffffff4a;
	}
	.grid-container-list .grid-list:hover {
		background-color: transparent;
	}
	.grid-container-list .grid-list img.img-why-icon {
		/* background-blend-mode: lighten; */
		background-image: url("/mc03/offshore-mutualfund/image/icon-why1-inactive.png");
	}
	.grid-container-list .grid-list:hover img.img-why-icon {
		/* background-blend-mode: normal; */
		background-image: url("/mc03/offshore-mutualfund/image/icon-why1.png");
	}
}

@media screen and (orientation: portrait) and (max-width: 662px){
	.img-pdf, .downloadWrapper .content .img-pdf {
		width: 40%;
	}
	#mainBanner.bannerOffshore {
		background: url(/mc03/assets/images/offshore-mutualfund/img-banner-offshore-m.png) no-repeat;
		background-position-x: center;
		background-size: cover;
		background-position-y: top;
	}	
	
}

@media screen and (max-width: 454px) and (orientation : portrait) {
	.mobile-fix .text-left {
		text-align: center !important;
	}

	.mobile-fix .text-right {
		text-align: center !important;
		margin-bottom: 20px !important;
	}

	.mobile-fix .fs-grey-bg {
		background-color: white !important;
	}
}
@media screen and (orientation: landscape) and (max-width: 992px){
	#mainBanner.bannerSeminar, #mainBanner.bannerOffshore {
		background: url(/mc03/assets/images/offshore-mutualfund/img-banner-offshore-d.jpg) no-repeat;
		background-position-x: -400px;
		background-size: cover;
		background-position-y: -16px;
	}
	
    .bannerOffshore .bannerHeader-LvOne {
        text-shadow: 4px 4px black;
    }	
}
@media screen and (orientation: portrait) and (min-width: 663px) and (max-width: 992px){
	#mainBanner.bannerSeminar, #mainBanner.bannerOffshore {
		background: url(/mc03/assets/images/offshore-mutualfund/img-banner-offshore-d.jpg) no-repeat;
		background-position-x: -400px;
		background-size: cover;
		background-position-y: 0px;
	}
	
    .bannerOffshore .bannerHeader-LvOne {
        text-shadow: 4px 4px black;
    }	
}

@media screen and (orientation: landscape) and (max-width: 760px){
	.grid-container-list {
		grid-template-columns: repeat(1, 1fr) !important;
	}	
}

@media screen and (orientation: landscape) and (min-width: 993px) and (max-width: 1024px){
	#mainBanner.bannerSeminar, #mainBanner.bannerOffshore {
		background: url(/mc03/assets/images/offshore-mutualfund/img-banner-offshore-d.jpg) no-repeat;
		background-size: cover;
		background-position-y: 48px;
		background-position-x: -280px;
	}
}

@media (max-width: 760px) {
	.list-group {
		flex-wrap: nowrap;
		width: max-content;
	}
	.offsh-filter-wrapper {
		overflow-x: scroll;
	}
}

@media (max-width: 500px) {
	.why-wrapper {
		min-height: 330px;
	}
}