/* IMPORT GLOBALS */
/* Variables used in multiple files */
/* Variables */
/* Elements */
/* ID's */
/* Classes */
.game-info {
  position: fixed;
  top: 40%;
  left: 50%;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 250px;
  max-height: 420px;
  max-width: 550px;
  padding-bottom: 50px;
  background: white;
  border-radius: 8px;
  transform: translate(-50%, -50%);
  overflow: hidden;
  z-index: 11;
  flex: 1; }
  .game-info.hide {
    display: none; }
  .game-info__title {
    display: flex;
    padding: 12px 30px 0; }
    .game-info__title > span {
      font-size: 20px;
      font-weight: bold;
      line-height: 35px; }
    .game-info__title > .calendar-exit {
      display: inline-block;
      height: 27px;
      width: 52px;
      color: rgba(0, 0, 0, 0.2);
      background: rgba(102, 102, 102, 0.2);
      border: 2px solid rgba(102, 102, 102, 0.1);
      border-radius: 8px;
      font-size: 16px;
      font-weight: bold;
      text-shadow: white;
      margin-left: auto; }
  .game-info__separator {
    width: 100%;
    margin: 5px 0;
    border-bottom: 1px solid #ededed; }
  .game-info__description {
    position: relative;
    font-size: 12px;
    margin: 10px 20px 16px; }
  .game-info__content {
    padding: 0 18px;
    overflow: auto; }
    .game-info__content > table {
      height: 100%;
      width: 100%; }
      .game-info__content > table > thead {
        padding: 0 25px;
        margin: 10px 0; }
        .game-info__content > table > thead > tr > th {
          font-weight: bold;
          padding: 0 0 8px 3px; }
      .game-info__content > table > tbody > tr {
        height: 40px;
        font-size: 14px;
        line-height: 42px; }
        .game-info__content > table > tbody > tr > td {
          padding-left: 12px; }
        .game-info__content > table > tbody > tr:nth-child(odd) {
          border-top: 1px solid #dddddd;
          border-bottom: 1px solid #dddddd;
          background: #fafafa; }

.shader {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 10; }
  .shader.hide {
    display: none; }

.main__calendar-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 60px 40px 50px;
  overflow: hidden; }
  .main__calendar-container .calendar {
    display: flex;
    flex-direction: column;
    font-size: 13px;
    text-align: left;
    flex: 1; }
    .main__calendar-container .calendar__title {
      font-size: 22px;
      font-weight: bold;
      margin-bottom: 8px; }
    .main__calendar-container .calendar__containers {
      display: flex;
      padding: 10px 15px;
      flex: 1; }
      .main__calendar-container .calendar__containers > div {
        display: flex;
        flex-direction: column;
        text-align: left;
        flex: 1; }
        .main__calendar-container .calendar__containers > div > h2 {
          padding: 5px 8px 8px;
          font-weight: bold; }
        .main__calendar-container .calendar__containers > div > div, .main__calendar-container .calendar__containers > div > form {
          height: 48px;
          line-height: 48px;
          padding: 0 10px;
          border-top: 1px solid #dedede; }
          .main__calendar-container .calendar__containers > div > div:nth-child(even), .main__calendar-container .calendar__containers > div > form:nth-child(even) {
            background: #fafafa; }
        .main__calendar-container .calendar__containers > div#game-name {
          min-width: 130px; }
        .main__calendar-container .calendar__containers > div#game-time {
          min-width: 130px; }
        .main__calendar-container .calendar__containers > div#game-attenders {
          text-align: center; }
        .main__calendar-container .calendar__containers > div#game-info, .main__calendar-container .calendar__containers > div#game-attend {
          text-align: center; }
          .main__calendar-container .calendar__containers > div#game-info > div, .main__calendar-container .calendar__containers > div#game-info > form, .main__calendar-container .calendar__containers > div#game-attend > div, .main__calendar-container .calendar__containers > div#game-attend > form {
            display: flex;
            align-items: center;
            justify-content: center; }
            .main__calendar-container .calendar__containers > div#game-info > div > input, .main__calendar-container .calendar__containers > div#game-info > div button, .main__calendar-container .calendar__containers > div#game-info > form > input, .main__calendar-container .calendar__containers > div#game-info > form button, .main__calendar-container .calendar__containers > div#game-attend > div > input, .main__calendar-container .calendar__containers > div#game-attend > div button, .main__calendar-container .calendar__containers > div#game-attend > form > input, .main__calendar-container .calendar__containers > div#game-attend > form button {
              padding: 8px 10px;
              color: white;
              background-repeat: repeat-x;
              border: none;
              border-radius: 7px;
              font-size: 12px;
              font-weight: bold;
              text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }
              .main__calendar-container .calendar__containers > div#game-info > div > input.info-show, .main__calendar-container .calendar__containers > div#game-info > div button.info-show, .main__calendar-container .calendar__containers > div#game-info > form > input.info-show, .main__calendar-container .calendar__containers > div#game-info > form button.info-show, .main__calendar-container .calendar__containers > div#game-attend > div > input.info-show, .main__calendar-container .calendar__containers > div#game-attend > div button.info-show, .main__calendar-container .calendar__containers > div#game-attend > form > input.info-show, .main__calendar-container .calendar__containers > div#game-attend > form button.info-show {
                background-color: #4bafce;
                background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4); }
              .main__calendar-container .calendar__containers > div#game-info > div > input.enroll-add, .main__calendar-container .calendar__containers > div#game-info > div button.enroll-add, .main__calendar-container .calendar__containers > div#game-info > form > input.enroll-add, .main__calendar-container .calendar__containers > div#game-info > form button.enroll-add, .main__calendar-container .calendar__containers > div#game-attend > div > input.enroll-add, .main__calendar-container .calendar__containers > div#game-attend > div button.enroll-add, .main__calendar-container .calendar__containers > div#game-attend > form > input.enroll-add, .main__calendar-container .calendar__containers > div#game-attend > form button.enroll-add {
                background-color: #5bb75b;
                background-image: -webkit-linear-gradient(top, #64c464, #51a451); }
              .main__calendar-container .calendar__containers > div#game-info > div > input.enroll-remove, .main__calendar-container .calendar__containers > div#game-info > div button.enroll-remove, .main__calendar-container .calendar__containers > div#game-info > form > input.enroll-remove, .main__calendar-container .calendar__containers > div#game-info > form button.enroll-remove, .main__calendar-container .calendar__containers > div#game-attend > div > input.enroll-remove, .main__calendar-container .calendar__containers > div#game-attend > div button.enroll-remove, .main__calendar-container .calendar__containers > div#game-attend > form > input.enroll-remove, .main__calendar-container .calendar__containers > div#game-attend > form button.enroll-remove {
                background-color: #da4e49;
                background-image: -webkit-linear-gradient(top, #ee625d, #bc362f); }
              .main__calendar-container .calendar__containers > div#game-info > div > input.hide, .main__calendar-container .calendar__containers > div#game-info > div button.hide, .main__calendar-container .calendar__containers > div#game-info > form > input.hide, .main__calendar-container .calendar__containers > div#game-info > form button.hide, .main__calendar-container .calendar__containers > div#game-attend > div > input.hide, .main__calendar-container .calendar__containers > div#game-attend > div button.hide, .main__calendar-container .calendar__containers > div#game-attend > form > input.hide, .main__calendar-container .calendar__containers > div#game-attend > form button.hide {
                display: none; }
        .main__calendar-container .calendar__containers > div#game-attend {
          min-width: 230px; }
          .main__calendar-container .calendar__containers > div#game-attend.disabled > form input, .main__calendar-container .calendar__containers > div#game-attend.disabled > form label {
            opacity: 0.4;
            pointer-events: none; }
          .main__calendar-container .calendar__containers > div#game-attend > h2 {
            text-align: left;
            padding: 5px 8px 8px 25px; }
          .main__calendar-container .calendar__containers > div#game-attend > form > input[type="number"] {
            width: 48px;
            padding: 8px 5px 8px 13px;
            margin: 0 4px 0 3px;
            color: black;
            background: rgba(89, 89, 89, 0.1);
            border-radius: 8px;
            -moz-appearance: none;
            -webkit-appearance: none; }
  .main__calendar-container .calendar-old-games {
    display: flex;
    flex-direction: column;
    max-height: 4000px;
    margin-top: 20px;
    font-size: 13px;
    text-align: left;
    transition: max-height 0.8s;
    flex: 1; }
    .main__calendar-container .calendar-old-games.hidden {
      transition: max-height 0.4s;
      max-height: 0; }
    .main__calendar-container .calendar-old-games__title {
      font-size: 22px;
      font-weight: bold;
      margin-bottom: 8px; }
    .main__calendar-container .calendar-old-games__containers {
      display: flex;
      padding: 10px 15px;
      flex: 1; }
      .main__calendar-container .calendar-old-games__containers > div {
        display: flex;
        flex-direction: column;
        text-align: left;
        flex: 1; }
        .main__calendar-container .calendar-old-games__containers > div > h2 {
          padding: 5px 8px 8px;
          font-weight: bold; }
        .main__calendar-container .calendar-old-games__containers > div > div, .main__calendar-container .calendar-old-games__containers > div > form {
          height: 48px;
          line-height: 48px;
          padding: 0 10px;
          border-top: 1px solid #dedede; }
          .main__calendar-container .calendar-old-games__containers > div > div:nth-child(even), .main__calendar-container .calendar-old-games__containers > div > form:nth-child(even) {
            background: #fafafa; }
        .main__calendar-container .calendar-old-games__containers > div#game-name {
          min-width: 130px; }
        .main__calendar-container .calendar-old-games__containers > div#game-time {
          min-width: 130px; }
        .main__calendar-container .calendar-old-games__containers > div#game-attenders, .main__calendar-container .calendar-old-games__containers > div#game-attended-set {
          flex: 0;
          flex-shrink: 1;
          text-align: center; }
        .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form {
          display: flex;
          align-items: center;
          justify-content: center; }
          .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div > input, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div button, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form > input, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form button {
            padding: 8px 10px;
            color: white;
            background-repeat: repeat-x;
            border: none;
            border-radius: 7px;
            font-size: 12px;
            font-weight: bold;
            text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }
            .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div > input[type="number"], .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div button[type="number"], .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form > input[type="number"], .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form button[type="number"] {
              max-width: 60px;
              color: black;
              text-align: center; }
            .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div > input.info-show, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div button.info-show, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form > input.info-show, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form button.info-show {
              background-color: #4bafce;
              background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4); }
            .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div > input.enroll-add, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div button.enroll-add, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form > input.enroll-add, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form button.enroll-add {
              background-color: #5bb75b;
              background-image: -webkit-linear-gradient(top, #64c464, #51a451); }
            .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div > input.enroll-remove, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div button.enroll-remove, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form > input.enroll-remove, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form button.enroll-remove {
              background-color: #da4e49;
              background-image: -webkit-linear-gradient(top, #ee625d, #bc362f); }
            .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div > input.hide, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div button.hide, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form > input.hide, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form button.hide {
              display: none; }
          .main__calendar-container .calendar-old-games__containers > div#game-attended-set > div > label, .main__calendar-container .calendar-old-games__containers > div#game-attended-set > form > label {
            margin-right: 8px; }
        .main__calendar-container .calendar-old-games__containers > div#game-attend {
          min-width: 230px; }
          .main__calendar-container .calendar-old-games__containers > div#game-attend.disabled > form input, .main__calendar-container .calendar-old-games__containers > div#game-attend.disabled > form label {
            opacity: 0.4;
            pointer-events: none; }
          .main__calendar-container .calendar-old-games__containers > div#game-attend > h2 {
            text-align: left;
            padding: 5px 8px 8px 25px; }
          .main__calendar-container .calendar-old-games__containers > div#game-attend > form > input[type="number"] {
            width: 48px;
            padding: 8px 5px 8px 13px;
            margin: 0 4px 0 3px;
            color: black;
            background: rgba(89, 89, 89, 0.1);
            border-radius: 8px;
            -moz-appearance: none;
            -webkit-appearance: none; }
  .main__calendar-container > .addon-buttons {
    display: flex;
    margin-top: 55px; }
    .main__calendar-container > .addon-buttons .spacer {
      flex: 1; }
    .main__calendar-container > .addon-buttons > #link-to-game-area {
      max-width: 450px; }
    .main__calendar-container > .addon-buttons > #show-old-games-button {
      max-width: 320px; }

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