@font-face {
    font-family: 'Century Gothic';
    src: url('../fonts/CenturyGothic.woff2') format('woff2'), url('../fonts/CenturyGothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../fonts/CenturyGothic-Bold.woff2') format('woff2'), url('../fonts/CenturyGothic-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../fonts/CenturyGothic-Italic.woff2') format('woff2'), url('../fonts/CenturyGothic-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../fonts/CenturyGothic-Bold.woff2') format('woff2'), url('../fonts/CenturyGothic-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../fonts/CenturyGothic-BoldItalic.woff2') format('woff2'), url('../fonts/CenturyGothic-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../fonts/CenturyGothic.woff2') format('woff2'), url('../fonts/CenturyGothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../fonts/CenturyGothic.woff2') format('woff2'), url('../fonts/CenturyGothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body {
    font-family: 'Century Gothic';
}

body {
    background-color: #f5fcff;
}

.bd-navbar {
    background-color: #f8f9fa !important;
    padding-top: 20px;
    padding-bottom: 18px;
    border-bottom: solid;
    border-color: #8080802e;
}

.bd-navbar-brand {
    background-color: transparent;
    padding-left: 50px !important;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding-top: 0;
    padding-bottom: 0;
    max-height: 59px;
    max-width: 290px;
    display: flex;
}

.bd-navbar-brand img {
    vertical-align: baseline;
    max-height: 100%;
    max-width: 80%;
}

.bd-vertical-bar {
    width: 1px;
    height: 59px;
    background-color: rgba(0, 0, 0, 0.25);
    margin-left: 40px;
}

.bd-login .bd-table-email {
    width: 100%;
    margin-right: 27px;
}

.bd-login .bd-table-pass {
    width: 100%;
    margin-right: 53px;
}

td.login_buttns_td {
    display: flex;
    align-items: center;
    justify-content: space-around;
}
td.login_buttns_td button{
    margin:0;
}
td.login_buttns_td a{
    margin:0;
}

.bd-login input[type=email]::placeholder,
.bd-login input[type=password]::placeholder {
    color: #212529;
    font-family: 'Century Gothic';
}

.bd-login-btn {
    width: 104px;
    height: 48px;
    border: 1px solid #000000;
    margin-right: 26px !important;
    background-color: #1b763d;
}

.bd-login-btn:hover {
    background-color: #1b763ddb;
    color: white;
    border: 1px solid #000000;
}

.bd-reg-btn {
    width: 150px;
    padding-top: 11.5px;
    padding-bottom: 11.5px;
    background-color: #339ed7;
    color: #ffffff;
    border: 1px solid #000000;
    margin-right: 34px !important;
}

.bd-reg-btn:hover {
    background-color: #339ed7e0;
    color: white;
    border: 1px solid #000000;
}

.bd-login-btn,
.bd-reg-btn {
    font-size: 17px;
    border-radius: 5px;
    font-family: 'Century Gothic';
    font-weight: normal;
}

.bd-form-small {
    font-size: 13px;
    font-family: 'Century Gothic';
    font-weight: normal;
    color: #41a3d9;
}

.bd-form-small a {
    color: #41a3d9;
}

.bd-settings-btn {
    margin-right: 38px;
}

.bd-settings-btn a {
    padding: 10px 32px 10px 33px !important;
    border: 1px solid #000000;
    font-family: "Century Gothic";
    background-color: #3aa0d8;
    font-size: 17px;
    font-weight: 400;
    border-radius: 5px;
    letter-spacing: 0.85px;
    border-color: gray;
    color: white;
}

.bd-settings-btn a:hover {
    background-color: #3aa0d8e0;
    color: white;
    border: 1px solid #000000;
}

.bd-logout-btn {
    background-color: #0c4120;
    border-radius: 5px;
    margin-right: 34px;
}

.bd-logout-btn a {
    padding: 11px 33px 11px 36px !important;
    font-family: "Century Gothic";
    font-size: 17px;
    font-weight: 400;
    border-radius: 5px;
    letter-spacing: 0.85px;
    border: 1px solid #000000;
    background-color: #8d0404cc;
    color: white;
}

.bd-logout-btn a:hover {
    background-color: #8d0404a1;
    border: 1px solid #000000;
    color: white;
}

#sidebarMenu li a,
#sidebarMenu li a i {
    color: #000 !important;
}

