.moreGrid{padding: 100px 10px 10px;}
.moreGrid h2{font-size: 80px; line-height: 80px; text-align: center; padding-bottom: 30px;}
.moreGrid_list{margin: 0px -10px 0px 0px;}
.moreGrid_list > ul{display: flex; width: 100%;}
.moreGrid_list > ul > li{padding: 10px 10px 0px 0px; width: calc(100% / 3);}
.moreGrid_list > ul > li.youtubeTablet{display: none}
.moreGrid_listBottom > ul{flex-direction: row-reverse;}

.moreGrid_orangeGrid{margin-right: -10px; margin-top: -10px; width: calc(100% + 10px); height: calc(100% + 10px);}
.moreGrid_orangeGrid > ul{display: flex; flex-wrap: wrap; width: 100%; height: 100%;}
.moreGrid_orangeGrid > ul > li{padding: 10px 10px 0px 0px; width: calc(100% / 3);}
.moreGrid_orangeGrid > ul > li > div{display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; width: 100%; height: 100%; background-color: #fbb903; padding: 0px 5px;}
.moreGrid_orangeGrid > ul > li > div strong{font-weight: 700; font-size: 48px; line-height: 48px; padding-bottom: 10px;}
.moreGrid_orangeGrid > ul > li > div span{font-weight: 500; font-size: 20px;}

.moreGrid_frame{position: relative; overflow: hidden;}
.moreGrid_frameImage{position: relative;}
.moreGrid_frameImage img{display: block; width: 100%;}
.moreGrid_frameImage:after{content: ''; position: absolute; left: 0; right: 0; top: 0; bottom: 0;
    background: -moz-linear-gradient(top,  rgba(19,27,50,0) 0%, rgba(19,27,50,0) 42%, rgba(19,27,50,1) 95%, rgba(19,27,50,1) 100%);
    background: -webkit-linear-gradient(top,  rgba(19,27,50,0) 0%,rgba(19,27,50,0) 42%,rgba(19,27,50,1) 95%,rgba(19,27,50,1) 100%);
    background: linear-gradient(to bottom,  rgba(19,27,50,0) 0%,rgba(19,27,50,0) 42%,rgba(19,27,50,1) 95%,rgba(19,27,50,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00131b32', endColorstr='#131b32',GradientType=0 );
}
.moreGrid_frameTitle{position: absolute; right: 0; bottom: 0; font-size: 36px; font-weight: 700; color: white; padding: 0px 6.4% 26px 0px; opacity: 1; transition: all 0.4s ease-in-out;}
.moreGrid_frameTitle[aria-hidden="true"]{display: block;}
.moreGrid_frameTitle span:nth-child(2){display: none;}
.moreGrid_frame:hover .moreGrid_frameTitle, .moreGrid_frame:focus .moreGrid_frameTitle{opacity: 0;}
.moreGrid_framePanel{position: absolute; left: 0; right: 0; top: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; padding: 10px 6.4% 10px 6.4%; background-color: rgba(30, 43, 81, 0.88); color: white; transition: all 0.4s ease-in-out;}
.moreGrid_frame:hover .moreGrid_framePanel, .moreGrid_frame:focus .moreGrid_framePanel{top: 0;}
.moreGrid_framePanel h3{font-size: 36px; font-weight: 700;}
.moreGrid_framePanel ul{font-size: 20px; line-height: 24px; padding-top: 22px;}
.moreGrid_framePanel li{padding: 0px 28px 12px 0px; position: relative;}
.moreGrid_framePanel li:before{position: absolute; right: 0; top: 0; display: block; content: '\e905'; font-family: 'icomoon' !important; color: #fbb903; font-size: 18px;}

.videoPlaceholder {
    position: relative;
    overflow: hidden;
    background-color: #1e2b51;
}

.videoPlaceholder img {
    display: block;
    width: 100%;
    opacity: 0.75;
}

.videoPlaceholder i {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 66px;
    color: #fbb903;
}

.videoPlaceholder a:hover img, .videoPlaceholder a:focus img {
    opacity: 1;
}

.videoPlaceholder a:hover i, .videoPlaceholder a:focus i {
    color: white;
}
.videoHolder{position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;}
.videoHolder iframe{position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 0px;}

@media screen and (max-width: 1600px) {
    .moreGrid{padding-top: 66px}
    .moreGrid_orangeGrid > ul > li > div strong{font-size: 40px; line-height: 40px;}
    .moreGrid_orangeGrid > ul > li > div span{font-size: 16px;}
    
    .moreGrid_frameTitle{font-size: 30px;}
    .moreGrid_framePanel h3{font-size: 30px;}
    .moreGrid_framePanel ul{font-size: 16px; line-height: 20px; padding-top: 14px;}
}

@media screen and (max-width: 1400px) {
    .moreGrid{padding-top: 36px}
    .moreGrid h2{font-size: 64px; line-height: 64px;}

    .moreGrid_frameImage img, .videoPlaceholder img{width: auto; height: 255px;}
}

@media screen and (max-width: 1280px) {
    .moreGrid_orangeGrid > ul > li > div strong{font-size: 32px; line-height: 36px; padding-bottom: 6px;}
    .moreGrid_orangeGrid > ul > li > div span{font-size: 14px; font-weight: 400;}
}

@media screen and (max-width: 1024px) {
    .moreGrid h2{font-size: 54px; line-height: 54px;}
    
    .moreGrid_list > ul{flex-wrap: wrap;}
    .moreGrid_list > ul > li{width: 50%;}
    .moreGrid_list > ul > li.youtubeDesktop{display: none}
    .moreGrid_list > ul > li.youtubeTablet{display: block}
    
    .moreGrid_frameImage img, .videoPlaceholder img{width: 100%; height: auto;}
}

@media screen and (max-width: 885px) {
    .moreGrid_frameImage img, .videoPlaceholder img{width: auto; height: 255px;}
}

@media screen and (max-width: 768px) {
    .moreGrid h2{font-size: 48px; line-height: 44px;}
    .moreGrid_orangeGrid > ul > li > div strong{font-size: 30px;}
}

@media screen and (max-width: 670px) {
    .moreGrid h2{font-size: 40px; line-height: 44px;}
    .moreGrid{padding: 36px 20px 10px;}
    .moreGrid_list{margin: 0px -6px 0px 0px;}
    .moreGrid_list > ul > li{padding: 6px 6px 0px 0px;}

    .moreGrid_orangeGrid{margin-right: -6px; margin-top: -6px; width: calc(100% + 6px); height: calc(100% + 6px);}
    .moreGrid_orangeGrid > ul > li{padding: 6px 6px 0px 0px;}

    .moreGrid_frameTitle{font-size: 24px;}
    .moreGrid_framePanel h3{font-size: 24px;}
    .moreGrid_framePanel ul{font-size: 14px; line-height: 18px; padding-top: 10px;}
}

@media screen and (max-width: 600px) {
    .moreGrid_list > ul > li{width: 100%;}
    .moreGrid_list > ul > li.youtubeDesktop{display: block;}
    .moreGrid_list > ul > li.youtubeTablet{display: none;}
    .moreGrid_list > ul > li.orangeGrid_li{height: 200px;}
    .moreGrid_frameImage img, .videoPlaceholder img{width: 100%; height: auto;}
    .moreGrid_orangeGrid > ul > li > div{padding-top: 20px; justify-content: flex-start;}
}

@media screen and (max-width: 480px) {
    .moreGrid h2{font-size: 40px; line-height: 44px;}
    
    .moreGrid_frameTitle{left: 0; text-align: center; font-size: 18px; padding: 0px 20px 12px 20px;}
    .moreGrid_frameTitle:after{display: inline-block; margin-right: 6px; content: '\e900'; font-family: 'icomoon' !important; font-size: 10px; transform: rotate(90deg);}
    .moreGrid_frameTitle[aria-expanded="true"] span:nth-child(1){display: none;}
    .moreGrid_frameTitle[aria-expanded="true"] span:nth-child(2){display: inline;}
    .moreGrid_frameTitle[aria-expanded="true"]:after{transform: rotate(-90deg);}
    
    .moreGrid_framePanel{display: none; position: static; height: auto; transition: none; padding: 20px 6.4% 38px; background-color: rgba(30, 43, 81, 1);}
    .moreGrid_framePanel[aria-hidden="false"]{display: block;}
    .moreGrid_frame:hover .moreGrid_frameTitle, .moreGrid_frame:focus .moreGrid_frameTitle{opacity: 1;}
}

@media screen and (max-width: 432px) {
    .moreGrid h2{font-size: 30px; line-height: 36px;}
    .moreGrid_orangeGrid > ul > li > div{padding-top: 12px;}
    .moreGrid_orangeGrid > ul > li > div span{padding: 0px 5px;}
}