:root {
    --tm-primary: #19181b;
    --tm-secondary: #d91d4b;
    --tm-pres-bg: #fff;
    /*--tm-pres-bg-hl: #fff;*/
    --tm-pres-title: #666;
    --tm-pres-text: #444;
    --tm-btn-contrast: #fff;
    --tm-btn-contrast-hover: #fff;
    --tm-pres-contrast: #000;
    --tm-pres-contrast-hover: rgba(0, 0, 0, 0.1);
}

body {
    /*background: #ffffff;PRES_BG*/
    background: var(--tm-pres-bg);
    /*color: #444444;PRES_TEXT*/
    color: var(--tm-pres-text);
    min-height: 210px;
}

/************************************/
/* BOOTSTRAP OVERRIDES 				*/
/************************************/

.btn {
    /*font-size: 0.875rem;*/
}

.btn:focus,
button:focus {
    /*box-shadow: none;*/
}

.dropdown-menu {
    padding: 0;
    font-size: 0.915rem;
}

.dropdown-menu>li>a {
    padding: 0.4rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, .15);
}

.dropdown-menu>li:first-child>a {
    border-top-left-radius: 0.375rem;
    border-top-right-radius: 0.375rem;
}

.dropdown-menu>li:last-child>a {
    border-bottom: 0;
    border-bottom-left-radius: 0.375rem;
    border-bottom-right-radius: 0.375rem;
}

.dropdown-item.active,
.dropdown-item:active {
    background: #e9ecef;
    color: #212528;
}

.btn-group-xs>.btn,
.btn-xs {
    padding: 0.35rem 0.4rem;
    font-size: 0.8rem;
    line-height: 1;
    border-radius: 0.2rem;
}

h4,
h5 {
    margin-top: 0.5rem;
}

.modal h5 {
    font-size: 1.1rem;
    margin: 0;
}

.modal {
    color: #212528;
}

.modal-header,
.modal-footer {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.modal.tm-modal-inline {
    display: block;
    position: relative;
    margin-bottom: 1rem;
}
.modal.tm-modal-inline .modal-content {
    background: var(--tm-pres-bg);
}
.modal.tm-modal-inline .modal-title,
.modal.tm-modal-inline .help-block {
    color: var(--tm-pres-text);
}

/* custom extra-extra-small breakpoint */
@media (max-width: 480px) {
    .col-xxs-12 {
        width: 100%;
    }
}


/************************************/
/* GLOBALS			 				*/
/************************************/

.btn-tedme {
    /*background-color: #19181b;/*COLOR_PRIMARY*/
    background-color: var(--tm-primary);
    /*color: #fff;/*BTN_CONTRAST*/
    color: var(--tm-btn-contrast);
}

.btn-tedme.active,
.btn-tedme.focus,
.btn-tedme:active,
.btn-tedme:focus,
.btn-tedme:hover {
    /*background-color: #d91d4b;/*COLOR_SECONDARY*/
    background-color: var(--tm-secondary);
    /*border-color: #d91d4b;/*COLOR_SECONDARY*/
    border-color: var(--tm-secondary);
    /*color: #fff; /*BTN_CONTRAST_HOVER*/
    color: var(--tm-btn-contrast-hover);
}

#css-fallback {
    border: none;
    opacity: 0;
}

.help-block {
    font-weight: normal;
    font-size: 13px;
}

.tedme-red {
    color: #d91d4b;
    font-weight: 700;
}

.wrap-to-center {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

#myAlert {
    position: fixed;
    top: 50px;
    z-index: 999;
    width: 100%;
}
#myAlert .alert {
    max-width: 500px;
    margin: 0 auto;
    padding: 0.75rem 2rem 0.75rem 1rem;
    box-shadow: 0 0 10px #999;
}
#myAlert .alert .btn-close {
    padding: 0;
    margin: 0.5rem;
}

/************************************/
/* LOGIN 							*/
/************************************/

#login-container {
    max-width: 40rem;
    margin: 6rem auto 0 auto;
    padding: 0 1rem;
}

html.iframe #login-container {
    margin-top: 2rem;
}

#login-logo {
    display: block;
    object-fit: contain;
    width: 100%;
    max-width: 20rem;
    max-height: 200px;
    margin: 0 auto 2rem auto;
}

#login-form {
    margin: 0 auto;
    max-width: 18rem;
}

#login-form .input-group {
    flex-wrap: nowrap;
}

#login-form .pin-input {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

#login-form .enter-room {
    font-size: 1.5rem;
    line-height: 1;
}

#pin-error {
    display: block;
    margin-top: 1.25rem;
    white-space: normal;
    line-height: 1.5;
}

#login-form label.h6 {
    font-weight: 600;
    color: var(--tm-primary);
}

#auth-note {
    margin-top: 2rem;
    margin-bottom: 3rem;
    font-size: 14px;
}

#auth-note .card {
    background: rgba(0, 0, 0, 0.1);
    color: var(--tm-pres-text);
}

#auth-note p {
    margin: 0;
}

.mod-link {
    text-align: center;
    margin-top: 1.25rem;
    font-size: 12px;
    /*padding-right: 20px;*/
}

.mod-link a {
    text-decoration: none;
    color: var(--tm-primary);
}

#login-container .btn-tedme:hover {
    background-color: #d91d4b;
}


/* login form and modal-change-room */
.pin-input input {
    font-size: 1.3rem;
    line-height: 1;
/*    border-top-right-radius: 0;*/
/*    border-bottom-right-radius: 0;*/
    border-radius: 0;
}

#auth-pin {
    border-top: 0;
}

.pin-input input:focus {
    box-shadow: none;
}

.pin-input input::placeholder {
    color: #ccc;
    font-size: 1.1rem;
}

#login-header,
#login-footer {
    position: fixed;
    bottom: 0px;
    width: 100%;
    background: #fff;
    background: var(--tm-pres-bg);
    z-index: 999;
    padding-bottom: 5px;
    margin: 0;
}

#login-header {
    display: none;
    top: 0;
    bottom: auto;
}

body.prelogin #login-header {
    display: block;
}

#login-footer a {
    position: relative;
    margin: 0 10px;
    color: #444;
    color: var(--tm-pres-contrast);
}

#login-footer a:not(:last-child)::after {
    content: "";
    position: absolute;
    right: -11px;
    width: 1px;
    height: 20px;
    background: #ddd;
}

#login-footer a:hover {
    border-color: transparent;
    background-color: #eee;
    color: #000;
}

/************************************/
/* HEADER 							*/
/************************************/

#navbar {
    position: fixed;
    top: 0;/* required because sibling has margin-top */
    z-index: 999;
    height: 50px;
    border-radius: 0;
    border: 0;
    background: #ffffff;/*PRES_BG*/
/*    background: var(--tm-pres-bg-hl);*/
    background: var(--tm-pres-bg);
    /*border-bottom: 1px solid #ddd;*/
}

.navbar-logo {
    margin: 5px 5px 0 0;
    height: 40px;
}

#menu-btn {
    font-size: 1.7rem;
    line-height: 1;
    margin-top: 9px;
    padding: 2px 4px;
}

.li-header {
    background: #eee;
    padding: 0.4rem 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, .15);
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    font-weight: 500;
}

#moderator-info .bi {
    margin-right: 5px;
}


/* language dropdown */
#login-lang-switch {
    margin: 0.5rem 0.5rem 0 0;
}
#language-switch {
    margin: 0.75rem 0.75rem 0 0;
}

#login-lang-switch .dropdown-toggle {
    border: 0;
    color: var(--tm-pres-contrast);
}

#login-lang-switch .dropdown-toggle:hover {
    background: #eee;
    color: #000;
}

