/** *************************************************************************************/
/** blau: #003A7D */
/** orange: #FFAC00 */

/** *************************************************************************************/
/* roboto-300 - latin */
@font-face {
    font-family: 'Roboto';
    font-style:  normal;
    font-weight: 300;
    src:         url('fonts/roboto-v30-latin-300.eot');
    src:         local(''),
                 url('fonts/roboto-v30-latin-300.eot?#iefix') format('embedded-opentype'),
                 url('fonts/roboto-v30-latin-300.woff2') format('woff2'),
                 url('fonts/roboto-v30-latin-300.woff') format('woff'),
                 url('fonts/roboto-v30-latin-300.ttf') format('truetype'),
                 url('fonts/roboto-v30-latin-300.svg#Roboto') format('svg');
}

/* roboto-regular - latin */
@font-face {
    font-family: 'Roboto';
    font-style:  normal;
    font-weight: 400;
    src:         url('fonts/roboto-v30-latin-regular.eot');
    src:         local(''),
                 url('fonts/roboto-v30-latin-regular.eot?#iefix') format('embedded-opentype'),
                 url('fonts/roboto-v30-latin-regular.woff2') format('woff2'),
                 url('fonts/roboto-v30-latin-regular.woff') format('woff'),
                 url('fonts/roboto-v30-latin-regular.ttf') format('truetype'),
                 url('fonts/roboto-v30-latin-regular.svg#Roboto') format('svg');
}

/* roboto-700 - latin */
@font-face {
    font-family: 'Roboto';
    font-style:  normal;
    font-weight: 700;
    src:         url('fonts/roboto-v30-latin-700.eot');
    src:         local(''),
                 url('fonts/roboto-v30-latin-700.eot?#iefix') format('embedded-opentype'),
                 url('fonts/roboto-v30-latin-700.woff2') format('woff2'),
                 url('fonts/roboto-v30-latin-700.woff') format('woff'),
                 url('fonts/roboto-v30-latin-700.ttf') format('truetype'),
                 url('fonts/roboto-v30-latin-700.svg#Roboto') format('svg');
}


/** blau: #003A7D */
/** orange: #FFAC00 */
* {
    box-sizing: border-box;
}


a {
    text-decoration:    none;
    -webkit-transition: all .3s;
    transition:         all .3s;
}

table {
    width: 100%;
}

table td {
    border-spacing: 0;
}

table.registration td:nth-of-type(1) {
    width: 40%;
}

table.registration td:nth-of-type(2) {
    width: 60%;
}

.adminView:before {
    position:    absolute;
    padding:     3px;
    background:  #990000;
    content:     "Achtung inaktiv!";
    color:       #FFF;
    border:      1px solid #FFF;
    font-weight: bold;
    margin-left: 41px;
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
}

img {
    border:    0;
    outline:   0;
    max-width: 100%;
}

h2,
h3,
h4 {
    font-weight: 400;
    color:       #003A7D;
}

h2 {
    font-size: 1.8em;
}

h3 {
    font-size: 1.5em;
}

h4 {
    font-size:     1.3em;
    margin-bottom: .8em;
    color:         #003A7D;
}

html {
    font-size:   calc(.80em + .15vw);
    line-height: calc(1.40em + .15vw);
}

body {
    margin:           0;
    padding:          0;
    background-color: #FFFFFF;
    font-size:        .95em;
    font-family:      'Roboto', Arial, Helvetica, sans-serif;
    line-height:      1.6em;
}

#container {
    width:    100%;
    margin:   0 auto;
    position: relative;
}

#header {
    background: #003A7D;
    width:      100%;
    height:     80px;
}

#header img {
    max-width: 200px;
}

#header h2 {
    display:         inline-block;
    color:           #FFF;
    text-decoration: none;
    text-transform:  uppercase;
    font-weight:     bold;
    margin:          0;
    padding:         0;
    padding-left:    2em;
}

#header h2 span {
    color: #FFAC00;
}


.wrapper {
    max-width: 1600px;
    margin:    0 auto;
    padding:   0 1em;
}

.wrapper.flex {
    display:        flex;
    flex-direction: row;
    align-items:    center;
    height:         100%;
}

img#epTitle {
    width: 100%;

}

a#adminBack {
    padding:            1.2em 2em;
    text-decoration:    none;
    color:              #FFF !important;
    background:         #FFAC00;
    text-align:         center;
    -webkit-transition: all .3s;
    transition:         all .3s;
    /*float:              left;*/
    font-size:          .9em;
}

a#adminBack:hover {
    background: #FFAC00;
}

#userMenue {
    display: none;
}

@media only screen and (min-width: 768px) {
    #userMenue {
        display: block;
        width:   70%;
    }
}


#userMenue ul {
    margin:          0;
    padding:         0;
    list-style-type: none;
    display:         flex;
    flex-direction:  row;
    align-items:     center;
}

#userMenue li {
    list-style-type: none;
    display:         inline;
    position:        relative;
    padding-right:   1em;
    padding-left:    1em;
    vertical-align:  middle;
}

#userMenue li:first-of-type {
    padding-left: 0;
}

#userMenue a {
    color:           #333;
    text-decoration: none;
}

#userMenue a:hover {
    color: #AAA;
}

