.hmb-media-container{--imgGridGap: 32px;--ocWidth: 80px;--ocHeight: 150px;--grid-img-full: calc(100% - calc(var(--imgGridPad) * 2));--grid-img-full-active: calc( 100% - (var(--imgGridPad) * 2 + var(--imgGridGap) + var(--ocWidth)) );--grid-img-half: calc( calc(100% - calc(var(--imgGridPad) * 2 + var(--imgGridGap))) / 2 )}@media (min-width: 1024px){.hmb-media-container{min-height:var(--contentCardH);--imgGridPad: 56px}}.two-grid .media-grid-item{height:calc((var(--contentCardH) - (var(--imgGridPad) * 2 + var(--imgGridGap))) / 2)}.two-grid.horizontal-grid .media-grid-item{width:var(--grid-img-full)}.two-grid.horizontal-grid .media-grid-item:last-child{bottom:var(--imgGridPad)}.two-grid.horizontal-grid .anim-container-first .media-grid-item.anim-item-active-first{--totalGaps: calc( var(--ocHeight) + calc(var(--imgGridPad) * 2) + var(--imgGridGap) );height:calc(100% - var(--totalGaps))}.two-grid.horizontal-grid .anim-container-first .media-grid-item:not(.anim-item-active-first){height:var(--ocHeight)}.two-grid.horizontal-grid .anim-container-second .media-grid-item.anim-item-active-second{--totalGaps: calc( var(--ocHeight) + calc(var(--imgGridPad) * 2) + var(--imgGridGap) );height:calc(100% - var(--totalGaps))}.two-grid.horizontal-grid .anim-container-second .media-grid-item:not(.anim-item-active-second){height:var(--ocHeight)}.two-grid.vertical-grid .media-grid-item{width:var(--grid-img-half);height:calc(100% - var(--imgGridPad) * 2)}.two-grid.vertical-grid .media-grid-item:last-child{right:var(--imgGridPad)}.two-grid.vertical-grid .anim-container-first .media-grid-item.anim-item-active-first{width:var(--grid-img-full-active)}.two-grid.vertical-grid .anim-container-first .media-grid-item:not(.anim-item-active-first){width:var(--ocWidth)}.two-grid.vertical-grid .anim-container-second .media-grid-item.anim-item-active-second{width:var(--grid-img-full-active)}.two-grid.vertical-grid .anim-container-second .media-grid-item:not(.anim-item-active-second){width:var(--ocWidth)}.three-grid .media-grid-item{width:var(--grid-img-half);height:calc((var(--contentCardH) - (var(--imgGridPad) * 2 + var(--imgGridGap))) / 2)}.three-grid.top .media-grid-item.rem-anim-from-sec{right:var(--imgGridPad)}.three-grid.top .media-grid-item:first-child{width:var(--grid-img-full);right:var(--imgGridPad)}.three-grid.top .media-grid-item:not(:first-child){bottom:var(--imgGridPad)}.three-grid.top .media-grid-item:last-child{right:var(--imgGridPad)}.three-grid.top .anim-container-first .media-grid-item.anim-item-active-first{--totalGaps: calc( var(--ocHeight) + calc(var(--imgGridPad) * 2) + var(--imgGridGap) );height:calc(100% - var(--totalGaps))}.three-grid.top .anim-container-first .media-grid-item:not(.anim-item-active-first){height:var(--ocHeight)}.three-grid.top .anim-container-first .media-grid-item:last-child{right:var(--imgGridPad)}.three-grid.top .anim-container-second .media-grid-item.anim-item-active-second{height:calc(var(--contentCardH) - var(--imgGridPad) * 2);width:var(--grid-img-full-active)}.three-grid.top .anim-container-second .media-grid-item:not(.anim-item-active-second){width:var(--ocWidth);right:var(--imgGridPad)}.three-grid.top .anim-container-third .media-grid-item.rem-anim-from-new:first-child,.three-grid.top .anim-container-third .media-grid-item:first-child{right:calc(100% - (var(--imgGridPad) * 2 + 24px));left:auto}.three-grid.top .anim-container-third .media-grid-item.anim-item-active-third{height:calc(var(--contentCardH) - var(--imgGridPad) * 2);width:var(--grid-img-full-active)}.three-grid.top .anim-container-third .media-grid-item:not(.anim-item-active-third){width:var(--ocWidth);left:var(--imgGridPad)}.three-grid.bottom .media-grid-item.rem-anim-from-sec~.media-grid-item:not(.anim-item-active-second){left:var(--imgGridPad)}.three-grid.bottom .media-grid-item:last-child{width:calc(100% - var(--imgGridPad) * 2);bottom:var(--imgGridPad);right:var(--imgGridPad)}.three-grid.bottom .media-grid-item:nth-child(2){right:var(--imgGridPad);left:auto!important}.three-grid.bottom .anim-container-first .media-grid-item.anim-item-active-first{height:calc(var(--contentCardH) - var(--imgGridPad) * 2);width:var(--grid-img-full-active)}.three-grid.bottom .anim-container-first .media-grid-item:not(.anim-item-active-first){width:var(--ocWidth);right:var(--imgGridPad)}.three-grid.bottom .anim-container-second .media-grid-item.anim-item-active-second{height:calc(var(--contentCardH) - var(--imgGridPad) * 2);width:var(--grid-img-full-active)}.three-grid.bottom .anim-container-second .media-grid-item.anim-item-active-second+.media-grid-item{right:calc(100% - (var(--imgGridPad) * 2 + 24px))}.three-grid.bottom .anim-container-second .media-grid-item:not(.anim-item-active-second){width:var(--ocWidth)}.three-grid.bottom .anim-container-third{--ocHeight: 150px}.three-grid.bottom .anim-container-third .media-grid-item.anim-item-active-third{--totalGaps: calc( var(--ocHeight) + calc(var(--imgGridPad) * 2) + var(--imgGridGap) );height:calc(100% - var(--totalGaps))}.three-grid.bottom .anim-container-third .media-grid-item:not(.anim-item-active-third){height:var(--ocHeight)}.media-grid-item{position:absolute;height:100%;width:100%;transition:all .65s}
