.hi-categories { display: -webkit-flex; -webkit-justify-content: center; -webkit-flex-flow: row wrap; display: flex; justify-content: center; flex-flow: row wrap; }
.hi-category { margin: 10px; }
.hi-title { position: absolute; top: 0; margin: 10px; font-size: 2em; }

.hi-box { position: relative; }
    .hi-box::before { content: ''; position: absolute; width: 100%; height: 140px; bottom: 0; left: 0; transition: all 0.3s; }
    .hi-box figure { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 10; }
        .hi-box figure > img { position: absolute; left: 0; bottom: 0; transition: all 0.3s; }
        .hi-box figure figcaption { position: absolute; bottom: 43px; left: 0; right: 0; margin: 0 auto; font-weight: 300; font-size: 20px; color: #fff; }

    .hi-box a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; }
    .hi-box:hover::before { box-shadow: 0 30px 20px -20px rgba(0,0,0,.5); }


#hi-item-40 { width: 377px; height: 223px; }
#hi-item-40::before {}
#hi-item-40 figure > img {right: ;}
    #hi-item-40 figure > img.hi-hover { opacity: 0; }
#hi-item-40 figcaption { color: ; }

#hi-item-40:hover::before {}
#hi-item-40:hover figcaption { color: ; }
#hi-item-40:hover img {right: ;}
    #hi-item-40:hover img.hi-hover { opacity: 1; }

#hi-item-41 { width: 377px; height: 223px; }
#hi-item-41::before {}
#hi-item-41 figure > img {right: ;}
    #hi-item-41 figure > img.hi-hover { opacity: 0; }
#hi-item-41 figcaption { color: ; }

#hi-item-41:hover::before {}
#hi-item-41:hover figcaption { color: ; }
#hi-item-41:hover img {right: ;}
    #hi-item-41:hover img.hi-hover { opacity: 1; }

#hi-item-43 { width: 377px; height: 223px; }
#hi-item-43::before {}
#hi-item-43 figure > img {right: ;}
    #hi-item-43 figure > img.hi-hover { opacity: 0; }
#hi-item-43 figcaption { color: ; }

#hi-item-43:hover::before {}
#hi-item-43:hover figcaption { color: ; }
#hi-item-43:hover img {right: ;}
    #hi-item-43:hover img.hi-hover { opacity: 1; }

#hi-item-17 { width: 300px; height: 180px; }
#hi-item-17::before {}
#hi-item-17 figure > img {right: ;}
    #hi-item-17 figure > img.hi-hover { opacity: 0; }
#hi-item-17 figcaption { color: ; }

#hi-item-17:hover::before {}
#hi-item-17:hover figcaption { color: ; }
#hi-item-17:hover img {right: ;}
    #hi-item-17:hover img.hi-hover { opacity: 1; }

#hi-item-16 { width: 300px; height: 180px; }
#hi-item-16::before {}
#hi-item-16 figure > img {right: ;}
    #hi-item-16 figure > img.hi-hover { opacity: 0; }
#hi-item-16 figcaption { color: ; }

#hi-item-16:hover::before {}
#hi-item-16:hover figcaption { color: ; }
#hi-item-16:hover img {right: ;}
    #hi-item-16:hover img.hi-hover { opacity: 1; }

#hi-item-7 { width: 300px; height: 180px; }
#hi-item-7::before {}
#hi-item-7 figure > img {right: ;}
    #hi-item-7 figure > img.hi-hover { opacity: 0; }
#hi-item-7 figcaption { color: ; }

#hi-item-7:hover::before {}
#hi-item-7:hover figcaption { color: ; }
#hi-item-7:hover img {right: ;}
    #hi-item-7:hover img.hi-hover { opacity: 1; }

#hi-item-20 { width: 300px; height: 180px; }
#hi-item-20::before {}
#hi-item-20 figure > img {right: ;}
    #hi-item-20 figure > img.hi-hover { opacity: 0; }
#hi-item-20 figcaption { color: ; }

#hi-item-20:hover::before {}
#hi-item-20:hover figcaption { color: ; }
#hi-item-20:hover img {right: ;}
    #hi-item-20:hover img.hi-hover { opacity: 1; }

