@media only screen and (min-width : 160px) {
    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
        border: 0 none;
        font: inherit;
        margin: 0;
        padding: 0;
        vertical-align: baseline;
    }
    * {
        box-sizing: border-box;
        white-space: normal;
    }

    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
        border: 0 none;
        font: inherit;
        margin: 0;
        padding: 0;
        vertical-align: baseline;
    }

    html, body {
        font-size: 14px;
        height: 100%;
        margin: 0;
        padding: 0;
    }
    body {
        background: #ffffff none repeat scroll 0 0;
        color: #626161;
        font-family: "raleway-v4020light",sans-serif;
        font-feature-settings: "lnum";
        font-variant-numeric: lining-nums;
        font-weight: 300;
        text-rendering: geometricprecision;
    }
    * {
        box-sizing: border-box;
        white-space: normal;
    }

    h1 {
        color: #ffd7da;
        font-family: "Roboto",sans-serif;
        font-weight: 300;
        font-size: 40px;
        line-height: 40px;
        margin-top: 15px;
        margin-bottom: 15px;
    }
    h2 {
        color: #ffd7da;
        font-family: "Roboto",sans-serif;
        font-weight: 300;
        font-size: 32px;
        line-height: 32px;
        margin-top: 15px;
        margin-bottom: 15px;
    }

     h3 {
        color: #626161;
        font-family: "Roboto",sans-serif;
        font-weight: 400;
        font-size: 24px;
        line-height: 44px;
        margin-top: 15px;
        margin-bottom: 15px;
    }

    h4 {
        color: #626161;
        font-family: "Roboto",sans-serif;
        font-weight: 400;
        font-size: 20px;
        line-height: 44px;
    }

    h5 {
        color: #626161;
        font-family: "Roboto",sans-serif;
        font-weight: 400;
    }

    p {
        font-family: "Raleway",sans-serif;
        font-weight: 300;
        color: #626161;
        font-size: 16px;
        line-height: 18px;
    }

    a {
        color: #626161;
        transition: color 400ms ease 0s, background-color 400ms ease 0s;
    }
    a:hover, a:focus {
        color: #ffd7da;
        text-decoration: none;
    }
    a, a::before, a::after {
        transition: all 0.3s ease 0s;
    }

    ul, ol {
        margin: 0;
    }

    li {
        list-style: none;
    }

    hr {
        display: none;
    }
    img {
        border: 0 none;
        height: auto;
        max-width: 100%;
        vertical-align: middle;
    }
    body {
        background: rgba(0, 0, 0, 0) url(/cssitem/replacefile/7844/XM_BANNER_KERST_-1-kopie.png) no-repeat fixed center top / 100% auto;
    }

    table {
        border-collapse: collapse;
        border-spacing: 0;
        max-width: 100%;
        width: 100%;
        border: 1px solid #dad8d8;
        clear: both;
        overflow-x: scroll;
    }

    thead {
        background-color: #ffffff;
        border-bottom: 1px solid #dddddd;
        color: #000000;
    }

    .ui-jqgrid-htable thead {
        background-color: #ffffff;
        border: none;
    }
    .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
        background: none;
        color: #000000;
        font-weight: 100;
        text-align: left;
    }

    table td, table th {
        padding: 15px;
        text-align: left;
        vertical-align: middle;
    }

    .ui-jqgrid-htable thead {
        background-color: #ffffff;
        border: none;
    }

    .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
        background: none;
        color: #000000;
        font-weight: 100;
        text-align: left;
    }

    table td, table th
     {
        padding: 15px;
        text-align: left;
        vertical-align: middle;
    }

    .ui-jqgrid tr.ui-row-ltr td
     {
        padding: 15px;
        text-align: left;
        vertical-align: middle;
        font-size: 14px;
    }

    table[id^="documentstable"] td, table[id^="documentstable"] th {
        vertical-align: middle;
    }

    table[id^="documentstable"] td a {
        text-decoration: none;
    }

    .even, .orderroweven {
        background-color: #dad8d8;
    }

    table tbody tr {
        border-bottom: 1px solid #dad8d8;
        transition: all 0.1s ease 0s;
        background-color: #ffffff;
    }

    table tbody tr:hover {
        box-shadow: 0 1px 8px -5px #000000;
    }

    table#prijsinformatietabel tbody tr:hover, table[id*="documentstable"] tbody tr:hover {
        box-shadow: 0 1px 8px -5px #000000;
    }
    table img {
        max-width: unset;
    }

    thead {
        background-color: #ffffff;
        border-bottom: 1px solid #dddddd;
        color: #000000;
    }

    label {
        color: #626161;
        cursor: pointer;
        display: block;
        font-family: "Raleway",sans-serif;
        font-size: 14px;
        font-weight: 700;
        letter-spacing: 1px;
        margin-bottom: 10px;
        margin-top: 15px;
        max-width: 100%;
    }

    #bodydiv {
        height: 100%;
    }

    #bottom {
        display: none;
    }

    #bodydiv.bodydivnotree > div#tree {
        display: unset;
    }

    #bodydiv > div#tree::after {
        border-right: 1px solid #dad8d8;
        bottom: 0;
        content: "";
        display: block;
        pointer-events: none;
        position: absolute;
        right: 0;
        top: 0;
        width: 7px;
    }

    #bodydiv > div#tree {
        background: #ffffff;
        height: 100%;
        left: 0;
        position: fixed;
        top: 0;
        width: 250px;
        padding-top: 0;
        z-index: 999;
    }

    #bodydiv > div#tree {
        max-height: 100vh;
        overflow-x: hidden;
        overflow-y: scroll;
        border-bottom: 1px solid #dad8d8;
        -webkit-box-shadow: inset -3px -15px 54px -20px rgba(255,255,255,1);
        -moz-box-shadow: inset -3px -15px 54px -20px rgba(255,255,255,1);
        box-shadow: inset -3px -15px 54px -20px rgba(255,255,255,1);
    }

    #bodydiv #logo {
        background: url(/cssitem/replacefile/7845/XM_LOGO_GOUD.png) no-repeat scroll center 15px / 80% auto !important;
        height: 180px;
    }

    #bodydiv #logo a {
        width: 100%;
        height: 100%;
        display: block;
    }

    #bodydiv > div {
        min-height: 1px;
    }

    /*-- HEADER plaatsen --*/

    #bodydiv.p_main_actionitems #container > div#header {
        top: 470px;
    }

    #bodydiv > div#tree::after {
        border-right: 1px solid #dad8d8;
        bottom: 0;
        content: "";
        display: block;
        pointer-events: none;
        position: absolute;
        right: 0;
        top: 0;
        width: 7px;
    }

    #bodydiv.bodydivnotree > div#container {
        width: unset;
    }

    #bodydiv > div#container {
        background-size: contain !important;
    }

    #bodydiv > div#container {
        background: rgba(0, 0, 0, 0) url(/cssitem/replacefile/7844/XM_BANNER_KERST_-1-kopie.png) no-repeat fixed center top / 100% auto;
        height: 100%;
        position: relative;
        z-index: 1;
        background-size: contain;
    }

    #bodydiv.p_main_actionitems #container {
        background-image: none;
        padding: 533px 0 0;
    }

    #bodydiv > div#tree ~ div#container {
        margin-left: 250px;
    }

    #bodydiv > div {
        min-height: 1px;
    }

    #container > div#footer {
        background: #2c2e2d none repeat scroll 0 0;
        font-size: 0;
        height: 156px;
        padding: 25px 0;
        clear: both;
    }

    #container > div#header {
        background-color: #ffffff;
        border-radius: 30px;
        box-shadow: 10px 10px 9px -11px rgba(0, 0, 0, 0.59);
        height: 39px;
        left: 0;
        margin: 0 auto;
        max-width: 1000px;
        padding: 0;
        position: absolute;
        right: 0;
        top: 170px;
        width: 90%;
        z-index: 9999;
    }

    #header a {
        color: #2c2e2d;
        height: 40px;
        line-height: 40px;
        font-size: 14px;
        text-decoration: none;
    }

    #header a:hover {
        color: #ffd7da;
        transition: 0.2s ease-in;
    }

    #header ul {
        list-style: outside none none;
        margin: 0;
        padding: 0;
    }

    #header ul li {
        display: inline-block;
        margin-left: 20px;
        padding-left: 20px;
    }

    .afwijkende_knop {
        display: none !important;
    }

    #onderheader > div#inlog {
        float: right;
        position: absolute;
        right: 0;
        top: 0;
        transition: all 0.2s ease 0.2s;
        width: 200px;
        position: absolute;
        top: 30px;
        padding: 15px;
        -webkit-box-shadow: 10px 10px 19px -7px rgba(0,0,0,0.29);
        -moz-box-shadow: 10px 10px 19px -7px rgba(0,0,0,0.29);
        box-shadow: 10px 10px 19px -7px rgba(0,0,0,0.29);
        background-color: #ffffff;
        display: none;
    }

    #onderheader > div#inlog.open {
        display: block;
        transition: 0.3s ease-in;
    }

    #onderheader > div#inlog #naaminlog {
        font-size: 1.2em;
    }

    #onderheader > div#inlog #naaminlog::before {
        content: "\f2bd";
        font-family: FontAwesome;
        font-size: 18px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        top: 10px;
        line-height: 2;
    }

    #onderheader #inlog #inloggen a {
        width: 100%;
        display: block;
    }

    #onderheader #inlog #inloggen .logout::before {
        content: "\f08b";
        font-family: FontAwesome;
        font-size: 14px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        top: 10px;
        line-height: 2;
    }

    #onderheader #inlog #inloggen .changepass::before {
        content: "\f023";
        font-family: FontAwesome;
        font-size: 14px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        top: 10px;
        line-height: 2;
    }

    #onderheader .pipe {
        display: none;
    }

    #inlog > div {
        background-color: #ffffff;
        transition: all 0.2s ease 0.2s;
    }
    #inlog:hover > div {
        opacity: 1;
    }

     #header > div#header_wagen {
        display: inline-block;
        float: right;
        margin-right: 10px;
        width: 8%;
    }

    #header > div#header_wagen a::before {
        color: #626161;
        content:  "\f07a";
        font-family: FontAwesome;
        font-size: 18px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        top: 10px;
        line-height: 2;
    }

    #header > div#header_wagen a {
        font-size: 0;
    }

    #header #useroptions {
        float: right;
        height: 40px;
        line-height: 40px;
        width: 7% !important;
        margin-right: 30px;
    }

    #header > div#onderheader {
        display: inline-block;
        float: right;
        width: 50%;
    }

    /*-- Tooltip --*/

    .tip {
      z-index: 999999;
      background-color: white;
      border: 1px solid #dad8d8;
      padding: 15px;
      box-shadow: 10px 10px 9px -11px rgba(0, 0, 0, 0.59);
    }

    .tip h2 {
        font-size: 18px;
    }

    #toolimg_2833 {
        float: right;
        width: 40px;
        height: 40px;
        padding: 10px;
    }

    /*-- Inputs --*/

    /*-- Ipad style reset --*/

    input[type="submit"] {
        -webkit-appearance: none;
        border-radius: 0;
        color: white;
    }

    input[type="button"],
    input[type="text"] {
        -webkit-appearance: none;
        border-radius: 0;
    }

    input#kopieafleveradresknop {
        -webkit-appearance: none;
        border-radius: 0;
        color: white;
    }

    input[type="text"], input[type="password"], input[type="checkbox"], select, #saveas, #prijsinformatie_va input, textarea, .profiletab input, #bodydiv.p_email_ordervariant form .formveld input,
    .emaileditalinea form input, #bodydiv.p_email_step3 form input[name="testemail"], #bodydiv.p_data_simpleedit .textinput, #bodydiv.p_logistiek_besteldeorders > div#container table input,
    .metainfotable input, #bodydiv.p_organisatie_editdep form input, #bodydiv.p_organisatie_newdep form input,
    #bodydiv.p_logistiek_barcode #content form #barcode,
    .datapopupbody #bodydiv #content input {
        background-color: #ffffff;
        background-image: none;
        border: 1px solid #dddddd;
        border-radius: 0;
        color: #626161;
        font-size: 15px;
        line-height: 1.42857;
        padding: 6px 12px;
        transition: border-color 0.15s ease-in-out 0s;
        width: 100%;
        height: 40px;
    }

    input[type="text"]:focus, input[type="password"]:focus, select:focus, #saveas:focus,
    #prijsinformatie_va input:focus, #formpie input:focus, #bodydiv.p_logistiek_barcode #content form #barcode:focus,
    .datapopupbody #bodydiv #content input:focus {
        border-color: #ACD51B;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(164, 209, 3, 0.6);
        outline: 16px none;
        transition: 0.2s ease-in;
    }

    .tel1.tel {
        width: 20%;
    }

    .tel2.tel {
        width: 79%;
        margin-left: 1%;
    }

    textarea {
        height: auto;
        font-family: "Raleway",sans-serif;
    }

    input[type="checkbox"] {
        width: auto !important;
        height: auto !important;
    }

    .field-prefix+input[type="text"] {
        width: auto;
    }

    input[type="text"] + .field-postfix {
        width: 70%;
    }

    .field-prefix:empty+input[type="text"] {
        width: 100%;
    }

    #prijsinformatie_va input {
        width: 15%;
        margin-left: 15px;
    }

    #voorraadinfo_span {
        font-size: 1.2em;
        padding-left: 15px;
        padding-right: 15px;
        border: none;
    }

    /*-- Buttons --*/

    a[href="/main/show"] img {
        display: none;
    }

    a[href="/main/show"] i {
        display: none;
    }

    a[href="/main/show"]::before {
        content: "Terug";
    }

    button, .button, input[type="submit"],
    .default_button a,
    .excelexport a, .email_paragrafen a,
    .emaileditalinea form input[type="submit"],
    #onlinelink2, #onlinelink4,
    .middle_button2 a,
    #bodydiv.p_data_exportxml #content a,
    #bodydiv.p_logistiek_index #content ul li a,
    .uploadpdfpreflightresult a,
    #bodydiv.p_dgb_editcrmcampaign #content .bc a,
    #onlinelink1, #onlinelink3, #onlinelink2, #onlinelink4,
    #bodydiv.p_email_step4 form a, #bodydiv.p_logistiek_besteldeorders .fieldsetblock .middle_button2 input,
    #bodydiv.p_organisatie_index #newdep a,
    #bodydiv.p_organisatie_editdep #content form input[type="submit"],
    #inputtable tr td input[type="button"], #bodydiv.p_email_step4 #content form a,
    .departmentlist a,
    #data-zoekopties a,
    .fk_download a,
    #klanten table tr td a,
    .datapopupbody #bodydiv #content input[type="submit"]   {
        background-color: #c0c0c0;
        color: #ffffff;
        border: none;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        height: 40px;
        letter-spacing: 1px;
        line-height: 40px;
        margin: 5px;
        margin-left: 0;
        outline: medium none;
        padding: 0 15px;
        position: relative;
        text-decoration: none;
        transition: all 0.3s ease 0s;
        white-space: nowrap;
    }

    button:hover, .button:hover, input[type="submit"]:hover,
    .default_button a:hover,
    .excelexport a:hover, .email_paragrafen a:hover, #onlinelink2:hover, #onlinelink4:hover,
    #bodydiv.p_data_exportxml #content a:hover, #bodydiv.p_logistiek_index #content ul li a:hover,
    .uploadpdfpreflightresult a:hover, #onlinelink1:hover, #onlinelink3:hover, #onlinelink2:hover, #onlinelink4:hover,
    #bodydiv.p_email_step4 form a:hover,
    #bodydiv.p_email_step4 form a, #bodydiv.p_logistiek_besteldeorders .fieldsetblock .middle_button2 input:hover,
    #bodydiv.p_organisatie_index #newdep a:hover,
    #bodydiv.p_organisatie_editdep #content form input[type="submit"]:hover, #inputtable tr td input[type="button"]:hover,
    #addanotherfile:hover, .middle_button2 input:hover, .middle_button2 a:hover, #bodydiv.p_email_step4 #content form a:hover,
    .departmentlist a:hover,
    #data-zoekopties a:hover,
    .fk_download a:hover,
    #klanten table tr td a:hover,
    .datapopupbody #bodydiv #content input[type="submit"]:hover  {
        background-color: #ffffff;
        transition: 0.2s ease-in;
        color: #ffffff;
    }

    #bodydiv.p_marketing_accounts .middle_button2 a {
        color: #ffffff;
        text-decoration: none;
    }

    #shopform .middle_button2 a,
    #bodydiv.p_shop_saveoptions_ .middle_button2 a,
    .gegevensinvoeren .ptablink,
    .dbsearchdiv .ptablink,
    a[href^="?export=1&vdatum="],
    #tabstappen li a,
    #voorraaddetail_intro a,
    #bodydiv.p_marketing_editcrmaccountsource #content a[href="/marketing/crmaccountsources"],
    .p_dgb_editaccount #content a[href="/dgb/accounts"], #snippets_terug a,
    .p_upload_douploadpdf input.submit, a[href="/main/show"], a[href="/organisatie/index"], a[href="/image/beeldbank?mapid=145&page="],
    #bodydiv.p_freedesign_design #goback a,
    #bodydiv.p_marketing_editcrmindustry #content a[href="/marketing/crmindustries"],
    #bodydiv.p_marketing_editaccount #content a[href="/marketing/accounts"],
    #bodydiv.p_data_index #content a[href="/"],
    #backbutton a, #databack a,
    #container > div#content #image-edit-container a[href^="/image/beeldbank?mapid"]  {
        float: left;
        background-color: #ffd7da;
        color: #ffffff;
        border: none;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        height: 40px;
        letter-spacing: 1px;
        line-height: 40px;
        margin: 5px;
        margin-left: 0;
        outline: medium none;
        padding: 0 15px;
        position: relative;
        text-decoration: none;
        transition: all 0.3s ease 0s;
        white-space: nowrap;
    }

    #shopform .middle_button2 a:hover,
    #bodydiv.p_shop_saveoptions_ .middle_button2 a:hover,
    .gegevensinvoeren .ptablink:hover,
    .dbsearchdiv .ptablink :hover,
    a[href^="?export=1&vdatum="]:hover,
    #tabstappen li a:hover,
    #voorraaddetail_intro a:hover,
    #snippets_terug a:hover,
    .p_dgb_editaccount #content a[href="/dgb/accounts"]:hover,
    #uuploadform input.submit:hover, a[href="/main/show"]:hover, a[href="/organisatie/index"]:hover,
    a[href="/image/beeldbank?mapid=145&page="]:hover,
    #bodydiv.p_marketing_editcrmindustry #content a[href="/marketing/crmindustries"]:hover,
    #bodydiv.p_marketing_editaccount #content a[href="/marketing/accounts"]:hover,
    #bodydiv.p_freedesign_design #goback a:hover,
    #bodydiv.p_data_index #content a[href="/"]:hover,
    #backbutton a:hover, #databack a:hover,
    #container > div#content #image-edit-container a[href^="/image/beeldbank?mapid"]:hover {
        background-color: #e0ae45;
        transition: 0.2s ease-in;
        color: #ffffff;
    }

   input[disabled=""] {
        opacity: 0.5;
    }

    a[href="/organisatie/index"] {
        width: auto !important;
        color: white !important;
    }

    a[href="/image/beeldbank?mapid=145&page="] {
        margin-bottom: 15px;
    }

    a[href="/organisatie/index"] img,
    a[href="/image/beeldbank?mapid=145&page="] img,
    #bodydiv.p_marketing_editcrmindustry #content a[href="/marketing/crmindustries"] img,
    #bodydiv.p_config_pvlist #content #backbutton a i {
        display: none;
    }

    a[href="/organisatie/index"]:before,
    a[href="/image/beeldbank?mapid=145&page="]:before,
    #bodydiv.p_marketing_editcrmindustry #content a[href="/marketing/crmindustries"]:before,
    #bodydiv.p_config_pvlist #content #backbutton a:before {
        content: "Terug";
    }

    #content .ptablink {
        margin: 1px;
        padding: 0 10px;
        min-width: 15% !important;
        text-align: center;
    }

    .xmbuttons div.default_button {
        float: left;
    }
    .left_button, .right_button {
        display: none;
    }
    .totaal_button {
        float: left;
        max-width: unset;
        width: unset;
    }

    .editprofilefeedback {
        padding: 15px;
        padding-left: 0;
    }

    #tree ul#treeleft > li > a:not(:only-child)::after {
        content: "" !important;
    }

    .action-item, .variant, .variantlittle {
        background: #ffffff none repeat scroll 0 0;
        border: 1px solid #dad8d8;
        box-sizing: inherit;
        display: block;
        float: left;
        margin: 1%;
        overflow: hidden;
        position: relative;
        width: 31%;
        min-height: 300px;
        max-height: 300px;
        text-align: center;
    }

     .variant img {
        position: absolute;
        display: block;
        margin: 5px auto;
        height: auto;
        max-height: 200px;
        width: auto !important;
        max-width: 200px;
        bottom: 15%;
        left: 0;
        right: 0;
        bottom: 10%;
        border: 1px solid #dad8d8;
    }

    .variant span {
        display: block;
        text-align: center;
        width: 100%;
    }

    #zoekresultaten {
        margin-top: 25px;
    }

    .thumb_text {
        background-color: #ffffff;
        color: #626161;
        display: block;
        line-height: 50px;
        padding: 5px !important;
        pointer-events: none;
        position: absolute;
        height: 15%;
        width: 100%;
        top: 0;
        text-align: center;
    }

    #container > div#content {
        background-color: #f0f0f0;
        white-space: nowrap;
        min-height: 500px;
        padding-bottom: 100px;
        float: left !important;
        width: 100% !important;
    }

    #container #content form {
        background-color: #ffffff;
        padding: 15px;
        padding-bottom: 60px;
        border: 1px solid #dad8d8;
        margin-bottom: 15px;
        clear: both;
    }

    /*-- Email nieuwsbrief -- XM2017 */

    #bodydiv.p_email_ordervariant .datum select {
        margin-top: 15px;
        width: 32%;
        margin: 1%;
        float: right;
    }

    #bodydiv.p_email_ordervariant .datum #email_datum_1i {
        margin-right: 0;
    }

    #bodydiv.p_email_ordervariant .datum #email_datum_3i {
        margin-left: 0;
    }

    #bodydiv.p_email_ordervariant .formtitel {
        height: 30px;
        margin-top: 15px;
    }

    #bodydiv.p_email_ordervariant form .formveld input[type="checkbox"], .campagnepart input[type="checkbox"] {
        width: auto;
        height: auto;
    }

    #bodydiv.p_email_step2 #container .email_paragrafen,
    #bodydiv.p_email_step2 .email_bestaandepara {
        margin-top: 15px !important;
    }

    #bodydiv.p_email_step2 .email_paragrafen p:first-child {
        color: black;
    }

    #bodydiv.p_email_step2 .email_paragrafen br,
    #bodydiv.p_email_step2a br {
        display: none;
    }

    #bodydiv.p_email_step2 .email_paragrafen a {
        float: left;
    }
    #bodydiv.p_email_step2a a{
        float: left;
    }

    #bodydiv.p_email_step3 #container p {
        margin-top: 15px !important;
        margin-bottom: 10px !important;
    }

    #bodydiv.p_email_step3 .email_paragrafen br {
        display: none;
    }

    #bodydiv.p_email_step3 .email_paragrafen a {
        float: left;
    }

    #bodydiv.p_email_step4 #container > div#content form {
        margin-top: 15px;
        background-color: #ffffff;
        padding: 15px;
        border: 1px solid #dad8d8;
        margin-bottom: 15px;
    }

    #bodydiv.p_email_step4 form p {
        margin-bottom: 15px;
    }

    #bodydiv.p_email_step4 form #maillist {
        margin-top: 15px;
    }

    #bodydiv.p_email_step4 form #maillist li {
        padding: 15px;
        border: 1px solid #dad8d8;
        margin-bottom: 5px;
    }

    #bodydiv.p_email_step5 #container > div#content p {
        margin-top: 15px;
    }

    #refreshspan {
        width: 100%;
        display: block;
        margin-top: 15px;
        margin-bottom: 15px;
    }

    #refreshspan input[type="checkbox"],
    #bodydiv.p_email_step3 form input[type="checkbox"] {
        height: auto;
    }

    #bodydiv.p_email_step3 form input[type="checkbox"] {
        margin-top: 15px;
    }

    .emaileditalinea {
        border: 1px solid #dad8d8;
        padding: 0 15px;
        background-color: white;
        margin: 0 auto;
        margin-top: 25px !important;
    }

    .emaileditalinea form {
        margin-top: 0px !important;
    }

    .emaileditalinea form input {
        margin-top: 5px;
    }

    .emaileditalinea form .formtitel {
        margin-top: 15px;
    }

    .emaileditalinea form input[type="submit"],
    #onlinelink2, #onlinelink4 {
        width: auto;
    }

    .emaileditalinea form  #imgpreviewalinea715 {
        width: 50%;
        min-height: 250px;
        margin-top: 25px;
    }

    .emaileditalinea form  #spinner, #loaderimg {
        display: none !important;
    }

    .emaileditalinea form  #imgpreviewalinea715 img {
        width: 50%;
    }

    .personalisatieveldenemail #velden {
        width: 100%;
        margin-top: 25px;
    }

    /*-- Voorraad --*/
    #bodydiv.p_main_voorraad #content form {
        background-color: transparent;
        border: none;
        padding: 0;
    }

    #bodydiv.p_main_voorraad #content form  input[type="text"] {
        width: 70%;
    }

    #bodydiv.p_main_voorraad #content form .dp-choose-date {
        width: 15%;
    }

    #bodydiv.p_main_voorraad #content form br {
        display: none;
    }

    #bodydiv.p_main_voorraad #content form .default_submit {
        width: 15%;
        float: right;
    }

    #bodydiv.p_main_voorraad #content form .default_submit input {
        width: 100%;
    }

    #voorraaddetail_intro {
        height: 50px;
        line-height: 50px;
        text-align: left;
    }

    #voorraaddetail_intro a[href^="/main/voorraaddetail"] {
        background-color: transparent;
        height: auto;
        display: inline;
        color: #ffd7da;
        font-weight: bold;
        float: none;
        margin: 0;
        padding: 0;
    }

    /*-- Mailinglijst --*/

    #bodydiv.p_dgb_crmcampaigns #container > div#content fieldset {
        margin-top: 15px;
    }

    #klantkaart input {
        margin-bottom: 15px;
    }

    /*-- Doelgroep beheer --*/
    #bodydiv.p_marketing_import .default_submit .middle_button2 input {
        margin-top: 0 !important;
    }

    #bodydiv.p_marketing_import input[type="file"] {
        padding: 7px;
    }

    #bodydiv.p_marketing_crmaccountsources  table {
        margin-top: 25px !important;
    }

    #bodydiv.p_marketing_crmaccountsources .totaal_button,
    #bodydiv.p_config_list .totaal_button {
        float: none !important;
    }

    #bodydiv.p_marketing_crmaccountstatus .totaal_button {
        float: none !important;
    }

    #bodydiv.p_marketing_editcrmaccountsource #content a[href="/marketing/crmaccountsources"] img {
        display: none;
    }

    #bodydiv.p_marketing_editcrmaccountsource #content a[href="/marketing/crmaccountsources"]::before {
        content: 'Terug';
        font-size: 16px;
    }

    #bodydiv.p_marketing_editcrmaccountsource #content a[href="/marketing/crmaccountsources"] {
        width: auto !important;
        color: #ffffff !important;
    }
    #bodydiv.p_marketing_editcrmaccountsource #content #doelgroep_terug {
        width: 100%;
        display: block;
        height: 50px;
        margin-top: 25px;
    }

    #bodydiv.p_marketing_editcrmaccountsource #content .formtitel {
        width: 100%;
        height: 30px;
        margin-bottom: 15px;
        display: block;
    }

    #bodydiv.p_marketing_editcrmindustry #container #content form {
        padding-bottom: 60px;
    }

    #bodydiv.p_marketing_editcrmaccountsource #content form .totaal_button {
        float: none;
    }

    #bodydiv.p_marketing_crmindustries #container #content table {
        margin-top: 25px;
    }

    #bodydiv.p_marketing_crmindustries .totaal_button {
        margin: 0;
        float: left !important;
    }

    #bodydiv.p_dgb_import #container #content fieldset {
        margin-top: 25px;
    }

    #bodydiv.p_dgb_import form input[type="file"] {
        width: 100%;
    }

    #bodydiv.p_dgb_import .default_submit {
        width: 100%;
        float: left;
    }

    #klanten table tr td {
        font-size: 12px;
    }

    /*-- campagne beheer --*/

    #bodydiv.p_dgb_editcrmcampaign #content .bc {
        margin-top: 15px;
    }

    #bodydiv.p_marketing_crmindustries #tree p,
    #bodydiv.p_marketing_crmaccountsources  #tree p,
    #bodydiv.p_marketing_crmproperties #tree p,
    #bodydiv.p_marketing_crmaccountstatus #tree p,
    #bodydiv.p_marketing_crmcampaigns #tree p,
    #bodydiv.p_marketing_accounts #tree p,
    #bodydiv.p_marketing_contacts #tree p,
    #bodydiv.p_marketing_editaccountcontact #tree p {
        padding-left: 15px;
    }

    #bodydiv.p_marketing_crmindustries #tree table,
    #bodydiv.p_marketing_crmaccountsources  #tree table,
    #bodydiv.p_marketing_crmproperties #tree table,
    #bodydiv.p_marketing_crmaccountstatus #tree table,
    #bodydiv.p_marketing_crmcampaigns #tree table,
    #bodydiv.p_marketing_accounts #tree table,
    #bodydiv.p_marketing_contacts #tree table,
    #bodydiv.p_marketing_editaccountcontact #tree table {
        width: 90% !important;
        margin: 5%;
    }

    #bodydiv.p_marketing_contacts #content #zoeken table {
        background-color: #ffffff;
    }

    #bodydiv.p_marketing_editaccount #content form .totaal_button {
        float: left;
    }

    /*-- Logistiek -- */

    #bodydiv.p_logistiek_index #content ul li  {
        float: left;
    }

    #bodydiv.p_logistiek_besteldeorders > div#container {
        width: 100%;
        margin-left: 0 !important;
    }

    #bodydiv.p_logistiek_besteldeorders > div#container table input {
        width: 70%;
    }

    #bodydiv.p_logistiek_besteldeorders #content table {
        margin-bottom: 34px;
    }

    #logistiek_exporteer {
        margin-right: 10px;
        margin-top: 15px;
    }

    #bodydiv.p_email_step4 form a, #bodydiv.p_logistiek_besteldeorders .fieldsetblock table td {
        vertical-align: baseline;
    }

    #bodydiv.p_email_step4 form a, #bodydiv.p_logistiek_besteldeorders div#container .fieldsetblock table td input.dp-applied {
        width: 65%;
    }

    #bodydiv.p_email_step4 #content form a {
        width: auto;
    }
    #bodydiv.p_logistiek_barcode #content form {
        padding: 15px;
        background-color: white;
        border: 1px solid #dad8d8;
    }

    #bodydiv.p_logistiek_barcode #content form p {
        margin-bottom: 15px;
    }

    #bodydiv.p_logistiek_barcode #content form #barcode {
        width: 80%;
    }

    #bodydiv.p_logistiek_barcode #content form select {
        width: 15%;
    }

    /*-- Beeldbank --*/

    #image-edit-container #newversion #width_,
    #image-edit-container #newversion #height_ {
        width: 10%;
        margin: 5px;
    }

    .image_beeldbankimage .selectedImg {
        background-color: #8FB507;
    }

