#content-container{
    background-color: #d2d2d2;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}
#sp_banner{
    width:100%;
}
.colGold{
    color: #cc9000;
}
.order-4{
    padding-top: 30px;
}
#sp li {
    list-style-type: disc;
    padding: 4px 0 18px 0;
    line-height: 1.4em;
}
.round1 .posAbsolute img,
.round2 .posAbsolute img{
    margin: 0 0 30px 0;
    width:40%;
    max-width: 140px; 
}
.round3 .posAbsolute img{
    margin: 0 0 40px 0;
    width:90%;
    max-width: 280px;
}
.round1,.round2,.round3{
    padding:0 0 24px 0;
    text-align:center;
}
.round img{
    width:100%;
    max-width: 384px;
}
.circle{
    border-radius: 50%;
    background-color:#fff;
}
button.green{
    padding: 12px 20px 13px 20px;
    border-radius:9px;
    color: #fff;
    font-size: 24px !important;
    background-color: rgb(14,92,92);
}
button.green:hover{
    background-color: rgb(14,92,92,0.7);
}
.bg_grey{
    background-color:#f1f1f1;
}
.sideBadgeRight{
    position:relative;
    right:-86px;
}
.sideBadgeLeft{
    position:relative;
    left:-86px;
}
.sideBadge img{
    width: 107%;
}
.badgeLeft{
    order: 2 !important;
}
.badgeRight{
    order: 3 !important;
}
.badgeRight img{
    float: right;
}

.posAbsolute{
    position:absolute;
    top: 30px;
    bottom: 0;
    margin: auto;    
    left: 0;
    right: 0;
    text-align: center;
    padding:30px;
    max-width:384px;
}
.posRelative{
    position:relative;
}
#sp ul{
    margin: 8px 0 0 28px;
}
#sp ul.smaller{
    margin-right: 340px;
}
#sp{
    overflow: hidden;
    background-color: #fff;
    font-size: 18px;
    line-height: 16px;
    /*max-width: 1200px;*/
    margin: -22px auto 0;
}
.sp_inner{
    margin: auto;
    padding: 30px;
    max-width: 800px;
    /*min-width: 210px;*/
}
.row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(var(--bs-gutter-y) * -1);
  margin-right: calc(var(--bs-gutter-x) / -2);
  margin-left: calc(var(--bs-gutter-x) / -2);
}
.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  /*
  padding-right: calc(var(--bs-gutter-x) / 2);
  padding-left: calc(var(--bs-gutter-x) / 2);
  margin-top: var(--bs-gutter-y);
  */
}

.col {
  flex: 1 0 0%;
}
#sp .FontBig{
    font-size: 18px !important;
    color: #cc9000;
    text-transform: uppercase;
}
#sp .FontBig2{
    font-size: 20px !important;
}
#sp .FontBig4{
    font-size: 18px !important;
    font-weight: bold;
    text-transform: uppercase;
}
#sp .win_text{
    /*font-size: 13px !important; */
    padding: 5px 0 10px 15px;
}
#sp .win{
    position: relative;
    padding: 20px 0 0 168px;
    min-height: 190px;
}
#sp .win.short{
    max-width: 610px;
}
#sp .banner1{
    position: absolute;
    top: 0;
    left: -40px;
}
#sp .banner2,
#sp .banner3,
#sp .banner4{
    position: relative;
    left: -208px;
    padding: 10px 0;
}
#sp .headline{
    font-size: 30px;
    font-weight: bold;
}
#sp .startBTN{
    position: absolute;
    right: -30px;
    top: 250px;
}
#sp .intro{
    font-size: 24px;
    line-height: 32px;
    padding: 0 0 90px 0;
}
#sp .badge{
    position: absolute;
    top: -60px;
    right: -500px;
}
#sp .badge:hover{
    cursor: pointer;
    content: url('/img/landing-pages/winterschreibwb_2020/Winterroman-Wettbewerb-2020-LP-badge_active.png');
}
.col-auto {
  flex: 0 0 auto;
  width: auto;
}

