/* new styles november 23 */
.octaneStations {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-gap: 1em;
}

.octaneStations a {
	box-shadow: 0px 0px 10px 0px #337abe;
    padding: 0.5em;
    min-width: 300px;
}

.octaneStations a:hover {
	background: #337abe;
	color: #fff !important;
}

.singleStation:hover {
	
}

.singleStation {
	color: #1d1d3f;
}

.singleStation h3 {
	font-size: 1em;
	margin-top: 0;
	color: #337abe;
}

.singleStation h3:before {
	content: "\f0a9";
    font-family: "Font Awesome 5 Free";
    margin-right: 10px;
}

.octaneStations h4,
.octaneStations h5 {
	font-family: 'roboto',Arial,sans-serif;
	font-weight: bold;
    text-align: left;
    font-size: 1.1rem;
}

.octaneStations sub {
    bottom: 1.25em;
}

/* detailpage 23 */
.grid_2_column {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1em;
}


.detail-page h2,
.detail-page .name1 {
    text-align: left;
    margin-top: 2em;
    margin-bottom: 0;
    font-size: 1.4em;
    font-family: 'Montserrat', sans-serif;
    line-height: 1.2em;
    font-weight: 600;
}

.detail-page h3 {
	margin-bottom: 0;
	margin-top: 0.5em;
}

.detail-page p {
	margin-bottom: 0;
}

.ce_text.price-box-content, .price-box-content.content-text {
    background: #30816D;
    padding: 0.5em;
    color: #fff;
    border-radius: 15px;
    padding-left: 1.5em;
}

.price-box-content h3 {
	color: #fff;
}

.phone1:before {
    content: "\f095";
    font-family: "Font Awesome 5 Free";
    color: var(--main-color);
    font-size: 1em;
    margin-right: 0.25em;
    font-weight: 600;
}

.detail-page .email:before {
	content: "\f0e0";
    font-family: "Font Awesome 5 Free";
    color: var(--main-color);
    font-size: 1em;
    margin-right: 0.25em;
    font-weight: 600;
}

.octane_services {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-gap: 1em;
}

ul.fsb, ul.fss, ul.fsts, ul.fswplus, ul.fszm {
    border: 1px solid;
    border-radius: 5px;
    padding: 1em;
}

.octane_services ul li {
    list-style-type: none;
    margin: 0;
}

.detail-page .mod_c4g_maps {
    border-radius: 15px;
}

/* old tiles with con4gis data */

#c4g_condition .businessHours {
    white-space: nowrap;
}
.day,
.hour {
    display: inline-block;
}
.day {
    width: 40%;
}
.day:empty {
    display: none;
}
#c4g_condition .day {
    width: 130px;
}
.day:after {
    content: " :";
}
.c4g_list_filter_buttons .price_online {
    background: #ae3944;
    color: #ffffff;
}
.c4g_list_filter_buttons .price_online:hover,
.c4g_list_filter_buttons .price_online.c4g_button_pressed {
    color: #ae3944;
    background: #ffffff;
}
.c4g_list_filter_buttons .price_request {
    background: #30816D;
    color: #ffffff;
}
.c4g_list_filter_buttons .price_request:hover,
.c4g_list_filter_buttons .price_request.c4g_button_pressed {
    color: #30816D;
    background: #ffffff;
}
.c4g_list_filter.ui-button:not(:last-child) {
    margin-right: 10px;
}
#c4g_brick select {
    margin: 0;
}
.c4g_list_filter_buttons > * {
    margin-top: 10px;
}
.c4g_list_filter_buttons label {
    display: none;
}
.c4g_list_filter_buttons select {
    background: #ffffff;
}
span[title="Filter zurücksetzen"] {
    width: max-content;
    max-width: 100%;
}
.c4g_list_filter_buttons > *:not(.c4g_list_filter):not(label):not(:last-child) {
    display: block;
        border-radius: 2px;
        margin: 10px 0;
}
.c4gGuiAction > ul > li.maplink {
    text-align: right;
}
.c4g_brick_list .name {
    color: #337abe;
}
.c4g_brick_list > ul ~ .c4gGuiAction:hover .name {
    color: white;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    border: 1px solid #cccccc;
    background: #ededed;
    font-weight: normal;
    color: #1d1d3f;
}
.c4g_brick_dialog input.formdata,
.c4g_brick_dialog input.formnodata,
.c4g_brick_dialog textarea.formdata,
.c4g_brick_dialog .c4g_non_input,
.c4g_brick_dialog div:not(.c4g_non_input) > a {
    margin-left: 0;
    background-color: transparent!important;
}
.ui-widget-header {
    background-color: #1d1d3f;
        color: #fff0;
}
@media (max-width: 1200px) and (min-width: 700px) {
    .c4g_brick_list > ul ~ .c4gGuiAction {
        width: calc(100%/2 - 20px);
    }
}
@media (min-width: 1200px) {
    .c4g_brick_list > ul ~ .c4gGuiAction {
        width: calc(100%/3 - 20px);
    }
}
.c4g_brick_list > ul ~ .c4gGuiAction {
    box-shadow: 0px 0px 10px 0px #337abe;
    color: #1d1d3f;
    margin: 10px;
}
.c4g_brick_list > ul ~ .c4gGuiAction:hover {
    background: #337abe;
        color: #ffffff;
        transition: background 1s;
}
.c4g_list_filter_container:focus-within:after {
    display: none;
}
.c4gGuiDialogTitle > .c4g_list_filter_container:after {
    content: "\f002";
        font-family: "Font Awesome 5 Free";
        font-size: .8em;
        font-weight: bold;
        position: absolute;
        color: #1d1d3f;
        right: 15px;
        top: 11px;
}
.c4gGuiDialogTitle > .c4g_list_filter_container {
    position: absolute;
        max-width: 100%;
        width: 300px;
        right: 0;
        top: 0;
}
.c4gGuiDialogTitle input {
    position: relative;
    -webkit-appearance: none;
}
.c4gGuiDialogTitle input::-webkit-search-cancel-button {
    display: none;
    
}

