.h1 {
    font-size: 32.4px;
    font-weight: 700;
    line-height: normal;
    margin-top: 20px;
    margin-bottom: 10px;
    color: #e30613;
}

.h2 {
    font-size: 28px;
    color: #e30613;
    font-family: 'Noto Sans Bold', sans-serif;
}

.h3 {
    font-size: 21px;
    font-weight: 700;
}

.h4 {
    font-size: 19.8px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#header {
    background-color: rgba(255, 255, 255, 0.7);
}

#header .container.paddings-0 {
    padding: 0!important;
}

hr {
    margin: 0;
    height: 10px;
    border-top: 0;
}

hr.gradient {
    background: -webkit-linear-gradient(0deg, #6abfa2 0%, #6abfa2 20%, #6abfa2 21%, #c48d4d 38%, #c68449 43%, #cc6b3e 52%, #d5432d 64%, #e20c15 77.66%, #e30613 80%);
}

input.btn.gradient,
span.btn.gradient,
a.btn.gradient {
    background: -webkit-linear-gradient(-60deg, #6abfa2 0%, #6abfa2 20%, #6abfa2 21%, #c48d4d 43%, #c68449 48%, #cc6b3e 52%, #d5432d 64%, #e20c15 77.66%, #e30613 80%);
    color: #fff;
}
input.btn.gradient:hover,
span.btn.gradient:hover,
a.btn.gradient:hover {
    color: #fff;
    opacity: 75%;
}
a.btn-primary {
    background-color: rgba(0, 114, 105, 1);
    color: rgba(207, 236, 233, 1);
}
a.btn-primary:hover {
    background-color: rgba(0, 114, 105, 1);
    opacity: 75%;
    color: #fff;
}
span.btn-secondary,
a.btn-secondary {
    background-color: rgba(106, 191, 162, 1);
    color: #fff;
}
span.btn-secondary:hover,
a.btn-secondary:hover {
    opacity: 75%;
    color: #fff;
}


.panel {
    border-color: #e7e7e7;
}

.progress-text {
    font-weight: bold;
}

.progress-text > .value {
    display: inline-block;
    min-width: 28px;
}

/*##### text ######*/

#header ul.nav.navbar-nav a {
    color: #333333;
}
#header ul.nav.navbar-nav.navbar-left.main-menu {
    padding-left: 15px;
}
#header ul.nav.navbar-nav.navbar-left.main-menu li {
    margin: 0 7px;
}
#header ul.nav.navbar-nav.navbar-left.main-menu a {
    text-transform: uppercase;
}

#header .nav > li > a {
    padding: 10px 10px;
    transition: background .3s;
}

#header .header-logo {
    position: relative;
}
#header .header-logo img {
    position: absolute;
    top: -4px;
}
#header .user-menu-wrapper {
    display: table;
}
#header .search-menu #search-item ul.dropdown-menu {
    padding: 15px;
    text-align: center;
    border-radius: 5px;
}

#header ul.nav.navbar-nav a.navbar-link {
    color: #fff;
    margin-left: 8px;
    padding-left: 20px;
    padding-right: 20px;
}


#features img{
    margin: auto;
}

.project-item .item-image-wrapper {
    height: 228px;
    overflow: hidden;
}

@media (min-width: 768px) and (max-width: 991px) {
    .project-item .item-image-wrapper {
        height: 174px;
    }
}

@media (max-width: 767px) {
    .project-item .item-image-wrapper {
        height: auto;
    }

    .project-item .project-image {
        position: static;
        -ms-transform: none;
        -webkit-transform: none;
        transform: none;
    }
}

.project-link {
    background-color: #ddd;
    display: block;
    height: 100%;
    position: relative;
    width: 100%;
}

.project-image {
    left: 50%;
    margin-right: -50%;
    position: absolute;
    top: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 100%;
}

.link-more {
    color: #333333;
}
.link-more:hover {
    color: #333333;
}

