/* WB styles Beginn */

#surveyListFooter{
    /* no footer Bereich in list  */ 
display: none !important;    
}


.WBTrainingTitle01{
    font-size: 140%;
    color: #51718c;
     text-align: center;
       
    margin-top: 1em;
    /* WB  */
    font-weight: 300;
    font-size: 100%; 
}



.group-name
{
    padding:30px 30px;
	border-top: 1px solid #95adc2;
	border-bottom: 1px solid #95adc2;
	text-align: center;
	font-size: 140%;
	color: #578538;
	margin: 100px 30px;
}


/* Checkbox element, when checked */

#loadbutton{
    /* wb */
     
}

#loadallbtnlink{
    font-size: 60%;
    
}

.load-survey-input{
    /* wb */
    /*width: 100%; */
      
}

p.load-error{
    color: red; 
    
}

.WB-Descr-01
{
    font-size: 80%;
	padding-top: 10px;

}

.questiontext{
    font-size: 120%;
    font-weight: 400;
    color: #16335e;
    
}


.answertext{
   /* geht nicht <!--
                 The label text is provided inside a div,
                 so final user can add paragraph, div, or whatever he wants in the subquestion text
                 This field is related to the input thanks to attribute aria-labelledby
            -->
            */ 
    vertical-align:top;    
    padding-left: 2em; 
    
}

.WBDescription01{
 display: block;
 
  /*background: #fff;*/
  background: #FCFCFC; 
  padding: 28px 24px;
  max-width: 80%;
  margin-left: 30px;
   margin-bottom: 30px;
    cursor:help; 
    /* ringbuch like */
    /* border-left: 5px solid lightgreen; */ 
    border-radius: 0px 6px 6px 0px;
    
    
   
    
 /*
 -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  margin-bottom: 20px;
  box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 2px 0px;
  border-left: 2px solid #95adc2;
  */ 
}

.WBInfoContainer01{
 /* Schulungstext-Container */ 
    /* margin-bottom: 15px; */
    /* WB text-align: center; */ 
    text-align: left;
        color: #2c5c85;
    margin-top: 2em;
    /* WB  */
    font-weight: 400;
    font-size: 100%; 
 
 
     display: block;
      background: #fff; 
      padding: 22px 30px;
      max-width: 100%;
      margin: 15px;
        cursor:help; 
       
        
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
      border-radius: 3px;
      margin-bottom: 20px;
      /*
       -webkit-box-shadow: 1px 2px 4px 2px rgba(75,77,75,0.47);
    -moz-box-shadow: 1px 2px 4px 2px rgba(75,77,75,0.47);
    box-shadow: 1px 2px 4px 2px rgba(75,77,75,0.47);
    */
  
}


/* WB styles Ende */


p {
    margin: 0 0 20px;
}

body
{
    font-family: 'Roboto', sans-serif;
    /* WB font-size: 14px; */
    font-size: 18px;
    font-weight: 400;
    line-height: 1.42857143;
      
    /* WB color: #9a9a9a; */
    /* WBbackground-color: #396276; */
     /* WB last background-color:#FFF; */ 
      /* WB color:#333333; */ 
    color: 22149e; 

/* CSS-Background Kunst */ 
/*
background: 
radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.15) 30%, rgba(255,255,255,.3) 32%, rgba(255,255,255,0) 33%) 0 0,
radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.1) 11%, rgba(255,255,255,.3) 13%, rgba(255,255,255,0) 14%) 0 0,
radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.2) 17%, rgba(255,255,255,.43) 19%, rgba(255,255,255,0) 20%) 0 110px,
radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.2) 11%, rgba(255,255,255,.4) 13%, rgba(255,255,255,0) 14%) -130px -170px,
radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.2) 11%, rgba(255,255,255,.4) 13%, rgba(255,255,255,0) 14%) 130px 370px,
radial-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.1) 11%, rgba(255,255,255,.2) 13%, rgba(255,255,255,0) 14%) 0 0,
linear-gradient(45deg, #6699ff 0%,   #e6f5ff 10%,  #e6f5ff 30%, #e6f2ff 40%, #ebf0fa 50%,  #e6f5ff 60%,  #e6f5ff 70%,  #e6f5ff 80%, #e6f0ff 90%, #f2f2f2 100%);
background-size: 470px 470px, 970px 970px, 410px 410px, 610px 610px, 530px 530px, 730px 730px, 100% 100%;
background-color: #840b2a;
*/ 

background-color:efefef;
background-image: linear-gradient(white 0.2px, transparent 0.2px),
linear-gradient(90deg, white 0.2px, transparent 0.2px),
linear-gradient(rgba(255,255,255,.3) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.3) 1px, transparent 1px);
background-size:30px 30px, 30px 30px, 10px 10px, 10px 10px;
background-position:-2px -2px, -2px -2px, -1px -1px, -1px -1px




    
}

div[id^="group-"]>div {
    background-color: #fff;
}

div[id^="group-"]>div.group-container {
 background-color: transparent;
}

/* Language changer general styles */
.language {}
.language-changer {
    background-color: #fff;
    padding: 1em;
    color: #333;
    margin-bottom: 1em;
}
.language-changer div div {
    width: 100%;
}
#langchanger-label {
    display: none;
}
select.languagechanger {
    width: auto;
    margin: 0 auto;
    margin-top: 20px;
}
select.languagechanger.form-control {
    color: #333;
}

/* Language changer hide additional button */
#changelangbtn {
  display: none;
}

.form-control  {
    border: 2px solid #ccc;
}

/* Top container */

#topContainer {
    width: 100%;
    padding: 1em;
    border-bottom: none;
    background: transparent;
    background-color: transparent;
}
#topContainer .container {
    background: #FFF;
}

/* Progress bar */
.progress {
    height: 21px;
    margin: 15px;
    background-color: #f0f0f0;
}
.progress-bar {
    background-color: #396276;
}
@media only screen and (max-width: 768px) {
  .progress {
    margin: 15px 30px;    
  }
}

#surveynametitle {
    font-size: 4em;
}

