@charset "UTF-8";
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,800&effect=shadow-multiple");
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, hgroup, 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, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

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

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

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

#navCheckbox {
  display: none;
}

@font-face {
  font-family: "ProximaNovaBold";
  src: url("/themes/custom/cmatgame_mob/css/fonts/MarkSimonsonProximaNovaSoftBold.otf");
  font-weight: normal !important;
}
@font-face {
  font-family: "ProximaNova";
  src: url("/themes/custom/cmatgame_mob/css/fonts/MarkSimonsonProximaNovaSoftRegular.otf");
  font-weight: normal !important;
}
@font-face {
  font-family: "ProximaNova";
  src: url("/themes/custom/cmatgame_mob/css/fonts/MarkSimonson_ProximaNovaSoftRegularIE.eot");
  font-weight: normal !important;
}
html, body {
  font-family: "ProximaNova";
}

/****** New Baskerville ******/
@font-face {
  font-family: "New Baskerville";
  src: url("/themes/custom/cmatgame_mob/css/fonts/new-baskerville/NewBaskerville-Itl-webfont.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/new-baskerville/NewBaskerville-Itl-webfont.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/new-baskerville/NewBaskerville-Itl-webfont.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/new-baskerville/NewBaskerville-Itl-webfont.svg") format("svg");
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: "New Baskerville";
  src: url("/themes/custom/cmatgame_mob/css/fonts/new-baskerville/NewBaskerville-Bold-webfont.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/new-baskerville/NewBaskerville-Bold-webfont.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/new-baskerville/NewBaskerville-Bold-webfont.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/new-baskerville/NewBaskerville-Bold-webfont.svg") format("svg");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "New Baskerville";
  src: url("/themes/custom/cmatgame_mob/css/fonts/new-baskerville/NewBaskerville-Rmn-webfont.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/new-baskerville/NewBaskerville-Rmn-webfont.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/new-baskerville/NewBaskerville-Rmn-webfont.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/new-baskerville/NewBaskerville-Rmn-webfont.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "New Baskerville";
  src: url("/themes/custom/cmatgame_mob/css/fonts/new-baskerville/NewBaskerville-SemiBld-webfont.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/new-baskerville/NewBaskerville-SemiBld-webfont.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/new-baskerville/NewBaskerville-SemiBld-webfont.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/new-baskerville/NewBaskerville-SemiBld-webfont.svg") format("svg");
  font-weight: 600;
  font-style: normal;
}
/****** Helvetica Neue ******/
@font-face {
  font-family: "Helvetica Neue";
  src: url("/themes/custom/cmatgame_mob/css/fonts/helvetica-neue/HelveticaNeue.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/helvetica-neue/HelveticaNeue.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/helvetica-neue/HelveticaNeue.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/helvetica-neue/HelveticaNeue.svg") format("svg");
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: "Helvetica Neue";
  src: url("/themes/custom/cmatgame_mob/css/fonts/helvetica-neue/HelveticaNeue.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/helvetica-neue/HelveticaNeue.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/helvetica-neue/HelveticaNeue.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/helvetica-neue/HelveticaNeue.svg") format("svg");
  font-weight: lighter;
  font-style: normal;
}
@font-face {
  font-family: "Helvetica Neue";
  src: url("/themes/custom/cmatgame_mob/css/fonts/helvetica-neue/HelveticaNeue.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/helvetica-neue/HelveticaNeue.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/helvetica-neue/HelveticaNeue.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/helvetica-neue/HelveticaNeue.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Helvetica Neue";
  src: url("/themes/custom/cmatgame_mob/css/fonts/helvetica-neue/HelveticaNeue-Bold2.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/helvetica-neue/HelveticaNeue-Bold2.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/helvetica-neue/HelveticaNeue-Bold2.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/helvetica-neue/HelveticaNeue-Bold2.svg") format("svg");
  font-weight: bold;
  font-style: normal;
}
/****** Amasis MT ******/
@font-face {
  font-family: "Amasis MT";
  src: url("/themes/custom/cmatgame_mob/css/fonts/amasis/AmasisMT.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/amasis/AmasisMT.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/amasis/AmasisMT.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/amasis/AmasisMT.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Amasis MT";
  src: url("/themes/custom/cmatgame_mob/css/fonts/amasis/AmasisMT-Italic.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/amasis/AmasisMT-Italic.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/amasis/AmasisMT-Italic.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/amasis/AmasisMT-Italic.svg") format("svg");
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: "Amasis MT";
  src: url("/themes/custom/cmatgame_mob/css/fonts/amasis/AmasisMT-BoldItalic.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/amasis/AmasisMT-BoldItalic.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/amasis/AmasisMT-BoldItalic.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/amasis/AmasisMT-BoldItalic.svg") format("svg");
  font-weight: bold;
  font-style: italic;
}
@font-face {
  font-family: "Amasis MT";
  src: url("/themes/custom/cmatgame_mob/css/fonts/amasis/AmasisMT-Bold.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/amasis/AmasisMT-Bold.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/amasis/AmasisMT-Bold.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/amasis/AmasisMT-Bold.svg") format("svg");
  font-weight: bold;
  font-style: normal;
}
/****** Baskerville ******/
@font-face {
  font-family: "Baskerville";
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Baskerville";
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville-SemiBoldItalic.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville-SemiBoldItalic.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville-SemiBoldItalic.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville-SemiBoldItalic.svg") format("svg");
  font-weight: 600;
  font-style: italic;
}
@font-face {
  font-family: "Baskerville";
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville-SemiBold.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville-SemiBold.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville-SemiBold.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville-SemiBold.svg") format("svg");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: "Baskerville";
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville-Italic.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville-Italic.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville-Italic.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville-Italic.svg") format("svg");
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: "Baskerville";
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville-BoldItalic.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville-BoldItalic.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville-BoldItalic.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville-BoldItalic.svg") format("svg");
  font-weight: bold;
  font-style: italic;
}
@font-face {
  font-family: "Baskerville";
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville-Bold.eot");
  src: url("/themes/custom/cmatgame_mob/css/fonts/baskerville/Baskerville-Bold.woff") format("woff"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville-Bold.ttf") format("truetype"), url("/themes/custom/cmatgame_mob/css/baskerville/Baskerville-Bold.svg") format("svg");
  font-weight: bold;
  font-style: normal;
}
/*!
 *  Font Awesome 4.5.0 by @davegandy - //fontawesome.io - @fontawesome
 *  License - //fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
/* FONT PATH
 * -------------------------- */
@font-face {
  font-family: "FontAwesome";
  src: url("/themes/custom/cmatgame_mob/css/fonts/font-awesome/fontawesome-webfont.eot?v=4.5.0");
  src: url("/themes/custom/cmatgame_mob/css/fonts/font-awesome/fontawesome-webfont.eot?v=4.5.0#iefix") format("embedded-opentype"), url("/themes/custom/cmatgame_mob/css/fonts/font-awesome/fontawesome-webfont.woff2?v=4.5.0") format("woff2"), url("/themes/custom/cmatgame_mob/css/fonts/font-awesome/fontawesome-webfont.woff?v=4.5.0") format("woff"), url("/themes/custom/cmatgame_mob/css/fonts/font-awesome/fontawesome-webfont.ttf?v=4.5.0") format("truetype"), url("/themes/custom/cmatgame_mob/css/fonts/font-awesome/fontawesome-webfont.svg?v=4.5.0#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
/* device rules */
/*mobile colors*/
#skip-link {
  display: none;
}

html, body {
  background: url("/themes/custom/cmatgame_mob/css/../images/cmgmobileimages/bodybg.png") repeat #15202c;
  background-repeat: repeat-x;
  -webkit-overflow-scrolling: touch;
  min-height: 100%;
  margin: 0px;
  padding: 0px;
}

body {
  height: 100%;
  overflow-x: hidden;
}

.pageWrapper {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  min-height: 100%;
}

.pane-page-content {
  min-height: 100%;
}

.panel-paneP {
  padding-bottom: 50px;
}

.global-wrapper-content {
  padding: 0px 8px 50px 8px;
  min-height: 100%;
}

#contentWrapper {
  margin: 0px auto;
  min-height: 100%;
}

#content {
  min-height: 1000px;
  padding: 10px 10px 0px 10px;
  margin-top: 20px;
}

#block-system-main {
  min-height: 100%;
}

.scrollableContentArea {
  min-height: 100%;
}

.visually-hidden {
  display: none;
}

.contentWrapper {
  overflow: hidden;
}

#content {
  clear: both;
}

.scrollableContentArea {
  max-width: 960px;
  margin: 0 auto;
}

.modal-background--show {
  background-color: rgba(0, 0, 0, 0.7);
  /* Black w/ opacity */
  height: 100%;
  width: 100%;
  display: block;
  top: 0px;
  position: fixed;
  z-index: 99999;
}

.mobile-header {
  position: relative;
  top: 20px;
  padding: 0px 10px;
  margin: 0 auto;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) {
  .mobile-header {
    padding: 0px 5px;
  }
}

.mobile-logo {
  float: left;
  margin-left: 0px;
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .mobile-logo {
    margin-left: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .mobile-logo {
    margin-left: 17px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) {
  .mobile-logo {
    margin: 0px 2px 0px 5px;
  }
}
.mobile-logo a {
  text-decoration: none;
}
.mobile-logo img {
  max-width: 100%;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) {
  .mobile-logo img {
    height: 50px;
  }
}

.link-container {
  float: right;
  margin-top: 9px;
  margin-right: 0px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .link-container {
    position: relative;
    right: 10px;
    top: 5px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .link-container {
    margin-right: 10px;
    margin-top: 23px;
  }
}
@media only screen and (max-device-width: 767px) and (min-device-width: 667px) {
  .link-container {
    margin-top: 22px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .link-container {
    margin-top: 22px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .link-container {
    margin-right: 10px;
    margin-top: 23px;
  }
}

.nav-link {
  padding-right: 15px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) {
  .nav-link {
    padding-right: 5px;
  }
}
.nav-link a {
  font-size: 15px;
  font-weight: bold;
  font-family: "ProximaNovaBold";
  color: #e9d93c;
  border: 2px solid #e9d93c;
  background: #203245;
  border-radius: 16px;
}
.nav-link a:active {
  color: #1a2939;
  background: #ffed3f;
  border: 2px solid #ffed3f;
}
.nav-link a:focus {
  color: #e9d93c;
  border: 2px solid #e9d93c;
  background: #203245;
}
.nav-link a:hover {
  color: #1a2939;
  background: #ffed3f;
  border: 2px solid #ffed3f;
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .nav-link a {
    font-size: 15px;
    padding: 4px 10px;
  }
}
@media only screen and (max-device-width: 767px) and (min-device-width: 667px) {
  .nav-link a {
    font-size: 15px;
    padding: 4px 10px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .nav-link a {
    font-size: 9px;
    padding: 2px 5px;
  }
  .nav-link a:active {
    color: #1a2939;
    background: #ffed3f;
    border: 2px solid #ffed3f;
  }
  .nav-link a:focus {
    color: #e9d93c;
    border: 2px solid #e9d93c;
    background: #203245;
  }
  .nav-link a:hover {
    color: #1a2939;
    background: #ffed3f;
    border: 2px solid #ffed3f;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .nav-link a {
    font-size: 19px;
    padding: 4px 13px;
  }
  .nav-link a:active {
    color: #1a2939;
    background: #ffed3f;
    border: 2px solid #ffed3f;
  }
  .nav-link a:focus {
    color: #e9d93c;
    border: 2px solid #e9d93c;
    background: #203245;
  }
  .nav-link a:hover {
    color: #1a2939;
    background: #ffed3f;
    border: 2px solid #ffed3f;
  }
}

.mobile-categories-wrapper .views-field-name .field-content a.active {
  font-family: "ProximaNovaBold";
  color: #9ebd97;
}

.mobile-categories-wrapper .views-field-name .field-content a.active::before {
  font-weight: bold;
  content: " > ";
}

.login-link a {
  color: #5edbff;
  font-weight: bold;
  font-family: "ProximaNovaBold";
}

.main-menu ul {
  list-style: none;
  margin: 0;
  padding: 2.5em 0 0;
  /* Hide shadow w/ -8px while 'closed' */
  -webkit-box-shadow: -8px 0 8px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: -8px 0 8px rgba(0, 0, 0, 0.5);
  box-shadow: -8px 0 8px rgba(0, 0, 0, 0.5);
  min-height: 100%;
  width: 200px;
  background: #1a1a1a;
}

.nav-wrapper {
  width: 100%;
}
.nav-wrapper nav.top-bar {
  padding: 0px;
  width: 100%;
}
.nav-wrapper nav.top-bar ul.visible-nav .logo {
  width: 80%;
  left: unset;
}
@media screen and (min-width: 415px) and (max-width: 1372px) and (orientation: landscape) {
  .nav-wrapper nav.top-bar ul.visible-nav .logo {
    width: 29%;
  }
}
@media screen and (min-width: 1280px) and (max-width: 1280px) and (orientation: landscape) {
  .nav-wrapper nav.top-bar ul.visible-nav .logo {
    position: relative;
    left: 141px;
  }
}
.nav-wrapper nav.top-bar ul.visible-nav .logo a {
  border: none;
}
.nav-wrapper nav.top-bar ul.visible-nav .logo a img {
  margin-left: 10px;
  width: auto;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .nav-wrapper nav.top-bar ul.visible-nav .logo a img {
    width: auto;
  }
}
@media screen and (min-device-width: 120px) and (max-device-width: 360px) and (orientation: portrait) {
  .nav-wrapper nav.top-bar ul.visible-nav .logo a img {
    margin-left: 0px;
    position: relative;
    left: 5px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) {
  .nav-wrapper nav.top-bar ul.visible-nav .logo a img {
    width: 66%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .nav-wrapper nav.top-bar ul.visible-nav .logo a img {
    width: 44%;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 812px) and (-webkit-device-pixel-ratio: 3) {
  .nav-wrapper nav.top-bar ul.visible-nav .logo a img {
    width: 66%;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .nav-wrapper nav.top-bar ul.visible-nav .logo a img {
    width: auto;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .nav-wrapper nav.top-bar ul.visible-nav .logo a img {
    width: 71%;
  }
}
.nav-wrapper nav.top-bar ul.visible-nav .menu-icon {
  margin-right: 0px;
  width: 87px;
  float: right;
  width: 61px;
  top: -35px;
  right: 11px;
  height: 0px;
  position: relative;
}
.nav-wrapper nav.top-bar ul.visible-nav .menu-icon a {
  font-weight: bold;
  font-family: "ProximaNovaBold";
  color: #e9d93c;
  border: 2px solid #e9d93c;
  background: #203245;
  border-radius: 16px;
  font-size: 15px;
  padding: 2px 9px;
}
@media screen and (min-device-width: 120px) and (max-device-width: 360px) and (orientation: portrait) {
  .nav-wrapper nav.top-bar ul.visible-nav .menu-icon {
    right: 0px;
  }
}
@media screen and (min-width: 1280px) and (max-width: 1280px) and (orientation: landscape) {
  .nav-wrapper nav.top-bar ul.visible-nav .menu-icon {
    right: 145px;
  }
}
.nav-wrapper nav.top-bar ul.visible-nav .login-link {
  position: relative;
  width: 61px;
  height: 0px;
  float: right;
  right: 87px;
  top: -35px;
  letter-spacing: 0.03em;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .nav-wrapper nav.top-bar ul.visible-nav .login-link {
    right: 72px;
  }
}
@media screen and (min-device-width: 120px) and (max-device-width: 360px) and (orientation: portrait) {
  .nav-wrapper nav.top-bar ul.visible-nav .login-link {
    right: 55px;
  }
}
@media screen and (min-width: 1280px) and (max-width: 1280px) and (orientation: landscape) {
  .nav-wrapper nav.top-bar ul.visible-nav .login-link {
    right: 211px;
  }
}
.nav-wrapper nav.top-bar ul.visible-nav .login-link a {
  color: #46b8fd;
  font-family: "ProximaNovaBold";
}
@media screen and (min-device-width: 120px) and (max-device-width: 360px) and (orientation: portrait) {
  .nav-wrapper nav.top-bar ul.visible-nav .login-link a.logout {
    position: relative;
    left: -2px;
    font-size: 14px;
  }
}

.pageWrapper {
  height: 100%;
  position: relative;
  width: 100%;
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-transition: 300ms ease all;
  -moz-transition: 300ms ease all;
  -ms-transition: 300ms ease all;
  -o-transition: 300ms ease all;
  transition: 300ms ease all;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}

.site-canvas--active {
  padding-bottom: 100px;
  -webkit-transform: translateX(-30%);
  -moz-transform: translateX(-30%);
  -ms-transform: translateX(-30%);
  -o-transform: translateX(-30%);
  transform: translateX(-30%);
  -webkit-transform: translate3d(-30%, 0, 0);
  -moz-transform: translate3d(-30%, 0, 0);
  -ms-transform: translate3d(-30%, 0, 0);
  -o-transform: translate3d(-30%, 0, 0);
  transform: translate3d(-30%, 0, 0);
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) {
  .site-canvas--active {
    padding-bottom: 100px;
    -webkit-transform: translateX(-60%);
    -moz-transform: translateX(-60%);
    -ms-transform: translateX(-60%);
    -o-transform: translateX(-60%);
    transform: translateX(-60%);
    -webkit-transform: translate3d(-60%, 0, 0);
    -moz-transform: translate3d(-60%, 0, 0);
    -ms-transform: translate3d(-60%, 0, 0);
    -o-transform: translate3d(-60%, 0, 0);
    transform: translate3d(-60%, 0, 0);
  }
}

.site-menu {
  background: #15283c;
  color: #FFF;
  height: 100%;
  right: -30%;
  padding: 15px;
  position: fixed;
  top: 0;
  width: 30%;
  overflow: hidden;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) {
  .site-menu {
    right: -60%;
    width: 60%;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .site-menu .inner-right-nav {
    top: -20px;
    position: relative;
  }
}

.close-panel {
  float: right;
  height: 40px;
  position: relative;
  color: #FFF;
  text-decoration: none;
  font-size: 20px;
  padding-bottom: 0;
  padding-top: 0;
  display: block;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .close-panel {
    padding-top: 54px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .close-panel {
    height: 20px;
    width: 20px;
  }
}
.close-panel span.close-x {
  font-weight: bold;
  font-family: "ProximaNovaBold";
  color: #e9d93c;
  border: 2px solid #e9d93c;
  background: #203245;
  border-radius: 50%;
  font-size: 25px;
  padding: 1px 9px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .close-panel span.close-x {
    padding: 2px 9px;
    position: relative;
    left: -20px;
    font-size: 20px;
  }
}

li.off-canvas-close {
  clear: both;
  height: 40px;
  position: relative;
  top: 25px;
  width: 40px;
  left: 163px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  li.off-canvas-close {
    top: -50px;
  }
}

.pane-cmatgame-blocks-cmat-blocks-mobile-header-menu {
  position: relative;
  top: -40px;
  width: 130px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .pane-cmatgame-blocks-cmat-blocks-mobile-header-menu {
    top: -80px;
  }
}

li#home-link {
  width: 100px;
}

#link-home {
  text-decoration: none;
  height: 40px;
  color: #46b8fd;
  line-height: 42px;
  font-family: "ProximaNovaBold";
  position: relative;
  width: 60px;
  display: block;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  #link-home {
    height: 70px !important;
  }
}

.myaccount-placed {
  top: -58px;
  position: relative;
}
.myaccount-placed a {
  text-decoration: none;
  height: 40px;
  color: #46b8fd;
  line-height: 42px;
  font-family: "ProximaNovaBold";
}

.mobile-hamburger-categories {
  top: -52px;
  position: relative;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 603px) and (orientation: landscape) {
  .mobile-hamburger-categories {
    top: -40px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .mobile-hamburger-categories {
    top: -62px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .mobile-hamburger-categories {
    top: -22px;
  }
}

.mobile-hamburger-trivia {
  top: -40px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .mobile-hamburger-trivia {
    top: 0px;
  }
}

#menu {
  text-transform: uppercase;
  font-family: "ProximaNova";
  margin-top: 26px;
  width: 140px;
}

#menu a {
  text-decoration: none;
  height: 40px;
  color: #46b8fd;
  line-height: 42px;
  font-family: "ProximaNovaBold";
}
#menu a:active {
  color: #97cbea;
}

#menuItems {
  width: 140px;
}

#menuItems a li.selected {
  color: #97cbea;
}
#menuItems a li.selected::before {
  font-weight: bold;
  content: " > ";
}

p.categories-sidebar {
  font-size: 1.125rem;
  height: 28px;
  font-family: "ProximaNova";
  letter-spacing: 0.04em;
}

.mobile-categories-wrapper .views-field-name {
  display: block;
  height: 30px;
}
.mobile-categories-wrapper .views-field-name .field-content a {
  color: #1dd155;
  font-size: 16px;
  vertical-align: middle;
  line-height: 25px;
}
.mobile-categories-wrapper .views-field-name .field-content a:active {
  background: transparent;
  border: none;
  color: #9ebd97;
}

.trivia-mobile-menu .trivia-category-menu-link {
  color: #E39321;
  font-size: 16px;
  vertical-align: middle;
  line-height: 25px;
}
.trivia-mobile-menu .trivia-category-menu-link.active {
  font-family: "ProximaNovaBold";
  color: #e8be81;
}
.trivia-mobile-menu .trivia-category-menu-link.active::before {
  font-weight: bold;
  content: " > ";
}
.trivia-mobile-menu .side-link {
  display: block;
  height: 30px;
}

.followup-mobile-menu .followus-category-menu-link {
  color: #ff6e75;
  font-size: 16px;
  vertical-align: middle;
  line-height: 25px;
}
.followup-mobile-menu .followus-category-menu-link.active {
  font-family: "ProximaNovaBold";
  color: #ff6e75;
}
.followup-mobile-menu .followus-category-menu-link.active::before {
  font-weight: bold;
  content: " > ";
}
.followup-mobile-menu .side-link {
  display: block;
  height: 30px;
}

.followup-menu-container {
  padding-top: 15px;
}

body.node-type-page #block-system-main h1 {
  color: #e6f6ff;
  font-size: 30px;
  border-bottom: 2px solid #47a6ff;
  padding-bottom: 13px;
  text-transform: uppercase;
}
body.node-type-page #block-system-main .textContent {
  font-size: 19px;
}
body.node-type-page #block-system-main .textContent a, body.node-type-page #block-system-main .textContent .greenLink, body.node-type-page #block-system-main .textContent .externalLink {
  color: #3bc5fe;
  text-decoration: none;
}
body.node-type-page #block-system-main .field-body {
  padding-bottom: 0px !important;
}

@media screen and (min-width: 768px) and (max-width: 1366px) {
  .front .contentWrapper {
    top: 20px;
  }
}
.front .block-text-separator {
  color: #ccc;
  position: relative;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  padding-bottom: 12px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .front .block-text-separator {
    top: 16px;
  }
}
.front .pane-title {
  background: #2e6893;
  color: #e6f6ff;
  border-radius: 6px;
  text-transform: uppercase;
  height: 26px;
  padding: 0px 0 1px 29px;
  font-family: "ProximaNovaBold";
  font-size: 20px;
  margin: 14px auto 18px;
  line-height: 26px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .front .pane-title {
    letter-spacing: -1px;
  }
}
.front #gameListings {
  padding: 0px 11px;
}
.front #gameListings li {
  width: 100%;
  padding-right: 0px;
  float: left;
  margin: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .front #gameListings li {
    display: inline-block;
    width: 46%;
    height: 94px;
    float: left;
    padding-bottom: 15px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .front #gameListings li {
    height: 92px;
    margin: 6px 0px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .front #gameListings .trivia-mobile-item li {
    display: inline-block;
    width: 92%;
    height: 94px;
    float: left;
    padding-bottom: 15px;
  }
}
.front .mobile-popular-games-two {
  float: left;
  width: 100%;
  margin: 0px auto 4px auto;
}
.front .mobile-popular-games {
  float: left;
  width: 100%;
  margin: 0px auto 8px auto;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .front .mobile-popular-games {
    margin: 0px auto 10px auto;
  }
}
.front .mobile-popular-games .game-item li .game-item-inner a .iconOverlay {
  background: url("../images/IconBezelOrange.png") no-repeat;
  background-position: -2px -2px;
  background-size: cover;
  display: block;
  position: absolute;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .front .mobile-popular-games .game-item li .game-item-inner a .iconOverlay {
    width: 77px;
    height: 77px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .front .mobile-popular-games .game-item li .game-item-inner a .iconOverlay {
    width: 97px;
    height: 97px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .front .mobile-popular-games .game-item li .game-item-inner a .iconOverlay {
    background-position: -2px;
    background-size: 97px 97px;
    display: 0;
    width: 92px;
    height: 92px;
  }
}
.front .mobile-popular-games .game-item li .game-item-inner a #gameTitle {
  color: #ffaa23;
}
.front .mobile-popular-games .most-popular-see-more {
  background-color: #e14603;
  height: 26px;
  border-radius: 6px;
  margin: 10px auto 20px;
}
.front .mobile-popular-games .most-popular-see-more .iconOverlay {
  background: url("../images/IconBezelOrange.png") no-repeat;
  background-position: -2px -2px;
  background-size: cover;
  display: block;
  position: absolute;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .front .mobile-popular-games .most-popular-see-more .iconOverlay {
    width: 77px;
    height: 77px;
  }
}
@media screen and (min-width: 415px) and (max-width: 768px) and (orientation: portrait) {
  .front .mobile-popular-games .most-popular-see-more .iconOverlay {
    background-position: -2px;
    background-size: 97px 97px;
    display: inherit;
    width: 92px;
    height: 92px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .front .mobile-popular-games .most-popular-see-more .iconOverlay {
    background-position: -2px;
    background-size: 97px 97px;
    display: 0;
    width: 92px;
    height: 92px;
  }
}
.front .mobile-popular-games .most-popular-see-more h2 {
  color: #ffecd3;
  padding: 0px 0 4px 29px;
  display: inline-block;
  line-height: 26px;
}
.front .mobile-popular-games .most-popular-see-more p {
  display: inline-block;
  float: right;
  margin-top: 8px;
  padding-right: 20px;
  height: 11px;
}
.front .mobile-popular-games .most-popular-see-more p a {
  background: url(../images/cmgmobileimages/mobile_seemorelink_69x11.png);
  width: 69px;
  margin-top: -1px;
  height: 11px;
  float: right;
  font-size: 0px;
}
.front .mobile-looking-more {
  float: left;
  margin: 10px auto 50px auto;
  width: 100%;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .front .mobile-looking-more {
    margin: 30px auto 60px auto;
  }
}
.front .mobile-looking-more p {
  line-height: 51px;
  padding-right: 0px;
  text-align: center;
  font-weight: bold;
  font-size: 22px;
  color: #FFF;
  font-family: "ProximaNovaBold";
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .front .mobile-looking-more p {
    font-size: 26px;
  }
}
.front .mobile-looking-more a {
  background: url("/themes/custom/cmatgame_mob/css/../images/cmgmobileimages/view_all_games_467.png");
  width: 190px;
  height: 35px;
  display: block;
  margin: 0 auto;
  font-size: 0px;
  text-indent: 99999px;
}
.front .pane-mobile-categories {
  clear: both;
}
.front .pane-mobile-categories .block-text-separator {
  color: #ccc;
  position: relative;
  left: -107px;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  padding-bottom: 12px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .front .pane-mobile-categories .block-text-separator {
    left: 33px;
    top: 22px;
  }
}
.front .pane-mobile-categories .pane-title {
  clear: both;
  border-radius: 6px;
  text-transform: uppercase;
  height: 26px;
  padding: 0px 0 1px 29px;
  font-family: "ProximaNovaBold";
  font-size: 20px;
  margin: 14px auto;
  line-height: 26px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .front .pane-mobile-categories .pane-title {
    letter-spacing: -1px;
  }
}
.front .pane-mobile-categories .mobile-categories-header {
  background: #3c9e39;
  height: 26px;
  border-radius: 6px;
  margin: 10px auto 20px;
  color: #e2ffe6;
  vertical-align: middle;
}
.front .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
  top: 0px;
  left: 0;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .front .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    border: none;
    float: right;
    height: 250px;
    margin: 0;
    padding: 30px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .front .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    left: -108px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .front .cmg-ad-nongame-300_250_footer {
    top: 8px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .front {
    top: -25px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .front .cmg-ad-nongame-320_50-3 {
    left: -99px;
    top: -23px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .front .homepage-top-container {
    height: 60px;
    max-height: 60px;
    min-height: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .front .mobile-container {
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
    top: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .front .mobile-container {
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
    top: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .front .mobile-container {
    left: 0px;
    top: 11px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .front .mobile-container:first-child {
    margin-bottom: 10px;
    position: relative;
    top: 30px;
    right: 10px;
  }
}
.front .mobile-container .detailBlock {
  bottom: 0px;
  display: inline-block;
  top: 30px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .front .mobile-container .detailBlock {
    top: 68px;
    margin-left: 164px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .front .mobile-container .detailBlock {
    top: -287px;
    left: -53px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .front .mobile-container .detailBlock {
    display: block;
    margin: 0 auto;
    text-align: center;
  }
}

.game-item li .game-item-inner a span.iconOverlay.trivia-qotd {
  background: url(/themes/custom/cmatgame_mob/images/IconBezelOrange.png) no-repeat;
  background-position: -2px -2px;
  background-size: cover;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .game-item li .game-item-inner a span.iconOverlay.trivia-qotd {
    background-position: -4px -3px;
    background-size: cover;
    padding: 4px;
  }
}

/*  Daily games mobile css changes - CLSS-2008 */
.front .mobile-daily-games .mobile-dailygames-see-more {
  background-color: #e3cf09;
  margin: 10px auto 20px;
  height: 26px;
  border-radius: 6px;
}

.front .mobile-daily-games .game-item li .game-item-inner a #gameTitle {
  color: #e3cf09;
}

.front .mobile-daily-games .mobile-dailygames-see-more h2 {
  color: #FFFFFF;
}

.front .mobile-daily-games .mobile-dailygames-see-more p a {
  width: 69px;
  margin-top: -1px;
  height: 11px;
  float: right;
  font-size: 0px;
  background: url(../images/cmgmobileimages/see_more_for_yellow_background.png);
}

.front .mobile-daily-games .game-item li .game-item-inner a .iconOverlay, .page-taxonomy-term-1058.domain-m-coolmath-games-com .game-item li .game-item-inner a span.iconOverlay {
  background: url("../images/IconBezelYellow.png") no-repeat;
  background-position: -2px -2px;
  background-size: cover;
  display: block;
  position: absolute;
  height: 97px;
  width: 97px;
}

.front .pane-title {
  padding: 1px 0 1px 29px;
  letter-spacing: 0.5px;
}

.front .mobile-container.homepage-top-container {
  text-align: center;
  margin: 0 auto;
  float: none;
}

.front .mobile-popular-games .most-popular-see-more h2, .mobile-categories-header h2 {
  letter-spacing: 0.5px;
}

#gameDetail {
  padding-top: 0px;
  max-width: 960px;
  margin: 0 auto;
  list-style-type: none;
  height: auto;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  #gameDetail {
    padding: 0px 21px;
  }
}
#gameDetail .field-mobile-screenshot img {
  display: block;
  float: left;
  width: 320px;
  height: 480px;
  padding: 0 20px 20px 0;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  #gameDetail .field-mobile-screenshot img {
    width: 161px;
    padding: 0px 20px;
    height: 258px;
    display: block;
    float: left;
  }
}
@media screen and (min-device-width: 120px) and (max-device-width: 360px) and (orientation: portrait) {
  #gameDetail .field-mobile-screenshot img {
    position: relative;
    left: -1px;
  }
}

.field-mobile-instructions p {
  color: #e6f6ff;
  font-size: 18px;
  line-height: 1.06em;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .field-mobile-instructions p {
    font-size: 18px;
    line-height: 1.06em;
  }
}

#moreButton {
  display: none;
  line-height: 10px;
  font-size: 1.125em;
  color: #5edbff;
  letter-spacing: 0.03em;
  float: right;
  position: relative;
  right: 20px;
  top: 20px;
}

#moreButton:before, #lessButton:before {
  content: "[";
  color: #fff;
}

#moreButton:after, #lessButton:after {
  content: "]";
  color: #fff;
}

#lessButton {
  display: none;
  line-height: 10px;
  font-size: 1.125em;
  color: #5edbff;
  float: right;
  position: relative;
  right: 20px;
  top: 20px;
}

#gamePlayForm h1 {
  color: #e6f6ff;
  letter-spacing: -1px;
  text-transform: uppercase;
  font-size: 19px;
  margin-bottom: 14px;
  padding-bottom: 5px;
  font-family: "ProximaNovaBold";
  width: 100%;
  border-bottom: 1.5px solid #449ff3;
  text-decoration: none;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  #gamePlayForm h1 {
    font-size: 30px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  #gamePlayForm h1 {
    margin-bottom: 22px;
  }
}
#gamePlayForm h1 a {
  text-decoration: none;
}
#gamePlayForm #playNowButton {
  width: 145px;
  height: 45px;
  text-align: center;
  display: inline-block;
  margin-bottom: 20px;
  background-color: #12a64a;
  border-radius: 10px;
  color: #FFF;
  font-size: 24px;
  vertical-align: middle;
  line-height: 45px;
  font-weight: bold;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  #gamePlayForm #playNowButton {
    width: 157px;
    height: 32px;
    line-height: 32px;
    background-repeat: no-repeat !important;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  #gamePlayForm #playNowButton {
    width: 145px;
    height: 32px;
    text-align: center;
    display: inline-block;
    margin-bottom: 20px;
    background-color: #12a64a;
    border-radius: 10px;
    color: #FFF;
    font-size: 21px;
    vertical-align: middle;
    line-height: 32px;
    font-weight: bold;
  }
}
#gamePlayForm #playNowButton:active, #gamePlayForm #playNowButton:hover {
  background: #106932;
}

@media screen and (device-aspect-ratio: 40/71) {
  .gameLandingPage #gameDetail img {
    width: 45%;
    height: 66%;
    padding: 20px 10px 20px 10px;
  }

  .field-mobile-instructions {
    font-size: 10px;
  }

  #playNowButton {
    width: 145px;
    height: 45px;
    text-align: center;
    display: inline-block;
    margin-bottom: 20px;
    background-color: #12a64a;
    border-radius: 10px;
    color: #FfF;
    font-size: 24px;
    vertical-align: middle;
    line-height: 45px;
    font-weight: bold;
  }
}
#gameDetail .mobile-container {
  text-align: left;
  top: 20px;
  margin-top: 10px;
  float: left;
}

#gameDetail .field-mobile-screenshot .field__label {
  display: none;
}

.mobile-container.homepage-top-container {
  float: none;
}

.mobile-container {
  display: block;
  float: left;
  width: auto;
  text-align: left;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .mobile-container {
    position: relative;
    top: 46px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .mobile-container {
    position: relative;
    text-align: center;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .mobile-container {
    display: inline-block;
    position: relative;
    height: 320px;
    width: 100%;
    margin: 19px;
  }
  .mobile-container .block-text-seperator {
    color: #ccc;
    position: relative;
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    bottom: 5px;
    left: 20px;
    top: 0px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) and (min-device-width: 375px) and (max-device-width: 667px) {
  .mobile-container .block-text-seperator {
    padding-bottom: 0px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .mobile-container .detailBlock {
    top: 5px;
  }
}

.gameInstructions {
  height: 117px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .gameInstructions {
    height: 117px;
  }
}

#gameInstructionsInner {
  height: 117px;
  overflow: hidden;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  #gameInstructionsInner {
    height: 207px;
    overflow: hidden;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  #gameInstructionsInner {
    height: 117px;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .homepage-top-container {
    height: 60px;
    max-height: 60px;
    min-height: 0;
  }
}

#gameDetail.detailBlock {
  top: 0px !important;
  left: 0px !important;
}

@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noFlashGame .mobile-container {
    width: 350px;
    top: 20px;
    left: 14px;
  }
}
.noFlashGame .mobile-container .detailBlock {
  margin-left: 0px;
  left: 0px;
  top: 5px;
}
.noFlashGame .mobile-container span.block-text-seperator {
  left: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noFlashGame .mobile-container span.block-text-seperator {
    left: 0px;
  }
}

.noFlashGame #nogameContainer {
  color: white;
  line-height: 21px;
  font-size: 17.5px;
  padding: 0px 14px;
}
.noFlashGame #nogameContainer img#game-not-found {
  width: 37px;
  height: 37px;
  margin: 0px;
  padding-bottom: 7px;
  padding-left: 0px;
  padding-right: 12px;
  display: inline-block;
  float: left;
}
.noFlashGame #nogameContainer span.noFlashGame-game-title {
  font-weight: bold;
  font-family: "ProximaNovaBold";
}
.noFlashGame #nogameContainer .noFlashGame-message-text {
  margin: 11px 0px 20px 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noFlashGame #nogameContainer .noFlashGame-message-text {
    margin: 0px 0px 30px 0px;
  }
}
.noFlashGame #nogameContainer span.iconOverlayNoGame {
  background: url("/themes/custom/cmatgame_mob/css/../images/IconBezelOrange.png") no-repeat;
  background-position: -2px -2px;
  background-size: cover;
  display: block;
  position: absolute;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noFlashGame #nogameContainer span.iconOverlayNoGame {
    background-position: -2px;
    background-size: 97px 97px;
    display: 0;
  }
}
.noFlashGame #nogameContainer .iconOverlayNoGame {
  width: 77px;
  height: 77px;
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .noFlashGame #nogameContainer .iconOverlayNoGame {
    width: 97px;
    height: 97px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noFlashGame #nogameContainer .iconOverlayNoGame {
    width: 92px;
    height: 92px;
  }
}
.noFlashGame #nogameContainer .noflashgame-image {
  height: 92px;
  width: 92px;
  padding: 0px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .noFlashGame #nogameContainer .noflashgame-image {
    width: 72px;
    height: 71px;
    clip-path: none;
    margin-left: 0px;
    margin-top: 0px;
    border: 0px;
    border-radius: 6px;
    float: left;
    padding: 0px;
  }
}
@media screen and (min-device-width: 375px) and (max-device-width: 736px) and (orientation: landscape) {
  .noFlashGame #nogameContainer .noflashgame-image {
    width: 72px;
    height: 71px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noFlashGame #nogameContainer .noflashgame-top-games .game-item li {
    display: inline-block;
    width: 47%;
    height: 94px;
    float: left;
    padding-bottom: 15px;
    padding-right: 20px;
  }
  .noFlashGame #nogameContainer .noflashgame-top-games .game-item li .field-mobile-thumbnail img {
    width: 92px;
    height: 92px;
  }
}
.noFlashGame #nogameContainer .wantMoreLink {
  margin-top: 20px;
  margin-bottom: 15px;
}
.noFlashGame #nogameContainer .wantMoreLink a {
  color: #3bc5fe;
  letter-spacing: 0.03em;
  font-family: "ProximaNovaBold";
  font-size: 20px;
}

#continue-container {
  width: 200px;
  display: block;
  margin: 0 auto;
  font-family: "ProximaNovaBold";
  font-weight: bold;
  font-size: 20px;
  text-transform: uppercase;
  position: relative;
  top: 25px;
}

#continue-link {
  font-size: 20px;
  text-transform: uppercase;
  display: inline-block;
  font-weight: bold;
  font-family: "ProximaNovaBold";
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  #continue-link {
    font-size: 24px;
  }
}

.timer_div {
  font-size: 20px;
  text-transform: uppercase;
  display: inline-block;
  font-weight: bold;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .timer_div {
    font-size: 24px;
  }
}

#timer_div {
  font-size: 20px;
  display: inline-block;
  margin-left: 8px;
  font-family: "ProximaNovaBold";
  font-weight: bold;
  width: 10px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  #timer_div {
    font-size: 24px;
  }
}

/* Keyframes */
.preroll-headline {
  color: #e6f6ff;
  letter-spacing: -1px;
  font-size: 20px;
  margin-bottom: 14px;
  padding-bottom: 8px;
  font-family: "ProximaNovaBold";
  width: 100%;
  border-bottom: 1.5px solid #449ff3;
  text-decoration: none;
  margin-top: 5px;
}
.preroll-headline h3 {
  border: none;
  color: #e6f6ff;
  width: auto;
  height: 30px;
  vertical-align: middle;
  line-height: 34px;
  display: inline-block;
  font-size: 21px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .preroll-headline h3 {
    font-size: 30px;
    height: 34px;
  }
}
.preroll-headline a {
  text-decoration: none;
}

.continue-to-game-link {
  color: #f5e61f;
  text-transform: uppercase;
  font-weight: bold;
  font-family: "ProximaNovaBold";
  position: relative;
  width: 250px;
  left: -120px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .continue-to-game-link {
    width: 275px;
    left: -120px;
  }
}

.continue-link-yellow {
  color: #f5e61f;
}

body.page-1-popular #block-system-main {
  margin: 0px;
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  body.page-1-popular #block-system-main .mobile-container {
    text-align: center;
    top: 0px;
    float: none;
    top: -10px;
    left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .mobile-container {
    left: 0px;
    top: 11px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .mobile-container {
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
  }
}
body.page-1-popular #block-system-main .mobile-container .detailBlock {
  bottom: 0px;
  display: inline-block;
  top: 30px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  body.page-1-popular #block-system-main .mobile-container .detailBlock {
    top: 68px;
    margin-left: 164px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .mobile-container .detailBlock {
    float: right;
    top: -287px;
    left: -53px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .mobile-container .detailBlock {
    display: block;
    margin: 0 auto;
    text-align: center;
  }
}
body.page-1-popular #block-system-main .block-text-separator {
  color: #ccc;
  position: relative;
  left: -107px;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  padding-bottom: 12px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .block-text-separator {
    left: -107px;
    top: 1px;
  }
}
body.page-1-popular #block-system-main .pane-title {
  background: #2e6893;
  color: #e6f6ff;
  border-radius: 6px;
  text-transform: uppercase;
  height: 26px;
  padding: 0px 0 1px 29px;
  font-family: "ProximaNovaBold";
  font-size: 20px;
  margin: 14px auto;
  line-height: 26px;
}
body.page-1-popular #block-system-main #gameListings {
  padding: 0px 12px;
}
body.page-1-popular #block-system-main li {
  width: 100%;
  padding-right: 0px;
  float: left;
  margin: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  body.page-1-popular #block-system-main li {
    display: inline-block;
    width: 47%;
    height: 94px;
    float: left;
    padding-bottom: 15px;
    padding-right: 20px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) {
  body.page-1-popular #block-system-main li {
    display: inline-block;
    height: 94px;
    float: left;
    padding-bottom: 15px;
    padding-right: 20px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .homeAd {
    left: 26px;
    position: relative;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  body.page-1-popular #block-system-main .homeAd {
    left: 32px;
    position: relative;
  }
}
body.page-1-popular #block-system-main .detailBlock {
  bottom: 0px;
  display: inline-block;
  top: 30px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  body.page-1-popular #block-system-main .detailBlock {
    top: 68px;
    margin-left: 164px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .detailBlock {
    float: right;
    top: 68px;
    margin: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .detailBlock {
    display: block;
    margin: 0 auto;
    text-align: center;
  }
}
body.page-1-popular #block-system-main .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
  margin: 16px auto;
  text-align: center;
  width: 350px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    float: right;
    height: 250px;
    left: -75px;
    margin: 0;
    padding: 30px 0 50px;
    width: 300px;
    position: relative;
    top: -24px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    border: none;
    margin: 30px auto;
    text-align: center;
    width: 350px;
    position: relative;
    top: 10px;
    clear: both;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  body.page-1-popular #block-system-main .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    border: none;
    left: -153px;
    float: right;
    height: 250px;
    margin: 0;
    padding: 30px 0 50px;
  }
}
body.page-1-popular #block-system-main .cmg-ad-nongame-300_250_footer {
  margin: 16px auto;
  text-align: center;
  width: 350px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .cmg-ad-nongame-300_250_footer {
    float: right;
    height: 250px;
    left: -75px;
    margin: 0;
    padding: 30px 0 50px;
    width: 300px;
    position: relative;
    top: -25px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .cmg-ad-nongame-300_250_footer {
    border: none;
    margin: 30px auto;
    text-align: center;
    width: 350px;
    position: relative;
    top: 10px;
    clear: both;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  body.page-1-popular #block-system-main .cmg-ad-nongame-300_250_footer {
    border: none;
    left: -153px;
    float: right;
    height: 250px;
    margin: 0;
    padding: 30px 0 50px;
  }
}
body.page-1-popular #block-system-main .cmg-ad-nongame-320_50-3 {
  margin: 16px auto;
  text-align: center;
  width: 350px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .cmg-ad-nongame-320_50-3 {
    float: right;
    height: 250px;
    left: -75px;
    margin: 0;
    padding: 30px 0 50px;
    width: 300px;
    position: relative;
    top: -25px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  body.page-1-popular #block-system-main .cmg-ad-nongame-320_50-3 {
    border: none;
    margin: 30px auto;
    text-align: center;
    width: 350px;
    position: relative;
    top: 10px;
    clear: both;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  body.page-1-popular #block-system-main .cmg-ad-nongame-320_50-3 {
    border: none;
    left: -159px;
    float: right;
    height: 250px;
    margin: 0;
    padding: 30px 0 50px;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-1-complete-game-list .homepage-top-container {
    height: 60px;
    max-height: 60px;
    min-height: 0;
  }
}
.page-1-complete-game-list #block-system-main {
  margin: 0px;
}
.page-1-complete-game-list #block-system-main .block-text-separator {
  color: #ccc;
  position: relative;
  left: -107px;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  padding-bottom: 12px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-1-complete-game-list #block-system-main .block-text-separator {
    left: -107px;
    top: 1px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .page-1-complete-game-list #block-system-main .block-text-separator {
    left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .page-1-complete-game-list #block-system-main .block-text-separator {
    left: 0;
  }
}
.page-1-complete-game-list #block-system-main .pane-title {
  background: #2e6893;
  color: #e6f6ff;
  border-radius: 6px;
  text-transform: uppercase;
  height: 26px;
  padding: 0px 0 1px 29px;
  font-family: "ProximaNovaBold";
  font-size: 20px;
  margin: 14px auto;
  line-height: 26px;
}
.page-1-complete-game-list #block-system-main #gameListings {
  padding: 0px 12px;
}
.page-1-complete-game-list #block-system-main li {
  width: 100%;
  padding-right: 0px;
  float: left;
  margin: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .page-1-complete-game-list #block-system-main li {
    display: inline-block;
    width: 47%;
    height: 94px;
    float: left;
    padding-bottom: 15px;
    padding-right: 20px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) {
  .page-1-complete-game-list #block-system-main li {
    display: inline-block;
    height: 94px;
    float: left;
    padding-bottom: 15px;
    padding-right: 20px;
  }
}
.page-1-complete-game-list #block-system-main .detailBlock {
  bottom: 0px;
  display: inline-block;
  top: 30px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .page-1-complete-game-list #block-system-main .detailBlock {
    top: 68px;
    margin-left: 164px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-1-complete-game-list #block-system-main .detailBlock {
    float: right;
    top: 68px;
    margin: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-1-complete-game-list #block-system-main .detailBlock {
    display: block;
    margin: 0 auto;
    text-align: center;
  }
}
.page-1-complete-game-list #block-system-main .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
  margin: 16px auto;
  text-align: center;
  width: 350px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-1-complete-game-list #block-system-main .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    float: right;
    height: 250px;
    left: -78px;
    margin: 0;
    padding: 30px 0 50px;
    width: 300px;
    position: relative;
    top: -23px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-1-complete-game-list #block-system-main .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    border: none;
    margin: 30px auto;
    text-align: center;
    width: 350px;
    position: relative;
    top: 10px;
    clear: both;
    height: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .page-1-complete-game-list #block-system-main .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    border: none;
    left: -154px;
    top: -20px;
    float: right;
    height: 250px;
    margin: 0;
    padding: 30px 0 50px;
  }
}
.page-1-complete-game-list #block-system-main .cmg-ad-nongame-300_250_footer {
  margin: 16px auto;
  text-align: center;
  width: 350px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-1-complete-game-list #block-system-main .cmg-ad-nongame-300_250_footer {
    float: right;
    height: 250px;
    left: -78px;
    margin: 0;
    padding: 30px 0 50px;
    width: 300px;
    position: relative;
    top: -23px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-1-complete-game-list #block-system-main .cmg-ad-nongame-300_250_footer {
    border: none;
    margin: 30px auto;
    text-align: center;
    width: 350px;
    position: relative;
    top: 10px;
    clear: both;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .page-1-complete-game-list #block-system-main .cmg-ad-nongame-300_250_footer {
    border: none;
    left: -150px;
    top: -20px;
    float: right;
    height: 250px;
    margin: 0;
    padding: 30px 0 50px;
  }
}
.page-1-complete-game-list #block-system-main .cmg-ad-nongame-320_50-3 {
  margin: 16px auto;
  text-align: center;
  width: 350px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-1-complete-game-list #block-system-main .cmg-ad-nongame-320_50-3 {
    left: -30px;
    top: -22px;
    margin: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-1-complete-game-list #block-system-main .cmg-ad-nongame-320_50-3 {
    border: none;
    margin: 30px auto;
    text-align: center;
    width: 350px;
    position: relative;
    top: 10px;
    clear: both;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .page-1-complete-game-list #block-system-main .cmg-ad-nongame-320_50-3 {
    border: none;
    left: -147px;
    top: -17px;
    float: right;
    height: 250px;
    margin: 0;
    padding: 30px 0 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .page-1-complete-game-list .mobile-container {
    text-align: center;
    top: 0px;
    float: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-1-complete-game-list .mobile-container {
    left: 0px;
    top: 11px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-1-complete-game-list .mobile-container {
    margin-top: 0px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 20px;
    height: 100%;
  }
}
.page-1-complete-game-list .mobile-container .detailBlock {
  bottom: 0px;
  display: inline-block;
  top: 30px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .page-1-complete-game-list .mobile-container .detailBlock {
    top: 68px;
    margin-left: 164px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-1-complete-game-list .mobile-container .detailBlock {
    float: right;
    top: -287px;
    left: -53px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-1-complete-game-list .mobile-container .detailBlock {
    display: block;
    margin: 0 auto;
    text-align: center;
  }
}

.footer {
  width: 100%;
  position: relative;
  background-image: url("/themes/custom/cmatgame_mob/css/../images/cmgmobileimages/footerbg_img.png");
  border-top: 0px;
  height: 130px;
  display: block;
  text-align: center;
  overflow: hidden;
  bottom: 0;
  left: 0;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .footer {
    z-index: 0 !important;
  }
}
.footer li {
  margin-top: 14px;
  display: inline-block;
  text-shadow: #222 0 -1px 1px;
  font-weight: bold;
  font-family: "ProximaNovaBold";
  font-size: 10px;
  padding: 0.2em 0.5em 0 0;
}
.footer li a {
  color: #3bc5fe;
}
.footer li:after {
  padding: 0px 9px 0px 15px;
  font-size: 14px;
  text-shadow: #222 0 -1px 1px;
  font-weight: lighter;
  font-size: 10px;
  padding: 0 4px 0 9px;
  content: "|";
  color: #3bc5fe;
}
.footer li:last-child:after {
  content: "";
}
.footer a.active {
  color: #3bc5fe !important;
  background: none !important;
  border: none !important;
}
.footer #footerLinks {
  width: 96%;
  text-align: center;
  margin: 7px auto auto auto;
  padding: 10px 0px 0px 15px;
  line-height: 10px;
}
.footer #footerLinks a {
  color: #3bc5fe;
  font-weight: lighter;
  letter-spacing: 0px;
}
@media screen and (min-width: 375px) and (max-width: 415px) and (orientation: portrait) {
  .footer .pane-bean-footer-copyright p {
    padding: 0 5px;
    margin-top: 15px;
    font-size: 8.5px;
    letter-spacing: 0.3px;
  }
}
.footer .pane-bean-footer-copyright .field-text-block, .footer .pane-bean-footer-copyright a {
  font-size: 10px;
  color: #979696;
  padding-bottom: 24px;
}
.footer .pane-bean-footer-copyright .field-text-block {
  margin-top: 30px;
  text-align: center;
}
.footer .panel-pane.pane-block.pane-bean-footer-copyright {
  position: relative;
  top: -10px;
}

.homeBlock {
  margin-top: 5px;
}

@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .mobile-popular-games .cmg-ad-nongame-320_50-2 {
    display: none;
    height: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 1366px) and (orientation: landscape) {
  .mobile-newest-games .cmg-ad-nongame-320_50-2 {
    display: none !important;
    height: 0;
  }
}
@media only screen and (max-width: 1025px) and (min-width: 768px) and (orientation: portrait) {
  .mobile-newest-games .cmg-ad-nongame-320_50-2 {
    display: none;
    height: 0;
  }
}
.pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
  margin: 16px auto;
  text-align: center;
  width: 350px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    height: 250px;
    left: -99px;
    margin: 0;
    padding: 30px 0 50px;
    width: 300px;
    position: relative;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    border: none;
    margin: 30px auto;
    text-align: center;
    width: 350px;
    position: relative;
    top: 10px;
    clear: both;
  }
  .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 .mobile-popular-games .cmg-ad-nongame-320_50-2 {
    display: none;
    height: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .pane-cmatgame-advertisement-mobile-ad-nongame-320x50-2 {
    border: none;
    left: -188px;
    float: right;
    height: 250px;
    margin: 0;
    padding: 30px 0 50px;
  }
}

.block-text-separator {
  color: #ccc;
  position: relative;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  padding-bottom: 12px;
  display: block;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .block-text-separator {
    padding-bottom: 0px;
  }
}

.cmg-ad-nongame-300_250_footer {
  margin: 16px auto;
  text-align: center;
  width: 350px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .cmg-ad-nongame-300_250_footer {
    height: 250px;
    left: -99px;
    margin: 0;
    padding: 30px 0 50px;
    width: 300px;
    position: relative;
    top: -25px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .cmg-ad-nongame-300_250_footer {
    border: none;
    margin: 30px auto;
    text-align: center;
    width: 350px;
    position: relative;
    top: 0px;
    clear: both;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .cmg-ad-nongame-300_250_footer {
    border: none;
    left: -188px;
    height: 250px;
    margin: 0;
    padding: 30px 0 50px;
  }
}

.cmg-ad-nongame-320_50-3 {
  margin: 16px auto;
  text-align: center;
  width: 350px;
  position: relative;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .cmg-ad-nongame-320_50-3 {
    float: right;
    height: 250px;
    left: -107px;
    margin: 0;
    padding: 27px 0 50px;
    width: 300px;
    position: relative;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .cmg-ad-nongame-320_50-3 {
    border: none;
    margin: 30px auto;
    text-align: center;
    width: 350px;
    position: relative;
    clear: both;
    height: auto;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .cmg-ad-nongame-320_50-3 {
    float: right;
    height: 250px;
    margin: 0;
    padding: 27px 0 50px;
    width: 300px;
    position: relative;
  }
}

.mobile-header-ad {
  padding-top: 10px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 25px;
  text-align: center;
  width: 100%;
}

@media screen and (min-width: 768px) and (max-width: 1366px) {
  .cmg-ad-nongame-320_50-3 {
    height: 250px;
    left: -107px;
    margin: 0;
    padding: 27px 0 50px;
    width: 300px;
    position: relative;
  }
}

@media screen and (max-width: 1025px) and (min-width: 768px) and (orientation: portrait) {
  .mobile-header-ad .mobile-container {
    top: 0;
  }
}
.trivia-cat .adsnongamefirst {
  margin-bottom: -5px;
  height: 270px;
  position: relative;
  left: 66px;
  padding-bottom: 53px;
  float: right;
  width: 300px;
}
@media screen and (max-width: 1025px) and (min-width: 768px) and (orientation: landscape) {
  .trivia-cat .adsnongamefirst {
    left: -20px;
  }
}

.trivia-cat .adsnongamesecond {
  display: block;
  float: left;
  width: 300px;
  height: 270px;
  margin-left: 10px;
}

.trivia-cat.page-taxonomy-term .mobile-container {
  width: auto;
}

.node-type-page {
  color: #e6f6ff;
}
.node-type-page .scrollableContentArea {
  padding: 5px;
}
.node-type-page .scrollableContentArea .textContent h1 {
  width: 95%;
}
.node-type-page .scrollableContentArea .textContent p, .node-type-page .scrollableContentArea .textContent a {
  font-size: 15px;
  margin-top: 15px;
}

body.page-subscribe-info h1 {
  border: none;
}
body.page-subscribe-info .subscribe-outer-container-mobile {
  display: none !important;
}
body.page-subscribe-info .cmg-subscription-error {
  display: none;
}
@media screen and (min-width: 375px) and (max-width: 415px) and (orientation: portrait) {
  body.page-subscribe-info .global-wrapper .global-content-wrapper .content-column-wrapper-mobile {
    width: 95% !important;
    margin-left: 10px;
  }
}
body.page-subscribe-info .global-wrapper .global-content-wrapper .main-column .inside {
  background: #f3f3f3;
  margin-top: 15px;
  border-radius: 5px;
  padding: 20px;
}
body.page-subscribe-info .global-wrapper .global-content-wrapper .main-column .inside .free-trial {
  display: none;
}
body.page-subscribe-info .global-wrapper .global-content-wrapper .main-column .inside #block-system-main {
  margin: 0px;
}
body.page-subscribe-info .global-wrapper .global-content-wrapper .main-column .inside .letter-area {
  position: relative;
  top: -11px;
  text-align: left;
  margin: 0 auto;
  font-family: "Helvetica";
}
body.page-subscribe-info .global-wrapper .global-content-wrapper .main-column .inside .letter-area p {
  padding-right: 20px;
  display: block;
  -webkit-margin-before: 1em;
  -webkit-margin-after: 1em;
  font-weight: lighter;
}
body.page-subscribe-info .global-wrapper .global-content-wrapper .main-column .inside .letter-area .message-headline {
  font-family: "Arial Black", sans-serif;
  font-size: 18px;
  text-align: center;
  color: #4a82a3;
  text-shadow: 1px 0px 0px #FFF;
  padding-bottom: 0px;
  margin-top: 7px;
}
body.page-subscribe-info .global-wrapper .global-content-wrapper .main-column .inside .letter-area .message-dear, body.page-subscribe-info .global-wrapper .global-content-wrapper .main-column .inside .letter-area .message-signature {
  color: #252424;
}
body.page-subscribe-info .global-wrapper .global-content-wrapper .main-column .inside .letter-area .message-subtext {
  color: #252424;
}
body.page-subscribe-info .global-wrapper .global-content-wrapper .main-column .inside .letter-area .message-link {
  color: #4a82a3;
  font-weight: bold;
}

a {
  text-decoration: none;
}
a:hover, a:active {
  text-decoration: none;
}

a:active, a:hover {
  text-decoration: none;
}

h1 {
  border-bottom: 2px solid #47a6ff;
  font-size: 30px;
  padding-bottom: 10px;
  font-family: "ProximaNovaBold";
}
@media screen and (device-aspect-ratio: 40/71) {
  h1 {
    font-size: 12px;
  }
}
@media screen and (device-aspect-ratio: 16/9) {
  h1 {
    font-size: 16px;
  }
}
@media screen and (device-aspect-ratio: 16/9) and (orientation: landscape) {
  h1 {
    font-size: 16px;
  }
}
@media screen and (device-aspect-ratio: 3/4) {
  h1 {
    font-size: 40px;
  }
}

h2 {
  font-size: 20px;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
}

.subscribe-outer-container-mobile h2, .pleasetryagain2 {
  display: none !important;
}

.return-home-link a {
  color: #46b8fd;
  font-weight: bold;
  font-family: "Helvetica";
  letter-spacing: 0.4px;
}

.error-404-page {
  color: #FFF;
}
.error-404-page .scrollableContentArea {
  margin: 25px 10px 5px 10px;
}
.error-404-page .scrollableContentArea p:nth-child(2) {
  top: 5px;
  position: relative;
}
.error-404-page .scrollableContentArea p:nth-child(3) {
  margin-top: 10px;
}
.error-404-page .scrollableContentArea a {
  color: #69e811;
}
.error-404-page #ghostImage {
  height: 70px;
  width: 59px;
  float: left;
  padding-right: 20px;
  padding-left: 8px;
  -moz-animation: bouncing 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) infinite;
  -webkit-animation: bouncing 0.5s cubic-bezier(0.25, 0.1, 0.25, 1) infinite;
}
@-moz-keyframes bouncing {
  0% {
    -moz-transform: translateY(0);
  }
  50% {
    -moz-transform: translateY(-2px);
  }
  100% {
    -moz-transform: translateY(0);
  }
}
@-webkit-keyframes bouncing {
  0% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-2px);
  }
  100% {
    -webkit-transform: translateY(0);
  }
}
.error-404-page .footer {
  position: fixed;
  bottom: 0px;
}

.page-1-mobile-categories .footer {
  position: relative !important;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-1-mobile-categories .footer {
    bottom: 0;
    position: fixed;
  }
}

.mobile-categories-node {
  text-align: center;
  display: block;
  width: 115px;
  float: left;
  height: 150px;
}
@media screen and (min-device-width: 375px) and (max-device-width: 768px) {
  .mobile-categories-node {
    width: 115px;
    height: 150px;
  }
}
@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px) {
  .mobile-categories-node {
    width: 115px;
    height: 150px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .mobile-categories-node {
    width: 180px;
    height: 175px;
  }
}
.mobile-categories-node h3 {
  color: #e2ffe6;
  font-family: "ProximaNovaBold";
  font-size: 20px;
  margin-top: 6px;
  width: 90px;
  line-height: 17.5px;
}
@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px) {
  .mobile-categories-node h3 {
    font-size: 16px;
    margin-top: 6px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .mobile-categories-node h3 {
    width: auto;
    line-height: 22.5px;
  }
}
.mobile-categories-node .field-image img {
  height: 94px;
  width: 94px;
}
@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px) {
  .mobile-categories-node .field-image img {
    height: 80px;
    width: 80px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .page-taxonomy-term .adsnongamefirst {
    float: right;
    width: 350px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-taxonomy-term .adsnongamefirst {
    float: right;
    width: 350px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .page-taxonomy-term .mobile-container.homepage-medium-container {
    width: 350px;
    display: inline;
    height: 280px;
    float: right;
    left: -179px;
    margin-bottom: 0;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-taxonomy-term .mobile-container.homepage-medium-container {
    height: auto;
    width: 300px;
    display: inline-block;
    float: right;
    left: -66px;
  }
}
.page-taxonomy-term .block-text-seperator {
  color: #ccc;
  position: relative;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  padding-bottom: 12px;
  bottom: 5px;
  top: 0px;
  left: 0px;
}
@media screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-taxonomy-term .block-text-seperator {
    left: -107px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-taxonomy-term .block-text-seperator {
    left: 0px;
  }
}
.page-taxonomy-term .block-text-separator {
  left: 0;
}
@media screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-taxonomy-term .block-text-separator {
    left: -107px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-taxonomy-term .mobile-container {
    float: none;
    height: 100px;
    left: 0;
    margin: 0 auto;
    padding: 10px 0px;
    width: 728px;
    position: relative;
    top: 0;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .page-taxonomy-term .mobile-container {
    float: none;
    height: 100px;
    left: 0;
    margin: 0 auto;
    padding: 10px 0px;
    width: 728px;
    position: relative;
    top: 0;
  }
}
.page-taxonomy-term .game-item {
  margin-left: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .page-taxonomy-term .game-item {
    margin-left: 2px;
  }
}
.page-taxonomy-term .game-item li {
  list-style-type: none;
  width: 100%;
  padding-right: 0px;
  float: left;
  margin: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .page-taxonomy-term .game-item li {
    display: inline-block;
    width: 47%;
    height: 94px;
    float: left;
    padding-bottom: 15px;
    padding-right: 20px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) {
  .page-taxonomy-term .game-item li {
    display: inline-block;
    height: 94px;
    float: left;
    padding-bottom: 15px;
    padding-right: 20px;
  }
}
.page-taxonomy-term .game-item li .game-item-inner:active {
  background-color: #204866;
  z-index: 9999;
  border-radius: 6px;
  height: 100%;
}
@media screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-taxonomy-term .game-item li .game-item-inner:active {
    height: 74.5px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .page-taxonomy-term .game-item li .game-item-inner:active {
    height: 92px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .page-taxonomy-term .game-item li .game-item-inner:active {
    width: 97%;
  }
}
.page-taxonomy-term .game-item li .game-item-inner a {
  text-decoration: none;
  color: #FFF;
}
.page-taxonomy-term .game-item li .game-item-inner a:active, .page-taxonomy-term .game-item li .game-item-inner a:hover {
  color: #FFF;
}
.page-taxonomy-term .game-item li .game-item-inner a .field-image {
  text-decoration: none;
}
.page-taxonomy-term .game-item li .game-item-inner a .field-image img {
  width: 72px;
  height: 71px;
  clip-path: none;
  margin-left: 0px;
  margin-top: 0px;
  border: 0px;
  border-radius: 6px;
  float: left;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .page-taxonomy-term .game-item li .game-item-inner a .field-image img {
    width: 92px;
    height: 92px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .page-taxonomy-term .game-item li .game-item-inner a .field-image img {
    width: 92px;
    height: 92px;
  }
}
.page-taxonomy-term .game-item li .game-item-inner a span.iconOverlay {
  background: url("../images/IconBezelBlue.png") no-repeat;
  background-position: -2px -2px;
  background-size: cover;
  display: block;
  position: absolute;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .page-taxonomy-term .game-item li .game-item-inner a span.iconOverlay {
    background-position: -2px;
    background-size: 97px 97px;
    display: 0;
  }
}
.page-taxonomy-term .game-item li .game-item-inner a .iconOverlay {
  width: 77px;
  height: 77px;
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .page-taxonomy-term .game-item li .game-item-inner a .iconOverlay {
    width: 97px;
    height: 97px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .page-taxonomy-term .game-item li .game-item-inner a .iconOverlay {
    width: 92px;
    height: 92px;
  }
}
.page-taxonomy-term .game-item li .game-item-inner a .gameDescription {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  padding-bottom: 3px;
  color: #FFF;
}
.page-taxonomy-term .game-item li .game-item-inner a .gameDescription #gameTitle {
  border: none;
  padding: 0px;
  font-family: "ProximaNovaBold";
  margin: 0 20px 0 8px;
  color: #46b8fd;
  text-decoration: none;
}
@media screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .page-taxonomy-term .game-item li .game-item-inner a .gameDescription #gameTitle {
    font-size: 18px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .page-taxonomy-term .game-item li .game-item-inner a .gameDescription #gameTitle {
    font-size: 20px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .page-taxonomy-term .game-item li .game-item-inner a .gameDescription #gameTitle {
    font-size: 18px;
  }
}
.page-taxonomy-term .game-item li .game-item-inner a .gameDescription #gameDescription {
  font-size: 17.5px;
  line-height: 1.313em;
  margin-right: 20px;
  margin-left: 8px;
  height: 2.626em;
}
.page-taxonomy-term .game-item li .game-item-inner a .gameDescription #gameDescription .field-mobile-short-description {
  text-decoration: none;
}

.more-link {
  margin: 0 auto 80px;
  width: 220px;
  font-family: "ProximaNovaBold";
  font-size: 1.125rem;
  text-align: center;
  clear: both;
  display: block;
  position: relative;
  top: 40px;
  color: #3c9e39;
  border: 1px solid #e2ffe6;
  padding: 7px 14px;
  border-radius: 6px;
  background: #e6f6ff;
  text-transform: uppercase;
}
.more-link:active {
  background-color: #FFF;
  border: 1px solid #FFF;
  color: #3c9e39;
}
.more-link:visited {
  color: #3c9e39;
}
.more-link a {
  color: #3c9e39;
}
.more-link a:visited {
  color: #3c9e39;
}
.more-link a:active {
  background-color: #FFF;
  border: 1px solid #FFF;
}

.mobile-categories-header {
  background: #3c9e39;
  height: 26px;
  border-radius: 6px;
  margin: 10px auto 13px;
  color: #e2ffe6;
  vertical-align: middle;
}
.mobile-categories-header h2 {
  clear: both;
  border-radius: 6px;
  text-transform: uppercase;
  height: 26px;
  padding: 0px 0 1px 29px;
  font-family: "ProximaNovaBold";
  font-size: 20px;
  margin: 14px auto;
  line-height: 26px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .mobile-categories-header h2 {
    letter-spacing: -1px;
  }
}

/* Daily games mobile css changes - CLSS-2008 */
.page-taxonomy-term-1058.domain-m-coolmath-games-com .mobile-categories-header, .page-taxonomy-term-1058.domain-m-coolmathgames-com .mobile-categories-header {
  background: #e3cf09;
  height: 26px;
  border-radius: 6px;
  margin: 10px auto 13px;
  color: #FFFFFF;
  vertical-align: middle;
}
.page-taxonomy-term-1058.domain-m-coolmath-games-com .mobile-categories-header h2, .page-taxonomy-term-1058.domain-m-coolmathgames-com .mobile-categories-header h2 {
  clear: both;
  border-radius: 6px;
  text-transform: uppercase;
  height: 26px;
  padding: 0px 0 1px 29px;
  font-family: "ProximaNovaBold";
  font-size: 20px;
  margin: 14px auto;
  line-height: 26px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .page-taxonomy-term-1058.domain-m-coolmath-games-com .mobile-categories-header h2, .page-taxonomy-term-1058.domain-m-coolmathgames-com .mobile-categories-header h2 {
    letter-spacing: -1px;
  }
}

.page-taxonomy-term-1058.domain-m-coolmath-games-com .game-item li .game-item-inner a .gameDescription #gameTitle, .page-taxonomy-term-1058.domain-m-coolmathgames-com .game-item li .game-item-inner a .gameDescription #gameTitle {
  color: #e3cf09;
}

.game-item {
  margin-left: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .game-item {
    margin-left: 2px;
  }
}
.game-item li {
  overflow: hidden;
  height: 80px;
  padding-bottom: 1px;
  padding-right: 0px;
}
.game-item li .game-item-inner:active {
  background-color: #204866;
  z-index: 9999;
  border-radius: 6px;
  height: 100%;
}
@media screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .game-item li .game-item-inner:active {
    height: 74.5px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .game-item li .game-item-inner:active {
    height: 92px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .game-item li .game-item-inner:active {
    width: 97%;
  }
}
.game-item li .game-item-inner a {
  text-decoration: none;
  color: #FFF;
}
.game-item li .game-item-inner a:active, .game-item li .game-item-inner a:hover {
  color: #FFF;
}
@media screen and (min-device-width: 375px) and (max-device-width: 736px) and (orientation: landscape) {
  .game-item li .game-item-inner a h1#gameTitle {
    font-size: 18px;
  }
}
.game-item li .game-item-inner a .field-mobile-thumbnail {
  text-decoration: none;
}
.game-item li .game-item-inner a .field-mobile-thumbnail img {
  width: 72px;
  height: 71px;
  clip-path: none;
  margin-left: 0px;
  margin-top: 0px;
  border: 0px;
  border-radius: 6px;
  float: left;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .game-item li .game-item-inner a .field-mobile-thumbnail img {
    width: 92px;
    height: 92px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .game-item li .game-item-inner a .field-mobile-thumbnail img {
    width: 92px;
    height: 92px;
  }
}
.game-item li .game-item-inner a span.iconOverlay {
  background: url("../images/IconBezelBlue.png") no-repeat;
  background-position: -2px -2px;
  background-size: cover;
  display: block;
  position: absolute;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .game-item li .game-item-inner a span.iconOverlay {
    background-position: -2px;
    background-size: 97px 97px;
    display: 0;
  }
}
.game-item li .game-item-inner a .iconOverlay {
  width: 77px;
  height: 77px;
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .game-item li .game-item-inner a .iconOverlay {
    width: 97px;
    height: 97px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .game-item li .game-item-inner a .iconOverlay {
    width: 92px;
    height: 92px;
  }
}
.game-item li .game-item-inner a .gameDescription {
  display: -webkit-box;
  overflow: hidden;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  padding-bottom: 3px;
  color: #FFF;
}
.game-item li .game-item-inner a .gameDescription #gameTitle {
  border: none;
  padding: 0px;
  font-family: "ProximaNovaBold";
  margin: 0 20px 0 8px;
  color: #46b8fd;
  text-decoration: none;
}
@media screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: landscape) {
  .game-item li .game-item-inner a .gameDescription #gameTitle {
    font-size: 18px;
  }
}
@media screen and (min-device-width: 120px) and (max-device-width: 360px) and (orientation: portrait) {
  .game-item li .game-item-inner a .gameDescription #gameTitle {
    font-size: 18px;
  }
}
@media screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .game-item li .game-item-inner a .gameDescription #gameTitle {
    font-size: 18px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .game-item li .game-item-inner a .gameDescription #gameTitle {
    font-size: 20px;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  .game-item li .game-item-inner a .gameDescription #gameTitle {
    font-size: 18px;
  }
}
@media screen and (min-width: 415px) and (max-width: 1372px) and (orientation: landscape) {
  .game-item li .game-item-inner a .gameDescription #gameTitle {
    font-size: 20px;
  }
}
.game-item li .game-item-inner a .gameDescription #gameDescription {
  font-size: 17.5px;
  line-height: 1.313em;
  margin-right: 20px;
  margin-left: 8px;
  height: 2.626em;
}
.game-item li .game-item-inner a .gameDescription #gameDescription .field-mobile-short-description {
  text-decoration: none;
}

element:hover, element:active {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

#bg-fade {
  left: 0px;
  top: 0px;
  height: 100%;
  width: 100%;
  background: #000000;
  content: "";
  position: absolute;
  opacity: 0.5;
}
@media screen and (min-width: 375px) and (max-width: 415px) and (orientation: portrait) {
  #bg-fade {
    top: 85px;
    height: 80%;
  }
}
@media screen and (min-width: 415px) and (max-width: 603px) and (orientation: portrait) {
  #bg-fade {
    height: 80%;
    top: 120px;
  }
}
@media only screen and (max-device-width: 767px) and (min-device-width: 667px) {
  #bg-fade {
    top: 120px;
    height: 75%;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  #bg-fade {
    top: 120px;
    height: 75%;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  #bg-fade {
    top: 120px;
    height: 75%;
  }
}

.freeGamesContainer {
  margin-top: 10px;
  padding-right: 0px;
  border-radius: 10px;
  text-align: center;
  font-family: "ProximaNovaBold";
  background: url("/themes/custom/cmatgame_mob/images/box_bg_2.png") no-repeat top;
  background-size: 350px 225px;
  width: 350px;
  height: 225px;
  position: relative;
  left: -178px;
  top: 5px;
  left: 0px;
  margin: 0 auto;
  float: none;
  clear: both;
}
@media screen and (min-width: 415px) {
  .freeGamesContainer {
    position: relative;
  }
}
@media screen and (min-width: 415px) and (max-width: 768px) {
  .freeGamesContainer {
    background: url("/themes/custom/cmatgame_mob/images/box_ipad_bg.png") no-repeat top;
    width: 382px;
    height: 308px;
    right: 0px;
    display: inline-block;
    top: 0px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .freeGamesContainer {
    width: 382px;
    height: 308px;
    display: block;
    top: -307px;
    position: relative;
    float: right;
    left: 9px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .freeGamesContainer {
    background: url("/themes/custom/cmatgame_mob/images/box_ipad_bg.png") no-repeat top;
    width: 382px;
    height: 308px;
    top: 30px;
    display: inline-block;
    clear: both;
  }
}
.freeGamesContainer p {
  padding: 0px;
  margin: 0px;
}
.freeGamesContainer .no-free-games-headline {
  font-size: 15.84px;
  margin-top: 0px;
  padding: 17px 0px 0px 0px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #FFF;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .freeGamesContainer .no-free-games-headline {
    font-size: 20px;
    font-family: "ProximaNovaBold";
    margin-top: 0px;
    padding-top: 0px;
    letter-spacing: 0.03em;
    color: #FFF;
  }
}
.freeGamesContainer .no-free-games-headline .remaining {
  font-family: "ProximaNovaBold";
  color: #fe9104;
  font-size: 24.55px;
  margin-left: 2px;
  margin-right: 2px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .freeGamesContainer .no-free-games-headline .remaining {
    font-size: 31px;
    font-family: "ProximaNovaBold";
  }
  .freeGamesContainer .no-free-games-headline .remaining:after {
    white-space: pre;
  }
}
.freeGamesContainer .free-in-schools {
  font-family: "ProximaNova";
  font-size: 14.64px;
  font-weight: normal;
  line-height: 1.35em;
  color: #c1d8dc;
  padding-top: 10px;
  padding-left: 7px;
  padding-right: 7px;
  padding-bottom: 2px;
  letter-spacing: 0.03em;
  margin: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .freeGamesContainer .free-in-schools {
    font-size: 17px;
    padding-top: 16px;
    font-family: "ProximaNova";
  }
}
.freeGamesContainer a.subscribe-now-alien {
  text-align: center;
  margin: 0 auto;
  display: block;
  position: relative;
  background: url("/themes/custom/cmatgame_mob/images/free_trial_mobile.png") no-repeat top center;
  margin-top: 13px;
  margin-bottom: 16px;
  height: 50px;
  text-indent: -9999px;
}
.freeGamesContainer a.subscribe-now-alien:hover {
  background: url("/themes/custom/cmatgame_mob/images/free_trial_mobile-hover.png") no-repeat top center;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .freeGamesContainer a.subscribe-now-alien {
    background: url("/themes/custom/cmatgame_mob/images/free_trial_ipad.png") no-repeat top center;
    height: 75px;
    margin-top: 16px;
    margin-bottom: 16px;
    left: -19px;
  }
}
.freeGamesContainer .already-subscribed {
  margin: 0px;
  padding: 0px;
  font-family: "ProximaNova";
  color: #c1d8dc;
  font-size: 14.64px;
  position: relative;
}
@media screen and (max-width: 415px) {
  .freeGamesContainer .already-subscribed {
    font-size: 17px;
    top: -5px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .freeGamesContainer .already-subscribed {
    font-size: 17px;
  }
}
.freeGamesContainer .learn-more-link {
  font-size: 14.64px;
  font-family: "ProximaNova";
  color: #fff06d;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .freeGamesContainer .learn-more-link {
    font-size: 17px;
  }
}

.noMoreGamesOverlay {
  z-index: 999;
  text-align: center;
  position: fixed;
  opacity: 0.9;
  top: 0px;
  left: 0px;
  width: 100%;
  background: transparent;
}
@media screen and (max-width: 375px) {
  .noMoreGamesOverlay {
    position: fixed;
    opacity: 0.9;
    top: 80px;
    left: -7px;
    width: 100%;
  }
}
@media screen and (min-width: 375px) and (max-width: 415px) {
  .noMoreGamesOverlay {
    left: 13px;
    top: 20px;
  }
}
@media screen and (min-width: 415px) and (max-width: 768px) {
  .noMoreGamesOverlay {
    background: url("/themes/custom/cmatgame_mob/images/bg_overlay.png") no-repeat 0px 0px;
    top: 170px;
    position: relative;
    left: 20px;
    width: auto;
    top: 0px;
    /* position: absolute; */
    /* left: 17px; */
    width: 350px;
    margin: 0 auto;
    display: block;
    opacity: 999999;
  }
}
.noMoreGamesOverlay .free-games-left-mobile-bottom {
  background: url("/themes/custom/cmatgame_mob/images/box_ipad_bg.png") no-repeat top;
  width: 385px;
  display: block;
  left: 30px;
  height: 309px;
  position: relative;
  top: 0px;
  padding: 20px;
  font-size: 20px;
  padding-top: 15px;
}
.noMoreGamesOverlay p {
  padding: 0px;
  margin: 0px;
}
.noMoreGamesOverlay .no-free-games-headline {
  font-size: 15.84px;
  margin-top: 0px;
  padding: 15px 0px 5px 0px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #FFF;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .no-free-games-headline {
    font-size: 20px;
    font-family: "ProximaNovaBold";
    margin-top: 0px;
    padding-top: 0px;
    color: #FFF;
    letter-spacing: 0.03em;
  }
}
.noMoreGamesOverlay .no-free-games-headline .remaining {
  font-family: "ProximaNovaBold";
  color: #fe9104;
  font-size: 24.55px;
  margin-left: 2px;
  margin-right: 1px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .no-free-games-headline .remaining {
    font-size: 31px;
    font-family: "ProximaNovaBold";
  }
  .noMoreGamesOverlay .no-free-games-headline .remaining:after {
    content: "\a";
    white-space: pre;
  }
}
.noMoreGamesOverlay .no-free-games-headline .free-in-schools {
  font-family: "ProximaNova";
  font-size: 14.64px;
  font-weight: normal;
  line-height: 1.35em;
  color: #d9faff;
  padding-top: 10px;
  padding-left: 7px;
  padding-right: 7px;
  padding-bottom: 2px;
  margin: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .no-free-games-headline .free-in-schools {
    font-size: 17px;
    padding-top: 16px;
    font-family: "ProximaNova";
  }
}
.noMoreGamesOverlay .no-free-games-headline a.subscribe-now-alien {
  text-align: center;
  margin: 0 auto;
  display: block;
  position: relative;
  background: url("/themes/custom/cmatgame_mob/images/free_trial_mobile.png") no-repeat top center;
  margin-top: 7px;
  margin-bottom: 16px;
  height: 50px;
  text-indent: -9999px;
}
.noMoreGamesOverlay .no-free-games-headline a.subscribe-now-alien:hover {
  background: url("/themes/custom/cmatgame_mob/images/free_trial_mobile-hover.png") no-repeat top center;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .no-free-games-headline a.subscribe-now-alien {
    background: url("/themes/custom/cmatgame_mob/images/free_trial_ipad.png") no-repeat top center;
    height: 75px;
    margin-top: 16px;
    margin-bottom: 16px;
    left: -19px;
  }
}
.noMoreGamesOverlay .no-free-games-headline a.subscribe-now-alien-signup {
  text-align: center;
  margin: 0 auto;
  display: block;
  position: relative;
  margin-top: 7px;
  margin-bottom: 16px;
  height: 50px;
  text-indent: -9999px;
  background: url("/themes/custom/cmatgame_mob/images/free-game-buttons/sign-up.png") no-repeat top center;
}
.noMoreGamesOverlay .no-free-games-headline a.subscribe-now-alien-signup:hover {
  background: url("/themes/custom/cmatgame_mob/images/free-game-buttons/sign-up-hover.png") no-repeat top center;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .no-free-games-headline a.subscribe-now-alien-signup {
    background: url("/themes/custom/cmatgame_mob/images/free-game-buttons/sign-up.png") no-repeat top center;
    height: 75px;
    margin-top: 16px;
    margin-bottom: 16px;
    left: -19px;
  }
}
.noMoreGamesOverlay .no-free-games-headline .already-subscribed {
  margin: 0px;
  padding: 0px;
  font-family: "ProximaNova";
  color: #c1d8dc;
}
.noMoreGamesOverlay .no-free-games-headline .learn-more-link {
  font-size: 14.64px;
  font-family: "ProximaNova";
  color: #fff06d;
}
.noMoreGamesOverlay .free-games-left-mobile-bottom {
  background: url("/themes/custom/cmatgame_mob/images/bg_overlay.png") no-repeat 0px 0px;
  background-size: 350px 250px;
}
@media screen and (max-width: 415px) {
  .noMoreGamesOverlay .free-games-left-mobile-bottom {
    top: 170px;
    position: fixed;
    left: 10px;
  }
}
@media screen and (max-width: 768px) {
  .noMoreGamesOverlay .free-games-left-mobile-bottom {
    width: 345px;
    padding-left: 0px;
    padding-top: 0px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .free-games-left-mobile-bottom {
    width: 442px;
    background: url("/themes/custom/cmatgame_mob/images/bg_overlay_ipad.png") no-repeat 0px 0px;
    top: 30%;
    position: fixed;
    left: 31%;
    height: 364px;
    margin-top: 10px;
    padding-right: 0px;
    padding-left: 0px;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .noMoreGamesOverlay .free-games-left-mobile-bottom {
    width: 442px;
    background: url("/themes/custom/cmatgame_mob/images/bg_overlay_ipad.png") no-repeat 0px 0px;
    top: 30%;
    position: fixed;
    left: 20%;
    height: 364px;
    margin-top: 10px;
    padding-right: 0px;
    padding-left: 0px;
  }
}
.noMoreGamesOverlay p {
  padding: 0px;
  margin: 0px;
}
.noMoreGamesOverlay .no-free-games-headline {
  color: #FFF;
  font-size: 15.84px;
  margin-top: 0px;
  padding: 17px 0px 0px 0px;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
}
.noMoreGamesOverlay .no-free-games-headline .remaining {
  font-family: "ProximaNovaBold";
  color: #fe9104;
  font-size: 24.55px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .no-free-games-headline .remaining {
    font-size: 24px;
    font-family: "ProximaNovaBold";
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .no-free-games-headline {
    font-size: 20px;
    padding: 40px 0px 0px 0px;
  }
}
.noMoreGamesOverlay .free-in-schools {
  font-family: "ProximaNova";
  font-size: 14.64px;
  font-weight: normal;
  line-height: 1.35em;
  color: #d9faff;
  padding-top: 10px;
  padding-left: 7px;
  padding-right: 7px;
  padding-bottom: 2px;
  margin: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .free-in-schools {
    font-size: 17px;
  }
}
.noMoreGamesOverlay a.subscribe-now-alien {
  text-align: center;
  margin: 0 auto;
  display: block;
  position: relative;
  background: url("/themes/custom/cmatgame_mob/images/free_trial_mobile.png") no-repeat top center;
  margin-top: 12px;
  margin-bottom: 16px;
  height: 50px;
  text-indent: -9999px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay a.subscribe-now-alien {
    background: url("/themes/custom/cmatgame_mob/images/free_trial_ipad.png") no-repeat top center;
    height: 75px;
    margin-top: 20px;
    margin-bottom: 0px;
  }
}
.noMoreGamesOverlay a.subscribe-now-alien:hover {
  background: url("/themes/custom/cmatgame_mob/images/free_trial_mobile-hover.png") no-repeat top center;
}
.noMoreGamesOverlay .already-subscribed {
  color: #c1d8dc;
  margin: 0px;
  padding: 0px;
  font-family: "ProximaNova";
  padding-bottom: 10px;
  font-size: 14.64px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .already-subscribed {
    font-size: 17px;
    bottom: -16px;
    position: relative;
  }
}
.noMoreGamesOverlay .learn-more-link {
  font-size: 14.64px;
  font-family: "ProximaNova";
  color: #fff06d;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .noMoreGamesOverlay .learn-more-link {
    font-size: 17px;
  }
}

.page-1-mobile-categories {
  min-height: 100%;
}
.page-1-mobile-categories .mobile-categories-wrapper {
  position: relative;
}
.page-1-mobile-categories .footer {
  position: fixed;
}
.page-1-mobile-categories .pane-page-content {
  min-height: 100%;
}
.page-1-mobile-categories .pane-page-content:first-child {
  background: #3c9e39;
  height: 26px;
  border-radius: 6px;
  margin: 10px;
  color: #e2ffe6;
  vertical-align: middle;
}
.page-1-mobile-categories .pane-page-content:first-child h2 {
  clear: both;
  border-radius: 6px;
  text-transform: uppercase;
  height: 26px;
  padding: 0px 0 1px 29px;
  font-family: "ProximaNovaBold";
  font-size: 20px;
  margin: 14px auto;
  line-height: 26px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .page-1-mobile-categories .pane-page-content:first-child h2 {
    letter-spacing: -1px;
  }
}

body.logged-in.section-trivia .main-aside {
  padding-top: 0 !important;
}

.full-quiz-container {
  min-height: 100%;
  top: 10px;
  position: relative;
  background: #FFF;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .full-quiz-container {
    width: 659px;
    float: left;
    top: 11px;
    min-height: 519px;
    border-radius: 10px;
    margin: 0 auto 20px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .full-quiz-container {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    margin: 0 auto 20px;
    min-height: 550px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .full-quiz-container {
    padding-bottom: 100px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .node-type-quizitem .right-rail-box-container {
    left: 15px;
  }
}

.right-rail-box-container {
  top: 10px;
  position: relative;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .right-rail-box-container {
    margin-top: 0;
    top: -8px;
    width: 365px;
    background-color: transparent;
    min-height: 545px;
    float: left;
    left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .right-rail-box-container {
    top: 20px;
    min-height: 0;
    width: 100%;
  }
}

.box-container {
  clear: both;
  position: relative;
  top: -4px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .box-container {
    width: 350px;
    top: 0;
  }
}

.box-container-2 {
  margin-top: 14px;
  position: relative;
  top: 6px;
  float: left;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .box-container-2 {
    margin-top: 0;
    top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .box-container-2 {
    float: none;
    top: 0;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .node-type-quizitem .box-container-2 {
    margin-top: 0;
    top: 0;
    display: none;
  }
}

.box-placeholder {
  height: 250px;
  width: 300px;
  margin: 0 auto;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .box-placeholder {
    height: 0;
    width: 100%;
  }
}

.box-txt-wrapper p {
  color: #ccc;
  position: relative;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  left: 33px;
  padding-bottom: 5px;
}

/*
  Quiz Headings
*/
.section-trivia h1#page-title {
  margin: 0;
  font-family: "Amasis MT";
  font-size: 20px;
  font-weight: 700;
  line-height: 22px;
  display: block;
  width: 75%;
}
.section-trivia h1#page-title a {
  color: #000000;
}
.section-trivia h1#page-title a:hover {
  color: #9B9B9B;
}

.submitted {
  display: inline-block;
  float: right;
  position: relative;
  width: 100%;
}
.submitted .submitted-txt {
  position: absolute;
  right: 0;
  bottom: 0;
  color: #9B9B9B;
  font-size: 0.75rem;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.submitted .submitted-txt a {
  color: #9B9B9B;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.profile-block,
.save-score {
  border-radius: 8px;
  width: 300px;
  background-color: #FDE063;
  padding: 28px 27px 28px 30px;
  margin: 0 auto;
}
.profile-block h2,
.save-score h2 {
  font-family: "Amasis MT", Georgia, Georgia, "Times New Roman", serif;
  font-size: 20px;
  line-height: 22px;
  font-weight: 600;
  border: 0;
  margin-bottom: 6px;
}
.profile-block a,
.save-score a {
  color: #000;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.profile-block a:hover,
.save-score a:hover {
  color: #6B6B6B;
  text-decoration: underline;
}
.profile-block p,
.save-score p {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 15px;
  line-height: 22px;
}
.profile-block span,
.save-score span {
  display: block;
  color: #6B6B6B;
  padding-top: 16px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 15px;
  line-height: 18px;
}

.save-score {
  background-color: #000000;
  border-radius: 50%;
  text-align: center;
  color: #FFFFFF;
  padding: 38px 27px 28px 30px;
}
.save-score h2 {
  color: #FDE063;
  margin-bottom: 9px;
}
.save-score a.signup {
  display: block;
  background-color: #FDE063;
  color: #000000;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif, "Helvetica Neue", Helvetica, Arial, sans-serif;
  width: 201px;
  height: 50px;
  padding: 15px 20px 17px;
  border-radius: 8px;
  margin: 0 auto;
}
.save-score a.signup:hover {
  background: #fff22e;
  text-decoration: none;
}
.save-score p {
  margin-bottom: 12px;
  padding: 0 5px;
}
.save-score .existing-account {
  color: #9B9B9B;
}
.save-score .existing-account a {
  display: block;
  color: #FFFFFF;
}
.save-score .existing-account a:hover {
  text-decoration: underline;
  color: #9B9B9B;
}

.profile-block {
  background-color: #F3EDE9;
  text-align: center;
}
.profile-block .user-profile-image {
  max-width: 70px;
  margin: 0 auto;
}
.profile-block .user-profile-image img {
  width: 70px;
  height: 70px;
  border-radius: 35px;
  -webkit-border-radius: 35px;
  -moz-border-radius: 35px;
}
.profile-block .user-display-name h2 {
  font-family: "Amasis MT";
  font-size: 20px;
  line-height: 22px;
  margin: 10px 0;
}
.profile-block .user-quiz-count {
  border-bottom: 1px solid #b3b3b3;
  padding-bottom: 17px;
  margin-top: 15px;
}
.profile-block .count {
  font-size: 80px;
  color: #000000;
  font-family: "New Baskerville", "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 80px;
  font-weight: 600;
  padding-top: 0;
}
.profile-block .taken-text {
  color: #000000;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 18px;
  padding-top: 0;
}
.profile-block .profile-block-links {
  padding-top: 15px;
}
.profile-block .profile-block-links a {
  font-size: 15px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.profile-block .profile-block-links a:hover {
  color: #9B9B9B;
}
.profile-block .profile-block-links .divider {
  padding: 0 10px;
  color: #9B9B9B;
}
.profile-block .profile-block-links span {
  display: inline;
}

.show-more-related {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 1.125rem;
  color: #9B9B9B;
  cursor: pointer;
}

.section-trivia h1.pane-title {
  display: none;
}

.section-trivia .global-wrapper .content-column-wrapper .main-column .inside .pane-page-content {
  background: #ffffff none repeat scroll 0 0;
  border-radius: 8px;
  position: relative;
}

.section-trivia .panel-pane.pane-block.pane-cmatgame-advertisement-cm-g-otherpages-728x90-footer {
  margin-left: 0;
  margin-top: 10px;
}

.section-trivia .main-aside {
  padding-top: 0 !important;
}

.section-trivia .global-wrapper .global-content-wrapper .main-header .header-banner-block {
  width: 250px;
  text-align: left;
}
.section-trivia .global-wrapper .global-content-wrapper .main-header .header-banner-block .pane-cmatgame-advertisement-cm-g-homepage-728-90 {
  padding-top: 5px;
}
.section-trivia .global-wrapper .global-content-wrapper .main-header .header-banner-block .pane-advertising-wrapper-header {
  padding: 0;
  margin: 8px 0 0 33px;
}

.node-type-quizitem .global-wrapper-content {
  padding-left: 0;
  padding-right: 0;
}
.node-type-quizitem .global-content-wrapper {
  width: auto;
}
.node-type-quizitem .main-column {
  float: left;
  left: 30px;
}
.node-type-quizitem .global-wrapper #game-page-left-ad {
  margin-left: -184px;
  position: absolute;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .scoreboard-area .image-container {
    display: none;
    width: 0;
  }
}
#game-stats {
  top: -10px;
  position: relative;
}

#game-stats .scoreboard-area .scoreboard-headline {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #FFF;
  font-weight: bold;
  text-transform: uppercase;
  display: inline-block;
  font-size: 15px;
}

@media only screen and (min-width: 0em) and (max-width: 20em) {
  #game-stats .scoreboard-area .scoreboard-headline {
    margin-bottom: 0 !important;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #game-stats .question-headline {
    margin-right: 0;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #game-stats .correct-col {
    margin-left: 30px;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #game-stats .time-text {
    margin-top: 5px;
  }
}
@media only screen and (min-width: 0em) and (max-width: 20em) {
  #game-stats .time-text {
    margin-top: 11px;
    margin-bottom: 0 !important;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #game-stats .time-col {
    position: relative;
    top: -5px;
  }
}
@media only screen and (min-width: 48.063em) and (max-width: 64em) {
  #game-stats .time-col {
    width: 25%;
  }
}
@media only screen and (min-width: 0em) and (max-width: 20em) {
  #game-stats .time-col {
    margin-left: 12px;
    margin-top: 5px;
  }
}
#game-stats .time-col .pts {
  font-family: "Helvetica";
  font-size: 0.75rem;
  color: #ffe44b;
}

#game-stats #timer-placeholder-1 {
  background: url("/themes/custom/cmatgame/images/circle45.png") no-repeat top;
  height: 50px;
  width: auto;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #game-stats #timer-placeholder {
    background: url("/themes/custom/cmatgame/images/circle45.png") no-repeat top;
  }
}
@media only screen and (min-width: 0em) and (max-width: 20em) {
  #game-stats .streak-col {
    margin-left: 20px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .scoreboard-col.streak-col {
    position: relative;
    left: 22px;
  }
}

#game-stats .bonusTimeContainer {
  color: #fce558;
  font-family: "Helvetica";
  font-weight: bold;
  top: -5px;
  display: block;
  position: relative;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #game-stats .bonusTimeContainer {
    color: #fce558;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 900;
    margin-top: 2px;
    display: block;
    font-size: 1.125rem;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #game-stats .bonusTimeContainer {
    position: absolute;
    top: 70px;
    left: 35px;
  }
}

@media only screen and (min-width: 0em) and (max-width: 20em) {
  #game-stats .bonusTimeContainer {
    margin-left: 16px;
    margin-top: 0;
    font-size: 15px;
  }
}
#game-stats .streak-box {
  font-size: 31.17px;
  background: url("/themes/custom/cmatgame/images/quiz/cell.png") no-repeat top;
  position: relative;
  float: left;
  padding: 7px 10px;
}
@media only screen and (min-width: 0em) and (max-width: 665px) {
  #game-stats .streak-box {
    padding: 7px;
  }
}

#game-stats .streaks {
  text-align: center;
  clear: both;
  top: 5px;
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  #game-stats .streaks {
    text-align: center;
    clear: both;
    left: 25px;
    position: relative;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #game-stats .streaks {
    left: -10px;
    position: relative;
  }
}
#game-stats .time-headline {
  margin-top: 5px;
}

#game-stats .times-up {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: bold;
  text-transform: uppercase;
  display: inline-block;
}

#game-stats .longest .under-box-text {
  color: #08505b;
  font-size: 11.56px;
  font-weight: bold;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-align: center;
  top: 0;
  float: left;
  display: block;
  margin-top: 5px;
}

#game-stats .total-correct {
  font-size: 31.17px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #00fcff;
  font-weight: bold;
  line-height: 28px;
}

.scoreboard-inner .streak-number {
  font-size: 31.17px;
  top: 4px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1px;
  display: block;
  position: relative;
  line-height: 28px;
}

#game-stats .streak-number-results {
  background: url("/themes/custom/cmatgame/images/quiz/cell-results.png") no-repeat top;
  font-size: 31.17px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #35fe5f;
  font-weight: bold;
}

#game-stats .question-image {
  height: 75px;
  border-radius: 10px;
  float: left;
  margin-top: 11px;
  display: inline-block;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #game-stats .question-image {
    display: none;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .question-img-container {
    width: auto;
    margin: 0 auto;
  }
}

.question-img-wrapper {
  width: 85%;
  margin: 0 auto -8px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .question-img-wrapper {
    padding-bottom: 0;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    display: block;
    text-align: center;
    top: 20px;
    position: relative;
    margin-bottom: 20px;
    bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .question-img-wrapper {
    margin: 20px auto 9px;
    width: 85%;
    overflow: hidden;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .question-img-wrapper {
    width: 293px;
    margin-top: -2px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .image-question {
    max-width: 100%;
    display: inline-block;
    vertical-align: middle;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .image-question {
    width: 547px;
    height: 285px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .image-question {
    width: 293px;
    height: 150px;
  }
}

.question-col {
  text-align: center;
  float: left;
  margin-right: 50px;
  margin-left: 56px;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .question-col {
    margin-left: 22px;
    margin-right: 66px;
  }
}
@media only screen and (min-width: 0em) and (max-width: 20em) {
  .question-col {
    margin-left: 22px;
    margin-right: 35px;
  }
}
.timer-container {
  top: 7px;
  position: relative;
}

@media only screen and (min-width: 0em) and (max-width: 20em) {
  .timer-container {
    margin-left: 16px;
  }
}
/*  quiz landing screen */
.start-quiz-wrapper {
  width: 100%;
  text-align: center;
  margin: 40px 0 25px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .start-quiz-wrapper {
    margin: 10px 0 25px;
  }
}

.start-quiz-img-wrapper {
  margin: auto;
}

.start-quiz-see-trivia {
  margin-top: 40px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .start-quiz-see-trivia {
    margin-top: 5px;
  }
}
.start-quiz-see-trivia a {
  color: #0b7ac2;
}
.start-quiz-see-trivia a:hover {
  text-decoration: none;
}
.start-quiz-see-trivia span.see-all-trivia {
  text-decoration: underline;
}

#start-the-quiz-title {
  color: #000000;
  font-family: "Helvetica";
  font-weight: bold;
  font-size: 20px;
  margin-bottom: 30px;
  position: relative;
  top: 4px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #start-the-quiz-title {
    margin-left: 10px;
    margin-right: 10px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #start-the-quiz-title {
    font-size: 28px;
  }
}

.question-container-2 {
  margin-left: 0;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .question-container-2 {
    margin-top: 20px;
  }
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #start-the-quiz-title {
    font-size: 26px;
    line-height: 28px;
  }
}
#bottom-text-img {
  background: url("/themes/custom/cmatgame/images/start-quiz/get-answers-text.png") no-repeat top;
  height: 54px;
  white-space: nowrap;
  margin-top: 20px;
  text-indent: 99999px;
  content: "";
  text-align: center;
}

#start-the-quiz {
  background: url("/themes/custom/cmatgame/images/start-quiz/start-the-quiz-desktop.png") no-repeat top;
  height: 56px;
  text-indent: 99999px;
  content: "";
}

#start-the-quiz:hover {
  background: url("/themes/custom/cmatgame/images/start-quiz/start-the-quiz-desktop-hover.png") no-repeat top;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #start-the-quiz:hover {
    background: url("/themes/custom/cmatgame/images/start-quiz/start-the-quiz-mobile-active.jpg") no-repeat top;
    height: 56px;
    background-size: contain;
  }
}
#start-the-quiz:active {
  background: url("/themes/custom/cmatgame/images/start-quiz/start-the-quiz-desktop-hover.png") no-repeat top;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #start-the-quiz {
    background: url("/themes/custom/cmatgame/images/start-quiz/start-the-quiz-mobile.jpg") no-repeat top;
    height: 56px;
    background-size: contain;
  }
}
.retake-quiz-wrapper {
  width: 100%;
  text-align: center;
  margin: 25px 0;
}

.retake-quiz-img-wrapper {
  margin: auto;
  width: 273px;
}

.retake-quiz-review-wrapper {
  margin: auto;
  width: 220px;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .retake-quiz-review-wrapper {
    width: 338px;
  }
}
#retake-the-quiz {
  background: url("/themes/custom/cmatgame/images/start-quiz/retake-desktop1.png") no-repeat top;
  height: 56px;
  width: 273px;
  cursor: pointer;
}

#retake-the-quiz:hover {
  background: url("/themes/custom/cmatgame/images/start-quiz/retake-desktop2-hover.png") no-repeat top;
}

#retake-the-quiz:active {
  background: url("/themes/custom/cmatgame/images/start-quiz/retake-desktop3-click.png") no-repeat top;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #retake-the-quiz {
    background: url("/themes/custom/cmatgame/images/start-quiz/retake-mobile1.png") no-repeat top;
    background-size: contain;
    cursor: pointer;
  }

  #retake-the-quiz:hover {
    background: url("/themes/custom/cmatgame/images/start-quiz/retake-mobile2.png") no-repeat top;
    background-size: contain;
  }
}
#back-to-results,
#retake-the-quiz-review-answers,
.back-to-quiz-score {
  color: #57b5c1;
  cursor: pointer;
  font-family: "Helvetica";
  font-weight: bold;
  font-size: 19px;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #back-to-results,
#retake-the-quiz-review-answers,
.back-to-quiz-score {
    font-size: 19px;
  }
}
#back-to-results:hover,
#retake-the-quiz-review-answers:hover {
  color: #00deff;
}

#retake-the-quiz-title {
  color: #000000;
  font-family: "Helvetica";
  font-weight: bold;
  font-size: 20px;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #retake-the-quiz-title {
    font-size: 26px;
  }
}
.back-to-quiz-score {
  color: #000000;
  font-family: "Helvetica";
  font-size: 19px;
  font-weight: bold;
  margin: 20px 10px 10px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .back-to-quiz-score {
    margin: 30px 35px 10px;
    position: relative;
    left: 20px;
  }
}

/* answer boxes */
.question-text {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 22px;
  color: #000000;
  padding: 10px 0 0;
  margin-bottom: 0;
  letter-spacing: 0.2px;
  line-height: 32px;
  position: relative;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .question-text {
    padding: 0;
    margin-bottom: 0;
    font-size: 20px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .question-text {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 22px;
    color: #000000;
    padding: 10px 0 0;
    margin-bottom: 0;
    letter-spacing: 0.2px;
    line-height: 32px;
    position: relative;
  }
  .question-text:before {
    content: "";
    display: table-row;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .next-text-desktop {
    display: none !important;
  }
}
.hide-unselected {
  background: #e7e7e7 !important;
  border: none !important;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .hide-unselected {
    display: none !important;
  }
}
.answer-box {
  cursor: pointer;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 31%;
  padding-right: 10px;
  margin: 0 7px;
  display: table-cell;
  background: #FEF2AF;
  border: 1px solid #eddd82;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .answer-box {
    display: block;
    width: 100%;
    margin: 9px 0;
  }
}
@media only screen and (min-width: 0em) and (max-width: 20em) {
  .answer-box {
    display: block;
    width: 100%;
  }
}
.answer-box p {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: normal;
  color: #434343;
  display: inline-block;
  margin-bottom: 0;
  width: 90%;
  line-height: 19px;
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  vertical-align: top;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .answer-box p {
    padding: 12px 25px 12px 20px;
  }
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .answer-box p {
    padding: 6px 20px;
  }
}
.wrong-box {
  background: #FD625E;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .wrong-box {
    width: 100%;
    display: block;
    width: 100%;
    padding: 6px 20px;
    margin: 16px 0;
  }
}
.wrong-box::after {
  content: "";
  position: relative;
  right: 10px;
  top: 15px;
  background-image: url("/themes/custom/cmatgame/images/icon_x.svg");
  background-size: 15px 13px;
  width: 15px;
  height: 13px;
}

.right-box {
  background: #65E08E;
}

.right-box:after {
  content: "";
  position: relative;
  right: 10px;
  top: 15px;
  background-image: url("/themes/custom/cmatgame/images/icon_checkmark.svg");
  background-size: 15px 13px;
  width: 15px;
  height: 13px;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .right-box {
    display: block;
    width: 100%;
  }
}
#answers div {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  width: 100%;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  #answers div {
    position: relative;
    top: 10px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #answers {
    width: 100%;
    margin-bottom: 20px;
    margin-left: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #answers {
    display: block;
    width: 100%;
    right: 5px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  #answers {
    display: table-cell;
  }
}

@media only screen and (min-width: 0em) and (max-width: 20em) {
  #answers {
    display: block;
  }
}
#answers #answer_2 {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: normal;
  color: #000000;
  margin-bottom: 0;
  line-height: 19px;
  border-radius: 8px;
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  #answers #answer_2 {
    display: table-cell;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  #answers #answer_2 {
    display: block;
  }
}
#answers #answer_1 {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: normal;
  color: #000000;
  margin-bottom: 0;
  line-height: 19px;
  border-radius: 8px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #answers #answer_1 {
    display: block;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  #answers #answer_1 {
    display: table-cell;
  }
}

#answers #answer_0 {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: normal;
  color: #000000;
  margin-bottom: 0;
  line-height: 19px;
  border-radius: 8px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #answers #answer_0 {
    display: block;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  #answers #answer_0 {
    display: table-cell;
  }
}

.bottom-container {
  width: 100%;
  clear: both;
  height: 15px;
}

/* end answer-boxes */
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .submit-text-desktop {
    display: none;
  }
}
.next-question {
  font-family: "Amasis MT";
  font-size: 28px;
  font-weight: 700;
  background-color: transparent;
  color: #000000 !important;
  padding: 0;
  border: none;
  float: right;
  outline: none;
  clear: both;
  position: relative;
}

.hide {
  visibility: hidden;
}

.show {
  visibility: visible;
}

.next-question a,
.next-question a:active,
.next-question a:hover {
  color: #000000 !important;
  background: none;
}

.fact {
  margin: 0 auto;
  width: 90%;
  display: block;
  position: relative;
  border-radius: 8px;
  min-height: 74px;
  visibility: hidden;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border: 1px solid #d9d9d9;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .fact {
    width: 580px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .fact {
    top: -10px;
  }
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .fact {
    margin-bottom: 0;
    margin-top: 0;
  }
}
@media only screen and (max-width: 370px) {
  .fact {
    min-height: 110px;
  }
}
@media only screen and (min-width: 769px) and (max-width: 1023px) {
  .fact {
    min-height: 100px;
  }
}
.fact .fact-wrapper {
  border-radius: 8px;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-top: 0;
  padding: 10px 20px 0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #454545;
  line-height: 0;
  background: #fff;
  overflow: hidden;
  z-index: 5;
}

.fact .fact-wrapper.hide {
  display: none !important;
}

.fact .fact-wrapper .quiz-answer-fact-value {
  display: inline-block;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .fact .fact-wrapper .quiz-answer-fact-value {
    font-size: 15px;
    line-height: 20px;
  }
}
.fact .fact-wrapper .quiz-answer-fact-value > span {
  display: block;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

@media only screen and (min-width: 40em) {
  .fact .fact-wrapper .quiz-answer-fact-value > span {
    line-height: 24px;
  }
}
.fact .fact-wrapper .quiz-answer-fact-value > span a {
  color: #454545;
  font-weight: 600;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.fact .fact-wrapper .quiz-answer-fact-value > span.more-fact a {
  float: right;
}

.fact .fact-wrapper .quiz-answer-fact-value > span.full-fact:before,
.fact .fact-wrapper .quiz-answer-fact-value > span.short-fact:before {
  content: "FACT: ";
  display: inline-block;
  text-transform: uppercase;
  font-weight: 700;
  margin-right: 4px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 15px;
}

.fact .fact-wrapper .quiz-answer-fact-value > span.full-fact .morecontent span,
.fact .fact-wrapper .quiz-answer-fact-value > span.short-fact .morecontent span {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.fact.open .fact-wrapper {
  border-top: 1px solid #D9D9D9;
}

.fact.open .fact-wrapper .quiz-answer-fact-value span {
  display: inline;
}

.fact.open:after,
.fact.open:before {
  border: 0;
}

.retake-quiz-results-screen {
  height: 81px;
  display: block;
  background: url("/themes/custom/cmatgame/images/quiz-results/replay.png") no-repeat top;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  width: 90px;
}

.retake-quiz-results-screen:hover {
  background: url("/themes/custom/cmatgame/images/quiz-results/replay-hover.png") no-repeat top;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .retake-quiz-results-screen {
    background: url("/themes/custom/cmatgame/images/quiz-results/replay-mobile.png") no-repeat top;
    text-indent: 150%;
    background-size: contain;
    margin-left: 19px;
  }

  .retake-quiz-results-screen:hover {
    background: url("/themes/custom/cmatgame/images/quiz-results/replay-mobile.png") no-repeat top;
    background-size: contain;
  }

  .retake-quiz-results-screen:active {
    background: url("/themes/custom/cmatgame/images/quiz-results/replay-mobile.png") no-repeat top;
    background-size: contain;
  }
}
.scoreboard-box {
  background: #268190;
  font-size: 31.17px;
  background: url("/themes/custom/cmatgame/images/quiz/cell.png") no-repeat top;
  padding: 7px 18px;
  position: relative;
  text-align: center;
  margin-top: -6px;
}

.under-box-text {
  color: #08505b;
  font-size: 12.27px;
  font-weight: bold;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-align: center;
  display: block;
  margin-top: -6px;
  margin-bottom: 0;
  margin-left: -14px;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .under-box-text {
    margin-top: 8px;
  }
}
/* new styles */
.results-share-container {
  height: 0;
}

.fb-share-button-results-top {
  top: 10px;
  right: 20px;
  position: relative;
  z-index: 5;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .fb-share-button-results-top {
    top: 7px;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .fb-share-button-results-top img {
    height: 22px;
  }
}
.title-row-mobile {
  display: none;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .title-row-mobile {
    display: none;
    font-size: 11.8px;
    margin-bottom: 0;
  }
}
.title-row {
  background-color: #46b0c0;
  z-index: 1;
  height: 50px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  position: relative;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .title-row {
    display: none;
  }
}
.scoreboard-area .scoreboard-inner .small-3.image-container {
  width: 33%;
}
@media only screen and (min-width: 0em) and (max-width: 20em) {
  .scoreboard-area .scoreboard-inner .small-3.image-container {
    width: 0 !important;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .scoreboard-area .scoreboard-inner .small-3.image-container {
    width: 25%;
    position: relative;
    left: 27px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .scoreboard-area .scoreboard-inner .small-3.image-container {
    width: 25%;
    position: relative;
    left: 27px;
  }
}

.results-quiz-image {
  border-radius: 8px;
}

.top-percentile-placeholder {
  height: 50px !important;
  text-align: center;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .top-percentile-placeholder {
    height: 25px !important;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .top-percentile {
    position: relative;
    top: 5px;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .out-of-correct {
    margin-top: 3px !important;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .score-results {
    margin-top: 15px;
  }
}
.score-results-title {
  background: url("/themes/custom/cmatgame/images/quiz-results/score-text-2.png") no-repeat top;
  height: 38px;
  display: block;
  text-indent: -9999px;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .score-results-title {
    background: url("/themes/custom/cmatgame/images/quiz-results/score-text-mobile.png") no-repeat top;
    height: 28px;
  }
}
/* new */
#game-stats .scoreboard-col {
  text-align: center;
  float: left;
  margin-top: 8px;
}

.streak {
  left: -16px;
  position: relative;
  width: 131px;
}

#game-stats .scoreboard-under-box-text {
  left: -8px;
  position: relative;
}

#game-stats .questions {
  text-align: center;
  position: relative;
  padding: 11px;
  top: 11px;
}

#game-stats .scoreboard-under-box-text {
  color: #08505b;
  font-size: 11.56px;
  font-weight: bold;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-align: center;
  top: 0;
  float: left;
  display: block;
  margin-top: 5px;
}

.under-text {
  color: #08505b;
  font-size: 11.56px;
  font-weight: bold;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-align: center;
  position: relative;
  display: block;
  top: 10px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .under-text {
    top: 7px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .under-text {
    top: 7px;
  }
}

.current-streak {
  color: #FFF;
  left: 1px;
  position: relative;
}

.longest-streak {
  color: #35fe5f;
}

#game-stats .streak {
  clear: both;
  width: auto;
}

.correct-number {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 36.63px;
  font-weight: bold;
  color: #2cfcfe;
  text-align: center;
  vertical-align: middle;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .correct-number {
    font-size: 26.23px;
  }
}
#game-stats .current-box {
  margin-right: 8px;
}

.current {
  position: relative;
  display: block;
}

#game-stats .longest {
  position: relative;
  left: 9px;
}

.quiz-question-timedout {
  color: #FD625E;
  font-weight: bold;
  position: relative;
  display: inline-block;
  left: 20px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  top: -30px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-question-timedout {
    display: inherit;
    width: 100%;
    left: 146px;
    top: -30px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .quiz-question-timedout {
    left: 281px;
    top: 0px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .quiz-question-timedout {
    left: 120px;
    font-size: 17px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .quiz-question-timedout {
    left: 120px;
    font-size: 17px;
  }
}

.howManyLeft {
  position: relative;
  display: inline-block;
  left: 42px;
  letter-spacing: 0.03em;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .howManyLeft {
    left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .howManyLeft {
    left: 5px;
    top: 6px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .howManyLeft {
    display: inherit;
    width: 100%;
    left: 24px;
    top: 12px;
  }
}

.howManyLeft .number-left {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20.22px;
  color: #787878;
}

.howManyLeft .number-left-text {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 11.55px;
  font-weight: bold;
  color: #787878;
  text-transform: uppercase;
}

.next-button-container {
  display: inline-block;
  position: relative;
  top: -30px;
  right: 28px;
  width: 105%;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .next-button-container {
    top: -35px;
  }
}

.quiz-bottom-container {
  top: 5px;
  position: relative;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .quiz-bottom-container {
    max-width: 580px;
    margin: 0 auto;
    top: 10px;
    margin: 0 auto 20px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .quiz-bottom-container {
    width: 77%;
    margin: 0 auto 20px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-bottom-container {
    top: -11px;
  }
}

#quiz-next-button {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 28px;
  font-weight: 700;
  background-color: transparent;
  background-position: right top;
  background-repeat: no-repeat;
  color: #000000 !important;
  padding: 0;
  border: none;
  float: right;
  outline: none;
  margin: 0;
  clear: both;
  position: relative;
  width: 102%;
  position: relative;
}

#timer-placeholder-1,
#timer1 {
  background: url("/themes/custom/cmatgame/images/circle40.png") no-repeat top;
  height: 50px;
  width: 40px;
  margin: 0 auto;
}

#answers {
  border-spacing: 10px;
  display: table;
  table-layout: fixed;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #answers {
    top: -10px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  #answers {
    width: 600px;
    position: relative;
    left: -128px;
  }
}

#question {
  margin: 0 auto;
}

#quiz {
  max-width: 350px;
  margin: 0 auto;
  top: -4px;
  position: relative;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #quiz {
    max-width: 580px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #quiz {
    max-width: 580px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .quiz-container {
    margin-top: 20px;
  }
}

#quiz-question-scoreboard {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  margin-top: -9px;
  width: auto;
  height: auto;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #quiz-question-scoreboard {
    margin-top: 0;
    width: 580px;
    margin: 0 auto;
    border-radius: 8px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  #quiz-question-scoreboard {
    margin-top: 0;
    width: 580px;
    margin: 0 auto;
    border-radius: 8px;
  }
}

.scoreboard-area {
  height: 93px;
  display: block;
  clear: both;
  background: -webkit-linear-gradient(307deg, #35a7be 3%, #56bbcd 63%, #29a3b8 100%);
  background: -o-linear-gradient(307deg, #35a7be 3%, #56bbcd 63%, #29a3b8 100%);
  background: -ms-linear-gradient(307deg, #35a7be 3%, #56bbcd 63%, #29a3b8 100%);
  background: -moz-linear-gradient(307deg, #35a7be 3%, #56bbcd 63%, #29a3b8 100%);
  background: linear-gradient(143deg, #35a7be 3%, #56bbcd 63%, #29a3b8 100%);
  position: relative;
}
.scoreboard-area .small-3 {
  width: 33%;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .scoreboard-area .small-3 {
    width: 25%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .scoreboard-area .small-3 {
    width: 25%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .scoreboard-area {
    border-radius: 8px;
    top: 20px;
    position: relative;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .scoreboard-area {
    border-radius: 8px;
    top: 20px;
    position: relative;
  }
}

.image-container {
  height: 75px;
  border-radius: 10px;
  float: left;
  display: inline-block;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .image-container {
    width: 108px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .image-container {
    width: 108px;
  }
}

.pane-bean-cmg-updated-new-logo img,
.pane-block-4 img {
  display: inline-block;
  float: left;
  margin-left: 56px;
  margin-top: 20px;
  width: 84%;
  position: relative;
  left: 14px;
  top: 3px;
}

.pane-bean-cmg-updated-new-logo {
  width: 475px;
  float: left;
}

img.next-question-arrow {
  top: 3px;
  position: relative;
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  img.next-arrow-image-results {
    width: 15%;
    position: relative;
    top: 4px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  img.next-arrow-image-results {
    position: relative;
    top: 4px;
    width: 12%;
  }
}

img.next-arrow-image {
  width: 15%;
  position: relative;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  img.next-arrow-image {
    top: 6px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  img.next-arrow-image {
    width: 29%;
  }
}

.trivia-show-more-container {
  display: none;
  color: #000;
  text-align: center;
  margin-bottom: 30px;
}

#show-more-button {
  clear: both;
  background: white;
  margin-top: 20px;
  padding-top: 20px;
  font-size: 17px;
  height: 120px;
  border-bottom-right-radius: 8px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #show-more-button {
    clear: both;
    background: #FFF;
    padding-top: 1px;
    font-size: 17px;
    height: 104px;
    border-bottom-right-radius: 8px;
    top: -19px;
    position: relative;
  }
}

.pager-next a {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  background-color: #F59E24;
  color: #FFF;
  padding: 16px 20px 14px;
  margin: 31px auto 0;
  line-height: 20px;
  text-align: center;
  width: 100%;
  max-width: 157px;
  border-radius: 6px;
  display: block;
}
.pager-next a:hover {
  background-color: #E39321;
  text-decoration: none;
}

@media not all and (min-resolution: 0.001dpcm) {
  .section-trivia .content-column-wrapper {
    margin-top: 40px;
  }
}
:root .section-trivia .content-column-wrapper,
_::-webkit-full-page-media,
_:future {
  margin-top: 40px;
}

.node-type-quizitem .footer {
  padding-bottom: 0;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .node-type-quizitem .footer {
    padding-bottom: 120px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .node-type-quizitem .mobile-fixed-footer {
    position: fixed;
    bottom: 0;
    background: #1f4460;
    height: 120px;
    width: 100%;
    z-index: 9;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .node-type-quizitem .link-container,
.trivia-cat .link-container,
.trivia-home .link-container {
    position: relative;
    right: 10px;
    top: 5px;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .node-type-quizitem .mobile-logo,
.trivia-cat .mobile-logo,
.trivia-home .mobile-logo {
    margin: 0 2px 0 5px;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .hide-for-small-only {
    display: none !important;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .homepage-top-container {
    height: 60px;
    max-height: 60px;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .mobile-container {
    text-align: center;
    margin: 0;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .node-type-quizitem .mobile-container {
    top: 22px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .node-type-quizitem #box-solot-1 .mobile-container span.block-text-seperator {
    display: none;
    height: 0;
    color: #15202c;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .node-type-quizitem .right-rail-box-container {
    top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .node-type-quizitem .mobile-container .block-text-seperator {
    display: block;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .node-type-quizitem .box-container {
    width: 728px;
    margin: 0 auto;
    height: 100px;
    top: 15px;
    position: relative;
  }
}
.node-type-quizitem .box-placeholder {
  height: auto;
  width: auto;
  margin: 0 auto;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .node-type-quizitem .mobile-container {
    position: relative;
    top: 5px;
    height: 100px;
    width: 728px;
    margin: 0 auto;
    float: none;
  }
}

body.quiz-results .global-wrapper-content {
  padding: 0px;
}
body.quiz-results .full-quiz-container {
  position: relative;
  padding-top: 0px;
  top: 0px;
}
body.quiz-results #quiz-results {
  position: relative;
}
body.quiz-results .quiz-results-inner {
  width: 100%;
}
body.quiz-results .mobile-fixed-footer {
  display: none;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  body.quiz-results .up-next-list {
    margin-left: 20px;
  }
}

.main-results {
  height: auto;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .main-results {
    min-height: 135px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .main-results {
    min-height: 127px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .up-next-quiz-carousel .ready-for-next-title {
    margin-bottom: 0px;
  }
}

h2.ready-for-your-next {
  font-family: "Amasis MT";
  font-size: 20px;
  line-height: 1;
  text-transform: uppercase;
  margin-bottom: 0px;
  width: 100%;
  padding-right: 165px;
  display: inline-block;
  vertical-align: bottom;
  left: 8px;
  position: relative;
}

.related-quizzes {
  margin: 0 auto;
  padding-left: 2%;
  padding-right: 1%;
}

.ready-for-next-title {
  background-color: #c9edf2;
  border-radius: 10px;
  padding-left: 0.9375em;
  padding-right: 0.9375em;
  float: left;
  position: relative;
  box-sizing: border-box;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .ready-for-next-title {
    width: 100%;
    margin-bottom: 20px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .ready-for-next-title {
    width: 100%;
    margin-bottom: 8px;
    margin-top: 0px;
  }
}
.ready-for-next-title .section-header {
  padding-bottom: 7px;
  padding-top: 7px;
}
.ready-for-next-title .section-header h2 {
  font-family: "Amasis MT";
  font-size: 20px;
  line-height: 1;
  text-transform: uppercase;
  margin-bottom: 0px;
  padding-right: 165px;
  display: inline-block;
  vertical-align: bottom;
  color: #000000;
  font-weight: bold;
  text-rendering: optimizeLegibility;
  top: 2px;
  position: relative;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .ready-for-next-title .section-header h2 {
    padding-right: 0;
    width: 100%;
    display: table-cell;
  }
}

.quiz-results-inner .full-quiz-container {
  margin-top: 20px;
  background: #16202c;
  background: -moz-linear-gradient(top, #16202c 0%, #ffffff 14%);
  background: -webkit-linear-gradient(top, #16202c 0%, #ffffff 14%);
  background: linear-gradient(to bottom, #16202c 0%, #ffffff 14%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#16202c", endColorstr="#ffffff",GradientType=0 );
}
.quiz-results-inner .glowstars {
  height: 100%;
  width: 100%;
  position: absolute;
  background: url("/themes/custom/cmatgame_mob/images/quiz-results/stars.png") no-repeat;
  background-position-x: 50%;
  background-position-y: 18%;
  opacity: 0;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .glowstars {
    background-size: 37%;
  }
}
.quiz-results-inner .scoring-area {
  background: url("/themes/custom/cmatgame_mob/images/quiz-results/glow.png") no-repeat;
  background-color: #b1e3eb;
  position: relative;
  background-position-y: 84%;
  background-position-x: 52%;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .quiz-results-inner .scoring-area {
    background-position-y: 67%;
    background-position-x: 53%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .quiz-results-inner .scoring-area {
    background-position-y: 69%;
    background-position-x: 52%;
  }
}
.quiz-results-inner p.message-box-text {
  font-family: "Open Sans", sans-serif;
  font-size: 20.88px;
  color: #f0f6a6;
  vertical-align: middle;
  letter-spacing: 0.05em;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 600;
  text-rendering: optimizeLegibility;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner p.message-box-text {
    font-size: 19px;
  }
}
.quiz-results-inner .quiz-title-results {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #FFF;
  font-size: 17.52px;
  vertical-align: middle;
  line-height: 56px;
  text-transform: uppercase;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  text-align: left;
}
.quiz-results-inner .progressbaroverlay {
  top: -23px;
  height: 24px;
  position: relative;
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .progressbaroverlay {
    margin-top: -101px;
    margin-left: 38px;
  }
}
.quiz-results-inner #progressbar.ui-progressbar {
  background: #2b7d8f;
  border: 4px solid #FFF;
}
.quiz-results-inner .ui-widget-content {
  height: 17px;
}
.quiz-results-inner .icon_circle_level {
  height: 0px;
  position: relative;
  top: 16px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .quiz-results-inner .icon_circle_level {
    top: 8px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .icon_circle_level {
    top: 6px;
  }
}
.quiz-results-inner .fb-share-button-results-top {
  top: 10px;
  right: 20px;
  position: relative;
  z-index: 5;
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .fb-share-button-results-top {
    top: 7px;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .fb-share-button-results-top img {
    height: 22px;
  }
}
.quiz-results-inner .title-row-mobile {
  display: none;
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .title-row-mobile {
    display: none;
    font-size: 11.8px;
    margin-bottom: 0px;
  }
}
.quiz-results-inner .title-row {
  background-color: #46b0c0;
  z-index: 1;
  height: 50px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  position: relative;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .quiz-results-inner .title-row {
    border-radius: 0px;
  }
}
.quiz-results-inner .top-results {
  position: relative;
  left: -75px;
}
.quiz-results-inner .title-row .image-container {
  width: 112px;
  height: 75px;
  margin: 13px 20px -4px 20px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .quiz-results-inner .title-row .image-container {
    display: inline-block;
    float: left;
    height: 77px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .quiz-results-inner .title-row .image-container img {
    height: 77px;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .title-row .image-container {
    display: none;
  }
}
@media only screen and (min-width: 0em) and (max-width: 20em) {
  .quiz-results-inner .title-row .image-container {
    display: none;
  }
}
.quiz-results-inner .results-quiz-image {
  border-radius: 8px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .quiz-results-inner .results-quiz-image {
    width: 112px;
  }
}
.quiz-results-inner .top-percentile-placeholder {
  text-align: center;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .quiz-results-inner .top-percentile-placeholder {
    position: relative;
    top: 16px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .quiz-results-inner .top-percentile-placeholder {
    position: relative;
    top: 16px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .top-percentile-placeholder {
    position: relative;
    left: 75px;
    top: 10px;
  }
}
.quiz-results-inner .out-of-correct {
  color: #08505b;
  font-size: 12.27px;
  font-weight: bold;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-align: center;
  display: block;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .quiz-results-inner .out-of-correct {
    top: 5px;
    position: relative;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .score-results {
    margin-top: 15px;
  }
}
.quiz-results-inner .score-results-title {
  background: url("/themes/custom/cmatgame_mob/images/quiz-results/score-text-2.png") no-repeat top;
  height: 38px;
  display: block;
  text-indent: -9999px;
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .score-results-title {
    background: url("/themes/custom/cmatgame_mob/images/quiz-results/score-text-mobile.png") no-repeat top;
    height: 28px;
  }
}
.quiz-results-inner .number-scored-container {
  transition: box-shadow 400ms;
  border-radius: 10px;
  background: url("/themes/custom/cmatgame_mob/images/quiz-results/large-cell.png") no-repeat top;
  height: 62px;
  font-weight: bold;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #FFF;
  width: 135px;
  background-size: 100%;
  line-height: 69px;
  vertical-align: middle;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .number-scored-container {
    background: url("/themes/custom/cmatgame_mob/images/quiz-results/large-mobile.png") no-repeat top;
    line-height: 37px;
    height: 45px;
    width: 100px;
  }
}
.quiz-results-inner .number-scored {
  text-align: center;
  font-size: 40.51px;
  font-weight: bold;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #FFF;
  vertical-align: middle;
  line-height: 70px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .quiz-results-inner .number-scored {
    line-height: 60px;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .number-scored {
    font-size: 30px;
    line-height: 50px;
  }
}
.quiz-results-inner .streak-results {
  margin-top: 20px;
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .streak-results {
    margin-top: 26px;
  }
}
.quiz-results-inner .streak-results-title {
  background: url("/themes/custom/cmatgame_mob/images/quiz-results/streak-text.png") no-repeat top;
  height: 32px;
  display: block;
  text-indent: -9999px;
}
.quiz-results-inner .streak-number {
  font-size: 31.17px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1px;
  display: block;
  position: relative;
  line-height: 41px;
  color: #44fc68;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .streak-number {
    font-size: 26.63px;
    line-height: 37px;
  }
}
.quiz-results-inner .streak-number-results {
  background: url("/themes/custom/cmatgame_mob/images/quiz/cell-results.png") no-repeat top;
  font-size: 31.17px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #35fe5f;
  font-weight: bold;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .streak-number-results {
    font-size: 26.63px;
    line-height: 23px;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .streak-results-title {
    background: url("/themes/custom/cmatgame_mob/images/quiz-results/streak-mobile.png") no-repeat top;
    height: 20px;
    margin-bottom: 5px;
  }
}
.quiz-results-inner .streak-number-container {
  transition: box-shadow 400ms;
  border-radius: 10px;
  background: url("/themes/custom/cmatgame_mob/images/quiz-results/cell-results.png") no-repeat center;
  height: 45px;
  text-align: center;
  width: 28%;
  transition: box-shadow 400ms;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .streak-number-container {
    width: 41%;
    height: 33px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .quiz-results-inner .streak-number-container {
    height: 33px;
    width: unset;
  }
}
.quiz-results-inner .streak-number-container .streak-number {
  font-size: 31.17px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: bold;
  text-align: center;
  margin-bottom: 1px;
  display: block;
  position: relative;
  line-height: 41px;
  top: 6px;
  position: relative;
  border-radius: 10px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .streak-number-container .streak-number {
    font-size: 26.63px;
    line-height: 23px;
    font-weight: normal;
  }
}
.quiz-results-inner .userLevelInfo {
  position: relative;
  background: #09a7c1;
  height: 100px;
  position: relative;
  margin-bottom: 7px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .quiz-results-inner .userLevelInfo {
    height: 120px;
  }
}
.quiz-results-inner .progressBarArea {
  width: 81%;
  display: inline-block;
  position: relative;
  top: -22px;
  margin-left: 47px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .quiz-results-inner .progressBarArea {
    margin-left: 140px;
    position: relative;
    top: -50px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .progressBarArea {
    margin-left: 0px;
    width: 70%;
  }
}
.quiz-results-inner .currentLevelProgress {
  border-radius: 8px;
  width: 75%;
  display: block;
  float: left;
  line-height: 100px;
  vertical-align: middle;
  margin-left: 65px;
  top: 31px;
  position: relative;
  display: inline-block;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .quiz-results-inner .currentLevelProgress {
    top: 0px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .currentLevelProgress {
    top: 14px;
  }
}
.quiz-results-inner .progressbaroverlay {
  top: -23px;
  height: 24px;
  position: relative;
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .progressbaroverlay {
    margin-top: -101px;
    margin-left: 38px;
    width: 150px;
  }
}
.quiz-results-inner #progressbar.ui-progressbar {
  background: #2b7d8f;
  border: 4px solid #FFF;
}
.quiz-results-inner .level-curved-text {
  position: relative;
  left: 24px;
  top: 1px;
  float: left;
}
.quiz-results-inner .points-text {
  font-family: "Helvetica";
  font-weight: bold;
  color: #FFF;
  top: -12px;
  right: 84px;
  position: relative;
  letter-spacing: 0.04em;
  font-size: 17px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .quiz-results-inner .points-text {
    float: right;
    top: -8px;
    right: 70px;
    font-weight: normal;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .quiz-results-inner .points-text {
    right: 90px;
    position: relative;
    top: -36px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .points-text {
    font-size: 12px;
    float: right;
    right: 32px;
    top: -25px;
  }
}
.quiz-results-inner .currentLevelContainer {
  -webkit-perspective: 1000;
  -moz-perspective: 1000;
  -o-perspective: 1000;
  perspective: 1000;
  position: relative;
  display: inline-block;
  top: 6px;
  left: 55px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .quiz-results-inner .currentLevelContainer {
    left: 68px;
    display: inline-block;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .currentLevelContainer {
    left: 0;
  }
}
.quiz-results-inner .levelCircleContainer {
  -webkit-perspective: 1000;
  -moz-perspective: 1000;
  -o-perspective: 1000;
  perspective: 1000;
  position: relative;
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 40px;
  border: 6px solid #fff;
  font-family: Helvetica;
  font-weight: bold;
  font-size: 37px;
  color: white;
  text-align: center;
  background: #fdb72c;
  position: relative;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .levelCircleContainer {
    top: -5px;
    width: 40px;
    height: 40px;
    left: 5px;
    font-size: 27px;
  }
}
.quiz-results-inner .flipper {
  left: 30px;
  top: -5px;
  position: relative;
  perspective: 900px;
  -webkit-perspective: 900px;
  -moz-perspective: 900px;
}
.quiz-results-inner .flipper .frontLevel {
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  transform: rotateY(0deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
  -o-transition: transform 1s ease-in-out;
  -moz-transition: transform 1s ease-in-out;
  -webkit-transition: transform 1s ease-in-out;
  transition: transform 1s ease-in-out;
}
.quiz-results-inner .flipper.flip .frontLevel {
  z-index: 900;
  -webkit-transform: rotateY(-1080deg);
  -moz-transform: rotateY(-1080deg);
  transform: rotateY(-1080deg);
}
.quiz-results-inner .font-effect-shadow-multiple {
  text-shadow: 0.04em 0.04em 0 #000, 0.08em 0.08em 0 #aaa;
}
.quiz-results-inner .levelProgressText {
  display: none;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 17.81px;
  font-weight: bold;
  color: #FFF;
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .levelProgressText {
    font-size: 14.81px;
  }
}
@media only screen and (min-width: 0em) and (max-width: 20em) {
  .quiz-results-inner .levelProgressText {
    font-size: 13.81px;
  }
}
.quiz-results-inner .review-retake-share {
  text-align: center;
  color: #000000;
  margin-bottom: 2px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .review-retake-share {
    margin-bottom: 5px;
  }
}
.quiz-results-inner .under-results-link-container {
  position: relative;
}
.quiz-results-inner .review-retake-share .under-box-link {
  list-style: none;
  display: inline-block;
  width: auto;
  text-align: center;
  height: 35px;
  cursor: pointer;
  line-height: 32px;
}
.quiz-results-inner .review-retake-share a {
  font-size: 16.46px;
  font-weight: bold;
  font-family: "Helvetica";
  height: 100%;
  color: #3579bb;
}
.quiz-results-inner .review-retake-share a:hover {
  text-decoration: underline;
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .review-retake-share a {
    font-size: 14.46px;
  }
}
.quiz-results-inner .under-box-link-container {
  margin-top: 0px;
  margin-bottom: 0px;
}
.quiz-results-inner #confetti {
  display: block;
  position: absolute;
}
.quiz-results-inner .float-center {
  display: block;
  margin-right: auto;
  margin-left: auto;
}
.quiz-results-inner .displayFix {
  display: block;
}
.quiz-results-inner .fullWidth {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  max-width: initial;
}
.quiz-results-inner .clearFix {
  clear: both;
}
.quiz-results-inner .confettiContainer {
  position: absolute;
  clear: both;
  position: absolute;
  clear: both;
  top: 50px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .quiz-results-inner .confettiContainer {
    left: 90px;
  }
}
.quiz-results-inner .results-column {
  width: 33.3333%;
  position: relative;
  display: inline-block;
  float: left;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .quiz-results-inner .results-column {
    top: 10px;
  }
}
.quiz-results-inner .correct-results {
  margin-top: 20px;
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .correct-results {
    margin-top: 26px;
  }
}
.quiz-results-inner .correct-results-title {
  background: url("/themes/custom/cmatgame_mob/images/quiz-results/correct-text.png") no-repeat top;
  height: 32px;
  display: block;
  text-indent: -9999px;
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .quiz-results-inner .correct-results-title {
    background: url("/themes/custom/cmatgame_mob/images/quiz-results/correct-mobile.png") no-repeat top;
    height: 20px;
    margin-bottom: 5px;
  }
}
.quiz-results-inner .correct-number-container {
  border-radius: 10px;
  background: url("/themes/custom/cmatgame_mob/images/quiz-results/cell-results.png") no-repeat center;
  height: 45px;
  text-align: center;
  width: 28%;
  width: 50%;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .correct-number-container {
    width: 41%;
    height: 33px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .quiz-results-inner .correct-number-container {
    height: 33px;
    width: unset;
  }
}
.quiz-results-inner .correct-number-container .correct-number {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 36.63px;
  font-weight: bold;
  color: #2cfcfe;
  text-align: center;
  vertical-align: middle;
  line-height: 50px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .quiz-results-inner .correct-number-container .correct-number {
    line-height: 49px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .quiz-results-inner .correct-number-container .correct-number {
    font-size: 26.23px;
    line-height: 31px;
    font-weight: normal;
  }
}
.quiz-results-inner .up-next-list ul.hidden {
      display: none;
}

.under-score-message {
  background-color: #227385;
  line-height: 50px;
  display: flex;
  clear: both;
  align-items: center;
  justify-content: center;
  height: 47px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .under-score-message {
    height: 44px;
  }
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .messageFixLarge {
    font-size: 14.88px !important;
  }
}
@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .messageFixMedium {
    font-size: 14.88px !important;
  }
}
.ready-for-your-next-quiz {
  list-style-type: none;
}
.ready-for-your-next-quiz li.recommended-quiz, .ready-for-your-next-quiz li.up-next-quiz {
  max-width: 31%;
  float: left;
  padding-left: 1%;
  padding-right: 1%;
  min-width: 31%;
  margin-bottom: 18px;
  height: 183px;
  margin-top: 20px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .ready-for-your-next-quiz li.recommended-quiz, .ready-for-your-next-quiz li.up-next-quiz {
    max-width: 0;
    float: none;
    padding-left: 0;
    padding-right: 0;
    min-width: 0;
    margin-bottom: 0;
    height: auto;
    margin-top: 0;
    display: table-row;
    clear: both;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .ready-for-your-next-quiz li.recommended-quiz, .ready-for-your-next-quiz li.up-next-quiz {
    max-width: 28%;
    min-width: 28%;
    padding-left: 2%;
    padding-right: 2%;
  }
}
.ready-for-your-next-quiz li.recommended-quiz .quiz-image, .ready-for-your-next-quiz li.up-next-quiz .quiz-image {
  width: 107px;
  display: table-cell;
  padding-top: 5px;
  position: relative;
}
.ready-for-your-next-quiz li.recommended-quiz .quiz-image img.carousel_listing_image, .ready-for-your-next-quiz li.up-next-quiz .quiz-image img.carousel_listing_image {
  border-radius: 8px;
  width: 207px;
  height: 142px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .ready-for-your-next-quiz li.recommended-quiz .quiz-image img.carousel_listing_image, .ready-for-your-next-quiz li.up-next-quiz .quiz-image img.carousel_listing_image {
    width: 107px;
    height: 73.39px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .ready-for-your-next-quiz li.recommended-quiz .quiz-image, .ready-for-your-next-quiz li.up-next-quiz .quiz-image {
    display: table-cell;
    float: left;
    width: 107px;
    padding-left: 10px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .ready-for-your-next-quiz li.recommended-quiz .quiz-title, .ready-for-your-next-quiz li.up-next-quiz .quiz-title {
    float: none;
    display: table-cell;
    vertical-align: middle;
    padding-left: 10px;
    text-align: left;
  }
}
.ready-for-your-next-quiz .answer-options {
  list-style-type: none;
}
.ready-for-your-next-quiz .answer-options ul {
  list-style-type: none;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .ready-for-your-next-quiz .answer-options ul {
    top: -5px;
    position: relative;
  }
}
.ready-for-your-next-quiz .answer-options ul.hidden {
  display: none;
}
.ready-for-your-next-quiz .answer-options ul.last-row li {
  margin-bottom: 50px;
}
.ready-for-your-next-quiz .block-views-recent-quizzes-feed-list-review .ready-for-next-title {
  margin: 0;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .ready-for-your-next-quiz .block-views-recent-quizzes-feed-list-review .ready-for-next-title {
    margin-bottom: 20px;
  }
}
.ready-for-your-next-quiz .ready-for-next-quiz-results, .ready-for-your-next-quiz .block-views-recent-quizzes-feed-list-review {
  max-width: 95%;
  margin: 0 auto;
}
.ready-for-your-next-quiz .ready-for-next-quiz-results h2.ready-for-next-title, .ready-for-your-next-quiz .ready-for-next-quiz-results h2.ready-for-your-next, .ready-for-your-next-quiz .ready-for-next-quiz-results h2.block-title, .ready-for-your-next-quiz .block-views-recent-quizzes-feed-list-review h2.ready-for-next-title, .ready-for-your-next-quiz .block-views-recent-quizzes-feed-list-review h2.ready-for-your-next, .ready-for-your-next-quiz .block-views-recent-quizzes-feed-list-review h2.block-title {
  font-family: "Amasis MT";
  font-size: 20px;
  line-height: 1;
  text-transform: uppercase;
  margin-bottom: 0px;
  width: 100%;
  padding-right: 165px;
  display: inline-block;
  vertical-align: bottom;
}
.ready-for-your-next-quiz .quiz-title {
  text-align: center;
  margin-top: 6px;
}
.ready-for-your-next-quiz .quiz-title a {
  font-size: 18px;
  font-family: Georgia, Georgia, "Times New Roman", serif;
  line-height: 18px;
  color: #000;
}
.ready-for-your-next-quiz .quiz-title a:hover {
  text-decoration: underline;
  color: #000;
}
.ready-for-your-next-quiz a.up-next-more {
  text-align: center;
  display: block;
  clear: both;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 17px;
  background: #F59E24;
  color: #FFFFFF;
  max-width: 157px;
  width: 108%;
  line-height: 20px;
  margin: 31px auto 0;
  padding: 16px 20px 14px;
  border-radius: 6px;
  position: relative;
  top: 22px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .ready-for-your-next-quiz a.up-next-more {
    top: 0px;
    margin: 18px auto 0;
  }
}

#latest-quizzes-html {
  margin-top: 50px;
  margin-bottom: 20px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #latest-quizzes-html {
    margin-top: 25px;
  }
}
#latest-quizzes-html .view-recent-quizzes-feed-list.view-id-recent_quizzes_feed_list.quiz-listing {
  margin-top: 18px;
}
#latest-quizzes-html .ready-for-next-quiz-results, #latest-quizzes-html .block-views-recent-quizzes-feed-list-review {
  max-width: 100%;
  margin: 0 auto;
}
#latest-quizzes-html .ready-for-next-quiz-results h2.ready-for-next-title, #latest-quizzes-html .ready-for-next-quiz-results h2.ready-for-your-next, #latest-quizzes-html .ready-for-next-quiz-results h2.block-title, #latest-quizzes-html .block-views-recent-quizzes-feed-list-review h2.ready-for-next-title, #latest-quizzes-html .block-views-recent-quizzes-feed-list-review h2.ready-for-your-next, #latest-quizzes-html .block-views-recent-quizzes-feed-list-review h2.block-title {
  font-family: "Amasis MT";
  font-size: 20px;
  line-height: 1;
  text-transform: uppercase;
  margin-bottom: 0px;
  width: 100%;
  padding-right: 165px;
  display: inline-block;
  vertical-align: bottom;
  font-weight: bold;
  padding-left: 1%;
  color: #000;
}
#latest-quizzes-html .ready-for-next-item, #latest-quizzes-html .up-next-quiz {
  max-width: 90%;
  float: left;
  padding-left: 1%;
  padding-right: 1%;
  min-width: 31%;
  margin-bottom: 18px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #latest-quizzes-html .ready-for-next-item, #latest-quizzes-html .up-next-quiz {
    padding-left: 10px;
    margin-bottom: 5px;
  }
}
#latest-quizzes-html .quiz-title a {
  font-size: 26px;
  line-height: 28px;
  margin-bottom: 3px;
  font-family: Georgia, Georgia, "Times New Roman", serif;
  line-height: 30px;
  letter-spacing: 0.3px;
  color: #000;
}
#latest-quizzes-html .quiz-title a:hover {
  text-decoration: underline;
  color: #000;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #latest-quizzes-html .quiz-title a {
    font-size: 18px;
    line-height: 20px;
  }
}
#latest-quizzes-html .quiz-icon {
  width: 189px;
  display: table-cell;
  height: auto;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #latest-quizzes-html .quiz-icon {
    width: 130px;
    height: 89px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #latest-quizzes-html .quiz-icon {
    width: 89px;
  }
}
#latest-quizzes-html .quizzes-feed-content {
  display: table-cell;
  padding-left: 20px;
  padding-bottom: 20px;
  vertical-align: middle;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #latest-quizzes-html .quizzes-feed-content {
    padding-left: 10px;
    padding-bottom: 0;
  }
}
#latest-quizzes-html .quiz-description p {
  color: #000000;
  display: inline-block;
  font-size: 17px;
  margin-top: 4px;
  margin-bottom: 0px;
  color: #333;
  font-family: "Helvetica Neue";
  line-height: 1.2;
  letter-spacing: 0.3px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #latest-quizzes-html .quiz-description p {
    font-size: 13px;
    display: none;
  }
}
#latest-quizzes-html .next-quiz-content img {
  border-radius: 8px;
  width: 130px;
  height: 89px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #latest-quizzes-html .next-quiz-content img {
    width: 100px;
    height: 68.59px;
  }
}

.section-trivia .global-wrapper .content-column-wrapper {
  width: 1130px;
}
.section-trivia .main-column {
  position: relative;
  margin-left: 160px;
}

.trivia-home .box-txt-wrapper p {
  left: 33px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-home .box-txt-wrapper p {
    left: 0;
  }
}
.trivia-home .fixed {
  top: 5px;
  position: fixed !important;
}
.trivia-home .trivia-mobile-fix h2.pane-title {
  background-color: #E39321;
  size: 25px;
  color: #e6f6ff;
  text-transform: uppercase;
  height: 26px;
  padding: 0 0 1px 29px;
  font-family: "ProximaNovaBold";
  font-size: 20px;
  margin: 14px auto 0;
  line-height: 26px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .trivia-home .trivia-mobile-fix h2.pane-title {
    padding-left: 20px;
    margin: 0;
    margin-bottom: 10px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-home .trivia-mobile-fix h2.pane-title {
    padding-left: 20px;
    margin: 0;
    margin-bottom: 10px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .trivia-cat #box-slot-1,
.trivia-category #box-slot-1 {
    margin-top: -26px;
    margin-left: 17px;
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-cat #box-slot-1,
.trivia-category #box-slot-1 {
    margin-bottom: 10px;
  }
}

.trivia-home .pane-views-recent-quizzes-feed-list-block {
  padding: 0 5px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-home .right-rail-box-container #box-slot-1 {
    margin-top: 25px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .trivia-home .right-rail-box-container #box-slot-1 {
    margin-top: -62px;
    margin-left: 17px;
    margin-bottom: 73px;
  }
}
.trivia-home .mobile-container .block-text-seperator {
  padding-bottom: 5px;
}
div#trivia-home-latest-quizzes {
  min-height: 800px;
}

.parent-tax-link {
  padding-bottom: 4px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .parent-tax-link {
    padding-bottom: 3px;
  }
}

h3.home-more-favorites {
  color: #000;
  font-family: "Amasis MT";
  font-size: 23px;
  text-align: center;
  font-weight: bold;
  margin-top: 15px;
  line-height: 43px;
  clear: both;
  position: relative;
  bottom: 10px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  h3.home-more-favorites {
    font-size: 38px;
    margin-bottom: 10px;
    line-height: 43px;
    text-transform: none;
    margin-bottom: 10px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  h3.home-more-favorites {
    margin-top: 30px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #trivia-home-container {
    width: 659px;
    float: left;
    top: 11px;
    min-height: 519px;
  }
}
#trivia-home-container .trivia-home-latest-quizzes {
  max-width: 95%;
  margin: 0 auto;
  top: 10px;
  position: relative;
}
#trivia-home-container #hpHero {
  display: inline-block;
  width: 100%;
  height: 130px;
}
#trivia-home-container .trivia-hero-quiz {
  background: #d7eff1;
  padding: 0;
  margin: auto auto 1px;
  border-top-right-radius: 8px;
}
#trivia-home-container .trivia-hero-quiz .image-wrap {
  display: inline-block;
  height: 100px;
  margin: 10px 24px 20px 10px;
  float: left;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #trivia-home-container .trivia-hero-quiz .image-wrap {
    height: 130px;
    margin: 0 24px 0 14px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  #trivia-home-container .trivia-hero-quiz .image-wrap {
    height: 130px;
    width: 130px;
    margin: 0 24px 0 14px;
  }
}
#trivia-home-container .trivia-hero-quiz .image-wrap img {
  width: 100px;
  height: 100px;
  border-radius: 10px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #trivia-home-container .trivia-hero-quiz .image-wrap img {
    width: 130px;
    height: 130px;
  }
}
#trivia-home-container .trivia-hero-quiz .link-wrap {
  width: 60%;
  display: inline-block;
  position: relative;
  transform: translateY(-50%);
  top: 50%;
  text-overflow: ellipsis;
  left: -10px;
}
#trivia-home-container .trivia-hero-quiz .link-wrap .featured-quiz {
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  letter-spacing: 0.6px;
  color: #E39321;
  top: -4px;
  position: relative;
}
#trivia-home-container .trivia-hero-quiz .link-wrap h2 a {
  font-size: 20px;
  line-height: 24px;
  font-family: "Amasis MT";
  font-weight: bold;
  margin-bottom: 0;
  color: #000000;
  text-transform: none;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #trivia-home-container .trivia-hero-quiz .link-wrap h2 a {
    font-size: 24px;
    text-transform: none;
  }
}
#trivia-home-container .trivia-hero-quiz .link-wrap p a {
  font-size: 17px;
  line-height: 21px;
  font-weight: 400;
  display: inline-block;
  color: #000000;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  overflow: ellipsis;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #trivia-home-container .trivia-hero-quiz .link-wrap p a {
    font-size: 14px;
    line-height: 18px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #trivia-home-container .trivia-hero-quiz .link-wrap p a {
    font-size: 14px;
    line-height: 16px;
  }
}
#trivia-home-container .quiz-row {
  margin-top: 0;
  margin-bottom: 0;
  background: white;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #trivia-home-container .quiz-row {
    height: 81px;
  }
}
#trivia-home-container .views-row {
  display: table-row;
}
#trivia-home-container .hp-quiz-icon {
  display: table-cell;
}
#trivia-home-container .parent-tax-link a {
  color: inherit;
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  letter-spacing: 0.6px;
  position: relative;
  top: -2px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #trivia-home-container .parent-tax-link a {
    font-size: 10px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #trivia-home-container .parent-tax-link a {
    font-size: 0.75rem;
  }
}
#trivia-home-container img.quiz-icon {
  display: table-cell;
  height: auto;
  width: 100px;
  border-radius: 10px;
  max-width: unset;
  margin: 10px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #trivia-home-container img.quiz-icon {
    width: 130px;
    height: 90px;
  }
}
#trivia-home-container .quizzes-feed-content {
  display: table-cell;
  padding-left: 10px;
  vertical-align: middle;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #trivia-home-container .quizzes-feed-content {
    padding-left: 0;
  }
}
#trivia-home-container .quizzes-feed-content span.parent-tax-link {
  color: #F00;
}
#trivia-home-container .quizzes-feed-content .quiz-title {
  font-family: Georgia, "Times New Roman", serif;
}
#trivia-home-container .quizzes-feed-content .quiz-title a {
  font-size: 1.125rem;
  line-height: 22px;
  color: #000000;
  display: block;
  margin-bottom: 3px;
}
#trivia-home-container .quizzes-feed-content .quiz-title a:hover {
  text-decoration: underline;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #trivia-home-container .quizzes-feed-content .quiz-title a {
    font-size: 22px;
    line-height: 24px;
  }
}

#trivia-show-more-container,
.block-projectcuriously-custom-cmc-category-sidebar,
.pane-cmatgame-trivia-trivia-navigation,
.trivia-container,
div#block-triviacategories {
  background: white;
  float: left;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #trivia-show-more-container,
.block-projectcuriously-custom-cmc-category-sidebar,
.pane-cmatgame-trivia-trivia-navigation,
.trivia-container,
div#block-triviacategories {
    max-width: 659px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  #trivia-show-more-container,
.block-projectcuriously-custom-cmc-category-sidebar,
.pane-cmatgame-trivia-trivia-navigation,
.trivia-container,
div#block-triviacategories {
    max-width: 450px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #trivia-show-more-container,
.block-projectcuriously-custom-cmc-category-sidebar,
.pane-cmatgame-trivia-trivia-navigation,
.trivia-container,
div#block-triviacategories {
    width: 100%;
  }
}

#trivia-home-more-quizzes .quizzes-feed-content {
  display: block;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #trivia-home-more-quizzes .quizzes-feed-content {
    display: flex;
  }
}
#trivia-home-more-quizzes ul {
  max-height: 228px;
  display: table;
}
#trivia-home-more-quizzes ul:before {
  content: " ";
  display: table-row;
}
#trivia-home-more-quizzes ul:after {
  content: " ";
  display: table-row;
}
#trivia-home-more-quizzes div.homepage-more-favorite-quiz {
  display: table-cell;
  max-width: 100%;
  padding-left: 10px;
  padding-right: 1%;
  min-width: 31%;
  margin-bottom: 50px;
  height: 85px;
  text-align: left;
}
#trivia-home-more-quizzes div.homepage-more-favorite-quiz:after {
  clear: both;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz {
    max-width: 28%;
    min-width: 25%;
    float: left;
    position: relative;
    padding-left: 0.9375em;
    padding-right: 0.9375em;
    min-height: 180px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz {
    display: table-cell;
    min-width: 30%;
    width: 30%;
    float: left;
    position: relative;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz {
    max-width: 40%;
    min-width: 25%;
    float: left;
    position: relative;
    padding-left: 0.9375em;
    padding-right: 0.9375em;
    min-height: 180px;
    margin-bottom: 25px;
  }
}
#trivia-home-more-quizzes div.homepage-more-favorite-quiz img.listing_thumbnail {
  margin-bottom: 1px;
  border-radius: 8px;
  height: auto;
  width: 107px;
  margin-bottom: 10px;
  display: inline-block;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz img.listing_thumbnail {
    display: inline-block;
    height: 113px;
    width: 173px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz img.listing_thumbnail {
    display: inline-block;
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz img.listing_thumbnail {
    display: inline-block;
    height: 100px;
    width: 150px;
    margin-bottom: 5px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz .view-field-body {
    text-align: center;
  }
}
#trivia-home-more-quizzes div.homepage-more-favorite-quiz .quiz-row {
  float: left;
  margin-left: 10px;
  margin-right: 30px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz .quiz-row {
    float: none;
    margin-left: 0;
    margin-right: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz .quiz-row {
    float: none;
    margin-left: 0;
    margin-right: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz .quiz-title {
    text-align: center;
  }
}
#trivia-home-more-quizzes div.homepage-more-favorite-quiz .quiz-title a {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
  color: #000;
  line-height: 24px;
}
#trivia-home-more-quizzes div.homepage-more-favorite-quiz .quiz-title a:hover {
  text-decoration: underline;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz .quiz-title a {
    font-size: 16px;
    line-height: 17px;
    text-align: center;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  #trivia-home-more-quizzes div.homepage-more-favorite-quiz .quiz-title a {
    display: table-cell;
    padding-left: 0;
    line-height: 21px;
    text-align: center;
    vertical-align: middle;
    position: relative;
    top: 0;
    font-size: 1.125rem;
  }
}

.home-quiz-description {
  display: none;
  font-size: 13px;
  margin-top: 4px;
  margin-bottom: 0;
  color: #333;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 15px;
  letter-spacing: 0.3px;
  position: relative;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .home-quiz-description {
    font-size: 14px;
    display: block;
    top: -2px;
    letter-spacing: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .home-quiz-description {
    display: block;
    letter-spacing: 0;
  }
}

.trivia-cat .main-column,
.trivia-home .main-column {
  top: -7px;
  width: 640px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .trivia-cat .right-rail-box-container,
.trivia-home .right-rail-box-container {
    top: 10px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-cat .right-rail-box-container,
.trivia-home .right-rail-box-container {
    top: -5px;
    position: relative;
    width: 300px;
    display: inline-block;
    left: 9px;
  }
}
.trivia-cat .right-rail-box-container .box-container,
.trivia-home .right-rail-box-container .box-container {
  float: left;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .trivia-cat .right-rail-box-container .box-container,
.trivia-home .right-rail-box-container .box-container {
    top: 0;
    margin-bottom: 44px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-cat .right-rail-box-container .box-container-2,
.trivia-home .right-rail-box-container .box-container-2 {
    top: 0;
    float: left;
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .trivia-cat .right-rail-box-container .box-container-2,
.trivia-home .right-rail-box-container .box-container-2 {
    padding: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-cat .right-rail-box-container #box-slot-1,
.trivia-home .right-rail-box-container #box-slot-1 {
    top: 5px;
    margin-top: 0;
    margin-bottom: 40px;
    height: 270px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .trivia-cat .right-rail-box-container #box-slot-1,
.trivia-home .right-rail-box-container #box-slot-1 {
    margin-left: 17px;
    height: 300px;
  }
}
.trivia-cat .right-rail-box-container .block-projectcuriously-custom-cmc-category-sidebar,
.trivia-cat .right-rail-box-container .pane-cmatgame-trivia-trivia-navigation,
.trivia-cat .right-rail-box-container div#block-triviacategories,
.trivia-home .right-rail-box-container .block-projectcuriously-custom-cmc-category-sidebar,
.trivia-home .right-rail-box-container .pane-cmatgame-trivia-trivia-navigation,
.trivia-home .right-rail-box-container div#block-triviacategories {
  width: 97%;
  background: #FFF;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .trivia-cat .right-rail-box-container .block-projectcuriously-custom-cmc-category-sidebar,
.trivia-cat .right-rail-box-container .pane-cmatgame-trivia-trivia-navigation,
.trivia-cat .right-rail-box-container div#block-triviacategories,
.trivia-home .right-rail-box-container .block-projectcuriously-custom-cmc-category-sidebar,
.trivia-home .right-rail-box-container .pane-cmatgame-trivia-trivia-navigation,
.trivia-home .right-rail-box-container div#block-triviacategories {
    display: none;
  }
}

body.trivia-home {
  margin-bottom: 0;
  margin-top: 0;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  body.trivia-home {
    margin-bottom: 100px;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 700px) {
  .node-type-quizitem .mobile-header-ad {
    position: fixed;
    height: 60px;
    width: 100%;
    background: #1f4460;
    padding-top: 0;
    margin-top: 0;
    top: 7px;
    z-index: 2;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 700px) {
  .node-type-quizitem .mobile-header {
    position: fixed;
    top: 82px;
    background: #1f4460;
    z-index: 2;
    width: 100%;
    height: 60px;
  }
}

.node-type-quizitem .footer {
  padding-bottom: 0;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .node-type-quizitem .footer {
    padding-bottom: 60px;
    z-index: 9;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .trivia-cat .mobile-fixed-footer,
.trivia-home .mobile-fixed-footer {
    height: 50px;
    position: relative;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .node-type-quizitem .mobile-fixed-footer {
    position: fixed;
    bottom: 20px;
    height: 50px;
    width: 100%;
    z-index: 10;
  }
}

.trivia-cat .block-text-seperator,
.trivia-home .block-text-separator {
  display: block;
  padding-bottom: 0;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .trivia-cat .block-text-seperator,
.trivia-home .block-text-separator {
    display: none;
    left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-cat .block-text-seperator,
.trivia-home .block-text-separator {
    padding-bottom: 0;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .node-type-quizitem #content {
    top: 140px;
    z-index: 1;
    position: relative;
    min-height: 100%;
    height: 100%;
    margin-bottom: 80px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-home .mobile-container.homepage-top-container {
    width: auto;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-cat .mobile-container,
.trivia-home .mobile-container {
    float: none;
    left: 0;
    margin: 0;
    padding: 0;
    width: 300px;
    position: relative;
    text-align: center;
  }
}

@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  #box-slot-1 .mobile-container {
    top: 55px;
  }
}
.trivia-home .mobile-container {
  display: block;
  float: left;
  width: auto;
  text-align: left;
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: portrait) {
  .trivia-home .mobile-container {
    position: relative;
    top: 0;
  }
}
@media screen and (min-width: 768px) and (max-width: 1366px) and (orientation: landscape) {
  .trivia-home .mobile-container {
    position: relative;
    text-align: center;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .trivia-home .mobile-container {
    display: inline-block;
    position: relative;
    height: 320px;
    width: 100%;
    margin: 19px;
  }
  .trivia-home .mobile-container .block-text-seperator {
    color: #ccc;
    position: relative;
    font-size: 0.75rem;
    letter-spacing: 0.04em;
    bottom: 5px;
    left: 20px;
    top: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) and (min-device-width: 375px) and (max-device-width: 667px) {
  .trivia-home .mobile-container .block-text-seperator {
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .trivia-home .mobile-container .detailBlock {
    top: 5px;
  }
}

#block-triviacategories {
  background: #FFF;
}

.quiz-report {
  background: #FFF;
  color: #000000;
  padding-bottom: 20px;
}
.quiz-report .each-question {
  padding-top: 8px;
  border-bottom: 1px solid #D9D9D9;
}
.quiz-report .each-question .dd ul {
  margin-bottom: 1.3em;
}
.quiz-report .each-question .quiz-report-question {
  padding-left: 5px;
}
.quiz-report .each-question .quiz-report-question .body {
  display: inline-block;
  margin-left: 50px;
}
.quiz-report .each-question .quiz-report-question .body p {
  font-family: "New Baskerville", Georgia;
  font-size: 22px;
  margin-top: 5px;
  margin-bottom: 0;
  line-height: 30px;
}
.quiz-report .each-question .quiz-report-question .question-number {
  display: inline-block;
  position: absolute;
  float: left;
  width: 52px;
}
.quiz-report .each-question .quiz-report-question .question-number .icon_circle_number {
  background-color: black;
  border-radius: 25px;
  color: white;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 22px;
  height: 40px;
  width: 40px;
}
.quiz-report .each-question .quiz-report-question .question-number .icon_circle_number .review-number {
  color: #FFF;
  position: relative;
  top: 10px;
  left: 8px;
}
.quiz-report .each-question .quiz-report-question .question-number span {
  display: none;
}
.quiz-report .each-question .quiz-report-question .question-number img {
  width: 40px;
  height: 40px;
}
.quiz-report .each-question .dd {
  padding-top: 4px;
  padding-bottom: 35px;
  margin-left: 57px;
}
.quiz-report .each-question .dd .quiz-config-answers {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 17px;
  color: #9B9B9B;
  padding: 0;
  margin-bottom: 0;
  line-height: 26px;
}
.quiz-report .each-question .dd .quiz-config-answers ul {
  font-size: 1em;
  line-height: 1.6;
  margin-bottom: 1.25em;
  list-style-position: outside;
  font-family: inherit;
}
.quiz-report .each-question .dd .quiz-config-answers li {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  list-style-type: none;
}
.quiz-report .each-question .dd .quiz-config-answers li.solution-quiz-config-answer {
  color: #65E08E;
  position: relative;
  right: 20px;
}
.quiz-report .each-question .dd .quiz-config-answers li.solution-quiz-config-answer:before {
  content: url("/themes/custom/cmatgame/images/cmatgameimages/icon_checkmark_green.svg");
  display: inline-block;
  width: 19px;
  height: 15px;
  left: -4px;
  position: relative;
  top: 2px;
}
.quiz-report .each-question .dd .quiz-config-answers li.attempted-quiz-config-answer {
  color: #FD625E;
  position: relative;
  right: 20px;
}
.quiz-report .each-question .dd .quiz-config-answers li.attempted-quiz-config-answer:before {
  content: url("/themes/custom/cmatgame/images/cmatgameimages/icon_x_red.png");
  display: inline-block;
  width: 19px;
  height: 15px;
  left: -4px;
  position: relative;
  top: 2px;
}
.quiz-report .each-question .dd .quiz-config-answers li.solution-quiz-config-timeout {
  font-weight: 600;
  color: #65E08E;
}
.quiz-report .each-question .dd .field-answer-fact {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 26px;
  color: #222;
  max-width: 90%;
  font-size: 16px;
  line-height: 26px;
  position: relative;
  top: -10px;
}
.quiz-report .each-question .dd .field-answer-fact > span {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: bold;
  line-height: 1;
}
.quiz-report .each-question .each-answers .quiz-links {
  float: right;
  width: 100%;
  top: -28px;
  position: relative;
}
.quiz-report .each-question .each-answers .quiz-links ul {
  list-style-type: none;
}
.quiz-report .each-question .each-answers .quiz-links ul li .field-source {
  position: relative;
  top: -20px;
  margin-top: 20px;
}
.quiz-report .each-question .each-answers a.view-answer-source {
  text-decoration: none;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin-left: 57px;
  color: #000;
}
.quiz-report .each-question .each-answers a.view-answer-source:hover {
  text-decoration: underline;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .quiz-report .each-question .each-answers a.view-answer-source {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 15px;
    color: #000000;
    border-right: 1px solid rgba(0, 0, 0, 0.25);
    line-height: 18px;
    float: right;
    position: relative;
    right: 100px;
  }
}
.quiz-report #back-to-results,
.quiz-report #retake-the-quiz-review-answers {
  cursor: pointer;
  font-family: "Helvetica";
  font-weight: bold;
  font-size: 19px;
  top: 0;
  position: relative;
  left: 0;
  top: 20px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .quiz-report #back-to-results,
.quiz-report #retake-the-quiz-review-answers {
    position: relative;
    top: 10px;
    left: 40px;
    margin-bottom: 20px;
  }
}

.trivia-cat .main-column {
  position: relative;
  top: -8px;
  border-radius: 8px;
  width: 640px;
}
.trivia-cat .main-column .inside {
  border-radius: 8px;
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat.page-taxonomy-term .mobile-container {
    left: 0;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat.page-taxonomy-term .box-container-2 .mobile-container {
    padding: 0;
  }
}

.section-trivia.trivia-cat {
  border-radius: 8px;
}
.section-trivia.trivia-cat .fixed {
  position: fixed !important;
  top: 5px;
  z-index: 99999;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .trivia-container {
    max-width: 450px;
    background: #F00;
  }
}
.section-trivia.trivia-cat .page-taxonomy-term .pane-cmatgame-advertisement-cm-g-homepage-160x600-left {
  margin-left: -200px;
}
.section-trivia.trivia-cat .page-1-playlists .pane-cmatgame-advertisement-cm-g-homepage-160x600-left {
  margin-left: -90px;
}
.section-trivia.trivia-cat .pane-cmatgame-advertisement-cm-g-homepage-160x600-left {
  position: absolute;
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest {
  border-radius: 8px;
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-listing-category-page {
  padding: 0 20px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-listing-category-page {
    padding: 0 5px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-listing-category-page {
    padding: 0 0 10px;
  }
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest h2.pane-title {
  background-color: inherit;
  size: 25px;
  color: #e6f6ff;
  text-transform: none;
  height: 26px;
  padding: 0 0 1px 29px;
  font-family: "ProximaNovaBold";
  font-size: 20px;
  margin: 14px auto 0;
  line-height: 26px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest h2.pane-title {
    padding-left: 20px;
    margin: 0;
    margin-bottom: 10px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest h2.pane-title {
    padding-left: 20px;
    margin: 0 0 10px;
  }
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest h2.pane-title:before {
  content: "TRIVIA: ";
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest li.category-more-favorite-quiz {
  max-width: 31%;
  float: left;
  padding-left: 1%;
  padding-right: 1%;
  min-width: 31%;
  margin-bottom: 18px;
  height: 183px;
  margin-top: 20px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest li.category-more-favorite-quiz {
    height: 85px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest li.category-more-favorite-quiz {
    width: 100%;
    max-width: 0;
    float: left;
    padding-left: 0;
    padding-right: 0;
    min-width: 0;
    margin-bottom: 0;
    height: 64px;
    margin-top: 0;
    clear: both;
  }
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest li.category-more-favorite-quiz img.listing_thumbnail {
  margin-bottom: 1px;
  border-radius: 8px;
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest li.category-more-favorite-quiz .quiz-title a {
  font-family: "Amasis MT";
  font-size: 20px;
  color: #000;
  line-height: 24px;
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest li.category-more-favorite-quiz .quiz-title a:hover {
  text-decoration: underline;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest li.category-more-favorite-quiz .quiz-title a {
    font-size: 16px;
    line-height: 17px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest li.category-more-favorite-quiz .quiz-title a {
    font-size: 1.125rem;
    line-height: 18px;
  }
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest li.category-more-favorite-quiz .cat-quiz-description {
  margin-top: 4px;
  margin-bottom: 0;
  color: #333;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 1.2;
  letter-spacing: 0.3px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest li.category-more-favorite-quiz .cat-quiz-description {
    display: none;
  }
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row {
  display: table-row;
  margin-top: 0;
  margin-bottom: 0;
  background: white;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row {
    height: 61px;
  }
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .cat-quiz-icon {
  display: table-cell;
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .cat-quiz-icon img.quiz-icon {
  height: auto;
  width: 107px;
  border-radius: 10px;
  max-width: unset;
  margin: 10px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .cat-quiz-icon img.quiz-icon {
    width: 130px;
    height: 90px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .cat-quiz-icon img.quiz-icon {
    margin: 6px 0 0 10px;
  }
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content {
  padding-left: 24px;
  display: table-cell;
  padding-bottom: 20px;
  vertical-align: middle;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content {
    padding-left: 10px;
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content {
    display: table-cell;
    padding-left: 10px;
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content {
    padding-left: 10px;
    padding-bottom: 10px;
  }
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content span.parent-tax-link a {
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  font-family: "Helvetica";
  letter-spacing: 0.6px;
  color: #50b088;
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content span.parent-tax-link a:hover {
  color: #45D59F;
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content .views-field-body {
  font-size: 17px;
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content .quiz-title a {
  color: #000000;
  font-size: 26px;
  line-height: 28px;
  font-family: Georgia, "Times New Roman", serif;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content .quiz-title a {
    font-size: 1.125rem;
    line-height: 18px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content .quiz-title a {
    font-size: 1.125rem;
    line-height: 18px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content .quiz-title a {
    font-size: 1.125rem;
    line-height: inherit;
  }
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content .quiz-title a:hover {
  text-decoration: underline;
}
.section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content p {
  margin-top: 4px;
  margin-bottom: 0;
  color: #333;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: 0.3px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content p {
    font-size: 14px;
    line-height: 14px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .pane-cmatgame-trivia-trivia-category-latest .quiz-row .quizzes-feed-content p {
    display: none;
    line-height: 0;
  }
}
.section-trivia.trivia-cat .category-show-more {
  display: block;
  text-align: center;
  padding: 0 20px;
  margin: 35px 0;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .section-trivia.trivia-cat .category-show-more {
    padding: 0 5px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more {
    width: 100%;
    padding: 0;
    margin: 20px 0 0;
  }
}
.section-trivia.trivia-cat .category-show-more h3.more-favorites-headline {
  display: inline-block;
  text-align: left;
  color: #000000;
  font-weight: bold;
  font-family: "Amasis MT";
  font-size: 20px;
  margin-bottom: 0;
  border-bottom: 4px solid #000000;
  line-height: 1;
  width: 100%;
  text-transform: uppercase;
  margin-bottom: 0;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more h3.more-favorites-headline {
    width: 90%;
    margin-bottom: 10px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more #trivia-category-more-quizzes {
    width: 100%;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .pane-views-recent-quizzes-feed-list-block {
    padding: 0 5px;
  }
}
.section-trivia.trivia-cat .category-show-more .category-more-quizzes {
  display: table;
  margin-top: 10px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .category-more-quizzes ul {
    display: table;
  }
}
.section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz {
  display: table-cell;
  max-width: 100%;
  padding-left: 10px;
  padding-right: 1%;
  min-width: 31%;
  margin-bottom: 50px;
  height: 85px;
  text-align: left;
}
.section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz:after {
  clear: both;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz {
    max-width: 28%;
    min-width: 25%;
    float: left;
    position: relative;
    padding-left: 0.9375em;
    padding-right: 0.9375em;
    min-height: 180px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz {
    display: table-cell;
    min-width: 30%;
    width: 30%;
    float: left;
    position: relative;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz {
    max-width: 40%;
    min-width: 25%;
    float: left;
    position: relative;
    padding-left: 0.9375em;
    padding-right: 0.9375em;
    min-height: 180px;
    margin-bottom: 25px;
  }
}
.section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz img.listing_thumbnail {
  margin-bottom: 1px;
  border-radius: 8px;
  height: auto;
  width: 107px;
  margin-bottom: 10px;
  display: inline-block;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz img.listing_thumbnail {
    display: inline-block;
    height: 113px;
    width: 173px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz img.listing_thumbnail {
    display: inline-block;
    margin-bottom: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz img.listing_thumbnail {
    display: inline-block;
    height: 100px;
    width: 150px;
    margin-bottom: 5px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content {
    padding-left: 0;
    display: block;
  }
}
.section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content {
  padding-left: 24px;
  display: table-cell;
  padding-bottom: 20px;
  vertical-align: middle;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content {
    padding-left: 10px;
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content {
    padding-left: 0;
    padding-bottom: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content {
    padding-left: 0;
    padding-bottom: 0;
    display: inherit;
    vertical-align: middle;
  }
}
.section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content span.parent-tax-link a {
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  font-family: "Helvetica";
  letter-spacing: 0.6px;
  color: #50b088;
}
.section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content span.parent-tax-link a:hover {
  color: #45D59F;
}
.section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content .views-field-body {
  font-size: 17px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content .quiz-title {
    text-align: left;
    width: 160px;
    padding-top: 16px;
  }
}
.section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content .quiz-title a {
  color: #000000;
  font-size: 26px;
  line-height: 28px;
  font-family: Georgia, "Times New Roman", serif;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content .quiz-title a {
    font-size: 16px;
    line-height: 17px;
    text-align: center;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content .quiz-title a {
    display: table-cell;
    padding-left: 0;
    line-height: 21px;
    text-align: center;
    vertical-align: middle;
    position: relative;
    top: 0;
    font-size: 1.125rem;
  }
}
.section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content .quiz-title a:hover {
  text-decoration: underline;
}
.section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content p {
  margin-top: 4px;
  margin-bottom: 0;
  color: #333;
  font-family: "Helvetica Neue";
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: 0.3px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .section-trivia.trivia-cat .category-show-more .homepage-more-favorite-quiz .quizzes-feed-content p {
    font-size: 15px;
    line-height: 15px;
  }
}
.section-trivia.trivia-cat .category-show-more .quiz-subcategories .categories ul li {
  list-style-type: none;
  margin-bottom: 18px;
}
.section-trivia.trivia-cat .category-show-more .cat-quiz-description {
  display: none;
  font-size: 13px;
  margin-top: 4px;
  margin-bottom: 0;
  color: #333;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  line-height: 15px;
  letter-spacing: 0.3px;
  position: relative;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .category-show-more .cat-quiz-description {
    font-size: 0.75rem;
    display: block;
    top: -2px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat .category-show-more .cat-quiz-description {
    display: block;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .cat-quiz-description {
    display: none;
  }
}
.section-trivia.trivia-cat .category-show-more .trivia-cat .panel-pane.pane-block.pane-cmatgame-advertisement-cm-g-otherpages-728x90-footer {
  margin-top: 30px;
}
.section-trivia.trivia-cat .category-show-more .trivia-cat .right-rail-box-container {
  top: 0;
  width: 350px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat .category-show-more .trivia-cat .right-rail-box-container {
    top: 10px;
    left: 14px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .category-show-more .trivia-cat .right-rail-box-container {
    top: 0;
    position: relative;
    width: 300px;
    display: inline-block;
    left: 9px;
    float: left;
  }
}
.section-trivia.trivia-cat .category-show-more .trivia-cat .right-rail-box-container .box-placeholder {
  height: 250px;
  width: 300px;
  float: left;
}
.section-trivia.trivia-cat .category-show-more .trivia-cat .right-rail-box-container .pane-cmatgame-trivia-trivia-navigation {
  width: 97%;
  background: transparent;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  .section-trivia.trivia-cat .category-show-more .trivia-cat .right-rail-box-container .pane-cmatgame-trivia-trivia-navigation {
    float: left;
  }
}
.section-trivia.trivia-cat .category-show-more .trivia-cat .right-rail-box-container .box-container,
.section-trivia.trivia-cat .category-show-more .trivia-cat .right-rail-box-container .box-container-2 {
  float: left;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .section-trivia.trivia-cat .category-show-more .trivia-cat .right-rail-box-container .box-container,
.section-trivia.trivia-cat .category-show-more .trivia-cat .right-rail-box-container .box-container-2 {
    margin-top: 0;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .trivia-cat .mobile-header-ad {
    position: fixed;
    height: 60px;
    width: 100%;
    background: #1f4460;
    padding-top: 0;
    margin-top: 0;
    margin-bottom: 100px;
    top: -9px;
    z-index: 2;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .trivia-cat .mobile-header {
    position: fixed;
    top: 51px;
    background: #1f4460;
    z-index: 2;
    width: 100%;
  }
}
.section-trivia.trivia-cat .category-show-more .trivia-cat .footer {
  padding-bottom: 0;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .trivia-cat .footer {
    padding-bottom: 60px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .trivia-cat .mobile-fixed-footer {
    position: fixed;
    bottom: 0;
    background: #1f4460;
    height: 60px;
    width: 100%;
    z-index: 9;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .category-show-more .trivia-cat #content {
    top: 81px;
    z-index: 1;
    position: relative;
    min-height: 100%;
    height: 100%;
    margin-bottom: 80px;
  }
}
.section-trivia.trivia-cat .sorting-wrapper {
  float: right;
  display: inline-block;
  width: 50%;
  height: 20px;
  text-align: right;
  background: url("/themes/custom/cmatgame/images/cmatgameimages/icon_arrow_down.svg") no-repeat right #fff;
  overflow: hidden;
  position: absolute;
  bottom: 2px;
}
.section-trivia.trivia-cat .subcategory-li-item {
  margin-bottom: 18px;
}
.section-trivia.trivia-cat .ul-left-container {
  float: left;
  margin-right: 4%;
  width: 48%;
  list-style-type: none;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .ul-left-container {
    float: none;
    width: 100%;
  }
}
.section-trivia.trivia-cat .ul-left-container .left {
  list-style-type: none;
  line-height: 30px;
  margin-bottom: 20px;
}
.section-trivia.trivia-cat .ul-right-container {
  float: left;
  width: 48%;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .section-trivia.trivia-cat .ul-right-container {
    float: none;
    width: 100%;
  }
}
.section-trivia.trivia-cat .ul-right-container .right {
  list-style-type: none;
  line-height: 30px;
  margin-bottom: 20px;
}
.section-trivia.trivia-cat .pagination-centered {
  text-align: center;
  top: -20px;
  position: relative;
  left: 10px;
}
.section-trivia.trivia-cat .pagination-centered .item-list ul.pagination {
  border-top: 1px solid #CBCBCB;
  padding-top: 20px;
  list-style: none;
  font-weight: bold;
  font-style: normal;
  color: #222;
  font-size: 20px;
  line-height: 1;
  margin: 0;
  width: 95%;
}
.section-trivia.trivia-cat .pagination-centered .item-list ul.pagination li a {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 700;
  font-size: 1.125rem;
  color: #000000;
  padding: 4px 10px;
  width: 33px;
  height: 33px;
}
.section-trivia.trivia-cat .pagination-centered .item-list ul.pagination li.active-page a {
  background-color: initial;
  color: #FFFFFF;
  background: #000000;
  -webkit-border-radius: 50%;
}

.trivia-cat #all-quiz-quiz-wrapper {
  padding: 10px;
  margin-top: 25px;
  margin-bottom: 25px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .trivia-cat #all-quiz-quiz-wrapper {
    margin-top: 0;
  }
}
.trivia-cat .all-section-header {
  border-bottom: 4px solid black;
  position: relative;
  margin-bottom: 30px;
}
.trivia-cat .all-section-header h2 {
  color: #222;
  font-weight: bold;
  font-family: "Amasis MT";
  font-size: 20px;
  line-height: 1;
  margin: 0;
  width: 50%;
  display: inline-block;
  float: left;
  text-transform: uppercase;
  margin-top: 47px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .trivia-cat .all-section-header h2 {
    margin-top: 0;
  }
}
.trivia-cat span.sort-by {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #6B6B6B;
  font-size: 15px;
  display: inline-block;
  margin-right: 2px;
}
.trivia-cat #category-sort {
  color: #000000;
  background-color: transparent;
  border: none;
  display: inline-block;
  width: 110px;
  font-size: 15px;
  -webkit-appearance: none;
  position: relative;
}
.trivia-cat a.subcategory-block-link {
  font-family: Georgia;
  color: #000000;
  font-size: 17px;
  line-height: 28px;
}

.trivia-cat.page-taxonomy-term .block-text-separator {
  display: block;
  padding-bottom: 0;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .trivia-cat.page-taxonomy-term .block-text-separator {
    display: none;
    left: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .trivia-cat.page-taxonomy-term .block-text-separator {
    display: block;
  }
}

.trivia-cat #show-more-button {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 17px;
  background-color: #F59E24;
  color: #fff;
  padding: 16px 20px 14px;
  margin: 31px auto 0;
  line-height: 20px;
  text-align: center;
  width: 108%;
  max-width: 157px;
  border-radius: 6px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .trivia-cat #show-more-button {
    clear: both;
    background: #FFF;
    padding-top: 1px;
    font-size: 17px;
    height: 72px;
    border-bottom-right-radius: 8px;
    top: -29px;
    position: relative;
    right: 20px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .trivia-cat #show-more-button {
    clear: both;
    background: #FFF;
    margin-top: 0;
    padding-top: 0;
    font-size: 17px;
    height: 0;
    border-bottom-right-radius: 8px;
    top: -23px;
    position: relative;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  body.logged-in .category-sidebar-nav,
body.logged-in div#block-triviacategories {
    top: 25px;
    position: relative;
  }
}

.block-projectcuriously-custom-cmc-category-sidebar,
.pane-cmatgame-trivia-trivia-navigation,
div#block-triviacategories {
  border-radius: 8px;
  width: 97%;
  position: relative;
  left: 5px;
  height: 430px;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .block-projectcuriously-custom-cmc-category-sidebar,
.pane-cmatgame-trivia-trivia-navigation,
div#block-triviacategories {
    top: -10px;
    width: 0;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  .block-projectcuriously-custom-cmc-category-sidebar,
.pane-cmatgame-trivia-trivia-navigation,
div#block-triviacategories {
    top: -10px;
    width: 0;
    left: 5px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) {
  .block-projectcuriously-custom-cmc-category-sidebar,
.pane-cmatgame-trivia-trivia-navigation,
div#block-triviacategories {
    display: none;
  }
}

.block-projectcuriously-custom-cmc-category-sidebar,
.category-sidebar-nav,
.pane-cmatgame-trivia-trivia-navigation,
.triviacategory {
  border-radius: 8px;
  width: 285px;
  margin-bottom: 15px;
}
.block-projectcuriously-custom-cmc-category-sidebar .sidebar-header,
.category-sidebar-nav .sidebar-header,
.pane-cmatgame-trivia-trivia-navigation .sidebar-header,
.triviacategory .sidebar-header {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  height: 30px;
  background-color: #e39322;
  color: #FFFFFF;
}
.block-projectcuriously-custom-cmc-category-sidebar .sidebar-header h3.trivia-sidebar-header,
.category-sidebar-nav .sidebar-header h3.trivia-sidebar-header,
.pane-cmatgame-trivia-trivia-navigation .sidebar-header h3.trivia-sidebar-header,
.triviacategory .sidebar-header h3.trivia-sidebar-header {
  font-size: 15px;
  text-transform: uppercase;
  line-height: 10px;
  padding-left: 20px;
  letter-spacing: 0.03em;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: bold;
  text-decoration: none;
  padding: 12px 20px 10px;
  width: 291px;
  left: -5px;
}

.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.arts-accordian-navigation {
  height: 42px;
}

.category-sidebar-nav dl dd.open .link-section a.show-subcategories .fa-plus {
  display: none;
}

.accordian-navigation .link-section:hover {
  background: #45D59F;
  position: relative;
}

.arts-accordion-navigation .link-section:hover {
  background: #45D59F !important;
  position: relative;
}

.category-sidebar-nav dl dd .link-section a.show-subcategories .fa-minus {
  display: none;
}

.category-sidebar-nav dl dd.open .link-section a.show-subcategories {
  display: inline-block;
  background-color: #45D59F;
  color: #FFF;
}

.category-sidebar-nav dl dd.open .link-section a.arts-entertainment {
  background-color: #45D59F;
  color: #FFF;
}

.category-sidebar-nav dl dd .link-section a.subcat-parent {
  color: #45D59F;
}
.category-sidebar-nav dl dd .link-section a.subcat-parent:active, .category-sidebar-nav dl dd .link-section a.subcat-parent:hover {
  background-color: #45D59F;
}

.category-sidebar-nav dl dd.arts-accordion-navigation .subcategory:active, .category-sidebar-nav dl dd.arts-accordion-navigation .subcategory:hover {
  color: #FFF;
}

.fa-plus:before {
  content: "";
}

.fa-minus:before {
  content: "";
}

.cmc-sub-category-hide {
  display: none;
}

.cmc-sub-category-show {
  display: block;
  background: rgba(202, 244, 228, 0.3);
}

.category-sidebar-nav {
  background: #FFFFFF;
}

.category-sidebar-nav dl dd .link-section {
  position: relative;
  border-bottom: 1px solid #D9D9D9;
}

.category-sidebar-nav dl dd .link-section a {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-decoration: none;
  font-size: 15px;
  line-height: 17px;
  font-weight: bold;
  display: block;
  padding: 12px 20px 10px;
}

.show-subcategories ul {
  list-style: none;
}

.category-sidebar-nav dl dd .show-subcategories ul li {
  list-style-type: none;
  background: rgba(202, 244, 228, 0.3);
}

.category-sidebar-nav dl {
  margin-bottom: 0;
  margin-top: 0;
  position: relative;
  top: -4px;
}
.category-sidebar-nav dl dd {
  margin-bottom: 0;
}
.category-sidebar-nav dl dd .link-section {
  position: relative;
  border-bottom: 1px solid #D9D9D9;
}
.category-sidebar-nav dl dd .link-section a {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #6B6B6B;
  text-decoration: none;
  font-size: 15px;
  line-height: 17px;
  font-weight: bold;
  display: block;
  padding: 12px 20px 10px;
}
.category-sidebar-nav dl dd .link-section a.category-link {
  margin-right: 30px;
}
.category-sidebar-nav dl dd .link-section a.show-subcategories {
  position: absolute;
  top: 0;
  right: 0;
  height: 17px;
}
.category-sidebar-nav dl dd .link-section a.show-subcategories .fa-minus {
  display: none;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 1024px) {
  .category-sidebar-nav dl dd .link-section:hover a:not(.mobile) {
    color: inherit;
  }
}
.category-sidebar-nav dl dd .link-section.active {
  position: relative;
  margin-left: -12px;
  border-bottom: 0;
}
.category-sidebar-nav dl dd .link-section.active a {
  color: #FFFFFF !important;
}
.category-sidebar-nav dl dd .link-section.active:after, .category-sidebar-nav dl dd .link-section.active:before {
  content: "";
  position: absolute;
  width: 0;
  height: 3px;
  top: 0;
  left: 0;
  border-style: solid;
  border-width: 18px 12px 18px 0;
  border-color: #16202c transparent transparent transparent;
}
.category-sidebar-nav dl dd .link-section.active:after {
  border-color: transparent transparent #16202c transparent;
}
.category-sidebar-nav dl dd .link-section.active a {
  padding-left: 32px;
}
.category-sidebar-nav dl dd .content {
  display: none;
}
.category-sidebar-nav dl dd .content ul {
  margin-bottom: 0;
}
.category-sidebar-nav dl dd .content ul li {
  list-style-type: none;
  background: rgba(202, 244, 228, 0.3);
}
.category-sidebar-nav dl dd .content ul li a {
  font-weight: normal;
}
.category-sidebar-nav dl dd:last-child .link-section {
  border-bottom: 0;
}
.category-sidebar-nav dl dd.open .link-section a.show-subcategories .fa-minus {
  display: inline-block;
}
.category-sidebar-nav dl dd.open .link-section a.show-subcategories .fa-plus {
  display: none;
}
.category-sidebar-nav dl dd.open .content {
  overflow: visible !important;
}
.category-sidebar-nav dl dd.open.current > .link-section a {
  color: #FFFFFF !important;
}
.category-sidebar-nav dl dd.open.current > .link-section a.show-subcategories .fa-minus {
  display: inline-block;
}
.category-sidebar-nav dl dd.open.current > .link-section a.show-subcategories .fa-plus {
  display: none;
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .node-type-quizitem section.block.block-projectcuriously-custom.block-projectcuriously-custom-cmc-category-sidebar {
    display: none;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  section.block.block-projectcuriously-custom.block-projectcuriously-custom-cmc-category-sidebar.block-odd.clearfix {
    margin-bottom: 0;
  }
}

.trivia-cat .triviacategory {
  display: inline-block;
}

.node-type-quizitem .triviacategory {
  display: none;
}

.pane-cmatgame-trivia-trivia-navigation {
  background: transparent;
}

.confettiContainer {
  position: absolute;
  clear: both;
  position: absolute;
  clear: both;
  width: 600px;
  top: 55px;
}

@media only screen and (min-width: 20.01em) and (max-width: 39.9375em) {
  .confettiContainer {
    top: 44px;
  }
}
@-webkit-keyframes bang {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@-moz-keyframes bang {
  from {
    -moz-transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
@keyframes bang {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}
.confettiBar {
  position: relative;
  float: left;
  background: transparent;
}

.confettiBar span {
  color: #333;
  font-size: 0.9em;
}

.confettiBar i {
  position: absolute;
  display: block;
  left: 50%;
  top: 0;
  width: 8px;
  height: 8px;
  background: red;
  opacity: 0;
  border-radius: 10px;
}

.confettiBar.hover i:nth-of-type(1) {
  -webkit-transform: translate3d(-50px, 191px, 0) rotate(165deg);
  -moz-transform: translate3d(-50px, 191px, 0) rotate(165deg);
  -ms-transform: translate3d(-50px, 191px, 0) rotate(165deg);
  -o-transform: translate3d(-50px, 191px, 0) rotate(165deg);
  transform: translate3d(-50px, 191px, 0) rotate(165deg);
  background: #ff0080;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(2) {
  -webkit-transform: translate3d(26px, 138px, 0) rotate(39deg);
  -moz-transform: translate3d(26px, 138px, 0) rotate(39deg);
  -ms-transform: translate3d(26px, 138px, 0) rotate(39deg);
  -o-transform: translate3d(26px, 138px, 0) rotate(39deg);
  transform: translate3d(26px, 138px, 0) rotate(39deg);
  background: #80ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(3) {
  -webkit-transform: translate3d(164px, -79px, 0) rotate(105deg);
  -moz-transform: translate3d(164px, -79px, 0) rotate(105deg);
  -ms-transform: translate3d(164px, -79px, 0) rotate(105deg);
  -o-transform: translate3d(164px, -79px, 0) rotate(105deg);
  transform: translate3d(164px, -79px, 0) rotate(105deg);
  background: #ff0033;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(4) {
  -webkit-transform: translate3d(-94px, 77px, 0) rotate(81deg);
  -moz-transform: translate3d(-94px, 77px, 0) rotate(81deg);
  -ms-transform: translate3d(-94px, 77px, 0) rotate(81deg);
  -o-transform: translate3d(-94px, 77px, 0) rotate(81deg);
  transform: translate3d(-94px, 77px, 0) rotate(81deg);
  background: red;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(5) {
  -webkit-transform: translate3d(-29px, 32px, 0) rotate(304deg);
  -moz-transform: translate3d(-29px, 32px, 0) rotate(304deg);
  -ms-transform: translate3d(-29px, 32px, 0) rotate(304deg);
  -o-transform: translate3d(-29px, 32px, 0) rotate(304deg);
  transform: translate3d(-29px, 32px, 0) rotate(304deg);
  background: #00ffbb;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(6) {
  -webkit-transform: translate3d(199px, 138px, 0) rotate(23deg);
  -moz-transform: translate3d(199px, 138px, 0) rotate(23deg);
  -ms-transform: translate3d(199px, 138px, 0) rotate(23deg);
  -o-transform: translate3d(199px, 138px, 0) rotate(23deg);
  transform: translate3d(199px, 138px, 0) rotate(23deg);
  background: #ff0062;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(7) {
  -webkit-transform: translate3d(18px, 94px, 0) rotate(33deg);
  -moz-transform: translate3d(18px, 94px, 0) rotate(33deg);
  -ms-transform: translate3d(18px, 94px, 0) rotate(33deg);
  -o-transform: translate3d(18px, 94px, 0) rotate(33deg);
  transform: translate3d(18px, 94px, 0) rotate(33deg);
  background: #00fbff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(8) {
  -webkit-transform: translate3d(86px, 117px, 0) rotate(39deg);
  -moz-transform: translate3d(86px, 117px, 0) rotate(39deg);
  -ms-transform: translate3d(86px, 117px, 0) rotate(39deg);
  -o-transform: translate3d(86px, 117px, 0) rotate(39deg);
  transform: translate3d(86px, 117px, 0) rotate(39deg);
  background: #44ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(9) {
  -webkit-transform: translate3d(125px, -18px, 0) rotate(142deg);
  -moz-transform: translate3d(125px, -18px, 0) rotate(142deg);
  -ms-transform: translate3d(125px, -18px, 0) rotate(142deg);
  -o-transform: translate3d(125px, -18px, 0) rotate(142deg);
  transform: translate3d(125px, -18px, 0) rotate(142deg);
  background: #ff7300;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(10) {
  -webkit-transform: translate3d(137px, 113px, 0) rotate(31deg);
  -moz-transform: translate3d(137px, 113px, 0) rotate(31deg);
  -ms-transform: translate3d(137px, 113px, 0) rotate(31deg);
  -o-transform: translate3d(137px, 113px, 0) rotate(31deg);
  transform: translate3d(137px, 113px, 0) rotate(31deg);
  background: #2f00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(11) {
  -webkit-transform: translate3d(41px, 9px, 0) rotate(301deg);
  -moz-transform: translate3d(41px, 9px, 0) rotate(301deg);
  -ms-transform: translate3d(41px, 9px, 0) rotate(301deg);
  -o-transform: translate3d(41px, 9px, 0) rotate(301deg);
  transform: translate3d(41px, 9px, 0) rotate(301deg);
  background: #00c4ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(12) {
  -webkit-transform: translate3d(-30px, 165px, 0) rotate(69deg);
  -moz-transform: translate3d(-30px, 165px, 0) rotate(69deg);
  -ms-transform: translate3d(-30px, 165px, 0) rotate(69deg);
  -o-transform: translate3d(-30px, 165px, 0) rotate(69deg);
  transform: translate3d(-30px, 165px, 0) rotate(69deg);
  background: #ff0073;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(13) {
  -webkit-transform: translate3d(140px, 147px, 0) rotate(134deg);
  -moz-transform: translate3d(140px, 147px, 0) rotate(134deg);
  -ms-transform: translate3d(140px, 147px, 0) rotate(134deg);
  -o-transform: translate3d(140px, 147px, 0) rotate(134deg);
  transform: translate3d(140px, 147px, 0) rotate(134deg);
  background: #dd00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(14) {
  -webkit-transform: translate3d(144px, 60px, 0) rotate(38deg);
  -moz-transform: translate3d(144px, 60px, 0) rotate(38deg);
  -ms-transform: translate3d(144px, 60px, 0) rotate(38deg);
  -o-transform: translate3d(144px, 60px, 0) rotate(38deg);
  transform: translate3d(144px, 60px, 0) rotate(38deg);
  background: #ff00fb;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(15) {
  -webkit-transform: translate3d(147px, 57px, 0) rotate(76deg);
  -moz-transform: translate3d(147px, 57px, 0) rotate(76deg);
  -ms-transform: translate3d(147px, 57px, 0) rotate(76deg);
  -o-transform: translate3d(147px, 57px, 0) rotate(76deg);
  transform: translate3d(147px, 57px, 0) rotate(76deg);
  background: #0066ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(16) {
  -webkit-transform: translate3d(67px, 158px, 0) rotate(265deg);
  -moz-transform: translate3d(67px, 158px, 0) rotate(265deg);
  -ms-transform: translate3d(67px, 158px, 0) rotate(265deg);
  -o-transform: translate3d(67px, 158px, 0) rotate(265deg);
  transform: translate3d(67px, 158px, 0) rotate(265deg);
  background: lime;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(17) {
  -webkit-transform: translate3d(161px, 140px, 0) rotate(108deg);
  -moz-transform: translate3d(161px, 140px, 0) rotate(108deg);
  -ms-transform: translate3d(161px, 140px, 0) rotate(108deg);
  -o-transform: translate3d(161px, 140px, 0) rotate(108deg);
  transform: translate3d(161px, 140px, 0) rotate(108deg);
  background: #00fbff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(18) {
  -webkit-transform: translate3d(-41px, -84px, 0) rotate(146deg);
  -moz-transform: translate3d(-41px, -84px, 0) rotate(146deg);
  -ms-transform: translate3d(-41px, -84px, 0) rotate(146deg);
  -o-transform: translate3d(-41px, -84px, 0) rotate(146deg);
  transform: translate3d(-41px, -84px, 0) rotate(146deg);
  background: #ff0009;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(19) {
  -webkit-transform: translate3d(175px, 46px, 0) rotate(100deg);
  -moz-transform: translate3d(175px, 46px, 0) rotate(100deg);
  -ms-transform: translate3d(175px, 46px, 0) rotate(100deg);
  -o-transform: translate3d(175px, 46px, 0) rotate(100deg);
  transform: translate3d(175px, 46px, 0) rotate(100deg);
  background: #73ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(20) {
  -webkit-transform: translate3d(-56px, 54px, 0) rotate(64deg);
  -moz-transform: translate3d(-56px, 54px, 0) rotate(64deg);
  -ms-transform: translate3d(-56px, 54px, 0) rotate(64deg);
  -o-transform: translate3d(-56px, 54px, 0) rotate(64deg);
  transform: translate3d(-56px, 54px, 0) rotate(64deg);
  background: #00ddff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(21) {
  -webkit-transform: translate3d(34px, 136px, 0) rotate(352deg);
  -moz-transform: translate3d(34px, 136px, 0) rotate(352deg);
  -ms-transform: translate3d(34px, 136px, 0) rotate(352deg);
  -o-transform: translate3d(34px, 136px, 0) rotate(352deg);
  transform: translate3d(34px, 136px, 0) rotate(352deg);
  background: #0004ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(22) {
  -webkit-transform: translate3d(-59px, 177px, 0) rotate(307deg);
  -moz-transform: translate3d(-59px, 177px, 0) rotate(307deg);
  -ms-transform: translate3d(-59px, 177px, 0) rotate(307deg);
  -o-transform: translate3d(-59px, 177px, 0) rotate(307deg);
  transform: translate3d(-59px, 177px, 0) rotate(307deg);
  background: #008cff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(23) {
  -webkit-transform: translate3d(24px, -32px, 0) rotate(65deg);
  -moz-transform: translate3d(24px, -32px, 0) rotate(65deg);
  -ms-transform: translate3d(24px, -32px, 0) rotate(65deg);
  -o-transform: translate3d(24px, -32px, 0) rotate(65deg);
  transform: translate3d(24px, -32px, 0) rotate(65deg);
  background: #59ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(24) {
  -webkit-transform: translate3d(-83px, -59px, 0) rotate(59deg);
  -moz-transform: translate3d(-83px, -59px, 0) rotate(59deg);
  -ms-transform: translate3d(-83px, -59px, 0) rotate(59deg);
  -o-transform: translate3d(-83px, -59px, 0) rotate(59deg);
  transform: translate3d(-83px, -59px, 0) rotate(59deg);
  background: #ff002b;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(25) {
  -webkit-transform: translate3d(14px, 187px, 0) rotate(325deg);
  -moz-transform: translate3d(14px, 187px, 0) rotate(325deg);
  -ms-transform: translate3d(14px, 187px, 0) rotate(325deg);
  -o-transform: translate3d(14px, 187px, 0) rotate(325deg);
  transform: translate3d(14px, 187px, 0) rotate(325deg);
  background: lime;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(26) {
  -webkit-transform: translate3d(177px, 122px, 0) rotate(235deg);
  -moz-transform: translate3d(177px, 122px, 0) rotate(235deg);
  -ms-transform: translate3d(177px, 122px, 0) rotate(235deg);
  -o-transform: translate3d(177px, 122px, 0) rotate(235deg);
  transform: translate3d(177px, 122px, 0) rotate(235deg);
  background: #00ffc4;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(27) {
  -webkit-transform: translate3d(171px, 172px, 0) rotate(192deg);
  -moz-transform: translate3d(171px, 172px, 0) rotate(192deg);
  -ms-transform: translate3d(171px, 172px, 0) rotate(192deg);
  -o-transform: translate3d(171px, 172px, 0) rotate(192deg);
  transform: translate3d(171px, 172px, 0) rotate(192deg);
  background: #73ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(28) {
  -webkit-transform: translate3d(-5px, 24px, 0) rotate(174deg);
  -moz-transform: translate3d(-5px, 24px, 0) rotate(174deg);
  -ms-transform: translate3d(-5px, 24px, 0) rotate(174deg);
  -o-transform: translate3d(-5px, 24px, 0) rotate(174deg);
  transform: translate3d(-5px, 24px, 0) rotate(174deg);
  background: #00ffd0;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(29) {
  -webkit-transform: translate3d(39px, 140px, 0) rotate(7deg);
  -moz-transform: translate3d(39px, 140px, 0) rotate(7deg);
  -ms-transform: translate3d(39px, 140px, 0) rotate(7deg);
  -o-transform: translate3d(39px, 140px, 0) rotate(7deg);
  transform: translate3d(39px, 140px, 0) rotate(7deg);
  background: #33ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(30) {
  -webkit-transform: translate3d(165px, -94px, 0) rotate(116deg);
  -moz-transform: translate3d(165px, -94px, 0) rotate(116deg);
  -ms-transform: translate3d(165px, -94px, 0) rotate(116deg);
  -o-transform: translate3d(165px, -94px, 0) rotate(116deg);
  transform: translate3d(165px, -94px, 0) rotate(116deg);
  background: #ff5900;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(31) {
  -webkit-transform: translate3d(-56px, 18px, 0) rotate(178deg);
  -moz-transform: translate3d(-56px, 18px, 0) rotate(178deg);
  -ms-transform: translate3d(-56px, 18px, 0) rotate(178deg);
  -o-transform: translate3d(-56px, 18px, 0) rotate(178deg);
  transform: translate3d(-56px, 18px, 0) rotate(178deg);
  background: #00ff6f;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(32) {
  -webkit-transform: translate3d(108px, -37px, 0) rotate(125deg);
  -moz-transform: translate3d(108px, -37px, 0) rotate(125deg);
  -ms-transform: translate3d(108px, -37px, 0) rotate(125deg);
  -o-transform: translate3d(108px, -37px, 0) rotate(125deg);
  transform: translate3d(108px, -37px, 0) rotate(125deg);
  background: #00ffbf;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(33) {
  -webkit-transform: translate3d(35px, 2px, 0) rotate(136deg);
  -moz-transform: translate3d(35px, 2px, 0) rotate(136deg);
  -ms-transform: translate3d(35px, 2px, 0) rotate(136deg);
  -o-transform: translate3d(35px, 2px, 0) rotate(136deg);
  transform: translate3d(35px, 2px, 0) rotate(136deg);
  background: #88ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(34) {
  -webkit-transform: translate3d(161px, -24px, 0) rotate(140deg);
  -moz-transform: translate3d(161px, -24px, 0) rotate(140deg);
  -ms-transform: translate3d(161px, -24px, 0) rotate(140deg);
  -o-transform: translate3d(161px, -24px, 0) rotate(140deg);
  transform: translate3d(161px, -24px, 0) rotate(140deg);
  background: #00f7ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(35) {
  -webkit-transform: translate3d(37px, 199px, 0) rotate(239deg);
  -moz-transform: translate3d(37px, 199px, 0) rotate(239deg);
  -ms-transform: translate3d(37px, 199px, 0) rotate(239deg);
  -o-transform: translate3d(37px, 199px, 0) rotate(239deg);
  transform: translate3d(37px, 199px, 0) rotate(239deg);
  background: #00c8ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(36) {
  -webkit-transform: translate3d(-25px, 157px, 0) rotate(257deg);
  -moz-transform: translate3d(-25px, 157px, 0) rotate(257deg);
  -ms-transform: translate3d(-25px, 157px, 0) rotate(257deg);
  -o-transform: translate3d(-25px, 157px, 0) rotate(257deg);
  transform: translate3d(-25px, 157px, 0) rotate(257deg);
  background: #59ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(37) {
  -webkit-transform: translate3d(56px, 30px, 0) rotate(161deg);
  -moz-transform: translate3d(56px, 30px, 0) rotate(161deg);
  -ms-transform: translate3d(56px, 30px, 0) rotate(161deg);
  -o-transform: translate3d(56px, 30px, 0) rotate(161deg);
  transform: translate3d(56px, 30px, 0) rotate(161deg);
  background: #1aff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(38) {
  -webkit-transform: translate3d(-3px, -16px, 0) rotate(72deg);
  -moz-transform: translate3d(-3px, -16px, 0) rotate(72deg);
  -ms-transform: translate3d(-3px, -16px, 0) rotate(72deg);
  -o-transform: translate3d(-3px, -16px, 0) rotate(72deg);
  transform: translate3d(-3px, -16px, 0) rotate(72deg);
  background: #b700ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(39) {
  -webkit-transform: translate3d(89px, -52px, 0) rotate(46deg);
  -moz-transform: translate3d(89px, -52px, 0) rotate(46deg);
  -ms-transform: translate3d(89px, -52px, 0) rotate(46deg);
  -o-transform: translate3d(89px, -52px, 0) rotate(46deg);
  transform: translate3d(89px, -52px, 0) rotate(46deg);
  background: #ff008c;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(40) {
  -webkit-transform: translate3d(171px, 195px, 0) rotate(273deg);
  -moz-transform: translate3d(171px, 195px, 0) rotate(273deg);
  -ms-transform: translate3d(171px, 195px, 0) rotate(273deg);
  -o-transform: translate3d(171px, 195px, 0) rotate(273deg);
  transform: translate3d(171px, 195px, 0) rotate(273deg);
  background: #ff00a6;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(41) {
  -webkit-transform: translate3d(-4px, 176px, 0) rotate(67deg);
  -moz-transform: translate3d(-4px, 176px, 0) rotate(67deg);
  -ms-transform: translate3d(-4px, 176px, 0) rotate(67deg);
  -o-transform: translate3d(-4px, 176px, 0) rotate(67deg);
  transform: translate3d(-4px, 176px, 0) rotate(67deg);
  background: #ffc800;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(42) {
  -webkit-transform: translate3d(182px, 102px, 0) rotate(193deg);
  -moz-transform: translate3d(182px, 102px, 0) rotate(193deg);
  -ms-transform: translate3d(182px, 102px, 0) rotate(193deg);
  -o-transform: translate3d(182px, 102px, 0) rotate(193deg);
  transform: translate3d(182px, 102px, 0) rotate(193deg);
  background: #a200ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(43) {
  -webkit-transform: translate3d(81px, -88px, 0) rotate(293deg);
  -moz-transform: translate3d(81px, -88px, 0) rotate(293deg);
  -ms-transform: translate3d(81px, -88px, 0) rotate(293deg);
  -o-transform: translate3d(81px, -88px, 0) rotate(293deg);
  transform: translate3d(81px, -88px, 0) rotate(293deg);
  background: #00ffaa;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(44) {
  -webkit-transform: translate3d(14px, -90px, 0) rotate(150deg);
  -moz-transform: translate3d(14px, -90px, 0) rotate(150deg);
  -ms-transform: translate3d(14px, -90px, 0) rotate(150deg);
  -o-transform: translate3d(14px, -90px, 0) rotate(150deg);
  transform: translate3d(14px, -90px, 0) rotate(150deg);
  background: #9d00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(45) {
  -webkit-transform: translate3d(-15px, -43px, 0) rotate(251deg);
  -moz-transform: translate3d(-15px, -43px, 0) rotate(251deg);
  -ms-transform: translate3d(-15px, -43px, 0) rotate(251deg);
  -o-transform: translate3d(-15px, -43px, 0) rotate(251deg);
  transform: translate3d(-15px, -43px, 0) rotate(251deg);
  background: #dd00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(46) {
  -webkit-transform: translate3d(-11px, 97px, 0) rotate(150deg);
  -moz-transform: translate3d(-11px, 97px, 0) rotate(150deg);
  -ms-transform: translate3d(-11px, 97px, 0) rotate(150deg);
  -o-transform: translate3d(-11px, 97px, 0) rotate(150deg);
  transform: translate3d(-11px, 97px, 0) rotate(150deg);
  background: #ff0084;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(47) {
  -webkit-transform: translate3d(162px, -84px, 0) rotate(202deg);
  -moz-transform: translate3d(162px, -84px, 0) rotate(202deg);
  -ms-transform: translate3d(162px, -84px, 0) rotate(202deg);
  -o-transform: translate3d(162px, -84px, 0) rotate(202deg);
  transform: translate3d(162px, -84px, 0) rotate(202deg);
  background: blue;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(48) {
  -webkit-transform: translate3d(-82px, 147px, 0) rotate(292deg);
  -moz-transform: translate3d(-82px, 147px, 0) rotate(292deg);
  -ms-transform: translate3d(-82px, 147px, 0) rotate(292deg);
  -o-transform: translate3d(-82px, 147px, 0) rotate(292deg);
  transform: translate3d(-82px, 147px, 0) rotate(292deg);
  background: #d500ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(49) {
  -webkit-transform: translate3d(196px, 177px, 0) rotate(247deg);
  -moz-transform: translate3d(196px, 177px, 0) rotate(247deg);
  -ms-transform: translate3d(196px, 177px, 0) rotate(247deg);
  -o-transform: translate3d(196px, 177px, 0) rotate(247deg);
  transform: translate3d(196px, 177px, 0) rotate(247deg);
  background: #ff5100;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(50) {
  -webkit-transform: translate3d(190px, 38px, 0) rotate(106deg);
  -moz-transform: translate3d(190px, 38px, 0) rotate(106deg);
  -ms-transform: translate3d(190px, 38px, 0) rotate(106deg);
  -o-transform: translate3d(190px, 38px, 0) rotate(106deg);
  transform: translate3d(190px, 38px, 0) rotate(106deg);
  background: #ff0d00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(51) {
  -webkit-transform: translate3d(52px, -33px, 0) rotate(135deg);
  -moz-transform: translate3d(52px, -33px, 0) rotate(135deg);
  -ms-transform: translate3d(52px, -33px, 0) rotate(135deg);
  -o-transform: translate3d(52px, -33px, 0) rotate(135deg);
  transform: translate3d(52px, -33px, 0) rotate(135deg);
  background: #fb00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(52) {
  -webkit-transform: translate3d(96px, -47px, 0) rotate(321deg);
  -moz-transform: translate3d(96px, -47px, 0) rotate(321deg);
  -ms-transform: translate3d(96px, -47px, 0) rotate(321deg);
  -o-transform: translate3d(96px, -47px, 0) rotate(321deg);
  transform: translate3d(96px, -47px, 0) rotate(321deg);
  background: #00ff33;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(53) {
  -webkit-transform: translate3d(158px, 111px, 0) rotate(114deg);
  -moz-transform: translate3d(158px, 111px, 0) rotate(114deg);
  -ms-transform: translate3d(158px, 111px, 0) rotate(114deg);
  -o-transform: translate3d(158px, 111px, 0) rotate(114deg);
  transform: translate3d(158px, 111px, 0) rotate(114deg);
  background: #00ffc4;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(54) {
  -webkit-transform: translate3d(64px, -36px, 0) rotate(117deg);
  -moz-transform: translate3d(64px, -36px, 0) rotate(117deg);
  -ms-transform: translate3d(64px, -36px, 0) rotate(117deg);
  -o-transform: translate3d(64px, -36px, 0) rotate(117deg);
  transform: translate3d(64px, -36px, 0) rotate(117deg);
  background: #0400ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(55) {
  -webkit-transform: translate3d(111px, 72px, 0) rotate(145deg);
  -moz-transform: translate3d(111px, 72px, 0) rotate(145deg);
  -ms-transform: translate3d(111px, 72px, 0) rotate(145deg);
  -o-transform: translate3d(111px, 72px, 0) rotate(145deg);
  transform: translate3d(111px, 72px, 0) rotate(145deg);
  background: #ff0062;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(56) {
  -webkit-transform: translate3d(-92px, -35px, 0) rotate(120deg);
  -moz-transform: translate3d(-92px, -35px, 0) rotate(120deg);
  -ms-transform: translate3d(-92px, -35px, 0) rotate(120deg);
  -o-transform: translate3d(-92px, -35px, 0) rotate(120deg);
  transform: translate3d(-92px, -35px, 0) rotate(120deg);
  background: #ffaa00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(57) {
  -webkit-transform: translate3d(200px, -13px, 0) rotate(341deg);
  -moz-transform: translate3d(200px, -13px, 0) rotate(341deg);
  -ms-transform: translate3d(200px, -13px, 0) rotate(341deg);
  -o-transform: translate3d(200px, -13px, 0) rotate(341deg);
  transform: translate3d(200px, -13px, 0) rotate(341deg);
  background: #ff00d0;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(58) {
  -webkit-transform: translate3d(21px, 86px, 0) rotate(171deg);
  -moz-transform: translate3d(21px, 86px, 0) rotate(171deg);
  -ms-transform: translate3d(21px, 86px, 0) rotate(171deg);
  -o-transform: translate3d(21px, 86px, 0) rotate(171deg);
  transform: translate3d(21px, 86px, 0) rotate(171deg);
  background: lime;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(59) {
  -webkit-transform: translate3d(40px, 169px, 0) rotate(253deg);
  -moz-transform: translate3d(40px, 169px, 0) rotate(253deg);
  -ms-transform: translate3d(40px, 169px, 0) rotate(253deg);
  -o-transform: translate3d(40px, 169px, 0) rotate(253deg);
  transform: translate3d(40px, 169px, 0) rotate(253deg);
  background: #e100ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(60) {
  -webkit-transform: translate3d(-1px, -56px, 0) rotate(228deg);
  -moz-transform: translate3d(-1px, -56px, 0) rotate(228deg);
  -ms-transform: translate3d(-1px, -56px, 0) rotate(228deg);
  -o-transform: translate3d(-1px, -56px, 0) rotate(228deg);
  transform: translate3d(-1px, -56px, 0) rotate(228deg);
  background: #a600ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(61) {
  -webkit-transform: translate3d(-4px, -72px, 0) rotate(210deg);
  -moz-transform: translate3d(-4px, -72px, 0) rotate(210deg);
  -ms-transform: translate3d(-4px, -72px, 0) rotate(210deg);
  -o-transform: translate3d(-4px, -72px, 0) rotate(210deg);
  transform: translate3d(-4px, -72px, 0) rotate(210deg);
  background: #d500ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(62) {
  -webkit-transform: translate3d(20px, 52px, 0) rotate(145deg);
  -moz-transform: translate3d(20px, 52px, 0) rotate(145deg);
  -ms-transform: translate3d(20px, 52px, 0) rotate(145deg);
  -o-transform: translate3d(20px, 52px, 0) rotate(145deg);
  transform: translate3d(20px, 52px, 0) rotate(145deg);
  background: #40ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(63) {
  -webkit-transform: translate3d(191px, 48px, 0) rotate(259deg);
  -moz-transform: translate3d(191px, 48px, 0) rotate(259deg);
  -ms-transform: translate3d(191px, 48px, 0) rotate(259deg);
  -o-transform: translate3d(191px, 48px, 0) rotate(259deg);
  transform: translate3d(191px, 48px, 0) rotate(259deg);
  background: #ff002f;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(64) {
  -webkit-transform: translate3d(-74px, -89px, 0) rotate(221deg);
  -moz-transform: translate3d(-74px, -89px, 0) rotate(221deg);
  -ms-transform: translate3d(-74px, -89px, 0) rotate(221deg);
  -o-transform: translate3d(-74px, -89px, 0) rotate(221deg);
  transform: translate3d(-74px, -89px, 0) rotate(221deg);
  background: #ff2b00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(65) {
  -webkit-transform: translate3d(-84px, -26px, 0) rotate(278deg);
  -moz-transform: translate3d(-84px, -26px, 0) rotate(278deg);
  -ms-transform: translate3d(-84px, -26px, 0) rotate(278deg);
  -o-transform: translate3d(-84px, -26px, 0) rotate(278deg);
  transform: translate3d(-84px, -26px, 0) rotate(278deg);
  background: #00ff88;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(66) {
  -webkit-transform: translate3d(194px, 75px, 0) rotate(156deg);
  -moz-transform: translate3d(194px, 75px, 0) rotate(156deg);
  -ms-transform: translate3d(194px, 75px, 0) rotate(156deg);
  -o-transform: translate3d(194px, 75px, 0) rotate(156deg);
  transform: translate3d(194px, 75px, 0) rotate(156deg);
  background: #ff6200;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(67) {
  -webkit-transform: translate3d(-31px, 92px, 0) rotate(13deg);
  -moz-transform: translate3d(-31px, 92px, 0) rotate(13deg);
  -ms-transform: translate3d(-31px, 92px, 0) rotate(13deg);
  -o-transform: translate3d(-31px, 92px, 0) rotate(13deg);
  transform: translate3d(-31px, 92px, 0) rotate(13deg);
  background: #bfff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(68) {
  -webkit-transform: translate3d(133px, 25px, 0) rotate(176deg);
  -moz-transform: translate3d(133px, 25px, 0) rotate(176deg);
  -ms-transform: translate3d(133px, 25px, 0) rotate(176deg);
  -o-transform: translate3d(133px, 25px, 0) rotate(176deg);
  transform: translate3d(133px, 25px, 0) rotate(176deg);
  background: #ffaa00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(69) {
  -webkit-transform: translate3d(-38px, -34px, 0) rotate(205deg);
  -moz-transform: translate3d(-38px, -34px, 0) rotate(205deg);
  -ms-transform: translate3d(-38px, -34px, 0) rotate(205deg);
  -o-transform: translate3d(-38px, -34px, 0) rotate(205deg);
  transform: translate3d(-38px, -34px, 0) rotate(205deg);
  background: #ff6200;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(70) {
  -webkit-transform: translate3d(137px, 18px, 0) rotate(106deg);
  -moz-transform: translate3d(137px, 18px, 0) rotate(106deg);
  -ms-transform: translate3d(137px, 18px, 0) rotate(106deg);
  -o-transform: translate3d(137px, 18px, 0) rotate(106deg);
  transform: translate3d(137px, 18px, 0) rotate(106deg);
  background: #9100ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(71) {
  -webkit-transform: translate3d(55px, -27px, 0) rotate(262deg);
  -moz-transform: translate3d(55px, -27px, 0) rotate(262deg);
  -ms-transform: translate3d(55px, -27px, 0) rotate(262deg);
  -o-transform: translate3d(55px, -27px, 0) rotate(262deg);
  transform: translate3d(55px, -27px, 0) rotate(262deg);
  background: #9100ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(72) {
  -webkit-transform: translate3d(-62px, -9px, 0) rotate(112deg);
  -moz-transform: translate3d(-62px, -9px, 0) rotate(112deg);
  -ms-transform: translate3d(-62px, -9px, 0) rotate(112deg);
  -o-transform: translate3d(-62px, -9px, 0) rotate(112deg);
  transform: translate3d(-62px, -9px, 0) rotate(112deg);
  background: #ff00ae;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(73) {
  -webkit-transform: translate3d(188px, -64px, 0) rotate(241deg);
  -moz-transform: translate3d(188px, -64px, 0) rotate(241deg);
  -ms-transform: translate3d(188px, -64px, 0) rotate(241deg);
  -o-transform: translate3d(188px, -64px, 0) rotate(241deg);
  transform: translate3d(188px, -64px, 0) rotate(241deg);
  background: #d5ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(74) {
  -webkit-transform: translate3d(116px, 98px, 0) rotate(126deg);
  -moz-transform: translate3d(116px, 98px, 0) rotate(126deg);
  -ms-transform: translate3d(116px, 98px, 0) rotate(126deg);
  -o-transform: translate3d(116px, 98px, 0) rotate(126deg);
  transform: translate3d(116px, 98px, 0) rotate(126deg);
  background: #003cff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(75) {
  -webkit-transform: translate3d(6px, 101px, 0) rotate(154deg);
  -moz-transform: translate3d(6px, 101px, 0) rotate(154deg);
  -ms-transform: translate3d(6px, 101px, 0) rotate(154deg);
  -o-transform: translate3d(6px, 101px, 0) rotate(154deg);
  transform: translate3d(6px, 101px, 0) rotate(154deg);
  background: #73ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(76) {
  -webkit-transform: translate3d(91px, -12px, 0) rotate(353deg);
  -moz-transform: translate3d(91px, -12px, 0) rotate(353deg);
  -ms-transform: translate3d(91px, -12px, 0) rotate(353deg);
  -o-transform: translate3d(91px, -12px, 0) rotate(353deg);
  transform: translate3d(91px, -12px, 0) rotate(353deg);
  background: #0084ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(77) {
  -webkit-transform: translate3d(-41px, -43px, 0) rotate(357deg);
  -moz-transform: translate3d(-41px, -43px, 0) rotate(357deg);
  -ms-transform: translate3d(-41px, -43px, 0) rotate(357deg);
  -o-transform: translate3d(-41px, -43px, 0) rotate(357deg);
  transform: translate3d(-41px, -43px, 0) rotate(357deg);
  background: #a2ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(78) {
  -webkit-transform: translate3d(116px, 139px, 0) rotate(68deg);
  -moz-transform: translate3d(116px, 139px, 0) rotate(68deg);
  -ms-transform: translate3d(116px, 139px, 0) rotate(68deg);
  -o-transform: translate3d(116px, 139px, 0) rotate(68deg);
  transform: translate3d(116px, 139px, 0) rotate(68deg);
  background: #ff0059;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(79) {
  -webkit-transform: translate3d(-52px, -9px, 0) rotate(251deg);
  -moz-transform: translate3d(-52px, -9px, 0) rotate(251deg);
  -ms-transform: translate3d(-52px, -9px, 0) rotate(251deg);
  -o-transform: translate3d(-52px, -9px, 0) rotate(251deg);
  transform: translate3d(-52px, -9px, 0) rotate(251deg);
  background: #00d0ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(80) {
  -webkit-transform: translate3d(106px, 171px, 0) rotate(9deg);
  -moz-transform: translate3d(106px, 171px, 0) rotate(9deg);
  -ms-transform: translate3d(106px, 171px, 0) rotate(9deg);
  -o-transform: translate3d(106px, 171px, 0) rotate(9deg);
  transform: translate3d(106px, 171px, 0) rotate(9deg);
  background: #9dff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(81) {
  -webkit-transform: translate3d(85px, 127px, 0) rotate(246deg);
  -moz-transform: translate3d(85px, 127px, 0) rotate(246deg);
  -ms-transform: translate3d(85px, 127px, 0) rotate(246deg);
  -o-transform: translate3d(85px, 127px, 0) rotate(246deg);
  transform: translate3d(85px, 127px, 0) rotate(246deg);
  background: #ff003c;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(82) {
  -webkit-transform: translate3d(68px, -85px, 0) rotate(292deg);
  -moz-transform: translate3d(68px, -85px, 0) rotate(292deg);
  -ms-transform: translate3d(68px, -85px, 0) rotate(292deg);
  -o-transform: translate3d(68px, -85px, 0) rotate(292deg);
  transform: translate3d(68px, -85px, 0) rotate(292deg);
  background: #0091ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(83) {
  -webkit-transform: translate3d(-57px, 88px, 0) rotate(334deg);
  -moz-transform: translate3d(-57px, 88px, 0) rotate(334deg);
  -ms-transform: translate3d(-57px, 88px, 0) rotate(334deg);
  -o-transform: translate3d(-57px, 88px, 0) rotate(334deg);
  transform: translate3d(-57px, 88px, 0) rotate(334deg);
  background: #95ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(84) {
  -webkit-transform: translate3d(156px, 88px, 0) rotate(244deg);
  -moz-transform: translate3d(156px, 88px, 0) rotate(244deg);
  -ms-transform: translate3d(156px, 88px, 0) rotate(244deg);
  -o-transform: translate3d(156px, 88px, 0) rotate(244deg);
  transform: translate3d(156px, 88px, 0) rotate(244deg);
  background: #fff200;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(85) {
  -webkit-transform: translate3d(-10px, 16px, 0) rotate(180deg);
  -moz-transform: translate3d(-10px, 16px, 0) rotate(180deg);
  -ms-transform: translate3d(-10px, 16px, 0) rotate(180deg);
  -o-transform: translate3d(-10px, 16px, 0) rotate(180deg);
  transform: translate3d(-10px, 16px, 0) rotate(180deg);
  background: #1100ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(86) {
  -webkit-transform: translate3d(10px, 99px, 0) rotate(310deg);
  -moz-transform: translate3d(10px, 99px, 0) rotate(310deg);
  -ms-transform: translate3d(10px, 99px, 0) rotate(310deg);
  -o-transform: translate3d(10px, 99px, 0) rotate(310deg);
  transform: translate3d(10px, 99px, 0) rotate(310deg);
  background: #00fffb;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(87) {
  -webkit-transform: translate3d(181px, -21px, 0) rotate(297deg);
  -moz-transform: translate3d(181px, -21px, 0) rotate(297deg);
  -ms-transform: translate3d(181px, -21px, 0) rotate(297deg);
  -o-transform: translate3d(181px, -21px, 0) rotate(297deg);
  transform: translate3d(181px, -21px, 0) rotate(297deg);
  background: #e6ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(88) {
  -webkit-transform: translate3d(47px, 114px, 0) rotate(350deg);
  -moz-transform: translate3d(47px, 114px, 0) rotate(350deg);
  -ms-transform: translate3d(47px, 114px, 0) rotate(350deg);
  -o-transform: translate3d(47px, 114px, 0) rotate(350deg);
  transform: translate3d(47px, 114px, 0) rotate(350deg);
  background: #00ff2f;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(89) {
  -webkit-transform: translate3d(47px, 96px, 0) rotate(204deg);
  -moz-transform: translate3d(47px, 96px, 0) rotate(204deg);
  -ms-transform: translate3d(47px, 96px, 0) rotate(204deg);
  -o-transform: translate3d(47px, 96px, 0) rotate(204deg);
  transform: translate3d(47px, 96px, 0) rotate(204deg);
  background: #ae00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(90) {
  -webkit-transform: translate3d(38px, 63px, 0) rotate(225deg);
  -moz-transform: translate3d(38px, 63px, 0) rotate(225deg);
  -ms-transform: translate3d(38px, 63px, 0) rotate(225deg);
  -o-transform: translate3d(38px, 63px, 0) rotate(225deg);
  transform: translate3d(38px, 63px, 0) rotate(225deg);
  background: #0015ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(91) {
  -webkit-transform: translate3d(140px, 58px, 0) rotate(60deg);
  -moz-transform: translate3d(140px, 58px, 0) rotate(60deg);
  -ms-transform: translate3d(140px, 58px, 0) rotate(60deg);
  -o-transform: translate3d(140px, 58px, 0) rotate(60deg);
  transform: translate3d(140px, 58px, 0) rotate(60deg);
  background: #0099ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(92) {
  -webkit-transform: translate3d(43px, 12px, 0) rotate(143deg);
  -moz-transform: translate3d(43px, 12px, 0) rotate(143deg);
  -ms-transform: translate3d(43px, 12px, 0) rotate(143deg);
  -o-transform: translate3d(43px, 12px, 0) rotate(143deg);
  transform: translate3d(43px, 12px, 0) rotate(143deg);
  background: #00ffa2;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(93) {
  -webkit-transform: translate3d(195px, 14px, 0) rotate(233deg);
  -moz-transform: translate3d(195px, 14px, 0) rotate(233deg);
  -ms-transform: translate3d(195px, 14px, 0) rotate(233deg);
  -o-transform: translate3d(195px, 14px, 0) rotate(233deg);
  transform: translate3d(195px, 14px, 0) rotate(233deg);
  background: #ff9d00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(94) {
  -webkit-transform: translate3d(-3px, 115px, 0) rotate(1deg);
  -moz-transform: translate3d(-3px, 115px, 0) rotate(1deg);
  -ms-transform: translate3d(-3px, 115px, 0) rotate(1deg);
  -o-transform: translate3d(-3px, 115px, 0) rotate(1deg);
  transform: translate3d(-3px, 115px, 0) rotate(1deg);
  background: #0088ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(95) {
  -webkit-transform: translate3d(-46px, 61px, 0) rotate(41deg);
  -moz-transform: translate3d(-46px, 61px, 0) rotate(41deg);
  -ms-transform: translate3d(-46px, 61px, 0) rotate(41deg);
  -o-transform: translate3d(-46px, 61px, 0) rotate(41deg);
  transform: translate3d(-46px, 61px, 0) rotate(41deg);
  background: #ffae00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(96) {
  -webkit-transform: translate3d(-87px, 80px, 0) rotate(24deg);
  -moz-transform: translate3d(-87px, 80px, 0) rotate(24deg);
  -ms-transform: translate3d(-87px, 80px, 0) rotate(24deg);
  -o-transform: translate3d(-87px, 80px, 0) rotate(24deg);
  transform: translate3d(-87px, 80px, 0) rotate(24deg);
  background: #ff1a00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(97) {
  -webkit-transform: translate3d(109px, -64px, 0) rotate(222deg);
  -moz-transform: translate3d(109px, -64px, 0) rotate(222deg);
  -ms-transform: translate3d(109px, -64px, 0) rotate(222deg);
  -o-transform: translate3d(109px, -64px, 0) rotate(222deg);
  transform: translate3d(109px, -64px, 0) rotate(222deg);
  background: #009dff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(98) {
  -webkit-transform: translate3d(99px, -50px, 0) rotate(26deg);
  -moz-transform: translate3d(99px, -50px, 0) rotate(26deg);
  -ms-transform: translate3d(99px, -50px, 0) rotate(26deg);
  -o-transform: translate3d(99px, -50px, 0) rotate(26deg);
  transform: translate3d(99px, -50px, 0) rotate(26deg);
  background: #8800ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(99) {
  -webkit-transform: translate3d(97px, -29px, 0) rotate(69deg);
  -moz-transform: translate3d(97px, -29px, 0) rotate(69deg);
  -ms-transform: translate3d(97px, -29px, 0) rotate(69deg);
  -o-transform: translate3d(97px, -29px, 0) rotate(69deg);
  transform: translate3d(97px, -29px, 0) rotate(69deg);
  background: #ff00a2;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(100) {
  -webkit-transform: translate3d(59px, -46px, 0) rotate(164deg);
  -moz-transform: translate3d(59px, -46px, 0) rotate(164deg);
  -ms-transform: translate3d(59px, -46px, 0) rotate(164deg);
  -o-transform: translate3d(59px, -46px, 0) rotate(164deg);
  transform: translate3d(59px, -46px, 0) rotate(164deg);
  background: #00ff95;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(101) {
  -webkit-transform: translate3d(150px, -59px, 0) rotate(175deg);
  -moz-transform: translate3d(150px, -59px, 0) rotate(175deg);
  -ms-transform: translate3d(150px, -59px, 0) rotate(175deg);
  -o-transform: translate3d(150px, -59px, 0) rotate(175deg);
  transform: translate3d(150px, -59px, 0) rotate(175deg);
  background: #3cff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(102) {
  -webkit-transform: translate3d(98px, 71px, 0) rotate(62deg);
  -moz-transform: translate3d(98px, 71px, 0) rotate(62deg);
  -ms-transform: translate3d(98px, 71px, 0) rotate(62deg);
  -o-transform: translate3d(98px, 71px, 0) rotate(62deg);
  transform: translate3d(98px, 71px, 0) rotate(62deg);
  background: #ff0048;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(103) {
  -webkit-transform: translate3d(-68px, -24px, 0) rotate(288deg);
  -moz-transform: translate3d(-68px, -24px, 0) rotate(288deg);
  -ms-transform: translate3d(-68px, -24px, 0) rotate(288deg);
  -o-transform: translate3d(-68px, -24px, 0) rotate(288deg);
  transform: translate3d(-68px, -24px, 0) rotate(288deg);
  background: #0400ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(104) {
  -webkit-transform: translate3d(181px, 65px, 0) rotate(19deg);
  -moz-transform: translate3d(181px, 65px, 0) rotate(19deg);
  -ms-transform: translate3d(181px, 65px, 0) rotate(19deg);
  -o-transform: translate3d(181px, 65px, 0) rotate(19deg);
  transform: translate3d(181px, 65px, 0) rotate(19deg);
  background: #00ff59;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(105) {
  -webkit-transform: translate3d(-48px, 190px, 0) rotate(264deg);
  -moz-transform: translate3d(-48px, 190px, 0) rotate(264deg);
  -ms-transform: translate3d(-48px, 190px, 0) rotate(264deg);
  -o-transform: translate3d(-48px, 190px, 0) rotate(264deg);
  transform: translate3d(-48px, 190px, 0) rotate(264deg);
  background: #00ff15;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(106) {
  -webkit-transform: translate3d(-18px, 31px, 0) rotate(349deg);
  -moz-transform: translate3d(-18px, 31px, 0) rotate(349deg);
  -ms-transform: translate3d(-18px, 31px, 0) rotate(349deg);
  -o-transform: translate3d(-18px, 31px, 0) rotate(349deg);
  transform: translate3d(-18px, 31px, 0) rotate(349deg);
  background: #ff6f00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(107) {
  -webkit-transform: translate3d(-21px, 80px, 0) rotate(354deg);
  -moz-transform: translate3d(-21px, 80px, 0) rotate(354deg);
  -ms-transform: translate3d(-21px, 80px, 0) rotate(354deg);
  -o-transform: translate3d(-21px, 80px, 0) rotate(354deg);
  transform: translate3d(-21px, 80px, 0) rotate(354deg);
  background: #ff0080;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(108) {
  -webkit-transform: translate3d(174px, 13px, 0) rotate(230deg);
  -moz-transform: translate3d(174px, 13px, 0) rotate(230deg);
  -ms-transform: translate3d(174px, 13px, 0) rotate(230deg);
  -o-transform: translate3d(174px, 13px, 0) rotate(230deg);
  transform: translate3d(174px, 13px, 0) rotate(230deg);
  background: #fbff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(109) {
  -webkit-transform: translate3d(-28px, -16px, 0) rotate(57deg);
  -moz-transform: translate3d(-28px, -16px, 0) rotate(57deg);
  -ms-transform: translate3d(-28px, -16px, 0) rotate(57deg);
  -o-transform: translate3d(-28px, -16px, 0) rotate(57deg);
  transform: translate3d(-28px, -16px, 0) rotate(57deg);
  background: #008cff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(110) {
  -webkit-transform: translate3d(47px, 83px, 0) rotate(323deg);
  -moz-transform: translate3d(47px, 83px, 0) rotate(323deg);
  -ms-transform: translate3d(47px, 83px, 0) rotate(323deg);
  -o-transform: translate3d(47px, 83px, 0) rotate(323deg);
  transform: translate3d(47px, 83px, 0) rotate(323deg);
  background: #ff9d00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(111) {
  -webkit-transform: translate3d(-56px, -81px, 0) rotate(63deg);
  -moz-transform: translate3d(-56px, -81px, 0) rotate(63deg);
  -ms-transform: translate3d(-56px, -81px, 0) rotate(63deg);
  -o-transform: translate3d(-56px, -81px, 0) rotate(63deg);
  transform: translate3d(-56px, -81px, 0) rotate(63deg);
  background: #00ff51;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(112) {
  -webkit-transform: translate3d(106px, -21px, 0) rotate(226deg);
  -moz-transform: translate3d(106px, -21px, 0) rotate(226deg);
  -ms-transform: translate3d(106px, -21px, 0) rotate(226deg);
  -o-transform: translate3d(106px, -21px, 0) rotate(226deg);
  transform: translate3d(106px, -21px, 0) rotate(226deg);
  background: #00fff2;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(113) {
  -webkit-transform: translate3d(-67px, 181px, 0) rotate(101deg);
  -moz-transform: translate3d(-67px, 181px, 0) rotate(101deg);
  -ms-transform: translate3d(-67px, 181px, 0) rotate(101deg);
  -o-transform: translate3d(-67px, 181px, 0) rotate(101deg);
  transform: translate3d(-67px, 181px, 0) rotate(101deg);
  background: #e100ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(114) {
  -webkit-transform: translate3d(50px, 148px, 0) rotate(41deg);
  -moz-transform: translate3d(50px, 148px, 0) rotate(41deg);
  -ms-transform: translate3d(50px, 148px, 0) rotate(41deg);
  -o-transform: translate3d(50px, 148px, 0) rotate(41deg);
  transform: translate3d(50px, 148px, 0) rotate(41deg);
  background: #000dff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(115) {
  -webkit-transform: translate3d(38px, 145px, 0) rotate(13deg);
  -moz-transform: translate3d(38px, 145px, 0) rotate(13deg);
  -ms-transform: translate3d(38px, 145px, 0) rotate(13deg);
  -o-transform: translate3d(38px, 145px, 0) rotate(13deg);
  transform: translate3d(38px, 145px, 0) rotate(13deg);
  background: #ffa600;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(116) {
  -webkit-transform: translate3d(170px, 83px, 0) rotate(240deg);
  -moz-transform: translate3d(170px, 83px, 0) rotate(240deg);
  -ms-transform: translate3d(170px, 83px, 0) rotate(240deg);
  -o-transform: translate3d(170px, 83px, 0) rotate(240deg);
  transform: translate3d(170px, 83px, 0) rotate(240deg);
  background: #00ff11;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(117) {
  -webkit-transform: translate3d(-33px, -33px, 0) rotate(242deg);
  -moz-transform: translate3d(-33px, -33px, 0) rotate(242deg);
  -ms-transform: translate3d(-33px, -33px, 0) rotate(242deg);
  -o-transform: translate3d(-33px, -33px, 0) rotate(242deg);
  transform: translate3d(-33px, -33px, 0) rotate(242deg);
  background: #002fff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(118) {
  -webkit-transform: translate3d(38px, 2px, 0) rotate(164deg);
  -moz-transform: translate3d(38px, 2px, 0) rotate(164deg);
  -ms-transform: translate3d(38px, 2px, 0) rotate(164deg);
  -o-transform: translate3d(38px, 2px, 0) rotate(164deg);
  transform: translate3d(38px, 2px, 0) rotate(164deg);
  background: #bf00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(119) {
  -webkit-transform: translate3d(55px, 93px, 0) rotate(297deg);
  -moz-transform: translate3d(55px, 93px, 0) rotate(297deg);
  -ms-transform: translate3d(55px, 93px, 0) rotate(297deg);
  -o-transform: translate3d(55px, 93px, 0) rotate(297deg);
  transform: translate3d(55px, 93px, 0) rotate(297deg);
  background: #0080ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(120) {
  -webkit-transform: translate3d(88px, -65px, 0) rotate(250deg);
  -moz-transform: translate3d(88px, -65px, 0) rotate(250deg);
  -ms-transform: translate3d(88px, -65px, 0) rotate(250deg);
  -o-transform: translate3d(88px, -65px, 0) rotate(250deg);
  transform: translate3d(88px, -65px, 0) rotate(250deg);
  background: #ff001e;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(121) {
  -webkit-transform: translate3d(-58px, 41px, 0) rotate(318deg);
  -moz-transform: translate3d(-58px, 41px, 0) rotate(318deg);
  -ms-transform: translate3d(-58px, 41px, 0) rotate(318deg);
  -o-transform: translate3d(-58px, 41px, 0) rotate(318deg);
  transform: translate3d(-58px, 41px, 0) rotate(318deg);
  background: #ff0091;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(122) {
  -webkit-transform: translate3d(153px, 177px, 0) rotate(4deg);
  -moz-transform: translate3d(153px, 177px, 0) rotate(4deg);
  -ms-transform: translate3d(153px, 177px, 0) rotate(4deg);
  -o-transform: translate3d(153px, 177px, 0) rotate(4deg);
  transform: translate3d(153px, 177px, 0) rotate(4deg);
  background: #9500ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(123) {
  -webkit-transform: translate3d(116px, 104px, 0) rotate(293deg);
  -moz-transform: translate3d(116px, 104px, 0) rotate(293deg);
  -ms-transform: translate3d(116px, 104px, 0) rotate(293deg);
  -o-transform: translate3d(116px, 104px, 0) rotate(293deg);
  transform: translate3d(116px, 104px, 0) rotate(293deg);
  background: #ff3700;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(124) {
  -webkit-transform: translate3d(-98px, 129px, 0) rotate(142deg);
  -moz-transform: translate3d(-98px, 129px, 0) rotate(142deg);
  -ms-transform: translate3d(-98px, 129px, 0) rotate(142deg);
  -o-transform: translate3d(-98px, 129px, 0) rotate(142deg);
  transform: translate3d(-98px, 129px, 0) rotate(142deg);
  background: #51ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(125) {
  -webkit-transform: translate3d(37px, 198px, 0) rotate(68deg);
  -moz-transform: translate3d(37px, 198px, 0) rotate(68deg);
  -ms-transform: translate3d(37px, 198px, 0) rotate(68deg);
  -o-transform: translate3d(37px, 198px, 0) rotate(68deg);
  transform: translate3d(37px, 198px, 0) rotate(68deg);
  background: #ff00f2;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(126) {
  -webkit-transform: translate3d(127px, 122px, 0) rotate(138deg);
  -moz-transform: translate3d(127px, 122px, 0) rotate(138deg);
  -ms-transform: translate3d(127px, 122px, 0) rotate(138deg);
  -o-transform: translate3d(127px, 122px, 0) rotate(138deg);
  transform: translate3d(127px, 122px, 0) rotate(138deg);
  background: #ff00a2;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(127) {
  -webkit-transform: translate3d(78px, 75px, 0) rotate(52deg);
  -moz-transform: translate3d(78px, 75px, 0) rotate(52deg);
  -ms-transform: translate3d(78px, 75px, 0) rotate(52deg);
  -o-transform: translate3d(78px, 75px, 0) rotate(52deg);
  transform: translate3d(78px, 75px, 0) rotate(52deg);
  background: deepskyblue;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(128) {
  -webkit-transform: translate3d(189px, 176px, 0) rotate(251deg);
  -moz-transform: translate3d(189px, 176px, 0) rotate(251deg);
  -ms-transform: translate3d(189px, 176px, 0) rotate(251deg);
  -o-transform: translate3d(189px, 176px, 0) rotate(251deg);
  transform: translate3d(189px, 176px, 0) rotate(251deg);
  background: #c400ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(129) {
  -webkit-transform: translate3d(154px, 199px, 0) rotate(206deg);
  -moz-transform: translate3d(154px, 199px, 0) rotate(206deg);
  -ms-transform: translate3d(154px, 199px, 0) rotate(206deg);
  -o-transform: translate3d(154px, 199px, 0) rotate(206deg);
  transform: translate3d(154px, 199px, 0) rotate(206deg);
  background: #ff00ea;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(130) {
  -webkit-transform: translate3d(145px, -23px, 0) rotate(205deg);
  -moz-transform: translate3d(145px, -23px, 0) rotate(205deg);
  -ms-transform: translate3d(145px, -23px, 0) rotate(205deg);
  -o-transform: translate3d(145px, -23px, 0) rotate(205deg);
  transform: translate3d(145px, -23px, 0) rotate(205deg);
  background: #ff9d00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(131) {
  -webkit-transform: translate3d(179px, 59px, 0) rotate(351deg);
  -moz-transform: translate3d(179px, 59px, 0) rotate(351deg);
  -ms-transform: translate3d(179px, 59px, 0) rotate(351deg);
  -o-transform: translate3d(179px, 59px, 0) rotate(351deg);
  transform: translate3d(179px, 59px, 0) rotate(351deg);
  background: #00ff8c;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(132) {
  -webkit-transform: translate3d(-85px, -17px, 0) rotate(51deg);
  -moz-transform: translate3d(-85px, -17px, 0) rotate(51deg);
  -ms-transform: translate3d(-85px, -17px, 0) rotate(51deg);
  -o-transform: translate3d(-85px, -17px, 0) rotate(51deg);
  transform: translate3d(-85px, -17px, 0) rotate(51deg);
  background: #ff00c4;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(133) {
  -webkit-transform: translate3d(-79px, 123px, 0) rotate(181deg);
  -moz-transform: translate3d(-79px, 123px, 0) rotate(181deg);
  -ms-transform: translate3d(-79px, 123px, 0) rotate(181deg);
  -o-transform: translate3d(-79px, 123px, 0) rotate(181deg);
  transform: translate3d(-79px, 123px, 0) rotate(181deg);
  background: darkorange;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(134) {
  -webkit-transform: translate3d(146px, -36px, 0) rotate(157deg);
  -moz-transform: translate3d(146px, -36px, 0) rotate(157deg);
  -ms-transform: translate3d(146px, -36px, 0) rotate(157deg);
  -o-transform: translate3d(146px, -36px, 0) rotate(157deg);
  transform: translate3d(146px, -36px, 0) rotate(157deg);
  background: #ff1a00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(135) {
  -webkit-transform: translate3d(137px, 199px, 0) rotate(195deg);
  -moz-transform: translate3d(137px, 199px, 0) rotate(195deg);
  -ms-transform: translate3d(137px, 199px, 0) rotate(195deg);
  -o-transform: translate3d(137px, 199px, 0) rotate(195deg);
  transform: translate3d(137px, 199px, 0) rotate(195deg);
  background: #3c00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(136) {
  -webkit-transform: translate3d(154px, 68px, 0) rotate(322deg);
  -moz-transform: translate3d(154px, 68px, 0) rotate(322deg);
  -ms-transform: translate3d(154px, 68px, 0) rotate(322deg);
  -o-transform: translate3d(154px, 68px, 0) rotate(322deg);
  transform: translate3d(154px, 68px, 0) rotate(322deg);
  background: #ff008c;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(137) {
  -webkit-transform: translate3d(78px, 38px, 0) rotate(218deg);
  -moz-transform: translate3d(78px, 38px, 0) rotate(218deg);
  -ms-transform: translate3d(78px, 38px, 0) rotate(218deg);
  -o-transform: translate3d(78px, 38px, 0) rotate(218deg);
  transform: translate3d(78px, 38px, 0) rotate(218deg);
  background: #9900ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(138) {
  -webkit-transform: translate3d(-80px, 160px, 0) rotate(206deg);
  -moz-transform: translate3d(-80px, 160px, 0) rotate(206deg);
  -ms-transform: translate3d(-80px, 160px, 0) rotate(206deg);
  -o-transform: translate3d(-80px, 160px, 0) rotate(206deg);
  transform: translate3d(-80px, 160px, 0) rotate(206deg);
  background: #15ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(139) {
  -webkit-transform: translate3d(23px, 21px, 0) rotate(280deg);
  -moz-transform: translate3d(23px, 21px, 0) rotate(280deg);
  -ms-transform: translate3d(23px, 21px, 0) rotate(280deg);
  -o-transform: translate3d(23px, 21px, 0) rotate(280deg);
  transform: translate3d(23px, 21px, 0) rotate(280deg);
  background: #ff0062;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(140) {
  -webkit-transform: translate3d(-77px, -65px, 0) rotate(140deg);
  -moz-transform: translate3d(-77px, -65px, 0) rotate(140deg);
  -ms-transform: translate3d(-77px, -65px, 0) rotate(140deg);
  -o-transform: translate3d(-77px, -65px, 0) rotate(140deg);
  transform: translate3d(-77px, -65px, 0) rotate(140deg);
  background: #5900ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(141) {
  -webkit-transform: translate3d(-53px, -2px, 0) rotate(235deg);
  -moz-transform: translate3d(-53px, -2px, 0) rotate(235deg);
  -ms-transform: translate3d(-53px, -2px, 0) rotate(235deg);
  -o-transform: translate3d(-53px, -2px, 0) rotate(235deg);
  transform: translate3d(-53px, -2px, 0) rotate(235deg);
  background: #ff6600;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(142) {
  -webkit-transform: translate3d(74px, -57px, 0) rotate(72deg);
  -moz-transform: translate3d(74px, -57px, 0) rotate(72deg);
  -ms-transform: translate3d(74px, -57px, 0) rotate(72deg);
  -o-transform: translate3d(74px, -57px, 0) rotate(72deg);
  transform: translate3d(74px, -57px, 0) rotate(72deg);
  background: #9500ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(143) {
  -webkit-transform: translate3d(-71px, -73px, 0) rotate(325deg);
  -moz-transform: translate3d(-71px, -73px, 0) rotate(325deg);
  -ms-transform: translate3d(-71px, -73px, 0) rotate(325deg);
  -o-transform: translate3d(-71px, -73px, 0) rotate(325deg);
  transform: translate3d(-71px, -73px, 0) rotate(325deg);
  background: #73ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(144) {
  -webkit-transform: translate3d(-97px, 85px, 0) rotate(226deg);
  -moz-transform: translate3d(-97px, 85px, 0) rotate(226deg);
  -ms-transform: translate3d(-97px, 85px, 0) rotate(226deg);
  -o-transform: translate3d(-97px, 85px, 0) rotate(226deg);
  transform: translate3d(-97px, 85px, 0) rotate(226deg);
  background: #0073ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(145) {
  -webkit-transform: translate3d(79px, -89px, 0) rotate(203deg);
  -moz-transform: translate3d(79px, -89px, 0) rotate(203deg);
  -ms-transform: translate3d(79px, -89px, 0) rotate(203deg);
  -o-transform: translate3d(79px, -89px, 0) rotate(203deg);
  transform: translate3d(79px, -89px, 0) rotate(203deg);
  background: #00ffc4;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(146) {
  -webkit-transform: translate3d(12px, 18px, 0) rotate(93deg);
  -moz-transform: translate3d(12px, 18px, 0) rotate(93deg);
  -ms-transform: translate3d(12px, 18px, 0) rotate(93deg);
  -o-transform: translate3d(12px, 18px, 0) rotate(93deg);
  transform: translate3d(12px, 18px, 0) rotate(93deg);
  background: #0009ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(147) {
  -webkit-transform: translate3d(26px, 155px, 0) rotate(243deg);
  -moz-transform: translate3d(26px, 155px, 0) rotate(243deg);
  -ms-transform: translate3d(26px, 155px, 0) rotate(243deg);
  -o-transform: translate3d(26px, 155px, 0) rotate(243deg);
  transform: translate3d(26px, 155px, 0) rotate(243deg);
  background: #00ffe6;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(148) {
  -webkit-transform: translate3d(82px, 132px, 0) rotate(144deg);
  -moz-transform: translate3d(82px, 132px, 0) rotate(144deg);
  -ms-transform: translate3d(82px, 132px, 0) rotate(144deg);
  -o-transform: translate3d(82px, 132px, 0) rotate(144deg);
  transform: translate3d(82px, 132px, 0) rotate(144deg);
  background: #ff2b00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(149) {
  -webkit-transform: translate3d(-94px, 142px, 0) rotate(251deg);
  -moz-transform: translate3d(-94px, 142px, 0) rotate(251deg);
  -ms-transform: translate3d(-94px, 142px, 0) rotate(251deg);
  -o-transform: translate3d(-94px, 142px, 0) rotate(251deg);
  transform: translate3d(-94px, 142px, 0) rotate(251deg);
  background: #ffae00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(150) {
  -webkit-transform: translate3d(43px, -19px, 0) rotate(68deg);
  -moz-transform: translate3d(43px, -19px, 0) rotate(68deg);
  -ms-transform: translate3d(43px, -19px, 0) rotate(68deg);
  -o-transform: translate3d(43px, -19px, 0) rotate(68deg);
  transform: translate3d(43px, -19px, 0) rotate(68deg);
  background: #00ffaa;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(151) {
  -webkit-transform: translate3d(49px, -34px, 0) rotate(29deg);
  -moz-transform: translate3d(49px, -34px, 0) rotate(29deg);
  -ms-transform: translate3d(49px, -34px, 0) rotate(29deg);
  -o-transform: translate3d(49px, -34px, 0) rotate(29deg);
  transform: translate3d(49px, -34px, 0) rotate(29deg);
  background: #ffa600;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(152) {
  -webkit-transform: translate3d(29px, 54px, 0) rotate(142deg);
  -moz-transform: translate3d(29px, 54px, 0) rotate(142deg);
  -ms-transform: translate3d(29px, 54px, 0) rotate(142deg);
  -o-transform: translate3d(29px, 54px, 0) rotate(142deg);
  transform: translate3d(29px, 54px, 0) rotate(142deg);
  background: #ff00bf;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(153) {
  -webkit-transform: translate3d(-38px, 37px, 0) rotate(327deg);
  -moz-transform: translate3d(-38px, 37px, 0) rotate(327deg);
  -ms-transform: translate3d(-38px, 37px, 0) rotate(327deg);
  -o-transform: translate3d(-38px, 37px, 0) rotate(327deg);
  transform: translate3d(-38px, 37px, 0) rotate(327deg);
  background: #00ff9d;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(154) {
  -webkit-transform: translate3d(-10px, -59px, 0) rotate(34deg);
  -moz-transform: translate3d(-10px, -59px, 0) rotate(34deg);
  -ms-transform: translate3d(-10px, -59px, 0) rotate(34deg);
  -o-transform: translate3d(-10px, -59px, 0) rotate(34deg);
  transform: translate3d(-10px, -59px, 0) rotate(34deg);
  background: #ff1a00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(155) {
  -webkit-transform: translate3d(30px, 162px, 0) rotate(140deg);
  -moz-transform: translate3d(30px, 162px, 0) rotate(140deg);
  -ms-transform: translate3d(30px, 162px, 0) rotate(140deg);
  -o-transform: translate3d(30px, 162px, 0) rotate(140deg);
  transform: translate3d(30px, 162px, 0) rotate(140deg);
  background: #ff6200;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(156) {
  -webkit-transform: translate3d(118px, 38px, 0) rotate(337deg);
  -moz-transform: translate3d(118px, 38px, 0) rotate(337deg);
  -ms-transform: translate3d(118px, 38px, 0) rotate(337deg);
  -o-transform: translate3d(118px, 38px, 0) rotate(337deg);
  transform: translate3d(118px, 38px, 0) rotate(337deg);
  background: #6600ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(157) {
  -webkit-transform: translate3d(117px, -15px, 0) rotate(29deg);
  -moz-transform: translate3d(117px, -15px, 0) rotate(29deg);
  -ms-transform: translate3d(117px, -15px, 0) rotate(29deg);
  -o-transform: translate3d(117px, -15px, 0) rotate(29deg);
  transform: translate3d(117px, -15px, 0) rotate(29deg);
  background: #ff0004;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(158) {
  -webkit-transform: translate3d(24px, -76px, 0) rotate(355deg);
  -moz-transform: translate3d(24px, -76px, 0) rotate(355deg);
  -ms-transform: translate3d(24px, -76px, 0) rotate(355deg);
  -o-transform: translate3d(24px, -76px, 0) rotate(355deg);
  transform: translate3d(24px, -76px, 0) rotate(355deg);
  background: #00ff48;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(159) {
  -webkit-transform: translate3d(155px, -4px, 0) rotate(60deg);
  -moz-transform: translate3d(155px, -4px, 0) rotate(60deg);
  -ms-transform: translate3d(155px, -4px, 0) rotate(60deg);
  -o-transform: translate3d(155px, -4px, 0) rotate(60deg);
  transform: translate3d(155px, -4px, 0) rotate(60deg);
  background: #00ffae;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(160) {
  -webkit-transform: translate3d(-53px, 27px, 0) rotate(223deg);
  -moz-transform: translate3d(-53px, 27px, 0) rotate(223deg);
  -ms-transform: translate3d(-53px, 27px, 0) rotate(223deg);
  -o-transform: translate3d(-53px, 27px, 0) rotate(223deg);
  transform: translate3d(-53px, 27px, 0) rotate(223deg);
  background: #ff0026;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(161) {
  -webkit-transform: translate3d(-65px, -13px, 0) rotate(63deg);
  -moz-transform: translate3d(-65px, -13px, 0) rotate(63deg);
  -ms-transform: translate3d(-65px, -13px, 0) rotate(63deg);
  -o-transform: translate3d(-65px, -13px, 0) rotate(63deg);
  transform: translate3d(-65px, -13px, 0) rotate(63deg);
  background: #6a00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(162) {
  -webkit-transform: translate3d(128px, 169px, 0) rotate(13deg);
  -moz-transform: translate3d(128px, 169px, 0) rotate(13deg);
  -ms-transform: translate3d(128px, 169px, 0) rotate(13deg);
  -o-transform: translate3d(128px, 169px, 0) rotate(13deg);
  transform: translate3d(128px, 169px, 0) rotate(13deg);
  background: #00ffd0;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(163) {
  -webkit-transform: translate3d(25px, 34px, 0) rotate(205deg);
  -moz-transform: translate3d(25px, 34px, 0) rotate(205deg);
  -ms-transform: translate3d(25px, 34px, 0) rotate(205deg);
  -o-transform: translate3d(25px, 34px, 0) rotate(205deg);
  transform: translate3d(25px, 34px, 0) rotate(205deg);
  background: #00ffee;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(164) {
  -webkit-transform: translate3d(84px, 65px, 0) rotate(75deg);
  -moz-transform: translate3d(84px, 65px, 0) rotate(75deg);
  -ms-transform: translate3d(84px, 65px, 0) rotate(75deg);
  -o-transform: translate3d(84px, 65px, 0) rotate(75deg);
  transform: translate3d(84px, 65px, 0) rotate(75deg);
  background: #00a6ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(165) {
  -webkit-transform: translate3d(-29px, 168px, 0) rotate(1deg);
  -moz-transform: translate3d(-29px, 168px, 0) rotate(1deg);
  -ms-transform: translate3d(-29px, 168px, 0) rotate(1deg);
  -o-transform: translate3d(-29px, 168px, 0) rotate(1deg);
  transform: translate3d(-29px, 168px, 0) rotate(1deg);
  background: #ff0011;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(166) {
  -webkit-transform: translate3d(-90px, 167px, 0) rotate(127deg);
  -moz-transform: translate3d(-90px, 167px, 0) rotate(127deg);
  -ms-transform: translate3d(-90px, 167px, 0) rotate(127deg);
  -o-transform: translate3d(-90px, 167px, 0) rotate(127deg);
  transform: translate3d(-90px, 167px, 0) rotate(127deg);
  background: #0033ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(167) {
  -webkit-transform: translate3d(-31px, -17px, 0) rotate(281deg);
  -moz-transform: translate3d(-31px, -17px, 0) rotate(281deg);
  -ms-transform: translate3d(-31px, -17px, 0) rotate(281deg);
  -o-transform: translate3d(-31px, -17px, 0) rotate(281deg);
  transform: translate3d(-31px, -17px, 0) rotate(281deg);
  background: #0095ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(168) {
  -webkit-transform: translate3d(-32px, -21px, 0) rotate(224deg);
  -moz-transform: translate3d(-32px, -21px, 0) rotate(224deg);
  -ms-transform: translate3d(-32px, -21px, 0) rotate(224deg);
  -o-transform: translate3d(-32px, -21px, 0) rotate(224deg);
  transform: translate3d(-32px, -21px, 0) rotate(224deg);
  background: #00ff04;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(169) {
  -webkit-transform: translate3d(51px, 166px, 0) rotate(136deg);
  -moz-transform: translate3d(51px, 166px, 0) rotate(136deg);
  -ms-transform: translate3d(51px, 166px, 0) rotate(136deg);
  -o-transform: translate3d(51px, 166px, 0) rotate(136deg);
  transform: translate3d(51px, 166px, 0) rotate(136deg);
  background: #00ffee;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(170) {
  -webkit-transform: translate3d(166px, 170px, 0) rotate(236deg);
  -moz-transform: translate3d(166px, 170px, 0) rotate(236deg);
  -ms-transform: translate3d(166px, 170px, 0) rotate(236deg);
  -o-transform: translate3d(166px, 170px, 0) rotate(236deg);
  transform: translate3d(166px, 170px, 0) rotate(236deg);
  background: #ff5e00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(171) {
  -webkit-transform: translate3d(26px, 21px, 0) rotate(215deg);
  -moz-transform: translate3d(26px, 21px, 0) rotate(215deg);
  -ms-transform: translate3d(26px, 21px, 0) rotate(215deg);
  -o-transform: translate3d(26px, 21px, 0) rotate(215deg);
  transform: translate3d(26px, 21px, 0) rotate(215deg);
  background: #ffa600;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(172) {
  -webkit-transform: translate3d(22px, -85px, 0) rotate(26deg);
  -moz-transform: translate3d(22px, -85px, 0) rotate(26deg);
  -ms-transform: translate3d(22px, -85px, 0) rotate(26deg);
  -o-transform: translate3d(22px, -85px, 0) rotate(26deg);
  transform: translate3d(22px, -85px, 0) rotate(26deg);
  background: #00ff9d;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(173) {
  -webkit-transform: translate3d(79px, -94px, 0) rotate(55deg);
  -moz-transform: translate3d(79px, -94px, 0) rotate(55deg);
  -ms-transform: translate3d(79px, -94px, 0) rotate(55deg);
  -o-transform: translate3d(79px, -94px, 0) rotate(55deg);
  transform: translate3d(79px, -94px, 0) rotate(55deg);
  background: #7700ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(174) {
  -webkit-transform: translate3d(-68px, 175px, 0) rotate(169deg);
  -moz-transform: translate3d(-68px, 175px, 0) rotate(169deg);
  -ms-transform: translate3d(-68px, 175px, 0) rotate(169deg);
  -o-transform: translate3d(-68px, 175px, 0) rotate(169deg);
  transform: translate3d(-68px, 175px, 0) rotate(169deg);
  background: #00ff22;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(175) {
  -webkit-transform: translate3d(-3px, 133px, 0) rotate(163deg);
  -moz-transform: translate3d(-3px, 133px, 0) rotate(163deg);
  -ms-transform: translate3d(-3px, 133px, 0) rotate(163deg);
  -o-transform: translate3d(-3px, 133px, 0) rotate(163deg);
  transform: translate3d(-3px, 133px, 0) rotate(163deg);
  background: #00ff22;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(176) {
  -webkit-transform: translate3d(73px, 152px, 0) rotate(81deg);
  -moz-transform: translate3d(73px, 152px, 0) rotate(81deg);
  -ms-transform: translate3d(73px, 152px, 0) rotate(81deg);
  -o-transform: translate3d(73px, 152px, 0) rotate(81deg);
  transform: translate3d(73px, 152px, 0) rotate(81deg);
  background: #0091ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(177) {
  -webkit-transform: translate3d(104px, 136px, 0) rotate(351deg);
  -moz-transform: translate3d(104px, 136px, 0) rotate(351deg);
  -ms-transform: translate3d(104px, 136px, 0) rotate(351deg);
  -o-transform: translate3d(104px, 136px, 0) rotate(351deg);
  transform: translate3d(104px, 136px, 0) rotate(351deg);
  background: #00f7ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(178) {
  -webkit-transform: translate3d(152px, -20px, 0) rotate(341deg);
  -moz-transform: translate3d(152px, -20px, 0) rotate(341deg);
  -ms-transform: translate3d(152px, -20px, 0) rotate(341deg);
  -o-transform: translate3d(152px, -20px, 0) rotate(341deg);
  transform: translate3d(152px, -20px, 0) rotate(341deg);
  background: #ff00b3;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(179) {
  -webkit-transform: translate3d(68px, -92px, 0) rotate(223deg);
  -moz-transform: translate3d(68px, -92px, 0) rotate(223deg);
  -ms-transform: translate3d(68px, -92px, 0) rotate(223deg);
  -o-transform: translate3d(68px, -92px, 0) rotate(223deg);
  transform: translate3d(68px, -92px, 0) rotate(223deg);
  background: #ff008c;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(180) {
  -webkit-transform: translate3d(67px, 91px, 0) rotate(335deg);
  -moz-transform: translate3d(67px, 91px, 0) rotate(335deg);
  -ms-transform: translate3d(67px, 91px, 0) rotate(335deg);
  -o-transform: translate3d(67px, 91px, 0) rotate(335deg);
  transform: translate3d(67px, 91px, 0) rotate(335deg);
  background: #ff0095;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(181) {
  -webkit-transform: translate3d(189px, 7px, 0) rotate(90deg);
  -moz-transform: translate3d(189px, 7px, 0) rotate(90deg);
  -ms-transform: translate3d(189px, 7px, 0) rotate(90deg);
  -o-transform: translate3d(189px, 7px, 0) rotate(90deg);
  transform: translate3d(189px, 7px, 0) rotate(90deg);
  background: #ff0091;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(182) {
  -webkit-transform: translate3d(149px, 195px, 0) rotate(335deg);
  -moz-transform: translate3d(149px, 195px, 0) rotate(335deg);
  -ms-transform: translate3d(149px, 195px, 0) rotate(335deg);
  -o-transform: translate3d(149px, 195px, 0) rotate(335deg);
  transform: translate3d(149px, 195px, 0) rotate(335deg);
  background: #00fbff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(183) {
  -webkit-transform: translate3d(2px, -80px, 0) rotate(314deg);
  -moz-transform: translate3d(2px, -80px, 0) rotate(314deg);
  -ms-transform: translate3d(2px, -80px, 0) rotate(314deg);
  -o-transform: translate3d(2px, -80px, 0) rotate(314deg);
  transform: translate3d(2px, -80px, 0) rotate(314deg);
  background: #bbff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(184) {
  -webkit-transform: translate3d(180px, -7px, 0) rotate(88deg);
  -moz-transform: translate3d(180px, -7px, 0) rotate(88deg);
  -ms-transform: translate3d(180px, -7px, 0) rotate(88deg);
  -o-transform: translate3d(180px, -7px, 0) rotate(88deg);
  transform: translate3d(180px, -7px, 0) rotate(88deg);
  background: #ff0d00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(185) {
  -webkit-transform: translate3d(184px, 198px, 0) rotate(110deg);
  -moz-transform: translate3d(184px, 198px, 0) rotate(110deg);
  -ms-transform: translate3d(184px, 198px, 0) rotate(110deg);
  -o-transform: translate3d(184px, 198px, 0) rotate(110deg);
  transform: translate3d(184px, 198px, 0) rotate(110deg);
  background: #bf00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(186) {
  -webkit-transform: translate3d(52px, -13px, 0) rotate(105deg);
  -moz-transform: translate3d(52px, -13px, 0) rotate(105deg);
  -ms-transform: translate3d(52px, -13px, 0) rotate(105deg);
  -o-transform: translate3d(52px, -13px, 0) rotate(105deg);
  transform: translate3d(52px, -13px, 0) rotate(105deg);
  background: #00aaff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(187) {
  -webkit-transform: translate3d(-26px, 155px, 0) rotate(115deg);
  -moz-transform: translate3d(-26px, 155px, 0) rotate(115deg);
  -ms-transform: translate3d(-26px, 155px, 0) rotate(115deg);
  -o-transform: translate3d(-26px, 155px, 0) rotate(115deg);
  transform: translate3d(-26px, 155px, 0) rotate(115deg);
  background: #00d0ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(188) {
  -webkit-transform: translate3d(-84px, 195px, 0) rotate(271deg);
  -moz-transform: translate3d(-84px, 195px, 0) rotate(271deg);
  -ms-transform: translate3d(-84px, 195px, 0) rotate(271deg);
  -o-transform: translate3d(-84px, 195px, 0) rotate(271deg);
  transform: translate3d(-84px, 195px, 0) rotate(271deg);
  background: #0004ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(189) {
  -webkit-transform: translate3d(69px, -35px, 0) rotate(191deg);
  -moz-transform: translate3d(69px, -35px, 0) rotate(191deg);
  -ms-transform: translate3d(69px, -35px, 0) rotate(191deg);
  -o-transform: translate3d(69px, -35px, 0) rotate(191deg);
  transform: translate3d(69px, -35px, 0) rotate(191deg);
  background: #2f00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(190) {
  -webkit-transform: translate3d(-55px, 82px, 0) rotate(116deg);
  -moz-transform: translate3d(-55px, 82px, 0) rotate(116deg);
  -ms-transform: translate3d(-55px, 82px, 0) rotate(116deg);
  -o-transform: translate3d(-55px, 82px, 0) rotate(116deg);
  transform: translate3d(-55px, 82px, 0) rotate(116deg);
  background: #00ff1a;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(191) {
  -webkit-transform: translate3d(42px, 88px, 0) rotate(110deg);
  -moz-transform: translate3d(42px, 88px, 0) rotate(110deg);
  -ms-transform: translate3d(42px, 88px, 0) rotate(110deg);
  -o-transform: translate3d(42px, 88px, 0) rotate(110deg);
  transform: translate3d(42px, 88px, 0) rotate(110deg);
  background: #ffae00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(192) {
  -webkit-transform: translate3d(106px, 44px, 0) rotate(235deg);
  -moz-transform: translate3d(106px, 44px, 0) rotate(235deg);
  -ms-transform: translate3d(106px, 44px, 0) rotate(235deg);
  -o-transform: translate3d(106px, 44px, 0) rotate(235deg);
  transform: translate3d(106px, 44px, 0) rotate(235deg);
  background: #ff0077;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(193) {
  -webkit-transform: translate3d(-22px, 192px, 0) rotate(7deg);
  -moz-transform: translate3d(-22px, 192px, 0) rotate(7deg);
  -ms-transform: translate3d(-22px, 192px, 0) rotate(7deg);
  -o-transform: translate3d(-22px, 192px, 0) rotate(7deg);
  transform: translate3d(-22px, 192px, 0) rotate(7deg);
  background: #09ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(194) {
  -webkit-transform: translate3d(155px, 59px, 0) rotate(315deg);
  -moz-transform: translate3d(155px, 59px, 0) rotate(315deg);
  -ms-transform: translate3d(155px, 59px, 0) rotate(315deg);
  -o-transform: translate3d(155px, 59px, 0) rotate(315deg);
  transform: translate3d(155px, 59px, 0) rotate(315deg);
  background: #2b00ff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(195) {
  -webkit-transform: translate3d(161px, -51px, 0) rotate(264deg);
  -moz-transform: translate3d(161px, -51px, 0) rotate(264deg);
  -ms-transform: translate3d(161px, -51px, 0) rotate(264deg);
  -o-transform: translate3d(161px, -51px, 0) rotate(264deg);
  transform: translate3d(161px, -51px, 0) rotate(264deg);
  background: #33ff00;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(196) {
  -webkit-transform: translate3d(180px, -43px, 0) rotate(268deg);
  -moz-transform: translate3d(180px, -43px, 0) rotate(268deg);
  -ms-transform: translate3d(180px, -43px, 0) rotate(268deg);
  -o-transform: translate3d(180px, -43px, 0) rotate(268deg);
  transform: translate3d(180px, -43px, 0) rotate(268deg);
  background: #008cff;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(197) {
  -webkit-transform: translate3d(-16px, 11px, 0) rotate(46deg);
  -moz-transform: translate3d(-16px, 11px, 0) rotate(46deg);
  -ms-transform: translate3d(-16px, 11px, 0) rotate(46deg);
  -o-transform: translate3d(-16px, 11px, 0) rotate(46deg);
  transform: translate3d(-16px, 11px, 0) rotate(46deg);
  background: #00ffdd;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(198) {
  -webkit-transform: translate3d(103px, -83px, 0) rotate(41deg);
  -moz-transform: translate3d(103px, -83px, 0) rotate(41deg);
  -ms-transform: translate3d(103px, -83px, 0) rotate(41deg);
  -o-transform: translate3d(103px, -83px, 0) rotate(41deg);
  transform: translate3d(103px, -83px, 0) rotate(41deg);
  background: #ff9500;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(199) {
  -webkit-transform: translate3d(17px, 134px, 0) rotate(15deg);
  -moz-transform: translate3d(17px, 134px, 0) rotate(15deg);
  -ms-transform: translate3d(17px, 134px, 0) rotate(15deg);
  -o-transform: translate3d(17px, 134px, 0) rotate(15deg);
  transform: translate3d(17px, 134px, 0) rotate(15deg);
  background: #00ff80;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiBar.hover i:nth-of-type(200) {
  -webkit-transform: translate3d(-46px, 159px, 0) rotate(43deg);
  -moz-transform: translate3d(-46px, 159px, 0) rotate(43deg);
  -ms-transform: translate3d(-46px, 159px, 0) rotate(43deg);
  -o-transform: translate3d(-46px, 159px, 0) rotate(43deg);
  transform: translate3d(-46px, 159px, 0) rotate(43deg);
  background: red;
  -webkit-animation: bang 1.5s ease-out forwards;
  -moz-animation: bang 1.5s ease-out forwards;
  animation: bang 1.5s ease-out forwards;
  opacity: 0;
}

.confettiResults {
  position: relative;
  background: transparent;
  float: right;
}

.confettiResults span {
  color: #333;
  position: absolute;
  font-size: 0.9em;
  float: right;
  width: 100%;
}

.confettiResults i {
  position: absolute;
  display: block;
  left: 100%;
  top: 0;
  width: 8px;
  height: 8px;
  background: red;
  opacity: 0;
  border-radius: 10px;
}

.confettiResults.hover i:nth-of-type(1) {
  -webkit-transform: translate3d(45px, 12px, 0) rotate(326deg);
  -moz-transform: translate3d(45px, 12px, 0) rotate(326deg);
  -ms-transform: translate3d(45px, 12px, 0) rotate(326deg);
  -o-transform: translate3d(45px, 12px, 0) rotate(326deg);
  transform: translate3d(45px, 12px, 0) rotate(326deg);
  background: #ff4400;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(2) {
  -webkit-transform: translate3d(10px, 78px, 0) rotate(230deg);
  -moz-transform: translate3d(10px, 78px, 0) rotate(230deg);
  -ms-transform: translate3d(10px, 78px, 0) rotate(230deg);
  -o-transform: translate3d(10px, 78px, 0) rotate(230deg);
  transform: translate3d(10px, 78px, 0) rotate(230deg);
  background: #ff0095;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(3) {
  -webkit-transform: translate3d(-87px, 147px, 0) rotate(284deg);
  -moz-transform: translate3d(-87px, 147px, 0) rotate(284deg);
  -ms-transform: translate3d(-87px, 147px, 0) rotate(284deg);
  -o-transform: translate3d(-87px, 147px, 0) rotate(284deg);
  transform: translate3d(-87px, 147px, 0) rotate(284deg);
  background: #ff0077;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(4) {
  -webkit-transform: translate3d(-77px, -41px, 0) rotate(28deg);
  -moz-transform: translate3d(-77px, -41px, 0) rotate(28deg);
  -ms-transform: translate3d(-77px, -41px, 0) rotate(28deg);
  -o-transform: translate3d(-77px, -41px, 0) rotate(28deg);
  transform: translate3d(-77px, -41px, 0) rotate(28deg);
  background: #8c00ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(5) {
  -webkit-transform: translate3d(64px, -74px, 0) rotate(125deg);
  -moz-transform: translate3d(64px, -74px, 0) rotate(125deg);
  -ms-transform: translate3d(64px, -74px, 0) rotate(125deg);
  -o-transform: translate3d(64px, -74px, 0) rotate(125deg);
  transform: translate3d(64px, -74px, 0) rotate(125deg);
  background: #ff8800;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(6) {
  -webkit-transform: translate3d(32px, 24px, 0) rotate(339deg);
  -moz-transform: translate3d(32px, 24px, 0) rotate(339deg);
  -ms-transform: translate3d(32px, 24px, 0) rotate(339deg);
  -o-transform: translate3d(32px, 24px, 0) rotate(339deg);
  transform: translate3d(32px, 24px, 0) rotate(339deg);
  background: #d5ff00;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(7) {
  -webkit-transform: translate3d(-45px, 85px, 0) rotate(299deg);
  -moz-transform: translate3d(-45px, 85px, 0) rotate(299deg);
  -ms-transform: translate3d(-45px, 85px, 0) rotate(299deg);
  -o-transform: translate3d(-45px, 85px, 0) rotate(299deg);
  transform: translate3d(-45px, 85px, 0) rotate(299deg);
  background: #00ff51;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(8) {
  -webkit-transform: translate3d(77px, -71px, 0) rotate(3deg);
  -moz-transform: translate3d(77px, -71px, 0) rotate(3deg);
  -ms-transform: translate3d(77px, -71px, 0) rotate(3deg);
  -o-transform: translate3d(77px, -71px, 0) rotate(3deg);
  transform: translate3d(77px, -71px, 0) rotate(3deg);
  background: #00ff7b;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(9) {
  -webkit-transform: translate3d(-93px, -51px, 0) rotate(229deg);
  -moz-transform: translate3d(-93px, -51px, 0) rotate(229deg);
  -ms-transform: translate3d(-93px, -51px, 0) rotate(229deg);
  -o-transform: translate3d(-93px, -51px, 0) rotate(229deg);
  transform: translate3d(-93px, -51px, 0) rotate(229deg);
  background: #ff6600;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(10) {
  -webkit-transform: translate3d(83px, 92px, 0) rotate(135deg);
  -moz-transform: translate3d(83px, 92px, 0) rotate(135deg);
  -ms-transform: translate3d(83px, 92px, 0) rotate(135deg);
  -o-transform: translate3d(83px, 92px, 0) rotate(135deg);
  transform: translate3d(83px, 92px, 0) rotate(135deg);
  background: #dd00ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(11) {
  -webkit-transform: translate3d(75px, 126px, 0) rotate(75deg);
  -moz-transform: translate3d(75px, 126px, 0) rotate(75deg);
  -ms-transform: translate3d(75px, 126px, 0) rotate(75deg);
  -o-transform: translate3d(75px, 126px, 0) rotate(75deg);
  transform: translate3d(75px, 126px, 0) rotate(75deg);
  background: #ff0062;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(12) {
  -webkit-transform: translate3d(-8px, -60px, 0) rotate(292deg);
  -moz-transform: translate3d(-8px, -60px, 0) rotate(292deg);
  -ms-transform: translate3d(-8px, -60px, 0) rotate(292deg);
  -o-transform: translate3d(-8px, -60px, 0) rotate(292deg);
  transform: translate3d(-8px, -60px, 0) rotate(292deg);
  background: #ff3c00;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(13) {
  -webkit-transform: translate3d(59px, 90px, 0) rotate(213deg);
  -moz-transform: translate3d(59px, 90px, 0) rotate(213deg);
  -ms-transform: translate3d(59px, 90px, 0) rotate(213deg);
  -o-transform: translate3d(59px, 90px, 0) rotate(213deg);
  transform: translate3d(59px, 90px, 0) rotate(213deg);
  background: #0011ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(14) {
  -webkit-transform: translate3d(-36px, -72px, 0) rotate(355deg);
  -moz-transform: translate3d(-36px, -72px, 0) rotate(355deg);
  -ms-transform: translate3d(-36px, -72px, 0) rotate(355deg);
  -o-transform: translate3d(-36px, -72px, 0) rotate(355deg);
  transform: translate3d(-36px, -72px, 0) rotate(355deg);
  background: #0091ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(15) {
  -webkit-transform: translate3d(-82px, 145px, 0) rotate(117deg);
  -moz-transform: translate3d(-82px, 145px, 0) rotate(117deg);
  -ms-transform: translate3d(-82px, 145px, 0) rotate(117deg);
  -o-transform: translate3d(-82px, 145px, 0) rotate(117deg);
  transform: translate3d(-82px, 145px, 0) rotate(117deg);
  background: #ff0044;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(16) {
  -webkit-transform: translate3d(-58px, 103px, 0) rotate(122deg);
  -moz-transform: translate3d(-58px, 103px, 0) rotate(122deg);
  -ms-transform: translate3d(-58px, 103px, 0) rotate(122deg);
  -o-transform: translate3d(-58px, 103px, 0) rotate(122deg);
  transform: translate3d(-58px, 103px, 0) rotate(122deg);
  background: #00ff80;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(17) {
  -webkit-transform: translate3d(-49px, -95px, 0) rotate(79deg);
  -moz-transform: translate3d(-49px, -95px, 0) rotate(79deg);
  -ms-transform: translate3d(-49px, -95px, 0) rotate(79deg);
  -o-transform: translate3d(-49px, -95px, 0) rotate(79deg);
  transform: translate3d(-49px, -95px, 0) rotate(79deg);
  background: #0400ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(18) {
  -webkit-transform: translate3d(-6px, 30px, 0) rotate(150deg);
  -moz-transform: translate3d(-6px, 30px, 0) rotate(150deg);
  -ms-transform: translate3d(-6px, 30px, 0) rotate(150deg);
  -o-transform: translate3d(-6px, 30px, 0) rotate(150deg);
  transform: translate3d(-6px, 30px, 0) rotate(150deg);
  background: #ff0009;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(19) {
  -webkit-transform: translate3d(-33px, 122px, 0) rotate(56deg);
  -moz-transform: translate3d(-33px, 122px, 0) rotate(56deg);
  -ms-transform: translate3d(-33px, 122px, 0) rotate(56deg);
  -o-transform: translate3d(-33px, 122px, 0) rotate(56deg);
  transform: translate3d(-33px, 122px, 0) rotate(56deg);
  background: #ff0026;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(20) {
  -webkit-transform: translate3d(-34px, 130px, 0) rotate(274deg);
  -moz-transform: translate3d(-34px, 130px, 0) rotate(274deg);
  -ms-transform: translate3d(-34px, 130px, 0) rotate(274deg);
  -o-transform: translate3d(-34px, 130px, 0) rotate(274deg);
  transform: translate3d(-34px, 130px, 0) rotate(274deg);
  background: #ffa600;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(21) {
  -webkit-transform: translate3d(-29px, 100px, 0) rotate(34deg);
  -moz-transform: translate3d(-29px, 100px, 0) rotate(34deg);
  -ms-transform: translate3d(-29px, 100px, 0) rotate(34deg);
  -o-transform: translate3d(-29px, 100px, 0) rotate(34deg);
  transform: translate3d(-29px, 100px, 0) rotate(34deg);
  background: #ff004d;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(22) {
  -webkit-transform: translate3d(51px, 20px, 0) rotate(2deg);
  -moz-transform: translate3d(51px, 20px, 0) rotate(2deg);
  -ms-transform: translate3d(51px, 20px, 0) rotate(2deg);
  -o-transform: translate3d(51px, 20px, 0) rotate(2deg);
  transform: translate3d(51px, 20px, 0) rotate(2deg);
  background: #00fff7;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(23) {
  -webkit-transform: translate3d(-32px, 117px, 0) rotate(313deg);
  -moz-transform: translate3d(-32px, 117px, 0) rotate(313deg);
  -ms-transform: translate3d(-32px, 117px, 0) rotate(313deg);
  -o-transform: translate3d(-32px, 117px, 0) rotate(313deg);
  transform: translate3d(-32px, 117px, 0) rotate(313deg);
  background: #6a00ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(24) {
  -webkit-transform: translate3d(52px, 98px, 0) rotate(290deg);
  -moz-transform: translate3d(52px, 98px, 0) rotate(290deg);
  -ms-transform: translate3d(52px, 98px, 0) rotate(290deg);
  -o-transform: translate3d(52px, 98px, 0) rotate(290deg);
  transform: translate3d(52px, 98px, 0) rotate(290deg);
  background: #00ff55;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(25) {
  -webkit-transform: translate3d(-7px, 42px, 0) rotate(190deg);
  -moz-transform: translate3d(-7px, 42px, 0) rotate(190deg);
  -ms-transform: translate3d(-7px, 42px, 0) rotate(190deg);
  -o-transform: translate3d(-7px, 42px, 0) rotate(190deg);
  transform: translate3d(-7px, 42px, 0) rotate(190deg);
  background: #ff0088;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(26) {
  -webkit-transform: translate3d(5px, -97px, 0) rotate(150deg);
  -moz-transform: translate3d(5px, -97px, 0) rotate(150deg);
  -ms-transform: translate3d(5px, -97px, 0) rotate(150deg);
  -o-transform: translate3d(5px, -97px, 0) rotate(150deg);
  transform: translate3d(5px, -97px, 0) rotate(150deg);
  background: #00ff59;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(27) {
  -webkit-transform: translate3d(-89px, 122px, 0) rotate(319deg);
  -moz-transform: translate3d(-89px, 122px, 0) rotate(319deg);
  -ms-transform: translate3d(-89px, 122px, 0) rotate(319deg);
  -o-transform: translate3d(-89px, 122px, 0) rotate(319deg);
  transform: translate3d(-89px, 122px, 0) rotate(319deg);
  background: #0062ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(28) {
  -webkit-transform: translate3d(-74px, -56px, 0) rotate(294deg);
  -moz-transform: translate3d(-74px, -56px, 0) rotate(294deg);
  -ms-transform: translate3d(-74px, -56px, 0) rotate(294deg);
  -o-transform: translate3d(-74px, -56px, 0) rotate(294deg);
  transform: translate3d(-74px, -56px, 0) rotate(294deg);
  background: #0055ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(29) {
  -webkit-transform: translate3d(-65px, 133px, 0) rotate(169deg);
  -moz-transform: translate3d(-65px, 133px, 0) rotate(169deg);
  -ms-transform: translate3d(-65px, 133px, 0) rotate(169deg);
  -o-transform: translate3d(-65px, 133px, 0) rotate(169deg);
  transform: translate3d(-65px, 133px, 0) rotate(169deg);
  background: #008cff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(30) {
  -webkit-transform: translate3d(72px, -67px, 0) rotate(300deg);
  -moz-transform: translate3d(72px, -67px, 0) rotate(300deg);
  -ms-transform: translate3d(72px, -67px, 0) rotate(300deg);
  -o-transform: translate3d(72px, -67px, 0) rotate(300deg);
  transform: translate3d(72px, -67px, 0) rotate(300deg);
  background: #00ffd5;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(31) {
  -webkit-transform: translate3d(-65px, -68px, 0) rotate(256deg);
  -moz-transform: translate3d(-65px, -68px, 0) rotate(256deg);
  -ms-transform: translate3d(-65px, -68px, 0) rotate(256deg);
  -o-transform: translate3d(-65px, -68px, 0) rotate(256deg);
  transform: translate3d(-65px, -68px, 0) rotate(256deg);
  background: #ccff00;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(32) {
  -webkit-transform: translate3d(-92px, 5px, 0) rotate(40deg);
  -moz-transform: translate3d(-92px, 5px, 0) rotate(40deg);
  -ms-transform: translate3d(-92px, 5px, 0) rotate(40deg);
  -o-transform: translate3d(-92px, 5px, 0) rotate(40deg);
  transform: translate3d(-92px, 5px, 0) rotate(40deg);
  background: #eeff00;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(33) {
  -webkit-transform: translate3d(65px, 131px, 0) rotate(308deg);
  -moz-transform: translate3d(65px, 131px, 0) rotate(308deg);
  -ms-transform: translate3d(65px, 131px, 0) rotate(308deg);
  -o-transform: translate3d(65px, 131px, 0) rotate(308deg);
  transform: translate3d(65px, 131px, 0) rotate(308deg);
  background: #ff6a00;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(34) {
  -webkit-transform: translate3d(18px, -52px, 0) rotate(162deg);
  -moz-transform: translate3d(18px, -52px, 0) rotate(162deg);
  -ms-transform: translate3d(18px, -52px, 0) rotate(162deg);
  -o-transform: translate3d(18px, -52px, 0) rotate(162deg);
  transform: translate3d(18px, -52px, 0) rotate(162deg);
  background: #00ff0d;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(35) {
  -webkit-transform: translate3d(68px, -37px, 0) rotate(247deg);
  -moz-transform: translate3d(68px, -37px, 0) rotate(247deg);
  -ms-transform: translate3d(68px, -37px, 0) rotate(247deg);
  -o-transform: translate3d(68px, -37px, 0) rotate(247deg);
  transform: translate3d(68px, -37px, 0) rotate(247deg);
  background: #00ffea;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(36) {
  -webkit-transform: translate3d(13px, -49px, 0) rotate(279deg);
  -moz-transform: translate3d(13px, -49px, 0) rotate(279deg);
  -ms-transform: translate3d(13px, -49px, 0) rotate(279deg);
  -o-transform: translate3d(13px, -49px, 0) rotate(279deg);
  transform: translate3d(13px, -49px, 0) rotate(279deg);
  background: #000dff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(37) {
  -webkit-transform: translate3d(-21px, 147px, 0) rotate(178deg);
  -moz-transform: translate3d(-21px, 147px, 0) rotate(178deg);
  -ms-transform: translate3d(-21px, 147px, 0) rotate(178deg);
  -o-transform: translate3d(-21px, 147px, 0) rotate(178deg);
  transform: translate3d(-21px, 147px, 0) rotate(178deg);
  background: #ff0073;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(38) {
  -webkit-transform: translate3d(61px, 147px, 0) rotate(189deg);
  -moz-transform: translate3d(61px, 147px, 0) rotate(189deg);
  -ms-transform: translate3d(61px, 147px, 0) rotate(189deg);
  -o-transform: translate3d(61px, 147px, 0) rotate(189deg);
  transform: translate3d(61px, 147px, 0) rotate(189deg);
  background: #3700ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(39) {
  -webkit-transform: translate3d(-87px, -2px, 0) rotate(54deg);
  -moz-transform: translate3d(-87px, -2px, 0) rotate(54deg);
  -ms-transform: translate3d(-87px, -2px, 0) rotate(54deg);
  -o-transform: translate3d(-87px, -2px, 0) rotate(54deg);
  transform: translate3d(-87px, -2px, 0) rotate(54deg);
  background: #005eff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(40) {
  -webkit-transform: translate3d(-63px, 33px, 0) rotate(9deg);
  -moz-transform: translate3d(-63px, 33px, 0) rotate(9deg);
  -ms-transform: translate3d(-63px, 33px, 0) rotate(9deg);
  -o-transform: translate3d(-63px, 33px, 0) rotate(9deg);
  transform: translate3d(-63px, 33px, 0) rotate(9deg);
  background: #9500ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(41) {
  -webkit-transform: translate3d(49px, 55px, 0) rotate(163deg);
  -moz-transform: translate3d(49px, 55px, 0) rotate(163deg);
  -ms-transform: translate3d(49px, 55px, 0) rotate(163deg);
  -o-transform: translate3d(49px, 55px, 0) rotate(163deg);
  transform: translate3d(49px, 55px, 0) rotate(163deg);
  background: #d5ff00;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(42) {
  -webkit-transform: translate3d(-93px, 141px, 0) rotate(144deg);
  -moz-transform: translate3d(-93px, 141px, 0) rotate(144deg);
  -ms-transform: translate3d(-93px, 141px, 0) rotate(144deg);
  -o-transform: translate3d(-93px, 141px, 0) rotate(144deg);
  transform: translate3d(-93px, 141px, 0) rotate(144deg);
  background: #00ff6f;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(43) {
  -webkit-transform: translate3d(53px, 144px, 0) rotate(93deg);
  -moz-transform: translate3d(53px, 144px, 0) rotate(93deg);
  -ms-transform: translate3d(53px, 144px, 0) rotate(93deg);
  -o-transform: translate3d(53px, 144px, 0) rotate(93deg);
  transform: translate3d(53px, 144px, 0) rotate(93deg);
  background: #006fff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(44) {
  -webkit-transform: translate3d(-48px, 111px, 0) rotate(217deg);
  -moz-transform: translate3d(-48px, 111px, 0) rotate(217deg);
  -ms-transform: translate3d(-48px, 111px, 0) rotate(217deg);
  -o-transform: translate3d(-48px, 111px, 0) rotate(217deg);
  transform: translate3d(-48px, 111px, 0) rotate(217deg);
  background: #b7ff00;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(45) {
  -webkit-transform: translate3d(-99px, 111px, 0) rotate(243deg);
  -moz-transform: translate3d(-99px, 111px, 0) rotate(243deg);
  -ms-transform: translate3d(-99px, 111px, 0) rotate(243deg);
  -o-transform: translate3d(-99px, 111px, 0) rotate(243deg);
  transform: translate3d(-99px, 111px, 0) rotate(243deg);
  background: #00ff73;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(46) {
  -webkit-transform: translate3d(25px, 129px, 0) rotate(236deg);
  -moz-transform: translate3d(25px, 129px, 0) rotate(236deg);
  -ms-transform: translate3d(25px, 129px, 0) rotate(236deg);
  -o-transform: translate3d(25px, 129px, 0) rotate(236deg);
  transform: translate3d(25px, 129px, 0) rotate(236deg);
  background: #003cff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(47) {
  -webkit-transform: translate3d(27px, 127px, 0) rotate(163deg);
  -moz-transform: translate3d(27px, 127px, 0) rotate(163deg);
  -ms-transform: translate3d(27px, 127px, 0) rotate(163deg);
  -o-transform: translate3d(27px, 127px, 0) rotate(163deg);
  transform: translate3d(27px, 127px, 0) rotate(163deg);
  background: #ddff00;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(48) {
  -webkit-transform: translate3d(84px, 42px, 0) rotate(325deg);
  -moz-transform: translate3d(84px, 42px, 0) rotate(325deg);
  -ms-transform: translate3d(84px, 42px, 0) rotate(325deg);
  -o-transform: translate3d(84px, 42px, 0) rotate(325deg);
  transform: translate3d(84px, 42px, 0) rotate(325deg);
  background: #a2ff00;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(49) {
  -webkit-transform: translate3d(-17px, -55px, 0) rotate(124deg);
  -moz-transform: translate3d(-17px, -55px, 0) rotate(124deg);
  -ms-transform: translate3d(-17px, -55px, 0) rotate(124deg);
  -o-transform: translate3d(-17px, -55px, 0) rotate(124deg);
  transform: translate3d(-17px, -55px, 0) rotate(124deg);
  background: #0055ff;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.confettiResults.hover i:nth-of-type(50) {
  -webkit-transform: translate3d(8px, 44px, 0) rotate(155deg);
  -moz-transform: translate3d(8px, 44px, 0) rotate(155deg);
  -ms-transform: translate3d(8px, 44px, 0) rotate(155deg);
  -o-transform: translate3d(8px, 44px, 0) rotate(155deg);
  transform: translate3d(8px, 44px, 0) rotate(155deg);
  background: #00ffc4;
  -webkit-animation: bang 1s ease-out forwards;
  -moz-animation: bang 1s ease-out forwards;
  animation: bang 1s ease-out forwards;
  opacity: 0;
}

.trivia-mobile-item {
  height: 100%;
  overflow: visible;
  margin-left: 0;
}
.trivia-mobile-item li {
  width: 100%;
  padding-right: 0;
  float: left;
  margin: 0;
  overflow: visible;
  height: auto;
  padding-bottom: 12px;
}
.trivia-mobile-item li .trivia-item-inner a {
  text-decoration: none;
  color: #FFF;
}
.trivia-mobile-item li .trivia-item-inner a .field-mobile-thumbnail {
  text-decoration: none;
}
.trivia-mobile-item li .trivia-item-inner a .field-mobile-thumbnail img {
  height: 71px;
  width: 72px;
  clip-path: none;
  margin-left: 0;
  margin-top: 0;
  border: 0;
  border-radius: 6px;
  float: left;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .trivia-mobile-item li .trivia-item-inner a .field-mobile-thumbnail img {
    width: 92px;
    height: 92px;
  }
}
.trivia-mobile-item li .trivia-item-inner a span.iconOverlay.trivia-qotd {
  background: url("../images/IconBezelYellow.png") no-repeat;
  background-position: -2px -2px;
  background-size: cover;
  display: block;
  position: absolute;
  width: 77px;
  height: 77px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .trivia-mobile-item li .trivia-item-inner a span.iconOverlay.trivia-qotd {
    width: 97px;
    height: 97px;
  }
}
.trivia-mobile-item li .trivia-item-inner .triviaDescription {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  padding-bottom: 3px;
  color: #FFF;
  overflow: visible;
  height: 100%;
}
.trivia-mobile-item li .trivia-item-inner .triviaDescription h1 {
  color: #f8c11f;
  font-size: 1.125rem;
  border: none;
  padding: 0;
  font-family: "ProximaNovaBold";
  margin: 0 20px 0 8px;
  text-decoration: none;
}
.trivia-mobile-item li .trivia-item-inner .triviaDescription #triviaDescription {
  font-size: 17.5px;
  line-height: 1.313em;
  margin-right: 20px;
  margin-left: 8px;
}
.trivia-mobile-item li .trivia-item-inner .triviaDescription #triviaDescription .field-mobile-short-description {
  text-decoration: none;
}

.gdpr-overlay-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: rgba(0, 0, 0, 0.65);
  /*dim the background*/
  overflow: hidden;
}

.gdpr-overlay-container {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 99;
  background-color: #008aa3;
  border: 2px solid #04b5f0;
  height: 495px;
  width: 422px;
  max-width: 100%;
  max-height: 100%;
  border-radius: 0px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) {
  .gdpr-overlay-container {
    height: 495px;
    width: 352px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .gdpr-overlay-container {
    height: 375px;
    width: 475px;
  }
}

.gdpr-overlay {
  padding-left: 10px;
  padding-top: 10px;
}
.gdpr-overlay h1.gdpr-welcome {
  font-size: 19px;
  letter-spacing: 0.03em;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
  text-align: center;
  margin-top: 10px;
  margin-bottom: 8px;
  border: none;
  color: #FFF;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .gdpr-overlay h1.gdpr-welcome {
    margin-bottom: 0;
    margin-top: 10px;
  }
}
.gdpr-overlay .overlay-text {
  font-size: 16px;
  text-align: left;
  color: #FFF;
  font-family: "ProximaNova";
  margin-bottom: 18px;
  max-width: 380px;
  position: relative;
  left: 12px;
  line-height: 1.1em;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) {
  .gdpr-overlay .overlay-text {
    max-width: 300px;
    left: 6px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .gdpr-overlay .overlay-text {
    font-size: 16px;
    text-align: left;
    color: #FFF;
    font-family: "ProximaNova";
    margin-bottom: 18px;
    max-width: 450px;
    position: relative;
    left: 0;
  }
}
.gdpr-overlay .overlay-text span {
  font-family: "ProximaNovaBold";
}
.gdpr-overlay .overlay-text:nth-child(3) {
  margin-bottom: 25px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .gdpr-overlay .overlay-text:nth-child(3) {
    margin-bottom: 16px;
  }
}
.gdpr-overlay .overlay-text:last-child {
  margin-top: 10px;
  margin-bottom: 0px;
}
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  .gdpr-overlay .overlay-text:last-child {
    margin-top: 0px;
  }
}
.gdpr-overlay .overlay-text a {
  color: #02d6fc;
}
.gdpr-overlay .overlay-button {
  background-color: #fe9104;
  color: #FFF;
  font-family: "ProximaNovaBold";
  border: 2px solid #fdb404;
  font-size: 14px;
  width: 221px;
  height: 25px;
  border-radius: 5px;
  margin: 0px auto;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.gdpr-overlay .overlay-button span {
  line-height: 27px;
  vertical-align: middle;
}
.gdpr-overlay .overlay-button:hover {
  background: #d67a02;
}

.page-cookie-choices h2 {
  color: #e6f6ff;
  font-size: 30px;
  border-bottom: 2px solid #47a6ff;
  padding-bottom: 8px;
  text-transform: uppercase;
  margin-bottom: 20px;
}
.page-cookie-choices .scrollableContentArea {
  padding: 10px;
}
.page-cookie-choices .content-unselectable {
  padding: 5px;
}
.page-cookie-choices .content-unselectable p {
  padding: 0px 20px;
  font-size: 15px;
  margin-top: 15px;
}
.page-cookie-choices .choices-container {
  background: #008aa3;
  padding: 12px;
  border-radius: 10px;
  margin-bottom: 15px;
  width: 316px;
  margin: 5px auto 15px auto;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .page-cookie-choices .choices-container {
    width: 450px;
    margin: 10px auto 20px auto;
  }
}
.page-cookie-choices .choices-container .cookie-chosen-message {
  font-weight: bold;
  font-family: "ProximaNovaBold";
  text-align: center;
  position: relative;
}
.page-cookie-choices .overlay-button.not-active {
  background: #9e9696;
  border: 2px solid #9e9696;
}
.page-cookie-choices .overlay-button {
  font-family: "ProximaNovaBold";
  background-color: #fe9104;
  color: #FFF;
  border: 2px solid #fdb404;
  font-size: 14px;
  font-weight: bold;
  width: 221px;
  height: 25px;
  border-radius: 5px;
  margin: 0px auto;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.page-cookie-choices .overlay-button a {
  color: #FFF;
  text-decoration: none;
}
.page-cookie-choices .overlay-button a:hover {
  text-decoration: none;
}
.page-cookie-choices .overlay-button span {
  line-height: 27px;
  vertical-align: middle;
  text-decoration: none;
  color: #FFF;
}
.page-cookie-choices .overlay-button:hover {
  background: #d67a02;
}
.page-cookie-choices .understand-txt {
  line-height: 1.2em;
}
.page-cookie-choices .understand-txt a {
  color: #46b8fd;
}

span.first-cookie {
  display: unset;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  span.first-cookie {
    display: block;
  }
}

span.second-cookie {
  display: unset;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  span.second-cookie {
    display: block;
  }
}

#yourCookieChoices {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: #398ada;
  color: #fff;
  text-align: center;
  display: table;
  height: 140px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  #yourCookieChoices {
    height: 90px;
  }
}
#yourCookieChoices p.cookie-text {
  font-size: 15px;
  font-family: "ProximaNova";
  font-weight: bold;
  height: 46px;
  vertical-align: middle;
  display: block;
  position: relative;
  width: 80%;
  top: 8px;
  margin: 0 auto;
  line-height: 1.2em;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  #yourCookieChoices p.cookie-text {
    width: 90%;
  }
}
#yourCookieChoices .cookie-mobile {
  display: block;
  position: relative;
  top: 50px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  #yourCookieChoices .cookie-mobile {
    top: 13px;
  }
}
#yourCookieChoices a.cookies-link {
  color: #FFF;
  text-decoration: underline;
}
#yourCookieChoices span.imokwiththat-close {
  background: url("/themes/custom/cmatgame_mob/images/imokwiththat.png") no-repeat;
  height: 30px;
  width: 130px;
  display: block;
  text-indent: -9999px;
  position: relative;
  cursor: pointer;
  display: inline-block;
  top: -6px;
  margin-left: 5px;
  margin-right: 5px;
}
#yourCookieChoices span.imokwiththat-close:hover {
  background: url("/themes/custom/cmatgame_mob/images/imokwiththat-hover.png") no-repeat;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  #yourCookieChoices span.imokwiththat-close {
    margin-right: 15px;
  }
}

.app-page-logo {
  margin: 0 auto;
  width: 75%;
  position: absolute;
  top: 20px;
  left: 46px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .app-page-logo {
    width: 50%;
    text-align: center;
    position: unset;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 750px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
  .app-page-logo {
    width: 50%;
    text-align: center;
    margin: 0 auto;
    position: relative;
    top: -20px;
    left: -10px;
  }
}
@media only screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) {
  .app-page-logo {
    width: 50%;
  }
}

.app-page-menu-hide {
  height: 45px;
  width: 85%;
  text-align: center;
  top: 0px;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .app-page-menu-hide {
    height: 70px;
  }
}
@media only screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: landscape) {
  .app-page-menu-hide {
    height: 90px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  .app-page-logo {
    width: 50%;
    text-align: center;
    position: unset;
  }

  .app-page-menu-hide {
    height: 90px;
    top: -26px;
    position: relative;
  }
}
/*iPad Pro 10.5"*/
/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen and (min-device-width: 834px) and (max-device-width: 834px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  .app-page-logo {
    width: 50%;
    text-align: center;
    position: unset;
  }

  .app-page-menu-hide {
    height: 90px;
    top: -26px;
    position: relative;
  }
}
/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen and (min-device-width: 1112px) and (max-device-width: 1112px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  .app-page-logo {
    width: 50%;
    text-align: center;
    position: unset;
  }

  .app-page-menu-hide {
    height: 90px;
    top: -26px;
    position: relative;
  }
}
/*ipad PRo 12.9"*/
/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
  .app-page-logo {
    width: 50%;
    text-align: center;
    position: unset;
  }

  .app-page-menu-hide {
    height: 90px;
    top: -26px;
    position: relative;
  }
}
/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen and (min-device-width: 1366px) and (max-device-width: 1366px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
  .app-page-logo {
    width: 50%;
    text-align: center;
    position: unset;
  }

  .app-page-menu-hide {
    height: 90px;
    top: -26px;
    position: relative;
  }
}
.daily-game-item, .mobile-dailygames-see-more {
  display: none;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .daily-game-item, .mobile-dailygames-see-more {
    display: block;
  }
}

.mobile-categories-node.daily-game-item {
  display: none;
}
@media screen and (min-width: 768px) and (max-width: 1366px) {
  .mobile-categories-node.daily-game-item {
    display: block;
  }
}

.page-myaccount .card-number-input {
  font-family: "Helvetica";
  border-radius: 6px;
  width: 233px;
  background: #52A5F8;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.2);
  height: 25px;
  color: #FFF;
  font-size: 15px;
  margin: 10px auto;
  padding-top: 5px;
  padding-left: 5px;
}
.page-myaccount .exp-month-select {
  text-align: center;
  margin: 0 auto;
  font-family: "Helvetica";
  border-radius: 6px;
  width: 233px;
  background: #52A5F8;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.2);
  height: 25px;
  color: #FFF;
  font-size: 15px;
  margin: 10px auto;
  padding-top: 5px;
  padding-left: 5px;
}
.page-myaccount .title-expiration-date {
  color: #cce5ff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  font-size: 16px;
  font-weight: normal;
  letter-spacing: 0.7px;
  margin: 10px auto;
}
#playNowButton {
  width: 175px;
  height: 32px;
  text-align: center;
  display: inline-block;
  margin-bottom: 20px;
  background-color: #12a64a;
  border-radius: 10px;
  color: #FFF;
  font-size: 21px;
  vertical-align: middle;
  line-height: 32px;
  font-weight: bold;
}

#game-content {
  color: white;
  height: 500px;
  background: #333;
  text-align: center;
  padding: 20px;
}

#modal {
  display: none;
  text-align: center;
  color: white;
  position: absolute;
  background: rgba(0, 0, 0, 0.9);
  right: 0;
  bottom: 0;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 1;
}

#modal h1 {
  padding-top: 10px;
  font-size: 20px;
}

#pre-content-container {
  width: 100%;
  min-height: 200px;
  margin: 5% auto;
  box-shadow: 0px 0px 55px 0px black;
}

/* Video Player Preloader Override for positioning */
.three-bounce {
  top: 160px !important;
}

#timer_div {
  color: yellow;
  display: inline-block;
}

.continue-link {
  color: yellow;
  width: 300px;
  position: relative;
  left: -112px;
}
@media screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .continue-link {
    left: 50px;
  }
}

html {
  height: 100%;
  background-size: cover;
}

.subscribe-outer-container h1 {
  border-bottom: none;
}

.logo-container-signup {
  text-align: center;
}

.global-wrapper .global-content-wrapper .main-header {
  background-color: #2a455d;
}
.global-wrapper .global-content-wrapper .main-header .logo-container-signup {
  padding: 10px auto;
}
.global-wrapper .global-content-wrapper .main-header .logo-container-signup img {
  width: 100%;
  padding: 10px 0;
}

body.page-signup,
body.section-user-admin {
  background-image: none;
}
body.page-signup .content-column-wrapper,
body.section-user-admin .content-column-wrapper {
  width: 100%;
  background: #3c6980 !important;
}

#user-login-form .form-required {
  display: block;
}
#user-login-form .form-required.form-item-pass label {
  display: inline;
}
#user-login-form .form-required .description {
  display: none;
}
#user-login-form .form-item {
  margin: 0;
}
#user-login-form .form-item-remember-me {
  margin-bottom: 40px;
}
#user-login-form .form-item-pass {
  clear: both;
  padding-top: 10px;
  padding-bottom: 20px;
}

body.signup .main-column {
  margin: 0 auto;
  float: none;
  width: unset;
}

body.section-thankyou {
  background-color: #3c6980 !important;
  background-image: none;
}
body.section-thankyou .main-header {
  margin-bottom: 0;
}
body.section-thankyou .main-column {
  float: none;
  width: 100%;
}
body.section-thankyou .main-column .subscribe-outer-container {
  margin-top: 0;
  width: auto;
}
body.section-thankyou .main-column .signup-text-thank-you {
  font-size: 0;
  margin: 0 auto;
}
body.section-thankyou .main-column .thanks-area {
  background: #e8ebed;
  text-align: center;
  box-shadow: -4px 4px 30px -5px rgba(141, 186, 210, 0.5);
  padding: 63px;
}
body.section-thankyou .main-column .thanks-area h1 {
  font-size: 56px;
  color: #5da2c5;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
  border-bottom: none;
}
body.section-thankyou .main-column .thanks-area h2 {
  font-size: 20px;
  color: #374f67;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
  margin-bottom: 10px;
}
body.section-thankyou .main-column .enjoy {
  text-align: center;
}
body.section-thankyou .main-column .enjoy h2 {
  font-size: 76px;
  color: #ffffff;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
  line-height: 1em;
  letter-spacing: 1px;
}
body.section-thankyou .main-column .enjoy h3 {
  font-size: 16.5px;
  color: #ffffff;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
  margin-bottom: 40px;
  letter-spacing: 1px;
}
body.section-thankyou .main-column .enjoy .faq a {
  font-size: 14px;
  border-bottom: 1px solid #7d98a7;
  color: #ffffff;
  clear: both;
}
body.section-thankyou .main-column .enjoy .faq a:hover {
  text-decoration: none;
  border-bottom: 1px solid #ffffff;
}

.page-signup label {
  margin-top: 5px;
}
.page-signup .form-item-email input[type=email] {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  height: 40px;
  line-height: 40px;
}
.page-signup .form-item-pass input[type=password] {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  height: 40px;
  line-height: 40px;
}

.subscribe-outer-container ul, .subscribe-outer-container ol {
  list-style-type: none;
}
.subscribe-outer-container div[aria-label="Error message"] {
  font-weight: bold;
}

.cmatgame-myaccount-billing-form,
body.page-signup,
body.page-user,
body.section-user-admin,
body.section-user-admin.not-active-user {
  background: #3c6980;
  background-image: none;
}
.cmatgame-myaccount-billing-form .main-column,
body.page-signup .main-column,
body.page-user .main-column,
body.section-user-admin .main-column,
body.section-user-admin.not-active-user .main-column {
  float: none;
  width: 100%;
}
.cmatgame-myaccount-billing-form .main-column .inside,
body.page-signup .main-column .inside,
body.page-user .main-column .inside,
body.section-user-admin .main-column .inside,
body.section-user-admin.not-active-user .main-column .inside {
  width: 100%;
  margin-top: 0;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container,
body.page-signup .main-column .subscribe-outer-container,
body.page-user .main-column .subscribe-outer-container,
body.section-user-admin .main-column .subscribe-outer-container,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container {
  margin: 40px auto 0;
  text-align: center;
  background: #e8ebed;
  color: #3c6980;
  box-shadow: -4px 4px 30px 10px rgba(141, 186, 210, 0.5);
  border-radius: 5px;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container h1,
body.page-signup .main-column .subscribe-outer-container h1,
body.page-user .main-column .subscribe-outer-container h1,
body.section-user-admin .main-column .subscribe-outer-container h1,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container h1 {
  font-size: 30px;
  color: #3c6980;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container h3,
body.page-signup .main-column .subscribe-outer-container h3,
body.page-user .main-column .subscribe-outer-container h3,
body.section-user-admin .main-column .subscribe-outer-container h3,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container h3 {
  font-size: 16px;
  color: #3c6980;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
  margin-bottom: 10px;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .forgotyourpassword2,
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .forgotpasswordlink,
body.page-signup .main-column .subscribe-outer-container .forgotyourpassword2,
body.page-signup .main-column .subscribe-outer-container .forgotpasswordlink,
body.page-user .main-column .subscribe-outer-container .forgotyourpassword2,
body.page-user .main-column .subscribe-outer-container .forgotpasswordlink,
body.section-user-admin .main-column .subscribe-outer-container .forgotyourpassword2,
body.section-user-admin .main-column .subscribe-outer-container .forgotpasswordlink,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .forgotyourpassword2,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .forgotpasswordlink {
  margin-top: 20px;
  margin-bottom: 40px;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .forgotyourpassword2 a,
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .forgotpasswordlink a,
body.page-signup .main-column .subscribe-outer-container .forgotyourpassword2 a,
body.page-signup .main-column .subscribe-outer-container .forgotpasswordlink a,
body.page-user .main-column .subscribe-outer-container .forgotyourpassword2 a,
body.page-user .main-column .subscribe-outer-container .forgotpasswordlink a,
body.section-user-admin .main-column .subscribe-outer-container .forgotyourpassword2 a,
body.section-user-admin .main-column .subscribe-outer-container .forgotpasswordlink a,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .forgotyourpassword2 a,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .forgotpasswordlink a {
  color: #3c6980;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .signup-form-container,
body.page-signup .main-column .subscribe-outer-container .signup-form-container,
body.page-user .main-column .subscribe-outer-container .signup-form-container,
body.section-user-admin .main-column .subscribe-outer-container .signup-form-container,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .signup-form-container {
  padding: 40px;
  font-size: 0.75rem;
  color: #97a3a8;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .signup-form-container .noaccount,
body.page-signup .main-column .subscribe-outer-container .signup-form-container .noaccount,
body.page-user .main-column .subscribe-outer-container .signup-form-container .noaccount,
body.section-user-admin .main-column .subscribe-outer-container .signup-form-container .noaccount,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .signup-form-container .noaccount {
  text-transform: uppercase;
  font-size: 1.125rem;
  font-weight: 600;
  color: #3c6980;
  width: 243px;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .signup-form-container .noaccount a,
body.page-signup .main-column .subscribe-outer-container .signup-form-container .noaccount a,
body.page-user .main-column .subscribe-outer-container .signup-form-container .noaccount a,
body.section-user-admin .main-column .subscribe-outer-container .signup-form-container .noaccount a,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .signup-form-container .noaccount a {
  text-decoration: none;
  color: #5fa3c5;
  border-bottom: 2px solid #5fa3c5;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .signup-form-container .noaccount a:active, .cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .signup-form-container .noaccount a:hover,
body.page-signup .main-column .subscribe-outer-container .signup-form-container .noaccount a:active,
body.page-signup .main-column .subscribe-outer-container .signup-form-container .noaccount a:hover,
body.page-user .main-column .subscribe-outer-container .signup-form-container .noaccount a:active,
body.page-user .main-column .subscribe-outer-container .signup-form-container .noaccount a:hover,
body.section-user-admin .main-column .subscribe-outer-container .signup-form-container .noaccount a:active,
body.section-user-admin .main-column .subscribe-outer-container .signup-form-container .noaccount a:hover,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .signup-form-container .noaccount a:active,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .signup-form-container .noaccount a:hover {
  color: #3c6980;
  text-decoration: none;
  border-bottom: 2px solid #3c6980;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .form-item.js-form-type-checkbox,
body.page-signup .main-column .subscribe-outer-container .form-item.js-form-type-checkbox,
body.page-user .main-column .subscribe-outer-container .form-item.js-form-type-checkbox,
body.section-user-admin .main-column .subscribe-outer-container .form-item.js-form-type-checkbox,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .form-item.js-form-type-checkbox {
  margin-bottom: 20px;
  position: relative;
}
.cmatgame-myaccount-billing-form .main-column .subscribe-outer-container .col-sm-6.ccnumber,
body.page-signup .main-column .subscribe-outer-container .col-sm-6.ccnumber,
body.page-user .main-column .subscribe-outer-container .col-sm-6.ccnumber,
body.section-user-admin .main-column .subscribe-outer-container .col-sm-6.ccnumber,
body.section-user-admin.not-active-user .main-column .subscribe-outer-container .col-sm-6.ccnumber {
  width: 240px;
}
.cmatgame-myaccount-billing-form .subscribe-outer-container [role=contentinfo] [role=alert],
body.page-signup .subscribe-outer-container [role=contentinfo] [role=alert],
body.page-user .subscribe-outer-container [role=contentinfo] [role=alert],
body.section-user-admin .subscribe-outer-container [role=contentinfo] [role=alert],
body.section-user-admin.not-active-user .subscribe-outer-container [role=contentinfo] [role=alert] {
  padding-top: 20px;
  padding-bottom: 20px;
}
.cmatgame-myaccount-billing-form .subscribe-outer-container [role=contentinfo] [role=alert],
.cmatgame-myaccount-billing-form .error,
.cmatgame-myaccount-billing-form .cmg-subscription-error,
.cmatgame-myaccount-billing-form label.error,
.cmatgame-myaccount-billing-form label.messages--error,
body.page-signup .subscribe-outer-container [role=contentinfo] [role=alert],
body.page-signup .error,
body.page-signup .cmg-subscription-error,
body.page-signup label.error,
body.page-signup label.messages--error,
body.page-user .subscribe-outer-container [role=contentinfo] [role=alert],
body.page-user .error,
body.page-user .cmg-subscription-error,
body.page-user label.error,
body.page-user label.messages--error,
body.section-user-admin .subscribe-outer-container [role=contentinfo] [role=alert],
body.section-user-admin .error,
body.section-user-admin .cmg-subscription-error,
body.section-user-admin label.error,
body.section-user-admin label.messages--error,
body.section-user-admin.not-active-user .subscribe-outer-container [role=contentinfo] [role=alert],
body.section-user-admin.not-active-user .error,
body.section-user-admin.not-active-user .cmg-subscription-error,
body.section-user-admin.not-active-user label.error,
body.section-user-admin.not-active-user label.messages--error {
  background-color: transparent;
  color: #FA4646;
}
.cmatgame-myaccount-billing-form .signup-page-1-container .form-item-pass,
body.page-signup .signup-page-1-container .form-item-pass,
body.page-user .signup-page-1-container .form-item-pass,
body.section-user-admin .signup-page-1-container .form-item-pass,
body.section-user-admin.not-active-user .signup-page-1-container .form-item-pass {
  margin-bottom: 0;
}
.cmatgame-myaccount-billing-form input[type=submit],
body.page-signup input[type=submit],
body.page-user input[type=submit],
body.section-user-admin input[type=submit],
body.section-user-admin.not-active-user input[type=submit] {
  height: auto;
}
.cmatgame-myaccount-billing-form .form-item-email, .cmatgame-myaccount-billing-form .form-item-pass,
body.page-signup .form-item-email,
body.page-signup .form-item-pass,
body.page-user .form-item-email,
body.page-user .form-item-pass,
body.section-user-admin .form-item-email,
body.section-user-admin .form-item-pass,
body.section-user-admin.not-active-user .form-item-email,
body.section-user-admin.not-active-user .form-item-pass {
  margin-bottom: 10px;
}
.cmatgame-myaccount-billing-form input[type=password],
.cmatgame-myaccount-billing-form input#edit-current-pass,
.cmatgame-myaccount-billing-form input[type=email],
.cmatgame-myaccount-billing-form input[type=text],
body.page-signup input[type=password],
body.page-signup input#edit-current-pass,
body.page-signup input[type=email],
body.page-signup input[type=text],
body.page-user input[type=password],
body.page-user input#edit-current-pass,
body.page-user input[type=email],
body.page-user input[type=text],
body.section-user-admin input[type=password],
body.section-user-admin input#edit-current-pass,
body.section-user-admin input[type=email],
body.section-user-admin input[type=text],
body.section-user-admin.not-active-user input[type=password],
body.section-user-admin.not-active-user input#edit-current-pass,
body.section-user-admin.not-active-user input[type=email],
body.section-user-admin.not-active-user input[type=text] {
  width: 232px;
  background: #ffffff;
  border-radius: 5px;
  border: #aaafb2 1px solid;
  height: 40px;
  padding-left: 8px;
}
.cmatgame-myaccount-billing-form input[type=password] ::placeholder,
.cmatgame-myaccount-billing-form input#edit-current-pass ::placeholder,
.cmatgame-myaccount-billing-form input[type=email] ::placeholder,
.cmatgame-myaccount-billing-form input[type=text] ::placeholder,
body.page-signup input[type=password] ::placeholder,
body.page-signup input#edit-current-pass ::placeholder,
body.page-signup input[type=email] ::placeholder,
body.page-signup input[type=text] ::placeholder,
body.page-user input[type=password] ::placeholder,
body.page-user input#edit-current-pass ::placeholder,
body.page-user input[type=email] ::placeholder,
body.page-user input[type=text] ::placeholder,
body.section-user-admin input[type=password] ::placeholder,
body.section-user-admin input#edit-current-pass ::placeholder,
body.section-user-admin input[type=email] ::placeholder,
body.section-user-admin input[type=text] ::placeholder,
body.section-user-admin.not-active-user input[type=password] ::placeholder,
body.section-user-admin.not-active-user input#edit-current-pass ::placeholder,
body.section-user-admin.not-active-user input[type=email] ::placeholder,
body.section-user-admin.not-active-user input[type=text] ::placeholder {
  line-height: normal;
}
.cmatgame-myaccount-billing-form input[type=file],
body.page-signup input[type=file],
body.page-user input[type=file],
body.section-user-admin input[type=file],
body.section-user-admin.not-active-user input[type=file] {
  background: none;
  border-radius: none;
  border: none;
}
.cmatgame-myaccount-billing-form label[for=edit-stripe-number],
body.page-signup label[for=edit-stripe-number],
body.page-user label[for=edit-stripe-number],
body.section-user-admin label[for=edit-stripe-number],
body.section-user-admin.not-active-user label[for=edit-stripe-number] {
  position: relative;
  top: -4px;
}
.cmatgame-myaccount-billing-form .card-number-input,
body.page-signup .card-number-input,
body.page-user .card-number-input,
body.section-user-admin .card-number-input,
body.section-user-admin.not-active-user .card-number-input {
  width: 240px;
  border-radius: 5px;
  border: #aaafb2 1px solid;
  height: 40px;
  background: #ffffff;
  line-height: 30px;
}
.cmatgame-myaccount-billing-form .card-number-input.error,
body.page-signup .card-number-input.error,
body.page-user .card-number-input.error,
body.section-user-admin .card-number-input.error,
body.section-user-admin.not-active-user .card-number-input.error {
  width: 238px;
}
.cmatgame-myaccount-billing-form .exp-month-select,
body.page-signup .exp-month-select,
body.page-user .exp-month-select,
body.section-user-admin .exp-month-select,
body.section-user-admin.not-active-user .exp-month-select {
  width: 105px;
  background: #ffffff;
  border-radius: 5px;
  border: #aaafb2 1px solid;
  height: 40px;
}
.cmatgame-myaccount-billing-form .exp-month-select.error,
body.page-signup .exp-month-select.error,
body.page-user .exp-month-select.error,
body.section-user-admin .exp-month-select.error,
body.section-user-admin.not-active-user .exp-month-select.error {
  width: 103px;
}
.cmatgame-myaccount-billing-form .address-zip-input,
body.page-signup .address-zip-input,
body.page-user .address-zip-input,
body.section-user-admin .address-zip-input,
body.section-user-admin.not-active-user .address-zip-input {
  width: 105px;
  background: #ffffff;
  border-radius: 5px;
  border: #aaafb2 1px solid;
  height: 40px;
}
.cmatgame-myaccount-billing-form .address-zip-input.error,
body.page-signup .address-zip-input.error,
body.page-user .address-zip-input.error,
body.section-user-admin .address-zip-input.error,
body.section-user-admin.not-active-user .address-zip-input.error {
  width: 103px;
}
.cmatgame-myaccount-billing-form #address-zip-element input,
body.page-signup #address-zip-element input,
body.page-user #address-zip-element input,
body.section-user-admin #address-zip-element input,
body.section-user-admin.not-active-user #address-zip-element input {
  padding: 3px;
}
.cmatgame-myaccount-billing-form #address-zip-element input iframe,
body.page-signup #address-zip-element input iframe,
body.page-user #address-zip-element input iframe,
body.section-user-admin #address-zip-element input iframe,
body.section-user-admin.not-active-user #address-zip-element input iframe {
  position: relative;
  left: 3px;
}
.cmatgame-myaccount-billing-form .signup-page p.login-text,
body.page-signup .signup-page p.login-text,
body.page-user .signup-page p.login-text,
body.section-user-admin .signup-page p.login-text,
body.section-user-admin.not-active-user .signup-page p.login-text {
  text-align: center;
  margin-bottom: 20px;
  clear: both;
  font-weight: normal;
  font-size: 15px;
  color: #F1F2AC;
}
.cmatgame-myaccount-billing-form .signup-page #edit-bottom-text,
body.page-signup .signup-page #edit-bottom-text,
body.page-user .signup-page #edit-bottom-text,
body.section-user-admin .signup-page #edit-bottom-text,
body.section-user-admin.not-active-user .signup-page #edit-bottom-text {
  position: relative;
  top: 35px;
}
.cmatgame-myaccount-billing-form .js-form-type-checkbox.js-form-item-tos,
body.page-signup .js-form-type-checkbox.js-form-item-tos,
body.page-user .js-form-type-checkbox.js-form-item-tos,
body.section-user-admin .js-form-type-checkbox.js-form-item-tos,
body.section-user-admin.not-active-user .js-form-type-checkbox.js-form-item-tos {
  width: 240px;
  margin-bottom: 20px;
}

.col-sm-6.checkbox {
  margin-bottom: 40px !important;
}

.js-form-item-contact.form-check {
  position: relative;
  height: 130px;
}
.js-form-item-contact.form-check small {
  position: relative;
  top: 30px;
}

body.path-signup-b2df5a33.page-signup .subscribe-outer-container h1 {
  font-size: 50px;
  color: #5fa2c4;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
  margin-bottom: 20px;
}
body.path-signup-b2df5a33.page-signup .subscribe-outer-container .form-item {
  margin-bottom: 20px;
}
body.path-signup-b2df5a33.page-signup .subscribe-outer-container .error {
  font-weight: bold;
}

.cmatgame-myaccount-billing-form {
  background: none !important;
  margin: 0;
}

.cmatgame-myaccount-billing-form,
.cmatgame-new-signup-form,
.cmatgame-reactivation-signup-form {
  margin: 30px;
  font-size: 0.75rem;
  color: #97a3a8;
}
.cmatgame-myaccount-billing-form a,
.cmatgame-new-signup-form a,
.cmatgame-reactivation-signup-form a {
  color: #5fa3c5;
  border-bottom: 1px solid #5fa3c5;
}
.cmatgame-myaccount-billing-form a:active, .cmatgame-myaccount-billing-form a:hover,
.cmatgame-new-signup-form a:active,
.cmatgame-new-signup-form a:hover,
.cmatgame-reactivation-signup-form a:active,
.cmatgame-reactivation-signup-form a:hover {
  color: #3c6980;
  text-decoration: none;
  border-bottom: 1px solid #3c6980;
}
.cmatgame-myaccount-billing-form .signup-text-top,
.cmatgame-new-signup-form .signup-text-top,
.cmatgame-reactivation-signup-form .signup-text-top {
  display: none;
  font-size: 18.5px;
  color: #2a445d;
  font-weight: 600;
  letter-spacing: 3px;
}
.cmatgame-myaccount-billing-form .unlock-no-ads-mode,
.cmatgame-new-signup-form .unlock-no-ads-mode,
.cmatgame-reactivation-signup-form .unlock-no-ads-mode {
  font-size: 0;
  background: url("../images/unlock-no-ads-mode.png");
  display: block;
  width: 100%;
  height: 41px;
  margin-top: 15px;
  background-size: cover;
}
.cmatgame-myaccount-billing-form .__PrivateStripeElement,
.cmatgame-new-signup-form .__PrivateStripeElement,
.cmatgame-reactivation-signup-form .__PrivateStripeElement {
  top: 10px;
  left: 10px;
}
.cmatgame-myaccount-billing-form .cmg-subscription-error,
.cmatgame-myaccount-billing-form .messages--error,
.cmatgame-new-signup-form .cmg-subscription-error,
.cmatgame-new-signup-form .messages--error,
.cmatgame-reactivation-signup-form .cmg-subscription-error,
.cmatgame-reactivation-signup-form .messages--error {
  width: 100%;
}
.cmatgame-myaccount-billing-form input::placeholder,
.cmatgame-new-signup-form input::placeholder,
.cmatgame-reactivation-signup-form input::placeholder {
  font-size: 15px;
  color: #333 !important;
}
.cmatgame-myaccount-billing-form .form-item.js-form-type-checkbox.checkboxerror,
.cmatgame-new-signup-form .form-item.js-form-type-checkbox.checkboxerror,
.cmatgame-reactivation-signup-form .form-item.js-form-type-checkbox.checkboxerror {
  width: 236px;
}
.cmatgame-myaccount-billing-form .stripe-payment-area,
.cmatgame-new-signup-form .stripe-payment-area,
.cmatgame-reactivation-signup-form .stripe-payment-area {
  margin-bottom: 10px;
}

.btn {
  border-radius: 5px;
  display: inline-block;
  cursor: pointer;
  color: #FFF;
  font-family: "ProximaNovaBold";
  text-transform: uppercase;
  font-size: 16px;
  padding-top: 16px;
  padding-bottom: 16px;
  text-decoration: none;
  border: 0;
}
.btn:active {
  position: relative;
  top: 1px;
}
.btn:hover {
  text-decoration: none;
}
.btn.reset-password-form-go {
  margin-top: 40px;
}

.btn.login,
.button.button--primary {
  color: #ffffff;
  box-shadow: 0 10px 14px -7px #9e9c95;
  background: linear-gradient(to bottom, #71b3cf 5%, #4e92b9 100%);
  background-color: #71b3cf;
  text-shadow: 1px 2px 0 #8a7642;
  width: 240px;
}
.btn.login:hover,
.button.button--primary:hover {
  background: linear-gradient(to bottom, #4e92b9 5%, #71b3cf 100%);
  background-color: #4e92b9;
}

.btn.sign-up {
  color: #ffffff;
  box-shadow: 0 8px 10px -7px #433822;
  background: linear-gradient(to bottom, #f8ce68 5%, #f4b849 60%);
  background-color: #f4b848;
  text-shadow: 1px 1px 0 #624704;
  width: 240px;
}
.btn.sign-up:hover {
  background: linear-gradient(to bottom, #f4b849 5%, #f8ce68 60%);
  background-color: #f4b849;
}
.btn.sign-up.continue-button {
  margin-bottom: 40px;
  clear: both;
}

body.path-user-password input.form-placeholder-include.form-text {
  margin: 20px auto 0;
}
body.path-user-password p {
  margin-top: 20px;
}

body.page-user-login .subscribe-outer-container,
body.path-user-password.section-user-admin.not-active-user .subscribe-outer-container,
body.section-user-admin .subscribe-outer-container {
  width: 320px;
}

.subscription-info h1, .subscription-info h2 {
  width: 240px;
}

body.section-user-admin .subscribe-outer-container,
body.active-user.subscribe-user .subscribe-outer-container,
body.page-signup .subscribe-outer-container,
body.section-user-admin.not-active-user .subscribe-outer-container {
  width: 320px;
}
body.section-user-admin .subscribe-outer-container .form-item,
body.active-user.subscribe-user .subscribe-outer-container .form-item,
body.page-signup .subscribe-outer-container .form-item,
body.section-user-admin.not-active-user .subscribe-outer-container .form-item {
  margin: 0;
  margin-bottom: 10px;
}
body.section-user-admin .subscribe-outer-container .payment-info,
body.section-user-admin .subscribe-outer-container .signup-user-info-container,
body.active-user.subscribe-user .subscribe-outer-container .payment-info,
body.active-user.subscribe-user .subscribe-outer-container .signup-user-info-container,
body.page-signup .subscribe-outer-container .payment-info,
body.page-signup .subscribe-outer-container .signup-user-info-container,
body.section-user-admin.not-active-user .subscribe-outer-container .payment-info,
body.section-user-admin.not-active-user .subscribe-outer-container .signup-user-info-container {
  margin-bottom: 10px;
}
body.section-user-admin .row,
body.active-user.subscribe-user .row,
body.page-signup .row,
body.section-user-admin.not-active-user .row {
  display: flex;
  flex-wrap: wrap;
}
body.section-user-admin .row .col,
body.active-user.subscribe-user .row .col,
body.page-signup .row .col,
body.section-user-admin.not-active-user .row .col {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 1;
  margin: 0 10px;
}
body.section-user-admin .row .col.col-sm-1,
body.active-user.subscribe-user .row .col.col-sm-1,
body.page-signup .row .col.col-sm-1,
body.section-user-admin.not-active-user .row .col.col-sm-1 {
  max-width: calc(100% / 12);
}
body.section-user-admin .row .col.col-sm-2,
body.active-user.subscribe-user .row .col.col-sm-2,
body.page-signup .row .col.col-sm-2,
body.section-user-admin.not-active-user .row .col.col-sm-2 {
  max-width: calc(100% / 12 * 2);
}
body.section-user-admin .row .col.col-sm-3,
body.active-user.subscribe-user .row .col.col-sm-3,
body.page-signup .row .col.col-sm-3,
body.section-user-admin.not-active-user .row .col.col-sm-3 {
  max-width: calc(100% / 12 * 3);
}
body.section-user-admin .row .col.col-sm-4,
body.active-user.subscribe-user .row .col.col-sm-4,
body.page-signup .row .col.col-sm-4,
body.section-user-admin.not-active-user .row .col.col-sm-4 {
  max-width: calc(100% / 12 * 4);
}
body.section-user-admin .row .col.col-sm-5,
body.active-user.subscribe-user .row .col.col-sm-5,
body.page-signup .row .col.col-sm-5,
body.section-user-admin.not-active-user .row .col.col-sm-5 {
  max-width: calc(100% / 12 * 5);
}
.text-align-left {
  text-align: left;
}

.pt-30 {
  padding-top: 30px;
}

.pt-40 {
  padding-top: 40px;
}

.pb-40 {
  padding-bottom: 25px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mt-40 {
  margin-top: 40px;
}

.page-myaccount .cmatgame-myaccount-billing-form .fieldset-wrapper {
  position: relative;
}
.page-myaccount .cmatgame-myaccount-billing-form .fieldset-wrapper .title-expiration-date {
  left: 2px;
}
.page-myaccount .cmatgame-myaccount-billing-form .fieldset-wrapper .card-number-input {
  top: 0;
  background: #ffffff;
  border: 1px solid #72b3f3;
}
.page-myaccount .cmatgame-myaccount-billing-form .fieldset-wrapper .main-column .inside .exp-month-select {
  background: #ffffff;
}

.page-myaccount .cmatgame-myaccount-login-form input,
.page-myaccount .cmatgame-myaccount-pass-form input {
  color: #ffffff;
}
.page-myaccount .cmatgame-myaccount-login-form input::placeholder,
.page-myaccount .cmatgame-myaccount-pass-form input::placeholder {
  color: #ffffff;
}

.page-myaccount #cmatgame-myaccount-login-form,
.page-myaccount .cmatgame-messages-container {
  margin-top: 20px;
  margin-bottom: 10px;
}
.page-myaccount #block-cmatgame-cmatgame-system-main {
  padding-bottom: 50px;
}
.page-myaccount .cmatgame-messages-container {
  padding-top: 10px;
}
.page-myaccount .cmatgame-myaccount-title {
  background: transparent none repeat scroll 0 0;
  color: #fff552;
  font-size: 25px;
  text-transform: uppercase;
  letter-spacing: 1px;
  line-height: 35px;
  text-align: center;
  text-shadow: 0 3px 2px rgba(0, 0, 0, 0.3);
}
.page-myaccount #login-email-label-wrapper {
  margin-top: 20px;
  margin-bottom: 5px;
}
.page-myaccount .main-column .inside .form-actions input[type=submit] {
  border-radius: 5px;
  color: black;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  font-weight: bold;
  height: 30px;
  position: relative;
}
.page-myaccount .main-column .inside .form-type-password input[type=password],
.page-myaccount .main-column .inside .form-type-textfield input[type=text] {
  background: #3f97ef none repeat scroll 0 0;
  border: 1px solid #72b3f3;
  border-radius: 6px;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.2);
  color: #fff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  height: 25px;
  margin-left: 8px;
  width: 233px;
  padding-left: 5px;
  padding-right: 5px;
}

.page-myaccount .main-column .subscribe-outer-container-mobile h1, .page-myaccount .main-column .pleasetryagain {
  font-size: 24px;
  font-family: "Helvetica", sans-serif;
  color: #fff552;
  font-weight: bold;
  text-shadow: 0px 3px 2px rgba(0, 0, 0, 0.3);
  text-align: center;
  letter-spacing: 1.4px;
  margin-bottom: 0;
  padding-bottom: 0;
  border: none;
}
.page-myaccount .main-column div[role=contentinfo] {
  padding-top: 10px;
}
.page-myaccount .main-column .inside {
  font-family: Arial Black, sans-serif;
  background: #358adf;
  border-radius: 8px;
  opacity: 0.9;
  text-align: center;
  color: #ffffff;
}
.page-myaccount .main-column .inside .form-item {
  margin: 0;
}
.page-myaccount .main-column .inside .planet-top {
  margin-left: 0;
  margin-top: -30px;
}
.page-myaccount .main-column .inside .pane-title {
  background: transparent none repeat scroll 0 0;
  color: #fff552;
  font-size: 33px;
  letter-spacing: 1px;
  line-height: 35px;
  margin-top: 20px;
  text-align: center;
  text-shadow: 0 3px 2px rgba(0, 0, 0, 0.3);
}
.page-myaccount .main-column .inside .info-wrapper {
  display: inline;
  color: #fff552;
  font-size: 21px;
  letter-spacing: 1px;
  line-height: 65px;
  text-align: center;
  text-shadow: 0 3px 2px rgba(0, 0, 0, 0.3);
}
.page-myaccount .main-column .inside .edit-wrapper {
  position: relative;
  top: -40px;
}
.page-myaccount .main-column .inside .edit-wrapper .form-submit {
  background: transparent none repeat scroll 0 0;
  border: medium none;
  box-shadow: none;
  padding-left: 25px;
  color: #22ff17;
  font-family: helvetica;
}
.page-myaccount .main-column .inside .myacct-show-item {
  display: inline;
}
.page-myaccount .main-column .inside .myacct-hide-item {
  display: none;
}
.page-myaccount .main-column .inside .form-type-textfield {
  display: inline;
}
.page-myaccount .main-column .inside .form-item > select {
  border-radius: 8px;
}
.page-myaccount .main-column .inside .email_label,
.page-myaccount .main-column .inside .myacct-field-label {
  color: #cce5ff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  font-size: 16px;
  letter-spacing: 0.7px;
  margin-right: 10px;
  display: inline-block;
}
.page-myaccount .main-column .inside .email_label.subscription-status,
.page-myaccount .main-column .inside .myacct-field-label.subscription-status {
  margin-top: 20px;
}
.page-myaccount .main-column .inside .email_value,
.page-myaccount .main-column .inside .myacct-field-value {
  color: #fff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  font-size: 16px;
  letter-spacing: 0.7px;
  margin-right: 10px;
  display: inline;
}
.page-myaccount .main-column .inside .email_value.inactive,
.page-myaccount .main-column .inside .myacct-field-value.inactive {
  color: red;
  background: white;
  padding: 2px 5px 0;
  border-radius: 5px;
}
.page-myaccount .main-column .inside .email_value.address-city,
.page-myaccount .main-column .inside .email_value.address-state,
.page-myaccount .main-column .inside .email_value.address-zip,
.page-myaccount .main-column .inside .myacct-field-value.address-city,
.page-myaccount .main-column .inside .myacct-field-value.address-state,
.page-myaccount .main-column .inside .myacct-field-value.address-zip {
  margin-right: 0;
}
.page-myaccount .main-column #edit-billing-address,
.page-myaccount .main-column #edit-billing-card,
.page-myaccount .main-column #edit-billing-name,
.page-myaccount .main-column .form-type-password {
  margin-bottom: 15px;
}
.page-myaccount .main-column #password-stars {
  vertical-align: -moz-middle-with-baseline;
}
.page-myaccount .main-column #edit-status {
  margin-bottom: 10px;
}
.page-myaccount .main-column #edit-status2 {
  clear: left;
  float: left;
}
.page-myaccount .main-column #edit-status3 {
  clear: left;
  float: left;
  font-size: 5px;
}
.page-myaccount .main-column .form-required {
  display: none;
}
.page-myaccount .main-column .form-actions {
  margin-top: 20px;
}
.page-myaccount .main-column .form-actions #edit-submit-user-email {
  background: #42ff95 none repeat scroll 0 0;
  left: 52px;
  width: 60px;
}
.page-myaccount .main-column .form-actions #edit-email-edit-cancel {
  background: #70bbf2 none repeat scroll 0 0;
  left: 45px;
  width: 70px;
}
.page-myaccount .main-column .form-actions #edit-password-submit {
  background: #42ff95 none repeat scroll 0 0;
  left: 47px;
  width: 60px;
}
.page-myaccount .main-column .form-actions #edit-password-cancel {
  background: #70bbf2 none repeat scroll 0 0;
  width: 70px;
}
.page-myaccount .main-column .form-actions #edit-card-submit-cancel {
  background: #70bbf2 none repeat scroll 0 0;
  top: 130px;
  width: 70px;
  font-size: 15px;
}
.page-myaccount .main-column .form-actions #edit-card-submit {
  background: #42ff95 none repeat scroll 0 0;
  left: 80px;
  width: 60px;
  top: 22px;
  font-size: 15px;
}
.page-myaccount .main-column .form-actions #edit-card-submit.myacct-process-item {
  background: url("/sites/cmatgame/files/button-processing.png") no-repeat;
  clear: both;
  float: left;
  height: 67px !important;
  width: 370px !important;
  margin-top: 15px;
  margin-bottom: 20px;
  border: none;
  text-indent: -9999px;
  box-shadow: none;
}
.page-myaccount .main-column .form-actions #subscription_plan_submit_wrapper .form-submit {
  background: #42ff95 none repeat scroll 0 0;
}
.page-myaccount .main-column .form-actions #edit-donot-renew-submit {
  background: #42ff95 none repeat scroll 0 0;
  width: 60px;
}
.page-myaccount .main-column .form-actions #edit-donot-renew-cancel {
  background: #70bbf2 none repeat scroll 0 0;
  width: 70px;
  margin-right: 10px;
}
.page-myaccount .main-column #edit-donot-renew-actions {
  margin-top: 10px;
}
.page-myaccount .main-column #subscription_plan_submit_wrapper {
  display: inline;
}
.page-myaccount .main-column #edit-donotrenew-submit-edit,
.page-myaccount .main-column #edit-signmeout-submit,
.page-myaccount .main-column .footer-text-faq,
.page-myaccount .main-column .footer-text-support {
  display: inline-block;
  background: transparent none repeat scroll 0 0;
  border: medium none;
  box-shadow: none;
  color: #22ff17;
  font-family: helvetica;
  margin-top: 20px;
}
.page-myaccount .main-column #edit-donotrenew-submit-edit a,
.page-myaccount .main-column #edit-signmeout-submit a,
.page-myaccount .main-column .footer-text-faq a,
.page-myaccount .main-column .footer-text-support a {
  font-family: helvetica;
  color: #22ff17;
}
.page-myaccount .main-column .browser-text {
  color: #fff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  font-size: 13px;
  letter-spacing: 0.7px;
}
.page-myaccount .main-column .name-description {
  color: #cce5ff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  font-size: 0.85em;
  letter-spacing: 0.7px;
}
.page-myaccount .main-column .title-address,
.page-myaccount .main-column .title-card-number,
.page-myaccount .main-column .title-cardholder,
.page-myaccount .main-column .title-city,
.page-myaccount .main-column .title-expiration-date,
.page-myaccount .main-column .title-state,
.page-myaccount .main-column .title-zip {
  color: #cce5ff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  font-size: 16px;
  font-weight: normal;
  letter-spacing: 0.7px;
  margin-right: 8px;
}
.page-myaccount .main-column .title-state,
.page-myaccount .main-column .title-zip {
  font-size: 0.75rem;
  margin-left: 10px;
  margin-right: 5px;
}
.page-myaccount .main-column .cardholder-name-input {
  background: #52a5f8 none repeat scroll 0 0;
  border: 1px solid #72b3f3;
  border-radius: 6px;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.2);
  color: #fff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  height: 25px;
  margin-right: 5px;
  width: 230px;
}
.page-myaccount .main-column .form-item.form-type-textfield > label {
  display: inline;
}
.page-myaccount .main-column .state-select {
  background: #52a5f8 none repeat scroll 0 0;
  border: 1px solid #72b3f3;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.2);
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  height: 25px;
  width: 80px;
}
.page-myaccount .main-column #edit-stripe-address-administrative-area > option,
.page-myaccount .main-column #edit-stripe-expiry-month > option,
.page-myaccount .main-column #edit-stripe-expiry-year > option {
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
}
.page-myaccount .main-column .exp-month-select {
  border: 1px solid #72b3f3;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.2);
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
}
.page-myaccount .main-column .exp-year-select {
  background: #52a5f8 none repeat scroll 0 0;
  border: 1px solid #72b3f3;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.2);
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  margin-left: 10px;
}
.page-myaccount .main-column .form-item-tos {
  color: #cce5ff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  font-size: 16px;
  font-weight: normal;
  letter-spacing: 0.7px;
}
.page-myaccount .main-column .form-item-tos > label {
  color: #cce5ff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  font-size: 16px;
  font-weight: normal;
  letter-spacing: 0.7px;
}
.page-myaccount .main-column .form-item-tos > label a,
.page-myaccount .main-column .form-item-tos a {
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  font-size: 16px;
  font-weight: normal;
  letter-spacing: 0.7px;
  color: #31a2db;
  outline: medium none;
  text-decoration: none;
}
.page-myaccount .main-column #edit-stripe-name {
  width: 215px;
}
.page-myaccount .main-column #edit-stripe-address-thoroughfare {
  width: 390px;
}
.page-myaccount .main-column #edit-stripe-address-locality {
  width: 130px;
}
.page-myaccount .main-column #edit-stripe-address-postal-code {
  width: 60px;
  padding-right: 0;
  margin-right: 0;
}
.page-myaccount .main-column #edit-stripe-number {
  width: 270px;
}
.page-myaccount .main-column .card-area {
  margin-top: 0;
}
.page-myaccount .main-column .address-area {
  margin-top: 10px;
}
.page-myaccount .main-column #footer-edit-wrapper {
  height: 46px;
  margin-top: 20px;
}
.page-myaccount .main-column #edit-faq,
.page-myaccount .main-column #edit-support {
  margin: 0;
}
.page-myaccount .main-column #edit-billing-rate {
  clear: left;
}
.page-myaccount .main-column #edit-billing-price {
  clear: left;
}
.page-myaccount .main-column #edit-billing-price .myacct-field-label {
  margin-right: 5px;
}
.page-myaccount .main-column #edit-billing-name {
  clear: left;
}
.page-myaccount .main-column #edit-billing-address {
  clear: left;
}
.page-myaccount .main-column #edit-billing-address2 {
  clear: left;
  float: left;
}
.page-myaccount .main-column #edit-billing-card {
  clear: left;
}
.page-myaccount .main-column .billing-address-label {
  margin-right: 2px;
}
.page-myaccount .main-column .address-line2 {
  position: relative;
  left: 52px;
}
.page-myaccount .main-column #edit-email-edit {
  position: relative;
  left: 60px;
}
.page-myaccount .main-column #edit-password-edit {
  position: relative;
  left: 80px;
}
.page-myaccount .main-column #edit-billing-edit {
  position: relative;
  left: 65px;
}
.page-myaccount .main-column #billing-title,
.page-myaccount .main-column #email-edit-wrapper,
.page-myaccount .main-column #password-edit-wrapper {
  max-height: 65px;
}
.page-myaccount .main-column .pane-cmatgame-subscription-myaccount-password ::-moz-placeholder,
.page-myaccount .main-column .pane-cmatgame-subscription-myaccount-password ::-webkit-input-placeholder {
  color: #fff;
}
.page-myaccount .main-column input[type=password],
.page-myaccount .main-column input[type=text] {
  background: #3f97ef none repeat scroll 0 0;
  border: 1px solid #72b3f3;
  border-radius: 6px;
  box-shadow: 2px 3px 2px rgba(0, 0, 0, 0.2);
  color: #fff;
  font-family: Helvetica, Arial, "Nimbus Sans L", sans-serif;
  height: 25px;
  margin: 5px auto;
  width: 233px;
  padding-left: 5px;
  padding-right: 5px;
}

.form-check {
  position: relative;
  text-align: left;
}
.form-check .form-check-label {
  padding-left: 30px;
  color: #97a3a8;
  position: absolute;
  top: 3px;
  min-width: 200px;
}
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  border-radius: 5px;
  border: #aaafb2 1px solid;
  background: #ffffff;
  z-index: 1;
}
.checkmark:after {
  left: 6px;
  top: 0px;
  width: 5px;
  height: 13px;
  border: solid #ffffff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  content: "";
  position: absolute;
  display: none;
}

input[type=checkbox] {
  position: absolute;
  left: 0;
  width: 20px;
  height: 20px;
  z-index: 2;
  opacity: 0;
}
input[type=checkbox]:hover {
  cursor: pointer;
}

input ~ .checkmark {
  background-color: #ffffff;
}
input:checked ~ .checkmark {
  background-color: #71b3cf;
}
input:checked ~ .checkmark:after {
  display: block;
}

.checkboxerror input:not(:checked) ~ .checkmark {
  border: 2px solid #fa4646;
}
.checkboxerror input:checked ~ .checkmark {
  background-color: #71b3cf;
  border: #aaafb2 1px solid;
}
.checkboxerror input:checked ~ .checkmark:after {
  display: block;
}
.checkboxerror #tos-error {
  left: 30px;
  position: absolute;
  top: 20px;
}

@media (min-device-width: 640px) and (orientation: landscape) {
  /* Landscape styles */
  .android-banner-tablet-area {
    height: 90px;
    width: 110%;
    background: #27394f;
    position: relative;
    left: -35px;
  }
  .android-banner-tablet-area .android-tablet-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    float: left;
  }
  .android-banner-tablet-area .android-tablet-image-container, .android-banner-tablet-area .google-play-tablet-icon-container {
    display: inline-block;
  }
  .android-banner-tablet-area .android-tablet-image-container {
    width: 70%;
    padding-right: 3%;
    padding-left: 2%;
  }
  .android-banner-tablet-area .google-play-tablet-icon-container {
    width: 20%;
    position: relative;
    top: 15px;
  }
}
/* Portrait */
@media screen and (min-device-width: 641px) {
  .android-banner-tablet-area {
    height: 90px;
    width: 110%;
    background: #27394f;
    position: relative;
    left: -35px;
  }
  .android-banner-tablet-area .android-tablet-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    float: left;
  }
  .android-banner-tablet-area .android-tablet-image-container, .android-banner-tablet-area .google-play-tablet-icon-container {
    display: inline-block;
  }
  .android-banner-tablet-area .android-tablet-image-container {
    width: 65%;
    padding-right: 2%;
    padding-left: 6%;
  }
  .android-banner-tablet-area .google-play-tablet-icon-container {
    width: 15%;
    position: relative;
    top: 15px;
  }
  .android-banner-tablet-area .google-play-icon-img-tablet {
    height: 100%;
    width: 185px;
  }
}
@media screen and (min-device-width: 300px) and (max-device-width: 640px) and (orientation: portrait) {
  .android-banner-phone-area {
    height: 90px;
    width: 100%;
    position: relative;
    top: -26px;
  }

  .android-banner-phone {
    width: 100%;
    height: 100%;
    object-fit: contain;
    float: left;
  }
}
@media screen and (min-device-width: 300px) and (max-device-width: 640px) and (orientation: landscape) {
  .android-banner-phone-area {
    height: 90px;
    width: 100%;
    position: relative;
    top: -10px;
  }

  .android-banner-phone {
    width: 100%;
    height: 100%;
    object-fit: contain;
    float: left;
  }
}
.page-blog {
  color: #FFF;
}
.page-blog .blog-row {
  clear: both;
  margin: 5px auto;
  padding: 5px 0px;
}
.page-blog .blog-row .blog-post-image {
  float: left;
}
.page-blog .blog-row .blog-post-image img {
  border-radius: 10px;
  padding-right: 0px;
  width: 135px;
  height: auto;
  margin-right: 10px;
}
.page-blog .blog-row .blog-post-title {
  font-size: 1.2rem;
}
.page-blog .blog-row .blog-post-title a {
  color: #46b8fd;
}
.page-blog .blog-row .blog-info {
  font-size: 0.5rem;
  padding: 2px;
  display: none;
}
.page-blog a.feed-icon {
  display: none;
}
.page-blog nav.pager {
  color: #46b8fd;
  clear: both;
  display: block;
  margin: 20px 0;
  top: 5px;
  position: relative;
  left: 10px;
  font-size: 1rem;
}
.page-blog nav.pager li {
  display: inline-block;
}
.page-blog nav.pager li a {
  color: #46b8fd;
}

.node-type-blog-post {
  color: #FFF;
}
@media screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .node-type-blog-post iframe {
    width: 350px;
    height: 300px;
  }
}
@media screen and (min-device-width: 768px) and (max-device-width: 1366px) {
  .node-type-blog-post iframe {
    width: 100% !important;
    margin: 0 auto;
  }
}
.node-type-blog-post .blog-page-title {
  font-size: 1.25rem;
  text-transform: uppercase;
}
.node-type-blog-post .node__meta {
  margin: 20px 0px;
  font-size: 0.7rem;
}
.node-type-blog-post .blog-usernames-blog {
  display: none;
}
.node-type-blog-post .field-item p {
  margin: 10px 0px;
}
.node-type-blog-post .field-item a {
  color: #46b8fd;
}
.node-type-blog-post .blog-info {
  display: none;
}
@media screen and (min-device-width: 375px) and (max-device-width: 415px) and (orientation: portrait) {
  .node-type-blog-post .node__content img {
    width: 320px;
    height: auto;
    margin: 0 auto;
  }
}
@media screen and (min-device-width: 768px) and (max-device-width: 1366px) {
  .node-type-blog-post .node__content img {
    width: 640px;
    height: auto;
    margin: 0 auto;
  }
}

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