#footer {
    margin-top: auto;
    font-size: 14px;
    background-color: #f7f7f7;
}
#footer .socials {
    margin-bottom: 20px;
}
#footer a {
    font-size: 12px;
    color: #333333;
}
#footer .footer-nav-header {
    font-weight: bold;
    padding-bottom: 20px;
}
#footer .footer-nav {
    list-style: none;
    margin-bottom: 20px;
    padding:0;
}
#footer .ips-privacy-seal {
    float: right;
    width: 104px;
    margin-bottom: 20px;
}
#footer .logo-and-socials {
    margin-bottom: 20px;
}
#footer p {
    font-size: 12px;
    color: #333333;
    line-height: 18px;
    margin: 0 10px;
}
#footer .powered-by {
    border-top: 1px solid #d0d0d0;
    margin-bottom: 20px;
    padding-top: 20px;
    margin-top: 10px;
}
#footer .powered-by-logo {
    margin-left: 3px;
    max-width: 112px;
}


/*### startpage START ###*/

section#slider{
    position: relative;
}
section#slider h1{
    font-family: SansaBold, sans-serif;
}
section#slider .image-box{
    position: absolute;
    height: 437px;
    width: 100%;
    z-index: -1;
    top:0;
    left: 0;
}
section#slider .image-box img{
    height: 437px;
    width: 100%;
    border-bottom: 1px solid #4AA6F9;
    object-fit: cover;
    -o-object-fit: cover;
    object-position: center;
    -o-object-position: center;
}
section#slider .image-overlay{
    position: relative;
    top: 0;
    left: 50%;
    height: 437px;
    background: rgba(255, 255, 255, .8);
    padding: 27px;
    width: 615px;
    text-align: center;
}
section#slider .image-overlay h1 {
    font-size: 35px;
    color: rgba(0, 0, 0, 0.85);
    text-transform: uppercase;
}
section#slider .image-overlay p {
    padding: 20px 0;
}
section#slider .image-overlay a {
    display: block;
    text-align: center;
}
section#slider .image-overlay ol {
    background: rgba(255, 255, 255, 1);
    padding: 45px 32px;
}
section#slider .image-overlay li {
    text-align: center;
    list-style: none;
    line-height: 20px;
    height: 100px;
    color: #333;;
    font-size: 15px;
    padding-top: 60px;
    background-position: top center;
    background-repeat: no-repeat;
}
section#slider .image-overlay #image-overlay-mail {
    background-image: url('/images/image-overlay-mail.png');
}
section#slider .image-overlay #image-overlay-voucher {
    background-image: url('/images/image-overlay-voucher.png');
}
section#slider .image-overlay #image-overlay-support {
    background-image: url('/images/image-overlay-support.png');
}
section#slider .image-overlay p#image-overlay-link {
    display: none;
    padding: 0;
}
section#slider .image-overlay p#image-overlay-link span{
    font-size: 10px;
    display: inline-block;
    padding: 2px 5px;
}

#projects-location .content-projects-location > div:first-child {
    width: 535px;
    height: 360px;
    background-color: #cccccc;
}
#projects > div{
    flex-wrap: wrap;
}
#how-it-works .steps {
    flex-wrap: wrap;
}
#how-it-works .steps .step {
    min-height: 393px;
}
#how-it-works .steps .step .panel{
    border-radius: 10px;
    border:1px solid #cecece;
}
#how-it-works .steps .step>div:last-child>a {
    flex-grow: 1;
    color: inherit;
    text-decoration: none;
}
#how-it-works .steps .step>div:last-child>a:focus {
    outline: 0;
}

#how-it-works .step>div:last-child {
    display: none;
    flex-direction: column;
    opacity:0
}
#how-it-works .step>div:first-child {
    display: block;
    opacity:1
}
/*### startpage END ###*/

