/* Custom Fonts*/
body {
    font-family: 'Raleway', 'Open Sans';
    font-size: 16px;
    color: #3c414b;
    background-image: none;
}

html, button, input, select, textarea {
    font-family: 'Raleway', 'Open Sans';
}


/* sweet alert */
.sweet-alert .sa-icon.sa-info {
    border-color: #9fd45f !important; 
}

.sweet-alert .sa-icon.sa-info::before,
.sweet-alert .sa-icon.sa-info::after,
.sweet-alert button {
    background-color: #9fd45f !important;
}


/*Pfeil nach unten*/
.foldingTitle .csc-header > *:first-child::before {
    content: "\25BE";
    padding-right: 12px;
}


/*Timelines*/
.bg_timeline {
    background-color: white;
    margin-top: -33px;
    margin-left: -10px;
}

.bg_timeline_small {
    margin-top: -110px;
}

.cbp_tmtimenoline.cbp_tmtimeline_small > li .cbp_tmlabel {
    padding: 0px 0 0px 90px !important;
    border-bottom: 1px solid #9fd45f;
}

.cbp_tmtimenoline.cbp_tmtimeline_small {
    width: 115%;
    left: unset;
    position: relative;
}

.cbp_tmtimenoline > li .cbp_tmlabel {
    border-bottom: 0px solid #9fd45f;
}

.cbp_tmtimeline > li .cbp_tmlabel {
    color: #3c414b;
    margin: 0;
    padding: 0 0 40px 100px;
    border-bottom: 0px solid #9fd45f;
}

.cbp_tmtimeline > li.completed .cbp_tmicon {
    color: #3c414b;
    background: rgba(240, 243, 245, 1) none repeat scroll 0 0;
}

.cbp_tmtimeline > li.completed .hi-icon::before {
    background: rgba(240, 243, 245, 1) none repeat scroll 0 0;
}

.cbp_tmtimeline > li.active .hi-icon {
    background:#afb4bb none repeat scroll 0 0;
}

.cbp_tmtimeline > li.completed .hi-icon {
    background: none;
    box-shadow: 0 0 0 1px #3c414b;
}

.cbp_tmtimeline::before {
    background: #9fd45f;
    margin-top: 19px;
}

.cbp_tmtimeline > li .cbp_tmlabel h3 {
    font-size: 20px;
    margin: 0.5em 0;
}

.cbp_tmtimeline > li .cbp_tmicon {
    background: none repeat scroll 0 0 #9fd45f;
    box-shadow: 0 0 0 0px #9fd45f;
    width: 40px;
    height: 40px;
    line-height: 34px;
}

.cbp_tmtimeline_small {
    margin: 110px 0 30px -50px;
}

.cbp_tmtimeline>li .cbp_tmlabel{
    border-bottom: none; 
}

.box-selection ul li ul li.active, .box-selection ul li ul li:hover {
    background: none repeat scroll 0 0 #bababa;
    color: #3c414b;
}

/*Farbe Icons für bei den Schritten 1-5*/
.cbp_tmtimeline_small li.completed .hi-icon-suchen span {
    background: url('/typo3conf/ext/sq_bikeboxConf_db/Resources/Public/img/icon-suchen-small-gray.png') 20px center no-repeat;
}
.cbp_tmtimeline_small li.completed .hi-icon-buchen span {
    background: url('/typo3conf/ext/sq_bikeboxConf_db/Resources/Public/img/icon-buchen-small-gray.png') 20px center no-repeat;
}
.cbp_tmtimeline_small li.completed .hi-icon-bezahlen span {
    background: url('/typo3conf/ext/sq_bikeboxConf_db/Resources/Public/img/icon-bezahlen-small-gray.png') center center no-repeat;
}

.cbp_tmtimeline_large .hi-icon:hover:before {
   background:  #9fd45f;
}

.cbp_tmtimeline > li.active .hi-icon:before {
   background: #9fd45f;
}
.cbp_tmtimeline > li.active .cbp_tmicon {
   background:#9fd45f;
}

.cbp_tmtimeline_large .hi-icon:hover{
   box-shadow: 0 0 0 1px#9fd45f;
}

.hi-icon:before {
    background: rgba(101, 101, 101, 0.5);
}
.hi-icon::after {
    box-shadow: 0 0 0 1px rgba(101, 101, 101, 0.5);
}
.hi-icon {
    box-shadow: 0 0 0 1px rgba(101, 101, 101, 0.5);
}

.content-suchen h2, .content-buchen h2, .content-completion h2 {
    color: #3c414b;
}

