@charset "UTF-8";
/* Plugins */
/* Helpers */
/* Colors */
/* Fonts */
/* Dimensions */
.content-row:after, .row:after {
  content: "";
  display: table;
  clear: both;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

.text-right {
  text-align: right;
}

.text-center {
  text-align: center;
}

/* Base */
/**
 * modified version of eric meyer's reset 2.0
 * http://meyerweb.com/eric/tools/css/reset/
 */
/**
 * basic reset
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, main,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/**
 * HTML5 display-role reset for older browsers
 */
article, aside, details, figcaption, figure,
footer, header, menu, nav, section,
main, summary {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/**
 * modified version of normalize.css 3.0.2
 * http://necolas.github.io/normalize.css/
 */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/**
 * HTML5 display definitions
 * =============================================================================
 */
/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/**
 * Links
 * =============================================================================
 */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}

/**
 * Text-level semantics
 * =============================================================================
 */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
  font-weight: bold;
}

/**
 * 1. Address styling not present in Safari and Chrome.
 * 2. Set previously resetted italic font-style
 */
dfn,
i, em {
  font-style: italic;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/**
 * Embedded content
 * =============================================================================
 */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: hidden;
}

/**
 * Grouping content
 * =============================================================================
 */
/**
 * Address differences between Firefox and other browsers.
 */
hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
}

/**
 * Forms
 * =============================================================================
 */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type=button],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer;
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type=checkbox],
input[type=radio] {
  box-sizing: border-box;
  padding: 0;
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *    (include `-moz` to future-proof).
 */
input[type=search] {
  -webkit-appearance: none;
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold;
}

/**
 * responsive viewport
 */
@viewport {
  width: device-width;
}
/**
 * inherit box model
 */
*,
*::before,
*::after {
  box-sizing: border-box;
}

/**
 * iOS "clickable elements" fix for role="button"
 *
 * Fixes "clickability" issue (and more generally, the firing of events such as focus as well)
 * for traditionally non-focusable elements with role="button"
 * see https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
 */
[role=button] {
  cursor: pointer;
}

/**
 * Avoid 300ms click delay on touch devices that support the `touch-action` CSS property.
 *
 * In particular, unlike most other browsers, IE11+Edge on Windows 10 on touch devices and IE Mobile 10-11
 * DON'T remove the click delay when `<meta name="viewport" content="width=device-width">` is present.
 * However, they DO support removing the click delay via `touch-action: manipulation`.
 * See:
 * - http://v4-alpha.getbootstrap.com/content/reboot/#click-delay-optimization-for-touch
 * - http://caniuse.com/#feat=css-touch-action
 * - http://patrickhlauke.github.io/touch/tests/results/#suppressing-300ms-delay
 */
a,
area,
button,
[role=button],
input,
label,
select,
summary,
textarea {
  touch-action: manipulation;
}

/**
 * Always hide an element with the `hidden` HTML attribute (from PureCSS).
 */
[hidden] {
  display: none !important;
}

/* Colors */
/* Fonts */
/* Dimensions */
.content-row:after, .row:after {
  content: "";
  display: table;
  clear: both;
}

* {
  outline: none !important;
}

body {
  font-family: "Source Sans Pro", Helvetica, sans-serif;
  font-style: normal;
  font-size: 16px;
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
  font-weight: 400;
  color: #fff;
}

/* Links */
a {
  text-decoration: none;
  color: #2DC46E;
}
a:hover {
  color: #fff;
}

/*Заголовки*/
h1 {
  font-size: 38px;
  line-height: 150%;
  font-weight: 100;
}
@media (max-width: 959px) {
  h1 {
    font-size: 19px;
  }
}

h2 {
  font-size: 34px;
}
@media (max-width: 959px) {
  h2 {
    font-size: 17px;
  }
}

h3 {
  font-size: 24px;
}
@media (max-width: 959px) {
  h3 {
    font-size: 12px;
  }
}

h4, h5, h6 {
  font-size: 16px;
}
@media (max-width: 959px) {
  h4, h5, h6 {
    font-size: 7px;
  }
}

/*Списки*/
nav ul, nav ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
nav ul li, nav ol li {
  padding-left: 0;
}

/*Таблицы*/
table {
  width: 100%;
  margin: 20px 0;
}
@media (max-width: 959px) {
  table {
    margin: 10px 0;
  }
}
table caption {
  text-align: left;
  color: #888888;
  padding: 0 0 5px 0;
}
table th, table td {
  padding: 10px;
  border: 1px solid #d9d9d9;
}
@media (max-width: 959px) {
  table th, table td {
    padding: 5px;
  }
}
table th {
  text-align: left;
}

/*Элементы*/
p {
  margin: 0;
}

p + p { /*TODO: */ }

blockquote {
  text-align: center;
  display: block;
  margin: 20px 0;
}
@media (max-width: 959px) {
  blockquote {
    margin: 10px 0;
  }
}

hr {
  display: block;
  height: 1px;
  border: none;
  margin: 10px 0 20px;
  padding: 0;
  background: #d9d9d9;
}
@media (max-width: 959px) {
  hr {
    margin: 5px 0 10px;
  }
}

/*Картинки*/
img {
  vertical-align: middle;
}

h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child, ul:first-child, ol:first-child, table:first-child, p:first-child, blockquote:first-child {
  margin-top: 0;
}
h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, ul:last-child, ol:last-child, table:last-child, p:last-child, blockquote:last-child {
  margin-bottom: 0;
}

h1 + p, h1 + ul, h2 + p, h2 + ul, h3 + p, h3 + ul, h4 + p, h4 + ul, h5 + p, h5 + ul, h6 + p, h6 + ul { /*TODO: */ }

p + ul, p + ol {
  margin-top: 10px;
}
@media (max-width: 959px) {
  p + ul, p + ol {
    margin-top: 5px;
  }
}

svg:not(:root) {
  overflow: hidden;
}

svg {
  fill: currentColor;
}

.overlay-h1 {
  font-weight: 700;
  font-size: 27px;
  line-height: 36px;
  letter-spacing: 0.3px;
  margin: 0 0 25px;
}
.overlay-h1 a {
  font-size: 18px;
  display: block;
  line-height: 110%;
  font-weight: normal;
}
.overlay-h1 a:hover {
  cursor: pointer;
}
@media (max-width: 959px) {
  .overlay-h1 {
    font-size: 16px;
    margin: 0 0 10px;
  }
}

input {
  background: transparent;
  border: none;
  border-bottom: 1px solid #2DC46E;
  border-radius: 0;
  color: #fff;
  line-height: 22px;
  padding: 5px 0;
  font-size: 16px;
  width: 100%;
  font-weight: 400;
  letter-spacing: 0.2px;
  font-family: "Source Sans Pro", Helvetica, sans-serif;
}
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus input:-webkit-autofill {
  -webkit-text-fill-color: white;
  -webkit-box-shadow: 0 0 0px 1000px #253742 inset;
  transition: background-color 5000s ease-in-out 0s;
  background: transparent;
}
@media (max-width: 959px) {
  input {
    font-size: 14px;
    line-height: 18px;
  }
}
input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.75);
  transition: opacity 0.2s;
  opacity: 1;
}
input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.75);
  transition: opacity 0.2s;
  opacity: 1;
}
input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.75);
  transition: opacity 0.2s;
  opacity: 1;
}
input:-moz-placeholder {
  color: rgba(255, 255, 255, 0.75);
  transition: opacity 0.2s;
  opacity: 1;
}
input:focus {
  border-bottom-color: #fff;
}
input.no-valid {
  border-bottom-color: red;
}

input:required {
  box-shadow: none;
}

input:invalid {
  box-shadow: none;
}

button {
  display: inline-block;
  background: #009B7A;
}

.Select-control {
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  border-bottom-right-radius: 2px;
  border-top-right-radius: 2px;
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
  border-top-left-radius: 2px;
  border: 0 !important;
  border-bottom: 1px solid #2DC46E !important;
  background: none !important;
  font-size: 16px;
  color: white !important;
  font-family: "Source Sans Pro", Helvetica, sans-serif;
}

html, body {
  height: 100vh;
  background: #19242b;
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
html .to-landscape, body .to-landscape {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #263742;
  color: white;
  z-index: 255;
}
@media (max-width: 959px) and (orientation: portrait) {
  html .to-landscape, body .to-landscape {
    display: block;
  }
}
html .to-landscape svg, body .to-landscape svg {
  width: 100px;
  height: 100px;
  position: fixed;
  top: 45%;
  left: 50%;
  margin: -50px 0 0 -50px;
}
html .to-landscape .rotate-text, body .to-landscape .rotate-text {
  width: 250px;
  height: 100px;
  position: fixed;
  top: 45%;
  left: 50%;
  margin: 75px 0 0 -100px;
  font-size: 20px;
  font-weight: 300;
}

/* Layout */
.layout-page {
  position: relative;
  min-height: 100%;
}

.branding {
  text-align: center;
  padding-bottom: 10px;
  padding-top: 20px;
}
@media (max-width: 959px) {
  .branding {
    padding-bottom: 5px;
    padding-top: 10px;
  }
}
.branding h1 {
  font-size: 25px;
  padding-top: 5px;
  letter-spacing: 0.02em;
}
@media (max-width: 959px) {
  .branding h1 {
    font-size: 13px;
    padding-top: 3px;
  }
}

/* Colors */
/* Fonts */
/* Dimensions */
.content-row:after, .row:after {
  content: "";
  display: table;
  clear: both;
}

.container {
  padding: 25px 20px 80px 25px;
  max-width: 1064px;
}

/*
 * Grid
 */
.content-row:after, .row:after {
  display: block;
  clear: both;
  content: "";
}

.row {
  margin-left: -10px;
  margin-right: -10px;
}
@media (max-width: 959px) {
  .row {
    margin-left: -5px;
    margin-right: -5px;
  }
}
.row.indented {
  margin-left: -24px;
  margin-right: -24px;
}
@media (max-width: 959px) {
  .row.indented {
    margin-left: 12px;
    margin-right: 12px;
  }
}

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
  float: left;
  min-height: 1px;
  padding-left: 10px;
  padding-right: 10px;
}
@media (max-width: 959px) {
  .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
    padding-left: 5px;
    padding-right: 5px;
  }
}
.col-1.indented, .col-2.indented, .col-3.indented, .col-4.indented, .col-5.indented, .col-6.indented, .col-7.indented, .col-8.indented, .col-9.indented, .col-10.indented, .col-11.indented, .col-12.indented {
  padding-left: 24px;
  padding-right: 24px;
}
@media (max-width: 959px) {
  .col-1.indented, .col-2.indented, .col-3.indented, .col-4.indented, .col-5.indented, .col-6.indented, .col-7.indented, .col-8.indented, .col-9.indented, .col-10.indented, .col-11.indented, .col-12.indented {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.col-12 {
  width: 100%;
}

.col-11 {
  width: 91.66666667%;
}

.col-10 {
  width: 83.33333333%;
}

.col-9 {
  width: 75%;
}

.col-8 {
  width: 66.66666667%;
}

.col-7 {
  width: 58.33333333%;
}

.col-6 {
  width: 50%;
}

.col-5 {
  width: 41.66666667%;
}

.col-4 {
  width: 33.33333333%;
}

.col-3 {
  width: 25%;
}

.col-2 {
  width: 16.66666667%;
}

.col-1 {
  width: 8.33333333%;
}

.col-pull-12 {
  right: 100%;
}

.col-pull-11 {
  right: 91.66666667%;
}

.col-pull-10 {
  right: 83.33333333%;
}

.col-pull-9 {
  right: 75%;
}

.col-pull-8 {
  right: 66.66666667%;
}

.col-pull-7 {
  right: 58.33333333%;
}

.col-pull-6 {
  right: 50%;
}

.col-pull-5 {
  right: 41.66666667%;
}

.col-pull-4 {
  right: 33.33333333%;
}

.col-pull-3 {
  right: 25%;
}

.col-pull-2 {
  right: 16.66666667%;
}

.col-pull-1 {
  right: 8.33333333%;
}

.col-pull-0 {
  right: auto;
}

.col-push-12 {
  left: 100%;
}

.col-push-11 {
  left: 91.66666667%;
}

.col-push-10 {
  left: 83.33333333%;
}

.col-push-9 {
  left: 75%;
}

.col-push-8 {
  left: 66.66666667%;
}

.col-push-7 {
  left: 58.33333333%;
}

.col-push-6 {
  left: 50%;
}

.col-push-5 {
  left: 41.66666667%;
}

.col-push-4 {
  left: 33.33333333%;
}

.col-push-3 {
  left: 25%;
}

.col-push-2 {
  left: 16.66666667%;
}

.col-push-1 {
  left: 8.33333333%;
}

.col-push-0 {
  left: auto;
}

.col-offset-12 {
  margin-left: 100%;
}

.col-offset-11 {
  margin-left: 91.66666667%;
}

.col-offset-10 {
  margin-left: 83.33333333%;
}

.col-offset-9 {
  margin-left: 75%;
}

.col-offset-8 {
  margin-left: 66.66666667%;
}

.col-offset-7 {
  margin-left: 58.33333333%;
}

.col-offset-6 {
  margin-left: 50%;
}

.col-offset-5 {
  margin-left: 41.66666667%;
}

.col-offset-4 {
  margin-left: 33.33333333%;
}

.col-offset-3 {
  margin-left: 25%;
}

.col-offset-2 {
  margin-left: 16.66666667%;
}

.col-offset-1 {
  margin-left: 8.33333333%;
}

.col-offset-0 {
  margin-left: 0%;
}

.coll-pull-right {
  float: right;
}

.content-row {
  display: flex;
  margin-top: 20px;
}
.content-row.white-space-wrap {
  flex-wrap: wrap;
}
.content-row.align-end {
  align-items: end;
}
.content-row.align-end > div {
  margin-left: 0 !important;
  margin-right: 20px;
}
.content-row .content-col-50 {
  width: calc(50% - 18px);
  flex-grow: 0;
  flex-shrink: 0;
  margin-left: 35px;
  /*@media (max-width: $screen-sm-max) {
    margin-left: 18px;
    width: calc(50% - 9px);
  }*/
}
.content-row .content-col-50:nth-child(1) {
  margin-left: 0;
}
.content-row .content-col-66 {
  width: calc(66.7% - 18px);
  flex-grow: 0;
  flex-shrink: 0;
  margin-left: 35px;
  /*@media (max-width: $screen-sm-max) {
    margin-left: 18px;
    width: calc(66.7% - 5px);
  }*/
}
.content-row .content-col-66:nth-child(1) {
  margin-left: 0;
}
.content-row .content-col-33 {
  width: calc(33.3% - 18px);
  flex-grow: 0;
  flex-shrink: 0;
  margin-left: 35px;
  /*@media (max-width: $screen-sm-max) {
    margin-left: 18px;
    width: calc(33.3% - 9px);
  }*/
}
.content-row .content-col-33:nth-child(1) {
  margin-left: 0;
}
.content-row .content-col-60 {
  width: calc(60% - 18px);
  flex-grow: 0;
  flex-shrink: 0;
  margin-left: 35px;
}
.content-row .content-col-60:nth-child(1) {
  margin-left: 0;
}
.content-row .content-col-40 {
  width: calc(40% - 18px);
  flex-grow: 0;
  flex-shrink: 0;
  margin-left: 35px;
}
.content-row .content-col-40:nth-child(1) {
  margin-left: 0;
}
.content-row.small-margin {
  margin-top: 5px;
}
.content-row:nth-child(1) {
  margin-top: 0;
}
.content-row .data-item, .content-row .data-item-icon, .content-row .data-item-changeable {
  margin-left: 24px;
  /*@media (max-width: $screen-sm-max) {
    margin-left: 18px;
  }*/
}
.content-row .data-item:nth-child(1), .content-row .data-item-icon:nth-child(1), .content-row .data-item-changeable:nth-child(1) {
  margin-left: 0;
}

@media screen and (min-width: 1279px) {
  .flex-row {
    display: flex;
  }
}

/* Components */
/**
 * React Select
 * ============
 * Created by Jed Watson and Joss Mackison for KeystoneJS, http://www.keystonejs.com/
 * https://twitter.com/jedwatson https://twitter.com/jossmackison https://twitter.com/keystonejs
 * MIT License: https://github.com/JedWatson/react-select
*/
.Select {
  position: relative;
}

.Select,
.Select div,
.Select input,
.Select span {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.Select.is-disabled > .Select-control {
  background-color: #f9f9f9;
}

.Select.is-disabled .Select-arrow-zone {
  cursor: default;
  pointer-events: none;
  opacity: 0.35;
}

.Select-control {
  background-color: #fff;
  border: 1px solid #2DC46E;
  color: #333;
  cursor: default;
  display: table;
  border-spacing: 0;
  border-collapse: separate;
  height: 36px;
  outline: none;
  overflow: hidden;
  position: relative;
  width: 100%;
  border-radius: 0;
}
@media (max-width: 959px) {
  .Select-control {
    height: 29px;
    font-size: 14px;
  }
}

.Select-control .Select-input:focus {
  outline: none;
}

.is-searchable.is-open > .Select-control {
  cursor: text;
}

.is-open > .Select-control {
  background: #fff;
  border-color: #d9d9d9;
}

.is-open > .Select-control > .Select-arrow {
  border-color: #999;
  border-width: 0 5px 5px;
}

.is-searchable.is-focused:not(.is-open) > .Select-control {
  cursor: text;
}

.is-focused:not(.is-open) > .Select-control {
  border-color: #2DC46E;
}

.Select-placeholder,
.Select--single > .Select-control .Select-value {
  bottom: 0;
  left: 0;
  line-height: 34px;
  padding-left: 0;
  padding-right: 0;
  position: absolute;
  right: 25px;
  top: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: white;
  font-weight: 400 !important;
  font-size: 16px;
  z-index: 1;
}
@media (max-width: 959px) {
  .Select-placeholder,
  .Select--single > .Select-control .Select-value {
    line-height: 28px;
    font-size: 14px;
  }
}

.Select-placeholder {
  opacity: 0.9;
}

.has-value.Select--single > .Select-control .Select-value .Select-value-label,
.has-value.is-pseudo-focused.Select--single > .Select-control .Select-value .Select-value-label {
  color: #fff;
  font-weight: 700;
}

.has-value.Select--single > .Select-control .Select-value a.Select-value-label,
.has-value.is-pseudo-focused.Select--single > .Select-control .Select-value a.Select-value-label {
  cursor: pointer;
  text-decoration: none;
}

.Select-input {
  height: 34px;
  padding-left: 0;
  padding-right: 0;
  vertical-align: middle;
  width: 100% !important;
}
@media (max-width: 959px) {
  .Select-input {
    height: 28px;
  }
}

.Select-input > input {
  width: 100% !important;
  background: none transparent;
  border: 0 none;
  cursor: default;
  display: inline-block;
  font-family: inherit;
  font-size: inherit;
  margin: 0;
  outline: none;
  line-height: 14px;
  /* For IE 8 compatibility */
  padding: 8px 0 0;
  /* For IE 8 compatibility */
  -webkit-appearance: none;
}
@media (max-width: 959px) {
  .Select-input > input {
    padding: 4px 0 0;
  }
}

.is-focused .Select-input > input {
  cursor: text;
}

.has-value.is-pseudo-focused .Select-input {
  opacity: 0;
}

.Select-control:not(.is-searchable) > .Select-input {
  outline: none;
}

.Select-loading-zone {
  cursor: pointer;
  display: table-cell;
  position: relative;
  text-align: center;
  vertical-align: middle;
  width: 16px;
}

.Select-loading {
  -webkit-animation: Select-animation-spin 400ms infinite linear;
  -o-animation: Select-animation-spin 400ms infinite linear;
  animation: Select-animation-spin 400ms infinite linear;
  width: 16px;
  height: 16px;
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-right-color: #333;
  display: inline-block;
  position: relative;
  vertical-align: middle;
  border-radius: 50%;
}

.Select-clear-zone {
  -webkit-animation: Select-animation-fadeIn 200ms;
  -o-animation: Select-animation-fadeIn 200ms;
  animation: Select-animation-fadeIn 200ms;
  color: #999;
  cursor: pointer;
  display: table-cell;
  position: relative;
  text-align: center;
  vertical-align: middle;
  width: 17px;
  display: none;
}

.Select-clear-zone:hover {
  color: #D0021B;
}

.Select-clear {
  display: inline-block;
  font-size: 18px;
  line-height: 1;
}

.Select--multi .Select-clear-zone {
  width: 17px;
}

.Select-arrow-zone {
  cursor: pointer;
  display: table-cell;
  position: relative;
  text-align: center;
  vertical-align: middle;
  width: 25px;
  padding-right: 5px;
}

.Select-arrow {
  border-color: rgba(255, 255, 255, 0.75) transparent transparent;
  border-style: solid;
  border-width: 5px 5px 2.5px;
  display: inline-block;
  height: 0;
  width: 0;
}
@media (max-width: 959px) {
  .Select-arrow {
    border-width: 4px 4px 2px;
  }
}

.is-open .Select-arrow,
.Select-arrow-zone:hover > .Select-arrow {
  border-top-color: #fff;
}

.Select--multi .Select-multi-value-wrapper {
  display: inline-block;
}

.Select .Select-aria-only {
  display: inline-block;
  height: 1px;
  width: 1px;
  margin: -1px;
  clip: rect(0, 0, 0, 0);
  overflow: hidden;
}

@-webkit-keyframes Select-animation-fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes Select-animation-fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.Select-menu-outer {
  background-color: #fff;
  border: 1px solid #ccc;
  border-top-color: #e6e6e6;
  box-sizing: border-box;
  margin-top: -1px;
  max-height: 400px;
  position: absolute;
  top: 100%;
  width: 100%;
  z-index: 3;
  -webkit-overflow-scrolling: touch;
  font-weight: 500;
  font-size: 16px;
  font-family: "Source Sans Pro", Helvetica, sans-serif;
}

.Select-menu {
  max-height: 398px;
  overflow-y: auto;
}

.VirtualizedSelectOption {
  box-sizing: border-box;
  background-color: #fff;
  color: #000;
  cursor: pointer;
  display: block;
  padding: 8px 10px;
  font-size: 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  font-weight: 400;
}
@media (max-width: 959px) {
  .VirtualizedSelectOption {
    font-size: 12px;
  }
}

.VirtualizedSelectOption.VirtualizedSelectSelectedOption {
  background-color: #2DC46E !important;
  color: #fff !important;
}

.VirtualizedSelectOption.VirtualizedSelectFocusedOption {
  background-color: rgba(45, 196, 110, 0.1);
}

.VirtualizedSelectOption.VirtualizedSelectDisabledOption {
  color: #cccccc;
  cursor: default;
}

.Select-noresults {
  box-sizing: border-box;
  color: #999999;
  cursor: default;
  display: block;
  padding: 8px 10px;
}

.Select--multi .Select-input {
  vertical-align: middle;
  margin-left: 10px;
  padding: 0;
}

.Select--multi.has-value .Select-input {
  margin-left: 5px;
}

.Select--multi .Select-value {
  background-color: #ebf5ff;
  /* Fallback color for IE 8 */
  background-color: rgba(0, 126, 255, 0.08);
  border: 1px solid #c2e0ff;
  /* Fallback color for IE 8 */
  border: 1px solid rgba(0, 126, 255, 0.24);
  color: #2DC46E;
  display: inline-block;
  font-size: 0.9em;
  line-height: 1.4;
  margin-left: 5px;
  margin-top: 5px;
  vertical-align: top;
}

.Select--multi .Select-value-icon,
.Select--multi .Select-value-label {
  display: inline-block;
  vertical-align: middle;
}

.Select--multi .Select-value-label {
  cursor: default;
  padding: 2px 5px;
}

.Select--multi a.Select-value-label {
  color: #2DC46E;
  cursor: pointer;
  text-decoration: none;
}

.Select--multi a.Select-value-label:hover {
  text-decoration: underline;
}

.Select--multi .Select-value-icon {
  cursor: pointer;
  border-right: 1px solid #c2e0ff;
  /* Fallback color for IE 8 */
  border-right: 1px solid rgba(0, 126, 255, 0.24);
  padding: 1px 5px 3px;
}

.Select--multi .Select-value-icon:active {
  background-color: #c2e0ff;
  /* Fallback color for IE 8 */
  background-color: rgba(0, 126, 255, 0.24);
}

.Select--multi.is-disabled .Select-value {
  background-color: #fcfcfc;
  border: 1px solid #e3e3e3;
  color: #333;
}

.Select--multi.is-disabled .Select-value-icon {
  cursor: not-allowed;
  border-right: 1px solid #e3e3e3;
}

.Select--multi.is-disabled .Select-value-icon:hover,
.Select--multi.is-disabled .Select-value-icon:focus,
.Select--multi.is-disabled .Select-value-icon:active {
  background-color: #fcfcfc;
}

@keyframes Select-animation-spin {
  to {
    transform: rotate(1turn);
  }
}
@-webkit-keyframes Select-animation-spin {
  to {
    -webkit-transform: rotate(1turn);
  }
}
.btn {
  line-height: 44px;
  height: 46px;
  padding: 0 22px;
  text-align: center;
  color: #35B374;
  display: inline-block;
  font-size: 15px;
  cursor: pointer;
  background: transparent;
  border: 1px solid #35B374;
  outline: none;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 6px;
  font-weight: 400;
  -webkit-transition: background 300ms ease-in-out, border-color 300ms ease-in-out;
  -moz-transition: background 300ms ease-in-out, border-color 300ms ease-in-out;
  transition: background 300ms ease-in-out, border-color 300ms ease-in-out;
}
.btn:hover {
  color: #FFF;
  border-color: #FFF;
}
.btn:active {
  color: #FFF;
  background: #35B374;
  border-color: #35B374;
}
.btn.disabled, .btn:disabled {
  border-color: #3A4C5A;
  color: #3A4C5A;
  background: transparent;
}
.btn.btn-secondary {
  background: inherit;
  color: #CCC;
  border: 1px solid #CCC;
}
.btn.btn-secondary:hover {
  border-color: #35B374;
  background: #35B374;
  color: #FFF;
}
.btn.btn-block {
  display: block;
  width: 100%;
}
.btn.btn-no-pad {
  padding: 0;
}
.btn.btn-red {
  background: inherit;
  border: 1px solid #d33a61;
  color: #d33a61;
}
.btn.btn-red:hover {
  background: #a92e4e;
  color: #FFF;
}
.btn.btn-transparent {
  background: transparent !important;
}

.btn-small {
  height: auto;
  line-height: 22px;
  font-size: 14px;
}

/* Colors */
/* Fonts */
/* Dimensions */
.row:after, .content-row:after {
  content: "";
  display: table;
  clear: both;
}

#DatePickerPortal {
  z-index: 10000000;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.react-datepicker__tether-element-attached-top .react-datepicker__triangle, .react-datepicker__tether-element-attached-bottom .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow {
  margin-left: -8px;
  position: absolute;
}

.react-datepicker__tether-element-attached-top .react-datepicker__triangle, .react-datepicker__tether-element-attached-bottom .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow, .react-datepicker__tether-element-attached-top .react-datepicker__triangle::before, .react-datepicker__tether-element-attached-bottom .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before {
  box-sizing: content-box;
  position: absolute;
  border: 8px solid transparent;
  height: 0;
  width: 1px;
}

.react-datepicker__tether-element-attached-top .react-datepicker__triangle::before, .react-datepicker__tether-element-attached-bottom .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before {
  content: "";
  z-index: -1;
  border-width: 8px;
  left: -8px;
  border-bottom-color: #f6f6f6;
}

.react-datepicker__tether-element-attached-top .react-datepicker__triangle {
  top: 0;
  margin-top: -8px;
}

.react-datepicker__tether-element-attached-top .react-datepicker__triangle, .react-datepicker__tether-element-attached-top .react-datepicker__triangle::before {
  border-top: none;
  border-bottom-color: #f6f6f6;
}

.react-datepicker__tether-element-attached-top .react-datepicker__triangle::before {
  top: -1px;
  border-bottom-color: #d9d9d9;
}

.react-datepicker__tether-element-attached-bottom .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow {
  bottom: 0;
  margin-bottom: -8px;
}

.react-datepicker__tether-element-attached-bottom .react-datepicker__triangle, .react-datepicker__year-read-view--down-arrow, .react-datepicker__tether-element-attached-bottom .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before {
  border-bottom: none;
  border-top-color: #fff;
}

.react-datepicker__tether-element-attached-bottom .react-datepicker__triangle::before, .react-datepicker__year-read-view--down-arrow::before {
  bottom: -1px;
  border-top-color: #d9d9d9;
}

.react-datepicker {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 0.8rem;
  background-color: #fff;
  color: #000;
  border: 1px solid #d9d9d9;
  display: inline-block;
  position: relative;
}

.react-datepicker__triangle {
  position: absolute;
  left: 50px;
}

.react-datepicker__tether-element-attached-bottom.react-datepicker__tether-element {
  margin-top: -20px;
}

.react-datepicker__header {
  text-align: center;
  background-color: #f6f6f6;
  border-bottom: 1px solid #d9d9d9;
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
  padding-top: 8px;
  position: relative;
}

.react-datepicker__header__dropdown--select {
  margin-top: -16px;
}

.react-datepicker__year-dropdown-container--select,
.react-datepicker__month-dropdown-container--select {
  display: inline-block;
  margin: 0 2px;
}

.react-datepicker__current-month {
  margin-top: 0;
  color: #000;
  font-weight: 400;
  font-family: "Signika Negative", sans-serif;
  font-size: 0.944rem;
}

.react-datepicker__current-month--hasYearDropdown {
  margin-bottom: 16px;
}

.react-datepicker__navigation {
  width: 42px;
  height: 42px;
  text-align: center;
  cursor: pointer;
  position: absolute;
  top: 0;
  z-index: 1;
  overflow: hidden;
  background: transparent;
  border: none;
  font-size: 0;
  line-height: 0;
  text-indent: -9999px;
}
.react-datepicker__navigation:before {
  content: "";
  position: absolute;
  top: 15px;
  border-style: solid;
  border-color: transparent;
  border-width: 5px;
}

.react-datepicker__navigation--previous {
  left: 0;
}
.react-datepicker__navigation--previous:before {
  border-right-color: #999;
  left: 15px;
}

.react-datepicker__navigation--previous:hover:before {
  border-right-color: #666;
}

.react-datepicker__navigation--next {
  right: 0;
}
.react-datepicker__navigation--next:before {
  border-left-color: #999;
  right: 15px;
}

.react-datepicker__navigation--next:hover:before {
  border-left-color: #666;
}

.react-datepicker__navigation--years {
  position: relative;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.react-datepicker__navigation--years-previous {
  top: 4px;
  border-top-color: #d9d9d9;
}

.react-datepicker__navigation--years-previous:hover {
  border-top-color: #d9d9d9;
}

.react-datepicker__navigation--years-upcoming {
  top: -4px;
  border-bottom-color: #d9d9d9;
}

.react-datepicker__navigation--years-upcoming:hover {
  border-bottom-color: #d9d9d9;
}

.react-datepicker__month-container {
  display: inline;
  float: left;
}

.react-datepicker__month {
  margin: 0.4rem;
  text-align: center;
}

.react-datepicker__week-number {
  color: #ccc;
  display: inline-block;
  width: 1.7rem;
  line-height: 1.7rem;
  text-align: center;
  margin: 0.166rem;
}

.react-datepicker__day-name,
.react-datepicker__day {
  color: #000;
  display: inline-block;
  width: 2rem;
  line-height: 2rem;
  text-align: center;
}
.react-datepicker__day-name.react-datepicker__day--outside-month,
.react-datepicker__day.react-datepicker__day--outside-month {
  color: #999;
}

.react-datepicker__day {
  cursor: pointer;
}

.react-datepicker__day:hover {
  background-color: #f0f0f0;
}

.react-datepicker__day--today {
  font-weight: 400;
}

.react-datepicker__day--highlighted {
  background-color: #3dcc4a;
  color: #fff;
}

.react-datepicker__day--highlighted:hover {
  background-color: #148535;
}

.react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range {
  background-color: #148535;
  color: #fff !important;
  border-radius: 2px;
}

.react-datepicker__day--selected:hover, .react-datepicker__day--in-selecting-range:hover, .react-datepicker__day--in-range:hover {
  background-color: #148535;
}

.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range) {
  background-color: rgba(33, 107, 165, 0.5);
}

.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range) {
  background-color: #f0f0f0;
  color: #000;
}

.react-datepicker__day--disabled {
  cursor: default;
  color: #ccc;
}

.react-datepicker__day--disabled:hover {
  background-color: transparent;
}

.react-datepicker__input-container {
  position: relative;
  display: inline-block;
}
.react-datepicker__input-container input:disabled {
  color: #637581;
  border-bottom-color: #637581;
}
.react-datepicker__input-container input:disabled::placeholder {
  color: #637581;
}

.react-datepicker__year-read-view {
  width: 50%;
  left: 25%;
  position: absolute;
  bottom: 25px;
  border: 1px solid transparent;
}

.react-datepicker__year-read-view:hover {
  cursor: pointer;
}

.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow {
  border-top-color: #d9d9d9;
}

.react-datepicker__year-read-view--down-arrow {
  border-top-color: #ccc;
  margin-bottom: 3px;
  left: 5px;
  top: 9px;
  position: relative;
  border-width: 0.45rem;
}

.react-datepicker__year-read-view--selected-year {
  right: 0.45rem;
  position: relative;
}

.react-datepicker__year-dropdown {
  background-color: #f0f0f0;
  position: absolute;
  width: 50%;
  left: 25%;
  top: 30px;
  text-align: center;
  border: 1px solid #d9d9d9;
}

.react-datepicker__year-dropdown:hover {
  cursor: pointer;
}

.react-datepicker__year-dropdown--scrollable {
  height: 150px;
  overflow-y: scroll;
}

.react-datepicker__year-option {
  line-height: 20px;
  width: 100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.react-datepicker__year-option:first-of-type {
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
}

.react-datepicker__year-option:last-of-type {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border-bottom-left-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}

.react-datepicker__year-option:hover {
  background-color: #ccc;
}

.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming {
  border-bottom-color: #d9d9d9;
}

.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous {
  border-top-color: #d9d9d9;
}

.react-datepicker__year-option--selected {
  position: absolute;
  left: 30px;
}

.react-datepicker__close-icon {
  background-color: transparent;
  border: 0;
  cursor: pointer;
  display: inline-block;
  height: 0;
  outline: 0;
  padding: 0;
  vertical-align: middle;
}

.react-datepicker__close-icon::after {
  background-color: #216ba5;
  border-radius: 50%;
  bottom: 0;
  box-sizing: border-box;
  color: #fff;
  content: "×";
  cursor: pointer;
  font-size: 12px;
  height: 16px;
  width: 16px;
  line-height: 1;
  margin: -8px auto 0;
  padding: 2px;
  position: absolute;
  right: 7px;
  text-align: center;
  top: 50%;
}

.react-datepicker__today-button {
  background: #f0f0f0;
  border-top: 1px solid #d9d9d9;
  cursor: pointer;
  text-align: center;
  font-weight: 400;
  padding: 5px 0;
}

.react-datepicker__tether-element {
  z-index: 2147483647;
}

@media (max-width: 767px) {
  .popper {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    transform: none !important;
  }
}
@keyframes animatedBackground {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 160px 0;
  }
}
.loader {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(38, 55, 66, 0.99);
  will-change: opacity;
  z-index: 102;
}
.loader.matches-loader {
  top: 80px;
  position: relative;
  background: none;
  opacity: 1;
}
.loader .loader-image {
  width: 120px;
  height: 120px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -60px 0 0 -60px;
}
@media (max-width: 959px) {
  .loader .loader-image {
    width: 120px;
    height: 120px;
    margin: -60px 0 0 -60px;
  }
}
.loader .loader-message {
  margin-top: 24px;
  width: 360px;
  margin-left: -120px;
  text-align: center;
  color: #CCC;
}
.loader.modal-enter {
  opacity: 0;
}
.loader.modal-enter-active {
  opacity: 1;
  -webkit-transition: opacity 500ms ease-out;
  -moz-transition: opacity 500ms ease-out;
  transition: opacity 500ms ease-out;
}
.loader.modal-leave {
  opacity: 1;
}
.loader.modal-leave-active {
  opacity: 0;
  -webkit-transition: opacity 500ms ease-out;
  -moz-transition: opacity 500ms ease-out;
  transition: opacity 500ms ease-out;
}

.modal-overlay {
  background: rgba(38, 55, 66, 0.5);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 255;
}

.modal {
  background: #263742;
  padding: 29px;
  width: 387px;
  margin: 10% auto 0;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
  max-width: 100%;
}
.modal .modal-title {
  font-weight: 700;
}
.modal .modal-subtitle {
  text-transform: uppercase;
  color: #ADADAD;
  letter-spacing: 0.05em;
  font-size: 15px;
  margin-top: 10px;
}
.modal form {
  margin-top: 28px;
}
.modal form input {
  background: #485D6A;
  border-radius: 2px;
  border: none;
  padding: 12px 14px;
  font-family: "Source Sans Pro", Helvetica, sans-serif;
  font-weight: 400;
  font-size: 18px;
}
.modal form .btn {
  margin-top: 16px;
  min-width: 100px;
}
.modal form .btn:disabled {
  background: grey !important;
}

.notification-container {
  box-sizing: border-box;
  position: fixed;
  bottom: 15px;
  left: 0px;
  z-index: 999999;
  padding: 0px 15px;
  max-height: calc(100% - 30px);
}

.notification {
  box-sizing: border-box;
  padding: 12px 15px 12px 15px;
  border-radius: 4px;
  color: #eff5fa;
  font-weight: 700;
  background-color: #ccc;
  box-shadow: none;
  cursor: pointer;
  font-size: 15px;
  line-height: 20px;
  position: relative;
  opacity: 0.9;
  margin-top: 15px;
}
.notification .title {
  font-size: 1em;
  line-height: 1.2em;
  font-weight: bold;
  margin: 0 0 5px 0;
}
.notification:hover, .notification:focus {
  opacity: 1;
}

.notification-enter {
  visibility: hidden;
  transform: translate3d(0, 100%, 0);
}

.notification-enter.notification-enter-active {
  visibility: visible;
  transform: translate3d(0, 0, 0);
  transition: all 0.4s;
}

.notification-exit {
  visibility: visible;
  transform: translate3d(0, 0, 0);
}

.notification-exit.notification-exit-active {
  visibility: hidden;
  transform: translate3d(0, 100%, 0);
  transition: all 0.4s;
}

.notification-info {
  background-color: #354551;
}

.notification-success {
  background-color: #51a351;
}

.notification-warning {
  background-color: #f89406;
}

.notification-error {
  background-color: #D95252;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
/* Colors */
/* Fonts */
/* Dimensions */
.navigation {
  background: #19242b;
  width: 64px;
  position: relative;
}
@media (max-width: 959px) {
  .navigation {
    width: 40px;
  }
}
.navigation .logo {
  width: 48px;
  height: 48px;
  margin: 8px;
}
@media (max-width: 959px) {
  .navigation .logo {
    width: 24px;
    height: 24px;
    margin: 6px;
  }
}
.navigation .links {
  position: absolute;
  top: 70px;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 470px;
}
@media (max-width: 959px) {
  .navigation .links {
    position: relative;
    margin-top: 10px;
    top: auto;
    bottom: auto;
    left: auto;
    right: auto;
  }
}
.navigation .links li {
  width: 100%;
}
.navigation .links li:nth-child(1) {
  position: absolute;
  top: 0;
}
.navigation .links li:nth-child(2) {
  position: absolute;
  top: 58px;
}
.navigation .links li:nth-child(3) {
  position: absolute;
  top: 116px;
}
.navigation .links li:nth-child(4) {
  position: absolute;
  top: 174px;
}
.navigation .links li:nth-child(5) {
  position: absolute;
  top: 232px;
}
.navigation .links a {
  display: block;
  padding: 18px 20px;
  font-size: 0;
}
.navigation .links a svg {
  stroke: #CCCCCC;
  fill: none;
}
.navigation .links a svg.svg-active {
  display: none;
}
.navigation .links a svg.svg-inactive {
  display: block;
}
.navigation .links a.reports svg {
  fill: #CCCCCC;
  stroke: none;
}
.navigation .links a.reports:hover svg {
  fill: #2DC46E;
  stroke: none;
}
.navigation .links a.watchlists svg {
  fill: #CCCCCC;
  stroke: none;
}
.navigation .links a.watchlists:hover svg {
  fill: #2DC46E;
  stroke: none;
}
.navigation .links a:hover svg {
  stroke: #2DC46E;
}
.navigation .links a.active {
  background: #22323c;
}
.navigation .links a.active svg {
  stroke: #FFF;
}
.navigation .links a.active svg.svg-active {
  display: block;
  fill: #FFF;
  stroke: none;
}
.navigation .links a.active svg.svg-inactive {
  display: none;
}
@media (max-width: 959px) {
  .navigation .links a {
    padding: 14px 11px;
  }
}
.navigation .links svg {
  width: 22px;
  height: 22px;
}
@media (max-width: 959px) {
  .navigation .links svg {
    width: 18px;
    height: 18px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.confirm-modal {
  width: 437px;
  background: #1B262E;
  position: relative;
}
.confirm-modal .close-icon {
  position: absolute;
  top: 28px;
  right: 28px;
  width: 8px;
  height: 8px;
  cursor: pointer;
}
.confirm-modal .body {
  margin: 0 0 20px;
}
.confirm-modal .buttons {
  text-align: right;
}
.confirm-modal .buttons .btn {
  min-width: 124px;
  margin-left: 20px;
  margin-top: 20px;
  padding: 0 30px;
}
.confirm-modal .buttons .btn:disabled {
  background: grey;
}
.confirm-modal .confirm-body p {
  margin-top: 20px;
  line-height: 145%;
}
.confirm-modal .confirm-body .h2 {
  font-weight: 700;
  font-size: 19px;
  margin: 0 0 1px;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, 0.95);
}
@media (max-width: 959px) {
  .confirm-modal .confirm-body .h2 {
    font-size: 14px;
  }
}
.confirm-modal .confirm-body .with-checkbox {
  position: relative;
  padding-left: 35px;
}
.confirm-modal .confirm-body .checkbox {
  position: absolute;
  left: 0;
  top: 6px;
  width: 24px;
  height: 24px;
  border: 1px solid #FFF;
  cursor: pointer;
}
.confirm-modal .confirm-body .checkbox svg {
  width: 20px;
  height: 20px;
  display: none;
}
.confirm-modal .confirm-body .checkbox.checked svg {
  display: block;
}

@media (max-width: 959px) {
  .modal-overlay {
    overflow-y: scroll;
    padding-bottom: 10%;
  }
}

.ReactModalPortal {
  position: fixed;
  z-index: 2147483648 !important;
}
/* Colors */
/* Fonts */
/* Dimensions */
.confetti {
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -300px;
  margin-top: -300px;
  pointer-events: none;
}

.confirm-modal.congratulations-confirm {
  width: 582px;
  background: #2D3B46;
  border-radius: 6px;
}
.confirm-modal.congratulations-confirm .buttons {
  text-align: left;
}
.confirm-modal.congratulations-confirm .buttons .btn {
  margin-left: 0;
}

.congratulations__heading {
  font-size: 13px;
  line-height: 16px;
  text-transform: uppercase;
  margin-bottom: 32px;
}
.congratulations__heading svg {
  width: 13px;
  height: 13px;
  vertical-align: baseline;
  display: inline-block;
  margin-right: 4px;
}
.congratulations__body .text h4 {
  font-size: 16px;
  font-weight: bold;
  margin: 0 0 16px;
}
.congratulations__body .text h4 strong {
  color: #2DC46E;
}
.congratulations__body .text p {
  margin-top: 16px;
}
.congratulations__row {
  display: flex;
}
.congratulations__row .icon {
  margin-right: 36px;
  position: relative;
}
.congratulations__row .icon svg {
  width: 45px;
  height: 45px;
}
.congratulations__row .icon svg.upgrade-icon-big {
  width: 81px;
  height: 81px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.fade-wrapper {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: fixed;
  display: flex;
  align-content: center;
  align-items: center;
  z-index: 999999;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.65);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.fade-wrapper.with-logo {
  flex-direction: column;
}
.fade-wrapper.with-logo .fade-body {
  width: 100%;
  height: calc(100vh - 121px);
  min-height: 601px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media screen and (max-width: 959px) {
  .fade-wrapper.with-logo .fade-body {
    display: block;
    padding: 24px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.c-checkbox {
  width: 16px;
  height: 16px;
  display: inline-block;
  border: 1px solid #2DC46E;
  border-radius: 4px;
  position: relative;
  cursor: pointer;
}
.c-checkbox .checkbox-mark {
  fill: #FFF;
  width: 12px;
  height: 12px;
  position: absolute;
  top: 50%;
  margin-top: -6px;
  left: 50%;
  margin-left: -6px;
}
.c-checkbox.checked {
  background: #2DC46E;
}

.r-checkbox {
  box-sizing: border-box;
  position: relative;
  cursor: pointer;
  display: inline-block;
  width: 40px;
  height: 24px;
  color: #A4A6A4;
  border: 1px solid;
  border-radius: 12px;
  transition-property: color;
  transition-duration: 0.25s;
  transition-timing-function: ease-out;
}
.r-checkbox .round-checkmark {
  display: block;
  position: absolute;
  width: 16px;
  height: 16px;
  left: 0;
  transform: translateX(3px);
  top: 3px;
  background-color: #A4A6A4;
  border-radius: 8px;
  transition-property: transform, background-color;
  transition-duration: 0.25s;
  transition-timing-function: ease-out;
}
.r-checkbox.checked {
  color: #35B374;
}
.r-checkbox.checked .round-checkmark {
  transform: translateX(19px);
  background-color: #35B374;
}
/* Colors */
/* Fonts */
/* Dimensions */
.survey-form {
  padding: 24px 32px;
  background: #FFF;
  max-width: 660px;
  min-width: 320px;
  margin: 0 auto;
  color: #1C2734;
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 16px;
  line-height: 24px;
  border-radius: 12px;
}
.survey-form h1, .survey-form h3 {
  margin: 0;
  font-size: 24px;
  line-height: 32px;
}
.survey-form h1 {
  font-weight: bold;
}
.survey-form h3 {
  font-weight: 400;
}
.survey-form .reason {
  position: relative;
  background: #F1F4F6;
  padding: 12px 16px 16px 56px;
  border-radius: 4px;
  margin-top: 16px;
  font-size: 16px;
  line-height: 24px;
  min-height: 80px;
  cursor: pointer;
  user-select: none;
}
.survey-form .reason .c-checkbox {
  position: absolute;
  left: 16px;
  top: 16px;
  width: 24px;
  height: 24px;
  pointer-events: none;
}
.survey-form .reason .c-checkbox svg {
  width: 14px;
  height: 14px;
  margin-left: -7px;
  margin-top: -7px;
}
.survey-form .reason .reason-name {
  font-weight: bold;
  vertical-align: middle;
}
.survey-form .reason .reason-name svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  display: inline-block;
  position: relative;
  margin-right: 6px;
  top: 4px;
}
.survey-form .reason .other-input {
  display: block;
  margin-top: 8px;
  color: #1C2734;
  background: #FFF;
  border: none;
  padding: 12px 16px;
  font-size: 16px;
  line-height: 24px;
  border-radius: 4px;
  border-bottom: 2px transparent;
}
.survey-form .reason .other-input::placeholder {
  color: #808080;
}
.survey-form .reason .other-input.error {
  border-bottom: 2px solid #d33a61;
}
.survey-form .reason .other-input.error::placeholder {
  color: #d33a61;
}
.survey-form .submit-row {
  text-align: right;
  margin-top: 16px;
}
.survey-form .submit-row .btn {
  border: none;
  background: #35B374;
  color: #FFF;
}
.survey-form .submit-row .btn:hover {
  background: #1C2734;
  color: #FFF;
}
.survey-form .submit-row .btn.disabled {
  background: #5F7582;
  color: #CCC;
  cursor: default;
  pointer-events: none;
}
.survey-form .submit-row .btn.disabled:hover {
  background: #5F7582;
  color: #FFF;
}
/* Colors */
/* Fonts */
/* Dimensions */
.app-container {
  display: flex;
}
.app-container .app-content {
  width: calc(100% - 64px);
  background: #22323c;
}
@media (max-width: 959px) {
  .app-container .app-content {
    width: calc(100% - 40px);
  }
}

.privacy-confirm p {
  margin-top: 20px;
  line-height: 145%;
}
.privacy-confirm .h2 {
  font-weight: 700;
  font-size: 19px;
  margin: 0 0 1px;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, 0.95);
}
@media (max-width: 959px) {
  .privacy-confirm .h2 {
    font-size: 14px;
  }
}
.privacy-confirm .with-checkbox {
  position: relative;
  padding-left: 35px;
}

.checkbox {
  position: absolute;
  left: 0;
  top: 6px;
  width: 24px;
  height: 24px;
  border: 1px solid #FFF;
  cursor: pointer;
}
.checkbox svg {
  width: 20px;
  height: 20px;
  display: none;
}
.checkbox.checked svg {
  display: block;
}

.reports-limit-message {
  color: #FFF;
  background: #1E2A31;
  padding: 25px;
}

.restart-subscription {
  background: #47226E;
  border-radius: 6px;
  box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1);
  margin: 60px 40px 0px 25px;
  padding: 20px 25px 25px;
  font-size: 18px;
  line-height: 26px;
  color: rgba(255, 255, 255, 0.75);
  text-align: left;
}
.restart-subscription.main-message {
  position: absolute;
  top: 0;
  left: 65px;
  right: 0;
  z-index: 999;
  margin: 0;
  box-sizing: border-box;
  padding-right: 64px;
}
.restart-subscription.main-message.minimized {
  position: relative;
  left: 0;
  padding: 10px;
  text-align: center;
  font-size: 14px;
  line-height: 20px;
}
.restart-subscription.main-message.minimized a {
  color: #FFF;
  text-decoration: underline;
}
.restart-subscription.main-message .close {
  cursor: pointer;
  z-index: 2;
  position: absolute;
  width: 24px;
  height: 24px;
  right: 24px;
  top: 24px;
  display: block;
}
.restart-subscription.main-message .close svg {
  width: 24px;
  height: 24px;
}
@media (max-width: 959px) {
  .restart-subscription.main-message {
    left: 40px;
  }
}
.restart-subscription.watchlist {
  margin-top: 45px;
  font-size: 18px;
  line-height: 26px;
  color: rgba(255, 255, 255, 0.75);
  text-align: left;
  opacity: 0.8;
  font-weight: 400;
  letter-spacing: 0.2px;
  margin-left: 0;
}
.restart-subscription h2 {
  font-weight: 700;
  font-size: 21px;
  line-height: 28px;
  letter-spacing: 0.1px;
}
.restart-subscription h5 {
  opacity: 0.7;
  font-size: 15px;
}
.restart-subscription h5 + h5 {
  margin-top: 25px;
}
.restart-subscription .p__btn {
  margin: 15px 0px 0px;
}
@media (max-width: 959px) {
  .restart-subscription {
    margin: 20px 30px 0px 5px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.match {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #263742;
  z-index: 1;
  will-change: transform, opacity;
  -webkit-transition: left 500ms, right 500ms;
  -moz-transition: left 500ms, right 500ms;
  transition: left 500ms, right 500ms;
  -webkit-user-select: none; /* Chrome all / Safari all */
  -moz-user-select: none; /* Firefox all */
  -ms-user-select: none; /* IE 10+ */
  user-select: none; /* Likely future */
}
.match .match__close {
  position: absolute;
  top: 20px;
  right: 20px;
  padding: 10px;
  cursor: pointer;
}
@media (max-width: 959px) {
  .match .match__close {
    top: 3px;
    right: 3px;
  }
}
.match .match__close svg {
  width: 24px;
  height: 24px;
}
@media (max-width: 959px) {
  .match .match__close svg {
    width: 18px;
    height: 18px;
  }
}
.match.side-controls--visible {
  left: -285px;
  right: 285px;
}
@media (max-width: 959px) {
  .match.side-controls--visible {
    left: -170px;
    right: 170px;
  }
}
.match.side-add-player--visible {
  left: 285px;
  right: -285px;
}
@media (max-width: 959px) {
  .match.side-add-player--visible {
    left: 186px;
    right: -186px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.sidebar {
  position: relative;
  min-height: 100%;
  float: left;
  width: 285px;
  background: #324859;
  margin-left: -285px;
  -webkit-transition: margin-left 0.5s ease-out;
  -moz-transition: margin-left 0.5s ease-out;
  transition: margin-left 0.5s ease-out;
}
@media (max-width: 959px) {
  .sidebar {
    width: 170px;
    margin-left: -170px;
  }
}
.sidebar--visible .sidebar {
  margin-left: 0;
}
.sidebar .toggle-btn {
  display: inline-block;
  cursor: pointer;
  position: absolute;
  top: 25px;
  right: -60px;
  z-index: 2;
  padding: 10px;
}
@media (max-width: 959px) {
  .sidebar .toggle-btn {
    top: 4px;
    right: -40px;
  }
}
.sidebar .toggle-btn svg {
  vertical-align: middle;
  width: 26px;
  height: 26px;
}
@media (max-width: 959px) {
  .sidebar .toggle-btn svg {
    width: 16px;
    height: 16px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.tabs {
  font-size: 16px;
  font-weight: 300;
  line-height: 0;
  background: #3B5569;
  display: flex;
}
@media (max-width: 959px) {
  .tabs {
    font-size: 12px;
  }
}
.tabs a {
  color: #2DC46E;
  border-bottom: 2px solid #495D6A;
  line-height: 45px;
  cursor: pointer;
  padding: 10px 0 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: 0.5px;
  font-weight: 400;
  text-align: center;
  -webkit-flex-grow: 1;
  -moz-flex-grow: 1;
  flex-grow: 1;
  -ms-flex-positive: 1;
}
@media (max-width: 959px) {
  .tabs a {
    line-height: 26px;
    padding: 5px 4px 0;
  }
}
.tabs a:hover {
  color: #fff;
}
.tabs a.active {
  color: #fff;
  font-weight: 700;
}
.tabs a.active {
  border-bottom-color: rgba(255, 255, 255, 0.7);
  font-weight: 700;
}
/* Colors */
/* Fonts */
/* Dimensions */
.sub-tabs {
  font-size: 15px;
  font-weight: 500;
  height: 50px;
  background: #324859;
}
@media (max-width: 959px) {
  .sub-tabs {
    font-size: 12px;
    height: 32px;
  }
}
.sub-tabs a {
  color: #2DC46E;
  display: inline-block;
  width: 50%;
  border-bottom: 1px solid #495D6A;
  line-height: 49px;
  cursor: pointer;
  padding: 0 1px 0 36px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
}
@media (max-width: 959px) {
  .sub-tabs a {
    line-height: 32px;
    padding: 0 3px 0 19px;
  }
}
.sub-tabs a:hover, .sub-tabs a.active {
  color: #fff;
}
.sub-tabs a.active {
  border-bottom-color: #fff;
  font-weight: 700;
}
.sub-tabs a .team-image {
  position: absolute;
  top: 50%;
  left: 14px;
  margin-top: -9px;
  width: 17px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
@media (max-width: 959px) {
  .sub-tabs a .team-image {
    left: 4px;
    margin-top: -6px;
    width: 12px;
    height: 13px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.players__save-default-lineup-btn {
  border-top: 1px solid #1C2830;
}
.players__save-default-lineup {
  background: #253540;
  color: #2DC46E;
  position: relative;
  padding: 15px 10px 20px 40px;
  display: block;
  cursor: pointer;
  vertical-align: middle;
}
.players__save-default-lineup svg {
  box-sizing: content-box;
  fill: none;
  stroke-width: 4px;
  stroke: #2DC46E;
  display: inline-block;
  width: 22px;
  height: 16px;
  vertical-align: middle;
  position: absolute;
  top: 26px;
  left: 10px;
  margin-top: -7px;
}
.players__save-default-lineup:hover {
  color: #FFF;
}
.players__save-default-lineup:hover svg {
  stroke: #FFF;
}
.players .players-group .group-action {
  font-size: 14px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: #253540;
  padding: 12px 10px 12px 39px;
  position: relative;
  display: block;
  cursor: pointer;
  box-shadow: 0px 4px 8px rgba(21, 28, 33, 0.3), 0px -6px 8px rgba(21, 28, 33, 0.1);
  z-index: 1;
}
.players .players-group .group-action.down {
  box-shadow: none;
}
@media (max-width: 959px) {
  .players .players-group .group-action {
    font-size: 11px;
    padding: 7px 5px 7px 22px;
  }
}
.players .players-group .group-action svg {
  width: 11px;
  height: 11px;
  position: absolute;
  top: 50%;
  left: 17px;
  margin-top: -6px;
}
@media (max-width: 959px) {
  .players .players-group .group-action svg {
    width: 8px;
    height: 8px;
    margin-top: -5px;
    left: 7px;
  }
}
.players .players-group .group-list {
  overflow: hidden;
  -webkit-transition: max-height 0.2s ease-out;
  -moz-transition: max-height 0.2s ease-out;
  transition: max-height 0.2s ease-out;
}
/* Colors */
/* Fonts */
/* Dimensions */
.player {
  position: relative;
  padding: 2px 55px 2px 69px;
  height: 40px;
  font-weight: 500;
  font-size: 15px;
  background: #1C2830;
}
@media (max-width: 959px) {
  .player {
    padding: 0 24px 0 50px;
    height: 33px;
    font-size: 11px;
  }
}
.player:nth-child(even) {
  background-color: #212f38;
}
.player.disabled {
  color: rgba(255, 255, 255, 0.3);
}
.player.disabled .player__image,
.player.disabled .player-grab,
.player.disabled .player__edit {
  opacity: 0.2 !important;
  cursor: default;
}
.player .player__number {
  font-size: 15px;
  text-align: right;
  width: 28px;
  line-height: 40px;
  position: absolute;
  top: 0;
  left: 0;
}
@media (max-width: 959px) {
  .player .player__number {
    font-size: 12px;
    width: 21px;
    line-height: 33px;
  }
}
.player .player__image {
  position: absolute;
  top: 50%;
  left: 40px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 20px;
  height: 30px;
  margin-top: -15px;
  border-radius: 3px;
}
@media (max-width: 959px) {
  .player .player__image {
    left: 27px;
    width: 16px;
    height: 22px;
    margin-top: -11px;
  }
}
.player .player__name {
  margin-right: 2%;
  width: 77%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 35px;
  display: inline-block;
  font-size: 15px;
}
@media (max-width: 959px) {
  .player .player__name {
    line-height: 32px;
    font-size: 12px;
  }
}
.player .player__position {
  width: 16%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 300;
  font-size: 14px;
  line-height: 35px;
  display: inline-block;
}
@media (max-width: 959px) {
  .player .player__position {
    font-size: 11px;
    line-height: 33px;
    display: none;
  }
}
.player .player__edit {
  width: 5%;
  display: inline-block;
  line-height: 35px;
  font-size: 14px;
  font-weight: 300;
  vertical-align: top;
  cursor: pointer;
}
.player .player__edit svg {
  width: 12px;
  height: 12px;
  color: #2DC46E;
}
.player .player__edit:hover svg {
  color: #FFF;
}
@media (max-width: 959px) {
  .player .player__edit {
    font-size: 11px;
    line-height: 33px;
  }
}
.player .player-grab {
  position: absolute;
  top: 50%;
  right: 0px;
  margin-top: -22px;
  color: #2DC46E;
  padding: 12px 18px 11px 16px;
  cursor: pointer;
  cursor: grab;
}
.player .player-grab:hover {
  color: white;
}
@media (max-width: 959px) {
  .player .player-grab {
    margin-top: -14px;
    padding: 7px 18px 7px 10px;
  }
}
.player .player-grab svg {
  width: 20px;
  height: 12px;
}
@media (max-width: 959px) {
  .player .player-grab svg {
    height: 10px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
@media (max-width: 959px) {
  .add-player-action {
    height: 32px;
  }
}
.add-player-action:nth-child(even) {
  background-color: #2C3E4A;
}
.add-player-action .add-btn {
  font-weight: 500;
  font-size: 16px;
  position: relative;
  padding: 15px 10px 20px 40px;
  display: block;
  cursor: pointer;
  background-color: #253540;
  color: #2DC46E;
}
.add-player-action .add-btn:hover {
  color: white;
}
@media (max-width: 959px) {
  .add-player-action .add-btn {
    font-size: 12px;
    padding: 8px 5px 8px 30px;
  }
}
.add-player-action .add-btn svg {
  position: absolute;
  top: 26px;
  left: 14px;
  margin-top: -7px;
  width: 15px;
  height: 15px;
}
@media (max-width: 959px) {
  .add-player-action .add-btn svg {
    left: 8px;
    margin-top: -16px;
    width: 12px;
    height: 12px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.notes {
  position: absolute;
  right: 0;
  left: 0;
}
.notes .note {
  position: relative;
  height: 50%;
}
.notes .team {
  color: #fff;
  line-height: 37px;
  padding: 6px 0 0 22px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
  font-size: 15px;
  margin: 0 15px;
}
@media (max-width: 959px) {
  .notes .team {
    line-height: 24px;
    padding: 3px 0 0 16px;
    font-size: 12px;
    margin: 0 10px;
  }
}
.notes .team .team-image {
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -6px;
  width: 17px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
@media (max-width: 959px) {
  .notes .team .team-image {
    margin-top: -5px;
    width: 12px;
    height: 14px;
  }
}
.notes .teamnotes {
  position: absolute;
  top: 46px;
  right: 0;
  bottom: 0;
  left: 0;
}
@media (max-width: 959px) {
  .notes .teamnotes {
    top: 27px;
  }
}
.notes .teamnotes textarea {
  width: 100%;
  height: 100%;
  resize: none;
  border: none;
  padding: 13px 16px;
  color: #fff;
  font-size: 15px;
  line-height: 20px;
  background: #2c404f;
  border-radius: 4px;
}
@media (max-width: 959px) {
  .notes .teamnotes textarea {
    padding: 10px;
    font-size: 12px;
    line-height: 16px;
  }
}
.notes .teamnotes textarea::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
/* Colors */
/* Fonts */
/* Dimensions */
.history {
  position: absolute;
  right: 0;
  left: 0;
  background: #324859;
}
.history .history-group {
  text-transform: uppercase;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, 0.7);
  padding: 24px 0 8px 15px;
}
.history .history-group:nth-child(odd) {
  background: #303F4E;
}
.history .story {
  padding: 12px 15px 12px 75px;
  position: relative;
  font-size: 16px;
  line-height: 19px;
}
@media (max-width: 959px) {
  .history .story {
    padding: 6px 8px 6px 45px;
    font-size: 12px;
    line-height: 14px;
  }
}
.history .story .story-name {
  margin: 0 0 5px;
}
.history .story .story-icon {
  width: 16px;
  height: 16px;
  display: inline-block;
  position: relative;
  top: 2px;
  margin-right: 4px;
}
@media (max-width: 959px) {
  .history .story .story-icon {
    width: 13px;
    height: 13px;
  }
}
.history .story .story-icon__event {
  top: 4px;
  fill: none;
  stroke: #FFF;
}
.history .story:nth-child(odd) {
  background: #303F4E;
}
.history .story .story-time {
  position: absolute;
  top: 12px;
  left: 15px;
}
.history .story .story-time__single {
  top: 19px;
}
@media (max-width: 959px) {
  .history .story .story-time {
    top: 6px;
    left: 7px;
  }
  .history .story .story-time__single {
    top: 12px;
  }
}
.history .story .story-image {
  position: absolute;
  top: 37px;
  left: 23px;
  width: 20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
@media (max-width: 959px) {
  .history .story .story-image {
    top: 33px;
    left: 13px;
    width: 14px;
    height: 14px;
  }
}
.history .story .story-value {
  white-space: nowrap;
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 8px;
  height: 32px;
  line-height: 32px;
  border-radius: 16px;
  max-width: 100%;
  position: relative;
}
@media (max-width: 959px) {
  .history .story .story-value {
    height: 26px;
    line-height: 26px;
  }
}
.history .story .story-value.story-value-2 {
  background: #7CB4D3;
}
.history .story .story-value.story-value-1 {
  background: #7CB4D3;
}
.history .story .story-value.story-value0 {
  background: #A4A6A4;
}
.history .story .story-value.story-value1 {
  background: #EB8C49;
}
.history .story .story-value.story-value2 {
  background: #CA5425;
}
.history .story .story-delete {
  position: absolute;
  top: 50%;
  right: 15px;
  margin-top: -11px;
  color: #d33a61;
  z-index: 3;
}
@media (max-width: 959px) {
  .history .story .story-delete {
    margin-top: -10px;
    right: 10px;
  }
}
.history .story .story-delete svg {
  width: 22px;
  height: 22px;
}
@media (max-width: 959px) {
  .history .story .story-delete svg {
    width: 16px;
    height: 16px;
  }
}
.history.edit .story {
  padding-right: 43px;
}
.history .history-header {
  height: 46px;
  background: #324859;
  text-align: justify;
  line-height: 50px;
  text-transform: uppercase;
  font-size: 14px;
}
@media (max-width: 959px) {
  .history .history-header {
    font-size: 11px;
    height: 32px;
    line-height: 32px;
  }
}
.history .history-header .title, .history .history-header .edit-btn {
  display: inline-block;
  padding: 0 15px;
  letter-spacing: 1px;
}
@media (max-width: 959px) {
  .history .history-header .title, .history .history-header .edit-btn {
    padding: 0 5px;
    letter-spacing: 0.2px;
  }
}
.history .history-header .edit-btn {
  letter-spacing: 0.2px;
  color: #2DC46E;
  font-size: 11px;
}
.history .history-header:after {
  display: inline-block;
  width: 99%;
  overflow: hidden;
  height: 0;
  content: " ";
}
.history .history-list {
  overflow: auto;
}
.history .substitution-icon {
  border-style: solid;
  height: 0;
  width: 0;
  display: inline-block;
  vertical-align: middle;
  margin-right: 4px;
}
.history .substitution-icon.substitution_in {
  border-color: transparent transparent #35B374;
  border-width: 0 8px 10px;
}
.history .substitution-icon.substitution_out {
  border-color: #d33a61 transparent transparent;
  border-width: 10px 8px 0;
}
/* Colors */
/* Fonts */
/* Dimensions */
.pitch {
  padding: 20px 0 20px 20px;
  text-align: center;
  margin-right: 50px;
  height: 100%;
  position: relative;
  font-size: 0;
  -webkit-transition: margin 0.5s ease-out;
  -moz-transition: margin 0.5s ease-out;
  transition: margin 0.5s ease-out;
  z-index: 1;
}
@media (max-width: 959px) {
  .pitch {
    padding: 10px 0 10px 10px;
    margin-left: 27px;
    margin-right: 25px;
  }
}
.pitch:before {
  box-shadow: 0 0 8px rgba(21, 28, 33, 0.3);
  z-index: 1;
  content: "";
  pointer-events: none;
  position: absolute;
  top: 0;
  right: -50px;
  bottom: 0;
  left: 0;
}
.sidebar--visible .pitch {
  margin-left: 285px;
}
@media (max-width: 959px) {
  .sidebar--visible .pitch {
    margin-left: 170px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.area {
  margin-top: 20px;
  font-size: 0;
  display: inline-block;
  position: relative;
}
@media (max-width: 959px) {
  .area {
    margin-top: 10px;
  }
}
.area .area__svg {
  display: inline-block;
}
.area .area__svg, .area .area__svg rect {
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
}
.area .area__svg .pixel-perfect {
  shape-rendering: crispEdges;
}
/* Colors */
/* Fonts */
/* Dimensions */
.area-players {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.area-players .get-started {
  position: absolute;
  top: 0;
  right: -50px;
  bottom: -144px;
  left: -20px;
  background: rgba(38, 55, 66, 0.9);
  z-index: 1;
  font-size: 18px;
}
@media (max-width: 959px) {
  .area-players .get-started {
    font-size: 14px;
    bottom: -86px;
    right: -32px;
  }
}
.area-players .get-started .align {
  display: inline-block;
  text-align: left;
  margin-top: 10%;
}
@media (max-width: 959px) {
  .area-players .get-started .align {
    margin-top: 5%;
  }
}
.area-players .get-started h2 {
  font-size: 28px;
  font-weight: bold;
}
@media (max-width: 959px) {
  .area-players .get-started h2 {
    font-size: 18px;
  }
}
.area-players .get-started ol {
  list-style-type: decimal;
  padding-left: 20px;
  margin-top: 30px;
}
@media (max-width: 959px) {
  .area-players .get-started ol {
    margin-top: 10px;
    padding-left: 15px;
  }
}
.area-players .get-started ol li {
  margin-top: 10px;
}
.area-players .get-started .btn {
  margin-top: 40px;
  padding: 0 50px;
}
@media (max-width: 959px) {
  .area-players .get-started .btn {
    margin-top: 15px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
@-webkit-keyframes preview-end {
  from {
    -webkit-transform: scale(1.1);
  }
  to {
    -webkit-transform: scale(1);
  }
}
@-moz-keyframes preview-end {
  from {
    -moz-transform: scale(1.1);
  }
  to {
    -moz-transform: scale(1);
  }
}
@keyframes preview-end {
  from {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  to {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
.area-player {
  width: 42px;
  height: 42px;
  margin: -21px 0 0 -21px;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 50%;
  cursor: pointer;
  z-index: 1;
  -webkit-transition-property: left, top, -webkit-transform;
  -moz-transition-property: left, top, -moz-transform;
  transition-property: left, top, transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  -moz-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
@media (max-width: 959px) {
  .area-player {
    width: 18px;
    height: 18px;
    margin: -9px 0 0 -9px;
  }
}
.area-player.active {
  z-index: 2;
}
.area-player:before {
  content: "";
  border-radius: 50%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-animation: preview-end 0.2s linear;
  -moz-animation: preview-end 0.2s linear;
  animation: preview-end 0.2s linear;
}
.area-player .player__number {
  position: relative;
  color: #fff;
  text-align: center;
  display: block;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  -webkit-transition: background-color 1s ease-out;
  -moz-transition: background-color 1s ease-out;
  transition: background-color 1s ease-out;
  will-change: background-color;
}
@media (max-width: 959px) {
  .area-player .player__number {
    font-size: 12px;
    line-height: 18px;
    width: 18px;
    height: 18px;
  }
}
.area-player .player__number-text {
  font-size: 21px;
  line-height: 21px;
  font-weight: 700;
  margin-top: 3px;
}
@media (max-width: 959px) {
  .area-player .player__number-text {
    margin-top: 2px;
    font-size: 9px;
    line-height: 9px;
  }
}
.area-player .player__birthdate {
  margin-top: -4px;
  line-height: 21px;
  font-size: 10px;
  color: #CCC;
}
@media (max-width: 959px) {
  .area-player .player__birthdate {
    margin-top: -2px;
    font-size: 7px;
    line-height: 9px;
  }
}
.area-player.substituted .player__number:before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  height: 0;
  width: 0;
  border-bottom: 10px solid #fff;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
}
@media (max-width: 959px) {
  .area-player.substituted .player__number:before {
    height: 0;
    width: 0;
    border-bottom: 6px solid #fff;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
  }
}
.area-player.substituted .player__number:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 0;
  width: 0;
  border-bottom: 8px solid #188538;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
}
@media (max-width: 959px) {
  .area-player.substituted .player__number:after {
    height: 0;
    width: 0;
    border-bottom: 4px solid #188538;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
  }
}
.area-player.substituted.active .player__number:before,
.area-player.substituted.active .player__number:after {
  display: none;
}
.area-player.home:before {
  background: #202020;
}
.area-player.away:before {
  background: #fff;
}
.area-player.away .player__number {
  color: #000;
}
.area-player.away .player__birthdate {
  color: #000;
}
.area-player .player__name {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  margin: 0 -20px;
  text-align: center;
  font-size: 15px;
  font-weight: 500;
  margin-top: 1px;
}
@media (max-width: 959px) {
  .area-player .player__name {
    margin: 0 -10px;
    font-size: 10px;
    line-height: 10px;
    margin-top: 0;
    pointer-events: none;
    width: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
.area-player .swap {
  position: absolute;
  top: -14px;
  right: -14px;
  width: 18px;
  height: 18px;
}
@media (max-width: 959px) {
  .area-player .swap {
    top: -7px;
    right: -7px;
    width: 9px;
    height: 9px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.player-controls {
  width: 350px;
  height: 350px;
  margin: -175px 0 0 -175px;
  background-color: transparent;
  position: absolute;
  top: 50%;
  left: 50%;
  cursor: default;
}
@media (max-width: 959px) {
  .player-controls {
    width: 240px;
    height: 240px;
    margin: -120px 0 0 -120px;
  }
}
.player-controls.saved + .player__number {
  background-color: #2DC46E;
}
/* Colors */
/* Fonts */
/* Dimensions */
.inner .control .section {
  fill: #263742;
  stroke: #151C21;
  stroke-width: 1px;
  cursor: pointer;
}
.inner .control .section:hover {
  fill: #3c4b55;
}
.inner .control .icon {
  fill: #2DC46E;
  shape-rendering: geometricPrecision;
  pointer-events: none;
}
.inner .control text {
  text-anchor: middle;
  pointer-events: none;
  font-size: 11px;
  fill: #2DC46E;
}
@media (max-width: 959px) {
  .inner .control text {
    font-size: 8px;
  }
}
.inner .control.active .icon, .inner .control.active text {
  fill: white;
}
/* Colors */
/* Fonts */
/* Dimensions */
.outer .control .section {
  fill: #263742;
  stroke: #151C21;
  stroke-width: 1px;
  cursor: pointer;
}
.outer .control .section:hover {
  fill: #3c4b55;
}
.outer .control text {
  fill: #2DC46E;
  font-size: 31px;
  text-align: center;
  text-anchor: middle;
  pointer-events: none;
}
@media (max-width: 959px) {
  .outer .control text {
    font-size: 20px;
  }
}
.outer .control.active .section {
  fill: #fff;
}
.outer .control.active text {
  fill: #151C21;
}
/* Colors */
/* Fonts */
/* Dimensions */
.event-icons {
  left: 75%;
  top: 75%;
  position: absolute;
  white-space: nowrap;
  pointer-events: none;
}
@media (max-width: 959px) {
  .event-icons {
    transform: scale(0.6);
    transform-origin: 0 0;
  }
}
.event-icons .goal-icon {
  font-size: 12px;
  line-height: 14px;
  color: #FFF;
  white-space: nowrap;
  vertical-align: bottom;
}
.event-icons .goal-icon svg {
  vertical-align: middle;
}
.event-icons svg {
  width: 14px;
  height: 14px;
}
.event-icons svg + svg {
  margin-left: -3px;
}
.event-icons svg.red {
  fill: #ef3955;
  stroke: #ef3955;
}
.event-icons svg.yellow {
  fill: #fccf07;
  stroke: #fccf07;
}
.event-icons svg.yellow_red {
  width: 20px;
}
.event-icons svg.goal {
  stroke: #000;
  fill: #FFF;
}
.event-icons svg.goal + .goal {
  margin-left: -5px;
}
.event-icons svg.own-goal {
  stroke: #000;
  fill: #ff8787;
}
.event-icons svg.own-goal + .own-goal {
  margin-left: -5px;
}
.event-icons__small svg {
  width: 12px;
  height: 12px;
}
.event-icons__small svg.yellow_red {
  width: 16px;
}
.event-icons__xs-small svg {
  width: 10px;
  height: 10px;
}
.event-icons__xs-small svg.yellow_red {
  width: 13px;
}
.event-icons__white-small-list {
  left: 12px;
  top: 12px;
  position: absolute;
  white-space: nowrap;
  pointer-events: none;
}
.event-icons__white-small-list .goal-icon {
  color: #000;
  position: relative;
  top: -6px;
}
.event-icons__white-small-list svg {
  width: 10px;
  height: 10px;
}
.event-icons__white-small-list svg.yellow_red {
  width: 14px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.area-formations .formation-target {
  width: 42px;
  height: 42px;
  margin: -21px 0 0 -21px;
  position: absolute;
  border-radius: 50%;
  -webkit-transition: left 0.5s, top 0.5s;
  -moz-transition: left 0.5s, top 0.5s;
  transition: left 0.5s, top 0.5s;
}
@media (max-width: 959px) {
  .area-formations .formation-target {
    width: 18px;
    height: 18px;
    margin: -9px 0 0 -9px;
  }
}
.area-formations .formation-target:before {
  position: absolute;
  top: 50%;
  right: 50%;
  height: 0;
  width: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #36D07F;
  margin: -3px -5px 0 0;
  content: "";
}
.area-formations .formation-target.active:before {
  border-bottom: 6px solid #36D07F;
  border-top: none;
}
.area-formations .formation-target.home {
  background: rgba(32, 32, 32, 0.5);
}
.area-formations .formation-target.away {
  background: rgba(255, 255, 255, 0.5);
}
.area-formations .formation-target.away:before {
  border-top-color: #2BA664;
}
.area-formations .formation-target.away.active:before {
  border-bottom-color: #2BA664;
}

.position-players-list {
  position: absolute;
  text-align: left;
  z-index: 1;
  border-radius: 3px;
  overflow: auto;
  margin: -21px 23px;
  max-height: 200px;
}
.position-players-list .player {
  padding: 2px 15px 2px 69px;
  color: #2DC46E;
  cursor: pointer;
  overflow: hidden;
}
.position-players-list .player:hover {
  color: #fff;
}
@media (max-width: 959px) {
  .position-players-list .player {
    padding: 0 24px 0 50px;
    height: 33px;
    font-size: 11px;
  }
}
.position-players-list .player:nth-child(even) {
  background-color: #212f38;
}
.position-players-list .player .player__number {
  color: #fff;
}
.position-players-list .player .player__name {
  width: 100%;
}
.position-players-list .no-players {
  color: #fff;
  line-height: 35px;
  display: inline-block;
  font-size: 15px;
  background-color: #212f38;
  padding: 2px 15px;
  white-space: nowrap;
}
/* Colors */
/* Fonts */
/* Dimensions */
.match-title {
  min-height: 70px;
}
@media (max-width: 959px) {
  .match-title {
    min-height: 36px;
  }
}
.match-title .title-teams {
  color: #fff;
  position: relative;
  line-height: 52px;
  margin: 0 40px;
}
@media (max-width: 959px) {
  .match-title .title-teams {
    line-height: 26px;
  }
}
.match-title .title-teams .goals {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  text-align: center;
}
.match-title .title-teams .goals textarea:hover::placeholder, .match-title .title-teams .goals textarea:hover::-webkit-input-placeholder {
  color: white;
}
.match-title .title-teams .goals textarea::placeholder, .match-title .title-teams .goals textarea::-webkit-input-placeholder {
  color: #2DC46E;
}
.match-title .title-teams .goals textarea::-moz-placeholder {
  color: #2DC46E;
}
.match-title .title-teams .goals .goals-main {
  font-size: 30px;
  line-height: 52px;
  font-weight: 500;
}
@media (max-width: 959px) {
  .match-title .title-teams .goals .goals-main {
    font-size: 18px;
    line-height: 26px;
  }
}
.match-title .title-teams .goals .goals-main textarea {
  display: inline-block;
  text-align: center;
  height: 52px;
  width: 24px;
  overflow: hidden;
  resize: none;
  border: none;
  vertical-align: bottom;
  padding: 0;
  line-height: 52px;
  background: transparent;
  color: #2DC46E;
}
@media (max-width: 959px) {
  .match-title .title-teams .goals .goals-main textarea {
    height: 26px;
    width: 12px;
    line-height: 26px;
  }
}
.match-title .title-teams .goals .goals-ht {
  position: absolute;
  right: 0;
  bottom: -12px;
  left: 0;
  font-size: 20px;
  font-weight: 500;
  line-height: 21px;
}
@media (max-width: 959px) {
  .match-title .title-teams .goals .goals-ht {
    position: absolute;
    right: 0;
    bottom: -6px;
    left: 0;
    font-size: 12px;
    line-height: 11px;
  }
}
.match-title .title-teams .goals .goals-ht textarea {
  color: #2DC46E;
  display: inline-block;
  text-align: center;
  height: 21px;
  width: 12px;
  overflow: hidden;
  resize: none;
  border: none;
  vertical-align: bottom;
  padding: 0;
  line-height: 21px;
  background: transparent;
}
@media (max-width: 959px) {
  .match-title .title-teams .goals .goals-ht textarea {
    height: 11px;
    width: 5px;
    line-height: 11px;
  }
}
.match-title .title-teams .Select {
  line-height: 19px;
  display: inline-block;
  position: absolute;
  bottom: -30px;
  width: 133px;
}
@media (max-width: 959px) {
  .match-title .title-teams .Select {
    bottom: -23px;
    width: 114px;
  }
}
.match-title .title-teams .Select .Select-value-label,
.match-title .title-teams .Select .Select-placeholder {
  font-weight: 700 !important;
  color: #2DC46E !important;
}
.match-title .title-teams .Select .Select-arrow {
  border-color: #2DC46E transparent transparent;
}
.match-title .title-teams .Select .Select-control {
  border-bottom: none !important;
}
.match-title .title-teams .Select .Select-input input {
  text-align: inherit;
}
.match-title .title-teams .home,
.match-title .title-teams .away {
  display: inline-block;
  width: 40%;
  width: calc(50% - 45px);
  position: relative;
  font-size: 25px;
  font-weight: 700;
  vertical-align: middle;
}
@media (max-width: 959px) {
  .match-title .title-teams .home,
  .match-title .title-teams .away {
    width: calc(50% - 23px);
    font-size: 14px;
  }
}
.match-title .title-teams .home {
  text-align: right;
  padding-right: 90px;
}
@media (max-width: 959px) {
  .match-title .title-teams .home {
    padding-right: 45px;
  }
}
.match-title .title-teams .home .Select {
  right: 80px;
}
@media (max-width: 959px) {
  .match-title .title-teams .home .Select {
    right: 32px;
  }
}
.match-title .title-teams .home .team-image {
  right: 25px;
}
@media (max-width: 959px) {
  .match-title .title-teams .home .team-image {
    right: 13px;
  }
}
.match-title .title-teams .away {
  text-align: left;
  padding-left: 90px;
}
@media (max-width: 959px) {
  .match-title .title-teams .away {
    padding-left: 45px;
  }
}
.match-title .title-teams .away .Select {
  left: 90px;
}
@media (max-width: 959px) {
  .match-title .title-teams .away .Select {
    left: 44px;
  }
}
.match-title .title-teams .away .team-image {
  left: 25px;
}
@media (max-width: 959px) {
  .match-title .title-teams .away .team-image {
    left: 13px;
  }
}
.match-title .title-teams .team {
  line-height: 52px;
}
@media (max-width: 959px) {
  .match-title .title-teams .team {
    line-height: 26px;
    max-height: 26px;
    overflow: hidden;
  }
}
.match-title .title-teams .team-image {
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 50px;
  height: 60px;
  margin-top: -30px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
@media (max-width: 959px) {
  .match-title .title-teams .team-image {
    width: 25px;
    height: 30px;
    margin-top: -15px;
  }
}
.match-title .title-teams .team-name {
  line-height: 25px;
  vertical-align: middle;
}
@media (max-width: 959px) {
  .match-title .title-teams .team-name {
    line-height: 13px;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
.match-title .title-info {
  margin-top: 18px;
  color: rgba(255, 255, 255, 0.75);
  letter-spacing: 0.1em;
  font-size: 12px;
  text-transform: uppercase;
}
@media (max-width: 959px) {
  .match-title .title-info {
    margin-top: 9px;
    font-size: 6px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.substitutions {
  display: block;
  margin: 14px auto 0;
  font-size: 0;
  -webkit-transition: width 0.5s ease-out;
  -moz-transition: width 0.5s ease-out;
  transition: width 0.5s ease-out;
}
@media (max-width: 959px) {
  .substitutions {
    margin: 4px auto 0;
  }
}
.substitutions .home,
.substitutions .away {
  display: inline-block;
  width: 50%;
  font-size: 0;
  vertical-align: top;
}
.substitutions .home {
  padding-right: 8px;
}
@media (max-width: 959px) {
  .substitutions .home {
    padding-right: 2px;
  }
}
.substitutions .home .substitution .substitution-target {
  background: rgba(32, 32, 32, 0.2);
}
.substitutions .away {
  padding-left: 8px;
}
@media (max-width: 959px) {
  .substitutions .away {
    padding-left: 2px;
  }
}
.substitutions .away .substitution .substitution-target {
  background: rgba(255, 255, 255, 0.2);
}
.substitutions .substitutions-list {
  background: #0f6630;
  width: 100%;
  height: 62px;
  display: flex;
  justify-content: space-around;
}
@media (max-width: 959px) {
  .substitutions .substitutions-list {
    height: 38px;
  }
}
.substitutions .substitution {
  width: 14.2857142857%;
  height: 36px;
  margin-top: 6px;
  position: relative;
}
.substitutions .substitution .substitution-target {
  width: 42px;
  height: 42px;
  margin: 0px 0 0 12px;
  position: absolute;
  border-radius: 50%;
}
@media (max-width: 1379px) {
  .substitutions .substitution .substitution-target {
    width: 36px;
    height: 36px;
    margin: 6px 0 0 6px;
  }
}
@media (max-width: 959px) {
  .substitutions .substitution .substitution-target {
    height: 18px;
    width: 18px;
    margin: -3px 0 0 0;
  }
}
.substitutions .substitution .substitution-target:before {
  position: absolute;
  top: 50%;
  right: 50%;
  height: 0;
  width: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 6px solid #36D07F;
  margin: -3px -5px 0 0;
  content: "";
}
.substitutions .substitution .position-players-list {
  bottom: 50%;
}
/* Colors */
/* Fonts */
/* Dimensions */
@-webkit-keyframes preview-end {
  from {
    -webkit-transform: scale(1.1);
  }
  to {
    -webkit-transform: scale(1);
  }
}
@-moz-keyframes preview-end {
  from {
    -moz-transform: scale(1.1);
  }
  to {
    -moz-transform: scale(1);
  }
}
@keyframes preview-end {
  from {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  to {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}
.substitution-player {
  height: 36px;
  border-radius: 50%;
  cursor: pointer;
  display: inline-block;
  position: relative;
  margin-top: 6px;
  width: 14.2857142857%;
}
@media (max-width: 959px) {
  .substitution-player {
    height: 18px;
    margin-top: 3px;
  }
}
.substitution-player.active {
  z-index: 2;
}
.substitution-player:before {
  content: "";
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-animation: preview-end 0.1s linear;
  -moz-animation: preview-end 0.1s linear;
  animation: preview-end 0.1s linear;
  margin-left: -18px;
  width: 36px;
  height: 36px;
}
@media (max-width: 959px) {
  .substitution-player:before {
    margin-left: -9px;
    width: 18px;
    height: 18px;
  }
}
.substitution-player .player__number {
  position: relative;
  color: #fff;
  text-align: center;
  display: block;
  width: 36px;
  height: 36px;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -18px;
}
@media (max-width: 959px) {
  .substitution-player .player__number {
    width: 18px;
    height: 18px;
    margin-left: -9px;
  }
}
.substitution-player .player__number-text {
  font-size: 18px;
  line-height: 18px;
  font-weight: 700;
  margin-top: 3px;
}
@media (max-width: 959px) {
  .substitution-player .player__number-text {
    margin-top: 2px;
    font-size: 9px;
    line-height: 9px;
  }
}
.substitution-player .player__birthdate {
  margin-top: -4px;
  line-height: 18px;
  font-size: 8px;
  color: #CCC;
}
@media (max-width: 959px) {
  .substitution-player .player__birthdate {
    margin-top: -2px;
    font-size: 7px;
    line-height: 9px;
  }
}
.substitution-player.substituted .player__number:before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  height: 0;
  width: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 10px solid #fff;
}
@media (max-width: 959px) {
  .substitution-player.substituted .player__number:before {
    height: 0;
    width: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 6px solid #fff;
  }
}
.substitution-player.substituted .player__number:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 0;
  width: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid #d33a61;
}
@media (max-width: 959px) {
  .substitution-player.substituted .player__number:after {
    height: 0;
    width: 0;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 4px solid #d33a61;
  }
}
.substitution-player.substituted.active .player__number:before,
.substitution-player.substituted.active .player__number:after {
  display: none;
}
.home .substitution-player:before {
  background: #202020;
}
.away .substitution-player:before {
  background: #fff;
}
.away .substitution-player .player__number {
  color: #000;
}
.away .substitution-player .player__birthdate {
  color: #000;
}
.substitution-player .player__name {
  position: absolute;
  top: 100%;
  right: 2px;
  left: 2px;
  text-align: center;
  font-size: 12px;
  font-weight: 500;
  margin-top: 1px;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  white-space: nowrap;
}
@media (max-width: 959px) {
  .substitution-player .player__name {
    left: 1px;
    right: 1px;
    font-size: 10px;
  }
}
.substitution-player .swap {
  position: absolute;
  top: -14px;
  right: -14px;
  width: 18px;
  height: 18px;
}
@media (max-width: 959px) {
  .substitution-player .swap {
    top: -7px;
    right: -7px;
    width: 9px;
    height: 9px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.timeline {
  margin: 10px auto 0;
  width: 43px;
  position: relative;
  text-align: center;
}
@media (max-width: 959px) {
  .timeline {
    margin: 20px auto 0;
    width: 30px;
  }
}
.timeline .clock {
  position: absolute;
  top: 0;
  right: 100%;
  margin-right: 50px;
  white-space: nowrap;
  font-size: 30px;
  line-height: 43px;
  height: 43px;
}
@media (max-width: 959px) {
  .timeline .clock {
    margin-right: 20px;
    font-size: 20px;
    line-height: 22px;
    height: 22px;
  }
}
.timeline .clock > *:hover {
  color: white;
}
.timeline .clock .unit {
  display: inline-block;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 700;
  text-transform: uppercase;
  vertical-align: middle;
}
@media (max-width: 959px) {
  .timeline .clock .unit {
    font-size: 11px;
    margin: -2px 8px 0px;
  }
}
.timeline .clock input {
  display: inline-block;
  width: 46px;
  font-size: inherit;
  border: none;
  text-align: center;
  line-height: inherit;
  padding: 0;
  color: #2DC46E;
  vertical-align: top;
  appearance: textfield;
}
@media (max-width: 959px) {
  .timeline .clock input {
    width: 30px;
  }
}
.timeline .clock input::-webkit-inner-spin-button, .timeline .clock input::-webkit-outer-spin-button, .timeline .clock input:hover::-webkit-inner-spin-button, .timeline .clock input:hover::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.timeline .toggle-timer {
  position: relative;
  width: 43px;
  height: 43px;
  display: inline-block;
  border-radius: 50%;
  background: #2DC46E;
  cursor: pointer;
  color: #263742;
  text-transform: uppercase;
  line-height: 15px;
  letter-spacing: 0.05em;
  text-align: left;
}
@media (max-width: 959px) {
  .timeline .toggle-timer {
    width: 28px;
    height: 28px;
    line-height: 10px;
  }
}
.timeline .toggle-timer svg {
  position: absolute;
  top: 50%;
  right: 50%;
  margin: -9px -11px 0 0;
  width: 18px;
  height: 18px;
}
@media (max-width: 959px) {
  .timeline .toggle-timer svg {
    width: 12px;
    height: 12px;
    margin: -5.5px -7px 0 0;
  }
}
.timeline .toggle-timer.pause {
  z-index: 2;
}
.timeline .toggle-timer.pause svg {
  margin-right: -9px;
}
@media (max-width: 959px) {
  .timeline .toggle-timer.pause svg {
    margin-right: -6px;
  }
}
.timeline .toggle-timer .timer-status {
  font-size: 14px;
  line-height: 16px;
  color: rgba(255, 255, 255, 0.6);
  position: absolute;
  top: 50%;
  left: 100%;
  margin-left: 12px;
  margin-top: -16px;
  white-space: nowrap;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
}
@media (max-width: 959px) {
  .timeline .toggle-timer .timer-status {
    font-size: 10px;
    line-height: 11px;
    margin-left: 10px;
    margin-top: -11px;
  }
}
.timeline .toggle-timer:hover {
  background-color: #fff;
}
.timeline .Select {
  font-size: 18px;
  line-height: 40px;
  font-weight: 700;
  width: 43px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
}
@media (max-width: 959px) {
  .timeline .Select {
    font-size: 10px;
    line-height: 24px;
    width: 30px;
  }
}
.timeline .Select__control {
  width: 43px;
  height: 43px;
  overflow: hidden;
  opacity: 0;
}
@media (max-width: 959px) {
  .timeline .Select__control {
    width: 30px;
    height: 30px;
  }
}
.timeline .Select__menu {
  background: #263742;
  font-weight: 700;
  text-align: left;
  color: #2DC46E;
  top: auto;
  bottom: 100%;
  left: 50%;
  width: 170px;
  margin-left: -66px;
  border: none;
  border-radius: 5px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
  margin-bottom: 8px;
}
@media (max-width: 959px) {
  .timeline .Select__menu {
    width: 104px;
    margin-left: -52px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    margin-bottom: 4px;
    font-weight: 400;
  }
}
.timeline .Select__menu .Select__option {
  border-top: 1px solid #4E5F6D;
  padding: 0 14px;
  cursor: pointer;
}
@media (max-width: 959px) {
  .timeline .Select__menu .Select__option {
    padding: 4px 8px;
    font-size: 14px;
  }
}
.timeline .Select__menu .Select__option:hover, .timeline .Select__menu .Select__option:focus, .timeline .Select__menu .Select__option:active, .timeline .Select__menu .Select__option.Select__option--is-selected, .timeline .Select__menu .Select__option.Select__option--is-focused {
  color: #fff;
  background: none;
}
.timeline .Select__menu .Select__option:first-child {
  border: none;
}
.timeline .Select:hover + .toggle-timer,
.timeline .Select.is-open + .toggle-timer {
  color: #fff;
}
/* Colors */
/* Fonts */
/* Dimensions */
.single-report__substitutions__up, .single-report__substitutions__down {
  position: absolute;
  left: 50%;
  bottom: 10px;
  margin-left: -350px;
  background: none;
  border: 1px solid #FFF;
  border-radius: 6px;
  cursor: pointer;
  width: 40px;
  height: 40px;
}
.single-report__substitutions__up svg, .single-report__substitutions__down svg {
  width: 16px;
  height: 16px;
}
.single-report__substitutions__up:hover, .single-report__substitutions__down:hover {
  border-color: #35B374;
}
@media (max-width: 959px) {
  .single-report__substitutions__up, .single-report__substitutions__down {
    margin-left: -245px;
    width: 24px;
    height: 24px;
  }
}
.single-report__substitutions__up {
  margin-left: -300px;
}
@media (max-width: 959px) {
  .single-report__substitutions__up {
    margin-left: -210px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.substitution-control-window {
  text-align: left;
  position: fixed;
  width: 582px;
  height: 248px;
  left: 50%;
  top: 50%;
  margin-left: -291px;
  margin-top: -124px;
  background: #2E3C47;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.24);
  border-radius: 6px;
  z-index: 10;
}
.substitution-control-window__timeline {
  display: flex;
  justify-content: center;
  align-items: center;
}
.substitution-control-window__timeline label {
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  text-transform: uppercase;
  color: #CCCCCC;
  margin: 0 8px;
}
.substitution-control-window__timeline span {
  font-size: 32px;
  line-height: 40px;
  text-transform: uppercase;
  color: #FFFFFF;
  display: block;
  margin: 0 8px;
}
.substitution-control-window__timeline input {
  color: #35B374;
  border: none;
  display: block;
  padding: 0;
  margin: 0;
  font-size: 32px;
  line-height: 40px;
  width: 32px;
  height: 40px;
}
.substitution-control-window__timeline input.mins {
  width: 46px;
  text-align: right;
}
.substitution-control-window__timeline input::placeholder {
  color: #35B374;
}
.substitution-control-window__pad {
  box-sizing: border-box;
  height: 100%;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.substitution-control-window__close {
  display: block;
  position: absolute;
  z-index: 2;
  padding: 8px;
  right: 16px;
  top: 16px;
  color: #FFF;
  cursor: pointer;
}
.substitution-control-window__close:hover {
  color: #35B374;
}
.substitution-control-window__close svg {
  width: 8px;
  height: 8px;
  fill: currentColor;
}
.substitution-control-window__buttons {
  text-align: right;
}
.substitution-control-window__buttons .btn-submit {
  background: #35B374;
  color: #FFF;
  margin-left: 24px;
}
.substitution-control-window__buttons .btn-submit:hover {
  background: #fff;
  color: #35B374;
}
.substitution-control-window__title {
  text-align: left;
  color: #FFF;
  font-weight: 400;
  font-size: 13px;
  line-height: 16px;
  letter-spacing: 1px;
  text-transform: uppercase;
}
.substitution-control-window__title svg {
  display: inline-block;
  vertical-align: middle;
  width: 16px;
  height: 10px;
  margin-right: 6px;
  position: relative;
  top: -2px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.snapshots {
  display: inline-block;
  vertical-align: top;
  -webkit-transform-origin: bottom left;
  -moz-transform-origin: bottom left;
  -ms-transform-origin: bottom left;
  -o-transform-origin: bottom left;
  transform-origin: bottom left;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
  font-size: 18px;
  font-weight: 700;
  line-height: 50px;
  position: absolute;
  margin-top: -17px;
}
@media (max-width: 959px) {
  .snapshots {
    font-size: 12px;
    line-height: 32px;
    margin-top: -22px;
  }
}
.snapshots ul {
  white-space: nowrap;
  text-align: left;
}
.snapshots ul li {
  display: inline-block;
  margin-right: 20px;
}
.snapshots ul li.create {
  font-weight: 400;
}
@media (max-width: 959px) {
  .snapshots ul li {
    margin-right: 8px;
    min-width: 30px;
  }
}
.snapshots ul li a {
  color: #2DC46E;
  cursor: pointer;
}
.snapshots ul li.active a {
  color: #fff;
}
.snapshots ul li .snapshot-name {
  display: inline-block;
  max-width: calc(100% - 18px);
  min-width: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}
.snapshots ul li .remove-snapshot {
  color: #2DC46E !important;
  margin-left: 6px;
}
@media (max-width: 959px) {
  .snapshots ul li .remove-snapshot {
    margin-left: -1px;
  }
}
.snapshots ul li .remove-snapshot svg {
  stroke: #2DC46E;
  stroke-width: 1px;
  width: 12px;
  height: 12px;
}
@media (max-width: 959px) {
  .snapshots ul li .remove-snapshot svg {
    width: 8px;
    height: 8px;
  }
}
.snapshots ul li .remove-snapshot:hover {
  color: #fff !important;
}
.snapshots ul li .remove-snapshot:hover svg {
  stroke: #fff;
}

.snapshot-error-message {
  color: #d33a61;
  margin: 10px 0;
}
/* Colors */
/* Fonts */
/* Dimensions */
.default-lineup-controls {
  position: relative;
  height: 0;
  margin: 0 auto;
  display: block;
  font-size: 14px;
  line-height: 20px;
}
@media (max-width: 959px) {
  .default-lineup-controls {
    font-size: 12px;
    line-height: 16px;
  }
}
.default-lineup-controls .save-default-lineup {
  position: absolute;
  left: 0;
  top: 10px;
}
@media (max-width: 959px) {
  .default-lineup-controls .save-default-lineup {
    top: 0px;
  }
}
.default-lineup-controls .save-default-lineup_away {
  left: auto;
  right: 0;
}
/* Colors */
/* Fonts */
/* Dimensions */
.side-controls {
  position: absolute;
  top: 0;
  right: -285px;
  bottom: 0;
  width: 285px;
  background-color: #1c2830;
}
@media (max-width: 959px) {
  .side-controls {
    width: 170px;
    right: -170px;
    z-index: 10;
  }
}
.side-controls .side-controls__close {
  position: absolute;
  top: 20px;
  right: 19px;
  cursor: pointer;
  padding: 10px;
  z-index: 5;
}
@media (max-width: 959px) {
  .side-controls .side-controls__close {
    top: 3px;
    right: 3px;
  }
}
.side-controls .side-controls__close svg {
  width: 24px;
  height: 24px;
}
@media (max-width: 959px) {
  .side-controls .side-controls__close svg {
    width: 14px;
    height: 14px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.control-player-info {
  position: relative;
  padding: 26px 10px 20px 80px;
  font-size: 15px;
  min-height: 190px;
  width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
}
.control-player-info .select-container {
  width: 90px;
  display: inline-block;
}
@media (max-width: 959px) {
  .control-player-info {
    padding: 12px 5px 8px 44px;
    font-size: 12px;
  }
}
.control-player-info .player__image {
  position: absolute;
  top: 24px;
  left: 15px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 56px;
  height: 74px;
  border-radius: 4px;
}
@media (max-width: 959px) {
  .control-player-info .player__image {
    top: 12px;
    left: 5px;
    width: 29px;
    height: 38px;
  }
}
.control-player-info b {
  /*text-transform: uppercase;*/
  font-weight: 300;
}
.control-player-info .player__name {
  line-height: 22px;
  margin-bottom: 10px;
  font-size: 18px;
  margin-right: 46px;
  word-wrap: break-word; /* IE 5.5-7 */
  white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */
  white-space: pre-wrap; /* current browsers */
}
.control-player-info .player__name input {
  width: calc(100% - 15px);
}
@media (max-width: 959px) {
  .control-player-info .player__name {
    line-height: 17px;
    margin-bottom: 5px;
    font-size: 13px;
    margin-right: 22px;
  }
}
.control-player-info .info-edit-action {
  display: inline-block;
  color: #2DC46E;
  cursor: pointer;
  vertical-align: middle;
  margin: -1px 0 -1px 10px;
}
@media (max-width: 959px) {
  .control-player-info .info-edit-action {
    margin: -3px 0 -3px 5px;
  }
}
.control-player-info .info-edit-action:hover {
  color: #fff;
}
.control-player-info .info-edit-action svg {
  width: 14px;
  height: 14px;
}
.control-player-info .small {
  font-weight: normal;
  /*font-size:14px;*/
  line-height: 18px;
}
.control-player-info input {
  font-size: inherit;
  line-height: inherit;
  height: 22px;
  width: 35px;
  font-weight: inherit;
  padding: 0;
  position: relative;
  top: -1px;
}
@media (max-width: 959px) {
  .control-player-info input {
    height: 11px;
    width: 20px;
  }
}
.control-player-info input.date_input {
  width: 85px;
}
.control-player-info input.invalid {
  border-color: #d33a61;
}
.control-player-info .add-to-favorites {
  right: 24px;
  top: 68px;
  width: 29px;
  height: 29px;
  position: absolute;
}
.control-player-info .add-to-favorites ul.list li {
  font-weight: normal;
}
.control-player-info .player_delete {
  width: 30px;
  height: 30px;
  color: #2DC46E;
  position: absolute;
  right: 24px;
  top: 120px;
  cursor: pointer;
}
.control-player-info .player_delete:hover {
  color: #FFF;
}
.control-player-info .player_delete svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
}
.control-player-info .player-favorite {
  border-radius: 50%;
  display: block;
  text-align: center;
  line-height: 34px;
  cursor: pointer;
  position: relative;
}
.control-player-info .player-favorite svg {
  vertical-align: middle;
  stroke: #2DC46E;
  width: 29px;
  height: 29px;
}
.control-player-info .player-favorite .tri {
  transform: translate(11px, 4px) !important;
  border-left: 4px solid transparent !important;
  border-right: 4px solid transparent !important;
  border-top: 5px solid !important;
}
.control-player-info .player-favorite:hover svg {
  fill: #2DC46E;
}
.control-player-info .player-favorite.active {
  background: #000;
  color: #fff;
}
.control-player-info .player-favorite.active svg {
  stroke: #000;
}
/* Colors */
/* Fonts */
/* Dimensions */
.add-to-favorites {
  z-index: 1;
}
.add-to-favorites .trigger {
  display: inline-block;
}
.add-to-favorites .trigger .tri {
  display: block;
  top: 50%;
  left: 50%;
  transform: translate(8px, 2px);
  width: 0;
  height: 0;
  border-color: #2DC46E;
  color: #2DC46E;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 4px solid;
  position: absolute;
}
.add-to-favorites .trigger svg {
  fill: none;
  stroke: #2DC46E;
}
.add-to-favorites .trigger.active.cat_0 svg {
  fill: #5F7582;
  stroke: #5F7582;
}
.add-to-favorites .trigger.active.cat_0 .tri {
  color: #5F7582;
}
.add-to-favorites .trigger.active.cat_1 svg {
  fill: #EFDD30;
  stroke: #EFDD30;
}
.add-to-favorites .trigger.active.cat_1 .tri {
  color: #EFDD30;
}
.add-to-favorites .trigger.active.cat_2 svg {
  fill: #F98736;
  stroke: #F98736;
}
.add-to-favorites .trigger.active.cat_2 .tri {
  color: #F98736;
}
.add-to-favorites .trigger.active.cat_3 svg {
  fill: #DD4043;
  stroke: #DD4043;
}
.add-to-favorites .trigger.active.cat_3 .tri {
  color: #DD4043;
}
.add-to-favorites .fav_icon {
  stroke: #2DC46E;
  fill: none;
  width: 20px;
  height: 20px;
}
.add-to-favorites .fav_icon.cat_0 {
  fill: #5F7582;
  stroke: #5F7582;
}
.add-to-favorites .fav_icon.cat_1 {
  fill: #EFDD30;
  stroke: #EFDD30;
}
.add-to-favorites .fav_icon.cat_2 {
  fill: #F98736;
  stroke: #F98736;
}
.add-to-favorites .fav_icon.cat_3 {
  fill: #DD4043;
  stroke: #DD4043;
}
.add-to-favorites .list {
  margin-top: 5px;
  position: absolute;
  top: 100%;
  right: 0;
  font-size: 15px;
  color: #000000;
  line-height: 20px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
  border-radius: 4px;
  width: 160px;
  background: #FFF;
  z-index: 1;
}
.add-to-favorites .list li {
  padding: 10px 10px;
  font-size: 15px;
  line-height: 21px;
  border-top: 1px solid #E1E1E1;
  position: relative;
  padding-left: 35px;
  cursor: pointer;
}
.add-to-favorites .list li:hover {
  background: #e6e6e6;
}
.add-to-favorites .list li .fav_icon {
  position: absolute;
  left: 10px;
  top: 50%;
  margin-top: -10px;
}
.add-to-favorites .list li:nth-child(1) {
  border-radius: 4px 4px 0 0;
  border-top: none;
}
.add-to-favorites .list li:nth-last-child(1) {
  border-radius: 0 0 4px 4px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.player-note {
  position: absolute;
  right: 0px;
  left: 0px;
  margin: 10px 0;
  height: 60%;
}
.player-note__single {
  height: calc(100% - 68px);
  padding: 14px 0 14px;
}
.player-note h3 {
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 700;
  line-height: 16px;
  letter-spacing: 1px;
  margin: 0 0 40px;
  padding: 0 10px;
}
.player-note .events {
  padding: 0 10px 10px;
}
.player-note .events label {
  display: block;
  opacity: 0.8;
  font-size: 15px;
}
.player-note .events button {
  background: #293741;
  border: none;
  margin: 5px;
  display: inline-block;
  font-size: 16px;
  line-height: 32px;
  padding: 0 12px;
  position: relative;
  color: #FFF;
  border-radius: 16px;
  transition: background 0.35s ease-out;
}
.player-note .events button.active {
  background: #35B374;
}
.player-note .events button svg {
  width: 14px;
  height: 14px;
  position: relative;
  top: -1px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 4px;
}
.player-note .events button svg.goal {
  top: 0;
}
.player-note .events button svg.assists {
  top: -2px;
}
.player-note .events button:hover {
  background: #3A4C5A;
}
@media (max-width: 959px) {
  .player-note {
    right: 8px;
    left: 8px;
    margin: 8px 0;
  }
}
.player-note textarea {
  position: relative;
  height: calc(100% - 230px);
  width: 100%;
  resize: none;
  background: #2c404f;
  border: none;
  padding: 13px 16px;
  color: #fff;
  font-size: 15px;
  line-height: 20px;
  background: #2c404f;
  border-radius: 4px;
}
@media (max-width: 959px) {
  .player-note textarea {
    padding: 4px;
    font-size: 13px;
    line-height: 15px;
  }
}
.player-note textarea::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
.player-note .events-tags {
  margin: 10px 10px 0;
  color: #2DC46E;
}
.player-note .events-tags .tag {
  font-size: 14px;
  line-height: 20px;
  display: inline-block;
  margin-left: 8px;
  white-space: nowrap;
}
.player-note .events-tags .tag:nth-child(1) {
  margin-left: 0;
}
/* Colors */
/* Fonts */
/* Dimensions */
.controls-list {
  padding-bottom: 70px;
}
.controls-list .controls-group .controls-group-title {
  font-weight: 700;
  font-size: 16px;
  padding: 10px 15px;
  color: #fff;
  background: #293b47;
  box-shadow: 0px 4px 8px rgba(21, 28, 33, 0.3), 0px -6px 8px rgba(21, 28, 33, 0.1);
  z-index: 1;
  text-transform: uppercase;
}
@media (max-width: 959px) {
  .controls-list .controls-group .controls-group-title {
    font-size: 12px;
    padding: 5px 8px;
  }
}
.controls-list .controls-list-help {
  padding-left: 12px;
  margin: 12px 0 4px;
}
.controls-list .controls-list-help svg {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -2px;
  width: 14px;
  height: 14px;
}
.controls-list .control:nth-child(even) {
  background: #212f38;
}
.controls-list .control .title {
  padding: 15px 15px 15px 45px;
  font-size: 16px;
  font-weight: 400;
  display: block;
  cursor: pointer;
  position: relative;
}
@media (max-width: 959px) {
  .controls-list .control .title {
    padding: 10px 10px 10px 26px;
    font-size: 12px;
  }
}
.controls-list .control .title svg {
  position: absolute;
  left: 15px;
  max-width: 25px;
  font-weight: 400;
  width: 24px;
  height: 24px;
}
@media (max-width: 959px) {
  .controls-list .control .title svg {
    left: 8px;
    max-width: 13px;
    width: 16px;
    height: 16px;
  }
}
.controls-list .control .values {
  padding: 0 15px 15px;
  font-size: 30px;
  line-height: 50px;
  max-height: 67px;
  overflow: hidden;
  -webkit-transition: max-height 0.5s, padding 0.5s;
  -moz-transition: max-height 0.5s, padding 0.5s;
  transition: max-height 0.5s, padding 0.5s;
}
@media (max-width: 959px) {
  .controls-list .control .values {
    padding: 0 10px 10px;
    font-size: 18px;
    line-height: 26px;
    max-height: 38px;
  }
}
.controls-list .control .values .value {
  display: inline-block;
  width: 20%;
  text-align: center;
  border: 1px solid #495D6A;
  color: #2DC46E;
  cursor: pointer;
}
.controls-list .control .values .value + .value {
  border-left: none;
}
.controls-list .control .values .value:hover {
  background: #495D6A;
}
.controls-list .control .values .value.active {
  background: #fff;
  color: #1E2A31;
}
.controls-list .control .values.hidden {
  max-height: 0;
  padding-bottom: 0;
}
/* Colors */
/* Fonts */
/* Dimensions */
.side-add-player {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: -285px;
  width: 285px;
  background: #1E2A31;
  border-right: 1px solid #151C21;
  z-index: 3;
  padding: 15px;
  overflow: auto;
}
@media (max-width: 959px) {
  .side-add-player {
    left: -186px;
    width: 186px;
    padding: 8px;
  }
}
.side-add-player .side-add-player__close {
  position: absolute;
  top: 28px;
  right: 28px;
  cursor: pointer;
}
@media (max-width: 959px) {
  .side-add-player .side-add-player__close {
    top: 12px;
    right: 12px;
  }
}
.side-add-player .side-add-player__close svg {
  width: 24px;
  height: 24px;
}
@media (max-width: 959px) {
  .side-add-player .side-add-player__close svg {
    width: 12px;
    height: 12px;
  }
}
.side-add-player .side-add-player__title {
  font-weight: 700;
  font-size: 22px;
  padding: 10px 0 35px;
  line-height: 25px;
  text-transform: uppercase;
  letter-spacing: 2px;
  padding-right: 25px;
}
@media (max-width: 959px) {
  .side-add-player .side-add-player__title {
    font-size: 12px;
    padding: 5px 0 18px;
    line-height: 13px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.player-view {
  display: flex;
}
.player-view__img {
  width: 25px;
  height: 25px;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 8px;
}
.player-view__team-name {
  font-size: 12px;
  opacity: 0.7;
  display: block;
}
.player-view__team-img {
  position: relative;
  top: 3px;
  display: inline-block;
  margin-right: 4px;
  width: 12px;
  height: 16px;
  background-size: contain;
}
.react-select__dropdown-indicator {
  width: 12px;
  height: 12px;
  margin: 0 12px;
  fill: none;
  stroke: currentColor;
  position: relative;
  top: 2px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.add-from-db .control-player-info {
  border-bottom: 0;
  margin: 0 -15px;
  font-size: 17px;
  min-height: 115px;
}
@media (max-width: 959px) {
  .add-from-db .control-player-info {
    margin: 0 -8px;
    font-size: 13px;
    min-height: 57px;
  }
}
.add-from-db .control-player-info > * {
  font-size: 15px;
}
@media (max-width: 959px) {
  .add-from-db .control-player-info > * {
    font-size: 12px;
  }
}
.add-from-db .add-from-db__title {
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 10px;
}
@media (max-width: 959px) {
  .add-from-db .add-from-db__title {
    font-size: 11px;
    margin-bottom: 5px;
  }
}
.add-from-db .Select-placeholder, .add-from-db .Select-value-label {
  font-size: 14px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.add-new {
  min-height: 30%;
  position: relative;
  margin-bottom: 40px;
}
@media (max-width: 959px) {
  .add-new {
    margin-bottom: 20px;
    min-height: 0;
  }
}
.add-new .Select-placeholder, .add-new .Select-value-label {
  font-size: 16px;
  font-weight: 400 !important;
}
@media (max-width: 959px) {
  .add-new .Select-placeholder, .add-new .Select-value-label {
    font-size: 14px;
  }
}
.add-new .add-player-form {
  position: relative;
}
.add-new .add-player-form .add-close {
  position: absolute;
  top: 15px;
  right: 12px;
  cursor: pointer;
  display: block;
  padding: 3px;
}
@media (max-width: 959px) {
  .add-new .add-player-form .add-close {
    right: 6px;
    top: 8px;
    padding: 2px;
  }
}
.add-new .add-player-form .row {
  margin-top: 20px;
}
@media (max-width: 959px) {
  .add-new .add-player-form .row {
    margin-top: 10px;
  }
}
.add-new .add-player-title {
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: -10px;
}
@media (max-width: 959px) {
  .add-new .add-player-title {
    font-size: 11px;
    margin-bottom: -5px;
  }
}
.add-new .input-placeholder-example {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.75);
}
.add-new .buttons-flex {
  display: flex;
}
.add-new .buttons-flex .btn-red {
  margin-left: 16px;
}
.add-new .team {
  position: relative;
  z-index: 3;
}
/* Colors */
/* Fonts */
/* Dimensions */
.team-view {
  display: flex;
}
.team-view__img {
  width: 25px;
  height: 25px;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 8px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.team-view {
  display: flex;
}
.team-view__img {
  width: 24px;
  height: 24px;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 8px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.dd-group-heading {
  display: flex;
  cursor: pointer;
}
.dd-group-heading * {
  cursor: pointer;
}
.dd-group-heading .dd-indicator {
  stroke: #000;
}
.dd-group-heading:hover {
  color: #188538;
}
.dd-group-heading:hover .dd-indicator {
  stroke: #188538;
}

.dd-heading {
  flex-grow: 2;
}

.dd-indicator-container {
  position: relative;
  top: -2px;
  width: 44px;
  padding: 0 16px 0 16px;
}

.dd-indicator {
  width: 12px;
  height: 6px;
  fill: none;
  transform: rotateY(0);
  transition: transform 0.35s ease-out;
}
.dd-indicator.dd-indicator-open {
  transform: rotateX(-180deg);
}
.country-view {
  display: flex;
}
.country-view__img {
  width: 24px;
  height: 24px;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 8px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.create-league-form {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.45);
  z-index: 10000;
  color: #000;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  pointer-events: all;
}
.create-league-form * {
  pointer-events: all;
}
.create-league-form .form {
  position: fixed;
  width: 640px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #1B262E;
  padding: 25px;
}
.create-league-form .form .no-valid > div {
  border-bottom: 1px solid #d33a61;
}
.create-league-form .form input {
  padding: 7px 0;
}
.create-league-form .form h2 {
  color: #FFF;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 16px;
  letter-spacing: 1px;
}
.create-league-form .form label {
  font-size: 14px;
  letter-spacing: 1px;
  font-weight: 700;
  margin-bottom: 4px;
  text-transform: uppercase;
  display: block;
  color: white;
  opacity: 0.7;
}
@media (max-width: 959px) {
  .create-league-form .form label {
    font-size: 9px;
    margin-bottom: 0;
  }
}
.create-league-form .form .form-row {
  margin-top: 25px;
}
.create-league-form .form .submit-row {
  text-align: right;
}
.create-league-form .form .submit-row button {
  margin-left: 25px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.create-team-form {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.45);
  z-index: 9999;
  color: #000;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
  pointer-events: all;
}
.create-team-form * {
  pointer-events: all;
}
.create-team-form .form {
  position: fixed;
  width: 640px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #1B262E;
  padding: 25px;
}
.create-team-form .form .no-valid > div {
  border-bottom: 1px solid #d33a61;
}
.create-team-form .form input {
  padding: 7px 0;
}
.create-team-form .form h2 {
  color: #FFF;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 16px;
  letter-spacing: 1px;
}
.create-team-form .form label {
  font-size: 14px;
  letter-spacing: 1px;
  font-weight: 700;
  margin-bottom: 4px;
  text-transform: uppercase;
  display: block;
  color: white;
  opacity: 0.7;
}
@media (max-width: 959px) {
  .create-team-form .form label {
    font-size: 9px;
    margin-bottom: 0;
  }
}
.create-team-form .form .form-row {
  margin-top: 25px;
}
.create-team-form .form .submit-row {
  text-align: right;
}
.create-team-form .form .submit-row button {
  margin-left: 25px;
}
.create-team-form .checkbox-col {
  margin-top: 28px;
  display: flex;
}
.create-team-form .checkbox-col .c-checkbox {
  margin-right: 4px;
}
.create-team-form .checkbox-col .help-icon {
  fill: none;
  stroke: #FFF;
  width: 20px;
  height: 21px;
  display: inline-block;
  margin-left: 4px;
  vertical-align: middle;
  margin-top: -4px;
}
/* Colors */
/* Fonts */
/* Dimensions */
@-webkit-keyframes preview-start {
  from {
    -webkit-transform: scale(1);
  }
  to {
    -webkit-transform: scale(1.1);
  }
}
@-moz-keyframes preview-start {
  from {
    -moz-transform: scale(1);
  }
  to {
    -moz-transform: scale(1.1);
  }
}
@keyframes preview-start {
  from {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  to {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
}
.preview {
  width: 42px;
  height: 42px;
  margin: -21px 0 0 -21px;
  position: fixed;
  left: 0;
  top: 0;
  border-radius: 50%;
  cursor: pointer;
  cursor: grabbing;
  pointer-events: none;
  z-index: 2;
}
@media (max-width: 959px) {
  .preview {
    width: 22px;
    height: 22px;
    margin: -11px 0 0 -11px;
  }
}
.preview:before {
  content: "";
  border-radius: 50%;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25), 0 2px 10px 0 rgba(0, 0, 0, 0.2);
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
  -webkit-animation: preview-start 0.2s linear;
  -moz-animation: preview-start 0.2s linear;
  animation: preview-start 0.2s linear;
}
.preview .circle {
  position: relative;
  color: #fff;
  font-weight: 700;
  text-align: center;
  font-size: 21px;
  line-height: 42px;
  display: block;
  width: 42px;
  height: 42px;
}
@media (max-width: 959px) {
  .preview .circle {
    font-size: 11px;
    line-height: 22px;
    width: 22px;
    height: 22px;
  }
}
.preview.home:before {
  background: #202020;
}
.preview.away:before {
  background: #fff;
}
.preview.away .circle {
  color: #000;
}
/* Colors */
/* Fonts */
/* Dimensions */
.single-report__player {
  margin: 15px 0 28px;
  padding: 24px 0;
  background: #32414F;
  display: flex;
  position: relative;
}
.single-report__player .player-information__edit-buttons {
  top: -30px;
}
.single-report__player__info, .single-report__player__team {
  padding: 0 24px;
}
.single-report__player__info, .single-report__player__team {
  border-right: 1px solid #354C5C;
  width: calc(50% - 75px);
}
.single-report__player__position {
  padding-left: 24px;
  position: relative;
  width: 124px;
}
.single-report__player__position .note-button {
  border: none;
  background: #35B374;
  position: absolute;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  top: 100%;
  right: 0;
  color: #FFF;
  margin-top: 4px;
  transition: background 0.35s ease-out, color 0.35s ease-out;
}
.single-report__player__position .note-button svg {
  position: absolute;
  left: 18px;
  top: 18px;
  width: 24px;
  height: 24px;
  fill: currentColor;
}
.single-report__player__position .note-button:hover, .single-report__player__position .note-button:active {
  background: #FFF;
  color: #35B374;
}
@media (max-width: 959px) {
  .single-report__player {
    padding: 16px 0;
    min-height: 160px;
  }
  .single-report__player__info, .single-report__player__team {
    padding: 0 16px;
    width: calc(50% - 67px);
  }
  .single-report__player__info h4, .single-report__player__team h4 {
    display: none;
  }
  .single-report__player__info .player-information__main .player-information__edit-buttons {
    top: -15px;
  }
  .single-report__player__info .player-information__main .player-information__edit-buttons + .content-row {
    margin-top: 0;
  }
  .single-report__player__info .player-information__main .player-data__image {
    width: 36px;
    height: 36px;
    margin-right: 12px;
  }
  .single-report__player__info .player-information__main .player-data__image .player-image {
    border-radius: 18px;
    width: 36px;
    height: 36px;
    background-color: #19242b;
  }
  .single-report__player__info .player-information__main .player-data__firstName {
    font-size: 14px;
    line-height: 18px;
  }
  .single-report__player__info .player-information__main .player-data__lastName {
    font-size: 24px;
    line-height: 28px;
  }
  .single-report__player__position {
    padding-left: 16px;
    position: relative;
    width: 102px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.data-item-changeable-simple {
  position: relative;
  z-index: 2;
}
.data-item-changeable-simple__input input {
  color: white;
  font-size: 16px;
  line-height: 20px;
  display: inline-block;
  padding: 1px 0 2px;
}
.data-item-changeable-simple__input .date_input {
  width: 80px;
}
.data-item-changeable-simple__input .select_input {
  min-width: 80px;
}
.data-item-changeable-simple__input .select_input > div {
  min-height: 23px;
}
.data-item-changeable-simple__input .number_input {
  width: 45px;
}
.data-item-changeable-simple__label {
  font-size: 13px;
  text-transform: uppercase;
  line-height: 18px;
  color: rgba(255, 255, 255, 0.7);
  letter-spacing: 0.5px;
  display: block;
}
/* Colors */
/* Fonts */
/* Dimensions */
.data-item-changeable {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  /*@media (max-width: $screen-sm-max) {
    &__value{
      font-size: 13px;
      line-height: 17px;
    }

    &__input{
      font-size: 12px;
      line-height: 16px;
      input{
        font-size: 12px;
        line-height: 16px;
      }

      .date_input{
        width: 60px;
      }

      .select_input{
        min-width: 60px;
        & > div {
          min-height: 23px;
        }
      }

      .number_input{
        width: 30px;
      }
    }

    &__label{
      font-size: 11px;
      line-height: 15px;
    }
  }*/
}
.data-item-changeable__value {
  color: #FFF;
  font-size: 16px;
  line-height: 20px;
  position: relative;
  display: inline-block;
}
.data-item-changeable__value .data-item-changeable__edit {
  display: inline-block;
  width: 12px;
  height: 12px;
  background-position: center center;
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  left: 100%;
  margin-left: 4px;
  top: 4px;
  background-repeat: no-repeat;
  color: #2DC46E;
}
.data-item-changeable__input input {
  color: white;
  font-size: 16px;
  line-height: 20px;
  display: inline-block;
  padding: 1px 0 2px;
}
.data-item-changeable__input .date_input {
  width: 80px;
}
.data-item-changeable__input .select_input {
  min-width: 80px;
}
.data-item-changeable__input .select_input > div {
  min-height: 23px;
}
.data-item-changeable__input .number_input {
  width: 45px;
}
.data-item-changeable__label {
  font-size: 13px;
  text-transform: uppercase;
  line-height: 18px;
  color: rgba(255, 255, 255, 0.7);
  letter-spacing: 0.5px;
  display: block;
}
/* Colors */
/* Fonts */
/* Dimensions */
.player-information__edit-buttons {
  z-index: 2;
  position: absolute;
  right: 20px;
  top: -10px;
}
.player-information__edit-button {
  margin-left: 10px;
  border: none;
  background: none;
  padding: 4px;
}
.player-information__edit-button svg {
  width: 12px;
  height: 12px;
  position: relative;
  top: 1px;
  margin-right: 4px;
}
.player-information__edit-button.cancel {
  color: #d33a61;
}
.player-information__edit-button.save, .player-information__edit-button.edit {
  color: #35B374;
}
.player-information__main {
  display: block;
  position: relative;
  width: 100%;
}
.player-information__main .data-item-changeable.edit-mode {
  margin-left: 20px;
  /*@media (max-width: $screen-sm-max) {
    margin-left: 18px;
  }*/
}
.player-information__main .data-item-changeable.edit-mode:nth-child(1) {
  margin-left: 0;
}
.player-information__main h4 {
  font-size: 18px;
  line-height: 36px;
  color: #FFF;
}
.player-information .player-data {
  display: flex;
}
.player-information .player-data__image {
  width: 72px;
  height: 72px;
  margin-right: 24px;
}
.player-information .player-data__image .player-image {
  border-radius: 36px;
  width: 72px;
  height: 72px;
  background-size: cover;
  background-position: center center;
  background-color: #19242b;
}
.player-information .player-data__content {
  flex-grow: 1;
}
.player-information .player-data__content .data-item, .player-information .player-data__content .data-item-icon, .player-information .player-data__content .data-item-changeable {
  flex-grow: 1;
  max-width: 50%;
}
.player-information .player-data__content .data-item .select_input, .player-information .player-data__content .data-item-icon .select_input, .player-information .player-data__content .data-item-changeable .select_input {
  color: #FFF;
}
.player-information .player-data__firstName {
  font-size: 18px;
  line-height: 23px;
}
.player-information .player-data__lastName {
  font-size: 36px;
  line-height: 40px;
  font-weight: bold;
}
.player-information .player-data .data-row {
  display: flex;
  margin-top: 25px;
}
.player-information .player-data .team-row {
  margin-top: 45px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.data-item {
  display: flex;
  align-items: center;
}
.data-item__icon {
  margin-right: 8px;
  width: 20px;
  height: 20px;
  vertical-align: middle;
}
.data-item__icon svg {
  width: 20px;
  height: 20px;
}
.data-item__content {
  width: 100%;
}
.data-item__value {
  color: #FFF;
  font-size: 16px;
  line-height: 20px;
}
.data-item__value .data-item__image {
  position: relative;
  top: -2px;
  display: inline-block;
  width: 22px;
  height: 22px;
  background-position: center center;
  background-size: contain;
  vertical-align: middle;
  margin-right: 4px;
  background-repeat: no-repeat;
}
.data-item__label {
  font-size: 13px;
  text-transform: uppercase;
  line-height: 18px;
  color: rgba(255, 255, 255, 0.7);
  letter-spacing: 0.5px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.single-report__position-select label {
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
}
.single-report__position-select .demo-message {
  right: 0;
  position: absolute;
  top: 210px;
}
@media (max-width: 959px) {
  .single-report__position-select .positions-list__pitch {
    width: 86px;
    height: 103px;
  }
}
.single-report__position-select .positions-list__pitch.inverted {
  border-color: #181C20;
}
.single-report__position-select .positions-list__pitch.inverted .home, .single-report__position-select .positions-list__pitch.inverted .away {
  border-color: #181C20;
}
.single-report__position-select .positions-list__pitch.inverted .home:after, .single-report__position-select .positions-list__pitch.inverted .away:after {
  border-color: #181C20;
}
.single-report__position-select .positions-list__pitch.inverted .center {
  background: #181C20;
}
.single-report__position-select .positions-list__pitch.inverted .center:after {
  border-color: #181C20;
}
/* Colors */
/* Fonts */
/* Dimensions */
.positions-list {
  display: flex;
  width: 100%;
  padding-top: 24px;
  border-top: 1px solid #354C5C;
}
.positions-list label {
  font-size: 16px;
  line-height: 20px;
}
.positions-list__pitch {
  width: 100px;
  height: 133px;
  flex-grow: 0;
  border: 1px solid #FFF;
  position: relative;
  flex-shrink: 0;
  margin-right: 20px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.inverted .positions-list__pitch {
  border-color: #181C20;
}
.positions-list__pitch * {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.positions-list__pitch .home, .positions-list__pitch .away {
  position: absolute;
  width: 47px;
  height: 20px;
  border: 1px solid #FFF;
  left: 50%;
  margin-left: -23px;
}
.inverted .positions-list__pitch .home, .inverted .positions-list__pitch .away {
  border-color: #181C20;
}
.positions-list__pitch .home:after, .positions-list__pitch .away:after {
  content: "";
  display: block;
  position: absolute;
  left: 13px;
  width: 20px;
  height: 7px;
  border: 1px solid #FFF;
}
.inverted .positions-list__pitch .home:after, .inverted .positions-list__pitch .away:after {
  border-color: #181C20;
}
.positions-list__pitch .home {
  border-top: none;
  top: 0;
}
.positions-list__pitch .home:after {
  top: 0;
  border-top: none;
}
.positions-list__pitch .away {
  border-bottom: none;
  bottom: 0;
}
.positions-list__pitch .away:after {
  bottom: 0;
  border-bottom: none;
}
.positions-list__pitch .center {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 1px;
  background: #FFFFFF;
}
.inverted .positions-list__pitch .center {
  background: #181C20;
}
.positions-list__pitch .center:after {
  content: "";
  display: block;
  position: absolute;
  border: 1px solid #FFF;
  width: 20px;
  height: 20px;
  border-radius: 100%;
  left: 50%;
  margin-left: -10px;
  margin-top: -10px;
}
.inverted .positions-list__pitch .center:after {
  border-color: #181C20;
}
.positions-list__pitch-position {
  display: block;
  position: absolute;
  width: 11px;
  height: 11px;
  border: 1px solid #2DC46E;
  border-radius: 100%;
  background: rgba(56, 207, 127, 0.3);
  margin-top: -5px;
  margin-left: -5px;
}
.positions-list__pitch-position.clickable {
  cursor: pointer;
}
.positions-list__pitch-position.clickable:hover {
  background: rgba(56, 207, 127, 0.5);
}
.positions-list__pitch-position.clickable.current-position {
  background: #FFF;
}
.positions-list__pitch-position.most-played {
  background: rgba(56, 207, 127, 0.5);
}
.positions-list__pitch-position.current-position {
  background: #FFF;
  border: none;
  opacity: 1;
}
.inverted .positions-list__pitch-position.current-position {
  opacity: 1 !important;
  background: #000;
  box-shadow: none;
  border: none;
}
.positions-list__pitch-position.not-selected-position {
  opacity: 0.5;
}
.inverted .positions-list__pitch-position.not-selected-position {
  opacity: 0.7;
}
.positions-list__positions-list {
  min-width: calc(100% - 125px);
  width: 100%;
}
.positions-list__positions-list .empty-message {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.5);
}
.positions-list__list-item {
  margin-top: 20px;
  font-size: 14px;
  line-height: 20px;
}
.positions-list__list-item:nth-child(1) {
  margin-top: 0;
}
.positions-list__list-item .progress-legend span {
  opacity: 0.7;
}
.positions-list__show-more-item {
  margin-top: 20px;
}
.positions-list__progress {
  width: 100%;
  height: 3px;
  background: #22313b;
  margin: 6px 0 3px;
}
.positions-list__progress-bar {
  height: 3px;
  background: #35B374;
}
.positions-list__show-more {
  font-size: 14px;
  line-height: 20px;
  border-bottom: 1px dotted;
  cursor: pointer;
  color: #2DC46E;
}
/* Colors */
/* Fonts */
/* Dimensions */
.demo-message {
  width: 196px;
  font-size: 16px;
  line-height: 20px;
  color: #35B374;
  font-family: "Sedgwick Ave", cursive;
  position: relative;
  pointer-events: none;
}
.demo-message svg {
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 32px;
}
.demo-message .demo-arrow {
  position: absolute;
}
.demo-message .demo-arrow.left {
  left: -49px;
  top: -8px;
}
.demo-message .demo-arrow.top-left {
  top: -30px;
  left: -30px;
  transform: rotate(90deg) scaleY(-1);
}
.demo-message .demo-arrow.top-right {
  top: -50px;
  left: 100%;
  margin-left: -61px;
  transform: rotate(90deg);
}
/* Colors */
/* Fonts */
/* Dimensions */
.indicator-control {
  cursor: pointer;
  display: inline-block;
  box-sizing: border-box;
  padding: 4px 4px 6px;
  width: 80px;
  height: 80px;
  background: #3A4C5A;
  position: relative;
  margin: 0 0 1px 1px;
}
.indicator-control__icon {
  width: 24px;
  height: 24px;
  margin: 16px auto 0;
}
.indicator-control__icon svg {
  width: 24px;
  height: 24px;
}
@media (max-width: 959px) {
  .indicator-control {
    width: 60px;
    height: 60px;
  }
  .indicator-control__icon {
    width: 16px;
    height: 16px;
    margin: 7px auto 0;
  }
  .indicator-control__icon svg {
    width: 16px;
    height: 16px;
  }
}
.indicator-control__name {
  box-sizing: border-box;
  font-size: 12px;
  line-height: 13px;
  width: 100%;
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 4px 4px 6px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.indicator-control__values {
  width: 240px;
  height: 40px;
  position: fixed;
  left: 0;
  background: #24323D;
  top: 0;
  border: 1px solid #3A4C5A;
  z-index: 5;
  color: #35B374;
  display: flex;
}
@media (max-width: 959px) {
  .indicator-control__values {
    width: 180px;
    height: 30px;
  }
}
.indicator-control__values span {
  width: 20%;
  display: block;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border-left: 1px solid #3A4C5A;
  cursor: pointer;
}
@media (max-width: 959px) {
  .indicator-control__values span {
    height: 30px;
    line-height: 28px;
  }
}
.indicator-control__values span svg {
  width: 20px;
  height: 40px;
}
@media (max-width: 959px) {
  .indicator-control__values span svg {
    height: 30px;
  }
}
.indicator-control__values span:hover {
  color: #FFF;
}
.indicator-control__values span:active {
  opacity: 0.85;
}
.indicator-control__values span.selected {
  background: #35B374;
  color: #FFF;
}
.indicator-control__value0:hover {
  background: #30619A;
}
.indicator-control__value1:hover {
  background: #7CB4D3;
}
.indicator-control__value2:hover {
  background: #A4A6A4;
}
.indicator-control__value3:hover {
  background: #EB8C49;
}
.indicator-control__value4:hover {
  background: #CA5425;
}
.indicator-control:hover, .indicator-control.active {
  color: #35B374;
}
/* Colors */
/* Fonts */
/* Dimensions */
.indicators-list {
  position: relative;
  padding-bottom: 24px;
  max-width: 304px;
}
.indicators-list > div > div:nth-child(1) {
  scroll-behavior: smooth;
}
.indicators-list__empty {
  max-width: 180px;
  margin: 24px auto;
  text-align: center;
}
.indicators-list__empty p {
  font-size: 13px;
  font-style: normal;
  line-height: 16px;
  text-align: left;
  color: #A4A6A4;
  margin: 0 0 16px;
}
.indicators-list__body {
  margin-bottom: 24px;
}
.indicators-list:after {
  content: "";
  width: 100%;
  height: 24px;
  bottom: -3px;
  left: 0;
  position: absolute;
  z-index: 2;
  background: linear-gradient(180deg, rgba(38, 55, 66, 0) 0%, rgb(38, 55, 66) 59.37%);
}
.indicators-list .scroll-arrow {
  width: 24px;
  height: 6px;
  position: absolute;
  left: 50%;
  margin-left: -12px;
  bottom: 0;
  z-index: 3;
  cursor: pointer;
  color: #FFF;
  stroke: currentColor;
  fill: none;
}
.indicators-list .scroll-arrow:hover {
  color: #35B374;
}
@media (max-width: 959px) {
  .indicators-list {
    display: block;
  }
  .indicators-list:after {
    display: none;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.single-report__shortcuts-controls {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
  overflow: hidden;
}
.single-report__shortcuts-controls .title-with-help {
  display: flex;
  align-items: center;
  justify-content: start;
  margin-bottom: 10px;
}
.single-report__shortcuts-controls .title-with-help h4 {
  margin-bottom: 0;
}
.single-report__shortcuts-controls .title-with-help .controls-list-help {
  padding-left: 12px;
  margin: 0;
}
.single-report__shortcuts-controls .title-with-help .controls-list-help svg {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -2px;
  width: 14px;
  height: 14px;
}
.single-report__shortcuts-controls .controls-list-help {
  padding-left: 12px;
  margin: 12px 0 4px;
}
.single-report__shortcuts-controls .controls-list-help svg {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 14px;
  height: 14px;
}
@media (max-width: 959px) {
  .single-report__shortcuts-controls {
    display: block;
  }
}
.single-report__shortcuts-controls__primary {
  flex-grow: 0;
}
.single-report__shortcuts-controls h4 {
  margin: 0 0 10px;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  letter-spacing: 1px;
  color: #CCC;
}
.single-report__shortcuts-controls__row {
  margin-bottom: 24px;
  flex-grow: 2;
}
.single-report__shortcuts-controls__groups {
  display: flex;
  justify-content: stretch;
}
/* Colors */
/* Fonts */
/* Dimensions */
.report-main {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  height: 100%;
  margin: 0 auto;
  padding-bottom: 20px;
}
.report-main .player-body {
  flex-grow: 2;
  display: flex;
  flex-direction: column;
}
@media (max-width: 959px) {
  .report-main .player-body .scroll-container {
    min-width: 959px;
  }
}
.report-main .player-body.with-scroll {
  position: relative;
}
.report-main .player-body.with-scroll > div > div:nth-child(1) {
  scroll-behavior: smooth;
}
.report-main .player-body.with-scroll:after {
  content: "";
  width: 100%;
  height: 24px;
  bottom: -3px;
  left: 0;
  position: absolute;
  z-index: 2;
  background: linear-gradient(180deg, rgba(38, 55, 66, 0) 0%, rgb(38, 55, 66) 59.37%);
}
.report-main .player-body.with-scroll .scroll-arrow {
  width: 24px;
  height: 6px;
  position: absolute;
  left: 50%;
  margin-left: -12px;
  bottom: 0;
  z-index: 3;
  cursor: pointer;
  color: #FFF;
  stroke: currentColor;
  fill: none;
}
.report-main .player-body.with-scroll .scroll-arrow:hover {
  color: #35B374;
}
@media (max-width: 959px) {
  .report-main {
    padding: 0 20px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.pdf {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  background: #263742;
  will-change: transform, opacity;
  z-index: 1;
}
.pdf .pdf-top-bar {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  padding: 20px;
  background: #1C2830;
  z-index: 6;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 959px) {
  .pdf .pdf-top-bar {
    position: relative;
    top: 0;
    right: 0;
    left: 0;
    padding: 13px 34px 13px 13px;
  }
}
.pdf .pdf-top-bar .btn {
  padding: 0px 60px;
  flex-shrink: 0;
}
.pdf .pdf-top-bar .btn svg {
  vertical-align: middle;
  position: relative;
  top: -2px;
  width: 21px;
  height: 21px;
}
@media screen and (max-width: 959px) {
  .pdf .pdf-top-bar .btn svg {
    width: 14px;
    height: 14px;
    top: -1px;
  }
}
.pdf .pdf-top-bar .btn.notify, .pdf .pdf-top-bar .btn.mark-incomplete, .pdf .pdf-top-bar .btn.go-to-match {
  margin-left: 16px;
}
.pdf .pdf-top-bar .btn.mark-incomplete {
  background: #d33a61;
  border-color: #d33a61;
  color: #FFF;
}
@media screen and (max-width: 959px) {
  .pdf .pdf-top-bar .btn {
    padding: 0 20px;
  }
}
.pdf .pdf-top-bar .text {
  flex-shrink: 1;
  flex-grow: 0;
  display: block;
  margin-left: 30px;
  text-transform: uppercase;
}
.pdf .pdf-top-bar .text svg {
  vertical-align: middle;
  position: relative;
  top: -2px;
  width: 21px;
  height: 21px;
  margin-right: 4px;
}
@media screen and (max-width: 959px) {
  .pdf .pdf-top-bar .text svg {
    width: 14px;
    height: 14px;
    top: -1px;
  }
}
.pdf .pdf__close {
  position: absolute;
  top: 28px;
  right: 28px;
  cursor: pointer;
  z-index: 1;
}
@media screen and (max-width: 959px) {
  .pdf .pdf__close {
    top: 16px;
    right: 16px;
  }
}
.pdf .pdf__close svg {
  width: 24px;
  height: 24px;
}
@media screen and (max-width: 959px) {
  .pdf .pdf__close svg {
    width: 18px;
    height: 18px;
  }
}
.pdf .pdf-page {
  background: #fff;
  width: 1024px;
  min-height: 1449px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.25);
  margin: 20px auto;
  color: #000;
  padding: 100px;
}
@media screen and (max-width: 959px) {
  .pdf .pdf-page {
    width: 682px;
    min-height: 966px;
    margin: 10px auto;
    padding: 66px;
  }
  .pdf .pdf-page.single {
    width: 772px;
  }
}
.pdf .pdf-page:first-child {
  margin-top: 100px;
}
@media screen and (max-width: 959px) {
  .pdf .pdf-page:first-child {
    margin-top: 66px;
  }
}
.pdf .pdf-list-player {
  position: relative;
  font-size: 16px;
  padding-left: 30px;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 24px;
  margin-bottom: 7px;
  padding-bottom: 5px;
}
@media screen and (max-width: 959px) {
  .pdf .pdf-list-player {
    font-size: 11px;
    padding-left: 22px;
    line-height: 18px;
    margin-bottom: 6px;
  }
}
.pdf .pdf-list-player .player__number {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 24px;
  height: 24px;
  line-height: 22px;
  text-align: center;
  border-radius: 50%;
  border: 1px solid #000;
  font-weight: 500;
  font-size: 14px;
}
@media screen and (max-width: 959px) {
  .pdf .pdf-list-player .player__number {
    width: 18px;
    height: 18px;
    line-height: 16px;
    font-size: 10px;
  }
}
.pdf .pdf-list-player .player__name {
  font-weight: 600;
}
.pdf .pdf-list-player .player__position {
  font-weight: 500;
}
.pdf .pdf-list-player.home .player__number {
  color: #fff;
  background: #252525;
}
/* Colors */
/* Fonts */
/* Dimensions */
.pdf-header {
  padding: 0 0 42px;
}
.pdf-header.small {
  padding-bottom: 0;
  margin-top: 26px;
  height: 48px;
  width: 100%;
}
@media screen and (max-width: 959px) {
  .pdf-header {
    padding: 0 0 28px;
  }
  .pdf-header.small-header {
    padding-bottom: 0;
  }
}
.pdf-header .match-info {
  text-align: center;
}
.pdf-header .match-info .match-info-teams {
  display: flex;
}
.pdf-header .match-info .match-info-teams .home-team,
.pdf-header .match-info .match-info-teams .away-team {
  font-size: 26px;
  line-height: 31px;
  font-weight: bold;
  vertical-align: middle;
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
}
.small-header .pdf-header .match-info .match-info-teams .home-team,
.small-header .pdf-header .match-info .match-info-teams .away-team {
  font-size: 19px;
  line-height: 20px;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-teams .home-team,
  .pdf-header .match-info .match-info-teams .away-team {
    font-size: 18px;
    line-height: 21px;
  }
  .small-header .pdf-header .match-info .match-info-teams .home-team,
  .small-header .pdf-header .match-info .match-info-teams .away-team {
    font-size: 12px;
    line-height: 14px;
  }
}
.pdf-header .match-info .match-info-teams .home-team .team-logo,
.pdf-header .match-info .match-info-teams .away-team .team-logo {
  position: absolute;
  top: 50%;
  width: 54px;
  height: 68px;
  margin-top: -34px;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
}
.small-header .pdf-header .match-info .match-info-teams .home-team .team-logo,
.small-header .pdf-header .match-info .match-info-teams .away-team .team-logo {
  width: 48px;
  height: 58px;
  margin-top: -29px;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-teams .home-team .team-logo,
  .pdf-header .match-info .match-info-teams .away-team .team-logo {
    width: 36px;
    height: 46px;
    margin-top: -23px;
  }
  .small-header .pdf-header .match-info .match-info-teams .home-team .team-logo,
  .small-header .pdf-header .match-info .match-info-teams .away-team .team-logo {
    width: 28px;
    height: 36px;
    margin-top: -18px;
  }
}
.pdf-header .match-info .match-info-teams .home-team {
  align-items: flex-end;
  padding-right: 68px;
}
.small-header .pdf-header .match-info .match-info-teams .home-team {
  padding-right: 56px;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-teams .home-team {
    padding-right: 45px;
  }
  .small-header .pdf-header .match-info .match-info-teams .home-team {
    padding-right: 34px;
  }
}
.pdf-header .match-info .match-info-teams .home-team .team-logo {
  right: 0;
}
.pdf-header .match-info .match-info-teams .away-team {
  text-align: left;
  padding-left: 68px;
}
.small-header .pdf-header .match-info .match-info-teams .away-team {
  padding-left: 56px;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-teams .away-team {
    padding-left: 45px;
  }
  .small-header .pdf-header .match-info .match-info-teams .away-team {
    padding-right: 34px;
  }
}
.pdf-header .match-info .match-info-teams .away-team .team-logo {
  left: 0;
}
.pdf-header .match-info .match-info-teams .match-result {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  margin: 0 18px;
}
.small-header .pdf-header .match-info .match-info-teams .match-result {
  margin: 0;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-teams .match-result {
    margin: 0 12px;
  }
  .small-header .pdf-header .match-info .match-info-teams .match-result {
    margin: 0;
  }
}
.pdf-header .match-info .match-info-teams .match-result .min,
.pdf-header .match-info .match-info-teams .match-result .second-score {
  position: absolute;
  right: 0;
  left: 0;
  display: inline;
}
.pdf-header .match-info .match-info-teams .match-result .min {
  font-size: 10px;
  font-weight: 400;
  color: #4B4B4B;
  top: -5px;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-teams .match-result .min {
    font-size: 7px;
    top: -4px;
  }
}
.pdf-header .match-info .match-info-teams .match-result .second-score {
  font-size: 16px;
  font-weight: 500;
  color: #B1B1B1;
  bottom: -12px;
  line-height: 21px;
}
.small-header .pdf-header .match-info .match-info-teams .match-result .second-score {
  font-size: 12px;
  line-height: 14px;
  color: #637581;
  bottom: -2px;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-teams .match-result .second-score {
    font-size: 12px;
    bottom: -8px;
    line-height: 14px;
  }
}
.pdf-header .match-info .match-info-teams .match-result .second-score textarea {
  display: inline-block;
  text-align: center;
  height: 21px;
  width: 10px;
  overflow: hidden;
  resize: none;
  border: none;
  vertical-align: bottom;
  padding: 0;
  line-height: 21px;
}
.small-header .pdf-header .match-info .match-info-teams .match-result .second-score textarea {
  font-size: 12px;
  line-height: 14px;
  color: #637581;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-teams .match-result .second-score textarea {
    height: 14px;
    width: 7px;
    line-height: 14px;
  }
}
.pdf-header .match-info .match-info-teams .match-result .score {
  font-weight: 500;
  font-size: 42px;
  color: #4B4B4B;
  line-height: 54px;
  display: flex;
}
.small-header .pdf-header .match-info .match-info-teams .match-result .score {
  font-size: 19px;
  line-height: 29px;
  color: #181C20;
  font-weight: bold;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-teams .match-result .score {
    font-size: 28px;
    line-height: 36px;
  }
  .small-header .pdf-header .match-info .match-info-teams .match-result .score {
    font-size: 13px;
    line-height: 17px;
  }
}
.pdf-header .match-info .match-info-teams .match-result .score textarea {
  display: inline-block;
  text-align: center;
  height: 54px;
  width: 24px;
  overflow: hidden;
  resize: none;
  border: none;
  vertical-align: bottom;
  padding: 0;
  line-height: 54px;
}
.small-header .pdf-header .match-info .match-info-teams .match-result .score textarea {
  line-height: 29px;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-teams .match-result .score textarea {
    height: 36px;
    width: 16px;
    line-height: 36px;
  }
  .small-header .pdf-header .match-info .match-info-teams .match-result .score textarea {
    line-height: 18px;
  }
}
.pdf-header .match-info .match-info-other {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.75);
  font-weight: 500;
  text-transform: uppercase;
  margin-top: 16px;
}
@media screen and (max-width: 959px) {
  .pdf-header .match-info .match-info-other {
    font-size: 10px;
    margin-top: 10px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.pdf-pitch {
  margin: 0 auto;
  position: relative;
  font-size: 0;
  color: #fff;
}
.pdf-pitch .pixel-perfect {
  shape-rendering: crispEdges;
}
.pdf-pitch .pdf-pitch-player {
  width: 42px;
  height: 42px;
  margin: -21px 0 0 -21px;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 50%;
  -webkit-transition: left 0.5s, top 0.5s;
  -moz-transition: left 0.5s, top 0.5s;
  transition: left 0.5s, top 0.5s;
}
@media screen and (max-width: 959px) {
  .pdf-pitch .pdf-pitch-player {
    width: 26px;
    height: 26px;
    margin: -13px 0 0 -13px;
  }
}
.pdf-pitch .pdf-pitch-player.active {
  z-index: 1;
}
.pdf-pitch .pdf-pitch-player:before {
  content: "";
  border-radius: 50%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  -webkit-animation: preview-end 0.1s linear;
  -moz-animation: preview-end 0.1s linear;
  animation: preview-end 0.1s linear;
}
.pdf-pitch .pdf-pitch-player .player__number {
  position: relative;
  color: #fff;
  text-align: center;
  display: block;
  width: 42px;
  height: 42px;
}
@media screen and (max-width: 959px) {
  .pdf-pitch .pdf-pitch-player .player__number {
    width: 26px;
    height: 26px;
  }
}
.pdf-pitch .pdf-pitch-player .player__number-text {
  font-size: 21px;
  line-height: 21px;
  font-weight: 700;
  margin-top: 3px;
}
@media (max-width: 959px) {
  .pdf-pitch .pdf-pitch-player .player__number-text {
    margin-top: 2px;
    font-size: 9px;
    line-height: 9px;
  }
}
.pdf-pitch .pdf-pitch-player .player__birthdate {
  margin-top: -4px;
  line-height: 21px;
  font-size: 10px;
  color: #CCC;
}
@media (max-width: 959px) {
  .pdf-pitch .pdf-pitch-player .player__birthdate {
    margin-top: -2px;
    font-size: 7px;
    line-height: 9px;
  }
}
.pdf-pitch .pdf-pitch-player .cards {
  left: 75%;
  top: 75%;
  position: absolute;
  white-space: nowrap;
}
.pdf-pitch .pdf-pitch-player .cards svg {
  width: 14px;
  height: 14px;
}
.pdf-pitch .pdf-pitch-player .cards svg.red {
  fill: #ef3955;
  stroke: #ef3955;
}
.pdf-pitch .pdf-pitch-player .cards svg.yellow {
  fill: #fccf07;
  stroke: #fccf07;
}
.pdf-pitch .pdf-pitch-player.substituted .player__number:before {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  height: 0;
  width: 0;
  border-bottom: 10px solid #fff;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
}
@media screen and (max-width: 959px) {
  .pdf-pitch .pdf-pitch-player.substituted .player__number:before {
    height: 0;
    width: 0;
    border-bottom: 6px solid #fff;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
  }
}
.pdf-pitch .pdf-pitch-player.substituted .player__number:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 0;
  width: 0;
  border-bottom: 8px solid #188538;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
}
@media screen and (max-width: 959px) {
  .pdf-pitch .pdf-pitch-player.substituted .player__number:after {
    height: 0;
    width: 0;
    border-bottom: 4px solid #188538;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
  }
}
.pdf-pitch .pdf-pitch-player.home:before {
  background: #202020;
}
.pdf-pitch .pdf-pitch-player.away:before {
  background: #fff;
}
.pdf-pitch .pdf-pitch-player.away .player__number {
  color: #000;
}
.pdf-pitch .pdf-pitch-player.away .player__birthdate {
  color: #000;
}
.pdf-pitch .pdf-pitch-player .player__name {
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  margin: 0 -20px;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  margin-top: 1px;
  text-shadow: 1px 0 0 #202020, -1px 0 0 #202020, 0 1px 0 #202020, 0 -1px 0 #202020, 1px 1px 0 #202020, 1px -1px 0 #202020, -1px 1px 0 #202020, -1px -1px 0 #202020;
}
@media screen and (max-width: 959px) {
  .pdf-pitch .pdf-pitch-player .player__name {
    margin: 0 -10px;
    font-size: 11px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.pdf-bench .bench-title {
  text-transform: uppercase;
  color: #4B4B4B;
  font-weight: bold;
  font-size: 14px;
  margin: 40px 0 12px;
}
@media screen and (max-width: 959px) {
  .pdf-bench .bench-title {
    font-size: 11px;
    margin: 20px 0 6px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.pdf-substitution .substitution-title {
  text-transform: uppercase;
  color: #4B4B4B;
  font-weight: bold;
  font-size: 14px;
  margin: 40px 0 12px;
}
@media screen and (max-width: 959px) {
  .pdf-substitution .substitution-title {
    font-size: 11px;
    margin: 20px 0 6px;
  }
}
.pdf-substitution .pdf-substitution-player {
  position: relative;
  padding-left: 15px;
}
@media screen and (max-width: 959px) {
  .pdf-substitution .pdf-substitution-player {
    padding-left: 11px;
  }
}
.pdf-substitution .pdf-substitution-player:before {
  position: absolute;
  top: 8px;
  left: 0;
  position: absolute;
  content: "";
}
@media screen and (max-width: 959px) {
  .pdf-substitution .pdf-substitution-player:before {
    top: 6px;
  }
}
.pdf-substitution .pdf-substitution-player.out:before {
  height: 0;
  width: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 9px solid #C95000;
}
@media screen and (max-width: 959px) {
  .pdf-substitution .pdf-substitution-player.out:before {
    height: 0;
    width: 0;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 5px solid #C95000;
  }
}
.pdf-substitution .pdf-substitution-player.in:before {
  height: 0;
  width: 0;
  border-bottom: 9px solid #00BF00;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
}
@media screen and (max-width: 959px) {
  .pdf-substitution .pdf-substitution-player.in:before {
    height: 0;
    width: 0;
    border-bottom: 5px solid #00BF00;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
  }
}
.pdf-substitution .pdf-substitutions-list {
  position: relative;
  padding-left: 72px;
}
.pdf-substitution .pdf-substitutions-list .pdf-substitutions-min {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}
.pdf-substitution .pdf-substitutions-list .pdf-substitutions-min .period {
  width: 90px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
  vertical-align: top;
}
@media screen and (max-width: 959px) {
  .pdf-substitution .pdf-substitutions-list .pdf-substitutions-min {
    font-size: 10px;
    line-height: 18px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.pdf-rates .rate-indicator-icon {
  width: 12px;
  height: 12px;
  display: inline-block;
  margin-right: 4px;
  vertical-align: middle;
}
.pdf-rates .note-event {
  position: absolute;
  left: -40px;
  width: 38px;
  top: 1px;
  text-align: center;
  white-space: nowrap;
}
.pdf-rates .tag {
  color: #2DC46E;
  font-size: 13px;
  display: inline-block;
  margin-right: 6px;
  line-height: 20px;
}
.pdf-rates .note-icon {
  width: 14px;
  height: 14px;
  display: inline-block;
}
.pdf-rates .note-icon + .note-icon {
  margin-left: -4px;
}
.pdf-rates .note-icon.goal-icon {
  stroke: #000;
  fill: #FFF;
  margin-right: 6px;
}
.pdf-rates .note-icon.red-card-icon {
  fill: #ef3955;
  stroke: #ef3955;
}
.pdf-rates .note-icon.yellow-red-card-icon {
  fill: #ef3955;
  stroke: #ef3955;
}
.pdf-rates .note-icon.yellow-card-icon {
  fill: #fccf07;
  stroke: #fccf07;
}
.pdf-rates .pdf-rates-team {
  padding-left: 70px;
  position: relative;
  width: 40%;
  font-weight: 700;
  font-size: 26px;
  line-height: 24px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .pdf-rates-team {
    padding-left: 46px;
    font-size: 18px;
    line-height: 16px;
  }
}
.pdf-rates .pdf-rates-team .team-logo {
  width: 54px;
  height: 68px;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -34px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
}
@media screen and (max-width: 959px) {
  .pdf-rates .pdf-rates-team .team-logo {
    width: 36px;
    height: 46px;
    margin-top: -23px;
  }
}
.pdf-rates .pdf-rates-list {
  margin: 40px 0 0;
}
@media screen and (max-width: 959px) {
  .pdf-rates .pdf-rates-list {
    margin: 20px 0 0;
  }
}
.pdf-rates .pdf-rates-list .title {
  text-transform: uppercase;
  border-bottom: 1px solid #D7D9D7;
  font-size: 14px;
  line-height: 18px;
  color: #393939;
  padding-bottom: 18px;
  font-weight: 700;
}
@media screen and (max-width: 959px) {
  .pdf-rates .pdf-rates-list .title {
    font-size: 11px;
    line-height: 12px;
    padding-bottom: 12px;
  }
}
.pdf-rates .rated-player {
  border-bottom: 1px solid #D7D9D7;
  padding: 40px 0 40px 120px;
  page-break-inside: avoid;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player {
    padding: 20px 0 20px 80px;
  }
}
.pdf-rates .rated-player-name {
  white-space: nowrap;
  position: relative;
  padding: 25px 10px 29px 0;
  float: left;
  width: 190px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player-name {
    padding: 10px 6px 20px 0;
    width: 126px;
  }
}
.pdf-rates .rated-player-name .player-photo {
  position: absolute;
  top: 50%;
  left: -120px;
  margin-top: -53px;
  width: 106px;
  height: 106px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  border-radius: 50%;
  overflow: hidden;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player-name .player-photo {
    left: -80px;
    margin-top: -35px;
    width: 70px;
    height: 70px;
  }
}
.pdf-rates .rated-player-name .add-to-favorites {
  position: absolute;
  bottom: -15px;
  left: -47px;
}
.pdf-rates .rated-player-name .rated-player-favorite {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid #E5E5E5;
  display: inline-block;
  background: #fff;
  color: #fff;
  text-align: center;
  line-height: 34px;
  cursor: pointer;
  position: relative;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player-name .rated-player-favorite {
    width: 26px;
    height: 26px;
    line-height: 22px;
    bottom: -4px;
    left: -32px;
  }
}
.pdf-rates .rated-player-name .rated-player-favorite svg {
  vertical-align: middle;
  stroke: #2DC46E;
  width: 22px;
  height: 22px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player-name .rated-player-favorite svg {
    width: 14px;
    height: 14px;
  }
}
.pdf-rates .rated-player-name .rated-player-favorite.active {
  background: #000;
  color: #fff;
}
.pdf-rates .rated-player-name .rated-player-favorite.active svg {
  stroke: #000;
}
.pdf-rates .rated-player-name .first_name {
  font-weight: 500;
  font-size: 20px;
  line-height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player-name .first_name {
    font-size: 13px;
    line-height: 13px;
  }
}
.pdf-rates .rated-player-name .last_name {
  font-weight: 600;
  font-size: 28px;
  line-height: 31px;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player-name .last_name {
    font-size: 18px;
    line-height: 18px;
  }
}
.pdf-rates .rated-player-info {
  float: left;
  padding: 0 0 0 22px;
  width: 209px;
  border-left: 1px solid #E9EBE9;
  border-right: 1px solid #E9EBE9;
  min-height: 106px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player-info {
    padding: 0 0 0 11px;
    width: 140px;
    min-height: 53px;
  }
}
.pdf-rates .rated-player-info .info {
  vertical-align: top;
  display: inline-block;
  margin-right: 22px;
  white-space: nowrap;
  padding: 5px 0 10px;
  min-width: 30px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player-info .info {
    margin-right: 14px;
    padding: 4px 0 7px;
    min-width: 20px;
  }
}
.pdf-rates .rated-player-info .info .info-value {
  font-weight: 400;
  font-size: 16px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player-info .info .info-value {
    font-size: 11px;
  }
}
.pdf-rates .rated-player-info .info .info-name {
  font-weight: 400;
  font-size: 12px;
  text-transform: uppercase;
  color: #565656;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-player-info .info .info-name {
    font-size: 10px;
  }
}
.pdf-rates .rates-group {
  float: right;
}
.pdf-rates .rates-table {
  padding: 5px 5px 5px 30px;
  border-left: 1px solid #E9EBE9;
  margin-left: -1px;
  min-height: 106px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rates-table {
    padding: 3px 8px 3px 15px;
    min-height: 53px;
  }
}
@media print {
  .pdf-rates .rates-table {
    min-height: 0;
  }
}
.pdf-rates .rates-table table {
  width: 270px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rates-table table {
    width: 181px;
  }
}
.pdf-rates .rates-table table thead td {
  text-align: right;
  font-size: 14px;
  font-weight: 600;
  padding: 0 0 3px;
  border: none;
  border-bottom: 2px solid #CACCCA;
  vertical-align: bottom;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rates-table table thead td {
    font-size: 11px;
    padding: 0 0 2px;
  }
}
.pdf-rates .rates-table table thead td .offset {
  display: inline-block;
  width: 20px;
  text-align: center;
  position: relative;
  right: -10px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rates-table table thead td .offset {
    width: 14px;
    right: -7px;
  }
}
.pdf-rates .rates-table table thead .rates-table-title {
  float: left;
  font-size: 14px;
  color: #565656;
  font-weight: 400;
  position: relative;
  top: -3px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rates-table table thead .rates-table-title {
    font-size: 11px;
    top: -2px;
  }
}
.pdf-rates .rates-table table tbody tr td {
  font-weight: 400;
  font-size: 12px;
  line-height: 32px;
  padding: 0;
  border: 1px solid #CACCCA;
  border-bottom: 1px solid #E9EBE9;
  white-space: nowrap;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rates-table table tbody tr td {
    font-size: 10px;
    line-height: 20px;
  }
}
.pdf-rates .rates-table table tbody tr td:first-child {
  border-left: none;
}
.pdf-rates .rates-table table tbody tr td.fixed-width {
  width: 32px;
  font-size: 0;
  line-height: 0;
  vertical-align: middle;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rates-table table tbody tr td.fixed-width {
    width: 20px;
  }
}
.pdf-rates .rates-table table .rate-value {
  position: relative;
  width: 0;
  height: 0;
  float: left;
  display: inline-block;
}
.pdf-rates .rates-table table .rate-value .circle {
  position: absolute;
  top: 0;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  margin: -7px 0 0 -7px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rates-table table .rate-value .circle {
    width: 10px;
    height: 10px;
    margin: -5px 0 0 -5px;
  }
}
.pdf-rates .final-rating {
  padding: 5px 15px 5px 30px;
  border-left: 1px solid #E9EBE9;
  margin-left: -1px;
  width: 306px;
  margin-top: 10px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .final-rating {
    padding: 3px 10px 3px 15px;
    width: 205px;
    margin-top: 5px;
  }
}
@media print {
  .pdf-rates .final-rating {
    margin-top: 0;
    padding-top: 15px;
  }
}
.pdf-rates .final-rating .final-rating-title {
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .final-rating .final-rating-title {
    font-size: 11px;
  }
}
.pdf-rates .final-rating .final-rating-list {
  text-align: right;
  margin: 0 -2px 20px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .final-rating .final-rating-list {
    margin-bottom: 13px;
  }
}
.pdf-rates .final-rating .final-rating-list .final-rating-item {
  display: inline-block;
  width: 36px;
  height: 36px;
  position: relative;
  margin-top: 10px;
  cursor: pointer;
}
@media screen and (max-width: 959px) {
  .pdf-rates .final-rating .final-rating-list .final-rating-item {
    width: 24px;
    height: 24px;
    margin-top: 7px;
    margin-left: 2px;
  }
}
.pdf-rates .final-rating .final-rating-list .final-rating-item:first-child {
  float: left;
}
.pdf-rates .final-rating .final-rating-list .final-rating-item .inner,
.pdf-rates .final-rating .final-rating-list .final-rating-item .outer {
  display: inline-block;
  content: "";
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  position: absolute;
  top: 50%;
  left: 50%;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  -webkit-transition: width 0.2s, height 0.2s, opacity 0.2s;
  -moz-transition: width 0.2s, height 0.2s, opacity 0.2s;
  transition: width 0.2s, height 0.2s, opacity 0.2s;
}
@media screen and (max-width: 959px) {
  .pdf-rates .final-rating .final-rating-list .final-rating-item .inner,
  .pdf-rates .final-rating .final-rating-list .final-rating-item .outer {
    width: 18px;
    height: 18px;
  }
}
.pdf-rates .final-rating .final-rating-list .final-rating-item .inner {
  opacity: 0;
}
.pdf-rates .final-rating .final-rating-list .final-rating-item .outer {
  border-style: solid;
  border-width: 2px;
}
.pdf-rates .final-rating .final-rating-list .final-rating-item .name {
  position: absolute;
  top: 100%;
  right: -30px;
  left: -30px;
  color: #2DC46E;
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  margin-top: 4px;
  -webkit-transition: font-weight 0.2s, color 0.2s, padding-top 0.2s;
  -moz-transition: font-weight 0.2s, color 0.2s, padding-top 0.2s;
  transition: font-weight 0.2s, color 0.2s, padding-top 0.2s;
}
@media screen and (max-width: 959px) {
  .pdf-rates .final-rating .final-rating-list .final-rating-item .name {
    right: -20px;
    left: -20px;
    font-size: 9px;
    margin-top: 3px;
  }
}
.pdf-rates .final-rating .final-rating-list .final-rating-item .name:before {
  content: "";
  width: 1px;
  height: 4px;
  background: #979797;
  position: absolute;
  top: -4px;
  left: 50%;
}
@media screen and (max-width: 959px) {
  .pdf-rates .final-rating .final-rating-list .final-rating-item .name:before {
    height: 3px;
  }
}
.pdf-rates .final-rating .final-rating-list .final-rating-item.active .inner {
  opacity: 1;
}
.pdf-rates .final-rating .final-rating-list .final-rating-item.active .outer {
  width: 36px;
  height: 36px;
  border-width: 1px;
  border-color: #000 !important;
}
@media screen and (max-width: 959px) {
  .pdf-rates .final-rating .final-rating-list .final-rating-item.active .outer {
    width: 24px;
    height: 24px;
  }
}
.pdf-rates .final-rating .final-rating-list .final-rating-item.active .name {
  color: #2DC46E;
  font-weight: 700;
}
@media screen and (max-width: 959px) {
  .pdf-rates .final-rating .final-rating-list .final-rating-item.active .name {
    padding-top: 2px;
  }
}
.pdf-rates .rated-notes {
  width: 378px;
  float: left;
  line-height: 22px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-notes {
    width: 252px;
  }
}
.pdf-rates .rated-notes .player-note-group {
  position: relative;
  margin-top: 20px;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-notes .player-note-group {
    margin-top: 12px;
  }
}
.pdf-rates .rated-notes .player-note-group .note-group {
  margin-left: -50px;
  font-weight: 700;
  font-size: 16px;
  width: 106px;
  white-space: nowrap;
}
.pdf-rates .rated-notes .player-note-item {
  position: relative;
  margin-top: 5px;
}
.pdf-rates .rated-notes .player-note-item .note-min {
  position: absolute;
  top: 0;
  left: -60px;
  font-weight: 700;
  font-size: 16px;
  min-width: 42px;
  white-space: nowrap;
  font-size: 12px;
}
.pdf-rates .rated-notes .player-note-item .note-min .period {
  max-width: 64px;
  text-overflow: ellipsis;
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-notes .player-note-item .note-min {
    left: -40px;
    font-size: 11px;
    line-height: 14px;
  }
}
.pdf-rates .rated-notes .player-note-item .note {
  font-family: "Source Sans Pro", Helvetica, sans-serif;
  font-size: 15px;
  line-height: 22px;
  width: 100%;
  border: none;
  resize: none;
  padding: 0;
  font-weight: normal;
  display: block;
}
@media screen and (max-width: 959px) {
  .pdf-rates .rated-notes .player-note-item .note {
    font-size: 10px;
    line-height: 14px;
  }
}
.pdf-rates .pdf-team-notes {
  margin: 45px 0 0;
}
@media screen and (max-width: 959px) {
  .pdf-rates .pdf-team-notes {
    margin: 30px 0 0;
  }
}
.pdf-rates .pdf-team-notes .title {
  text-transform: uppercase;
  font-size: 14px;
  line-height: 18px;
  color: #393939;
  font-weight: 700;
}
@media screen and (max-width: 959px) {
  .pdf-rates .pdf-team-notes .title {
    font-size: 10px;
    line-height: 12px;
  }
}
.pdf-rates .pdf-team-notes .note {
  font-family: "Source Sans Pro", Helvetica, sans-serif;
  font-size: 15px;
  line-height: 22px;
  width: 100%;
  border: none;
  resize: none;
  margin: 20px 0 0;
  padding: 0;
  font-weight: normal;
}
@media screen and (max-width: 959px) {
  .pdf-rates .pdf-team-notes .note {
    font-size: 10px;
    line-height: 12px;
    margin: 13px 0 0;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.pdf-lineups .title {
  font-weight: 700;
  text-transform: uppercase;
  font-size: 14px;
  color: #393939;
  margin: 0 0 12px;
  border: none;
  resize: none;
  padding: 0;
}
@media screen and (max-width: 959px) {
  .pdf-lineups .title {
    font-size: 11px;
    margin: 0 0 6px;
  }
}
.pdf-lineups .pdf-lineups-mins {
  margin-top: 40px;
  font-size: 16px;
  font-weight: 400;
}
@media screen and (max-width: 959px) {
  .pdf-lineups .pdf-lineups-mins {
    margin-top: 20px;
    font-size: 12px;
  }
}
.pdf-lineups .pdf-pitch .pdf-pitch-player {
  width: 21px;
  height: 21px;
  margin: -10px 0 0 -10px;
}
@media screen and (max-width: 959px) {
  .pdf-lineups .pdf-pitch .pdf-pitch-player {
    width: 18px;
    height: 18px;
    margin: -9px 0 0 -9px;
  }
}
.pdf-lineups .pdf-pitch .pdf-pitch-player .player__number {
  font-size: 11px;
  line-height: 21px;
  width: 21px;
  height: 21px;
}
@media screen and (max-width: 959px) {
  .pdf-lineups .pdf-pitch .pdf-pitch-player .player__number {
    font-size: 9px;
    line-height: 18px;
    width: 18px;
    height: 18px;
  }
}
.pdf-lineups .pdf-pitch .pdf-pitch-player .player__name {
  font-size: 8px;
}
@media screen and (max-width: 959px) {
  .pdf-lineups .pdf-pitch .pdf-pitch-player .player__name {
    font-size: 6px;
  }
}
.pdf-lineups .pdf-pitch .pdf-pitch-player.substituted .player__number:before {
  height: 0;
  width: 0;
  border-bottom: 8px solid #fff;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: none;
  margin-top: -2px;
}
@media screen and (max-width: 959px) {
  .pdf-lineups .pdf-pitch .pdf-pitch-player.substituted .player__number:before {
    height: 0;
    width: 0;
    border-bottom: 4px solid #fff;
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
  }
}
.pdf-lineups .pdf-pitch .pdf-pitch-player.substituted .player__number:after {
  height: 0;
  width: 0;
  border-bottom: 6px solid #188538;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: none;
  margin-top: -2px;
}
@media screen and (max-width: 959px) {
  .pdf-lineups .pdf-pitch .pdf-pitch-player.substituted .player__number:after {
    height: 0;
    width: 0;
    border-bottom: 2px solid #188538;
    border-left: 2px solid transparent;
    border-right: 2px solid transparent;
  }
}
.pdf-lineups .col-6 {
  margin-bottom: 100px;
}
@media screen and (max-width: 959px) {
  .pdf-lineups .col-6 {
    margin-bottom: 50px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.pdf-events {
  margin: 24px auto 0;
  max-width: 400px;
}
.pdf-events table {
  border: none;
}
.pdf-events table tr, .pdf-events table td, .pdf-events table th {
  border: none;
}
.pdf-events table td {
  border-top: 1px solid #D7D9D7;
  white-space: nowrap;
}
.pdf-events table tr:nth-child(1) td {
  border-top: none;
}
.pdf-events .events-goal {
  text-align: center;
  font-weight: bold;
  white-space: nowrap;
}
.pdf-events .goal-time {
  font-weight: bold;
  margin: 0 4px;
  display: inline-block;
}
.pdf-events .team-logo {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
}
.pdf-events .player-photo {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-left: 4px;
}
.pdf-events .goal-info {
  white-space: nowrap;
}
.pdf-events .own-goal {
  color: #d33a61;
}
.pdf-events .right {
  text-align: right;
}
/* Colors */
/* Fonts */
/* Dimensions */
.pdf-block {
  display: flex;
  margin-top: 43px;
  border: 1px solid #CCCCCC;
  border-radius: 4px;
  padding: 24px 0;
}
.pdf-block .col {
  border-left: 1px solid #CCCCCC;
  padding: 0 20px;
  flex-grow: 1;
}
.pdf-block .col:nth-child(1) {
  border-left: none;
}
@media screen and (max-width: 959px) {
  .pdf-block .col {
    padding: 0 12px;
  }
}
.pdf-block:nth-child(1) {
  margin-top: 0;
}
.pdf-block .data-item-changeable__value {
  color: #181C20;
}
.pdf-block .data-item-changeable__input input {
  color: #181C20;
  border-bottom: #181C20;
}
.pdf-block .data-item-changeable__label {
  color: #637581;
}
.pdf-block .data-item__value {
  color: #181C20;
}
.pdf-block .data-item__label {
  color: #637581;
  text-overflow: ellipsis;
  overflow: hidden;
}
.pdf-block h4 {
  font-size: 12px;
  line-height: 16px;
  text-transform: uppercase;
  font-weight: bold;
}
@media screen and (max-width: 959px) {
  .pdf-block h4 {
    font-size: 10px;
    line-height: 14px;
  }
}
.pdf-block .add-to-favorites {
  position: relative;
}
.pdf-block .favorite-selector {
  cursor: pointer;
  font-size: 24px;
  line-height: 24px;
  color: #181C20;
  white-space: nowrap;
}
@media screen and (max-width: 959px) {
  .pdf-block .favorite-selector {
    font-size: 16px;
    line-height: 16px;
  }
}
.pdf-block .favorite-selector svg {
  width: 24px;
  height: 24px;
  display: inline-block;
  position: relative;
  top: -2px;
  vertical-align: middle;
  margin-right: 5px;
}
@media screen and (max-width: 959px) {
  .pdf-block .favorite-selector svg {
    width: 16px;
    height: 16px;
  }
}
.pdf-block .favorite-selector .chevron-down {
  vertical-align: middle;
  width: 20px;
  height: 20px;
  position: relative;
  fill: #181C20 !important;
  stroke: none !important;
  top: -1px;
  margin-right: 0;
}
@media screen and (max-width: 959px) {
  .pdf-block .data-item__icon, .pdf-block .data-item-changeable__icon {
    width: 14px;
    height: 14px;
  }
  .pdf-block .data-item__icon svg, .pdf-block .data-item-changeable__icon svg {
    width: 14px;
    height: 14px;
  }
  .pdf-block .data-item__input input, .pdf-block .data-item-changeable__input input {
    font-size: 11px;
    line-height: 14px;
  }
  .pdf-block .data-item__value, .pdf-block .data-item-changeable__value {
    font-size: 11px;
  }
  .pdf-block .data-item__label, .pdf-block .data-item-changeable__label {
    font-size: 9px;
  }
}

.pdf-stats-row {
  display: flex;
  margin-top: 7px;
}
.pdf-stats-row:nth-child(1) {
  margin-top: 0;
}

.pdf-small-title {
  font-size: 12px;
  line-height: 16px;
  text-transform: uppercase;
  font-weight: bold;
  margin-bottom: 10px;
}
@media screen and (max-width: 959px) {
  .pdf-small-title {
    font-size: 10px;
    line-height: 14px;
  }
}

.pdf-match-stats .data-item, .pdf-match-stats .data-item-changeable {
  width: 50%;
  margin-left: 20px;
}
.pdf-match-stats .data-item:nth-child(1), .pdf-match-stats .data-item-changeable:nth-child(1) {
  margin-left: 0;
}
@media screen and (max-width: 959px) {
  .pdf-match-stats .data-item, .pdf-match-stats .data-item-changeable {
    margin-left: 12px;
  }
}

.pdf-match-info {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
}
.pdf-match-info .pdf-stats-row.info {
  align-items: end;
}
.pdf-match-info .data-item {
  width: calc(25% - 6px);
  margin-left: 24px;
}
@media screen and (max-width: 959px) {
  .pdf-match-info .data-item {
    margin-left: 12px;
  }
}
.pdf-match-info .data-item:nth-child(1) {
  margin-left: 0;
}

.single-pdf__match {
  flex-grow: 1;
}
.single-pdf__position {
  width: 148px;
  flex-shrink: 0;
  flex-grow: 0 !important;
}
.single-pdf__position label {
  color: #637581;
}
@media screen and (max-width: 959px) {
  .single-pdf__position {
    width: 130px;
  }
}
.single-pdf__match-stats {
  width: 220px;
  flex-shrink: 0;
  flex-grow: 0;
}
@media screen and (max-width: 959px) {
  .single-pdf__match-stats {
    width: 185px;
  }
}
@media screen and (max-width: 959px) {
  .single-pdf__team {
    min-width: 230px;
  }
}
.single-pdf__category {
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 230px;
  flex-grow: 0 !important;
  flex-shrink: 0;
}
@media screen and (max-width: 959px) {
  .single-pdf__category {
    width: 170px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.pdf-single-rates {
  padding: 0 25px;
}
.pdf-single-rates .rated-player {
  padding-left: 60px;
}
.pdf-single-rates .rates-group {
  margin-right: -35px;
}
.pdf-single-rates .rates-table {
  padding: 5px 5px 5px 5px;
  border-left: none;
}
.pdf-single-rates .rates-table .rate-indicator-icon {
  width: 12px;
  height: 12px;
  display: inline-block;
  margin-right: 4px;
  vertical-align: middle;
}
.pdf-single-rates .rates-table table {
  width: 270px;
}
@media screen and (max-width: 959px) {
  .pdf-single-rates .rates-table table {
    width: 220px;
  }
}
.pdf-single-rates .rates-table table thead tr td {
  border-bottom: 2px solid #24323D;
}
.pdf-single-rates .rates-table table thead .rates-table-title {
  font-size: 16px;
  line-height: 20px;
  color: #181C20;
}
.pdf-single-rates .rates-table table tbody tr td {
  border: none;
  border-right: 1px solid #24323D;
  font-size: 12px;
  line-height: 32px;
}
.pdf-single-rates .final-rating {
  padding: 0;
  border-left: none;
  margin-top: 36px;
}
.pdf-single-rates .final-rating .final-rating-list {
  border: 1px solid #000;
  display: flex;
  width: 215px;
}
@media screen and (max-width: 959px) {
  .pdf-single-rates .final-rating .final-rating-list {
    width: 150px;
    margin-left: 30px;
  }
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item {
  margin-top: 0;
  display: inline-block;
  width: 43px;
  height: 40px;
  line-height: 40px;
  cursor: pointer;
  color: #35B374;
  border-left: 1px solid #000;
  text-align: center;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item:nth-child(1) {
  border-left: none;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item .name {
  display: block;
  width: 100%;
  height: 40px;
  line-height: 40px;
  top: auto;
  left: auto;
  right: auto;
  text-align: center;
  margin-top: 0;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item .name:before {
  display: none;
}
@media screen and (max-width: 959px) {
  .pdf-single-rates .final-rating .final-rating-list .final-rating-item {
    width: 30px;
    height: 24px;
    line-height: 24px;
    font-size: 13px;
  }
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item:hover {
  color: #FFF;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item:hover .name {
  color: #FFF;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.active {
  color: #FFF;
  font-weight: bold;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.active .name {
  color: #FFF;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.final-rating-item1:hover {
  background: #30619A;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.final-rating-item1.active {
  background: #30619A;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.final-rating-item2:hover {
  background: #7CB4D3;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.final-rating-item2.active {
  background: #7CB4D3;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.final-rating-item3:hover {
  background: #A4A6A4;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.final-rating-item3.active {
  background: #A4A6A4;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.final-rating-item4:hover {
  background: #EB8C49;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.final-rating-item4.active {
  background: #EB8C49;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.final-rating-item5:hover {
  background: #CA5425;
}
.pdf-single-rates .final-rating .final-rating-list .final-rating-item.final-rating-item5.active {
  background: #CA5425;
}
/* Colors */
/* Fonts */
/* Dimensions */
.auth {
  height: 100vh;
  vertical-align: middle;
  background-color: #021c29;
  background-image: url(/ee46d62c72e388228d0d.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 1;
  font-family: "IBM Plex Sans", sans-serif;
  overflow: auto;
}
@media (max-width: 959px) {
  .auth {
    border: none;
  }
}
.modal-enter .auth {
  opacity: 0;
  -webkit-transform: scale(0.95);
  -moz-transform: scale(0.95);
  -ms-transform: scale(0.95);
  -o-transform: scale(0.95);
  transform: scale(0.95);
}
.modal-enter-active .auth {
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform 500ms ease-out, opacity 500ms ease-out;
  -moz-transition: -moz-transform 500ms ease-out, opacity 500ms ease-out;
  transition: transform 500ms ease-out, opacity 500ms ease-out;
}
.modal-leave .auth {
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
.modal-leave-active .auth {
  opacity: 0;
  -webkit-transform: scale(0.95);
  -moz-transform: scale(0.95);
  -ms-transform: scale(0.95);
  -o-transform: scale(0.95);
  transform: scale(0.95);
  -webkit-transition: -webkit-transform 500ms ease-out, opacity 500ms ease-out;
  -moz-transition: -moz-transform 500ms ease-out, opacity 500ms ease-out;
  transition: transform 500ms ease-out, opacity 500ms ease-out;
}
.auth .auth-align {
  display: flex;
  flex-direction: column;
  justify-content: center;
  line-height: 24px;
  width: 333px;
  height: calc(100vh - 121px);
  margin: 0 auto;
  padding-top: 89px;
  min-height: 480px;
}
@media (max-width: 959px) {
  .auth .auth-align {
    width: 100%;
    max-width: 380px;
    line-height: 12px;
    padding: 24px;
  }
}
.auth .auth-container {
  padding: 24px 32px;
  background: #FFF;
  color: #1C2734;
  border-radius: 12px;
  border-bottom: 1px solid #555;
  box-shadow: 0px 2px 8px rgba(27, 40, 47, 0.08);
  position: relative;
  z-index: 3;
}
@media (max-width: 959px) {
  .auth .auth-container {
    padding: 24px 32px;
    box-shadow: 0 3px 30px rgba(0, 0, 0, 0.2);
  }
}
.auth .auth-title {
  color: #1C2734;
  font-size: 25px;
  line-height: 32px;
  font-weight: 700;
  opacity: 1;
  font-family: "IBM Plex Sans", sans-serif;
}
.auth .input {
  color: #1C2734;
  margin-top: 16px;
  position: relative;
}
.auth .input label {
  display: block;
  margin: 0 0 8px;
  color: #1C2734;
  font-size: 14px;
  line-height: 19px;
}
.auth .auth-text {
  color: #1C2734;
  margin-top: 20px;
  font-weight: 200;
  font-size: 16px;
  letter-spacing: 0.5px;
}
@media (max-width: 959px) {
  .auth .auth-text {
    margin-top: 10px;
    line-height: 20px;
  }
}
.auth .auth-text b {
  font-weight: 400;
}
.auth .auth-helpers {
  font-size: 13px;
  line-height: 17px;
  margin-top: 24px;
}
@media (max-width: 959px) {
  .auth .auth-helpers {
    font-size: 7px;
    line-height: 9px;
    margin-top: 5px;
    padding: 0 3px;
  }
}
.auth .auth-helpers .pull-left {
  float: left;
}
.auth .auth-helpers .pull-right {
  float: right;
}
.auth .auth-helpers a {
  cursor: pointer;
  color: #1C2734;
  text-decoration: underline;
}
.auth .auth-helpers a:hover {
  color: #35B374;
}

.auth-logo {
  position: relative;
  top: 32px;
  margin: 0 auto 32px;
  width: 196px;
  height: 57px;
}
.auth-logo img {
  position: relative;
  z-index: 2;
}

.top-shade {
  /*position: absolute;
  z-index: 1;
  left: 50%;
  top: 32px;
  width:240px;
  height: 240px;
  transform: translateX(-50%) translateY(-50%);
  background: rgb(2,28,41);
  background: radial-gradient(circle, rgba(2, 28, 41, .86) 0, rgba(2, 28, 41, 0) 70%);
  border-radius: 50%;*/
}

#Loader {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 99;
}
#Loader .loader-image {
  width: 120px;
  height: 120px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -60px 0 0 -60px;
}

@keyframes animatedBackground {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 160px 0;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.auth-login {
  color: #1C2734;
  margin-top: 20px;
}
.auth-login input {
  width: 100%;
  padding: 12px 16px;
  font-size: 16px !important;
  line-height: 24px !important;
  border: none;
  font-family: "IBM Plex Sans", sans-serif;
  color: #1C2734;
  background: #F1F4F6;
  border-radius: 4px;
}
.auth-login input:hover, .auth-login input:focus {
  background: #F1F4F6;
}
.auth-login input:-webkit-autofill, .auth-login input:-webkit-autofill:hover, .auth-login input:-webkit-autofill:focus, .auth-login input:-webkit-autofill, .auth-login input:-webkit-autofill::first-line {
  font-size: 16px;
  line-height: 24px;
  box-shadow: none;
  -webkit-text-fill-color: #1C2734;
  color: #1C2734;
  font-family: "IBM Plex Sans", sans-serif;
  background: #F1F4F6;
  border-radius: 4px;
}
.auth-login input::placeholder {
  color: #808080;
  font-size: 16px;
  opacity: 1;
}
.auth-login .btn {
  margin-top: 24px;
  color: #FFF;
  background: #35B374;
  font-size: 13px;
  line-height: 16px;
  font-weight: normal;
  padding: 12px;
  border: none;
  border-radius: 12px !important;
  text-transform: uppercase;
  cursor: pointer;
}
.auth-login .btn:hover {
  background-color: #1C2734;
}
.auth-login .error-message {
  font-size: 14px;
  line-height: 20px;
  margin-top: 10px;
  margin-bottom: -10px;
  color: red;
  display: none;
}
.auth-login .error-message.visible {
  display: block;
}
.auth-login .forgotpass {
  color: #1C2734;
  text-decoration: underline;
  text-align: left;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  font-size: 14px;
  line-height: 19px;
}
.auth-login .forgotpass:hover {
  color: #35B374;
}
.auth-login .signup-text {
  font-size: 14px;
  line-height: 19px;
  margin-top: 24px;
  text-align: center;
}
.auth-login .signup-link {
  color: #1C2734;
  text-decoration: underline;
}
.auth-login .signup-link:hover {
  color: #35B374;
}
.auth-login p {
  margin: 0 0 12px;
}
.auth-login p a {
  margin: 0;
}
.auth-login #Loader {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 2;
}
.auth-login #Loader .loader-image {
  width: 120px;
  height: 120px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -60px 0 0 -60px;
}

@keyframes animatedBackground {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 160px 0;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.registration-form {
  background-image: url(/ee46d62c72e388228d0d.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #021c29;
  font-family: "IBM Plex Sans", sans-serif;
  width: 100vw;
  height: 100vh;
  overflow: auto;
  box-sizing: border-box;
  color: #1C2734;
}
.registration-form .currency {
  color: #1C2734;
  font-size: 13px;
  margin-top: 12px;
}
.registration-form .error-message {
  background: rgba(255, 235, 235, 0.85) !important;
  font-size: 15px;
  color: red;
  line-height: 20px;
  margin: 0 0 24px;
  padding: 12px;
  border-radius: 3px;
}
.registration-form .error-message a {
  color: red;
  text-decoration: underline;
}
.registration-form .error-message a:hover {
  color: red;
}
.registration-form .wrapper {
  width: 100%;
  height: calc(100vh - 121px);
  min-height: 700px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.registration-form .wrapper .main {
  position: relative;
}
.registration-form .message {
  max-width: 333px;
  min-width: 200px;
  margin: 0 auto;
  background: #FFF;
  border-radius: 12px;
  padding: 24px 32px;
  text-align: left;
}
.registration-form .message h2 {
  font-size: 24px;
  line-height: 24px;
  margin: 0;
  font-weight: bold;
  font-family: "IBM Plex Sans", sans-serif;
}
.registration-form .message .img {
  display: block;
  margin: 24px auto;
}
.registration-form .message p {
  font-size: 16px;
  line-height: 24px;
}
.registration-form form {
  width: 692px;
  padding: 0 20px;
  margin: 0 auto;
  position: relative;
  z-index: 3;
}
@media (max-width: 679px) {
  .registration-form form {
    width: auto;
    max-width: 340px;
  }
}
.registration-form form .row {
  display: flex;
  background: none;
}
@media (max-width: 679px) {
  .registration-form form .row {
    padding: 0;
    background: transparent;
  }
}
.registration-form form .row .col {
  width: 50%;
  padding: 24px 32px;
  background: #FFF;
  border-radius: 12px;
  position: relative;
}
.registration-form form .row .col h2.heading {
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 24px;
  line-height: 24px;
  font-weight: bold;
  margin: 0;
}
.registration-form form .row .col .preferred-currency {
  margin-top: 24px;
}
.registration-form form .row .col .currency-changer {
  display: inline-block;
  vertical-align: middle;
}
.registration-form form .row .col .currency-changer span {
  display: inline-block;
  margin-right: 12px;
  font-size: 16px;
  line-height: 18px;
  cursor: pointer;
}
.registration-form form .row .col .currency-changer span.active {
  font-weight: bold;
  color: #35B374;
  cursor: default;
}
.registration-form form .row .col:nth-child(1) {
  width: 50%;
  margin-right: 25px;
}
@media (max-width: 679px) {
  .registration-form form .row .col:nth-child(1) {
    width: auto;
    margin-right: 0;
  }
}
@media (max-width: 679px) {
  .registration-form form .row .col:nth-child(2) {
    display: none;
    width: auto;
  }
}
.registration-form form .features {
  font-size: 16px;
  line-height: 24px;
}
.registration-form form .features li {
  margin-top: 24px;
  position: relative;
  padding-left: 32px;
  font-size: 16px;
  line-height: 24px;
}
.registration-form form .features li svg {
  width: 24px;
  height: 24px;
  position: absolute;
  top: 0;
  left: 0;
  fill: none;
}
.registration-form form .features li.text {
  padding-left: 0;
  margin: 24px 0;
}
.registration-form form .features li.heading {
  padding-left: 0;
  margin-top: 0;
  font-size: 24px;
  line-height: 30px;
  margin-bottom: 18px;
  font-weight: bold;
}
.registration-form form .input {
  margin-top: 16px;
}
.registration-form form .input label {
  display: block;
  font-size: 14px;
  line-height: 24px;
  margin-bottom: 8px;
}
.registration-form form input {
  width: 100%;
  padding: 12px 16px;
  font-size: 16px;
  line-height: 24px;
  border: none;
  font-family: "IBM Plex Sans", sans-serif;
  color: #1C2734;
  background: #F1F4F6;
  border-radius: 4px;
}
.registration-form form input.error {
  color: red;
  background: rgba(255, 235, 235, 0.85) !important;
}
.registration-form form input::placeholder {
  color: #808080;
  font-size: 16px;
  opacity: 1;
}
.registration-form form .btn {
  color: #FFF;
  background: #35B374;
  font-size: 13px;
  line-height: 16px;
  font-weight: normal;
  padding: 12px;
  border: none;
  border-radius: 12px !important;
  text-transform: uppercase;
  cursor: pointer;
}
.registration-form form .btn:hover {
  background-color: #1C2734;
}
.registration-form form .terms {
  font-size: 10px;
  line-height: 13px;
  text-align: center;
  color: #1C2734;
  margin: 24px 0;
}
.registration-form form .terms a {
  text-decoration: underline;
  color: #1C2734;
}
.registration-form form .terms a:hover {
  color: #35B374;
}
.registration-form .signin {
  margin-top: 15px;
  text-align: center;
  font-size: 14px;
  line-height: 19px;
}
.registration-form .signin a {
  color: #1C2734;
  text-decoration: underline;
}
.registration-form .signin a:hover {
  color: #35B374;
}
.registration-form #Loader {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 2;
}
.registration-form #Loader .loader-image {
  width: 120px;
  height: 120px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -60px 0 0 -60px;
}

@keyframes animatedBackground {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 160px 0;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.settings {
  will-change: transform, opacity;
  height: 100%;
}
.settings .settings-h2 {
  font-weight: 700;
  font-size: 19px;
  margin: 0 0 1px;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, 0.95);
}
@media (max-width: 959px) {
  .settings .settings-h2 {
    font-size: 14px;
  }
}
.settings .settings-h4 {
  font-weight: 300;
  font-family: "Source Sans Pro", Helvetica, sans-serif;
  font-size: 18px;
  margin: 0 0 25px;
  opacity: 0.8;
  color: rgba(255, 255, 255, 0.75);
  margin: 0 0 25px;
}
@media (max-width: 959px) {
  .settings .settings-h4 {
    font-size: 14px;
    margin: 0 0 13px;
  }
}
.settings .green-btn {
  color: #2DC46E;
  font-weight: 400;
}
.settings .red-btn {
  color: #d33a61;
  margin-left: 20px;
  font-weight: 400;
}
@media (max-width: 959px) {
  .settings .red-btn {
    margin-left: 10px;
  }
}
.settings .blue-btn, .settings .orange-btn {
  margin-right: 20px;
}
@media (max-width: 959px) {
  .settings .blue-btn, .settings .orange-btn {
    margin-right: 10px;
  }
}
.settings .orange-btn {
  color: #F2CB6C;
}
.settings .blue-btn {
  color: #3f809c;
}
.settings .inp {
  width: calc(100% + 10px);
  height: 32px;
  margin: 0px;
  padding: 0px 6px 4px 0px;
  font-size: 16px;
  margin-bottom: 40px;
}
@media (max-width: 959px) {
  .settings .inp {
    width: calc(100% + 5px);
    height: 15px;
    margin: -3px;
    padding: 1px 3px 2px;
    font-size: 11px;
  }
}
.settings .inp.invalid {
  color: red;
}
.settings .inp.invalid::-webkit-input-placeholder {
  color: red;
  transition: opacity 0.2s;
  opacity: 1;
}
.settings .inp.invalid::-moz-placeholder {
  color: red;
  transition: opacity 0.2s;
  opacity: 1;
}
.settings .inp.invalid:-ms-input-placeholder {
  color: red;
  transition: opacity 0.2s;
  opacity: 1;
}
.settings .inp.invalid:-moz-placeholder {
  color: red;
  transition: opacity 0.2s;
  opacity: 1;
}
.settings .inp::-webkit-input-placeholder {
  color: #8B8282;
  transition: opacity 0.2s;
  opacity: 1;
}
.settings .inp::-moz-placeholder {
  color: #8B8282;
  transition: opacity 0.2s;
  opacity: 1;
}
.settings .inp:-ms-input-placeholder {
  color: #8B8282;
  transition: opacity 0.2s;
  opacity: 1;
}
.settings .inp:-moz-placeholder {
  color: #8B8282;
  transition: opacity 0.2s;
  opacity: 1;
}
.settings .inp:focus::-webkit-input-placeholder {
  opacity: 0;
}
.settings .inp:focus::-moz-placeholder {
  opacity: 0;
}
.settings .inp:focus:-ms-input-placeholder {
  opacity: 0;
}
.settings .inp:focus:-moz-placeholder {
  opacity: 0;
}
.settings .inp-helper {
  border: 1px solid;
  width: 16px;
  height: 16px;
  line-height: 14px;
  text-align: center;
  border-radius: 8px;
  cursor: default;
  font-style: normal;
  font-size: 12px;
  display: inline-block;
  vertical-align: middle;
  margin-left: 4px;
  position: relative;
  top: -2px;
}
.settings .inp-helper:hover {
  color: #35B374;
}
.settings .Select {
  margin: -5px -6px;
  position: relative;
}
@media (max-width: 959px) {
  .settings .Select {
    margin: -3px;
  }
}
.settings .Select .Select-value-label, .settings .Select .Select-placeholder {
  font-size: 15px;
  font-weight: 300;
}
.settings .Select .Select-control {
  font-size: 15px;
  border-radius: 0;
  border-bottom: 1px solid #2DC46E !important;
  height: 30px;
}
@media (max-width: 959px) {
  .settings .Select .Select-control {
    font-size: 11px;
    height: 15px;
  }
}
.settings .Select .Select-value {
  padding: 0 6px;
  line-height: 29px;
}
@media (max-width: 959px) {
  .settings .Select .Select-value {
    padding: 0 3px;
    line-height: 15px;
  }
}
.settings .Select .Select-input {
  height: 29px;
}
@media (max-width: 959px) {
  .settings .Select .Select-input {
    height: 15px;
  }
}
.settings .Select .Select-input input {
  width: calc(100% + 10px);
  height: 29px;
  margin: 0;
  padding: 3px 6px 4px;
  font-size: 15px;
}
@media (max-width: 959px) {
  .settings .Select .Select-input input {
    width: calc(100% + 5px);
    height: 15px;
    margin: -3px;
    padding: 2px 3px 2px;
    font-size: 4px;
  }
}
.settings .Select .Select-placeholder {
  color: #8B8282 !important;
  line-height: 29px;
  padding: 0 5px;
}
@media (max-width: 959px) {
  .settings .Select .Select-placeholder {
    line-height: 15px;
    padding: 0 2px;
  }
}
.settings .settings-more-col .js-link {
  color: #2DC46E;
  border-bottom: 1px dashed;
  display: inline-block;
  margin-left: 15px;
  cursor: pointer;
}
.settings .settings-more-col .js-link:nth-child(1) {
  margin-left: 0;
}
.settings .settings-select-all {
  margin: 0 0 25px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.sub-nav {
  display: flex;
  height: 100%;
  background: #22323c;
}
.sub-nav .section-icon {
  width: 10px;
  height: 10px;
  position: absolute;
  top: 50%;
  margin-top: -5px;
  left: -14px;
}
.sub-nav .section-icon__active {
  transform: rotate(90deg);
}
.sub-nav__navigation {
  width: 215px;
  overflow: auto;
  padding: 29px 25px 25px 30px;
  box-shadow: 0 4px 24px 2px rgba(0, 0, 0, 0.02);
  z-index: 1;
  height: 100%;
}
.sub-nav__navigation h2 {
  font-size: 22px;
  font-weight: 500;
  line-height: 120%;
  text-transform: none;
  margin: 0 0 25px;
}
.sub-nav__navigation ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.sub-nav__navigation ul li {
  margin-top: 17px;
  font-size: 16px;
  line-height: 20px;
}
.sub-nav__navigation ul li a {
  position: relative;
  color: #CCC;
}
.sub-nav__navigation ul li a:hover {
  color: #2DC46E;
}
.sub-nav__navigation ul li a.active {
  color: #FFF;
  font-weight: bold;
}
.sub-nav__navigation ul li.deletable {
  padding-right: 20px;
  position: relative;
}
.sub-nav__navigation ul li .delete {
  box-sizing: border-box;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  cursor: pointer;
  padding: 10px;
  margin-right: -10px;
  display: block;
}
.sub-nav__navigation ul li .delete:hover {
  color: #2DC46E;
}
.sub-nav__navigation ul li .delete svg {
  display: block;
  width: 10px;
  height: 10px;
}
.sub-nav__navigation ul li span {
  color: #FFF;
  font-weight: bold;
}
.sub-nav__second-level {
  padding-left: 14px;
}
.sub-nav__second-level ul li {
  margin-top: 12px;
  white-space: nowrap;
}
.sub-nav__content {
  width: 100%;
  overflow: auto;
  background: #263742;
  border-radius: 10px 0px 0px 10px;
  box-shadow: 0 4px 24px 2px rgba(0, 0, 0, 0.1);
  z-index: 2;
}
/* Colors */
/* Fonts */
/* Dimensions */
@media (max-width: 1023px) {
  .shortcuts .col-xs-12 {
    width: 100%;
    margin-bottom: 36px;
  }
}
@media (max-width: 1023px) {
  .shortcuts .xs-hidden {
    display: none;
  }
}
.shortcuts .positions-selector {
  margin: 0 0 25px;
}
.shortcuts .positions-selector .position {
  display: inline-block;
  padding: 10px 15px;
  border: 1px solid #188538;
  border-left: none;
  font-weight: bold;
  cursor: pointer;
}
.shortcuts .positions-selector .position:nth-child(1) {
  border-left: 1px solid #188538;
}
.shortcuts .positions-selector .position.active {
  background: #188538;
  cursor: default;
}
.shortcuts .controls-list {
  color: rgba(255, 255, 255, 0.75);
  font-weight: 500;
  font-size: 16px;
}
@media (max-width: 959px) {
  .shortcuts .controls-list {
    font-size: 12px;
  }
}
.shortcuts .controls-list .control-name {
  cursor: pointer;
  white-space: nowrap;
  position: relative;
  display: flex;
  align-content: center;
}
.shortcuts .controls-list .control-name a {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  width: calc(100% - 30px);
}
.shortcuts .controls-list .control-name .control-btn {
  display: block;
  margin-left: 5px;
  width: 10px;
  height: 10px;
}
.shortcuts .controls-list .control-name .control-btn svg {
  width: 10px;
  height: 10px;
}
.shortcuts .controls-list .control-name .control-btn:hover svg {
  fill: #2DC46E;
}
.shortcuts .controls-list .control-name .control-btn:hover.control-btn-delete svg {
  fill: #d33a61;
}
.shortcuts .controls-list .control-name .disabled {
  color: rgba(255, 255, 255, 0.25);
}
.shortcuts .controls-list .control-name .disabled:hover {
  color: rgba(255, 255, 255, 0.5);
}
.shortcuts .controls-list .control-name + .control-name {
  margin-top: 15px;
}
@media (max-width: 959px) {
  .shortcuts .controls-list .control-name + .control-name {
    margin-top: 8px;
  }
}
.shortcuts .shortcuts-group {
  margin: 0 0 35px;
}
.shortcuts .shortcuts-group h2 {
  font-weight: 700;
  font-size: 14px;
  margin: 0 0 10px;
  opacity: 0.8;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, 0.95);
  text-transform: uppercase;
}
.shortcuts .shortcuts-group .controls-list {
  padding-bottom: 0;
}
.shortcuts .controls-select {
  max-width: 230px;
}
.shortcuts .controls-select > * {
  font-family: "Source Sans Pro", Helvetica, sans-serif;
}
@media (max-width: 959px) {
  .shortcuts .controls-select {
    max-width: 115px;
  }
}
.shortcuts .controls-select + .controls-select {
  margin-top: 30px;
}
@media (max-width: 959px) {
  .shortcuts .controls-select + .controls-select {
    margin-top: 15px;
  }
}
.shortcuts .controls-select .is-focused:not(.is-open) > .Select-control {
  border-color: #616365;
}
.shortcuts .controls-select .VirtualizedSelectOption.VirtualizedSelectSelectedOption {
  background-color: #616365 !important;
  color: #fff !important;
}
.shortcuts .controls-select .VirtualizedSelectOption.VirtualizedSelectFocusedOption {
  background-color: rgba(97, 99, 101, 0.5);
}
.shortcuts .controls-select .Select--multi .Select-value {
  color: #616365;
}
.shortcuts .controls-select .Select--multi a.Select-value-label {
  color: #616365;
}
.shortcuts .controls-select .Select-value-label {
  font-weight: 700 !important;
  font-size: 16px;
  letter-spacing: 0.5px;
  font-family: "Source Sans Pro", Helvetica, sans-serif;
}
@media (max-width: 959px) {
  .shortcuts .controls-select .Select-value-label {
    font-size: 14px;
  }
}
.shortcuts .controls-preview {
  position: relative;
  width: 42px;
  margin-left: 75px;
  margin-top: 120px;
}
@media (max-width: 959px) {
  .shortcuts .controls-preview {
    width: 26px;
    margin-left: 62px;
    margin-top: 85px;
  }
}
.shortcuts .controls-preview .player-number {
  position: relative;
  color: #fff;
  font-weight: 700;
  text-align: center;
  font-size: 21px;
  line-height: 42px;
  display: block;
  width: 42px;
  height: 42px;
}
@media (max-width: 959px) {
  .shortcuts .controls-preview .player-number {
    font-size: 14px;
    line-height: 26px;
    width: 26px;
    height: 26px;
  }
}
.shortcuts .controls-preview .player-controls {
  width: 210px;
  height: 210px;
  margin: -105px 0 0 -105px;
}
.shortcuts .controls-preview .player-controls .icon, .shortcuts .controls-preview .player-controls text {
  fill: #fff;
}
.shortcuts .controls-preview .player-controls .section {
  fill: #24323D;
  cursor: default;
}
@media (max-width: 959px) {
  .shortcuts .controls-preview .player-controls {
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.create-shortcut-form {
  max-width: 748px;
  width: 100%;
  min-width: 320px;
}
.create-shortcut-form label {
  font-family: "Source Sans Pro", Helvetica, sans-serif;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 1px;
  text-align: left;
  text-transform: uppercase;
  color: #A4A6A4;
}
.create-shortcut-form .r-checkbox + label {
  display: inline-block;
  position: relative;
  top: -8px;
  margin-left: 7px;
}
.create-shortcut-form .checkbox-block {
  margin-top: 9px;
}
.create-shortcut-form .input:disabled {
  color: #637581;
  border-bottom-color: #637581;
}
.create-shortcut-form .row {
  margin-top: 24px;
}
.create-shortcut-form .buttons {
  padding-top: 20px;
  text-align: right;
}
.create-shortcut-form .buttons .btn {
  margin-left: 24px;
}
.create-shortcut-form .buttons .btn:nth-child(1) {
  margin-left: 0;
}
/* Colors */
/* Fonts */
/* Dimensions */
.my-account .settings-h2 {
  text-transform: uppercase;
  margin-top: 60px;
}
.my-account .settings-h2:nth-child(1) {
  margin-top: 0;
}
.my-account > div {
  border-top: 1px solid #334a59;
  padding-top: 50px;
}
.my-account > div:nth-child(1) {
  padding-top: 0;
  border-top: none;
}
.my-account__delete {
  margin-top: 60px;
}
.my-account__export {
  margin-top: 60px;
}
.my-account__export .row {
  margin-bottom: 40px;
}

.delete-confirm p {
  margin-top: 20px;
  line-height: 145%;
}
.delete-confirm .h2 {
  font-weight: 700;
  font-size: 19px;
  margin: 0 0 1px;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, 0.95);
}
@media (max-width: 959px) {
  .delete-confirm .h2 {
    font-size: 14px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.change-password {
  margin-top: 20px;
}
@media (max-width: 959px) {
  .change-password {
    margin-top: 25px;
  }
}
.change-password .password-form {
  margin-top: 13px;
}
@media (max-width: 959px) {
  .change-password .password-form {
    margin-top: 7px;
  }
}
.change-password .password-form input {
  border: 1px solid transparent;
  border-bottom-color: #2DC46E;
  color: #fff;
  line-height: 18px;
  margin: 10px 1px;
  font-size: 17px;
  width: 100%;
  font-weight: 500;
  margin-bottom: 40px;
}
@media (max-width: 959px) {
  .change-password .password-form input {
    line-height: 30px;
    padding: 3px 1px;
    font-size: 14px;
  }
}
.change-password .password-form input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
  transition: opacity 0.2s;
  opacity: 1;
}
.change-password .password-form input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
  transition: opacity 0.2s;
  opacity: 1;
}
.change-password .password-form input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
  transition: opacity 0.2s;
  opacity: 1;
}
.change-password .password-form input:-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
  transition: opacity 0.2s;
  opacity: 1;
}
.change-password .password-form input:focus {
  /*border-bottom-color: $primary-color;*/
}
.change-password .password-form input:focus::-webkit-input-placeholder {
  opacity: 0;
}
.change-password .password-form input:focus::-moz-placeholder {
  opacity: 0;
}
.change-password .password-form input:focus:-ms-input-placeholder {
  opacity: 0;
}
.change-password .password-form input:focus:-moz-placeholder {
  opacity: 0;
}
.change-password .password-form .error-message,
.change-password .password-form .success-message {
  font-size: 14px;
  line-height: 20px;
  margin-top: 10px;
  margin-bottom: -30px;
  display: none;
}
@media (max-width: 959px) {
  .change-password .password-form .error-message,
  .change-password .password-form .success-message {
    font-size: 7px;
    line-height: 10px;
    margin-top: 5px;
    margin-bottom: -15px;
  }
}
.change-password .password-form .error-message.visible,
.change-password .password-form .success-message.visible {
  display: block;
}
.change-password .password-form .error-message {
  color: red;
}
.change-password .password-form .success-message {
  color: #188538;
}
/* Colors */
/* Fonts */
/* Dimensions */
.my-account__form .submit-row:after {
  content: "";
  display: table;
  clear: both;
}

.my-account__form {
  padding: 0px 0 70px;
}
.my-account__form .settings-h4 {
  font-size: 14px;
  font-weight: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-top: 35px;
  margin-bottom: 5px;
  color: white;
  opacity: 0.7;
}
.my-account__form label {
  font-size: 14px;
  letter-spacing: 1px;
  margin-bottom: 0px;
  text-transform: uppercase;
  display: block;
  color: white;
  opacity: 0.7;
}
.my-account__form .form-row {
  display: flex;
  margin-bottom: 40px;
}
.my-account__form h4 + .form-row {
  margin-top: 15px;
}
.my-account__form .input-container {
  margin-left: 30px;
  width: 250px;
  flex-shrink: 0;
  margin-bottom: 0;
}
.my-account__form .input-container .input {
  margin-bottom: 0;
}
.my-account__form .input-container .input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.my-account__form .input-container .input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.my-account__form .input-container .input:-moz-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.my-account__form .input-container .input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.my-account__form .input-container .select {
  color: #1E2A31;
  margin-top: -4px;
}
.my-account__form .input-container .select input {
  margin-bottom: 0;
}
.my-account__form .input-container:nth-child(1) {
  margin-left: 0;
}
.my-account__form .account-form .btn {
  display: block;
}
.my-account__form .submit-row {
  justify-content: flex-start;
  width: 550px;
}
.my-account__form .error-message {
  font-size: 14px;
  line-height: 20px;
  margin: 25px 0;
  color: red;
}
/* Colors */
/* Fonts */
/* Dimensions */
.users-list {
  line-height: 20px;
  font-size: 15px;
  font-weight: 500;
  width: 100%;
  margin: 0;
  font-family: "Source Sans Pro", Helvetica, sans-serif;
}
@media (max-width: 959px) {
  .users-list {
    line-height: 13px;
    font-size: 11px;
  }
}
.users-list input, .users-list .has-value.Select--single > .Select-control .Select-value .Select-value-label {
  font-weight: 300 !important;
  font-size: 15px;
}
@media (max-width: 959px) {
  .users-list input, .users-list .has-value.Select--single > .Select-control .Select-value .Select-value-label {
    font-size: 11px;
  }
}
.users-list th, .users-list td {
  text-align: left;
  padding: 15px 10px;
  font-size: 15px;
  border: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 959px) {
  .users-list th, .users-list td {
    padding: 8px 5px;
    font-size: 11px;
  }
}
.users-list th:first-child, .users-list td:first-child {
  padding-left: 20px;
}
@media (max-width: 959px) {
  .users-list th:first-child, .users-list td:first-child {
    padding-left: 10px;
  }
}
.users-list th:last-child, .users-list td:last-child {
  padding-right: 20px;
}
@media (max-width: 959px) {
  .users-list th:last-child, .users-list td:last-child {
    padding-right: 10px;
  }
}
.users-list th.controls-col, .users-list td.controls-col {
  text-align: right;
  width: 150px;
}
@media (max-width: 959px) {
  .users-list th.controls-col, .users-list td.controls-col {
    width: 75px;
  }
}
.users-list th {
  font-weight: 700;
  padding-top: 0;
}
.users-list .align {
  display: block;
}

.create-container div.users-list {
  text-align: right;
  padding: 15px 20px;
}
@media (max-width: 959px) {
  .create-container div.users-list {
    padding: 8px 10px;
  }
}
.create-container td {
  border-bottom: none;
}

.limits-message {
  padding: 0px 0px 25px 0px;
  font-size: 18px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.7);
}

.users-empty-message {
  text-align: left;
  font-size: 18px;
  padding: 25px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.7);
}
/* Colors */
/* Fonts */
/* Dimensions */
.billing .plan-limits {
  margin-bottom: 35px;
  width: 280px;
}
.billing .plan-limits h2 {
  margin: 0;
  font-weight: normal;
  text-transform: none;
  margin-top: 18px !important;
  letter-spacing: 0.5px;
}
.billing .plan-limits__limit {
  margin-top: 20px;
}
.billing .plan-limits__body {
  display: flex;
}
.billing .plan-limits__progress {
  width: 200px;
  margin-right: 15px;
  border: 1px solid #395262;
  height: 8px;
  border-radius: 4px;
  margin-top: 8px;
  overflow: hidden;
}
.billing .plan-limits__progress span {
  display: block;
  width: 0;
  border-radius: 4px;
  height: 6px;
  background: #2DC46E;
}
/* Colors */
/* Fonts */
/* Dimensions */
.plan-selector-close {
  width: 25px;
  height: 25px;
  color: #2DC46E;
  position: absolute;
  right: 25px;
  top: 25px;
}
.plan-selector-close svg {
  width: 25px;
  height: 25px;
}

.plan-selector {
  display: flex;
  margin-top: 30px;
}
@media (max-width: 959px) {
  .plan-selector {
    flex-wrap: wrap;
  }
}
.plan-selector .plan {
  width: 33.3%;
  margin-left: 2px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  background: #2d424f;
  padding-bottom: 30px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
@media (max-width: 959px) {
  .plan-selector .plan {
    width: 100%;
    margin-left: 0;
    margin-bottom: 35px;
  }
}
.plan-selector .plan:nth-child(1) {
  margin-left: 0;
  border-radius: 12px 0 0 12px;
}
.plan-selector .plan:nth-child(1).single {
  border-radius: 12px;
  min-width: 300px;
}
.plan-selector .plan:nth-child(2) {
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 6px 20px rgba(0, 0, 0, 0.15);
  z-index: 3;
  margin-top: -20px;
  margin-bottom: -20px;
}
.plan-selector .plan:nth-child(2) .plan-head {
  padding-top: 45px !important;
}
@media (max-width: 959px) {
  .plan-selector .plan:nth-child(2) {
    width: 100%;
    margin: 0 0 35px;
  }
}
.plan-selector .plan:nth-child(3) {
  border-radius: 0 12px 12px 0;
}
.plan-selector .plan:only-child {
  border-radius: 12px 12px;
}
.plan-selector .plan .plan-head {
  font-size: 17px;
  line-height: 23px;
  text-align: center;
  margin: 5px 0px 0px;
  padding: 25px 32px 20px;
}
@media (max-width: 959px) {
  .plan-selector .plan .plan-head {
    font-size: 12px;
    line-height: 18px;
  }
}
.plan-selector .plan .plan-head h4 {
  font-size: 24px;
  font-weight: bold;
  display: block;
  line-height: 30px;
}
@media (max-width: 959px) {
  .plan-selector .plan .plan-head h4 {
    font-size: 14px;
    line-height: 18px;
  }
}
.plan-selector .plan .plan-head h5 {
  display: block;
  font-size: 15px;
  opacity: 0.5;
}
@media (max-width: 959px) {
  .plan-selector .plan .plan-head h5 {
    font-size: 12px;
    line-height: 14px;
  }
}
.plan-selector .plan .body {
  margin: 0px;
  padding-bottom: 15px;
  flex-grow: 1;
}
.plan-selector .plan .body p {
  font-size: 16px;
  line-height: 20px;
  padding: 6px 40px;
}
.plan-selector .plan .body p:nth-child(odd) {
  background: #2c3f4c;
}
@media (max-width: 959px) {
  .plan-selector .plan .body p {
    font-size: 12px;
    line-height: 14px;
  }
}
.plan-selector .plan .body p:nth-child(1) {
  margin-top: 0;
}
.plan-selector .plan .payment-next {
  padding: 0px 40px 10px;
}
@media (max-width: 959px) {
  .plan-selector .plan .payment-next {
    font-size: 12px;
    line-height: 14px;
  }
}
.plan-selector .plan .price {
  text-align: center;
  color: #ccc;
}
.plan-selector .plan .price span {
  font-size: 38px;
  font-weight: bold;
  color: #fff;
}
.plan-selector .plan .cta {
  margin-top: 15px;
  text-align: center;
}
.plan-selector .plan .cta .btn {
  padding: 0 40px;
  border-radius: 4px;
}
@media (max-width: 959px) {
  .plan-selector .plan .cta .btn {
    font-size: 12px;
    height: 38px;
    line-height: 38px;
    padding: 0 20px;
  }
}
.plan-selector .plan .cta .current-plan {
  display: block;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
  font-size: 15px;
  letter-spacing: 0.5px;
  padding: 12px 10px;
}
.plan-selector .plan .cta .next-plan {
  display: block;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
  font-size: 15px;
  padding: 12px 0;
}
.plan-selector .trial-information {
  margin-left: 25px;
  margin-top: 15px;
}
.plan-selector__downgrade {
  margin: 80px 0 0;
}
.plan-selector__downgrade span {
  cursor: pointer;
  color: #2DC46E;
  border-bottom: 1px dotted;
  padding: 2px 0px;
  margin: 0px 10px;
}

.plan-comparison {
  margin-top: 25px;
}
.plan-comparison ul li span {
  display: inline-block;
  margin-left: 4px;
  font-weight: bold;
  vertical-align: middle;
}
.plan-comparison ul li span.type {
  font-weight: normal;
}
/* Colors */
/* Fonts */
/* Dimensions */
.coupons p.label {
  font-size: 13px;
  text-transform: uppercase;
  font-weight: bold;
  margin: 25px 0 10px !important;
}
.coupons .coupon-form {
  display: flex;
}
.coupons .coupon-form .btn {
  display: block;
  margin-left: 10px;
  font-size: 12px;
  line-height: 40px;
  white-space: nowrap;
  padding: 0px 20px;
  height: 40px;
  display: block;
  box-sizing: border-box;
}
.coupons .coupon-form input {
  max-width: 200px;
}
.coupons .coupon-error {
  color: #d33a61;
  margin: 0;
  font-size: 15px;
  line-height: 24px;
  display: block;
  text-transform: uppercase;
}
.coupons .coupon-success {
  color: #188538;
  margin: 0;
  font-size: 15px;
  line-height: 24px;
  display: block;
  text-transform: uppercase;
}

/* Colors */
/* Fonts */
/* Dimensions */
.billing .settings-h2 {
  text-transform: uppercase;
  margin-top: 60px;
  margin-bottom: 20px;
}
.billing .settings-h2:nth-child(1) {
  margin-top: 0;
}
.billing .radio-group {
  margin: 30px 20px 0px 20px;
  display: block;
}
.billing .radio-group::after {
  clear: both;
  content: "";
  display: table;
}
.billing .pseudo-link {
  display: block;
  font-weight: bold;
  cursor: pointer;
  padding: 15px 20px;
  text-transform: uppercase;
  border: 1px solid #188538;
  float: left;
  border-radius: 2px;
}
.billing .pseudo-link.active {
  color: #FFF;
  background: #188538;
  border: 1px solid #188538;
}
.billing .pseudo-link + .pseudo-link {
  border-left: none;
}
@media (max-width: 959px) {
  .billing .pseudo-link {
    padding: 7px 15px;
    font-size: 14px;
  }
}
.billing .billing-col {
  margin-top: 40px;
  padding-top: 50px;
  border-top: 1px solid #334a59;
}
.billing .billing-col h4 {
  font-weight: bold;
  margin-bottom: 2px;
  margin-top: 30px;
}
.billing .billing-col svg {
  width: 45px;
  height: 33px;
  margin-right: 12px;
  margin-top: 10px;
}
.billing .billing-col svg.sepa {
  background: #F7F7F7;
  padding: 0px 11px;
  width: 60px;
  border-radius: 6px;
}
.billing .billing-columns {
  display: flex;
  flex-wrap: wrap;
}
.billing .billing-columns .billing-col {
  width: calc(33% - 18px);
  margin-left: 35px;
  margin-bottom: 35px;
  min-width: 320px;
}
@media (max-width: 959px) {
  .billing .billing-columns .billing-col {
    width: 100%;
  }
}
.billing .billing-columns .billing-col p {
  margin-top: 5px;
}
.billing .billing-columns .billing-col p:nth-child(1) {
  margin-top: 0;
}
.billing .billing-columns .billing-col:nth-child(odd) {
  margin-left: 0;
}
.billing .payment .payment-type {
  font-size: 22px;
  line-height: 160%;
  vertical-align: top;
  display: block;
}
.billing .payment .payment-type svg {
  margin-top: 0px;
  vertical-align: top;
}
.billing .payment p.payment-next {
  opacity: 0.7;
}
.billing .payment p.payment-users {
  font-size: 20px;
  margin-top: 40px;
}
.billing .payment .payment-expires {
  font-size: 16px;
  opacity: 0.7;
  display: block;
  margin: -5px 0px 10px 56px;
  line-height: 110%;
}
.billing .invoice-item {
  display: block;
}
.billing .invoice-item .invoice-new {
  display: inline-block;
  padding: 1px 5px;
  font-size: 11px;
  border-radius: 2px;
  color: #188538;
  border: 1px solid #188538;
  margin-right: 5px;
  vertical-align: middle;
  text-transform: uppercase;
  position: relative;
  top: -2px;
}
.billing .link {
  color: #2DC46E;
  cursor: pointer;
}
.billing .link.link-red {
  margin-top: 10px;
  font-size: 12px;
  line-height: 38px;
  white-space: nowrap;
  padding: 0px 20px;
  height: 40px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #d33a61;
  color: white;
  background: inherit;
}
.billing .link.link-red:hover {
  background: #d33a61;
}
.billing .link:hover {
  color: #FFF;
}
.billing .invoices-list .invoice-item {
  display: inline-block;
  white-space: nowrap;
  margin: 10px 25px 0 0;
}
.billing__trial-end {
  margin-top: 35px;
  font-size: 18px;
  font-weight: bold;
  text-transform: uppercase;
}

.billing-confirm-settings-h2 {
  margin: 0 0 15px;
  font-weight: 700;
  font-size: 22px;
  color: rgba(255, 255, 255, 0.95);
}
@media (max-width: 959px) {
  .billing-confirm-settings-h2 {
    font-size: 14px;
  }
}
.inline-loader-container {
  display: inline-block;
  height: 5em;
  width: 3em;
  vertical-align: middle;
  position: relative;
  overflow: hidden;
}

.inline-loader,
.inline-loader:before,
.inline-loader:after {
  background: #2dc46e;
  -webkit-animation: inline-loader-animation 1s infinite ease-in-out;
  animation: inline-loader-animation 1s infinite ease-in-out;
  width: 1em;
  height: 4em;
  display: block;
  will-change: height, box-shadow;
}

.inline-loader {
  color: #2dc46e;
  text-indent: -9999em;
  margin: 22px auto;
  position: relative;
  font-size: 11px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

.inline-loader:before,
.inline-loader:after {
  position: absolute;
  top: 0;
  content: "";
}

.inline-loader:before {
  left: -1.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.inline-loader:after {
  left: 1.5em;
}

@-webkit-keyframes inline-loader-animation {
  0%, 80%, 100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}
@keyframes inline-loader-animation {
  0%, 80%, 100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.earn__invite {
  margin-top: 24px;
}
.earn__invite-tabs {
  font-size: 13px;
  line-height: 40px;
  color: #CCC;
  border-bottom: 2px solid #2D3B46;
}
.earn__invite-tabs li {
  display: inline-block;
  text-transform: uppercase;
  margin-bottom: -2px;
  padding: 0 12px;
  cursor: pointer;
}
.earn__invite-tabs li.active {
  cursor: default;
  border-bottom: 2px solid #FFFFFF;
  font-weight: bold;
  color: #FFF;
}
.earn__invite-form {
  display: flex;
  padding: 16px 0 0;
}
.earn__invite-form input {
  color: #2DC46E;
}
.earn__invite-form .btn {
  font-size: 13px;
  white-space: nowrap;
  margin-left: 24px;
}
.earn__invite-link input {
  cursor: pointer;
}
/* Colors */
/* Fonts */
/* Dimensions */
.invite-item {
  display: flex;
  padding: 15px 0;
  margin-top: 2px;
  background: #2D3B46;
}
.invite-item__col {
  padding: 0 16px;
  font-size: 16px;
  line-height: 22px;
  text-overflow: ellipsis;
}
.invite-item__status {
  width: 56px;
}
.invite-item__status svg {
  fill: #FFF;
  width: 24px;
  height: 24px;
}
.invite-item__email {
  width: calc(100% - 342px);
  text-overflow: ellipsis;
  overflow: hidden;
}
.invite-item__message {
  width: 172px;
}
.invite-item__profit {
  width: 68px;
  white-space: nowrap;
}
.invite-item__control {
  width: 46px;
}
.invite-item__control svg {
  width: 14px;
  height: 12px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.earn .milestones {
  margin-top: 48px;
}
.earn .milestones__row {
  display: flex;
  padding: 15px 0;
  margin-top: 2px;
  background: #2D3B46;
  align-items: center;
}
.earn .milestones__col {
  padding: 0 16px;
  font-size: 16px;
  line-height: 22px;
  text-overflow: ellipsis;
  flex-shrink: 0;
}
.earn .milestones__icon {
  width: 56px;
}
.earn .milestones__icon .icon-container {
  display: block;
  position: relative;
}
.earn .milestones__icon .icon-container .badge {
  font-size: 13px;
  line-height: 13px;
  color: #FFF;
  padding: 1px 4px;
  border-radius: 7px;
  background: #637581;
  position: absolute;
  top: 100%;
  left: 100%;
  margin-left: -15px;
  margin-top: -11px;
}
.earn .milestones__icon svg {
  width: 24px;
  height: 24px;
  display: block;
}
.earn .milestones__status {
  width: 46px;
}
.earn .milestones__status svg {
  width: 14px;
  height: 12px;
  display: block;
}
.earn .milestones__credits {
  width: 70px;
  white-space: nowrap;
}
.earn .milestones__progress-count {
  width: 80px;
  white-space: nowrap;
}
.earn .milestones__progress-bar {
  width: 128px;
}
.earn .milestones__progress-bar .progress-container {
  display: block;
  width: 100%;
  height: 8px;
  border-radius: 4px;
  background: #24323D;
}
.earn .milestones__progress-bar .progress-container .progress-line {
  display: block;
  height: 8px;
  border-radius: 4px;
  background: #35B374;
}
.earn .milestones__name {
  width: calc(100% - 379px);
}
/* Colors */
/* Fonts */
/* Dimensions */
/*
 * react-circular-progressbar styles
 * All of the styles in this file are configurable!
 */
.CircularProgressbar {
  /*
   * This fixes an issue where the CircularProgressbar svg has
   * 0 width inside a "display: flex" container, and thus not visible.
   */
  width: 100%;
  /*
   * This fixes a centering issue with CircularProgressbarWithChildren:
   * https://github.com/kevinsqi/react-circular-progressbar/issues/94
   */
  vertical-align: middle;
}

.CircularProgressbar .CircularProgressbar-path {
  stroke: #2DC46E;
  stroke-linecap: round;
  -webkit-transition: stroke-dashoffset 0.5s ease 0s;
  transition: stroke-dashoffset 0.5s ease 0s;
}

.CircularProgressbar .CircularProgressbar-trail {
  stroke: #3A4C5A;
  /* Used when trail is not full diameter, i.e. when props.circleRatio is set */
  stroke-linecap: round;
}

.CircularProgressbar .CircularProgressbar-text {
  fill: #FFF;
  font-size: 20px;
  dominant-baseline: middle;
  text-anchor: middle;
}

.CircularProgressbar .CircularProgressbar-background {
  fill: #2DC46E;
}

/*
 * Sample background styles. Use these with e.g.:
 *
 *   <CircularProgressbar
 *     className="CircularProgressbar-inverted"
 *     background
 *     percentage={50}
 *   />
 */
.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-background {
  fill: #2DC46E;
}

.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-text {
  fill: #fff;
}

.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-path {
  stroke: transparent;
}

.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-trail {
  stroke: transparent;
}
/* Colors */
/* Fonts */
/* Dimensions */
.narrow-container {
  max-width: 630px;
  margin-left: auto;
  margin-right: auto;
}

.earn h4 {
  font-size: 16px;
  font-weight: bold;
  color: #FFF;
  margin: 0 0 8px;
}
.earn__status {
  display: flex;
  max-width: 550px;
  align-items: center;
  margin-top: 24px;
}
.earn__status-description {
  flex-shrink: 0;
  flex-grow: 0;
  width: calc(100% - 279px);
  margin-right: 24px;
  font-size: 13px;
  line-height: 16px;
}
.earn__status-chart {
  flex-shrink: 0;
  flex-grow: 0;
  width: 255px;
  padding: 24px;
}
.earn__status-chart .CircularProgressbar-text {
  font-size: 13px;
  line-height: 16px;
  color: #FFF;
  text-align: center;
}
.earn__status-chart .CircularProgressbar-text .value, .earn__status-chart .CircularProgressbar-text .of-value {
  display: block;
  font-size: 28px;
  line-height: 32px;
  font-weight: bold;
}
.earn__status-chart .CircularProgressbar-text .value {
  color: #2DC46E;
}
.earn__status-chart .btn {
  font-size: 13px;
  white-space: nowrap;
  margin-top: 24px;
}
.earn__btn-loader {
  text-align: center;
  margin-top: 24px;
  max-height: 46px;
}
.earn__btn-loader .inline-loader-container {
  transform: translate(0, -1em) scale(0.5, 0.5);
}
.earn__invite-list {
  margin-top: 58px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.billing-add-card .card-form:after {
  content: "";
  display: table;
  clear: both;
}

.billing-add-card h1 {
  margin-bottom: 4px;
}
.billing-add-card p {
  opacity: 0.7;
}
.billing-add-card .back-icon {
  position: relative;
  top: -1px;
  width: 12px;
  height: 12px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 6px;
}
.billing-add-card .card-form {
  width: 520px;
  margin: 25px 0 0;
  background: #f7f9fc;
  border-radius: 5px;
  padding: 25px;
  display: block;
}
.billing-add-card .card-form .btn:hover {
  background: #2DC46E;
  color: #FFF;
}
.billing-add-card .card-form .card-form-body {
  margin: 0 0 20px 0;
}
.billing-add-card .card-form .card-form-body .stripe-body > div > span, .billing-add-card .card-form .card-form-body .stripe-body > span, .billing-add-card .card-form .card-form-body > span {
  font-size: 14px;
  color: black;
  margin-left: 12px;
}
.billing-add-card .card-form .card-form-body input,
.billing-add-card .card-form .card-form-body .StripeElement {
  display: block;
  color: "#424770";
  margin: 5px 0 20px 0;
  max-width: 500px;
  padding: 10px 14px;
  font-size: 16px;
  font-family: "Source Sans Pro", Helvetica, sans-seriface;
  box-shadow: rgba(50, 50, 93, 0.14902) 0px 1px 3px, rgba(0, 0, 0, 0.0196078) 0px 1px 0px;
  border: 0;
  outline: 0;
  border-radius: 4px;
  background: white;
  min-height: 39px;
  color: #151C21;
}
.billing-add-card .card-form .card-form-body input.is-invalid,
.billing-add-card .card-form .card-form-body .StripeElement.is-invalid {
  color: #eb1c26;
}
.billing-add-card .card-form .card-form-body input::placeholder {
  color: #aab7c4;
}
.billing-add-card .card-form .card-form-body input:focus,
.billing-add-card .card-form .card-form-body .StripeElement--focus {
  box-shadow: rgba(50, 50, 93, 0.109804) 0px 4px 6px, rgba(0, 0, 0, 0.0784314) 0px 1px 3px;
  -webkit-transition: all 150ms ease;
  transition: all 150ms ease;
}
.billing-add-card .card-form p {
  margin: 20px 0;
  color: black;
  opacity: 0.5;
  font-size: 14px;
}
.billing-add-card .card-form > a {
  margin: 30px;
  color: black;
  opacity: 0.4;
}
.billing-add-card .card-form p.next-payment {
  font-weight: bold;
  text-transform: uppercase;
  color: #1E2A31 !important;
}
.billing-add-card .card-current {
  margin: 25px 0 0 0;
  width: 480px;
}
.billing-add-card .card-current p {
  text-transform: uppercase;
  font-size: 14px;
  line-height: 18px;
  margin: 0 0 10px;
}
.billing-add-card .card-current table {
  margin: 10px 0 0;
  border: none;
  width: 100%;
}
.billing-add-card .card-current table td {
  border: none;
  padding: 0;
}
.billing-add-card .add-card-error {
  color: #d33a61 !important;
  opacity: 1 !important;
  font-size: 12px;
  line-height: 18px;
  text-transform: uppercase;
  margin: -20px 0 20px 0;
}
.billing-add-card .sepa-mandate {
  color: #151C21;
  font-size: 11px;
  line-height: 18px;
  margin: 20px 0;
}
.billing-add-card .method-selector li {
  position: relative;
  font-size: 16px;
  line-height: 20px;
  margin-top: 15px;
  cursor: pointer;
  display: inline-block;
  margin-right: 25px;
}
.billing-add-card .method-selector li.disabled {
  opacity: 0.5;
  pointer-events: none;
}
.billing-add-card .method-selector li .radio {
  display: inline-block;
  width: 20px;
  height: 20px;
  border: 1px solid #FFF;
  margin-right: 6px;
  border-radius: 100%;
  vertical-align: middle;
}
.billing-add-card .method-selector li .radio.checked {
  border-color: #2DC46E;
}
.billing-add-card .method-selector li .radio.checked:before {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  margin: 3px;
  border-radius: 100%;
  background: #2DC46E;
}
.billing-add-card .method-selector li.checked {
  font-weight: bold;
  color: #2DC46E;
}
/* Colors */
/* Fonts */
/* Dimensions */
.radio-switcher {
  width: 100%;
  margin-right: 24px;
  background: #3A4C5A;
  height: 48px;
  border-radius: 6px;
  padding: 4px;
  display: flex;
}
.radio-switcher button {
  display: block;
  width: 50%;
  height: 40px;
  background: transparent;
  border-radius: 6px;
  border: none;
  outline: none;
  font-size: 12px;
  line-height: 40px;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px;
  white-space: nowrap;
}
.radio-switcher button svg {
  width: 16px;
  height: 16px;
  vertical-align: middle;
  margin-right: 4px;
  position: relative;
  top: -2px;
}
.radio-switcher button:disabled {
  color: #637581;
}
.radio-switcher button.active {
  background: #35B374;
}
.radio-switcher button.active:disabled {
  background: #637581;
  color: #FFF;
}
/* Colors */
/* Fonts */
/* Dimensions */
.biling-form .submit-row:after {
  content: "";
  display: table;
  clear: both;
}

.billing-address-form-page .container {
  width: 680px;
  margin: 0 auto;
}

.biling-form {
  margin-bottom: 60px;
}
.biling-form__warning-message {
  margin: 24px 0;
  color: #FFF;
  background: #d33a61;
  padding: 24px;
  max-width: 540px;
}
.biling-form .settings-h4 {
  font-size: 14px;
  font-weight: normal;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-top: 35px;
  margin-bottom: 5px;
  color: white;
  opacity: 0.7;
}
.biling-form label {
  font-size: 14px;
  letter-spacing: 1px;
  margin-bottom: 0px;
  text-transform: uppercase;
  display: block;
  color: white;
  opacity: 0.7;
}
.biling-form .form-row {
  display: flex;
}
.biling-form h4 + .form-row {
  margin-top: 15px;
}
.biling-form .input-container-full-width {
  min-width: 300px;
  width: 100%;
  max-width: 530px;
  margin-bottom: 40px;
}
.biling-form .input-container {
  margin-left: 30px;
  width: 250px;
  flex-shrink: 0;
}
.biling-form .input-container .input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.biling-form .input-container .input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.biling-form .input-container .input:-moz-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.biling-form .input-container .input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.biling-form .input-container:nth-child(1) {
  margin-left: 0;
}
.biling-form .billing-form .btn {
  display: block;
}
.biling-form .submit-row {
  justify-content: flex-end;
  width: 550px;
}
.biling-form .submit-row .btn {
  margin-left: 25px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.customer-view__type {
  display: block;
  font-size: 13px;
  line-height: 19px;
  text-transform: uppercase;
  color: rgba(0, 0, 0, 0.65);
}
.customer-view__email {
  display: block;
  color: rgba(0, 0, 0, 0.65);
}
.customer-view__name {
  font-weight: bold;
}
.customer-view__customer {
  color: rgba(255, 255, 255, 0.65);
}
.customer-view.option .customer-view__customer {
  color: rgba(0, 0, 0, 0.65);
}
/* Colors */
/* Fonts */
/* Dimensions */
.customers__header {
  display: flex;
}
.customers__search {
  flex-grow: 1;
}
.customers__create {
  flex-grow: 0;
  width: 200px;
  margin-left: 25px;
}
.customers__create .btn {
  line-height: 38px;
  height: 38px;
  white-space: nowrap;
}
/* Colors */
/* Fonts */
/* Dimensions */
.customer-list-item {
  height: 130px;
  margin-bottom: 4px;
  width: 100%;
  background: #2a3c48;
  border-radius: 4px;
  box-shadow: 0 1px 2px 0px rgba(0, 0, 0, 0.2);
  transition: background-color 0.1s ease-out;
  will-change: background-color;
}
.customer-list-item:hover {
  background: #395263;
}
.customer-list-item__indicator {
  display: inline-block;
  width: 10px;
  height: 10px;
  line-height: 0;
  font-size: 0;
  border-radius: 100%;
  position: absolute;
  top: 20px;
  left: 7px;
}
.customer-list-item__indicator.regular {
  background: #3f809c;
}
.customer-list-item__indicator.paying {
  background: #2DC46E;
}
.customer-list-item__indicator.disabled {
  background: #d33a61;
}
.customer-list-item p {
  margin: 0 0 5px;
  font-size: 16px;
  line-height: 20px;
}
.customer-list-item p .label {
  font-size: 14px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.65);
}
.customer-list-item h4 {
  margin: 15px 0;
}
.customer-list-item__container {
  display: flex;
  padding: 15px 15px 15px 25px;
}
.customer-list-item__column {
  width: 33%;
  flex-grow: 1;
}
.customer-list-item__plan {
  font-weight: bold;
}
.customer-list-item__id, .customer-list-item__customer-type {
  color: rgba(255, 255, 255, 0.65);
  font-size: 14px;
  line-height: 20px;
}
.customer-list-item__name {
  font-size: 18px;
  line-height: 24px;
  font-weight: bold;
  color: #2DC46E;
  cursor: pointer;
}
.customer-list-item__buttons {
  width: 120px;
}
.customer-list-item__buttons .button {
  margin-top: 10px;
}
.customer-list-item__buttons .button:nth-child(1) {
  margin-top: 0;
}

.customer-list-item__loader .customer-list-item {
  opacity: 0.5;
  background: rgba(255, 255, 255, 0.1);
  animation: flickeringColor 0.5s infinite;
  height: 54px;
}
.customer-list-item__loader .customer-list-item__container {
  display: block;
  text-align: center;
  font-size: 18px;
  line-height: 24px;
}

@keyframes flickeringColor {
  0% {
    background-color: rgba(255, 255, 255, 0.1);
  }
  50% {
    background-color: rgba(255, 255, 255, 0.2);
  }
  100% {
    background-color: rgba(255, 255, 255, 0.1);
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.filter-date {
  color: #2DC46E;
  padding: 7px 0;
  border-bottom: 1px solid #354C5C;
  cursor: pointer;
  position: relative;
  width: 210px;
  display: flex;
  z-index: 10;
}
.filter-date label {
  display: inline-flex;
  width: 50%;
  border-bottom: none !important;
}
.filter-date label > svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  position: relative;
  top: 1px;
}
.filter-date .react-datepicker__input-container input {
  padding: 0;
  border-bottom: none;
  color: #2DC46E;
  text-align: center;
}
.filter-date .react-datepicker__input-container input:placeholder {
  color: rgba(255, 255, 255, 0.4);
  font-size: 12px;
}
.filter-date .react-datepicker {
  width: 240px;
}
.filter-date .react-datepicker .react-datepicker__day, .filter-date .react-datepicker .react-datepicker__day--in-range {
  border-radius: 0;
}
.filter-date .react-datepicker .react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range) {
  background-color: #777;
}
.filter-date__quick-buttons {
  display: flex;
  background-color: #f6f6f6;
  border-top: 1px solid #d9d9d9;
  flex-wrap: nowrap;
  width: 100%;
}
.filter-date__quick-button {
  display: block;
  border-left: 1px solid #d9d9d9;
  padding: 10px;
  text-align: center;
  flex-grow: 1;
}
.filter-date__quick-button:hover {
  color: #2DC46E;
}
.filter-date__quick-button:nth-child(1) {
  border-left: none;
}
.filter-date.white .react-datepicker__input-container input {
  color: #FFF;
}
.input-range__slider {
  appearance: none;
  background: #3f51b5;
  border: 1px solid #3f51b5;
  border-radius: 100%;
  cursor: pointer;
  display: block;
  height: 1rem;
  margin-left: -0.5rem;
  margin-top: -0.65rem;
  outline: none;
  position: absolute;
  top: 50%;
  transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;
  width: 1rem;
}
.input-range__slider:active {
  transform: scale(1.3);
}
.input-range__slider:focus {
  box-shadow: 0 0 0 5px rgba(63, 81, 181, 0.2);
}
.input-range--disabled .input-range__slider {
  background: #cccccc;
  border: 1px solid #cccccc;
  box-shadow: none;
  transform: none;
}

.input-range__slider-container {
  transition: left 0.3s ease-out;
}

.input-range__label {
  color: #aaaaaa;
  font-family: "Helvetica Neue", san-serif;
  font-size: 0.8rem;
  transform: translateZ(0);
  white-space: nowrap;
}

.input-range__label--min,
.input-range__label--max {
  bottom: -1.4rem;
  position: absolute;
}

.input-range__label--min {
  left: 0;
}

.input-range__label--max {
  right: 0;
}

.input-range__label--value {
  position: absolute;
  top: -1.8rem;
}

.input-range__label-container {
  left: -50%;
  position: relative;
}
.input-range__label--max .input-range__label-container {
  left: 50%;
}

.input-range__track {
  background: #eeeeee;
  border-radius: 0.3rem;
  cursor: pointer;
  display: block;
  height: 0.3rem;
  position: relative;
  transition: left 0.3s ease-out, width 0.3s ease-out;
}
.input-range--disabled .input-range__track {
  background: #eeeeee;
}

.input-range__track--background {
  left: 0;
  margin-top: -0.15rem;
  position: absolute;
  right: 0;
  top: 50%;
}

.input-range__track--active {
  background: #3f51b5;
}

.input-range {
  height: 1rem;
  position: relative;
  width: 100%;
}

/* Colors */
/* Fonts */
/* Dimensions */
.player-category-field .icon_btn {
  width: 25px;
  height: 25px;
  margin-left: 15px;
  opacity: 0.5;
  display: inline-block;
  margin-top: 15px;
  cursor: pointer;
}
.player-category-field .icon_btn:hover {
  opacity: 1;
}
.player-category-field .icon_btn:nth-child(1) {
  margin-left: 0;
}
.player-category-field .icon_btn.cat_0 {
  stroke: #5F7582;
  fill: none;
}
.player-category-field .icon_btn.cat_0.active {
  fill: #5F7582;
}
.player-category-field .icon_btn.cat_1 {
  stroke: #EFDD30;
  fill: none;
}
.player-category-field .icon_btn.cat_1.active {
  fill: #EFDD30;
}
.player-category-field .icon_btn.cat_2 {
  stroke: #F98736;
  fill: none;
}
.player-category-field .icon_btn.cat_2.active {
  fill: #F98736;
}
.player-category-field .icon_btn.cat_3 {
  stroke: #DD4043;
  fill: none;
}
.player-category-field .icon_btn.cat_3.active {
  fill: #DD4043;
}
.player-category-field .icon_btn.active {
  opacity: 1;
}
.rc-slider {
  position: relative;
  padding: 11px 0;
}
.rc-slider .rc-slider-rail {
  background: rgba(255, 255, 255, 0.3);
  height: 4px;
  border-radius: 2px;
}
.rc-slider .rc-slider-track {
  background: #2DC46E;
  height: 4px;
  border-radius: 2px;
  position: absolute;
  top: 11px;
}
.rc-slider .rc-slider-handle {
  position: absolute;
  border-radius: 100%;
  cursor: pointer;
  display: block;
  background: #3A4C5A;
  border: 1px solid #2DC46E;
  width: 26px;
  height: 26px;
  margin-top: -15px;
  margin-left: -13px;
}
.rc-slider .handle-value {
  position: absolute;
  top: -25px;
  left: 13px;
  padding: 2px 6px;
  transform: translate(-50%, 0);
  pointer-events: none;
  transition: transform 0.2s ease-out, opacity 0.2s ease-out;
  color: #2DC46E;
  font-size: 0.8rem;
  font-family: "Helvetica Neue", san-serif;
  white-space: nowrap;
}
/* Colors */
/* Fonts */
/* Dimensions */
.api-list-filters {
  display: flex;
}
.api-list-filters__trigger-container {
  white-space: nowrap;
}
.api-list-filters__trigger {
  position: relative;
  top: 9px;
  color: #2DC46E;
  border-bottom: 1px dotted;
  cursor: pointer;
}
.api-list-filters__fade {
  position: fixed;
  z-index: 9998;
  background: rgba(0, 0, 0, 0.5);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.api-list-filters__pane {
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: 9999;
  width: 300px;
  background-color: #263742;
}
.api-list-filters__pane .pad {
  padding: 32px;
}
.api-list-filters__filter {
  margin-top: 25px;
  position: relative;
}
.api-list-filters__filter:nth-child(1) {
  margin-top: 0;
}
.api-list-filters__filter .label {
  display: block;
  margin: 0;
  font-size: 14px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.7);
  text-transform: uppercase;
}
.api-list-filters__filter .label .js-link {
  color: #2DC46E;
  display: inline-block;
  margin-left: 10px;
  border-bottom: 1px dotted;
  cursor: pointer;
  text-transform: none;
}
.api-list-filters__filter .input .text-input {
  padding: 5px 6px;
}
.api-list-filters__filter__checkbox {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.api-list-filters__filter__checkbox .label {
  max-width: 128px;
}
.api-list-filters__clear {
  margin-top: 25px;
}
.api-list-filters__filter-date-range {
  width: 100%;
  border-bottom: 1px solid #2DC46E;
}
.api-list-filters__filter-slider {
  margin-top: 25px;
}

.api-list-filters__transition-enter.api-list-filters__fade, .api-list-filters__transition-appear.api-list-filters__fade {
  opacity: 0;
}
.api-list-filters__transition-enter.api-list-filters__pane, .api-list-filters__transition-appear.api-list-filters__pane {
  transform: translateX(300px);
}

.api-list-filters__transition-enter-active.api-list-filters__fade, .api-list-filters__transition-appear-active.api-list-filters__fade {
  opacity: 1;
  transition: opacity 350ms;
}
.api-list-filters__transition-enter-active.api-list-filters__pane, .api-list-filters__transition-appear-active.api-list-filters__pane {
  transform: translateX(0);
  transition: transform 350ms;
}

.api-list-filters__transition-leave.api-list-filters__fade, .api-list-filters__transition-leave.api-list-filters__fade {
  opacity: 1;
}
.api-list-filters__transition-leave.api-list-filters__pane, .api-list-filters__transition-leave.api-list-filters__pane {
  transform: translateX(0px);
}

.api-list-filters__transition-leave-active.api-list-filters__fade, .api-list-filters__transition-leave-active.api-list-filters__fade {
  opacity: 0;
  transition: opacity 350ms;
}
.api-list-filters__transition-leave-active.api-list-filters__pane, .api-list-filters__transition-leave-active.api-list-filters__pane {
  transform: translateX(300px);
  transition: transform 350ms;
}
/* Colors */
/* Fonts */
/* Dimensions */
.container.admin {
  height: 100%;
  padding-bottom: 0;
}

.customers {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.customers .js-link {
  color: #2DC46E;
  border-bottom: 1px dotted;
  cursor: pointer;
}
.customers .js-link.red {
  color: #d33a61;
}
.customers .js-link.blue {
  color: #3f809c;
}
.customers .js-link.orange {
  color: #F2CB6C;
}
.customers__filters {
  margin-top: 25px;
  display: flex;
  justify-content: space-between;
}
.customers__filters-container {
  width: 100px;
  flex-grow: 0;
}
.customers__sort {
  width: 200px;
}
.customers__rebuild {
  flex-grow: 0;
}
.customers__rebuild .js-link {
  color: #2DC46E;
  border-bottom: 1px dotted;
  cursor: pointer;
}
.customers__rebuild .js-link:hover {
  color: #188538;
}
.customers__filter {
  margin-right: 25px;
}
.customers__list {
  flex-grow: 1;
  margin-top: 25px;
  position: relative;
}
.customers__virtual-list {
  height: 100%;
  width: 100%;
}
/* Colors */
/* Fonts */
/* Dimensions */
.admin {
  height: 100%;
}
.admin .container {
  max-width: 100%;
}
.admin .admin-nav {
  font-weight: 500;
  font-size: 16px;
  margin: 0 0 -15px;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-bottom: 1px solid #495D6A;
}
@media (max-width: 959px) {
  .admin .admin-nav {
    font-size: 12px;
    margin: 0 0 -8px;
  }
}
.admin .admin-nav .container {
  padding-top: 50px;
  padding-bottom: 0;
  display: flex;
}
@media (max-width: 959px) {
  .admin .admin-nav .container {
    padding-top: 25px;
  }
}
.admin .admin-nav a {
  color: rgba(255, 255, 255, 0.75);
  border-bottom: 1px solid transparent;
}
.admin .admin-nav a:hover {
  color: #fff;
}
.admin .admin-nav span {
  border-bottom: 1px solid rgba(255, 255, 255, 0.7);
  color: #fff;
}
.admin .admin-nav span, .admin .admin-nav a {
  display: inline-block;
  width: 50%;
  padding: 10px 15px;
  text-align: center;
  margin-bottom: -1px;
}
@media (max-width: 959px) {
  .admin .admin-nav span, .admin .admin-nav a {
    padding: 5px 8px;
  }
}
/* Colors */
/* Fonts */
/* Dimensions */
.admin-users-table {
  border: none;
}
.admin-users-table th, .admin-users-table td {
  border: none;
}
.admin-users-table td {
  will-change: backround-color;
  transition: background-color 0.15s ease-out;
}
.admin-users-table th {
  padding: 0 10px 5px;
  font-size: 15px;
  line-height: 21px;
  font-weight: bold;
}
.admin-users-table td {
  padding: 10px 15px;
  background: #2a3c48;
}
.admin-users-table td .reset-user-password-link {
  margin-top: 10px;
}
.admin-users-table td p {
  margin: 0 0 5px;
  font-size: 16px;
  line-height: 20px;
  white-space: nowrap;
}
.admin-users-table td p .label {
  font-size: 14px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.65);
}
.admin-users-table td:nth-child(1) {
  border-radius: 4px 0 0 4px;
}
.admin-users-table td:nth-last-child(1) {
  border-radius: 0 4px 4px 0;
}
.admin-users-table tr {
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
}
.admin-users-table tr.empty, .admin-users-table tr.head {
  box-shadow: none;
}
.admin-users-table tr:hover td, .admin-users-table tr.selected td {
  background: #395263;
}
.admin-users-table tr:hover.empty, .admin-users-table tr:hover.head, .admin-users-table tr.selected.empty, .admin-users-table tr.selected.head {
  background: none;
}
.admin-users-table tr.disabled td {
  background: rgba(125, 0, 0, 0.1);
}
.admin-users-table tr.disabled:hover td, .admin-users-table tr.disabled.selected td {
  background: rgba(125, 0, 0, 0.3);
}
.admin-users-table tr.empty td {
  padding: 0;
  background: none;
  height: 5px;
}
.admin-users-table tr.selected td {
  background: #395263;
}
.admin-users-table .add-user {
  white-space: nowrap;
}
.admin-users-table .add-user .btn {
  position: relative;
  line-height: 24px;
  top: -6px;
}
.admin-users-table__buttons, .admin-users-table .add-user {
  width: 120px;
}
.admin-users-table__buttons .button, .admin-users-table .add-user .button {
  margin-top: 10px;
}
.admin-users-table__buttons .button:nth-child(1), .admin-users-table .add-user .button:nth-child(1) {
  margin-top: 0;
}
.admin-users-table__buttons .js-link, .admin-users-table .add-user .js-link {
  color: #2DC46E;
  border-bottom: 1px dotted;
  cursor: pointer;
}
.admin-users-table__buttons .js-link.red, .admin-users-table .add-user .js-link.red {
  color: #d33a61;
}
.admin-users-table__buttons .js-link.blue, .admin-users-table .add-user .js-link.blue {
  color: #3f809c;
}
.admin-users-table__buttons .js-link.orange, .admin-users-table .add-user .js-link.orange {
  color: #F2CB6C;
}
.admin-users-table__form td {
  vertical-align: middle;
  background: #223440;
  height: 106px;
}
.admin-users-table__form label {
  font-size: 14px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.65);
}
.admin-users-table__form .js-link {
  margin-left: 15px;
}
.admin-users-table__form input.invalid {
  border-bottom-color: #d33a61;
}
.admin-users-table__form-row {
  display: flex;
}
.admin-users-table__form-col {
  align-items: center;
  flex: 4;
  padding: 10px;
}
.admin-users-table__form-col.admin-users-table__buttons {
  flex: 1 65px;
  align-self: flex-end;
  white-space: nowrap;
}
/* Colors */
/* Fonts */
/* Dimensions */
.customer-page .js-link {
  color: #2DC46E;
  border-bottom: 1px dotted;
  cursor: pointer;
}
.customer-page .js-link.red {
  color: #d33a61;
}
.customer-page .js-link.blue {
  color: #3f809c;
}
.customer-page .js-link.orange {
  color: #F2CB6C;
}
.customer-page .email-verify-link {
  font-size: 14px;
  margin: 0 10px;
}
.customer-page .email-verify-link.no-margin {
  margin-left: 0;
}
.customer-page__heading {
  margin: 35px 0 0;
}
.customer-page__heading-row {
  display: flex;
}
.customer-page__heading-column {
  flex-grow: 1;
}
.customer-page__heading-column-controls {
  flex-grow: 0;
  width: 320px;
  align-self: flex-end;
  text-align: right;
  white-space: nowrap;
}
.customer-page__heading-column-controls .js-link {
  margin-left: 15px;
}
.customer-page__customer-status {
  font-size: 12px;
  line-height: 18px;
  margin: 0 0 0 10px;
  color: #22323c;
  padding: 3px 10px;
  border-radius: 12px;
  display: inline-block;
  text-transform: uppercase;
  vertical-align: middle;
}
.customer-page__customer-status.regular {
  background: #3f809c;
}
.customer-page__customer-status.paying {
  background: #2DC46E;
}
.customer-page__customer-status.trialing {
  background: #3f809c;
}
.customer-page__customer-status.disabled {
  background: #d33a61;
}
.customer-page__name {
  margin: 0;
  font-size: 28px;
  line-height: 34px;
  font-weight: bold;
}
.customer-page__email, .customer-page__user-name {
  margin: 5px 0 0;
  font-size: 16px;
  line-height: 22px;
}
.customer-page__row {
  display: flex;
}
.customer-page__column {
  width: 25%;
  position: relative;
  padding: 0 10px;
}
.customer-page__column:nth-child(1) {
  padding-left: 0;
}
.customer-page__column:nth-last-child(1) {
  padding-right: 0;
}
.customer-page__info {
  background: #2a3c48;
  padding: 15px 15px 15px 25px;
  margin: 35px 0 0;
  border-radius: 4px;
}
.customer-page__info input.invalid {
  border-bottom-color: #d33a61;
}
.customer-page__info.loading {
  text-align: center;
  height: 160px;
}
.customer-page__info.loading .inline-loader-container {
  top: 20px;
}
.customer-page__info p {
  margin: 0 0 5px;
  font-size: 16px;
  line-height: 20px;
  position: relative;
}
.customer-page__info p .label {
  font-size: 14px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.65);
}
.customer-page__plan {
  font-weight: bold;
}
.customer-page__id, .customer-page__customer-type {
  color: rgba(255, 255, 255, 0.65);
  font-size: 14px;
  line-height: 20px;
}
.customer-page__indicator {
  display: inline-block;
  width: 10px;
  height: 10px;
  line-height: 0;
  font-size: 0;
  border-radius: 100%;
  position: absolute;
  top: 0;
  right: -14px;
}
.customer-page__indicator.regular {
  background: #3f809c;
}
.customer-page__indicator.paying {
  background: #2DC46E;
}
.customer-page__indicator.disabled {
  background: #d33a61;
}
.customer-page__tabs {
  margin-top: 0;
}
.customer-page__tabs-content {
  padding: 25px 0 35px;
}
.customer-page__tab-title {
  font-size: 18px;
  line-height: 24px;
  font-weight: bold;
  margin: 25px 0;
}
.customer-page__form-buttons {
  margin-top: 25px;
  text-align: right;
}
.customer-page__form-buttons .btn {
  margin-left: 15px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.favorites .empty-message {
  font-size: 18px;
  line-height: 26px;
  color: rgba(255, 255, 255, 0.75);
  margin: 55px 0 25px;
  width: 65%;
  text-align: left;
  opacity: 0.8;
  font-weight: 400;
  letter-spacing: 0.2px;
}
.favorites .demo-message {
  margin: 60px 0 25px 120px;
}
.favorites .demo-player {
  display: block;
  position: relative;
  padding-left: 42px;
}
.favorites .demo-player .player-image {
  width: 36px;
  height: 44px;
  margin-top: -23px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 0;
}
@media (max-width: 959px) {
  .favorites .demo-player .player-image {
    width: 24px;
    height: 28px;
    margin-top: -15px;
  }
}
.favorites .tri {
  color: #FFF;
  display: inline-block;
  width: 0;
  height: 0;
  vertical-align: middle;
  position: absolute;
  left: 0;
  margin-left: 5px;
  top: 50%;
  margin-top: -3px;
  font-weight: 600;
}
.favorites .tri.asc {
  border-bottom: none;
  border-top: 4px solid #FFF;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}
.favorites .tri.desc {
  border-top: none;
  border-bottom: 4px solid #FFF;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}
.favorites .favorite-player-name {
  position: relative;
  padding-left: 48px;
  font-size: 16px;
  line-height: 120%;
  display: table-caption;
  margin-bottom: -5px;
  min-height: 38px;
}
.favorites .favorite-player-name .favorite-player-name_last {
  font-weight: bold;
}
@media (max-width: 959px) {
  .favorites .favorite-player-name {
    padding-left: 30px;
    font-size: 14px;
    line-height: 120%;
  }
}
.favorites .favorite-player-name .player-image {
  width: 36px;
  height: 44px;
  margin-top: -23px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 0;
}
@media (max-width: 959px) {
  .favorites .favorite-player-name .player-image {
    width: 24px;
    height: 28px;
    margin-top: -15px;
  }
}
.favorites .favorite-player-team {
  display: inline-block;
  position: relative;
  padding-left: 23px;
}
@media (max-width: 959px) {
  .favorites .favorite-player-team {
    line-height: 120%;
  }
}
.favorites .favorite-player-team .team-image {
  width: 17px;
  height: 22px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 0;
  left: 0;
}
.favorites .favorite-rate {
  display: inline-block;
  position: relative;
  padding-left: 20px;
}
.favorites .favorite-rate .legend {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  position: absolute;
  top: 4px;
  left: 0;
}
.favorites .create-icon {
  width: 11px;
  height: 15px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -1px;
  margin-right: 6px;
}
.favorites .favorites-list {
  line-height: 18px;
  font-size: 15px;
  font-weight: 500;
  width: 100%;
  margin: 20px 0 0;
  border-collapse: separate;
  border-spacing: 0 4px;
  table-layout: fixed;
}
.favorites .favorites-list__filters {
  position: relative;
  z-index: 51;
  display: flex;
  margin-left: 24px;
}
@media (max-width: 959px) {
  .favorites .favorites-list__filters.empty {
    display: none;
  }
}
.favorites .favorites-list__filters .filter-container {
  margin-left: 30px;
  width: 310px;
  padding-left: 30px;
  border-left: 1px solid #495158;
  display: flex;
}
.favorites .favorites-list__filters .filter-container.empty {
  border-left: none;
  margin-left: 0;
  padding-left: 0;
}
.favorites .favorites-list__filters .filter-container.empty .btn {
  width: 200px;
}
.favorites .favorites-list__filters .filter-container + .filter-container {
  border-left: none;
}
@media (max-width: 1200px) {
  .favorites .favorites-list__filters .add-new-player-container {
    display: none;
  }
}
.favorites .favorites-list__filters .filter {
  margin-left: 40px;
  min-width: 150px;
  user-select: none;
}
.favorites .favorites-list__filters .filter__input {
  margin-top: 4px;
}
.favorites .favorites-list__filters .filter__position {
  min-width: 140px;
}
.favorites .favorites-list__filters .filter label {
  text-transform: uppercase;
  color: white;
  opacity: 0.6;
  font-size: 13px;
  /*line-height: 20px;*/
  letter-spacing: 0.5px;
}
.favorites .favorites-list__filters .filter .btn.search-player {
  min-width: 240px;
}
.favorites .favorites-list__filters .filter .input-range {
  margin-top: 25px;
}
.favorites .favorites-list__filters .filter .input-range .input-range__label--min, .favorites .favorites-list__filters .filter .input-range .input-range__label--max {
  display: none;
}
.favorites .favorites-list__filters .filter .input-range .input-range__label--value {
  top: -2.2rem;
  color: #2DC46E;
}
.favorites .favorites-list__filters .filter .input-range .input-range__label--value .input-range__label-container {
  border-radius: 3px;
  padding: 0 2px;
  position: relative;
  background: rgb(38, 55, 66);
}
.favorites .favorites-list__filters .filter .input-range .input-range__label--value .input-range__label-container:before {
  position: absolute;
  height: 14px;
  width: 15px;
  right: 100%;
  top: 0;
  bottom: 0;
  content: "";
  background: linear-gradient(to right, rgba(38, 55, 66, 0) 0%, rgb(38, 55, 66) 100%);
}
.favorites .favorites-list__filters .filter .input-range .input-range__label--value .input-range__label-container i {
  font-style: normal;
  /*color: rgba( 255, 255,255, .75);*/
  font-weight: 400;
  opacity: 0.8;
}
.favorites .favorites-list__filters .filter .input-range .input-range__track--active {
  background: #2DC46E;
}
.favorites .favorites-list__filters .filter .input-range .input-range__slider {
  background: #263742;
  border-color: #2DC46E;
  width: 26px;
  height: 26px;
  margin-left: -11px;
  margin-top: -13px;
}
.favorites .favorites-list__filters .filter .input-range .input-range__track--background {
  background: rgba(255, 255, 255, 0.3);
}
.favorites .favorites-list__filters .filter:nth-child(1) {
  margin-left: 0;
}
.favorites .favorites-list__filters .filter__checkbox {
  min-width: 160px;
  margin-left: 25px;
  position: relative;
  padding-left: 25px;
  /*text-transform: uppercase;*/
  /*letter-spacing: 1px;*/
  font-size: 15px;
  margin-top: 25px;
  opacity: 0.7;
  color: #2DC46E;
}
.favorites .favorites-list__filters .filter__checkbox.checked {
  opacity: 1;
}
.favorites .favorites-list__filters .filter .checkbox_label {
  margin-left: 6px;
  display: block;
  line-height: 130%;
  width: 80px;
}
.favorites .favorites-list__filters .filter .checkbox {
  border: 1px solid #2DC46E;
  width: 24px;
  height: 24px;
  top: -2px;
}
.favorites .favorites-list__filters .filter .checkbox svg {
  position: absolute;
  left: 3px;
  top: 3px;
  width: 16px;
  height: 16px;
}
.favorites .favorites-list__filters .filter.select-scout {
  margin-left: 0px;
  position: relative;
  z-index: 1000;
}
@media (max-width: 959px) {
  .favorites .favorites-list {
    line-height: 13px;
    font-size: 11px;
  }
}
.favorites .favorites-list th, .favorites .favorites-list td {
  text-align: left;
  padding: 12px 4px 15px;
  border: none;
  /*border-bottom: 1px solid rgba(#fff, .1);*/
  vertical-align: top;
}
@media (max-width: 959px) {
  .favorites .favorites-list th, .favorites .favorites-list td {
    padding: 8px 2px;
  }
}
.favorites .favorites-list th:first-child, .favorites .favorites-list td:first-child {
  padding: 8px 0px 8px 8px;
}
@media (max-width: 959px) {
  .favorites .favorites-list th:first-child, .favorites .favorites-list td:first-child {
    padding: 8px 0px 8px 8px;
  }
}
.favorites .favorites-list th:last-child, .favorites .favorites-list td:last-child {
  padding-right: 10px;
}
@media (max-width: 959px) {
  .favorites .favorites-list th:last-child, .favorites .favorites-list td:last-child {
    padding-right: 10px;
  }
}
.favorites .favorites-list th.controls-col, .favorites .favorites-list td.controls-col {
  text-align: right;
  width: 150px;
  white-space: nowrap;
}
@media (max-width: 959px) {
  .favorites .favorites-list th.controls-col, .favorites .favorites-list td.controls-col {
    width: 75px;
  }
}
.favorites .favorites-list tbody tr:last-child th, .favorites .favorites-list tbody tr:last-child td {
  border-bottom: none;
}
.favorites .favorites-list tbody tr {
  background: #2a3c48;
  border-radius: 4px;
  box-shadow: 0 1px 2px 0px rgba(0, 0, 0, 0.2);
}
.favorites .favorites-list tbody td:first-child {
  padding: 0px;
}
@media (max-width: 959px) {
  .favorites .favorites-list tbody td:first-child {
    padding: 0px;
  }
}
.favorites .favorites-list th {
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 13px;
  opacity: 0.6;
  position: relative;
  line-height: 130%;
  padding: 8px 4px;
  vertical-align: bottom;
}
.favorites .favorites-list th.sorted {
  opacity: 1;
  font-weight: 400;
  padding-left: 14px;
}
.favorites .favorites-list th:hover {
  cursor: pointer;
  opacity: 1;
}
@media (max-width: 959px) {
  .favorites .favorites-list th {
    font-size: 11px;
  }
}
.favorites .favorites-list td {
  font-size: 15px;
  margin-bottom: 4px;
}
@media (max-width: 959px) {
  .favorites .favorites-list td {
    font-size: 14px;
  }
}
.favorites .favorites-list .align {
  display: block;
}
.favorites .favorite-change {
  cursor: pointer;
}
.favorites .favorite-change svg {
  stroke: currentColor;
  width: 22px;
  height: 22px;
}
@media (max-width: 959px) {
  .favorites .favorite-change svg {
    width: 12px;
    height: 12px;
  }
}
.favorites .favorite-change:hover svg {
  fill: transparent;
}
.favorites .favorites-header {
  display: flex;
  justify-content: space-between;
  position: relative;
}
@media (max-width: 959px) {
  .favorites .favorites-header.empty {
    margin-bottom: 80px;
  }
}
.favorites .favorites-header h3 {
  vertical-align: middle;
  font-size: 28px;
  line-height: 34px;
  font-weight: bold;
}
.favorites .favorites-header .btn.not-empty {
  right: 0;
  position: relative;
  top: -7px;
}
.favorites .favorites-header .btn.empty {
  position: absolute;
  bottom: -54px;
  width: 200px;
}
.favorites .favorites-header .player-search {
  flex: auto;
}
.favorites .add-new-player,
.favorites .search-player {
  margin-left: 24px;
  white-space: nowrap;
}
.favorites .players-infinite-loader {
  position: absolute;
  top: 72px;
  right: 0;
  bottom: 0;
  left: 26px;
  margin-top: 50px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.favorites-wrapper {
  height: 100%;
}
.favorites-wrapper .sub-nav__navigation {
  overflow: hidden;
  padding: 0;
}
.favorites-wrapper .sub-nav__navigation .pad {
  padding: 25px 22px 25px 23px;
}
.favorites-wrapper .sub-nav__navigation h2 {
  margin-bottom: 20px;
}
.favorites-wrapper .sub-nav__navigation ul li {
  font-size: 15px;
  line-height: 19px;
  margin-bottom: 5px;
}
.favorites-wrapper .sub-nav__navigation .nav-link {
  margin-bottom: 5px;
  font-size: 17px;
  line-height: 21px;
}
.favorites-wrapper .sub-nav__navigation .divider {
  height: 0;
  overflow: hidden;
  border-bottom: 1px solid #334A59;
}
.favorites-wrapper .sub-nav__navigation a {
  cursor: pointer;
}
.favorites-wrapper .sub-nav__navigation .active {
  color: #FFF;
  pointer: default;
  font-weight: bold;
}
.favorites-wrapper .sub-nav__navigation.watchlists h2 {
  font-size: 22px;
  line-height: 28px;
  font-weight: bold;
}
.favorites-wrapper__content {
  overflow: hidden;
}
/* Colors */
/* Fonts */
/* Dimensions */
.watchlists .container {
  padding-left: 36px;
  padding-right: 36px;
}
.watchlists__heading h3 {
  vertical-align: middle;
  font-size: 28px;
  line-height: 34px;
  font-weight: bold;
}
.watchlists .demo-watchlists-list {
  margin-top: 24px;
}
.watchlists .demo-message {
  top: 60px;
  left: 140px;
}
.watchlists .empty-message {
  letter-spacing: 0.2px;
  font-size: 18px;
  line-height: 26px;
  color: rgba(255, 255, 255, 0.75);
  margin: 25px 0;
  width: 50%;
  text-align: left;
  opacity: 0.8;
  font-weight: 400;
}
.watchlists__controls {
  display: flex;
  position: relative;
  z-index: 5;
}
.watchlists__create {
  margin-left: 25px;
}
.watchlists__filters {
  max-width: 320px;
  margin-right: 25px;
}
.watchlists .create-team {
  margin: 40px 0 10px 0;
  max-width: 360px;
  white-space: nowrap;
  /*    &:hover{
        color: $color_GreenAction;
      }*/
}
@media (max-width: 959px) {
  .watchlists .create-team {
    width: 300px;
    font-size: 13px;
  }
}
.watchlists .create-team .create-icon {
  width: 11px;
  height: 15px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -1px;
  margin-right: 6px;
  margin-left: 6px;
}
.watchlists .group-check {
  margin: 25px 0;
  color: #2DC46E;
  position: relative;
  padding-top: 8px;
  font-size: 14px;
  line-height: 20px;
  text-transform: uppercase;
}
.watchlists .group-check .checkbox {
  border-color: #2DC46E;
  display: inline-block;
  vertical-align: middle;
  width: 22px;
  height: 22px;
  margin-right: 8px;
  position: relative;
  top: -1px;
}
.watchlists .group-check .checkbox svg {
  width: 16px;
  height: 16px;
  top: 2px;
  left: 2px;
  position: absolute;
  stroke: #2DC46E;
}
.watchlists .group-check label {
  cursor: pointer;
}
.watchlists .group-check label.checked {
  opacity: 1;
}
.watchlists .filter {
  min-width: 150px;
  user-select: none;
  max-width: 180px;
  margin: 35px 0 20px;
}
.watchlists .filter__position {
  min-width: 140px;
}
.watchlists .filter label {
  font-size: 13px;
  letter-spacing: 0.5px;
  line-height: 1.2;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
}
.watchlists .filter .input-range {
  margin-top: 25px;
}
.watchlists .filter .input-range .input-range__label--min, .watchlists .filter .input-range .input-range__label--max {
  display: none;
}
.watchlists .filter .input-range .input-range__label--value {
  top: -2.2rem;
  color: #2DC46E;
}
.watchlists .filter .input-range .input-range__track--active {
  background: #2DC46E;
}
.watchlists .filter .input-range .input-range__slider {
  background: #263742;
  border-color: #2DC46E;
  width: 26px;
  height: 26px;
  margin-left: -11px;
  margin-top: -13px;
}
.watchlists .filter .input-range .input-range__track--background {
  background: rgba(255, 255, 255, 0.3);
}
.watchlists .filter:nth-child(1) {
  margin-left: 0;
}
.watchlists .filter__checkbox {
  min-width: 160px;
  margin-left: 25px;
  position: relative;
  padding-left: 25px;
  /*text-transform: uppercase;*/
  /*letter-spacing: 1px;*/
  font-size: 15px;
  margin-top: 25px;
  opacity: 0.7;
  color: #2DC46E;
}
.watchlists .filter__checkbox.checked {
  opacity: 1;
}
.watchlists .filter .checkbox_label {
  margin-left: 6px;
  display: block;
  line-height: 130%;
  width: 80px;
}
.watchlists .filter .checkbox {
  border: 1px solid #2DC46E;
  width: 24px;
  height: 24px;
  top: -2px;
}
.watchlists .filter .checkbox svg {
  position: absolute;
  left: 3px;
  top: 3px;
  width: 16px;
  height: 16px;
}
.watchlists .filter.select-scout {
  margin-left: 0px;
}
.watchlists .upgrade-message {
  margin: 45px 0;
  font-size: 18px;
  line-height: 26px;
  color: rgba(255, 255, 255, 0.75);
  text-align: left;
  opacity: 0.8;
  font-weight: 400;
  letter-spacing: 0.2px;
}

.upgrade-placeholder {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.upgrade-placeholder .img {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 2;
  opacity: 0.1;
}
.upgrade-placeholder h3 {
  padding-left: 25px;
  padding-right: 25px;
  width: 100%;
  text-align: center;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
}

.sub-nav__content.watchlists .container .container {
  padding-left: 0;
  padding-right: 0;
}

.sub-nav__content.watchlists .section-nav .container {
  margin-left: 0;
  margin-right: 0;
}
/* Colors */
/* Fonts */
/* Dimensions */
.watchlist-icon {
  display: inline-block;
  width: 80px;
  height: 80px;
  border-radius: 50%;
}
.watchlist-icon svg {
  fill: currentColor;
  width: 40px;
  height: 40px;
  margin: 20px;
}
.watchlist-icon.small {
  width: 32px;
  height: 32px;
}
.watchlist-icon.small svg {
  width: 24px;
  height: 24px;
  margin: 4px;
}
.demo-badge {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  width: 48px;
  height: 48px;
  z-index: 2;
}
.demo-badge svg {
  width: 48px;
  height: 48px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.watchlists__players-table {
  margin-top: 25px;
  min-width: 560px;
}
.watchlists__lists-table {
  margin-top: 25px;
}
@media screen and (max-width: 959px) {
  .watchlists__players-table, .watchlists__lists-table {
    font-size: 13px;
    line-height: 19px;
  }
}
.watchlists__players-table li.heading, .watchlists__lists-table li.heading {
  display: flex;
  text-transform: uppercase;
  font-size: 13px;
  line-height: 19px;
  color: #CCC;
  padding: 10px;
  position: relative;
}
.watchlists__players-table li.heading span.th, .watchlists__lists-table li.heading span.th {
  display: block;
  cursor: pointer;
  position: relative;
  white-space: nowrap;
}
.watchlists__players-table li.heading span.th:hover, .watchlists__lists-table li.heading span.th:hover {
  color: #FFF;
}
.watchlists__players-table li.heading span.th.sorted, .watchlists__lists-table li.heading span.th.sorted {
  color: #FFF;
}
.watchlists__players-table li.heading span.th.sorted:hover, .watchlists__lists-table li.heading span.th.sorted:hover {
  color: #2DC46E;
}
.watchlists__players-table li.heading .tri, .watchlists__lists-table li.heading .tri {
  color: #FFF;
  display: inline-block;
  width: 0;
  height: 0;
  vertical-align: middle;
  left: 0;
  margin-right: 3px;
  position: relative;
  vertical-align: middle;
  margin-top: -3px;
  font-weight: 600;
}
.watchlists__players-table li.heading .tri.asc, .watchlists__lists-table li.heading .tri.asc {
  border-bottom: none;
  border-top: 4px solid #FFF;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}
.watchlists__players-table li.heading .tri.desc, .watchlists__lists-table li.heading .tri.desc {
  border-top: none;
  border-bottom: 4px solid #FFF;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}
.watchlists__players-table li.heading span.col-drag-handle, .watchlists__lists-table li.heading span.col-drag-handle {
  padding: 0 4px;
}
.watchlists__players-table li.heading span.col-player, .watchlists__lists-table li.heading span.col-player {
  padding-left: 16px;
}
.watchlists__players-table li.heading span.col-title, .watchlists__lists-table li.heading span.col-title {
  padding-left: 50px;
}
@media screen and (max-width: 959px) {
  .watchlists__players-table li.heading span.col-title, .watchlists__lists-table li.heading span.col-title {
    padding-left: 16px;
  }
}
.watchlists__players-table .td, .watchlists__players-table .th, .watchlists__lists-table .td, .watchlists__lists-table .th {
  overflow: hidden;
  box-sizing: border-box;
}
.watchlists__players-table .td, .watchlists__lists-table .td {
  color: #FFF;
}
.watchlists__players-table .col-drag-handle, .watchlists__lists-table .col-drag-handle {
  vertical-align: middle;
  width: 45px;
}
.watchlists__players-table .col-drag-handle .drag-handle, .watchlists__lists-table .col-drag-handle .drag-handle {
  padding: 8px 4px;
}
.watchlists__players-table .col-drag-handle .drag-handle.inactive, .watchlists__lists-table .col-drag-handle .drag-handle.inactive {
  opacity: 0.5;
  cursor: default;
  pointer-events: none;
}
.watchlists__players-table .col-drag-handle .drag-handle.disabled, .watchlists__lists-table .col-drag-handle .drag-handle.disabled {
  opacity: 0.5;
  cursor: default;
}
.watchlists__players-table .col-drag-handle .drag-handle.disabled svg, .watchlists__lists-table .col-drag-handle .drag-handle.disabled svg {
  fill: #637581 !important;
}
.watchlists__players-table .col-drag-handle .drag-handle.disabled:hover svg, .watchlists__lists-table .col-drag-handle .drag-handle.disabled:hover svg {
  fill: #637581 !important;
}
.watchlists__players-table .col-drag-handle > span, .watchlists__lists-table .col-drag-handle > span {
  display: inline-block;
  height: 16px;
}
.watchlists__players-table .col-drag-handle svg, .watchlists__lists-table .col-drag-handle svg {
  width: 16px;
  height: 16px;
  fill: #637581;
  cursor: pointer;
}
.watchlists__players-table .col-drag-handle:hover svg, .watchlists__lists-table .col-drag-handle:hover svg {
  fill: #2DC46E;
}
.watchlists__players-table .col-player, .watchlists__players-table .col-team, .watchlists__lists-table .col-player, .watchlists__lists-table .col-team {
  width: calc(50% - 245px);
}
@media screen and (max-width: 1025px) {
  .watchlists__players-table .col-player, .watchlists__players-table .col-team, .watchlists__lists-table .col-player, .watchlists__lists-table .col-team {
    width: calc(50% - 185px);
  }
}
.watchlists__players-table .col-position, .watchlists__lists-table .col-position {
  padding: 0 8px;
  flex-grow: 0;
  width: 47px;
}
.watchlists__players-table .col-age, .watchlists__lists-table .col-age {
  padding: 0 8px;
  flex-grow: 0;
  width: 53px;
}
.watchlists__players-table .col-team, .watchlists__lists-table .col-team {
  padding: 0 8px;
}
.watchlists__players-table .col-date, .watchlists__lists-table .col-date {
  padding: 0 8px;
  flex-grow: 0;
  width: 133px;
}
@media screen and (max-width: 1024px) {
  .watchlists__players-table .col-date, .watchlists__lists-table .col-date {
    display: none !important;
  }
}
.watchlists__players-table .col-final-rating, .watchlists__lists-table .col-final-rating {
  width: 68px;
}
@media screen and (max-width: 959px) {
  .watchlists__players-table .col-final-rating, .watchlists__lists-table .col-final-rating {
    padding-left: 5px;
  }
}
@media screen and (max-width: 1024px) {
  .watchlists__players-table .col-author, .watchlists__lists-table .col-author {
    display: none !important;
  }
}
.watchlists__players-table .col-favorite, .watchlists__lists-table .col-favorite {
  padding: 0 12px;
  width: 168px;
  white-space: nowrap;
  overflow: visible;
}
.watchlists__players-table .col-delete, .watchlists__lists-table .col-delete {
  padding: 0 8px;
  width: 24px;
  padding-right: 16px;
}
.watchlists__players-table .col-delete svg, .watchlists__lists-table .col-delete svg {
  width: 10px;
  height: 10px;
  fill: currentColor;
  cursor: pointer;
}
.watchlists__players-table .col-delete svg:hover, .watchlists__lists-table .col-delete svg:hover {
  color: #2DC46E;
}
.watchlists__players-table .col-menu, .watchlists__lists-table .col-menu {
  overflow: visible;
  padding: 0 8px;
  width: 40px;
  padding-right: 16px;
}
.watchlists__players-table .col-title, .watchlists__lists-table .col-title {
  width: calc(100% - 488px);
}
@media screen and (max-width: 1199px) {
  .watchlists__players-table .col-title, .watchlists__lists-table .col-title {
    width: calc(100% - 488px);
  }
}
@media screen and (max-width: 1024px) {
  .watchlists__players-table .col-title, .watchlists__lists-table .col-title {
    width: calc(100% - 198px);
  }
}
.watchlists__players-table .col-author, .watchlists__lists-table .col-author {
  width: 60px;
}
.watchlists__players-table .col-players, .watchlists__lists-table .col-players {
  width: 50px;
}
.watchlists__players-table .dragable-player, .watchlists__players-table .dragable-watchlist, .watchlists__lists-table .dragable-player, .watchlists__lists-table .dragable-watchlist {
  align-items: center;
  background: #2D3B46;
  padding: 10px;
  margin-top: 5px;
  font-size: 16px;
  line-height: 22px;
  display: flex;
  position: relative;
  color: #CCC;
}
.watchlists__players-table .dragable-player.inactive, .watchlists__players-table .dragable-watchlist.inactive, .watchlists__lists-table .dragable-player.inactive, .watchlists__lists-table .dragable-watchlist.inactive {
  opacity: 0.45;
  pointer-events: none;
}
@media screen and (max-width: 959px) {
  .watchlists__players-table .dragable-player, .watchlists__players-table .dragable-watchlist, .watchlists__lists-table .dragable-player, .watchlists__lists-table .dragable-watchlist {
    font-size: 13px;
    line-height: 19px;
  }
}
.watchlists__players-table .dragable-player.dragging, .watchlists__players-table .dragable-watchlist.dragging, .watchlists__lists-table .dragable-player.dragging, .watchlists__lists-table .dragable-watchlist.dragging {
  opacity: 0.5;
}
.watchlists__players-table .dragable-player .team, .watchlists__players-table .dragable-watchlist .team, .watchlists__lists-table .dragable-player .team, .watchlists__lists-table .dragable-watchlist .team {
  position: relative;
  display: block;
  padding-left: 24px;
}
.watchlists__players-table .dragable-player .team .team-image, .watchlists__players-table .dragable-watchlist .team .team-image, .watchlists__lists-table .dragable-player .team .team-image, .watchlists__lists-table .dragable-watchlist .team .team-image {
  display: block;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 4px;
  top: 50%;
  margin-top: -8px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.watchlists__players-table .dragable-player .dragable-player__name, .watchlists__players-table .dragable-watchlist .dragable-player__name, .watchlists__lists-table .dragable-player .dragable-player__name, .watchlists__lists-table .dragable-watchlist .dragable-player__name {
  position: relative;
  display: block;
  padding-left: 48px;
}
.watchlists__players-table .dragable-player .dragable-player__name .player-image, .watchlists__players-table .dragable-watchlist .dragable-player__name .player-image, .watchlists__lists-table .dragable-player .dragable-player__name .player-image, .watchlists__lists-table .dragable-watchlist .dragable-player__name .player-image {
  display: block;
  width: 32px;
  height: 32px;
  border-radius: 16px;
  position: absolute;
  left: 8px;
  top: 50%;
  margin-top: -16px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-color: #e0e8ed;
}
.watchlists__players-table .dragable-player .dragable-player__name .last-name, .watchlists__players-table .dragable-watchlist .dragable-player__name .last-name, .watchlists__lists-table .dragable-player .dragable-player__name .last-name, .watchlists__lists-table .dragable-watchlist .dragable-player__name .last-name {
  font-weight: bold;
  display: block;
}
.watchlists__players-table .dragable-player .add-to-favorites, .watchlists__players-table .dragable-watchlist .add-to-favorites, .watchlists__lists-table .dragable-player .add-to-favorites, .watchlists__lists-table .dragable-watchlist .add-to-favorites {
  position: relative;
  top: -1px;
}
.watchlists__players-table .dragable-player .favorite-selector, .watchlists__players-table .dragable-watchlist .favorite-selector, .watchlists__lists-table .dragable-player .favorite-selector, .watchlists__lists-table .dragable-watchlist .favorite-selector {
  cursor: pointer;
  line-height: 25px;
}
.watchlists__players-table .dragable-player .favorite-selector svg, .watchlists__players-table .dragable-watchlist .favorite-selector svg, .watchlists__lists-table .dragable-player .favorite-selector svg, .watchlists__lists-table .dragable-watchlist .favorite-selector svg {
  width: 21px;
  height: 21px;
  display: inline-block;
  position: relative;
  top: -2px;
  vertical-align: middle;
}
.watchlists__players-table .dragable-player .favorite-selector .chevron-down, .watchlists__players-table .dragable-watchlist .favorite-selector .chevron-down, .watchlists__lists-table .dragable-player .favorite-selector .chevron-down, .watchlists__lists-table .dragable-watchlist .favorite-selector .chevron-down {
  vertical-align: middle;
  width: 15px;
  height: 15px;
  position: relative;
  fill: #FFF !important;
  stroke: none !important;
  top: -1px;
}
.watchlists__players-table .dragable-watchlist .col-title, .watchlists__lists-table .dragable-watchlist .col-title {
  overflow: visible;
  vertical-align: middle;
}
.watchlists__players-table .dragable-watchlist .col-title .watchlist-icon, .watchlists__lists-table .dragable-watchlist .col-title .watchlist-icon {
  vertical-align: middle;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -16px;
}
.watchlists__players-table .dragable-watchlist .col-title a, .watchlists__lists-table .dragable-watchlist .col-title a {
  display: block;
  position: relative;
  padding-left: 42px;
  vertical-align: middle;
}
.watchlists__players-table .dragable-watchlist .avatars, .watchlists__lists-table .dragable-watchlist .avatars {
  display: block;
  white-space: nowrap;
  width: 32px;
  height: 32px;
  font-size: 12px;
  line-height: 32px;
  text-align: center;
  background: #24323D;
  color: #CCCCCC;
  border-radius: 16px;
}
.watchlists__players-table .dragable-watchlist .col-controls, .watchlists__lists-table .dragable-watchlist .col-controls {
  width: 90px;
}
.watchlists__players-table .dragable-watchlist .col-controls .control-btn, .watchlists__lists-table .dragable-watchlist .col-controls .control-btn {
  display: inline-block;
  text-align: center;
  width: 42px;
  height: 18px;
  cursor: pointer;
  color: #2DC46E;
  opacity: 0.7;
}
.watchlists__players-table .dragable-watchlist .col-controls .control-btn:nth-child(1), .watchlists__lists-table .dragable-watchlist .col-controls .control-btn:nth-child(1) {
  margin-left: 0;
}
.watchlists__players-table .dragable-watchlist .col-controls .control-btn svg, .watchlists__lists-table .dragable-watchlist .col-controls .control-btn svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
}
.watchlists__players-table .dragable-watchlist .col-controls .control-btn:hover, .watchlists__lists-table .dragable-watchlist .col-controls .control-btn:hover {
  color: #fff;
  opacity: 1;
}
/* Colors */
/* Fonts */
/* Dimensions */
.create-watchlist-form {
  max-width: 582px;
  min-width: 320px;
  margin: 0 auto;
  background: #2E3C47;
  padding: 24px;
  box-sizing: border-box;
  flex-grow: 1;
  position: relative;
}
.create-watchlist-form h1 {
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0 0 20px;
}
.create-watchlist-form h1 .title-icon {
  display: inline-block;
  margin-right: 4px;
  vertical-align: middle;
  width: 16px;
  height: 16px;
}
.create-watchlist-form label {
  font-size: 12px;
  line-height: 16px;
  color: #A4A6A4;
  text-transform: uppercase;
}
.create-watchlist-form .input {
  margin-top: 20px;
}
.create-watchlist-form .input input {
  color: #2DC46E;
}
.create-watchlist-form .input input:focus {
  color: #FFF;
}
.create-watchlist-form .close-icon {
  position: absolute;
  width: 10px;
  height: 10px;
  right: 25px;
  top: 25px;
  color: #FFF;
  cursor: pointer;
}
.create-watchlist-form .close-icon:hover {
  color: #2DC46E;
}
.create-watchlist-form button {
  margin-top: 20px;
}
.create-watchlist-form__wrapper {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: fixed;
  background: rgba(0, 0, 0, 0.65);
  display: flex;
  align-content: center;
  align-items: center;
  z-index: 99999;
}
.create-watchlist-form__row {
  margin: 32px 0;
  display: flex;
  justify-content: space-between;
}
.create-watchlist-form__colors-list {
  display: flex;
  margin-top: 8px;
}
.create-watchlist-form__icons-list {
  margin-top: 8px;
  display: flex;
}
.create-watchlist-form__color {
  display: inline-block;
  width: 32px;
  height: 32px;
  border-width: 3px;
  border-radius: 50%;
  border-style: solid;
  margin-right: 8px;
}
.create-watchlist-form__icon {
  display: inline-block;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border-style: solid;
  margin-left: 8px;
  background: #3A4C5A;
}
.create-watchlist-form__icon svg {
  width: 24px;
  height: 24px;
  margin: 4px;
  fill: currentColor;
}
.create-watchlist-form__icon:hover svg {
  fill: #35B374;
}
.create-watchlist-form__icon.active {
  background: #FFF;
}
.create-watchlist-form__icon.active svg {
  fill: #35B374;
}
/* Colors */
/* Fonts */
/* Dimensions */
.upgrade-button__row-button {
  display: block;
  background: #2a3c48;
  box-shadow: 0 1px 2px 0px rgba(0, 0, 0, 0.2);
  vertical-align: middle;
  font-size: 16px;
  line-height: 22px;
  font-weight: bold;
  text-transform: uppercase;
  color: #FFF;
  padding: 12px 15px 8px;
  letter-spacing: 0.14em;
}
.upgrade-button__row-button svg {
  width: 32px;
  height: 32px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 24px;
}
.upgrade-button__row-button:hover {
  color: #35B374;
}
.upgrade-button.shadow-team {
  max-width: 1064px;
}
.upgrade-button.shadow-team .upgrade-button__row-button {
  padding: 12px 8px 8px;
}
.upgrade-button.shadow-team .upgrade-button__row-button svg {
  margin-right: 12px;
}
.upgrade-button.watchlists .upgrade-button__row-button {
  background: #2D3B46;
  padding: 10px;
  margin-top: 4px;
}
.upgrade-button.watchlists .upgrade-button__row-button svg {
  margin-right: 4px;
}
.upgrade-button.players {
  margin: 48px 0;
}

.upgrade-message-user {
  font-size: 16px;
  line-height: 22px;
  margin: 24px 0;
  opacity: 0.8;
}

.upgrade-button-big {
  margin: 35px 35px 0;
  display: flex;
  align-items: center;
}
.upgrade-button-big .demo-message {
  margin-left: 65px;
}
.upgrade-button-big__row-button {
  width: 163px;
  height: 172px;
  display: flex;
  justify-content: space-around;
  flex-direction: column;
  margin: 8px 8px 0 0;
  padding: 16px;
  font-size: 16px;
  line-height: 22px;
  text-transform: uppercase;
  font-weight: bold;
  color: #FFF;
  letter-spacing: 0.14em;
  text-align: center;
  background-color: #2D3B46;
  border: 1px solid #2D3B46;
  border-radius: 6px;
  cursor: pointer;
  background-image: none;
}
.upgrade-button-big__row-button svg {
  display: block;
  margin: 0 auto;
  width: 81px;
  height: 80px;
}
.upgrade-button-big__row-button:hover {
  border: 1px solid #3A4C5A;
}
/* Colors */
/* Fonts */
/* Dimensions */
.add-player-fade {
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  position: fixed;
  z-index: 1000;
}

.add-player-pane {
  z-index: 1001;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  width: 25%;
  min-width: 280px;
  display: flex;
  flex-direction: column;
  background: #273A45;
  box-shadow: 0 2px 16px 1px rgba(0, 0, 0, 0.1);
  height: 100%;
}
.add-player-pane .header {
  flex-grow: 0;
  flex-shrink: 0;
  background: #2b3f4c;
}
.add-player-pane .header h4 {
  font-size: 18px;
  line-height: 24px;
  /*text-transform: uppercase;*/
  font-weight: bold;
  padding: 25px 20px 0;
  white-space: nowrap;
}
.add-player-pane .header .limit {
  font-size: 14px;
  line-height: 18px;
  padding: 2px 20px;
  opacity: 0.5;
}
.add-player-pane .header .limit.error {
  color: #d33a61;
  opacity: 1;
}
.add-player-pane .header input {
  padding: 18px 0px 10px;
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  border-bottom: 1px solid #101a20;
}
.add-player-pane .add-new-player {
  padding: 0 20px;
  margin-top: 35px;
}
.add-player-pane .players-list {
  flex-grow: 1;
  height: calc(100% - 122px);
}
.add-player-pane .players-list ul li {
  border-top: 1px solid #294254;
  height: 40px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  user-select: none;
}
.add-player-pane .players-list ul li:hover {
  background: #1e2c35;
}
.add-player-pane .players-list ul li > span {
  width: 100%;
  height: 40px;
  padding: 7px 20px;
  display: inline-block;
}
.add-player-pane .players-list ul li .team-image {
  width: 17px;
  height: 22px;
  position: relative;
  top: -2px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 6px;
  background-size: contain;
}
.add-player-pane .players-list .no-results {
  opacity: 0.4;
  padding: 10px 20px;
}
.add-player-pane .custom-player-indicator {
  display: inline-block;
  padding: 2px 5px;
  font-size: 9px;
  line-height: 11px;
  vertical-align: super;
  text-transform: uppercase;
  background: #188538;
  color: #FFF;
  border-radius: 2px;
  margin-left: 4px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.shadow-team__player-information {
  position: relative;
  padding: 10px 2px 10px 53px;
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 700;
  width: 230px;
}
.shadow-team__player-information.add {
  position: absolute;
  top: 0;
  background: #2A333A;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.35);
}
.shadow-team__player-information.add.left {
  right: 100%;
  margin-right: 3px;
}
.shadow-team__player-information.add.right {
  left: 100%;
  margin-left: 3px;
}
.shadow-team__player-information .player__image {
  position: absolute;
  top: 10px;
  left: 10px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 33px;
  height: 42px;
  border-radius: 3px;
}
.shadow-team__player-information b {
  /*text-transform: uppercase;*/
  font-weight: 300;
  letter-spacing: 0.2px;
}
.shadow-team__player-information .player__name {
  line-height: 17px;
  margin-bottom: 5px;
  font-size: 15px;
  font-weight: bold;
  margin-right: 5px;
  word-wrap: break-word; /* IE 5.5-7 */
  white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */
  white-space: pre-wrap; /* current browsers */
}
.shadow-team__player-information .small {
  font-weight: normal;
  font-size: 14px;
  line-height: 18px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.suggestions-table {
  border: none;
}
@media screen and (max-width: 959px) {
  .suggestions-table {
    font-size: 13px;
    line-height: 19px;
  }
}
.suggestions-table .tr {
  display: flex;
}
.suggestions-table .heading .tr {
  padding: 0 10px;
}
.suggestions-table .th, .suggestions-table .td {
  padding: 0 8px;
}
.suggestions-table .suggestion__player {
  align-items: center;
  background: #2D3B46;
  padding: 10px;
  margin-top: 5px;
  font-size: 16px;
  line-height: 22px;
  display: flex;
  position: relative;
  color: #CCC;
}
.suggestions-table .col-name__player {
  position: relative;
  display: block;
  padding-left: 48px;
}
.suggestions-table .col-name__player .player-image {
  display: block;
  width: 32px;
  height: 32px;
  border-radius: 16px;
  position: absolute;
  left: 8px;
  top: 50%;
  margin-top: -16px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-color: #e0e8ed;
}
.suggestions-table .col-name__player .last-name {
  font-weight: bold;
  display: block;
}
.suggestions-table .th {
  font-size: 12px;
  line-height: 16px;
  color: #CCC;
  text-transform: uppercase;
}
.suggestions-table .team {
  position: relative;
  display: block;
  padding-left: 24px;
}
.suggestions-table .team .team-image {
  display: block;
  width: 16px;
  height: 16px;
  position: absolute;
  left: 4px;
  top: 50%;
  margin-top: -8px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
.suggestions-table .add-to-favorites {
  position: relative;
  top: -1px;
}
.suggestions-table .favorite-selector {
  cursor: pointer;
  line-height: 25px;
}
.suggestions-table .favorite-selector svg {
  width: 21px;
  height: 21px;
  display: inline-block;
  position: relative;
  top: -2px;
  vertical-align: middle;
}
.suggestions-table .favorite-selector .chevron-down {
  vertical-align: middle;
  width: 15px;
  height: 15px;
  position: relative;
  fill: #FFF !important;
  stroke: none !important;
  top: -1px;
}
.suggestions-table .col-name {
  width: calc(50% - 255px);
}
@media screen and (max-width: 1025px) {
  .suggestions-table .col-name {
    width: calc(50% - 135px);
  }
}
.suggestions-table .col-team {
  width: calc(50% - 255px);
}
@media screen and (max-width: 1025px) {
  .suggestions-table .col-team {
    width: calc(50% - 135px);
  }
}
.suggestions-table .col-checkbox {
  width: 40px;
}
.suggestions-table .col-position {
  width: 34px;
}
.suggestions-table .col-age {
  width: 40px;
}
.suggestions-table .col-date {
  width: 120px;
}
@media screen and (max-width: 1025px) {
  .suggestions-table .col-date {
    display: none;
  }
}
.suggestions-table .col-category {
  width: 155px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.watchlist__suggestions {
  margin-top: 96px;
}
.watchlist__suggestions h2 {
  font-size: 16px;
  font-weight: 700;
  line-height: 20px;
  margin: 0 0 20px;
}
.watchlist .show-more {
  width: 100%;
  border: none;
  background: none;
  color: #2DC46E;
  text-align: center;
  padding: 15px 0;
}
.watchlist .show-more:hover {
  color: #FFF;
}
.watchlist .add-selected {
  float: right;
  margin-top: 20px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.player-table-menu {
  position: relative;
  width: 24px;
  z-index: 2;
}
.player-table-menu.active {
  z-index: 3;
}
.player-table-menu__button {
  background: none;
  border: none;
  width: 24px;
  height: 24px;
  padding: 0;
  border-radius: 4px;
  position: relative;
}
.player-table-menu__button:before, .player-table-menu__button:after {
  content: "";
}
.player-table-menu__button i, .player-table-menu__button:before, .player-table-menu__button:after {
  position: absolute;
  display: block;
  width: 4px;
  height: 4px;
  border-radius: 100%;
  background: #2DC46E;
  top: 10px;
}
.player-table-menu__button i {
  left: 10px;
}
.player-table-menu__button:before {
  left: 4px;
}
.player-table-menu__button:after {
  left: 16px;
}
.player-table-menu__button:hover, .player-table-menu__button.active {
  background: #2DC46E;
}
.player-table-menu__button:hover i, .player-table-menu__button:hover:before, .player-table-menu__button:hover:after, .player-table-menu__button.active i, .player-table-menu__button.active:before, .player-table-menu__button.active:after {
  background: #FFF;
}
.player-table-menu__list-wrapper {
  position: absolute;
  right: 0;
  top: 24px;
  min-width: 180px;
  padding-top: 8px;
}
.player-table-menu__list {
  background: #FFF;
  border-radius: 4px;
  border: 1px solid #A4A6A4;
  color: #2D3B46;
  white-space: nowrap;
}
.player-table-menu__list li {
  white-space: nowrap;
  padding: 6px 8px;
}
.player-table-menu__list li .icon-container {
  width: 18px;
  height: 18px;
  line-height: 18px;
  vertical-align: middle;
  margin-right: 4px;
  position: relative;
  display: inline-block;
  text-align: center;
  top: -2px;
}
.player-table-menu__list li svg {
  width: 18px;
  height: 18px;
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
.player-table-menu__list li svg.close-icon {
  width: 10px;
  height: 10px;
}
.player-table-menu__list li:nth-child(1) {
  border-radius: 4px 4px 0 0;
}
.player-table-menu__list li:nth-last-child(1) {
  border-radius: 0 0 4px 4px;
}
.player-table-menu__list li:hover {
  background: #e4fff1;
  cursor: pointer;
}
/* Colors */
/* Fonts */
/* Dimensions */
.create-note-form {
  max-width: 582px;
  min-width: 320px;
  margin: 0 auto;
  background: #2E3C47;
  padding: 24px;
  box-sizing: border-box;
  flex-grow: 1;
  position: relative;
}
.create-note-form h1 {
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0 0 20px;
}
.create-note-form h1 .title-icon {
  display: inline-block;
  margin-right: 4px;
  vertical-align: middle;
  width: 16px;
  height: 16px;
}
.create-note-form .input {
  margin-top: 20px;
}
.create-note-form .input label {
  color: #A4A6A4;
  text-transform: uppercase;
}
.create-note-form .input input {
  color: #2DC46E;
}
.create-note-form .input input:focus {
  color: #FFF;
}
.create-note-form .input textarea {
  width: 100%;
  color: #A4A6A4;
  min-height: 100px;
  background: transparent;
  border: none;
}
.create-note-form .input textarea:focus {
  color: #FFF;
}
.create-note-form .close-icon {
  position: absolute;
  width: 10px;
  height: 10px;
  right: 25px;
  top: 25px;
  color: #FFF;
  cursor: pointer;
}
.create-note-form .close-icon:hover {
  color: #2DC46E;
}
.create-note-form button {
  margin-top: 20px;
}
.create-note-form__wrapper {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: fixed;
  background: rgba(0, 0, 0, 0.65);
  display: flex;
  align-content: center;
  align-items: center;
  z-index: 999999;
}
/* Colors */
/* Fonts */
/* Dimensions */
.watchlist__content {
  display: flex;
  padding: 30px 0 0;
}
.watchlist__heading-top {
  display: flex;
  align-content: center;
}
.watchlist__heading {
  padding-left: 96px;
  position: relative;
  margin-bottom: 40px;
}
.watchlist__heading .watchlist-icon {
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -40px;
}
.watchlist__heading h2 {
  font-size: 28px;
  font-style: normal;
  font-weight: 700;
  line-height: 34px;
}
.watchlist__heading .edit {
  line-height: 41px;
  margin-left: 38px;
  font-size: 13px;
  text-transform: uppercase;
  color: #2DC46E;
  cursor: pointer;
}
.watchlist__heading .edit:hover {
  color: #FFF;
}
.watchlist__heading .edit .edit-icon {
  width: 16px;
  height: 16px;
  display: inline-block;
  margin-right: 4px;
}
.watchlist__heading .add-new-player {
  position: relative;
  margin-left: auto;
}
.watchlist__heading .add-new-player .create-icon {
  width: 11px;
  height: 15px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -1px;
  margin-right: 6px;
}
.watchlist__description {
  font-size: 16px;
  line-height: 22px;
  margin: 0 0 20px;
  max-width: 320px;
}
.watchlist .empty-message {
  color: #CCC;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  text-align: center;
  margin: 96px 0;
  width: 100%;
}
/* Colors */
/* Fonts */
/* Dimensions */
.favorites-list__wrapper {
  margin-top: 50px;
  position: relative;
}
.favorites-list__wrapper h2 {
  font-size: 19px;
  font-weight: bold;
  margin: 0 0 0px;
}
.favorites-list__wrapper .favorites-list {
  margin: 0;
  min-width: 740px;
}
.favorites-list__wrapper .favorites-list th, .favorites-list__wrapper .favorites-list td {
  text-overflow: ellipsis;
  vertical-align: middle;
}
@media screen and (max-width: 1024px) {
  .favorites-list__wrapper .favorites-list th, .favorites-list__wrapper .favorites-list td {
    font-size: 13px;
  }
  .favorites-list__wrapper .favorites-list th .favorite-player-name, .favorites-list__wrapper .favorites-list td .favorite-player-name {
    font-size: 14px;
  }
}
.favorites-list__wrapper .favorites-list .col__last-name {
  position: relative;
  padding-right: 10px !important;
}
.favorites-list__wrapper .favorites-list .col__position-name {
  width: 90px;
}
.favorites-list__wrapper .favorites-list .col__fav {
  width: 40px;
}
.favorites-list__wrapper .favorites-list .col__rating {
  width: 145px;
}
.favorites-list__wrapper .favorites-list .col__birth-date {
  width: 40px;
}
.favorites-list__wrapper .favorites-list .col__join-date {
  width: 95px;
}
@media (max-width: 1024px) {
  .favorites-list__wrapper .favorites-list .col__join-date {
    display: none;
  }
}
.favorites-list__wrapper .favorites-list .col__contract {
  width: 90px;
}
.favorites-list__wrapper .favorites-list .col__final-rating {
  width: 55px;
}
.favorites-list__wrapper .favorites-list .col__country {
  width: 90px;
}
.favorites-list__wrapper .favorites-list .col__menu {
  width: 40px;
  position: relative;
}
.favorites-list__wrapper .favorites-list .add-to-favorites {
  position: relative;
  top: -1px;
}
.favorites-list__wrapper .favorites-list .favorite-selector {
  cursor: pointer;
  line-height: 25px;
}
.favorites-list__wrapper .favorites-list .favorite-selector svg {
  width: 21px;
  height: 21px;
  display: inline-block;
  position: relative;
  top: -2px;
  vertical-align: middle;
}
.favorites-list__wrapper .favorites-list .favorite-selector .chevron-down {
  vertical-align: middle;
  width: 15px;
  height: 15px;
  position: relative;
  fill: #FFF !important;
  stroke: none !important;
  top: -1px;
}
.favorites-list__wrapper .fav-td {
  width: 44px;
}
.favorites-list__wrapper .fav-td .favorite-change {
  opacity: 0.7;
}
.players-infinite-loader {
  display: flex;
  flex-direction: column;
}
.players-infinite-loader .players-infinite-loader__body {
  flex: auto;
}
.players-infinite-loader .favorites-list {
  max-width: 1064px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.favorites-filter {
  display: inline-block;
}
.favorites-filter .btn {
  position: relative;
  height: 44px;
  line-height: 42px;
}
.favorites-filter .btn.btn--filter {
  width: 44px;
  padding: 0;
  box-sizing: border-box;
  text-align: center;
}
.favorites-filter .btn.btn--filter svg {
  width: 14px;
  height: 42px;
  stroke: currentColor;
  fill: none;
}
.favorites-filter .btn.btn--filter .btn--filter__num {
  text-align: center;
  position: absolute;
  display: block;
  right: -11px;
  bottom: -11px;
  border-radius: 11px;
  background: #d33a61;
  color: #FFF;
  font-size: 12px;
  line-height: 22px;
  width: 22px;
  height: 22px;
}
.favorites-filter .btn.btn--filter.active {
  color: #FFF;
  background: #35B374;
}
.player-search {
  position: relative;
}
.player-search input {
  width: 100%;
  background: rgba(0, 0, 0, 0.15);
  border-radius: 6px;
  border: none;
  padding: 6px 15px 6px 46px;
  height: 44px;
  line-height: 32px;
}
.player-search svg {
  width: 16px;
  height: 16px;
  position: absolute;
  left: 15px;
  top: 50%;
  margin-top: -8px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.favorites-list__wrapper {
  margin-top: 50px;
  position: relative;
}
.favorites-list__wrapper h2 {
  font-size: 19px;
  font-weight: bold;
  margin: 0 0 0px;
}
.favorites-list__wrapper .favorites-list {
  margin: 0;
  min-width: 740px;
}
.favorites-list__wrapper .favorites-list th, .favorites-list__wrapper .favorites-list td {
  text-overflow: ellipsis;
  vertical-align: middle;
}
.favorites-list__wrapper .favorites-list.entries-list th .entry-player-name, .favorites-list__wrapper .favorites-list.entries-list td .entry-player-name {
  padding-left: 20px;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__sort, .favorites-list__wrapper .favorites-list.entries-list td.col__sort {
  width: 45px;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__fav, .favorites-list__wrapper .favorites-list.entries-list td.col__fav {
  width: 40px;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__rating, .favorites-list__wrapper .favorites-list.entries-list td.col__rating {
  width: 145px;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__birth-date, .favorites-list__wrapper .favorites-list.entries-list td.col__birth-date {
  width: 40px;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__notes, .favorites-list__wrapper .favorites-list.entries-list td.col__notes {
  width: 95px;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__evaluations, .favorites-list__wrapper .favorites-list.entries-list td.col__evaluations {
  width: 95px;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__country, .favorites-list__wrapper .favorites-list.entries-list td.col__country {
  width: 90px;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__delete, .favorites-list__wrapper .favorites-list.entries-list td.col__delete {
  width: 40px;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__delete svg, .favorites-list__wrapper .favorites-list.entries-list td.col__delete svg {
  width: 20px;
  height: 20px;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__delete .delete-entry, .favorites-list__wrapper .favorites-list.entries-list td.col__delete .delete-entry {
  cursor: pointer;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__delete .delete-entry svg, .favorites-list__wrapper .favorites-list.entries-list td.col__delete .delete-entry svg {
  stroke: #35B374;
  fill: none;
}
.favorites-list__wrapper .favorites-list.entries-list th.col__delete .delete-entry:hover svg, .favorites-list__wrapper .favorites-list.entries-list td.col__delete .delete-entry:hover svg {
  stroke: #FFF;
  fill: none;
}
.favorites-list__wrapper .favorites-list .next-page .js-link {
  display: block;
  width: 100%;
  height: 52px;
  line-height: 52px;
  color: #2DC46E;
  text-align: center;
  cursor: pointer;
}
.favorites-list__wrapper .favorites-list .next-page .js-link:hover {
  color: #188538;
}
@media screen and (max-width: 1024px) {
  .favorites-list__wrapper .favorites-list th, .favorites-list__wrapper .favorites-list td {
    font-size: 13px;
  }
}
.favorites-list__wrapper .favorites-list .add-to-favorites {
  position: relative;
  top: -1px;
}
.favorites-list__wrapper .favorites-list .favorite-selector {
  cursor: pointer;
  line-height: 25px;
}
.favorites-list__wrapper .favorites-list .favorite-selector svg {
  width: 21px;
  height: 21px;
  display: inline-block;
  position: relative;
  top: -2px;
  vertical-align: middle;
}
.favorites-list__wrapper .favorites-list .favorite-selector .chevron-down {
  vertical-align: middle;
  width: 15px;
  height: 15px;
  position: relative;
  fill: #FFF !important;
  stroke: none !important;
  top: -1px;
}
.favorites-list__wrapper .fav-td {
  width: 44px;
}
.favorites-list__wrapper .fav-td .favorite-change {
  opacity: 0.7;
}
/* Colors */
/* Fonts */
/* Dimensions */
.favorites-list__wrapper .recent-list {
  min-width: 950px;
}
@media screen and (max-width: 959px) {
  .favorites-list__wrapper .recent-list {
    min-width: 900px;
  }
}
.favorites-list__wrapper .recent-list th, .favorites-list__wrapper .recent-list td {
  padding-top: 12px !important;
  padding-bottom: 15px !important;
}
.favorites-list__wrapper .recent-list th .recent-player-name, .favorites-list__wrapper .recent-list td .recent-player-name {
  padding-left: 46px;
  position: relative;
  min-height: 38px;
  font-size: 16px;
  line-height: 19px;
}
.favorites-list__wrapper .recent-list th .recent-player-name .favorite-player-name_last, .favorites-list__wrapper .recent-list td .recent-player-name .favorite-player-name_last {
  display: block;
  font-weight: bold;
}
.favorites-list__wrapper .recent-list th .player-image, .favorites-list__wrapper .recent-list td .player-image {
  width: 36px;
  height: 44px;
  margin-top: -23px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  top: 50%;
  left: 0;
}
@media (max-width: 959px) {
  .favorites-list__wrapper .recent-list th .player-image, .favorites-list__wrapper .recent-list td .player-image {
    width: 24px;
    height: 28px;
    margin-top: -15px;
  }
}
.favorites-list__wrapper .recent-list th.col__last-name, .favorites-list__wrapper .recent-list td.col__last-name {
  padding-left: 16px !important;
}
.favorites-list__wrapper .recent-list th.col__updated-at, .favorites-list__wrapper .recent-list td.col__updated-at {
  width: 110px;
}
@media screen and (max-width: 959px) {
  .favorites-list__wrapper .recent-list th.col__updated-at, .favorites-list__wrapper .recent-list td.col__updated-at {
    width: 80px;
  }
}
.favorites-list__wrapper .recent-list th.col__sort, .favorites-list__wrapper .recent-list td.col__sort {
  width: 45px;
}
.favorites-list__wrapper .recent-list th.col__fav, .favorites-list__wrapper .recent-list td.col__fav {
  width: 40px;
}
.favorites-list__wrapper .recent-list th.col__rating, .favorites-list__wrapper .recent-list td.col__rating {
  width: 145px;
}
.favorites-list__wrapper .recent-list th.col__birth-date, .favorites-list__wrapper .recent-list td.col__birth-date {
  width: 40px;
}
.favorites-list__wrapper .recent-list th.col__notes, .favorites-list__wrapper .recent-list td.col__notes {
  width: 95px;
}
.favorites-list__wrapper .recent-list th.col__evaluations, .favorites-list__wrapper .recent-list td.col__evaluations {
  width: 95px;
}
.favorites-list__wrapper .recent-list th.col__country, .favorites-list__wrapper .recent-list td.col__country {
  width: 90px;
}
.favorites-list__wrapper .recent-list th {
  cursor: default !important;
}
.favorites-list__wrapper .recent-list th:hover {
  opacity: 0.6 !important;
}
/* Colors */
/* Fonts */
/* Dimensions */
.settings .section-nav, .help .section-nav, .favorite .section-nav {
  font-weight: 500;
  font-size: 16px;
  margin: 0 0 35px;
  text-transform: uppercase;
  letter-spacing: 1px;
  background: #1B262E;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1;
  box-shadow: 0 5px 12px -2px rgba(0, 0, 0, 0.6);
}
@media (max-width: 959px) {
  .settings .section-nav, .help .section-nav, .favorite .section-nav {
    font-size: 12px;
    margin: 0 0 -8px;
  }
}
.settings .section-nav .container, .help .section-nav .container, .favorite .section-nav .container {
  padding-top: 25px;
  padding-bottom: 0;
  display: flex;
}
@media (max-width: 959px) {
  .settings .section-nav .container, .help .section-nav .container, .favorite .section-nav .container {
    padding-top: 25px;
  }
}
.settings .section-nav a, .help .section-nav a, .favorite .section-nav a {
  color: rgba(255, 255, 255, 0.75);
  border-bottom: 2px solid transparent;
}
.settings .section-nav a:hover, .help .section-nav a:hover, .favorite .section-nav a:hover {
  color: #fff;
}
.settings .section-nav span, .help .section-nav span, .favorite .section-nav span {
  border-bottom: 2px solid rgba(255, 255, 255, 0.9);
  color: #fff;
  font-weight: 600;
}
.settings .section-nav span.locked, .help .section-nav span.locked, .favorite .section-nav span.locked {
  color: rgba(255, 255, 255, 0.45);
  font-weight: normal;
  border-bottom: 2px solid transparent;
  cursor: default;
}
.settings .section-nav span.locked svg, .help .section-nav span.locked svg, .favorite .section-nav span.locked svg {
  width: 14px;
  height: 14px;
  vertical-align: middle;
  margin-right: 4px;
}
.settings .section-nav span, .settings .section-nav a, .help .section-nav span, .help .section-nav a, .favorite .section-nav span, .favorite .section-nav a {
  display: inline-block;
  width: 50%;
  padding: 10px 15px 20px;
  text-align: center;
  margin-bottom: -1px;
}
@media (max-width: 959px) {
  .settings .section-nav span, .settings .section-nav a, .help .section-nav span, .help .section-nav a, .favorite .section-nav span, .favorite .section-nav a {
    padding: 5px 8px;
  }
}

.favorite .section-nav {
  font-size: 14px;
  position: relative;
}
.favorite .section-nav .container {
  padding-top: 0;
}
.favorite .section-nav span, .favorite .section-nav a {
  flex-grow: 0;
  flex-shrink: 0;
  width: auto;
  padding: 16px 0;
  margin-right: 25px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.favorite-summary .content-block:after {
  content: "";
  display: table;
  clear: both;
}

.favorite-summary .content-block {
  background: #293B47;
  box-sizing: border-box;
  border-radius: 5px;
  box-shadow: 0 2px 16px 1px rgba(0, 0, 0, 0.1);
  padding: 24px 0;
  margin-top: 25px;
}
.favorite-summary .player-information {
  position: relative;
  z-index: 3;
}
.favorite-summary .player-information__scouting-level {
  margin-top: 25px;
}
.favorite-summary .player-information__scouting-level h4 {
  cursor: pointer;
}
.favorite-summary .player-information__scouting-level h4:hover {
  color: #35B374;
}
.favorite-summary .player-information__scouting-level svg {
  fill: none;
  stroke: currentColor;
  width: 16px;
  height: 16px;
  display: inline-block;
  margin-left: 6px;
  vertical-align: middle;
  position: relative;
  top: -2px;
}
.favorite-summary .player-information__scouting-level p {
  margin: 0;
  font-size: 18px;
  line-height: 24px;
  font-weight: bold;
}
@media screen and (min-width: 1279px) {
  .favorite-summary .player-information {
    display: flex;
  }
}
.favorite-summary .player-information__league-stats {
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  padding: 20px 25px;
}
@media (max-width: 959px) {
  .favorite-summary .player-information__league-stats {
    padding: 20px;
  }
}
.favorite-summary .player-information__league-stats .leagues-locked-message {
  font-size: 18px;
  line-height: 24px;
  text-transform: uppercase;
  text-align: center;
  color: rgba(255, 255, 255, 0.45);
}
.favorite-summary .player-information__league-stats .leagues-locked-message svg {
  width: 18px;
  height: 18px;
  margin-right: 4px;
  vertical-align: middle;
}
.favorite-summary .player-information__league-stats .leagues-table {
  border: none;
}
.favorite-summary .player-information__league-stats .leagues-table svg {
  width: 16px;
  height: 16px;
  stroke: rgba(255, 255, 255, 0.7);
}
.favorite-summary .player-information__league-stats .leagues-table svg.no-stroke {
  stroke: none;
}
@media (max-width: 959px) {
  .favorite-summary .player-information__league-stats .leagues-table {
    margin: 0;
  }
}
.favorite-summary .player-information__league-stats .leagues-table th {
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
  font-size: 13px;
  line-height: 19px;
  border: none;
}
@media (max-width: 959px) {
  .favorite-summary .player-information__league-stats .leagues-table th {
    font-size: 12px;
    line-height: 16px;
  }
}
.favorite-summary .player-information__league-stats .leagues-table td {
  border: none;
}
@media (max-width: 959px) {
  .favorite-summary .player-information__league-stats .leagues-table td {
    font-size: 12px;
    line-height: 16px;
  }
  .favorite-summary .player-information__league-stats .leagues-table td:nth-child(1) {
    white-space: nowrap;
  }
}
.favorite-summary .player-information__league-stats .leagues-table td.pagination-link {
  text-align: center;
}
.favorite-summary .player-information__league-stats .leagues-table td.pagination-link span {
  color: #2DC46E;
  cursor: pointer;
}
.favorite-summary .player-information__league-stats .leagues-table .data-item__image {
  position: relative;
  top: -2px;
  display: inline-block;
  width: 22px;
  height: 22px;
  background-position: center center;
  background-size: contain;
  vertical-align: middle;
  margin-right: 4px;
  background-repeat: no-repeat;
}
@media (max-width: 959px) {
  .favorite-summary .player-information__league-stats .leagues-table .data-item__image {
    width: 16px;
    height: 16px;
  }
}
.favorite-summary .player-information__main, .favorite-summary .player-information__team, .favorite-summary .player-information__rating {
  width: 100%;
  display: block;
  padding: 0 24px;
}
@media screen and (min-width: 1279px) {
  .favorite-summary .player-information__main, .favorite-summary .player-information__team, .favorite-summary .player-information__rating {
    flex-grow: 0;
    width: 33.3%;
  }
}
.favorite-summary .player-information__main h4, .favorite-summary .player-information__team h4, .favorite-summary .player-information__rating h4 {
  font-size: 18px;
  line-height: 36px;
  color: #FFF;
}
.favorite-summary .player-information__team, .favorite-summary .player-information__rating {
  margin-top: 45px;
}
@media screen and (min-width: 1279px) {
  .favorite-summary .player-information__team, .favorite-summary .player-information__rating {
    margin-top: 0;
    border-left: 1px solid rgba(53, 76, 92, 0.5);
  }
}
.favorite-summary .player-information__team .team-row {
  position: relative;
  z-index: 7;
}
.favorite-summary .player-information__team .team-row .data-item-changeable {
  width: 90%;
}
.favorite-summary .player-information__rating .final-rating {
  max-width: 300px;
}
.favorite-summary .player-information__rating .final-rating .final-rating-number {
  display: block;
  font-size: 16px;
  line-height: 120%;
  opacity: 0.7;
  font-weight: 400;
  margin-left: 25px;
}
.favorite-summary .player-information__rating .final-rating .final-rating-description .rating-rate {
  font-size: 32px;
  line-height: 110%;
  margin-bottom: 5px;
  display: block;
}
.favorite-summary .player-information__rating .final-rating .final-rating-description .rating-rate .legend {
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: middle;
  border-radius: 50%;
  margin-right: 3px;
}
@media screen and (min-width: 1279px) {
  .favorite-summary .player-information__rating .final-rating {
    margin-top: 15px;
  }
}
.favorite-summary .player-information__external {
  margin-top: 0;
}
.favorite-summary .player-information__external h3 {
  margin: 0 0 16px;
  font-size: 18px;
  line-height: 22px;
}
.favorite-summary .player-information__external a {
  width: 24px;
  height: 24px;
  display: inline-block;
  margin-right: 12px;
}
.favorite-summary .player-information__external svg {
  width: 24px;
  height: 24px;
}
.favorite-summary .player-information__column, .favorite-summary .player-information__indicators, .favorite-summary .player-information__reports {
  width: 100%;
  display: block;
  padding-left: 24px;
  padding-right: 24px;
}
@media screen and (min-width: 1279px) {
  .favorite-summary .player-information__column, .favorite-summary .player-information__indicators, .favorite-summary .player-information__reports {
    width: calc(33.3% - 10px);
    margin-left: 16px;
    margin-top: 16px;
    padding-left: 24px;
    padding-right: 24px;
  }
  .favorite-summary .player-information__column:nth-child(1), .favorite-summary .player-information__indicators:nth-child(1), .favorite-summary .player-information__reports:nth-child(1) {
    margin-left: 0;
  }
}
.favorite-summary .player-information__column {
  padding: 0 !important;
}
.favorite-summary .player-information__stats, .favorite-summary .player-information__external {
  padding-left: 24px;
  padding-right: 24px;
}
@media screen and (min-width: 1279px) {
  .favorite-summary .player-information__stats, .favorite-summary .player-information__external {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.favorite-summary .player-information__indicators {
  padding-left: 0;
  padding-right: 0;
  margin-top: 25px;
}
@media screen and (min-width: 1279px) {
  .favorite-summary .player-information__indicators {
    padding-left: 0;
    padding-right: 0;
    margin-top: 16px;
  }
}
.favorite-summary .player-information__reports {
  padding-left: 0;
  padding-right: 0;
}
.favorite-summary .player-information__reports .content-block {
  padding-left: 24px;
  padding-right: 24px;
}
@media screen and (min-width: 1279px) {
  .favorite-summary .player-information__reports {
    padding-left: 0;
    padding-right: 0;
  }
  .favorite-summary .player-information__reports .content-block {
    padding-left: 24px;
    padding-right: 24px;
  }
  .favorite-summary .player-information__reports .content-block:nth-child(1) {
    margin-top: 0;
  }
}
.favorite-summary .aside .content-block {
  margin-top: 12px;
}
.favorite-summary .aside .content-block:nth-child(1) {
  margin-top: 0;
}
.favorite-summary .add-to-favorites {
  position: relative;
  top: -1px;
}
.favorite-summary .add-to-favorites ul.list {
  right: auto;
  left: 0;
}
.favorite-summary .favorite-selector {
  cursor: pointer;
  font-size: 30px;
  line-height: 30px;
}
.favorite-summary .favorite-selector svg {
  width: 30px;
  height: 30px;
  display: inline-block;
  position: relative;
  top: -2px;
  vertical-align: middle;
  margin-right: 5px;
}
.favorite-summary .favorite-selector .chevron-down {
  vertical-align: middle;
  width: 20px;
  height: 20px;
  position: relative;
  fill: #FFF !important;
  stroke: none !important;
  top: -1px;
  margin-right: 0;
}
.favorite-summary .custom-player-controls .btn {
  margin-left: 25px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.data-item-icon {
  display: flex;
}
.data-item-icon__icon {
  width: 22px;
  height: 22px;
  position: relative;
  top: 10px;
}
.data-item-icon__icon svg {
  width: 100%;
  height: 100%;
}
.data-item-icon__column {
  margin-left: 11px;
  width: 60px;
}
.data-item-icon__value {
  color: #FFF;
  font-size: 16px;
  line-height: 22px;
}
.data-item-icon__value .data-item__image {
  position: relative;
  top: -2px;
  display: inline-block;
  width: 16px;
  height: 16px;
  background-position: center center;
  background-size: contain;
  vertical-align: middle;
  margin-right: 4px;
  background-repeat: no-repeat;
}
.data-item-icon__label {
  font-size: 13px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  line-height: 18px;
  color: rgba(255, 255, 255, 0.7);
}
/* Colors */
/* Fonts */
/* Dimensions */
.favorite-stats__nav {
  display: flex;
  background: #293B47;
  padding: 0 24px;
}
.favorite-stats__nav-tab {
  display: block;
  flex-grow: 1;
  flex-shrink: 1;
  cursor: pointer;
  padding: 16px 20px;
  font-size: 16px;
  line-height: 24px;
  border-bottom: 2px solid #3A4C5A;
}
.favorite-stats__nav-tab.active {
  background: #293B47;
  border-radius: 5px 5px 0 0;
  border-bottom: 2px solid #FFF;
}
.favorite-stats__body {
  background: #293B47;
  padding: 24px;
  border-radius: 0 0 5px 5px;
  box-shadow: 0 2px 16px 1px rgba(0, 0, 0, 0.1);
  position: relative;
  z-index: 2;
}
.favorite-stats__body.first-active {
  border-radius: 0 5px 5px 5px;
}
.favorite-stats__body.last-active {
  border-radius: 5px 0 5px 5px;
}
.favorite-stats__body .empty-message {
  font-size: 16px;
  color: rgba(255, 255, 255, 0.4);
}
.favorite-stats__chart-section {
  margin-top: 25px;
  table-layout: fixed;
}
.favorite-stats__chart-section:nth-child(1) {
  margin-top: 0;
}
.favorite-stats__chart-section th, .favorite-stats__chart-section td {
  padding: 0;
}
.favorite-stats__chart-section th, .favorite-stats__chart-section td {
  border: none;
}
.favorite-stats__chart-section th {
  border-bottom: 1px solid #263540;
  padding-bottom: 5px;
}
.favorite-stats__chart-section td {
  padding: 5px 0;
  position: relative;
}
.favorite-stats__chart-section .label {
  font-size: 14px;
  text-align: center;
}
.favorite-stats__chart-section .group-name {
  font-size: 16px;
  line-height: 22px;
  padding-left: 0;
  width: 130px;
}
.favorite-stats__chart-section .indicator-name {
  font-size: 14px;
  line-height: 15px;
  color: rgba(255, 255, 255, 0.7);
  width: 130px;
  /*white-space:nowrap;*/
}
.favorite-stats__chart-section .indicator-name svg {
  width: 14px;
  height: 14px;
  margin-right: 4px;
  position: relative;
  top: 2px;
}
.favorite-stats__chart-section .line {
  width: 1px;
  background: #22313b;
  display: block;
  position: absolute;
  left: 10%;
  top: 0;
  bottom: 0;
}
.favorite-stats__chart-section .line:nth-child(2) {
  left: 30%;
}
.favorite-stats__chart-section .line:nth-child(3) {
  left: 50%;
}
.favorite-stats__chart-section .line:nth-child(4) {
  left: 70%;
}
.favorite-stats__chart-section .line:nth-child(5) {
  left: 90%;
}
.favorite-stats__chart-section .val-indicator {
  width: 15px;
  height: 15px;
  display: block;
  position: absolute;
  top: 50%;
  margin-top: -7px;
  left: 30%;
  background: #6CB5D7;
  margin-left: -7px;
  border-radius: 50%;
}
.final-rating-overtime__heading {
  font-size: 18px;
  line-height: 26px;
}
.final-rating-overtime__heading label {
  font-weight: 500;
  text-transform: uppercase;
  display: block;
  font-size: 12px;
  letter-spacing: 0.5px;
  line-height: 18px;
  color: rgba(255, 255, 255, 0.7);
}
.final-rating-overtime__body {
  margin-top: 25px;
}
.final-rating-overtime__body label {
  font-weight: 500;
  text-transform: uppercase;
  display: block;
  font-size: 13px;
  line-height: 18px;
  letter-spacing: 0.5px;
  color: rgba(255, 255, 255, 0.7);
}
.final-rating-overtime__body table {
  margin-top: 5px;
}
.final-rating-overtime__body table tr, .final-rating-overtime__body table td {
  border: none;
  padding: 0;
}
.final-rating-overtime__body table td {
  padding-top: 5px;
  vertical-align: middle;
}
.final-rating-overtime__body table .season-col {
  width: 30px;
  font-size: 13px;
  line-height: 18px;
  color: rgba(255, 255, 255, 0.9);
  padding-right: 10px;
}
.final-rating-overtime__body table .reports-col {
  width: 80px;
  font-size: 13px;
  line-height: 18px;
  padding-left: 10px;
}
.final-rating-overtime__body table .bar {
  display: flex;
  height: 8px;
  border-radius: 4px;
}
.final-rating-overtime__body table .bar .bar-section {
  height: 8px;
  flex-grow: 1;
  flex-shrink: 1;
}
.final-rating-overtime__body table .bar .bar-section:nth-child(1) {
  border-radius: 4px 0 0 4px;
}
.final-rating-overtime__body table .bar .bar-section:nth-last-child(1) {
  border-radius: 0 4px 4px 0;
}
.final-rating-overtime__body table .bar .bar-section.bordered {
  border-left: 1px solid #7FAF7E;
}
.final-rating-overtime__body table .bar .bar-section.single {
  border-radius: 4px;
}
.final-rating-overtime__average {
  margin-top: 25px;
  font-size: 18px;
  line-height: 26px;
}
.final-rating-overtime__average label {
  font-weight: 500;
  text-transform: uppercase;
  display: block;
  font-size: 12px;
  letter-spacing: 0.5px;
  line-height: 18px;
  color: rgba(255, 255, 255, 0.7);
}
.final-rating-overtime__average .color-round {
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  margin-right: 6px;
  vertical-align: middle;
  position: relative;
  top: -1px;
}
.final-rating-overtime__average .description {
  font-size: 13px;
  line-height: 16px;
  text-transform: uppercase;
  color: #A4A6A4;
}
.final-rating-overtime__average-icon {
  margin: 8px 0;
}
.performance-stats-overtime__heading {
  font-size: 18px;
  line-height: 26px;
}
.performance-stats-overtime__heading label {
  font-weight: 500;
  text-transform: uppercase;
  display: block;
  font-size: 12px;
  letter-spacing: 0.5px;
  line-height: 18px;
  color: rgba(255, 255, 255, 0.7);
}
.performance-stats-overtime__body table {
  margin-top: 5px;
}
.performance-stats-overtime__body table tr, .performance-stats-overtime__body table td {
  border: none;
  padding: 0;
}
.performance-stats-overtime__body table td {
  padding-top: 5px;
  vertical-align: middle;
}
.performance-stats-overtime__body table .label {
  width: 80px;
  font-size: 13px;
  letter-spacing: 0.5px;
  line-height: 18px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.9);
  padding-right: 10px;
}
.performance-stats-overtime__body table .value {
  width: 30px;
  font-size: 13px;
  line-height: 18px;
  padding-left: 10px;
}
.performance-stats-overtime__body table .positive .bar .bar-section {
  background-color: #DA4B06;
}
.performance-stats-overtime__body table .neutral .bar .bar-section {
  background-color: #A4A6A4;
}
.performance-stats-overtime__body table .negative .bar .bar-section {
  background-color: #1E619F;
}
.performance-stats-overtime__body table .bar {
  display: flex;
  height: 8px;
  border-radius: 4px;
}
.performance-stats-overtime__body table .bar .bar-section {
  height: 8px;
  /*&.on{
    background: #7FAF7E;
  }
  &.off{
    background: #EFE464;
  }
  &.physis{
    background: #43687A;
  }*/
}
.performance-stats-overtime__body table .bar .bar-section:nth-last-child(1) {
  border-radius: 0 4px 4px 0;
}
.performance-stats-overtime__body table .bar .bar-section:nth-child(1) {
  border-radius: 4px 0 0 4px;
}
.performance-stats-overtime__body table .bar .bar-section:nth-child(1):nth-last-child(1) {
  border-radius: 4px !important;
}
/* Colors */
/* Fonts */
/* Dimensions */
.player-merge-screen {
  z-index: 1001;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  width: 25%;
  min-width: 280px;
  display: flex;
  flex-direction: column;
  background: #273A45;
  box-shadow: 0 2px 16px 1px rgba(0, 0, 0, 0.1);
  height: 100%;
}
.player-merge-screen .header {
  flex-grow: 0;
  flex-shrink: 0;
  background: #2b3f4c;
}
.player-merge-screen .header h4 {
  font-size: 20px;
  line-height: 24px;
  /*text-transform: uppercase;*/
  font-weight: bold;
  padding: 25px 20px 0;
}
.player-merge-screen .header .limit {
  font-size: 14px;
  line-height: 18px;
  padding: 2px 20px;
  opacity: 0.5;
}
.player-merge-screen .header .limit.error {
  color: #d33a61;
  opacity: 1;
}
.player-merge-screen .header input {
  padding: 18px 0px 10px;
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  border-bottom: 1px solid #101a20;
}
.player-merge-screen .add-new-player {
  padding: 0 20px;
  margin-top: 35px;
}
.player-merge-screen .players-list {
  flex-grow: 1;
  height: calc(100% - 122px);
}
.player-merge-screen .players-list ul li {
  border-top: 1px solid #294254;
  height: 40px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  user-select: none;
}
.player-merge-screen .players-list ul li:hover {
  background: #1e2c35;
}
.player-merge-screen .players-list ul li > span {
  width: 100%;
  height: 40px;
  padding: 7px 20px;
  display: inline-block;
}
.player-merge-screen .players-list ul li .team-image {
  width: 17px;
  height: 22px;
  position: relative;
  top: -2px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 6px;
  background-size: contain;
}
.player-merge-screen .players-list .no-results {
  opacity: 0.4;
  padding: 10px 20px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.watchlists__heading {
  font-size: 16px;
  line-height: 22px;
  margin: 0 0 20px;
}
.watchlists__button {
  margin-top: 12px;
}
.watchlists__button .btn {
  width: 100%;
  line-height: 28px;
  padding: 9px 22px;
  height: auto;
  min-height: 46px;
}
.watchlists .watchlist__item {
  display: flex;
  background: #3A4C5A;
  margin: 4px 0 0;
  color: #2DC46E;
  padding: 8px 16px;
  align-items: center;
}
.watchlists .watchlist__item:hover {
  color: #FFF;
}
.watchlists .watchlist__avatar {
  white-space: nowrap;
  width: 32px;
  height: 32px;
  font-size: 12px;
  line-height: 32px;
  text-align: center;
  background: #24323D;
  color: #CCCCCC;
  border-radius: 16px;
  flex-shrink: 0;
}
.watchlists .watchlist__name {
  flex-grow: 1;
  margin-left: 16px;
  font-size: 16px;
  line-height: 22px;
}
.watchlists .watchlist__remove {
  margin-left: 8px;
  padding: 4px;
  flex-shrink: 0;
}
.watchlists .watchlist__remove svg {
  width: 8px;
  height: 8px;
  color: #FFF;
}
.watchlists .watchlist__remove:hover svg {
  color: #2DC46E;
}
/* Colors */
/* Fonts */
/* Dimensions */
.add-watchlist-fade {
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  position: fixed;
  z-index: 1000;
}

.add-watchlist-pane {
  z-index: 1001;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  width: 25%;
  min-width: 280px;
  display: flex;
  flex-direction: column;
  background: #273A45;
  box-shadow: 0 2px 16px 1px rgba(0, 0, 0, 0.1);
  height: 100%;
}
.add-watchlist-pane .header {
  flex-grow: 0;
  flex-shrink: 0;
  background: #2b3f4c;
}
.add-watchlist-pane .header h4 {
  font-size: 20px;
  line-height: 24px;
  /*text-transform: uppercase;*/
  font-weight: bold;
  padding: 25px 20px 0;
}
.add-watchlist-pane .header input {
  padding: 18px 0px 10px;
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  border-bottom: 1px solid #101a20;
}
.add-watchlist-pane .add-new-watchlist {
  padding: 0 20px;
  margin-top: 35px;
}
.add-watchlist-pane .watchlists-list {
  flex-grow: 1;
  height: calc(100% - 122px);
}
.add-watchlist-pane .watchlists-list ul li {
  border-top: 1px solid #294254;
  height: 40px;
  padding: 8px 20px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  user-select: none;
}
.add-watchlist-pane .watchlists-list ul li:hover {
  background: #1e2c35;
}
.add-watchlist-pane .watchlists-list ul li > span {
  width: 100%;
  height: 40px;
  padding: 7px 20px;
  display: inline-block;
}
.add-watchlist-pane .watchlists-list .no-results {
  opacity: 0.4;
  padding: 10px 20px;
}
.favorites-wrapper .reports {
  background: #293B47;
  padding: 16px;
}
.favorites-wrapper .reports table {
  border: none;
}
.favorites-wrapper .reports table td, .favorites-wrapper .reports table th {
  border: none;
}
.favorites-wrapper .reports table th {
  border-bottom: 1px solid #24323D;
  padding: 8px 10px;
  font-size: 13px;
  line-height: 18px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
}
.favorites-wrapper .reports table td {
  font-size: 16px;
  line-height: 21px;
  padding: 5px 10px;
  vertical-align: middle;
}
.favorites-wrapper .reports table tr:hover td {
  background: #24323D;
  cursor: pointer;
}
.favorites-wrapper .reports table tr.inactive td {
  opacity: 0.5;
}
.favorites-wrapper .reports table tr.inactive td.pdf-cell {
  opacity: 1;
}
.favorites-wrapper .reports table tr.inactive:hover td {
  background: none;
  cursor: default;
}
.favorites-wrapper .reports table .pdf-link {
  width: 22px;
  height: 22px;
  fill: #2DC46E;
}
.favorites-wrapper .reports table .pdf-link:hover {
  cursor: pointer;
}
.favorites-wrapper .reports table .team-image {
  width: 22px;
  height: 22px;
  display: inline-block;
  vertical-align: middle;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 6px;
  top: -2px;
  position: relative;
}
.favorites-wrapper .reports table .rating-rate .legend {
  width: 8px;
  height: 8px;
  display: inline-block;
  vertical-align: middle;
  border-radius: 50%;
  margin-right: 6px;
}
.favorites-wrapper .reports .empty-message {
  font-size: 20px;
  line-height: 26px;
  text-align: center;
  padding: 120px 0;
  color: rgba(255, 255, 255, 0.5);
}
/* Colors */
/* Fonts */
/* Dimensions */
.notes-desktop-container .notes-filter {
  width: 26%;
  min-width: 150px;
  max-width: 292px;
  flex-grow: 1;
  flex-shrink: 1;
}
@media (max-width: 959px) {
  .notes-desktop-container .notes-filter {
    display: none;
  }
}
.notes-desktop-container .notes-filter__section {
  margin: 20px 15px 30px;
}
.notes-desktop-container .notes-filter__section-header {
  font-size: 16px;
  font-weight: 500;
  padding-left: 12px;
  color: #FFF;
  margin: 35px 15px 0px;
}
.notes-desktop-container .notes-filter__section-title {
  font-size: 13px;
  font-weight: 500;
  padding-left: 12px;
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #CCC;
  opacity: 0.6;
}
.notes-desktop-container .notes-filter__search {
  font-size: 12px;
  line-height: 18px;
  /*border-bottom: 1px solid $color_light_border;*/
  padding: 3px 12px;
  width: 100%;
  display: block;
  margin: 5px 0;
  color: #CCC;
}
.notes-desktop-container .notes-filter__search::placeholder {
  color: #ccc;
}
.notes-desktop-container .notes-filter__item {
  display: flex;
  position: relative;
  margin-top: 1px;
  font-size: 14px;
  line-height: 20px;
  font-weight: normal;
  color: #2DC46E;
  padding: 3px 12px 3px 25px;
  cursor: pointer;
  border-radius: 2px;
  background: transparent;
  transition: background 250ms ease-out;
}
.notes-desktop-container .notes-filter__item.player {
  padding-left: 12px;
}
.notes-desktop-container .notes-filter__item.all-items {
  padding-left: 12px;
}
.notes-desktop-container .notes-filter__item.category:before {
  content: "#";
  position: absolute;
  left: 12px;
}
.notes-desktop-container .notes-filter__item.author {
  padding-left: 12px;
}
.notes-desktop-container .notes-filter__item.match {
  padding-left: 12px;
}
.notes-desktop-container .notes-filter__item:hover {
  background: rgba(255, 255, 255, 0.05);
}
.notes-desktop-container .notes-filter__item .text {
  flex-grow: 1;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.notes-desktop-container .notes-filter__item.active {
  background: rgba(255, 255, 255, 0.15);
}
.notes-desktop-container .notes-filter__item.active .text {
  font-weight: 500;
}
.notes-desktop-container .notes-filter__item .label {
  flex-grow: 0;
  opacity: 0.5;
}
/* Colors */
/* Fonts */
/* Dimensions */
.note-tag {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.15);
  margin: 3px 3px 0 0;
  color: #FFF;
  font-size: 13px;
  line-height: 18px;
  white-space: nowrap;
}

/* Colors */
/* Fonts */
/* Dimensions */
.notes-desktop-container .notes-aside {
  width: 30%;
  max-width: 321px;
  min-width: 260px;
  flex-grow: 1;
  flex-shrink: 1;
  border-right: 1px solid rgba(255, 255, 255, 0.15);
  border-left: 1px solid rgba(255, 255, 255, 0.15);
  padding-top: 15px;
}
@media (max-width: 959px) {
  .notes-desktop-container .notes-aside {
    min-width: 160px;
    padding-top: 0;
    border-left: none;
  }
}
.notes-desktop-container .notes-aside__wrapper {
  overflow: hidden;
  padding-bottom: 35px;
}
.notes-desktop-container .notes-aside .notes-add {
  display: flex;
  padding: 15px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
@media (max-width: 959px) {
  .notes-desktop-container .notes-aside .notes-add {
    padding: 10px;
  }
}
.notes-desktop-container .notes-aside .notes-add .search-field-container {
  position: relative;
  flex-grow: 1;
  color: #CCC;
}
.notes-desktop-container .notes-aside .notes-add .search-field-container svg {
  width: 24px;
  height: 24px;
  position: absolute;
  left: 6px;
  top: 6px;
  transition: color 250ms ease-out;
  fill: currentColor;
}
@media (max-width: 959px) {
  .notes-desktop-container .notes-aside .notes-add .search-field-container svg {
    width: 14px;
    height: 14px;
  }
}
.notes-desktop-container .notes-aside .notes-add .search-field {
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #FFF;
  font-size: 14px;
  line-height: 36px;
  height: 36px;
  border-radius: 4px;
  padding: 0 15px 0 36px;
  transition: border-color 250ms ease-out;
  width: 100%;
  display: block;
}
@media (max-width: 959px) {
  .notes-desktop-container .notes-aside .notes-add .search-field {
    line-height: 24px;
    height: 24px;
    padding: 0 10px 0 24px;
  }
}
.notes-desktop-container .notes-aside .notes-add .search-field::placeholder {
  color: #CCC;
  transform: translateX(0) translateZ(0);
  transition: color 250ms ease-out, transform 0.2s ease-out;
}
.notes-desktop-container .notes-aside .notes-add .search-field:focus {
  border: 1px solid green;
}
.notes-desktop-container .notes-aside .notes-add .search-field:focus::placeholder {
  transform: translateX(50px) translateZ(0);
  color: transparent;
}
.notes-desktop-container .notes-aside .notes-add .note-add-button {
  width: 36px;
  height: 36px;
  border-radius: 4px;
  border: 1px solid;
  text-align: center;
  font-size: 14px;
  line-height: 36px;
  color: #2DC46E;
  background: transparent;
  transition: color 250ms ease-out;
  margin-left: 12px;
  position: relative;
  padding: 0;
}
@media (max-width: 959px) {
  .notes-desktop-container .notes-aside .notes-add .note-add-button {
    width: 24px;
    height: 24px;
  }
}
.notes-desktop-container .notes-aside .notes-add .note-add-button:before, .notes-desktop-container .notes-aside .notes-add .note-add-button:after {
  content: "";
  left: 50%;
  top: 50%;
  position: absolute;
  background: #2DC46E;
  transition: background 250ms ease-out;
}
.notes-desktop-container .notes-aside .notes-add .note-add-button:before {
  width: 12px;
  height: 2px;
  margin-top: -1px;
  margin-left: -6px;
}
.notes-desktop-container .notes-aside .notes-add .note-add-button:after {
  width: 2px;
  height: 12px;
  margin-left: -1px;
  margin-top: -6px;
}
.notes-desktop-container .notes-aside .notes-add .note-add-button:hover {
  color: green;
}
.notes-desktop-container .notes-aside .notes-add .note-add-button:hover:before, .notes-desktop-container .notes-aside .notes-add .note-add-button:hover:after {
  background: green;
}
/* Colors */
/* Fonts */
/* Dimensions */
.note-form {
  margin-bottom: 35px;
}
.note-form textarea {
  display: block;
  border-left: 2px solid transparent;
  width: 100%;
  resize: none;
  padding-left: 0;
  transition: border 500ms ease-out, padding 500ms ease-out;
  background: none;
  color: #FFF;
  border: none;
}
.note-form textarea::placeholder {
  color: #CCC;
  transform: translateX(0) translateZ(0);
  transition: color 500ms ease-out, transform 500ms ease-out;
}
.note-form textarea:focus {
  border-left: 2px solid #35B374;
  padding-left: 10px;
}
.note-form textarea:focus::placeholder {
  transform: translateX(100px) translateZ(0);
  color: transparent;
}
.note-form__done {
  transition: color 250ms ease-out;
  color: #fff;
  font-size: 14px;
  text-transform: uppercase;
  font-weight: 500;
  letter-spacing: 1px;
  cursor: pointer;
  border-radius: 2px;
  line-height: 36px;
  width: 120px;
  padding: 0;
  background: #53B78F;
  text-align: center;
  float: right;
}
.note-form__done:hover {
  color: #fff;
}
.note-form__player {
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  margin-bottom: 15px;
  display: flex;
  justify-content: space-between;
}
.note-form__player .note-player-select {
  flex-shrink: 0;
  flex-grow: 1;
}
.note-form__title {
  font-size: 24px;
  line-height: 32px;
  color: #FFF;
  font-weight: 500;
  min-height: 32px;
  width: 425px !important;
  display: inline-block !important;
}
@media (max-width: 1023px) {
  .note-form__title {
    width: 360px !important;
  }
}
.note-form__text {
  font-size: 15px;
  line-height: 22px;
  margin-top: 2px;
}
.note-form__tags {
  margin-top: 15px;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  padding-top: 15px;
}
.note-form__tags .Select-value {
  white-space: nowrap;
}
.note-content .team-note {
  margin-top: 35px;
}
.note-content .team-name {
  font-size: 18px;
  line-height: 24px;
  font-weight: 500;
  margin: 0 0 10px;
}
.note-content .team-note-image {
  position: relative;
  top: -2px;
  display: inline-block;
  width: 22px;
  height: 22px;
  background-position: center center;
  background-size: contain;
  vertical-align: middle;
  margin-right: 4px;
  background-repeat: no-repeat;
}
/* Colors */
/* Fonts */
/* Dimensions */
.notes-desktop-container .notes-content {
  flex-grow: 1;
  flex-shrink: 1;
  width: 70%;
  padding: 29px 0px 35px 30px;
  position: relative;
}
.notes-desktop-container .notes-content__wrapper {
  padding-bottom: 35px;
  padding-right: 30px;
}
.notes-desktop-container .notes-content .note-content {
  -ms-user-select: text;
  -webkit-user-select: text;
  -moz-user-select: text;
  user-select: text;
  padding-bottom: 35px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  margin-bottom: 35px;
}
.notes-desktop-container .notes-content .note-content__wrapper {
  overflow: hidden;
}
.notes-desktop-container .notes-content .note-content.player-profile {
  border-bottom: none;
}
.notes-desktop-container .notes-content .note-content__title {
  display: flex;
}
.notes-desktop-container .notes-content .note-content__title h2 {
  flex-grow: 1;
}
.notes-desktop-container .notes-content .note-content__button {
  width: 18px;
  height: 18px;
  display: block;
  position: relative;
  flex-grow: 0;
  flex-shrink: 0;
  transition: color 250ms ease-out;
  margin-left: 20px;
  top: 5px;
  cursor: pointer;
}
.notes-desktop-container .notes-content .note-content__button:hover {
  color: green;
}
.notes-desktop-container .notes-content .note-content__button.edit-note svg {
  fill: none;
  stroke: currentColor;
}
.notes-desktop-container .notes-content .note-content__button svg {
  width: 100%;
  height: 100%;
}
.notes-desktop-container .notes-content .note-content h2 {
  color: #FFF;
  font-size: 24px;
  line-height: 32px;
  font-weight: 500;
  margin: 0;
}
.notes-desktop-container .notes-content .note-content p {
  font-size: 15px;
  line-height: 22px;
  color: #FFF;
  margin-top: 15px;
}
.notes-desktop-container .notes-content .note-content__meta {
  font-size: 12px;
  line-height: 18px;
  margin: 15px 0 0px;
  color: #CCC;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.notes-desktop-container .notes-content .note-content__tags {
  margin-top: 15px;
}
.notes-desktop-container .notes-content .note-content__player {
  margin: 35px 0;
}
.notes-desktop-container .notes-content .note-content__player h4 {
  font-size: 14px;
  line-height: 20px;
  color: #CCC;
  margin: 0 0 10px;
  font-weight: normal;
}
.notes-desktop-container .notes-content .note-content__player .player-card {
  padding: 15px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 4px;
  color: #CCC;
}
.notes-desktop-container .notes-content .note-content__player .player-card:hover {
  background: blue;
}
.notes-desktop-container .notes-content .note-content__player .player-card .player-text .player-name {
  color: #2DC46E;
}
.notes-desktop-container .notes-content .note-content__more {
  margin: 35px 0;
}
.notes-desktop-container .notes-content .note-content__more h4 {
  font-size: 14px;
  line-height: 20px;
  color: #CCC;
  margin: 0 0 10px;
  font-weight: normal;
}
.notes-desktop-container .notes-content .note-content__more .notes-list__item {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 4px;
  padding: 15px;
  transition: background 250ms ease-out;
  margin: 0px 0px 10px 0;
}
.notes-desktop-container .notes-content .note-content__more .notes-list__item:hover {
  background: blue;
}
.notes-desktop-container .notes-content .note-content__more .notes-list__item h4 {
  font-size: 15px;
  line-height: 21px;
  font-weight: 500;
  color: blue;
}
.notes-desktop-container .notes-content .note-content__more .notes-list__item-player-pic {
  display: none;
}
.notes-desktop-container .notes-content .note-content__more .notes-list__item-text {
  color: #FFF;
}
/* Colors */
/* Fonts */
/* Dimensions */
.note-tag-select.Select.is-searchable.Select--multi .Select-control {
  border: none;
  height: 24px;
}
.note-tag-select.Select.is-searchable.Select--multi .Select-placeholder {
  color: rgba(17, 50, 69, 0.4);
  font-weight: 500;
  font-size: 14px;
  line-height: 24px;
  height: 24px;
}
.note-tag-select.Select.is-searchable.Select--multi .Select-input {
  width: 160px !important;
  font-size: 12px;
  line-height: 24px;
  height: 24px;
}
.note-tag-select.Select.is-searchable.Select--multi .Select-input input {
  margin-top: 0;
  padding-top: 3px;
}
.note-tag-select.Select.is-searchable.Select--multi .Select-value {
  color: #FFF;
  border: none;
  display: inline-block;
  background: #CCC;
  font-size: 13px;
  line-height: 18px;
  height: 24px;
  padding: 3px 10px 3px 7px;
  margin: 0 0 5px 5px;
  border-radius: 12px;
  display: inline-flex;
}
.note-tag-select.Select.is-searchable.Select--multi .Select-value .Select-value-icon {
  border: none;
  padding: 0px 4px 0px 8px;
  font-size: 20px;
  line-height: 17px;
  display: block;
}
.note-tag-select.Select.is-searchable.Select--multi .Select-value .Select-value-icon:hover {
  background: transparent;
  color: blue;
}
.note-tag-select.Select.is-searchable.Select--multi .Select-value .Select-value-label {
  display: block;
  font-size: 13px;
  height: 18px;
  line-height: 18px;
  padding: 0 0 0 5px;
}
.note-tag-select.Select.is-searchable.Select--multi .Select-value .Select-value-label:before {
  content: "# ";
  position: relative;
  top: -1px;
}
.note-tag-select.Select.is-searchable.Select--multi .Select-arrow-zone {
  display: none;
}
/* Colors */
/* Fonts */
/* Dimensions */
.styled-react-select {
  font-size: 14px;
}
.styled-react-select.Select--single .Select-control {
  height: auto;
  border: none;
  background: transparent;
  border-bottom: 1px solid blue !important;
}
.styled-react-select.Select--single .Select-control input {
  border-bottom: none;
  padding-top: 3px;
}
.styled-react-select.Select--single .Select-control .Select-value {
  line-height: 26px;
  left: 0;
}
.styled-react-select.Select--single .Select-control .Select-value .Select-value-label {
  padding: 0;
}
.styled-react-select.Select--single .Select-control .Select-input {
  height: 22px;
  padding-left: 0;
}
.styled-react-select.Select--single .Select-control .Select-input input {
  padding-left: 0;
  background: transparent;
}
.styled-react-select.has-value.Select--single .Select-control .Select-value .Select-value-label, .styled-react-select.is-focused.Select--single .Select-control .Select-value .Select-value-label, .styled-react-select.has-value.is-pseudo-focused.Select--single .Select-control .Select-value .Select-value-label {
  padding: 0 !important;
}
/* Colors */
/* Fonts */
/* Dimensions */
.note-player-select {
  max-width: 350px;
}
.note-player-select.Select--single > .Select-control, .note-player-select.is-focused.Select--single > .Select-control, .note-player-select.is-pseudo-focused.Select--single > .Select-control, .note-player-select.is-open.Select--single > .Select-control {
  height: 43px;
  border: none;
}
.note-player-select.Select--single > .Select-control .Select-placeholder, .note-player-select.is-focused.Select--single > .Select-control .Select-placeholder, .note-player-select.is-pseudo-focused.Select--single > .Select-control .Select-placeholder, .note-player-select.is-open.Select--single > .Select-control .Select-placeholder {
  height: 43px;
  font-size: 14px;
  line-height: 43px;
  font-weight: 500;
  color: #ccc;
}
.note-player-select.Select--single > .Select-control .Select-value, .note-player-select.is-focused.Select--single > .Select-control .Select-value, .note-player-select.is-pseudo-focused.Select--single > .Select-control .Select-value, .note-player-select.is-open.Select--single > .Select-control .Select-value {
  left: 0;
  line-height: 43px;
  height: 43px;
}
.note-player-select.Select--single > .Select-control .Select-value .Select-value-label, .note-player-select.is-focused.Select--single > .Select-control .Select-value .Select-value-label, .note-player-select.is-pseudo-focused.Select--single > .Select-control .Select-value .Select-value-label, .note-player-select.is-open.Select--single > .Select-control .Select-value .Select-value-label {
  display: block;
}
.note-player-select .Select-menu-outer .player-text {
  line-height: 20px;
  padding-top: 6px;
}
.note-player-select.filter-select {
  margin-top: 5px;
}
.note-player-select.filter-select .player-card {
  display: flex;
  font-size: 14px;
  line-height: 32px;
  position: relative;
  background: transparent;
  transition: background 250ms ease-out;
}
.note-player-select.filter-select .player-card .count {
  position: absolute;
  right: 0;
  top: 0;
}
.note-player-select.filter-select .player-card div, .note-player-select.filter-select .player-card span {
  display: block;
}
.note-player-select.filter-select .player-card .player-img {
  width: 16px;
  height: 26px;
  margin-right: 8px;
  margin-top: 5px;
}
.note-player-select.filter-select .player-card .player-img .player-photo .pic {
  max-width: 17px;
  height: 20px;
  position: relative;
}
.note-player-select.filter-select .player-card .player-img .player-photo .pic > div {
  clip-path: none;
}
.note-player-select.filter-select .player-card .player-text {
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}
.note-player-select.filter-select .player-card .player-text .player-name {
  font-weight: 500;
  font-size: 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
  color: green;
}
.note-player-select.filter-select .player-card.empty {
  opacity: 0.5;
}
.note-player-select.filter-select.Select--single > .Select-control, .note-player-select.filter-select.is-focused.Select--single > .Select-control, .note-player-select.filter-select.is-pseudo-focused.Select--single > .Select-control, .note-player-select.filter-select.is-open.Select--single > .Select-control {
  height: 32px;
  border: none;
  background: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
.note-player-select.filter-select.Select--single > .Select-control .Select-placeholder, .note-player-select.filter-select.is-focused.Select--single > .Select-control .Select-placeholder, .note-player-select.filter-select.is-pseudo-focused.Select--single > .Select-control .Select-placeholder, .note-player-select.filter-select.is-open.Select--single > .Select-control .Select-placeholder {
  height: 32px;
  font-size: 14px;
  line-height: 32px;
  font-weight: 500;
  color: #ccc;
}
.note-player-select.filter-select.Select--single > .Select-control .Select-input, .note-player-select.filter-select.is-focused.Select--single > .Select-control .Select-input, .note-player-select.filter-select.is-pseudo-focused.Select--single > .Select-control .Select-input, .note-player-select.filter-select.is-open.Select--single > .Select-control .Select-input {
  height: 32px;
}
.note-player-select.filter-select.Select--single > .Select-control .Select-input input, .note-player-select.filter-select.is-focused.Select--single > .Select-control .Select-input input, .note-player-select.filter-select.is-pseudo-focused.Select--single > .Select-control .Select-input input, .note-player-select.filter-select.is-open.Select--single > .Select-control .Select-input input {
  padding: 0;
  font-size: 14px;
  line-height: 32px;
}
.note-player-select.filter-select.Select--single > .Select-control .Select-value, .note-player-select.filter-select.is-focused.Select--single > .Select-control .Select-value, .note-player-select.filter-select.is-pseudo-focused.Select--single > .Select-control .Select-value, .note-player-select.filter-select.is-open.Select--single > .Select-control .Select-value {
  left: 0;
  line-height: 32px;
  height: 32px;
}
.note-player-select.filter-select.Select--single > .Select-control .Select-value .Select-value-label, .note-player-select.filter-select.is-focused.Select--single > .Select-control .Select-value .Select-value-label, .note-player-select.filter-select.is-pseudo-focused.Select--single > .Select-control .Select-value .Select-value-label, .note-player-select.filter-select.is-open.Select--single > .Select-control .Select-value .Select-value-label {
  display: block;
}
/* Colors */
/* Fonts */
/* Dimensions */
.notes-page {
  margin: 0 -25px;
}

.notes-desktop-container {
  display: flex;
  padding-bottom: 0 !important;
}
@media (max-width: 959px) {
  .notes-desktop-container {
    margin-top: 8px;
  }
}
.notes-desktop-container ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
.notes-desktop-container ul li {
  padding: 0;
  margin: 0;
}
.notes-desktop-container .notes-desktop-body {
  display: flex;
}
.notes-desktop-container .notes-desktop-body {
  flex-shrink: 1;
  flex-grow: 1;
  width: 78%;
  max-width: 12015px;
}
.notes-desktop-container .notes-desktop-body .notes-list__item-text {
  width: 100%;
}
.notes-desktop-container .notes-desktop-body .notes-list__item {
  display: flex;
  cursor: pointer;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  padding: 10px 12px 7px 10px;
  transition: background 250ms ease-out, border-color 250ms ease-out;
}
.notes-desktop-container .notes-desktop-body .notes-list__item:hover {
  background: rgba(255, 255, 255, 0.5);
}
.notes-desktop-container .notes-desktop-body .notes-list__item.active {
  cursor: default;
  padding-left: 12px;
  background: rgba(255, 255, 255, 0.15);
}
.notes-desktop-container .notes-desktop-body .notes-list__item h4 {
  font-size: 15px;
  line-height: 21px;
  font-weight: 500;
  color: #FFF;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.notes-desktop-container .notes-desktop-body .notes-list__item .text-preview {
  font-size: 14px;
  line-height: 18px;
  color: #CCC;
  height: 36px;
  overflow: hidden;
}
.notes-desktop-container .notes-desktop-body .notes-list__item-tag .note-tag {
  background: none;
  font-size: 13px;
  color: #2DC46E;
  padding: 1px 6px 1px 0px;
  font-weight: 500;
}
.notes-desktop-container .notes-desktop-body .notes-list__item-meta {
  margin-top: 2px;
  font-size: 12px;
  line-height: 17px;
  color: #CCC;
  display: flex;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  width: 100%;
}
.notes-desktop-container .notes-desktop-body .notes-list__item-meta .author {
  flex-grow: 1;
}
.notes-desktop-container .notes-desktop-body .notes-list__item-meta .date {
  text-align: right;
  margin-left: 10px;
  white-space: nowrap;
}
.player-card {
  display: flex;
  font-size: 14px;
  line-height: 21px;
  background: transparent;
  transition: background 250ms ease-out;
}
.player-card div, .player-card span {
  display: block;
}
.player-card .player-text .player-name-last, .player-card .player-text .player-name-first {
  text-transform: uppercase;
  color: green;
  letter-spacing: 0.5px;
  line-height: 120%;
}
.player-card .player-text .player-name-first {
  font-size: 13px;
}
.player-card .player-text .player-name-last {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 1px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.dw-analytics__info .content-row:after, .dw-analytics .content-block:after {
  content: "";
  display: table;
  clear: both;
}

.dw-analytics__content {
  display: flex;
  flex-direction: row;
}
@media (max-width: 1279px) {
  .dw-analytics__content {
    flex-direction: column;
  }
}
.dw-analytics .content-block {
  background: #293B47;
  box-sizing: border-box;
  border-radius: 5px;
  box-shadow: 0 2px 16px 1px rgba(0, 0, 0, 0.1);
  padding: 24px 0;
  margin-top: 25px;
}
.dw-analytics .content-block hr {
  background: rgba(53, 76, 92, 0.5);
  margin: 25px;
}
.dw-analytics .content-block:nth-child(1) {
  margin-top: 0;
}
.dw-analytics__help {
  display: flex;
  flex-wrap: wrap;
  margin-top: 36px;
}
.dw-analytics__help-block {
  width: 180px;
  margin-right: 35px;
  margin-bottom: 24px;
}
.dw-analytics__help-block h4 {
  font-weight: bold;
  margin-bottom: 8px;
}
.dw-analytics__info {
  width: calc(33.3% - 10px);
}
@media (max-width: 1279px) {
  .dw-analytics__info {
    margin-top: 25px;
    width: auto;
  }
  .dw-analytics__info h4 {
    font-size: 16px;
    line-height: 22px;
  }
}
.dw-analytics__info .content-pad {
  padding: 0 24px;
}
.dw-analytics__info .content-row {
  display: flex;
  margin-top: 20px;
}
.dw-analytics__info .content-row .content-col-50 {
  width: calc(50% - 18px);
  flex-grow: 0;
  flex-shrink: 0;
  margin-left: 35px;
}
.dw-analytics__info .content-row .content-col-50:nth-child(1) {
  margin-left: 0;
}
.dw-analytics__info .content-row .content-col-66 {
  width: calc(66.7% - 5px);
  flex-grow: 0;
  flex-shrink: 0;
  margin-left: 35px;
}
.dw-analytics__info .content-row .content-col-66:nth-child(1) {
  margin-left: 0;
}
.dw-analytics__info .content-row .content-col-33 {
  width: calc(33.3% - 18px);
  flex-grow: 0;
  flex-shrink: 0;
  margin-left: 35px;
}
.dw-analytics__info .content-row .content-col-33:nth-child(1) {
  margin-left: 0;
}
.dw-analytics__info .content-row.small-margin {
  margin-top: 5px;
}
.dw-analytics__info .content-row:nth-child(1) {
  margin-top: 0;
}
.dw-analytics__info .content-row .data-item, .dw-analytics__info .content-row .data-item-icon, .dw-analytics__info .content-row .data-item-changeable {
  margin-left: 35px;
}
.dw-analytics__info .content-row .data-item:nth-child(1), .dw-analytics__info .content-row .data-item-icon:nth-child(1), .dw-analytics__info .content-row .data-item-changeable:nth-child(1) {
  margin-left: 0;
}
.dw-analytics__info .player-data {
  display: flex;
}
.dw-analytics__info .player-data__image {
  width: 72px;
  height: 72px;
  border-radius: 36px;
  margin-right: 24px;
  border: 2px solid #35B374;
  background-color: rgba(53, 179, 116, 0.5);
}
.dw-analytics__info .player-data__image .player-image {
  width: 68px;
  height: 68px;
  background-size: cover;
  background-position: center center;
  border-radius: 34px;
}
.dw-analytics__info .player-data__content {
  flex-grow: 1;
}
.dw-analytics__info .player-data__content .data-item, .dw-analytics__info .player-data__content .data-item-icon, .dw-analytics__info .player-data__content .data-item-changeable {
  flex-grow: 1;
  max-width: 50%;
}
.dw-analytics__info .player-data__content .data-item .select_input, .dw-analytics__info .player-data__content .data-item-icon .select_input, .dw-analytics__info .player-data__content .data-item-changeable .select_input {
  color: #FFF;
}
.dw-analytics__info .player-data__firstName {
  font-size: 18px;
  line-height: 23px;
}
.dw-analytics__info .player-data__lastName {
  font-size: 36px;
  line-height: 40px;
  font-weight: bold;
}
.dw-analytics__info .player-data .data-row {
  display: flex;
  margin-top: 25px;
}
.dw-analytics__info .player-data .team-row {
  margin-top: 45px;
}
.dw-analytics__chart {
  padding: 75px;
  margin-left: 50px;
  width: calc(60% - 50px);
  max-height: 480px;
}
@media (max-width: 1279px) {
  .dw-analytics__chart {
    width: auto;
    margin-left: 0;
    margin-top: 25px;
  }
}
.dw-analytics__chart svg {
  width: 100%;
  height: auto;
  max-height: 480px;
}

.indicator-tip {
  width: 190px !important;
}

.matchmetrics-spiderchart__chart__label.matchmetrics-spiderchart__chart__label--name {
  font-family: "Source Sans Pro", Helvetica, sans-serif !important;
  cursor: default;
}
.matchmetrics-spiderchart__chart__label.matchmetrics-spiderchart__chart__label--name + text {
  font-family: "Source Sans Pro", Helvetica, sans-serif !important;
  font-weight: normal !important;
}
.matchmetrics-spiderchart__chart__label.matchmetrics-spiderchart__chart__label--name + text + text {
  font-family: "Source Sans Pro", Helvetica, sans-serif !important;
  font-weight: normal !important;
}
.analytics-cta-chart {
  position: relative;
  display: block;
  width: 100%;
  padding-bottom: 100%;
  background-image: url(/f93bcf696008c3384081.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.analytics-cta-chart .analytics-cta {
  position: absolute;
  width: 190px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #24323D;
  padding: 16px;
}
.analytics-cta-chart .analytics-cta h4 {
  font-family: "Source Sans Pro", sans-serif;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0.04em;
  margin: 0;
}
.analytics-cta-chart .analytics-cta p {
  margin: 16px 0;
  font-size: 13px;
  line-height: 16px;
  text-align: left;
  color: #A4A6A4;
}
.analytics-cta-chart .analytics-cta svg {
  width: 80px;
  height: 80px;
  margin: 0 auto 16px;
  display: block;
}
.analytics-cta-chart .analytics-cta .btn {
  width: 100%;
  background: #35B37A;
  border: none;
  color: #FFF;
}
.analytics-cta-chart .analytics-cta .btn:hover, .analytics-cta-chart .analytics-cta .btn:active {
  background: #FFF;
  color: #24323D;
}
/* Colors */
/* Fonts */
/* Dimensions */
.favorite header .container:after {
  content: "";
  display: table;
  clear: both;
}

.favorite .container {
  padding: 0 38px 40px;
  max-width: 1280px;
}
.favorite .section-nav + .container {
  padding-bottom: 140px;
}
@media (max-width: 959px) {
  .favorite .section-nav + .container {
    padding-bottom: 0;
  }
}
.favorite .section-nav {
  background: none !important;
  box-shadow: none !important;
}
.favorite .section-nav .container {
  border-bottom: 2px solid #385161;
  margin: 0 38px;
  padding: 0;
  max-width: 1204px;
}
.favorite .section-nav .container a, .favorite .section-nav .container span {
  padding: 10px 10px;
}
.favorite header {
  padding: 25px 0 0;
  position: relative;
  z-index: 5;
}
.favorite header .container {
  padding-bottom: 0;
  display: flex;
  align-content: space-between;
}
@media (max-width: 959px) {
  .favorite header .container {
    flex-direction: column;
  }
}
.favorite header .favorite__header-left {
  width: 65%;
}
.favorite header .favorite__header-right {
  justify-content: right;
  display: flex;
  padding-top: 12px;
}
@media (max-width: 959px) {
  .favorite header .favorite__header-right {
    margin-bottom: 25px;
    display: none;
  }
}
.favorite__title {
  margin-top: 0px;
  vertical-align: middle;
  font-size: 28px;
  line-height: 34px;
  font-weight: bold;
}
.favorite__title .placeholder {
  display: inline-block;
  width: 120px;
  height: 30px;
  background: rgba(255, 255, 255, 0.05);
  vertical-align: middle;
  margin-bottom: 23px;
}
.favorite__title .placeholder.fn {
  width: 140px;
  margin-right: 8px;
}
.favorite__title .placeholder.ln {
  width: 180px;
}
.favorite__season-filter, .favorite__scout-filter {
  margin-left: 25px;
}
@media (max-width: 959px) {
  .favorite__season-filter, .favorite__scout-filter {
    margin-left: 0;
    margin-right: 10px;
  }
}
.favorite__season-filter .Select, .favorite__scout-filter .Select {
  max-width: 170px;
}
.favorite__season-filter .Select--single.has-value .Select-control, .favorite__scout-filter .Select--single.has-value .Select-control {
  border-bottom: none !important;
}
.favorite__season-filter .Select--single.has-value .Select-input, .favorite__season-filter .Select--single.has-value .Select-control, .favorite__scout-filter .Select--single.has-value .Select-input, .favorite__scout-filter .Select--single.has-value .Select-control {
  height: 24px;
}
.favorite__season-filter .Select--single.has-value > .Select-control .Select-value, .favorite__scout-filter .Select--single.has-value > .Select-control .Select-value {
  font-size: 15px;
  line-height: 24px;
}
.favorite__season-filter .Select--single.has-value > .Select-control .Select-value .Select-value-label, .favorite__scout-filter .Select--single.has-value > .Select-control .Select-value .Select-value-label {
  font-weight: 600;
}
.favorite__season-filter label, .favorite__scout-filter label {
  font-size: 13px;
  letter-spacing: 0.5px;
  line-height: 18px;
  opacity: 0.7;
  margin-top: -2px;
  display: block;
  text-transform: uppercase;
}
/* Colors */
/* Fonts */
/* Dimensions */
.help {
  font-size: 16px;
  line-height: 22px;
  font-weight: 400;
  height: 100%;
}
.help .lang-selector {
  margin: 25px 0 0 0;
}
.help .lang-selector .container {
  padding-top: 0;
  padding-bottom: 0;
}
.help .lang-selector .js-link {
  border-bottom: 1px dotted;
  display: inline-block;
  margin-left: 15px;
}
.help .lang-selector .js-link:nth-child(1) {
  margin-left: 0;
}
.help .lang-selector .js-link.active {
  color: #FFF;
  border-bottom: none;
  font-weight: 700;
}
.help .Collapsible {
  margin: 30px 0 0;
}
.help .Collapsible__trigger {
  font-size: 18px;
  letter-spacing: 0.5px;
  font-weight: 700;
  border-bottom: 1px dashed;
  padding-bottom: 2px;
  cursor: pointer;
}
.help .Collapsible__trigger.is-closed {
  color: #2DC46E;
}
.help .Collapsible__trigger.is-open {
  color: #FFF;
}
@media (max-width: 959px) {
  .help .Collapsible__trigger {
    font-size: 14px;
  }
}
.help .help-indicator {
  display: inline-block;
  width: 32.5%;
  vertical-align: top;
  padding: 15px;
  margin-top: 30px;
  overflow: hidden;
}
.help .help-indicator:nth-child(1), .help .help-indicator:nth-child(2), .help .help-indicator:nth-child(3), .help .help-indicator:nth-child(4) {
  margin-top: 0;
}
@media (max-width: 959px) {
  .help .help-indicator {
    margin-top: 15px;
    width: 49.5%;
  }
}
.help .help-indicator svg {
  display: block;
  width: 35px;
  height: 35px;
  float: left;
  margin-right: 15px;
  color: #2DC46E;
}
.help .help-indicator .help-indicator-body {
  display: block;
  overflow: hidden;
}
.help .help-indicator .help-indicator-body strong {
  text-transform: uppercase;
  display: block;
}
.help .help-indicator-header {
  display: block;
  text-align: center;
}
.help .help-indicator-header svg {
  width: 50px;
  height: 50px;
  color: #2DC46E;
}
.help .sub-nav__content h2 {
  margin: 60px 0 0;
  font-size: 25px;
  letter-spacing: 1px;
  font-weight: 700;
  text-transform: uppercase;
}
@media (max-width: 959px) {
  .help .sub-nav__content h2 {
    font-size: 16px;
  }
}
.help .sub-nav__content h3 {
  font-weight: 700;
  margin: 60px 0 0;
  text-transform: uppercase;
  font-size: 16px;
  letter-spacing: 1px;
}
.help .sub-nav__content h4 {
  font-size: 22px;
  margin-bottom: 25px;
  font-weight: 500;
}
.help .sub-nav__content p.hero {
  font-size: 17px;
  line-height: 170%;
  margin-bottom: 50px;
  display: block;
}
.help .sub-nav__content p {
  margin-top: 7px;
  font-size: 16px;
  line-height: 135%;
  max-width: 650px;
  opacity: 0.9;
}
.help .sub-nav__content p a {
  color: #2DC46E;
}
.help .sub-nav__content p a:hover {
  color: #188538;
}
.help .sub-nav__content .p__btn {
  margin-top: 35px;
}
.help .sub-nav__content .p__btn .btn {
  color: #FFF;
}
.reports-container {
  height: 100%;
  max-width: 100%;
  padding-right: 0;
  padding-bottom: 0;
}

.reports__wrapper {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.sub-nav__navigation.reports {
  width: 225px;
}
.sub-nav__navigation.reports .overview-link {
  margin-bottom: 25px;
}
.sub-nav__navigation.reports .overview-divider-title {
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #CCCCCC;
  margin-top: 32px;
}
.sub-nav__navigation.reports .offline-report {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sub-nav__navigation.reports .offline-report__match {
  display: inline-block;
  margin-right: 8px;
}
.sub-nav__navigation.reports .offline-report__text {
  vertical-align: middle;
}
.sub-nav__navigation.reports .offline-report__team-img {
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-color: #22323c;
  background-blend-mode: screen;
  display: inline-block;
  width: 16px;
  height: 20px;
  vertical-align: middle;
}
.sub-nav__navigation.reports .offline-report__team-img + .offline-report__team-img {
  z-index: 2;
}
.sub-nav__navigation.reports .offline-report__player-img {
  width: 20px;
  height: 20px;
  vertical-align: middle;
  border-radius: 10px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  display: inline-block;
  margin-right: 8px;
}
.reports-list {
  height: 100%;
}
.reports-list__empty-container {
  position: relative;
  max-width: 1023px;
}
.reports-list__empty-message {
  position: absolute;
  right: 48px;
  top: 36px;
}
.match-card__tag {
  position: relative;
  left: -6px;
  padding: 0 6px;
  font-size: 12px;
  font-style: normal;
  line-height: 16px;
  letter-spacing: 0.6px;
  font-weight: 700;
  border-radius: 10px;
  color: #FFF;
  white-space: nowrap;
  display: inline-block;
  text-transform: uppercase;
}
.match-card__tag.in_progress {
  background-color: rgba(244, 171, 59, 0.5);
}
.match-card__tag.demo {
  background-color: rgba(159, 81, 191, 0.5);
}
.match-card__tag.completed {
  background-color: rgba(103, 203, 139, 0.5);
}
.match-card__tag.not_started {
  background-color: rgba(212, 60, 102, 0.5);
}
.match-card__team {
  position: relative;
  padding-left: 32px;
  font-size: 19px;
  line-height: 20px;
  font-weight: 700;
  height: 40px;
  overflow: hidden;
  display: flex;
  align-items: center;
}
.match-card__team-image {
  position: absolute;
  width: 24px;
  height: 30px;
  top: 50%;
  left: 0;
  margin-top: -15px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
.match-card__player {
  position: relative;
  padding-left: 48px;
  font-size: 19px;
  line-height: 20px;
  font-weight: 700;
  height: 40px;
  overflow: hidden;
  display: flex;
  align-items: center;
}
.match-card__player-image {
  position: absolute;
  width: 40px;
  height: 40px;
  top: 50%;
  left: 0;
  margin-top: -20px;
  border-radius: 20px;
  background-size: cover;
  background-color: #637581;
  background-repeat: no-repeat;
  background-position: center center;
}
.match-card__match {
  height: 40px;
  position: relative;
  width: 100%;
}
.match-card__match .match-card__team-image {
  left: 50%;
  width: 25px;
  height: 33px;
}
.match-card__match .match-card__team-image:nth-child(1) {
  margin-left: -10px;
  z-index: 2;
}
.match-card__match .match-card__team-image:nth-child(2) {
  margin-left: 10px;
  z-index: 1;
}
/* Colors */
/* Fonts */
/* Dimensions */
.match-card {
  margin: 0 18px 8px 0;
  box-sizing: border-box;
  overflow: hidden;
  display: flex;
  background-color: #3A4C5A;
  border: 1px solid #3A4C5A;
  border-radius: 6px;
  height: 130px;
  width: 320px;
  justify-content: stretch;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.24);
  color: #FFF;
  /*Attributes*/
  /*Controls*/
  /* Content */
}
.match-card__add {
  margin-top: 8px;
}
.match-card__add svg {
  width: 16px;
  height: 16px;
  fill: currentColor;
}
.match-card__container {
  display: inline-block;
  height: 138px;
  width: 338px;
}
.match-card__shadow {
  background: #24323D;
  border-color: #24323D;
  box-shadow: none;
  pointer-events: none;
}
.match-card__shadow:hover {
  background: #24323D;
  border-color: #24323D;
  box-shadow: none;
}
.match-card__loading {
  pointer-events: none;
  opacity: 0.5;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  animation: opacitySpin 1s ease-in-out infinite;
}
.match-card__loading.no-animation {
  animation: none;
}
.match-card__attrs, .match-card__info, .match-card__controls {
  box-sizing: border-box;
}
.match-card__attrs {
  flex-grow: 0;
  flex-shrink: 0;
  padding: 6px 13px 12px 16px;
  width: 130px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.match-card__info {
  flex-grow: 1;
  padding: 16px 16px 16px 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: calc(100% - 176px);
}
.match-card__controls {
  flex-grow: 0;
  flex-shrink: 0;
  width: 46px;
  padding: 16px 0;
  border-left: 1px solid #2D3B46;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.match-card__date {
  font-size: 16px;
  line-height: 20px;
  font-weight: 400;
  color: #CCCCCC;
  text-transform: uppercase;
}
.match-card__league {
  font-size: 12px;
  line-height: 16px;
  color: #637581;
  margin-top: 7px;
  text-transform: uppercase;
  white-space: nowrap;
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
}
.match-card__by {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  color: #637581;
  margin-top: 0;
}
.match-card__button {
  box-sizing: border-box;
  display: block;
  width: 40px;
  height: 40px;
  color: #FFF;
}
.match-card__button:hover {
  color: #35B374;
}
.match-card__button svg {
  width: 40px;
  height: 40px;
  stroke: currentColor;
  fill: none;
}
.match-card__button svg.pdf-icon {
  fill: currentColor;
  stroke: none;
}
.match-card__name {
  display: block;
  width: 100%;
  max-height: 40px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.match-card__divider {
  height: 16px;
  font-size: 12px;
  line-height: 16px;
  color: #637581;
  text-align: center;
  position: relative;
  margin-left: 32px;
}
.match-card__divider:before, .match-card__divider:after {
  content: "";
  height: 1px;
  background: #637581;
  position: absolute;
  width: calc(50% - 15px);
}
.match-card__divider:before {
  left: 0;
  top: 8px;
}
.match-card__divider:after {
  right: 0;
  top: 8px;
}
.match-card:hover {
  background-color: #24323D;
  cursor: pointer;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgwIiBoZWlnaHQ9IjEzMCIgdmlld0JveD0iMCAwIDI4MCAxMzAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0yMDguMjY3IC05NS4zNDM4TDMwMC4zIC0zLjMxMTIyTDcxLjg2NTMgMjI1LjEyM0wtMjAuMTY3MiAxMzMuMDkxTDIwOC4yNjcgLTk1LjM0MzhaIiBmaWxsPSIjMkQzQjQ2Ii8+Cjwvc3ZnPgo=);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  border: 1px solid #3A4C5A;
  color: #35B374;
}

@keyframes opacitySpin {
  0% {
    opacity: 0.5;
  }
  50% {
    opacity: 0.3;
  }
  100% {
    opacity: 0.5;
  }
}
.add-player-form-modal {
  max-width: 640px;
  width: 100%;
  min-width: 320px;
}
.add-player-form-modal .sp-modal__heading svg {
  fill: none;
  stroke: #FFF;
}
.add-player-form-modal .input-placeholder-example {
  font-size: 12px;
  opacity: 0.5;
  line-height: 16px;
}
.add-player-form-modal .jersey input {
  padding: 8px 5px 7px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.sp-modal {
  margin: 0 auto;
  background: #2E3C47;
  max-height: 100vh;
  padding: 24px;
}
.sp-modal__heading {
  display: flex;
  margin-bottom: 16px;
}
.sp-modal__name {
  flex-grow: 2;
  font-size: 13px;
  text-transform: uppercase;
}
.sp-modal__name svg {
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 4px;
  position: relative;
  top: -2px;
}
.sp-modal__close {
  display: block;
  border: none;
  background: none;
  padding: 8px;
}
.sp-modal__close:hover {
  color: #2DC46E;
}
.sp-modal__close svg {
  display: block;
  width: 8px;
  height: 8px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.match-edit-form-modal {
  max-width: 748px;
  width: 100%;
  min-width: 320px;
}

.match-edit-form label {
  font-family: "Source Sans Pro", Helvetica, sans-serif;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 1px;
  text-align: left;
  text-transform: uppercase;
  color: #A4A6A4;
}
.match-edit-form .input:disabled {
  color: #637581;
  border-bottom-color: #637581;
}
.match-edit-form__row {
  margin-top: 24px;
}
.match-edit-form__buttons {
  padding-top: 20px;
  text-align: right;
}
.match-edit-form__buttons .btn {
  margin-left: 24px;
}
.match-edit-form__buttons .btn:nth-child(1) {
  margin-left: 0;
}
.match-edit-form .type-icon__single {
  stroke: currentColor;
  fill: none;
}
.match-edit-form .type-icon__match {
  stroke: none;
  fill: currentColor;
}
/* Colors */
/* Fonts */
/* Dimensions */
.reports__controls {
  display: flex;
  flex-grow: 0;
  flex-shrink: 0;
  justify-content: stretch;
  padding: 0 25px 25px 0;
  max-width: 1023px;
}
.reports__controls__filter, .reports__controls__new {
  flex-shrink: 0;
  margin-left: 24px;
}
.reports__controls__search {
  flex-grow: 1;
}
.reports__controls .btn {
  position: relative;
  height: 44px;
  line-height: 42px;
}
.reports__controls .btn__filter {
  width: 44px;
  padding: 0;
  box-sizing: border-box;
  text-align: center;
}
.reports__controls .btn__filter svg {
  width: 14px;
  height: 42px;
  stroke: currentColor;
  fill: none;
}
.reports__controls .btn__filter__num {
  text-align: center;
  position: absolute;
  display: block;
  right: -11px;
  bottom: -11px;
  border-radius: 11px;
  background: #d33a61;
  color: #FFF;
  font-size: 12px;
  line-height: 22px;
  width: 22px;
  height: 22px;
}
.reports__controls .btn__filter.active {
  color: #FFF;
  background: #35B374;
}
/* Colors */
/* Fonts */
/* Dimensions */
.match-view {
  color: #FFF;
}
.match-view__date {
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  line-height: 18px;
}
.match-view__row {
  display: flex;
  justify-content: center;
  align-items: center;
}
.match-view__match .match-view__name {
  width: calc(50% - 28px);
}
.match-view__match .match-view__name.home {
  text-align: right;
}
.match-view__match .match-view__name.away {
  text-align: left;
}
.match-view__player-img {
  display: inline-block;
  width: 24px;
  height: 24px;
  border-radius: 12px;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  margin-right: 8px;
}
.match-view__team-img {
  display: inline-block;
  width: 20px;
  height: 24px;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
}
.match-view__name {
  font-weight: bold;
  font-size: 16px;
  line-height: 24px;
  overflow: hidden;
}
.match-view__teams {
  margin: 0 8px;
}
.match-view__teams .match-view__team-img + .match-view__team-img {
  margin-left: -8px;
}
.match-view__single .match-view__team-img {
  width: 14px;
  height: 18px;
}
.home-search .player-option:hover, .home-search .player-option:active, .home-search .player-option:focus, .home-search .player-option.is-disabled, .home-search .player-option.is-focused, .home-search .player-option.is-selected {
  background: #24323D !important;
}
.home-search .player-option.react-select__option--is-focused {
  background: #24323D !important;
}
.home-search .player-search-control {
  background: rgba(0, 0, 0, 0.15);
  border-radius: 6px;
  border: none !important;
  padding: 6px 15px;
}
.home-search .player-search-control .search-icon {
  width: 16px;
  height: 16px;
}
.home-search .players-menu {
  background: #19242b;
}

/* Colors */
/* Fonts */
/* Dimensions */
.api-list-filters.reports-filters .api-list-filters__pane {
  position: absolute;
  left: auto;
  top: auto;
  right: auto;
  bottom: auto;
  margin-top: 12px;
  margin-left: -255px;
  border-radius: 8px;
  background: #3A4C5A;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.24);
}
/* Colors */
/* Fonts */
/* Dimensions */
.reports-overview .today-date {
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.5);
}
.reports-overview .overview-heading {
  white-space: nowrap;
  font-weight: 700;
  font-size: 20px;
  line-height: 26px;
  color: #FFFFFF;
  margin-bottom: 16px;
}
.reports-overview .overview-heading a {
  color: #FFF;
}
.reports-overview .overview-heading a:hover {
  color: #35B374;
}
.reports-overview .overview-heading .chevron-right {
  vertical-align: middle;
  stroke: currentColor;
  width: 24px;
  height: 24px;
  margin-left: 8px;
}
.reports-overview__col {
  width: 320px;
  overflow: hidden;
  margin-left: 18px;
}
.reports-overview__col:nth-child(1) {
  margin-left: 0;
}
.reports-overview__block {
  display: flex;
  margin-top: 48px;
  flex-wrap: wrap;
}
.reports-overview__block__upcoming {
  margin-top: 24px;
  display: block;
}
.reports-overview__matches {
  margin-top: 24px;
}
.reports-overview__matches__row {
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  height: 130px;
}
.reports-overview__matches__column {
  min-height: 406px;
}
.reports-overview__matches__column p {
  color: rgba(255, 255, 255, 0.7);
}
.reports-overview__matches__column .demo-message {
  margin-top: 40px;
  margin-left: 46px;
}
.reports-overview__matches__column .demo-message.player-demo-message {
  margin-top: 56px;
}
/* Colors */
/* Fonts */
/* Dimensions */
.reports__group-ad {
  overflow: hidden;
  width: 320px;
  position: relative;
  height: 406px;
}
.reports__group-ad__bg {
  position: absolute;
  z-index: 1;
  display: block;
  width: 320px;
  height: 130px;
  background: #24323D;
  border-radius: 6px;
  left: 0;
  top: 0;
}
.reports__group-ad__bg:nth-child(2) {
  top: 138px;
}
.reports__group-ad__bg:nth-child(3) {
  top: 276px;
}
.reports__group-ad__pane {
  border-radius: 4px;
  margin: 43px auto 0;
  width: 190px;
  padding: 16px;
  background: #3A4C5A;
  position: relative;
  z-index: 2;
}
.reports__group-ad__pane svg {
  width: 80px;
  height: 80px;
  display: block;
  margin: 0 auto;
}
.reports__group-ad__pane h3 {
  margin: 16px 0;
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  text-align: center;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #FFFFFF;
}
.reports__group-ad__pane p {
  margin: 16px 0;
  font-size: 13px;
  line-height: 16px;
  color: #A4A6A4;
}
.reports__group-ad__pane .btn {
  border: none;
  background: #35B374;
  color: #FFF;
  font-size: 13px;
  text-transform: uppercase;
  height: 40px;
  line-height: 40px;
  white-space: nowrap;
  padding-left: 10px;
  padding-right: 10px;
  text-align: center;
}
.reports__group-ad__pane .btn:hover {
  background: #FFF;
  color: #35B374;
}
/* Colors */
/* Fonts */
/* Dimensions */
.homepage {
  display: flex;
}
.homepage__search {
  display: flex;
  position: relative;
  z-index: 5;
  width: 100%;
}
.homepage__search .home-search {
  flex-grow: 2;
}
.homepage__interactive-card {
  background-color: #24323D;
  border: 1px solid #24323D;
  border-radius: 6px;
  cursor: pointer;
  background-image: none;
}
.homepage__interactive-card:hover {
  border: 1px solid #3A4C5A;
}
@media (max-width: 1199px) {
  .homepage {
    display: block;
  }
}
.homepage__sidebar {
  width: 215px;
  padding: 72px 24px 24px;
}
@media (max-width: 1199px) {
  .homepage__sidebar {
    width: auto;
    padding: 36px 24px 0;
    margin-bottom: 24px;
  }
}
.homepage__greeting {
  font-size: 28px;
  line-height: 35px;
  font-weight: 300;
}
.homepage__greeting strong {
  font-weight: 700;
}
@media (max-width: 959px) {
  .homepage__greeting {
    font-size: 20px;
    line-height: 26px;
  }
  .homepage__greeting br {
    display: none;
  }
}
.homepage__content {
  flex-grow: 1;
  width: calc(100% - 215px);
  padding: 72px 24px 24px;
  max-width: 1300px;
}
@media (max-width: 1199px) {
  .homepage__content {
    padding: 0 24px 24px;
    width: 100%;
  }
}
.homepage__row {
  display: flex;
  margin-top: 24px;
}
.homepage__row:nth-child(1) {
  margin-top: 0;
}
@media (max-width: 959px) {
  .homepage__row {
    display: block;
  }
}
.homepage__block {
  background: #2D3B46;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.24);
  border-radius: 6px;
  flex-grow: 1;
  padding: 24px;
  margin-left: 24px;
}
@media (max-width: 959px) {
  .homepage__block {
    margin-left: 0;
    margin-top: 24px;
  }
}
.homepage__block.watchlists-block {
  max-width: 720px;
  width: 100%;
}
@media (max-width: 1379px) {
  .homepage__block.watchlists-block {
    max-width: 570px;
  }
}
@media (max-width: 1199px) {
  .homepage__block.watchlists-block {
    max-width: 390px;
  }
}
@media (max-width: 959px) {
  .homepage__block.watchlists-block {
    max-width: 100%;
  }
}
.homepage__block.players-block {
  flex-shrink: 2;
}
.homepage__block.matches-block {
  width: 100%;
  padding-right: 0;
}
.homepage__block:nth-child(1) {
  margin-left: 0;
}
.homepage__block-header {
  vertical-align: middle;
  white-space: nowrap;
  margin-bottom: 24px;
}
.homepage__block-header svg {
  width: 16px;
  height: 16px;
  display: inline-block;
  margin: 0 6px;
  vertical-align: middle;
  fill: none;
  position: relative;
  top: -2px;
}
.homepage__block-header svg:nth-child(1) {
  margin-left: 0;
}
.homepage__block-header a {
  color: #FFF;
  text-transform: uppercase;
  letter-spacing: 1px;
  line-height: 16px;
  font-size: 13px;
}
.homepage__block-header a svg {
  fill: none;
  stroke: currentColor;
}
.homepage__block-header a svg.players-icon {
  width: 16px;
  height: 17px;
}
.homepage__block-header a svg.pitch-icon {
  width: 16px;
  height: 16px;
}
.homepage__block-header a svg.watchlists-icon {
  width: 18px;
  height: 16px;
}
.homepage__block-header a svg.pitch-icon, .homepage__block-header a svg.watchlists-icon {
  fill: currentColor;
  stroke: none;
}
.homepage__block-header a:hover {
  color: #35B374;
}
/* Colors */
/* Fonts */
/* Dimensions */
.homepage__reports {
  display: flex;
  flex-wrap: wrap;
  height: 130px;
  max-width: 100%;
  width: 100%;
  overflow: hidden;
}
@media (max-width: 959px) {
  .homepage__reports {
    height: auto;
  }
}
.homepage__reports .demo-message {
  margin: 15px 20px 0 70px;
}
@media (max-width: 959px) {
  .homepage__reports .demo-message {
    margin-left: 50px;
    width: 140px;
  }
}
.homepage__reports .firstmatch {
  display: inline-block;
  font-size: 22px;
  font-weight: 700;
  margin: 8px 0 0 16px;
  width: 240px;
  line-height: 130%;
  opacity: 0.8;
  vertical-align: top;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
}
.homepage__reports-item {
  cursor: pointer;
  flex-grow: 0;
  flex-shrink: 0;
  position: relative;
  list-style: none;
}
@media (max-width: 959px) {
  .homepage__reports-item {
    margin-bottom: 8px;
  }
}
.homepage__reports-item .match-card {
  background-color: #24323D;
  border-color: #24323D;
}
.homepage__reports-item .match-card:hover {
  border-color: #3A4C5A;
}
.homepage__reports-add {
  width: 280px;
  height: 130px;
  text-align: center;
  font-size: 16px;
  line-height: 20px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 700;
  flex-shrink: 0;
  flex-grow: 0;
  background: #24323D;
  border-radius: 6px;
  padding: 32px 16px 14px;
  color: #FFF;
  cursor: pointer;
  margin-bottom: 8px;
}
.homepage__reports-add svg {
  width: 27px;
  height: 27px;
  display: block;
  margin: 0 auto 18px;
}
@media (max-width: 959px) {
  .homepage__reports-add {
    width: 130px;
    height: 130px;
    padding-top: 24px;
  }
}
.homepage__reports-add:hover {
  opacity: 1;
  color: #35B374;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjgwIiBoZWlnaHQ9IjEzMCIgdmlld0JveD0iMCAwIDI4MCAxMzAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0yMDguMjY3IC05NS4zNDM4TDMwMC4zIC0zLjMxMTIyTDcxLjg2NTMgMjI1LjEyM0wtMjAuMTY3MiAxMzMuMDkxTDIwOC4yNjcgLTk1LjM0MzhaIiBmaWxsPSIjMkQzQjQ2Ii8+Cjwvc3ZnPgo=);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}
.homepage__reports-add:hover .day, .homepage__reports-add:hover .time, .homepage__reports-add:hover .league {
  color: #FFF;
}
/* Colors */
/* Fonts */
/* Dimensions */
.homepage .players-block {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: stretch;
}
.homepage .players-block .homepage__block-content {
  flex-basis: 100%;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  align-items: stretch;
}
.homepage__players-list {
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  justify-content: stretch;
  align-items: stretch;
  align-content: center;
}
.homepage__players-list .demo-message {
  left: 30%;
  margin-top: 70px;
}
.homepage__players-add {
  width: 100%;
  margin-top: 8px;
  padding: 8px;
  display: flex;
  text-align: left;
  color: #FFF;
  font-size: 16px;
  line-height: 22px;
  font-weight: bold;
  text-transform: uppercase;
  align-items: center;
  position: relative;
  flex-basis: 17%;
}
.homepage__players-add svg {
  width: 22px;
  height: 22px;
  position: absolute;
  right: 21px;
  top: 50%;
  margin-top: -11px;
}
.homepage__players-add .homepage__player-image {
  background-size: contain;
  margin-right: 8px;
  vertical-align: middle;
}
.homepage__players-add:hover {
  color: #35B374;
}
.homepage__player {
  margin-top: 8px;
  border-radius: 6px;
  padding: 8px;
  display: flex;
  align-items: center;
  position: relative;
  flex-basis: 17%;
  color: #FFF;
}
.homepage__player .favorite-icon {
  width: 28px;
  height: 28px;
  margin-right: 12px;
}
.homepage__player:hover {
  color: #35B374;
}
.homepage__player:hover .homepage__player-image {
  background-color: #3A4C5A;
}
.homepage__player:hover .homepage__player-info .team {
  color: #FFF;
}
.homepage__player-image {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  margin-right: 8px;
  border-radius: 50%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #2D3B46;
}
.homepage__team-image {
  width: 16px;
  height: 20px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  margin-right: 4px;
  display: inline-block;
  background-color: #24323D;
  background-blend-mode: screen;
}
.homepage__player-info {
  flex-grow: 1;
  width: 100%;
}
.homepage__player-info .name {
  font-size: 19px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 0.25px;
  text-align: left;
  margin-bottom: 2px;
}
.homepage__player-info .team {
  display: flex;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  letter-spacing: 0.25px;
  text-align: left;
  color: #CCC;
}
.homepage__players-demo {
  margin-top: 8px;
  font-size: 22px;
  line-height: 28px;
  font-weight: 700;
}
.homepage__add-to-favorite-container {
  position: relative;
}
/* Colors */
/* Fonts */
/* Dimensions */
.homepage__watchlists {
  display: flex;
  flex-wrap: wrap;
  justify-content: left;
  overflow: hidden;
  height: 432px;
  position: relative;
  margin-top: -8px;
}
.homepage__watchlists .demo-message {
  position: absolute;
  left: 50%;
  top: 270px;
}
.homepage__watchlists .demo-message.no-flex {
  position: relative;
  left: 25px;
  top: 45px;
}
@media (max-width: 1379px) {
  .homepage__watchlists {
    height: 360px;
  }
  .homepage__watchlists .demo-message {
    top: 230px;
  }
  .homepage__watchlists .demo-message.no-flex {
    position: relative;
    width: 176px;
    left: 25px;
    top: 45px;
  }
}
@media (max-width: 1199px) {
  .homepage__watchlists {
    height: auto;
  }
  .homepage__watchlists .demo-message {
    position: relative;
    display: block;
    margin-top: 45px;
    top: 0;
    left: 30%;
  }
}
@media (max-width: 959px) {
  .homepage__watchlists {
    height: auto;
    justify-content: center;
  }
  .homepage__watchlists .demo-message {
    left: 10%;
    flex-basis: 70%;
  }
}
.homepage__watchlists .homepage__interactive-card {
  width: calc(33% - 8px);
  height: 208px;
  display: flex;
  flex-direction: column;
  margin: 8px 8px 0 0;
  padding: 0 16px 16px;
  justify-content: space-between;
}
@media (max-width: 1379px) {
  .homepage__watchlists .homepage__interactive-card {
    width: 163px;
    height: 172px;
  }
}
.homepage__watchlists .upgrade-plan, .homepage__watchlists .add-watchlist {
  font-size: 16px;
  line-height: 22px;
  text-transform: uppercase;
  font-weight: bold;
  color: #FFF;
  letter-spacing: 0.14em;
  text-align: center;
}
.homepage__watchlists .upgrade-plan .icon-container, .homepage__watchlists .add-watchlist .icon-container {
  width: 80px;
  height: 80px;
}
.homepage__watchlists .upgrade-plan:hover, .homepage__watchlists .add-watchlist:hover {
  color: #35B374;
}
.homepage__watchlists .upgrade-plan .add-watchlist__text, .homepage__watchlists .add-watchlist .add-watchlist__text {
  display: block;
  max-width: 100px;
  margin: 0 auto;
}
.homepage__watchlists .upgrade-plan svg, .homepage__watchlists .add-watchlist svg {
  display: block;
  width: 27px;
  height: 27px;
  margin: 0 auto;
}
.homepage__watchlists .upgrade-plan svg {
  margin-top: 0;
  width: 81px;
  height: 80px;
}
.homepage__watchlists .bg-img {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background-size: cover;
  background-position: center center;
}
.homepage__watchlists h3 {
  font-size: 22px;
  line-height: 28px;
  font-weight: 700;
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 2;
  text-align: center;
  top: 50%;
  margin-top: -14px;
}
.homepage__watchlists h3.new {
  position: relative;
  left: auto;
  top: auto;
  margin-top: 16px;
}
.homepage__watchlist {
  text-align: left;
  color: #FFF;
  position: relative;
}
.homepage__watchlist:hover {
  color: #35B374;
}
.homepage__watchlist:hover .homepage__watchlist-meta {
  color: #FFF;
}
.homepage .watchlist-icon {
  margin: 0 auto;
  display: block;
  position: relative;
}
.homepage__watchlist-icon-container {
  width: 100%;
  height: 100%;
  max-height: 135px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  text-align: center;
}
.homepage__watchlist-name {
  font-size: 16px;
  font-style: normal;
  font-weight: bold;
  line-height: 20px;
  text-align: left;
  /*white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;*/
}
.homepage__watchlist-meta {
  font-size: 12px;
  line-height: 16px;
  font-style: normal;
  font-weight: 400;
  color: #CCCCCC;
}
/* Colors */
/* Fonts */
/* Dimensions */
.home-search .player-view {
  display: flex;
  color: #FFF;
}
.home-search .player-view .custom-player-indicator {
  display: inline-block;
  padding: 2px 5px;
  font-size: 9px;
  line-height: 11px;
  vertical-align: super;
  text-transform: uppercase;
  background: #188538;
  color: #FFF;
  border-radius: 2px;
  margin-left: 4px;
}
.home-search .player-view__img {
  width: 25px;
  height: 25px;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 8px;
}
.home-search .player-view__name {
  font-weight: bold;
}
.home-search .player-view__team-img {
  width: 16px;
  height: 16px;
  display: inline-block;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 4px;
  vertical-align: middle;
}
.home-search .player-view__team-name {
  font-size: 12px;
  opacity: 0.7;
  display: block;
}
.home-search .player-option:hover, .home-search .player-option:active, .home-search .player-option:focus, .home-search .player-option.is-disabled, .home-search .player-option.is-focused, .home-search .player-option.is-selected {
  background: #24323D !important;
}
.home-search .player-option.react-select__option--is-focused {
  background: #24323D !important;
}
.home-search .player-search-control {
  background: rgba(0, 0, 0, 0.15);
  border-radius: 6px;
  border: none !important;
  padding: 6px 15px;
}
.home-search .player-search-control .search-icon {
  width: 16px;
  height: 16px;
}
.home-search .players-menu {
  background: #19242b;
}
.gender-switcher {
  margin-right: 24px;
  background: #2D3B46;
  height: 44px;
  border-radius: 6px;
  max-width: 226px;
  flex-grow: 1;
  padding: 4px;
}
.gender-switcher button {
  width: 50%;
  height: 36px;
  background: transparent;
  border-radius: 6px;
  border: none;
  outline: none;
  font-size: 13px;
  line-height: 36px;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.gender-switcher button svg {
  width: 16px;
  height: 16px;
  vertical-align: middle;
  margin-right: 4px;
  position: relative;
  top: -2px;
}
.gender-switcher button.active {
  background: #637581;
}
/* Colors */
/* Fonts */
/* Dimensions */
.create-match-button {
  background: #35B374;
  color: #FFF;
  border: none;
  height: 44px;
  line-height: 44px;
}
.create-match-button__container {
  margin-left: 24px;
  position: relative;
  z-index: 5;
}
.create-match-button__demo {
  position: absolute;
  top: 100%;
  margin-top: 56px;
  right: 0;
  z-index: 5;
}
.create-match-button:hover {
  background: #FFF;
  color: #35B374;
}
/* Colors */
/* Fonts */
/* Dimensions */
.shadow-team__content {
  display: flex;
  padding: 30px 0 0;
}
.shadow-team__content.disabled {
  pointer-events: none;
  opacity: 0.5;
}
.shadow-team__lineup-container {
  margin: 0 auto;
  width: 100%;
}
.shadow-team__lineup-content {
  margin: 0 0 0 5px;
  position: relative;
}
.shadow-team__lineup-content.active {
  z-index: 3;
}
.shadow-team__lineup-content.active .fade {
  position: absolute;
  z-index: 3;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
}
.shadow-team__lineup {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.shadow-team__settings {
  margin: 0 0 30px;
  position: relative;
  z-index: 3;
  width: 685px;
}
.shadow-team__settings::after {
  clear: both;
  content: "";
  display: table;
}
.shadow-team__favorite-add {
  float: right;
  position: relative;
  top: 16px;
}
.shadow-team__favorite-add .create-icon {
  width: 11px;
  height: 15px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -1px;
  margin-right: 6px;
}
.shadow-team__name, .shadow-team__formation, .shadow-team__autofill {
  float: left;
}
.shadow-team__name label, .shadow-team__formation label, .shadow-team__autofill label {
  font-size: 13px;
  letter-spacing: 0.5px;
  line-height: 1.2;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
}
.shadow-team__name .input input, .shadow-team__name .input select, .shadow-team__formation .input input, .shadow-team__formation .input select, .shadow-team__autofill .input input, .shadow-team__autofill .input select {
  display: block;
  width: 100%;
  color: #2DC46E;
  font-size: 16px;
  line-height: 27px;
  border-bottom: 1px solid;
  border-radius: 0;
}
.shadow-team__name .input .Select-control input, .shadow-team__formation .input .Select-control input, .shadow-team__autofill .input .Select-control input {
  border-bottom: none;
}
.shadow-team__name {
  width: 180px;
  margin-right: 20px;
}
.shadow-team__formation {
  width: 120px;
  margin-right: 20px;
}
.shadow-team__autofill {
  width: 120px;
  margin-right: 20px;
}
.shadow-team__checkbox {
  float: left;
}
.shadow-team__checkbox .group-check {
  margin: 25px 0 0;
}
/* Colors */
/* Fonts */
/* Dimensions */
.shadow-team__player-controls {
  position: absolute;
  background: #2A333A;
  top: 0;
  width: 200px;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.35);
}
.shadow-team__player-controls.left {
  right: 100%;
  left: auto;
  margin-right: 3px;
}
.shadow-team__player-controls.right {
  left: 100%;
  right: auto;
  margin-left: 3px;
}
.shadow-team__player-controls ul li {
  padding: 10px 10px;
  font-size: 14px;
  font-weight: 400;
  border-top: 1px solid #294254;
  color: #FFF;
}
.shadow-team__player-controls ul li.profile {
  padding: 0;
}
.shadow-team__player-controls ul li a {
  padding: 8px 10px;
  display: block;
  color: #FFF;
}
.shadow-team__player-controls ul li a:hover {
  color: #2DC46E;
}
.shadow-team__player-controls ul li:nth-child(1) {
  border-top: none;
}
.shadow-team__player-controls ul li .list-icon.tri-up, .shadow-team__player-controls ul li .list-icon.tri-down {
  display: inline-block;
  margin-right: 5px;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  position: relative;
  top: -1px;
}
.shadow-team__player-controls ul li .list-icon.tri-up {
  border-bottom: 6px solid;
}
.shadow-team__player-controls ul li .list-icon.tri-down {
  border-top: 6px solid;
}
.shadow-team__player-controls ul li .list-icon.remove {
  width: 11px;
  height: 11px;
  display: inline-block;
  fill: currentColor;
  margin-right: 4px;
  position: relative;
  top: 1px;
  left: auto;
}
.shadow-team__player-controls ul li:hover {
  color: #2DC46E;
}
/* Colors */
/* Fonts */
/* Dimensions */
.shadow-team__players-list {
  transition-property: margin-bottom;
  transition-timing-function: ease-out;
  transition-duration: 350ms;
}
.shadow-team__players-list .player-item {
  padding: 6px 5px 6px 6px;
  font-size: 14px;
  line-height: 16px;
  font-weight: bold;
  background: #2F3C45;
  cursor: pointer;
  border-top: 1px solid #315065;
  position: relative;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.35);
}
.shadow-team__players-list .player-item .player-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.shadow-team__players-list .player-item .player-name.with-rating {
  margin-right: 16px;
}
.shadow-team__players-list .player-item .final-rating {
  position: absolute;
  font-size: 10px;
  font-weight: bold;
  right: 0;
  top: 0;
  bottom: 0;
  width: 25px;
  text-align: center;
  color: #FFF;
  line-height: 34px;
}
.shadow-team__players-list .player-item .team-image {
  width: 17px;
  height: 22px;
  position: relative;
  top: -1px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 6px;
  background-size: contain;
}
.shadow-team__players-list .player-item.first {
  position: relative;
  border-radius: 2px;
  margin-left: -2px;
  margin-right: -2px;
  z-index: 2;
  background: #942845;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.4);
  border-top: none;
}
.shadow-team__players-list .player-item.active {
  background: #252f36;
}
.shadow-team__players-list .player-item.active.first {
  background: #80233c;
}
.shadow-team__players-list .player-item:hover {
  background: #252f36;
}
.shadow-team__players-list .player-item:hover.first {
  background: #80233c;
}
.shadow-team__players-list .player-item.first + .player-item {
  border-top: none;
}
.shadow-team__show-more-button {
  background: #2F3C45;
  color: #FFF;
  border: none;
  border-radius: 100%;
  display: block;
  margin: -24px 0px -26px;
  width: 41px;
  height: 50px;
  line-height: 14px;
  text-align: center;
  padding: 0;
}
.shadow-team__show-more-button svg {
  width: 20px !important;
  height: 20px !important;
  left: 0 !important;
  top: 8px !important;
  position: relative !important;
  fill: currentColor !important;
}
.shadow-team__show-more-button.isOpen svg {
  transform: rotate(-180deg);
}
.shadow-team__show-more-button:hover {
  color: #2DC46E;
}
/* Colors */
/* Fonts */
/* Dimensions */
.shadow-team__add-player {
  position: relative;
  background: #2A333A;
  margin-left: -30px;
  margin-right: -30px;
  border-radius: 2px;
  box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.5);
}
.shadow-team__add-player .empty-message {
  padding: 4px 6px !important;
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 16px !important;
  text-transform: uppercase !important;
  font-weight: 400 !important;
  opacity: 0.8;
  width: 100% !important;
}
.shadow-team__add-player ul {
  max-height: 240px;
}
.shadow-team__add-player ul li {
  height: 35px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  position: relative;
  user-select: none;
}
.shadow-team__add-player__player {
  border-top: 1px solid #294254;
  font-size: 14px;
  line-height: 26px;
}
.shadow-team__add-player__player > span {
  padding: 4px 6px;
  display: block;
}
.shadow-team__add-player__player:hover {
  color: #2DC46E;
}
.shadow-team__add-player__player.active {
  background: #1f262b;
}
.shadow-team__add-player__player .team-image {
  width: 17px;
  height: 22px;
  position: relative;
  top: -2px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 6px;
  background-size: contain;
}
.shadow-team__add-player__player:nth-child(1) {
  border-top: none;
}
.shadow-team__add-player__position {
  border-top: 1px solid #294254;
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 400;
  height: 25px !important;
  letter-spacing: 1px;
  background: #323D45;
  opacity: 0.8;
  padding: 5px 6px 3px 10px;
  cursor: default;
}
.shadow-team__add-player-filter input {
  padding-left: 10px;
  padding-right: 10px;
  font-size: 14px;
  padding-top: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid #101a20;
}
.shadow-team__add-player-heading {
  background: #323D45;
  color: rgba(255, 255, 255, 0.6);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 14px;
  padding: 7px 10px;
  border-radius: 2px;
  text-transform: uppercase;
}
.shadow-team__position {
  position: absolute;
  width: 36px;
  height: 36px;
  margin-left: -18px;
  margin-top: -18px;
  cursor: pointer;
  z-index: 2;
}
.shadow-team__position.active {
  z-index: 4;
}
.shadow-team__position .position-mark {
  position: absolute;
  width: 36px;
  height: 36px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 100%;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.15);
  z-index: 5;
}
.shadow-team__position .position-mark:hover {
  background: rgba(255, 255, 255, 0.5);
}
.shadow-team__position .position-mark:hover svg {
  fill: white;
}
.shadow-team__position .position-mark__empty {
  width: 38px;
  height: 38px;
  border-radius: 100%;
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}
.shadow-team__position svg {
  position: absolute;
  width: 14px;
  height: 14px;
  left: 11px;
  top: 11px;
  fill: #a8d1b7;
  pointer-events: none;
}
.shadow-team__players {
  width: 121px;
  margin-left: -41px;
  position: absolute;
  bottom: 100%;
  /*margin-bottom: 2px;*/
}
/* Colors */
/* Fonts */
/* Dimensions */
.shadow-team .container {
  padding-left: 36px;
  padding-right: 36px;
}
.shadow-team__heading {
  margin-bottom: 40px;
}
.shadow-team__heading h3 {
  vertical-align: middle;
  font-size: 28px;
  line-height: 34px;
  font-weight: bold;
}
.shadow-team .demo-message {
  margin: 60px 0 0 120px;
}
.shadow-team .empty-message {
  letter-spacing: 0.2px;
  font-size: 18px;
  line-height: 26px;
  color: rgba(255, 255, 255, 0.75);
  margin: 25px 0;
  width: 50%;
  text-align: left;
  opacity: 0.8;
  font-weight: 400;
}
.shadow-team .tabs-nav {
  position: relative;
  z-index: 2;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-bottom: 1px solid #385161;
  color: rgba(255, 255, 255, 0.75);
  font-size: 14px;
  line-height: 20px;
  margin: 15px 0 0;
}
.shadow-team .tabs-nav .shadow-container {
  padding-bottom: 0 !important;
}
.shadow-team .tabs-nav a:first-child {
  text-align: center;
}
.shadow-team .tabs-nav a, .shadow-team .tabs-nav span {
  padding: 12px 10px 9px;
  margin-right: 0;
  cursor: pointer;
  height: 44px;
  overflow: hidden;
  color: #D8D8D8;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.shadow-team .tabs-nav a .create-icon, .shadow-team .tabs-nav span .create-icon {
  width: 11px;
  height: 15px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -1px;
  margin-right: 6px;
}
.shadow-team .tabs-nav a .close-icon, .shadow-team .tabs-nav span .close-icon {
  width: 24px;
  height: 24px;
  display: inline-block;
  vertical-align: middle;
  padding: 0;
  cursor: pointer;
}
.shadow-team .tabs-nav a .close-icon svg, .shadow-team .tabs-nav span .close-icon svg {
  width: 10px;
  height: 10px;
  position: relative;
}
.shadow-team .tabs-nav a .more-icon, .shadow-team .tabs-nav span .more-icon {
  width: 0;
  height: 0;
  transform: rotateX(180deg);
  transform-origin: 50% 50%;
  padding: 0;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-bottom: 5px solid;
  display: inline-block;
  vertical-align: middle;
  top: -1px;
  position: relative;
}
.shadow-team .tabs-nav a.open .more-icon, .shadow-team .tabs-nav span.open .more-icon {
  transform: rotateX(0deg);
}
.shadow-team .tabs-nav a.more, .shadow-team .tabs-nav span.more {
  position: relative;
  overflow: visible;
}
.shadow-team .tabs-nav a.active, .shadow-team .tabs-nav span.active {
  color: #FFF;
  font-weight: bold;
  border-bottom: 2px solid;
  padding: 12px 10px 8px;
  cursor: default;
}
.shadow-team .tabs-nav a:hover, .shadow-team .tabs-nav span:hover {
  color: #FFF;
}
.shadow-team .tabs-nav .dropdown {
  height: auto;
  width: 100%;
  position: absolute;
  background: #395262;
  padding: 0;
  top: 100%;
  left: 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}
.shadow-team .tabs-nav .dropdown > a, .shadow-team .tabs-nav .dropdown > span {
  text-align: left;
  width: 100%;
  padding: 12px 10px 9px 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}
.shadow-team .tabs-nav .dropdown > a.active, .shadow-team .tabs-nav .dropdown > span.active {
  border-bottom-color: transparent;
  color: #FFF;
}
.shadow-team .tabs-nav .dropdown > a.active .close-icon svg, .shadow-team .tabs-nav .dropdown > span.active .close-icon svg {
  color: #FFF;
  fill: #FFF;
}
.shadow-team .heading {
  font-size: 18px;
  text-transform: uppercase;
  font-weight: 200;
  margin: 0 0 25px;
}
.shadow-team .heading.lined {
  position: relative;
}
.shadow-team .heading.lined span {
  display: inline-block;
  padding-right: 25px;
  background: #f5f6f7;
  position: relative;
  z-index: 2;
}
.shadow-team .heading.lined:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 1px;
  border-bottom: 1px solid #DFE3E6;
  left: 0;
  top: 50%;
}
.shadow-team__table {
  width: 100%;
  table-layout: fixed;
  font-size: 16px;
  line-height: 1.2;
  border: none;
  max-width: 1064px;
  border-collapse: separate;
  border-spacing: 0px 4px;
  margin-bottom: 0px;
}
.shadow-team__table .team-author {
  font-size: 12px;
  line-height: 14px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  opacity: 0.5;
}
.shadow-team__table th, .shadow-team__table td {
  text-align: left;
  padding: 12px 8px 15px;
  border: none;
}
.shadow-team__table th:nth-child(1), .shadow-team__table td:nth-child(1) {
  padding-left: 15px;
}
.shadow-team__table th {
  padding-top: 0;
  padding-bottom: 7px;
  text-align: left;
  font-size: 13px;
  letter-spacing: 1px;
  font-weight: 400;
  font-weight: normal;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
}
.shadow-team__table th .sort {
  width: 6px;
  height: 3px;
  transform: rotate(180deg);
}
.shadow-team__table th .sort.sort-asc {
  transform: rotate(0deg);
}
.shadow-team__table th:last-child {
  width: 41%;
}
.shadow-team__table a {
  color: #2DC46E;
  display: block;
}
.shadow-team__table a:hover {
  color: #fff;
}
.shadow-team__table tbody tr {
  background: #2a3c48;
  border-radius: 4px;
  box-shadow: 0 1px 2px 0px rgba(0, 0, 0, 0.2);
}
.shadow-team__table tbody td {
  margin-bottom: 4px;
  position: relative;
}
.shadow-team__table tbody td.with-demo-badge {
  padding-left: 35px;
}
.shadow-team__table tbody tr:last-child th, .shadow-team__table tbody tr:last-child td {
  border-bottom: none;
  vertical-align: middle;
}
.shadow-team__table tbody td:last-child {
  padding-top: 0px;
  padding-bottom: 0px;
}
.shadow-team__table tbody td:last-child .control-btn {
  padding-top: 10px;
  padding-bottom: 10px;
  height: 42px;
  vertical-align: middle;
  margin-top: 2px;
}
.shadow-team__table tbody td:last-child a {
  padding-top: 12px;
  padding-bottom: 15px;
}
.shadow-team__table tbody td:last-child {
  padding-left: 0px;
}
.shadow-team__table .col__date, .shadow-team__table .col__formation {
  width: 120px;
}
@media screen and (max-width: 959px) {
  .shadow-team__table .col__date {
    display: none;
  }
}
.shadow-team__table .col__controls {
  width: 125px;
}
.shadow-team__table .shadow-team__table-controls {
  min-width: 130px;
  display: block;
}
.shadow-team__table .control-btn {
  display: inline-block;
  text-align: center;
  width: 42px;
  height: 18px;
  cursor: pointer;
  color: #2DC46E;
  opacity: 0.7;
}
.shadow-team__table .control-btn:nth-child(1) {
  margin-left: 0;
}
.shadow-team__table .control-btn svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
}
.shadow-team__table .control-btn:hover {
  color: #fff;
  opacity: 1;
}
.shadow-team__table input {
  font-size: 16px;
  line-height: 21px;
  padding: 0;
}
.shadow-team__edit-row-controls {
  text-align: left;
}
.shadow-team__edit-row-controls a {
  margin-left: 20px;
}
.shadow-team__edit-row-controls a:nth-child(1) {
  margin-left: 0;
}
.shadow-team__edit-row-controls .green-btn {
  color: #2DC46E;
}
.shadow-team__edit-row-controls .red-btn {
  color: #d33a61;
}
.shadow-team__edit-row-controls .red-btn:hover {
  color: #d33a61;
}
.shadow-team .create-team {
  margin: 40px 0 10px 0px;
  max-width: 360px;
  white-space: nowrap;
  /*    &:hover{
        color: $color_GreenAction;
      }*/
}
@media (max-width: 959px) {
  .shadow-team .create-team {
    width: 300px;
    font-size: 13px;
  }
}
.shadow-team .create-team .create-icon {
  width: 11px;
  height: 15px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
  top: -1px;
  margin-right: 6px;
  margin-left: 6px;
}
.shadow-team .group-check {
  margin: 25px 0;
  color: #2DC46E;
  position: relative;
  padding-top: 8px;
  font-size: 14px;
  line-height: 20px;
  text-transform: uppercase;
}
.shadow-team .group-check .checkbox {
  border-color: #2DC46E;
  display: inline-block;
  vertical-align: middle;
  width: 22px;
  height: 22px;
  margin-right: 8px;
  position: relative;
  top: -1px;
}
.shadow-team .group-check .checkbox svg {
  width: 16px;
  height: 16px;
  top: 2px;
  left: 2px;
  position: absolute;
  stroke: #2DC46E;
}
.shadow-team .group-check label {
  cursor: pointer;
}
.shadow-team .group-check label.checked {
  opacity: 1;
}
.shadow-team .filter {
  min-width: 150px;
  user-select: none;
  max-width: 180px;
  margin: 35px 0 20px;
}
.shadow-team .filter__position {
  min-width: 140px;
}
.shadow-team .filter label {
  font-size: 13px;
  letter-spacing: 0.5px;
  line-height: 1.2;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
}
.shadow-team .filter .input-range {
  margin-top: 25px;
}
.shadow-team .filter .input-range .input-range__label--min, .shadow-team .filter .input-range .input-range__label--max {
  display: none;
}
.shadow-team .filter .input-range .input-range__label--value {
  top: -2.2rem;
  color: #2DC46E;
}
.shadow-team .filter .input-range .input-range__track--active {
  background: #2DC46E;
}
.shadow-team .filter .input-range .input-range__slider {
  background: #263742;
  border-color: #2DC46E;
  width: 26px;
  height: 26px;
  margin-left: -11px;
  margin-top: -13px;
}
.shadow-team .filter .input-range .input-range__track--background {
  background: rgba(255, 255, 255, 0.3);
}
.shadow-team .filter:nth-child(1) {
  margin-left: 0;
}
.shadow-team .filter__checkbox {
  min-width: 160px;
  margin-left: 25px;
  position: relative;
  padding-left: 25px;
  /*text-transform: uppercase;*/
  /*letter-spacing: 1px;*/
  font-size: 15px;
  margin-top: 25px;
  opacity: 0.7;
  color: #2DC46E;
}
.shadow-team .filter__checkbox.checked {
  opacity: 1;
}
.shadow-team .filter .checkbox_label {
  margin-left: 6px;
  display: block;
  line-height: 130%;
  width: 80px;
}
.shadow-team .filter .checkbox {
  border: 1px solid #2DC46E;
  width: 24px;
  height: 24px;
  top: -2px;
}
.shadow-team .filter .checkbox svg {
  position: absolute;
  left: 3px;
  top: 3px;
  width: 16px;
  height: 16px;
}
.shadow-team .filter.select-scout {
  margin-left: 0px;
}
.shadow-team .upgrade-message {
  margin-top: 45px;
  font-size: 18px;
  line-height: 26px;
  color: rgba(255, 255, 255, 0.75);
  text-align: left;
  opacity: 0.8;
  font-weight: 400;
  letter-spacing: 0.2px;
}

.upgrade-placeholder {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
.upgrade-placeholder .img {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 2;
  opacity: 0.1;
}
.upgrade-placeholder h3 {
  padding-left: 25px;
  padding-right: 25px;
  width: 100%;
  text-align: center;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
}

/*# sourceMappingURL=app.0503670b2d3ac0448601.css.map*/