#login-lang-current,
#language-current {
    margin: 0 5px;
}


/************************************/
/* CONTAINERS 						*/
/************************************/

.full-width {
    width: 100%;
}

body.main.chat-open .full-width {
    padding-right: 350px;
}


/* question/feedback */
#vote-container {
    position: relative;
    padding-bottom: 50px;
}

body:not(.mode-vote) #vote-container {
    /*z-index: 1;*/
    /* TODO check if required to be able to click above media-container */
}


/* slide/video/stream */
#media-container {
    position: absolute;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding-top: 50px;
    padding-bottom: 50px;
}

#questions-container {
    /*background: #ffffff;PRES_BG*/
    background: var(--tm-pres-bg);
    padding-top: 50px;
}

#questions-container .timeline-wrapper {
    padding-bottom: 55px;
}

#chart-container,
#qa-cloud-container {
    position: absolute;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    text-align: center;
    padding-top: 50px;
    padding-bottom: 50px;
}

#auxiliary-container {
    position: relative;
    display: flex;
    justify-content: center;
    overflow-x: auto;
    top: 79%;
    /* for footer, cant use padding/margin */
    border-bottom: 55px solid transparent;
}

#maj-table,
#approval-table,
#writein-table
{
	background: #fff;
	box-shadow: 0 0 8px rgba(0, 0, 0, 0.25);
	margin: 0 auto;
	border-radius: 8px;
    /* margin for shadow, otherwise cut off by overflow-auto */
    margin: 0.5rem;
}

#maj-table {
    min-width: 700px;
}

#maj-table td,
#approval-table td,
#writein-table td
{
	vertical-align: top;
	text-align: left;
	padding: 0.125rem 0.5rem;
}

#maj-table tr:first-child td,
#approval-table tr:first-child td {
	padding-top: 0.25rem;
}

#maj-table tr:last-child td, 
#approval-table tr:last-child td{
	padding-bottom: 0.25rem;
}

#maj-table td:nth-child(2),
#maj-table td:nth-child(4),
#maj-table td:nth-child(6):not(:last-child),
#writein-table td:nth-child(2):not(:last-child),
#writein-table td:nth-child(4):not(:last-child),
#approval-table td:nth-child(1),
#approval-table td:nth-child(3):not(:last-child) {
	border-right: 2px solid #ddd;
}

.note_majority {
	font-size: 80%;
}

.qa-cloud-wrapper {
    bottom: 0;
    height: 100%;
    left: 0;
    right: 0;
}

.qa-cloud-wrapper .timeline-content {
    height: 100%;
    width: 100%;
}

#quiz-container {
    padding-bottom: 50px;
}

#content-wrapper,
#quiz-container,
body.module #modal-question {
    padding-top: 50px; /* has to be padding for pym.js */
}

html.iframe #content-wrapper {
    padding-bottom: 1px; /* otherwise pym ignores margins of btn-send-vote */
}

/* webinar */

body.webinar-stream:not(.mode-quiz-fb) #questions-container {
    position: absolute;
    padding-top: 0;
    top: 50px;
    bottom: 0;
    overflow: scroll;
}

body.webinar-stream.hide-header #questions-container {
    padding-top: 0;
    height: auto;
    top: 0;
}

body.webinar-stream.hide-footer #questions-container {
    bottom: 0;
}

body.webinar-stream:not(.hide-footer) #questions-container .timeline-wrapper {
    /*padding-bottom: 0;*/
}

body.module.module-question #questions-container {
    border: 0;
}

body.module.module-question.module-questionlist #modal-question .modal-header {
    border-bottom: 0;
    padding-bottom: 0;
}

body.module.module-question.module-questionlist #modal-question .modal-body {
    /*padding: 0.5rem 0.75rem 0 0.75rem;*/
}

body.module.module-question.module-questionlist #modal-question .modal-footer {
    padding-top: 0;
    border-top: 0;
/*    border-bottom: 1px solid #e5e5e5;*/
}

body.webinar-stream.mode-vote.chat-open #stream-wrapper {
    width: 100%;
}


/*body.webinar-stream.mode-vote.chat-open #vote-container,*/
body.webinar-stream.chat-open:not(.mode-quiz-fb) #vote-container,
body.webinar-stream.mode-vote.chat-open #chart-container,
body.webinar-stream.mode-questions #vote-container {
    display: none;
}

body.module-question.module-questionlist #questions-container {
/*body.module-question.module-presentation #questions-container {*/
    padding: 0;
}

/************************************/
/* VOTE/FEEDBACK CONTAINER 			*/
/************************************/

#content {
    text-align: center;
    padding: 0.75rem;
    margin: 0 auto;
/*    max-width: 800px;*/
}

#auth-user-name {
    padding: 0.5rem 1rem;
    font-size: 13px;
    font-weight: 400;
}


#content-wrapper h4,
#content-wrapper h5,
#content-wrapper .question-image,
#content-wrapper .matrix-question:nth-child(2),
#content-wrapper .question-cell.checkbox:nth-child(3),
#content-wrapper .ranking-question:nth-child(2),
#content-wrapper .question-cell.radio:nth-child(3) {
    text-align: center;
}

#content-wrapper .question-cell.radio:nth-child(2),
#content-wrapper .question-cell.checkbox:nth-child(2),

/* 2-column view */

#content-wrapper .question-cell.radio:nth-child(5),
#content-wrapper .question-cell.checkbox:nth-child(5) {
    text-align: left;
}

#content-wrapper h4,
#content-wrapper h5,
#chart-container .answers-list h5,
#chart-container .answers-list h6 {
    /*color: #666666;/*PRES_TITLE*/
    color: var(--tm-pres-title);
    padding: 0 2rem;
}

@media (max-width: 600px) {
    #content-wrapper h4,
    #content-wrapper h5,
    #chart-container .answers-list h5,
    #chart-container .answers-list h6 {
        padding: 0 1rem;
    }
}

#presentation-name {
    margin: 1rem 0;
}


/* before/after vote */

.presentation-logo {
    max-width: 100%;
    max-height: 300px;
}

#next-question-message {
    margin-top: 1rem;
}

#next-question-logo {
    max-width: 160px;
    margin: 1rem auto
}

#q-type,
#q-type-webinar {
    display: block;
    width: 100%;
    text-align: center;
}

.badge.label-auth-type,
.badge.label-question {
    background-color: rgba(0, 0, 0, 0.075);
    color: var(--tm-pres-contrast);
    margin-left: 8px;
    font-size: 0.7rem;
    font-weight: 600;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 1em;
}

#q-type .badge:first-child {
    margin: 0;
}


/* PROXY TABLE */

#table-substitutions {
    width: auto;
    min-width: 300px;
    margin: 0 auto;
    font-size: 13px;
    text-align: left;
}

#table-substitutions th,
#table-substitutions td {
    padding: 2px 5px;
}

#table-substitutions td {
    background: #f5f5f5;
    word-break: break-word;
}

#table-substitutions th,
#table-substitutions tr.active>td {
    background: #fff;
    font-weight: 600;
}

#table-substitutions tr.active>td {
    background: #cfc;
}

#table-substitutions tr.blocked {
    color: #999;
}

#table-substitutions .bi-check-lg,
#table-substitutions .bi-x-lg,
#table-substitutions .bi-chevron-right {
    display: none;
}

#table-substitutions tr.voted .bi-check-lg,
#table-substitutions tr.blocked .bi-x-lg,
#table-substitutions tr.active .bi-chevron-right {
    display: inline-block;
    transform: scale(1.25);
}

#table-substitutions tr.voted .bi-check-lg {
    transform: scale(1.5);
}

#table-substitutions td:first-child {
    width: 20px;
    padding-top: 3px;
}