.sidebar label, .sidebar h2, .content-suchen h2, .content-buchen h2, 
.content-completion h2, .tx-femanager h2, .frame-type-felogin_login h3,
dl dt, .tx-femanager .required, .required label:after {
    color: #3c414b;
}

.sidebar .duration-options label {
    color: #fff; 
}

.box-selection {
    border-bottom: none;
    min-height: auto;
}

.box-selection ul li ul li {
    border-color:#bababa; 
}

.box-selection ul li ul li.active,
.box-selection ul li ul li:hover {
    color: #3c414b;
}

.box-selection .emptyrow h3 {
    line-height: 40px;
}

.box-selection .emptyrow li {
    border-left: none;
    border-right: none;
    height: 52px;
    border-top: 2px solid #3c414b;
}

.box-selection ul li:first-child ul li {
    border-top-width: 2px;
}

.box-selection .emptyrow li:first-child {
    border-left: 2px solid #3c414b;
}

.box-selection .emptyrow li:last-child {
    border-right: 2px solid #3c414b;
}

.box-selection ul li.dach ul li {
    border-top: solid black 20px;
}

.box-selection ul li ul li.active, .box-selection ul li.emptyrow ul li:hover {
    background: none;
}

.box-selection ul li.emptybox {
    content: "";
}

.box-selection ul li.emptybox:hover {
    background: none;
}

.toggle-radio + label.selectedPrice {
    color: #fff;
}

.cd-dropdown, .cd-select, .form-group-duration {
    border-color: rgba(101, 101, 101, 0.5);
}

.box-selection ul li ul li {
    color: #bababa;
}

/*  aus bikebox_neutral.css end */
.box-selection.cols2power {
    border: 2px solid black;
    float: left;
    width: 96%;
}

.box-selection.cols2power ul li ul {
    float:left;
    width:25%;
    padding:0;
}

.box-selection.cols2power ul li ul.right {
    float:right;
}

.box-selection.cols2power ul li ul li {
    float:none;
    height:63px;
    line-height: 63px;
    max-width: none;
    width: 100%;
    border: 1px solid black;

}

.box-selection.cols2power ul li ul.rightcol li {
    padding-left: 10px;
    text-align: left;
}

.box-selection.cols2power ul li ul li.filler:hover,
.box-selection.cols2power ul li ul li.filler {
    background: none;
    border: none;
}

.box-selection ul li ul li.box.active::after, 
.box-selection ul li ul li.box:hover::after {
    top: 3px;
}

.box-selection ul li ul.rightcol li.box.active::after, 
.box-selection ul li ul.rightcol li.box:hover::after {
    top: 14px;
    left: 15px;
}

.box-selection ul li ul li.box.active::before, 
.box-selection ul li ul li.box:hover::before {
    content: "buchen";
    top: -20px;
}

.box-selection ul li ul.rightcol li.box.active::before, 
.box-selection ul li ul.rightcol li.box:hover::before {
    text-align: left;
}

.box-selection ul li ul li.box.disabled:hover {
    background: none repeat scroll 0 0 #f0f0f0;
    color: #9a9a9a;
}

.box-selection ul li ul li.occupied,
.box-selection ul li ul li.box.occupied:hover {
    color:#ffffff;
    background:none repeat scroll 0 0 #3c414b !important;
}

.box-selection ul li ul li.box.active,
.box-selection ul li ul li.box:hover {
    background: none repeat scroll 0 0#9fd45f ;
    color: #fff;
}

.box-selection ul li ul li.electro::after {
    left: 35px;
    position: relative;
    top: -60px;
}

.box-selection ul li ul.rightcol li.occupied::before {
    text-align: left;
}

.box-selection ul li ul li.ebike::after {
    top: -49px;
    left: 10px;
}

.box-selection ul li ul li.occupied::before {
    content: "belegt";
    display: block;
    font-size: 12px;
    position: absolute;
    text-align: center;
    width: 100%;
}

.box-selection ul li ul li.occupied:hover::before { 
    content: "belegt";
    cursor: default;
}

.lang_en .box-selection ul li ul li.occupied::before {
    content: "occupied";
    font-size: 8px;
}


.lang_en .box-selection ul li ul li.box:hover::before {
    content: "book";
    font-size: 8px;
}
.lang_en .box-selection ul li ul li.box.occupied:hover::before {
    content: "occupied";
    font-size: 8px;
}

.box-information {
    padding-right: 5px; 
}

