﻿body {
    font-size: 11px;
    line-height: 14px;
    font-family: Arial,Helvetica,sans-serif;
    color: #232323;
    background-color: #fff;
    /*margin: 8px;  deactivated for use in igus iframe*/
}

header, footer, nav, section {
    display: block;
}


/* Styles for basic forms
-----------------------------------------------------------*/
fieldset {
    border: 1px solid #ddd;
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
}

legend {
    font-size: 1.2em;
    font-weight: bold;
}

textarea {
    min-height: 75px;
}

.editor-label {
    margin: 1em 0 0 0;
}

.editor-field {
    margin: 0.5em 0 0 0;
}


/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #f00;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #f00 !important;
    /*box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(255,0,0,.6) !important;*/
}

input.input-validation-error[disabled],
select.input-validation-error[disabled],
textarea.input-validation-error[disabled] {
    border: 1px solid #ccc !important;
}

input.input-validation-error[type="radio"][disabled],
input.input-validation-error[type="checkbox"][disabled] {
    border:none !important;
}

.validation-summary-errors {
    /*font-weight: bold;*/
    /*color: #f00;*/
    border: 1px solid #c00;
    background-color: #fdd;
    margin-bottom: 15px;
    overflow-y:auto;
    max-height: 55px;
}

.validation-summary-errors ul {
    margin: 3px 10px;
    list-style-type: none;
}

.validation-summary-valid {
    display: none;
}

/* Customized Bootstrap

    1. Choose components 
        Responsive deleted:
            Narrow tablets and below (<767px)
            Tablets to desktops (767-979px)
            Large desktops (>1200px)
    3. Customize variables 
        Typography:
            @basFontSize = 11px
            @baseLineHeight = 14px
            @sansFontFamil = Arial,Helvetica,sans-serif
        Sprites:
            @iconSpritePath = '../Content/images/glyphicons-halflings.png'
            @iconWhiteSpritePath = '../Content/images/glyphicons-halflings-white.png'


    
    Other changes:
-----------------------------------------------------------*/
.modal-footer {
    text-align: center;
}

/*
.row-fluid [class*="span"] {
    margin-left: 2%;
}
*/

input, textarea, .uneditable-input {
    width: 50px;
    margin-bottom:0px !important;
}

select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
    height: auto;
    border-radius: 0;
}

.form-horizontal .control-group {
    margin-bottom: 5px;
}

.form-horizontal .control-label {
    width: 170px;
    padding-top: 2px;
    line-height:20px;
    text-align: left;
}

.form-horizontal .controls {
    margin-left: 173px;
}

.badge {
    padding-left: 5px;
    padding-right: 5px;
    font-size:10px;
    margin-top: 4px;
}

div.well-small {
    background-color: #F4F4F4;
    border-style: solid;
    border-width: 1px;
    border-color: #DDDDDD;
}

.table {
    margin-bottom: 0px;
    background-color: #FFFFFF;
}

.table tr {
    background-color: transparent;
}

.table th {
    background-color: #F4F4F4;
    border-top: none;
}

.popover-content {
    line-height: 14px;
}

textarea:focus, 
input[type="text"]:focus, 
input[type="password"]:focus, 
input[type="datetime"]:focus, 
input[type="datetime-local"]:focus, 
input[type="date"]:focus, 
input[type="month"]:focus, 
input[type="time"]:focus, 
input[type="week"]:focus, 
input[type="number"]:focus, 
input[type="email"]:focus, 
input[type="url"]:focus, 
input[type="search"]:focus, 
input[type="tel"]:focus, 
input[type="color"]:focus, 
.uneditable-input:focus {
    box-shadow: none;
}

input[disabled], select[disabled], textarea[disabled] {
    color: #BBBBBB;
}

/* Bootstrap Button groups with corners
-----------------------------------------------------------*/

.btn-group > .btn:first-child {
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
}
.btn-group > .btn:last-child, .btn-group > .dropdown-toggle {
    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
}

/* Bootstrap dropdown menu with corners and simplified background
-----------------------------------------------------------*/

.dropdown-menu {
    border-radius: 0px;
    margin: 0px;
    min-width: 50px;
}

