/********************************
*IMAGE GRID
********************************/
.twc-image-grid__inner {margin:-18px;}
.twc-image-grid__item {padding:18px;}
.twc-image-grid__item a {display:block;}
.twc-image-grid__item-bg {border-radius:15px; background-color:transparent; overflow:hidden;}
.twc-image-grid__item a:before {
    content:""; position:absolute; top:0; left:0; bottom:0; right:0;
    background:#000; transition:var(--twc-transition); opacity:0;
}
.twc-image-grid__item a:hover:before {opacity:.3;}
.twc-image-grid__item img {width:100%; height:100%;}

/* image size */
.twc-image-grid__item.full {width:100%;}
.twc-image-grid__item.half {width:50%;}
.twc-image-grid__item.third {width:33.33%;}

/* image ratio */
.twc-image-grid__item.full .twc-image-grid__item-inner {padding-top:31.5%;}
.twc-image-grid__item.half .twc-image-grid__item-inner {padding-top:63.5%;}
.twc-image-grid__item.third .twc-image-grid__item-inner {padding-top:72%;}

/********************************
* RESPONSIVE
********************************/
@media only screen and (max-width:1280px) {
    .twc-image-grid__inner {margin:-15px;}
    .twc-image-grid__item {padding:15px;}
}
@media only screen and (max-width:1024px) {
    .twc-image-grid__inner {margin:-10px;}
    .twc-image-grid__item {padding:10px;}
}
@media only screen and (max-width:768px) {
    .twc-image-grid__item.third {width:50%;}
    .twc-image-grid__item:not(.full) .twc-image-grid__item-inner {padding-top:70%;}
    .twc-image-grid__item.full .twc-image-grid__item-inner {padding-top:52%;}
}
@media only screen and (max-width:480px) {
    .twc-image-grid__item {width:100% !important;}
    .twc-image-grid__item-inner {padding-top:68% !important;}
}