#hi-item-21 { width: 300px; height: 180px; }
#hi-item-21::before {}
#hi-item-21 figure > img {right: ;}
    #hi-item-21 figure > img.hi-hover { opacity: 0; }
#hi-item-21 figcaption { color: ; }

#hi-item-21:hover::before {}
#hi-item-21:hover figcaption { color: ; }
#hi-item-21:hover img {right: ;}
    #hi-item-21:hover img.hi-hover { opacity: 1; }

#hi-item-8 { width: 300px; height: 180px; }
#hi-item-8::before {}
#hi-item-8 figure > img {right: ;}
    #hi-item-8 figure > img.hi-hover { opacity: 0; }
#hi-item-8 figcaption { color: ; }

#hi-item-8:hover::before {}
#hi-item-8:hover figcaption { color: ; }
#hi-item-8:hover img {right: ;}
    #hi-item-8:hover img.hi-hover { opacity: 1; }

#hi-item-18 { width: 300px; height: 180px; }
#hi-item-18::before {}
#hi-item-18 figure > img {right: ;}
    #hi-item-18 figure > img.hi-hover { opacity: 0; }
#hi-item-18 figcaption { color: ; }

#hi-item-18:hover::before {}
#hi-item-18:hover figcaption { color: ; }
#hi-item-18:hover img {right: ;}
    #hi-item-18:hover img.hi-hover { opacity: 1; }

#hi-item-42 { width: 377px; height: 223px; }
#hi-item-42::before {}
#hi-item-42 figure > img {right: ;}
    #hi-item-42 figure > img.hi-hover { opacity: 0; }
#hi-item-42 figcaption { color: ; }

#hi-item-42:hover::before {}
#hi-item-42:hover figcaption { color: ; }
#hi-item-42:hover img {right: ;}
    #hi-item-42:hover img.hi-hover { opacity: 1; }

#hi-item-19 { width: 300px; height: 180px; }
#hi-item-19::before {}
#hi-item-19 figure > img {right: ;}
    #hi-item-19 figure > img.hi-hover { opacity: 0; }
#hi-item-19 figcaption { color: ; }

#hi-item-19:hover::before {}
#hi-item-19:hover figcaption { color: ; }
#hi-item-19:hover img {right: ;}
    #hi-item-19:hover img.hi-hover { opacity: 1; }

#hi-item-9 { width: 300px; height: 180px; }
#hi-item-9::before {}
#hi-item-9 figure > img {right: ;}
    #hi-item-9 figure > img.hi-hover { opacity: 0; }
#hi-item-9 figcaption { color: ; }

#hi-item-9:hover::before {}
#hi-item-9:hover figcaption { color: ; }
#hi-item-9:hover img {right: ;}
    #hi-item-9:hover img.hi-hover { opacity: 1; }

#hi-item-22 { width: 300px; height: 180px; }
#hi-item-22::before {}
#hi-item-22 figure > img {right: ;}
    #hi-item-22 figure > img.hi-hover { opacity: 0; }
#hi-item-22 figcaption { color: ; }

#hi-item-22:hover::before {}
#hi-item-22:hover figcaption { color: ; }
#hi-item-22:hover img {right: ;}
    #hi-item-22:hover img.hi-hover { opacity: 1; }

#hi-item-10 { width: 300px; height: 180px; }
#hi-item-10::before {}
#hi-item-10 figure > img {right: ;}
    #hi-item-10 figure > img.hi-hover { opacity: 0; }
#hi-item-10 figcaption { color: ; }

#hi-item-10:hover::before {}
#hi-item-10:hover figcaption { color: ; }
#hi-item-10:hover img {right: ;}
    #hi-item-10:hover img.hi-hover { opacity: 1; }

#hi-item-11 { width: 300px; height: 180px; }
#hi-item-11::before {}
#hi-item-11 figure > img {right: ;}
    #hi-item-11 figure > img.hi-hover { opacity: 0; }
#hi-item-11 figcaption { color: ; }

#hi-item-11:hover::before {}
#hi-item-11:hover figcaption { color: ; }
#hi-item-11:hover img {right: ;}
    #hi-item-11:hover img.hi-hover { opacity: 1; }