/*
    .imgCrop_wrap {
        width: 100% !important;
        height: auto !important;
    }
*/
    #imageknoppen {
        width: 100%;
        clear: both;
    }

    #imageknoppen a::before {
        border: 1px solid #dad8d8;
        padding-right: 0;
        padding: 10px;
    }

    #bodydiv.p_image_editimg textarea {
        width: 100% !important;
    }

    #formpie span {
        float: left;
        margin: 1% 1% 1% 0 !important;
        width: 49% !important;
    }

    #formpie #span_vrijzoeken {
        width: 88% !important;
    }

    #gbox_grid {
        width: 95% !important;
    }

    #gbox_grid .ui-jqgrid-btable tr td {
        padding: 15px;
    }

     #gbox_grid .ui-jqgrid-btable tr td .fa-pencil-square-o {
        cursor: pointer;
     }

    #gbox_grid .ui-jqgrid-btable tr td .fa-pencil-square-o:hover,
    #gbox_grid .ui-jqgrid-btable tr td a:hover {
        color: #ffd7da;
     }

    #submappen li {
        margin-bottom: 15px;
    }

    #submappen li a {
        text-decoration: none;
    }

    #submappen li a::before {
        content: "\f07b";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    .images div:empty {
        display: none;
    }

    #beeldbankmodus {
        clear: both;
        margin-top: 15px;
    }

    .images {
        border: 1px solid #dad8d8;
    }

    a[href$="&mapid"] {
        border: 2px solid red;
    }

    /* Automatische snippets --*/

    #bodydiv.p_data_list fieldset {
        margin-top: 25px !important;
    }

    /*-- Winkelwagen Cross selling --*/
    .crosssellov #omtable {
        background-color: white;
        border: 1px solid #dad8d8;
        border-collapse: collapse;
        border-spacing: 0;
        clear: both;
        max-width: 100%;
        width: 100%;
        float: left;
    }

    .crosssellov .fieldsetblock {
        border: none;
    }

    .crosssellov #omtable .variant span,
    .crosssellov .fieldsetblock .variant span {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        text-align: center;
        background-color: #ffffff;
        color: #626161;
        display: block;
        height: 20%;
        pointer-events: none;
    }

    .crosssellov .variant img {
        top: 10%;
        height: auto;
    }

    .p_config_list #content .totaal_button {
        width: 100% !important;
    }

     /*-- Artikelbeheer --*/

    fieldset {
        border: 1px solid #dad8d8;
        margin-bottom: 16px;
        padding: 15px;
        background-color: #ffffff;
        clear: both;
    }
    fieldset legend {
        font-weight: 700;
        padding: 0;
        display: none;
    }

    #bodydiv.p_search_index legend,
    #bodydiv.p_marketing_import2 legend,
    #bodydiv.p_upload_uploadpdf legend {
        display: inline !important;
        margin-top: 50px !important;
    }

    table td a[href^="/documents/"] img[src*="visible.jpg"] {
        display: inline-block;
        filter: grayscale(100%);
        max-width: unset;
        opacity: 0.75;
    }

    .scrolltable {
        overflow: scroll;
    }

    .scrolltable table {
        background-color: white;
    }

    .scrolltable table tr {
        background-color: white;
    }

    .scrolltable table .even, .orderroweven {
        background-color: #dad8d8;
    }

    #fancybox-overlay, #fancybox-wrap {
        z-index: 999999;
        padding: 0 !important;
    }

    #content > br:empty,
    #content > p:empty {
        display: none;
    }

    #bodydiv > div#container {
        padding: 240px 0 0;
    }

    #container > div#content #introcontainer {
        padding: 30px;
        color: #ffffff;
        top: 300px;
        background-color: #c0c0c0;
        width: 100%;
        max-width: 100%;
        margin: 0;
    }

    #container > div#content #introcontainer h2 a {
        color: #ffffff;
    }

    #homeintro h1, p {
        max-width: 1000px;
        margin: 0 auto;
    }

    #container #content #introductietekst  {
        margin-top: 15px !important;
    }

    #container #content #introductietekst p {
        color: white;
    }

    #container #content #introductietekst h1  {
        margin-bottom: 15px !important;
    }

    #container #content #introductietekst form[action^="/winkel/mailer"] {
        padding: 15px;
        background-color: #ffffff;
        border: 1px solid #dad8d8;
        color: #626161;
    }

    #saveas {
        width: 70% !important;
        float: left;
    }

    #container #content #introcontainer h1 {
        max-width: 1000px;
        margin: 0 auto;
        color: #ffffff;
        font-size: 32px;
    }
    #container #content #introductietekst,
    #container #content #kruimel,
    #container #content #introcontainer h2,
    #container #content #introcontainer h3 {
        max-width: 1000px;
        margin: 0 auto;
        color: #ffffff;
    }

    #container #content #introductietekst li {
        height: auto;
    }

    #container #content #tpaginatie {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    #content #tpaginatie, #content #tuitklappen {
        float: unset;
    }

    .orderlistt {
        font-size: 0px;
        text-decoration: none;
    }

    .orderlistt::before {
        color: #000000;
        content:  "\f055";
        font-family: FontAwesome;
        font-size: 14px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        top: 10px;
    }

    .pagination > a, .pagination > span {
        background-color: #ffffff;
        color: #626161;
        border: 1px solid #dad8d8;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        height: 40px;
        letter-spacing: 1px;
        line-height: 40px;
        outline: medium none;
        padding: 0 15px;
        position: relative;
        text-decoration: none;
        transition: all 0.3s ease 0s;
        white-space: nowrap;
    }

    .pagination > .current {
        color: #ffffff;
        background-color: #c0c0c0;
    }

    .pagination > span {
        cursor: default;
    }

    #tuitklappen a {
        background-color: rgba(164, 209, 3, 0.9);
        border: medium none;
        color: #ffffff;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        height: 40px;
        letter-spacing: 1px;
        line-height: 40px;
        margin: 5px;
        margin-left: 0;
        outline: medium none;
        padding: 0 15px;
        position: relative;
        text-decoration: none;
        transition: all 0.3s ease 0s;
        white-space: nowrap;
    }

    #bodydiv.p_config_pvlist #content table {
        background-color: #ffffff;
    }

    /*-- Tree --^*/

    #tree ul#treeleft,
    #dgbtree1 {
        list-style: outside none none;
        margin: 0;
        padding: 0;
    }

    #tree ul#treeleft > li,
    #dgbtree1 li {
        line-height: 24px;
        position: relative;
    }

    #tree ul > li > a,
    #tree ul#treeleft > li > a,
    #dgbtree1 li  a {
        color: #000000;
        padding: 8px 8px 8px 0;
        transition: all 0.3s ease 0s;
        width: 100%;
    }

    #tree ul > li > a,
    #tree ul#treeleft > li a,
    #dgbtree1 li a {
        box-sizing: border-box;
        color: #626161;
        display: block;
        font-size: 14px;
        font-weight: 400;
        line-height: 22px;
        overflow: hidden;
        text-decoration: none;
        font-size: 16px;
    }

    #tree ul > li > ul > li,
    #tree ul#treeleft > li > ul > li {
        padding-left: 10px;
    }

    #tree ul#treeleft > li > ul > li a {
        box-sizing: border-box;
        color: #626161;
        display: block;
        font-size: 14px;
        line-height: 22px;
        padding: 8px 8px 8px 0;
        position: relative;
        text-decoration: none;
        width: 250px;
    }

    ul#treeleft li ul {
        list-style: outside none none;
        margin: 0;
        padding: 0;
    }

    ul#treeleft > li > ul > li {
        position: relative;
    }
    ul#treeleft > li > ul > li > ul {
        display: none;
    }

    ul#treeleft li:hover > ul::before {
        background: rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
        bottom: 0;
        content: "";
        width: 260px;
        top: 0;
    }
    ul#treeleft > li > ul::after {
        bottom: 0;
        content: "";
        display: block;
        opacity: 0;
        pointer-events: none;
        top: 0;
        transition: opacity 0.5s ease 0s;
        width: 100%;
        z-index: -1;
    }
    ul#treeleft > li > ul::before, ul#treeleft > li > ul {
        transition: width 0.2s ease 0s;
        width: 0;
    }

    ul#treeleft > li > ul::before, ul#treeleft > li:last-child > ul {
        margin-top: -112px;
    }

    ul#treeleft > li:hover ul, ul#treeleft:hover > ul::before {
        width: 250px;
    }

    ul#treeleft > li:hover > ul::after {
        opacity: 1;
    }

    #bodydiv.p_main_actionitems #container > div#header {
        top: 470px;
    }

    #header #useroptions {
        width: 6%;
    }

    #header #useroptions button {
        background-color: transparent;
        color: #626161;
        border: none;
        margin: 0;
        font-size: 18px;
    }

    #header #useroptions button::after {
        content: "\f0d7";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding: 2px;
        top: 10px;
        left: 0;
    }

    #header #search_site {
        width: 25%;
        float: left;
        position: relative;
    }

    #header #search_site form {
        margin-top: 0 !important;
    }

    #header #search_site .fa {
        position: absolute;
        left: 15px;
        width: 40px;
        line-height: 40px;
    }

    #header #search_site #submit_zoek {
        display: inline;
        float: left;
        background-color: transparent;
        margin: 0;
        position: absolute;
        left: 0;
        width: 40px;
        height: 40px;
        z-index: 30;
        border: none;
    }

    #header #search_site #artikelsearch {
        width: 100%;
        margin-left: 40px;
        float: left;
        border: none;
        line-height: 30px;
        background-color: transparent;
    }

    #header #search_site #artikelsearch:focus {
        border: none;
        box-shadow: none;
    }

    #onderheader #menu, #onderheader #navigatie {
        height: 39px;
    }

    #onderheader #menu ul, li {
        height: auto;
        line-height: 25px;
    }

    #kruimel {
        display: block;
        margin-top: 20px;
        padding-top: 15px;
        padding-bottom: 15px;
        color: #e0e0e0;
    }

    #kruimel a,
    #orderkruimel a {
        color: #e0e0e0;
        font-size: 14px;
        text-decoration: none;
    }

    #kruimel a:hover {
        color: #ffd7da;
        transition: 0.3s ease-in;
    }

    #orderkruimel {
        max-width: 1000px;
        margin: 0 auto;
    }

    #bodydiv #container > div#content .actionitem_container {
        background-color: #ffffff;
        border: 1px solid #dad8d8;
        margin-top: 25px;
    }

    #container > div#content > *:not(.actionitem_tile) {
        margin: 1%;
        width: 98%;
        color: #626161;
    }

    #bodydiv.p_marketing_editaccount #content .totaal_button {
        margin: 0 auto;
        max-width: 98%;
        width: 98%;
        float: none;
    }

    #container > div#content form,
    #bodydiv.p_search_index form,
    #bodydiv.p_email_step3 form {
        margin-top: 25px !important;
    }

    #container .actionitem_tile {
        max-width: 1000px;
    }

    #container .actionitem_tile::after {
        display: block;
        content: '';
        clear: both;
    }

    #container > div#content > .clear {
        display: none;
    }

    #container > div#content > .actionitem_tile, #container > div#content > .slider-wrapper {
        margin: 0 auto;
        width: 100%;
    }

    #container > div#content > .slider-wrapper.theme-default {
        display: inline-block;
        height: auto;
        overflow: hidden;
        position: absolute;
        top: 0;
        width: 100%;
        max-width: 100%;
        z-index: -1;
    }

    #variantwrapper {
        clear: both;
        display: table;
    }

    .actionitem_tile_catname h2 {
        padding-top: 15px;
        padding-bottom: 15px;
        margin: 15px;
    }

    div#content > .variant.noimgvariant {
        background-color: #c0c0c0;
        border-top: 238px solid #2c2e2d;
        color: #ffffff;
        line-height: 64px;
        padding: 0 10px;
        text-align: left;
        text-decoration: none;
    }
    div#content > .variant > img {
        height: auto;
        max-width: 100%;
        width: auto;
    }

    .action-item > a {
        background-color: #ffffff;
        display: block;
        height: 300px;
        overflow: hidden;
        position: relative;
        width: 100%;
    }
    .action-item a img {
        bottom: 0;
        height: auto;
        left: 0;
        margin: 0 auto;
        transition: all 0.5s ease 0s;
        width: auto;
        z-index: 99999;
    }
    .actionitem_desc
     {
        background-color: #ffffff;
        bottom: 0;
        color: #2c2e2d;
        display: block;
        padding: 20px 10px;
        pointer-events: none;
        position: absolute;
        width: 100%;
        font-size: 12px;
    }
    .actionitem_desc > .actionitem_title {
        display: block;
        font-weight: 700;
        font-size: 16px;
    }

    #formulier > #bestellen_afbeelding {
        display: block;
        float: right;
        padding: 15px;
        width: 50%;
    }