#userMenue li:after {
    position:    absolute;
    top:         calc(50% - .7em);
    right:       0;
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
    content:     "|";
    color:       #333;
    font-weight: 300;
    font-size:   1.3em;
}

#userMenue li:last-of-type:after {
    display: none;
}

/** *************************************************************************************/


#left_content {

}

#right_content {

}

#right_content a:not([class]) {
    color: #003A7D;
}

#right_content a:not([class]):hover {
    color: #333;
}


#left_content h2 {
    color: #003A7D;
}

#left_content h4 {
    color: #333;
}

.contentFlexItemLeft {
    text-align: center;
}

.contentFlexItemRight a {
    color:       #003A7D;
    /*text-decoration: underline;*/
    font-weight: bold;
}

.contentFlexItemRight a:hover {
    color: #FFAC00;
}

@media only screen and (min-width: 768px) {
    .contentFlex {
        display:        flex;
        flex-direction: row;
    }

    .contentFlexItemLeft {
        width:      40%;
        text-align: left;
    }

    .contentFlexItemRight {
        width:       60%;
        margin-left: 2em;
    }

}

@media only screen and (min-width: 1024px) {
    .contentFlexItemLeft {
        width: 45%;
    }

    .contentFlexItemRight {
        width: 55%;
    }

}

#right_content h2 {
    /*font-family: 'Roboto', Arial, Helvetica, sans-serif;*/
    /*font-size:   1.8em;*/
    /*line-height: 120%;*/
    /*color:       #000;*/
    /*font-weight: bold;*/
    /*margin:      40px 0 40px 0;*/
}

#right_content h3 {
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
    font-size:   1.5em;
    /*font-weight: bold;*/
    /*border-bottom:  1px solid #AAA;*/
    /*padding-bottom: 2px;*/
    color:       #999;
}

.wrapper.content {
    display:        flex;
    flex-direction: column-reverse;
    padding-top:    1em;
}

@media only screen and (min-width: 1024px) {
    .wrapper.content {
        display:        flex;
        flex-direction: row;
    }

    #left_content {
        width:         30%;
        padding-right: 2em;
    }

    #right_content {
        width: 70%;
        /*margin-left: 3em;*/
    }
}

/** *************************************************************************************/

#noscript {
    position:    fixed;
    top:         0;
    left:        0;
    width:       100%;
    font-size:   14px;
    font-weight: bold;
}

/** user menü ************/

.sub_menu {
    margin-bottom: 1.5em;
}

.sub_menu ul {
    list-style-type: none;
    margin:          0;
    padding:         0;
}

.sub_menu ul li {
    padding-top: 0;
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
}

.sub_menu ul li a {
    /*font-weight:     bold;*/
    color:           #808080;
    display:         block;
    padding:         5px 0;
    text-decoration: none;
    outline:         0;
}

.sub_menu .active a {
    color:   #000;
    outline: 0;
}

.sub_menu ul li a:hover {
    text-decoration: underline;
}

/** admin menu (slider) *****************/

.admin_sub_menu {
    width:            240px;
    height:           auto;
    min-height:       180px;
    padding:          0;
    margin:           15px auto 15px 20px;
    border:           1px solid #888;
    background-color: #FFFFFF;
}

.admin_sub_menu h2 {
    font-size:     14px;
    font-weight:   bold;
    background:    #003A7D;
    color:         #EEEEEE;
    margin:        0;
    padding:       8px 0 8px 0;
    text-align:    center;
    text-shadow:   0 0 2px #000;
    border:        1px solid #FFF;
    border-bottom: 0;
}

.menu_container {
    width:         238px;
    margin:        1px;
    margin-bottom: 20px;
}

ul.menu,
ul.menu ul {
    list-style-type: none;
    margin:          0;
    padding:         0;
    width:           100%;
}

ul.menu a {
    display:         block;
    text-decoration: none;
    text-shadow:     0 1px 2px #000;
}

ul.menu li {
    margin-top: 1px;
}

ul.menu li a {
    background: #FFA200;
    color:      #FFF;
    padding:    0.5em;
}

ul.menu li a:hover {
    background: #777;
}

ul.menu li ul li a {
    background:   #CCC;
    color:        #000;
    padding-left: 20px;
    text-shadow:  none;
}

ul.menu li ul li a:hover {
    background:   #AAA;
    border-left:  5px #555 solid;
    padding-left: 15px;
}

.menu_container .active {
    background:  #AAA;
    border-left: 5px #555 solid;
}

/** ************/

.shop_cart {
    padding:       1.5em 1em;
    background:    #EAEAEA;
    margin-bottom: 2em;
}

.shop_cart a:hover {
    color:           #FFF;
    text-decoration: none;
    outline:         0;
}

.shop_cart h2 {
    margin-top: 0;
}

.shop_cart p:last-of-type {
    margin-bottom: 0;
}

.support a {
    color: #333;
}

.support a:hover {
    color: #003A7D;
}

.support p {
    margin-top:    .2em;
    margin-bottom: .2em;
}

/** footer *************************************************************************************/

#footer {
    margin-top:    3em;
    margin-bottom: 1em;
}

#footer ul {
    margin:  0;
    padding: 0;
}