.dropdown-menu > li > a {
  padding: 3px 10px;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-submenu:hover > a,
.dropdown-submenu:focus > a {
  color: #333333;
  background-color: #efefef;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  color: #333333;
  background-color: #efefef;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}

.dropdown-menu > li > a:hover > [class^="icon-"],
.dropdown-menu > li > a:focus > [class^="icon-"],
.dropdown-menu > li > a:hover > [class*=" icon-"],
.dropdown-menu > li > a:focus > [class*=" icon-"],
.dropdown-menu > .active > a > [class^="icon-"],
.dropdown-menu > .active > a > [class*=" icon-"],
.dropdown-submenu:hover > a > [class^="icon-"],
.dropdown-submenu:focus > a > [class^="icon-"],
.dropdown-submenu:hover > a > [class*=" icon-"],
.dropdown-submenu:focus > a > [class*=" icon-"] {
  background-image: url("../Content/images/glyphicons-halflings.png");
}


/* Tables
-----------------------------------------------------------*/

div.table-head {
    padding-right: 16px;

    border-style: solid;
    border-width: 1px 1px 0px 1px;
    border-color: #DDDDDD;
}

.table tr:nth-child(2n) {
    background-color: #F4F4F4;
}

.table th, .table td {
    padding: 5px 2px 5px 2px;
}

div.scrollbar {
    overflow: scroll;
    overflow-x: hidden;
    display: block;

    border-style: solid;
    border-width: 1px;
    border-color: #DDDDDD;
}

table input[type="radio"],
table input[type="checkbox"] {
    margin: 0px;
}

/* Price text popups
-----------------------------------------------------------*/

div.pricetexts
{
    overflow:auto;
    max-height:100px;
}

div.pricetexts table td
{
    width:100px;
    line-height:11px;
    padding:2px;
    border:0px;
}


/* Help Email Dialog
-----------------------------------------------------------*/

#HelpDiv .controls {
    margin-left: 110px;
}

#HelpDiv .control-label {
    width: 100px;
}

#HelpDiv input[type=text], #HelpDiv textarea {
    width: 400px;
}

#HelpDiv a {
    text-decoration: underline; 
    color: #232323;
}
    #HelpDiv a:hover {
        color: #F07D00;
    }

#HelpDiv .btn.disabled, #HelpDiv .btn[disabled] {
    cursor: not-allowed;
    opacity: 0.4;
}

/* JQuery UI Slider
-----------------------------------------------------------*/

.ui-slider .ui-slider-handle {
    cursor: pointer;
}

/* General changes and additions concerning bootstrap definitions
-----------------------------------------------------------*/
.controls-schmal .controls {
    margin-left: 79px;
}

.controls-schmal .control-label {
    width: 76px;
}

.controls input[type="radio"],
.controls input[type="checkbox"] {
    vertical-align: bottom;
}

[class^="icon-"], [class*=" icon-"] {
    margin-top: 0px;
    margin-right: 2px;
    vertical-align: top;
}

div.dense-text div.control-group {
    margin-bottom: 0px;
}

div.dense-text div.control-group span.control-label,
div.dense-text div.control-group div.controls {
    padding-top: 0px;
}

.btn {
    border-radius: 0px;
}

.btn-large {
    font-size: 12px;
    font-weight: bold;
    padding: 8px 15px;
}

.btn-large [class^="icon-"], .btn-large [class*=" icon-"] {
    margin-top: 0px;
    margin-right: 10px;
}

.btn-warning {
    text-shadow: none;
}

.btn.breit {
    width: 100%;
    font-size: 12px;
    font-weight: bold;
}

/* Other general changes and additions
-----------------------------------------------------------*/

a[data-ictooltip="true"] {
    color: #232323;
    text-decoration: none;
}

.beschreibung {
    color: #777777;
}

fieldset {
    padding-bottom: 0.5em;
    padding-top: 1.0em;
    background-color: #F4F4F4;
}

div.bereich {
    padding: 16px 8px;
    background-color: #F4F4F4;
    border: 1px solid #ddd;
    margin: 0 0 1em 0;
}

label.control {
    line-height: 20px;
}

.display-inline {
    display: inline;
}

.align-center {
    text-align: center !important;
}

div.ueberschrift {
    font-weight: bold;
    font-size: 14px;
    color: #FF9900;
    line-height: 14px;
    margin-bottom: 10px;
}

legend {
    font-size: 12px;
    color: #FF9900;
    line-height: 14px;
    border-style: none;
    width: auto;
    margin-bottom: 0px;
}