#sidebarMenu h6 span {
    color: #6c757d !important;
}

#sidebarMenu .nav-link .feather {
    color: #ffffff;
}

#sidebarMenu {
    top: 64px;
    background-color: #f8f9fa !important;
    /*background: -webkit-radial-gradient(right, ellipse cover, #2c364a 0%, #242d41 58%) !important;*/
}

.admin-icon img {
    width: 20px;
    margin-right: 23px;
}

.bd-link-icon img {
    width: 20px;
    margin-right: 23px;
}

.bd-home-icon img {
    width: 17px;
}

.bd-home-li-inner {
    background-color: #394259;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 22px;
    border-radius: 5px;
    display: flex;
}

.bd-home-li-inner p {
    display: inline-block;
    margin-bottom: 0;
    margin-left: 25px;
}

.sidebar-powered-by {
    position: absolute;
    bottom: 0;
    color: #000;
    width: 100%;
    text-align: center;
}

.sidebar-powered-by a {
    color: #000;
}

.sidebar-impressum-datenschutz {
    position: absolute;
    bottom: 0;
    color: #ffffff;
    width: 100%;
    color: #ffffff;
    text-align: center;
}

.sidebar-impressum-datenschutz a {
    color: #ffffff;
}


/*Tables*/


/*project*/

.project-title,
.bd-admin-title {
    color: #b0b0b0;
    font-family: "Century Gothic";
    font-size: 53px;
    font-weight: 400;
    text-transform: uppercase;
}

.bd-admin-title {
    padding-top: 49px !important;
    padding-bottom: 32px !important;
    margin-bottom: 40px !important;
}

.bd-project-table {
    font-family: "Century Gothic";
}

.bd-project-table tr:nth-child(odd) {
    background-color: #EDEDED;
}

.bd-project-table tr:nth-child(even) {
    background-color: #ffffff;
}

.bd-project-table thead tr:first-child {
    background-color: #ffffff;
}

.bd-mb-31 {
    margin-bottom: 31px !important;
}

.bd-project-table tbody {
    border-top: none !important;
}

.bd-project-table td,
.bd-project-table th {
    padding-top: 25px;
    padding-bottom: 25px;
    /*padding-left: 22px;*/
    padding-left: 14px;
    padding-right: 14px;
}

.bd-administrator-td {
    display: flex;
    justify-content: space-between;
}

.bd-project-table-con {
    max-width: 100%;
    padding-left: 35px;
}

.bd-delete-btn {
    font-size: 15px;
    padding: 10px 20px;
}

.bd-total-project {
    margin-left: 35px;
}

.bd-user-name {
    font-family: "Century Gothic";
    font-size: 53px;
    font-weight: 400;
    color: #b0b0b0;
    text-transform: uppercase;
}

.bd-settings-main {
    padding-left: 58px !important;
}

.bd-user-container {
    padding-top: 73px !important;
    padding-bottom: 66px !important;
    margin-bottom: 57px !important;
}

.bd-administrator-btns {
    font-size: 15px;
    font-weight: normal;
    padding-top: 7px;
    padding-bottom: 7px;
}

.bd-home_title {
    color: #b0b0b0;
    font-family: "Century Gothic";
    font-size: 53px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: normal;
}

.bd-internal-title-con {
    padding-top: 73px !important;
    padding-bottom: 45px !important;
}

.bd-center {
    /*justify-content: center;*/
        padding: 10px 10px;
    display: block;
    text-align: center;
}

.bd-home-li .bd-home-li-inner .bd-new-project-text {
    margin-left: 13px;
}

.bd-new-project-item .bd-home-li-inner {
    background-color: #4a90e2;
}

.bd-new-project-item img {
    width: 16px;
}

.bd-home-li-inner p {
    color: #ffffff;
    font-family: "Century Gothic";
    font-size: 17px;
    font-weight: 400;
    font-style: normal;
    letter-spacing: normal;
}

.bd-sidebar-link {
    display: flex;
    align-items: baseline;
    padding-bottom: 5px;
}

.bd-sidebar-link p {
    margin-bottom: 6px;
}

.bd-sidebar-link p,
.bd-sidebar-link i {
    font-family: "Century Gothic";
    font-size: 17px;
    font-weight: 400;
    color: black;
}