#footer ul li {
    display:       inline-block;
    padding-right: 1em;
    padding-left:  0;
}

#footer ul li a {
    color:           #333;
    text-decoration: 0;
}

#footer ul li a:hover {
    color: #003A7D;
}

.footerFlex p.col2 {
    color:     #AAAAAA;
    font-size: .9em;
}

@media only screen and (min-width: 1024px) {
    .footerFlex {
        display:         flex;
        justify-content: space-between;
    }

    .footerFlex p.col2 {
        padding: 0;
        margin:  0;
    }
}

/** allgemeine klassen *************************************************************************************/

.shadow {
    text-shadow: 0 1px 0 #FFF, 0 -1px 0 #000;
}

.jung_yellow {
    color: #FFAC00;
}

.color1 {
    color: #CE841D;
}

.color2 {
    color:       #FFF;
    font-weight: bold;
}

.color3 {
    color: #CE0000;
}

.clear {
    clear:   both;
    margin:  0;
    padding: 0;
}

.clearfix:after {
    visibility: hidden;
    display:    block;
    font-size:  0;
    content:    " ";
    clear:      both;
    height:     0;
}

* html .clearfix {
    transform: scale(1);
}

/* IE6 */
*:first-child + html .clearfix {
    transform: scale(1);
}

table.priceTable td:nth-of-type(1) {
    width:         50%;
    padding-right: 1em;
    text-align:    right;
}

table.priceTable td:nth-of-type(2) {
    width:         50%;
    padding-right: 1em;
    text-align:    right;
}

/** formular user data *************************************************************************************/

.form label {
    display: block;
}

.form input[type="text"],
.form input[type="password"],
.form textarea {
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
    font-size:   .9em;
    border:      1px solid #AAA;
    padding:     1em;
    outline:     0;
    width:       100%;
}

.input_text,
.input_text_1,
.input_text_2,
.input_ddl {
    border:           1px solid #AAA;
    background-color: #FFFFFF;
    color:            #000000;
    font-size:        .9em;
    font-family:      'Roboto', Arial, Helvetica, sans-serif;
    padding:          1em;
    outline:          0;
}

textarea.input_text {
    line-height: 150%;
    font-size:   1em;
}

.input_text {
    width: 400px;
}

.input_text_1 {
    width: 300px;
}

.input_text_2 {
    width: 100px;
}

.input_ddl {
    width: 400px;
}

ul {
    list-style-type: none;
    padding-left:    10px;
}

ul.list {
    list-style-type: square;
}

ul.list li {
    margin-bottom: 15px;
}

/** formular kategorien *************************************************************************************/

.katLabel {
    width:   150px;
    display: block;
    float:   left;
}

.katClear {
    clear: both;
}

/** formular admin prospekt anlegen ************************************************************************************************************/

.td_description {
    vertical-align: top;
}

.td_content {}

.input_field_txt,
.input_field,
.input_field_ddl,
.input_field_short {
    width:            250px;
    border:           1px solid #CACBCF;
    background-color: #FFFFFF;
    color:            #000000;
    padding:          2px;
    font-family:      'Roboto', Arial, Helvetica, sans-serif;
    font-size:        12px;
}

.input_field_txt {
    height: 80px;
}

.input_field_short {
    width: 95px;
}

.input_field_ddl {
    width: 100px;
}

.longDDL {
    width: 255px;
}


/** user sieht eindruck in dem prospekt ************************************************************************************************************/

#vorschau_text_vs {
    width:        360px;
    height:       auto;
    float:        right;
    margin-right: 0;
    font-weight:  bold;
    color:        #333333;
}

#working_vs {
    display:    none;
    width:      230px;
    height:     252px;
    background: url("images/ajax-loader.gif") no-repeat 75px 110px;
    float:      left;
}

#eindruck_ready_vs {
    width:  230px;
    height: auto;
}

#vorschau_text_rs {
    width:        70%;
    float:        left;
    padding-left: 2em;
}

#working_rs {
    /*display: none;*/
    width:      230px;
    height:     252px;
    background: url("images/ajax-loader.gif") no-repeat 75px 110px;
    float:      left;
}

#eindruck_ready_rs {
    width: 30%;
    float: left;
}

#generate_eindruck {
    z-index:     999;
    position:    absolute;
    top:         30px;
    left:        140px;
    display:     none;
    text-align:  center;
    padding-top: 110px;
    width:       600px;
    height:      290px;
    background:  url("images/loading.png") no-repeat center center;
}

#logo_upload_admin {
    z-index:     999;
    position:    absolute;
    bottom:      50px;
    left:        140px;
    display:     none;
    text-align:  center;
    padding-top: 110px;
    width:       600px;
    height:      290px;
    background:  url("images/loading.png") no-repeat center center;
}

/** bestellung aufgeben ************************************************************************************************************/

#rechnungsanschrift {
}

#lieferanschrift {
    display: none;
}

@media only screen and (min-width: 768px) {
    #rechnungsanschrift {
        margin-right: 2em;
        width:        50%;
    }

    #lieferanschrift {
        width: 50%;
    }
}

#firstHeader {
    display:         flex;
    flex-direction:  row;
    justify-content: flex-end;
    align-items:     center;
}