#table-substitutions td:last-child {
    width: 20px;
}

#table-substitutions .bi-chevron-right {
    line-height: 1;
}

#options-table {
    max-width: 500px;
    margin: 1.5rem auto 0 auto;
}

#options-table.ranking,
#options-table.multi-slider {
    max-width: none;
}

#options-table.matrix {
    width: 100%;
    margin-bottom: 1.5rem;
}

#options-table.freetext {
    width: 100%;
}

body.one-word-answer #options-table.freetext .text_field {
    resize: none;
}

#btn-send-vote {
    display: block;
    margin: 1rem auto 2rem auto;
}

#slide-wrapper .question-image img,
.question-image img {
    max-width: 100%;
    max-height: 300px;
}

.question-text,
.answer-option-text,
.answer-option-image {
    padding: 0.5rem;
}

.answer-option-text {
    text-align: left;
}


/* SLIDERS */

.slider {
    display: inline-block;
    width: 100%;
    min-width: 250px;
    max-width: 350px;
    margin-top: 0.25rem;
    cursor: pointer;
}

.slider-value {
    font-size: 1.2rem;
}

.slider-cell {
    /*text-align: center;*/
    padding-bottom: 0.75rem;
}

/* keep the next 2 blocks seperate */
.form-range::-webkit-slider-thumb {
    width: 22px;
    height: 22px;
    margin-top: -6px;
    /*background: #19181b;/*COLOR_PRIMARY*/
    background: var(--tm-primary);
    /*border-color: #19181b;/*COLOR_PRIMARY*/
    border-color: var(--tm-primary);
}

.form-range::-moz-range-thumb {
    width: 22px;
    height: 22px;
    margin-top: -6px;
    /*background: #19181b;/*COLOR_PRIMARY*/
    background: var(--tm-primary);
    /*border-color: #19181b;/*COLOR_PRIMARY*/
    border-color: var(--tm-primary);
}

/* keep the next 2 blocks seperate */
.form-range::-moz-range-runnable-track {
    height: 10px;
}

.form-range::-webkit-slider-runnable-track {
    height: 10px;
}

/* keep the next 2 blocks seperate */
.form-range::-webkit-slider-thumb:active {
    /*background-color: #d91d4b;/*COLOR_SECONDARY*/
    background-color: var(--tm-secondary);
    /*border-color: #d91d4b;/*COLOR_SECONDARY*/
    border-color: var(--tm-secondary);
    /*color: #fff; /*BTN_CONTRAST_HOVER*/
    color: var(--tm-btn-contrast-hover);
}

.form-range::-moz-range-thumb:active {
    /*background-color: #d91d4b;/*COLOR_SECONDARY*/
    background-color: var(--tm-secondary);
    /*border-color: #d91d4b;/*COLOR_SECONDARY*/
    border-color: var(--tm-secondary);
    /*color: #fff; /*BTN_CONTRAST_HOVER*/
    color: var(--tm-btn-contrast-hover);
}

/************************************/
/* FEEDBACK 						*/
/************************************/

body.mode-quiz-fb #content {
    padding-left: 0;
    padding-right: 0;
}

#content h4.section-title {
    padding-top: 2.5rem;
}

#content .section-image {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

#content .question-image {
    margin: 0.5rem auto 2rem auto;
}

#content .section-question .multi-slider {
    width: 100%;
}

#content .section-question label {
    display: block;
    font-size: 1.1rem;
}

#content .section-question > label small {
    font-size: 0.8em;
}

#btn-send-feedback-form,
#show-more-questions {
    margin: 1.5rem 0 2.5rem 0;
}

.fb-preview-success-icon {
    font-size: 2rem;
}

label.matrix-question {
    /*font-size: 90%;*/
    /*margin-top: 10px;*/
}

#content .section-question input[type="text"] {
    max-width: 350px;
    margin: 0 auto;
}
#content .section-question textarea {
    max-width: 500px;
}

#content .section-question table {
    min-width: 200px;
    margin: 0.5rem auto 0 auto;
}
@media (max-width: 400px) {
    #content .section-question table {
        width: 100%;
    }
}
#content .section-question .q-required,
#myAlert .q-required {
    font-weight: 600;
    font-size: 2rem;
    color: #dc3545;
    line-height: 0;
    position: relative;
    top: 5px;
}

.matrix-question,
.multislider-question {
    vertical-align: middle;
}

.matrix-question.answer-option-text {
    text-align: center;
    padding-top: 2rem;
    padding-bottom: 0px;
}

table.multi-slider td.matrix-question {
    padding: 1rem 0.5rem 0.5rem 0;
}

.multislider-question.answer-option-text {
    padding-top: 0;
    word-break: break-word;
}

.matrix-radios {
    /*vertical-align: middle;*/
    /*text-align: center;*/
    /*padding: 10px 0px;*/
    width: 20%;
    /* 5 items without 'N/A' */
}

.matrix-radios>input[type='radio'] {
    height: 20px;
    width: 20px;
    vertical-align: middle;
    cursor: pointer;
}

#numeric-field {
    text-align: center;
    font-size: 20px;
}

td.slide-answer {
    font-size: 1.5rem;
    padding: 0 0.5rem 0.5rem 0;
    vertical-align: top;
}

td.slide-answer img {
    max-height: 250px;
}

td.checkbox-cell {
    /*vertical-align: baseline;*/
    /*padding-left: 10px;*/
    /*padding-top: 18px;*/
    /*width: 1%;*/
    /* causes table to have 100% width */
    /* is required to keep checkboxes/text left aligned*/
    /* or not? */
    width: 30px;
    /*padding-top: 0.5rem;*/
    /*white-space: nowrap;*/
    /*?*/
}

td.checkbox-cell,
td.checkbox-cell input,
td.question-cell {
    cursor: pointer;
}

#containers input[type=checkbox],
#containers input[type=radio] {
    width: 18px;
    height: 18px;
    margin-top: 0.125rem;
    /* default is 0.25em for 16px size */
}

#vote-container .form-check-input:checked {
    /*background: #19181b;/*COLOR_PRIMARY*/
    background-color: var(--tm-primary);
    /*border-color: #19181b;/*COLOR_PRIMARY*/
    border-color: var(--tm-primary);
}

/* change inner check to black */
#vote-container.form-input-dark .form-check-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

/* change inner dot to black */
#vote-container.form-input-dark .form-check-input:checked[type=radio] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23000'/%3e%3c/svg%3e");
}

td.question-cell:not(:first-child) {
    /*min-width: 50px;*/
}

td.question-cell img,
td.ranking-question img,
td.matrix-question img {
    max-width: 300px;
    max-height: 200px;
    margin-top: 0.25rem;
}

td.question-cell img {
    max-width: 500px;
}

td.ranking-question,
td.ranking-select {
    /*height: 50px;  acting as min-height */
    /*vertical-align: middle;*/
    /*padding: 0 10px 10px 0;*/
}

td .ranking-select button:first-child {
    min-width: 100px;
    /*border-right: 1px solid #fff;*/
}

td .ranking-select button:nth-child(2) {
    /*border-left: 1px solid #fff;*/
}

td .ranking-select button.red-border {
    border-color: red;
    -moz-box-shadow: inset 0 0 5px red;
    -webkit-box-shadow: inset 0 0 5px red;
    box-shadow: inset 0 0 5px red;
}

.ranking-select,
.ranking-select button {
    /*color: #000 !important;*/
}

.dec-row {
	display: inline-block;
	margin-right: 2rem;
}