.foldingTitle {
    border: 1px solid #3c414b;
	background:transparent;
}
.foldingTitle .csc-header > *:first-child {  font-size: 16px;
    color: #3c414b;
    display: inline-flex;

}

.btn-blue, .toggle-radio + label{
    cursor: pointer;
    background-color:#9fd45f;
}
.toggle-radio + label.selectedPrice {
    background-color: #9fd45f;
}
.btn-blue:hover{
    background-color: #9fd45f;
}
.footernavigation a {
    border-left: 1px solid#9fd45f;
}

h1 {
    font-size: 40px;
    font-weight: bold;
}
h1, h3{
    color: #9fd45f;
}
h2 {
    color: #3c414b;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.2;
}
hr {
    border-color: #3c414b;
    margin-left: 0px;
    margin-right: 0px;
}

/*Verlinkungen*/
 a {
    color:#9fd45f;
} 

figure {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.faq li::before {
    content: "";
    line-height: unset;
    margin-right: unset;
    vertical-align: inherit;
}

.faq li a, 
.faq {
    color:#9fd45f;
    font-size: 16px;
    font-weight: bold;
    text-decoration: underline;
}

.loadspinner{
    border: solid 4px#9fd45f;
}
.pagecontent {
    background-image: none;
    background-color: rgba(240, 243, 245, 0.5);
    color: #3c414b;
}


.logo a {
    width: 160px;
}
.logo img{
    max-width: 75%;
}

/* Language Menü */

#language_menu {
    margin: 40px 0;
   padding-left: 0px;
}
#language_menu li {
   color: #9fd45f;
}
#language_menu li.active a {
   color: #9fd45f;
}
#language_menu li a {
   color: #3c414b;
   text-decoration: underline;
}

header .mainnavigation {    
    margin: 51px 0 0;
    background-color: #fff;
    height: 51px;
}

.mainnavigation button {
    margin-top: -20px;
}

.mainnavigation button .menu-icon:before {
    color: #AEAEAE;
}

.mainnavigation ul {
    background: none repeat scroll 0 0 #fff;
    margin-top: 0;
}

.mainnavigation a {
    color:#3c414b;
}

.mainnavigation a:hover, .mainnavigation a:focus, .mainnavigation .active a {
    color: #9fd45f;
    background: #fff;
}

.mainnavigation a::before, .mainnavigation a::after {
    background: #9fd45f none repeat scroll 0 0;
}

.femanager_fieldset input.form-control, 
.femanager_fieldset select, 
.femanager_fieldset textarea, 
.frame-type-felogin_login #user, .frame-type-felogin_login #pass, .frame-type-felogin_login #tx_felogin_login-forgot-email,
.frame-type-felogin_login #tx_felogin_login-newpassword1, .frame-type-felogin_login #tx_felogin_login-newpassword2 {
    background: #fff none repeat scroll 0 0;
    color: #3c414b !important;
}

.circle-radio + label::after {
    background: #fff none repeat scroll 0 0;
    border: 3px solid rgba(240, 243, 245, 1);  
}

.form-group .btn-submit, .sqbikebox-submit-btn, .powermail_submit {
    background-color:#9fd45f;
    /* height: 35px; */
}
.form-group .btn-submit:hover, .sqbikebox-submit-btn:hover, .powermail_submit:hover {
    background-color:#76c043;
}

.unit-selection, .box-selection {
    border-bottom: 2px solid #AEAEAE;
}

.content-suchen-detail .span8 {
    border-left: 1px solid #AEAEAE;
}

