@charset "utf-8";@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300&display=swap');

html {
    position: relative;
    min-height: 100%;
    overflow-y: scroll;
    scroll-behavior: smooth;
}
body {
    padding-right: 0 !important;
    background-color: #F6F8F9 !important;
}
.nav-item a svg {
    -webkit-filter: grayscale(100%) !important; /* Safari */
    filter: grayscale(100%) !important;
    opacity: 0.5 !important;
}
svg[class^="ux-"] {
    height: 16px;
    width: 16px;
    margin-top: -2px;
    display: inline-block;
    vertical-align: middle;
    fill: currentColor;
 }
.modal-title > svg[class^="ux-"] {
    height: 24px;
    width: 24px;
    margin-top: 0;
}
#tnb {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background: #315CFD !important;
}
.nav-link {
    padding: 12px;
}
.navico {
    width: 42px;
}
.navico > svg,
#icoAcnt > img {
    margin: -5px 5px -3px;
    width: 32px;
    height: 32px;
    opacity: 0.5;
}
.navbar-brand img {
    height: 36px;
}

.navbar-toggler {
    border: none;
}
.bg-gray {
    background-color: #eaeaea
}
/* dropdown carot rotate */
.dropdown-toggle[aria-expanded="true"]:after {
    transform: rotate(-180deg);
}
/*for the animation*/
.dropdown-toggle:after {
    transition: 0.5s;
}
#tnb .dropdown-menu.show {
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}
/* top nav << */

.tData th {
    font-weight: 600;
}
.tData {
    font-family: Arial, Helvetica, sans-serif;
}

.tData thead th,
.tData td {
    text-align: center;
}
.tData thead th:not(:first-child) {
    width: 10%
}

/* loading >> */
/*.spinload {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 3px solid #B9CDE5;
    border-left-color: #c00;
    background: transparent;
    animation: spin 1s linear infinite;
}
@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}*/
/* loading << */

.progrBar {
    background-color: #ddd;
    border: 1px solid #fff;
    display: inline-block;
    text-align: left;
    height: 13px;
    width: 102px;
}
.progrBarRd {
    background-color: #c00;
    display: block;
    height: 100%
}
.progrBarGr {
    background-color: #ccc;
    display: block;
    height: 100%
}

/* hamburger menu >> */
/* @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers */
#mm {
    padding: 6px;
    display: inline-block;
    cursor: pointer;
    transition-property: opacity, filter;
    transition-duration: 0.15s;
    transition-timing-function: linear;
    border: 0;
    margin: 0;
    overflow: visible;
    opacity:  0.5;
    color: #fff
}

#mm:hover,
#mm.opn:hover {
    opacity: 1;
}

#mm.opn #mmi,
#mm.opn #mmi::before,
#mm.opn #mmi::after {
    background-color: #fff;
}

#mmb {
    width: 28px;
    height: 28px;
    display: inline-block;
    position: relative;
}

#mmi {
    display: block;
    top: 50%;
    margin-top: -2px;
}

#mmi,
#mmi::before,
#mmi::after {
    width: 28px;
    height: 4px;
    background-color: #000;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease;
}

#mmi::before,
#mmi::after {
    content: "";
    display: block;
}

#mmi::before {
    top: -10px;
}

#mmi::after {
    bottom: -10px;
}

#mmi {
    transition-duration: 0.22s;
    transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

#mmi::before {
    transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
}

#mmi::after {
    transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

#mm.opn #mmi {
    transform: rotate(225deg);
    transition-delay: 0.12s;
    transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

#mm.opn #mmi::before {
    top: 0;
    opacity: 0;
    transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
}

#mm.opn #mmi::after {
    bottom: 0;
    transform: rotate(-90deg);
    transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
}

/* hamburger menu << */
.pgTtlBlk {
    margin: 2em 0 2em -1em;
}
.pgTtlBlk > span.fa-5x {
    width: 100px;
    height: 64px;
}
.breadcrumb > .breadcrumb-item:first-child a {
    width: 15px;
    display: inline-block;
}
.clr-primary {
    color: #CC0000 !important;
}
.clr-secondary {
    color: #B9CDE5 !important;
}
.clr-tertiary {
    color: #f2f2f2 !important;
}
h1, h2, h3, h4,
.h1, .h2, .h3, .h4 {
    font-family: 'Open Sans Condensed', sans-serif;
}
.icoclpsxpnd {
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
*[aria-expanded="true"] .icoclpsxpnd {
    -webkit-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
    -o-transform:rotate(90deg);
    transform: rotate(90deg);
}
#abc {
    font-size: 1.7em;
}
#abc a:hover {
    color: #c00 !important;
}
.blockquote {
    font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
    font-size: 1.05em;
    font-style: italic;
}
.blockquote .quote {
    quotes: "\201C""\201D""\2018""\2019";
    margin-top: -19px;
}
.blockquote .quote::before {
    font-family: georgia, times new roman, serif;
    content: open-quote;
    display: inline;
    height: 0;
    line-height: 0;
    left: -13px;
    position: relative;
    top: 50px;
    color: #ccc;
    font-size: 6em;
}
.blockquote .quote::after {
    content: close-quote;
    color: #fff;
    font-size: 1px;
}