/*### detail.phtml START ###*/
#details {
    color: #333333;
}
#details p {
    line-height: 1.69;
    font-family: 'Noto Sans', sans-serif;
    color: #333333;
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
}
#details p > a {
    color: #333;
}
#details .progress.fix-height {
    height: 26px;
}
    #details #project,
    #details #commentsBlock,
    #details #supporters {
        border: 0;
    }
    #details #project.panel {
        box-shadow: none;
    }
    .project-thumbnails > img {
        float: left;
        height: 100px;
        max-width: 20%;
        padding: 5px 2px 5px 3px;
    }
    .project-thumbnails > img.active {
        cursor: pointer;
    }
    #project-images {
        max-height: 565px;
    }
    #project-image-wrapper > img {
        /*max-height: 451px;*/
        width: 100%;
        padding: 0 3px 0;
    }
    #project-image-wrapper .project-banner {
        right: -2px;
        top: -9px;
    }
    .project-banner {
        background: url(/images/project_banner.png) no-repeat;
        height: 170px;
        position: absolute;
        right: -10px;
        top: -10px;
        width: 170px;
        z-index: 99;
    }
    .project-banner-text {
        color: #fff;
        font-size: 13px;
        font-weight: 700;
        height: 40px;
        left: 36px;
        position: absolute;
        top: 48px;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        text-align: center;
        transform: rotate(45deg);
        width: 140px;
    }
/*### modals ###*/

.modal-toolbar .signal {
    /*demo styles*/
    /* height: 80px;
    width: 80px;  */
    margin: auto;
    margin-top: -73px;
    /* background: white;  */
    /* border: 1px solid red; */
    /* border-radius: 50%; */
}

.modal-toolbar button {
    position: absolute;
    font-size: 30px;
    font-weight: 100;
    right: 30px;
}
.custom-modal .modal-info .inputs-container label {
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
}
.custom-modal .modal-info .inputs-container input {
    border: none;
    border-bottom: 1px solid #414141;
    outline: none;
}
.custom-modal .modal-info .inputs-container .input-wrapper {
    position: relative;
}
.custom-modal .modal-info .inputs-container .input-wrapper .placeholder-right-euro {
    position: absolute;
    right: calc(100% - 67%);
    color: #9c9d9d;
}
.custom-modal .modal-info .inputs-container .donation-info input {
    width: 50%;
}
.custom-modal .modal-info .inputs-container .donation-info .placeholder-right-euro {
    position: absolute;
    right: calc(100% - 50%);
}

/*### sidebar ###*/

#details .first-block,
#details .second-block,
#details .third-block {
    border: 1px solid #cecece;
}

#details #donation-block .progress.inner {
    color: white;
    line-height: 20px;
}

#details .supporters {
    font-size: 14px;
    #border-bottom: 1px solid #cecece;
}
#details #donation-block .donation-amount-container {
    width: 100%;
    position: relative;
}
#details #donation-block .balance {
    line-height: 12px;
    font-size: 12px;
    color: #9c9d9d;
    font-weight: bold;
    padding-top: 10px;
}
#details #donation-block .coupon input,
#details #donation-block .coupon .wrap-doctrine-autocomplete {
    width: 100%;
}
#details p.doctrine-autocomplete-msg {
    margin-top: 5px;
    margin-bottom: 0;
}
#details .coupon p.text-danger,
#details .coupon .doctrine-autocomplete-msg {
    font-size: 12px;
    padding-top: 10px;
    margin: 0;
}
#details .coupon p.text-danger {
    color: #e30613;
    font-weight: bold;
}
#details .bg-warning, #details .bg-success {
    background-color: #fff;
}
#details .bg-warning input {
    border: 1px solid #e30613;
}
#details .bg-success input {
    border: 1px solid #62b32c;
}

#details .icon-check-container {
    right: 0;
    top: 31px;
}
#details .fa-warning {
    color: #e30613;
}
#details .fa-check {
    color: #62b32c;
}
#details #donation-block .coupon .bg-warning .placeholder-right-euro {
    color: #e30613;
}
#details #donation-block .coupon .bg-success .placeholder-right-euro {
    color: #62b32c;
}

#details #donation-block .coupon .wrap-doctrine-autocomplete input {
    width: 100%;
    display: inline-block;
}


#details #donation-block .coupon .placeholder-right-euro {
    position: absolute;
    right: 0;
    top: 32px;
    color: #9c9d9d;
}
#details #donation-block .user-information .user-name {
    font-size: 16px;
    letter-spacing: 0.3px;
    padding: 0 0 0 10px;
}

