#topangebote {
  width: 95px;
  height: 54px;
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 60;
  display: inline-block; }
  .fourButtonsMobil #topangebote {
    width: 75px; }
  @media (min-width: 992px) {
  #topangebote {
    width: 85px;
    height: 72px;
    bottom: auto;
    right: auto;
    top: 190px;
    left: 0;
    display: block;
    -webkit-transition: 0.2s ease;
    -moz-transition: 0.2s ease;
    -ms-transition: 0.2s ease;
    -o-transition: 0.2s ease;
    transition: 0.2s ease; } }
  #topangebote > span {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background: #4c4c4c;
    color: #fff;
    font-size: 0.825rem;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
    letter-spacing: 1px;
    text-transform: uppercase;
    line-height: 54px; }
    @media (min-width: 992px) {
  #topangebote > span {
    line-height: 72px;
    background: rgba(91, 103, 112, 1); } }
    #topangebote > span i {
      width: 20px;
      height: 20px;
      position: absolute;
      left: 50%;
      top: 50%;
      -moz-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -webkit-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      -webkit-transition: 0.2s ease;
      -moz-transition: 0.2s ease;
      -ms-transition: 0.2s ease;
      -o-transition: 0.2s ease;
      transition: 0.2s ease;
      display: none; }
      #topangebote > span i:before {
        font-family: 'default';
        font-weight: normal;
        text-indent: 0;
        font-style: normal;
        content: "\e90b";
        color: #fff;
        width: 20px;
        height: 20px;
        font-size: 20px;
        line-height: 20px;
        position: absolute;
        top: 0;
        left: 0;
        -webkit-transition: 0.2s ease;
        -moz-transition: 0.2s ease;
        -ms-transition: 0.2s ease;
        -o-transition: 0.2s ease;
        transition: 0.2s ease; }
  #topangebote #topangeboteInner {
    display: block;
    margin-left: 0;
    padding: 0px;
    position: absolute;
    right: 0px;
    top: 54px;
    -webkit-transition: 0.2s ease;
    -moz-transition: 0.2s ease;
    -ms-transition: 0.2s ease;
    -o-transition: 0.2s ease;
    transition: 0.2s ease;
    opacity: 0;
    visibility: hidden;
    width: 100vw;
    background: rgba(91, 103, 112, 1);
    text-align: left;
    padding: 1.25rem 1.25rem 0;
    color: #fff;
    font-size: 1rem; }
    @media (min-width: 768px) {
  #topangebote #topangeboteInner {
    padding: 2rem 2rem 0; } }
    @media (min-width: 992px) {
  #topangebote #topangeboteInner {
    left: 85px;
    width: 340px;
    top: 0; } }
    #topangebote #topangeboteInner header h2 {
      color: #fff;
      font-size: 2rem; }
    #topangebote #topangeboteInner .frame {
      margin-bottom: 0; }
  #topangebote.open > span {
    background: rgba(91, 103, 112, 1); }
  #topangebote.open #topangeboteInner {
    opacity: 1;
    visibility: visible; }
  #topangebote.open > span i {
    display: block; }
  #topangebote.open > span > span {
    display: none; }

@media (min-width: 992px) {
    #topangebote.positiontop {
      top: 140px; } }