@media only screen and (min-width: 768px) {
    #firstHeader {
        justify-content: space-between;;
    }
}

#userSearch {
    text-align: right;
}

#userSearch form {
    float: right;
}

#userSearch .input {
    width:       50%;
    font-size:   .9em;
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
    color:       #333333;
    /*float:       left;*/
    padding:     1em 1em;
    background:  #EEE;
    border:      0;
    outline:     0;
    line-height: 1.6em;

}

#userSearch button {
    cursor:         pointer;
    border:         0;
    background:     #FFAC00;
    color:          #FFF;
    padding:        1em 2em;
    outline:        0;
    text-transform: uppercase;
    /*font-weight:    bold;*/
    font-size:      .9em;
    font-family:    'Roboto', Arial, Helvetica, sans-serif;
    line-height:    1.6em;
}

/** mitteilungen ausgeben ************************************************************************************************************/

.ok,
.info,
.error,
.tip {
    width:         100%;
    height:        auto;
    margin:        0;
    margin-bottom: 20px;
    padding:       .8em 1.5em;
}

.ok {

    background: url("images/output_ok.png") no-repeat 20px center #D5FFCE;
}

.error {
    background: url("images/output_error.png") no-repeat 20px center #FFD5D5;
}

.info {
    background: url("images/output_info.png") no-repeat 20px center #FFEBBB;
}

.tip {
    background: url("images/info_user.png") no-repeat 20px center #D7EAFF;
}

.ok ul,
.error ul,
.info ul,
.tip ul {
    list-style-type: none;
}

.ok li,
.error li,
.info li,
.tip li {
    padding-left: 40px;
    color:        #000000;
}

.message {
    background-color: #EEE;
    padding:          1em;
}

/** blätterfunktion *******************************************************************************************************************/

#right_content .pagination {
    margin-top: 30px;
}

#right_content .pagination .seiten_anzeige {
    margin-right: 12px;
    /*font-weight:  bold;*/
}

#right_content .pagination .seiten_navi a,
#right_content .pagination .seiten_navi .active,
#right_content .pagination .seiten_navi a:hover {
    border:          1px solid #333367;
    padding:         .7em 1em;
    background:      #003A7D;
    color:           #FFFFFF;
    text-decoration: none;
    outline:         none;
    font-size:       .9em;
}

#right_content .pagination .seiten_navi .active,
#right_content .pagination .seiten_navi a:hover {
    background:   #FFAC00;
    color:        #000000;
    border-color: #FFAC03;
}

/** tooltips *******************************************************************************************************************/

.tt_container_out {
    position: absolute;
    z-index:  990;
    display:  none;
    width:    394px;
    height:   auto;
    margin:   -0px auto 0 auto;
}

.tt_container_top {
    position:   relative;
    z-index:    991;
    background: url("images/tt_shadow_top.png") no-repeat 0 0;
    height:     21px;
}

.tt_container_content {
    position:   relative;
    z-index:    991;
    background: url("images/tt_shadow_content.png") repeat-y 0 0;
    padding:    0;
}

.tt_container_bottom {
    position:   relative;
    z-index:    991;
    background: url("images/tt_shadow_bottom.png") no-repeat 0 0;
    height:     21px;
}

.tt_container {
    position:         relative;
    z-index:          992;
    background-color: #FFFFFF;
    width:            350px;
    margin:           0 auto;
    border:           1px solid #888888;
    height:           auto;
    font-size:        11px;
    font-family:      'Roboto', Arial, Helvetica, sans-serif;
    white-space:      normal;
}

.tt_head {
    position:    relative;
    z-index:     993;
    background:  url("images/orange.png") repeat-x 0 0;
    height:      19px;
    text-align:  left;
    padding:     6px 5px 0 5px;
    color:       #000000;
    font-weight: bold;
}

.tt_content {
    position:         relative;
    z-index:          993;
    border-top:       1px solid #888888;
    padding:          5px;
    background-color: #F4F3F2;
    text-align:       left;
}

/** button *******************************************************************************************************************/

.button_normal,
.button_mover {
    cursor:                pointer;
    font-family:           'Roboto', Arial, Helvetica, sans-serif;
    margin:                0;
    padding:               3.5px;
    color:                 #000000;
    background:            url("images/button.jpg") repeat-x 0 0;
    height:                auto;
    border:                1px solid #AAA;
    font-size:             12px;
    font-weight:           bold;
    -moz-border-radius:    5px;
    -webkit-border-radius: 5px;
    border-radius:         5px;
    box-shadow:            0 0 10px #CCC;
    -webkit-box-shadow:    0 0 10px #CCC;
    -moz-box-shadow:       1px 1px 5px #CCC;
}

.button_mover,
.button_mover a:hover {
    color:      #FFFFFF;
    background: url("images/button_a.jpg") repeat-x 0 0;
}

.button_mover:focus {
    box-shadow:         inset 0 0 10px #000;
    -webkit-box-shadow: inset 0 0 10px #000;
    -moz-box-shadow:    inset 0 0 10px #000;
}