#surveydescription, #surveynametitle, #welcome-container h1 {
    color: #333;
    /* WB text-align: center; */ 
    text-align: center;
}

p.surveydescription {
    color: lightgray;
    margin: 15px 30px;
}


/* Question Group */
.group-name {
    /* WB  */
    
    
    
    /* WB  */
}




#surveydescription, .group-name {
    
    text-align: center;
    
    margin-top: 0;
    margin-bottom: 15px;
    font-style: normal;
    font-weight: 600;
    
    /* WB font-size: 22px;
    color: #396276; */ 
    color: #2c5c85;
    font-size: 150%;	   
    
}
.group-description {
    margin-bottom: 15px;
    /* WB text-align: center; */ 
    text-align: left;
        color: #2c5c85;
    margin-top: 2em;
    /* WB  */
    font-weight: 400;
    font-size: 100%; 
}

/* Question Group Padding Fix */
.groupcontainer {
  padding-left: 15px;
  padding-right: 15px;
}

#main-row, #welcome-container {
    background-color: transparent;
}

/* Navigator */
#navigator-container {
    padding-top: 1em;
    padding-bottom: 1em;
    /* background: #f8f8f8; */ 
    background: #f0f5f5; 
    /* insert wb, da breiter als der rest - testweise */
    width: 100% !important;
    border-radius: 0px 10px 0px 0px;
    
}
#navigator-container>div{}
.bottom-elements {
  background: #f8f8f8;
  /* border-top: 1px solid #cfcfcf; */
  /* insert wb, da breiter als der rest - testweise */
    width: 98% !important;
    border-radius: 0px 10px 0px 10px;
    border: 0.5px solid green;
    margin-bottom: 5%;
    margin-top: 5%;
    
    
    -webkit-box-shadow: 5px 5px 5px 0px rgba(196,196,196,1);
-moz-box-shadow: 5px 5px 5px 0px rgba(196,196,196,1);
box-shadow: 5px 5px 5px 0px rgba(196,196,196,1);
    
    
}

/* Button general */
a.btn {
  border-bottom: none;
  color: #444;
}

/* Button general */
.btn {
    word-wrap: break-word;
    font-style: normal;
    font-weight: 700;
    text-transform: uppercase;
}