.summary dd, .boxInfo dd, .white-box dd {
    margin: 0 0 0 180px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-results__options {
    color: #3c414b;
}

/**NEW SNIPPET**/
/*Cart*/
.cart-countdown,
.white-box {
    color: #3c414b;
}

.form-group.go2payment .btn-block {
    display:inline-block;
    margin: 0;
}

.big {
    color:#3c414b;
}

@keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        box-shadow: 0 0 0 2px rgba(16,80,136,  0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(16,80,136,  1);
        opacity: 0.5;
    }
    100% {
        box-shadow: 0 0 0 2px rgba(16,80,136, 0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(16,80,136,  1);
        opacity: 0;
        transform: scale(1.07);
    }
}
@keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        box-shadow: 0 0 0 2px rgba(16,80,136,  0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(16,80,136,  1);
        opacity: 0.5;
    }
    100% {
        box-shadow: 0 0 0 2px rgba(16,80,136,  0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(16,80,136,  1);
        opacity: 0;
        transform: scale(1.07);
    }
}

/* Verwaltungs Backend*/

/*VBE: Fix Bug in field date-range*/
td.dtsearch-cell.dt-left.ui-state-default[_id="1"] {
    white-space: nowrap;
    color: #000000;
    max-width: 170px !important;
}

a.editLink,
.container.decorated,
.tx-sq-bikebox-show {
    color:#3c414b;
}

.pagecontent .ui-state-default, 
.pagecontent .ui-button, 
html .pagecontent .ui-button.ui-state-disabled:hover, 
html .pagecontent .ui-button.ui-state-disabled:active,
.pagecontent .ui-state-default:hover, .pagecontent .ui-state-default.ui-state-disabled {
    background:#3c414b;
}

.pagecontent .ui-state-default.ui-state-disabled {
    background: rgba(0,0,0,0.7);
}

table.dataTable tbody tr:hover,
table.dataTable tbody tr.odd:hover {
    background-color:#cccccc;
}


@media only screen and (max-width: 47.5em) {
    /* Mobile Ansicht Buchungsprozess */
    .form-group dl dt {
        float: none;
        display: inline;
    }
    .form-group dd {
        margin: -20px 0 0px 150px;
    }

    .logo img{
        max-width: 75%;
    }

     .cbp_tmtimeline {
        display: none;
        padding: 0 0 0 40px;
    } 

    .cbp_tmtimeline > li {
        float: left;
    }

    .cbp_tmtimenoline {
        display: inline-grid;
        margin-top: 30px;
        left: -41%;
        position: relative;
    }

    .cbp_tmtimenoline.cbp_tmtimeline_small {
        margin-top: -16px;
        left: -10%;
        width: 127%;
    }

    .cbp_tmtimenoline > li .cbp_tmlabel {
        border-bottom: 0px solid #9fd45f;
    }

    .cbp_tmtimenoline.cbp_tmtimeline_small > li .cbp_tmlabel {
        padding: 0 0 40px 70px;
    }

}

@media only screen and (max-width: 33em) {    
    .cbp_tmtimeline {
        padding: 0 0 0 20px;
    }

    .cbp_tmtimeline > li .cbp_tmlabel h3 {
        display: inline-block !important;
    }
    .cbp_tmtimenoline {
        left: unset;
        position: unset;
    }
    
    .box-selection ul li ul.rightcol li.box.active::after, .box-selection ul li ul.rightcol li.box:hover::after {
        left: 0;
        top: 29px;
    }
    .box-selection ul li ul li.ebike::after {
        left: 0;
        top: -44px;
    }
    .box-selection.cols2power ul li ul.rightcol li {
        padding-left: 0;
        text-align: center;
    }
    .box-selection.cols2power ul li ul li {
        height: 73px;
        line-height: 73px;
    }
    .cbp_tmtimeline_small {
        margin: 22px 0 30px -50px;
    }
}


@media only screen and (max-width: 25em) { /*400px*/
    #c4022 {
        height: auto;
    }

    .pageheader.container {
        /* Fix für iPhones Safari*/
        height: 6.5rem;
    }

    .logo img{
        margin-left: 10px;
    }
    .mainnavigation {
        margin: 24px 0;
    }

    .cbp_tmtimenoline::before {
        content: none !important;
        border-bottom: 1px solid #9fd45f;
    }

    .box-selection ul li.bottom-middle-row ul li:first-child {
        border-left-width: 1px;
    }
    .box-selection ul li.bottom-middle-row ul li:last-child {
        border-right-width: 1px;
    }
    .box-selection ul li:last-child ul li {
        border-bottom-width: 1px;
    }
}


@media only screen and (min-width: 36em) { /*576px*/
    .logo{
        margin: 24px 0 24px 34px;
    }

    .cbp_tmtimenoline.cbp_tmtimeline_small::before {
        display: none;
        }

    .cbp_tmtimeline_small > li .cbp_tmicon {
        margin: 0 20px 0 0;
    }

    .cbp_tmtimeline_small > li .cbp_tmlabel {
        padding: 0 0 40px 70px !important;
        /* text-align: center; */
        text-align: left;
    }

    .cbp_tmtimeline_small::before {
        left: 140px;
    }
}

