@charset "UTF-8";
body {
  background-size: 2200px;
  background-position: -74px -425px;
}

.main div[class*=cnode_label_] {
  padding: 1rem;
  width: 60%;
  float: left;
}

.main div[class*=cnode_label_]:after {
  content: "";
  height: 0;
  display: block;
  clear: both;
}

#header + section {
  margin-top: 50px;
  padding-bottom: 0;
}

button {
  background: white;
  border: none;
  border-radius: 4px;
  padding: 4px 11px;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.11);
}

.bigLinks {
  margin-left: 5.5%;
  float: left;
  text-align: center;
}
.bigLinks button {
  display: inline-block;
  margin-bottom: 1rem;
}
.bigLinks button b {
  font-size: 33px;
}
.bigLinks .vote {
  background: #ff7c55;
  color: white;
  padding: 1rem;
}
.bigLinks .hash {
  padding: 1rem;
  color: white !important;
  text-decoration: none !important;
  background: #00a4d5;
  font-size: 22px;
}

.helpers {
  padding: 1rem;
  clear: both;
}

.bracket {
  font-family: "Roboto", sans-serif;
}
.bracket h1 {
  color: #ff8965;
  text-shadow: 0 0 16px rgb(21, 18, 25), 0 0 16px rgb(21, 18, 25);
}
.bracket .grabber {
  text-align: left;
  padding-left: 0;
}
.bracket a, .bracket a:link, .bracket a:visited {
  color: #ff8965;
  font-family: "Roboto", sans-serif;
}
.bracket a.shortName {
  color: #505050;
}

.bracket .main .iwrapper {
  padding: 1rem;
}

#bracket {
  transform-origin: 0 0;
  background: white;
  width: 2072px;
  height: 1271px;
  padding: 20px 85px;
  box-sizing: border-box;
}

bracket {
  display: block;
  position: relative;
  width: 100%;
}

group {
  position: absolute;
  top: 26px;
  left: 0;
  display: block;
  width: 200px;
  opacity: 1;
  transition: all 1.5s ease;
}

contest {
  position: relative;
  height: 106px;
  display: block;
  padding: 0 0.5rem;
  box-sizing: border-box;
  border-radius: 10px;
  border-right: 3px solid #ff8630;
}

contest + contest {
  margin-top: 2.5rem;
}

contest topic {
  display: block;
  margin: 0;
  padding: 0;
  position: absolute;
  transform: rotate(270deg) translate(-23px, -92px);
  width: 6em;
  font-size: 16px;
  text-align: center;
  background: #def4ff;
  padding: 4px;
}

.right contest topic {
  transform: rotate(270deg) translate(-23px, 167px);
}

player {
  background-color: #fdf7f2;
  position: relative;
  text-align: right;
  display: block;
  height: 60px;
  top: -14px;
  box-sizing: border-box;
  padding-top: 4%;
  margin-bottom: 8px;
  transition: background-color 4s ease;
}

player .shortName {
  display: block;
  padding: 0 0.5rem;
  font-size: 14px;
  color: #505050;
}

group.right {
  right: 0;
  left: auto;
}

group.right contest {
  border-right: none;
  border-left: 3px solid #ff8630;
}

group.right player {
  text-align: left;
}

group.level2 {
  left: 200px;
  top: 51px;
}

group.level2 contest {
  height: 192px;
}

group.level2 player {
  height: 93px;
  top: -20px;
  margin-bottom: 53px;
}

group.level2 player .shortName {
  font-size: 17px;
}

group.level2 contest + contest {
  margin-top: 99px;
}

group.level2.right {
  right: 200px;
  left: auto;
}

group.level3 {
  left: 400px;
  top: 97px;
}

group.level3 contest {
  height: 399px;
}

group.level3 player {
  height: 151px;
  top: -20px;
  margin-bottom: 138px;
}

group.level3 player .shortName {
  font-size: 20px;
}

group.level3 contest + contest {
  margin-top: 182px;
}

group.level3.right {
  right: 400px;
  left: auto;
}

group.level4 {
  left: 600px;
  top: 225px;
}

group.level4 contest {
  height: 731px;
}

group.level4 player {
  height: 187px;
  top: -20px;
  margin-bottom: 386px;
}

group.level4 player .shortName {
  font-size: 23px;
}

group.level4.right {
  right: 600px;
  left: auto;
}

group.level5 {
  left: 816px;
  top: 440px;
  width: 269px;
}

group.level5 contest {
  height: 326px;
  border: none;
}

group.level5 player {
  height: 158px;
  top: -20px;
  text-align: left;
}

group.level5 vs + player {
  text-align: right;
}

group.level5 player .shortName {
  font-size: 23px;
}

group.start {
  left: 846px !important;
  opacity: 0;
}

group.start.right {
  left: auto;
  right: 846px !important;
}

group.start player {
  background-color: #ff8c35;
}

