.thumbnail-classic{ width: 100%; height: inherit; cursor: pointer;}.thumbnail-classic figcaption{ display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; position: static; background: #f5f7fa; color: #222222; padding: 15px; max-width: 370px; margin-bottom: 15px;}.thumbnail-classic figcaption h4 { color: #222222; font-size: 20px; line-height: 1.5;}html .page .offset-top-60, html .page .offset-top-50{ margin:0px ;}.thumbnail-classic .divider{ background: #55853C;}@media (min-width: 480px){ .thumbnail-classic{ height: 370px; }}@media (min-width: 768px){ html .page .offset-top-60{ margin-top: 60px ; } html .page .offset-top-50{ margin-top: 50px ; } .thumbnail-classic-title{ font-size: 30px; line-height: 1; padding: 0 33px; } .thumbnail-classic figcaption { padding-left: 20px; padding-right: 20px; } .thumbnail-classic figcaption p { line-height: 1.3; padding: 0 19px; height: 10px; } .thumbnail-classic figcaption h4{ color: #ffffff; font-size:36px; } .thumbnail-classic .divider { background: #fff; margin: 10px auto 15px; }}@media (min-width: 1024px){ .thumbnail-classic figcaption { position: absolute; left: 0; right: 0; top: 0; bottom: 0; padding-left: 15px; padding-right: 15px; background: none; z-index: 2; opacity: 0; visibility: hidden; transition: 0.35s all ease-out; -webkit-transform: translateY(-10%); transform: translateY(-10%); } .thumbnail-classic figcaption:before { position: absolute; left: 10px; right: 10px; top: 10px; bottom: 10px; content: ""; transition: 0.35s all ease-out; border: 1px solid #FFFFFF; } .thumbnail-classic figcaption p { /*max-height: 45px; overflow: hidden;*/ } .thumbnail-classic:before { position: absolute; left: -20px; right: -20px; top: -20px; bottom: -20px; content: ""; background: rgba(0, 0, 0, 0.7); z-index: 1; opacity: 0; visibility: hidden; transition: 0.35s all ease-out; transition-delay: 0.2s; } .thumbnail-classic:hover:before { opacity: 1; visibility: visible; transition-delay: 0s; } .thumbnail-classic:hover figcaption { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } .thumbnail-classic:hover figcaption:before { left: 20px; right: 20px; top: 20px; bottom: 20px; } .reveal-lg-block{ display: block !important; }}@media (min-width: 1200px){ .thumbnail-classic-title{ font-size: 36px; }}