@charset "UTF-8";
/*
    Import base stylings
*/
/* Variables */
/* Font */
/* We'll will change this to blue on the new brand */
/* Icons & borders */
/* For menu hovers and dropdowns */
/* All icons */
/* Colors for all cards and borders */
/******** New Brand Colors ********/
/* Voxpopme */
/* Video MR */
/* Video CX */
/* Supporting */
/* Affectiva colours */
/* Base styling */
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600&display=swap");
* {
    box-sizing: border-box; }

body ::-webkit-scrollbar-track {
    background: #f5f5f5; }

body ::-webkit-scrollbar {
    width: 14px;
    height: 18px; }

body ::-webkit-scrollbar-thumb {
    height: 6px;
    border: 4px solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    -webkit-border-radius: 7px;
    background-color: rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05); }

body ::-webkit-scrollbar-button {
    width: 0;
    height: 0;
    display: none; }

body ::-webkit-scrollbar-corner {
    background-color: transparent; }

body.header--new {
    padding-left: 5rem;
    padding-top: 4.2rem; }

body.header--new.vpm-portal--lists {
    padding-top: 6.2rem; }
body.header--new.vpm-portal--lists .l-subheader {
    display: none; }

body.header--new.vpm-portal--login {
    padding: 0; }

body.header--new.vpm-portal--authenticatorLogin {
    padding: 0; }

html:after,
body:after {
    content: "";
    display: table;
    clear: both; }

html {
    height: 100%; }

body {
    padding-bottom: 70px;
    min-height: 100%; }

[ng\:cloak],
[ng-cloak],
.ng-cloak {
    display: none !important; }

.icon--rotateleft {
    /* IE 9 */
    /* Chrome, Safari, Opera */
    transform: rotate(90deg); }

.icon--rotateright {
    /* IE 9 */
    /* Chrome, Safari, Opera */
    transform: rotate(-90deg); }

.icon--rotateup {
    /* IE 9 */
    /* Chrome, Safari, Opera */
    transform: rotate(-180deg); }

.icon-arrow-left,
.icon-arrow-right {
    font-size: 0.8em; }

.icon-arrow-down:before,
.icon-arrow-asc:before,
.icon-arrow-desc:before {
    font-size: 0.7em;
    padding-left: 1em;
    position: relative;
    top: -0.1em; }

.icon-arrow-desc:before {
    content: "\e901";
    color: #4a4a4a; }

.icon-arrow-asc:before {
    content: "\e900";
    color: #4a4a4a; }

/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
    font-family: sans-serif;
    /* 1 */
    -ms-text-size-adjust: 100%;
    /* 2 */
    -webkit-text-size-adjust: 100%;
    /* 2 */ }

/**
 * Remove default margin.
 */
body {
    margin: 0; }

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
    display: block; }

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

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

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

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

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

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

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

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
    font-style: italic; }

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
    font-size: 2em;
    margin: 0.67em 0; }

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

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

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

sup {
    top: -0.5em; }

sub {
    bottom: -0.25em; }

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

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

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
    margin: 1em 40px; }

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

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

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

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

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

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

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

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

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

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

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

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

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

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

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em; }

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
    border: 0;
    /* 1 */
    padding: 0;
    /* 2 */ }

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

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

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
    border-collapse: collapse;
    border-spacing: 0; }

/* white label header temp fix */
.header--new app-header {
    background: var(--brand, #341C4C); }
.header--new app-header app-navigation .primary-nav .nav-item--active {
    background: var(--brand, #341C4C); }
.header--new app-header app-user-menu .menu-toggle--active {
    background: rgba(0, 0, 0, 0.07); }
.header--new app-header app-admin-menu .menu-toggle--active {
    background: rgba(0, 0, 0, 0.07); }

.l-header {
    background: var(--brand, #341C4C);
    margin-bottom: 2em;
    min-height: 150px;
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.1);
    width: 100%;
    z-index: 40; }
.l-header:after {
    content: "";
    display: table;
    clear: both; }
.l-header .panel {
    height: 150px;
    position: relative; }

.l-header--small {
    min-height: 100px; }
.l-header--small .panel {
    height: 100px; }

.header--white .l-header {
    background: #fff; }
.header--white .l-header .l-nav a,
.header--white .l-header .user-account,
.header--white .l-header .adminnav__control {
    color: var(--brand, #341C4C) !important; }
.header--white .l-header .adminnav__control {
    border-color: var(--brand, #341C4C) !important; }

.l-subheader {
    background: var(--background, #f4f5f7);
    height: 51px;
    margin-bottom: 1.3em;
    margin-top: -2em;
    position: relative;
    width: 100%;
    z-index: 120; }
.l-subheader:after {
    content: "";
    display: table;
    clear: both; }
.header--new .l-subheader {
    margin-top: 0; }

.l-main {
    width: 96%;
    margin: 0 auto;
    z-index: 10; }
.l-main:after {
    content: "";
    display: table;
    clear: both; }

.l-main--showreel {
    width: 60%; }
@media (max-width: 1200px) {
    .l-main--showreel {
        width: calc(100% - 300px); } }

body,
.roboto {
    color: var(--primary, #343845);
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    line-height: 23px;
    font-weight: 300; }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
    body,
    .roboto {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale; } }

/* ----- Base type ----- */
a {
    text-decoration: none;
    color: inherit; }
a:hover, a:focus {
    text-decoration: underline; }

a.simple-link:hover {
    color: var(--accent, #2d91e6); }

a.nodecoration {
    text-decoration: none !important; }

/* ----- Coloring on type ----- */
.highlight {
    color: var(--accent, #2d91e6); }

.error-text {
    color: #d0021b; }

/* ----- Blockquotes ----- */
.quotecontainer {
    display: block;
    clear: both; }

.quote {
    display: inline-block;
    margin-left: 0;
    margin-bottom: 0;
    width: 100%; }

.quote p {
    display: inline; }

.quote--hasclick p {
    cursor: pointer; }
.quote--hasclick p:hover {
    color: var(--accent, #2d91e6); }

.quote i {
    color: var(--brand, #341C4C);
    font-size: 1.6em;
    line-height: 0;
    display: inline-block;
    position: relative;
    top: 0.1em;
    line-height: 1em; }

.quote i.flipped {
    top: 0.2em;
    /* Gecko */
    /* Operah */
    /* webkit */
    transform: scaleX(-1);
    /* standard */
    -webkit-filter: FlipH;
    filter: FlipH;
    /* IE 6/7/8 */ }

/*
	Titles

	.title--primary - Primary Title
	.title--secondary - Secondary Title
	.title--tertiary - Tertiary Title
	.title--delta - Delta Title
	.title--inline - Inline titles
	.title--standalone - Centered Title
	.title--dark - Dark titles
	.title--light - Light title
	.title--spacingreset - Spacing reset

*/
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-bottom: 0;
    font-weight: 300;
    margin-top: 0; }

.title {
    font-size: 1em;
    font-weight: 300;
    line-height: 1.25em;
    margin: 0 0 1rem; }
.title a {
    color: inherit; }

.title--primary {
    margin-bottom: 0.5em;
    font-weight: 500;
    font-size: 1.5rem; }
.title--primary.title--multilingual {
    max-width: 900px; }

.title--secondary {
    font-size: 1.33em;
    word-break: break-word; }

.title--tertiary {
    font-size: 1.26em;
    line-height: 1.25em;
    margin-bottom: 0;
    font-weight: 400; }

.title--delta {
    font-size: 1em;
    margin-top: 0.5em;
    margin-bottom: 0; }

/* ----- Alignment ----- */
.title--inline {
    float: left; }

/* ----- Spacing ----- */
.title--nospacing {
    margin: 0; }

.title--spacedbottom {
    margin-bottom: 1em; }

.title--spacedtop {
    margin-top: 1em; }

.title--spaced {
    margin-top: 1em;
    margin-bottom: 1em; }

/* ----- Width fix on title ----- */
.title--list {
    max-width: 920px; }

/* ----- From old theme explorer ----- */
.title--standalone {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: auto; }

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

.title--dark {
    color: #4a4a4a; }

.title--light {
    color: #fff; }

.title--light-weight {
    font-weight: 300; }

.title--heavy {
    font-weight: 400; }

.title--spacingreset {
    margin: 0; }

.title--preview {
    display: block;
    margin: 25px auto 0;
    width: 400px;
    text-align: center; }

.title--capitalized {
    text-transform: capitalize; }

.responses-title {
    font-size: 1.45rem;
    font-weight: 500;
    line-height: 1.25em;
    margin-bottom: -0.2rem;
    text-transform: capitalize; }

.create-projects-title {
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.25em;
    margin: 2rem 0.75rem 0.75rem; }

/* Components
	These are the base stylings for everything on the site.
 */
/* ----- Additional data list in modal ----- */
.additional-data-editlist:after {
    content: "";
    display: table;
    clear: both; }

.additional-data-editlist__row {
    float: left;
    width: 100%; }
.additional-data-editlist__row:nth-child(2n) {
    background: #f9f9f9; }

.additional-data-editlink {
    float: left;
    padding: 0.5rem;
    width: 100%; }
.additional-data-editlink i {
    opacity: 0;
    position: relative;
    top: 3px;
    transition: all 0.25s ease-in-out; }
.additional-data-editlink:hover {
    text-decoration: none; }
.additional-data-editlink:hover i {
    opacity: 1; }

.additional-data-editlist__form {
    float: right;
    margin-top: -40px;
    width: 515px; }
.additional-data-editlist__form .form__field {
    height: 39px;
    margin-right: 0; }
.additional-data-editlist__form .form__field--dropdown {
    width: 175px;
    margin-right: 5px;
    border: 1px solid #e7e7e7; }

/*
    Autocomplete
*/
.autocomplete-container {
    float: left;
    padding: 0;
    margin-right: 30px; }

.autocomplete {
    width: 100%;
    position: relative; }

.autocomplete input {
    border: none;
    left: 0;
    padding-left: 0;
    position: absolute;
    top: 0;
    height: 43px;
    width: 100%;
    z-index: 1; }

.autocomplete ul {
    border: none;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
    left: 0;
    padding-left: 0;
    position: absolute;
    top: 30px;
    width: 100%;
    z-index: 1; }

.autocomplete li {
    text-align: left;
    list-style: none;
    width: 100%;
    padding: 0.4em;
    margin-left: 0;
    background-color: #fff; }

.autocomplete li.active {
    width: 100%;
    background-color: #4bf; }

.autocomplete .highlight {
    background: #A11448 !important;
    color: #fff;
    padding: 5px 0 5px 5px; }

.annotations-video-container {
    width: 100%;
    float: left; }
.annotations-video-container .flowplayer {
    background: #000 !important; }

/* ----- Typeahead on modal ----- */
.form--annotations .form__row {
    position: relative; }

.form--annotations .autocomplete input {
    height: 33px; }

.form--annotations .autocomplete ul {
    box-shadow: 0 5px 10px #e7e7e7;
    top: 19px;
    left: -7px;
    width: 258px; }

.form--annotations .autocomplete li {
    cursor: pointer; }

.form--annotations .autocomplete li.active {
    background: var(--brand, #341C4C);
    color: #fff; }

/* ----- Flowplayer overwrites for annotations ----- */
.vpm-portal .annotations-video-container {
    margin-bottom: 50px;
    z-index: 100; }
.vpm-portal .annotations-video-container .flowplayer .fp-progress {
    background: var(--accent, #2d91e6); }
.vpm-portal .annotations-video-container .fp-time {
    display: block !important; }
.vpm-portal .annotations-video-container .fp-time em {
    opacity: 1 !important;
    bottom: -2.3em !important;
    color: #000 !important;
    text-shadow: none !important;
    font-weight: 100 !important;
    font-size: 1.1em !important; }
.vpm-portal .annotations-video-container .fp-controls {
    height: 0 !important; }
.vpm-portal .annotations-video-container .fp-timeline {
    background: #e0e0e0 !important;
    cursor: col-resize !important;
    height: 30px !important;
    left: 0 !important;
    margin: 10px 10% 0 !important;
    top: 0 !important;
    margin: 10px 0 0 !important; }

.vpm-portal.darkbrand .annotations-video-container .flowplayer .fp-progress {
    background: #4589d9; }

.annotations-video-container .flowplayer {
    overflow: visible; }
.annotations-video-container .flowplayer .fp-elapsed, .annotations-video-container .flowplayer .fp-duration {
    color: var(--primary, #343845);
    position: relative;
    top: 10px; }
.annotations-video-container .flowplayer .fp-timestamp {
    bottom: 3em;
    z-index: 30; }
.annotations-video-container .flowplayer .fp-controls {
    bottom: -20px; }
.annotations-video-container .flowplayer .fp-ui > * {
    opacity: 1; }
.annotations-video-container .flowplayer .fp-icon, .annotations-video-container .flowplayer .fp-volume {
    display: none; }

.annotations-video-container:after {
    position: absolute;
    content: '';
    height: 50px;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #f6f6f6;
    z-index: 10; }

/* ----- Remove ----- */
.annotations__remove {
    border: 1px solid #e7e7e7;
    box-shadow: 0.5px 1.5px 2px 0 rgba(0, 0, 0, 0.1);
    padding: 0.3em 0.5em;
    font-size: 1.2em; }
.annotations__remove:hover {
    background: #f9f9f9;
    text-decoration: none; }

/* ----- Annotation times ------ */
.annotation__time {
    border: 1px solid #e7e7e7;
    float: left;
    margin-top: 3px;
    padding: 0 40px 0 5px;
    position: relative;
    box-shadow: 0.5px 1.5px 2px 0 rgba(0, 0, 0, 0.1); }

.annotation__time__character {
    border: none;
    float: left;
    margin: 0;
    padding: 5px 0;
    text-align: center;
    width: 25px; }

.annotation__time__spacer {
    float: left;
    padding: 3px 0; }

.annotation__time__character--wide {
    width: 30px; }

.annotation__timearrows {
    position: absolute;
    right: 0;
    top: 0; }

.annotation__timearrow {
    border: 1px solid #ccc;
    border-right: 0;
    border-top: 0;
    display: block;
    font-size: 0.8em;
    height: 15.5px;
    line-height: 15.5px;
    padding: 0 1.5px;
    text-align: center;
    text-decoration: none !important; }
.annotation__timearrow i:before {
    padding: 0; }

.annotation__timearrow--down {
    font-size: 1.15em; }
.annotation__timearrow--down i {
    line-height: 15px; }

.annotations__btns {
    float: left;
    margin-top: 6.5em !important;
    width: 100%; }

.annotations__dropdown {
    margin-top: 1.7em;
    margin-bottom: 1.7em !important; }

.annotation__icons {
    position: absolute;
    right: 0;
    padding-top: 0.4em; }

.form__placeholder--grey::-webkit-input-placeholder {
    color: #a2a2a2 !important; }

.form__placeholder--grey:-moz-placeholder {
    color: #a2a2a2 !important; }

.form__placeholder--grey::-moz-placeholder {
    color: #a2a2a2 !important; }

.form__placeholder--grey:-ms-input-placeholder {
    color: #a2a2a2 !important; }

.annotations--settime {
    display: inline-block !important; }

.demo-modal--annotations .btn--primary {
    margin-bottom: 1em;
    max-width: 200px; }

/* ----- Annotation controls-----  */
.annotation-controls {
    clear: both;
    display: block;
    margin: 0 auto;
    max-width: 630px;
    width: 100%; }
.annotation-controls:after {
    content: "";
    display: table;
    clear: both; }
.annotation-controls .form__row {
    max-width: 604px;
    display: block;
    float: none;
    margin-bottom: 1.5em;
    margin-left: auto;
    margin-right: auto; }
.annotation-controls .form__field {
    max-width: 402px; }
.annotation-controls .autocomplete input {
    height: 33px; }
.annotation-controls .btngroup {
    text-align: center;
    margin-top: 2rem; }
.annotation-controls .btngroup:after {
    content: "";
    display: table;
    clear: both; }
.annotation-controls .btn--primary {
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.2);
    display: inline-block;
    font-size: 0.86em;
    margin-left: 0.25em;
    margin-right: 0.25em;
    max-width: 143px; }

.annotation-controls__actions {
    float: right; }

.annotation-controls__action {
    display: inline-block;
    font-size: 1.1rem;
    line-height: 1em;
    margin-left: 0.5em;
    margin-top: 0.5em;
    position: relative; }
.annotation-controls__action:hover {
    color: var(--brand, #341C4C);
    text-decoration: none; }
.annotation-controls__action:first-child {
    top: 0.05em; }

.annotation-controls__time {
    background: #FAFAFA;
    box-shadow: 0 0 11px rgba(0, 0, 0, 0.25);
    float: left;
    margin: 0 1em;
    max-width: 285px;
    padding: 1.5rem 0;
    text-align: center;
    text-transform: uppercase;
    width: 50%; }
.annotation-controls__time .annotation-controls__inputs {
    position: relative;
    left: -10px; }
.annotation-controls__time .annotation__timearrows {
    position: absolute;
    right: 2.2em;
    top: 0; }
.annotation-controls__time .annotation__timearrow {
    border: none;
    height: 15px;
    width: 20px;
    line-height: 15px; }
.annotation-controls__time .annotation__timearrow i:before {
    font-size: 0.6rem; }

.annotation-controls__timetitle {
    text-transform: uppercase;
    font-size: 0.9rem;
    margin-bottom: 1rem; }

.annotation-controls__timecharacter {
    background-color: transparent;
    border: none;
    display: inline-block;
    font-size: 1.6em;
    text-align: center;
    width: 1.5em; }

.annotation-controls__timecharacter--wide {
    width: 1.8em; }

.annotation-controls__timespacer {
    display: inline-block;
    font-size: 1.5em;
    position: relative;
    top: -2px;
    margin-right: -2px;
    margin-left: -2px; }

.annotation-controls__btn {
    border: 1px solid var(--primary, #343845);
    display: block;
    line-height: 2.3rem;
    margin: 1.2rem auto 0;
    max-width: 195px;
    width: 90%; }
.annotation-controls__btn:hover {
    text-decoration: none;
    color: var(--brand, #341C4C);
    border-color: var(--brand, #341C4C); }

/*
	Buttons
*/
.btn {
    border-radius: 4px;
    border: none;
    color: var(--icon, #6C758E);
    cursor: pointer;
    font-weight: 300;
    position: relative;
    text-decoration: none !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; }

/* ----- Primary Buttons ----- */
.btn--primary {
    border-radius: 100px;
    background: #2d91e6;
    color: #fff;
    display: block;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1rem;
    margin-left: 0.375rem;
    max-width: 165px;
    text-align: center;
    width: 100%;
    padding: 0.5rem 1.0rem;
    transition: background-color 0.25s ease-in-out; }

.btn--primaryalt {
    background: #4589d9; }

.btn--primaryadditionaldata {
    background: #fff;
    color: var(--accent2, #D91B5D); }

.btn--primarylight {
    background: #e7e7e7;
    color: var(--primary, #343845); }

.btn--primary:hover,
.btn--primary.is-active {
    background: #2DAFE6; }

.btn--primaryalt:hover,
.btn--primaryalt.is-active {
    background: #286fc3; }

.btn--primaryadditionaldata:hover,
.btn--primaryadditionaldata:focus {
    background: #efefef;
    color: var(--accent2, #D91B5D); }

.btn--primarylight:hover,
.btn--primarylight.is-active {
    color: #e7e7e7;
    background: var(--primary, #343845); }

/* ----- Secondary Buttons ----- */
.btn--secondary {
    color: var(--primary, #343845);
    display: block;
    line-height: 1rem;
    font-size: 0.8125rem;
    margin-bottom: 0;
    width: 100%;
    padding: 0.5rem 1.0rem;
    border: 1px solid var(--vpm-border, #D8DCE6);
    border-radius: 100px; }
.btn--secondary.active {
    background: #e7e7e7; }

.btn--secondaryalt {
    transition: all 0.5s; }

.btn--secondary:hover,
.btn--secondary.is-active {
    background: var(--brand, #341C4C);
    color: white;
    font-weight: 400;
    border: 1px solid var(--brand, #341C4C); }

.btn--secondaryalt:hover,
.btn--secondaryalt.is-active {
    border-left: 0.5em solid var(--primary, #343845);
    padding-left: 1.5em; }

/* ----- Tertiary Buttons ----- */
.btn--tertiary {
    color: var(--secondary, #5C5F6A);
    display: block;
    border-radius: 100px;
    border: 1px solid var(--vpm-border, #D8DCE6);
    font-size: 0.8125rem;
    line-height: 1rem;
    font-weight: 500;
    max-width: 130px;
    padding: 0.5rem 1.0rem;
    text-align: center;
    background: var(--hover, #eceff5);
    transition: background-color 0.25s ease-in-out; }

.btn--tertiary--change-projects {
    color: #cd3258;
    display: block;
    line-height: 2.6em;
    max-width: 130px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    padding-top: 0.9rem; }

.btn--tertiaryalt {
    text-align: left;
    width: auto; }

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

.btn--tertiary:hover,
.btn--tertiary.is-active {
    background-color: #fff; }

/*  ----- Delta icons ----- */
.btn--delta {
    display: inline-block;
    font-size: 1rem;
    height: 32px;
    line-height: 2.2em;
    text-align: center;
    width: 32px; }
.btn--delta.active {
    background: var(--accent, #2d91e6);
    color: #fff; }
.btn--delta.active i:before {
    color: #fff !important; }
.btn--delta.active--alt {
    background: var(--accent2, #D91B5D); }
.btn--delta.active--alt i:before {
    color: #fff !important; }

/* ----- Action button (e.g. close on rows )----- */
.btn--action {
    color: #a2a2a2;
    cursor: pointer;
    font-size: 2em;
    font-weight: 300;
    position: absolute;
    right: 0.3em;
    top: 0.2em; }
.btn--action:hover, .btn--action:focus {
    text-decoration: none; }
.btn--action span {
    display: inherit;
    font-size: 0.8rem;
    margin-left: 0.3em;
    position: relative;
    top: -3px; }

.btn--action--pulled {
    top: 0;
    right: 0; }

.btn--action--alt {
    right: 0;
    position: relative;
    margin-top: 0;
    line-height: 1em;
    font-size: 1.5em; }

/* ----- Small actions (e.g. older close button) ---- */
.btn--smallaction {
    background: var(--brand, #341C4C);
    border-radius: 50%;
    color: #fff;
    text-align: center;
    text-decoration: none !important;
    display: block;
    width: 1.5em;
    clear: both;
    line-height: 1.5em; }
.btn--smallaction i {
    font-size: 0.6em;
    left: 0.1em;
    position: relative;
    top: -0.15em; }
.btn--smallaction:hover {
    background: var(--primary, #343845); }

.btn--smallactionpopup {
    position: absolute;
    top: 1.8em;
    right: 2em; }

/* ----- Disabled state ----- */
.btn--disabled {
    cursor: default !important;
    opacity: 0.2; }

.btn--disabledalt {
    cursor: default !important;
    opacity: 0.5; }

/* ----- Layout & spacing ----- */
.btn--inline {
    display: inline-block; }

.btn--inlinealt {
    float: left; }

.btn--flipped {
    float: right; }

.btn--standalone {
    display: block;
    margin: 0 auto; }

.btn--wide {
    max-width: 180px; }

.btn--xwide {
    max-width: 260px; }

.btn--fill {
    max-width: 85%; }

.btn--nospacing {
    margin: 0; }

.btn--spaced {
    margin-bottom: 1em;
    margin-top: 1em; }

.btn--spacedtop {
    margin-top: 1em; }

.btn--spacedbottom {
    margin-bottom: 1em; }

.btn--spacedhorizontal {
    margin-left: 1em;
    margin-right: 1em; }

.btn--spacedhorizontalshort {
    margin-left: 0.5em;
    margin-right: 0.5em; }

.btn--pulledtop {
    margin-top: -4em; }

/*
	Specifics
*/
/* ----- Approval buttons ----- */
.btn--approvegreat {
    background: #1bd9ba; }
.btn--approvegreat:hover, .btn--approvegreat:focus {
    background: #15ac93; }

.btn--approveok {
    background: #FFE162; }
.btn--approveok:hover, .btn--approveok:focus {
    background: #ffd72f; }

.btn--approvepoor {
    background: #D91B5D; }
.btn--approvepoor:hover, .btn--approvepoor:focus {
    background: #ac154a; }

/* ----- Animated add button ----- */
.btn--inlineaction {
    color: var(--accent2, #D91B5D);
    position: relative;
    display: inline-block;
    font-size: 1.2em;
    height: 20px;
    line-height: 19px;
    opacity: 1;
    padding-left: 6px;
    top: 1px; }
.btn--inlineaction span {
    display: none;
    font-size: 0.7em;
    left: 25px;
    line-height: 1.5em;
    position: absolute;
    top: 0;
    width: 200px; }
.btn--inlineaction:hover span {
    display: block; }

.form__row .btn--inlineaction {
    margin-top: 0.4em; }

.btn--inlineactionalt {
    color: var(--brand, #341C4C); }

.btn--brand {
    background: var(--brand, #341C4C);
    color: #fff; }
.btn--brand:hover {
    opacity: 0.8; }

.btn--backtotop {
    background: #4a4a4a;
    position: fixed;
    right: 0;
    bottom: 0;
    z-index: 100;
    width: auto;
    padding: 0.3em 0.5em 0.2em;
    height: 0px;
    padding: 0em 0.5em 0em;
    transition: all 1s ease; }
.btn--backtotop i {
    margin: 0; }

.btn--backtotop--active {
    padding: 0.3em 0.5em 0.2em;
    height: 46px; }

/*
	Icons in buttons
*/
.btn__icon {
    float: left;
    font-size: 1em;
    line-height: 1.9em; }
.btn__icon.icon-move-up {
    font-size: 1.4em;
    line-height: 1em;
    margin-right: 0.6em; }

.btn__icon--delta {
    position: relative;
    top: 3px; }

/*
	Buttons with icons (alt)
*/
.btn__icon--alt {
    float: right;
    width: 25px;
    height: 25px;
    margin-right: 1.3em; }

/*
	Button Groups
*/
.btngroup {
    margin-top: 1em;
    position: relative;
    clear: both;
    margin-right: 1.125rem; }

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

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

.btngroup--inline {
    border: 1px solid #e7e7e7;
    display: inline-block;
    margin: 0 3.5% 1.7em 0;
    background: #f7f7f7;
    padding: 1em 5% 0 0;
    width: 95%;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px; }
.btngroup--inline .btn {
    margin-bottom: 1em;
    width: 29.5%; }
.btngroup--inline :nth-child(3n) .btn {
    margin-right: 0; }

.btngroup--1 {
    width: 46.5%; }
@media (min-width: 1100px) {
    .btngroup--1 {
        width: 29.3%; } }
@media (max-width: 500px) {
    .btngroup--1 {
        width: 100%; } }
.btngroup--1 .btn {
    width: 85%; }

.btngroup--2 {
    width: 96.5%; }
@media (min-width: 1100px) {
    .btngroup--2 {
        width: 62%; } }
.btngroup--2 .btn {
    width: 45%; }
.btngroup--2 :nth-child(2n) .btn {
    margin-right: 0; }

/*
	Button Group Count
 */
.btngroup__count {
    background: #fcfcfc;
    border-radius: 3px 0 0 0;
    bottom: 0;
    color: #333;
    height: 100%;
    line-height: 70px;
    position: absolute;
    right: 0;
    text-align: center;
    padding-right: 0.5em;
    padding-left: 0.5em;
    border-left: 1px solid #eee;
    transition: all 0.7s;
    width: 40px; }

.btngroup__count--double {
    bottom: 50%;
    font-size: 0.7em;
    height: 50%;
    line-height: 35px;
    text-align: right;
    width: 50px;
    border-top-right-radius: 5px; }
.btngroup__count--double i {
    float: left;
    margin-top: 1.2em; }
.btngroup__count--double:hover .nav--actions__tooltip {
    display: block;
    left: -35px;
    top: 0;
    width: 110px;
    z-index: 50; }

.btngroup__count--doublebottom {
    right: 0;
    bottom: 0;
    border-top: 1px solid #d7d7d7;
    border-top-right-radius: 0; }

.btngroup--nocount.btngroup--1 .btn {
    width: 100%; }

.btngroup--nocount {
    padding-left: 3.5%; }

.btngroup--double .btn {
    margin-left: -9px; }

.btn--inlineicon {
    margin-right: 1.25em;
    margin-top: 1em; }
.btn--inlineicon:hover {
    color: var(--brand, #341C4C); }
.btn--inlineicon i {
    font-size: 1.2em;
    position: relative;
    top: 0.12em;
    margin-right: 0.3em; }

.btn--action--preview {
    color: #4a4a4a;
    font-size: 1.7em;
    height: 51px;
    line-height: 50px;
    position: relative;
    text-align: center;
    text-decoration: none !important;
    width: 45px;
    z-index: 10;
    margin: 0 10px; }

.btn--action--preview--disabled {
    color: #b2b2b2; }

.btn--action--preview--active:hover {
    background: #fafafa;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2); }

.btn--action--preview--previous:hover .nav--actions__tooltip {
    left: -25px;
    display: block;
    width: 100px;
    position: absolute;
    top: 50px; }

.btn--action--preview--next:hover .nav--actions__tooltip {
    left: -25px;
    display: block;
    width: 100px;
    position: absolute;
    top: 50px; }

.btn--action--preview--replay:hover .nav--actions__tooltip {
    left: -25px;
    display: block;
    width: 100px;
    position: absolute;
    top: 50px; }

.btn--action--preview .nav--actions__tooltip:before {
    bottom: 33px; }

.create-showreel-unavailable:hover {
    cursor: default; }

.create-showreel-unavailable:hover
.nav--actions__tooltip.create-showreel-unavailable__tooltip {
    display: block; }

.nav--actions__tooltip.create-showreel-unavailable__tooltip {
    position: absolute;
    width: 200px;
    font-size: 0.7em;
    top: 50px;
    left: -17px; }

.nav--actions__tooltip.create-showreel-unavailable__tooltip:before {
    bottom: 55px; }

.nav--actions__tooltip.nav--actions__tooltip--responses {
    text-transform: none;
    top: 9px;
    left: -79px; }
.nav--actions__tooltip.nav--actions__tooltip--responses:before {
    bottom: 52px; }

.btn--filters {
    margin-right: 2em; }

/* ----- Read more on transcripts ------ */
.btn--readmore {
    background: #ddd;
    color: #333;
    margin-top: 0.8em;
    max-width: 100%; }
.btn--readmore:hover {
    color: var(--brand, #341C4C); }

/* ----- Tooltips on actiion menu ----- */
.nav--actions .hastooltip:hover {
    position: relative;
    z-index: 30; }

.nav--actions .hastooltip:hover .nav--actions__tooltip {
    display: block !important;
    left: 0;
    position: absolute;
    top: 50px;
    width: 230px; }
.nav--actions .hastooltip:hover .nav--actions__tooltip:before {
    bottom: 52px;
    margin-top: -3em; }

.nav--campaign__btngroup {
    border-radius: 5px;
    display: inline-block;
    margin-left: 0.5em;
    transition: background 0.15s ease-in-out; }
.nav--campaign__btngroup > a {
    border-radius: 5px; }
.nav--campaign__btngroup:hover {
    background: #eceff5; }
.nav--campaign__btngroup .btn:hover .nav--actions__tooltip {
    display: block;
    left: -55px;
    position: absolute;
    top: 35px;
    width: 150px;
    z-index: 199; }
.nav--campaign__btngroup .btn:hover .nav--actions__tooltip--wide {
    left: -95px;
    width: 230px;
    z-index: 199; }

/* single response pagination */
.btn--singleresponsepagination {
    background: var(--accent, #2d91e6);
    color: #fff;
    display: inline-block;
    height: 35px;
    line-height: 36px;
    margin: 0 0.25em;
    padding: 0 1em;
    text-align: center; }

/* ----- Add audio button ----- */
.add-audio-showreel {
    margin: 0.6rem 0.6rem 0;
    display: block; }

.remove-audio-showreel {
    margin: 0.1rem 0.6rem 0;
    display: block;
    float: right;
    margin-top: 1rem;
    color: #a2a2a2; }

.breadcrumbs {
    background: #f9f9f9;
    clear: both;
    float: left;
    margin-bottom: 1em;
    margin-top: -1.4em;
    position: relative;
    width: 100%;
    z-index: 10; }
.breadcrumbs:after {
    content: "";
    display: table;
    clear: both; }

.breadcrumbs__link {
    float: left;
    font-size: 0.8125rem;
    font-weight: 400;
    color: var(--accent, #2d91e6);
    padding: 0.219rem 0.5rem 0.219rem 1.5rem;
    position: relative;
    text-transform: capitalize;
    line-height: 1.85em; }
.breadcrumbs__link span {
    text-transform: none; }
.breadcrumbs__link:after {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 15px solid #f9f9f9;
    position: absolute;
    top: 50%;
    margin-top: -15px;
    left: 100%;
    z-index: 2; }
.breadcrumbs__link:before {
    content: " ";
    display: block;
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 15px solid #D6D6D6;
    position: absolute;
    top: 50%;
    margin-top: -15px;
    left: 100%;
    margin-left: 1px;
    z-index: 1; }
.breadcrumbs__link:first-child {
    padding-left: 0; }
.breadcrumbs__link:last-child {
    background: #D6D6D6; }
.breadcrumbs__link:last-child:after {
    border-left: 15px solid #D6D6D6; }
.breadcrumbs__link:last-child:nth-child(1) {
    background: transparent; }
.breadcrumbs__link:last-child:nth-child(1):before {
    display: none; }
.breadcrumbs__link:last-child:nth-child(1):after {
    display: none; }
.breadcrumbs__link:hover {
    color: var(--accent, #2d91e6);
    text-decoration: none; }

/* ----- Campaigns list ----- */
.campaign-list-image {
    float: left;
    margin-right: 1em;
    width: 80px;
    height: 100%; }
.campaign-list-image img {
    width: 100%;
    display: block;
    height: 80px; }

.campaign-list-image--textslide {
    height: 80px;
    background: url(/img/text-slide.png) #e7e7e7 no-repeat center;
    background-size: 60px;
    border: 1px solid #efefef; }

.campaign-list-details {
    clear: left;
    padding-top: 1rem; }

/* ----- Campaigns status ----- */
.campaigns__filter .btn--standalone {
    text-transform: capitalize; }

.campaigns__filter .label {
    float: left;
    margin: 0.9em 2em 0 0; }

.campaigns__filter .form__field--text {
    width: 300px; }

.campaign-status {
    float: left;
    margin-left: 1em;
    margin-top: 0.5em; }

/* icon on each campaign row */
.campaign__status {
    background: #f00;
    border-radius: 50%;
    display: inline-block;
    height: 10px;
    width: 10px !important;
    top: 0 !important; }

.campaign__status--pinned {
    left: -40px;
    margin-top: -5px;
    position: absolute;
    top: 50% !important; }

.campaign__status--all, .campaign__status--All {
    background: #B883E6; }

.campaign__status--active, .campaign__status--Active {
    background: #45D989; }

.campaign__status--scheduled, .campaign__status--Scheduled {
    background: #F75656; }

.campaign__status--draft, .campaign__status--Draft {
    background: #CACACA; }

.campaign__status--pending, .campaign__status--Pending {
    background: #F5A623; }

.campaign__status--completed, .campaign__status--Completed {
    background: #4589D9; }

/* ----- Campaign Language dropdown ----- */
html .campaign__languageselector {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 20; }
html .campaign__languageselector .btn--tertiary {
    float: left;
    margin-right: 1em;
    width: auto;
    max-width: 100%; }
html .campaign__languageselector .form__field--dropdown {
    background-color: #f8f8f8;
    margin: 0; }

html .vpm-portal--campaign-selectTopics .campaign__languageselector {
    right: 140px; }

/* ----- Campaign Summary Page ----- */
.summary ul {
    margin-top: 0; }

.summary dt, .summary dd {
    margin: 0;
    padding: 0; }

.summary dt {
    clear: left;
    float: left;
    width: 300px; }

.summary dd {
    width: calc(100% - 300px);
    float: left;
    margin-bottom: 1.3em; }

.pending_translations li {
    text-transform: capitalize; }

/* ----- Create Campaign ----- */
.schema-form-fieldset.advancedFields {
    background: #f9f9f9;
    margin-bottom: 2em;
    border: none;
    float: left;
    display: none; }

.advanced-fields-visible .schema-form-fieldset.advancedFields {
    display: block; }

html .form-group .mce-tinymce {
    width: 50%; }

/* ----- Create campaign campaign types ----- */
html .campaignTypes {
    display: flex;
    flex-wrap: wrap; }
html .campaignTypes .campaignType {
    flex: 1 0 31%;
    margin: 1%; }

html .campaignTypes--createcampaign .campaignType {
    max-width: 31.3%; }

html .campaignType {
    border: 1px solid var(--vpm-border, #D8DCE6);
    cursor: pointer;
    min-height: 340px;
    padding: 2em 2.5em;
    margin-bottom: 1.5rem;
    border-radius: 5px;
    text-align: center;
    box-shadow: 0 0.1875rem 0.1875rem -0.125rem rgba(0, 0, 0, 0.09);
    transition: all 0.25s ease-in-out; }
html .campaignType:hover, html .campaignType.active {
    background: var(--brand, #341C4C);
    color: #fff; }
html .campaignType .title {
    margin-left: -5%;
    width: 110%; }

.campaignType__image {
    display: block;
    height: auto;
    margin-bottom: 1.5em;
    width: 100%;
    max-width: 150px;
    margin-left: auto;
    margin-right: auto; }

/* ----- Create Campaign Auto decline ----- */
.autoDeclineIds {
    display: none; }

/* ----- download responses (dont currently work on multi and search projects)------ */
.download-response-disabled {
    cursor: not-allowed !important;
    opacity: 0.6;
    text-decoration: none; }

.download-response-disabled:active {
    pointer-events: none; }

.download-response-disabled-text {
    font-size: 0.625rem; }

/* ---- Create campaign - exclusion period ----- */
.form .form-group .exclusion-period-btns {
    float: left;
    margin-top: 0.5rem;
    width: 50%; }

.form .form-group label.exclusion-period-btn {
    font-size: 0.8rem;
    float: left;
    width: 16.9%;
    background: #fff;
    padding: 0.1rem 1rem;
    border-radius: 4px;
    margin: 0 0.5rem 0 0;
    border: 1px solid #ccc;
    text-align: center; }
.form .form-group label.exclusion-period-btn.active {
    background: #f00; }
.form .form-group label.exclusion-period-btn input {
    display: none; }

.form .form-group .exclusion-period-input {
    font-size: 0.8rem;
    float: left;
    width: auto;
    background: #fff;
    padding: 0;
    border-radius: 4px;
    border: 1px solid #ccc;
    max-width: 102px;
    box-sizing: border-box;
    overflow: hidden; }
.form .form-group .exclusion-period-input input {
    border: 0;
    width: 60%;
    height: 29px; }
.form .form-group .exclusion-period-input:after {
    content: 'Days';
    width: 40%;
    float: right;
    background: #eee;
    box-sizing: border-box;
    text-align: center;
    line-height: 29.2px; }

.form .form-group .exclusion-period-ids {
    max-width: 100%;
    width: 92.5%;
    margin-top: 0.5rem; }

/*
  Charts
*/
.campaign-container {
    position: relative; }

#sentimentChart {
    float: left; }

.sentiment__content {
    float: right;
    width: 40%; }

.sentimentInfo {
    position: absolute;
    right: 0;
    top: -5em; }

.charts {
    text-align: center; }

.chartgroup {
    float: left;
    width: 100%; }

.chart-container {
    float: left;
    width: 50%; }

.sentiment-ref {
    float: left;
    left: 42%;
    list-style: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 15px;
    width: 160px;
    z-index: 20; }
.sentiment-ref div {
    background: #9ccc65;
    float: left;
    height: 22px;
    border-radius: 50%;
    margin: 3.5px 10px;
    width: 22px; }

.sentiment-ref li {
    float: left;
    font-size: 1em;
    font-weight: 400;
    line-height: 28px;
    margin: 0 0 1em;
    width: 100%; }

.neutral div, .Neutral div {
    background: #ffdf92; }

.negative div, .Negative div {
    background: #ef5350; }

.other div, .Other div {
    background: #ccc; }

.campaign-container h2, .campaign-container h3 {
    margin-bottom: 1em; }

.donut {
    width: 800px;
    float: left;
    box-sizing: border-box; }

.donut-large {
    width: 100%; }

.grid-value-width {
    width: 100px;
    text-align: center !important; }

a.fakecheckbox:hover, a.fakecheckbox:focus {
    text-decoration: none; }

.colorpicker-visible,
.colorpicker-visible .dropdown-menu {
    display: block !important; }

colorpicker-saturation {
    display: block;
    width: 100px;
    height: 100px;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAACXBIWXMAAAsTAAALEwEAmpwYAAAKT2lDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjanVNnVFPpFj333vRCS4iAlEtvUhUIIFJCi4AUkSYqIQkQSoghodkVUcERRUUEG8igiAOOjoCMFVEsDIoK2AfkIaKOg6OIisr74Xuja9a89+bN/rXXPues852zzwfACAyWSDNRNYAMqUIeEeCDx8TG4eQuQIEKJHAAEAizZCFz/SMBAPh+PDwrIsAHvgABeNMLCADATZvAMByH/w/qQplcAYCEAcB0kThLCIAUAEB6jkKmAEBGAYCdmCZTAKAEAGDLY2LjAFAtAGAnf+bTAICd+Jl7AQBblCEVAaCRACATZYhEAGg7AKzPVopFAFgwABRmS8Q5ANgtADBJV2ZIALC3AMDOEAuyAAgMADBRiIUpAAR7AGDIIyN4AISZABRG8lc88SuuEOcqAAB4mbI8uSQ5RYFbCC1xB1dXLh4ozkkXKxQ2YQJhmkAuwnmZGTKBNA/g88wAAKCRFRHgg/P9eM4Ors7ONo62Dl8t6r8G/yJiYuP+5c+rcEAAAOF0ftH+LC+zGoA7BoBt/qIl7gRoXgugdfeLZrIPQLUAoOnaV/Nw+H48PEWhkLnZ2eXk5NhKxEJbYcpXff5nwl/AV/1s+X48/Pf14L7iJIEyXYFHBPjgwsz0TKUcz5IJhGLc5o9H/LcL//wd0yLESWK5WCoU41EScY5EmozzMqUiiUKSKcUl0v9k4t8s+wM+3zUAsGo+AXuRLahdYwP2SycQWHTA4vcAAPK7b8HUKAgDgGiD4c93/+8//UegJQCAZkmScQAAXkQkLlTKsz/HCAAARKCBKrBBG/TBGCzABhzBBdzBC/xgNoRCJMTCQhBCCmSAHHJgKayCQiiGzbAdKmAv1EAdNMBRaIaTcA4uwlW4Dj1wD/phCJ7BKLyBCQRByAgTYSHaiAFiilgjjggXmYX4IcFIBBKLJCDJiBRRIkuRNUgxUopUIFVIHfI9cgI5h1xGupE7yAAygvyGvEcxlIGyUT3UDLVDuag3GoRGogvQZHQxmo8WoJvQcrQaPYw2oefQq2gP2o8+Q8cwwOgYBzPEbDAuxsNCsTgsCZNjy7EirAyrxhqwVqwDu4n1Y8+xdwQSgUXACTYEd0IgYR5BSFhMWE7YSKggHCQ0EdoJNwkDhFHCJyKTqEu0JroR+cQYYjIxh1hILCPWEo8TLxB7iEPENyQSiUMyJ7mQAkmxpFTSEtJG0m5SI+ksqZs0SBojk8naZGuyBzmULCAryIXkneTD5DPkG+Qh8lsKnWJAcaT4U+IoUspqShnlEOU05QZlmDJBVaOaUt2ooVQRNY9aQq2htlKvUYeoEzR1mjnNgxZJS6WtopXTGmgXaPdpr+h0uhHdlR5Ol9BX0svpR+iX6AP0dwwNhhWDx4hnKBmbGAcYZxl3GK+YTKYZ04sZx1QwNzHrmOeZD5lvVVgqtip8FZHKCpVKlSaVGyovVKmqpqreqgtV81XLVI+pXlN9rkZVM1PjqQnUlqtVqp1Q61MbU2epO6iHqmeob1Q/pH5Z/YkGWcNMw09DpFGgsV/jvMYgC2MZs3gsIWsNq4Z1gTXEJrHN2Xx2KruY/R27iz2qqaE5QzNKM1ezUvOUZj8H45hx+Jx0TgnnKKeX836K3hTvKeIpG6Y0TLkxZVxrqpaXllirSKtRq0frvTau7aedpr1Fu1n7gQ5Bx0onXCdHZ4/OBZ3nU9lT3acKpxZNPTr1ri6qa6UbobtEd79up+6Ynr5egJ5Mb6feeb3n+hx9L/1U/W36p/VHDFgGswwkBtsMzhg8xTVxbzwdL8fb8VFDXcNAQ6VhlWGX4YSRudE8o9VGjUYPjGnGXOMk423GbcajJgYmISZLTepN7ppSTbmmKaY7TDtMx83MzaLN1pk1mz0x1zLnm+eb15vft2BaeFostqi2uGVJsuRaplnutrxuhVo5WaVYVVpds0atna0l1rutu6cRp7lOk06rntZnw7Dxtsm2qbcZsOXYBtuutm22fWFnYhdnt8Wuw+6TvZN9un2N/T0HDYfZDqsdWh1+c7RyFDpWOt6azpzuP33F9JbpL2dYzxDP2DPjthPLKcRpnVOb00dnF2e5c4PziIuJS4LLLpc+Lpsbxt3IveRKdPVxXeF60vWdm7Obwu2o26/uNu5p7ofcn8w0nymeWTNz0MPIQ+BR5dE/C5+VMGvfrH5PQ0+BZ7XnIy9jL5FXrdewt6V3qvdh7xc+9j5yn+M+4zw33jLeWV/MN8C3yLfLT8Nvnl+F30N/I/9k/3r/0QCngCUBZwOJgUGBWwL7+Hp8Ib+OPzrbZfay2e1BjKC5QRVBj4KtguXBrSFoyOyQrSH355jOkc5pDoVQfujW0Adh5mGLw34MJ4WHhVeGP45wiFga0TGXNXfR3ENz30T6RJZE3ptnMU85ry1KNSo+qi5qPNo3ujS6P8YuZlnM1VidWElsSxw5LiquNm5svt/87fOH4p3iC+N7F5gvyF1weaHOwvSFpxapLhIsOpZATIhOOJTwQRAqqBaMJfITdyWOCnnCHcJnIi/RNtGI2ENcKh5O8kgqTXqS7JG8NXkkxTOlLOW5hCepkLxMDUzdmzqeFpp2IG0yPTq9MYOSkZBxQqohTZO2Z+pn5mZ2y6xlhbL+xW6Lty8elQfJa7OQrAVZLQq2QqboVFoo1yoHsmdlV2a/zYnKOZarnivN7cyzytuQN5zvn//tEsIS4ZK2pYZLVy0dWOa9rGo5sjxxedsK4xUFK4ZWBqw8uIq2Km3VT6vtV5eufr0mek1rgV7ByoLBtQFr6wtVCuWFfevc1+1dT1gvWd+1YfqGnRs+FYmKrhTbF5cVf9go3HjlG4dvyr+Z3JS0qavEuWTPZtJm6ebeLZ5bDpaql+aXDm4N2dq0Dd9WtO319kXbL5fNKNu7g7ZDuaO/PLi8ZafJzs07P1SkVPRU+lQ27tLdtWHX+G7R7ht7vPY07NXbW7z3/T7JvttVAVVN1WbVZftJ+7P3P66Jqun4lvttXa1ObXHtxwPSA/0HIw6217nU1R3SPVRSj9Yr60cOxx++/p3vdy0NNg1VjZzG4iNwRHnk6fcJ3/ceDTradox7rOEH0x92HWcdL2pCmvKaRptTmvtbYlu6T8w+0dbq3nr8R9sfD5w0PFl5SvNUyWna6YLTk2fyz4ydlZ19fi753GDborZ752PO32oPb++6EHTh0kX/i+c7vDvOXPK4dPKy2+UTV7hXmq86X23qdOo8/pPTT8e7nLuarrlca7nuer21e2b36RueN87d9L158Rb/1tWeOT3dvfN6b/fF9/XfFt1+cif9zsu72Xcn7q28T7xf9EDtQdlD3YfVP1v+3Njv3H9qwHeg89HcR/cGhYPP/pH1jw9DBY+Zj8uGDYbrnjg+OTniP3L96fynQ89kzyaeF/6i/suuFxYvfvjV69fO0ZjRoZfyl5O/bXyl/erA6xmv28bCxh6+yXgzMV70VvvtwXfcdx3vo98PT+R8IH8o/2j5sfVT0Kf7kxmTk/8EA5jz/GMzLdsAAAAgY0hSTQAAeiUAAICDAAD5/wAAgOkAAHUwAADqYAAAOpgAABdvkl/FRgAAFJhJREFUeAGMU+/q4kAMzFYf4LgP96a+q4c+gSIqxf/r5maWDoTgz15gmM0kW5uMLa21v2b2G6jAG2iEzqUU6q5c/OlMuHtL/ULNd5TP6EJ1RP7NuXvKE397jmbg7MrzHI748T1UA3eopyGQV2qK1+vVHo/Hm1itVm0J7Q+afwGMmgeRphf7Noh6lCeuHJAvm/X8rAQNlw2VScoj6863OQjl2ZB3qkeu5Lh0RJ3qynuNjJA21FppQAHa8/l83263No5jOxwOttlsbL1e2xIXXpMZzzRsXoTw34bQgLiQbKh6M9SXDBSypn4XGOSkGUO1cJdn1Yh4/qYVgctmGSwXyARNcOSFRuBMHvA1GMzwy+Vix+PRdrvdYrvd2vl87oZYDCxBL9B/jEyopghzlNjL0DlB+gAoPNXyOfa3oA9puXonyVHzdH+g9MEISa5z0qUNkwkm6MJkxALg8mlMAxvNwBfhYLvf7w50vl6vBV9H2e/3BjYateQDY8gM5bmWovygdyEb87k/G5Zz9c/2zfEQFysO5nDJ6mMel91Z//pwFpygIWIaMXE3AoYssPBCI/B12DiONMT5VZxOJ0f+j/MyWo5chYGowfn/j03lNXBpl85Up8d46u6DChBMvKv2UePrrAsChtdLTi73oEBjFDYpmIp/KSgRhRw357sXuHLknRgI8d90F8QL761oI8iQeJqvUOGnAoEkgNblF13iiJASZCwhLkG+v7/Halvt5+enr7x+02lZOwKymJ7jMAXK32RxaXnNxfXzCOkCxTO2I3NiR0i9gAjQLLoVHkKG8pCi0UT4Q0h5xUFIlBJEYmg+1yg6TrUq+YfEWKK0lWsSS8+DkNvCWtvJXu0UbDyH/NYjoDHFybPd/cPeficiW5LvkVdBNY4UoIqOQMwPBXm9vUYIVCj3GkXCCo1tRS//uMhYoVG3q46HaBQtamESTs/+0o92hOTaBbqjBwpu8reCuzAP4rkXpQBzQwbhZxD7jNYEAS4CI2Rg4hLitPUor2hGh6j4hQ5FfWt8LQF+SwyJIpGUV05nu56VHqJhR8ybb+Q+/dnPYZYSigIICvY3xfYxCckz/qazprjDiFJ+5DWVwscaMpSDgkleI2uutaKk5kPFNTqO8pBDlBQZEqKvoJXp7+lxzx7Cuoqp2M7zlrm5JbH/9oZ/GLdzBGf9FNmmvPi+h2FXnm8L5WhdCMJNyr1D6yvKP1rFQYgSjWpteE0JMraEME8ykpzo/0/+wcg5yGHMooegQYIRyXU1i52tCSfn9oSQFH+Fe4jypxs3RHA+xNCcNUZ+BXRg7iu0lhgDAesisSfE6UA0iudz9sNHKChek5eBX9a+FwKkKQ+Nd6JljkLX6B4x2L8hhHOsVdhR4iHEEe1LeWJCSI2tCo9AU3OIKHGgbupv6NvyRciGgMzPPLP5LmhPdKTx8qgSWIXxVkZx8QJihmCvPP8nE6IRXniKT9GThhKF0QkZal3KQYcLgn+s8YwWJiNnLVL4mOz1b+4piM8/+YYb8xNlLoASXqC7c9DCOokhl4RAKgSkCNM9wklBOPL4BIJoblQggsb8Km9W/IlIJkKrPN4xEETPwtS3hczrp8//pxmzpoUIBfeSO8r8/OE59wgTIsnIb4yBj7Cft6pYI8Sbh5TBD749IANSlKPgJQQmrr0uUfjbCnlV/V9OCfLpDc9b0nw4x3bznAbWFAyfUeBLEIhA3uaCKifFyUBg8pg+Ro8nOCVOintKoy0xj5bFvhNCQMAfoUqgc8UwMRot8dWy/qPcDHQk5XkgOPD97//Gl/xC2kKlkhl2V4pMQmAON+22E+4XgIzMKYMSmp7S0ymTcpYEYM6eVjKlJV25HgYguZ6lD1hR4S4byoxRwMUQjm87MYVxrW19nCqbgTD4kSEde7FlxcF4tKDCPu41lBUKa7tjgGuHJuPCwpBPdcONuVTiMEMgbPpugJE0+GIRusL+yD9qGhrP05ClFHfOuppZeV4ZkgyJdJc3dkxh0+8YDBpbsyuxrXYzV4VfmJLFwxdAEq7azIj9Yw9AuUCjEL3I7pD1xgo0BPv5Y2U9MCBvegpGxq9/vK7BftOQssP3ueL+HfJwLkAqVLlgPH9CF7phgMoKj/X8EjiNCtGQHzFU9mM7gsR8W/5wkuZ9ZUKBcYuWdE3qU2YYqLIllfo5aog2m2haKnlsvP30YUHO+3f9Yu2GrNpW2rYV8id2bM/9KxBPc/QgZQT9AlotQRtgSls1pIDADvo+3hL0bXBU0yxqG4Fx2ZshdXSBaEjZYtIdh/uxQDOrpMV/Biatjj8nzRgq8p0Ud6w9fAwwe+9mSJPWUMWzPG+A21ZWG45nhoQp1RdaBZ1WYDteUQ4gffvH1jomTHlkxk9GTDi5AS0YAODxMoRjMiqsjq/MyqvFFJX9buv6+18Y8mwDyFRH7Dj+T1rBtYivRV1v9mHtiKhfD10QrRFdsxor9Z4bgChAtF22fLsv1sfsGL4B0grazi9DygpagZ0A2s2WBMBmLn0de15D11KG5WSAvh20rB92fEIVwk0jdV2qPdyWr4mYuw75NMua7FFtmZxbkN7qi4DSFgaqQjc75GwDwbgBMkMMAPfD6cR1wpl1o7GftDhMMSPaFmm05+Tv/HWW9aQXbMfiBAZ4cNLdnz6hyAyj7ki9oQYYqdYd4h405JRwXs4DhLKozKhzG65449eQ4i5nX2LKXYjCVDcWF58Y0uJvj2EpY2VN79NzjHlVF8E1M2JZxOzW62rIEhhlywoAMMhrS8dFBJhgMJx5aRxg/fv9rSW9WN7LeQxZPn4bo6ExYgppsWNkQIt2pOAU8DAK8Oh/yK7ECM8pCAboJDTRFNsJQ3ZkBdtFXgV+A5qAEasl4sk2WxjOzn9PY6sZ1ZxJD/p9FMwoc1pjLNhEbLd2eX2Kpv6Y+aSCn8OUxhqyGBOwS9fxUiwDPIXfZw2JeNs+hS2/2R6r2Lfv+S/ivt3PG7eHh3S/52EDDD0j5h9rStliJiQLc5/fW9wP0PNcfB77nmVpX6Js2WaOQwb9OrXLJ9UMz7UmuJaAQj7fjxi6V97wIGftsqVMwcGZN2ZTL30fr7IYkL4xpG/9Y9bV677pUYXfrHk5tzuvoS1aRPX9ScV+3+Mn1FU7YMR6GT8LEP38xs2OyzVZRjIz9mWrIV2lTYo6LLk3BKXGKCM47jycKCb4zb4GzBi0g3Ec0a9OsBVQQsp+YwTjo+Mr9C/MQluIJmIkYYvvzpL2RhuiKT1uttTrK+q74p8siUsR64/nlS3XedcfZgY6kfUsv/FOUZfOlwGTfjyPCxjrRDbCvMLr4vCc9kN26pBR7H8KuW0wHZrkYCzj2+z5WbPCoZM2rISeEwop48KRZdhiPtmYLXNSyZs91YAeH06dow/Vpg3o+W9a/hbgPI5jTnvdx5YxZUbrCY1V7De22qProHXrDL/9B8dlHIuM3QQqUxL7d/pLyyqrzKlV6/2O/F/GBXP6ochjYdiKvQ4saA1ddlTvY/bEkY9Wa1iLkEN2JVavOhxHRlvqMF/XAnEVOJgXy3fAhCgY0N8bC0Nnpl8Lw/bt2LnCnsENO6o5r7bMcn2hONzQswSK2WVbphBy2kcjGqqWNRJQfU6ALwFgHTlo41pWWaE+O4V2zuhYZ1jYinTnvVmcC0Oclck+MgTH1jZU9Ty/VWaUIS42JwFPpkiWyDiZafZDygiJTseTIrc/g5v1qYQ6kgVnT48A+bztNN774MD2U8kDphjxaP18nyGzZBGUh7Y9L1uGvIp6Mq3EePVl7Xxf2/pE9gWI2KTFX2J3xx8Z0jWvnv+VhaG6tr8vkccerdTfdvhaXzTlLUM8t6HNIa9a4DfuDYgCWEaUCQ5jBcz2YI43lgqsrRi21F+pRThPhW5NvqLDK0Nw5E7RV7DKjDreX69/ZVY14wGQ8+HN733OxHGci9MKTBlkMNCSMqJA/udFzgg5IWqXKW9pbwvDu9VxFIjREGtHAS1w7rs4bcXtpIEV1t7H9QdgfmPIGrTmKDAW+gmIFHxNaRl3iCKEvYcsjuPAgTEzQ5zO2SHY3q+FX98oqti8casANPRxL19nx34JWZ9XQJ4r+uOLpmwxZxGyZF8Bcb9lf+dUR0zZgjwCigMKmGltbXG/SzZmUzQlxzMzGCdcmVUDEH3OijXp7k5StNVSh7xnV6Nju98+MaTMaMjK+b7xCy2gD1vk+G54eVxM6PEzM2TLqjJk3IdR/4iG7RSF+y1klQk4jqGvb/h4n6TBQwHZ77GYE0alLzZOTOl1+ShiFvUyBYRJIvSC1PFPfYemMoW+EpWXtaznArCLitWSnX6BKnPOLkTWIT/3vB3SEFemqF+m0Bh7ZIoY13m7IfmhfyxNzsu90j/f65Bn5hSoMSHIvPE+nptWAKesbWRY6xJax/NG30AnvS4AAPkVEOuDmHBk3KJ+dsewIt41+3t8+kqRB85Sy82QAmZmpGrfGnfqejZrKlP8Rv+GIZ0nnWi/Ys74kWzs6Ly7INTfYvA4CshcGL6wpSJ8I1/GtLCs9ji0lQG+vgzBOkmInRh2a0Y1If0DYPmr5vTPwIv9hCWPXyBcjUGL+n+PhWEdL9Rhi390Wv2lxeHRjGZbYR0Os7DWgb0f15VVzPd5XVcgClAZ41se8uE/3efT7Eq7oQXk7xpSB3NcrfAYzGmFLUAL1MwYtabPjBeYXhcAAGolA3vSjJkZ88Zdx6+/pzrEaf35x9XeODgANYTlPox167cOfmJMAbnv4+1QGNA6pAwpg8qInhdAPa4GFTjrKQi5XSAsjrsf0qWSb3sjm+M4vQz5fNEaA1TGTMxo9vVu2wIATgWozlfavegXZJ7h/+3dYY7cOA7F8VQnu/e/5u4dtnqRwThD/KA/ywU0Jl9GQGCZkl0yHx9JSW4nGPRxKXuA8RzG/BygfJchBtujW5Ipzso9R5HGA998fC7MCMX2kYyrC+mrwd9z7+n5ZIMM9bODV8kYUjuEoeTPAyPemVxq0feB+cJ/xJYuKj3qFoL3r0khi4uHLEvLJwitTGlA4pz734whA7A+ElO05MEer2vLt9hPRgoQcVQmBUM6oNf7VxPlOXudyl7AYEI3Yk0z4TOYxXyEVDliCvOZp+NH8cmAEXNmevVk1p7fpr89MZyKP1l9xZIXzPmIdPmkkLlrqEL8bpbu8XUBJOTT+psdPAvPMV1LAnOlvgkIfyPoPsjxMxquUV2ncX/do65KmSvOriY70XSF2OecL0A7Yf08eYKMJeiHuFq7hE+A2V3WUGgE7sEKGHFjTuNKwAfp8HPGLRUA4N+GAv8QaOkqr91Yl9E+ActMDb059ktX92PIolQB+Hx9Ta9voeB8y/4A9mmCqjyzMvY5PhjHMchf7REHZNH15xSTIfafLss/R2hABEKmtPK5VwPszNms7xOwLB8VM5RrqZbprier+Ei/cncBZYzxQkCaIdv+uUvr9Mm3ViKmPIwBk0GAL7N0mRFjWh6z/+d0oRrAVGTMMSZwMwP9dOvW6077IcWUufB3cjnXUspxM2l+YvZwf2PHtFI+vEm/YMbhvGIJ/SI7Q4kyJGJVsk9mjIniD7Os27GEPjLiaLE323Nyimu85GXtMhM3kvs3F8BPsr+NISPNpR0WhKuaxvkSkIeu5PpW1rWqSrvnMqn+nvE4TxkymeA5zOnzcZnn34whtD281rb511sX+5mTPGVmrWWZP1vPd31Xix+gvMGcEwO9RycRvdFm7DH1TMB1VbqnQ1enDMYUWfNwtRelN1Nc32KVuIBA3qlxj6GMpZlhPYB4VIzyt4JhFyN+nXs/FH8vy5p7HlMZIjwyiGNGtCluDOrElNXKG+gEeAcw5j4HVygTbBf4qfTt/V7rP+YX5a7B+S1FFxFBvSeMs06/zfVk3f0Zf98gbJJge9WV6bKW9hP7vG8EeHcMUYxKOLkvY4D+WoDGMQO9TAt31oC2mysDAqhwaWBmf5iTACADEPZDZMJunYJG8NU9IburyOhztPgyjOt4igUE+3xW2SCYm7IFPQJ6z9SvclKKD6tchS0uyz4F/gocYDcjPLaRnTBIVzaex+Mp/pxiyXMAknvq5bZOR/vLBhX0oH8r/v6xx6d27x8FAgU3a2RixRCSooshjxUQPyV+zGooKD+PBUSwLmVfAWa09bOgZ9zQAwZMr/AcR1n10mWlHzaoNrv6WAogdazY9iXHUalOt+8FsJ8nt49rHYAMlxWAzBRYBWbATdkAVIujr22vLNd4Z+Z253pdh8quMQuMCp4NHUcA5PjWieDAjqByANJ1gRV0AcQ0yfioe6Rpldm2M6d/WuVHW7isUJ5lUV4yQ5mgC2y4SYGq/t5vjU8b4xmDynxo/TIi6iX7fgRk/ueQbrSMPY+rbrawAlfgFLA1nylSAHRbbjDj/n36ehk8ZBPome5eRZfV8w/lo+hK7Huso1TqgDkskvoat+L/X3QsGoDM2tHouKDcJmPWeT9kobMvXc+dwrkOhtJeK/Nm/XEXaCx01ssAWtc99rUOAJ6Uu/srhrQyWgn2g4K6GOvZL5TBwwSA742/x7ijZF3F7tfNUi7Lh5grvwbisoxwYReZamaf9VC8cWhVsAuV4Y5oYyaNcdAuoPa1TcPQZX3v/y16+N55kyFTGQIxNLcDpwIvFKe7cU7keHd2VMxrhR+Y+WXnx+xsrPbm4Mf+eTMn1mYGaFrjptDj/ZmkmjaXVWv19slxkTXJynCvnIdL8zdZOnn83A9ZFSTAB4VsSpGmyipunCjuGN9liwzZs8ddwQVEyzeyuGPYD7APuOS6o7aO9xWo/P3fbrnF8e5y2+7Lnamvyg8GKNeKog2m2NaW+SjwLCQhlr5/M6DamjnNlAbJLKtBaQZU226Ru2KbCe+Ph6Tk3THb/v5zaRQ7yz4M6usa1HywJU50n+7bgb4Z0sC2XIa8P56+JvvuWHTaa6kgbLn7ELvV9bU76A0+hpTKuh3PoryDwKvrflwx5F/1IMaK9wrK+h3ltf/+bb8d5d8/XdZ//txS/N9hxfdvGNg/ZQT1//4fih7V/hdi/qwAAAAASUVORK5CYII=");
    background-size: contain;
    cursor: crosshair;
    float: left; }

colorpicker-saturation i {
    display: block;
    height: 7px;
    width: 7px;
    border: 1px solid #000;
    border-radius: 5px;
    position: absolute;
    top: 0;
    left: 0;
    margin: -4px 0 0 -4px; }

colorpicker-saturation i::after {
    content: '';
    display: block;
    height: 7px;
    width: 7px;
    border: 1px solid #fff;
    border-radius: 5px; }

colorpicker-hue,
colorpicker-alpha {
    width: 15px;
    height: 100px;
    float: left;
    cursor: row-resize;
    margin-left: 4px;
    margin-bottom: 4px; }

colorpicker-hue i,
colorpicker-alpha i {
    display: block;
    height: 2px;
    background: #000;
    border-top: 1px solid #fff;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    margin-top: -1px; }

colorpicker-hue {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAABkCAMAAABw8qpSAAABLFBMVEUA/z8AuP//JAAA/33/3AAA/1ABAv8A/7r/AH7/jgD2AP8A//j/AEHmAP/XAP/HAP+4AP//ALyoAP+aAP+JAP97AP9rAP9cAP9MAP8+AP8tAP8fAP8PAP8ATv//AG7/cAD/vgD/APoAmv//ADH/AKwB/wMA5//4Eg4AL///AOr/UQD/nwAA/27/7AAA/+kAe/8Ayf8A/5sA/zEA/6z/ABEAEP8A/17/MgAA/9n/ACL/gAD/AJ0AXP8Aqv//AMoA/yHqFBb/zAD/AGD/ANsA9//1/wDk/wDV/wDF/wC3/wD/AI2m/wD/FACY/wCI/wB5/wBp/wD/YgBb/wBK/wA8/wAs/wAd/wAN/wAAPv8A/xH/AFAAi///rQAA/8r/+gAA1///QwAAH/8Abf8A/43c/JNGAAAAiUlEQVR4AQXBg2EDAAAAsMy2bds2ttp2+/8PTby79mDLsKJPq/oFPdk24dWXAxsGjRg1ZtykKdNmzJozb8GiJct63WjYl7fiWdOZkk0vOpyr2fVtyKl7FX2uXGjpcuxWDy69KdiRk5WRlpIUFxMVERLw78+vH1Unun1YV3ZkwKM1CYfq7nQK22sD03ITV2Aqp0IAAAAASUVORK5CYII=");
    background-size: contain; }

colorpicker-alpha {
    display: none; }

colorpicker-alpha,
.colorpicker-color {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAABkCAMAAACIElGlAAADAFBMVEUAAADT09PT09P////T09P////e3t7q6urT09Px8fHT09P////////T09PT09P////////T09PT09P////////////T09PT09P////////////T09P////T09PT09PT09P////T09PT09P////////////////T09P////T09PT09P////T09PT09PT09PT09PT09PT09P////T09P////T09PT09P////////////T09P////T09P////////////T09PT09P////T09P////////////////////T09P////////T09PT09P////////////////////////T09PT09P////////////////////////T09PT09P////T09PT09P////////T09P////////////T09P////////T09P////T09P////T09P////T09PT09PT09PT09P////T09PT09PT09PT09PT09PT09P////T09P////T09PT09P////////////T09PT09PT09P////T09PT09PT09PT09PT09PT09PT09P////////////////T09PT09P////////////T09P////////T09P////T09PT09PT09P////////T09P////////T09P////T09PT09P////////////////T09PT09PT09PT09P////T09PT09PT09PT09PT09PT09PT09P////T09P////T09PT09PT09PT09PT09P////////////////////////////////////T09P////T09P////T09P////T09PT09P////////////T09P////T09P////T09P////////////T09PT09P////////////////T09PT09P////T09P////T09PT09P////T09P////T09PT09P////T09PT09PT09PT09P////T09PT09P////////////T09PT09P////T09P////////T09MQsm1FAAABAHRSTlMAgJN8/vcDAfcCnJyGaZmZlomGk4yJOmM/eTxs8wY0YDFC7HNdLx18n5/7aUvzCcW9+qKiK8P0ZiltRwfdw/n8Px3WduJjItj78ss5PDHUNELbwP5wplA2FglEVwvkqNarCs4Z7b2sDLgQ0xNdyLrr0eLLUeW1Vs5TWQLwjPI3ZvQGdvxFyFrAeevaLCLvGd0kpRskGyf4qK605xKvFrGyDRHnBYMEkJaDkIBvB/gpH99O6CrbIC4nH3Lg2SXp4A7Qul/GDEgPSlMQ6LjqFU0SjyCCj5V/gnBN7xglL3O70WBU7gjFFEfft0sPTo1ndRipwXr2yRemWRVENq+ytbGuxGaWGQAAAnpJREFUeNpNxmdcDHAAxvEHOWXvmXX23ntv2XvvMg/Z44x0KaRBSnfcKSqlnYZKp1QqGpT20KZh783/eePj+3vzw3/q/AM9iURPTy6XS+RwcXNzcZMQTE1dTE3bE7y9S0u9xxD600rCGtpI2ErOsbGxzoiMrIqscnaOi4vDdnp4XYSrguwxQSb7KpMllycnl2MFaTSaTxrY5NrY5BoKb2BnZ2doZ29vb2OPSdSd4Bcc7OcXGhqamgqrYCsrq+mEiEtC3gUBDg55Dg53IkQYSYG+gb6+GEqB5wV0o5D8/JAQdKK5hA40n3BS+L6c0JJmE+ZQW8JEak1YQJ0Jq+jbaQEPnotGE+IrK+Pj+xKqU6pTUrIDAgKysZ+WEY5QQkJxcQIO0WrCUbL4YmFhgZ3UlVAUHR1d1JEwjVoRRpDJKxMTE/ShBoRR1I6whLyyvLyyUFAQFhbWhTCFFArFawXOCu/bEHpQLYKnZ0aGZw2CR1qah0dmpqurK+pTU0ILakJoTi+PC7j5RHTrqQg1qRkh3T3d3b0xoSE1ItSleoSe1IswmIYQPl8UlhLWkaOj41tHbKENBLX6j1qt/KFUKnFN+Onk9NvJCQdJpfqlUqGiIjExcRthN91/JsJmGkhYRO/OCBhHwwgxMWUxZQMIu8j8o7m5OfbRLMJh2kTYQ1FRhYVR2EHzCOtpMmEG3SUsJEvLoKAg2Prb2tqOJYSH+/uH33shwlTaS1hLBwhX6AYX2tuiRwStVntOa5yUZJwEqbREKjUi5Bjl5BhZW1uXWOMYGRBOnNDX1zfoxz1FwwkfSJfgo6vr41P7soBBNJ7Qm2YSzHTMzMwmEHRoMf0Fm5mYOUrzNBYAAAAASUVORK5CYII=");
    background-size: 10px 100%; }

.colorpicker {
    top: 0;
    left: 0;
    z-index: 9999;
    display: none; }

.colorpicker colorpicker-hue,
.colorpicker colorpicker-alpha,
.colorpicker colorpicker-saturation {
    position: relative; }

.colorpicker input {
    width: 100px;
    font-size: 11px;
    color: #000;
    background-color: #fff; }

.colorpicker.alpha {
    min-width: 140px; }

.colorpicker.alpha colorpicker-alpha {
    display: block; }

.colorpicker.dropdown {
    position: absolute; }

.colorpicker.colorpicker-fixed-position {
    position: fixed; }

.colorpicker .dropdown-menu::after,
.colorpicker .dropdown-menu::before {
    content: '';
    display: inline-block;
    position: absolute; }

.colorpicker .dropdown-menu::after {
    clear: both;
    border: 6px solid transparent;
    top: -5px;
    left: 7px; }

.colorpicker .dropdown-menu::before {
    border: 7px solid transparent;
    top: -6px;
    left: 6px; }

.colorpicker .dropdown-menu {
    position: static;
    top: 0;
    left: 0;
    min-width: 129px;
    padding: 4px;
    margin-top: 0; }

.colorpicker-position-top .dropdown-menu::after {
    border-top: 6px solid #fff;
    border-bottom: 0;
    top: auto;
    bottom: -5px; }

.colorpicker-position-top .dropdown-menu::before {
    border-top: 7px solid rgba(0, 0, 0, 0.2);
    border-bottom: 0;
    top: auto;
    bottom: -6px; }

.colorpicker-position-right .dropdown-menu::after {
    border-right: 6px solid #fff;
    border-left: 0;
    top: 11px;
    left: -5px; }

.colorpicker-position-right .dropdown-menu::before {
    border-right: 7px solid rgba(0, 0, 0, 0.2);
    border-left: 0;
    top: 10px;
    left: -6px; }

.colorpicker-position-bottom .dropdown-menu::after {
    border-bottom: 6px solid #fff;
    border-top: 0; }

.colorpicker-position-bottom .dropdown-menu::before {
    border-bottom: 7px solid rgba(0, 0, 0, 0.2);
    border-top: 0; }

.colorpicker-position-left .dropdown-menu::after {
    border-left: 6px solid #fff;
    border-right: 0;
    top: 11px;
    left: auto;
    right: -5px; }

.colorpicker-position-left .dropdown-menu::before {
    border-left: 7px solid rgba(0, 0, 0, 0.2);
    border-right: 0;
    top: 10px;
    left: auto;
    right: -6px; }

colorpicker-preview {
    display: block;
    height: 10px;
    margin: 5px 0 3px 0;
    clear: both;
    background-position: 0 100%; }

/*
	General Components
 */
.app-container {
    display: block; }

#loading-bar .bar {
    background: #45d989 !important; }

html #loading-bar-spinner .spinner-icon {
    border-top-color: #45d989;
    border-left-color: #45d989; }

.showreel-share .logo,
.header--old .logo {
    cursor: pointer;
    margin-right: 1em;
    margin-top: 25px;
    max-height: 70px;
    max-width: 190px; }

.pointer {
    cursor: pointer; }

.list-count {
    float: right;
    margin: 1em 0 0; }

.betabar {
    text-align: center;
    padding: 0.5em 0;
    background: #333;
    color: #fff;
    margin: 0; }

.betabar--modal {
    border-top-left-radius: 3px;
    left: -1em;
    position: relative;
    top: -1em;
    width: 99%; }

.warningBar {
    text-align: center;
    background: #333;
    color: #fff;
    margin: 0;
    position: relative;
    margin-top: -1.4em;
    margin-bottom: 1em;
    padding: 0.5em 10%;
    line-height: 1.25em;
    width: 100%; }

/* ----- Beta feature icon ----- */
.beta-btn {
    font-size: 1.2em;
    line-height: 1em;
    position: absolute;
    right: 0;
    cursor: pointer;
    text-transform: uppercase;
    top: -4.5rem;
    color: var(--accent2, #D91B5D); }
.beta-btn i {
    margin-right: 0.25em; }
.beta-btn i:before {
    color: var(--accent2, #D91B5D); }

/* ----- Current account in header ----- */
.user-account {
    color: #fff;
    line-height: 1em;
    position: absolute;
    right: 4em;
    top: 2.45em; }

/* ----- Order by controls ----- */
.orderby-control {
    display: block;
    color: var(--primary, #343845); }
.orderby-control:hover, .orderby-control:focus {
    text-decoration: none; }
.orderby-control:hover span, .orderby-control:focus span {
    color: var(--accent, #2d91e6); }

/* ----- Caption Preview ----- */
.caption-preview {
    background: #f9f9f9;
    border: 1px solid #f0f0f0;
    margin-top: 0.5em 0 0;
    padding: 0.5em; }

/* ----- Word Cloud ----- */
.wordcloud {
    height: 100vh; }

.wordcloud:hover text {
    opacity: 0.6 !important; }

.wordcloud text:hover {
    opacity: 1 !important; }

/* ----- taoster ----- */
.toast-success {
    background-color: #45d989 !important;
    opacity: 1 !important; }
.toast-success a:hover {
    color: #fff !important; }

/* ----- Code Snippets ----- */
.codesnippet {
    background: #f8f8f8;
    display: block;
    padding: 1em;
    border: 1px solid #ccc;
    word-wrap: break-word;
    overflow: visible;
    white-space: pre-wrap;
    /* Since CSS 2.1 */
    white-space: -moz-pre-wrap;
    /* Mozilla, since 1999 */
    white-space: -pre-wrap;
    /* Opera 4-6 */
    white-space: -o-pre-wrap;
    /* Opera 7 */
    word-wrap: break-word;
    /* Internet Explorer 5.5+ */ }

/* ----- List details ----- */
.list__details {
    clear: left;
    margin-bottom: -3.8em; }
@media (max-width: 780px) {
    .list__details {
        margin-bottom: -1em; } }

/* ----- Additional Data ----- */
.additional-data label {
    word-wrap: break-word;
    width: calc(100% - 60px);
    float: left; }

@media (max-width: 800px) {
    .additional-data .col--fourth {
        width: 31%; } }

@media (max-width: 500px) {
    .additional-data .col--fourth {
        width: 98%; } }

@media (max-width: 700px) {
    .additional-data .col--fourfifths,
    .additional-data .col--fifth {
        width: 100%;
        clear: both; }
    .additional-data .col--fifth {
        margin-top: 2em;
        text-align: center; }
    .additional-data .col--fifth .btn {
        display: inline-block; } }
@media (max-width: 700px) and (max-width: 500px) {
    .additional-data .col--fifth .btn {
        display: block;
        margin-left: auto;
        margin-right: auto; } }

.transcription-total {
    margin-bottom: 1em;
    float: right;
    margin-top: -1.5em; }

.transcription-total--alt {
    margin-top: 0; }

/* ----- Typeahead ----- */
.dropdown-menu {
    position: absolute;
    top: 4em !important;
    margin: 0;
    padding: 1em;
    background: #fff;
    border: 1px solid #eed;
    z-index: 100; }
.dropdown-menu li {
    list-style: none;
    cursor: pointer;
    margin-bottom: 0.5em; }
.dropdown-menu li:last-child {
    margin-bottom: 0; }

/* ----- Errors ----- */
.errors {
    background: rgba(255, 0, 0, 0.6);
    border: rgba(255, 0, 0, 0.8);
    color: #fff;
    font-family: Roboto;
    font-size: 12px;
    font-weight: 300;
    margin-bottom: 2em;
    padding: 1em;
    text-align: left; }
.errors li.no-spacing {
    list-style: none;
    margin: 0 0 0 -2em; }

.errors__title {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=);
    background-repeat: no-repeat;
    padding-left: 1.5em; }

.errors__login {
    color: #d50a52;
    text-align: center;
    margin-left: -5%; }
.errors__login li {
    list-style: none; }

/* ----- Userlike ----- */
#userlike-tab {
    display: none; }

/* ----- Embed wizard ----- */
.embednav {
    text-align: center;
    display: block; }

.embednav__link {
    text-decoration: none !important;
    color: var(--accent, #2d91e6);
    font-size: 0.9em; }

.embednav__link[disabled='disabled'] {
    opacity: 0.1;
    cursor: default; }

.embednav__indicator {
    display: inline-block;
    background: #eee;
    width: 150px;
    margin-left: 1em;
    margin-right: 1em;
    height: 2.5em;
    padding: 0.6em;
    border-radius: 5px;
    position: relative; }

.embednav__step {
    display: inline-block;
    width: 0.7em;
    height: 0.7em;
    border-radius: 50%;
    background: #333;
    margin: 0em 0.2em; }

.embednav__step--active {
    background: var(--brand, #341C4C); }

.embednav__steptext {
    display: none;
    position: absolute;
    top: -1.5rem;
    left: 0;
    font-size: 0.9em;
    width: 300px;
    margin-left: -75px; }

.embednav__step:hover .embednav__steptext {
    display: block; }

.embedsetup__step .form__field--autocomplete {
    width: 350px;
    max-width: 350px;
    margin: 0 auto;
    display: block;
    float: none; }

.embedsetup__step--additionaldata ul {
    text-align: left; }

.embedsetup__step--embed {
    margin-top: 1em; }

.loading-message {
    margin-top: 0;
    text-align: center; }
@media (max-width: 700px) {
    .loading-message img {
        max-width: 70%;
        width: 70%; } }
.loading-message .loading {
    margin-bottom: 20px; }
.loading-message .no-responses {
    width: 230px;
    height: 230px;
    margin-bottom: 20px; }
.loading-message .zendesk-redirect {
    width: 450px;
    height: 50px;
    margin-bottom: 20px; }

.has-loading-message {
    position: relative; }

.loading-message--inplace {
    position: absolute;
    width: 100%;
    top: 3em;
    right: 0;
    z-index: 20; }

.loading-fade {
    cursor: pointer;
    pointer-events: none;
    opacity: 0.3; }

._pendo-launcher-badge_ {
    transition: all 0.5s ease-in-out; }

.filters-active ._pendo-launcher-badge_ {
    bottom: 75px; }

.filters-active ._pendo-launcher_ ._pendo-guide-container_ {
    margin-top: -75px; }

/* ----- Generate showreel audio links ----- */
.audio-preview__btn {
    display: inline-block;
    height: 30px;
    width: 30px;
    border: 2px solid #000;
    border-radius: 50%;
    text-align: center;
    line-height: 29.9px;
    padding-left: 1px;
    margin-bottom: 0.7rem;
    position: relative;
    top: 2px; }

content-loader {
    width: 100%; }

/*
  Context Menu
*/
.context-menu {
    position: fixed;
    z-index: 10;
    display: none;
    background-color: #fff;
    padding: 5px 0;
    color: #4a4a4a;
    box-shadow: 1px 1px 5px 1px rgba(50, 50, 50, 0.5); }
.context-menu.open {
    display: block; }

.context-dropdown-menu {
    display: block;
    list-style: none;
    margin: 0;
    padding: 0; }

.context-dropdown-menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    box-shadow: 1px 1px 5px 1px rgba(50, 50, 50, 0.5); }

.context-dropdown-menu a {
    color: #4a4a4a;
    display: block;
    text-decoration: none;
    padding: 5px 60px 5px 15px;
    font-size: 80%;
    letter-spacing: 1px;
    position: relative;
    cursor: pointer; }

.context-dropdown-menu {
    display: inline-block; }

.context-dropdown-menu li {
    position: relative; }

.context-dropdown-menu > li {
    margin-left: 5px; }

.context-dropdown-menu > li:hover {
    border-left: 5px #4a4a4a solid;
    margin-left: 0;
    background-color: #e7e7e7; }

.context-dropdown-menu li li {
    margin-left: 5px; }

.context-dropdown-menu li li:hover {
    border-left: 5px #4a4a4a solid;
    margin-left: 0;
    background-color: #e7e7e7; }

/* submenu positioning*/
.context-dropdown-menu ul {
    padding: 5px 0;
    background-color: #fff;
    position: absolute;
    white-space: nowrap;
    z-index: 1;
    left: -99999em;
    top: 0; }

.context-dropdown-menu > li:hover > ul {
    left: 100%;
    min-width: 100%; }

.context-dropdown-menu > li li:hover > ul {
    left: 100%;
    margin-left: 1px;
    top: -1px; }

.d3SimpleGauge {
    cursor: pointer; }

.d3SimpleGauge .background {
    fill: transparent; }

.d3SimpleGauge .showHover {
    opacity: 0; }

.d3SimpleGauge .primaryLabels > text {
    text-anchor: middle; }

.d3SimpleGauge .secondaryLabels > text {
    text-anchor: middle;
    font-size: 1.33em;
    fill: var(--primary, #343845);
    margin-top: 1em; }

.d3SimpleGauge .showHover, .d3SimpleGauge .hideHover {
    transition: opacity .3s ease-in-out; }

.d3SimpleGauge:hover .hideHover {
    opacity: 0; }

.d3SimpleGauge:hover .showHover {
    opacity: 1; }

/*
	Date Picker
*/
/* ----- From PLugin ----- */
.calendar__fakedate {
    font-family: Roboto, sans-serif;
    background-color: #FAFAFA;
    position: relative;
    left: 50px;
    width: 145px;
    text-align: center;
    z-index: 100;
    padding-top: 1em; }

.subheader__icon {
    color: var(--accent, #2d91e6);
    display: inline-block;
    margin: 0;
    position: relative;
    top: 17px;
    float: right; }

.hide-text {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0; }

.input-block-level {
    display: block;
    width: 100%;
    min-height: 30px;
    box-sizing: border-box; }

[date-picker-wrapper] {
    position: relative !important;
    display: block; }

[date-time-append] [date-picker] {
    position: relative;
    margin-right: -1000px;
    margin-bottom: -1000px; }

[date-range] [date-picker] .after.before {
    color: #ffffff;
    background-color: #499dcd;
    *background-color: #2f6ab4;
    background-image: linear-gradient(to bottom, #5bc0de, #2f6ab4);
    background-repeat: repeat-x;
    border-color: #2f6ab4 #2f6ab4 #1f4677;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2f6ab4', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }

[date-range] [date-picker] .after.before:hover,
[date-range] [date-picker] .after.before:active,
[date-range] [date-picker] .after.before.active,
[date-range] [date-picker] .after.before.disabled,
[date-range] [date-picker] .after.before[disabled] {
    color: #ffffff;
    background-color: #2f6ab4;
    *background-color: #2a5ea0; }

[date-range] [date-picker] .after.before:active,
[date-range] [date-picker] .after.before.active {
    background-color: #24528c \9; }

[date-picker] {
    padding: 0;
    width: 350px;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none; }

[date-picker] td,
[date-picker] th {
    width: 20px;
    height: 20px;
    padding: 4px 5px;
    text-align: center;
    border: none;
    border-radius: 4px; }

[date-picker] .switch {
    display: none; }

[date-picker] table span {
    display: block;
    float: left;
    width: 23%;
    height: 26px;
    margin: 1%;
    line-height: 25px;
    cursor: pointer;
    border-radius: 4px; }

[date-picker] table span:hover {
    background: var(--hover, #eceff5); }

[date-picker] table span.disabled,
[date-picker] table span.disabled:hover {
    color: #999999;
    cursor: default;
    background: none; }

[date-picker] .active,
[date-picker] .now {
    color: #ffffff;
    color: #fff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #006dcc;
    *background-color: #0044cc;
    background-image: linear-gradient(to bottom, #0088cc, #0044cc);
    background-repeat: repeat-x;
    border-color: #0044cc #0044cc #002a80;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }

[date-picker] .active:hover,
[date-picker] .now:hover,
[date-picker] .active:active,
[date-picker] .now:active,
[date-picker] .active.active,
[date-picker] .now.active,
[date-picker] .active.disabled,
[date-picker] .now.disabled,
[date-picker] .active[disabled],
[date-picker] .now[disabled] {
    color: #ffffff;
    background-color: #0044cc;
    *background-color: #003bb3; }

[date-picker] .active:active,
[date-picker] .now:active,
[date-picker] .active.active,
[date-picker] .now.active {
    background-color: #003399 \9; }

[date-picker] .now {
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #ee735b;
    *background-color: #ee905b;
    background-image: linear-gradient(to bottom, #ee5f5b, #ee905b);
    background-repeat: repeat-x;
    border-color: #ee905b #ee905b #e56218;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffee5f5b', endColorstr='#ffee905b', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); }

[date-picker] .now:hover,
[date-picker] .now:active,
[date-picker] .now.active,
[date-picker] .now.disabled,
[date-picker] .now[disabled] {
    color: #ffffff;
    background-color: #ee905b;
    *background-color: #ec8044; }

[date-picker] .now:active,
[date-picker] .now.active {
    background-color: #e9712d \9; }

[date-picker] .disabled {
    color: #999999 !important;
    cursor: default;
    background: none; }

[date-picker] [ng-switch-when="year"] span,
[date-picker] [ng-switch-when="month"] span,
[date-picker] [ng-switch-when="minutes"] span {
    height: 54px;
    line-height: 54px; }

[date-picker] [ng-switch-when="date"] td {
    padding: 0; }

[date-picker] [ng-switch-when="date"] span {
    width: 100%;
    height: 20px;
    line-height: 20px; }

[date-picker] th:hover,
[date-picker] [ng-switch-when="date"] td span:hover {
    cursor: pointer;
    background: var(--hover, #eceff5); }

[date-picker] .active.active {
    border-radius: 0 !important; }

/* ----- Custom  ----- */
.filters__calendars {
    float: left;
    margin-top: 3em;
    margin-bottom: 50px;
    width: 65.5%; }
@media (max-width: 1100px) {
    .filters__calendars {
        float: none;
        margin-bottom: 50px;
        margin: 3em auto 50px;
        width: 720px; } }
@media (max-width: 750px) {
    .filters__calendars {
        display: none; } }

.filters__calendar, .datetimepicker {
    border: 1px solid var(--vpm-border, #D8DCE6);
    background: #fff;
    border-radius: 6px;
    float: left;
    height: 300px;
    position: relative;
    width: 100%; }
.filters__calendar:first-child, .datetimepicker:first-child {
    margin-right: 3%; }

.calendar__title {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    background: var(--hover, #eceff5);
    color: var(--tertiary, #71747D);
    display: block;
    font-size: 0.7em;
    font-weight: 400;
    line-height: 2.3em;
    text-align: center;
    text-transform: capitalize; }

.calendar__date {
    background: var(--hover, #eceff5);
    color: #fff;
    padding: 1.1em 0;
    text-align: center;
    border-bottom: 1px solid var(--vpm-border, #D8DCE6); }

.calendar__daterow {
    color: var(--secondary, #5C5F6A);
    text-transform: uppercase;
    vertical-align: middle;
    display: inline-block; }

.calendar__daterow--day {
    font-size: 1.7em;
    color: var(--primary, #343845);
    line-height: 1.1em;
    position: relative;
    top: -1px;
    font-weight: 500;
    padding-left: 0.5em;
    padding-right: 0.5em; }

.calendar__daterow--year {
    color: var(--secondary, #5C5F6A); }

/* ----- Quick Actions ----- */
.filters__actions {
    float: right;
    width: 30%; }
@media (max-width: 1100px) {
    .filters__actions {
        width: 100%;
        margin-top: 0; }
    .filters__actions .btn {
        display: inline-block;
        width: 30%;
        margin: 0 1.5%;
        text-align: center; } }
@media (max-width: 750px) {
    .filters__actions {
        display: block;
        float: none;
        margin: 0 auto;
        text-align: center; }
    .filters__actions .btn {
        display: block;
        width: 100%;
        margin: 0 auto; } }
.filters__actions .btn--med {
    margin-top: 3em; }

.filters__quickactions {
    display: block; }
@media (max-width: 750px) {
    .filters__quickactions {
        margin: 0 auto;
        max-width: 200px; } }

/* ----- Calendar daterange directive ----- */
.date-picker {
    position: relative; }
.date-picker table {
    width: 90%;
    margin: 0px 5%; }

.date-picker--end {
    margin-left: 20px; }

.daterange__action {
    background: #a11448;
    color: #fff;
    display: block;
    padding-bottom: 1em;
    padding-top: 1em;
    text-align: center;
    width: 100%;
    margin-bottom: 1em; }

.daterange__action:hover, .daterange__action:focus {
    background: #3b3b3b;
    color: #fff; }

html [date-picker] .now {
    background: #3b3b3b;
    border-radius: 50%;
    width: 20px;
    margin: 0 30%;
    display: block; }

html [date-picker] td, html [date-picker] th {
    display: inline-block;
    height: 30px;
    width: 14%;
    font-size: 0.7em; }

html [date-picker] th {
    height: 32px; }

html [date-range] [date-picker] .after.before {
    border-radius: 0;
    background: rgba(45, 145, 230, 0.28);
    background-image: none;
    font-weight: 400;
    color: var(--primary, #343845);
    margin-left: 0;
    width: 100%; }

[date-picker] .active:hover,
[date-picker] .now:hover,
[date-picker] .active:active,
[date-picker] .now:active,
[date-picker] .active.active,
[date-picker] .now.active,
[date-picker] .active.disabled,
[date-picker] .active[disabled],
[date-picker] .now[disabled],
[date-range] [date-picker] .after.before.active,
[date-range] [date-picker] .after.before.disabled,
[date-range] [date-picker] .after.before[disabled] {
    background: #2d91e6 !important;
    background-image: none; }

html [date-range] [date-picker] .after.before:hover,
html [date-range] [date-picker] .after.before:active {
    background: var(--brand, #341C4C); }

[date-picker] th {
    font-weight: 300;
    color: #727272; }

.response__info {
    float: left;
    width: 500px;
    width: calc(100% - 380px);
    width: -webkit-calc(100% - 380px); }

html [date-picker] .disabled, html [date-picker] .disabled span {
    cursor: default;
    opacity: 0 !important; }

[date-picker] th:hover, [date-picker] [ng-switch-when="date"] td span:hover {
    border-radius: 0; }

[date-picker] th:hover {
    background: none !important; }

/* ----- Selector for arrows ----- */
.calendar__link {
    color: var(--icon, #6C758E);
    cursor: pointer;
    font-size: 1em;
    line-height: 2.5em;
    position: absolute;
    text-decoration: none !important;
    top: 35px; }

.calendar__link--prev {
    left: 15%; }

.calendar__link--next {
    right: 15%; }

/* ----- Datetime picker ----- */
/* ----- From plugin ----- */
/**
 * @license angular-bootstrap-datetimepicker
 * Copyright 2016 Knight Rider Consulting, Inc. http://www.knightrider.com
 * License: MIT
 */
.datetimepicker {
    border-radius: 4px;
    direction: ltr;
    display: block;
    margin-top: 1em;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 320px;
    clear: both; }

.datetimepicker > div {
    display: none; }

.datetimepicker .hour,
.datetimepicker .minute {
    height: 34px;
    line-height: 34px;
    margin: 0;
    width: 25%; }

.datetimepicker .table {
    margin: 0; }

.datetimepicker .table td,
.datetimepicker .table th {
    border: 0;
    border-radius: 4px;
    height: 20px;
    text-align: center; }

.datetimepicker .minute:hover,
.datetimepicker .hour:hover,
.datetimepicker .day:hover,
.datetimepicker .switch:hover,
.datetimepicker .left:hover,
.datetimepicker .right:hover {
    background: #eee;
    cursor: pointer; }

.datetimepicker .disabled,
.datetimepicker .disabled:hover {
    background: none;
    color: #ebebeb;
    cursor: default; }

.datetimepicker .active,
.datetimepicker .active:hover,
.datetimepicker .active.disabled,
.datetimepicker .active.disabled:hover {
    background-color: #04c;
    background-image: linear-gradient(to bottom, #08c, #04c);
    background-repeat: repeat-x;
    border-color: #04c #04c #002a80;
    color: #fff;
    -webkit-filter: progid:dximagetransform.microsoft.gradient(startColorstr='#08c', endColorstr='#04c', GradientType=0);
    filter: progid:dximagetransform.microsoft.gradient(startColorstr='#08c', endColorstr='#04c', GradientType=0);
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); }

.datetimepicker .current,
.datetimepicker .current:hover,
.datetimepicker .current.disabled,
.datetimepicker .current.disabled:hover {
    background-color: #e5e5e5; }

.datetimepicker .active:hover,
.datetimepicker .active:hover:hover,
.datetimepicker .active.disabled:hover,
.datetimepicker .active.disabled:hover:hover,
.datetimepicker .active:active,
.datetimepicker .active:hover:active,
.datetimepicker .active.disabled:active,
.datetimepicker .active.disabled:hover:active,
.datetimepicker .active.active,
.datetimepicker .active:hover.active,
.datetimepicker .active.disabled.active,
.datetimepicker .active.disabled:hover.active,
.datetimepicker .active.disabled,
.datetimepicker .active:hover.disabled,
.datetimepicker .active.disabled.disabled,
.datetimepicker .active.disabled:hover.disabled,
.datetimepicker td.active[disabled],
.datetimepicker td.active:hover[disabled],
.datetimepicker td.active.disabled[disabled],
.datetimepicker td.active.disabled:hover[disabled],
.datetimepicker span.active[disabled],
.datetimepicker span.active:hover[disabled],
.datetimepicker span.active.disabled[disabled],
.datetimepicker span.active.disabled:hover[disabled] {
    background-color: #04c; }

.datetimepicker span:hover {
    background: #eee; }

.datetimepicker .past,
.datetimepicker .future {
    color: #999; }

/* ----- Custom stylings ----- */
.datetimepicker .table td, .datetimepicker .table th {
    display: inline-block;
    height: 30px;
    width: 14%;
    font-size: 0.7em; }

.datetimepicker .table th {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px; }

.datetimepicker .table td {
    font-size: 0.7em;
    line-height: 2.85em; }

.datetimepicker .table.hour-view td, .datetimepicker .table.minute-view td {
    width: 100%; }

.datetimepicker .table.hour-view thead, .datetimepicker .table.minute-view thead {
    height: 60px; }

.datetimepicker .active.active {
    background-color: var(--accent, #2d91e6);
    border-radius: none;
    background-image: none; }
.datetimepicker .active.active:hover {
    color: #fff;
    background: var(--primary, #343845); }

.datetimepicker .table tr {
    display: inline-block;
    width: 100%; }

.datetimepicker thead {
    background: var(--accent, #2d91e6);
    color: #fff;
    height: 90px;
    float: left;
    width: 100%; }

.datetimepicker thead .switch, .datetimepicker thead .left, .datetimepicker thead .right {
    cursor: pointer;
    line-height: 1.25em;
    font-size: 2em 1em;
    text-decoration: none !important;
    background-color: transparent !important; }

.datetimepicker thead .switch {
    float: left;
    font-size: 1.2em;
    font-weight: 300;
    line-height: 3em;
    margin-bottom: 1.7em;
    text-align: center;
    width: 70%; }

.datetimepicker thead .left {
    float: left;
    text-align: left;
    padding: 2em 1em;
    width: 15%; }

.datetimepicker thead .right {
    text-align: right;
    float: right;
    padding: 2em 1em;
    width: 15%; }

.datetimepicker tbody {
    float: left;
    width: 100%;
    margin-top: 1em; }

.glyphicon-arrow-left, .glyphicon-arrow-right {
    font-family: 'icomoon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased; }

.glyphicon-arrow-left:before {
    content: "\e903"; }

.glyphicon-arrow-right:before {
    content: "\e904"; }

.datetimepicker .hour, .datetimepicker .minute {
    float: left; }

ul[dnd-list], ul[dnd-list] > li,
dnd-list, dnd-list > li {
    position: relative; }

.dndPlaceholder {
    display: block;
    width: 100%;
    height: 244px; }

.dndPlaceholder {
    background: #e7e7e7; }

.dndDraggingSource {
    display: none !important; }

.listitem__handle {
    cursor: -webkit-grab;
    cursor: -moz-grab;
    text-align: center;
    font-size: 1.7em;
    line-height: 0.5em;
    width: 30px;
    height: 30px;
    text-decoration: none !important;
    display: block;
    position: absolute;
    top: 50%;
    left: -90px;
    margin-top: -15px; }
@media (max-width: 1300px) {
    .listitem__handle {
        left: -40px; } }
@media (max-width: 1200px) {
    .listitem__handle {
        left: 0; } }
.listitem__handle:active {
    cursor: -webkit-grabbing;
    cursor: -moz-grabbing; }

/*
    Filters
*/
.filters {
    position: relative; }

/* ----- Footer bar ----- */
.filters-active {
    padding-bottom: 50px; }

.filters__footerbar {
    background: var(--brand, #341C4C);
    bottom: -65px;
    height: 65px;
    padding-top: 1em;
    position: fixed;
    transition: all 0.5s ease-in-out;
    width: 100%;
    z-index: 120; }
.filters__footerbar p {
    color: #fff;
    float: left;
    margin: 0.5em 0 0;
    position: relative; }

.filters__footerbar--active {
    bottom: 0; }

/* ----- Filter rows ----- */
.filter__row {
    display: block;
    width: 100%;
    margin: 0.25rem auto;
    position: relative;
    border-radius: 6px;
    background-color: var(--background, #f4f5f7); }
.filter__row:after {
    content: "";
    display: table;
    clear: both; }

.filter__clear {
    margin: 0;
    line-height: 1.6em;
    font-size: 1rem;
    margin-right: 0.75rem;
    margin-top: 0.5rem; }

.fp-icon {
    display: inline-block; }

.fp-icon:before {
    font-family: flowplayerseven;
    font-size: 1.7em; }

.fp-airplay:before {
    content: "\e001"; }

.fp-fullscreen:before {
    content: "\e002"; }

.fp-checked:before {
    content: "\e003"; }

.fp-embed:before {
    content: "\e004";
    color: #fff; }

.fp-chromecast:before {
    content: "\e005"; }

.fp-email:before {
    content: "\e006"; }

.fp-playbtn:before {
    content: "\e007"; }

.fp-share:before {
    content: "\e009"; }

.fp-share2:before {
    content: "\e00a"; }

.fp-twitter:before {
    content: "\e00c";
    color: #1da1f2; }

.fp-facebook:before {
    content: "\e00a";
    color: #3b5998; }

.fp-volumebtn:before {
    content: "\e00b"; }

.fp-volume-off:before {
    content: "\e00d"; }

.fp-unload:before {
    content: "\e00f"; }

.fp-prevbtn:before {
    content: "\e011"; }

.fp-nextbtn:before {
    content: "\e012"; }

.flowplayer.is-mouseover .fp-captions, .flowplayer.is-paused .fp-captions {
    bottom: 3em; }

.flowplayer.is-poster .fp-engine {
    filter: alpha(opacity=0);
    opacity: 0; }

.flowplayer.is-loading .fp-engine {
    top: -9999em; }

.flowplayer.is-loading .fp-ui .fp-header, .flowplayer.is-loading .fp-ui .fp-controls {
    filter: alpha(opacity=0);
    opacity: 0; }

.flowplayer.is-splash .fp-ui > *, .flowplayer.is-poster .fp-ui > * {
    display: none; }

.flowplayer.is-splash .fp-ui > .fp-play, .flowplayer.is-poster .fp-ui > .fp-play {
    display: block; }

.flowplayer.is-splash.is-loading .fp-ui > .fp-play, .flowplayer.is-poster.is-loading .fp-ui > .fp-play {
    display: none; }

.flowplayer.is-splash.is-loading .fp-ui > .fp-waiting, .flowplayer.is-poster.is-loading .fp-ui > .fp-waiting {
    display: block; }

.flowplayer.is-poster .fp-engine {
    left: -9999em;
    top: -9999em; }

.flowplayer.is-poster .fp-captions {
    display: none !important; }

.flowplayer.is-disabled .fp-color {
    background-color: #999; }

.flowplayer.has-title .fp-header {
    top: 0;
    text-align: right; }

.flowplayer.is-fullscreen {
    top: 0 !important;
    left: 0 !important;
    border: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    z-index: 99999 !important;
    box-shadow: 0 !important;
    background-image: none !important;
    background-color: #333; }

.flowplayer.is-fullscreen .fp-player {
    background-color: #333; }

.flowplayer.is-fullscreen .fp-fullscreen:before {
    content: "\e016"; }

.flowplayer.is-fullscreen.fp-outlined .fp-fullscreen:before, .flowplayer.is-fullscreen.fp-minimal .fp-fullscreen:before {
    content: "\e216"; }

.flowplayer.is-fullscreen.fp-edgy .fp-fullscreen:before {
    content: "\e116"; }

.flowplayer.is-fullscreen.fp-edgy.fp-outlined .fp-fullscreen:before, .flowplayer.is-fullscreen.fp-edgy.fp-minimal .fp-fullscreen:before {
    content: "\e316"; }

.flowplayer.is-fullscreen.is-mouseout.is-playing .fp-ui {
    cursor: none; }

.flowplayer.is-loading .fp-waiting, .flowplayer.is-seeking .fp-waiting {
    display: block !important; }

.flowplayer.is-loading .fp-waiting svg, .flowplayer.is-loading .fp-waiting p, .flowplayer.is-seeking .fp-waiting svg, .flowplayer.is-seeking .fp-waiting p {
    filter: alpha(opacity=100);
    opacity: 1; }

.flowplayer.is-loading .fp-play, .flowplayer.is-seeking .fp-play {
    display: none !important; }

.flowplayer.is-playing {
    background-image: none !important; }

.flowplayer.is-playing .fp-playbtn:before {
    content: "\e008"; }

.flowplayer.is-playing.fp-outlined .fp-playbtn:before, .flowplayer.is-playing.fp-minimal .fp-playbtn:before {
    content: "\e208"; }

.flowplayer.is-playing.fp-edgy .fp-playbtn:before {
    content: "\e108"; }

.flowplayer.is-playing.fp-edgy.fp-outlined .fp-playbtn:before, .flowplayer.is-playing.fp-edgy.fp-minimal .fp-playbtn:before {
    content: "\e308"; }

.flowplayer.is-muted .fp-volumebtn:before {
    content: "\e00d"; }

.flowplayer.is-muted.fp-outlined .fp-volumebtn:before, .flowplayer.is-muted.fp-minimal .fp-volumebtn:before {
    content: "\e20d"; }

.flowplayer.is-muted.fp-edgy .fp-volumebtn:before {
    content: "\e10d"; }

.flowplayer.is-muted.fp-edgy.fp-outlined .fp-volumebtn:before, .flowplayer.is-muted.fp-edgy.fp-minimal .fp-volumebtn:before {
    content: "\e30d"; }

.flowplayer.is-inverted .fp-duration {
    display: none; }

.flowplayer.is-inverted .fp-remaining {
    display: block; }

.flowplayer.is-closeable .fp-header .fp-unload {
    display: block; }

.flowplayer.is-error {
    background-color: #aaa; }

.flowplayer.is-error .fp-ui {
    filter: alpha(opacity=100);
    opacity: 1; }

.flowplayer.is-live .fp-timeline {
    visibility: hidden; }

.flowplayer.is-live.is-dvr .fp-timeline {
    visibility: visible; }

.flowplayer.is-live.is-dvr.is-live-position .fp-duration {
    color: #00abcd; }

.flowplayer.is-flash-disabled .fp-waiting {
    display: none !important; }

.flowplayer.is-flash-disabled .fp-ui {
    height: auto;
    background: none;
    filter: alpha(opacity=100);
    opacity: 1; }

.flowplayer.is-flash-disabled .fp-ui .fp-header, .flowplayer.is-flash-disabled .fp-ui .fp-controls {
    display: none; }

.flowplayer.is-flash-disabled .fp-engine {
    top: 0; }

.flowplayer.is-tiny {
    font-size: .7em; }

.flowplayer.is-small {
    font-size: .8em; }

.flowplayer.no-buffer .fp-ui .fp-controls .fp-timeline .fp-buffer {
    display: none; }

.flowplayer.no-volume .fp-volumebar {
    display: none; }

.flowplayer.fp-mute .fp-volumebtn {
    display: inline-block; }

@-webkit-keyframes pulse {
    0% {
        filter: alpha(opacity=0);
        opacity: 0; }
    100% {
        filter: alpha(opacity=100);
        opacity: 1; } }

@keyframes pulse {
    0% {
        filter: alpha(opacity=0);
        opacity: 0; }
    100% {
        filter: alpha(opacity=100);
        opacity: 1; } }

.flowplayer .fp-chromecast-engine {
    position: absolute;
    display: none;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    color: #fff; }

.flowplayer .fp-chromecast-engine .fp-chromecast-engine-status {
    font-size: 150%;
    text-align: center; }

.flowplayer .fp-chromecast-engine .fp-chromecast-engine-icon {
    -webkit-mask-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMDAwMDAwIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIG9wYWNpdHk9Ii4xIi8+CiAgICA8cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+CiAgICA8cGF0aCBkPSJNMSAxOHYzaDNjMC0xLjY2LTEuMzQtMy0zLTN6bTAtNHYyYzIuNzYgMCA1IDIuMjQgNSA1aDJjMC0zLjg3LTMuMTMtNy03LTd6bTE4LTdINXYxLjYzYzMuOTYgMS4yOCA3LjA5IDQuNDEgOC4zNyA4LjM3SDE5Vjd6TTEgMTB2MmM0Ljk3IDAgOSA0LjAzIDkgOWgyYzAtNi4wOC00LjkzLTExLTExLTExem0yMC03SDNjLTEuMSAwLTIgLjktMiAydjNoMlY1aDE4djE0aC03djJoN2MxLjEgMCAyLS45IDItMlY1YzAtMS4xLS45LTItMi0yeiIvPgo8L3N2Zz4=");
    mask-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjMDAwMDAwIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiIG9wYWNpdHk9Ii4xIi8+CiAgICA8cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+CiAgICA8cGF0aCBkPSJNMSAxOHYzaDNjMC0xLjY2LTEuMzQtMy0zLTN6bTAtNHYyYzIuNzYgMCA1IDIuMjQgNSA1aDJjMC0zLjg3LTMuMTMtNy03LTd6bTE4LTdINXYxLjYzYzMuOTYgMS4yOCA3LjA5IDQuNDEgOC4zNyA4LjM3SDE5Vjd6TTEgMTB2MmM0Ljk3IDAgOSA0LjAzIDkgOWgyYzAtNi4wOC00LjkzLTExLTExLTExem0yMC03SDNjLTEuMSAwLTIgLjktMiAydjNoMlY1aDE4djE0aC03djJoN2MxLjEgMCAyLS45IDItMlY1YzAtMS4xLS45LTItMi0yeiIvPgo8L3N2Zz4=");
    -webkit-mask-size: 100% 100%;
    background-color: #fff;
    margin: 10% auto 2em;
    height: 5em;
    width: 5em; }

.flowplayer.is-chromecast {
    background-color: #333; }

.flowplayer.is-chromecast .fp-chromecast-engine {
    display: block; }

.flowplayer.is-chromecast .fp-flash-disabled {
    display: none !important; }

.flowplayer.is-chromecast .fp-engine {
    left: -9999em;
    top: -9999em;
    bottom: auto;
    right: auto; }

.flowplayer.fp-default-playlist .fp-prev, .flowplayer.fp-default-playlist .fp-next {
    position: absolute;
    top: 45%;
    filter: alpha(opacity=30);
    opacity: 0.3;
    transition: opacity 0.2s; }

.flowplayer.fp-default-playlist .fp-prev:hover, .flowplayer.fp-default-playlist .fp-next:hover {
    filter: alpha(opacity=100);
    opacity: 1; }

.flowplayer.fp-default-playlist .fp-prev:before, .flowplayer.fp-default-playlist .fp-next:before {
    font-family: flowplayerseven;
    font-size: 2.8em; }

.flowplayer.fp-default-playlist .fp-prev {
    left: 0.4em; }

.flowplayer.fp-default-playlist .fp-prev:before {
    content: "\e011"; }

.flowplayer.fp-default-playlist .fp-next {
    right: 0.4em; }

.flowplayer.fp-default-playlist .fp-next:before {
    content: "\e012"; }

.flowplayer.fp-default-playlist .fp-playlist {
    position: absolute;
    right: 0.4em;
    bottom: 3em;
    width: 100%;
    text-align: center; }

.flowplayer.fp-default-playlist .fp-playlist a {
    background-color: #fff;
    height: 0.8em;
    border-radius: 50%;
    width: 0.8em;
    filter: alpha(opacity=70);
    opacity: 0.7;
    display: inline-block;
    transition: transform 0.2s; }

.flowplayer.fp-default-playlist .fp-playlist a:hover {
    transform: scale(1.2, 1.2); }

.flowplayer.fp-default-playlist .fp-playlist a.is-active {
    filter: alpha(opacity=100);
    opacity: 1; }

.flowplayer.fp-default-playlist.fp-edgy .fp-prev:before {
    content: "\e111"; }

.flowplayer.fp-default-playlist.fp-edgy .fp-next:before {
    content: "\e112"; }

.flowplayer.fp-default-playlist.fp-outlined .fp-prev:before, .flowplayer.fp-default-playlist.fp-minimal .fp-prev:before {
    content: "\e211"; }

.flowplayer.fp-default-playlist.fp-outlined .fp-next:before, .flowplayer.fp-default-playlist.fp-minimal .fp-next:before {
    content: "\e212"; }

.flowplayer.fp-default-playlist.fp-edgy.fp-outlined .fp-prev:before, .flowplayer.fp-default-playlist.fp-edgy.fp-minimal .fp-prev:before {
    content: "\e311"; }

.flowplayer.fp-default-playlist.fp-edgy.fp-outlined .fp-next:before, .flowplayer.fp-default-playlist.fp-edgy.fp-minimal .fp-next:before {
    content: "\e312"; }

.flowplayer.fp-custom-playlist {
    overflow: visible; }

.flowplayer.fp-custom-playlist .fp-playlist, .flowplayer.fp-custom-playlist.is-splash .fp-playlist, .flowplayer.fp-custom-playlist.is-poster .fp-playlist, .flowplayer.fp-custom-playlist.is-loading .fp-playlist {
    display: block;
    filter: alpha(opacity=100);
    opacity: 1; }

.flowplayer.fp-edgy .fp-play svg.fp-play-rounded-fill, .flowplayer.fp-edgy .fp-play svg.fp-pause-rounded-fill, .flowplayer.fp-edgy .fp-play svg.fp-play-rounded-outline, .flowplayer.fp-edgy .fp-play svg.fp-pause-rounded-outline, .flowplayer.fp-edgy .fp-play svg.fp-loading-rounded-outline, .flowplayer.fp-edgy .fp-play svg.fp-loading-rounded-fill, .flowplayer.fp-edgy .fp-pause svg.fp-play-rounded-fill, .flowplayer.fp-edgy .fp-pause svg.fp-pause-rounded-fill, .flowplayer.fp-edgy .fp-pause svg.fp-play-rounded-outline, .flowplayer.fp-edgy .fp-pause svg.fp-pause-rounded-outline, .flowplayer.fp-edgy .fp-pause svg.fp-loading-rounded-outline, .flowplayer.fp-edgy .fp-pause svg.fp-loading-rounded-fill, .flowplayer.fp-edgy .fp-waiting svg.fp-play-rounded-fill, .flowplayer.fp-edgy .fp-waiting svg.fp-pause-rounded-fill, .flowplayer.fp-edgy .fp-waiting svg.fp-play-rounded-outline, .flowplayer.fp-edgy .fp-waiting svg.fp-pause-rounded-outline, .flowplayer.fp-edgy .fp-waiting svg.fp-loading-rounded-outline, .flowplayer.fp-edgy .fp-waiting svg.fp-loading-rounded-fill {
    display: none !important; }

.flowplayer.fp-edgy .fp-play svg.fp-play-sharp-fill, .flowplayer.fp-edgy .fp-play svg.fp-pause-sharp-fill, .flowplayer.fp-edgy .fp-play svg.fp-loading-sharp-fill, .flowplayer.fp-edgy .fp-pause svg.fp-play-sharp-fill, .flowplayer.fp-edgy .fp-pause svg.fp-pause-sharp-fill, .flowplayer.fp-edgy .fp-pause svg.fp-loading-sharp-fill, .flowplayer.fp-edgy .fp-waiting svg.fp-play-sharp-fill, .flowplayer.fp-edgy .fp-waiting svg.fp-pause-sharp-fill, .flowplayer.fp-edgy .fp-waiting svg.fp-loading-sharp-fill {
    display: block; }

.flowplayer.fp-edgy.fp-outlined .fp-play svg.fp-play-sharp-fill, .flowplayer.fp-edgy.fp-minimal .fp-play svg.fp-play-sharp-fill, .flowplayer.fp-edgy.fp-outlined .fp-play svg.fp-pause-sharp-fill, .flowplayer.fp-edgy.fp-minimal .fp-play svg.fp-pause-sharp-fill, .flowplayer.fp-edgy.fp-outlined .fp-play svg.fp-loading-sharp-fill, .flowplayer.fp-edgy.fp-minimal .fp-play svg.fp-loading-sharp-fill, .flowplayer.fp-edgy.fp-outlined .fp-pause svg.fp-play-sharp-fill, .flowplayer.fp-edgy.fp-minimal .fp-pause svg.fp-play-sharp-fill, .flowplayer.fp-edgy.fp-outlined .fp-pause svg.fp-pause-sharp-fill, .flowplayer.fp-edgy.fp-minimal .fp-pause svg.fp-pause-sharp-fill, .flowplayer.fp-edgy.fp-outlined .fp-pause svg.fp-loading-sharp-fill, .flowplayer.fp-edgy.fp-minimal .fp-pause svg.fp-loading-sharp-fill, .flowplayer.fp-edgy.fp-outlined .fp-waiting svg.fp-play-sharp-fill, .flowplayer.fp-edgy.fp-minimal .fp-waiting svg.fp-play-sharp-fill, .flowplayer.fp-edgy.fp-outlined .fp-waiting svg.fp-pause-sharp-fill, .flowplayer.fp-edgy.fp-minimal .fp-waiting svg.fp-pause-sharp-fill, .flowplayer.fp-edgy.fp-outlined .fp-waiting svg.fp-loading-sharp-fill, .flowplayer.fp-edgy.fp-minimal .fp-waiting svg.fp-loading-sharp-fill {
    display: none; }

.flowplayer.fp-edgy.fp-outlined .fp-play svg.fp-play-sharp-outline, .flowplayer.fp-edgy.fp-minimal .fp-play svg.fp-play-sharp-outline, .flowplayer.fp-edgy.fp-outlined .fp-play svg.fp-pause-sharp-outline, .flowplayer.fp-edgy.fp-minimal .fp-play svg.fp-pause-sharp-outline, .flowplayer.fp-edgy.fp-outlined .fp-play svg.fp-loading-sharp-outline, .flowplayer.fp-edgy.fp-minimal .fp-play svg.fp-loading-sharp-outline, .flowplayer.fp-edgy.fp-outlined .fp-pause svg.fp-play-sharp-outline, .flowplayer.fp-edgy.fp-minimal .fp-pause svg.fp-play-sharp-outline, .flowplayer.fp-edgy.fp-outlined .fp-pause svg.fp-pause-sharp-outline, .flowplayer.fp-edgy.fp-minimal .fp-pause svg.fp-pause-sharp-outline, .flowplayer.fp-edgy.fp-outlined .fp-pause svg.fp-loading-sharp-outline, .flowplayer.fp-edgy.fp-minimal .fp-pause svg.fp-loading-sharp-outline, .flowplayer.fp-edgy.fp-outlined .fp-waiting svg.fp-play-sharp-outline, .flowplayer.fp-edgy.fp-minimal .fp-waiting svg.fp-play-sharp-outline, .flowplayer.fp-edgy.fp-outlined .fp-waiting svg.fp-pause-sharp-outline, .flowplayer.fp-edgy.fp-minimal .fp-waiting svg.fp-pause-sharp-outline, .flowplayer.fp-edgy.fp-outlined .fp-waiting svg.fp-loading-sharp-outline, .flowplayer.fp-edgy.fp-minimal .fp-waiting svg.fp-loading-sharp-outline {
    display: block; }

.flowplayer.fp-edgy, .flowplayer.fp-edgy .fp-menu, .flowplayer.fp-edgy .fp-captions p, .flowplayer.fp-edgy .fp-textarea, .flowplayer.fp-edgy .fp-bar, .flowplayer.fp-edgy .fp-bar-slider, .flowplayer.fp-edgy .fp-bar > *, .flowplayer.fp-edgy .fp-bar-slider > *, .flowplayer.fp-edgy .fp-timestamp {
    border-radius: 0; }

.flowplayer.fp-edgy .fp-airplay:before {
    content: "\e101"; }

.flowplayer.fp-edgy .fp-fullscreen:before {
    content: "\e102"; }

.flowplayer.fp-edgy .fp-checked:before {
    content: "\e103"; }

.flowplayer.fp-edgy .fp-embed:before {
    content: "\e104"; }

.flowplayer.fp-edgy .fp-chromecast:before {
    content: "\e105"; }

.flowplayer.fp-edgy .fp-email:before {
    content: "\e106"; }

.flowplayer.fp-edgy .fp-playbtn:before {
    content: "\e107"; }

.flowplayer.fp-edgy .fp-share:before {
    content: "\e109"; }

.flowplayer.fp-edgy .fp-share2:before {
    content: "\e10a"; }

.flowplayer.fp-edgy .fp-twitter:before {
    content: "\e10c"; }

.flowplayer.fp-edgy .fp-facebook:before {
    content: "\e10a"; }

.flowplayer.fp-edgy .fp-volumebtn:before {
    content: "\e10b"; }

.flowplayer.fp-edgy .fp-volume-off:before {
    content: "\e10d"; }

.flowplayer.fp-edgy .fp-unload:before {
    content: "\e10f"; }

.flowplayer.fp-edgy .fp-prevbtn:before {
    content: "\e111"; }

.flowplayer.fp-edgy .fp-nextbtn:before {
    content: "\e112"; }

.flowplayer.fp-edgy.fp-outlined .fp-airplay:before, .flowplayer.fp-edgy.fp-minimal .fp-airplay:before {
    content: "\e301"; }

.flowplayer.fp-edgy.fp-outlined .fp-fullscreen:before, .flowplayer.fp-edgy.fp-minimal .fp-fullscreen:before {
    content: "\e302"; }

.flowplayer.fp-edgy.fp-outlined .fp-checked:before, .flowplayer.fp-edgy.fp-minimal .fp-checked:before {
    content: "\e303"; }

.flowplayer.fp-edgy.fp-outlined .fp-embed:before, .flowplayer.fp-edgy.fp-minimal .fp-embed:before {
    content: "\e304"; }

.flowplayer.fp-edgy.fp-outlined .fp-chromecast:before, .flowplayer.fp-edgy.fp-minimal .fp-chromecast:before {
    content: "\e305"; }

.flowplayer.fp-edgy.fp-outlined .fp-email:before, .flowplayer.fp-edgy.fp-minimal .fp-email:before {
    content: "\e306"; }

.flowplayer.fp-edgy.fp-outlined .fp-playbtn:before, .flowplayer.fp-edgy.fp-minimal .fp-playbtn:before {
    content: "\e307"; }

.flowplayer.fp-edgy.fp-outlined .fp-share:before, .flowplayer.fp-edgy.fp-minimal .fp-share:before {
    content: "\e309"; }

.flowplayer.fp-edgy.fp-outlined .fp-share2:before, .flowplayer.fp-edgy.fp-minimal .fp-share2:before {
    content: "\e30a"; }

.flowplayer.fp-edgy.fp-outlined .fp-twitter:before, .flowplayer.fp-edgy.fp-minimal .fp-twitter:before {
    content: "\e30c"; }

.flowplayer.fp-edgy.fp-outlined .fp-facebook:before, .flowplayer.fp-edgy.fp-minimal .fp-facebook:before {
    content: "\e30a"; }

.flowplayer.fp-edgy.fp-outlined .fp-volumebtn:before, .flowplayer.fp-edgy.fp-minimal .fp-volumebtn:before {
    content: "\e30b"; }

.flowplayer.fp-edgy.fp-outlined .fp-volume-off:before, .flowplayer.fp-edgy.fp-minimal .fp-volume-off:before {
    content: "\e30d"; }

.flowplayer.fp-edgy.fp-outlined .fp-unload:before, .flowplayer.fp-edgy.fp-minimal .fp-unload:before {
    content: "\e30f"; }

.flowplayer.fp-edgy.fp-outlined .fp-prevbtn:before, .flowplayer.fp-edgy.fp-minimal .fp-prevbtn:before {
    content: "\e311"; }

.flowplayer.fp-edgy.fp-outlined .fp-nextbtn:before, .flowplayer.fp-edgy.fp-minimal .fp-nextbtn:before {
    content: "\e312"; }

.flowplayer.no-svg .fp-ui .fp-header, .flowplayer.no-svg .fp-ui .fp-controls {
    background-color: #333; }

.flowplayer.no-svg .fp-ui .fp-play.fp-visible {
    background-color: #ccc;
    position: absolute;
    padding-top: 17%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0; }

.flowplayer.no-svg .fp-ui .fp-play.fp-visible svg {
    display: none; }

.flowplayer.no-svg .fp-ui .fp-play.fp-visible .fp-playbtn {
    display: inline; }

.flowplayer .fp-player, .flowplayer .fp-ui, .flowplayer .fp-header, .flowplayer .fp-captions, .flowplayer .fp-controls {
    position: absolute;
    width: 100%; }

.flowplayer {
    font-family: avenir, sans-serif;
    font-size: 16px;
    position: relative;
    max-height: 100%;
    overflow: hidden;
    border-radius: .24em;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    zoom: 1 !important;
    width: 100%;
    display: inline-block; }

.flowplayer .fp-hidden {
    display: none; }

.flowplayer .fp-shown {
    display: block !important; }

.flowplayer * {
    box-sizing: border-box; }

.flowplayer.is-ready:not(.is-poster) {
    background-color: transparent; }

.flowplayer .fp-engine {
    display: block;
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%; }

.flowplayer video.fp-engine:not(.native-subtitles)::-webkit-media-controls {
    display: none !important; }

.flowplayer .fp-player {
    position: absolute;
    bottom: 0;
    top: 0; }

.flowplayer .fp-waiting {
    display: none; }

.flowplayer .fp-waiting p {
    filter: alpha(opacity=0);
    opacity: 0;
    color: #ccc;
    font-weight: bold; }

.flowplayer .fp-ui {
    height: 100%;
    top: 0;
    background-image: none;
    transition: background-image .1s;
    text-align: center;
    cursor: pointer;
    color: #fff; }

.flowplayer .fp-ui a, .flowplayer .fp-ui strong {
    color: inherit !important;
    font-style: normal !important;
    text-decoration: none !important; }

.flowplayer .fp-ui strong {
    font-weight: bold !important; }

.flowplayer .fp-ui > * {
    transition: opacity .1s;
    filter: alpha(opacity=0);
    opacity: 0; }

.flowplayer.fp-ui-shown .fp-ui, .flowplayer.is-paused .fp-ui, .flowplayer.is-mouseover .fp-ui, .flowplayer.is-loading .fp-ui {
    background-image: linear-gradient(to top, rgba(0, 0, 0, 0.25), transparent 15%); }

.flowplayer.fp-ui-shown .fp-ui > *, .flowplayer.is-paused .fp-ui > *, .flowplayer.is-mouseover .fp-ui > *, .flowplayer.is-loading .fp-ui > * {
    filter: alpha(opacity=100);
    opacity: 1; }

.flowplayer .fp-header {
    top: 0;
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25), transparent);
    text-align: left;
    height: 3.6em;
    transition: opacity 0.3s;
    padding-left: .9em; }

.flowplayer .fp-header .fp-icon {
    margin: .9em .9em 0 0; }

.flowplayer .fp-header .fp-icon.fp-active {
    color: #ec6c4c; }

.flowplayer .fp-header .fp-fullscreen, .flowplayer .fp-header .fp-unload {
    float: right; }

.flowplayer .fp-header .fp-unload {
    display: none; }

.flowplayer .fp-help {
    display: none; }

.flowplayer .fp-message {
    background-color: rgba(0, 0, 0, 0.5);
    text-align: left;
    font-size: 1.2em;
    overflow: hidden;
    filter: alpha(opacity=0);
    opacity: 0;
    padding: .6em .9em;
    transition: opacity 0.3s; }

.flowplayer .fp-message.fp-shown {
    filter: alpha(opacity=100);
    opacity: 1; }

.flowplayer .fp-message.fp-shown + .fp-header {
    filter: alpha(opacity=0);
    opacity: 0; }

.flowplayer .fp-textarea {
    background-color: rgba(0, 0, 0, 0.5);
    width: 80%;
    position: absolute;
    left: 10%;
    top: 15%;
    color: #fff;
    outline: 0;
    border-radius: .2em;
    border: 0;
    min-height: 60%; }

.flowplayer .fp-logo {
    position: absolute;
    bottom: 3em;
    left: 0.9em; }

.flowplayer .fp-logo img {
    width: 100%; }

.flowplayer .fp-captions {
    bottom: 1.2em;
    display: none;
    text-align: center;
    color: #fff; }

.flowplayer .fp-captions p {
    background-color: rgba(0, 0, 0, 0.65);
    border-radius: .2em;
    font-size: 110%;
    display: inline-block;
    padding: .1em .3em;
    margin: .1em; }

.flowplayer .fp-speed-flash {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
    font-size: 4em;
    color: #fff;
    font-weight: bold;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    filter: alpha(opacity=0) !important;
    opacity: 0 !important;
    transform: scale(0.8);
    transition: all .2s;
    width: 4em;
    height: 2em;
    display: none; }

.flowplayer .fp-speed-flash.fp-hilite {
    filter: alpha(opacity=100) !important;
    opacity: 1 !important;
    transform: scale(1); }

.flowplayer .fp-play .fp-playbtn, .flowplayer .fp-pause .fp-playbtn, .flowplayer .fp-waiting .fp-playbtn {
    display: none; }

.flowplayer .fp-play svg, .flowplayer .fp-pause svg, .flowplayer .fp-waiting svg {
    position: absolute;
    pointer-events: none;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    width: 6em;
    height: 6em;
    filter: alpha(opacity=0);
    opacity: 0;
    margin: auto;
    max-height: 30%;
    transform: scale(0.8);
    transition: all .2s;
    display: none; }

.flowplayer .fp-play svg.fp-play-rounded-fill, .flowplayer .fp-play svg.fp-pause-rounded-fill, .flowplayer .fp-play svg.fp-loading-rounded-fill, .flowplayer .fp-pause svg.fp-play-rounded-fill, .flowplayer .fp-pause svg.fp-pause-rounded-fill, .flowplayer .fp-pause svg.fp-loading-rounded-fill, .flowplayer .fp-waiting svg.fp-play-rounded-fill, .flowplayer .fp-waiting svg.fp-pause-rounded-fill, .flowplayer .fp-waiting svg.fp-loading-rounded-fill {
    display: block; }

.flowplayer .fp-play.fp-visible svg, .flowplayer .fp-pause.fp-visible svg, .flowplayer .fp-waiting.fp-visible svg {
    transform: scale(1.5);
    filter: alpha(opacity=100);
    opacity: 1; }

.flowplayer .fp-remaining {
    display: none; }

.flowplayer .fp-controls {
    display: flex;
    justify-content: space-around;
    align-items: center;
    height: 2.4em;
    bottom: 0;
    z-index: 2;
    padding-left: 0.3em;
    padding-right: 0.3em; }

.flowplayer .fp-controls > * {
    margin: 0 .6em; }

.flowplayer .fp-controls > strong {
    letter-spacing: 1px; }

.flowplayer .fp-controls img {
    width: 1.2em; }

.flowplayer .fp-bar, .flowplayer .fp-bar-slider {
    background-color: #ccc;
    background-color: rgba(255, 255, 255, 0.5);
    position: relative;
    cursor: col-resize;
    height: .9em;
    border-radius: 0.24em;
    flex: 1; }

.flowplayer .fp-bar > *, .flowplayer .fp-bar-slider > * {
    background-color: rgba(255, 255, 255, 0.6);
    position: absolute;
    height: 100%;
    border-radius: 0.24em; }

.flowplayer .fp-bar > *.fp-progress.animated, .flowplayer .fp-bar-slider > *.fp-progress.animated {
    transition-timing-function: linear;
    transition-property: width, height; }

.flowplayer .fp-bar > *.fp-buffer, .flowplayer .fp-bar-slider > *.fp-buffer {
    transition: width .25s linear; }

.flowplayer .fp-bar.no-animation > *, .flowplayer .no-animation.fp-bar-slider > * {
    transition: none; }

.flowplayer .fp-timeline {
    transition: height .2s; }

.flowplayer .fp-cuepoint {
    background-color: #000;
    position: absolute;
    height: 100%;
    width: 2px; }

.flowplayer .fp-timestamp {
    background-color: rgba(0, 0, 0, 0.65);
    display: none;
    border-radius: .2em;
    padding: .1em .3em;
    font-size: 90%;
    bottom: 1.4em;
    height: auto; }

.flowplayer .fp-timeline:hover .fp-timestamp {
    display: inline; }

.flowplayer .fp-volume {
    display: flex;
    height: 100%;
    align-items: center; }

.flowplayer .fp-volumebtn {
    display: none; }

.flowplayer .fp-bar-slider {
    background-color: transparent;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: height .2s;
    white-space: nowrap;
    -ms-flex: 1 0 auto; }

.flowplayer .fp-bar-slider em {
    border-radius: 2px;
    display: inline-block;
    width: 5px;
    height: 100%;
    position: relative;
    vertical-align: top;
    margin-left: 3px;
    transition: transform 0.4s;
    transform-origin: bottom;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transform: scale(1.1); }

.flowplayer .fp-bar-slider em:hover {
    transform: scaleY(1.35);
    transition: transform 0.2s; }

.flowplayer .fp-bar-slider em.fp-grey {
    background-color: rgba(255, 255, 255, 0.75); }

.flowplayer.no-flex .fp-controls {
    white-space: nowrap; }

.flowplayer.no-flex .fp-controls > * {
    display: inline-block;
    vertical-align: center;
    margin: 0 .3em; }

.flowplayer.no-flex .fp-timeline {
    width: 40%; }

.flowplayer.no-flex.fp-full .fp-timeline {
    margin-bottom: .6em;
    height: .9em; }

.flowplayer.no-flex.fp-fat .fp-bar, .flowplayer.no-flex.fp-playful .fp-bar, .flowplayer.no-flex.fp-fat .fp-bar-slider, .flowplayer.no-flex.fp-playful .fp-bar-slider {
    height: .9em !important; }

.flowplayer.fp-fat .fp-bar, .flowplayer.fp-playful .fp-bar, .flowplayer.fp-fat .fp-bar-slider, .flowplayer.fp-playful .fp-bar-slider {
    height: 100%;
    border-radius: 0; }

.flowplayer.fp-fat .fp-bar > *, .flowplayer.fp-playful .fp-bar > *, .flowplayer.fp-fat .fp-bar-slider > *, .flowplayer.fp-playful .fp-bar-slider > * {
    border-radius: 0; }

.flowplayer.fp-fat .fp-timestamp, .flowplayer.fp-playful .fp-timestamp {
    bottom: 3.2em; }

.flowplayer.fp-fat .fp-bar-slider em, .flowplayer.fp-playful .fp-bar-slider em {
    transform: scaleY(0.6);
    transform-origin: center; }

.flowplayer.fp-fat .fp-bar-slider em:hover, .flowplayer.fp-playful .fp-bar-slider em:hover {
    transform: scaleY(0.75); }

.flowplayer.fp-slim .fp-timeline {
    height: .2em; }

.flowplayer.fp-slim .fp-controls:hover .fp-timeline {
    height: .9em; }

.flowplayer.fp-slim .fp-cue {
    width: 4px; }

.flowplayer.fp-slim .fp-bar-slider {
    height: .2em; }

.flowplayer.fp-slim .fp-controls:hover .fp-bar-slider {
    height: 0.9em; }

.flowplayer.fp-full .fp-timeline {
    position: absolute;
    height: .3em;
    bottom: 2.8em;
    margin: 0;
    width: 100%;
    border-radius: 0;
    overflow: inherit;
    left: 0; }

.flowplayer.fp-full .fp-timeline:before {
    content: "";
    width: 100%;
    height: 1.2em;
    position: absolute;
    top: -1.2em;
    left: 0; }

.flowplayer.fp-full .fp-controls {
    height: 2.8em; }

.flowplayer.fp-full .fp-controls:hover .fp-timeline {
    height: 1em; }

.flowplayer.fp-full .fp-volume {
    margin-right: auto; }

.flowplayer.fp-full .fp-duration, .flowplayer.fp-full .fp-remaining {
    margin-left: 0; }

.flowplayer.fp-full .fp-duration:before, .flowplayer.fp-full .fp-remaining:before {
    position: relative;
    content: "/";
    left: -.3em; }

.flowplayer.fp-minimal .fp-controls {
    background-color: transparent !important; }

.flowplayer.fp-minimal .fp-controls > * {
    display: none; }

.flowplayer.fp-minimal .fp-header > * {
    display: none; }

.flowplayer.fp-minimal .fp-header .fp-fullscreen {
    display: inherit; }

.flowplayer.fp-minimal .fp-timeline {
    height: .3em;
    max-width: 12em;
    width: 100%;
    display: block;
    margin: 0 auto;
    flex: none; }

.flowplayer.fp-playful .fp-color, .flowplayer.fp-playful .fp-color-play {
    background-color: #ec6c4c;
    fill: #ec6c4c; }

.flowplayer.fp-playful .fp-controls {
    background-color: #006680; }

.flowplayer .fp-selected:before {
    content: "✓ "; }

.flowplayer .fp-menu {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: .24em;
    position: absolute;
    width: 8em;
    right: .5em;
    z-index: 2;
    font-size: 90%;
    transition: opacity .2s, transform .2s, height .2s;
    transform: scale(0.95);
    bottom: -100%;
    height: 0;
    filter: alpha(opacity=0) !important;
    opacity: 0 !important; }

.flowplayer .fp-menu.fp-active {
    transform: scale(1);
    height: auto;
    bottom: 3.2em;
    filter: alpha(opacity=100) !important;
    opacity: 1 !important; }

.flowplayer .fp-menu > * {
    display: block;
    padding: .4em 1.2em;
    text-align: right; }

.flowplayer .fp-menu strong {
    display: block;
    padding: .7em 1.2em;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    background-color: rgba(0, 0, 0, 0.3);
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: default;
    font-size: 90%; }

.flowplayer .fp-menu a {
    color: rgba(255, 255, 255, 0.8); }

.flowplayer .fp-menu a:hover:not(.fp-selected) {
    background-color: #000;
    color: #fff; }

.flowplayer .fp-menu .fp-icon {
    cursor: pointer; }

.flowplayer .fp-menu .fp-icon:before {
    margin-right: .1em;
    font-size: 1.5em;
    vertical-align: -0.1em; }

.flowplayer .fp-qsel-menu {
    width: auto; }

.flowplayer .fp-context-menu {
    width: auto;
    right: auto;
    bottom: auto !important;
    display: none; }

.flowplayer .fp-context-menu.fp-active {
    display: block; }

.flowplayer .fp-context-menu a, .flowplayer .fp-context-menu strong {
    text-align: left;
    color: #fff;
    white-space: nowrap; }

.flowplayer .fp-subtitle-menu {
    width: 9em; }

.flowplayer .fp-share-menu {
    width: 9em;
    padding-bottom: 0.2em; }

.flowplayer .fp-share-menu.fp-active {
    bottom: auto; }

.flowplayer .fp-share-menu a, .flowplayer .fp-share-menu strong {
    text-align: left; }

.flowplayer.fp-outlined .fp-play svg.fp-play-rounded-fill, .flowplayer.fp-minimal .fp-play svg.fp-play-rounded-fill, .flowplayer.fp-outlined .fp-play svg.fp-pause-rounded-fill, .flowplayer.fp-minimal .fp-play svg.fp-pause-rounded-fill, .flowplayer.fp-outlined .fp-play svg.fp-loading-rounded-fill, .flowplayer.fp-minimal .fp-play svg.fp-loading-rounded-fill, .flowplayer.fp-outlined .fp-pause svg.fp-play-rounded-fill, .flowplayer.fp-minimal .fp-pause svg.fp-play-rounded-fill, .flowplayer.fp-outlined .fp-pause svg.fp-pause-rounded-fill, .flowplayer.fp-minimal .fp-pause svg.fp-pause-rounded-fill, .flowplayer.fp-outlined .fp-pause svg.fp-loading-rounded-fill, .flowplayer.fp-minimal .fp-pause svg.fp-loading-rounded-fill, .flowplayer.fp-outlined .fp-waiting svg.fp-play-rounded-fill, .flowplayer.fp-minimal .fp-waiting svg.fp-play-rounded-fill, .flowplayer.fp-outlined .fp-waiting svg.fp-pause-rounded-fill, .flowplayer.fp-minimal .fp-waiting svg.fp-pause-rounded-fill, .flowplayer.fp-outlined .fp-waiting svg.fp-loading-rounded-fill, .flowplayer.fp-minimal .fp-waiting svg.fp-loading-rounded-fill {
    display: none; }

.flowplayer.fp-outlined .fp-play svg.fp-play-rounded-outline, .flowplayer.fp-minimal .fp-play svg.fp-play-rounded-outline, .flowplayer.fp-outlined .fp-play svg.fp-pause-rounded-outline, .flowplayer.fp-minimal .fp-play svg.fp-pause-rounded-outline, .flowplayer.fp-outlined .fp-play svg.fp-loading-rounded-outline, .flowplayer.fp-minimal .fp-play svg.fp-loading-rounded-outline, .flowplayer.fp-outlined .fp-pause svg.fp-play-rounded-outline, .flowplayer.fp-minimal .fp-pause svg.fp-play-rounded-outline, .flowplayer.fp-outlined .fp-pause svg.fp-pause-rounded-outline, .flowplayer.fp-minimal .fp-pause svg.fp-pause-rounded-outline, .flowplayer.fp-outlined .fp-pause svg.fp-loading-rounded-outline, .flowplayer.fp-minimal .fp-pause svg.fp-loading-rounded-outline, .flowplayer.fp-outlined .fp-waiting svg.fp-play-rounded-outline, .flowplayer.fp-minimal .fp-waiting svg.fp-play-rounded-outline, .flowplayer.fp-outlined .fp-waiting svg.fp-pause-rounded-outline, .flowplayer.fp-minimal .fp-waiting svg.fp-pause-rounded-outline, .flowplayer.fp-outlined .fp-waiting svg.fp-loading-rounded-outline, .flowplayer.fp-minimal .fp-waiting svg.fp-loading-rounded-outline {
    display: block; }

.flowplayer.fp-outlined .fp-airplay:before, .flowplayer.fp-minimal .fp-airplay:before {
    content: "\e201"; }

.flowplayer.fp-outlined .fp-fullscreen:before, .flowplayer.fp-minimal .fp-fullscreen:before {
    content: "\e202"; }

.flowplayer.fp-outlined .fp-checked:before, .flowplayer.fp-minimal .fp-checked:before {
    content: "\e203"; }

.flowplayer.fp-outlined .fp-embed:before, .flowplayer.fp-minimal .fp-embed:before {
    content: "\e204"; }

.flowplayer.fp-outlined .fp-chromecast:before, .flowplayer.fp-minimal .fp-chromecast:before {
    content: "\e205"; }

.flowplayer.fp-outlined .fp-email:before, .flowplayer.fp-minimal .fp-email:before {
    content: "\e206"; }

.flowplayer.fp-outlined .fp-playbtn:before, .flowplayer.fp-minimal .fp-playbtn:before {
    content: "\e207"; }

.flowplayer.fp-outlined .fp-share:before, .flowplayer.fp-minimal .fp-share:before {
    content: "\e209"; }

.flowplayer.fp-outlined .fp-share2:before, .flowplayer.fp-minimal .fp-share2:before {
    content: "\e20a"; }

.flowplayer.fp-outlined .fp-twitter:before, .flowplayer.fp-minimal .fp-twitter:before {
    content: "\e20c"; }

.flowplayer.fp-outlined .fp-facebook:before, .flowplayer.fp-minimal .fp-facebook:before {
    content: "\e20a"; }

.flowplayer.fp-outlined .fp-volumebtn:before, .flowplayer.fp-minimal .fp-volumebtn:before {
    content: "\e20b"; }

.flowplayer.fp-outlined .fp-volume-off:before, .flowplayer.fp-minimal .fp-volume-off:before {
    content: "\e20d"; }

.flowplayer.fp-outlined .fp-unload:before, .flowplayer.fp-minimal .fp-unload:before {
    content: "\e20f"; }

.flowplayer.fp-outlined .fp-prevbtn:before, .flowplayer.fp-minimal .fp-prevbtn:before {
    content: "\e211"; }

.flowplayer.fp-outlined .fp-nextbtn:before, .flowplayer.fp-minimal .fp-nextbtn:before {
    content: "\e212"; }

.flowplayer .fp-color {
    background-color: #00abcd;
    fill: rgba(0, 0, 0, 0.2); }

.flowplayer .fp-color-play {
    fill: transparent; }

.flowplayer.is-rtl {
    direction: rtl; }

.flowplayer.is-rtl .fp-icon {
    transform: rotate(180deg); }

.flowplayer.-grayscale video.fp-engine {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%); }

.flowplayer.-sepia video.fp-engine {
    -webkit-filter: sepia(100%);
    filter: sepia(100%); }

.flowplayer.-blur video.fp-engine {
    -webkit-filter: blur(5px);
    filter: blur(5px); }

.fp-filters {
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute; }

video-summary .fp-ui .fp-play, video-summary .fp-ui .fp-pause, app-video-player .fp-ui .fp-play, app-video-player .fp-ui .fp-pause {
    display: none !important; }

video-summary .flowplayer .fp-captions, app-video-player .flowplayer .fp-captions {
    bottom: 1.5em; }
video-summary .flowplayer .fp-captions p, app-video-player .flowplayer .fp-captions p {
    background: transparent;
    font-size: 0.875rem;
    line-height: 1rem;
    text-shadow: 0 0 10px #000; }

.vpm-portal--summaryReport app-summary-report-video .flowplayer {
    padding-bottom: 66.6%; }

.vpm-portal--summaryReport app-summary-report-video .flowplayer.is-ready:not(.is-poster) {
    background: #333; }

/* Variables */
/* Font */
/* We'll will change this to blue on the new brand */
/* Icons & borders */
/* For menu hovers and dropdowns */
/* All icons */
/* Colors for all cards and borders */
/******** New Brand Colors ********/
/* Voxpopme */
/* Video MR */
/* Video CX */
/* Supporting */
/* Affectiva colours */
/* Base styling */
* {
    box-sizing: border-box; }

body ::-webkit-scrollbar-track {
    background: #f5f5f5; }

body ::-webkit-scrollbar {
    width: 14px;
    height: 18px; }

body ::-webkit-scrollbar-thumb {
    height: 6px;
    border: 4px solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    -webkit-border-radius: 7px;
    background-color: rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05); }

body ::-webkit-scrollbar-button {
    width: 0;
    height: 0;
    display: none; }

body ::-webkit-scrollbar-corner {
    background-color: transparent; }

body.header--new {
    padding-left: 5rem;
    padding-top: 4.2rem; }

body.header--new.vpm-portal--lists {
    padding-top: 6.2rem; }
body.header--new.vpm-portal--lists .l-subheader {
    display: none; }

body.header--new.vpm-portal--login {
    padding: 0; }

body.header--new.vpm-portal--authenticatorLogin {
    padding: 0; }

html:after,
body:after {
    content: "";
    display: table;
    clear: both; }

html {
    height: 100%; }

body {
    padding-bottom: 70px;
    min-height: 100%; }

[ng\:cloak],
[ng-cloak],
.ng-cloak {
    display: none !important; }

/*
	Forms
*/
/* ----- Placeholders----- */
::-webkit-input-placeholder {
    color: #e7e7e7 !important; }

:-moz-placeholder {
    color: #e7e7e7 !important; }

::-moz-placeholder {
    color: #e7e7e7 !important; }

:-ms-input-placeholder {
    color: #e7e7e7 !important; }

/* ----- Main form containers ----- */
.form {
    width: 100%; }
.form:after {
    content: "";
    display: table;
    clear: both; }

.form--inset {
    margin-left: 2em; }

.form--search {
    float: left;
    width: auto; }
.form--search .form__field {
    margin: 0; }
.form--search .form__row {
    margin-bottom: 0; }

.form--searchfull {
    float: left;
    position: relative;
    top: -2px;
    width: 100%; }

.form--small {
    background: #f9f9f9;
    max-width: 400px;
    padding: 2em;
    border-radius: 3px;
    margin-top: 2em; }

.form--spacedtop {
    margin-top: 2em; }

.form--spacedbottom {
    margin-bottom: 2em; }

/* ----- Rows ----- */
.form__row,
.form .form-group,
.form .schema-form-checkbox {
    float: left;
    width: 100%;
    padding: 0.375rem; }
.form__row:after,
.form .form-group:after,
.form .schema-form-checkbox:after {
    content: "";
    display: table;
    clear: both; }

.form__row--spacedtop {
    margin-top: 0.8em; }

.form__row--spaced {
    margin-bottom: 1em; }

.form__row--inline {
    display: inline-block;
    width: auto; }

.form__row--flipped {
    float: right; }

.form__inlinearrow {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 8px solid #666;
    float: left;
    height: 0;
    margin-left: -35px;
    margin-top: 0;
    position: relative;
    top: 20px;
    width: 0; }

.form__row--large .form__field {
    max-width: 100%; }

.form__row--decorated {
    border-bottom: 1px solid #e7e7e7;
    padding-bottom: 1.5em; }

.form__row p {
    margin: 0; }

/* ----- Labels ----- */
label {
    cursor: pointer; }

.form__label,
.form .form-group label,
.form .schema-form-checkbox span,
.form .schema-form-radios span {
    float: left;
    margin: 0 1.3em 0 0;
    line-height: 25px; }

.form__label--full {
    width: 100%; }

.form__label--tall {
    line-height: 32px; }

.form__label--standalone {
    display: block;
    float: none;
    margin: 0.5em auto; }

.form__label--padded {
    padding: 0 0 0.5em; }

/* ----- Input Types ----- */
.form__field,
.form .form-control {
    outline: none;
    border-radius: 4px;
    border: 1px solid var(--vpm-border, #D8DCE6);
    float: left;
    height: 25px;
    margin: 0 1.3em 0 0;
    max-width: 260px;
    padding: 0 0.5em;
    height: 32px;
    transition: all 0.25s ease-in-out; }
.form__field:hover,
.form .form-control:hover {
    border: 1px solid var(--accent, #2d91e6); }
.form__field:focus,
.form .form-control:focus {
    border: 1px solid #2c91e5;
    box-shadow: 0 0 0 3px rgba(44, 145, 229, 0.28); }

.form__field--standalone {
    float: none;
    display: block;
    margin-left: auto;
    margin-right: auto; }

.form__field--textbox {
    height: 200px; }

.form__field--wide {
    width: 90%;
    max-width: 350px; }

/* ----- Sizing ----- */
.form__field--tall {
    height: 35px; }

.form__field--small {
    max-width: 80px; }

.form__field--full {
    width: 100%; }

.form__field--fill {
    width: 100%;
    max-width: 100%; }

.form__field--half {
    margin-right: 15%;
    margin-left: 0;
    width: 35%;
    min-width: 0 !important; }
.form__field--half:last-child {
    margin-right: 0; }

.form__row--halfalt {
    width: 48%;
    margin: 0 1%; }

/* ----- Specifics ----- */
.form__field--subtitles {
    max-width: 100%;
    height: 100px;
    padding: 0.5em;
    resize: none; }

.form__field--location {
    width: 200px; }
@media (max-width: 1200px) {
    .form__field--location {
        width: 240px; } }
@media (max-width: 1050px) {
    .form__field--location {
        width: 180px; } }

.form__field--locationchina {
    padding: 0; }

.form__field--number {
    text-align: center;
    max-width: 100px; }

.form__field--dropdown,
.form__field--dropdown-wide {
    border: 1px solid #e4e5eb;
    border-radius: 0;
    box-shadow: none;
    height: 34px;
    padding: 0;
    position: relative;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; }
.form__field--dropdown:before,
.form__field--dropdown-wide:before {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #4a4a4a;
    content: '';
    height: 0;
    margin-top: -3px;
    position: absolute;
    right: 10px;
    top: 50%;
    width: 0;
    pointer-events: none; }
.form__field--dropdown select,
.form__field--dropdown-wide select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    width: 100%;
    height: 100%;
    padding-left: 0.75rem;
    border-radius: 0;
    background-color: transparent; }
.row .form__field--dropdown select, .row
.form__field--dropdown-wide select {
    background: #fff; }
.row--alt .form__field--dropdown select, .row--alt
.form__field--dropdown-wide select {
    background: initial; }

.form__field--dropdown {
    min-width: 130px; }

.form__field--dropdown-wide {
    min-width: 185px; }

.form__field--autocomplete {
    background: #fff;
    width: 210px;
    z-index: 10; }

.form__field--autocomplete.active {
    z-index: 20; }

.form__field--dropdownstandalone {
    max-width: 100%;
    width: 100%;
    padding-right: 0; }

.form__field--dropdownstandalonepadding {
    border-left: 1px solid #d0d0d0;
    border-right: 1px solid #d0d0d0;
    max-width: 100%;
    width: 100%;
    padding-right: 0;
    margin-bottom: 1em; }

.form__field--dropdownsmall {
    float: right;
    max-width: 300px;
    border-radius: 4px; }

.form__field--dropdown--wide {
    min-width: 190px; }

.response__languageselector .form__field--dropdownsmall,
.campaign__languageselector .form__field--dropdownsmall {
    width: 170px; }

/* ----- Misc ----- */
.form__helper {
    float: left;
    padding: 0.5em 0;
    margin-right: 1.3em; }

.form__date--date-dropdown {
    height: 34px;
    padding: 7px;
    cursor: pointer;
    width: 300px;
    color: #757575; }

.form__inputmask {
    position: absolute;
    top: 0;
    left: 0;
    background: #fff;
    width: 100%;
    height: 100%;
    z-index: 30;
    opacity: 0.7; }

/* ----- Styled form elements ----- */
.styled-checkbox,
.schema-form-checkbox input,
.multiSelect__option input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border-radius: 2px;
    border: 1px solid #fff;
    float: left;
    height: 14px;
    margin-bottom: 10px;
    margin-right: 1em;
    margin-top: 4px;
    position: relative;
    width: 14px;
    cursor: pointer; }
.styled-checkbox:checked, .styled-checkbox.styled-checkbox--checked,
.schema-form-checkbox input:checked,
.schema-form-checkbox input.styled-checkbox--checked,
.multiSelect__option input:checked,
.multiSelect__option input.styled-checkbox--checked {
    background: #fff; }
.styled-checkbox:checked:before, .styled-checkbox.styled-checkbox--checked:before,
.schema-form-checkbox input:checked:before,
.schema-form-checkbox input.styled-checkbox--checked:before,
.multiSelect__option input:checked:before,
.multiSelect__option input.styled-checkbox--checked:before {
    content: '\2714';
    color: var(--accent2, #D91B5D);
    position: absolute;
    width: 100%;
    text-align: center;
    top: -4px;
    left: 0; }

.schema-form-checkbox input,
.multiSelect__option input,
.styled-checkbox--alt {
    border-color: var(--accent2, #D91B5D);
    top: 0 !important; }

.fakecheckbox:before {
    border-radius: 3px;
    border: 1px solid var(--accent, #2d91e6);
    color: var(--accent, #2d91e6);
    content: '';
    float: left;
    height: 14px;
    line-height: 14px;
    margin-right: 1em;
    position: relative;
    top: 3px;
    width: 14px; }

.fakecheckbox--alt:before {
    float: none;
    display: inline-block;
    top: 0;
    margin-left: 0.5em; }

.fakecheckbox--active:before {
    content: '\2714'; }

.fakecheckbox--false:before {
    content: '×';
    line-height: 0.7em;
    text-align: center;
    font-size: 1.2em; }

/* ----- tiny MCE ----- */
html .mce-tinymce {
    margin-top: 1em;
    float: left;
    width: 100%; }

html .mce-path {
    display: none; }

/* ----- JSON forms ----- */
.sr-only {
    display: none; }

.form .help-block {
    float: right;
    font-size: 1em;
    line-height: 1.5em;
    width: 40%;
    position: relative; }
.form .help-block:before {
    background: var(--primary, #343845);
    width: 1.5em;
    border-radius: 50%;
    color: #fff;
    content: 'i';
    float: right;
    font-size: 0.8em;
    font-weight: 400;
    height: 1.5em;
    line-height: 1.6em;
    margin: 0 0 0 1em;
    position: absolute;
    text-align: center;
    top: 4px;
    left: -50px; }

.form .has-error .help-block .error {
    color: rgba(255, 0, 0, 0.8); }

.form .has-error .help-block:before {
    background-color: rgba(255, 0, 0, 0.8); }

.form-group,
.schema-form-checkbox,
.schema-form-radios {
    margin-bottom: 0; }

.form .form-group label,
.form .schema-form-checkbox span,
.form .schema-form-radios span {
    width: 100%;
    margin-top: 1em;
    margin-bottom: 4px; }

.form .form-control {
    width: 45%;
    max-width: 495px; }

.form .form-control[type='number'],
.form .form-control--small {
    max-width: 160px; }

.form .form-control--date {
    max-width: 200px; }

.form textarea.form-control {
    height: 140px;
    max-width: 45%;
    padding: 0.5em;
    resize: none;
    width: 100%; }

.form-group.has-error input {
    border-color: rgba(255, 0, 0, 0.8);
    border-radius: 3px; }

/* Checkboxes */
.schema-form-checkbox {
    margin-top: 1em; }

.form .checkbox input,
.form .schema-form-radios input {
    position: relative;
    float: left;
    height: 1rem;
    width: 1rem;
    position: relative;
    top: 5px; }

.form .checkbox label span,
.form .schema-form-radios span {
    font-size: 1rem;
    margin: 0 0 0 0.5em;
    float: left;
    line-height: 1.25em;
    width: auto; }

/* ----- Radios ----- */
.form .schema-form-radios input {
    width: 0.8rem;
    height: 0.8rem; }

.schema-form-radios .help-block {
    margin-top: -4.5em; }

/* ----- Multiselects ---- */
.multiSelect {
    position: relative; }

.multiSelect__preview {
    clear: left;
    float: left; }

.multiSelect__options {
    background: #fff;
    border: 1px solid #e7e7e7;
    left: 50%;
    margin: -375px 0 0 -400px;
    padding: 0;
    padding: 2em;
    position: fixed;
    top: 50%;
    width: 80%;
    z-index: 20;
    max-width: 800px;
    border-radius: 3px;
    max-height: 90%; }
@media (max-height: 835px) {
    .multiSelect__options {
        margin-top: 0;
        overflow: auto;
        top: 5%; } }

.multiSelect__option {
    float: left;
    list-style: none;
    margin-bottom: 1em;
    width: 33%; }
.multiSelect__option input {
    margin-right: 1em; }

.form .form-group .multiSelect__option label {
    float: none;
    font-size: 1em;
    line-height: 1.25em;
    margin: 0; }

/* ----- Schema form file uploads ----- */
.form__fileupload {
    float: left;
    max-width: 360px;
    width: 40%; }

.form .form__fileupload .form-control {
    width: 100%; }

.form__fileuploadpreview {
    margin-top: 1em;
    max-height: 200px; }

/* ------ Exclusive Groups ------ */
.exclusiveGroups {
    display: none; }

/* ----- Translation options ----- */
.form-group--translateoption {
    display: none; }

/* ----- Image cropper ----- */
.cropArea {
    background: #fff;
    overflow: hidden;
    margin-top: 1em; }
.cropArea canvas {
    margin-left: 0 !important;
    margin-top: 0 !important; }

.schema-form-fieldset.advancedFields .cropArea {
    background: #f9f9f9; }

/* ----- Currency fields ----- */
.currency-symbol {
    display: none;
    border-right: 0;
    float: left;
    height: 25px;
    line-height: 25px;
    padding-right: 0.5em;
    position: relative;
    top: 0.5em;
    z-index: 20; }

/* ----- Dropdowns on form builder ----- */
.schema-form-select select {
    text-transform: capitalize; }

/* ----- Merge lists filter---- */
.form--merge-lists-filter {
    position: relative; }
.form--merge-lists-filter .icon-search {
    position: absolute;
    right: 0.5em;
    top: 0.3em; }

/* ----- Analysis view selector------ */
.responses__sortby {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    margin-right: 0.5rem; }
.responses__sortby .form__field--dropdown {
    margin: 0 0.375rem;
    width: 180px; }
.responses__sortby .form__field--dropdown select {
    text-transform: capitalize;
    font-size: 0.875rem; }

.responses__language {
    float: left;
    width: 320px; }
.responses__language .form__field--dropdown {
    margin: 0 0.375rem;
    width: 180px; }
.responses__language .form__field--dropdown select {
    text-transform: capitalize;
    font-size: 0.875rem; }

.responses__sortbybtns {
    display: flex;
    border-radius: 5px;
    border: 1px solid #e7e7e7;
    float: right;
    overflow: hidden;
    order: 1; }

.responses__sortbybtn {
    float: left;
    height: 32px;
    line-height: 2.375rem;
    font-size: 1.4em;
    text-align: center;
    width: 32px;
    position: relative; }
.responses__sortbybtn:before {
    border-right: 5px solid transparent;
    content: '';
    height: 0;
    left: 50%;
    margin-left: -6px;
    margin-top: -3px;
    pointer-events: none;
    position: absolute;
    top: 50%;
    width: 0;
    border-left: 5px solid transparent; }

.responses__sortbybtn---asc:before {
    border-bottom: 6px solid var(--icon, #6C758E); }

.responses__sortbybtn---desc:before {
    border-top: 6px solid var(--icon, #6C758E); }

.responses__sortbybtn--active {
    background: var(--brand, #341C4C); }

.responses__sortbybtn---asc.responses__sortbybtn--active:before {
    border-bottom: 6px solid #fff; }

.responses__sortbybtn---desc.responses__sortbybtn--active:before {
    border-top: 6px solid #fff; }

/*
    Grid
*/
/* ----- Rows ----- */
.row {
    width: 100%;
    display: block;
    background: #fff;
    padding-top: 0.3em;
    padding-bottom: 0.3em;
    clear: left; }
.row:after {
    content: "";
    display: table;
    clear: both; }

.rowGS {
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 2rem;
    padding: 0; }

.row--nodrag {
    -webkit-user-drag: none; }

.row--transparent {
    background-color: transparent; }

.row--alt {
    background: #f9f9f9; }

.row--color {
    background: var(--accent2, #D91B5D);
    color: #fff; }

.row--padded {
    padding: 2em 0; }

.row--compact {
    padding: 0; }

.row--spaced {
    margin-bottom: 1.3em;
    margin-top: 1.3em; }

.row--spacedbottom {
    margin-bottom: 1.3em; }

.row--scroll {
    overflow-x: scroll;
    position: relative;
    width: 100%;
    padding: 1em; }

.row__link {
    background: url(/img/campaign-arrow.svg) no-repeat center center;
    background-size: 33%;
    position: absolute;
    right: 0;
    width: 36px;
    top: 0;
    text-align: center;
    line-height: 29px;
    font-size: 2em;
    height: 36px;
    border-radius: 50%; }
.row__link:hover, .row__link:focus {
    background-color: #D8D8D8; }

.row__content {
    float: left; }

.row--subheader {
    background: #fff;
    margin-bottom: 0;
    position: relative;
    top: -1.2rem;
    z-index: 21; }

/* ----- Panels ----- */
.panel {
    display: block;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    max-width: 1100px;
    width: 96%; }
.panel:after {
    content: "";
    display: table;
    clear: both; }

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

.panel--small {
    max-width: 530px; }

.panel--med {
    max-width: 700px; }

/* ----- Columns ----- */
.col {
    float: left;
    position: relative;
    margin-left: 1%;
    margin-right: 1%;
    padding: 0; }

.col--standalone {
    display: block;
    float: none;
    margin: 0 auto; }

.col--alt {
    background: #e7e7e7; }

.col--full {
    width: 98%; }

.col--fullalt {
    width: 97%; }

.col--half {
    width: 48%; }

.col--third {
    width: 31%; }

.col--twothirds {
    width: 64%; }

.col--fourth {
    width: 23%; }

.col--threefourths {
    width: 73%; }

.col--fifth {
    width: 18%; }

.col--twofifths {
    width: 38%; }

.col--fourfifths {
    width: 78%; }

.col--seperated:before {
    border-left: 1px solid #fff;
    content: '';
    display: block;
    height: 100%;
    left: -25%;
    position: absolute;
    width: 1px;
    opacity: 0.7; }

.col--spaced {
    margin-top: 1.3em;
    margin-bottom: 1.3em; }

.col--padded {
    padding-bottom: 1.5em;
    padding-top: 1.5em; }

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

.highlight-responses {
    margin-bottom: 1.3em;
    padding-bottom: 28%;
    position: relative;
    width: 100%; }

.highlight-responses--non-panel {
    padding-bottom: 21%; }

.highlight-response .btn {
    display: none; }

/* ----- 1 - 3 response grid-----  */
.highlight-responses--1,
.highlight-responses--2,
.highlight-responses--3 {
    height: auto;
    padding-bottom: 0;
    text-align: center; }
.highlight-responses--1 .highlight-response,
.highlight-responses--2 .highlight-response,
.highlight-responses--3 .highlight-response {
    display: inline-block;
    margin-left: 0.5%;
    margin-right: 0.5%;
    position: relative;
    width: 31%;
    max-width: 300px; }

/* ----- 4 response grid-----  */
.highlight-responses--4 {
    height: auto;
    padding-bottom: 0; }
.highlight-responses--4 .highlight-response {
    float: left;
    margin-right: 1%;
    position: relative;
    width: 24.25%; }
.highlight-responses--4 .highlight-response--3 {
    margin-right: 0; }

/* ----- 5 response grid-----  */
.highlight-responses--5 .highlight-response {
    position: absolute; }

.highlight-responses--5 .highlight-response--1,
.highlight-responses--5 .highlight-response--2 {
    width: 13.5%; }

.highlight-responses--5 .highlight-response--0,
.highlight-responses--5 .highlight-response--3,
.highlight-responses--5 .highlight-response--4 {
    width: 28%; }

.highlight-responses--5 .highlight-response--0 {
    left: 0; }

.highlight-responses--5 .highlight-response--1 {
    left: 28.9%;
    bottom: 0; }

.highlight-responses--5 .highlight-response--2 {
    left: 28.9%; }

.highlight-responses--5 .highlight-response--3 {
    left: 43.2%;
    top: 0; }

.highlight-responses--5 .highlight-response--4 {
    left: 72%;
    top: 0; }

/* ----- 6 response grid-----  */
.highlight-responses--6 .highlight-response {
    position: absolute; }

.highlight-responses--6 .highlight-response--1,
.highlight-responses--6 .highlight-response--2,
.highlight-responses--6 .highlight-response--3,
.highlight-responses--6 .highlight-response--4 {
    width: 13.5%; }

.highlight-responses--6 .highlight-response--0,
.highlight-responses--6 .highlight-response--5 {
    width: 28%; }

.highlight-responses--6 .highlight-response--0 {
    left: 7%; }

.highlight-responses--6 .highlight-response--1 {
    left: 36.1%;
    top: 0; }

.highlight-responses--6 .highlight-response--2 {
    left: 36.1%;
    bottom: 0; }

.highlight-responses--6 .highlight-response--3 {
    left: 50.8%;
    top: 0; }

.highlight-responses--6 .highlight-response--4 {
    left: 50.8%;
    bottom: 0; }

.highlight-responses--6 .highlight-response--5 {
    left: 65.4%;
    top: 0; }

/* ----- 7 response grid-----  */
.highlight-responses--7 {
    padding-bottom: 24.6%; }
.highlight-responses--7.highlight-responses--non-panel {
    padding-bottom: 18.4%; }
.highlight-responses--7 .highlight-response {
    position: absolute; }
.highlight-responses--7 .highlight-response--1,
.highlight-responses--7 .highlight-response--2,
.highlight-responses--7 .highlight-response--3,
.highlight-responses--7 .highlight-response--4 {
    width: 11.7%; }
.highlight-responses--7 .highlight-response--0,
.highlight-responses--7 .highlight-response--5,
.highlight-responses--7 .highlight-response--6 {
    width: 24.5%; }
.highlight-responses--7 .highlight-response--0 {
    left: 0;
    top: 0; }
.highlight-responses--7 .highlight-response--1 {
    left: 25.6%;
    bottom: 0; }
.highlight-responses--7 .highlight-response--2 {
    left: 25.6%;
    top: 0; }
.highlight-responses--7 .highlight-response--3 {
    left: 38.5%;
    top: 0; }
.highlight-responses--7 .highlight-response--4 {
    left: 38.5%;
    bottom: 0; }
.highlight-responses--7 .highlight-response--5 {
    left: 51.3%;
    top: 0; }
.highlight-responses--7 .highlight-response--6 {
    left: 77%;
    top: 0; }

/* ----- 8 response grid-----  */
.highlight-responses--8 .highlight-response {
    position: absolute; }

.highlight-responses--8 .highlight-response--0,
.highlight-responses--8 .highlight-response--1,
.highlight-responses--8 .highlight-response--3,
.highlight-responses--8 .highlight-response--4,
.highlight-responses--8 .highlight-response--5,
.highlight-responses--8 .highlight-response--6 {
    width: 13.5%; }

.highlight-responses--8 .highlight-response--2,
.highlight-responses--8 .highlight-response--7 {
    width: 28%; }

.highlight-responses--8 .highlight-response--0 {
    left: 0; }

.highlight-responses--8 .highlight-response--1 {
    left: 0;
    bottom: 0; }

.highlight-responses--8 .highlight-response--2 {
    left: 14.6%; }

.highlight-responses--8 .highlight-response--3 {
    left: 43.8%;
    top: 0; }

.highlight-responses--8 .highlight-response--4 {
    left: 43.8%;
    bottom: 0; }

.highlight-responses--8 .highlight-response--5 {
    left: 58.5%;
    top: 0; }

.highlight-responses--8 .highlight-response--6 {
    left: 58.5%;
    bottom: 0; }

.highlight-responses--8 .highlight-response--7 {
    left: 73%;
    top: 0; }

/* ----- Additional Data options ----- */
.additionalData__label {
    line-height: 2.5em; }

/* ----- Progress bar ----- */
.uploadprogress {
    background: #fff;
    box-shadow: 0 4px 4px 20000px rgba(0, 0, 0, 0.24);
    height: 160px;
    left: 50%;
    margin-left: -300px;
    margin-top: -80px;
    padding: 1em;
    position: fixed;
    top: 50%;
    width: 600px;
    z-index: 30; }

.uploadprogress__container {
    background: #efefef;
    box-shadow: inset 0 0 12px #ccc;
    height: 50px;
    width: 100%; }

.uploadprogress__container--thin {
    height: 30px; }

.uploadprogress__container--centre-text {
    text-align: center;
    position: relative; }

.uploadprogress__progressbar {
    background: var(--brand, #341C4C);
    display: block;
    height: 100%;
    transition: all 0.5s ease-in-out;
    width: 1%; }

.uploadprogress_text {
    position: absolute;
    line-height: 30px;
    left: 0;
    text-align: center;
    width: 100%; }

.uploadprogress_text--alt {
    color: white; }

/* ----- Spreadsheet import ----- */
.import-spreadsheet__block {
    margin-top: 3rem; }

.import-spreadsheet__exampleresponse {
    margin: 2rem auto 3rem;
    display: block;
    border: 1px solid #e7e7e7;
    width: 90%;
    max-width: 670px; }

.import-spreadsheet__examplespreadsheet {
    margin: 2rem auto 3rem;
    display: block;
    width: 90%;
    max-width: 670px; }

.import-spreadsheet__actions .btn {
    max-width: 100%;
    width: auto;
    padding-left: 1rem;
    padding-right: 1rem; }
.import-spreadsheet__actions .btn:last-child {
    margin-left: 0.5rem; }

/* ----- Import additional data ----- */
.prepare-additional-data {
    clear: both;
    max-width: 790px;
    display: block;
    margin: 0 auto;
    padding-top: 1rem; }
.prepare-additional-data:after {
    content: "";
    display: table;
    clear: both; }

.prepare-additional-data__title {
    font-size: 1rem;
    height: 1.25em;
    margin-bottom: 2rem;
    margin-top: 3rem; }

.prepare-additional-data__col {
    float: left;
    width: calc(37% - 90px);
    margin: 0 90px 1rem 0; }
.prepare-additional-data__col:last-child {
    margin-right: 0; }
.prepare-additional-data__col .form__field--dropdown {
    width: 100%; }

.prepare-additional-data__coltitle {
    font-size: 1.2rem;
    line-height: 1.25rem;
    text-align: center; }

.prepare-additional-data__qaprocess {
    margin: 2rem 0;
    float: left; }

.prepare-additional-data__responsepreview {
    clear: both;
    padding-top: 3rem;
    position: relative;
    left: 50px; }
.prepare-additional-data__responsepreview .response__transcript span {
    background: var(--primary, #343845); }

/* ----- Single import - edit errors ----- */
.import-error-form {
    float: left;
    width: 70%;
    margin-left: 15%;
    margin-bottom: 2rem;
    margin-top: 1.5rem; }
.import-error-form .btn {
    margin-left: 1rem;
    max-width: 210px;
    padding: 0 1rem;
    width: auto; }

.import-error-form__title {
    float: left;
    line-height: 1.5em;
    margin-bottom: 1rem; }

/* ----- Imports page ----- */
.vpm-portal--imports .l-header {
    margin-bottom: 1.34rem; }

.import-type__disabled {
    opacity: 0.25;
    pointer-events: none; }

.imports-alert {
    width: 100%;
    height: 3em;
    background: #f7f7f7;
    padding: 10px;
    border: 1px solid #dfdfdf;
    border-radius: 10px 10px; }

.imports-alert--text {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: 500; }

.imports-alert--text:before {
    background: #666666;
    border-radius: 50%;
    color: #fff;
    content: 'i';
    display: block;
    font-weight: 400;
    height: 20px;
    text-align: center;
    width: 20px;
    float: left;
    line-height: 20px;
    margin-right: .5rem; }

.imageslideeditor {
    display: block;
    margin-top: 2em; }

canvas.imageslideeditor {
    margin-top: 0; }

.imageslideeditor__controls {
    background: #eaeaea;
    display: block;
    margin: 0 auto;
    max-width: 602px;
    text-align: center;
    width: 100%; }

.imageslideeditor__control {
    position: relative;
    display: inline-block;
    padding: 5px;
    text-decoration: none !important;
    vertical-align: middle; }
.imageslideeditor__control .icon-flip_to_front, .imageslideeditor__control .icon-flip_to_back {
    font-size: 1.4em; }

.imageslideeditor__control:hover .nav--actions__tooltip {
    display: block;
    position: absolute;
    z-index: 100;
    width: 130px;
    margin-left: -27px;
    top: 35px; }

.imageslideeditor__control--colorpicker__icon {
    float: left;
    width: 10px;
    margin: 7px 5px 0 0; }

.imageslideeditor__control--colorpicker__preview {
    border: 1px solid #ccc;
    border-right: none;
    float: left;
    height: 26px;
    width: 25px; }

.imageslideeditor__text {
    max-width: 600px;
    width: 100%;
    display: block;
    margin: 1em auto 0; }
.imageslideeditor__text:after {
    content: "";
    display: table;
    clear: both; }
.imageslideeditor__text label {
    display: none; }
.imageslideeditor__text .form__field--text {
    box-shadow: none;
    float: left;
    height: 120px;
    margin: 0;
    resize: none;
    max-width: 600px;
    width: 100%; }

.imageslideeditor__canvas {
    border: 2px solid #e7e7e7;
    box-sizing: initial;
    display: block;
    margin-bottom: 2em;
    margin-left: auto;
    margin-right: auto;
    width: 600px;
    height: 450px; }
.imageslideeditor__canvas.imageslideeditor__canvas--scaled {
    height: 720px;
    left: -150px;
    margin-bottom: -60px;
    margin-top: -150px;
    position: relative;
    transform: scale(0.7);
    width: 960px; }

.imageslideeditor__canvas--tall {
    height: 600px; }
.imageslideeditor__canvas--tall.imageslideeditor__canvas--scaled {
    transform: scale(0.8);
    left: -80px;
    height: 720px;
    width: 720px; }

.imageslideeditor__gridtoggle {
    float: right;
    margin-bottom: -5rem;
    margin-top: 1rem;
    font-size: 1rem;
    overflow: hidden; }

.imageslideeditor__grid {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none; }

.imageslideeditor__gridline {
    border: 1px solid #00c9ff;
    opacity: 0.5;
    position: absolute; }

.imageslideeditor__gridline--horizontaltop {
    top: 20px;
    margin-top: -1px;
    left: 0;
    width: 100%; }

.imageslideeditor__gridline--horizontalcenter {
    top: 50%;
    margin-top: -1px;
    left: 0;
    width: 100%; }

.imageslideeditor__gridline--horizontalbottom {
    bottom: 20px;
    margin-top: -1px;
    left: 0;
    width: 100%; }

.imageslideeditor__gridline--verticalleft {
    left: 20px;
    margin-left: -1px;
    top: 0;
    height: 100%; }

.imageslideeditor__gridline--verticalcenter {
    left: 50%;
    margin-left: -1px;
    top: 0;
    height: 100%; }

.imageslideeditor__gridline--verticalright {
    right: 20px;
    margin-left: -1px;
    top: 0;
    height: 100%; }

/*
	Single List items
*/
.listitem {
    position: relative;
    display: block; }
.listitem:after {
    content: "";
    display: table;
    clear: both; }

.listitem--compact {
    padding: 1em 1em 0.4em; }

.listitem--simplevideo .video .btn {
    display: none !important; }

.listitem--disabled {
    background: #fff !important;
    opacity: 0.5; }
.listitem--disabled a {
    text-decoration: none !important;
    cursor: default !important; }

.listitem--clickable {
    cursor: pointer;
    padding: 2em 0; }
.listitem--clickable:hover, .listitem--clickable:focus {
    background: #EFEFEF; }

.listitem--padded {
    padding-bottom: 2em;
    padding-top: 2em; }

.listitem--showreel {
    padding: 2em 0 1em; }

.listitem--draggable .listitem__content {
    /* This is for drag and drop and selecting text */ }

@media (max-width: 1200px) {
    .listitem--draggable {
        padding-left: 40px !important; } }

.listitem__image {
    width: 100%;
    float: left; }

.listitem__image--audioonly {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 0; }

.listitem__video {
    float: left;
    margin-right: 2em;
    width: 220px;
    position: relative;
    z-index: 10; }
@media (max-width: 700px) {
    .listitem__video {
        float: none;
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 2em; }
    .listitem__video:after {
        content: "";
        display: table;
        clear: both; } }
@media (max-width: 500px) {
    .listitem__video {
        width: 100%; } }
.listitems--showreel .listitem__video {
    height: 190px; }

.listitem__video .listitem__image--text {
    position: relative; }

.listitem__video--large {
    width: 300px;
    height: 300px; }

.listitem__video--text {
    background: #e7e7e7; }

.listitem__imageslide {
    float: left;
    margin-right: 2em;
    width: 230px;
    position: relative; }
.listitem__imageslide .preview_text {
    bottom: -25px;
    top: auto; }
.listitem__imageslide img {
    width: 100%; }

.listitem__content {
    float: left;
    width: 60%;
    position: relative;
    z-index: 20;
    width: calc(100% - 268px); }
@media (max-width: 700px) {
    .listitem__content {
        width: 100%; } }
.listitem__content p {
    margin-bottom: 0; }

.listitem__content--secondary {
    float: left;
    width: 100%;
    padding-top: 1em;
    border-top: 1px solid #e7e7e7;
    margin-top: 0.5em; }
.listitem__content--secondary:after {
    content: "";
    display: table;
    clear: both; }

.listitem__content--key {
    clear: left;
    float: left;
    font-weight: 400;
    margin-bottom: 0.5em;
    margin-right: 5%;
    word-wrap: break-word;
    width: 30%;
    color: var(--secondary, #5C5F6A); }

.listitem__content--value {
    float: left;
    margin-left: 0;
    width: 65%;
    font-weight: 400;
    color: var(--primary, #343845); }

.listitem__content--wide {
    width: 100%; }

/* ----- Edit mode styles on list view ----- */
.listitem__mask {
    display: none; }

.listitems--editmode .row--edit-disabled {
    opacity: 0.2; }
.listitems--editmode .row--edit-disabled .listitem__mask {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 110;
    width: 100%;
    height: 100%;
    cursor: default; }

.listitems--editmode .row--edit-active {
    opacity: 1; }
.listitems--editmode .row--edit-active .listitem__handle {
    opacity: 0.2;
    cursor: default; }

.listitem__position {
    background: #341C4A;
    border-radius: 50%;
    color: #fff;
    display: block;
    font-size: 0.75rem;
    height: 1rem;
    left: -1.5rem;
    line-height: 1rem;
    margin-top: -0.7rem;
    position: absolute;
    top: 50%;
    width: 1rem;
    font-weight: 500; }
@media (max-width: 1350px) {
    .listitem__position {
        left: 0.45rem; } }

.listitems {
    margin-bottom: 3em; }
.listitems .listitem {
    padding: 3em 0; }
@media (max-width: 700px) {
    .listitems .listitem {
        padding: 1.5em 0 0.5em; } }

.listitems--loading .listitem {
    cursor: pointer;
    pointer-events: none;
    opacity: 0.3; }

.listitems--showreel {
    padding-left: 0;
    padding-top: 0.5em; }

.listitem__status {
    background: var(--brand, #341C4C);
    bottom: 0;
    color: #fff;
    font-size: 1em;
    padding: 0.5em 1em;
    position: absolute;
    right: 0; }

input {
    /* This is for drag and drop and selecting text */
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text; }

/* ----- Text list items ----- */
.listitem__textpreview {
    box-shadow: 0.5px 1.5px 2px 0 rgba(0, 0, 0, 0.1);
    float: left;
    background: url(/img/text-slide.png) #e7e7e7 no-repeat center;
    background-size: 100px;
    border: 1px solid #efefef;
    height: 230px;
    margin-right: 4em;
    width: 230px; }

.listitem__textpreview--large {
    width: 300px;
    height: 300px; }

.textlisde__duration {
    margin-top: 1.5em; }

.textlisde__duration--image {
    display: block;
    width: 300px;
    float: right; }
.textlisde__duration--image .form__field--small {
    max-width: 200px;
    width: 100%; }

.textslide__settings {
    float: right;
    border: 1px solid #eee;
    border-bottom: 0;
    margin-top: 0.5em; }

.textslide__setting {
    float: left;
    border-right: 1px solid #eee;
    height: 35px;
    padding: 0.2em 0.5em;
    line-height: 29px; }
.textslide__setting:last-child {
    border: none; }

.textslide__color {
    border: 1px solid #eee;
    float: left;
    height: 1em;
    margin: 0.45em;
    width: 2em; }

/* ----- Color icons ----- */
.textslide__coloricon {
    float: left;
    margin-right: 0.5em;
    position: relative; }

.textslide__coloricon--font {
    height: 13px;
    top: 8px; }

.textslide__coloricon--background {
    width: 18px;
    top: 6px; }

.textslide__input {
    border: none;
    width: 70px; }

/* ----- Alignment ----- */
.textslide__setting--active {
    background: #e7e7e7; }

.textslide__setting--small {
    height: 35px;
    overflow: hidden;
    padding: 0.15em 0.2em;
    width: 35px;
    text-align: center; }
.textslide__setting--small img {
    position: relative;
    width: 17px; }
.textslide__setting--small input {
    visibility: hidden; }
.textslide__setting--small .top {
    top: -0.5em; }
.textslide__setting--small .bottom {
    bottom: -0.5em; }

.textslide__setting--dropdown {
    position: relative;
    padding: 0; }
.textslide__setting--dropdown select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff;
    border: none;
    width: 100%;
    height: 100%;
    padding-left: 10px;
    padding-right: 2em; }
.textslide__setting--dropdown:before {
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #666;
    content: '';
    height: 0;
    margin-top: -3px;
    position: absolute;
    right: 10px;
    top: 50%;
    width: 0; }

.textslide__content {
    margin-top: 0; }
.textslide__content textarea {
    height: 170px;
    margin-top: 0;
    margin-bottom: 2em; }

/* ----- Image slides ----- */
.listitem__imagepreview {
    box-shadow: 0.5px 1.5px 2px 0 rgba(0, 0, 0, 0.1);
    float: left;
    background: #e7e7e7 no-repeat center;
    border: 1px solid #efefef;
    height: 230px;
    margin-right: 4em;
    background-size: 100%;
    width: 230px; }

.listitem__imagepreview--large {
    width: 300px;
    height: 300px; }

.login-page {
    padding: 0; }
.login-page .row {
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
    height: 100vh;
    padding: 0; }
@media only screen and (max-width: 800px) {
    .login-page .row {
        flex-direction: column; } }
.login-page .logo {
    margin-bottom: 6.25rem;
    max-width: 190px;
    max-height: 70px;
    width: 100%;
    height: 100%; }
.login-page .logo img {
    width: 100%;
    height: 100%; }
.login-page .form__label {
    color: #5b666f;
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1em;
    text-align: left;
    padding-bottom: 6px; }
.login-page .form__row {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; }
.login-page .input__field {
    display: flex;
    flex-direction: column;
    width: 270px;
    margin-bottom: 0.88rem; }
.login-page .form__field {
    width: 16.31rem;
    height: 2rem;
    text-align: center;
    align-items: center;
    border: 1px solid #d6d8db;
    border-radius: 5px; }
.login-page .form__field--text {
    color: black;
    max-width: 100%;
    padding: 0 0.5rem;
    text-indent: 0;
    height: 2rem;
    font-size: 0.75rem;
    line-height: 1.25em;
    text-align: left;
    width: 100%;
    font-family: 'Open Sans', sans-serif; }
.login-page ::-webkit-input-placeholder {
    color: #e7e7e7 !important; }
.login-page :-moz-placeholder {
    color: #e7e7e7 !important; }
.login-page ::-moz-placeholder {
    color: #e7e7e7 !important; }
.login-page :-ms-input-placeholder {
    color: #e7e7e7 !important; }
.login-page .remember {
    margin-top: 0.45em;
    margin-bottom: 0.05em; }
.login-page .remember label {
    color: #fff;
    font-size: 0.75rem;
    line-height: 1.31rem;
    margin-left: 0.3em;
    margin-left: 0.3em;
    position: relative;
    top: 0.1em; }
.login-page .left-panel {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; }
@media only screen and (max-width: 800px) {
    .login-page .left-panel {
        width: 100%; } }
.login-page .right-panel {
    margin: 0;
    padding: 0;
    width: 50%;
    background-image: linear-gradient(to right top, #281239, #341e4c, #631a50, #951a4b, #d40855, #e95254);
    display: flex;
    flex-direction: column;
    position: relative; }
@media only screen and (max-width: 800px) {
    .login-page .right-panel {
        display: none; } }
.login-page input[type='submit'] {
    background: #FF5050;
    border: none;
    color: #ffffff;
    display: block;
    font-size: 0.875rem;
    font-weight: 600 !important;
    height: 2rem;
    margin-top: 2.44rem;
    margin: 2em auto 1em;
    text-shadow: none;
    text-align: center;
    width: 16.875rem;
    font-family: 'Open Sans', sans-serif;
    border-radius: 80px; }
.login-page input[type='submit'].button-disabled {
    background: #e5e5e5;
    color: #a3a3a3; }
.login-page .recover-password {
    width: 100%;
    display: flex;
    justify-content: center; }
.login-page .recover-password a {
    text-decoration: none; }
.login-page .recover {
    color: #631a50;
    font-size: 0.75rem;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600 !important;
    margin: -0.4em 0 10px;
    height: 2rem;
    background-color: white;
    text-decoration: none;
    cursor: pointer; }
@media only screen and (max-width: 400px) {
    .login-page .recover {
        font-size: 0.55rem; } }
@media only screen and (max-width: 300px) {
    .login-page .recover {
        font-size: 0.45rem;
        font-weight: 500; } }
@media only screen and (max-width: 251px) {
    .login-page .recover {
        font-size: 0.4rem;
        font-weight: 500; } }
.login-page .top-section {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    height: 60%;
    width: 100%; }
.login-page .bottom-section {
    width: 82%;
    z-index: 20;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-left: 62px;
    margin-bottom: 40px; }
@media only screen and (min-width: 920px) and (max-width: 1000px) {
    .login-page .bottom-section {
        margin-top: -0.5rem; } }
.login-page .ebooks_icon {
    width: 100%;
    height: 100%;
    position: absolute;
    background: url(/ng-platform/vpm-dist/assets/img/login/eBooks-picture.png) no-repeat 110px -58px;
    margin: 0;
    background-size: 89%;
    z-index: 10; }
@media only screen and (min-width: 800px) and (max-width: 1000px) {
    .login-page .ebooks_icon {
        background-size: 100%;
        background-position-y: -30px;
        background-position-x: 40px; } }
@media only screen and (min-width: 1000px) and (max-width: 1200px) {
    .login-page .ebooks_icon {
        background-size: 95%;
        background-position-y: -40px;
        background-position-x: 40px; } }
@media only screen and (min-width: 1200px) and (max-width: 1450px) {
    .login-page .ebooks_icon {
        background-size: 84%;
        background-position-y: -51px;
        background-position-x: 89px; } }
@media only screen and (min-width: 1450px) and (max-width: 1600px) {
    .login-page .ebooks_icon {
        margin-top: -1rem; } }
.login-page .mastering-section {
    text-align: left;
    width: 268px;
    margin-top: -2rem;
    margin-bottom: -1.5rem; }
.login-page .mastering-icon {
    margin-left: -34px;
    width: 100%;
    margin-bottom: -36px;
    padding-bottom: 0.875rem; }
@media only screen and (min-width: 1300px) {
    .login-page .mastering-icon {
        margin-left: -34px;
        width: 100%;
        margin-bottom: -36px; } }
.login-page h1 {
    font-family: 'Open Sans', sans-serif;
    color: #ffffff;
    font-weight: 300;
    font-size: 2.5rem;
    padding-bottom: 62px; }
.login-page h4 {
    font-size: 1.3rem;
    color: #ffffff;
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    line-height: 1.5em;
    padding-bottom: 12px; }
.login-page h5 {
    font-size: 12px;
    color: #ffffff;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    line-height: 1.5em;
    padding-bottom: 0.35rem;
    max-width: 490px;
    text-align: left;
    margin-right: 3.875rem; }
.login-page .subtitle {
    font-size: 1rem;
    color: #ffffff;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    line-height: 1.5em;
    padding-bottom: 0.35rem;
    width: 80%;
    text-align: left; }
.login-page .welcome-text {
    font-weight: 600;
    padding-bottom: 12px; }
.login-page .right-hand-button {
    background: #FF5050;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600 !important;
    font-size: 0.875rem;
    text-align: center;
    color: #ffffff;
    width: 7.4rem;
    height: 2rem;
    border-radius: 15px;
    float: left;
    margin-top: 0.8rem;
    margin-bottom: 0.35rem;
    border-style: none; }
.login-page .right-hand-button:active {
    border-style: none; }
.login-page .error li {
    list-style-type: none; }
.login-page .userlike-button-bubble {
    display: none; }
.login-page .login-auth-area {
    width: 100%;
    display: flex;
    text-align: center;
    justify-content: center;
    align-content: center; }
.login-page .login-auth-area p {
    color: #000000;
    font-family: 'Open Sans', sans-serif;
    font-size: 0.75rem;
    text-align: left; }
.login-page .trouble-text {
    font-weight: 500; }

.login-auth-text {
    color: #fff;
    margin-bottom: 2rem;
    width: 40%;
    text-align: center; }
.login-auth-text a {
    color: #000000;
    font-family: 'Open Sans' sans-serif;
    font-weight: 500;
    text-align: center; }

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

.auth-qrcode {
    display: block;
    margin: 0 auto 1rem;
    padding-right: 5%;
    height: 150px;
    width: 150px; }

.token-input {
    width: 100%; }

.download-instructions {
    color: #000000;
    font-family: 'Open Sans', sans-serif; }

.auth-label {
    padding-bottom: 2%;
    color: #5b666f;
    font-family: 'Open Sans', sans-serif; }

.button-group-container {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: space-between;
    padding: 2%;
    width: 100%;
    margin-left: -2%; }

.btngroup--centered input[type='submit'] {
    display: inline-block;
    font-size: 1rem;
    height: 39px;
    margin: 0;
    vertical-align: top; }

.cancel-btn-container {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center; }

.login-container {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center; }

.cancel-btn {
    color: #2dafe6;
    font-size: 0.75rem;
    border: 1px solid #2dafe6;
    background-color: white;
    font-size: 0.75rem;
    font-weight: 500 !important;
    margin-top: 2.44rem;
    margin: 0;
    text-shadow: none;
    text-align: center;
    align-items: center;
    width: 90%;
    font-family: Roboto;
    border-radius: 80px;
    padding: 2.5%; }

#login-auth {
    background: #341c4c;
    border: none;
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 500 !important;
    margin-top: 2.44rem;
    margin: 0;
    text-shadow: none;
    text-align: center;
    align-items: center;
    width: 100%;
    font-family: 'Open Sans', sans-serif;
    border-radius: 80px; }

#set-up-auth {
    background: #e6e6e6;
    border: none;
    color: #b1b1b1;
    font-size: 0.75rem;
    font-weight: 500 !important;
    margin-top: 2.44rem;
    margin: 0;
    text-shadow: none;
    text-align: center;
    align-items: center;
    width: 100%;
    font-family: 'Open Sans', sans-serif;
    border-radius: 80px; }

.setup-text {
    display: flex;
    flex-direction: column;
    width: 40%; }

.qr-not-visible {
    color: #000000;
    font-family: 'Open Sans', sans-serif;
    font-size: 0.75rem;
    text-align: left;
    width: 100%; }

.login-page .row.is-whitelabel {
    background: var(--brand, #341C4C); }

.is-whitelabel .form__label {
    color: #d40855; }

.is-whitelabel input[type='submit'] {
    background: #444; }

.is-whitelabel .recover {
    color: #444;
    border-color: #444; }

.icon-info {
    position: relative;
    color: var(--icon, #6C758E); }
.icon-info:hover .modal-container {
    visibility: visible; }

.modal-container {
    visibility: hidden;
    background: #fff;
    border-radius: 10px;
    display: inline-block;
    margin: 1rem;
    position: absolute;
    top: 0;
    left: 7rem;
    width: 300px;
    height: 210px;
    text-align: left;
    z-index: 999;
    padding: 3%;
    font-size: 0.75rem;
    font-family: 'Roboto';
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); }

/**
 * Unicorn Admin Template
 * Diablo9983 -> diablo9983@gmail.com
**/
body#login-page {
    border: none;
    background: #fff;
    min-width: 0;
    margin: 0;
    padding: 0 !important;
    height: 100%; }

/* Login and Register Pages */
#login-page * {
    font-family: roboto !important;
    font-weight: 300 !important; }

#login-wrap {
    max-width: 530px;
    margin: 0 auto;
    padding: 30px 0 0; }

#login-wrap .loginlogo {
    display: block;
    margin: 2em auto 4em;
    max-height: 70px;
    max-width: 190px;
    width: auto; }

#login-wrap p {
    font-family: museo_300regular, helvetica, arial, sans-serif;
    text-align: center;
    color: black;
    margin: 0 0 25px;
    font-size: 15px; }

#login-wrap .remember input,
#login-wrap .remember label {
    float: left; }

#login-wrap .remember {
    margin-top: 1em; }

#login-wrap .remember label {
    color: #fff;
    font-size: 12px;
    line-height: 21px; }

#login-wrap .remember input {
    margin-right: 0.5em; }

#login-wrap #submit-button input[type='submit'] {
    background: #341c4c;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 400 !important;
    border-radius: 80px;
    text-transform: uppercase;
    border: none;
    text-shadow: none;
    margin: 2em auto 3em;
    width: 40%; }

#login-wrap #submit-button {
    height: auto; }

#loginbox {
    width: 100%;
    margin: 0 auto;
    position: relative; }

#loginbox label {
    font-family: museo_300regular, helvetica, arial, sans-serif;
    color: #5b666f;
    font-size: 0.75rem;
    font-weight: 400;
    line-height: 1em;
    margin: 0;
    margin-top: 1em;
    padding: 1%; }

#loginbox input {
    height: 40px;
    line-height: 40px;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    color: black !important;
    font-size: 18px;
    background: none;
    border: 1px solid #d6d8db;
    border-radius: 5px;
    padding: 0;
    width: 100%;
    text-indent: 0;
    margin-bottom: 0.5em;
    box-sizing: border-box;
    transition: none !important;
    box-shadow: none; }

#loginbox input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #ffffff inset;
    color: #fff !important; }

#loginbox .input-append input {
    width: 45%; }

#loginbox .input-append .add-on {
    width: 55%;
    border-radius: 0;
    padding: 0;
    height: 40px;
    line-height: 40px;
    background: #d5b376;
    border: 1px solid #d5b376;
    color: #fff;
    font-weight: 300;
    text-shadow: none;
    text-align: center; }

#register-link {
    display: none; }

#register-link a {
    display: block;
    width: 76px;
    height: 34px;
    line-height: 34px;
    color: #fff;
    text-align: center;
    font-family: museo_300regular, helvetica, arial, sans-serif;
    position: absolute;
    top: 0;
    right: 35px;
    background: #d72152; }

#register-link a:hover {
    background: #c20543; }

#submit-button {
    width: 100%;
    height: 150px;
    position: relative;
    z-index: 500;
    overflow: hidden; }

#to-recover {
    color: #dddc05;
    display: block;
    margin: 0 0 10px;
    font-size: 13px;
    font-family: museo_300regular, helvetica, arial, sans-serif; }

#to-recover:hover {
    text-decoration: underline; }

#loginbox .help-block.error,
#loginbox .errorSummary li {
    color: black;
    margin: 0 0 2em;
    background: url("/ng-platform/dist/img/alert.png") 5px 8px no-repeat;
    padding: 4px 4px 4px 30px; }

/* ----- Whitelabel ----- */
body.is-whitelabled #loginbox input {
    background: var(--brand, #341C4C);
    color: var(--primary, #343845) !important;
    padding-left: 0.5em;
    padding-right: 0.5em;
    margin-top: 0.5em;
    border: 1px solid #d6d8db;
    border-radius: 5px; }

body.is-whitelabled #login-wrap p {
    font-family: museo_300regular, helvetica, arial, sans-serif;
    text-align: center;
    color: black;
    margin: 0 0 25px;
    font-size: 15px; }

body.is-whitelabled #loginbox .errorSummary li {
    color: black; }

body.is-whitelabled #login-wrap #submit-button input[type='submit'] {
    background: #444; }

body.is-whitelabled #loginbox input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px #ffffff inset;
    color: #000 !important; }

body.is-whitelabled ::-webkit-input-placeholder {
    color: var(--primary, #343845) !important; }

body.is-whitelabled :-moz-placeholder {
    color: var(--primary, #343845) !important; }

body.is-whitelabled ::-moz-placeholder {
    color: var(--primary, #343845) !important; }

body.is-whitelabled :-ms-input-placeholder {
    color: var(--primary, #343845) !important; }

/* Create User Page Styles */
.manageUsersNavigation {
    display: inline-block;
    position: relative;
    float: right;
    margin-right: 10%; }

.accountTable {
    border: 1px solid grey;
    border-collapse: collapse;
    padding: 5px;
    width: 100%; }

.accountTable td {
    padding: 1px 25px; }

.accountTable tr:nth-child(odd) {
    background-color: #f1f1f1; }

.accountTable tr:nth-child(even) {
    background-color: #ffffff; }

.icon-clear-campaigns:before {
    content: "\e914";
    float: right;
    cursor: pointer; }

.icon-clear:before {
    content: "\e914"; }

.icon-pencil:before {
    content: "\f040"; }

.icon-preview:before {
    content: "\e93a";
    color: #4a4a4a; }

.icon-additional-data:before {
    content: "\e930"; }

.icon-Lists:before {
    content: "\e609"; }

.icon-WordCloud:before {
    content: "\e61d"; }

.nav-icon {
    vertical-align: middle;
    padding-right: 5px;
    padding-left: 2px; }

.apiFormLabel {
    text-align: center;
    width: 350px;
    float: right;
    line-height: 25px;
    box-sizing: border-box; }

.apiFormInput {
    float: right;
    height: 35px;
    width: 300px;
    max-width: 350px;
    border-radius: 0;
    border: 1px solid #e7e7e7;
    box-shadow: 0.5px 1.5px 2px 0 rgba(0, 0, 0, 0.1);
    margin-right: 15px;
    margin-top: 2px; }

.viewFormLabel {
    height: 35px;
    width: 90%;
    max-width: 350px;
    border-radius: 0;
    border: 1px solid #e7e7e7;
    float: left;
    margin: 0 1.3em 0 0;
    padding: 0 .5em;
    box-shadow: 0.5px 1.5px 2px 0 rgba(0, 0, 0, 0.1);
    text-transform: capitalize; }

.updatePageNote {
    display: inline-block;
    position: relative;
    color: grey;
    margin-bottom: 1em; }

.updateRoleRow {
    float: left;
    width: 100%;
    box-sizing: border-box; }

.updateRoleField {
    height: 35px;
    width: 90%;
    max-width: 350px;
    border-radius: 0;
    border: 1px solid #e7e7e7;
    float: left;
    margin: 0 1.3em 0 0;
    padding: 0 0.5em;
    box-shadow: 0.5px 1.5px 2px 0 rgba(0, 0, 0, 0.1);
    text-transform: capitalize; }

.wrapper {
    display: block;
    position: relative;
    width: 100%; }

.campaignItem {
    position: relative;
    display: block;
    padding: 1em 0; }

.campaignWrapper {
    display: inline-block;
    position: relative;
    width: 100%; }

.campaignHolder {
    position: relative;
    height: auto;
    width: 50%;
    float: left; }

.selectedCampaignHolder {
    position: relative;
    height: auto;
    width: calc(50% - 6em);
    float: left;
    margin-left: 6em;
    margin-top: -2.9rem; }

.campaignCheckbox {
    display: block;
    margin-top: 1.65em; }

.searchQuestionRow {
    float: left;
    margin-bottom: 2.3em;
    box-sizing: border-box;
    margin-left: 3em;
    margin-right: 7em;
    margin-top: -0.3em; }

.searchQuestionField {
    display: inline-block;
    position: relative;
    border-radius: 0;
    border: 1px solid #e7e7e7;
    float: left;
    height: 25px;
    margin: 0 1.3em 0 0;
    max-width: 260px;
    padding: 0 0.5em;
    box-shadow: 0.5px 1.5px 2px 0 rgba(0, 0, 0, 0.1); }

.title--manageUsersTitle {
    display: inline-block;
    float: left;
    position: relative;
    font-size: 1.5em;
    font-weight: 300;
    margin-bottom: 1.5em; }

.btn--manageUsersAlt {
    color: #fff;
    display: block;
    line-height: 2.6em;
    max-width: 165px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    padding: 0;
    background: #4589d9;
    margin-left: 13em;
    margin-top: -3.6em;
    margin-bottom: 3em; }

.btn--manageUsersCreate {
    float: right;
    cursor: pointer;
    background: #45d989;
    color: #fff;
    display: block;
    line-height: 2.6em;
    max-width: 220px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    padding: 0;
    border-radius: 0;
    border: none;
    font-weight: 300;
    position: relative;
    text-decoration: none !important; }

.btn--manageUsersCreateAlt {
    float: right;
    cursor: pointer;
    background: #4589d9;
    color: #fff;
    display: block;
    line-height: 2.6em;
    max-width: 220px;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    padding: 0;
    border-radius: 0;
    border: none;
    font-weight: 300;
    position: relative;
    text-decoration: none !important;
    margin-left: 1em; }

.apiSpan {
    cursor: pointer; }

.manageUsersForm {
    display: block;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 1200px; }

/*
	Modal
 */
.btf-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 50%;
    max-width: 450px;
    max-height: 195px;
    height: auto;
    z-index: 2000;
    transform: translateX(-50%) translateY(-50%);
    box-shadow: 0 4px 4px 20000px rgba(0, 0, 0, 0.24); }
@media all and (max-width: 1020px) {
    .btf-modal {
        max-height: 100% !important; }
    .btf-modal .share__link {
        max-width: 100% !important; }
    .btf-modal .share__nav {
        float: left !important;
        width: 100% !important;
        margin-bottom: 1em !important;
        text-align: center !important; }
    .btf-modal .share__nav .btn--flipped {
        display: inline-block !important;
        float: none !important; }
    .btf-modal .share__nav .btn--spacedhorizontal {
        margin-left: 0em !important;
        margin-right: 0em !important; }
    .btf-modal .share__nav--secondary {
        float: left !important;
        width: 100% !important;
        text-align: center !important; }
    .btf-modal .share__linkoutput {
        width: calc(100% - 200px) !important; } }
@media all and (max-width: 510px) {
    .btf-modal .btn--primary {
        width: 30% !important; } }

.demo-modal {
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #e7e7e7;
    height: 195px;
    padding: 1em 15px;
    width: 450px; }

.demo-modal--large {
    overflow: hidden;
    height: 530px;
    max-height: 530px;
    transition: height 0.6s ease-in-out; }

.demo-modal--wide {
    max-width: 720px;
    width: 100%; }

.demo-modal--xwide {
    max-width: 900px;
    width: 90%; }
@media all and (max-width: 1020px) {
    .demo-modal--xwide.tall {
        max-height: 680px !important; } }

.demo-modal--scroll {
    max-height: 450px !important;
    overflow-y: auto; }

.demo-modal--annotations {
    z-index: 1000;
    width: 90%;
    max-width: 1100px; }
.demo-modal--annotations img {
    width: 100%;
    height: auto; }

.demo-modal--email {
    max-width: 650px !important;
    width: 100%; }

.demo-modal--preview {
    max-width: 480px;
    width: 480px; }

.demo-modal--auto {
    height: auto;
    max-height: 100%; }

.demo-modal--front {
    z-index: 3000; }

.demo-modal--priority {
    z-index: 3100; }

.demo-modal--shadow {
    box-shadow: 0 0 10px #d3d3d3; }

.demo-modal-close, .sidebar__close {
    background: #4a4a4a;
    border-radius: 50%;
    color: #fff;
    position: absolute;
    right: 15px;
    text-align: center;
    text-decoration: none !important;
    top: 15px;
    width: 1.5em; }

.demo-modal--response {
    height: auto;
    max-height: 80%;
    max-width: 900px;
    overflow-y: auto;
    width: 100%;
    z-index: 1999; }
.demo-modal--response .listitem__content {
    width: calc(100% - 250px); }

.modal__input {
    border-radius: 5px;
    border: 1px solid #e7e7e7;
    margin-bottom: 1em;
    margin-top: 0;
    padding: 0.5em;
    width: 100%; }

.demo-modal--large .modal__form {
    background: #fff;
    position: absolute;
    bottom: 1em;
    left: 15px;
    width: 90%;
    width: calc(100% - 30px); }

.modal__lists {
    height: 290px;
    overflow: auto;
    overflow-x: hidden; }

.modal__lists a {
    cursor: pointer;
    display: block;
    width: 100%;
    clear: both; }

.modal__lists a span {
    float: right; }

.modal__listsfilter {
    bottom: 118px;
    position: absolute;
    right: 1em;
    z-index: 20; }
.modal__listsfilter label {
    font-size: 0.9em;
    margin-right: 0.5em; }
.modal__listsfilter input {
    border-radius: 3px;
    border: 1px solid #e7e7e7; }

.btf-modal.capture-modal {
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #e7e7e7;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.24);
    height: 650px;
    max-height: 650px;
    padding: 1em 15px;
    width: 700px;
    max-width: 700px; }

.btf-modal.decline-modal {
    height: 215px;
    max-height: 215px; }

.btf-modal.approve-modal {
    height: auto;
    max-height: 100%; }

.copy-list-item-modal {
    min-height: 250px; }
.copy-list-item-modal .modal__listsfilter {
    position: relative;
    bottom: 0;
    right: 0;
    float: right;
    margin-bottom: 1rem;
    margin-top: -2.4rem; }
.copy-list-item-modal .modal__lists {
    clear: both;
    height: 325px; }

/* ----- New modals ----- */
.modal__scroll-container {
    max-height: 600px;
    overflow-y: auto;
    overflow-x: hidden;
    margin-bottom: 12px;
    float: left;
    width: 100%; }

.modal__scroll-container ul {
    padding: 0;
    margin: 0; }

.modal__scroll-container li:nth-child(even) .row {
    background: #f9f9f9; }
.modal__scroll-container li:nth-child(even) .row .row {
    background: transparent; }

.modal__scroll-container li .row {
    list-style: none; }
.modal__scroll-container li .row > .col:first-child {
    margin-right: 12px; }
.modal__scroll-container li .row > .col:last-child {
    margin-right: 12px;
    float: right; }

.modal-footer,
.modal-header {
    border: none; }
.modal-footer button.close,
.modal-header button.close {
    background: none;
    border: none;
    margin-top: 12px; }

.modal-header {
    background: #f6f6f6;
    border-bottom: #D6D6D6 1px solid !important; }
.modal-header .title {
    margin-bottom: 0.6em !important; }

.modal-dialog {
    max-width: 750px; }

.modal__input {
    border-radius: 0 !important; }

.modal__header-text {
    float: left; }

.modal__header {
    padding-bottom: 12px;
    float: left;
    clear: both; }
.modal__header .title {
    margin-top: -1.5rem; }

.row.modal__header {
    padding: 12px 0; }

.modal__input--search {
    width: calc(100% - 200px) !important;
    height: 40px; }

.modal__input--header {
    float: right; }

.generate-showreel-modal {
    max-width: 800px;
    width: 90%;
    max-height: 538px;
    height: 100%; }

.generate-showreel-modal--large {
    max-height: 775px; }

/* ----- Merge list mocel ----- */
.merge-list-modal {
    max-width: 900px;
    width: 95%; }

.merge-list-modal__row {
    clear: both;
    width: 100%;
    display: block; }
.merge-list-modal__row:after {
    content: "";
    display: table;
    clear: both; }

.merge-list-modal__col {
    float: left;
    width: 48%; }
.merge-list-modal__col:first-child {
    margin-right: 4%; }

/*
	Navigation
*/
.nav {
    position: relative; }

/* ----- Main portal navigation ----- */
.l-nav {
    clear: both;
    margin-top: 2em;
    position: absolute;
    left: 0;
    bottom: 0; }

.nav__link {
    border-bottom: 5px solid var(--brand, #341C4C);
    color: #fff;
    display: inline-block;
    font-size: 1.2em;
    margin-right: 1em;
    padding: 0 1rem .5em;
    text-align: center;
    min-width: 140px; }
.nav__link:hover, .nav__link:focus, .nav__link.nav__link--active {
    text-decoration: none;
    border-bottom: 5px solid var(--accent, #2d91e6); }
.header--light .nav__link:hover, .header--light .nav__link:focus, .header--light .nav__link.nav__link--active {
    border-bottom: 5px solid #fff; }
.nav__link i {
    margin-right: 0.5em;
    position: relative;
    top: 1px; }

/* ----- Navigation in sub header ----- */
.nav--primary {
    float: left;
    left: -20px;
    width: 220px; }
.nav--primary i {
    display: inline-block;
    text-align: center;
    width: 30px; }
.nav--primary .icon-arrow-down {
    float: right; }
.nav--primary > a {
    margin: 1em 0.7em;
    padding-left: 10px; }
.nav--primary .nav__dropdown {
    padding: 0; }
.nav--primary .nav__dropdown a {
    margin-right: 0;
    margin: 0;
    padding-bottom: 0.75em;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 0.75em; }

.nav--primary__activenav {
    background: #9B9B9B;
    color: #fff !important; }

.nav--secondary {
    float: right;
    margin-right: 3em; }

.nav--pinned {
    position: absolute;
    right: 0rem;
    top: 0rem; }

.nav--pinned--response {
    position: absolute;
    right: 1.5rem;
    top: 0.6rem;
    z-index: 21; }

.nav--offset {
    top: 3em; }
@media (max-width: 700px) {
    .nav--offset {
        top: 1.5em; } }

.action-menu-links {
    display: flex;
    flex-direction: column; }
.action-menu-links a {
    font-size: 0.875rem;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 0.3125rem 0.625rem 0.3125rem 0.9375rem; }
.action-menu-links a i {
    margin-right: 10px; }
.action-menu-links a:hover {
    background: #eceff5; }
.action-menu-links a:first-child {
    margin-top: 10px; }
.action-menu-links a:last-child {
    margin-bottom: 10px; }

/* ----- Navigations with dropdowns ----- */
.nav--subnav {
    position: relative;
    float: left;
    z-index: 110; }
.nav--subnav:hover {
    background: #fafafa;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2); }
.nav--subnav:hover .nav__dropdown {
    display: block; }

.nav__dropdown {
    background: #fafafa;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2);
    border-top: 0;
    display: none;
    left: 0;
    min-width: 220px;
    padding: 0px 20px;
    position: absolute;
    top: 51px; }
.nav__dropdown a {
    margin-bottom: 1em;
    margin-top: 0.5em;
    margin-right: 0; }

/* ----- Actions menu ----- */
.nav--actions {
    width: 250px; }
.nav--actions .icon-elipse {
    font-size: 0.8em; }
.nav--actions a:hover {
    text-decoration: none !important; }

.nav--actionsmain {
    z-index: 120; }

.nav--filters {
    z-index: 130; }

.nav--actions__control {
    color: var(--primary, #343845);
    float: right;
    font-size: 1.7em;
    height: 51px;
    line-height: 50px;
    position: relative;
    text-align: center;
    text-decoration: none !important;
    border-radius: 4px;
    width: 45px;
    z-index: 20;
    transition: background 0.15s ease-in-out; }
@media (max-width: 500px) {
    .nav--actions__control {
        background: #fafafa; } }

.nav--actions__control:hover, .nav--actions__control--active {
    background-color: rgba(0, 0, 0, 0.07); }

.nav--actions--active {
    z-index: 120; }

.nav--actions__control:hover .nav--actions__tooltip {
    display: block; }
@media (max-width: 500px) {
    .nav--actions__control:hover .nav--actions__tooltip {
        display: none; } }

.nav--actions--active .nav--actions__tooltip {
    display: none !important; }

.nav--actions__dropdown {
    background: #ffffff;
    clear: both;
    float: left;
    border-radius: 6px;
    padding: 0.5em 0;
    position: relative;
    width: 100%;
    min-width: 200px;
    border: 1px solid var(--vpm-border, #D8DCE6);
    z-index: 20;
    box-shadow: rgba(45, 45, 45, 0.05) 0px 2px 2px, rgba(49, 49, 49, 0.05) 0px 4px 4px, rgba(42, 42, 42, 0.05) 0px 8px 8px, rgba(32, 32, 32, 0.05) 0px 16px 16px, rgba(35, 35, 35, 0.05) 0px 64px 64px; }

.nav--actions__dropdown--wide {
    position: relative;
    right: 210px;
    width: 460px; }
.nav--actions__dropdown--wide .btn {
    float: left;
    width: 50%; }

.nav--actions__tooltip {
    font-size: 0.75rem;
    font-weight: 400;
    color: #fff;
    display: none;
    left: -20px;
    line-height: 1.25em;
    padding: 0.5rem 0.7rem;
    position: relative;
    font-family: roboto, sans-serif !important;
    text-align: center;
    top: 20px;
    width: 90px;
    background: #554a60;
    border-radius: 4px;
    box-shadow: 0px 2px 6px 0px rgba 0, 0, 0, 0.29; }

/* ----- Campaign nav----- */
.nav--campaign {
    float: right;
    margin-top: -2em; }

.nav--campaignsearch {
    margin-top: 0; }

/* ----- Admin actions nav ----- */
.adminnav {
    max-width: 250px;
    position: absolute;
    right: 0;
    top: 1.5em;
    width: 100%;
    z-index: 200; }

.adminnav__control {
    float: right;
    color: #fff;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 2px solid #fff;
    text-align: center;
    line-height: 43px; }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
    .adminnav__control {
        border: 1px solid #fff; } }
.adminnav__control:hover, .adminnav__control:focus {
    text-decoration: none; }

.adminnav__dropdown {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    background: #f9f9f9;
    border-radius: 3px;
    float: right;
    margin-top: 1em;
    padding: 1em;
    width: 100%;
    position: relative; }

.adminnav__seperator {
    margin-top: 1em;
    margin-bottom: 1em;
    display: block;
    border-bottom: 1px solid #ededed; }

.adminnav__link {
    display: block;
    font-size: 0.9em;
    line-height: 1.8em; }
.adminnav__link:hover {
    color: var(--brand, #341C4C);
    text-decoration: none; }

/* ----- Filter navigation ----- */
@media (max-width: 700px) {
    .nav--filters .btn span, .nav--filters .btn .icon-arrow-down {
        display: none; } }

/* ----- Snippet navigation ----- */
.snippet-navigation__btn {
    background: #e7e7e7;
    float: left;
    font-size: 0.9em;
    height: 28px;
    line-height: 30px;
    margin-right: 2px;
    text-align: center;
    width: 28px; }
.snippet-navigation__btn:focus {
    text-decoration: none; }
.snippet-navigation__btn:hover {
    text-decoration: none;
    background: var(--brand, #341C4C);
    color: #fff; }
.snippet-navigation__btn:hover i:before {
    color: #fff; }

/* Variables */
/* Font */
/* We'll will change this to blue on the new brand */
/* Icons & borders */
/* For menu hovers and dropdowns */
/* All icons */
/* Colors for all cards and borders */
/******** New Brand Colors ********/
/* Voxpopme */
/* Video MR */
/* Video CX */
/* Supporting */
/* Affectiva colours */
/* Base styling */
* {
    box-sizing: border-box; }

body ::-webkit-scrollbar-track {
    background: #f5f5f5; }

body ::-webkit-scrollbar {
    width: 14px;
    height: 18px; }

body ::-webkit-scrollbar-thumb {
    height: 6px;
    border: 4px solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    -webkit-border-radius: 7px;
    background-color: rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05); }

body ::-webkit-scrollbar-button {
    width: 0;
    height: 0;
    display: none; }

body ::-webkit-scrollbar-corner {
    background-color: transparent; }

body.header--new {
    padding-left: 5rem;
    padding-top: 4.2rem; }

body.header--new.vpm-portal--lists {
    padding-top: 6.2rem; }
body.header--new.vpm-portal--lists .l-subheader {
    display: none; }

body.header--new.vpm-portal--login {
    padding: 0; }

body.header--new.vpm-portal--authenticatorLogin {
    padding: 0; }

html:after,
body:after {
    content: "";
    display: table;
    clear: both; }

html {
    height: 100%; }

body {
    padding-bottom: 70px;
    min-height: 100%; }

[ng\:cloak],
[ng-cloak],
.ng-cloak {
    display: none !important; }

.pagination:after {
    content: "";
    display: table;
    clear: both; }

.pagination--inline {
    float: left; }

.pagination__link {
    float: left;
    background: #fff;
    color: var(--primary, #343845);
    height: 35px;
    line-height: 35px;
    margin: 0.5em 0.1em;
    text-align: center;
    width: 35px;
    border-radius: 4px; }
.pagination__link:hover, .pagination__link:focus {
    background: #f5f5f5;
    text-decoration: none; }
.pagination__link.pagination__link--disabled {
    opacity: 0.3; }
.pagination__link.pagination__link--disabled:hover, .pagination__link.pagination__link--disabled:focus {
    background: transparent;
    cursor: default;
    text-decoration: none; }

.pagination__link--active {
    background: var(--brand, #341C4C);
    color: #fff; }
.pagination__link--active:hover, .pagination__link--active:focus {
    background: var(--brand, #341C4C);
    color: #fff; }

.page-item {
    float: left;
    background: #fff;
    color: var(--primary, #343845);
    height: 35px;
    line-height: 35px;
    margin: 0.5em 0.1em;
    text-align: center;
    width: 35px;
    list-style: none; }
.page-item.disabled {
    opacity: 0.3; }
.page-item.disabled:hover, .page-item.disabled:focus {
    background: transparent; }
.page-item.disabled:hover a, .page-item.disabled:focus a {
    cursor: default; }
.page-item:hover, .page-item:focus {
    background-color: rgba(0, 0, 0, 0.07);
    text-decoration: none; }

.page-item:first-of-type {
    overflow: hidden; }
.page-item:first-of-type .page-link {
    outline: none; }
.page-item:first-of-type .page-link span {
    text-indent: -9999px;
    display: block; }
.page-item:first-of-type .page-link span::before {
    content: "First";
    display: inline-block;
    text-indent: 9999px;
    left: 0;
    top: 0; }

.page-item:last-of-type {
    overflow: hidden; }
.page-item:last-of-type .page-link {
    outline: none; }
.page-item:last-of-type .page-link span {
    text-indent: -9999px;
    display: block; }
.page-item:last-of-type .page-link span::before {
    content: "Last";
    display: inline-block;
    text-indent: 9999px;
    left: 0;
    top: 0; }

.page-item:nth-child(2) .page-link,
.page-item:nth-last-child(2) .page-link {
    font-size: .8em;
    line-height: 3.15em; }
.page-item:nth-child(2) .page-link span,
.page-item:nth-last-child(2) .page-link span {
    display: none; }
.page-item:nth-child(2) .page-link:before,
.page-item:nth-last-child(2) .page-link:before {
    font-family: 'icomoon';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    color: #4a4a4a; }

.page-item:nth-child(2) .page-link:before {
    content: "\e610"; }

.page-item:nth-last-child(2) .page-link:before {
    content: "\e615"; }

.page-link {
    display: block; }
.page-link:hover, .page-link:focus {
    text-decoration: none; }

.page-item.active {
    background: var(--brand, #341C4C);
    color: #fff; }
.page-item.active:focus {
    background: var(--brand, #341C4C);
    color: #fff; }

/* ----- Progress ----- */
.progress:after {
    content: "";
    display: table;
    clear: both; }

.progress--in-progress .progressbar {
    border-color: #f5a623; }

.progress--in-progress .progressbar__completion {
    background: #f5a623; }

.progress--in-progress .progress__count {
    color: #f5a623; }

.progress--completed .progressbar {
    border-color: #71c0a7; }

.progress--completed .progressbar__completion {
    background: #71c0a7; }

.progress--completed .progress__count {
    color: #71c0a7; }

.progress--error .progressbar {
    border-color: #f75656; }

.progress--error .progressbar__completion {
    background: #f75656;
    width: 50% !important; }

.progress--error .progress__count {
    color: #f75656; }

.progress--pending .progressbar {
    border-color: var(--primary, #343845); }

.progress--pending .progressbar__completion {
    background: var(--primary, #343845); }

.progress--pending .progress__count {
    color: var(--primary, #343845); }

/* ----- Progress bars ----- */
.progressbar {
    border: 1px solid #f00;
    float: left;
    height: 12px;
    position: relative;
    width: 80%;
    width: calc(100% - 60px); }
.progress--small .progressbar {
    height: 8px;
    top: 2.5px;
    width: calc(100% - 35px); }

.progressbar__completion {
    float: left;
    height: 100%;
    width: 70%; }

/* ----- Progress count ----- */
.progress__count {
    float: right;
    line-height: 1em;
    font-style: normal;
    text-align: center;
    width: 50px; }
.progress--small .progress__count {
    font-size: 0.9em;
    width: 30px; }
.progress__count .icon-checkmark {
    font-size: 1rem; }
.progress__count .icon-clock {
    font-size: 0.9rem; }
.progress__count .icon-Restore {
    margin-left: 5px; }
.progress--error .progress__count {
    right: -11px;
    position: relative; }
.progress--small.progress--error .progress__count {
    display: none; }

/* ----- Full progress bars ----- */
progress-bar {
    float: left;
    width: 100%; }

progress-bar:nth-child(2n) {
    background: #f9f9f9; }

.progress--full {
    padding: 0.57em 0; }
.progress--full .progressbar__filename {
    float: left;
    width: 400px; }
.progress--full .progressbar {
    margin-top: 5px;
    width: calc(100% - 460px); }
.progress--full .progress__count {
    margin-top: 5px; }

.response-list-title {
    margin-bottom: 0; }

.highlighted {
    color: #FFFFFF; }

.tab {
    width: 50%;
    display: inline-block;
    background: #e7e7e7;
    padding: 10px 0;
    text-align: center;
    float: left;
    cursor: pointer;
    opacity: 0.75; }
.tab.active {
    background: var(--accent, #2d91e6);
    color: #FFFFFF;
    opacity: 1; }
.tab.active:hover {
    padding-top: 5px;
    border-top: 5px solid var(--accent, #2d91e6);
    text-decoration: none; }
.tab:hover {
    padding-top: 5px;
    border-top: 5px solid #4a4a4a;
    text-decoration: none; }

/* ----- Response Status ----- */
.response__status {
    display: block;
    text-align: center;
    color: #fff;
    font-size: 0.8em;
    text-transform: uppercase;
    clear: left;
    line-height: 2.4em; }

.response__status--favourite {
    color: var(--primary, #343845);
    background-color: #e7e7e7; }
.response__status--favourite:after {
    content: "";
    display: table;
    clear: both; }
.response__status--favourite i {
    margin-right: 0.5em;
    color: var(--accent, #2d91e6); }

.response__status--awaiting {
    background: var(--accent, #2d91e6); }

.response__status--declined {
    background: var(--brand, #341C4C); }

/* ----- Response Sentiment ----- */
.response__sentiment {
    background: var(--primary, #343845);
    border-radius: 50%;
    border: 2px solid #f9f9f9;
    height: 29px;
    left: -13px;
    position: absolute;
    top: 30px;
    width: 29px;
    z-index: 20; }
.response__sentiment i {
    color: #fff;
    float: left;
    font-size: 1.3em;
    line-height: 1.3em;
    text-align: center;
    width: 100%; }

.response__sentiment--positive {
    background-color: #1bd9ba; }

.response__sentiment--neutral {
    background-color: #FFE162; }

.response__sentiment--negative {
    background-color: #D91B5D; }

/* ----- Response transcript ----- */
.response__transcript {
    margin-top: 1.5em;
    width: 100%;
    font-weight: 400;
    -webkit-touch-callout: auto;
    -webkit-user-select: auto;
    -moz-user-select: auto;
    -ms-user-select: auto;
    user-select: auto; }
.response__transcript:after {
    content: "";
    display: table;
    clear: both; }
.response__transcript .vpm_s br {
    clear: both; }
.response__transcript .vpm_s > span {
    height: 1.5em;
    cursor: text;
    position: relative; }
.response__transcript p:first-child {
    margin-top: 0; }

.response__transcript--editable {
    padding: 1em;
    resize: none;
    border-color: #e7e7e7; }

.response__transcript--unapproved {
    color: #949494; }

/* ----- annotation tags ----- */
.singleresponse__datacol .form__field {
    display: none; }

.annotation__tags {
    float: left;
    width: 100%; }

.annotation__tag {
    background: #4589d9;
    border-radius: 3px;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-size: 0.9em;
    line-height: 1.8em;
    margin-bottom: 8px;
    margin-right: 10px;
    padding: 0 10px;
    position: relative;
    font-weight: 400; }
.annotation__tag:hover > span {
    opacity: 0.8; }

p.annotation__tag {
    cursor: default; }

.annotation__tag--add {
    opacity: 0.5; }
.annotation__tag--add:hover {
    text-decoration: none;
    opacity: 1; }

/* ----- Response tags ----- */
.response__tags {
    margin-top: 0.5em;
    float: left;
    width: 100%;
    padding: 0; }
.listitem .response__tags {
    margin-top: 0.5em;
    float: left;
    width: 100%;
    padding: 0 0 0 2rem;
    border-bottom: 1px solid #ededed; }
.listitem .response__tags:last-child {
    border: none; }
.response__tags .btn--tertiary {
    font-size: 0.86rem;
    line-height: 1rem;
    padding: 0; }

.response__tag, .tm-tag {
    color: #fff;
    cursor: pointer;
    background: #5FB799;
    display: inline-block;
    margin-right: 10px;
    padding: 0 10px;
    margin-bottom: 8px;
    font-size: 0.9em;
    line-height: 1.8em;
    border-radius: 3px;
    font-weight: 400; }
.response__tag:hover, .tm-tag:hover {
    opacity: 0.8;
    text-decoration: none; }

.response__tag--list {
    background: #F5A623; }

.response__tag--theme {
    background: var(--brand, #341C4C); }
.response__tag--theme:hover {
    opacity: 0.8; }

.tm-tag-remove {
    color: #fff;
    float: right;
    font-size: 1.2em;
    line-height: 1.3em;
    margin-left: 10px;
    overflow: hidden;
    font-weight: 400;
    position: relative; }

.response__tag--input {
    height: 24px;
    border: none;
    color: #fff;
    width: 85px;
    transition: all 0.5s;
    opacity: 0.5; }
.response__tag--input:focus {
    width: 150px;
    opacity: 1; }
.response__tag--input::-webkit-input-placeholder {
    color: #fff; }
.response__tag--input:-moz-placeholder {
    color: #fff; }
.response__tag--input::-moz-placeholder {
    color: #fff; }
.response__tag--input:-ms-input-placeholder {
    color: #fff; }

.response__tag--wide {
    width: 100px; }

.tag__autocomplete {
    display: inline-block;
    position: relative; }

.tag__suggestions {
    background: #fff;
    position: absolute;
    top: 30px;
    left: 0;
    margin: 0;
    border: 1px solid #ccc;
    padding: 0.5em;
    z-index: 20;
    border-radius: 3px;
    min-width: 120px;
    max-width: 300px; }
.tag__suggestions li {
    width: 100%;
    padding: 0 0 0.2em;
    cursor: pointer;
    list-style: none;
    word-wrap: break-word; }
.tag__suggestions li:hover {
    color: var(--accent, #2d91e6); }

/* ----- Rotate response -----  */
.response__rotateimages {
    text-align: center; }
.response__rotateimages:hover .response__rotate {
    opacity: 0.7; }

.response__rotate {
    float: left;
    margin: 1em 1%;
    width: 23%; }
.response__rotate:hover {
    opacity: 1 !important; }
.response__rotate img {
    width: 100%; }

.response__rotate--90 img {
    /* IE 9 */
    /* Chrome, Safari, Opera */
    transform: rotate(90deg); }

.response__rotate--180 img {
    /* IE 9 */
    /* Chrome, Safari, Opera */
    transform: rotate(180deg); }

.response__rotate--270 img {
    /* IE 9 */
    /* Chrome, Safari, Opera */
    transform: rotate(270deg); }

/* ----- update response sentiment -----  */
.response__update-sentiment {
    text-align: center;
    font-size: 3em; }
.response__update-sentiment .update-sentiment {
    margin: 5px; }
.response__update-sentiment .update-sentiment:hover {
    text-decoration: none; }

@media (max-width: 700px) {
    .response-paginationtop {
        display: none; } }

/* ----- Quicklinks for tag/annotations ----- */
.response__quicklinks {
    float: left;
    margin-top: 1em;
    width: 100%; }

/* ----- Translations ----- */
.response__languageselector {
    position: absolute;
    top: 14px;
    right: 3em;
    z-index: 110; }
.listitem__content .response__languageselector {
    right: -19px;
    top: 0; }

.response__footnote {
    font-size: 0.8em;
    color: #B5B5B5;
    margin-bottom: 1em;
    clear: both; }

.edit-additional-data .icon-checkmark {
    color: #e7e7e7; }

.edit-additional-data .icon-checkmark:hover {
    color: var(--brand, #341C4C); }

.edit-additional-data .icon-cross {
    color: #e7e7e7; }

.edit-additional-data .icon-cross:hover {
    color: var(--brand, #341C4C); }

/* ----- Response details ----- */
.response__togglebutton {
    color: var(--accent, #2d91e6);
    text-decoration: none !important;
    cursor: pointer;
    font-size: 0.8em;
    display: block;
    margin: 0.5rem 0; }

/* ----- Response search space ----- */
span.vpm_spacer {
    display: inline-block;
    height: 12px;
    width: 100%;
    border-bottom: #ddd 1px solid;
    border-top: #ddd 1px solid;
    margin: 7px 0px 2px;
    position: relative; }
span.vpm_spacer span {
    transform: rotate(90deg);
    position: absolute;
    top: -6px;
    left: 48%;
    opacity: 0.6; }

/* ----- Tag titles ----- */
html .listitem .singleresponse__title {
    float: left;
    width: auto;
    line-height: 1rem;
    padding: 0;
    margin: 0 0 0 -2rem;
    cursor: default; }
html .listitem .singleresponse__title .singleresponse__icon {
    font-size: 1em;
    height: 1.4rem;
    line-height: 1.5em;
    margin-right: 0.5rem;
    text-align: center;
    width: 1.4rem; }
html .listitem .singleresponse__title .singleresponse__icon.icon-annotations {
    line-height: 1.6rem; }

/* ----- Tag tooltips ----- */
.response__tag--theme {
    position: relative; }
.response__tag--theme a:hover, .response__tag--theme a:focus {
    text-decoration: none; }
.response__tag--theme .response__tooltip {
    bottom: auto;
    top: calc(100% + 7px);
    z-index: 200;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
.response__tag--theme .response__tooltip:after {
    top: -7px;
    border-width: 0 7px 7px 7px;
    border-color: transparent transparent #4a4a4a transparent; }
.response__tag--theme:hover .response__tooltip {
    display: block; }

.response__tag--tag {
    position: relative;
    background: #5FB799; }
.response__tag--tag a:hover, .response__tag--tag a:focus {
    text-decoration: none; }

.response__tag--cross {
    color: #fff;
    float: right;
    font-size: 1.2em;
    line-height: 1.3em;
    margin-left: 10px;
    overflow: hidden;
    font-weight: 400;
    position: relative;
    text-decoration: none; }
.response__tag--cross a:hover {
    text-decoration: underline; }

.activethemes .response__tag--theme {
    opacity: 0.5; }

.activethemes .response__tag--theme.response__tag--active {
    opacity: 1; }

.popover-menu.popover-menu--theme {
    top: -50px;
    width: 220px;
    display: block;
    position: absolute;
    left: 50%;
    margin-left: -110px;
    text-align: center; }

.listitem__video--audioonly .video-player-container:after,
.listitem__video--audioonly .response__video--thumbnail:after,
.singleresponse__video--audioonly .video-player-container:after,
.singleresponse__video--audioonly .response__video--thumbnail:after {
    content: '';
    background: url("/ng-platform/dist/img/audio-only.svg") no-repeat center center #fff;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%; }

.singleresponse__video--audioonly .video-player-container:after {
    background-size: 100%; }

.listitem__image--processing {
    background: #ffffff;
    border: 1px solid #e7e7e7;
    border-radius: 6px;
    box-shadow: 0.5px 1.5px 2px 0 rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 300px;
    padding: 1rem; }
.listitem__image--processing p {
    margin: 0; }
.listitem__image--processing p:before {
    content: '';
    display: block;
    background: url("/ng-platform/dist/img/response-processing.svg") no-repeat center center;
    width: 50px;
    height: 50px; }

/* Variables */
/* Font */
/* We'll will change this to blue on the new brand */
/* Icons & borders */
/* For menu hovers and dropdowns */
/* All icons */
/* Colors for all cards and borders */
/******** New Brand Colors ********/
/* Voxpopme */
/* Video MR */
/* Video CX */
/* Supporting */
/* Affectiva colours */
/* Base styling */
* {
    box-sizing: border-box; }

body ::-webkit-scrollbar-track {
    background: #f5f5f5; }

body ::-webkit-scrollbar {
    width: 14px;
    height: 18px; }

body ::-webkit-scrollbar-thumb {
    height: 6px;
    border: 4px solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    -webkit-border-radius: 7px;
    background-color: rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05); }

body ::-webkit-scrollbar-button {
    width: 0;
    height: 0;
    display: none; }

body ::-webkit-scrollbar-corner {
    background-color: transparent; }

body.header--new {
    padding-left: 5rem;
    padding-top: 4.2rem; }

body.header--new.vpm-portal--lists {
    padding-top: 6.2rem; }
body.header--new.vpm-portal--lists .l-subheader {
    display: none; }

body.header--new.vpm-portal--login {
    padding: 0; }

body.header--new.vpm-portal--authenticatorLogin {
    padding: 0; }

html:after,
body:after {
    content: "";
    display: table;
    clear: both; }

html {
    height: 100%; }

body {
    padding-bottom: 70px;
    min-height: 100%; }

[ng\:cloak],
[ng-cloak],
.ng-cloak {
    display: none !important; }

.vpm-portal .response-list {
    background: #f9f9f9;
    padding-top: 2rem; }
.vpm-portal .response-list .row {
    background: transparent; }

.listitem--response {
    padding: 3em 0;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 0.1875rem 0.1875rem -0.125rem rgba(0, 0, 0, 0.09);
    margin-bottom: 2rem;
    padding-right: 3rem;
    border: 1px solid var(--vpm-border, #D8DCE6); }
.listitem--response .listitem__video {
    position: relative;
    position: sticky;
    position: -webkit-sticky;
    top: 10px;
    /* adjust sentinel height/positioning based on this position. */
    margin-left: -70px;
    min-height: 220px;
    max-width: 500px;
    width: 300px; }
@media (max-width: 1350px) {
    .listitem--response .listitem__video {
        margin-left: 1rem; } }
.listitem--response .listitem__video .responses__chart--bar {
    height: 10px; }
.listitem--response .listitem__video .responses__chart__segment {
    border-width: 10px;
    height: 10px; }
.listitem--response .listitem__video .responses__chart__segment:first-child {
    border-top-left-radius: 5px; }
.listitem--response .listitem__video .responses__chart__segment:last-child {
    border-top-right-radius: 5px; }
.listitem--response .response__status--favourite {
    background: transparent; }
.listitem--response .response-status {
    background: var(--brand, #341C4C);
    border-radius: 3px;
    color: #fff;
    display: inline-block;
    font-size: 0.9em;
    line-height: 1.8em;
    margin-bottom: 18px;
    margin-right: 5px;
    padding: 0 10px;
    position: relative; }
.listitem--response .response-status__declined {
    background: var(--brand, #341C4C); }
.listitem--response .response-status__awaiting {
    background: var(--accent, #2d91e6); }
.listitem--response .video-thumbnail {
    background: #ffffff;
    box-shadow: 0 25px 40px -14px rgba(0, 0, 0, 0.3);
    border-radius: 10px; }
.listitem--response .video-player-container {
    overflow: hidden;
    position: relative;
    box-shadow: 0 25px 40px -14px rgba(0, 0, 0, 0.3); }
.listitem--response .response__quicklinks {
    float: right;
    margin-top: 1em;
    width: 70%; }
.listitem--response .listitem__content {
    width: calc(100% - 265px); }
@media (max-width: 1350px) {
    .listitem--response .listitem__content {
        width: calc(100% - 355px); } }
.listitem--response .nav--actions__control {
    left: -10px;
    position: relative;
    top: -40px; }
.listitem--response .nav--actions__dropdown--wide {
    position: relative;
    right: 220px;
    width: 460px;
    top: -40px; }

.vpm-portal--campaign-selectTopics {
    background: #f9f9f9; }

.responses-title--container {
    display: flex;
    width: 100%;
    align-items: center;
    border-bottom: 1px solid #ECECEC;
    padding: 20px 0;
    margin-top: -12px;
    margin-bottom: 20px; }
.responses-title--container .truncate {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }

.empty-state-map {
    text-align: center;
    margin-top: 50px; }

/* ----- Status bar ----- */
.response-status-bar {
    margin-bottom: 1rem;
    float: left;
    width: 100%; }

.response-status-bar__segment {
    float: left;
    width: 25%;
    border: 1px solid #e7e7e7;
    border-right: none;
    text-align: center;
    font-size: 0.7rem;
    color: #e7e7e7;
    position: relative; }
.response-status-bar__segment:last-child {
    border-right: 1px solid #e7e7e7; }
.response-status-bar__segment:hover .response-status-bar__popup {
    display: block; }

.response-status-bar__segment--complete {
    background: #45d989;
    border-color: #45d989;
    color: #fff;
    z-index: 20; }
.response-status-bar__segment--complete:after {
    content: '';
    width: 0;
    height: 0;
    border-top: 12.5px solid transparent;
    border-bottom: 12.5px solid transparent;
    border-left: 12.5px solid #45d989;
    display: block;
    position: absolute;
    right: -0.8rem;
    top: 0; }
.response-status-bar__segment--complete:last-child:after {
    display: none; }

.response-status-bar__segment--current {
    background: #e7e7e7;
    color: #fff;
    z-index: 10; }
.response-status-bar__segment--current:after {
    content: '';
    width: 0;
    height: 0;
    border-top: 12.5px solid transparent;
    border-bottom: 12.5px solid transparent;
    border-left: 12.5px solid #e7e7e7;
    display: block;
    position: absolute;
    right: -0.8rem;
    top: 0; }

.response-status-bar__popup {
    display: none;
    position: absolute;
    width: 100%;
    left: 0;
    background: var(--primary, #343845);
    color: #fff;
    bottom: 40px;
    margin: 0;
    text-align: left;
    padding: 0.7rem;
    font-size: 0.7rem;
    line-height: 1.6em;
    border-radius: 5px;
    word-break: break-all; }
.response-status-bar__popup li {
    list-style-type: none;
    padding-bottom: 0.3rem;
    margin-bottom: 0.3rem;
    border-bottom: 1px solid #333; }
.response-status-bar__popup li:last-child {
    border: none; }
.response-status-bar__popup:after {
    content: '';
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid #4a4a4a;
    position: absolute;
    bottom: -10px;
    left: 50%;
    margin-left: -20px; }

/* ----- Response Charts----- */
.responses__charts {
    text-align: center; }

.responses__chart {
    display: inline-block;
    margin: 2em 0.5%;
    opacity: 1;
    transition: all 0.5s; }

.responses__charts--active .responses__chart, .responses__charts--active .responses__chart__segment {
    opacity: 0.3; }

.responses__charts--active .responses__chart--active, .responses__charts--active .responses__chart__segment--active {
    opacity: 1; }

.response__emotionscores {
    display: none;
    float: left;
    padding: 0;
    text-align: center;
    width: 100%; }

.response__emotionscore {
    display: block;
    list-style: none;
    text-transform: capitalize; }

.response__emotioncount {
    border-radius: 3px;
    display: block;
    margin: 0 auto 1em;
    padding: 0.5em 1em;
    text-align: center;
    width: 40%; }

.response__emotionscore--engagement .response__emotioncount {
    background: #ffd9ba; }

.response__emotionscore--contempt .response__emotioncount {
    background: #f3b7b6; }

.response__emotionscore--disgust .response__emotioncount {
    background: #f6d793; }

.response__emotionscore--smile .response__emotioncount {
    background: #e7cee8; }

.response__emotionscore--joy .response__emotioncount {
    background: #bede9b; }

.response__emotionscore--thought .response__emotioncount {
    background: #c6d1e3; }

/* ----- Response data views ----- */
.vpm_s {
    position: relative; }

.emotionActive {
    /* ----- Most Prevalent ----- */
    /* ----- Engagement ----- */
    /* ----- Contempt ----- */
    /* ----- Disgust ----- */
    /* ----- Smile ----- */
    /* ----- Joy ----- */
    /* ----- Thought ----- */ }
.emotionActive .vpm_s-epc span {
    background-color: #f3b7b6; }
.emotionActive .vpm_s-epd span {
    background-color: #f6d793; }
.emotionActive .vpm_s-eps span {
    background-color: #e7cee8; }
.emotionActive .vpm_s-epj span {
    background-color: #bede9b; }
.emotionActive .vpm_s-ept span {
    background-color: #c6d1e3; }
.emotionActive .vpm_s-epe span {
    background-color: #ffd9ba; }
.emotionActive.listitems--dataFiltered.engagement .response__transcript .vpm_s-ee0 span {
    background-color: transparent; }
.emotionActive.listitems--dataFiltered.engagement .response__transcript .vpm_s-ee1 span {
    background-color: #ffd9ba; }
.emotionActive.listitems--dataFiltered.engagement .response__transcript .vpm_s-ee2 span {
    background-color: #ffd9ba; }
.emotionActive.listitems--dataFiltered.engagement .response__transcript .vpm_s-ee3 span {
    background-color: #ffd9ba; }
.emotionActive.listitems--dataFiltered.contempt .response__transcript .vpm_s-ec0 span {
    background-color: transparent; }
.emotionActive.listitems--dataFiltered.contempt .response__transcript .vpm_s-ec1 span {
    background-color: #f3b7b6; }
.emotionActive.listitems--dataFiltered.contempt .response__transcript .vpm_s-ec2 span {
    background-color: #f3b7b6; }
.emotionActive.listitems--dataFiltered.contempt .response__transcript .vpm_s-ec3 span {
    background-color: #f3b7b6; }
.emotionActive.listitems--dataFiltered.disgust .response__transcript .vpm_s-ed0 span {
    background-color: transparent; }
.emotionActive.listitems--dataFiltered.disgust .response__transcript .vpm_s-ed1 span {
    background-color: #f6d793; }
.emotionActive.listitems--dataFiltered.disgust .response__transcript .vpm_s-ed2 span {
    background-color: #f6d793; }
.emotionActive.listitems--dataFiltered.disgust .response__transcript .vpm_s-ed3 span {
    background-color: #f6d793; }
.emotionActive.listitems--dataFiltered.smile .response__transcript .vpm_s-es0 span {
    background-color: transparent; }
.emotionActive.listitems--dataFiltered.smile .response__transcript .vpm_s-es1 span {
    background-color: #e7cee8; }
.emotionActive.listitems--dataFiltered.smile .response__transcript .vpm_s-es2 span {
    background-color: #e7cee8; }
.emotionActive.listitems--dataFiltered.smile .response__transcript .vpm_s-es3 span {
    background-color: #e7cee8; }
.emotionActive.listitems--dataFiltered.joy .response__transcript .vpm_s-ej0 span {
    background-color: transparent; }
.emotionActive.listitems--dataFiltered.joy .response__transcript .vpm_s-ej1 span {
    background-color: #bede9b; }
.emotionActive.listitems--dataFiltered.joy .response__transcript .vpm_s-ej2 span {
    background-color: #bede9b; }
.emotionActive.listitems--dataFiltered.joy .response__transcript .vpm_s-ej3 span {
    background-color: #bede9b; }
.emotionActive.listitems--dataFiltered.thought .response__transcript .vpm_s-et0 span {
    background-color: transparent; }
.emotionActive.listitems--dataFiltered.thought .response__transcript .vpm_s-et1 span {
    background-color: #c6d1e3; }
.emotionActive.listitems--dataFiltered.thought .response__transcript .vpm_s-et2 span {
    background-color: #c6d1e3; }
.emotionActive.listitems--dataFiltered.thought .response__transcript .vpm_s-et3 span {
    background-color: #c6d1e3; }

/* ----- Sentiment ------ */
.responses__chart--bar {
    display: block;
    max-width: 900px;
    width: 90%;
    margin-left: auto;
    margin-right: auto; }

.responses__chart--bar--themes, .responses__chart--bar--response {
    margin: 0;
    position: absolute;
    left: 0;
    width: 100%;
    height: 7px; }
.responses__chart--bar--themes .responses__chart__segment, .responses__chart--bar--response .responses__chart__segment {
    min-height: 0; }

.responses__chart--bar--themes {
    bottom: -7px;
    border-bottom-left-radius: 5px;
    display: block;
    border-bottom-right-radius: 5px;
    width: calc(100% + 2px);
    margin-left: -1px; }

.responses__chart--bar--response {
    top: 0;
    z-index: 30; }

.responses__chart__segment {
    float: left;
    padding-top: 1rem;
    text-align: center;
    text-decoration: none !important;
    text-transform: capitalize;
    width: 33%;
    min-height: 80px; }
.responses__chart__segment span {
    clear: both;
    display: block;
    font-size: 2.2em;
    line-height: 1em;
    margin-bottom: 0.1rem; }

.responses__chart__segments {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    display: block;
    height: 7px;
    overflow: hidden; }

.responses__chart__segment--positive {
    border-top: 7px solid #1bd9ba; }
.responses__chart__segment--positive span {
    color: #1bd9ba; }

.responses__chart__segment--neutral {
    border-top: 7px solid #FFE162; }
.responses__chart__segment--neutral span {
    color: #FFE162; }

.responses__chart__segment--negative {
    border-top: 7px solid #D91B5D; }
.responses__chart__segment--negative span {
    color: #D91B5D; }

.responses__chart__segment--null {
    border-top: 7px solid #e7e7e7;
    width: 100%; }

.responses__chart__segment--small .responses__chart__value {
    display: none; }

.responses__chart__segment--small:hover .responses__chart__value {
    display: block; }

.sentenceLevelSentimentActive .response__transcript span {
    color: var(--primary, #343845); }

.sentenceLevelSentimentActive.quote--negative {
    background-color: #F48F8D; }

.sentenceLevelSentimentActive.quote--positive {
    background-color: #B7E08B; }

.sentenceLevelSentimentActive.quote--neutral {
    background-color: #FFDF99; }

.sentenceLevelSentimentActive .response__transcript .vpm_s-sneg span {
    background-color: #F48F8D; }

.sentenceLevelSentimentActive .response__transcript .vpm_s-spos span {
    background-color: #B7E08B; }

.sentenceLevelSentimentActive .response__transcript .vpm_s-sneu span {
    background-color: #FFDF99; }

.sentenceLevelSentimentActive .quote--negative {
    background-color: #F48F8D; }

.sentenceLevelSentimentActive .quote--positive {
    background-color: #B7E08B; }

.sentenceLevelSentimentActive .quote--neutral {
    background-color: #FFDF99; }

.sentenceLevelSentimentActive.sentenceLevelSentiment--1 .response__transcript .vpm_s-sneg span, .sentenceLevelSentimentActive.sentenceLevelSentiment--1 .response__transcript .vpm_s-sneu span {
    background-color: transparent; }

.sentenceLevelSentimentActive.sentenceLevelSentiment--1 .response__transcript .vpm_s-spos span {
    background-color: #B7E08B; }

.sentenceLevelSentimentActive.sentenceLevelSentiment--1 .quote {
    background-color: #B7E08B; }

.sentenceLevelSentimentActive.sentenceLevelSentiment--0 .response__transcript .vpm_s-sneg span, .sentenceLevelSentimentActive.sentenceLevelSentiment--0 .response__transcript .vpm_s-spos span {
    background-color: transparent; }

.sentenceLevelSentimentActive.sentenceLevelSentiment--0 .response__transcript .vpm_s-sneu span {
    background-color: #FFDF99; }

.sentenceLevelSentimentActive.sentenceLevelSentiment--0 .quote {
    background-color: #FFDF99; }

.sentenceLevelSentimentActive.sentenceLevelSentiment---1 .response__transcript .vpm_s-spos span, .sentenceLevelSentimentActive.sentenceLevelSentiment---1 .response__transcript .vpm_s-sneu span {
    background-color: transparent; }

.sentenceLevelSentimentActive.sentenceLevelSentiment---1 .response__transcript .vpm_s-sneg span {
    background-color: #F48F8D; }

.sentenceLevelSentimentActive.sentenceLevelSentiment---1 .quote {
    background-color: #F48F8D; }

.sentenceLevelSentimentActive2.response__transcript {
    color: var(--primary, #343845); }
.sentenceLevelSentimentActive2.response__transcript .vpm_s-sneg span {
    background-color: #F48F8D; }
.sentenceLevelSentimentActive2.response__transcript .vpm_s-spos span {
    background-color: #B7E08B; }
.sentenceLevelSentimentActive2.response__transcript .vpm_s-sneu span {
    background-color: #FFDF99; }
.sentenceLevelSentimentActive2.response__transcript .quote--negative {
    background-color: #F48F8D; }
.sentenceLevelSentimentActive2.response__transcript .quote--positive {
    background-color: #B7E08B; }
.sentenceLevelSentimentActive2.response__transcript .quote--neutral {
    background-color: #FFDF99; }
.sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment--1 .vpm_s-sneg span, .sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment--1 .vpm_s-sneu span {
    background-color: transparent; }
.sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment--1 .vpm_s-spos span {
    background-color: #B7E08B; }
.sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment--1 .quote {
    background-color: #B7E08B; }
.sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment--0 .vpm_s-sneg span, .sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment--0 .vpm_s-spos span {
    background-color: transparent; }
.sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment--0 .vpm_s-sneu span {
    background-color: #FFDF99; }
.sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment--0 .quote {
    background-color: #FFDF99; }
.sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment---1 .vpm_s-spos span, .sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment---1 .vpm_s-sneu span {
    background-color: transparent; }
.sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment---1 .vpm_s-sneg span {
    background-color: #F48F8D; }
.sentenceLevelSentimentActive2.response__transcript.sentenceLevelSentiment---1 .quote {
    background-color: #F48F8D; }

/* ----- Breakdown tooltips ----- */
.response__tooltip {
    display: none; }

.emotionActive .response__transcript--hoveractive .vpm_s,
.sentenceLevelSentimentActive .response__transcript--hoveractive .vpm_s {
    opacity: 0.5; }

.emotionActive .response__transcript--hoveractive .vpm_s--active,
.sentenceLevelSentimentActive .response__transcript--hoveractive .vpm_s--active {
    opacity: 1; }

.emotionActive .listitem__content .response__transcript .response__tooltip,
.sentenceLevelSentimentActive .listitem__content .response__transcript .response__tooltip {
    display: block; }

.emotionActive .quote,
.sentenceLevelSentimentActive .quote {
    position: relative; }
.emotionActive .quote .response__tooltip,
.sentenceLevelSentimentActive .quote .response__tooltip {
    display: none; }
.emotionActive .quote:hover .response__tooltip,
.sentenceLevelSentimentActive .quote:hover .response__tooltip {
    display: block; }

.listitem--theme .vpm_s-snone span .response__tooltip, .listitem--theme .vpm_s-snon span .response__tooltip {
    margin-left: -125px;
    width: 245px;
    text-align: center; }

.sentenceLevelSentimentActive .listitem--popovermenuactive .response__transcript:hover .vpm_s {
    opacity: 1; }

.sentenceLevelSentimentActive .listitem--popovermenuactive .response__tooltip {
    display: none; }

.response__tooltip {
    background: #4a4a4a;
    bottom: calc(100% + 4px);
    left: 50%;
    margin-left: -65px;
    padding: 0.7em;
    position: absolute;
    width: 142px; }
.response__tooltip:after {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7px 7px 0 7px;
    border-color: #4a4a4a transparent transparent transparent;
    position: absolute;
    bottom: -7px;
    left: 50%;
    margin-left: -10px; }

.responses__chart--bar--themes:hover .response__tooltip, .responses__chart--bar--response:hover .response__tooltip {
    display: block;
    bottom: auto;
    top: calc(100% + 7px);
    z-index: 100; }
.responses__chart--bar--themes:hover .response__tooltip:after, .responses__chart--bar--response:hover .response__tooltip:after {
    top: -7px;
    border-width: 0 7px 7px 7px;
    border-color: transparent transparent #4a4a4a transparent; }

.response__tooltip ul {
    color: #e7e7e7;
    margin: 0;
    padding: 0;
    float: left;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }

.response__tooltip li {
    float: left;
    list-style: none;
    width: 100%;
    text-transform: uppercase;
    font-size: 0.7em;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }
.response__tooltip li em {
    font-style: normal;
    width: 50px;
    display: inline-block;
    text-align: left;
    font-size: 1.1rem;
    position: relative;
    top: 0.15em; }
.response__tooltip li.e em {
    color: #ffd9ba; }
.response__tooltip li.c em {
    color: #f3b7b6; }
.response__tooltip li.d em {
    color: #f6d793; }
.response__tooltip li.s em {
    color: #e7cee8; }
.response__tooltip li.j em {
    color: #bede9b; }
.response__tooltip li.t em {
    color: #c6d1e3; }
.response__tooltip li.positive em {
    color: #9CCC65; }
.response__tooltip li.neutral em {
    color: #FFDF92; }
.response__tooltip li.negative em {
    color: #EF5350; }

/*
    Showreel
*/
.showreels {
    margin-top: 5em; }

.showreel-title {
    position: absolute;
    top: -2em;
    left: 0; }

.showreel__featured {
    padding: 2em 0; }
.showreel__featured:after {
    content: "";
    display: table;
    clear: both; }

.showreel__featured .showreel__details {
    float: left;
    width: 250px; }
.showreel__featured .showreel__details .title {
    margin-bottom: 1em; }
.showreel__featured .showreel__details p {
    margin: 0; }

.showreel__featured .showreel__video {
    background: var(--primary, #343845);
    float: left;
    margin-right: 1em;
    padding-bottom: 0;
    width: 260px; }
.showreel__featured .showreel__video .btn {
    display: none; }

.showreel__content {
    background: #FBFBFB;
    padding: 1em;
    text-decoration: none !important; }
.showreel__content:hover {
    background: #EEE !important; }
.showreel__content.row--alt {
    background: #F6F6F6; }
.showreel__content .icon-showreel-view {
    font-size: 1.3em;
    line-height: 1.1em;
    position: relative;
    top: 2px; }
.showreel__content .date {
    display: inline-block;
    line-height: 1.2em;
    margin-left: 0.5em;
    position: relative;
    width: 26%; }
.showreel__content .time {
    margin-left: 22%;
    position: relative; }
.showreel__content .share {
    display: inline-block;
    margin-left: 13.5%;
    position: relative; }
.showreel__content .share a:hover .nav--actions__tooltip {
    display: block;
    left: -55px;
    position: absolute;
    top: 40px;
    width: 160px;
    z-index: 130; }
.showreel__content .share .share__icon {
    cursor: pointer;
    float: right;
    left: 16px;
    position: relative; }
.showreel__content .share .share__icon--shareEnabled {
    color: #1bd9ba; }
.showreel__content .share .share__icon--shareDisabled {
    color: #d0021b; }
.showreel__content .share .share__icon--shareDefalt {
    color: var(--primary, #343845); }
.showreel__content .icon-DownloadFull, .showreel__content .icon-Reset {
    float: right;
    margin: 0.35em 0.3em 0.45em;
    position: relative;
    cursor: pointer; }
.showreel__content .icon-Reset:hover .nav--actions__tooltip {
    display: block;
    margin-left: -51px;
    position: absolute;
    top: 30px;
    width: 160px; }
.showreel__content .icon-DownloadFull:hover .nav--actions__tooltip {
    display: block;
    margin-left: -51px;
    position: absolute;
    top: 30px;
    width: 160px; }
.showreel__content .icon-DownloadFull:hover .nav--actions__tooltip:before {
    bottom: 52px; }

.showreel__sharing {
    position: absolute;
    top: 0.2em;
    right: 0;
    width: 270px; }
.showreel__sharing .toggle {
    top: 2.5px; }

.share__nav {
    float: right;
    width: 50%; }

.share__nav--disabled {
    background: #fff;
    height: 60px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 30; }

.share__nav--secondary {
    float: left;
    width: 50%;
    display: flex; }
.share__nav--secondary .btn--primary {
    max-width: 135px; }

.share__link {
    float: left;
    margin-top: 1em;
    width: 100%;
    display: flex;
    height: 32px; }

.share__linkoutput {
    border: 1px solid #e7e7e7;
    float: left;
    margin: 0 1em 0 0;
    padding: 0 1em;
    width: 80%;
    max-width: 688px;
    height: 39px; }

.shareshowreel__linklabel {
    float: right;
    margin: 0 1em 0 0;
    line-height: 2.5em; }

.showreel__emails {
    display: block;
    clear: both;
    margin-top: 1em;
    width: 100%; }

.showreel__removeemail {
    cursor: pointer; }

/* ----- Simple header for embeding ----- */
.simple-showreel .l-header, .simple-showreel #shareContent, .simple-showreel #shareContentTitle {
    display: none !important; }

.simple-showreel .row {
    margin: 0;
    padding: 0; }

.simple-showreel #videoColumn {
    width: 100%;
    margin: 0; }

.simple-showreel #showreelPage {
    width: 100%;
    margin: 0;
    max-width: 100%; }

.simple-showreel .showreel__video {
    max-width: 600px; }

.singleresponse {
    position: relative; }

/* ----- Single response - breadcrumb ----- */
/* ----- Single response - response title ----- */
.singleresponse__header {
    float: left;
    width: 400px; }

.singleresponse__responsetitle {
    font-size: 1.26em;
    line-height: 1.25em; }
.singleresponse__responsetitle span, .singleresponse__responsetitle span.highlight {
    font-weight: 300; }

.singleresponse__responsedate {
    font-size: 1em;
    margin-bottom: 1.5em;
    margin-top: 0.3em; }

/* ----- Single response - Actions ----- */
.singleresponse__actions {
    float: right;
    width: calc(100% - 430px);
    padding-right: 4em;
    padding-top: 0.5em; }
.singleresponse__actions * {
    z-index: 20; }
.singleresponse__actions .nav--actions {
    position: absolute;
    top: 0;
    z-index: 10; }

/* ----- Single response cols-----  */
.singleresponse__responsecol {
    clear: left;
    float: left;
    width: 68%;
    position: relative;
    z-index: 1; }
@media (max-width: 800px) {
    .singleresponse__responsecol {
        width: 100%; } }
.singleresponse__responsecol .video.response__video--thumbnail {
    display: block; }
.singleresponse__responsecol .video-thumbnail {
    display: block; }
.singleresponse__responsecol .video-thumbnail .btn {
    display: none !important; }
.singleresponse__responsecol.annotation-active .flowplayer .fp-ui > * {
    opacity: 1; }

.singleresponse__datacol {
    float: right;
    width: 28%; }
@media (max-width: 800px) {
    .singleresponse__datacol {
        width: 100%; } }
.singleresponse__datacol .form__field {
    margin-bottom: 0.5em;
    max-width: 100%;
    width: 100%; }

/* ----- Single response video ------ */
.singleresponse__video {
    float: left;
    margin-bottom: 1em;
    margin-right: 0;
    position: relative;
    width: 100%;
    z-index: 10; }
@media (max-width: 700px) {
    .singleresponse__video {
        float: none;
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 2em; }
    .singleresponse__video:after {
        content: "";
        display: table;
        clear: both; } }
@media (max-width: 500px) {
    .singleresponse__video {
        width: 100%; } }
.listitems--showreel .singleresponse__video {
    height: 190px; }

/* ----- Search Transcript ------ */
html .singleresponse .form--search {
    max-width: 230px;
    margin: 0;
    width: 40%; }
html .singleresponse .form--search input[disabled] {
    opacity: 0.5; }

html .singleresponse .campaign__languageselector {
    float: right;
    position: relative; }

/* ----- Single response titles ------ */
html .singleresponse__title {
    border-radius: 3px;
    clear: both;
    cursor: pointer;
    color: var(--primary, #343845);
    display: block;
    font-size: 1em;
    font-weight: 300;
    line-height: 2em;
    margin: 1em 0 0.5em;
    padding: 0.5em 0;
    text-align: left;
    width: 100%; }
html .singleresponse__title .singleresponse__icon {
    border-radius: 50%;
    color: #fff;
    content: '';
    float: left;
    font-size: 1.3em;
    height: 2rem;
    line-height: 1.6em;
    margin-right: 0.5rem;
    text-align: center;
    width: 2rem; }

.singleresponse__title--tags .singleresponse__icon {
    background: #5FB799; }

.singleresponse__title--annotations .singleresponse__icon {
    background: #4589d9; }

.singleresponse__title--themes .singleresponse__icon {
    background: var(--brand, #341C4C); }

.singleresponse__title--additionaldata .singleresponse__icon {
    background: #8FE5C8; }

.singleresponse__title--lists .singleresponse__icon {
    background: #F5A623; }

/* ----- Single response data groups ----- */
.singleresponse__datagroup {
    clear: both;
    display: block;
    float: left;
    max-height: 300px;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    margin-top: 0.5em;
    margin-bottom: 1rem;
    width: 100%; }
.singleresponse__datagroup:after {
    content: "";
    display: table;
    clear: both; }
.singleresponse__datagroup .response__tag {
    transition: all ease-in-out 0.5s; }
.singleresponse__datagroup .response__tag a {
    text-decoration: none !important; }

.singleresponse__datagroup--tags .tm-tag:hover {
    opacity: 1;
    cursor: default; }

.singleresponse__lists p {
    margin: 0; }

.singleresponse .response__tags {
    margin-bottom: 0;
    margin-top: 0; }

.singleresponse__datacol .icon-arrow-right, .singleresponse__datacol .icon-arrow-down {
    float: right; }

.singleresponse__datacol .icon-arrow-right {
    display: block;
    margin-top: 0.75em; }

.singleresponse__datacol .icon-arrow-down {
    display: none;
    margin-top: 0.35em; }

.activeAccordian .icon-arrow-right {
    display: none; }

.activeAccordian .icon-arrow-down {
    display: block; }

.singleresponse__datagroup .response__tag, .singleresponse__datagroup .annotation__tag {
    transition: all ease-in-out 0.5s; }

.singleresponse__datagroup--filteractive .response__tag {
    opacity: 0.3; }

.singleresponse__datagroup--filteractive .response__tag--active {
    opacity: 1; }

.singleresponse__datagroup--filteractive .annotation__tag {
    opacity: 0.3; }

.singleresponse__datagroup--filteractive .annotation__tag--active {
    opacity: 1; }

/* @TODO - needs to be reviewed after beta release */
.singleresponse .popover-menu--annotation {
    display: none !important; }

.singleresponse .tag__suggestions {
    display: none !important; }

.singleresponse__datagroup--additionaldata dt {
    margin-bottom: 0;
    width: 100%; }

.singleresponse__datagroup--additionaldata dd {
    margin-bottom: 0.6rem;
    width: 100%; }
.singleresponse__datagroup--additionaldata dd:last-child {
    margin-bottom: 0; }

.singleresponse__datagroup--additionaldata dt input, .singleresponse__datagroup--additionaldata dd input {
    margin-bottom: 0.5rem;
    width: calc(100% - 40px); }

/* ----- Single response additional data ------ */
.singleresponse .listitem__content--secondary {
    border: none;
    padding: 0;
    margin: 0; }

/* ----- Specifics -----  */
.singleresponse .btngroup {
    float: left;
    margin-top: 1.5em;
    width: 100%; }

.singleresponse .response__status--favourite {
    background-color: transparent;
    text-align: left; }

/* ----- Cinema mode ----- */
.singleresponse__cinematoggle {
    display: none; }

@media (min-width: 1100px) {
    .singleresponse--cinemamode .singleresponse__video {
        margin-left: 75px;
        width: 950px; }
    .singleresponse--cinemamode .singleresponse__datacol {
        padding-top: 560px; }
    .singleresponse__cinematoggle {
        background: #e7e7e7;
        color: var(--primary, #343845);
        display: block;
        height: 30px;
        line-height: 30px;
        position: absolute;
        right: -30px;
        text-align: center;
        text-decoration: none !important;
        top: 0;
        width: 30px; }
    .singleresponse__cinematoggle:hover {
        text-decoration: none; } }

.singleresponse__contentcontrols {
    float: left;
    width: 100%; }

/* ----- Sentiment----- */
.singleresponse .nav--campaign__btngroup {
    float: right;
    position: relative;
    z-index: 20; }
.singleresponse .nav--campaign__btngroup .btn[disabled] {
    opacity: 0.3; }
.singleresponse .nav--campaign__btngroup .btn[disabled] .nav--actions__tooltip {
    display: none !important; }

.singleresponse .responses__charts {
    clear: both;
    float: left;
    width: 100%; }

.singleresponse .responses__charts .responses__chart {
    clear: both;
    float: left;
    width: 100%;
    margin: 0 0 2em; }

.singleresponse .loading-message {
    clear: both; }

.singleresponse .response__tooltip {
    display: block;
    height: 50px;
    z-index: 999;
    position: fixed; }

.singleresponse .quote .response__tooltip {
    display: none; }

/* ----- Toggle ----- */
.singleresponse .toggle {
    float: left;
    margin-bottom: 0;
    margin-top: 0;
    text-align: center;
    width: 100%; }
.singleresponse .toggle .toggle__switch {
    text-align: left; }

.quotecontainer .annotation__tag {
    margin-top: 1em; }

/* ----- Snippet navigation -----  */
.snippet-navigation {
    float: left;
    margin-bottom: 1em;
    margin-top: 1em; }

/* ----- Scrub Bar ----- */
.scrubbar {
    display: block;
    pointer-events: none;
    position: absolute;
    z-index: 101; }
.demo-modal--annotations .scrubbar {
    bottom: 0;
    height: 50px;
    left: 10%;
    width: 80%; }
.singleresponse__responsecol .scrubbar {
    height: 20px;
    left: 48px;
    top: 381px;
    width: 567px; }

.scrubbar__controls {
    pointer-events: all; }

.scrubbar__control {
    display: block;
    cursor: -webkit-grab !important;
    position: absolute;
    z-index: 20; }
.demo-modal--annotations .scrubbar__control {
    border-left: 3px solid #000;
    height: 36px;
    top: 7px;
    width: 10px; }
.demo-modal--annotations .scrubbar__control:before, .demo-modal--annotations .scrubbar__control:after {
    background: #000;
    content: '';
    height: 3px;
    position: absolute;
    width: 5px; }
.demo-modal--annotations .scrubbar__control:before {
    top: 0; }
.demo-modal--annotations .scrubbar__control:after {
    bottom: 0; }
.singleresponse__responsecol .scrubbar__control {
    background: #fff;
    width: 10px;
    height: 30px;
    top: 0;
    text-align: center; }
.singleresponse__responsecol .scrubbar__control:before {
    background: #000;
    content: "";
    display: block;
    height: 11px;
    left: 4px;
    position: absolute;
    top: 10px;
    width: 2px; }

.scrubbar__control--dragging {
    cursor: -webkit-grabbing !important; }
.scrubbar__control--dragging .nav--actions__tooltip {
    display: block;
    bottom: 45px;
    top: auto;
    margin-left: -12px;
    z-index: 20;
    width: 95px; }
.scrubbar__control--dragging .nav--actions__tooltip:before {
    transform: rotate(180deg);
    top: 34px; }

.scrubbar__control--start {
    left: 0; }
.scrubbar__control--start:before, .scrubbar__control--start:after {
    left: 0; }

.scrubbar__control--end {
    left: 0; }
.scrubbar__control--end:before, .scrubbar__control--end:after {
    left: -8px; }

.scrubbar__mask {
    background: #000;
    height: 14px;
    opacity: 0.5;
    pointer-events: none;
    position: absolute;
    top: 3px;
    width: 0;
    z-index: 10; }
.demo-modal--annotations .scrubbar__mask {
    display: none !important; }
.singleresponse__responsecol .scrubbar__mask {
    height: 24px; }

.scrubbar__mask--before {
    left: 0;
    border-bottom-left-radius: 0.24em;
    border-top-left-radius: 0.24em; }

.scrubbar__mask--current {
    background: none;
    border-bottom: 3px solid #fff;
    border-top: 3px solid #fff;
    height: 20px;
    left: 0;
    opacity: 1;
    top: 0; }
.singleresponse__responsecol .scrubbar__mask--current {
    height: 30px; }

.scrubbar__mask--after {
    border-bottom-right-radius: 0.24em;
    border-top-right-radius: 0.24em;
    right: 0; }

.singleresponse__responsecol.annotation-active .flowplayer .fp-timeline {
    height: 24px; }

.singleresponse__responsecol.annotation-active .flowplayer .fp-timestamp {
    bottom: 2em; }

.singleresponse__responsecol.annotation-active .flowplayer .fp-controls > * {
    margin-bottom: 10px; }

/* ----- Subthemes ----- */
.subthemes {
    margin-top: 1rem;
    padding-top: 1rem;
    margin-bottom: 1rem;
    overflow: hidden; }

.subthemes--loading {
    overflow: hidden;
    max-height: 220px; }
.subthemes--loading .subtheme {
    cursor: default; }

.subthemes {
    display: block; }

.subtheme-slider {
    position: relative;
    float: left;
    width: 100%; }

.subtheme-slider__slides {
    transition: transform 0.5s ease-in-out; }

.subthemes__next, .subthemes__prev {
    top: 40%;
    position: absolute;
    z-index: 30; }
.subthemes__next.disabled, .subthemes__prev.disabled {
    opacity: 0.3;
    cursor: default; }

.subthemes__next {
    right: -20px;
    color: #fff; }
.subthemes__next:after {
    color: #4a4a4a;
    font-size: 1.5rem;
    line-height: 1em;
    float: right;
    content: "\e615";
    font-family: 'icomoon'; }

.subthemes__prev {
    left: -30px;
    color: #fff; }
.subthemes__prev:after {
    color: #4a4a4a;
    font-size: 1.5rem;
    line-height: 1em;
    float: left;
    content: "\e610";
    font-family: 'icomoon'; }

.subtheme-group {
    float: left;
    max-width: 1100px;
    margin-right: 50px;
    width: 100%;
    opacity: 0.5;
    transition: opacity 0.5s ease-in-out; }
.subtheme-group.active {
    opacity: 1; }

.subtheme {
    margin: 0px 0.75% 1.7em 0.75%;
    vertical-align: text-top;
    width: 23%; }
.subtheme .btn--primary {
    font-size: 0.9em;
    margin-left: 1rem;
    max-width: 100%;
    width: calc(100% - 25px); }

/*
	Toggle Switches
*/
.toggle {
    display: block; }
.listitem__video .toggle {
    padding-top: 1em;
    clear: left; }

.toggle--inline {
    float: right;
    margin: 0 auto; }
@media (max-width: 700px) {
    .toggle--inline {
        float: left; } }

.toggle--campaignextras, .toggle--additionalData {
    float: right;
    margin: -2em 0 0 3.5em;
    text-align: center; }
.toggle--campaignextras .title, .toggle--additionalData .title {
    font-size: 1em;
    margin-bottom: 0.2em;
    margin-right: 0;
    text-align: center;
    width: 100%;
    float: none; }
.toggle--campaignextras .toggle__switch i, .toggle--additionalData .toggle__switch i {
    left: 13px; }
.toggle--campaignextras .toggle__switch--true i, .toggle--additionalData .toggle__switch--true i {
    background-color: var(--accent, #2d91e6);
    left: -6px; }

.toggle--inlinealt {
    float: left;
    margin: 0 1em 0 auto; }

.toggle--standalone {
    display: block;
    margin: -1.7em auto -2em;
    width: 140px; }

.toggle--standalonealt {
    margin: 0 auto 1.375rem; }

.toggle--response {
    margin: 0 auto; }

.toggle--showreel {
    display: inline-block;
    float: none;
    font-size: 1rem;
    margin-left: 1em;
    position: relative;
    top: -3px; }

.toggle--standalonesmall {
    width: 105px; }

.toggle--topic {
    margin: -2.3em auto 0; }

.toggle--advancedfields {
    margin-left: 1em;
    margin-top: 0.4em; }

.toggle__title {
    margin-right: 0.7em; }

.toggle__link {
    color: #4a4a4a;
    display: inline-block;
    text-decoration: none !important;
    vertical-align: middle;
    font-size: 0.8em;
    line-height: 1em;
    text-transform: uppercase; }
.toggle__link:hover {
    color: var(--accent, #2d91e6); }

.toggle__link--light {
    color: #fff; }

.toggle__switch {
    background: #e7e7e7;
    border-radius: 50px;
    display: inline-block;
    height: 10px;
    margin: 0 0.5em;
    vertical-align: middle;
    width: 26px; }
.toggle__switch i {
    background: #9B9B9B;
    border-radius: 50%;
    cursor: pointer;
    display: inline-block;
    height: 13px;
    position: relative;
    transition: all 0.2s;
    vertical-align: super;
    top: -1px;
    width: 13px; }
.toggle__switch.toggle__switch--false i,
.toggle__switch.toggle__switch--0 i,
.toggle__switch.toggle__switch--all i {
    left: 13px; }

.toggle__switch--true, .toggle__switch--1, .toggle__switch--any, .toggle__switch--all {
    background: #e7e7e7; }
.toggle__switch--true i, .toggle__switch--1 i, .toggle__switch--any i, .toggle__switch--all i {
    left: 0;
    background-color: var(--accent, #2d91e6); }

/* ----- Alt colors on toggle ----- */
.toggle--alt .toggle__link:hover {
    color: var(--accent2, #D91B5D); }

.toggle--alt .toggle__switch--true, .toggle--alt .toggle__switch--1, .toggle--alt .toggle__switch--any {
    background: #e7e7e7; }
.toggle--alt .toggle__switch--true i, .toggle--alt .toggle__switch--1 i, .toggle--alt .toggle__switch--any i {
    background-color: var(--accent2, #D91B5D); }

/* ----- Tables ----- */
.decoratedTable {
    font-size: 0.875rem;
    min-width: 100%; }

.decoratedTable__row {
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eaeaea; }
.decoratedTable__row:first-child {
    border-top: none; }
.decoratedTable__row:first-child:hover {
    background: #fff; }
.decoratedTable__row:hover {
    background: #f9f9f9; }

.decoratedTable--spacedbottom {
    margin-bottom: 2rem; }

.decoratedTable__row--nohover:hover {
    background-color: transparent; }

.decoratedTable__row--alt {
    background: #fefefe; }

.decoratedTable__cell {
    max-width: 300px;
    text-align: left;
    overflow: hidden;
    padding: 0.9em 1em;
    white-space: nowrap;
    font-weight: 300; }

.decoratedTable__cell--wrapped {
    white-space: normal;
    max-width: 500px;
    padding: 0.9em 0.5em; }

.decoratedTable__cell--campaignItems {
    white-space: normal;
    max-width: 500px;
    padding: 0.9em 0.5em;
    float: left; }

.decoratedTable__row--clickable {
    cursor: pointer; }

.decoratedTable__cell--api {
    padding: 0.9em 0.5em; }

.decoratedTable__cell--apiClickable {
    min-width: 340px;
    padding: 0.9em 0.5em; }

.decoratedTable__cell--role {
    padding: 0.9em 0.5em;
    text-transform: capitalize; }

.decoratedTable__cell--apiIcon {
    padding: 0.9em 0.5em;
    vertical-align: middle;
    text-align: center; }

.downloadTable {
    text-transform: capitalize; }

/* Variables */
/* Font */
/* We'll will change this to blue on the new brand */
/* Icons & borders */
/* For menu hovers and dropdowns */
/* All icons */
/* Colors for all cards and borders */
/******** New Brand Colors ********/
/* Voxpopme */
/* Video MR */
/* Video CX */
/* Supporting */
/* Affectiva colours */
/* Base styling */
* {
    box-sizing: border-box; }

body ::-webkit-scrollbar-track {
    background: #f5f5f5; }

body ::-webkit-scrollbar {
    width: 14px;
    height: 18px; }

body ::-webkit-scrollbar-thumb {
    height: 6px;
    border: 4px solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    -webkit-border-radius: 7px;
    background-color: rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05); }

body ::-webkit-scrollbar-button {
    width: 0;
    height: 0;
    display: none; }

body ::-webkit-scrollbar-corner {
    background-color: transparent; }

body.header--new {
    padding-left: 5rem;
    padding-top: 4.2rem; }

body.header--new.vpm-portal--lists {
    padding-top: 6.2rem; }
body.header--new.vpm-portal--lists .l-subheader {
    display: none; }

body.header--new.vpm-portal--login {
    padding: 0; }

body.header--new.vpm-portal--authenticatorLogin {
    padding: 0; }

html:after,
body:after {
    content: "";
    display: table;
    clear: both; }

html {
    height: 100%; }

body {
    padding-bottom: 70px;
    min-height: 100%; }

[ng\:cloak],
[ng-cloak],
.ng-cloak {
    display: none !important; }

/*
	Topic Containers
*/
.topics-container {
    width: 100%;
    background-color: var(--brand, #341C4C); }
.topics-container .flowplayer .fp-ui * {
    display: none; }
.topics-container .video__container, .topics-container .video-thumbnail, .topics-container .topics-container__link {
    position: relative;
    z-index: 20; }
.topics-container:hover {
    background-color: #4a4a4a; }

.topics-container--alpha {
    overflow: hidden; }
.topics-container--alpha .topics-container__content {
    padding-bottom: 0; }
.topics-container--alpha .topics-container__link {
    width: 66.6%; }

.topics-container--beta {
    overflow: hidden; }
.topics-container--beta .topics-container__link {
    width: 100%; }

.topics-container--gamma {
    overflow: hidden; }
.topics-container--gamma .topics-container__link {
    width: 100%; }

.topics-container--delta {
    overflow: hidden; }
.topics-container--delta .topics-container__link {
    width: 100%; }

.topics-container__content {
    float: left;
    padding: 4% 5%; }
.topics-container__content p {
    clear: both;
    margin-left: 7px;
    margin-top: 10px; }

.topics-container__link {
    height: 100%;
    float: left; }

.topics-container__fulllink {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10; }

.topic--title {
    padding: 7px;
    background-color: var(--accent, #2d91e6);
    margin: 5px 5px 5px 0;
    float: left; }

.masonry-container {
    width: 103%;
    position: relative;
    left: -1.5%; }

.masonry-brick {
    width: 31%;
    margin-right: 1%;
    margin-left: 1%; }
.masonry-brick .topics-container {
    margin-bottom: 20px; }
@media (max-width: 800px) {
    .masonry-brick {
        width: 48%;
        margin-right: 1%;
        margin-left: 1%; } }
@media (max-width: 600px) {
    .masonry-brick {
        width: 98%;
        margin-right: 1%;
        margin-left: 1%; } }

.topics__loader {
    position: absolute;
    right: 1em;
    top: 1em; }

.theme-explorer-topics {
    margin-left: 0;
    margin-right: 0; }
@media (max-width: 650px) {
    .theme-explorer-topics {
        width: 100%; } }

.theme-explorer-content > p:first-child {
    margin-top: 0; }

.theme-explorer-content .btn {
    position: absolute;
    top: -55px;
    right: 0; }

.theme-explorer-sidebar {
    float: right;
    background: #f9f9f9;
    margin-top: 1rem; }
.theme-explorer-sidebar.hasThemeSignificance {
    margin-top: 3.75em; }
@media (max-width: 650px) {
    .theme-explorer-sidebar {
        float: none;
        display: block;
        width: 100%;
        margin: 0; }
    .theme-explorer-sidebar .btn {
        width: 50%;
        float: left;
        text-align: center; }
    .theme-explorer-sidebar .btn i {
        float: none;
        display: inline-block; }
    .theme-explorer-sidebar .btn--primary {
        display: block;
        clear: both;
        margin-top: 1em;
        width: 100%;
        max-width: 100%; } }
.theme-explorer-sidebar .btngroup.theme-explorer-go {
    margin-bottom: 1em; }
.theme-explorer-sidebar .theme-significance {
    color: #7d7d7d;
    display: flex;
    font-size: 0.875rem;
    line-height: 1.25em;
    justify-content: space-between;
    align-items: baseline;
    max-width: 250px;
    position: relative;
    top: -2.75rem;
    right: 0;
    width: 100%;
    font-weight: 300; }
.theme-explorer-sidebar .theme-significance__btn {
    position: relative;
    text-decoration: none;
    cursor: pointer; }
.theme-explorer-sidebar .theme-significance__btn:hover {
    color: #000;
    text-decoration: none; }
.theme-explorer-sidebar .theme-significance__btn:before {
    box-sizing: border-box;
    content: '';
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 2px solid #C4C4C4;
    display: inline-block;
    margin-right: 0.3rem;
    top: 3px;
    position: relative; }
.theme-explorer-sidebar .theme-significance__btn--active {
    color: #000; }
.theme-explorer-sidebar .theme-significance__btn--active:before {
    border: 2px solid var(--accent, #2d91e6); }
.theme-explorer-sidebar .theme-significance__btn--active:after {
    box-sizing: border-box;
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--accent, #2d91e6);
    border: 2px solid #fff;
    display: inline-block;
    margin-right: 0.3rem;
    position: absolute;
    left: 2px;
    top: 5px; }

.transcript-search {
    float: left;
    margin-top: 7px;
    width: calc(100% - 820px); }

.ui-select-container .ui-select-dropdown {
    box-shadow: 0.5px 1.5px 9px 0 rgba(0, 0, 0, 0.3) !important;
    margin-top: -2px;
    top: 40px !important;
    background: #fff;
    max-height: 300px;
    overflow-y: scroll;
    width: 370px !important;
    z-index: 100; }

.ui-select-choices-row {
    padding: 0.5em 1em; }

.selectize-control > .selectize-input > input {
    border: none;
    margin: 0.18em 3em 0.4em 0.1em;
    padding: 0.4em;
    width: 80% !important; }

.selectize-input > div > span {
    display: block;
    height: 2em;
    overflow: hidden;
    padding: 0.4em; }

.tones {
    text-align: center; }

/* ----- Tone Labels ----- */
.tone {
    width: 17.5%;
    margin: 0 1%;
    display: inline-block;
    background: #45d989; }

.tone--anger {
    background: #ED080F; }

.tone--joy {
    background: #fbb400; }

.tone--fear {
    background: #cb66cc; }

.tone--sadness {
    background: #00317d; }

.tone--disgust {
    background: #45a31b; }

.tone__label {
    margin: 0;
    padding: 1.5em 0;
    text-transform: capitalize; }

/* ----- Tone levels ----- */
.tone__levels {
    float: left;
    width: 100%;
    padding: 0;
    margin: 0; }

.tone__level {
    float: left;
    width: 33.33%;
    list-style: none;
    padding: 0.5em 0;
    cursor: pointer; }

.tone__level--high {
    background: rgba(255, 255, 255, 0.4); }

.tone__level--medium {
    background: rgba(255, 255, 255, 0.6); }

.tone__level--low {
    background: rgba(255, 255, 255, 0.8); }

.tone__level--active {
    background: transparent !important;
    color: #fff; }

/* ----- Tone sentences -----  */
.tone__sentences {
    margin-top: 1em; }
.tone__sentences:hover {
    color: #aaa; }

.tone__sentence {
    cursor: default;
    display: inline;
    position: relative; }
.tone__sentence:hover {
    color: var(--primary, #343845); }
.tone__sentence:hover .tone__sentence__tooltip {
    display: block; }

.tone__sentence__tooltip {
    background: #fff;
    border: 1px solid #eee;
    display: none;
    height: 150px;
    left: 50%;
    margin: 0 0 0 -90px;
    padding: 1em;
    position: absolute;
    top: -160px;
    width: 180px; }

.tone__emotion {
    list-style: none; }
.tone__emotion span {
    display: inline-block;
    width: 90px; }
.tone__emotion:before {
    border-radius: 50%;
    content: '';
    display: inline-block;
    height: 10px;
    margin-right: 10px;
    vertical-align: middle;
    width: 10px; }

.tone__emotion--anger:before {
    background: #ED080F; }

.tone__emotion--joy:before {
    background: #fbb400; }

.tone__emotion--fear:before {
    background: #cb66cc; }

.tone__emotion--sadness:before {
    background: #00317d; }

.tone__emotion--disgust:before {
    background: #45a31b; }

/* Variables */
/* Font */
/* We'll will change this to blue on the new brand */
/* Icons & borders */
/* For menu hovers and dropdowns */
/* All icons */
/* Colors for all cards and borders */
/******** New Brand Colors ********/
/* Voxpopme */
/* Video MR */
/* Video CX */
/* Supporting */
/* Affectiva colours */
/* Base styling */
* {
    box-sizing: border-box; }

body ::-webkit-scrollbar-track {
    background: #f5f5f5; }

body ::-webkit-scrollbar {
    width: 14px;
    height: 18px; }

body ::-webkit-scrollbar-thumb {
    height: 6px;
    border: 4px solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    -webkit-border-radius: 7px;
    background-color: rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: inset -1px -1px 0px rgba(0, 0, 0, 0.05), inset 1px 1px 0px rgba(0, 0, 0, 0.05); }

body ::-webkit-scrollbar-button {
    width: 0;
    height: 0;
    display: none; }

body ::-webkit-scrollbar-corner {
    background-color: transparent; }

body.header--new {
    padding-left: 5rem;
    padding-top: 4.2rem; }

body.header--new.vpm-portal--lists {
    padding-top: 6.2rem; }
body.header--new.vpm-portal--lists .l-subheader {
    display: none; }

body.header--new.vpm-portal--login {
    padding: 0; }

body.header--new.vpm-portal--authenticatorLogin {
    padding: 0; }

html:after,
body:after {
    content: "";
    display: table;
    clear: both; }

html {
    height: 100%; }

body {
    padding-bottom: 70px;
    min-height: 100%; }

[ng\:cloak],
[ng-cloak],
.ng-cloak {
    display: none !important; }

.popover-menu {
    background: var(--brand, #341C4C);
    border-radius: 100px;
    color: white;
    cursor: pointer;
    display: none;
    padding: 0.5em;
    z-index: 120;
    font-weight: 500;
    font-size: 0.8125rem;
    box-shadow: 0px 5px 6px 0px rgba(52, 28, 76, 0.18); }
.popover-menu span {
    padding: 1em 0.5em; }
.popover-menu span:hover, .popover-menu span:focus {
    opacity: 0.8; }

.popover-menu__arrow {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(161, 20, 72, 0);
    border-top-color: var(--brand, #341C4C);
    border-width: 8px;
    margin-left: -10px; }

/* ----- popover for annotations----- */
.popover-menu--annotation {
    top: -50px;
    width: 220px; }

.popover-menu--active {
    display: block !important; }

.js-selectable-response span.selected {
    background-color: var(--primary, #343845) !important;
    color: #e7e7e7; }

.popover-menu--disabled {
    cursor: default;
    opacity: 0.2; }

/* ----- Scrollable content ----- */
.scrollable-content {
    float: left;
    margin-top: 1rem;
    max-height: 250px;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 1rem;
    width: 100%; }
.scrollable-content > p:first-child {
    margin-top: 0; }
.scrollable-content .response__transcript {
    margin-top: 0; }

.scrollable-content--tall {
    max-height: 400px; }

.scrollable-content--spaced {
    top: 3em;
    position: relative; }

/* ----- Scrollable content controls ----- */
.vpm-portal--list .popover-menu {
    display: none !important; }

.scrollable-content__controls {
    border-bottom: 1px solid #e7e7e7;
    border-top: 1px solid #e7e7e7;
    clear: both;
    float: left;
    margin-top: 1rem;
    padding: 0.5em 0;
    width: 100%; }

.scrollable-content__control {
    color: var(--primary, #343845);
    cursor: pointer;
    float: left;
    margin-right: 0.8rem;
    opacity: 1;
    position: relative;
    text-decoration: none !important;
    transition: all 0.2s ease-in-out; }
.scrollable-content__control .response__tooltip {
    color: #fff;
    margin-bottom: 4px;
    margin-left: -67px;
    text-align: center; }
.scrollable-content__control:hover .response__tooltip {
    display: block; }

.scrollable-content__control--disabled {
    opacity: 0.4;
    color: var(--primary, #343845);
    cursor: default; }
.scrollable-content__control--disabled .response__tooltip {
    display: none !important; }

.scrollable-content__control .icon-update {
    font-size: 0.9em; }

/* ----- Single response view transcription actions ----- */
html .popover-menu.popover-menu--singleResponse {
    background-color: transparent;
    color: var(--primary, #343845);
    padding: 0;
    z-index: 10; }
html .popover-menu.popover-menu--singleResponse .popover-menu__arrow {
    display: none; }
html .popover-menu.popover-menu--singleResponse span {
    background: #e7e7e7;
    border-radius: 0;
    cursor: default;
    float: left;
    margin-right: 0.5em;
    opacity: 0.4;
    padding: 0.4em 0.7em;
    transition: all ease-in-out 0.5s; }

html .popover-menu.popover-menu--singleResponse--active span {
    opacity: 1;
    cursor: pointer;
    background: #A11448;
    color: #fff; }

#files {
    display: block;
    margin: 1em auto 1em;
    font-size: 0.8em;
    width: 180px; }

.progress-clock {
    background: #e7e7e7;
    display: inline-block;
    margin: 3px 0;
    min-height: 60px;
    padding: 0.5em;
    text-align: left;
    width: 100%;
    word-wrap: break-word;
    border-radius: 3px;
    vertical-align: top; }
.progress-clock .line button {
    float: right; }
.progress-clock .status {
    float: right; }

.progress-clock svg path {
    transition: stroke 1.5s ease; }

.progress-clock p.progressbar-text {
    transition: color 1.5s ease; }

.progress-clock.evaporating svg path, .progress-clock.evaporating p.progressbar-text {
    stroke: #4A55CB;
    color: #4A55CB; }

.progress-clock.canceled svg path, .progress-clock.canceled p.progressbar-text {
    stroke: #666666;
    color: #666666; }

.progress-clock.completed svg path, .progress-clock.completed p.progressbar-text {
    stroke: #009A00;
    color: #009A00; }

.progress-clock.error svg path, .progress-clock.error p.progressbar-text {
    stroke: #C71704;
    color: #C71704; }

.progress-clock.warning svg path, .progress-clock.warning p.progressbar-text {
    stroke: #F59F08;
    color: #F59F08; }

.progress-clock.pausing svg path, .progress-clock.pausing p.progressbar-text {
    stroke: #F59F08;
    color: #F59F08; }

.progress-clock.paused svg path, .progress-clock.paused p.progressbar-text {
    stroke: #F59F08;
    color: #F59F08; }

#progress-container {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    text-align: left;
    margin-right: 1%; }

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

.btn-warning, .btn-primary, .btn-success, .btn-danger {
    color: #fff;
    height: 28px;
    width: 28px;
    text-align: center;
    border-radius: 3px;
    display: inline-block;
    padding: 0;
    margin: 0 0.25em; }
.btn-warning img, .btn-primary img, .btn-success img, .btn-danger img {
    width: 100%;
    height: 100%; }

.btn-warning {
    background: #f0ad4e; }

.btn-primary {
    background-color: #337ab7; }

.btn-success {
    background-color: #5cb85c; }

.btn-danger {
    background-color: #d9534f; }

/*
    Videos
*/
.vpm-portal {
    /* ----- Video Controls ----- */
    /* ----- Non flowplayer video element ----- */
    /* ----- Processing videos ----- */
    /*!
   * ui-select
   * http://github.com/angular-ui/ui-select
   * Version: 0.16.0 - 2016-03-23T20:51:56.678Z
   * License: MIT
   */
    /* Style when highlighting a search. */
    /* Select2 theme */
    /* Mark invalid Select2 */
    /* Handle up direction Select2 */
    /* Selectize theme */
    /* Helper class to show styles when focus */
    /* Fix input width for Selectize theme */
    /* Fix dropdown width for Selectize theme */
    /* Mark invalid Selectize */
    /* Handle up direction Selectize */
    /* Bootstrap theme */
    /* Helper class to show styles when focus */
    /* Fix Bootstrap dropdown position when inside a input-group */
    /* See Scrollable Menu with Bootstrap 3 http://stackoverflow.com/questions/19227496 */
    /* fix hide/show angular animation */
    /* Mark invalid Bootstrap */
    /* Handle up direction Bootstrap */ }
.vpm-portal .listitem__video .video-thumbnail {
    width: 100%;
    padding-bottom: 100%; }
.vpm-portal .listitem--non-panel .listitem__video .video-thumbnail, .vpm-portal .topics-container--non-panel .listitem__video .video-thumbnail {
    padding-bottom: 75%; }
.vpm-portal .video-thumbnail {
    width: 33.33%;
    width: calc(100% / 3);
    height: 0;
    padding-bottom: 33.33%;
    padding-bottom: calc(100% / 3);
    position: relative;
    float: left;
    overflow: hidden; }
.vpm-portal .video-thumbnail .btn {
    background-color: #333;
    border-radius: 0;
    bottom: -33%;
    color: #fff;
    display: block;
    font-size: 0.6em;
    height: 33%;
    left: 0;
    line-height: 2.2em;
    opacity: 0.7;
    padding-top: 10%;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    transition: all 0.5s;
    width: 100%;
    z-index: 300; }
.vpm-portal .video-thumbnail:hover .btn {
    bottom: 0; }
.vpm-portal .video-thumbnail > a, .vpm-portal .video-thumbnail video-player .video--thumbnail {
    width: 100%;
    display: block;
    padding-bottom: 100%; }
.vpm-portal .video-thumbnail .flowplayer {
    position: absolute;
    height: 100%;
    width: 100%; }
.vpm-portal .topics-container--non-panel .video-thumbnail {
    padding-bottom: calc(74% / 3); }
.vpm-portal .video-thumbnail--processing {
    cursor: default; }
.vpm-portal .video-thumbnail--processing .icon-Reset {
    display: block;
    margin: 0 auto;
    color: #fff;
    width: 45px;
    font-size: 3em;
    text-align: center;
    margin-top: 2.3em;
    padding-bottom: 2.5em;
    text-decoration: none; }
.vpm-portal .video-thumbnail--processing:hover .nav--actions__tooltip {
    left: -55px;
    display: block;
    width: 160px; }
.vpm-portal .video--thumbnail {
    width: 100%;
    float: left;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIwAAACMCAAAAACLqx7iAAADBUlEQVR42u3bWbKsIAwGYPe/UQHFtp0nyHk5Y19bCZLArfJfwVc2SEjsLE8o2Y25MTfmxtyYG3NjqDFCiRQwZTOtxgKA3ZaxVhEx1Wjgb9a+iIOpV9jLVPBjihnexPaCGVNbeJ+1YMW0cBijGTEnFgCr2TA1nMYoJkxpzzGwCh7MCi7pWTCtkwVsyYCR1g0DMwOmA9docoywzpiJHPN0toBV1JjFHQMNMUYhLLASY54YDEhazIjC1LQYg8IMpBjUkkEvGiSmwmEsKabBYaCgxAxIzIMSMyMxT0rMisS0lBiDxAyUGKQFeXDjMOK/xsyEGInFLIQYlRImqSeT1JpJajflFokZU3oD95SYpM6mpE7tpOqZNqVK74HECEpMibNspAW5sITvPPQlbiHc2WhMj8JUtJgaY7HEF39FV0B4NIswB0JHjekQGE2NQbxpDH3rdSOqH7ww7sdTSY9Rlmgvec0OJpJaxhOjiZav34jH7XxqeDBOj8YwDb+cVs0zZ8I4bKgl58I4TG9LPszpGm5zRowygSeCVzC5Pvz8QPJiDpeN73ci3pijwZPixjQpYdqQtcNVzBDsuh8AM4c9I69hTLhp4GVMEfC+fxlzPJJTvJiF4GjyxZRB+zIXMRNBaeWLqSiKTk+MPO9Nj1wY4dINbnkwYk7nqqIWqns/HvNwn2UsBS1Gob6fsZTdTtlh501bTYRRPZYCALA9RXiMHn0oAACmU0ExslnhSuaHCIQR9WThasygA2Cq8brkc/V05SVMNRgImbUtPDG6Dys597zDqI5C8vlmfrfb9zHVBKSx+/8i2cOUC5DHDtIFI0dgiW3OMdoAV2Z5gmmBMa//InnB9MAaWx1gmC2vmsz9zkqjKd5gtOXHwCZ2MWKDGOl3MR3Eid7BSBsJM+9gYj2YX48mc+qL0Wb8B/OIZgErXjFjPMx3qzaL/yv97O4vjIpo+f6vRObaiyJdNC+YJibmq1WbRX/L/Jp8ZLGKhz+pbszxgZDFqH3P1sxjjRl5cd5EkRtzY25MqHwANgCoCRzroCEAAAAASUVORK5CYII=);
    background-size: cover; }
.vpm-portal .response__video--thumbnail {
    height: 0;
    height: 0;
    padding-bottom: 100%;
    width: 100%;
    float: left;
    background-size: 100%;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIwAAACMCAAAAACLqx7iAAADBUlEQ…p8ZLGKhz+pbszxgZDFqH3P1sxjjRl5cd5EkRtzY25MqHwANgCoCRzroCEAAAAASUVORK5CYII=");
    background-repeat: no-repeat;
    background-position: 0 0;
    position: relative;
    z-index: 10; }
.vpm-portal .response__video--thumbnail.video--active {
    background: transparent !important; }
@media screen and (max-width: 1080px) {
    .vpm-portal .response__video--thumbnail {
        max-width: 100%; } }
.vpm-portal .response__video--nothumbnail {
    background: #4a4a4a; }
.vpm-portal .listitem--non-panel .response__video--thumbnail, .vpm-portal .highlight-responses--non-panel .response__video--thumbnail, .vpm-portal .topics-container--non-panel .response__video--thumbnail, .vpm-portal .showreel-video--non-panel .video-thumbnail, .vpm-portal .demo-modal--non-panel .video-thumbnail {
    background-position: center center;
    padding-bottom: 75%; }
.vpm-portal .listitem--list .video__container.is-playing,
.vpm-portal .listitem--list .video__container.is-ready,
.vpm-portal .showreel__featured #showreel-video-container .flowplayer.video__container.is-ready {
    background: #000 !important; }
.vpm-portal #showreel-video-container {
    position: relative; }
.vpm-portal #showreel-video-container .video__container,
.vpm-portal .listitem--list .video__container,
.vpm-portal .listitem__imageslide .flowplayer,
.vpm-portal #annotations-video {
    position: absolute;
    top: 0;
    left: 0; }
.vpm-portal .response__video {
    float: left;
    margin: 0;
    width: 40%;
    margin-right: 4%;
    max-width: 300px;
    overflow: hidden;
    position: relative; }
@media screen and (max-width: 1080px) {
    .vpm-portal .response__video {
        float: none;
        display: block;
        margin-bottom: 2em;
        width: 100%;
        max-width: 100%; } }
.vpm-portal .response__video img {
    height: auto;
    max-width: 300px;
    width: 100%; }
.vpm-portal .response__info {
    float: right;
    width: 58%; }
@media screen and (max-width: 1080px) {
    .vpm-portal .response__info {
        float: none;
        display: block;
        width: 100%; } }
.vpm-portal .flowplayer {
    position: absolute;
    height: 0;
    padding-bottom: 100%;
    width: 100%;
    top: 0;
    left: 0; }
.vpm-portal .listitem--non-panel .flowplayer, .vpm-portal .highlight-responses--non-panel .flowplayer, .vpm-portal .topics-container--non-panel .flowplayer, .vpm-portal .showreel-video--non-panel .flowplayer, .vpm-portal .demo-modal--non-panel .flowplayer {
    padding-bottom: 75%; }
.vpm-portal .flowplayer .fp-engine {
    position: absolute;
    width: 100%;
    left: 0; }
.vpm-portal .fp-ratio {
    display: none !important; }
.vpm-portal .video__close {
    background: #9c123b;
    color: #fff;
    cursor: pointer;
    font-size: 1em !important;
    height: 1em;
    line-height: 1em;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 1em;
    z-index: 300; }
.vpm-portal .video__close:hover {
    text-decoration: none; }
.vpm-portal .video__close {
    display: none; }
.vpm-portal .video--active .video__close {
    display: block; }
.vpm-portal .video__close:hover {
    color: var(--brand, #341C4C);
    background: #fff; }
.vpm-portal .video__duration {
    display: none; }
.vpm-portal .video--hasduration .video__duration {
    background: var(--primary, #343845);
    opacity: 0.7;
    line-height: 1.7em;
    font-weight: 400;
    bottom: 0;
    color: #fff;
    display: block;
    font-size: 0.9em;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
    z-index: 10; }
.vpm-portal .video__play {
    background: url(/img/playicon.svg) center no-repeat;
    background-size: 100%;
    display: none;
    height: 70px;
    left: 50%;
    margin-left: -15px;
    margin-top: -35px;
    position: absolute;
    top: 50%;
    width: 40px;
    z-index: 10; }
.vpm-portal .video--active .video__play {
    display: none !important; }
.vpm-portal .response__video--thumbnail .video__play {
    display: block; }
.vpm-portal .video__container {
    position: relative;
    z-index: 20; }
.vpm-portal #preview-video-container {
    position: relative;
    width: 400px;
    margin: 1.5em auto; }
.vpm-portal #preview-video-container:after {
    content: "";
    display: table;
    clear: both; }
.vpm-portal #preview-video {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    width: 100%;
    z-index: 20; }
.vpm-portal #preview-video-container .flowplayer {
    height: 300px; }
.vpm-portal .listitem__video {
    position: relative;
    min-height: 220px; }
.vpm-portal .listitem__video .video--thumbnail {
    cursor: pointer;
    background: var(--primary, #343845);
    height: 100%;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 20;
    width: 100%; }
.vpm-portal .video--listing {
    transition: all 0.5s ease-in-out; }
.vpm-portal .preview_text {
    background: var(--brand, #341C4C);
    color: #fff;
    font-size: 0.8em;
    left: 0;
    line-height: 1.8em;
    margin: 0;
    padding: 0 0 0.1em;
    position: absolute;
    text-align: center;
    top: 0;
    width: 100%; }

@-webkit-keyframes rotating {
    from {
        transform: rotate(0deg); }
    to {
        transform: rotate(360deg); } }

@keyframes rotating {
    from {
        transform: rotate(0deg); }
    to {
        transform: rotate(360deg); } }
.vpm-portal .icon-Reset--rotating {
    -webkit-animation: rotating 2s linear infinite;
    animation: rotating 2s linear infinite; }
.vpm-portal .video--listing .icon-Reset {
    display: none; }
.vpm-portal .video--processing {
    cursor: default;
    opacity: 0.5; }
.vpm-portal .video--processing .icon-Reset {
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    color: #fff;
    font-size: 3em;
    margin-left: -22.5px;
    margin-top: -22.5px; }
.vpm-portal .ui-select-highlight {
    font-weight: bold; }
.vpm-portal .ui-select-offscreen {
    clip: rect(0 0 0 0) !important;
    width: 1px !important;
    height: 1px !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    outline: 0 !important;
    left: 0px !important;
    top: 0px !important; }
.vpm-portal .ui-select-choices-row:hover {
    background-color: #f5f5f5; }
.vpm-portal .ng-dirty.ng-invalid > a.select2-choice {
    border-color: #D44950; }
.vpm-portal .select2-result-single {
    padding-left: 0; }
.vpm-portal .select2-locked > .select2-search-choice-close {
    display: none; }
.vpm-portal .select-locked > .ui-select-match-close {
    display: none; }
.vpm-portal body > .select2-container.open {
    z-index: 9999;
    /* The z-index Select2 applies to the select2-drop */ }
.vpm-portal .ui-select-container[theme="select2"].direction-up .ui-select-match {
    border-radius: 4px;
    /* FIXME hardcoded value :-/ */
    border-top-left-radius: 0;
    border-top-right-radius: 0; }
.vpm-portal .ui-select-container[theme="select2"].direction-up .ui-select-dropdown {
    border-radius: 4px;
    /* FIXME hardcoded value :-/ */
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-top-width: 1px;
    /* FIXME hardcoded value :-/ */
    border-top-style: solid;
    box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.25);
    margin-top: -4px;
    /* FIXME hardcoded value :-/ */ }
.vpm-portal .ui-select-container[theme="select2"].direction-up .ui-select-dropdown .select2-search {
    margin-top: 4px;
    /* FIXME hardcoded value :-/ */ }
.vpm-portal .ui-select-container[theme="select2"].direction-up.select2-dropdown-open .ui-select-match {
    border-bottom-color: #5897fb; }
.vpm-portal .selectize-input.selectize-focus {
    border-color: #007FBB !important; }
.vpm-portal .selectize-control > .selectize-input > input {
    width: 100%; }
.vpm-portal .selectize-control > .selectize-dropdown {
    width: 100%; }
.vpm-portal .ng-dirty.ng-invalid > div.selectize-input {
    border-color: #D44950; }
.vpm-portal .ui-select-container[theme="selectize"].direction-up .ui-select-dropdown {
    box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.25);
    margin-top: -2px;
    /* FIXME hardcoded value :-/ */ }
.vpm-portal .btn-default-focus {
    color: #333;
    background-color: #EBEBEB;
    border-color: #ADADAD;
    text-decoration: none;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); }
.vpm-portal .ui-select-bootstrap .ui-select-toggle {
    position: relative; }
.vpm-portal .ui-select-bootstrap .ui-select-toggle > .caret {
    position: absolute;
    height: 10px;
    top: 50%;
    right: 10px;
    margin-top: -2px; }
.vpm-portal .input-group > .ui-select-bootstrap.dropdown {
    /* Instead of relative */
    position: static; }
.vpm-portal .input-group > .ui-select-bootstrap > input.ui-select-search.form-control {
    border-radius: 4px;
    /* FIXME hardcoded value :-/ */
    border-top-right-radius: 0;
    border-bottom-right-radius: 0; }
.vpm-portal .input-group > .ui-select-bootstrap > input.ui-select-search.form-control.direction-up {
    border-radius: 4px !important;
    /* FIXME hardcoded value :-/ */
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important; }
.vpm-portal .ui-select-bootstrap > .ui-select-match > .btn {
    /* Instead of center because of .btn */
    text-align: left !important; }
.vpm-portal .ui-select-bootstrap > .ui-select-match > .caret {
    position: absolute;
    top: 45%;
    right: 15px; }
.vpm-portal .ui-select-bootstrap > .ui-select-choices {
    width: 100%;
    height: auto;
    max-height: 200px;
    overflow-x: hidden;
    margin-top: -1px; }
.vpm-portal body > .ui-select-bootstrap.open {
    z-index: 1000;
    /* Standard Bootstrap dropdown z-index */ }
.vpm-portal .ui-select-multiple.ui-select-bootstrap {
    height: auto;
    padding: 3px 3px 0 3px; }
.vpm-portal .ui-select-multiple.ui-select-bootstrap input.ui-select-search {
    background: transparent !important;
    /* To prevent double background when disabled */
    border: none;
    outline: none;
    height: 1.666666em;
    margin-bottom: 3px; }
.vpm-portal .ui-select-multiple.ui-select-bootstrap .ui-select-match .close {
    font-size: 1.6em;
    line-height: 0.75; }
.vpm-portal .ui-select-multiple.ui-select-bootstrap .ui-select-match-item {
    outline: 0;
    margin: 0 3px 3px 0; }
.vpm-portal .ui-select-multiple .ui-select-match-item {
    position: relative; }
.vpm-portal .ui-select-multiple .ui-select-match-item.dropping-before:before {
    content: "";
    position: absolute;
    top: 0;
    right: 100%;
    height: 100%;
    margin-right: 2px;
    border-left: 1px solid #428bca; }
.vpm-portal .ui-select-multiple .ui-select-match-item.dropping-after:after {
    content: "";
    position: absolute;
    top: 0;
    left: 100%;
    height: 100%;
    margin-left: 2px;
    border-right: 1px solid #428bca; }
.vpm-portal .ui-select-bootstrap .ui-select-choices-row > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap; }
.vpm-portal .ui-select-bootstrap .ui-select-choices-row > a:hover, .vpm-portal .ui-select-bootstrap .ui-select-choices-row > a:focus {
    text-decoration: none;
    color: #262626;
    background-color: #f5f5f5; }
.vpm-portal .ui-select-bootstrap .ui-select-choices-row.active > a {
    color: #fff;
    text-decoration: none;
    outline: 0;
    background-color: #428bca; }
.vpm-portal .ui-select-bootstrap .ui-select-choices-row.disabled > a,
.vpm-portal .ui-select-bootstrap .ui-select-choices-row.active.disabled > a {
    color: #777;
    cursor: not-allowed;
    background-color: #fff; }
.vpm-portal .ui-select-match.ng-hide-add,
.vpm-portal .ui-select-search.ng-hide-add {
    display: none !important; }
.vpm-portal .ui-select-bootstrap.ng-dirty.ng-invalid > button.btn.ui-select-match {
    border-color: #D44950; }
.vpm-portal .ui-select-container[theme="bootstrap"].direction-up .ui-select-dropdown {
    box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.25); }

.listitem .flowplayer .fp-volume,
.highlight-responses .flowplayer .fp-volume,
#showreel-video .fp-volume {
    display: none; }

.flowplayer .fp-color {
    background-color: var(--accent, #2d91e6); }

/* ----- Whitelabel for new video player ----- */
/*
    This needs to be moved to NG2 when the new white label is done.
*/
.plyr--full-ui input[type=range] {
    color: var(--brand, #341C4C); }

.plyr__control--overlaid {
    background: rgba(var(--brand, #341C4C), 0.8); }

.plyr--video .plyr__control.plyr__tab-focus,
.plyr--video .plyr__control:hover,
.plyr--video .plyr__control[aria-expanded=true] {
    background: var(--brand, #341C4C); }

.plyr__control.plyr__tab-focus {
    box-shadow: 0 0 0 5px rgba(var(--brand, #341C4C), 0.5); }

.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before {
    background: var(--brand, #341C4C); }

#loading-bar,
#loading-bar-spinner {
    pointer-events: none;
    -webkit-pointer-events: none;
    transition: 350ms linear all; }

#loading-bar-spinner.ng-enter,
#loading-bar-spinner.ng-leave.ng-leave-active,
#loading-bar.ng-enter,
#loading-bar.ng-leave.ng-leave-active {
    opacity: 0; }

#loading-bar-spinner.ng-enter.ng-enter-active,
#loading-bar-spinner.ng-leave,
#loading-bar.ng-enter.ng-enter-active,
#loading-bar.ng-leave {
    opacity: 1; }

#loading-bar .bar {
    transition: width 350ms;
    background: #29d;
    position: fixed;
    z-index: 10002;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    border-bottom-right-radius: 1px;
    border-top-right-radius: 1px; }

#loading-bar .peg {
    position: absolute;
    width: 70px;
    right: 0;
    top: 0;
    height: 2px;
    opacity: .45;
    -ms-box-shadow: #29d 1px 0 6px 1px;
    box-shadow: #29d 1px 0 6px 1px;
    border-radius: 100%; }

#loading-bar-spinner {
    display: block;
    position: fixed;
    z-index: 10002;
    top: 10px;
    left: 10px; }

#loading-bar-spinner .spinner-icon {
    width: 14px;
    height: 14px;
    border: 2px solid transparent;
    border-top-color: #29d;
    border-left-color: #29d;
    border-radius: 50%;
    -webkit-animation: loading-bar-spinner 400ms linear infinite;
    animation: loading-bar-spinner 400ms linear infinite; }

@-webkit-keyframes loading-bar-spinner {
    0% {
        transform: rotate(0); }
    100% {
        transform: rotate(360deg); } }

@keyframes loading-bar-spinner {
    0% {
        transform: rotate(0); }
    100% {
        transform: rotate(360deg); } }

/*!
 * Toastr
 * Version 2.0.1
 * Copyright 2012 John Papa and Hans Fjallemark.
 * All Rights Reserved.
 * Use, reproduction, distribution, and modification of this code is subject to the terms and
 * conditions of the MIT license, available at http://www.opensource.org/licenses/mit-license.php
 *
 * Author: John Papa and Hans Fjallemark
 * Project: https://github.com/CodeSeven/toastr
 */
.toast-title {
    font-weight: 500;
    font-size: 15px; }

.toast-message {
    -ms-word-wrap: break-word;
    word-wrap: break-word; }

.toast-message a,
.toast-message label {
    color: #fff; }

.toast-message a:hover {
    color: #ccc;
    text-decoration: none; }

.toast-close-button {
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: 20px;
    font-weight: 400;
    color: #fff;
    -webkit-text-shadow: 0 1px 0 #fff;
    text-shadow: 0 1px 0 #fff;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80); }

.toast-close-button:focus,
.toast-close-button:hover {
    text-decoration: none;
    cursor: pointer;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
    filter: alpha(opacity=40); }

button.toast-close-button {
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; }

.toast-top-full-width {
    top: 0;
    right: 0;
    width: 100%; }

.toast-bottom-full-width {
    bottom: 0;
    right: 0;
    width: 100%; }

.toast-top-left {
    top: 12px;
    left: 12px; }

.toast-top-center {
    top: 12px; }

.toast-top-right {
    top: 12px;
    right: 12px; }

.toast-bottom-right {
    right: 12px;
    bottom: 12px; }

.toast-bottom-center {
    bottom: 12px; }

.toast-bottom-left {
    bottom: 12px;
    left: 12px; }

.toast-center {
    top: 45%; }

#toast-container {
    position: fixed;
    z-index: 999999; }

#toast-container.toast-bottom-center,
#toast-container.toast-center,
#toast-container.toast-top-center {
    width: 100%;
    pointer-events: none; }

#toast-container.toast-bottom-center > div,
#toast-container.toast-center > div,
#toast-container.toast-top-center > div {
    margin: auto;
    pointer-events: auto; }

#toast-container.toast-bottom-center > button,
#toast-container.toast-center > button,
#toast-container.toast-top-cente > button {
    pointer-events: auto; }

#toast-container * {
    box-sizing: border-box; }

#toast-container > div {
    margin: 0 0 6px;
    font-size: 14px;
    font-weight: 400;
    padding: 15px 15px 15px 15px;
    width: 400px;
    border-radius: 3px;
    background-position: 15px center;
    background-repeat: no-repeat;
    box-shadow: rgba(45, 45, 45, 0.05) 0px 2px 2px, rgba(49, 49, 49, 0.05) 0px 4px 4px, rgba(42, 42, 42, 0.05) 0px 8px 8px, rgba(32, 32, 32, 0.05) 0px 16px 16px, rgba(35, 35, 35, 0.05) 0px 64px 64px;
    color: #fff;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80); }

#toast-container.toast-bottom-full-width > div,
#toast-container.toast-top-full-width > div {
    width: 96%;
    margin: auto; }

.toast {
    background-color: #030303; }

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

.toast-error {
    background-color: #DE2E5D; }

.toast-info,
.toast-wait {
    background-color: #2f96b4; }

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

@media all and (max-width: 240px) {
    #toast-container > div {
        padding: 8px 8px 8px 50px;
        width: 11em; }
    #toast-container .toast-close-button {
        right: -.2em;
        top: -.2em; } }

@media all and (min-width: 241px) and (max-width: 480px) {
    #toast-container > div {
        padding: 8px 8px 8px 50px;
        width: 18em; }
    #toast-container .toast-close-button {
        right: -.2em;
        top: -.2em; } }

@media all and (min-width: 481px) and (max-width: 768px) {
    #toast-container > div {
        padding: 15px 15px 15px 50px;
        width: 25em; } }

:not(.no-enter)#toast-container > div.ng-enter,
:not(.no-leave)#toast-container > div.ng-leave {
    transition: 1000ms cubic-bezier(0.25, 0.25, 0.75, 0.75) all; }

:not(.no-enter)#toast-container > div.ng-enter.ng-enter-active,
:not(.no-leave)#toast-container > div.ng-leave {
    opacity: .8; }

:not(.no-enter)#toast-container > div.ng-enter,
:not(.no-leave)#toast-container > div.ng-leave.ng-leave-active {
    opacity: 0; }