/*-- Deze important is nodig om de inline-style te overrulen --*/

    #formulier > #bestellen_afbeelding table {
        max-width: 100% !important;
        width: unset !important;
        margin: 0 auto;
        border: none;
    }

    #formulier > #bestellen_afbeelding table tr {
        border: none;
    }

    #formulier > #bestellen_afbeelding img {
        height: auto;
        max-height: 100%;
        max-width: 90%;
        vertical-align: middle;
        width: auto;
        border: 1px solid #dad8d8;
    }

    #formulier #bestellen_afbeelding .paginanummers2 a {
        text-decoration: none;
    }

    #formulier #bestellen_afbeelding .paginanummers2 td:nth-child(1) a {
        float: right;
    }

    #formulier #bestellen_afbeelding .paginanummers2 td:nth-child(1) a::before {
        color: #626161;
        content: "\f190";
        display: block;
        font-family: "FontAwesome";
        height: 18px;
        width: 18px;
        font-size: 18px;
    }

    #formulier #bestellen_afbeelding .paginanummers2 td:nth-child(3) {
        text-align: left !important;
    }

    #formulier #bestellen_afbeelding .paginanummers2 td:nth-child(3) a {
        display: block;
        width: 18px;
        height: 18px;
    }

    #formulier #bestellen_afbeelding .paginanummers2 td:nth-child(3) a::before {
        content: "\f190";
        -webkit-transform:  rotate(180deg);
        transform: rotate(180deg);
        font-family: "FontAwesome";
        display: block;
        height: 18px;
        width: 18px;
        font-size: 18px;
    }

    #formulier #bestellen_afbeelding .paginanummers2 a img {
        display: none;
    }

    #formulier > #bestellen_invoeren {
        border-right: 1px solid #dad8d8;
        display: inline-block;
        width: 50%;
        padding: 0;
        padding-left: 15px;
        padding-right: 15px;
    }

    #formulier > #bestellen_invoeren .inttel1,
    #formulier > #bestellen_invoeren .inttel2 {
        width: 15%;
    }

    #formulier > #bestellen_invoeren .inttel3 {
        width: 66%;
        float: right;
    }

    #prijsinformatie_va {
        border-top: 1px solid #dad8d8;
        clear: both;
    }

    #prijsinformatie_va,
    #prijsinformatie {
        padding: 15px;
    }

    #prijsinformatie table tr:hover {
        box-shadow: none;
    }

    div#bestellen_knoppen div {
        display: inline;
    }
    #bestellen_afbeelding tr:hover {
        box-shadow: none;
    }
    .LV_invalid,
    .fieldseterror,
    #container > div#content #page_requirements {
        background-color: #ce431d;
        border-radius: 0;
        color: #ffffff;
        display: block;
        padding: 8px;
        width: 100%;
    }

    .feedback {
        background-color: rgba(164, 209, 3, 0.9);
        border-radius: 0;
        color: #ffffff;
        display: block;
        padding: 8px;
        width: 100%;
        margin-top: 15px;
        margin-bottom: 15px;
    }

    #container > div#content .fieldseterror {
        color: #ffffff;
        clear: both;
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .LV_invalid_field {
        border-color: #ce431d;
    }


    td.dragHandle::before {
        color: #626161;
        content: "\f07d";
        cursor: move;
        display: block;
        font-family: "FontAwesome";
        height: 18px;
        width: 18px;
    }

    #dragtable td a {
        text-decoration: none;
    }

