h1{
    float: left;
    font-size: 24px;
    color: #333;
}

h2{
    font-size: 18px;
}

p{

}

a{
    text-decoration: none;
    color: #4063a7;
}

a:hover{

}

div.spacer{
    float: left;
    width: 100%;
    height: 1px;
}

label input[type=checkbox]{
    float: left;
    height: 100%;
    margin-right: 10px;
}

label{
    float: left;
    width: 6%;
    padding: 5px 12px;
    margin: 0 10px 10px 0;
    font-weight: bold;
}

input[type=submit], .exbtn{
    float: left;
    padding: 5px 10px;
    border: 1px solid #4063a7;
    transition: all .2s ease;
    background-color: #fff;
    color: #4063a7;
    cursor: pointer;
    margin: 0 10px 10px 0;
}

input[type=submit]:hover, .exbtn:hover{
    color: #fff;
    background-color: #4063a7;
}

select{
    float: left;
    width: calc(14% + 22px);
    padding: 5px 10px;
    margin: 0 10px 10px 0;
    transition: all .2s ease;
    border: 1px solid #d0d0d0;
}

input[type=text], input[type=password]{
    float: left;
    width: 14%;
    padding: 5px 10px;
    margin: 0 10px 10px 0;
    transition: all .2s ease;
    border: 1px solid #d0d0d0;
}

input[type=text]:focus, select:focus{
    border: 1px solid #4063a7;
}

input[type=checkbox]{

}

textarea{

}

ul.tbl.half{
    width: 50%;
    clear: both;
}