.dec-button {
	border-style: hidden;
	border-radius: 0.2rem;
	background: #eee;
	font-weight: 600;
	width: 7rem;
	height: 1.9rem;
	margin: 0.1rem;
	padding: 0;
	transition: 0.2s;
}
.dec-button:hover {
	background: #ddd;
}

.dec-icons {
	font-size: 24px;
	margin-right: 0.5rem;
}

.nps-row,
.nps-label {
    display: inline-block;
}

.nps-button {
	border-style: hidden;
	border-radius: 0.2rem;
	background: #d8d8d8;
	font-weight: 600;
	width: 1.9rem;
	height: 1.9rem;
	margin: 0.1rem;
	padding: 0;
	transition: 0.2s;
}

.nps-button:hover {
    background: #ddd;
}

.nps-active,
.nps-active:hover {
    border: 0;
    /*background-color: #d91d4b;/*COLOR_SECONDARY*/
    background-color: var(--tm-secondary);
    /*border-color: #d91d4b;/*COLOR_SECONDARY*/
    border-color: var(--tm-secondary);
    /*color: #fff; /*BTN_CONTRAST_HOVER*/
    color: var(--tm-btn-contrast-hover);
}

.nps-icons {
    font-size: 24px;
}

.nps-icons .bi {
    float: left;
    margin-left: 0.25rem;
}

.nps-icons .bi:nth-child(2) {
    float: right;
    margin-left: 0;
    margin-right: 0.25rem;
}

.approval-icons {
    font-size: 24px;
}

.approval-icons .bi {
    float: left;
    margin-left: 0.25rem;
}

.approval-icons .bi:nth-child(2) {
    float: center;
    margin-left: 0.25rem;
    margin-right: 0.25rem;
}

.approval-icons .bi:nth-child(3) {
    float: right;
    margin-left: 0;
    margin-right: 0.25rem;
}

.panachage-select .dropdown-menu {
    max-height: 25rem;
    overflow: auto;
}

.fb-section {
    padding: 1.5rem 0.75rem;
}

.fb-section > * {
    max-width: 800px;
    margin: 0 auto;
}

.fb-section.odd {
    background: rgba(0, 0, 0, 0.05);
}


/************************************/
/* CHART-CONTAINER 					*/
/************************************/

.answers-list {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    padding: 10px;
}

.answers-list table {
    width: 100%;
}

.answers-list tr:first-child td {
    border-top: 1px solid rgba(200, 200, 200, 0.5);
}

.answers-list td {
    padding: 10px 5px;
    vertical-align: top;
    border-bottom: 1px solid rgba(200, 200, 200, 0.5);
    font-size: 15px;
}

.answers-list .answer-icon {
    width: 1%;
    white-space: nowrap;
}

.cloud-title-wrapper {
    position: relative;
    height: 10%;
    width: 100%;
}

.cloud-wrapper {
    position: relative;
    height: 90%;
    width: 100%;
}

.highcharts-label .datalabel b {
    font-weight: 700;
}

.highcharts-tooltip {
    display: none;
}

body.module.module-chart #chart-container {
    display: block !important;
    /*background: red;*/
    padding-bottom: 0;
}

body.module.module-chart.module-vote #chart-container {
    position: relative;
}


/************************************/
/* MODALS 							*/
/************************************/

.modal .btn-tedme {
    background-color: #19181b;/*COLOR_PRIMARY
/*    background-color: var(--tm-primary);*/
    color: #fff;/*BTN_CONTRAST*/
/*    color: var(--tm-btn-contrast);*/
}

.btn-tedme.active,
.btn-tedme.focus,
.btn-tedme:active,
.btn-tedme:focus,
.btn-tedme:hover {
    background-color: #d91d4b;/*COLOR_SECONDARY*/
/*    background-color: var(--tm-secondary);*/
    border-color: #d91d4b;/*COLOR_SECONDARY*/
/*    border-color: var(--tm-secondary);*/
    color: #fff; /*BTN_CONTRAST_HOVER*/
/*    color: var(--tm-btn-contrast-hover);*/
}

#modal-event-info .card {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding: 5px 10px;
}

#modal-question .modal-content ::-webkit-input-placeholder {
    font-size: 15px;
}

@media (min-width: 450px) {
    .col-xs-6 {
        flex: 0 0 auto;
        width: 50%;
    }
    #modal-question #aq-inputs .col-xs-6:nth-child(odd) {
        padding-right: 0.25rem;
    }
    #modal-question #aq-inputs .col-xs-6:nth-child(even) {
        padding-left: 0.25rem;
    }
}

#modal-question .help-block {
    margin-left: 0.5rem;
}

#modal-mod-info .moderator-picture {
    display: block;
    /*max-width: 85%;
    /*width: 85%;*/
    height: 200px;
    /*padding-top: 80%;*/
    /*border-radius: 50%;*/
    background-position-y: center;
    background-position-x: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin: 0 auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /*border: 8px solid #eee;*/
    background-image: url(../../images/misc/user.png);
    background-size: contain;
}


/************************************/
/* FOOTER 							*/
/************************************/

#footer {
    position: fixed;
    left: 0;
    bottom: 0;
    height: 50px;
    background: #ffffff;/*PRES_BG*/
/*    background: var(--tm-pres-bg-hl);*/
    background: var(--tm-pres-bg);
    display: flex;
    justify-content: center;
    z-index: 5;
    /* above all wrappers */
    /*border-top: 1px solid #ddd;*/
}

.footer-item {
    position: relative;/*for badges*/
    width: 50%;
    max-width: 250px;
    text-align: center;
    font-size: 1.1rem;
    line-height: 1.1;
    padding: 4px;
    cursor: pointer;
    /*color: #19181b;/*COLOR_PRIMARY*/
    color: var(--tm-primary);
    transition: all linear 0.2s;
}

.footer-item span {
    display: block;
    font-size: 0.95rem;
    font-weight: 600;
    margin-top: 2px;
}

.footer-item span:first-child {
    /*margin-bottom: 3px;*/
}

.footer-item:hover {
    /*background: rgba(0, 0, 0, 0.1);/*PRES_CONTRAST*/
    background: var(--tm-pres-contrast-hover);
    /*color: d91d4b;/*COLOR_SECONDARY*/
    color: var(--tm-secondary);
    transition: all linear 0.2s;
}

#questions-badge,
#pres-badge {
    background: red;
    position: absolute;
    z-index: 1000;
    top: 2px;
    left: 50%;
    margin-left: 20px;
    padding: 3px;
    min-width: 18px;
    height: 18px;
    font-size: 12px;
    border-radius: 1rem;
    display: none;
    pointer-events: none;
}

#questions-badge.active,
#pres-badge.active {
    display: block;
}

@keyframes blinker {
    50% {
        opacity: 0.2;
    }
}

.blinker {
    animation: blinker 1.5s linear infinite;
    -webkit-animation: blinker 1.5s linear infinite;
}

@keyframes blink-required-field {
    50% {
        box-shadow: 0 0 0 6px #fbb;
    }
}

.blink-required-field {
    animation: blink-required-field 1.5s ease-in-out infinite;
    -webkit-animation: blink-required-field 1.5s ease-in-out infinite;
}


/************************************/
/* Q&A 								*/
/************************************/

.timeline {
    list-style: none;
    padding: 20px 0 0 0;
    position: relative;
    margin: 0;
    /*height: auto;*/
    /*min-height: 98%;*/
    /*min-height: 90%;*/
}


/*
body.module-questionlist #questions-container .timeline {
	max-height: 300px;
	overflow-y: scroll;
}
*/

ul.timeline .uq-question,
ul.timeline .uq-response {
    font-size: 1rem;
    word-break: break-word;
}

.timeline:before {
    top: 0;
    bottom: 0;
    position: absolute;
    content: ' ';
    width: 2px;
    background-color: #ddd;
    left: 50%;
    margin-left: -1px;
}