vs {
  display: block;
  font-style: italic;
  top: -79px;
  position: relative;
  text-align: center;
  width: 100%;
}

.bracket .DialogBox .close {
  background: none;
  color: white;
  border: none;
  box-shadow: none;
  top: -4px;
  width: 15px;
}

details,
topic,
quote,
recipient,
description,
link {
  line-height: 1.35;
  display: block;
  padding: 0 1rem 0.5rem 1rem;
}

topic {
  font-size: 14px;
  text-align: right;
  color: #808080;
}

recipient {
  font-family: "Miller Headline";
  font-size: 20px;
  font-style: italic;
}

recipient:before {
  content: "to ";
}

quote {
  margin-top: 1.25rem;
  position: relative;
  border-top: 1px solid #a0a0a0;
  font-family: "Miller Headline";
  font-size: 32px;
  padding: 22px 2rem 1rem;
}

quote:before {
  content: "“";
  display: block;
  font-size: 132px;
  line-height: 0;
  position: absolute;
  left: 46%;
  vertical-align: bottom;
  top: 27px;
}

description {
  padding: 1rem 2rem;
}

.bracket .DialogBox {
  font-family: "Roboto", sans-serif;
}
.bracket .DialogBox a.shortName {
  display: block;
  padding: 9px 13px;
  background: #fafafa;
  border-radius: 4px;
  width: 103px;
  margin: 1rem auto 0.5rem;
  text-align: center;
}

short {
  display: none;
}

.DialogBox {
  font-size: 16px;
  font-family: "Helvetica", "Arial", sans-serif;
  display: block;
  visibility: hidden;
  position: absolute;
  z-index: 1000;
  background: #f0f0f0;
  box-shadow: 0 0 24px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.5s ease;
  max-width: 550px !important;
}
.DialogBox .toolbar {
  line-height: 2;
  padding: 0.25rem 1rem;
  background: #676767;
  color: white;
}
.DialogBox .toolbar h3 {
  margin: 0;
  font-size: 18px;
}
.DialogBox .content {
  padding: 1rem;
}
.DialogBox .close {
  font-size: 20px;
  position: absolute;
  right: 0;
  top: 0;
  width: 30px;
  height: 30px;
  cursor: pointer;
  text-align: center;
  padding: 0.5rem;
  display: inline-block;
  line-height: 1;
}

.DialogBox.opening {
  visibility: visible;
  opacity: 1;
}

.DialogBox.closing {
  visibility: visible;
  opacity: 0;
}

.DialogBoxMask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.5);
  visibility: hidden;
  opacity: 0;
  z-index: 999;
  transition: opacity 0.5s ease;
}

.DialogBoxMask.opening {
  visibility: visible;
  opacity: 1;
}

.DialogBoxMask.closing {
  visibility: visible;
  opacity: 0;
}

#header {
  z-index: 10;
  position: relative;
  top: 0;
  height: 134px;
}

#hamburger {
  display: none;
}

#nav .closer {
  display: none !important;
}

#header + section {
  margin-top: 0;
}

.DialogBox {
  box-shadow: none;
  background: #aedcea;
}

.DialogBoxMask {
  background: rgba(255, 255, 255, 0.63);
}

.phase1 #bracket,
.phase1 bracket {
  width: 1200px;
}
.phase1 group contest {
  border-color: #e0e0e0;
}
.phase1 .level1 {
  z-index: 100;
}
.phase1 .level1 contest {
  border-color: #ff8630;
}
.phase1 .level2 {
  width: 100px;
  left: 200px;
}
.phase1 .level3 {
  width: 100px;
  left: 300px;
}
.phase1 .level4 {
  width: 100px;
  left: 400px;
}
.phase1 .level5 {
  width: 100px;
  display: none;
  left: 500px;
}
.phase1 .right {
  right: 162px;
}
.phase1 .level2.right {
  right: 362px;
}
.phase1 .level3.right {
  right: 462px;
}
.phase1 .level4.right {
  right: 562px;
}
.phase1 group.start {
  left: 546px !important;
}
.phase1 group.start.right {
  right: 523px !important;
}

.active player {
  background-color: #ffcb6b;
}

contest player.winner {
  background-color: #ff8965;
}
contest player.winner a.shortName {
  color: white;
}

@media (max-width: 1111px) {
  body {
    font-size: 14px;
  }
  h1 {
    padding: 0;
  }
  .main div[class*=cnode_label_] {
    padding: 1rem;
    width: auto;
    float: none;
  }
  .bigLinks {
    margin: 2rem;
    float: none;
  }
  .bigLinks .vote {
    display: inline-block;
  }
  .bigLinks br {
    display: none;
  }
}
@media (max-width: 400px) {
  .bracket .grabber {
    font-size: 22px;
  }
  #nav ul u {
    display: none;
  }
}

/*# sourceMappingURL=bracket.css.map */