.preview_notice {
  display: none;
}


.navbar.primary-accent-bg,
.navbar.navbar-default.primary-accent-bg,
.primary-accent-bg {
  background-color: #000000;
}

.primary-accent-text {
  color: #000000;
}

.secondary-accent-bg {
  background-color: #eb0072;
}

.secondary-accent-text {
  color: #eb0072;
}

.navigation-current-bg {
  background-color: #d9d9d9;
}

.navigation-current-text {
  color: #d9d9d9;
}

.navigation-hover-bg {
  background-color: #ffda00;
}

.navigation-hover-text {
  color: #ffda00;
}

.no-vote-color-bg {
  background-color: #525252;
}

.no-vote-color-text {
  color: #525252;
}


a.ethelo-likert-button.btn.btn-raised.yes-color-bg,
a.ethelo-likert-button.btn.btn-raised.yes-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.yes-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.yes-color-bg:focus,
.yes-color-bg {
  background-color: #18000b;
}

.yes-color-text {
  color: #18000b;
}


a.ethelo-likert-button.btn.btn-raised.no-color-bg,
a.ethelo-likert-button.btn.btn-raised.no-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.no-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.no-color-bg:focus,
.no-color-bg {
  background-color: #d40067;
}

.no-color-text {
  color: #d40067;
}


a.ethelo-likert-button.btn.btn-raised.bin1-color-bg,
a.ethelo-likert-button.btn.btn-raised.bin1-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.bin1-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.bin1-color-bg:focus,
.bin1-color-bg {
  background-color: #18000b;
}

.bin1-color-text {
  color: #18000b;
}

a.ethelo-likert-button.btn.btn-raised.bin2-color-bg,
a.ethelo-likert-button.btn.btn-raised.bin2-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.bin2-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.bin2-color-bg:focus,
.bin2-color-bg {
  background-color: #bc005b;
}

.bin2-color-text {
  color: #bc005b;
}

a.ethelo-likert-button.btn.btn-raised.bin3-color-bg,
a.ethelo-likert-button.btn.btn-raised.bin3-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.bin3-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.bin3-color-bg:focus,
.bin3-color-bg {
  background-color: #470022;
}

.bin3-color-text {
  color: #470022;
}

a.ethelo-likert-button.btn.btn-raised.bin4-color-bg,
a.ethelo-likert-button.btn.btn-raised.bin4-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.bin4-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.bin4-color-bg:focus,
.bin4-color-bg {
  background-color: #8d0044;
}

.bin4-color-text {
  color: #8d0044;
}

a.ethelo-likert-button.btn.btn-raised.bin5-color-bg,
a.ethelo-likert-button.btn.btn-raised.bin5-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.bin5-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.bin5-color-bg:focus,
.bin5-color-bg {
  background-color: #760039;
}

.bin5-color-text {
  color: #760039;
}

a.ethelo-likert-button.btn.btn-raised.bin6-color-bg,
a.ethelo-likert-button.btn.btn-raised.bin6-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.bin6-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.bin6-color-bg:focus,
.bin6-color-bg {
  background-color: #5e002e;
}

.bin6-color-text {
  color: #5e002e;
}

a.ethelo-likert-button.btn.btn-raised.bin7-color-bg,
a.ethelo-likert-button.btn.btn-raised.bin7-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.bin7-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.bin7-color-bg:focus,
.bin7-color-bg {
  background-color: #bc005b;
}

.bin7-color-text {
  color: #bc005b;
}

a.ethelo-likert-button.btn.btn-raised.bin8-color-bg,
a.ethelo-likert-button.btn.btn-raised.bin8-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.bin8-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.bin8-color-bg:focus,
.bin8-color-bg {
  background-color: #2f0017;
}

.bin8-color-text {
  color: #2f0017;
}

a.ethelo-likert-button.btn.btn-raised.bin9-color-bg,
a.ethelo-likert-button.btn.btn-raised.bin9-color-bg:hover,
a.ethelo-likert-button.btn.btn-raised.bin9-color-bg:active,
a.ethelo-likert-button.btn.btn-raised.bin9-color-bg:focus,
.bin9-color-bg {
  background-color: #d40067;
}

.bin9-color-text {
  color: #d40067;
}

body, body h1, body h2, body h3, body h4, body h5, body h6, body .h1, body .h2, body .h3, body .h4 {
  font-family: Open Sans, sans-serif
}

.side-drawer-header {
  background-color: #000000;
}

h1.main {
  color: #000000;
}

.navbar-user-dropdown {
  background-color: #000000
}