#cstmrs {
    min-height: 205px;
}

[data-toggle="collapse"] .chev:before {
    content: "\f139";
}

[data-toggle="collapse"].collapsed .chev:before {
    content: "\f13a";
}

#dropAlert {
    top:-100px;
    z-index: 99999;
    overflow: hidden;
    position: fixed;
    margin-left: 45%;
    margin-right: auto;
    transition: top 1s ease; /*only animate the top and not all*/
    -webkit-transition: top 1s ease;
}

#dropAlert.in {
    top: 100px;
}

/*.navbar-toggler {
    padding-right: 0;
}*/
.navbar-toggler:focus {
    outline: 0;
}
.dupe {
    border: 1px solid #c00;
    background-color: #F2DEDE;
}
.ico-fw {
    min-width: 20px;
    min-height: 16px;
}
.ico-fw-lg {
    min-width: 26.666px;
    min-height: 24px;
}
.clckr {
    cursor: pointer;
    position: relative;
    opacity: .8;
}


.customLogo td {
    vertical-align: top;
}
.crdThmb,
.skeleton,
.images-msg,
.card input.image,
.results .card-thumbnail,
.customLogo .content input,
.card > .input-group-prepend
.customLogo .content.selected .btnSelect,
#susForm .questions .adjective,
#susForm .questions .promoter {
    display: none;
}
.card-image-preview {
    max-width: 500px;
    max-height: 500px;
}
.customLogo .content {
    position: relative;
    padding: 5px;
    min-height: 50px;
    margin-bottom: 10px;
    border: 1px solid #666;
    cursor: pointer;
    opacity: 0.3;
}
.clckr :hover,
.customLogo .content:hover,
.customLogo .selected {
    opacity: 1;
}
.customLogo .content:hover {
    border-color: #aaa;
}
.customLogo .content .buttons {
    /*display: none;*/
    position: absolute;
    top: 10px; right: 2px;
}
.customLogo .content:hover .buttons, {
    display: inline;
}
.customLogo .showLogoUpload {
    margin-top: 10px;
}
.participants-tab {
    min-height: 200px;
}
/*.curPointer,
div[role="tab"],*/
.curPointer,
*[data-toggle="collapse"] {
    cursor: pointer
}
/*.curHelp,
[data-toggle="tooltip"]:not(.btn) {
    cursor: help
}*/
.curHelp {
    cursor: help
}
#sticky, #tNumScroll {
    overflow-x: auto;
    overflow-y: hidden;
}
#tNumScroll {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd
}
.tNum {
    border-left: none;
    border-right: none
}
.w120 {
    width: 120px
}
.w-n-ico {
    width: calc(100% - 30px);
}
#areaWidth, #tNumScroll {
    width: calc(100% + 1px);
}
#sticky, #stickyScroll {
    height: 20px
}
#sticky.stick {
    position: fixed;
    z-index: 999;
    top: -4px;
}
table.results th .column-width {
    max-width: 250px;
}
.container-fluid table.results th .column-width {
    max-width: 400px;
}
.column-width.col-w-md {
    width: 180px !important;
}
.column-width.col-w-sm {
    width: 100px !important;
}
.column-width.col-w-lg {
    min-width: 130px !important;
}
fieldset {
    background-color: #F5F5F5;
    border: 3px solid #ddd;
    color: #333333;
    margin-top: 20px;
    padding: 20px;
}
legend {
    font-size: 1em;
    margin: 0 20px 0 0;
    background-color: #999999;
    padding: 5px 10px;
    color: #FFFFFF;
    width: auto;
}

.include-adjective .adjective,
.include-promoter .promoter {
    display: list-item !important;
}
.sus-subject {
    display: inline-block;
    padding: 0 .1em;
    text-align: center;
    min-width: 5em;
    border-bottom: 1px dashed #333;
}
.sus-score-1 {
    background-color: #fe8886;
}
.sus-score-2 {
    background-color: #fcceaa;
}
.sus-score-3 {
    background-color: #f9e6ba;
}
.sus-score-4 {
    background-color: #cbe4b7;
}
.sus-score-5 {
    background-color: #97dcb5;
}

