@media only screen and (min-width: 767px) {
  #startseite .teaserContainer {
    background-color: #ccc; } }

@media only screen and (max-width: 768px) {
  #startseite .teaserContainer {
    margin: 0 -2px;
    background-color: #ccc;
    padding: 10px 0; } }

#startseite .teaserContainer .teaserBox {
  width: 100%;
  background-color: #fff;
  margin: 10px 0 10px 10px; }
  @media only screen and (max-width: 768px) {
    #startseite .teaserContainer .teaserBox {
      border-left: 10px solid #fff;
      padding: 10px 0;
      margin: 10px 0 10px 0px; }
      #startseite .teaserContainer .teaserBox:first-child {
        margin-top: 0; }
      #startseite .teaserContainer .teaserBox:last-child {
        margin-bottom: 0; } }
  @media only screen and (min-width: 767px) {
    #startseite .teaserContainer .teaserBox {
      width: calc(33.33% - 11px);
      float: left;
      margin: 10px 7px 0px 5px;
      position: relative;
      background-color: #f2f2f2; } }
  #startseite .teaserContainer .teaserBox:last-child {
    margin-right: 0; }
  #startseite .teaserContainer .teaserBox .topLineKategorie {
    position: relative; }
    @media only screen and (min-width: 767px) {
      #startseite .teaserContainer .teaserBox .topLineKategorie {
        position: absolute;
        right: 40px;
        top: 161px; } }
    #startseite .teaserContainer .teaserBox .topLineKategorie.news {
      background-color: #00aded; }
      #startseite .teaserContainer .teaserBox .topLineKategorie.news .kategorieIcon {
        background-color: #00aded;
        background-image: url("https://tmsi.akamaized.net/startseite/teaser/teaser_news.svg");
        -webkit-background-size: 23px;
        background-size: 23px; }
    #startseite .teaserContainer .teaserBox .topLineKategorie.wettbewerb {
      background-color: #8f1a29; }
      #startseite .teaserContainer .teaserBox .topLineKategorie.wettbewerb .kategorieIcon {
        background-color: #8f1a29;
        background-image: url("https://tmsi.akamaized.net/startseite/teaser/teaser_live.svg");
        -webkit-background-size: calc(100% - 10px);
        background-size: calc(100% - 10px); }
    #startseite .teaserContainer .teaserBox .topLineKategorie.community {
      background-color: #efa93b; }
      #startseite .teaserContainer .teaserBox .topLineKategorie.community .kategorieIcon {
        background-color: #efa93b;
        background-image: url("https://tmsi.akamaized.net/startseite/teaser/teaser_community.svg");
        -webkit-background-size: calc(100% - 10px);
        background-size: calc(100% - 10px); }
    #startseite .teaserContainer .teaserBox .topLineKategorie.galerie {
      background-color: #1a3151; }
      #startseite .teaserContainer .teaserBox .topLineKategorie.galerie .kategorieIcon {
        background-color: #1a3151;
        background-image: url("https://tmsi.akamaized.net/startseite/teaser/teaser_gallerie.svg");
        -webkit-background-size: 20px;
        background-size: 20px; }
    #startseite .teaserContainer .teaserBox .topLineKategorie.internes {
      background-color: #1a3151; }
      #startseite .teaserContainer .teaserBox .topLineKategorie.internes .kategorieIcon {
        background-color: #1a3151;
        background-image: url("https://tmsi.akamaized.net/startseite/teaser/teaser_tm.svg"); }
    #startseite .teaserContainer .teaserBox .topLineKategorie.tv {
      background-color: #8d5ba1; }
      #startseite .teaserContainer .teaserBox .topLineKategorie.tv .kategorieIcon {
        background-color: #8d5ba1;
        background-image: url("https://tmsi.akamaized.net/startseite/teaser/teaser_play.svg");
        -webkit-background-size: 28px;
        background-size: 28px;
        background-position: 0px; }
    #startseite .teaserContainer .teaserBox .topLineKategorie.statistik {
      background-color: #749f18; }
      #startseite .teaserContainer .teaserBox .topLineKategorie.statistik .kategorieIcon {
        background-color: #749f18;
        background-image: url("https://tmsi.akamaized.net/startseite/teaser/teaser_statistik.svg"); }
    #startseite .teaserContainer .teaserBox .topLineKategorie.wahretabelle {
      background-color: #429535; }
      #startseite .teaserContainer .teaserBox .topLineKategorie.wahretabelle .kategorieIcon {
        background-color: #429535;
        background-image: url("https://tmsi.akamaized.net/startseite/teaser/teaser_wahretabelle.png"); }
    #startseite .teaserContainer .teaserBox .topLineKategorie .kategorieIcon {
      height: 38px;
      width: 38px;
      display: inline-block;
      background-repeat: no-repeat;
      -webkit-background-size: calc(100% - 4px);
      background-size: calc(100% - 4px);
      background-position: center;
      border: 2px solid #fff;
      border-radius: 100%;
      padding: 2px;
      position: absolute;
      left: -8px;
      z-index: 2; }
  #startseite .teaserContainer .teaserBox .topLineLeft {
    height: 26px;
    font-family: "Oswald", sans-serif;
    font-weight: bold;
    color: #fff;
    width: 50%;
    position: relative;
    float: left;
    text-transform: uppercase;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center; }
    @media only screen and (min-width: 767px) {
      #startseite .teaserContainer .teaserBox .topLineLeft {
        width: auto;
        padding: 0 10px;
        margin-top: -13px;
        right: initial;
        top: initial;
        font-size: 15px; } }
    @media only screen and (max-width: 768px) {
      #startseite .teaserContainer .teaserBox .topLineLeft {
        -webkit-border-radius: 25px;
        -moz-border-radius: 25px;
        border-radius: 25px; } }
    #startseite .teaserContainer .teaserBox .topLineLeft .teaserWappen {
      position: absolute;
      right: -16px;
      height: 32px;
      width: 32px;
      background: #fff;
      padding: 2px;
      top: -3px;
      z-index: 2;
      -webkit-box-shadow: 0px 1px 3px 0 rgba(0, 0, 0, 0.3);
      -moz-box-shadow: 0px 1px 3px 0 rgba(0, 0, 0, 0.3);
      box-shadow: 0px 1px 3px 0 rgba(0, 0, 0, 0.3);
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      align-items: center;
      justify-content: center; }
      #startseite .teaserContainer .teaserBox .topLineLeft .teaserWappen img {
        max-width: 28px;
        height: auto; }
  #startseite .teaserContainer .teaserBox .topLineRight {
    height: 26px;
    font-family: "Oswald", sans-serif;
    font-weight: bold;
    color: #fff;
    background-color: #1a3151;
    width: 50%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center; }
    #startseite .teaserContainer .teaserBox .topLineRight .newsSubline {
      padding: 0 20px;
      text-transform: uppercase; }
  #startseite .teaserContainer .teaserBox .teaserContent {
    display: flex;
    flex-direction: row;
    height: 100%;
    position: relative; }
    #startseite .teaserContainer .teaserBox .teaserContent .playButton {
      height: 30px;
      width: 34px;
      left: 25%;
      right: initial;
      margin-left: -17px;
      top: 25%;
      margin-top: 10px;
      bottom: initial; }
      #startseite .teaserContainer .teaserBox .teaserContent .playButton span {
        background: #ccc;
        display: block;
        height: 30px;
        width: 34px;
        border: 1px solid #fff;
        border-radius: 0; }
        #startseite .teaserContainer .teaserBox .teaserContent .playButton span:after {
          top: 7px;
          left: 11px;
          border-width: 7px 0 7px 12px;
          border-color: rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) #fff; }
    #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent {
      position: absolute;
      height: 100%;
      width: 50%; }
      @media only screen and (min-width: 767px) {
        #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent {
          width: 100%; } }
      #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_h,
      #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_g {
        font-family: "Oswald", sans-serif;
        font-size: 8px;
        font-weight: bold;
        color: #333;
        width: 33.33%; }
        @media only screen and (min-width: 767px) {
          #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_h,
          #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_g {
            font-size: 12px; } }
      #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_h {
        text-align: center; }
        #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_h img {
          -webkit-filter: drop-shadow(0px 0px 8px #fff);
          filter: drop-shadow(0px 0px 8px #fff);
          height: 40px;
          width: 40px;
          margin-bottom: 4px; }
          @media only screen and (min-width: 767px) {
            #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_h img {
              height: auto;
              width: 70px; } }
        #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_h .nmFlagge {
          width: 40px;
          height: 40px;
          border-radius: 50%;
          -moz-border-radius: 50%;
          -webkit-border-radius: 50%;
          border: 2px solid #ccc; }
          @media only screen and (min-width: 767px) {
            #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_h .nmFlagge {
              height: 80px;
              width: 80px; } }
      #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_g {
        text-align: center; }
        #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_g img {
          -webkit-filter: drop-shadow(0px 0px 8px #fff);
          filter: drop-shadow(0px 0px 8px #fff);
          height: 40px;
          width: 40px;
          margin-bottom: 4px; }
          @media only screen and (min-width: 767px) {
            #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_g img {
              height: auto;
              width: 70px; } }
        #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_g .nmFlagge {
          height: 40px;
          width: 40px;
          border-radius: 50%;
          -moz-border-radius: 50%;
          -webkit-border-radius: 50%;
          border: 2px solid #ccc; }
          @media only screen and (min-width: 767px) {
            #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .wappen_g .nmFlagge {
              height: 80px;
              width: 80px; } }
      #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .ergebnis {
        display: inline-block;
        background-color: #ccc;
        color: #333;
        text-align: center;
        min-width: 40px;
        font-family: "Oswald", sans-serif;
        font-weight: 700;
        font-size: 12px;
        line-height: 20px;
        height: 20px;
        padding: 0 5px;
        margin: 0 8px; }
        @media only screen and (min-width: 767px) {
          #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .ergebnis {
            font-size: 30px;
            line-height: 40px;
            height: 40px;
            padding: 0 10px; } }
        #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .ergebnis span {
          font-size: 40px;
          display: block;
          width: 100%;
          text-align: center; }
        #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .ergebnis .ergebnis_zusatz {
          font-size: 12px;
          display: inline; }
        #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .ergebnis.finished {
          font-family: "Source Sans Pro", sans-serif;
          background-color: #1d75a3;
          font-weight: 700;
          color: #fff; }
        #startseite .teaserContainer .teaserBox .teaserContent .teaserBegegnungContent .ergebnis.live-ergebnis {
          font-family: "Source Sans Pro", sans-serif;
          background-color: #8f1a29;
          color: #fff;
          font-weight: 700; }
  @media only screen and (max-width: 768px) {
    #startseite .teaserContainer .teaserBox .teaserFoto {
      margin-top: 2px;
      float: left;
      width: 50%;
      height: 50%; } }
  @media only screen and (min-width: 767px) {
    #startseite .teaserContainer .teaserBox .teaserFoto {
      height: 180px; } }
  @media only screen and (min-width: 767px) {
    #startseite .teaserContainer .teaserBox h3,
    #startseite .teaserContainer .teaserBox .flexCenter,
    #startseite .teaserContainer .teaserBox .teaser-headline {
      padding: 10px; } }
  #startseite .teaserContainer .teaserBox h3 .teaserWappen,
  #startseite .teaserContainer .teaserBox .flexCenter .teaserWappen,
  #startseite .teaserContainer .teaserBox .teaser-headline .teaserWappen {
    height: 45px;
    min-width: 45px;
    background: #fff;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: center;
    justify-content: center; }
    #startseite .teaserContainer .teaserBox h3 .teaserWappen img,
    #startseite .teaserContainer .teaserBox .flexCenter .teaserWappen img,
    #startseite .teaserContainer .teaserBox .teaser-headline .teaserWappen img {
      max-width: 30px;
      height: auto; }
  @media only screen and (max-width: 768px) {
    #startseite .teaserContainer .teaserBox h3,
    #startseite .teaserContainer .teaserBox .flexCenter,
    #startseite .teaserContainer .teaserBox .teaser-headline {
      width: 50%;
      margin-top: 2px; } }
  @media only screen and (min-width: 767px) {
    #startseite .teaserContainer .teaserBox h3,
    #startseite .teaserContainer .teaserBox .flexCenter,
    #startseite .teaserContainer .teaserBox .teaser-headline {
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      align-items: center; } }
  #startseite .teaserContainer .teaserBox h3 .text,
  #startseite .teaserContainer .teaserBox .flexCenter .text,
  #startseite .teaserContainer .teaserBox .teaser-headline .text {
    font-family: "Oswald", sans-serif;
    font-size: 16px;
    line-height: 21px;
    color: #333;
    padding: 10px; }
    @media only screen and (min-width: 767px) {
      #startseite .teaserContainer .teaserBox h3 .text,
      #startseite .teaserContainer .teaserBox .flexCenter .text,
      #startseite .teaserContainer .teaserBox .teaser-headline .text {
        padding: 0 10px; } }