.lithbox-interno {height: 100%; position: absolute; width: 100%; opacity: 0; -moz-transition: opacity 0.3s ease; -webkit-transition: opacity 0.3s ease; -o-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } .lithbox-interno .adjust-height {display: table-cell; vertical-align: middle; } .lithbox-interno .center-heigth {display: table; height: 100%; margin: 0 auto; text-align: center; width: 90%; } .lithbox-interno p {color: #FFFFFF; display: table; font-family: 'Roboto'; font-weight: 300; margin: 0 auto; position: relative; text-align: center; font-size: 15px; margin: 0 auto 30px; } .lithbox-interno:before {content: ""; width: 100%; height: 100%; position: absolute; background-color: #000; opacity: 0.8; top: 0px; left: 0px; } .tpl-1, .tpl-2 , .tpl-4 {width: 100%; float: left; height: auto; position: relative; display: table; } .tpl-1 img { width: 100% } .tpl-1:hover .lithbox-interno {opacity: 1; -moz-transition: opacity 0.3s ease; -webkit-transition: opacity 0.3s ease; -o-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } .tpl-1 .lithbox-interno span.link-span-tpl:hover, .tpl-2 .lithbox-interno a.link-span-tpl:hover, .tpl-4 .lithbox-interno a.link-span-tpl:hover { text-decoration: underline } .tpl-1 .lithbox-interno span.link-span-tpl {background: none repeat scroll 0 0 rgba(0, 0, 0, 0); border: 2px solid #FFFFFF; color: #FFFFFF; cursor: pointer; display: block; font-family: 'Roboto'; font-size: 14px; font-weight: 300; line-height: 17px; padding: 10px; margin: 0 auto; position: relative; text-align: center; text-decoration: none; text-transform: uppercase; width: 34%; } /*TPL - 2*/ .tpl-2:hover .lithbox-interno {opacity: 1; -moz-transition: opacity 0.3s ease; -webkit-transition: opacity 0.3s ease; -o-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } .tpl-2 .lithbox-interno a.link-span-tpl {background: none repeat scroll 0 0 rgba(0, 0, 0, 0); border: 2px solid #FFFFFF; color: #FFFFFF; cursor: pointer; display: block; float: left; font-family: 'Roboto'; font-size: 14px; font-weight: 300; line-height: 17px; padding: 10px; position: relative; text-align: center; text-decoration: none; text-transform: uppercase; width: 37%; } .tpl-2 .lithbox-interno .align-center-btns {width: 85%; margin: 0 auto; display: table; } .tpl-2 .lithbox-interno .align-center-btns .link-span-tpl:first-child { float: left } .tpl-2 .lithbox-interno .align-center-btns .link-span-tpl:last-child { float: right } /*TPL - 3*/ .tpl-3 .hover_banner {background: none repeat scroll 0 0 #000000; bottom: -100px; display: block; height: 100px; opacity: 0.8; overflow: hidden; padding-right: 2%; width: 98%; position: absolute; } .tpl-3 .hover_banner .text_descript {color: #FFFFFF; display: table; float: left; font-family: 'Roboto'; font-size: 14px; font-weight: lighter; height: 70px; margin: 13px 0px 0px 4%; position: relative; width: 50%; } .tpl-3 .hover_banner .text_descript span {display: table-cell; top: 50%; vertical-align: middle; } .tpl-3 .hover_banner > a {background: none repeat scroll 0 0 rgba(0, 0, 0, 0); border: 1px solid #FFFFFF; color: #FFFFFF; cursor: pointer; float: right; font-family: 'Roboto'; font-size: 13px; font-weight: 300; line-height: 18px; margin-right: 8px; margin-top: 30px; text-transform: uppercase; padding: 10px 15px; } /*TPL - 4*/ .tpl-4:hover .lithbox-interno {opacity: 1; -moz-transition: opacity 0.3s ease; -webkit-transition: opacity 0.3s ease; -o-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } .tpl-4 .lithbox-interno a.link-span-tpl {background: none repeat scroll 0 0 rgba(0, 0, 0, 0); border: 2px solid #FFFFFF; color: #FFFFFF; cursor: pointer; display: block; font-family: 'Roboto'; font-size: 14px; font-weight: 300; line-height: 17px; margin: 0 auto 15px; padding: 10px; position: relative; text-align: center; text-decoration: none; text-transform: uppercase; width: 85%; } .tpl-4 .lithbox-interno a.link-span-tpl:last-child { margin-bottom: 0;} @media screen and (max-width: 959px) {#wrapper_content_resp .lithbox-interno .link-span-tpl { width: 35%; font-size: 12px; } }