.opacity-7 {
    opacity: .7;
}
.opacity-5,
.participant-excluded svg {
    opacity: .5;
}

@-webkit-keyframes change-color {
    0%   { background-color: transparent }
    25%  { background-color: #ffc }
    50%  { background-color: #ffc }
    100% { background-color: transparent }
}

@-moz-keyframes change-color {
    0%   { background-color: transparent }
    25%  { background-color: #ffc }
    50%  { background-color: #ffc }
    100% { background-color: transparent }
}

@-o-keyframes change-color {
    0%   { background-color: transparent }
    25%  { background-color: #ffc }
    50%  { background-color: #ffc }
    100% { background-color: transparent }
}

@keyframes change-color {
    0%   { background-color: transparent }
    25%  { background-color: #ffc }
    50%  { background-color: #ffc }
    100% { background-color: transparent }
}
.highlight,
.cpyLnk:hover,
#susForm .questions.include-adjective .adjective, #susForm .questions.include-promoter .promoter {
    -webkit-animation: change-color 5s 1;  /* Safari 4+ */
    -moz-animation: change-color 5s 1;  /* Fx 5+ */
    -o-animation: change-color 5s 1;  /* Opera 12+ */
    animation: change-color 5s 1;  /* IE 10+ */
}
.images-enabled .card input.image,
.images-enabled .card-thumbnail,
.images-enabled .images-msg,
.ico-fw, .ico-fw-lg {
    display: inline-block;
}

.card-thumbnail img {
    max-width: 30px;
    max-height: 30px;
}
.images-enabled .crdThmb {
    display: flex;
}

/* wayfinder >> */
#wayfinder {
    line-height: 26px;
    margin-top: 20px;
    width: 100%;
    border: 1px solid #ddd;
    background: #f6f6f6 url(/i/btnBgr.gif) repeat-x center center;
}
#wayfinder span.wfstp {
    display: inline-block;
    text-align: center;
    font-weight: bold;
    color: #999;
    margin: 0
}
#wayfinder span.title {
    padding-right: 11px;
}
#wayfinder .wfstp:not(:last-child) {
    background: url(/i/wfStep.gif) no-repeat center right;
}
#wayfinder span.wfstp.curStep {
    background: #cc0000 url(/i/wfStep.gif) no-repeat center right;
}
#wayfinder span.curStep span.title {
    line-height: 26px;
    color: #fff;
}
#wayfinder span.wfstp.prevStep {
    background: url(/i/wfStepDone.gif) no-repeat center right;
}
#wayfinder span.wfstp:last-child {
    background-image: none;
}
#wayfinder span.ui-icon-check {
    margin-bottom: 4px;
}
#wayfinder span.curStep ~ span {
    color: #ccc;
}
/* wayfinder << */

