.euroRoadToCup .CheckedIn:before, .euroRoadToCup li.hasteam:after, .euroRoadToCup li.select3rd:after, .EuroMatchDetails .matchDetailsTabs .timeline .cnts ul li .min:after, .EuroMatchDetails .matchDetailsTabs .timeline .MatchHalf .min:after, .leagueImage:before, .newPred .createLeague .u-form-group .selectlst:after { font-family: "ykIcons"; font-style: normal; font-weight: normal; speak: none; display: inline-block; text-decoration: inherit; text-align: center; font-variant: normal; text-transform: none; line-height: 1.7em; } .euroPredCnts .FullWidthBK h1:first-child { bottom: 66px; font-size: 44px } .euroPredCnts .FullWidthBK h2, .newPred .euroPredCnts .FullWidthBK h2 { bottom: 20px; font-size: 33px } /* YK Prediction */ .predPage .predictionHolder { display: inline-block; width: 100%; float: right } .predPage .predictionHolder .countDown { display: inline-block; width: 100%; float: right; margin-bottom: 10px } .predPage .predHead { width: 100%; height: 200px; margin: 0 auto 20px; text-align: center; overflow: hidden; background: url("../../Images/predHeader.jpg?ref=1") no-repeat center center; background-size: auto 100% } .predPage .loginCnts { display: inline-block; float: right; width: 100%; position: relative; } .predPage .pred_banner { width: 100%; display: inline-block } .predPage .countDown .LNumb { font: bold 24px arial; padding: 0 10px 0 0; } .predPage .MangLeag { direction: rtl } .predPage .pred_rules .MoreBlue { height: 23px } .predPage .paginghref { margin: 0 10px 0 0; padding: 3px 8px 0 } .predPage .pagingInside { padding: 5px 10px; background: #424242; border: 0 } .predPage .jokerImg { padding-left: 5px; margin-top: 2px } .predPage .predJoker .jokerCntnr { display: none } .predPage .predButton-login { background: url("../../Images/FBLogin-Ar.png?ref=1") no-repeat; color: #666; width: 166px; height: 44px; border: 0; cursor: pointer; margin: 20px auto; display: block } .predPage #FacebookLogin, .predPage #PersonalData, .predPage #SavedSuccess { width: 60%; padding: 20px; margin: 0 auto 30px; text-align: center; border: 1px solid #ddd; background: #fff; } .predPage #FacebookLogin p, .predPage #SavedSuccess p { font-family: droidLight, Arial; display: block; text-align: center } .predPage #PersonalData .item { font-family: droidLight,Arial; float: right; display: inline-block; width: 100%; margin-bottom: 10px } .predPage #PersonalData .item .label { width: 120px; float: right; margin-left: 10px; display: inline-block; direction: rtl; color: #000; font-size: 14px; text-align: right; line-height: 3 } .predPage #PersonalData .item .control { width: calc(100% - 130px); padding: 9px 10px; border: 0; background-color: #fff; font-family: droidLight, Arial; font-size: 12px; color: #000; border: 1px solid #ddd } .predPage #PersonalData button { display: inline-block; width: 90px; height: 40px; background: #0277bd; padding: 0 10px; color: #fff; font-family: droidLight,Arial; font-size: 14px; line-height: 3; } .predPage #PersonalData button:hover { background: #1b92d9; } .predPage .pred_rules { font-family: droidLight,Arial; } .predPage .PersData img { float: right; margin-left: 10px; padding: 1px; border: 1px solid #000; } .predPage .PersData span { font-family: droidLight,Arial; font-size: 18px; float: right; } .predPage .predwht li { margin: 0 0 0 150px; text-align: center; float: right } .predPage .predwht li span { display: block; text-align: center } .predPage #Predictions .DataCell { color: #fff } .predPage .logOutBtn { position: absolute; right: 76px; top: 30px; } .predPage #Logout { color: #0277bd; font-family: droidLight,Arial; font-size: 14px; background: none } .predPage #Logout:hover { color: #000 } .predPage .predictionHolder .title { width: 100%; display: inline-block; float: right; background: #000; text-align: center; color: #fff; font-family: droidLight, Arial; font-size: 12px; position: relative; overflow: hidden; } .predPage .predictionHolder .title li, .predPage .predictionHolder .matches li { float: right; text-align: center; margin: 0; padding: 0; border: 0; background: none; font-family: droidLight, Arial; line-height: 2.4; } .predPage .predictionHolder ul li.predDate, .predPage .predictionHolder ul li.predJoker { width: 100px } .predPage .predictionHolder ul li.predJoker { padding: 0 10px; position: relative; } .predPage .predictionHolder ul li.predJoker input[type="radio"] + label { text-align: center } .predPage .predictionHolder ul li.predJoker input[type="radio"] + label span { margin: calc((100% - 16px) / 2) 0 } .predPage .predictionHolder ul li.predTeam { width: calc((100% - 320px)/2) } .predPage .predictionHolder ul li.order { width: calc(100% /3) } .predPage .predictionHolder ul li.predResult { width: 120px } .predPage .predictionHolder .matches li img { height: 50px; width: auto } .predPage .predictionHolder .predDate { width: 12% } .predPage .predictionHolder .matches .predDate, .predPage .predictionHolder .matches .predResult { margin-top: 26px; font-size: 14px } .predPage .predictionHolder .predName a { color: #0277bd } .predPage .predictionHolder .predName a:hover { color: #000 } .predPage .predictionHolder .predName p { text-align: center } .predPage .pattern10 { margin-left: 20px; width: calc(100% - 320px); display: inline-block; float: right; z-index: 1; position: relative; } .predPage .pattern10 .matches { overflow: hidden; background: #fff; border: 1px solid #ddd; margin-bottom: 10px; padding: 10px 0 } .predPage .predictionHolder .predResult input { width: calc((100% - 20px) / 2); padding: 3px 0; text-align: center; border: 1px solid #444 } .predPage .predictionHolder .predResult .score:focus { border: 1px solid rgba(0,0,0,.5) !important; outline: 0; } .predPage .ttl h3 { float: left; margin: 5px 10px; font-family: droidLight,Arial; font-size: 14px } .predPage .countDown p { font-family: droidLight,Arial; text-align: center } .predPage .predictionHolder .team { display: inline-block; width: 100%; font-family: droidLight, Arial; font-size: 13px; float: right; margin-top: 5px } .predPage .TourTabs { float: left; font-family: droidLight,Arial; font-size: 14px; margin-top: 15px } .predPage .TourTabs li { float: right; border-right: 1px solid #000 } .predPage .TourTabs li:first-child { border: 0 } .predPage .TourTabs a { color: #0277bd; padding: 0 10px } .predPage .TourTabs a:hover { color: #000 } .predPage .txtcenter .more { display: inline-block; width: 90px; height: 40px; background: #0277bd; padding: 0 10px; color: #fff; font-family: droidLight,Arial; font-size: 14px; line-height: 3; } .predPage .txtcenter .more:hover { background: #1b92d9 } .predPage .txtcenter { margin-bottom: 20px } .predPagNo { float: right } .predPagNo span { font-size: 14px } .predPaging { float: left; margin-left: 10px } .predPaging .more { border: 0; height: 32px; line-height: 2; margin: 4px 10px 0 0; cursor: pointer } .predPaging input[type=number] { padding: 4px 0 } .predPage .matchDetailsTabs .tab button:before { content: none } .predPage .matchTabLinks img { width: 60px } .predPage .matchDetailsTabs .matchDetailsTtl { width: 100%; margin: 0 } .predPage .menu-inner { margin-bottom: 20px; position: relative; z-index: 1; } .predPage .ClipTitles { height: 30px; padding: 0; background: #000; } .predPage .ClipTitles .TitleTxt { float: right; padding: 2px 10px; background: none; color: #fff; border-right: none } .predPage .g2a { display: inline-block; width: 100%; margin-bottom: 20px; } .predPage .predwht li { margin: 0 0 0 20px; text-align: center; float: right; width: calc((100% - 40px) / 3) } .predPage .predwht li:last-child { margin-left: 0 } .predPage .predwht li span { display: block; text-align: center; font-size: 14px } .predPage .predwht li span.points { font-size: 13px; font-family: droidLight,Arial } .predPage .predwht li span.num { font-family: Arial; font-weight: bold; font-size: 24px; display: inline-block; margin-left: 5px } .predPage .g2a p { font-size: 14px; margin: 15px 0 } /** Aya **/ /******************* RoadToCup ****************/ .RoadToCup { display: inline-block; padding-bottom: 68%; position: relative } .RoadToCup:before { content: ""; center top no-repeat #fff; background-size: 100%; position: absolute; top: 0; left: 0; width: 100%; height: 100% } .RoadToCup .rightSlide .Cupitem { right: 12px; } .RoadToCup .Cupitem { font-family: droidLight, arial; display: inline-block; width: 13%; background-color: #fff; height: 27px; float: right; top: 20.5%; position: absolute; border: 1px solid #d9d9d9; } .RoadToCup .option { font-size: 14px; text-align: right; width: 100%; display: inline-block; float: right; cursor: pointer; color: #888; } .RoadToCup .option.icon-Darrow:before { content: 'F'; color: #fff; background-color: #000; float: right; height: 100%; width: 20%; line-height: 1.9; } .RoadToCup .option span { font-family: droidLight, arial; font-size: 13px; float: right; margin-right: 3px; } .RoadToCup .DP { width: 100%; top: 26px; position: absolute; left: 0px; border: 1px solid #ccc; border-top: none; background-color: #fff; margin: 0; padding: 0; display: none; font-family: droidLight, arial; z-index: 1; } .RoadToCup .DP li { font-family: droidLight, arial; color: #888; border-bottom: 1px solid #e6e6e6; margin: 0px 7px; margin-top: 5px; padding-bottom: 5px; font-size: 15px; cursor: pointer } .RoadToCup .leftSlide .DP li, .RoadToCup .Winnerleft .DP li, .RoadToCup .Winnerleft2 .DP li, .RoadToCup .onewinner2 .DP li { text-align: left } .RoadToCup .leftSlide .option, .RoadToCup .Winnerleft .option, .RoadToCup .Winnerleft2 .option, .RoadToCup .onewinner2 .option { text-align: left; float: left; } .RoadToCup .Cup1 { top: 13%; } .RoadToCup .Cup4 { top: 38%; } .RoadToCup .Cup3 { top: 30.5%; } .RoadToCup .Cup6 { top: 55%; } .RoadToCup .Cup5 { top: 47.5%; } .RoadToCup .Cup8 { top: 72.5%; } .RoadToCup .Cup7 { top: 65%; } .RoadToCup .leftSlide .Cupitem { float: left; left: 12px } .RoadToCup .leftSlide .option.icon-Darrow:before { float: left; } .RoadToCup .leftSlide .option span { float: left; margin-left: 5px; } .RoadToCup .Winnerright .Cupitem { left: 82%; top: 17%; transform: translate(-82%,-17%); } .RoadToCup .Winnerright .winnerB { top: 35%; left: 82%; transform: translate(-82%,-35%); } .RoadToCup .Winnerright .winnerC { top: 53%; left: 82%; transform: translate(-82%,-53%); } .RoadToCup .Winnerright .winnerD { top: 71%; left: 82%; transform: translate(-82%,-71%); } .RoadToCup .Winnerleft .Cupitem { float: left; left: 17%; top: 17%; transform: translate(-17%,-17%); } .RoadToCup .Winnerleft .option.icon-Darrow:before { float: left } .RoadToCup .Winnerleft .option span { float: left; margin-left: 3px; } .RoadToCup .Winnerleft .winnerB { top: 35%; left: 17%; transform: translate(-17%,-35%); } .RoadToCup .Winnerleft .winnerC { top: 53%; left: 17%; transform: translate(-17%,-53%); } .RoadToCup .Winnerleft .winnerD { top: 71%; left: 17%; transform: translate(-17%,-71%); } .RoadToCup .Winnerright2 .Cupitem { top: 26%; transform: translate(-66%,-26%); left: 66%; } .RoadToCup .Winnerright2 .Cupitem.winnerB { top: 62%; left: 66%; transform: translate(-66%,-62%); } .RoadToCup .Winnerleft2 .Cupitem { top: 26%; transform: translate(-33%,-26%); left: 33%; } .RoadToCup .Winnerleft2 .Cupitem .option.icon-Darrow:before { float: left } .RoadToCup .Winnerleft2 .Cupitem .option span { float: left; margin-left: 5px; } .RoadToCup .Winnerleft2 .Cupitem.winnerB { top: 62%; left: 33%; transform: translate(-33%,-62%); } .RoadToCup .onewinner .Cupitem { top: 44%; left: 63%; transform: translate(-63%,-44%); } .RoadToCup .onewinner2 .Cupitem { left: 37%; top: 44%; transform: translate(-37%,-44%); } .RoadToCup .onewinner2 .option.icon-Darrow:before { float: left } .RoadToCup .onewinner2 .option span { float: left; margin-left: 5px; } .RoadToCup .winnerIN { display: inline-block; top: 71.5%; left: 50%; position: absolute; transform: translate(-50%,-71.5%); width: 13%; } .RoadToCup .winnerIN .Cupitem { width: 100%; background-color: transparent; height: auto; position: relative; border: none; } .RoadToCup .winnerIN .option.icon-Darrow:before { background-color: transparent; margin-right: 5px } .RoadToCup .winnerIN .DP { background-color: #cc0007; border: none; border-radius: 5px; top: 31px; } .RoadToCup .winnerIN .DP li { color: #fff; border-bottom: none; font-size: 14px; } .RoadToCup img { width: 25px; height: 12px } .RoadToCup .rightSlide img, .RoadToCup .Winnerright img, .RoadToCup .Winnerright2 img, .RoadToCup .onewinner img { float: right; margin: 7px 4px 0 4px; } .RoadToCup .leftSlide img, .RoadToCup .Winnerleft img, .RoadToCup .Winnerleft2 img, .RoadToCup .onewinner2 img { float: left; margin: 7px 4px 0 4px; } .RoadToCup .leftSlide .Cup1 { top: 20.5%; } .RoadToCup .leftSlide .Cup2 { top: 13%; } .RoadToCup .leftSlide .Cup3 { top: 38%; } .RoadToCup .leftSlide .Cup4 { top: 30%; } .RoadToCup .leftSlide .Cup5 { top: 55%; } .RoadToCup .leftSlide .Cup6 { top: 47.5%; } .RoadToCup .leftSlide .Cup7 { top: 72.5%; } .RoadToCup .leftSlide .Cup8 { top: 65%; } .RoadToCup .imageRight { position: absolute; right: 0; width: 145px; height: 40px; } .RoadToCup .imageLeft { position: absolute; left: 0; width: 145px; height: 40px; } .RoadToCup .winnerIN .option { color: #fff; text-align: center; font-size: 13px; } .RoadToCup .Mbutton { display: inline-block; width: 100%; margin-bottom: 40px; margin-top: 25px; position: relative; } .RoadToCup .Mbutton a { line-height: 1; padding: 10px 25px; background-color: #ddd; height: 36px; text-align: center; border-radius: 3px; margin-left: 10px } .RoadToCup .Mbutton a:last-child { margin-left: 0; } .RoadToCup .Mbutton .button { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-family: arial; font-size: 14px; } .RoadToCup .Mbutton .Cnext { background-color: #b10006; color: #fff; float: right } .RoadToCup .Mbutton .Cback { background-color: #5dc9ef; color: #fff; float: left } .RoadToCup .mobile { display: none } .RoadToCup h2 { position: absolute; width: 30%; float: right; font-family: droidLight, arial; font-size: 12px; color: #a49348; font-size: 13px; width: 12% } .RoadToCup .rightSlide h2.cupText1 { top: 10%; left: 96%; transform: translate(-96%, -10%); } .RoadToCup h2.cupText2 { top: 17.5%; left: 96%; transform: translate(-96%, -17.5%); } .RoadToCup h2.cupText3 { top: 28%; left: 96%; transform: translate(-96%, -28%); } .RoadToCup h2.cupText4 { top: 36%; left: 96%; transform: translate(-96%, -36%); } .RoadToCup h2.cupText5 { top: 45.5%; left: 96%; transform: translate(-96%, -45.5%); } .RoadToCup h2.cupText6 { top: 53.5%; left: 96%; transform: translate(-96%, -53.5%); } .RoadToCup h2.cupText7 { top: 64%; left: 96%; transform: translate(-96%, -64%); } .RoadToCup h2.cupText8 { top: 71.5%; left: 96%; transform: translate(-96%, -71.5%); } .RoadToCup .leftSlide h2.cupText1 { top: 17.5%; left: 0; transform: translateY(-17.5%); } .RoadToCup .leftSlide h2.cupText2 { top: 10%; left: 0; transform: translateY(-10%); } .RoadToCup .leftSlide h2.cupText3 { top: 36%; left: 0; transform: translateY(-36%); } .RoadToCup .leftSlide h2.cupText4 { top: 28%; left: 0; transform: translateY(-28%); } .RoadToCup .leftSlide h2.cupText5 { top: 53.5%; left: 0; transform: translateY(-53.5%); } .RoadToCup .leftSlide h2.cupText6 { top: 45.5%; left: 0; transform: translateY(-45.5%); } .RoadToCup .leftSlide h2.cupText7 { top: 71.5%; left: 0; transform: translateY(-71.5%); } .RoadToCup .leftSlide h2.cupText8 { top: 64%; left: 0; transform: translateY(-64%); } .RoadToCup .Winnerright h2 { top: 13.5%; left: 76%; transform: translate(-76%, -13.5%); } .RoadToCup .Winnerright h2.cupTextA { top: 31.5%; left: 76%; transform: translate(-76%, -31.5%); } .RoadToCup .Winnerright h2.cupTextD { top: 49.5%; left: 76%; transform: translate(-76%, -49.5%); } .RoadToCup .Winnerright h2.cupTextC { top: 67%; left: 76%; transform: translate(-76%, -67%); } .RoadToCup .Winnerleft h2 { top: 13.5%; left: 15%; transform: translate(-15%, -13.5%); width: 10%; } .RoadToCup .Winnerleft h2.cupTextA { top: 31.5%; left: 15%; transform: translate(-15%, -31.5%); } .RoadToCup .Winnerleft h2.cupTextD { top: 49.5%; left: 15%; transform: translate(-15%, -49.5%); } .RoadToCup .Winnerleft h2.cupTextC { top: 67%; left: 15%; transform: translate(-15%, -67%); } .RoadToCup .Winnerright2 h2 { top: 22%; left: 61%; transform: translate(-61%, -22%); } .RoadToCup .Winnerright2 h2.cupTextA { top: 58%; left: 61%; transform: translate(-61%, -58%); } .RoadToCup .Winnerleft2 h2 { top: 22%; left: 30%; transform: translate(-30%, -22%); width: 10%; } .RoadToCup .Winnerleft2 h2.cupTextA { top: 58%; left: 30%; transform: translate(-30%, -58%); } .RoadToCup .onewinner h2 { top: 40%; left: 58%; transform: translate(-58%, -40%); } .RoadToCup .onewinner2 h2 { top: 40%; left: 33%; transform: translate(-33%, -40%); width: 10%; } .ShareBK { display: inline-block; width: 100% } .ShareBK .ShareImg { position: relative; width: 1024px; height: 550px; margin: 0 calc((100% - 1024px)/2); } .ShareBK img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .ShareBK .ShareBT { position: relative; display: inline-block; width: 100%; margin: 35px 0 20px 0; } .ShareBK .ButtonSH { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .ShareBK a { padding: 10px; width: 100px; border-radius: 5px; color: #fff; margin-left: 20px; font-family: Arial; font-size: 15px; } .ShareBK .FBshare { background-color: #3a589b; float: left; margin-left: 0 } .ShareBK .Play { background-color: #b10006; float: right; } .ShareBK .FBshare:hover { background-color: #3e5fa8; } .ShareBK .Play:hover { background-color: #990005 } .RoadToCup .FBshare { position: absolute; background-color: #3a589b; padding: 10px; width: 100px; border-radius: 5px; color: #fff; margin-left: 20px; font-family: Arial; font-size: 15px; top: 80%; left: 48%; transform: translate(-48%,-80%); } /*********************Choose Squad*************/ .chooseSquadDiv .content-wrap { padding: 0; background: #000; } .chooseSquadDiv .content { padding: 0 } .chooseSquadDiv .csBackground p { line-height: normal; } .chooseSquadDiv .wrapper { padding: 10px; width: calc(100% - 20px) } .chooseSquadDiv .PageWidth { width: calc(100% - 230px) } .chooseSquadDiv .csBackground { margin: 0; padding: 0; background: url(../../Images/ACN/legendary-team-cover.jpg?ver=0.3) no-repeat #000; background-size: 100%; overflow: hidden; padding-bottom: 55%; position: relative; } .chooseSquadDiv .csBackground.squadAhpy { background-image: url(../../Images/AhlyPyramids/AhlyVSPyramidsBG-Inner.jpg); background-color: #000; background-position: center -150px } .chooseSquadDiv .csBackground .stepOne { display: inline-block; width: 100%; padding: 20px 0 0; position: absolute; right: 0 } .chooseSquadDiv .csBackground .close { position: absolute; top: 20px; left: 20px; width: 18px; height: 18px; visibility: hidden; opacity: 0; z-index: 2 } .chooseSquadDiv .csBackground .icon-close:before { content: "B"; font-size: 18px; color: #fff; line-height: 1 } .chooseSquadDiv.dropdownOpen .close, .csBackground .stepTwo .close { visibility: visible; opacity: 1; right: auto; } .chooseSquadDiv .csBackground ul.dropmenu { text-align: center; float: right; display: inline-block; /* position: relative; */ width: 100%; padding: 0 80px; } .chooseSquadDiv .csBackground ul.dropmenu .border { position: relative; } .chooseSquadDiv .csBackground ul li.button-dropdown { margin-left: 20px; display: inline-block; width: calc((100% - 60px) / 4); float: right; } .chooseSquadDiv .csBackground.SquadInt ul li.button-dropdown { width: calc((100% - 80px) / 5) !important } .chooseSquadDiv .csBackground ul li.button-dropdown:last-child { margin-left: 0 } .chooseSquadDiv .csBackground ul li a { list-style: none; color: #fff; font-size: 13px; border: 1px solid #000000eb; display: inline-block; background-color: #000000eb; padding: 5px 12px; line-height: 2.5; width: 100%; font-family: droidLight, Arial; text-decoration: none; position: relative; z-index: 2; border-radius: 8px } .chooseSquadDiv .csBackground ul li a.player { background: none; width: auto; border-radius: 0; padding: 0; border: none } .chooseSquadDiv .csBackground a.imagee { position: absolute; padding-top: 8%; padding-right: 21%; display: none; } .chooseSquadDiv .csBackground ul li a.icon-download::before { content: 'F'; float: left; line-height: 2.5 } .chooseSquadDiv .stepOne .Warning { margin: 22px calc((100% - 600px) / 2); text-align: center; background-color: rgba(0, 0, 0, 0.9); padding: 20px; color: #fff; margin-top: 50px; height: 200px; line-height: 7; font-size: 22px; font-family: droidLight,Arial; z-index: 9999; position: absolute; } .chooseSquadDiv .stepOne .Warning .Warningclose { float: left; line-height: 1; } /*.chooseSquadDiv .SquadEG.csBackground{padding-bottom:55%}*/ .chooseSquadDiv .playplanoptions li.playplanopt { text-align: center; width: calc((100% - 150px) / 5); float: right; margin-left: 30px; } .chooseSquadDiv .playplanoptions li.playplanopt:last-child { margin-left: 0 } .chooseSquadDiv .playplanoptions li.playplanopt h4 { font-family: Arial; margin-bottom: 18px; font-size: 20px; color: #fff } .chooseSquadDiv .playplanoptions li.playplanopt ol li { float: none; margin-bottom: 0; display: inline-block; width: 13px; height: 13px; background-color: #666; -webkit-border-radius: 13px; border-radius: 13px; margin-left: 12px; } .chooseSquadDiv .playplanoptions li.playplanopt .row { margin-bottom: 10px; } .chooseSquadDiv .playplanoptions li.playplanopt:hover h4, .chooseSquadDiv .playplanoptions li.playplanopt.active h4 { color: #08a6f0; } .chooseSquadDiv .playplanoptions li.playplanopt:hover ol li, .chooseSquadDiv .playplanoptions li.playplanopt.active ol li { background-color: #08a6f0; } /*--------------------dropdown menu---------------*/ .chooseSquadDiv .csBackground ul.dropdown-menu1 { padding: 120px 80px 10px; background: rgba(0, 0, 0, 0.7); z-index: 1; display: none; position: absolute; float: right; width: 100%; right: 0; top: 0; } .chooseSquadDiv .csBackground ul.dropdown-menu1 li { width: calc((100% - 40.1px )/ 5); display: inline-block; margin-left: 10px; margin-bottom: 30px; float: right } .chooseSquadDiv .csBackground ul.dropdown-menu1 li:nth-child(5n) { margin-left: 0 } .chooseSquadDiv .csBackground ul.dropdown-menu1 li h1 { font-size: 15px; color: #fff; font-family: droidLight, Arial; line-height: 1.5; } .chooseSquadDiv .csBackground ul.dropdown-menu1 li p { color: #777; font-size: 13px; font-family: droidLight, Arial; } .chooseSquadDiv .csBackground .dropmenu li a:focus, .chooseSquadDiv .csBackground .dropmenu li a.dropdown-toggle.active { border: 1px solid #5aa002; color: #5aa002; } .chooseSquadDiv .active:after { display: none; } /*-----------------------stepTwo-----------------*/ .chooseSquadDiv .stepTwo { overflow: hidden; position: absolute; height: 100%; width: 100%; } .chooseSquadDiv .stepTwo .details { position: relative; height: 380px; width: 770px; margin: 50px calc((100% - 770px) / 2) 0; background-color: rgba(0, 0, 0, 0.8); text-align: center; display: inline-block; font-family: droidLight, Arial; } .chooseSquadDiv .stepTwo a.close.icon-download:before { content: 'B'; float: left; padding: 10px; color: #fff; } .chooseSquadDiv .stepTwo .player-image { width: 217px; height: 320px; float: right; overflow: hidden; position: relative; } .chooseSquadDiv .stepTwo img { width: 100%; height: 100%; position: absolute; top: 0; left: 0 } .chooseSquadDiv .stepTwo .player-container { margin: 30px 60px; display: inline-block } .chooseSquadDiv .stepTwo .playerDtls { float: right; margin-right: 30px; margin-top: 40px; width: calc(100% - 247px) } .chooseSquadDiv .stepTwo .detailss { float: right; } .chooseSquadDiv .stepTwo .detailss h2 { font-size: 24px; color: #fff; line-height: 1; margin-bottom: 10px } .chooseSquadDiv .stepTwo .detailss p { font-size: 18px; color: #888; line-height: 1 } .chooseSquadDiv .stepTwo .range { float: left; border-radius: 50%; height: 140px; width: 140px; position: relative; } .chooseSquadDiv .stepTwo .range h3 { padding: 20px 0 0 0; } .chooseSquadDiv .progress-bar1 div { position: absolute; height: 140px; width: 140px; border-radius: 50%; top: 0; left: 0; } .chooseSquadDiv .progress-bar1 div span { position: absolute; font-family: Arial; font-size: 25px; line-height: 75px; height: 120px; width: 120px; left: 10px; top: 10px; text-align: center; border-radius: 50%; color: #fff; display: none; } .chooseSquadDiv .range .percent { position: absolute; width: 120px; height: 120px; top: 50%; left: 10px; margin-top: -60px; } .chooseSquadDiv .range .percent p { color: #fff; font-family: droidLight, Arial; font-size: 14px; text-align: center; position: absolute; top: 50%; left: 50%; width: 100%; transform: translate(-50%,-50%); } .chooseSquadDiv .range .percent p span { color: #fff; font-family: Arial; font-size: 32px; font-weight: bold; text-align: center; display: block; } .chooseSquadDiv .progress-bar1 .background { border: 10px solid black; background: none; padding-bottom: 0; } .chooseSquadDiv .progress-bar1 .rotate { clip: rect(0 70px 140px 0); border: 10px solid rgba(90, 160, 2, 1); background: none; } .chooseSquadDiv .progress-bar1 .left { clip: rect(0 70px 140px 0); width: 140px; height: 140px; opacity: 1; border: 10px solid black; background: none; left: 0; top: 0; -webkit-backface-visibility: hidden; } .chooseSquadDiv .progress-bar1 .right { clip: rect(0 70px 140px 0); transform: rotate(180deg); border: 10px solid rgba(90, 160, 2, 1); background: none; opacity: 0; } @keyframes toggle { 0% { opacity: 0; } 100% { opacity: 1; } } .chooseSquadDiv .stepTwo .range .span2 { font-size: 22px; padding-right: 32px; } .chooseSquadDiv .stepTwo .range .span1 { font-size: 22px; padding-right: 22px; } .chooseSquadDiv .stepTwo .buttons { display: inline-block; margin: 60px 0 0 0; float: right } .chooseSquadDiv .stepTwo .buttons a { float: right; height: 36px; text-align: center; padding-top: 10px; color: #fff; font-size: 18px; margin-right: 25px; } .chooseSquadDiv .stepTwo .buttons .button { border-radius: 5px; padding: 0 10px; margin-right: 0; margin-left: 20px; line-height: 2.7; text-decoration: none; font-family: droidLight,arial; font-size: 14px } .chooseSquadDiv .stepTwo .buttons .button.pluss, .chooseSquadDiv .stepTwo .buttons .button.remove { background-color: #5aa002; } .chooseSquadDiv .stepTwo .buttons .button.miinus { background-color: #000000; } .chooseSquadDiv .stepTwo .buttons a.pluss.icon-download:before { content: 'H'; float: left; margin-right: 10px; line-height: 2.3; font-size: 16px } .chooseSquadDiv .stepTwo .buttons a.remove.icon-download:before { content: 'J'; float: left; margin-right: 10px; line-height: 2.3; font-size: 16px } .chooseSquadDiv .stepTwo .buttons img { float: left; padding-left: 18px; padding-top: 4px; } .chooseSquadDiv .stepTwo .buttons a.miinus.icon-download:before { content: 'I'; float: left; margin-right: 10px; line-height: 2.3; font-size: 16px } .chooseSquadDiv .csBackground .choose-team { position: absolute; width: 100%; display: inline-block; display: flex; flex-wrap: wrap; align-content: space-between; justify-content: center; align-items: center; bottom: 50px; background: rgba(0,0,0,0.6); padding: 0 80px; } .chooseSquadDiv .csBackground .choose-team .image-mini { float: right; width: 62px; height: 100px; margin: 10px; position: relative; display: inline-block; } .chooseSquadDiv .csBackground .choose-team .image-mini img { position: relative; width: 100%; height: 100% } .chooseSquadDiv .csBackground .choose-team:nth-child(12n) { margin-left: 0; } .chooseSquadDiv .stepTwo .PlayerAdvice { display: inline-block; float: right; margin: 18px 0 10px 0; width: 100%; } .chooseSquadDiv .RadioLabel { color: #fff; font-size: 12px; margin: 0 } .chooseSquadDiv .SquadEG .stepTwo .details { height: 410px !important; } .chooseSquadDiv .SquadEG .stepTwo .buttons { margin: 0 !important; } /*.chooseSquadDiv .SquadEG .stepTwo .player-image {height: 350px!important;}*/ /*---------------- my team section------------------*/ .chooseSquadDiv .stepThree { position: absolute; overflow: hidden; width: 100%; height: 100%; z-index: 999 } .chooseSquadDiv .stepThree .containner { position: absolute; background-color: rgba(0, 0, 0, 0.8); width: calc(100% - 100px); font-family: droidLight, Arial; left: 50%; transform: translateX(-50%); top: 20px } .chooseSquadDiv .stepThree .bottom-content { display: inline-block; width: 100%; padding: 0 20px 4px } .chooseSquadDiv .stepThree .bottom-content .rightt, .chooseSquadDiv .stepThree .bottom-content .leftt { float: right; } .chooseSquadDiv .stepThree .bottom-content .leftt { float: left; margin-top: 16px; } .chooseSquadDiv .stepThree .bottom-content h5 { color: #fff; font-size: 18px; text-align: right; } .chooseSquadDiv .stepThree .bottom-content p { color: #fff; font-size: 14px; } .chooseSquadDiv .stepThree .top-content h4 { text-align: center; color: #e7e2b3; padding: 10px; font-family: droidLight, Arial; } .chooseSquadDiv .stepThree .top-content h4 span { font-family: arial } .chooseSquadDiv .stepThree .top-content .playerContainer { width: 100%; display: flex; flex-wrap: wrap; align-content: space-between; justify-content: center; align-items: center; padding: 10px 0 20px; } .chooseSquadDiv .stepThree .top-content .team-image { float: right; margin: 0 6px; width: 128px; height: 206px; position: relative; margin-bottom: 10px } .chooseSquadDiv .stepThree .top-content .team-image img { width: 100%; height: 100%; position: absolute; top: 0; right: 0 } .chooseSquadDiv .stepThree .bottom-content a.fb { text-transform: uppercase; float: left; border-radius: 5px; background-color: #3a589b; color: #fff; padding: 7px 15px; text-decoration: none; font-size: 15px; font-family: arial; line-height: 2; } .chooseSquadDiv .stepThree .bottom-content a.icon-download:before { content: 'b'; margin-right: 10px; font-size: 18px; float: left; } .chooseSquadDiv .SquadEG .stepThree .top-content .team-image { height: 153px; width: 114px; margin: 0 22px; margin-bottom: 20px; } /*---------------shareResult------------------*/ .chooseSquadDiv .containner1 { padding: 0 10px; width: calc(100% - 104px); font-family: droidLight, Arial; position: absolute; overflow: hidden; left: 50%; top: 15%; transform: translate(-50%, -13%); } .chooseSquadDiv .top-content1 { display: inline-block; } .chooseSquadDiv .top-content1 .playerContainer1 { width: 100%; display: flex; flex-wrap: wrap; align-content: space-between; justify-content: center; align-items: center; } .chooseSquadDiv .top-content1 .playerContainer1 img { width: 100%; } .chooseSquadDiv .buttonss { display: inline-block; width: 100%; position: absolute; bottom: 60px; text-align: center; } .chooseSquadDiv .buttonss a { font-family: Arial; background-color: #3a589b; border-radius: 5px; color: #fff; margin-left: 18px; margin-right: 0; line-height: 2; padding: 8px 20px; font-size: 17px; } .chooseSquadDiv .buttonss a:hover { text-decoration: none; } .chooseSquadDiv .buttonss .play { background-color: #595959; padding: 8px 42px; } .chooseSquadDiv #imageLoader { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 200px; height: 200px } /******************** Euro 2020 - Fan Zone - Prediction Entry Point ********************/ .euroMain .predEP.groupTabs { border-radius: 6px; overflow: hidden } .euroMain .predEP .title:after { background-color: #aaa; } .euroMain .predEP .groupsCarousel { height: 300px } .euroMain .predEP .groupTtl { background: #000; padding: 0; height: 48px; padding: 0 16px } .euroMain .predEP .groupTtl h3 { float: right; display: inline-block; text-align: right; color: #45B3EB; font-family: droidBold,Arial; font-size: 14px; line-height: 3.4; } .euroMain .predEP .groupTtl a { float: left; display: inline-block; text-align: right; color: #fff; font-family: droidLight,Arial; font-size: 12px; line-height: 4; } .euroMain .predEP .groupTtl a:hover { color: #45B3EB } .euroMain .predEP.groupTabs .table { margin-top: 0; background: #fff; } .euroMain .predEP.groupTabs .table .ttlRow { background: none; margin-bottom: 0; height: 56px; padding: 20px 16px 0; border-bottom: 1px solid #efefef } .euroMain .predEP.groupTabs .table .ttlRow .itemTtl { font-size: 12px; color: #000 } .euroMain .predEP.groupTabs .table .ttlRow .itemTtl.team { width: calc(100% - 32px); text-align: right; padding: 0 } .euroMain .predEP.groupTabs .table .ttlRow .itemTtl.dtls { width: 32px; padding: 0; text-align: left } .euroMain .predEP.groupTabs .table .wRow { height: auto; border: none; border-bottom: 1px solid #efefef; padding: 12px 16px } .euroMain .predEP.groupTabs .table .wRow:last-child { border-bottom: none } .euroMain .predEP.groupTabs .table .wRow .item { font-size: 13px; color: #000; padding: 0; line-height: 1.8; } .euroMain .predEP.groupTabs .table .wRow .item.team { width: calc(100% - 32px) } .euroMain .predEP.groupTabs .table .wRow .item.dtls { width: 32px; padding: 0; text-align: center; } .euroMain .predEP.groupTabs .table .wRow .team img { margin-left: 10px; width: 24px; height: 24px; border-radius: 50%; } .euroMain .predEP.groupTabs .table .wRow .item p { font-size: 13px; font-family: droidLight, arial; line-height: 1.8 } /******************** Euro Prediction ********************/ .mcSpensorDS.sticky { position: fixed; width: 80px; height: 80px; top: 50px; left: 40px; z-index: 99 } .mcSpensorDS.between { display: inline-block; position: relative; width: 627px; height: 90px; background-color: #fff; margin: 20px 0 } .mcSpensorDS img { display: inline-block; position: absolute; top: 0; left: 0; width: 100%; height: 100% } .euroPredPage .container { background: #1d1d1d } .euroPredPage .prediction { margin-bottom: 40px } .euroPredPage .content-wrap, .euroPredPage .content, .euroPredPage .euroPredCnts { background: #1d1d1d } .euroPredCnts .FullWidthBK .euroHeader { background: url(../../Images/Euro2020/predHeaderBG.jpg) no-repeat top left; position: relative; overflow: hidden; background-position: unset !important; background-size: cover !important; } .euroPredCnts .FullWidthBK .euroHeader:before { content: ""; position: absolute; left: -78px; top: -24px; width: 206px; height: 190px; background: url(../../Images/Euro2020/bulding.png) no-repeat center center; opacity: 0.3; background-size: 206px auto; pointer-events: none } .euroPredCnts .FullWidthBK .euroHeader:after { content: ""; position: absolute; left: 8px; top: -48px; width: 368px; height: 786px; background: url(../../Images/Euro2020/goldenStat.png) no-repeat center center; background-size: 368px auto; pointer-events: none } .euroPredCnts .FullWidthBK h1 { color: #34b4d7 } .euroPredCnts .FullWidthBK .tabs { background: #282829; } .euroPredCnts .tabs a { color: #fff; } .euroPredCnts .tabs a.active, .euroPredPage .tabs a:hover { color: #45B3EB } .euroPredCnts .tabs .regBtn { position: absolute; left: 20px; top: 50%; transform: translateY(-50%) } .euroPredCnts .tabs .regBtn img { display: inline-block; float: left; margin-right: 10px; width: 30px; height: 30px; border-radius: 50%; } .euroPredCnts .tabs .regBtn p { float: left; display: inline-block; text-align: right; color: #fff; font-family: droidLight,Arial; font-size: 13px; line-height: 3.4; } .euroPredCnts .tabs .regBtn:hover p { color: #45B3EB } .euroPredCnts .tabs .regBtn.noImg .usericon { display: inline-block; float: left; margin-right: 10px; width: 30px; height: 30px; border-radius: 50%; border: 1px solid #fff; overflow: hidden; background: #282829; } .euroPredCnts .tabs .regBtn.noImg .usericon:before { content: 'Q'; color: #fff; font-size: 21px } .euroPredCnts .tabs .regBtn.noImg img { display: none } .euroPredCnts .tabs .regBtn .usericon { display: none } .lb-header .profile .userImg .usericon { display: inline-block; float: left; margin-right: 10px; width: 100%; height: 100%; border-radius: 50%; overflow: hidden; position: relative; padding: 0; margin: 0 } .lb-header .profile .userImg .usericon:before { content: 'R'; color: #000; font-size: 50px; top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute; } .lb-header .profile .userImg.noImg img { display: none } .lb-header .profile .userImg.noImg { width: 85px; height: 85px; background-color: #e6e6e6; } .lb-header .profile .generalError { padding: 0 20px; width: 100% } .phonenumber .lb-header .profile .generalError { display: none } .lb-header .profile .generalSuccess { padding: 0 20px; width: 100% } .phonenumber .lb-header .profile .generalSuccess { display: none } .openRules .RulesMsg { opacity: 1; visibility: visible } .openRules .RulesMsg .cntnr { opacity: 1; visibility: visible; transition: opacity .3s 0s, visibility 0s 0s; -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; -ms-transition: opacity .3s 0s, visibility 0s 0s; -o-transition: opacity .3s 0s, visibility 0s 0s; } .RulesMsg { visibility: hidden; opacity: 0 } .RulesMsg:before { content: ""; position: fixed; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background: rgba(29,29,29,0.90); z-index: 1001; pointer-events: none; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .RulesMsg .cntnr { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); font-family: droidLight, arial; z-index: 1002; width: 700px; border-radius: 6px; overflow: hidden; background: #fff; box-shadow: 0 6px 6px -3px rgb(0 0 0 / 10%); visibility: hidden; opacity: 0; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; -o-transition: opacity .3s 0s, visibility 0s .3s; -ms-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; } .RulesMsg h3:before { content: 'قواعد المسابقة' } .RulesMsg .closeRules { position: absolute; top: 15px; left: 16px; width: 30px; height: 30px; z-index: 2; } .RulesMsg .closeRules:before { content: 'B'; font-size: 20px; color: #fff } .RulesMsg .lb-header { display: inline-block; float: right; width: 100%; font-family: droidBold, Arial; font-size: 18px; color: #fff; height: 60px; background: #000; text-align: center; line-height: 3.6; margin-bottom: 20px; } .RulesMsg .lb-header h3 { display: inline-block; float: right; width: 100%; font-family: droidBold, Arial; font-size: 18px; color: #fff; height: 60px; background: #000; text-align: center; line-height: 3.6; margin-bottom: 20px; } .RulesMsg .rulesItems { display: inline-block; width: 100%; float: right; } .RulesMsg ul { display: inline-block; float: right; width: 550px; margin: 0 calc((100% - 550px) /2); } .RulesMsg ul li { display: list-item; width: 100%; margin-right: 10px; list-style-type: disc; color: #000; font-size: 15px; font-family: droidLight,Arial; margin-bottom: 15px } .RulesMsg ul.subpoint { margin-top: 5px } .RulesMsg ul.subpoint li { font-size: 14px } .RulesMsg ul.subpoint li label { font-size: 14px } .RulesMsg ul.subpoint li label span { color: #45B3EB; font-family: droidBold,Arial; font-weight: bold } .RulesMsg ul.subpoint li label span.joker { color: #000; margin-right: 5px; font-size: 13px } .RulesMsg ul.subpoint li { list-style-type: circle } /******************** Euro Prediction - Hint ********************/ .euroPredCnts .predHint, .euroRoadToCup .predHint { display: inline-block; float: right; width: 100%; background: #000; padding: 20px 40px 20px 20px; min-height: 210px; position: relative; margin-bottom: 40px; border-radius: 6px; overflow: hidden } .euroPredCnts .predHint .hintMsg, .euroRoadToCup .predHint .hintMsg { display: inline-block; float: right; width: 100%; } .euroPredCnts .predHint .hintMsg h3, .euroRoadToCup .predHint .hintMsg h3 { float: right; display: inline-block; width: 100%; text-align: right; color: #fff; font-family: droidBold,Arial; font-size: 26px; line-height: 2; } .euroPredCnts .predHint .hintMsg p, .euroRoadToCup .predHint .hintMsg p { float: right; display: inline-block; width: 100%; text-align: right; color: #fff; font-family: droidLight,Arial; font-size: 14px; line-height: 2; margin: 20px 0 } .euroPredCnts .predHint .regBtn, .euroRoadToCup .predHint .regBtn { position: absolute; left: 20px; bottom: 20px; width: 200px; height: 50px; background: #45B3EB; color: #fff; font-family: droidLight,Arial; font-size: 14px; line-height: 3.6; text-align: center; border-radius: 4px } .euroPredCnts .title h2 { color: #fff } .euroPredCnts .title:after { background-color: #aaa; } .roadToCupPage .euroRoadToCup .title span { font-size: 15px; margin-top: 0; top: -14px; color: #06073E } /******************** Euro Prediction - Accordion ********************/ .euroPredCnts .predictionCnts { display: inline-block; float: right; width: 100%; border-radius: 6px; overflow: hidden; } .euroPredCnts .predictionCnts .tourName { display: inline-block; float: right; width: 100% } .euroPredCnts .predictionCnts .tourTitle { display: inline-block; float: right; width: 100%; height: 50px; padding: 0 16px; background: #282829; position: relative } .euroPredCnts .predictionCnts .tourTitle .shape { display: inline-block; float: right; width: 18px; height: 18px; background: #45B3EB; border-radius: 50%; margin-top: 16px } .euroPredCnts .predictionCnts .tourTitle h3 { float: right; display: inline-block; width: calc(100% - 18px); text-align: right; color: #fff; font-family: droidLight,Arial; font-weight: bold; font-size: 16px; line-height: 3; padding-right: 16px } .euroPredCnts .predictionCnts .tourTitle h3 a { color: #fff } .euroPredCnts .predictionCnts .tourTitle h3 span { font-family: droidLight,Arial; font-size: 15px; font-weight: normal } .euroPredCnts .predictionCnts .tourTitle .jokerCount { position: absolute; left: 16px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .tourTitle .jokerCount .icon-joker { float: left; display: inline-block } .euroPredCnts .predictionCnts .tourTitle .jokerCount .icon-joker:before { content: "L"; color: #aaa; font-size: 18px; } .euroPredCnts .predictionCnts .tourTitle .jokerCount p { float: left; display: inline-block; font-family: CenturyGothicLight, Arial; font-size: 16px; text-align: left; direction: ltr; color: #aaa; line-height: 1.8 } .euroPredCnts .predictionCnts .tourTitle .jokerCount p span { font-size: 18px } .euroPredCnts .dropDownContainer { display: inline-block; width: 100%; float: right; margin-bottom: 15px; position: relative } .euroPredCnts .dropDownContainer .placeholder { display: inline-block; float: right; width: 240px; height: 36px; text-align: right; line-height: 36px; padding: 0 10px; background-color: #535353; font-family: droidLight,Arial; font-size: 13px; color: #fff; border-radius: 4px } .euroPredCnts .dropDownContainer .placeholder:before { content: 'F'; color: #fff; font-size: 11px; float: left; font-weight: bold; line-height: 36px } .euroPredCnts .dropDownContainer .placeholder.active { border: 1px solid rgba(2, 119, 189, .5) } .euroPredCnts .dropDownContainer ul { display: none; position: absolute; margin-top: 4px; right: 0; background-color: #535353; z-index: 10; top: 36px; width: 240px; height: auto; border-radius: 0 0 4px 4px; box-shadow: inset 0 0 0 #1d1d1d, 0 2px 10px rgb(0 0 0 / 20%); transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.8s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; } .euroPredCnts .dropDownContainer ul li { display: inline-block; width: 100%; float: right; padding: 6px 10px; border-bottom: 1px solid #666; transition: all 0.3s ease-in-out 0s; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; } .euroPredCnts .dropDownContainer ul li a { display: inline-block; float: right; width: 100%; font-family: droidLight, arial; font-size: 13px; color: #fff } .euroPredCnts .dropDownContainer ul li:hover { background-color: #444 } .euroPredCnts .dropDownContainer .placeholder.active { border: none } .euroPredCnts .predictionCnts .accordionItem { display: inline-block; float: left; width: 100%; border-bottom: 1px solid #535353; } .euroPredCnts .predictionCnts .accordionItem:last-of-type { margin-bottom: 0; border-bottom: none } .euroPredCnts .predictionCnts .accordionItem .matchData { display: inline-block; float: right; width: 100%; padding: 0 16px; cursor: pointer; position: relative; background: #000; height: 50px; position: relative } .euroPredCnts .predictionCnts .accordionItem .matchData .date { display: inline-block; float: right; } .euroPredCnts .predictionCnts .accordionItem .matchData .date p { display: inline-block; float: right; color: #aaa; font-family: droidLight,Arial; font-size: 12px; line-height: 4.2; } .euroPredCnts .predictionCnts .accordionItem .matchData .date .day { margin-left: 10px; width: 110px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { display: inline-block; float: right; width: calc(100% - 450px); height: 50px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult { display: inline-block; float: right; width: calc((100% - 30px) / 2) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { display: inline-block; float: right; font-family: droidBold, arial; color: #fff; font-size: 13px; line-height: 50px; } .euroPredCnts .predictionCnts .accordionItem .matchData span { display: inline-block; float: right; font-family: CenturyGothicLight, arial; color: #fff; font-size: 16px; line-height: 3.3; width: 20px; height: 50px } .euroPredCnts .predictionCnts .accordionItem .matchData .dash { display: inline-block; float: right; width: 30px; text-align: center; font-family: CenturyGothicLight, arial; color: #fff; font-size: 24px; line-height: 2 } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 .teamName { float: left } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { float: left; margin-right: 20px } .euroPredCnts .predictionCnts .accordionItem .matchData a { pointer-events: none } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 .teamName { float: right } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { float: right; margin-left: 20px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 { text-align: left } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 { text-align: right; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult img { width: auto; height: 20px; margin-top: 15px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 img { float: left; margin-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 img { float: right; margin-left: 10px } /*** Prediction Status ***/ .euroPredCnts .predictionCnts .matchData .predStatus { position: absolute; left: 60px; top: 50%; transform: translateY(-50%); width: 90px; height: 30px; border: 1px solid #535353; border-radius: 4px } .euroPredCnts .predictionCnts .matchData .predStatus .status { display: inline-block; float: right; width: 100%; text-align: center; font-family: droidLight, Arial; font-size: 12px; color: #aaa; line-height: 2.4 } .euroPredCnts .predictionCnts .accordionItem.done .matchData .predStatus .status p:before { content: 'انتهت' } .euroPredCnts .predictionCnts .accordionItem.now .matchData .predStatus .status p:before { content: 'تلعب الآن' } .euroPredCnts .predictionCnts .accordionItem.later .matchData .predStatus .status p:before { content: 'لاحقاً' } /** Countdown **/ .euroPredCnts .predictionCnts .matchData .predStatus .predCounter { text-align: left; direction: ltr; display: inline-block; } .euroPredCnts .predictionCnts .matchData .predStatus .icon-time:before { content: 'M'; position: absolute; right: -20px; top: 50%; transform: translateY(-50%); font-size: 14px } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { display: inline-block; float: left; font-family: CenturyGothicLight, Arial; font-size: 14px; margin-right: 4px; line-height: 2; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer:last-of-type { margin-right: 0 } .euroPredCnts .predictionCnts .accordionItem.soon .matchData .predStatus .status p { display: none } .euroPredCnts .predictionCnts .accordionItem.soon .matchData .predStatus .status .predCounter { display: inline-block } .euroPredCnts .predictionCnts .accordionItem.now .matchData .predStatus .status p { display: inline-block } .euroPredCnts .predictionCnts .accordionItem.now .matchData .predStatus .status .predCounter { display: none } .euroPredCnts .predictionCnts .accordionItem.done .matchData .predStatus .status p { display: inline-block } .euroPredCnts .predictionCnts .accordionItem.done .matchData .predStatus .status .predCounter { display: none } .euroPredCnts .predictionCnts .accordionItem.later .matchData .predStatus .status p { display: inline-block } .euroPredCnts .predictionCnts .accordionItem.later .matchData .predStatus .status .predCounter { display: none } .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points { display: none; float: right; width: 100%; text-align: center; font-family: CenturyGothicLight, Arial; font-size: 14px; color: #45b3eb; line-height: 2; direction: rtl; } .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points span { font-family: droidLight,arial; font-size: 10px; margin-right: 2px; color: #45b3eb; float: none; line-height: 2.4; width: auto; height: auto } .euroPredCnts .predictionCnts .accordionItem.score .matchData .predStatus .status p { display: none } .euroPredCnts .predictionCnts .accordionItem.score .matchData .predStatus .status p.points { display: inline-block } .euroPredCnts .predictionCnts .accordionItem.score .matchData .predStatus .status p:before { display: none } .euroPredCnts .predictionCnts .accordionItem.score .matchData .predStatus .status .predCounter { display: none } .euroPredCnts .predictionCnts .accordionItem.now .accContent .predItem, .euroPredCnts .predictionCnts .accordionItem.done .accContent .predItem { opacity: 0.4; pointer-events: none } .euroPredCnts .predictionCnts .matchData span.icon-plus { float: left; display: inline-block; width: 24px; height: 24px; text-align: center; pointer-events: none; position: absolute; top: 50%; transform: translateY(-50%); left: 16px; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus { -webkit-transform: rotateX(180deg) translateY(50%); -moz-transform: rotateX(180deg) translateY(50%); -ms-transform: rotateX(180deg) translateY(50%); -o-transform: rotateX(180deg) translateY(50%); transform: rotateX(180deg) translateY(50%); } .euroPredCnts .predictionCnts .matchData span.icon-plus::before, .euroPredCnts .predictionCnts .matchData span.icon-plus::after { content: ''; position: absolute; top: 50%; width: 14px; height: 3px; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; background: #535353; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroPredCnts .predictionCnts .matchData span.icon-plus::before { left: 0px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .euroPredCnts .predictionCnts .matchData span.icon-plus::after { left: 8px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::before, .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::after, .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::before, .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::after { background: #45B3EB } /************** Prediction Accordion ***************/ .euroPredCnts .predictionCnts .accordionItem .accContent { display: inline-block; background: #282829; float: left; width: 100%; overflow: hidden; height: 100%; max-height: 0; box-sizing: border-box; transition: all 0.2s ease-in-out 0s; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; } .euroPredCnts .predictionCnts .accordionItem.open .accContent { opacity: 1; visibility: visible } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem { display: inline-block; float: right; width: 100%; padding: 16px; } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item { display: inline-block; float: right; width: calc((100% - 16px) / 2); height: 160px; border: 1px solid #535353; border-radius: 6px; overflow: hidden; margin-left: 16px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item:last-of-type { margin-left: 0 } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item .predMatchTitle { display: inline-block; float: right; width: 100%; height: 40px; padding: 0 16px; background: #535353; position: relative } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item .predMatchTitle h3 { float: right; display: inline-block; width: calc(100% - 18px); text-align: right; color: #fff; font-family: droidLight,Arial; font-size: 15px; line-height: 2.6; } .euroPredCnts .predMatchTitle .predJoker { position: absolute; left: 7px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; background: #282829; color: #fff; font-size: 18px; border-radius: 4px; overflow: hidden; text-align: center; } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"] + label span { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: none; margin: 0; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"] + label .icon-joker:before { content: "L"; line-height: 1.5; position: absolute; top: 50%; transform: translateY(-50%); left: 6px; color: #fff; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s } /*.euroPredCnts .predMatchTitle .predJoker:hover input[type="checkbox"] + label span,*/ .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"]:checked + label span { background: #f9ab45; } .euroPredCnts .predMatchTitle .predJoker:hover input[type="checkbox"] + label .icon-joker:before { color: #f9ab45; } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"]:checked + label .icon-joker:before { color: #282829; } /****** Nateget El Mobarah *******/ .euroPredCnts .item .matchPrediction { display: inline-block; float: right; width: 100%; height: 120px; position: relative } .euroPredCnts .item .matchPrediction .matchPredictionCnts { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; padding: 0 16px } .euroPredCnts .item .matchPrediction .team { display: inline-block; float: right; width: calc((100% - 80px) / 2); position: relative; height: 120px } .euroPredCnts .item .matchPrediction a { float: right; display: inline-block; position: absolute; width: calc(100% - 60px); top: 50%; transform: translateY(-50%); text-align: center; } .euroPredCnts .item .matchPrediction .teamName { display: inline-block; float: right; font-family: droidLight, arial; color: #fff; font-size: 11px; line-height: 1.6; position: relative; width: 100%; text-align: center; } .euroPredCnts .item .matchPrediction .dash { display: inline-block; float: right; width: 80px; text-align: center; font-family: CenturyGothicLight, arial; color: #fff; font-size: 36px; line-height: 120px } .euroPredCnts .item .matchPrediction .team.team1 a { left: 60px } .euroPredCnts .item .matchPrediction .team.team2 a { right: 60px } .euroPredCnts .item .matchPrediction .team.team1 { text-align: left; } .euroPredCnts .item .matchPrediction .team.team2 { text-align: right; } .euroPredCnts .item .matchPrediction .team img { width: auto; height: 26px; margin: 0 calc((100% - 26px) / 2) 10px; } .euroPredCnts .item .matchPrediction .team.team1 img { float: left; margin-right: 10px; } .euroPredCnts .item .matchPrediction .team.team2 img { float: right; margin-left: 10px; } /*.euroPredCnts .item .matchPrediction form{display:inline-block;float:right;font-family: CenturyGothicLight, arial;color: #fff;font-size: 16px;line-height: 3.4;width: 20px;}*/ .euroPredCnts .item .matchPrediction form { display: inline-block; float: right; width: 38px; margin: 0 auto; text-align: center; position: absolute; top: 50%; transform: translateY(-50%) } .euroPredCnts .item .matchPrediction.hBall .goalNo{display:inline-block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)} .euroPredCnts .item .matchPrediction.hBall .goalNo form { display: inline-block; float: right; width: 38px; margin: 0; text-align: center; position: relative; top: 0; transform: none } .euroPredCnts .item .matchPrediction.hBall .goalNo p{display: inline-block;float: right;font-family: droidLight, arial;padding-right:30px;color: #fff;font-size: 12px;line-height: 98px;position: relative;text-align: center;} .euroPredCnts .item .matchPrediction .value-button { display: inline-block; float: right; border: 1px solid #535353; border-radius: 4px; width: 38px; height: 24px; font-family: CenturyGothicLight, Arial; text-align: center; color: #fff; font-size: 20px; vertical-align: middle; background: none; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroPredCnts .item .matchPrediction .value-button:hover { cursor: pointer; background: #45B3EB } .euroPredCnts .item .matchPrediction form .decrease { line-height: 1 } .euroPredCnts .item .matchPrediction form .increase { } .euroPredCnts .item .matchPrediction input.number { display: inline-block; float: right; margin: 6px 0; text-align: center; border: none; outline: 0; border-bottom: 2px solid #535353; background: none; width: 38px; height: 38px; color: #fff; font-family: CenturyGothicLight, Arial; font-size: 22px } .euroPredCnts .item .matchPrediction input.number:focus { border: none !important; border-bottom: 2px solid #535353 !important; outline: none } .euroPredCnts .item .matchPrediction input[type=number]::-webkit-inner-spin-button, .euroPredCnts .item .matchPrediction input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .euroPredCnts .item .matchPrediction .team.team1 form { left: 0; } .euroPredCnts .item .matchPrediction .team.team2 form { right: 0 } /******************** First Scoring ********************/ .euroPredCnts .item.firstScoring .matchPrediction .matchPredictionCnts { height: 100% } .euroPredCnts .item .matchPrediction .teamScoring { display: inline-block; position: absolute; top: 0; width: calc((100% - 100px) / 2); height: 100%; padding: 0; transform: none; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroPredCnts .item .matchPrediction .teamScoring:before { content: ''; position: absolute; top: 0; left: 0; width: 1px; height: 100%; background: #535353 } .euroPredCnts .item .matchPrediction .teamScoring:last-of-type:before { display: none } .euroPredCnts .item .matchPrediction .teamScoring p { display: inline-block; width: 100%; padding: 0 16px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-family: droidLight, arial; color: #fff; font-size: 12px; line-height: 1.6; text-align: center } .euroPredCnts .item .matchPrediction .teamScoring:hover, .euroPredCnts .item .matchPrediction .teamScoring.select { background: #000 } .euroPredCnts .item .matchPrediction .teamScoring:hover p, .euroPredCnts .item .matchPrediction .teamScoring.select p { color: #45B3EB } .euroPredCnts .item .matchPrediction .teamScoring.team1 { right: 0 } .euroPredCnts .item .matchPrediction .teamScoring.team2 { left: 0 } .euroPredCnts .item .matchPrediction .teamScoring.none { width: 100px; left: 50%; transform: translate(-50%) } /** New Prediction Design 2022 **/ .newPred .content-wrap { width: 100% !important; } .newPred .content { padding: 0; background: #181818; } .newPred .FullWidthBK { margin: 0; width: 100% } .newPred .euroMain .FullWidthBK .tabs { padding: 0 !important; background: #282829; } .newPred .euroPredCnts .FullWidthBK h1, .newPred .FullWidthBK h2 { right: 0 } .newPred .euroPredCnts .tabs .regBtn { left: 0 } .newPred .proPlayer { padding: 0; min-height: 650px; margin-bottom: 0; background: #1d1d1d } .newPred .privateLeague .predContainerDiv { display: inline-block; float: right; width: 100%; position: relative; padding: 50px 0 } /*.newPred .privateLeague .predContainerDiv:before{content:"";position:absolute;top:0;right:0;left:0;bottom:0;width:100%;height:100%;background:url(../../Images/privateLeagueBG4.jpg) top center no-repeat;background-size:cover;pointer-events:none} */ .newPred .pagecnts { display: inline-block; float: right; width: 1376px; margin: 0 calc((100% - 1376px) / 2); position: relative; height: 100%; padding: 50px 0 } .newPred .FullWidthBK .pagecnts { padding: 20px 0 } .newPred .proPlayer .title { margin-bottom: 40px } .newPred .proPlayer .title h2 { font-size: 26px } .newPred .euroPredCnts .title:after { background-color: #aaa; margin-top: 10px } .newPred .prediction { margin-bottom: 40px; /*padding: 50px 100px;*/ border-radius: 6px } .newPred .createLeague .email-login, .newPred .createLeague .email-signup { padding: 20px 0 } .newPred .blankMsg { display: inline-block; float: right; width: 100%; font-family: droidLight,Arial; font-size: 18px; text-align: center; padding: 30px 0; color: #fff } .newPred .table .blankMsg { text-align: right; font-size: 16px; padding: 20px 36px; } .newPred .regBtnPage { display: inline-block; float: right; width: 150px; height: 40px; margin: 0 calc((100% - 150px) / 2) 0; background: #0277bd; border-radius: 6px; overflow: hidden } .newPred .regBtnPage p { display: inline-block; float: right; width: 100%; line-height: 40px; text-align: center; font-family: droidLight,Arial; color: #fff; font-size: 14px } .newPred .createLeague .leagueImage { display: inline-block; float: right; width: 100%; min-height: 200px; margin-bottom: 30px; position: relative; border: 1px solid #2c3348; border-radius: 6px; overflow: hidden; cursor: pointer } .newPred .createLeague .leagueImage:before { content: "0"; font-size: 84px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); color: rgba(255,255,255,0.1); pointer-events: none; z-index: 0 } .newPred .createLeague .u-form-group { display: inline-block; float: right; width: 100%; margin-bottom: 30px } .newPred .createLeague .u-form-group .labelHint { position: relative; right: 0; top: 0; padding: 0; line-height: 50px; display: inline-block; background: none; font-family: droidLight, arial; text-align: right; font-size: 13px; float: right; width: 120px; color: rgba(255,255,255,0.4) } .newPred .createLeague .u-form-group input[type="email"], .newPred .createLeague .u-form-group input[type="password"], .newPred .createLeague .u-form-group input[type="text"], .newPred .createLeague .u-form-group input[type="tel"] { width: calc(100% - 120px); height: 50px; border-radius: 6px } .newPred .createLeague .u-form-group input:valid { background: transparent !important; border: 1px solid #2c3348; color: #fff } .newPred .createLeague .u-form-group input:focus { border: 1px solid #2c3348 !important; } .newPred .createLeague .u-form-group .selectlst { position: relative; display: inline-block; float: right; width: calc(100% - 120px); height: 50px; background: transparent !important; padding: 0 10px; border: 1px solid #2c3348; border-radius: 6px; font-family: droidLight, arial; text-align: right; font-size: 13px; color: #fff; cursor: pointer } .newPred .createLeague .u-form-group .selectlst option { color: #000; padding: 10px 0 } .newPred .createLeague .u-form-group .selectlst:after { content: "a"; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: #fff; font-size: 16px } .newPred .createLeague .u-form-group .itemError { color: #d41f2b; } .newPred .createLeague .u-form-group.allBtns { display: inline-block; float: left; width: 100%; height: 50px; margin-bottom: 0 } .newPred .createLeague .u-form-group.allBtns .btnsContainer { position: absolute; top: 0; left: 50%; height: 100%; transform: translateX(-50%); display: flex } .newPred .createLeague .u-form-group.allBtns a { display: inline-block; float: right; width: 150px; height: 50px; padding: 0 10px; border-radius: 6px; margin-left: 10px; font-family: droidLight, arial; text-align: center; font-size: 14px; color: #fff; cursor: pointer; line-height: 50px } .newPred .createLeague .u-form-group.allBtns a:last-child { margin-left: 0 } .newPred .createLeague .u-form-group.allBtns a.CreateLeagueBtn { background: #33394e; } .newPred .createLeague .u-form-group.allBtns a.SaveLeagueBtn { background: green } .newPred .createLeague .u-form-group.allBtns a.DeleteLeagueBtn { background: #e81f3e } .newPred .privateLeague .createdLeaguePopup { position: fixed; width: 100%; height: 100%; top: 0; left: 0; bottom: 0; right: 0; z-index: 9; opacity: 0; visibility: hidden; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .newPred .privateLeague.showPopup .createdLeaguePopup { opacity: 1; visibility: visible } .newPred .privateLeague .createdLeaguePopup:before { content: ""; position: absolute; width: 100%; height: 100%; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.6); pointer-events: none } .newPred .privateLeague .createdLeaguePopup .popupContainer { position: absolute; width: 500px; border-radius: 6px; top: 50%; left: 50%; transform: translate(-50%,-50%); overflow: hidden } .newPred .privateLeague .createdLeaguePopup .popupContainer:before { content: ""; position: absolute; width: 100%; height: 100%; top: 0; right: 0; bottom: 0; left: 0; background: url('../../Images/privateLeagueBG1.jpg') no-repeat top left; background-size: auto 100%; pointer-events: none; opacity: 0.5 } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupTtl { display: inline-block; float: right; width: 100%; height: 50px; background: #20273f; padding: 0 20px; color: #fff; position: relative; z-index: 1 } .newPred .privateLeague .createdLeaguePopup .popupContainer .icon-created:before { content: "K"; float: right; display: inline-block; line-height: 50px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupTtl p { display: inline-block; float: right; padding-right: 10px; font-family: droidLight, Arial; font-size: 15px; color: #fff; line-height: 50px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupTtl .closePopup { position: absolute; top: 12px; left: 10px; width: 20px; height: 20px; z-index: 2; cursor: pointer; } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupTtl .closePopup:after, .newPred .privateLeague .createdLeaguePopup .popupContainer .popupTtl .closePopup:before { content: ''; position: absolute; top: 0; width: 2px; height: 100%; background-color: #fff; opacity: 1; transition: all .2s ease-in-out 0s; -webkit-transition: all .2s ease-in-out 0s; -moz-transition: all .2s ease-in-out 0s; -ms-transition: all .2s ease-in-out 0s; -o-transition: all .2s ease-in-out 0s; } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupTtl .closePopup:before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupTtl .closePopup:after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts { display: inline-block; float: right; width: 100%; background: #fff; padding: 30px 20px; position: relative; z-index: 1 } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts h4 { display: inline-block; float: right; width: 100%; font-family: droidBold, Arial; font-size: 18px; text-align: right; color: #20273f; margin-bottom: 30px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode { display: inline-block; float: right; width: 100%; margin-bottom: 50px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode:last-child { margin-bottom: 0 } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode span { display: inline-block; float: right; width: 100%; font-family: droidBold, Arial; text-align: right; font-size: 15px; color: #20273f; margin-bottom: 4px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode p { display: inline-block; float: right; width: 100%; font-family: droidLight, Arial; text-align: right; font-size: 13px; color: #20273f; margin-bottom: 20px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode.link p { margin-bottom: 30px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode .codeInputCntnr { display: inline-block; float: right; width: 100%; } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode.code .codeInputCntnr .codeInput { display: inline-block; float: right; width: 220px; height: 50px; line-height: 48px; border: 1px solid rgba(32,39,63,0.2); font-family: CenturyGothicLight, Arial; font-size: 20px; color: #20273f; border-radius: 6px; padding: 0 10px; font-weight: bold; text-align: right } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode .codeInputCntnr .copyCodeBtn { display: inline-block; float: left; position: relative; width: 140px; height: 50px; line-height: 48px; border: 1px solid rgba(32,39,63,1); font-family: droidLight, Arial; font-size: 14px; color: #20273f; border-radius: 6px; padding: 0 10px; text-align: center; cursor: pointer; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode .codeInputCntnr .copyCodeBtn:hover { background: #20273f; color: #fff } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode .codeInputCntnr .copyCodeBtn .addedCode { display: inline-block; position: absolute; width: 85px; height: 30px; background-color: green; left: 50%; transform: translateX(-50%); top: -38px; border-radius: 6px; color: #fff; line-height: 2.2; font-size: 12px; font-family: 'droidLight'; opacity: 0; visibility: hidden; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode .codeInputCntnr .copyCodeBtn .addedCode:before { content: ''; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid green; position: absolute; bottom: -7px; right: 10px; } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode .codeInputCntnr .copyCodeBtn.added .addedCode { opacity: 1; visibility: visible } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode.link .codeInputCntnr .codeInput { display: inline-block; float: right; width: 100%; line-height: 1; padding-bottom: 4px; border-bottom: 1px solid rgba(32,39,63,0.2); font-family: arial; font-size: 14px; color: #20273f; text-align: left; direction: ltr; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin-bottom: 20px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode.link .codeInputCntnr .goLeague { display: inline-block; float: left; width: 140px; height: 50px; line-height: 48px; border: 1px solid rgba(32,39,63,1); font-family: droidLight, Arial; font-size: 14px; color: #fff; margin-left: 10px; background-color: #20273f; border-radius: 6px; padding: 0 10px; text-align: center; cursor: pointer; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .banDiv { display: inline-block; width: 100%; float: left } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .banDiv p { display: inline-block; float: right; width: 100%; font-family: droidBold, Arial; font-size: 16px; color: #20273f; margin-bottom: 15px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .banDiv .buttons { display: inline-block; float: left } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .banDiv a { display: inline-block; float: right; position: relative; width: 100px; height: 40px; line-height: 40px; border: 1px solid rgba(32,39,63,1); font-family: droidLight, Arial; margin-left: 10px; font-size: 14px; color: #20273f; border-radius: 6px; padding: 0 10px; text-align: center; cursor: pointer; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .banDiv a:last-child { margin-left: 0 } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .banDiv a:hover { background-color: #20273f; color: #fff } /** Tour Guide **/ .guided-tour { overflow: hidden !important } .guided-tour-step { display: none; text-rendering: optimizespeed; font-family: droidLight,arial; font-size: 12pt; color: #333 } .guided-tour-step.active { display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1024; pointer-events: all } .guided-tour-step.active .guided-tour-step-highlight { position: absolute; box-sizing: border-box; border-radius: 4px; box-shadow: 0 0 0 999em rgba(0,0,0,.70); z-index: 1 } .guided-tour-step.active .guided-tour-step-tooltip { position: absolute; padding: 32px 32px 28px 32px; margin: 16px 0; z-index: 2; background-color: #fff; max-width: 400px; border-radius: 5px; box-sizing: border-box; box-shadow: 0 0 8px -4px #000; transition: opacity 150ms; font-size: 14px; } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-arrow { position: absolute; border-top: 8px solid transparent; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid transparent; margin-left: -8px; margin-top: -8px } .guided-tour-step.active .guided-tour-step-tooltip.guided-tour-arrow-none .guided-tour-arrow { display: none } .guided-tour-step.active .guided-tour-step-tooltip.guided-tour-arrow-top .guided-tour-arrow { border-bottom-color: #fff; margin-top: -16px; top: 0 } .guided-tour-step.active .guided-tour-step-tooltip.guided-tour-arrow-bottom .guided-tour-arrow { border-top-color: #fff; margin-bottom: -16px; bottom: 0 } .guided-tour-step.active .guided-tour-step-tooltip.guided-tour-center { transform: translate(-50%, -50%) } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-image img { width: 100%; height: auto; border-radius: 4px; margin-bottom: 28px } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-title { font-family: droidBold,arial; margin-bottom: 20px; font-size: 15px; } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-icon { display: inline-block; overflow: hidden } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button { flex-direction: column; justify-content: center; display: inline-flex; text-align: center; cursor: pointer } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button .guided-tour-icon { align-self: center } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button-next, .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button-complete { border: 2px solid currentColor; box-shadow: 0 0 1em 0 rgba(0,0,0,.4); width: 48px; height: 48px; background: #fff; border-radius: 50%; position: absolute; left: 0; top: 50%; transform: translate(-50%,-50%) } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button-next { color: limegreen; transform: translate(-50%,-50%) rotate(180deg); } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button-complete { color: limegreen } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button-close { position: absolute; top: 0; right: 0; width: 32px; height: 32px } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-footer-bullets { text-align: center; line-height: 16px } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-footer-bullets ul { margin: 10px 0 -18px 0; list-style: none; padding: 0 } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-footer-bullets ul li { width: 8px; height: 8px; border-radius: 50%; padding: 0; display: inline-block; background-color: #ddd; margin: 8px 0 8px 8px; box-sizing: content-box; cursor: pointer } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-footer-bullets ul li.complete { background-color: limegreen } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-footer-bullets ul li.current { background-color: limegreen; } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-footer-bullets ul li:last-of-type { margin-left: 0 } @media screen and (max-width: 760px) { .guided-tour-step.active .guided-tour-step-tooltip { max-width: unset; width: calc(100% - 30px); left: 15px !important; right: 15px !important } .guided-tour-step.active .guided-tour-step-tooltip.guided-tour-center { transform: translate(0, -50%) } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button-next, .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button-complete { width: 36px; height: 36px; left: 10px; bottom: 10px; transform: none; top: auto; box-shadow: 0 0 8px 0 rgba(0,0,0,.4) } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button-next { transform: rotate(180deg) } .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button-next svg, .guided-tour-step.active .guided-tour-step-tooltip .guided-tour-step-button-complete svg { width: 26px; height: 26px } .guided-tour-step.active .guided-tour-step-tooltip.guided-tour-arrow-top .guided-tour-arrow { display: none } } /******************** League Page ********************/ .newPred .proPlayer .title .membersNumber, .newPred .proPlayer .title .totalNum { display: inline-block; float: right; padding-right: 16px; font-family: droidLight,Arial; font-size: 12px; color: rgba(255,255,255,0.5); margin-top: 15px } .newPred .proPlayer .title .membersNumber span, .newPred .proPlayer .title .totalNum span { display: inline-block; float: right; font-family: CenturyGothicLight, arial; font-size: 15px; color: rgba(255,255,255,0.5); margin-left: 3px } .newPred .proPlayer .title .leagueSetting { display: inline-block; float: left; text-align: center } .newPred .proPlayer .title .leagueSetting a { display: inline-block; float: right; padding: 0 24px; height: 46px; text-align: center; margin-left: 10px; border: 1px solid #2c3348; border-radius: 6px; } .newPred .proPlayer .title .leagueSetting a:last-of-type { margin-left: 0 } .newPred .proPlayer .title .leagueSetting a.editBtn:hover { background: green } .newPred .proPlayer .title .leagueSetting a.shareBtn:hover { background: blue } .newPred .proPlayer .title .leagueSetting a.removeBtn:hover { background: #f24334 } .newPred .proPlayer .title .leagueSetting a.exitBtn:hover { background: #e7e7e7 } .newPred .proPlayer .title .leagueSetting a.exitBtn:hover .cont p, .newPred .proPlayer .title .leagueSetting a.exitBtn:hover .cont .icon-exit:before { color: #161a2c } .newPred .proPlayer .title .leagueSetting a .cont { display: inline-block; margin: 0 auto } .newPred .proPlayer .title .leagueSetting a .cont span { float: right; display: inline-block; font-size: 14px; line-height: 46px; color: rgba(255,255,255,0.3); -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s } .newPred .proPlayer .title .leagueSetting a .cont p { display: inline-block; float: right; font-family: droidLight,Arial; font-size: 12px; color: #fff; padding-right: 10px; line-height: 46px } .newPred .proPlayer .title .leagueSetting a .cont .icon-share:before { content: "X"; line-height: 46px } .newPred .proPlayer .title .leagueSetting a .cont .icon-edit:before { content: "1"; line-height: 46px } .newPred .proPlayer .title .leagueSetting a .cont .icon-remove:before { content: "J"; line-height: 46px } .newPred .proPlayer .title .leagueSetting a .cont .icon-exit:before { content: "5"; line-height: 46px } .newPred .proPlayer .title .leagueSetting a:hover span { color: #fff } /** Ranking **/ .newPred.predRanking .createLeague .ranking { margin-bottom: 60px } .newPred.predRanking .createLeague .ranking:last-child { margin-bottom: 0 } .newPred.predRanking .createLeague .ranking .rankMain { background: none; padding: 0 } .newPred.predRanking .createLeague .ranking .rankCnts { border: 1px solid #2c3348 } .newPred.predRanking .createLeague .ranking .rankCnts .predMatchTitle { display: none } .newPred.predRanking .createLeague .ranking .rankCnts .table { background: none } .newPred.predRanking .createLeague .ranking .rankCnts .table .ttlRow { border-bottom: 1px solid #2c3348 } .newPred.predRanking .createLeague .ranking .rankCnts .table .ttlRow .itemTtl { color: rgba(255,255,255,0.5) } .newPred.predRanking .createLeague .ranking .rankCnts .table .wRow { border-bottom: 0 } .newPred.predRanking .createLeague .ranking .rankCnts .table .wRow:nth-child(odd) { background: rgba(255,255,255,0.02) } .newPred.predRanking .createLeague .ranking .rankCnts .jp-container { max-height: 376px; height: auto } .newPred.predRanking .createLeague .ranking .rankCnts .jspTrack { background: #171c2a; border-left: 1px solid #2c3348; } .newPred.predRanking .createLeague .ranking .rankCnts .jspDrag { background: #b9d2ff } /** All Leagues **/ .newPred.predRanking .createLeague .ranking.allLeagues .predMatchTitle { display: inline-block; float: right; width: 100% } .newPred.predRanking .createLeague .ranking.allLeagues .predMatchTitle h3 { display: inline-block; float: right; width: 100%; font-family: droidBold,Arial; color: #fff; font-size: 16px; padding-bottom: 10px; text-align: right } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item a { pointer-events: visible } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item a:hover p { color: #e6be71 } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item { width: calc(100% / 3) } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item:last-child { font-weight: normal } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting { display: inline-block; float: left; text-align: center } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a { display: inline-block; float: right; padding: 0 14px; height: 26px; text-align: center; margin-left: 4px; border: 1px solid #2c3348; border-radius: 6px; } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a:last-of-type { margin-left: 0 } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a.editBtn:hover { background: green } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a.shareBtn:hover { background: blue } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a.joinBtn:hover { background: #e7e7e7 } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a.joinBtn:hover p, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a.joinBtn:hover .cont .icon-join:before { color: #161a2c } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a .cont { display: inline-block; margin: 0 auto } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a .cont span { float: right; display: inline-block; font-size: 11px; line-height: 26px; color: rgba(255,255,255,0.3); -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a .cont p { display: inline-block; float: right; font-family: droidLight,Arial; font-size: 10px; color: #fff; padding-right: 6px; line-height: 26px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a .cont .icon-share:before { content: "X"; line-height: 26px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a .cont .icon-edit:before { content: "1"; line-height: 26px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a .cont .icon-join:before { content: "H"; line-height: 26px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a:hover span { color: #fff } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.totalPoints, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.totalPoints { width: 180px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.buttons, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.buttons { width: 100px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item { width: calc(100% - 460px) } .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .ttlRow .itemTtl.totalPoints, .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .ttlRow .itemTtl.num, .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .wRow .item.num, .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .wRow .item.totalPoints { width: 180px } .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .ttlRow .itemTtl.buttons, .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .wRow .item.buttons { width: 150px } .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .wRow .item { width: calc(100% - 510px) } .euroPredCnts .predictionCnts .tourName .search { display: inline-block; float: right; width: 100% } .euroPredCnts .predictionCnts .tourName .search label { display: inline-block; float: right; width: 100%; font-family: droidBold,Arial; color: #fff; font-size: 16px; padding-bottom: 10px; text-align: right; margin-bottom: 8px } .euroPredCnts .predictionCnts .tourName .search input { display: inline-block; width: 100%; height: 50px; float: right; border: 1px solid #2c3348; border-radius: 6px; color: #fff; background-color: transparent; font-size: 16px; margin-bottom: 30px; padding: 15px } .euroPredCnts .predictionCnts .tourName .search input::placeholder { font-family: droidBold,Arial; color: rgba(255,255,255,.5); font-size: 14px; } .predLoader { display: inline-block; position: absolute; width: 100%; height: calc(100% - 50px); bottom: 0; right: 0; background-color: rgb(64 63 63 / 80%); z-index: 1; opacity: 0; visibility: hidden } .predLoader:before { content: ''; background: url(../../Images/loader-blue.gif) center top no-repeat; position: absolute; width: 40px; height: 125px; top: 100px; left: 50%; transform: translateX(-50%); } .showLoader .predLoader { opacity: 1; visibility: visible } /******************** Login Popup ********************/ .registerPopup:before { content: ""; position: fixed; width: 100%; height: 100%; top: 0; left: 0; right: 0; opacity: 0; visibility: hidden; bottom: 0; background: rgba(29,29,29,0.90); z-index: 99999; pointer-events: none; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s } .openRegister .registerPopup:before { visibility: visible; opacity: 1 } .login-box { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); font-family: droidLight, arial; z-index: 100000; width: 480px; height: 400px; border-radius: 6px; overflow: hidden; background: #fff; box-shadow: 0 6px 6px -3px rgba(0, 0, 0, 0.1); opacity: 0; visibility: hidden; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; -o-transition: opacity .3s 0s, visibility 0s .3s; -ms-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; } .login-box h3 { display: inline-block; float: right; width: 100%; font-family: droidBold, Arial; font-size: 18px; color: #06073E; height: 60px; background: #D3E3FF; text-align: center; line-height: 3.6; margin-bottom: 20px; } .login-box.loginActive { height: 510px } .login-box.loginActive.error { height: 550px } .login-box.loginActive.error .social-login { margin-bottom: 20px } .login-box.loginActive h3:before { content: "تسجيل دخول" } .login-box.signUpActive { height: 510px } .login-box.signUpActive.error { height: 560px } .login-box.signUpActive h3:before { content: "مستخدم جديد" } .login-box.profileActive h3:before { content: "حساب مستخدم" } .login-box.profileActive { height: 470px } .login-box.error .u-form-group { margin-bottom: 0; margin-top: 20px } .openRegister .login-box { opacity: 1; visibility: visible; transition: opacity .3s 0s, visibility 0s 0s; -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; -ms-transition: opacity .3s 0s, visibility 0s 0s; -o-transition: opacity .3s 0s, visibility 0s 0s; } .openRegister .login-box.phonenumber .email-login.complete { display: none } .openRegister .login-box.phonenumber .lb-header { border-bottom: 0 } .openRegister .login-box.loginActive, .tour2871 .login-box { background: #fff; color: #06073E;border-radius: 12px; } .openRegister .profileActive .lb-header { background: #fff; color: #06073E; } .openRegister .profileActive .lb-header h3 { background: #D3E3FF; color: #06073E; } .openRegister .login-box .closePopup:after, .openRegister .login-box .closePopup:before { background-color: #06073E; } .openRegister .profileActive .lb-header .profile .userImg .usericon:before { color: #06073E; } .openRegister .profileActive .lb-header .profile .UserData .data label, .openRegister .profileActive .lb-header .profile .UserData .data span { color: #06073e; } .openRegister .u-form-group button, .openRegister .u-form-group .Compelete, .openRegister .u-form-group .SigninBtn, .newPred .u-form-group .SignupBtn { background-color: #06073E; } .openRegister .login-box.phonenumber { height: 340px } .login-box.profileActive.Nophonenumber { height: fit-content; } .lb-header { display: inline-block; float: right; width: 100%; position: relative; color: #00415d; padding-bottom: 10px; border-bottom: 1px solid #D1D2D4; text-align: center; z-index: 1; } .lb-header a { display: inline-block; margin: 0 25px; padding: 0 20px; text-decoration: none; color: #666; font-size: 15px; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .lb-header .active { color: #45B3EB; } .lb-header .profile { display: inline-block; float: right; width: 100%; } .lb-header .profile .userImg { display: inline-block; width: 75px; height: 75px; border-radius: 50%; overflow: hidden; } .lb-header .profile .UserData { display: inline-block; float: right; width: 100% } .lb-header .profile .UserData .data { display: inline-block; float: right; width: 100%; padding: 10px 20px 0; text-align: right } .lb-header .profile .UserData .data label { display: inline-block; float: right; width: 60px; font-family: droidLight, Arial; font-size: 15px; margin-left: 5px; color: #000 } .lb-header .profile .UserData .data span { display: inline-block; float: right; font-family: droidLight, Arial; font-size: 15px; color: #000; width: auto; margin-top: 0 } .social-login { position: relative; float: left; width: 100%; height: auto; padding: 10px 0 16px 0; border-bottom: 1px solid #D1D2D4; margin-bottom: 16px } .social-login a { position: relative; float: left; width: 100%; text-decoration: none; color: #fff; border: 1px solid rgba(0,0,0,0.05); padding: 8px 12px; border-radius: 4px; font-size: 12px; text-transform: uppercase; margin: 0; text-align: center; margin-bottom: 10px } .social-login a:last-of-type { margin-bottom: 0 } .social-login a.loginFbBtn { background-color: #49639F; } .social-login a.loginGglBtn { background-color: #E05449 } .email-login, .email-signup { position: relative; float: left; width: 100%; height: auto; text-align: center; padding: 20px; } .email-login .complete { display: inline-block; width: 100%; text-align: right; color: #06073E; font-size: 15px; margin-bottom: 5px } .email-login.complete { padding: 10px 20px 0 } .u-form-group { width: 100%; margin-bottom: 15px; display: inline-block; position: relative } .u-form-group .itemError { display: inline-block; position: absolute; font-family: droidLight, arial; font-size: 12px; color: red; left: 0; top: -20px; text-align: left } .u-form-group.error { margin-top: 25px; margin-bottom: 0 } .u-form-group input[type="email"], .u-form-group input[type="password"], .u-form-group input[type="text"], .u-form-group input[type="tel"] { width: 100%; height: 45px; outline: none; border: 1px solid #aaa; padding: 0 10px; border-radius: 4px; font-family: droidLight, arial; color: #333; font-size: 0.8rem; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .u-form-group input::-webkit-input-placeholder { color: #aaa; opacity: 1; font-weight: normal; font-size: inherit } .u-form-group input:focus { border: 1px solid #aaa !important } .u-form-group .labelHint { display: inline-block; font-size: 12px; position: absolute; right: 10px; top: -12px; background-color: #fff; color: #525252; padding: 0 5px } input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, textarea:-webkit-autofill, textarea:-webkit-autofill:hover, textarea:-webkit-autofill:focus, select:-webkit-autofill, select:-webkit-autofill:hover, select:-webkit-autofill:focus { border: 1px solid #aaa; -webkit-text-fill-color: #000; -webkit-box-shadow: 0 0 0px 1000px #fff inset; } .u-form-group input:valid { background: #fff !important; } .signUpActive .u-form-group.error.passwrd .labelHint, .signUpActive .u-form-group.error.confirmPass .labelHint { top: 8px } .signUpActive.error .email-signup .u-form-group:nth-of-type(1), .loginActive.error .email-login .u-form-group.emails { margin-top: 0 } /*.euroPredCnts .login-box.signUpActive.error .email-login, .euroPredCnts .login-box.signUpActive.error .email-signup{padding-top:0} .euroPredCnts .login-box.loginActive.error .email-login, .euroPredCnts .login-box.loginActive.error .email-signup{padding-top:0}*/ .u-form-group input:focus { border-color: #358efb; background-color: #fff !important } .u-form-group button, .u-form-group .Compelete, .u-form-group .SigninBtn, .u-form-group .SignupBtn { display: inline-block; position: relative; width: 50%; background-color: #45B3EB; border: none; font-family: droidLight, Arial; outline: none; color: #fff; font-size: 14px; font-weight: normal; padding: 6px 0; border-radius: 2px; margin-top: 10px; } .u-form-group .Compelete { width: calc(50% - 20px) } .forgot-password { width: 50%; text-align: left; text-decoration: underline; color: #888; font-size: 0.75rem; } .login-box .closePopup { position: absolute; top: 15px; left: 16px; width: 30px; height: 30px; z-index: 2 } .login-box .closePopup:after, .login-box .closePopup:before { content: ''; position: absolute; top: 0; width: 2px; height: 100%; background-color: #fff; opacity: 1; transition: all .2s ease-in-out 0s; -webkit-transition: all .2s ease-in-out 0s; -moz-transition: all .2s ease-in-out 0s; -ms-transition: all .2s ease-in-out 0s; -o-transition: all .2s ease-in-out 0s; } .login-box .closePopup:before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .login-box .closePopup:after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .LoaderLogin { width: 100%; height: 50px; position: absolute; right: 0; top: 0; background-color: #5b0e25 } .LoaderLogin img { display: inline-block; height: 36px; float: right; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .generalError { display: inline-block; float: right; text-align: right; color: red; font-size: 12px; font-family: droidLight,Arial } /******************** Save Button ********************/ .euroPredCnts .predictionCnts .saveHint { position: fixed; width: 1282px; height: 90px; border-top: 2px solid #45B3EB; bottom: -90px; z-index: 5; left: 50%; transform: translateX(-50%); background: #000; transition: all .2s ease-in-out 0s; -webkit-transition: all .2s ease-in-out 0s; -moz-transition: all .2s ease-in-out 0s; -ms-transition: all .2s ease-in-out 0s; -o-transition: all .2s ease-in-out 0s; } .euroPredCnts .predictionCnts .saveHint .cnts { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 750px } .euroPredCnts .predictionCnts .saveHint .cnts p { display: inline-block; float: right; font-family: droidLight,Arial; font-size: 14px; line-height: 3; text-align: right; color: #fff } .euroPredCnts .predictionCnts .saveHint .cnts .icon-atn:before { content: "S"; float: right; font-size: 18px; color: #45B3EB; margin-left: 16px; line-height: 2.2 } .euroPredCnts .predictionCnts .saveBtn { display: inline-block; float: left; width: 150px; height: 40px; background: #45B3EB; color: #fff; font-family: droidLight,Arial; font-size: 14px; line-height: 3; text-align: center; border-radius: 4px; } .showPredHint .euroPredCnts .predictionCnts .saveHint { bottom: 0px } /******************** Prediction Ranking ********************/ .predRanking .ranking .rankMain { display: inline-block; float: right; width: 100%; padding: 16px; background: #282829; border-radius: 6px; overflow: hidden } .predRanking .ranking .rankCnts { display: inline-block; float: right; width: 100%; border: 1px solid #535353; border-radius: 6px; overflow: hidden; margin-bottom: 16px } .predRanking .ranking .rankCnts:last-of-type { margin-bottom: 0 } .predRanking .ranking .rankCnts .predMatchTitle { display: inline-block; float: right; width: 100%; height: 40px; padding: 0 16px; background: #535353; position: relative } .predRanking .ranking .rankCnts .predMatchTitle h3 { float: right; display: inline-block; width: calc(100% - 18px); text-align: right; color: #fff; font-family: droidLight,Arial; font-size: 15px; line-height: 2.6; } .predRanking .ranking .rankCnts .table { margin-top: 0; background: #282829; margin-bottom: 0; } .predRanking .ranking .rankCnts .table .ttlRow { background: none; margin-bottom: 0; height: 50px; padding: 12px 16px 0; border-bottom: 1px solid #535353; } .predRanking .ranking .rankCnts .table .ttlRow .itemTtl { font-size: 12px; color: #aaa } .predRanking .ranking .rankCnts .table .ttlRow .itemTtl.team { width: calc(100% - 300px); text-align: right; padding: 0; padding-right: 20px } .predRanking .ranking .rankCnts .table .ttlRow .itemTtl.dtls { width: 60px; padding: 0; text-align: center } .predRanking .ranking .rankCnts .table .ttlRow .itemTtl.buttons { width: 109px } .predRanking .ranking .rankCnts .table .wRow { height: 50px; border: none; border-bottom: 1px solid #353535; padding: 12px 16px; background: none } .predRanking .ranking .rankCnts .table .wRow:last-child { border-bottom: none } .predRanking .ranking .rankCnts .table .wRow .item { font-size: 16px; color: #fff; padding: 0; line-height: 1.6; display: inline-block; } .predRanking .ranking .rankCnts .table .wRow .item.team { width: calc(100% - 300px); padding-right: 20px } .predRanking .ranking .rankCnts .table .wRow .item.dtls { width: 60px; padding: 0; text-align: center; font-weight: bold; position: relative } .predRanking .ranking .rankCnts .table .wRow .item.dtls:before { position: absolute; right: 2px; top: 0 } .predRanking .ranking .rankCnts .table .wRow .item.dtls.up:before { content: '3'; color: #38a163; font-size: 14px } .predRanking .ranking .rankCnts .table .wRow .item.dtls.down:before { content: '4'; color: #ff2f20; font-size: 14px } .predRanking .ranking .rankCnts .table .wRow .item.dtls.stable:before { content: ''; background-color: #b9b7b7; width: 13px; height: 13px; border-radius: 50%; top: 5px } .predRanking .ranking .rankCnts .table .wRow .item a { pointer-events: none } .predRanking .ranking .rankCnts .table .wRow .team img { margin-left: 10px; width: 24px; height: 24px; border-radius: 50%; } .predRanking .ranking .rankCnts .table .wRow .item p { font-size: 13px; font-family: droidLight, arial; line-height: 1.8; color: #fff; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; display: inline-block; } .predRanking .ranking .rankCnts .table .wRow .buttons { width: 180px } .predRanking .ranking .rankCnts .table .wRow .buttons a { font-size: 13px; font-family: droidLight, arial; line-height: 1.8; font-weight: normal; color: #fff; overflow: hidden; display: inline-block; margin-left: 6px; pointer-events: visible; border: 1px solid #2c3348; border-radius: 6px; padding: 0 12px; height: 30px; line-height: 2; float: right } .predRanking .ranking .rankCnts .table .wRow .buttons a:last-child { margin-left: 0 } .predRanking .ranking .rankCnts .table .wRow .buttons a:hover:first-child { background-color: blue } .predRanking .ranking .rankCnts .table .wRow .buttons a:hover { background-color: #f24334 } .predRanking .rankHintMsg { display: inline-block; width: 100%; float: right; font-size: 18px; font-family: droidLight, arial; color: #fff; background: #000; padding: 20px; margin-bottom: 40px; border-radius: 6px; overflow: hidden; } .jp-container { display: inline-block; float: right; width: 100%; height: 376px; position: relative; } .jspContainer { overflow: hidden; position: relative; } .jspPane { position: absolute; left: 0 !important } .jspVerticalBar { position: absolute; top: 0; right: 0; width: 15px; height: 100%; background: transparent } .jspHorizontalBar { position: absolute; bottom: 0; left: 0; width: 100%; height: 14px; background: red; display: none } .jspVerticalBar *, .jspHorizontalBar * { margin: 0; padding: 0; } .jspCap { display: none; } .jspHorizontalBar .jspCap { float: left; } .jspTrack { background: #282829; position: relative; border-left: 1px solid #535353; padding: 0 2px } .jspDrag { background: #aaa; position: relative; top: 0; left: 0; width: 10px; cursor: pointer; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } .jspHorizontalBar .jspTrack, .jspHorizontalBar .jspDrag { float: left; height: 100%; } .jspArrow { background: #50506d; text-indent: -20000px; display: block; cursor: pointer; } .jspArrow.jspDisabled { cursor: default; background: #80808d; } .jspVerticalBar .jspArrow { height: 16px; } .jspHorizontalBar .jspArrow { width: 16px; float: left; height: 100%; } .jspVerticalBar .jspArrow:focus { outline: none; } .jspCorner { background: #eeeef4; float: left; height: 100%; } /* Yuk! CSS Hack for IE6 3 pixel bug :( */ * html .jspCorner { margin: 0 -3px 0 0; } /******************** Euro Choose Squad ********************/ .euroSquad .container { background: url(../../Images/ChooseSquad/Euro2020/chooseSquadBg.jpg) no-repeat center center; background-size: cover; } .euroSquad .content-wrap { padding: 0; background: none } .euroSquad .content-wrap:before { display: none } .euroSquad .content { padding: 0 } .euroSquad .content { background: none } .euroSquad .LandingPage.CAF { background: none } .euroSquad .LandingPage.CAF:before { content: ""; position: absolute; left: 100px; top: 90px; width: 131px; height: 56px; background: url(../../Images/ChooseSquad/Euro2020/euroLogo.png) no-repeat center center; background-size: 131px auto; opacity: 0.7 } .euroSquad .squadCnts { position: absolute; width: 100%; height: 100%; top: 0; left: 0; bottom: 0; right: 0 } .euroSquad .chseTtl { width: calc(100% - 1026px); position: absolute; right: 100px; top: 50%; transform: translateY(-50%); padding-top: 170px; height: 496px } .euroSquad .chseTtl:before { content: ""; position: absolute; right: 0; top: 0; width: 128px; height: 150px; background: url(../../Images/ChooseSquad/Euro2020/antaElmodareb.png) no-repeat center center; background-size: 128px auto; opacity: 0.7 } .euroSquad .chseTtl h1 { display: inline-block; float: right; color: #fff; font-size: 42px; font-family: droidBold,Arial; text-align: right; padding: 0; line-height: 2.4 } .euroSquad .chseTtl p { display: inline-block; float: right; color: #fff; width: 310px; font-size: 22px; font-family: droidLight,Arial; text-align: right; padding: 0; } .euroSquad .LandingPage.CAF .landingTeam { position: absolute; top: 50%; left: 100px; transform: translateY(-50%); bottom: auto; display: inline-block; float: right; width: 654px; } .euroSquad .LandingPage.CAF .landingTeam ul { display: inline-block; float: right; width: 100% } .euroSquad .LandingPage.CAF .landingTeam li { display: inline-block; float: right; width: 84px; margin-left: 30px; background: rgba(116,142,208,0.3); margin-bottom: 30px; border-radius: 3px; border: 1px solid rgba(255,255,255,0.3); -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroSquad .LandingPage.CAF .landingTeam li:nth-child(6n) { margin-left: 0 } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+6) { margin-bottom: 0 } .euroSquad .LandingPage.CAF .landingTeam li a { display: inline-block; float: right; width: 100%; padding: 16px; } .euroSquad .LandingPage.CAF .landingTeam li .imgCntnr { display: inline-block; float: right; width: 100%; padding-bottom: 67%; position: relative; overflow: hidden; margin-bottom: 20px } .euroSquad .LandingPage.CAF .landingTeam li .imgCntnr img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: auto } .euroSquad .LandingPage.CAF .landingTeam li p { display: inline-block; float: right; width: 100%; font-family: droidLight, arial; text-align: center; color: #fff; font-size: 14px; line-height: 1; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroSquad .LandingPage.CAF .landingTeam li:hover { background: rgba(255,255,255,0.3) } .euroSquad .LandingPage.CAF .landingTeam li:hover p { color: #fff } .euroSquadPage .chseSqMain .sponsors { left: 60px; } .euroSquadPage .chseSqMain.chooseTeam:after { content: ""; position: absolute; left: 60px; top: 60px; width: 131px; height: 56px; background: url(../../Images/ChooseSquad/Euro2020/euroLogo.png) no-repeat center center; background-size: 131px auto; opacity: 0.7 } .euroSquadPage .chseSqMain.chooseTeam:before { content: ""; position: absolute; right: 60px; top: 60px; width: 126px; height: 148px; background: url(../../Images/ChooseSquad/Euro2020/antaElmodareb.png) no-repeat center center; background-size: 126px auto; opacity: 0.7 } /******************** Choose Legends ********************/ .legendsPage .container { background: url(../../Images/Legends/legendsBg.jpg) no-repeat bottom left; background-size: cover; } .legendsPage .content-wrap { padding: 0; background: none } .legendsPage .content-wrap:before { display: none } .legendsPage .content { padding: 0 } .legendsPage .content { background: none } .LandingPage.CAF.legends { background: none; position: relative } .legends:before { content: ""; position: absolute; right: 100px; top: 60px; width: 200px; height: 150px; background: url(../../Images/Legends/legendsLogo.png) no-repeat center center; background-size: 200px 150px } .euroSquadPage .sponsors { display: inline-block; position: absolute; bottom: 50px; left: 100px; right: auto; z-index: 9 } .euroSquadPage .sponsors a { display: inline-block; float: left; margin-right: 64px; position: relative } .euroSquadPage .sponsors a:last-child { margin-right: 0 } .euroSquadPage .sponsors a:first-child:before { content: ""; position: absolute; right: -33px; top: 50%; transform: translateY(-50%); width: 2px; height: 100%; background: rgba(255,255,255,0.7) } .euroSquadPage .sponsors a img { width: auto; height: 50px } .LandingPage.CAF.legends .text { position: absolute; right: 100px; top: 50%; transform: translateY(calc(-50% + 50px)); width: 500px; } .LandingPage.CAF.legends .text h1 { display: inline-block; float: right; width: 100%; font-family: droidBold, arial; text-align: right; color: #fff; font-size: 48px; line-height: 1.6; margin-bottom: 16px } .LandingPage.CAF.legends .text p { display: inline-block; float: right; width: 100%; font-family: droidLight, arial; text-align: right; color: #fff; font-size: 24px; line-height: 2.2 } .LandingPage.CAF.legends .text .startSquad { float: right; display: inline-block; width: 250px; height: 70px; margin: 32px 0 0; background: #000; color: #fff; font-family: droidBold,Arial; text-align: center; font-size: 22px; line-height: 3; border: 2px solid #eab85f; border-radius: 10px; box-shadow: 0 12px 3px 0px rgb(0,0,0,0.2) } .LandingPage.CAF.legends .text .startSquad:hover { background: #6b4f1c; } .euroSquadPage .shareBtn { display: inline-block; position: absolute; bottom: 50px; left: auto; right: 100px; width: auto; } .euroSquadPage .shareBtn a.faceShare { display: inline-block; width: auto; height: auto; background: none; border-radius: 0; margin-left: 16px; font-size: 30px } .euroSquadPage .shareBtn a.twShare { display: inline-block; width: auto; height: auto; border-radius: 0; background: none; font-size: 30px; } .euroSquadPage .shareBtn a.faceShare:before { content: "b" } .euroSquadPage .shareBtn a.twShare:before { content: "c" } .euroSquadPage .shareBtn a.faceShare:before, .euroSquadPage .shareBtn a.twShare:before { color: #eab85f } .euroSquadPage .euroMain .shareBtn a.faceShare:before, .euroSquadPage .euroMain .shareBtn a.twShare:before { color: #fff } .legendsSquadPage.acn .container { background: url(../../Images/Legends/legendsTeamBG.jpg); background-size: cover; } .legendsSquadPage.acn .content-wrap { padding: 0; background: none } .legendsSquadPage.acn .content-wrap:before { display: none } .legendsSquadPage.acn .content { background: none; padding: 0 } .chseSqMain.legendsSquad { background-image: none; position: relative } .chseSqMain.legendsSquad .playerListMenu { background-image: url(../../Images/Legends/legendsTeamBG.jpg); background-size: cover } .chseSqMain.legends:before { right: 60px; width: 160px; height: 120px; background-size: 160px 120px } .chseSqMain.legendsSquad .chooseMain .stadiumSquad { background: url(../../Images/Legends/legendsStadium.png) no-repeat center center; background-size: 100% auto; } .chseSqMain.legendsSquad .player .imgCntr { border: 3px solid #eab85f; } .chseSqMain.legendsSquad .player { color: #eab85f } .chseSqMain.legendsSquad .allForms a { background: #000; font-size: 24px; color: #fff; border: 3px solid #eab85f; } .chseSqMain.legendsSquad .allForms a:hover, .chseSqMain.legendsSquad .allForms a.selected { background: #6b4f1c; } .chseSqMain.legendsSquad .allForms { bottom: 70px } .chseSqMain.legendsSquad .allForms .share { margin-top: inherit !important } .euroSquadPage .sponsors a { margin-right: 32px } .euroSquadPage .sponsors a:first-child:before { right: -17px } .euroSquadPage .sponsors a img { height: 40px } /******************** Euro Quiz ********************/ .euroQuizPage .content-wrap, .euroQuizPage .content, .euroQuizPage .euroPredCnts { background: #efefef; } .euroQuizCnts .FullWidthBK .euroHeader { background: #623393 } .euroQuizCnts .FullWidthBK .tabs { background: #fff; } .euroQuizCnts .tabs a, .euroQuizCnts .tabs .regBtn p { color: #000; } .euroQuizCnts .predHint { background: #fff } .euroQuizCnts .predHint .hintMsg h3, .euroQuizCnts .predHint .hintMsg p { color: #000 } .euroQuizCnts .predHint .regBtn { background: #623393; } .euroQuizCnts .title h2 { color: #000; } .euroQuizCnts .quiz { margin-bottom: 0 } .euroQuizCnts .quizSteps { display: inline-block; float: right; width: 100%; padding: 20px 40px 20px 20px; min-height: 90px; position: relative; margin-bottom: 40px; border-radius: 6px; overflow: hidden; background: linear-gradient(35deg, #311A4A, #623393); } .euroPredCnts .quizHint .hintMsg { margin-bottom: 32px } .euroQuizCnts .quizHint .hintMsg h3, .euroQuizCnts .quizHint .hintMsg p { color: #fff; width: 100% } .euroQuizCnts .quizHint .hintMsg p { margin: 18px 0 } .euroQuizCnts .quizHint .regBtn { background: #fff; color: #623393; position: relative; float: right; display: inline-block; width: 250px; height: 60px; bottom: 0; left: 0; font-size: 22px; line-height: 2.9; } .euroQuizCnts .step { display: inline-block; float: right; width: 100%; position: relative; height: 480px } .euroQuizCnts .quizSteps { padding: 32px } .euroQuizCnts #welcome.step, .euroQuizCnts #intro.step { height: auto } .euroQuizPage .tabs .regBtn.noImg .usericon { border: 1px solid #000 } .euroQuizPage .tabs .regBtn.noImg .usericon:before { color: #000 } .quizLoaderGeneral { display: inline-block; position: absolute; width: 100%; height: 100%; right: 0; top: 0; z-index: 10; background-color: rgba(0,0,0,.7); } .quizLoaderGeneral img { display: inline-block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } /** Date **/ .euroQuizCnts .game-top { display: inline-block; float: right; width: 100%; margin-bottom: 64px; position: relative } .euroQuizCnts .game-top .date { float: right; display: inline-block; } .euroQuizCnts .game-top .date p { display: inline-block; float: right; width: 100%; font-family: droidLight, arial; text-align: right; color: #fff; font-size: 16px; line-height: 1.8 } /** Question Bar **/ .euroQuizCnts .questionBar { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 116px; height: 28px } .euroQuizCnts .questionBar:before { content: ""; position: absolute; top: 50%; left: 0; width: 100%; height: 2px; background: #aaa; transform: translateY(-50%) } .euroQuizCnts .questionBar .icon-answer { display: inline-block; float: right; margin-left: 16px; width: 28px; height: 28px; border-radius: 50%; background: #47236B; border: 2px solid #aaa; color: #000; position: relative } .euroQuizCnts .questionBar .icon-answer:last-of-type { margin-left: 0 } .euroQuizCnts .questionBar .icon-answer:before { content: "y"; visibility: hidden; opacity: 0; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; width: 18px; height: 18px; font-size: 18px; background: #fff; border-radius: 50%; line-height: 1; margin-top: 3px } .euroQuizCnts .question1 .questionBar .icon-answer:nth-child(1):before { visibility: visible; opacity: 1 } .euroQuizCnts .question2 .questionBar .icon-answer:nth-child(2):before { visibility: visible; opacity: 1 } .euroQuizCnts .question3 .questionBar .icon-answer:nth-child(3):before { visibility: visible; opacity: 1 } /** Timer Bar **/ .euroQuizCnts .inline-time { position: absolute; top: 58px; right: 0; left: 0; width: 100%; height: 18px } .euroQuizCnts .timerBar { zoom: 1; position: absolute; top: 0; right: 0; width: calc(100% - 30px); height: 100%; border: 2px solid #7F2FD9; background: -webkit-linear-gradient(right,#FFA200,#ff1a3b); background: linear-gradient(to left,#FFA200,#ff1a3b); border-radius: 15px; display: inline-block; overflow: hidden } .euroQuizCnts .icon-timer { position: absolute; top: 0; left: 0; width: 30px; height: 100% } .euroQuizCnts .icon-timer:before { content: 'N'; color: #7F2FD9; position: absolute; left: 0; top: 50%; transform: translateY(-50%); font-size: 18px; width: 18px; height: 18px; line-height: 1; background: #47236B; border-radius: 50%; font-weight: bold } .euroQuizCnts .timerBar:before { content: ""; position: absolute; width: 100%; height: 100%; right: -100%; top: 0; background: #47236B; } .euroQuizCnts .question1 .timerBar:before { animation: timerBarQ1 10s linear forwards; animation-delay: 0s } .euroQuizCnts .question2 .timerBar:before { animation: timerBarQ2 10s linear forwards; animation-delay: 0s } .euroQuizCnts .question3 .timerBar:before { animation: timerBarQ3 10s linear forwards; animation-delay: 0s } @keyframes timerBarQ1 { from { right: -100%; } to { right: 0 } } @keyframes timerBarQ2 { from { right: -100%; } to { right: 0 } } @keyframes timerBarQ3 { from { right: -100%; } to { right: 0 } } /** Get Ready **/ .euroQuizCnts .getReadyTimer p { display: inline-block; float: right; width: 100%; font-family: droidLight, arial; text-align: center; color: #fff; font-size: 32px; line-height: 3; margin-bottom: 30px } .euroQuizCnts .getReadyTimer span { display: inline-block; float: right; width: 100%; font-family: CenturyGothicLight, arial; font-weight: bold; text-align: center; color: #FFA200; font-size: 120px; } /** Questions **/ .euroQuizCnts .questionDiv { display: inline-block; float: right; width: 100%; min-height: 150px; background: #fff; border-radius: 6px; overflow: hidden; margin-bottom: 16px; position: relative } .euroQuizCnts .questionDiv p { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; padding: 0 32px; font-family: droidBold, arial; text-align: center; color: #000; font-size: 24px; line-height: 1.6; } .euroQuizCnts .answerDiv { display: inline-block; float: right; width: 100% } .euroQuizCnts .answer { display: inline-block; float: right; width: calc((100% - 16px) / 2); height: 80px; background: #fff; border-radius: 6px; overflow: hidden; margin-bottom: 16px; margin-left: 16px; position: relative; cursor: pointer } .euroQuizCnts .answer:nth-of-type(2n) { margin-left: 0 } .euroQuizCnts .answer p { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; padding: 0 16px; font-family: droidLight, arial; text-align: center; color: #000; font-size: 16px; line-height: 1.6; pointer-events: none } .euroQuizCnts .selected { background: #7F2FD9 } .euroQuizCnts .selected p { color: #fff } /** Results **/ .euroQuizCnts .resultDiv { display: inline-block; float: right; width: 100% } .euroQuizCnts .resultDiv p { display: inline-block; float: right; width: 100%; font-family: droidLight, arial; text-align: center; color: #fff; font-size: 32px; line-height: 3; margin-bottom: 16px } .euroQuizCnts .resultDiv .allStars { display: inline-block; float: right; width: 280px; height: 124px; margin: 0 calc((100% - 280px) / 2) 50px; position: relative } .euroQuizCnts .resultDiv .allStars .star { position: absolute; width: 76px; height: 76px } .euroQuizCnts .resultDiv .allStars .star.icon-star:before { content: "O"; font-size: 76px; color: #7F2FD9; line-height: 1 } .euroQuizCnts .resultDiv .allStars .star.icon-star:nth-child(1) { right: 0; bottom: 0 } .euroQuizCnts .resultDiv .allStars .star.icon-star:nth-child(2) { left: 50%; top: 0; transform: translateX(-50%) } .euroQuizCnts .resultDiv .allStars .star.icon-star:nth-child(3) { left: 0; bottom: 0 } .euroQuizCnts .resultDiv.oneStar .allStars .star.icon-star:nth-child(1):before { content: "P"; color: #FFA200 } .euroQuizCnts .resultDiv.twoStar .allStars .star.icon-star:nth-child(1):before, .euroQuizCnts .resultDiv.twoStar .allStars .star.icon-star:nth-child(2):before { content: "P"; color: #FFA200 } .euroQuizCnts .resultDiv.threeStar .allStars .star.icon-star:nth-child(1):before, .euroQuizCnts .resultDiv.threeStar .allStars .star.icon-star:nth-child(2):before, .euroQuizCnts .resultDiv.threeStar .allStars .star.icon-star:nth-child(3):before { content: "P"; color: #FFA200 } .euroQuizCnts .resultDiv .yourScore { display: inline-block; float: right; width: 100%; height: 190px; position: relative; border: 1px solid #7F2FD9; border-radius: 6px; overflow: hidden } .euroQuizCnts .resultDiv .yourScore p { display: inline-block; float: right; width: 100%; font-family: droidLight, arial; text-align: center; color: #fff; font-size: 22px; line-height: 2; margin: 20px 0 0px; } .euroQuizCnts .resultDiv #number-correct p { font-size: 42px; margin-bottom: 0; line-height: 1 } .euroQuizCnts .resultDiv .yourScore span { font-family: CenturyGothicLight, Arial; font-size: 42px; font-weight: bold } .euroQuizCnts .resultDiv .yourScore .slash { margin: 0 6px } .euroQuizCnts .afterLogin .welcomeHint { background: none; height: 150px; min-height: 100%; } .euroQuizCnts .afterLogin .welcomeHint .hintMsg h3 { color: #623393; margin-top: 30px; } .euroQuizCnts .afterLogin .welcomeHint .yourScore { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); width: 230px; height: 120px; border: 1px solid #7F2FD9; border-radius: 6px; overflow: hidden } .euroQuizCnts .afterLogin .welcomeHint .yourScore p { display: inline-block; float: right; width: 100%; font-family: droidLight, arial; text-align: center; color: #623393; font-size: 22px; line-height: 1.8; margin: 10px 0 0px; } .euroQuizCnts .afterLogin .welcomeHint .userScore p { font-size: 42px; margin-bottom: 0; line-height: 1 } .euroQuizCnts .afterLogin .welcomeHint .yourScore span { font-family: CenturyGothicLight, Arial; font-size: 42px; font-weight: bold } .euroQuizCnts .afterLogin .welcomeHint .yourScore .slash { margin: 0 6px } /*.star { position: relative; display: inline-block; width: 0; height: 0; border-right: 0.3em solid transparent; border-bottom: 0.7em solid #FC0; border-left: 0.3em solid transparent;*/ /* Controlls the size of the stars. */ /*font-size: 24px; } .star:before, .star:after { content: ""; display: block; width: 0; height: 0; position: absolute; top: 0.6em; left: -1em; border-right: 1em solid transparent; border-bottom: 0.7em solid #FC0; border-left: 1em solid transparent; transform: rotate(-35deg); } .star:after { transform: rotate(35deg); }*/ .euroQuizCnts .hidden { display: none; } .euroQuizCnts .inline { display: inline; } .euroQuizCnts #question-num, .euroQuizCnts .inline-time { display: inline-block; } /** Countdown **/ .euroQuizCnts .quizCounterDiv { position: absolute; left: 50%; transform: translateX(-50%); bottom: 0; width: 210px; } .euroQuizCnts .quizCounterDiv .counterHint { display: inline-block; float: right; font-family: droidBold, Arial; font-size: 12px; color: #fff; text-align: right; margin-left: 16px; line-height: 3.4; } .euroQuizCnts .quizCounter { text-align: left; direction: ltr; display: inline-block; float: right; } .euroQuizCnts .icon-time:before { content: 'M'; position: absolute; right: -20px; top: 50%; transform: translateY(-50%); font-size: 14px } .euroQuizCnts .quizTimer { display: inline-block; float: left; font-family: CenturyGothicLight, Arial; font-size: 20px; margin-right: 4px; line-height: 2; color: #fff } .euroQuizCnts .quizTimer:last-of-type { margin-right: 0 } /** Quiz Start Countdown **/ .euroQuizCnts .quizStartCounter { display: inline-block; float: right; text-align: left; direction: ltr; float: right; width: 204px; } .euroQuizCnts .quizStartTimer { display: inline-block; float: left; font-family: CenturyGothicLight, Arial; font-size: 32px; margin-right: 20px; line-height: 1; color: #fff; position: relative } .euroQuizCnts .quizStartTimer:last-of-type { margin-right: 0 } .euroQuizCnts .quizStartTimer:after { content: ":"; position: absolute; right: -16px; bottom: 0; font-family: CenturyGothicLight, Arial; font-size: 32px } .euroQuizCnts .quizStartTimer:last-child:after { display: none } .euroQuizCnts .quizStartTimer span { font-family: droidLight, arial; color: #fff; font-size: 12px; position: absolute; bottom: -16px; left: 50%; transform: translateX(-50%) } .euroPredCnts .quizHint.quizMainCounter { padding: 32px 32px 50px } .euroPredCnts .quizHint.quizMainCounter .hintMsg { margin-bottom: 20px } /******************** Road To Euro Cup ********************/ .roadToCupPage .content-wrap { padding: 0; min-height: unset; } .roadToCupPage .content { padding: 0 } .euroRoadToCup { background: linear-gradient(45deg,#7ec5de,#8aa3d1,#91b2d3); margin-bottom: 0; padding: 64px; position: relative; } .euroRoadToCup .title { display: inline-block; float: right; width: 100%; margin-bottom: 64px; position: relative; } .euroRoadToCup .title h1 { display: inline-block; float: right; width: 100%; color: #40498d; font-size: 42px; font-family: droidBold,Arial; text-align: right; padding: 0 90px 0 0; margin-bottom: 16px; position: relative; line-height: 1.6; height: 110px } .euroRoadToCup .title h1:before { content: ""; width: 49px; height: 110px; position: absolute; right: 60px; top: 0; background: url(../../Images/euroCup.png) no-repeat center center; background-size: 49px auto; z-index: 1; } .euroRoadToCup .title span { display: inline-block; float: right; width: 100%; color: #eeeded; font-size: 18px; font-family: droidLight,Arial; text-align: right; padding: 0; margin-top: 6px; } .euroRoadToCup .title .regBtnHeader { position: absolute; left: 0; top: 0; bottom: auto } .euroRoadToCup .title .regBtnHeader p { float: left; display: inline-block; width: auto; text-align: right; color: #eeeded; font-family: droidLight,Arial; font-size: 14px; line-height: 2.4; } .euroRoadToCup .tabs { display: none } .euroRoadToCup .regBtn.noImg .usericon { display: inline-block; float: left; margin-right: 10px; width: 30px; height: 30px; border-radius: 50%; border: 1px solid #1E1E1E; overflow: hidden;position: absolute; left: 14px; top: 50%; transform: translateY(-50%); } .euroRoadToCup .regBtn.noImg .usericon:before { content: 'Q'; color: #1E1E1E; font-size: 21px } .euroRoadToCup .regBtn.noImg img { display: none } .euroRoadToCup .regBtn .usericon { display: none } .euroRoadToCup .regBtn { position: absolute; left: 0; bottom: 24px } .euroRoadToCup .regBtn img { display: inline-block; float: left; margin-right: 10px; width: 30px; height: 30px; border-radius: 50%; } .euroRoadToCup .regBtn p { float: left; display: inline-block; text-align: right; color: #eeeded; font-family: droidLight,Arial; font-size: 13px; line-height: 2.4; } .euroRoadToCup .regBtn:hover p { color: rgba(255,255,255,0.6) } .euroRoadToCup .regBtn .usericon { display: none } .lb-header .profile .userImg .usericon { display: inline-block; float: left; margin-right: 10px; width: 100%; height: 100%; border-radius: 50%; overflow: hidden; position: relative; padding: 0; margin: 0 } .lb-header .profile .userImg .usericon:before { content: 'R'; color: #000; font-size: 50px; top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute; } /** Tabs **/ .euroRoadToCup .breadcrumbDiv { display: inline-block; float: right; width: 100%; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,0.5); margin-bottom: 40px; position: relative } .euroRoadToCup .breadcrumb { display: inline-block; float: right; position: relative; } .euroRoadToCup .breadcrumb:before { content: ""; position: absolute; top: 50%; right: 0; width: 242px; height: 2px; background: #6a81c3; transform: translateY(-50%); display: none } .euroRoadToCup .breadcrumb li { display: inline-block; float: right; margin-left: 32px; color: #7187c6; position: relative; } .euroRoadToCup .breadcrumb li span { display: inline-block; float: right; width: 30px; height: 30px; background: #eeeded; border-radius: 50%; text-align: center; font-family: CenturyGothicLight, Arial; color: #8b1538; font-size: 16px; line-height: 30px } .euroRoadToCup .breadcrumb li.disabled span { background: none; border: 1px solid #eeeded; color: #eeeded } .rtcKnockout .euroRoadToCup .breadcrumb li:first-of-type span { background: none; border: 1px solid #eeeded; color: #eeeded } .euroRoadToCup .breadcrumb li p { display: inline-block; float: right; padding-right: 10px; font-family: droidLight, Arial; color: #eeeded; font-size: 14px; line-height: 30px } .euroRoadToCup .breadcrumb li:last-of-type { margin-left: 0 } /*.euroRoadToCup .breadcrumb li.disabled{background:#6a81c3;color:#fff}*/ .euroRoadToCup .shareGame { display: inline-block; position: absolute; bottom: 16px; left: 0; z-index: 2; } .euroRoadToCup .shareGame p { display: inline-block; float: right; font-family: droidLight,Arial; color: #eeeded; text-align: right; margin-left: 16px; font-size: 14px; line-height: 37px } .euroRoadToCup .shareGame .icon-share { display: block } .euroRoadToCup .shareGame .icon-share:before { content: "X"; color: #fff; font-size: 22px } .euroRoadToCup .shareGame .sharingMenu { position: absolute; left: 0; top: 100%; width: 200px; background: #fff; opacity: 0; visibility: hidden; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroRoadToCup .shareGame.openSharingMenu .sharingMenu { opacity: 1; visibility: visible } .euroRoadToCup .shareGame .socialLink { display: inline-block; float: right; width: 100%; color: #eeeded; border-bottom: 1px solid #eee; padding: 6px 10px } .euroRoadToCup .shareGame .socialLink:last-of-type { border-bottom: none } /*.euroRoadToCup .shareGame .socialLink:hover{background:#eeeded;color:#7187c6}*/ .euroRoadToCup .shareGame .socialLink:before { float: right; display: inline-block; color: #000; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroRoadToCup .shareGame .socialLink p { float: right; display: inline-block; font-family: droidLight,Arial; color: #000; text-align: right; font-size: 13px; padding-right: 10px; line-height: initial; } .euroRoadToCup .shareGame .socialLink.faceShare:before { content: 'b'; line-height: 1.8; } .euroRoadToCup .shareGame .socialLink.twShare:before { content: 'c'; line-height: 1.8; } .euroRoadToCup .shareGame .socialLink.wappShare:before { content: 'Y'; line-height: 1.8; } .euroRoadToCup .shareGame .socialLink.msngrShare:before { content: 'Z'; line-height: 1.8; } .euroRoadToCup .shareGame .socialLink.faceShare:hover p, .euroRoadToCup .shareGame .socialLink.faceShare:hover:before { color: #3b5998 } .euroRoadToCup .shareGame .socialLink.twShare:hover p, .euroRoadToCup .shareGame .socialLink.twShare:hover:before { color: #1da1f2 } .euroRoadToCup .shareGame .socialLink.wappShare:hover p, .euroRoadToCup .shareGame .socialLink.wappShare:hover:before { color: #25d366 } .euroRoadToCup .shareGame .socialLink.msngrShare:hover p, .euroRoadToCup .shareGame .socialLink.msngrShare:hover:before { color: #00B2FF } .euroRoadToCup .shareGame .socialLink.wappShare, .euroRoadToCup .shareGame .socialLink.msngrShare { display: none } .euroRoadToCup .rtcSponsor { position: absolute; bottom: 0; right: 20px; z-index: 1 } .euroRoadToCup .rtcSponsor img { width: 56px } /** Stage Info **/ .euroRoadToCup .groups { display: inline-block; float: right; width: 100%; padding-bottom: 32px; border-bottom: 1px solid rgba(255,255,255,0.5); } .euroRoadToCup .groups .stageInfo { display: inline-block; float: right; width: 100%; border-radius: 6px; overflow: hidden; padding: 16px 0; margin-bottom: 16px } .euroRoadToCup .groups .stageInfo h2 { display: inline-block; float: right; width: 100%; color: #eeeded; font-size: 20px; font-family: droidBold,Arial; text-align: right; padding: 0; margin-bottom: 16px } .euroRoadToCup .groups .stageInfo p { display: inline-block; float: right; width: 100%; color: #eeeded; font-size: 16px; font-family: droidLight,Arial; text-align: right; padding: 0; } /** Group Item **/ .euroRoadToCup .groupTaples { display: inline-block; float: right; width: 100% } .euroRoadToCup .groupTaples .group { display: inline-block; float: right; width: calc((100% - 64px) / 3); margin-left: 32px; margin-bottom: 32px; background: #eeeded; border-radius: 6px; overflow: hidden; height: 426px; position: relative } .euroRoadToCup .groupTaples .group:nth-child(3n) { margin-left: 0 } .euroRoadToCup .groupTaples h3 { float: right; display: inline-block; width: 100%; text-align: right; color: #000; font-family: droidBold,Arial; font-size: 18px; line-height: 2.4; padding: 16px } /** Group Teams - Flags **/ .euroRoadToCup .groupTaples .GroupTeams { display: inline-block; float: right; width: 296px; margin: 10px calc((100% - 296px) / 2) 20px } .euroRoadToCup .groupTaples .GroupTeams li { display: inline-block; float: right; margin-left: 32px; width: 50px; } .euroRoadToCup .groupTaples .GroupTeams li .imgCntnr { display: inline-block; float: right; width: 50px; padding-bottom: calc(100% - 4px); position: relative; border-radius: 50%; overflow: hidden; border: 2px solid #fff; margin-bottom: 4px } .euroRoadToCup .groupTaples .GroupTeams li img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; height: 70px; max-width: unset; } .euroRoadToCup .groupTaples .GroupTeams li span { display: inline-block; float: right; width: 100%; font-family: droidBold, arial; text-align: center; color: #000; font-size: 12px; line-height: 1; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroRoadToCup .groupTaples .GroupTeams li:last-of-type { margin-left: 0 } /** Sorting Teams **/ .euroRoadToCup .groupTaples .sortingTeams { display: inline-block; float: right; width: 100%; height: 256px; background: linear-gradient(45deg,#5d9ac6,#6389c2,#7187c6); position: relative } .euroRoadToCup .groupTaples .sortingTeams li { display: inline-block; float: right; margin-left: 0; width: 100%; height: 64px; padding: 12px 16px; overflow: hidden; border-top: 1px solid rgba(255,255,255,0.5); position: relative } .euroRoadToCup .groupTaples .sortingTeams li .TeamStanding { display: inline-block; float: right; width: 10px; font-family: CenturyGothicLight, Arial; font-weight: bold; font-size: 24px; color: rgba(255,255,255,0.5); line-height: 1.6; margin-left: 20px; position: relative } .euroRoadToCup .groupTaples .sortingTeams li .TeamStanding:after { content: ""; position: absolute; top: 50%; left: -60px; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,0.5) } .euroRoadToCup .groupTaples .sortingTeams li .imgCntnr { display: inline-block; float: right; width: 40px; height: 40px; position: relative; border-radius: 50%; overflow: hidden; border: 2px solid #aaa; margin-bottom: 4px } .euroRoadToCup .groupTaples .sortingTeams li img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; height: 60px; max-width: unset; } .euroRoadToCup .groupTaples .sortingTeams li .TeamName { display: inline-block; float: right; width: calc(100% - 82px); font-family: droidLight, arial; text-align: right; color: #000; font-size: 16px; line-height: 2.8; padding-right: 16px; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroRoadToCup .groupTaples .sortingTeams li .DelBtn { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; border-radius: 50%; text-align: center } .euroRoadToCup .groupTaples .sortingTeams li .DelBtn:before, .euroRoadToCup .groupTaples .sortingTeams li .DelBtn:after { content: ''; width: 2px; height: 14px; position: absolute; left: 11px; top: 5px; background: #444; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroRoadToCup .groupTaples .sortingTeams li .DelBtn:before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .euroRoadToCup .groupTaples .sortingTeams li .DelBtn:after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .euroRoadToCup .groupTaples .sortingTeams li .DelBtn:hover { background: #6a81c3 } .euroRoadToCup .groupTaples .sortingTeams li .DelBtn:hover:before, .euroRoadToCup .groupTaples .sortingTeams li .DelBtn:hover:after { background: #eeeded; } .euroRoadToCup .groupTaples .GroupStanding.A:before { content: ""; position: absolute; height: 100%; width: 300px; background: url(../../Images/RoadToCup/Groups/groupAbg.jpg) no-repeat center left; mix-blend-mode: multiply; top: 0; left: 0; opacity: 0.05; background-size: cover; pointer-events: none; z-index: 1 } .euroRoadToCup .groupTaples .GroupStanding.B:before { content: ""; position: absolute; height: 100%; width: 190px; background: url(../../Images/RoadToCup/Groups/groupBbg.jpg) no-repeat center left; mix-blend-mode: multiply; top: 0; left: 0; opacity: 0.03; background-size: cover; pointer-events: none; z-index: 1 } .euroRoadToCup .groupTaples .GroupStanding.C:before { content: ""; position: absolute; height: 100%; width: 280px; background: url(../../Images/RoadToCup/Groups/groupCbg.jpg) no-repeat bottom left; mix-blend-mode: multiply; top: 0; left: 0; opacity: 0.03; background-size: cover; pointer-events: none; z-index: 1 } .euroRoadToCup .groupTaples .GroupStanding.D:before { content: ""; position: absolute; height: 100%; width: 280px; background: url(../../Images/RoadToCup/Groups/groupDbg.jpg) no-repeat bottom left; mix-blend-mode: multiply; top: 0; left: 0; opacity: 0.06; background-size: cover; pointer-events: none; z-index: 1 } .euroRoadToCup .groupTaples .GroupStanding.E:before { content: ""; position: absolute; height: 100%; width: 250px; background: url(../../Images/RoadToCup/Groups/groupEbg.png) no-repeat center left; top: 0; left: 20px; opacity: 0.04; background-size: cover; pointer-events: none; z-index: 1 } .euroRoadToCup .groupTaples .GroupStanding.F:before { content: ""; position: absolute; height: 100%; width: 300px; background: url(../../Images/RoadToCup/Groups/groupFbg.png) no-repeat center left; mix-blend-mode: multiply; top: 0; left: 0; opacity: 0.08; background-size: cover; pointer-events: none; z-index: 1 } /** Select Team **/ .euroRoadToCup .groupTaples .GroupTeams li.select a { opacity: 0.2 } .euroRoadToCup .groupTaples .GroupTeams li.select span { opacity: 0.2 } /** Has Item **/ .euroRoadToCup .groupTaples .sortingTeams li.hasteam { background: rgba(255,255,255,0.95); border-top: 1px solid #efefef } .euroRoadToCup .groupTaples .sortingTeams li.hasteam .TeamStanding { color: #7187c6 } .euroRoadToCup .groupTaples .sortingTeams li.hasteam .TeamStanding:after { display: none } .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(1):after, .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(2):after { content: "m"; position: absolute; left: 50px; top: 50%; transform: translateY(-50%) rotate(-90deg); color: #06b281; font-size: 16px; width: 14px; height: 16px; text-align: center; line-height: 1 } .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(3):after { content: ""; position: absolute; left: 50px; top: 50%; transform: translateY(-50%); width: 14px; height: 2px; background: #aaa } .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(4) .imgCntnr { opacity: 0.2 } .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(4) .TeamName { color: #b3b3b3; opacity: 0.6 } .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(3):after, .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(4):after { content: ""; position: absolute; left: 50px; top: 50%; transform: translateY(-50%); width: 14px; height: 2px; background: #aaa } .euroRoadToCup .GroupStanding { width: 100%; margin-left: 0 } /** 3rd Place **/ .euroRoadToCup .Place3rd { display: inline-block; float: right; width: 700px; background: #6a81c3; border-radius: 6px; overflow: hidden; margin: 0 calc((100% - 700px) / 2) } .euroRoadToCup .Place3rd .thirdHeader { display: inline-block; float: right; width: 100%; background: #eeeded; padding: 20px 16px; } .euroRoadToCup .Place3rd h3 { text-align: center; margin-bottom: 10px; line-height: 2; padding: 0 } .euroRoadToCup .Place3rd p { display: inline-block; float: right; width: 100%; color: #000; font-size: 14px; font-family: droidLight,Arial; text-align: center; } .euroRoadToCup .Place3rd .bestThirds { display: inline-block; float: right; width: 100%; margin: 0; background: linear-gradient(45deg,#5d9ac6,#6389c2,#7187c6) } .euroRoadToCup .Place3rd li { display: inline-block; float: right; margin-left: 0; width: 100%; height: 64px; padding: 12px 16px; overflow: hidden; border-top: 1px solid rgba(255,255,255,0.5); position: relative; pointer-events: none; cursor: pointer } .euroRoadToCup .Place3rd li .TeamStanding { display: inline-block; float: right; width: 10px; height: 38px; font-family: CenturyGothicLight, Arial; font-weight: bold; font-size: 24px; color: rgba(255,255,255,0.5); line-height: 1.6; margin-left: 30px; position: relative } .euroRoadToCup .Place3rd li .TeamStanding:after { content: ""; position: absolute; top: 50%; left: -30px; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,0.5) } .euroRoadToCup .Place3rd li .imgCntnr { display: inline-block; float: right; width: 40px; height: 40px; position: relative; border-radius: 50%; overflow: hidden; border: 2px solid #aaa; margin-bottom: 4px } .euroRoadToCup .Place3rd li img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; height: 60px; max-width: unset; } .euroRoadToCup .Place3rd li .TeamName { display: inline-block; float: right; width: calc(100% - 82px); font-family: droidLight, arial; text-align: right; color: #000; font-size: 16px; line-height: 2.8; padding-right: 16px; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroRoadToCup .Place3rd li .CheckIn { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; border-radius: 50%; border: 1px solid #aaa; text-align: center; color: #fff; font-size: 14px; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroRoadToCup .Place3rd li .CheckIn:hover { background: #f2f2f2 } .euroRoadToCup .Place3rd li .CheckedIn { border: none; background: #6a81c3; } .euroRoadToCup .Place3rd li .CheckedIn:hover { background: #6a81c3 } .euroRoadToCup .Place3rd li .CheckedIn:before { content: "K"; line-height: 1.9 } .euroRoadToCup .Place3rd li .GroupName { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: #000; font-size: 12px; font-family: droidLight,Arial; text-align: right; } .euroRoadToCup .Place3rd li.hasThirdTeam { pointer-events: unset } .euroRoadToCup .Place3rd li.hasThirdTeam { background: #eeeded; border-top: 1px solid #efefef } .euroRoadToCup .Place3rd li.hasThirdTeam .TeamStanding { color: #7187c6 } .euroRoadToCup .Place3rd li.hasThirdTeam .TeamStanding:after { display: none } .euroRoadToCup .Place3rd .selectedAllThird li .imgCntnr { opacity: 0.2 } .euroRoadToCup .Place3rd .selectedAllThird li .TeamName { color: #b3b3b3; opacity: 0.6 } .euroRoadToCup .Place3rd .selectedAllThird li:after { content: ""; position: absolute; left: 90px; top: 50%; transform: translateY(-50%); width: 14px; height: 2px; background: #aaa } .euroRoadToCup .Place3rd li.select3rd:after { content: "m"; position: absolute; left: 90px; top: 50%; transform: translateY(-50%) rotate(-90deg); color: #68bb68; font-size: 16px; width: 14px; height: 16px; text-align: center; line-height: 1; background: none } .euroRoadToCup .Place3rd .selectedAllThird li.select3rd .imgCntnr { opacity: 1 } .euroRoadToCup .Place3rd .selectedAllThird li.select3rd .TeamName { color: #000; opacity: 1 } .euroRoadToCup .disabled { opacity: 0.2; pointer-events: none } .euroRoadToCup .nextHint { display: inline-block; float: right; width: 100%; color: #eeeded; font-size: 13px; font-family: droidLight,Arial; text-align: center; position: absolute; bottom: 140px; left: 0; } .euroRoadToCup .nextHint.disabled { display: none } .euroRoadToCup .submitBtn { float: right; display: inline-block; width: 250px; height: 60px; margin: 64px calc((100% - 250px) / 2) 0; background: #eeeded; color: #7187c6; font-family: droidLight,Arial; text-align: center; font-size: 18px; line-height: 3.4; border-radius: 4px; } .euroRoadToCup .predHint { display: inline-block; float: right; width: 100%; background: #6a81c3; padding: 16px; min-height: 150px; position: relative; margin-bottom: 0; margin-top: 20px; border-radius: 6px; overflow: hidden } .euroRoadToCup .predHint .hintMsg { display: inline-block; float: right; width: 100%; } .euroRoadToCup .predHint .hintMsg h3 { float: right; display: inline-block; width: 100%; text-align: right; color: #eeeded; font-family: droidBold,Arial; font-size: 26px; line-height: 2; } .euroRoadToCup .predHint .hintMsg p { float: right; display: inline-block; width: 100%; text-align: right; color: #eeeded; font-family: droidLight,Arial; font-size: 13px; line-height: 1; margin: 20px 0 } .euroRoadToCup .predHint .regBtn { position: absolute; left: 20px; bottom: 25px; width: 200px; height: 50px; background: #45B3EB; color: #eeeded; font-family: droidLight,Arial; font-size: 14px; line-height: 3.6; text-align: center; border-radius: 4px } /******************** Knock Out Round ********************/ .euroRoadToCup .allRounds { display: inline-block; float: right; width: 100%; margin-bottom: 16px } .euroRoadToCup .allRounds .roundItem { display: inline-block; float: right; width: calc((100% - 96px) / 4); margin-left: 32px; position: relative } .euroRoadToCup .allRounds .roundItem h3 { display: inline-block; float: right; width: 100%; margin-left: 0; overflow: hidden; margin-bottom: 16px; background: #6a81c3; border-radius: 6px; font-family: droidLight,Arial; text-align: center; color: #fff; font-size: 16px; padding: 10px 16px } .euroRoadToCup .allRounds .roundItem:last-child { margin-left: 0 } .euroRoadToCup .allRounds .roundItem .qualifiedTeams { display: inline-block; float: right; width: 100%; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .knockoutStage { display: inline-block; float: right; width: 100%; position: relative } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .teamData { display: inline-block; float: right; width: 100%; position: relative; margin-bottom: 2px } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .teamData .team { display: inline-block; float: right; width: 100%; height: 64px; padding: 12px 60px 12px 16px; background: #6a81c3; cursor: pointer; border-radius: 6px; overflow: hidden; pointer-events: none; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .teamData .team:after { content: ""; position: absolute; top: 50%; right: 16px; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,0.5) } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .teamData:last-child { margin-bottom: 0 } .euroRoadToCup .allRounds .roundItem .qlfyTeam .team .imgCntnr { opacity: 0.2 } .euroRoadToCup .allRounds .roundItem .qlfyTeam .team .TeamName { color: #b3b3b3; opacity: 0.6 } .euroRoadToCup .allRounds .roundItem .qlfyTeam .team.selected .imgCntnr { opacity: 1 } .euroRoadToCup .allRounds .roundItem .qlfyTeam .team.selected .TeamName { color: #000; opacity: 1 } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .separating { position: absolute; width: calc(100% + 10px); height: 2px; right: 6px; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,0.5) } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .knockoutStage { margin-bottom: 16px } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .knockoutStage:last-child { margin-bottom: 0 } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .imgCntnr { display: inline-block; float: right; width: 40px; height: 40px; position: relative; border-radius: 50%; overflow: hidden; border: 2px solid #aaa; margin-bottom: 4px } .euroRoadToCup .allRounds .roundItem .qualifiedTeams img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; height: 60px; max-width: unset; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .TeamName { display: inline-block; float: right; width: calc(100% - 82px); font-family: droidLight, arial; text-align: right; color: #000; font-size: 16px; line-height: 2.8; padding-right: 16px; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .CheckIn { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; border-radius: 50%; border: 1px solid #aaa; text-align: center; color: #fff; font-size: 14px; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .CheckIn:hover { background: #f2f2f2 } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .CheckedIn { border: none; background: #6a81c3; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .CheckedIn:hover { background: #6a81c3 } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .CheckedIn:before { content: "K"; line-height: 1.9 } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .GroupName { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: #000; font-size: 12px; font-family: droidLight,Arial; text-align: right; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .teamData .team.hasteam { pointer-events: unset } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .teamData .team.hasteam { background: #fff; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .teamData .team.hasteam .TeamStanding { color: #7187c6 } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .teamData .team.hasteam .TeamStanding:after { display: none } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .teamData .team.hasteam:after { display: none } .euroRoadToCup .allRounds .roundItem .qualifiedTeams.second { padding: 73px 0 } .euroRoadToCup .allRounds .roundItem .qualifiedTeams.second .knockoutStage { margin-bottom: 162px } .euroRoadToCup .allRounds .roundItem .qualifiedTeams.second .knockoutStage:last-child { margin-bottom: 0 } .second .teamData:last-child:before, .second .teamData:first-child:before { width: 20px; display: block; right: -16px; border-right: 2px solid rgba(255,255,255,0.5); content: ''; position: absolute; } .second .teamData:first-child:before { border-bottom: 2px solid rgba(255,255,255,0.5); bottom: -2px; height: 73px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; } .second .teamData:last-child:before { top: 0; height: 73px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; } .euroRoadToCup .tabs-container#divTab2 { padding-bottom: 100px } .euroRoadToCup .tabs-container p.hint { display: inline-block; float: right; font-family: droidLight, Arial; color: #eeeded; font-size: 14px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) } /******************** euro inner page ********************/ /******************** popup message********************/ .popupMsg { display: inline-block; width: 100%; height: 100%; float: right; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(29,29,29,0.90); z-index: 1001; opacity: 0; visibility: hidden } .popupMsg .popupCntnr { display: inline-block; position: absolute; min-height: 180px; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #fff; width: 500px; border-radius: 6px; padding: 30px 30px 20px; transition: opacity .3s 0s, visibility 0s 0s; -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; -ms-transition: opacity .3s 0s, visibility 0s 0s; -o-transition: opacity .3s 0s, visibility 0s 0s; } .popupMsg .popupCntnr .closeMsg { display: inline-block; position: absolute; top: 8px; left: 8px; width: 25px; height: 25px } .popupMsg .popupCntnr .closeMsg:before { content: 'B'; font-size: 18px; color: #000; } .popupMsg p { display: inline-block; width: 100%; font-size: 16px; color: #000; float: right; font-family: droidLight, arial; margin-bottom: 25px; text-align: center } .popupMsg .iconDiv { display: inline-block; width: 70px; height: 70px; background-color: #1a9901; border-radius: 50%; position: relative; margin-bottom: 20px } .popupMsg .iconDiv:before { color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 36px; } .popupMsg.error .iconDiv { background-color: #db0723 } .popupMsg.success .iconDiv:before { content: 'K' } .popupMsg.error .iconDiv:before { content: 'B'; font-size: 26px } .openPopup .popupMsg { opacity: 1; visibility: visible } .euroRoadToCup .allRounds .roundItem .qualifiedTeams.third { padding: 219px 0 } .euroRoadToCup .allRounds .roundItem .qualifiedTeams.third .knockoutStage { margin-bottom: 454px } .euroRoadToCup .allRounds .roundItem .qualifiedTeams.third .knockoutStage:last-child { margin-bottom: 0 } /******************** reset & forget password ********************/ .passwordPage { display: inline-block; width: 100%; float: right; padding: 20px; border-radius: 6px } .passwordPage .pagecnts { display: inline-block; width: 100%; background-color: #fff; border-radius: 6px; padding: 20px } .passwordPage .cntnr { display: inline-block; width: 600px; margin: 0 calc((100% - 600px) /2) } .passwordPage input { width: 100%; height: 45px; outline: none; border: 1px solid #aaa; padding: 0 10px; font-family: droidLight, arial; border-radius: 4px; color: #333; font-size: 0.8rem; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .passwordPage input:focus, .passwordPage input:active { outline: 1px solid #aaa; border: 1px solid #aaa; border-radius: 4px } .passwordPage .item label { margin-top: 10px } .passwordPage label { display: inline-block; font-family: droidLight, arial; font-size: 16px; width: 100%; text-align: right; margin-bottom: 5px } .passwordPage .continue { display: inline-block; position: relative; width: 180px; float: left; background-color: #45B3EB; border: none; font-family: droidLight, Arial; outline: none; color: #fff; font-size: 14px; font-weight: normal; padding: 6px 0; border-radius: 2px; margin-top: 15px; } .passwordPage .generalError { float: none; width: 100% } .passwordPage p { display: inline-block; width: 100%; text-align: center; float: right; font-family: droidLight, Arial; font-size: 20px; color: red } .third .teamData:last-child:before, .third .teamData:first-child:before { width: 20px; display: block; right: -16px; border-right: 2px solid rgba(255,255,255,0.5); content: ''; position: absolute; } .third .teamData:first-child:before { border-bottom: 2px solid rgba(255,255,255,0.5); bottom: -2px; height: 146px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; } .third .teamData:last-child:before { top: 0; height: 146px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams.final { padding: 511px 0 } .euroRoadToCup .allRounds .roundItem .qualifiedTeams.final .separating { width: calc(100% - 12px) } .final .teamData:last-child:before, .final .teamData:first-child:before { width: 20px; display: block; right: -16px; border-right: 2px solid rgba(255,255,255,0.5); content: ''; position: absolute; } .final .teamData:first-child:before { border-bottom: 2px solid rgba(255,255,255,0.5); bottom: -2px; height: 292px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; } .final .teamData:last-child:before { top: 0; height: 292px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; } /******************** Euro Winner ********************/ .euroRoadToCup .allRounds .roundItem .cupWinner { position: absolute; left: 0; top: 240px; width: 100% } .euroRoadToCup .allRounds .roundItem .cupWinner h3 { display: inline-block; float: right; width: 100%; position: relative; margin-bottom: 30px; margin-left: 0; font-family: droidBold,Arial; text-align: center; color: #fff; font-size: 18px; background: none; border-radius: 0; padding: 0 0 16px } .euroRoadToCup .allRounds .roundItem .cupWinner h3:after { content: ""; position: absolute; width: 50%; height: 1px; bottom: 0; left: 50%; transform: translateX(-50%); background: rgba(255,255,255,0.5) } .euroRoadToCup .allRounds .roundItem .cupWinner .winnerImg { position: absolute; top: 80px; left: 50%; transform: translateX(-50%); text-align: center; width: 100px; height: 100px; background: rgba(255,255,255,0.5); border: 2px solid #aaa; border-radius: 50% } .euroRoadToCup .allRounds .roundItem .cupWinner .winnerImg:before { content: "?"; font-family: arial; font-weight: bold; line-height: 1.7; font-size: 58px; color: #7187c6 } .euroRoadToCup .allRounds .roundItem .selectWinner .cupWinner .winnerImg { display: none } .euroRoadToCup .allRounds .roundItem .cupWinner .winnerHolder { display: inline-block; float: right; width: 100% } .euroRoadToCup .allRounds .roundItem .cupWinner .winnerHolder .imgCntnr { display: inline-block; float: right; width: 100px; height: 100px; position: relative; margin: 0 calc((100% - 100px) / 2) 16px; border-radius: 50%; overflow: hidden; border: 2px solid #aaa; margin-bottom: 4px } .euroRoadToCup .allRounds .roundItem .cupWinner .winnerHolder img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: auto; height: 150px; max-width: unset; } .euroRoadToCup .allRounds .roundItem .cupWinner .winnerHolder .teamName { display: inline-block !important; float: right; width: 100%; font-family: droidBold, arial; text-align: center; color: #fff; font-size: 22px; line-height: 1.6; padding-right: 0 } .euroRoadToCup .allRounds .roundItem .cupWinner .winnerHolder span { display: none } .euroRoadToCup .allRounds .roundItem .cupWinner .ShareLogin { display: none } .euroRoadToCup .allRounds .roundItem .cupWinner .ShareLogin a { display: inline-block; float: right; width: 100px; height: 40px; border-radius: 6px; overflow: hidden; background: #3b5998; position: relative; margin: 32px calc((100% - 100px) / 2) 0 } .euroRoadToCup .allRounds .roundItem .cupWinner .ShareLogin .cnts { width: 58px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-family: droidLight, Arial; font-size: 13px; } .euroRoadToCup .allRounds .roundItem .cupWinner .ShareLogin .cnts p { display: inline-block; float: right; color: #fff; font-family: droidLight, Arial; font-size: 13px; line-height: 2.6 } .euroRoadToCup .allRounds .roundItem .cupWinner .ShareLogin .cnts span { display: inline-block; float: right; margin-left: 6px } .euroRoadToCup .allRounds .roundItem .cupWinner .ShareLogin .cnts span.icon-fb:before { content: "b"; font-size: 20px } .euroRoadToCup .allRounds .roundItem .selectWinner .cupWinner .ShareLogin { display: inline-block } .euroRoadToCup .allRounds .roundItem .qualifiedTeams.final .knockoutStage:before { content: ""; width: 70px; height: 158px; position: absolute; left: 0; bottom: 100%; background: url(../../Images/euroCup.png) no-repeat center center; background-size: 70px 158px; z-index: 1 } @media screen and (min-width: 320px) and (max-width: 767px) { .predRanking .rankHintMsg { font-size: 16px; padding: 20px } .newPred .blankMsg { font-size: 16px; padding: 0 0 20px } .newPred .table .blankMsg { text-align: right; font-size: 14px; padding: 20px; } .newPred .regBtnPage { width: 100%; margin: 0 0 40px; } } /***** ChooseSquadInt *****/ .LandingPage { margin-bottom: 40px; position: relative; background-image: url(../../Images/backgroundLanding.png); background-size: cover; background-repeat: no-repeat; width: 100%; overflow: hidden; padding-bottom: 67%; } .LandingPage.ahpy { margin-bottom: 0; background-image: url(../../Images/AhlyPyramids/AhlyVSPyramidsBG.jpg); } .LandingPage .landingTeam { position: absolute; left: -8%; top: 170px; } .LandingPage.ahpy .landingTeam { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 430px; margin-top: 50px; } .LandingPage .landingTeam .line { display: inline-block; float: right; } .LandingPage .landingTeam .TeamOne span, .LandingPage .landingTeam .TeamTwo span { display: block; font-family: droidLight, Arial; font-weight: bold; color: #FFF; font-size: 20px; text-shadow: 2px 2px #000; max-width: 70px; margin: 0 auto; } .LandingPage .landingTeam .VS { width: 15%; margin-top: 10px; } .LandingPage .landingTeam .VS img { width: 65%; } .LandingPage .landingTeam .TeamOne img { max-width: 150px; height: 75px; } .LandingPage .landingTeam .TeamTwo img { max-width: 150px; height: 75px; } .LandingPage.ahpy .landingTeam img { width: 215px; height: auto; max-width: unset } .LandingPage.ahpy .teamsName { display: inline-block; width: 220px; margin-top: 10px } .LandingPage.ahpy .teamsName p { font-family: beinblack, Arial; font-size: 68px; text-align: center; direction: rtl; line-height: 1.2 } .LandingPage.ahpy .teamsName p:first-child { color: #ff0000; text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff,1px 1px 5px #fff; } .LandingPage.ahpy .teamsName p:last-child { color: #fff; text-shadow: 2px 0 0 #1f90cd, -2px 0 0 #1f90cd, 0 2px 0 #1f90cd, 0 -2px 0 #1f90cd, 1px 1px 0 #1f90cd, -1px -1px 0 #1f90cd, 1px -1px 0 #1f90cd, -1px 1px 0 #1f90cd,1px 1px 5px #1f90cd; } .chooseSquadDiv .SquadInt { background-image: none; } .chooseSquadDiv .SquadInt .BGSquadInt { position: absolute; right: 0; height: 100%; } .chooseSquadDiv .SquadInt .logoSquadInt { width: 150px; height: 80px; position: relative; bottom: 30px; left: 30px; } .chooseSquadDiv .SquadInt .logoSquadInt img { max-width: 100%; height: 100%; } .chooseSquadDiv .SquadInt .player-image { width: 180px; height: 240px; border-radius: 10px; } .chooseSquadDiv .SquadInt .playerDtls { margin-top: 0; } .chooseSquadDiv .SquadInt .buttons { margin: 65px 0 0 0; } .chooseSquadDiv .SquadInt .stepThree { z-index: 3 } .chooseSquadDiv .SquadInt .stepThree .top-content h4 span { display: block; } .chooseSquadDiv .SquadInt .stepThree .top-content .team-image { height: 153px; width: 114px; margin: 0 22px; margin-bottom: 20px; } .squadPage .content-wrap { padding: 0; min-height: unset } .squadPage .content { padding: 0 } .LandingPage.CAF { background-image: url(../../Images/ChooseSquad/chooseSquadLanding.jpg?ref=0.2); margin-bottom: 0; padding-bottom: 56%; } .LandingPage.CAF .landingTeam { left: 50%; transform: translateX(-50%); width: 50%; bottom: 26%; top: auto } .LandingPage.CAF .landingTeam .line.TeamTwo { float: left } .LandingPage.CAF .landingTeam .line a { width: 125px; height: 45px; font-size: 18.5px; display: inline-block; position: relative; border-radius: 8px; font-family: droidBold, arial; line-height: 2.5; -moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #3b3b3b, 3px 3px rgba(0,0,0, .2); } .LandingPage.CAF .landingTeam .line.TeamOne a { color: #000; background: #d3d3d3; background: -moz-linear-gradient(top, #d3d3d3 0%, #9d9d9d 100%); background: -webkit-linear-gradient(top, #d3d3d3 0%,#9d9d9d 100%); background: linear-gradient(to bottom, #d3d3d3 0%,#9d9d9d 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d3d3d3', endColorstr='#9d9d9d',GradientType=0 ); } .LandingPage.CAF .landingTeam .line.TeamTwo a { background: #c30b0b; background: -moz-linear-gradient(top, #c30b0b 0%, #8b0c0c 100%); background: -webkit-linear-gradient(top, #c30b0b 0%,#8b0c0c 100%); background: linear-gradient(to bottom, #c30b0b 0%,#8b0c0c 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c30b0b', endColorstr='#8b0c0c',GradientType=0 ); color: #fff; } .LandingPage.CAF .shareGame { display: inline-block; position: absolute; bottom: 40px; left: 40px; width: 190px } .LandingPage.CAF .shareGame p { display: inline-block; width: 100%; font-family: droidLight, Arial; color: #fff; margin-bottom: 8px; text-align: center } .LandingPage.CAF .shareGame a.faceShare { display: inline-block; width: 30px; height: 30px; background-color: #0c88ef; border-radius: 50%; margin-left: 5px } .LandingPage.CAF .shareGame a.faceShare:before { content: 'b'; color: #fff; line-height: 1.8; } .LandingPage.CAF .shareGame a.twShare { display: inline-block; width: 30px; height: 30px; border-radius: 50%; background-color: #1da1f2 } .LandingPage.CAF .shareGame a.twShare:before { content: 'c'; color: #fff; line-height: 1.8 } .LandingPage.CAF .landingTeam .line a { width: 95px; height: 40px; } .LandingPage.CAF .landingTeam .line a img { display: none } .LandingPage.CAF .aqarLogo { display: inline-block; position: absolute; bottom: 50px; right: 50px; width: 120px } /*.LandingPage.CAF .aqarLogo*/ .LandingPage.CAF .aqarLogo a img { width: 100%; height: auto } /**plan selected*****/ .SquadInt .choose-team .plancontainer .container { margin-top: 0; background: none } .SquadInt .choose-team .plancontainer { padding: 15px 0; } .SquadInt .choose-team .plancontainer .plandorpdownbottom { position: relative; background-color: #000; width: 120px; height: 75px; float: right } .SquadInt .choose-team .plancontainer .plandorpdownbottom a { text-align: right; color: #08a6f0; font-family: droidLight, Arial; font-size: 14px; display: block; padding: 12px 15px; text-align: center; } .SquadInt .choose-team .plancontainer .plandorpdownbottom a .num { color: #08a6f0; font-family: Arial; font-weight: bold; font-size: 28px; } .SquadInt .choose-team .plancontainer .plandorpdownbottom a.selected { background-position: 16px -314px } .SquadInt .choose-team .plancontainer .plandorpdownbottom ul.otherplans { display: none; width: 880px; height: 74px; background-color: #000; position: absolute; right: 140px; top: 0; z-index: 10 } .SquadInt .choose-team .plancontainer .plandorpdownbottom ul.otherplans li { float: right; width: 130px; margin-left: 45px } .SquadInt .choose-team .plancontainer .plandorpdownbottom ul.otherplans li a { color: #fff; font-family: Arial; font-weight: bold; font-size: 28px; padding-top: 15px } .SquadInt .choose-team .plancontainer .plandorpdownbottom ul.otherplans li a:hover, .choose-team .plancontainer .plandorpdownbottom ul.otherplans li a.active { color: #18b4c3; } .SquadInt .choose-team .plancontainer .teamphotoscontainer { float: right; } .SquadInt .choose-team .plancontainer .teamphotoscontainer li { position: relative; overflow: hidden; float: right; width: 72px; height: 75px; margin-right: 8px; background-color: #000; border: 1px solid #EEE; } .SquadInt .choose-team .plancontainer .teamphotoscontainer li img { display: block; position: absolute; top: 0; max-width: 100%; height: 100%; left: 0px } .SquadInt .choose-team .plancontainer .teamphotoscontainer li a { display: block; height: 72px; position: absolute; top: 0; width: 72px; z-index: 10; } .SquadInt .choose-team .plancontainer .teamphotoscontainer li p { padding-top: 20px; width: 70px; text-align: center; color: #FFF; font-family: droidLight, Arial; font-size: 14px; } .SquadInt .choose-team .plancontainer .showteambtn { background-color: #a5d500; opacity: 0.6; color: #000; font-family: "Conv_GE_SS_TEXT_LIGHT"; font-size: 20px; display: block; width: 140px; height: 72px; text-align: center; border: 0 none; float: right; margin-right: 8px; } .SquadInt .choose-team .plancontainer .showteambtn.active { opacity: 1 } .SquadInt .choose-team .plancontainer .showteambtn p { margin: 10px auto 0; width: 115px; } .SquadInt .choose-team .plancontainer .image-mini { width: 72px; height: 75px; margin: 0; } .SquadInt .choose-team .plancontainer .teamphotoscontainer li:first-child p { padding-top: 10px; } .stats .ttl .more { display: none } .stats .item.matches ul li { height: 64px; padding: 8px 10px } .leftHP { float: left; width: 300px; display: inline-block; } .viewTabs { display: inline-block; float: right; width: 100%; position: relative; z-index: 2; } .tabsContainer { display: inline-block; float: right; width: 100%; position: relative } .tabs-nav { list-style: none; margin: 0; display: inline-block; float: right; width: 100%; position: relative; z-index: 2; } .tabs-nav > li { display: inline-block; position: relative; float: right; text-align: right; padding: 20px 40px; cursor: pointer; border-right: 1px solid #8b1538; border-left: 1px solid #8b1538; border-top: 1px solid #8b1538; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .tabs-nav > li > a { display: inline-block; color: #9f405c; float: right; position: relative; font-family: droidLight,Arial; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .tabs-nav .tabs-selected { border-right: 1px solid #bb335c; border-left: 1px solid #bb335c; border-top: 1px solid #bb335c; background: #810d2f; border-top-left-radius: 6px; border-top-right-radius: 6px; } .tabs-nav .tabs-selected > a { color: #eeeded } .tabs-nav > li > a p { display: inline-block; float: right; width: 100%; text-align: right; font-family: droidLight,Arial; font-size: 16px; transition: none; text-transform: uppercase; color: inherit; margin-bottom: 0 } .viewTabContainer { display: inline-block; float: right; position: relative; width: 100%; direction: rtl; z-index: 1; overflow: hidden; padding: 70px 40px 30px; border: 1px solid #bb335c; margin-top: -1px; background: #810d2f; border-top-left-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; } .tabs-container { display: inline-block; float: right; width: 100%; opacity: 1; visibility: visible; } .tabs-container.tabs-hide { opacity: 0; visibility: hidden; height: 0; } /************** ACN 2022 *************/ .tour2871.newPred .pagecnts { width: 1282px; margin: 0 calc((100% - 1282px) / 2) } @media screen and (min-width: 1360px) and (max-width: 1919px) { .tour2871.newPred .pagecnts { width: 1100px; margin: 0 calc((100% - 1100px) / 2) } } @media screen and (min-width: 1280px) and (max-width: 1359px) { .tour2871.newPred .pagecnts { width: 1100px; margin: 0 calc((100% - 1100px) / 2) } } @media screen and (min-width: 1024px) and (max-width: 1279px) { .tour2871.newPred .pagecnts { width: 800px; margin: 0 calc((100% - 800px) / 2) } } @media only screen and (max-width: 1023px) { .tour2871.newPred .pagecnts { width: 100%; margin: 0 } } /******************** Road To World Cup 2022 ********************/ .euroRoadToCup .Place3rd, .tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga .group { box-shadow: 0px 2px 4px 0px #0000001A;} .tour2871.roadToCupPage { /**** Colors ****/ --main-color: #0B4F3C; --secondary-color: #ff4605; --light-color: rgb(103 18 123); --border-color: #5a1d62; --text-color: #f1ead3; --active-color: #f6b90d; --dark-color: #5a066c; --oranged: #FD7301; } .tour2871 .euroPredCnts .tabs .regBtn.noImg .usericon { margin-top: 7px } .tour2871.roadToCupPage .container { background: #E8F0FF } .tour2871.roadToCupPage .content-wrap { width: 100% } .tour2871.roadToCupPage .content-wrap:before{display:none} .tour2871.roadToCupPage .euroRoadToCup.euroMain { overflow: hidden;padding:0;margin-bottom:0 } .tour2871.roadToCupPage .euroRoadToCup, .tour2871.roadToCupPage .content-wrap, .tour2871.roadToCupPage .content { background: none; min-height: calc(100vh - 50px) } .tour2871.roadToCupPage .viewTabContainer { background: #E8F0FF; border: none; padding: 0; overflow: visible; margin-top:0; } .tour2871.roadToCupPage .euroRoadToCup .title{padding: 60px ;background:#06073E;margin-bottom:0} .tour2871.roadToCupPage .euroRoadToCup .title h1 { color:#fff; line-height: 160px; padding: 0 120px 0 0; } .tour2871.roadToCupPage .euroRoadToCup .title h1:before { background: url(../../Images/Euro2024/RTCCup.png) no-repeat center center; background-size: 100% auto; width: 60px; height: 125px; z-index: 4; } .tour2871.roadToCupPage .euroRoadToCup .title h1:after { content:'';background: url(../../Images/Euro2024/RoadTocupTitle.png) no-repeat center center; background-size: 130px auto; width: 130px; height: 118px; z-index: 4; width: 345px; height: 118px;position: absolute;background-size: 100% auto;right: 170px;} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv { border: none; margin-bottom: 0;background:#FFFFFF;padding:0 64px 0 0} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv .breadcrumb {height:68px} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv .breadcrumb li{height:68px;background: none;margin: 0;line-height: 68px;width:auto;padding:0 64px} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv .breadcrumb li:first-child:before {content: '';position: absolute;width: 24px;height: 24px;background: url(../../Images/Euro2024/symbol.png);background-size:100%;top: 50%;transform: translateY(-50%);left: -12px;} .tour2871 .disabled{opacity:1} .tour2871.roadToCupPage .euroRoadToCup .breadcrumb li p { color:#4B4B4B ;line-height:68px;padding-right:0;font-size:16px;font-family:droidBold, Arial} .tour2871.roadToCupPage .euroRoadToCup .breadcrumb li.selected p {color:#0847B5;} .tour2871.roadToCupPage .euroRoadToCup .breadcrumb li span { border: none; background: var(--oranged); width: 25px; height: 25px; position: relative; text-align: center; transform: rotate(0deg); color: var(--text-color); line-height: 25px; border-radius: 0; } .tour2871.roadToCupPage .euroRoadToCup .breadcrumb li span {display:none} .tour2871.roadToCupPage .euroRoadToCup .breadcrumb li.disabled span { border: none; } .tour2871.roadToCupPage .euroRoadToCup .breadcrumb li span:before { content: ""; position: absolute; top: 0; left: 0; z-index: -1; height: 25px; width: 25px; background: var(--oranged); transform: rotate(135deg); } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer { display: flex; justify-content: space-between; align-items: center; float: none; width:100%; top:0; right:0;background:#06073E;height:auto ;padding-bottom:50px} .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .actionBtns { display: flex; flex-direction: row-reverse; gap: 20px;margin-left:30px } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav { display: flex;width: 660px;margin:0;border-top-left-radius:30px;border-bottom-left-radius:30px} .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav > li { position: relative; background: #D3E3FF; padding: 10px 20px; float: none; border: none; border-radius: 0; width: calc(100% / 2)!important; min-width: 100px; display: flex; justify-content: center; align-items: center; max-height: 60px; } .tour2871.roadToCupPage .tabs-nav > li:last-child:before{right:-13px;width: 26px;height: 26px;background-size: 100%;} .tour2871.roadToCupPage .tabs-nav > li:last-of-type{margin-right:0} .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav > li:first-of-type { border-left: none } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav > li a { color:#4B4B4B;line-height:60px} .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav > li:last-of-type:after { content: ''; position: absolute; left: -11px; top: 0; height: 45px; width: 50px;background: inherit } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav .tabs-selected {color:#0847B5;box-sizing: border-box; } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav li:hover > a, .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav .tabs-selected > a { color: #0847B5 } .tour2871.roadToCupPage .euroRoadToCup .groups .stageInfo h2 { display: none; } .tour2871.roadToCupPage .euroRoadToCup .groups .stageInfo p { color: #1E1E1E; } .tour2871.roadToCupPage .euroRoadToCup .shareGame .sharingMenu { left: unset; right: 0; z-index: 20; background: var(--text-color); width: 180px; } .tour2871.roadToCupPage .euroRoadToCup .shareGame .socialLink:before, .tour2871.roadToCupPage .euroRoadToCup .shareGame .socialLink p { color: var(--main-color) } .tour2871.roadToCupPage .euroRoadToCup .shareGame .socialLink { border-color: var(--main-color) } .tour2871.roadToCupPage .euroRoadToCup .shareGame .socialLink.faceShare:hover p, .tour2871.roadToCupPage .euroRoadToCup .shareGame .socialLink.faceShare:hover:before { color: #3b5998; } .tour2871.roadToCupPage .euroRoadToCup .shareGame .socialLink.twShare:hover p, .tour2871.roadToCupPage .euroRoadToCup .shareGame .socialLink.twShare:hover:before { color: #1da1f2; } .tour2871.roadToCupPage .euroRoadToCup .shareGame.openSharingMenu .icon-share:before, .tour2871.roadToCupPage .euroRoadToCup .shareGame.openSharingMenu .shareBtn p, .tour2871.roadToCupPage .euroRoadToCup .shareGame:hover .shareBtn p { color: #f1ead3 } .tour2871.roadToCupPage .euroRoadToCup .shareGame, .tour2871.roadToCupPage .euroRoadToCup .regBtn { width: 180px; position: relative; float: left; min-width: 100px; padding: 0; background:#EFCD1D;border-radius:21px; max-height: 40px; display: flex; align-items: center; justify-content: center;left:unset;bottom:unset} .tour2871.roadToCupPage .euroRoadToCup .shareGame p, .tour2871.roadToCupPage .euroRoadToCup .regBtn p {color:#FFF4DA} .tour2871.roadToCupPage .euroRoadToCup .shareGame .icon-share:before { color: #1E1E1E; transition: all 0.2s ease-in-out 0s; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; } .tour2871.roadToCupPage .euroRoadToCup .shareBtn p, .tour2871.roadToCupPage .euroRoadToCup .regBtn p { font-family: droidLight,Arial; font-size: 14px; line-height: 37px; color: #1E1E1E; } .tour2871.roadToCupPage .euroRoadToCup .regBtn p { line-height:60px;width: 100%;height: 60px;padding: 0 47px 0 34px; } .tour2871.roadToCupPage .euroRoadToCup .regBtn.icon-font p {padding:0 34px;font-family:droidBold, Arial} .tour2871.roadToCupPage .euroRoadToCup .groups .stageInfo{padding:30px 0} .tour2871.roadToCupPage .euroRoadToCup .groups { border: none;padding: 0 64px 32px; } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .GroupTeams { display: flex; justify-content: space-around; width: 100%; float: none; margin: 10px 0 20px; } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .GroupTeams li { margin-left: 0 } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group { width: calc((100% - 64px) / 3); height: fit-content; background:#D3E3FF; border:none} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group:nth-child(3n) { margin-left: 32px; margin-bottom: 32px; } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group:nth-child(3n), .tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga:nth-child(3n) .group { margin-left: 0 } .tour2871.roadToCupPage .euroRoadToCup .nextHint { bottom: 175px; color: #06073E; } .tour2871.roadToCupPage .euroRoadToCup .submitBtn { background:#06073E; color: #fff; position: relative;border-radius: 30px; width:200px;height:40px;line-height:40px} .tour2871.roadToCupPage .euroRoadToCup .submitBtn:before { content: ''; position: absolute; top: -150%; left: 50%; transform: translateX(-50%); background: url(../../Images/RoadToCup/pattern05.svg) no-repeat center; background-size: 100px auto; width: 100%; height: 100%; } .tour2871 .euroRoadToCup .groupTaples .sortingTeams li .DelBtn:hover { background-color: #D3E3FF } .tour2871.roadToCupPage .euroRoadToCup .shareGame .btn {padding: 0 60px;width: 100%;height: 40px;border:none;font-size:14px;font-family:droidBold, Arial;margin: 0 auto;color: #1E1E1E;background-color: #EFCD1D;position: relative;border-radius: 30px;float: right;line-height:40px;text-align: right;} .tour2871.roadToCupPage .euroRoadToCup .shareGame .btn.share-btn:before {content: '+';position: ABSOLUTE;top: 50%;transform: translateY(-50%);left: 50px;font-size: 13px;} .tour2871.roadToCupPage .euroRoadToCup .regBtn.icon-font:before {content: 'Q';position: ABSOLUTE;top: 8px;left: 24px;font-size: 14px;color: #1E1E1E;} @media screen and (min-width: 320px) and (max-width: 767px) { .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav { width:100%;border-radius:0} .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav > li { width: 100px; height: 25px; flex: 1;height: 50px!important; } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav > li:last-of-type:after { height: 25px; width: 15px; } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav > li a { font-size: 14px;line-height: 50px;} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv { margin-top:0; padding-bottom: 0;} /*Mobile footer*/ .tour2871.roadToCupPage .euroRoadToCup .footer { background: #0847B5;border-top:2px solid #EFCD1D;height:62px; position: fixed; bottom: 0; left: 0; z-index: 2; width: 100%; padding:10px; display: flex; flex-direction: row-reverse; gap: 10px; justify-content: space-between; align-content: center; } .tour2871.roadToCupPage .euroRoadToCup .footer img { height: auto; object-fit: contain; } .tour2871.roadToCupPage .euroRoadToCup .footer .actionBtns { display:inline-block;float:right;width:100% } .tour2871.roadToCupPage .euroRoadToCup .shareGame, .tour2871.roadToCupPage .euroRoadToCup .regBtn{width:calc((100% - 10px) / 2);bottom:0;position:relative;height:40px;float: left;margin-right: 10px;left:auto;right:auto;top:auto} .tour2871.roadToCupPage .euroRoadToCup .shareGame{margin-right:0} .tour2871.roadToCupPage .euroRoadToCup .shareGame .btn{padding:0 36px;font-size:13px;height:40px;line-height: 40px;} .tour2871.roadToCupPage .euroRoadToCup .shareGame .btn.share-btn:before{left:36px} .tour2871.roadToCupPage .euroRoadToCup .regBtn p{padding:0 18px;font-size:13px;height:40px;line-height:40px} .tour2871.roadToCupPage .euroRoadToCup .regBtn:before{left:18px} .tour2871.roadToCupPage .euroRoadToCup .regBtn.icon-font p{padding:0 15px} .tour2871.roadToCupPage .euroRoadToCup .regBtn.icon-font:before{top: 10px; left: 16px;} /*.tour2871.roadToCupPage .euroRoadToCup .footer .actionBtns .regBtn img { width: 30px; height: auto; margin-right: unset; } .tour2871.roadToCupPage .euroRoadToCup .shareGame { position: relative; bottom: 0; left: 0; right: 0; top: 0; } .tour2871.roadToCupPage .euroRoadToCup .shareGame .sharingMenu { bottom: 100%; top: unset; } .tour2871.roadToCupPage .euroRoadToCup .footer .actionBtns .shareGame, .tour2871.roadToCupPage .euroRoadToCup .footer .actionBtns .regBtn { float: none; transform: none; height: auto; width: 100px; min-width: unset; padding: 6px 12px; gap: 10px; } .tour2871.roadToCupPage .euroRoadToCup .footer .shareBtn p, .tour2871.roadToCupPage .euroRoadToCup .footer .regBtn p { font-size: 10px; flex: 1; line-height: 1; } .tour2871.roadToCupPage .euroRoadToCup .regBtn.noImg .usericon { width: 25px; height: 25px; } .tour2871.roadToCupPage .euroRoadToCup .regBtn.noImg .usericon:before { font-size: 18px; } .tour2871.roadToCupPage .euroRoadToCup .footer .shareGame .icon-share:before { font-size: 10px } .tour2871.roadToCupPage .euroRoadToCup .footer .shareGame .icon-share { display: flex; justify-content: center; flex-direction: row-reverse; align-items: center; }*/ .tour2871.roadToCupPage .euroRoadToCup .nextHint { bottom: 130px; } .tour2871.roadToCupPage .euroRoadToCup .title h1:after{left: 50%; bottom: -82px; transform: translateX(-50%);width: 255px; height: 71px;right:auto} } @media screen and (min-width: 320px) and (max-width: 1023px) { /*.tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga { width: 280px; padding-left: 16px }*/ .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group { width: 100%; margin-left: 0; margin-bottom: 16px; } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga:nth-child(3n) .group { margin-bottom: 16px; margin-left: 0; } .tour2871 .tabs-container.tabs-hide{padding-bottom:30px!important} } @media screen and (min-width: 1360px) and (max-width: 1439px) { .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group { margin-left: 32px; margin-bottom: 32px; } } @media screen and (min-width: 1024px) and (max-width: 1359px) { .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group { width: calc((100% - 32px) / 2); margin-left: 32px; margin-bottom: 32px; } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga:nth-child(2n) .group { margin-left: 0; margin-bottom: 32px; } } .tour2871.roadToCupPage .euroRoadToCup .groupTaples h3 { color:#0847B5} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .GroupTeams li { height: 78px } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .GroupTeams li span{ color:#1E1E1E;width:calc(100% + 20px);position: absolute;left:50%;bottom: -40px;height: 30px;line-height: 1.2;transform:translateX(-50%);opacity:1} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .GroupTeams li .imgCntnr { border:none;border-radius:0;padding-bottom: calc(100% - 4px);padding-bottom:62.5%;margin-bottom:10px;overflow:visible} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .GroupTeams li .imgCntnr img{height:50px} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .GroupStanding:before { background: none !important; } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li.hasteam, .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams { background:#084332} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li:nth-child(odd) {background: #E9F0FF;} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li:nth-child(even) {background: #D3E3FF;} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li { border-top:0} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li:first-of-type { border-top:none} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li .DelBtn:before, .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li .DelBtn:after { background: #0847B5; } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li.hasteam .TeamStanding, .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li .TeamName { color: #1E1E1E; } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li .imgCntnr { border-color: var(--text-color);height: 26px;border-radius: 0;border: 0;margin:7px 0 } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li .imgCntnr img { height:40px } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li .TeamStanding{color:#1E1E1E;} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li .TeamStanding:after{border-radius:0;height:26px;background:rgba(8, 71, 181, .3);} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(3) .imgCntnr { opacity: 0.2 } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(3) .TeamName, .tour2871 .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(4) .TeamName { opacity: 0.3 } .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(4) .TeamName .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li.hasteam:nth-child(3):after { position: absolute; left: 50px; top: 50%; transform: translateY(-50%); width: 14px; height: 2px; background: #aaa; } /** Knockout 2022**/ .tour2871.roadToCupPage .knockOutTab .allRounds { display: inline-block; float: right; width: 100%; margin-bottom: 16px;padding:30px 0 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem { display: inline-block; float: right; width: calc((100% - 224px) / 8); margin-left: 32px; position: relative } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem h3 { display: inline-block; float: right; width: 100%; margin-left: 0; padding: 6px 0; overflow: hidden; margin-bottom: 30px; font-family: droidBold,Arial; text-align: center; color:#0847B5; font-size: 13px; background:none } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem:last-child { margin-left: 0 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams { display: inline-block; float: right; width: 100%; position: relative } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .knockoutStage { display: inline-block; float: right; width: 100%; position: relative; z-index: 1 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData { display: inline-block; float: right; width: 100%; position: relative; margin-bottom: 2px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team { display: inline-block; float: right; position: relative; width: 100%; height: 48px; background: rgba(255,255,255,0.06); cursor: pointer; border-radius: 6px; overflow: hidden; pointer-events: none; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team .QualifierName { display: inline-block; float: right; width: calc(100% - 20px); font-family: droidLight, arial; text-align: right; color: #000; font-size: 11px; line-height: 24px; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); line-height: 1.6; direction: rtl; unicode-bidi: bidi-override; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData:last-child { margin-bottom: 0 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .teamData .team .QualifierName { text-align: right } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .teamData .team .QualifierName { text-align: left } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qlfyTeam .team .TeamName { color: #b3b3b3; opacity: 1 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qlfyTeam .team.selected .imgCntnr { opacity: 1 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qlfyTeam .team.selected .TeamName { color: inherit; opacity: 1 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qlfyTeam .team { opacity: 0.8 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qlfyTeam .team.selected { opacity: 1 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .team { padding: 12px 40px 12px 10px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .team { padding: 12px 10px 12px 40px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .CheckIn { right: 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .CheckIn { left: 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .TeamName { float: right; text-align: right; padding-right: 10px; right: 64px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .TeamName { float: left; text-align: left; padding-left: 10px; left: 64px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right img { float: right } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left img { float: left } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { position: absolute; width: calc(100% + 10px); height: 2px; top: 50%; transform: translateY(-50%); background: #b9d2ff } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .separating { right: 6px; left: auto } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .separating { left: 6px; right: auto } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .knockoutStage { margin-bottom: 16px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .knockoutStage:last-child { margin-bottom: 0 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .imgCntnr { display: inline-block; float: right; width: 24px; height: auto; position: relative; border-radius: 0; overflow: hidden; border: none; margin-bottom: 0px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams img { display: inline-block; width: 24px; height: auto; position: relative; transform: none; top: 0; left: 0 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .TeamName { display: inline-block; width: calc(100% - 74px); padding: 0; font-family: droidLight, arial; color: inherit; font-size: 11px; line-height: 1.2; position: absolute; top: 50%; transform: translateY(-50%) } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams { opacity: 1 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .teamData .team { padding: 12px 40px 12px 10px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams img { float: right; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .TeamName { float: right; text-align: right; padding-right: 10px; right: 64px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .teamData .team { padding: 12px 10px 12px 40px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams img { float: left; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .TeamName { float: left; text-align: left; padding-right: 0; padding-left: 10px; left: 64px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team:after { width: 24px; height: 16px; border-radius: 0; background: rgba(255,255,255,0.1) } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .teamData .team:after { right: 10px; left: auto } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .teamData .team:after { left: 10px; right: auto } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData.right .team:after { right: 10px; left: auto } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData.left .team:after { left: 10px; right: auto } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckIn { position: absolute; right: auto; left: auto; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; border-radius: 50%; border: 1px solid #aaa; text-align: center; color: var(--text-color); font-size: 12px; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckIn:hover { background: #EFCD1D } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .CheckIn { right: 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .CheckIn { left: 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckedIn:hover { background: #6a3273 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckedIn, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckedIn:hover{ border: none; background: #0847B5; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckedIn:before { content: "K"; line-height: 22px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .GroupName { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: #000; font-size: 12px; font-family: droidLight,Arial; text-align: right; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team.hasteam { pointer-events: unset } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team.hasteam { background:#D3E3FF; color:#1E1E1E; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team.hasteam .TeamStanding { color: #7187c6 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team.hasteam .TeamStanding:after { display: none } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team.hasteam:after { display: none } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams.second { padding: 57px 0 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams.second .knockoutStage { margin-bottom: 130px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams.second .knockoutStage:last-child { margin-bottom: 0 } .tour2871.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .second .teamData:first-child:before { width: 20px; display: block; right: auto; content: ''; position: absolute; border-right: none } .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before { right: -16px; border-right: 2px solid #b9d2ff; } .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before { left: -16px; border-left: 2px solid #b9d2ff; } .tour2871.roadToCupPage .knockOutTab .second .teamData:first-child:before { border-bottom: 2px solid #b9d2ff; bottom: -2px; height: 57px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; } .tour2871.roadToCupPage .knockOutTab .second .teamData:last-child:before { top: 0; height: 57px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams.third { padding: 171px 0 0; } .tour2871.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 20px; display: block; right: auto; content: ''; position: absolute; border-right: none } .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before { right: -16px; border-right: 2px solid #b9d2ff; } .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -16px; border-left: 2px solid #b9d2ff; } .tour2871.roadToCupPage .knockOutTab .third .teamData:first-child:before { border-bottom: 2px solid #b9d2ff; bottom: -2px; height: 114px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; } .tour2871.roadToCupPage .knockOutTab .third .teamData:last-child:before { top: 0; height: 114px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams.final { padding: 195px 0 210px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams.final .separating { width: calc(100% - 12px); display: none } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 96px) / 4); } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound .qualifiedTeams .teamData { width: calc((100% - 32px) / 2); margin-left: 32px; margin-bottom: 0; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound .qualifiedTeams .teamData:last-of-type { margin-left: 0 } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 16px; display: block; right: auto; border-right: none; content: ''; position: absolute; bottom: auto; top: 50%; transform: translateY(-50%); height: 2px; -webkit-box-sizing: initial; -moz-box-sizing: initial; box-sizing: initial; border-bottom: 2px solid #b9d2ff; } .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -16px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -16px; } .tour2871.roadToCupPage .euroRoadToCup .tabs-container p.hint { display: inline-block; float: right; width: 100%; text-align: center; font-family: droidLight, Arial; color: #0847B5; font-size: 18px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .tour2871.roadToCupPage .euroRoadToCup .Place3rd .thirdHeader{background:#D3E3FF} .tour2871.roadToCupPage .euroRoadToCup .Place3rd .bestThirds{background: #fff;} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li{border-top: 2px solid #D3E3FF;background:none} .tour2871.roadToCupPage .euroRoadToCup .Place3rd p{color:#1E1E1E} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .TeamStanding:after {border-radius: 0;height: 26px;background: #b9d2ff;} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .TeamName, .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .GroupName{color:#1E1E1E} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .imgCntnr {border-color: var(--text-color);height: 26px;border-radius: 0;border: 0;margin: 7px 0;} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .imgCntnr img {height: 40px;} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .CheckIn{border: 1px solid #0847B5} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .CheckIn:hover{background:#EFCD1D} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .CheckedIn{background:#0847B5;border: 1px solid #0847B5} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .CheckedIn:hover{background:#0847B5} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .CheckedIn:before{color:#fff} .tour2871.roadToCupPage .euroRoadToCup .Place3rd li .CheckedIn:before:hover{color:#fff} .tour2871.roadToCupPage .Place3rd li.select3rd:after{color:#06b281} /******************** Euro Winner ********************/ .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner { position: absolute; left: 0; top: 0; width: 100%; z-index: 0; height: 100% } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner h3 { display: inline-block; float: right; width: 100%; position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); font-family: droidBold,Arial; text-align: center; color:#0847B5; font-size: 18px; background: none; margin-bottom: 0; border-radius: 0; padding: 0 0 16px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner h3:after { display: none } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerImg { display: inline-block; position: absolute; top: auto; bottom: 100px; left: 50%; transform: translateX(-50%); border-radius: 0; text-align: center; width: 130px; height: 88px; background: #06073E; border: 1px solid #b9d2ff; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerImg:before { content: "?"; font-family: arial; font-weight: bold; line-height: 88px; font-size: 54px; color: #b9d2ff } /*.tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .selectWinner .cupWinner .winnerImg{display:none}*/ .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerHolder { position: absolute; top: auto; bottom: 100px; left: 50%; transform: translateX(-50%); text-align: center; width: 130px; height: 88px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerHolder .imgCntnr { display: inline-block; float: right; width: 100px; height: 100px; position: relative; margin: 0 calc((100% - 100px) / 2) 16px; border-radius: 50%; overflow: hidden; border: 2px solid #aaa; margin-bottom: 4px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerHolder img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: auto; max-width: unset; margin: 0 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerHolder .teamName { display: inline-block !important; float: right; width: 100%; font-family: droidBold, arial; text-align: center; color: #fff; font-size: 22px; line-height: 1.6; padding-right: 0 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerHolder span { width: 100%; right: 0; left: 0; top: auto; bottom: -34px; transform: none; font-size: 20px; text-align: center; font-family: droidBold, Arial; color: #0847b5; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .ShareLogin { display: none } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .ShareLogin a { display: inline-block; float: right; width: 100px; height: 40px; border-radius: 6px; overflow: hidden; background: #3b5998; margin: 32px 0 0; position: absolute; bottom: -20px; left: 50%; transform: translateX(-50%); right: auto; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .ShareLogin .cnts { width: 58px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-family: droidLight, Arial; font-size: 13px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .ShareLogin .cnts p { display: inline-block; float: right; color: #fff; font-family: droidLight, Arial; font-size: 13px; line-height: 2.6 } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .ShareLogin .cnts span { display: inline-block; float: right; margin-left: 6px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .ShareLogin .cnts span.icon-fb:before { content: "b"; font-size: 20px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .selectWinner .cupWinner .ShareLogin { display: inline-block } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams.final:before { content: ""; width: 100%; height: 230px; position: absolute; left: 50%; transform: translateX(-50%); top: 44px; background: url(../../Images/Euro2024/RTCCup.png) no-repeat center center; background-size: auto 100%; z-index: 2; pointer-events: none } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams.final .knockoutStage:before { display: none } .tour2871.roadToCupPage .euroRoadToCup .predHint { display: none; } .tour2871.roadToCupPage .euroRoadToCup .tab-title p { display: inline-block; float: right; width: 100%; color: var(--text-color); font-size: 16px; font-family: droidLight,Arial; text-align: right; padding: 0px 0 32px; } @media screen and (min-width:1536px) and (max-width:1599px) { .tour2871.roadToCupPage .euroRoadToCup { padding: 60px 50px } } @media screen and (min-width:1440px) and (max-width:1535px) { .tour2871.roadToCupPage .euroRoadToCup { padding: 60px 50px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2871.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } } @media screen and (min-width:1360px) and (max-width:1439px) { .tour2871.roadToCupPage .euroRoadToCup { padding: 60px 50px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2871.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } } @media screen and (min-width:1280px) and (max-width:1359px) { .tour2871.roadToCupPage .euroRoadToCup { padding: 60px 20px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2871.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } } @media screen and (min-width:1152px) and (max-width:1279px) { .tour2871.roadToCupPage .euroRoadToCup .title { padding: 0 32px } .tour2871.roadToCupPage .euroRoadToCup .groups { padding: 0 32px 32px; } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav { width: 600px } .tour2871.roadToCupPage .euroRoadToCup .title h1 { font-size: 40px } .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv { padding: 0 32px 0 0; } .tour2871 .euroPredCnts .FullWidthBK .euroHeader:before { width: 655px; background: url(../../Images/ACN/ACNpattern.png?ver=0.1) no-repeat left bottom; background-size: 100% auto; } .tour2773 .euroPredCnts .FullWidthBK .euroHeader:before { width: 655px; background: url(../../Images/ACN/ACNpattern.png?ver=0.1) no-repeat left bottom; background-size: 100% auto; } .tour2871.roadToCupPage .euroRoadToCup { padding: 60px 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2871.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem h3 { font-size: 11px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .teamData .team, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .team { padding: 12px 30px 12px 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .teamData .team, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .team { padding: 12px 6px 12px 30px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams img { width: 20px; margin-top: 2px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .TeamName { width: calc(100% - 60px); } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .TeamName, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .TeamName { right: 50px; padding-right: 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .TeamName, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .TeamName { left: 50px; padding-left: 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckIn { width: 16px; height: 16px; font-size: 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckedIn:before { line-height: 18px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .CheckIn, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .CheckIn { right: 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .CheckIn, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .CheckIn { left: 6px; } .tour2871.roadToCupPage .euroRoadToCup:after { width: 430px; height: 400px } } @media screen and (min-width:1024px) and (max-width:1151px) { .tour2871.roadToCupPage .euroRoadToCup .title{padding:0 32px} .tour2871.roadToCupPage .euroRoadToCup .groups{padding: 0 32px 32px;} .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav{width:540px} .tour2871.roadToCupPage .euroRoadToCup .title h1{font-size:34px} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv{padding: 0 32px 0 0;} .tour2871 .euroPredCnts .FullWidthBK .euroHeader:before { width: 650px; background: url(../../Images/ACN/ACNpattern.png?ver=0.1) no-repeat left bottom; background-size: 100% auto; } .tour2871.roadToCupPage .euroRoadToCup { padding: 60px 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2871.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem h3 { font-size: 11px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .teamData .team, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .team { padding: 12px 28px 12px 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .teamData .team, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .team { padding: 12px 6px 12px 28px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams img { width: 20px; margin-top: 2px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .TeamName { width: calc(100% - 54px); font-size: 10px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .TeamName, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .TeamName { right: 48px; padding-right: 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .TeamName, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .TeamName { left: 48px; padding-left: 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckIn { width: 16px; height: 16px; font-size: 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckedIn:before { line-height: 18px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .CheckIn, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .CheckIn { right: 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .CheckIn, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .CheckIn { left: 6px; } .tour2871.roadToCupPage .euroRoadToCup:after { width: 430px; height: 400px } } @media screen and (min-width: 768px) and (max-width: 1023px) { .tour2871 .euroPredCnts .FullWidthBK .euroHeader:before { width: 655px; background: url(../../Images/ACN/ACNpattern.png?ver=0.1) no-repeat left bottom; background-size: 100% auto; } .tour2871.roadToCupPage .euroRoadToCup { padding: 60px 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem h3 { font-size: 10px; height: 52px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team .QualifierName { font-size: 9px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2871.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner h3 { padding: 0; font-size: 12px; height: auto; line-height: 1.4; bottom: 22px; } .tour2871.roadToCupPage .viewTabContainer { padding: 50px 10px 30px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem h3 { font-size: 10px; line-height: 40px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem:nth-of-type(3) h3, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem:nth-of-type(5) h3 { line-height: normal } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .teamData .team, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .team { padding: 12px 28px 12px 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .teamData .team, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .team { padding: 12px 6px 12px 28px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams img { width: 20px; margin-top: 2px; display: none } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerHolder img, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .selectWinner .cupWinner .winnerImg { display: inline-block } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .TeamName { width: calc(100% - 28px); font-size: 10px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .TeamName, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .TeamName { right: 22px; padding-right: 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .TeamName, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .TeamName { left: 22px; padding-left: 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckIn { width: 16px; height: 16px; font-size: 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckedIn:before { line-height: 18px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .CheckIn, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .CheckIn { right: 6px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .CheckIn, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .CheckIn { left: 6px; } .tour2871.roadToCupPage .euroRoadToCup .title{padding:0 16px} .tour2871.roadToCupPage .euroRoadToCup .groups{padding: 0 16px 16px;} .tour2871.roadToCupPage .euroRoadToCup .title h1{font-size:40px} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv{padding: 0 16px 0 0;} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv .breadcrumb li:first-child{padding-right:0} .tour2871.roadToCupPage .euroRoadToCup:after { width: 430px; height: 400px } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav { width: 400px; background: transparent; } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav > li { width: 160px; } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer .tabs-nav > li:last-of-type:after { width: 20px; } .tour2871.roadToCupPage .euroRoadToCup .shareGame, .tour2871.roadToCupPage .euroRoadToCup .regBtn{width:140px} .tour2871.roadToCupPage .euroRoadToCup .shareGame .btn{padding:0 36px;font-size:13px} .tour2871.roadToCupPage .euroRoadToCup .shareGame .btn.share-btn:before{left:36px} .tour2871.roadToCupPage .euroRoadToCup .regBtn p{padding:0 18px;font-size:13px} .tour2871.roadToCupPage .euroRoadToCup .regBtn:before{left:18px} .tour2871.roadToCupPage .euroRoadToCup .nextHint{bottom:205px} } @media screen and (min-width: 320px) and (max-width: 767px) { .tour2871 .euroPredCnts .FullWidthBK .euroHeader:before { width: 325px; background: url(../../Images/ACN/ACNpattern.png?ver=0.1) no-repeat left bottom; background-size: 100% auto; } .tour2871.roadToCupPage .euroRoadToCup .tab-title p { padding: 16px 0 32px; } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem h3 { font-size: 11px; height: 38px; margin-bottom: 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team .QualifierName { font-size: 10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem { width: 180px; margin-left: 0; padding: 0 10px } /** margin x 7 **/ .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: 310px } /** margin * 3 **/ .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams.final:before { height: 170px; top: 80px } .tour2871.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2871.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2871.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerHolder, .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerImg { bottom: 120px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner h3 { padding: 0; font-size: 14px; height: auto; bottom: 50px } .tour2871.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .ShareLogin a { bottom: 0 } .tour2871.roadToCupPage .euroRoadToCup:before { background: url(../../Images/ACN2022/rtcPatternBG.svg) center center repeat; background-size: 100%; opacity: 0.1; } .tour2871.roadToCupPage .euroRoadToCup:after { width: 300px; height: 280px; opacity: 0.7; left: 40px } /* .tour2871.roadToCupPage .euroRoadToCup .title h1 {padding: 0 70px 0 0;}*/ .tour2871.roadToCupPage .euroRoadToCup .breadcrumb li { margin-left: 20px } .tour2871.roadToCupPage .euroRoadToCup .breadcrumb li:last-of-type { margin-left: 0 } .tour2871.roadToCupPage .euroRoadToCup .breadcrumb li p { font-size: 13px;width:100%;text-align:center} .tour2871.roadToCupPage .euroRoadToCup .breadcrumb li span { width: 26px; height: 26px; line-height: 26px } .tour2871.roadToCupPage .euroRoadToCup .flickity-button { display: inline-block; top: auto; bottom: -40px; background-color: var(--dark-color); } .tour2871.roadToCupPage .euroRoadToCup .flickity-button:before { color: var(--text-color); } } @media screen and (min-width: 320px) and (max-width: 767px) { .tour2871.roadToCupPage .euroRoadToCup .title{padding:0 10px 70px 10px} .tour2871.roadToCupPage .euroRoadToCup .title h1:before { background-size:100% auto; width: 40px;height:100px; top: 8px;left:50%;transform:translateX(-50%);right:auto } .tour2871.roadToCupPage .euroRoadToCup .tabsContainer{width:100%} .tour2871.roadToCupPage .euroRoadToCup .groups{padding: 0 10px 16px;} .tour2871.roadToCupPage .euroRoadToCup .title h1{font-size:25px;padding:0;text-align:center;line-height:250px} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv{padding: 0} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv .breadcrumb{width:100%} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv .breadcrumb li:first-child{padding-right:0} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv .breadcrumb li{padding:0;width:calc(100% / 2)} .tour2871.roadToCupPage .tabs-nav > li:last-child:before{display:none} .tour2871.roadToCupPage .euroRoadToCup .breadcrumbDiv .breadcrumb li:first-child:before{width:18px;height:18px;left:-9px} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .GroupTeams li{width:40px;height:68px} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .GroupTeams li .imgCntnr{width:40px} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .GroupTeams li .imgCntnr img{height:40px} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li .TeamStanding{font-size:18px;line-height:40px;margin-left: 10px;} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .sortingTeams li .TeamStanding:after{left:-50px} } /** Prediction **/ .tour2694 .euroPredCnts .FullWidthBK .euroHeader { background: linear-gradient(45deg,#5b0e25,#3b0818,#440a1c); } .tour2694 .euroPredCnts .FullWidthBK .euroHeader:before { left: 0; top: auto; bottom: 0; width: 1150px; background: url(../../Images/ArabCup/predArabCup.png) no-repeat left -200px bottom -180px; background-size: 100% auto; opacity: 0.6; } .tour2694 .euroPredCnts .FullWidthBK .euroHeader:after { display: none } .tour2694 .euroPredCnts .tabs .regBtn { position: absolute } .tour2694 .euroPredCnts .FullWidthBK h1 { color: #fff; } .tour2694 .euroPredCnts .tabs a { color: #fff; } .tour2694 .euroPredCnts .tabs a.active, .tour2694 .euroPredCnts .tabs a:hover { color: #e6be71; } .tour2694 .euroPredCnts .tabs a.active:after, .tour2694 .euroPredCnts .tabs a:hover:after { background: #e6be71; } .tour2694 .euroPredCnts .tabs .regBtn:hover p { color: #e6be71; } .tour2694 .euroPredCnts .predictionCnts .tourTitle .shape { background: #8b1538 } .tour2694 .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::before, .tour2694 .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::after, .tour2694 .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::before, .tour2694 .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::after { background: #e6be71; } /*.tour2694 .euroPredCnts .predictionCnts .matchData .predStatus{border:1px solid #e6be71}*/ .tour2694 .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points, .tour2694 .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points span { color: #e6be71 } .tour2694 .euroPredCnts .item .matchPrediction .teamScoring:hover p, .tour2694 .euroPredCnts .item .matchPrediction .teamScoring.select p { color: #e6be71; } .tour2694 .euroPredCnts .item .matchPrediction .value-button:hover { background: #e6be71; } .tour2694 .euroMain .predEP .groupTtl a:hover { color: #e6be71; } .tour2694 .euroPredCnts .predHint .regBtn, .euroRoadToCup .predHint .regBtn { background: #8b1538 } /** choose league **/ .chooseLeague { display: inline-block; width: 100%; float: right; position: relative; margin-bottom: 30px } .chooseLeague p.text { display: inline-block; width: 100%; float: right; font-size: 34px; font-family: droidBold, Arial; color: #fff; float: right; margin-bottom: 20px; text-align: center } .chooseLeague ul { display: inline-block; width: auto; margin: 0 auto } .chooseLeague ul li { display: inline-block; position: relative; width: 300px; margin-left: 30px; float: right; background: rgba(255,255,255,0.1); border-radius: 20px; margin-bottom: 10px; height: 200px; transition: all .2s ease-in 0s; -webkit-transition: all .2s ease-out 0s; -ms-transition: all .2s ease-in-out 0s; -moz-transition: all .2s ease-in-out 0s; -o-transition: all .2s ease-in-out 0s; } .chooseLeague ul li a { display: inline-block; width: 100%; height: 100%; float: right; padding: 10px } .chooseLeague ul li:nth-of-type(6n) { margin-left: 0 } .chooseLeague ul li:hover, .chooseLeague ul li.select { background-color: #444 } .chooseLeague ul li img { display: inline-block; width: auto; height: 100px; position: absolute; top: 20px; left: 50%; transform: translateX(-50%) } .chooseLeague ul li p { display: inline-block; float: left; width: 100%; color: #fff; font-size: 16px; font-family: droidLight, Arial; margin-top: 132px; text-align: center; line-height: 1.6 } .chooseLeague ul li:last-of-type { margin-left: 0 } /** landingPage **/ .landingPage .chooseLeague { margin: 20px 0 } .newPred .euroPredCnts .FullWidthBK .euroHeader { background: linear-gradient(45deg,#000d2d,#000c2c); } .newPred .euroPredCnts .FullWidthBK .euroHeader:before { left: 0; top: auto; bottom: 0; width: 800px; background: url(../../Images/ACN2022/generalPattern.png) no-repeat left -4px bottom -80px; opacity: 1; background-size: 100% auto; } .newPred .euroPredCnts .FullWidthBK .euroHeader:after { display: none } .newPred .euroPredCnts .FullWidthBK h1, .newPred .euroPredCnts .FullWidthBK h2 { color: #fff } .newPred .euroPredCnts .tabs a.active, .newPred .euroPredPage .tabs a:hover { color: #4bc2ff } .newPred .euroPredCnts .tabs .regBtn:hover p { color: #4bc2ff } .newPred .euroPredCnts .predHint .regBtn, .newPred .euroRoadToCup .predHint .regBtn { background-color: #00326f } .newPred .LoaderLogin { background-color: #00326f; border-radius: 6px } .newPred .RulesMsg ul.subpoint li label span { color: #4bc2ff } .newPred .RulesMsg ul.subpoint li label span.joker { color: #000 } .newPred .u-form-group button, .newPred .u-form-group .Compelete, .newPred .u-form-group .SigninBtn, .newPred .u-form-group .SignupBtn { background-color: #00326f } .newPred .euroPredCnts .predictionCnts .tourTitle .shape { background: #00326f } .newPred .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::before, .newPred .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::after, .newPred .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::before, .newPred .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::after { background: #4bc2ff; } .newPred .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points, .newPred .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points span { color: #4bc2ff } .newPred .euroPredCnts .item .matchPrediction .teamScoring:hover p, .newPred .euroPredCnts .item .matchPrediction .teamScoring.select p { color: #4bc2ff; } .newPred .euroPredCnts .item .matchPrediction .value-button:hover { background: #00326f; } .newPred .euroMain .predEP .groupTtl a:hover { color: #4bc2ff; } .newPred .euroMain.olympic .tabs a.active, .newPred .euroMain .tabs a:hover { color: #4bc2ff; } .newPred .euroMain .predEP .groupTtl h3 { color: #fff } .newPred.tour-1 .FullWidthBK .pagecnts { padding: 20px 0 } .newPred.tour-1 .euroPredCnts .FullWidthBK h1:first-child { bottom: 0 } /** Prediction - Premier League **/ .tour2697 .euroPredCnts .FullWidthBK .euroHeader { background: linear-gradient(270deg,#1b051d,#360d39) } .tour2697 .euroPredCnts .FullWidthBK .euroHeader:before { right: auto; top: 0; left: 0; bottom: auto; width: 100%; height: 100%; background: url(../../Images/ACN/pattern.png) no-repeat center top; background-size: 100%; opacity: 1; pointer-events: none; z-index: 0 } .tour2697 .euroPredCnts .FullWidthBK .euroHeader:after { display: none } .tour2697 .euroPredCnts .tabs .regBtn { position: absolute } .tour2697 .euroPredCnts .FullWidthBK h1 { color: #fff; } .tour2697 .euroPredCnts .tabs a { color: #fff; } .tour2697 .euroPredCnts .tabs a.active, .tour2697 .euroPredCnts .tabs a:hover { color: #00ff87; } .tour2697 .euroPredCnts .tabs a.active:after, .tour2697 .euroPredCnts .tabs a:hover:after { background: #37003c; } .tour2697 .euroPredCnts .tabs .regBtn:hover p { color: #00ff87; } .tour2697 .euroPredCnts .predictionCnts .tourTitle .shape { background: #37003c } .tour2697 .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::before, .tour2697 .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::after, .tour2697 .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::before, .tour2697 .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::after { background: #00ff87; } /*.tour2694 .euroPredCnts .predictionCnts .matchData .predStatus{border:1px solid #e6be71}*/ .tour2697 .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points, .tour2697 .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points span { color: #00ff87 } .tour2697 .euroPredCnts .item .matchPrediction .teamScoring:hover p, .tour2697 .euroPredCnts .item .matchPrediction .teamScoring.select p { color: #00ff87; } .tour2697 .euroPredCnts .item .matchPrediction .value-button:hover { background: #37003c; } .tour2697 .euroMain .predEP .groupTtl a:hover { color: #00ff87; } .tour2697 .euroPredCnts .predHint .regBtn, .euroRoadToCup .predHint .regBtn { background: #37003c; color: #fff } .tour2697 .leftLeagues .buttons a.create { background-color: #37003c; border: 1px solid #37003c } .tour2697 .RulesMsg ul.subpoint li label span { color: #37003c } .tour2697 .RulesMsg ul.subpoint li label span.joker { color: #000 } .tour2697 .LoaderLogin { border-radius: 6px } .tour2697 .LoaderLogin, .tour2697 .u-form-group .SigninBtn { background-color: #37003c } .tour2697.newPred .euroMain .FullWidthBK .tabs { padding: 20px 0 !important } .tour2697 .euroMain .predEP .groupTtl h3 { color: #fff } .tour2697.newPred .FullWidthBK .pagecnts { padding: 0 } .tour2727 .euroPredCnts .FullWidthBK .euroHeader { background: linear-gradient(270deg,#0b3a26,#1e4e36) } .tour2727 .euroPredCnts .FullWidthBK .euroHeader:before { left: 0; top: auto; bottom: 0; width: 660px; background: url(../../Images/ACN/ACNpattern.png?ver=0.1) no-repeat left bottom; background-size: 100% auto; } .tour2727 .euroPredCnts .FullWidthBK .euroHeader:after { display: none } .tour2727 .euroPredCnts .FullWidthBK h1 { color: #fff } .tour2727.newPred .FullWidthBK .pagecnts { padding: 20px 0 } .tour2727 .euroPredCnts .tabs a.active, .tour2727 .euroPredPage .tabs a:hover { color: #e6be71 } .tour2727 .euroPredCnts .tabs .regBtn:hover p { color: #e6be71 } .tour2727 .euroPredCnts .predHint .regBtn { background-color: #1e4e36 } .tour2727 .LoaderLogin { background-color: #1e4e36; border-radius: 6px } .tour2727 .RulesMsg ul.subpoint li label span { color: #e6be71 } .tour2727 .RulesMsg ul.subpoint li label span.joker { color: #000 } .tour2727 .u-form-group button, .tour2727 .u-form-group .Compelete, .tour2727 .u-form-group .SigninBtn, .tour2727 .u-form-group .SignupBtn { background-color: #1e4e36 } .tour2727 .euroPredCnts .predictionCnts .tourTitle .shape { background: #1e4e36 } .tour2727 .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::before, .tour2727 .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::after, .tour2727 .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::before, .tour2727 .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::after { background: #e6be71; } .tour2727 .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points, .tour2727 .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points span { color: #e6be71 } .tour2727 .euroPredCnts .item .matchPrediction .teamScoring:hover p, .tour2727 .euroPredCnts .item .matchPrediction .teamScoring.select p { color: #e6be71; } .tour2727 .euroPredCnts .item .matchPrediction .value-button:hover { background: #1e4e36; } .tour2727 .euroMain .predEP .groupTtl a:hover { color: #e6be71; } .tour2727 .euroMain.olympic .tabs a.active, .tour2727 .euroMain .tabs a:hover { color: #e6be71; } .tour2727 .euroMain .predEP .groupTtl h3 { color: #fff } .tour2727 .leftLeagues .buttons a.create { background-color: #1e4e36; border: 1px solid #1e4e36; } .tour2730 .euroPredCnts .FullWidthBK .euroHeader { background: linear-gradient(270deg,#2e2f6a,#20184f) } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { right: auto; top: 0; left: 0; bottom: auto; width: 100%; height: 100%; background: url(../../Images/EgyptionLeague.png) no-repeat left -7% top 18%; background-size: 23%; opacity: 1; pointer-events: none; z-index: 0 } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:after { display: none } .tour2730 .euroPredCnts .tabs .regBtn { position: absolute } .tour2730 .euroPredCnts .FullWidthBK h1 { color: #fff; } .tour2730 .euroPredCnts .tabs a { color: #fff; } .tour2730 .euroPredCnts .tabs a.active, .tour2730 .euroPredCnts .tabs a:hover { color: #4bc2ff; } .tour2730 .euroPredCnts .tabs a.active:after, .tour2730 .euroPredCnts .tabs a:hover:after { background: #2e2f6a; } .tour2730 .euroPredCnts .tabs .regBtn:hover p { color: #4bc2ff; } .tour2730 .euroPredCnts .predictionCnts .tourTitle .shape { background: #2e2f6a } .tour2730 .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::before, .tour2730 .euroPredCnts .predictionCnts .accordionItem .matchData:hover span.icon-plus::after, .tour2730 .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::before, .tour2730 .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus::after { background: #4bc2ff; } .tour2730 .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points, .tour2730 .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points span { color: #4bc2ff } .tour2730 .euroPredCnts .item .matchPrediction .teamScoring:hover p, .tour2730 .euroPredCnts .item .matchPrediction .teamScoring.select p { color: #4bc2ff; } .tour2730 .euroPredCnts .item .matchPrediction .value-button:hover { background: #2e2f6a; } .tour2730 .euroMain .predEP .groupTtl a:hover { color: #4bc2ff; } .tour2730 .euroPredCnts .predHint .regBtn, .euroRoadToCup .predHint .regBtn { background: #2e2f6a; color: #fff } .tour2730 .leftLeagues .buttons a.create { background-color: #2e2f6a; border: 1px solid #2e2f6a } .tour2730 .RulesMsg ul.subpoint li label span { color: #2e2f6a } .tour2730 .RulesMsg ul.subpoint li label span.joker { color: #000 } .tour2730 .LoaderLogin { border-radius: 6px } .tour2730 .LoaderLogin, .tour2730 .u-form-group .SigninBtn { background-color: #2e2f6a } .tour2730.newPred .euroMain .FullWidthBK .tabs { padding: 20px 0 !important } .tour2730 .euroMain .predEP .groupTtl h3 { color: #fff } .tour2730.newPred .FullWidthBK .pagecnts { padding: 0 } @media screen and (min-width:1680px) and (max-width:1919px) { .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { background-size: 25%; } } @media screen and (min-width:1600px) and (max-width:1679px) { .RulesMsg .lb-header { margin-bottom: 12px } .RulesMsg ul li { margin-bottom: 10px } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { background: url(../../Images/EgyptionLeague.png) no-repeat left -9% top 18%; background-size: 28%; } } @media screen and (min-width:1536px) and (max-width:1599px) { .tour2727.roadToCupPage .euroRoadToCup { padding: 60px 50px } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { background: url(../../Images/EgyptionLeague.png) no-repeat left -9% top 18%; background-size: 28%; } } @media screen and (min-width:1440px) and (max-width:1535px) { .tour2727.roadToCupPage .euroRoadToCup { padding: 60px 50px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2727.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { background: url(../../Images/EgyptionLeague.png) no-repeat left -9% top 18%; background-size: 31%; } } @media screen and (min-width:1360px) and (max-width:1439px) { .tour2727.roadToCupPage .euroRoadToCup { padding: 60px 50px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2727.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { background: url(../../Images/EgyptionLeague.png) no-repeat left -11% top 18%; background-size: 33%; } } @media screen and (min-width:1280px) and (max-width:1359px) { .tour2727.roadToCupPage .euroRoadToCup { padding: 60px 20px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2727.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .chooseLeague ul li { width: 250px } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { background: url(../../Images/EgyptionLeague.png) no-repeat left -11% top 18%; background-size: 35%; } } @media screen and (min-width:1152px) and (max-width:1279px) { .newPred .euroPredCnts .FullWidthBK .euroHeader:before { width: 730px; background: url(../../Images/ACN2022/generalPattern.png) no-repeat left -14px bottom -60px; background-size: 100% auto; } .tour2727 .euroPredCnts .FullWidthBK .euroHeader:before { width: 655px; background: url(../../Images/ACN/ACNpattern.png?ver=0.1) no-repeat left bottom; background-size: 100% auto; } .tour2727.roadToCupPage .euroRoadToCup { padding: 60px 10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2727.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem h3 { font-size: 11px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .teamData .team, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .team { padding: 12px 30px 12px 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .teamData .team, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .team { padding: 12px 6px 12px 30px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams img { width: 20px; margin-top: 2px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .TeamName { width: calc(100% - 60px); } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .TeamName, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .TeamName { right: 50px; padding-right: 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .TeamName, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .TeamName { left: 50px; padding-left: 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckIn { width: 16px; height: 16px; font-size: 10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckedIn:before { line-height: 18px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .CheckIn, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .CheckIn { right: 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .CheckIn, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .CheckIn { left: 6px; } .tour2727.roadToCupPage .euroRoadToCup:after { width: 430px; height: 400px } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { background: url(../../Images/EgyptionLeague.png) no-repeat left -11% top 18%; background-size: 36%; width: 100% } } @media screen and (min-width:1024px) and (max-width:1151px) { .newPred .euroPredCnts .FullWidthBK .euroHeader:before { width: 730px; background: url(../../Images/ACN2022/generalPattern.png) no-repeat left -14px bottom -60px; background-size: 100% auto; } .tour2727 .euroPredCnts .FullWidthBK .euroHeader:before { width: 650px; background: url(../../Images/ACN/ACNpattern.png?ver=0.1) no-repeat left bottom; background-size: 100% auto; } .tour2727.roadToCupPage .euroRoadToCup { padding: 60px 10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2727.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .tour2727.roadToCupPage .viewTabContainer { padding: 50px 20px 30px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem h3 { font-size: 11px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .teamData .team, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .team { padding: 12px 28px 12px 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .teamData .team, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .team { padding: 12px 6px 12px 28px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams img { width: 20px; margin-top: 2px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .TeamName { width: calc(100% - 54px); font-size: 10px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .TeamName, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .TeamName { right: 48px; padding-right: 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .TeamName, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .TeamName { left: 48px; padding-left: 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckIn { width: 16px; height: 16px; font-size: 10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckedIn:before { line-height: 18px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .CheckIn, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .CheckIn { right: 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .CheckIn, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .CheckIn { left: 6px; } .tour2727.roadToCupPage .euroRoadToCup:after { width: 430px; height: 400px } } @media screen and (min-width: 768px) and (max-width: 1023px) { .newPred .euroPredCnts .FullWidthBK .euroHeader:before { width: 730px; background: url(../../Images/ACN2022/generalPattern.png) no-repeat left -14px bottom -60px; background-size: 100% auto; } .tour2727 .euroPredCnts .FullWidthBK .euroHeader:before { width: 655px; background: url(../../Images/ACN/ACNpattern.png?ver=0.1) no-repeat left bottom; background-size: 100% auto; } .tour2727.roadToCupPage .euroRoadToCup { padding: 60px 10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem h3 { font-size: 10px; height: 52px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team .QualifierName { font-size: 9px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem { width: calc((100% - 140px) / 8); margin-left: 20px } /** margin x 7 **/ .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: calc((100% - 60px) / 4) } /** margin * 3 **/ .tour2727.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner h3 { padding: 0; font-size: 12px; height: auto; line-height: 1.4; bottom: 22px; } .tour2727.roadToCupPage .viewTabContainer { padding: 50px 10px 30px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem h3 { font-size: 10px; line-height: 40px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem:nth-of-type(3) h3, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem:nth-of-type(5) h3 { line-height: normal } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .teamData .team, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .team { padding: 12px 28px 12px 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .teamData .team, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .team { padding: 12px 6px 12px 28px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams img { width: 20px; margin-top: 2px; display: none } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerHolder img, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .selectWinner .cupWinner .winnerImg { display: inline-block } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .TeamName { width: calc(100% - 28px); font-size: 10px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .TeamName, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .TeamName { right: 22px; padding-right: 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .TeamName, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .TeamName { left: 22px; padding-left: 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckIn { width: 16px; height: 16px; font-size: 10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .CheckedIn:before { line-height: 18px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.right .qualifiedTeams .CheckIn, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.right .CheckIn { right: 6px; } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.left .qualifiedTeams .CheckIn, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .final.qualifiedTeams .teamData.left .CheckIn { left: 6px; } .tour2727.roadToCupPage .euroRoadToCup:after { width: 430px; height: 400px } } @media screen and (min-width: 320px) and (max-width: 767px) { .newPred .euroPredCnts .FullWidthBK .euroHeader:before { width: 290px; background: url(../../Images/ACN2022/generalPattern.png) no-repeat left bottom -19px; background-size: 100% auto; } .tour2727 .euroPredCnts .FullWidthBK .euroHeader:before { width: 325px; background: url(../../Images/ACN/ACNpattern.png?ver=0.1) no-repeat left bottom; background-size: 100% auto; } .tour2727.roadToCupPage .euroRoadToCup { padding: 80px 10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem h3 { font-size: 11px; height: 38px; margin-bottom: 10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .teamData .team .QualifierName { font-size: 10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem { width: 150px; margin-left: 0; padding: 0 10px } /** margin x 7 **/ .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem.finalRound { width: 310px } /** margin * 3 **/ .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams.final:before { height: 170px; top: 80px } .tour2727.roadToCupPage .knockOutTab .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .third .teamData:first-child:before { width: 14px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.right .third .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { right: -10px } .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .second .teamData:first-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .roundItem.left .third .teamData:first-child:before { left: -10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before, .tour2727.roadToCupPage .knockOutTab .final .teamData:first-child:before { width: 10px } .tour2727.roadToCupPage .knockOutTab .final .teamData:last-child:before { left: -10px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerHolder, .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .winnerImg { bottom: 120px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner h3 { padding: 0; font-size: 14px; height: auto; bottom: 50px } .tour2727.roadToCupPage .knockOutTab .allRounds .roundItem .cupWinner .ShareLogin a { bottom: 0 } .tour2727.roadToCupPage .euroRoadToCup:before { background: url(../../Images/ACN2022/rtcPatternBG.svg) center center repeat; background-size: 100%; opacity: 0.1; } .tour2727.roadToCupPage .euroRoadToCup:after { width: 300px; height: 280px; opacity: 0.7; left: 40px } .tour2727.roadToCupPage .euroRoadToCup .title h1 { padding: 0 70px 0 0; } .tour2727.roadToCupPage .euroRoadToCup .breadcrumb li { margin-left: 20px } .tour2727.roadToCupPage .euroRoadToCup .breadcrumb li:last-of-type { margin-left: 0 } .tour2727.roadToCupPage .euroRoadToCup .breadcrumb li p { font-size: 12px; line-height: 26px } .tour2727.roadToCupPage .euroRoadToCup .breadcrumb li span { width: 26px; height: 26px; line-height: 26px } .tour2727.roadToCupPage .euroRoadToCup .flickity-button { display: inline-block; top: auto; bottom: -40px } .tour2727.roadToCupPage .euroRoadToCup .flickity-button:before { color: #143670 } } /** Ahly Vs. Zamalek Final Match Media **/ @media screen and (min-width:1680px) and (max-width:1919px) { .LandingPage.CAF .landingTeam .line a { width: 115px; height: 40px; font-size: 17px; } .cafLgFinal .championSponsor .desktop img { width: 100px } /*.proPlayer .featuredArea .pattern2 ul li:first-child, .proPlayer .importantPlayer ul li:first-child{height:340px} .proPlayer .featuredArea .pattern2 ul li, .proPlayer .importantPlayer ul li{height:calc((341px - 32px) /3)} .proPlayer .featuredArea .pattern2 ul li a .imageCntnr, .proPlayer .importantPlayer ul li a .imageCntnr {width:153px} .proPlayer .featuredArea .pattern2 li .desc, .proPlayer .importantPlayer li .desc{width:calc(100% - 153px)} .proPlayer .featuredArea .pattern2 ul li.video .secName{right:128px}*/ /* .proPlayer .featuredArea .pattern2 ul li{width:calc((100% - 132.1px)/ 2)}*/ .proPlayer .featuredArea .pattern2 ul li.video .secName { right: 141px } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((166px * 67) / 100); width: 166px; } .proPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 166px) } .proPlayer .playerInfo .personalInfo ul li:last-child { border-bottom: 0 } .proPlayer .importantPlayer ul li:first-child { width: calc(100% - ((100% - 64px)/ 2)) } .proPlayer .importantPlayer ul li { width: calc((100% - 96.1px)/ 2) } .proPlayer .importantPlayer ul li a .imageCntnr { width: 165px; padding-bottom: calc((165px * 67) / 100) } .proPlayer .importantPlayer li .desc { width: calc(100% - 165px) } .euroMain .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 53px)/ 2)) !important } .euroMain .featuredArea .pattern2 ul li { width: calc((100% - 85.1px)/ 2) !important; } .euroMain .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .euroMain .featuredArea .pattern2 li .desc { width: calc(100% - 117px) } .euroMain .featuredArea .pattern2 ul li .desc p { font-size: 14px; max-height: 44px } .euroMain .featuredArea .pattern2 ul li:first-child .desc p { font-size: 19px } .euroMain .importantPlayer .pattern2 ul li:first-child { width: calc(100% - ((100% - 53px)/ 2)) !important } .euroMain .importantPlayer .pattern2 ul li { width: calc((100% - 85.1px)/ 2) !important; } .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .euroMain .importantPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 117px) } .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName { right: 128px } .euroMain .importantPlayer .pattern2 ul li .desc p { font-size: 14px; max-height: 44px } .LandingPage.CAF, .euroSquad .LandingPage.CAF, .chseSqMain.legendsSquad, .chseSqMain.chooseTeam { padding-bottom: 61% } .euroSquad .chseTtl { width: calc(100% - 940px); right: 100px; } .chseSqMain .allForms { bottom: 110px !important } .euroSquadPage .chseSqMain .sponsors { left: 60px } .euroInner .articleSocial.euroSocial.fixed { right: 22.3% } .euroMain .FullWidthBK .euroHeader { background-position: 122% 71%,6%,38% 110%; background-size: 50%, auto, 28%; } .euroInner article .maxWidth { width: 600px; margin: 0 calc((100% - 600px) /2); } .euroInner .matchcenter .maxWidth { width: 600px; margin: 0 calc((100% - 600px)/ 2) } .tour2694 .euroRoadToCup .title h1 { font-size: 40px } .olympicStrip .euroMain .FullWidthBK .euroHeader { background-position: -25%; background-size: 59% } /*new gutter*/ article.videoTemp .pattern1 ul li, article.albumTemp .pattern1 ul li { width: calc((100% - 20.1px) / 2) } article.videoTemp .pattern1 ul li:nth-child(3n), article.albumTemp .pattern1 ul li:nth-child(3n) { margin-left: 20px } article.videoTemp .pattern1 ul li:nth-child(2n), article.albumTemp .pattern1 ul li:nth-child(2n) { margin-left: 0 } .proPlayer .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 60px) / 2)) } .proPlayer .featuredArea .pattern2 ul li { width: calc((100% - 92.1px) / 2); } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .proPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 117px); position: absolute; left: 0; right: auto; padding: 8px 16px; } .proPlayer .featuredArea .pattern2 ul li .desc p { font-size: 14px; max-height: 44px; } .proPlayer .featuredArea .pattern2 ul li:first-child .desc p { font-size: 19px; } .proPlayer .featuredArea .pattern2 ul li.video .secName { right: 92px } .proPlayer .featuredArea .pattern2 ul li .desc .date { margin-top: 6px } .proPlayer .featuredArea .desc.khas p:before { margin-top: 0 } .proPlayer .importantPlayer ul li:first-child { width: calc(100% - ((100% - 83px) / 2)) } .proPlayer .importantPlayer ul li { width: calc((100% - 115.1px) / 2); } .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .proPlayer .importantPlayer ul li .desc { width: calc(100% - 117px); position: absolute; left: 0; right: auto; padding: 8px 16px; } .proPlayer .importantPlayer ul li .secName, .proPlayer .importantPlayer ul li.video .secName { right: 92px; } .proPlayer .importantPlayer ul li .desc p { font-size: 14px; max-height: 44px; } .proPlayer .importantPlayer ul li:first-child .desc p { font-size: 19px } .matchesCenter .toursDropdown, .matchesCenter .matchesNow { width: 120px } .cd-gallery li .tv { max-width: 110px } .standing .table .wRow .item p { font-size: 13px } .standing .table .wRow .item:nth-child(2), .standing .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 520px) } .standing .table .wRow .item, .standing .table .ttlRow .itemTtl { width: 50px; } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: calc(100% - 370px); } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { width: calc(100% - 60px); font-size: 12px } .euroPredCnts .predictionCnts .matchData .predStatus { width: 80px } .euroPredCnts .predictionCnts .matchData .predStatus .status { font-size: 11px; line-height: 2.8; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { font-size: 13px; margin-right: 4px; line-height: 2.2; } .euroPredCnts .item .matchPrediction .team { width: calc((100% - 60px) / 2) } .euroPredCnts .item .matchPrediction .team.team1 { padding-left: 50px; } .euroPredCnts .item .matchPrediction .team.team2 { padding-right: 50px; } .euroPredCnts .item .matchPrediction .dash { width: 60px } .euroPredCnts .predictionCnts .saveHint { width: 1100px } } @media screen and (min-width:1600px) and (max-width:1679px) { .LandingPage.CAF .landingTeam { width: 52% } .LandingPage.CAF .landingTeam .line a { width: 115px; height: 40px; font-size: 17px; } .cafLgFinal .championSponsor .desktop img { width: 85px; } .cafLgFinal .championSponsor .desktop .todo { left: 3% } /*.proPlayer .featuredArea .pattern2 ul li:first-child, .proPlayer .importantPlayer ul li:first-child{height:318px} .proPlayer .featuredArea .pattern2 ul li, .proPlayer .importantPlayer ul li{height:calc((318px - 32px) /3)} .proPlayer .featuredArea .pattern2 ul li a .imageCntnr, .proPlayer .importantPlayer ul li a .imageCntnr{width:140px} .proPlayer .featuredArea .pattern2 li .desc, .proPlayer .importantPlayer li .desc{width:calc(100% - 140px) .proPlayer .featuredArea .pattern2 ul li.video .secName{right:115px}*/ .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((156px * 67) / 100); width: 156px; } .proPlayer .featuredArea .pattern2 ul li { width: calc((100% - 85.1px)/ 2) } .proPlayer .featuredArea .pattern2 ul li.video .secName { right: 131px } .proPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 156px) } .proPlayer .importantPlayer ul li:first-child { width: calc(100% - ((100% - 63px)/ 2)) } .proPlayer .importantPlayer ul li { width: calc((100% - 95.1px)/ 2) } .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((154px * 67) / 100); width: 154px; } .proPlayer .importantPlayer li .desc { width: calc(100% - 154px) } .proPlayer .playerInfo .playerImg { width: 325px; margin-top: 24px } .proPlayer .IContainer .infoContainer { width: calc(100% - 520px) } .proPlayer .playerInfo .personalInfo ul li { padding: 5px 0 } .euroMain .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((147px * 67) / 100); width: 147px; } .euroMain .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 53px)/ 2)) !important } .euroMain .featuredArea .pattern2 ul li { width: calc((100% - 85.1px)/ 2) !important; } .euroMain .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .euroMain .featuredArea .pattern2 li .desc { width: calc(100% - 117px) } .euroMain .featuredArea .pattern2 ul li .desc p { font-size: 14px; max-height: 44px } .euroMain .featuredArea .pattern2 ul li:first-child .desc p { font-size: 19px } .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((142px * 67) / 100); width: 142px; } .euroMain .importantPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 142px); } .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName { right: 117px } .LandingPage.CAF, .euroSquad .LandingPage.CAF, .chseSqMain.legendsSquad, .chseSqMain.chooseTeam { padding-bottom: 53% } .euroSquad .chseTtl { width: calc(100% - 940px); right: 100px; height: 416px; padding-top: 140px; } .euroSquad .chseTtl:before, .euroSquadPage .chseSqMain.chooseTeam:before { width: 102px; height: 120px; background-size: 102px auto; } .euroSquad .LandingPage.CAF:before { top: 50px } .euroSquad .LandingPage.CAF .landingTeam { width: 584px; left: 100px } .euroSquad .LandingPage.CAF .landingTeam li { margin-left: 16px; margin-bottom: 16px } .euroSquad .LandingPage.CAF .landingTeam li a { padding: 10px 14px; } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+6) { margin-bottom: 0; } .euroSquad .LandingPage.CAF .landingTeam { left: 100px } .euroSquad .LandingPage.CAF .shareGame { right: 100px } .chseSqMain .allForms { bottom: 90px !important } .euroSquadPage .chseSqMain .sponsors { left: 60px } .chseSqMain .col3 .allForms a { line-height: 3.2 !important } .euroInner .relatedArticles ul li.item .desc { width: calc(100% - 230px) } .euroInner .matchcenter .maxWidth { width: 600px; margin: 0 calc((100% - 600px)/ 2) } .RulesMsg .cntnr { height: calc(100% - 80px); top: 65px; transform: translateX(-50%) } .euroInner .articleSocial.euroSocial.fixed { right: 20.9% } .euroMain .FullWidthBK .euroHeader { background-position: 134% 71%,6%,38% 110%; background-size: 50%, auto, 28%; } .euroInner article .maxWidth { width: 600px; margin: 0 calc((100% - 600px) /2); } .olympicStrip .euroMain .FullWidthBK .euroHeader { background-position: -22%; background-size: 59%; } /*new gutter*/ article.videoTemp .pattern1 ul li, article.albumTemp .pattern1 ul li { width: calc((100% - 20.1px) / 2) } article.videoTemp .pattern1 ul li:nth-child(3n), article.albumTemp .pattern1 ul li:nth-child(3n) { margin-left: 20px } article.videoTemp .pattern1 ul li:nth-child(2n), article.albumTemp .pattern1 ul li:nth-child(2n) { margin-left: 0 } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((147px * 67)/ 100); width: 147px } .proPlayer .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 70px) / 2)) } .proPlayer .featuredArea .pattern2 ul li { width: calc((100% - 102.1px) / 2) } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67)/ 100); width: 117px } .proPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 117px); position: absolute; left: 0; right: auto; padding: 8px 16px; } .proPlayer .featuredArea .pattern2 ul li .desc p { font-size: 14px; max-height: 44px } .proPlayer .featuredArea .pattern2 ul li:first-child .desc p { font-size: 19px } .proPlayer .featuredArea .pattern2 ul li.video .secName { right: 92px } .proPlayer .featuredArea .pattern2 ul li .desc .date { margin-top: 6px } .proPlayer .featuredArea .desc.khas p:before { margin-top: 0 } .proPlayer .importantPlayer ul li:first-child { width: calc(100% - ((100% - 83px) / 2)) } .proPlayer .importantPlayer ul li { width: calc((100% - 115.1px) / 2); } .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .proPlayer .importantPlayer ul li .desc { width: calc(100% - 117px); position: absolute; left: 0; right: auto; padding: 8px 16px; } .proPlayer .importantPlayer ul li .secName, .proPlayer .importantPlayer ul li.video .secName { right: 92px; } .proPlayer .importantPlayer ul li .desc p { font-size: 14px; max-height: 44px; } .proPlayer .importantPlayer ul li:first-child .desc p { font-size: 19px } .matchesCenter .toursDropdown, .matchesCenter .matchesNow { width: 120px } .cd-gallery li .tv { max-width: 110px } .standing .table .wRow .item p { font-size: 13px } .standing .table .wRow .item:nth-child(2), .standing .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 520px) } .standing .table .wRow .item, .standing .table .ttlRow .itemTtl { width: 50px; } .euroMain .FullWidthBK .euroHeader { background-position: 134% 71%,6%,38% 110%; background-size: 50%, auto, 28%; } .euroInner article .maxWidth { width: 600px; margin: 0 calc((100% - 600px) /2); } .tour2694 .euroRoadToCup .title h1 { font-size: 40px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: calc(100% - 370px); } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { width: calc(100% - 60px); font-size: 12px } .euroPredCnts .predictionCnts .matchData .predStatus { width: 80px } .euroPredCnts .predictionCnts .matchData .predStatus .status { font-size: 11px; line-height: 2.8; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { font-size: 13px; margin-right: 4px; line-height: 2.2; } .euroPredCnts .item .matchPrediction .team { width: calc((100% - 60px) / 2) } .euroPredCnts .item .matchPrediction .team.team1 { padding-left: 50px; } .euroPredCnts .item .matchPrediction .team.team2 { padding-right: 50px; } .euroPredCnts .item .matchPrediction .dash { width: 60px } .euroPredCnts .predictionCnts .saveHint { width: 1100px } } @media screen and (min-width:1536px) and (max-width:1599px) { .cafLgFinal .wrapper { max-width: 1152px } .cafLgFinal section { margin-bottom: 50px } .LandingPage.CAF .landingTeam { width: 52% } .LandingPage.CAF .landingTeam .line a { width: 105px; height: 38px; font-size: 16px; } .cafLgFinal .championSponsor .desktop img { width: 85px; } .cafLgFinal .championSponsor .desktop .todo { left: 3% } /*.proPlayer .featuredArea .pattern2 ul li:first-child, .proPlayer .importantPlayer ul li:first-child{height:300px} .proPlayer .featuredArea .pattern2 ul li, .proPlayer .importantPlayer ul li{height:calc((300px - 32px) /3)} .proPlayer .featuredArea .pattern2 ul li a .imageCntnr, .proPlayer .importantPlayer ul li a .imageCntnr{width:132px} .proPlayer .featuredArea .pattern2 li .desc, .proPlayer .importantPlayer li .desc{width:calc(100% - 132px)} .proPlayer .featuredArea .pattern2 ul li.video .secName{right:107px}*/ .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((147px * 67) / 100); width: 147px; } .proPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 147px) } .proPlayer .featuredArea .pattern2 ul li.video .secName { right: 122px } .proPlayer .featuredArea .pattern2 ul li:first-child .desc p, .proPlayer .importantPlayer ul li:first-child .desc p { font-size: 20px; max-height: 72px } .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((147px * 67) / 100); width: 147px; } .proPlayer .importantPlayer li .desc { width: calc(100% - 147px) } .proPlayer .IContainer .infoContainer { width: calc(100% - 490px); margin-right: 100px } .proPlayer .playerInfo .personalInfo ul { margin-top: 10px } .proPlayer .playerInfo .playerImg { width: 330px } .euroMain .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((147px * 67) / 100); width: 147px; } .euroMain .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 53px)/ 2)) !important } .euroMain .featuredArea .pattern2 ul li { width: calc((100% - 85.1px)/ 2) !important; } .euroMain .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .euroMain .featuredArea .pattern2 li .desc { width: calc(100% - 117px) } .euroMain .featuredArea .pattern2 ul li .desc p { font-size: 14px; max-height: 44px } .euroMain .featuredArea .pattern2 ul li:first-child .desc p { font-size: 19px } .euroMain .remainContent .listing ul li { width: calc((100% - 32.1px)/ 3); } .euroMain .remainContent .listing ul li:nth-child(4n) { margin-left: 16px } .euroMain .remainContent .listing ul li:nth-child(3n) { margin-left: 0 } .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((133px * 67) / 100); width: 133px; } .euroMain .importantPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 133px); } .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName { right: 108px } .euroPredCnts .item .matchPrediction .team { width: calc((100% - 60px) / 2) } .euroPredCnts .item .matchPrediction .team.team1 { padding-left: 50px; } .euroPredCnts .item .matchPrediction .team.team2 { padding-right: 50px; } .euroPredCnts .item .matchPrediction .dash { width: 60px } .LandingPage.CAF, .euroSquad .LandingPage.CAF, .chseSqMain.legendsSquad, .chseSqMain.chooseTeam { padding-bottom: 52% } .legends:before { right: 70px; top: 50px; width: 160px; height: 120px; background-size: 160px 120px; } .LandingPage.CAF.legends .text { right: 70px; transform: translateY(calc(-50% + 30px)); width: 420px; } .LandingPage.CAF.legends .text h1 { font-size: 42px } .LandingPage.CAF.legends .text p { font-size: 20px } .LandingPage.CAF.legends .text .startSquad { width: 220px; height: 60px; font-size: 20px; line-height: 2.8 } .euroSquadPage .shareBtn { right: 70px } .euroSquadPage .sponsors { left: 70px } .chseSqMain .allForms { bottom: 80px !important } .chseSqMain .col3 .allForms a { line-height: 3.2 !important } .euroSquad .chseTtl { width: calc(100% - 850px); right: 70px; height: 416px; padding-top: 140px; } .euroSquad .chseTtl:before, .euroSquadPage .chseSqMain.chooseTeam:before { width: 102px; height: 120px; background-size: 102px auto; } .euroSquad .LandingPage.CAF:before { left: 70px } .euroSquad .LandingPage.CAF:before { top: 50px } .euroSquad .LandingPage.CAF .landingTeam { width: 584px; left: 70px } .euroSquad .LandingPage.CAF .landingTeam li { margin-left: 16px; margin-bottom: 16px } .euroSquad .LandingPage.CAF .landingTeam li a { padding: 10px 14px; } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+6) { margin-bottom: 0; } .euroInner .relatedArticles ul li.item .desc { width: calc(100% - 200px) } .euroInner .matchcenter .maxWidth { width: 600px; margin: 0 calc((100% - 600px)/ 2) } .euroInner .articleSocial.euroSocial.fixed { right: 19.6% } .euroMain .FullWidthBK .euroHeader { background-position: 134% 71%,6%,38% 110%; background-size: 50%, auto, 28%; } .euroInner article .maxWidth { width: 600px; margin: 0 calc((100% - 600px) /2); } .RulesMsg .cntnr { height: calc(100% - 80px); top: 65px; transform: translateX(-50%) } .RulesMsg .lb-header, .RulesMsg .lb-header h3 { margin-bottom: 10px; height: 54px } .RulesMsg ul { width: 600px; margin: 0 calc((100% - 600px) /2) } .RulesMsg ul li { margin-bottom: 8px } .olympicStrip .euroMain .FullWidthBK .euroHeader { background-position: -26%; background-size: 64%; } /*new gutter*/ article.videoTemp .pattern1 ul li, article.albumTemp .pattern1 ul li { width: calc((100% - 20.1px) / 2) } article.videoTemp .pattern1 ul li:nth-child(3n), article.albumTemp .pattern1 ul li:nth-child(3n) { margin-left: 20px } article.videoTemp .pattern1 ul li:nth-child(2n), article.albumTemp .pattern1 ul li:nth-child(2n) { margin-left: 0 } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((147px * 67)/ 100); width: 147px } .proPlayer .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 70px) / 2)) } .proPlayer .featuredArea .pattern2 ul li { width: calc((100% - 102.1px) / 2) } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67)/ 100); width: 117px } .proPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 117px); position: absolute; left: 0; right: auto; padding: 8px 16px; } .proPlayer .featuredArea .pattern2 ul li .desc p { font-size: 14px; max-height: 44px } .proPlayer .featuredArea .pattern2 ul li:first-child .desc p { font-size: 19px } .proPlayer .featuredArea .pattern2 ul li.video .secName { right: 92px } .proPlayer .featuredArea .pattern2 ul li .desc .date { margin-top: 6px } .proPlayer .featuredArea .desc.khas p:before { margin-top: 0 } .proPlayer .importantPlayer ul li:first-child { width: calc(100% - ((100% - 83px) / 2)) } .proPlayer .importantPlayer ul li { width: calc((100% - 115.1px) / 2); } .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .proPlayer .importantPlayer ul li .desc { width: calc(100% - 117px); position: absolute; left: 0; right: auto; padding: 8px 16px; } .proPlayer .importantPlayer ul li .secName, .proPlayer .importantPlayer ul li.video .secName { right: 92px; } .proPlayer .importantPlayer ul li .desc p { font-size: 14px; max-height: 44px; } .proPlayer .importantPlayer ul li:first-child .desc p { font-size: 19px } .proPlayer .remainContent .listing ul li { width: calc((100% - 32.1px)/ 3) } .proPlayer .remainContent .listing ul li:nth-of-type(4n) { margin-left: 16px } .proPlayer .remainContent .listing ul li:nth-of-type(3n) { margin-left: 0 } .matchesCenter .toursDropdown, .matchesCenter .matchesNow { width: 120px } .cd-gallery li .tv { max-width: 110px } .standing .table .wRow .item p { font-size: 13px } .standing .table .wRow .item:nth-child(2), .standing .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 520px) } .standing .table .wRow .item, .standing .table .ttlRow .itemTtl { width: 50px; } .tour2694 .euroRoadToCup .title h1 { font-size: 40px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: calc(100% - 370px); } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { width: calc(100% - 60px); font-size: 12px } .euroPredCnts .predictionCnts .matchData .predStatus { width: 80px } .euroPredCnts .predictionCnts .matchData .predStatus .status { font-size: 11px; line-height: 2.8; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { font-size: 13px; margin-right: 4px; line-height: 2.2; } .euroPredCnts .predictionCnts .saveHint { width: 1100px } .newPred .pagecnts { width: 1430px; margin: 0 calc((100% - 1430px) / 2) } } @media screen and (min-width:1440px) and (max-width:1535px) { .cafLgFinal .wrapper { max-width: 1152px } .cafLgFinal section { margin-bottom: 50px } .LandingPage.CAF .landingTeam { width: 52% } .LandingPage.CAF .landingTeam .line a { width: 100px; height: 38px; font-size: 16px; } .cafLgFinal .championSponsor .desktop img { width: 85px; } .cafLgFinal .championSponsor .desktop .todo { left: 3% } /* .proPlayer .featuredArea .pattern2 ul li:first-child, .proPlayer .importantPlayer ul li:first-child{height:275px} .proPlayer .featuredArea .pattern2 ul li:first-child .desc p, .proPlayer .importantPlayer ul li:first-child .desc p{font-size:18px;max-height:64px} .proPlayer .featuredArea .pattern2 ul li, .proPlayer .importantPlayer ul li{height:calc((275px - 32px) /3)} .proPlayer .featuredArea .pattern2 ul li a .imageCntnr, .proPlayer .importantPlayer ul li a .imageCntnr{width:116px} .proPlayer .featuredArea .pattern2 li .desc, .proPlayer .importantPlayer ul li .desc{width:calc(100% - 116px)} .proPlayer .featuredArea .pattern2 ul li.video .secName, .proPlayer .importantPlayer ul li.video .secName{right:91px}*/ .proPlayer .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 80px)/ 2)) } .proPlayer .featuredArea .pattern2 ul li { width: calc((100% - 112.1px)/ 2) } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((138px * 67) / 100); width: 138px; } .proPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 138px) } .proPlayer .featuredArea .pattern2 ul li.video .secName { right: 113px } .proPlayer .featuredArea .pattern2 ul li .desc p, .proPlayer .importantPlayer ul li .desc p { font-size: 15px; max-height: 48px } /* .proPlayer .featuredArea .pattern2 ul li .desc .date, .proPlayer .importantPlayer ul li .desc .date{margin-bottom:-3px} */ .proPlayer .importantPlayer ul li:first-child { width: calc(100% - ((100% - 72px)/ 2)) } .proPlayer .importantPlayer ul li { width: calc((100% - 104.1px)/ 2) } .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((133px * 67) / 100); width: 133px; } .proPlayer .importantPlayer ul li .desc { width: calc(100% - 133px) } .proPlayer .playerInfo .personalInfo ul { margin-top: 10px } .proPlayer .playerInfo .info h2 { font-size: 28px } .proPlayer .playerInfo .info .team img { width: 35px } .proPlayer .playerInfo .info .team span { line-height: 2; font-size: 18px } .proPlayer .IContainer .infoContainer { width: calc(100% - 448px); margin-right: 80px } .proPlayer .playerInfo .number { font-size: 108px } .proPlayer .playerInfo .playerImg { margin-right: 48px; width: 320px; margin-top: 15px } .euroMain .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((147px * 67) / 100); width: 147px; } .euroMain .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 53px)/ 2)) !important } .euroMain .featuredArea .pattern2 ul li { width: calc((100% - 85.1px)/ 2) !important; } .euroMain .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .euroMain .featuredArea .pattern2 li .desc { width: calc(100% - 117px) } .euroMain .featuredArea .pattern2 ul li .desc p { font-size: 14px; max-height: 44px } .euroMain .featuredArea .pattern2 ul li:first-child .desc p { font-size: 19px } .euroMain .remainContent .listing ul li { width: calc((100% - 32.1px)/ 3); } .euroMain .remainContent .listing ul li:nth-child(4n) { margin-left: 16px } .euroMain .remainContent .listing ul li:nth-child(3n) { margin-left: 0 } .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((119px * 67) / 100); width: 119px; } .euroMain .importantPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 119px); } .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName { right: 94px } .euroPredCnts .item .matchPrediction .team { width: calc((100% - 60px) / 2) } .euroPredCnts .item .matchPrediction .team.team1 { padding-left: 50px; } .euroPredCnts .item .matchPrediction .team.team2 { padding-right: 50px; } .euroPredCnts .item .matchPrediction .dash { width: 60px } .LandingPage.CAF, .euroSquad .LandingPage.CAF, .chseSqMain.legendsSquad, .chseSqMain.chooseTeam { padding-bottom: 59% } .legends:before { right: 50px; top: 50px; width: 160px; height: 120px; background-size: 160px 120px; } .LandingPage.CAF.legends .text { right: 50px; transform: translateY(calc(-50% + 30px)); width: 420px; } .LandingPage.CAF.legends .text h1 { font-size: 42px } .LandingPage.CAF.legends .text p { font-size: 20px } .LandingPage.CAF.legends .text .startSquad { width: 220px; height: 60px; font-size: 20px; line-height: 2.8 } .euroSquadPage .shareBtn { right: 50px } .euroSquadPage .sponsors { left: 50px } .chseSqMain.legends:before { right: 40px } .chseSqMain .allForms { bottom: 90px !important } .chseSqMain .col3 .allForms a { line-height: 3.2 !important } .euroSquadPage .chseSqMain .sponsors { left: 40px } .euroSquad .chseTtl { width: calc(100% - 700px); right: 50px; height: 416px; padding-top: 140px; } .euroSquad .chseTtl:before, .euroSquadPage .chseSqMain.chooseTeam:before { width: 102px; height: 120px; background-size: 102px auto; } .euroSquadPage .chseSqMain.chooseTeam:before { right: 40px } .euroSquadPage .chseSqMain.chooseTeam:after { left: 40px } .euroSquad .LandingPage.CAF:before { left: 50px } .euroSquad .LandingPage.CAF:before { top: 50px } .euroSquad .LandingPage.CAF .landingTeam { width: 584px; left: 50px } .euroSquad .LandingPage.CAF .landingTeam li { margin-left: 16px; margin-bottom: 16px } .euroSquad .LandingPage.CAF .landingTeam li a { padding: 10px 14px; } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+6) { margin-bottom: 0; } .euroInner article .maxWidth, .euroInner .articleHeader .artclHdline { width: 600px; margin: 0 calc((100% - 600px) /2) } .euroInner .relatedArticles ul li.item .desc { width: calc(100% - 160px) } .euroInner .relatedArticles ul li.item a .imageCntnr { width: 130px; padding-bottom: 90px } .euroInner .relatedArticles ul li.item a img { height: 90px } .euroInner .relatedArticles { height: 126px } .euroInner .matchcenter .maxWidth { width: 600px; margin: 0 calc((100% - 600px)/ 2) } .euroInner .articleSocial.euroSocial.fixed { right: 17.6% } .RulesMsg .cntnr { height: calc(100% - 80px); top: 65px; transform: translateX(-50%) } .RulesMsg .lb-header, .RulesMsg .lb-header h3 { margin-bottom: 10px; height: 54px } .RulesMsg ul { width: 600px; margin: 0 calc((100% - 600px) /2) } .RulesMsg ul li { margin-bottom: 8px } .euroMain .FullWidthBK .euroHeader { background-position: 122% 71%,6%,38% 110%; background-size: 50%, 22%, 28%; } .olympicStrip .euroMain .FullWidthBK .euroHeader { background-position: -40%; background-size: 69%; } .olympicStrip .FullWidthBK .euroHeader img.robotStrip { margin: 12px 70px 0 0 } /*new gutter*/ article.videoTemp .pattern1 ul li, article.albumTemp .pattern1 ul li { width: calc((100% - 20.1px) / 2) } article.videoTemp .pattern1 ul li:nth-child(3n), article.albumTemp .pattern1 ul li:nth-child(3n) { margin-left: 20px } article.videoTemp .pattern1 ul li:nth-child(2n), article.albumTemp .pattern1 ul li:nth-child(2n) { margin-left: 0 } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((147px * 67)/ 100); width: 147px } .proPlayer .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 66px) / 2)) } .proPlayer .featuredArea .pattern2 ul li { width: calc((100% - 98.1px) / 2) } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67)/ 100); width: 117px } .proPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 117px); position: absolute; left: 0; right: auto; padding: 8px 16px; } .proPlayer .featuredArea .pattern2 ul li .desc p { font-size: 14px; max-height: 44px } .proPlayer .featuredArea .pattern2 ul li:first-child .desc p { font-size: 19px } .proPlayer .featuredArea .pattern2 ul li.video .secName { right: 92px } .proPlayer .featuredArea .pattern2 ul li .desc .date { margin-top: 6px } .proPlayer .featuredArea .desc.khas p:before { margin-top: 0 } .proPlayer .importantPlayer ul li:first-child { width: calc(100% - ((100% - 83px) / 2)) } .proPlayer .importantPlayer ul li { width: calc((100% - 115.1px) / 2); } .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .proPlayer .importantPlayer ul li .desc { width: calc(100% - 117px); position: absolute; left: 0; right: auto; padding: 8px 16px; } .proPlayer .importantPlayer ul li .secName, .proPlayer .importantPlayer ul li.video .secName { right: 92px; } .proPlayer .importantPlayer ul li .desc p { font-size: 14px; max-height: 44px; } .proPlayer .importantPlayer ul li:first-child .desc p { font-size: 19px } .proPlayer .remainContent .listing ul li { width: calc((100% - 32.1px)/ 3) } .proPlayer .remainContent .listing ul li:nth-of-type(4n) { margin-left: 16px } .proPlayer .remainContent .listing ul li:nth-of-type(3n) { margin-left: 0 } .matchesCenter .toursDropdown, .matchesCenter .matchesNow { width: 120px } .cd-gallery li .tv { max-width: 110px } .standing .table .wRow .item p { font-size: 13px } .standing .table .wRow .item:nth-child(2), .standing .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 520px) } .standing .table .wRow .item, .standing .table .ttlRow .itemTtl { width: 50px; } .tour2694 .euroRoadToCup .title h1 { font-size: 40px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: calc(100% - 370px); } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { width: calc(100% - 60px); font-size: 12px } .euroPredCnts .predictionCnts .matchData .predStatus { width: 80px } .euroPredCnts .predictionCnts .matchData .predStatus .status { font-size: 11px; line-height: 2.8; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { font-size: 13px; margin-right: 4px; line-height: 2.2; } .euroPredCnts .predictionCnts .saveHint { width: 1100px } .newPred .pagecnts { width: 1340px; margin: 0 calc((100% - 1340px) / 2) } } /*@media screen and (min-width:1366px) and (max-width:1439px) { .euroMain .featuredArea .pattern2 ul li a .imageCntnr {padding-bottom: calc((114px * 67) / 100);width: 114px;} .euroMain .featuredArea .pattern2 li .desc{width:calc(100% - 114px)} .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr {padding-bottom: calc((109px * 67) / 100);width: 109px;} .euroMain .importantPlayer .featuredArea .pattern2 li .desc{width: calc(100% - 109px);} .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName{right:84px} }*/ @media screen and (min-width:1360px) and (max-width:1439px) { .cafLgFinal .wrapper { max-width: 1024px } .cafLgFinal section { margin-bottom: 50px } .ahlyFans.cafLgFinal .votingBtn .second:before { background-size: auto 100%; } .zamalekFans.cafLgFinal .votingBtn .second:before { background-size: auto 100%; } .LandingPage.CAF .landingTeam { width: 52% } .LandingPage.CAF .landingTeam .line a { width: 100px; height: 36px; font-size: 16px; line-height: 2.2 } .LandingPage.CAF .aqarLogo { bottom: 45px; right: 45px; } .cafLgFinal .championSponsor .desktop img { width: 85px; } .cafLgFinal .championSponsor .desktop .todo { left: 3% } /* .proPlayer .featuredArea .pattern2 ul li:first-child, .proPlayer .importantPlayer ul li:first-child{height:250px;} .proPlayer .featuredArea .pattern2 ul li, .proPlayer .importantPlayer ul li{height:calc((250px - 32px)/ 3)} .proPlayer .featuredArea .pattern2 ul li a .imageCntnr, .proPlayer .importantPlayer ul li a .imageCntnr{padding-bottom:calc((109px * 67)/ 100);width:109px;float:right} .proPlayer .featuredArea .pattern2 li .desc, .proPlayer .importantPlayer ul li .desc{width:calc(100% - 109px);padding:6px 15px} .proPlayer .featuredArea .pattern2 ul li.video .secName, .proPlayer .importantPlayer ul li.video .secName{right:84px}*/ .proPlayer .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 80px)/ 2)) } .proPlayer .featuredArea .pattern2 ul li { width: calc((100% - 112.1px)/ 2) } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((127px * 67) / 100); width: 127px; } .proPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 127px); height: 84px; } .proPlayer .featuredArea .pattern2 ul li.video .secName { right: 101px } .proPlayer .importantPlayer ul li:first-child { width: calc(100% - ((100% - 80px)/ 2)); } .proPlayer .importantPlayer ul li { width: calc((100% - 112.1px)/ 2); } .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((124px * 67) / 100); width: 124px; } .proPlayer .importantPlayer li .desc { width: calc(100% - 124px); height: 84px; } .proPlayer .featuredArea .pattern2 ul li:first-child.video .secName, .proPlayer .importantPlayer ul li:first-child.video .secName, .proPlayer .featuredArea .pattern2 ul li:first-child.video .secName .icon, .proPlayer .importantPlayer ul li:first-child.video .secName .icon { width: 55px; height: 35px } .proPlayer .featuredArea .pattern2 ul li:first-child .desc p, .proPlayer .importantPlayer ul li:first-child .desc p { font-size: 19px; line-height: 1.4; max-height: 56px } .proPlayer .featuredArea .pattern2 ul li .desc p, .proPlayer .importantPlayer ul li .desc p { font-size: 15px; margin-bottom: 6px; max-height: 48px } .proPlayer .featuredArea .pattern2 ul li .desc .date, .proPlayer .importantPlayer ul li .desc .date { font-size: 10px; position: absolute; right: 15px; bottom: 3px; } .proPlayer .playerInfo .playerImg { width: 300px; margin-right: 48px; margin-top: 20px } .proPlayer .playerInfo .personalInfo ul { margin-top: 0 } .proPlayer .playerInfo .info h2 { font-size: 26px } .proPlayer .playerInfo .info .team img { width: 35px } .proPlayer .playerInfo .info .team span { line-height: 2; font-size: 18px } .proPlayer .IContainer .infoContainer { width: calc(100% - 408px); margin-right: 60px } .proPlayer .playerInfo .number { font-size: 90px; top: 28px } .euroMain .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((147px * 67) / 100); width: 147px; } .euroMain .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 53px)/ 2)) !important } .euroMain .featuredArea .pattern2 ul li { width: calc((100% - 85.1px)/ 2) !important; } .euroMain .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .euroMain .featuredArea .pattern2 li .desc { width: calc(100% - 117px) } .euroMain .featuredArea .pattern2 ul li .desc p { font-size: 14px; max-height: 44px } .euroMain .featuredArea .pattern2 ul li:first-child .desc p { font-size: 19px } .euroMain .remainContent .listing ul li { width: calc((100% - 32.1px)/ 3); } .euroMain .remainContent .listing ul li:nth-child(4n) { margin-left: 16px } .euroMain .remainContent .listing ul li:nth-child(3n) { margin-left: 0 } .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((108px * 67) / 100); width: 108px; } .euroMain .importantPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 108px); } .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName { right: 83px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: calc(100% - 370px); } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { width: calc(100% - 60px); font-size: 12px } .euroPredCnts .item .matchPrediction .team { width: calc((100% - 60px) / 2) } .euroPredCnts .item .matchPrediction .team.team1 { padding-left: 50px; } .euroPredCnts .item .matchPrediction .team.team2 { padding-right: 50px; } .euroPredCnts .item .matchPrediction .dash { width: 60px } .euroPredCnts .predictionCnts .matchData .predStatus { width: 80px } .euroPredCnts .predictionCnts .matchData .predStatus .status { font-size: 11px; line-height: 2.8; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { font-size: 13px; margin-right: 4px; line-height: 2.2; } .LandingPage.CAF, .euroSquad .LandingPage.CAF, .chseSqMain.legendsSquad, .chseSqMain.chooseTeam { padding-bottom: 51% } .legends:before { right: 40px; top: 30px; width: 160px; height: 120px; background-size: 160px 120px; } .LandingPage.CAF.legends .text { right: 40px; transform: translateY(calc(-50% + 30px)); width: 420px; } .LandingPage.CAF.legends .text h1 { font-size: 42px; margin-bottom: 10px; } .LandingPage.CAF.legends .text p { font-size: 20px } .LandingPage.CAF.legends .text .startSquad { width: 220px; height: 60px; font-size: 20px; line-height: 2.8 } .euroSquadPage .shareBtn { right: 50px; bottom: 30px } .euroSquadPage .sponsors { bottom: 30px; left: 50px } .chseSqMain.legends:before { width: 120px; height: 90px; background-size: 120px 90px; right: 40px } .euroSquadPage .chseSqMain .sponsors { left: 40px } .euroSquadPage .chseSqMain .sponsors a img { height: 34px; } .chseSqMain .allForms { bottom: 70px !important } .chseSqMain .col3 .allForms a { line-height: 2.6 !important } .euroSquad .chseTtl { width: calc(100% - 700px); right: 50px; height: 368px; padding-top: 140px; } .euroSquad .chseTtl h1 { font-size: 38px } .euroSquad .chseTtl p { width: 290px; font-size: 20px; } .euroSquad .chseTtl:before, .euroSquadPage .chseSqMain.chooseTeam:before { width: 102px; height: 120px; background-size: 102px auto } .euroSquadPage .chseSqMain.chooseTeam:before { right: 40px } .euroSquadPage .chseSqMain.chooseTeam:after { left: 40px } .euroSquad .LandingPage.CAF:before { left: 50px; top: 40px; width: 94px; height: 40px; background-size: 94px auto } .euroSquad .LandingPage.CAF .landingTeam { width: 480px; left: 50px } .euroSquad .LandingPage.CAF .landingTeam li { margin-left: 12px; margin-bottom: 12px; width: 70px } .euroSquad .LandingPage.CAF .landingTeam li a { padding: 10px } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+6) { margin-bottom: 0; } .euroSquad .LandingPage.CAF .landingTeam li .imgCntnr { margin-bottom: 16px } .euroSquad .LandingPage.CAF .landingTeam li p { font-size: 13px } .euroSquadPage .shareBtn a.faceShare, .euroSquadPage .shareBtn a.twShare { font-size: 26px } .euroInner article .maxWidth, .euroInner .articleHeader .artclHdline { width: 600px; margin: 0 calc((100% - 600px) /2) } .euroInner .relatedArticles ul li.item .desc { width: calc(100% - 160px) } .euroInner .relatedArticles ul li.item a .imageCntnr { width: 130px; padding-bottom: 90px } .euroInner .relatedArticles ul li.item a img { height: 90px } .euroInner .relatedArticles { height: 126px } .euroInner .articleHeader .articleInfo .articleAuthor { width: auto } .euroInner .articleHeader .articleInfo { height: auto } .fanZone .cntnr { width: 100%; padding: 40px; margin: 0 } .fanZone ul li.bigWidth { width: 390px } .fanZone ul li { width: 315px; margin-bottom: 30px } .euroInner .matchcenter .maxWidth { width: 600px; margin: 0 calc((100% - 600px) /2) } .login-box.signUpActive.error, .login-box.loginActive.error { margin-top: 20px } .RulesMsg .cntnr { height: calc(100% - 80px); top: 65px; transform: translateX(-50%); } .RulesMsg .rulesItems { overflow-x: hidden !important; overflow-y: scroll !important; height: 478px } .RulesMsg .lb-header { margin-bottom: 10px } .euroRoadToCup { padding: 64px 32px } .euroRoadToCup .groupTaples .group { width: calc((100% - 32px) / 3); margin-left: 16px; margin-bottom: 16px; } .euroRoadToCup .groupTaples .GroupTeams { width: 278px; margin: 10px calc((100% - 278px) / 2) 20px } .euroRoadToCup .groupTaples .GroupTeams li { margin-left: 26px } .tour2694 .euroRoadToCup { padding: 64px } .tour2694 .euroRoadToCup .groupTaples .group { width: calc((100% - 32px) / 2); margin-left: 32px; margin-bottom: 32px; } .tour2694 .euroRoadToCup .groupTaples .GroupTeams { width: 296px; margin: 10px calc((100% - 296px) / 2) 20px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li { margin-left: 32px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li:last-of-type { margin-left: 0 } .euroQuizCnts .getReadyTimer p, .euroQuizCnts .resultDiv p { font-size: 30px; margin-bottom: 24px; } .euroInner .articleSocial.euroSocial.fixed { right: 15.7% } .euroMain .FullWidthBK .euroHeader { background-position: 122% 71%,6% 92%,34% 105%; background-size: 50%,25%,26%; } .olympicStrip .euroMain .FullWidthBK .euroHeader { background-size: 73%; background-position: -45%; } .olympicStrip .FullWidthBK .euroHeader img.robotStrip { margin: 12px 30px 0 0 } .olympicStrip .FullWidthBK .euroHeader .textStrip { margin-right: 20px } /*new gutter*/ .featuredArea .desc p { font-size: 14px } .featuredArea ul li:first-child .desc p { font-size: 19px } article.videoTemp .pattern1 ul li, article.albumTemp .pattern1 ul li { width: calc((100% - 20.1px) / 2) } article.videoTemp .pattern1 ul li:nth-child(3n), article.albumTemp .pattern1 ul li:nth-child(3n) { margin-left: 20px } article.videoTemp .pattern1 ul li:nth-child(2n), article.albumTemp .pattern1 ul li:nth-child(2n) { margin-left: 0 } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((147px * 67)/ 100); width: 147px } .proPlayer .featuredArea .pattern2 ul li:first-child { width: calc(100% - ((100% - 66px) / 2)) } .proPlayer .featuredArea .pattern2 ul li { width: calc((100% - 98.1px) / 2) } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((117px * 67)/ 100); width: 117px } .proPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 117px); position: absolute; left: 0; right: auto; padding: 8px 16px; } .proPlayer .featuredArea .pattern2 ul li .desc p { font-size: 14px; max-height: 44px } .proPlayer .featuredArea .pattern2 ul li:first-child .desc p { font-size: 19px } .proPlayer .featuredArea .pattern2 ul li.video .secName { right: 92px } .proPlayer .featuredArea .pattern2 ul li .desc .date { margin-top: 6px } .proPlayer .featuredArea .desc.khas p:before { margin-top: 0 } .proPlayer .importantPlayer ul li:first-child { width: calc(100% - ((100% - 83px) / 2)) } .proPlayer .importantPlayer ul li { width: calc((100% - 115.1px) / 2); } .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((117px * 67) / 100); width: 117px; } .proPlayer .importantPlayer ul li .desc { width: calc(100% - 117px); position: absolute; left: 0; right: auto; padding: 8px 16px; } .proPlayer .importantPlayer ul li .secName, .proPlayer .importantPlayer ul li.video .secName { right: 92px; } .proPlayer .importantPlayer ul li .desc p { font-size: 14px; max-height: 44px; } .proPlayer .importantPlayer ul li:first-child .desc p { font-size: 19px } .proPlayer .remainContent .listing ul li { width: calc((100% - 32.1px)/ 3) } .proPlayer .remainContent .listing ul li:nth-of-type(4n) { margin-left: 16px } .proPlayer .remainContent .listing ul li:nth-of-type(3n) { margin-left: 0 } .matchesCenter .toursDropdown, .matchesCenter .matchesNow { width: 120px } .cd-gallery li .tv { max-width: 110px } .tour2694 .euroRoadToCup .title h1 { font-size: 40px } .euroPredCnts .predictionCnts .saveHint { width: 1100px } .newPred .pagecnts { width: 1260px; margin: 0 calc((100% - 1260px) / 2) } /*.newPred .prediction{padding:50px 70px}*/ .newPred .proPlayer .title .leagueSetting a { padding: 0 20px; height: 40px } .newPred .proPlayer .title .leagueSetting a .cont p, .newPred .proPlayer .title .leagueSetting a .cont span:before { line-height: 40px !important } } @media screen and (min-width:1280px) and (max-width:1359px) { .cafLgFinal .wrapper { max-width: 1024px } .cafLgFinal section { margin-bottom: 50px } .cafLgFinal .listing ul li { border: none; width: calc((100% - 32.1px) / 3) } .ahlyFans.cafLgFinal .votingBtn .second:before { background-size: auto 100%; } .zamalekFans.cafLgFinal .votingBtn .second:before { background-size: auto 100%; } .LandingPage.CAF .landingTeam { width: 52% } .LandingPage.CAF .landingTeam .line a { width: 90px; height: 34px; font-size: 15px; line-height: 2.2; } .LandingPage.CAF .aqarLogo { bottom: 45px; right: 45px; } .cafLgFinal .championSponsor .desktop img { width: 85px; } .cafLgFinal .championSponsor .desktop .todo { left: 3% } .proPlayer .FullWidthBK h1 { font-size: 52px } .proPlayer .featuredArea .pattern2 ul li:first-child, .proPlayer .importantPlayer ul li:first-child { width: 100%; height: auto; margin-bottom: 16px } .proPlayer .featuredArea .pattern2 ul li, .proPlayer .importantPlayer ul li { width: 100%; height: 100px } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr, .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((150px * 67)/ 100); width: 150px; float: right } .proPlayer .featuredArea .pattern2 li .desc, .proPlayer .importantPlayer ul li .desc { width: calc(100% - 150px) } .proPlayer .featuredArea .pattern2 ul li.video .secName, .proPlayer .importantPlayer ul li.video .secName { right: 125px } .proPlayer .featuredArea .pattern2 ul li .desc .date, .proPlayer .importantPlayer ul li .desc .date { position: absolute; right: 15px; bottom: 5px } .proPlayer .featuredArea .pattern2 ul li:first-child .desc .date, .proPlayer .importantPlayer ul li:first-child .desc .date { margin-bottom: 0 } .proPlayer .remainContent .listing ul li { width: calc((100% - 16.1px) / 2) } .proPlayer .remainContent .listing ul li:nth-of-type(4n) { margin-left: 16px } .proPlayer .remainContent .listing ul li:nth-of-type(2n) { margin-left: 0 } .proPlayer .playerInfo .playerImg { width: 300px; margin-right: 33px; margin-top: 20px; } .proPlayer .playerInfo .personalInfo ul { margin-top: 0 } .proPlayer .playerInfo .info h2 { font-size: 26px } .proPlayer .playerInfo .info .team img { width: 35px } .proPlayer .playerInfo .info .team span { line-height: 2; font-size: 18px } .proPlayer .IContainer .infoContainer { width: calc(100% - 383px); margin-right: 50px } .proPlayer .playerInfo .number { font-size: 90px; top: 32px } .proPlayer .remainContent .Pcnt ul li:first-child { margin-right: 16px } .euroMain .FullWidthBK h1 { font-size: 48px } .euroMain .featuredArea .pattern2 ul li:first-child, .euroMain .importantPlayer ul li:first-child { width: 100% !important } .euroMain .featuredArea .pattern2 ul li, .euroMain .importantPlayer ul li { width: 100% !important } .euroMain .featuredArea .pattern2 li .desc { padding: 4px 10px; } .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((150px * 67) / 100); width: 150px; } .euroMain .importantPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 150px); } .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName { right: 125px } .euroMain .featuredArea .pattern2 ul li .desc .date { right: 10px } .euroPredCnts .predHint, .euroRoadToCup .predHint { padding: 20px 10px; min-height: 100% } .euroPredCnts .predHint .hintMsg h3, .euroRoadToCup .predHint .hintMsg h3 { font-size: 18px; line-height: 1.8; text-align: center } .euroPredCnts .predHint .hintMsg p, .euroRoadToCup .predHint .hintMsg p { text-align: center; margin: 20px 0 30px; font-size: 12px; } .euroPredCnts .predHint .regBtn, .euroRoadToCup .predHint .regBtn { position: relative; bottom: 0; left: 0; width: 100%; height: 40px; display: inline-block; line-height: 3.0; font-size: 14px; } .euroPredCnts .predictionCnts .tourTitle { padding: 0 10px } .euroPredCnts .predictionCnts .tourTitle .shape { width: 14px; height: 14px; margin-top: 18px; } .euroPredCnts .predictionCnts .tourTitle h3 { width: calc(100% - 18px); font-size: 14px; line-height: 3.6; padding-right: 10px; } .euroPredCnts .predictionCnts .tourTitle h3 span { font-size: 11px; } .euroPredCnts .predictionCnts .tourTitle .jokerCount { left: 10px } .euroPredCnts .predictionCnts .tourTitle .jokerCount .icon-joker:before { font-size: 14px } .euroPredCnts .predictionCnts .tourTitle .jokerCount p { font-size: 12px; line-height: 1.4 } .euroPredCnts .predictionCnts .tourTitle .jokerCount p span { font-size: 16px } .euroPredCnts .predictionCnts .accordionItem .matchData { height: 110px; padding: 0 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData .date p { line-height: 4.2; margin-left: 10px; font-size: 11px; width: auto } .euroPredCnts .predictionCnts .accordionItem .matchData .date p.day { width: auto } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { font-size: 11px; width: auto; text-align: center; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 .teamName { position: absolute; left: 54px; top: 50%; transform: translateY(-50%); text-align: left; padding-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 .teamName { position: absolute; right: 54px; top: 50%; transform: translateY(-50%); text-align: right; padding-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: 100%; top: auto; left: 0; transform: none; bottom: 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData a { display: inline-block; width: calc(100% - 30px) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult img { margin: 4px calc((100% - 20px) / 2) 2px; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 img { margin: 0; margin-right: 10px; position: absolute; left: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 img { margin: 0; margin-left: 10px; position: absolute; right: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 4px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 4px } .euroPredCnts .predictionCnts .matchData .predStatus { width: 70px; left: 40px; top: 10px; transform: none; height: 22px; } .euroPredCnts .predictionCnts .matchData .predStatus .status { font-size: 10px; line-height: 2.2; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { font-size: 12px; margin-right: 2px; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult { height: 52px; position: relative } .euroPredCnts .predictionCnts .matchData span.icon-plus { left: 10px; top: 10px; transform: none } .euroPredCnts .predictionCnts .matchData span.icon-plus::before, .euroPredCnts .predictionCnts .matchData span.icon-plus::after { width: 10px } .euroPredCnts .predictionCnts .matchData span.icon-plus::after { left: 6px } .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus { -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); -ms-transform: rotateX(180deg); -o-transform: rotateX(180deg); transform: rotateX(180deg); } .euroPredCnts .item .matchPrediction .team { width: calc((100% - 50px) / 2) } .euroPredCnts .item .matchPrediction .team.team1 { padding-left: 50px; } .euroPredCnts .item .matchPrediction .team.team2 { padding-right: 50px; } .euroPredCnts .item .matchPrediction .teamName, .euroPredCnts .item .matchPrediction .teamScoring p { font-size: 11px; width: 100%; text-align: center; line-height: 2; } .euroPredCnts .item .matchPrediction .dash { width: 50px; } .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points { line-height: 20px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { font-size: 11px; width: auto; text-align: center; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 .teamName { position: absolute; left: 54px; top: 50%; transform: translateY(-50%); text-align: left; padding-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 .teamName { position: absolute; right: 54px; top: 50%; transform: translateY(-50%); text-align: right; padding-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: 100%; top: auto; left: 0; transform: none; bottom: 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData a { display: inline-block; width: calc(100% - 30px) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult img { margin: 4px calc((100% - 20px) / 2) 2px; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 img { margin: 0; margin-right: 10px; position: absolute; left: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 img { margin: 0; margin-left: 10px; position: absolute; right: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 4px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 4px } .euroPredCnts .item .matchPrediction form, .euroPredCnts .item .matchPrediction .value-button { width: 30px } .euroPredCnts .item .matchPrediction input.number { width: 30px; height: 30px; font-size: 18px; } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem { padding: 10px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item { width: 100%; margin-left: 0; margin-bottom: 16px; height: 152px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item:last-of-type { margin-bottom: 0 } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item .predMatchTitle { height: 34px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item .predMatchTitle h3 { font-size: 13px; line-height: 2.6 } .euroPredCnts .predMatchTitle .predJoker { width: 22px; height: 22px } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"] + label { font-size: 16px } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"] + label .icon-joker:before { left: 4px } .LandingPage.CAF, .euroSquad .LandingPage.CAF, .chseSqMain.legendsSquad, .chseSqMain.chooseTeam { padding-bottom: 57% } .legends:before { right: 40px; top: 30px; width: 160px; height: 120px; background-size: 160px 120px; } .LandingPage.CAF.legends .text { right: 40px; transform: translateY(calc(-50% + 30px)); width: 420px; } .LandingPage.CAF.legends .text h1 { font-size: 42px; margin-bottom: 10px; } .LandingPage.CAF.legends .text p { font-size: 20px } .LandingPage.CAF.legends .text .startSquad { width: 220px; height: 60px; font-size: 20px; line-height: 2.8 } .euroSquadPage .shareBtn { right: 50px; bottom: 30px } .euroSquadPage .sponsors { bottom: 30px; left: 50px } .chseSqMain.legends:before { width: 120px; height: 90px; background-size: 120px 90px; right: 40px } .euroSquadPage .chseSqMain .sponsors { left: 40px } .euroSquadPage .chseSqMain .sponsors a img { height: 34px; } .chseSqMain .allForms { bottom: 70px !important } .chseSqMain .col3 .allForms a { line-height: 2.6 !important } .euroSquad .chseTtl { width: calc(100% - 700px); right: 50px; height: 368px; padding-top: 140px; } .euroSquad .chseTtl h1 { font-size: 38px } .euroSquad .chseTtl p { width: 290px; font-size: 20px; } .euroSquad .chseTtl:before, .euroSquadPage .chseSqMain.chooseTeam:before { width: 102px; height: 120px; background-size: 102px auto } .euroSquadPage .chseSqMain.chooseTeam:before { right: 40px } .euroSquadPage .chseSqMain.chooseTeam:after { left: 40px } .euroSquad .LandingPage.CAF:before { left: 50px; top: 40px; width: 94px; height: 40px; background-size: 94px auto } .euroSquad .LandingPage.CAF .landingTeam { width: 480px; left: 50px } .euroSquad .LandingPage.CAF .landingTeam li { margin-left: 12px; margin-bottom: 12px; width: 70px } .euroSquad .LandingPage.CAF .landingTeam li a { padding: 10px } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+6) { margin-bottom: 0; } .euroSquad .LandingPage.CAF .landingTeam li .imgCntnr { margin-bottom: 16px } .euroSquad .LandingPage.CAF .landingTeam li p { font-size: 13px } .euroSquadPage .shareBtn a.faceShare, .euroSquadPage .shareBtn a.twShare { font-size: 26px } .euroInner article .maxWidth, .euroInner .articleHeader .artclHdline { width: 100%; margin: 0 } .euroInner .relatedArticles ul li.item { width: 180px; height: auto } .euroInner .relatedArticles ul li.item .desc { width: 180px; padding: 0 } .euroInner .articleHeader .articleInfo .articleAuthor { width: auto } .euroInner .articleHeader .articleInfo { height: auto } .fanZone .cntnr { width: 100%; padding: 80px 40px; margin: 0 } .fanZone ul li { width: calc((100% - 40px) /3) !important } .euroInner .matchcenter .maxWidth { width: 100%; margin: 0 } .euroInner .matchcenter .matchesList ul li .leftCol { width: 100px } .euroInner .matchcenter .matchesList ul li .allData { width: calc(100% - 100px) } .euroInner .matchcenter .matchesList ul li .channel { width: 88px } .euroInner .matchcenter .matchesList ul li .channel:before { line-height: 1.8 } .euroInner .matchcenter .matchesList ul li .topData { padding: 15px 10px 45px } .euroInner .matchcenter .matchesList ul li .channel { left: 10px } .euroInner .matchcenter .matchesList ul li .leftCol { padding: 20px 10px } .RulesMsg .cntnr { height: calc(100% - 80px); top: 65px; transform: translateX(-50%); } .RulesMsg .rulesItems { overflow-x: hidden !important; overflow-y: scroll !important; height: 505px } .RulesMsg .lb-header { margin-bottom: 10px } .euroRoadToCup { padding: 64px 32px } .euroRoadToCup .groupTaples .group { width: calc((100% - 32px) / 3); margin-left: 16px; margin-bottom: 16px; } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group:nth-child(3n), .tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga:nth-child(3n) .group{margin-left:32px} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group:nth-child(2n), .tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga:nth-child(2n) .group{margin-left:0} /*.euroRoadToCup .groupTaples .group:nth-child(3n){margin-left:32px} .euroRoadToCup .groupTaples .group:nth-child(2n){margin-left:0}*/ /*.euroRoadToCup .groupTaples .GroupTeams{width:278px;margin:10px calc((100% - 278px) / 2) 20px} .euroRoadToCup .groupTaples .GroupTeams li{margin-left:26px}*/ .euroQuizCnts .getReadyTimer p, .euroQuizCnts .resultDiv p { font-size: 30px } .euroInner .socialMargin { width: 100%; padding: 40px 10px 0 } .euroInner .articleSocial.euroSocial.fixed { right: auto; position: absolute; top: 5px } .euroInner .articleSocial.euroSocial { position: absolute; top: 5px; margin-top: 0; width: 76px; height: 40px; left: 0; } .euroInner .articleSocial { display: inline-block } .euroInner .articleInfo .articleSocial { display: none } .euroInner .proPlayer .tabs a { margin-left: 40px } .euroInner .tabs .euroLogo { margin-left: 99px } .euroMain .FullWidthBK .euroHeader { background-position: 116% 71%,6% 96%,39% 102%; background-size: 50%,29%,26%; } .groups .groupTabs .table .wRow .item:nth-child(2) { width: 50px } .groups .groupTabs .table .wRow .item, .groups .groupTabs .table .ttlRow .itemTtl { width: 40px } .groups .groupTabs .table .ttlRow .itemTtl:nth-child(2) { width: 70px } .groups .groupTabs .table .wRow .team img { display: none } .euroMain.proPlayer.LatestNews .listing ul li, .euroMain.proPlayer.Videos .listing ul li { width: calc((100% - 20.1px)/ 2) } .euroMain.proPlayer.LatestNews .listing ul li:nth-child(2n), .euroMain.proPlayer.Videos .listing ul li:nth-child(2n) { margin-left: 0 } .medalPage .maxWidth { width: 100%; margin: 0 } .olympicStrip .euroMain .FullWidthBK .euroHeader { background-size: 78%; background-position: -76%; } .olympicStrip .FullWidthBK .euroHeader img.robotStrip { margin: 12px 30px 0 0 } .olympicStrip .FullWidthBK .euroHeader .textStrip { margin-right: 20px } .olympicStrip .FullWidthBK .euroHeader .textStrip p { font-size: 27px } .olympicStrip .FullWidthBK .euroHeader a { left: 178px } .euroStrip.olympicStrip .spansorheader .spansorEuro { width: 140px; left: 0 } .olympicStrip .spansorheader .spansorEuro a img { width: 140px } /*new gutter*/ .featuredArea ul li:first-child { width: 100%; margin-left: 0 } .featuredArea ul li { width: 100%; margin-left: 0; background: #fff; margin-bottom: 10px } .featuredArea ul li .secName { right: 160px; top: 10px; background: none; color: #0277bd; padding: 0 } .featuredArea ul li:first-child .secName { right: 0; top: 0; background: rgba(0,0,0,0.7); color: #fff; padding: 2px 10px; } .featuredArea ul li.video:first-child .secName, .featuredArea ul li.album:first-child .secName, .featuredArea ul li.infograph:first-child .secName, .featuredArea ul li.sed:first-child .secName { padding: 0 0 0 10px } .featuredArea ul li a .imageCntnr { width: 150px; padding-bottom: calc((150px * 67)/ 100); float: right; } .featuredArea ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 67%; float: right; margin-left: 0 } .featuredArea .desc { float: right; position: relative; width: calc(100% - 150px); height: auto; display: inline-block; background: #fff; padding: 10px; margin-top: 30px } .featuredArea .desc p { color: #000; position: relative; padding: 0 } .featuredArea ul li:first-child .desc { float: right; position: absolute; width: 100%; height: 70%; display: inline-block; padding: 0; margin-top: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0); } .featuredArea ul li:first-child .desc p { color: #fff; position: absolute; padding: 10px } .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5), .featuredArea ul li:last-child { margin-bottom: 10px } .ESFeaturedArea ul li:first-child { width: 100%; height: 570px; } .ESFeaturedArea ul li { width: 100%; } .stats { width: 100%; margin-left: 0 } article .stats { height: 730px } .movedSC .showcaseDiv { display: inline-block; margin: 0 calc((100% - 300px) / 2) 20px; } .pattern1 ul li { width: calc((100% - 40.1px) / 3) } .pattern1 ul li:nth-child(4n) { margin-left: 20px } .pattern1 ul li:nth-child(3n) { margin-left: 0 } .pattern2 ul li { width: calc((100% - 12.1px) / 3) } .pattern2 ul li:first-child { width: calc(100% - ((100% + 6px) / 3)) } .pattern2 ul li:nth-child(3), .pattern2 ul li:nth-child(5), .pattern2 ul li:last-child { margin-left: 6px } .pattern2 ul li:nth-child(7), .pattern2 ul li:nth-child(8), .pattern2 ul li:last-child { margin-bottom: 6px } .pattern2 ul li:nth-child(2), .pattern2 ul li:nth-child(3), .pattern2 ul li:nth-child(2), .pattern2 ul li:nth-child(6), .pattern2 ul li:last-child { margin-left: 0 } .pattern2 ul li:nth-child(7), .pattern2 ul li:nth-child(8), .pattern2 ul li:last-child { margin-bottom: 0 } .pattern3 ul li { width: calc((100% - 30.1px) / 4); margin-left: 10px; margin-bottom: 12px } .pattern3 ul li:first-child { width: calc(100% - ((100% + 10px) / 2)) } .pattern3 ul li .secName { font-size: 12px; overflow: hidden; line-height: 2.5 } .listing ul li { width: calc((100% - 20.1px) / 2); margin-left: 20px; float: right } .listing ul li:nth-child(3n) { margin-left: 20px } .listing ul li:nth-child(2n) { margin-left: 0 } article .artclHdline { font-size: 22px } article .stats .item { width: 100%; margin-bottom: 15px; height: 216px } article .stats .item ul li, article .stats .item.matches ul li { height: 56px; padding: 6px 10px } article.videoTemp .pattern1 ul li, article.albumTemp .pattern1 ul li { width: calc((100% - 20.1px) / 2) } article.videoTemp .pattern1 ul li:nth-child(3n), article.albumTemp .pattern1 ul li:nth-child(3n) { margin-left: 20px } article.videoTemp .pattern1 ul li:nth-child(2n), article.albumTemp .pattern1 ul li:nth-child(2n) { margin-left: 0 } .proPlayer .featuredArea .pattern2 ul li:first-child, .euroMain .importantPlayer ul li:first-child { width: 100% !important } .proPlayer .featuredArea .pattern2 ul li, .euroMain .importantPlayer ul li { width: 100% !important } .proPlayer .featuredArea .pattern2 li .desc { padding: 4px 10px; position: absolute; left: 0; right: auto; } .proPlayer .featuredArea .pattern2 ul li .desc .date { right: 10px } .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((150px * 67)/ 100); width: 150px } .proPlayer .importantPlayer ul li .desc { width: calc(100% - 150px); position: absolute; left: 0; right: auto; } .proPlayer .importantPlayer ul li .secName, .euroMain .importantPlayer .featuredArea ul li.video .secName { right: 125px } .proPlayer .importantPlayer ul li:first-child .desc p { position: relative; padding: 0 } .cd-gallery ul li { position: relative } .cd-gallery li .week { position: absolute; bottom: 10px; right: 10px; margin-top: 0; } .cd-gallery li .tv { position: absolute; bottom: 10px; left: 10px; margin-top: 0; max-width: 175px } .cd-gallery li .teamA { padding-left: 40px } .cd-gallery li .teamA, .cd-gallery li .teamB { width: calc((100% - 110px)/ 2); margin-bottom: 25px; } .cd-gallery li .teamB { padding-right: 40px } .cd-gallery li .teamA img, .cd-gallery li .teamB img { height: 50px; width: auto; border: none; display: inline-block } .cd-gallery li .teamA .teamName, .cd-gallery li .teamB .teamName { display: inline-block; width: 100%; margin: 0; padding-top: 10px; color: #0277bd; font-family: droidBold,Arial; font-size: 15px; line-height: 1.2; text-align: center } .cd-gallery li .resultDiv { float: right; width: 110px; height: 110px; position: relative } .cd-gallery li .resultDiv .result { color: #000; font-size: 32px; font-family: arial; display: inline-block; width: 50%; position: relative } .cd-gallery li .resultDiv .result:first-of-type { float: right; text-align: right } .cd-gallery li .resultDiv .result:first-of-type:after { content: "-"; position: absolute; left: -5px } .cd-gallery li .resultDiv .result:last-of-type { float: left; text-align: left } .matchesCenter .tab { width: 100% } .matchesCenter .dayDetailsTtl { height: 90px; } .matchesCenter .toursDropdown { width: 110px; position: absolute; right: 10px; bottom: 10px; } .matchesCenter .matchesNow { width: 110px; position: absolute; right: 125px; bottom: 10px; } .matchesCenter .toursMatchesNum { position: absolute; left: 10px; bottom: 10px; } .matchesCenter .tab button { width: calc((100% - 85px) / 7) } .matchesCenter .tab button:before { width: 50px; height: 50px } .matchesCenter .tab button p { font-size: 20px } .matchesCenter .tab button span { margin-top: -2px } .matchesCenter .dateBtn { width: 45px; height: 45px } .matchesCenter .icon-date:before { font-size: 26px } .Team_Page .featuredArea .desc { margin-top: 10px } .tourStats.stats .item { width: calc((100% - 16px)/ 2); } .tourStats.stats .item:nth-of-type(2n) { margin-left: 0 } .Team_Page .list .Team1 ul li { width: calc((100% - 16px) / 2); } .Team_Page .list .Team1 ul li:nth-of-type(3n) { margin-left: 16px } .Team_Page .list .Team1 ul li:nth-of-type(2n) { margin-left: 0 } .Team_Page .list .Team1 .numm { width: 45px } .Team_Page .list .Team1 .P-name a { font-size: 11px } .Team_Page .list .Team1 .P-name { width: calc(100% - 102px); } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl { padding: 0 8px } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl p { font-size: 13px } .PalyerStats.tourStats.stats .item { width: calc((100% - 16px) / 2) !important; } .PalyerStats.tourStats.stats .item:nth-of-type(2n) { margin-left: 16px } .transfersPage.transferList .listing ul li:nth-child(2n) { margin-left: 16px; } .transfersPage.transferList .listing ul li:nth-child(4n) { margin-left: 0; } .transfersPage.transferList .listing ul li { padding: 10px !important } .tour2694 .euroRoadToCup .title h1 { font-size: 36px; height: 90px; } .tour2694 .euroRoadToCup .title span { font-size: 16px } .tour2694 .euroRoadToCup .title h1:before { width: 44px; height: 90px } .viewTabContainer { padding: 50px 30px 30px } .tour2694 .euroRoadToCup .breadcrumbDiv { margin-bottom: 30px } .tour2694 .euroRoadToCup .groupTaples .group { margin-left: 16px; margin-bottom: 16px; width: calc((100% - 16px)/ 2); } .tour2694 .euroRoadToCup .groupTaples .group:nth-child(3n) { margin-left: 16px } .tour2694 .euroRoadToCup .viewTabContainer .camel { left: 30px } .tour2694 .euroRoadToCup .viewTabContainer .eagles { left: 30px; top: 30px } .tour2694 .euroRoadToCup .groups { padding-bottom: 50px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams { width: 272px; margin: 10px calc((100% - 272px) / 2) 20px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li { margin-left: 24px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li:last-of-type { margin-left: 0; } .tabs-nav > li { padding: 20px 30px } .tour2694 .euroRoadToCup .allRounds .roundItem .qualifiedTeams .cupWinner .TeamName { font-size: 17px } .euroPredCnts .predictionCnts .saveHint { width: 1000px } .newPred .pagecnts { width: 1180px; margin: 0 calc((100% - 1180px) / 2) } /*.newPred .prediction{padding:50px}*/ .newPred .proPlayer .title .leagueSetting a { padding: 0 20px; height: 40px } .newPred .proPlayer .title .leagueSetting a .cont p, .newPred .proPlayer .title .leagueSetting a .cont span:before { line-height: 40px !important } } @media screen and (min-width:1152px) and (max-width:1279px) { .cafLgFinal .wrapper { max-width: 900px } .cafLgFinal section { margin-bottom: 40px } .ahlyFans.cafLgFinal .votingBtn .second:before { background-size: auto 100%; } .zamalekFans.cafLgFinal .votingBtn .second:before { background-size: auto 100%; } .cafLgFinal .featuredArea ul li { background: transparent } .cafLgFinal .featuredArea ul li a .imageCntnr { width: 100%; padding-bottom: 67% } .cafLgFinal .featuredArea .desc { width: 100%; height: 70px; position: absolute; bottom: 0; padding: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0) } .cafLgFinal .featuredArea .desc p { color: #fff; position: absolute; padding: 0 10px; height: 52px; } .cafLgFinal .featuredArea ul li:first-child .desc p { height: auto } .cafLgFinal .listing ul li { border: none; width: calc((100% - 32.1px) / 3) } .LandingPage.CAF .landingTeam { width: 52% } .LandingPage.CAF .landingTeam .line a { width: 84px; height: 34px; font-size: 15px; line-height: 2.2; } .cafLgFinal .quizContainer .listing ul li:first-child a .imageCntnr { width: 300px; padding-bottom: calc((300px * 67)/ 100); } .cafLgFinal .quizContainer .listing ul li:first-child .desc { width: calc(100% - 320px); margin-top: 30px } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .desc p { font-size: 20px; max-height: 72px; height: auto; margin-bottom: 30px; } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .bottomBox { margin-right: 20px; width: calc(100% - 320px); margin-top: 10px } .LandingPage.CAF .aqarLogo { bottom: 45px; right: 45px; } .cafLgFinal .championSponsor .desktop img { width: 85px; } .cafLgFinal .championSponsor .desktop .todo { left: 3% } .proPlayer .FullWidthBK h1 { font-size: 52px } .proPlayer .featuredArea .pattern2 ul li:first-child, .proPlayer .importantPlayer ul li:first-child { width: 100%; height: auto; margin-bottom: 16px } .proPlayer .featuredArea .pattern2 ul li, .proPlayer .importantPlayer ul li { width: 100%; height: 100px } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr, .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((150px * 67)/ 100); width: 150px; float: right } .proPlayer .featuredArea .pattern2 li .desc, .proPlayer .importantPlayer ul li .desc { width: calc(100% - 150px); margin-top: 0 } .proPlayer .featuredArea .pattern2 ul li.video .secName, .proPlayer .importantPlayer ul li.video .secName { right: 125px } .proPlayer .importantPlayer ul li:first-child .desc .date { padding: 0 } .proPlayer .importantPlayer ul li:first-child .desc p { position: relative; padding: 0 } .proPlayer .remainContent .listing ul li { width: calc((100% - 16.1px) / 2) } .proPlayer .remainContent .listing ul li:nth-of-type(4n) { margin-left: 16px } .proPlayer .remainContent .listing ul li:nth-of-type(2n) { margin-left: 0 } .proPlayer .featuredArea .pattern2 ul li .desc .date, .proPlayer .importantPlayer ul li .desc .date { position: absolute; right: 15px; bottom: 5px } .proPlayer .FullWidthBK.proBG h1 { right: 60px; font-size: 46px } .proPlayer .FullWidthBK.proBG img.newPro { left: 10px; height: 140px } .proPlayer .FullWidthBK.proBG .lines { width: 10px } .proPlayer .FullWidthBK.proBG .lines.leftBlue { left: 24px } .proPlayer .FullWidthBK.proBG .lines.leftRed { left: 310px } .proPlayer .FullWidthBK.proBG .lines.leftYellow { left: 326px } .proPlayer .FullWidthBK.proBG .lines.rightBlue { right: 32px; top: 80px } .proPlayer .FullWidthBK.proBG .lines.rightYellow { right: 16px; top: 20px } .proPlayer .playerInfo .info h2 { font-size: 24px; margin-bottom: 5px } .proPlayer .playerInfo .info .team img { width: 28px } .proPlayer .playerInfo .personalInfo { width: 100%; padding-left: 0; margin-top: 15px } .proPlayer .playerInfo .personalInfo ul li:last-child { border-bottom: 0 } .proPlayer .playerInfo .info .team { width: 100% } .proPlayer .playerInfo .info .team span { line-height: 1.8; font-size: 16px } .proPlayer .IContainer { padding: 30px 0 0 0 } .proPlayer .playerInfo .playerImg { width: 260px; margin-right: 25px; margin-top: 20px; } .proPlayer .playerInfo .personalInfo ul { margin-top: 0; padding-left: 10px } .proPlayer .IContainer .infoContainer { width: calc(100% - 315px); margin-right: 30px } .proPlayer .playerInfo .number { font-size: 70px; top: 32px } .proPlayer .playerInfo .personalInfo ul li { padding: 4px 0 } .proPlayer .remainContent .Pcnt ul li:first-child { margin-right: 16px } .euroMain .featuredArea .pattern2 ul li:first-child, .euroMain .importantPlayer ul li:first-child { width: 100% !important } .euroMain .featuredArea .pattern2 ul li, .euroMain .importantPlayer ul li { width: 100% !important } .euroMain .featuredArea .pattern2 li .desc { padding: 4px 10px; } .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((150px * 67) / 100); width: 150px; } .euroMain .importantPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 150px); } .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName { right: 125px } .euroMain .featuredArea .pattern2 ul li .desc .date { right: 10px } .euroPredCnts .predHint, .euroRoadToCup .predHint { padding: 20px 10px; min-height: 100% } .euroPredCnts .predHint .hintMsg h3, .euroRoadToCup .predHint .hintMsg h3 { font-size: 18px; line-height: 1.8; text-align: center } .euroPredCnts .predHint .hintMsg p, .euroRoadToCup .predHint .hintMsg p { text-align: center; margin: 20px 0 30px; font-size: 12px; } .euroPredCnts .predHint .regBtn, .euroRoadToCup .predHint .regBtn { position: relative; bottom: 0; left: 0; width: 100%; height: 40px; display: inline-block; line-height: 3.0; font-size: 14px; } .euroPredCnts .predictionCnts .tourTitle { padding: 0 10px } .euroPredCnts .predictionCnts .tourTitle .shape { width: 14px; height: 14px; margin-top: 18px; } .euroPredCnts .predictionCnts .tourTitle h3 { width: calc(100% - 18px); font-size: 14px; line-height: 3.6; padding-right: 10px; } .euroPredCnts .predictionCnts .tourTitle h3 span { font-size: 11px; } .euroPredCnts .predictionCnts .tourTitle .jokerCount { left: 10px } .euroPredCnts .predictionCnts .tourTitle .jokerCount .icon-joker:before { font-size: 14px } .euroPredCnts .predictionCnts .tourTitle .jokerCount p { font-size: 12px; line-height: 1.4 } .euroPredCnts .predictionCnts .tourTitle .jokerCount p span { font-size: 16px } .euroPredCnts .predictionCnts .accordionItem .matchData { height: 110px; padding: 0 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData .date p { line-height: 4.2; margin-left: 10px; font-size: 11px; width: auto } .euroPredCnts .predictionCnts .accordionItem .matchData .date p.day { width: auto } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { font-size: 11px; width: auto; text-align: center; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 .teamName { position: absolute; left: 54px; top: 50%; transform: translateY(-50%); text-align: left; padding-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 .teamName { position: absolute; right: 54px; top: 50%; transform: translateY(-50%); text-align: right; padding-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: 100%; top: auto; left: 0; transform: none; bottom: 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData a { display: inline-block; width: calc(100% - 30px) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult img { margin: 4px calc((100% - 20px) / 2) 2px; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 img { margin: 0; margin-right: 10px; position: absolute; left: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 img { margin: 0; margin-left: 10px; position: absolute; right: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 4px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 4px } .euroPredCnts .predictionCnts .matchData .predStatus { width: 70px; left: 40px; top: 10px; transform: none; height: 22px; } .euroPredCnts .predictionCnts .matchData .predStatus .status { font-size: 10px; line-height: 2.2; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { font-size: 12px; margin-right: 2px; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult { height: 52px; position: relative } .euroPredCnts .predictionCnts .matchData span.icon-plus { left: 10px; top: 10px; transform: none } .euroPredCnts .predictionCnts .matchData span.icon-plus::before, .euroPredCnts .predictionCnts .matchData span.icon-plus::after { width: 10px } .euroPredCnts .predictionCnts .matchData span.icon-plus::after { left: 6px } .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus { -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); -ms-transform: rotateX(180deg); -o-transform: rotateX(180deg); transform: rotateX(180deg); } .euroPredCnts .item .matchPrediction .team { width: calc((100% - 50px) / 2) } .euroPredCnts .item .matchPrediction .team.team1 { padding-left: 50px; } .euroPredCnts .item .matchPrediction .team.team2 { padding-right: 50px; } .euroPredCnts .item .matchPrediction .teamName, .euroPredCnts .item .matchPrediction .teamScoring p { font-size: 11px; width: 100%; text-align: center; line-height: 2; } .euroPredCnts .item .matchPrediction .dash { width: 50px; } .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points { line-height: 20px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { font-size: 11px; width: auto; text-align: center; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 .teamName { position: absolute; left: 54px; top: 50%; transform: translateY(-50%); text-align: left; padding-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 .teamName { position: absolute; right: 54px; top: 50%; transform: translateY(-50%); text-align: right; padding-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: 100%; top: auto; left: 0; transform: none; bottom: 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData a { display: inline-block; width: calc(100% - 30px) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult img { margin: 4px calc((100% - 20px) / 2) 2px; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 img { margin: 0; margin-right: 10px; position: absolute; left: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 img { margin: 0; margin-left: 10px; position: absolute; right: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 4px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 4px } .euroPredCnts .item .matchPrediction form, .euroPredCnts .item .matchPrediction .value-button { width: 30px } .euroPredCnts .item .matchPrediction input.number { width: 30px; height: 30px; font-size: 18px; } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem { padding: 10px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item { width: 100%; margin-left: 0; margin-bottom: 16px; height: 152px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item:last-of-type { margin-bottom: 0 } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item .predMatchTitle { height: 34px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item .predMatchTitle h3 { font-size: 13px; line-height: 2.6 } .euroPredCnts .predMatchTitle .predJoker { width: 22px; height: 22px } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"] + label { font-size: 16px } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"] + label .icon-joker:before { left: 4px } .LandingPage.CAF, .euroSquad .LandingPage.CAF, .chseSqMain.legendsSquad, .chseSqMain.chooseTeam { padding-bottom: 60% } .legends:before { right: 40px; top: 30px; width: 160px; height: 120px; background-size: 160px 120px; } .LandingPage.CAF.legends .text { right: 40px; transform: translateY(calc(-50% + 30px)); width: 420px; } .LandingPage.CAF.legends .text h1 { font-size: 42px; margin-bottom: 10px; } .LandingPage.CAF.legends .text p { font-size: 20px } .LandingPage.CAF.legends .text .startSquad { width: 220px; height: 60px; font-size: 20px; line-height: 2.8 } .euroSquadPage .shareBtn { right: 50px; bottom: 30px } .euroSquadPage .sponsors { bottom: 30px; left: 50px } .chseSqMain.legends:before { width: 120px; height: 90px; background-size: 120px 90px; right: 40px } .euroSquadPage .chseSqMain .sponsors { left: 40px } .euroSquadPage .chseSqMain .sponsors a img { height: 34px; } .chseSqMain .allForms { bottom: 60px !important } .chseSqMain .allForms a { line-height: 1.9 !important } .chseSqMain .col3 .allForms a { line-height: 2.6 !important } .euroSquadPage .chseSqMain .sponsors a img { height: 30px; } .euroSquad .chseTtl { width: calc(100% - 590px); right: 50px; height: 368px; padding-top: 140px; } .euroSquad .chseTtl h1 { font-size: 32px } .euroSquad .chseTtl p { width: 260px; font-size: 18px; } .euroSquad .chseTtl:before, .euroSquadPage .chseSqMain.chooseTeam:before { width: 102px; height: 120px; background-size: 102px auto; } .euroSquadPage .chseSqMain.chooseTeam:before { right: 40px; top: 40px } .euroSquadPage .chseSqMain.chooseTeam:after { left: 40px } .euroSquad .LandingPage.CAF:before { left: 50px; top: 40px; width: 94px; height: 40px; background-size: 94px auto } .euroSquadPage .chseSqMain.chooseTeam:after { top: 40px; width: 94px; height: 40px; background-size: 94px auto } .euroSquad .LandingPage.CAF .landingTeam { width: 480px; left: 50px } .euroSquad .LandingPage.CAF .landingTeam li { margin-left: 12px; margin-bottom: 12px; width: 70px } .euroSquad .LandingPage.CAF .landingTeam li a { padding: 10px } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+6) { margin-bottom: 0; } .euroSquad .LandingPage.CAF .landingTeam li .imgCntnr { margin-bottom: 16px } .euroSquad .LandingPage.CAF .landingTeam li p { font-size: 13px } .euroSquadPage .shareBtn a.faceShare, .euroSquadPage .shareBtn a.twShare { font-size: 26px } .euroInner article .maxWidth { width: 100%; margin: 0; padding: 0 15px 15px } .euroInner .articleHeader { width: calc(100% - 336px); padding: 0 15px } .euroInner .articleHeader .artclHdline { width: 100%; margin: 0 } .euroInner .relatedArticles ul li.item .desc { width: 180px } .euroInner .proPlayer .tabs a { margin-left: 40px } .euroInner .tabs .euroLogo { margin-left: 99px } .euroInner .articleHeader .articleInfo .articleAuthor { width: auto } .euroInner .articleHeader .articleInfo { height: auto } .euroInner .matchcenter .maxWidth { width: 100%; margin: 0 } .euroInner .matchcenter .matchesList ul li .leftCol { width: 100px } .euroInner .matchcenter .matchesList ul li .allData { width: calc(100% - 100px) } .euroInner .matchcenter .matchesList ul li .channel { width: 88px } .euroInner .matchcenter .matchesList ul li .channel:before { line-height: 1.8 } .euroInner .matchcenter .matchesList ul li .topData { padding: 15px 10px 45px } .euroInner .matchcenter .matchesList ul li .channel { left: 10px } .euroInner .matchcenter .matchesList ul li .leftCol { padding: 20px 10px } .groups .groupTabs .table .wRow .item:nth-child(2) { margin-left: 45px } .fanZone .cntnr { width: 100%; padding: 80px 20px; margin: 0 } .fanZone ul li { width: calc((100% - 40px) /3) !important } .fanZone ul li h2 { font-size: 22px } .fanZone ul li p { font-size: 12px } .fanZone ul li.FZQuiz .gameImg { width: 135px; left: 0 } .fanZone ul li .dtlsCorner { width: 120px } .fanZone ul li.FZPred p { width: 100% } .fanZone ul li.FZPred .gameImg { width: 160px } .login-box.signUpActive.error, .login-box.loginActive.error { margin-top: 20px } .passwordPage .cntnr { width: 100%; margin: 0 } .RulesMsg .cntnr { height: calc(100% - 80px); top: 65px; transform: translateX(-50%); } .RulesMsg .rulesItems { overflow-x: hidden !important; overflow-y: scroll !important; height: 478px } .RulesMsg .lb-header { margin-bottom: 10px } .euroRoadToCup { padding: 64px 32px } .euroRoadToCup .groupTaples .group { width: calc((100% - 16px) / 2); margin-left: 16px; margin-bottom: 16px; } .euroRoadToCup .groupTaples .group:nth-child(3n) { margin-left: 16px } .euroRoadToCup .groupTaples .group:nth-child(2n) { margin-left: 0 } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group:nth-child(3n), .tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga:nth-child(3n) .group{margin-left:32px} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group:nth-child(2n), .tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga:nth-child(2n) .group{margin-left:0} /*.euroRoadToCup .groupTaples .GroupTeams{width:278px;margin:10px calc((100% - 278px) / 2) 20px} .euroRoadToCup .groupTaples .GroupTeams li{margin-left:26px}*/ .euroRoadToCup .Place3rd { width: 100%; margin: 0; } .tour2694 .euroRoadToCup .allRounds .roundItem { width: calc((100% - 40px) / 3); margin-left: 20px; } .tour2694 .euroRoadToCup .allRounds .roundItem:last-child { margin-left: 0 } .second .teamData:last-child:before, .second .teamData:first-child:before, .third .teamData:last-child:before, .third .teamData:first-child:before, .final .teamData:last-child:before, .final .teamData:first-child:before { width: 14px; right: -10px; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .euroRoadToCup .allRounds .roundItem .cupWinner h3 { font-size: 16px } .tour2694 .euroRoadToCup .allRounds .roundItem .qualifiedTeams .cupWinner .TeamName { font-size: 17px } .euroQuizCnts .getReadyTimer p, .euroQuizCnts .resultDiv p { font-size: 28px; margin-bottom: 24px; } .euroInner .articleSocial.euroSocial.fixed { right: 10.6% } .euroMain .FullWidthBK .euroHeader { background-position: 116% 71%,6% 96%,39% 102%; background-size: 50%,29%,26%; } .euroInner .socialMargin { width: 100%; padding: 40px 10px 0 } .euroInner .articleSocial.euroSocial.fixed { right: auto; position: absolute; top: 5px } .euroInner .articleSocial.euroSocial { position: absolute; top: 5px; margin-top: 0; width: 76px; height: 40px; left: 0; } .euroInner .articleSocial { display: inline-block } .euroInner .articleInfo .articleSocial { display: none } .groups .groupTabs .table .wRow .item:nth-child(2) { width: 65px } .groups .groupTabs .table .wRow .item, .groups .groupTabs .table .ttlRow .itemTtl { width: 40px } .groups .groupTabs .table .ttlRow .itemTtl:nth-child(2) { width: 70px } .groups .groupTabs .table .wRow .team img { display: none } .medalPage .maxWidth { width: 100%; margin: 0 } .olympicStrip .euroMain .FullWidthBK .euroHeader { background-size: 87%; background-position: -261%; } .olympicStrip .FullWidthBK .euroHeader img.robotStrip { margin: 12px 30px 0 0 } .olympicStrip .FullWidthBK .euroHeader .textStrip { margin-right: 20px } .olympicStrip .FullWidthBK .euroHeader .textStrip p { font-size: 27px } .olympicStrip .FullWidthBK .euroHeader a { left: 178px } .euroStrip.olympicStrip .spansorheader .spansorEuro { width: 140px; left: 22px } .olympicStrip .spansorheader .spansorEuro a img { width: 140px } /*new gutter*/ .pattern2 ul li { width: calc((100% - 12.1px) / 3) } .pattern2 ul li:first-child { width: calc(100% - ((100% + 6px) / 3)) } .pattern2 ul li:nth-child(3), .pattern2 ul li:nth-child(5), .pattern2 ul li:last-child { margin-left: 6px } .pattern2 ul li:nth-child(7), .pattern2 ul li:nth-child(8), .pattern2 ul li:last-child { margin-bottom: 6px } .pattern2 ul li:nth-child(2), .pattern2 ul li:nth-child(3), .pattern2 ul li:nth-child(2), .pattern2 ul li:nth-child(6), .pattern2 ul li:last-child { margin-left: 0 } .pattern3 ul li { width: calc((100% - 30.1px) / 4); margin-left: 10px; margin-bottom: 12px } .pattern3 ul li:first-child { width: calc(100% - ((100% + 10px) / 2)) } .pattern3 ul li .secName { font-size: 12px; overflow: hidden; line-height: 2.5 } article .artclHdline { font-size: 22px } article .stats .item { width: 100%; margin-bottom: 15px; height: 216px } article .stats .item ul li, article .stats .item.matches ul li { height: 56px; padding: 6px 10px } article.videoTemp .pattern1 ul li, article.albumTemp .pattern1 ul li { width: calc((100% - 20.1px) / 2) } article.videoTemp .pattern1 ul li:nth-child(3n), article.albumTemp .pattern1 ul li:nth-child(3n) { margin-left: 20px } article.videoTemp .pattern1 ul li:nth-child(2n), article.albumTemp .pattern1 ul li:nth-child(2n) { margin-left: 0 } .cd-gallery li .tv { position: absolute; bottom: 10px; left: 10px; margin-top: 0; max-width: 175px } .matchesCenter .tab { padding: 0 } .matchesCenter .tab button { width: calc((100% - 86px) / 7) !important; } .matchesCenter .tab button:before { width: 50px; height: 50px } .matchesCenter .tab button p { font-size: 20px } .matchesCenter .tab button span { margin-top: -2px } .matchesCenter .dateBtn { width: 45px; height: 45px } .matchesCenter .icon-date:before { font-size: 26px } .matchesCenter .toursDropdown { width: 110px; position: absolute; right: 10px; bottom: 10px; } .matchesCenter .matchesNow { width: 110px; position: absolute; right: 125px; bottom: 10px; } .Team_Page .featuredArea .desc { margin-top: 10px } .tourStats.stats .item { width: calc((100% - 16px)/ 2); } .tourStats.stats .item:nth-of-type(2n) { margin-left: 0 } .Team_Page .list .Team1 ul li { width: calc((100% - 16px) / 2); } .Team_Page .list .Team1 ul li:nth-of-type(3n) { margin-left: 16px } .Team_Page .list .Team1 ul li:nth-of-type(2n) { margin-left: 0 } .Team_Page .list .Team1 .numm { width: 45px } .Team_Page .list .Team1 .P-name a { font-size: 11px } .Team_Page .list .Team1 .P-name { width: calc(100% - 102px); } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl { padding: 0 8px } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl p { font-size: 13px } .proPlayer .interestedArticles, .proPlayer .tourMatches { width: 100% } .tour2694 .euroRoadToCup .title h1 { font-size: 36px; height: 90px; } .tour2694 .euroRoadToCup .title span { font-size: 16px } .tour2694 .euroRoadToCup .title h1:before { width: 44px; height: 90px } .viewTabContainer { padding: 50px 30px 30px } .tour2694 .euroRoadToCup .breadcrumbDiv { margin-bottom: 30px } .tour2694 .euroRoadToCup .groupTaples .group { margin-left: 16px; margin-bottom: 16px; width: calc((100% - 16px)/ 2); } .tour2694 .euroRoadToCup .groupTaples .group:nth-child(3n) { margin-left: 16px } .tour2694 .euroRoadToCup .viewTabContainer .camel { left: 30px } .tour2694 .euroRoadToCup .viewTabContainer .eagles { left: 30px; top: 30px } .tour2694 .euroRoadToCup .groups { padding-bottom: 50px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams { width: 272px; margin: 10px calc((100% - 272px) / 2) 20px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li { margin-left: 24px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li:last-of-type { margin-left: 0; } .tabs-nav > li { padding: 20px 30px } .euroPredCnts .predictionCnts .saveHint { width: 800px } .chooseLeague ul li { width: 250px; } .chooseLeague ul li:nth-of-type(6n) { margin-left: 10px } .chooseLeague ul li:nth-of-type(5n) { margin-left: 0 } .chooseLeague ul li a { display: inline-block; width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; text-align: center } .chooseLeague ul li img { height: 45px; position: relative; top: auto; left: auto; transform: none; } .chooseLeague ul li p { font-size: 14px; margin-top: 8px } .newPred .pagecnts { width: 1052px; margin: 0 calc((100% - 1052px) / 2) } /*.newPred .prediction{padding:40px 25px}*/ .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.num { width: 150px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item { width: calc((100% - 150px)/2) } .newPred .proPlayer .title .leagueSetting { width: 100%; margin-top: 5px; float: right } .newPred .proPlayer .title .leagueSetting a { padding: 0 20px; height: 40px } .newPred .proPlayer .title .leagueSetting a .cont p, .newPred .proPlayer .title .leagueSetting a .cont span:before { line-height: 40px !important } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.totalPoints, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.totalPoints { width: 150px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item { width: calc(100% - 400px); } .euroPredCnts .FullWidthBK h1:first-child { font-size: 42px } } @media screen and (min-width:1024px) and (max-width:1151px) { .cafLgFinal .wrapper { max-width: 780px } .cafLgFinal section { margin-bottom: 40px } .ahlyFans.cafLgFinal .votingBtn .second:before { background-size: auto 100%; } .zamalekFans.cafLgFinal .votingBtn .second:before { background-size: auto 100%; } .ahlyFans.cafLgFinal .votingBtn .second .socialMediaBtn p { width: 70px; line-height: 1.6; font-size: 12px; text-align: left; } .zamalekFans.cafLgFinal .votingBtn .second .socialMediaBtn p { width: 70px; line-height: 1.6; font-size: 12px; text-align: left; } .cafLgFinal .featuredArea ul li { width: 100%; margin-left: 0; margin-bottom: 16px; background: #222 } .cafLgFinal .featuredArea ul li:last-child { margin-bottom: 0 } .cafLgFinal .featuredArea .desc { margin-top: 0; background: #222 } .cafLgFinal .featuredArea .desc p { height: 66px; color: #fff } .cafLgFinal .pattern2 ul li:first-child { width: calc(100% - ((100% + 6px)/ 3)) } .cafLgFinal .pattern2 ul li { width: calc((100% - 12.1px)/ 3) } .cafLgFinal .listing ul li { border: none; width: calc((100% - 32.1px) / 3) } .cafLgFinal .entryPoint { width: 100%; margin-right: 0; margin-left: 0; } .cafLgFinal .quizContainer .listing ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100); } .cafLgFinal .quizContainer .listing ul li .desc { width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .quizContainer .listing ul li { padding: 10px } .cafLgFinal .quizContainer .listing.quizListing ul li .desc p { font-size: 14px; height: 45px; } .cafLgFinal .quizContainer .listing.quizListing ul li .bottomBox { margin-top: 0; width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .quizContainer .listing.quizListing ul li .bottomBox label { width: 80px; height: 24px; font-size: 11px; line-height: 2.4 } .cafLgFinal .quizContainer .listing ul li:first-child { padding: 10px } .LandingPage.CAF .landingTeam { width: 52% } .LandingPage.CAF .landingTeam .line a { width: 70px; height: 30px; font-size: 13px; line-height: 2.4; } .cafLgFinal .quizContainer .listing ul li:first-child a .imageCntnr { width: 300px; padding-bottom: calc((300px * 67)/ 100); } .cafLgFinal .quizContainer .listing ul li:first-child .desc { width: calc(100% - 320px); margin-top: 30px } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .desc p { font-size: 20px; max-height: 72px; height: auto; margin-bottom: 30px; } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .bottomBox { margin-right: 20px; width: calc(100% - 320px); margin-top: 10px } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .bottomBox label { float: right; width: 110px; height: 34px; font-size: 13px; line-height: 2.6 } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .bottomBox label .icon-arrow:before { font-size: 10px; margin-right: 6px } .cafLgFinal .listing.quizPartial ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100); } .cafLgFinal .listing.quizPartial ul li .desc { width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .listing.quizPartial ul li { padding: 10px } .cafLgFinal .listing.quizPartial ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100); } .cafLgFinal .listing.quizPartial ul li .desc { width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .listing.quizPartial ul li .desc p { font-size: 14px; height: 45px; } .cafLgFinal .listing.quizPartial ul li .bottomBox { margin-top: 0; width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .listing.quizPartial ul li .bottomBox label { width: 80px; height: 24px; font-size: 11px; line-height: 2.4 } .LandingPage.CAF .aqarLogo { bottom: 40px; right: 40px; } .cafLgFinal .championSponsor .desktop img { width: 85px; } .cafLgFinal .championSponsor .desktop .todo { left: 3% } .proPlayer .FullWidthBK h1 { font-size: 50px; } .proPlayer .FullWidthBK img.player { height: 140px; left: 30px } .proPlayer .featuredArea .pattern2 ul li:first-child, .proPlayer .importantPlayer ul li:first-child { width: 100%; height: auto; margin-bottom: 16px; } .proPlayer .featuredArea .pattern2 ul li:first-child .desc p { font-size: 20px; max-height: 74px } .proPlayer .featuredArea .pattern2 ul li, .proPlayer .importantPlayer ul li { width: 100%; height: 100px } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr, .proPlayer .importantPlayer ul li a .imageCntnr { padding-bottom: calc((150px * 67)/ 100); width: 150px; float: right } .proPlayer .featuredArea .pattern2 li .desc, .proPlayer .importantPlayer ul li .desc { width: calc(100% - 150px); margin-top: 0 } .proPlayer .featuredArea .pattern2 ul li.video .secName, .proPlayer .importantPlayer ul li.video .secName { right: 125px } .proPlayer .importantPlayer ul li:first-child .desc .date { padding: 0 } .proPlayer .importantPlayer ul li:first-child .desc p { position: relative; padding: 0; font-size: 20px; max-height: 74px } .proPlayer .remainContent .listing ul li { width: calc((100% - 16.1px) / 2) } .proPlayer .remainContent .listing ul li:nth-of-type(4n) { margin-left: 16px } .proPlayer .remainContent .listing ul li:nth-of-type(2n) { margin-left: 0 } .proPlayer .featuredArea .pattern2 ul li .desc .date, .proPlayer .importantPlayer ul li .desc .date { position: absolute; right: 15px; bottom: 5px } .proPlayer .remainContent .Pcnt ul li:first-child { margin-right: 16px } .proPlayer .FullWidthBK.proBG h1 { right: 60px; font-size: 46px } .proPlayer .FullWidthBK.proBG img.newPro { left: 10px; height: 140px } .proPlayer .FullWidthBK.proBG .lines { width: 10px } .proPlayer .FullWidthBK.proBG .lines.leftBlue { left: 24px } .proPlayer .FullWidthBK.proBG .lines.leftRed { left: 310px } .proPlayer .FullWidthBK.proBG .lines.leftYellow { left: 326px } .proPlayer .FullWidthBK.proBG .lines.rightBlue { right: 32px; top: 80px } .proPlayer .FullWidthBK.proBG .lines.rightYellow { right: 16px; top: 20px } .proPlayer .playerInfo { padding: 0 } .proPlayer .playerInfo .playerImg { width: 130px; margin-top: 0; margin-right: 0 } .proPlayer .playerInfo .info { width: calc(100% - 140px); } .proPlayer .playerInfo .info h2 { font-size: 20px; margin-bottom: 5px } .proPlayer .playerInfo .info .team img { width: 22px } .proPlayer .playerInfo .personalInfo { width: 100%; padding-left: 0; margin-top: 0 } .proPlayer .playerInfo .personalInfo ul li:last-child { border-bottom: 0 } .proPlayer .playerInfo .number { position: relative; right: auto; top: auto; float: right; width: 100%; margin-top: 38px; font-size: 28px; text-align: right } .proPlayer .playerInfo .info .team { width: 100% } .proPlayer .playerInfo .info .team span { line-height: 1.8; font-size: 14px } .proPlayer .IContainer { padding: 30px 0 0 0 } .proPlayer .playerInfo .personalInfo ul li label { width: auto; font-size: 14px } .proPlayer .playerInfo .personalInfo ul { margin-top: 10px } .proPlayer .playerInfo .personalInfo ul li { padding: 5px 10px } .proPlayer .playerInfo .personalInfo ul li p { float: left; font-size: 14px } .proPlayer .IContainer .infoContainer { display: block; width: 100%; float: unset; margin-right: 0; } .euroMain .tabs a { margin-left: 50px } .euroMain .featuredArea .pattern2 ul li:first-child, .euroMain .importantPlayer ul li:first-child { width: 100% !important } .euroMain .featuredArea .pattern2 ul li, .euroMain .importantPlayer ul li { width: 100% !important } .euroMain .featuredArea .pattern2 li .desc { padding: 4px 10px; } .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((150px * 67) / 100); width: 150px; } .euroMain .importantPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 150px); } .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName { right: 125px } .euroMain .featuredArea .pattern2 ul li .desc .date { right: 10px } .euroPredCnts .predHint, .euroRoadToCup .predHint { padding: 20px 10px; min-height: 100% } .euroPredCnts .predHint .hintMsg h3, .euroRoadToCup .predHint .hintMsg h3 { font-size: 18px; line-height: 1.8; text-align: center } .euroPredCnts .predHint .hintMsg p, .euroRoadToCup .predHint .hintMsg p { text-align: center; margin: 20px 0 30px; font-size: 12px; } .euroPredCnts .predHint .regBtn, .euroRoadToCup .predHint .regBtn { position: relative; bottom: 0; left: 0; width: 100%; height: 40px; display: inline-block; line-height: 3.0; font-size: 14px; } .euroPredCnts .predictionCnts .tourTitle { padding: 0 10px } .euroPredCnts .predictionCnts .tourTitle .shape { width: 14px; height: 14px; margin-top: 18px; } .euroPredCnts .predictionCnts .tourTitle h3 { width: calc(100% - 18px); font-size: 14px; line-height: 3.6; padding-right: 10px; } .euroPredCnts .predictionCnts .tourTitle h3 span { font-size: 11px; } .euroPredCnts .predictionCnts .tourTitle .jokerCount { left: 10px } .euroPredCnts .predictionCnts .tourTitle .jokerCount .icon-joker:before { font-size: 14px } .euroPredCnts .predictionCnts .tourTitle .jokerCount p { font-size: 12px; line-height: 1.4 } .euroPredCnts .predictionCnts .tourTitle .jokerCount p span { font-size: 16px } .euroPredCnts .predictionCnts .accordionItem .matchData { height: 110px; padding: 0 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData .date p { line-height: 4.2; margin-left: 10px; font-size: 11px; width: auto } .euroPredCnts .predictionCnts .accordionItem .matchData .date p.day { width: auto } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { font-size: 11px; width: auto; text-align: center; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 .teamName { position: absolute; left: 54px; top: 50%; transform: translateY(-50%); text-align: left; padding-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 .teamName { position: absolute; right: 54px; top: 50%; transform: translateY(-50%); text-align: right; padding-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: 100%; top: auto; left: 0; transform: none; bottom: 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData a { display: inline-block; width: calc(100% - 30px) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult img { margin: 4px calc((100% - 20px) / 2) 2px; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 img { margin: 0; margin-right: 10px; position: absolute; left: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 img { margin: 0; margin-left: 10px; position: absolute; right: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 4px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 4px } .euroPredCnts .predictionCnts .matchData .predStatus { width: 70px; left: 40px; top: 10px; transform: none; height: 22px; } .euroPredCnts .predictionCnts .matchData .predStatus .status { font-size: 10px; line-height: 2.2; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { font-size: 12px; margin-right: 2px; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult { height: 52px; position: relative } .euroPredCnts .predictionCnts .matchData span.icon-plus { left: 10px; top: 10px; transform: none } .euroPredCnts .predictionCnts .matchData span.icon-plus::before, .euroPredCnts .predictionCnts .matchData span.icon-plus::after { width: 10px } .euroPredCnts .predictionCnts .matchData span.icon-plus::after { left: 6px } .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus { -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); -ms-transform: rotateX(180deg); -o-transform: rotateX(180deg); transform: rotateX(180deg); } .euroPredCnts .item .matchPrediction .team { width: calc((100% - 50px) / 2) } .euroPredCnts .item .matchPrediction .team.team1 { padding-left: 50px; } .euroPredCnts .item .matchPrediction .team.team2 { padding-right: 50px; } .euroPredCnts .item .matchPrediction .teamName, .euroPredCnts .item .matchPrediction .teamScoring p { font-size: 11px; width: 100%; text-align: center; line-height: 2; } .euroPredCnts .item .matchPrediction .dash { width: 50px; } .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points { line-height: 20px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { font-size: 11px; width: auto; text-align: center; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 .teamName { position: absolute; left: 54px; top: 50%; transform: translateY(-50%); text-align: left; padding-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 .teamName { position: absolute; right: 54px; top: 50%; transform: translateY(-50%); text-align: right; padding-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: 100%; top: auto; left: 0; transform: none; bottom: 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData a { display: inline-block; width: calc(100% - 30px) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult img { margin: 4px calc((100% - 20px) / 2) 2px; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 img { margin: 0; margin-right: 10px; position: absolute; left: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 img { margin: 0; margin-left: 10px; position: absolute; right: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 4px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 4px } .euroPredCnts .item .matchPrediction form, .euroPredCnts .item .matchPrediction .value-button { width: 30px } .euroPredCnts .item .matchPrediction input.number { width: 30px; height: 30px; font-size: 18px; } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem { padding: 10px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item { width: 100%; margin-left: 0; margin-bottom: 16px; height: 152px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item:last-of-type { margin-bottom: 0 } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item .predMatchTitle { height: 34px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item .predMatchTitle h3 { font-size: 13px; line-height: 2.6 } .euroPredCnts .predMatchTitle .predJoker { width: 22px; height: 22px } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"] + label { font-size: 16px } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"] + label .icon-joker:before { left: 4px } .LandingPage.CAF, .euroSquad .LandingPage.CAF { padding-bottom: 68% } .legends:before { right: 40px; top: 30px; width: 144px; height: 108px; background-size: 144px 108px; } .LandingPage.CAF.legends .text { right: 40px; transform: translateY(calc(-50% + 30px)); width: 400px; } .LandingPage.CAF.legends .text h1 { font-size: 36px; margin-bottom: 10px; } .LandingPage.CAF.legends .text p { font-size: 18px } .LandingPage.CAF.legends .text .startSquad { width: 200px; height: 50px; font-size: 18px; line-height: 2.8 } .euroSquadPage .shareBtn { right: 50px; bottom: 30px } .euroSquadPage .sponsors { bottom: 30px; left: 50px } .euroSquadPage .sponsors a img { height: 40px } .chseSqMain.legendsSquad, .chseSqMain.chooseTeam { padding-bottom: 72% } .chseSqMain.legends:before { width: 120px; height: 90px; background-size: 120px 90px; right: 20px } .euroSquadPage .chseSqMain .sponsors { left: 20px } .euroSquadPage .chseSqMain .sponsors a img { height: 34px; } .chseSqMain .allForms { bottom: 80px !important } .chseSqMain .allForms a { line-height: 1.6 !important } .chseSqMain .col3 .allForms a { line-height: 2.6 !important; font-size: 15px !important; } .euroSquadPage .chseSqMain .sponsors { left: 20px } .euroSquadPage .chseSqMain .sponsors a img { height: 30px; } .euroSquad .chseTtl { width: calc(100% - 590px); right: 50px; height: 368px; padding-top: 120px; } .euroSquad .chseTtl h1 { font-size: 26px } .euroSquad .chseTtl p { width: 230px; font-size: 16px; } .euroSquad .chseTtl:before, .euroSquadPage .chseSqMain.chooseTeam:before { width: 85px; height: 100px; background-size: 85px auto; } .euroSquadPage .chseSqMain.chooseTeam:before { right: 20px; top: 40px } .euroSquadPage .chseSqMain.chooseTeam:after { left: 20px } .euroSquad .LandingPage.CAF:before { left: 50px; top: 40px; width: 94px; height: 40px; background-size: 94px auto } .euroSquadPage .chseSqMain.chooseTeam:after { top: 40px; width: 94px; height: 40px; background-size: 94px auto } .euroSquad .LandingPage.CAF .landingTeam { width: 456px; left: 50px } .euroSquad .LandingPage.CAF .landingTeam li { margin-left: 12px; margin-bottom: 12px; width: 66px } .euroSquad .LandingPage.CAF .landingTeam li a { padding: 10px } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+6) { margin-bottom: 0; } .euroSquad .LandingPage.CAF .landingTeam li .imgCntnr { margin-bottom: 16px } .euroSquad .LandingPage.CAF .landingTeam li p { font-size: 12px } .euroSquadPage .shareBtn a.faceShare, .euroSquadPage .shareBtn a.twShare { font-size: 26px } .euroInner article .maxWidth { width: 100%; margin: 0; padding: 0 15px 15px } .euroInner .articleHeader { width: calc(100% - 336px); padding: 0 15px } .euroInner .articleHeader .artclHdline { width: 100%; margin: 0 } .euroInner .relatedArticles ul li.item .desc { width: 180px } .euroInner .proPlayer .tabs a { margin-left: 40px } .euroInner .tabs .euroLogo { margin-left: 99px } .euroInner .articleHeader .articleInfo .articleAuthor { width: auto } .euroInner .articleHeader .articleInfo { height: auto } .groups .groupTabs .table .wRow .item:nth-child(2) { margin-left: 25px } .groups .GroupStanding .table .ttlRow .itemTtl, .groups .GroupStanding .table .wRow .item { width: 40px } .groups .GroupStanding .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 362px) } .groups .GroupStanding .table .wRow .team img { height: 20px } .euroInner .matchcenter .maxWidth { width: 100%; margin: 0 } .euroInner .matchcenter .matchesList ul li .leftCol { width: 100px } .euroInner .matchcenter .matchesList ul li .allData { width: calc(100% - 100px) } .euroInner .matchcenter .matchesList ul li .channel { width: 88px } .euroInner .matchcenter .matchesList ul li .channel:before { line-height: 1.8 } .euroInner .matchcenter .matchesList ul li .topData { padding: 15px 10px 45px } .euroInner .matchcenter .matchesList ul li .channel { left: 10px } .euroInner .matchcenter .matchesList ul li .leftCol { padding: 20px 10px } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl { padding: 0 10px 0 20px } .fanZone .cntnr { width: 100%; padding: 80px 20px; margin: 0 } .fanZone ul li { width: calc((100% - 40px) /3) !important } .fanZone ul li h2 { font-size: 20px } .fanZone ul li p { font-size: 12px } .fanZone ul li.FZQuiz .gameImg { width: 110px; left: 0 } .fanZone ul li .dtlsCorner { width: 120px } .fanZone ul li.FZPred p { width: 100% } .fanZone ul li.FZPred .gameImg { width: 120px; top: 50%; transform: translateY(-50%); left: 5px } .fanZone ul li .gameImg { width: 100px } .fanZone ul li a span { width: 100px; height: 35px; line-height: 1.6 } .fanZone ul li.header h1 { width: 270px; font-size: 45px; } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl p { font-size: 13px } .login-box.signUpActive.error, .login-box.loginActive.error { margin-top: 20px } .passwordPage .cntnr { width: 100%; margin: 0 } .RulesMsg .cntnr { height: calc(100% - 80px); top: 65px; transform: translateX(-50%); } .RulesMsg .rulesItems { overflow-x: hidden !important; overflow-y: scroll !important; height: 478px } .RulesMsg .lb-header { margin-bottom: 10px } .euroRoadToCup { padding: 64px 32px } .euroRoadToCup .predHint .hintMsg h3 { font-size: 24px } .euroRoadToCup .title p { font-size: 18px } .euroRoadToCup .groupTaples .group { width: calc((100% - 16px) / 2); margin-left: 16px; margin-bottom: 16px; } .euroRoadToCup .groupTaples .group:nth-child(3n) { margin-left: 16px } .euroRoadToCup .groupTaples .group:nth-child(2n) { margin-left: 0 } .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group:nth-child(3n), .tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga:nth-child(3n) .group{margin-left:32px} .tour2871.roadToCupPage .euroRoadToCup .groupTaples .group:nth-child(2n), .tour2871.roadToCupPage .euroRoadToCup .groupTaples .ay7aga:nth-child(2n) .group{margin-left:0} /*.euroRoadToCup .groupTaples .GroupTeams{width:278px;margin:10px calc((100% - 278px) / 2) 20px} .euroRoadToCup .groupTaples .GroupTeams li{margin-left:26px}*/ .euroRoadToCup .Place3rd { width: 100%; margin: 0; } .tour2694 .euroRoadToCup .allRounds .roundItem { width: calc((100% - 40px) / 3); margin-left: 20px; } .tour2694 .euroRoadToCup .allRounds .roundItem:last-child { margin-left: 0 } .second .teamData:last-child:before, .second .teamData:first-child:before, .third .teamData:last-child:before, .third .teamData:first-child:before, .final .teamData:last-child:before, .final .teamData:first-child:before { width: 14px; right: -10px; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .euroRoadToCup .allRounds .roundItem .cupWinner h3 { font-size: 16px } .tour2694 .euroRoadToCup .allRounds .roundItem .qualifiedTeams .cupWinner .TeamName { font-size: 17px } /*.euroRoadToCup .flickity-button {top: -50px;width: 60px;height: 30px;background-color: #fff;border-radius:6px;border: none;color:#7187c6} .euroRoadToCup .flickity-button.previous{left:auto;right:0;color:inherit} .euroRoadToCup .flickity-button.next:before{color:inherit} .euroRoadToCup .flickity-button:hover{background:#6a81c3;color:#fff}*/ .euroQuizCnts .afterLogin .welcomeHint .yourScore { width: 200px; height: 100px } .euroQuizCnts .afterLogin .welcomeHint .yourScore p { font-size: 20px; margin: 6px 0 0px; } .euroQuizCnts .resultDiv .yourScore p { font-size: 20px } .euroQuizCnts .afterLogin .welcomeHint .yourScore span { font-size: 36px } .euroQuizCnts .getReadyTimer p, .euroQuizCnts .resultDiv p { font-size: 22px; margin-bottom: 44px; } .euroQuizCnts .getReadyTimer span { font-size: 100px } .euroQuizCnts .questionDiv p { font-size: 22px } .euroQuizCnts .answer p { font-size: 15px } .euroInner .articleSocial.euroSocial.fixed { right: 10.6% } .euroMain .FullWidthBK .euroHeader { background-position: 120% 71%, 6% 97%, 42% 102%; background-size: 50%, 31%, 28%; } .euroInner .socialMargin { width: 100%; padding: 40px 10px 0 } .euroInner .articleSocial.euroSocial.fixed { right: auto; position: absolute; top: 5px } .euroInner .articleSocial.euroSocial { position: absolute; top: 5px; margin-top: 0; width: 76px; height: 40px; left: 0; } .euroInner .articleSocial { display: inline-block } .euroInner .articleInfo .articleSocial { display: none } .euroInner article .detailsFooter { margin-bottom: 0 } .medalPage .maxWidth { width: 100%; margin: 0 } .olympicStrip .euroMain .FullWidthBK .euroHeader { background-size: 98%; background-position: left -310px top 0; } .olympicStrip .FullWidthBK .euroHeader img.robotStrip { margin: 15px 30px 0 0; width: 70px } .olympicStrip .FullWidthBK .euroHeader .textStrip { margin-right: 20px } .olympicStrip .FullWidthBK .euroHeader .textStrip p { font-size: 22px } .olympicStrip .FullWidthBK .euroHeader a { left: 178px } .euroStrip.olympicStrip .spansorheader .spansorEuro { width: 140px; left: 22px } .olympicStrip .spansorheader .spansorEuro a img { width: 140px } /*new gutter*/ article .artclHdline { font-size: 22px } article .stats .item { width: 100%; margin-bottom: 15px; height: 216px } article .stats .item ul li, article .stats .item.matches ul li { height: 56px; padding: 6px 10px } .matchesCenter .tab { padding: 0 !important } .matchesCenter .tab button { width: calc((100% - 75px) / 7) !important; } .matchesCenter .tab button:before { width: 50px; height: 50px } .matchesCenter .tab button p { font-size: 20px } .matchesCenter .tab button span { margin-top: -2px } .matchesCenter .dateBtn { width: 45px; height: 45px } .matchesCenter .icon-date:before { font-size: 26px } .matchesCenter .toursDropdown { width: 110px; position: absolute; right: 10px; bottom: 10px; } .matchesCenter .matchesNow { width: 110px; position: absolute; right: 125px; bottom: 10px; } .cd-gallery li .tv { position: absolute; bottom: 10px; left: 10px; margin-top: 0; max-width: 175px } .Team_Page .featuredArea .desc { margin-top: 10px } .tourStats.stats .item { width: calc((100% - 16px)/ 2); } .tourStats.stats .item:nth-of-type(2n) { margin-left: 0 } .Team_Page .list .Team1 ul li { width: calc((100% - 16px) / 2); } .Team_Page .list .Team1 ul li:nth-of-type(3n) { margin-left: 16px } .Team_Page .list .Team1 ul li:nth-of-type(2n) { margin-left: 0 } .Team_Page .list .Team1 .numm { width: 45px } .Team_Page .list .Team1 .P-name a { font-size: 11px } .Team_Page .list .Team1 .P-name { width: calc(100% - 102px); } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl { padding: 0 8px } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl p { font-size: 13px } /* .proPlayer .rightside{width:100%;margin-left:0} .proPlayer .remainContent .listing ul li{width:calc((100% - 32.1px) / 3)} .proPlayer .remainContent .listing ul li:nth-of-type(2n){margin-left:16px} .proPlayer .remainContent .listing ul li:nth-of-type(3n){margin-left:0} .proPlayer .interestedArticles, .proPlayer .tourMatches{width:100%}*/ /*.showcaseDiv{margin:20px calc((100% - 300px) /2) 20px} .leftHP{width:100%}*/ .tour2694 .euroRoadToCup .title h1 { font-size: 36px; height: 90px; } .tour2694 .euroRoadToCup .title span { font-size: 16px } .tour2694 .euroRoadToCup .title h1:before { width: 44px; height: 90px } .viewTabContainer { padding: 50px 30px 30px } .tour2694 .euroRoadToCup .breadcrumbDiv { margin-bottom: 30px } .tour2694 .euroRoadToCup .groupTaples .group { margin-left: 16px; margin-bottom: 16px; width: calc((100% - 16px)/ 2); } .tour2694 .euroRoadToCup .groupTaples .group:nth-child(3n) { margin-left: 16px } .tour2694 .euroRoadToCup .viewTabContainer .camel { left: 30px } .tour2694 .euroRoadToCup .viewTabContainer .eagles { left: 30px; top: 30px } .tour2694 .euroRoadToCup .groups { padding-bottom: 50px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams { width: 272px; margin: 10px calc((100% - 272px) / 2) 20px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li { margin-left: 24px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li:last-of-type { margin-left: 0; } .tabs-nav > li { padding: 20px 30px } .euroPredCnts .predictionCnts .saveHint { width: 800px } .chooseLeague ul li { width: 250px; } .chooseLeague ul li:nth-of-type(6n) { margin-left: 10px } .chooseLeague ul li:nth-of-type(5n) { margin-left: 0 } .chooseLeague ul li a { display: inline-block; width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; text-align: center } .chooseLeague ul li img { height: 45px; position: relative; top: auto; left: auto; transform: none; } .chooseLeague ul li p { font-size: 14px; margin-top: 8px } .newPred .pagecnts { width: 100%; margin: 0 0; padding: 0 20px } .newPred .FullWidthBK .pagecnts { padding: 20px } .newPred .euroPredCnts .tabs .regBtn { left: 20px } /*.newPred .prediction{padding:20px 15px}*/ .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.num { width: 150px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item { width: calc((100% - 150px)/2) } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a { padding: 0 10px } .newPred .proPlayer .title .leagueSetting a { padding: 0 15px; height: 40px } .newPred .proPlayer .title .leagueSetting a .cont p, .newPred .proPlayer .title .leagueSetting a .cont .icon-edit:before, .newPred .proPlayer .title .leagueSetting a .cont .icon-remove:before, .newPred .proPlayer .title .leagueSetting a .cont .icon-share:before { line-height: 38px } .newPred .proPlayer .title h2 { font-size: 26px } .newPred .proPlayer .title .membersNumber, .newPred .proPlayer .title .totalNum { margin-top: 16px } .newPred .proPlayer .title .leagueSetting { width: 100%; margin-top: 5px; float: right } .newPred .proPlayer .title .leagueSetting a { padding: 0 20px; height: 40px } .newPred .proPlayer .title .leagueSetting a .cont p, .newPred .proPlayer .title .leagueSetting a .cont span:before { line-height: 40px !important } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.totalPoints, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.totalPoints { width: 150px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item { width: calc(100% - 400px); } .euroPredCnts .FullWidthBK h1:first-child { right: 20px } .euroPredCnts .FullWidthBK h1:first-child:first-child { font-size: 42px } .newPred .euroPredCnts .FullWidthBK h1, .newPred .euroPredCnts .FullWidthBK h2 { right: 20px } .newPred .pagecnts { padding: 35px 20px } .newPred .FullWidthBK .pagecnts { padding: 20px } .newPred.tour-1 .FullWidthBK .pagecnts { padding: 20px } .tour2697.newPred .pagecnts { padding: 35px 20px } .tour2697.newPred .FullWidthBK .pagecnts { padding: 0 20px } .tour2727.newPred .pagecnts { padding: 35px 20px } .tour2727.newPred .FullWidthBK .pagecnts { padding: 20px } .tour2730.newPred .pagecnts { padding: 35px 20px } .tour2730.newPred .FullWidthBK .pagecnts { padding: 0 20px } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { background: url(../../Images/EgyptionLeague.png) no-repeat left -17% top 18%; background-size: 42%; width: 100% } .tour2694.newPred .FullWidthBK .pagecnts { padding: 0 20px } } @media only screen and (max-width: 1023px) { .cafLgFinal { background: #020305 } .cafLgFinal .championSponsor { height: 100px; z-index: 9 } .cafLgFinal .championSponsor .desktop { display: none; } .cafLgFinal .championSponsor .mobile { display: inline-block; } .cafLgFinal .wrapper { margin-top: 340px } .cafLgFinal .container { z-index: 9 } .ahlyFans.cafLgFinal .votingBtn .second:before { background-size: 100% auto } .zamalekFans.cafLgFinal .votingBtn .second:before { background-size: 100% auto } .ahlyFans.cafLgFinal .votingBtn .second .socialMediaBtn p { width: 70px; line-height: 1.6; font-size: 12px; text-align: left; } .zamalekFans.cafLgFinal .votingBtn .second .socialMediaBtn p { width: 70px; line-height: 1.6; font-size: 12px; text-align: left; } .cafLgFinal .featuredArea ul li { background: transparent } .cafLgFinal .featuredArea ul li a .imageCntnr { width: 100%; padding-bottom: 67% } .cafLgFinal .featuredArea .desc { width: 100%; height: 70px; position: absolute; bottom: 0; padding: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0) } .cafLgFinal .featuredArea .desc p { color: #fff; position: absolute; padding: 0 10px; height: 52px; } .cafLgFinal .featuredArea ul li:first-child .desc p { height: auto } .cafLgFinal .pattern1 ul li .desc { margin-top: 10px; background: #222 } .cafLgFinal .pattern1 ul li:nth-last-child(-n+4), .cafLgFinal .pattern2 ul li:nth-last-child(-n+4) { margin-bottom: 10px } .cafLgFinal .pattern2 ul li:first-child { width: calc(100% - ((100% + 6px)/ 3)) } .cafLgFinal .pattern2 ul li { width: calc((100% - 12.1px)/ 3) } .cafLgFinal .listing ul li a .imageCntnr { width: 100%; padding-bottom: 67% } .cafLgFinal .listing ul li .desc { width: 100%; height: auto; background: #222; padding: 10px; margin-top: 0 } .cafLgFinal .listing ul li .desc p { height: 80px; font-size: 14px } .cafLgFinal .listing ul li { width: calc((100% - 32.1px) / 3); } .cafLgFinal .listing ul li .secName { padding: 2px 10px; font-family: droidLight, Arial; font-size: 13px; color: #fff; background: rgba(0,0,0,0.7); position: absolute; top: 0px; right: 0px; z-index: 1; } .cafLgFinal .entryPoint { width: 650px; margin-right: calc((100% - 650px) / 2); margin-left: calc((100% - 650px) / 2); } .ahlyFans.cafLgFinal .votingBtn .second:after { width: 136px; height: 120px; top: 0; left: 40px; background-size: auto 120px; } .zamalekFans.cafLgFinal .votingBtn .second:after { width: 85px; height: 120px; top: 0; left: 20px; background-size: auto 120px; } .LandingPage.CAF .landingTeam { right: auto; width: 55%; } .LandingPage.CAF .landingTeam .line a { width: 84px; height: 34px; font-size: 15px; line-height: 2.2; } .LandingPage.CAF .shareGame { bottom: 25px; left: 15px; } .LandingPage.CAF .shareGame p { font-size: 15px } .cafLgFinal .quizContainer .listing ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100); } .cafLgFinal .quizContainer .listing ul li .desc { width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .quizContainer .listing ul li { padding: 10px } .cafLgFinal .quizContainer .listing.quizListing ul li .desc p { font-size: 14px; height: 45px; } .cafLgFinal .quizContainer .listing.quizListing ul li .bottomBox { margin-top: 0; width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .quizContainer .listing.quizListing ul li .bottomBox label { width: 80px; height: 24px; font-size: 11px; line-height: 2.4 } .cafLgFinal .quizContainer .listing ul li:first-child { padding: 10px } .cafLgFinal .quizContainer .listing ul li:first-child a .imageCntnr { width: 300px; padding-bottom: calc((300px * 67)/ 100); } .cafLgFinal .quizContainer .listing ul li:first-child .desc { width: calc(100% - 320px); margin-top: 30px } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .desc p { font-size: 20px; max-height: 72px; height: auto; margin-bottom: 30px; } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .bottomBox { margin-right: 20px; width: calc(100% - 320px); margin-top: 10px } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .bottomBox label { float: right; width: 110px; height: 34px; font-size: 13px; line-height: 2.6 } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .bottomBox label .icon-arrow:before { font-size: 10px; margin-right: 6px } .cafLgFinal .listing.quizPartial ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100); } .cafLgFinal .listing.quizPartial ul li .desc { width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .listing.quizPartial ul li { padding: 10px } .cafLgFinal .listing.quizPartial ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100); } .cafLgFinal .listing.quizPartial ul li .desc { width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .listing.quizPartial ul li { padding: 10px } .cafLgFinal .listing.quizPartial ul li .desc p { font-size: 14px; height: 45px; } .cafLgFinal .listing.quizPartial ul li .bottomBox { margin-top: 0; width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .listing.quizPartial ul li .bottomBox label { width: 80px; height: 24px; font-size: 11px; line-height: 2.4 } .shortLinks { position: relative; display: inline-block; float: right; width: 100%; right: 0; top: 0; transform: none } .shortLinks a { display: inline-block; float: right; margin-bottom: 10px; padding: 10px; background: #0277bd; height: auto; border-radius: 4px; position: relative; right: 0 !important; margin-left: 10px; width: calc((100% - 50px) / 6); text-align: center } .shortLinks a span { float: left; margin-right: 8px; width: 34px; height: 34px; margin: 0 calc((100% - 34px) / 2) 10px; border-radius: 50%; overflow: hidden; position: relative; background: rgba(0,0,0,0.2) } .shortLinks a span img { width: 20px; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) } .shortLinks a p { display: inline-block; width: 100%; float: right; font-family: droidLight, arial; color: #fff; font-size: 12px; line-height: 1; text-align: center } .shortLinks a:last-child { margin-bottom: 0; margin-left: 0 } .LandingPage.CAF .aqarLogo { bottom: 40px; right: 40px; } .proPlayer .rightside { width: 100%; margin-left: 0 } /*.proPlayer .remainContent .listing ul li{width:100%;margin-left:0} .proPlayer .remainContent .listing ul li .desc p {height: 27px;font-size: 15px;} .proPlayer .remainContent .listing ul li .desc{margin-top:0}*/ .proPlayer .featuredArea .pattern2 ul li:first-child, .proPlayer .importantPlayer ul li:first-child { width: 100%; margin-left: 0; height: auto; margin-bottom: 16px } .proPlayer .featuredArea .pattern2 ul li, .proPlayer .importantPlayer ul li { width: 100%; margin-bottom: 16px; height: 100px } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr, .proPlayer .importantPlayer ul li a .imageCntnr { width: 150px; padding-bottom: calc((150px * 67)/ 100); float: right; } .proPlayer .featuredArea .pattern2 ul li.video .secName, .proPlayer .importantPlayer ul li.video .secName { right: 125px } .proPlayer .featuredArea .pattern2 li .desc, .proPlayer .importantPlayer li .desc { margin-top: 0; width: calc(100% - 150px); } /* .proPlayer .featuredArea .pattern2 ul li .desc .date, .proPlayer .importantPlayer ul li .desc .date{bottom:10px} */ .proPlayer .importantPlayer ul li:first-child .desc p { position: relative } .proPlayer .remainContent .listing ul li a .imageCntnr { width: 100%; padding-bottom: 67% } .proPlayer .remainContent .listing ul li .desc { width: 100%; margin-top: 0 } .proPlayer .remainContent .Pcnt ul li:first-child { margin-right: 16px } .proPlayer.Videos .listing ul li .secName { right: 95px; width: 25px; height: 20px; overflow: hidden; padding: 0; top: 0; } .proPlayer.Videos .listing ul li .secName .icon { width: 25px; height: 20px } .proPlayer.Videos .listing ul li .secName { right: 125px } .proPlayer .FullWidthBK.proBG h1 { right: 60px; font-size: 46px } .proPlayer .FullWidthBK.proBG img.newPro { left: 10px; height: 140px } .proPlayer .FullWidthBK.proBG .lines { width: 10px } .proPlayer .FullWidthBK.proBG .lines.leftBlue { left: 24px } .proPlayer .FullWidthBK.proBG .lines.leftRed { left: 310px } .proPlayer .FullWidthBK.proBG .lines.leftYellow { left: 326px } .proPlayer .FullWidthBK.proBG .lines.rightBlue { right: 32px; top: 80px } .proPlayer .FullWidthBK.proBG .lines.rightYellow { right: 16px; top: 20px } .euroMain .tabs a { margin-left: 40px } .euroMain .featuredArea .pattern2 ul li:first-child, .euroMain .importantPlayer ul li:first-child { width: 100% !important } .euroMain .featuredArea .pattern2 ul li, .euroMain .importantPlayer ul li { width: 100% !important } .euroMain .featuredArea .pattern2 li .desc { padding: 8px 10px; } .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((150px * 67) / 100); width: 150px; } .euroMain .importantPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 150px); } .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName { right: 125px } .euroMain .featuredArea .pattern2 ul li .desc .date { right: 10px } .euroMain .featuredArea .pattern2 ul li .desc p, .euroMain .remainContent .proNews .listing ul li .desc p, .euroMain .remainContent .listing.multimedia ul li .desc p { height: 48px; font-size: 13px } .euroMain .featuredArea .pattern2 ul li .desc p { height: auto } .euroMain .remainContent .listing ul li .desc p.date { font-size: 12px; height: auto } .euroFZEP { max-width: 920px; margin: 0 auto 30px; float: initial } .euroFZEP a { width: calc((100% - 20px) / 3); margin-left: 10px; margin-bottom: 0; height: auto; padding-bottom: calc((calc((100% - 20px) / 3) * 50) / 100); position: relative } .euroFZEP a:last-child { margin-left: 0 } .euroFZEP a img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: auto } .euroFZEP.predFZEP { width: 300px; margin: 0 calc((100% - 300px) / 2) 0 } .euroFZEP.predFZEP a { width: 100%; margin: 0; padding-bottom: 50% } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: calc(100% - 370px); } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { width: calc(100% - 60px); font-size: 12px } .euroPredCnts .predictionCnts .matchData .predStatus { width: 80px } .euroPredCnts .predictionCnts .matchData .predStatus .status { font-size: 11px; line-height: 2.8; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { font-size: 13px; margin-right: 4px; line-height: 2.2; } .LandingPage.CAF { padding-bottom: 67% } .euroSquad .LandingPage.CAF { padding-bottom: 67% } .legends:before { right: 30px; top: 30px; width: 120px; height: 90px; background-size: 120px 90px; } .LandingPage.CAF.legends .text { right: 30px; transform: translateY(calc(-50% + 20px)); width: 400px; } .LandingPage.CAF.legends .text h1 { font-size: 32px; margin-bottom: 6px; } .LandingPage.CAF.legends .text p { font-size: 18px } .LandingPage.CAF.legends .text .startSquad { width: 160px; height: 46px; font-size: 16px; line-height: 2.8 } .euroSquadPage .shareBtn { right: 30px; bottom: 30px } .euroSquadPage .shareBtn a.faceShare, .euroSquadPage .shareBtn a.twShare { font-size: 24px } .euroSquadPage .sponsors { bottom: 30px; left: 30px } .euroSquadPage .sponsors a img { height: 36px } .chseSqMain.legendsSquad { padding-bottom: 74% } .chseSqMain.legends:before { width: 120px; height: 90px; background-size: 120px 90px; right: 20px } .chseSqMain.legends .sponsors { left: 20px } .chseSqMain.legends .sponsors a img { height: 34px; } .chseSqMain .allForms { bottom: 80px !important } .chseSqMain .allForms a { line-height: 1.6 !important } .chseSqMain .col3 .allForms a { line-height: 2.6 !important; font-size: 15px !important; } .chseSqMain.legends .sponsors, .euroSquadPage .chseSqMain .sponsors { left: 20px } .chseSqMain.legends .sponsors a img, .euroSquadPage .chseSqMain .sponsors img { height: 30px; } /*.euroSquad .squadCnts{position:relative;display:inline-block;float:right;width:100%;padding: 50px 0;}*/ .euroSquad .chseTtl { width: calc(100% - 480px); right: 30px; height: 326px; padding-top: 110px; } .euroSquad .chseTtl h1 { font-size: 24px } .euroSquad .chseTtl p { width: 220px; font-size: 15px; } .euroSquad .chseTtl:before, .euroSquadPage .chseSqMain.chooseTeam:before { width: 77px; height: 90px; background-size: 77px auto; } .euroSquadPage .chseSqMain.chooseTeam:before { right: 20px; top: 30px } .euroSquadPage .chseSqMain.chooseTeam:after { left: 20px } .euroSquad .LandingPage.CAF:before { left: 30px; top: 30px; width: 80px; height: 34px; background-size: 80px auto } .euroSquadPage .chseSqMain.chooseTeam:after { top: 30px; width: 80px; height: 34px; background-size: 80px auto } .euroSquad .LandingPage.CAF .landingTeam { width: 420px; left: 30px } .euroSquad .LandingPage.CAF .landingTeam li { margin-left: 12px; margin-bottom: 12px; width: 60px } .euroSquad .LandingPage.CAF .landingTeam li a { padding: 6px } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+6) { margin-bottom: 0; } .euroSquad .LandingPage.CAF .landingTeam li .imgCntnr { margin-bottom: 16px } .euroSquad .LandingPage.CAF .landingTeam li p { font-size: 12px } .euroSquadPage .shareBtn a.faceShare, .euroSquadPage .shareBtn a.twShare { font-size: 26px } .euroInner article { width: 100%; margin: 0 0 0 20px; } .euroInner article .maxWidth { width: 100%; margin: 0 auto; padding: 0 15px 15px; max-width: 810px; float: none } .euroInner .articleHeader { width: 100%; padding: 0 15px; margin-right: 0; } .euroInner .articleHeader .artclHdline { width: 100%; margin: 0 auto; max-width: 810px; float: none } .euroInner .relatedArticles ul li.item .desc { width: 180px } .euroInner .relatedArticles ul li.item { height: auto } .euroInner article .articleHeader { max-width: 810px; float: none } .euroInner .articleHeader .articleInfo { height: auto } /* .euroInner .articleHeader .articleInfo .articleAuthor{width:auto;} */ .groups .groupTabs .table .wRow .item:nth-child(2) { margin-left: 50px } .euroInner .matchcenter .maxWidth { margin-bottom: 20px } .fanZone .cntnr { width: 100%; padding: 80px 20px; margin: 0 } .fanZone ul li { width: calc((100% - 40px) /3) !important } .fanZone ul li h2 { font-size: 20px } .fanZone ul li p { font-size: 12px } .fanZone ul li.FZQuiz .gameImg { width: 110px; left: 0 } .fanZone ul li .dtlsCorner { width: 120px } .fanZone ul li.FZPred p { width: 100% } .fanZone ul li.FZPred .gameImg { width: 120px; top: 50%; transform: translateY(-50%) } .fanZone ul li .gameImg { width: 100px } .fanZone ul li a span { width: 100px; height: 35px; line-height: 1.6 } .fanZone ul li.header h1 { width: 270px; font-size: 45px; } .RulesMsg .cntnr { height: calc(100% - 80px); top: 65px; transform: translateX(-50%); } .RulesMsg .rulesItems { overflow-x: hidden !important; overflow-y: scroll !important; height: 478px } .RulesMsg .lb-header { margin-bottom: 10px } .euroRoadToCup { padding: 32px } .euroRoadToCup .title p { font-size: 18px } .euroRoadToCup .groupTaples .group { width: calc((100% - 16px) / 2); margin-left: 16px; margin-bottom: 16px; } .euroRoadToCup .groupTaples .group:nth-child(3n) { margin-left: 16px } .euroRoadToCup .groupTaples .group:nth-child(2n) { margin-left: 0 } .euroRoadToCup .groupTaples .GroupTeams { width: 278px; margin: 10px calc((100% - 278px) / 2) 20px } .euroRoadToCup .groupTaples .GroupTeams li { margin-left: 26px } .euroRoadToCup .Place3rd { width: 100%; margin: 0; } .euroRoadToCup .nextHint { bottom: 110px } .tour2694 .euroRoadToCup .allRounds .roundItem { width: calc((100% - 40px) / 3); margin-left: 20px; } .tour2694 .euroRoadToCup .allRounds .roundItem:last-child { margin-left: 0 } .second .teamData:last-child:before, .second .teamData:first-child:before, .third .teamData:last-child:before, .third .teamData:first-child:before, .final .teamData:last-child:before, .final .teamData:first-child:before { width: 14px; right: -10px; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .euroRoadToCup .allRounds .roundItem .cupWinner h3 { font-size: 16px } .tour2694 .euroRoadToCup .allRounds .roundItem .qualifiedTeams .cupWinner .TeamName { font-size: 17px } .euroQuizCnts .afterLogin .welcomeHint .yourScore { width: 200px; height: 100px } .euroQuizCnts .afterLogin .welcomeHint .yourScore p { font-size: 20px; margin: 6px 0 0px; } .euroQuizCnts .resultDiv .yourScore p { font-size: 20px } .euroQuizCnts .afterLogin .welcomeHint .yourScore span { font-size: 36px } .euroQuizCnts .getReadyTimer p, .euroQuizCnts .resultDiv p { font-size: 22px; margin-bottom: 44px; } .euroQuizCnts .getReadyTimer span { font-size: 100px } .euroQuizCnts .questionDiv p { font-size: 22px } .euroQuizCnts .answer p { font-size: 15px } .euroInner .articleSocial.euroSocial.fixed { right: 11.5% } .euroMain .FullWidthBK .euroHeader { background-position: 120% 71%, 6% 97%, 37% 102%; background-size: 50%, 27%, 28%; } .medalPage .maxWidth { width: 100%; margin: 0 } .euroStrip.olympicStrip .EntryPoint { width: 100% } .olympicStrip .euroMain .FullWidthBK .euroHeader { background-size: 98%; background-position: left -368px top 0; } .olympicStrip .FullWidthBK .euroHeader img.robotStrip { margin: 15px 30px 0 0; width: 70px } .olympicStrip .FullWidthBK .euroHeader .textStrip { margin-right: 20px } .olympicStrip .FullWidthBK .euroHeader .textStrip p { font-size: 22px } .olympicStrip .FullWidthBK .euroHeader a { left: 178px } .euroStrip.olympicStrip .spansorheader .spansorEuro { width: 140px; left: 22px } .olympicStrip .spansorheader .spansorEuro a img { width: 140px } /* new gutter*/ .Team_Page .featuredArea .desc { margin-top: 10px } .euroPredCnts .predictionCnts .saveHint { width: 100% } .euroPredCnts .predictionCnts .saveHint .cnts { width: 700px } .tour2694 .euroRoadToCup .title h1 { font-size: 36px; height: 90px; } .tour2694 .euroRoadToCup .title span { font-size: 16px } .tour2694 .euroRoadToCup .title h1:before { width: 44px; height: 90px } .viewTabContainer { padding: 50px 30px 30px } .tour2694 .euroRoadToCup .breadcrumbDiv { margin-bottom: 30px } .tour2694 .euroRoadToCup .groupTaples .group { margin-left: 16px; margin-bottom: 16px; width: calc((100% - 16px)/ 2); } .tour2694 .euroRoadToCup .groupTaples .group:nth-child(3n) { margin-left: 16px } .tour2694 .euroRoadToCup .viewTabContainer .camel { left: 30px } .tour2694 .euroRoadToCup .viewTabContainer .eagles { left: 30px; top: 30px } .tour2694 .euroRoadToCup .groups { padding-bottom: 50px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams { width: 272px; margin: 10px calc((100% - 272px) / 2) 20px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li { margin-left: 24px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li:last-of-type { margin-left: 0; } .tabs-nav > li { padding: 20px 30px; font-size: 14px } .chooseLeague ul li { width: 200px; } .chooseLeague ul li p { font-size: 14px } .newPred .pagecnts { width: 100%; margin: 0 0; padding: 0 20px } .newPred .euroPredCnts .tabs .regBtn { left: 20px } /*.newPred .prediction{padding:20px 15px}*/ .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.num { width: 150px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item { width: calc((100% - 150px)/2) } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a { padding: 0 10px } .newPred .proPlayer .title .leagueSetting a { padding: 0 15px; height: 40px } .newPred .proPlayer .title .leagueSetting a .cont p, .newPred .proPlayer .title .leagueSetting a .cont .icon-edit:before, .newPred .proPlayer .title .leagueSetting a .cont .icon-remove:before, .newPred .proPlayer .title .leagueSetting a .cont .icon-share:before { line-height: 38px } .newPred .proPlayer .title h2 { font-size: 26px } .newPred .proPlayer .title .membersNumber, .newPred .proPlayer .title .totalNum { margin-top: 16px } .euroPredCnts .FullWidthBK h1:first-child { right: 20px } .euroPredCnts .FullWidthBK h1:first-child:first-child { font-size: 42px } .newPred .euroPredCnts .FullWidthBK h2 { right: 20px } .newPred .FullWidthBK .pagecnts { padding: 20px } .newPred .pagecnts { padding: 20px } .newPred.tour-1 .FullWidthBK .pagecnts { padding: 20px } .tour2697.newPred .euroPredCnts .FullWidthBK h2 { right: 20px } .tour2697.newPred .FullWidthBK .pagecnts { padding: 0 20px } .tour2697.newPred .pagecnts { padding: 20px } .tour2727.newPred .euroPredCnts .FullWidthBK h2 { right: 20px } .tour2727.newPred .FullWidthBK .pagecnts { padding: 20px } .tour2727.newPred .pagecnts { padding: 20px } .tour2730.newPred .euroPredCnts .FullWidthBK h2 { right: 20px } .tour2730.newPred .FullWidthBK .pagecnts { padding: 0 20px } .tour2730.newPred .pagecnts { padding: 20px } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { background: url(../../Images/EgyptionLeague.png) no-repeat left -19% top 18%; background-size: 43%; width: 100% } .tour2694.newPred .FullWidthBK .pagecnts { padding: 0 20px } } @media screen and (min-width: 320px) and (max-width: 767px) { .cafLgFinal .wrapper { margin-top: 356px; padding: 30px 10px } .cafLgFinal section { margin-bottom: 30px } .cafLgFinal .votingBtn { width: 100%; padding: 0 10px; top: -186px } .cafLgFinal .votingBtn .teamVote { width: calc((100% - 10px) / 2); margin-left: 10px; border-radius: 10px; padding: 0 10px; height: 200px } .cafLgFinal .votingBtn .team1:before { width: 57px; height: 50px; left: 50%; transform: translateX(-50%); top: 10px; background: url(../../Images/ahly1.png) no-repeat center center; background-size: auto 50px; } .cafLgFinal .votingBtn .team1:after { width: 108px; height: 12px; right: auto; bottom: 54px; left: 50%; transform: translateX(-50%); background: url(../../Images/ahly2.png) no-repeat center center; background-size: 108px auto; } .cafLgFinal .votingBtn .team2:after { width: 37px; height: 50px; left: 50%; transform: translateX(-50%); top: 10px; background: url(../../Images/zamalek1.png) no-repeat center center; background-size: auto 50px; } .cafLgFinal .votingBtn .team2:before { width: 108px; height: 12px; right: auto; bottom: 54px; left: 50%; transform: translateX(-50%); background: url(../../Images/zamalek2.png) no-repeat center center; background-size: auto 7px; } .cafLgFinal .votingBtn .top { height: 134px } .cafLgFinal .votingBtn .teamVote .top p { font-size: 26px; text-align: center; margin-bottom: 12px } .cafLgFinal .votingBtn .teamVote .top span { font-size: 24px; text-align: center } .cafLgFinal .votingBtn .bottom { height: 48px } .cafLgFinal .votingBtn .teamVote .bottom p { font-size: 12px; line-height: 1.6; padding: 4px 0; width: 140px } .ahlyFans.cafLgFinal .votingBtn { left: 10px; right: 10px; width: calc(100% - 20px); padding: 0; } .zamalekFans.cafLgFinal .votingBtn { left: 10px; right: 10px; width: calc(100% - 20px); padding: 0; } .ahlyFans.cafLgFinal .votingBtn .second { height: 200px; border-radius: 10px } .zamalekFans.cafLgFinal .votingBtn .second { height: 200px; border-radius: 10px } .ahlyFans.cafLgFinal .votingBtn .second:after { width: 113px; height: 100px; top: -20px; left: 50%; background-size: auto 100px; } .zamalekFans.cafLgFinal .votingBtn .second:after { width: 70px; height: 100px; top: -20px; left: 50%; background-size: auto 100px; } .ahlyFans.cafLgFinal .votingBtn .second p { font-size: 48px; padding: 30px 0 6px } .zamalekFans.cafLgFinal .votingBtn .second p { font-size: 48px; padding: 30px 0 6px } .ahlyFans.cafLgFinal .votingBtn .second p.fanNum { font-size: 14px; margin-bottom: 2px } .zamalekFans.cafLgFinal .votingBtn .second p.fanNum { font-size: 14px; margin-bottom: 2px } .ahlyFans.cafLgFinal .votingBtn .second span { font-size: 42px } .zamalekFans.cafLgFinal .votingBtn .second span { font-size: 42px } /*.cafLgFinal .socialMediaBtn {position: relative;bottom: 0;left: 0;display: inline-block;float: right;width: 130px;text-align: center;margin: 4px calc((100% - 130px) / 2) 0;} .cafLgFinal .socialMediaBtn a.icon-fb{margin-right:24px;} .ahlyFans.cafLgFinal .votingBtn .second .socialMediaBtn p{width:100%;margin-left:0;font-size:12px;line-height:normal;text-align:center;margin-bottom: 6px;} .zamalekFans.cafLgFinal .votingBtn .second .socialMediaBtn p{width:100%;margin-left:0;font-size:12px;line-height:normal;text-align:center;margin-bottom: 6px;}*/ .cafLgFinal .socialMediaBtn { position: relative; bottom: 0; left: 0; display: inline-block; float: right; width: 162px; text-align: center; margin: 4px calc((100% - 162px) / 2) 0; } .ahlyFans.cafLgFinal .votingBtn .second .socialMediaBtn p { width: 70px; line-height: 1.6; font-size: 12px; text-align: left; } .zamalekFans.cafLgFinal .votingBtn .second .socialMediaBtn p { width: 70px; line-height: 1.6; font-size: 12px; text-align: left; } .cafLgFinal .ttl { margin-bottom: 10px; font-size: 18px; padding: 10px; } .cafLgFinal .ttl .more { width: 68px; height: 34px; font-size: 12px; line-height: 2.9 } .cafLgFinal .ttl .more span { margin-right: 4px } .cafLgFinal .ttl .more .icon-more:before { line-height: 3 } .cafLgFinal .featuredCnts { width: 100%; margin-left: 0; margin-bottom: 30px } .cafLgFinal .featuredCnts:last-child { margin-bottom: 0 } .cafLgFinal .featuredArea ul li { margin-left: 10px; width: calc((100% - 10px) / 2) } .cafLgFinal .featuredArea ul li:first-child { margin-bottom: 10px } .cafLgFinal .pattern2 ul li:first-child { margin-left: 0; width: 100% } .cafLgFinal .pattern2 ul li { width: calc((100% - 6.1px) / 2); } .cafLgFinal .pattern2 .desc p { color: #fff } .cafLgFinal .listing ul li { width: calc((100% - 10.1px) / 2); } .cafLgFinal .listing ul li .desc p { font-size: 13px } .cafLgFinal .listing .more { display: inline-block; width: 100%; height: auto; background: #fff; padding: 6px 0; text-align: center; color: #0277bd; font-family: droidLight,Arial; font-size: 13px; line-height: normal; } .cafLgFinal .listing .more span { display: none } .cafLgFinal .quizContainer .listing ul li { padding: 10px; width: 100%; border-radius: 8px; margin-bottom: 10px } .cafLgFinal .quizContainer .listing ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100); border-radius: 4px } .cafLgFinal .quizContainer .listing ul li .desc { width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .quizContainer .listing.quizListing ul li .desc p { font-size: 13px; height: 40px; } .cafLgFinal .quizContainer .listing.quizListing ul li .bottomBox { margin-top: 16px; width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .quizContainer .listing.quizListing ul li .bottomBox label { width: 80px; height: 24px; font-size: 11px; line-height: 2.4 } .cafLgFinal .quizContainer .listing ul li:first-child { padding: 10px; margin-bottom: 14px } .cafLgFinal .quizContainer .listing ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 67% } .cafLgFinal .quizContainer .listing ul li:first-child .desc { width: 100%; margin-top: 10px; margin-right: 0 } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .desc p { font-size: 16px; max-height: 100%; height: auto; margin-bottom: 20px; } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .bottomBox { margin-right: 0; width: 100%; margin-top: 0 } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .bottomBox label { float: right; width: 94px; height: 30px; font-size: 12px; line-height: 2.5 } .cafLgFinal .quizContainer .listing.quizListing ul li:first-child .bottomBox label .icon-arrow:before { font-size: 10px; margin-right: 6px } .cafLgFinal .listing.quizPartial ul li { padding: 10px; width: 100%; border-radius: 8px; margin-bottom: 10px } .cafLgFinal .listing.quizPartial ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100); border-radius: 4px } .cafLgFinal .listing.quizPartial ul li .desc { width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .listing.quizPartial ul li .desc p { font-size: 13px; height: 40px; } .cafLgFinal .listing.quizPartial ul li .bottomBox { margin-top: 16px; width: calc(100% - 130px); margin-right: 10px } .cafLgFinal .listing.quizPartial ul li .bottomBox label { width: 80px; height: 24px; font-size: 11px; line-height: 2.4 } .cafLgFinal .listing.quizPartial ul li:first-child .bottomBox a { float: right; width: 94px; height: 30px; font-size: 12px; line-height: 2.5 } .cafLgFinal .listing.quizPartial ul li:first-child .bottomBox a .icon-arrow:before { font-size: 10px; margin-right: 6px } .cafLgFinal article .result .resContainer .saveImage { width: 100%; margin: 0 } .cafLgFinal article .result { padding: 10px } .cafLgFinal .listing.quizPartial { padding: 10px } .cafLgFinal .listing ul li.gap { display: none } .cafLgFinal .listing .more { margin-top: 20px } .cafLgFinal .cafMatchDtls { border-radius: 10px; padding: 16px } .cafLgFinal .cafMatchDtls span { font-size: 42px } .cafLgFinal .cafMatchDtls .teamName { font-size: 16px; line-height: 2.4; } .cafLgFinal .cafMatchDtls .mtchRslt { margin-bottom: 16px } .cafLgFinal .cafMatchDtls .teamresult.team1 span { margin-right: 20px } .cafLgFinal .cafMatchDtls .teamresult.team2 span { margin-left: 20px } .cafLgFinal .cafMatchDtls .dash { font-size: 24px } .cafLgFinal .cafMatchDtls .matchData .item:nth-child(2) { width: 70px } .cafLgFinal .cafMatchDtls .matchData .item:nth-child(1), .cafLgFinal .cafMatchDtls .matchData .item:nth-child(3) { width: calc((100% - 70px) / 2) } .cafLgFinal .cafMatchDtls .matchData .item:nth-child(1) .cnts { width: 64px; float: right } .cafLgFinal .cafMatchDtls .matchData .item:nth-child(2) .cnts { width: 42px; } .cafLgFinal .cafMatchDtls .matchData .item:nth-child(3) .cnts { width: 64px; float: left } .cafLgFinal .cafMatchDtls .matchData .item p { font-size: 12px } .cafLgFinal .cafMatchDtls .matchData .item:nth-child(3) p { font-size: 11px; } .cafLgFinal .cafMatchDtls .countDown .counter .matchTimer { margin: 0 4px; font-size: 24px; line-height: 1.6; width: 58px; height: 50px; } .cafLgFinal .cafMatchDtls .countDown .counter .matchTimer span { font-size: 10px; bottom: 6px; } .LandingPage.CAF { background-image: url(../../Images/ChooseSquad/choosesquadMobile.jpg?ref=1); padding-bottom: 164%; } .LandingPage.CAF .landingTeam { bottom: 22%; top: auto !important; width: calc(100% - 70px); } .LandingPage.CAF .landingTeam .line a { width: 95px; height: 35px; line-height: 2.4 } .LandingPage.CAF .landingTeam .line.TeamOne a img { display: inline-block; position: absolute; max-width: 37px; top: -10px; left: -20px; } .LandingPage.CAF .landingTeam .line.TeamTwo a img { display: inline-block; position: absolute; top: -4px; left: -24px; max-width: 55px; } .LandingPage.CAF .shareGame { bottom: 14px; left: 50%; transform: translateX(-50%); width: 100%; } .LandingPage.CAF .shareGame p { font-size: 14px; margin-bottom: 5px; } .LandingPage.CAF .aqarLogo { top: 25px; bottom: auto; left: 50%; transform: translateX(-50%); right: auto; width: 90px } .shortLinks { position: relative; display: inline-block; float: right; width: 100%; margin-bottom: 10px; right: 0; top: 0; transform: none; white-space: nowrap; overflow-x: auto; overflow-y: hidden; z-index: 0; -webkit-overflow-scrolling: touch; -webkit-transform: translateZ(0); transform: translateZ(0); } .shortLinks a { display: inline-block; float: none; margin-bottom: 0px; padding: 10px; background: #0277bd; height: auto; border-radius: 4px; position: relative; right: 0 !important; margin-left: 10px; width: 40%; text-align: center; } .shortLinks a span { float: left; margin-right: 8px; width: 34px; height: 34px; margin: 0 calc((100% - 34px) / 2) 10px; border-radius: 50%; overflow: hidden; position: relative; background: rgba(0,0,0,0.2) } .shortLinks a span img { width: 20px; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) } .shortLinks a p { display: inline-block; width: 100%; float: right; font-family: droidLight, arial; color: #fff; font-size: 12px; line-height: 1; text-align: center } .shortLinks a:last-child { margin-bottom: 0; margin-left: 0 } .matchWidget { width: 290px; height: 180px; border-top-right-radius: 20px; border-bottom-right-radius: 20px; padding: 0 30px 0 10px; } .hideMatchWidget .matchWidget { left: -260px } .matchWidget:before { width: 30px } .matchWidget .teamVotingBtn { height: 180px; border-top-right-radius: 20px; border-bottom-right-radius: 20px; padding: 10px } .matchWidget .widgetHdr { margin-bottom: 10px } .matchWidget .widgetHdr h2 { font-size: 16px; line-height: 2 } .matchWidget .widgetHdr .sponsorImg { width: 80px } .matchWidget .teamVotingBtn .votingBtn { width: 100%; margin: 0 } .matchWidget .teamVotingBtn .votingBtn .teamVote { width: 110px; margin-left: 10px; border-radius: 10px; padding: 0 10px; height: 120px; } .matchWidget .teamVotingBtn .votingBtn .team2:after { width: 26px; height: 36px; background-size: auto 36px; top: 6px; left: 50%; transform: translateX(-50%); } .matchWidget .teamVotingBtn .votingBtn .team2:before { width: 90px; right: auto; left: 50%; transform: translateX(-50%); bottom: 30px } .matchWidget .teamVotingBtn .votingBtn .team1:before { width: 38px; height: 34px; background-size: auto 34px; top: 6px; left: 50%; transform: translateX(-50%); } .matchWidget .teamVotingBtn .votingBtn .team1:after { width: 80px; right: auto; left: 50%; transform: translateX(-50%); bottom: 30px } .matchWidget .teamVotingBtn .votingBtn .top { height: 82px } .matchWidget .teamVotingBtn .votingBtn .teamVote .top p { font-size: 14px; text-align: center; margin-bottom: 4px; } .matchWidget .teamVotingBtn .votingBtn .teamVote .top span { font-size: 18px; text-align: center } .matchWidget .teamVotingBtn .votingBtn .bottom { height: 26px; overflow: hidden } .matchWidget .teamVotingBtn .votingBtn .teamVote .bottom p { font-size: 10px } .ahlyFans .teamVotingBtn .votingBtn { right: 40px; top: 20px } .zamalekFans .teamVotingBtn .votingBtn { right: 40px; top: 20px } .ahlyFans .teamVotingBtn .votingBtn .second { height: 150px; border-radius: 10px; } .zamalekFans .teamVotingBtn .votingBtn .second { height: 150px; border-radius: 10px; } .ahlyFans .teamVotingBtn .votingBtn .team1 { width: 130px } .zamalekFans .teamVotingBtn .votingBtn .team2 { width: 130px } .ahlyFans .teamVotingBtn .votingBtn .second p { font-size: 24px; padding: 14px 0 6px; } .zamalekFans .teamVotingBtn .votingBtn .second p { font-size: 24px; padding: 14px 0 6px; } .ahlyFans .teamVotingBtn .votingBtn .second span { font-size: 22px; margin-top: 4px } .zamalekFans .teamVotingBtn .votingBtn .second span { font-size: 22px; margin-top: 4px } .ahlyFans .teamVotingBtn .votingBtn .second p.fanNum { font-size: 10px } .zamalekFans .teamVotingBtn .votingBtn .second p.fanNum { font-size: 10px } .ahlyFans .teamVotingBtn .votingBtn .second .socialMediaBtn p { display: none } .zamalekFans .teamVotingBtn .votingBtn .second .socialMediaBtn p { display: none } .ahlyFans .teamVotingBtn .votingBtn .second:after { width: 113px; height: 50px; top: 0px; left: 50%; background-size: auto 50px; } .zamalekFans .teamVotingBtn .votingBtn .second:after { width: 113px; height: 50px; top: -10px; left: 50%; background-size: auto 50px; } .matchWidget .teamVotingBtn .socialMediaBtn { width: 70px; margin: 4px calc((100% - 70px) / 2) 0 } .teamVotingBtn .url { width: 80px; font-size: 10px; bottom: 10px; left: 20px; } .showOTP .matchWidget { display: none } .hideOTP .matchWidget { display: inline-block } .showOverlayMob .matchWidget { display: none } .showOverlayChipsy .matchWidget { display: none } .hideOverlayMob .matchWidget { display: inline-block } .hideOverlayChipsy .matchWidget { display: inline-block } .showOverlayChipsy .sponsorAd { display: none } .hideOverlayChipsy .sponsorAd { display: inline-block } .showOverlayMob .sponsorAd { display: none } .hideOverlayMob .sponsorAd { display: inline-block } .showOverlayMob.cafLandingPage .sponsorDuplicate { display: none } .showOverlayChipsy.cafLandingPage .sponsorDuplicate { display: none } .matchWidget .teamVotingBtn .votingBtn.DisableVote .teamVote { height: 94px } .matchWidget .teamVotingBtn .votingBtn.DisableVote .team2:before { bottom: 4px } .matchWidget .teamVotingBtn .votingBtn.DisableVote .team1:after { bottom: 4px } .matchWidget .teamVotingBtn .votingBtn .urlFirst { display: none } .matchWidget .teamVotingBtn .votingBtn.DisableVote .urlFirst { display: inline-block; float: right; text-align: center; font-family: droidLight, Arial; font-size: 11px; color: #fff; position: absolute; left: 50%; transform: translateX(-50%); bottom: 8px; width: 148px } .matchWidget .teamVotingBtn .votingBtn.DisableVote .urlFirst:before { content: ""; position: absolute; width: 100%; height: 1px; background: #fff; bottom: 2px } .showOverlayMob.cafLandingPage .sponsorDuplicate { display: none } .hideOverlayMob.cafLandingPage .sponsorDuplicate { display: inline-block } .showOverlayChipsy.cafLandingPage .sponsorDuplicate { display: none } .hideOverlayChipsy.cafLandingPage .sponsorDuplicate { display: inline-block } .proPlayer { padding: 0; background: none; } .proPlayer .featuredArea .pattern2, .proPlayer .remainContent .IMplayers, .proPlayer .importantPlayer, .proPlayer .remainContent .listing, .proPlayer .remainContent .proNews, .proPlayer .tourMatches { margin-bottom: 35px } .proPlayer .FullWidthBK { width: 100%; height: 90px; margin-left: 0; margin-top: 0; } .proPlayer .FullWidthBK h1 { font-size: 24px; right: 10px; bottom: 8px; width: 130px; line-height: 1.4; } .proPlayer .FullWidthBK img.player { height: 80%; left: 10px } .proPlayer .tabs { padding: 20px 0 12px } .proPlayer .tabs a { margin-left: 40px } .proPlayer .featuredArea, .proPlayer .remainContent { padding: 0 } .proPlayer .remainContent .Pcnt ul li:first-child { margin-right: 16px } .proPlayer .featuredArea .pattern2 ul li:first-child .desc p, .proPlayer .importantPlayer ul li:first-child .desc p { font-size: 16px; max-height: 56px; padding: 10px 0 0 0; margin-bottom: 5px } .proPlayer .featuredArea .pattern2 ul li:first-child .desc .date, .proPlayer .importantPlayer ul li:first-child .desc .date { font-size: 10px; margin-bottom: 5px; padding-top: 0; line-height: 1.6; } .proPlayer .featuredArea .pattern2 ul li { height: 66px; margin-bottom: 20px; width: calc(100% - 20px); margin-right: 10px; border: 0 } .proPlayer .featuredArea .pattern2 ul li a .imageCntnr, .proPlayer .importantPlayer ul li a .imageCntnr { width: 100px; padding-bottom: calc((100px * 67)/ 100); padding: 8px 10px } .proPlayer .featuredArea .pattern2 li .desc, .proPlayer .importantPlayer ul li .desc { width: calc(100% - 100px); padding: 4px 10px } .proPlayer .featuredArea .pattern2 ul li .desc p, .proPlayer .importantPlayer ul li .desc p { font-size: 13px; max-height: 38px } .proPlayer .featuredArea .pattern2 ul li .desc .date, .proPlayer .importantPlayer ul li .desc .date { line-height: 1.4; height: auto; font-size: 10px; margin-top: 6px } .proPlayer .featuredArea .pattern2 ul li.video .secName, .proPlayer .importantPlayer ul li.video .secName { right: 75px } .proPlayer .featuredArea .pattern2 ul li:first-child.video .secName, .proPlayer .featuredArea .pattern2 ul li:first-child.video .secName .icon { width: 50px; height: 35px } .proPlayer .featuredArea .pattern2 ul li:first-child.video .secName .icon:before { font-size: 14px } .proPlayer .featuredArea .pattern2 ul li:last-child, .proPlayer .importantPlayer ul li:last-child { margin-bottom: 0 } .proPlayer .featuredArea .pattern2 ul { display: inline-block; width: 100%; background-color: #fff; padding-bottom: 20px } .proPlayer .featuredArea .pattern2 ul li:first-child, .proPlayer .importantPlayer ul li:first-child { width: 100%; margin-right: 0; margin-bottom: 20px } .proPlayer .importantPlayer ul li { margin-right: 0; width: 100%; height: 66px; margin-bottom: 20px; border: 0 } .proPlayer .remainContent .listing ul li:first-child { width: 100%; margin-left: 0; height: auto; margin-bottom: 20px; } .proPlayer .remainContent .listing ul li:first-child a .imageCntnr { padding-bottom: calc(67% + 2px); width: auto; height: auto; display: block; float: unset; } .proPlayer .remainContent .listing ul li:first-child .desc { height: auto; padding: 0 15px; width: 100%; position: absolute; bottom: 0; background: transparent linear-gradient(180deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box; } .proPlayer .remainContent .listing ul li { margin-right: 0; width: 100%; height: 66px; margin-bottom: 20px; border: 0 } .proPlayer .remainContent .listing ul li a .imageCntnr { width: 100px; padding-bottom: calc((100px * 67)/ 100); padding: 8px 10px; height: 66px; float: right } /*.proPlayer .remainContent .listing ul li a .imageCntnr img{top: 50%;left: 50%;transform: translate(-50% , -50%);right: auto;bottom: auto;height: auto;}*/ .proPlayer .remainContent .listing ul li .desc { background: #fff; height: 100%; width: calc(100% - 100px); padding: 4px 10px; position: relative; float: left; } .proPlayer .remainContent .listing ul li:first-child .desc p { font-size: 16px; max-height: 56px; padding: 10px 0 0 0; color: #fff; height: auto } .proPlayer .remainContent .listing ul li:first-child .desc p.date { color: #fff; font-size: 11px; padding: 10px 0 0 0; margin-bottom: 5px; margin-top: 8px; } .proPlayer .remainContent .listing ul li .desc p { font-size: 13px; max-height: 38px; color: #000; font-weight: bold; } .proPlayer .remainContent .listing ul li .desc p.date { bottom: 5px; right: 0; line-height: 1; height: auto; font-size: 10px; margin-top: 13px; color: #AAAAAA } .proPlayer .featuredArea, .proPlayer .remainContent { padding: 0 } .proPlayer .playerInfo { padding: 0 } .proPlayer .playerInfo .playerImg { width: 130px; margin-top: 0; margin-right: 5px } .proPlayer .playerInfo .info { width: calc(100% - 145px); } .proPlayer .playerInfo .info h2 { font-size: 20px; margin-bottom: 5px } .proPlayer .playerInfo .info .team img { width: 22px } .proPlayer .playerInfo .personalInfo { width: 100%; padding-left: 0; margin-top: 0 } .proPlayer .playerInfo .personalInfo ul li:last-child { border-bottom: 0 } .proPlayer .playerInfo .number { position: relative; right: auto; top: auto; float: right; width: 100%; margin-top: 38px; font-size: 28px; text-align: right } .proPlayer .playerInfo .info .team { width: 100% } .proPlayer .playerInfo .info .team span { line-height: 1.8; font-size: 14px } .proPlayer .IContainer { padding: 30px 0 0 0 } .proPlayer .playerInfo .personalInfo ul li label { width: auto; font-size: 14px } .proPlayer .playerInfo .personalInfo ul { margin-top: 10px } .proPlayer .playerInfo .personalInfo ul li { padding: 5px 10px } .proPlayer .playerInfo .personalInfo ul li p { float: left; font-size: 14px } .proPlayer .IContainer .infoContainer { display: block; width: 100%; float: unset; margin-right: 0; } .proPlayer.LatestNews .listing ul li .desc { margin-top: 15px } .proPlayer.Videos .listing ul li .desc { margin-top: 15px } .proPlayer .remainContent .proNews ul li .desc .time { margin: 6px 0; font-size: 10px } .proPlayer.Videos .listing ul li .secName { right: 95px; width: 25px; height: 20px; overflow: hidden; padding: 0; top: 0; } .proPlayer.Videos .listing ul li .secName .icon { width: 25px; height: 20px } .proPlayer .remainContent .listing ul li:first-child .secName, .proPlayer .remainContent .listing ul li:first-child .secName .icon { width: 50px; height: 35px; background-color: #000 } .proPlayer .remainContent .listing ul li:first-child .secName { right: auto; left: 0 } .proPlayer .remainContent .listing ul li:first-child .secName .icon:before { font-size: 14px } .proPlayer .remainContent .listing ul li .secName, .proPlayer .remainContent .listing ul li .secName .icon { width: 25px; height: 20px; background-color: #000 } .proPlayer .remainContent .listing ul li .secName { right: 75px } .proPlayer .remainContent .listing ul li .secName .icon:before { font-size: 8px } .proPlayer .FullWidthBK.proBG h1 { right: 20px; font-size: 24px; bottom: auto; top: 50%; transform: translateY(-50%); line-height: 1.2; } .proPlayer .FullWidthBK.proBG img.newPro { left: 0px; height: 74px } .proPlayer .FullWidthBK.proBG .lines { width: 6px } .proPlayer .FullWidthBK.proBG .lines.leftBlue { left: 14px } .proPlayer .FullWidthBK.proBG .lines.leftRed { left: 140px; height: 110px; } .proPlayer .FullWidthBK.proBG .lines.leftYellow { left: 150px; height: 150px; top: -30px } .proPlayer .FullWidthBK.proBG .lines.rightBlue { right: -10px; top: 10px; height: 100px } .proPlayer .FullWidthBK.proBG .lines.rightYellow { right: 0px; top: 0px; height: 100px } .euroMain .FullWidthBK { height: 132px } .euroMain .FullWidthBK .euroHeader { height: 90px; background-position: 120% 71%, 6% 97%, 58% 102%; background-size: 56%, 39%, 36%; } .euroMain .FullWidthBK .tabs .pagecnts { display: flex; padding: 0; width: calc(100% - 20px); white-space: nowrap; overflow-x: auto; overflow-y: hidden; z-index: 0; -webkit-overflow-scrolling: touch; -webkit-transform: translateZ(0); transform: translateZ(0); } .euroMain .FullWidthBK .tabs a { float: right; font-size: 13px; margin-left: 30px; -moz-page-break-inside: avoid; -webkit-column-break-inside: avoid; break-inside: avoid; -o-column-break-inside: avoid; -ms-column-break-inside: avoid; column-break-inside: avoid; page-break-inside: avoid; } .euroMain .FullWidthBK .tabs a:last-child { margin-left: 0 } .euroMain .featuredArea .pattern2 ul li:first-child, .euroMain .importantPlayer ul li:first-child { width: 100% !important } .euroMain .featuredArea .pattern2 ul li { width: calc(100% - 10px) !important; margin-left: 0; } .euroMain .featuredArea .pattern2 li .desc { padding: 4px 10px; } .euroMain .importantPlayer .title h2 { margin-right: 10px; } .euroMain .importantPlayer .featuredArea { padding: 0 10px; } .euroMain .importantPlayer .featuredArea .pattern2 ul { padding-bottom: 0 } .euroMain .importantPlayer .featuredArea .pattern2 ul li { margin-left: 0; margin-right: 0; width: 100% !important } .euroMain .importantPlayer .featuredArea .pattern2 ul li a .imageCntnr { padding-bottom: calc((100px * 67) / 100); width: 100px; } .euroMain .importantPlayer .featuredArea .pattern2 li .desc { width: calc(100% - 100px); } .euroMain .importantPlayer .featuredArea ul li.video .secName, .euroMain .importantPlayer .featuredArea ul li .secName { right: 75px } .euroMain .featuredArea .pattern2 ul li .desc .date { right: 10px } .euroMain .featuredArea .pattern2 ul li .desc p, .euroMain .remainContent .proNews .listing ul li .desc p, .euroMain .remainContent .listing.multimedia ul li .desc p { height: 48px; font-size: 13px } .euroMain .featuredArea .pattern2 ul li .desc p { height: auto } .euroMain .remainContent .listing ul li .desc p.date { font-size: 12px; height: auto } .euroFZEP { max-width: 100%; width: 300px; margin: 0 calc((100% - 300px) / 2) 36px; float: right } .euroFZEP a { width: 300px; margin-left: 0; margin-bottom: 16px; height: 150px; padding-bottom: 0; position: relative } .euroFZEP a:last-child { margin-left: 0 } .euroFZEP a img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: auto } .euroFZEP.predFZEP { width: 300px; margin: 0 calc((100% - 300px) / 2) 0 } .euroFZEP.predFZEP a { width: 100%; margin: 0; height: 150px; padding-bottom: 0 } .euroMain .groupTabs .table .ttlRow .itemTtl:nth-child(3), .euroMain .groupTabs .table .ttlRow .itemTtl:nth-child(4), .euroMain .groupTabs .table .ttlRow .itemTtl:nth-child(5), .euroMain .groupTabs .table .wRow .item:nth-child(3), .euroMain .groupTabs .table .wRow .item:nth-child(4), .euroMain .groupTabs .table .wRow .item:nth-child(5) { display: inline-block; } .euroMain .remainContent .proNews .title h2, .euroMain .remainContent .multimedia .title h2 { margin-right: 10px } .euroMain .remainContent .proNews ul, .euroMain .remainContent .multimedia ul { padding: 0 10px } .euroMain .remainContent .proNews ul li, .euroMain .remainContent .multimedia ul li { margin-left: 0 } .spansorEuro { padding-right: 34px } .spansorEuro p { font-size: 12px } .spansorEuro #articleSpansor { width: 50px; height: 50px } .spansorEuro li { height: 50px } .spansorEuro a img { width: 50px } .spansorheader .spansorEuro { left: 10px; width: 50px; height: 60px } .spansorheader .spansorEuro p { font-size: 10px } .spansorheader .spansorEuro li { height: 40px } .spansorheader .spansorEuro a img { width: 40px; } .euroMain.euroPredCnts .FullWidthBK .tabs { padding: 0 10px; height: 42px } .euroMain.euroPredCnts .FullWidthBK .tabs a { margin-left: 20px; padding: 10px 0; position: static; } .euroMain .FullWidthBK .tabs a:last-child { float: none; margin-left: 0 } .euroMain .FullWidthBK .tabs a:last-child p { display: none } .euroPredCnts .predHint, .euroRoadToCup .predHint { padding: 20px 10px; min-height: 100% } .euroPredCnts .predHint .hintMsg h3, .euroRoadToCup .predHint .hintMsg h3 { font-size: 18px; line-height: 1.8; text-align: center } .euroPredCnts .predHint .hintMsg p, .euroRoadToCup .predHint .hintMsg p { text-align: center; margin: 20px 0 30px; font-size: 12px; } .euroPredCnts .predHint .regBtn, .euroRoadToCup .predHint .regBtn { position: relative; bottom: 0; left: 0; width: 100%; height: 40px; display: inline-block; line-height: 3.0; font-size: 14px; } .euroPredCnts .predictionCnts .tourTitle { padding: 0 10px } .euroPredCnts .predictionCnts .tourTitle .shape { width: 14px; height: 14px; margin-top: 18px; } .euroPredCnts .predictionCnts .tourTitle h3 { width: calc(100% - 18px); font-size: 14px; line-height: 3.6; padding-right: 10px; } .euroPredCnts .predictionCnts .tourTitle h3 span { font-size: 11px; } .euroPredCnts .predictionCnts .tourTitle .jokerCount { left: 10px } .euroPredCnts .predictionCnts .tourTitle .jokerCount .icon-joker:before { font-size: 14px } .euroPredCnts .predictionCnts .tourTitle .jokerCount p { font-size: 12px; line-height: 1.4 } .euroPredCnts .predictionCnts .tourTitle .jokerCount p span { font-size: 16px } .euroPredCnts .predictionCnts .accordionItem .matchData { height: 110px; padding: 0 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData .date p { line-height: 4.2; margin-left: 10px; font-size: 11px; width: auto } .euroPredCnts .predictionCnts .accordionItem .matchData .date p.day { width: auto } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { font-size: 11px; width: auto; text-align: center; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 .teamName { position: absolute; left: 54px; top: 50%; transform: translateY(-50%); text-align: left; padding-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 .teamName { position: absolute; right: 54px; top: 50%; transform: translateY(-50%); text-align: right; padding-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: 100%; top: auto; left: 0; transform: none; bottom: 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData a { display: inline-block; width: calc(100% - 30px) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult img { margin: 4px calc((100% - 20px) / 2) 2px; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 img { margin: 0; margin-right: 10px; position: absolute; left: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 img { margin: 0; margin-left: 10px; position: absolute; right: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 4px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 4px } .euroPredCnts .predictionCnts .matchData .predStatus { width: 70px; left: 40px; top: 10px; transform: none; height: 22px; } .euroPredCnts .predictionCnts .matchData .predStatus .status { font-size: 10px; line-height: 2.2; } .euroPredCnts .predictionCnts .matchData .predStatus .predTimer { font-size: 12px; margin-right: 2px; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult { height: 52px; position: relative } .euroPredCnts .predictionCnts .matchData span.icon-plus { left: 10px; top: 10px; transform: none } .euroPredCnts .predictionCnts .matchData span.icon-plus::before, .euroPredCnts .predictionCnts .matchData span.icon-plus::after { width: 10px } .euroPredCnts .predictionCnts .matchData span.icon-plus::after { left: 6px } .euroPredCnts .predictionCnts .accordionItem.open .matchData span.icon-plus { -webkit-transform: rotateX(180deg); -moz-transform: rotateX(180deg); -ms-transform: rotateX(180deg); -o-transform: rotateX(180deg); transform: rotateX(180deg); } .euroPredCnts .item .matchPrediction .team { width: calc((100% - 50px) / 2) } .euroPredCnts .item .matchPrediction .team.team1 { padding-left: 50px; } .euroPredCnts .item .matchPrediction .team.team2 { padding-right: 50px; } .euroPredCnts .item .matchPrediction .teamName, .euroPredCnts .item .matchPrediction .teamScoring p { font-size: 11px; width: 100%; text-align: center; line-height: 2; } .euroPredCnts .item .matchPrediction .dash { width: 50px; } .euroPredCnts .predictionCnts .accordionItem .matchData .predStatus .status p.points { line-height: 20px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamName { font-size: 11px; width: auto; text-align: center; line-height: 1.8; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 .teamName { position: absolute; left: 54px; top: 50%; transform: translateY(-50%); text-align: left; padding-right: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 .teamName { position: absolute; right: 54px; top: 50%; transform: translateY(-50%); text-align: right; padding-left: 10px } .euroPredCnts .predictionCnts .accordionItem .matchData .match { width: 100%; top: auto; left: 0; transform: none; bottom: 10px; } .euroPredCnts .predictionCnts .accordionItem .matchData a { display: inline-block; width: calc(100% - 30px) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult img { margin: 4px calc((100% - 20px) / 2) 2px; } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 img { margin: 0; margin-right: 10px; position: absolute; left: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 img { margin: 0; margin-left: 10px; position: absolute; right: 24px; top: 50%; transform: translateY(-50%) } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team1 span { margin-right: 4px } .euroPredCnts .predictionCnts .accordionItem .matchData .teamresult.team2 span { margin-left: 4px } .euroPredCnts .item .matchPrediction form, .euroPredCnts .item .matchPrediction .value-button { width: 30px } .euroPredCnts .item .matchPrediction input.number { width: 30px; height: 30px; font-size: 18px; } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem { padding: 10px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item { width: 100%; margin-left: 0; margin-bottom: 16px; height: 152px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item:last-of-type { margin-bottom: 0 } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item .predMatchTitle { height: 34px } .euroPredCnts .predictionCnts .accordionItem .accContent .predItem .item .predMatchTitle h3 { font-size: 13px; line-height: 2.6 } .euroPredCnts .predMatchTitle .predJoker { width: 22px; height: 22px } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"] + label { font-size: 16px } .euroPredCnts .predMatchTitle .predJoker input[type="checkbox"] + label .icon-joker:before { left: 4px } .euroPredCnts .predictionCnts .saveHint { height: 120px; bottom: -120px } .euroPredCnts .predictionCnts .saveHint .cnts { width: 290px; top: 10px; left: 50%; transform: translateX(-50%); } .euroPredCnts .predictionCnts .saveHint .cnts .icon-atn:before { line-height: 1.5; height: 50px; margin-left: 10px } .euroPredCnts .predictionCnts .saveHint .cnts p { font-size: 13px; line-height: 2; width: 100%; margin-bottom: 10px; } .euroPredCnts .predictionCnts .saveBtn { width: 100px; height: 28px; display: inline-block; line-height: 2.4; font-size: 12px; margin: 0; } .predRanking .ranking .rankMain { padding: 10px; } .predRanking .ranking .rankCnts .predMatchTitle { height: 34px; } .predRanking .ranking .rankCnts .predMatchTitle h3 { font-size: 13px; line-height: 2.6; } .jp-container { height: 274px } .predRanking .ranking .rankCnts .table .ttlRow, .predRanking .ranking .rankCnts .table .wRow { padding: 12px 10px } .predRanking .ranking .rankCnts .table .ttlRow .itemTtl.dtls, .predRanking .ranking .rankCnts .table .wRow .item.dtls { width: 50px; line-height: 2; } .predRanking .ranking .rankCnts .table .ttlRow .itemTtl.team, .predRanking .ranking .rankCnts .table .wRow .item.team { width: calc(100% - 100px); padding-right: 20px; } .predRanking .ranking .rankCnts .table .wRow .item { font-size: 13px } .predRanking .ranking .rankCnts .table .wRow .item p { font-size: 12px; width: calc(100% - 50px); line-height: 2.4; direction: ltr } .LandingPage.CAF.legends { background: url(../../Images/Legends/legendsBg.jpg) bottom center; background-size: cover; } .legends:before { right: 20px; top: 20px; width: 106px; height: 80px; background-size: 106px 80px; } .LandingPage.CAF.legends .text { right: 20px; transform: translateY(-50%); width: 260px; } .LandingPage.CAF.legends .text h1 { font-size: 26px; margin-bottom: 6px; } .LandingPage.CAF.legends .text p { font-size: 16px } .LandingPage.CAF.legends .text .startSquad { width: 140px; height: 44px; font-size: 16px; line-height: 2.6 } .euroSquadPage .shareBtn { right: 20px; bottom: 20px; transform: none } .euroSquadPage .shareBtn a.faceShare, .euroSquadPage .shareBtn a.twShare { font-size: 22px } .euroSquadPage .sponsors { bottom: 24px; left: 20px } .euroSquadPage .sponsors a { margin-right: 24px } .euroSquadPage .sponsors a:first-child:before { right: -13px } .euroSquadPage .sponsors a img { height: 26px } .chseSqMain.legendsSquad { padding-bottom: 186% } .chseSqMain.legendsSquad .allForms a { border: 1px solid #eab85f; } .chseSqMain.legends:before { width: 86px; height: 65px; background-size: 86px 65px; right: 20px } .chseSqMain.legends .sponsors { left: 50% !important; transform: translateX(-50%); width: 178px; } .chseSqMain.legends .sponsors a img { height: 34px; } .chseSqMain .allForms { bottom: 90px !important } .chseSqMain .allForms a { line-height: 1.6 !important; font-size: 16px !important; } .chseSqMain .col3 .allForms a { line-height: 2.4 !important; font-size: 12px !important; } .chseSqMain.legends .sponsors { left: 20px } .chseSqMain.legends .sponsors a img { height: 30px; } .chseSqMain.chooseTeam { padding-bottom: 186%; background: url(../../Images/ChooseSquad/Euro2020/chooseSquadGameBg.jpg) no-repeat left top; background-size: cover } .euroSquad .LandingPage.CAF { padding-bottom: 0 } .euroSquad .LandingPage.CAF:before { left: 20px; top: 84px; width: 80px; height: 34px; background-size: 80px auto; } .euroSquadPage .chseSqMain.chooseTeam:after { top: 34px; width: 80px; height: 34px; background-size: 80px auto } .euroSquad .squadCnts { position: relative; display: inline-block; float: right; width: 100%; padding: 90px 20px 60px } .euroSquad .chseTtl { width: 100%; display: inline-block; float: right; right: 0; height: auto; padding-top: 60px; position: relative; top: 0; transform: none; margin-bottom: 32px } .euroSquad .chseTtl:before, .euroSquadPage .chseSqMain.chooseTeam:before { width: 56px; height: 66px; background-size: 56px auto; top: -20px } .euroSquadPage .chseSqMain.chooseTeam:before { top: 20px } .euroSquad .chseTtl h1 { width: 100%; text-align: center } .euroSquad .chseTtl p { width: 230px; margin: 0 calc((100% - 230px) / 2); text-align: center } .euroSquad .LandingPage.CAF .landingTeam { width: 280px; display: inline-block; float: right; position: relative; left: 0; transform: none; margin: 0 calc((100% - 280px) / 2) 32px } .euroSquad .LandingPage.CAF .landingTeam li { width: 61px } .euroSquad .LandingPage.CAF .landingTeam li:nth-child(6n) { margin-left: 12px; } .euroSquad .LandingPage.CAF .landingTeam li:nth-child(4n) { margin-left: 0 } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+6) { margin-bottom: 12px; } .euroSquad .LandingPage.CAF .landingTeam li:nth-last-child(-n+4) { margin-bottom: 0px; } .euroInner .articleHeader .articleInfo .time span:first-child { margin-right: 0 } .euroInner .relatedArticles { padding: 10px } .euroInner .relatedArticles ul li.item { width: 110px } .euroInner .relatedArticles ul li.item .desc { width: 100% } .euroInner .euroMain .FullWidthBK .tabs a:last-child { float: none } .euroInner .euroMain .FullWidthBK .tabs { padding: 10px } .euroInner .tabs .euroLogo { height: 20px } .euroInner .euroMain .FullWidthBK { height: auto; margin-top: 0 } .euroInner .matchesHp li { border: 0 } .euroInner article .maxWidth .artclHdline, article .artclHdline { font-size: 20px } .euroInner .matchesHp .more:before { bottom: -10px } .euroInner .matchesHp .more { line-height: 2.3 } .euroInner .socialMargin { width: 100% } .euroInner .articleSocial { display: inline-block; height: 28px; padding: 0; } .euroInner .socialMargin { width: 100%; padding: 40px 10px 0 } .euroInner .articleSocial.euroSocial.fixed { right: auto; position: absolute; top: 5px } .euroInner .articleSocial.euroSocial { position: absolute; top: 10px; margin-top: 0; width: 76px; height: 40px; left: 0; } .euroInner .articleInfo .articleSocial { display: none } .euroInner article .detailsFooter { margin-bottom: 0 } .groups .groupTabs .table .ttlRow .itemTtl { width: 20px; font-size: 12px; padding: 0; text-align: center; margin-left: 14px; } .groups .groupTabs .table .wRow .item { width: 36px; text-align: center } .groups .groupTabs .table .wRow .team img { margin-left: 10px; width: 20px; height: auto; margin-top: 8px } .groups .GroupStanding .table .wRow .item p { font-size: 13px; line-height: 2.8 } .groups .GroupStanding .ttl { padding: 15px 10px 10px } .groups .groupTabs .table .wRow .item:nth-child(2) { padding: 10px; margin-left: 0; width: calc(100% - 149px) } .groups .groupTabs .table .ttlRow .itemTtl:nth-child(4), .groups .groupTabs .table .ttlRow .itemTtl:nth-child(5) { display: none } .groups .groupTabs .table .ttlRow .itemTtl:nth-child(7), .groups .groupTabs .table .ttlRow .itemTtl:nth-child(8) { display: inline-block } .groups .groupTabs .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 188px) } .euroInner .matchcenter .maxWidth { width: 100%; margin: 0 0 20px } .euroInner .matchcenter .matchesList ul li .allData { width: 100%; border-left: 0 } .euroInner .matchcenter .matchesList ul li .leftCol { width: 100%; border-top: 1px solid #EFEFEF; text-align: center; padding: 15px 10px } .euroInner .matchcenter .matchesList ul li .leftCol .button { margin-bottom: 0 } .euroInner .matchcenter .matchesList ul li .leftCol .details { margin-left: 10px } .euroInner .matchcenter .matchesList ul li .leftCol:last-child { margin-left: 0 } .euroInner .matchcenter .matchesList ul li .topData { padding: 10px 10px 35px } .euroInner .matchcenter .matchesList ul li .channel { top: 10px; left: 10px } .euroInner .matchcenter .matchesList ul li .topData .matchStatus { position: relative; width: 100% } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl { padding: 0 10px } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl p { font-size: 12px } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl span.time { margin-right: 5px } .euroInner .matchcenter .matchesHp .more { width: calc(100% + 24px); margin-right: -12px } .euroInner .matchcenter .dropDownContainer .placeholder { width: 100% } .euroInner .matchcenter .dropDownContainer ul { width: 100% } .euroInner .matchcenter .matchesList ul li .teamsData .teamCntnr { width: 100%; margin: 0 } .euroInner .matchcenter .matchesList ul li .bottomData .teamDtl p span.onGoal { font-size: 11px } .euroInner .matchcenter .matchesList ul li .bottomData { padding: 25px 0 } .fanZone .cntnr { width: 100%; margin: 15px 0; padding: 0 10px } .fanZone ul li.header { margin-bottom: 0; height: 140px } .fanZone ul li { width: 100% !important; margin-bottom: 30px } .fanZone ul li.header h1 { text-align: center; font-size: 32px; width: 100% } .fanZone ul li.header h1 span { position: relative; bottom: auto; right: auto; text-align: center; font-size: 30px; margin-top: 5px; } .fanZone ul li:nth-child(4), .fanZone ul li:nth-child(5) { margin-bottom: 20px } .fanZone ul li p { font-size: 13px } .fanZone ul li h2 { font-size: 24px } .fanZone ul li .gameImg { width: 125px } .fanZone ul li.FZQuiz .gameImg { width: 130px } .fanZone ul li.FZPred .gameImg { left: 15px } .fanZone ul li.FZLegend .gameImg { width: auto } .euroPredCnts .dropDownContainer .placeholder { width: 100%; font-size: 14px; line-height: 2.6 } .euroPredCnts .dropDownContainer ul { width: 100% } .login-box.loginActive, .openRegister .login-box.signUpActive { width: calc(100% - 20px); height: calc(100% - 70px); top: 60px; transform: translateX(-50%); } /* .openRegister .euroPredCnts .login-box.signUpActive{top:40px}*/ /* .openRegister .euroPredCnts .login-box.phonenumber{top:80px}*/ .openRegister .login-box { width: calc(100% - 20px) !important; height: calc(100% - 80px) !important; top: 60px; transform: translateX(-50%) } .openRegister .login-box.phonenumber { height: 340px !important } .login-box h3 { height: 50px; line-height: 3 } .login-box .closePopup { top: 12px } .lb-header a { margin: 0 0 0 20px; width: calc((100% - 20px) /2); float: right } .lb-header a:last-child { margin: 0 } .email-login { padding: 10px } .email-signup { padding: 20px 10px 10px } .u-form-group.error { margin-bottom: 20px } .u-form-group.error:nth-child(5) { margin-bottom: 10px } .u-form-group .itemError { font-size: 11px } .signUpActive .u-form-group.error .pass, .signUpActive .u-form-group.error .ConfirmPassword { margin-top: 20px } .login-box h3 { margin-bottom: 10px } .login-box.loginActive.error { height: calc(100% - 70px); margin-top: 0 } .u-form-group input[type="email"], .u-form-group input[type="password"], .u-form-group input[type="text"], .u-form-group input[type="tel"] { height: 40px } .u-form-group button, .u-form-group .Compelete, .u-form-group .SigninBtn, .u-form-group .SignupBtn { margin-top: 0 } .popupMsg .popupCntnr { width: calc(100% - 20px); height: calc(100% - 80px); padding: 30px 20px; } .popupMsg .iconDiv { width: 60px; height: 60px } .popupMsg .iconDiv:before { font-size: 32px } .passwordPage .cntnr { width: 100%; margin: 0 } .passwordPage { padding: 0; margin-top: 20px } .passwordPage input { height: 40px } .RulesMsg .cntnr { width: calc(100% - 20px); height: calc(100% - 80px); top: 65px; transform: translateX(-50%); } .RulesMsg .rulesItems { overflow-x: hidden !important; overflow-y: scroll !important; height: calc(100% - 80px); padding: 0 20px } .RulesMsg ul { width: 100%; margin: 0 } .RulesMsg .lb-header { margin-bottom: 10px } .popupMsg .popupCntnr { width: calc(100% - 20px); height: calc(100% - 80px); padding: 30px 20px; top: 60px; transform: translateX(-50%); } .euroRoadToCup { padding: 100px 10px 32px } .euroRoadToCup .title { margin-bottom:80px; height: auto } .euroRoadToCup .title h1 { font-size: 22px; height: 80px } .euroRoadToCup .title span { font-size: 15px; margin-top: 10px; line-height: 1.6 } .euroRoadToCup .title h1:before { width: 35px; height: 80px; background-size: 35px auto; top: 0 } .euroRoadToCup .rtcSponsor img { width: 50px } .euroRoadToCup .title .regBtnHeader { left: 0; top: -72px } .euroRoadToCup .breadcrumbDiv { padding-bottom: 32px; position: static; margin-bottom: 16px; } .euroRoadToCup .groups .stageInfo h2 { font-size: 18px } .euroRoadToCup .groups .stageInfo p { font-size: 14px;text-align:center } .euroRoadToCup .groupTaples .group { width: 100%; margin-left: 0; margin-bottom: 16px; height: 420px } .euroRoadToCup .groupTaples .group:nth-child(3n) { margin-left: 0 } .euroRoadToCup .groupTaples .group:nth-child(2n) { margin-left: 0 } .euroRoadToCup .groupTaples .GroupTeams { width: 260px; margin: 10px calc((100% - 260px) / 2) 20px } .euroRoadToCup .groupTaples .GroupTeams li { margin-left: 20px } .euroRoadToCup .groupTaples .GroupTeams li span { font-size: 11px } .euroRoadToCup .groupTaples .sortingTeams li .TeamName, .euroRoadToCup .Place3rd li .TeamName { font-size: 13px;line-height:40px} .euroRoadToCup .Place3rd { width: 100%; margin: 0; } .euroRoadToCup .groupTaples h3 { font-size: 16px } .euroRoadToCup .Place3rd p { font-size: 13px } .euroRoadToCup .submitBtn { height: 50px; font-size: 16px; line-height: 3; margin: 64px calc((100% - 200px) / 2) 70px; } .euroRoadToCup .nextHint { bottom: 90px } .euroRoadToCup .shareGame .socialLink.wappShare, .euroRoadToCup .shareGame .socialLink.msngrShare { display: inline-block } .euroRoadToCup .shareGame { bottom: 10px } .euroRoadToCup .shareGame p { margin-left: 10px; font-size: 12px; line-height: 30px } .euroRoadToCup .shareGame .icon-share:before { font-size: 18px } .tour2694 .euroRoadToCup .allRounds .roundItem { width: 250px; margin-left: 0; padding-left: 20px } .tour2694 .euroRoadToCup .allRounds .roundItem:last-child { margin-left: 0 } .second .teamData:last-child:before, .second .teamData:first-child:before, .third .teamData:last-child:before, .third .teamData:first-child:before, .final .teamData:last-child:before, .final .teamData:first-child:before { width: 14px; right: -10px; } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .separating { width: calc(100% + 4px); } .euroRoadToCup .allRounds .roundItem .cupWinner h3 { font-size: 16px } .tour2694 .euroRoadToCup .allRounds .roundItem .qualifiedTeams .cupWinner .TeamName { font-size: 16px } .euroRoadToCup .flickity-button { background-color: #fff; border-radius: 6px; border: none; color: #810d2f; display: none; } .flickity-button.previous:before { content: 'i'; color: #810d2f; } .euroRoadToCup .flickity-button.previous { left: auto; right: 0; color: inherit } .euroRoadToCup .flickity-button.next:before { color: inherit } .euroRoadToCup .flickity-button:hover { background: #fff; color: #810d2f } .euroRoadToCup .flickity-button:active:before, .euroRoadToCup .flickity-button:hover:before { color: inherit } .euroRoadToCup .flickity-button:disabled { opacity: 0.3; pointer-events: none; } .euroRoadToCup .allRounds .roundItem { padding-left: 2px } .euroPredCnts .quizHint .hintMsg { margin-bottom: 0; } .euroQuizCnts .afterLogin .welcomeHint { height: 70px; min-height: 100%; padding: 0; } .euroQuizCnts .afterLogin .welcomeHint .hintMsg h3 { margin-top: 20px; text-align: right } .euroQuizCnts .afterLogin .welcomeHint .yourScore { width: 120px; height: 70px; left: 0 } .euroQuizCnts .afterLogin .welcomeHint .yourScore p { font-size: 15px; margin: 6px 0 0px; } .euroQuizCnts .resultDiv .yourScore p { font-size: 15px } .euroQuizCnts .afterLogin .welcomeHint .yourScore span { font-size: 24px } .euroQuizCnts .quizSteps { padding: 32px 16px } .euroQuizCnts .getReadyTimer p, .euroQuizCnts .resultDiv p { font-size: 20px; line-height: 2.4 } .euroQuizCnts .getReadyTimer span { font-size: 92px } .euroQuizCnts .game-top .date p { font-size: 12px; line-height: 2.6 } .euroQuizCnts .questionDiv { min-height: 110px } .euroQuizCnts .questionDiv p { padding: 0 16px; font-size: 18px } .euroQuizCnts .answer { width: 100%; height: 50px; margin-bottom: 16px; margin-left: 0px; } .euroQuizCnts .answer p { font-size: 14px; } .euroQuizCnts .resultDiv .allStars { width: 200px; height: 100px; margin: 0 calc((100% - 200px) / 2) 100px; } .euroQuizCnts .resultDiv .allStars .star { width: 60px; height: 60px } .euroQuizCnts .resultDiv .allStars .star.icon-star:before { font-size: 60px } .EuroMatchDetails .euroMain .FullWidthBK .tabs { width: 100% } .euroMain .FullWidthBK:after { height: calc(100% - 42px) } .euroMain.olympic .FullWidthBK .euroHeader { height: 65px; background-position: 152%; background-size: 138%; } .euroMain.olympic.football .FullWidthBK .euroHeader, .euroMain.olympic.handball .FullWidthBK .euroHeader { background-position: 140%; background-size: 159% } .euroMain.olympic.football .FullWidthBK .euroHeader img.football, .euroMain.olympic.handball .FullWidthBK .euroHeader img.handball { width: 90px; right: 4px } .euroMain.olympic.football .FullWidthBK .euroHeader a, .euroMain.olympic.handball .FullWidthBK .euroHeader a { width: 55px; left: 80px } .euroMain.olympic.football .FullWidthBK .euroHeader img.spansor, .euroMain.olympic.handball .FullWidthBK .euroHeader img.spansor { width: 66px; left: 5px } .euroMain.olympic .FullWidthBK:after { display: none } .euroMain.olympic .FullWidthBK .euroHeader img { right: 10px; width: 42px; bottom: 5px; } .medalPage .maxWidth { width: 100%; margin: 0 } .olympicStrip .euroMain .FullWidthBK .euroHeader { border-right: 0; background-size: 195%; background-position: 152%; } .olympicStrip .FullWidthBK .euroHeader img.robotStrip { display: none } .euroStrip.olympicStrip .EntryPoint, .euroMain.olympic .olympicStrip .FullWidthBK .euroHeader { height: 90px } .olympicStrip .FullWidthBK .euroHeader .textStrip { margin-right: 8px } .olympicStrip .FullWidthBK .euroHeader .textStrip p { font-size: 16px; margin: 15px 0 8px; line-height: 1.5; } .olympicStrip .spansorheader .spansorEuro a img { width: 98px; left: -7px; transform: none; bottom: 8px; top: auto; } .euroStrip.olympicStrip .spansorheader .spansorEuro { width: 110px; left: 10px } .olympicStrip .FullWidthBK .euroHeader a { width: 40px; height: 50px; left: 10px; } .olympicStrip .FullWidthBK .euroHeader .textStrip span { width: 80px; height: 25px; font-size: 13px; margin-top: 0; border-radius: 5px; line-height: 1.8 } .olympicStrip .FullWidthBK .euroHeader img { right: auto } .olympicStrip .spansorheader .spansorEuro { top: auto; transform: none; bottom: 0; left: 3px } .olymicInner .euroMain.olympic .FullWidthBK .tabs { padding: 0 10px } .olymicInner .demo-gallery > ul > li .showGal { font-size: 13px; line-height: 2.8 } .olymicInner .demo-gallery > ul > li .icon-camera:before { font-size: 13px; line-height: 2.8 } .olymicInner .euroMain.olympic .FullWidthBK { margin-top: 0 } .euroInner .olympic .euroMain .FullWidthBK .tabs { padding: 0 20px } .proPlayer.olympic.LatestNews .listing ul li .desc { margin-top: 5px } .tour2694 .euroRoadToCup { padding: 70px 10px } .tour2694 .euroRoadToCup .title { margin-bottom: 30px } .tour2694 .euroRoadToCup .title h1 { font-size: 24px; height: 60px; padding: 0 40px 0 0; line-height: 1.2 } .tour2694 .euroRoadToCup .title span { font-size: 14px } .tour2694 .euroRoadToCup .title h1:before { width: 29px; height: 60px } .tour2694 .euroRoadToCup .title .regBtnHeader { top: -50px } .viewTabContainer { padding: 50px 10px 100px } .tour2694 .euroRoadToCup .breadcrumbDiv { margin-bottom: 30px; padding-bottom: 0 } .tour2694 .euroRoadToCup .viewTabContainer .camel { left: 10px; width: 104px; height: 90px } .tour2694 .euroRoadToCup .viewTabContainer .eagles { left: 10px; top: 10px; width: 96px; height: 40px } .tour2694 .euroRoadToCup .viewTabContainer .palm { width: 346px; height: 270px; } .tour2694 .euroRoadToCup .groups { padding-bottom: 20px; padding-top: 0px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams { width: 2480px; margin: 10px calc((100% - 248px) / 2) 20px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li { margin-left: 16px } .tour2694 .euroRoadToCup .groupTaples .GroupTeams li:last-of-type { margin-left: 0; } .tabs-container { position: relative; z-index: 1 } .tabs-nav > li { padding: 14px 10px; font-size: 13px; } .tour2694 .euroRoadToCup .breadcrumb li { margin-left: 36px } .tour2694 .euroRoadToCup .breadcrumb li:last-child { margin-left: 0px } .tour2694 .euroRoadToCup .breadcrumb li span { width: 24px; height: 24px; line-height: 24px } .tour2694 .euroRoadToCup .breadcrumb li p { font-size: 12px; line-height: 24px; padding-right: 6px } .tour2694 .euroRoadToCup .groups .stageInfo h2 { font-size: 16px; } .tour2694 .euroRoadToCup .groups .stageInfo p { font-size: 13px; } .tour2694 .euroRoadToCup .groupTaples .group { margin-left: 0; margin-bottom: 20px; width: 100%; } .tour2694 .euroRoadToCup .nextHint { bottom: 60px } .euroRoadToCup .allRounds .roundItem h3 { font-size: 14px } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .teamData .team { } .euroRoadToCup .allRounds .roundItem .qualifiedTeams .TeamName { font-size: 14px; line-height: 40px; padding-right: 10px } .tour2694 .euroRoadToCup .submitBtn { width: 100%; margin: 40px 0 0 } .chooseLeague p.text { font-size: 24px } .chooseLeague ul { width: 100% } .chooseLeague ul li { width: calc((100% - 12px) /2); margin-left: 12px; padding: 10px; height: 140px; margin-bottom: 12px } .chooseLeague ul li:nth-of-type(5n) { margin-left: 12px } .chooseLeague ul li:nth-of-type(2n) { margin-left: 0 } .chooseLeague ul li a { display: inline-block; width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 10px; text-align: center } .chooseLeague ul li img { height: 45px; position: relative; top: auto; left: auto; transform: none; } .chooseLeague ul li p { font-size: 14px; margin-top: 20px } .newPred .pagecnts { width: 100%; margin: 0 0; padding: 0 10px } .newPred.tour-1 .FullWidthBK .pagecnts { padding: 0 10px } .FullWidthBK .pagecnts { width: calc(100% - 20px); margin-right: 10px } .newPred .euroPredCnts .tabs .regBtn { left: 10px } .newPred .privateLeague .predContainerDiv { padding: 30px 0 } .proPlayer .rightside .warning { padding: 8px; font-size: 14px } /*.newPred .prediction{padding:15px 10px}*/ .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.num { width: 150px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item { width: calc((100% - 150px)/2) } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a { padding: 0 15px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting, .newPred.predRanking .createLeague .ranking .rankCnts .table .wRow .buttons { width: auto; margin: 0 auto; float: none } .newPred .proPlayer .title .leagueSetting { float: right; width: 100%; margin-top: 5px } .newPred .proPlayer .title .leagueSetting a { padding: 0 10px; height: 36px; margin-bottom: 5px } .newPred .proPlayer .title .leagueSetting a .cont p { line-height: 34px } .newPred .proPlayer .title .leagueSetting a .cont .icon-edit:before, .newPred .proPlayer .title .leagueSetting a .cont .icon-remove:before, .newPred .proPlayer .title .leagueSetting a .cont .icon-share:before, .newPred .proPlayer .title .leagueSetting a .cont .icon-exit:before { line-height: 36px; font-size: 12px; float: right } .newPred .proPlayer .title h2 { font-size: 22px } .newPred .proPlayer .title .membersNumber, .newPred .proPlayer .title .totalNum { margin-top: 12px } .predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow { height: 100px } .predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .buttons { width: auto; margin: 8px auto; float: none } .predRanking .ranking .rankCnts .table .wRow .item.dtls.stable:before { width: 11px; height: 11px; top: 6px; right: 6px; } .newPred.predRanking .createLeague .ranking .rankCnts .jp-container { max-height: 400px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item { width: calc(100% - 34px); margin-right: -8px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.num { width: 50px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item:last-child { width: 100%; margin-right: 0 } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .leagueSetting a .cont p { width: auto } .newPred.predRanking .createLeague .ranking .rankCnts .table .wRow.noaction { height: 90px } .newPred.predRanking .createLeague .ranking .rankCnts .table .wRow.admin { height: 70px; padding: 22px 10px; background-color: #0e0e0e } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.num, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.num { width: 50px; margin-left: 12px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item.totalPoints, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.totalPoints { width: 50px } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .wRow .item { width: calc(100% - 89px); } .newPred.predRanking .createLeague .ranking.allLeagues .rankCnts .table .ttlRow .itemTtl.button { display: none } .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .ttlRow .itemTtl.num, .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .wRow .item.num { width: 50px; margin-left: 12px } .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .wRow .item.totalPoints, .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .ttlRow .itemTtl.totalPoints { width: 50px } .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .ttlRow .itemTtl, .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .wRow .item { width: calc(100% - 89px); } .newPred.predRanking .createLeague .ranking.allLeagues .private .rankCnts .table .ttlRow .itemTtl.button { display: none } .predRanking .ranking .rankCnts .table .wRow .buttons a { font-size: 11px; line-height: 2.3; height: 28px } .newPred .privateLeague .createdLeaguePopup { height: calc(100% - 50px); top: 50px; } .newPred .privateLeague .createdLeaguePopup .popupContainer { width: calc(100% - 20px); max-height: 475px; } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts { padding: 15px; overflow-x: hidden !important; overflow-y: scroll !important; max-height: 400px; } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts h4 { margin-bottom: 10px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode.code .codeInputCntnr .codeInput { width: 100%; margin-bottom: 8px; overflow: hidden } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode { margin-bottom: 25px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode .codeInputCntnr .copyCodeBtn { width: 100px; height: 40px; line-height: 40px } .newPred .privateLeague .createdLeaguePopup .popupContainer .popupCnts .leagueCode.link .codeInputCntnr .goLeague { width: 100%; margin-top: 15px; margin-left: 0 } .euroPredCnts .FullWidthBK h1:first-child { width: 100%; right: 10px } .euroPredCnts .FullWidthBK h1:first-child:first-child { font-size: 23px; bottom: 38px } .euroPredCnts .FullWidthBK h1:first-child:nth-of-type(2) { font-size: 18px; } .newPred .euroPredCnts .FullWidthBK h2 { width: 100%; right: 15px; font-size: 19px } .newPred .euroMain .FullWidthBK .tabs { padding: 4px 0 !important } .tour2697.newPred .euroPredCnts .FullWidthBK h2 { width: 100%; right: 15px; font-size: 19px } .tour2697.newPred .euroMain .FullWidthBK .tabs { padding: 4px 0 !important } .tour2727.newPred .euroPredCnts .FullWidthBK h2 { width: 100%; right: 10px; font-size: 19px } .tour2727.newPred .euroMain .FullWidthBK .tabs { padding: 4px 0 !important } .tour2727.newPred .FullWidthBK .tabs .pagecnts { overflow-x: scroll !important; overflow-y: hidden !important; padding: 0 10px } .tour2730.newPred .euroPredCnts .FullWidthBK h2 { width: 100%; right: 10px; font-size: 19px } .tour2730.newPred .euroMain .FullWidthBK .tabs { padding: 4px 0 !important } .tour2730.newPred .FullWidthBK .tabs .pagecnts { overflow-x: scroll !important; overflow-y: hidden !important; padding: 0 10px } .newPred .FullWidthBK .pagecnts { padding: 0 20px } .tour2694.newPred .FullWidthBK .pagecnts { padding: 0 15px } } @media screen and (max-width:767px) and (orientation:landscape) { .cafLgFinal .entryPoint { width: 100%; margin-right: 0; margin-left: 0; } .LandingPage.CAF .landingTeam { width: calc(100% - 200px); } .email-login, .email-signup { overflow-x: hidden !important; overflow-y: scroll !important; height: 135px; } .openRegister .login-box.profileActive { overflow-x: hidden !important; overflow-y: scroll !important; height: 250px; } .openRegister .login-box.phonenumber { height: 250px !important } .euroMain .FullWidthBK .euroHeader { background-position: 120% 71%, 6% 60%, 58% 102%; background-size: 56%, 39%, 36%; } } @media screen and (max-width:767px) and (orientation:portrait) { .cafLgFinal .entryPoint { width: 100%; margin-right: 0; margin-left: 0; } .cafLgFinal .entryPoint a { width: 100%; margin-left: 0; margin-bottom: 16px } .cafLgFinal .entryPoint a:last-child { margin-bottom: 0 } } /******************** Choose Squad ACN 2019 ********************/ .acn .container { background: url(../../Images/ChooseSquad/Euro2020/chooseSquadGameBg.jpg) no-repeat left top; background-size: cover; } .acn .content-wrap { padding: 0; background: none } .acn .content-wrap:before { display: none } .acn .content { padding: 0 } .chseSqMain { margin-bottom: 0; padding-bottom: 55%; position: relative; background: none; overflow: hidden; } .chseSqMain .playerListMenu { background: url(../../Images/ChooseSquad/Euro2020/chooseSquadGameBg.jpg) no-repeat left top; background-size: cover } /** Right **/ .chseSqMain .col1 { float: right; display: inline-block; position: absolute; width: 270px; height: calc(100% - 160px); right: 60px; top: 80px } .chseSqMain .logo { position: absolute; top: 0; right: 0; display: inline-block; width: 310px } .chseSqMain .logo img { width: 140px; height: auto; margin-bottom: 30px; float: right } .chseSqMain .logo p { display: inline-block; width: 100%; float: right; font-family: droidLight, Arial; font-size: 24px; color: #fff; text-align: right; direction: rtl; line-height: 1.5 } .chseSqMain .allForms { display: inline-block; float: right; width: 100%; position: absolute; bottom: 70px; right: 0 } .chseSqMain .allForms a { display: inline-block; float: right; width: 100%; height: 70px; text-align: center; margin-bottom: 10px; background: #000; font-family: CenturyGothicLight, Arial; font-size: 24px; color: #fff; line-height: 2.6; box-shadow: 0 12px 3px 0px rgba(0,0,0,0.2); border: 3px solid #fff; border-radius: 10px } .chseSqMain .allForms a:last-child { margin-bottom: 0 } .chseSqMain .allForms a:hover, .chseSqMain .allForms a.selected { background: #0277bd; box-shadow: 0 8px 2px 0px rgba(0,0,0,0.1); } .chseSqMain .col3 .allForms a { font-size: 18px; line-height: 3.6 } .chseSqMain .allForms .share { margin-top: 0; font-family: droidBold, Arial } .chseSqMain .allForms .share:hover { background: #0277bd } .chseSqMain .allForms .share.dimmed { opacity: 0.25; pointer-events: none } /** Center **/ .chseSqMain .chooseMain { position: absolute; left: 50%; top: 80px; transform: translateX(-50%); width: calc(100% - 850px); z-index: 2; height: calc(100% - 160px) } .chseSqMain .chooseMain h1 { display: inline-block; width: 100%; float: right; font-family: droidBold, Arial; font-size: 42px; color: #fff; text-align: center; direction: rtl; line-height: 1.1; margin-bottom: 30px } .chseSqMain .chooseMain .stadiumSquad { width: 100%; padding-bottom: 86%; display: inline-block; position: relative; background: url(../../Images/ChooseSquad/Euro2020/mal3ab.png) no-repeat center center; background-size: 100% auto } /** Left **/ .chseSqMain .col3 { float: right; display: inline-block; position: absolute; width: 270px; height: calc(100% - 160px); left: 60px; top: 80px } .chseSqMain .manager { position: absolute; top: 80px; left: 0; z-index: 3 } .chseSqMain .sponsLogo { position: absolute; bottom: 0; left: 0; display: inline-block } .chseSqMain .sponsLogo img { width: 128px; height: auto; float: right } .chseSqMain .player { position: absolute; width: 90px; height: 90px; text-align: center; font-family: CenturyGothicLight, Arial; font-size: 24px; color: #fff; line-height: 2.6 } .chseSqMain .icon-add:before { content: "H"; display: block; font-size: 32px; line-height: 2.6; position: relative; z-index: 2 } .chseSqMain .player .imgCntr { width: 90px; height: 90px; border-radius: 50%; position: relative; overflow: hidden; background: #000; border: 3px solid #fff; box-shadow: 0 12px 3px 0px rgba(0,0,0,0.2) } .chseSqMain .player .imgCntr img { width: 90px; top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute; z-index: 3 } .chseSqMain .player p { display: inline-block; width: 100%; float: right; font-family: droidLight, Arial; font-size: 14px; color: #fff; text-align: center; direction: rtl; margin-top: 6px; line-height: 1.4; position: absolute; width: 100px; left: -5px; } /*** Player List Menu ***/ .playerListMenu { position: absolute; width: 100%; height: 100%; top: 0; left: 0; bottom: 0; right: 0; opacity: 0; visibility: hidden; background: url(../../Images/ACN/ChooseSquad2019/chooseSquadACN2019.jpg) no-repeat left top; z-index: 3; padding: 80px 60px; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; -o-transition: opacity .3s 0s, visibility 0s .3s; -ms-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; } .openMenu .playerListMenu { opacity: 1; visibility: visible; transition: opacity .3s 0s, visibility 0s 0s; -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; -ms-transition: opacity .3s 0s, visibility 0s 0s; -o-transition: opacity .3s 0s, visibility 0s 0s; } .playerListMenu:before { content: ""; position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); z-index: 1 } .playerListMenu .listCnts { position: relative; z-index: 2 } .playerListMenu h2 { display: inline-block; width: 100%; float: right; font-family: droidBold, Arial; font-size: 24px; color: #fff; text-align: right; direction: rtl; margin-bottom: 30px } .playerListMenu ul li { float: right; width: calc((100% - 18px) / 7); background: rgba(255,255,255,0.04); margin-left: 3px; margin-bottom: 3px; } .playerListMenu ul li:nth-child(7n) { margin-left: 0 } .playerListMenu ul li a { padding-bottom: 100%; position: relative; width: 100%; float: right } .playerListMenu ul li a:hover { background: rgba(255,255,255,0.05) } .playerListMenu ul li .item { position: absolute; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; padding: 30px; } .playerListMenu ul li .imgCntr { width: 120px; height: 120px; border-radius: 50%; margin: 0 auto; position: relative; overflow: hidden; border: 3px solid #fff } .playerListMenu ul li .imgCntr img { width: 120px; top: 50%; left: 50%; transform: translate(-50%, -50%); position: absolute; z-index: 3 } .playerListMenu ul li p { display: inline-block; width: 100%; float: right; font-family: droidLight, Arial; font-size: 16px; color: #fff; text-align: center; direction: rtl; margin-top: 10px } .playerListMenu .closeMenu { position: absolute; top: 60px; left: 60px; z-index: 3 } .playerListMenu .icon-close:before { content: "B"; font-size: 32px; color: #fff } /********** 4-4-2 **********/ /** Top **/ .chseSqMain .form442 .player.p01 { top: 20px; left: 50%; transform: translateX(-50%) } .chseSqMain .form442 .player.p02 { top: 26%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p03 { top: 26%; left: calc(37.5% - 30px) } .chseSqMain .form442 .player.p04 { top: 26%; right: calc(37.5% - 30px) } .chseSqMain .form442 .player.p05 { top: 26%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p06 { top: 52%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p07 { top: 52%; left: calc(37.5% - 30px) } .chseSqMain .form442 .player.p08 { top: 52%; right: calc(37.5% - 30px) } .chseSqMain .form442 .player.p09 { top: 52%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p10 { top: 78%; left: calc(37.5% - 30px) } .chseSqMain .form442 .player.p11 { top: 78%; right: calc(37.5% - 30px) } /********** 4-3-3 **********/ /** Top **/ .chseSqMain .form433 .player.p01 { top: 20px; left: 50%; transform: translateX(-50%) } .chseSqMain .form433 .player.p02 { top: 26%; left: calc(12.5% - 0px) } .chseSqMain .form433 .player.p03 { top: 26%; left: calc(37.5% - 30px) } .chseSqMain .form433 .player.p04 { top: 26%; right: calc(37.5% - 30px) } .chseSqMain .form433 .player.p05 { top: 26%; right: calc(12.5% - 0px) } .chseSqMain .form433 .player.p06 { top: 52%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p07 { top: 52%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p08 { top: 52%; right: calc(25% - 30px) } .chseSqMain .form433 .player.p09 { top: 78%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p10 { top: 78%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p11 { top: 78%; right: calc(25% - 30px) } /********** 3-5-2 **********/ /** Top **/ .chseSqMain .form352 .player.p01 { top: 20px; left: 50%; transform: translateX(-50%) } .chseSqMain .form352 .player.p02 { top: 26%; left: calc(25% - 30px) } .chseSqMain .form352 .player.p03 { top: 26%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p04 { top: 26%; right: calc(25% - 30px) } .chseSqMain .form352 .player.p05 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form352 .player.p06 { top: 48%; left: calc(30% - 14px) } .chseSqMain .form352 .player.p07 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p08 { top: 48%; right: calc(30% - 14px) } .chseSqMain .form352 .player.p09 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form352 .player.p10 { top: 78%; left: calc(37.5% - 30px) } .chseSqMain .form352 .player.p11 { top: 78%; right: calc(37.5% - 30px) } /********** 4-5-1 **********/ /** Top **/ .chseSqMain .form451 .player.p01 { top: 20px; left: 50%; transform: translateX(-50%) } .chseSqMain .form451 .player.p02 { top: 26%; left: calc(12.5% - 0px) } .chseSqMain .form451 .player.p03 { top: 26%; left: calc(37.5% - 30px) } .chseSqMain .form451 .player.p04 { top: 26%; right: calc(37.5% - 30px) } .chseSqMain .form451 .player.p05 { top: 26%; right: calc(12.5% - 0px) } .chseSqMain .form451 .player.p06 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form451 .player.p07 { top: 48%; left: calc(30% - 14px) } .chseSqMain .form451 .player.p08 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form451 .player.p09 { top: 48%; right: calc(30% - 14px) } .chseSqMain .form451 .player.p10 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form451 .player.p11 { top: 78%; left: 50%; transform: translateX(-50%); } @media screen and (min-width:1680px) and (max-width:1919px) { .chseSqMain .col1 { width: 245px; height: calc(100% - 120px); } .chseSqMain .chooseMain { width: calc(100% - 730px); } .chseSqMain .col3 { width: 245px; height: calc(100% - 120px); } .chseSqMain .manager { left: 10px } .chseSqMain .manager img { width: 440px } .chseSqMain .player { width: 80px; height: 80px } .chseSqMain .player .imgCntr { width: 80px; height: 80px } .chseSqMain .icon-add:before { font-size: 28px; line-height: 2.6 } .chseSqMain .player .imgCntr img { width: 80px } .playerListMenu ul li .item { padding: 14px 20px } .ACNHeader::after { left: 170px; } .ACNHeader::before { right: 216px; } .articleChooseSquad { padding-bottom: 68% } } @media screen and (min-width:1600px) and (max-width:1679px) { .chseSqMain .col1 { width: 210px; height: calc(100% - 140px); } .chseSqMain .allForms a { height: 60px; line-height: 2.2 } .chseSqMain .chooseMain { width: calc(100% - 730px); } .chseSqMain .col3 { width: 210px; height: calc(100% - 140px); } .chseSqMain .manager { left: 10px } .chseSqMain .manager img { width: 420px } .chseSqMain .player { width: 70px; height: 70px } .chseSqMain .player .imgCntr { width: 70px; height: 70px } .chseSqMain .icon-add:before { font-size: 26px; line-height: 2.4 } .chseSqMain .player .imgCntr img { width: 70px } .chseSqMain .player p { left: -15px } .playerListMenu ul li .imgCntr { width: 100px; height: 100px } .playerListMenu ul li .imgCntr img { width: 100px } .playerListMenu ul li .item { padding: 20px } .ACNHeader::after { left: 170px; } .ACNHeader::before { right: 182px; } .articleChooseSquad { padding-bottom: 66%; margin-bottom: 40px } } @media screen and (min-width:1536px) and (max-width:1599px) { .chseSqMain .logo img { margin-bottom: 10px } .chseSqMain .logo p { font-size: 22px } .chseSqMain .col1 { width: 210px; height: calc(100% - 140px); } .chseSqMain .allForms a { height: 60px; line-height: 2.2 } .chseSqMain .chooseMain { width: calc(100% - 720px); } .chseSqMain .col3 { width: 210px; height: calc(100% - 140px); } .chseSqMain .manager { left: 10px } .chseSqMain .manager img { width: 420px } .chseSqMain .player { width: 70px; height: 70px } .chseSqMain .player .imgCntr { width: 70px; height: 70px } .chseSqMain .icon-add:before { font-size: 26px; line-height: 2.4 } .chseSqMain .player .imgCntr img { width: 70px } .chseSqMain .player p { position: absolute; width: 100px; left: -15px; } .playerListMenu ul li .imgCntr { width: 100px; height: 100px } .playerListMenu ul li .imgCntr img { width: 100px } .playerListMenu ul li .item { padding: 16px 20px } .ACNHeader::after { left: 170px; } .ACNHeader::before { right: 156px; } .articleChooseSquad { padding-bottom: 66%; margin-bottom: 40px } } @media screen and (min-width:1440px) and (max-width:1535px) { .articleChooseSquad { padding-bottom: 64%; margin-bottom: 40px } .chseSqMain .logo img { margin-bottom: 10px } .chseSqMain .logo p { font-size: 22px } .chseSqMain .col1 { width: 210px; height: calc(100% - 80px); right: 40px; top: 40px; } .chseSqMain .allForms a { height: 60px; line-height: 2.2 } .chseSqMain .chooseMain { width: calc(100% - 610px); top: 40px } .chseSqMain .chooseMain h1 { font-size: 36px } .chseSqMain .col3 { width: 210px; height: calc(100% - 80px); left: 40px; top: 40px; } .chseSqMain .manager { left: 10px; top: 40px } .chseSqMain .manager img { width: 380px } .chseSqMain .player { width: 70px; height: 70px } .chseSqMain .player .imgCntr { width: 70px; height: 70px } .chseSqMain .icon-add:before { font-size: 26px; line-height: 2.4 } .chseSqMain .player .imgCntr img { width: 70px } .chseSqMain .player p { position: absolute; width: 100px; left: -15px; } .playerListMenu { padding: 40px } .playerListMenu .closeMenu { top: 20px; left: 40px } .playerListMenu ul li .imgCntr { width: 100px; height: 100px } .playerListMenu ul li .imgCntr img { width: 100px } .playerListMenu ul li .item { padding: 12px 20px } /********** 4-4-2 **********/ /** Top **/ .chseSqMain .form442 .player.p01 { top: 10px } .chseSqMain .form442 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p03 { top: 24%; left: calc(37.5% - 24px) } .chseSqMain .form442 .player.p04 { top: 24%; right: calc(37.5% - 24px) } .chseSqMain .form442 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p06 { top: 51%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p07 { top: 51%; left: calc(37.5% - 24px) } .chseSqMain .form442 .player.p08 { top: 51%; right: calc(37.5% - 24px) } .chseSqMain .form442 .player.p09 { top: 51%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p10 { top: 78%; left: calc(37.5% - 24px) } .chseSqMain .form442 .player.p11 { top: 78%; right: calc(37.5% - 24px) } /********** 4-3-3 **********/ /** Top **/ .chseSqMain .form433 .player.p01 { top: 10px } .chseSqMain .form433 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form433 .player.p03 { top: 24%; left: calc(37.5% - 24px) } .chseSqMain .form433 .player.p04 { top: 24%; right: calc(37.5% - 24px) } .chseSqMain .form433 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form433 .player.p06 { top: 51%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p07 { top: 51%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p08 { top: 51%; right: calc(25% - 30px) } .chseSqMain .form433 .player.p09 { top: 78%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p10 { top: 78%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p11 { top: 78%; right: calc(25% - 30px) } /********** 3-5-2 **********/ /** Top **/ .chseSqMain .form352 .player.p01 { top: 10px } .chseSqMain .form352 .player.p02 { top: 24%; left: calc(25% - 30px) } .chseSqMain .form352 .player.p03 { top: 24%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p04 { top: 24%; right: calc(25% - 30px) } .chseSqMain .form352 .player.p05 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form352 .player.p06 { top: 48%; left: calc(30% - 8px) } .chseSqMain .form352 .player.p07 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p08 { top: 48%; right: calc(30% - 8px) } .chseSqMain .form352 .player.p09 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form352 .player.p10 { top: 78%; left: calc(37.5% - 24px) } .chseSqMain .form352 .player.p11 { top: 78%; right: calc(37.5% - 24px) } /********** 4-5-1 **********/ /** Top **/ .chseSqMain .form451 .player.p01 { top: 10px } .chseSqMain .form451 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form451 .player.p03 { top: 24%; left: calc(37.5% - 24px) } .chseSqMain .form451 .player.p04 { top: 24%; right: calc(37.5% - 24px) } .chseSqMain .form451 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form451 .player.p06 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form451 .player.p07 { top: 48%; left: calc(30% - 8px) } .chseSqMain .form451 .player.p08 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form451 .player.p09 { top: 48%; right: calc(30% - 8px) } .chseSqMain .form451 .player.p10 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form451 .player.p11 { top: 78%; left: 50%; transform: translateX(-50%); } .ACNHeader::after { left: 170px } .ACNHeader::before { right: 112px } } @media screen and (min-width:1360px) and (max-width:1439px) { .articleChooseSquad { padding-bottom: 64%; margin-bottom: 40px } .chseSqMain { padding-bottom: 51% } .chseSqMain .logo img { margin-bottom: 10px; } .chseSqMain .logo p { font-size: 20px } .chseSqMain .col1 { width: 180px; height: calc(100% - 80px); right: 40px; top: 40px; } .chseSqMain .allForms a { height: 50px; line-height: 1.8 } .chseSqMain .allForms .share { font-size: 22px; line-height: 2 } .chseSqMain .chooseMain { width: calc(100% - 636px); top: 40px } .chseSqMain .chooseMain h1 { font-size: 36px } .chseSqMain .col3 { width: 180px; height: calc(100% - 80px); left: 40px; top: 40px; } .chseSqMain .manager { left: 30px; top: 40px } .chseSqMain .manager img { width: 340px } .chseSqMain .player { width: 60px; height: 60px } .chseSqMain .player .imgCntr { width: 60px; height: 60px } .chseSqMain .icon-add:before { font-size: 24px; line-height: 2.2 } .chseSqMain .player .imgCntr img { width: 60px } .chseSqMain .player p { position: absolute; width: 90px; left: -15px; line-height: 1.2; font-size: 13px } .playerListMenu { padding: 40px } .playerListMenu h2 { font-size: 22px } .playerListMenu .closeMenu { top: 20px; left: 40px } .playerListMenu ul li { width: calc((100% - 15px) / 6) } .playerListMenu ul li:nth-child(7n) { margin-left: 3px } .playerListMenu ul li:nth-child(6n) { margin-left: 0 } .playerListMenu ul li .imgCntr { width: 100px; height: 100px } .playerListMenu ul li .imgCntr img { width: 100px } .playerListMenu ul li .item { padding: 20px } /********** 4-4-2 **********/ /** Top **/ .chseSqMain .form442 .player.p01 { top: 10px } .chseSqMain .form442 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form442 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p06 { top: 51%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p07 { top: 51%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p08 { top: 51%; right: calc(37.5% - 20px) } .chseSqMain .form442 .player.p09 { top: 51%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p10 { top: 78%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p11 { top: 78%; right: calc(37.5% - 20px) } /********** 4-3-3 **********/ /** Top **/ .chseSqMain .form433 .player.p01 { top: 10px } .chseSqMain .form433 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form433 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form433 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form433 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form433 .player.p06 { top: 51%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p07 { top: 51%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p08 { top: 51%; right: calc(25% - 30px) } .chseSqMain .form433 .player.p09 { top: 78%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p10 { top: 78%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p11 { top: 78%; right: calc(25% - 30px) } /********** 3-5-2 **********/ /** Top **/ .chseSqMain .form352 .player.p01 { top: 10px } .chseSqMain .form352 .player.p02 { top: 24%; left: calc(25% - 30px) } .chseSqMain .form352 .player.p03 { top: 24%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p04 { top: 24%; right: calc(25% - 30px) } .chseSqMain .form352 .player.p05 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form352 .player.p06 { top: 48%; left: calc(30% - 6px) } .chseSqMain .form352 .player.p07 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p08 { top: 48%; right: calc(30% - 6px) } .chseSqMain .form352 .player.p09 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form352 .player.p10 { top: 78%; left: calc(37.5% - 20px) } .chseSqMain .form352 .player.p11 { top: 78%; right: calc(37.5% - 20px) } /********** 4-5-1 **********/ /** Top **/ .chseSqMain .form451 .player.p01 { top: 10px } .chseSqMain .form451 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form451 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form451 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form451 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form451 .player.p06 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form451 .player.p07 { top: 48%; left: calc(30% - 6px) } .chseSqMain .form451 .player.p08 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form451 .player.p09 { top: 48%; right: calc(30% - 6px) } .chseSqMain .form451 .player.p10 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form451 .player.p11 { top: 78%; left: 50%; transform: translateX(-50%); } .ACNHeader::after { left: 170px } .ACNHeader::before { right: 82px } article .totalQues { width: 500px; margin: 0 calc((100% - 500px) /2) } .quickQues, article .articlePoll { width: 700px; margin: 0 calc((100% - 700px) /2) } article .details .quickQues h2 { font-size: 16px !important } .quickQues h3.Question { font-size: 15px !important } .quickQues .answer label, article .articlePoll .allItems input[type="radio"] + label { font-size: 14px } .quickQues .answer label.wrong:before, .quickQues .answer label.correct:before { line-height: 2.6 } .QEntryPoint { width: 600px; margin: 0 calc((100% - 600px) /2); } article .totalQues .answer { height: 70px } article .totalQues .question h4.pQues { font-size: 18px } article .totalQues .answer label { font-size: 16px } article .totalQues .question h3 { font-size: 14px } article .totalQues .question img { padding: 0 } } @media screen and (min-width:1280px) and (max-width:1359px) { .articleChooseSquad { padding-bottom: 62%; margin-bottom: 40px } .chseSqMain { padding-bottom: 57% } .chseSqMain .logo img { margin-bottom: 10px; width: 130px; } .chseSqMain .logo p { font-size: 20px } .chseSqMain .col1 { width: 180px; height: calc(100% - 80px); right: 40px; top: 40px; } .chseSqMain .allForms a { height: 50px; line-height: 1.8 } .chseSqMain .allForms .share { font-size: 22px; line-height: 2 } .chseSqMain .chooseMain { width: calc(100% - 556px); top: 40px } .chseSqMain .chooseMain h1 { font-size: 36px } .chseSqMain .col3 { width: 180px; height: calc(100% - 80px); left: 40px; top: 40px; } .chseSqMain .manager { left: 40px; top: 90px } .chseSqMain .manager img { width: 300px } .chseSqMain .player { width: 60px; height: 60px } .chseSqMain .player .imgCntr { width: 60px; height: 60px } .chseSqMain .icon-add:before { font-size: 24px; line-height: 2.2 } .chseSqMain .player .imgCntr img { width: 60px } .chseSqMain .player p { position: absolute; width: 90px; left: -15px; line-height: 1.2; font-size: 13px } .playerListMenu { padding: 40px } .playerListMenu h2 { font-size: 22px } .playerListMenu .closeMenu { top: 20px; left: 40px } .playerListMenu ul li { width: calc((100% - 15px) / 6) } .playerListMenu ul li:nth-child(7n) { margin-left: 3px } .playerListMenu ul li:nth-child(6n) { margin-left: 0 } .playerListMenu ul li .imgCntr { width: 100px; height: 100px } .playerListMenu ul li .imgCntr img { width: 100px } .playerListMenu ul li .item { padding: 14px 20px } /********** 4-4-2 **********/ /** Top **/ .chseSqMain .form442 .player.p01 { top: 10px } .chseSqMain .form442 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form442 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p06 { top: 51%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p07 { top: 51%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p08 { top: 51%; right: calc(37.5% - 20px) } .chseSqMain .form442 .player.p09 { top: 51%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p10 { top: 78%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p11 { top: 78%; right: calc(37.5% - 20px) } /********** 4-3-3 **********/ /** Top **/ .chseSqMain .form433 .player.p01 { top: 10px } .chseSqMain .form433 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form433 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form433 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form433 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form433 .player.p06 { top: 51%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p07 { top: 51%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p08 { top: 51%; right: calc(25% - 30px) } .chseSqMain .form433 .player.p09 { top: 78%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p10 { top: 78%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p11 { top: 78%; right: calc(25% - 30px) } /********** 3-5-2 **********/ /** Top **/ .chseSqMain .form352 .player.p01 { top: 10px } .chseSqMain .form352 .player.p02 { top: 24%; left: calc(25% - 30px) } .chseSqMain .form352 .player.p03 { top: 24%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p04 { top: 24%; right: calc(25% - 30px) } .chseSqMain .form352 .player.p05 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form352 .player.p06 { top: 48%; left: calc(30% - 6px) } .chseSqMain .form352 .player.p07 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p08 { top: 48%; right: calc(30% - 6px) } .chseSqMain .form352 .player.p09 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form352 .player.p10 { top: 78%; left: calc(37.5% - 20px) } .chseSqMain .form352 .player.p11 { top: 78%; right: calc(37.5% - 20px) } /********** 4-5-1 **********/ /** Top **/ .chseSqMain .form451 .player.p01 { top: 10px } .chseSqMain .form451 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form451 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form451 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form451 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form451 .player.p06 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form451 .player.p07 { top: 48%; left: calc(30% - 6px) } .chseSqMain .form451 .player.p08 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form451 .player.p09 { top: 48%; right: calc(30% - 6px) } .chseSqMain .form451 .player.p10 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form451 .player.p11 { top: 78%; left: 50%; transform: translateX(-50%); } .ACNHeader::after { content: ''; background: url(../../Images/ACN/web-headerPlayers.png) no-repeat center 0; position: absolute; left: 170px; bottom: 0; width: 180px; height: 114px; background-size: 180px 114px; } .ACNHeader::before { content: ''; background: url(../../Images/ACN/web-headerLogo.png) no-repeat center; position: absolute; right: 52px; width: 336px; height: 76px; background-size: 336px 76px } article .totalQues { width: 500px; margin: 0 calc((100% - 500px) /2) } .quickQues, article .articlePoll { width: 700px; margin: 0 calc((100% - 700px) /2) } .quickQues .answer label, article .articlePoll .allItems input[type="radio"] + label { font-size: 14px } article .details .quickQues h2 { font-size: 16px !important } .quickQues h3.Question { font-size: 15px !important } .quickQues .answer label.wrong:before, .quickQues .answer label.correct:before { line-height: 2.6 } .QEntryPoint { width: 600px; margin: 0 calc((100% - 600px) /2); } .QEntryPoint .Qimg { width: 170px } .QEntryPoint .QDetails { width: calc(100% - 200px) } .QEntryPoint.NoImg .QDetails { width: 100% } article .totalQues .answer { height: 70px } article .totalQues .question h4.pQues { font-size: 18px } article .totalQues .answer label { font-size: 16px } article .totalQues .question h3 { font-size: 14px } article .totalQues .question img { padding: 0 } } @media screen and (min-width:1152px) and (max-width:1279px) { .articleChooseSquad { padding-bottom: 146%; margin-bottom: 40px } .chseSqMain { padding-bottom: 60%; background-size: 100% 100% } .chseSqMain .logo { width: 240px } .chseSqMain .logo img { margin-bottom: 10px; width: 110px; } .chseSqMain .logo p { font-size: 18px } .chseSqMain .col1 { width: 180px; height: calc(100% - 80px); right: 40px; top: 40px; } .chseSqMain .allForms a { height: 50px; line-height: 2.2; } .chseSqMain .allForms .share { font-size: 18px; line-height: 2.4 } .chseSqMain .chooseMain { width: calc(100% - 478px); top: 40px } .chseSqMain .chooseMain h1 { font-size: 30px; margin-bottom: 20px } .chseSqMain .col3 { width: 180px; height: calc(100% - 80px); left: 40px; top: 40px; } .chseSqMain .manager { left: 40px; top: 110px } .chseSqMain .manager img { width: 260px } .chseSqMain .player { width: 60px; height: 60px } .chseSqMain .player .imgCntr { width: 60px; height: 60px } .chseSqMain .icon-add:before { font-size: 24px; line-height: 2.2 } .chseSqMain .player .imgCntr img { width: 60px } .chseSqMain .player p { position: absolute; width: 90px; left: -15px; line-height: 1.2; font-size: 13px } .chseSqMain .sponsLogo img { width: 100px } .playerListMenu { padding: 40px } .playerListMenu h2 { font-size: 22px } .playerListMenu .closeMenu { top: 20px; left: 40px } .playerListMenu ul li { width: calc((100% - 15px) / 6) } .playerListMenu ul li:nth-child(7n) { margin-left: 3px } .playerListMenu ul li:nth-child(6n) { margin-left: 0 } .playerListMenu ul li .imgCntr { width: 90px; height: 90px } .playerListMenu ul li .imgCntr img { width: 90px } .playerListMenu ul li p { font-size: 14px; line-height: 1 } .playerListMenu ul li .item { padding: 16px 20px } /********** 4-4-2 **********/ /** Top **/ .chseSqMain .form442 .player.p01 { top: 10px } .chseSqMain .form442 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form442 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p06 { top: 51%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p07 { top: 51%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p08 { top: 51%; right: calc(37.5% - 20px) } .chseSqMain .form442 .player.p09 { top: 51%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p10 { top: 78%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p11 { top: 78%; right: calc(37.5% - 20px) } /********** 4-3-3 **********/ /** Top **/ .chseSqMain .form433 .player.p01 { top: 10px } .chseSqMain .form433 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form433 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form433 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form433 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form433 .player.p06 { top: 51%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p07 { top: 51%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p08 { top: 51%; right: calc(25% - 30px) } .chseSqMain .form433 .player.p09 { top: 78%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p10 { top: 78%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p11 { top: 78%; right: calc(25% - 30px) } /********** 3-5-2 **********/ /** Top **/ .chseSqMain .form352 .player.p01 { top: 10px } .chseSqMain .form352 .player.p02 { top: 24%; left: calc(25% - 30px) } .chseSqMain .form352 .player.p03 { top: 24%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p04 { top: 24%; right: calc(25% - 30px) } .chseSqMain .form352 .player.p05 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form352 .player.p06 { top: 48%; left: calc(30% - 6px) } .chseSqMain .form352 .player.p07 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p08 { top: 48%; right: calc(30% - 6px) } .chseSqMain .form352 .player.p09 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form352 .player.p10 { top: 78%; left: calc(37.5% - 20px) } .chseSqMain .form352 .player.p11 { top: 78%; right: calc(37.5% - 20px) } /********** 4-5-1 **********/ /** Top **/ .chseSqMain .form451 .player.p01 { top: 10px } .chseSqMain .form451 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form451 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form451 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form451 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form451 .player.p06 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form451 .player.p07 { top: 48%; left: calc(30% - 6px) } .chseSqMain .form451 .player.p08 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form451 .player.p09 { top: 48%; right: calc(30% - 6px) } .chseSqMain .form451 .player.p10 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form451 .player.p11 { top: 78%; left: 50%; transform: translateX(-50%); } .ACNHeader::after { content: ''; background: url(../../Images/ACN/web-headerPlayers.png) no-repeat center 0; position: absolute; left: 170px; bottom: 0; width: 180px; height: 114px; background-size: 180px 114px; } .ACNHeader::before { content: ''; background: url(../../Images/ACN/web-headerLogo.png) no-repeat center; position: absolute; right: 50px; width: 336px; height: 76px; background-size: 336px 76px } article .totalQues { width: 450px; margin: 0 calc((100% - 450px) /2) } .quickQues, article .articlePoll { width: 100%; margin: 0 } article .details .quickQues h2 { font-size: 16px !important } .quickQues h3.Question { font-size: 15px !important } .quickQues .answer label, article .articlePoll .allItems input[type="radio"] + label { font-size: 14px } .quickQues .answer label.wrong:before, .quickQues .answer label.correct:before { line-height: 2.6 } .QEntryPoint { width: 100%; margin: 0; } .QEntryPoint .Qimg { width: 170px } .QEntryPoint .QDetails { width: calc(100% - 200px) } .QEntryPoint.NoImg .QDetails { width: 100% } article .totalQues .answer { height: 70px } article .totalQues .question h4.pQues { font-size: 18px } article .totalQues .answer label { font-size: 15px } article .totalQues .question h3 { font-size: 14px } article .totalQues .question img { padding: 0 } } @media screen and (min-width:1024px) and (max-width:1151px) { .articleChooseSquad { padding-bottom: 152%; margin-bottom: 40px } .chseSqMain { padding-bottom: 65%; background-size: 100% 100% } .chseSqMain .logo { width: 240px; z-index: 3 } .chseSqMain .logo img { margin-bottom: 10px; width: 110px; } .chseSqMain .logo p { font-size: 15px } .chseSqMain .col1 { width: 130px; height: calc(100% - 40px); right: 20px; top: 20px; } .chseSqMain .allForms a { height: 44px; line-height: 2.2; border: 2px solid #fff; border-radius: 6px } .chseSqMain .allForms .share { font-size: 16px; line-height: 2.5 } .chseSqMain .chooseMain { width: calc(100% - 314px); top: 20px; } .chseSqMain .chooseMain h1 { font-size: 28px; margin-bottom: 20px } .chseSqMain .col3 { width: 130px; height: calc(100% - 40px); left: 20px; top: 20px; } .chseSqMain .manager { left: 40px; top: 110px; display: none } .chseSqMain .manager img { width: 260px } .chseSqMain .player { width: 60px; height: 60px } .chseSqMain .player .imgCntr { width: 60px; height: 60px } .chseSqMain .icon-add:before { font-size: 24px; line-height: 2.2 } .chseSqMain .player .imgCntr img { width: 60px } .chseSqMain .player p { position: absolute; width: 90px; left: -15px; line-height: 1.2; font-size: 13px } .chseSqMain .sponsLogo img { width: 100px } .ACNHeader .EntryAds img { height: 40px } .playerListMenu { padding: 20px } .playerListMenu h2 { font-size: 20px } .playerListMenu .closeMenu { top: 10px; left: 20px } .playerListMenu .icon-close:before { font-size: 26px } .playerListMenu ul li { width: calc((100% - 15px) / 6) } .playerListMenu ul li:nth-child(7n) { margin-left: 3px } .playerListMenu ul li:nth-child(6n) { margin-left: 0 } .playerListMenu ul li .imgCntr { width: 80px; height: 80px } .playerListMenu ul li .imgCntr img { width: 80px } .playerListMenu ul li p { font-size: 14px; line-height: 1 } .playerListMenu ul li .item { padding: 16px 20px } /********** 4-4-2 **********/ /** Top **/ .chseSqMain .form442 .player.p01 { top: 10px } .chseSqMain .form442 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form442 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p06 { top: 51%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p07 { top: 51%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p08 { top: 51%; right: calc(37.5% - 20px) } .chseSqMain .form442 .player.p09 { top: 51%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p10 { top: 78%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p11 { top: 78%; right: calc(37.5% - 20px) } /********** 4-3-3 **********/ /** Top **/ .chseSqMain .form433 .player.p01 { top: 10px } .chseSqMain .form433 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form433 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form433 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form433 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form433 .player.p06 { top: 51%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p07 { top: 51%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p08 { top: 51%; right: calc(25% - 30px) } .chseSqMain .form433 .player.p09 { top: 78%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p10 { top: 78%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p11 { top: 78%; right: calc(25% - 30px) } /********** 3-5-2 **********/ /** Top **/ .chseSqMain .form352 .player.p01 { top: 10px } .chseSqMain .form352 .player.p02 { top: 24%; left: calc(25% - 30px) } .chseSqMain .form352 .player.p03 { top: 24%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p04 { top: 24%; right: calc(25% - 30px) } .chseSqMain .form352 .player.p05 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form352 .player.p06 { top: 48%; left: calc(30% - 6px) } .chseSqMain .form352 .player.p07 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p08 { top: 48%; right: calc(30% - 6px) } .chseSqMain .form352 .player.p09 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form352 .player.p10 { top: 78%; left: calc(37.5% - 20px) } .chseSqMain .form352 .player.p11 { top: 78%; right: calc(37.5% - 20px) } /********** 4-5-1 **********/ /** Top **/ .chseSqMain .form451 .player.p01 { top: 10px } .chseSqMain .form451 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form451 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form451 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form451 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form451 .player.p06 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form451 .player.p07 { top: 48%; left: calc(30% - 6px) } .chseSqMain .form451 .player.p08 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form451 .player.p09 { top: 48%; right: calc(30% - 6px) } .chseSqMain .form451 .player.p10 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form451 .player.p11 { top: 78%; left: 50%; transform: translateX(-50%); } .ACNHeader::after { content: ''; background: url(../../Images/ACN/web-headerPlayers.png) no-repeat center 0; position: absolute; left: 130px; bottom: 0; width: 180px; height: 114px; background-size: 180px 114px; } .ACNHeader::before { content: ''; background: url(../../Images/ACN/web-headerLogo.png) no-repeat center; position: absolute; right: 44px; width: 300px; height: 68px; background-size: 300px 68px } .ACN19 .TourTabs li { width: 100px } .ACN19 .TourTabs li a { font-size: 13px } article .totalQues { width: calc(100% - 20px); margin: 0 10px 0 0 } article .totalQues .question h4.pQues { font-size: 16px } article .articlePoll, .quickQues { width: 100%; margin: 0 } article .details .quickQues h2 { font-size: 16px !important } .quickQues h3.Question { font-size: 15px !important } .quickQues .answer label, article .articlePoll .allItems input[type="radio"] + label { font-size: 14px } .quickQues .answer label.wrong:before, .quickQues .answer label.correct:before { line-height: 2.6 } .QEntryPoint { width: 100%; margin: 0; } .QEntryPoint .Qimg { width: 150px } .QEntryPoint .QDetails { width: calc(100% - 180px) } .QEntryPoint.NoImg .QDetails { width: 100% } .QEntryPoint h5 { font-size: 14px !important } .QEntryPoint span { font-size: 15px; line-height: 1.6 } article .articlePoll .allItems .btns .Popup { right: auto; left: -50px } article .articlePoll .allItems .btns .Popup:before { left: 80px } article .totalQues .answer { height: 70px } article .totalQues .question h4.pQues { font-size: 18px } article .totalQues .answer label { font-size: 16px } article .totalQues .question h3 { font-size: 14px } article .totalQues .question img { padding: 0 } } @media only screen and (max-width: 1023px) { .articleChooseSquad { padding-bottom: 68%; margin-bottom: 40px } .chseSqMain { padding-bottom: 74%; background-size: 100% 100% } .chseSqMain .logo { width: 240px; z-index: 3 } .chseSqMain .logo img { margin-bottom: 10px; width: 110px; } .chseSqMain .logo p { font-size: 15px } .chseSqMain .col1 { width: 130px; height: calc(100% - 40px); right: 20px; top: 20px; } .chseSqMain .allForms { bottom: 90px } .chseSqMain .allForms a { height: 44px; line-height: 2.2; border: 2px solid #fff; border-radius: 6px } .chseSqMain .allForms .share { font-size: 16px; line-height: 2.5 } .chseSqMain .chooseMain { width: calc(100% - 310px); top: 20px; } .chseSqMain .chooseMain h1 { font-size: 28px; margin-bottom: 20px } .chseSqMain .col3 { width: 130px; height: calc(100% - 40px); left: 20px; bottom: 20px; top: auto; } .chseSqMain .manager { left: 40px; top: 110px; display: none } .chseSqMain .manager img { width: 260px } .chseSqMain .player { width: 60px; height: 60px } .chseSqMain .player .imgCntr { width: 60px; height: 60px } .chseSqMain .icon-add:before { font-size: 24px; line-height: 2.2 } .chseSqMain .player .imgCntr img { width: 60px } .chseSqMain .player p { position: absolute; width: 90px; left: -15px; line-height: 1.2; font-size: 13px } .chseSqMain .sponsLogo { right: 0; left: auto } .chseSqMain .sponsLogo img { width: 100px } .playerListMenu { padding: 20px } .playerListMenu h2 { font-size: 20px } .playerListMenu .closeMenu { top: 10px; left: 20px } .playerListMenu .icon-close:before { font-size: 26px } .playerListMenu ul li { width: calc((100% - 12px) / 5) } .playerListMenu ul li:nth-child(7n) { margin-left: 3px } .playerListMenu ul li:nth-child(5n) { margin-left: 0 } .playerListMenu ul li .imgCntr { width: 80px; height: 80px } .playerListMenu ul li .imgCntr img { width: 80px } .playerListMenu ul li p { font-size: 14px; line-height: 1 } .playerListMenu ul li .item { padding: 16px 20px } /********** 4-4-2 **********/ /** Top **/ .chseSqMain .form442 .player.p01 { top: 10px } .chseSqMain .form442 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form442 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p06 { top: 51%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p07 { top: 51%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p08 { top: 51%; right: calc(37.5% - 20px) } .chseSqMain .form442 .player.p09 { top: 51%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p10 { top: 78%; left: calc(37.5% - 20px) } .chseSqMain .form442 .player.p11 { top: 78%; right: calc(37.5% - 20px) } /********** 4-3-3 **********/ /** Top **/ .chseSqMain .form433 .player.p01 { top: 10px } .chseSqMain .form433 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form433 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form433 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form433 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form433 .player.p06 { top: 51%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p07 { top: 51%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p08 { top: 51%; right: calc(25% - 30px) } .chseSqMain .form433 .player.p09 { top: 78%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p10 { top: 78%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p11 { top: 78%; right: calc(25% - 30px) } /********** 3-5-2 **********/ /** Top **/ .chseSqMain .form352 .player.p01 { top: 10px } .chseSqMain .form352 .player.p02 { top: 24%; left: calc(25% - 30px) } .chseSqMain .form352 .player.p03 { top: 24%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p04 { top: 24%; right: calc(25% - 30px) } .chseSqMain .form352 .player.p05 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form352 .player.p06 { top: 48%; left: calc(30% - 6px) } .chseSqMain .form352 .player.p07 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p08 { top: 48%; right: calc(30% - 6px) } .chseSqMain .form352 .player.p09 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form352 .player.p10 { top: 78%; left: calc(37.5% - 20px) } .chseSqMain .form352 .player.p11 { top: 78%; right: calc(37.5% - 20px) } /********** 4-5-1 **********/ /** Top **/ .chseSqMain .form451 .player.p01 { top: 10px } .chseSqMain .form451 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form451 .player.p03 { top: 24%; left: calc(37.5% - 20px) } .chseSqMain .form451 .player.p04 { top: 24%; right: calc(37.5% - 20px) } .chseSqMain .form451 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form451 .player.p06 { top: 54%; left: calc(10% + 18px) } .chseSqMain .form451 .player.p07 { top: 48%; left: calc(30% - 6px) } .chseSqMain .form451 .player.p08 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form451 .player.p09 { top: 48%; right: calc(30% - 6px) } .chseSqMain .form451 .player.p10 { top: 54%; right: calc(10% + 18px) } .chseSqMain .form451 .player.p11 { top: 78%; left: 50%; transform: translateX(-50%); } .ACNHeader::after { display: none } .ACNHeader::before { content: ''; background: url(../../Images/ACN/web-headerLogo.png) no-repeat center; position: absolute; right: auto; width: 300px; height: 68px; background-size: 300px 68px; left: 50%; transform: translate(-50%, -50%); } .chooseSquadDiv .stepOne .Warning { position: absolute; z-index: 999; left: 0; top: 50%; width: 100%; margin: 0 auto; font-size: 14px; } .bigLike { width: 150px; height: 158px; } .bigLike img { width: 150px; } .topRead { width: 100% } .leftColum { width: 100% } } @media screen and (max-width:767px) and (orientation:landscape) { .articleChooseSquad { padding-bottom: 150%; margin-bottom: 40px } .chseSqMain { padding-bottom: 74%; background-size: 100% 100% } .chseSqMain .logo { width: 240px; z-index: 3 } .chseSqMain .logo img { margin-bottom: 10px; width: 80px; } .chseSqMain .logo p { font-size: 15px } .chseSqMain .col1 { width: 130px; height: calc(100% - 40px); right: 20px; top: 20px; } .chseSqMain .allForms { bottom: 90px } .chseSqMain .allForms a { height: 44px; line-height: 2.2; font-size: 18px; border: 2px solid #fff; border-radius: 6px } .chseSqMain .allForms .share { font-size: 16px; line-height: 2.5 } .chseSqMain .chooseMain { width: calc(100% - 210px); top: 20px; transform: none; left: 20px; } .chseSqMain .chooseMain h1 { font-size: 28px; margin-bottom: 20px } .chseSqMain .col3 { width: 100px; height: 66px; left: auto; right: 20px; bottom: 20px; top: auto } .chseSqMain .manager { left: 40px; top: 110px; display: none } .chseSqMain .manager img { width: 260px } .chseSqMain .allForms .share { margin-top: 20px; } .chseSqMain .player { width: 60px; height: 60px } .chseSqMain .player .imgCntr { width: 60px; height: 60px } .chseSqMain .icon-add:before { font-size: 24px; line-height: 2.2 } .chseSqMain .player .imgCntr img { width: 60px } .chseSqMain .player p { position: absolute; width: 90px; left: -15px; line-height: 1.2; font-size: 13px } .chseSqMain .sponsLogo { right: 0; left: auto } .chseSqMain .sponsLogo img { width: 100px } .playerListMenu { padding: 20px } .playerListMenu h2 { font-size: 20px } .playerListMenu .closeMenu { top: 10px; left: 20px } .playerListMenu .icon-close:before { font-size: 26px } .playerListMenu ul li { width: calc((100% - 9px) / 4) } .playerListMenu ul li:nth-child(7n) { margin-left: 3px } .playerListMenu ul li:nth-child(5n) { margin-left: 3px } .playerListMenu ul li:nth-child(4n) { margin-left: 0 } .playerListMenu ul li .imgCntr { width: 80px; height: 80px } .playerListMenu ul li .imgCntr img { width: 80px } .playerListMenu ul li p { font-size: 14px; line-height: 1 } .playerListMenu ul li .item { padding: 16px 20px } .ACN19 .TourTabs li { margin-left: 44px !important } article .articlePoll .allItems .btns .Popup { right: -155px; padding: 5px } article .articlePoll .allItems .btns .Popup:before { left: 65px } article .articlePoll .allItems .btns .Popup h6 { font-size: 13px } } /** Mobile - Portrait**/ @media screen and (max-width:767px) and (orientation:portrait) { .articleChooseSquad { padding-bottom: 200%; margin-bottom: 40px } .chseSqMain { padding-bottom: 180%; background-size: 100% 100%; background: url(../../Images/ACN/ChooseSquad2019/chooseSquadACN2019Mob.jpg) no-repeat left top; } .chseSqMain .logo { width: 100%; z-index: 3 } .chseSqMain .logo img { margin-bottom: 0; width: 80px; } .acn .sponsorDuplicate { display: none } .chseSqMain .logo p { font-size: 13px; position: absolute; left: auto; transform: none; width: 160px; right: 0; text-align: center; top: 38px; margin: 0 calc((100% - 160px) / 2); } .chseSqMain .col1 { width: calc(100% - 40px); height: calc(100% - 40px); right: 20px; top: 20px; } .chseSqMain .allForms { bottom: auto; top: 84px } .chseSqMain .allForms a { height: 30px; line-height: 1.8 !important; font-size: 16px; border: 1px solid #fff; border-radius: 5px; width: calc((100% - 10px) / 2); margin-left: 10px; } .chseSqMain .allForms a:nth-child(2n) { margin-left: 0 } .chseSqMain .chooseMain { width: calc(100% - 40px); top: 240px; transform: none; left: 20px; } .chseSqMain .chooseMain h1 { font-size: 18px; margin-bottom: 10px } .chseSqMain .col3 { width: calc(100% - 40px); height: 40px; left: 20px; right: auto; bottom: auto; top: 20px; } .chseSqMain .col3 .allForms { top: 170px; } .chseSqMain .manager { left: 40px; top: 110px; display: none } .chseSqMain .manager img { width: 260px } .chseSqMain .allForms .share { margin-top: 0px; width: calc((100% - 8px) / 3); margin-left: 4px; font-size: 12px; line-height: 2.4; font-family: droidLight, arial } .chseSqMain .allForms .share:nth-child(2n) { margin-left: 4px } .chseSqMain .allForms .share:last-child { margin-left: 0 } .chseSqMain .player { width: 40px; height: 40px } .chseSqMain .player .imgCntr { width: 40px; height: 40px; border: 2px solid #fff; } .chseSqMain .icon-add:before { font-size: 16px; line-height: 2.3 } .chseSqMain .player .imgCntr img { width: 40px } .chseSqMain .player p { position: absolute; width: 80px; left: -20px; line-height: 1.2; font-size: 10px; margin-top: 2px; } .chseSqMain .sponsLogo { right: auto; left: 0 } .chseSqMain .sponsLogo img { width: 60px } .playerListMenu { padding: 20px } .playerListMenu h2 { font-size: 18px } .playerListMenu .closeMenu { top: 10px; left: 20px } .playerListMenu .icon-close:before { font-size: 26px } .playerListMenu ul { height: 500px; position: relative; display: inline-block; width: 100%; overflow-y: scroll; } .playerListMenu ul li { width: calc((100% - 6px) / 3) } .playerListMenu ul li:nth-child(7n) { margin-left: 3px } .playerListMenu ul li:nth-child(5n) { margin-left: 3px } .playerListMenu ul li:nth-child(3n) { margin-left: 0 } .playerListMenu ul li .imgCntr { width: 60px; height: 60px; border: 2px solid #fff; } .playerListMenu ul li .imgCntr img { width: 60px } .playerListMenu ul li p { font-size: 12px; line-height: 1 } .playerListMenu ul li .item { padding: 12px 10px } /********** 4-4-2 **********/ /** Top **/ .chseSqMain .form442 .player.p01 { top: 5px } .chseSqMain .form442 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p03 { top: 24%; left: calc(37.5% - 12px) } .chseSqMain .form442 .player.p04 { top: 24%; right: calc(37.5% - 12px) } .chseSqMain .form442 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p06 { top: 51%; left: calc(12.5% - 0px) } .chseSqMain .form442 .player.p07 { top: 51%; left: calc(37.5% - 12px) } .chseSqMain .form442 .player.p08 { top: 51%; right: calc(37.5% - 12px) } .chseSqMain .form442 .player.p09 { top: 51%; right: calc(12.5% - 0px) } .chseSqMain .form442 .player.p10 { top: 78%; left: calc(37.5% - 12px) } .chseSqMain .form442 .player.p11 { top: 78%; right: calc(37.5% - 12px) } /********** 4-3-3 **********/ /** Top **/ .chseSqMain .form433 .player.p01 { top: 5px } .chseSqMain .form433 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form433 .player.p03 { top: 24%; left: calc(37.5% - 12px) } .chseSqMain .form433 .player.p04 { top: 24%; right: calc(37.5% - 12px) } .chseSqMain .form433 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form433 .player.p06 { top: 51%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p07 { top: 51%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p08 { top: 51%; right: calc(25% - 30px) } .chseSqMain .form433 .player.p09 { top: 78%; left: calc(25% - 30px) } .chseSqMain .form433 .player.p10 { top: 78%; left: 50%; transform: translateX(-50%); } .chseSqMain .form433 .player.p11 { top: 78%; right: calc(25% - 30px) } /********** 3-5-2 **********/ /** Top **/ .chseSqMain .form352 .player.p01 { top: 5px } .chseSqMain .form352 .player.p02 { top: 24%; left: calc(25% - 30px) } .chseSqMain .form352 .player.p03 { top: 24%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p04 { top: 24%; right: calc(25% - 30px) } .chseSqMain .form352 .player.p05 { top: 54%; left: calc(3% + 18px) } .chseSqMain .form352 .player.p06 { top: 48%; left: calc(30% - 12px) } .chseSqMain .form352 .player.p07 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form352 .player.p08 { top: 48%; right: calc(30% - 12px) } .chseSqMain .form352 .player.p09 { top: 54%; right: calc(3% + 18px) } .chseSqMain .form352 .player.p10 { top: 78%; left: calc(37.5% - 12px) } .chseSqMain .form352 .player.p11 { top: 78%; right: calc(37.5% - 12px) } /********** 4-5-1 **********/ /** Top **/ .chseSqMain .form451 .player.p01 { top: 5px } .chseSqMain .form451 .player.p02 { top: 24%; left: calc(12.5% - 0px) } .chseSqMain .form451 .player.p03 { top: 24%; left: calc(37.5% - 12px) } .chseSqMain .form451 .player.p04 { top: 24%; right: calc(37.5% - 12px) } .chseSqMain .form451 .player.p05 { top: 24%; right: calc(12.5% - 0px) } .chseSqMain .form451 .player.p06 { top: 54%; left: calc(3% + 18px) } .chseSqMain .form451 .player.p07 { top: 48%; left: calc(30% - 12px) } .chseSqMain .form451 .player.p08 { top: 54%; left: 50%; transform: translateX(-50%); } .chseSqMain .form451 .player.p09 { top: 48%; right: calc(30% - 12px) } .chseSqMain .form451 .player.p10 { top: 54%; right: calc(3% + 18px) } .chseSqMain .form451 .player.p11 { top: 78%; left: 50%; transform: translateX(-50%); } .ACNHeader::before { content: ''; background: url(../../Images/ACN/web-headerLogo.png) no-repeat center; position: absolute; right: auto; width: 176px; height: 40px; background-size: 176px 40px; left: 50%; transform: translate(-50%, -50%); } .ACNHeader .EntryAds { top: auto; bottom: 10px; transform: none } .ACNHeader .EntryAds a { margin-left: 10px } .ACNHeader .EntryAds img { height: 26px; } article .totalQues { width: 100%; margin: 0 } .cafLgFinal article .totalQues { width: 100%; margin: 0 } article .totalQues .answer label { font-size: 15px; line-height: 1.6; } article .totalQues .answer.multi.correct:before, article .totalQues .answer.imgAns.correct:before, article .totalQues .answer.multi.wrong:before, article .totalQues .answer.imgAns.wrong:before { top: 0; right: 5px; font-size: 10px } article .totalQues .question img { padding: 0 } article .totalQues h6 { font-size: 18px } article .totalQues .quesDiv { width: 100%; padding: 25px 10px } article .totalQues .question h3 { font-size: 13px; line-height: 3 } article .totalQues .answer { width: calc((100% - 10px) /2); margin-left: 10px; height: 70px } article .totalQues .question h4.pQues { font-size: 16px } article .result { padding: 0 } article .result .resContainer { width: 100%; margin: 0; padding: 15px 15px 10px 15px; } article .result .resContainer h5 { font-size: 16px !important; margin-bottom: 10px } article .result .resContainer h5 span { font-size: 16px !important } article .result .resContainer span.share { font-size: 15px } article .result .resContainer .shareRes { width: 100%; margin: 0 } article .result .resContainer .shareRes a { width: calc((100% - 20px) /2); height: 35px; line-height: 2.2; font-size: 15px !important } article .articlePoll .allItems .btns .Popup { right: -80%; width: 280px; padding: 5px; top: -50px } article .articlePoll .allItems .btns .Popup:before { left: 50%; transform: translateX(-50%) } article .articlePoll .allItems .btns .Popup h6 { font-size: 13px } } .downloadApp { display: none } /******************** Media ********************/ @media screen and (min-width:1680px) and (max-width:1920px) { .wcOverlay .cntnr { top: 110px } .IconArrow span { left: 34%; } .EntryIconArrow { right: 11%; } .LiveStreem .desc span { top: 20%; } } @media screen and (min-width:1680px) and (max-width:1919px) { .acn_Cup .acnToCup .stepOne { bottom: 60px } .acnToCup .fblogin input { height: 30px !important } .acn_Cup .acnToCup #PersonalData { top: 60px } .acn_Cup .acnToCup .containermain .sponsor-logo span { margin: 10px 0 } } @media screen and (min-width:1024px) and (max-width:1600px) { .gutter.right { right: 0; } .gutter.left { left: 0; } } @media screen and (min-width:1600px) and (max-width:1679px) { /*.acn_Cup .acnToCup .containermain .sponsor-logo{right:185px!important}*/ .acn_Cup .acnToCup .stepOne { bottom: 35px } .acnToCup .fblogin input { height: 30px !important } .acn_Cup .acnToCup #PersonalData { top: 30px } .acn_Cup .acnToCup .containermain .sponsor-logo span { margin: 10px 0 } .acn_Cup .acnToCup .containermain .sponsor-logo { top: 15px } } @media screen and (min-width:1536px) and (max-width:1679px) { .matchesCenter.fixtures .fTab { padding: 0 145px 0 145px } .matchesCenter.fixtures .bx-wrapper .bx-prev { right: -145px; } .matchesCenter.fixtures .bx-wrapper .bx-next { left: -145px; } .wcOverlay .cntnr { top: 50px; width: 600px } .wcOverlay .ykLogo { margin-bottom: 30px } .wcOverlay .goToBtns { width: 434px; height: 52px; margin: 0 calc((100% - 434px) / 2) 30px; } .wcOverlay .goToBtns a { width: 200px; font-size: 18px; } .wcOverlay .mainSponsor p { margin-bottom: 20px } .wcOverlay .mainSponsor .sponsorLogo { width: 120px } .ESFeaturedArea ul li:first-child { height: 590px; } /*.acn_Cup .acnToCup .containermain .sponsor-logo{right:170px}*/ .acn_Cup .acnToCup .stepOne { bottom: 35px } .acnToCup .fblogin input { height: 30px !important } .acn_Cup .acnToCup #PersonalData { top: 30px } .acn_Cup .acnToCup .containermain .sponsor-logo span { margin: 10px 0 } .acn_Cup .acnToCup .containermain .sponsor-logo { top: 15px } .acnToCup .fblogin a.regBtn { height: 30px; line-height: 2; width: 110px; margin: 5px calc((100% - 110px) / 2) !important; } } @media screen and (min-width:1440px) and (max-width:1535px) { .matchesCenter.fixtures .fTab { padding: 0 144px 0 140px } .matchesCenter.fixtures .bx-wrapper .bx-prev { right: -144px; } .matchesCenter.fixtures .bx-wrapper .bx-next { left: -140px; } .wcOverlay .cntnr { top: 50px; width: 600px } .wcOverlay .ykLogo { margin-bottom: 30px } .wcOverlay .goToBtns { width: 434px; height: 52px; margin: 0 calc((100% - 434px) / 2) 30px; } .wcOverlay .goToBtns a { width: 200px; font-size: 18px; } .wcOverlay .mainSponsor p { margin-bottom: 20px } .wcOverlay .mainSponsor .sponsorLogo { width: 120px } .ESbtn a { top: 90px; } .ESFeaturedArea ul li:first-child { height: 508px; } .LiveStreem ul li:first-child .desc p { font-size: 1.3em; } .LiveStreem .desc span { font-size: .8em; } .ACNStanding .groups .table { height: 275px; } .ACNStanding .groups .table:after { bottom: 25px; height: 25px } /*.acn_Cup .acnToCup .containermain .sponsor-logo{right:185px}*/ .acn_Cup .acnToCup .containermain .sponsor-logo p { font-size: 24px } .acn_Cup .acnToCup .containermain .sponsor-logo p.winPlayStation { font-size: 34px } .acn_Cup .acnToCup .containermain .sponsor-logo span { margin: 10px 0 } .acn_Cup .acnToCup .stepOne { bottom: 25px } .acnToCup .fblogin input { height: 30px !important } .acn_Cup .acnToCup #PersonalData { top: 30px } .acn_Cup .acnToCup .containermain .sponsor-logo { top: 15px } .acnToCup .fblogin a.regBtn { height: 30px; line-height: 2; width: 110px; margin: 5px calc((100% - 110px) / 2) !important; } article .totalQues { width: 500px; margin: 40px calc((100% - 500px) /2) 0; } article .totalQues .answer.multi label { font-size: 16px } } @media screen and (min-width:1360px) and (max-width:1439px) { .ykMedia .pattern1 ul li { width: calc((100% - 40.1px) / 3); } .ykMedia .pattern1 ul li:nth-child(4n) { margin-left: 20px; } .ykMedia .pattern1 ul li:nth-child(3n) { margin-left: 0 } .chooseSquadDiv .stepThree .top-content .team-image { width: 122px; height: 196px } .wcOverlay .cntnr { top: 50px; width: 600px } .wcOverlay .ykLogo { margin-bottom: 30px } .wcOverlay .goToBtns { width: 434px; height: 52px; margin: 0 calc((100% - 434px) / 2) 30px; } .wcOverlay .goToBtns a { width: 200px; font-size: 18px; } .wcOverlay .mainSponsor p { margin-bottom: 20px } .wcOverlay .mainSponsor .sponsorLogo { width: 120px } .wcOverlay .allSponsors { height: 180px } .wcOverlay .allSponsors .second { top: 70px; width: 574px } .wcOverlay .allSponsors .second a { margin-left: 30px } .wcOverlay .allSponsors .second a img { width: 80%; height: auto } .wcOverlay .allSponsors .third { top: 140px; width: 1136px } .wcOverlay .allSponsors .third a { margin-left: 0 } .wcOverlay .allSponsors .third a img { width: 60%; height: auto } /*.quizGame{height:550px;} .quizGame .cnts{width:calc(100% - 550px)} .quizGame .whoPlayer{right:80px;width: 150px;} .quizGame .tigerLogo{width:80px;height:80px} .quizGame .qgSocialMedia{right: 290px;}*/ .wcHeader .wcNav { width: 886px; } .wcHeader .wcNav a { width: 80px; font-size: 14px; line-height: 2.8 } .ACNHeader .wcNav { width: 90% } .ACNHeader .wcNav a { font-size: 12px; line-height: 3.2 } .LandingPage.ahpy .landingTeam { width: 350px; margin-top: 10px; } .LandingPage.ahpy .landingTeam img { width: 175px } .LandingPage.ahpy .teamsName p { font-size: 56px; line-height: 1.2; } .chooseSquadDiv .csBackground.squadAhpy { background-position: center 0 } .ESbtn a { top: 80px; } .ESFeaturedArea ul li:first-child { height: 420px; } .ESFeaturedArea ul li:first-child .desc p { top: 8%; } .ESFeaturedArea ul li:first-child .desc span { bottom: 0%; } .ESNews ul li { width: calc((100% - 40.1px) / 3); } .ESNews ul li:nth-child(4n) { margin-left: 20px; } .ESNews ul li:nth-child(3n) { margin-left: 0 } .ACNStanding .groups .table { height: 275px; } .ACNStanding .groups .table:after { bottom: 25px; height: 25px } /*.acn_Cup .acnToCup .containermain .sponsor-logo{right:168px;top:25px}*/ .acn_Cup .acnToCup .containermain .sponsor-logo p { font-size: 24px } .acn_Cup .acnToCup .containermain .sponsor-logo p.winPlayStation { font-size: 32px } .acn_Cup .acnToCup .containermain .sponsor-logo span { margin: 10px 0 } .acn_Cup .acnToCup .stepOne { bottom: 25px } .acnToCup .fblogin input { height: 30px !important } .acn_Cup .acnToCup #PersonalData { top: 15px } .acn_Cup .acnToCup .containermain .sponsor-logo { top: 15px } .acnToCup .fblogin a.regBtn { height: 30px; line-height: 2; width: 110px; margin: 5px calc((100% - 110px) / 2) !important; } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 60px } article .imgDiv { width: 100% } } @media screen and (min-width:1281px) and (max-width:1366px) { .ESbtn a { top: 75px; } .acn .acnCompCont { padding-top: 0; width: 900px; margin: 0 calc((100% - 900px) / 2) 30px; } .acn .acnCompCont .containermain { padding: 40px; height: 458px } .acnCompCont .headerPES { margin-bottom: 20px } .acnCompCont .headerPES h1 { font-size: 28px } .acnCompCont .maintitle { font-size: 16px } .acnCompCont .maintitle span:first-child { font-size: 26px } .acnCompCont .sponsoredBy { margin: 20px calc((100% - 250px) / 2); width: 250px } .acnCompCont .sponsoredBy img.yk { height: 26px; margin-top: 14px } .acnCompCont .sponsoredBy img.ul { height: 54px } .acnCompCont .fblogin h2 { font-size: 14px } .acnCompCont .questionDiv p { font-size: 20px } .acnCompCont .questionDiv li { padding: 4px 18px } .acnCompCont .questionDiv ul { margin: 0 auto 50px } .acnCompCont .questionDiv .err { margin: 20px 0 } .acnCompCont .result { font-size: 20px } .acnCompCont .result span { font-size: 26px } .ACNStanding .groups .table { height: 275px; margin-bottom: 30px; } .ACNStanding .groups .table:after { bottom: 25px; height: 25px } } @media screen and (min-width:1360px) and (max-width:1365px) { /*.acn_Cup .acnToCup .containermain .sponsor-logo{right:185px!important;top:40px!important}*/ .acn_Cup .acnToCup .stepOne { bottom: 25px } .acnToCup .fblogin input { height: 30px !important } .acn_Cup .acnToCup #PersonalData { top: 15px } .acn_Cup .acnToCup .containermain .sponsor-logo { top: 15px } .acnToCup .fblogin a.regBtn { height: 30px; line-height: 2; width: 110px; margin: 5px calc((100% - 110px) / 2) !important; } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 60px } } @media screen and (min-width:767px) and (max-width:1280px) { /* .Team_Page .list .Team1 ul li{width: calc((100% - 32px) / 2);} .Team_Page .list .Team1 ul li:nth-child(3n){margin-left:16px} .Team_Page .list .Team1 ul li:nth-child(2n){margin-left:0;}*/ .PalyerStats.tourStats.stats .item { width: calc((100% - 32px) / 2); } .PalyerStats.tourStats.stats .item:nth-child(3n+1) { margin-left: 16px } .PalyerStats.tourStats.stats .item:nth-child(2n+1) { margin-left: 0; } .ESbtn a { top: 70px; } .ESFeaturedArea ul li:first-child { height: 370px; } .ESFeaturedArea ul li:first-child .desc p { top: 8%; } .ESFeaturedArea ul li:first-child .desc span { bottom: 0%; } .LiveStreem ul li:first-child .desc p { font-size: 1.3em; } .LiveStreem .desc span { font-size: .8em; } .transfersPage .standing .table .wRow .item img { display: none } } @media screen and (min-width:1280px) and (max-width:1359px) { header .headerNav .rightMenu a { font-size: 14px; line-height: 3.8; } article .imgDiv { width: 100% } .matchDetailsTabs .matchDetailsTtl { width: calc(100% - 50px); margin: 0 calc((100% - (calc(100% - 50px))) / 2); } .matchDetailsTabs .timeline { width: calc(100% - 50px); margin: 10px calc((100% - (calc(100% - 50px))) / 2) 0; } article .connect .leftt p { font-size: 12px; } .articleHeader .articleInfo { height: 86px; } .articleHeader .articleInfo .articleAuthor { width: 100%; } .articleHeader .articleInfo .articleAuthor:after { display: none } /* .matchesCenter .toursDropdown {width:130px} .matchesCenter .matchesNow{width:120px}*/ .cd-gallery li .teamA { padding-left: 20px } .cd-gallery li .teamB { padding-right: 20px } .cd-gallery li .matchScorer .goal .player { font-size: 12px; line-height: 2 } .matchesCenter.fixtures .fTab { padding: 0 117px 0 113px } .matchesCenter.fixtures .bx-wrapper .bx-controls-direction a { width: 110px; height: 70px } .matchesCenter.fixtures .bx-wrapper .bx-prev { right: -117px; } .matchesCenter.fixtures .bx-wrapper .bx-next { left: -113px; } .standing .table .ttlRow .itemTtl { width: 45px; } .standing .table .ttlRow .itemTtl:last-child { width: 90px } .standing .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 450px); } .standing .table .wRow .item { width: 45px; font-size: 16px } .standing .table .wRow .item:last-child { width: 90px } .standing .table .wRow .item:nth-child(2) { width: calc(100% - 450px); } .standing .table .ttlRow .itemTtl { font-size: 12px; line-height: 2.2 } .standing .table .wRow .item:last-child img { height: 30px } .standing .table .wRow .item p { font-size: 13px } .statsStand .table .ttlRow .itemTtl:last-child { width: 120px; } .statsStand .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 220px); } .statsStand .table .wRow .item:last-child { width: 120px; } .statsStand .table .wRow .item:nth-child(2) { width: calc(100% - 220px); } .ykMedia .pattern1 ul li { width: calc((100% - 40.1px) / 3); } .ykMedia .pattern1 ul li:nth-child(4n) { margin-left: 20px; } .ykMedia .pattern1 ul li:nth-child(3n) { margin-left: 0 } .euroInner .ykMedia .pattern1 ul li:nth-child(4n), .euroInner .ykMedia .pattern1 ul li:nth-child(3n) { margin-left: 20px; } .euroInner .ykMedia .pattern1 ul li { width: calc((100% - 20.1px) / 2); } .euroInner .ykMedia .pattern1 ul li:nth-child(2n) { margin-left: 0 } .wcHeader .wcNav { width: 886px; left: 25px; transform: none } .wcHeader .wcNav a { width: 80px; font-size: 14px; line-height: 2.8 } .ACNHeader .wcNav { width: 90% } .ACNHeader .wcNav a { font-size: 12px; line-height: 3.2 } .wcStanding .groups .table:after { bottom: -28px; height: 28px } .ACNStanding .groups .table:after { bottom: 28px; height: 28px } .chooseSquadDiv .csBackground .choose-team { padding: 0 30px; bottom: 25px } .chooseSquadDiv .stepThree .top-content .team-image { width: 112px; height: 180px } .wcOverlay .cntnr { top: 50px; width: 600px } .wcOverlay .ykLogo { margin-bottom: 30px } .wcOverlay .goToBtns { width: 434px; height: 52px; margin: 0 calc((100% - 434px) / 2) 30px; } .wcOverlay .goToBtns a { width: 200px; font-size: 18px; } .wcOverlay .mainSponsor p { margin-bottom: 20px } .wcOverlay .mainSponsor .sponsorLogo { width: 120px } .wcOverlay .allSponsors { height: 180px } .wcOverlay .allSponsors .second { top: 70px; width: 574px } .wcOverlay .allSponsors .second a { margin-left: 30px } .wcOverlay .allSponsors .second a img { width: 80%; height: auto } .wcOverlay .allSponsors .third { top: 140px; width: 1136px } .wcOverlay .allSponsors .third a { margin-left: 0 } .wcOverlay .allSponsors .third a img { width: 60%; height: auto } /* article .details img{margin:0 calc((100% - 700px) / 2);width: 700px} */ article .details p iframe, article .details div iframe { margin: 0; height: 525px; width: 100% } article .details p iframe#frmPAVast, article .details div iframe#frmPAVast { margin: 0; width: unset; height: unset } article .details .dugout-video { margin: 0; width: 100% } iframe#pa_googleAdManager { width: 0 !important; height: 0 !important; } .Team_View .Team-Bk { height: 180px } .Team_View .teamCntnr { width: 120px; margin: 20px; } .Team_View .dtls { width: calc(100% - 180px); } /*.quizGame{height:550px;background: url(../../Images/QuizGame/quizGameBg.png) no-repeat right -50px top #053878;} .quizGame .cnts{width:calc(100% - 510px)} .quizGame .whoPlayer{right:80px;width: 150px;} .quizGame .tigerLogo{width:80px;height:80px} .quizGame .qgSocialMedia{right: 260px;}*/ .LandingPage.ahpy .landingTeam { width: 300px; margin-top: 30px; } .LandingPage.ahpy .landingTeam img { width: 150px } .LandingPage.ahpy .teamsName p { font-size: 42px; line-height: 1.2; } .acn .acnCompCont { padding-top: 0; width: 900px; margin: 0 calc((100% - 900px) / 2) 30px; } .acn .acnCompCont .containermain { padding: 40px; height: 458px } .acnCompCont .headerPES { margin-bottom: 20px } .acnCompCont .headerPES h1 { font-size: 28px } .acnCompCont .maintitle { font-size: 16px } .acnCompCont .maintitle span:first-child { font-size: 26px } .acnCompCont .sponsoredBy { margin: 20px calc((100% - 250px) / 2); width: 250px } .acnCompCont .sponsoredBy img.yk { height: 26px; margin-top: 14px } .acnCompCont .sponsoredBy img.ul { height: 54px } .acnCompCont .fblogin h2 { font-size: 14px } .acnCompCont .questionDiv p { font-size: 20px } .acnCompCont .questionDiv li { padding: 4px 18px } .acnCompCont .questionDiv ul { margin: 0 auto 50px } .acnCompCont .questionDiv .err { margin: 20px 0 } .acnCompCont .result { font-size: 20px } .acnCompCont .result span { font-size: 26px } .acnCompCont .tshirt { right: 60px } .acnCompCont .tshirt img { width: 200px; height: auto } .ACNStanding .groups .table { height: 275px; margin-bottom: 30px; } .ACNStanding .groups .table:after { bottom: 25px; height: 25px } /*.acn_Cup .acnToCup .containermain .sponsor-logo{right:168px;top:25px}*/ .acn_Cup .acnToCup .containermain .sponsor-logo p { font-size: 22px } .acn_Cup .acnToCup .containermain .sponsor-logo p.winPlayStation { font-size: 32px } .acn_Cup .acnToCup .containermain .sponsor-logo span { margin: 5px 0 } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 75px; height: auto } .acn_Cup .acnToCup .stepOne { bottom: 25px } .acnToCup .fblogin input { height: 30px !important } .acn_Cup .acnToCup #PersonalData { top: 20px } .acn_Cup .acnToCup .containermain .sponsor-logo { top: 15px } .acnToCup .fblogin a.regBtn { height: 30px; line-height: 2; width: 110px; margin: 5px calc((100% - 110px) / 2) !important; } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 60px } .transfersPage .standing .table .ttlRow .itemTtl.var, .transfersPage .standing .table .wRow .item.var { width: calc((100% - 360px) / 3); } .transfersPage .standing .table .wRow .item.arrowImg, .transfersPage .standing .table .ttlRow .itemTtl.arrowImg { width: 120px } .transfersPage .standing .table .wRow .item.var.fromTeam img, .transfersPage .standing .table .wRow .item.toTeam img, .transfersPage .standing .table .wRow .item.arrowImg img { display: inline-block } .groupTabs .table .ttlRow .itemTtl { width: 45px; } .groupTabs .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 415px); } .groupTabs .table .wRow .item { width: 45px; font-size: 16px } .groupTabs .table .wRow .item:nth-child(2) { width: calc(100% - 415px); } .groupTabs .table .ttlRow .itemTtl { font-size: 12px; line-height: 2.2 } .groupTabs .table .wRow .item p { font-size: 13px } } @media screen and (min-width:1152px) and (max-width:1279px) { header .headerNav .rightMenu a { font-size: 13px; line-height: 4; padding: 0 8px; } header .headerNav .leftMenu a { width: 36px; font-size: 20px; line-height: 2.8 } .featuredArea ul li:first-child { width: 100%; margin-left: 0 } .featuredArea ul li { width: 100%; margin-left: 0; background: #fff; margin-bottom: 10px } .featuredArea ul li .secName { right: 160px; top: 10px; background: none; color: #0277bd; padding: 0 } .featuredArea ul li:first-child .secName { right: 0; top: 0; background: rgba(0,0,0,0.7); color: #fff; padding: 2px 10px; } .featuredArea ul li.video:first-child .secName, .featuredArea ul li.album:first-child .secName, .featuredArea ul li.infograph:first-child .secName, .featuredArea ul li.sed:first-child .secName { padding: 0 0 0 10px } .featuredArea ul li a .imageCntnr { width: 150px; padding-bottom: calc((150px * 67)/ 100); float: right; } .featuredArea ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 67%; float: right; margin-left: 0 } .featuredArea .desc { float: right; position: relative; width: calc(100% - 150px); height: auto; display: inline-block; background: #fff; padding: 10px; margin-top: 30px } .featuredArea .desc p { color: #000; position: relative; padding: 0 } .featuredArea ul li:first-child .desc { float: right; position: absolute; width: 100%; height: 70%; display: inline-block; padding: 0; margin-top: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0); } .featuredArea ul li:first-child .desc p { color: #fff; position: absolute; padding: 10px } .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5), .featuredArea ul li:last-child { margin-bottom: 10px } .ESFeaturedArea ul li:first-child { width: 100%; height: 570px; } .ESFeaturedArea ul li { width: 100%; } .entryPointSlider { width: 300px; } .entrypoints { display: inline-block; height: 150px; overflow: hidden } .entrypoints .item { display: inline-block; float: right; width: 300px; height: 150px } .entrypoints img { width: 300px; height: 150px } .entrypoints .bx-wrapper { float: right; width: 300px; margin-left: 20px !important } .entrypoints .bx-wrapper:nth-child(3n), .entrypoints .bx-wrapper:last-child { margin-left: 0 !important } .pattern1 ul li { width: calc((100% - 40.1px) / 3) } .pattern1 ul li:nth-child(4n) { margin-left: 20px } .pattern1 ul li:nth-child(3n) { margin-left: 0 } .listing ul li { width: calc((100% - 20.1px) / 2); } .listing ul li:nth-child(3n) { margin-left: unset } .listing ul li:nth-child(2n) { margin-left: 0 } .gsc-webResult .gsc-result { width: calc((100% - 20.1px) / 2) !important } .gsc-webResult .gsc-result:nth-child(3n) { margin: 0 0 20px 20px !important } .gsc-webResult .gsc-result:nth-child(2n) { margin: 0 0 20px 0px !important } .stats { margin-left: 0; width: 100% } article .stats { height: 730px } .movedSC .showcaseDiv { display: inline-block; margin: 0 calc((100% - 300px) / 2) 20px } .tourStats.stats .item { width: calc((100% - 16px) / 2); } .tourStats.stats .item:nth-child(4n) { margin-left: 16px; } .tourStats.stats .item:nth-child(2n) { margin-left: 0; } .tourStats.cup .item { width: calc((100% - 32px) / 3); } .tourStats.cup .item:nth-of-type(4n) { margin-left: 16px } .tourStats.cup .item:nth-of-type(3n) { margin-left: 0 } .tourStats.cup .item:nth-child(2n) { margin-left: 16px } .tourStats.cup .item:last-child { margin-left: 0 } .poortour .tourStats.stats .item { width: 100%; margin-left: 0 } .dataKeywords { margin-bottom: 85px; position: relative } .dataKeywords .item { width: calc(100% - 320px) } .dataKeywords .item:nth-child(2) { margin-left: 0 } .dataKeywords .item:last-child { width: 100%; position: absolute; bottom: -46px; left: 0px } .dataKeywords .links { margin-top: 0 } article .imgDiv { width: 100% } .articleHeader .articleInfo { height: 86px; } .articleHeader .articleInfo .articleAuthor { width: 100%; } .articleHeader .articleInfo .articleAuthor:after { display: none } .relatedArticles ul li.item { width: 180px; height: auto; } .relatedArticles ul li.item .desc { width: 180px; padding: 0; } /*.Team_View .Team-Logo{margin: 15px;width: 120px;height: 120px;}*/ .Team_View .BK .number, .PlayerView .Team1 { right: 175px } .PlayerView .left { right: 310px; } .PlayerPage .tourStats.stats .item:nth-child(3n+1) { margin-left: 0; } /* .PlayerPage .tourStats.stats .item:nth-child(3n){margin-left:16px;} */ .matchDetailsTabs .matchDetailsTtl { width: calc(100% - 50px); margin: 0 calc((100% - (calc(100% - 50px))) / 2); } .matchDetailsTabs .timeline { width: calc(100% - 50px); margin: 10px calc((100% - (calc(100% - 50px))) / 2) 0; } article .connect .leftt .font { width: 45px; } article .connect .icon-cfb:before, article .connect .icon-ctw:before, article .connect .leftt .icon-G:before { font-size: 20px; line-height: 3.1; } article .connect .leftt p { width: calc(100% - 61px); font-size: 9px; right: 45px; } /*.PalyerStats.tourStats.stats .item:nth-child(3n+1){margin-left:0!important}*/ .PalyerStats.tourStats.stats .item:nth-child(2n) { margin-left: 16px; } .PalyerStats.tourStats.stats .item { width: calc((100% - 16px) / 2); } .matchesCenter .tab { width: 100%; } .matchesCenter .tab button { width: calc((100% - 30px) / 7) } .matchesCenter .dayDetailsTtl { height: 90px } .matchesCenter .toursDropdown { width: 130px; position: absolute; right: 10px; bottom: 10px } .matchesCenter .matchesNow { width: 120px; position: absolute; right: 145px; bottom: 10px } .matchesCenter .toursMatchesNum { position: absolute; left: 10px; bottom: 10px } .cd-gallery ul li { position: relative; padding-bottom: 40px } .cd-gallery li .week { position: absolute; bottom: 10px; right: 10px; margin-top: 0 } .cd-gallery li .tv { position: absolute; bottom: 10px; left: 10px; margin-top: 0 } .cd-gallery li .teamA, .cd-gallery li .teamB { width: calc((100% - 110px) / 2); } .cd-gallery li .teamA { padding-left: 20px } .cd-gallery li .teamB { padding-right: 20px } .cd-gallery li .matchScorer .goal .player { font-size: 12px; line-height: 2 } .matchesCenter.fixtures .dayDetailsTtl { height: 48px } .matchesCenter.fixtures .fTab { padding: 0 77px 0 74px } .matchesCenter.fixtures .bx-wrapper .bx-controls-direction a { width: 70px; height: 70px; } .matchesCenter.fixtures .bx-wrapper .bx-controls-direction a:before { line-height: 1.5; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) } .matchesCenter.fixtures .bx-wrapper .bx-prev { right: -77px; } .matchesCenter.fixtures .bx-wrapper .bx-next { left: -74px; } .standing .table .ttlRow .itemTtl { width: 40px; font-size: 12px; line-height: 2.2 } .standing .table .ttlRow .itemTtl:last-child { width: 100px } .standing .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 220px); } .standing .table .ttlRow .itemTtl:nth-child(4), .standing .table .ttlRow .itemTtl:nth-child(5), .standing .table .ttlRow .itemTtl:nth-child(6), .standing .table .ttlRow .itemTtl:nth-child(7), .standing .table .ttlRow .itemTtl:nth-child(8) { display: none } .standing .table .wRow .item { width: 40px; font-size: 15px; line-height: 2.6 } .standing .table .wRow .item:last-child { width: 100px } .standing .table .wRow .item:nth-child(2) { width: calc(100% - 220px); } .standing .table .wRow .item:nth-child(4), .standing .table .wRow .item:nth-child(5), .standing .table .wRow .item:nth-child(6), .standing .table .wRow .item:nth-child(7), .standing .table .wRow .item:nth-child(8) { display: none } .statsStand .table .ttlRow .itemTtl:last-child { width: 110px; } .statsStand .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 190px); } .statsStand .table .wRow .item:last-child { width: 110px; } .statsStand .table .wRow .item:nth-child(2) { width: calc(100% - 190px); } .scorers .cnts li:first-child .playerDtls .playerFooter { margin-top: 20px } .scorers .cnts li:first-child .playerDtls .playerFooter .teamInfo img { display: none } .scorers .cnts li:first-child .playerDtls .playerFooter .matches { display: none } .scorers .cnts li:first-child .playerDtls .playerFooter .assist { display: none } .wcHeader .wcNav { width: 789px; left: 25px; transform: none } .wcHeader .wcNav a { width: 68px; font-size: 12px; line-height: 3.2 } .ACNHeader .wcNav { width: 90% } .ACNHeader .wcNav a { font-size: 12px; line-height: 3.2 } .GroupStanding .table .ttlRow .itemTtl { width: 46px } .GroupStanding .table .wRow .item { width: 46px } .GroupStanding .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 414px); } .GroupStanding .table .wRow .item:nth-child(2) { width: calc(100% - 414px); } .wcStanding .groups .table { border-bottom-right-radius: 30px; border-bottom-left-radius: 30px; height: 188px; } .wcStanding .groups .table:after { bottom: -26px; height: 26px } .wcStanding .groups .table .wRow { height: 36px } .wcStanding .groups .table .wRow .item { font-size: 16px; line-height: 1.4 } .wcStanding .groups .table .wRow .team img { height: 20px; } .wcStanding .groups .table .wRow .item p { font-size: 13px; line-height: 1.7; } .ACNStanding .groups .table { border-bottom-right-radius: 30px; border-bottom-left-radius: 30px; height: 188px; } .ACNStanding .groups .table:after { bottom: -26px; height: 26px } .ACNStanding .groups .table .wRow { height: 36px } .ACNStanding .groups .table .wRow .item { font-size: 16px; line-height: 1.4 } .ACNStanding .groups .table .wRow .team img { height: 20px; } .ACNStanding .groups .table .wRow .item p { font-size: 13px; line-height: 1.7; } .chooseSquadDiv .csBackground .choose-team .image-mini { width: 50px; height: 80px; margin: 6px; } .chooseSquadDiv .stepTwo .details { height: 380px } .chooseSquadDiv .stepTwo .player-image { width: 198px; height: 320px; } .chooseSquadDiv .stepTwo .buttons { margin: 60px 0 0 0 } .SquadEG .stepTwo .buttons { margin: 8px 0 0 0 } .chooseSquadDiv .stepThree .containner { width: calc(100% - 40px) } .chooseSquadDiv .stepThree .top-content .team-image { width: 90px; height: 144px } .wcOverlay .cntnr { top: 50px; width: 600px } .wcOverlay .ykLogo { margin-bottom: 30px } .wcOverlay .goToBtns { width: 434px; height: 52px; margin: 0 calc((100% - 434px) / 2) 30px; } .wcOverlay .goToBtns a { width: 200px; font-size: 18px; } .wcOverlay .mainSponsor p { margin-bottom: 20px } .wcOverlay .mainSponsor .sponsorLogo { width: 120px } .wcOverlay .allSponsors { height: 180px } .wcOverlay .allSponsors .second { top: 70px;; width: 574px } .wcOverlay .allSponsors .second a { margin-left: 30px } .wcOverlay .allSponsors .second a img { width: 80%; height: auto } .wcOverlay .allSponsors .third { top: 140px; width: 1136px } .wcOverlay .allSponsors .third a { margin-left: 0 } .wcOverlay .allSponsors .third a img { width: 60%; height: auto } /* article .details img{margin:0 calc((100% - 600px) / 2);width: 600px} */ article .details p iframe, article .details div iframe { margin: 0; height: 450px; width: 100% } article .details p iframe#frmPAVast, article .details div iframe#frmPAVast { margin: 0; width: unset; height: unset } iframe#pa_googleAdManager { width: 0 !important; height: 0 !important; } .Team_View .Team-Bk { height: 160px } .Team_View .teamCntnr { width: 120px; margin: 10px; } .Team_View .dtls { width: calc(100% - 160px); } .PlayerView .Team1 { margin-top: 10px } .quizGame { background: url(../../Images/QuizGame/quizGameBg.png) no-repeat right -124px top #053878; } .quizGame .cnts { width: calc(100% - 475px); } .quizGame .interact_responsive_wrapper { width: 500px !important; margin: 0 calc((100% - 500px) / 2); } .quizGame .whoPlayer { right: 50px; width: 140px; } .fanZone .cnts { width: calc(100% - 40px); margin: 20px } .LandingPage.ahpy .landingTeam { width: 300px; margin-top: 50px; } .LandingPage.ahpy .landingTeam img { width: 150px } .LandingPage.ahpy .teamsName p { font-size: 42px; line-height: 1.2; } .ESNews ul li { width: calc((100% - 40.1px) / 3) } .ESNews ul li:nth-child(4n) { margin-left: 20px } .ESNews ul li:nth-child(3n) { margin-left: 0 } .acn .acnCompCont { padding-top: 0; width: 900px; margin: 0 calc((100% - 900px) / 2) 30px; } .acn .acnCompCont .containermain { padding: 40px; height: 458px } .acnCompCont .headerPES { margin-bottom: 20px } .acnCompCont .headerPES h1 { font-size: 28px } .acnCompCont .maintitle { font-size: 16px } .acnCompCont .maintitle span:first-child { font-size: 26px } .acnCompCont .sponsoredBy { margin: 20px calc((100% - 250px) / 2); width: 250px } .acnCompCont .sponsoredBy img.yk { height: 26px; margin-top: 14px } .acnCompCont .sponsoredBy img.ul { height: 54px } .acnCompCont .fblogin h2 { font-size: 14px } .acnCompCont .questionDiv p { font-size: 20px } .acnCompCont .questionDiv li { padding: 4px 18px } .acnCompCont .questionDiv ul { margin: 0 auto 50px } .acnCompCont .questionDiv .err { margin: 20px 0 } .acnCompCont .result { font-size: 20px } .acnCompCont .result span { font-size: 26px } .acnCompCont .tshirt { right: 60px } .acnCompCont .tshirt img { width: 200px; height: auto } .ACNStanding .groups .table { height: 230px; margin-bottom: 30px; } .ACNStanding .groups .table:after { bottom: 20px; height: 20px } /*.acn_Cup .acnToCup .containermain .sponsor-logo{right:152px;top:20px}*/ .acn_Cup .acnToCup .containermain .sponsor-logo p { font-size: 18px } .acn_Cup .acnToCup .containermain .sponsor-logo p.winPlayStation { font-size: 28px } .acn_Cup .acnToCup .containermain .sponsor-logo span { margin: 5px 0 } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 65px; height: auto } .acn_Cup .acnToCup .stepOne { bottom: 25px } .acnToCup .fblogin input { height: 30px !important } .acn_Cup .acnToCup #PersonalData { top: 35px } .acn_Cup .acnToCup .containermain .sponsor-logo { top: 15px } .acnToCup .fblogin a.regBtn { height: 30px; line-height: 2; width: 110px; margin: 5px calc((100% - 110px) / 2) !important; } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 60px } .acnToCup .fblogin h2.continue { display: none } .euroInner .ykMedia .pattern1 ul li:nth-child(4n), .euroInner .ykMedia .pattern1 ul li:nth-child(3n) { margin-left: 20px; } .euroInner .ykMedia .pattern1 ul li { width: calc((100% - 20.1px) / 2); } .euroInner .ykMedia .pattern1 ul li:nth-child(2n) { margin-left: 0 } /* .transfersPage .standing .table .ttlRow .itemTtl.var, .transfersPage .standing .table .wRow .item.var{text-align:right!important}*/ .transfersPage .standing .table .wRow .item.arrowImg, .transfersPage .standing .table .ttlRow .itemTtl.arrowImg { width: 75px } .transfersPage .standing .table .wRow .item img { display: none } .transfersPage .standing .table .wRow .item.arrowImg img { display: inline-block } .transfersPage .standing .table .wRow .item.fromTeam p { width: 100%; left: 18px; } .transfersPage .standing.left .table .wRow .item img { display: inline-block } .transfersPage .standing .table .wRow .item:nth-child(4), .transfersPage .standing .table .wRow .item:nth-child(5), .transfersPage .standing .table .wRow .item:nth-child(6), .transfersPage .standing .table .wRow .item:nth-child(7), .transfersPage .standing .table .wRow .item:nth-child(8), .transfersPage .standing .table .ttlRow .itemTtl:nth-child(4), .transfersPage .standing .table .ttlRow .itemTtl:nth-child(5), .transfersPage .standing .table .ttlRow .itemTtl:nth-child(6), .transfersPage .standing .table .ttlRow .itemTtl:nth-child(7), .transfersPage .standing .table .ttlRow .itemTtl:nth-child(8) { display: inline-block } .tourListing .toursCntnr .tourItem .item { height: auto } .tourListing .toursCntnr .tourItem .item .dtls { width: 100%; margin-bottom: 15px } .tourListing .toursCntnr .tourItem .item .links { float: right } .tourStats.stats.cup .groupTabs .item { width: 60px } .tourStats.stats.cup .groupTabs .table .wRow .item:nth-child(2) { width: calc(100% - 540px) } .tourStats.stats.cup .groupTabs .tab button { padding: 7px } .tourStats.stats.cup .item { float: none; margin-left: 0; width: calc((100% - 32px) / 3); } .groupTabs.GroupStanding .table .ttlRow .itemTtl { width: 40px; font-size: 12px; line-height: 2.2 } .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 220px); } .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(4), .groupTabs .table .wRow .item:nth-child(4), .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(5), .groupTabs .table .wRow .item:nth-child(5), .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(6), .groupTabs .table .wRow .item:nth-child(6), .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(9), .groupTabs .table .wRow .item:nth-child(9) { display: none } .groupTabs.GroupStanding .table .wRow .item { width: 40px; font-size: 15px; line-height: 2.6 } .groupTabs.GroupStanding .table .wRow .item:nth-child(2) { width: calc(100% - 220px); } .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(4), .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(5), .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(6), .groupTabs .table .ttlRow .itemTtl:nth-child(9) { display: none } #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(4), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(5), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(6), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(9) { display: inline-block } #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(4), #GroupStanding.cup .table .wRow .item:nth-child(4), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(5), #GroupStanding.cup .table .wRow .item:nth-child(5), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(6), #GroupStanding.cup .table .wRow .item:nth-child(6), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(9), #GroupStanding.cup .table .wRow .item:nth-child(9) { display: inline-block } #GroupStanding.cup .table .wRow .item { float: right } } @media screen and (min-width:1024px) and (max-width:1151px) { header .logo { width: 160px; padding: 13px 0 } header .logo img { width: 146px; } header .headerNav { width: calc(100% - 210px) } header .headerNav .rightMenu a { font-size: 13px; line-height: 4; padding: 0 8px; } header .headerNav .leftMenu a { width: 32px; font-size: 18px; line-height: 3.2 } header .headerNav .rightMenu { display: none } .searchDiv .searchContainer { padding: 40px 60px } .featuredArea ul li:first-child { width: 100%; margin-left: 0 } .featuredArea ul li { width: 100%; margin-left: 0; background: #fff; margin-bottom: 10px } .featuredArea ul li .secName { right: 160px; top: 10px; background: none; color: #0277bd; padding: 0 } .featuredArea ul li:first-child .secName { right: 0; top: 0; background: rgba(0,0,0,0.7); color: #fff; padding: 2px 10px; } .featuredArea ul li.video:first-child .secName, .featuredArea ul li.album:first-child .secName, .featuredArea ul li.infograph:first-child .secName, .featuredArea ul li.sed:first-child .secName { padding: 0 0 0 10px } .featuredArea ul li a .imageCntnr { width: 150px; padding-bottom: calc((150px * 67)/ 100); float: right; } .featuredArea ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 67%; float: right; margin-left: 0 } .featuredArea .desc { float: right; position: relative; width: calc(100% - 150px); height: auto; display: inline-block; background: #fff; padding: 10px; margin-top: 30px } .featuredArea .desc p { color: #000; position: relative; padding: 0 } .featuredArea ul li:first-child .desc { float: right; position: absolute; width: 100%; height: 70%; display: inline-block; padding: 0; margin-top: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0); } .featuredArea ul li:first-child .desc p { color: #fff; position: absolute; padding: 10px; height: auto; font-size: 18px } .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5), .featuredArea ul li:last-child { margin-bottom: 10px } .ESFeaturedArea ul li:first-child { width: 100%; height: 470px; } .ESFeaturedArea ul li { width: 100%; } .entryPointSlider { width: 264px; } .entrypoints { display: inline-block; width: 832px; height: 132px; margin: 0 calc((100% - 832px) / 2) 20px; overflow: hidden } .entrypoints .item { display: inline-block; float: right; width: 264px; height: 132px } .entrypoints img { width: 264px; height: 132px } .entrypoints .bx-wrapper { float: right; width: 264px; margin-left: 20px !important } .entrypoints .bx-wrapper:nth-child(3n), .entrypoints .bx-wrapper:last-child { margin-left: 0 !important } .pattern1 ul li { width: calc((100% - 40.1px) / 3) } .pattern1 ul li:nth-child(4n) { margin-left: 20px } .pattern1 ul li:nth-child(3n) { margin-left: 0 } /* .listing ul li{width:calc((100% - 20.1px) / 2)}*/ /* .listing{width:100%;margin-left:0}*/ .stats { margin-left: 0; width: 100% } .movedSC .showcaseDiv { display: inline-block; margin: 0 calc((100% - 300px) / 2) 20px } .pattern2 ul li { width: calc((100% - 12.1px) / 3) } .pattern2 ul li:first-child { width: calc(100% - ((100% + 6px) / 3)) } .pattern2 ul li:nth-child(3), .pattern2 ul li:nth-child(5), .pattern2 ul li:last-child { margin-left: 6px } .pattern2 ul li:nth-child(7), .pattern2 ul li:nth-child(8), .pattern2 ul li:last-child { margin-bottom: 6px } .pattern2 ul li:nth-child(2), .pattern2 ul li:nth-child(3), .pattern2 ul li:nth-child(2), .pattern2 ul li:nth-child(6), .pattern2 ul li:last-child { margin-left: 0 } .pattern2 ul li:nth-child(7), .pattern2 ul li:nth-child(8), .pattern2 ul li:last-child { margin-bottom: 0 } .pattern3 ul li { width: calc((100% - 30.1px) / 4); margin-left: 10px; margin-bottom: 10px; } .pattern3 ul li:first-child { width: calc(100% - ((100% + 10px) / 2)); } .tourStats.stats .item { width: calc((100% - 16px) / 2); } .tourStats.stats .item:nth-child(4n) { margin-left: 16px; } .tourStats.stats .item:nth-child(2n) { margin-left: 0; } .tourStats.cup .item { width: calc((100% - 32px) / 3); } .tourStats.cup .item:nth-of-type(4n) { margin-left: 16px } .tourStats.cup .item:nth-of-type(3n) { margin-left: 0 } .tourStats.cup .item:nth-child(2n) { margin-left: 16px } .tourStats.cup .item:last-child { margin-left: 0 } .poortour .tourStats.stats .item { width: 100%; margin-left: 0 } .tourPage .pattern1 ul li { width: calc((100% - 20.1px) / 2); } .tourPage .pattern1 ul li:nth-child(3n) { margin-left: 20px; } .tourPage .pattern1 ul li:nth-child(2n) { margin-left: 0; } .dataKeywords { margin-bottom: 85px; position: relative } .dataKeywords .item { width: calc(100% - 290px) } .dataKeywords .item:nth-child(2) { margin-left: 0; width: 270px } .dataKeywords .item:last-child { width: 100%; position: absolute; bottom: -46px; left: 0px } .dataKeywords .item ul li .teamA, .dataKeywords .item ul li .teamB { margin-top: -14px } .dataKeywords .playerTeamInfo .name .first { font-size: 14px } .dataKeywords .playerTeamInfo .name .second { font-size: 12px } .dataKeywords .links { margin-top: 0 } article .imgDiv { width: 100% } .articleHeader .articleInfo { height: 86px; } .articleHeader .articleInfo .articleAuthor { width: 100%; } .articleHeader .articleInfo .articleAuthor:after { display: none } .articleHeader .articleInfo .time { font-size: 13px } .articleHeader .articleInfo .sponsorBy { margin-left: 7px; padding-left: 14px } .articleHeader .articleInfo .sponsorBy img { height: 24px } .relatedArticles ul li.item { width: 180px; height: auto; } .relatedArticles ul li.item .desc { width: 180px; padding: 0; } article .stats { height: auto } article .stats .leagueStats .allItems { margin-bottom: 0 } article .stats .item { width: 100%; margin-left: 0; margin-bottom: 10px } article .stats .item:last-child { margin-bottom: 0 } article .connect .total h2 { font-size: 12px; line-height: 2; } article .connect .leftt input { height: 30px; margin-top: 17px; } article .connect .leftt .inputt::-webkit-input-placeholder { font-size: 12px; } article .connect .leftt a p { width: 88px; font-size: 12px } article .connect .leftt a span { font-size: 11px; } .Team_View .BK .number, .PlayerView .Team1 { right: 170px } .PlayerView .left { right: 283px; } .Team_View .BK .number span { font-size: 35px; } .matchDetailsTabs .matchDetailsTtl { width: calc(100% - 50px); margin: 0 calc((100% - (calc(100% - 50px))) / 2); } .matchDetailsTabs .timeline { width: calc(100% - 50px); margin: 10px calc((100% - (calc(100% - 50px))) / 2) 0; } article .connect .leftt .font { width: 40px; } article .connect .icon-cfb:before, article .connect .icon-ctw:before, article .connect .leftt .icon-G:before { font-size: 20px; line-height: 3.1; } article .connect .leftt p { font-size: 9px; margin: 0 5px; width: calc(100% - 50px); right: 41px; } /*.PalyerStats.tourStats.stats .item:nth-child(3n+1){margin-left:0!important}*/ .PalyerStats.tourStats.stats .item:nth-child(2n) { margin-left: 16px; } .PalyerStats.tourStats.stats .item { width: calc((100% - 16px) / 2); } .matchesCenter .tab { width: 100%; padding: 0 60px } .matchesCenter .tab button { width: calc((100% - 30px) / 7); height: 60px } .matchesCenter .tab button:before { width: 48px; height: 48px } .matchesCenter .tab button.active { height: 65px } .matchesCenter .dayDtlsContent { margin-top: 65px } .matchesCenter .tab button p { font-size: 24px } .matchesCenter .tab button span { font-size: 10px; margin-top: -3px } .matchesCenter .dateDiv { width: 40px; height: 40px } .matchesCenter .dateBtn { width: 40px; height: 40px } .matchesCenter .icon-date:before { font-size: 22px; line-height: 1.8 } .matchesCenter .dayDetailsTtl { height: 90px } .matchesCenter .toursDropdown { width: 130px; position: absolute; right: 10px; bottom: 10px } .matchesCenter .matchesNow { width: 120px; position: absolute; right: 145px; bottom: 10px } .matchesCenter .toursMatchesNum { position: absolute; left: 10px; bottom: 10px } .cd-gallery ul li { position: relative; padding-bottom: 50px } .cd-gallery li .week { position: absolute; bottom: 10px; right: 10px; margin-top: 0 } .cd-gallery li .tv { position: absolute; bottom: 10px; left: 10px; margin-top: 0 } .cd-gallery li .teamA, .cd-gallery li .teamB { width: calc((100% - 110px) / 2); } .cd-gallery li .teamA { padding-left: 20px } .cd-gallery li .teamB { padding-right: 20px } .cd-gallery li .matchScorer .goal .player { font-size: 12px; line-height: 2 } .matchesCenter.fixtures .fTab { padding: 0 76px 0 73px; height: 64px } .matchesCenter.fixtures .fTab button { height: 60px } .matchesCenter.fixtures .fTab button.active { height: 65px; border-top: 0; } .matchesCenter.fixtures .fTab button:before { width: 48px; height: 48px } .matchesCenter.fixtures.championship .fTab button p { font-size: 11px; width: 48px } .matchesCenter.fixtures .bx-wrapper .bx-controls-direction a { width: 70px; height: 60px; } .matchesCenter.fixtures .bx-wrapper .bx-controls-direction a:before { line-height: 1.5; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 12px } .matchesCenter.fixtures .bx-wrapper .bx-prev { right: -76px; } .matchesCenter.fixtures .bx-wrapper .bx-next { left: -73px; } .matchesCenter.fixtures .dayDetailsTtl { height: 48px } .standing .table .ttlRow .itemTtl { width: 40px; font-size: 12px; line-height: 2.2 } .standing .table .ttlRow .itemTtl:last-child { width: 100px } .standing .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 220px); } .standing .table .ttlRow .itemTtl:nth-child(4), .standing .table .ttlRow .itemTtl:nth-child(5), .standing .table .ttlRow .itemTtl:nth-child(6), .standing .table .ttlRow .itemTtl:nth-child(7), .standing .table .ttlRow .itemTtl:nth-child(8) { display: none } .standing .table .wRow .item { width: 40px; font-size: 15px; line-height: 2.6 } .standing .table .wRow .item:last-child { width: 100px } .standing .table .wRow .item:nth-child(2) { width: calc(100% - 220px); } .standing .table .wRow .item:nth-child(4), .standing .table .wRow .item:nth-child(5), .standing .table .wRow .item:nth-child(6), .standing .table .wRow .item:nth-child(7), .standing .table .wRow .item:nth-child(8) { display: none } .standing .tableDtls { width: 100%; margin: 0 } .standing .tableDtls .place { width: 100%; margin-left: 0; margin-bottom: 20px } .statsStand .table .ttlRow .itemTtl:last-child { width: 110px; display: inline-block } .statsStand .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 190px); } .statsStand .table .wRow .item:last-child { width: 110px; display: inline-block } .statsStand .table .wRow .item:nth-child(2) { width: calc(100% - 190px); } .scorers .cnts li { width: 100%; margin-left: 0 } .scorers .cnts li:first-child .playerDtls .playerFooter { margin-top: 20px } .scorers .cnts li:first-child .playerDtls .playerFooter .teamInfo img { display: none } .scorers .cnts li:first-child .playerDtls .playerFooter .matches { display: none } .scorers .cnts li:first-child .playerDtls .playerFooter .assist { display: none } .tourListing .toursCntnr .tourItem .item { height: auto } .tourListing .toursCntnr .tourItem .item .dtls { width: 100%; margin-bottom: 15px } .tourListing .toursCntnr .tourItem .item .links { float: right } .RoadToCup img { width: 16px; height: 10px; } .ykMedia .pattern1 ul li { width: calc((100% - 20.1px) / 2); } .ykMedia .pattern1 ul li:nth-child(3n), .ykMedia .pattern1 ul li:nth-child(4n) { margin-left: 20px; } .ykMedia .pattern1 ul li:nth-child(2n) { margin-left: 0 } .wcHeader .wcNav { width: 676px; left: 25px; transform: none } .wcHeader .wcNav a { width: 67px; font-size: 12px; line-height: 3.2; margin-left: 20px; border-radius: 6px; } .wcHeader .wcNav a:before { right: -10px } .wcHeader .wcNav a:after { left: -10px } .ACNHeader .wcNav { width: 90% } .ACNHeader .wcNav a { font-size: 11px; line-height: 3.6; margin-left: 40px; } /*.ACNHeader .wcNav a:before{right:-10px} .ACNHeader .wcNav a:after{left:-10px}*/ .wcStanding .groups .table { border-bottom-right-radius: 30px; border-bottom-left-radius: 30px; height: 188px; } .wcStanding .groups .table:after { bottom: -22px; height: 22px } .wcStanding .groups .table .wRow { height: 36px } .wcStanding .groups .table .wRow .item { font-size: 16px; line-height: 1.4; width: 28px } .wcStanding .groups .table .wRow .item:nth-child(2) { width: calc(100% - 56px); } .wcStanding .groups .table .wRow .team img { height: 20px; } .wcStanding .groups .table .wRow .item p { font-size: 13px; line-height: 1.7; } /*.MinByMin .cont {width: 100%;max-width: 1170px;overflow: hidden;} .MinByMin .minImg{width: 8%;} .MinByMin .teamA, .MinByMin .teamB { width: 20%;} .MinByMin .teamA a img, .MinByMin .teamB a img{height: 65px;} .MinByMin .teamA{text-align: left;padding-left: 24px;} .MinByMin .teamB{text-align: right;padding-right: 24px;} .MinByMin .text-Match {width: 30%;top: 15px;right: 0;} .MinByMin .ads {width: 10%;margin: 0 auto;padding-right: 14px;margin-top: 15px;}*/ .MinByMin .teamA, .MinByMin .teamB { width: calc((100% - 476px) / 2) } .MinByMin .matchInfo { width: 300px; } .MinByMin .resultDiv { width: 100px; } .chooseSquadDiv .stepTwo .details { height: 320px } .chooseSquadDiv .stepTwo .player-container { margin: 20px 60px } .chooseSquadDiv .csBackground .choose-team .image-mini { width: 53px; height: auto; } .chooseSquadDiv .csBackground .choose-team { padding: 0 10px; bottom: 5px } .chooseSquadDiv .stepTwo .playerDtls { width: calc(100% - 191px); } .chooseSquadDiv .stepTwo .player-image { width: 161px; height: 260px; } .chooseSquadDiv .stepTwo .buttons { margin: 90px 0 0 0 } .chooseSquadDiv .SquadEG .stepTwo .buttons { margin: 22px 0 0 0 } .chooseSquadDiv .stepThree .containner { width: calc(100% - 20px); top: 10px } .chooseSquadDiv .stepThree .top-content .playerContainer { padding: 0 } .chooseSquadDiv .stepThree .top-content .team-image { width: 81px; height: 130px } .chooseSquadDiv .stepTwo .PlayerAdvice { margin: 10px 0 0 0; } .wcOverlay .cntnr { top: 50px; width: 600px } .wcOverlay .wcLogo { top: 20px; right: 20px } .wcOverlay .close { top: 20px; left: 20px } .wcOverlay .ykLogo { margin-bottom: 30px } .wcOverlay .goToBtns { width: 434px; height: 52px; margin: 0 calc((100% - 434px) / 2) 30px; } .wcOverlay .goToBtns a { width: 200px; font-size: 18px; } .wcOverlay .mainSponsor p { margin-bottom: 20px } .wcOverlay .mainSponsor .sponsorLogo { width: 120px } .wcOverlay .allSponsors { height: 180px } .wcOverlay .allSponsors .second { top: 70px; width: 544px } .wcOverlay .allSponsors .second a { margin-left: 20px } .wcOverlay .allSponsors .second a img { width: 70%; height: auto } .wcOverlay .allSponsors .third { top: 140px; width: 1000px } .wcOverlay .allSponsors .third a { margin-left: 0; width: calc(100% / 9) } .wcOverlay .allSponsors .third a img { width: 70%; height: auto } .wcOverlay .allSponsors .third a:nth-child(1) img { width: 80% } .wcOverlay .allSponsors .third a:nth-child(2) img { width: 50% } .wcOverlay .allSponsors .third a:nth-child(6) img { width: 50% } .wcOverlay .allSponsors .third a:nth-child(9) img { width: 50% } .gsc-webResult .gsc-result { width: calc((100% - 20.1px) / 2) !important } .gsc-webResult .gsc-result:nth-child(3n) { margin: 0 0 20px 20px !important } .gsc-webResult .gsc-result:nth-child(2n) { margin: 0 0 20px 0px !important } .GroupStanding .table .ttlRow .itemTtl { width: 38px } .GroupStanding .table .wRow .item { width: 38px } .GroupStanding .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 345px); } .GroupStanding .table .wRow .item:nth-child(2) { width: calc(100% - 345px); padding: 16px 0 } .GroupStanding .table .wRow .team img { height: 26px } .GroupStanding .table .wRow .item p { line-height: 1.8 } .EntryPoint .cont { width: 100%; max-width: 100% } .EntryPoint .cont .EntryTextCup { width: 22%; margin: 24px auto; } .EntryPoint .cont .EntryTextCup span { font-size: 18px; } .EntryPoint .cont .EntryButton { width: 20%; } .EntryPoint .EntrySocial { width: 28%; text-align: right; } .EntryIconArrow { right: 8%; } .EntryPoint .cont .EntryWorldCup { width: 40%; } .EntryPoint .EntryAds { width: 15%; text-align: center; } /* article .details img{margin:0 calc((100% - 500px) / 2);width: 500px} */ article .details p iframe, article .details div iframe { margin: 0; height: 375px; width: 100% } article .details p iframe#frmPAVast, article .details div iframe#frmPAVast { margin: 0; width: unset; height: unset } iframe#pa_googleAdManager { width: 0 !important; height: 0 !important; } .Team_View .Team-Bk { height: 160px } .Team_View .teamCntnr { width: 120px; margin: 10px; } .Team_View .dtls { width: calc(100% - 160px); } .PlayerView .Team1 { margin-top: 10px } .predPage .predictionHolder .matches li img { height: 40px; width: auto; } .predPage .predictionHolder .matches .predDate, .predPage .predictionHolder .matches .predResult { margin-top: 18px } .predPage .predictionHolder ul li.predDate, .predPage .predictionHolder ul li.predJoker { width: 90px; } .predPage .predictionHolder ul li.predTeam { width: calc((100% - 280px) / 2); } .predPage .predictionHolder ul li.predResult { width: 100px } .predPage .predictionHolder .team { font-size: 12px; margin-top: 0 } .quizGame { background: url(../../Images/QuizGame/quizGameBg.png) no-repeat right -154px top #053878; } .quizGame .cnts { width: calc(100% - 447px); } .quizGame .interact_responsive_wrapper { width: 300px !important; margin: 0 calc((100% - 300px) / 2); } .quizGame .whoPlayer { right: 30px; width: 140px; } .LandingPage .landingTeam { top: 100px; } .chooseSquadDiv .SquadInt .player-image { height: 180px; } .chooseSquadDiv .SquadEG .stepTwo .details { height: 350px !important } .choose-team .plancontainer .plandorpdownbottom { margin: 0 auto 10px; } .chooseSquadDiv .SquadInt .choose-team { top: 380px; } .SquadInt .choose-team .plancontainer .teamphotoscontainer { float: none } .SquadInt .choose-team .plancontainer .teamphotoscontainer li { margin-bottom: 8px } .fanZone .cnts { width: calc(100% - 40px); margin: 20px } .LandingPage.ahpy .landingTeam { width: 250px; margin-top: 70px; } .LandingPage.ahpy .landingTeam img { width: 125px } .LandingPage.ahpy .teamsName p { font-size: 42px; line-height: 1.2; } .ESMultimedia ul li { width: calc((100% - 12.1px) / 2) } .ESMultimedia ul li:first-child { width: 100% } .ESMultimedia ul li:nth-child(3), .ESMultimedia ul li:nth-child(5), .ESMultimedia ul li:last-child { margin-left: 6px } .ESMultimedia ul li:nth-child(7), .ESMultimedia ul li:nth-child(8), .ESMultimedia ul li:last-child { margin-bottom: 6px } .ESMultimedia ul li:nth-child(7), .ESMultimedia ul li:nth-child(8), .ESMultimedia ul li:last-child { margin-bottom: 0 } .ESNews ul li { width: calc((100% - 40.1px) / 2) } .LiveStreem .desc .container-desc { top: 10%; } .sharak { left: 13%; } .acn .acnCompCont { padding-top: 0; width: 800px; margin: 0 calc((100% - 800px) / 2) 30px; } .acn .acnCompCont .containermain { padding: 40px; height: 408px } .acnCompCont .headerPES { margin-bottom: 20px } .acnCompCont .headerPES h1 { font-size: 24px } .acnCompCont .socialiconCont { margin-top: 3px } .acnCompCont .maintitle { font-size: 16px; line-height: 1.6 } .acnCompCont .maintitle span:first-child { font-size: 26px } .acnCompCont .fblogin input { height: 36px !important } .acnCompCont .fblogin .ctrls input:last-of-type { margin-bottom: 0 !important } .acnCompCont .sponsoredBy { margin: 20px calc((100% - 250px) / 2); width: 250px } .acnCompCont .sponsoredBy img.yk { height: 26px; margin-top: 14px } .acnCompCont .sponsoredBy img.ul { height: 54px } .acnCompCont .fblogin h2 { font-size: 14px } .acnCompCont .fblogin a { margin: 10px calc((100% - 180px) / 2); width: 180px; height: 36px; line-height: 2.5; } .acnCompCont .questionDiv p { font-size: 20px; margin: 20px 0; } .acnCompCont .questionDiv li { padding: 4px 18px } .acnCompCont .questionDiv ul { margin: 0 auto 30px } .acnCompCont .questionDiv .nextquest { width: 150px } .acnCompCont .questionDiv .err { margin: 20px 0; font-size: 14px; } .acnCompCont .result { font-size: 20px; margin-top: 80px; } .acnCompCont .result span { font-size: 26px } .acnCompCont .tshirt { right: 40px } .acnCompCont .tshirt img { width: 160px; height: auto } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 50px; height: auto } .ACNStanding .groups .table { border-bottom-right-radius: 30px; border-bottom-left-radius: 30px; height: 220px; height: 230px; margin-bottom: 30px; } .ACNStanding .groups .table:after { bottom: 25px; height: 22px } .ACNStanding .groups .table .wRow { height: 36px } .ACNStanding .groups .table .wRow .item { font-size: 16px; line-height: 1.4; width: 28px } .ACNStanding .groups .table .wRow .item:nth-child(2) { width: calc(100% - 56px); } .ACNStanding .groups .table .wRow .team img { height: 20px; } .ACNStanding .groups .table .wRow .item p { font-size: 13px; line-height: 1.7; } .ACNStanding .groups .table .shadow { -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 81.5%, 50% 100%, 0 81.5%); clip-path: polygon(0% 0%, 100% 0%, 100% 81.5%, 50% 100%, 0 81.5%); } .ACNStanding .groups .table:after { bottom: 20px; height: 20px } /*.acn_Cup .acnToCup .containermain .sponsor-logo{right:120px;top:20px}*/ .acn_Cup .acnToCup .containermain .sponsor-logo p { font-size: 18px } .acn_Cup .acnToCup .containermain .sponsor-logo p.winPlayStation { font-size: 28px } .acn_Cup .acnToCup .containermain .sponsor-logo span { margin: 5px 0 } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 65px; height: auto } .acn_Cup .acnToCup .stepOne, .acn_Cup .acnToCup .loader { bottom: 10px } .acn_Cup .acnToCup .containermain .sponsor-logo { top: 15px } .acnToCup .fblogin input { height: 30px !important } .acn_Cup .acnToCup #PersonalData { top: 24px } .acn_Cup .acnToCup .containermain .sponsor-logo { top: 15px } .acnToCup .fblogin a.regBtn { height: 30px; line-height: 2; width: 110px; margin: 5px calc((100% - 110px) / 2) !important; } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 60px } .acnToCup .fblogin h2.continue { display: none } .acn_Cup .acnToCup .containermain { padding-bottom: 42% } .listing ul li { width: calc((100% - 20.1px) / 2) } .listing ul li:nth-child(3n) { margin-left: unset } .listing ul li:nth-child(2n) { margin-left: 0 } .transfersPage .standing .table .ttlRow .itemTtl.var, .transfersPage .standing .table .wRow .item.var { text-align: right !important; display: inline-block } .transfersPage .standing .table .wRow .item.arrowImg, .transfersPage .standing .table .ttlRow .itemTtl.arrowImg { width: 75px } .transfersPage .standing .table .wRow .item img { display: none } .transfersPage .standing .table .wRow .item.arrowImg img { display: inline-block } .transfersPage .standing.left .table .wRow .item img { display: inline-block } .tourStats.stats.cup .groupTabs .item { width: 60px } .tourStats.stats.cup .groupTabs .table .wRow .item:nth-child(2) { width: calc(100% - 540px) } .tourStats.stats.cup .groupTabs .tab button { padding: 7px } .tourStats.stats.cup .item { float: none; margin-left: 0; width: calc((100% - 32px) / 3); } .groupTabs.GroupStanding .table .ttlRow .itemTtl { width: 40px; font-size: 12px; line-height: 2.2 } .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 220px); } .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(4), .groupTabs .table .wRow .item:nth-child(4), .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(5), .groupTabs .table .wRow .item:nth-child(5), .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(6), .groupTabs .table .wRow .item:nth-child(6), .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(9), .groupTabs .table .wRow .item:nth-child(9) { display: none } .groupTabs.GroupStanding .table .wRow .item { width: 40px; font-size: 15px; line-height: 2.6 } .groupTabs.GroupStanding .table .wRow .item:nth-child(2) { width: calc(100% - 220px); } .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(4), .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(5), .groupTabs.GroupStanding .table .ttlRow .itemTtl:nth-child(6), .groupTabs .table .ttlRow .itemTtl:nth-child(9) { display: none } #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(4), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(5), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(6), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(9) { display: inline-block } #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(4), #GroupStanding.cup .table .wRow .item:nth-child(4), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(5), #GroupStanding.cup .table .wRow .item:nth-child(5), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(6), #GroupStanding.cup .table .wRow .item:nth-child(6), #GroupStanding.cup .table .ttlRow .itemTtl:nth-child(9), #GroupStanding.cup .table .wRow .item:nth-child(9) { display: inline-block } #GroupStanding.cup .table .wRow .item { float: right } } @media screen and (min-width:768px) and (max-width:1920px) { .RoadToCup .imageRight, .RoadToCup .imageLeft, .RoadToCup .Mbutton { display: none } } @media screen and (min-width:768px) and (max-width:1023px) { .chooseSquadDiv .csBackground .choose-team { } .SquadInt .choose-team .plancontainer .plandorpdownbottom { margin: 0 auto 10px; } .SquadInt .choose-team .plancontainer .teamphotoscontainer { float: none } .chooseSquadDiv .stepTwo .details { margin: 8px calc((100% - 700px) / 2) 0 !important; } /*.acn_Cup .acnToCup .containermain .sponsor-logo{right:162px;top:20px}*/ .acn_Cup .acnToCup .containermain .sponsor-logo p { font-size: 18px } .acn_Cup .acnToCup .containermain .sponsor-logo p.winPlayStation { font-size: 28px } .acn_Cup .acnToCup .containermain .sponsor-logo span { margin: 5px 0 } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 65px; height: auto } .acn_Cup .acnToCup .stepOne { bottom: 10px } } @media only screen and (max-width: 1024px) { .ESHeader { background-size: 280%; padding-bottom: 30%; } .ESbtn a { top: 170px; width: 30%; } .ESbtn { right: 15%; } .ESbtn .video { right: 40%; } .ESNews ul li .desc { border-bottom: none } .LiveStreem .desc .container-desc { top: 10%; } .content-esport .listing ul li { border: none; } .content-esport .listing ul li .secName { background: rgba(0,0,0,0.7); padding: 0 5px; } } @media screen and (max-width:320px) { .MinByMin .text-Match { margin-bottom: 8px !important; } .MinByMin .ads { padding-right: 0; } .EntryPoint .cont .EntryWorldCup { width: 100% !important; } .EntryPoint .cont .EntryWorldCup .mobImg { height: 65px; margin-top: 14px } .EntryPoint .cont .EntryWorldCup .mainImg { display: none } .EntryPoint .cont .EntryButton { width: 30% !important; } .EntryPoint .EntryAds { width: 20% !important; } .LandingPage .landingTeam { top: 10px !important; } .leaderboardFull { padding: 25px 0; } .LiveStreem .desc { width: 50% } .LiveStreem ul li:first-child .desc p { font-size: .6em; } .LiveStreem .desc span { font-size: .4em; top: 40%; } .medal .allItems .country .WC-EntryPoint .cont .EntryWorldCup { width: 100px !important; } .WC-EntryPoint .cont .EntryAds { width: calc(100% - 100px) !important; margin-top: 32px } } /** iPad & Tablet **/ @media only screen and (max-width: 1023px) { .gutter { display: none } .content-wrap { width: 100%; padding: 0px } .content { padding: 10px } header .logo { margin: 12px calc((100% - 257px) / 2); width: 157px; height: 26px; padding: 0 } header .logo img { width: 100%; height: auto } header .headerNav { float: left; width: 50px; margin-right: 0 } header .headerNav .rightMenu { display: none } header .headerNav .leftMenu a { display: none } header .headerNav .leftMenu a:last-child { display: inline-block; width: 50px } footer .middle .cnts { width: 100%; padding: 0 20px } .searchDiv .searchContainer .search input { height: 50px } .searchDiv .searchContainer .search a { width: 50px; height: 48px; font-size: 28px } .searchDiv .searchContainer .search a.icon-search:before { line-height: 1.8 } .searchDiv .searchContainer .search { width: 700px; margin: 0px calc((100% - 700px) / 2); } .searchDiv .searchContainer { padding: 40px } .searchDiv .searchContainer .trendsContent h2 { font-size: 20px } .searchDiv .searchContainer .trendsContent .ttl { height: 54px; } .searchDiv .searchContainer .trendsContent .keywordsDiv .item { padding: 0 24px; font-size: 14px; height: 34px } .featuredArea { margin-left: 0; width: 100% } .featuredArea ul li:first-child { width: 100%; margin-left: 0 } .featuredArea ul li { width: 100%; margin-left: 0; background: #fff; margin-bottom: 10px } .featuredArea ul li .secName { right: 160px; top: 10px; background: none; color: #0277bd; padding: 0 } .featuredArea ul li:first-child .secName { right: 0; top: 0; background: rgba(0,0,0,0.7); color: #fff; padding: 2px 10px; height: auto } .featuredArea ul li.video:first-child .secName, .featuredArea ul li.album:first-child .secName, .featuredArea ul li.infograph:first-child .secName, .featuredArea ul li.sed:first-child .secName { padding: 0 0 0 10px } .featuredArea ul li a .imageCntnr { width: 150px; padding-bottom: calc((150px * 67)/ 100); float: right; } .featuredArea ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 67%; float: right; margin-left: 0 } .featuredArea .desc { float: right; position: relative; width: calc(100% - 150px); height: auto; display: inline-block; background: #fff; padding: 10px; margin-top: 30px } .featuredArea .desc p { color: #000; position: relative; padding: 0 } .featuredArea ul li:first-child .desc { float: right; position: absolute; width: 100%; height: 70%; display: inline-block; padding: 0; margin-top: 0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0); } .featuredArea ul li:first-child .desc p { color: #fff; position: absolute; padding: 10px } .featuredArea ul li:nth-child(4), .featuredArea ul li:nth-child(5), .featuredArea ul li:last-child { margin-bottom: 10px } .ESFeaturedArea { margin-left: 0; width: 100% } .ESFeaturedArea ul li:first-child { width: 100%; height: 590px; } .ESFeaturedArea ul li { width: 100%; } .ESFeaturedArea .desc { height: 30%; } /*.ESFeaturedArea ul li:first-child {width: 100%;margin-left:0} .ESFeaturedArea ul li {width: 100%;margin-left:0;background:#fff;margin-bottom:10px} .ESFeaturedArea ul li .secName{right:160px;top:10px;background:none;color:#0277bd;padding:0} .ESFeaturedArea ul li:first-child .secName{right:0;top:0;background: rgba(0,0,0,0.7);color:#fff;padding: 2px 10px;height:auto} .ESFeaturedArea ul li a .imageCntnr{width: 150px;padding-bottom: calc((150px * 67)/ 100);float: right;} .ESFeaturedArea ul li:first-child a .imageCntnr{width: 100%;float: right;margin-left: 0} .ESFeaturedArea .desc{float:right;position:relative;width:calc(100% - 150px);height:auto;display:inline-block;background:#fff;padding:10px;margin-top:30px} .ESFeaturedArea .desc p{color:#000;position:relative;padding:0} .ESFeaturedArea ul li:first-child .desc{float:right;position:absolute;width:100%;height:70%;display:inline-block;padding:0;margin-top:0; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0); } .ESFeaturedArea ul li:first-child .desc p{color:#fff;position:absolute;padding:10px} .ESFeaturedArea ul li:nth-child(4), .ESFeaturedArea ul li:nth-child(5), .ESFeaturedArea ul li:last-child {margin-bottom: 10px}*/ .ESBanner { float: none; margin: 0 auto 20px } .showcaseDiv { margin: 20px calc((100% - 300px)/ 2); } .interestedArticles { margin: 0 0 20px; width: 100%; } .interestedArticles .cnts li { margin-bottom: 20px } .interestedArticles .cnts li .num { position: absolute; top: 50%; right: 0; transform: translateY(-50%); margin: 0 } .interestedArticles .cnts li p { height: auto; margin-right: 46px } .olympic .interestedArticles .cnts li .num { position: relative; float: right; top: auto; right: auto; transform: none; font-size: 14px } .olympic .interestedArticles .cnts li p { margin-right: 0 } .entryPointSlider { width: 230px } .entrypoints { display: inline-block; width: 730px; height: 115px; margin: 0 calc((100% - 730px) / 2) 20px; overflow: hidden } .entrypoints .item { display: inline-block; float: right; width: 230px; height: 115px } .entrypoints img { width: 230px; height: 115px } .entrypoints .bx-wrapper { float: right; width: 230px; margin-left: 20px !important } .entrypoints .bx-wrapper:nth-child(3n), .entrypoints .bx-wrapper:last-child { margin-left: 0 !important } .pattern1 ul li { width: 100%; margin-left: 0; margin-bottom: 10px } .pattern1 ul li .secName { right: 160px; top: 10px; background: none; color: #0277bd; padding: 0 } .pattern1 ul li a .imageCntnr { width: 150px; padding-bottom: calc((150px * 67)/ 100); float: right; } .pattern1 ul li .desc { float: right; position: relative; width: calc(100% - 150px); height: auto; display: inline-block; background: #fff; padding: 7px 10px; margin-top: 30px } .pattern1 ul li .desc p { color: #000; position: relative; padding: 0; height: 27px } .listing { width: 100%; margin-left: 0 } .listing ul li { width: 100%; margin-left: 0; margin-bottom: 10px } .listing ul li .secName { right: 160px; top: 10px; background: none; color: #0277bd; padding: 0 } .listing ul li a .imageCntnr { width: 150px; padding-bottom: calc((150px * 67)/ 100); float: right; } .listing ul li .desc { float: right; position: relative; width: calc(100% - 150px); height: auto; display: inline-block; background: #fff; padding: 7px 10px; margin-top: 30px } .listing ul li .desc p { color: #000; position: relative; padding: 0; height: 27px } .leftSide { width: 100% } .gsc-webResult .gsc-result { width: 100% !important; margin-left: 0 !important } a.gs-image { width: 150px !important; padding-bottom: calc((150px * 67)/ 100) !important; float: right !important } .gsc-control-cse .gsc-table-result { float: right !important; width: 150px !important } .gs-webResult.gs-result { display: flex !important } .gsc-thumbnail-inside { width: calc(100% - 150px); float: right !important; } .smsServices { margin: 0 calc((100% - 300px) / 2) 20px; } .stats { margin-left: 0; width: 100% } .movedSC .showcaseDiv { display: inline-block; margin: 0 calc((100% - 300px) / 2) 20px } .pattern2 ul li { width: calc((100% - 12.1px) / 3) } .pattern2 ul li:first-child { width: calc(100% - ((100% + 6px) / 3)) } .pattern2 ul li:nth-child(3), .pattern2 ul li:nth-child(5), .pattern2 ul li:last-child { margin-left: 6px } .pattern2 ul li:nth-child(7), .pattern2 ul li:nth-child(8), .pattern2 ul li:last-child { margin-bottom: 6px } .pattern2 ul li:nth-child(2), .pattern2 ul li:nth-child(3), .pattern2 ul li:nth-child(6), .pattern2 ul li:last-child { margin-left: 0 } .pattern2 ul li:nth-child(7), .pattern2 ul li:nth-child(8), .pattern2 ul li:last-child { margin-bottom: 0 } .pattern3 ul li { width: calc((100% - 10.1px) / 2); margin-left: 10px; margin-bottom: 10px; } .pattern3 ul li:first-child { width: 100%; margin-left: 0 } .tourNav a { font-size: 15px; padding: 0 16px } .tourMatches { margin-bottom: 20px; width: 100% } .tourStats.stats .item { width: calc((100% - 16px) / 2); } .tourStats.stats .item:nth-child(4n) { margin-left: 16px; } .tourStats.stats .item:nth-child(2n) { margin-left: 0; } .tourStats.cup .item { width: calc((100% - 32px) / 3); } .tourStats.cup .item:nth-of-type(4n) { margin-left: 16px } .tourStats.cup .item:nth-of-type(3n) { margin-left: 0 } .tourStats.cup .item:nth-child(2n) { margin-left: 16px } .tourStats.cup .item:last-child { margin-left: 0 } .tourPage .pattern1 { margin-left: 0; width: 100% } .tourPage .pattern1 ul li { width: 100% } .poortour .tourStats.stats { width: 100%; margin-left: 0 } .poortour .tourStats.stats .item { width: 100%; margin-left: 0 } article { width: 100%; margin-left: 0 } article .imgDiv { width: 100% } .articleHeader .articleInfo { height: 86px; } .articleHeader .articleInfo .articleAuthor { width: 100%; } .articleHeader .articleInfo .articleAuthor:after { display: none } .articleHeader .articleInfo .time { font-size: 13px } .articleHeader .articleInfo .sponsorBy { margin-left: 7px; padding-left: 14px } .articleHeader .articleInfo .sponsorBy img { height: 24px } .albumTemp .articleHeader .articleInfo { height: 56px } .videoTemp .articleHeader .articleInfo { height: 56px } .articlePage .left { width: 100% } .newsPointer { width: 100% } .articleHeader .artclHdline { font-size: 20px } .policy { width: 100%; } .contact_us { width: 100%; } .articleHeader .authoer-img { width: 125px; } .articale_Section .articleHeader .artclHdline { font-size: 16px; } /*.Team_View .BK .number, .PlayerView .Team1{right:150px;}*/ .Team_View .BK .number h1 { font-size: 16px } .teamProf .BK .number h1 { line-height: 5 } .Team_View .owner-left .owner-DT p { font-size: 14px } .Team_View .owner-left .owner-DT h2 { line-height: unset; font-size: 16px } .Team_View .BK .number span { font-size: 28px } .Team_Page .list { width: 100% } .PlayerView .left { right: 260px } .PlayerView .Team1 .Logoo { width: 30px; height: 30px; } .PlayerView .Team1 h2 { font-size: 12px; margin-top: 3px; } .mtchDtlsRslt { background: url(../../Images/matchDtlsBg.jpg) no-repeat center top 0; background-size: 110%; } .matchDetailsTabs .matchDetailsTtl { width: 100%; margin: 0; } .matchDetailsTabs .timeline { width: 100%; margin: 10px 0 0; } .mtchDtlsRslt li .teamA { padding-left: 30px } .mtchDtlsRslt li .teamB { padding-right: 30px } .mtchDtlsRslt li .teamA img, .mtchDtlsRslt li .teamB img { height: 60px } .mtchDtlsRslt li .teamA p, .mtchDtlsRslt li .teamB p { line-height: 3.6; font-size: 16px } .matchDetailsTabs .timeline.squad .teamA, .matchDetailsTabs .timeline.squad .teamB { width: calc((100% - 300px) / 2); } .matchDetailsTabs .timeline.squad .teamA .matchSquad h3, .matchDetailsTabs .timeline.squad .teamB .matchSquad h3 { font-size: 14px } .matchDetailsTabs .timeline.squad .teamA .matchSquad ul li .playerNum, .matchDetailsTabs .timeline.squad .teamB .matchSquad ul li .playerNum { font-size: 14px } .matchDetailsTabs .timeline.squad .teamA .matchSquad ul li .playerNum { margin-left: 5px } .matchDetailsTabs .timeline.squad .teamB .matchSquad ul li .playerNum { margin-right: 5px } .matchDetailsTabs .timeline.squad .teamA .matchSquad ul li .playerName, .matchDetailsTabs .timeline.squad .teamB .matchSquad ul li .playerName { width: calc(100% - 28px); font-size: 12px } .matchDetailsTabs .timeline.squad .teamA .coach, .matchDetailsTabs .timeline.squad .teamB .coach { font-size: 14px } .matchDetailsTabs .timeline.squad .formation { width: 300px; height: 440px } .matchDetailsTabs .timeline.squad .formation .teamA, .matchDetailsTabs .timeline.squad .formation .teamB { width: 280px; height: 200px } .ManofMatch { width: 300px; max-height: 300px; top: 638px; } .PlayerPage .right { width: 100%; margin-left: 0 } .leeft { width: 100%; margin-right: 0; } /*.PalyerStats.tourStats.stats .item:nth-child(3n+1){margin-left:0!important}*/ .PalyerStats.tourStats.stats .item:nth-child(2n) { margin-left: 16px; } .matchesCenter { width: 100%; margin-left: 0 } .standing { width: 100%; margin-left: 0 } .standing .table .ttlRow .itemTtl { width: 40px; font-size: 12px; line-height: 2.2 } .standing .table .ttlRow .itemTtl:last-child { width: 100px } .standing .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 420px); } .standing .table .wRow .item { width: 40px; font-size: 15px; line-height: 2.6 } .standing .table .wRow .item:last-child { width: 100px } .standing .table .wRow .item:nth-child(2) { width: calc(100% - 420px); } .statsStand .table .ttlRow .itemTtl:last-child { width: 110px; display: inline-block } .statsStand .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 190px); } .statsStand .table .wRow .item:last-child { width: 110px; display: inline-block } .statsStand .table .wRow .item:nth-child(2) { width: calc(100% - 190px); } .scorers { width: 100%; margin-left: 0 } .scorers .cnts li:first-child .playerDtls .playerFooter .teamInfo { margin-left: 20px; width: calc(100% - 262px); } .scorers .cnts li:first-child .playerDtls .playerFooter .matches { margin-left: 20px } .tourListing { width: 100%; margin-left: 0 } .groupTabs .table .ttlRow .itemTtl { width: 50px; font-size: 12px; line-height: 2.2 } .groupTabs .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 450px); } .groupTabs .table .wRow .item { width: 50px; font-size: 14px; line-height: 2.9 } .groupTabs .table .wRow .item:nth-child(2) { width: calc(100% - 450px); } .euroInner article .stats { margin-bottom: 20px } .ContactUs { width: 100% } /*.RoadToCup .Cup1{top:16.5%} .RoadToCup .Cup2{top:10.3%} .RoadToCup .Cup3{top:30.9%} .RoadToCup .Cup4{top:24.5%} .RoadToCup .Cup5{top:44.8%} .RoadToCup .Cup6{top:38.5%} .RoadToCup .Cup7{top:59%} .RoadToCup .Cup8{top:52.5%} .RoadToCup .leftSlide .Cup1{top:10.3%} .RoadToCup .leftSlide .Cup2{top:16.5%} .RoadToCup .leftSlide .Cup3{top:24.5%} .RoadToCup .leftSlide .Cup4{top:33.9%} .RoadToCup .leftSlide .Cup5{top:38.5%} .RoadToCup .leftSlide .Cup6{top:44.8%} .RoadToCup .leftSlide .Cup7{top:52.5%} .RoadToCup .leftSlide .Cup8{top:59%} .RoadToCup .Winnerright .Cupitem{right: 152px;top: 13.5%;} .RoadToCup .Winnerright .winnerB, .RoadToCup .Winnerleft .winnerB{top:27.5%!important} .RoadToCup .Winnerright .winnerC, .RoadToCup .Winnerleft .winnerC{top:41.8%!important} .RoadToCup .Winnerright .winnerD, .RoadToCup .Winnerleft .winnerD{top:55.7%!important} .RoadToCup .Winnerleft .Cupitem{left: 150px;top: 13.5%;} .RoadToCup .Winnerright2 .Cupitem{top: 20.5%;right: 292px;} .RoadToCup .Winnerright2 .Cupitem.winnerB, .RoadToCup .Winnerleft2 .Cupitem.winnerB{top:49%} .RoadToCup .Winnerleft2 .Cupitem{top: 20.5%;left: 292px;} .RoadToCup .onewinner .Cupitem{top: 34.5%;right: 325px;} .RoadToCup .onewinner2 .Cupitem{top: 34.5%;left: 325px;}*/ .RoadToCup img { width: 18px; height: 9px; } .RoadToCup .Cupitem { height: 23px; width: 13% } .RoadToCup .option { font-size: 12px; } .RoadToCup .DP li { font-size: 13px } .RoadToCup .DP { top: 22px } .RoadToCup .winnerIN .DP { top: 26px; } .RoadToCup .winnerIN .DP li { font-size: 13px } .wcHeader { height: 100px; background-size: auto 100% } .wcHeader .wcNavBtn { display: inline-block } .wcHeader .wcNav { display: none } .wcHeader .wcSocialMedia { display: none } .wcHeader h3 { font-size: 15px; margin: 54px 110px 0 0; } .wcHeader h3 span { font-size: 13px; } .wcHeader .wcMenuDiv .wcNav { display: inline-block; top: 20px; width: 150px; left: 50%; transform: translateX(-50%); } .wcHeader .wcNav a { width: 100%; margin-bottom: 8px } .wcHeader .wcMenuDiv .wcSocialMedia { display: inline-block; bottom: 10px; top: auto; left: 50%; transform: translate(-50%); width: 90px; height: 36px } .wcHeader .wcMenuDiv .wcSocialMedia a { width: 36px; height: 36px; font-size: 20px } .wcMenuDiv { background-size: 250px } .ACNHeader { height: 120px; margin-bottom: 20px } .ACNHeader .wcNavBtn { display: inline-block } .ACNHeader .wcNav { display: none } .ACNHeader .wcSocialMedia { display: none } .ACNHeader h3 { font-size: 15px; margin: 54px 110px 0 0; } .ACNHeader h3 span { font-size: 13px; } .ACNHeader .wcMenuDiv .wcNav { display: inline-block; top: 20px; width: 150px; left: 50%; transform: translateX(-50%); } .ACNHeader .wcNav a { width: 100%; margin: 6px 0; } .ACNHeader .wcMenuDiv .wcSocialMedia { display: inline-block; bottom: 20px; top: auto; left: 50%; transform: translate(-50%); width: 90px; height: 40px } .wcStanding .groups .table { width: calc((100% - 20px) / 2); border-bottom-right-radius: 30px; border-bottom-left-radius: 30px } .wcStanding .groups .table:nth-child(4n) { margin-left: 20px; } .wcStanding .groups .table:nth-child(2n) { margin-left: 0; } .wcStanding .groups .table:nth-last-child(-n+4) { margin-bottom: 42px; } .wcStanding .groups .table:nth-last-child(-n+2) { margin-bottom: 32px; } .ACNStanding .groups .table { width: calc((100% - 20px) / 2); border-bottom-right-radius: 30px; border-bottom-left-radius: 30px; height: 230px; margin-bottom: 30px; } .ACNStanding .groups .table:nth-child(4n) { margin-left: 20px; } .ACNStanding .groups .table:nth-child(2n) { margin-left: 0; } .ACNStanding .groups .table:nth-last-child(-n+4) { margin-bottom: 42px; } .ACNStanding .groups .table:nth-last-child(-n+2) { margin-bottom: 32px; } .ACNStanding .groups .table:nth-child(3n) { margin-left: 20px; } .ACNStanding .groups .table:last-child { margin-left: 0 } .ACNStanding .groups .table:after { bottom: 20px; height: 20px } .ACNStanding .groups .table .wRow { height: 36px } .ACNStanding .groups .table .wRow .item { font-size: 16px; line-height: 1.4; width: 28px } .ACNStanding .groups .table .wRow .item:nth-child(2) { width: calc(100% - 56px); } .ACNStanding .groups .table .wRow .team img { height: 20px; } .ACNStanding .groups .table .wRow .item p { font-size: 13px; line-height: 1.7; } .ACNStanding .groups .table .shadow { -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 81.5%, 50% 100%, 0 81.5%); clip-path: polygon(0% 0%, 100% 0%, 100% 81.5%, 50% 100%, 0 81.5%); } .poll { margin: 0 calc((100% - 300px) / 2) 20px } .ListingEN .interestedArticles .cnts li .num { left: 0; right: auto } .ListingEN .interestedArticles .cnts li p { margin-left: 46px; margin-right: 0 } .ListingEN .listing ul li .secName { padding: 2px 10px; } .chooseSquadDiv .csBackground ul.dropmenu { padding: 0 50px } .chooseSquadDiv .csBackground ul.dropdown-menu1 { padding: 100px 50px 10px; } .chooseSquadDiv .csBackground ul.dropdown-menu1 li { width: calc((100% - 30.1px )/ 4) } .chooseSquadDiv .csBackground ul.dropdown-menu1 li:nth-child(5n) { margin-left: 10px } .chooseSquadDiv .csBackground ul.dropdown-menu1 li:nth-last-child(-n+5) { margin-bottom: 30px } .chooseSquadDiv .csBackground ul.dropdown-menu1 li:nth-child(4n) { margin-left: 0 } .chooseSquadDiv .csBackground ul.dropdown-menu1 li:nth-last-child(-n+4) { margin-bottom: 0 } .chooseSquadDiv .stepTwo .details { height: 350px; width: 700px; margin: 30px calc((100% - 700px) / 2) 0; } .chooseSquadDiv .stepTwo .player-container { margin: 20px 45px } .chooseSquadDiv .csBackground .choose-team .image-mini { width: 40px; height: 65px; margin: 6px; } .chooseSquadDiv .csBackground .choose-team { bottom: 20px; padding: 0 30px; } .chooseSquadDiv .stepTwo .playerDtls { width: calc(100% - 191px); } .chooseSquadDiv .stepTwo .player-image { width: 161px; height: 260px; } /*.chooseSquadDiv .stepTwo .buttons{margin:20px 0 0 0}*/ /*.SquadEG .stepTwo .buttons{margin:-30px 0 0 0}*/ .chooseSquadDiv .stepThree .containner { width: calc(100% - 20px); top: 10px } .chooseSquadDiv .stepThree .top-content .playerContainer { padding: 0 } .chooseSquadDiv .stepThree .top-content .team-image { width: 68px; height: 110px } /*.MinByMin .cont {width: 100%;max-width: 930px;} .MinByMin .minImg{float: right;width: 9%;} .MinByMin .teamA {width: 25%;text-align: left;padding-left: 20px;} .MinByMin .teamB {width: 25%;text-align: right;padding-right: 20px;} .MinByMin .teamA a img, .MinByMin .teamB a img{height: 65px;} .MinByMin .text-Match {width: 45%;top: 0;right: 0;display:none} .MinByMin .IconArrow {bottom: 180px;} .MinByMin .ads {width: 20%;margin: 0 auto;}*/ .MinByMin .minImg { width: 60px; height: 60px } .MinByMin .teamA, .MinByMin .teamB { width: calc((100% - 370px) / 2); margin-top: 10px; position: relative } .MinByMin .teamA a img, .MinByMin .teamB a img { height: 40px } .MinByMin .resultDiv { width: 70px; padding: 0 } .MinByMin .resultDiv .matchResult { padding: 0 } .MinByMin .teamA a p, .MinByMin .teamB a p { font-size: 13px; width: calc(100% - 50px); position: absolute; top: 50%; transform: translateY(-50%) } .MinByMin .teamA a p { float: right; text-align: left; right: 0; padding-left: 10px } .MinByMin .teamB a p { float: left; left: 0; padding-right: 10px } .MinByMin .resultDiv .result { margin-top: 6px } .MinByMin .resultDiv .result span { font-size: 26px } .MinByMin .matchInfo { width: 240px; margin-top: 8px; float: left } .MinByMin .text-Match { height: 46px; overflow: hidden; /*margin-top:-45px*/ } .MinByMin .text-Match p { height: 42px } .fanZoneDiv .content-wrap { min-height: 1040px } .fanZone .cnts { width: calc(100% - 20px); margin: 20px 10px } .fanZone .cnts ul li { width: calc((100% - 60.1px) / 4); margin-left: 20px; margin-bottom: 130px; border-bottom-right-radius: 30px; border-bottom-left-radius: 30px; } /*.fanZoneDiv .content-wrap:after {background-size: 150%;} .fanZoneDiv .content-wrap{min-height:750px} .fanZone .cnts{padding:0 10px;width:742px;margin: 20px calc((100% - 742px) / 2);} .fanZone .cnts ul li{width: 112px;margin-left:10px;margin-bottom:130px;border-bottom-right-radius: 16px;border-bottom-left-radius: 16px;} .fanZone .cnts ul li:after {bottom: -14px;height: 14px;}*/ .GroupStanding { width: 100%; margin-left: 0 } .GroupStanding .groupTtlStand { width: 100%; } .GroupStanding .table { width: 100%; } .EntryPoint .cont { width: 100%; max-width: 100% } .EntryPoint .cont .EntryTextCup { width: 30% } .EntryPoint .cont .EntryTextCup span { font-size: 18px; line-height: 1.6; } .EntryPoint .cont .EntryButton { width: 16%; } .EntryIconArrow { right: 1%; } .euroStrip .euroMain .FullWidthBK h1 { width: 250px } .wcOverlay .cntnr { top: 50px; width: 430px } .wcOverlay .wcLogo { top: 20px; right: 20px; width: 90px } .wcOverlay .close { top: 20px; left: 20px } .wcOverlay .ykLogo { margin-bottom: 30px } .wcOverlay .goToBtns { width: 360px; height: 52px; margin: 0 calc((100% - 360px) / 2) 30px; } .wcOverlay .goToBtns a { width: 170px; font-size: 18px; margin-left: 20px } .wcOverlay .mainSponsor p { margin-bottom: 20px } .wcOverlay .mainSponsor .sponsorLogo { width: 120px } .wcOverlay .allSponsors { height: 180px } .wcOverlay .allSponsors .second { top: 70px; width: 484px } .wcOverlay .allSponsors .second a { margin-left: 0px } .wcOverlay .allSponsors .second a img { width: 60%; height: auto } .wcOverlay .allSponsors .third { top: 140px; width: 768px } .wcOverlay .allSponsors .third a { margin-left: 0; width: calc(100% / 9) } .wcOverlay .allSponsors .third a img { width: 70%; height: auto } .wcOverlay .allSponsors .third a:nth-child(1) img { width: 80% } .wcOverlay .allSponsors .third a:nth-child(2) img { width: 50% } .wcOverlay .allSponsors .third a:nth-child(6) img { width: 50% } .wcOverlay .allSponsors .third a:nth-child(9) img { width: 50% } article .details img { margin: 0 calc((100% - 700px) / 2); width: 700px } article .details p iframe, article .details div iframe { margin: 0 calc((100% - 700px) / 2); height: 525px; width: 700px } article .details p iframe#frmPAVast, article .details div iframe#frmPAVast { margin: 0; width: unset; height: unset } iframe#pa_googleAdManager { width: 0 !important; height: 0 !important; } .Team_View .Team-Bk { height: 160px } .Team_View .teamCntnr { width: 120px; margin: 10px; } .Team_View .dtls { width: calc(100% - 160px); } .PlayerView .Team1 { margin-top: 10px } .predPage .pattern10 { width: 100%; margin-left: 0 } .predPage .predictionHolder .matches li img { height: 40px; width: auto; } .predPage .predictionHolder .matches .predDate, .predPage .predictionHolder .matches .predResult { margin-top: 18px } .predPage .predictionHolder ul li.predDate, .predPage .predictionHolder ul li.predJoker { width: 90px; } .predPage .predictionHolder ul li.predTeam { width: calc((100% - 280px) / 2); } .predPage .predictionHolder ul li.predResult { width: 100px } .predPage .predictionHolder .team { font-size: 12px; margin-top: 0 } .quizGame { background: url(../../Images/QuizGame/quizGameBg.png) no-repeat right -154px top #053878; } .quizGame .cnts { width: calc(100% - 447px); } .quizGame .interact_responsive_wrapper { width: 300px !important; margin: 0 calc((100% - 300px) / 2); } .quizGame .whoPlayer { right: 30px; width: 140px; } /*.quizGame{height:550px;background: url(../../Images/QuizGame/quizGameBg.png) no-repeat right -100px top #053878;} .quizGame .cnts{width:calc(100% - 460px)} .quizGame .whoPlayer{right:50px;width: 150px;} .quizGame .tigerLogo{width:80px;height:80px} .quizGame .qgSocialMedia{right: 220px;}*/ .LandingPage .landingTeam { top: 100px; right: 50%; } .LandingPage .landingTeam .TeamOne span, .LandingPage .landingTeam .TeamTwo span { font-size: 12px; } .choose-team .container { background: none; } .choose-team .plancontainer .plandorpdownbottom { float: none; margin: 20px auto; } .choose-team .plancontainer .teamphotoscontainer li { margin-bottom: 10px } .SquadInt .choose-team .plancontainer .image-mini { width: 72px; height: 75px; margin: 0; } .chooseSquadInt { background-color: #000; } .chooseSquadInt .container { background: none; } .chooseSquadInt .LandingPage { margin-bottom: 0px; padding-bottom: 65%; } .teamPageFeatTtl { margin-left: 0; width: 100% } .galleryTitle h2 { display: none } .LandingPage.ahpy .landingTeam { width: 250px; margin-top: 70px; right: auto } .LandingPage.ahpy .landingTeam img { width: 125px } .LandingPage.ahpy .teamsName p { font-size: 42px; line-height: 1.2; } .LiveStreem .desc { width: 40% } .LiveStreem ul li:first-child .desc p { font-size: 1em; } .LiveStreem .desc span { font-size: .6em; top: 40%; } .ESFeaturedArea ul li:first-child .desc span { bottom: 8%; } .ESMultimedia ul li { width: calc((100% - 12.1px) / 2) } .ESMultimedia ul li:first-child { width: 100% } .ESMultimedia ul li:nth-child(3), .ESMultimedia ul li:nth-child(5), .ESMultimedia ul li:last-child { margin-left: 6px } .ESMultimedia ul li:nth-child(7), .ESMultimedia ul li:nth-child(8), .ESMultimedia ul li:last-child { margin-bottom: 6px } .ESMultimedia ul li:nth-child(7), .ESMultimedia ul li:nth-child(8), .ESMultimedia ul li:last-child { margin-bottom: 0 } .ESNews ul li { width: 100%; margin-left: 0; margin-bottom: 10px } .ESNews ul li a .imageCntnr { width: 150px; padding-bottom: calc((150px * 67)/ 100); float: right; } .ESNews ul li .desc { float: right; position: relative; width: calc(100% - 150px); height: auto; display: inline-block; padding: 7px 10px; } .ESNews ul li .desc p { position: relative; padding: 0; height: 27px } .acn .acnCompCont { padding-top: 0; width: 100%; margin: 0 0 30px; } .acn .acnCompCont .containermain { padding: 0 0 51% 0; height: auto } .acn .acnCompCont .containermain .stepOne, .acn .acnCompCont .containermain .stepTwo, .acn .acnCompCont .containermain .stepThree { position: absolute; top: 30px; left: 30px; right: 30px; bottom: 30px; width: calc(100% - 60px); height: calc(100% - 60px) } .acnCompCont .headerPES { margin-bottom: 20px } .acnCompCont .headerPES h1 { font-size: 24px } .acnCompCont .socialiconCont { margin-top: 3px } .acnCompCont .maintitle { font-size: 16px; line-height: 1.6 } .acnCompCont .maintitle span:first-child { font-size: 26px } .acnCompCont .fblogin input { height: 36px !important } .acnCompCont .fblogin .ctrls input:last-of-type { margin-bottom: 0 !important } .acnCompCont .sponsoredBy { margin: 10px calc((100% - 230px) / 2); width: 230px } .acnCompCont .sponsoredBy img.yk { height: 24px; margin-top: 13px } .acnCompCont .sponsoredBy img.ul { height: 50px } .acnCompCont .fblogin h2 { font-size: 14px } .acnCompCont .fblogin a { margin: 10px calc((100% - 180px) / 2); width: 180px; height: 36px; line-height: 2.5; } .acnCompCont .questionDiv p { font-size: 20px; margin: 20px 0; } .acnCompCont .questionDiv li { padding: 4px 18px } .acnCompCont .questionDiv ul { margin: 0 auto 30px } .acnCompCont .questionDiv .nextquest { width: 150px } .acnCompCont .questionDiv .err { margin: 20px 0; font-size: 14px; } .acnCompCont .result { font-size: 20px; margin-top: 80px; } .acnCompCont .result span { font-size: 26px } .timer { right: 0; bottom: 0px; } .acnCompCont .stepTwo .sponsoredBy { left: 0px; bottom: 0px; } .acnCompCont .stepThree .sponsoredBy { left: 0px; bottom: 0px; } .acnCompCont .tshirt { right: 0px } .acnCompCont .tshirt img { width: 150px; } /*.acn_Cup .acnToCup .containermain .sponsor-logo {right: 26%;}*/ .acnToCup .fblogin input { height: 30px !important } .acn_Cup .acnToCup #PersonalData { top: 15px } .acn_Cup .acnToCup .containermain .sponsor-logo { top: 15px } .acnToCup .fblogin a.regBtn { height: 30px; line-height: 2; width: 110px; margin: 5px calc((100% - 110px) / 2) !important; } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 60px } .acnToCup .fblogin h2.continue { display: none } .medal { margin: 0 calc((100% - 300px) / 2) 20px } .medalPage .medal { margin: 0 0 20px 0 } } @media screen and (min-width:320px) and (max-width:670px) { .ShareBK .ShareImg { padding-bottom: 109.54%; width: auto; margin: 0; } } /** Mobile **/ @media screen and (min-width:320px) and (max-width:767px) { .mobStickyBar { display: inline-block } .sticky { height: 50px } .sponsorSticky .container { margin-top: 100px; } footer { display: none } .content-wrap { padding: 0px; min-height: unset } .content { padding: 10px } .leaderboardCnts { min-width: 320px; min-height: 50px; margin: 0 calc((100% - 320px) / 2); } .leaderboardDiv .leaderboard { min-width: 320px; } .leaderboard .adAsync iframe { width: 320px } .openSearch .searchDiv { overflow: hidden } .searchDiv .searchContainer { overflow: scroll; height: 100% } .searchDiv .searchContainer .search { width: 100%; margin: 0 } .searchDiv .searchContainer .search input { height: 40px; font-size: 16px; width: 100%; padding: 0 10px } .searchDiv .searchContainer .search .input::-webkit-input-placeholder { font-size: 16px; } .searchDiv .searchContainer .search a { width: 40px; height: 38px; font-size: 22px } .searchDiv .searchContainer .search a.icon-search:before { line-height: 1.8 } .searchDiv .searchContainer { padding: 30px 10px } .searchDiv .searchContainer .trendsContent { margin-top: 40px } .searchDiv .searchContainer .trendsContent h2 { font-size: 18px } .searchDiv .searchContainer .trendsContent .ttl { height: 54px; } .searchDiv .searchContainer .trendsContent .keywordsDiv .item { padding: 0 24px; font-size: 14px; height: 34px } .ttl { font-size: 16px } .ttl h2, .ttl h3 { line-height: 2.5 } .stats .leagueStats .nextPrev { width: 42px } .stats .leagueStats .nextPrev a { width: 20px } .featuredArea { margin-left: 0; width: 100%; } .featuredArea ul li .secName { right: 130px; top: 2px; font-size: 11px } .featuredArea ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100) } .featuredArea .desc { width: calc(100% - 120px); margin-top: 24px; padding: 0 10px } .featuredArea ul li .desc p { font-size: 12px; height: 54px; overflow: hidden; line-height: 1.5 } .featuredArea ul li:first-child .desc p { font-size: 16px; height: auto; line-height: 1.5 } .featuredArea .desc p:before { width: 36px; height: 16px; font-size: 10px; margin-top: 2px; line-height: 1.6 } .featuredArea ul li:first-child .desc p:before { width: 50px; height: 24px; margin-left: 10px; font-size: 13px; margin-top: 2px; line-height: 1.8 } .ESFeaturedArea { margin-left: 0; width: 100%; } .ESFeaturedArea ul li:first-child { height: 400px; } .ESFeaturedArea .desc { height: 45%; } /*.ESFeaturedArea ul li .secName{right:130px;top:2px;font-size:11px} .ESFeaturedArea ul li a .imageCntnr{width: 120px;padding-bottom: calc((120px * 67)/ 100)} .ESFeaturedArea .desc{width:calc(100% - 120px);margin-top: 24px;padding:0 10px} .ESFeaturedArea ul li .desc p{font-size:12px;height:54px;overflow:hidden;line-height:1.5} .ESFeaturedArea ul li:first-child .desc p{font-size:16px;height:auto;line-height:1.5} .ESFeaturedArea .desc p:before{width:36px;height:16px;font-size:10px;margin-top:2px;line-height:1.6} .ESFeaturedArea ul li:first-child .desc p:before{width:50px;height:24px;margin-left:10px;font-size:13px;margin-top:2px;line-height:1.8}*/ .ESBanner { float: none; margin: 0 auto 20px } .showcaseDiv { margin: 0 calc((100% - 300px)/ 2) 20px; } .interestedArticles { width: 100%; padding: 5px 10px 10px; margin: 0 0 20px } .interestedArticles .cnts li p { font-size: 12px } .entrypoints { width: 300px; height: auto; margin: 0 calc((100% - 300px) / 2) 20px; } .entrypoints .bx-wrapper { margin-left: 0 !important; margin-bottom: 10px !important } .entrypoints .bx-wrapper:nth-child(3n), .entrypoints .bx-wrapper:last-child { margin-bottom: 0 !important } .entryPointSlider { width: 300px; margin-left: 0; margin-bottom: 10px } .entryPointSlider:last-of-type { margin-bottom: 0 } .entrypoints .item { display: inline-block; float: right; width: 100%; height: auto; margin-bottom: 0; margin-left: 0px; } .entrypoints img { width: 100%; height: auto } .entrypoints .bx-wrapper { float: right; width: 100%; margin-left: 0 !important } .entrypoints .bx-wrapper:nth-child(3n), .entrypoints .bx-wrapper:last-child { margin-left: 0 !important } .pattern1 { margin-left: 0; width: 100%; } .pattern1 ul li .secName { right: 130px; top: 2px; font-size: 11px } .pattern1 ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100) } .pattern1 ul li .desc { width: calc(100% - 120px); margin-top: 24px; padding: 0 10px } .pattern1 ul li .desc p { font-size: 12px; height: 54px; overflow: hidden; line-height: 1.5; margin-bottom: 0 } .pattern1 ul li .desc .time { display: none } .pattern1 ul li .desc p:before { width: 40px; height: 18px; margin-left: 6px; font-size: 12px; margin-top: 1px } article .pattern01 { width: 100%; margin-right: 0 } .listing { margin-left: 0; width: 100%; } .listing ul { min-height: unset } .listing ul li .secName { right: 130px; top: 2px; font-size: 11px } .listing ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100) } .listing ul li .desc { width: calc(100% - 120px); margin-top: 24px; padding: 0 10px } .listing ul li .desc p { font-size: 12px; height: 54px; overflow: hidden; line-height: 1.5; margin-bottom: 0 } .listing ul li .desc .time { display: none } .stats { margin-left: 0; width: 100%; height: auto } .movedSC .showcaseDiv { display: inline-block; margin: 0 calc((100% - 300px) / 2) 20px } .stats .item { width: 100%; margin-left: 0; margin-bottom: 10px } .stats .item:last-child { margin-bottom: 0 } .pattern2 ul li { width: calc((100% - 6.1px) / 2); background: #fff } .pattern2 ul li:first-child { width: 100% } .pattern2 .desc { position: relative; background: none; padding-bottom: 10px; } .pattern2 .desc p { position: relative; color: #000; font-size: 12px; height: 67px; overflow: hidden; } .pattern2 ul li:first-child .desc { position: absolute; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0); } .pattern2 ul li:first-child .desc p { position: absolute; color: #fff; font-size: 16px; line-height: 1.5; height: auto; } .pattern2 ul li:nth-child(2), .pattern2 ul li:nth-child(3), .pattern2 ul li:nth-child(5), .pattern2 ul li:nth-child(6), .pattern2 ul li:last-child { margin-left: 6px } .pattern2 ul li:nth-child(7), .pattern2 ul li:nth-child(8), .pattern2 ul li:last-child { margin-bottom: 6px } .pattern2 ul li:nth-child(3), .pattern2 ul li:nth-child(5), .pattern2 ul li:nth-child(7), .pattern2 ul li:last-child { margin-left: 0 } .pattern2 ul li:nth-child(8), .pattern2 ul li:last-child { margin-bottom: 0 } .pattern3 { margin-left: 0; width: 100% } .pattern3 ul li:first-child { width: 100%; margin-left: 0 } .pattern3 ul li { width: 100%; margin-left: 0; background: #fff; margin-bottom: 10px } .pattern3 ul li .secName { right: 130px; top: 8px; background: none; color: #989898; padding: 0; font-size: 12px; line-height: 1.8; } .pattern3 ul li:first-child .secName { right: 0; top: 0; background: rgba(0,0,0,0.7); color: #fff; padding: 0 10px; line-height: 2.4; } .pattern3 ul li a .imageCntnr { width: 120px; padding-bottom: calc((120px * 67)/ 100); float: right; } .pattern3 ul li:first-child a .imageCntnr { width: 100%; padding-bottom: 67%; float: right; margin-left: 0 } .pattern3 ul li .desc { float: right; position: relative; width: calc(100% - 120px); height: auto; display: inline-block; background: #fff; padding: 0 10px; margin-top: 24px } .pattern3 ul li:first-child .desc { width: 100%; margin-top: 10px; } .pattern3 ul li .desc h3 { font-size: 12px; height: 36px; overflow: hidden; line-height: 1.5; margin-bottom: 0; margin-top: 10px } .pattern3 ul li:first-child .desc h3 { font-size: 16px; height: auto } .pattern3 ul li .desc p { color: #000; position: relative; padding: 0; font-size: 12px; height: 54px; overflow: hidden; line-height: 1.5 } .pattern3 ul li .desc .time { display: none } .pattern3 ul li:first-child .desc .time { margin: 30px 0 10px; } .pattern3 ul li:first-child .desc p { color: #000; padding: 0; font-size: 12px; height: auto; line-height: 1.8; margin-bottom: 10px } .pattern3 ul li:nth-child(4), .pattern3 ul li:nth-child(5), .pattern3 ul li:last-child { margin-bottom: 10px } .pattern3 ul li .secName .icon { width: 20px; height: 20px; margin-left: 5px } .pattern3 ul li .secName .icon:before { font-size: 12px !important } .pattern3 ul li:first-child .secName .icon { width: 30px; height: 30px; margin-left: 5px } .pattern3 ul li:first-child .secName .icon:before { font-size: 16px !important } .tourMenu .ttl { margin-bottom: 20px; height: auto } .tourNav { width: 100%; margin: 20px 0 0 } .tourNav a { font-size: 11px; padding: 0 4px; line-height: 1.4 } .tourNav a:first-child { padding-right: 0 } .tourMatches { margin: 0 0 20px; width: 100% } .tourStats.stats .item { width: 100%; margin-left: 0 } .articleHeader .ttl { margin-bottom: 20px; height: auto } .articleHeader .articleInfo .time { font-size: 13px; padding: 11px 0 } .albumTemp .articleHeader .articleInfo { height: 56px } .videoTemp .articleHeader .articleInfo { height: 56px } article .keywordsDiv .item { font-size: 12px; height: auto } article .stats { height: auto; margin-bottom: 0 } .dataKeywords { height: auto } .dataKeywords .item { width: 100%; margin-left: 0; margin-bottom: 10px; padding-bottom: 10px; position: relative } .dataKeywords .item:after { content: ""; position: absolute; bottom: 0; right: 0; width: 100%; height: 1px; background: #e8e8e8 } .dataKeywords .item:nth-child(2) { width: 100% } .dataKeywords .item:last-child { margin-bottom: 0; padding-bottom: 0 } .dataKeywords .item:last-child:after { display: none } .dataKeywords .links { width: 100%; margin-top: 0 } .dataKeywords .more { width: calc((100% - 10px) / 2) } .videoCntnr .twitter-tweet { margin: 0 !important; position: static !important; padding-bottom: 90%; } .relatedArticles { margin-bottom: 20px; padding: 0; background: none } .relatedArticles ul li.item .desc h3 { font-size: 12px; height: auto; line-height: 1.6 } .relatedArticles ul li.item .nextPrev:after { font-size: 11px; margin-bottom: 3px } .paging ul { margin-left: 10px } .paging ul:nth-child(2) { display: none } .paging ul:last-child { margin-left: 0 } article .total { width: 100%; margin-bottom: 20px; } .articleHeader .authoer-img { width: 100px; height: 100px } .articale_Section .articleHeader .articale-info { width: 100%; margin-top: 10px; } .Team_Page .list .Team1 ul li { width: 100%; } .mtchDtlsRslt { background: url(../../Images/matchDtlsBg.jpg) no-repeat center top 0; background-size: cover; } .mtchDtlsRslt li { padding: 20px 10px } .mtchDtlsRslt li .resultDiv { width: 80px; height: 80px } .mtchDtlsRslt li .resultDiv .mainCircle { width: 80px; height: 80px; border: 8px solid #000 } #timer { width: 80px; height: 80px } .pietimer > .slice { width: 80px; height: 80px; clip: rect(0px,80px,80px,40px); } .pietimer > .slice > .pie { border: 8px solid #0277bd !important; width: 80px; height: 80px; clip: rect(0px,40px,80px,0px) } .pietimer.fill > .slice > .pie { width: 80px; height: 80px; } .mtchDtlsRslt li .resultDiv .matchResult { width: 80px; height: 80px; } .mtchDtlsRslt li .resultDiv .result { padding: 0 10px; top: 30px; left: 6px; width: 68px } .mtchDtlsRslt li .resultDiv .result span { font-size: 18px } .mtchDtlsRslt li .resultDiv .countUp { bottom: 16px; left: 8px; width: 64px; color: #7e7e7e; font-size: 14px } .mtchDtlsRslt li .resultDiv p { bottom: -24px; top: auto; font-size: 11px; } .mtchDtlsRslt li .teamA, .mtchDtlsRslt li .teamB { width: calc((100% - 80px) / 2); margin-top: 0 } .mtchDtlsRslt li .teamA { padding-left: 0 } .mtchDtlsRslt li .teamB { padding-right: 0 } .mtchDtlsRslt li .teamA a { float: right } .mtchDtlsRslt li .teamB a { float: left; } .mtchDtlsRslt li .teamA img, .mtchDtlsRslt li .teamB img { height: 50px } .mtchDtlsRslt li .teamA img { margin-right: 0; float: none; } .mtchDtlsRslt li .teamB img { margin-left: 0; float: none; } .mtchDtlsRslt li .teamA p, .mtchDtlsRslt li .teamB p { width: 100%; line-height: 1.4; font-size: 12px; margin-top: 10px; height: 32px; overflow: hidden } .mtchDtlsRslt li .teamA .matchScorer .goal { float: right; margin-right: 0; margin-bottom: 10px; width: 100% } .mtchDtlsRslt li .teamB .matchScorer .goal { float: left; margin-left: 0; margin-bottom: 10px; width: 100% } .mtchDtlsRslt li .matchScorer .icon-goal:before { font-size: 16px; height: 15px; width: 15px; margin-top: 4px; display: none } .mtchDtlsRslt li .matchScorer .goal .time { font-size: 11px } .mtchDtlsRslt li .matchScorer .goal .player { font-size: 9px; color: #fff } .mtchDtlsRslt li .matchDetails { height: auto } .mtchDtlsRslt li .matchDetails .cnts { min-width: 100%; width: 100%; position: relative } .mtchDtlsRslt li .matchDetails .item { width: calc((100% - 20px) / 2); margin-left: 20px; margin-bottom: 10px } .mtchDtlsRslt li .matchDetails .item:nth-child(2n) { margin-left: 0 } .mtchDtlsRslt li .matchDetails .item:nth-child(3), .mtchDtlsRslt li .matchDetails .item:nth-child(4) { margin-bottom: 0 } .mtchDtlsRslt li .matchDetails .item p { font-size: 12px; line-height: 2; } .mtchDtlsRslt li .matchDetails .item:nth-child(1), .mtchDtlsRslt li .matchDetails .item:nth-child(3) { width: 80px } .mtchDtlsRslt li .matchDetails .item:nth-child(2), .mtchDtlsRslt li .matchDetails .item:nth-child(4) { width: calc(100% - 100px) } .mtchDtlsRslt li .teamB .matchScorer .goal .time { float: left; margin-left: 0; margin-right: 5px } .mtchDtlsRslt li .teamB .matchScorer .goal .player { float: left } .matchDetailsTabs .tab { width: 100% } .matchDetailsTabs .tab button { width: calc((100% - 15px) / 4) } .matchDetailsTabs .matchDetailsTtl { width: 100%; margin: 0; height: 96px } .matchDetailsTabs .matchDetailsTtl .team { top: 48px; padding: 14px 10px } .matchDetailsTabs .matchDetailsTtl .team img { height: 22px } .matchDetailsTabs .matchDetailsTtl .team p { font-size: 12px; line-height: 1.8 } .matchDetailsTabs .timeline { width: 100%; margin: 10px 0 0; } .matchDetailsTabs .timeline .cnts { margin: 0 10px 10px; width: calc(100% - 20px) } .matchDetailsTabs .timeline .cnts ul li .goalDtls { padding: 10px } .matchDetailsTabs .timeline .cnts ul li .goalDtls .player { width: 100%; margin-left: 0 } .matchDetailsTabs .timeline .cnts ul li .goalDtls .player .image { width: 54px; height: 54px } .matchDetailsTabs .timeline .cnts ul li .goalDtls .player .image img { width: 54px; height: 54px } .matchDetailsTabs .timeline .cnts ul li .goalDtls .player .name { width: calc(100% - 64px) } .matchDetailsTabs .timeline .cnts ul li .goalDtls .player .name p { font-size: 12px } .matchDetailsTabs .timeline .cnts ul li .goalDtls .player .name a { font-size: 13px } .matchDetailsTabs .timeline .cnts ul li .goalDtls .player .name a:nth-child(2n+1) { font-size: 12px } .matchDetailsTabs .timeline .cnts ul li .goalDtls .team { display: none } .matchDetailsTabs .timeline .cnts ul li .subDtls { padding: 10px } .matchDetailsTabs .timeline .cnts ul li .subDtls .player { width: 100%; margin-left: 0; margin-bottom: 20px } .matchDetailsTabs .timeline .cnts ul li .subDtls .player:nth-child(2) { margin-bottom: 0 } .matchDetailsTabs .timeline .cnts ul li .subDtls .player .image { width: 54px; height: 54px } .matchDetailsTabs .timeline .cnts ul li .subDtls .player .image img { width: 54px; height: 54px } .matchDetailsTabs .timeline .cnts ul li .subDtls .player .name { width: calc(100% - 64px) } .matchDetailsTabs .timeline .cnts ul li .subDtls .player .name p { font-size: 12px } .matchDetailsTabs .timeline .cnts ul li .subDtls .player .name a { font-size: 13px } .matchDetailsTabs .timeline .cnts ul li .subDtls .player .name a:nth-child(2n+1) { font-size: 12px } .matchDetailsTabs .timeline .cnts ul li .subDtls .team { display: none } .matchDetailsTabs .timeline .cnts ul li .videoCntnr iframe, .matchDetailsTabs .timeline .cnts ul li .videoCntnr div, .matchDetailsTabs .timeline .cnts ul li .imageCntnr img { width: 268px !important; height: 201px !important; } .matchDetailsTabs .timeline .cnts ul li .videoCntnr twitterwidget { width: 268px !important; height: auto !important; } .matchDetailsTabs .timeline .cnts ul li .imageCntnr img { height: auto !important } .matchDetailsTabs .timeline.events .cnts ul li p { font-size: 12px } .matchDetailsTabs .timeline.events .cnts ul li.sub p span:after { width: 24px; height: 24px } .matchDetailsTabs .timeline.events .cnts ul li .min:after { width: 24px; height: 24px } .matchDetailsTabs .timeline.events .cnts ul li.left .min:after { left: -40px } .matchDetailsTabs .timeline.events .cnts ul li.left.sub p span:after { right: 7px } .matchDetailsTabs .timeline.events .cnts ul li.left p { padding: 8px 40px 8px 8px; } .matchDetailsTabs .timeline.events .cnts ul li.right p { padding: 8px 8px 8px 40px; } .matchDetailsTabs .timeline.events .cnts ul li.sub p .subOut:before { width: 24px; height: 24px; background-size: 12px; top: 0 } .matchDetailsTabs .timeline.events .cnts ul li.sub p .subIn:before { width: 24px; height: 24px; background-size: 12px; top: 0 } .matchDetailsTabs .timeline.events .cnts ul li.right.sub p span:before { left: -34px; } .matchDetailsTabs .timeline.events .cnts ul li.left.sub p span:before { right: -34px; } .matchDetailsTabs .timeline.events .cnts ul li.goal .min:after { background: url(../../Images/ball.png) center center no-repeat #fff; background-size: 16px; } .matchDetailsTabs .timeline.events .cnts ul li.owngoal .min:after { background: url(../../Images/ownGoal.png) center center no-repeat #fff; background-size: 16px; } .matchDetailsTabs .timeline.events .cnts ul li.subIn .min:after { background: url(../../Images/subIn.png) center center no-repeat #fff; background-size: 16px; } .matchDetailsTabs .timeline.events .cnts ul li.subOut .min:after { background: url(../../Images/subOut.png) center center no-repeat #fff; background-size: 16px; } .matchDetailsTabs .timeline.events .cnts ul li.referee .min:after { background: url(../../Images/referee.png) center center no-repeat #fff; background-size: 22px; width: 34px; height: 34px } .matchDetailsTabs .timeline.events .cnts ul li.yellowCard .min:after { background: url(../../Images/yellowCard.png) center center no-repeat #fff; background-size: 10px; } .matchDetailsTabs .timeline.events .cnts ul li.redCard .min:after { background: url(../../Images/redCard.png) center center no-repeat #fff; background-size: 10px; } .matchDetailsTabs .timeline.events .cnts ul li.sub p .span:before { width: 24px; height: 24px } .matchDetailsTabs .timeline.stats .cnts ul li { padding: 14px 10px 44px; } .matchDetailsTabs .timeline.stats .cnts ul li .desc { font-size: 13px; width: 100% } .matchDetailsTabs .timeline.stats .cnts ul li .value { font-size: 15px; width: 32px; line-height: 1.2 } .matchDetailsTabs .timeline.stats .cnts ul li:first-child { padding: 14px 10px } .matchDetailsTabs .timeline.stats .cnts ul li:first-child .teamA { position: relative; width: calc((100% - 100px) / 2); bottom: auto; right: auto } .matchDetailsTabs .timeline.stats .cnts ul li:first-child .teamB { position: relative; width: calc((100% - 100px) / 2); bottom: auto; left: auto } .matchDetailsTabs .timeline.stats .cnts ul li:first-child .value { font-size: 32px } .matchDetailsTabs .timeline.stats .cnts ul li:first-child .teamA .value { text-align: left } .matchDetailsTabs .timeline.stats .cnts ul li:first-child .teamB .value { text-align: right } .matchDetailsTabs .timeline.stats .cnts ul li:first-child .desc { width: 100px; line-height: 3 } .matchDetailsTabs .timeline.stats .cnts ul li:first-child .value { width: 100% } .matchDetailsTabs .timeline.stats .cnts ul li .teamA .value { margin-right: 5px; text-align: right } .matchDetailsTabs .timeline.stats .cnts ul li .teamB .value { margin-left: 5px; text-align: left } .matchDetailsTabs .timeline.stats .cnts ul li .teamA { width: 50%; position: absolute; right: 0; bottom: 14px } .matchDetailsTabs .timeline.stats .cnts ul li .teamB { width: 50%; position: absolute; left: 0; bottom: 14px } .matchDetailsTabs .timeline.stats .cnts ul li .slider { width: calc(100% - 47px) } .matchDetailsTabs .timeline.squad .cnts { position: relative } .matchDetailsTabs .timeline.squad .formation { position: absolute; left: 50%; transform: translateX(-50%); top: 0; margin-top: 0 } .matchDetailsTabs .timeline.squad .teamA, .matchDetailsTabs .timeline.squad .teamB { width: calc((100% - 20px) / 2); position: relative; padding: 12px 0; margin-top: 450px; } .matchDetailsTabs .timeline.squad .teamA { margin-left: 20px } .matchDetailsTabs .timeline.stats .cnts .prvsMtchRslt .teamA, .matchDetailsTabs .timeline.stats .cnts .prvsMtchRslt .teamB { width: 100%; position: relative; padding: 0 } .matchDetailsTabs .timeline.stats .cnts .prvsMtchRslt .teamA { margin-bottom: 20px } .matchDetailsTabs .timeline.stats .cnts .prvsMtchRslt .teamA { margin-left: 0 } .matchDetailsTabs .timeline.stats .cnts .prvsMtchRslt .item ul li .teamA, .matchDetailsTabs .timeline.stats .cnts .prvsMtchRslt .item ul li .teamB { height: auto; margin-bottom: 0; bottom: 0 } .matchDetailsTabs .timeline.squad .formation .teamA, .matchDetailsTabs .timeline.squad .formation .teamB { margin-top: 0 } .matchDetailsTabs .timeline.squad .teamA .matchSquad h3, .matchDetailsTabs .timeline.squad .teamB .matchSquad h3 { font-size: 13px } .matchDetailsTabs .timeline.squad .teamA .matchSquad ul li .playerNum, .matchDetailsTabs .timeline.squad .teamB .matchSquad ul li .playerNum { font-size: 12px; width: 14px } .matchDetailsTabs .timeline.squad .teamA .matchSquad ul li .playerName, .matchDetailsTabs .timeline.squad .teamB .matchSquad ul li .playerName { font-size: 11px; line-height: 1.6 } .matchDetailsTabs .timeline.squad .cnts ul li { height: 56px } .matchDetailsTabs .timeline.squad .cnts ul li a { position: absolute; top: 10px; transform: none; width: 100% } .matchDetailsTabs .timeline.squad .cnts .teamA ul li a { right: 0 } .matchDetailsTabs .timeline.squad .cnts .teamB ul li a { left: 0 } .matchDetailsTabs .timeline.squad .teamA .matchSquad ul li span { float: right; margin-right: 0; margin-left: 0; position: relative; margin-top: 22px } .matchDetailsTabs .timeline.squad .teamB .matchSquad ul li span { float: left; margin-left: 0; margin-right: 0; position: relative; margin-top: 22px } .matchDetailsTabs .timeline.squad .teamA .matchSquad ul li span:before { float: right } .matchDetailsTabs .timeline.squad .teamB .matchSquad ul li span:before { float: left } .matchDetailsTabs .timeline.squad .teamA .matchSquad ul li span.goal:after { float: right; margin-left: 0 } .matchDetailsTabs .timeline.squad .teamB .matchSquad ul li span.goal:after { float: left; margin-right: 0 } .matchDetailsTabs .timeline.squad .teamA .matchSquad ul li span.VoteBtn { position: absolute; left: 0; bottom: 5px; right: auto } .matchDetailsTabs .timeline.squad .teamB .matchSquad ul li span.VoteBtn { position: absolute; right: 0; bottom: 5px; left: auto } .matchDetailsTabs .timeline.squad .matchSquad ul li span.goal:before { background-size: 16px } .matchDetailsTabs .timeline.squad .matchSquad ul li span.subIn:before { background-size: 12px } .matchDetailsTabs .timeline.squad .matchSquad ul li span.subOut:before { background-size: 12px } .matchDetailsTabs .timeline.squad .matchSquad ul li span.yellowCard:before { background-size: 10px } .matchDetailsTabs .timeline.squad .matchSquad ul li span.redCard:before { background-size: 10px } .matchDetailsTabs .timeline.squad .teamA .coach, .matchDetailsTabs .timeline.squad .teamB .coach { font-size: 12px } .matchesCenter .tab { width: 100%; padding: 0 } .matchesCenter .tab button { width: calc((100% - 12px) / 8); height: 40px; margin-left: 2px } .matchesCenter .tab button:before { width: 30px; height: 30px } .matchesCenter .tab button.active { height: 42px } .matchesCenter .dayDtlsContent { margin-top: 42px } .matchesCenter .tab button p { font-size: 16px; padding: 0 } .matchesCenter .tab button span { font-size: 9px; margin-top: -1px } .matchesCenter .dateDiv { width: 30px; height: 30px; top: 6px } .matchesCenter .dayName { right: 10px; left: auto; transform: none; width: calc(100% - 20px); background: #fff } .matchesCenter .dayName h2 { font-size: 13px; width: 160px } .matchesCenter .dateBtn { width: 30px; height: 30px } .matchesCenter .icon-date:before { font-size: 18px; line-height: 1.6 } .matchesCenter .dayDetailsTtl { height: 90px } .matchesCenter .toursDropdown { width: calc((100% - 25px) / 2); position: absolute; right: 10px; bottom: 10px } .matchesCenter .matchesNow { width: calc((100% - 25px) / 2); position: absolute; left: 10px; bottom: 10px } .matchesCenter .toursMatchesNum { position: absolute; left: 20px; top: 13px; width: auto } .matchesCenter .toursMatchesNum p { font-size: 11px; margin-left: 10px } .matchesCenter .toursMatchesNum span { margin-left: 2px } .matchesCenter .toursMatchesNum p:after { left: -8px; top: -6px } .cd-gallery .matchItem .ttl { font-size: 13px; position: relative; height: 46px; padding-right: 3px; } .cd-gallery .matchItem .ttl img { margin-left: 3px; height: 30px; margin-top: 6px; } .cd-gallery .matchItem .ttl h2 { line-height: 3.4 } .cd-gallery .matchItem .ttl .links { width: 70px; position: absolute; top: 10px; left: 0; margin-top: 0 } .cd-gallery .matchItem .ttl .more { font-size: 11px; height: 24px; line-height: 2.4; margin-left: 0; width: 100%; margin-bottom: 5px; text-align: right } .cd-gallery .matchItem .ttl .more .icon-more:before { line-height: 1.8 } .cd-gallery .matchItem .ttl .more span { margin: 0 } .cd-gallery ul li { position: relative; padding: 10px } .cd-gallery li .week { position: absolute; bottom: 10px; right: 10px; margin-top: 0; font-size: 11px; line-height: 2.2; } .cd-gallery li .tv { position: absolute; bottom: 10px; left: 10px; margin-top: 0; font-size: 11px; max-width: 154px; line-height: 2.2; } .cd-gallery li .icon-tv:before { font-size: 12px; width: 18px; height: 18px; line-height: 1.5; margin-top: 3px } .cd-gallery li .teamA, .cd-gallery li .teamB { width: calc((100% - 60px) / 2); margin-top: 0 } .cd-gallery li .teamA { padding-left: 10px } .cd-gallery li .teamB { padding-right: 10px } .cd-gallery li .teamA img, .cd-gallery li .teamB img { height: 30px } .cd-gallery li .teamA .teamName, .cd-gallery li .teamB .teamName { font-size: 11px; height: 24px } .cd-gallery li .matchScorer .goal:last-child { margin-bottom: 40px } .cd-gallery li .matchScorer .goal .player { font-size: 11px; line-height: 1.6 } .cd-gallery li .resultDiv { width: 60px; height: 90px } .cd-gallery li .resultDiv .result { font-size: 20px } .cd-gallery li .resultDiv .result:first-child:after { left: -3px } .cd-gallery li .resultDiv .matchTime { font-size: 16px } .cd-gallery li .resultDiv .matchStatus .status { width: 60px; margin: 0 } .cd-gallery li .resultDiv .moreDtls { font-size: 10px } .cd-gallery li .resultDiv .moreDtls:before { content: "الملخص"; line-height: 2.4 } .cd-gallery li .matchScorer .icon-goal:before { font-size: 18px; display: none } .cd-gallery li .matchScorer .goal .time { line-height: 1.5; font-size: 12px } .cd-gallery li .teamA .matchScorer .goal .time { margin-right: 5px } .cd-gallery li .teamB .matchScorer .goal .time { margin-left: 5px } .fixtures .cd-gallery li .icon-date:before { font-size: 12px; width: 18px; height: 18px; line-height: 1.5; margin-top: 3px; } .matchesCenter.fixtures .fTab { padding: 0 44px 0 44px; height: 44px } .matchesCenter.fixtures .fTab button { height: 40px } .matchesCenter.fixtures .fTab button p { font-size: 16px } .matchesCenter.fixtures .fTab button.active { height: 45px; } .matchesCenter.fixtures .fTab button:before { width: 30px; height: 30px } .matchesCenter.fixtures.championship .fTab button p { font-size: 9px; width: 30px } .matchesCenter.fixtures .bx-wrapper .bx-controls-direction a { width: 40px; height: 40px; } .matchesCenter.fixtures .bx-wrapper .bx-controls-direction a:before { line-height: 1.5; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) } .matchesCenter.fixtures .bx-wrapper .bx-prev { right: -44px; } .matchesCenter.fixtures .bx-wrapper .bx-next { left: -44px; } .matchesCenter.fixtures .dayDetailsTtl { height: 48px } .matchesCenter.fixtures .bx-wrapper .bx-controls-direction a:before { font-family: "ykIcons" } .matchesCenter.fixtures .bx-wrapper .bx-next:before { content: "j"; font-size: 26px } .matchesCenter.fixtures .bx-wrapper .bx-prev:before { content: "i"; font-size: 26px } .matchesCenter.fixtures .dayDetailsTtl { height: 48px } .matchesCenter.fixtures .dayName { width: auto; transform: translateX(-50%); left: 50%; right: auto } .standing .table .ttlRow .itemTtl { width: 40px; font-size: 12px; line-height: 2.2 } .standing .table .ttlRow .itemTtl:last-child { width: 100px; display: none } .standing .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 90px); } .standing .table .ttlRow .itemTtl:nth-child(3), .standing .table .ttlRow .itemTtl:nth-child(4), .standing .table .ttlRow .itemTtl:nth-child(5), .standing .table .ttlRow .itemTtl:nth-child(6), .standing .table .ttlRow .itemTtl:nth-child(7), .standing .table .ttlRow .itemTtl:nth-child(8) { display: none } .standing .table .wRow { height: 50px } .standing .table .wRow .item { width: 40px; font-size: 14px; line-height: 2.2 } .standing .table .wRow .team img { height: 28px } .standing .table .wRow .item p { font-size: 12px; line-height: 2.5 } .standing .table .wRow .item:last-child { width: 100px; display: none } .standing .table .wRow .item:nth-child(2) { width: calc(100% - 90px); } .standing .table .wRow .item:nth-child(3), .standing .table .wRow .item:nth-child(4), .standing .table .wRow .item:nth-child(5), .standing .table .wRow .item:nth-child(6), .standing .table .wRow .item:nth-child(7), .standing .table .wRow .item:nth-child(8) { display: none } .standing .tableDtls { width: 100%; margin: 0 } .standing .tableDtls .place { width: 100%; margin-left: 0; margin-bottom: 20px; font-size: 12px } .statsStand .ttl { height: auto } .statsStand.goals .ttl h2:after { margin-right: 5px; font-size: 13px; display: block } .statsStand .table .ttlRow .itemTtl { font-size: 10px; line-height: 2.6 } .statsStand .table .ttlRow .itemTtl:last-child { width: 90px; display: inline-block } .statsStand .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 170px); } .statsStand .table .ttlRow .itemTtl:nth-child(3) { display: inline-block } .statsStand .table .wRow .item:last-child { width: 90px; display: inline-block } .statsStand .table .wRow .item:nth-child(2) { width: calc(100% - 170px); padding: 10px 5px } .statsStand .table .wRow .item:nth-child(3) { display: inline-block } .transfersPage .standing.left .table .ttlRow .itemTtl:nth-child(3), .transfersPage .standing.left .table .ttlRow .itemTtl:last-child { display: inline-block } .scorers .cnts li { width: 100%; margin-left: 0; height: 62px; margin-bottom: 10px } .scorers .cnts li .playerImg { width: 60px; height: 60px } .scorers .cnts li .playerDtls { padding: 6px 10px; width: calc(100% - 120px); } .scorers .cnts li .playerDtls .num { font-size: 14px; line-height: 1 } .scorers .cnts li .playerDtls .name { font-size: 12px } .scorers .cnts li .playerDtls .playerFooter .teamInfo p { font-size: 11px } .scorers .cnts li .goalsNum { width: 60px; height: 60px } .scorers .cnts li .goalsNum .num p { font-size: 20px } .scorers .cnts li .goalsNum .num span { font-size: 11px } .scorers .cnts li:first-child { height: 70px } .scorers .cnts li:first-child .playerDtls { padding: 8px 10px; width: calc(100% - 140px); } .scorers .cnts li:first-child .playerDtls .name { font-size: 16px; line-height: 1.4; } .scorers .cnts li:first-child .playerImg { width: 70px; height: 70px } .scorers .cnts li:first-child .goalsNum { width: 70px; height: 70px } .scorers .cnts li:first-child .goalsNum .num p { font-size: 28px } .scorers .cnts li:first-child .goalsNum .num span { font-size: 14px } .scorers .cnts li:first-child .playerDtls .playerFooter { margin-top: 16px } .scorers .cnts li:first-child .playerDtls .playerFooter .teamInfo img { display: none } .scorers .cnts li:first-child .playerDtls .playerFooter .teamInfo p { font-size: 14px; line-height: 1 } .scorers .cnts li:first-child .playerDtls .playerFooter .matches { display: none } .scorers .cnts li:first-child .playerDtls .playerFooter .assist { display: none } .groupTabs .tab { width: 100% } .groupTabs .tab button { width: calc((100% - 6px) / 4); height: 40px; margin-left: 2px; padding: 0 } .groupTabs .tab button p { padding: 0; font-size: 16px } .groupTabs .tab button span { font-size: 9px; margin-top: -1px; } .groupTabs .tab button:before { width: 30px; height: 30px } .groupTabs .tab button.active { height: 42px } .groupTabs .groupContent { margin-top: 42px } .groupTabs .table .ttlRow .itemTtl:nth-child(3), .groupTabs .table .ttlRow .itemTtl:nth-child(4), .groupTabs .table .ttlRow .itemTtl:nth-child(5), .groupTabs .table .ttlRow .itemTtl:nth-child(6), .groupTabs .table .ttlRow .itemTtl:nth-child(7), .groupTabs .table .ttlRow .itemTtl:nth-child(8), .groupTabs .table .ttlRow .itemTtl:nth-child(9) { display: none } .groupTabs .table .ttlRow .itemTtl:nth-child(2) { width: calc(100% - 100px); } .groupTabs .table .wRow .item:nth-child(3), .groupTabs .table .wRow .item:nth-child(4), .groupTabs .table .wRow .item:nth-child(5), .groupTabs .table .wRow .item:nth-child(6), .groupTabs .table .wRow .item:nth-child(7), .groupTabs .table .wRow .item:nth-child(8), .groupTabs .table .wRow .item:nth-child(9) { display: none } .groupTabs .table .wRow .item:nth-child(2) { width: calc(100% - 100px); margin-left: 0 } .tourListing .toursCntnr .tourItem .item { height: auto } .tourListing .toursCntnr .tourItem .item .dtls { width: 100%; margin-bottom: 15px } .tourListing .toursCntnr .tourItem .item .links { float: right } .tourListing .toursCntnr .tourItem .item .more { font-size: 12px; line-height: 3; margin-left: 8px; } .RoadToCup { display: inline-block; position: relative } .RoadToCup:before { content: ""; background: url(../../Images/RoadToCup/Share_Img.jpg) center top no-repeat #fff; background-size: 100%; position: absolute; top: 0; left: 0; width: 100%; height: 100% } .RoadToCup .leftSlide { float: left; width: calc((100% - 20px )/ 2); position: relative; height: 100%; } .RoadToCup .rightSlide { width: calc((100% - 20px)/ 2); float: right; position: relative; height: 100%; margin-left: 20px } .RoadToCup .Cupitem { width: 25%; height: 25px } .RoadToCup .option.icon-Darrow:before { line-height: 2 } .RoadToCup .DP { top: 24px } .RoadToCup .option span, .RoadToCup .option { font-size: 12px } .RoadToCup .DP li { font-size: 13px; } .RoadToCup .Cupitem { width: 90% } .RoadToCup .rightSlide h2, .RoadToCup .rightSlide .Cupitem, .RoadToCup .Winnerright h2, .RoadToCup .Winnerright2 h2, .RoadToCup .onewinner h2, .RoadToCup .Winnerright .Cupitem, .RoadToCup .Winnerright2 .Cupitem, .RoadToCup .onewinner .Cupitem { right: 0; } .RoadToCup .leftSlide h2, .RoadToCup .leftSlide .Cupitem { left: 0; } .RoadToCup .stepOne, .RoadToCup .stepTwo, .RoadToCup .stepThree, .RoadToCup .stepFour, .RoadToCup .stepFive { width: 100%; height: 100%; min-height: 100px; } .RoadToCup .Winnerright { width: calc((100% - 20px)/ 2); float: right; position: relative; height: 100%; margin-left: 20px; } .RoadToCup .Winnerleft { float: left; width: calc((100% - 20px )/ 2); position: relative; height: 100%; } .RoadToCup .Winnerleft h2, .RoadToCup .Winnerleft2 h2, .RoadToCup .onewinner2 h2 { float: left; text-align: left; left: 0 } .RoadToCup .Winnerright .Cupitem, .RoadToCup .Winnerright2 .Cupitem, .RoadToCup .onewinner .Cupitem { top: 3%; } .RoadToCup .Winnerright .winnerB, .RoadToCup .Winnerleft .winnerB, .RoadToCup .Winnerright2 .Cupitem.winnerB, .RoadToCup .Winnerleft2 .Cupitem.winnerB { top: 11% !important } .RoadToCup .Winnerright .winnerC, .RoadToCup .Winnerleft .winnerC { top: 18.8% !important } .RoadToCup .Winnerright .winnerD, .RoadToCup .Winnerleft .winnerD { top: 26.8% !important } .RoadToCup .Winnerleft .Cupitem, .RoadToCup .Winnerleft2 .Cupitem, .RoadToCup .onewinner2 .Cupitem { left: 0; top: 3%; float: left } .RoadToCup .Winnerright2 { width: calc((100% - 20px)/ 2); float: right; position: relative; height: 100%; margin-left: 20px; } .RoadToCup .Winnerleft2 { float: left; width: calc((100% - 20px )/ 2); position: relative; height: 100%; } .RoadToCup .onewinner { width: calc((100% - 20px)/ 2); float: right; position: relative; height: 100%; margin-left: 20px; } .RoadToCup .onewinner2 { float: left; width: calc((100% - 20px )/ 2); position: relative; height: 100%; } .RoadToCup h2 { width: calc(100% - 10px) !important } .RoadToCup .RoadContainer { position: relative; display: inline-block; width: 100%; margin-bottom: 15px; float: right } .RoadToCup .RoadContainer h2 { position: relative !important; top: auto !important; transform: none !important; left: 0 !important } .RoadToCup .leftSlide .RoadContainer h2 { float: left; left: 0; transform: none; font-size: 12px } .RoadToCup .RoadContainer:nth-of-type(1) { margin-top: 60px } .RoadToCup .RoadContainer .Cupitem { position: relative !important; top: auto !important; } .RoadToCup .leftSlide .RoadContainer:nth-of-type(1) { top: 62px; } .RoadToCup .leftSlide .RoadContainer:nth-of-type(2) { top: -62px } .RoadToCup .leftSlide .RoadContainer:nth-of-type(3) { top: 62px } .RoadToCup .leftSlide .RoadContainer:nth-of-type(4) { top: -62px } .RoadToCup .leftSlide .RoadContainer:nth-of-type(5) { top: 62px } .RoadToCup .leftSlide .RoadContainer:nth-of-type(6) { top: -62px } .RoadToCup .leftSlide .RoadContainer:nth-of-type(7) { top: 62px } .RoadToCup .leftSlide .RoadContainer:nth-of-type(8) { top: -62px } .RoadToCup { height: auto; margin-bottom: 0; } .RoadToCup .winnerIN { top: 20px; background-color: #cc0007; } .RoadToCup .winnerIN .DP { top: 24px } .RoadToCup .Cup1, .RoadToCup .Cupitem, .RoadToCup .Cup3, .RoadToCup .Cup4, .RoadToCup .Cup5, .RoadToCup .Cup6, .RoadToCup .Cup7, .RoadToCup .Cup8, .RoadToCup .leftSlide .Cup2, .RoadToCup .leftSlide .Cup1, .RoadToCup .leftSlide .Cup4, .RoadToCup .leftSlide .Cup3, .RoadToCup .leftSlide .Cup6, .RoadToCup .leftSlide .Cup5, .RoadToCup .leftSlide .Cup8, .RoadToCup .leftSlide .Cup7 { transform: none } .RoadToCup .Winnerright .Cupitem, .RoadToCup .Winnerright .winnerB, .RoadToCup .Winnerright .winnerC, .RoadToCup .Winnerright .winnerD, .RoadToCup .Winnerleft .Cupitem, .RoadToCup .Winnerleft .winnerB, .RoadToCup .Winnerleft .winnerC, .RoadToCup .Winnerleft .Cupitem, .RoadToCup .Winnerright2 .Cupitem, .RoadToCup .Winnerright2 .Cupitem.winnerB, .RoadToCup .Winnerleft2 .Cupitem, .RoadToCup .Winnerleft2 .Cupitem.winnerB, .RoadToCup .onewinner .Cupitem, .RoadToCup .onewinner2 .Cupitem { transform: none } .RoadToCup .Winnerleft2 .Cupitem.winnerB { left: 0; } .RoadToCup .rightSlide h2 { text-align: right !important; transform: none; font-size: 12px } .RoadToCup h2.cupText1 { top: 8% !important } .RoadToCup h2.cupText4 { top: 16% !important } .RoadToCup h2.cupText3 { top: 24% !important; } .RoadToCup h2.cupText6 { top: 32% !important; } .RoadToCup h2.cupText5 { top: 40% !important; } .RoadToCup h2.cupText8 { top: 48% !important } .RoadToCup h2.cupText7 { top: 56% !important; } .RoadToCup h2.cupText { top: 0 !important } .RoadToCup .leftSlide h2 { text-align: left !important; } .chooseSquadDiv .csBackground .stepOne .close { display: none } .chooseSquadDiv .csBackground ul.dropdown-menu1 { position: relative; top: -44px; } .chooseSquadDiv.dropdownOpen .csBackground .stepOne { background: none; height: auto; } .chooseSquadDiv.dropdownOpen .csBackground ul li .dropdown-menu1 { background: rgba(0,0,0,0.8); width: 100%; padding: 70px 10px 10px; } .chooseSquadDiv .csBackground ul.dropdown-menu1 li { width: calc(100% - 20px); margin-left: 0 } .chooseSquadDiv .csBackground ul.dropdown-menu1 li:nth-child(5n) { margin-left: 0 } .chooseSquadDiv .csBackground ul.dropdown-menu1 li:nth-last-child(-n+5) { margin-bottom: 30px } .chooseSquadDiv .csBackground ul.dropdown-menu1 li:nth-child(4n) { margin-left: 0 } .chooseSquadDiv .csBackground ul.dropdown-menu1 li:nth-last-child(-n+4) { margin-bottom: 30px } .chooseSquadDiv .csBackground ul.dropdown-menu1 li:last-child { margin-bottom: 0; padding-bottom: 0 } .chooseSquadDiv .csBackground .close { right: auto; top: 10px; left: 10px } .chooseSquadDiv .csBackground { background: url(../../Images/ACN/legendary-Mob.jpg) no-repeat bottom right #baae98; background-size: 100% auto; padding-bottom: 90%; } .chooseSquadDiv .csBackground .stepOne { position: relative; float: right; } .chooseSquadDiv .csBackground ul.dropmenu { padding: 0 10px; width: 100% } .chooseSquadDiv .csBackground ul li.button-dropdown { width: 100%; margin-left: 0; margin-bottom: 10px; } .chooseSquadDiv .stepTwo .player-container { margin: 0; width: 100%; padding-bottom: 40px; } .chooseSquadDiv .stepTwo .details { top: 0; width: calc(100% - 20px); margin: 10px; padding: 10px; height: auto; } .chooseSquadDiv .stepTwo .detailss { width: 100%; } .chooseSquadDiv .stepTwo .detailss h2 { font-size: 14px; } .chooseSquadDiv .stepTwo .detailss p { font-size: 12px; } .chooseSquadDiv .stepTwo .player-image { width: 93px; height: 150px; } .chooseSquadDiv .stepTwo .playerDtls { width: calc(100% - 103px); margin-right: 10px; margin-top: 20px; } .chooseSquadDiv .stepTwo .range { width: 100%; height: 60px; float: right; margin-top: 20px; } .chooseSquadDiv .stepTwo .PlayerAdvice { margin: 30px 0 0 0; margin-right: -92px; width: calc(100% + 92px); } .chooseSquadDiv .progress-bar1 div { height: 60px; width: 60px; } .chooseSquadDiv .progress-bar1 div span { font-size: 25px; line-height: 75px; height: 40px; width: 40px; } .chooseSquadDiv .range .progress-bar1 { float: right; display: inline-block; width: 60px; height: 60px; margin-left: 10px; position: relative } .chooseSquadDiv .range .percent { position: relative; float: right; width: calc(100% - 70px); height: auto; top: auto; left: auto; margin-top: 0; display: inline-block; } .chooseSquadDiv .range .percent p { font-size: 12px; margin-top: 5px; position: relative; left: 0; right: 0; top: 0; transform: none; text-align: right; } .chooseSquadDiv .range .percent p span { font-size: 16px; display: inline-block } .chooseSquadDiv .progress-bar1 .background { border: 10px solid black; border: 6px solid black } .chooseSquadDiv .progress-bar1 .rotate { clip: rect(0 30px 60px 0); border: 6px solid rgb(8, 166, 240) } .chooseSquadDiv .progress-bar1 .left { clip: rect(0 30px 60px 0); width: 60px; height: 60px; border: 6px solid black } .chooseSquadDiv .progress-bar1 .right { clip: rect(0 30px 60px 0); border: 6px solid rgb(8, 166, 240) } .chooseSquadDiv .stepTwo .buttons { margin: 0; position: absolute; width: 100%; left: 0; top: 165px; padding: 0 10px } .chooseSquadDiv .stepTwo .buttons .button { font-size: 12px; line-height: 3; margin-left: 10px; width: calc((100% - 10px) / 2) } .chooseSquadDiv .stepTwo .buttons .button:last-child { margin-left: 0 } .chooseSquadDiv .stepTwo .buttons a.remove.icon-download:before { line-height: 2.6; font-size: 14px; } .chooseSquadDiv .stepTwo .buttons a.miinus.icon-download:before { line-height: 2.6; font-size: 14px; } .chooseSquadDiv .background .choose-team .image-mini { width: 32px; height: 52px; } .chooseSquadDiv .stepTwo { position: relative } .chooseSquadDiv .stepThree { position: relative } .chooseSquadDiv .stepThree .containner { position: relative; margin: 0 10px; left: auto; transform: none; } .chooseSquadDiv .stepThree .top-content .team-image { width: 50px; height: 80px } .chooseSquadDiv .stepThree .bottom-content .leftt { width: 100% } .chooseSquadDiv .stepThree .bottom-content a.fb { width: 260px; margin: 0 calc((100% - 260px) / 2) } .chooseSquadDiv .stepThree .bottom-content h5 { font-size: 15px } .chooseSquadDiv .stepThree .bottom-content p { font-size: 12px } .hidden-xs { display: none !important } .MinByMin .cont { padding: 5px 10px; position: relative } .MinByMin .minImg { width: 40px; height: 40px; margin-left: 10px; } .MinByMin .teamA, .MinByMin .teamB { width: calc((100% - 50px) / 2); margin-top: 3px; padding: 0; } .MinByMin .teamA a img, .MinByMin .teamB a img { height: 34px; max-height: 34px; max-width: 34px; margin: 0 auto; } .MinByMin .resultDiv { width: 50px; padding: 0 } .MinByMin .resultDiv .matchResult { padding: 0 } .MinByMin .teamA a p, .MinByMin .teamB a p { font-size: 12px; line-height: 1.3; width: calc(100% - 34px); } .MinByMin .resultDiv .result { margin-top: 2px } .MinByMin .resultDiv .result span { font-size: 20px } .MinByMin .matchInfo { width: 100%; margin-top: 0 !important } .MinByMin .text-Match { margin-bottom: 0 !important; height: 26px !important; width: calc(100% - 30px); margin-top: 0 } .MinByMin .text-Match p { width: calc(100% - 26px); height: 22px; font-size: 11px; margin-right: 26px; white-space: nowrap; text-overflow: ellipsis; /*width: 24px;*/ } .MinByMin .text-Match span { right: 2px; top: 4px; font-size: 16px } .ACNSponsor .SponsorCont { position: absolute; width: 25px; height: 25px; bottom: 6px; left: 8px; } article .details, article .details p, article .details h2, article .details h4, article .details a, article .details p span, article .details p strong { font-size: 14px !important; line-height: 2 } article .details .showcaseDiv .adTtl { font-size: 11px !important } article .sp-inline .sp-inline-hightlight .heightlight, article .sp-inline .sp-inline-hightlight span { font-size: 14px !important } article .defaultValue { font-size: 14px !important; } span.sp-inline span.sp-inline-hightlight .heightlight { font-size: 14px !important; } .chooseSquadDiv .csBackground .choose-team { position: relative; top: 0 } .Mian-SMS .TextInput { width: 80%; } .Mian-SMS .TextInput .InputGroup { width: 80%; } .Mian-SMS .TextSMS p { width: 100%; font-size: 14px; } .ClipTitles span { font-size: 12px; } .leaderboardSMS { min-width: 300px !important; min-height: 50px !important } .leaderboardSMS img { width: 320px; height: 50px; } .smsContent { margin-top: 15px; } .Mian-SMS { overflow: hidden } .smsContent .ttl { height: 100%; font-size: 14px; } .PalyerStats.tourStats.stats .item { width: 100%; margin-left: 0; } .wcOverlay .cntnr { width: 100%; padding: 0 10px; position: relative; display: inline-block; width: 300px; left: auto; transform: none } .wcOverlay .wcLogo { top: 10px; right: 10px; width: 60px } .wcOverlay .close { top: 10px; left: 10px; font-size: 12px } .wcOverlay .icon-close:before { font-size: 16px } .wcOverlay .ykLogo { margin-bottom: 20px } .wcOverlay .goToBtns { width: 290px; height: 40px; margin: 0 calc((100% - 290px) / 2) 20px; } .wcOverlay .goToBtns a { width: 140px; font-size: 14px; margin-left: 10px } .wcOverlay .mainSponsor p { margin-bottom: 10px; font-size: 14px } .wcOverlay .mainSponsor .sponsorLogo { width: 80px } .wcOverlay .allSponsors { position: absolute; } .wcOverlay .allSponsors .second { top: 60px; width: 320px } .wcOverlay .allSponsors .second a { margin-left: 0; width: calc(100% / 4); } .wcOverlay .allSponsors .second a img { width: 80%; height: auto; } .wcOverlay .allSponsors .second a:nth-child(3) img { width: 64% } .wcOverlay .allSponsors .second a:nth-child(4) img { width: 60% } .wcOverlay .allSponsors .third { top: 110px } .wcOverlay .allSponsors .third a { margin-left: 0; margin-bottom: 40px; height: 20px; position: relative; } .wcOverlay .allSponsors .third a img { width: 70%; height: auto; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .EntryPoint .cont .EntryWorldCup { width: 55%; } .EntryPoint .cont .EntryWorldCup .mainImg { display: none } .EntryPoint .cont .EntryWorldCup .mobImg { display: block; height: 65px; margin-top: 15px } .EntryPoint .cont .EntryButton { width: 35%; display: none } .EntryPoint .EntryAds { width: 30%; margin-top: 28px } .EntryPoint .EntryAds img { height: 32px; margin-right: 5px } .ContactUs .contact_us .C-form .iitem #txtSMS { height: 150px !important; } .ContactUs .contact_us h3 { margin: 10px 0 40px; } .wcHeader { height: 100px; background-size: auto 100% } .wcHeader .wcNavBtn { display: inline-block } .wcHeader .wcNav { display: none } .wcHeader .wcSocialMedia { display: none } .wcHeader h3 { font-size: 15px; margin: 54px 110px 0 0; } .wcHeader h3 span { font-size: 13px; } .wcHeader .wcMenuDiv .wcNav { display: inline-block; top: 20px; width: 150px; left: 50%; transform: translateX(-50%); } .wcHeader .wcNav a { width: 100%; margin-bottom: 8px } .wcHeader .wcMenuDiv .wcSocialMedia { display: inline-block; bottom: 10px; top: auto; left: 50%; transform: translate(-50%); width: 90px; height: 36px } .wcHeader .wcMenuDiv .wcSocialMedia a { width: 36px; height: 36px; font-size: 20px } /*.ACNHeader{height:100px;background-size:auto 100%;background-position: -517px 0;}*/ .wcMenuDiv { background-size: 200px } .ACNHeader .wcNavBtn { display: inline-block } .ACNHeader .wcNav { display: none } .ACNHeader .wcSocialMedia { display: none } .ACNHeader h3 { font-size: 15px; margin: 54px 110px 0 0; } .ACNHeader h3 span { font-size: 13px; } .ACNHeader .wcMenuDiv .wcNav { display: inline-block; top: 30px; width: 150px; left: 50%; transform: translateX(-50%); } .ACNHeader .wcNav a { width: 100%; font-size: 14px; line-height: 2.8 } .ACNHeader .wcMenuDiv .wcSocialMedia { display: inline-block; bottom: 10px; top: auto; left: 50%; transform: translate(-50%); width: 82px; height: 36px } .ACNHeader .wcMenuDiv .wcSocialMedia a { width: 36px; height: 36px; font-size: 20px } .GroupStanding .table .wRow .item:nth-child(2) { padding: 16px 0 } .GroupStanding .table .wRow .team img { height: 26px } .GroupStanding .table .wRow .item p { line-height: 1.8 } .EntryIconArrow { right: 3%; } .euroStrip .EntryPoint { height: 90px; } .euroStrip .euroMain .FullWidthBK { height: 90px } .euroStrip .euroMain .FullWidthBK h1 { width: 100%; top: 10px; transform: none; font-size: 26px; line-height: 1; } .euroStrip .euroMain .FullWidthBK h1:after { font-size: 13px; bottom: -22px; display: none } .euroStrip .euroMain .FullWidthBK h1:before { bottom: -44px; width: 120px; height: 30px; font-size: 13px; right: 0; line-height: 2.3 } article .details img { margin: 0 calc((100% - 300px) / 2); width: 300px } article .details p iframe, article .details div iframe { margin: 0 calc((100% - 300px) / 2); height: 225px; width: 300px } article .details p iframe#frmPAVast, article .details div iframe#frmPAVast { margin: 0; width: unset; height: unset } iframe#pa_googleAdManager { width: 0 !important; height: 0 !important; } article .details p strong span { color: #000 !important; font-size: 16px !important; font-weight: bold } article .details .showcaseDiv iframe { height: 250px } article .details table { width: 100%; margin: 20px auto; border: 1px solid rgb(224, 224, 224); padding: 5px; border-radius: 0.25em; border-collapse: separate; border-spacing: 2px } article .details table thead td { font-weight: bold; background: #000; color: #fff; width: 50% } /*article .details table tbody td{background: rgb(232, 232, 232)}*/ /*article .details table tbody td:nth-of-type(odd){background:#fff}*/ article td { width: 50% !important } article tr:last-child { border-bottom: 0 } .Team_View .Team-Bk .teamBg { width: auto; height: 105% } .Team_View .Team-Bk { height: 120px } .Team_View .teamCntnr { width: 80px; margin: 10px; } .Team_View .dtls { width: calc(100% - 120px); } .Team_View .BK .number h1 { font-size: 14px } .PlayerView .Team1 { margin-top: 10px } .teamProf .Team-Bk .teamBg { width: auto; height: 155% } .teamProf .Team-Bk { height: 80px } .teamProf .teamCntnr { width: 60px; margin: 10px; } .teamProf .teamCntnr { width: 40px; margin: 10px; } .teamProf .dtls { width: calc(100% - 70px); left: 10px } .teamProf .BK .number h1 { font-size: 11px } .teamProf .owner-left .owner-img { width: 50px; height: 50px; margin-left: 10px; display: none } .teamProf .owner-left .owner-DT { max-width: 106px } .teamProf .owner-left .owner-DT p { font-size: 10px } .teamProf .owner-left .owner-DT h2 { font-size: 11px; overflow: hidden; height: 21px } .teamProf .BK .number h1 { line-height: 4.2 } .teamProf .owner-left .owner-DT h2 { line-height: unset } .predPage .predHead { height: 110px; background-size: auto 100% } .predPage #FacebookLogin, .predPage #PersonalData, .predPage #SavedSuccess { width: 100%; padding: 15px } .predPage #FacebookLogin p, .predPage #SavedSuccess p { font-size: 14px } .predPage .predButton-login { margin: 10px auto 0; width: 128px; height: 34px; background-size: auto 100% } .predPage #PersonalData .item .label { width: 100%; margin-left: 0; margin-bottom: 5px; font-size: 12px; line-height: 1.5 } .predPage #PersonalData .item .control { width: 100%; padding: 6px 10px; font-size: 11px; } .predPage .countDown p { font-size: 11px } .predPage .countDown .LNumb { font: bold 14px arial; padding: 0 } .predPage .menu-inner { width: 100%; display: inline-block } .predPage .menu-inner .PersData { float: right; display: inline-block; width: 100%; margin-bottom: 10px } /*.predPage .logOutBtn{position:relative;right:auto;top:auto}*/ .predPage .TourTabs { float: left; display: inline-block; width: 100%; } .predPage .TourTabs a { font-size: 12px; padding: 0 5px } .predPage .matchDetailsTabs .matchDetailsTtl { height: auto } .predPage .predictionHolder .matches li img { height: 30px; width: auto; } .predPage .predictionHolder .matches .predDate, .predPage .predictionHolder .matches .predResult { margin-top: 12px; font-size: 12px } .predPage .predictionHolder ul li.predDate, .predPage .predictionHolder ul li.predJoker { width: 70px; } .predPage .predictionHolder .title li { font-size: 11px } .predPage .predictionHolder ul li.predTeam { width: calc((100% - 150px) / 2); padding: 0 0px; } .predPage .predictionHolder ul li.predResult { width: 80px } .predPage .predictionHolder .team { font-size: 11px; margin-top: 0 } .predPage .predictionHolder ul li.predJoker.jokerMob { display: none } .predPage .predictionHolder .predResult input { width: calc((100% - 10px) / 2) } .predPage .ttl h3 { font-size: 12px; padding: 9px 10px } .predPage .predictionHolder ul li.predJoker { line-height: 1.5; height: 30px; } .predPage .predictionHolder ul li.predJoker input[type="radio"] + label, .predPage .predictionHolder ul li.predJoker input[type="radio"] + label span { margin: 0 } article .videoStrip { width: 300px; height: 25px; margin: 10px calc((100% - 300px) / 2) } .quizGame { background: #053878; height: 520px; } .quizGame .cnts { width: 300px; margin: 0 calc((100% - 300px) / 2) } .quizGame .interact_responsive_wrapper { width: 300px !important; margin: 0 calc((100% - 300px) / 2); } .quizGame .wcLogo { display: none } .quizGame .whoPlayer { display: none } .quizGame .tigerLogo { width: 50px; height: 50px; right: 10px; bottom: auto; top: 10px } /*.quizGame{height:520px;background:#053878} .quizGame .cnts{width:100%;margin-top:60px} .quizGame .wcLogo{display:none} .quizGame .whoPlayer{display:none} .quizGame .tigerLogo {width: 40px;height: 40px;right:10px;bottom:auto;top:10px} .quizGame .qgSocialMedia{top:15px;right: 70px;width:65px;height:30px} .quizGame .qgSocialMedia a{width:30px;height:30px;font-size:16px;line-height:2.2;margin-left:5px}*/ .LandingPage .landingTeam { top: 25px; left: 0; width: 300px; } .LandingPage .landingTeam .TeamOne img, .LandingPage .landingTeam .TeamTwo img { max-width: 50px; height: auto; } .SquadInt .stepTwo .buttons { top: 245px; } .SquadInt .range .percent p { margin-top: 17px; } .chooseSquadDiv .SquadInt .logoSquadInt { bottom: 26px; left: 5px; } .chooseSquadDiv .SquadInt .top-content h4 span { display: block; } .chooseSquadDiv .SquadInt .top-content h4 span img { width: 100px; margin-bottom: 10px; } .chooseSquadDiv .SquadInt .stepThree .top-content .team-image { width: 50px; height: 80px; margin: 0 6px; margin-bottom: 10px; } .chooseSquadDiv .SquadEG .stepTwo .buttons { top: 245px !important; } .EntryPoint:after { width: 360px; height: 60px; top: auto; bottom: 0; background-position: center bottom } .predPage .predwht li { margin: 0; width: 100%; margin-bottom: 20px; } .predPage .predwht li:last-child { margin-bottom: 0 } .chooseSquadDiv .csBackground.SquadInt ul li.button-dropdown { width: calc((100% - 5px) ) !important; } .SquadInt .choose-team .plancontainer .plandorpdownbottom { margin-right: 8px; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 li:last-child { margin-bottom: 30px; padding-bottom: 0; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 .plan532 .RowCD li:last-child { margin-right: 15px; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 .plan532 .RowCMA li:first-child { margin-right: 15px; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 .plan532 .RowCF li:first-child { margin-right: 15px; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 .plan433 .RowCMA li:first-child { margin-right: 15px; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 .plan433 .RowCF li:first-child { margin-right: 15px; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 .plan343 .RowCD li:first-child { margin-right: 10px; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 .plan343 .RowCF li:first-child { margin-right: 10px; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 .plan352 .RowCMA li:last-child { margin-right: 12px; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 .plan352 .RowCF li:first-child { margin-right: 8px; } .chooseSquadDiv .SquadInt ul.dropdown-menu1 .plan442 .RowCF li:first-child { margin-right: 10px; } .lg-outer .sponsorBy p { font-size: 11px } .lg-outer .sponsorBy img { max-width: 50px; max-height: 40px } .mostSeenMedia { width: 100% } .penaltyRes { bottom: -15px } .penaltyRes span { font-size: 12px } .mtchDtlsRslt li .resultDiv .result .penaltyRes { bottom: -16px } .mtchDtlsRslt li .resultDiv .result .penaltyRes span { font-size: 12px } .lastMatch.RelatedMatchstats .item:last-child { height: 86px } .lastMatch.RelatedMatchstats .item ul li { padding: 12px; height: 86px } .lastMatch.RelatedMatchstats .item ul li .teamA, .lastMatch.RelatedMatchstats .item ul li .teamB { width: calc((100% - 90px)/ 2); margin-top: 2px } .lastMatch.RelatedMatchstats .item ul li .teamA img, .lastMatch.RelatedMatchstats .item ul li .teamB img { height: 34px } .lastMatch.RelatedMatchstats .item ul li .teamA .team, .lastMatch.RelatedMatchstats .item ul li .teamB .team { font-size: 12px } .lastMatch.RelatedMatchstats .item ul li .resultDiv { width: 90px; margin-top: 0 } .lastMatch.RelatedMatchstats .item ul li .resultDiv .result { font-size: 24px } .lastMatch.RelatedMatchstats .item ul li .resultDiv .matchStatus .status.details { margin-top: 4px; margin-bottom: 0; font-size: 11px !important; line-height: 2.2 } .gsc-webResult .gsc-result { width: 100% !important; margin-left: 0 !important } a.gs-image { width: 120px !important; padding-bottom: calc((120px * 67)/ 100) !important; float: right !important } .gsc-control-cse .gsc-table-result { float: right !important; width: 120px !important } .gs-webResult.gs-result { display: flex !important } .gsc-thumbnail-inside { width: calc(100% - 120px); float: right !important; } .gsc-control-cse .gs-spelling, .gsc-control-cse .gs-result .gs-title, .gsc-control-cse .gs-result .gs-title * { font-size: 12px !important } .gs-title { height: 68px !important } /*.leaderboardDiv .leaderboard{background: url(../../Images/geminiLBMobile.jpg?ver=1) no-repeat #ddd;}*/ .leaderboardDiv .geminiLB1Ad.showLB1 .bx-wrapper, .leaderboardDiv .geminiLB1Ad.showLB1 .bx-wrapper .bx-viewport { width: 320px; height: 50px !important; overflow: hidden } .leaderboardDiv .geminiLB1Ad.showLB1 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .leaderboardDiv .geminiLB1Ad.showLB1 .bx-wrapper ul { height: 50px; overflow: hidden } .showcaseDiv.secondSC { position: relative; left: 0; margin: 0 calc((100% - 300px)/ 2) 20px } .billboardDiv .geminiBB1Ad.showBB1 .bx-wrapper, .billboardDiv .geminiBB1Ad.showBB1 .bx-wrapper .bx-viewport { width: 320px; height: 50px !important } .billboardDiv .geminiBB1Ad.showBB1 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .billboardDiv .geminiBB1Ad.showBB1 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a iframe { width: 320px; height: 50px; } .leaderboardDiv .geminiLB1Ad.showLB1 .bx-wrapper, .leaderboardDiv .geminiLB1Ad.showLB1 .bx-wrapper .bx-viewport { display: inline-block; width: 320px; height: 50px !important } .leaderboardDiv .geminiLB1Ad.showLB1 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .leaderboardDiv .geminiLB1Ad.showLB1 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a iframe { width: 320px; height: 50px } .leaderboardDiv .geminiLB2Ad.showLB2 .bx-wrapper, .leaderboardDiv .geminiLB2Ad.showLB2 .bx-wrapper .bx-viewport { display: inline-block; width: 320px; height: 50px !important } .leaderboardDiv .geminiLB2Ad.showLB2 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .leaderboardDiv .geminiLB2Ad.showLB2 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a iframe { width: 320px; height: 50px } .leaderboardDiv .geminiLB3Ad.showLB3 .bx-wrapper, .leaderboardDiv .geminiLB3Ad.showLB3 .bx-wrapper .bx-viewport { display: inline-block; width: 320px; height: 50px !important } .leaderboardDiv .geminiLB3Ad.showLB3 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .leaderboardDiv .geminiLB3Ad.showLB3 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a iframe { width: 320px; height: 50px } .leaderboardDiv .geminiLB4Ad.showLB4 .bx-wrapper, .leaderboardDiv .geminiLB4Ad.showLB4 .bx-wrapper .bx-viewport { display: inline-block; width: 320px; height: 50px !important } .leaderboardDiv .geminiLB4Ad.showLB4 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .leaderboardDiv .geminiLB4Ad.showLB4 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a iframe { width: 320px; height: 50px } .leaderboardDiv .geminiLB5Ad.showLB5 .bx-wrapper, .leaderboardDiv .geminiLB5Ad.showLB5 .bx-wrapper .bx-viewport { display: inline-block; width: 320px; height: 50px !important } .leaderboardDiv .geminiLB5Ad.showLB5 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .leaderboardDiv .geminiLB6Ad.showLB6 .bx-wrapper, .leaderboardDiv .geminiLB6Ad.showLB6 .bx-wrapper .bx-viewport { display: inline-block; width: 320px; height: 50px !important } .leaderboardDiv .geminiLB6Ad.showLB6 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .leaderboardDiv .geminiLB7Ad.showLB7 .bx-wrapper, .leaderboardDiv .geminiLB7Ad.showLB7 .bx-wrapper .bx-viewport { display: inline-block; width: 320px; height: 50px !important } .leaderboardDiv .geminiLB7Ad.showLB7 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .leaderboardDiv .geminiLB8Ad.showLB8 .bx-wrapper, .leaderboardDiv .geminiLB8Ad.showLB8 .bx-wrapper .bx-viewport { display: inline-block; width: 320px; height: 50px !important } .leaderboardDiv .geminiLB8Ad.showLB8 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .leaderboardDiv .geminiLB9Ad.showLB9 .bx-wrapper, .leaderboardDiv .geminiLB9Ad.showLB9 .bx-wrapper .bx-viewport { display: inline-block; width: 320px; height: 50px !important } .leaderboardDiv .geminiLB9Ad.showLB9 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .leaderboardDiv .geminiLB10Ad.showLB10 .bx-wrapper, .leaderboardDiv .geminiLB10Ad.showLB10 .bx-wrapper .bx-viewport { display: inline-block; width: 320px; height: 50px !important } .leaderboardDiv .geminiLB10Ad.showLB10 .bx-wrapper .bx-viewport .LeaderBoardHCSlider li a img { max-width: 320px !important } .showOverlayMob .leaderboardCnts { overflow: visible; height: 66px; background: #fff } .showOverlayMob .leaderboardDiv .leaderboard.lb1 { position: absolute; left: 0; width: 100%; background: none; } .showOverlayMob .leaderboardDiv .lb1 iframe { width: 100%; height: 100%; display: inline-block; float: right; border: 0; left: 0; margin: 0 auto; margin-left: 0; overflow: visible; position: fixed; bottom: 0; visibility: visible; z-index: 9999; } .hideOverlayMob .leaderboardDiv .lb1 iframe { width: 320px; height: 50px !important; position: relative !important; top: 0; left: 0; margin: 0 !important; } .hideOverlayMob .leaderboardDiv .leaderboard.lb1 { width: 320px; left: auto } .showOverlayMob .leaderboardDiv .geminiLB1Ad.showLB1 { display: none !important } .showOverlayMob.cafLandingPage .lb1 .adAsync { padding-bottom: 0 !important; height: 100% !important } .showOverlayMob.cafLandingPage .sponsorBG { display: none } .showOverlayChipsy .leaderboardCnts { overflow: visible; height: 66px; background: #fff } .showOverlayChipsy .leaderboardDiv .leaderboard.lb1 { position: absolute; left: 0; width: 100%; background: none; } .showOverlayChipsy .leaderboardDiv .lb1 iframe { width: 100%; height: 100%; display: inline-block; float: right; border: 0; left: 0; margin: 0 auto; margin-left: 0; overflow: visible; position: fixed; bottom: 0; visibility: visible; z-index: 9999; } .hideOverlayChipsy .leaderboardDiv .lb1 iframe { width: 320px; height: 50px !important; position: relative !important; top: 0; left: 0; margin: 0 !important; } .hideOverlayChipsy.ykbbl .leaderboardDiv .lb1 iframe { height: 100px !important } .hideOverlayChipsy .leaderboardDiv .leaderboard.lb1 { width: 320px; left: auto } .showOverlayChipsy .leaderboardDiv .geminiLB1Ad.showLB1 { display: none !important } .showOverlayChipsy.cafLandingPage .lb1 .adAsync { padding-bottom: 0 !important; height: 100% !important } .showOverlayChipsy.cafLandingPage .sponsorBG { display: none } .showOverlayChipsy .sponsorDuplicate { display: none } .hideOverlayChipsy .sponsorDuplicate { display: inline-block } .sticky iframe { margin: 0 calc((100% - 320px) / 2) } .lg-toolbar .lg-icon { width: 40px; font-size: 20px } #lg-counter { padding-left: 20px; font-size: 18px } .galleryTitle .galleryMasLogo { background-size: 103px 17px; width: 117px } .lg-outer #lg-share:after { font-size: 18px } .lg-sub-html p { font-size: 13px; } .lg-outer .lg-toogle-thumb { width: 20px; right: 10px } .repeatDiv { width: 300px; margin-left: -150px; padding: 45px 0 } .repeatDiv .nextAlbum h3 { font-size: 14px; margin-bottom: 0 } .LandingPage.ahpy { padding-bottom: 0; background-image: url(../../Images/AhlyPyramids/AhlyVSPyramidsBG.jpg); background-color: #000; min-height: 520px; background-size: auto 100%; background-position: center } .LandingPage.ahpy .landingTeam { width: 250px; margin-top: 50px; right: auto; top: 50% !important } .LandingPage.ahpy .landingTeam img { width: 125px; max-width: unset } .LandingPage.ahpy .teamsName p { font-size: 42px; line-height: 1.2; } .chooseSquadDiv .csBackground.squadAhpy { background-size: auto 50%; background-position: left top } .LiveStreem .desc { width: 45% } .LiveStreem ul li:first-child .desc p { font-size: .6em; padding: 0 10px 5px; } .LiveStreem .desc span { font-size: .5em; padding: 0 10px; line-height: 1.5; } .LiveStreem .desc .container-desc { top: 5%; } .LiveStreem ul li .secName .icon { width: 70px; height: 70px; } .ESMultimedia ul li { width: calc((100% - 6.1px) / 2); background: #fff } .ESMultimedia ul li:first-child { width: 100% } .ESMultimedia .desc { position: relative; background: none; } .ESMultimedia .desc p { position: relative; color: #000; font-size: 12px; height: 67px; overflow: hidden; } .ESMultimedia ul li:first-child .desc { position: absolute; background: linear-gradient(270deg,rgba(0,0,0,0),#000000); background: -webkit-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -o-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -moz-linear-gradient(270deg,rgba(0,0,0,0),#000); background: -ms-linear-gradient(270deg,rgba(0,0,0,0),#000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#004c4c4c',endColorstr='#ff1a3b00',GradientType=0); } .ESMultimedia ul li:first-child .desc p { position: absolute; color: #fff; font-size: 16px; line-height: 1.5; height: auto; } .ESMultimedia ul li:nth-child(2), .ESMultimedia ul li:nth-child(3), .ESMultimedia ul li:nth-child(5), .ESMultimedia ul li:nth-child(6), .ESMultimedia ul li:last-child { margin-left: 6px } .ESMultimedia ul li:nth-child(7), .ESMultimedia ul li:nth-child(8), .ESMultimedia ul li:last-child { margin-bottom: 6px } .ESMultimedia ul li:nth-child(3), .ESMultimedia ul li:nth-child(5), .ESMultimedia ul li:nth-child(7), .ESMultimedia ul li:last-child { margin-left: 0 } .ESMultimedia ul li:nth-child(8), .ESMultimedia ul li:last-child { margin-bottom: 0 } .ESHeader { padding-bottom: 35%; } .ESbtn a { top: 80px; width: 30%; padding: 0 } .leaderFullWeb { min-width: 320px; min-height: 50px } .leaderFullWeb .leaderboard { min-width: 320px; } .leaderFullWeb .img-fluid { max-width: 100%; height: auto; } /*.showOTP{position:fixed} .hideOTP{position:relative}*/ .showOTP .billboardDiv { overflow: visible; height: 66px } .showOTP .billboardDiv .billboard { position: absolute; left: 0; width: 100%; background: none; } .showOTP .billboardDiv .bb1 iframe { width: 100%; height: 100%; display: inline-block; float: right; border: 0; left: 0; margin: 0 auto; overflow: visible; position: fixed; top: 0; visibility: visible; z-index: 9999 } .showOTP .billboardDiv .billboardCnts { min-width: 320px } .hideOTP .billboardDiv .bb1 iframe { width: 320px !important; height: 50px !important; left: auto !important; position: relative !important; } .hideOTP .billboardDiv .billboard { width: 320px; left: auto } .showOTP1x1 .otp1x1 { overflow: visible; height: 100%; width: 100% } .showOTP1x1 .otp1x1 iframe { width: 100%; height: 100%; display: inline-block; float: right; border: 0; left: 0; margin: 0 auto; overflow: visible; position: fixed; top: 0; visibility: visible; opacity: 1; z-index: 9999 } .hideOTP1x1 .otp1x1 iframe { opacity: 0; visibility: hidden } .showOTP .leaderboardDiv { overflow: visible; height: 66px } .showOTP .leaderboardDiv .leaderboard { position: absolute; left: 0; width: 100%; background: none; } .showOTP .leaderboardDiv .lb1 iframe { width: 100%; height: 100%; display: inline-block; float: right; border: 0; left: 0; margin: 0 auto; overflow: visible; position: fixed; top: 0; visibility: visible; z-index: 9999 } .showOTP .leaderboardDiv .leaderboardCnts { min-width: 320px } .hideOTP .leaderboardDiv .lb1 iframe { width: 320px !important; height: 50px !important; left: auto !important; position: relative !important; } .hideOTP article .details .leaderboardDiv iframe { height: 250px !important; width: 300px !important } .hideOTP .leaderboardDiv .leaderboard { width: 320px; left: auto } .showOTPBB .leaderboardDiv { overflow: visible; height: 116px } .showOTPBB .leaderboardDiv .leaderboard { position: absolute; left: 0; width: 100%; background: none; } .showOTPBB .leaderboardDiv .lb1 iframe { width: 100%; height: 100%; display: inline-block; float: right; border: 0; left: 0; margin: 0 auto; overflow: visible; position: fixed; top: 0; visibility: visible; z-index: 9999 } .showOTPBB .leaderboardDiv .leaderboardCnts { min-width: 320px } .hideOTPBB .leaderboardDiv .lb1 iframe { width: 320px !important; height: 100px !important; left: auto !important; position: relative !important; } .hideOTPBB article .details .leaderboardDiv iframe { height: 250px !important; width: 300px !important } .hideOTPBB .leaderboardDiv .leaderboard { width: 320px; left: auto } .showOTP .showcaseDiv .showcase { position: relative } .showOTP .showcaseDiv .sc1 iframe { position: relative; height: 250px; z-index: 9; top: 0; left: 0; margin: 0 !important } .showOTP article .details .leaderboardDiv iframe { position: relative } .showOTP .billboardDiv .geminiBB1Ad.showBB1, .showOTP .billboardDiv .geminiBB2Ad.showBB2, .showOTP .billboardDiv .geminiBB3Ad.showBB3, .showOTP .billboardDiv .geminiBB4Ad.showBB4, .showOTP .billboardDiv .geminiBB5Ad.showBB5, .showOTP .billboardDiv .geminiBB6Ad.showBB6 { display: none !important } .showOTP .leaderboardDiv .geminiLB1Ad.showLB1, .showOTP .leaderboardDiv .geminiLB2Ad.showLB2, .showOTP .leaderboardDiv .geminiLB3Ad.showLB3, .showOTP .leaderboardDiv .geminiLB4Ad.showLB4, .showOTP .leaderboardDiv .geminiLB5Ad.showLB5, .showOTP .leaderboardDiv .geminiLB6Ad.showLB6 { display: none !important } .showOTP .showcaseDiv .geminiSC1Ad.showSC1, .showOTP .showcaseDiv .geminiSC2Ad.showSC2, .showOTP .showcaseDiv .geminiSC3Ad.showSC3, .showOTP .showcaseDiv .geminiSC4Ad.showSC4, .showOTP .showcaseDiv .geminiSC5Ad.showSC5, .showOTP .showcaseDiv .geminiSC6Ad.showSC6 { display: none !important } .hideOTP .billboardDiv .geminiBB1Ad.showBB1, .hideOTP .billboardDiv .geminiBB2Ad.showBB2, .hideOTP .billboardDiv .geminiBB3Ad.showBB3, .hideOTP .billboardDiv .geminiBB4Ad.showBB4, .hideOTP .billboardDiv .geminiBB5Ad.showBB5, .hideOTP .billboardDiv .geminiBB6Ad.showBB6 { display: flex !important } .hideOTP .leaderboardDiv .geminiLB1Ad.showLB1, .hideOTP .leaderboardDiv .geminiLB2Ad.showLB2, .hideOTP .leaderboardDiv .geminiLB3Ad.showLB3, .hideOTP .leaderboardDiv .geminiLB4Ad.showLB4, .hideOTP .leaderboardDiv .geminiLB5Ad.showLB5, .hideOTP .leaderboardDiv .geminiLB6Ad.showLB6 { display: flex !important } .hideOTP .showcaseDiv .geminiSC1Ad.showSC1, .hideOTP .showcaseDiv .geminiSC2Ad.showSC2, .hideOTP .showcaseDiv .geminiSC3Ad.showSC3, .hideOTP .showcaseDiv .geminiSC4Ad.showSC4, .hideOTP .showcaseDiv .geminiSC5Ad.showSC5, .hideOTP .showcaseDiv .geminiSC6Ad.showSC6 { display: flex !important } /** Mobile **/ .showOTP .cd-main-content, .showOTPBB .cd-main-content { position: relative; z-index: 3; } .showHeader .cd-main-content { position: relative; z-index: auto } .showHeader.showSecondOverlay .cd-main-content { position: relative; z-index: 4 } .showOverlayMob .cd-main-content { z-index: 3 } .showOverlayChipsy .cd-main-content { z-index: 3 } .hideOTP .cd-main-content, .hideOTPBB .cd-main-content { z-index: 2 !important; } .showOTP .justPremiumDiv, .showOTPBB .justPremiumDiv { display: none !important } .hideOTP .justPremiumDiv, .hideOTPBB .justPremiumDiv { display: block !important } .showOTP .sponsorDiv, .showOTPBB .sponsorDiv { display: none !important } .hideOTP .sponsorDiv, .hideOTPBB .sponsorDiv { display: block !important } .showOTP .morphSearchDiv, .showOTPBB .morphSearchDiv { display: none } .hideOTP .morphSearchDiv, .hideOTPBB .morphSearchDiv { display: block !important } .showOTP .sticky, .showOTPBB .sticky { display: none } .hideOTP .sticky, .hideOTPBB .sticky { display: block !important } .showOTP .spnsrSticky, .showOTPBB .spnsrSticky { display: none } .hideOTP .spnsrSticky, .hideOTPBB .spnsrSticky { display: block !important } .showOTP .lstNwsNtfy, .showOTPBB .lstNwsNtfy { display: none !important } .hideOTP .lstNwsNtfy, .hideOTPBB .lstNwsNtfy { display: block !important } .showOTP .articleSocialMedia, .showOTPBB .articleSocialMedia { display: none !important } .hideOTP .articleSocialMedia, .hideOTPBB .articleSocialMedia { display: block !important } .showOTP .sponsorDuplicate, .showOTPBB .sponsorDuplicate { display: none !important } .hideOTP .sponsorDuplicate, .hideOTPBB .sponsorDuplicate { display: block !important } .showHeader .sponsorDuplicate { display: block !important } .showHeader.showSecondOverlay .sponsorDuplicate { display: none !important } .showHeader.showSecondOverlay.hideOTP .sponsorDuplicate { display: block !important } .showOTP .MinByMin, .showOTPBB .MinByMin { display: none !important } .hideOTP .MinByMin, .hideOTPBB .MinByMin { display: block !important } body.showOverlayMob { position: fixed } body.showOverlayChipsy { position: fixed } /** Expandable Leaderboard **/ .ExpandLB .leaderboardDiv { overflow: visible; width: 320px; margin: 0 calc((100% - 320px) / 2) 20px; height: 66px; background: 0 0; transition: all 0.8s ease-in-out 0s; -webkit-transition: all 0.8s ease-in-out 0s; -moz-transition: all 0.8s ease-in-out 0s; -ms-transition: all 0.8s ease-in-out 0s; -o-transition: all 0.8s ease-in-out 0s; } .ExpandLB.showExpand .leaderboardDiv { height: 336px } .ExpandLB .leaderboardDiv .leaderboardCnts { min-width: 100% } .ExpandLB .leaderboardDiv .leaderboard.lb1 { position: relative; left: 0; width: 100%; background: none; height: 50px; z-index: 99; transition: all 0.8s ease-in-out 0s; -webkit-transition: all 0.8s ease-in-out 0s; -moz-transition: all 0.8s ease-in-out 0s; -ms-transition: all 0.8s ease-in-out 0s; -o-transition: all 0.8s ease-in-out 0s; } .ExpandLB.showExpand .leaderboardDiv .leaderboard.lb1 { height: 320px } .ExpandLB .leaderboardDiv .leaderboard.lb1 iframe { width: 320px; height: 50px; display: inline-block; float: right; border: 0; left: 0px; margin: 0 auto; overflow: visible; position: absolute; top: 0; visibility: visible; z-index: 9999; transition: all 0.8s ease-in-out 0s; -webkit-transition: all 0.8s ease-in-out 0s; -moz-transition: all 0.8s ease-in-out 0s; -ms-transition: all 0.8s ease-in-out 0s; -o-transition: all 0.8s ease-in-out 0s; } .ExpandLB.showExpand .leaderboardDiv .leaderboard.lb1 iframe { width: 320px; height: 320px; z-index: 99999 } .ExpandLB .leaderboardDiv .geminiLB1Ad.showLB1 { display: none !important } /** Expandable Billboard **/ .ExpandLB .billboardDiv { overflow: visible; width: 320px; margin: 0 calc((100% - 320px) / 2) 20px; height: 66px; background: 0 0; transition: all 0.8s ease-in-out 0s; -webkit-transition: all 0.8s ease-in-out 0s; -moz-transition: all 0.8s ease-in-out 0s; -ms-transition: all 0.8s ease-in-out 0s; -o-transition: all 0.8s ease-in-out 0s; } .ExpandLB.showExpand .billboardDiv { height: 336px } .ExpandLB .billboardDiv .billboardCnts { min-width: 100% } .ExpandLB .billboardDiv .billboard.bb1 { position: relative; left: 0; width: 100%; background: none; height: 50px; z-index: 99; transition: all 0.8s ease-in-out 0s; -webkit-transition: all 0.8s ease-in-out 0s; -moz-transition: all 0.8s ease-in-out 0s; -ms-transition: all 0.8s ease-in-out 0s; -o-transition: all 0.8s ease-in-out 0s; } .ExpandLB.showExpand .billboardDiv .billboard.bb1 { height: 320px } .ExpandLB .billboardDiv .billboard.bb1 iframe { width: 320px; height: 50px; display: inline-block; float: right; border: 0; left: 0px; margin: 0 auto; overflow: visible; position: absolute; top: 0; visibility: visible; z-index: 9999; transition: all 0.8s ease-in-out 0s; -webkit-transition: all 0.8s ease-in-out 0s; -moz-transition: all 0.8s ease-in-out 0s; -ms-transition: all 0.8s ease-in-out 0s; -o-transition: all 0.8s ease-in-out 0s; } .ExpandLB.showExpand .billboardDiv .billboard.bb1 iframe { width: 320px; height: 320px; z-index: 99999 } .ExpandLB .billboardDiv .geminiBB1Ad.showBB1 { display: none !important } .ACN19 .TourTabs li { /*margin-left: 20px;*/ left: -18px; width: auto; margin-bottom: 8px } .ACNStanding .groups .table:after { bottom: 25px; } .modal { width: 90%; } .content-popup .FbLogin { width: 90%; position: static; margin: 100px auto; } .ACNentrypoints { margin: 0 auto 20px; float: none; } .ACN19 .predHead { background: url(../../Images/ACN/prediction-mob.jpg?ref=0.2) no-repeat center center; background-size: auto 100%; } /*.leftSpeakol {width:100%} .acn_Cup .acnToCup .containermain {background: url(../../Images/ACN/Road-Mob.jpg?ver=0.2) no-repeat;background-size: 100% 100%;padding: 10px;}*/ .acn_Cup .content { padding: 0 } .acnToCup { padding-top: 0 } .acnToCup .headerPES { padding: 10px; margin-bottom: 10px } .acnToCup .socialiconCont { margin-top: 0 } .acn_Cup .acnToCup .fblogin { width: 100% } .acnToCup .headerPES h1 { font-size: 20px; } .acnCompCont .socialiconCont { margin-top: 3px; } .acn_Cup .acnToCup #PersonalData { top: 10px; } .acnToCup .fblogin input { width: 300px; margin: 0 calc((100% - 300px) / 2); } /*.acn_Cup .acnToCup .containermain .sponsor-logo {display:none}*/ .acn .acnCompCont { padding-top: 0; width: 100%; margin: 0 0 30px; } .acn .acnCompCont .containermain { padding: 0 0 157% 0; height: auto; background: url(../../Images/FrameBlackMob.png) no-repeat; background-size: 100% } .acn .acnCompCont .containermain .stepOne, .acn .acnCompCont .containermain .stepTwo, .acn .acnCompCont .containermain .stepThree { position: absolute; top: 30px; left: 20px; right: 20px; bottom: 30px; width: calc(100% - 40px); height: calc(100% - 60px) } .acnCompCont .headerPES { margin-bottom: 0; padding: 5px 10px } .acnCompCont .headerPES h1 { font-size: 20px } .acnCompCont .socialiconCont { margin-top: 3px } .acnCompCont .maintitle { font-size: 14px; line-height: 1.7 } .acnCompCont .maintitle span:first-child { font-size: 22px } .acnCompCont .fblogin input { height: 36px !important; width: 100%; margin: 0 0 10px } .acnCompCont .fblogin .ctrls input:last-of-type { margin-bottom: 0 !important } .acnCompCont .sponsoredBy { margin: 20px calc((100% - 230px) / 2); width: 230px } .acnCompCont .sponsoredBy img.yk { height: 24px; margin-top: 13px } .acnCompCont .sponsoredBy img.ul { height: 50px } .acnCompCont .fblogin h2 { font-size: 14px } .acnCompCont .fblogin a { margin: 10px 0; width: 100%; height: 36px; line-height: 2.5; } .acnCompCont .fblogin #FacebookSignIn { margin: 10px calc((100% - 180px) / 2); width: 180px } .acnCompCont .questionDiv p { font-size: 16px; margin: 10px 0 20px; } .acnCompCont .questionDiv li { padding: 4px 0; width: 100%; margin-bottom: 10px; margin-left: 0 } .acnCompCont .questionDiv li:last-child { margin-bottom: 0 } .acnCompCont .questionDiv li a { text-align: center; font-size: 14px } .acnCompCont .questionDiv ul { margin: 0 auto; width: 100% } .acnCompCont .questionDiv .nextquest { width: 100%; height: 36px; line-height: 2.4; margin-top: 100px; display: inline-block } .acnCompCont .questionDiv .err { margin: 5px 0; font-size: 14px; } .timer { left: 0; right: auto; bottom: 60px; height: 36px; font-size: 22px; line-height: 1.6; width: 100%; } .acnCompCont .stepTwo .sponsoredBy { left: 50%; transform: translateX(-50%); bottom: 0 } .acnCompCont .stepThree .sponsoredBy { left: 50%; transform: translateX(-50%); bottom: 0 } .acnCompCont .result { font-size: 18px; margin-top: 100px; } .acnCompCont .result span { font-size: 24px } .acnCompCont .tshirt { position: absolute; left: 50%; bottom: -10px; transform: none; transform: translateX(-50%); top: auto; right: 0 } .acnCompCont .tshirt img { width: 66px; height: auto } .acnCompCont a.back { width: 100%; margin: 30px 0; font-size: 14px } .ACNDiv .pattern1 .ttl .more, .ACNDiv .pattern2 .ttl .more, .ACNDiv .ttl .more { top: 3px; left: 15px; width: 50px; height: 34px; line-height: 2.6; } .ACNDiv .pattern1 .more::before, .ACNDiv .pattern2 .more::before, .ACNStanding .ACNBtnMore::before { border-bottom: 17px solid transparent; border-top: 17px solid transparent; border-left: 10px solid #e63023; top: 0; right: -10px; } .ACNStanding .ACNBtnMore::before { border-left: 10px solid #f2f2f2 } .ACNDiv .pattern1 .more::after, .ACNDiv .pattern2 .more::after, .ACNStanding .ACNBtnMore::after { border-bottom: 17px solid transparent; border-top: 17px solid transparent; border-right: 10px solid #e63023; top: 0; left: -10px; } .ACNStanding .ACNBtnMore::after { border-right: 10px solid #f2f2f2 } .ACNStanding .statsSponsor { left: 82px } .ManofMatch { width: 100%; height: 150px; max-height: 300px; top: 0; left: 0; transform: none; display: inline-block; position: relative } .ManofMatch .man-matchClip { height: 100px } .ManofMatch .man-matchClip .man-matchImage { width: 80px; height: 80px } .ManofMatch .man-matchClip .man-matchImage img { height: 120px } .ManofMatch .man-matchClip .manOfCont { width: calc(100% - 90px); } .ManofMatch .man-matchClip .manOfCont .man-matchTxt { line-height: 2 } .ManofMatch .man-matchClip .manOfCont .man-matchName { width: 100%; display: inline-block; line-height: 1.8 } .ManofMatch .man-matchTxt { font-size: 11px; line-height: 2px } .ManofMatch .man-matchName { font-size: 14px } .ManofMatch .man-matchClip .manOfCont .voting { margin-top: 5px } .ManofMatch .matchDetailsTabs .timeline.squad .matchSquad ul li span { margin-top: -8px } .man-match { left: 50%; transform: translateX(-50%) } .ClipTitles .TitleTxt { margin: 0 !important; font-size: 14px !important; line-height: 1.8 } .acn_Cup .acnToCup .containermain { padding-bottom: 100%; background: url(../../Images/ACN/Playstation.png?ver=0.4) no-repeat 50% bottom; background-color: #024687; background-size: 270px auto; } .acn_Cup .acnToCup .containermain .sponsor-logo { position: relative; top: auto; right: auto; margin-top: 15px; left: auto; transform: none; } .acn_Cup .acnToCup .stepOne { bottom: auto; height: auto; left: auto; position: relative; margin-top: 50px; transform: none; } .acn_Cup .acnToCup .containermain .sponsor-logo p { font-size: 18px } .acn_Cup .acnToCup .containermain .sponsor-logo p.winPlayStation { font-size: 20px } .acn_Cup .acnToCup .containermain .sponsor-logo img { width: 55px } .acn_Cup .acnToCup .containermain .sponsor-logo span { font-size: 14px; margin: 10px 0 } .acn_Cup .acnToCup .contentCnts { height: auto; width: 100%; position: relative; } .downloadApp { display: inline-block; width: 100%; height: 50px; position: relative; background: #f2f2f2; z-index: 5; padding: 13px 10px } .downloadApp p { float: right; display: inline-block; font-family: droidLight, Arial; font-size: 11px; color: #000; line-height: 2.2 } .downloadApp a { display: inline-block; float: left; margin-right: 5px; width: 81px; height: 24px } .downloadApp a:last-child { margin-right: 0 } .downloadApp img { width: auto; height: 24px } .showAnimateSC .sponsorDuplicate { display: none !important } .leftColum { width: 100% } article .details .mobVer { display: inline-block } .downAppNot { position: fixed; bottom: -250px; right: 20px; width: calc(100% - 40px); background: #181818; padding: 20px; z-index: 9999999; text-align: center; box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.4); transition: all 0.2s ease-in-out 0s; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; } .showDownAppNot .downAppNot { bottom: 20px } .downAppNot .logo { display: inline-block; float: right; width: 42px; height: auto; margin: 0 calc((100% - 42px) / 2) 4px } .downAppNot p { display: inline-block; width: 100%; float: right; text-align: center; font-family: droidLight, Arial; font-size: 20px; color: #fff; line-height: 1.2; margin-bottom: 26px } .downAppNot .download { display: inline-block; width: 100%; float: right; height: 42px; border-radius: 2px; border-top: 1px solid #86bff0; background: linear-gradient(#0b7ddf, #08589e); color: #fff; font-family: droidLight, Arial; font-size: 16px; text-align: center; line-height: 2.6; margin-bottom: 10px } .downAppNot .continue { display: inline-block; width: 106px; float: right; color: #fff; font-family: droidLight, Arial; font-size: 13px; margin: 0 calc((100% - 106px) / 2); position: relative } .downAppNot .continue:after { content: ""; width: 100%; height: 1px; background: #fff; position: absolute; left: 0; right: 0; bottom: 4px } .downAppNot .closeDownAppNot { width: 20px; height: 3px; position: absolute; right: 10px; top: 20px } .downAppNot .closeDownAppNot:before, .downAppNot .closeDownAppNot:after { content: ''; width: 100%; height: 100%; position: absolute; background-color: inherit; left: 0; } .downAppNot .closeDownAppNot:before { transform: rotate(45deg); background: #fff; bottom: 0; } .downAppNot .closeDownAppNot:after { transform: rotate(-45deg); background: #fff; top: 0; } article .articlePoll { width: 100%; margin: 15px 0; padding: 10px; } article .articlePoll .allItems h3 { font-size: 14px } article .articlePoll .secondStep .itemDiv .votes { line-height: 2.4 } article .articlePoll .secondStep .itemDiv .votes span { line-height: 2.4 } article .articlePoll .allItems input[type="radio"] + label { margin: 0 0 15px 0; font-size: 14px } .quickQues { width: 100%; margin: 0; padding: 10px } article .details .quickQues h2 { font-size: 16px !important } .quickQues h3.Question { font-size: 14px !important; line-height: 1.8 !important; max-height: 72px; overflow: hidden } .quickQues .answer label { font-size: 13px; max-height: 64px; overflow: hidden } .quickQues .answer label.wrong:before, .quickQues .answer label.correct:before { line-height: 2.6 } .leftSpeakol { width: 100% } .dtlsSc .shiftArtclPattern { width: 100% } .medal { width: 100%; margin: 0 0 20px; margin-bottom: 35px } .medal .allItems .order { width: 22px !important } .medal .allItems .labels .order, .medal .allItems .labels .country { color: transparent } .medal .allItems .country { width: calc(100% - 142px) !important; } .medal .allItems .gold, .medal .allItems .silver, .medal .allItems .bronze, .medalPage .medal .allItems .total { width: 30px !important } .medalPage .medal .allItems .labels .item { font-size: 12px; } .medalPage .medal .allItems .item { font-size: 12px } .medalPage .medal .allItems .country { line-height: unset; font-size: 11px !important } .medalPage .medal .allItems .item img { width: 20px; margin-left: 5px } .medalPage .medal .allItems .gold, .medalPage .medal .allItems .silver, .medalPage .medal .allItems .bronze { margin-left: 10px } .medalPage .medal .allItems .country { width: calc(100% - 162px) !important; } .medalPage .medal .allItems .gold, .medalPage .medal .allItems .silver, .medalPage .medal .allItems .bronze, .medalPage .medal .allItems .total { width: 25px !important } .proPlayer.olympic .remainContent .listing ul li:hover:first-child .desc p { color: #fff } .euroMain .remainContent .multimedia .title a, .euroMain .remainContent .proNews .title a { margin-left: 10px } .euroMain.olympic .tabs a { line-height: 3.3 } /* .medalPage .medal .allItems .bronze{margin-left:0}*/ .proPlayer.LatestNews.olympic .listing .ttl h2, .proPlayer.Videos.olympic .listing .ttl h2 { font-size: 16px } .tour2694 .euroMain .FullWidthBK .euroHeader:before { background: url(../../Images/ArabCup2021/arabCupHeader.png) bottom left -6px no-repeat; background-size: auto 100%; } .tour2694 .euroPredCnts .FullWidthBK .euroHeader:before { left: 0; top: auto; bottom: 0; width: 550px; background: url(../../Images/ArabCup/predArabCup.png) no-repeat left -60px bottom -90px; background-size: 100% auto; opacity: 0.6; } .tour2697 .euroPredCnts .FullWidthBK .euroHeader:before { right: 0; top: -26px; left: auto; bottom: auto; width: 100%; height: 130%; background: url(../../Images/enPattern4.svg) no-repeat center top; background-size: auto 100%; opacity: 1; pointer-events: none; z-index: 0 } .tour2730 .euroPredCnts .FullWidthBK .euroHeader:before { right: auto; top: 0; left: -52px; bottom: auto; width: 100%; height: 100%; background: url(../../Images/EgyptionLeague.png) no-repeat; background-size: auto 155%; opacity: 1; pointer-events: none; z-index: 0 } } @media screen and (min-width:480px)and (max-width:482px) { .ESbtn a { top: 90px; } .ESFeaturedArea .desc { bottom: -20px; height: 40%; } } @media screen and (max-width:400px) { .ESbtn a { top: 70px; } } @media screen and (min-width:411px) and (max-width:480px) { .ACN19 .TourTabs li { left: -30px; } } @media screen and (max-width:320px) { .LiveStreem .desc { width: 50% } .LiveStreem ul li:first-child .desc p { font-size: .6em; } .LiveStreem .desc span { font-size: .4em; top: 40%; } .ESbtn a { padding: 0px; top: 60px; } .ESFeaturedArea ul li:first-child { height: 350px; } .ACN19 .TourTabs li { margin-left: 44px; } .ACN19 .TourTabs li:last-child { margin: 5px 65px; } .acnToCup .fblogin input { width: 200px; margin: 0 calc((100% - 200px) / 2); } .acn_Cup .acnToCup .fblogin { top: 0; } /*.ACNHeader {background-position: -541px 0px;}*/ } /** Mobile - Landscape**/ @media screen and (max-width:767px) and (orientation:landscape) { .openSearch .searchDiv { height: 300px } .relatedArticles ul li.item { width: 150px; height: auto } .relatedArticles ul li.item a .arrow { height: 80px } .relatedArticles ul li.item a .imageCntnr { width: 120px; padding-bottom: 80px } .relatedArticles ul li.item a img { height: 80px } .relatedArticles ul li.item .desc { width: 150px; padding: 0 } .articleHeader .detialls { margin-top: 30px; } .articale_Section .detialls p { font-size: 11px; } .Team_View .BK .number, .PlayerView .Team1 { right: 100px; } .wcStanding .groups .table { width: calc((100% - 20px) / 2); } .wcStanding .groups .table:nth-child(4n) { margin-left: 20px; } .wcStanding .groups .table:nth-child(2n) { margin-left: 0; } .wcStanding .groups .table:nth-last-child(-n+4) { margin-bottom: 42px; } .wcStanding .groups .table:nth-last-child(-n+2) { margin-bottom: 32px; } .ACNStanding .groups .table { width: calc((100% - 20px) / 2); } .ACNStanding .groups .table:nth-child(4n) { margin-left: 20px; } .ACNStanding .groups .table:nth-child(2n) { margin-left: 0; } .ACNStanding .groups .table:nth-last-child(-n+4) { margin-bottom: 42px; } .ACNStanding .groups .table:nth-last-child(-n+2) { margin-bottom: 32px; } .PlayerView .BK .number span { margin-right: 46px; } .RoadToCup h2 { width: 50% } .RoadToCup .FBshare { left: 55%; top: 20%; transform: none } .fanZoneDiv .content-wrap { min-height: 1040px } .fanZone .cnts { width: 100%; margin: 20px 0 } .fanZone .cnts ul li { width: calc((100% - 30.1px) / 4); margin-left: 10px; margin-bottom: 130px; border-bottom-right-radius: 30px; border-bottom-left-radius: 30px; } .RoadToCup .winnerIN { width: 20%; left: 50%; } .mostSeenMedia .cnts ul li { margin-left: 10px; width: calc((100% - 10px) / 2); height: auto } .mostSeenMedia .cnts ul li:nth-child(2n) { margin-left: 0 } .wcOverlay .cntnr { top: 20px } .wcOverlay .ykLogo { width: 200px; margin: 0 calc((100% - 200px) / 2) 10px } .wcOverlay .mainSponsor p { margin-bottom: 10px; font-size: 12px; } .wcOverlay .mainSponsor .sponsorLogo { width: 56px; } .wcOverlay .allSponsors { height: 140px } .wcOverlay .allSponsors .third { width: 100% } .wcOverlay .allSponsors .third a { width: calc(100% / 9) } .acn_Cup .acnToCup .containermain { padding-bottom: 55% } /*article .totalQues .quesDiv{margin-bottom: 40px} article .totalQues{width: 100%;padding: 10px ;margin-right: 0;} article .totalQues h2{margin-bottom: 15px;line-height: 1;} article .totalQues .question img{width: 300px;margin: 0 calc((100% - 300px) /2)} article .totalQues .answer{line-height: 2;margin-bottom: 15px} article .totalQues .answer label{font-size: 15px;width: 300px} article .totalQues .answer img{width: 200px;padding: 10px} article .totalQues .answer.multi label{width:200px;margin:0 calc((100% - 200px) /2)} article .totalQues .question.quesBoth .conQues{margin:0 calc((100% - 300px) /2)} article .totalQues .question.quesImg .conQues{margin:0 calc((100% - 330px) /2)} article .totalQues .question.quesBoth span.dash{margin-left:0}*/ article .totalQues, .cafLgFinal article .totalQues { width: calc(100% - 20px); margin-right: 10px } article .totalQues h6 { font-size: 18px } article .totalQues .quesDiv { width: 100%; } article .totalQues .question h3 { font-size: 13px; line-height: 3 } article .totalQues .answer { width: calc((100% - 10px) /2); margin-left: 10px } article .totalQues .question img { padding: 0 } article .result .resContainer h5 { font-size: 16px !important; margin-bottom: 10px } article .result .resContainer h5 span { font-size: 16px !important } article .result .resContainer span.share { font-size: 15px } article .result .resContainer .shareRes a { height: 35px; line-height: 2.2; font-size: 15px !important } } /** Mobile - Portrait**/ @media screen and (max-width:767px) and (orientation:portrait) { .articleHeader .articleInfo { height: 96px; position: relative } .articleHeader .articleInfo .articleAuthor { width: 100%; margin-bottom: 10px } .articleHeader .articleInfo .articleAuthor:after { display: none } .articleHeader .articleInfo .articleAuthor p { font-size: 12px; line-height: 1.5 } .articleHeader .articleInfo .articleAuthor p span { font-size: 13px } .articleHeader .articleInfo .time { position: absolute; top: 30px; right: 50px; padding: 0; font-size: 12px } .albumTemp .articleHeader .articleInfo { height: 56px } .albumTemp .articleHeader .articleInfo .time { position: relative; top: 0; right: 0; padding: 0; margin: 14px 0 } .videoTemp .articleHeader .articleInfo { height: 56px } .videoTemp .articleHeader .articleInfo .time { position: relative; top: 0; right: 0; padding: 0; margin: 14px 0 } .articleHeader .articleInfo .sponsorBy { float: right; margin: 9px 0 } .articleHeader .articleInfo .sponsorBy img { height: 22px; } .articleHeader .articleInfo .sponsorBy:after { display: none } article .keywordsDiv { width: 100%; margin-left: 0; } .relatedArticles ul li.item { width: 140px; height: auto; margin-left: 20px } .relatedArticles ul li.item:last-child { margin-left: 0 } .relatedArticles ul li.item a .arrow { height: 73px } .relatedArticles ul li.item a .imageCntnr { width: 110px; padding-bottom: 73px } .relatedArticles ul li.item a img { height: 73px } .relatedArticles ul li.item .desc { width: 140px; padding: 0 } .policy .item { margin-bottom: 8px; } .policy .item .head { font-size: 16px; } .policy .item p { font-size: 13px; } .policy .item .MiniHead { font-size: 12px; } .policy .item ul li { font-size: 13px; } .contact_us h3 { font-size: 13px; } .contact_us h3 { margin: 10px 0 20px; } .contact_us .C-form .iitem { margin-bottom: 28px; } .contact_us .C-form .C_button { margin: 5px calc((100% - 300px)/2); } .ContactUs .contact_us .C-form .iitem { margin-bottom: 20px } .ContactUs .contact_us .C-form .iitem .C-label, .contact_us .C-form .iitem input, #combobox, .ContactUs .contact_us .C-form .iitem .wrapper-demo { width: 100% !important; } .ContactUs .contact_us .C-form .iitem input, .ContactUs .contact_us .C-form .iitem #txtSMS { width: 100% !important; } .ContactUs .contact_us .C-form .iitem .wrapper-demo { margin-top: -30px } .options { width: 100%; top: 32px; } #ull { width: 100%; top: 67px; } .contact_us .C-form .iitem.special { margin-bottom: 55px; } .articleHeader .detialls { margin-top: 30px; } .articleHeader .detialls p { font-size: 10px; line-height: 3; } .articale_Section .detialls p { font-size: 8px; line-height: 3; } .articale_Section .articleHeader .articleInfo { padding: 0 10px; } .ContactUs .contactAds .ads .item { width: 100% } .RoadToCup .imageRight, .RoadToCup .imageLeft { width: 85px; height: 23px; } .RoadToCup .RoadContainer:nth-of-type(1) { margin-top: 40px } .RoadToCup .winnerIN { width: 40% } .RoadToCup .Mbutton .button { width: 58%; } .ShareBK .ButtonSH { top: 0; left: 0; transform: none; margin-left: 38px; } .wcStanding .groups .table { width: 100%; margin-left: 0; margin-bottom: 42px; border-bottom-right-radius: 30px; border-bottom-left-radius: 30px } .wcStanding .groups .table:nth-last-child(-n+2) { margin-bottom: 42px; } .wcStanding .groups .table:last-child { margin-bottom: 32px; } .ACNStanding .groups .table { width: 100%; margin-left: 0; margin-bottom: 42px; margin-bottom: 16px; height: 224px; } .ACNStanding .groups .table:nth-last-child(-n+4) { margin-bottom: 16px; } .table:nth-last-child(-n+4) { margin-bottom: 16px; } .ACNStanding .groups .table:last-child { margin-bottom: 6px; } .ACNStanding .statsSponsor p { display: none } .fanZoneDiv .content-wrap { min-height: 1670px } .fanZone .cnts { width: 100%; margin: 20px 0 } .fanZone .cnts ul li { width: calc((100% - 10.1px) / 2); margin-left: 10px; margin-bottom: 130px; border-bottom-right-radius: 30px; border-bottom-left-radius: 30px; } .fanZone .cnts ul li:nth-child(2n) { margin-left: 0 } .RoadToCup .FBshare { top: 29%; transform: none } .RoadToCup .winnerIN { left: 50% } .chooseSquadDiv .SquadEG .stepTwo .buttons { top: 305px !important } .mostSeenMedia .cnts ul li { width: 100% } .wcOverlay .cntnr { top: 90px } .wcOverlay .allSponsors { height: 210px } .wcOverlay .allSponsors .third { width: 320px } .wcOverlay .allSponsors .third a { width: calc(100% / 5); } /*.matchesHp .noStatsDiv{position: absolute!important;top: 0;left: 0;width:auto}*/ .stats.TourStats-2584 .statsSponsorCont .statsSponsor { left: 0 } .stats.TourStats-2584 .statsSponsorCont .statsSponsor img { height: 34px; margin-top: 4px } .stats.TourStats-2584 .statsSponsorCont .statsSponsor p { display: none } .ACN19 .TourTabs li:last-child { margin: 5px 65px; } }