section.scores { border: 1px solid #DDE3E4; background: white; .loading { text-align: center; padding: 20px; } abbr[title], acronym[title] { border-bottom-width: 0; cursor: pointer; } .section-container p.title { border: 0 !important; } .section-container div.content { border: 0 !important; } header { height: auto; h3 { text-align: center; font-weight: 100; line-height: 65px; } margin-bottom: 0 !important; } ul.scores-switch { border-bottom: 1px solid #DDE3E4; font-size: 0; list-style-type: none; margin-bottom: 0; li { border-right: 1px solid #DDE3E4; display: inline-block; font-size: 12px; width: 49%; text-align: center; line-height: 35px; &.active { font-weight: 600; } &:last-child { border-right: none; } } } .user-scores.active { display: block !important; } .user-scores { display: none; .media__img { margin-right: 9px; } .user { border-bottom: 1px solid #DDE3E4; padding: 10px; &.media { .avatar { @extend %avatar-round; } } } ul { list-style-type: none; position: relative; line-height: 1.1em; li { cursor: pointer; } li.user-name { font-size: 14px; } li.location, li.last-played { color: #999; font-size: 12px; } li.score-card { cursor: default; width: 234px; background: #fff; position: absolute; right: 215px; bottom: 5px; list-style-type: none; .wrap { position: relative; background: #ffffff; border: 1px solid #DCDCDC; &:after, &:before { left: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; } &:after { border-color: rgba(255, 255, 255, 0); border-left-color: #ffffff; border-width: 5px; bottom: 17px; margin-top: -5px; } &:before { border-color: rgba(193, 193, 193, 0); border-left-color: #c1c1c1; border-width: 6px; bottom: 16px; margin-top: -6px; } } h3 { font-size: emCalc(30px); text-align: center; line-height: 30px; } h4 { font-size: emCalc(18px); text-align: center; color: #5a6366; line-height: 20px; margin-top: 15px; } ul { margin: 0; li { text-align: center; font-size: emCalc(12px); font-weight: bold; line-height: 45px; list-style-type: none; border-top: 1px solid #dcdcdc; &.icon1, &.icon3 { border-right: 1px solid #dcdcdc; } } } } } } }