[class*="am-interactive-"] { position: relative; z-index: 1; overflow: hidden; margin: 0 0 35px; text-align: center; cursor: pointer; }
    [class*="am-interactive-"] .pic { position: relative; z-index: 0; }
        [class*="am-interactive-"] .pic::before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.4); z-index: 1; transition: all .35s; }
        [class*="am-interactive-"] .pic::after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: transparent; z-index: 2; transition: all .35s; }
    [class*="am-interactive-"] img { border: none; padding: 0; margin: 0; min-width: 100%; max-width: 100%; }
    [class*="am-interactive-"] .content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 30px 30px 20px 30px; color: #fff; font-size: 1em; backface-visibility: hidden; }
        [class*="am-interactive-"] .content::after,
        [class*="am-interactive-"] .content::before { pointer-events: none; }
    [class*="am-interactive-"] .title { letter-spacing: normal; padding: 0; margin: 0; font-size: 20px; line-height: 22px; font-family: 'Montserrat', sans-serif; font-weight: 600; text-decoration: inherit; font-style: inherit; color: inherit; }
    [class*="am-interactive-"] .description { font-size: 16px; line-height: 28px; font-family: 'Montserrat', sans-serif; font-weight: 400; }
    [class*="am-interactive-"] .link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; display: block; background: 0 0; }

@media (max-width: 1199px) {
    [class*="am-interactive-"] .title { font-size: 18px; line-height: 20px; }
    [class*="am-interactive-"] .description { font-size: 13px; line-height: 26px; }
}


@media (max-width: 991px) {
    [class*="am-interactive-"] .title { font-size: 20px; line-height: 22px; }
    [class*="am-interactive-"] .description { font-size: 16px; line-height: 28px; }
}


@media (max-width: 767px) {
}


/* Style 01 */
.am-interactive-01 { }
    .am-interactive-01 .pic img { width: calc(100% + 50px) !important; max-width: calc(100% + 50px) !important; transition: opacity .35s,transform .35s; transform: translate3d(-40px,0,0); }
    .am-interactive-01 .content { top: auto; bottom: 0; min-height: 25%; height: auto; max-height: 100%; text-align: left; }
        .am-interactive-01 .content .title { transform: translate3d(0,50px,0); transition: transform .35s; }
        .am-interactive-01 .content .description { margin-top: 15px; opacity: 0; transform: translate3d(0,40px,0); transition: opacity .2s,transform .35s; }

    .am-interactive-01:hover img { transform: translate3d(0,0,0); transition-delay: .05s; transition-duration: .35s; }
    .am-interactive-01:hover .content .title { opacity: 1; transform: translate3d(0,0,0); transition-delay: .05s; transition-duration: .35s; }
    .am-interactive-01:hover .content .description { opacity: 1; transform: translate3d(0,0,0); transition-delay: .05s; transition-duration: .35s; }