.timeline li {
    margin-bottom: 10px;
    position: relative;
}

.timeline li:before,
.timeline li:after {
    content: ' ';
    display: table;
}

.timeline li:after {
    clear: both;
}

.timeline li:before,
.timeline li:after {
    content: ' ';
    display: table;
}

.timeline li .timeline-panel {
    width: 46%;
    float: left;
    background: #fff;
    border: 1px solid #d4d4d4;
    padding: 10px;
    position: relative;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
}

.timeline li .timeline-panel:before {
    position: absolute;
    top: 8px;
    right: -12px;
    display: inline-block;
    border-top: 12px solid transparent;
    border-left: 12px solid #ccc;
    border-right: 0 solid #ccc;
    border-bottom: 12px solid transparent;
    content: ' ';
}

.timeline li .timeline-panel:after {
    position: absolute;
    top: 9px;
    right: -11px;
    display: inline-block;
    border-top: 11px solid transparent;
    border-left: 11px solid #fff;
    border-right: 0 solid #fff;
    border-bottom: 11px solid transparent;
    content: ' ';
}

.timeline li .timeline-panel.noarrow:before,
.timeline li .timeline-panel.noarrow:after {
    top: 0;
    right: 0;
    display: none;
    border: 0;
}

.timeline li.timeline-inverted .timeline-panel {
    float: right;
}

.timeline li.timeline-inverted .timeline-panel:before {
    border-left-width: 0;
    border-right-width: 12px;
    left: -12px;
    right: auto;
}

.timeline li.timeline-inverted .timeline-panel:after {
    border-left-width: 0;
    border-right-width: 11px;
    left: -11px;
    right: auto;
}

.timeline li.pinned .timeline-panel {
    border: 8px solid gold;
}

.timeline li .tl-circ {
    position: absolute;
    top: 8px;
    left: 50%;
    text-align: center;
    /*background: #19181b;/*COLOR_PRIMARY*/
    background: var(--tm-primary);
    /*color: #fff;/*BTN_CONTRAST*/
    color: var(--tm-btn-contrast);
    width: 30px;
    height: 30px;
    line-height: 35px;
    margin-left: -15px;
    border: 2px solid #eee;
    border-top-right-radius: 50%;
    border-top-left-radius: 50%;
    border-bottom-right-radius: 50%;
    border-bottom-left-radius: 50%;
}

.timeline-title {
    width: 100%;
    color: #19181b;/*custom-override*/
    font-size: 1.25rem;
    background: #fff;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #d4d4d4;
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
}

.timeline-title .qlist-close {
    /*font-size: 1.5rem;*/
    /*line-height: 1;*/
}

.timeline-title .qlist-close,
.timeline-title .qlist-re-sort {
    margin-left: 1px !important;
    /*line-height: 1;*/
}

.timeline-title #btn-sort-text,
.timeline-title .qlist-re-sort span {
    /*vertical-align: text-top;*/
}

.timeline-title .qlist-re-sort .bi-arrow-repeat {
    font-size: 1rem;
    line-height: 1;
}

.timeline-wrapper {
    /*background: #ffffff;PRES_BG*/
    background: var(--tm-pres-bg);
    padding: 1rem;
}

.tl-heading {
    /*min-height: 40px;*/
}

.tl-heading h4 {
    margin: 0;
    color: #19181b;/*custom-override*/
    font-size: 15px;
    line-height: 22px;
}

.tl-body p,
.tl-body ul {
    margin-bottom: 0;
}

.tl-body>p+p {
    margin-top: 5px;
}


/************************************/
/* MEDIA-CONTAINER 					*/
/************************************/

#slide-wrapper,
#picture-wrapper,
#video-wrapper,
#stream-wrapper {
    height: 100%;
    width: 100%;
    z-index: 3;
    /* above jquery sliders */
}

#stream-wrapper {
    /*transition: width 0.25s ease-in-out;*/
}

.question-wrapper h4,
.question-wrapper h5,
.question-wrapper h6 {
    /*color: #666666; /*PRES_TITLE*/
    color: var(--tm-pres-title);
}

.question-wrapper h4,
.question-wrapper h5,
.question-wrapper h6,
.question-wrapper .question-image {
    text-align: center;
}

#slide-wrapper .question-wrapper {
    height: 100%;
    padding: 20px 10px 10px 10px;
}

#slide-wrapper .question-wrapper table {
    margin: 25px auto 25px auto;
}

#slide-wrapper table tr:last-child td {
    /* only way to add padding at the bottom of the table (inside absolutely positioned container) */
    /* required in webinar mode if footer is visible and content is bigger than window */
    padding-bottom: 75px;
}

#stream-iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

#video-player {
    width: 100%;
    height: 100%;
}

.timeline-panel .name-wrapper {
    display: inline-block;
    color: #666;
    margin-top: 10px;
}

.votes-wrapper {
    border: 1px solid #ccc;
    border-radius: 0.5rem;
    float: right;
    padding: 0.375rem;
    cursor: pointer;
}

.votes-wrapper:hover {
    background: #eee;
}

.votes-wrapper .smiley {
    float: left;
    width: 24px;
    height: 24px;
}

.votes-counter {
    color: #6c757d;
    display: inline-block;
    font-size: 20px;
    line-height: 24px;
    margin-left: 5px;
}


/************************************/
/* QUESTION-TIMER 					*/
/************************************/

.q-timer {
    margin-top: 20px;
}

#end-timer-box {
    width: 76px;
    height: 76px;
    position: fixed;
    z-index: 1041;/* above chat, Q&A list, modal backdrop */
    bottom: 60px;
    right: 0;
    margin-right: 10px;
    /*background: #ffffff;PRES_BG*/
    background: var(--tm-pres-bg);
    border-radius: 100%;
}

body.chat-open #end-timer-box {
    right: 350px;
}

#end-timer {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    font-size: 28px;
    font-weight: 600;
    text-align: center;
    border: 6px solid #ddd;
    border: 6px solid rgba(0, 0, 0, 0.1);
    border-radius: 100%;
/*    background: rgba(255, 255, 255, 0.75);*/
    background: #fff;
    color: #000;
}

#end-timer.big {
    font-size: 38px;
}

.circle.left {
    position: absolute;
    clip: rect(0, 76px, 76px, 38px);
}

.circle.right {
    position: absolute;
    clip: rect(0px, 38px, 76px, 0px);
}

.circle span {
    box-sizing: unset;
    width: 64px;
    height: 64px;
    border-radius: 100%;
    position: absolute;
    border: 6px solid var(--tm-secondary);
}

#end-timer-box:not(.d-none) .circle.left span {
    clip: rect(0px, 38px, 76px, 0px);
    -webkit-animation: rotate-left 5s infinite linear;
}

#end-timer-box:not(.d-none) .circle.right span {
    clip: rect(0, 76px, 76px, 38px);
    -webkit-animation: rotate-right 5s infinite linear;
}

@-webkit-keyframes rotate-left {
    0% {
        -webkit-transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(180deg);
    }
    100% {
        -webkit-transform: rotate(180deg);
    }
}

@-webkit-keyframes rotate-right {
    0% {
        -webkit-transform: rotate(0deg);
    }
    50% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(180deg);
    }
}


/************************************/
/* QUIZ 							*/
/************************************/

#quiz-container h5:first-child {
    color: var(--tm-pres-title);
}

#quiztable {
    width: 100%;
}

.quiztable-wrapper {
    display: flex;
    width: 100%;
    padding: 5px 5px 10px 5px;
    background: rgba(0, 0, 0, 0.1);
}