/*
    td.dtc6 a::before {
        color: #626161;
        content: "\f044";
        display: block;
        font-family: "FontAwesome";
        height: 18px;
        width: 18px;
    }
*/
    .theDragHandle {
        display: none;
    }
    .tDnD_whileDrag {
        background-color: #ffd7da;
        box-shadow: 0 1px 8px -5px #000000;
        color: #ffffff;
    }
    .dtc2 {
        cursor: text;
    }
    .documentstable img {
        box-shadow: 0 0 10px -5px rgba(153, 153, 153, 1);
    }
    table td a[href^="/documents/"] img, table td a[href^="/main/ordervariant/"] img {
        display: none;
        opacity: 0;
    }
    .scrollable {
        margin-top: 15px;
        margin-bottom: 15px;
    }
    .scrollable .items {
        background-color: #f0f0f0;
        display: block;
        white-space: nowrap;
        height: auto;
        float: left;
        border:1px solid #dad8d8;
    }
    .items > div {
        white-space: nowrap;
    }
    .items div a {
        background-color: #ffffff;
        border: 1px solid #dad8d8;
        color: #000000;
        display: block;
        float: left;
        font-weight: 400;
        line-height: 40px;
        margin: 1%;
        overflow: hidden;
        padding: 1%;
        position: relative;
        text-align: center;
        text-decoration: none;
        vertical-align: bottom;
        width: 23%;
    }
    .items div a img {
        margin: auto;
        width: 92%;
        z-index: 1;
        border: 1px solid #dddddd;
    }
    .items div a:hover img {
        opacity: 1;
    }
    .items div a.selected {
        -webkit-box-shadow: 10px 10px 9px -11px rgba(0,0,0,0.59);
         -moz-box-shadow: 10px 10px 9px -11px rgba(0,0,0,0.59);
        box-shadow: 10px 10px 9px -11px rgba(0,0,0,0.59);
        background-color: #e0e0e0;
    }
    #page_name, #copy_from, #page_template {
        width: 100%;
        color: #626161;
        height: 40px;
        margin-bottom: 15px;
    }
    #page_name > span, #copy_from > span {
        clear: both;
        display: block !important;
        float: left;
        width: 40% !important;
        height: 40px;
    }
    #page_name > input, #copy_from > select {
        float: right !important;
        width: 50% !important;
    }
    #copy_from > span#paginascontainer {
        display: block;
        width: 100% !important;
        height: 40px;
        margin-top: 15px;
        margin-bottom: 15px;
    }

    #copy_from > span#paginascontainer span {
        height: 40px;
        line-height: 40px;
    }

    #page_template {
        display: none !important;
    }

    #paginascontainer > select {
        float: right;
        width: 50% !important;
    }
    #winkelwagen .wwimg {
        text-align: center;
        width: 7%;
    }
    #winkelwagen .art {
        width: 47%;
    }
    #winkelwagen .aantal {
        width: 10%;
    }
    #winkelwagen .headernumeriek {
        width: 10%;
    }
    #winkelwagen .headernumeriek + th:not(.headernumeriek) {
        width: 5%;
    }
    #winkelwagen tr td {
        vertical-align: middle;
        min-width: 20%;
    }

    #winkelwagen tr td a {
        text-decoration: none;
    }

    #winkelwagen tr .ww_totaalbedrag {
        font-size: 2em;
    }

    #winkelwagen .info:hover {
        box-shadow: none;
    }
    tr.info td[colspan="7"] {
        border: none
    }
    #meerartikelenbestellenknop {
        float: left;
    }
    form#myform table td:first-child {
        vertical-align: middle;
    }
    form#myform tr[id*="postcode"] td, form#myform #factbedrijfrow td {
        white-space: nowrap;
    }
    form#myform input[id*="postcode"] {
        display: inline-block;
        width: 33%;
    }
    form#myform input[id*="plaats"] {
        display: inline-block;
        width: 66%;
    }
    form#myform input[id="order_factbedrijf"] {
        display: inline-block;
        width: 66%;
    }
    #factbedrijfrow input#kopieafleveradresknop {
        width: 33%;
    }
    form#myform input#extraafladres {

    }
    div.betaalwijzediv tr td:nth-child(2) {
        width: 20px;
    }
    input#savefactadres {
        border-color: #cccccc;
        color: #cccccc;
        width: unset;
    }

    div.ui-jqgrid, div.ui-jqgrid > #gview_grid, div.ui-jqgrid > #gview_grid > *, .ui-jqgrid-pager {
        width: unset !important;
    }

    div.ui-jqgrid-bdiv {
        height: unset;
        max-height: 900px;
    }
    .ui-icon-seek-first::after {
        content: "\f002";
        font: 10px/22px "FontAwesome";
        opacity: 1;
        position: absolute;
        right: 16px;
        top: 10px;
    }

    /*-- Edit scherm --*/

        /* -- Opgeslagen gegevens --*/

    #opg_geg_ophalen {
        margin-bottom: 15px;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    #opg_geg_ophalen #savedvariant {
        width: 60%;
        float: left;
    }

    #opg_geg_ophalen input {
        margin-top: 0;
    }

    #keepsaved {
        width: auto;
        height: auto;
        margin: 15px;
    }

    /*-- Beschrijving --*/

    #beschrijving {
        padding: 15px;
    }

    #beschrijving p {
        color: #626161;
    }

    #beschrijving ul {
        padding-left: 15px;
    }

    #beschrijving li {
        margin: 10px;
        list-style: circle !important;
    }

    /*-- Opslaan --*/

    #opslaan {
        width: 100%;
        float: left;
    }

    #opslaan p {
        color: #626161;
    }

    #bestellen_knoppen {
        padding: 15px;
        width: 100%;
    }

    #pubOpslaanAls .middle_button,
    #pubOpslaanAls .middle_button input {
        float: left;
        margin: 0;
        line-height: 35px;
    }

    /*-- Printshop --*/

    #stappen {
        margin-top: 50px !important;
        height: 50px;
    }

    #stappen li {
        width: 25%;
        float: left;
        color: #626161;
    }

    #stappen .selected,
    #stappen .selected a {
        color: #ADD51C;
        font-weight: bold;
        text-decoration: none;
    }

    #div1 {
        margin-top: 15px;
        padding-top: 15px;
        border-top: 1px solid #dad8d8;
    }

    #div1 label {
        margin-bottom: 15px;
        margin-top: 15px;
        clear: both;
    }

    #thisform {
        padding: 15px;
        background-color: #ffffff;
        border: 1px solid #dad8d8;
    }

    #thisform p {
        color: #626161;
        width: 100%;
        margin-top: 15px;
        margin-bottom: 15px;
        display: block;
    }

    #thisform input[type='radio'] {
        width: auto;
    }

    #samenvoegen2 input[type="file"],
    #publicationimage_image {
        width: 55%;
        padding: 5px;
        float: right;
        border: 1px solid #dad8d8;
        margin-bottom: 15px;
    }

    #publicationimage_image {
        float: left;
    }

    input[type="file"] {
        width: 55%;
        padding: 5px;
        float: left;
        border: 1px solid #dad8d8;
        margin-bottom: 15px;
    }

    #upload #progress {
        background-color: #ffffff;
        border: 1px solid #dad8d8;
    }

    #upload #progressbar {
        background: #ADD100; /* fallback for old browsers */
        background: -webkit-linear-gradient(to left, #ADD100 , #7B920A); /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(to left, #ADD100 , #7B920A); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    }

    .clearupload, #newimage_image {
        border: 1px solid #dad8d8 !important;
        display: block;
        float: left;
        height: 37px;
        line-height: 37px;
        padding-left: 10px;
        padding-right: 5px;
        text-align: center;
        text-decoration: none;
        width: 100%;
    }

    .clearupload::before {
        content:  "\f05c";
        font-family: FontAwesome;
        font-size: 18px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        opacity: 1;
        top: 10px;
        margin-bottom: 15px;
    }

    #addanotherfile {
        float: left;
        background-color: #ADD51C;
        color: #ffffff;
        border: none;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        height: 40px;
        letter-spacing: 1px;
        line-height: 40px;
        margin: 5px;
        margin-left: 0;
        outline: medium none;
        padding: 0 15px;
        position: relative;
        text-decoration: none;
        transition: all 0.3s ease 0s;
        white-space: nowrap;
        clear: both;
        margin-bottom: 30px;
    }

    #sortable {
        clear: both;
        display: block;
        float: left;
        min-height: 200px;
        width: 100%;
    }

    #sortable i {
        margin: 5px;
    }

    #sortable > li {
        height: auto;
    }

    #shopform table {
        margin-bottom: 15px;
        width: 100% !important;
    }

    #shopform table tr {
        border: none;
    }

    #shopform table tr td {
        vertical-align: bottom;
    }

    #shopform table tr td label {
        cursor: initial;
    }

    #shopform table tr td #prijs {
        font-style: italic;
    }

    #shopform table tr td .ps_prijs_incl_btw {
        font-size: 1.8em;
        font-weight: bold;
        font-style: initial;
    }

    #shopform table tr:hover,
    #bodydiv.p_shop_saveoptions_ table tr:hover  {
        box-shadow: none;
    }

    .dbsearchdiv .ptab {
        clear: both;
        height: 50px;
    }

    .dbsearchdiv .ptab #refreshdata {
        width: 90%;
        float: left;
    }

    .dbsearchdiv .ptab input[type="submit"] {
        width: 9%;
        float: left;
        margin: 0;
        margin-left: 1%
    }

    .gegevensinvoeren .ptablink,
    .departmentlist a {
        float: none;
        opacity: 0.3;
    }

    .ptablink.tabactive {
        opacity: 1;
        text-decoration: none;
    }

    .gegevensinvoeren .ptabselected,
    .departmentlist .activedept {
        opacity: 1;
        text-decoration: none !important;
    }

    .gegevensinvoeren .searchform {
        width: 100%;
        clear: both;
        min-height: 130px;
        border-bottom: 1px solid #dddddd;
    }

    .gegevensinvoeren .searchform .ptab {
        position: relative;
    }

    #bestellen_invoeren .selectimage span {
        display: block;
        width: 100%;
        text-align: center;
        line-height: 0;
    }

    #imageoptions {
        width: 100%;
        margin-top: 15px;
    }

    #imageoptions table tr:hover {
        box-shadow: none;
    }

    #imageoptions a {
        text-decoration: none;
    }

    .selectimage2img {
        display: none;
    }

    #imageoptions a::before {
        content: "\f125";
        font-family: FontAwesome;
        font-size: 18px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        opacity: 1;
        top: 10px;
        margin-bottom: 15px;
    }

    #imageoptions .selectimage2::before {
        content: "\f03e";
        display: none;
    }

    #imageoptions table tr td input[type="text"],
    #imageoptions table tr td input[type="text"] select {
        width: 100%;
        font-size: 14px;
    }

    #imageoptions table tr td input[type="submit"] {
        width: 100%;
    }

    #bodydiv.p_shop_index #upload .clearupload {
        width: auto;
        height: 35px;
        line-height: 35px;
    }

    /*-- Bestelhistorie --*/

    #container > div#content #bhform {
        margin-top: 25px;
    }

    #bhform_options tr {
        border: none;
    }

    #bhform_options tr td select {
        margin-bottom: 5px;
    }

    #bhform_options tr:hover {
        box-shadow: none;
    }

    #bhform_options tr td #start_year,
    #bhform_options tr td #start_month,
    #bhform_options tr td #start_day {
        float: right;
        width: 32%;
        margin-left: 1.333333333%;
    }

    /*-- Winkelwagen --*/

    #winkelwagen table th,
    #winkelwagen table td {
        text-align: right;
    }

    #winkelwagen table .orderaantal input {
        width: auto;
    }

    #wwinfo tr {
        border: none;
    }

    #wwinfo .wwexopslaan input[type="checkbox"] {
        text-align: left;
        width: auto;
    }

    #wwinfo tr:hover {
        box-shadow: none;
    }

    .adres {
        margin-bottom: 30px;
    }

    #kopieafleveradresknop {
        background-color: #ffd7da;
        color: #ffffff;
        border: none;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        height: 40px;
        letter-spacing: 1px;
        line-height: 40px;
        outline: medium none;
        padding: 0 15px;
        position: relative;
        text-decoration: none;
        transition: all 0.3s ease 0s;
        white-space: nowrap;
        font-family: "raleway-v4020light",sans-serif;
        font-weight: 100;
    }

    #afleveradres h3 a {
        background-color: #ffd7da;
        color: #ffffff;
        border: none;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        height: 40px;
        letter-spacing: 1px;
        line-height: 40px;
        outline: medium none;
        padding: 0 15px;
        position: relative;
        text-decoration: none;
        transition: all 0.3s ease 0s;
        white-space: nowrap;
        font-family: "raleway-v4020light",sans-serif;
        font-weight: 100;
        float: right;
    }

    #kopieafleveradresknop:hover,
    #afleveradres h3 a:hover {
        background-color: #e0ae45;
        transition: 0.2s ease-in;
        color: #ffffff;
    }

    /*Verwijdericon winkelwagen*/
    .ww.orderdelete a {
        width: 20px;
        height: 20px;
        text-decoration: none;
    }

    .ww.orderdelete a:before {
        content:  "\f057";
        font-family: FontAwesome;
        font-size: 18px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        opacity: 1;
        top: 10px;
    }
    /*Verwijdericon winkelwagen EOF*/

    /*-- PDF MP --*/

    #page_requirements::before {
        color: #ffffff;
        content:  "\f06a";
        font-family: FontAwesome;
        font-size: 18px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        opacity: 1;
        top: 10px;
    }

    #documentstableindex2 tr:hover {
        box-shadow: none;
    }

    #bodydiv.p_documents_index #container #content .fieldsetblock {
        margin-top: 25px;
    }

    #bodydiv.p_documents_index #container #content {
        padding-bottom: 30px;
    }

    #container > div#content #pdf_mp_buttons {
        clear: both;
        height: 50px;
        margin-top: 15px;
        margin-bottom: 15px;
    }
    /*-- Bestelbon --*/

    #container #content #formpie {
        background-color: transparent;
        border: none;
        padding: 0;
    }

    #formpie span {
        float: left;
        margin: 1% 1% 1% 0 !important;
        width: 49% !important;
    }

    .besteldeorder3table td a {
        text-decoration: none;
    }

    .besteldeorder3table td a:before {
        content:  "\f055";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    .besteldeorder3table td a[href^="/authoriseren/download/"]:before {
        content:   "\f0ed";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    .besteldeorder3table td a[href^="/authoriseren/accept/"]:before {
        content: "\f00c";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    .besteldeorder3table td a[href^="/authoriseren/deny/"]:before {
        content: "\f00d";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    #bestelbontable tr:first-child:hover {
        box-shadow: none;
    }

    #bestelbontable td[rel="c_afbeelding"] img {
        width: auto;
        max-width: 100%;
        border: 1px solid #dddddd;
    }

    #bestelbontable .img_loader img {
        border: none;
        width: auto;
    }

    .orderlist:before {
        content:  "\f055";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    .besteldeorder3table td a img {
        display: none;
    }

    #formpie input {
        background-color: #ffffff;
        background-image: none;
        border: 1px solid #dddddd;
        border-radius: 0;
        color: #626161;
        display: block;
        font-size: 15px;
        line-height: 1.42857;
        padding: 8px 14px;
        width: 100%;
        transition: border-color 0.15s ease-in-out 0s;
    }

    #formpie input[type="submit"] {
        float: left;
        width: 10%;
        margin-top: 28px;
        background-color: #ADD51C;
        color: #ffffff;
        border: none;
        height: 39px;
    }

    #exportknop input[type="submit"] {
        width: auto;
    }

    #formpie #s {
        border-width: 1px;
        border-color: #dad8d8;
    }

    .pagination_links {
        margin-top: 15px;
    }