.nav-item.active {
  background-color: #d9d9d9;
}

#index-parent:hover,
.nav-item-container:not(.active) .nav-item:not(.disabled):hover,
.nav-item-container:not(.active) .nav-item:not(.disabled):hover,
.nav-item-container:not(.active) .nav-item:not(.disabled):hover {
  background-color: #ffda00;
}

.nav-item.disabled .disabled {
  color: #A0A0A0;
}

.nav-item-container .nav-item-container:not(.active):hover {
  background-color: #ffda00;
}

.btn.btn-raised.btn-default.btn-post,
.btn.btn-raised.btn-default.btn-post:hover,
.btn.btn-raised.btn-default.btn-post:focus,
.btn.btn-raised.btn-default.btn-post:active,
.btn.btn-raised.btn-default.navigation-button,
.btn.btn-raised.btn-default.navigation-button:hover,
.btn.btn-raised.btn-default.navigation-button:focus,
.btn.btn-raised.btn-default.navigation-button:active {
  background-color: #000000;
  color: white;
}

.option-detail-container {
  background-color: #000000;
}

.moderate .filters .active {
  background-color: #000000;
  color: white;
}

.moderate .filters {
  color: #000000;
  background-color: white;
}

/****************************** 
FONT + JS Load
******************************/
/* Change normal text font only, without broadly targeting every div/span */
body,
body p,
body li,
body a,
body label,
body input,
body textarea,
body select,
body button {
  font-family: 'Rubik', Arial, sans-serif !important;
}

/* Change heading font only */
body h1,
body h2,
body h3,
body h4,
body h5,
body h6,
body .h1,
body .h2,
body .h3,
body .h4 {
  font-family: 'Inter', Arial, sans-serif !important;
}

/* Increase the left menu text size slightly while keeping the current Rubik font */
.menu-index .nav-item-container a,
.menu-index .desktoppage-welcome-menulink,
.menu-index .nav-item a {
  font-size: 1.06em !important;
  line-height: 1.35 !important;
}

/****************************** 
PROGRESS BAR
******************************/
/* Voting */
.progress-bar-voting { background-color: #ffffff; }
.progress-bar-voting .progress-bar-voting__fill { background: #eb0072; }

/* Circle */
.progress-bar-voting__percent,
.progress-bar-voting .progress-bar-voting__circle {
  background-color: #FFFFFF !important;
  border-color:  #eb0072 !important; }

/* Circle text */
.progress-bar-voting .progress-bar-voting__circle span {
  color:  #eb0072 !important; }

/****************************** 
CONTENT BUTTON
******************************/

.bluebutton { background-color: #000000 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 4px !important;
  display: inline-block !important;
  padding: 14px 48px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  text-decoration: none !important;
  box-shadow: none !important; }

/****************************** 
LIKERT SURVEY QUESTIONS
******************************/

/* Space below each targeted Likert question */
#q-classroom-likert-fg,
#q-classroom-likert-copy-fg,
#q-need-likert-copy-fg {
  margin-bottom: 18px !important;
}

/* Make the answer options display as a 5-column Likert row on desktop */
#q-classroom-likert-fg .radio-group,
#q-classroom-likert-copy-fg .radio-group,
#q-need-likert-copy-fg .radio-group {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 12px !important;
}

/* Remove extra wrapper spacing/background around radio options */
#q-classroom-likert-fg .radio,
#q-classroom-likert-fg .radio.checked,
#q-classroom-likert-copy-fg .radio,
#q-classroom-likert-copy-fg .radio.checked,
#q-need-likert-copy-fg .radio,
#q-need-likert-copy-fg .radio.checked {
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0;
  width: 100%;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Style each option like a clean button */
#q-classroom-likert-fg .ember-radio-button,
#q-classroom-likert-copy-fg .ember-radio-button,
#q-need-likert-copy-fg .ember-radio-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  padding: 8px 6px !important;
  margin: 0 !important;
  border: 1px solid #C4CCD4;
  border-radius: 8px;
  background: #FFFFFF;
  text-align: center;
  font-size: 12px !important;
  line-height: 1.15 !important;
  font-weight: 500;
  cursor: pointer;
  box-sizing: border-box;
  white-space: nowrap !important;
}

/* Hide default radio circles/check icons so only the custom button style shows */
#q-classroom-likert-fg .ember-radio-button input[type="radio"],
#q-classroom-likert-fg .ember-radio-button .circle,
#q-classroom-likert-fg .ember-radio-button > .check,
#q-classroom-likert-copy-fg .ember-radio-button input[type="radio"],
#q-classroom-likert-copy-fg .ember-radio-button .circle,
#q-classroom-likert-copy-fg .ember-radio-button > .check,
#q-need-likert-copy-fg .ember-radio-button input[type="radio"],
#q-need-likert-copy-fg .ember-radio-button .circle,
#q-need-likert-copy-fg .ember-radio-button > .check {
  display: none !important;
}

