/******************
    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
*/
:root {
    --bs-primary: #253267;
    --bs-primary-rgb: 38,50,103;
    --bs-info-rgb: white;
    --bs-body-bg: #0C1F38;
    --bs-body-color: white;
    --bs-body-text-align: left;
}
/* Archivo Regular einbinden */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400;
  src: url('https://enobyte.com/typo3conf/ext/theme/Resources/Public/fonts/archivo-v16-latin-regular.woff2') format('woff2');
}

/* Archivo Bold einbinden */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 700;
  src: url('https://enobyte.com/typo3conf/ext/theme/Resources/Public/fonts/archivo-v16-latin-700.woff2') format('woff2');
}

/* Outfit Regular einbinden */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 400;
  src: url('https://enobyte.com/typo3conf/ext/theme/Resources/Public/fonts/outfit-v5-latin-regular.woff2') format('woff2');
}

/* Outfit Bold einbinden */
@font-face {
  font-family: 'Outfit';
  font-style: normal;
  font-weight: 700;
  src: url('https://enobyte.com/typo3conf/ext/theme/Resources/Public/fonts/outfit-v5-latin-700.woff2') format('woff2');
}

#question7575,#question7573 {
     .answer-container{
         display: none;
     }
}

#question7573 {
    .question-title-container {
       background: #1F365D !important;
       border-top: 1px solid #01B2CA;
}
}

.btn-outline-secondary{
    color: white !important;
}
.alert{
        font-family: Archivo !important;
}
.ls-questionhelp {
    font-size: 17px !important;
}

a{
    color: #01B2CA !important;
    font-family: Archivo !important;
    font-size: 17px !important;
}

button{
    font-family: Archivo !important;
    
}

li{
    font-family: Archivo !important;
    font-size: 17px !important;
}

p{
    font-size: 17px !important;
    font-family: Archivo !important;
    font-family: Outfit;
}

h1,h2,h3{
    font-family: Outfit !important;
}

.navbar-toggler{
    border: 0px !important;
}
.navbar-toggler::focus{
    border: 0px !important;
}

.popover{
    color: #0C1F38 !important;
}

.save-survey-form{
    background: #263267 !important;
       border-top: 1px solid#01B2CA;
       padding: 2rem !important;
}

.ls-language-link:hover{
    background: #F39C12 !important;
}

.logo{
    padding-bottom: 2rem !important;
}

.save-message{
    background: rgba(255, 255, 255, 0.20) !important;
    border: 0px;
}
.card-title.h2{
    margin-top: 0px !important;
}

.navbar{
        border-bottom: 0px !important;

}

.save-message div{
    color: white;
}

.save-message div p{
    color: white;
}
.nav-item::before{
    display: none;
}

.nav-item .index-item::before{
    display: none;
}

.nav-item .dropdown-menu{
    background: #1F365D;
    padding-bottom: 0px !important;
    padding-top: 0px !important;
    margin: 0px !important;
}

.nav-item .index-item{
    padding-left: 0px;
    margin-bottom: 0px !important;
}

.btn-outline-secondary{
    color: white;
}

.btn-outline-secondary:hover{
    background-color: #1f365d;
    border-color: #1f365d;
    color: white;
}

.modal-content{
    background: #22589E;
}

.modal-header{
    border-bottom: 1px solid rgba(0, 0, 0, 0.20);
}

.modal-footer{
    border-top: 1px solid rgba(0, 0, 0, 0.20);
}

.ls-questionhelp li:first-child{
    margin-top: 1rem;
}

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

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

.text-danger:before{
    font-size: .675em;
}

.question-valid-container{
    background: transparent !important;
    text-align: left;
}

ul {
  list-style: none;
  padding-left: 0;
}

ul:not(.list-unstyled) li {
  position: relative;
  padding-left: 30px;
  margin-bottom: 10px;
}

ul:not(.list-unstyled) li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 17px;
  height: 25px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='25' viewBox='0 0 17 25' fill='none'%3E%3Cpath d='M12.9902 18.2503V10.7497L6.49512 7L0 10.7497V18.2503L6.49512 22L12.9902 18.2503Z' fill='%2301B2CA'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
}

.question-help-container{
     border-top: 1px solid #01B2CA !important;
    background: var(--styleblatt-enobyte-dunkelblau-background, #1F365D);
    border-left: 0px;
    border-right: 0px;
    border-bottom: 0px !important;
    color: white !important;
    padding-top: 1rem;
    margin-bottom: 3rem;
    
}

.answer-container{
    border-top: 1px solid #01B2CA !important;
    background: var(--styleblatt-enobyte-dunkelblau-background, #1F365D);
    border-left: 0px;
    border-right: 0px;
    border-bottom: 0px !important;
}

.answer-container label{
    color: white;
    
}

.radio-label{
    flex: 0 0 40rem !important;
}

.answer-container .answer-item{
    display: flex;
    justify-content: center;
}
.answer-container .radio-item{
    display: flex;
    justify-content: flex-start;
    margin-left: 1.2rem;
}

.answer-container .radio-item input[type="radio"] {
    opacity: 0;
    position: absolute;
}

.answer-container .radio-item label::before {
    content: '';
    display: inline-block;
    width: 18px;
    height: 18px;
    background: transparent;
    border: 1px solid white;
    border-radius: 50%;
    margin-right: 8px;
    top: 1px;
}



.answer-container .radio-item input[type="radio"]:checked ~ label::after {
    background-color: #F39C12;
    width: 12px;
    height:12px;
    left: 3px;
    top: 4px;
}



.answer-container li label{
        text-align: left !important;
         flex: 0 0 120px;
}
.answer-container li div{
     flex: 1 !important;
     width: 100%;
     max-width: 40rem;
    
}

.question-container{
    border: 0px !important;
    background: transparent;
}

.ls-questionhelp[role="alert"] {
    color: #FFFFFF;
}

.nav-item a {
    color: white !important;
}

.text-center{
    text-align: left !important;
}

.survey-name{
    margin-bottom: 5rem;
}


.alert{
    margin-bottom: 2rem !important;
}

.well{
    background: rgba(255, 255, 255, 0.20);
    box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.25) inset;
    border-radius: 0px;
    border: none;
}


.container-fluid{
background: linear-gradient(90deg, #22579E 0%, #0C1F38 100%);

}

.control-label{
    margin-right: 1rem;
}

.group-title {
    color: var(--Enobyte-Cyan, #01B2CA);

}

.question-title-container{
    background: #0C1F38 !important;
    font-size: 17px !important;
}


.btn-primary {
  background-color: #FFB800;
  border-color: #FFB800;
  color:#1F365D;
  border-radius: 0;
}

.card-body{
    background-color: #FFB800;
  border-color: #FFB800;
  color:#1F365D;
  border-radius:0;
}

.btn-primary:hover {
  background-color: #1f365d;
  border-color: #1f365d;
}

.btn-check:checked + .btn-primary {
    background-color: #93B3D9;
    border: 1px solid #93B3D9;
}

.flatly .btn-check .btn-primary:focus, .flatly .btn-check:focus + .btn-primary {
    background-color: #93B3D9;
    border: 1px solid #93B3D9;
    box-shadow: none;
}

.flatly .btn-check:focus:checked + .btn-primary, .flatly .btn-check .btn-primary:focus:checked {
    background-color: #93B3D9;
    border-color: #93B3D9;
}