.bd-img-container {
    background-repeat: no-repeat;
    height: 267px;
    background-size: cover;
    background-position: center center;
}

.bd-img-container-small {
    background-repeat: no-repeat;
    height: 100px;
    background-size: cover;
    background-position: center center;
}

.bd-home-content {
    max-width: 100%;
    margin-bottom: 50px;
}

.bd-main-inner {
    padding-left: 34px;
}

.bd-img-text-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    align-items: center;
}

.bd-img-text-container h3 {
    font-family: "Century Gothic";
    font-size: 42px;
    font-weight: 700;
    color: #c8dffe;
}

.bd-img-wrapper {
    margin-bottom: 51px;
}

.bd-img-wrapper-smaller {
    margin-bottom: 25px;
}

.bd-mr-14 {
    margin-right: 14px;
}

.bd-ml-14 {
    margin-left: 14px;
}

.bd-green-overlay {
    border-radius: 11px;
    background-color: rgba(15, 114, 52, 0.41);
}

.bd-blue-overlay {
    border-radius: 11px;
    background-color: rgba(44, 144, 220, 0.31);
}

.bd-blue-overlay-brighter {
    border-radius: 11px;
    background-color: rgba(37, 45, 65, 0.94);
}

.bd-status-badge {
    background-color: transparent !important;
    color: #212529;
}

.bd-sidebar-link .admin-icon {
    margin-left: 22px;
}

.bd-ml-22 {
    margin-left: 22px;
}

.bd-link-icon {
    margin-left: 22px;
}

.bd-user-project-title {
    padding-top: 49px !important;
    padding-bottom: 32px !important;
    margin-bottom: 40px !important;
}

.bd-remove-ep {
    padding: 0 !important;
    display: none !important;
}

.bd-login-inputs {
    background-color: white;
    color: #212529;
    border-radius: 5px !important;
    font-family: 'Century Gothic';
}

.bd-custom-btns a {
    color: #b0b0b0;
    font-family: "Century Gothic";
    font-size: 17px;
    font-weight: 400;
    padding: 10.5px 39px 10px 39px;
}

.bd-blue-dot,
.bd-green-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-left: auto;
}

.bd-blue-dot {
    background-color: #4a90e2;
}

.bd-green-dot {
    background-color: #0f7234;
}

.bd-sidebar-labels {
    font-family: "Century Gothic";
    font-size: 12px;
    font-weight: 400;
}

.bd-link-text {
    font-family: "Century Gothic";
    font-size: 17px;
    font-style: italic;
}

.bd-sidebar-benutzer {
    margin-top: 38px !important;
}

.bd-sidebar-roll {
    margin-top: 36px !important;
}

.bd-new-project-item {
    margin-bottom: 7px;
    margin-top: 4px;
}

.sidebar-powered-by {
    margin-bottom: 24px;
}

.bd-home-li {
    max-width: 100%;
}


/*Responsive design */

@media screen and (max-width: 1455px) {
    .bd-center {
            padding: 10px 10px;
    display: block;
    text-align: center;
    }
    .bd-new-project-item img {
        width: 13px;
    }
}

@media screen and (max-width: 1400px) and (min-width: 992px) {
    .bd-ml-22 {
        margin-left: 0;
    }
    .bd-sidebar-link .admin-icon {
        margin-left: 0;
    }
    .bd-sidebar-link p {
        font-size: 13px;
    }
    .admin-icon img {
        margin-right: 12px;
    }
    .bd-link-icon {
        margin-left: 0;
    }
    .bd-link-icon img {
        margin-right: 12px;
    }
}

@media screen and (max-width: 1318px) {
    .bd-administrator-td {
        display: table-cell;
    }
}

@media screen and (max-width: 1252px) {
    .bd-home-li-inner p {
        font-size: 13px;
        line-height: 2;
    }
    .bd-administrator-btns {
        font-size: 13px;
        line-height: 10px;
    }
}

@media screen and (max-width: 1276px) {
    .bd-login-btn {
        margin-bottom: 10px;
    }
}

@media screen and (max-width: 1073px) and (min-width: 992px) {
    .bd-home-li-inner {
        padding-left: 12px;
    }
}