/* Button default */
.btn-default {
  color: #444444;
  border: 1px solid #d3d3d3;
  background: #f5f5f5;
  background: -moz-linear-gradient(top, #f5f5f5 0%, #e1e1e1 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#e1e1e1));
  background: -webkit-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: -o-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: -ms-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: linear-gradient(to bottom, #f5f5f5 0%,#e1e1e1 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e1e1e1',GradientType=0 );
  padding: 0.8em 1.4em;
  margin: 0 5px;
}
.btn-default:focus,
.btn-default.focus {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}
.btn-default:hover {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}
.btn-default:active:hover,
.btn-default.active:hover,
.open > .dropdown-toggle.btn-default:hover,
.btn-default:active:focus,
.btn-default.active:focus,
.open > .dropdown-toggle.btn-default:focus,
.btn-default:active.focus,
.btn-default.active.focus,
.open > .dropdown-toggle.btn-default.focus {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}


/* Button primary */
.btn-primary {
  color: #444444;
  border: 1px solid #d3d3d3;
  background:  #cecece; /* #f5f5f5; */ 
  background: -moz-linear-gradient(top, #f5f5f5 0%, #e1e1e1 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#e1e1e1));
  background: -webkit-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: -o-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: -ms-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: linear-gradient(to bottom, #f5f5f5 0%,#e1e1e1 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e1e1e1',GradientType=0 );
  padding: 0.8em 1.4em;
  margin: 0 5px;
}
.btn-primary:focus,
.btn-primary.focus {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}
.btn-primary:hover {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}
#movenextbtn.btn-primary:hover,
#movenextbtn.btn-primary:focus,
#movenextbtn.btn-primary:active {
  
  /*  color: #444444; */
   /*background: #c7c7c7; */
     /*background:#b1c7d8;  */
  /*border-color: green; */
 /* like submitbutton: WB */
 
  color: #fff;
  background: #779a23;
  border-color: #779a23;
 
    
    
}

.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}
.btn-primary:active:hover,
.btn-primary.active:hover,
.open > .dropdown-toggle.btn-primary:hover,
.btn-primary:active:focus,
.btn-primary.active:focus,
.open > .dropdown-toggle.btn-primary:focus,
.btn-primary:active.focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary.focus {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}

/* Button Submit */
#movesubmitbtn.btn-primary, #movenextbtn.btn-primary {
  color: #fff;
  border: 1px solid #779a23;
  background: #7ca51a;
  background: -moz-linear-gradient(top, #97c42c 0%, #7ca51a 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#97c42c), color-stop(100%,#7ca51a));
  background: -webkit-linear-gradient(top, #97c42c 0%,#7ca51a 100%);
  background: -o-linear-gradient(top, #97c42c 0%,#7ca51a 100%);
  background: -ms-linear-gradient(top, #97c42c 0%,#7ca51a 100%);
  background: linear-gradient(to bottom, #97c42c 0%,#7ca51a 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#97c42c', endColorstr='#7ca51a',GradientType=0 );
    
    padding: 0.8em 1.4em;
      margin: 0 5px;  
    
  
}

#movesubmitbtn.btn-primary:hover,
#movesubmitbtn.btn-primary:focus,
#movesubmitbtn.btn-primary:active {
  color: #fff;
  background: #779a23;
  border-color: #779a23;
   
  
}

/* Button success */
.btn-success {
  color: #444444;
  border: 1px solid #d3d3d3;
  background: #f5f5f5;
  background: -moz-linear-gradient(top, #f5f5f5 0%, #e1e1e1 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#e1e1e1));
  background: -webkit-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: -o-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: -ms-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: linear-gradient(to bottom, #f5f5f5 0%,#e1e1e1 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e1e1e1',GradientType=0 );
  padding: 0.8em 1.4em;
  margin: 0 5px;
}
.btn-success:focus,
.btn-success.focus {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}
.btn-success:hover {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}
.btn-success:active:hover,
.btn-success.active:hover,
.open > .dropdown-toggle.btn-success:hover,
.btn-success:active:focus,
.btn-success.active:focus,
.open > .dropdown-toggle.btn-success:focus,
.btn-success:active.focus,
.btn-success.active.focus,
.open > .dropdown-toggle.btn-success.focus {
  color: #444444;
  background: #c7c7c7;
  border-color: #c7c7c7;
}
.btn-success:active,
.btn-success.active,
.open > .dropdown-toggle.btn-success {
  background-image: none;
}
.btn-success.disabled:hover,
.btn-success[disabled]:hover,
fieldset[disabled] .btn-success:hover,
.btn-success.disabled:focus,
.btn-success[disabled]:focus,
fieldset[disabled] .btn-success:focus,
.btn-success.disabled.focus,
.btn-success[disabled].focus,
fieldset[disabled] .btn-success.focus {
  background-color: #ccc;
  border-color: #ccc;
}
.btn-success .badge {
  color: #ccc;
  background-color: #ffffff;
}


#main-col {
    margin-top: 0em;
}

.row {
}

.col-centered{
    float: none;
    margin: 0 auto;
}

#loadallbtn{
    white-space: normal;
}


.label-col {
    min-width: 10%;
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}

li.responsive-content
{
    display: block;
    position: relative;
    float: left;
    width: 100%;
}

/* Don't wrap "No answer" for 10-point array */
.table-in-qanda-2 thead th {
    white-space: nowrap;
}

/* Completed Table */
@media only screen and (max-width: 768px) {
    table.completed-table,
    #tokenmessage {
      width: 90%;
      margin: 0 auto;
    }   
}


/**
* Slider
**/
.numeric-multi ul.slider.computed {
  width: 22em;
}

.numeric-multi ul.computed li label,.numeric-multi ul.slider.computed li label
  {
  padding-right: 0%;
}

.numeric-multi div.multinum-slider {
  width: auto;
  float: left;
  margin-top: 1.5em;
  margin-bottom: 0.2em;
}

/** UI Slider **/
.numeric-multi label.slider-label {
  display: table-cell;
  width: auto !important;
  padding: 0 1em 0.2em 0;
  margin-top: 1.3em;
  vertical-align: middle;
}
.numeric-multi .ui-slider-handle {
    top: -0.35em;
}
.ui-slider-1 {
  width: 200px;
  height: 9px;
  margin-bottom: 20px;
}
.ui-slider-2 {
  width: 200px;
  height: 23px;
  position: relative;
  background-image: url(../../images/slider-bg-2.png);
  background-repeat: no-repeat;
  background-position: center center;
}
.slider_callout {
  height: 20px;
  width: 100px;
  overflow: hidden;
  position: absolute;
  top: -20px;
  margin-left: -3px;
  color: #284a6e;
  font-size: 90%;
  font-weight: bold;
  text-align: left;
}
.slider_showmin {
  float: left;
  width: 50px;
  margin: 15px 0 0 -0.3em;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 0.7em;
  font-weight: normal;
  text-align: left;
}
.slider_showmax {
  float: right;
  width: 50px;
  margin: 15px -0.3em 0 0;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 0.7em;
  font-weight: normal;
  text-align: right;
}
.slider_lefttext {
  display: table-cell;
  padding-top: 1.5em;
  padding-right: 11px;
  padding-bottom: 3px;
  vertical-align: top;
  text-align: right;
  font-size: 0.9em;
}
.slider_righttext {
  display: table-cell;
  padding-top: 1.5em;
  padding-left: 11px;
  padding-bottom: 3px;
  vertical-align: top;
  font-size: 0.9em;
}
.withslider {
    margin-bottom: 30px;
}
.slider-handle {
    position: absolute;
    width: 20px;
    height: 20px;
    background-color: #7ca51a;
    background-image: -webkit-linear-gradient(top, #97c42c 0%, #7ca51a 100%);
    background-image: -o-linear-gradient(top, #97c42c 0%, #7ca51a 100%);
    background-image: linear-gradient(to bottom, #97c42c 0%, #7ca51a 100%);
    background-repeat: repeat-x;
    /* 2016-08-29 Marcel: validation fehler filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555', endColorstr='#222', GradientType=0);*/
    filter: none;
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
    border: 0px solid transparent;
}
.slider-selection {
  position: absolute;
  background-image: -webkit-linear-gradient(top, #eee 0%, #ccc 100%);
  background-image: -o-linear-gradient(top, #eee 0%, #ccc 100%);
  background-image: linear-gradient(to bottom, #eee 0%, #ccc 100%);
  background-repeat: repeat-x;
  /* 2016-08-29 Marcel: validation fehler  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eee', endColorstr='#ccc', GradientType=0); */
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 4px;
}
.tooltip-inner {
  background-color: #444;
}
.tooltip.top .tooltip-arrow {
  border-top-color: #444;
}
.slider-track {
    background-image: -webkit-linear-gradient(top, #ffffff 0%, #f9f9f9 100%);
    background-image: -o-linear-gradient(top, #ffffff 0%, #f9f9f9 100%);
    background-image: linear-gradient(to bottom, #ffffff 0%, #f9f9f9 100%);  
}

.radio-list li
{
    display: block;
    clear: both;
}
.question-item .other-label
{
    margin: 0px;
    padding: 0px;
}

/**
 * For em-type
 */
 .strong
 {
     font-weight: bold;
     display: inline-block;
     padding: 0.2em;
 }

 .hide-tip
 {
     display: none;
 }

/**
 * Surveys list
 */
.surveys-list {
    margin-top: 1em;
    list-style: none;
}
.surveys-list li {
    padding: 0.5em;
}
.surveys-list li a {
    margin-left: 0.5em;
}
#surveys-list-jumbotron {
    text-align: center;
}
#surveyListFooter {
    width: 100%;
    text-align: center;
    margin-bottom: 0;
    padding-bottom: 0;
    margin-top: 10px;
}
#surveyListFooter div{

}

/**
 * Gender buttons
 */

/* Not selected */
.gender-button button{
    box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.16), 2px 2px 2px 0 rgba(0, 0, 0, 0.12);
    margin-left: 1em;
}

/* selected */
.gender-button .btn:focus {
    box-shadow: none;
}
.gender-button .btn:focus .gender-text{
    text-decoration: underline;
}

/* Button styles */
.gender-button .btn-primary {
  color: #444;
  border-color: #faf9f1;
  border: 2px solid #faf9f1;
}
.gender-button .btn-primary:hover,
.gender-button .btn-primary:focus,
.gender-button .btn-primary.active,
.gender-button .btn-primary.active:hover,
.gender-button .btn-primary.active:focus {
  color: #FFF;
  background-color: #7ca51a;
  border-color: #faf9f1;
  border: 2px solid #faf9f1;
}

/* General */
.gender-button .btn span {
    display: block;
}
.gender-button .gender-icon {
    font-size: 2em;
}


/**
 * Yes / No buttons
 */

/* Not selected */
.yes-no button{
    box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.16), 2px 2px 2px 0 rgba(0, 0, 0, 0.12);
    margin-left: 1em;
}

/* selected */
.yes-no .btn:focus {
    box-shadow: none;
}
.yes-no .btn:focus .gender-text{
    text-decoration: underline;
}

/* Button styles */
.yes-no .btn-primary {
  color: #444;
  border-color: #faf9f1;
  border: 2px solid #faf9f1;
}
.yes-no .btn-primary:hover,
.yes-no .btn-primary:focus,
.yes-no .btn-primary.active,
.yes-no .btn-primary.active:hover,
.yes-no .btn-primary.active:focus {
  color: #FFF;
  background-color: #7ca51a;
  border-color: #faf9f1;
  border: 2px solid #faf9f1;
}


/* Header styles */

html body .navbar.navbar-default.navbar-fixed-top {
    position: relative;
}

.navbar {
    margin-top: 40px;
    margin-bottom: 0px !important;
}
@media only screen and (max-width: 768px) {
    .navbar {
        margin-top: 0;
    }   
}

.navbar-default {
    background-color: #FFF;
}

.navbar-header {
    padding-top: 25px;
    padding-bottom: 25px;
    margin: 0 auto !important;
    /* WB border-top: 4px solid #7ca51a; */ 
    border-top: 4px solid #99c2ff; 
}

/*body .navbar-default .navbar-brand:hover { */ 
body .navbar-default .navbar-brand { 
     /* color: #fff; */ 
     color:#2c5c85; 
     background-color: #f4f6f9;
     -webkit-transition-duration: 3s;
    -moz-transition-duration: 3s;
    -o-transition-duration: 3s;
     transition-duration: 3s;
}
.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
     color:#2c5c85; 
     background-color:#e3eaf0;
     -webkit-transition-duration: 3s;
    -moz-transition-duration: 3s;
    -o-transition-duration: 3s;
     transition-duration: 3s;
  
  
}

.navbar-brand {
    height: auto;
    /* WB color: #fafafa; */
    /* color: #2c5c85; */ 
    /*color: #fafafa; */
    color: #7ca51a;
    text-align: center;
    padding: 10px 15px;
    font-weight: 600;
    font-size: 28px;
    /* WB background-color: #7ca51a; Das ist Training x*/
    /* background-color: #f5f6f6 */ 
    background-color: #99ddff; 
    
    width: 100%;
    font-weight: 400;
    font-style: normal;
    border-top: 1px solid #b3e6ff;
    
}

@media (min-width: 768px) {
  .navbar > .container .navbar-brand,
  .navbar > .container-fluid .navbar-brand {
    margin-left: 0;
  }
}
.navbar-default .navbar-brand {}

.navbar-logo-left {
    text-align: left;
    padding-left: 0;
}

.navbar-logo-middle {
    text-align: center;
}

.navbar-logo-right {
    text-align: right;
    padding-right: 0;
}

img.logo {
  max-width: 100%;
  height: auto;
}

@media only screen and (max-width: 768px) {
    .navbar-logo-left {
        text-align: center;
        padding-left: 15px;
        padding-right: 15px;
    }

    .navbar-logo-middle {
        text-align: center;
        padding-left: 15px;
        padding-right: 15px;
    }

    .navbar-logo-right {
        text-align: center;
        padding-left: 15px;
        padding-right: 15px;
    }    
}


/* Navbar menu */
#navbar {
    width: 100%;
    padding: 0;
    border-top: 1px solid #cfcfcf;
    padding-top: 1.2em;
    padding-bottom: 1.2em;
}
.navbar-nav {
    float: none;
}
.navbar-item-left {
    text-align: left;
}
.navbar-item-middle {
    text-align: center;
}
.navbar-item-right {
    text-align: right;
}
@media only screen and (max-width: 768px) {
    .navbar-item-left {
        text-align: center;
        margin-bottom: 15px;
    }
    .navbar-item-middle {
        text-align: center;
        margin-bottom: 15px;
    }
    .navbar-item-right {
        text-align: center;
    }    
}
.navbar-toggle {
    float: none;
    margin: 0 auto;
    border: 1px solid #ccc;
    margin: 15px 0;
}
.navbar-toggle .icon-bar {
    background-color: #aaa;
}
.bottom-menu {
    text-align: center;
}


/* Question index */
#indexcontainer {
  display : none;
}
.dropdown-menu .linkToButton {
    color: #777;
}
a.linkToButton:hover,
a.linkToButton:focus {
  border-bottom: 0;
}


/* For striped tables */
.well {
    background-color: #f0f0f0;
}
.array2 {
    background-color: #FFF !important;
}
.array1:hover, .array2:hover {
    background-color: #7ca51a !important;
    color: #FFF !important;
}
.array1.dontread:hover {
  background-color: transparent !important;
  color: #6f6f6f !important;
}
tr.dontread th {
  font-weight: 700;
}

/* Make sure table covers hole page */
table {
    width: 100%;
}

/* Give help text some space */
.question-help {
    font-size: 90%;
}
.text-info.questionhelp {}
.text-info.questionhelp .fa-question-circle {
  font-size: 120%;
  color: #396276;
}
.text-info.questionhelp .fa-exclamation-circle {
  font-size: 120%;  
}
.questionhelp.text-danger .fa-exclamation-circle {
  font-size: 120%;  
}

/* Wrap text in e.g. gender button "No answer */
.wrap-normal {
    white-space: normal;
}

/* Adjust file-upload success colors */
.alert-success {
    background-color: #689F38;
    border-color: #689F38;
}

/* Center modal vertically, used by file-upload modal */
.modal {
    text-align: center;
    padding: 0!important;
}
.modal:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px;
}
.modal-dialog {
    display: inline-block;
     text-align: left;
     vertical-align: middle;
}

/* Make file upload modal fit to iframe */
.file-upload-modal-body iframe {
    height: inherit;
    width: 100%;
    border: none;
}
.file-upload-modal-body {
    padding: 0;
    height: 500px;
}
.file-upload-modal-footer {
    margin-top: 0;
}

.slider.slider-horizontal {
    width: 100%;

    /* The reset button will be under the slider, so allow some margin */
    margin-bottom: 1em;
}

/* When slider has both show-min-max and reset button, add space between
 * left badge and reset button */
.slider-min-badge {
    margin-right: 1em;
}

.slider-left-span {
    text-align: right;
}

.slider-right-span {
    text-align: left;
}

.slider-container {
    margin-top: 3.5em;
    margin-bottom: 2.5em;
}

#yii-flash-message {
    margin-top: 1em;
}

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

.align-middle {
    vertical-align: middle !important;
}

table.table-multi-text tbody tr th {
    vertical-align: middle;
}

table.question.subquestion-list.questions-list.table-multi-text thead tr th {
    text-align: center;
}

/* Used for date-picker icon within input */
.form-control-feedback {
    right: 1em;
    left: auto;
}

/* Used for multiple numeric sum and remain
 * Overwrite Bootstrap label font-size 75% */
.label {
    font-size: 90%;
}

/* Only use <label> to get vertical align easy. Don't want boldness. */
.no-label {
    font-weight: normal;
}

/* Center radio buttons in array-by-column */
.table-array-by-column td.radio-item.text-center.answer-item {
    padding-left: 47px;
}

table > tbody > tr > td.ddprefix {
    padding-right: 1em;
    vertical-align: middle;
}

/**
 * On big screen only, iPad and up
 */
@media only screen and (min-width: 768px) {
    .table-dual-scale .separator {
        width: 6%;
    }
    table > tbody > tr > td.ddsuffix {
        padding-left: 1em;
        vertical-align: middle;
    }
}

/**
 * No more tables
 * OBS: Media specific CSS must be last in this file.
 * iPad has width 768px (according to Chrome dev tool)
 * Google Nexus 10 has width 800px.
 * (Both in portrait mode.)
 * We don't have to collapse tables on pads.
 */
@media only screen and (max-width: 801px) {

    /*
        No more table transformation applies when screen is under 801px (for a few exotic tablet screens, see #11016),
        whereas visible-xs-block respect bootstrap standards (767px)
        If too many bugs of this kind appears in the future, we should just refuse to support weird exotic tablet screens.
        We should repsect standards, we should not try to fit to non standards devices. 
    */
    .visible-xs-block{
        display: block !important;
    }

    /* Remove margin */
    .row {
        margin: 0;
        padding: 0;
    }

    /* Add some margin for multiple short text */
    .form-group.row {
        margin-bottom: 15px;
    }

    /* Force table to not be like tables anymore */
    .no-more-tables table,
    .no-more-tables thead,
    .no-more-tables tbody,
    .no-more-tables th,
    .no-more-tables td {
        display: block;
    }

    /* 2016-08-29 Marcel: 11559: Layout problem with bipolar answers/labels for matrix (https://bugs.limesurvey.org/view.php?id=11559) */
    .no-more-tables tbody th,
    .no-more-tables tbody td,
    .no-more-tables tbody tr {
        width: 100% !important;
    }
    
    .no-more-tables tr {
        display: inline-block;
    }

    .no-more-tables tbody {
        padding: 0 1em 0 1em;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    .no-more-tables thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .no-more-tables tr,
    .array-by-columns-div .radio-list {
        border: 1px solid #ccc;
        padding: 1em;
    }

    /* Line header ; color is h4 color */
    .no-more-tables tr th,
    .array-by-columns-div .answertext {
        font-size: 1.1em;
        text-align: center;
        color: #317eac;
    }
    
    .no-more-tables tr th, 
    .array-by-columns-div .answertext 
    {
        font-size: 1.1em;
        text-align: center;
        color: #333;
    }    

    .no-more-tables tr th {
        text-align: left;
    }

    .array-by-columns-div .answertext {
        padding: 8px;
        padding-left: 0;
        text-align: left;
        font-weight: bold;
    }

    .array-by-columns-div .radio-item {
        padding-bottom: 8px;
    }

    .no-more-tables .checkbox  {
        position: relative;
        top: 6px;
    }

    .no-more-tables td {
        /* Behave  like a "row" */
        min-height: 2em;
        border: none;
        position: relative;
        /*padding-left: 95%;*/
        padding-bottom: 1em;
        white-space: normal;
        text-align:left;
    }

    .array-multi-flexi  .no-more-tables td, .no-more-tables-array-dual-dropdown-layout  td, .no-more-tables-array-multi-text td {
        padding-left: 1.5em;
    }


    .no-more-tables td:before {
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 6px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align:left;
        font-weight: bold;
    }

    /*
    Label the data
    */
    /*.no-more-tables td:before { content: attr(data-title); }*/

    .no-more-tables-10-point td {
    }

    /* Don't wrap "No answer" on two lines */
    .no-more-tables-10-point label {
        white-space: nowrap;
    }

    .no-more-tables-10-point td:before, .no-more-tables-5-point td:before {
        /* Now like a table header */
        position: relative;
        left: 2px;
        /* Top/left values mimic padding */
    }

    /* When tables are collapsed, remove margin top so the labels look centered */
    input[type="radio"],
    .radio input[type="radio"],
    .radio-inline input[type="radio"] {
      margin-top: 4px;
    }

    .five-point-choice .col-xs-12 {
        padding-bottom: 8px;  /* For 5-point-choice; TODO: Should look like 5-point-array? */
    }

    /* Hide the first column in array-by-column */
    .array-by-columns-table tr > *:nth-child(1) {
        display: none;
    }

    /* Need some more space on phone */
    .array-multi-flexi .answertext {
        padding-bottom: 0.5em;
    }

    .array-multi-flexi .answer-item label {
        padding-bottom: 0.5em;
    }

    /* On phone, left and right slider text is above and below slider */
    .slider-left-span {
        text-align: left;
    }

    /* As above, collapse prefix/suffix to above/below input */
    .prefix-text-right {
        text-align: left;
    }

    table.question.subquestion-list.questions-list tr th.answertext {
        text-align: left;
    }

    /* Used for date-picker icon within input */
    .form-control-feedback {
        right: 0.5em;
    }

    /* Increase-same-decrease array */
    .row-inc-same-dec .radio-item,
    .thead-inc-same-dec th {
        text-align: left;
    }

    .table-multi-num.no-more-tables tr {
        border: none;
    }

    /* Used for <td></td> in multiple-numeric */
    td.hide-on-small-screen {
        display: none;
    }

    #langchanger-label {
        padding-top: 11px;
    }

    .col-xs-12.question-container {
        padding-right: 0em;
        padding-left: 0em;
        
    }

}

/** On small phones, leave some more space */
@media only screen and (max-width: 400px) {

    .array-by-columns-div .radio-list {
        border: 1px solid #ccc;
        padding: 1em;
        margin: 1em;
    }

    /*
    .col-sm-12.answer {
        padding-left: 0;
        padding-right: 0;
    }
    */

    .no-more-tables tbody {
        padding-left: 0;
        padding-right: 0;
    }

    /* For yes-no question, shrink the buttons a bit on phone screens */
    .btn-lg, .btn-group-lg label {}

    .slider.slider-horizontal {
        /* Slider can be full width on phones */
        width: 100%;
    }

    /* Center label under radio button on phones */
    .five-point-choice label {
        margin-left: 5px;
    }

    /* Make file-upload pop-up shorter on phones */
    .file-upload-modal-body {
        padding: 0;
        height: 300px;
    }

    /* Modal should be in front of navbar, so the close icon is visible */
    .modal {
        z-index: 3000;
    }

    /* Less margin on phones */
    .slider.slider-horizontal {
        margin-bottom: 0.4em;
    }

}

/* On iPad etc only */
@media only screen and (max-width: 800px) and (min-width: 768px) {
    .five-point-choice .noanswer-item {
        padding: 0;
    }
}


/**
 * Display adjust, question type by question type
 */

.radio input[type="radio"]:disabled + label
{
    opacity: 0.25;
}


/*
    Arrays Question
*/

/* vertical center the radio list in the td */
td.answer-item.text-center
{
    vertical-align: middle;
}

/* center the radio list in the td */
td.answer-item.text-center
{
    padding-left: 39px;
    border-radius: 0;
}
table.array-no-dropdown  td.answer-item.text-center
{
    padding-left: 45px;
}
.table-5-point-array td.answer-item.text-center
{
    padding-left: 54px;
}
.table-10-point-array  td.answer-item.text-center
{
    padding-left: 40px;
}
.table-10-point-array  thead tr th.text-center
{
    padding-left: 0px;
}

/* center the label text in no more table mode */
.label-text{
    margin-top: -25px;
    padding-left: 5px;
}
.label-clickable:hover
{
    cursor: pointer;
    color:  #00001a;
}





.table > tbody > tr > th
{
    vertical-align: middle;
}
table.numbers-only th, table.numbers-only input {
    text-align: right;
}
.othertext-label-checkox-container {
    padding-top: 5px;
    margin-right: 5px;
}
.multiple-choice-with-comment.table, .table-multi-num.table{
    table-layout: auto;
    width: initial;
}
 .multiple-choice-with-comment.table > tbody > tr > td {
    padding-left: 18px;
    vertical-align: middle;
}

 /* alignment for small screens*/
.multiple-choice-with-comment.table > tbody > tr > td.comment-container {
    padding-left: 14px;
}
.checkbox input[type="checkbox"] {
    margin-left: 0px;
}
.short-free-text .prefix, .short-free-text .suffix,.geoloc-item .search-icon, .geoloc-item .checkbox  {
    padding-top: 10px;
}
.geoname_search {
    margin-bottom: 10px;
}

/* Remove answer label background-color */
thead tr.array1,
thead tr.array1:hover,
thead.array1,
thead.array1:hover {
  background: transparent !important;
  background-color: transparent !important;
  color: #6f6f6f !important;
}
tr.array1 {
  background-color: #f0f0f0;
}
.well {
  background-color: transparent;
}

.dsheader {
  font-weight: 700;
}

/* Add striped background for array by column */
.array-flexible-column .question-wrapper div div table tbody tr:nth-child(odd) {
  background: #fff;
}
.array-flexible-column .question-wrapper div div table tbody tr:nth-child(even) {
  background: #f0f0f0;
}
.array-flexible-column .question-wrapper div div table tbody tr:hover {
    background-color: #7ca51a !important;
    color: #FFF !important;
}
.array-flexible-column .question-wrapper div div table tbody tr td.array2 {
  background-color: transparent !important;
}
.array-flexible-column .question-wrapper div div table tbody tr td.array2:hover {
  background-color: transparent !important;
  color: #6f6f6f !important;
}
.array-flexible-column .question-wrapper div div table thead.array1.dontread tr th {
  background-color: transparent !important;
  color: #6f6f6f !important;
  font-weight: 700;
}
.array-flexible-column .question-wrapper div div table thead.array1.dontread tr th:hover {
  background-color: transparent !important;
  color: #6f6f6f !important;
}


/* Add striped background for array flexible dual scale */
.array-flexible-duel-scale .question-wrapper div div table tbody tr:nth-child(odd) {
  background: #fff;
}
.array-flexible-duel-scale .question-wrapper div div table tbody tr:nth-child(even) {
  background: #f0f0f0;
}
.array-flexible-duel-scale .question-wrapper div div table tbody tr:hover {
    background-color: #7ca51a !important;
    color: #FFF !important;
}
.array-flexible-duel-scale .question-wrapper div div table thead tr th {
  background-color: transparent !important;
  color: #6f6f6f !important;
  font-weight: 700;
}


/** Question Design **/
body div.row .question-container {
    /* background: #faf9f1; */ 
    background-color: transparent;
    border: 1px solid #dfded5;
    border-radius: 5px;
    margin-bottom: 2em;
    margin-top: 2em;
}
.question-container {
    border: 1px solid #aaa;
    padding-bottom: 10px;
    padding-left: 1em;
    /* shadow wb */
 -webkit-box-shadow: 1px 1px 2px 1px rgba(75,77,75,0.47);
-moz-box-shadow: 1px 1px 2px 1px rgba(75,77,75,0.47);
box-shadow: 1px 1px 2px 1px rgba(75,77,75,0.47);
    
    
}
.question-container.input-error {
  border-color: #E75041 !important;
  -webkit-box-shadow: 5px 6px 7px 8px rgba(207,135,144,1);
-moz-box-shadow: 5px 6px 7px 8px rgba(207,135,144,1);
box-shadow: 5px 6px 7px 8px rgba(207,135,144,1);
  
}
.answer-container, .question-help-container
{
    border-style: solid;
}
.answer-container
{
    padding-top: 1.5em;
    padding-bottom: 0.5em;
    color: #6f6f6f;
}


/** Header **/

.question-title-container {
    padding: 1em 0.25em 0.25em 0;
    background-color: transparent;
    color: #333;
    font-weight: 600;
    font-size: 17px;
}

.questionvalidcontainer {
    background-color: transparent;
    position: relative;
    text-align: left;
    padding-bottom: 1em;
    font-style: italic;
    font-size: 90%;
}

.answer-container {
    border: 0;
}

.question-help-container
{
    border: 0;
    margin-top: 10px;
}

.questionvalidcontainer .text-danger{}

.questionvalidcontainer .text-info{
    color: #333;
}

.text-info {}

/* Arrow */
/* Will confuse survey takers?
.questionvalidcontainer:after {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-top-color: #233140;
    border-width: 0.9em;
    margin-left: -0.9em;
}
*/

/* Asterisk */
.asterisk {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    /* 2016-08-29 Marcel: no support by all browsers: text-rendering: auto;*/
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* font-size: 12px !important; */ 
    font-size: 2px !important; /* by WB */
    
}
.asterisk:before {
    content: "\f069";
}


/* Check javascript */
#checkjavascript {
    margin-top: 100px;
}

/*label font weight*/
label, th {
    font-weight: normal;
}

#surveys-list-container
{
    margin-top: 50px;
}

/* text overflows, ellipsis and hyphens */
.navbar-brand {
    overflow: hidden;
    text-overflow: ellipsis;
}

#outerframeContainer {
    min-height: 100%;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;
    margin-top: 0px !important;
    /* WB padding-left: 15px !important;
    padding-right: 15px !important;  Mehr Randabstand für text*/ 
    
    padding-left: 2% !important;
    padding-right: 2% !important;
    
    margin-bottom: 40px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    background: #FFF;
    background: #FCFCFC !important; 
    
    
    
}
@media only screen and (max-width: 768px) {
    #outerframeContainer {
        margin-bottom: 0;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }   
}

