/*** GENERAL ***/

body {
    padding-bottom: 75px;}

.inline-block {
    display: inline-block;}

.clear {
    clear: both !important;
    width: 100% !important;
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;}

/*** SPACES ***/

[class*="space-"],
.space {
    bottom: 0 !important;
    clear: both !important;
    display: block !important;
    left: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    right: 0 !important;
    top: 0 !important;
    width: 100% !important;}

.space-10px { height: 10px;}
.space-1-2x { height: 7.5px;}
.space { height: 15px;}
.space-2x { height: 30px;}
.space-3x { height: 45px;}
.space-4x { height: 60px;}
.space-5x { height: 75px;}

.no-margin-top {margin-top: 0;}
.no-margin-right {margin-right: 0;}
.no-margin-bottom {margin-bottom: 0;}
.no-margin-left {margin-left: 0;}

@media (max-width: 767px) {
    .no-margin-top-xs-down { margin-top: 0;}
    .no-margin-right-xs-down { margin-right: 0;}
    .no-margin-bottom-xs-down { margin-bottom: 0;}
    .no-margin-left-xs-down { margin-left: 0;}

    .no-padding-top-xs-down { padding-top: 0;}
    .no-padding-right-xs-down { padding-right: 0;}
    .no-padding-bottom-xs-down { padding-bottom: 0;}
    .no-padding-left-xs-down { padding-left: 0;}
}
@media (min-width: 768px) {
    .no-margin-top-sm-up { margin-top: 0;}
    .no-margin-right-sm-up { margin-right: 0;}
    .no-margin-bottom-sm-up { margin-bottom: 0;}
    .no-margin-left-sm-up { margin-left: 0;}

    .no-padding-top-sm-up { padding-top: 0;}
    .no-padding-right-sm-up { padding-right: 0;}
    .no-padding-bottom-sm-up { padding-bottom: 0;}
    .no-padding-left-sm-up { padding-left: 0;}
}
@media (max-width: 991px) {
    .no-margin-top-sm-down { margin-top: 0;}
    .no-margin-right-sm-down { margin-right: 0;}
    .no-margin-bottom-sm-down { margin-bottom: 0;}
    .no-margin-left-sm-down { margin-left: 0;}

    .no-padding-top-sm-down { padding-top: 0;}
    .no-padding-right-sm-down { padding-right: 0;}
    .no-padding-bottom-sm-down { padding-bottom: 0;}
    .no-padding-left-sm-down { padding-left: 0;}
}
@media (min-width: 992px) {
    .no-margin-top-md-up { margin-top: 0;}
    .no-margin-right-md-up { margin-right: 0;}
    .no-margin-bottom-md-up { margin-bottom: 0;}
    .no-margin-left-md-up { margin-left: 0;}

    .no-padding-top-md-up { padding-top: 0;}
    .no-padding-right-md-up { padding-right: 0;}
    .no-padding-bottom-md-up { padding-bottom: 0;}
    .no-padding-left-md-up { padding-left: 0;}
}
@media (max-width: 1199px) {
    .no-margin-top-md-down { margin-top: 0;}
    .no-margin-right-md-down { margin-right: 0;}
    .no-margin-bottom-md-down { margin-bottom: 0;}
    .no-margin-left-md-down { margin-left: 0;}

    .no-padding-top-md-down { padding-top: 0;}
    .no-padding-right-md-down { padding-right: 0;}
    .no-padding-bottom-md-down { padding-bottom: 0;}
    .no-padding-left-md-down { padding-left: 0;}
}
@media (min-width: 1200px) {
    .no-margin-top-lg-up { margin-top: 0;}
    .no-margin-right-lg-up { margin-right: 0;}
    .no-margin-bottom-lg-up { margin-bottom: 0;}
    .no-margin-left-lg-up { margin-left: 0;}

    .no-padding-top-lg-up { padding-top: 0;}
    .no-padding-right-lg-up { padding-right: 0;}
    .no-padding-bottom-lg-up { padding-bottom: 0;}
    .no-padding-left-lg-up { padding-left: 0;}
}

@media (max-width: 767px) {
    .display-block-xs-down { display: block;}
    .hidden-xs-down { display: none !important;}
}
@media (min-width: 768px) {
    .display-block-sm-up { display: block;}
    .hidden-sm-up { display: none !important;}
}
@media (max-width: 991px) {
    .display-block-sm-down { display: block;}
    .hidden-sm-down { display: none !important;}
}
@media (min-width: 992px) {
    .display-block-md-up { display: block;}
    .hidden-md-up { display: none !important;}
}
@media (max-width: 1199px) {
    .display-block-md-down { display: block;}
    .hidden-md-down { display: none !important;}
}
@media (min-width: 1200px) {
    .display-block-lg-up { display: block;}
    .hidden-lg-up { display: none !important;}
}

/*** FONT ***/