/*-- Important is nog om inline-style van #large te overrulen --*/
    #large {
        display: none !important;
    }

    .images table {
        border: none;
        table-layout: fixed;
    }

    .image_beeldbankimage {
        width: 31.333333%;
        margin: 1%;
        float: left;
        border: 1px solid #dad8d8;
        box-sizing: border-box;
        height: 200px;
        overflow: hidden;
    }

    .image_beeldbankimage table tr {
        border: none;
    }

    .image_beeldbankimage table tr:hover {
        box-shadow: none;
    }

    .td_name > a {
        font-size: 14px;
        text-decoration: none;
    }

    .overzicht_images img {
        width: 100%;
    }

    #container > div#content #image-edit-container {
        background-color: #ffffff;
        padding: 15px;
        border: 1px solid #dad8d8;
        margin-top: 25px;
    }

    #container > div#content #image-edit-container a[href^="/image/beeldbank?page="],
    #beeldbank2 a[href^="/image/imagepicker2?image="],
    #bodydiv.p_report_minfo3 #content a,
    #bodydiv.p_report_minfo2 table thead tr td a,
    #custom_terug a {
        background-color: #ffd7da !important;
        color: #ffffff;
        border: none;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        height: 40px;
        letter-spacing: 1px;
        line-height: 40px;
        outline: medium none;
        padding: 0 15px;
        position: relative;
        text-decoration: none;
        transition: all 0.3s ease 0s;
        white-space: nowrap;
        font-family: "raleway-v4020light",sans-serif;
        font-weight: 100;
        margin-bottom: 15px;
    }

    /*      #content a[href^="/data/list/"]
            #content a[href^="/data/list/"] {
            width: auto !important;
            color: white !important;
    */
    #bodydiv.p_report_minfo3 #content a {
        margin-top: 15px;
    }

    #container > div#content #image-edit-container a[href^="/image/beeldbank?page="]::before,
    #beeldbank2 a[href^="/image/imagepicker2?image="]::before {
        content: "Terug";
    }

    #container > div#content #image-edit-container a[href^="/image/beeldbank?page="]:hover,
    #beeldbank2 a[href^="/image/imagepicker2?image="]:hover,
    #bodydiv.p_report_minfo3 #content a:hover,
    #bodydiv.p_report_minfo2 table thead tr td a:hover {
        background-color: #e0ae45;
        transition: 0.2s ease-in;
        color: #ffffff;
    }

    #container > div#content #image-edit-container a[href^="/image/beeldbank?page="] img,
    #beeldbank2 a[href^="/image/imagepicker2?image="] img {
        display: none;
    }

    #container > div#content #image-edit-container p {
        color: #626161;
    }

    #container > div#content #image-edit-container .default_submit {
        clear: both;
    }

    #container div#content #image-edit-container a[href^="/image/beeldbank?mapid"] {
        margin-bottom: 30px;
    }

    div#content #image-edit-container a[href^="/image/beeldbank?mapid"]:before {
        content: "Terug";
    }

    #container > div#content #image-edit-container a img {
        display: none;
    }

    #beeldbankactionbuttons a {
        width: 30px;
        height: 30px;
        display: block;
        margin: 5px;
        float: left;
        text-decoration: none;
    }

    #b2_picture_add_a::before {
        content: "\f03e";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    #b2_folder_add_a::before {
        content: "\f07c";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    #b2_upload_file_a::before {
        content: "\f093";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    #b2_find_a::before {
        content: "\f002";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    #b2_zip_a::before {
        content: "\f1c6";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    #b2_folder_edit_a::before {
        content: "\f07b";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    #b2_folder_del_a::before {
        content: "\f014";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    #MB_window {
        margin-top: 15%;
    }

    #MB_header {
        background-color: #ffffff;
        padding-top: 15px;
        padding-bottom: 15px;
        border: none;
    }

    #MB_caption {
        color: #626161;
        font-family: "Roboto",sans-serif;
        font-weight: 400;
        font-size: 18px;
    }

    #MB_frame {
        background-color: #ffffff;
        border: 1px solid #dad8d8;
    }

    #MB_frame br:empty {
        display: none;
    }

    #MB_frame input {
        width: 100%
    }

    .formtitel {
        margin-top: 15px;
        margin-bottom: 10px;
    }

    #MB_frame .totaal_button {
        margin-left: 0;
        margin-top: 15px;
    }

    #MB_frame input[type="file"] {
        text-align: left;
        height: auto;
    }

    #MB_close {
        font-size: 24px;
    }

    #MB_frame .totaal_button {
        float: right !important;
    }

    #bodydiv.p_image_editimg {}

/*-- Vervangen icons afbeelding bewerken (Beeldbank)--*/

    #imageknoppen a {
        text-decoration: none;
    }

    #imageknoppen a img {
        display: none;
    }

    #imageknoppen a::before {
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    #spiegelhor::before {
        content: "\f07e";
        transform: rotate(-90deg);
        font-family: FontAwesome;
    }

    #spiegelver::before {
        content: "\f07d";
        transform: rotate(-90deg);
        font-family: FontAwesome;
    }

    #kantel-r::before {
        content: "\f01e";
        font-family: FontAwesome;
    }

    #kantel-l::before {
        content: "\f0e2";
        font-family: FontAwesome;
    }

    #meer-contrast::before {
        content: "\f123";
        font-family: FontAwesome;
    }

    #minder-contrast::before {
        content: "\f006";
        font-family: FontAwesome;
    }

    #uitsnijden::before {
        content: "\f125";
        font-family: FontAwesome;
    }

    #scherper::before {
        content: "\f125";
        font-family: FontAwesome;
    }

    #delete {
        border: 1px solid #dad8d8;
        padding: 10px;
    }

    #cmyk::before {
        content: "cmyk";
        font-family: "Roboto",sans-serif;
        text-transform: uppercase;
    }

    #negatief::before {
        content: "\f042";
        font-family: FontAwesome;
    }

    #grijs::before {
        content: "\f043";
        font-family: FontAwesome;
    }

    #locked-open::before {
        content: "\f09c";
        font-family: FontAwesome;
    }

    #aanpassen {
        border: 1px solid #dad8d8;
        padding: 10px;
    }

    #new::before {
        content: "\f055";
        font-family: FontAwesome;
    }

/*    .imgCrop_wrap {
        width: 100% !important;
    }

    .imgCrop_wrap img {
        width: 100%;
    }
*/
/*-- Managementinfo --*/

    #bodydiv.p_report_minfo form {
        background-color: #ffffff;
        padding: 15px;
        border: 1px solid #dad8d8;
    }

    #bodydiv.p_report_minfo #search_site form {
        border: none;
    }

    #bodydiv.p_report_minfo select {
        margin-bottom: 15px;
    }

    #bodydiv.p_report_minfo2 table {
        background-color: #ffffff;
        margin-top: 15px;
    }

    #bodydiv.p_report_minfo2 table tr {
        border-bottom: 1px solid #dad8d8;
    }

    #bodydiv.p_report_minfo2 table tr:first-child {
        background: none;
    }

    /*-- Imagepicker modal --*/

    #imagepickerbody {
        background: none;
        background-color: #f0f0f0;
    }

    #imagepickerbody #newimage_image {
        width: 82%;
    }

    #imagepickerbody .default_submit {
        width: auto;
    }

    #imagepickerbody #beeldbank2,
    #imagecropper2 #beeldbank2 {
        max-width: 1000px;
        margin: 0 auto;
    }

    #imagecropper2 #beeldbank2 {
        background-color: #ffffff;
        border: 1px solid #dad8d8;
    }

    #imagecropper2 #beeldbank2 #crophoogtebreedte input[type="checkbox"] {
        height: auto;
    }

    #imagepickerbody .imgpckafbeeldingen table {
        width: 100%;
        height: 200px;
        border: none;
    }

    #imagepickerbody table tr td label {
        display: inline;
    }

    #imagepickerbody .fieldsetblock table tr:hover {
        box-shadow: none;
    }

    #imagepickerbody #search_site {
        display: none;
    }

    .p_report_minfo #search_site form {
        padding: 0;
    }

    img[src*="/images/beeldbank/b2_noimage.png"] {
        display: none;
    }

    .imgpckafbeeldingen .image_noimageoption table tr td {
        text-align: center;
        font-size: 2em;
        position: relative;
    }

    .imgpckafbeeldingen .image_noimageoption table tr .td_name a::after {
        content: "\f057";
        font-family: FontAwesome;
        font-size: 3em;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        opacity: 1;
        bottom: 0;
        display: block;
        width: 100%;
        position: absolute;
    }

    .imgpckafbeeldingen .image_noimageoption table tr .td_name a::after:hover {
        color: #ffd7da;
    }

    #imagepickerbody .image_beeldbankimage {
        border: 1px solid #dad8d8;
        box-sizing: border-box;
        float: left;
        min-height: 200px;
        width: 18%;
    }

    .imgpckafbeeldingen {
        background-color: #ffffff;
    }

    #imagepickerbody br:empty {
        display: none;
    }

    #imagepickerbody .default_submit input[type="submit"] {
        height: 37px;
        margin: 0;
        line-height: 37px;
    }

    #imagepickerbody input[type="file"] {
        width: 55%;
        padding: 5px;
        float: left;
        border: 1px solid #dad8d8;
        margin-bottom: 15px;
        text-align: left;
        height: auto;
    }

    #imgpckrzoeken .imgpickzoekwoordcell,
    #imgpckrzoeken .imgpickorientatieddcell,
    #imgpckrzoeken .imgpickzoekknopcell {
        width: 10%;
    }
    #imgpckrzoeken .imgpickzoekwoordqcell,
    #imgpckrzoeken .imgpickorientatieddcell {
        width: 25%;
    }

    #imgpckrzoeken .imgpickorientatieddcell div.formveld,
    #imgpckrzoeken .imgpickorientatieddcell .formveld select {
        width: 100%;
    }