#details #donation-block .category .category-btns a {
    background:#d1d1d1;
    color: inherit;
    padding: 8px 27px;
    text-decoration: none;
    transition: background .3s;
}
#details #donation-block .category .category-btns a:not(:first-child) {
    margin-top: 10px;
}
#details #donation-block .category .category-btns a:hover {
    background-color: #adadad;
    color: #fff;
}
/*### sidebar ###*/

#details .current-image {
    display: flex;
    overflow: hidden;
}
#details .current-image img {
    min-width: 100%;
    position: relative;

}
#details .current-image .slider-arrow {
    z-index: 1000;
}
#details #slider .current-image .prev-image {
    position: absolute;
    color: #fff;
    height: 100%;
    font-size: 1.88em;
    font-weight: 800;
    cursor: pointer;
}

#details #slider .current-image .next-image {
    position: absolute;
    color: #fff;
    height: 100%;
    font-size: 1.88em;
    font-weight: 800;
    right: 0;
    top: 0;
    cursor: pointer;
}

#details #slider .current-image .next-image:hover>span,
#details #slider .current-image .prev-image:hover>span
 {
    transition: all 100ms;
    -webkit-filter: drop-shadow(0 0 3px black);
    filter: drop-shadow(0 0 3px black);
}

#details #slider .all-images .thumb-image {
    width: 19.5%;
    transition: all .2s;
}
#details #slider .all-images .thumb-image:not(.active) {
    filter: brightness(70%);
}

/*### caption tabs*/

/*### first tab ###*/
#details #project-description p:last-child {
    padding-bottom: 50px;
}

/*### second tab ###*/
.starter>.comment-content {
    background-color: #f5f5f5;
}

.comment-content {
    border-bottom: 1px solid #d9e0e8;
    padding: 20px 10px;
}
.comment-content {
    border-bottom-color: #ccc;
}
.comment-content a {
    color: #333;
    font-size: 14px;
}
#avatar-img {
    margin-bottom: 20px;
}
.comment-avatar {
    float: left;
    height: 80px;
    width: 80px;
}
.comment-info {
    display: flex;
    justify-content: space-between;
    margin-left: 100px;
}
.comment-info .name a, .comment-body .comment-more {
    font-weight: 600;
}
.comment-info .date {
    font-style: italic;
    font-size: 14px;
}
.comment-body {
    margin: 20px auto 25px 100px;
    font-size: 14px;
}
.comment-text-image {
    padding-left: 100px;
}
.comment-footer {
    margin-top: 10px;
    text-align: right;
}
.comment .comments {
    margin: 10px 0 30px 60px;
}
.comment .project-subcomments-form {
    margin-bottom: 60px;
    margin-top: 20px;
}
.project-comments-form .link-icon, .project-subcomments-form .link-icon {
    color: #666;
    font-weight: 600;
    margin-top: 14px;
}

/*### third tab ###*/
#details .supporters-list ul {
    border: 1px solid #cecece;
}
#details .supporters-list ul li {
    padding: 5px 15px 5px 10px;
}
#details .supporters-list ul li:not(:last-child) {
    border-bottom: 1px solid #cecece;
}
#details .supporters-list ul li .supporter-name,
#details .supporters-list ul li .price
{
    font-size: 18px;
}
#details .supporters-list a {
    color: #333;
}
/*### project share ###*/
#details #project-share label {
    font-weight: normal;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: 0.3px;
}

.popover {
    color: #333;
}
.popover .popover-title {
    background-color: rgb(232, 232, 232);
    color: rgb(51,51,51);
    font-style: normal;
    font-weight: 400;
}

/*### detail.phtml END ###*/

/*### create.phtml START ###*/
#create p {
    margin-bottom: 30px;
    letter-spacing: 0.2px;
    color: #333333;
}
/*### create.phtml END ###*/

/*### created.phtml START ###*/
#created p {
    color:#333333;
    line-height: 1.5;
    letter-spacing: 0.2px;
}
/*### created.phtml START ###*/

/*### settings.phtml START ###*/
#settings label {
    font-size: 14px;
    margin-bottom: 10px;
}

#settings input:not([type="submit"]) {
    padding: 5px 15px;
    width: 100%;
}

#personal-settings form:not(:last-of-type) {
    border-bottom: 2px solid #cecece;
}

.image-actions-and-descriptions ul {
    list-style: none;
    font-size: 14px;
}

