@font-face {
    font-family: 'Saira';
    src: url('/pub/font/saira/saira-v2-latin-regular.eot');
    src: url('/pub/font/saira/saira-v2-latin-regular.eot?#iefix') format('embedded-opentype'),
         url('/pub/font/saira/saira-v2-latin-regular.woff2') format('woff2'),
         url('/pub/font/saira/saira-v2-latin-regular.woff') format('woff'),
         url('/pub/font/saira/saira-v2-latin-regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Saira';
    src: url('/pub/font/saira/saira-v2-latin-700.eot');
    src: url('/pub/font/saira/saira-v2-latin-700.eot?#iefix') format('embedded-opentype'),
         url('/pub/font/saira/saira-v2-latin-700.woff2') format('woff2'),
         url('/pub/font/saira/saira-v2-latin-700.woff') format('woff'),
         url('/pub/font/saira/saira-v2-latin-700.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Open Sans';
    src: url('/pub/font/opensans/open-sans-v15-latin-regular.eot');
    src: url('/pub/font/opensans/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'),
         url('/pub/font/opensans/open-sans-v15-latin-regular.woff2') format('woff2'),
         url('/pub/font/opensans/open-sans-v15-latin-regular.woff') format('woff'),
         url('/pub/font/opensans/open-sans-v15-latin-regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Open Sans';
    src: url('/pub/font/opensans/open-sans-v15-latin-700.eot');
    src: url('/pub/font/opensans/open-sans-v15-latin-700.eot?#iefix') format('embedded-opentype'),
         url('/pub/font/opensans/open-sans-v15-latin-700.woff2') format('woff2'),
         url('/pub/font/opensans/open-sans-v15-latin-700.woff') format('woff'),
         url('/pub/font/opensans/open-sans-v15-latin-700.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
/* common */
html {
  -webkit-text-size-adjust: none; /*-xwebkit-text-size-adjust: 100%;*/ /* this really fixes the ios font size problem on orientation change */
  text-rendering: geometricPrecision;   
}  
body,p,h1,h2,h3,h4,form,ul,li {
  margin: 0;
  padding: 0;
}
html {
  overflow-y: scroll;
}
p {
  line-height: 1.333em;
}
img {
  border-width: 0;
}
a, a:hover, a:active {
  color: inherit;
  text-decoration: none;
}
body {
  font: normal 1em 'Saira' ,Arial ,sans-serif;
  -webkit-text-size-adjust: none; /*-xwebkit-text-size-adjust: 100%;*/ /* this really fixes the ios font size problem on orientation change */
  /*font-size: 100%;
  font-size: 5vw;*/  
}
.hidden { display:none !important; }
/* tables that are too wide are scrollable */
.rtx .scrollable {
  position: relative;
  overflow: hidden;
}
.rtx .scrollable .scroller {
  position: relative;
  overflow-x: visible;
  overflow-y: hidden;
}

.rtx, .rtx > h2, .rtx > h3 {
  font-family: 'Saira', Arial ,sans-serif;
}
.rtx > p, .rtx > table, .rtx > ul, .rtx > ol, .rtx > ul > li, .rtx > ol > li {
  font-family: 'Open Sans', Arial, sans-serif;  
}


/* text styles */
.rtx p {
  line-height: 1.333em;
}
.rtx > h3 {
  font-size: 1em;
  line-height: 1.25em;
}
.rtx a, .rtx .tlink {
  text-decoration: none;
  color: #0032af;  
}
.rtx .spox, .rtx .tlink {
  font-weight: bold;
}
.rtx .tlink.nolink {
  background: none;
}
.rtx .tlink.nolink:hover {
  text-decoration: none;
}
.rtx span.ue3, .rtx p.ue3 {
  padding-left: 15px;
  font-weight: bold;
  position: relative;
}
.rtx span.ue3::before, .rtx p.ue3::before {
  content:"";
  position: absolute;
  top: .5em;
  width: 7px;
  height: 7px;
  background-color: #0032af;
  left: 0px;
}


.rtx .quote {
  color: #575757;
  font-style: normal;
  font-weight: bold;
}
.rtx .cite {
  color: #575757;
}

.rtx .linkdat::before {
  content: "DATEN";
  margin-right: 6px;
}
.rtx .label, .rtx .linkdat::before {
  display: inline-block;
  padding: 0 4px;
  margin-top: 2px;
  color: #ae0816;
  border: 1px solid #0032af;
  line-height: 1.3em;
  font-size: 0.875rem; /* 14px */
  font-weight: bold;
  text-transform: uppercase;
  text-decoration: none !important;
  vertical-align: top;
}
.rtx .gamecardyellow {
  background: url(/pub/pic/rtx/icon-game-cardyellow.gif) 0 4px no-repeat;
  padding-left: 10px;
  font-weight: bold;
}
.rtx .gamecardyellowred {
  background: url(/pub/pic/rtx/icon-game-cardyellowred.gif) 0 4px no-repeat;
  padding-left: 13px;
  font-weight: bold;
}
.rtx .gamecardred {
  background: url(/pub/pic/rtx/icon-game-cardred.gif) 0 4px no-repeat;
  padding-left: 10px;
  font-weight: bold;
}
.rtx .gamegoal {
  background: url(/pub/pic/rtx/icon-game-goal.gif) 0 4px no-repeat;
  padding-left: 13px;
  font-weight: bold;
}
.rtx .gamenogoal {
  background: url(/pub/pic/rtx/icon-game-nogoal.gif) 0 4px no-repeat;
  padding-left: 13px;
  font-weight: bold;
}
.rtx .gameowngoal {
  background: url(/pub/pic/rtx/icon-game-owngoal.gif) 0 4px no-repeat;
  padding-left: 13px;
  font-weight: bold;
}
.rtx .gamesubst {
  background: url(/pub/pic/rtx/icon-game-subst.gif) 0 4px no-repeat;
  padding-left: 16px;
  font-weight: bold;
}
.rtx .gamewhistle {
  background: url(/pub/pic/rtx/icon-game-whistle.gif) 0 4px no-repeat;
  padding-left: 16px;
  font-weight: bold;
}
.rtx .ticksubst {
  background: url(/pub/pic/rtx/icon-tick-subst.gif) 0 4px no-repeat;
  padding-left: 18px;
  font-weight: bold;
}
.rtx .tickinjury {
  background: url(/pub/pic/rtx/icon-tick-injury.gif) 0 4px no-repeat;
  padding-left: 18px;
  font-weight: bold;
}
.rtx .tickeng {
  background: url(/pub/pic/rtx/icon-tick-eng.gif) 0 4px no-repeat;
  padding-left: 18px;
  font-weight: bold;
}
.rtx .tickita {
  background: url(/pub/pic/rtx/icon-tick-ita.gif) 0 4px no-repeat;
  padding-left: 18px;
  font-weight: bold;
}
.rtx .tickspa {
  background: url(/pub/pic/rtx/icon-tick-spa.gif) 0 4px no-repeat;
  padding-left: 18px;
  font-weight: bold;
}
.rtx .tickfra {
  background: url(/pub/pic/rtx/icon-tick-fra.gif) 0 4px no-repeat;
  padding-left: 18px;
  font-weight: bold;
}
.rtx p.tickeng, .rtx p.tickita, .rtx p.tickspa, .rtx p.tickfra {
  padding-left: 18px;
  background-position-y: 8px;  
}
.rtx .tourdotted {
  background: url(/pub/pic/rtx/icon-tour-dotted.gif) 0 4px no-repeat;
  padding-left: 18px;
  font-weight: bold;
}
.rtx .tourgreen {
  background: url(/pub/pic/rtx/icon-tour-green.gif) 0 4px no-repeat;
  padding-left: 18px;
  font-weight: bold;
}
.rtx .tourwhite {
  background: url(/pub/pic/rtx/icon-tour-white.gif) 0 4px no-repeat;
  padding-left: 18px;
  font-weight: bold;
}
.rtx .touryellow {
  background: url(/pub/pic/rtx/icon-tour-yellow.gif) 0 4px no-repeat;
  padding-left: 18px;
  font-weight: bold;
}
.rtx .medals {
  background: url(/pub/pic/rtx/icon-medals.gif) 0 4px no-repeat;
  padding-left: 24px;
  font-weight: bold;
}
.rtx .medal1 {
  background: url(/pub/pic/rtx/icon-medal1.gif) 0 4px no-repeat;
  padding-left: 14px;
  font-weight: bold;
}
.rtx .medal2 {
  background: url(/pub/pic/rtx/icon-medal2.gif) 0 4px no-repeat;
  padding-left: 14px;
  font-weight: bold;
}
.rtx .medal3 {
  background: url(/pub/pic/rtx/icon-medal3.gif) 0 4px no-repeat;
  padding-left: 14px;
  font-weight: bold;
}
.rtx .live {
  background: url(/pub/pic/rtx/icon-live.gif) 0 4px no-repeat;
  padding-left: 28px;
  font-weight: bold;
}
.rtx .flagger {
  background: url(/pub/pic/rtx/icon-flag-ger.gif) 0 4px no-repeat;
  padding-left: 19px;
  font-weight: bold;
}
.rtx .orgioc {
  background: url(/pub/pic/rtx/icon-org-ioc.gif) 0 4px no-repeat;
  padding-left: 21px;
  font-weight: bold;
}
.rtx .orgredcross {
  background: url(/pub/pic/rtx/icon-org-redcross.gif) 0 4px no-repeat;
  padding-left: 19px;
  font-weight: bold;
}
.rtx .weathersmog {
  background: url(/pub/pic/rtx/icon-weather-smog.gif) 0 4px no-repeat;
  padding-left: 20px;
  font-weight: bold;
}
.rtx .itemshot {
  background: url(/pub/pic/rtx/icon-item-shot.gif) 0 4px no-repeat;
  padding-left: 26px;
  font-weight: bold;
}
.rtx .linkdia {
  background: url(/pub/pic/rtx/icon-dia.gif) 2px 2px no-repeat;
  padding-left: 21px;
}
.rtx .linkvid {
  background: url(/pub/pic/rtx/icon-vid.gif) 2px 2px no-repeat;
  padding-left: 21px;
}
.rtx ul {
  margin:0;
  padding:0;
  list-style-type: none;
}
.rtx > ul li {
  padding-left: 15px;
  position: relative;
  line-height: 1.333em;
}

.rtx > ul li::before {
  content:"";
  position: absolute;
  top: .5em;
  width: 6px;
  height: 6px;
  background-color: #575757;
  left: 0px;
}

/* tables */
.rtx table.wide {
  width: 100%;
}
.rtx table.ac tr:nth-child(2n+2) td {
  background-color: transparent;
}
.rtx table.ac tr:nth-child(2n+3) td {
  background-color: #cccaca;
}
.rtx table.taStd, .rtx table.taStd td {
  border: 1px solid #fb3500;
  border-collapse: collapse;
  padding: 0 4px;
}
.rtx tr.taHead td {
  background-color: #fb3500 !important;
  color: #ffffff;
  font-weight: bold;
}
.rtx .taHell {
  background-color: #ffffff;
}
.rtx .taDunkel {
  background-color: #cccaca;
}


.spxnav,
#spxmxfooter
{
  font: normal 1rem 'Saira', Arial ,sans-serif;
}
.spxnav a, .spxnav a:hover, .spxnav a:active,
#spxmxfooter a, #spxmxfooter a:hover, #spxmxfooter a:active 
{
  color: inherit;
  text-decoration: none;
}

.xcv {/* center vertically - this needs to be an extra surrounding tag within a relative positioned tag */
  display: flex;
  justify-content: center;
  flex-direction: column;
  height: 100%;
}

/* HEADER */
#spxmxunderheaderspace {
  height: 52px;
  background-color: #0b1124;  
}

#spxmxheader {
  position: fixed;
  top:0;
  width:100%;
  z-index: 1012;
  height:50px;
  border-bottom: 2px solid #fb3500;  
  background: #0b1124;
  transition: transform 0.3s ease;
}
#spxmxheader .spxlogo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align:center;
  padding-top: 9px;
}
#spxmxheader .spxlogo span {
  position: relative;
  overflow: hidden;
  display: inline-block;
  font-size:0.1em;
  line-height:0.1em;
}
#spxmxheader .spxlogo a {
  display: block;
  position: absolute;
  top:0;
  right:60px;
  height: 100%;
  width: calc(100% - 60px);
  color: transparent;
}
#spxmxheader .spxlogo .spx { right:0; width: 60px; }
#spxmxheader .spxlogo .spx.x { width: 100%; }