.xdebug-var-dump {
    z-index: 10000;
    position: relative;
    top: 10px;
}

.list-unstyled.radio-list {
    padding-left: 15px;
}

div.yes-no .btn-group label {
  white-space:normal;
}

.multipleco-other-topic {
    max-width: 50%;
    margin-top: 5px;
}

/* Container padding reset */
.container {
    padding: 0 !important;
 
}

/* Privacy note */
.privacy div p {
  font-style: italic;
  font-size: 90%;
  line-height: 150%;
}
.privacy-title {
  font-weight: 700;
}

/* Radios and Checkboxes */
/* radio buttons */
.radio label::after {
    background-color: #396276;
}
/* checkboxes */
.checkbox label::after {
    color: #396276;    
}

/* Footer */
#footer-wrapper {
    width: 100%;
    padding-top: 2em !important;
    padding-bottom: 2em !important;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 40px;
    /* background: #f8f8f8; */ 
    background: #FCFCFC;
    margin: 0 auto;
    border-top: 1px solid #cfcfcf;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
#footer-wrapper a,
#footer-wrapper a:link {
  color: #888;
  text-decoration: none;
}
#footer-wrapper a:hover,
#footer-wrappera:focus {
  color: #888;
  border-bottom: 1px solid #888;
}

@media only screen and (max-width: 768px) {
  #footer-wrapper {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }  
}