.mrgIco {
    opacity:.8;
    position: relative;
    margin: -4px -5px 2px -5px;
    border-bottom: 1px solid #fff;
}
.mrgIco:hover {
    opacity: 1;
    color: #000;
    cursor: pointer;
}
.mrgTxt {
    font-size: xx-small;
    font-weight: normal;
}
.bgrY {
    background-image: url(/i/bg_semiYELLOW.gif)
}
.brdRdTop4 {
    border-top: 4px solid #007BFF !important
}
.brdGrTop4 {
    border-top: 4px solid #FFC107 !important
}
.text-hover {
    opacity: .7;
}
/* datepicker >> */
.datepicker .switch,
.datepicker .prev,
.datepicker .next {
    text-align: center;
}
.datepicker .prev,
.datepicker .next {
    font-size: 1.5em;
}
.datepicker {
    padding: 20px;
}
.datepicker table {
    margin: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.datepicker td,
.datepicker th {
    text-align: center;
    width: 30px;
    height: 30px;
    border-radius: 4px;
    border: none
}
.datepicker .day {
    color: #333;
}
.datepicker .day.disabled {
    color: #ccc;
}
.datepicker .prev:hover,
.datepicker .next:hover,
.datepicker table tr td.day:hover,
.datepicker table tr td.focused {
    background: #eaeaea;
    cursor: pointer;
}
.datepicker table tr td.disabled,
.datepicker table tr td.disabled:hover {
    background: none;
    color: #ccc;
    cursor: default;
}
.datepicker .active.day,
.datepicker .day:active{
    background-color: #c00 !important;
    color: #fff !important;
}
/* datepicker << */

/* activity stats bar graph >> */
.activityGraph {
    height: 50px;
    margin-bottom: 24px
}
.activityGraph > div {
    position: relative;
    width: 3.33%;
    height: 100%;
    float: left;
    text-align:center;
    background-color: #f5f5f5;
    border-left: 2px solid #fff;
    border-bottom: 1px solid #eaeaea
}
.activityGraph > div > span {
    color: #ccc;
    font-size: 10px;
    position: relative;
    white-space: nowrap;
    margin: 0 -2px;
    bottom: -52px
}
.activityGraph > div:first-child {
    border-left: 0;
}
.activityGraph > div:hover {
    background-color: #eaeaea
}
.activityGraph > div:hover span {
    color: #c00
}
.activityGraph > div > div {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0
}
.activityGraph > div > div:nth-child(1) {
    background-color: #c00;
    z-index: 3
}
.activityGraph > div > div:nth-child(2) {
    background-color: #b9cde5;
    z-index: 2
}
.narrowCol .activityGraph div:nth-child(even) span {
    visibility: hidden;
}

/* ordered lists with decimals >> */
.decimals ol {
    list-style-type: none;
    counter-reset: item;
    margin: 0;
    padding: 0;
}

.decimals li {
    display: table;
    counter-increment: item;
    margin-bottom: 0.6em;
}

.decimals li:before {
    content: counters(item, ".") ". ";
    display: table-cell;
    padding-right: 0.6em;
}

.decimals li li {
    margin: 0;
}

.decimals li li:before {
    content: counters(item, ".") " ";
}
/* ordered lists with decimals << */

/* activity stats bar graph << */
.ttimg .tooltip-inner.image {
    max-width: 100%;
}
.tooltip.ttimg.show,
.text-hover:hover,
#icoAcnt > img {
    opacity: 1;
}
.tooltip.ttimg img {
    margin: 4px 0;
    background-color: #333;
    max-width: 500px;
    max-height: 500px;
}
.tooltip > .tooltip-inner {
    text-align: left;
}
/* graps and charts >> */
.dendrogram-chart .link {
    fill: none;
    stroke: #888;
    stroke-width: 1px
}
.dendrogram-chart rect.even {
    fill: #fafafa
}
.dendrogram-chart rect.odd {
    fill: #eaeaea
}
.dendrogram-chart #axis {
    stroke: #c55;
    stroke-width: 1px
}
.mds-chart .node circle {
    fill: #eee;
    stroke: #555;
    stroke-width: 1.5px
}
.mds-chart .node.hover circle {
    fill: #39f;
    stroke: #39f;
}
.svg-chart .x-grid, .svg-chart .y-grid {
    stroke: #aaa;
    stroke-dasharray: 1, 2;
    stroke-width: 1px
}
.svg-chart .x-main, .svg-chart .y-main {
    stroke: #555;
    stroke-width: 0.75px;
    stroke-dasharray: none;
}
.svg-chart .outline rect {
    display: none;
}
.svg-chart .node.hover .outline rect, .svg-chart .node:hover .outline rect {
    display: block;
    fill: #333;
}
.svg-chart .node.hover .outline text, .svg-chart .node:hover .outline text {
    display: block;
    fill: #fff;
}
.pseudo {
    position: relative
}
.dendrogram-chart .axis, .dendrogram-chart #mouse-axis {
    stroke: #aaa;
    stroke-width: 1px
}
.radar-chart .spokes {
    stroke: #555;
    stroke-width: 1px;
}
.radar-chart .graph {
    fill: #39f;
    stroke: #7bf;
    stroke-width: 1px;
    opacity: 0.7;
}
.radar-chart .grid {
    fill: none;
    stroke: #777;
    stroke-width: 1px;
    stroke-dasharray: 1, 2;
}
.chart-harvey-balls circle {
    fill: none;
    stroke: #ccc;
    stroke-width: 1px;
}
.chart-harvey-balls .arc {
    fill: #39f;
    stroke: #39f;
}
.chart-harvey-balls .not-available {
    fill: #aaa;
}
.taskpriority-chart .node circle, .taskpriority-chart .info-box circle {
    fill: #eee;
    stroke: #555;
    stroke-width: 1.5px
}
.taskpriority-chart .node .sub-node {
    display: none;
}
.taskpriority-chart .node.hover circle, .taskpriority-chart .info-box .hover circle {
    fill: #39f;
    stroke: #39f;
}
.taskpriority-chart .node.hover .sub-node, .taskpriority-chart .node.selected .sub-node {
    display: block;
}
.taskpriority-chart .axis-label {
    font-size: 14px;
    text-anchor: middle;
    fill: #888;
    color: #888;
    font-weight: 700;
    letter-spacing: 3px;
}
.svg-chart .info-box rect {
    fill: #fafafa;
    stroke: black;
    stroke-width: .5px;
}
.svg-chart .info-box .items .item {
    opacity: 0;
}
.node text {
    font-size: 1em;
}
.node:hover  text {
    fill: #666;
    opacity: .7;
    font-weight: normal;

}
/*.tree-node.without-label input, .task.without-label input, .task.without-solution input {
    border: 1px solid #c00;
}*/
.tree li {
    list-style:none;
}
.limb, .afterCrd, .pickCrd {
    max-width: 280px;
    display: inline-block;
    width: 100%;
    vertical-align:middle;
}
.afterCrd, .pickCrd {
    background-color: #eaeaea;
    border: 3px solid #999;
    font-weight: bold;
    text-shadow: 1px 1px 0px #ffffff;
    letter-spacing: 1px;
    display: none;
    margin: -1px 10px;
    padding: 3px;
    max-width: 80px;
    color: #666
}
.afterCrd svg, .pickCrd svg {
    position: relative;
    background-color: #fff;
    border: 2px solid #fff;
    -moz-border-radius: 50%;
    border-radius: 50%;
    margin-right: -9px;
    left: -15px
}
.pickCrd  {
    border-color: #66BB64;
    color: #000
}