.button_disabled {
    font-family:           'Roboto', Arial, Helvetica, sans-serif;
    margin:                0;
    padding:               3px;
    color:                 #555;
    background:            url("images/button_disabled.jpg") repeat-x 0 0;
    height:                auto;
    border:                1px solid #AAA;
    font-size:             12px;
    font-weight:           bold;
    -moz-border-radius:    5px;
    -webkit-border-radius: 5px;
    border-radius:         5px;
    box-shadow:            0 0 10px #CCC;
    -webkit-box-shadow:    0 0 10px #CCC;
    -moz-box-shadow:       1px 1px 5px #CCC;
}

.pointer {
    cursor: pointer;
}

.clear {
    clear: left;
}

.image_button,
.image_button_hover {
    cursor:         pointer;
    background:     url("images/button_test.png") no-repeat 0 0;
    width:          120px;
    height:         50px;
    border:         none;
    font-weight:    bold;
    outline:        0;
    color:          #FFF;
    text-shadow:    0 1px 2px #000;
    padding-bottom: 0;
}

.image_button_hover {
    background: url("images/button_hover.png") no-repeat 0 0;
}

.image_button_trans {
    cursor:         pointer;
    background:     none;
    border:         none;
    width:          32px;
    font-weight:    bold;
    outline:        0;
    color:          #000;
    padding-bottom: 0;
}

.tell_form {
    margin-top:  -17px;
    margin-left: -240px;
    padding:     75px 0 0 40px;
    width:       290px;
    height:      170px;
    background:  url("images/dialog.png") no-repeat;
    display:     none;
    position:    absolute;
    z-index:     999;
}

.tell_form .input {
    width:            110px;
    height:           20px;
    margin-bottom:    5px;
    border:           1px solid #CCC;
    background-color: #F4F4F4;
}

.tell_form h3 {
    font-size: 14px;
    padding:   0 0 10px 0;
    margin:    0;
}

.email_form {
    margin-top:  10px;
    margin-left: -230px;
    padding:     60px 0 0 30px;
    width:       290px;
    height:      170px;
    background:  url("images/dialog.png") no-repeat;
    display:     none;
    position:    absolute;
    z-index:     999;
}

.email_form .input {
    width:            110px;
    padding:          3px;
    margin-bottom:    5px;
    border:           1px solid #CCC;
    background-color: #F4F4F4;
    font-family:      'Roboto', Arial, Helvetica, sans-serif;
    font-size:        11px;
}

.email_form h3 {
    font-size: 14px;
    padding:   0 0 10px 0;
    margin:    0;
}

/** uploads ************************************************************************************************************/

#vordrucke {
    width:   100%;
    margin:  0;
    padding: 0;
}

#fileUpload {
    margin-top: 1em;
}

.fileUploadQueueItem {
    font:             11px Arial, Verdana, Geneva, sans-serif;
    background-color: #F5F5F5;
    border:           1px solid #CCC;
    margin-top:       5px;
    margin-bottom:    15px;
    padding:          10px;
    width:            620px;
    color:            #000000;
}

.fileUploadQueueItem .cancel {
    float: right;
}

.fileUploadProgress {
    background-color: #FFFFFF;
    border:           1px solid #CCCCCC;
    margin-top:       10px;
    width:            100%;
}

.fileUploadProgressBar {
    background-color: #990000;
}

#fileUploadQueue {
    margin-top: 20px;
}

/** tabs *************************************************************************************************************************************/

.shadetabs {
    padding:         3px 0;
    margin-left:     0;
    margin-top:      0;
    margin-bottom:   0;
    list-style-type: none;
}

#tabs ul {
    margin: 0;
}

.shadetabs li {
    display: block;
    margin:  0;
    float:   left;
}

#right_content ul.shadetabs li a,
#right_content ul.shadetabs li a:hover {
    display:      block;
    text-align:   center;
    position:     relative;
    z-index:      1;
    padding:      1em 2em;
    margin-right: 1px;
    color:        #AAA;
    background:   #888;
}

#right_content ul.shadetabs li a.selected {
    display:      block;
    text-align:   center;
    position:     relative;
    z-index:      1;
    margin-right: 1px;
    background:   #EAEAEA;
}

#right_content ul.shadetabs li a.selected:hover {
    text-decoration: none;
}

#tabs ul li a {
    color: #DDD;
}

#tabs ul li a:hover {
    color: #FFF;
}

#tabs ul li a.selected {
    color: #333;
}

#tabs ul li a.selected:hover {
    color: #333;
}

/** logo verwaltung user *************************************************************************************/

#logo_checked {
    min-height:       50px;
    background-color: #EAEAEA;
    padding:          1em;
    width:            100%;
}

#logo_unchecked {
    min-height:       50px;
    background-color: #EAEAEA;
    padding:          1em;
    width:            100%;
}

.logo_upload {
    background-color: #EAEAEA;
    padding:          1em;
}

.logo_color {
    float:        left;
    padding-left: 10px;
}

.logoBox {
    width:          calc(100% + 1em);
    display:        flex;
    flex-direction: row;
    flex-wrap:      wrap;
    margin-left:    -.5em;
}

.logo_container {
    border:           1px solid #CCC;
    background-color: #FFF;
    padding:          1em;
    display:          flex;
    flex-direction:   column-reverse;
    justify-content:  flex-end;
    width:            calc(50% - 1.1em);
    margin:           0 .5em 1em .5em;
}