/*-- Image cropper modal --*/

    body#imagecropper2 #beeldbank2 {
        max-width: 1000px;
        margin: 0 auto;
        background-color: #ffffff;
        border: 1px solid #dad8d8;
        padding: 15px;
        padding-bottom: 100px;
    }

    body#imagecropper2 #beeldbank2 div {
        margin-top: inherit;
        margin-bottom: inherit;
    }

    body#imagecropper2 {
        background: none;
        background-color: #f0f0f0;
    }

    body#imagecropper2 form {
        margin-top: 30px;
    }

    body#imagecropper2 {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    body#imagecropper2 .imgCrop_clickArea {
        margin-top: 0;
        margin-bottom: 0;
    }

    body#imagecropper2 #b2links > span {
        width: auto;
        float: left;
    }

    body#imagecropper2 #search_site {
        display: none;
    }

    body#imagecropper2 #b2_options a {
        text-decoration: none;
        margin: 5px;
    }

    body#imagecropper2 #b2_options a img {
        display: none;
    }

    body#imagecropper2 #b2_options a::before {
        font-style: normal;
        font-weight: normal;
        color: #000;
        font-size: 14px;
        padding-right: 0.5em;
        top: 10px;
        left: 0;
    }

    body#imagecropper2 #b2_feedback {
        margin-top: 5px;
        margin-bottom: 15px;
    }

/*-- Vervangen icons in de imagecropper modal --*/

    body#imagecropper2  #option1::before {
        content: "\f0ec";
        transform: rotate(-90deg);
        font-family: FontAwesome;
    }

    body#imagecropper2  #option3::before {
        content: "\f0e2";
        font-family: FontAwesome;
    }

    body#imagecropper2  #option6::before {
        content: "\f123";
        font-family: FontAwesome;
    }

    body#imagecropper2  #option5::before {
        content: "\f006";
        font-family: FontAwesome;
    }

    body#imagecropper2  #uitsnijden::before {
        content: "\f125";
        font-family: FontAwesome;
    }

    body#imagecropper2 #minder-contrast::before {
        content: "\f006";
        font-family: FontAwesome;
    }

    body#imagecropper2 #scherper::before {
        content: "\f125";
        font-family: FontAwesome;
    }

    body#imagecropper2 #delete::before {
        content: "\f1f8";
        font-family: FontAwesome;
    }

    body#imagecropper2 #option9::before {
        content: "cmyk";
        font-family: "Roboto",sans-serif;
        text-transform: uppercase;
    }

    body#imagecropper2 #option11::before {
        content: "\f042";
        font-family: FontAwesome;
    }

    body#imagecropper2 #option10::before {
        content: "\f043";
        font-family: FontAwesome;
    }

    body#imagecropper2 #locked-open::before {
        content: "\f09c";
        font-family: FontAwesome;
    }

    body#imagecropper2 #aanpassen::before {
        content: "\f044";
        font-family: FontAwesome;
    }

    /*-- Datepicker --*/

/*-- Importants om basic datepicker.css te overrulen --*/

    a.dp-choose-date {
        background-image: none;
        color: #626161;
        height: 30px;
        margin-top: 5px;
        width: 150px;
        font-size: 0;
        display: inline !important;
        width: 40px !important;
        height: 40px !important;
        overflow: visible !important;
        background-image: none !important;
        padding: 5px;
    }

    a.dp-choose-date::before {
        color: #626161;
        content: "\f073";
        font-family: FontAwesome;
        font-size: 18px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        opacity: 1;
        top: 10px;
    }

    .gegevensinvoeren .dp-applied {
        width: 90%;
    }

    .gegevensinvoeren a.dp-choose-date {
        font-size: 0;
        vertical-align: middle;
    }

    div.dp-popup {
        width: auto !important
    }

    div.dp-popup .dp-nav-prev a {
        padding-left: 5px !important;
        padding-right: 5px !important;
        font-family: "raleway-v4020light",sans-serif;
    }

    div.dp-popup .dp-nav-prev a:hover {
        color: #ffd7da !important;
        transition: 0.3s ease-in;
    }

    div.dp-popup h2 {
        font-size: 16px !important;
        color: #626161 !important;
        font-family: "raleway-v4020light",sans-serif;
    }

    table.jCalendar {
        width: 100% !important;
        border: none !important;
    }

    .dp-popup table tr:hover {
        box-shadow: none !important;
    }

    .dp-popup table th,
    .dp-popup table td {
        padding: 15px !important;
        background-color: #ffffff !important;
        border: 1px solid #dad8d8 !important;
        font-size: 14px !important;
        font-family: "raleway-v4020light",sans-serif !important;
    }

    div.dp-popup td.disabled {
        background-color: #dad8d8 !important;
        opacity: 0.6;
    }

    div.dp-popup td.disabled:hover {
        background-color: #dad8d8 !important;
        opacity: 0.6;
    }

    div.dp-popup h2 {
        background-color: #ffffff !important;
    }

    .dp-popup table th {
        background-color: #ffd7da !important;
        color: #ffffff !important;
        border: none !important;
    }

    .input.dp-applied {
        width: 50% !important;
    }

    table.jCalendar td.today,
    table.jCalendar td.other-month {
        background-color: #ACD51B !important;
        color: #ffffff !important;
    }

    /*-- Databeheer --*/

    #container #content #filterdep {
        margin-top: 15px;
        margin-bottom: 15px;
        height: 50px;
    }

    #bodydiv.p_data_import1 #content form {
        background-color: #ffffff;
        border: 1px solid #dad8d8;
        padding: 15px;
    }

    #bodydiv.p_data_import1 #content form p {
        clear: both;
    }

    /*--Data table --*/

    .ui-jqgrid {
        font-family: "raleway-v4020light",sans-serif;
    }

    .ui-jqgrid .ui-jqgrid-hbox {
        padding: 0;
    }

    .ui-jqgrid-htable {
        width: 100%;
        max-width: auto;
        border: none;
    }

    .ui-jqgrid .ui-jqgrid-htable th {
        padding: 15px;
        border: none;
    }

    #data-zoekopties table {
        width: 100% !important;
    }

    #data-zoekopties table tr td {
        width: 50%;
    }

    #data-zoekopties table tr td input[type="text"] {
        width: 100% !important;
    }
    /*-- Important is om inline-styles te overrulen --*/

    .ui-jqgrid .ui-jqgrid-btable {
        max-width: initial;
    }

    .ui-jqgrid .ui-jqgrid-btable .ui-state-hover {
        background-color: #ffffff;
    }

    .ui-jqgrid-btable .jqgfirstrow td {
        padding: 0;
    }

    .ui-jqgrid tr.ui-row-ltr td {
       border: medium none;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .p_data_index .departmentlist {
        height: 50px;
    }

    #container > div#content  .p_data_index #content select {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    .p_data_index a img {
        display: none;
    }

    .p_data_index table tr td a {
        margin: 5px;
    }

    #databack {
        width: 100%;
        margin-bottom: 30px;
    }

    #databack a i {
        display: none;
    }

    #databack a:before {
        content: "Terug";
    }

    #pager {
        height: 75px;
    }

    .ui-pg-table {
        border: none;
    }

    .ui-pg-table #pager_left {
        display: none;
    }

    .ui-pg-table #pager_center {
        width: 84%;
        padding-right: 15px;
    }

    .ui-pg-table #pager_right {
        width: 15%;
    }

    .ui-pg-table #pager_center table {
        width: 100%;
    }

    .ui-pg-table #pager_center table tr:hover {
        box-shadow: none;
    }

    #first_pager,
    #prev_pager,
    #next_pager,
    #last_pager {
        text-align: center;
        width: 10%;
        border: none;
    }

    .ui-state-default .ui-icon {
        background-image: none;
    }

    #first_pager::before,
    #last_pager::before {
        color: #626161;
        content: "\f048";
        font-family: FontAwesome;
        font-size: 14px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        opacity: 1;
        top: 10px;
    }

    #prev_pager::before,
    #next_pager::before  {
        color: #626161;
        content: "\f0d9";
        font-family: FontAwesome;
        font-size: 14px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        opacity: 1;
        top: 10px;
    }

    #next_pager::before {
        content: "\f0da";
    }

    #last_pager::before {
        content: "\f051";
    }

    .ui-jqgrid .ui-pg-input,
    .ui-jqgrid .ui-pg-selbox {
        width: 60%;
        font-size: 15px;
        height: auto
    }

    .ui-jqgrid .ui-pg-input {
        float: right;
    }

    .ui-jqgrid .ui-paging-info {
        text-align: center;
    }

    #data-zoekopties {
        margin-top: 30px;
    }

    #data-zoekopties table {
        width: 100%;
    }

    #data-zoekopties table tr:hover {
        box-shadow: none;
    }

    #data-zoekopties .default_submit {
        float: left;
        width: auto;
    }

    #bodydiv.p_marketing_editaccount #content .totaal_button {
        margin: 0 auto;
        max-width: 1000px;
        width: 90%;
        float: none;
    }

    /*-- Data pop-up --*/

    .datapopupbody {
        background: #f0f0f0 none repeat scroll 0 0 !important;
    }

    .datapopupbody #bodydiv {
        width: 100%;
    }

    .datapopupbody #bodydiv #content {
        width: 90%;
        margin: 0 auto;
        max-height: 400px;
        overflow-y: scroll;
        padding-bottom: 60px;
    }

    /*-- Slider --*/

    .nivoSlider {
        background-size: 100%;
    }

    /*-- Formaatkeuze --*/

    #container > div#content #fkcontent table tr:hover {
        box-shadow: none;
    }

    #container > div#content #fkcontent {
        display: block;
    }

    /*-- PDF MP --*/

    body.p_documents_edit p {
        color: #626161;
    }

    /*-- WYSIWYG Editor --*/

    .mceEditor.defaultSkin {
        width: 100%;
    }

    .mceEditor.defaultSkin .mceLayout {
        width: 100% !important;
        min-height: 200px !important;
        overflow: scroll;
    }

    .defaultSkin .mceIframeContainer iframe {
        min-height: 250px;
    }

    /*-- Nieuwsbrief --*/
    .campagnepart #branchediv .formveld input {
        height: auto;
    }

    body.p_email_ordervariant fieldet {
        border: none;
        padding: 0;
    }

    /*--------- Upload ---------*/

    #bodydiv.p_upload_uploadpdf #div1 span {
        float: none;
        color: #626161;
    }

    #bodydiv.p_upload_uploadpdf input[type="file"] {
        float: none;
        color: #626161;
    }

    .simpleupload #div1 {
        border: none;
        margin-top: 0;
        padding-top: 0;
    }

    .simpleupload p {
        color: #626161;
    }

    .simpleupload p input[type="file"] {
        width: 100%;
    }

    .simpleupload p span {
        margin-bottom: 10px;
        margin-top: 10px;
        width: 100%;
    }

    #bodydiv.p_canvas_index #upload p,
    #bodydiv.p_upload_uploadpdf #upload p {
        margin-bottom: 15px;
    }

    #bodydiv.p_canvas_index #upload p input[type="file"] {
        margin-top: 30px;
        width: 100%;
    }


    #bodydiv.p_canvas_index #upload #uploading {
        clear: both;
    }
    /*-- doupload --*/

     #bodydiv.p_upload_douploadpdf #content p {
        color: #626161;
     }

     #bodydiv.p_upload_douploadpdf p img {
        border: 1px solid #dad8d8;
     }

    /*-- Organisatiedata --*/

    #bodydiv.p_organisatie_index div#content #newdep {
        padding: 15px;
        background-color: white;
        border: 1px solid #dad8d8;
        margin-top: 15px;
    }

     #bodydiv.p_organisatie_index .uitklaptable {
        width: 100% !important;
        border: none;
     }

    #bodydiv.p_organisatie_index #newdep .uitklaptable tr {
        border: 1px solid #dad8d8;
    }

    #bodydiv.p_organisatie_index .uitklaptable tr td {
        width: 100% !important;
    }

    #bodydiv.p_organisatie_index .uitklaptable tr td:last-child a img {
        display: none;
    }

    #bodydiv.p_organisatie_index #depul a[href^="/organisatie/loginas"] img {
        display: none;
    }

   #bodydiv.p_organisatie_index #depul a:hover {
        background-color: transparent;
    }

    #bodydiv.p_organisatie_index #newdep a:after {
        color: #ffffff;
        content:  "\f0d7";
        font-family: FontAwesome;
        font-size: 18px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        top: 10px;
        line-height: 2;
        margin-left: 10px;
    }

    #bodydiv.p_organisatie_index #newdep ul li > div {
        width: 100%;
    }

    #bodydiv.p_organisatie_index #newdep .uitklaptable tr td a,
    #bodydiv.p_organisatie_index #newdep ul li ul a {
        background-color: transparent;
        color: #626161 ;
        text-decoration: none;
        margin-left: 25px;
    }

    #bodydiv.p_organisatie_index #newdep .uitklaptable tr td a:hover
    #bodydiv.p_organisatie_index #newdep ul li ul a:hover {
        color: #ffd7da;
    }

    #bodydiv.p_organisatie_index #newdep .uitklaptable tr td a:hover,
    #bodydiv.p_organisatie_index #newdep ul li ul a:hover {
        content: "";
        color: #ffd7da;
    }

    #bodydiv.p_organisatie_index #newdep ul li {
        margin-top: 15px;
    }

    #bodydiv.p_organisatie_index #newdep ul li ul {
        padding: 10px;
        padding-left: 15px;
        background-color: #eaeaea;
        border: 1px solid #dad8d8;
    }

    #bodydiv.p_organisatie_index #newdep ul li ul table {
        width: 100% !important;
    }

    #bodydiv.p_organisatie_index #newdep ul li ul table tr {
        position: relative;
    }

    #bodydiv.p_organisatie_index #newdep ul li ul table tr td {
        padding: 5px;
        width: 100%;
    }

    #bodydiv.p_organisatie_index #newdep ul li ul table tr td .fa-shield {
        color: #c0c0c0;
        font-size: 1.5em;
        line-height: 0;
        margin-right: 15px;
        position: absolute;
        left: 15px;
    }

    #bodydiv.p_organisatie_index #newdep ul li ul table tr td:last-child {
        width: auto !important;
        text-align: right;
    }

    #bodydiv.p_organisatie_index #newdep ul li ul li ul {
        background-color: #f0f0f0;
    }

    /*-- Organisatiedate editdep --*/

    #bodydiv.p_organisatie_editdep #content .default_button {
        float: left;
        width: auto;
    }

    #bodydiv.p_organisatie_editdep #content form input[type="submit"] {
        width: auto;
    }

    #bodydiv.p_organisatie_editdep a[href^="/organisatie/loginas"] {
        text-decoration: none;
        float: right;
    }

    #bodydiv.p_organisatie_editdep a[href^="/organisatie/loginas"] img {
        display: none;
    }

    #bodydiv.p_organisatie_editdep a[href^="/organisatie/loginas"]:after {
        color: #2c2e2d;
        content:  "\f090";
        font-family: FontAwesome;
        font-size: 18px;
        font-style: normal;
        font-weight: normal;
        left: 0;
        padding-right: 0.5em;
        top: 10px;
        line-height: 2;
        margin-left: 10px;
        text-decoration: none;
    }

    .stay {
        margin-right: 10px;
    }

    /*-- Artikelbeheer --*/

    #bodydiv.p_config_edit #content form {
        padding: 15px;
        background-color: #ffffff;
        border: 1px solid #dad8d8;
    }

     #bodydiv.p_config_new #content form {
        padding-bottom: 80px;
     }

    #bodydiv.p_config_edit .formveld input[type="file"],
    #bodydiv.p_config_new .formveld input[type="file"]  {
        width: 100%;
    }
    #bodydiv.p_config_edit #databack,
    #bodydiv.p_config_new #databack {
        float: left;
        margin-bottom: 30px;
        width: 100%;
    }

    #bodydiv.p_config_edit #databack a:nth-child(2) {
        display: none;
    }