ul.tbl{
    float: left;
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.tbl li{
    float: left;
    width: 100%;
    padding: 5px 0;
    border-bottom: 1px solid #d0d0d0;
    transition: all .2s ease;
}

ul.tbl li:not(:first-child):hover{
    background-color: #a6e3e9!important;
}

ul.tbl li span{
    float: left;
}

ul.tbl li:first-child{
    padding: 10px 0;
    border-top: 2px solid #333;
    border-bottom: 2px solid #333;
}

ul.tbl li:first-child span{
    float: left;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
}

ul.tbl li:nth-of-type(even){
    background-color: #cecece;
}

ul.tbl li:nth-of-type(odd){
    background-color: #fff;
}

.internid{
    width: 3%;
}

.ordernummer{
    width: 7%;
}

.klantnaam{
    width: 3%;
}

.orderdate{
    width: 5%;
}

.orderstatus{
    width: 5%;
}

.omzet{
    width: 3%;
}

.kostprijs{
    width: 3%;
}

.marge{
    width: 3%;
}

.artikelen{
    width: 30%;
}

.merken{
    width: 10%;
}

.leverancier{
    width: 5%;
}

.productaantal{
    width: 2%;
}

.land{
    width: 3%;
}

.verzenddatum{
    width: 15%;
}

.shipper{
    width: 3%;
    cursor: pointer;
}

.track{
    width: 5%;
}

.pstatus{
    float: right!important;
    width: 1%;
    height: 100%;
    text-align: right;
}

.afrekening{
    width: 4%;
}

.shipping{
    width: 4%;
}

.vat{
    width: 4%;
}

.netto{
    width: 4%;
}

.chk{
    width: 3%;
}

.options{
    width: 6%;
}

.brnd_options{
    width: 8%;
}

.options a, .deb_options a{
    float: left;
    margin-right: 10px;
}

.options a i, .deb_options a i, .shop_options a i{
    font-size: 24px;
    color: #000;
    transition: all .2s ease;
}

.options a:hover i, .deb_options a:hover i, .shop_options a:hover i{
    color: #4063a7;
}

.filters h2{
    cursor: pointer;
}

.splitter{
    width: 5%;
}

.artcode{
    width: 13%;
    position: relative;
}

.artid{
    width: 5%;
}

.artnaam{
    width: 38%;
}

.artnumber{
    width: 7%;
}

.prodstatus{
    width: 10%;
}

.prodsupplier{
    width: 10%;
}

.lineoptions{
    width: 10%;
}

.productname{
    padding: 0 15px;
    width: calc(25% - 30px);
}
.shipper {
    width: 5%
}
.productcode{
    width: 15%;
}

.levcode{
    width: 10%;
}

.ean{
    width: 10%;
}

.inkoop{
    width: 3%;
}

.stock{
    width: 3%;
}

.reserved{
    width: 3%;
}

.inbound{
    width: 3%;
}

.minsupply{
    width: 3%;
}

.moq{
    width: 3%;
}

.weight{
    width: 5%;
}

.volume{
    width: 3%;
}

.dimensions{
    width: 5%;
}

.brand{
    width: 10%;
}

.supplier{
    width: 10%;
}
.soldon{
    width: 20%;
}

.usr_id{
    width: 5%;
}

.usr_type{
    width: 10%;
}

.usr_username{
    width: 10%;
}

.usr_email, .usr_name{
    width: 15%;
}

.ink_id{
    width: 5%;
}

.brnd_id{
    width: 10%;
}

.brnd_name{
    width: 80%;
}

.sup_id{
    width: 3%;
}

.topx_klant, .topx_productcode, .topx_ean, .topx_productnaam, .topx_leverancier, .topx_merk, .topx_aantal, .topx_inkoop, .topx_inkoop_totaal, .topx_omzet_totaal, .topx_marge_totaal{
    width: 9%;
}

.sup_name, .sup_email, .sup_straat, .sup_nummer, .sup_toev, .sup_zip, .sup_plaats, .sup_land{
    width: 10%;
}

.zone_id{
    width: 3%;
}
.zone_name{
    width: 10%;
}
.zone_info{
    width: 20%;
}
.zone_option{
    width: 67%;
}


.ink_datum, .ink_voorgesteld, .ink_ingekocht, .ink_geleverd{
    width: 20%;
}

.inkoop_inkoop{
    width: 4%;
}

.inkoop_code, .inkoop_levcode, .inkoop_ean, .inkoop_inkoop_totaal{
    width: 8%;
}

.inkoop_product{
    width: 10%;
}

.inkoop_stock, .inkoop_reserved, .inkoop_suggested, .inkoop_moq{
    width: 3%;
    text-align: center;
}

.inkoop_teontvangen{
    width: 7%;
}

.inkoop_ingekocht, .inkoop_ontvangen, .inkoop_leverdatum, .inkoop_opmerking{
    width: 8%;
}

.bolitem, .oasitem, .activeprod{
    width: 3%;
}

.addnew{
    width: 2%;
    text-align: right;
}

.addnew i{
    cursor: pointer;
    transition: all .2s ease;
}

.addnew i:hover{
    color: #4063a7;
}

.btn{
    float: left;
    padding: 5px 10px;
    background-color: #fff;
    color: #4063a7;
    border: 1px solid #4063a7;
    transition: all .2s ease;
    cursor: pointer;
}

.btn:hover{
    color: #fff;
    background-color: #4063a7;
}

.tbl li.last{
    background-color: #fff!important;
    border-top: 2px solid #333;
    border-bottom: none;
}

span.value{
    float: left;
    width: 40%;
    padding: 5px 12px;
    margin: 0 10px 10px 0;
    border-bottom: 1px solid #fff;
}

span.value:after{
    content: " ";
    white-space: pre;
}
.autof {
    float: left;
    width: calc(14% + 22px);
    position: relative;
    margin: 0px 10px 0px 0px;
}
.autof input[type="text"] {
    width: calc(100% - 22px);
}
.autoresults{
    position: absolute;
    top: 100%;
    left: 0;
    padding: 15px;
    background-color: #fff;
    z-index: 15;
    min-width: 350px;
    -webkit-box-shadow: 5px 5px 5px 0px rgba(87,87,87,0.29);
    -moz-box-shadow: 5px 5px 5px 0px rgba(87,87,87,0.29);
    box-shadow: 5px 5px 5px 0px rgba(87,87,87,0.29);
    border: 1px solid #d0d0d0;
}

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

.autoresults ul li{
    cursor: pointer;
    transition: all .2s ease;
}

.autoresults ul li:hover{
    background-color: #a2bbea;
}

.autoresults ul li:first-child{
    padding: 5px 0;
    border-bottom: 1px solid #d0d0d0;
}

.orderdetails input[name=delivery_straat], .orderdetails input[name=invoice_straat]{
    width: calc(30% - 32px);
}

.orderdetails input[name=delivery_housenumber], .orderdetails input[name=invoice_housenumber]{
    width: calc(10% - 22px);
}

.orderdetails input[name=delivery_zip], .orderdetails input[name=invoice_zip]{
    width: calc(15% - 32px);
}

.orderdetails input[name=delivery_city], .orderdetails input[name=invoice_city]{
    width: calc(25% - 22px);
}

.shop_name{
    width: 10%;
}

.shop_uses{
    width: 5%;
}

.shop_token{
    width: 10%;
}

.shop_active{
    width: 5%;
}

.shop_options{
    width: 10%;
}

.bo_productname{
    width: 25%;
}

.bo_aantal{
    width: 10%;
}

.bo_orders{
    width: 10%;
}

.bo_date{
    width: 10%;
}

.bo_inkoop{
    width: 10%;
}

.bo_leverdatum{
    width: 10%;
}