.error_output {
    margin:      10px 0;
    font-weight: bold;
    color:       #FFAC00;
    clear:       both;
}

.logo_picture img {
    width:     100%;
    border:    1px solid #CCC;
    max-width: 300px;
}

@media only screen and (min-width: 768px) {
    .logo_container {
        flex-direction: row-reverse;
    }

    .logo_options {
        width:        50%;
        padding-left: 3em;
    }

    .logo_picture {
        width: 50%;
    }
}


#logo_upload {}

/** aktionen  *************************************************************************************/

.aktionsUebersicht {
    display:        flex;
    flex-direction: row;
    flex-wrap:      wrap;
    align-items:    center;
    /*justify-content: center;*/
}


.aktKontainer {
    display:       block;
    position:      relative;
    border:        1px solid #DDD;
    width:         100%;
    padding:       1em;
    text-align:    center;
    margin-bottom: 2em;

}

.aktKontainer:hover {
    border:     1px solid #FFAC00;
    box-shadow: 0 1em 2em rgba(0, 0, 0, .1);
}

.aktTitle {
    padding-bottom: 1em;
    font-size:      1.3em;
    font-weight:    bold;
    color:          #333;
}

.aktImg img {
    width:   100%;
    display: block;
}

@media only screen and (min-width: 768px) {

    .aktKontainer {
        width:  47%;
        margin: 0 1em 1em 0;

    }
}

/** kategorien  *************************************************************************************/

.katOverview {
    width:          calc(100% + 1em);
    margin-left:    -.5em;
    display:        flex;
    flex-direction: row;
    flex-wrap:      wrap;
}

.katKontainer {
    display:    block;
    position:   relative;
    border:     1px solid #DDD;
    min-width:  200px;
    width:      calc(50% - 1.05em);
    padding:    1em;
    margin:     0 .5em 1em .5em;
    text-align: center;
}

@media only screen and (min-width: 768px) {
    .katKontainer {
        width: calc(33.333333333% - 1.05em);
    }
}

.katKontainer:hover {
    border:     1px solid #FFAC00;
    box-shadow: 0 1em 2em rgba(0, 0, 0, .1);
}

.katTitle {
    padding:     5px 0 5px 0;
    width:       100%;
    display:     block;
    font-size:   14px;
    font-weight: bold;
    line-height: 150%;
    color:       #333;
}

.inactive {
    position:   absolute;
    bottom:     0;
    right:      0;
    width:      auto;
    padding:    5px;
    border:     1px solid #FFAC00;
    background: #FFAC00;
    color:      #FFF;
    rotate:     -35deg;
}

.inactive.article {
    rotate: 0deg;
    left:   1em;
    right:  initial;
    bottom: 3em;
}

.articleImage {
    display: inline-block;
}

.articleImage a {
    border:   1px solid #BBB;
    display:  inline-block;
    position: relative;
}

.articleImage img {
    width:   100%;
    display: block;
}

@media only screen and (min-width: 768px) {
    .articleImage.portrait {
        width: 50%;
    }

    .prospekt_td .articleImage:nth-of-type(1) {
        padding-right: .5em;
    }

    .prospekt_td .articleImage:nth-of-type(2) {
        padding-left: .5em;
    }

    .katTitle {
        padding:   0 0 5px 0;
        font-size: 17px;
    }
}

/** hilfe box ************************************************************************************************************/

.fade-form {
    text-align:            left;
    display:               none;
    width:                 500px;
    height:                auto;
    margin:                0;
    padding:               0 30px 30px 30px;
    z-index:               999;
    position:              absolute !important;
    background-color:      #DDD;
    border:                1px solid #AAA;
    box-shadow:            0 0 25px #333;
    -webkit-box-shadow:    0 0 25px #333;
    -moz-box-shadow:       0 0 25px #333;
    -moz-border-radius:    10px;
    -webkit-border-radius: 10px;
    border-radius:         10px;
}

.fade-form a {
    font-weight:     bold;
    color:           #FF6600;
    text-decoration: none;
}

.fade-form a:hover {
    font-weight:     bold;
    color:           #333333;
    text-decoration: underline;
}

.close-button {
    float:  right;
    margin: -1px -22px 0 0;
}

.close-button:hover {
    float:  right;
    margin: -1px -22px 0 0;
}

.close-button:active {
    box-shadow:         0 0 5px #FFF;
    -webkit-box-shadow: 0 0 5px #FFF;
    -moz-box-shadow:    0 0 5px #FFF;
}

/** schwarze fl�che f�r hilfe box */
.black {
    position:         fixed;
    margin:           0 auto 0 auto;
    z-index:          99;
    width:            100%;
    height:           100%;
    background-color: #333;
    filter:           alpha(opacity=70);
    /* IE */
    -moz-opacity:     0.70;
    /* Mozilla */
    opacity:          0.70;
    /* Opera */
    top:              0;
    left:             0;
    display:          none;
}

/** ajax box ************************************************************************************************************/