.image-actions-and-descriptions .actions > ul > li {
    font-weight: bold;
}

.image-actions-and-descriptions .actions > ul > li .btn {
    color: #333;
    font-size: 14px;
    padding: 0;
}
/*### settings.phtml END ###*/

/*### account.phtml START ###*/
#account #profile-info .profile-avatar {
    width: 63px;
    height: 63px;
    border: 1px solid #979797;
    border-radius: 50%;
    overflow: hidden;
}
#account #statistik .statistik-content h3 {
    margin: 13px 0 0 2px;
}
.statistik-content:not(:first-child) {
    margin-top: 20px;
}
.statistik-content:not(:last-child) {
    padding-bottom: 20px;
}
.statistik-content:not(:last-child):after {
    content: "";
    position: relative;
    height: 1px;
    bottom: -20px;
    left: 0;
    width: 92%;
    background: #cecece;
}

#account #beobachtet,
#account #unterstützt {
    border: 0;
}

/*### account-organisation.phtml ###*/
#account #organisation-links .links a {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
/*### account-organisation.phtml ###*/

/*### account.phtml END ###*/

/* project status */
.project-overlay-status-finished{
    background-color: rgba(43,83,126,.8);
}
.project-overlay-status-examination {
    background-color: rgba(204,204,204,.8);
}
.project-overlay-status-processing {
    background-color: rgba(187,179,171,.8);
}

.project-overlay {
    bottom: 5px;
    height: 96.5%;
    left: 5px;
    padding: 5px;
    position: absolute;
    right: 5px;
    top: 0;
    z-index: 50;
}
.project-overlay-status {
    color: #fff;
    font-size: 26px;
    font-weight: 700;
    margin-top: -60px;
    position: relative;
    text-align: center;
    top: 50%;
}
.project-overlay-button, .project-overlay .btn {
    margin-top: 25px;
    position: relative;
    top: 50%;
}
/* project status */

/*### create-progress.phtml START ###*/
#create-progress p {
    font-size: 14px;
}
#create-progress label {
    font-size: 14px;
    margin-bottom: 10px;
    cursor: pointer;
}
#create-progress #step5 label {
    margin-bottom: 0;
}

#create-progress hr {
    margin: 30px auto 10px;
}

#create-progress .donat-duration .days, #create-progress .radio-elements {
    flex-flow: row wrap;
}

#create-progress .icon-check-container {
    position: absolute;
    color: #62b32c;
    top: 10px;
    right: 16px;
}
#create-progress .input-wrapper {
    position: relative;
}
#create-progress .textarea-wrapper {
    position: relative;
}
#create-progress .textarea-wrapper .icon-check-container {
    top: 13px;
    right: 15px;
}

#create-progress .project-subject-areas {
    display: flex;
    flex-flow: row wrap;
}

#create-progress .project-subject-areas label {
    margin-bottom: 0;
    flex-grow: 1;
}

#create-progress .link-to-project .links-actions {
    padding: 6px 15px;
}

#create-progress .link-to-project .links-actions a {
    text-decoration: none;
    font-size: 14px;
}

#create-progress .subject-area {
    background: #e8e8e8;
    font-weight: normal;
    display: flex;
    border: 1px solid transparent;
    align-items: center;
    padding: 4px 9px;
    flex-basis: 32%;
    margin-right: 11px;
    min-width: 300px;
    margin-bottom: 10px;
}
#create-progress .subject-area.choosed {
    background-color: #d6d6d6;
    border: solid 1px #62b32c;
}

#create-progress .next-previous-step-btns {
    flex-flow: row wrap;
}
/*### create-progress.phtml END ###*/

/*### get-projects.phtml START ###*/
#filtersContainer .border-0 {
    border: 0;
}
#filtersContainer #filters .header {
    font-weight: bold;
    padding-left: 12px;
}
#filtersContainer #filters .project-tag {
    padding: 10px;
    background-color: #f5f5f5;
    font-weight: bold;
    color: #333;
    text-decoration: none;
}

