figure {position: relative;/*float: left;*/overflow: hidden;width: 100%;height: 100%;text-align: center;cursor: pointer;margin: 0;}
figure img {position: relative;display: block;}
figure figcaption {padding: 2em;color: #fff;text-transform: uppercase;font-size: 1.25em;-webkit-backface-visibility: hidden;backface-visibility: hidden;}
figure figcaption::before,figure figcaption::after {pointer-events: none;}
figure figcaption,figure figcaption > a {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
figure figcaption > a {z-index: 1000;text-indent: 200%;white-space: nowrap;font-size: 0;opacity: 0;}
figure h2 {word-spacing: -0.15em;font-size: 17px;font-weight:lighter;}
figure h2 span {font-weight: 800;}
figure h2,figure p {margin: 0;}
figure p {letter-spacing: 1px;font-size: 85%;}


/***** Jazz *****/
figure.effect-jazz{ background-color:transparent;  display:block; clear:both; overflow:hidden; width:100%; height:100%; padding:0px; margin:0px;}

figure.effect-jazz figcaption::after,figure.effect-jazz img,figure.effect-jazz p {-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;transition: opacity 0.35s, transform 0.35s;}
figure.effect-jazz img{ width:100%; overflow:hidden; margin:0px; padding:0px;}
figure.effect-jazz figcaption { display:block; width:100%; height:100% !important; text-align:center; }

figure.effect-jazz figcaption::after {position: absolute;top: 0;left: 0;width: 100%;height: 144%;/*border-top: 1px solid #fff;border-bottom: 1px solid #fff;*/content: '';opacity: 0;-webkit-transform: rotate3d(0,0,1,45deg) scale3d(1,0,1);transform: rotate3d(0,0,1,45deg) scale3d(1,0,1);-webkit-transform-origin: 58% 60%;-ms-transform-origin: 58% 60%;transform-origin: 58% 60%;}
figure.effect-jazz p,figure.effect-jazz h2{padding: 0.5em 1em;text-transform: none;opacity: 0;-webkit-transform: scale3d(0.5,0.5,1);transform: scale3d(0.5,0.5,1);}
figure.effect-jazz div{ display:table; width:100%; height:100%; overflow:hidden; text-align:center; vertical-align:middle;}
figure.effect-jazz h2 { -webkit-transition: -webkit-transform 0.6s;transition: transform 0.6s; text-align:center; display:table-cell; margin:0 auto; vertical-align:middle;}
figure.effect-jazz h2 strong{ font-weight:normal; border:1px solid #fff; padding:7px 15px;}
figure.effect-jazz:hover img {opacity: 1;-webkit-transform: scale3d(1.1,1.1,1);transform: scale3d(1.1,1.1,1);}
figure.effect-jazz:hover div{ background: rgba(222, 38, 46, 0.8);}
figure.effect-jazz:hover figcaption::after {opacity: 1;-webkit-transform: rotate3d(0,0,1,45deg) scale3d(1,1,1);transform: rotate3d(0,0,1,45deg) scale3d(1,1,1);}
figure.effect-jazz:hover h2,figure.effect-jazz:hover p { opacity: 1; -webkit-transform: scale3d(1,1,1); transform: scale3d(1,1,1);}

.items {margin: 0 auto; padding:0px; width:100%; overflow: hidden;}
.items li {position: relative;width: 20%; overflow:hidden; padding:0px; margin: 0;float: left;}
.items li:first-child figure.effect-winston{background: transparent;}
.items li:first-child figure.effect-winston figcaption{background: rgba(0, 0, 0, 0.6);}
.items li:first-child figure.effect-winston:hover figcaption{background: rgba(0, 0, 0, 0);}
.items li:first-child figure.effect-winston h2{opacity: 1;}
.items li:first-child figure.effect-winston:hover h2{opacity: 0;}
.items li:first-child figure.effect-winston figcaption::before{display: none;}
.items li:first-child figure.effect-winston:hover img {opacity: 1;}




@media screen and (max-width: 1400px){
figure.effect-jazz h2 {padding-top: 14%;}
}
@media screen and (max-width: 1100px){
figure.effect-jazz h2 {padding-top: 11%;}
}
@media screen and (max-width: 1024px){
.items li {width: 50%;}
}



@media screen and (max-width: 800px){
.items li {width: 100%;}
}

@media screen and (max-width: 360px){
.items li {width: 100%;}
figure.effect-jazz p, figure.effect-jazz h2{ padding:0.4em 2em;}
}

.items2 {margin: 0 auto; padding:0px; width:100%; overflow: hidden; text-align:center;}
.items2 li {position: relative;width: 23%;height: auto;margin: 10px 0.5%; display:inline-block; text-align:left; line-height:160%; vertical-align:top; color:#666666;}
.items2 li:first-child figure.effect-winston{background: transparent;}
.items2 li:first-child figure.effect-winston figcaption{background: rgba(0, 0, 0, 0.6);}
.items2 li:first-child figure.effect-winston:hover figcaption{background: rgba(0, 0, 0, 0);}
.items2 li:first-child figure.effect-winston h2{opacity: 1;}
.items2 li:first-child figure.effect-winston:hover h2{opacity: 0;}
.items2 li:first-child figure.effect-winston figcaption::before{display: none;}
.items2 li:first-child figure.effect-winston:hover img {opacity: 1;}

.items2 li strong{ font-size:17px; font-weight:normal; display:block; margin:12px 0 1px 0; color:#222;}