/*-- Login --*/

    body.loginpage {
        background-size: cover;
        background-image: url(/images/application2017/loginBG.jpg);
    }

    body.loginpage #topper {
        background-image: url(/cssitem/replacefile/7845/XM_LOGO_GOUD.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: 20% auto;
        height: 200px;
        margin: 0 auto;
        margin-top: 2%;
        text-align: center;
        width: 100%;
    }

    body.loginpage #outer {
        background-color: #ffffff;
        width: 50%;
        left: 25%;
        border: 1px solid #dad8d8;
        padding: 15px;
        position: absolute;
        top: 20%;
        box-shadow: 0 1px 8px -5px #000000;
        text-align: center;
    }

    #languageselect li {
        width: auto;
        display: inline-block;
    }

    #tekst {
        width: 40%;
        float: left;
        line-height: 45px;
        text-align: left;
    }

    #velden {
        width: 59%;
        float: left;
    }

    #velden input {
        margin-bottom: 15px;
    }

    #knop {
        margin-bottom: 15px;
    }

    #knop input {
        width: 100%;
    }

/*-- Vrije opmaak --*/

    #bodydiv.p_freedesign_design #container #header {
        height: 40px !important;
    }

    #bodydiv.p_freedesign_design #container #footer {
        width: 100%;
    }

    #bodydiv.p_freedesign_design #container #content {
        background-color: #f0f0f0;
    }

    #bodydiv.p_freedesign_design #container #content #freedesigncontainer {
        width: 100%;
        max-width: 100%;
        margin-left: 0%;
        background-color: #ffffff;
        border: 1px solid #dad8d8;
        float: left;
        margin-top: 15px;
    }

    #bodydiv.p_freedesign_design #container #content #freedesigncontainer #zoomcontrols {
        height: auto;
    }

    #freedesigncontainer #objecttools,
    #freedesigncontainer #objecttools table {
        width: 100% !important;
        margin: 0;
        padding: 0;
        border: none;
    }

    #freedesigncontainer #objecttools table h3 {
        margin: 0;
        padding: 10px;
    }

    #freedesigncontainer #objecttools table tr td {
        min-width: 130px;
        border: none;
        border-right: 1px solid #dad8d8;
        padding: 0;
        max-height: 75px;
        text-align: left;
        width: auto;
    }

    /*-- Zoomen --*/

    #freedesigncontainer #objecttools table tr:hover {
        box-shadow: none;
    }

    #freedesigncontainer #objecttools table tr td {
        vertical-align: baseline;
    }

    #freedesigncontainer #drawing-area {
        width: 48% !important;
        margin: 0 !important;
        background-color: #eaeaea !important;
    }

    #freedesigncontainer #drawing-area #mediawrapper {
        padding: 15px;
    }

    #bodydiv.p_freedesign_design #container #content #tools,
    #bodydiv.p_freedesign_design #container #content #sidebar {
        border: none;
        width: 25% !important;
        padding-bottom: 30px;
    }

    #bodydiv.p_freedesign_design #container #content #sidebar #goback {
        border: none;
    }

    #bodydiv.p_freedesign_design #goback {
        border: none;
        width: 90%;
        max-width: 90% !important;
    }

    #bodydiv.p_freedesign_design #goback a {
        border: none;
    }

    #bodydiv.p_freedesign_design #goback span,
    #bodydiv.p_freedesign_design #goback a img {
        display: none;
    }

    #bodydiv.p_freedesign_design #goback a:before {
        content: "Terug";
        color: white;
    }

    #bodydiv.p_freedesign_design #container #content #sidebar .tabs {
        border: none;
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
        margin-top: 15px;
    }

    #bodydiv.p_freedesign_design #container #content #sidebar li {
        background-image: none !important;
        text-align: left;
        padding: 0px;
        border: 1px solid #dad8d8;
        padding: 15px;
        height: 60px;
        color: #626161;
    }

    #bodydiv.p_freedesign_design #container #content #sidebar li.active {
        background-color: transparent !important;
        color: #626161;
    }

    #bodydiv.p_freedesign_design #container #content #sidebar li a,
    #bodydiv.p_freedesign_design #container #content #sidebar li.active a {
        text-decoration: none;
        color: #626161;
    }

    #sidebar #fototab:before {
        content: "\f03e";
        font-family: "FontAwesome";
        font-size: 18px;
        cursor: pointer;
    }

    #sidebar #figuurtab:before {
        content: "\f005";
        font-family: "FontAwesome";
        font-size: 18px;
        cursor: pointer;
    }

    #sidebar #teksttab:before {
        content: "\f010";
        font-family: "FontAwesome";
        font-size: 18px;
        cursor: pointer;
    }

    #freedesigncontainer #opslaanakties {
        width: 100%;
        border: none;
    }

    #freedesigncontainer #scale p {
        width: 100%;
        text-align: left !important;
        margin-bottom: 10px !important;
    }

    #freedesigncontainer #scale {
        padding-left: 15px;
        padding-right: 15px;
    }

    #freedesigncontainer #scale #scaleSlider {
        width: 100% !important;
    }

    #freedesigncontainer #scale #scaleSlider a {
        background-color: #c0c0c0;
        border: none;
    }

    #freedesigncontainer #bleedtools {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
        margin-top: 15px;
        float: left;
    }

    #freedesigncontainer #tools {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
        margin-top: 15px;
        float: right;
    }

    #freedesigncontainer #bleedtools #toggleGrid,
    #freedesigncontainer #bleedtools #toggleBleed {
        text-decoration: none;
        background-image: none !important;
        height: 30px;
        line-height: 30px;
        text-align: center;
        width: 40px !important;
        border: 1px solid #dad8d8;
    }

    #freedesigncontainer #bleedtools #toggleGrid:before {
        content: "\f00a";
        font-family: "FontAwesome";
        font-size: 18px;
        cursor: pointer;
    }

    #freedesigncontainer #bleedtools #toggleBleed:before {
        content: "\f096";
        font-family: "FontAwesome";
        font-size: 18px;
        cursor: pointer;
    }

    #freedesigncontainer #layerspanel {
        padding-left: 15px;
        padding-right: 15px;
        width: 100%;
    }

    #freedesigncontainer #layerspanel .bottom-rounded {
        max-height: 200px;
        overflow-y: scroll !important;
    }

    #bodydiv.p_freedesign_design #container #content #freedesigncontainer #layerspanel #layers li {
        line-height: 2px;
        border: 1px solid #dad8d8 !important;
        position: relative;
    }

    #bodydiv.p_freedesign_design #container #content #freedesigncontainer #layerspanel #layers li.active {
        background-color: #c0c0c0 !important;
        border-color: #c0c0c0 !important;
        color: white;
    }

    #bodydiv.p_freedesign_design #container #content #freedesigncontainer #layerspanel #layers li span {
        top: 0;
        left: 0;
    }

    #bodydiv.p_freedesign_design #container #content #freedesigncontainer #layerspanel #layers li span::before {
        content: "\f010";
        font-family: "FontAwesome";
        font-size: 18px;
        cursor: pointer;
    }

    #freedesigncontainer #opslaanakties fieldset {
        border: none;
    }

    #freedesigncontainer #tools #tekst {
        width: 100%;
        float: left;
    }
    #freedesigncontainer #tools #tekst select {
        background-color: #ffffff;
        background-image: none;
        border: 1px solid #dddddd;
        border-radius: 0;
        color: #626161;
        font-size: 15px;
        line-height: 1.42857;
        padding: 6px 12px;
        transition: border-color 0.15s ease-in-out 0s;
        float: left;
        height: 40px;
    }

    #texttools  #setFont {
        width: 69% !important;
        float: left;
        margin-right: 1%;
    }

    #texttools #setFontSize {
        width: 28% !important;
        float: right;
    }

    #texttools #textzoom {
        margin-top: 30px;
    }

    #texttools #textzoom p {
        width: 100%;
        text-align: left;
        margin-bottom: 5px;
    }

    #texttools #textzoom #textZoomSlider {
        width: 100% !important;
    }

    #texttools #textzoom #textZoomSlider a {
        background-color: #c0c0c0;
    }

    #tekststyles::before {
        content: "Tekst Stijlen";
        display: block;
        width: 100%;
    }

    #align::before {
        content: "Horizontaal uitlijnen";
        display: block;
        width: 100%;
    }

    #vertalign::before {
        content: "Verticaal uitlijnen";
        display: block;
        width: 100%;
    }

    #texttools2::before {
        content: "Rand";
        display: block;
        width: 100%;
    }

    #texttools #tekststyles {
        width: 100%;
        padding-top: 15px;
        padding-bottom: 5px;
    }

    #texttools #tekststyles a, #texttools #align a, #texttools #vertalign a {
        text-decoration: none;
        background-image: none !important;
        height: 30px;
        line-height: 30px;
        text-align: center;
        width: 32% !important;
        border: 1px solid #dad8d8;
        display: inline-block;
    }

    #texttools2 a {
        text-decoration: none;
        background-repeat: no-repeat;
        height: 30px;
        line-height: 30px;
        text-align: center;
        width: 25% !important;
        border: 1px solid #dad8d8;
        display: inline-block;
        background-position: center;
    }

    #texttools2 #linecolorpickercontrol, #texttools2 #bgcolorpickercontrol {
        width: 50% !important;
        background-image: none !important;
    }

    #texttools2 #linecolorpickercontrol::after {
        content: "\f043";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
        margin-left: 5px;
    }

    #texttools2 #linecolorpickercontrol::before {
        content: "\f096";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
    }

    #texttools2 #bgcolorpickercontrol::after {
        content: "\f043";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
        margin-left: 5px;
    }

    #texttools2 #bgcolorpickercontrol::before {
        content: "\f0c8";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
    }

    #texttools #tekststyles #toggleBold::after {
        content: "\f032";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
    }

    #texttools #tekststyles #toggleItalic::before {
        content: "\f033";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
    }

    #texttools #tekststyles #textcolorpickercontrol {
        top: -4px;
        color: white;
    }

    #texttools #tekststyles #textcolorpickercontrol::before {
        content: "\f031";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
    }

    #texttools #tekststyles #textcolorpickercontrol::after {
        content: "\f043";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
    }

    #texttools #align {
        width: 100%;
    }

    #texttools #align #alignLeft::before {
        content: "\f036";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
    }

    #texttools #align #alignCenter::before {
        content: "\f037";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
    }

    #texttools #align #alignRight::before {
        content: "\f038";
        font-family: "FontAwesome";
        font-size: 14px;
        cursor: pointer;
    }

    #texttools div[data-right="-changeTextColor-"],
    #texttools div[data-right="-setLineColor-"],
    #textools div[data-right="-setBackgroundColor-"] {
        background: #ffffff none repeat scroll 0 0;
        height: auto;
        position: absolute;
        width: 300px;
        z-index: 100;
        box-shadow: 10px 10px 9px -11px rgba(0, 0, 0, 0.59);
        left: 0;
    }

    #texttools .tabbed_area {
        width: 100%;
        background-color: white;
        padding: 0;
        border: none;
    }

    #texttools #textcolorpickers #text_cmyk,
    #texttools #linecolorpickers #line_cmyk,
    #texttools #bgcolorpickers #bg_cmyk {
        border: 1px solid #dad8d8;
    }

    #texttools #inputtable  {
        width: 100% !important;
        border: none;
    }

    #texttools #inputtable tr {
        background-color: #ffffff;
        border: none;
        display: block;
        float: left;
        width: 25%;
    }

    #texttools #inputtable tr:hover {
        box-shadow: none;
    }

    #line_cmyk #colortable tr td input {
        width: auto !important;
    }

    #texttools #textcolor_cmyk,
    #texttools #linecolor_cmyk,
    #texttools #backcolor_cmyk  {
        width: 100% !important;
    }

    #texttools #textcolor_cmyk table, #texttools #linecolor_cmyk table, #texttools #backcolor_cmyk table {
        width: 100% !important;
        margin: 0 !important;
    }

    table#colortable tbody tr td  {
        height: 20px;
    }

    table#inputtable tbody tr td{
        padding: 2px;
    }

    #tools #foto #fileUpload {
        width: 100% !important;
        max-width: 120px !important
    }

    #fileUpload #uploadFrame {
        height: 120px !important;
        width: 100% !important;
    }

    #fileUpload #uploadform input[type="file"] {
        width: auto;
        max-width: 96%;
        padding: 2%;
        float: left;
        border: 1px solid #dad8d8;
        margin-bottom: 15px;
    }

    #fileUpload #uploadform input[type="button"] {
        width: auto;
        max-width: 100%;
    }

    #fileUpload #uploadform input[type="button"] {
        background-color: #c0c0c0;
        color: #ffffff;
        border: none;
        cursor: pointer;
        display: inline-block;
        font-size: 14px;
        height: 40px;
        letter-spacing: 1px;
        line-height: 40px;
        margin: 5px;
        margin-left: 0;
        outline: medium none;
        padding: 0 15px;
        position: relative;
        text-decoration: none;
        transition: all 0.3s ease 0s;
        white-space: nowrap;
        width: 100%;
    }

    #fileUpload #uploadform input[type="button"]:hover {
        background-color: #ffffff;
        transition: 0.2s ease-in;
        color: #ffffff;
    }

    #fileUpload {
        width: 100% !important;
    }

    #freedesigncontainer #Fotos {
        margin-top: 30px;
    }

    #Fotos .image-list {
        width: 100%;
        border: 1px solid #dad8d8;
        float: left;
    }

    #Fotos .image-list .image-div  {
        width: 48%;
        margin: 1%;
        border: 1px solid #dad8d8;
        position: relative;
        z-index: 10;
    }

    #Fotos .image-list .image-div img {
        width: 100%;
        padding: 0;
        margin: 0;
        position: absolute;
    }

    #bodydiv.p_freedesign_design #container #content #freedesigncontainer #pagenav {
        clear: both;
        width: 100%;
        height: 50px;
        line-height: 50px;
        margin-top: 2px;
        color: #626161 !important;
        border-bottom: 1px solid #dad8d8;
    }

    #bodydiv.p_freedesign_design #container #content #freedesigncontainer #pagenav a {
        color: #ffd7da !important;
        font-weight: bold !important;
        text-decoration: none;
    }

    /*-- Opslaan/openen --*/

    #freedesigncontainer #opslaanakties {
        width: 100%;
        margin: 0;
    }

    #freedesigncontainer #opslaanakties h3 {
        font-size: 14px;
    }

    #freedesigncontainer #opslaanakties #pubOpslaanAls input[type="submit"] {
        margin: auto;
    }

    #freedesigncontainer #opslaanakties #opslaan  {
        float: left;
        padding: 0;
        width: 40% !important;
    }

    #freedesigncontainer #opslaanakties #opg_geg_ophalen {
        float: left;
        padding: 0;
        width: 60% !important;
    }

    #freedesigncontainer #opslaanakties #opslaan br {
        display: none;
    }

    #freedesigncontainer #opslaanakties #opg_geg_ophalen form {
        margin-top: 0 !important;
    }

    #freedesigncontainer #opslaanakties #opg_geg_ophalen select {
        width: 49%;
        float: left;
    }

    #bodydiv.p_freedesign_design #container #content #designbigbuttons form,
    #bodydiv.p_freedesign_design #container #content #opgeslagengegevensform {
        background-color: transparent;
        margin: 0;
        border: none;
        padding: 0;
        height: auto;
    }

    #bodydiv.p_freedesign_design #container #content #designbigbuttons {
        padding: 0;
        width: 90%;
        max-width: 90%;
    }

    /*-- Mijn bestanden --*/

    #bodydiv.p_shop_mijnbestanden #content .fieldsetblock {
        margin-top: 25px;
    }

    #bodydiv.p_shop_mijnbestanden #content form #uploadtable {
        width: 100%;
        border: none;
    }
    #bodydiv.p_shop_mijnbestanden #content form #uploadtable tr {
        border: none;
    }

    #bodydiv.p_shop_mijnbestanden #content form #uploadtable tr:hover {
        box-shadow: none;
    }

    #bodydiv.p_shop_mijnbestanden #content form #uploadtable #addanotherfile {
        width: auto;
    }

    #bodydiv.p_shop_mijnbestanden #content form #uploadtable #addanotherfile td,
    #bodydiv.p_shop_mijnbestanden #content form #uploadtable .uploadrow td {
        padding: 0;
    }

    #bodydiv.p_shop_mijnbestanden #content form #uploadtable #addanotherfile a {
        text-decoration: none;
        color: white;
    }

    #bodydiv.p_shop_mijnbestanden #content form #uploadtable input[type="file"] {
        border: 1px solid #dad8d8;
        float: left;
        margin-bottom: 15px;
        padding: 5px;
        width: 55% !important;
    }
}

    /*-- Data pop-up media query (Omdat de datapopup in een iframe zit moet deze een eigen media query krijgen zodat de afmetingen kloppen) --*/


