@font-face {font-family: 'Avenir';font-weight:bold;font-style: italic;src: url('/assets/fonts/355121_0_0.ttf') format('truetype');}
@font-face {font-family: 'Avenir';font-weight:normal;src: url('/assets/fonts/355126_0_0.ttf') format('truetype');}

#header {background-color: #D25052;}
#title {font-weight:bold;font-style: italic;color: #FFFFFF;text-transform: uppercase;transform: rotate(-2.5deg);z-index: 99;}

#contentActual:before {pointer-events: none;content: '';position: absolute;bottom: 100%;width: 0;height: 0;border-bottom: 4.2vw solid #fafbfe;border-left: 100vw solid transparent;}
#contentActual {position:relative;top:0;}
#contentActualGroup:before {pointer-events: none;content: '';position: absolute;bottom: 100%;width: 0;height: 0;border-bottom: 4.2vw solid #fafbfe;border-left: 100vw solid transparent;}
#contentActualGroup {position:relative;top:0;}
#contentFuture:before {pointer-events: none;content: '';position: absolute;bottom: 100%;width: 0;height: 0;border-bottom: 4.2vw solid #ffffff;border-left: 100vw solid transparent;}
#contentFuture {position:relative;top:0;background-color: #ffffff;}
#contentPast:before {pointer-events: none;content: '';position: absolute;bottom: 100%;width: 0;height: 0;border-bottom: 4.2vw solid #fafbfe;border-left: 100vw solid transparent;}
#contentPast {position:relative;top:0;}
#contentStreams:before {pointer-events: none;content: '';position: absolute;bottom: 100%;width: 0;height: 0;border-bottom: 4.2vw solid #fafbfe;border-left: 100vw solid transparent;}
#contentStreams {position:relative;top:0;}

#languageSelector {float: right;font-size: 20px;line-height: 20px;text-transform: uppercase;z-index: 1;}
#languageSelector .lang {cursor: pointer;text-decoration: none;float: right;margin-left: 10px;}
#languageSelector .lang:last-child{margin-left: 0px;}
#languageSelector .lang:hover {font-weight:bold;font-style: italic;}
#languageSelector .langActive {font-weight:bold;font-style: italic;}
#languageSelector a {text-decoration: none;color: #FFFFFF;}
#languageSelector a:hover {color: #FFFFFF;}

#loginHeader {float: right;font-size: 15px;line-height: 20px; color: #FFFFFF; z-index: 1;}
#loggedinAs {float: right;font-size: 15px;line-height: 20px; color: #FFFFFF; z-index: 1;}

#backToOverviewFooter {display: none;}

#socials {position: relative;margin-top:100px;background-color: #D25052;}
#socials:before {content:'';position: absolute;bottom: 100%;width: 0;height: 0;border-bottom: 4.2vw solid #D25052;border-left: 100vw solid transparent;}
#socials #socialsInner {position: relative;margin: 0 auto;padding: 47px 0 0;height: 208px;width: 720px;}
#socials #socialsInner .text {font-weight:bold;font-style: italic;font-size: 55px;color: #FFFFFF;line-height: 66px;float: left;margin-right: 40px;}
#socials #socialsInner .icon {float: left;margin-right: 25px;}
#socials #socialsInner .icon:nth-child(4) {margin-right: 0px;}
#socials.hide {display: none;}

#blockFooter {display: block;clear: both;position: relative;margin: 100px auto 0;color: #FFFFFF;background-color: #464646;}
#blockFooter:before {content: '';position: absolute;bottom: 100%;width: 0;height: 0;border-bottom: 4.2vw solid #464646;border-left: 100vw solid transparent;}
#blockFooter #blockFooterInner {position: relative;max-width: 1600px;margin: 0 auto;height: 115px;}
#blockFooter #blockFooterInner #footerLinks {font-size: 15px;line-height: 20px;color: #FFFFFF;border-top: 1px solid #FFFFFF;width: 100%;padding-top: 20px;position: absolute;bottom: 30px;}
#blockFooter #blockFooterInner #footerLinks a {color: #FFFFFF;}
#blockFooter #blockFooterInner #footerLinks a:hover {color: #D25052;}
#blockFooter #blockFooterInner #footerLinks .copyright {float: left;margin-right: 20px;}
#blockFooter #blockFooterInner #footerLinks .linkFooter {float: left;margin-right: 20px;}
#blockFooter #blockFooterInner #footerLinks .contact {float: right;margin-right: 20px;}
#blockFooter #blockFooterInner #footerLinks .partner {float: right;}
#blockFooter.hide {display: none;}

p {font-size: 20px}

.btn-primary {
  color: #fff;
  background-color: #D25052;
  border-color: #D25052;
  box-shadow: 0 2px 6px 0 rgba(210,80,82,.5);
}

.btn-primary:hover {
  background-color: #b92f32;
  border-color: #b92f32;
}

.scoreTable {
  font-size: 20px;
  background-color: #ffffff;
  margin-bottom: 10px;
  padding: 0;
}

.scoreTableRow0 {
  width: 40px;
  padding: 0;
  margin: 0;
}

