@import url("../font-awesome/css/svg-with-js.css");
@import url("../flaticon/flaticon.css");
@import url("jPushMenu.css");
@import url("jquery-ui.min.css");
@import url("jquery-ui.theme.css");
@import url("bootstrap.min.css");
@import url("../slick/slick.css");
@import url("../slick/slick-theme.css");
@import url("animate.css");
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,700");

/*
Black: #333
Red: #CC0000
Dk Red: #990000
White: #FFF
*/

.table-striped {
  background-color: #fff; }
  .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, 0.01); }
  .table-striped tbody tr td {
    vertical-align: middle;
    white-space: nowrap; }
    .table-striped tbody tr td .form-check {
      margin-bottom: 0; }
    .table-striped tbody tr td .no-striped tr {
      background-color: #fff; }
      .table-striped tbody tr td .no-striped tr td {
        vertical-align: middle; }
        .table-striped tbody tr td .no-striped tr td .form-check {
          margin-bottom: 0; }

.table .thead-light th {
  background-color: #111;
  color: white;
  border: none; }
.table thead th {
  border-width: 1px; }

.table-dark {
  color: #fff;
  background-color: #241f21; }

.table-dark td {
  border-color: #ddd;
  vertical-align: middle;
  font-size: 1.25rem; }
.table-dark th {
  border-color: #ddd;
  vertical-align: middle; }
.table-dark thead th {
  border-color: #ddd;
  vertical-align: middle; }

.dropdown-item.active,
.dropdown-item:active {
  background-color: #ddd;
  color: #241f21; }

.btn:not([disabled]):not(.disabled).active,
.btn:not([disabled]):not(.disabled):active {
  background-color: #990000; }

.btn-primary.disabled, .btn-primary:disabled {
  background-color: #e88e5e;
  border-color: #e88e5e; }

html, body {
  font-size: 16px;
  line-height: 2;
  color: #333;
  padding: 0;
  margin: 0;
  overflow-x: hidden;
  font-weight: 300;
  background-color: #111;
  font-family: "Montserrat", sans-serif;
  letter-spacing: 1px;
  text-rendering: optimizeLegibility; }

h1, h2, h3, h4, h5, h6 {
  margin: 0.5rem 0;
  font-family: "Montserrat", sans-serif;
  line-height: 1.8;
  letter-spacing: 0; }

strong, b {
  font-weight: 900; }

.row {
  margin-left: -1rem;
  margin-right: -1rem; }

a {
  color: #666;
  font-weight: 500;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out; }
  a:hover {
    color: #df6658; }

img {
  max-width: 100%;
  height: auto; }

ul {
  margin-bottom: 0;
  padding-left: 2rem; }

.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
  padding-left: 1rem;
  padding-right: 1rem; }

.btn {
  font-size: .9rem;
  font-family: "Montserrat", sans-serif;
  letter-spacing: 2px;
  font-weight: normal;
  text-transform: uppercase; }

.btn-primary {
  background-color: #df6658;
  border: none;
  color: #fff;
  border-radius: 5px;
  padding: 6px 20px; }
  .btn-primary:hover {
    background-color: #df6658;
    border-color: #df6658;
    filter: brightness(1.1); }

.btn-warning {
  background-color: #c8c322;
  border-color: #c8c322; }

.btn-border-black {
  background-color: transparent;
  border: 0.25rem solid #000;
  border-radius: 0;
  font-weight: bold;
  color: #000;
  transition: all .3s; }
  .btn-border-black:hover {
    background-color: #e88e5e;
    border: 0.25rem solid #e88e5e;
    color: #fff; }

.btn-default {
  background-color: #3e7f38;
  border: none;
  color: #fff;
  border-radius: 5px;
  padding: 6px 20px; }
  .btn-default:hover {
    color: #fff;
    filter: brightness(1.1); }

.btn-default.view {
  background-color: #57ab4f;
  border-color: #57ab4f;
  color: #fff; }

.grid-bg {
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg width='64' height='64' viewBox='0 0 64 64' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 16c4.418 0 8-3.582 8-8s-3.582-8-8-8-8 3.582-8 8 3.582 8 8 8zm0-2c3.314 0 6-2.686 6-6s-2.686-6-6-6-6 2.686-6 6 2.686 6 6 6zm33.414-6l5.95-5.95L45.95.636 40 6.586 34.05.636 32.636 2.05 38.586 8l-5.95 5.95 1.414 1.414L40 9.414l5.95 5.95 1.414-1.414L41.414 8zM40 48c4.418 0 8-3.582 8-8s-3.582-8-8-8-8 3.582-8 8 3.582 8 8 8zm0-2c3.314 0 6-2.686 6-6s-2.686-6-6-6-6 2.686-6 6 2.686 6 6 6zM9.414 40l5.95-5.95-1.414-1.414L8 38.586l-5.95-5.95L.636 34.05 6.586 40l-5.95 5.95 1.414 1.414L8 41.414l5.95 5.95 1.414-1.414L9.414 40z' fill='%23dddddd' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
  background-repeat: repeat;
  border-bottom: 1px solid #ddd;
  border-top: 1px solid #ddd; }

.fa-briefcase-medical {
  color: #e88e5e; }

p.red {
  color: #df6658; }

.top-nav {
  padding: 0.5rem;
  background-color: #111;
  display: flex;
  flex-direction: row;
  justify-content: space-between; }
  .top-nav .language-form {
    max-width: 4rem;
    margin-right: 0.5rem; }
    .top-nav .language-form .form-group {
      margin-bottom: 0; }
      .top-nav .language-form .form-group select {
        font-size: 0.85rem; }
  .top-nav .nav .nav-link {
    padding: 0.5rem;
    color: #fff;
    font-size: 0.85rem; }
  .top-nav .profile-info {
    display: flex;
    flex-direction: row;
    align-items: center;
    color: #fff; }
    .top-nav .profile-info img {
      max-width: 2rem;
      border-radius: 100%;
      margin-right: 0.5rem; }
    .top-nav .profile-info a {
      margin-right: 0.5rem;
      color: #fff; }

.nav-pills .nav-link {
  margin-right: 3px;
  margin-bottom: 2px;
  background-color: #3e7f38;
  color: #fff; }

.main-landing {
  background-color: transparent;
  position: absolute;
  z-index: 40;
  right: 0; }

.navbar {
  background-color: #FFFFFF;
  padding: .2rem 1rem; 
  border-bottom: 1px solid #333;
}
  .navbar .nav-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; }
    .navbar .nav-item .nav-link {
      padding: 1rem;
      letter-spacing: 1px;
      font-size: .8rem;
      text-transform: uppercase;
      color: #373f46; }
      .navbar .nav-item .nav-link:hover {
        opacity: 1;
        color: #df6658; }
      .navbar .nav-item .nav-link .active {
        color: #df6658; }
  .navbar .navbar-wrap {
    width: 100%; }
  .navbar .navbar-brand {
    padding: 0; }
    .navbar .navbar-brand img {
      max-height: 3rem;
      position: absolute;
      top: 0.5rem;
      max-width: 65%; 
      z-index: 500; }
    .navbar .navbar-brand a {
      color: #fff;
      font-size: 1.4rem; }
    .navbar .navbar-brand h3 {
      font-size: 1.6rem;
      line-height: 1;
      padding-top: 5px;
      text-transform: uppercase; }

.mobile {
  display: none; }

.toggle-menu {
  /*display: none;*/
  font-size: 2rem;
  background-color: transparent;
  border-color: transparent; 
  line-height: 3rem;
}

.full-nav {
  width: 100%;
  padding-right: 0; }

pre {
  background-color: #fff;
  border-radius: 0.25rem; }

.landing-nav {
  display: none; }

h1.title {
  color: #e88e5e; }

.register {
  background-size: cover;
  background-position: center center;
  color: #fff;
  font-weight: normal;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  padding: 2rem; }
  .register .logo {
    max-width: 10rem; }
  .register a {
    color: #57ab4f; }
  .register h1 {
    color: #fff; }
  .register .btn {
    color: #fff; }

.register-sidebar ul {
  margin-bottom: 0;
  padding-left: 2rem;
  list-style: none; }
  .register-sidebar ul li {
    position: relative; }
  .register-sidebar ul li:before {
    content: "\25AA";
    color: #df6658;
    position: absolute;
    left: -1rem; }

.main-overlay {
  background-color: #C5c5c5;
  background-repeat: repeat;
  opacity: 0;
  z-index: 5;
  position: relative;
  height: 100vh; }
  .main-overlay .link-group {
    text-align: right;
    padding: 0.5rem 1rem; }
    .main-overlay .link-group .text-link {
      color: #fff;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 2px;
      font-size: 1rem;
      padding: 0.5rem 0;
      display: inline-block;
      margin: 0 auto; }
      .main-overlay .link-group .text-link:first-child:after {
        content: "|";
        padding-left: 1.5rem;
        padding-right: 1rem; }
  .main-overlay .main-background {
    padding: 2rem;
    background-repeat: repeat;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    position: relative;
    z-index: 1;
    height: 80vh; }
    .main-overlay .main-background .content {
      padding-top: 2rem;
      text-align: center; }
      .main-overlay .main-background .content h1 {
        margin: 1rem 0 0 0;
        margin-bottom: 0;
        color: #333;
        text-transform: uppercase;
        letter-spacing: 2px;
        font-size: 2.5rem;
        font-weight: 700;
        line-height: 1; }
      .main-overlay .main-background .content h3 {
        color: #333;
        line-height: 1.2;
        font-family: "Montserrat", sans-serif;
        font-weight: 300;
        letter-spacing: 2px;
        text-transform: uppercase;
        font-size: 1.25rem; }
      .main-overlay .main-background .content .logo {
        max-width: 25rem;
        margin-bottom: 1rem; }
      .main-overlay .main-background .content .btn {
        font-family: "Montserrat", sans-serif;
        color: #fff;
        font-size: 1.4rem;
        background: #CC0000;
        padding: 0.73rem 3rem 0.55rem 3rem;
        letter-spacing: 3px;}

.btn {
    font-family: "Montserrat", sans-serif;
    color: #fff;
    font-size: 1rem;
    background: #CC0000;
    /*padding: 0.73rem 2rem 0.55rem;*/
    padding: .5rem 1rem;
    letter-spacing: 3px;
    border-radius: 0;
    text-transform: none;
}
.btn:hover {background: #990000;}

.cbp-spmenu {
    background: #333 !important;
}
.cbp-spmenu h3 {
    background: #333 !important;
    color: #FFF;
}
.cbp-spmenu a {
    background: #333 !important;
    color: #FFF;
}
.cbp-spmenu-vertical a {
    border-bottom: 1px solid #fff !important;
}

.content-wrap {
  background-color: #fff;
  padding: 3rem 0; }

.gray-bg {
  background-color: #f2f2f2; }

.live-score {
  color: #666;
  font-weight: 500;
  text-align: left !important; }

.live-team {
  color: #666;
  font-weight: 500; }

.landing-info {
  /*text-align: center;*/ }
  .landing-info h3 {
    color: #df6658;
    font-size: 2.2rem;
    margin-top: 0;
    letter-spacing: 2;
    text-transform: uppercase; }
  .landing-info p {
    font-size: 1rem;
    color: #000; }
  .landing-info .btn {
    margin-top: 1.5rem;
    font-family: "Montserrat", sans-serif;
    color: #fff;
    font-size: 1.4rem;
    background: #cc0000;
    padding: 0.73rem 3rem 0.55rem 3rem;
    letter-spacing: 3px;
 }

.landing-content img {
  width: 45%; }

.action-icons {
  padding: 3rem 0; }
  .action-icons .col .cta-wrap {
    text-align: center;
    border: 0.5rem solid #212529;
    padding: 0.5rem; }
    .action-icons .col .cta-wrap .cta {
      padding: 2rem;
      background-color: #222;
      background-image: url(../img/random-squares.png);
      background-repeat: repeat; }
      .action-icons .col .cta-wrap .cta i {
        padding: 1.4rem 1.3rem;
        color: #fff;
        width: 10rem;
        display: block;
        margin: 0 auto;
        background-color: #0091ff;
        border-radius: 100%;
        border: 0.5rem solid #fff; }
        .action-icons .col .cta-wrap .cta i img {
          width: 90%;
          height: auto; }
      .action-icons .col .cta-wrap .cta h3 {
        letter-spacing: 1px;
        color: #fff;
        margin-bottom: 0;
        font-size: 2.2rem;
        text-transform: uppercase; }
  .action-icons .col:nth-child(2) .cta-wrap i {
    background-color: #e74c3c; }
  .action-icons .col:nth-child(3) .cta-wrap i {
    background-color: #f39c12; }

.bios .bio-wrap {
  margin-bottom: 2rem; }

.bios .bio-wrap .card-title {
  text-align: center; }
.bios .bio-wrap .member-title {
  text-align: center; }

.subfooter {
  padding: 1rem;
  background-color: #e4e4e4;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-content: center;
  align-items: center; }
  .subfooter .logos img {
    max-height: 2rem;
    max-width: 10rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem; }
  .subfooter .social-media ul {
    margin: 0;
    padding: 0;
    list-style: none; }
    .subfooter .social-media ul li {
      display: inline-block; }
      .subfooter .social-media ul li a {
        padding: 0 0.5rem;
        font-size: 1.8rem;
        line-height: 1.4; }

.fa-facebook {
  color: #3a559f; }

.fa-twitter {
  color: #2daae1; }

footer.container-fluid {
  padding: 2rem 1.5rem;
  display: flex;
  flex-direction: column; }
  footer.container-fluid .nav {
    width: 100%;
    flex-direction: row; }
    footer.container-fluid .nav .nav-link {
      padding: 0.5rem 1rem;
      padding-left: 0;
      padding-top: 0;
      font-size: 0.85rem;
      color: #888; }
      footer.container-fluid .nav .nav-link:hover {
        color: #ccc; }
  footer.container-fluid .credit-cards {
    text-align: right; }
    footer.container-fluid .credit-cards img {
      max-height: 2rem; }
  footer.container-fluid .copyright {
    font-size: 0.75rem;
    color: #888; }
    footer.container-fluid .copyright a {
      color: #888; }

.form-check-input {
  margin-left: 0;
  margin-top: 0.45rem; }

.modal-dialog {
  max-width: 40rem; }

#playercard .modal-dialog {
  width: 70rem;
  max-width: 1299px; }
  #playercard .modal-dialog #career .table thead th {
    font-size: 0.85rem; }

.modal-body {
  padding: 2rem; }
  .modal-body h2 {
    text-align: center;
    color: #df6658; }

.modal-footer {
  justify-content: center; }

#league_size .entries td {
  vertical-align: middle; }
  #league_size .entries td .rounded-circle {
    max-width: 1.5rem; }

tr.selected {
  background-color: #df6658 !important;
  color: #fff; }

.rounded-circle {
  max-width: 1.5rem; }

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

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

.winner {
  background-color: rgba(80, 241, 102, 0.28) !important;
  font-weight: 500; }
  .winner a {
    color: #2c6427; }

.loser {
  background-color: rgba(243, 81, 81, 0.28) !important;
  font-weight: 500; }
  .loser a {
    color: #e88e5e; }

.greyed {
  background-color: rgba(171, 171, 171, 0.17) !important;
  -webkit-filter: grayscale(100%);
  /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
  color: #8e7575; }

.gametype {
  width: 15px; }

.team img {
  width: 40px;
  margin-top: -4px; }

.teamlogo {
  width: 30px; }

.live-score {
  font-size: 15px; }
  .live-score thead tr {
    background-color: #373f46; }
    .live-score thead tr th {
      padding: 3px .75rem; }
  .live-score tbody tr td {
    padding: 3px .75rem; }

.game-info thead tr {
  background-color: #111; }
  .game-info thead tr th {
    padding: 11px .75rem;
    border-color: #111; }
.game-info tbody td {
  padding: 11px .75rem; }

.game-info.mobile {
  display: none; }

.modal-link {
  color: #444;
  font-weight: 400; }
  .modal-link:hover {
    color: #df6658; }

.left-header {
  background-color: #e9ecef;
  font-weight: bold; }

#contest_info .modal-body ul {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: center; }
  #contest_info .modal-body ul li {
    display: inline-block;
    padding: 0 0.5rem;
    letter-spacing: 1px;
    font-weight: bold; }

#playercard .modal-body .top-actions {
  display: flex;
  flex-direction: row;
  justify-content: flex-end; }
#playercard .modal-body .player {
  display: flex;
  flex-direction: row;
  align-items: center; }
  #playercard .modal-body .player .image {
    padding-right: 1rem; }
    #playercard .modal-body .player .image img {
      max-width: 8rem; }
  #playercard .modal-body .player .info {
    font-weight: bold; }
    #playercard .modal-body .player .info .name {
      font-family: "Montserrat", sans-serif;
      font-size: 1.4rem;
      font-weight: normal; }
      #playercard .modal-body .player .info .name span.green {
        color: #57ab4f; }
    #playercard .modal-body .player .info .team {
      font-size: 0.9rem; }
    #playercard .modal-body .player .info .action {
      padding-top: 0.5rem; }
      #playercard .modal-body .player .info .action a {
        font-size: 0.85rem; }
#playercard .modal-body .stats {
  margin-top: 2rem; }
  #playercard .modal-body .stats .nav-tabs {
    font-size: 0.85rem; }
  #playercard .modal-body .stats .tab-content {
    border: 1px solid #ddd;
    border-top: none;
    border-bottom-left-radius: 0.25rem;
    border-bottom-right-radius: 0.25rem; }
  #playercard .modal-body .stats .table {
    margin-bottom: 0; }
    #playercard .modal-body .stats .table thead tr td {
      font-size: 0.65rem;
      font-weight: bold;
      text-transform: uppercase;
      letter-spacing: 1px;
      text-align: center;
      border-top: none; }
    #playercard .modal-body .stats .table tbody tr th {
      font-size: 0.85rem;
      text-align: center; }
    #playercard .modal-body .stats .table tbody tr td {
      font-size: 0.85rem;
      text-align: center; }
#playercard .modal-body #career .table thead tr td {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-top: none; }
#playercard .modal-body #career .table tbody tr th {
  font-size: 0.85rem;
  font-weight: normal; }
#playercard .modal-body #career .table tbody tr td {
  font-size: 0.85rem;
  text-align: left;
  vertical-align: middle; }
  #playercard .modal-body #career .table tbody tr td #boxScore tr td, #playercard .modal-body #career .table tbody tr td #boxScore tr th {
    font-size: 0.75rem;
    padding: 0; }
#playercard .modal-body #career .table tbody tr:first-child td {
  border-top: none; }
#playercard .modal-body .news h4.news-title {
  margin-bottom: 0.5rem;
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #241f21;
  margin-top: 0; }
#playercard .modal-body .news .supplemental {
  max-height: 350px;
  overflow-y: scroll;
  padding: 1rem;
  border-radius: 0.25rem;
  font-size: 0.85rem;
  line-height: 1.4; }

.marquee {
  height: 3rem;
  width: 100%;
  overflow: hidden;
  position: relative;
  background-color: #222;
  border-radius: 0.25rem;
  background-image: url(../img/ticker.png);
  background-size: 20px;
  background-repeat: repeat;
  border: 2px solid #000;
  margin-bottom: 3rem; }
  .marquee div {
    display: block;
    width: 200%;
    height: 3rem;
    position: absolute;
    overflow: hidden;
    animation: marquee 10s linear infinite; }
    .marquee div span {
      float: left;
      width: 50%;
      color: #fff;
      padding: 0.6rem;
      text-transform: uppercase;
      letter-spacing: 2px;
      line-height: 1.4;
      font-size: 1.2rem; }

@keyframes marquee {
  0% {
    left: 0; }
  100% {
    left: -100%; } }
.filter-toggle {
  display: none; }

.lobby-buttons {
  align-items: center;
  justify-content: center;
  align-content: center;
  flex-direction: row;
  display: flex; }
  .lobby-buttons .league-buttons {
    margin-top: -3rem;
    max-width: 100%; }
    .lobby-buttons .league-buttons a {
      width: 100%;
      margin-bottom: 0.5rem; }
      .lobby-buttons .league-buttons a:last-child {
        margin-bottom: 0; }

.create {
  text-align: right; }

.closed {
  background-color: #c3c3c3;
  border: #c3c3c3 1px solid; }

aside {
  display: block;
  position: relative;
  overflow: hidden; }
  aside h3 {
    font-size: 16px;
    font-family: "Montserrat", sans-serif;
    color: black;
    padding: .7em;
    margin: 0;
    line-height: 1;
    position: absolute;
    padding-left: 55px;
    top: 0;
    left: 0;
    width: 1000%;
    -webkit-transform: rotate(90deg) translateX(20px);
    -moz-transform: rotate(90deg) translateX(20px);
    -ms-transform: rotate(90deg) translateX(20px);
    -o-transform: rotate(90deg) translateX(20px);
    transform: rotate(90deg) translateX(20px);
    -webkit-transform-origin: 1.8em .5em;
    -moz-transform-origin: 1.8em .5em;
    -ms-transform-origin: 1.8em .5em;
    -o-transform-origin: 1.8em .5em;
    transform-origin: 1.8em .5em; }
  aside h4 {
    font-size: 16px;
    font-family: "Montserrat", sans-serif;
    color: black;
    padding: .7em;
    padding-left: 55px;
    margin: 0;
    line-height: 1;
    top: 0;
    left: 0; }

.lobby-table svg.fa-football-ball {
  color: #9a9aa2; }

.filters form {
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  background-color: #f2f2f2;
  border-bottom: 1px solid #ecf2f7; }
.filters .filter {
  flex: 0 0 33.333%;
  max-width: 33.333%;
  padding: 1rem;
  padding-bottom: 0; }
  .filters .filter label {
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.85rem; }
.filters .legend {
  display: flex;
  padding: 0 1rem 0 0;
  font-size: 0.85rem;
  justify-content: flex-end; }
  .filters .legend div {
    padding-left: 1rem; }
    .filters .legend div img {
      max-width: 1rem;
      display: inline-block; }
.filters .league-filter {
  padding-bottom: 1rem; }
  .filters .league-filter label {
    display: block; }
  .filters .league-filter .checkbox {
    display: inline-block; }
    .filters .league-filter .checkbox label {
      background-color: #241f21;
      color: #fff;
      font-size: .7rem;
      font-family: "Montserrat", sans-serif;
      letter-spacing: 2px;
      font-weight: normal;
      display: inline-block;
      text-transform: uppercase;
      padding: .375rem .75rem;
      border-radius: .25rem;
      line-height: 1.5;
      cursor: pointer;
      margin: 0; }
  .filters .league-filter input[type=checkbox] {
    position: absolute;
    top: -9999px;
    left: -9999px; }
  .filters .league-filter input[type=checkbox]:checked ~ label.checkbox {
    background: #57ab4f; }

.ui-widget-header {
  background-color: #3e7f38; }

.lobby-table {
  font-size: 14px; }

.join {
  text-align: center;
  font-wiehgt: bold; }
  .join .btn-default {
    background: linear-gradient(90deg, #3e7f38, #3e7f38);
    box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.1); }

.league-buttons,
.lobby-games {
  display: none; }

.featured-games.slick-dotted.slick-slider {
  width: 100%;
  margin-bottom: 4rem; }
  .featured-games.slick-dotted.slick-slider .slick-slide {
    padding: 0 0.25rem; }
    .featured-games.slick-dotted.slick-slider .slick-slide div div {
      display: block !important; }
  .featured-games.slick-dotted.slick-slider .slick-dots li button:before {
    font-size: 0.85rem; }

.game-details h1 {
  text-align: center;
  color: #3e7f38;
  margin: 1rem 0;
  margin-top: 0;
  font-size: 2rem; }
.game-details .game-notes {
  display: flex;
  flex-direction: row;
  justify-content: center; }
  .game-details .game-notes ul {
    list-style: none;
    padding: 0;
    margin: 0; }
    .game-details .game-notes ul li {
      display: inline-block;
      padding: 0.5rem 1rem;
      margin: 0 0.25rem;
      background-color: #e74c3c;
      color: #fff;
      text-transform: uppercase;
      letter-spacing: 1px;
      font-size: 1.125rem; }
.game-details .game-rules, .game-details .pick-history {
  display: none; }

.game-slate-wrap {
  background-color: #ccc;
  padding: 1rem 0; }
  .game-slate-wrap .slick-dotted.slick-slider {
    margin-bottom: 1rem; }
  .game-slate-wrap .game-slate {
    display: none; }
    .game-slate-wrap .game-slate .slick-slide a {
      display: block;
      padding: 0.5rem 0.25rem; }
      .game-slate-wrap .game-slate .slick-slide a span {
        padding: 0.5rem;
        font-size: 0.65rem;
        border-radius: 0.25rem;
        background-color: #fff;
        text-align: center;
        display: block;
        text-transform: uppercase;
        letter-spacing: 1px;
        font-weight: bold; }
    .game-slate-wrap .game-slate .slick-dots li button:before {
      font-size: 0.85rem; }

.player-list .form-inline {
  margin-bottom: 1rem; }
  .player-list .form-inline input {
    width: 85%;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0; }
  .player-list .form-inline button {
    width: 15%;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }
.player-list .nav-tabs {
  margin-bottom: 1rem;
  border-bottom: 0; }
  .player-list .nav-tabs .nav-item {
    margin-bottom: 0;
    width: 24%;
    margin: 0.5%; }
    .player-list .nav-tabs .nav-item .nav-link {
      font-size: 0.85rem;
      border: none;
      background-color: #eee;
      border-radius: 0.25rem;
      text-align: center;
      font-weight: bold;
      letter-spacing: 2px;
      color: #222; }
    .player-list .nav-tabs .nav-item .nav-link.active {
      background-color: #bf3228;
      color: #fff;
      border-radius: 0.25rem; }
.player-list #positions {
  max-height: 553px;
  overflow: auto; }
  .player-list #positions table.table-bordered {
    margin-bottom: 0; }
    .player-list #positions table.table-bordered thead td {
      font-size: 0.65rem;
      border-bottom-width: 1px; }
    .player-list #positions table.table-bordered tbody tr:hover {
      background-color: #f3f3f3; }
    .player-list #positions table.table-bordered tbody tr td {
      padding: 0.25rem;
      text-align: center;
      font-size: 0.85rem;
      vertical-align: middle; }
      .player-list #positions table.table-bordered tbody tr td button {
        border: none;
        cursor: pointer;
        color: #57ab4f;
        background-color: transparent; }

.roster .roster-salary {
  display: flex;
  flex-direction: column; }
  .roster .roster-salary .salary {
    text-align: right;
    font-family: "Montserrat", sans-serif;
    font-size: 2.4rem;
    line-height: 1.4; }
    .roster .roster-salary .salary span {
      font-size: 1.4rem; }
  .roster .roster-salary .average {
    text-align: right;
    font-family: "Montserrat", sans-serif;
    font-size: 1.4rem; }
    .roster .roster-salary .average span {
      font-size: 1.4rem; }
.roster .roster-wrap .roster-player {
  border: 1px solid #eee;
  margin-bottom: 0.25rem;
  justify-content: space-between;
  flex-direction: row;
  display: flex;
  align-items: center;
  align-content: center;
  padding: 1rem; }
  .roster .roster-wrap .roster-player .pos {
    font-size: 1.6rem;
    line-height: 1.2;
    font-weight: bold;
    text-align: center;
    width: 3rem; }
  .roster .roster-wrap .roster-player .player .name span.square.injured {
    border-radius: 0.25rem;
    background-color: #bf3228;
    color: #fff;
    padding: 0.15rem 0.25rem;
    padding-top: 0.25rem;
    font-size: 0.75rem;
    line-height: 1.4; }
  .roster .roster-wrap .roster-player .player .name span.square.starter {
    border-radius: 0.25rem;
    background-color: #57ab4f;
    color: #fff;
    font-weight: bold;
    padding: 0.2rem 0.4rem;
    font-size: 0.75rem;
    line-height: 1.4; }
  .roster .roster-wrap .roster-player .close {
    font-size: 1rem;
    color: #bf3228;
    cursor: pointer; }
.roster .roster-buttons {
  display: flex;
  flex-direction: row;
  justify-content: flex-end; }
  .roster .roster-buttons a {
    margin: 0.25rem 0;
    margin-left: 0.5rem; }

.live-scoring .live-lineup {
  margin-top: 45px; }
  .live-scoring .live-lineup .lineup {
    display: flex;
    flex-direction: column; }
    .live-scoring .live-lineup .lineup .lineup-top {
      display: flex;
      flex-direction: row;
      background-color: #eee;
      align-content: center;
      align-items: center;
      border: 1px solid #ccc;
      border-bottom: 0; }
      .live-scoring .live-lineup .lineup .lineup-top .image {
        max-width: 15%;
        margin-right: 0.5rem;
        border-right: 1px solid #ccc; }
      .live-scoring .live-lineup .lineup .lineup-top .name {
        padding: 0.25rem;
        max-width: 60%;
        width: 60%;
        font-size: 1.6rem;
        line-height: 1.4;
        font-weight: bold; }
        .live-scoring .live-lineup .lineup .lineup-top .name span {
          display: block;
          font-weight: normal;
          font-size: 14px; }
      .live-scoring .live-lineup .lineup .lineup-top .score {
        padding: 0.25rem;
        max-width: 25%;
        width: 25%;
        text-align: right;
        font-size: 2.4rem;
        font-weight: bold;
        line-height: 1.4; }
    .live-scoring .live-lineup .lineup .lineup-body {
      display: flex;
      flex-direction: column; }
      .live-scoring .live-lineup .lineup .lineup-body .roster-player {
        border: 1px solid #ccc;
        border-bottom: 0px;
        flex-direction: row;
        display: flex;
        align-items: center;
        align-content: center;
        padding: 0.5rem;
        flex-basis: auto; }
        .live-scoring .live-lineup .lineup .lineup-body .roster-player:last-child {
          border-bottom: 1px solid #ccc; }
        .live-scoring .live-lineup .lineup .lineup-body .roster-player .player {
          line-height: 1.4;
          padding-right: 1rem;
          min-width: 45%; }
          .live-scoring .live-lineup .lineup .lineup-body .roster-player .player .name {
            text-align: left;
            font-size: 12px; }
            .live-scoring .live-lineup .lineup .lineup-body .roster-player .player .name span.square.injured {
              border-radius: 0.25rem;
              background-color: #bf3228;
              color: #fff;
              padding: 0.15rem 0.25rem;
              padding-top: 0.25rem;
              font-size: 10px;
              line-height: 1.4; }
            .live-scoring .live-lineup .lineup .lineup-body .roster-player .player .name span.square.starter {
              border-radius: 0.25rem;
              background-color: #57ab4f;
              color: #fff;
              font-weight: bold;
              padding: 0.2rem 0.4rem;
              font-size: 10px;
              line-height: 1.4; }
            .live-scoring .live-lineup .lineup .lineup-body .roster-player .player .name .salary {
              font-size: 12px;
              margin-top: 0.5rem; }
        .live-scoring .live-lineup .lineup .lineup-body .roster-player .box-score {
          min-width: 35%; }
          .live-scoring .live-lineup .lineup .lineup-body .roster-player .box-score table {
            margin-bottom: 0; }
            .live-scoring .live-lineup .lineup .lineup-body .roster-player .box-score table thead tr th {
              font-size: 10px;
              padding: 0 0.25rem;
              border-bottom: none; }
            .live-scoring .live-lineup .lineup .lineup-body .roster-player .box-score table tbody tr td {
              font-size: 10px;
              padding: 0 0.25rem;
              text-align: center; }
        .live-scoring .live-lineup .lineup .lineup-body .roster-player .score {
          min-width: 20%;
          text-align: right;
          font-size: 1.2rem;
          font-weight: bold; }
.live-scoring .live-tabs .lineup {
  display: flex;
  flex-direction: column; }
  .live-scoring .live-tabs .lineup .lineup-top {
    display: flex;
    flex-direction: row;
    background-color: #eee;
    align-content: center;
    align-items: center;
    border-bottom: 0; }
    .live-scoring .live-tabs .lineup .lineup-top .image {
      max-width: 15%;
      margin-right: 0.5rem;
      border-right: 1px solid #ccc; }
    .live-scoring .live-tabs .lineup .lineup-top .name {
      padding: 0.25rem;
      max-width: 60%;
      width: 60%;
      font-size: 1.6rem;
      line-height: 1.4;
      font-weight: bold; }
      .live-scoring .live-tabs .lineup .lineup-top .name span {
        display: block;
        font-weight: normal;
        font-size: 14px; }
    .live-scoring .live-tabs .lineup .lineup-top .score {
      padding: 0.25rem;
      max-width: 25%;
      width: 25%;
      text-align: right;
      font-size: 2.4rem;
      font-weight: bold;
      line-height: 1.4; }
  .live-scoring .live-tabs .lineup .lineup-body {
    display: flex;
    flex-direction: column; }
    .live-scoring .live-tabs .lineup .lineup-body .roster-player {
      border: 1px solid #ccc;
      border-right: 0px;
      border-left: 0px;
      border-bottom: 0px;
      flex-direction: row;
      display: flex;
      align-items: center;
      align-content: center;
      padding: 0.5rem;
      flex-basis: auto; }
      .live-scoring .live-tabs .lineup .lineup-body .roster-player .player {
        line-height: 1.4;
        padding-right: 1rem;
        min-width: 45%; }
        .live-scoring .live-tabs .lineup .lineup-body .roster-player .player .name {
          text-align: left;
          font-size: 12px; }
          .live-scoring .live-tabs .lineup .lineup-body .roster-player .player .name span.square.injured {
            border-radius: 0.25rem;
            background-color: #bf3228;
            color: #fff;
            padding: 0.15rem 0.25rem;
            padding-top: 0.25rem;
            font-size: 10px;
            line-height: 1.4; }
          .live-scoring .live-tabs .lineup .lineup-body .roster-player .player .name span.square.starter {
            border-radius: 0.25rem;
            background-color: #57ab4f;
            color: #fff;
            font-weight: bold;
            padding: 0.2rem 0.4rem;
            font-size: 10px;
            line-height: 1.4; }
          .live-scoring .live-tabs .lineup .lineup-body .roster-player .player .name .salary {
            font-size: 12px;
            margin-top: 0.5rem; }
      .live-scoring .live-tabs .lineup .lineup-body .roster-player .box-score {
        min-width: 35%; }
        .live-scoring .live-tabs .lineup .lineup-body .roster-player .box-score table {
          margin-bottom: 0; }
          .live-scoring .live-tabs .lineup .lineup-body .roster-player .box-score table thead tr th {
            font-size: 10px;
            padding: 0 0.25rem;
            border-bottom: none; }
          .live-scoring .live-tabs .lineup .lineup-body .roster-player .box-score table tbody tr td {
            font-size: 10px;
            padding: 0 0.25rem;
            text-align: center; }
      .live-scoring .live-tabs .lineup .lineup-body .roster-player .score {
        min-width: 20%;
        text-align: right;
        font-size: 1.2rem;
        font-weight: bold; }
.live-scoring .live-tabs .nav-tabs .nav-link {
  font-size: 0.85rem; }
.live-scoring .live-tabs .nav-tabs .tab-content {
  border: 1px solid #ccc;
  border-top: none;
  max-height: 36rem;
  overflow-y: scroll; }
  .live-scoring .live-tabs .nav-tabs .tab-content table {
    margin-bottom: 0; }
    .live-scoring .live-tabs .nav-tabs .tab-content table thead tr th {
      font-size: 0.85rem; }
    .live-scoring .live-tabs .nav-tabs .tab-content table tbody tr td {
      text-align: center;
      font-size: 0.85rem;
      vertical-align: middle; }
.live-scoring .actions {
  padding-top: 1rem;
  text-align: right; }
  .live-scoring .actions p {
    margin: 0; }

.squares-content {
  border: none !important;
  max-height: none !important; }

#avatar_drag_drop {
  padding: 5rem;
  border: 5px dashed #ddd;
  border-radius: 1rem;
  text-align: center;
  font-size: 1.25rem; }

.steps .row {
  border-bottom: 1px solid #ddd;
  padding-bottom: 1rem;
  margin-bottom: 1rem; }
  .steps .row:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0; }
.steps .col-md-2 {
  display: flex;
  flex-direction: column;
  text-align: center;
  justify-content: flex-start; }
  .steps .col-md-2 h2 {
    text-transform: uppercase;
    font-size: 2.5rem;
    color: #000;
    border-bottom: 3px solid #df6658;
    margin: 0 auto;
    line-height: 1.4;
    margin-top: 0.5rem; }
.steps .col-md-10 h4 {
  color: #df6658; }

span.green {
  color: #57ab4f;
  font-weight: bold; }

span.yellow {
  color: #3e7f38;
  font-weight: bold; }

span.red {
  color: #e88e5e;
  font-weight: bold; }

.fade {
  display: none; }

.fade.show {
  display: block; }

.input-group .input-group-prepend .input-group-text {
  display: block;
  padding: 0.5rem;
  background-color: #ddd; }
.input-group .input-group-append .btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  font-size: 1rem;
  line-height: 1.5;
  padding: 0.5rem 1rem; }

.withdraw-table {
  max-height: 25rem;
  overflow: auto; }

.nav-pills .nav-link.active {
  background-color: #df6658; }

.page-link {
  color: #000; }
  .page-link:hover, .page-link:focus {
    color: #df6658; }

.page-item.active .page-link {
  background-color: #df6658;
  border-color: #df6658; }

.btn-sm {
  padding: .25rem .5rem; }

#pickem {
  max-height: 25.7rem;
  overflow: auto; }
  #pickem table {
    margin-bottom: 0; }

a.red {
  color: #df6658;
  padding: 0 0.3rem; }

.player-tabs .tab-pane {
  max-height: 40rem;
  overflow-y: auto; }
  .player-tabs .tab-pane .table {
    margin-bottom: 0; }

#pickemRoster .table .position {
  font-family: "Montserrat", sans-serif;
  color: #3e7f38;
  font-size: 1.5rem;
  text-align: center; }
#pickemRoster .table td.name {
  white-space: normal; }

#mobilePane {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out; }

#mobilePane.slideout {
  right: 0;
  padding-top: 1rem; }

#standingsTable tbody tr.eliminated {
  background-color: #ccc; }

#activeScore #boxScore, #scoringData #boxScore {
  margin-bottom: 0; }
  #activeScore #boxScore tr td, #activeScore #boxScore tr th, #scoringData #boxScore tr td, #scoringData #boxScore tr th {
    font-size: 0.75rem;
    padding: 0; }

#activePlayer, #scoringData {
  margin-top: 0.75rem; }

.hide {
  display: none; }

.rules .sidebar {
  position: relative; }
  .rules .sidebar ul {
    padding-top: 1rem; }
    .rules .sidebar ul li a {
      display: block;
      padding: 0.5rem 0;
      color: #333;
      font-family: "Montserrat", sans-serif; }
    .rules .sidebar ul li a.active {
      color: #57ab4f; }
  .rules .sidebar .sticky {
    -webkit-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    -ms-transition: all 300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
    max-width: 100%;
    top: 0;
    position: static; }

@media screen and (max-width: 1350px) {
  .bigBubble.responsive {
    bottom: 50vh !important; 
  }

  .bigBubble.bigger {
    bottom: calc(50vh + 100px) !important;
  }

}    

@media screen and (max-width: 767px) {
  table.responsive, .responsive thead, .responsive tbody, .responsive th, .responsive td, .responsive tr {
    display: block; }

  /* Hide table headers (but not display: none;, for accessibility) */
  .responsive thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px; }
  .responsive tr {
    border: 1px solid #ccc;
    border-top: none; }
  .responsive tr:first-child {
    border-top: 1px solid #ccc; }
  .responsive td {
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-left: 50%; }
    .responsive td:before {
      /* Now like a table header */
      position: absolute;
      /* Top/left values mimic padding */
      top: 6px;
      left: 6px;
      width: 45%;
      padding-right: 10px;
      white-space: nowrap;
      content: attr(data-table-header);
      font-weight: bold; }

  .table-responsive .bootstrap {
    min-height: .01%;
    overflow-x: auto; }

  .table-responsive.bootstrap {
    width: 100%;
    margin-bottom: 15px;
    overflow-y: hidden;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    border: 1px solid #ddd; }

  .table-responsive.bootstrap > .table {
    margin-bottom: 0; }

  .table-responsive.bootstrap > .table > thead > tr > th,
  .table-responsive.bootstrap > .table > tbody > tr > th,
  .table-responsive.bootstrap > .table > tfoot > tr > th,
  .table-responsive.bootstrap > .table > thead > tr > td,
  .table-responsive.bootstrap > .table > tbody > tr > td,
  .table-responsive.bootstrap > .table > tfoot > tr > td {
    white-space: nowrap; }

  .table-responsive.bootstrap > .table-bordered {
    border: 0; }

  .table-responsive.bootstrap > .table-bordered > thead > tr > th:first-child,
  .table-responsive.bootstrap > .table-bordered > tbody > tr > th:first-child,
  .table-responsive.bootstrap > .table-bordered > tfoot > tr > th:first-child,
  .table-responsive.bootstrap > .table-bordered > thead > tr > td:first-child,
  .table-responsive.bootstrap > .table-bordered > tbody > tr > td:first-child,
  .table-responsive.bootstrap > .table-bordered > tfoot > tr > td:first-child {
    border-left: 0; }

  .table-responsive.bootstrap > .table-bordered > thead > tr > th:last-child,
  .table-responsive.bootstrap > .table-bordered > tbody > tr > th:last-child,
  .table-responsive.bootstrap > .table-bordered > tfoot > tr > th:last-child,
  .table-responsive.bootstrap > .table-bordered > thead > tr > td:last-child,
  .table-responsive.bootstrap > .table-bordered > tbody > tr > td:last-child,
  .table-responsive.bootstrap > .table-bordered > tfoot > tr > td:last-child {
    border-right: 0; }

  .table-responsive.bootstrap > .table-bordered > tbody > tr:last-child > th,
  .table-responsive.bootstrap > .table-bordered > tfoot > tr:last-child > th,
  .table-responsive.bootstrap > .table-bordered > tbody > tr:last-child > td,
  .table-responsive.bootstrap > .table-bordered > tfoot > tr:last-child > td {
    border-bottom: 0; }

  .featured-games {
    padding-top: 1.5rem; }

  .filters .legend {
    justify-content: center;
    padding: 0.5rem 0 1rem 0; }
  .filters .league-filter .checkbox {
    display: block; }
    .filters .league-filter .checkbox label {
      width: 100%;
      padding: 1rem;
      margin-bottom: 0.25rem;
      text-align: center;
      font-size: 0.85rem; }

  .rules .sidebar {
    padding-bottom: 2rem; } }




/* General styles for all menus */

.cbp-spmenu {
	background: #47a3da;
	position: fixed;
}

.cbp-spmenu h3 {
	color: #afdefa;
	font-size: 1.9em;
	padding: 20px;
	margin: 0;
	font-weight: 300;
	background: #0d77b6;
}

.cbp-spmenu a {
	display: block;
	color: #fff;
	font-size: 1.1em;
	font-weight: 300;
}

.cbp-spmenu a:hover {
	background: #258ecd;
}

.cbp-spmenu a:active {
	background: #afdefa;
	color: #47a3da;
}

/* Orientation-dependent styles for the content of the menu */

.cbp-spmenu-vertical {
	width: 240px;
	height: 100%;
	top: 0;
	z-index: 1000;
}

.cbp-spmenu-vertical a {
	border-bottom: 1px solid #258ecd;
	padding: 1em;
}

.cbp-spmenu-horizontal {
	width: 100%;
	height: 150px;
	left: 0;
	z-index: 1000;
	overflow: hidden;
}

.cbp-spmenu-horizontal h3 {
	height: 100%;
	width: 20%;
	float: left;
}

.cbp-spmenu-horizontal a {
	float: left;
	width: 20%;
	padding: 0.8em;
	border-left: 1px solid #258ecd;
}

/* Vertical menu that slides from the left or right */

.cbp-spmenu-left {
	left: -240px;
}

.cbp-spmenu-right {
	right: -240px;
}

.cbp-spmenu-left.cbp-spmenu-open {
	left: 0px;
}

.cbp-spmenu-right.cbp-spmenu-open {
	right: 0px;
}

/* Horizontal menu that slides from the top or bottom */

.cbp-spmenu-top {
	top: -150px;
}

.cbp-spmenu-bottom {
	bottom: -150px;
}

.cbp-spmenu-top.cbp-spmenu-open {
	top: 0px;
}

.cbp-spmenu-bottom.cbp-spmenu-open {
	bottom: 0px;
}

/* Push classes applied to the body */

.cbp-spmenu-push {
	overflow-x: hidden;
	position: relative;
	left: 0;
}

.cbp-spmenu-push-toright {
	left: 240px;
}

.cbp-spmenu-push-toleft {
	left: -240px;
}

/* Transitions */

.cbp-spmenu,
.cbp-spmenu-push {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

/* Example media queries */

@media screen and (max-width: 55.1875em){

	.cbp-spmenu-horizontal {
		font-size: 75%;
		height: 110px;
	}

	.cbp-spmenu-top {
		top: -110px;
	}

	.cbp-spmenu-bottom {
		bottom: -110px;
	}

}

@media screen and (max-height: 26.375em){

	.cbp-spmenu-vertical {
		font-size: 90%;
		width: 190px;
	}

	.cbp-spmenu-left,
	.cbp-spmenu-push-toleft {
		left: -190px;
	}

	.cbp-spmenu-right {
		right: -190px;
	}

	.cbp-spmenu-push-toright {
		left: 190px;
	}
}

.wep h4 {margin-top: -7px;}
.angle {
    font-size: 2.5rem;
    display: inline-block;
    margin-top: -.75rem;
}

.angle2 {
    font-size: 2rem;
    line-height: 1rem;
}

.math_text {
    font-size: 1.5rem;
    height: 125px;
    width: 200px;
    text-align: right;
}

.math_text.two_line {
    height: 70px;
    line-height: 2.5rem;
    margin-top: 1.5rem;
}

.math_image.small img {
  height: 100px;
}

.math_image img {
    height: 125px;
}

.math_image_custom img {
  max-height: 125px;
  height: auto;
}

.math_image.large img {
    height: 175px;
}

.text-purple {color: #800080;}
.text-gold {color: #ed7d31;}
.text-gold2 {color: #bf8f00;}
.text-ltblue {color: #00b0f0;}
.text-pink {color: #ff40ff;}
.text-dkorange {color: #c45911;}
.text-blue {color: #0070c0;}
.text-green {color: #00b050;}
.text-orange {color: #ed7d31;}
.text-gray {color: #767171;}
.text-brown {color: #85481B}

.mt-4b {margin-top: 2.5rem;}
.mt-n1 {margin-top: -.25rem;}

.thought_bubble {
    position: relative;
    width: 165px;
    padding: 8px 10px 8px;
    color: #333;
    background: #FFF;
    border-radius: 25px;
    border: 3px solid #333;
    font-size: .85rem;
    text-align: center;
}

.thought_bubble.wide {width: 200px;}
.thought_bubble.xl {width: 240px;}

.thought_bubble.left {
    margin-left: auto;
    margin-right: 15px;
}
.thought_bubble.left:after {
    -moz-transform: skewX(-48deg);
    -ms-transform: skewX(-48deg);
    -webkit-transform: skewX(-48deg);
    transform: skewX(-48deg);
    content: "";
    position: absolute;
    top: 100%;
    left: 22px;
    border-width: 30px 40px 0 0;
    border-style: solid;
    border-color: #333 transparent;
}

.thought_bubble.right {
    margin-right: auto;
    margin-left: 15px;
}
.thought_bubble.right:after {
    -moz-transform: skewX(48deg);
    -ms-transform: skewX(48deg);
    -webkit-transform: skewX(48deg);
    transform: skewX(48deg);
    content: "";
    position: absolute;
    top: 100%;
    right: 22px;
    border-width: 30px 0 0 40px;
    border-style: solid;
    border-color: #333 transparent;
}

.problems {margin-top: 1rem; /*height: 600px;*/}
.problems.compare {margin-top: 1rem; /*height: 560px;*/}

.problems .step {margin-bottom: .75rem; width: 140px; text-align: center;}
.problems .step3:last-child {margin-bottom: 0;}

.problems .step img {width: 95px;}
.problems .step img.wide {width: 135px;}
.problems .step img.full {width: 130%; max-width: 130%;}
.problems .step img.xl {width: 150%; max-width: 150%;}
.problems .step img.norm {width: 100%; max-width:100%;}
.problems .step img.mid {width: 80%; max-width:80%;}

.problems .step img.overlap {margin-top: -92px; margin-left: -2px;}
.problems .step img.pt_overlap {width:82%; margin-top:-148px; margin-left: -2px;}
.problems .step img.pt_overlap2 {width:82%; margin-top:-240px; margin-left: -2px;}
.problems .step img.pt_overlap3 {width:91%; margin-top:-175px; margin-left: 23px;}
.problems .step img.pt_overlap4 {width:96%; margin-top:-255px; margin-left: 26px;}


.problems .step.step1 img.image2{margin-top: -128px;}
.problems .step.step2 img.image2{margin-top: -128px;}

.problems .step img.image2.offset{margin-top: -112px;}

.problems .step.step3 img.wide.position-absolute {top:0; left:3px;}
.problems.wide .step {width: 185px;}
.problems .step.wide {width: 220px;}
.problems .step.xl {width: 250px;}
.problems .step .statement.wide{width: 185px;}

.statement {font-size: .85rem;}
.student {
    width: 110px;
}
.student.left {
    margin-left: auto;
    margin-right: 13rem;
    margin-top: -3rem;
}

.student.right {
    margin-right: auto;
    margin-left: 12rem;
    margin-top: -4rem;
}

#compare_sol .student {position: absolute; margin:0;}
#compare_sol .student.left {
    right: 13rem;
    bottom: -5rem;
}

#compare_sol .student.right {
    left: 13rem;
    bottom: -5rem;
}

.thought_bubble.wide + div .student.left {
    margin-right: 14rem;
}

.thought_bubble.xl + div .student.left {
    margin-right: 15rem;
}

.thought_bubble.wide + div .student.right {
    margin-left: 15rem;
}

.thought_bubble.wide + div .student.right.base {
    margin-left: 12rem;
    margin-top: inherit;
}

#compare_sol .thought_bubble.wide + div .student.left {
    right: 14rem;
}

.discussion_question {
    width: 100%;
    height: 200px;
    margin: 1.5rem 0;
    padding: .5rem 1rem;
    
}

.discussion_question.custom_height {
  min-height: 200px;
  height: auto;
}

.discussion_question.custom {
  height: 510px;
}

.bigBubble {
    position: absolute; 
    border:3px solid #333; 
    background: #eee; 
    width: 500px; 
    bottom: calc(50vh - 100px); 
    left: calc(50vw - 250px); 
    border-radius: 23px;
}
.bigBubble.large {
    width: 600px;
    left: calc(50vw - 300px);
}

.bigBubble.bigger {
  bottom: 50vh;
}

.bigBubble .bubbleTxt {
    color: #eee; 
    font-size: 1.5rem; 
    line-height: 2rem; 
    text-align: center; 
    padding: 1rem; 
    height: 100%;
}
/*.bigBubble {position: relative; left: 210px; bottom: 640px; height: 570px;}
.bigBubble .bubbleTxt {
    position: absolute;
    top: 130px;
    width: 320px;
    font-size: 1.5rem;
    line-height: 2rem;
    text-align: center;
    left: 180px;
}

.bigBubble .bubbleTxt.large {
    top: 100px;
    font-size: 1.25rem;
    line-height: 1.5rem;
}

.bigBubble img.right {
    transform: scaleX(-1);
    margin-left: 71px;
    margin-top: 15px;
}*/

/* Triangle Flashes */
.triangle {
    width: 0; 
    height: 0;
    border-style: solid;
    border-color: transparent;
    border-width: 40px;
    position: absolute;
    top: 7px;
}

.triangle.large {
    border-width: 55px;
}

.triangle.left {
    border-right-width: 0;
    left: 30px;
}
.triangle.right {
    border-left-width: 0;
    left: 71px;
}
.triangle.right2 {
    border-left-width: 40px;
    transform: rotate(180deg);
    left: 30px;
}

.triangle.left.large {
    left: 24px;
}
.triangle.right.large {
    left: 80px;
}
.triangle.right2.large {
    border-left-width: 55px;
    transform: rotate(180deg);
    left: 26px;
}
.triangle.red{
    border-left-color: rgba(204,0,0,.35);
}
.triangle.ltblue {
    border-left-color: rgba(0,176,240,.35);
}
.triangle.pink {
    border-left-color: rgba(255,64,255,.35);
}
.triangle.green {
    border-left-color: rgba(0,176,79,.35);
}
.triangle.purple {
    border-left-color: rgba(128,0,128,.35);
}
.triangle.orange {
    border-left-color: rgba(237,124,49,.35);
}
.triangle.gray {
    border-left-color: rgba(118,113,113,.35);
}
.triangle.gold {
    border-left-color: rgba(191,143,0,.35);
}
.triangle.blue {
    border-left-color: rgba(0,112,192,.35);
}
.triangle.dkorange {
    border-left-color: rgba(196,89,17,.35);
}

/*.triangle.right.red{
    border-right-color: rgba(204,0,0,.35);
}
.triangle.right.ltblue {
    border-right-color: rgba(0,176,240,.35);
}
.triangle.right.pink {
    border-right-color: rgba(255,64,255,.35);
}
.triangle.right.green {
    border-right-color: rgba(0,176,79,.35);
}
.triangle.right.purple {
    border-right-color: rgba(128,0,128,.35);
}
.triangle.right.orange {
    border-right-color: rgba(237,124,49,.35);
}
.triangle.right.gray {
    border-right-color: rgba(118,113,113,.35);
}
.triangle.right.gold {
    border-right-color: rgba(191,143,0,.35);
}
.triangle.right.blue {
    border-right-color: rgba(0,112,192,.35);
}
.triangle.right.dkorange {
    border-right-color: rgba(196,89,17,.35);
}*/

.triangle.a2.left, .triangle.a4.left{
    border-width: 18px 0 0 60px;
    -moz-transform: skewX(-75deg);
    -ms-transform: skewX(-75deg);
    -webkit-transform: skewX(-75deg);
    transform: skewX(-75deg);
}

.triangle.a2.right {
    border-width: 25px 29px 0 0;
    -moz-transform: skewX(217deg);
    -ms-transform: skewX(217deg);
    -webkit-transform: skewX(217deg);
    transform: skewX(217deg);
}
.triangle.a2.right2 {
    border-width: 1px 7px 28px 32px;
    -moz-transform: skewX(15deg) rotate(41deg);
    -ms-transform: skewX(15deg) rotate(41deg);
    -webkit-transform: skewX(15deg) rotate(41deg);
    transform: skewX(15deg) rotate(41deg);
}
.triangle.a2.top.left {
    left: 45px;
    top: 16px;
}
.triangle.a2.top.left.large {
    left: 79px;
    top: 27px;
}
.triangle.a2.top.left.under {
    left: 52px;
    top: 36px;
}
.triangle.a2.top.left.under.large {
    left: 84px;
    top: 46px;
}
.triangle.a2.bottom.left, .triangle.a3.bottom.left {
    border-width: 24px 0 0 45px;
    -moz-transform: skewX(-66deg);
    -ms-transform: skewX(-66deg);
    -webkit-transform: skewX(-66deg);
    transform: skewX(-66deg);
    left: 42px;
    top: 44px;
}
.triangle.a2.bottom.left.large {
    left: 69px;
    top: 66px;
}
.triangle.a2.bottom.left.under {
    left: 39px;
    top: 71px;
}
.triangle.a2.bottom.left.under.large {
    left: 67px;
    top: 91px;
}

.triangle.a2.top.right {
    left: 64px;
    top: 9px;
}
.triangle.a2.top.right2 {
    left: 73px;
    top: 22px;
}
.triangle.a2.top.right2.large {
    left: 109px;
    top: 32px;
}
.triangle.a2.top.right.large {
    left: 96px;
    top: 20px;
}
.triangle.a2.top.right.under {
    left: 39px;
    top: 37px;
}
.triangle.a2.top.right.under.large {
    left: 71px;
    top: 47px;
}
.triangle.a2.top.right2.under {
    left: 72px;
    top: 28px;
}
.triangle.a2.top.right2.under.large {
    left: 102px;
    top: 38px;
}
.triangle.a2.bottom.right {
    border-width: 31px 35px 0 0;
    -moz-transform: skewX(217deg);
    -ms-transform: skewX(217deg);
    -webkit-transform: skewX(217deg);
    transform: skewX(217deg);
    left: 48px;
    top: 37px;
}
.triangle.a2.bottom.right2 {
    left: 62px;
    top: 55px;
}
.triangle.a2.bottom.right.large {
    left: 77px;
    top: 58px;
}
.triangle.a2.bottom.right2.large {
    left: 91px;
    top: 77px;
}
.triangle.a2.bottom.right.under {
    left: 25px;
    top: 72px;
}
.triangle.a2.bottom.right.under.large {
    left: 54px;
    top: 91px;
}

.triangle.a2.bottom.right2.under {
    left: 58px;
    top: 64px;
}
.triangle.a2.bottom.right2.under.large {
    left: 86px;
    top: 83px;
}

.triangle.a2.left.under, .triangle.a3.left.under {
    border-width: 0 0 25px 29px;
    -moz-transform: skewX(217deg);
    -ms-transform: skewX(217deg);
    -webkit-transform: skewX(217deg);
    transform: skewX(217deg);
}

.triangle.a2.right.under{
    border-width: 0 60px 18px 0;
    -moz-transform: skewX(-75deg);
    -ms-transform: skewX(-75deg);
    -webkit-transform: skewX(-75deg);
    transform: skewX(-75deg);
}

.triangle.a2.right2.under{
    border-width: 8px 52px 12px 57px;
    -moz-transform: skewX(-25deg) rotate(-9deg);
    -ms-transform: skewX(-25deg) rotate(-9deg);
    -webkit-transform: skewX(-25deg) rotate(-9deg);
    transform: skewX(-25deg) rotate(-9deg);
}

.triangle.a3.top.left.under {
    left: 52px;
    top: 31px;
}
.problems.wide .triangle.a3.top.left.under {
    left: 74px;
    top: 31px;
}
.triangle.a3.top.left.under.large {
    left: 90px;
    top: 42px;
}

.triangle.a3.bottom.left {
    border-width: 24px 0 0 45px;
    -moz-transform: skewX(-66deg);
    -ms-transform: skewX(-66deg);
    -webkit-transform: skewX(-66deg);
    transform: skewX(-66deg);
    left: 63px;
    top: 40px;
}
.triangle.a3.bottom.left.large {
    left: 74px;
    top: 63px;
}
.triangle.a3.bottom.right {
    border-width: 31px 35px 0 0;
    -moz-transform: skewX(217deg);
    -ms-transform: skewX(217deg);
    -webkit-transform: skewX(217deg);
    transform: skewX(217deg);
    left: 49px;
    top: 32px;
}
.triangle.a3.bottom.right.large {
    left: 79px;
    top: 58px;
}

.triangle.a3.bottom.right2 {
    border-width: 32px 0 0 36px;
    -moz-transform: skewX(158deg);
    -ms-transform: skewX(158deg);
    -webkit-transform: skewX(158deg);
    transform: skewX(158deg);
    left: 65px;
    top: 32px;
}
.triangle.a3.bottom.right2.large {
    left: 96px;
    top: 58px;
}

.triangle.a4.top.right {
    border-width: 17px 0 2px 36px;;
    -moz-transform: skewX(-22deg) rotate(1deg);
    -ms-transform: skewX(-22deg) rotate(1deg);
    -webkit-transform: skewX(-22deg) rotate(1deg);
    transform: skewX(-22deg) rotate(1deg);
    left: 75px;
    top: 19px;
}
.triangle.a4.top.right.large {
    left: 113px;
    top: 23px;
}

/*.triangle.a4.top.right {
    border-width: 17px 26px 1px 56px;
    -moz-transform: skewX(46deg);
    -ms-transform: skewX(46deg);
    -webkit-transform: skewX(46deg);
    transform: skewX(46deg);
    left: 8px;
    top: 19px;
}
.triangle.a4.top.right.large {
    left: 45px;
    top: 23px;
}
*/
.triangle.a4.top.left {
    left: 45px;
    top: 18px;
}
.triangle.a4.top.left.large {
    left: 83px;
    top: 22px;
}

.triangle.a6.left {
    border-width: 18px 0 0 60px;
    -moz-transform: skewX(-214deg);
    -ms-transform: skewX(-214deg);
    -webkit-transform: skewX(-214deg);
    transform: skewX(-214deg);
    top: 87px;
    left: 33px;
}

.triangle.a6.middle {
    border-width: 28px 46px 1px 56px;
    -moz-transform: skewX(-41deg);
    -ms-transform: skewX(-41deg);
    -webkit-transform: skewX(-41deg);
    transform: skewX(-41deg);
    left: 113px;
    top: 77px;
}
.triangle.a6.right {
border-width: 29px 0 1px 31px;
    -moz-transform: skewX(46deg);
    -ms-transform: skewX(46deg);
    -webkit-transform: skewX(46deg);
    transform: skewX(46deg);
    left: 145px;
    top: 77px;
}

.triangle.a6.middle.rightside {
    left: 513px;
    top: 93px;
}

.triangle.a6.right.rightside {
    left: 542px;
    top: 92px;
}

.triangle.a6.middle.right_compare {
    left: 225px;
    top: 93px;
}

.triangle.a6.right.right_compare {
    left: 175px;
    top: 92px;
}

@-webkit-keyframes flash_hide {
  from,
  50%,
  to {
    opacity: 0;
  }

  25%,
  75% {
    opacity: 1;
  }
}

@keyframes flash_hide {
  from,
  50%,
  to {
    opacity: 0;
  }

  25%,
  75% {
    opacity: 1;
  }
}

.flash_hide {
  -webkit-animation-name: flash_hide;
  animation-name: flash_hide;
}

.allStatement div {line-height: 1.5;}

.circle {
    position: absolute;
    border: 3px solid #333;
    border-radius: 50%;
    background: #eee;
}
.circle1 {
    padding: 2rem;
    bottom: -55px;
}
.circle2 {
    padding: 1.5rem;
    bottom: -95px;
}
.circle3 {
    padding: .75rem;
    bottom: -105px;
}
.bigBubble.right .circle1 {right: 15px;}
.bigBubble.right .circle2 {right: -65px;}
.bigBubble.right .circle3 {right: -125px;}
.bigBubble.left .circle1 {left: 15px;}
.bigBubble.left .circle2 {left: -65px;}
.bigBubble.left .circle3 {left: -125px;}

.table_border {
  width: 100%;
}

.table_border td:not(:last-child) {
  border-right: 2px solid #000;
  border-left: 0;
  border-bottom: 0;
}

.table_border td:last-child {
  border-right: 0;
  border-bottom: 0;
}

.table_border td {
   height: 110px;
}

.table_border textarea {
   height: 200px;
   width: 100%;
   border: 0px;
   display: block
}

.table_border thead {
   border-bottom: 2px solid #000;
}
  
.table_border th:first-child {
  border-right: 2px solid #000;
}

.table_border th {
  text-align: center;
}

.table_border td {
  padding: 10px;
  text-align: center;
}

.table_border th:first-child, td:first-child {
  width: 50%;
}

.table_border th:last-child, td:last-child {
  width: 50%;
}

.table_answer {
  border-collapse: collapse;
  width: 75%;
}
.table_answer th, td {
  border: 1px solid black;
  padding: 8px;
  text-align: left;
}
.table_answer th {
  text-align: center;
}
.table_answer th:first-child, td:first-child {
  width: 25%;
}
.table_answer  th:last-child, td:last-child {
  width: 75%;
}

.table_four_img {
  border-collapse: collapse;
  width: 100%;
}
.table_four_img th{
  text-align: center;
  border-bottom: 1px solid black
}

.table_four_img th:not(:last-child),
td:not(:last-child) {
  border-right: 1px solid black;
  width: 25%;
}

.table_four_img td:not(:last-child) {
  border-left: 0;
  border-bottom: 0;
}

.table_four_img td:last-child {
  border-right: 0;
  border-bottom: 0;
}
