/******************
    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-root-font-size: 16px;
        /*--bs-body-font-size*/
}

/*von Fabian Anfang*/
.p1 {
    word-break: keep-all;
    overflow-wrap: break-word;
    font-family: "Roboto", sans-serif;
}

/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../files/Roboto-Regular.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../files/Roboto-Bold.ttf) format('truetype');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body {
  font-family: 'Roboto', sans-serif;
}

/*.em_endtext {
    font-size: 18px;
}*/

.ls-welcome-text,
.ls-end-text {
    font-family: 'Roboto', sans-serif !important; /* Beispielschriftart */
    font-size: 16px; /* Beispielgröße */
    color: #000000; /* Beispielfarbe */
}

/* Erweitert die Umfrage auf die gesamte Bildschirmbreite */
.container, .container-fluid, .ls-container {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 auto !important;
}

.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#mainrow, .survey-list-container, .question-container {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 2px;
}

.survey-view .container, .survey-view .container-fluid, .survey-view .ls-container {
    padding: 0 !important;
}

.btn-primary, .btn-check {
    color: #821414;
    border-color: #821414;
    background-color: #FAF9F4;
    
    font-size: 18px;
    line-height: 28px;
    padding: 14px 20px;
    
}

.btn-primary:hover {
    color: #FAF9F4;
    border-color: #FAF9F4;
    background-color: #821414;
}

.flatly .btn-check:active + .btn-primary, .flatly .btn-check .btn-primary:active {
    color: #FAF9F4;
    border-color: #FAF9F4;
    background-color: #821414;
}

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

.flatly .btn-check:checked + .btn-primary {
    color: #FAF9F4;
    border-color: #FAF9F4;
    background-color: #821414;
}

.flatly .btn-check + .btn-primary:checked {
    color: #FAF9F4;
    border-color: #FAF9F4;
    background-color: #821414;
}

/*für iOS-spezifisch CSS */
@supports (-webkit-touch-callout: none) {
  .roboto-regular {   font-family: "Roboto", sans-serif;   font-weight: 400;   font-style: normal; } 
.roboto-bold {   font-family: "Roboto", sans-serif;   font-weight: 700;   font-style: normal; }  
}


/* Spezifische Anpassungen für die mobile Ansicht */
@media (max-width: 768px) {
    .ls-welcome-text,
    .ls-end-text {
    font-family: 'Roboto', sans-serif !important; /* Beispielschriftart */
    font-size: 16px; /* Beispielgröße */
    color: #000000; /* Beispielfarbe */
}
    table {
        width: 100% !important;
    }
    
    /* Umfrage-Hauptcontainer auf Mobilgeräten */
    .survey-view .container, .survey-view .container-fluid, .survey-view .ls-container {
        padding: 0 !important;
        width: 100% !important;
    }

    /* Abstand und Breite von Frage- und Antwortblöcken auf Mobilgeräten */
    .question-container, .answer-container, .subquestion-list {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
    }

    /* Entfernt unnötige Innenabstände und Ränder für mobile Geräte */
    .question-text{
        margin: 0 !important;
        padding: 5px !important;
    }
    .answer-container {
        margin: 0 !important;
        padding-bottom: 1rem !important;
    }
}

/*von Fabian Ende*/


html {
  scroll-behavior: smooth;
}
    
.breadcrumb, .btn, .dropdown-menu .dropdown-item, .nav-pills .nav-link, .nav-tabs .nav-link, .navbar .nav-link, .pagination, .sandstone, .tooltip {
    text-transform: none;
    font-size: var(--bs-body-font-size);
    line-height: 22px;
}  

.question-title-container {
    background: none !important;
    color: #000;
}

.question-help-container, 
.question-container, 
.answer-container{
    border: none;
    padding-bottom: 2rem;
}

/*.btn-primary {
    color: #fff;
    background-color: #e61414;
    border-color: #e61414;
    
    font-size: 18px;
    line-height: 28px;
    padding: 14px 20px;
    
}

.btn-primary:hover {
    color: #fff;
    background-color: #821414;
}*/



.c-header-box{
    position: relative;
    margin-bottom:60px;
    margin-top:60px;
}

.c-header-box__image{
    width: 75%;
}

.c-header-box__text{
    background: #af1414;
    color: #fff;
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 20px;
    width: 500px;
    margin-bottom: -40px;
    border-radius: 8px;
    max-width: 100%;
}

h1{
    font-weight: bold;
    font-size: 2rem;
    font-family: 'Roboto';
}

.logo-container {
    position: relative;
    padding: 0px;
    float: left;
    font-size: 18px;
    line-height: 20px;
}




.logo-container>img{
        padding: 0;
    width: 160px;
}

/*tr > td:first-child,
tr > th:first-child,
colgroup > col:first-child{
    display:none;
}*/

/*von christoph*/
tr > td:first-child,
tr > th:first-child,
colgroup > col:first-child{
    width: 300px;
}

colgroup col{
        width: auto !important;
}

.questions-list td,
.questions-list th,
.questions-list tr,
.questions-list thead,
.questions-list tbody{
    
    border:none !important;
}

.ls-label-question {
    font-size: 1.5rem;
    font-weight: normal;
    line-height: 2rem;
}

@media screen and (max-width: 600px){
    .c-header-box__image {
        width: 100%;
        border-radius: 8px;
    }
    .c-header-box__text{
        position: relative;
        margin-top: -20px;
            width: 100%;
        
    }
}

footer{
        display: flex;
    align-items: center;
    gap: 40px;
    justify-content: center;
    margin-top: 60px;
}

footer a{
    color: #e61414;
    text-decoration: none;
}

footer a:hover{
    color: #b81010;
}