﻿#GridContent { background: #f0f0f0; margin-top: 0; }
#SiteGrid { max-width: 100%; background: #f0f0f0; }
h2 { font-size: 220%; line-height: normal; }
h3 { font-size: 300%; line-height: 1; font-weight: 700; }
h4 { font-size: 150%; line-height: 40px; margin-bottom: 30px; }
#GridContent h2 { font-weight: 700; }
.investingAboutSection, .studioLowerGallery { background: #f0f0f0; }
#navbar-top .navbar-nav > li > a.InvestingStudiosBtn:after { width: 100%; }

#lobby { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 89%); -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 89%); }


.investingAboutSection { padding: 115px 0 120px; }
.investingAboutSection .ContentWrapper { display: flex; display: -webkit-box; display: -ms-flexbox; align-items: center; -webkit-box-align: center; -ms-flex-align: center; max-width: 1380px; }
.investingAboutSection .aboutContentInner h2 { margin-bottom: 15px; }

figure.cd-image-container:after { background-image: url(../../../000Frames/site/images/mac-f.png); }
.studioAboutSection { height: 640px; clip-path: polygon(0 0, 100% 70px, 100% 100%, 0 calc(100% - 70px) ); -webkit-clip-path: polygon(0 0, 100% 70px, 100% 100%, 0 calc(100% - 70px) ); }
.studioAboutSection.showItem { }
.studioAboutSection > div { height: 100%; display: flex; display: -webkit-box; display: -ms-flexbox; justify-content: center; -webkit-box-pack: center; -ms-flex-pack: center; align-items: center; -webkit-box-align: center; -ms-flex-align: center; }
.studioContentBox { padding-top: 35px; }
.studioAboutSection .studioAboutRightBox { position: relative; background-size: cover; background-position: -20vw center; background-attachment: fixed; }
.studioAboutSection .studioAboutRightBox:after { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(16, 27, 34, .8); pointer-events: none; }
.studioAboutSection .studioAboutRightBox h2 { position: relative; color: #fea500; font-size: 270%; text-align: center; z-index: 1; margin-top: -35px; }
.studioAboutSection .studioContentBox .studioTxtNum, .studioAboutSection .studioContentBox .studioTxt { display: inline-block; vertical-align: middle; }
.studioAboutSection .studioContentBox .studioTxtNum { width: 60px; font-size: 190%; color: #222; font-weight: 700; margin-right: 10px; text-align: right; border-right: 5px solid #fea500; padding-right: 10px; line-height: 60px; }
.studioAboutSection .studioContentBox .studioTxt { width: calc(100% - 76px); color: #252525; line-height: 1.1; }

.studioAboutSection .studioContentTxt { max-width: 580px; position: relative; display: flex; display: -webkit-box; display: -ms-flexbox; align-items: center; -webkit-box-align: center; -ms-flex-align: center; margin-bottom: 55px; }
.studioAboutSection .studioContentTxt:last-child { margin-bottom: 0; }
.studioContentTxt p { width: 100%; }

.studioLowerGallery { padding: 110px 0 120px; }
.studioLowerGallery h2 { text-align: center; margin-bottom: 50px; }
.studioLowerGallery .brandedContentIcon { background: #fff; margin: 0 10px; padding: 35px 0 0; box-shadow: 8.2px 5.7px 20px 0 rgba(33, 35, 39, 0.08); -webkit-box-shadow: 8.2px 5.7px 20px 0 rgba(33, 35, 39, 0.08); }
.studioLowerGallery .grid-view .brandedContentIcon .grid-box-image img { max-width: 85px; height: auto; }
.studioLowerGallery .grid-view .brandedContentIcon .grid-box-content .grid-box-title { display: inline-block; line-height: 1.1; font-size: 85%; height: 40px; }
.studioLowerGallery .grid-view .brandedContentIcon .grid-box { height: 100%; padding: 0; margin-bottom: 15px; font-family: 'Roboto', sans-serif; font-size: 100%; box-shadow: none; -webkit-box-shadow: none; }
.aboutContentImgBox { width: 64%; }
.aboutContentInner p { font-size: 90%; }
.aboutContentImgBox img.mac-bottom { vertical-align: top; max-width: 778px; margin: 0 auto; display: block; }
figure.cd-image-container .gap { background-color: #f0f0f0; right: -11px; }
figure.cd-image-container .left.gap { right: auto; left: -13px; }
figure.cd-image-container { width: 100%; max-width: 628px; }
figure.cd-image-container .cd-handle { top: 45px; }

@media(min-width:1025px) {
    .studioLowerGallery .brandedContentIcon { width: 150px; height: 150px; }
    .studioLowerGallery .grid-view .brandedContentIcon .grid-box-image { padding-bottom: 0; }
}

@media(max-width: 1550px) {
    figure.cd-image-container { max-width: 550px; }
    .aboutContentImgBox img.mac-bottom { max-width: 660px; }
}

@media(min-width: 992px) {
    .aboutContentBox.col-md-6 { width: 40%; }
}


@media(min-width: 1170px) and (max-width: 1280px) {
    .studioLowerGallery .brandedContentIcon { width: 135px; height: 135px; }
    .studioLowerGallery .grid-view .brandedContentIcon .grid-box-content { margin-top: 10px; }
    .studioLowerGallery .grid-view .brandedContentIcon .grid-box-image { margin-bottom: 0; }
    .studioLowerGallery .grid-view { width: 96%; }
}


@media(max-width: 1024px) {
    .ml-stack-nav__item a.InvestingStudiosBtn:after { opacity: 1; }
    .investingAboutSection .aboutContentInner h2 { margin-bottom: 20px; }
    .studioLowerGallery .brandedContentIcon { padding: 50px 0 35px; margin-bottom: 20px; }
    .studioLowerGallery .grid-view .brandedContentIcon .grid-box-image img { padding-top: 30px; }
    .studioLowerGallery .grid-view .grid-box-image { padding-bottom: 0; }
    figure.cd-image-container { max-width: 500px; }
    .aboutContentImgBox img.mac-bottom { max-width: 570px; }
}

@media(min-width: 768px) and (max-width: 1024px) {
    .studioLowerGallery .brandedContentIcon { display: inline-block; width: 150px; height: 150px; float: none !important; padding: 0; vertical-align: middle; }
    .studioLowerGallery .grid-view { text-align: center; }
    .studioLowerGallery .grid-view .brandedContentIcon .grid-box-image img { max-width: 90px; }
}

@media(max-width: 991px) {
    figure.cd-image-container .cd-handle { top: 24px; height: calc(100% - 17px); }
    figure.cd-image-container .gap { width: 20px; }
    figure.cd-image-container .left.gap { left: -16px; }
    .investingAboutSection { padding: 70px 0 80px; }
    .investingAboutSection .ContentWrapper { flex-direction: column; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; }
    .investingAboutSection .aboutContentBox { order: 1; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; }
    .investingAboutSection .aboutContentImgBox { margin-bottom: 80px; width: 100%; }

    .aboutContentImgBox img.mac-bottom { max-width: 630px; }
    .studioAboutSection { height: auto; background: #fff; clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 97%); -webkit-clip-path: polygon(0 0, 100% 5%, 100% 100%, 0 97%); }
    .studioAboutSection .studioAboutRightBox { height: 450px; clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% calc(100% - 60px)); -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% calc(100% - 60px)); }
    .studioContentBox { padding-top: 0; }
    .studioAboutSection .studioAboutleftBox { padding: 60px 15px 110px 15px; }
    .studioAboutSection .studioContentTxt:last-child { margin-bottom: 0; }

    .studioLowerGallery { padding: 70px 0; }
    .studioLowerGallery .brandedContentIcon { padding: 30px 0 15px; }
    .studioLowerGallery .grid-view .brandedContentIcon .grid-box-image img { height: auto; padding-top: 0; }
}



@media(max-width: 767px) {
    h2 { font-size: 190%; line-height: 1; }

    .investingAboutSection { padding: 60px 0; }
    .investingAboutSection .aboutContentBox { width: 100%; margin-bottom: 0; }
    .investingAboutSection .aboutContentImgBox { padding: 0; margin-bottom: 60px; }
    .aboutContentImgBox img.mac-bottom { width: 100%; }
    .aboutContentInner { font-size: 80%; }
    .investingAboutSection .aboutContentInner h2 { margin-bottom: 10px; }
    figure.cd-image-container { max-width: 80%; }
    figure.cd-image-container .gap { right: -26px; height: calc(100% - -10px); width: 26px; margin-top: -10px; }
    figure.cd-image-container .left.gap { right: auto; left: -25px; }
    figure.cd-image-container .cd-handle { height: calc(100% - 5px); margin-top: -19px; width: 35px; background-size: cover; margin-left: -18px; }
    .studioAboutSection { clip-path: polygon(0 0, 100% 4%, 100% 100%, 0 97%); -webkit-clip-path: polygon(0 0, 100% 4%, 100% 100%, 0 97%); }
    .studioAboutSection .studioAboutRightBox { height: 260px; clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% calc(100% - 40px)); -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% calc(100% - 40px)); }
    .studioAboutSection .studioAboutleftBox { padding: 30px 15px 70px; }
    .studioAboutSection .studioAboutRightBox h2 { font-size: 210%; }
    .studioAboutSection .studioContentBox .studioTxtNum { width: 55px; font-size: 220%; border-right: none; }
    .studioAboutSection .studioContentTxt { padding: 10px 0; margin-bottom: 40px; }
    .studioAboutSection .studioContentTxt:after { content: ''; height: 100%; width: 5px; position: absolute; left: 57px; top: 0; background: #fea500; }
    .studioAboutSection .studioContentBox .studioTxt { font-size: 80%; }

    .studioLowerGallery { padding: 40px 0 60px; }
    .studioLowerGallery .ContentWrapper { padding: 0 10px; }
    .studioLowerGallery .grid-view { position: relative; left: 3px; }
    .studioLowerGallery h2 { margin-bottom: 40px; }
    .studioLowerGallery .brandedContentIcon { width: calc(49vw - 30px); padding: 28px 0 5px; margin: 0px 11px 21px; float: left !important; font-size: 80%; }
    .studioLowerGallery .grid-view .grid-box-image { margin-bottom: 0; padding-right: 0; height: auto; }
    .studioLowerGallery .grid-view .brandedContentIcon .grid-box { margin-bottom: 5px; }
    .studioLowerGallery .grid-view .brandedContentIcon .grid-box-image img { max-width: 25vw; }
    .studioLowerGallery .grid-view .brandedContentIcon .grid-box-content { max-width: 90%; margin: 15px auto 0; height: calc(24vw - 40px); }
    .studioLowerGallery .grid-view .brandedContentIcon .grid-box-content .grid-box-title { height: auto; }
    .grid-view > .row { padding-bottom: 10px; }
}

@media(max-width: 360px) {
    h2 { font-size: 170%; }
}
