.block--gallery_slider.block_option-contained_dark {
background-color: black;
}
.block--gallery_slider.block_option-contained_dark .slick-list {
max-width: 1900px;
margin: 0 auto;
}
.block--gallery_slider .slide {
position: relative;
width: 100%;
padding: 250px 0 280px 0;
overflow: hidden;
display: flex;
align-items: center;
}
@media (max-width: 575px) {
.block--gallery_slider .slide {
padding: 180px 0 180px 0;
}
}
.block--gallery_slider .bg_image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 1;
}
.block--gallery_slider .content {
position: relative;
z-index: 2;
max-width: 1360px;
width: 100%;
margin: auto;
padding: 0 20px;
display: flex;
flex-direction: row;
}
.block--gallery_slider .placeholder {
max-width: 50%;
width: 100%;
}
@media (max-width: 1200px) {
.block--gallery_slider .placeholder {
display: none;
}
}
.block--gallery_slider .wrapper-text {
max-width: 50%;
width: 100%;
color: white;
line-height: 1.6;
}
@media (max-width: 1200px) {
.block--gallery_slider .wrapper-text {
max-width: 70vw;
width: 100%;
margin: auto;
}
}
.block--gallery_slider .wrapper-text .text * {
line-height: 1.6;
font-size: 18px;
font-family: 'Avenir';
font-weight: 300;
}
.block--gallery_slider .wrapper-button {
margin-top: 50px;
display: inline-block;
position: relative;
}
@media (max-width: 1200px) {
.block--gallery_slider .wrapper-button {
max-width: 80vw;
width: 100%;
}
}
.block--gallery_slider .wrapper-button:hover .primary.button {
opacity: 0;
visibility: hidden;
pointer-events: none;
z-index: 1;
}
.block--gallery_slider .wrapper-button:hover .hover.button-alt {
opacity: 1;
visibility: visible;
pointer-events: auto;
z-index: 2;
}
.block--gallery_slider .wrapper-button .button {
position: absolute;
top: 0;
left: 0;
white-space: nowrap;
text-transform: uppercase;
font-family: 'Avenir';
font-weight: 500;
line-height: 19px;
font-size: 14px;
letter-spacing: 0.5px;
padding: 20px 45px;
border-radius: 50px;
text-decoration: none !important;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
@media (max-width: 1200px) {
.block--gallery_slider .wrapper-button .button {
width: 100%;
}
}
.block--gallery_slider .wrapper-button .button.primary {
color: #472D17;
background-color: #E7DED5;
border: 1px solid #E7DED5;
opacity: 1;
visibility: visible;
pointer-events: auto;
z-index: 2;
}
.block--gallery_slider .wrapper-button .hover.button-alt {
color: #472D17;
background-color: transparent;
border: 1px solid #472D17;
opacity: 0;
visibility: hidden;
pointer-events: none;
z-index: 1;
}
.block--gallery_slider .slick-dots {
position: absolute;
bottom: 50px;
right: 50px;
z-index: 10;
width: auto;
display: flex;
gap: 10px;
}
.block--gallery_slider .slick-dots li {
margin: 0;
width: 9px;
height: 9px;
}
.block--gallery_slider .slick-dots li button {
width: 9px;
height: 9px;
padding: 0;
}
.block--gallery_slider .slick-dots li button:before {
color: white;
opacity: 0.75;
font-size: 9px;
width: auto;
height: auto;
}
.block--gallery_slider .slick-dots li .slick-active button:before {
opacity: 1;
color: white;
}
.block--gallery_slider .slick-prev,
.block--gallery_slider .slick-next {
width: 25px;
height: 45px;
z-index: 11;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
opacity: 0.7;
transition: 0.3s;
position: absolute;
bottom: 285px;
top: unset;
}
.block--gallery_slider .slick-prev:hover,
.block--gallery_slider .slick-next:hover {
opacity: 1;
}
.block--gallery_slider .slick-prev:before,
.block--gallery_slider .slick-next:before {
display: none;
}
@media (max-width: 575px) {
.block--gallery_slider .slick-prev,
.block--gallery_slider .slick-next {
width: 15px;
height: 25px;
}
}
.block--gallery_slider .slick-prev {
background-image: url(//ogonlocksakademin.se/wp-content/themes/ogonlocksakademin/static/img/arrow-prev.svg);
left: 35px;
}
@media (max-width: 575px) {
.block--gallery_slider .slick-prev {
left: 10px;
}
}
.block--gallery_slider .slick-next {
background-image: url(//ogonlocksakademin.se/wp-content/themes/ogonlocksakademin/static/img/arrow-next.svg);
right: 35px;
}
@media (max-width: 575px) {
.block--gallery_slider .slick-next {
right: 10px;
}
}
.block--gallery_slider.slick-dotted.slick-slider {
margin-bottom: 0;
}