/*

Author: Johannes Lengdobler, 2024

*/
@font-face {
  font-family: 'Open Sans';
  font-weight: 100;
  font-style: normal;
}

:root {
    --primary: #e30613;
    --hintergrund: #ccc;
    --standardtext: #333333;
    --descr: #999999;
    --linkfarbe: #e30613;
  }

body{
   color: #333333;
   font-family: 'Open Sans', Arial, sans-serif!important;
   font-size: 16px;
}

#dynamicReloadContainer h1{
   font-size: 2em;
   line-height: 2.5em;
   text-align: left;
}

#dynamicReloadContainer div,
#dynamicReloadContainer input,
#dynamicReloadContainer button,
#dynamicReloadContainer .btn{
  border-radius: 0px;
}

#dynamicReloadContainer a,
#dynamicReloadContainer .btn-link{
    color: #e30613;
}

#dynamicReloadContainer a:hover{
    color: #999999;
}

#dynamicReloadContainer .navbar{
  background: #FFFFFF!important;
}

#navbar, #dynamicReloadContainer .navbar .navbar-header{
  background: #FFFFFF!important;
}

#dynamicReloadContainer .navbar .navbar-header .navbar-brand .logo{
  padding: 0px;
}

#dynamicReloadContainer .survey-welcome{
   color: #333333!important;
   border-radius: 0px;
   font-size: 1em;
   line-height: 2.5em;
}

#dynamicReloadContainer .token-page .well{
  background: #5F6061;
  color: #FFFFFF;
}

#dynamicReloadContainer .token-page .well .text-info{
  color: #C3C4C5;
}

#dynamicReloadContainer .group-description.row.well.space-col {
    background: rgb(96, 97, 98);
    border-radius: 0px;
    color: #ffffff;
}

/* change color of checkboxes, radio buttons and text fields */
#dynamicReloadContainer .radio-item label::before,
#dynamicReloadContainer .checkbox-item label::before,
#dynamicReloadContainer .answer-container textarea.form-control{
  border-color: #333333;
}

/* change box shadow of text fields */
#dynamicReloadContainer .answer-container textarea.form-control:focus{
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(51, 51, 51, .6);
}

#dynamicReloadContainer .answer-container .btn.answer-item {
    background-color: #999;
    border-color: #000;
    margin-right: 1em;
}

#dynamicReloadContainer .answer-container .btn.answer-item:hover {
    background-color: #e30613;
    border-color: #000;
    margin-right: 1em;
}

#dynamicReloadContainer .btn-check:checked+.answer-item.btn-primary
{
    background-color: #e30613;
    border-color: #e30613;
}

#dynamicReloadContainer .answer-container .btn.answer-item,
#dynamicReloadContainer .answer-container .btn.answer-item:hover{
   transition: background-color 0.5s ease;
}

.btn-primary {
   background-color:#e30613;
   border-color:#e30613;
   border-radius: 0px;
}

#ls-button-previous{
  border-radius: 0px;
}

#ls-button-previous:hover{
  background-color: rgb(196, 197, 198);
}

#navigator-container .btn-primary:hover {
   background-color: #333333;
   border-color: #333333;
}

#ls-button-previous,
#ls-button-previous:hover,
#navigator-container .btn-primary,
#navigator-container .btn-primary:hover{
   transition: background-color 0.5s ease;
}

#dynamicReloadContainer .progress{
  background-color: rgb(195, 196, 197);
  border-radius: 0px;
  height: 2em;
}

#dynamicReloadContainer .progress-bar {
   background-color:#e30613 !important;
   font-size: 16px;
   line-height: 2em;
}

#dynamicReloadContainer .navbar ul.nav li a{
   color: #333333;
}

#dynamicReloadContainer .navbar ul.nav li a:hover{
   color: #e30613;
   text-decoration: none;
}

#dynamicReloadContainer .navbar ul.nav li a,
#dynamicReloadContainer .navbar ul.nav li a:hover{
   transition: color 0.5s ease;
}

#dynamicReloadContainer .completed-wrapper{
  margin-top: 100px;
  text-align: center;
}

#dynamicReloadContainer .ls-even{
  background-color: #EEEEEE
}

#dynamicReloadContainer .ls-answers tr.ls-even th,
#dynamicReloadContainer .ls-answers tr.ls-even td{
  border-color: #FFFFFF;
}

.survey-description  {color:var(--standardtext)}
.text-primary  {color:var(--standardtext) !important}
.h4  {color:var(--standardtext) !important}
.text-info {color:var(--descr)!important}

/*
    FEHLERSEITE
*/
#error-card{
    border: none;
}

#error-card .card-body h2.card-title,
#error-card a.card-link{
    color: #e30613;
}

/*
  MOBILE STYLES
*/
@media only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px){
  #dynamicReloadContainer .top-container{
    margin-top: 10px;
  }

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

  #dynamicReloadContainer .group-container,
  #dynamicReloadContainer .group-container .group-title{
    margin-top: 0px;
  }

  #dynamicReloadContainer .ls-answers .answertext {
    color: #e30613;
    font-size: 16px;
  }

  #dynamicReloadContainer .answers-list label.ls-label-xs-visibility{
    padding-left: 20px;
  }

  #dynamicReloadContainer .group-outer-container{
    margin-bottom: 0px;
  }

  #navigator-container{
    margin: 0px;
  }

  #navigator-container .col-xs-6{
    padding-left: 20px;
    padding-right: 20px;
  }

  #dynamicReloadContainer .completed-wrapper .conpleted-text{
    margin-top: 10%;
    text-align: center;
  }
}