#hi-item-23 { width: 300px; height: 180px; }
#hi-item-23::before {}
#hi-item-23 figure > img {right: ;}
    #hi-item-23 figure > img.hi-hover { opacity: 0; }
#hi-item-23 figcaption { color: ; }

#hi-item-23:hover::before {}
#hi-item-23:hover figcaption { color: ; }
#hi-item-23:hover img {right: ;}
    #hi-item-23:hover img.hi-hover { opacity: 1; }

#hi-item-24 { width: 300px; height: 180px; }
#hi-item-24::before {}
#hi-item-24 figure > img {right: ;}
    #hi-item-24 figure > img.hi-hover { opacity: 0; }
#hi-item-24 figcaption { color: ; }

#hi-item-24:hover::before {}
#hi-item-24:hover figcaption { color: ; }
#hi-item-24:hover img {right: ;}
    #hi-item-24:hover img.hi-hover { opacity: 1; }

#hi-item-25 { width: 300px; height: 180px; }
#hi-item-25::before {}
#hi-item-25 figure > img {right: ;}
    #hi-item-25 figure > img.hi-hover { opacity: 0; }
#hi-item-25 figcaption { color: ; }

#hi-item-25:hover::before {}
#hi-item-25:hover figcaption { color: ; }
#hi-item-25:hover img {right: ;}
    #hi-item-25:hover img.hi-hover { opacity: 1; }

#hi-item-26 { width: 300px; height: 180px; }
#hi-item-26::before {}
#hi-item-26 figure > img {right: ;}
    #hi-item-26 figure > img.hi-hover { opacity: 0; }
#hi-item-26 figcaption { color: ; }

#hi-item-26:hover::before {}
#hi-item-26:hover figcaption { color: ; }
#hi-item-26:hover img {right: ;}
    #hi-item-26:hover img.hi-hover { opacity: 1; }

#hi-item-27 { width: 300px; height: 180px; }
#hi-item-27::before {}
#hi-item-27 figure > img {right: ;}
    #hi-item-27 figure > img.hi-hover { opacity: 0; }
#hi-item-27 figcaption { color: ; }

#hi-item-27:hover::before {}
#hi-item-27:hover figcaption { color: ; }
#hi-item-27:hover img {right: ;}
    #hi-item-27:hover img.hi-hover { opacity: 1; }

#hi-item-47 { width: 300px; height: 180px; }
#hi-item-47::before {}
#hi-item-47 figure > img {right: ;}
    #hi-item-47 figure > img.hi-hover { opacity: 0; }
#hi-item-47 figcaption { color: ; }

#hi-item-47:hover::before {}
#hi-item-47:hover figcaption { color: ; }
#hi-item-47:hover img {right: ;}
    #hi-item-47:hover img.hi-hover { opacity: 1; }

#hi-item-28 { width: 300px; height: 180px; }
#hi-item-28::before {}
#hi-item-28 figure > img {right: ;}
    #hi-item-28 figure > img.hi-hover { opacity: 0; }
#hi-item-28 figcaption { color: ; }

#hi-item-28:hover::before {}
#hi-item-28:hover figcaption { color: ; }
#hi-item-28:hover img {right: ;}
    #hi-item-28:hover img.hi-hover { opacity: 1; }

#hi-item-29 { width: 300px; height: 180px; }
#hi-item-29::before {}
#hi-item-29 figure > img {right: ;}
    #hi-item-29 figure > img.hi-hover { opacity: 0; }
#hi-item-29 figcaption { color: ; }

#hi-item-29:hover::before {}
#hi-item-29:hover figcaption { color: ; }
#hi-item-29:hover img {right: ;}
    #hi-item-29:hover img.hi-hover { opacity: 1; }

#hi-item-30 { width: 300px; height: 180px; }
#hi-item-30::before {}
#hi-item-30 figure > img {right: ;}
    #hi-item-30 figure > img.hi-hover { opacity: 0; }
#hi-item-30 figcaption { color: ; }

#hi-item-30:hover::before {}
#hi-item-30:hover figcaption { color: ; }
#hi-item-30:hover img {right: ;}
    #hi-item-30:hover img.hi-hover { opacity: 1; }

