:root {

  --Red-200: #F6303F;
  --Grey-100: #F6F6F7;
  --Grey-90: #F7F9FB;
  --Grey-200: #E4E4E5;
  --Grey-300: #BBBBBD;
  --Grey-400: #78777C;
  --Grey-500: #434446;
  --Grey-600: #202022;
  --Light-Blue: #DDE6ED;


  --zeit: 0.3s;
  --zeit2: 0.4s;
  --zeit3: 0.6s;

}


/* ----------------------------------------- Weiterlesen ----------------------------------------- */




.weiterlesen.text-button {}

.uncode_text_column.weiterlesen {
  margin-top: 32px !important;
  border: 2px;
}

.weiterlesen .rmwp-button-wrap button {
  display: block !important;
  position: relative;
  margin-top: 32px;
  border-radius: 16px !important;
  border: none !important;
  padding: 13px 173px 15px 20px !important;
  color: var(--Grey-500) !important;
  font-size: 16px !important;
  font-weight: 500;
  line-height: 1.5em !important;
  background-color: var(--Grey-100);
  transition: all var(--zeit); ease-in-out;
}


.weiterlesen .rmwp-button-wrap button::after {
  content: "+";
  font-size: 30px;
  font-weight: 400;
  display: flex;
  position: absolute;
  right: 10px;
  color: var(--Red-200);
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  transition: all var(--zeit); ease-in-out;
}

.weiterlesen .rmwp-button-wrap button.open::after {
  content: "–";
  font-size: 30px;
  display: flex;
  font-weight: 400 !important;
  position: absolute;
  right: 10px;
  color: var(--Red-200);
  top: 43%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  transition: all var(--zeit); ease-in-out;
}

.weiterlesen .rmwp-button-wrap button:hover {
    color: white !important;
    background-color: var(--Red-200);

}

.weiterlesen .rmwp-button-wrap button:hover::after {
    color: white !important;

}

@media screen and (max-width: 959px) {

.weiterlesen .rmwp-button-wrap button::after {
  content: "+";
  font-size: 28px;
  font-weight: 400;
  display: flex;
  position: absolute;
  right: 10px;
  color: var(--Red-200);
  top: 53%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  transition: all var(--zeit); ease-in-out;
}

.weiterlesen .rmwp-button-wrap button {
  display: block !important;
  padding: 11px 180px 13px 20px !important;
  font-size: 15.6px !important;
  line-height: 1.5em !important;
}

.weiterlesen .rmwp-button-wrap button.open::after {
  font-size: 28px !important;
  top: 42%;
  transform: translateY(-53%);
  width: 22px;
  height: 22px;
}

}

/* ----------------------------------------- Werteslider ----------------------------------------- */



.werteslider .t-entry { 
  display: flex !important;
  flex-direction: column !important;
}

.werteslider .t-entry p {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.werteslider .rmwp-toggle.open { margin-top: 45px !important; }

.werteslider .ellipsis { display: none !important; }

.uncode_text_column.weiterlesen {
  margin-top: 32px !important;
  border: 2px;
}

.werteslider .rmwp-button-wrap button {
  display: block !important;
  position: relative;
  margin-top: 45px;
  border-radius: 16px !important;
  border: none !important;
  padding: 0 !important;
  color: white !important;
  font-size: 24px !important;
  font-weight: 500;
  line-height: 1.5em !important;
  background-color: var(--Red-200);
  width: 60px;
  height: 60px;
  transition: all var(--zeit) ease-in-out;
}

.werteslider .rmwp-button-wrap button.open {
  padding-bottom: 4px !important;
}

.werteslider .rmwp-button-wrap button:hover,
.werteslider .rmwp-button-wrap button.open {
    background-color: black;
}

.werteslider .rmwp-button-wrap button.open:hover {
    background-color: var(--Red-200);
}



@media screen and (max-width: 959px) {


.werteslider .rmwp-toggle.open { margin-top: 36px !important; }

.werteslider .rmwp-button-wrap button {
  margin-top: 36px;
  width: 42px;
  height: 42px;
  transition: all var(--zeit) ease-in-out;
  padding-bottom: 2px !important;
}

}