#spxmxheader #spxsearch {
  background: #0b1124 url(/pub/pic/lupe.svg) no-repeat center center;
  position: absolute;
  height: 50px;
  width: 43px;
  right: 0px;
  top: 0px;
  border-left:2px solid #0b1124;
}
.openSearch #spxmxheader #spxsearch {
  background: #202020 url(https://m.spox.com/pub/pic/menu_close.svg) no-repeat center center;
  border-left:2px solid #fb3500;
  border-bottom:2px solid #202020;  
}

#spxmxheader #spxnavi {
  background: #0b1124 url(https://m.spox.com/pub/pic/3-bar-menu.svg) no-repeat center center;
  position: absolute;
  height: 50px;
  width: 43px;
  left: 0;
  top: 0;
}
.openNav0 #spxmxheader #spxnavi {
  background: #0b1124 url(https://m.spox.com/pub/pic/menu_close.svg) no-repeat center center;
}

body.mxhide .mxhideable {
  display: none;
}

/* Suche */
.lsearch {
  box-sizing: border-box;  
  background-color: #202020;
  position: fixed;
  z-index: 1010;
  width:100%;  
  overflow: hidden; 
  height: 0px;
  transition:all 0.5s ease;
}
.openSearch .lsearch {
  height: 55px;
  border-bottom: 2px solid #fb3500; 
}

.lsearch .spc {
  box-sizing: border-box;
  position: relative;
  width: 100%;
  padding: 12px 43px 10px 10px;
}
.lsearch .fld {
  position: absolute;
  box-sizing: border-box;
  border-radius: 3px;
  padding: 4px 5px;
  background-color: #cdcdcd;
  font-size: 1rem; /* 16px */
  height: 29px;
  width: calc(100% - 53px);
  white-space: nowrap;
  overflow: hidden;  
  outline:0;
}
.lsearch .suchInp {
  border: 0;
  box-sizing: border-box;
  width : 100%;
  border-radius: 3px;
  padding: 4px 5px;
  background-color: #cdcdcd;
  font-size: 1rem; /* 16px */
  height: 29px;
}
.lsearch .suchDel {
  position: absolute;
  top:0;
  right:43px;
  height: 53px;
  width: 28px;
  background: url(/pub/pic/cross-red-searchfield.svg) no-repeat center center;
  border:0;
  display: none;
}
.lsearch .x .suchDel {
  display: block;
}
.lsearch .suchSub {
  position: absolute;
  top:0;
  right:0;
  height: 53px;
  width: 43px;
  background: #202020 url(/pub/pic/lupe.svg) no-repeat center center;
  border:0;
}
.lsearch .suchSub:focus { 
  background-color: rgba(255,255,255,0.1);
  border-radius: 5px;
}
.lsearch input:focus {
  outline:0;
}




/* NAVI */
.spxnav0 {
  width:100%;
  overflow: hidden;
  position: fixed;
  height: 100%;
  z-index: 1011;  
  padding-top: 50px;
  box-sizing: border-box;
  transition:all 0.5s ease-in;
  top:0;
  left: -101%;
}
.openNav0 .spxnav0 {
  left:0;
}
.spxnav0 .scrollerV {
  overflow-y: scroll;
  overflow-x: hidden;
  height:100%;
}
.spxnav0 ul {
  display: block;
  padding:0;
  margin:0;
  border:0;
}
.spxnav0 li {
  color: #ffffff;
}
.spxnav0 .scrollerV > ul {
  background-color: #0b1124;
  border-bottom: 1px solid #fb3500;
}
.spxnav0 .scrollerV > ul:last-child {
  border-width: 2px;
}
.spxnav0 li.sub {
  border: 1px solid #0b1124;
  border-width: 1px 0;
  transition: all 0.5s ease;
}
.spxnav0 li.sub.open {
  background-color: #202020;
  border-color: #fb3500;
}
.spxnav0 li.sub.open:first-child {
  border-top-color: #202020;
}
.spxnav0 li.sub.open:last-child {
  border-bottom-color: #202020;
}
/** nav0 transition control */
.spxnav0 li.sub li {
  height: 0px;
  color: rgba(255,255,255, 0);
  transition:all 0.5s ease;
}
.spxnav0 li.sub.open li {
  color: rgba(255,255,255, 1);
  height: 50px;
}
  

.spxnav1, .spxnav1 li {
  background-color: #0b1124;
  color: #ffffff;
  position: relative;
}
.spxnav1 ul {
  display: block;
  position: relative;
  padding:0;
  margin:0;
  border:0;
}

.spxnav1 > ul {
  border-bottom: 1px solid #fb3500;
}
.spxnav1 li.sub {
  border: 0;
  transition: all 0.5s ease;
}
.spxnav1 li.sub.open {
  background-color: #202020;
}

/** spxnav1 transition control */
.spxnav1 li.sub li {
  height: 0px;
  background-color: #0b1124;
  transition:all 0.5s ease;
}
.spxnav1 li.sub.open li {
  height: 50px;
  background-color: #202020;
}

/* both navis */
.xspxnav .sub .tgl {
  width: 50%;
  position: absolute;
  top: 0;
  right: 0;
  height: 50px;
}