@media only screen and (min-width: 47.5em) { /*760px*/
    .bg_timeline_large {
        margin-top: -200px;
    }

    .cbp_tmtimenoline.cbp_tmtimeline::before {
        background: none;
    }

    .cbp_tmtimenoline.cbp_tmtimeline_small {
        width: 106%;
    }

    .cbp_tmtimenoline.cbp_tmtimeline_large > li .cbp_tmlabel {
        padding: 0 10px 40px 30px;
        text-align: center;
    }

    .cbp_tmtimenoline.cbp_tmtimeline_small > li .cbp_tmlabel {
        border-bottom: 0px solid #9fd45f;
        text-align: end;
    }

    .cbp_tmtimeline #bezahlen .cbp_tmlabel,
    .cbp_tmtimeline #code .cbp_tmlabel {
        margin-right: 0px;
    }
}

@media only screen and (min-width: 48em) { /*768px*/
    .logo img {
        max-width: 100%;
    }
    #language_menu {
        margin: 58px 0 40px;
        padding-left: 30px;
    }

    .cbp_tmtimeline_small {
        margin: 110px 0 30px -40px;
    }

    .cbp_tmtimeline_small::before {
        width: 80%;
        left: auto;
    }

    .cbp_tmtimenoline.cbp_tmtimeline_small > li .cbp_tmlabel {
        text-align: left;
    }

    .hi-icon-suchen span {
        background-size: initial;
    }
    .hi-icon-buchen span {
        background-size: initial;
    }
    .hi-icon-bezahlen span {
        background-size: initial;
    }
    .hi-icon-erhalten span {
        background-size: initial;
    }
    .hi-icon-parken span {
        background-size: initial;
    }

    .buttonGroupLeft {
        display: block;
        width: 100%;
    }
    /* .form-group.buttonGroupRight {
        float: initial;
    } */
    .buttonGroupRight {
        display: block;
        width:100%;
    }
    #box-selection .box-select-submit, .confirmBooking {
        float: initial;
        padding: 0 31px;
    }
}


@media only screen and (min-width: 62.5em) { /*1000px*/

    .cbp_tmtimeline_large::before {
        left: 120px;
    }

    .cbp_tmtimeline_small {
        margin: 110px 35px 30px -160px;
    }

    .cbp_tmtimenoline.cbp_tmtimeline_small {
        margin: 110px 0 0 -118px;
        width: 112%;
    } 

    .cbp_tmtimeline_small > li .cbp_tmlabel {
        padding: 0 0px 42px 124px;
    }

    .cbp_tmtimenoline.cbp_tmtimeline_small > li .cbp_tmlabel{
        padding: 0 0px 42px 124px !important;
        text-align: center;
    } 

    .cbp_tmtimeline_small::before {
        right: 0px;
    }

    .cbp_tmtimeline_small > li .cbp_tmicon {
        margin: 0;
    }
    .cbp_tmtimeline_small::before {
        left: 185px;
    }


}

@media only screen and (min-width: 64em) { /*1024px*/

    .footer_right {
        width: 40%;
        margin-top: -30px;
    }

    .container {
        margin-bottom: 30px; 
    }

    .user-menu .container {
        margin-bottom: 0; 
    }

    .bg_timeline {
        margin-top: -200px;
        padding: 0 40px 25px 40px;
        width: 980px;
        margin-left: -40px;
    }

    .bg_timeline_small {
        margin-top: -110px;
        padding: 0 140px 25px 51px;
    }

    header .mainnavigation {
        float: right;
        margin-left: -200px;
    }
    .mainnavigation ul {
        border: none;
        background-color: transparent;
        border-bottom: none;
    }
    .cbp_tmtimeline>li .cbp_tmlabel{
        border-bottom: none; 
    }

    .cbp_tmtimeline_small > li .cbp_tmlabel {
        padding: 0 0 40px 70px !important;
        text-align: center;
    }

    .mainnavigation li {
        border-top: none;
    }

    .cbp_tmtimenoline.cbp_tmtimeline_small > li .cbp_tmlabel{
        padding: 0px 0 0px 90px !important;
    } 

    .cbp_tmtimenoline.cbp_tmtimeline_small {
        margin: 110px -25px 0 -70px;
    }
    .cbp_tmtimeline_small {
        margin: 110px 0 30px -90px;
    }

    .cbp_tmtimeline_small::before {
        left: 150px;
    }

    .cbp_tmtimeline_large::before {
        left: 75px;
    }
    
    .bookingStep.nomargin {
        margin-top: 40px;
    }

    .form-group .btn-submit, .sqbikebox-submit-btn {
        padding: 5px 25px;
    }

    .buttonGroupLeft {
        margin-right: 10px;
        display: initial;
        float: left;
        width: initial;
    }

    .buttonGroupRight {
        width: initial;
    }

    #box-selection .box-select-submit {
        float: left;
        padding: 0 31px;
    }

    .confirmBooking {
        float: right;
    }
}