li.c4g_brick_list_column.c4g_brick_list_row_column.price_online {
    margin-top: 1em;
}

li.c4g_brick_list_column.c4g_brick_list_row_column.maplink span:after {
    font-family: "Font Awesome 5 Free";
        font-weight: bold;
        content: "\f30b";
}
.maplink span:before {
    font-family: "Font Awesome 5 Free";
        font-weight: bold;
        color: #337abe;
        content: "\f5a0";
}
.maplink span {
    width: 67px;
        height: 42px;
        white-space: nowrap;
        color: transparent;
}
.maplink:hover span {
    color: #337abe;
        transition: 0s;
        max-width: max-content;
    width: 15em;
}
li:hover span.ui-button.ui-corner-all:before,
li:hover span.ui-button.ui-corner-all:after {
    padding: 0 10px;
}
.c4g_brick_list > ul ~ .c4gGuiAction span[title="Preis auf Anfrage"] {
    padding: 5px 10px;
    background: #30816D;
    border-radius: 2px;
    color: white;
}
.c4g_brick_list > ul ~ .c4gGuiAction:hover span[title="Preis auf Anfrage"] {
    background: #ffffff;
    color: #30816D;
}
.c4g_brick_list > ul ~ .c4gGuiAction span[title="Preis online"] {
    padding: 5px 10px;
        background: #ae3944;
        border-radius: 2px;
        color: #ffffff;
}
.c4g_brick_list > ul ~ .c4gGuiAction:hover span[title="Preis online"] {
    background: #ffffff;
        color: #ae3944;
}
.c4g_brick_list > ul ~ .c4gGuiAction.filter_price_request_child {
    color: #414042;
}
.c4g_brick_list > ul ~ .c4gGuiAction.filter_price_request_child {
    box-shadow: 0px 0px 10px 0px #414042;
}
.filter_price_request_child .name,
.filter_price_request_child .maplink span:before,
.filter_price_request_child .maplink:hover span {
    color: #414042;
}
.c4g_brick_list > ul ~ .c4gGuiAction.filter_price_request_child:hover {
    background: #414042;
        color: #ffffff;
        transition: background 1s;
}
#c4g_condition ~ .icon span {
    display: inline-block;
}
.icon ~ #c4g_condition ~ .icon {
    display: inline-block;
}

.tank_farms_list .c4g_list_filter_buttons #service,
.tank_farms_list .c4g_list_filter_buttons #fuel{
    display: none;
}

.c4g__form-group.c4g__form-link.c4g__form-link--phone {
    display: flex;
}

.c4g_brick_dialog .c4g__form-headline {
    font-size: 1.25rem;
}

.c4gGuiDialogTitle.c4gGuiDialogTitleJqui {
    display: none;
}

a.c4gGuiAction.c4g__btn.c4g__btn-primary.ui-button.ui-corner-all.ui-widget {
    background: #fff;
    border-color: #308160;
}

.c4g-popup-content li a {
    color: #fff !important;
}