.view_ant { position: relative; text-align: center; margin: 10px; }

.view_ant { z-index: 1; border: #3a3e3a; border-style: solid; border-top-width: 3px; border-right-width: 3px; border-bottom-width: 3px; border-left-width: 3px; border-radius: 2px; }
/*.css_rcd { padding-bottom: 10px; }*/

@media (max-width: 40em) { .view_ant .mask { width: 99%; bottom: 0; }}
@media (min-width: 40em) {.view_ant .mask { height: 100%; width: 100%; top: 0;  }}

.css_img { overflow: hidden; }

.view_ant .mask {
position: absolute;
overflow: hidden;
bottom: 0;
left: 0;
}

@media (max-width: 40em) { .view_ant .mask:hover { background: rgba(58,62,58,0.7); }}
@media (min-width: 40em) {.view_ant .mask:hover { background: rgba(58,62,58,0.9); }}

.view_ant img {
display: block;
position: relative;
}

@media (max-width: 40em) {
.view_ant h4 {
background: rgba(58,62,58,0.5);
padding: 5px;
font-family: Din_Condensed, Din_Light, Helvetica, sans-serif;
font-size: 20px;
}}

@media (min-width: 40em) {
.view_ant h4 {
padding: 15px 0 !important;
font-family: Din_Condensed, Din_Light, Helvetica, sans-serif !important;
font-size: 32px !important;
}}

.view_ant h4 {
/*text-transform: uppercase;*/
color: #FFFFFF !important;
text-align: center !important;
position: relative !important;
margin: 0 !important;
}

@media (max-width: 40em) {
.view_ant p { display: none; }
}

@media (min-width: 40em) {
.view_ant p {
height: 94px;
color: #FFFFFF;
position: relative;
font-family: Din_Light, Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
padding: 5px;
text-align: center;
}
}

@media (min-width: 40em) {
.view_ant .css_lente_prt img {
width: 20px; height: 20px;
left: 50%; margin-top: -10px; opacity: 0; position: absolute; top: 70%;
}
}

@media (max-width: 40em) { .view_ant a.info { display: none !important; }}

.view_ant a.info {
font-family: Din_Condensed, Din_Light, Helvetica, sans-serif;
font-size: 30px;
padding: 15px 0;
position: absolute;
width: 100%;
left: 0;
bottom: 0;
display: inline-block;
text-decoration: none;
color: #FFFFFF;
}

.view_ant a.info:hover { color: #FFCC00; }

@media (max-width: 40em) {
.view_ant img { transition: all 0.7s ease-in-out; }
/*.view_ant:hover .css_lente_prt img { transform: translateY(-15px); opacity: 1; }*/
}

@media (min-width: 40em) {
.view_ant img { transition: all 0.7s ease-in-out; }
.view_ant .mask { transition: all 0.5s linear; opacity: 1; }
.view_ant h4 { transform: translateY(-22px); transition: all 0.5s linear; opacity: 0; }
.view_ant p { opacity: 0; transform: translateY(-22px); transition: all 0.5s linear; }
.view_ant a.info { opacity: 0; transform: translateY(22px); transition: all 0.5s linear; }
.view_ant:hover .css_img img { transform: scale(1.2); opacity: 1; }
.view_ant:hover .css_lente_prt img { transform: translateY(-15px); opacity: 1; }
.view_ant:hover .mask { opacity: 1; }
.view_ant:hover h4, .view_ant:hover p { transform: translateY(0); opacity: 1; }
.view_ant:hover a.info { transform: scale(1); transform: translateY(0); opacity: 1; }
}