.spxnav li {
  display: block;
  position: relative;
  text-align: left;
  width:100%;
  list-style-type: none;
  font-size: 1.125rem; /* 18px */
  border:0;
  padding:0;
}
.spxnav li.sub li {
  overflow: hidden;
}
.spxnav li.sub .ico1 {
  background: url(https://m.spox.com/pub/pic/nav-down.svg) no-repeat center center;
  background-size: cover;
  transition: 0.5s; /* rotate the icon*/
  height: 28px;
  width: 28px;
  
  display: block;
  position: absolute;
  right: 6px;
  top: 12px;
}
.spxnav.ct li.sub .ico1 {
  right:-2px;
}
.spxnav li.sub.open .ico1 {
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

/*.spxnav li.sub .ico2, .spxnav1 li .ico2 {
  display: block;
  position: absolute;
  height: 13px;
  width: 15px;
  top: 19px;
  left: 10px;
}*/
.spxnav li.sub.open .ico2, .spxnav1 li .ico2 {
  /*background: url(https://m.spox.com/pub/pic/navi0-sel.svg) no-repeat center center;
  background-size: cover; to delete*/
}

.spxnav li.sub.open .ico2, .spxnav1 li .ico2 {
  display: block;
  position: absolute;
  top: 19px;
  left: 10px;
  width: 15px;
  height: 13px;
  border-radius: 0 10px 10px 0;
  background-color: #0032af;
}
.spxnav li.sub.open .ico2::before, .spxnav1 li .ico2::before {
  content:"";
  display: block;
  position: absolute;
  width: 4px;
  height: 4px;
  top: 4px;
  left: 4px;
  transform: rotate(45deg);
  transform-origin: 50% 50%;
  border: 1px solid #fff;
  border-width: 1px 1px 0 0;
}


.spxnav li a {
  display: block;
  position: absolute;
  padding: 3px 10px 3px 18px;
  left: 10px;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  
}
.spxnav li a:active {
  background-color: rgba(255,255,255,0.1);
  border-radius: 5px;
}
.spxnav .wrp {
  height:50px;
  display: block;
  position: relative;
}

.spxnav li:not(.sub) a {
  width:85%;
}

.spxnav li.sub ul a {
  left:30px;
  width:79%;
} 

li.spxnavcom .wrp {
  height: 100px;
  display: block;
  position: relative;
}
li.spxnavcom .icon {
  position: absolute;
  display: block;
  left: 28px;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  width: 64px;
  height: 64px;
  border-radius: 32px;
  -webkit-border-radius: 32px;
  -moz-border-radius: 32px;
  background-size: 64px 64px;
  background-repeat: no-repeat;
  border: solid 1px white;
}
li.spxnavcom .icon img {
  width: 100%;
  height: 100%;
}
li.spxnavcom .text {
  position: absolute;
  display: block;
  left: 110px;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

/* Footer */
#spxmxfooter {
  margin: 20px 0 0;
  border-top: 2px solid #fb3500;
  background: #0b1124;
  color: #ffffff;
  padding: 5px;
  text-align: center;
}
#spxmxfooter p {
  margin: 10px 0 15px;
  font-size: 0.875rem; /* 14px */
}
#spxmxfooter p a {
  font-weight: bold;
}
#spxmxfooter p span {
  padding: 0 10px;
}
#spxmxfooter p img.pgl {
  width: 40%;
}


/* used on body to force a redraw after IOS history.back() */
.repainter {
  width: 100.01%;
}

/* Comments */
.cmts {
  width:100%;
  overflow: hidden;
  position: fixed;
  height: 100%;
  z-index: 1013;
  padding-top: 51px;
  box-sizing: border-box;
  transition:all 0.5s ease-in;
  top:0;
  left: 101%;
}
.openComments .cmts {
  left:0;
}
.cmts .scrollerV {
  overflow-y: scroll;
  overflow-x: hidden;
  height:100%;
  border-top:  1px solid #0b1124; /*this belongs to .cmts .hl*/
}
.cmts .scrollerV .cmtsct {
  background: #ffffff;
  border-top:1px solid #ffffff; /*Hack: this content defines the background to be white and fade out, but a top distance of 20 px is always transparent. So the setting of an additional top border stretches the background color */
  position: relative;
  min-height: 130%;
}
.cmts .hl .closer {
  background: url(/pub/pic/menu_close.svg) no-repeat center center;
  position: absolute;
  height: 50px;
  width: 43px;
  right: 0px;
  top: 0px;
}
.cmts .hl {
  position: absolute;
  font-weight: bold;  
  top:0px;
  left:0;
  width: 100%;
  height: 50px;
  text-align: center;
  background-color: #0b1124;
  border-bottom: 2px solid #fb3500;
}
.cmts .hl img {
  padding-top: 9px;
}