/* Help block */
.help-block {
    color: #999;
}

/* Date Picker */
.bootstrap-datetimepicker-widget td.active, .bootstrap-datetimepicker-widget td.active:hover {
    background-color: #333 !important;
}
.input-group-addon {
    color: #333;
    background-color: #f0f0f0;
    border: 2px solid #ccc;
}

/* Ranking Question */
.dragDropTable .dragDropChoices, .dragDropTable .dragDropRanks {
    margin-right: 5px;
}
.dragDropTable ul.dragDropChoiceList li {
    background: #eeeeee;    
}
.dragDropTable ol.dragDropRankList li {
    background: #7ca51a;
    color: #FFF;
    border: 1px solid #779a23;
}
@media only screen and (max-width: 768px) {
    .dragDropTable .columns2 {
        width: 100%;
        margin-bottom: 15px;
    }
}
.dragDropTable .dragDropChoices {
    margin-right: 15px !important;
}

/* 5pt Choice Radio */
.choice-5-pt-radio {
  padding-bottom: 1.5em;
}

/* Links */
table a:not(.btn), .table a:not(.btn) {
    text-decoration: none;
}

/* Print page */
input#exportbutton {
  color: #444444;
  border: 1px solid #d3d3d3;
  background: #f5f5f5;
  background: -moz-linear-gradient(top, #f5f5f5 0%, #e1e1e1 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(100%,#e1e1e1));
  background: -webkit-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: -o-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: -ms-linear-gradient(top, #f5f5f5 0%,#e1e1e1 100%);
  background: linear-gradient(to bottom, #f5f5f5 0%,#e1e1e1 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e1e1e1',GradientType=0 );
  padding: 0.8em 1.4em;
  margin: 0 5px;
}
input#exportbutton:hover {
    background: #c7c7c7;
    border-color: #c7c7c7;
}
.printouttitle {
    margin: 50px 0 15px 0;
    font-size: 140%;
    text-align: center;
    font-weight: bold;
}
table.printouttable {
    background: #FFF;
    border: 1px solid #ccc;
}
table.printouttable tr td {
    border: 1px solid #ccc;
    padding: 15px; 
}
.printanswersquestion {
    font-weight: 400;
}
tr.printanswersgroup td {
  font-weight: 700;
  font-size: 120%;
  background: #ccc;
  color: #444;
}
.printanswersanswertext {
  font-weight: bold;
  font-style: italic;
}
.printanswersgroupdesc {
  font-style: italic;
}
table.printouttable tbody tr:nth-child(even) {
  background-color: #f0f0f0;
}

/* Public Statistics */
#statsContainer { /* Container */
  font-family: 'Roboto', sans-serif;
  overflow: hidden;
}
#statsContainer .statsSurveyTitle { /* Main Title */
  margin: 0px 0 20px;
  font-size: 130%;
  font-weight: 700;
  text-align: left;
  padding: 0;
  display: none;
}
#statsContainer .statsNumRecords {/* No of records in survey */
  font-size:110%;
  font-weight:700;
  text-align:left;
  padding: 10px 0px;
}
#statsHeader {
  padding: 0px 0px 10px;
}
div.fieldSummary {
  padding: 0;
  text-align: center;
  background-color: #D2E0F2;
}
div.questionTitle {
  padding: 0;
  font-weight: bold;
  background-color: #D2E0F2;
}
table.statisticstable {
  margin:15px auto 20px 0px;
  width: 100%;
  border-top: 1px solid #BBC6CC;
}
table.statisticstable td {
  line-height: 190%;
  border-bottom: 1px solid #BBC6CC;
}
table.statisticstable img {
  margin:10px auto;
}
table.statisticstable th {
  text-align: center;
  font-style: normal;
  font-weight: 700;
  font-size: 120%;
  padding: 15px 20px;
}
table.statisticssummary {
}
table.statisticssummary thead tr th {
  font-size: 110%;
  text-decoration: underline;
  padding-bottom: 5px;
}
table.statisticssummary tbody {
  line-height: 20px;
}
table.statisticssummary tbody tr td {
  padding-left: 20px;
}