.quiztable-column {
    display: inline-block;
    vertical-align: top;
}

.quiztable-column,
.quiztable-column table {
    width: 100%;
}

.quiztable-column th {
    padding: 10px 5px;
    font-weight: 600;
    font-size: 16px;
}

#quiztable .quiztable-column td {
    padding: 5px;
}

#quiztable td span.btn {
    padding: 8px;
    font-size: 1rem;
    font-weight: 600;
}

#quiztable td span .bi {
    display: none;
}

#quiztable td > span:not(:hover) {
    background: #fff;
}

#quiz-answer-options .btn {
    margin: 15px 0 5px 0;
    width: 100%;
}

#quiz-answer-options .btn:not(.disabled):focus {
    /*color: #333;*/
}

#quiztable td.disabled > span {
    background-color: #e6e6e6;
    border-color: #adadad;
    color: #999;
    cursor: auto;
}

#quiztable td.btn-correct > span,
#quiztable td.btn-wrong > span {
    color: #fff;
    cursor: auto;
}

#quiztable td.btn-correct > span {
    background-color: #5cb85c !important;
    border-color: #5cb85c;
}

#quiztable td.btn-correct span .bi-check-lg,
#quiztable td.btn-wrong span .bi-x-lg {
    display: inline;
    line-height: 1;
    margin-right: 10px;
}

#quiztable td.btn-correct span .bi-check-lg {
    font-size: 1.25rem;
}

#quiztable td.btn-wrong > span {
    background-color: #dc3545 !important;
    border-color: #dc3545;
}

#quiz-answer-options .btn-correct {
    color: #fff;
    background-color: #5cb85c;
}

#quiz-answer-options .btn-wrong {
    color: #fff;
    background-color: #dc3545;
}

@keyframes blinkCorrect {
    from {
        background: #fff;
        border-color: #ccc;
        color: #6c757d;
    }
    to {
        background: #5cb85c;
        border-color: #5cb85c;
        color: #fff;
    }
}

.btn.blink-correct {
    animation-duration: 0.7s;
    animation-name: blinkCorrect;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

#modal-quiz-help {
    text-decoration: none;
    margin: 10px auto;
}

#modal-quiz-img {
    text-align: center;
    margin: 5px auto;
}

#quiz-download {
    text-decoration: none;
    /*margin-left: 8px;*/
}

#quiz-link {
    text-decoration: none;
    /*margin:5px auto;*/
}

#quiz-download-preview {
    text-decoration: none;
}

#quiz-img {
    max-width: 100%;
    max-height: 400px;
}

.quiz-media-controls {
    margin-top: 5px;
    margin-bottom: 5px;
    width: 568px;
    max-width: 568px;
    max-height: 300px;
}

.quiz-media-controls:focus {
    outline: none;
}

#quiz-media-img,
#modal-quiz-preview {
    /*margin-top: 5px;*/
    /*margin-bottom: 5px;*/
    max-width: 100%;
    max-height: 400px;
    /*max-width: 568px;*/
}

.quizstyle {
    color: black;
    font-size: 20px;
}

.quizstyle:hover {
    /*background: rgba(0, 0, 0, 0.1);/*PRES_CONTRAST*/
    background: var(--tm-pres-contrast-hover);
    /*color: d91d4b;/*COLOR_SECONDARY*/
    color: var(--tm-secondary);
}

#points {
    text-align: center;
}

.send-score,
.reset-quiz-answers {
    margin: 1.25rem auto;
    display: block;
}

#send-score-auth-email,
#send-score-auth-name,
#send-score-auth-pin {
    /*text-align: left;*/
}

.module-disabled {
    margin-top: 120px;
    /*color: #000; PRES_CONTRAST*/
    color: var(--tm-pres-contrast);
}

/************************************/
/* QUESTION IFRAME					*/
/************************************/


/* audience question iframe (iframes/question.html) */

body.module-question #modal-question .modal-dialog {
    max-width: none;
    margin: 0;
}

body.module-question #modal-question .modal-content {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    /*background: none;*/
}

body.module-question #modal-question .btn-close,
body.module-question #modal-question .btn-close-modal-question {
    display: none;
}

body.module-question #chart-container {
    position: unset;
    width: 100%;
}


/*
body.module-question.module-questionlist #modal-question,
body.module-question.module-presentation #modal-question {
	margin: 0;
	padding-top: 40px;
}
*/

body.module-question.module-presentation #vote-container .row {
    padding: 0 0 20px 0;
}

body.module-question:not(.module-presentation) #vote-container .row,
body.module-question #chart-container {
    padding: 0;
}

body.module-question.module-presentation #content-wrapper,
body.module-question.module-presentation #quiz-container {
    margin-top: 20px;
    padding-top: 0;
}

body.module-question:not(.module-question-min) #btn-send-question {
    /*float: left;*/
}

body.module-question #modal-question .col-6:not(.col-xxs-12):first-child {
    padding-right: 7px;
}

body.module-question #modal-question .col-6:not(.col-xxs-12):nth-child(2) {
    padding-left: 7px;
}

body.module-question #send-question-ok {
    /*float: left;*/
    /*margin-left: 5px;*/
    font-size: 1.25rem;
    line-height: 1;
    /*top: 7px;*/
}

body.module-question #modal-question .modal-title {
    font-size: 1em;
}

body.module-question-min #modal-question {
    /*background: rgba(0, 0, 0, 0.15);*/
    /*padding: 15px 15px 0 15px;*/
    padding-left: 0.75rem;
    padding-right: 0.75rem;
}

body.module-question-min #modal-question .modal-title {
    padding: 0.25rem 0;
}

body.module-question.module-presentation #content-wrapper {
    margin: 0;
}

body.module-question:not(.module-presentation) #vote-container,
body.module-questionlist #vote-container {
    padding-bottom: 0;
}

body.module-question.module-presentation #chart-container {
    position: relative;
    padding: 0.75rem 0 0 0;
}


/* question_presentation.html */
body.module.module-question.module-presentation #media-container {
    top: 110px;
}


/* question_presentation_sxces.html */


/* TODO ?? */

body.module.module-question.module-presentation #media-container {
    top: 390px;
}

@media (min-width: 768px) {
    #modal-system-alert .modal-dialog {
        width: 450px;
    }
}

body.broadcast.module-question.module-questionlist #questions-container {
    /*display: block !important;*/
    top: 120px;
    padding-top: 10px;
}

body.broadcast.module-questionlist #modal-question {
    padding: 10px;
}

#eyeAble_customToolOpenerID {
    display: inline-block;
    float: right;
    margin: 0.5rem 0.75rem 0 0;
    /*position: fixed;*/
    /*top: 8px;*/
    /*right: 58px;*/
    cursor: pointer;
    border-radius: 12px;
    /*box-shadow: 2px 2px 5px #444;*/
    /*z-index: 999;*/
    /* above navbar */
}

#eyeAble_customToolOpenerID img {
    width: 36px;
    height: 36px;
}

body.module #eyeAble_customToolOpenerID {
    display: none;
}

body.prelogin #eyeAble_customToolOpenerID {
    top: 8px;
    right: 8px;
}

body.hide-header #eyeAble_customToolOpenerID {
    right: 8px;
    box-shadow: 2px 2px 5px #444;
}

body.hide-header.chat-open #eyeAble_customToolOpenerID {
    right: 358px;
}


/*
body.hide-header.module-chat #eyeAble_customToolOpenerID {
	top: 6px;
	right: auto;
	left: 50%;
	margin-left: -17px;
}
*/

body.chat-open #eyeAble_customToolOpenerID {
    right: 408px;
}