#filtersContainer #filters .project-tag:hover, #filtersContainer #filters .project-tag.active {
    transition: background .2s;
    background-color: #a9a9a9;
}
#filtersContainer #filters .project-tag:not(.alle) {
    margin-top: 10px;
}

#header-links {
    text-align: right;
}
#header-links .header-link a {
    text-decoration: none;
    color:#333;
    font-size: 14px;
}
#header-links .header-link a span:first-child {
    font-size: 20px;
    margin-right: 5px;
}


/*### get-projects.phtml END ###*/

/*### show-faq-list.phtml START ###*/
#faq-list .faq dd {
    display: none;
}
#faq-list .faq dt {
    padding: 0.5em 1em;
    background: #cecece;

}
#faq-list .faq dt span.minus {
    display: none;
}
#faq-list .faq.open dt span.plus {
    display:none;
}
#faq-list .faq.open dt span.minus {
    display: block;
}
/*### show-faq-list.phtml END ###*/

/*### organisation page START ###*/
#einstellugen label {
    font-size: 14px;
}
#einstellugen label input[name="organisation[organisationLegalForm]"] {
    margin: 4px 3px 4px 5px;
}
#einstellugen h3 {
    font-weight: normal;
}
/*### organisation page START ###*/

/*### organisation-list page START ###*/
.organisation {
    border: 1px solid #ccc;
    display: table;
}
.organisation .organisation-image-container {
    border-radius: 0;
    transition: border .3s;
}
.organisation .organisation-image-container:hover {
    transition: border .3s;
    border: 1px solid #505258;

}

.organisation .organisation-description {
    color: #666;
    font-size: 14px;
}

/*### organisation-list page END ###*/

/*### donation.phtml START ###*/
.donation-moreinfo .content,
.donation-moreinfo.nontop .content
{
    border: 1px solid #cecece;
}
#donation-light .text {
    line-height: 50px;
}
#donation-light .icon {
    color: #505258;
    float: left;
    font-size: 36px;
    margin: 6px 10px 0 0;
    padding-left: 5px;
}
#donation-light .icon.icon-timer {
    font-size: 28px;
    margin: 8px 10px 0 0;
}
.donation-moreinfo .donation-info#donation-progress .progress {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.donation-moreinfo .donation-info {
    font-weight: bold;
    font-size: 14px;
    line-height: 1.5em;
    height: 40px;
}
.donation-photo, .avatar {
    float: left;
    margin-right: 20px;
    max-width: 280px;
}

.donation-moreinfo .donation-info#donation-supporters,
.donation-moreinfo .donation-info#donation-amount {
    border-right: 1px solid #cecece;
}

.donation-moreinfo .donation-info span.count {
    font-size: 20px;
}

.donation-moreinfo.nontop .content {
    border-top: 0;
}
/*### donation.phtml END ###*/
/*### donation steps START ###*/
.donation-moreinfo .content p {
    font-size: 14px;
    line-height: 1.3em;
}
.donation-moreinfo .content input.sumd {
    padding: 3px 5px!important;
}
.donation-moreinfo .content #donation-currency {
    line-height: 33px;
    color: #9c9d9d;
}
.donation-moreinfo .header {
    font-weight: 700;
}
.donation-moreinfo .infolabel {
    font-size:18px;
    font-weight: bold;
}

.donation-moreinfo #support-form label {
    margin-bottom: 10px;
}
.donation-moreinfo #secure-donation img, #secure-donation-left img {
margin-bottom: 0;
margin-top: 5px;
margin-right: 15px;
}

.donation-moreinfo #support-form label {
    margin-bottom: 10px;
}

/*### donation steps END ###*/


/*### login-page START ###*/
#login_container input[type="submit"][value="Einloggen"] {
    width: 60%;
}
#user-login ul[role="tablist"] li {
    margin-bottom: 0;
    margin-right: 10px;
}
#user-login ul[role="tablist"] li:after {
    content: "";
    position: absolute;
    height: 5px;
    width: 50%;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    background: #e30613;
}
#user-login ul[role="tablist"] li:not(.active):after {
    display: none;
}
#user-login ul[role="tablist"] li>a {
    letter-spacing: 0.2px;
    border-radius: 0;
    color: #333;
    background-color: #f4f4f4;
}
#user-login ul[role="tablist"] li.active>a {
    background-color: #e9e9e9;
}

