@font-face { font-family: 'Martel'; font-style: normal; font-weight: 400; src: url('../fonts/martel-v2-latin-regular.eot'); src: local('Martel'), local('Martel-Regular'), url('../fonts/martel-v2-latin-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/martel-v2-latin-regular.woff2') format('woff2'), url('../fonts/martel-v2-latin-regular.woff') format('woff'), url('../fonts/martel-v2-latin-regular.ttf') format('truetype'), url('../fonts/martel-v2-latin-regular.svg#Martel') format('svg'); } @font-face { font-family: 'Martel'; font-style: normal; font-weight: 700; src: url('../fonts/martel-v2-latin-700.eot'); src: local('Martel Bold'), local('Martel-Bold'), url('../fonts/martel-v2-latin-700.eot?#iefix') format('embedded-opentype'), url('../fonts/martel-v2-latin-700.woff2') format('woff2'), url('../fonts/martel-v2-latin-700.woff') format('woff'), url('../fonts/martel-v2-latin-700.ttf') format('truetype'), url('../fonts/martel-v2-latin-700.svg#Martel') format('svg'); } @font-face { font-family: 'Cabin'; font-style: normal; font-weight: 400; src: url('../fonts/cabin-v12-latin-regular.eot'); src: local('Cabin'), local('Cabin-Regular'), url('../fonts/cabin-v12-latin-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/cabin-v12-latin-regular.woff2') format('woff2'), url('../fonts/cabin-v12-latin-regular.woff') format('woff'), url('../fonts/cabin-v12-latin-regular.ttf') format('truetype'), url('../fonts/cabin-v12-latin-regular.svg#Cabin') format('svg'); } @font-face { font-family: 'Cabin'; font-style: normal; font-weight: 700; src: url('../fonts/cabin-v12-latin-700.eot'); src: local('Cabin Bold'), local('Cabin-Bold'), url('../fonts/cabin-v12-latin-700.eot?#iefix') format('embedded-opentype'), url('../fonts/cabin-v12-latin-700.woff2') format('woff2'), url('../fonts/cabin-v12-latin-700.woff') format('woff'), url('../fonts/cabin-v12-latin-700.ttf') format('truetype'), url('../fonts/cabin-v12-latin-700.svg#Cabin') format('svg'); } :root{ --default-font: 'Cabin', Helvetica, Arial, sans-serif; --text-font: 'Martel', 'Times New Roman', Times, serif; --highlight: #c31e36; --highlight-hover: #e33e56; --background: #edeef0; --background-rgba-100: rgba(237, 238, 240, 1); --background-rgba-0: rgba(237, 238, 240, 0); --text-color: #3D4248; --text-color2: #8a8b8c; --hover-color: #3897f0; --border-color: #cbccce; --border-color2: #dcdddf; --border-rgba-100: rgba(220, 221, 223, 1); --border-rgba-0: rgba(220, 221, 223, 0); --box-title-background: #000; --box-background: #fff; --box-background-rgba-100: rgba(255, 255, 255, 1); --box-background-rgba-85: rgba(255, 255, 255, .85); --box-background-rgba-0: rgba(255 , 255, 255, 0); --invert-background-rgba-100: rgba(0, 0, 0, 1); --invert-background-rgba-85: rgba(0, 0, 0, .85); --invert-background-rgba-0: rgba(0 , 0, 0, 0); --bg-loader-gif: url('https://sportal.s3.amazonaws.com/media/web/bg-loader.gif'); --loader-gif: url('https://sportal.s3.amazonaws.com/media/web/loader.gif'); --app-hometop-bg: #000; --darkgrey: #6b6c6e; --darkgrey-hover: #7b7c7e; } body.dark{ --background: #000; --background-rgba-100: rgba(0, 0, 0, 1); --background-rgba-0: rgba(0, 0, 0, 0); --text-color: #f3f6f8; --text-color2: #9EA0A3; --border-color: #3E4043; --border-color2: #2E3033; --border-rgba-100: rgba(62, 64, 67, 1); --border-rgba-0: rgba(62, 64, 67, 0); --box-title-background: #808183; --box-background: #1E2023; --box-background-rgba-100: rgba(30, 32, 35, 1); --box-background-rgba-85: rgba(30, 32, 35, .85); --box-background-rgba-0: rgba(30 , 32, 35, 0); --invert-background-rgba-100: rgba(255, 255, 255, 1); --invert-background-rgba-85: rgba(255, 255, 255, .85); --invert-background-rgba-0: rgba(255 , 255, 255, 0); --bg-loader-gif: url('https://sportal.s3.amazonaws.com/media/web/bg-loader-dark.gif'); --loader-gif: url('https://sportal.s3.amazonaws.com/media/web/loader-dark.gif'); --darkgrey: #3e4043; --darkgrey-hover: #4e5053; } .wrapper ::-webkit-scrollbar, .wrapper ::-webkit-scrollbar-track, .wrapper ::-webkit-scrollbar-thumb, .wrapper ::-webkit-scrollbar-thumb:hover{ border-radius: 8px; } .transfer-slider-row::-webkit-scrollbar-track{ margin: 0 10px; } .teams-slider-row::-webkit-scrollbar-track{ margin: 0 15px; } .wrapper ::-webkit-scrollbar-track{ background: rgb(228 231 236 / 25%); } @media screen and (max-width: 400px){ .teams-slider-row::-webkit-scrollbar, .teams-slider-row::-webkit-scrollbar-track, .teams-slider-row::-webkit-scrollbar-thumb, .teams-slider-row::-webkit-scrollbar-thumb:hover{ height:0; } } #ot-sdk-btn.ot-sdk-show-settings, #ot-sdk-btn.ot-sdk-show-settings:hover{ color: inherit !important; background-color: inherit !important; border: inherit !important; height: inherit !important; padding: initial !important; font-size: inherit !important; line-height: inherit !important; } .hlightbg{ background: var(--highlight) !important; color: #fff; } *{ -webkit-tap-highlight-color: rgba(195, 30, 54, 0); box-sizing: border-box; -webkit-box-sizing: border-box; } html { height: 100%; touch-action: manipulation; } body { font-family: var(--default-font); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smoothing: antialiased; text-rendering: optimizeLegibility; font-size: 16px; margin: 0; padding: 0; position: relative; padding-bottom: 4rem; min-height: 100.1%; color: var(--text-color); background: var(--background); padding-top: constant(safe-area-inset-top); padding-top: env(safe-area-inset-top); overflow-x: hidden; transition: padding-bottom 1s cubic-bezier(0.19,1,.22,1); } body[data-tag="alpinesquad"]{ background: #000; color: #fff; } body[data-tag="alpinesquad"] .over-view{ display: none; } .view.detail .col.main .content{ font-family: var(--text-font); } table{ border-collapse: collapse; border-spacing: 0; } input:focus, select:focus, textarea:focus, button:focus { outline: none; } h1, h2{ font-family: var(--default-font); font-weight: 900px; line-height: 1.2em; } h1{ font-size: 37px; } h2{ font-size: 29px; } h3{ font-size: 19px; } a{ text-decoration: none; } a{ color: var(--highlight); } span.btn, a.btn, a.tag{ font-family: var(--default-font); background-color: var(--hover-color); border: 1px solid var(--hover-color); border-radius: 5px; color: var(--box-background); cursor: pointer; display: inline-block; font-size: 13px; font-weight: 400; height: 31px; line-height: 30px; max-width: 414px; padding: 0 18px; position: relative; text-align: center; white-space: nowrap; } span.btn:hover, a.btn:hover, a.tag:hover{ background: var(--highlight-hover); } } .btn2{ font-family: var(--default-font); border: 0; border-radius: 20px; background: var(--darkgrey); color: #fff; cursor: pointer; display: inline-block; font-size: 13px; font-weight: 400; height: 31px; line-height: 30px; max-width: 414px; padding: 0 12px; position: relative; text-align: center; white-space: nowrap; } .btn2:hover{ background-color: var(--darkgrey-hover); } .btn-prio{ font-family: var(--default-font); display: inline-block; padding: 8px 4%; text-align: center; background: var(--highlight); color: #fff !important; margin-bottom: 1px; cursor: pointer; } .btn-prio .icon{ font-size: 16px; margin-top: -3px; margin-right: 4px; margin-left: 4px; vertical-align: middle; display: inline-block; } .btn-prio:hover{ background: var(--highlight-hover); } .btn-prio i{ margin-right: 5px; } a.tag{ margin-right: 6px; margin-bottom: 6px; height: 25px; line-height: 24px; padding: 0 9px; } .col .content > a.btn{ color: #fff; text-align: center; margin: 0 auto 10px auto; display: block; max-width: 240px; } .clear:after{ content: ''; display: block; clear: both; } .sep{ width: 40%; height: 2px; margin: 16px auto; background: rgba(255,255,255,0.25); } iframe{ border: 0; } img{ border: 0; object-fit: cover; } .header{ position: fixed; top: 0px; width: 100%; height: 44px; background: #2b2c2d; box-shadow: 0 2px 2px rgba(10,20,30,0.3); color: #fff; z-index: 100; transition: box-shadow 150ms ease-in-out; transform: translateZ(0); -webkit-transform: translateZ(0); } .header div.top{ max-width: 1440px; margin: auto; position: relative; } .header.has_subnavi{ height: 88px; } .header.has_subnavi.large{ height: 156px; } .header .logo{ position: absolute; top: 0; left: 4px; height: 44px; } .header .navi{ position: absolute; top: 0px; left: 165px; width: 100%; max-width: calc(100% - 165px); margin: auto; z-index: 2; } .navi .mainmenu{ display: inline-block; list-style: none; margin: 0; padding: 0; width: 100%; white-space: nowrap; } .navi .mainmenu > li{ display: inline-block; position: relative; line-height: 18px; padding: 14px 2px 0 2px; height: 44px; float: left; } .navi .mainmenu > li.extra{ display: none; } .navi .mainmenu .arrow{ display: none; position: absolute; top: 36px; left: 50%; margin-left: -14px; width: 0; height: 0; border-left: 14px solid transparent; border-right: 14px solid transparent; border-bottom: 14px solid #fff; } .navi .submenu{ display: none; list-style: none; margin: 0; padding: 5px 10px; background: #fff; box-shadow: 0 6px 12px -1px rgba(30,30,30,0.5); position: absolute; top: 44px; left: 50%; min-width: 200px; margin-left: -100px; z-index: 1; } @media not all and (hover: hover){ .navi .submenu{ top: 36px; } } .navi .rightside .submenu{ left: auto; right: 0; } @media not all and (hover: none){ .navi .mainmenu li:hover .arrow{ border-bottom-color: #fff !important; } .navi .mainmenu li:hover .submenu, .navi .mainmenu li:hover .arrow, .navi .submenu:hover{ display: inline-block; } } .navi .submenu > li{ display: block; line-height: 25px; } .navi a{ text-decoration: none; } .navi .mainmenu > li > a{ position: relative; color: #fff; font-weight: bold; padding: 1px 10px; } .navi .mainmenu > li > a i{ font-size: 21px; line-height: 15px; } .navi .mainmenu > li > a i.icon-plus{ font-size: 18px; line-height: 17px; } .navi .mainmenu > li > a i.icon-watch{ font-size: 20px; line-height: 13px; } .navi .mainmenu > li > a i.icon-listen{ font-size: 17px; line-height: 17px; } .navi .mainmenu > li.rightside{ float: right; } .search-overlay{ position: absolute; top: -15px; right: 40px; width: 220px; height: 44px; padding: 4px; background: #2b2c2d; box-shadow: -10px 0 10px -3px #2b2c2d; z-index: 1; transform: translateX(300px); opacity: 0; transition: transform 250ms ease-in-out, opacity 200ms ease-in-out; } .search-overlay.active{ transform: translateX(0px); opacity: 1; } .hometop_container .search-overlay{ top: 0px; right: 46px; width: calc(100% - 46px); transform: translateX(0px); transform: translateY(-100px); } .hometop_container .search-overlay.active{ transform: translateY(0px); } .myfeed_overlay .search-overlay{ width: 100%; position: relative; top: 0; left: 0; padding: 0; height: 54px; } .search-overlay .icon-search{ position: absolute; top: 13px; right: 10px; color: var(--text-color2); font-size: 21px; } .search-input{ height: 100%; width: 100%; border: none; padding: 0 12px; font-size: 16px; border-radius: 0; background: var(--box-background); color: var(--text-color); } .autocomplete-group{ padding: 6px 12px 4px 12px; font-size: 14px; text-transform: capitalize; font-weight: bold; background: #555; color: #fff; border-top: 1px solid var(--border-color); box-shadow: inset 0px 10px 20px -9px #222; } .autocomplete-suggestions{ background: #2b2c2d; box-shadow: 0 10px 30px -10px #000; max-height: none !important; } .autocomplete-suggestion{ border-top: 1px solid var(--border-color); font-weight: normal; color: var(--text-color); background: var(--box-background); padding: 9px 13px; cursor: pointer; transition: background 200ms ease-in-out; } .autocomplete-suggestion strong{ color: var(--highlight); } .autocomplete-suggestion.autocomplete-selected{ background: var(--border-color2); } .autocomplete-no-suggestion{ padding: 9px 12px; font-style: italic; font-size: 15px; color: var(--text-color2); background-color: var(--box-background); } .mm_overlay .search-overlay{ position: relative; width: 100%; right: auto; top: 8px; padding: 1px; box-shadow: none; display: block; transition: none; } .mm_overlay .autocomplete-suggestions{ margin-top: 1px; box-shadow: none; } .mm_overlay .autocomplete-suggestion{ background: var(--box-background); } .mm_overlay .autocomplete-suggestion.autocomplete-selected{ background: #f1f2f3; } .navi .mainmenu > li.active > .arrow{ display: block } .navi .mainmenu.more > li.active > .arrow{ display: none; } @media not all and (hover: none){ .navi .mainmenu:hover > li > .arrow{ display: none; } .navi .mainmenu:hover > li:hover > .arrow{ display: block; } .navi:hover .mainmenu li a{ color: #ADB2B8; } } .navi .mainmenu li a:hover{ color: #fff; } .navi .submenu a{ color: var(--text-color); padding: 5px 10px; margin: 5px 0; display: block; } .navi:hover .submenu li a{ color: #8D8288; } @media not all and (hover: none){ .navi .submenu li a:hover{ color: var(--text-color); } } .navi .submenu li a:hover{ background: var(--highlight); color: #fff; font-weight: bold; } .navi .submenu li div{ color: var(--text-color2); font-weight: bold; padding: 5px 10px; margin: 5px 0; display: block; pointer-events: none; } .navi .mainmenu > li.extramenubtn > a{ font-size: 21px; line-height: 1px; position: relative; top: 3px; padding: 5px; cursor: pointer; } .navi .mainmenu.more{ position: fixed; top: 44px; right: 0px; width: auto; height: calc(100vh - 44px); padding: 0 10px; background: #2b2c2d; display: block; overflow: auto; z-index: 2; transform: translateZ(0); -webkit-transform: translateZ(0); } .navi .mainmenu.more > li{ display: block; height: auto; } .navi .mainmenu.more > li > a.active{ background: transparent; } .navi .mainmenu.more .submenu, .navi .mainmenu.more li:hover .submenu{ display: block; position: static; top: initial; left: initial; min-width: inherit; margin: 0; box-shadow: none; background: #2b2c2d; } .navi .mainmenu.more .submenu a{ color: #eee; } .navi:hover .mainmenu.more .submenu a{ color: #9DA2A8; } .navi .mainmenu.more .submenu a:hover{ color: #fff; } .navi .mainmenu.more li:hover .arrow{ display: none; } .mobilemenubtn, .mobilebackbtn{ position: absolute; top: 0; left: 9px; width: 36px; height: 40px; display: none; cursor: pointer; animation: mobilebtn-fadein 350ms ease-out; } @keyframes mobilebtn-fadein{ 0% { opacity: 0 } 100% { opacity: 1 } } .mobilebackbtn.icon-small-left{ font-size: 30px; padding: 6px 0 0 12px; } .mobilebackbtn.icon-arrow-left{ font-size: 27px; padding: 8px 0 0 5px; } .mobilegetappbtn{ position: absolute; top: 10px; right: 11px; height: 25px; font-size: 12px; text-align: center; padding: 5px 7px; color: #fff; background: var(--highlight); display: none; cursor: pointer; animation: mobilebtn-fadein 350ms ease-out; } .mobilescoresbtn{ position: absolute; top: 0; right: 73px; width: 36px; height: 40px; font-size: 24px; padding: 10px 0 0 5px; display: none; cursor: pointer; animation: mobilebtn-fadein 350ms ease-out; } .mobilevideobtn{ position: absolute; top: 0; right: 7px; width: 36px; height: 40px; font-size: 24px; padding: 9px 0 0 5px; display: none; cursor: pointer; animation: mobilebtn-fadein 350ms ease-out; } @media screen and (max-width:1023px) { .header .logo{ left: 52px; } .header .navi{ display: none; } .mobilebackbtn, .mobilevideobtn, .mobilescoresbtn, .mobilegetappbtn{ display: block; } body[data-view="home"] .mobilebackbtn{ display: none; } body[data-view="home"] .mobilemenubtn{ display: block; } } .header .subnavi{ position: absolute; top: 44px; left: 0px; right: 0px; height: 44px; background-color: var(--box-background); color: var(--text-color); display: none; box-shadow: inset 0 4px 4px -4px rgba(10,20,30,0.8); overflow: hidden; margin: auto; } .header .subnavi div.fade{ position: absolute; top: 10px; bottom: 0; right: 0; width: 16px; z-index: 1; } .header .subnavi div.row{ display: block; list-style: none; margin: auto; padding: 0 13px 6px 6px; width: 1440px; max-width: 100%; white-space: nowrap; overflow-y: hidden; overflow-x: scroll; } @media screen and (min-width:1420px) { .header .logo{ left: 4px; } .header .subnavi div.fade{ display: none; } .header .subnavi div.row{ padding-left: 20px; } } .header.has_subnavi .subnavi{ display: block; } .header.large .subnavi div.row{ min-height: 116px; } .header .subnavi .sublogo{ height: 25px; vertical-align: text-bottom; vertical-align: middle; margin-top: -3px; } .header .subnavi .follow{ margin-left: 8px; margin-top: -3px; vertical-align: middle; } .header.large .subnavi{ height: 99px; } .header.large .subnavi .row a:not(.chosentag):first-child{ display: block; font-size: 19px; font-weight: bold; height: 55px; border: none; } .header .subnavi a.active:first-child{ border-bottom-color: transparent; } .header.large .subnavi .sublogo{ width: auto; height: 50px; margin-right: 10px; } .header .subnavi .teamstream_logo{ width: 180px; margin: 16px 0 0 18px; opacity: 0.95; } .header .subnavi .teamstream_logo_bg{ position: absolute; top: 19%; left: 2%; width: 110%; max-width: 580px; opacity: 0.07; } .header .subnavi .teamstream_logo_bg2{ position: absolute; top: 28%; left: 6%; width: 110%; max-width: 1030px; opacity: 0.03; } .header .subnavi .icon-profil{ position: absolute; top: 11px; right: 16px; font-size: 20px; height: auto; background: #eff0f3; padding: 5px 8px 7px 8px; border-radius: 16px; border: none !important; z-index: 2; } .header .subnavi .icon-profil:hover{ background: #333; color: #fff; } .header .subnavi a{ display: inline-block; position: relative; line-height: 20px; padding: 14px 10px; height: 45px; color: var(--text-color); transition: border-bottom 200ms ease-in-out; } .header .subnavi a.active{ border-bottom: 4px solid var(--highlight); } .header .subnavi:hover a{ border-bottom: 0px solid var(--highlight); } .header .subnavi a:hover{ border-bottom: 4px solid var(--highlight); } .header .subnavi a.open{ border-bottom: 4px solid transparent !important; } .header .subnavi a.open:after{ content: ' '; position: absolute; bottom: -9px; left: 50%; margin-left: -14px; width: 0; height: 0; z-index: 1; border-left: 14px solid transparent; border-right: 14px solid transparent; border-bottom: 14px solid #fff; } .header .subnavi a.chosentag{ position: relative; padding-top: 11px; height: 62px; } .header .subnavi a.chosentag img.heart{ position: absolute; top: 6px; right: -2px; width: 22px; height: 22px; } .header .subnavi a.chosentag img{ width: 40px; height: 40px; } .header .subnavi .chosentagsep{ display: inline-block; height: 36px; width: 2px; background: rgba(255,255,255,0.25); margin: 10px 4px 0 9px; } .subsub{ position: absolute; top: 87px; min-width: 200px; max-width: 100%; left: 50%; margin-left: -100px; background: #fff; color: #222; padding: 5px 10px; box-shadow: 0 2px 20px -6px #333; z-index: 1; display: none; } @media screen and (min-width:1440px) { .subsub{ margin-left: calc(((100% - 1440px)/2) - 100px); } } .subsub.cols2{ width: 400px; } .subsub.cols3{ width: 440px; } .subsub.left{ left: 100px !important; } .subsub.right{ left: auto !important; right: 0px; } .subsub li{ display: block; line-height: 25px; } .subsub a{ color: #222; padding: 5px 10px; margin: 5px 0; display: block; } .subsub a:hover { background: var(--highlight); color: #fff; } .subsub.cols2 a{ display: inline-block; width: 190px; } .subsub.cols3 a{ display: inline-block; width: 140px; } @media screen and (max-width:440px) { .subsub.cols2 a, .subsub.cols3 a{ width: 50%; } } .navi .mainmenu .icon-external, .header .subnavi .icon-external, .mm_right .icon-external{ font-size: 12px; vertical-align: text-top; margin-left: 4px; margin-right: -1px; } .breadcrump{ font-size: 14px; margin-top: 4px; padding-left: 13px; } .breadcrump a{ color: var(--text-color); } .breadcrump a:hover{ text-decoration: underline; } .breadcrump i{ font-size: 18px; vertical-align: text-top; margin: 0 3px; } .over-view{ position: relative; z-index: 4; background: var(--background); } .wrapper{ max-width: 1440px; margin: auto; } body[data-widget="startsite"][data-view="channel"] .header{ display: none !important; } body[data-widget="startsite"] .header{ height: 41px; } body[data-widget="startsite"] .header div.top{ display: none; } body[data-widget="startsite"] .header div.subnavi{ top: 0; } body[data-widget="startsite"] .wrapper{ max-height: 1750px; } body[data-widget="lts"]{ padding: 57px 0 0 0; min-height: auto; } body[data-widget="fvnws"]{ padding-top: 0 !important; } body[data-widget="fvnws"] #matchesSearch_box{ margin-top: 0; } .view{ display: none; } .view.active{ display: block; opacity: 1; } .tabnav, .feednav{ display: flex; width: 100%; margin-top: 3px; margin-bottom: 3px; } .feednav.fixed{ position: fixed; top: 0; left: 0; right: 0; margin: 0; z-index: 10; } .feednavpl{ height: 47px; display: none; } .feednavpl.fixed{ display: block; } @media screen and (max-width:799px) { .tabnav{ margin-top: 0; } body .tabnav{ position: absolute; z-index: 4; transform: translateY(0); transition: transform 250ms ease-in-out; } body .tabnav.slideup{ transform: translateY(-42px); } body .tabnavpl{ height: 44px; } body.isPhonegap[data-tag="topnews"] .tabnav.top{ top: 0px; } body.isPhonegap[data-tag="topnews"] .tabnav.top.switching{ display: none; } body.isPhonegap[data-tag="topnews"] .tabnav:not(.top){ position: relative; transform: translateY(0); } body.isPhonegap[data-tag="myfeed"] .tabnavpl:not(.top), body.isPhonegap[data-tag="topnews"] .tabnavpl:not(.top){ height: 0px; } } .tabnav .tab, .feednav .tab{ flex: 1; text-align: center; background: var(--box-background); border-bottom: 1px solid var(--border-color2); } .tabnav .tab span, .feednav .tab span{ display: inline-block; border-bottom: 4px solid transparent; padding: 11px 12px 6px 12px; color: var(--text-color); } .tabnav .tab span{ text-transform: uppercase; } .tabnav .tab.active span, .feednav .tab.active span{ border-bottom-color: var(--highlight); } .col{ display: none; width: 100%; max-width: 100%; } .view.page .col, .col.active{ display: inline-block; } .view.home .col .content{ position: -webkit-sticky; position: sticky; top: 75px; } .view.home .col.main{ overflow-x: hidden; } .view.home .col.main .content{ position: static; } .view.detail .col.side.left{ position: fixed; left: 0px; top: 65px; width: 340px; height: 100%; overflow: hidden; transform: translateZ(0); -webkit-transform: translateZ(0); } .view.detail .col.side.left .fader{ position: absolute; top: 0px; left: 0px; width: 100%; height: 12px; background: -moz-linear-gradient(top, var(--background-rgba-100) 68%, var(--background-rgba-0) 100%); background: -webkit-linear-gradient(top, var(--background-rgba-100) 68%, var(--background-rgba-0) 100%); background: linear-gradient(to bottom, var(--background-rgba-100) 68%, var(--background-rgba-0) 100%); z-index: 3; } .view.detail .col.side.left .content{ height: 100%; overflow-y: scroll; width: 360px; padding-right: 40px; overflow-x: hidden; background: var(--background); } .view.detail .col.side.left .content a.box{ margin-right: 0; margin-left: 10px; width: 320px; min-height: 80px; } .col .content a{ text-decoration: none; color: var(--text-color); } .view.detail .col.main .content .text.body p a{ color: var(--hover-color); } .view.detail .col.main .content .text.body p a:hover{ text-decoration: underline; } .tableresp{ width: 100%; overflow: auto; position: relative; border-left: 1px solid var(--background); } .tableresp table{ width: auto !important; } .tableresp table::-webkit-scrollbar{ -webkit-appearance: none; width: 14px; height: 14px; } .tableresp table::-webkit-scrollbar-thumb{ border-radius: 8px; border: 3px solid #fff; background-color: rgba(0, 0, 0, .3); } .tableresp table tbody{ vertical-align: top; background-color: var(--box-background); } .tableresp td, .tableresp th { border: 1px solid var(--background); text-align: left; padding: 8px 10px; } .tableresp th:first-child, .tableresp td:first-child{ position: sticky; left: 0px; background-color: var(--box-background); } .col .content a.btn, .col .content a.tag{ color: var(--hover-color); background: var(--box-background); transition: all 200ms ease-in-out; } .col .content a.btn:hover, .col .content a.tag:hover{ color: #fff; background: var(--hover-color); } a.btn.outline, .col .content a.btn.outline{ color: var(--text-color); border: 1px solid var(--text-color); background: transparent; } a.btn.outline:hover, .col .content a.btn.outline:hover{ background: rgb(255,255,255,0.15); } .col .content .btns{ display: flex; width: 100%; margin: auto; } .col .content .btns a.btn{ margin-right: 10px; flex: auto; } .col .box{ display: block; position: relative; margin: 10px; background: var(--box-background); border-bottom: 1px solid var(--border-color); } .col .box.black{ color: #fff; background: #000; } body.isPhonegap .col .box.pholder{ transform: scale(0.9); opacity: 0.5; } span:not(.video) div[data-embedo-source="iframe"]{ opacity: 0; } span.oembed-loaded:not(.video) div[data-embedo-source="iframe"]{ opacity: 1; } span.oembed-loaded:not(.video) div[data-embedo-source="iframe"]{ width: 100%; position: relative; overflow: hidden; max-width: 550px; margin: auto; box-shadow: 0 0 0 1px var(--border-color2), 0 4px 20px -10px var(--text-color); border-radius: 8px; } span.oembed-loaded:not(.video) div[data-embedo-source="iframe"]:before{ content: ""; display: block; padding-top: 161%; overflow: hidden; } body.screen-small span.oembed-loaded:not(.video) div[data-embedo-source="iframe"]:before{ padding-top: 186%; } span.oembed-loaded:not(.video) div[data-embedo-source="iframe"] embed{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; min-width: 100%; width: 100px; *width: 100%; height: 100%; } .col .box.article.type-embed .text.body .facebook.oembed-loaded > div{ margin-bottom: 20px !important; } .col .box.article.type-quote .text.body > p{ border-left: 6px solid var(--highlight); padding-left: 4%; } .col .box.article.type-quote .text.body > p strong{ font-size: 120%; line-height: 120%; } .col .box.article.type-quote .text.body p{ font-style: italic; } .view.page .col .content .box.article .text{ margin: auto; width: 90%; max-width: 640px; } .col .box .box{ border-top: 1px solid var(--border-color2); margin-left: 0; margin-right: 0; } .view.p .col.main .box{ padding: 1px 13px; } .view.transfers .col.main .box, .view.home .col.main .box{ margin-top: 15px; margin-bottom: 15px; padding: 1px 13px 3px 13px; } .view.home .col.main .box.article-type-native_ad{ padding-bottom: 12px; } .view.home .col.main .box:first-child{ margin-top: 10px; border-top: none; } .view.home .col.main .box.teaser2, .view.home .col.main .box.teaser3{ padding: 0; border: none; border-radius: 8px; margin-bottom: 10px; } @media screen and (min-width: 1440px){ .view.home .col.main .box.teaser3{ margin-bottom: 15px; } } .view .col.main .box.teaser2.col-50{ display: inline-block; width: calc(50% - 15px); height: 450px; padding: 0; border-bottom: none; margin-right: 0; } @media screen and (max-width:799px){ .view .col.main .box.teaser2.col-50{ height: 320px; } } .view .col.main .dis-50{ display: inline-block; margin: 0; } .view .col.main .next-articles .box.teaser2.col-50{ width: calc(50% - 5px); height: 250px; margin-top: 0; } .view .col.main .next-articles .dis-50{ margin: 0 5px; } .col .box .text.body .next-articles img{ height: 100%; } .view.home .col.main .teammatches:not(.box), .view.home .col.main .teamstats:not(.box), .view.home .col.main .personstats:not(.box){ margin-top: -5px; } .view.home .col.main .box.teammatches, .view.home .col.main .box.teamstats, .view.home .col.main .box.personstats{ padding-top: 1px; } .view.home .col.main .box.teammatches h3{ margin: 18px 0 -7px 0; text-align: center; } .view .col.main .box.box-footer{ border: none; margin-top: -16px; margin-bottom: 16px; padding-top: 10px; padding-bottom: 12px; } .view.home .col.main .linkbox .box{ border-top: 2px solid var(--border-color); padding-top: 13px; padding-bottom: 13px; } .view.home .col.main .linkbox .box a{ display: block; padding: 5px 0 5px 24px; font-size: 17px; } .view.home .col.main .linkbox .box a i{ display: inline-block; margin: -3px 2px 0 -22px; vertical-align: middle; font-size: 16px; color: var(--border-color); } .view.home .col.main .box.article-type-live:not(.teaser2):not(.teaser3){ padding-top: 20px; } .view.home .col.main .box.article-type-live.past:not(.teaser2):not(.teaser3){ padding-top: 12px; } .view.home .col.main .box.article-type-live.past.connect:not(.teaser2):not(.teaser3){ padding-top: 0px; } .view.home .col.main .box.article-type-quote{ border-left: 5px solid var(--highlight); padding-left: 16px; } .view.home .col.main .box .tagspace{ height: 15px; display: inline-block; } .view.home .col.main .box.match:not(.teaser2):not(.teaser3){ margin-bottom: 0; border-top: none; } .view.home .col.main .box.match.connect:not(.teaser2):not(.teaser3){ margin-top: -7px; border-top: 10px solid var(--box-background); border-top-left-radius: 0; border-top-right-radius: 0; z-index: 1; } .box.match.teaser + .box.match.connect.teaser{ border-top: 5px solid var(--box-background); box-shadow: inset 0 1px var(--border-color); padding-top: 8px; } .box.match.teaser2 + .box.match.connect.teaser{ margin-top: -15px !important; } .view.home .col.main .box.match.connect:not(.teaser2):not(.teaser3) .text{ padding-top: 15px; } .box.match.teaser2 + .box.match.connect.past:not(.teaser2):not(.teaser3) .text{ padding-top: 2px !important; } .view.home .col.main .box.:first-child{ margin-top: 10px; } body:not(.isPhonegap) .view.home .col.main .box.article-type-social:first-child{ padding-top: 3px; } .view.home .col.main .box:last-child{ margin-bottom: 10px; } .view.home .col.main .breaking.box{ margin-bottom: -20px; position: relative; z-index: 1; padding: 3px; text-align: center; background: #c31e36; color: #fff; text-transform: uppercase; letter-spacing: 3px; font-size: 13px; font-weight: bold; border: none; } .view.home .col.main .match_group_head .box{ margin-bottom: -20px; position: relative; z-index: 1; padding-top: 20px; } @media screen and (min-width:800px){ .view.home .col.main .breaking.box, .view.home .col.main .match_group_head .box{ border-radius: 8px 8px 0 0; } } .view.home .col.main .match_group_head .box .title{ background: var(--box-title-background); color: var(--box-background); position: absolute; z-index: 3; top: 0; left: 0; right: 0; padding: 3px 15px; font-size: 13px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .noresult-hint{ display: block; padding: 12% 10%; font-style: italic; text-align: center; color: #a0a1a2; max-width: 940px; } .loader{ display: block; height: 560px; max-height: 100%; padding: 10%; text-align: center; color: #a0a1a2; background: url('../img/bg-loader.gif') center center no-repeat; } .loader.black{ background: url('../img/bg-loader-black.gif') center center no-repeat; } .tabselect{ display: flex; width: 100%; padding: 6px 10px 0 10px; } .tabselect .tab{ flex: 1; text-align: center; cursor: pointer; } .tabselect .tab span{ display: inline-block; padding: 6px 12px; border-bottom: 4px solid transparent; transition: border-bottom 200ms ease-in-out; } .tabselect .tab:hover span, .tabselect .tab.active span{ opacity: 1; border-bottom-color: var(--highlight); } .box img{ background: var(--border-color2); } .box .img{ padding-top: 56.25%; position: relative; width: 100%; overflow: hidden; margin-bottom: 0.45em; } .box.article-type-live .img{ padding-top: 36%; } .box.teaser2 .img{ padding-top: 56.25%; margin-bottom: 0; border-radius: 8px; } .view.detail .col.main > .content > .box > .text.body .box.teaser2 .img{ padding-top: 45%; } .view.detail .col.main > .content > .box > .text.body .box.teaser2 h2{ padding-bottom: 10px; } .view.detail .col.main > .content > .box > .text.body .box.teaser2 .meta{ display: none; } .box.teaser3 .img{ float: left; width: calc(50% - 10px); margin: 0 18px 0 0; border-radius: 8px 0 0 8px; } .box.teaser3 .img img{ border-radius: 8px 0 0 8px; } @media screen and (max-width:799px){ .box.teaser2:not(.col-50) .img{ min-height: 370px; } .view.detail .col.main > .content > .box > .text.body .box.teaser2:not(.col-50) .img{ min-height: 240px; } .view.detail .col.main > .content > .box > .text.body .box.teaser2:not(.col-50) img{ height: 100%; } .box.teaser3 .img{ float: none; width: 100%; margin: 0; border-radius: 8px 8px 0 0; } .box.teaser3 .img img{ border-radius: 8px 8px 0 0; } } .box.teaser2.col-50 .img{ height: 100%; } .box .img img{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: 100%; } .box.article-type-live .btn{ margin: 7px 10px 0 0; } .col .box img, .col .box iframe{ max-width: 100% !important; } @media screen and (max-width:390px) { .col .box .fb_iframe_widget iframe{ max-width: calc(100% - 30px) !important; } } .col .box.teaser2 a img, .col .box.teaser3 a img{ transition: transform 3.5s cubic-bezier(0.19,1,.22,1); } .col .box.teaser2 a:hover img, .col .box.teaser3 a:hover img{ -webkit-transform: scale(1.125) rotate(0.02deg)!important; -ms-transform: scale(1.125) rotate(0.02deg)!important; -o-transform: scale(1.125) rotate(0.02deg)!important; transform: scale(1.125) rotate( 0.02deg )!important; } .col .box .text.body img{ background: transparent; height: auto; } .col .box .text.body img.alignleft{ float: left; margin-right: 4%; margin-bottom: 2px; } .col .box .text.body img.alignright{ float: right; margin-left: 4%; margin-bottom: 2px; } .col .box .text.body .img-caption{ border-bottom: 1px solid var(--border-color2); max-width: 100%; } .col .box .text.body .img-caption[align="alignleft"]{ float: left; margin-right: 4%; margin-bottom: 6px; } .col .box .text.body .img-caption[align="alignright"]{ float: right; margin-left: 4%; margin-bottom: 6px; } .col .box .text.body .img-caption[width="300"]{ width: 300px; } .col .box .text.body .img-caption[width="150"]{ width: 150px; } .col .box .text.body .img-caption .caption{ font-family: var(--default-font); font-style: italic; color: #6D7278; padding-bottom: 6px; } .col .box.thumb img{ float: left; margin-right: 13px; } .liveticker-teaser img{ float: none; margin: 0px; background: transparent; width: 30px; max-width: 100%; vertical-align: middle; } .col .box .text{ position: relative; padding: 7px 10px; } .col .box.teaser2 .text{ padding: 90px 21px 0 21px; position: absolute; bottom: 0; width: 100%; z-index: 1; color: #fff; background: -moz-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.9) 80%); background: -webkit-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.9) 80%); background: linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.9) 80%); border-radius: 0 0 8px 8px; } .col .box.teaser3 .img:after{ content: ' '; position: absolute; top: 40%; bottom: 0; left: 0; right: 0; background: -moz-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.7) 80%); background: -webkit-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.7) 80%); background: linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.7) 80%); } .col .box.teaser3 .social-icon h2{ margin-top: 58px; } .col .box.teaser2 .social-icon, .col .box.teaser3 .social-icon{ position: absolute; color: #fff; background: var(--highlight); border-radius: 8px; width: 40px; height: 40px; text-align: center; line-height: 43px; font-size: 24px; top: 13px; left: 13px; z-index: 1; } .col .box.match.teaser2 .social-icon, .col .box.match.teaser3 .social-icon{ top: 18px; } .col .box.teaser2 a:hover div.social-icon, .col .box.teaser3 a:hover div.social-icon{ animation: stretch2 1s ease-out; } @keyframes stretch2{ 0% { transform: scaleX(0.7); } 100% { transform: scale(1); } } .col .box.teaser2 .text:not(.social-icon):before, .col .box.teaser3 .text:not(.social-icon):before{ border-top: 3px solid var(--highlight); position: absolute; width: 90px; content: ''; top: 98px; } .col .box.teaser2 a:hover .text:before, .col .box.teaser3 a:hover .text:before{ animation: stretch 2s ease-out; } @keyframes stretch{ 0% { transform: scaleX(0.1); } 100% { transform: scale(1); } } .col .box.teaser3 .text:not(.social-icon):before{ top: 25px; } @media screen and (max-width:799px) { .col .box.teaser3 .text:not(.social-icon):before{ display: none; } } .col .box.teaser2 .text.social-icon h2:after, .col .box.teaser3 .text.social-icon h2:after{ content: "\f08e"; font-family: 'icomoon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; color: var(--highlight); font-size: 73%; margin-left: 0.4rem; margin-top: -0.2rem; vertical-align: middle; display: inline-block; } .col .box.teaser3 .text h2{ margin-top: 34px; } .col .box.teaser2 .text h2{ margin-bottom: 10px; text-shadow: rgb(0 0 0) 0px 0px 8px, rgb(0 0 0) 0px 0px 8px; } .col .box.teaser2.col-50 .text h2{ font-size: 21px; margin-top: 21px; } @media screen and (max-width:799px){ .col .box.teaser2 .text{ padding-left: 12px; padding-right: 12px; } .col .box.teaser3 .text:before{ top: -22px; } .col .box.teaser3 .text h2{ font-size: 20px; margin-top: 12px; } .col .box.teaser2.col-50 .text h2{ font-size: 17px; line-height: 19px; } } .col .box.thumb .text{ font-weight: bold; font-size: 14.75px; line-height: 18px; padding-bottom: 18px; } .col div.phold{ display: inline-block; width: 50%; height: 8px; margin-top: 2px; background: var(--border-color2); } .col .content > div.phold{ margin: 20px auto; display: block; } .col .box.livenow{ background-color: #111; } .col .box.livenow .text h3{ color: var(--highlight); padding: 5px; font-weight: normal; } .col .box.livenow .text a.link{ color: #fff; } .col .box.livenow .row{ margin: 5px 0 8px 0; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .col .box.livenow .row span{ display: inline-block; font-size: 10px; text-transform: uppercase; width: 48px; overflow: hidden; margin: 0 10px 0 4px; color: #999; vertical-align: middle; } .col .box.livenow .row img{ background: none; width: 48px; height: 24px; margin: 0 10px 0 4px; object-fit: contain; vertical-align: middle; } .col .box .text div.phold:first-child{ width: 67%; margin-top: 9px; } .col .box.liveticker-teaser .text div.phold{ width: 30%; margin-top: 25px; margin-bottom: 17px; } .col .box.liveticker-teaser .text div.phold:first-child{ margin-left: 16%; margin-right: 20px; } .col .box.liveticker-teaser .text div.phold:last-child{ margin-left: 20px; margin-right: 16%; } .view.detail .col.main > .content > .box > .text{ position: relative; padding: 0 4.25% 30px 4.25%; margin: auto; overflow-x: hidden; max-width: 100%; } .liveticker-teaser{ font-family: var(--default-font); margin-top: 0; margin-bottom: 0; } .col .box.liveticker-teaser .text{ font-weight: bold; font-size: 14.75px; line-height: 18px; min-height: 68px; padding-bottom: 11px; padding-left: 0px; padding-right: 0px; text-align: center; display: flex; } .col .box.liveticker-teaser.micro{ min-height: 94px; } .col .box.liveticker-teaser.micro .text{ min-height: auto; max-width: 360px; text-align: left; padding-left: 16px; } .col .box.liveticker-teaser.micro .date{ width: 88px; text-align: center; } .col .box.liveticker-teaser.micro .time{ width: 80px; font-weight: normal; text-align: center; } .col .box.liveticker-teaser.micro .time.fin{ font-size: 80%; } .col .box.liveticker-teaser.micro .time.live{ font-size: 80%; font-weight: bold; transform: skewX(-4.1deg); background: var(--highlight); width: 40px; margin: 8px auto -22px auto; padding: 3px 0 2px 0; } .col .box.liveticker-teaser.micro .time.live span{ display: block; transform: skewX(4.1deg); } .col .box.liveticker-teaser.micro span.btn{ max-width: 88px; padding: 0 9px; margin-top: 7px; color: #fff; font-size: 11px; height: 23px; line-height: 23px; border-radius: 15px; } .col .box.liveticker-teaser.micro.live span.btn{ margin-top: 32px; } @media screen and (min-width:600px){ .col .box.liveticker-teaser.micro .text{ padding-left: 90px; } .col .box.liveticker-teaser.micro .date{ padding-top: 17px; } .col .box.liveticker-teaser.micro span.btn{ position: absolute; top: 27px; left: -10px; } } .col .box.liveticker-teaser.micro span.btn i{ margin-right: 1px; margin-top: -2px; display: inline-block; vertical-align: middle; } .col .box.liveticker-teaser.micro .team{ line-height: 32px; width: 250px; padding-left: 2px; white-space: nowrap; overflow: hidden; clear: both; } .col .box.liveticker-teaser.micro .team:first-child{ margin-bottom: 7px; padding-left: 5px; } .col .box.liveticker-teaser.micro .image{ float: left; width: 35px; margin: auto 9px; line-height: 1; } .liveticker-teaser .name{ flex: 1 1 auto; margin: auto; width: 100px; padding: 0 10px; } .liveticker-teaser .name span{ display: inline-block; } .liveticker-teaser .phold, .liveticker-teaser .phold:first-child{ flex: 1 1 auto; width: 70px; margin: 12px; } .liveticker-teaser .image{ flex: 0 0 auto; margin: auto; padding: 0 2px; } .liveticker-teaser .result{ flex: 0 0 auto; margin: auto; padding: 11px; font-size: 23px; } .liveticker-teaser .vs{ text-align: center; margin-top: -31px; padding-bottom: 10px; font-size: 16px; font-weight: bold; } .liveticker-teaser .vs span{ color: var(--border-color); font-size: 14px; margin: 2px; } .col .teams-container, .col .teams-container2, .col .teams-container3, .col .teams-container4{ max-width: 960px; } .teams-overview { margin-top: 16px; } .view.teams .teams-overview a.team{ display: inline-block; width: calc(33% - 10px); height: 100px; position: relative; margin: 3px 5px; transform: skewX(-4.1deg); overflow: hidden; } @media screen and (max-width: 1200px){ .view.teams .teams-overview a.team{ width: calc(50% - 10px); } } @media screen and (max-width: 860px){ .view.teams .teams-overview a.team{ display: block; width: 90%; margin: 10px 5%; } } .view.teams .teams-overview a.team:after{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; content: ' '; background: -moz-linear-gradient(174deg,rgba(0,0,0,0) 28%,rgba(0,0,0,.24) 70%); background: -webkit-linear-gradient(174deg,rgba(0,0,0,0) 28%,rgba(0,0,0,.24) 70%); background: linear-gradient(174deg ,rgba(0,0,0,0) 28%,rgba(0,0,0,.24) 70%); z-index: 1; } .view.teams .teams-overview div.logo{ width: 80px; position: absolute; top: 10px; left: 20px; z-index: 3; transform: skewX(4.1deg); } .view.teams .teams-overview div.logo img{ width: 80px !important; height: 80px !important; background: transparent; vertical-align: middle; transition: transform 500ms cubic-bezier(0.19,1,.22,1); } .teams-overview a.team:hover div.logo img{ transform: scale(0.9); } .view.teams .teams-overview div.name{ position: absolute; padding: 40px 0 0 115px; top: 0; bottom: 0; left: 0; right: 0; font-weight: bold; transform: skewX(4.1deg); text-shadow: -1px -1px 9px rgba(0,0,0,0.2); z-index: 3; } .view.teams .teams-overview div.bgname{ position: absolute; top: -24px; bottom: 0; left: 25px; right: 0; font-size: 150px; font-weight: bold; opacity: 0.066; transform: skewX(4.1deg); text-shadow: -1px -1px 9px rgba(0,0,0,0.2); z-index: 2; } .col .team-container{ max-width: 960px; } .view.teams .team-container .teamlogo{ width: 120px; height: 100px; text-align: center; display: inline-block; vertical-align: middle; position: relative; z-index: 2; } .view.teams .team-container .teamlogo img{ background: transparent; width: 100% } .view.teams .team-container .teamname{ display: inline-block; height: 80px; line-height: 80px; margin-left: 10px; font-size: 32px; font-weight: bold; } @media screen and (max-width: 700px){ .view.teams .team-container .box .teamlogo{ width: 94px; height: 94px; margin: -7px -7px -18px -11px; } .view.teams .team-container .box .teamname{ line-height: 59px; font-size: 25px; } } .view.teams .team-container .teamname_bg{ position: absolute; top: -50px; left: 33px; font-weight: bold; font-size: 180px; opacity: 0.065; white-space: nowrap; color: #000; pointer-events: none } .view.teams .team-container .teamstats{ background: rgba(0,0,0,0.25); padding: 10px 0 17px 0; margin: -16px -18px; z-index: 1; position: relative; padding-left: 60px; transform: skewX(-4.1deg); } .view.teams .team-container .teamstats > div{ display: inline-block; width: 25%; text-align: center; border-left: 2px solid rgba(255,255,255,0.25); } .view.teams .team-container .teamstats > div:first-child{ border-left: none; } .view.teams .team-container .teamstats > div > *{ display: block; transform: skewX(4.1deg); } .col .box.liveticker-standing{ padding: 6px 8px 2px 8px; margin-top: 0; } .liveticker-standing table{ width: 100%; } .liveticker-standing tr.headline{ color: #a0a1a2; } .liveticker-standing tr.headline th{ font-weight: normal; font-size: 12px; padding: 3px; } .liveticker-standing tr:nth-child(even){ background: var(--background); } .liveticker-standing td{ position: relative; font-size: 14px; text-align: center; padding: 5px 6px; } body.screen-small .liveticker-standing th.xt, body.screen-small .liveticker-standing td.xt, .col.side.left .liveticker-standing th.xt, .col.side.left .liveticker-standing td.xt{ display: none; } .view.standing .liveticker-standing td{ font-size: 17px; } .liveticker-standing td.rank{ font-weight: bold; } .liveticker-standing td.logo{ width: 42px; } .liveticker-standing td.logo a{ min-width: 42px; text-align: center; } .liveticker-standing td.logo img{ margin-bottom: 2px; margin-left: auto; margin-right: auto; display: block; } .view.standing .liveticker-standing td.logo{ width: 50px; } .view.standing .liveticker-standing td.logo img{ width: 40px !important; height: 40px !important; } .liveticker-standing td.team{ text-align: left; } .liveticker-standing td.points { font-weight: bold; } .liveticker-standing img{ background: none; } .liveticker-standing .legend{ padding: 8px 0; } .liveticker-standing .legend div{ display: inline-block; position: relative; font-size: 11px; line-height: 15px; white-space: nowrap; margin-top: 5px; padding: 0 20px; } .liveticker-standing .legend div:before{ content: ""; display: block; position: absolute; width: 15px; height: 15px; left: 0; top: 0; } .liveticker-standing tr.color-1 td:first-child:after, .liveticker-standing tr.color-2 td:first-child:after, .liveticker-standing tr.color-3 td:first-child:after, .liveticker-standing tr.color-4 td:first-child:after, .liveticker-standing tr.color-5 td:first-child:after, .liveticker-standing tr.color-6 td:first-child:after, .liveticker-standing tr.color-7 td:first-child:after, .liveticker-standing tr.color-8 td:first-child:after, .liveticker-standing tr.color-9 td:first-child:after{ content: ""; position: absolute; width: 3px; height: 100%; top: 0; left: 0; } .liveticker-standing .legend .color-1:before, .liveticker-standing tr.color-1 td:first-child:after{ background: #7b6; } .liveticker-standing .legend .color-2:before, .liveticker-standing tr.color-2 td:first-child:after{ background: #9d7; } .liveticker-standing .legend .color-3:before, .liveticker-standing tr.color-3 td:first-child:after{ background: #78b5ff; } .liveticker-standing .legend .color-4:before, .liveticker-standing tr.color-4 td:first-child:after{ background: var(--border-color2); } .liveticker-standing .legend .color-5:before, .liveticker-standing tr.color-5 td:first-child:after{ background: var(--border-color2); } .liveticker-standing .legend .color-6:before, .liveticker-standing tr.color-6 td:first-child:after{ background: var(--border-color2); } .liveticker-standing .legend .color-7:before, .liveticker-standing tr.color-7 td:first-child:after{ background: #e89919; } .liveticker-standing .legend .color-8:before, .liveticker-standing tr.color-8 td:first-child:after{ background: #c44; } .liveticker-standing .legend .color-9:before, .liveticker-standing tr.color-9 td:first-child:after{ background: var(--border-color2); } .head2head{ width: 100%; margin: 12px auto 18px auto; } .head2head th{ font-weight: normal; font-size: 12px; color: #a0a1a2; border-bottom: 2px solid var(--red-gray); padding: 5px; } .head2head td{ position: relative; font-size: 14px; text-align: center; padding: 13px 6px; font-weight: bold; border-bottom: none; } .head2head .image{ margin: auto 6%; transform: skewX(-4.1deg); } .head2head .image img{ transform: skewX(4.1deg) scale(0.7); background: transparent; } .head2head tr{ position: relative; } .head2head .bar{ position: absolute; display: block; bottom: 1px; height: 9px; transform: skewX(-4.1deg); opacity: 0.85; background: #dab020; } .head2head .bar:first-child{ left: -51px; } .head2head .bar:last-child{ right: -51px; } .head2head .bar.green{ background: #049437; } .head2head .bar.red{ background: #c21515; } .head2head .label{ position: relative; z-index: 1; font-weight: normal; color: #a0a1a2; } .view.detail .col.main > .content > .box .text.headline{ padding-top: 1px; padding-bottom: 0; word-wrap: break-word; word-break: break-word; } .view.detail .col.main > .content > .box .text.headline h3{ margin-top: 27px; margin-bottom: -18px; font-weight: normal; font-size: 20px; line-height: 1.2em; } .view.detail .col.main > .content > .box > .text.body{ min-height: 300px; } .view.detail .col.main > .content > .box > .text.body .tags{ margin: 20px 0 25px 0; } .view.detail .col.main > .content > .box > .text.body .meta{ font-family: var(--default-font); font-size: 15px; line-height: 17px; font-weight: bold; padding-top: 17px; padding-bottom: 10px; } .view.detail .col.main > .content > .box > .text.body .meta > div{ border-bottom: 1px solid var(--border-color2); padding-top: 4px; padding-bottom: 18px; padding-right: 1%; } .view.detail .col.main > .content > .box > .text.body .meta .origin-icon{ float: left; background: none; margin-top: -4px; margin-right: 12px; margin-bottom: 6px; } .view.detail .col.main > .content > .box > .text.body .meta .desc{ font-weight: normal; } .view.detail .col.main > .content > .box > .text.body .meta .moment{ float: right; font-size: 14px; font-weight: normal; color: #9EA0A3; } .view.detail .col.main > .content > .box > .text.body a.link{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; color: var(--hover-color); max-width: 400px; } .view.detail .col.main > .content > .box > .text.body a.link:hover{ text-decoration: underline; } .view.detail .col.main > .content > .box > .text.body a.link i.icon-external{ vertical-align: top; margin-top: 4px; display: inline-block; color: var(--text-color); } .view.detail .col.main > .content > .box > .text.body a.link.ext i.icon-external{ margin-left: 6px; } .view.detail .col.main > .content > .box > .text.body a.link.int i.icon-external{ margin-right: 6px; } .view.detail .col.main > .content > .box > .text.body .readmore{ position: relative; left: 0; right: 0; height: 162px; margin-top: -111px; text-align: center; background: -moz-linear-gradient(top, var(--box-background-rgba-0) 0%, var(--box-background-rgba-85) 40%, var(--box-background-rgba-100) 100%); background: -webkit-linear-gradient(top, var(--box-background-rgba-0) 0%, var(--box-background-rgba-85) 40%, var(--box-background-rgba-100) 100%); background: linear-gradient(to bottom, var(--box-background-rgba-0) 0%, var(--box-background-rgba-85) 40%, var(--box-background-rgba-100) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); } .view.detail .col.main > .content > .box > .text.body .readmore .btn{ margin-top: 109px; } .view.detail .col.main > .content > .box > .text.body .readmore .btn .icon-external{ vertical-align: middle; margin-left: 4px; } .view.detail .col.main > .content .native_ad_inline div.promo{ font-family: var(--default-font); color: var(--text-color); padding: 12px 25px 0 7px; text-transform: uppercase; } .view.detail .col.main > .content .native_ad_inline ul{ margin: 0; } .view.detail .col.main > .content .native_ad_inline a{ font-family: var(--default-font); font-weight: bold; padding: 3px 7px 12px 0; display: block; } .view.detail .col.main > .content .native_ad_inline a:hover{ color: var(--hover-color); } .view.detail .col.main > .content .native_ad_inline .icon-external{ font-size: 12px; position: absolute; top: 11px; right: 7px; } .view.detail .col.main > .content .native_ad_inline a.int .icon-external{ display: none; } .view.detail .col.main > .content .article_native_ads{ display: -webkit-flex; display: -ms-flexbox; display: flex; justify-content: space-between; } .view.detail .col.main > .content .article_native_ads > .box{ width: 49%; display: inline-block; border: none; } .view.detail .col.main > .content .article_native_ads > .box > div{ position: relative; } .view.detail .col.main > .content .article_native_ads > .box h2{ margin: 0; font-size: 16px; } .view.detail .col.main > .content .article_native_ads > .box h3{ margin: 0; padding: 0; font-size: 13px; font-weight: normal; } .view.detail .col.main > .content .article_native_ads > .box.ext h3{ padding-right: 17px; } .view.detail .col.main > .content .article_native_ads > .box .icon-external { font-size: 12px; position: absolute; top: 0px; right: 0px; } .view.detail .col.main > .content .article_native_ads > .box.int .icon-external { display: none } .view.detail .col.main > .content .article_native_ads > .box:hover{ color: var(--hover-color); } @media screen and (max-width:640px), screen and (min-width:800px) and (max-width: 920px) { .view.detail .col.main > .content .article_native_ads{ display: block; } .view.detail .col.main > .content .article_native_ads > .box{ width: 100%; } } .box.teaser .text.body p a{ color: var(--hover-color); } .pl_slider_headline .tag, .box.teaser .tag, .box.transfer .tag{ font-family: var(--text-font); font-size: 13px; padding-top: 13px; display: inline-block; color: var(--text-color2); } .box.teaser .tag .tagicon, .box.transfer .tag .tagicon{ vertical-align: middle; margin-bottom: 6px; margin-right: 8px; background: transparent; } .box.teaser.article-type-social .tagicon{ border-radius: 50%; } .box.teaser.article-type-social .socialicon{ position: absolute; top: 16px; right: 15px; font-size: 22px; color: var(--hover-color); } .box.teaser.article-type-social .socialicon.icon-twitter{ color: var(--hover-color); } .box.teaser.article-type-social .socialicon.icon-youtube{ color: #c31e36; } .box.teaser.compact .tag .tagicon{ margin-top: 2px; margin-bottom: 4px; width: 24px; height: 24px; } .box.teaser .promohint{ position: absolute; top: 13px; right: 13px; color: var(--text-color2); text-transform: uppercase; font-family: var(--text-font); font-size: 13px; } .box.teaser .img{ margin-bottom: 0; } .box.teaser .text{ padding: 2px 0px 16px 0px; word-wrap: break-word; word-break: break-word; } .box.teaser.article-type-live.match.past .text{ padding-bottom: 15px; } .box.teaser .meta{ font-size: 12px; padding: 9px 2px; color: #9EA0A3; } .box.teaser.article-type-social .meta .origin i{ margin-right: 3px; } .box.teaser .moment{ float: right; padding-bottom: 8px; } .box.teaser .tag .phold{ width: 100px; height: 5px; } .box.teaser .text .phold{ display: block; margin: 15px 0 23px 0; } .box.teaser .text .phold:last-child{ margin-bottom: 10px; } .box.teaser .text h2, .box.teaser .text h2 p, .view.home .col.right .box .text h3{ margin: 0; } .box.teaser.article-type-live .text h2{ margin-top: 8px; margin-bottom: 5px; } .col .box.teaser2 .meta{ font-size: 12px; padding: 0 2px 17px 2px; color: #9EA0A3; } .col .box.teaser3 .meta{ font-size: 12px; padding: 0 2px 17px 17px; color: #9EA0A3; bottom: 0; position: absolute; left: 50%; } @media screen and (max-width: 799px){ .col .box.teaser3 .meta{ padding: 0 2px 15px 12px; bottom: auto; position: relative; left: 0%; } } .col .box.teaser2 .moment, .col .box.teaser3 .moment{ color: #9EA0A3; } .col .box.teaser2:not(.col-50) .moment:before, .col .box.teaser3 .moment:before{ content: '|'; margin: 0 10px; } .view.home .col.main .box.article-type-quote .text h2 p{ font-size: 60%; line-height: 150%; font-weight: normal; font-style: italic; font-family: var(--text-font); padding-right: 3%; } .view.home .col.main .box.article-type-quote .text h2 p strong{ font-size: 120%; line-height: 120%; } .view.home .col.right .box .text h3{ padding-right: 11px; position: relative; } .col .livenow .box.sphd-teaser{ background: #111; color: #fff; } .col .box.sphd-teaser .icon-external{ font-size: 12px; position: absolute; top: 0px; right: 0px; } .col .box.teaser.compact.with-img{ min-height: 148px; padding-bottom: 10px; } .col .box.teaser.compact img.thumb{ float: left; margin: 13px 15px 3px 1px; } .col .box.teaser.compact .text{ padding-bottom: 35px; } .col .box.teaser.compact.with-img .text{ padding-left: 135px; padding-bottom: 28px; } .col .box.teaser.compact .text h2{ font-size: 26px; } .col .box.teaser.compact .meta{ position: absolute; bottom: -5px; right: 14px; left: 13px; } .col .box .moment{ font-family: var(--default-font); font-size: 13px; text-align: right; color: var(--text-color); } .col.right .box .moment{ font-size: 12px; text-align: right; margin-bottom: 0.2em; color: #9EA0A3; } .col .box.thumb .moment{ font-size: 10px; position: absolute; right: 11px; bottom: 4px; z-index: 1; color: #9EA0A3; } .col .box.liveticker-teaser .moment{ position: absolute; right: 11px; bottom: 0px; left: 50%; width: 100px; margin-left: -50px; text-align: center; z-index: 1; } .col .box.liveticker-teaser .moment span{ font-size: 10px; padding: 1px 10px; text-align: center; background: var(--border-color); border-radius: 8px 8px 0 0; } .col .box.liveticker-teaser .moment span i{ font-style: normal; } .col .box.liveticker-teaser .moment.live span{ background: var(--highlight); color: #fff; } .playoverlay{ position: absolute; top: 50%; left: 50%; font-size: 80px; margin: -40px 0 0 -40px; color: rgba(255,255,255,0.75); text-shadow: 0 1px 25px rgba(50,60,70,0.64); color: #fff; cursor: pointer; z-index: 1; transition: color 200ms ease-in-out; } .box.article .playoverlay{ font-size: 100px; margin: -50px 0 0 -50px; } .box.teaser2 .playoverlay{ top: 36px; left: 36px; font-size: 40px; margin: -20px 0 0 -20px; } @media screen and (max-width:800px){ .box.teaser2 .playoverlay{ top: 30px; left: 30px; font-size: 36px; margin: -18px 0 0 -18px; } } .box.sphd-teaser .playoverlay{ font-size: 60px; margin: -30px 0 0 -30px; } div.img:hover > .playoverlay, .playoverlay:hover{ color: rgba(56, 151, 240, 0.8); color: var(--hover-color); } .col a .box.sphd-teaser img{ transition: transform 3.5s cubic-bezier(0.19,1,.22,1); } .col a:hover .box.sphd-teaser img{ -webkit-transform: scale(1.1) rotate(0.02deg)!important; -ms-transform: scale(1.1) rotate(0.02deg)!important; -o-transform: scale(1.1) rotate(0.02deg)!important; transform: scale(1.1) rotate(0.02deg)!important; } .article .subarticle .box.teaser{ border-bottom: none; min-height: auto !important; padding-bottom: 0 !important; } .article .subarticle:first-child .box.teaser{ } .subarticle .box.teaser .tag, .subarticle .box.teaser .meta{ display: none; } .subarticle .box.teaser .text{ min-height: 100px; display: flex; align-items: center; justify-content: flex-start; padding: 0 !important; } .subarticle .box.teaser.compact .text h2{ font-size: 22px; } .subarticle .box.teaser.compact img.thumb{ margin-top: 0; width: 100px; height: 100px; } .videoarticlehint{ position: absolute; top: 0; right: 0; font-size: 15px; text-shadow: 0 1px 25px rgba(50,60,70,0.4); color: #fff; color: rgba(255,255,255,0.85); cursor: pointer; z-index: 1; background: rgba(0,0,0,0.5); background: -moz-linear-gradient(66deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); background: -webkit-linear-gradient(66deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); background: linear-gradient(66deg, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); padding: 6px 9px 6px 10px; font-style: italic; } .videoarticlehint i{ font-size: 20px; vertical-align: sub; margin-right: 1px; } @media screen and (max-width:800px) { h1{ font-size: 31px; } h2{ font-size: 24px; } h3{ font-size: 18px; } .view.detail .col.main > .content > .box > .text.headline h3{ font-size: 17px; } .box.teaser .tag{ max-width: calc(100% - 120px); text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .col .box.teaser.compact img.thumb{ width: 100px; height: 100px; } .col .box.teaser.compact.with-img .text{ padding-left: 115px; } .col .box.teaser.compact .text h2{ font-size: 20px; } .col .subarticle .box.teaser.compact .text h2{ font-size: 18px; } .playoverlay, .box.article .playoverlay{ font-size: 60px; margin: -30px 0 0 -30px; } } @media screen and (min-width:800px) { .tabnav{ background: transparent; padding: 0 10px; } .tabnav .tab span, .tabnav .tab.active span{ display: block; padding: 2px; border-bottom: 1px solid var(--border-color); } .tabnav .tab{ opacity: 1; text-align: left; border: none; background: transparent; } .tabnav .tab[data-col="left"], .tabnav .tab[data-col="right"]{ flex: none; width: 320px; } .tabnav .tab[data-col="main"]{ padding-left: 20px; } .tabnav .tab[data-col="right"]{ display: none; } .view .cols{ display: flex; } .col.side{ width: 340px; } .col.main{ flex: 1; align-self: start; } .col{ display: inline-block; } .view.detail .col.main{ margin-left: 330px; } .col .box{ margin: 10px; } .col .box.teaser.compact.with-img .meta{ left: 147px; } .col .content a.link:hover, .col .box.livenow .text a.link:hover, .col .box.thumb:hover .text, .col .box.liveticker-teaser:hover .text, .col .box.transfer a:hover h2, .col .box.teaser a:hover .text h2, .col .box.teaser a:hover .text h3, .col .box.sphd-teaser:hover .text h3, .liveticker-nav div.date-current:hover, .linkbox a:hover{ color: var(--hover-color); } } @media screen and (min-width:930px) { .view.detail .col.main > .content > .box > .text{ width: 610px; } .view.detail .col.main > .content > .box > .text.headline{ padding-left: 2%; padding-right: 2%; } } @media screen and (min-width:800px) and (max-width:980px) { .view.detail .col.main > .content > .box > .text{ width: calc(100vw - 360px); } .view.detail .col.main .bannerspot{ max-width: calc(100vw - 350px); margin-left: 10px; } } @media screen and (min-width:800px) and (max-width:1199px) { .col.side.right{ display: none; } } @media screen and (min-width:1200px) { .tabnav .tab[data-col="main"]{ padding: 0 20px; } .tabnav .tab[data-col="right"]{ display: block; } .over-view{ margin: 0 10px; } .breadcrump{ padding-left: 0; } .wrapper{ padding: 0 20px; } .view.detail .col.side.left{ left: 30px; } .view.detail .col.main{ margin-left: 340px; } .view.detail .col.main > .content > .box > .text{ width: 100%; padding-left: 18%; padding-right: 15%; } .view.detail .col.main > .content > .box > .text.headline{ width: 100%; padding-left: 12%; padding-right: 11%; } } @media screen and (min-width:1440px) { .wrapper{ padding: 0; } .view.detail .col.side.left{ left: calc((100% - 1440px) / 2); } } .scroll-indicator{ background: var(--highlight); position: absolute; bottom: 0px; right: 0px; width: 3px; height: 100%; max-height: 100%; z-index: 2; opacity: 0; transition: opacity 200ms ease-in-out; } .scroll-indicator.active{ opacity: 1; } .scroll-indicator.bg{ background: rgba(195, 30, 54, .2); height: 100% !important; } blockquote{ border-left: 5px solid var(--highlight); padding-left: 15px; margin-left: 10px; font-style: italic; } blockquote strong{ font-size: 120%; line-height: 120%; } hr{ display: block; height: 1px; border: 0; border-top: 1px solid var(--border-color2); } .tabbar{ position: fixed; bottom: 0px; width: 100%; height: 53px; height: calc(53px + env(safe-area-inset-bottom)); display: flex; background: var(--box-background-rgba-85); background: linear-gradient(to bottom, var(--box-background-rgba-100) 0%, var(--box-background-rgba-85) 100%); box-shadow: 0 0 7px rgba(22,25,27,0.5); color: var(--text-color); transform: translateZ(0); -webkit-transform: translateZ(0); z-index: 10001; padding-bottom: constant(safe-area-inset-bottom); padding-bottom: env(safe-area-inset-bottom); padding: 0 1.5% 0 1.8%; box-sizing: border-box; } body.myfeedopen .tabbar, body.mmopen .tabbar{ background: var(--box-background); } .tabbar .tab{ flex: 1; text-align: center; font-size: 12px; line-height: 15px; padding: 7px; color: var(--text-color); cursor: pointer; margin-bottom: constant(safe-area-inset-bottom); margin-bottom: env(safe-area-inset-bottom); } body.mmopen .tabbar .tab.active[data-id="settings"], body.myfeedopen .tabbar .tab.active[data-id="myfeed"], body.mmopen .tabbar .tab.active[data-id="sport"]{ background-color: var(--highlight); color: #fff; } .tabbar .tab i{ font-size: 24px; } .tabbar .tab.active div{ text-shadow: 0 2px 4px rgba(0,0,0,.25); } .tabbar .tab i.icon-menu{ font-size: 38px; line-height: 41px; } .tabbar .tab[data-id="watch"]{ padding-top: 5px; } .tabbar .tab[data-id="watch"] i{ font-size: 26px; } .tabbar .tab[data-id="settings"]{ padding-top: 8px; } .tabbar .tab[data-id="settings"] i{ font-size: 22px; } .footer { position: absolute; right: 0; bottom: 0; left: 0; animation: footer-reveal 1.5s ease-out; } .footerbar{ padding: 1rem; background-color: #2b2c2d; color: #fff; text-align: center; } @media screen and (max-width:640px) { .footerbar{ text-align: left; } } body[data-view="detail"] .footer{ opacity: 0; display: none !important; } body[data-view="detail"] .footer.reveal{ opacity: 1; display: block !important; animation: footer-reveal 1.5s ease-out; } @keyframes footer-reveal{ 0% { opacity: 0; display: none !important; } 90% { opacity: 0; display: block !important; } 100% { opacity: 1; display: block !important; } } body[data-widget="startsite"]:not([data-view="channel"]) .footer{ position: relative; left: 0; right: 0; height: 250px; margin-top: -241px; z-index: 1; text-align: center; background: -moz-linear-gradient(top, rgba(237,238,240,0) 0%, rgba(237,238,240,1) 59%); background: -webkit-linear-gradient(top, rgba(237,238,240,0) 0%, rgba(237,238,240,1) 59%); background: linear-gradient(to bottom, rgba(237,238,240,0) 0%, rgba(237,238,240,1) 59%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00edeef0', endColorstr='var(--background)',GradientType=0 ); } body[data-widget="startsite"] .footer .btn{ margin-top: 144px; box-shadow: 0 0 50px 50px rgba(237,238,240,0.85); } body[data-widget="startsite"] .footer .btn .icon-small-right{ margin-right: 5px; } .preloader { position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: 13499; / -webkit-animation: preloader 250ms ease-in; animation: preloader 250ms ease-in; transform: translateZ(0); -webkit-transform: translateZ(0); } @-webkit-keyframes preloader { 0% { opacity: 0.5; } 100% { opacity: 0.8; } } @keyframes preloader { 0% { opacity: 0.5; } 100% { opacity: 0.8; } } .preloader.hide{ -webkit-animation: preloader-hide 500ms ease-in 500ms; animation: preloader-hide 500ms ease-in 500ms; } @-webkit-keyframes preloader-hide { 0% { opacity: 0.8; } 100% { opacity: 0; } } @keyframes preloader-hide { 0% { opacity: 0.8; } 100% { opacity: 0; } } .preloader .preloader-indicator { position: absolute; right: 12px; bottom: 12px; width: 43px; height: 43px; padding: 10px; font-size: 23px; color: #fff; border-radius: 22px; background: rgba(44, 44, 45, 0.8); z-index: 13500; -webkit-animation: preloader-indicator 250ms ease-in; animation: preloader-indicator 250ms ease-in; } @-webkit-keyframes preloader-indicator { 0% { -webkit-transform: scale(0.5); } 100% { -webkit-transform: scale(1); } } @keyframes preloader-indicator { 0% { transform: scale(0.5); } 100% { transform: scale(1); } } @font-face { font-family: 'icomoon'; src: url('../fonts/icomoon.eot?v11'); src: url('../fonts/icomoon.eot?v11#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?v11') format('truetype'), url('../fonts/icomoon.woff?v11') format('woff'), url('../fonts/icomoon.svg?v11#icomoon') format('svg'); font-weight: normal; font-style: normal; } [class^="icon-"], [class*=" icon-"] { font-family: 'icomoon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-list:before { content: "\f03a"; } .icon-card:before { content: "\e907"; } .icon-info:before { content: "\e904"; } .icon-megaphone:before { content: "\e908"; } .icon-swap:before { content: "\e906"; } .icon-like:before { content: "\e905"; } .icon-text:before { content: "\e902"; } .icon-add:before { content: "\e145"; } .icon-arrow-left:before { content: "\e5c4"; } .icon-arrow-right:before { content: "\e5c8"; } .icon-check:before { content: "\e5ca"; } .icon-offline:before { content: "\e2c1"; } .icon-refresh:before { content: "\e627"; } .icon-mail:before { content: "\e0e1"; } .icon-replay:before { content: "\e042"; } .icon-share2:before { content: "\e903"; } .icon-grid:before { content: "\e5c3"; } .icon-close:before { content: "\e5cd"; } .icon-hot:before { content: "\e80e"; } .icon-watch:before { content: "\e639"; } .icon-menu:before { content: "\e5d2"; } .icon-more2:before { content: "\e5d3"; } .icon-more:before { content: "\e5d4"; } .icon-search:before { content: "\e8b6"; } .icon-share:before { content: "\e80d"; } .icon-play:before { content: "\f04b"; } .icon-left:before { content: "\f053"; } .icon-right:before { content: "\f054"; } .icon-up:before { content: "\f077"; } .icon-down:before { content: "\f078"; } .icon-external:before { content: "\f08e"; } .icon-scores:before { content: "\f091"; } .icon-facebook2:before { content: "\f09a"; } .icon-filter:before { content: "\f0b0"; } .icon-bell:before { content: "\f0f3"; } .icon-plus:before { content: "\f0fe"; } .icon-small-left:before { content: "\f104"; } .icon-small-right:before { content: "\f105"; } .icon-small-up:before { content: "\f106"; } .icon-small-down:before { content: "\f107"; } .icon-dot-o:before { content: "\f10c"; } .icon-dot:before { content: "\f111"; } .icon-shield:before { content: "\f132"; } .icon-sport:before { content: "\f1e3"; } .icon-profil:before { content: "\f2c0"; } .icon-home:before { content: "\e901"; } .icon-listen:before { content: "\e910"; } .icon-calendar:before { content: "\e953"; } .icon-display:before { content: "\e956"; } .icon-mobile:before { content: "\e958"; } .icon-tablet:before { content: "\e959"; } .icon-comments:before { content: "\e970"; } .icon-spinner2:before { content: "\e97b"; } .icon-spinner:before { content: "\e97f"; } .icon-settings:before { content: "\e994"; } .icon-star:before { content: "\e9d9"; } .icon-happy:before { content: "\e9df"; } .icon-play2:before { content: "\ea15"; } .icon-sound:before { content: "\ea27"; } .icon-trend-up:before { content: "\ea3b"; } .icon-trend-no:before { content: "\ea3c"; } .icon-trend-down:before { content: "\ea3d"; } .icon-embed:before { content: "\ea7f"; } .icon-facebook:before { content: "\ea91"; } .icon-instagram:before { content: "\ea92"; } .icon-whatsapp:before { content: "\ea93"; } .icon-twitter:before { content: "\ea96"; } .icon-youtube:before { content: "\ea9d"; } .icon-apple:before { content: "\eabe"; } .icon-android:before { content: "\eac0"; } .icon-linkedin:before { content: "\eac9"; } .icon-tiktok:before { content: "\e909"; } .icon-messenger:before { content: "\e900"; } .icon-homepage:before { content: "\e901"; } div.social{ text-align: center; padding-top: 5px; } body.screen-small div.social, body.screen-medium div.social{ position: static !important; } div.social a.social{ color: #6c6d6f; background-color: #fff; border: 1px solid #6c6d6f; display: inline-block; font-size: 17px; line-height: 34px; text-align: center; width: 13%; height: 34px; margin: 2px 4px; transition: background-color 200ms ease-in-out; padding-top: 2px; } div.social a.social:hover{ background-color: #fafbfc; } div.social a.social[data-platform="facebook"]{ color: #fff; background-color: #3b5998; border-color: #3b5998; } div.social a.social[data-platform="facebook"]:hover{ background-color: #4d6baa; border-color: #4d6baa; } div.social a.social[data-platform="twitter"]{ color: #fff; background-color: #1da1f2; border-color: #1da1f2; } div.social a.social[data-platform="twitter"]:hover{ background-color: #2db1ff; border-color: #2db1ff; } div.social a.social[data-platform="messenger"]{ color: #fff; background-color: #3b5998; border-color: #3b5998; } div.social a.social[data-platform="messenger"]:hover{ background-color: #4d6baa; border-color: #4d6baa; } div.social a.social[data-platform="whatsapp"]{ background: #43d854; border-color: #43d854; color: #fff; } div.social a.social[data-platform="whatsapp"]:hover{ background: #53e864; border-color: #53e864; } div.social a.social[data-platform="mail"]{ background: #6c6d6f; color: #fff; } div.social a.social[data-platform="mail"]:hover{ background: #7c7d7f; border-color: #7c7d7f; } div.social a.social[data-platform="comments"]{ border-color: #a9aaab; color: #a9aaab; } div.social a.social[data-platform="comments"]:hover{ color: var(--text-color); } @media screen and (min-width:1201px) { div.social{ position: absolute; left: 10%; top: 8px; width: 34px; } div.social a.social{ margin: 4px; width: 34px; } } .view.detail .col.main .box .text .btn.comments{ margin: 24px auto 12px auto; display: block; width: 45%; min-width: 170px; } .spinning{ position: absolute; -webkit-animation: spinning 2s infinite linear; animation: spinning 2s infinite linear; } @-webkit-keyframes spinning{ 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); } } @keyframes spinning{ 0% { transform: rotate(0deg); } 100% { transform: rotate(359deg); } } #comments{ position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,10,20,0.5); z-index: 100; transform: translateZ(0); -webkit-transform: translateZ(0); } #comments.hide{ animation: comments-fadeout 400ms ease-out; } @keyframes comments-fadeout{ 0% { opacity: 1 } 100% { opacity: 0 } } #comments .comments-bg{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 0.25; animation: comments-fadein 350ms ease-out; background-color: #1d1e1f; } @keyframes comments-fadein{ 0% { opacity: 0 } 100% { opacity: 0.25 } } #comments .comments-box{ position: absolute; top: 60px; left: 50%; background: #fff; padding: 10px 15px 0 15px; margin-left: -290px; border-radius: 3px; animation: comments-slidein 350ms ease-out; box-shadow: 0 0 250px rgba(0,10,20,0.8); } @keyframes comments-slidein{ 0% { transform: translateY(-100px); opacity: 0.5 } 100% { transform: translateY(0); opacity: 1 } } #comments.hide .comments-box{ animation: comments-slideout 400ms ease-out; } @keyframes comments-slideout{ 0% { transform: translateY(0); } 100% { transform: translateY(-100px); } } @media screen and (max-width:580px) { #comments .comments-box{ top: 0; left: 0; right: 0; max-height: 100%; margin-left: 0; border-radius: 0; } } #comments .icon-close{ position: absolute; top: 12px; right: 12px; color: #babbbc; cursor: pointer; } #comments h2{ max-width: 100%; width: 550px; margin: 0; padding: 11px 20px 10px 8px; } #comments .comments-body{ position: relative; max-height: calc(100vh - 220px); overflow-y: scroll; overflow-y: auto; } #comments .icon-spinner{ position: absolute; top: 40%; left: 50%; font-size: 26px; margin: -13px 0 0 -13px; width: 26px; z-index: 1; } #hint{ position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,10,20,0.5); z-index: 10002; transform: translateZ(0); -webkit-transform: translateZ(0); } #hint.hide{ animation: hint-fadeout 400ms ease-out; } @keyframes hint-fadeout{ 0% { opacity: 1 } 100% { opacity: 0 } } #hint .hint-bg{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 0.55; animation: hint-fadein 350ms ease-out; background-color: #1d1e1f; } @keyframes hint-fadein{ 0% { opacity: 0 } 100% { opacity: 0.25 } } #hint .hint-box{ position: absolute; top: 60px; left: 50%; background: var(--box-background); padding: 10px 15px 0 15px; margin-left: -290px; width: 580px; border-radius: 3px; animation: hint-slidein 350ms ease-out; box-shadow: 0 0 250px rgba(0,10,20,0.8); } @keyframes hint-slidein{ 0% { transform: translateY(-100px); opacity: 0.5 } 100% { transform: translateY(0); opacity: 1 } } #hint.hide .hint-box{ animation: hint-slideout 400ms ease-out; } @keyframes hint-slideout{ 0% { transform: translateY(0); } 100% { transform: translateY(-100px); } } @media screen and (max-width:580px) { #hint .hint-box{ top: 0; left: 0; right: 0; width: 100%; max-height: 100%; margin-left: 0; border-radius: 0; } } #hint .icon-close{ position: absolute; top: 0; right: 0; padding: 12px; color: #babbbc; cursor: pointer; } #hint h2{ max-width: 100%; width: 550px; margin: 0; padding: 11px 20px 10px 8px; } #hint .hint-body{ position: relative; max-height: calc(100vh - 220px); overflow-y: scroll; overflow-y: auto; padding: 0 8px 20px 8px; } @media screen and (max-width:580px) { #hint .hint-body{ max-height: calc(100vh - 35px); } } #hint.dark{ background: rgba(235,245,255,0.5); } #hint.dark .hint-box{ background: #000; color: #fff; } #lightframe{ position: fixed; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,10,20,0.5); z-index: 10002; transform: translateZ(0); -webkit-transform: translateZ(0); } #lightframe.hide{ animation: lightframe-fadeout 400ms ease-out; } @keyframes lightframe-fadeout{ 0% { opacity: 1 } 100% { opacity: 0 } } #lightframe .lightframe-bg{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 0.25; animation: lightframe-fadein 350ms ease-out; background-color: #1d1e1f; } @keyframes lightframe-fadein{ 0% { opacity: 0 } 100% { opacity: 0.25 } } #lightframe .lightframe-box{ position: absolute; top: 60px; left: 50%; background: #fff; padding: 10px 15px 0 15px; margin-left: -290px; border-radius: 3px; animation: lightframe-slidein 350ms ease-out; box-shadow: 0 0 250px rgba(0,10,20,0.8); } @keyframes lightframe-slidein{ 0% { transform: translateY(-100px); opacity: 0.5 } 100% { transform: translateY(0); opacity: 1 } } #lightframe.hide .lightframe-box{ animation: lightframe-slideout 400ms ease-out; } @keyframes lightframe-slideout{ 0% { transform: translateY(0); } 100% { transform: translateY(-100px); } } @media screen and (max-width:580px) { #lightframe .lightframe-box{ top: 0; left: 0; right: 0; max-height: 100%; margin-left: 0; border-radius: 0; } } #lightframe .icon-close{ position: absolute; top: 12px; right: 12px; color: #babbbc; cursor: pointer; } .bannerspot{ line-height: 0; text-align: center; max-width: 100%; overflow: hidden; position: relative; align-items: center; justify-content: center; } body:not(.isPhonegap):not([data-widget="startsite"]):not([data-view="channel"]):not([data-view="match"]):not([data-videos="1"]) .bannerspot[data-adkey="top"]:not(.noads){ min-height: 250px; } .col.side.left .bannerspot{ min-width: 320px; } .col.side.left .bannerspot.fixed{ position: fixed; top: 95px; } .bannerspot.adm-empty:not([data-adkey="top"]), .bannerspot.toload:not([data-adkey="top"]){ display: none!important; } .bannerspot.loading{ animation: bannerspot-reveal 0.5s ease-out; animation-delay: 0.5s; opacity: 0; animation-fill-mode: forwards; } .bannerspot.loading:not([slot="IAV_1"]){ display: flex; } @keyframes bannerspot-reveal{ 0% { opacity: 0; } 100% { opacity: 1; } } .bannerspot[data-adkey="footer"] .banner{ width: 95% !important; max-width: 1080px; overflow: auto !important; display: inline-block !important; opacity: 1 !important; position: inherit !important; transition: inherit !important; margin: 0 auto 15px auto; } .view.home .instagram-media{ margin: 0 !important; border: none !important; width: 100% !important; } .title_sep{ font-family: var(--default-font); padding-bottom: 3px; border-bottom: 1px solid var(--border-color2); margin-top: 20px; padding-bottom: 3px; } .videostage_title{ margin-bottom: 10px; } .bannerspot[data-adkey="after_article"] .banner{ border-top: 1px solid var(--border-color2); padding-top: 20px; margin-top: 20px; } .liveticker-teaser{ position: relative; overflow: hidden; } .liveticker-teaser .sport-label{ font-size: 12px; font-weight: normal; } .liveticker-teaser .name{ overflow: hidden; font-size: 14px; font-weight: normal; white-space: nowrap; z-index: 1; } .liveticker-teaser .name.none{ font-size: 14px; } .liveticker-teaser .name.home{ padding-left: 0; text-align: right; } .liveticker-teaser .name.away{ padding-right: 0; text-align: left; } .liveticker-teaser .namebg{ position: absolute; font-size: 110px; color: rgba(0,0,0,0.075); top: 28px; z-index: 3; display: none; } .liveticker-teaser .namebg.home{ left: 0%; } .liveticker-teaser .namebg.away{ left: 50%; } @media screen and (min-width:800px){ .liveticker-teaser .namebg{ font-size: 160px; } .liveticker-teaser .namebg.home{ left: 8%; } .liveticker-teaser .namebg.away{ left: 57%; } } .liveticker-teaser:before, .liveticker-teaser:after{ content: ' '; position: absolute; top: 0; bottom: 0; width: 8px; z-index: 2; } .liveticker-teaser:before { left: 0; background: -moz-linear-gradient(left, var(--box-background-rgba-100) 10%, var(--box-background-rgba-0) 100%); background: -webkit-linear-gradient(left, var(--box-background-rgba-100) 10%, var(--box-background-rgba-0) 100%); background: linear-gradient(to right, var(--box-background-rgba-100) 10%, var(--box-background-rgba-0) 100%); } .liveticker-teaser:after { right: 0; background: -moz-linear-gradient(right, var(--box-background-rgba-100) 10%, var(--box-background-rgba-0) 100%); background: -webkit-linear-gradient(right, var(--box-background-rgba-100) 10%, var(--box-background-rgba-0) 100%); background: linear-gradient(to left, var(--box-background-rgba-100) 10%, var(--box-background-rgba-0) 100%); } .liveticker-teaser.type-tennis table{ width: 90%; margin: 5px auto; border-collapse: separate; border-spacing: 2px; } .liveticker-teaser.type-tennis th{ text-align: left; font-weight: normal; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding-right: 10px; } .liveticker-teaser.type-tennis img{ width: 30px; margin-right: 10px; margin-top: -4px; } .liveticker-teaser.type-tennis td{ width: 20px; font-weight: bold; background: var(--border-color2); } .liveticker-teaser.type-tennis tr:first-child td:nth-child(2){ border-radius: 6px 0 0 0; } .liveticker-teaser.type-tennis tr:last-child td:nth-child(2){ border-radius: 0 0 0 6px; } .liveticker-teaser.type-tennis tr:first-child td:last-child{ border-radius: 0 6px 0 0; } .liveticker-teaser.type-tennis tr:last-child td:last-child{ border-radius: 0 0 6px 0; } .match_group_head .liveticker-teaser.type-team .image{ position: absolute; width: 48px; height: 48px; top: 12px; z-index: 2; background: var(--box-background); } .match_group_head .liveticker-teaser.type-team .image.home{ left: 12px; box-shadow: 10px 0 10px -5px var(--box-background); } .match_group_head .liveticker-teaser.type-team .image.away{ right: 12px; box-shadow: -10px 0 10px -5px var(--box-background); } .match_group_head .liveticker-teaser.type-team img{ width: 48px; } .match_group_head .liveticker-teaser.type-team .name.home{ padding-left: 48px; } .match_group_head .liveticker-teaser.type-team .name.away{ padding-right: 48px; } .match.match_group_head .liveticker-teaser.type-team .image{ top: 12px; } @media screen and (min-width:800px) { .match_group_head .liveticker-teaser:before, .match_group_head .liveticker-teaser:after{ display: none; } .match_group_head .liveticker-teaser.type-team .name{ font-size: 17px; line-height: 19px; font-weight: bold; } .match_group_head .liveticker-teaser.type-team .image{ position: absolute; width: 100px; height: 100px; overflow: hidden; } .match_group_head .liveticker-teaser.type-team .image.home{ top: 0px; left: -13px; } .match_group_head .liveticker-teaser.type-team .image.away{ bottom: 0; right: -13px; } .match_group_head .liveticker-teaser.type-team .image:before{ content: ' '; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-position: center center; background-repeat: no-repeat; background-size: 100%; z-index: 1; } .match_group_head .liveticker-teaser.type-team .image.home:before{ background-image: url('https://sportal.s3.amazonaws.com/media/web/teammask_home.png'); } .match_group_head .liveticker-teaser.type-team .image.away:before{ background-image: url('https://sportal.s3.amazonaws.com/media/web/teammask_away.png'); } body.dark .match_group_head .liveticker-teaser.type-team .image.home:before{ background-image: url('https://sportal.s3.amazonaws.com/media/web/teammask_home_dark.png'); } body.dark .match_group_head .liveticker-teaser.type-team .image.away:before{ background-image: url('https://sportal.s3.amazonaws.com/media/web/teammask_away_dark.png'); } .match_group_head .liveticker-teaser.type-team .image img{ position: absolute; width: 124px; height: 124px; max-width: none !important; background: #f0f1f2; } .match_group_head .liveticker-teaser.type-team .image.home img{ top: -23px; left: -22px; } .match_group_head .liveticker-teaser.type-team .image.away img{ top: -12px; right: -26px; } .match_group_head .liveticker-teaser.type-tennis th{ font-size: 16px; } .match.match_group_head .liveticker-teaser.type-team .image.home{ top: 0; left: 0; } } .liveticker-teaser .result{ font-size: 23px; } .liveticker-teaser .result.chars3{ font-size: 22px; } .liveticker-teaser .result.chars4{ font-size: 20px; } .liveticker-teaser .result.chars5{ font-size: 18px; } .liveticker-teaser .result.chars6{ font-size: 16px; } .liveticker-teaser .result.chars7{ font-size: 15px; } .liveticker-subheading, .liveticker-sport.box{ text-align: center; font-weight: bold; font-size: 18px; text-transform: uppercase; background: transparent; max-width: 940px; margin-top: 20px; margin-bottom: -5px; text-shadow: 0 1px 0 var(--box-background); box-shadow: none !important; border: none; } .liveticker-teaser.micro{ color: var(--text-color); } .liveticker-teaser.mdall .result, .liveticker-teaser.micro .result{ font-size: 15px; display: inline-block; padding: 0 10px; color: var(--text-color2); } .col .box.liveticker-subheading{ margin-top: 25px; margin-bottom: 0; box-shadow: none !important; border: none; } .col .box.liveticker-liga{ text-align: center; font-size: 12px; text-transform: uppercase; max-width: 940px; margin-top: 15px; margin-bottom: 10px; background: transparent; text-shadow: 0 1px 0 var(--box-background); box-shadow: none !important; border: none; } .col .box.liveticker-liga img{ background: transparent; object-fit: contain; } .liveticker-nav{ text-align: center; display: flex; position: relative; margin: 10px; background: var(--box-background); border-bottom: 1px solid var(--border-color2); z-index: 1; } .liveticker-nav div.date-current{ flex: 1 100%; padding: 11px; cursor: pointer; } .liveticker-nav div.date-current .icon-small-down{ display: inline-block; vertical-align: middle; margin-top: -1px; margin-left: 2px; opacity: 0.66; transition: opacity 200ms ease-in-out; } .liveticker-nav div.date-current:hover .icon-small-down{ opacity: 1; } .liveticker-nav.placeholder div.date-current .icon-small-down{ opacity: 0.3; } .liveticker-nav div.date-prev, .liveticker-nav div.date-next{ flex: 1 auto; line-height: 19px; padding: 11px 16px; opacity: 0.66; transition: opacity 200ms ease-in-out; cursor: pointer; } .liveticker-nav div.date-prev:hover, .liveticker-nav div.date-next:hover{ opacity: 1; } .liveticker-nav.placeholder div.date-prev, .liveticker-nav.placeholder div.date-next{ opacity: 0.4; } .liveticker-nav div.date-prev{ border-right: 1px solid var(--background); } .liveticker-nav div.date-next{ border-left: 1px solid var(--background); } .liveticker-board-nav{ color: #fff; background: #2b2c2d; float: left; width: 79px; height: 85px; padding: 17px 0; text-align: center; } .liveticker-board-nav .date-prev, .liveticker-board-nav .date-next{ display: inline-block; padding: 13px 11px; cursor: pointer; } .liveticker-board-nav .date-prev:hover, .liveticker-board-nav .date-next:hover{ color: var(--hover-color); } .liveticker-board{ display: block; position: relative; padding: 0; overflow: hidden; height: 90px; margin: 7px auto -6px auto; } .liveticker-board .content.row{ white-space: nowrap; overflow-x: scroll; overflow-y: hidden; padding: 0 10px 10px 10px; text-align: center; vertical-align: top; -webkit-overflow-scrolling: touch; } .view.home .col.main .liveticker-board .content.row .box, .liveticker-board .content.row .box{ margin: 0 1px 0 0; padding: 0 ; border-top: none; vertical-align: top; } .liveticker-board .content.row .box:first-child{ margin-left: 0px; } .liveticker-board .content.row .box:last-child{ margin-right: 0px; } .liveticker-board:before{ content: ' '; position: absolute; top: 0; bottom: 0; left: 0px; width: 12px; background: -moz-linear-gradient(left, var(--background-rgba-100) 0%, var(--background-rgba-0) 100%); background: -webkit-linear-gradient(left, var(--background-rgba-100) 0%, var(--background-rgba-0) 100%); background: linear-gradient(to right, var(--background-rgba-100) 0%, var(--background-rgba-0) 100%); z-index: 4; } .liveticker-board:after{ content: ' '; position: absolute; top: 0; bottom: 0; right: 0px; width: 12px; background: -moz-linear-gradient(right, var(--background-rgba-100) 0%, var(--background-rgba-0) 100%); background: -webkit-linear-gradient(right, var(--background-rgba-100) 0%, var(--background-rgba-0) 100%); background: linear-gradient(to left, var(--background-rgba-100) 0%, var(--background-rgba-0) 100%); z-index: 4; } .liveticker-board .liveticker-teaser{ display: inline-block; width: 35%; min-width: 140px; max-width: 200px; } .liveticker-board .liveticker-teaser .title{ background: var(--box-title-background); color: var(--box-background); font-size: 11px; text-align: center; padding: 2px; position: relative; z-index: 3; } .liveticker-board .liveticker-teaser img{ width: 26px; } .col.liveticker-board .box.liveticker-teaser .text{ min-height: 66px; padding-top: 3px; font-size: 13px; } .col.liveticker-board .box.liveticker-teaser.type-team .text{ font-size: 12px; } .liveticker-board .liveticker-teaser.type-team table{ width: 92%; margin: 1px auto; } .liveticker-board .liveticker-teaser.type-team th{ padding-right: 3px; max-width: 115px; text-align: left; font-weight: normal; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .liveticker-board .liveticker-teaser.type-team img{ width: 20px; margin-right: 5px; } .liveticker-board .liveticker-teaser.type-tennis img{ width: 15px; margin-right: 6px; } .col.liveticker-board .box.liveticker-teaser.type-tennis .text{ font-size: 12px; } .liveticker-board .liveticker-teaser.type-tennis table{ width: 92%; margin: 1px auto; } .liveticker-board .liveticker-teaser.type-tennis th{ padding-right: 2px; max-width: 88px; } .liveticker-board .liveticker-teaser.type-tennis td{ width: 8px; background: transparent; } .liveticker-board .scroll_prev, .liveticker-board .scroll_next{ display: none; position: absolute; top: 0; bottom: 5px; line-height: 85px; width: 32px; text-align: center; background: #2b2c2d; color: #fff; z-index: 3; cursor: pointer; } .liveticker-board .scroll_prev{ left: 10px; border-right: 1px solid #fff; } .liveticker-board .scroll_next{ right: 10px; border-left: 1px solid #fff; } @media screen and (min-width:500px) { .liveticker-board{ padding: 0; } .liveticker-board:before{ left: 0; } .liveticker-board:after{ right: 0; } .liveticker-board .scroll_prev{ left: 0px; animation: liveticker-board-prev-fadein 500ms ease-out; } .liveticker-board .scroll_next{ right: 0px; animation: liveticker-board-next-fadein 500ms ease-out; } .liveticker-board:hover .scroll_prev, .liveticker-board:hover .scroll_next{ display: block; } } @keyframes liveticker-board-prev-fadein{ 0% { opacity: 0.5; transform: translateX(-32px); } 60% { opacity: 0.5; transform: translateX(-32px); } 100% { opacity: 1; transform: translateX(0px); } } @keyframes liveticker-board-next-fadein{ 0% { opacity: 0.5; transform: translateX(32px); } 60% { opacity: 0.5; transform: translateX(32px); } 100% { opacity: 1; transform: translateX(0px); } } .liveticker-board .scroll_prev.hide, .liveticker-board .scroll_next.hide{ display: none; } .vmiddle{ display: flex; flex-direction: column; align-items: center; justify-content: center; } #calendar-btn{ cursor: pointer; } .calendarContainer{ width: 100%; display: none; padding: 0 10px; margin-top: -10px; max-width: 960px; } body.screen-small .calendarContainer{ padding-left: 0; padding-right: 0; } .calendarContainer.active{ display: block; animation: calender-fadein 250ms ease-out; padding-bottom: 20px; } @keyframes calender-fadein{ 0% { opacity: 0.5; transform: scale(.9) translateY(-30px); } 100% { opacity: 1; transform: scale(1) translateY(0px); } } .calendarContainer .calendar{ border: none; width: 100%; height: 100%; border-spacing: 0; background: var(--box-background); } .calendarContainer tr{ width: 100%; border: none; } .calendarContainer .calendar td{ width: 14.28%; height: 44px; border: none; text-align: center; user-select: none; cursor: pointer; position: relative; } .calendarContainer .calendar td .badge{ position: absolute; top: 5px; left: 50%; margin-left: 8px; height: 15px; min-width: 15px; padding: 0 4px; line-height: 16px; font-size: 11px; border-radius: 10px; font-weight: bold; background: var(--highlight); color: #fff; text-shadow: 0 0 4px #000; } .calendarContainer .headerRow, .calendarContainer .subHeaderRow{ background: var(--border-color2); } .calendarContainer .headerRow td{ padding-top: 4px; padding-bottom: 0; } .calendarContainer .subHeaderRow{ font-size: 80%; } .calendarContainer .calendar .headerRow td, .calendarContainer .calendar .subHeaderRow td{ border-color: #b0b3b6; border: none; } .calendarContainer .subHeaderRow td{ cursor: initial; } .calendarContainer .calendar td:last-of-type{ border-right: none; } .calendarContainer .calendar td.gray{ color: #c3c6c9; } body.dark .calendarContainer .calendar td.gray{ color: #c3c6c9; } .calendarContainer .calendar td.today{ color: var(--highlight); font-weight: bold; } .calendarContainer .calendar tr:not(.headerRow):not(.subHeaderRow) td{ transition: background 200ms ease-in-out; } .calendarContainer .calendar tr:not(.headerRow):not(.subHeaderRow) td:hover{ background: #f4f5f6; background: rgba(0,0,0,0.05); color: #111; } .calendarContainer td.lastMonth{ text-align: left; padding-left: 16px; border-right: none; border-bottom: none; color: #939699; position: relative; } .calendarContainer td.thisMonth{ font-weight: bold; border-right: none; border-bottom: none; cursor: initial; } .calendarContainer td.nextMonth{ border-bottom: none; text-align: right; padding-right: 16px; color: #939699; position: relative; } .calendarContainer td.lastMonth:hover, .calendarContainer td.nextMonth:hover{ color: var(--text-color); } .calendarContainer td.lastMonth:hover:after, .calendarContainer td.nextMonth:hover:after{ width: 0; } .matchday-selector{ border-top: 5px solid var(--border-color2); } .matchday-selector div{ display: inline-block; width: 14.28%; height: 33px; line-height: 33px; vertical-align: middle; border: none; background-color: var(--box-background); color: var(--text-color); border-right: 1px solid var(--border-color2); border-bottom: 1px solid var(--border-color2); text-align: center; user-select: none; cursor: pointer; transition: background 200ms ease-in-out; } .matchday-selector div.current{ color: var(--highlight); } .matchday-selector div:hover{ background: #f4f5f6; } .myfeed_overlay{ position: fixed; top: 0; right: 0; bottom: 0; left: 0; color: var(--text-color); background-color: var(--box-background); display: none; z-index: 10000; transform: translateZ(0); -webkit-transform: translateZ(0); } .myfeed_list{ position: absolute; top: 54px; right: 0; bottom: 0; left: 0; overflow: scroll; overflow-x: hidden; overflow-y: auto; } .myfeed_list.choose_favorite{ top: 0; } body.myfeedopen{ min-height: 100%; height: 100%; overflow: hidden; } body.myfeedopen .myfeed_overlay{ display: block; } body.isPhonegap .myfeed_overlay{ top: 0px; bottom: 53px; bottom: calc(53px + constant(safe-area-inset-bottom)); bottom: calc(53px + env(safe-area-inset-bottom)); } body.isPhonegap .myfeed_overlay{ transition: transform 200ms ease-in-out; transform: translateY(120%); display: block; } body.isPhonegap.myfeedopen .myfeed_overlay{ transform: translateY(0); } .myfeed_overlay .search-overlay{ width: 100%; position: relative; top: 0; left: 0; padding: 0; height: 54px; } .myfeed_overlay .search-overlay .search-input{ padding: 0 44px 0 16px; background: var(--background); } .myfeed_overlay .search-overlay .icon-search{ top: 17px; right: 14px; font-size: 24px; } .myfeed_overlay .search-overlay .autocomplete-suggestions{ box-shadow: 0 100vh 0 100vh var(--background); overflow: scroll; overflow-x: hidden; overflow-y: auto; max-height: calc(100vh - 107px)!important; } .myfeed_overlay .search-overlay .autocomplete-group{ padding-left: 16px; } .myfeed_overlay .search-overlay .autocomplete-suggestion{ padding: 15px 16px; } .myfeed_overlay .search-overlay .autocomplete-suggestion:after{ float: right; font-size: 24px; margin: -3px -2px 0 0; font-family: 'icomoon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\e145"; } .myfeed_overlay .search-overlay .autocomplete-suggestion:hover:after, .myfeed_overlay .search-overlay .autocomplete-suggestion.autocomplete-selected:after{ color: var(--highlight); content: "\e5ca"; } .mobilemenubtn span, .mobilemenubtn span:before, .mobilemenubtn span:after{ background-color: #fff; border-radius: 2px; display: block; height: 2px; width: 22px; } .mobilemenubtn span{ margin: 0 auto; position: relative; top: 21px; color: transparent; font: 0/0 a; text-shadow: none; } .mobilemenubtn span:before, .mobilemenubtn span:after{ content: ''; position: absolute; -moz-transition: margin .2s ease-in-out; -o-transition: margin .2s ease-in-out; -webkit-transition: margin .2s ease-in-out; transition: margin .2s ease-in-out; -webkit-transition-delay: .2s; transition-delay: .2s; } .mobilemenubtn span:before{ margin-top: -7px; } .mobilemenubtn span:after{ margin-top: 7px; } body.mmopen .mobilemenubtn span{ -webkit-transition-delay: 0s; transition-delay: 0s; background-color: rgba(255,255,255,0); } body.mmopen .mobilemenubtn span:before{ -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -moz-transition: transform .2s ease-in-out; -o-transition: transform .2s ease-in-out; -webkit-transition: transform .2s ease-in-out; transition: transform .2s ease-in-out; margin-top: 0; } body.mmopen .mobilemenubtn span:after{ -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -moz-transition: transform .2s ease-in-out; -o-transition: transform .2s ease-in-out; -webkit-transition: transform .2s ease-in-out; transition: transform .2s ease-in-out; margin-top: 0; } body.mmopen:not(.isPhonegap) div:not([data-id="navi"]) > .icon-menu:before { content: "\e5cd"; } .mm_overlay{ position: fixed; top: 44px; bottom: 0; left: -100vw; width: 100vw; background-color: rgba(15,20,25,0.6); z-index: 10000; transform: translateZ(0); -webkit-transform: translateZ(0); transition: left 250ms ease-in-out; overflow-x: hidden; } body.mmopen{ min-height: 100%; height: 100%; overflow: hidden; } body.mmopen .footer{ opacity: 0; } body.mmopen .mm_overlay{ left: 0; } .mm_left{ position: absolute; top: 0; bottom: 0; left: 0; width: 52px; background: #2b2c2d; } .mm_right{ position: absolute; top: 0; bottom: 0; left: 52px; right: 0; padding: 0 8px; background: var(--box-background); overflow: scroll; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; color: var(--text-color); } @media screen and (min-width:400px) { .mm_right{ right: auto; width: calc(100% - 53px); } } .mm_left > div{ text-align: center; color: #6c6d6f; font-size: 12px; height: 52px; padding-top: 14px; border-bottom: 1px solid rgba(255,255,255,0.1); } .mm_left > div:first-child{ border-top: 1px solid rgba(255,255,255,0.1); } .mm_left > div.active{ color: #fff; background: var(--highlight); border-color: var(--highlight); } .mm_left > div i{ font-size: 22px; } .mm_left > div i.icon-bell, .mm_left > div i.icon-listen{ font-size: 19px; line-height: 23px; } .mm_left > div i.icon-search{ font-size: 29px; line-height: 25px; } .mm_right{ opacity: 0; transform: translateX(100%); transition: transform 250ms ease-in-out, opacity 250ms ease-in-out; } .mm_right.active{ opacity: 1; transform: translateX(0); } .mm_right ul{ list-style: none; margin: 0; padding: 0; } .mm_right li{ border-top: 1px solid #dddee0; position: relative; overflow: hidden; } .mm_right li:first-child{ border-top: none; } .mm_right li .opensub{ position: absolute; top: 0; right: 0; width: 42px; height: 42px; line-height: 42px; text-align: center; background: var(--border-color); z-index: 1; } .mm_right li .opensub.active:before { content: "\f077"; } .mm_right li a{ display: block; line-height: 14px; padding: 14px 5px; font-size: 14px; font-weight: bold; color: var(--text-color); position: relative; background: var(--box-background); z-index: 1; } .mm_right li a:not(.dir):hover{ color: var(--highlight); } .mm_right > ul ul{ height: 0px; transform: translateY(-100%); opacity: 0; transition: transform 400ms ease-in-out, opacity 400ms ease-in-out; } .mm_right > ul ul.active{ height: auto; opacity: 1; transform: translateY(0%); } .mm_right li li{ padding-left: 14px; } .mm_right li li a{ font-weight: normal; } .mm_right ul > li > ul > li, .mm_right ul > li > ul > li a{ background: var(--border-color); border-color: var(--text-color); } .mm_right ul > li > ul > li > ul > li, .mm_right ul > li > ul > li > ul > li > a{ background: #e0e0e0; border-color: #f0f0f0; color: #444; } .mm_right ul > li > ul > li > ul > li > ul > li, .mm_right ul > li > ul > li > ul > li > ul > li > a{ background: #d0d0d0; border-color: #e0e0e0; } .mm_right ul > li > ul > li .opensub{ background: var(--border-color2); } .mm_right ul > li > ul > li > ul > li .opensub{ background: #d0d0d0; } body.isPhonegap .mm_overlay{ top: 0px; bottom: 53px; bottom: calc(53px + constant(safe-area-inset-bottom)); bottom: calc(53px + env(safe-area-inset-bottom)); } body.isPhonegap .mm_overlay{ background: var(--box-background); transition: transform 200ms ease-in-out; transform: translateY(120%); display: block; } body.isPhonegap.mmopen .mm_overlay{ transform: translateY(0); } body.isPhonegap .mm_right{ padding: 0; } body.isPhonegap .mm_right li a{ line-height: 23px; padding: 14px; font-size: 16px; } body.isPhonegap li .opensub{ width: 51px; height: 51px; line-height: 52px; } body.isPhonegap .mm_right li li{ margin-left: 14px; padding-left: 0; } .settings-row{ margin-left: 1px; margin-bottom: 25px; line-height: 20px; } .view.frame{ margin-bottom: -4px; } .view.p .col.main, .view.frame .col.main, .view.stats .col.main{ display: inline-block; } .view.stats #statsframe{ background: var(--bg-loader-gif) no-repeat center; max-width: 100%; min-width: 100%; width: 0; overflow: hidden; } div.img iframe{ background: var(--loader-gif) no-repeat center var(--background); box-shadow: inset 0 0 86px -26px var(--border-color2); } div.toload[data-twitterid], div.loading[data-twitterid]{ background: url('https://sportal.s3.amazonaws.com/media/web/twitter.gif') no-repeat center #fff; background-size: 100px; height: 300px; } .lSSlideOuter { min-width: 100%; overflow: hidden; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .text.body .lSSlideOuter{ padding-bottom: 4px; border-bottom: 1px solid var(--border-color2); } @media screen and (min-width: 800px){ .box.article > .lSSlideOuter { width: calc(100vw - 350px); } } @media screen and (min-width: 1200px){ .box.article > .lSSlideOuter { width: calc(100vw - 390px); } } @media screen and (min-width: 1440px){ .box.article > .lSSlideOuter { width: 1080px; } } @media screen and (min-width: 800px){ .text.body .lSSlideOuter { width: calc(100vw - 420px); } } @media screen and (min-width: 930px){ .text.body .lSSlideOuter { width: 532px; } } @media screen and (min-width: 1200px){ .text.body .lSSlideOuter { width: calc(100vw - 735px); } } @media screen and (min-width: 1440px){ .text.body .lSSlideOuter { width: 723px; } } .lightSlider:before, .lightSlider:after { content: " "; display: table; } .lightSlider { overflow: hidden; margin: 0; } .lSSlideWrapper { max-width: 100%; overflow: hidden; position: relative; } .lSSlideWrapper > .lightSlider:after { clear: both; } .lSSlideWrapper .lSSlide { -webkit-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px); transform: translate(0px, 0px); -webkit-transition: all 1s; -webkit-transition-property: -webkit-transform,height; -moz-transition-property: -moz-transform,height; transition-property: transform,height; -webkit-transition-duration: inherit !important; transition-duration: inherit !important; -webkit-transition-timing-function: inherit !important; transition-timing-function: inherit !important; } .lSSlideWrapper .lSFade { position: relative; } .lSSlideWrapper .lSFade > * { position: absolute !important; top: 0; left: 0; z-index: 9; margin-right: 0; width: 100%; } .lSSlideWrapper.usingCss .lSFade > * { opacity: 0; -webkit-transition-delay: 0s; transition-delay: 0s; -webkit-transition-duration: inherit !important; transition-duration: inherit !important; -webkit-transition-property: opacity; transition-property: opacity; -webkit-transition-timing-function: inherit !important; transition-timing-function: inherit !important; } .lSSlideWrapper .lSFade > *.active { z-index: 10; } .lSSlideWrapper.usingCss .lSFade > *.active { opacity: 1; } .lSSlideOuter .lSPager.lSpg { margin: -5px 0 0 0; padding: 0; text-align: center; } .lSSlideOuter .lSPager.lSpg > li { cursor: pointer; display: inline-block; padding: 0 5px; } .lSSlideOuter .lSPager.lSpg > li a { background-color: #222222; border-radius: 30px; display: inline-block; height: 8px; overflow: hidden; text-indent: -999em; width: 8px; position: relative; z-index: 99; -webkit-transition: all 0.5s linear 0s; transition: all 0.5s linear 0s; } .lSSlideOuter .lSPager.lSpg > li:hover a, .lSSlideOuter .lSPager.lSpg > li.active a { background-color: var(--highlight); } .lSSlideOuter .media { opacity: 0.8; } .lSSlideOuter .media.active { opacity: 1; } .lSSlideOuter .lSPager.lSGallery { list-style: none outside none; padding-left: 0; margin: 0; overflow: hidden; transform: translate3d(0px, 0px, 0px); -moz-transform: translate3d(0px, 0px, 0px); -ms-transform: translate3d(0px, 0px, 0px); -webkit-transform: translate3d(0px, 0px, 0px); -o-transform: translate3d(0px, 0px, 0px); -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .lSSlideOuter .lSPager.lSGallery li { overflow: hidden; -webkit-transition: border-radius 0.12s linear 0s 0.35s linear 0s; transition: border-radius 0.12s linear 0s 0.35s linear 0s; } .lSSlideOuter .lSPager.lSGallery li.active, .lSSlideOuter .lSPager.lSGallery li:hover { border-radius: 5px; } .lSSlideOuter .lSPager.lSGallery img { display: block; height: auto; max-width: 100%; } .lSSlideOuter .lSPager.lSGallery:before, .lSSlideOuter .lSPager.lSGallery:after { content: " "; display: table; } .lSSlideOuter .lSPager.lSGallery:after { clear: both; } .lSAction > a { width: 42px; display: block; top: 46%; height: 42px; cursor: pointer; position: absolute; z-index: 99; margin-top: -21px; opacity: 0.75; font-size: 24px; line-height: 53px; text-align: center; color: rgba(0,0,0,0.75) !important; } @media not all and (hover: hover){ .lSAction > a { display: none; } } @media not all and (hover: none){ .lSAction > a { background: rgba(255,255,255,0.75); opacity: 0.5; -webkit-transition: opacity 0.35s linear 0s; transition: opacity 0.35s linear 0s; } .lSAction > a:hover { opacity: 1; } } .lSAction > .lSPrev { left: 0; } .lSAction > .lSNext { right: 0; } .lSAction > a.disabled { pointer-events: none; } .cS-hidden { height: 1px; opacity: 0; filter: alpha(opacity=0); overflow: hidden; } .lSSlideOuter.lSrtl { direction: rtl; } .lSSlideOuter .lightSlider, .lSSlideOuter .lSPager { padding-left: 0; list-style: none outside none; } .lSSlideOuter.lSrtl .lightSlider, .lSSlideOuter.lSrtl .lSPager { padding-right: 0; } .lSSlideOuter .lightSlider > *, .lSSlideOuter .lSGallery li { float: left; padding-bottom: 10px; } .lSSlideOuter.lSrtl .lightSlider > *, .lSSlideOuter.lSrtl .lSGallery li { float: right !important; } @-webkit-keyframes rightEnd { 0% { left: 0; } 50% { left: -15px; } 100% { left: 0; } } @keyframes rightEnd { 0% { left: 0; } 50% { left: -15px; } 100% { left: 0; } } @-webkit-keyframes topEnd { 0% { top: 0; } 50% { top: -15px; } 100% { top: 0; } } @keyframes topEnd { 0% { top: 0; } 50% { top: -15px; } 100% { top: 0; } } @-webkit-keyframes leftEnd { 0% { left: 0; } 50% { left: 15px; } 100% { left: 0; } } @keyframes leftEnd { 0% { left: 0; } 50% { left: 15px; } 100% { left: 0; } } @-webkit-keyframes bottomEnd { 0% { bottom: 0; } 50% { bottom: -15px; } 100% { bottom: 0; } } @keyframes bottomEnd { 0% { bottom: 0; } 50% { bottom: -15px; } 100% { bottom: 0; } } .lSSlideOuter .rightEnd { -webkit-animation: rightEnd 0.3s; animation: rightEnd 0.3s; position: relative; } .lSSlideOuter .leftEnd { -webkit-animation: leftEnd 0.3s; animation: leftEnd 0.3s; position: relative; } .lSSlideOuter.vertical .rightEnd { -webkit-animation: topEnd 0.3s; animation: topEnd 0.3s; position: relative; } .lSSlideOuter.vertical .leftEnd { -webkit-animation: bottomEnd 0.3s; animation: bottomEnd 0.3s; position: relative; } .lSSlideOuter.lSrtl .rightEnd { -webkit-animation: leftEnd 0.3s; animation: leftEnd 0.3s; position: relative; } .lSSlideOuter.lSrtl .leftEnd { -webkit-animation: rightEnd 0.3s; animation: rightEnd 0.3s; position: relative; } .lightSlider.lsGrab > * { cursor: -webkit-grab; cursor: -moz-grab; cursor: -o-grab; cursor: -ms-grab; cursor: grab; } .lightSlider.lsGrabbing > * { cursor: move; cursor: -webkit-grabbing; cursor: -moz-grabbing; cursor: -o-grabbing; cursor: -ms-grabbing; cursor: grabbing; } .lightSlider .lslide .image{ background-color: #2b2c2d; text-align: center; } .lightSlider .lslide .caption{ background: var(--box-background); padding: 8px 10% 0 10%; margin-top: -9px; margin-bottom: -5px; outline: 1px solid var(--box-background); font-family: var(--default-font); font-style: italic; color: var(--text-color);; } .text.body .lightSlider .lslide .caption{ padding-left: 0; padding-right: 0; } .lSSlideOuter .counter-box{ font-family: var(--default-font); position: absolute; top: 0; right: 0; padding: 4px 14px 4px 13px; background: rgba(255,255,255,0.55); color: rgba(0,0,0,0.55); } body[data-widget="lpp"]{ padding: 0 !important; min-height: 0; overflow: hidden; } body[data-widget="lpp"] .liveticker-board{ margin-top: 0; margin-left: 80px; width: calc(100% - 80px); } body[data-widget="lpp"] .liveticker-board .content.row{ text-align: left; } @media screen and (max-width: 800px){ body[data-view="stats"] .bannerspot[data-adkey="top"] .banner{ margin-bottom: 12px; } } div:not(.match_group_head) > .box.liveticker-buttons{ margin-top: -19px; border-top: none; box-shadow: none; padding: 14px 2% 2% 2%; max-width: 940px; } .view.home .col.main .match_group_head .box.liveticker-buttons{ border-radius: 0; margin-top: 19px; margin-bottom: -15px; padding: 2%; } .col .content .lt-cta{ font-family: var(--default-font); display: block; padding: 8px; text-align: center; background: var(--highlight); color: #fff; margin-bottom: 1px; cursor: pointer; } .col .content .lt-cta.redfc img{ width: 60px; margin: 0 5px -2px 0; background: transparent; border-radius: 0; } .col .content .lt-cta .icon{ font-size: 16px; margin-top: -3px; margin-right: 4px; vertical-align: middle; display: inline-block; } .view.detail .col .content a.lt-cta .icon{ font-size: 21px; margin-right: 5px !important; } .col .content a.lt-cta.two{ display: inline-block; width: 49%; } .col .content a.lt-cta.two:first-child{ margin-right: 1%; } .col .content a.lt-cta.two:last-child{ margin-left: 1%; } .col .content .lt-cta:hover{ background: var(--highlight-hover); } .col .content .lt-cta i{ margin-right: 5px; } .col .content .lt-cta i.icon-watch{ font-size: 114%; vertical-align: text-top; } .view.scores .col .content .lt-cta i.icon-watch{ font-size: 120%; } body[data-widget="zpteaser"]{ background: transparent; } .follow{ font-family: var(--default-font); background-color: #fff; border: 1px solid var(--hover-color); border-radius: 5px; color: var(--hover-color); cursor: pointer; display: inline-block; font-size: 12px; font-weight: 400; height: 26px; line-height: 25px; padding: 0 13px; position: relative; text-align: center; white-space: nowrap; } .follow.active{ color: #fff; background: var(--hover-color); } .teamstream_box{ max-width: 724px; margin-left: auto !important; margin-right: auto !important; padding: 1px 15px; } .teamstream_box h2{ margin-bottom: 8px; } .teamstream_box h2 .icon-left{ font-size: 22px; border-right: 1px solid #dddedf; padding: 7px; } .teamstream_box h2 .icon-left:hover{ color: var(--highlight); } body[data-view="teamstream_settings"] .teamstream_box.firsttime h2 .icon-left{ display: none } .teamstream_main_list{ list-style: none; padding: 0; margin-bottom: 35px; } .teamstream_main_list li{ position: relative; margin: 0 5px; height: 0px; line-height: 26px; font-size: 16px; display: block; overflow: hidden; transition: all 0.35s ease-in-out; cursor: pointer; } .teamstream_main_list.open li{ display: block; height: 45px; border-bottom: 1px solid rgba(0,0,0,0.1); padding: 10px; } .teamstream_main_list.open li.firstchoose{ display: none; } .teamstream_main_list li:hover{ background: #cbcccd; } .teamstream_main_list li.active{ background: #2b2c2d; color: #fff; display: block; height: 45px; border-bottom: 1px solid rgba(0,0,0,0.1); padding: 10px; } .teamstream_main_list li:last-child{ border-bottom: none; } .teamstream_main_list li img{ width: 24px; vertical-align: middle; margin-top: -4px; margin-right: 5px; background: none; } .teamstream_main_list li .down{ position: absolute; top: 10px; right: 10px; width: 24px; height: 24px; text-align: center; cursor: pointer; opacity: 0; } .teamstream_main_list li.active .down{ opacity: 1; } .teamstream_main_list.open li.active .down{ opacity: 0; } .teamstream_main_list li .down .icon{ font-size: 20px; color: #fff; margin-top: 1px; display: inline-block; } .teamstream_overview_header{ position: relative; } .teamstream_overview_header .changebtn{ position: absolute; top: 10px; right: 10px; } .teamstream_box h2 > .btn{ margin-top: -2px; margin-left: 2px; vertical-align: middle; padding: 0px 7px; height: 26px; line-height: 26px; } .teamstream_list{ list-style: none; padding: 0; } .teamstream_list li{ position: relative; margin: 0 5px; border-bottom: 1px solid rgba(0,0,0,0.1); padding: 10px; height: 45px; line-height: 26px; font-size: 16px; cursor: pointer; } .teamstream_list li:last-child{ border-bottom: none; } .teamstream_list li img{ width: 24px; vertical-align: middle; margin-top: -4px; margin-right: 5px; background: none; } .teamstream_list li span.ph{ width: 32px; display: inline-block } .teamstream_list li .checker{ position: absolute; top: 10px; right: 10px; } .teamstream_list li.active .checker{ background: var(--hover-color); color: #fff; } .teamstream_list li .checker .icon{ font-size: 20px; color: #fff; margin-top: 1px; display: inline-block; } .teamstream_list li.active .checker .icon{ color: #fff; } #teamstream_search{ margin-bottom: 30px; } #teamstream_search .search-overlay{ position: relative; top: 0; right: 0; width: 100%; box-shadow: none; display: inline-block; margin-top: 5px; margin-right: 6px; margin-bottom: 5px; padding: 1px; opacity: 1; transform: translateX(0px); } #teamstream_search a.tag{ margin: 5px; background-color: var(--hover-color); color: #fff; } #teamstream_search a.tag .icon-close{ margin-left: 5px; font-size: 12px; color: #333; color: #fff; } .col .box.teamstream_widget{ position: relative; background: rgb(0,45,50); height: 351px; overflow-y: hidden; padding: 0 !important; } .col .box.teamstream_widget.headerline_only{ height: 124px; } body.screen-medium .view.detail .col .box.teamstream_widget{ max-width: calc(100vw - 365px); width: 100%; } @media screen and (min-width:1200px) { body.screen-medium .view.detail .col .box.teamstream_widget{ max-width: calc(100vw - 395px); } } body.screen-large .view.detail .col .box.teamstream_widget{ max-width: calc(100vw - 415px); width: 100%; } @media screen and (min-width:1440px) { body.screen-large .view.detail .col .box.teamstream_widget{ max-width: calc(100vw - 395px); } } @media screen and (min-width:1480px) { body.screen-large .view.detail .col .box.teamstream_widget{ max-width: calc(100vw - 400px); } } @media screen and (min-width:1500px) { body.screen-large .view.detail .col .box.teamstream_widget{ width: calc(100vw - 390px - ((100vw - 1440px) / 2)); } } @media screen and (min-width:1570px) { body.screen-large .view.detail .col .box.teamstream_widget{ width: calc(100vw - 428px - ((100vw - 1440px) / 2)); } } @media screen and (min-width:1640px) { body.screen-large .view.detail .col .box.teamstream_widget{ width: calc(100vw - 460px - ((100vw - 1440px) / 2)); } } @media screen and (min-width:1760px) { body.screen-large .view.detail .col .box.teamstream_widget{ width: calc(100vw - 519px - ((100vw - 1440px) / 2)); } } @media screen and (min-width:1967px) { body.screen-large .view.detail .col .box.teamstream_widget{ width: calc(100vw - 623px - ((100vw - 1440px) / 2)); } } .col .content .teamstream_widget .icon-profil{ position: absolute; top: 15px; right: 13px; font-size: 20px; background: #eff0f3; padding: 5px 8px 7px 8px; border-radius: 16px; z-index: 2; } .col .content .teamstream_widget .icon-profil:hover{ background: #333; color: #fff; } .teamstream_headline{ margin: 14px 0 0 14px; white-space: nowrap; overflow: hidden; text-align: center; } .teamstream_headline .teamstream_logo{ width: 220px; background: none; margin: 6px 8px 5px 6px; } .teamstream_headline .teamstream_logo_sep{ height: 4px; width: 130px; background: rgba(255,255,255,0.25); margin: 4px auto 3px auto; } .teamstream_headline .chosentag{ position: relative; width: 39px; height: 39px; vertical-align: top; margin: 7px 3px 1px 8px; display: inline-block; cursor: pointer; } .teamstream_headline .chosentag img{ background: none; } .teamstream_headline .chosentag.favorite .icon{ position: absolute; top: -4px; right: -4px; font-size: 15px; color: #f5cd30; text-shadow: -1px 1px 0 #fff; } .teamstream_headline .chosentag.favorite .heart{ position: absolute; top: -5px; right: -8px; width: 22px; } .teamstream_headline .chosentagsep{ display: inline-block; height: 34px; width: 2px; background: rgba(255,255,255,0.25); margin: 10px 4px 0 9px; } .view.channel .col .teamstream_footer, .view.home .col.main .teamstream_footer, .view.detail .col.main .teamstream_footer{ background: rgb(0,45,50); border-top: none; margin-top: -20px; text-align: center; position: relative; height: 50px; } .teamstream_footer img{ position: absolute; top: 20px; left: 16px; background: none; } .teamstream_footer a.link{ position: absolute; top: 15px; right: 15px; color: var(--highlight) !important; } .teamstream_footer a.link .icon{ border: 1px solid var(--highlight); display: inline-block; width: 20px; height: 20px; border-radius: 10px; padding: 1px 1px 1px 2px; vertical-align: bottom; margin-left: 2px; padding: 2px; font-size: 13px; } .teamstream_slider{ overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; height: 302px; padding: 5px 20px 14px 20px; } .teamstream_slider > a{ position: relative; } .teamstream_slider > a .icon{ position: absolute; top: 3px; right: 23px; font-size: 20px; color: #fff; text-shadow: 0 0 1px #ccc; } .teamstream_fade{ position: absolute; top: 0px; width: 22px; height: 100%; z-index: 1; } .teamstream_fade_left{ position: absolute; top: 0px; width: 22px; height: 100%; z-index: 1; left: 0px; background: -moz-linear-gradient(left, rgba(0,45,50,1) 0%, rgba(0,45,50,0) 100%); background: -webkit-linear-gradient(left, rgba(0,45,50,1) 0%,rgba(0,45,50,0) 100%); background: linear-gradient(to right, rgba(0,45,50,1) 0%,rgba(0,45,50,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002830', endColorstr='#00002830',GradientType=1 ); } .teamstream_fade_right{ position: absolute; top: 0px; width: 22px; height: 100%; z-index: 1; right: 0px; background: -moz-linear-gradient(left, rgba(0,45,50,0) 0%, rgba(0,45,50,1) 100%); background: -webkit-linear-gradient(left, rgba(0,45,50,0) 0%,rgba(0,45,50,1) 100%); background: linear-gradient(to right, rgba(0,45,50,0) 0%,rgba(0,45,50,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00002830', endColorstr='#002830',GradientType=1 ); } .teamstream_fade_bottom{ position: absolute; bottom: 0px; left: 0px; width: 100%; height: 30px; z-index: 1; background: -moz-linear-gradient(top, rgba(0,45,50,0) 0%, rgba(0,45,50,1) 100%); background: -webkit-linear-gradient(top, rgba(0,45,50,0) 0%,rgba(0,45,50,1) 100%); background: linear-gradient(to bottom, rgba(0,45,50,0) 0%,rgba(0,45,50,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00002830', endColorstr='#002830',GradientType=1 ); } .teamstream_nav{ position: absolute; top: 50%; width: 40px; height: 50px; margin-top: -25px; vertical-align: middle; text-align: center; line-height: 20px; font-size: 46px; background: #eff0f3; cursor: pointer; z-index: 2; } body.can-touch .teamstream_nav{ display: none; } .teamstream_nav:hover{ background: #333; color: #fff; } .teamstream_nav.left{ left: 0; padding-right: 2px; display: none; } .teamstream_nav.right{ right: 0; padding-left: 2px; } .teamstream_widget .newsslider_item{ width: 220px; display: inline-block; text-align: left; white-space: normal; vertical-align: top; margin-right: 14px; } .teamstream_widget .newsslider_item h3{ font-size: 16px; line-height: 22px; margin-top: 5px; } .col .box.teamstream_widget .newsslider_item h3{ color: #fff; } .teamstream_widget .newsslider_item img{ max-height: 124px; width: 100%; } .teamstream_widget .newsslider_item.team{ width: 180px; margin: 40px 0; display: inline-block; text-align: center; white-space: nowrap; margin-right: 0; } .teamstream_widget .newsslider_item.team h3{ font-size: 19px; overflow: hidden; text-overflow: ellipsis; margin: 11px auto 13px auto; width: 92%; } .teamstream_widget .newsslider_item.team img{ width: 130px; background: none; } .teamstream_widget .newsslider_item .phold.img{ width: 100%; } .teamstream_overview .teamstream_box{ padding: 0; } .teamstream_overview .addbtn, .teamstream_overview .editbtn{ float: right; padding: 0 10px; font-weight: bold; } .teamstream_overview .editbtn{ margin-right: 5px; } .teamstream_overview.edit_on .col .content .editbtn{ color: #ccc; border-color: #ccc; } .teamstream_overview.edit_on .col .content .editbtn:hover{ color: #fff; background-color: #ccc; } .teamstream_overview .editbtn:after{ content: 'Edit'; } .teamstream_overview.edit_on .editbtn:after{ content: 'Done'; } .teamstream_overview.edit_on .tagicon{ animation: jiggle 0.2s infinite; -webkit-animation: jiggle 0.2s infinite; -moz-animation-duration: 0.2s; -moz-animation-name: jiggle; -moz-animation-iteration-count: infinite; -webkit-transform: rotate(-1deg); -moz-transform: rotate(-1deg); } @keyframes jiggle { 0% { transform: rotate(-1deg); } 50%{ transform: rotate(1deg); } } @-webkit-keyframes jiggle { 0% { -webkit-transform: rotate(-1deg); } 50% { -webkit-transform: rotate(1deg); } } @-moz-keyframes jiggle { 0% { -moz-transform: rotate(-1deg); } 50% { -moz-transform: rotate(1deg); } } .teamstream_overview .teamstream_overview_teams > div .icon-close, .teamstream_overview .teamstream_overview_other > div .icon-close{ position: absolute; top: 4px; right: 3px; height: 18px; width: 18px; font-size: 13px; line-height: 16px; text-align: center; background: var(--highlight); color: #fff; padding: 1px; border-radius: 9px; display: none; z-index: 1; } .teamstream_overview.edit_on .teamstream_overview_teams > div .icon-close, .teamstream_overview.edit_on .teamstream_overview_other > div .icon-close{ display: block } .teamstream_overview .closebtn{ position: absolute; top: 8px; right: 8px; padding: 0 12px; font-weight: bold; } .teamstream_overview .itemcounter{ display: inline-block; color: #fff; background: #333; border-radius: 12px; font-size: 15px; line-height: 22px; width: 23px; height: 23px; text-align: center; vertical-align: middle; margin-top: -4px; } .teamstream_overview_header .mainteam{ position: relative; padding: 20px; width: 260px; height: 260px; display: inline-block; margin-bottom: 5px; } .teamstream_overview_header .mainteam .icon{ position: absolute; top: 18px; right: 10px; font-size: 47px; color: #fff; } .teamstream_overview_header .mainteam .icon.inner{ top: 5px; right: 5px; font-size: 37px; color: #f5cd30; } .teamstream_overview_header .mainteam .heart{ position: absolute; top: 18px; right: 12px; width: 64px; } .teamstream_overview_header h2{ display: inline-block; margin: 0 12px 19px 22px; } .teamstream_overview_header .mainteam img{ background: none; } .teamstream_overview_teams{ padding: 0 15px; } .teamstream_overview_teams > div, .teamstream_overview_other > div{ display: inline-block; width: 115px; padding: 16px; text-align: center; vertical-align: top; position: relative; } .teamstream_overview_teams > div img, .teamstream_overview_other > div img{ background: none; margin-bottom: 5px; } .teamstream_overview_teams .phold, .teamstream_overview_other .phold{ color: #e3e4e5; font-size: 90px; height: 84px; margin-bottom: 5px; display: block; } .teamstream_overview_other .phold{ font-size: 80px; padding-top: 3px; margin-bottom: 9px; } .teamstream_overview_other{ padding: 0 15px 15px 15px; } .col .content .teamstream_overview_other a.tag{ margin: 5px; background-color: var(--hover-color); color: #fff; cursor: default; } body[data-view="watch"] .over-view{ display: none; } body[data-widget="startsite"][data-view="channel"]{ padding-top: 0 !important; } body[data-videos="1"], body[data-videos="1"] .over-view, body[data-videos="1"] .col .box, body[data-videos="1"] .view.detail .col.side.left .content, body[data-view="channel"], body[data-view="channel"] .over-view, body[data-view="channel"] .col .box, body[data-view="channel"] .view.detail .col.side.left .content, body[data-view="watch"], body[data-view="watch"] .over-view, body[data-view="watch"] .col .box, body[data-view="watch"] .view.detail .col.side.left .content, body[data-view="page"][data-tag="streams"], body[data-view="page"][data-tag="streams"] .over-view{ color: #fff; background: #000; } body[data-videos="1"] .col .content a:not(.tag), body[data-view="channel"] .col .content a:not(.tag), body[data-view="watch"] .col .content a:not(.tag){ color: #fff; } body[data-videos="1"] .col .box, body[data-view="channel"] .col .box, body[data-view="watch"] .col .box{ border-color: #aaa; background: #111; } body[data-videos="1"] .col .content a.btn:not(:hover), body[data-videos="1"] .col .content a.tag:not(:hover), body[data-view="channel"] .col .content a.btn:not(:hover), body[data-view="channel"] .col .content a.tag:not(:hover), body[data-view="watch"] .col .content a.btn:not(:hover), body[data-view="watch"] .col .content a.tag:not(:hover){ background: #111; } body[data-videos="1"] .view.detail .col.side.left .fader{ background: -moz-linear-gradient(top, rgba(0,0,0,1) 68%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,1) 68%,rgba(0,0,0,0) 100%); background: linear-gradient(to bottom, rgba(0,0,0,1) 68%,rgba(0,0,0,0) 100%); } body[data-videos="1"] .view.detail .col .box.thumb .overlay_bottom{ position: absolute; top: 66px; left: 0px; width: 160px; } body[data-videos="1"] .view.detail .col .box.thumb .duration{ position: absolute; top: 0px; right: 0px; margin: 5px; padding: 1px 4px; border-radius: 2px; font-size: 12px; color: #eee; background-color: hsla(0,0%,6.7%,.8); } body[data-videos="1"] .view .col .content .box{ border: none; box-shadow: none; } body[data-videos="1"] .box img{ background-color: #333; } .player_container_preview{ position: relative; } .player_container_preview img{ margin: 0; width: 100%; margin-bottom: -4px; } .player_container_preview .title{ position: absolute; bottom: 0; left: 0; padding: 4%; font-size: 21px; z-index: 1; } .player_container_preview .title b{ font-size: 25px; text-transform: uppercase; } .player_container_preview:after{ content: ' '; position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: 100%; width: 100%; background: -moz-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.64) 80%); background: -webkit-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.64) 80%); background: linear-gradient(185deg ,rgba(0,0,0,0) 20%,rgba(0,0,0,.64) 80%); } .col .content .player_container_preview .btn{ width: 240px; height: auto; border-radius: 50px; font-size: 20px; padding: 10px 20px; z-index: 1; margin-top: 18px; display: block; } body.screen-small .col .content .player_container_preview .btn{ width: 200px; font-size: 17px; padding: 4px; } @media screen and (max-width: 540px){ .player_container_preview img{ height: 90vw; } .player_container_preview .title{ padding-bottom: 6%; } .player_container_preview .title b{ font-size: 19px; } } .player_container { position: relative; width: 100%; } .player_container:before { content: ""; display: block; padding-top: 56.25%; } .player{ background: #181818; position: absolute; top: 0; left: 0; bottom: 0; right: 0; min-width: 100%; width: 100px; *width: 100%; height: 100%; } body[data-videos="1"] .view.detail .col.main .playerembed_button{ position: relative; float: right; padding: 5px 10px; } body[data-videos="1"] .view.detail .col.main .playerembed_button .btn{; padding: 0 8px; } body[data-videos="1"] .view.detail .col.main .playerembed_box{ position: absolute; background: #fff; color: #000; top: -5px; right: 0px; display: none; padding: 10px; width: 340px; pointer-events: none; z-index: 1; } body[data-videos="1"] .view.detail .col.main .playerembed_box h2{ margin: 4px 0 10px 0; font-size: 16px; } body[data-videos="1"] .view.detail .col.main .playerembed_box .icon-close{ position: absolute; top: 3px; right: 0; padding: 10px; pointer-events: auto; cursor: pointer; } body[data-videos="1"] .view.detail .col.main .playerembed_box textarea{ width: 100%; height: 70px; padding: 6px; font-family: monospace; font-size: 12px; pointer-events: auto; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .text.headline{ width: 100%; padding-left: 3%; padding-right: 2%; padding-bottom: 0; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .text.body{ padding: 0 3% 20px 3%; min-height: auto; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .text.body .duration, body[data-videos="1"] .view.detail .col.main > .content > .box.video .text.body .moment{ display: inline-block; font-size: 14px; color: #9da2a8; margin-top: 10px; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .text.body .moment{ float: right; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .text.body .tags{ margin-top: 12px; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .teamtag{ margin: 6px 4px 12px 4px; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .teamtag img{ vertical-align: middle; height: 32px; margin-right: 3px; background: none; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .teamtag .follow{ margin-left: 5px; } body[data-videos="1"] .view.detail .col .box .text div.phold{ width: 40% } body[data-videos="1"] .view.detail .col .box .text div.phold:first-child{ width: 37% } .totop{ position: fixed; top: -100px; left: -100px; display: none; } @media screen and (max-width: 799px){ body[data-videos="1"] .view.detail .col.side.left{ top: calc(100vw * 0.5625 + 92px); display: block; position: relative; width: 100%; transition: top 0.25s ease-in-out, padding-top 0.25s ease-in-out; } body[data-videos="1"] .view.detail .col.side.left .content{ width: 100%; padding-right: 0; } body[data-videos="1"] .view.detail .col.side.left .content a.box{ width: 100%; } body[data-videos="1"] .view.detail .col.main .box.video{ position: absolute; top: 91px; right: 0; width: 100%; transition: width 0.75s ease-in-out; } body[data-videos="1"] .view.detail .col.main .box.video{ top: 82px; } body[data-videos="1"] .view.detail .col.main .videometa{ padding-bottom: 10px; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .text.headline{ display: block; position: relative; padding-right: 33px; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .text.headline h2{ font-size: 20px; margin-top: 10px; margin-bottom: 0px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .videometa.open .text.headline h2{ display: block; white-space: normal; text-overflow: inherit; overflow: inherit; max-width: 100%; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .videometa .text.headline:before{ font-family: 'icomoon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f078"; position: absolute; top: 22px; right: 14px; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .videometa.open .text.headline:before{ content: "\f077"; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .teamtag .follow{ float: right; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .text.body{ display: none; border-top: 0.75px solid rgba(255,255,255,0.5); margin-top: 15px; padding-top: 20px; padding-bottom: 10px; } body[data-videos="1"] .view.detail .col.main > .content > .box.video .videometa.open .text.body{ display: block; } body[data-videos="1"] .view.detail .col.main .box.video.fly{ position: fixed; top: 47px; z-index: 100; } body[data-videos="1"] .view.detail .col.main .box.video.fly{ top: 34px; } body[data-videos="1"] .view.detail .col.main .box.video.fly .videometa{ display: none; } body[data-videos="1"] .totop{ position: fixed; top: auto; left: auto; bottom: 10px; right: 10px; z-index: 100; width: 30px; height: 30px; text-align: center; background: rgba(0,0,0,0.5); border: 1px solid rgba(255,255,255,0.5); } body[data-videos="1"] .totop .icon{ line-height: 27px; } } .player_box.sticky{ position: fixed !important; z-index: 100 !important; } .player_box iframe.sticky, .box .img.sticky{ position: fixed !important; top: 88px; left: 0; z-index: 100 !important; padding: 0 !important; } .view.channel{ max-width: 1440px; margin: auto; } .view.channel .col .box { margin-left: 0; margin-right: 0; margin-top: 3%; border: none; } body[data-widget="startsite"] .view.channel .col .box[data-playlist="welovefootball"]{ margin-top: 0px; } .player_box, .channel_player{ position: relative; width: 100%; } .player_box:before, .channel_player:before{ content: ""; display: block; padding-top: 56.25%; } .channel_player_text{ padding: 0 15px 12px 16px; } @media screen and (max-width: 799px){ .channel_player_text h2{ position: relative; font-size: 20px; margin-top: 10px; margin-bottom: 0px; padding-right: 24px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .channel_player_text.open h2{ display: block; white-space: normal; text-overflow: inherit; overflow: inherit; max-width: 100%; } .channel_player_text h2:before{ font-family: 'icomoon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f078"; position: absolute; top: 0px; right: 0px; } .channel_player_text.open h2:before{ content: "\f077"; } .channel_player_text .description{ display: none; margin-top: 16px; } .channel_player_text.open .description{ display: block; } } @media screen and (min-width: 800px){ .channel_player{ display: inline-block; width: 60%; } .channel_player_text{ display: inline-block; width: 40%; vertical-align: top; padding: 0 0 0 20px; } .channel_player_text h2{ margin-top: 0; } } .view.home .col.main .player_box{ padding: 0; } .pl_slider_box{ position: relative; height: 266px; overflow-y: hidden; } .view .col.main .pl_slider_box.videoplayer_slider{ height: 223px; background: #111; border-top: 9px solid #111 !important; } .view.home .col.main .pl_slider_box.videoplayer_slider{ margin-top: -16px; } .view.detail .col.main .box-footer{ padding: 10px; background: #111; } .view .col.main .videoplayer_slider+.box.box-footer{ color: #fff; background: #111; } body[data-view="channel"] .col .pl_slider_box[data-playlist="teamstream"]{ background-color: rgb(0,45,50); } body[data-view="channel"] .col .pl_slider_box[data-playlist="teamstream"] .icon-profil { position: absolute; top: 10px; right: 13px; font-size: 20px; background: #eff0f3; color: var(--text-color); padding: 5px 8px 7px 8px; border-radius: 16px; z-index: 2; } .pl_slider{ overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; height: 290px; padding: 5px 0 14px 0; } .view.home .col.main .pl_slider_box.videoplayer_slider .pl_slider{ padding-left: 0; padding-right: 0; } .pl_slider_headline h3{ margin: 15px 10px 9px 21px; color: #fff; } .pl_slider_item.more .icon-right, .pl_slider_headline h3 .icon-right{ color: #fff; display: inline-block; vertical-align: middle; font-size: 18px; line-height: 22px; margin-left: 6px; margin-top: -4px; } .pl_slider_item.more .btn{ margin: 38% auto; display: block; width: 140px; } .pl_slider_item{ position: relative; width: 220px; height: 200px; display: inline-block; text-align: left; white-space: normal; vertical-align: top; margin-right: 14px; overflow: hidden; transition: transform 0.25s ease-in-out, height 0.25s ease-in-out; } .pl_slider_item.more{ color: #fff; } .pl_slider_item.more:hover{ color: var(--highlight); } .pl_slider_item.more div{ position: absolute; width: 100%; top: 50%; height: 24px; margin-top: -12px; text-align: center; } .pl_slider_item.more .icon-arrow-right{ vertical-align: middle; } .pl_slider > a:hover .pl_slider_item{ transform: scale(1.05); z-index: 1; outline: 6px solid rgba(0,0,0,0.5); } .pl_slider_box[data-playlist="teamstream"] .pl_slider > a:hover .pl_slider_item{ outline-color: rgba(0,45,50,.8); } .box .plusicon{ background: transparent; position: absolute; top: 6px; right: 6px; width: 36px; z-index: 1; } .box .pl_slider_item_image{ width: 220px; height: 125px; background: #333; } .box .pl_slider_item_channelimage{ position: absolute; top: 7px; left: 7px; width: 42px; height: 24px; background: transparent;; } .box .pl_slider_item_ligaimage{ position: absolute; top: 9px; left: 9px; width: 42px; height: 42px; background: transparent; z-index: 2; } .pl_slider_item .playoverlay{ font-size: 50px; margin: -25px 0 0 -25px; opacity: 0; transition: opacity 0.25s ease-in-out; } .pl_slider_item:hover .playoverlay{ opacity: 0.8; } .pl_slider_item_duration{ position: absolute; top: 0px; right: 0px; margin: 5px; padding: 1px 4px; border-radius: 6px; font-size: 12px; color: #eee; background-color: hsla(0,0%,6.7%,.8); } .pl_slider > a:hover .pl_slider_item_duration{ font-size: 9px; } .pl_slider_item_title{ position: absolute; font-family: var(--default-font); width: 100%; min-height: 74px; bottom: 0px; padding: 12px 5px 20px 5px; background-color: hsla(0,0%,6.7%,.8); color: #fff; z-index: 1; } .pl_slider_box[data-playlist="teamstream"] .pl_slider_item_title{ background-color: rgba(0,45,50,.8); } body[data-view="channel"] .pl_slider > a:hover .pl_slider_item_title{ font-size: 12px; padding-top: 36%; padding-bottom: 7.5%; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.85) 50%, rgba(0,0,0,0.95) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.85) 50%,rgba(0,0,0,0.95) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.85) 50%,rgba(0,0,0,0.95) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#f2000000',GradientType=0 ); } .pl_slider_item_title p{ margin: 0; } .col .box .pl_slider_item .moment{ position: absolute; right: 5px; bottom: 2px; color: rgba(255, 255, 255, 0.6); z-index: 1; } body[data-view="channel"] .pl_slider > a:hover .pl_slider_item .moment{ font-size: 9px; } .col .box .pl_sliderwatchnow .pl_slider_item .moment, .col .box .pl_slidercurrent_program .pl_slider_item .moment { bottom: 3px; left: 5px; right: auto; width: 63px; height: 59px; font-size: 23px; line-height: 23px; text-align: center; padding: 6px 4px; border-right: 1px solid #777; color: #999; border-radius: 2px; } body[data-view="channel"] .pl_slidercurrent_program > a:hover .pl_slider_item .moment{ font-size: 23px; } .col .box .pl_sliderwatchnow .pl_slider_item.live .moment, .col .box .pl_slidercurrent_program .pl_slider_item.live .moment { color: var(--highlight); } .col .box .pl_sliderwatchnow .pl_slider_item.live .moment span, .col .box .pl_slidercurrent_program .pl_slider_item.live .moment span{ font-size: 20px; } .col .box .pl_sliderwatchnow .pl_slider_item .moment{ bottom: 14px; width: 55px; height: 43px; padding: 4px 0px; font-size: 20px; line-height: 18px; } .col .box .pl_sliderwatchnow .pl_slider_item.live .moment span{ font-size: 16px; } .pl_slider_nav{ position: absolute; top: 50%; width: 40px; height: 50px; margin-top: -25px; vertical-align: middle; text-align: center; line-height: 54px; font-size: 40px; background: #eff0f3; color: var(--highlight); cursor: pointer; z-index: 3; } .slider_prev:hover, .slider_next:hover, .pl_slider_nav:hover{ background: rgba(255, 255, 255, 0.9); color: var(--highlight); } .pl_slider_nav.left{ left: 0; padding-right: 2px; display: none; } .pl_slider_nav.right{ right: 0; padding-left: 2px; } body.screen-large .pl_slider_box .pl_slider > a:hover .pl_slider_item { transform: scale(1.05) translateY(5px); height: 187px; z-index: 2; } body.screen-large .pl_slider_box .pl_slider > a:first-child:hover .pl_slider_item { transform: scale(1.05) translateY(5px) translateX(11px); } body.screen-large .pl_slider_box .pl_slider > a:last-child:hover .pl_slider_item { transform: scale(1.05) translateY(5px) translateX(-11px); } .pl_slider_box.large{ height: 321px; } .pl_slider_box.large .pl_slider{ height: 340px; } .pl_slider_box.large .pl_slider_item{ width: 320px; height: 254px; } .pl_slider_box.large .pl_slider_item_title{ padding-left: 79px; } .pl_slider_box.large .pl_slider_item_image{ width: 320px; height: 180px; } body.screen-large .pl_slider_box.large .pl_slider > a:hover .pl_slider_item_title{ font-size: 15px; padding-bottom: 7.5%; } body.screen-large .pl_slider_box.large .pl_slider > a:hover .pl_slider_item { transform: scale(1.4) translateY(21px); height: 193px; } body.screen-large .pl_slider_box.large .pl_slider > a:first-child:hover .pl_slider_item { transform: scale(1.4) translateY(21px) translateX(43px); } body.screen-large .pl_slider_box.large .pl_slider > a:last-child:hover .pl_slider_item { transform: scale(1.4) translateY(21px) translateX(-43px); } .pl_slider_box.poster{ height: 511px; } .pl_slider_box.poster .pl_slider_headline h3{ margin-bottom: 3px; } .pl_slider_box.poster .pl_slider{ height: 520px; padding-top: 11px; } .pl_slider_box.poster .pl_slider_item{ width: 280px; height: 440px; } .pl_slider_box.poster .pl_slider_item_title{ padding: 12px; padding-bottom: 9%; } .pl_slider_box.poster .pl_slider_item_image{ width: 280px; height: 366px; } body.screen-large .pl_slider_box.poster .pl_slider > a:hover .pl_slider_item_title{ font-size: 15px; } body.screen-large .pl_slider_box.poster .pl_slider > a:hover .pl_slider_item { transform: scale(1.25) translateY(28px); height: 369px; } body.screen-large .pl_slider_box.poster .pl_slider > a:first-child:hover .pl_slider_item { transform: scale(1.25) translateY(28px) translateX(28px); } body.screen-large .pl_slider_box.poster .pl_slider > a:last-child:hover .pl_slider_item { transform: scale(1.25) translateY(28px) translateX(-28px); } .box[data-playlist="watchnow"].pl_slider_box{ height: 180px; background: #111; } .box[data-playlist="watchnow"] .pl_slider_headline h3{ margin-top: 0; margin-left: 0; } .box[data-playlist="watchnow"] .pl_slider_headline h3 .icon-right{ display: none; } .box[data-playlist="watchnow"] .pl_slider{ height: 150px; padding-left: 0; padding-right: 0; } .box[data-playlist="watchnow"] .pl_slider_item{ height: 125px; overflow: hidden; } .box[data-playlist="watchnow"] .pl_slider_item_ligaimage{ width: auto; height: 24px; color: #fff; text-transform: uppercase; } .box[data-playlist="watchnow"] .pl_slider_item_title{ background: -moz-linear-gradient(top, rgba(17,17,17,0) 0%, rgba(17,17,17,0.8) 50%, rgba(17,17,17,0.9) 100%); background: -webkit-linear-gradient(top, rgba(17,17,17,0) 0%,rgba(17,17,17,0.8) 50%,rgba(17,17,17,0.9) 100%); background: linear-gradient(to bottom, rgba(17,17,17,0) 0%,rgba(17,17,17,0.8) 50%,rgba(17,17,17,0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00111111', endColorstr='#e6111111',GradientType=0 ); padding: 40px 10px 10px 70px; min-height: 94px; } .smallhomeoverview .liveticker_slider_box{ max-height: 316px; margin-bottom: 0; animation: liveticker_slider-fadein 1s ease-in-out forwards; } @keyframes liveticker_slider-fadein{ 0% { opacity: 0; transform: scale(.95); } 50% { opacity: 0; transform: scale(.95); } 100% { opacity: 1; transform: scale(1); } } .smallhomeoverview .col .pl_slider_box{ background: #fff; border-radius: 8px !important; height: 296px; } .smallhomeoverview .pl_slider{ padding-top: 8px; padding-left: 12px; padding-right: 12px; } .smallhomeoverview .pl_slider_headline h3{ color: #111; } .smallhomeoverview .pl_slider_item{ width: 300px; height: 230px; background: #111; margin-right: 12px; } .smallhomeoverview .box .pl_slider_item_image{ width: auto; height: auto; transform: translateY(0px); transition: transform 0.25s ease-in-out; } .smallhomeoverview .pl_slider_item_title{ min-height: 60px; padding: 10px 15px; } .smallhomeoverview .pl_slider > a:hover .pl_slider_item{ outline: 0px solid rgba(255,255,255,0.5); } .smallhomeoverview .pl_slider > a:hover .pl_slider_item_image{ transform: translateY(-8px); } body.screen-large .smallhomeoverview .pl_slider_box .pl_slider > a:hover .pl_slider_item { transform: scale(1.05) translateY(4px); height: 221px; } .smallhomeoverview .box .plusicon{ top: 8px; right: 8px; width: 54px; } .smallhomeoverview .box .pl_slider_item .moment{ left: 11px; right: auto; bottom: 68px; color: #eee; background: rgba(0,0,0,0.7); padding: 3px 8px; border-radius: 6px; } .smallhomeoverview .box .pl_slider_item .moment.live:before{ content: ' '; height: 9px; width: 9px; vertical-align: middle; margin-top: -3px; margin-right: 5px; background-color: var(--highlight); border-radius: 50%; display: inline-block; } .streaming-slider .pl_slider_item{ width: 232px; height: 190px; border-radius: 8px; } body.screen-large .streaming-slider .pl_slider_box .pl_slider > a:hover .pl_slider_item{ height: 190px; } .streaming-slider .pl_slider > a:hover .pl_slider_item{ transform: scale(1.05); z-index: 1; outline: none; } body.screen-large .streaming-slider .pl_slider_box .pl_slider > a:hover .pl_slider_item, body.screen-large .streaming-slider .pl_slider_box .pl_slider > a:first-child:hover .pl_slider_item{ transform: scale(1.02) translateY(-1px); } .pl_grid_items{ margin-top: 12px; } .pl_grid_item{ position: relative; width: 24.25%; min-height: 210px; display: inline-block; text-align: left; white-space: normal; vertical-align: top; margin-right: 1%; margin-bottom: 1%; padding-bottom: 112px; } .pl_grid_items:not(.fivepack) > a:nth-child(4n) .pl_grid_item{ margin-right: 0%; } .pl_grid_item_image{ width: 100%; max-height: 220px; background: #333; } .pl_grid_item.large .pl_grid_item_image{ max-height: 335px; } .showgrid .pl_grid_item_image{ max-height: 400px; } .pl_grid_item_duration{ position: absolute; top: 0px; right: 0px; margin: 5px; padding: 1px 4px; border-radius: 2px; font-size: 12px; color: #eee; background-color: hsla(0,0%,6.7%,.8); } .pl_grid_item_title{ position: absolute; width: 100%; min-height: 108px; bottom: 8px; padding: 12px 10px 20px 56px; background-color: hsla(0,0%,6.7%,.8); color: #fff; } .pl_grid_item.showgrid .pl_grid_item_title{ padding-left: 10px; } .pl_grid_item_title h3{ font-size: 18px; margin: 0; } .pl_grid_items.fivepack .pl_grid_item_title h3{ font-size: 22px; } .pl_grid_items.fivepack .pl_grid_item.large .pl_grid_item_title h3{ font-size: 24px; } .pl_grid_item_title h3 p{ margin: 0;.view.home .col.main .box } .pl_grid_item .date{ position: absolute; top: 0px; left: 0px; width: 54px; font-size: 16px; padding: 8px 0; text-align: center; opacity: 0.6; } .pl_grid_item .date b{ font-size: 29px; } .pl_grid_item .number{ position: absolute; bottom: 60px; left: 11px; width: 35px; font-size: 24px; text-align: center; background: #fff; color: #000; padding: 4px 0; } .pl_grid_item.large .number{ font-weight: bold; font-size: 30px; padding: 0px 0 2px 0; } .pl_grid_item .playoverlay{ top: 32px; left: 27px; font-size: 32px; margin: -16px 0 0 -16px; } .pl_grid_items > a:hover .pl_grid_item .playoverlay{ color: var(--highlight); } .pl_grid_item .moment{ position: absolute; top: -24px; right: 0px; margin: 5px; padding: 1px 4px; border-radius: 2px; font-size: 12px; color: #eee; background-color: hsla(0,0%,6.7%,.8); } @media screen and (min-width: 1480px){ .pl_grid_item{ width: 19.2%; } .pl_grid_items > a:nth-child(4n) .pl_grid_item{ margin-right: 1%; } .pl_grid_items > a:nth-child(5n) .pl_grid_item{ margin-right: 0%; } } @media screen and (max-width: 1024px){ .pl_grid_item{ width: 32.66%; } .pl_grid_items > a:nth-child(4n) .pl_grid_item{ margin-right: 1%; } .pl_grid_items > a:nth-child(3n) .pl_grid_item{ margin-right: 0%; } } @media screen and (max-width: 780px){ .pl_grid_item{ width: 49.5%; } .pl_grid_items > a:nth-child(3n) .pl_grid_item{ margin-right: 1%; } .pl_grid_items > a:nth-child(2n) .pl_grid_item{ margin-right: 0%; } } @media screen and (max-width: 500px){ .pl_grid_item.showgrid{ min-height: 400px; } .pl_grid_item.showgrid .pl_grid_item_title{ min-height: 100px; } .pl_grid_item:not(.showgrid){ width: 100%; } .pl_grid_items > a .pl_grid_item:not(.showgrid){ margin-right: 0%; } } @media screen and (max-width: 400px){ .pl_grid_item.showgrid .pl_grid_item_title{ min-height: 135px; } } @media screen and (max-width: 779px){ .pl_grid_items.fivepack > a:nth-child(5n) .pl_grid_item{ display: none; } } @media screen and (min-width: 780px){ .pl_grid_items.fivepack .pl_grid_item{ width: 32.6%; } .pl_grid_items.fivepack .pl_grid_item.large{ width: 49.5%; } .pl_grid_items.fivepack > a:nth-child(3n) .pl_grid_item, .pl_grid_items.fivepack > a:nth-child(4n) .pl_grid_item{ margin-right: 1%; } .pl_grid_items.fivepack > a:nth-child(2n) .pl_grid_item.large{ margin-right: 0%; } .pl_grid_items.fivepack > a:nth-child(5n) .pl_grid_item{ margin-right: 0%; } } .teamslider{ overflow: hidden; height: 170px; } .teamslider_row{ overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; height: 190px; padding: 8px 20px 14px 20px; } .teamslider .team{ position: relative; width: 120px; display: inline-block; text-align: center; white-space: normal; vertical-align: top; padding-left: 13px; padding-right: 14px; } .teamslider .team div{ padding-top: 16px; } .teamslider .team img{ max-width: 100%; background: transparent; transition: transform 0.25s ease-in-out; } .teamslider .team:hover img{ transform: scale(1.07); } .sphdshow_label { position: absolute; text-align: center; font-size: 11px; word-spacing: 2px; margin-top: 2px; width: 100%; z-index: 1; color: #fff; text-shadow: 0 0 6px #000; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @media (min-width: 430px){ .sphdshow_label { font-size: 14px; } } @media (min-width: 1024px){ .sphdshow_label { font-size: 16px; margin-top: 4px; } } @media (min-width: 1200px){ .sphdshow_label { font-size: 17px; margin-top: 8px; } } div.showheader{ position: relative; color: #fff; background-size: 100%; background-size: cover; background-repeat: no-repeat; background-position: right center; clear: both; } .showheader .meta { width: 580px; max-width: 80%; padding: 20px 10% 20px 20px; background: -moz-linear-gradient(left, rgba(0,0,0,0.9) 60%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(left, rgba(0,0,0,0.9) 60%,rgba(0,0,0,0) 100%); background: linear-gradient(to right, rgba(0,0,0,0.9) 60%,rgba(0,0,0,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); } .showheader .sphdshow_label{ width: auto; left: 21px; } .showheader .showlogo{ max-width: 60%; max-height: 100px; margin-bottom: 15px; margin-top: 50px; } .showheader .description{ max-width: 60%; margin: 20px 0; } @media (max-width: 640px){ .showheader .meta { background: -moz-linear-gradient(45deg, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%), -moz-linear-gradient(left, rgba(0,0,0,0.6) 60%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(45deg, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%), -webkit-linear-gradient(left, rgba(0,0,0,0.6) 60%,rgba(0,0,0,0) 100%); background: linear-gradient(45deg, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%), linear-gradient(to right, rgba(0,0,0,0.6) 60%,rgba(0,0,0,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); } .showheader div.transmission, .showheader div.description{ display: none; } } .showselect_container{ max-width: 100%; overflow: hidden; height: 40px; } .showselect{ max-width: 100%; height: 60px; white-space: nowrap; overflow-y: hidden; overflow-x: scroll; padding: 6px 10px 0 10px; } .showselect .tab{ text-transform: uppercase; white-space: nowrap; } .showselect .tab span { display: inline-block; padding: 6px 12px; border-bottom: 4px solid transparent; transition: border-bottom 200ms ease-in-out; color: #fff; } .showselect .tab:hover span, .showselect .tab.active span { opacity: 1; border-bottom-color: var(--highlight); } .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } .slick-loading .slick-list { background: #fff url('../img/bg-loader.gif') center center no-repeat; } .slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 20px; height: 20px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent; } .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { color: transparent; outline: none; background: transparent; } .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; } .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: .25; } .slick-prev:before, .slick-next:before { font-family: 'icomoon'; font-size: 20px; line-height: 1; opacity: .75; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-prev { left: -25px; } [dir='rtl'] .slick-prev { right: -25px; left: auto; } .slick-prev:before { content: "\f053"; } [dir='rtl'] .slick-prev:before { content: "\f054"; } .slick-next { right: -25px; } [dir='rtl'] .slick-next { right: auto; left: -25px; } .slick-next:before { content: "\f054"; } [dir='rtl'] .slick-next:before { content: "\f053"; } .slick-dotted.slick-slider { margin-bottom: 30px; } .slick-dots { position: absolute; bottom: -25px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; } .slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; } .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; } .slick-dots li button:hover, .slick-dots li button:focus { outline: none; } .slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; } .slick-dots li button:before { font-size: 6px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; text-align: center; opacity: .25; color: black; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-dots li.slick-active button:before { opacity: .75; color: black; } .slider_prev, .slider_next { position: absolute; top: 50%; height: 36px; width: 30px; margin-top: -18px; text-align: center; line-height: 42px; background-color: #eff0f3; background-repeat: no-repeat; background-position: center center; background-size: 30px; color: var(--highlight); border-radius: 0; cursor: pointer; z-index: 2; opacity: 0; -moz-transition: opacity .3s cubic-bezier(0.4,0.0,1,1), -moz-transform 0.5s ease-in; -webkit-transition: opacity .3s cubic-bezier(0.4,0.0,1,1), -webkit-transform 0.5s ease-in; transition: opacity .3s cubic-bezier(0.4,0.0,1,1), transform 0.5s ease-in; } body.screen-large .slider_prev, body.screen-medium .slider_prev, body.screen-large .slider_next, body.screen-medium .slider_next{ height: 48px; width: 41px; font-size: 40px; line-height: 54px; margin-top: -24px; background-size: 40px; } body.can-touch .slider_prev, body.can-touch .slider_next{ display: none; } .slider_container:hover .slider_prev, .slider_container:hover .slider_next { opacity: 1; -webkit-box-shadow: 0px 4px 15px 0px rgba(0,0,0,0.18); box-shadow: 0px 4px 15px 0px rgba(0,0,0,0.18); } .slider .slider_cell.current{ border-left: 4px solid var(--highlight); } .slider_prev{ left: -40px; } .slider_next{ right: -40px; } body:not(.can-touch) .slider_prev.active{ -moz-transform: translateX(45px); -webkit-transform: translateX(45px); transform: translateX(45px); } body:not(.can-touch) .slider_next.active{ -moz-transform: translateX(-45px); -webkit-transform: translateX(-45px); transform: translateX(-45px); } body.screen-large .slider_prev, body.screen-medium .slider_prev{ left: -70px; } body.screen-large .slider_next, body.screen-medium .slider_next{ right: -70px; } body.screen-large .slider_prev.active, body.screen-medium .slider_prev.active{ -moz-transform: translateX(77px); -webkit-transform: translateX(77px); transform: translateX(77px); } body.screen-large .slider_next.active, body.screen-medium .slider_next.active{ -moz-transform: translateX(-77px); -webkit-transform: translateX(-77px); transform: translateX(-77px); } .slick-slide { margin: 0px 4px; position: relative; } .slick-slide .image{ background-repeat: no-repeat; background-position: center center; background-size: 100%; background-size: cover; width: 100%; height: 50vh; min-height: 280px; } .slick-prev{ left: 15px; z-index: 1; } .slick-next{ right: 15px; } .slick-prev:before, .slick-next:before { color: black; } body.screen-large .slick-slider .slider_prev, body.screen-medium .slick-slider .slider_prev{ left: 0; opacity: 1; } body.screen-large .slick-slider .slider_next, body.screen-medium .slick-slider .slider_next{ right: 0; opacity: 1; } .slick-dotted.slick-slider{ margin-bottom: 0; } .slick-dots{ bottom: -3px; } .slick-dots li{ margin: 0 8px; } .slick-dots li button{ background: #626262; width: 26px; height: 6px; padding: 0px; box-shadow: 0 0 20px #000; } .slick-dots li.slick-active button{ background: #aaa; } @media( max-width: 800px ){ .slick-dots{ bottom: 3%; } .slick-dots li{ width: 1px; height: 1px; } .slick-dots li button{ width: 13px; } } img.alignleft{ display: block; max-width: 100%; height: auto; margin-bottom: 12px; } @media( min-width: 680px ){ img.alignleft{ max-width: 50%; float: left; margin-right: 14px; } } .col .showslider.phold{ display: block; width: 100%; height: auto; margin: auto; } .showslider.phold .slick-slide { width: 100%; height: 600px; display: block; } .showslider, .showslider .slick-slide { max-height: 50vw; overflow: hidden; } @media (min-width: 640px){ .showslider, .showslider .slick-slide { max-height: 34vw; } } @media (min-width: 1024px){ .showslider, .showslider .slick-slide { max-height: 26vw; } } .showslider .bgimg{ width: 100%; display: block; height: auto; -moz-user-select: none; } .col .content .showslider a{ color: #fff; } .showslider .meta { position: absolute; top: 0px; bottom: 0px; left: 0px; width: 100%; padding: 20px 10% 20px 20px; background: -moz-linear-gradient(27deg, rgba(0,0,0,0.7) 16%, rgba(0,0,0,0) 60%); background: -webkit-linear-gradient(27deg, rgba(0,0,0,0.7) 16%,rgba(0,0,0,0) 60%); background: linear-gradient(27deg, rgba(0,0,0,0.7) 16%,rgba(0,0,0,0) 60%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); } .showslider .meta > div { position: absolute; bottom: 8%; width: 100%; } .showslider img.logo { width: auto; max-height: 50px; margin-bottom: 2%; margin-left: 20px; } .showslider img.logo.liga{ max-width: 60px; max-height: 60px; margin-bottom: 7%; } .showslider .date { font-size: 12px; margin: 0 0 0 7px; color: #999; } .showslider .time { float: left; font-size: 19px; line-height: 19px; padding: 5px 12px 5px 2px; margin: 4px 6px 8px 0; border-right: 1px solid #777; color: #999; text-align: center; } .showslider .title { font-size: 17px; line-height: 20px; margin: 6px 0px 3px 47px; text-transform: uppercase; width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-shadow: 0 0 2px #000, 0 0 10px #000; } .showslider .guests { font-size: 13px; line-height: 15px; margin: 0px 0px 0px 47px; width: 80%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .showslider .btn { text-align: center; border: 1px solid #fff; display: inline-block; text-decoration: none; text-transform: uppercase; cursor: pointer; margin-top: 3px; margin-left: 20px; font-size: 11px; padding: 0px 4px; } .showslider .sphdshow_label{ width: auto; top: 3%; left: 25px; } @media (min-width: 600px){ .showslider .sphdshow_label{ left: 51px; } .showslider img.logo { max-width: 20%; width: 100%; max-height: none; margin-left: 28px; margin-bottom: 2.5%; } .showslider img.logo.liga{ max-width: 70px; max-height: 70px; margin-bottom: 5%; } .showslider .date { font-size: 18px; margin: 0 0 3px 7px; } .showslider .time { font-size: 26px; line-height: 26px; padding: 7px 20px 7px 5px; margin: 5px 18px 15px 0; } .showslider .title { font-size: 32px; line-height: 34px; margin: 7px 0px 7px 73px; width: 75%; } .showslider .guests { font-size: 16px; line-height: 18px; margin: 5px 0px 2px 73px; width: 75%; } .showslider .btn { margin-top: 10px; margin-left: 30px; font-size: 13px; padding: 4px 9px; } .showslider .sphdshow_label{ left: 41px; } } @media (min-width: 800px){ .showslider img.logo { max-width: 16%; } .showslider img.logo.liga{ max-width: 110px; max-height: 110px; } .showslider .title, .showslider .guests { white-space: normal; } } body[data-view="watch"] .player_container{ max-width: 1080px; margin: auto; } .epgtitle{ margin-top: 40px; padding-left: 20px; padding-right: 20px; text-align: center; } .epgitem{ position: relative; border-bottom: 1px solid #222; padding: 18px 10px 22px 10px; min-height: 58px; } .epgitem.live{ min-height: 92px; } .epgitem .channel{ width: 67px; margin-bottom: -7px; text-align: center; vertical-align: middle; display: inline-block; font-size: 22px; } .epgitem .channel.sport{ overflow: hidden; text-align: center; } .epgitem .channel img{ width: 48px; } .epgitem .channel.sport img{ width: 32px; } body[data-view="watch"] .col .content .epgitem .channel.sport span{ display: inline-block; font-size: 11px; text-transform: uppercase; padding: 5px; } .epgitem .channel a.more{ font-size: 12px; display: block; padding: 4px 0 0 2px; } .epgitem .channel a.more .icon-arrow-right{ color: var(--highlight); border: 1px solid var(--highlight); border-radius: 8px; display: inline-block; width: 16px; height: 16px; text-align: center; font-size: 10px; line-height: 14px; margin-left: 1px; } .epgitem .moment{ display: inline-block; padding: 3px 16px 3px 0px; margin-right: 13px; vertical-align: middle; color: #999; } .epgitem.replay .moment, .epgitem.upcoming .moment{ padding-left: 16px; } .epgitem .moment .date{ display: inline-block; vertical-align: middle; } .epgitem .moment .date b{ font-size: 24px; } .epgitem .moment .time{ display: inline-block; vertical-align: middle; } .epgitem.livenow .moment .time{ color: var(--highlight); } .epgitem.livenow .moment b{ font-size: 16px; } .epgitem.livenow .moment span{ font-size: 14px; } .epgitem .moment .icon-small-right{ display: inline-block; vertical-align: middle; padding: 0 8px 0 10px; } .epgitem .program_image{ width: 140px; height: 80px; vertical-align: middle; display: inline-block; margin-right: 10px; margin-left: 10px; background: #222; } .epgitem .title{ display: block; padding-right: 28px; font-size: 20px; margin-top: 3px; margin-bottom: -3px; } .epgitem.replay .title, .epgitem.upcoming .title{ padding-left: 16px; } .epgitem .title .icon-small-up, .epgitem .title .icon-small-down{ padding: 4px; cursor: pointer; } .epgitem .description{ padding: 12px 20px 4px 0px; display: none; } .epgitem.open .description{ display: block; } .epgitem.live .description{ padding-right: 40px; } .epgitem .opendesc{ position: absolute; top: 57px; right: 0px; margin-top: -33px; width: 24px; height: 66px; padding: 26px 31px 0 13px; } .epg_date_chooser_container{ max-width: 100%; overflow: hidden; height: 47px; background: #222; margin: 0px auto 8px auto; text-align: center; width: -webkit-fill-available; } .epg_date_chooser{ max-width: 100%; height: 66px; white-space: nowrap; overflow-y: hidden; overflow-x: scroll; padding: 6px 10px 0 10px; } .epg_date_chooser .tab{ display: inline-block; text-transform: uppercase; white-space: nowrap; width: 80px; opacity: 0.5; padding-bottom: 3px; cursor: pointer; font-size: 13px; } .epg_date_chooser .tab b{ display: block; font-size: 15px; } .epg_date_chooser .tab:hover, .epg_date_chooser .tab.active{ opacity: 1; } .epg_date_chooser .tab.active{ border-bottom: 2px solid #fff; } @media (min-width: 480px){ .epgitem .channel{ width: 80px; margin-bottom: -5px; } .epgitem .moment{ border-right: 1px solid #666; padding-left: 10px; min-width: 68px; text-align: center; } .epgitem.livenow .moment .time b{ display: block; } .epgitem .title{ display: inline-block; padding: 0 0 0 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: calc(100% - 210px); vertical-align: text-bottom; } .epgitem .description{ padding-left: 90px; } .epgitem .opendesc{ top: 42px; } .epg_date_chooser_container{ position: absolute; left: 0; right: 0; } .epg_date_chooser_space{ height: 50px; } } #profil-float{ position: fixed; bottom: 25px; left: 13px; font-size: 28px; color: #333; background: #eff0f3; padding: 7px 10px 9px 10px; border-radius: 22px; box-shadow: 1px 2px 5px rgba(0,0,0,0.5), -5px 8px 28px rgba(0,0,0,0.75); transition: all 0.25s ease-in-out; z-index: 2; } body[data-view="teamstream_overview"] #profil-float, body[data-view="teamstream_settings"] #profil-float, body[data-tag="myteamstream"] #profil-float{ display: none; } body:not(.can-touch) #profil-float:hover{ background: #333; color: #eff0f3; } .newsslider_box{ position: relative; height: 324px; overflow-y: hidden; } .newsslider_headline{ padding-top: 2px; padding-left: 20px; } .newsslider_headline h3{ margin: 14px 0 10px 0; } .newsslider_slider{ overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; height: 302px; padding: 5px 20px 14px 20px; } .newsslider_slider > a{ position: relative; } .newsslider_slider > a .icon{ position: absolute; top: 3px; right: 23px; font-size: 20px; color: #fff; text-shadow: 0 0 1px #ccc; } .newsslider_fade{ position: absolute; top: 0px; width: 22px; height: 100%; z-index: 1; } .newsslider_fade_left{ position: absolute; top: 0px; width: 22px; height: 100%; z-index: 1; left: 0px; background: -moz-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(left, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); background: linear-gradient(to right, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); } .newsslider_fade_right{ position: absolute; top: 0px; width: 22px; height: 100%; z-index: 1; right: 0px; background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); } .newsslider_fade_bottom{ position: absolute; bottom: 0px; left: 0px; width: 100%; height: 30px; z-index: 1; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); } .newsslider_nav{ position: absolute; top: 50%; width: 40px; height: 50px; margin-top: -25px; vertical-align: middle; text-align: center; line-height: 20px; font-size: 46px; background: #eff0f3; cursor: pointer; z-index: 2; } body.can-touch .newsslider_nav{ display: none; } .newsslider_nav:hover{ background: #333; color: #fff; } .newsslider_nav.left{ left: 0; padding-right: 2px; display: none; } .newsslider_nav.right{ right: 0; padding-left: 2px; } .newsslider_item{ width: 220px; display: inline-block; text-align: left; white-space: normal; vertical-align: top; margin-right: 14px; cursor: pointer; } .newsslider_item .tag{ font-size: 13px; display: inline-block; color: var(--text-color2); min-height: 40px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; max-width: 100%; } .newsslider_item .tag .tagicon { vertical-align: middle; margin-bottom: 6px; margin-right: 8px; background: transparent; } .newsslider_item .tag div.tagicon { height: 32px; display: inline-block; margin-right: 0; } .newsslider_item h3{ font-size: 16px; line-height: 22px; margin-top: 5px; color: #fff; font-weight: normal; } .newsslider_slider .newsslider_item a:hover h3{ color: var(--highlight); } .newsslider_item .phold.img{ width: 100%; } .view.home .col.main .box.donation_box{ padding-top: 1px; } .donation_options{ margin: 8px auto 14px auto; text-align: center; width: 410px; max-width: 100%; } .donation_option{ display: inline-block; width: 50%; text-align: left; padding: 9px 10%; white-space: nowrap; font-size: 18px; line-height: 20px; cursor: pointer; transition: color 0.25s ease-in-out; } .donation_option.checked{ color: var(--highlight); font-weight: bold; } .donation_option .donation_check{ display: inline-block; width: 30px; height: 30px; border: 3px solid var(--text-color); margin-right: 10px; padding: 3px; transition: border 0.3s ease-in-out; } .donation_option.checked .donation_check{ border-color: var(--highlight); } .donation_option .icon-check{ font-size: 18px; opacity: 0; transition: opacity 0.25s ease-in-out; } .donation_option:hover .icon-check{ opacity: 0.15; } .donation_option.checked .icon-check{ color: var(--highlight); opacity: 1; } .checkout-donation{ margin-top: 5px; transition: all 0.25s ease-in-out; } .checkout-donation.off{ cursor: default; color: #4f5154; background: #2f3133; } .checkout-donation.clicked{ cursor: default; height: 30px; background: url('../img/bg-loader-black.gif') center center no-repeat; margin-bottom: 20px; } .donation_container.white .checkout-donation.clicked{ background: url('../img/bg-loader.gif') center center no-repeat; } #cup_matches{ padding-top: 1px; } #cup_matches table{ width: 100%; margin: 15px auto; } #cup_matches .home{ text-align: right; } #cup_matches .away{ text-align: left; } #cup_matches .title{ width: 35%; } #cup_matches .title.home{ padding-right: 8px; } #cup_matches .title.away{ padding-left: 8px; } #cup_matches .name{ font-size: 18px; font-weight: bold; } #cup_matches .name br{ display: none; } #cup_matches .team{ font-size: 14px; font-weight: normal; color: #bcbdbf; } #cup_matches .image{ width: 30px; padding: 3px 3px 0 3px; text-align: center; } #cup_matches .image img{ border-radius: 50%; box-shadow: 0 0 12px -4px; border: 4px solid #fff; } #cup_matches .result{ font-size: 30px; font-weight: bold; width: 20px; } #cup_matches .result.home{ text-align: right; } #cup_matches .result.away{ text-align: left; } #cup_matches .vs{ font-size: 20px; font-weight: normal; text-align: center; width: 10px; } #cup_matches .seperator{ position: relative; border-top: 7px solid var(--background); margin-bottom: 30px; } #cup_matches .seperator:first-child{ border-top: none; } #cup_matches .phase{ position: absolute; left: 50%; text-align: center; font-size: 13px; top: 0; margin-left: -100px; width: 100px; text-align: center; padding: 3px 0; border: 2px solid var(--background); border-top: 0; border-right: 0; } #cup_matches .begin{ position: absolute; left: 50%; background: var(--background); font-size: 13px; top: 0; margin-left: -50px; width: 100px; text-align: center; padding: 3px 0; border: 2px solid var(--background); border-top: 0; border-left: 0; } #cup_matches .begin.hlightbg{ background: #862020 !important; color: #fff; } #cup_matches .buttons{ margin-bottom: 15px; } #cup_matches .buttons a{ margin: 0 5px; padding: 8px; width: 124px; background: #862020; color: #fff !important; } #cup_matches .buttons a:hover{ background: #963030; } #cup_matches .buttons a.offline{ opacity: 0.5; pointer-events: none; cursor: default; background: #cdced0; } body.screen-small #cup_matches .title, body[data-view="home"] #cup_matches .title{ width: 30%; max-width: 40px; } body.screen-small #cup_matches .name, body[data-view="home"] #cup_matches .name{ font-size: 14px; } body.screen-small #cup_matches .name br, body[data-view="home"] #cup_matches .name br{ display: inline; } body.screen-small #cup_matches .team, body[data-view="home"] #cup_matches .team{ font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } body.screen-small #cup_matches .image img, body[data-view="home"] #cup_matches .image img{ border-width: 3px; } body.screen-small #cup_matches .result, body[data-view="home"] #cup_matches .result{ font-size: 18px; width: 10px; } body.screen-small #cup_matches .vs, body[data-view="home"] #cup_matches .vs{ font-size: 16px; width: 6px; } body.screen-small #cup_matches .phase, body[data-view="home"] #cup_matches .phase{ width: 80px; margin-left: -80px; font-size: 11px; } body.screen-small #cup_matches .begin, body[data-view="home"] #cup_matches .begin{ width: 80px; margin-left: -40px; font-size: 11px; } #cup_tables{ padding-top: 1px; padding-bottom: 16px; } #cup_tables h2{ text-align: center; margin-top: 20px; margin-bottom: 10px; border-top: 11px solid var(--background); padding-top: 24px; } #cup_tables h2:first-child{ border-top: 0; padding-top: 0; } #cup_tables table{ margin: auto; min-width: 50%; } #cup_tables th{ font-size: 12px; min-width: 32px; color: #bcbdbf; } #cup_tables td{ height: 70px; padding-bottom: 10px; } #cup_tables .name{ font-size: 20px; font-weight: bold; } #cup_tables .name br{ display: none; } #cup_tables .team{ font-size: 12px; font-weight: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 124px; color: #bcbdbf; } #cup_tables .rank{ width: 45px; text-align: center; padding-top: 4px; } #cup_tables .rank div{ width: 31px; height: 31px; padding: 6px 0; background: var(--border-color2); border-radius: 16px; } #cup_tables .image{ width: 90px; padding-right: 7px; } #cup_tables .image img{ width: 64px; border-radius: 50%; box-shadow: 0 0 12px -4px; border: 4px solid #fff; } #cup_tables .matches, #cup_tables .difference, #cup_tables .points{ text-align: center; font-size: 18px; } body.screen-small #cup_tables table, body[data-view="home"] #cup_tables table{ width: 90%; } body.screen-small #cup_tables td, body[data-view="home"] #cup_tables td{ height: 61px; } body.screen-small #cup_tables .rank, body[data-view="home"] #cup_tables .rank{ vertical-align: top; } body.screen-small #cup_tables .name, body[data-view="home"] #cup_tables .name{ font-size: 16px; } body.screen-small #cup_tables .name br, body[data-view="home"] #cup_tables .name br{ display: inline; } body.screen-small #cup_tables .rank, body[data-view="home"] #cup_tables .rank{ width: 38px; } body.screen-small #cup_tables .rank div, body[data-view="home"] #cup_tables .rank div{ width: 24px; height: 24px; padding: 3px 0; } body.screen-small #cup_tables .image, body[data-view="home"] #cup_tables .image{ width: 65px; } body.screen-small #cup_tables .image img, body[data-view="home"] #cup_tables .image img{ width: 48px; border-width: 3px; } body.screen-small #cup_tables .matches, body[data-view="home"] #cup_tables .matches, body.screen-small #cup_tables .difference, body[data-view="home"] #cup_tables .difference, body.screen-small #cup_tables .points, body[data-view="home"] #cup_tables .points{ font-size: 16px; } #cup_header img.cuptop{ margin: auto; display: block; width: 640px; min-height: 186px; background: #020101; } #cup_header .tabselect{ max-width: 640px;; margin: 5px auto 0 auto; } #cup_header .tabselect .tab:hover span, #cup_header .tabselect .tab.active span{ border-color: #862020; } body.screen-small #cup_header img.cuptop, body[data-view="home"] #cup_header img.cuptop{ min-height: 93px; } img.cupbottom{ margin: -12px auto 0 auto; display: block; background: transparent; } #frame{ height: calc(100vh - 120px); max-height: calc(1080px * 0.5625); width: 100%; max-width: 1080px; display: block; margin: 20px auto; } body.screen-small #frame{ height: calc(100vw * 0.5625); } .ytlegal{ margin: 16px 20px 0 0; text-align: right; } .ytlegal a{ font-size: 13px; margin-right: 6px; } .ytlegal i{ font-size: 12px; margin-left: 1px; } .xheader{ position: relative; overflow: hidden; background-repeat: no-repeat; background-size: cover; background-position: center; margin-top: -10px; margin-left: -800px; margin-right: -800px; } .xheader .bgimage{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-repeat: no-repeat; background-size: cover; background-position: center; filter: blur(2px); -webkit-filter: blur(2px); } .xheader .bgoverlay{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 0.85; z-index: 2; background: -moz-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.96) 62%); background: -webkit-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.96) 62%); background: linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.96) 62%); } .xheader .fg{ position: relative; top: 0; bottom: 0; left: 0; right: 0; z-index: 3; text-align: center; color: #dadbdc; padding: 15px 0 5px 0; font-size: 14px; } .xheader .image{ display: block; width: 160px; height: 160px; object-position: top; margin: auto; } .xheader .image.person{ border-radius:50%; box-shadow:0 0 25px -10px #000; background-image: url('https://sportal.s3-eu-west-1.amazonaws.com/media/web/person.png'); background-color: #fff; background-repeat: no-repeat; background-size: contain; } .xheader .name{ text-transform: uppercase; font-size: 22px; line-height: 21px; text-align: left; width: 100vw; margin: auto; padding: 10px 16px; } .xheader .name b{ font-size: 25px; } .xheader .name small{ opacity: 0.6; } .xheader .metabox{ display: inline-block; color: #fff; box-shadow: 0 0px 1px 0px #eee; padding: 10px 0; margin: 5px; width: 90px; position: relative } .xheader .meta.light .metabox{ color: var(--text-color); box-shadow: 0 4px 15px -7px #111; } body.screen-small .xheader .metabox{ padding: 6px 0; margin: 3px; font-size: 10px; width: 54px; } .xheader .metabox .metabg{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 0.75; z-index: 1; } .xheader .metabox .metafg{ position: relative; z-index: 2; } .xheader .metabox b{ font-size: 36px; color: var(--highlight); line-height: 49px; display: block; } body.screen-small .xheader .metabox b{ font-size: 24px; line-height: 27px; } .xheader .metabox b.small{ font-size: 22px; } .xheader .meta span.sep{ background: transparent; margin: 3px; } body.screen-small .xheader .image{ width: 100vw; height: 100%; border-radius: 0; position: absolute; top: 0; bottom: 0; left: 0; right: 0; object-fit: cover; object-position: top; } .trend{ margin: 6px auto; white-space: nowrap; } .trend span{ color: #fff; margin: 5px; padding: 7px; transform: skewX(-4.1deg); font-size: 22px; text-align: center; width: 42px; display: inline-block; } .trend .trend-up{ background: #049437; } .trend .trend-down{ background: #c21515; } .trend .trend-no{ background: #dab020; } .trend span:after{ display: block; transform: skewX(4.1deg); } .trend .trend-up:after{ content: 'S'; } .trend .trend-down:after{ content: 'N'; } .trend .trend-no:after{ content: 'U'; } body.screen-small .trend span{ font-size: 16px; width: 28px; margin: 3px; padding: 4px; font-weight: bold; } .xheader .tabnav{ width: 100vw; margin: auto; top: 44px; left: calc(50% - 50vw); position: fixed; z-index: 100; } .xheader.has_subnavi .tabnav{ top: 104px; } .xheader .tabnav.prevent_slideup{ transform: none; } .playerslider{ position: relative; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; height: 184px; z-index: 2; margin: 0 800px; } .playerslider::-webkit-scrollbar{ width: 8px; height: 8px; } .playerslider::-webkit-scrollbar-track{ background: var(--background); } .playerslider::-webkit-scrollbar-thumb{ background: var(--border-color); } .playerslider:-webkit-scrollbar-thumb:hover{ background: var(--border-color2); } .playerslider > a{ position: relative; display: inline-block; margin: 0 3px; width: 160px; height: 175px; background: rgba(255,255,255,0.4); } .playerslider > a:first-child{ margin-left: 6px; } .playerslider > a:last-child{ margin-right: 6px; } .playerslider div.profilimage{ position: relative; width: 160px; height: 175px; overflow: hidden; } .playerslider div.profilimage:after{ content: ' '; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: -moz-linear-gradient(top, rgba(0,0,0,0) 42%, rgba(0,0,0,0.8) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 42%,rgba(0,0,0,0.8) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 42%,rgba(0,0,0,0.8) 100%); background: -moz-linear-gradient(-65deg, rgba(0,0,0,0) 33%, rgba(0,0,0,0.65) 100%); background: -webkit-linear-gradient(-65deg, rgba(0,0,0,0) 33%,rgba(0,0,0,0.65) 100%); background: linear-gradient(155deg, rgba(0,0,0,0) 33%,rgba(0,0,0,0.65) 100%); z-index: 1; } .playerslider div.profilimage img{ width: 160px; height: 175px; object-position: top; background: url(../img/soccerprofile.png); background-size: cover; } .playerslider div.name{ position: absolute; bottom: 0; width: 100%; color: #fff; background: -moz-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.9) 80%); background: -webkit-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.9) 80%); background: linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.9) 80%); padding: 35px 0 9px 9px; overflow: hidden; line-height: 18px; text-transform: uppercase; z-index: 1; } .playerslider div.name b{ font-size: 19px; } .playerslider div.name:before { content: ' '; position: absolute; top: 28px; left: 9px; width: 30px; border-top: 2px solid var(--highlight); } .playerslider div.name .shirtnumber{ position: absolute; top: 5px; font-size: 14px; z-index: 8; } .playerslider div.role{ color: #999; padding: 0 0 0 10px; font-size: 14px; } .playerlist{ } .playerlist h1.shirtnumber{ position: absolute; top: 92px; right: 0; min-width: 56px; color: rgba(255,255,255,0.5); font-size: 90px; letter-spacing: -10px; margin: 0; z-index: 3; cursor: default; background: -webkit-linear-gradient(rgba(255,255,255,0.25), rgba(255,255,255,0.5)); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .playerlist div.profilimage{ position: relative; width: 100%; height: 190px; overflow: hidden; } .playerlist div.profilimage:after{ content: ' '; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: -moz-linear-gradient(top, rgba(0,0,0,0) 42%, rgba(0,0,0,0.8) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 42%,rgba(0,0,0,0.8) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 42%,rgba(0,0,0,0.8) 100%); background: -moz-linear-gradient(-65deg, rgba(0,0,0,0) 33%, rgba(0,0,0,0.65) 100%); background: -webkit-linear-gradient(-65deg, rgba(0,0,0,0) 33%,rgba(0,0,0,0.65) 100%); background: linear-gradient(155deg, rgba(0,0,0,0) 33%,rgba(0,0,0,0.65) 100%); z-index: 1; } .playerlist div.profilimage img{ width: 100%; } .playerlist div.name{ padding: 2px 0 0 9px; overflow: hidden; } .playerlist div.name b{ font-size: 19px; } .playerlist div.role{ color: #999; padding: 0 0 0 10px; font-size: 14px; } .playerlist div.toprofile{ position: absolute; right: 10px; bottom: 5px; } .playerlist div.toprofile .icon-profil{ margin-left: 1px; } .playerlist .box:hover div.toprofile{ color: var(--highlight) } .qc-cmp-button, .qc-cmp-button.qc-cmp-secondary-button:hover { background-color: #000000 !important; border-color: #000000 !important; } .qc-cmp-button:hover, .qc-cmp-button.qc-cmp-secondary-button { background-color: transparent !important; border-color: #000000 !important; } .qc-cmp-alt-action, .qc-cmp-link { color: #000000 !important; } .qc-cmp-button, .qc-cmp-button.qc-cmp-secondary-button:hover { color: #ffffff !important; } .qc-cmp-button:hover, .qc-cmp-button.qc-cmp-secondary-button { color: #000000 !important; } .qc-cmp-small-toggle, .qc-cmp-toggle { background-color: #000000 !important; border-color: #000000 !important; } .qc-cmp-main-messaging, .qc-cmp-messaging, .qc-cmp-sub-title, .qc-cmp-privacy-settings-title, .qc-cmp-purpose-list, .qc-cmp-tab, .qc-cmp-title, .qc-cmp-vendor-list, .qc-cmp-vendor-list-title, .qc-cmp-enabled-cell, .qc-cmp-toggle-status, .qc-cmp-table, .qc-cmp-table-header { color: #000000 !important; } .qc-cmp-ui { background-color: #ffffff !important; } .qc-cmp-table, .qc-cmp-table-row { border: 1px solid !important; border-color: #000000 !important; } #qcCmpButtons a { text-decoration: none !important; } .qc-cmp-main-messaging, .qc-cmp-qc-link-container{ display: none; } .qc-cmp-initial-info{ width: 200px; } .qc-cmp-ui-content .qc-cmp-title{ margin-bottom: 16px; } .qc-cmp-ui-content .qc-cmp-buttons .qc-cmp-button { min-width: 214px !important; } @media (min-width: 850px){ .qc-cmp-ui-container .qc-cmp-ui{ min-height: 120px !important; } .qc-cmp-ui-container .qc-cmp-ui-content{ display: block !important; padding: 24px 20px 0 3%; overflow-y: auto; } .qc-cmp-ui-content .qc-cmp-initial-info{ display: inline-block !important; } .qc-cmp-ui-content .qc-cmp-title{ font-size: 24px; line-height: 27px; } .qc-cmp-ui-content .qc-cmp-buttons{ display: inline-block !important; width: calc(100% - 210px); text-align: right; padding-left: 0; vertical-align: middle; } .qc-cmp-ui-content .qc-cmp-qc-link-container{ left: 0; right: auto; padding: 0 30px 5px 59px; } .qc-cmp-alt-action, .qc-cmp-alt-action:not([href]):not([tabindex]){ white-space: nowrap; } } @media (min-width: 1190px){ .qc-cmp-ui-container .qc-cmp-ui{ min-height: 100px !important; } .qc-cmp-initial-info{ width: 400px; } .qc-cmp-ui-content .qc-cmp-buttons{ width: calc(100% - 410px); vertical-align: initial; } } .light-pulse{ animation: light-pulse 1s infinite; } @keyframes light-pulse{ 0% { box-shadow: 0 0 0 0px rgba(255, 255, 255, 0.2); } 100% { box-shadow: 0 0 0 35px rgba(255, 255, 255, 0); } } .myfeed_overlay h4{ padding-left: 14px; margin: 15px 0; } .myfeed_item{ position: relative; display: block; min-height: 51px; padding: 10px 10px 7px 16px; border-top: 1px solid var(--text-color2); background: var(--background); } .myfeed_item:last-child{ border-bottom: 1px solid var(--text-color2); padding-bottom: 6px; } .myfeed_item a{ color: var(--text-color); } .myfeed_item img{ display: inline-block; width: 28px; vertical-align: middle; background: none; margin-right: 12px; margin-bottom: 5px; } .myfeed_toggle .switch, .myfeed_item .switch{ position: absolute; top: 0; right: 0; width: 50px; height: 100%; font-size: 24px; text-align: center; line-height: 53px; background: var(--box-background); transition: background 350ms ease-in-out; } .myfeed_toggle .switch{ font-size: 20px; line-height: 46px; width: 46px; opacity: 0.35; } .myfeed_toggle .switch i:before, .myfeed_item .switch i:before{ border-radius: 24px; } .myfeed_toggle .switch.checked, .myfeed_item .switch.checked, .myfeed_item .switch.change-main{ background: var(--highlight); opacity: 1; } .myfeed_toggle .switch.checked i:before, .myfeed_item .switch.checked i:before{ content: "\e5ca"; animation: light-pulse 1s; color: #f3f6f8; } .myfeed_item .switch.change-main i:before{ color: #f3f6f8; line-height: 48px; } #hint.more .hint-box{ bottom: 0; } #hint.more .hint-body h2{ text-align: center; font-size: 30px; padding: 32px 10px 2px 10px; } #hint.more .icon-close { display: none; } #hint.more .hint-body .icon-close { display: block; width: 50px; height: 50px; margin: 0 auto; text-align: center; position: relative; padding: 9px 10px; background: var(--highlight); border-radius: 50px; color: var(--background); cursor: pointer; font-size: 31px; } .stats_links{ padding: 10px 5% 10% 5%; } .stats_links span.btn{ display: block; width: 100%; height: auto; margin: 10px 0; padding: 11px; font-size: 20px; } .stats_links span.btn2{ display: block; width: 100%; height: auto; margin: 9px 0; padding: 9px; text-align: center; color: var(--text-color2); font-size: 21px; } @keyframes zuckSlideTime{0%{max-width:0}to{max-width:100%}}@keyframes zuckLoading{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}#zuck-modal{outline:0!important;overflow:hidden;position:fixed;top:0;left:0;width:100vw;height:100%;background:rgba(0,0,0,.75);z-index:100000;font-size:14px;font-family:inherit}#zuck-modal-content,#zuck-modal-content .story-viewer,#zuck-modal-content .story-viewer>.slides,#zuck-modal-content .story-viewer>.slides>*{width:100vw;height:100%;top:0;bottom:0;position:absolute;overflow:hidden}#zuck-modal *{user-select:none;outline:0}#zuck-modal.with-effects{transform:scale(.01);transform-origin:top left;transition:.25s}#zuck-modal.with-effects.animated{transform:scale(1);border-radius:0;margin-top:0!important;margin-left:0!important}#zuck-modal.with-effects.closed{transform:translateY(100%)}#zuck-modal .slider{width:300vw;left:-100vw}#zuck-modal .slider,#zuck-modal .slider>*{height:100%;top:0;bottom:0;position:absolute}#zuck-modal .slider>*{width:100vw}#zuck-modal .slider>.previous{left:0}#zuck-modal .slider>.viewing{left:100vw}#zuck-modal .slider>.next{left:200vw}#zuck-modal .slider.animated{-webkit-transition:-webkit-transform .25s linear;transition:-webkit-transform .25s linear;transition:transform .25s linear;transition:transform .25s linear,-webkit-transform .25s linear}#zuck-modal.with-cube #zuck-modal-content{perspective:1000vw;transform:scale(.95);perspective-origin:50% 50%;overflow:visible;transition:.3s}#zuck-modal.with-cube .slider{transform-style:preserve-3d;transform:rotateY(0deg)}#zuck-modal.with-cube .slider>.previous{backface-visibility:hidden;left:100vw;transform:rotateY(270deg) translateX(-50%);transform-origin:center left}#zuck-modal.with-cube .slider>.viewing{backface-visibility:hidden;left:100vw;transform:translateZ(50vw)}#zuck-modal.with-cube .slider>.next{backface-visibility:hidden;left:100vw;transform:rotateY(-270deg) translateX(50%);transform-origin:top right}#zuck-modal-content .story-viewer.paused.longPress .head,#zuck-modal-content .story-viewer.paused.longPress .slides-pointers,#zuck-modal-content .story-viewer.paused.longPress .tip{opacity:0}#zuck-modal-content .story-viewer.viewing:not(.paused):not(.stopped) .slides-pointers>*>.active>b{-webkit-animation-play-state:running;animation-play-state:running}#zuck-modal-content .story-viewer.next{z-index:10}#zuck-modal-content .story-viewer.viewing{z-index:5}#zuck-modal-content .story-viewer.previous{z-index:0}#zuck-modal-content .story-viewer.loading .head .loading,#zuck-modal-content .story-viewer.muted .tip.muted{display:block}#zuck-modal-content .story-viewer.loading .head .right .close,#zuck-modal-content .story-viewer.loading .head .right .time{display:none}#zuck-modal-content .story-viewer .slides-pagination span{position:absolute;top:50vh;font-size:48px;color:#fff;line-height:48px;width:48px;margin:6px;transform:translateY(-50%);z-index:1;text-align:center}#zuck-modal-content .story-viewer .slides-pagination .previous{left:0}#zuck-modal-content .story-viewer .slides-pagination .next{right:0}#zuck-modal-content .story-viewer .slides-pointers{display:table;table-layout:fixed;border-spacing:6px;border-collapse:separate;position:absolute;width:100vh;top:0;left:calc(50vw - 50vh);right:calc(50vw - 50vh);z-index:100020}#zuck-modal-content .story-viewer .slides-pointers>*{display:table-row}#zuck-modal-content .story-viewer .slides-pointers>*>*{display:table-cell;background:hsla(0,0%,100%,.5);border-radius:2px}#zuck-modal-content .story-viewer .slides-pointers>*>.seen{background:#fff}#zuck-modal-content .story-viewer .slides-pointers>*>*>b{background:#fff;width:auto;max-width:0;height:2px;display:block;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-play-state:paused;animation-play-state:paused;border-radius:2px}#zuck-modal-content .story-viewer .slides-pointers>*>.active>b{-webkit-animation-name:zuckSlideTime;animation-name:zuckSlideTime;-webkit-animation-timing-function:linear;animation-timing-function:linear}#zuck-modal-content .story-viewer .head{position:absolute;height:56px;left:0;right:0;line-height:56px;z-index:100010;color:#fff;font-size:14px;text-shadow:1px 1px 1px rgba(0,0,0,.35),1px 0 1px rgba(0,0,0,.35);padding:6px 12px}#zuck-modal-content .story-viewer .head .item-preview{overflow:hidden;vertical-align:top;background-size:cover;width:42px;height:42px;display:inline-block;margin-right:9px;border-radius:50%;vertical-align:middle;background-repeat:no-repeat;background-position:50%}#zuck-modal-content .story-viewer .head .item-preview img{display:block;box-sizing:border-box;height:100%;width:100%;background-size:cover;background-position:50%;object-fit:cover}#zuck-modal-content .story-viewer .head .time{opacity:.75;font-weight:500;font-size:13px}#zuck-modal-content .story-viewer .head .left{line-height:1!important;display:inline-block;margin:6px 0}#zuck-modal-content .story-viewer .head .left .info{display:inline-block;vertical-align:middle}#zuck-modal-content .story-viewer .head .left .info>*{width:100%;display:inline-block;line-height:21px}#zuck-modal-content .story-viewer .head .left .info .name{font-weight:500}#zuck-modal-content .story-viewer .head .right{float:right}#zuck-modal-content .story-viewer .head .back,#zuck-modal-content .story-viewer .head .right .close{font-size:42px;width:48px;height:48px;line-height:48px;cursor:pointer;text-align:center}#zuck-modal-content .story-viewer .head .left .back{display:none;width:24px;margin:-9px -6px 0}#zuck-modal-content .story-viewer .head .right .time{display:none}#zuck-modal-content .story-viewer .head .loading{display:none;border-radius:50%;width:30px;height:30px;margin:9px 0;box-sizing:border-box;border:4px solid hsla(0,0%,100%,.2);border-top-color:#fff;-webkit-animation:zuckLoading 1s linear infinite;animation:zuckLoading 1s linear infinite}#zuck-modal-content .story-viewer .head,#zuck-modal-content .story-viewer .slides-pointers,#zuck-modal-content .story-viewer .tip{-webkit-transition:opacity .5s;transition:opacity .5s}#zuck-modal-content .story-viewer .slides .item{display:none;overflow:hidden;background:#000}#zuck-modal-content .story-viewer .slides .item:before{z-index:4;background:transparent;content:"";position:absolute;left:0;right:0;bottom:0;top:0}#zuck-modal-content .story-viewer .slides .item>.media{height:100%;position:absolute;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);margin:auto}#zuck-modal-content .story-viewer .slides .item.active,#zuck-modal-content .story-viewer .slides .item.active .tip.link{display:block}#zuck-modal-content .story-viewer .tip{z-index:5;text-decoration:none;display:none;border-radius:24px;background:rgba(0,0,0,.75);font-size:16px;position:absolute;bottom:24px;left:50%;transform:translateX(-50%);z-index:1000;color:#fff;text-align:center;text-transform:uppercase;font-weight:500;padding:12px 24px}#zuck-modal.rtl{direction:rtl;left:auto;right:0}#zuck-modal.rtl.with-effects{transform-origin:top right}#zuck-modal.rtl.with-effects.animated{margin-left:auto!important;margin-right:0!important}#zuck-modal.rtl .slider{left:auto;right:-100vw}#zuck-modal.rtl .slider>.previous{left:auto;right:0;transform:rotateY(-270deg) translateX(50%)}#zuck-modal.rtl .slider>.viewing{left:auto;right:100vw}#zuck-modal.rtl .slider>.next{left:auto;right:200vw}#zuck-modal.rtl.with-cube .slider>.previous{left:auto;right:100vw;transform-origin:center right}#zuck-modal.rtl.with-cube .slider>.viewing{left:auto;right:100vw;transform:translateZ(50vw)}#zuck-modal.rtl.with-cube .slider>.next{left:auto;right:100vw;transform-origin:top left;transform:rotateY(270deg) translateX(-50%)}#zuck-modal.rtl #zuck-modal-content .story-viewer .slides-pagination .previous{left:auto;right:0}#zuck-modal.rtl #zuck-modal-content .story-viewer .slides-pagination .next{right:auto;left:0}#zuck-modal.rtl #zuck-modal-content .story-viewer .head .item-preview{margin-right:auto;margin-left:9px}#zuck-modal.rtl #zuck-modal-content .story-viewer .head .right{float:left}#zuck-modal.rtl #zuck-modal-content .story-viewer .tip{left:auto;right:50%;transform:translateX(50%)}@media (max-width:1024px){#zuck-modal-content .story-viewer .head{top:3px}#zuck-modal-content .story-viewer .head .loading{width:24px;height:24px;margin:6px 0}#zuck-modal-content .story-viewer .head .item-preview{width:30px;height:30px;margin-right:9px}#zuck-modal-content .story-viewer .head .left{font-size:15px;margin:15px 0}#zuck-modal-content .story-viewer .head .left>div{line-height:30px}#zuck-modal-content .story-viewer .head .right .time{display:block;white-space:nowrap;font-size:15px;margin:15px 0;line-height:30px}#zuck-modal-content .story-viewer .head .left>.back{display:none;background:transparent;z-index:20;visibility:visible;position:absolute;height:42px;width:24px;line-height:36px;text-align:left;vertical-align:top;text-shadow:none}#zuck-modal-content .story-viewer.with-back-button .head .left>.back{display:block}#zuck-modal-content .story-viewer.with-back-button .head .left .item-preview{margin-left:18px}#zuck-modal-content .story-viewer .slides-pointers{width:100vw;left:0;right:0}#zuck-modal-content .story-viewer .tip{font-size:14px;padding:6px 12px}#zuck-modal-content .story-viewer .head .left .time,#zuck-modal-content .story-viewer .head .right .close{display:none}#zuck-modal.rtl #zuck-modal-content .story-viewer .head .item-preview{margin-right:auto;margin-left:9px}#zuck-modal.rtl #zuck-modal-content .story-viewer .head .left>.back{text-align:right}#zuck-modal.rtl #zuck-modal-content .story-viewer.with-back-button .head .left .item-preview{margin-left:auto;margin-right:18px}}.stories.carousel{white-space:nowrap;overflow-y:hidden;overflow-x:auto;-webkit-overflow-scrolling:touch;overflow-scrolling:touch}.stories.carousel .story{display:inline-block;width:18vw;max-width:90px;margin:10px 6px 0 6px;vertical-align:top}.stories.carousel .story:first-child{margin-left:0}.stories.carousel .story:last-child{margin-right:0}.stories.carousel .story>.item-link{text-align:center;display:block}.stories.carousel .story>.item-link:active>.item-preview{transform:scale(.9)}.stories.carousel .story>.item-link>.item-preview{display:block;box-sizing:border-box;font-size:0;max-height:90px;height:18vw;overflow:hidden;transition:transform .2s}.stories.carousel .story>.item-link>.item-preview img{display:block;box-sizing:border-box;height:100%;width:100%;background-size:cover;background-position:50%;object-fit:cover}.stories.carousel .story>.item-link>.info{display:inline-block;margin-top:.5em;line-height:1.2em;width:100%;overflow:hidden;text-overflow:ellipsis}.stories.carousel .story>.item-link>.info .name{font-weight:300}.stories.carousel .story>.item-link>.info .time,.stories.carousel .story>.items{display:none}.stories.list{white-space:nowrap;overflow:auto}.stories.list .story{display:block;width:auto;margin:6px;padding-bottom:6px}.stories.list .story>.item-link{text-align:left;display:block}.stories.list .story>.item-link>.item-preview{height:42px;width:42px;max-width:42px;margin-right:12px;vertical-align:top;display:inline-block;box-sizing:border-box;font-size:0;overflow:hidden}.stories.list .story>.item-link>.item-preview img{display:block;box-sizing:border-box;height:100%;width:100%;background-size:cover;background-position:50%}.stories.list .story>.item-link>.info{display:inline-block;line-height:1.6em;overflow:hidden;text-overflow:ellipsis;vertical-align:top}.stories.list .story>.item-link>.info .name{font-weight:500;display:block}.stories.list .story>.item-link>.info .time{display:inline-block}.stories.list .story>.items{display:none}.stories.rtl{direction:rtl}.stories.rtl.carousel .story:first-child{margin-left:auto;margin-right:0}.stories.rtl.carousel .story:last-child{margin-right:auto;margin-left:0}.stories.rtl.list .story>.item-link{text-align:right}.stories.rtl.list .story>.item-link>.item-preview{margin-right:auto;margin-left:12px} .stories.snapgram .story > .item-link{text-decoration:none;color:#333}.stories.snapgram .story > .item-link>.item-preview{border-radius:50%;padding:2px;background:radial-gradient(ellipse at 70% 70%, var(--highlight) 8%, var(--highlight-hover) 42%, var(--highlight) 58%)}.stories.snapgram .story > .item-link>.item-preview>*{border-radius:50%;border:3px solid #fff;background:rgba(255,255,255,0.8)}.stories.snapgram .story.seen{opacity:.75}.stories.snapgram .story.seen>a>.item-preview{background:#999}.stories.snapgram .story.seen>a{color:#999!important} @media( min-height:480px ){ } #zuck-modal .stories_hint{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; background: var(--box-background); padding: 4px 8px; opacity: 1; } #zuck-modal .stories_hint.done{ animation: stories_hint-fadeout 350ms ease-in-out forwards; } @keyframes stories_hint-fadeout{ 0% { opacity: 0.95; transform: scale(1); } 100% { opacity: 0; transform: scale(.0); } } #zuck-modal .stories_hint_header{ font-size: 17px; text-align: center; margin: 14% auto; } #zuck-modal .stories_hint_header h1{ font-size: 29px; } #zuck-modal .stories_hint_row{ font-size: 17px; clear: both; margin: 35px 5%; } #zuck-modal .stories_hint_row img{ float: left; margin: 0px 24px; width: 50px; } #zuck-modal .stories_hint_row b{ font-size: 23px; display: block; padding-top: 2px; padding-bottom: 1px; } #zuck-modal .stories_hint_footer{ font-size: 17px; text-align: center; margin-top: 20%; } #zuck-modal .stories_hint_footer .btn2{ padding: 7px 30px; height: 44px; font-size: 15px; } #zuck-modal-content .story-viewer .head:after{ content: ' '; position: absolute; width: 100%; height: 90px; left: 0; top: -10px; background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); } #zuck-modal-content .story-viewer .head .left, #zuck-modal-content .story-viewer .head .right{ position: relative; z-index: 1; } .stories.carousel .story>.item-link>.info{ color: var(--text-color2); font-size: 12px; } #zuck-modal-content .story-viewer .tip{ font-size: 22px; text-transform: none; transform: none; width: 100%; left: 0; bottom: 0; padding-top: 100px; padding-bottom: 25px; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 50%, rgba(0,0,0,0.8) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 50%,rgba(0,0,0,0.8) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 50%,rgba(0,0,0,0.8) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 ); border-radius: 0; } #zuck-modal-content .story-viewer .slides .item:NOT(.article) .tip:NOT(.muted){ min-height: 43%; } #zuck-modal-content .story-viewer a.tip.link:after{ font-family: var(--default-font); background-color: var(--hover-color); border-radius: 5px; color: var(--box-background); cursor: pointer; font-size: 44px; font-weight: 400; letter-spacing: -3px; padding: 0; height: 40px; line-height: 33px; width: 28px; position: absolute; text-align: left; padding: 0 6px; right: 16px; bottom: 16px; content: '···'; display: block; } #zuck-modal-content .story-viewer .head .right .close{ margin-right: 20px; } #zuck-modal-content .story-viewer.muted .tip.muted{ top: 10%; right: 2%; left: auto; bottom: auto; width: auto; padding: 6px 9px 4px 12px; font-size: 20px; vertical-align: middle; border-radius: 20px; } #zuck-modal-content .story-viewer.muted .tip.muted i{ font-size: 12px; font-style: initial; margin-top: -7px; margin-right: 2px; vertical-align: middle; display: inline-block; } .stories.carousel .story{ width: 50vw; max-width: 180px; margin-left: 1px; } .stories.carousel .story[data-id^=adstory], .stories.carousel .story.ad{ display: none; } .stories.snapgram .story > .item-link>.item-preview{ max-height: 240px; height: 62vw; border-radius: 10px 10px 0 0; padding: 0; background: transparent; } .stories.carousel .story>.item-link:active>.item-preview{ transform: none; } .stories.carousel .story>.item-link:active{ transform: scale(0.95); } .stories.snapgram .story > .item-link>.item-preview>*{ border: none; border-radius: 10px 10px 0 0; } .stories.carousel .story>.item-link>.info{ background: var(--background); color: var(--text-color); font-size: 14px; white-space: normal; padding: 8px 10px; margin: 0; border-radius: 0 0 10px 10px; min-height: 48px; } .stories.carousel .story>.item-link>.info .name{ font-weight: 400; } .stories.carousel .story:after{ content: 'NEW'; position: absolute; top: 5px; right: 5px; background: var(--highlight); color: #fff; font-size: 10px; padding: 1px 4px; border-radius: 10px; } .stories.carousel .story.seen:after{ display: none; } #zuck-modal-content .story-viewer .slides .item>.media{ z-index: 1; } #zuck-modal-content .story-viewer .slides .item:NOT(.article)>.media{ width: 90%; height: 83%; object-fit: contain; } #zuck-modal-content .story-viewer .slides .item .bgblur{ -webkit-filter: blur(10px) grayscale(50%); filter: blur(3px) grayscale(50%); opacity: 0.5; width: 100%; height: 100%; } @media( max-width:1024px ){ #zuck-modal-content .story-viewer.with-back-button .head .left>.back{ display: none; } #zuck-modal-content .story-viewer .head .left .time, #zuck-modal-content .story-viewer .head .right .close{ display: inline-block; margin-right: -12px; } #zuck-modal-content .story-viewer .head .left>div { line-height: 20px; } #zuck-modal-content .story-viewer.with-back-button .head .left .item-preview { margin-left: 6px; } } @media( max-width:1024px ) and ( min-height:480px ){ #zuck-modal-content .story-viewer .head .right .time{ display: none; } #zuck-modal-content .story-viewer .slides .item>video.media{ -webkit-transform: none; transform: none; } #zuck-modal-content .story-viewer .slides .item.quadrat>.media, #zuck-modal-content .story-viewer .slides .item.portrait>.media{ position: relative; top: 0; left: 0; height: initial; width: initial; max-width: 100%; position: relative; -webkit-transform: none; transform: none; margin: initial; } #zuck-modal-content .story-viewer .slides .item.quadrat>.media{ top: 15%; } } .stories.carousel{ padding: 0 10px; } .stories.carousel:before{ content: ' '; position: absolute; top: 10px; bottom: 11px; left: 0; width: 8px; background: -moz-linear-gradient(left, var(--box-background-rgba-100) 0%, var(--box-background-rgba-0) 100%); background: -webkit-linear-gradient(left, var(--box-background-rgba-100) 0%, var(--box-background-rgba-0) 100%); background: linear-gradient(to right, var(--box-background-rgba-100) 0%, var(--box-background-rgba-0) 100%); z-index: 1; } .stories.carousel:after{ content: ' '; position: absolute; top: 10px; bottom: 11px; right: 0; width: 8px; background: -moz-linear-gradient(left, var(--box-background-rgba-0) 0%, var(--box-background-rgba-100) 100%); background: -webkit-linear-gradient(left, var(--box-background-rgba-0) 0%, var(--box-background-rgba-100) 100%); background: linear-gradient(to right, var(--box-background-rgba-0) 0%, var(--box-background-rgba-100) 100%); z-index: 1; } .storiesWrapper.box .stories.carousel{ margin: -16px -13px 18px -13px; padding: 0 13px; } .stories.carousel::-webkit-scrollbar { width: 0; height: 0; } .storiesWrapper h2{ margin-top: 17px; } @media screen and (max-width:412px){ .storiesWrapper h2{ font-size: 21px; } } .storiesWrapper h2 .icon-dot-o{ margin: 0 2px 0 4px; font-size: 18px; } .stories.carousel .story{ animation: story-fadein 0.75s ease-in-out forwards; } @keyframes story-fadein{ 0% { opacity: 0; transform: scale(.5); } 50% { opacity: 0; transform: scale(.5); } 100% { opacity: 1; transform: scale(1); } } .transfer{ padding: 0 4% 13px 4% !important; } .transfer-title{ margin-top: 12px; margin-bottom: 12px; } .transfer-player{ text-align: left; margin: 23px 0 0 0; font-size: 24px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .transfer-image{ width: 160px; height: 160px; margin: 0 15px 5px 0; float: left; border-radius: 50%; } .transfer-teams{ margin-top: 15px; margin-bottom: 20px; } .transfer-teams a{ display: inline-block; width: 120px; font-size: 80%; text-align: center; vertical-align: top; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .transfer-teams a.transfer-from{ color: #c31e36; } .transfer-teams a.transfer-to{ color: #3a9424; } .transfer-teams img{ margin: auto; display: block; background: transparent; margin-bottom: 6px; width: 48px; } .transfer-teams .icon-trend-no, .transfer-teams .icon-right{ vertical-align: text-bottom; font-size: 30px; margin: 22px 0px; display: inline-block; color: var(--text-color2); } .transfer-teams .icon { width: 48px; height: 48px; font-size: 48px; line-height: 48px; color: var(--background); text-align: center; display: block; margin: auto; margin-bottom: 6px; } .transfer-text{ padding-left: 175px; line-height: 25px; font-family: var(--text-font); } .transfer-text p:last-child{ margin-bottom: 10px; } .transfer-moment{ font-family: var(--default-font); font-size: 13px; text-align: right; color: var(--text-color); } .transfer .icon-share{ position: absolute; bottom: 29px; right: 9px; width: 42px; font-size: 24px; padding: 5px; color: var(--text-color2); cursor: pointer; } body .transfer div.social{ display: none; position: absolute !important; top: auto; left: auto; bottom: 60px; right: 14px; width: 42px; background: var(--box-background); } body .transfer div.social a.social{ display: block; margin: 4px; width: 36px; height: 35px; line-height: 32px; } @media screen and (max-width:580px) { .transfer-image{ width: 120px; height: 120px; } .transfer-teams a{ display: block; width: auto; text-align: left; font-size: initial; } .transfer-teams img{ display: inline-block; width: 24px; margin: 0 10px 7px 0; vertical-align: middle; } .transfer-teams .icon { width: 24px; height: 24px; font-size: 24px; line-height: 24px; display: inline-block; margin: 0 10px 2px 0; vertical-align: middle; } .transfer-teams .icon-trend-no, .transfer-teams .icon-right{ display: none; } .transfer-text{ padding-left: 0; } } .transfer-mobile-headline{ position: relative; margin: 16px 0 0 0; padding: 10px; text-align: center; background: var(--box-background); border-top: 2px solid var(--border-color); } .transfer-mobile-headline h3{ margin: 0; } .transfer-filter-btn{ position: absolute; right: 10px; top: 6px; } .transfer-filter-btn i{ margin-right: 3px; margin-top: -4px; font-size: 16px; vertical-align: middle; display: inline-block; } .transfer-filter-top{ display: none; position: fixed; top: 44px; bottom: 0; background: var(--box-background); box-shadow: 0 10px 20px -18px #000; padding: 6px 14px 16px 14px; z-index: 111; width: 100%; } .transfer-filter-close{ padding: 10px; float: right; } .transfer-filter-box{ padding-top: 7px; } .transfer-filter-box h4{ margin-bottom: 8px; margin-left: 14px; } .transfer-filter-box .select-wrapper{ margin-top: 4px; display: block; border-radius: 40px; } .transfer-filter-box select{ -moz-appearance: none; -webkit-appearance: none; appearance: none; border: none; background: var(--darkgrey); color: #fff; width: 100%; height: 40px; padding: 6px 40px 6px 14px; border-radius: 40px; } .select-wrapper{ position: relative; } .select-wrapper::before{ font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f107"; font-size: 20px; position: absolute; right: 15px; top: 10px; pointer-events: none; color: #fff; } @media screen and (min-width:800px) { a.transfer-filter-btn, .transfer-mobile-headline, .transfer-filter-top{ display: none; } .transfer-filter-box{ padding-top: 10px; } .transfer-filter-box h4{ width: 80%; margin: 18px 6% 7px 14%; } .transfer-filter-box .select-wrapper{ width: 80%; margin: 5px 10% 5px 10%; } } .transfer-slider.box.teaser .text h2{ margin-top: 16px; margin-bottom: 1px; } .transfer-slider.box.teaser .text h2 .icon-swap{ margin: 0 2px 0 5px; font-size: 22px; } .slider-row{ overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; } .slider-row::-webkit-scrollbar{ width: 8px; height: 8px; } .slider-row::-webkit-scrollbar-track{ background: var(--background); } .slider-row::-webkit-scrollbar-thumb{ background: var(--border-color); } .slider-row::-webkit-scrollbar-thumb:hover{ background: var(--border-color2); } .view.home .col.main .box.teams-slider{ padding: 0; } .teams-slider{ position: relative } .teams-slider:before{ content: ' '; position: absolute; top: 10px; bottom: 11px; left: 0; width: 20px; background: -moz-linear-gradient(left, var(--background-rgba-100) 50%, var(--background-rgba-0) 100%); background: -webkit-linear-gradient(left, var(--background-rgba-100) 50%, var(--background-rgba-0) 100%); background: linear-gradient(to right, var(--background-rgba-100) 50%, var(--background-rgba-0) 100%); z-index: 1; } .teams-slider:after{ content: ' '; position: absolute; top: 10px; bottom: 11px; right: 0; width: 20px; background: -moz-linear-gradient(left, var(--background-rgba-0) 0%, var(--background-rgba-100) 50%); background: -webkit-linear-gradient(left, var(--background-rgba-0) 0%, var(--background-rgba-100) 50%); background: linear-gradient(to right, var(--background-rgba-0) 0%, var(--background-rgba-100) 50%); z-index: 1; } .view.home .col.main .box.teams-slider{ padding-bottom: 4px; } .teams-slider-row{ display: flex; width: 100%; padding: 10px 10px 6px 10px; } .teams-slider .teambox{ display: inline-block; margin: 0 4px; flex: auto; min-width: 92px; text-align: center; padding: 10px; border-radius: 8px; background: var(--box-background); font-size: 16px; transition: transform 200ms ease-in-out; } .teams-slider .teambox:hover{ transform: scale(0.95); } .teams-slider .teambox img{ display: block; margin-bottom: 10px; width: 72px; height: 72px; background: transparent; transition: transform 200ms ease-in-out; } .teams-slider .teambox:hover img{ transform: scale(1.06); } .teams-slider .teambox .btn{ padding: 0 10px; } .teams-slider .teambox .btn:after{ content: ' Team'; margin-left: 5px; vertical-align: middle; margin-top: -5px; display: inline-block; } @media screen and (max-width: 400px){ .teams-slider-row{ padding: 10px 6px 6px 6px; } .teams-slider .teambox{ min-width: 68px; font-size: 13px; } .teams-slider .teambox img{ width: 48px; height: 48px; } .teams-slider .teambox .btn:after{ content: ''; margin: 0; } .teams-slider:before, .teams-slider:after{ bottom: 0; } } .alpinesquad-slider{ padding: 6px 10px; } .alpinesquad-slider.box.teaser .text h2{ margin-top: 13px; } .alpinesquad-slider.box.teaser .text h2 img{ background: transparent; margin: -8px 3px 0 2px; vertical-align: middle; } .alpinesquad-slider-row{ display: flex; width: 100%; padding: 0 0 7px 0; margin-bottom: 9px; } .alpinesquad-slider-row > a{ position: relative; display: inline-block; margin: 0 4px; flex: auto; min-width: 149px; text-align: center; border-radius: 8px; background: var(--box-background); font-size: 16px; transition: transform 200ms ease-in-out; } .alpinesquad-slider-row > a:first-child{ margin-left: 0; } .alpinesquad-slider-row > a:last-child{ margin-right: 0; } .alpinesquad-slider-row > a .img{ position: relative; display: block; width: 149px; height: 215px; overflow: hidden; border-radius: 8px; padding: 0; } .alpinesquad-slider-row > a .img:before{ content: ' '; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; border-radius: 8px; background: -moz-linear-gradient(185deg, rgba(0,0,0,0) 60%, rgba(0,0,0,.8) 80%); background: -webkit-linear-gradient( 185deg, rgba(0,0,0,0) 60%, rgba(0,0,0,.8) 80%); background: linear-gradient(185deg ,rgba(0,0,0,0) 60%, rgba(0,0,0,.8) 80%); box-shadow: inset 0 -6px 49px rgb(0 0 0 / 76%); } .alpinesquad-slider-row > a .img img{ position: initial; width: 100%; height: 100%; border-radius: 8px; transition: transform 3.5s cubic-bezier(0.19,1,.22,1); } .alpinesquad-slider-row > a:hover .img img { -webkit-transform: scale(1.125) rotate( 0.02deg)!important; -ms-transform: scale(1.125) rotate(0.02deg)!important; -o-transform: scale(1.125) rotate(0.02deg)!important; transform: scale(1.125) rotate( 0.02deg )!important; } .alpinesquad-slider-row > a .name{ text-transform: uppercase; font-size: 14px; line-height: 17px; margin: 10px 13px; position: absolute; bottom: 0; color: #fff; z-index: 2; text-align: left; overflow: hidden; width: calc(100% - 13px); } .alpinesquad-slider-row > a .name b{ font-size: 17px; } @media screen and (max-width: 400px){ .alpinesquad-slider.box.teaser .text{ padding-bottom: 0; } .alpinesquad-slider-row{ padding: 10px 6px 6px 6px; } .alpinesquad-slider-row > a{ min-width: 125px; font-size: 13px; } .alpinesquad-slider-row > a .img{ width: 125px; height: 155px; } .alpinesquad-slider:before, .alpinesquad-slider:after{ bottom: 0; } } .col .content .transfer-slider-cta{ margin: 8px 0 11px 0; } .transfer-compact{ position: relative; display: inline-block; width: 170px; padding: 0 5px; vertical-align: top; } .transfer-compact > a{ width: 160px; height: 160px; position: relative; display: block; } .transfer-compact-status{ position: absolute; top: 114px; right: 24px; background: var(--box-background-rgba-85); padding: 1px 4px 1px 8px; z-index: 1; border-radius: 20px 0 0 20px; } .transfer-compact-image-player .imgbox{ width: 140px; height: 140px; overflow: hidden; } .transfer-compact-image{ width: 140px; height: 140px; margin: 0 5px; display: block; object-fit: cover; border-radius: 90px; transition: transform 3.5s cubic-bezier(0.19,1,.22,1); } .transfer-compact-image-phold{ width: 140px; height: 140px; display: block; font-size: 70px; line-height: 137px; background: var(--background); color: var(--box-background); text-align: center; border-radius: 90px; } .col .box.transfer-slider a:hover .imgbox img{ -webkit-transform: scale(1.1) rotate(0.02deg)!important; -ms-transform: scale(1.1) rotate(0.02deg)!important; -o-transform: scale(1.1) rotate(0.02deg)!important; transform: scale(1.1) rotate(0.02deg)!important; } .transfer-compact-player{ padding: 2px 16px 6px 5px; white-space: normal; } .transfer-compact-player b{ font-size: 140%; line-height: 18px; } .transfer-compact-teams{ position: relative; margin-bottom: 10px; vertical-align: middle; } .transfer-compact-teams:after{ content: ' '; position: absolute; top: 0; bottom: 0; left: 90%; right: 0; background: #fff; background: -moz-linear-gradient(left, var(--box-background-rgba-0) 0%, var(--box-background-rgba-100) 70%); background: -webkit-linear-gradient(left, var(--box-background-rgba-0) 0%, var(--box-background-rgba-100) 70%); background: linear-gradient(to right, var(--box-background-rgba-0) 0%, var(--box-background-rgba-100) 70%); } .transfer-compact-teams .icon{ width: 28px; min-width: 28px; height: 28px; margin: 0 5px; display: inline-block; font-size: 28px; line-height: 30px; color: var(--background); text-align: center; } .transfer-compact-teams > div{ display: block; font-size: 80%; vertical-align: middle; display: flex; align-items: center; min-height: 30px; overflow: hidden; position: relative; } .transfer-compact-teams > div span{ display: inline-block; } .transfer-compact-teams > div.transfer-compact-from{ color: #c31e36; } .transfer-compact-teams > div.transfer-compact-to{ color: #3a9424; } .transfer-compact-teams img{ margin: 0 5px; display: inline-block; background: transparent; width: 28px; } .transfer-compact-teams .icon-trend-no, .transfer-compact-teams .icon-right{ vertical-align: text-bottom; font-size: 30px; margin: 22px 0px; display: inline-block; color: var(--text-color2); background: linear-gradient(90deg, #c31e36, #3a9424); opacity: 0.75; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .transfer-compact-moment{ font-family: var(--default-font); font-size: 13px; color: var(--text-color); margin-bottom: 3px; } .bannerspot > div{ position: relative; z-index: 2; } .bannerspot .bg { display: block; position: absolute; top: 50%; left: 50%; width: 80px; height: 250px; margin: -125px 0 0 -40px; color: #bbb; font-size: 10px; line-height: 250px; letter-spacing: 2px; z-index: 1; } .bannerspot .adloader { display: block; position: absolute; top: 50%; left: 50%; width: 80px; height: 80px; margin: -40px 0 0 -40px; z-index: 1; } .adloader div { position: absolute; top: 33px; width: 13px; height: 13px; border-radius: 50%; background: var(--highlight); background: var(--border-color); animation-timing-function: cubic-bezier(0, 1, 1, 0); } .adloader div:nth-child(1) { left: 8px; animation: lds-ellipsis1 0.6s infinite; } .adloader div:nth-child(2) { left: 8px; animation: lds-ellipsis2 0.6s infinite; } .adloader div:nth-child(3) { left: 32px; animation: lds-ellipsis2 0.6s infinite; } .adloader div:nth-child(4) { left: 56px; animation: lds-ellipsis3 0.6s infinite; } @keyframes lds-ellipsis1 { 0% { transform: scale(0); } 100% { transform: scale(1); } } @keyframes lds-ellipsis3 { 0% { transform: scale(1); } 100% { transform: scale(0); } } @keyframes lds-ellipsis2 { 0% { transform: translate(0, 0); } 100% { transform: translate(24px, 0); } } .bannerspot .adloader{ display: none; } .bannerspot.adm-standby .adloader{ display: block; } .liveticker-container{ overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; margin-top: 4px; margin-bottom: -20px; padding: 1px 6px; } .liveticker-container .tabselect{ position: absolute; } .liveticker-container .tabselect_block{ height: 50px; } .col .liveticker-container > .box.liveticker-buttons{ display: none; } .col .liveticker-container > .box, .view.home .col.main .liveticker-container > .box:first-child, .view.home .col.main .liveticker-container > .box:last-child{ display: inline-block; width: 280px; margin: 5px; } .view.home .col.main .liveticker-container > .more{ vertical-align: middle; margin-top: calc(-50% + 16px); margin-left: 10px; margin-right: 10px; } .col .liveticker-container .liveticker-teaser .image{ padding: 0; } .col .liveticker-container .liveticker-teaser img{ width: 60px; } .view.home .col.main .standing-container{ margin-top: -9px; } .view.home .col.main .box.liveticker-live{ padding-top: 1px; padding-bottom: 16px; } .liveticker-live h2{ text-align: center; margin-top: 14px; margin-bottom: 0; } .liveticker-live-match{ text-align: center; } .liveticker-live-match .team{ display: inline-block; width: 40%; } .liveticker-live-match .result{ display: inline-block; width: 9%; font-weight: bold; font-size: 20px; } .liveticker-live-match .sep{ display: inline-block; width: 2%; } .liveticker-live-match .team.home{ text-align: right; } .liveticker-live-match .team.away{ text-align: left; } .liveticker-live-match .result.home{ padding-left: 2%; } .liveticker-live-match .result.away{ padding-right: 2%; } .next-articles{ max-width: 994px; margin: 5px auto 0 auto; } .person-profile .img{ position: relative; padding: 0; margin: 0; min-height: 200px overflow: initial; } .person-profile .img:before{ content: ' '; position: absolute; top: 30%; bottom: 0; left: 0; right: 0; z-index: 1; background: -moz-linear-gradient(185deg, rgba(0,0,0,0) 20%, rgba(0,0,0,.9) 80%); background: -webkit-linear-gradient( 185deg, rgba(0,0,0,0) 20%, rgba(0,0,0,.9) 80%); background: linear-gradient(185deg ,rgba(0,0,0,0) 20%, rgba(0,0,0,.9) 80%); border-radius: 8px 8px 0 0; } .person-profile .img:before{ content: ' '; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; box-shadow: inset 0 -40px 120px rgba(0,0,0,.9); border-radius: 8px 8px 0 0; } .person-profile .img img{ position: initial; width: 100% } .person-profile .name{ text-transform: uppercase; font-size: 23px; line-height: 29px; margin: 14px 18px; position: absolute; bottom: 0; color: #fff; z-index: 2; } .person-profile .name b{ font-size: 30px; } .person-profile .name small{ text-transform: none; font-size: 20px; } .person-profile .name img{ width: 25px; vertical-align: middle; margin-right: 6px; background: transparent; } .col .box.person-profile .text{ padding-left: 14px; } .person-profile .text > div{ margin: 8px 0; display: inline-block; width: 30%; } .person-profile .text > div:first-child{ width: 40%; } .next-articles{ max-width: 994px; margin: 5px auto 0 auto; } .person-details h2{ margin: 12px 0; text-align: center; } .person-stats h2{ margin: 12px 0; text-align: center; } .person-stats table{ width: 100%; } .person-stats table tr td{ border-bottom: 2px solid var(--background); text-align: center; line-height: 30px; padding: 5px 6px 3px 6px; } .person-stats table tr:last-child td{ border: none; } .person-stats table tr td:first-child{ text-align: center; width: 66px; color: var(--highlight); } .person-stats table tr td:last-child{ text-align: left; } .person-teams h2{ margin: 12px 0 18px 0; text-align: center; } .person-teams table{ width: 100%; } .person-teams table tr td{ border-bottom: 2px solid var(--background); text-align: center; line-height: 21px; padding: 8px; } .person-teams table tr:last-child td{ border: none; } .person-teams table tr td:first-child{ text-align: right; width: 66px; padding-top: 14px; } .person-teams table tr td:last-child{ text-align: left; } .person-teams table img{ background: transparent; float: left; width: 50px; margin: -6px 10px 0 0; } .col .box.sidebar-header h2{ margin: 0; padding: 6px 13px; text-align: center; } .col .liveticker-nav, .col .liveticker-sport-filter, .col .tabselect, .col .box.tabselect-box, .col .box.liveticker-teaser, .col .box liveticker-buttons, .col .box.liveticker-standing{ max-width: 940px; } .col .standing-container{ max-width: 960px; } .col .squadlist .box{ height: 300px; } .col .squadlist .box > img{ width: 100%; height: 100%; object-position: top; background: url(../img/soccerprofile.png); background-size: cover; } .col .squadlist .box .overlay{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; box-shadow: inset 0 -40px 120px rgba(0,0,0,.9); z-index: 1; } .col .squadlist .box .text:before{ content: ' '; position: absolute; top: 25px; left: 19px; width: 50px; border-top: 2px solid var(--highlight); } .col .squadlist .box .text .shirtnumber{ position: absolute; top: -1px; left: 19px; } .col .squadlist .box .text{ position: absolute; bottom: 0px; width: 100%; padding-top: 40px; padding-left: 19px; padding-bottom: 14px; z-index: 2; color: #fff; background: -moz-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.9) 80%); background: -webkit-linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.9) 80%); background: linear-gradient(185deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.9) 80%); } .col .squadlist .box .text .name{ text-transform: uppercase; font-size: 27px; line-height: 28px; } .col .squadlist .box .text .name b{ font-size: 30px; } .col .squadlist .box .toprofile{ position: absolute; top: 13px; right: 15px; color: #fff; z-index: 2; } .squad-filter, .matches-filter{ position: absolute; top: 13px; right: 13px; } .filter-btn{ font-size: 20px; cursor: pointer; color: var(--border-color); } .filter-btn:hover{ color: var(--hover-color); } .filter-overlay{ position: absolute; top: 20px; right: -7px; background: var(--text-color); color: var(--box-background); padding: 10px 14px; z-index: 3; box-shadow: 0 0 20px -10px var(--text-color); } .filter-overlay > div{ white-space: nowrap; cursor: pointer; margin-bottom: 9px; padding: 0 3px 8px 3px; border-bottom: 1px solid var(--border-color); } .filter-overlay > div.active{ font-weight: bold; } .filter-overlay > div:hover{ color: var(--hover-color); } .filter-overlay > div:first-child{ margin-top: 5px; } .filter-overlay > div:last-child{ margin-bottom: 0; padding-bottom: 3px; border-bottom: none; } .clickover{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: auto !important; background: transparent; z-index: 10000; } .btn-prio, .playerlist > div, .playerslider > a, .col .squadlist .box .overlay, .xheader .metabox, .xheader .metabox .metabg, .filter-overlay{ border-radius: 8px; } .col .box, .col .box img, .col .box iframe, .col .box.teaser.compact img.thumb, .view.channel .col .box, .col .content .lt-cta, body[data-videos="1"] .col .content a:not(.tag), body[data-view="channel"] .col .content a:not(.tag), body[data-view="watch"] .col .content a:not(.tag), .box[data-playlist="watchnow"] .pl_slider_item, .playerslider div.profilimage:after, .transfer-compact-image-player .imgbox{ border-radius: 8px; } .playerslider div.profilimage img{ border-radius: 6px; } .col .box .box, .view.detail .col.main .box img:not(.thumb), .view.detail .col.main .box iframe, .col .box .bannerspot iframe{ border-radius: 0; } .col.main .breaking.box, body[data-view="detail"] .btn-prio, .liveticker-nav, .col .box.sphd-teaser .img, .col .box.sphd-teaser .img img, .col .box.liveticker-subheading, .view.home .col .box.pl_slider_box, .col .box img.pl_slider_item_image, .playerlist div.profilimage, .playerlist div.profilimage img, .col .box .image.person, .col .box.with_player, .view.home .col.main .match_group_head .box{ border-radius: 8px 8px 0 0; } .col.side.left .box.tabselect-box, .view.scores .col .box.tabselect-box, .col .box.liveticker-standing, .col .box.box-footer, .pl_slider_item_title, .view.detail .col.main .box .pl_slider_item_image, .col .squadlist .box .text, .playerslider div.name, div:not(.match_group_head) > .box.liveticker-buttons{ border-radius: 0 0 8px 8px; } .view.home .col.main .pl_slider_box.videoplayer_slider{ border-radius: 0; } .scroll-indicator{ border-radius: 0 8px 8px 0; width: 5px; } .view.detail .col.side.left .box.thumb img{ border-radius: 8px 0 0 8px; margin-right: 3px; } .view.detail .col.side.left .box.thumb .text{ max-height: 63px; overflow: hidden; } .col .box .box, .col .box .box.liveticker-buttons{ border-top: none; } .col .box .box.liveticker-buttons{ max-width: 420px; margin-left: auto; margin-right: auto; } .view.home .col.main .match_group_head .box.liveticker-buttons{ margin-bottom: -20px; } .sep_nav{ display: flex; padding: 6px 10px 0 10px; max-width: 940px; margin-left: 8px; margin-right: 8px; width: calc(100% - 18px); } .sep_nav .tab{ flex: 1; text-align: center; cursor: pointer; white-space: nowrap; } .sep_nav .tab span{ width: 90%; display: inline-block; padding: 6px 8px; border-bottom: 4px solid transparent; transition: border-bottom 200ms ease-in-out; } .sep_nav .tab.active span{ opacity: 1; border-bottom-color: var(--highlight); } .sep_nav:hover .tab.active span{ border-bottom-color: rgb(231,14,14,0.3); } .sep_nav .tab:hover span, .sep_nav:hover .tab.active:hover span{ opacity: 1; border-bottom-color: var(--highlight); } .sep_nav .tab div.badge{ display: inline-block; vertical-align: top; font-size: 10px; border-radius: 8px; height: 16px; width: 16px; background: var(--highlight); line-height: 16px; margin: -3px 2px; } #match-content .pl_slider_box{ height: 150px; max-width: 940px; margin-top: 11px; margin-bottom: 10px; } #match-content .pl_slider{ height: 174px; padding-left: 16px; } #match-content .pl_slider_item, #match-content img.pl_slider_item_image{ height: 140px; } .col .match_news .box.teaser.compact{ border-top: none; box-shadow: none; border-bottom: none; } .col .match_news .box.teaser.compact .text h2{ margin-top: 10px; font-size: 15.5px; } @media screen and (min-width:800px){ .col .match_news .box.teaser.compact.col-50{ display: inline-block; width: 50%; vertical-align: top; padding-top: 0 !important; padding-right: 36px; padding-bottom: 0; border: none !important; box-shadow: none !important; } .col .match_news .box.teaser.compact .text h2{ font-size: 17px; } } .col .box.match_events{ max-width: 940px; padding: 10px 0; margin-top: 0; } .event_row{ min-height: 50px; margin: 10px 0; display: flex; align-items: center; justify-content: center; } .event_row .team{ display: inline-block; width: calc(80% - 30px); background: var(--border-color); padding: 10px; position: relative; font-size: 14px; } .event_row .team.empty{ width: calc(20% - 30px); } .event_row .person2{ font-size: 88%; opacity: 0.55; } .event_row .team.empty{ background: transparent !important; } .event_row .team.home{ padding-right: 48px; text-align: right; margin-left: 3%; } .event_row .team.away{ padding-left: 48px; text-align: left; margin-right: 3%; } .event_row .team .color_badge{ position: absolute; top: 0; bottom: 0; width: 12px; } @media screen and (max-width:640px) { .event_row .team .color_badge{ width: 6px; } } .event_row .team.home .color_badge{ left: 0; } .event_row .team.away .color_badge{ right: 0; } .event_row .minute{ display: inline-block; width: 60px; text-align: center; } .event_row .event_icon{ position: absolute; top: 50%; margin: -12px; width: 24px; height: 24px; } .event_row .goal .event_icon{ margin-top: -11px; width: 20px; height: 20px; } .event_row .team.home .event_icon{ right: 24px; } .event_row .team.away .event_icon{ left: 24px; } .event_row .result{ display: inline-block; position: relative; font-size: 85%; padding: 2px; margin: 5px 1px 0 1px; color: #eee; transform: skewX(-4.1deg); box-shadow: 0 0 10px -7px #000; white-space: nowrap; } .event_row .result span{ display: inline-block; transform: skewX(4.1deg); padding: 1px 7px; text-shadow: 0 0 5px var(--border-color); } .event_row .to{ display: inline-block; margin: -2px 3px 2px 3px; font-size: 74%; vertical-align: middle; } .event_row .period, .event_row .type{ display: inline-block; background: var(--border-color); opacity: 0.94; color: #fff; } @media screen and (max-width:799px) { .event_row .team.home { padding-left: 48px; padding-right: 8px; text-align: left; } .event_row .team.away { padding-left: 8px; padding-right: 48px; text-align: right; } .event_row .team.home .event_icon{ left: 26px; right: auto; } .event_row .team.away .event_icon{ right: 26px; left: auto; } } @media screen and (min-width:800px) { .event_row .team, .event_row .team.empty{ width: calc(50% - 30px); font-size: 16px; } } .event_row .person, .event_row .person2{ overflow: hidden; } #match-content .match_info{ max-width: 940px; padding: 14px; text-align: center; line-height: 28px; font-size: 15px; } #match-content .teamform-container, #match-content .h2h-container, #match-content .standing-container{ max-width: 940px; padding: 3px 14px 1px 14px; } #match-content .liveticker-subheading{ display: none; } .col .box.match_lineups{ max-width: 940px; padding: 12px 22px; } .tab_nav{ display: flex; padding: 2px; margin: 8px 0 12px 0; max-width: 940px; background: var(--border-color); border-radius: 8px; } @media screen and (min-width:800px) { .lineup_nav{ display: none; } } .tab_nav .tab{ flex: 1; text-align: center; cursor: pointer; border-radius: 8px; } .tab_nav .tab.active{ background: var(--box-background); } .tab_nav .tab span{ width: 93%; font-size: 15px; display: inline-block; padding: 8px 4px; opacity: 0.5; border-bottom: none; transition: border-bottom 200ms ease-in-out; } .tab_nav .tab.active span{ opacity: 1; } .matches_nav{ margin-left: 10px; margin-right: 10px; } .lineup_container{ display: inline-block; width: 50%; vertical-align: top; } .lineup_formation{ position: relative; width: 100%; max-width: 400px; aspect-ratio: 1 / 1; margin: auto; font-size: 12px; overflow: hidden; background: rgba(0,80,0,0.35); } .lineup_formation:after{ content: ' '; position: absolute; top: -4%; left: 0; bottom: -10%; right: 0; background-image: url(../img/soccerfield.jpg); background-size: 100% 100%; transform: perspective(24.25em) rotateX(25deg) translateY(-4em); opacity: 0.45; } .lineup_formation .player{ width: 100px; height: 50px; min-width: auto; top: auto; right: auto; bottom: -100px; left: -100px; margin-bottom: -21px; margin-left: calc(15% - 50px); text-align: center; background: transparent; font-weight: bold; z-index: 1; text-shadow: 0px 1px 2px rgb(0 0 0 / 50%); } .lineup_formation .player > span{ display: block; margin: auto; width: 26px; height: 26px; line-height: 23px; font-weight: bold; margin-bottom: 1px; position: relative; z-index: 1; text-shadow: 1px 0px 0 rgba(0,0,0,.33), -1px 0px 0 rgba(0,0,0,.33), 0px 1px 0 rgba(0,0,0,.33), 0px -1px 0 rgba(0,0,0,.33); } .lineup_formation .player > svg{ position: absolute; top: -9px; left: 29px; width: 42px; height: 42px; } .lineup_formation .action_icons{ position: absolute; top: 15px; left: 59px; z-index: 1; white-space: nowrap; } .lineup_formation .action_icons svg{ width: 13px; height: 13px; } .home .lineup_formation .action_icons svg{ margin-right: 3px; } .away .lineup_formation .action_icons svg{ margin-left: 3px; } .lineup_col{ position: relative; padding: 10px 20px; transform: skewX(-4.1deg); } .lineup_col.away{ text-align: right; } .lineup_bg{ position: absolute; top: 7px; bottom: 7px; width: 42px; z-index: 1; } .lineup_col.home .lineup_bg{ left: 20px; } .lineup_col.away .lineup_bg{ right: 20px; } .lineup_row{ position: relative; padding: 10px 16px; border-bottom: 1px solid var(--border-color); width: 90%; display: inline-block; } .lineup_row:last-child{ border-bottom: none; } .home .lineup_row{ padding-left: 53px; } .away .lineup_row{ padding-right: 53px; } .lineup_row .person{ position: relative; transform: skewX(4.1deg); } .lineup_row .shirtno{ position: absolute; top: 10px; font-size: 88%; font-weight: bold; opacity: 0.75; width: 23px; text-align: center; z-index: 2; transform: skewX(4.1deg); text-shadow: 1px 0px 0 rgba(0,0,0,.33), -1px 0px 0 rgba(0,0,0,.33), 0px 1px 0 rgba(0,0,0,.33), 0px -1px 0 rgba(0,0,0,.33); } .home .lineup_row .shirtno{ left: 10px; } .away .lineup_row .shirtno{ right: 10px; } .lineup_row .person .action_icons{ display: inline-block; } .home .lineup_row .person .action_icons{ margin-right: 3px; } .away .lineup_row .person .action_icons{ margin-left: 3px; } .lineup_row .person .action_icons svg{ width: 13px; height: 13px; } .home .lineup_row .person .action_icons svg{ margin-right: 3px; } .away .lineup_row .person .action_icons svg{ margin-left: 3px; } @media screen and (max-width:799px) { .lineup_container{ width: 100%; } .lineup_row{ width: 83%; } } .match_voting{ max-width: 940px; padding: 1px 5% 20px 5%; } .voting_bar{ display: flex; border-radius: 8px; margin: auto; } .voting_bar > div{ flex: 1 1 auto; font-size: 14px; text-align: center; padding: 10px 0; border: 2px solid var(--border-color); cursor: pointer; text-shadow: 0 0 25px var(--background); } .match_voting:not(.finished) .voting_bar > div:hover{ box-shadow: inset 0 0 40px -18px var(--box-background); } .voting_bar > div.home{ border-radius: 8px 0 0 8px; } .voting_bar > div.away{ border-radius: 0 8px 8px 0; } .voting_bar > div.remis{ max-width: 29%; border-left: none; border-right: none; background: var(--border-color); } #match-content .match_videos{ max-width: 940px; background: transparent; } #match-content .match_videos .sphd-teaser{ max-width: 640px; margin-left: auto; margin-right: auto; } #match-content .match_videos .thumb, #match_videos_overlay .thumb{ border-radius: 8px; } #match-content .match_videos .thumb img, #match_videos_overlay .thumb img{ width: 210px; max-width: 50% !important; margin-right: 16px; } #match-content .match_videos .text{ padding: 15px; } #match_videos_overlay{ position: fixed; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0,0,0,0.85); z-index: 100; display: block; overflow-y: scroll; } #match_videos_overlay .content{ margin: auto; max-width: 940px; background: var(--background); } .home_swiper{ z-index: 1; width: calc(100% - 20px); text-align: center; margin: 10px; } @media screen and (min-width:1440px) { .home_swiper{ width: calc(100% - 30px); margin-left: 15px; margin-right: 15px; } } .home_swiper .overlay{ position: absolute; top: 20%; right: 10%; z-index: 3; text-align: right; } .home_swiper .overlay .title{ font-weight: bold; font-size: 24px; margin: 10px 0; } .home_swiper .overlay .subtitle{ font-size: 20px; margin: 10px 0; } .home_swiper .overlay .btn{ font-size: 20px; margin: 15px 0; } .home_swiper:not(.slick-slider):before{ background: linear-gradient(90deg,#000 5%,rgba(0,0,0,.684) 22%,transparent 90%); bottom: 0; content: ""; height: 100%; left: 0; opacity: .1; position: absolute; right: 0; width: 100%; z-index: 1; } .home_swiper:not(.slick-slider):after{ background: -moz-linear-gradient(top, rgba(0,0,0,0) 80%, rgba(0,0,0,1) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 80%,rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 80%,rgba(0,0,0,1) 100%); bottom: 0; content: ""; height: 100%; left: 0; position: absolute; right: 0; width: 100%; z-index: 1; } .home_swiper img{ max-width: 100%; } .home_swiper_block{ height: 72px; margin-bottom: 16px; position: relative; } .home_swiper .slick-list{ border-radius: 8px; } .home_swiper .slick-slide{ height: 60vh; max-height: 500px; min-height: 444px; margin: 0; background-repeat: no-repeat; background-position: top; background-size: cover; color: var(--text-color); } .home_swiper .slick-slide:after{ content: ' '; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: -moz-linear-gradient(180deg,rgba(0,0,0,0) 8%,rgba(0,0,0,.66) 42%); background: -webkit-linear-gradient(180deg,rgba(0,0,0,0) 8%,rgba(0,0,0,.66) 42%); background: linear-gradient(180deg,rgba(0,0,0,0) 8%,rgba(0,0,0,.46) 62%); } .home_swiper .slick-list:after{ content: ' '; position: absolute; top: 0; right: 0; width: 10%; bottom: 0; background: -moz-linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.5) 100%); background: -webkit-linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.5) 100%); background: linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%); } .home_swiper_overlay{ position: absolute; top: 0; left: 0; width: 90%; min-width: 348px; bottom: 0; background: #000; background: -moz-linear-gradient(265deg,rgba(0,0,0,0) 3vw,rgba(0,0,0,.86) 90vw,rgba(0,0,0,1) 96vw); background: -webkit-linear-gradient(265deg,rgba(0,0,0,0) 3vw,rgba(0,0,0,.86) 90vw,rgba(0,0,0,1) 96vw); background: linear-gradient(265deg,rgba(0,0,0,0) 3vw,rgba(0,0,0,.86) 90vw,rgba(0,0,0,1) 96vw); } @media screen and (min-width:480px) { .home_swiper_overlay{ background: -moz-linear-gradient(265deg,rgba(0,0,0,0) 3vw,rgba(0,0,0,.86) 35vw,rgba(0,0,0,1) 46vw); background: -webkit-linear-gradient(265deg,rgba(0,0,0,0) 3vw,rgba(0,0,0,.86) 35vw,rgba(0,0,0,1) 46vw); background: linear-gradient(265deg,rgba(0,0,0,0) 3vw,rgba(0,0,0,.86) 35vw,rgba(0,0,0,1) 46vw); } } .home_swiper_overlay > div{ position: absolute; display: inline-block; max-width: 560px; bottom: 32px; left: 6%; z-index: 1; text-align: left; } @media screen and (min-width:1280px) { .home_swiper_overlay > div{ left: 60px; } } .home_swiper .slick-slide h4{ margin-bottom: -10px; font-weight: bold; text-transform: uppercase; } .home_swiper .slick-slide h4 img{ width: 24px; height: 24px; display: inline-block; vertical-align: middle; margin: -2px 10px 1px 0; } .home_swiper .slick-slide h3{ font-weight: normal; font-size: 20px; line-height: 1.2em; margin-bottom: -10px; } .home_swiper .slick-slide h2{ line-height: 1.2em; } .home_swiper .slick-slide .team{ font-size: 25px; margin: 6px 0; font-weight: bold; text-align: left; white-space: nowrap; } .home_swiper .slick-slide .team .img{ width: 40px; display: inline-block; vertical-align: middle; margin-right: 6px; transform: skewX(-4.1deg); } .home_swiper .slick-slide .team .img img{ transform: skewX(4.1deg) scale(0.7); } .home_swiper .slick-slide .team .result{ display: inline-block; background: var(--border-color); color: #fff; border-radius: 0; transform: skewX(-4.1deg); letter-spacing: 2px; padding: 0px 8px; min-width: 35px; line-height: 40px; text-align: center; margin-right: 10px; vertical-align: middle; } .home_swiper .slick-slide .team .result div{ transform: skewX(4.1deg); } .home_swiper .slick-slide .cta{ margin-bottom: 10px; font-family: var(--default-font); display: inline-block; border-radius: 18px; padding: 9px 20px 8px 20px; text-align: center; background: var(--highlight); color: #fff; cursor: pointer; } .home_swiper .slick-slide .cta i{ margin: -3px 3px 0 0; display: inline-block; vertical-align: middle; } .home_swiper .slick-dots{ bottom: 6px; z-index: 2; } .home_swiper_cta{ position: absolute; bottom: 0; width: calc(100% - 20px); margin-left: 10px; margin-right: 10px; display: block; text-align: center; font-family: var(--default-font); padding: 15px 20px; color: #000 !important; background: #fff; cursor: pointer; } .streaming-slider .home_swiper_cta{ position: static; } .streaming-slider .pl_slider_box{ margin-bottom: 15px; } .home_swiper_cta img{ background: transparent; border-radius: 0 !important; vertical-align: middle; margin: -4px 5px 0px 5px; height: 12px !important; } @media screen and (min-width:1440px) { .home_swiper_cta{ width: calc(100% - 30px); margin-left: 15px; margin-right: 15px; } } @media screen and (max-width:799px) { .home_swiper{ position: relative; display: none; } .home_swiper .slick-slide .team{ font-size: 16px; } .home_swiper .overlay{ position: relative; text-align: right; top: -13px; left: 16px; right: 16px; width: calc(100% - 32px); } .home_swiper_block{ height: auto; min-height: 0; } .home_swiper_cta{ position: relative; margin-top: 14px; } .home_swiper .slick-slide .cta{ font-size: 12px; } } @media screen and (max-width:499px) { .home_swiper_cta img{ } } .liveticker_slider_header{ position: relative; z-index: 1; font-size: 21px; margin: 10px 0 12px 16px; } body:not([data-view="home"]) .liveticker_slider_header{ display: none; } .liveticker_slider_header .btn{ color: #fff; margin-left: 7px; vertical-align: bottom; height: 26px; line-height: 24px; } .liveticker_slider_box{ position: relative; z-index: 1; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; display: block; margin-bottom: 10px; } body:not([data-view="home"]) .liveticker_slider_box{ display: none; } .liveticker_slider_box .liveticker-teaser{ display: inline-block; margin: 0 7px 6px 7px !important; background: rgba(0,45,0,0.8); width: 320px; height: 180px; } .liveticker_slider_box .liveticker-teaser .text:before{ content: ' '; position: absolute; top: 0; left: 0; height: 100%; width: 100%; opacity: 0.85; z-index: 2; background-image: url(../img/redteaser_overlay.png); background-size: contain; background-position: center; } .liveticker_slider_box .liveticker-teaser:first-child{ margin-left: 15px !important; } .liveticker_slider_box .liveticker-teaser:last-child{ margin-right: 15px !important; } .liveticker_slider_box.col .box.liveticker-teaser .text{ position: absolute; top: 0; bottom: 0; right: 0; left: 0; min-height: auto; } .liveticker_slider_box.col .box.liveticker-teaser .moment{ top: 12px; text-shadow: 0 0 5px rgb(0 0 0 / 33%); } .liveticker_slider_box .liveticker-teaser .name{ flex: 0 0.5 auto; position: absolute; width: 54%; left: -30px; top: 0; bottom: 0; display: block; margin: auto 6%; font-size: 0; transform: skewX(-7.5deg); background: var(--box-background); } .liveticker_slider_box .liveticker-teaser .name.away{ right: -30px; left: auto; } .liveticker_slider_box .liveticker-teaser .image{ flex: 0 0.5 auto; position: absolute; width: 52%; left: -26px; top: 19px; bottom: 0; z-index: 3; background: transparent !important; } .liveticker_slider_box .liveticker-teaser .image.away{ right: -26px; left: auto; } .liveticker_slider_box .liveticker-teaser .image img{ width: 114px; transition: transform 3.5s cubic-bezier(0.19,1,.22,1); transform: skewX(4.1deg) scale(0.9) translateX(0px) translateY(15px); } .liveticker_slider_box .liveticker-teaser .image.away img{ transform: skewX(4.1deg) scale(0.9) translateX(0px) translateY(15px); } .liveticker_slider_box .liveticker-teaser:hover .image img{ transform: skewX(4.1deg) scale(1) translateX(-1px) translateY(15px); } .liveticker_slider_box .liveticker-teaser:hover .image.away img{ transform: skewX(4.1deg) scale(1) translateX(1px) translateY(15px); } .liveticker_slider_box .liveticker-teaser .result{ min-width: 75px; font-weight: normal; font-size: 16px; line-height: 20px; color: #fff; } .liveticker_slider_box .liveticker-teaser .result.live{ font-size: 14px; font-weight: bold; padding: 4px 0 3px 0; background: var(--highlight); color: #fff; border-radius: 13px; box-shadow: inset 0 0 0 2px #fff; animation: border-pulse 2.5s infinite; } @keyframes border-pulse{ 0% { box-shadow: inset 0 0 0px 2px rgba(255, 255, 255, 0.5); } 50% { box-shadow: inset 0 0 3px 1px rgba(255, 255, 255, 1); } 100% { box-shadow: inset 0 0 0px 2px rgba(255, 255, 255, 0.5); } } .liveticker_slider_box .liveticker-teaser .result b{ font-weight: bold; font-size: 20px; } .liveticker_slider_box .liveticker-teaser .vs{ color: #fff; font-size: 22px; position: absolute; bottom: 0; left: 0; right: 0; z-index: 2; display: none; } .liveticker_slider_box .liveticker-teaser .vs span{ color: #898; vertical-align: middle; } .liveticker_slider_box .liveticker-buttons{ display: none; } .nextmatches{ position: relative; z-index: 1; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; display: block; margin: 10px; padding-bottom: 6px; } .nextmatches > a{ position: relative; display: inline-block; width: 160px; margin-left: 4px; overflow: hidden; padding-left: 3px; } .nextmatches > a:after{ content: ' '; position: absolute; left: 6px; right: 6px; top: 0; bottom: 0; background: var(--box-background); transform: skewX(-4.1deg); z-index: -1; } .nextmatches .text{ height: 60px; width: 146px; overflow: hidden; padding: 5px 9px; line-height: 24px; font-size: 13px; } .nextmatches .text span{ vertical-align: middle; display: inline-block; font-size: 14px; margin-top: -7px; } .nextmatches .text span.vs{ font-size: 15px; margin-top: -5px; } .nextmatches .text b{ margin-left: 2px; } .nextmatches .text b.team{ font-size: 16px; } .nextmatches .result_dot{ position: absolute; top: 111px; right: 14px; width: 29px; height: 29px; font-weight: bold; font-size: 14px; line-height: 24px; color: var(--box-background); border: 3px solid var(--box-background); border-radius: 20px; text-align: center; z-index: 2; } .nextmatches .result_dot.result_N{ background: #ca2020; } .nextmatches .result_dot.result_U{ background: #d08c2f; } .nextmatches .result_dot.result_S{ background: #159015; } .view.teams .team-container .nextmatches > a .teamlogo{ width: 149px; height: 120px; margin-left: 4px; } .view.teams .team-container .nextmatches > a .teamlogo img{ width: 80%; } .players.box table{ width: 100%; border-collapse: unset; } .players.box table th{ padding: 6px 8px; border-bottom: 2px solid var(--box-background); text-align: left; background: var(--text-color); color: var(--box-background); } .players.box table tr{ transform: skewX(-4.1deg); } .players.box table td{ padding: 6px 8px; transform: skewX(4.1deg); } .players.box table tr:nth-child(odd){ background: rgba(255,255,255,0.1); } .players.box table tr td:last-child{ border-right: none; } .players.box table td.number{ color: var(--text-color2); } .players.box table td.image{ width: 100px; height: 55px; } .players.box table td img{ width: 80px; height: 80px; border-radius: 40px; object-position: top; background: url(../img/soccerprofile.png); background-size: 90%; background-position: center 10px; background-repeat: no-repeat; background-color: rgba(255,255,255,0.15); background-blend-mode: difference; } @media screen and (max-width: 640px){ .players.box table td img{ width: 40px; height: 40px; } } .players.box table td.pos{ color: var(--text-color2); font-size: 15px; } .ds-widget h2 .icon-megaphone{ margin: -3px 4px 0 0px; font-size: 24px; vertical-align: middle; display: inline-block; } .ds-widget ul{ padding-inline-start: 7px; } .ds-widget li{ padding: 12px 0; border-bottom: 1px solid var(--background); } .ds-widget li a{ display: flex; align-items: center; } .ds-widget li:first-child{ padding-top: 0; } .ds-widget li:last-child{ border-bottom: none; padding-bottom: 0; } .ds-widget li.liveticker-teaser .image{ display: inline-block; width: 40px; margin: 0 5px 0 0; align-self: flex-start; } .ds-widget li.liveticker-teaser .image.away{ margin-right: 13px; } .ds-widget li.liveticker-teaser .title{ padding-right: 2px; color: #fff; } .news-slider { overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; } .col .news-slider > div.box { display: inline-block; width: 320px !important; height: 320px; } .col .news-slider > div.box.teaser2 .img{ height: 100%; min-height: 320px; } .col .news-slider > div.box.teaser2 .text h2 { font-size: 21px; margin-top: 21px; white-space: normal; } .news-slider > .more{ vertical-align: middle; margin-top: calc(-50% + 16px); margin-left: 10px; margin-right: 10px; } #liga_filter, #team_filter{ border: none; border-radius: 8px; margin: 10px; padding: 10px 36px 10px 17px; text-align: center; background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 17px center/8px 10px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } #matchesSearch_box{ margin: 24px auto 10px auto; width: 540px; max-width: calc(100% - 20px); position: relative; } #matchesSearch{ padding: 13px 46px 11px 50px; font-size: 24px; border: none; font-weight: bold; width: 100%; border-bottom: 1px solid var(--border-color); border-radius: 8px; margin: auto; display: block; border-color: rgb(58, 60, 62); background: rgb(30, 31, 32); color: #fff; } #matchesSearch:focus, #matchesSearch_box.active #matchesSearch{ border-color: #cbccce; background: #fff; color: #3d4248; } #matchesSearch_box .icon-search{ position: absolute; left: 12px; top: 11px; font-size: 30px; pointer-events: none; color: #3d4248; } #matchesSearch_box .icon-close{ position: absolute; right: 14px; top: 13px; font-size: 27px; display: none; cursor: pointer; color: #3d4248; } #matchesSearch_box.active .icon-close{ display: inline-block; } #matchesSearch_box .icon-close:hover{ color: var(--highlight); } #matchesSearch_box .autocomplete-suggestions{ border-top: 6px solid #fff; margin-top: -8px; box-shadow: 0 14px 25px -15px #000; border-radius: 0 0 8px 8px; } #matchesSearch_box .autocomplete-suggestion{ padding: 15px 19px 15px 48px; font-size: 22px; position: relative; } #matchesSearch_box .autocomplete-suggestion:last-child{ border-radius: 0 0 8px 8px; } #matchesSearch_box .autocomplete-no-suggestion{ border-radius: 0 0 8px 8px; padding: 7px 0 18px 38px; font-size: 17px; } #matchesSearch_box .autocomplete-group{ box-shadow: none; text-transform: uppercase; } #matchesSearch_box .autocomplete-suggestion .icon{ position: absolute; top: 16px; left: 15px; font-size: 25px; } .matchcard{ display: inline-block; width: 100%; padding: 10px; transition: transform 250ms ease-in-out; cursor: pointer; position: relative; } @media screen and (min-width:1000px){ .matchcard{ width: 50%; } } @media screen and (min-width:1200px){ .matchcard{ width: 33.333%; } } .matchcard:hover{ transform: scale(1.05); } .matchcard > div.box{ padding: 10px 15px; padding: 0; margin: 0; text-align: center; background: rgb(30,31,32); border-color: rgb(58,60,62); color: #fff; } .matchesContainer .matchcard .list{ display: none; } .matchesContainer.list .matchcard .grid{ display: none; } .matchesContainer.list .matchcard .list{ display: block; } .matchcard .liga{ position: absolute; top: 11px; left: 11px; text-align: left; color: #aaa; z-index: 0; font-size: 13px; line-height: 13px; } .matchcard .matchtime{ padding: 7px 14px; text-align: right; } .matchcard .matchtime.live{ color: var(--highlight); letter-spacing: 1px; } .matchcard .bg{ background-position: center center; background-repeat: no-repeat; background-size: cover; min-height: 190px; } .matchcard .teams{ text-align: center; vertical-align: middle; height: 56px; padding: 0 14px; vertical-align: middle; display: inline-flex; align-items: center; justify-content: center; text-wrap: pretty; text-wrap: balance; } .matchcard .teams .vs{ width: 27px; color: #aaa; } .matchcard .team{ display: inline-block; width: 50%; text-align: center; vertical-align: middle; } .matchcard .teamlogo{ display: inline-block; background: #ccc; width: 44px; margin: 0 10px; transform: skewX(-4.1deg); } .matchcard .teamlogo img{ background-color: transparent; width: 32px; margin: 6px; transform: skewX(4.1deg); } .matchcard .teamname{ height: 29px; padding: 0 5px; vertical-align: middle; display: inline-block; align-items: center; justify-content: center; text-wrap: pretty; text-wrap: balance; } .list .matchcard{ width: 100%; padding-bottom: 4px; } .list .matchcard:hover { transform: scale(1.018); } .list .matchcard > div.box{ text-align: left; } .list .matchcard .list .team:first-child{ text-align: right; } .list .matchcard .list .team:last-child{ text-align: left; } .list .matchcard .matchtime{ text-align: left; margin-bottom: -26px; } .list .matchcard .liga{ left: auto; right: 13px; } .list .matchcard .bg{ min-height: auto; display: inline-block; width: 120px; height: 64px; vertical-align: middle; margin-top: -34px; border-radius: 8px 0 0 8px; } .list .matchcard .teams{ vertical-align: middle; display: inline-block; height: 30px; max-width: calc(100% - 120px); } @media screen and (max-width:1000px){ .list .matchcard .teams{ display: inline-flex; height: 66px; margin-top: -15px; padding: 0 18px; } .list .matchcard .bg{ height: 84px; } } .matchesContainer .overcards{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.94); text-align: center; z-index: 10; display: none; } .matchesContainer .overcards.active{ display: block; } .matchesContainer .overcards .overcards_inner{ position: sticky; top: 110px; } .matchesContainer .overcards a{ color: #fff; } .matchesContainer .overcards a i{ margin-left: 2px; vertical-align: super; } .matchesContainer .overcards .icon-close{ position: absolute; top: -50px; right: 22px; font-size: 38px; cursor: pointer; } .calendarContainer.matches{ width: calc(100% - 20px); display: block; margin: auto; } .matchesContainer{ width: 100%; min-height: calc(100vh - 70px); display: block; position: relative; } .listtoggle{ position: absolute; top: 0; left: -72px; width: 53px; height: 53px; line-height: 60px; border-radius: 8px; text-align: center; font-size: 29px; background: rgb(30,31,32); border-bottom: 1px solid rgb(58,60,62); cursor: pointer; } .listtoggle .icon-grid{ font-size: 38px; line-height: 52px; } @media screen and (min-width:720px){ .calendarContainer.matches{ width: 340px; display: inline-block; vertical-align: top; padding-top: 10px; position: sticky; top: 46px } #matchesSearch_box{ margin-left: 350px; width: calc(100% - 360px); } .matchesContainer{ display: inline-block; width: calc(100% - 340px); vertical-align: top; } } .calendarContainer.matches .calendar{ box-shadow: 0 1px 0 rgb(58,60,62); border-radius: 8px; margin-bottom: 13px; background: rgb(30,31,32); color: #fff; } .calendarContainer.matches .headerRow, .calendarContainer.matches .headerRow td{ border-radius: 8px 8px 0 0; background: rgb(30,31,32); color: #fff; font-size: 19px; } .calendarContainer.matches .calendar td{ color: #fff; } .calendarContainer.matches .calendar td.gray{ color: #666; } .calendarContainer.matches .calendar tr:not(.headerRow):not(.subHeaderRow) td.gray:hover{ color: #666; background: transparent; } .calendarContainer.matches .calendar tr:not(.headerRow):not(.subHeaderRow) td:not(.gray):hover{ color: var(--highlight); background: transparent; font-weight: 600; transform: scale(1.033); } .calendarContainer.matches .calendar td .badge{ margin-left: 5px; text-shadow: none; } .calendarContainer.matches .calendar td.gray .badge{ display: none; } .calendarContainer.matches .calendar td.hide{ opacity: 0; } .calendarContainer.matches .calendar tr td.selected, .calendarContainer.matches .calendar tr td.selected:hover{ color: var(--highlight); font-weight: 600; } .calendarContainer.matches .calendar tr td.selected span{ background: #fff; border-radius: 100px; display: inline-block; height: 24px; width: 24px; line-height: 24px; color: rgb(30, 31, 32); } .calendarContainer.matches .calendar td{ height: 50px; width: 12%; } .calendarContainer.matches .calendar tr:first-child td{ height: 60px; padding-top: 10px; } .calendarContainer.matches .calendar tr:last-child td{ height: 70px; padding-bottom: 20px; } .calendarContainer.matches .calendar tr td:first-child{ padding-left: 8%; width: 20%; } .calendarContainer.matches .calendar tr td:last-child{ padding-right: 8%; width: 20%; } .calendarContainer.matches .calendar tr td:first-child .badge { margin-left: calc(8px + 19%); } .calendarContainer.matches .calendar tr td:last-child .badge { margin-left: calc(8px - 19%); } .calendarContainer.matches .calendar tr.headerRow td:first-child, .calendarContainer.matches .calendar tr.headerRow td:last-child{ width: inherit; padding-left: inherit; padding-right: inherit; text-align: center; } .calendarContainer.matches td.lastMonth{ color: inherit; } .scrollCalendar{ position: fixed; display: none; right: 14px; bottom: 7px; width: 40px; height: 40px; font-size: 23px; padding-left: 1px; line-height: 44px; border-radius: 8px; text-align: center; color: rgb(30, 31, 32); background: #fff; box-shadow: 1px 1px 10px -5px #000; z-index: 100; } .col .box.liveticker-sport-filter{ height: 42px; margin:10px; margin-top: -10px; border-radius: 0 0 8px 8px; } @media screen and (max-width: 800px){ .col .box.liveticker-sport-filter{ margin-left: 10px; margin-right: 10px; } } .liveticker-sport-filter select{ padding: 11px 12px; border: none; display: block; margin: auto; text-align: center; font-size: 15px; color: var(--text-color); cursor: pointer; } .dropbtn { padding: 11px; text-align: center; font-size: 16px; border: none; cursor: pointer; } .dropbtn i.icon-down{ opacity: 0.66; float: right; margin: -12px -7px 0 -28px; padding: 13px 11px 13px 12px; border-left: 1px solid var(--background); opacity: 0.66; } .dropdown { position: relative; } .dropdown-content { display: none; position: absolute; margin-top: -8px; border-radius: 0 0 8px 8px; width: 100%; background: var(--box-background); border-top: 8px solid var(--box-background); border-bottom: 1px solid var(--border-color); padding-bottom: 5px; z-index: 5; } .dropdown-content span { padding: 12px; margin: 0 3px; text-decoration: none; display: block; text-align: center; cursor: pointer; border-top: 1px solid var(--border-color2); } .dropdown-content span:last-child { border-radius: 0 0 8px 8px; } .dropdown-content span:hover {background-color: #f1f1f1} .dropdown.active .dropdown-content { display: block; } .k_slider_box{ height: 255px; overflow: hidden; } .k_slider{ overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; white-space: nowrap; height: 276px; padding: 5px 0 20px 0; } .k_slider_item{ position: relative; width: 230px; height: 100%; display: inline-block; text-align: left; white-space: normal; vertical-align: top; margin-right: 12px; overflow: hidden; padding: 6px; border: 2px solid #EBEBEB; border-radius: 6px; } .k_slider_image{ border-radius: 6px; overflow: hidden; } .k_slider_image img{ width: auto; height: auto; transition: transform 3.5s cubic-bezier(0.19,1,.22,1); border-radius: 6px !important; } .k_slider_item:hover .k_slider_image img{ transform: scale(1.125) rotate(0.02deg) !important; } .k_slider h3{ font-size: 14px; line-height: 17px; margin: 4px 0; } .k_slider h4{ font-size: 11px; color: var(--highlight); margin: 9px 0 4px 0; } .k_slider_nav{ position: absolute; top: 50%; width: 40px; height: 50px; margin-top: -25px; vertical-align: middle; text-align: center; line-height: 54px; font-size: 40px; background: #eff0f3; color: var(--highlight); cursor: pointer; z-index: 3; } .k_slider_nav.left { left: 0; padding-right: 2px; display: none; } .k_slider_nav.right { right: 0; padding-left: 2px; }