h1, h2, h3 {
    font-style: italic;}


/*** TEXT ***/

@media (max-width: 767px) {
    .text-left-xs-down {text-align: left;}
    .text-center-xs-down {text-align: center;}
    .text-right-xs-down {text-align: right;}
    .text-justify-xs-down {text-align: justify;}

    .text-bold-xs-down, .form-horizontal .text-bold-xs-down { font-weight: 600;}
}
@media (min-width: 768px) {
    .text-left-sm-up {text-align: left;}
    .text-center-sm-up {text-align: center;}
    .text-right-sm-up {text-align: right;}
    .text-justify-sm-up {text-align: justify;}

    .text-bold-sm-up, .form-horizontal .text-bold-sm-up { font-weight: 600;}
}
@media (max-width: 991px) {
    .text-left-sm-down {text-align: left;}
    .text-center-sm-down {text-align: center;}
    .text-right-sm-down {text-align: right;}
    .text-justify-sm-down {text-align: justify;}

    .text-bold-sm-down, .form-horizontal .text-bold-sm-down { font-weight: 600;}
}
@media (min-width: 992px) {
    .text-left-md-up {text-align: left;}
    .text-center-md-up {text-align: center;}
    .text-right-md-up {text-align: right;}
    .text-justify-md-up {text-align: justify;}

    .text-bold-md-up, .form-horizontal .text-bold-md-up { font-weight: 600;}
}
@media (max-width: 1199px) {
    .text-left-md-down {text-align: left;}
    .text-center-md-down {text-align: center;}
    .text-right-md-down {text-align: right;}
    .text-justify-md-down {text-align: justify;}

    .text-bold-md-down, .form-horizontal .text-bold-md-down { font-weight: 600;}
}
@media (min-width: 1200px) {
    .text-left-lg-up {text-align: left;}
    .text-center-lg-up {text-align: center;}
    .text-right-lg-up {text-align: right;}
    .text-justify-lg-up {text-align: justify;}

    .text-bold-lg-up, .form-horizontal .text-bold-lg-up { font-weight: 600;}
}

.btn.text-left { text-align: left;}
.btn.text-right { text-align: right;}
.btn.text-center { text-align: center;}

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

.text-wrap {
    white-space: pre-wrap;}

/*** ICONS ***/

.glyphicon.glyphicon-xs {
    font-size: 0.6em;
    position: relative;
    top: -0.05em;}

/*** EU TIRE LABEL ***/

.eu-label .eu-label-icon {
    background-image: url("../img/reifenlabel_werte.png");}

.eu-label-emission .eu-label-icon {
    background-image: url("../img/reifenlabel_dB.png");}

.eu-label {
    display: inline-block;
    margin-left: 15px;
    text-align: left;}

.eu-label:first-child {
    margin-left: 0;}

.eu-label .eu-label-icon {
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: 0 0;
    display: inline-block;
    height: 19px;
    width: 28px;}

.eu-label-icon.value-A {
    background-position: 0 0;}

.eu-label-icon.value-B {
    background-position: 0 -39px;}

.eu-label-icon.value-C {
    background-position: 0 -78px;}

.eu-label-icon.value-D {
    background-position: 0 -117px;}

.eu-label-icon.value-E {
    background-position: 0 -156px;}

.eu-label-icon.value-F {
    background-position: 0 -195px;}

.eu-label-icon.value-G {
    background-position: 0 -234px;}

.eu-label-emission .eu-label-icon {
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: 0 0;
    color: inherit;
    font-size: 12px;
    padding-left: 4px;
    padding-top: 2px;
    position: relative;
    top: -6px;
    width: 40px;}

.eu-label-text {
    color: #019add;
    position: relative;
    top: -0.3em;}

.eu-label.no-eu-label {
    height: 19px;}

.eu-label.eu-label-2020-740 .eu-label-class {
    font-weight: bold;
    position: relative;
    top: -0.3em;
    margin-left: 0.25em;
    margin-right: 0.25em;
}

.eu-label.eu-label-2020-740[tooltipid="tooltip_kraftstoff"] .eu-label-icon {
    background-image: url("../img/reifenlabel_2020_740_colored_werte.png");
}

.eu-label.eu-label-2020-740[tooltipid="tooltip_nasshaftung"] .eu-label-icon {
    background-image: url("../img/reifenlabel_2020_740_blue_werte.png");
}

.eu-label.eu-label-2020-740 [class*="icon-tyrelabel_"] {
    font-size: 1.75em;
    position: relative;
    top: 0.05em;
}

/*** DESIGN ***/