input[type="radio"], input[type="checkbox"] {
    margin-right: 5px;
}

input[type="radio"],
input[type="checkbox"] {
    vertical-align: top;
}

.margin-bottom {
    margin-bottom: 15px;
}

.margin-bottom28 {
    margin-bottom: 28px;
}

.margin-right {
    margin-right: 10px;
}

.margin-left20 {
    margin-left: 20px;
}

.margin-top {
    margin-top: 15px;
}

.margin-top3 {
    margin-top: 3px;
}

.margin-top6 {
    margin-top: 6px;
}

.margin-bottom3 {
    margin-bottom: 3px;
}

.margin-left3 {
    margin-left: 3px;
}

.margin6 {
    margin: 6px;
}

.conf-frame {
    width: 586px;
    background-color: #FFFFFF;
    border-color: #9D9D9D;
    border-style: solid;
    border-width: 1px;
    box-shadow: 2px 2px 8px #BBBBBB;
    padding: 6px;
    margin:auto;
}

.unterbereich {
    background-color: #FFFFFF;
    border: 1px solid #DDDDDD;
    padding: 5px;
}
.unterbereich [class*="span"] {
    min-height: 15px;
}

.align-right {
    text-align: right;
}

span.margin-bottom {
    display: block;
}

select {
    padding: 2px 0px 2px 1px;
    height: 24px;
    width: 66px;
}

.selected-row-color, .table tr.selected-row-color
{
    background-color:#FFAA44;
}

label.leftindent {
    margin-left: 18px;
}

.icon-ic-question-sign {
    background-position: 0px;
    background-image: url("images/fragezeichen.png");
}

select.dropdown-autowidth {
    width: auto;
}

.anzeige-hervorgehoben {
    color: #FF9900;
    font-size: 12px;
    font-weight: bold;
}

.btn-transparent {
    border-width: 0px;
    padding: 0px;
    background-color: transparent;
}

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

.control-line-height {
    line-height: 20px;
}

.inputs-bottom input {
    vertical-align: bottom;
}

.modal-backdrop-white .modal-backdrop {
  background-color: #fff;
}

/* Other special changes and addtitions for prt steps
-----------------------------------------------------------*/

.haftung-titel {
    margin-bottom: 27px;
}

    .haftung-titel .haftung-titel-text {
        font-size: 16px;
        line-height: 24px;
    }

    .haftung-titel .haftung-titel-link {
        text-decoration: underline;
        color: #232323;
        vertical-align: middle;
        margin-left: 18px;
    }

.haftung-text {
    line-height: 18px;
}

.step1-haftung-disabled {
    color: #aaa;
    cursor:default;
}

.step1-slidervalue {
    width:20px;
}

.navtab-aktuell {
    background-color:orange;
    border:solid #DDDDDD; 
    border-width: 1px 1px 0px 1px; 
    border-top-left-radius:4px; 
    border-top-right-radius:4px; 
    text-align:center;
}

.navtab-aktiv {
    background-color:#F4F4F4;
    border:solid #DDDDDD; 
    border-width: 1px 1px 0px 1px; 
    border-top-left-radius:4px; 
    border-top-right-radius:4px; 
    text-align:center;
}

.navtab-aktiv a{
    text-decoration:none;
    color:inherit;
}

.navtab-deaktiviert {
    background-color:lightgray; 
    color:darkgray; 
    border:solid #DDDDDD; 
    border-width: 1px 1px 0px 1px; 
    border-top-left-radius:4px; 
    border-top-right-radius:4px; 
    text-align:center;
}

.step1-labeldeaktiviert {
    color: lightgray;
}

.step1-resultheader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    padding: 3px; 
    font-weight: bold;
}

.step1-resultbox {
    padding: 40px 0 0 0;
    min-height: 65px;
}

.step1-resultfooter {
    padding: 0px 5px 5px 5px;
}

.step1-resultimage {
    margin-top: 3px;
    margin-bottom: 8px;
}

.step1-deliveryimage {
    margin-bottom: 4px;
}

.step1-textbig {
    font-weight: bold; 
    font-size:14px
}

.step1-result.deaktiviert {
    opacity:0.5; 
    filter:alpha(opacity=50);
}

.opacity40 {
    opacity:0.4; 
    filter:alpha(opacity=40);
}

