@media (min-width:768px) {
.view {
width: 25%;
height: 233px;
margin: 0px;
float: left;
overflow: hidden;
position: relative;
text-align: left;
cursor: default;
}
.base-main .view{
width: 20%;
height:233px;}
.view .btn{
display:none;}
.viewbig {
cursor: default;
float: left;
height: 219px;
margin: 0;
overflow: hidden;
position: relative;
text-align: left;
width: 100%;
}
.view .mask,.view .content {
font-family: Helvetica, Arial, sans-serif;
width: 100%;
height: 233px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
}
.viewbig .mask,.viewbig .content {
width: 100%;
height: 278px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
background-size:cover;
}
.view img, .viewbig img {
display: block;
position: relative;
height:100%;
width:auto;
align-content:center;
}
.view h2, .viewbig h2 {
font-family: Helvetica, Arial, sans-serif;
text-transform: uppercase;
color: #fff;
text-align: left;
position: relative;
font-size: 17px;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 0px;
background: rgba(0, 0, 0, 0.8);
margin: 20px 0 0 0;
line-height:1em;
}
.view p, .viewbig p {
font-family: Helvetica, Arial, sans-serif;
font-size: 12px;
position: relative;
color: #fff;
padding: 0px 20px 20px;
text-align: left;
line-height:1.4em;
}
.view a.info, .viewbig a.info {
}
.view a.info: hover, .viewbig a.info: hover {
-webkit-box-shadow: 0 0 5px #000;
-moz-box-shadow: 0 0 5px #000;
box-shadow: 0 0 5px #000;
color:white;
}
.hover-wrap {
display: block;
float: left;
margin-bottom: 0px;
position: relative;
width: 100%;
-webkit-border-top-right-radius: 30px;
-moz-border-radius-topright: 30px;
border-top-right-radius: 30px;
overflow:hidden;
margin-top:0.5em;
z-index: 1;
}
.home .hover-wrap {
margin-top:2em;
}
}