/******************
    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
*/


.logo-container > img {
  max-height: 60px;
}


/*** Tooltips! ***/

.tip 
{
  border-bottom: 1px dotted white;
  position: relative;
  cursor: help;
  text-decoration: underline;
  color: blue;
}
.tip span {
  display: none;
  color: white;
  text-align: center;
  z-index: 100;
  position: absolute;
  padding: .6em;
  padding-left: 1em;
  top: 1.5em;
  left: 2.4em;
  width: 50em;
  background-color: black;
  border: 1px solid white;
  border-radius: 0.5em;
}
.tip:hover span {
  display: inline-block;
}
.sg-question-set,
.sg-type-radio ul.sg-list-vertical li,
.sg-type-checkbox ul.sg-list-vertical li,
.sg-question-options,
.sg-type-radio-likert .sg-question-options,
.sg-type-table .sg-question-options,
.sg-instructions
{
  overflow: visible;
}







.dropdown-menu { /*makes the navigation menu (question-index) scrollable in browser*/
    height: 500px;
    overflow: auto;
}

/*dropdowns with filter*/
.dropbtn {
  background-color: #286090;
  color: white;
  padding: 5px;
  font-size: 16px;
  border: none;
  cursor: pointer;
    float: left;
    height: 33px;
}

.dropbtn:hover, .dropbtn:focus {
  background-color: #3e8e41;
}

.filterOpt {
  box-sizing: border-box;
  /*background-image: url('searchicon.png');
  background-position: 14px 12px;
  background-repeat: no-repeat;*/
  padding: 6px; /*6px 150px 6px 12px; 14px 20px 12px 45px;*/
  border: 1px solid #ccc;
  border-bottom: 1px solid #ddd;
  /*border-radius: 4px;*/
  float: left;
}

.filterOpt:focus {outline: 3px solid #ddd;}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f6f6f6;
  min-width: 130px;
  max-width: 400px;
  overflow: auto;
  border: 1px solid #ddd;
  z-index: 1;
  max-height: 300px;
  overflow-y: auto;
  overflow-x: hidden;     /* prevent horizontal scrollbar */
  text-align: left;
  margin-top: 34px;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {
  background-color: #ddd;
  cursor: pointer;
  }
  
.show {display: block;}



/*Apply FiBL-blue colour on all elements that use any blue colour*/
.progress-bar{
    background-color:#2F6C86;
}
.btn-primary {
  background-color: #2F6C86;
}
.btn-primary:hover {
  background-color: lightblue;
}

/*visually enhance/separate the question text  */

.question-text{
  font-weight: bold;
  /*font-size: medium;*/
} 

/* align table question-titles left */
.ls-answers tbody .answertext {
    text-align: left;
}

/* Align the array answer options (headers) on top
 * https://forums.limesurvey.org/forum/design-issues/120781-alignment-of-the-array-answer-options
 */
table.subquestion-list > thead > tr > th, 
table.subquestion-list > tbody > tr.headings > th {
  vertical-align: top !important;
  
  /*stick header on top of page when scrolling down*/
  position: sticky;
  position: -webkit-sticky;
  top: 50px;
  background-color: #f8f8f8;
  z-index: 1000;
}


/* Remove ugly blue colour on welcome page */
.text-primary {
  color: unset !important;
}