@media screen and (max-width: 1070px) {
    .bd-login .bd-table-email {
        max-width: 323px;
        width: 100%;
    }
    .bd-login .bd-table-pass {
        max-width: 266px;
        width: 100%;
    }
}

@media screen and (max-width: 992px) {
    .bd-img-text-container h3 {
        font-size: 27px;
        font-weight: 400;
    }
    .bd-img-text-container-small h3 {
        font-size: 12px;
        font-weight: 400px;
    }
    .bd-administrator-btns {
        font-weight: 400;
    }
    .project-title,
    .bd-admin-title {
        font-size: 38px;
    }
    .bd-custom-btns a {
        padding: 10.5px 30px 10px 30px;
    }
}

button.side-bar-togle {
    display: none;
}

button.side-bar-clse {
    display: none;
}

@media screen and (max-width: 767px) {
    .bd-hamburger-btn {
        margin-bottom: 16px;
        margin-top: 15px;
    }
    .bd-settings-btn {
        margin-bottom: 12px;
    }
    .bd-navbar-brand {
        padding-left: 12px !important;
    }
    /* new css ham */
    .side-bar-togle {
        padding: 0.25rem 0.75rem;
        font-size: 1.25rem;
        line-height: 1;
        background-color: transparent;
        border: 1px solid white;
        transition: box-shadow .15s ease-in-out;
        border-radius: 7px;
        position: absolute;
        right: 10px;
        top: 30px;
        z-index: 99999;
    }
    .bd-vertical-bar {
        display: none;
    }
    div#navbar {
        display: block;
        text-align: center;
        margin-top: 20px;
    }
    .bd-hamburger-btn1 {
        display: none;
    }
    div#navbar .nav.navbar-nav.ms-auto {
        justify-content: center;
        gap: 10px;
    }
    div#navbar .nav.navbar-nav.ms-auto .nav-item {
        margin: auto;
        width: 90%;
    }
    #sidebarMenu.side-br-actvv {
        transition: 0.5s ease;
        left: 0;
    }
    #sidebarMenu {
        display: block;
        left: -100%;
        transition: 0.5s ease;
        z-index: 9999;
        top: 0;
        height: 100vh;
        overflow: scroll;
        padding-top: 20px;
        position: fixed;
    }
    .side-br-actvv>.position-sticky {
        position: relative !important;
    }
    .side-br-actvv>.position-sticky>.nav.flex-column a {
        padding-top: 0;
    }
    .side-br-actvv>.position-sticky>.nav.flex-column .bd-sidebar-roll {
        margin-top: 20px !important;
    }
    .side-bar-clse {
        position: absolute;
        right: 8px;
        top: 0px;
        font-size: 1.25rem;
        line-height: 1;
        background-color: transparent;
        transition: box-shadow .15s ease-in-out;
        border-radius: 7px;
        position: absolute;
        z-index: 99999;
        border: 0;
        color: white;
        padding: 0;
    }
    .side-bar-clse>.navbar-toggler-icon {
        color: white;
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .side-bar-clse>.navbar-toggler-icon::before {
        content: 'X';
        position: absolute;
        right: 0;
        font-size: 24px;
    }
    nav.navbar.navbar-expand-md.navbar-dark.fixed-top.bg-dark.bd-navbar {
        position: relative;
    }
    .main-res-clss .row>main {
        margin-top: 0 !important;
    }
    .main-res-clss .bd-main-inner {
        padding-left: 0;
    }
    .main-res-clss .bd-main-inner .bd-internal-title-con {
        justify-content: center !important;
        padding-top: 20px !important;
        padding-bottom: 0 !important;
        margin-bottom: 0 !important;
    }
    .main-res-clss .bd-ml-14 {
        margin: 0;
    }
    .main-res-clss .bd-mr-14 {
        margin: 0;
    }
    .main-res-clss .bd-home-content>.row.row-cols-2 {
        gap: 30px;
    }
    .main-res-clss .bd-home-content .bd-img-container-small {
        height: auto;
    }
    .main-res-clss .bd-home-content .bd-img-container {
        border-radius: 15px;
    }
    #cookie-popup .cookie-consent {
        flex-wrap: wrap;
        height: auto;
        gap: 10px;
        padding: 10px 0;
    }
    #cookie-popup .cookie-consent span {
        text-align: center;
    }
    button.side-bar-togle {
        display: block !important;
    }
    button.side-bar-clse {
        display: block !important;
    }
}
/* Alle CSS Styles zum Baufortschritt (NEU) */
.row-margin-spaces {
    margin-left: 3%;
    margin-right: 3%;
}
.row-top-spaces{
    margin-top: 5%;
}
.col-margin-spaces {
    margin-left: 3%;
    margin-right: 3%;
}
.btn-spaces{
    margin-top: 2%;
    margin-bottom: 10%;
}