.scoreTableRow0 div {
  padding: 0;
  margin: 0;
}

.scoreTableColResult {
  width: 42px;
  border-right: 3px solid #fafbfe;
}

.scoreTableColRet {
  width: 50px;
}

.scoreTableColServer {
  width: 30px;
}

.scoreTableColResultPoint {
  width: 50px;
}

.resultChanged {
  background-color: #FFFFFF;
  animation: backgroundResultChangeAnimation 10s;
}

@keyframes backgroundResultChangeAnimation {
  from {background-color: #e79b9d;}
  to {background-color: #FFFFFF;}
}

.play-button-icon {
  font-size: 30px;
  color: #D25052;
}

@media screen and (max-width: 1850px){
  #socials #socialsInner {height: 185px;}
}

@media screen and (max-width: 1600px){
  #socials #socialsInner {height: 175px;}
  #blockFooter #blockFooterInner {padding: 0 40px;}
  #blockFooter #blockFooterInner #footerLinks {width: calc(100% - 80px)}
}

@media screen and (max-width: 1200px){
  #socials #socialsInner {height: 155px;}
}


@media screen and (max-width: 1100px){
  #socials #socialsInner {height: 130px;width: 519px;}
  #socials #socialsInner .text {font-size: 35px;line-height: 51px;}
  #socials #socialsInner .icon img {width: 50px;}
}

@media screen and (max-width: 991px) {
  #blockFooter #blockFooterInner {height: 260px;}
  #blockFooter #blockFooterInner #footerLinks .contact {float: left;clear: both;margin-top: 10px;}
  #blockFooter #blockFooterInner #footerLinks .partner {float: left;clear: both;margin-top: 10px;}
}

@media screen and (max-width: 768px) {
  .scoreTable {font-size: 14px;}
  .scoreTableColResult {width: 34px;}

  #title {padding-top: 2.5rem !important;}
  #backToOverview {display: none;}
  #backToOverviewFooter {display: block;}

  #title {font-size: calc(0.9rem + 3.3vw);}
}

@media screen and (max-width: 600px){
  #socials #socialsInner {height: 95px;width: 409px;}
  #socials #socialsInner .text {font-size: 25px;line-height: 41px;}
  #socials #socialsInner .icon img {width: 40px;}
}

@media screen and (max-width: 480px){
  #socials #socialsInner {height: 160px;width: 199px;}
  #socials #socialsInner .text {margin-bottom: 15px;margin-right: 0px;}
  #socials #socialsInner .icon:nth-child(2) {clear: both;}

  #blockFooter #blockFooterInner #footerLinks .copyright {margin-bottom: 10px;}
  #blockFooter #blockFooterInner #footerLinks a:first-of-type .link {clear: both;}

}

@media screen and (max-width: 359px) {
  #blockFooter #blockFooterInner {height: 300px;}
  #languageSelector {font-size: 16px; line-height: 16px;}
  .lang {padding-top: 0.5rem !important;}
  #logo {padding-top: 0.5rem !important;}
  #logo img {width: 90%; height: 90%;}

}

@-webkit-keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

a {
  color: #D25052;
}

.ProgressbarBox {display:none;}

.nav-link.active {
  background-color: #fafbfe!important;
  border-color: #D25052!important;
}

.nav-link:hover {
  color: #D25052!important;;
}

.oopCourts {
  display: inline-block;
  width: 280px;
  padding: 0;
  border: 1px solid #eef2f7;
  vertical-align: top;
  margin-bottom: 24px;
  border-radius: 5px;
  background-color: #6c757d;
  color: #ffffff;
}

.oopCourts.oopCourts:not(:last-child) {
  margin-right: 5px;
}

.oopCourts .card {
  margin: 5px;
  color: #6c757d;
}

.oopCourts .card .card-body {
  padding: 5px;
}

.categoryHeadline {
  background-color: #6c757d!important;
  color: #ffffff;
}

.resultBold {
  font-weight: bold;
}

.logosContainer .card {margin: 0 5px 0 5px; }
.logosContainer a {display: flex; height: 97px; width: 100%; padding: 10px; align-items: center; justify-content: center;}
.logosContainer a img {max-width: 100%; max-height: 100%;}

@media (max-width: 575px) {
  .carousel-inner .carousel-item > div {
    display: none;
  }
  .carousel-inner .carousel-item > div:first-child {
    display: block;
  }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
  display: flex;
}

/* medium and up screens */
@media (min-width: 576px) {

  .carousel-inner .carousel-item-end.active,
  .carousel-inner .carousel-item-next {
    transform: translateX(25%);
  }

  .carousel-inner .carousel-item-start.active,
  .carousel-inner .carousel-item-prev {
    transform: translateX(-25%);
  }
}

.carousel-inner .carousel-item-end,
.carousel-inner .carousel-item-start {
  transform: translateX(0);
}

/*
 * Das Erscheinungsbild des Videoplayers steht in assets/css/kitris_player.css:
 * diese Datei hier wird im Seitenkopf geladen, die Vorgaben von Video.js aber
 * erst spaeter mit dem Player selbst - Regeln von hier wuerden also verlieren.
 */