.spxnav .spxnaveditions {
  height: 50px;
  line-height: 46px;
  padding-left: 28px;
  font-size: 1rem;
}
.spxnav .spxnaveditions * {
  display: inline-block;
  position: initial;
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
  vertical-align: middle;
}
.spxnav .spxnaveditions .itm {
  width: 30px;
  height: 30px;
  opacity: 0.5;
}
.spxnav .spxnaveditions .itm.sel {
  opacity: 1;
}
.spxnav .spxnaveditions .sep {
  width: 1px;
  background-color: #ffffff;
  height: 10px;
}
.spxnav .spxnaveditions .de {
  background: url(https://www.spox.com/pub/pic/header16/edi-de.svg) no-repeat center center;
}
.spxnav .spxnaveditions .at {
  background: url(https://www.spox.com/pub/pic/header16/edi-at.svg) no-repeat center center;
}
.spxnav .spxnaveditions .ch {
  background: url(https://www.spox.com/pub/pic/header16/edi-ch.svg) no-repeat center center;
}




@media (orientation: portrait) {
  body.bData .spxnav,
  body.bData #spxmxheader,
  body.bData #spxmxunderheaderspace,
  body.bData .lsearch,
  body.bData #spxmxfooter,
  body.bData .cmts .hl {
    zoom: 1.6;
  }
  body.bData .cmts .scrollerV {
    margin-top: 25px;
  }  
  
} /* end of media */

@media screen and (orientation:landscape) {
  .itm .txt {
    /*font-size: 3.78vw;*/ /* 14px 90% */
    font-size: 1.3125rem;      
  }
  .itm .txt h2 {
    /*font-size: 4.32vw;*/ /* 16px 90% */
    font-size: 1.5rem;
  }
  
  .itm .cpy, .artPic .cpy {
    /*font-size: 3.24vw;*/ /* 12px 90%*/
    font-size: 1.125rem;
  }
  
  .ct .grpTop h2 {
    /*font-size: 5.94vw;*/ /* 22px 90%*/
    font-size: 2rem;
  }
}  /* end of media */
/*
Font sizes: 
font-size: 0.75rem; / 12px /
font-size: 3.6vw; / 12px /

font-size: 0.875rem; / 14px /
font-size: 4.2vw; / 14px /

font-size: 1rem; / 16px /
font-size: 4.8vw; / 16px /

font-size: 1.125rem; / 18px /
font-size: 5.4vw; / 18px /

font-size: 1.375rem; / 22px /
font-size: 6.6vw; / 22px /

font-size: 1.5rem; / 24px /
font-size: 7.2vw; / 24px /

font-size: 2.5rem; / 40px /
font-size: 7.2vw; / 24px /
*/
noscript img {
  width: 100%;
}
/* dynamic pictures */
.dpic {
  display: block;
  position: relative;
  height: 0;
}
.dpic > img {
  display: block;
  position: absolute;
  width: 100%;  
  height: 100%; 
  top: 0;
  margin: 0;
  padding: 0;
}
.dpic.pic100 {
  padding-bottom: 57.38%;
  width: 100%;
}
.dpic.pic100x618 {
  padding-bottom: 40.45%;
  width: 100%;
}

.dpic.pic60 {
  padding-bottom: 34.43%;
  width: 60%;
}

.dias .ttl,
.bSuch .itm .l2,
p.abs.rtx {  
  font-family: 'Open Sans', Arial, sans-serif;
}

.itm {
  position: relative;
}

/* the text of every pic teaser has a fadeout background */
.itm .txtbg {
  width: 100%;
  height: 33%;
  position: absolute;
  bottom: 0;
  background-image: linear-gradient(rgba(11, 17, 36, 0.01) 1%, rgba(11, 17, 36, 0.6) 40%, rgba(11, 17, 36, 1) 100%);
}
.itm .txt { 
  width: 100%;
  box-sizing: border-box;
  padding: 0 3px;
    
  position: absolute;
  bottom: 5px;
  color: #ffffff;
  font-size: 0.875em; /* 14px */
  line-height: 1.25em;
  font-weight: bold;
  text-align: center;

  white-space: initial;
  text-shadow: 0 0 6px #0b1124, 0 0 6px #0b1124, 0 0 6px #0b1124, 0 0 6px #0b1124;
}

.itm .txt h2 {
  font-size: 1rem; /* 16px */
  line-height: 1.25em;
}
.itm .txt .t0 {
  text-transform: uppercase;
  font-weight: normal;
}

.itm .cpy, .artPic .cpy {
  position: absolute;
  bottom: 5px;
  right: 5px;
  color: #ffffff;
  text-shadow: 1px 1px #333333;
  font-weight: normal;
  font-size: 0.75rem; /* 12px */
}

figure.artmed {
  margin: 0;
}
.artmed figcaption{
  font-size: 0.75em;
  padding-top: 2px;
  color: #595959;
  line-height: 1.3em;
}

/* a special empty a tag stretches to the full itm size as a teaser click */
.itm a.stretch {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top:0;
  left:0;
}

.itm .stoerer.vid, .itm .stoerer.dia {
  /*opacity: 0.85;*/  
}
.itm .stoerer {
  position: absolute;
  width: 13.67%;
  top: 5.76%;
  right: 3.33%;
}
.itm .stoerer.TdT {
  width: 19.17%;
}
.itm .stoerer.d2 {
  top: 8.81%;
}
.bChan h1, .bHome h1, .bNews h1 {
  position: absolute;
  font-size: 0.0625rem;
  text-indent: -1000px;
}
.conSlider .itm.newslnk {
  width: 17.6%;
  background-color: initial;
}
.conSlider .itm.newslnk .dpic {
  padding-bottom: 195%;
}
.conSlider .itm.newslnk a.stretch {
  background: url(/pub/pic/mehr-slider-pfeil.svg) no-repeat center center;
  background-size: cover;
}


.dpic > i { /* info for pic-resolution */
  display: block;
  position: absolute;
  top:0;
  right:0;
  background:#dddddd;
}

/** Text manipulation */
.conSlider .itm .lbl,
.conSlider .sep,
.conGrp .grpTop h2,
.bArt .grphl
{
  text-transform: uppercase;
}


/* Page Layout */
body {
  background: #ffffff;
}

/* Diashow slider */
.dias {
  position: relative;
  margin-bottom: 14px; /* should be 10 but bug in sliderhight, so compensate */
}
.dias .cth {
  position: relative;
  overflow: hidden;
}

.dias .innerh {
  position: relative;
  white-space:nowrap;
  transition: all ease 0.6s;  
}

.dias .itm {
  display:inline-block;
  position: relative;
  height: 57.38%;
  width: 100%;
  overflow: hidden;
}
.dias .itm.bg {
  background-color: #000000;
}

.dias .itm.ad {
  background-color: #ffffff;
}


.dias .txt, .dias .nr {
  display: none;
}

.dias .pnav {
  height: 35px;
  position: relative;
  margin-bottom: 30px;
  text-align: center;
  border: 1px solid #666666;
  border-width: 1px 0;  
}

.dias .pnav .ico {
  background: url(/pub/pic/nav-down-black.svg) no-repeat center center;
  background-size: cover;
  height: 28px;
  width: 28px;
  display: block;
  position: absolute;
  top: 4px;
}

.dias.first .pnav .ico.left, .dias.last .pnav .ico.right {
  background: url(/pub/pic/nav-down-grey.svg) no-repeat center center;
  background-size: cover;
}

.dias .pnav .ico.left {
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  left: 1px;  
}
.dias .pnav .ico.right {
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  right: 1px;  
}

.dias .pnav .ct {
  padding-top:6px;
  font-size: 0.875rem; /* 14px */
}

.dias .pnav .navh {
  display: block;
  width: 49%;
  height: 100%;
  position: absolute;
  top: 0;
  overflow: hidden;
}
.dias .pnav .navh.l { left: 0;}
.dias .pnav .navh.r { right: 0;}

.dias .pnav .nums {
  display: block;
  position: absolute;
  font-size: 0.875rem; /* 14px */
  padding-bottom: 2px;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.dias .pnav .nums .num {
  font-weight: bold;
}

.dias .ttl {
  margin: 0 0 15px;
  font-weight: bold;
}

.dias .inav .ico {
  background: url(/pub/pic/nav-down.svg) no-repeat center center;
  background-size: cover;
  height: 28px;
  width: 28px;
  display: block;
  position: absolute;
  top: 11px;
}

.dias.first .inav .navh.l, .dias.last .inav .navh.r {
  display: none;
}

.dias .inav .ico.left {
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  left: 1px;
}
.dias .inav .ico.right {
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  right: 1px;
}

/*center vertically*/
.dias .inav .navh {
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
}

.dias .inav .navh {
  display: block;
  width: 15%;
  height: 50px;
}
.dias .inav .navh.l { left: 0;}
.dias .inav .navh.r { right: 0;}


/* Aufmacher */
.afm {
  background-color: #000000;
  position: relative;
  margin-bottom: 10px;
  padding:10px 10px 10px 10px;
}
.afm.single {
  padding-bottom: 10px;
}

.afm .bigpics .cth {
  position: relative;
  overflow: hidden;
}

.afm .bigpics .innerh {
  position: relative;
  white-space:nowrap;
  transition: all ease 0.6s;  
}

.afm .bigpics .itm {
  display:inline-block;
  height: 57.38%;
  width: 100%;
  overflow: hidden;
}

/* Navi-Punkte des Aufmachers (allgemein, da diese vielleicht auch noch in anderen Darstellungen gebaut werden könnten)*/

.navpnts {
  background-color: #000000;
  text-align:center;
}

.navpnts .bull { /* this could be obsolete if swiper works fine */
  background-color: #bbbbbb;
  width:  5px;
  height: 5px;
  border: 1px solid #000000;
  border-radius:8px;
  display: inline-block;
  margin: 8px 6px;
}
.cth.pos0 .bull.pos0,
.cth.pos1 .bull.pos1,
.cth.pos2 .bull.pos2,
.cth.pos3 .bull.pos3,
.cth.pos4 .bull.pos4,
.cth.pos5 .bull.pos5,
.cth.pos6 .bull.pos6,
.cth.pos7 .bull.pos7 { /* this could be obsolete if swiper works fine */
  
  background-color: #ffffff;
  border-color:#ffffff;
}

.navpnts.swiper-pagination {
  position: relative;
  background-color: #000000;
  text-align: center;
}
.navpnts.swiper-pagination .swiper-pagination-bullet {
  background-color: #bbbbbb;
  width:  5px;
  height: 5px;
  border: 1px solid #000000;
  border-radius:8px;
  display: inline-block;
  margin: 8px 6px;
  opacity: 1;
}

.navpnts.swiper-pagination .swiper-pagination-bullet-active {
  background-color: #ffffff;
  border-color: #ffffff;
  opacity: 1;
}


/* Topthema */
.topthema {
  position: relative;
  margin-bottom: 10px; /* tmp */
}

.topthema .itm {
  height: 37.03%;
  width: 100%;
  overflow: hidden;
}








.ct {
  margin-left:10px;
  margin-right:10px;
}


/** Gruppe */
.conGrp {
  margin-top: 10px;
  margin-bottom: 10px;
}
.conGrp > div:last-child {
  margin-bottom:0;
  padding-bottom:0;
}
.conGrp.slilast + div { /* the next div reduces the distance if this group ends with a slider */
  margin-top: 10px; /* former 6px */
}

.ct .grpTop {
  background-color:#ffffff;
}
.ct .grpTop .sep {
  height: 0;
  border-bottom: 2px solid #5cc8ff;
  margin-bottom: 6px;
}
.ct .grpTop h2 {
  color: #0b1124;
  font-size: 1.375rem; /* 22px */
  text-align: center;
}
.ct .grpTop h2 .h2 {
  margin-left: 10px;
}
.ct .grpTop h2 a {
  padding: 0px 10px;
}




/** Standard Slider in distributor pages */
.conSlider {
  background-color: #ffffff;
  margin-bottom: 11px;
  position: relative;
}

.conSlider .sep {
  position: absolute;
  width:100%;
  padding-bottom: 3px;
  border-bottom: 1px solid #b5b5b5;
  color: #b5b5b5;
  background-color: #ffffff;
  font-size: 0.875rem; /* 14px */
  line-height: 1em;
  font-weight: bold;
}

.conSlider .itm {
  display:inline-block;
  width: 60%;
  background-color: #333333;
  margin-right:6px;
}

.conSlider .itm .lbl {
  display: block;
  position: absolute;
  color: #b5b5b5;
  background-color: #ffffff;
  bottom:100%;
  margin-bottom: 10px;
  left:0;
  font-size: 0.875rem; /* 14px */
  line-height: 1em;
  font-weight: bold;
}

.conSlider.type0 .sep, .conSlider.type1 .sep, .conSlider.type4 .sep {
  display: none;
}

.conSlider.type2 .itm {
  margin-top:24px;
}

/** Artikel-Diashow Slider in distributor pages */
.conSlider.artDiaSlider {
  border: 1px solid #b5b5b5;
  border-width: 1px 0;
  padding: 10px 0;
  margin: 10px 0;
}

.conSlider.artDiaSlider .hl {
  color: #b5b5b5;
  margin-bottom: 10px;
}

.conSlider.artDiaSlider .itm {
  width: 40%;
}

/** Result-FreeHTML */
#content > .miksfh {
  margin: 0 10px;
}
.artCmp #spxIframeContent, .artCmp .spxIframeContent {
  position: relative; 
  overflow-x: visible; 
  overflow-y: hidden;
  text-align: center;
}

.spl { position:relative; margin: 10px 0 10px 0; min-height:76px; font-size: 0.875rem; /* 14px */ }
.spl .hidden { display:none !important; }
.spl .mikshidden { display:none !important; }
.spl .databody { min-height:inherit; }
.spl .databody .main { position: relative; overflow: hidden;}
.spl .databody .scroller {position: relative; overflow-x: visible; overflow-y: hidden;}
.spl .dataelement { display: inline-block; vertical-align: top; border: 1px solid #bbbbbb; border-width:1px 0 1px 1px; padding: 8px 4px 3px; margin-top:2px; text-decoration:none !important; width:50px }
.spl .dataelement:last-child { border-right-width:1px; }
.spl .dataelement .result { color:#525252; font-weight:bold;  }
.spl .dataelement.hasMatch:HOVER, 
.spl .dataelement.active { background-color: #cccccc; cursor:pointer; text-decoration:none !important; }
.spl .dataelement.hasMatch A:HOVER { text-decoration:none !important; }
.spl .details_center_tbl {margin-top: 10px;}
.spl .details_center .homeTeam A:HOVER,
.spl .details_center .guestTeam A:HOVER,
.spl .details_center .highlightMatchIndex:HOVER,
.spl .highlightMatchIndex .highlight .details:HOVER { text-decoration:none !important; color:#A60914 !important; }
.spl .highlightMatchIndex { margin-top: 5px; display: block; }
.spl .details_center .resultAddition { font-size: 0.875rem; /* 14px */ line-height:6px; margin-bottom:10px; }
.spl .dataelement .team.klein IMG { width:18px; height:18px;}
.spl .dataelement.noMatch{ opacity: 0.3;}
.spl .team.gross {height:75px;}
.spl .team.gross IMG { width:75px; height:75px; }
.spl .highlight .details  { color:#525252; font-size:1rem; /*16px*/ font-weight:bold; }
.spl .highlight .details .teamname  { margin: 5px 5px 0 5px; }
.spl .highlight .details .result { font-size: 2.5rem; /* 40px */ }
.spl HR { display: none; }
.spl .loader { position: absolute; top: 0;left: 0;width: 100%;height: 100%;z-index: 100;font-weight: bold;}
.spl .loader .inner{position: relative;width: 120px;height: 40px;text-align: center;margin-left: -60px;margin-top: -20px;top: 50%;left: 50%;}
.spl .toTable { color:#fb3500 !important; text-align:right; font-size: 0.875rem; /* 14px */; line-height:20px; font-weight:bold; }
.spl .hlcon {position:relative;min-height:20px;}
.spl .hlcon .headline {margin-left:5px;font-weight:bold;position:relative;text-align:center}
.spl .dataelements {text-align: center; white-space:nowrap;}
.spl .dataelement .additional {font-size: 0.875rem; /* 14px */ line-height: 0.6rem;}
.spl .dataelement td.dist {width: 3px;}
.spl .details-htresult { font-size: 0.875rem; /* 14px */ }
.spl .details-htresult .htresult { white-space:nowrap; }
.spl table {width: 100%;}
.spl .highlight .c1 {text-align: center; width: 40%;}
.spl .highlight .c2 {text-align: center;}
.spl .highlight .c3 {text-align: center; width: 40%;}
.miksfh .spl .databody {
  background: none;
}

/* Article */
.bArt .artPic .dpic.bg {
  height:0;
  padding:0;
}
.bArt .artPic {
  position: relative;
}
.bArt .artText h2 {
  font-size: 1.125rem;
  line-height: 1.25em;
  margin: 20px 0;  
}
.bArt .abs {
  font-weight: bold;
}
.bArt p, .rtx .artCmp {
  margin: 12px 0 15px 0;
}

.detailsHead {
  position: relative;
}
.detailsHead .catlnk {
  display: block;
  margin: 5px 0 -7px 0;
  font-size: .75rem;
  color: #595959;
}
.detailsHead h1 {
  font-size: 1.5rem; /* 24px */
  margin: 5px 0;  
  line-height: 1.25em;
  color: #0b1124;
}
.detailsHead .socgrp {
  position: relative;
  min-height: 38px;
  margin-bottom: 15px;
  color: #595959;
}
.detailsHead .socgrp .aut {
  min-height: 22px;
}
.detailsHead .socgrp .aut p {
  font-weight: normal;
  padding: 0;
  margin: 0;
}

.detailsHead .socgrp .date {
  font-size: 0.75rem; /* 12px */
}

/** Related Links Article **/
.rtx ul.lnkrel {
  font-weight: bold;
}
.rtx ul.lnkrel span {
  display: block;
  margin-bottom: 8px;
}
.rtx ul.lnkrel li {
  padding: 3px 0 3px 30px;
  margin: 0;
  background: none;
  position: relative;
  line-height: 1.25em;
}
.rtx ul.lnkrel li a {
  color: #0b1124;
}
.rtx ul.lnkrel li a::before {
  content:"";
  position: absolute;
  top: 10px;
  width: 8px;
  height: 8px;
  border-radius:4px;
  background-color: #0032af;
  left: 0px;
}
.rtx ul.lnkrel li.spons a::before {
  top:5px;
  left: -5px;
  width: 18px;
  height: 18px;
  border-radius:0;
  background: url("/pub/pic/icon-star.svg") no-repeat center center;
}


/** Mehr zum Thema-Slider with group headline */
.bArt .grphl, .bDia .conGrp .grpTop h2 {
  color: #888888;
  padding: 15px 0 8px 0;
  border-top: 1px solid #666666;
  font-weight: bold;
  text-align: left;
  font-size: 1rem;
}
.bArt .mzt .sep, .bArt .mztupper .sep, .bDia .conGrp .grpTop .sep {
  display: none;
}

.bArt .mztupper {
  margin: 10px 0 15px 0;
}

.bArt .taboolapos {
  margin-top: 15px;
  padding-top: 15px;
  xborder-top: 1px solid #666666;
}  
  

/* article page navi */
.bArt .artPnav {
  height: 35px;
  position: relative;
  margin-bottom: 30px;
  text-align: center;
  border: 1px solid #666666;
  border-width: 1px 0;  
}

.bArt .artPnav .ico {
  background: url(/pub/pic/nav-down-grey.svg) no-repeat center center;
  background-size: cover;
  height: 28px;
  width: 28px;
  display: block;
  position: absolute;
  top: 4px;
}
.bArt .artPnav .ico.act {
  background: url(/pub/pic/nav-down-black.svg) no-repeat center center;
  background-size: cover;
}  

.bArt .artPnav .ico.left {
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  left: 1px;  
}
.bArt .artPnav .ico.right {
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  right: 1px;  
}


.bArt .artPnav .ct {
  padding-top:6px;
  font-size: 0.875rem; /* 14px */
}

.bArt .artPnav a.lnk span {
  visibility: hidden; 
}

.bArt .artPnav a.lnk {
  display: block;
  width: 49%;
  height: 100%;
  position: absolute;
  top: 0;
  overflow: hidden;
}
.bArt .artPnav a.lnk.left { left: 0;}
.bArt .artPnav a.lnk.right { right: 0;}

.bArt .artPgrp {
  margin: 10px 0;
}
.bArt .artPgrp .scroller {
  position: relative;
  white-space:nowrap;
  overflow-x: visible;
  overflow-y: hidden;
  text-align: center;
}

.bArt .artPgrp .itm {
  display: inline-block;
  box-sizing: border-box;
  margin: 0 5px 0 0;
  width: 130px;
  height: 35px;
  padding-top: 6px;
  background: #cccccc;
  color: #595959;
  text-align: center;
}
.bArt .artPgrp span.itm {
  opacity: 0.6;
}
.bArt .artPgrp .itm.itmSel {
  background: #fb3500;
  color: #ffffff;
}

/* Dayticker is like multipe articles */
.tihead {
  margin-top: 28px; 
  position: relative;
  font-weight: bold;
}
.tihead .titime {
  position: absolute;
  top: 0;
  left: 0;
  color: #0032af;
}
.tihead .tiTitle {
  margin-left: 50px;
  padding-left: 10px;
  border-left: 1px solid #666666;
}
.bArt.bDti p {
  margin: 12px 0 12px 0;
}
.tihead .anc {
  top: -60px;
  position: absolute;
}  

/* Search */
.bSuch .itm {
  border-bottom: 1px solid #b5b5b5;
  overflow: hidden;
}

.bSuch .itm .pic {
  width: 40%;
  position: relative;
  float: left;
  margin-bottom: 10px;
}
.bSuch .vd {
  margin: 10px;
}
.bSuch .itm .tx {
  margin-left: 43%;
  margin-bottom: 10px;
}

.bSuch .itm .l1 {
  font-size: 0.625rem;
  line-height: 1.25em;
}
.bSuch .itm .l2 {
  font-size: 0.875rem;
  padding: 3px 10px 0 0;
}

.bSuch .date {
  display: block;
  background-color: #cecece;
  text-transform: uppercase;
  padding:5px;
  margin: 10px;
  text-align: center;  
}
div.ct.vd + div.date {
  margin-top:20px;
}

.bSuch .nextpg {
  display: block;
  position: relative;
  margin: 20px 10px 10px 10px;
  padding: 5px 30px 5px 5px;
  text-align: right;
  color: #b5b5b5;
  font-size: 0.875rem;
  border-bottom: 1px solid #b5b5b5;
}
.bSuch .nextpg .ico {
  background: url(/pub/pic/nav-down-grey.svg) no-repeat center center;
  background-size: cover;
  height: 20px;
  width: 20px;
  display: block;
  position: absolute;
  right: 6px;
  bottom: 3px;
}

.bSuch .nothing {
  text-align: center;
  margin: 20px 0;
}
.bSuch .srchInfo {
  padding: 15px 0;
  text-align: center;
  border-bottom: 1px solid #b5b5b5;
  background-color: #ffffff;
  color: #b5b5b5;
}

.conGrp.slilast + div { /* the next div reduces the distance if this group ends with a slider */
  margin-top: 6px;
}

.nodt .grpTop .sep {
  margin-bottom: 0;
}
.nodt { /* nodt = no distance*/
  margin-bottom: 0;
}

.spxnav2 li.sub .ico1 {
  background: url(/pub/pic/nav-down-grey.svg) no-repeat center center;
  background-size: cover;
}


.spxnav2 {
  background-color: #ffffff;
  color: #b5b5b5;
}
.spxnav2 li {
  font-weight: bold;
  text-transform: uppercase;
}
.spxnav2 li a {
  left: 0;  
}
.spxnav2 ul {
  display: block;
  position: relative;
  padding:0;
  margin:0;
  border:0;
}

.spxnav2 li.sub {
  border: 1px solid #b5b5b5;
  border-width: 0 0 1px 0;
  transition: all 0.5s ease;  
}

.spxnav2.datalive li.sub {
  border-width: 0 0 1px 0;
}


/** nav2 transition control */
.spxnav2 li.sub li {
  height: 0px;
  transition:all 0.5s ease;
}
.spxnav2 li.sub.open li {
  height: 50px;
}

/* for the ad */
.strad {
  text-align: center;
}
.strad.tb1 > div {
  margin-top: 10px;
}

/** Social in article, rudb */
.social .socFacebook { background: url(/pub/pic/icons/soc-facebook.svg) no-repeat; }
.social .socTwitter  { background: url(/pub/pic/icons/soc-twitter.svg) no-repeat; }
/*.social .socGoogle   { background: url(/pub/pic/soc/soc-google.svg) no-repeat; }*/
.social .socComments { background: url(/pub/pic/icons/soc-comments.svg) no-repeat; }
.social .socWhatsapp { background: url(/pub/pic/icons/soc-whatsapp.svg) no-repeat; }

.social .socComments { 
  position: relative;
}
.social .socComments .cmtcnt { 
  position: absolute;
  bottom: 5px;
  right: 0;
  width: 100%;
  font-size: 0.6rem;
  text-align: center;
  color: #0b1124;
  font-family: 'Open Sans', Arial, sans-serif;
}
.social.bottom .socComments .cmtcnt {
  bottom: 11px;
  font-size: 0.675rem;  
}

/*center vertically*/
.social.top {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  width: 150px;
}

.social.top .soc {
  background-size: cover;
  display: block;
  float: right;
  width: 38px;
  height: 38px;
  margin: 0 0 0 10px;
}

.social.bottom {
  position: relative;
  text-align:center;
  height:55px;
  margin:30px 0;
}
.social.bottom .soc {
  display: inline-block;
  margin:0 2.5%;
  width: 55px;
  height: 55px;
  background-size: cover;
}

/* additional style to force viewport settings
this maybe forces IOS on history.back() to reset the zoom level 
especially when switching from data page back to article */
@-ms-viewport{
  width: device-width;
}
/* new videos page */
.itm > a.lnkovall {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.itm .med .dur {
  position: absolute;
  bottom: 0;
  right: 0;
  color: #ffffff;
  background-color: #000000;
  font-size: 11px;
  padding: 0 3px;
}
.bVid.hm .ct .pvid {
  margin-top: 10px;
}
.bVid .chanVids.hid {
  opacity: 0;  
  height:0;
  overflow: hidden;
}
.bVid .chanVids {
  opacity: 1;  
  transition: opacity linear 0.5s;
}
.bVid .chanVids .itm {
  margin: 10px 0;
  position: relative;
  border: 1px solid #000;
  padding: 7px;
}
.bVid .chanVids .itm .med {
  height: 0;
  padding-bottom: 56.13%;
  position: relative;
}
.bVid .chanVids .itm .med .pic {
  position: absolute;
  width: 100%;
  height: 100%;
}
.bVid .chanVids .itm .tx {
  text-align: center;
  padding: 20px 0 10px 0;
}
.bVid .navndrop {
  position: relative;
  overflow: hidden;
  margin-top: 10px;
}
.bVid .navndrop .navs {
  white-space:nowrap;  
  overflow-x: visible;
  overflow-y: hidden;
}
.bVid .navndrop .navs .el {
  display: inline-block;
  overflow: hidden;
  width: 120px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  color: #000000;
  background-color: #d2d2d2;
  margin-right: 10px;
  cursor: pointer;
  transition: background-color linear .2s, color linear .2s;
}
.bVid .navndrop .navs .el:last-child {
  margin-right: 0;
}
.bVid .navndrop .navs .el.sel {
  color: #ffffff;
  background-color: #fb3500;
}

.spxcib {
  position: fixed;
  bottom:0;
  width: 100%;
  background: #fb3500;
  color: #fff;
  z-index: 100000;
  max-height: 0;
  transition: max-height .7s ease-out;  
}
.spxcib.open {
  max-height: 65%;
}
.spxcib .tx {
  padding: 10px;
  font-weight: bold;
}
.spxcib .tx a {
  text-decoration: underline;
}
.spxcib .bt {
  display: inline-block;
  margin: 5px 10px 10px 10px;
  background: #0032af;
  color: #fff;
  padding: 3px 10px;
  cursor: pointer;
  font-weight: bold;  
}
/* Reiter 18 / Homepage News */
.conHmNews .pgs .pg .items {
  position: relative;
}
.rtr18 .pgs {
  position: relative;
}
.rtr18 .pgs .pg {
  position: absolute;
  display: none;
  width: 100%;
  top: 0;
  left: 0;
}
.rtr18 .pgs .pg.sel {
  display: block;
  position: relative;
}

.conHmNews .pgs .items .itm {
  margin: 10px 0;
  padding-left: 50px;
  text-indent: -25px;
}
.conHmNews .pgs .items .itm .time {
  display: inline-block;
  width: 25px;
  font-weight: bold;
  color: #0032af;
}
.rtr18 .pgNav  {
  margin: 0 0 10px 0;
  overflow: hidden;
  position: relative;
}
.rtr18 .pgNav .scroller {
  position: relative;
  white-space:nowrap;
  overflow-x: visible;
  overflow-y: hidden;
}
.rtr18 .pgNav::after {
    content: "";
    position: absolute;
    top: 0;
    right: -1px;
    width: 30px;
    height: 100%;
    background: linear-gradient(to left, rgba(255, 255, 255,1), rgba(255, 255, 255, 0));
    z-index: 2;
}

.rtr18 .pgNav .rtr.sel {
  color: #fb3500;
  border-bottom: 2px solid #fb3500;
  font-weight: bold; 
}
.rtr18 .pgNav .rtr {
  /*text-transform: uppercase;*/
  line-height:2em;
  padding: 0 5px;
  color: #818181;
}
.rtr18 .pgNav .rtr:last-child {
  padding-right: 20px;
}
.conHmNews .links {
  height: 20px;
  text-align: right;
}

/* new homepage 2018*/
.bHome18 .flx.ord {
  display: flex;
  flex-direction: column;
}
.bHome18 .flx.ord .cnB { order: 2; }
.bHome18 .flx.ord .cnT { order: 1; }
.bHome18 .rtx .artCmp .medlnk img {max-width: 100%;}
.bHome18 .grpTop h1, .bHome18 .grpTop h2 {
  position: relative;
  font-size: 1.375rem; /* 22px */
  text-indent: 0;
  color: #000000;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 2px;
}
.bHome18 .txbt h1 {
  position: relative;
  font-size: 1.375rem; /* 22px */
  text-indent: 0;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 2px;
  color:#fff;
  background-color: #0b1124;
  padding: 0 10px;
}

/*viral videos*/
.bHome18 .viravid2a {
  border: 5px solid #0b1124;
  background: #0b1124;
  color: #fff;
}
.bHome18 .viravid2a .dpic {
  padding-bottom: 65.52% !important; 
}
.bHome18 .viravid2a .tx1 {
  height: 45px;
  border-top: 12px solid transparent;
  display: flex;
  align-items: center;
  font-size: 1.125rem;
  font-weight: bold;
  line-height: 1.2em;
  text-transform: uppercase;
  padding: 0 15px;
  position: relative;
}
.bHome18 .viravid2a .tx2 {
  height: 65px;
  display: flex;
  align-items: center;
  line-height: 1.4em;
  padding: 0 15px;
}
.bHome18 .viravid2a .tx3 {
  border-top: 1px solid #3a3f4f;
  height: 35px;
  line-height: 35px;
  padding: 0 5px;
  font-size: 0.75rem;
  text-transform: uppercase;
  text-align: right;
  position: relative;
}
.bHome18 .viravid2a .tx3::before {
  content:"";
  display: block;
  width: 25px;
  border-top: 2px solid #fb3500;
  position: absolute;
  right: 5px;
  bottom: 5px;
}
.bHome18 .viravid2a .tx1::before {
  content:"";
  display: block;
  width: 31px;
  height: 29px;
  background: #fb3500 url(/pub/pic/icon-play.png) no-repeat center center;
  background-size: contain;
  border: 7px solid #fb3500;  
  position: absolute;
  top: -46px;
  right: 0;
}
 

.bHome18 .daytickerCon {
  border: 1px solid #979797;
  position: relative;
}
.bHome18 .daytickerCon .itms {
  height: 78px;
  border: 1px solid #0b1124;
  border-width: 0 0 0 89px;
}
.bHome18 .daytickerCon .stoerer.TdT.d1 {
  position: absolute;
  top:8px;
  left:10px;
  width: 69px;
  height: 58px;
  z-index: 1;
}  
.bHome18 .daytickerCon a.lnklgo {
  position: absolute;
  top:0;
  left:0;
  width: 89px;
  height: 78px;
  z-index: 2;
}
.bHome18 .daytickerCon .itm {
  display: block;
  position: relative;
  width: 201px;
  height: 78px;
}
.bHome18 .daytickerCon .itm .text {
  position: absolute;
  top:7px;
  left: 10px;
  width: calc(100% - 15px);
  line-height: 1.25em;
  font-weight: bold;
}
.bHome18 .daytickerCon .itm .date {
  display: block;
  position: absolute;
  bottom: 5px;
  left: 10px;
  color: #0032af;
}
.bHome18 .daytickerCon .itm .sep {
  position: absolute;
  right:0;
  top: 10px;
  width: 1px;
  height: calc(100% - 20px);
  background-color: #b5b5b5;
}
.bHome18 .tdtbd .topic {
  padding-left: 24px;
  /*background: #ffffff url(https://m.spox.com/pub/pic/navi0-sel.svg) no-repeat 0 5px; to delete*/
  margin: 10px 0 10px 0;
  position: relative;
}
.bHome18 .tdtbd .topic .topicTitle {
  line-height: 1.25em;
}
i.arrbull {
  display: block;
  position: absolute;
  top: 5px;
  left: 2px;
  width: 12px;
  height: 11px;
  border-radius: 0 10px 10px 0;
  background-color: #0032af;
}
i.arrbull::before {
  content:"";
  display: block;
  position: absolute;
  width: 4px;
  height: 4px;
  top: 3px;
  left: 2px;
  transform: rotate(45deg);
  transform-origin: 50% 50%;
  border: 1px solid #fff;
  border-width: 1px 1px 0 0;
}

/* GSM data snippet */
.gsmdata18 a.stretch {
  position: absolute;
  width: 100%;
  height: 100%;
  top:0;
  left:0;
}
.gsmdata18 {
  font-family: 'Saira', Arial ,sans-serif;
  font-size: 0.875rem;
  font-weight: normal;
}
.gsmdata18 .row {
  border-top: 1px solid #b5b5b5;
  margin: 10px 0;
  position: relative;
  line-height: 0;
}
.gsmdata18 .row:last-child {
  border-bottom: 1px solid #b5b5b5;
}
.gsmdata18 .q.unvis {
  display:none;
}
.gsmdata18 .q {
  margin: 10px 0;
  position: relative;
  text-align: center;
}
.gsmdata18 .q .lgo {
  position: absolute;
  width: 20px;
  height: 20px;
  top: 0;
  left: calc(50% - 120px - 35px);
}
.gsmdata18 .q .lgo.leovegas {
  background: url(/pub/pic/icons/icon-leovegas.png) no-repeat center center;
}
.gsmdata18 .q .lgo.tipico {
  background: url(/pub/pic/icons/icon-tipico-r.png) no-repeat center center;
}
.gsmdata18 .q .lgo.bwin {
  background: url(/pub/pic/icons/icon-bwin.jpg) no-repeat center center;
  width: 14px;
  height: 19px;
}
.gsmdata18 .q .lgo.betathomede, .gsmdata18 .q .lgo.betathomeat {
  background: url(/pub/pic/icons/icon-betathome-at.gif) no-repeat center center;
}

.gsmdata18 .q .v {
  display: inline-block;
  height:18px;
  line-height: 18px;
  text-align: center;
  border: 1px solid #b5b5b5;
  width: calc((100% - 15px - 20px - 6px) / 3);
  max-width: 80px;
  font-weight: bold;
}
.gsmdata18 .q .v.selected, .gsmdata18 .q .v.selected .bl {
  color: #c8102e;
  border-color: #c8102e;
}
.gsmdata18 .q .v.selected {
  background-color: #f4f4f4;
}


.gsmdata18 .q .v.x {
  margin: 0 5px;
}
.gsmdata18 .q .v .bl {
  font-weight: normal;
  color: #818181;
}
.gsmdata18 .q .v .bv {
  width: 26px;
  display: inline-block;
  text-align: right;  
}
.gsmdata18 .teams {
  margin: 10px 0;
  width: 100%;
}
.gsmdata18 .teams a {
  white-space: nowrap;
  overflow: hidden;
}
.gsmdata18 .teams .result {
  display: inline-block;
  position: relative;
  height:18px;
  line-height: 18px;
  text-align: center;
  border: 1px solid #b5b5b5;
  margin: 0 10px;
  width: 40px; 
  font-weight: bold;
}
.gsmdata18 .teams .teamName {
  display: inline-block;
  height: 20px;
  line-height: 20px;
  width: calc(50% - 11px - 20px);
  font-size: 1rem;
}
.gsmdata18 .row.dt .teams .result {
  font-weight: normal;
}
.gsmdata18 .row.ex .teams .result {
  width: 80px;
}
.gsmdata18 .row.ex .teams .teamName {
  width: calc(50% - 11px - 40px);
}
.gsmdata18 .row .teams .result .ot {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  font-weight: normal;
}

.gsmdata18 .teams .teamA {
  text-align: right;
}
.gsmdata18 .played .result {
  color: #fff;
  background: #000;
  border-color: #000;
}
.gsmdata18 .playing .result {
  color: #fff;
  background: #fb3500;
  border-color: #fb3500;
}
.dazn {
  margin: 10px 0;
}

/*spox-at disqus - free html*/
#disqus_thread {margin: 0 10px;}



/* temporary dev definitions */
#resinfo {
  position: fixed;
  right:0;
  bottom:0px;
  z-index:1;
  background-color:#ffffff;
}

.itwcmslk {
  display: none;
}
#sas_23362 {
  margin-top:15px;
}
.adsur {
  transition: min-height ease 0.2s;  
}
.adsur.abs {
  position: relative;
}
.adsur.abs > div {
  position: absolute;
  width: 100%;
}
#surtopmobile #sev1mtopmobile.topmobsticky {
  position: fixed;
  top:0;
  left:0;
  width:100%;
  z-index:100000;
  background:#fff;
}
/* Styles of spx.DropMenu */
.spxdrp {
  position: relative;
}
.spxdrp .drpclk {
  position: relative;
  padding: 5px 10px; 
  cursor: pointer;
}

.spxdrp .drpclk .arr {
  display: block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 4px 3px 0 3px;
  border-color: #000 transparent transparent transparent;
  position: absolute;
  top: 15px;
  right: 10px;
  transform: rotate(360deg);
}

/* POSITION FIXED MENU CLOSE LAYER */

.spxdrp .close {
  display: none;
}
.spxdrp.open .close {
  position: fixed;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
  z-index: 999998;
}

/* MENU CONTENT */

.spxdrp .drop {
  transform-origin: 30% 0%;
  transform: scale(.8,0);
  transition: transform linear .05s;
}
.spxdrp.open .drop {
  transition: transform linear .2s;
  transform: scale(1,1);
}
.spxdrp .drop {
  /* override max-height */
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  color: #000;
  min-width: 100%;
  z-index: 999999;
  border-radius: 5px;
  box-shadow: 1px 1px 10px #888;
  overflow-y: auto;
}
.spxdrp .dropct {
  position: relative;
}
.spxdrp .drop .mnu {
  /* override line-height and font settings */
  line-height: 34px;  
  border-bottom: 1px solid #ddd;
  padding: 0 20px;
}
.spxdrp .drop .mnu.active {
  cursor: pointer;
}
.spxdrp .drop .mnu:last-child {
  border-width: 0;
}
.spxdrp .drop .mnu.active:hover {
  background-color: #8b909F;
  color: #fff;
}
.spxdrp .drop .mnu.sel {
  font-weight: bold;
}
/**
 * Swiper 4.3.3
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * http://www.idangero.us/swiper/
 *
 * Copyright 2014-2018 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: June 5, 2018
 */
.swiper-container {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  /* Fix of Webkit flickering */
  z-index: 1;
}
.swiper-container-no-flexbox .swiper-slide {
  float: left;
}
.swiper-container-vertical > .swiper-wrapper {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}
.swiper-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  z-index: 1;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  -o-transition-property: transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
.swiper-container-android .swiper-slide,
.swiper-wrapper {
  -webkit-transform: translate3d(0px, 0, 0);
  transform: translate3d(0px, 0, 0);
}
.swiper-container-multirow > .swiper-wrapper {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.swiper-container-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  margin: 0 auto;
}
.swiper-slide {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  position: relative;
  -webkit-transition-property: -webkit-transform;
  transition-property: -webkit-transform;
  -o-transition-property: transform;
  transition-property: transform;
  transition-property: transform, -webkit-transform;
}
.swiper-invisible-blank-slide {
  visibility: hidden;
}
/* Auto Height */
.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
  height: auto;
}
.swiper-container-autoheight .swiper-wrapper {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-transition-property: height, -webkit-transform;
  transition-property: height, -webkit-transform;
  -o-transition-property: transform, height;
  transition-property: transform, height;
  transition-property: transform, height, -webkit-transform;
}
/* 3D Effects */
.swiper-container-3d {
  -webkit-perspective: 1200px;
  perspective: 1200px;
}
.swiper-container-3d .swiper-wrapper,
.swiper-container-3d .swiper-slide,
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom,
.swiper-container-3d .swiper-cube-shadow {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
.swiper-container-3d .swiper-slide-shadow-left,
.swiper-container-3d .swiper-slide-shadow-right,
.swiper-container-3d .swiper-slide-shadow-top,
.swiper-container-3d .swiper-slide-shadow-bottom {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 10;
}
.swiper-container-3d .swiper-slide-shadow-left {
  background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-right {
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-top {
  background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-container-3d .swiper-slide-shadow-bottom {
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0)));
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
/* IE10 Windows Phone 8 Fixes */
.swiper-container-wp8-horizontal,
.swiper-container-wp8-horizontal > .swiper-wrapper {
  -ms-touch-action: pan-y;
  touch-action: pan-y;
}
.swiper-container-wp8-vertical,
.swiper-container-wp8-vertical > .swiper-wrapper {
  -ms-touch-action: pan-x;
  touch-action: pan-x;
}
.swiper-button-prev,
.swiper-button-next {
  position: absolute;
  top: 50%;
  width: 27px;
  height: 44px;
  margin-top: -22px;
  z-index: 10;
  cursor: pointer;
  background-size: 27px 44px;
  background-position: center;
  background-repeat: no-repeat;
}
.swiper-button-prev.swiper-button-disabled,
.swiper-button-next.swiper-button-disabled {
  opacity: 0.35;
  cursor: auto;
  pointer-events: none;
}
.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  left: 10px;
  right: auto;
}
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");
  right: 10px;
  left: auto;
}
.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-lock {
  display: none;
}
.swiper-pagination {
  position: absolute;
  text-align: center;
  -webkit-transition: 300ms opacity;
  -o-transition: 300ms opacity;
  transition: 300ms opacity;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
  opacity: 0;
}
/* Common Styles */
.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 10px;
  left: 0;
  width: 100%;
}
/* Bullets */
.swiper-pagination-bullets-dynamic {
  overflow: hidden;
  font-size: 0;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
  position: relative;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
  -webkit-transform: scale(0.66);
  -ms-transform: scale(0.66);
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
  -webkit-transform: scale(0.66);
  -ms-transform: scale(0.66);
  transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
  -webkit-transform: scale(0.33);
  -ms-transform: scale(0.33);
  transform: scale(0.33);
}
.swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  display: inline-block;
  border-radius: 100%;
  background: #000;
  opacity: 0.2;
}
button.swiper-pagination-bullet {
  border: none;
  margin: 0;
  padding: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-pagination-bullet-active {
  opacity: 1;
  background: #007aff;
}
.swiper-container-vertical > .swiper-pagination-bullets {
  right: 10px;
  top: 50%;
  -webkit-transform: translate3d(0px, -50%, 0);
  transform: translate3d(0px, -50%, 0);
}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 6px 0;
  display: block;
}
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 8px;
}
.swiper-container-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  display: inline-block;
  -webkit-transition: 200ms top, 200ms -webkit-transform;
  transition: 200ms top, 200ms -webkit-transform;
  -o-transition: 200ms transform, 200ms top;
  transition: 200ms transform, 200ms top;
  transition: 200ms transform, 200ms top, 200ms -webkit-transform;
}
.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 0 4px;
}
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  white-space: nowrap;
}
.swiper-container-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transition: 200ms left, 200ms -webkit-transform;
  transition: 200ms left, 200ms -webkit-transform;
  -o-transition: 200ms transform, 200ms left;
  transition: 200ms transform, 200ms left;
  transition: 200ms transform, 200ms left, 200ms -webkit-transform;
}
.swiper-container-horizontal.swiper-container-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
  -webkit-transition: 200ms right, 200ms -webkit-transform;
  transition: 200ms right, 200ms -webkit-transform;
  -o-transition: 200ms transform, 200ms right;
  transition: 200ms transform, 200ms right;
  transition: 200ms transform, 200ms right, 200ms -webkit-transform;
}
/* Progress */
.swiper-pagination-progressbar {
  background: rgba(0, 0, 0, 0.25);
  position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: #007aff;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  -webkit-transform-origin: left top;
  -ms-transform-origin: left top;
  transform-origin: left top;
}
.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  -webkit-transform-origin: right top;
  -ms-transform-origin: right top;
  transform-origin: right top;
}
.swiper-container-horizontal > .swiper-pagination-progressbar,
.swiper-container-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 100%;
  height: 4px;
  left: 0;
  top: 0;
}
.swiper-container-vertical > .swiper-pagination-progressbar,
.swiper-container-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  width: 4px;
  height: 100%;
  left: 0;
  top: 0;
}
.swiper-pagination-white .swiper-pagination-bullet-active {
  background: #ffffff;
}
.swiper-pagination-progressbar.swiper-pagination-white {
  background: rgba(255, 255, 255, 0.25);
}
.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill {
  background: #ffffff;
}
.swiper-pagination-black .swiper-pagination-bullet-active {
  background: #000000;
}
.swiper-pagination-progressbar.swiper-pagination-black {
  background: rgba(0, 0, 0, 0.25);
}
.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill {
  background: #000000;
}
.swiper-pagination-lock {
  display: none;
}
/* Scrollbar */
.swiper-scrollbar {
  border-radius: 10px;
  position: relative;
  -ms-touch-action: none;
  background: rgba(0, 0, 0, 0.1);
}
.swiper-container-horizontal > .swiper-scrollbar {
  position: absolute;
  left: 1%;
  bottom: 3px;
  z-index: 50;
  height: 5px;
  width: 98%;
}
.swiper-container-vertical > .swiper-scrollbar {
  position: absolute;
  right: 3px;
  top: 1%;
  z-index: 50;
  width: 5px;
  height: 98%;
}
.swiper-scrollbar-drag {
  height: 100%;
  width: 100%;
  position: relative;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 10px;
  left: 0;
  top: 0;
}
.swiper-scrollbar-cursor-drag {
  cursor: move;
}
.swiper-scrollbar-lock {
  display: none;
}
.swiper-zoom-container {
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
}
.swiper-zoom-container > img,
.swiper-zoom-container > svg,
.swiper-zoom-container > canvas {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
}
.swiper-slide-zoomed {
  cursor: move;
}
/* Preloader */
.swiper-lazy-preloader {
  width: 42px;
  height: 42px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -21px;
  margin-top: -21px;
  z-index: 10;
  -webkit-transform-origin: 50%;
  -ms-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-animation: swiper-preloader-spin 1s steps(12, end) infinite;
  animation: swiper-preloader-spin 1s steps(12, end) infinite;
}
.swiper-lazy-preloader:after {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
  background-position: 50%;
  background-size: 100%;
  background-repeat: no-repeat;
}
.swiper-lazy-preloader-white:after {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}
@-webkit-keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes swiper-preloader-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
/* a11y */
.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}
.swiper-container-fade.swiper-container-free-mode .swiper-slide {
  -webkit-transition-timing-function: ease-out;
  -o-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.swiper-container-fade .swiper-slide {
  pointer-events: none;
  -webkit-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}
.swiper-container-fade .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-fade .swiper-slide-active,
.swiper-container-fade .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-cube {
  overflow: visible;
}
.swiper-container-cube .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
  visibility: hidden;
  -webkit-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  width: 100%;
  height: 100%;
}
.swiper-container-cube .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-cube.swiper-container-rtl .swiper-slide {
  -webkit-transform-origin: 100% 0;
  -ms-transform-origin: 100% 0;
  transform-origin: 100% 0;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-cube .swiper-slide-active,
.swiper-container-cube .swiper-slide-next,
.swiper-container-cube .swiper-slide-prev,
.swiper-container-cube .swiper-slide-next + .swiper-slide {
  pointer-events: auto;
  visibility: visible;
}
.swiper-container-cube .swiper-slide-shadow-top,
.swiper-container-cube .swiper-slide-shadow-bottom,
.swiper-container-cube .swiper-slide-shadow-left,
.swiper-container-cube .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.swiper-container-cube .swiper-cube-shadow {
  position: absolute;
  left: 0;
  bottom: 0px;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
  -webkit-filter: blur(50px);
  filter: blur(50px);
  z-index: 0;
}
.swiper-container-flip {
  overflow: visible;
}
.swiper-container-flip .swiper-slide {
  pointer-events: none;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  z-index: 1;
}
.swiper-container-flip .swiper-slide .swiper-slide {
  pointer-events: none;
}
.swiper-container-flip .swiper-slide-active,
.swiper-container-flip .swiper-slide-active .swiper-slide-active {
  pointer-events: auto;
}
.swiper-container-flip .swiper-slide-shadow-top,
.swiper-container-flip .swiper-slide-shadow-bottom,
.swiper-container-flip .swiper-slide-shadow-left,
.swiper-container-flip .swiper-slide-shadow-right {
  z-index: 0;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
.swiper-container-coverflow .swiper-wrapper {
  /* Windows 8 IE 10 fix */
  -ms-perspective: 1200px;
}