/*
body.hide-header.module-questionlist:not(.module-question) #eyeAble_customToolOpenerID {
	top: 4px;
	right: 4px;
}
*/

@media (max-width: 767px) {
    body.chat-open #eyeAble_customToolOpenerID {
        right: 58px;
    }
    body.hide-header.chat-open #eyeAble_customToolOpenerID {
        top: 6px;
        right: auto;
        left: 50%;
        margin-left: -17px;
    }
}

/************************************/
/* Q&A WORDCLOUD IFRAME             */
/************************************/

#should_keep_phrases_box {
    position: absolute;
    right: 0.75rem;
    bottom: 10px;
    z-index: 1040; /* above wordcloud, below modals */
    font-size: 18px;
    display: flex;
    color: #19181b;
}
#should_keep_phrases_box label {
    cursor: pointer;
    color: #000; /*PRES_CONTRAST*/
}
input[type=checkbox]#should_keep_phrases {
    width: 16px;
    height: 16px;
    margin: 5px 5px 0 0;
    cursor: pointer;
}


/************************************/
/* RESPONSIVE 						*/
/************************************/

@media (max-width: 1499px) {}

@media (max-width: 1199px) {}

@media (max-width: 991px) {
    .timeline li .timeline-panel {
        width: 44%;
    }
    ul.timeline li .timeline-panel {
        padding: 0.5rem;
    }
    .votes-counter {
        font-size: 20px;
        line-height: 26px;
    }
    .votes-wrapper {
        padding: 5px;
    }
    .votes-wrapper img {
        width: 30px;
    }
    body.chat-open .slider {
        min-width: 200px;
    }
}


/* 1-column layout */

@media (max-width: 767px) {
    body.main.chat-open .full-width {
        width: 100%;
        padding-right: 0;
    }
    /*** containers ***/
    body.chat-open #questions-container,
    body.chat-open #content-wrapper,
    body.chat-open #chart-container,
    body.chat-open #media-container,
    body.chat-open #quiz-container,
    body.webinar-stream #chart-container,
    body.webinar-stream:not(.mode-quiz-fb) #content-wrapper,
    body.webinar-stream #media-container {
        padding-top: 0.5rem;
    }
    body.chat-open #media-container,
    body.chat-open #chart-container,
    body.webinar-stream.mode-vote #media-container,
    body.webinar-stream.mode-chart #media-container,
    body.webinar-stream.mode-questions #media-container,
    body.webinar-stream #chart-container {
        position: relative;
        height: 450px;
    }
    body.webinar-stream.chat-open:not(.mode-quiz-fb) #vote-container,
    body.webinar-stream.chat-open #chart-container  {
        padding-bottom: 25px;
    }
    body.webinar-stream.mode-vote #media-container,
    body.webinar-stream.mode-chart #media-container,
    body.webinar-stream.mode-questions #media-container {
        padding-bottom: 0;
    }
    body.chat-open #end-timer-box {
        right: 0;
    }
    /*** Q&A ***/
    .timeline-wrapper {
        padding: 0.5rem;
    }
    ul.timeline:before {
        left: 20px;
    }
    ul.timeline li .timeline-panel {
        width: calc(100% - 50px);
        width: -moz-calc(100% - 50px);
        width: -webkit-calc(100% - 50px);
    }
    ul.timeline li .tl-circ {
        top: 5px;
        left: 5px;
        margin-left: 0;
    }
    ul.timeline>li>.timeline-panel {
        float: right;
    }
    ul.timeline>li>.timeline-panel:before {
        border-left-width: 0;
        border-right-width: 12px;
        left: -12px;
        right: auto;
    }
    ul.timeline>li>.timeline-panel:after {
        border-left-width: 0;
        border-right-width: 11px;
        left: -11px;
        right: auto;
    }
    ul.timeline .uq-question,
    ul.timeline .uq-response {
        font-size: 0.9rem;
    }
    .timeline-title {
        font-size: 20px;
    }
    body.module.module-questionlist .timeline-title {
        font-size: 16px;
    }
    body.module.module-questionlist .timeline-title .btn {
        font-size: 0.75rem;
    }
    body.module .timeline-title>span {
        margin-top: 6px;
    }
    .tl-heading h4 {
        font-size: 15px;
        line-height: 18px;
    }
    .question-row {
        text-align: center;
    }
    #moderator-info h5 {
        margin-top: 10px;
        font-weight: 600;
    }
}

@media (max-width: 599px) {
    td.slide-answer {
        font-size: 20px;
    }
    .question-title,
    #content-wrapper h4 {
        /*font-size: 18px;*/
    }
    /*#content-wrapper h5,*/
    #content .section-question>label {
        font-size: 16px;
    }
    #content .section-question .question-text {
        padding: 0.25rem 0.5rem;
    }
    .question-subtitle {
        font-size: 14px;
    }
    .quiztable-wrapper {
        display: block;
        width: 100%;
    }
    .quiz-media-controls {
        width: 100%;
    }
    /* show cells as rows */
    #options-table.ranking.has-images td {
        display: inline-block;
        width: 100%;
    }
    #options-table.ranking.has-images .ranking-question:first-child {
        text-align: center;
        margin-top: 1rem;
        padding-top: 0.5rem;
        border-top: 1px solid #ccc;
    }
    /* turn columns into rows (text above slider) */
    table.multi-slider tr,
    #options-table tr.multi-slider {
        display: inline;
    }
    table.multi-slider td,
    #options-table tr.multi-slider td {
        float: left;
        width: 100%;
        text-align: center;
    }
    table.multi-slider td.answer-option-text,
    #options-table tr.multi-slider td.answer-option-text {
        padding-bottom: 0;
    }
    table.multi-slider td.matrix-question {
        padding: 20px 10px 0 10px;
    }
    .slider {
        min-width: 200px;
    }
    td.question-cell img,
    td.ranking-question img,
    td.matrix-question img {
        max-width: 100%;
    }
}

@media (max-width: 479px) {
    body #chat-container {
        height: 350px
    }
    body.chat-open #media-container,
    body.chat-open #picture-wrapper {
        height: 400px;
    }
    ul.timeline li .timeline-panel {
        width: calc(100% - 40px);
        width: -moz-calc(100% - 40px);
        width: -webkit-calc(100% - 40px);
    }
    .timeline-title .dropdown {
        display: block;
        float: none;
        margin-top: 5px;
    }
    ul.timeline li .tl-circ {
        left: 0;
        width: 24px;
        height: 24px;
    }
    .timeline li .timeline-panel:before {
        /*top: 19px;*/
    }
    ul.timeline>li>.timeline-panel:after {
        /*top: 20px;*/
    }
    ul.timeline:before {
        left: 14px;
    }
}

@media (max-width: 400px) {
    .timeline-title .dropdown {
        display: block;
        float: none;
        margin-top: 5px;
    }
}