/* Style 02 */
.am-interactive-02 { }
    .am-interactive-02 .content { top: auto; bottom: 0; padding: 15px; height: auto; color: #3c4a50; background: transparent; transform: translate3d(0,100%,0); transition: transform .35s; }
        .am-interactive-02 .content::before { content: ''; position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; background: rgba(44,92,218,1); opacity: 0.7; }
        .am-interactive-02 .content .title { color: #ffffff; text-align: center; transform: translate3d(0,200%,0); transition: transform .35s; }
        .am-interactive-02 .content .description { position: absolute; top: auto; bottom: 100%; left: 0; width: 100%; padding: 25px; color: #fff; text-transform: none; opacity: 0; transition: opacity .35s; }
    .am-interactive-02:hover .content { transform: translateY(0); }
        .am-interactive-02:hover .content .title { transform: translateY(0); transition-delay: .05s; }
        .am-interactive-02:hover .content .description { opacity: 1 !important; z-index: 99 !important; backface-visibility: hidden !important; }



/* Style 03 */
.am-interactive-03 { }
    .am-interactive-03 .pic img { width: calc(100% + 20px) !important; max-width: calc(100% + 20px) !important; transform: translate3d(-10px,0,0); backface-visibility: hidden; transition: opacity .35s,transform .35s; }
    .am-interactive-03 .content { text-align: left; padding: 40px 30px; }
        .am-interactive-03 .content .title { color: #ffffff; position: relative; overflow: hidden; padding: 5px 0 17px; }
            .am-interactive-03 .content .title::after { position: absolute; content: ""; bottom: 0; left: 0; width: 100%; height: 1px; background: #fff; transition: transform .35s; transform: translate3d(-100%,0,0); }
        .am-interactive-03 .content .description { padding: 13px 0; opacity: 0; transition: opacity .35s,transform .35s; transform: translate3d(100%,0,0); }
    .am-interactive-03:hover .pic img { }
    .am-interactive-03:hover .content .title::after { transform: translate3d(0,0,0); }
    .am-interactive-03:hover .content .description { opacity: 1; transform: translate3d(0,0,0); }



/* Style 04 */
.am-interactive-04 { }
    .am-interactive-04 .pic img { width: 100%; }
    .am-interactive-04 .content::before { position: absolute; content: ""; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transform: translate3d(0,50%,0); transition: opacity .35s,transform .35s; }
    .am-interactive-04 .content .title { color: #ffffff; position: absolute; top: 50%; left: 0; width: 100%; transform: translate3d(0,-50%,0); transition: transform .35s,color .35s; }
    .am-interactive-04 .content .description { color: #ffffff; position: absolute; bottom: 0; left: 0; padding: 20px; width: 100%; max-height: 50%; opacity: 0; transform: translate3d(0,10px,0); transition: opacity .35s,transform .35s; }
    .am-interactive-04:hover .pic::after { background: rgba(44,92,218,1); opacity: 0.7; }
    .am-interactive-04:hover .pic img { }
    .am-interactive-04:hover .content::before { opacity: 1; transform: translate3d(0,0,0); }
    .am-interactive-04:hover .content .title { transform: translate3d(0,-40px,0); }
    .am-interactive-04:hover .content .description { opacity: 1; transform: translate3d(0,0,0); }


/* Style 05 */
.am-interactive-05 { background: rgb(0, 0, 0); }
    .am-interactive-05 .pic img { width: calc(100% + 40px) !important; max-width: calc(100% + 40px) !important; transform: translate3d(-30px,0,0); transition: opacity .35s,transform .35s; }
    .am-interactive-05 .content { padding: 30px; }
        .am-interactive-05 .content::before { position: absolute; content: ""; opacity: 0; top: 50px; right: 30px; bottom: 50px; left: 30px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; transform: scale(0,1); transform-origin: 0 0; transition: opacity .35s,transform .35s; }
        .am-interactive-05 .content::after { position: absolute; content: ""; opacity: 0; top: 30px; right: 50px; bottom: 30px; left: 50px; border-right: 1px solid #fff; border-left: 1px solid #fff; transform: scale(1,0); transform-origin: 100% 0; transition: opacity .35s,transform .35s; }
        .am-interactive-05 .content .title { padding: 25% 30px 0; transform: translate3d(-30px,0,0); transition: transform .35s; }
        .am-interactive-05 .content .description { padding: 10px 30px; opacity: 0; overflow: hidden; transform: translate3d(0,-10px,0); transition: opacity .35s,transform .35s; }
    .am-interactive-05:hover .pic img { transform: translate3d(0,0,0); transition-delay: .15s; }
    .am-interactive-05:hover .content::before { opacity: 1; transform: scale(1); }
    .am-interactive-05:hover .content::after { opacity: 1; transform: scale(1); transition-delay: .15s; }
    .am-interactive-05:hover .content .title { opacity: 1; transform: translate3d(0,0,0); transition-delay: .15s; }
    .am-interactive-05:hover .content .description { opacity: 1; transform: translate3d(0,0,0); transition-delay: .15s; }


/* Style 06 */
.am-interactive-06 { }
    .am-interactive-06 .pic img { }
    .am-interactive-06 .content { padding: 45px; display: flex; justify-content: center; align-items: center; flex-direction: column; }
        .am-interactive-06 .content::before { position: absolute; content: ""; top: 30px; right: 30px; bottom: 30px; left: 30px; border: 1px solid #fff; opacity: 0; max-width: 100%; transform: scale(0); transition: opacity .35s,transform .35s; }
        .am-interactive-06 .content .title { transform: translate3d(0,50%,0); transition: transform .35s; }
        .am-interactive-06 .content .description { opacity: 0; max-width: 100%; margin-top: 22px; transform: scale(0); transition: opacity .35s,transform .35s; }
    .am-interactive-06:hover .pic::after { background: rgba(44,92,218,1); opacity: 0.7; }
    .am-interactive-06:hover .pic img { }
    .am-interactive-06:hover .content::before { opacity: 1; transform: scale(1); }
    .am-interactive-06:hover .content .title { transform: translate3d(0,0,0); }
    .am-interactive-06:hover .content .description { opacity: 1; transform: scale(1); }

@media (max-width: 1199px) {
    .am-interactive-06 .content .description { margin-top: 5px; }
}


@media (max-width: 991px) {
    .am-interactive-06 .content .description { margin-top: 22px; }
}


@media (max-width: 767px) {
}


/* Style 07 */
.am-interactive-07 { background: rgb(0, 0, 0); }
    .am-interactive-07 .pic img { }
    .am-interactive-07 .content { text-align: right; }
        .am-interactive-07 .content .title { position: absolute; top: 30px; right: 30px; left: 30px; padding: 10px 0 16px; transform: translate3d(0,37px,0); transition: transform .35s; }
            .am-interactive-07 .content .title::after { content: ''; position: absolute; top: 100%; left: 0; width: 100%; height: 1px; background: #fff; opacity: 0; transition: opacity .35s,transform .35s; }
        .am-interactive-07 .content .description { position: absolute; right: 30px; bottom: 30px; left: 30px; padding: 10px 0; opacity: 0; transform: translate3d(0,100%,0); transition: opacity .35s,transform .35s; }
    .am-interactive-07:hover .pic img { }
    .am-interactive-07:hover .content { text-align: right; }
        .am-interactive-07:hover .content .title { transform: translate3d(0,0,0); }
            .am-interactive-07:hover .content .title::after { opacity: 1; transform: translate3d(0,0,0); }
        .am-interactive-07:hover .content .description { opacity: 1; transform: translate3d(0,0,0); }


/* Style 08 */
.am-interactive-08 { background: rgb(0, 0, 0); }
    .am-interactive-08 .pic img { }
    .am-interactive-08 .content { display: flex; flex-direction: column; justify-content: center; align-self: center; }
        .am-interactive-08 .content::before { content: ''; position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; opacity: 0; border-top: 1px solid #fff; border-bottom: 1px solid #fff; transform: scale(0,1); transition: opacity .35s,transform .35s; }
        .am-interactive-08 .content::after { content: ''; position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; opacity: 0; border-right: 1px solid #fff; border-left: 1px solid #fff; transform: scale(1,0); transition: opacity .35s,transform .35s; }
        .am-interactive-08 .content .title { padding: 0 25px 0; transition: transform .35s; transform: translate3d(0,-20px,0); }
        .am-interactive-08 .content .description { padding: 15px 25px; opacity: 0; transition: opacity .35s,transform .35s; transform: translate3d(0,20px,0); }
    .am-interactive-08:hover .pic::after { background: rgba(0, 0, 0, 0.4); }
    .am-interactive-08:hover .pic img { }
    .am-interactive-08:hover .content::before { opacity: 1; transform: scale(1); }
    .am-interactive-08:hover .content::after { opacity: 1; transform: scale(1); }
    .am-interactive-08:hover .content .title { opacity: 1; transform: translate3d(0,0,0); }
    .am-interactive-08:hover .content .description { opacity: 1; transform: translate3d(0,0,0); }

@media (max-width: 1199px) {
    .am-interactive-08 .content .description { padding: 5px 15px; }
}


@media (max-width: 991px) {
    .am-interactive-08 .content .description { padding: 15px 25px; }
}


@media (max-width: 767px) {
}


/* Style 09 */
.am-interactive-09 { background: rgb(0, 0, 0); }
    .am-interactive-09 .pic img { transform: scale(1.12); transition: opacity .35s,transform .35s; }
    .am-interactive-09 .content { padding: 45px; }
        .am-interactive-09 .content::before { content: ""; position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; border: 1px solid #fff; transform: scale(1.1); opacity: 0; transition: opacity .35s,transform .35s; }
        .am-interactive-09 .content .title { padding: 10px 0 15px; }
        .am-interactive-09 .content .description { margin: 0 auto; max-width: 90%; transform: scale(1.5); opacity: 0; transition: opacity .35s,transform .35s; }
    .am-interactive-09:hover .pic img { transform: scale(1); }
    .am-interactive-09:hover .content::before { opacity: 1; transform: scale(1); }
    .am-interactive-09:hover .content .description { opacity: 1; transform: scale(1); }

@media (max-width: 1199px) {
    .am-interactive-09 .content .title { padding: 10px 0 5px; }
}


@media (max-width: 991px) {
    .am-interactive-09 .content .title { padding: 10px 0 15px; }
}


@media (max-width: 767px) {
}


/* Style 10 */
.am-interactive-10 { background: rgb(0, 0, 0); }
    .am-interactive-10 .pic img { width: calc(100% + 60px) !important; max-width: calc(100% + 60px) !important; transform: translate3d(-50px,0,0); transition: opacity .35s,transform .35s; }
    .am-interactive-10 .content { padding: 45px 60px; text-align: left; }
        .am-interactive-10 .content::before { content: ''; position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; border: 1px solid #fff; opacity: 0; transition: opacity .35s,transform .35s; transform: translate3d(-20px,0,0); }
        .am-interactive-10 .content .title { padding: 40% 0 10px; }
        .am-interactive-10 .content .description { opacity: 0; transform: translate3d(-10px,0,0); transition: opacity .35s,transform .35s; }
    .am-interactive-10:hover .pic img { transform: translate3d(0,0,0); }
    .am-interactive-10:hover .content::before { opacity: 1; transform: translate3d(0,0,0); }
    .am-interactive-10:hover .content .description { opacity: 1; transform: translate3d(0,0,0); }



/* Style 11 */
.am-interactive-11 { }
    .am-interactive-11 .pic img { transition: opacity .35s,transform .35s; transform: scale(1.2); }
    .am-interactive-11 .content::before { content: ''; position: absolute; top: 50%; left: 50%; width: 80%; height: 1px; background: #fff; transition: opacity .35s,transform .35s; transform: translate3d(-50%,-50%,0); }
    .am-interactive-11 .content::after { content: ''; position: absolute; top: 50%; left: 50%; width: 80%; height: 1px; background: #fff; transition: opacity .35s,transform .35s; transform: translate3d(-50%,-50%,0); }
    .am-interactive-11 .content .title { transform: translate3d(0,-38px,0); position: absolute; top: 50%; left: 0; width: 100%; transition: transform .35s; }
    .am-interactive-11 .content .description { position: absolute; top: 50%; left: 0; width: 100%; padding: 2px 25px; transform: translate3d(0,12px,0); transition: transform .35s; }
    .am-interactive-11:hover .pic::after { background: rgba(44,92,218,0.7); opacity: 0.7; }
    .am-interactive-11:hover .pic img { transform: scale(1); }
    .am-interactive-11:hover .content::before { opacity: .5; transform: translate3d(-50%,-50%,0) rotate(45deg); }
    .am-interactive-11:hover .content::after { opacity: .5; transform: translate3d(-50%,-50%,0) rotate(-45deg); }
    .am-interactive-11:hover .content .title { transform: translate3d(0,-60px,0); }
    .am-interactive-11:hover .content .description { transform: translate3d(0,25px,0); }


/* Style 12 */
.am-interactive-12 { }
    .am-interactive-12 .pic img { width: calc(100% + 60px) !important; max-width: calc(100% + 60px) !important; transition: opacity .35s,transform .35s; transform: translate3d(-30px,0,0) scale(1.12); backface-visibility: hidden; }
    .am-interactive-12 .content .title { position: absolute; right: 0; bottom: 0; padding: 30px 30px 35px; width: auto; }
    .am-interactive-12 .content .description { padding: 0 30px 0 0; width: 50%; border-right: 1px solid #fff; text-align: right; opacity: 0; transition: opacity .35s,transform .35s; transform: translate3d(-40px,0,0); }
    .am-interactive-12:hover .pic::after { background: rgba(44,92,218,1); opacity: 0.7; }
    .am-interactive-12:hover .pic img { transform: translate3d(0,0,0) scale(1); }
    .am-interactive-12:hover .content .description { opacity: 1; transform: translate3d(0,0,0); }