.fade-form-ajax {
    text-align:            left;
    height:                400px;
    width:                 600px;
    overflow:              auto;
    padding:               0 30px 30px 30px;
    z-index:               100;
    position:              absolute;
    background-color:      #DDD;
    border:                1px solid #AAA;
    box-shadow:            0 0 25px #000;
    -webkit-box-shadow:    0 0 25px #000;
    -moz-box-shadow:       0 0 25px #000;
    -moz-border-radius:    10px;
    -webkit-border-radius: 10px;
    border-radius:         10px;
}

.ajax-black {
    position:         fixed;
    z-index:          99;
    padding:          0;
    margin:           0;
    width:            100%;
    height:           100%;
    background-color: #333;
    filter:           alpha(opacity=70);
    /* IE */
    -moz-opacity:     0.70;
    /* Mozilla */
    opacity:          0.70;
    /* Opera */
    top:              0;
    left:             0;
    display:          none;
}

.praemieBox {
    padding:       10px;
    padding-top:   0;
    background:    #E7F0D0;
    border:        1px solid #AAA;
    margin-bottom: 20px;
}

input[type=submit].buttonNew,
button[type=submit].buttonNew,
a.link_button {
    background:         #003A7D;
    padding:            1em 2em;
    font-size:          1em;
    color:              #FFF;
    border:             none;
    cursor:             pointer;
    font-family:        'Roboto', Arial, Helvetica, sans-serif;
    -webkit-transition: all .3s;
    transition:         all .3s;
    text-decoration:    none;
    text-align:         center;
    display:            inline-block;
    line-height:        1rem;
}

input[type=submit].buttonNew:hover,
button[type=submit].buttonNew:hover,
a.link_button:hover {
    background: #FFAC00;
}

input[type=submit].buttonNew.invert,
button[type=submit].buttonNew.invert,
a.link_button.invert {
    background: #FFAC00;
}

input[type=submit].buttonNew.invert:hover,
button[type=submit].buttonNew.invert:hover,
a.link_button.invert:hover {
    background: #003A7D;
}

input[type=submit].buttonNew.Disabled,
button[type=submit].buttonNew.Disabled {
    background: #AAA;
}

input[type=submit].buttonNew.Disabled:hover,
button[type=submit].buttonNew.Disabled:hover {
    background: #AAA;
}

#right_content ul li a {
    color:              #333;
    -webkit-transition: all .3s;
    -moz-transition:    all .3s;
    -ms-transition:     all .3s;
    -o-transition:      all .3s;
    transition:         all .3s;
}

#right_content ul li a:hover {
    color: #FFAC00;
}

label a {
    color:              #E98C00;
    -webkit-transition: color .3s;
    -moz-transition:    color .3s;
    -ms-transition:     color .3s;
    -o-transition:      color .3s;
    transition:         color .3s;
}

label a:hover {
    color: #AAA;
}

a#salesFolderDownload {
    display:   inline-block;
    position:  relative;
    max-width: 250px;
}

a#salesFolderDownload img {
    width: 100%;
}

.fileList a {
    color:           #333;
    text-decoration: none;
}

.fileList a:hover {
    color: #FFAC00;
}

/** tabellen ************************************************************************************/

table {
    width:           100%;
    border-collapse: collapse;
}

.no-touch table#bestellUebersicht tr td:last-of-type > a {
    visibility:         hidden;
    opacity:            0;
    -webkit-transition: all .1s;
    transition:         all .1s;
}

.no-touch table#bestellUebersicht tr:hover td:last-of-type > a {
    visibility: visible;
    opacity:    1;
}

table#bestellUebersicht tr.tableContent td,
table#logoBestellTable tr.tableContent td,
table#bestellDetails tr.tableContent td {
    padding: .5em 1em;
}

table#bestellUebersicht tr.tableContent td,
table#logoBestellTable tr.tableContent td,
table#bestellDetails tr.tableContent td {
    background:         transparent;
    -webkit-transition: background-color .1s;
    transition:         background-color .1s;
}

table#bestellUebersicht tr.tableContent:hover td,
table#logoBestellTable tr.tableContent:hover td,
table#bestellDetails tr.tableContent:hover td {
    background-color: rgba(0, 0, 0, .04);
}

table#bestellUebersicht td:nth-of-type(1) {
    width:      10%;
    text-align: center;
}

table#bestellUebersicht td:nth-of-type(2) {
    width:      10%;
    text-align: right;
}

table#bestellUebersicht td:nth-of-type(3) {
    width: 30%;
}

table#bestellUebersicht td:nth-of-type(4) {
    width:      10%;
    text-align: right;
}

table#bestellUebersicht td:nth-of-type(5) {
    width:      10%;
    text-align: right;
}

table#bestellUebersicht td:nth-of-type(6) {
    width:      10%;
    text-align: right;
}


table#logoBestellTable {
    margin-bottom: 3em;
}

table#logoBestellTable td:nth-of-type(1) {
    width:      10%;
    text-align: center;
}

table#logoBestellTable td:nth-of-type(2) {
    width: 45%;
}

table#logoBestellTable td:nth-of-type(3) {
    width: 30%;
}

table#logoBestellTable td:nth-of-type(4) {
    width:      15%;
    text-align: right;
}


table#bestellDetails td:nth-of-type(1) {
    width:      10%;
    text-align: right;
}