/* circle graph >>> */
.flex-wrapper {
    display: flex;
    flex-flow: row nowrap;
}

.single-chart {
    width: 33%;
    justify-content: space-around ;
}
.circular-chart {
    display: block;
    margin: 10px;
    max-width: 80%;
    max-height: 250px;
}
.circle-bg {
    fill: none;
    stroke: #eee;
    stroke-width: 3.8;
}
.circle {
    fill: none;
    stroke-width: 2.8;
    stroke-linecap: round;
    animation: progress 1s ease-out forwards;
}

@keyframes progress {
    0% {
        stroke-dasharray: 0 100;
    }
}
.circular-chart.red .circle {
    stroke: #c00;
}
.circular-chart.orange .circle {
    stroke: #ff9f00;
}
.circular-chart.green .circle {
    stroke: #4CC790;
}
.circular-chart.blue .circle {
    stroke: #3c9ee5;
}
.percentage {
    fill: #666;
    font-family: sans-serif;
    font-size: 0.5em;
    text-anchor: middle;
    width: 90%
}
/* circle graph <<< */
/* graps and charts << */

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
    .border-left.border-lg {
        border-style: none !important;
    }
    #abc {
        font-size: 1em;
    }
    .navbar-brand img {
        height: 34px;
    }
    #tnb .nav-item {
        height: inherit !important;
    }
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    #footer,
    #abc {
        font-size: .6em;
    }
    .border-left.border-lg {
        border-style: none !important;
    }
    .pgTtl {
        font-size: 2rem;
    }
    .stats-number {
        font-size: 1.5rem;
    }
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    #footer,
    .pgTtlBlk,
    #abc {
        font-size: .8em;
    }
    .border-left.border-lg {
        border-style: none !important;
    }
    .hp-private {
        border-left: 4px solid #c00
    }
    .hp-public {
        border-left: 4px solid #449D44
    }
    .display-1 {
        font-size: 5.9vw;
    }
    .display-2 {
        font-size: 3.0vh;
    }
    #tab-test-details .card-body .col-md-3 {
        padding-left: 5px;
    }
    #tab-test-details .card-body .col-md-9 {
        margin-left: 31px;
        padding-right: 5px;
    }
    .w-n-ico {
        width: calc(100% - 57px);
    }
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
    #top-nav.navbar-collapse {
        margin-top: -1px;
        box-shadow: rgba(0, 0, 0, 0.15) 0px 1rem .8rem;
        border: 1px solid #c1c1c1;
        border-top: 0;
    }
    /*#top-nav-bar,*/
    /*.navbar-toggler {*/
    /*    height: 40px;*/
    /*}*/
    .navbar-brand img {
        height: 32px;
    }
    .jumbotron h1 {

    }
}

/* Large devices (desktops, less than 1200px) */
/*@media (max-width: 1199.98px) {*/

/*}*/

/* Extra large devices (large desktops) */
/* No media query since the extra-large breakpoint has no upper bound on its width */


