.sticky-button-komfort {
position: fixed;
right: 0;
bottom: 200px;
background: white;
border-radius: 10px 0 0 10px;
padding: 10px;
width: 80px;
height: 100px;
z-index: 999;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-transition: 0.3s;
transition: 0.3s;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
overflow: hidden;
-webkit-box-shadow: 0px 0px 24px -9px rgba(0, 0, 0, 0.7);
box-shadow: 0px 0px 24px -9px rgba(0, 0, 0, 0.7);
}
@media screen and (max-width: 600px) {
.sticky-button-komfort {
height: 78px;
width: 66px;
}
}
.sticky-button-komfort.open, .sticky-button-komfort.hovered {
width: 250px;
}
@media screen and (max-width: 600px) {
.sticky-button-komfort.open, .sticky-button-komfort.hovered {
width: 190px;
}
}
.sticky-button-komfort.open img.logo-full, .sticky-button-komfort.hovered img.logo-full {
opacity: 1;
}
.sticky-button-komfort.open p, .sticky-button-komfort.hovered p {
opacity: 1;
}
.sticky-button-komfort p {
position: absolute;
opacity: 0;
right: 10px;
width: 217px;
overflow: hidden;
max-width: 217px;
font-size: 14px;
color: black;
margin: 0;
top: 3px;
}
@media screen and (max-width: 600px) {
.sticky-button-komfort p {
width: 170px;
top: 1px;
font-size: 12px;
}
}
.sticky-button-komfort img.logo-full {
position: absolute;
opacity: 0;
right: 10px;
width: 217px;
max-width: 217px;
-webkit-transition: 0.2s;
transition: 0.2s;
}
@media screen and (max-width: 600px) {
.sticky-button-komfort img.logo-full {
width: 170px;
}
}
.sticky-button-komfort img.logo-part {
height: 36px;
}
@media screen and (max-width: 600px) {
.sticky-button-komfort img.logo-part {
height: 29px;
}
}