ORIENT/themes/modern2/assets/new/styles/main/_media.scss

155 lines
2.0 KiB
SCSS

.media {
background: $mild-gray;
}
.media-inner {
padding: 4rem 0;
@include flex(column);
gap: 5.2rem;
}
.media-head {
h2 {
color: $base-white;
}
span {
border: 0.1rem solid $base-white;
}
}
.media-videos {
@include flex(column);
gap: 4rem;
}
.video-item {
@include flex(column);
gap: 0.8rem;
}
.video {
@include stretch;
video {
@include stretch;
object-fit: contain;
}
img {
@include stretch;
height: 32rem;
object-fit: cover;
}
}
.video-info {
h4,
span,
p {
color: $base-white;
font-weight: normal;
}
}
.swiper {
position: relative !important;
}
.video-prev {
@include flex;
align-items: center;
justify-content: center;
left: 0;
top: 30%;
position: absolute;
background: rgba(39, 39, 39, 0.7);
height: 6rem;
width: 4rem;
z-index: 2;
cursor: pointer;
img {
width: 3.2rem;
height: 3.2rem;
}
}
.video-next {
@include flex;
align-items: center;
justify-content: center;
right: 0;
top: 30%;
position: absolute;
background: rgba(39, 39, 39, 0.7);
height: 6rem;
width: 4rem;
z-index: 2;
cursor: pointer;
img {
width: 3.2rem;
height: 3.2rem;
}
}
.partners-inner {
@include flex(column);
gap: 4.6rem;
padding-bottom: 7.6rem;
}
.partners {
padding: 4rem 0;
.swiper-slide {
@include flex;
justify-content: center;
}
.swiper-slide-active {
.partners-item {
transform: scale(1.1);
@include transition-std;
}
}
}
.media-photos {
.photo {
overflow: hidden;
cursor: pointer;
img {
@include transition-std;
transform: scale(1);
&:hover {
@include transition-std;
transform: scale(1.05);
}
}
}
}
.partners-item {
@include imgStyle(16.7rem, 8.7rem, contain);
transform: scale(0.8);
@include transition-std;
}
.partners-head {
@include sectionTitle;
text-align: center;
// color: $base-black;
}
.photo-item-folder {
display: none;
}
// Media
@media screen and (max-width: 950px) {
.media {
display: none;
}
}