/* CUSTOMER LOGOS >> */
.logbox {
    width: 152px;
    height: 152px;
    float: left;
    border: 1px solid #eaeaea;
    margin: 0 7.66px 7.66px 0;
}
.logbox .cl,
.grayscale {
    -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    opacity: 0.5;
}
.logbox:hover {
    border: 1px solid #999;
}
.logbox:hover .cl,
.grayscale:hover {
    -webkit-filter: grayscale(1%); /* Safari 6.0 - 9.0 */
    filter: grayscale(1%);
    opacity: 1;
}
.sus-box {
    color: #ccc;
    text-align: center;
    border: 2px solid #333;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 26px;
    height: 30px;
    width: 30px;
}
.cl { background: url(/i/logos/cust_logos.png) no-repeat; margin: 0 auto }
.custLogo_ABT { width: 120px; height: 30px; background-position: 0 -43px; }
.custLogo_ACT { width: 120px; height: 61px; background-position: 0 -286px; }
.custLogo_ALH { width: 75px; height: 75px; background-position: -519px -60px; }
.custLogo_ALL { width: 120px; height: 36px; background-position: 0 -249px; }
.custLogo_AMS { width: 68px; height: 72px; background-position: -121px 0; }
.custLogo_AVO { width: 120px; height: 30px; background-position: 0 -533px; }
.custLogo_BA { width: 110px; height: 47px; background-position: -212px -588px; }
.custLogo_BCA { width: 80px; height: 46px; background-position: -515px -289px; }
.custLogo_BCC { width: 59px; height: 50px; background-position: -263px -537px; }
.custLogo_BMC { width: 120px; height: 50px; background-position: 0 -158px; }
.custLogo_CAR { width: 110px; height: 49px; background-position: -373px -411px; }
.custLogo_CA { width: 90px; height: 68px; background-position: -242px -101px; }
.custLogo_CBS { width: 120px; height: 23px; background-position: 0 -438px; }
.custLogo_CCH { width: 127px; height: 44px; background-position: -387px -191px; }
.custLogo_CDW { width: 85px; height: 79px; background-position: -242px -246px; }
.custLogo_CSA { width: 90px; height: 90px; background-position: -121px -407px; }
.custLogo_CUL { width: 74px; height: 84px; background-position: -333px -83px; }
.custLogo_DNA { width: 120px; height: 29px; background-position: -121px -170px; }
.custLogo_DPL { width: 100px; height: 65px; background-position: -414px -236px; }
.custLogo_EXP { width: 120px; height: 27px; background-position: -121px -379px; }
.custLogo_FP { width: 100px; height: 33px; background-position: -414px -302px; }
.custLogo_GE { width: 50px; height: 50px; background-position: -212px -407px; }
.custLogo_HIT { width: 120px; height: 26px; background-position: -121px -124px; }
.custLogo_HP { width: 50px; height: 50px; background-position: -212px -537px; }
.custLogo_HUR { width: 90px; height: 50px; background-position: -121px -73px; }
.custLogo_HU { width: 110px; height: 72px; background-position: -408px -83px; }
.custLogo_IEC { width: 48px; height: 66px; background-position: -71px -462px; }
.custLogo_IMF { width: 75px; height: 76px; background-position: -519px -136px; }
.custLogo_IND { width: 120px; height: 40px; background-position: -212px -60px; }
.custLogo_INT { width: 120px; height: 42px; background-position: 0 0; }
.custLogo_ISU { width: 120px; height: 39px; background-position: 0 -209px; }
.custLogo_ITL { width: 90px; height: 59px; background-position: -498px 0; }
.custLogo_JNJ { width: 80px; height: 78px; background-position: -515px -556px; }
.custLogo_LS { width: 120px; height: 49px; background-position: 0 -108px; }
.custLogo_MAC { width: 120px; height: 33px; background-position: 0 -74px; }
.custLogo_MCO { width: 120px; height: 42px; background-position: -394px -368px; }
.custLogo_MIN { width: 90px; height: 67px; background-position: -121px -498px; }
.custLogo_MQ { width: 82px; height: 82px; background-position: -334px 0; }
.custLogo_MRU { width: 110px; height: 72px; background-position: 0 -564px; }
.custLogo_MS { width: 120px; height: 26px; background-position: -121px -259px; }
.custLogo_NLM { width: 103px; height: 40px; background-position: -323px -504px; }
.custLogo_NPS { width: 69px; height: 90px; background-position: -434px -461px; }
.custLogo_NY { width: 109px; height: 66px; background-position: -263px -389px; }
.custLogo_ORA { width: 110px; height: 31px; background-position: -394px -336px; }
.custLogo_P12 { width: 61px; height: 75px; background-position: -242px -170px; }
.custLogo_PEN { width: 120px; height: 58px; background-position: -121px -200px; }
.custLogo_PRI { width: 92px; height: 59px; background-position: -241px 0; }
.custLogo_QL { width: 120px; height: 39px; background-position: -121px -286px; }
.custLogo_RUL { width: 110px; height: 56px; background-position: -323px -545px; }
.custLogo_SEA { width: 70px; height: 70px; background-position: 0 -462px; }
.custLogo_SEO { width: 80px; height: 80px; background-position: -515px -336px; }
.custLogo_SF { width: 100px; height: 70px; background-position: -111px -566px; }
.custLogo_SSB { width: 110px; height: 32px; background-position: -323px -602px; }
.custLogo_THD { width: 75px; height: 75px; background-position: -515px -213px; }
.custLogo_TMR { width: 85px; height: 85px; background-position: -328px -240px; }
.custLogo_TNS { width: 60px; height: 60px; background-position: -333px -326px; }
.custLogo_TWT { width: 110px; height: 37px; background-position: -484px -417px; }
.custLogo_UAB { width: 110px; height: 42px; background-position: -323px -461px; }
.custLogo_UEG { width: 110px; height: 78px; background-position: -212px -458px; }
.custLogo_UK { width: 80px; height: 82px; background-position: -417px 0; }
.custLogo_UL { width: 50px; height: 54px; background-position: -190px 0; }
.custLogo_UNH { width: 120px; height: 52px; background-position: -121px -326px; }
.custLogo_UOM { width: 90px; height: 100px; background-position: -504px -455px; }
.custLogo_UOT { width: 120px; height: 89px; background-position: 0 -348px; }
.custLogo_USD { width: 90px; height: 62px; background-position: -242px -326px; }
.custLogo_VIS { width: 110px; height: 34px; background-position: -408px -156px; }
.custLogo_VMW { width: 120px; height: 18px; background-position: -121px -151px; }
.custLogo_VOL { width: 80px; height: 80px; background-position: -434px -556px; }
.custLogo_WEX { width: 82px; height: 69px; background-position: -304px -170px; }
/* CUSTOMER LOGOS << */