#spender-registration label {
    font-size: 14px;
}

#spender-registration .checkbox a, #projekttraeger-registration .checkbox a{
    font-weight: bold;
}

/*### login-page END ###*/

/* test mobile menu */

.mobile-nav-container {
    position: relative;
    display: none;
}
.mobile-nav-container .icons {
    display: inline-block;
    font-size: 24px;
}
/* test mobile menu */

/*### MEDIA STYLES START ###*/
@media (max-width: 767px) {
    /*### common ###*/

    /*tabs*/
    #details #project,
    #details #commentsBlock,
    #details #supporters,
    #account #beobachtet,
    #account #unterstützt {
        display: block!important;
    }

    #details #project>a,
    #details #commentsBlock>a,
    #details #supporters>a,
    #account #beobachtet>a,
    #account #unterstützt>a {
        padding: 10px;
        border-radius: 10px;
        border: 1px solid #cecece;
        text-decoration: none;
        color: #333;
        text-align: center;
        font-size: 14px;
        font-weight: bold;
    }
    #details #project>a[aria-expanded="true"],
    #details #commentsBlock>a[aria-expanded="true"],
    #details #supporters>a[aria-expanded="true"],
    #account #beobachtet>a[aria-expanded="true"],
    #account #unterstützt>a[aria-expanded="true"] {
        background: #e30613;
        color: #fff;
    }
    /*tabs*/

    /*### common ###*/

    /*### startpage start ###*/
    section#slider div.image-box{
        height: 340px;
    }

    #features div.text-center h4{
        font-size: 16px;
    }

    #newest-projects .new-projects-text {
        margin-top: 20px;
        text-align: left;
    }


    #how-it-works .step {
        min-height:200px;
    }

    #link-all-projects {
        margin: 16px 0 8px;
        text-align: left;
    }
    /*### startpage end ###*/
    /*### details.phtml start ###*/




    /*### details.phtml end ###*/
    /*### account.phtml start ###*/
    #account {
        text-align: center;
    }
    #account #statistik .statistik-content>div:not(:first-child) {
        margin-top: 20px;
    }
    .statistik-content:not(:last-child):after {
        width: 100%;
    }
    /*### account.phtml end ###*/

    /*### layout.phtml start ###*/
    /*  test mobile menu  */
    .custom-collapse {
        display: none;
        margin-top: 10px;
    }
    .custom-collapse .main-menu {
        padding-left:0!important;
    }
    .custom-collapse .main-menu, .custom-collapse .search-menu {
        margin: 0;
    }
    .custom-collapse .main-menu li, .custom-collapse .search-menu li {
        border-top: 1px solid #cecece;
        margin: 0!important;
    }
    .mobile-nav-container {
        display: block!important;
    }
    #header{
        padding-bottom: 5px;
    }
    #header .mobile-nav-container .top-part {
        position: absolute;
        top: -22px;
        height: 22px;
        display: flex;
        justify-content: center;
    }
    #header .mobile-nav-container .top-part .mobile-header-logo img {
        height: 100%;
    }
    #header .mobile-nav-container .bottom-part {
        padding: 15px 10px 0 15px;
    }
    #header .mobile-nav-container .bottom-part .icons span:last-child {
        display: none;
    }
    #header .mobile-nav-container .bottom-part .mobile-user-menu {
        margin: 0;
    }

    .mobile-nav-container li>a:hover, .mobile-nav-container li>a:focus,
    .mobile-nav-container .open>a, .mobile-nav-container .open>a:hover, .mobile-nav-container .open>a:focus {
        background: transparent;
    }

    #header .mobile-nav-container .bottom-part .mobile-user-menu #login-menu {
        position: static;
        display: inline-block;
        vertical-align: sub;
    }
    #header .mobile-nav-container .bottom-part .mobile-user-menu #login-menu>a {
        padding: 0!important;
        font-size: 12px;
    }
    #header .mobile-nav-container .bottom-part .mobile-user-menu #login-menu>a>span:not(.login-name){
        font-size: 17px;
        margin-right: 5px;
    }
    #header .mobile-nav-container .bottom-part .mobile-user-menu #login-menu .dropdown-menu li,
    #header .mobile-nav-container .bottom-part .mobile-user-menu #login-menu .dropdown-menu a {
        padding: 2px 0;
    }
    #header .mobile-nav-container .bottom-part .mobile-user-menu .open .dropdown-menu {
        padding: 0.6em;
        position: absolute;
        left: auto;
        right: 20px;
        background: rgb(255,255,255);
        box-shadow: -1px 1px 3px #333;
    }
    #header .user-menu-wrapper {
        width: 100%;
    }

    /*  test mobile menu  */

   #footer .q {
        flex-wrap: wrap;
    }
    /*### layout.phtml end ###*/
     /*### feedback page start ###*/
    .donation-photo {
        float: none;
        margin-bottom: 20px;
    }
    /*### feedback page end ###*/
}