#hi-item-12 { width: 220px; height: 355px; }
#hi-item-12::before {}
#hi-item-12 figure > img {right: ;}
    #hi-item-12 figure > img.hi-hover { opacity: 0; }
#hi-item-12 figcaption { color: ; }

#hi-item-12:hover::before {}
#hi-item-12:hover figcaption { color: ; }
#hi-item-12:hover img {right: ;}
    #hi-item-12:hover img.hi-hover { opacity: 1; }

#hi-item-13 { width: 220px; height: 355px; }
#hi-item-13::before {}
#hi-item-13 figure > img {right: ;}
    #hi-item-13 figure > img.hi-hover { opacity: 0; }
#hi-item-13 figcaption { color: ; }

#hi-item-13:hover::before {}
#hi-item-13:hover figcaption { color: ; }
#hi-item-13:hover img {right: ;}
    #hi-item-13:hover img.hi-hover { opacity: 1; }

#hi-item-31 { width: 300px; height: 180px; }
#hi-item-31::before {}
#hi-item-31 figure > img {right: ;}
    #hi-item-31 figure > img.hi-hover { opacity: 0; }
#hi-item-31 figcaption { color: ; }

#hi-item-31:hover::before {}
#hi-item-31:hover figcaption { color: ; }
#hi-item-31:hover img {right: ;}
    #hi-item-31:hover img.hi-hover { opacity: 1; }

#hi-item-32 { width: 300px; height: 180px; }
#hi-item-32::before {}
#hi-item-32 figure > img {right: ;}
    #hi-item-32 figure > img.hi-hover { opacity: 0; }
#hi-item-32 figcaption { color: ; }

#hi-item-32:hover::before {}
#hi-item-32:hover figcaption { color: ; }
#hi-item-32:hover img {right: ;}
    #hi-item-32:hover img.hi-hover { opacity: 1; }

#hi-item-14 { width: 220px; height: 355px; }
#hi-item-14::before {}
#hi-item-14 figure > img {right: ;}
    #hi-item-14 figure > img.hi-hover { opacity: 0; }
#hi-item-14 figcaption { color: ; }

#hi-item-14:hover::before {}
#hi-item-14:hover figcaption { color: ; }
#hi-item-14:hover img {right: ;}
    #hi-item-14:hover img.hi-hover { opacity: 1; }

#hi-item-33 { width: 300px; height: 180px; }
#hi-item-33::before {}
#hi-item-33 figure > img {right: ;}
    #hi-item-33 figure > img.hi-hover { opacity: 0; }
#hi-item-33 figcaption { color: ; }

#hi-item-33:hover::before {}
#hi-item-33:hover figcaption { color: ; }
#hi-item-33:hover img {right: ;}
    #hi-item-33:hover img.hi-hover { opacity: 1; }

#hi-item-34 { width: 300px; height: 180px; }
#hi-item-34::before {}
#hi-item-34 figure > img {right: ;}
    #hi-item-34 figure > img.hi-hover { opacity: 0; }
#hi-item-34 figcaption { color: ; }

#hi-item-34:hover::before {}
#hi-item-34:hover figcaption { color: ; }
#hi-item-34:hover img {right: ;}
    #hi-item-34:hover img.hi-hover { opacity: 1; }

#hi-item-35 { width: 300px; height: 180px; }
#hi-item-35::before {}
#hi-item-35 figure > img {right: ;}
    #hi-item-35 figure > img.hi-hover { opacity: 0; }
#hi-item-35 figcaption { color: ; }

#hi-item-35:hover::before {}
#hi-item-35:hover figcaption { color: ; }
#hi-item-35:hover img {right: ;}
    #hi-item-35:hover img.hi-hover { opacity: 1; }

#hi-item-36 { width: 300px; height: 180px; }
#hi-item-36::before {}
#hi-item-36 figure > img {right: ;}
    #hi-item-36 figure > img.hi-hover { opacity: 0; }
#hi-item-36 figcaption { color: ; }

#hi-item-36:hover::before {}
#hi-item-36:hover figcaption { color: ; }
#hi-item-36:hover img {right: ;}
    #hi-item-36:hover img.hi-hover { opacity: 1; }