.logoSprites { background: url(/i/logoSprites.png) no-repeat; }
.selectCardSort { width: 208px; height: 145px; background-position: -241px 0; }
.selectHeuristicEvaluation { width: 224px; height: 121px; background-position: 0 -332px; }
.selectIteRater { width: 208px; height: 121px; background-position: -241px -146px; }
.selectPrioritizationMatrix { width: 240px; height: 165px; background-position: 0 0; }
.selectSUSplus { width: 214px; height: 101px; background-position: -235px -346px; }
.selectTaskPriority { width: 240px; height: 165px; background-position: 0 -166px; }

/* Social buttons >> */
.jssocials-share {
    display: inline-block;
    vertical-align: top;
    margin: 0 .3em;
}
.jssocials-share:first-child {
    margin-left: 0;
}
.jssocials-share:last-child {
    margin-right: 0;
}
.jssocials-share-logo {
    width: 1em;
    vertical-align: middle;
    font-size: 1.5em;
}
img.jssocials-share-logo {
    width: auto;
    height: 1em;
}
.jssocials-share-link {
    display: inline-block;
    text-align: center;
    text-decoration: none;
    line-height: 1;
    border-radius:4px;
}
.jssocials-share-link.jssocials-share-link-count {
    padding-top: .2em;
}
.jssocials-share-link.jssocials-share-link-count .jssocials-share-count {
    display: block;
    font-size: .6em;
    margin: 0 -.5em -.8em -.5em;
}
.jssocials-share-link.jssocials-share-no-count {
    padding-top: .5em;
}
.jssocials-share-link.jssocials-share-no-count .jssocials-share-count {
    height: 1em;
}
.jssocials-share-label {
    padding-left: 0.3em;
    vertical-align: middle;
}
.jssocials-share-count-box {
    display: inline-block;
    height: 1.5em;
    padding: 0 0.3em;
    line-height: 1;
    vertical-align: middle;
    cursor: default;
}
.jssocials-share-count-box.jssocials-share-no-count {
    display: none;
}
.jssocials-share-count {
    line-height: 1.5em;
    vertical-align: middle;
}
.jssocials-share-twitter .jssocials-share-link {
    background: #00aced !important;;
}
.jssocials-share-twitter .jssocials-share-link:hover {
    background: #0087ba !important;;
}
.jssocials-share-facebook .jssocials-share-link {
    background: #3b5998 !important;
}
.jssocials-share-facebook .jssocials-share-link:hover {
    background: #2d4373 !important;
}
.jssocials-share-linkedin .jssocials-share-link {
    background: #007bb6 !important;
}
.jssocials-share-linkedin .jssocials-share-link:hover {
    background: #005983 !important;
}
.jssocials-share-pinterest .jssocials-share-link {
    background: #cb2027 !important;
}
.jssocials-share-pinterest .jssocials-share-link:hover {
    background: #9f191f !important;
}
.jssocials-share-email .jssocials-share-link {
    background: #3490F3 !important;
}
.jssocials-share-email .jssocials-share-link:hover {
    background: #0e76e6 !important;
}
.jssocials-share-link {
    padding: .5em .6em;
    color: #fff;
    -webkit-transition: background 200ms ease-in-out, border-color 200ms ease-in-out;
    transition: background 200ms ease-in-out, border-color 200ms ease-in-out; }
