/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

.UnWRaP .navbar-default {
    background-color: #7a003c;
    border-color: transparent;
}

.UnWRaP .progress-bar,
.UnWRaP .bg-primary {
    background-color: #7a003c !important;
}

.UnWRaP .btn-primary {
    background-color: #7a003c;
    border-color: #7a003c;
}

.UnWRaP .btn-primary.active {
    background-color: #0d1318;
    border-color: #000000;
}

.UnWRaP a,
.UnWRaP a:hover,
.UnWRaP a:focus {
    color: #7a003c;
}

.UnWRaP a.upload,
.UnWRaP table.uploadedfiles tbody a.btn-primary,
.UnWRaP .surveys-list a,
.UnWRaP .surveys-list a:hover,
.UnWRaP .surveys-list a:focus {
    color: white;
}

.UnWRaP a.upload:hover,
.UnWRaP a.upload:focus,
.UnWRaP a.upload:visited,
.UnWRaP .question-text a,
.UnWRaP table.uploadedfiles tbody a.btn-primary:hover,
.UnWRaP table.uploadedfiles tbody a.btn-primary:focus,
.UnWRaP table.uploadedfiles tbody a.btn-primary:visited {
    color: lightyellow;
}

.UnWRaP table.uploadedfiles tbody td {
    color: #444;
}

.UnWRaP .ls-answers table.uploadedfiles tbody td {
    text-align: left;
}

.UnWRaP .survey-description,
.UnWRaP .survey-description:hover {
    color: #2c3e50 !important;
}

.UnWRaP .question-valid-container.text-info {
    color: #e0e9c1 !important;
}

.UnWRaP .ls-question-message.text-danger {
    color: lightyellow;
}

.UnWRaP .input-group-addon .fa-calendar {
    color: white;
}

.UnWRaP .ls-label-question {
    font-size: 18px;
}

/* Label alignment on multiple choice questions with comments */
.checkbox-text-item .checkbox-label {
    text-align:left
}

/* for questions to be shown as pop-up dialogs */

.UnWRaP .popup {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 200px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.UnWRaP .popup .answer-container {
    background-color: white;
}

/* try to fix mobile view disappearing logo */
.logo-container.hidden-xs {
    display: block !important;
}

/* Don't compress the logo image on mobile */
.UnWRaP .logo-container>img {
    height: auto;
    max-width: 100%;
}

/* Slider with emoticons, for multiple numerical inputs */

.smiley-slider7-question .slider .slider-handle {
	background-color: #FFFFFF !important;
}
 
.smiley-slider7-question .slider.slider-reset .slider-handle, 
.smiley-slider7-question .slider.slider-untouched .slider-handle {
	opacity: .5;
}
 
.smiley-slider7-question .slider-handle::before {
	font-family: FontAwesome;
	line-height: 24px;
	font-size: 28px;
	margin-left: -2px;
}
 
.smiley-slider7-question .slider-handle[aria-valuenow="1"]::before,
.smiley-slider7-question .slider-handle[aria-valuenow="2"]::before {
	content: '\f119';
	color: red;
}
 
.smiley-slider7-question .slider-handle[aria-valuenow="3"]::before,
.smiley-slider7-question .slider-handle[aria-valuenow="4"]::before,
.smiley-slider7-question .slider-handle[aria-valuenow="5"]::before {
	content: '\f11a';
	color: orange;
}
 
.smiley-slider7-question .slider-handle[aria-valuenow="6"]::before,
.smiley-slider7-question .slider-handle[aria-valuenow="7"]::before {
	content: '\f118';
	color: green;
}

/* Left-align array subquestions */
.UnWRaP .ls-answers tbody .answertext {
    text-align: left;
}

/* When applied to a question, it makes it take the whole screen width */
.UnWRaP .full-width {
    width: 150vw;
    position: relative;
    margin-left: -50vw;
    left: 50%;
}
    
/* Adjust paragraph and line spacing in welcome text */
.UnWRaP #welcome-container p {
    line-height: 1.5;
    margin-top: 1.3em;
    margin-bottom: 1.3em;
}

/* Hide first and last name fields in registration form */
body.UnWRaP div.register-form form div.form-group.row:nth-child(2),
body.UnWRaP div.register-form form div.form-group.row:nth-child(3) {
    display:none;
}

.UnWRaP .group-title {
    font-size: 34px;
}