.col-1 {
  flex: 0 0 auto;
  width: 8.3333333333%;
}

.col-2 {
  flex: 0 0 auto;
  width: 16.6666666667%;
}

.col-3 {
  flex: 0 0 auto;
  width: 25%;
}

.col-4 {
  flex: 0 0 auto;
  width: 33.3333333333%;
}

.col-5 {
  flex: 0 0 auto;
  width: 41.6666666667%;
}

.col-6 {
  flex: 0 0 auto;
  width: 50%;
}

.col-7 {
  flex: 0 0 auto;
  width: 58.3333333333%;
}

.col-8 {
  flex: 0 0 auto;
  width: 66.6666666667%;
}

.col-9 {
  flex: 0 0 auto;
  width: 75%;
}

.col-10 {
  flex: 0 0 auto;
  width: 83.3333333333%;
}

.col-11 {
  flex: 0 0 auto;
  width: 91.6666666667%;
}

.col-12 {
  flex: 0 0 auto;
  width: 100%;
}
.order-0 {
  order: 0 !important;
}

.order-1 {
  order: 1 !important;
}

.order-2 {
  order: 2 !important;
}

.order-3 {
  order: 3 !important;
}

.order-4 {
  order: 4 !important;
}

.order-5 {
  order: 5 !important;
}
@media (min-width: 768px) {
    
    .round1,.round2,.roud3{
        padding:0 0 4px 0
    }
    .round1 .posAbsolute{
        right: 26px;
    }
    .round2 .posAbsolute{
        left: 26px;
    }
    .order-4{
        padding-top: 150px;
    }
    .order-1{
        padding-top:100px;
    }
    .innerContentRight{
        padding: 0 0 0 50px;
    }
    .innerContentLeft{
        padding: 0 50px 0 0;
    }
    .sideBadgeLeft{
        left:-10px;
    }
    .sideBadgeRight{
        right:-10px;
    }    
    .round1{
        text-align:left;
    }
    .round2{
        text-align:right;
    }

    #sp .FontBig2{
        font-size: 30px !important;    
    }
    #sp .headline{
        font-size: 50px;
    }

    .sideBadge img{
        width: 190%;
    }
    .badgeRight img{
        float: left;
    }
    .badgeLeft img{
        float: right;
    }
    .badgeLeft{
        order: 3 !important;
    }
    .badgeRight{
        order: 2 !important;
    }

  .col-md {
    flex: 1 0 0%;
  }

  .row-cols-md-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-md-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-md-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-md-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-md-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-md-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-md-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-md-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-md-1 {
    flex: 0 0 auto;
    width: 8.3333333333%;
  }

  .col-md-2 {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-md-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-md-4 {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .col-md-5 {
    flex: 0 0 auto;
    width: 41.6666666667%;
  }

  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-md-7 {
    flex: 0 0 auto;
    width: 58.3333333333%;
  }

  .col-md-8 {
    flex: 0 0 auto;
    width: 66.6666666667%;
  }

  .col-md-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-md-10 {
    flex: 0 0 auto;
    width: 83.3333333333%;
  }

  .col-md-11 {
    flex: 0 0 auto;
    width: 91.6666666667%;
  }

  .col-md-12 {
    flex: 0 0 auto;
    width: 100%;
  }
}



@media only screen and (max-width:850px){
    #sp .win.short{max-width:100%;}
    #sp .win{padding: 20px 0;}
    #sp .intro{font-size: 21px;line-height: 28px;}
    #sp .banner1, #sp .banner2, #sp .banner3, #sp .banner4{position:relative;width:calc(100% + 60px);left: -30px !important;}
    #sp .intro{padding: 0 0 20px 0;}
    #sp ul.smaller{margin-right: 0;}
    #sp .badge{position: static;}
    .winterschreibwb_inner{padding: 30px;}    
    #sp .banner1 img, #sp .banner2 img, #sp .banner3 img, #sp .banner4 img, #sp .badge img{width:100%}
    #sp .banner1, #sp .banner2, #sp .banner3, #sp .banner4, #sp .badge{left:0}
}
