section.m34_historie{
opacity:0;
overflow: hidden;
background-image: url(//habe.de/wp-content/themes/HA-BE/img/history-bg.png);
background-size: cover;
background-repeat: no-repeat;
background-position: bottom center;
}
section.m34_historie .m34_historie_container {
position: relative;
}
section.m34_historie .m34_item_content{
display: flex;
justify-content: space-between;
height:100%;
}
section.m34_historie .m34_main_text_container{
column-count: 2;
gap: 0 68px;
margin-bottom: 100px;
line-height: 1.8;
}
section.m34_historie p{
margin:0;
}
section.m34_historie .m34_item{
}
section.m34_historie .m34_historie_container_load_more{
width: 100%;
display: table;
}
section.m34_historie .m34_historie_load_more{
display: table;
}
section.m34_historie .m34_historie_load_more_container{
position:relative;
width:200px;
}
section.m34_historie .m34_historie_load_more_loader{
position: absolute;
width: 100%;
transform: translate(50%, 0);
cursor:default;
}
section.m34_historie .m34_historie_load_more_text{
text-align:center;
cursor:pointer;
}
section.m34_historie .m34_content_container {
margin-top: 20px;
margin-bottom: 45px;
width: calc(33.33333% - 50px);
}
section.m34_historie .m34_link_container{
margin-top:20px;
}
section.m34_historie .m34_historie_pagination_container{
display:table;
}
section.m34_historie .m34_historie_pagination_container>div{
float:left;
cursor:pointer;
}
section.m34_historie .pagination_active{
color:#b04453;
}
section.m34_historie[data-text-kurzen="true"] .m34_title_text_container{
height: 120px;
overflow: hidden;
}
section.m34_historie .m34_image_container,
section.m34_historie .m34_historie_container_content {
width:66.66666%;
max-height: 600px;
}
section.m34_historie .m34_image_content,
section.m34_historie .m34_image_post {
height: 100%;
}
section.m34_historie .m34_image_container img{
width:100%;
height: 100%;
object-fit: contain;
object-position: center;
}
section.m34_historie .m34_text_container {
position: absolute;
left: 30px;
bottom: 25px;
}
section.m34_historie .m34_text_container p {
font-family: "oswald", sans-serif;
font-size: 1.7006rem;
font-weight: 700;
line-height: 1;
text-transform: uppercase;
letter-spacing: 1px;
}
section.m34_historie .m34_title h3 {
text-align: center;
font-size: 11.697rem;
color: #4eaf46;
line-height: 1;
margin-bottom: 0;
}
section.m34_historie .m34_arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 1;
cursor: pointer;
background: none;
}
section.m34_historie .m34_arrow.button {
border-radius: 50%;
padding: 17px 25px 18px;
}
section.m34_historie .m34_arrow.button.slick-disabled {
pointer-events: none;
}
section.m34_historie .m34_arrow_left {
left: -82px;
}
section.m34_historie .m34_arrow_right {
right: -82px;
}
section.m34_historie .m34_arrow svg {
fill: #fff;
width: 15px;
min-width: 15px;
height: 30px;
min-height: 30px;
}
section.m34_historie .m34_arrow_left svg {
transform: rotate(90deg);
}     section.m34_historie .slick_dots_container {
position: relative;
}
section.m34_historie .slick-dots {
display: flex;
justify-content: space-between;
padding: 0;
bottom: 0;
overflow-y: hidden;
overflow-x: scroll;
position: static;
}
section.m34_historie .slick_dots_container:before {
content: '';
position: absolute;
top: 9px;
left: 0;
width: 100%;
height: 2px;
background: #007fc5;
}
section.m34_historie .slick-dots li,
section.m34_historie .slick-dots li button {
width: auto;
height: auto;
}
section.m34_historie .slick-dots li {
height: 90px;
}
section.m34_historie .slick-dots li {
margin: 0;
}
section.m34_historie .slick-dots li:not(:last-child) {
padding-right: 17%;
}
section.m34_historie .slick-dots li button {
display: flex;
flex-direction: column; align-items: flex-start;
padding: 0;
height: auto;
width: 115px;
cursor: pointer;
}
section.m34_historie .slick-dots li button p {
font-size: 1rem;
color: #fff;
line-height: 1;
font-family: "obviously", sans-serif;
font-size: 1.5625rem;
-webkit-transition: font-size .4s;
-moz-transition: font-size .4s;
-ms-transition: font-size .4s;
-o-transition: font-size .4s;
transition: font-size .4s;
}
section.m34_historie .slick-dots li.slick-active button p {
font-size: 2.8125rem;
}
section.m34_historie .slick-dots li button:before {
content: none;
}
section.m34_historie .m34_dot_container {
display: flex;
justify-content: center;
align-items: center;
width: 16px;
height: 16px;
border-radius: 50%;
border: 1px solid #007fc5;
background: transparent;
margin-top: 2px;
margin-bottom: 11px;
-webkit-transition: border-color .4s, width .4s, height .4s, margin-top .4s, margin-bottom .4s;
-moz-transition: border-color .4s, width .4s, height .4s, margin-top .4s, margin-bottom .4s;
-ms-transition: border-color .4s, width .4s, height .4s, margin-top .4s, margin-bottom .4s;
-o-transition: border-color .4s, width .4s, height .4s, margin-top .4s, margin-bottom .4s;
transition: border-color .4s, width .4s, height .4s, margin-top .4s, margin-bottom .4s;
}
section.m34_historie .slick-active .m34_dot_container {
width: 20px;
height: 20px;
border-color: #007fc5;
margin-top: 0;
margin-bottom: 5px;
}
section.m34_historie .m34_dot {
width: 14px;
height: 14px;
border-radius: 50%;
border: 1px solid #007fc5;
background: #121212;
-webkit-transition: border-color .4s, width .4s, height .4s, background .4s;
-moz-transition: border-color .4s, width .4s, height .4s, background .4s;
-ms-transition: border-color .4s, width .4s, height .4s, background .4s;
-o-transition: border-color .4s, width .4s, height .4s, background .4s;
transition: border-color .4s, width .4s, height .4s, background .4s;
}
section.m34_historie .slick-active .m34_dot {
width: 10px;
height: 10px;
border-color: #007fc5;
background: #007fc5;
}
section.m34_historie .slick-dotted.slick-slider {
margin-bottom: 0;
display: flex;
flex-direction: column-reverse;
}
section.m34_historie .slick-list {
padding-bottom: 60px;
padding-top: 40px;
}
section.m34_historie .m34_historie_slider_dots_container {
position: relative;
height: 100%;
}
section.m34_historie .m34_historie_slider_dots_container .m34_shadow_container {
position: absolute;
left: 0;
top: 0;
height: 100%;
background: linear-gradient(to right, #121212, #121212 25%, #12121270 50%, #12121250 90%, #12121200 100%);
z-index: 2;
pointer-events: none;
}
section.m34_historie .m34_historie_slider_dots_container .m34_shadow_container.shadow_container_right {
background: linear-gradient(to left, #121212, #121212 25%, #12121270 50%, #12121250 90%, #12121200 100%);
left: auto;
right: 0;
}
section.m34_historie .slick_dots_container .slick-dots li {
cursor: grab;
}
section.m34_historie .slick_dots_container .slick-dots.dragging li {
cursor: grabbing;
}
section.m34_historie .slick_dots_container .slick-dots {
scrollbar-width: none;
}
section.m34_historie .slick_dots_container .slick-dots::-webkit-scrollbar {
display: none;
}
section.m34_historie .m34_content_container .headline {
font-size: 1.125rem;
font-weight: 600;
}
@media screen and (max-width: 1399px) {
section.m34_historie .m34_image_container, 
section.m34_historie .m34_historie_container_content {
max-height: 450px;
}
section.m34_historie .m34_historie_container { padding-bottom: 150px;
}
section.m34_historie .m34_arrow {
top: auto;
bottom: 0;
}
section.m34_historie .m34_arrow_left {
left: 0;
}
section.m34_historie .m34_arrow_right {
right: auto;
left: 77px;
}
}
@media screen and (max-width: 1199px) {
}
@media screen and (max-width: 991px) {
section.m34_historie .m34_image_container {
width: 65%;
}
section.m34_historie .m34_content_container {
width: calc(35% - 40px);
}
section.m34_historie .m34_main_text_container {
column-count: 1;
}
section.m34_historie[data-innerer-abstand="innerer_abstand_nur_oben"] {
padding-top: 0;
}
section.m34_historie .m34_main_text_container {
margin-bottom: 0;
}
}
@media screen and (max-width: 767px) {
section.m34_historie .slick-list {
padding-top: 0;
}
section.m34_historie .m34_item_content {
flex-direction: column-reverse;
}
section.m34_historie .m34_image_container {
width: 85%;
}
section.m34_historie .m34_content_container {
width: 85%;
}
section.m34_historie .slick-list {
padding-bottom: 0;
}
section.m34_historie .m34_historie_container {
padding-bottom: 100px;
}
section.m34_historie .m34_arrow {
bottom: -17px;
}
}
@media screen and (max-width: 575px) {
section.m34_historie .m34_image_container {
width: 100%;
}
section.m34_historie .m34_content_container {
width: 100%;
}
}
@media screen and (max-width: 475px) {
section.m34_historie .m34_title h3 {
font-size: 4.697rem;
}
section.m34_historie .m34_text_container p {
font-size: 1rem;
}
section.m34_historie .m34_text_container {
left: 15px;
bottom: 15px;
}
}