/* Hover state */
#q-classroom-likert-fg .ember-radio-button:hover,
#q-classroom-likert-copy-fg .ember-radio-button:hover,
#q-need-likert-copy-fg .ember-radio-button:hover {
  background: #F5F7F8;
  border-color: #9CA7B2;
}

/* Selected state */
#q-classroom-likert-fg .ember-radio-button.checked,
#q-classroom-likert-copy-fg .ember-radio-button.checked,
#q-need-likert-copy-fg .ember-radio-button.checked {
  background: #E9EDF1;
  border: 2px solid #5F6B76;
  box-shadow: none !important;
}

/* Keep text sizing consistent inside options */
#q-classroom-likert-fg .ember-radio-button,
#q-classroom-likert-fg .ember-radio-button span,
#q-classroom-likert-fg .ember-radio-button div,
#q-classroom-likert-fg .ember-radio-button label,
#q-classroom-likert-copy-fg .ember-radio-button,
#q-classroom-likert-copy-fg .ember-radio-button span,
#q-classroom-likert-copy-fg .ember-radio-button div,
#q-classroom-likert-copy-fg .ember-radio-button label,
#q-need-likert-copy-fg .ember-radio-button,
#q-need-likert-copy-fg .ember-radio-button span,
#q-need-likert-copy-fg .ember-radio-button div,
#q-need-likert-copy-fg .ember-radio-button label {
  font-size: 12px !important;
  line-height: 1.1 !important;
}

/* Tighten spacing around the prompt text above each Likert row */
#q-classroom-likert-fg p,
#q-classroom-likert-copy-fg p,
#q-need-likert-copy-fg p,
#q-classroom-likert-fg .question-text,
#q-classroom-likert-copy-fg .question-text,
#q-need-likert-copy-fg .question-text,
#q-classroom-likert-fg strong,
#q-classroom-likert-copy-fg strong,
#q-need-likert-copy-fg strong {
  margin-top: 0 !important;
  margin-bottom: 10px !important;
  line-height: 1.25;
}

/* On mobile, stack the Likert options vertically for readability */
@media (max-width: 768px) {
  #q-classroom-likert-fg,
  #q-classroom-likert-copy-fg,
  #q-need-likert-copy-fg {
    margin-bottom: 14px !important;
  }

  #q-classroom-likert-fg .radio-group,
  #q-classroom-likert-copy-fg .radio-group,
  #q-need-likert-copy-fg .radio-group {
    grid-template-columns: 1fr;
  }

  #q-classroom-likert-fg .ember-radio-button,
  #q-classroom-likert-copy-fg .ember-radio-button,
  #q-need-likert-copy-fg .ember-radio-button {
    min-height: 42px;
    white-space: normal !important;
    font-size: 13px !important;
  }
}

/****************************** 
OPTION SELECT
******************************/

/* Changes the background color of each answer option row */
.bootstrap-collapse-heading.panel-binary {
  background-color: #FAEEF3  !important;
}

/* Lighten Selected Topic Background**/
.bootstrap-collapse-heading.panel-binary .primary-accent-bg.noncollapsible {
  background: #E9EDF1 !important;
  color: #1f1f1f !important;
  border: 1px solid #C7D0D9 !important;
  box-shadow: none !important;
}

.bootstrap-collapse-heading.panel-binary .primary-accent-bg.noncollapsible *,
.bootstrap-collapse-heading.panel-binary .primary-accent-bg.noncollapsible i,
.bootstrap-collapse-heading.panel-binary .primary-accent-bg.noncollapsible span {
  color: #1f1f1f !important;
  fill: #1f1f1f !important;
}

/* Hide the built-in multi-select explainer on all multi-select pages */
.row.binary-many-message-block-container {
  display: none !important;
}

/******************************************
 * GROUP RESULTS 
 ******************************************/

/* Hide pie chart icon + percent text for topic cards on group results page */
.container-fluid.rank1.results-group-page .card.result-card .tab-pie-icon-container,
.container-fluid.rank1.results-group-page .card.result-card .pie-percentage-text {
  display: none !important;
}


/******************************************
 * PERSONAL RESULTS 
 ******************************************/