@media only screen and (min-width : 700px) {
    .datapopupbody #bodydiv #content {
        width: 90%;
        margin: 0 auto;
        max-height: 100%;
        overflow-y: visible;
        padding-bottom: 60px;
    }

    .datapopupbody #bodydiv #content input[type="submit"]  {
        width: auto;
    }

}

/* Large Devices, Large Desktops, Wide Screens */
@media only screen and (min-width : 1200px) {
    table {
        overflow-x: visible;
    }

    #grid {
        overflow-x: scroll;
    }

    #gbox_grid {
        width: 100% !important;
    }

    #bodydiv > div#container {
        padding: 350px 0 0;
    }

    #container > div#header {
        top: 270px;
    }

    #bodydiv > div#tree {
        max-height: 100vh;
        overflow: visible;
        box-shadow: none;
        border-bottom: none;
    }

    #tree ul#treeleft > li > a:not(:only-child)::after {
        content: "\f0da" !important;
        font: 10px/22px "FontAwesome";
        opacity: 1;
        position: absolute;
        right: 16px;
        top: 10px;
    }

    #tree ul#treeleft,
    #dgbtree1 {
        list-style: outside none none;
        margin: 0;
        padding: 0;
    }

    #tree ul#treeleft > li,
    #dgbtree1 li {
        line-height: 24px;
        position: relative;
    }

    #tree ul > li > a,
    #tree ul#treeleft > li > a,
    #dgbtree1 li  a {
        color: #000000;
        padding: 8px 8px 8px 0;
        text-indent: 30px;
        transition: all 0.3s ease 0s;
        width: 100%;
    }

    #tree ul > li > a,
    #tree ul#treeleft > li a,
    #dgbtree1 li  a {
        box-sizing: border-box;
        color: #626161;
        display: block;
        font-size: 14px;
        font-weight: 400;
        line-height: 22px;
        overflow: hidden;
        text-decoration: none;
        font-size: 14px;
    }

    #tree ul > li > ul > li,
    #tree ul#treeleft > li > ul > li {
        padding-left: 10px;
    }

    #tree ul#treeleft > li > ul > li a {
        text-indent: 0;
    }

    #tree ul > li > ul > li:hover,
    #tree ul#treeleft > li > ul > li:hover {
        padding-left: 25px;
        transition: 0.2s ease-in;
    }

    #tree ul#treeleft > li > ul > li a {
        box-sizing: border-box;
        color: #626161;
        display: block;
        font-size: 14px;
        line-height: 22px;
        overflow: hidden;
        padding: 8px 8px 8px 0;
        position: relative;
        text-decoration: none;
        width: 250px;
    }

    #tree ul > li > a:hover,
    #tree ul#treeleft > li:hover,
    #dgbtree1 li:hover  {
        background-color: #ffd7da;
        color: #626161;
        position: relative;
        z-index: 1;
        padding-left: 15px;
        transition: 0.2s ease-in;
    }
    #tree ul li:hover li:hover a,
    #tree ul#treeleft li:hover li:hover a {
        background-color: transparent;
        color: #ffd7da;
    }
    ul#treeleft li ul {
        list-style: outside none none;
        margin: 0;
        padding: 0;
    }
    ul#treeleft > li > ul {
        left: 100%;
        overflow: hidden;
        position: absolute;
        top: 0;
        width: 0;
    }

    ul#treeleft > li > ul > li {
        position: relative;
    }
    ul#treeleft > li > ul > li > ul {
        display: none;
    }

    ul#treeleft li:hover > ul::before {
        background: rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
        bottom: 0;
        content: "";
        display: block;
        position: fixed;
        top: 0;
        width: 260px;
    }

    ul#treeleft > li > ul::after {
        bottom: 0;
        content: "";
        display: block;
        opacity: 0;
        pointer-events: none;
        top: 0;
        transition: opacity 0.5s ease 0s;
        width: 100%;
        z-index: -1;
    }
    ul#treeleft > li > ul::before, ul#treeleft > li > ul {
        transition: width 0.2s ease 0s;
        width: 0;
    }

    ul#treeleft > li > ul::before, ul#treeleft > li:last-child > ul {
        margin-top: -112px;
    }

    ul#treeleft > li:hover ul, ul#treeleft:hover > ul::before {
        width: 250px;
    }

    ul#treeleft > li:hover > ul::after {
        opacity: 1;
    }
    #bodydiv.p_main_actionitems #container > div#header {
        top: 470px;
    }

     #container > div#content > *:not(.actionitem_tile) {
        margin: 0 auto;
        max-width: 1000px;
        width: 90%;
        color: #626161;
    }

    .action-item, .variant, .variantlittle {
        width: 23%;
        max-height: 350px;
        min-height: 350px;
    }

    .variant img {
        bottom: 20%;
    }

    .variantlittle .fa-stack {
        font-size: 3.5em;
        margin-top: 40%;
        width: 100%;
        opacity: 0.4;
    }

    #header > div#onderheader {
        width: 40%;
    }

    #header #search_site {
        width: 25%;
        float: left;
        position: relative;
    }

    #header > div#header_wagen {
        width: 20%;
    }

    #header > div#header_wagen a {
        font-size: 14px;
    }

    .image_beeldbankimage {
        width: 18%;
    }

    #voorraadtable {
        overflow: visible;
    }

    .scrolltable {
        overflow: visible;
    }

    .scrolltable #main-voorraad-table tr {
        border: none;
    }

    .scrolltable #main-voorraad-table tr td {
        border-top: 1px solid #dad8d8;
    }

    .scrolltable #main-voorraad-table tr td[colspan="3"] {
        font-size: 1.2em;
        border: none;
    }

    /*-- Vrije opmaak --*/

    #bodydiv.p_freedesign_design #container #content #freedesigncontainer {
        width: 90%;
        max-width: 90%;
        margin-left: 5%;
        background-color: #ffffff;
        border: 1px solid #dad8d8;
        float: left;
        margin-top: 15px;
    }

    #bodydiv.p_freedesign_design #container #content #sidebar,
    #bodydiv.p_freedesign_design #container #content #tools {
        border: none;
        width: 18% !important;
        padding-bottom: 30px;
    }

    #freedesigncontainer #drawing-area {
        width: 64% !important;
        margin: 0 !important;
        background-color: #eaeaea !important;
    }

    #freedesigncontainer #opslaanakties #opslaan  {
        float: left;
        padding: 0;
        width: 50% !important;
    }

    #freedesigncontainer #opslaanakties #opg_geg_ophalen {
        float: left;
        padding: 0;
        width: 50% !important;
    }

     #freedesigncontainer #opslaanakties {
        width: 64%;
        margin: 0;
    }

    /*-- Canvas Edit --*/

    #canvasform h2 {
        font-size: 16px;
        color: #626161;
    }

    #canvasform  select {
        margin-top: 15px;
        margin-bottom: 15px;
    }

    /*-- Login --*/

    body.loginpage #outer {
        background-color: #ffffff;
        width: 30%;
        left: 40%;
        border: 1px solid #dad8d8;
        padding: 15px;
        position: absolute;
        top: 40%;
        box-shadow: 0 1px 8px -5px #000000;
        text-align: center;
    }

    body.loginpage {
        background-size: cover;
        background-image: url(/images/application2017/loginBG.jpg);
    }

    body.loginpage #login #teksten {
        clear: both;
    }
}

#bodydiv-imagebeeldbank .td_footer a img {
    max-width: 16px;
}

#container img[src*="spinner.gif"] {
    width:20px !important;
    height:20px !important;
}
#container > div#footer {
	background-image: url("/data/footer_POWERED_BY_XM.png");
	background-position: center;
	background-size: initial;
	background-repeat: no-repeat;
}
#bodydiv > div#container {
 padding: 180px 0 0;
}
#container > div#header {
	top: 160px;
}
#container > div#content #introcontainer {
	padding: 31px;
}
ul#treeleft > li > ul::before,
ul#treeleft > li:last-child > ul {
	margin-top: 0px;
}
table td a[href^="/documents/"] img,
table td a[href^="/main/ordervariant/"] img {
  display: unset;
  opacity: 1;
}
#stappen{
  display:none;
}

#container > div#footer {
	background-image: url("/data/footer-POWERED-BY-XM2.png");
	background-position: center;
	background-size: initial;
	background-repeat: no-repeat;
}
#bodydiv > div#container {
 padding: 180px 0 0;
}
#container > div#header {
	top: 160px;
}
#container > div#content #introcontainer {
	padding: 31px;
}
ul#treeleft > li > ul::before,
ul#treeleft > li:last-child > ul {
	margin-top: 0px;
}
body.loginpage #topper {
	background-size: contain !important;
}
body.loginpage {
	background-image: none;
}
body.loginpage #outer {
	left: 0;
	right: 0;
	margin: auto;
}
#header_wagen a,
#inloggen a{
	color: #555454;
}
#bodydiv #logo {
	background: url(smb://dc-magneet/LITH02014/KLANTEN/MAGNEET/_HUISSTIJL/DOE-IETS-LEUKS/2020/XM AFBEELDINGEN/XM/XM LOGO LENTE.png) no-repeat scroll center 15px / 86% auto !important;
	height: 180px;
}
strong {
	font-weight: 700;
}
em {
	font-style: italic;
}
#bestellen_afbeelding {
	display: inline-block;
	width: 40%;
	margin-top: 2%;
}
#beschrijving.beschrijving-ov {
	display: inline-block;
	max-width: 50%;
}
#bodydiv-mainwinkelwagen #betaalwijzeparent, #verzendwijzecontent  {
	/*display: none;*/
}
p,label, textarea {
font-family: "raleway-v4020light",sans-serif;
}
p {
	font-size: 14px;
}
b {
	font-weight: bold;
}