.jssocials-share-link:hover, .jssocials-share-link:focus, .jssocials-share-link:active {
    color: #fff; }
/* Social buttons << */

@keyframes shadow-pulse
{
    0% {
        box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
    }
    100% {
        box-shadow: 0 0 0 35px rgba(0, 0, 0, 0);
    }
}

.single-pulse {
    animation: shadow-pulse 1s 1;
}

@media print {
    .card {
       border: none;
    }
    main,
    .container,
    .card-body {
        padding: 0;
    }
}

/**
Tree Testing Results
 */
.tree-testing-results__header {
    font-family: inherit;
    font-size: 1.15rem;
    font-weight: bold;
    text-transform: uppercase;
}

.ttr-task__selections .svg-inline--fa,
.tree-testing-results__response-overview .svg-inline--fa {
    margin-right: 5px;
}

.ttr-task__selections .fa-check-circle,
.tree-testing-results__response-overview .fa-check-circle {
    color: #70C394
}

.ttr-task__selections .fa-times-circle,
.tree-testing-results__response-overview .fa-times-circle {
    color: #BB271A
}

.ttr-task__selections .fa-arrow-circle-right,
.tree-testing-results__response-overview .fa-arrow-circle-right {
    color: #B3B0AD
}

.ttr-task__time-summary {
    margin-left: auto;
    width: auto;
}

.ttr-task__time-summary td,
.tree-testing-results__response-overview td {
    padding: 5px 25px 0 0;
}

.ttr-task__time-summary td:first-child {
    padding-right: 0.3rem;
}

.ttr-task__time-summary td:last-child {
    padding-right: 2px;
}

.ttr-task {
    padding-bottom: 1.5rem;
    padding-top: 2.5rem;
}

.ttr-task:last-child {
    border-bottom: 0 !important;
}

.ttr-task__task-heading {
    font-family: inherit;
    font-size: 1rem;
    font-weight: bold;
}

.ttr-bar-chart {
    display: flex;
}

.ttr-bar-chart__category {
    border: 1px solid #FFF;
    box-sizing: border-box;
    height: 2rem;
}

.ttr-bar-chart__category:first-child {
    border-bottom-left-radius: .2rem;
    border-top-left-radius: .2rem;
}

.ttr-bar-chart__category:last-child {
    border-bottom-right-radius: .2rem;
    border-top-right-radius: .2rem;
}

.ttr-bar-chart__category--correct {
    background-color: #70C394;
}

.ttr-bar-chart__category--incorrect {
    background-color: #BB271A;
}

.ttr-bar-chart__category--skipped {
    background-color: #B3B0AD;
}

#tree-testing-result__donut-chart {
    max-width: 336px;
}

#treeTaskForm .task + ul {
    margin-top: -1rem;
    margin-bottom: 2rem;
}

#treeTaskForm .tasks ol {
    counter-reset: task-counter;
}

#treeTaskForm .tasks ol > li:before {
    counter-increment: task-counter;
    content: "Task " counter(task-counter);
    font-weight: bold;
}

#tree-tasks {
    counter-reset: task-counter;
}

#tree-tasks .task:before {
    counter-increment: task-counter;
    content: "Task " counter(task-counter) ": ";
    font-weight: bold;
}

.tree-individual-results {
    max-width: 600px;
    table-layout: fixed;
}

.tree-individual-results td {
    padding: 2px 0;
}

.tree-individual-results td:first-child,
.tree-individual-results td:last-child {
    width: 1%;
    white-space: nowrap;
}

/**
History / Test List
 */
.scrollable-menu {
    height: auto;
    max-height: 300px;
    overflow-x: hidden;
}

.no-underline {
    text-decoration: none !important
}

.downtime-notice {
    background-color: rgb(236, 240, 254);
    border: 1px solid rgb(137, 162, 250);
    text-align: center;
    color: #464646;
    padding: 10px;
}