#project-id-info{
    margin-top: 3%;
    margin-right:6%;
    margin-bottom: 1%;
}

@media (min-width: 992px) {
    .res-w-50 {
        width: 50%;
    }
}

/* Baufortschritt Button Red Status 1 */
.bau-red {
    padding: 4%;
    background-color: #BB2D3B !important;
    color: white !important;
    height: 150px;
}
.bau-red:hover {
    background-color: #d54754 !important;
    color: white !important;
}

.bau-red-change {
    border: 2px solid black !important;
    border-color: #BB2D3B !important;
}
.bau-red-change:hover {
    border: 2px solid black !important;
    border-color: #d54754 !important;
    background-color: #d54754 !important;
    color: white !important;
}

/* Baufortschritt Button Lightblue Status 2 */
.bau-lightblue {
    padding: 4%;
    background-color: #01BDFB !important;
    color: white !important;
    height: 150px;
}
.bau-lightblue:hover {
    background-color: #68cffc !important;
    color: white !important;
}

.bau-lightblue-change {
    border: 2px solid black !important;
    border-color: #01BDFB !important;
}
.bau-lightblue-change:hover {
    border: 2px solid black !important;
    border-color: #68cffc !important;
    background-color: #68cffc !important;
    color: white !important;
}

/* Baufortschritt Button Blue Status 3 */
.bau-blue {
    padding: 4%;
    background-color: #0200FB !important;
    color: white !important;
    height: 150px;
}
.bau-blue:hover {
    background-color: #6766f3 !important;
    color: white !important;
}

.bau-blue-change {
    border: 2px solid black !important;
    border-color: #0200FB !important;
}
.bau-blue-change:hover {
    border: 2px solid black !important;
    border-color: #6766f3 !important;
    background-color: #6766f3 !important;
    color: white !important;
}

/* Baufortschritt Button Orange Status 4 */
.bau-orange {
    padding: 4%;
    background-color: #FFA526 !important;
    color: white !important;
    height: 150px;
}
.bau-orange:hover {
    background-color: #f8bc67 !important;
    color: white !important;
}

/* Baufortschritt Button Yellow Status 6 */
.bau-yellow {
    padding: 4%;
    background-color: #FFCA2D !important;
    color: black !important;
    height: 150px;
}
.bau-yellow:hover {
    background-color: #fcce77 !important;
    color: black !important;
}

/* Baufortschritt Button Red Dark Status 7 */
.bau-red-dark {
    padding: 4%;
    background-color: #641a20 !important;
    color: white !important;
    height: 150px;
}
.bau-red-dark:hover {
    background-color: #773c42 !important;
    color: white !important;
}

/* Baufortschritt Button Green Status 8 */
.bau-green {
    padding: 4%;
    background-color: #0E7234 !important;
    color: white !important;
    height: 150px;
}
.bau-green:hover {
    background-color: #287040 !important;
    color: white !important;
}

/* Baufortschritt Button Green Status 9*/
.bau-newblue {
    padding: 4%;
    background-color: #0BCAF0 !important;
    color: black !important;
    height: 150px;
}
.bau-newblue:hover {
    background-color: #03cffa !important;
    color: black !important;
}

/* Baufortschritt Button Gray Disabled */
.bau-gray {
    padding: 4%;
    cursor: default !important;
    background-color: #D3D3D3 !important;
    color: white !important;
    height: 150px;
}

.bau-accordion{
    font-size: 13px !important;
    width: 90% !important;
}

.bau-accordion-button {
    font-size: 15px !important;
    padding: 7px 20px 7px 20px !important;
}

.bau-delete-button-create-3 {
    width: 7em;
    height: 3em;
}

/* FAQ CSS */
#accordionFAQ{
    margin-bottom: 15em;
}
.header_faq_ueberschrift{
    font-size: 19px;
}