.dark,
.dark *:not(.btn),
.dark a:not(.btn):hover,
.dark a:not(.btn):active,
.dark a:not(.btn):focus {
    color: #FFF;}

.michelin-box {
    background-color: #27509b;
    border-top: 4px solid #fce500;}

/*** FORM ***/

.form-group label {
    margin-top: 7px;}

/*** BUTTONS ***/

.btn-default {
    text-transform: uppercase;
    font-style: italic;}

/*** NOTIFICATIONS ***/

.notification {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 0;}

.notification.error {
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442;}

.notification a.close {
    display: none;}

/*** LOADER ***/

.body_loader {
    -webkit-box-shadow: inset 0 2000px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0 2000px rgba(0, 0, 0, 0.5);
    bottom: 0;
    color: #FFF;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 999999999;}

.body_loader table {
    height: 100%;
    width: 100%;}

.body_loader table td {
    vertical-align: middle;}

.body_loader div {
    height: 40px;
    margin: 0 auto;
    text-align: center;
    width: 40px;}

/*** MENU ***/

.menu-user {
    display: inline-block;}

.menu-user .menu-user-dropdown {
    display: none;
    position: absolute;
    right: 15px;
    top: 100%;
    background-color: #27509b;
    padding: 15px;
    z-index: 999;
    box-shadow: 0 0 20px rgba(0,0,0,0.5);}

.menu-user:hover .menu-user-dropdown {
    display: inline-block;}

@media (max-width: 767px) {
    .menu-user .menu-user-dropdown {
        right: 0;
        left: 0;
    }
}

.jsSelectedCustomer span {
    white-space: nowrap;}

/*** FOOTER ***/
body > footer {
    background-color: #FFF;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
}

body > footer a {
    margin-left: 15px;}

body > footer a:hover,
body > footer a:active,
body > footer a:focus {
    text-decoration: none;}

body > footer a:first-child {
    margin-left: 0;}

/*** FIXES ***/

img {
    image-rendering: -webkit-optimize-contrast;}


/*** JQ-GRID ***/

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    color: #000;}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { background: #f2f2f2; }

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 0; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 0; }
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: 0; }
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-top-left-radius: 0; }

.ui-th-column, .ui-jqgrid .ui-jqgrid-htable th.ui-th-column { text-align: left; font-weight: 600; padding: 8px 3px; white-space: normal; }
.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: 1;}

.ui-widget-content {
    border: none;}

.ui-state-hover, 
.ui-widget-content .ui-state-hover, 
.ui-widget-header .ui-state-hover, 
.ui-state-focus, 
.ui-widget-content .ui-state-focus, 
.ui-widget-header .ui-state-focus {
    border-left: none;
    border-top: none;
}

.ui-jqgrid tr.ui-row-ltr td.actions { padding: 0; }

.ui-jqgrid .ui-jqgrid-bdiv {
    overflow-y: auto;
    overflow-x: hidden;}

.ui-widget-content .ui-state-hover > td { background-color: #F6F6F6; }

.ui-jqgrid tr.ui-row-ltr td.sgexpanded ~ td, 
.ui-jqgrid tr.ui-row-ltr td.sgexpanded,
.ui-jqgrid .ui-subgrid td.subgrid-cell {
    background: #F2F2F2;
    font-weight: 600;}

.ui-jqgrid td { border-color: #d3d3d3 !important; }

.ui-jqgrid tr.jqgrow td { padding: 8px 5px 8px 5px; }

.ui-jqgrid .ui-jqgrid-htable th div { text-transform: uppercase;}

.ui-jqgrid .ui-subgrid { border-bottom: 3px solid #DDD; }

.ui-jqgrid tr.jqgrow td { 
    vertical-align: top; 
    white-space: normal; }


/*** POPUP ***/

body.noscroll {
    overflow: hidden !important;}

.popup_scollbox {
    bottom: 0;
    left: 0;
    overflow-x: hidden;
    overflow-y: auto;
	padding-bottom: 15px;
	padding-top: 15px;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 999999999;}

.popup_overlay {
    -webkit-box-shadow: inset 0 2000px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 2000px rgba(0, 0, 0, 0.2);
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999998;}

.popup_wrapper {
    background: #FFF;
    -webkit-box-shadow: 0 0 20px #CCC;
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 20px #CCC;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    display: block;
    margin-right: 15px;
    overflow: hidden;
    position: absolute;
    z-index: 999999999;
    -webkit-transition: top 0.5s;
    transition: top 0.5s;
    padding-bottom: 15px;
}

.popup_scollbox .popup_wrapper {
    left: 0 !important;
    margin: 0 auto;
    max-height: none !important;
    position: relative;
    top: 0 !important;}
    
@media \0screen {
    .popup_wrapper {
        border: 1px solid #DDD;}  
}

.popup_wrapper .popup_closeX {
    cursor: pointer;
    font-family: icon_font;
    position: absolute;
    right: 10px;
    top: 9px;
    z-index: 9;} 

.popup_wrapper .popup_closeX:hover {
    opacity: 0.6;}

.popup_wrapper .popup_content {
    padding-bottom: 15px;
    padding-top: 15px;}

#jsCancellationPopup {
    max-width: 500px;}