table#bestellDetails td:nth-of-type(2) {
    width:      10%;
    text-align: right;
}

table#bestellDetails td:nth-of-type(3) {
    width: 50%;
}

table#bestellDetails td:nth-of-type(4) {
    width:      15%;
    text-align: right;
}

table#bestellDetails td:nth-of-type(5) {
    width:      15%;
    text-align: right;
}


table#warenkorb td {
    vertical-align: top;
    padding:        1em;
}

table#warenkorb td:nth-of-type(1) {
    width: 25%;
}

table#warenkorb td:nth-of-type(1) img {
    /*display: block;*/
}

table#warenkorb td:nth-of-type(2) {
    width: 55%;
}

table#warenkorb td:nth-of-type(3) {
    width: 20%;
}

table#warenkorb td:nth-of-type(3) p {
    margin-top: 0;
}

table#produktDetails td {
    vertical-align: top;
    padding:        3px 5px !important;
}

table#produktDetails td:nth-of-type(1) {
    width: 20%;
}

table#produktDetails td:nth-of-type(2) {
    width: 80%;
}


table#productDetail td {
    vertical-align: top;
}

table#productDetail td:nth-of-type(1) {
    width: 30%;
}

table#productDetail td:nth-of-type(2) {
    width: 15%;
}

table#productDetail td:nth-of-type(3) {
    width: 55%;
}

table#productOverview tr.articeRow td {
    background:         transparent;
    -webkit-transition: background-color .3s;
    transition:         background-color .3s;
}

table#productOverview tr.articeRow:hover td {
    background-color: rgba(0, 0, 0, .04);
}

table#productOverview td:nth-of-type(1) {
    width: 25%;
}

table#productOverview td:nth-of-type(2) {
    width:      5%;
    text-align: right;
}

table#productOverview td:nth-of-type(3) {
    width: 40%;
}

table#productOverview td.prospekt_td:nth-of-type(3) a {
    color: #333;
}

table#productOverview td.prospekt_td:nth-of-type(3) a:hover {
    color: #003A7D;
}


table#productOverview td:nth-of-type(4) {
    width: 30%;
}

table#productOverview table.articleDetails td {
    background-color: transparent !important;
}

table#productOverview table.articleDetails td:nth-of-type(1) {
    width: 30%;
}

table#productOverview table.articleDetails td:nth-of-type(1) a {
    text-align: center;
}

table#productOverview table.articleDetails td:nth-of-type(2) {
    width: 70%;
}

table#productOverview table.articleDetails td:nth-of-type(2) a {
    text-align: center;
}


table#adresse td {
    padding: .4em 0;
}

table#adresse td:nth-of-type(1) {
    width:       30%;
    font-weight: bold;
}

table#adresse td:nth-of-type(2) {
    width: 70%;
}

table#lieferAdresse td input.input_text {
    padding: .7em 1em;
}

table#lieferAdresse td:nth-of-type(1) {
    width: 30%;
}

table#lieferAdresse td:nth-of-type(2) {
    width: 70%;
}

table#fileBrowser td {
    padding:          .7em 1em;
    background-color: #DDD;
}

table#fileBrowser tr.browserContent td {
    background-color: #F5F5F5;
}

table#fileBrowser td:nth-of-type(1) {
    width: 40%;
}

table#fileBrowser td:nth-of-type(2) {
    width:      30%;
    text-align: right;
}

table#fileBrowser td:nth-of-type(3) {
    width:      30%;
    text-align: right;
}

table#userData td {
    padding: .3em 0;
}

/** artikeltabelle ************************************************************************************************************/

.table_head {
    color:       #003A7D;
    padding:     1em;
    background:  #E5E5E5;
    font-size:   1em;
    font-weight: bold;
}

.prospekt_td {
    vertical-align: top;
    padding:        1em;
    position:       relative;
}

.change_td {
    background-color: #EAEAEA;
}

.change_td_back {
    background-color: #ECECEC;
}

#right_content .table_head a {
    color:           #003A7D;
    text-decoration: none;
    outline:         0;
}

#right_content .table_head a:hover {
    color:           #FFAC00;
    text-decoration: none;
    outline:         0;
}


.logoSubBox {
    display:        flex;
    flex-direction: row;
    flex-wrap:      wrap;
}

.logoSelection {
    padding:          .5em;
    text-align:       center;
    border:           1px solid #CCC;
    margin:           .5em;
    background-color: rgba(0, 0, 0, .03);
}

.logoSubBox label {
    display:       block;
    margin-bottom: 1em;
}

.logoSelection a {
    display: inline-block;
}

#orderDetail .message {
    margin-bottom: 1em;
}

#orderDetail .message h3 {
    margin-top: 0;
}

@media only screen and (min-width: 768px) {
    .addressContainer {
        display:         flex;
        flex-direction:  row;
        justify-content: space-between;
    }

    .addressContainer .message {
        width: 50%;
    }

    .addressContainer .message:nth-of-type(2) {
        width:       calc(50% - 1em);
        margin-left: 1em;
    }
}

ul.userAction {
    list-style-type: square;
    color:           #FFAC02;
    line-height:     150%;
}

ul.userAction li {
    padding: .2em 0;
}

ul.userAction li a {
    padding: .5em 0;
}