/* Numerical input fix */
.numeric-item div.col-sm-5 {
    width: 100%;
}

/* Label */
.label-default {
    background-color: #aaa;
    margin-right: 15px;
}

/* Save All */
.save-all {
    padding: 0;
}

/* List with comment */
  .comment.answer-item.text-item {
    margin-top: 30px;
}

/* Horizontal center label with dropdown for Array questions */
.array-multi-flexi th.th-11,
.array-multi-flexi-text thead tr th.answertext {
  text-align: center; 
}
@media only screen and (max-width: 768px) {
  .array-multi-flexi .text-right {
    text-align: left;
  }  
}

/* Vertical center fix for Dual Scale Array questions */
@media only screen and (max-width: 768px) {
  .array-flexible-duel-scale .label-text {
    margin-top: 0;
    margin-left: 0;
  }
}

/* Save answers */
.save-heading {
  text-align: center;
}

/* Mandatory error margin */
.errormandatory {
  margin-bottom: 0;
}

/* Adjust file-upload body color */
body.uploader {
  background: #fff;
}

/* List dropdown other field margin fix */
.list-dropdown input.form-control {
  margin-top: 15px;
}

/* Radio button & checkbox margin to answertext fix */
.label-text {
    margin-left: 10px;
}

/* 2016-08-11 Marcel: Fix duplicate headers at resolution > 800px <1000px 
.visible-xs-block 
{
    display: none !important;
}
*/