#hi-item-37 { width: 300px; height: 180px; }
#hi-item-37::before {}
#hi-item-37 figure > img {right: ;}
    #hi-item-37 figure > img.hi-hover { opacity: 0; }
#hi-item-37 figcaption { color: ; }

#hi-item-37:hover::before {}
#hi-item-37:hover figcaption { color: ; }
#hi-item-37:hover img {right: ;}
    #hi-item-37:hover img.hi-hover { opacity: 1; }

#hi-item-38 { width: 300px; height: 180px; }
#hi-item-38::before {}
#hi-item-38 figure > img {right: ;}
    #hi-item-38 figure > img.hi-hover { opacity: 0; }
#hi-item-38 figcaption { color: ; }

#hi-item-38:hover::before {}
#hi-item-38:hover figcaption { color: ; }
#hi-item-38:hover img {right: ;}
    #hi-item-38:hover img.hi-hover { opacity: 1; }

#hi-item-39 { width: 300px; height: 180px; }
#hi-item-39::before {}
#hi-item-39 figure > img {right: ;}
    #hi-item-39 figure > img.hi-hover { opacity: 0; }
#hi-item-39 figcaption { color: ; }

#hi-item-39:hover::before {}
#hi-item-39:hover figcaption { color: ; }
#hi-item-39:hover img {right: ;}
    #hi-item-39:hover img.hi-hover { opacity: 1; }

#hi-item-6 { width: 252px; height: 252px; }
#hi-item-6::before {}
#hi-item-6 figure > img {right: ;}
    #hi-item-6 figure > img.hi-hover { opacity: 0; }
#hi-item-6 figcaption { color: ; }

#hi-item-6:hover::before {}
#hi-item-6:hover figcaption { color: ; }
#hi-item-6:hover img {right: ;}
    #hi-item-6:hover img.hi-hover { opacity: 1; }

#hi-item-3 { width: 252px; height: 252px; }
#hi-item-3::before {}
#hi-item-3 figure > img {right: ;}
    #hi-item-3 figure > img.hi-hover { opacity: 0; }
#hi-item-3 figcaption { color: ; }

#hi-item-3:hover::before {}
#hi-item-3:hover figcaption { color: ; }
#hi-item-3:hover img {right: ;}
    #hi-item-3:hover img.hi-hover { opacity: 1; }

#hi-item-1 { width: 252px; height: 252px; }
#hi-item-1::before {}
#hi-item-1 figure > img {right: ;}
    #hi-item-1 figure > img.hi-hover { opacity: 0; }
#hi-item-1 figcaption { color: ; }

#hi-item-1:hover::before {}
#hi-item-1:hover figcaption { color: ; }
#hi-item-1:hover img {right: ;}
    #hi-item-1:hover img.hi-hover { opacity: 1; }

#hi-item-4 { width: 252px; height: 252px; }
#hi-item-4::before {}
#hi-item-4 figure > img {right: ;}
    #hi-item-4 figure > img.hi-hover { opacity: 0; }
#hi-item-4 figcaption { color: ; }

#hi-item-4:hover::before {}
#hi-item-4:hover figcaption { color: ; }
#hi-item-4:hover img {right: ;}
    #hi-item-4:hover img.hi-hover { opacity: 1; }

#hi-item-2 { width: 252px; height: 252px; }
#hi-item-2::before {}
#hi-item-2 figure > img {right: ;}
    #hi-item-2 figure > img.hi-hover { opacity: 0; }
#hi-item-2 figcaption { color: ; }

#hi-item-2:hover::before {}
#hi-item-2:hover figcaption { color: ; }
#hi-item-2:hover img {right: ;}
    #hi-item-2:hover img.hi-hover { opacity: 1; }

#hi-item-5 { width: 252px; height: 252px; }
#hi-item-5::before {}
#hi-item-5 figure > img {right: ;}
    #hi-item-5 figure > img.hi-hover { opacity: 0; }
#hi-item-5 figcaption { color: ; }

#hi-item-5:hover::before {}
#hi-item-5:hover figcaption { color: ; }
#hi-item-5:hover img {right: ;}
    #hi-item-5:hover img.hi-hover { opacity: 1; }