@media (min-width: 768px) {
    .ask-question-row {
        margin-top: 25px;
        margin-bottom: 25px;
    }
    div.circle-avatar {
        margin: 10px auto;
    }
    .question-row {
        color: #333;
        background-color: #FFF;
        -moz-transition: background-color 0.5s;
        /* Firefox 4 */
        -webkit-transition: background-color 0.5s;
        /* Safari and Chrome */
        -o-transition: background-color 0.5s;
        /* Opera */
    }
    .question-row:hover {
        background-color: #EEE;
    }
    #slide-wrapper .question-image img {
        /*height: 100%;*/
        /*width: auto;*/
        max-width: 100%;
        /*max-height: 100%;*/
    }
    body.webinar-stream ul.timeline:before {
        left: 27px;
    }
    body.webinar-stream ul.timeline li .timeline-panel {
        width: calc(100% - 40px);
        width: -moz-calc(100% - 40px);
        width: -webkit-calc(100% - 40px);
    }
    body.webinar-stream ul.timeline li .tl-circ {
        left: 17px;
        width: 24px;
        height: 24px;
    }
    body.webinar-stream ul.timeline>li>.timeline-panel {
        float: right;
    }
    body.webinar-stream ul.timeline>li>.timeline-panel:before {
        border-left-width: 0;
        border-right-width: 15px;
        left: -15px;
        right: auto;
        top: 19px;
    }
    body.webinar-stream ul.timeline>li>.timeline-panel:after {
        border-left-width: 0;
        border-right-width: 14px;
        left: -14px;
        right: auto;
        top: 20px;
    }
    body.webinar-stream ul.timeline:before {
        left: 14px;
    }
    body.webinar-stream .votes-counter {
        font-size: 20px;
        line-height: 26px;
    }
    body.webinar-stream .votes-wrapper {
        padding: 5px;
    }
    body.webinar-stream .votes-wrapper img {
/*        width: 30px;*/
    }
    body.webinar-stream .timeline-title {
        font-size: 20px;
    }
}


/* stream is always visible except when quiz or feedback is active */

body.webinar-stream:not(.mode-quiz-fb) #media-container {
    display: block !important;
}

body.module-question.module-presentation.webinar-stream #modal-question {
    position: relative;
    z-index: 1;
}

@media (max-width: 767px) {
    body.webinar-stream:not(.mode-quiz-fb) #content-wrapper {
        margin: 0;
    }
    body.webinar-stream #media-container {
        padding-top: 50px;
    }
    body.webinar-stream.chat-open #media-container {
        padding-top: 0;
    }
    body.webinar-stream:not(.mode-quiz-fb) #questions-container,
    body.webinar-stream.chat-open #quiz-container {
        top: 450px;
    }
    body.webinar-stream.hide-header:not(.mode-quiz-fb) #questions-container,
    body.webinar-stream.hide-header.chat-open #quiz-container {
        top: 350px;
    }
    body.webinar-stream:not(.mode-quiz-fb) #questions-container {
        /*height: auto;*/
        /*min-height: 300px;*/
    }
}

@media (min-width: 768px) {
    /*body.webinar-stream.mode-vote #stream-wrapper,*/
    /*body.webinar-stream.mode-questions #stream-wrapper,*/
    /*body.webinar-stream.module-presentation #stream-wrapper {*/
    body.webinar-stream.mode-vote:not(.chat-open) #media-container,
    body.webinar-stream.mode-chart:not(.chat-open) #media-container,
    body.webinar-stream.mode-questions:not(.chat-open) #media-container,
    body.webinar-stream.module-presentation:not(.chat-open) #media-container {
        width: 50%;
        /*transition: width 0.25s ease-in-out;*/
    }
    body.webinar-stream:not(.mode-quiz-fb) #vote-container,
    body.webinar-stream #slide-wrapper,
    body.webinar-stream #chart-container,
    body.webinar-stream:not(.mode-quiz-fb) #questions-container,
    body.module-question.module-presentation.webinar-stream:not(.mode-quiz-fb) #modal-question {
        width: 50%;
        margin-left: 50%;
        /*transition: width 0.25s ease-in-out;*/
    }
    body.webinar-stream #chart-container {
        left: auto;
    }
    body.webinar-stream:not(.mode-quiz-fb) #content-wrapper {
        /*margin-top: 42px;*/
        /* ??? */
    }
    body.webinar-stream:not(.mode-quiz-fb) #content {
        width: 100%;
        margin: 0;
    }
    body.webinar-stream .slider {
        min-width: 200px;
    }
    body.webinar-stream #slide-wrapper .question-wrapper {
        width: 100%;
        position: relative;
    }
    body.webinar-stream .question-title,
    body.webinar-stream td.slide-answer {
        font-size: 20px;
    }
    body.webinar-stream #content-wrapper h4 {
        font-size: 18px;
    }
    body.webinar-stream .question-subtitle,
    body.webinar-stream #content-wrapper h5,
    body.webinar-stream #content .section-question>label {
        font-size: 15px;
    }
    /* languages, burger */
    body.chat-open:not(.module-chat) #navbar .open>.dropdown-menu {
        right: 350px;
    }
}

@media (min-width: 992px) {
    /*body.webinar-stream.mode-vote #stream-wrapper,*/
    /*body.webinar-stream.mode-questions #stream-wrapper,*/
    /*body.webinar-stream.module-presentation #stream-wrapper {*/
    body.webinar-stream.mode-vote:not(.chat-open) #media-container,
    body.webinar-stream.mode-chart:not(.chat-open) #media-container,
    body.webinar-stream.mode-questions:not(.chat-open) #media-container,
    body.webinar-stream.module-presentation:not(.chat-open) #media-container {
        width: 55%;
        /*transition: width 0.25s ease-in-out;*/
    }
    body.webinar-stream:not(.mode-quiz-fb) #vote-container,
    body.webinar-stream #slide-wrapper,
    body.webinar-stream #chart-container,
    body.webinar-stream:not(.mode-quiz-fb) #questions-container,
    body.module-question.module-presentation.webinar-stream:not(.mode-quiz-fb) #modal-question {
        width: 45%;
        margin-left: 55%;
        /*transition: width 0.25s ease-in-out;*/
    }
    #slide-wrapper .question-wrapper {
        padding: 20px;
    }
    body:not(.chat-open) #slide-wrapper .question-wrapper {
        width: 70%;
        margin-left: 15%;
    }
}

@media (min-width: 1200px) {
    /*body.webinar-stream.mode-vote #stream-wrapper,*/
    /*body.webinar-stream.mode-questions #stream-wrapper,*/
    /*body.webinar-stream.module-presentation #stream-wrapper {*/
    body.webinar-stream.mode-vote:not(.chat-open) #media-container,
    body.webinar-stream.mode-chart:not(.chat-open) #media-container,
    body.webinar-stream.mode-questions:not(.chat-open) #media-container,
    body.webinar-stream.module-presentation:not(.chat-open) #media-container {
        width: 60%;
        /*transition: width 0.25s ease-in-out;*/
    }
    body.webinar-stream:not(.mode-quiz-fb) #vote-container,
    body.webinar-stream #slide-wrapper,
    body.webinar-stream #chart-container,
    body.webinar-stream:not(.mode-quiz-fb) #questions-container,
    body.module-question.module-presentation.webinar-stream:not(.mode-quiz-fb) #modal-question {
        width: 40%;
        margin-left: 60%;
        /*transition: width 0.25s ease-in-out;*/
    }
    #slide-wrapper .question-wrapper {
        width: 70%;
        margin-left: 15%;
    }
}


/************************************/
/* AFTER Responsive					*/
/************************************/


/* remove header and paddings */
body.hide-header #navbar {
    display: none;
}

body.hide-header #questions-container,
body.hide-header #chart-container,
body.hide-header #media-container,
body.hide-header #content-wrapper,
body.hide-header #quiz-container,
body.module.hide-header #modal-question,
body.module.hide-header #qa-cloud-container {
    padding-top: 0;
}


/* remove footer and paddings */
body.hide-footer #footer {
    display: none;
}

body.hide-footer #chart-container,
body.hide-footer #vote-container,
body.hide-footer #media-container,
body.hide-footer #quiz-container,
body.module.hide-footer #qa-cloud-container {
    padding-bottom: 0;
}

body.hide-footer #questions-container .timeline-wrapper {
    /* TODO? */
    /*body.module #questions-container .timeline-wrapper {*/
    padding-bottom: 5px;
}

body.hide-footer #slide-wrapper table tr:last-child td {
    padding-bottom: 25px;
}