.step1-result {
    color: #666666;
    background-color: #F4F4F4;
    border: 1px solid #ddd;
    position: relative;
}

.step1-result.aktiviert {
    cursor: pointer;
}

.step1-result.aktiviert:hover {
    border: 1px solid #ff9900;
    background-color: #fff;
}

.step1-result.aktiviert:hover .step1-resultheader {
    color: #ff9900;
}

.step1-resultrow .popover
{
    max-width: 200px;
}

.step1-resultrow .popover ul
{
    margin: 0 0 7px 7px;
}

.step1-kohinweis {
    border: 1px solid #fc3;
    background-color: #ffd;
    margin-bottom: 15px;
    padding: 3px 10px;
}

.step2-menge {
    width: 25px;
}

.step2-durchmesser {
    width: 90px;
}

.step2-lebensdauerbereich {
    background-color: #EEEEEE;
    border: 1px solid #DDDDDD;
    padding: 5px 5px 0px;
    margin: 6px 0px;
}

.step2-lebensdauerbereich [class*="span"] {
    min-height: 15px;
}

.step2-lebensdauerbereich > div {
    margin-bottom: 5px;
}

div[data-icprtartikelnr] .popover
{
    max-width: 250px;
}

.step2-articlelistcontainer {
    border: 1px solid #9D9D9D;
}

.step2-articlelist {
    background-color:#FFFFFF; 
    height:294px; 
    overflow-y:scroll;
}

.step2-articlerowseparator {
    border-bottom: 1px solid #DDDDDD; 
    margin: 0px 6px;
}

.step2-articletext {
    min-height:2.5em;
}

.step2-articledata {
    margin-right: 6px;
}

.step2-articlegroup [class*="span"] {
    min-height: 15px;
}

.step2-deaktiviert {
    opacity:0.5; 
    filter:alpha(opacity=50);
}

.step2-deaktiviert label {
    cursor:default;
}

.step2-artikelbildbereich {
    padding: 5px;
}

div.step2-artikelgruppenbereich {
    padding: 8px 8px 8px 8px;
    background-color: #F4F4F4;
    border: 1px solid #ddd;
    margin: 5px 5px 5px 0px;
}

.step2-articlegroup .popover ul {
    margin: 0 0 0 7px;
}

.step1-prtimage {
    display:block; 
    margin: 0 auto; 
}

.step2-prtimagebox {
    height:148px;
}

.step2-deliveryimage {
    margin-bottom: 2px;
}

.step2-preis {
    min-width:100px;
}

.step2-groupart-wrapper {
    display:inline-block;
    height:100%;
}

.step2-checkicon {
    display:inline-block;
    padding: 2px 4px;
}

.input-validation-error.step1-belastungfehlt {
    border: 1px solid #faa !important;
}

input.input-validation-error.step1-belastungfehlt[disabled] {
    border: 1px solid #ccc !important;
}


/* Adding gradient to Button design for IE8/9
-----------------------------------------------------------*/
.btn {
    -ms-filter: "progid:dximagetransform.microsoft.gradient(startcolorstr='#ffffff', endcolorstr='#e6e6e6')";
}
.btn:hover,
.btn:focus,
.btn:active,
.btn.active,
.btn.disabled,
.btn[disabled] {
    -ms-filter: "progid:dximagetransform.microsoft.gradient(startcolorstr='#e6e6e6', endcolorstr='#e6e6e6')";
}

.btn-warning {
    -ms-filter: "progid:dximagetransform.microsoft.gradient(startcolorstr='#fbb450', endcolorstr='#f89406')";
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.btn-warning.disabled,
.btn-warning[disabled] {
    -ms-filter: "progid:dximagetransform.microsoft.gradient(startcolorstr='#f89406', endcolorstr='#f89406')";
}

/* Bootstrap jqzoom compatibility
-----------------------------------------------------------*/
/* Set back original max-width behaviour for images, as zoom wrapper measures also internal images who are affected by this,
    otherwise, slight zoom errors may occur for certain zoom factors, but not necessary always */
img { 
    max-width:none;
}

/* Set desired bootstrap max-width behaviour for images inside root element */
.conf-frame img {
    max-width: 100%;
}

/* Set original max-width behaviour for images inside zoom wrapper */
.conf-frame .zoomWrapperImage img {
    max-width:none;
}