/* 2016-08-29:     11537: Large array questions moving out of question container
   AND:     11588: Default template below 800px: array with checkboxes goes wrong*/
@media only screen and (max-width: 900px) and (min-width: 800px) {
    .table-10-point-array td.answer-item.text-center
    {
        padding-left: 0px;
    }
    
    .no-more-tables .table-10-point-array td
    {
        padding-left: 1.5em;
    }
}

/* 2016-10-07 Marcel: Fixing different column width for multi-flexi-dropdown */
.array-multi-flexi table.dropdown-list,
.array-multi-flexi table.numeric-item
{
    table-layout: fixed;
}

/* 2016-02-05: Fixed issue #11696: "Return to survey" link misaligned in load screen */
p.return-to-survey {
    clear:left;
    margin-left:10px; /* wb*/
 
}

.return-to-survey {
    clear:left;
    margin-left:10px !important; /* wb*/
 
}



/* 2017-05-17 Statistics Page fixes */
.statisticstable .text-left {
    text-align: left;
}
.statisticstable .text-right {
    text-align: right;
}
.stats-wrapper#outerframeContainer {
    padding: 5px !important;
}
.public-stats {
    width: 100%;
}
.public-stats .well {
    padding-left: 0;
    padding-right: 0;
}
#statsContainer {
    overflow: visible;
}

/* Fixed danger label for matrix questions */
.label-danger {
    display: inline-block;
    line-height: 120%;
    font-weight: normal;
    color: #6f6f6f;
    font-size: 100%;
    white-space: normal;
    background-color: transparent;
}