@media (max-width: 991px) {
    .panel-responsive .collapse{
        display: none;
    }
    .panel-responsive .collapse.in{
        display: block;
    }
    /*### index.phtml start ###*/
    section#slider .image-box{
        height: 520px;
    }
    #features{
        margin: 70px auto;
    }

    #how-it-works .steps>div {
        justify-content: center;
    }
    #how-it-works .steps>div:last-child {
        padding-top: 30px;
    }
    #how-it-works .step>div:last-child {
        display: block!important; /* see #10564 */
        flex-direction: column;
        opacity:1!important;
    }
    #how-it-works .step>div:first-child {
        display: none!important; /* see #10564 */
        opacity:0!important;
    }

    #projects-location .content-projects-location {
        flex-wrap: wrap;
        flex-direction: column-reverse;
        align-items: center;
    }
    #projects-location .content-projects-location>div:first-child {
        width: 100%;
    }
    #projects-location .content-projects-location>div:last-child {
        margin-bottom: 30px;
    }


    /*### index.phtml end ###*/

    /*### layout.phtml start ###*/
    #header .header-logo img {
        top:2px;
    }
    #header .search-menu #search-item ul.dropdown-menu {
        left: 0;
        right: auto;
    }
    /*#footer .logo-and-socials > .socials {
        display: flex;
        flex-flow: row wrap;
    }*/
    #footer .logo-and-socials>.socials > p {
        margin-right: 10px;
    }
    /*### layout.phtml end  ###*/

     /*### account.phtml start###*/
     #account #statistik .statistik-content > div:nth-child(2) > h3 {
         margin-bottom: 37px;
     }
     #account #statistik .statistik-content > div:nth-child(3),
     #account #statistik .statistik-content > div:nth-child(4) {
         margin-top: 20px;
     }
     /*### account.phtml end###*/

     /*### feedback page start ###*/
     #donation-light .donation-info {
         margin-bottom: 20px;
     }
     /*### feedback page start ###*/
}

@media (max-width: 767px) {
    .md-pt-200 {
        padding-top: 50px;
    }

    section#slider .image-overlay p#image-overlay-link {
        display: block;
        position: relative;
        top: -58px;
    }

    section#slider .image-overlay ol {
        list-style-type: none;
        padding: 30px;
    }

    section#slider .image-overlay li {
        text-indent: 200%;
        white-space: nowrap;
        overflow: hidden;
    }

    #footer .footer-nav-header {
        padding-bottom: 10px;
    }

    /*#footer .footer-nav {*/
    /*    margin-bottom: 20px;*/
    /*}*/

    #footer .ips-privacy-seal {
        float: none;
        width: 104px;
    }
}

@media (min-width: 768px) and (max-width: 990px) {
    .md-pt-200 {
        padding-top: 100px;
    }
}
@media (min-width: 991px) {
    .md-pt-200 {
        padding-top: 70px;
    }
}

@media (max-width: 1199px) {

    section#slider .image-overlay {
        left: 0;
        width: 100%;
    }
}
.padding-right-xs { padding-right: .25em; }
.padding-right-sm { padding-right: .5em; }
.padding-right-md { padding-right: 1em; }
.padding-right-lg { padding-right: 1.5em; }
.padding-right-xl { padding-right: 3em; }
/*### MEDIA STYLES END ###*/