core/skin/p007.yurecnt.ru/scss/_portfolio.scss

96 lines
1.9 KiB
SCSS

//
// portfolio
//
.portfolio {
.portfolioFilter {
margin-bottom: 30px;
}
.portfolio-box {
overflow: hidden;
position: relative;
padding: 0;
margin-top: 12px;
margin-bottom: 12px;
.lightbox {
display: block;
}
}
.gallary-title {
a {
color: $primary;
}
}
.tobii-zoom__icon {
display: none;
}
.filter-options {
li {
display: inline-block;
margin: 3px 6px;
font-size: 12px;
text-transform: uppercase;
padding: 7px 12px;
cursor: pointer;
transition: all 0.4s ease-in-out;
color: $primary !important;
&.active {
background-color: $primary !important;
color: $white !important;
border-radius: 3px;
}
}
}
}
/*------ INTERIOR-WORK ------*/
.business-portfolio {
.gallary-box {
position: relative;
overflow: hidden;
display: block;
border-radius: 3px;
.lightbox {
display: inline-block;
.gallary-container {
transform: scale(1);
width: 100%;
transition: all 2s cubic-bezier(0.23, 1, 0.32, 1) 0s;
}
.item-effect {
position: absolute;
transition: all 0.5s ease-in-out 0s;
top: 0px;
left: 0px;
bottom: 0px;
right: 0px;
visibility: hidden;
overflow: hidden;
transform: translateX(-100%);
.item-caption {
position: absolute;
bottom: 0px;
left: 0px;
right: 0px;
transition: all 0.5s ease-in-out 0s;
}
}
}
&:hover {
.item-effect {
transition: all 0.5s;
visibility: visible;
transform: translateY(0px);
position: absolute;
}
}
}
}
.item-effect:hover h5,
.item-effect:hover p {
transform: translateY(0px);
}