﻿/*!
* Responsive Tournament Bracket
* Copyright 2016 Jakub Hájek
* Licensed under MIT (https://opensource.org/licenses/MIT)
* https://codepen.io/jimmyhayek/pen/yJZdEB
*/@import'https://fonts.googleapis.com/css?family=Work+Sans:300,400,600,700&subset=latin-ext';html,body,input,select,*{margin:0;padding:0}.container{width:90%;margin:20px auto}.container.t-32 .tournament-round:nth-child(3) .tournament-match,.container.t-32 .tournament-round:nth-child(7) .tournament-match{padding:14.2em 1.5em}h1,h2{text-align:center}h1{font-size:2rem;font-weight:700;margin-bottom:.5em}h2{font-size:1.4rem;font-weight:600;margin-bottom:2em}html{background:#fafafa}.option-wrap{display:flex;flex-direction:column;justify-content:flex-start;padding-right:10px;max-height:606px;overflow:auto}.option-wrap .option-item{padding:3px 0;padding-left:10px;display:flex;align-items:center;font-size:14px;border-bottom:1px solid #ddd;cursor:pointer;gap:5px}.option-wrap .option-item .option{display:inline-block;padding:.5em .4em;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.35rem;color:#fff;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-}.option-wrap .option-item:hover{background:#f9f9f9}.option-wrap .option-item.active{border-left:3px solid #36b9cc;color:#000;font-weight:bold}.bracket{display:flex;align-items:center;justify-content:flex-start}.tournament-round{display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.tournament-round:first-child .before{display:none}.tournament-round:last-child .after{display:none}.tournament-round:nth-child(even) .tournament-match{padding:5.2em 1.5em}.tournament-round.match .before{height:0px !important;transform:translateY(-50%) !important;border-right:0 !important;border-radius:0 !important}.tournament-round.match .after{height:0px !important;transform:translateY(-50%) !important;border-right:0 !important;border-radius:0 !important}.tournament-round.match~.tournament-round .tournament-match:nth-child(odd) .before{top:50%;height:100%}.tournament-round.match~.tournament-round .tournament-match:nth-child(odd) .before:before{content:none}.tournament-round.match~.tournament-round .tournament-match:nth-child(odd) .before:after{height:50%}.tournament-round.match~.tournament-round .tournament-match:nth-child(odd) .after{height:1px;border-right:0}.tournament-round.match~.tournament-round .tournament-match:nth-child(even) .before{top:0%;height:50%;transform:translateY(0)}.tournament-round.match~.tournament-round .tournament-match:nth-child(even) .before:before{height:100%}.tournament-round.match~.tournament-round .tournament-match:nth-child(even) .before:after{content:none}.tournament-round.match~.tournament-round .tournament-match:nth-child(even) .after{top:50%;transform:translateY(-50%);height:1px;border-right:0}.tournament-match{position:relative;width:250px;box-sizing:border-box;padding:1.5em}.tournament-match .inner{position:relative;background:#fff;box-shadow:1px 1px 5px rgba(0,0,0,.3)}.tournament-match .inner .position-absolute{top:50%;left:50%;transform:translate(-50%, -50%);z-index:100;opacity:.8}.tournament-match .before{position:absolute;left:0;top:50%;transform:translateY(-50%);width:1.5em;height:.6em}.tournament-match .before:before{content:"";position:absolute;left:-2px;top:-1px;width:100%;height:50%;border-bottom:2px solid #9e9e9e;border-left:2px solid #9e9e9e;border-radius:0 0 0 .7em}.tournament-match .before:after{content:"";position:absolute;left:-2px;bottom:-1px;width:100%;height:50%;border-top:2px solid #9e9e9e;border-left:2px solid #9e9e9e;border-radius:.7em 0 0 0}.tournament-match .after{position:absolute;top:50%;right:0;width:1.5em;height:50%}.tournament-match:nth-child(odd) .after{top:50%;border-top:2px solid #9e9e9e;border-right:2px solid #9e9e9e;border-radius:0 .7em 0 0}.tournament-match:nth-child(even) .after{top:0;border-bottom:2px solid #9e9e9e;border-right:2px solid #9e9e9e;border-radius:0 0 .7em 0}.player--name{white-space:nowrap}.match--player{position:relative;display:flex;padding:1em;background:#fff;box-sizing:border-box;text-align:center;align-items:center;gap:10px;border:1px solid #ccc}.match--player:first-child{border-bottom:1px solid #ccc;background:#efefef}.match--player .player--name{flex:2}.match--player .player--score{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:#9e9e9e;color:#fff;font-size:10px;font-weight:600}.match--player .player--del{margin-left:auto;zoom:.7}.match--player.player-1{border-left:5px solid red}.match--player.player-2{border-left:5px solid blue}.match--player .team-name{flex:3;display:inline-block;margin-left:5px;padding:5px 10px;background:#36b9cc;color:#fff;border-radius:5px;font-size:10px;vertical-align:middle;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.match--player .team-name.bye{background:#c2c2c2}.match--player .disabled{opacity:.5;cursor:not-allowed}[is-winner=true].player-1{background:red;color:#fff}[is-winner=true].player-2{background:blue;color:#fff}@media screen and (max-width: 1200px){.team-name{display:none}.match--player{position:relative;flex-direction:column}.match--player .team-name{width:100%;max-width:100%}.match--player .player--score{position:absolute;top:10px;right:10px}}@media screen and (max-width: 768px){.team-name{display:block;width:100%}}