81 lines
1.1 KiB
SCSS
81 lines
1.1 KiB
SCSS
.video {
|
|
padding: 6.4rem 0;
|
|
background: $light;
|
|
}
|
|
|
|
.video-wrapper {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, 1fr);
|
|
gap: 2.4rem;
|
|
}
|
|
|
|
.video-inner {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 3.2rem;
|
|
|
|
h2 {
|
|
font-size: 2.4rem;
|
|
color: $black;
|
|
}
|
|
}
|
|
|
|
.video-item {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 1.8rem;
|
|
}
|
|
|
|
.video-img {
|
|
overflow: hidden;
|
|
@include wh100;
|
|
max-height: 16.2rem;
|
|
border-radius: 0.8rem;
|
|
|
|
img {
|
|
@include wh100;
|
|
object-fit: cover;
|
|
}
|
|
}
|
|
|
|
.video-item-bottom {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 0.8rem;
|
|
color: $black;
|
|
|
|
span {
|
|
font-size: 1.2rem;
|
|
}
|
|
|
|
h5 {
|
|
font-size: 1.6rem;
|
|
line-height: 2.2rem;
|
|
}
|
|
}
|
|
|
|
.video-link {
|
|
max-width: fit-content;
|
|
border-radius: 0.5rem;
|
|
background: $main;
|
|
.inner {
|
|
font-size: 1.6rem;
|
|
color: $white;
|
|
padding: 0.8rem 1.6rem;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-start;
|
|
gap: 1.6rem;
|
|
}
|
|
|
|
.arrow-div {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
svg {
|
|
width: 1.6rem;
|
|
height: 1.6rem;
|
|
}
|
|
}
|