@font-face {
    font-family: utsfont;
    src: url(/media/nb_akademie_std_regular-webfont.woff);
}

body{
    font-family: utsfont;
    margin: 0px;
}

a{
    color: #000;
    text-decoration: none;
}

#container{
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

#header{
    height: 95px;
    
}

#header a{
    text-decoration: none;
}

#header a:visited  {
    text-decoration: none;
}

#header-left{
    float: left;
}

#title{
    line-height: 50px;
    padding-left: 10px;
    font-size: 15pt;
}

#header-right{
    float: right;
    line-height: 50px;
}

#search{
    float: left;
}

#search-button{
    width: 20px;
    padding-top: 2.5px;
    padding-left: 10px;
}

#nav > ul{
    margin: 0px;
}

.nav-item{
    float: left;
    padding: 0px 20px 0px 20px;
    list-style: none;
}

#lower-header{
    z-index: 1;
}

#lower-header .nav-item{
    height: 45px;
    padding: 0px 30px 0px 30px;
    display: inline-block;
    float: none;
    color: #FFF;
    overflow: hidden;
    vertical-align: top;
}

#lower-header li.nav-item:hover::after{
    /*background: #FFF;
    background-image: url('../media/arrow-up-white.png');*/
    content : "\25B2";
    display: block;
    position: relative;
    top: -23px;
    text-align: center;
}

#lower-header li.nav-item.selected::after {
    content : "\25B2";
    display: block;
    position: relative;
    top: -23px;
    text-align: center;
}

#lower-header div.dropdown {
    display: inline-block;
    vertical-align: top;
}

#lower-header div.dropdown-links {
    display: none;
    background-color: #FFF;
    border-left: 1px solid #666;
    border-bottom: 1px solid #666;
    border-right: 1px solid #666;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    margin: 0px;
    padding-top: 10px;  
}

#lower-header div.dropdown-links a{
    display: block;
    height: 30px;
    line-height: 30px;
}

#lower-header div.dropdown-links a:hover{
    text-decoration: underline;
}

#lower-header div.dropdown:hover div.dropdown-links {
    display: block;
    position: relative;
}

.nav-item > form{
    padding-top: 12px;

}

input#search{
    width: 200px;
    padding: 5px;
    border: 1px solid #666;
    border-radius: 5px; 
}

#lower-header{
    height: 45px;
    line-height: 45px;
    width: 100%;
    display: inline-block;
    background-color: #000;
    border-top: 1px solid #FFF;
    color: #FFF;
    text-align: center;
}

#lower-header > ul{
    margin: 0px;
    padding: 0px;
}

#content{
    width: 1000px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
}

#content > .title{
    float: none;
    font-size: 20pt;
    text-decoration: underline;
    padding: 20px;
}

#footer{
    display: inline-block;
    height: 0px;
    width: 100%;
    margin-top: 10px;
    background-color: #000;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

#product{
    padding: 20px;
}

#product > #top {
    border-bottom: 1px solid #CCC;
    height: 320px;
}

#product > #top > .images{
    width: 300px;
    height: 300px;
    float: left;
    background-color: #F00;
}

#product > #top > .images img{
    min-width: 100%;
    min-height: 100%;
    max-width: 100%;
    max-height: 100%;
}

#product-info{
    float: left;
    padding-left: 20px;
}

#product-heading > #product-title{
    font-size: 20pt;
    padding-bottom: 5px;
}

#product-heading > #product-sku{
    font-size: 8pt; 
    color: #999;
}

#product-price {
    width: 200px;
    padding-top: 20px;
    font-size: 18pt;
    font-weight: 500;
}

#product .no-stock{
    display: inline-block;
    width: 100%;
    text-align: center;
    padding-top: 10px;
}

#product .sale-price{
    color: #F00;
}

#product .old-price{
    text-decoration: line-through;
    padding-left: 10px;
}

#cart-options{
    padding-top: 10px;
    width: 200px;
}

#quantity{
    height: 50px;
}

#quantity > span{
    font-size: 10pt;
    color: #999;
}

#quantity > ul {
    margin-top: 10px;
    padding: 0px;
    text-align: center;
}

#quantity > ul > li{
    list-style: none;
    float: left;
    width: 33%;
}

#quantity-field{
    padding: 5px;
    width: 50px;
}

#add-cart{
    padding: 5px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 50px;
}

#add-cart > button {
    width: 100px;

    border-radius: 2px;
    padding: 5px 10px 5px 10px;
}

.cart-item{
    height: 100px;
    width: calc(100% - 20px);
    margin: 10px;
}

.cart-item > .image{
    height: 80px;
    width: 80px;
    float: left;
    background-color: #F00;
}

.cart-item img {
    min-width: 100%;
    min-height: 100%;
    max-width: 100%;
    max-height: 100%;
}

.cart-item > .content {
    float: left;
    height: 80px;
    width: calc(100% - 100px);
    margin-left: 15px;
    display: flex;
    align-items: center;
}

.cart-item .description {
    float: left;
    width: calc(100% - 155px);
}

.cart-item .name {
    font-size: 16pt;
    padding-bottom: 5px;
}

.cart-item .sku {
    font-size: 8pt;
    color: #666;
}

.cart-item .price {
    float: left;
    width: 80px;
    font-size: 14pt;
}

.cart-item .quantity {
    float: left;
    width: 100px;
}

.cart-item form {
    margin: 0px;
    height: 40px;
    display: flex;
    align-items: center;
}

.cart-item input[type=text]{
    width: 30px;
    padding: 5px;
    border-radius: 3px;
    border: 1px solid #AAA;
    text-align: center;
}


.cart-item input[type=image]{
    width: 20px;
    height: 20px;
    padding-left: 20px;
}

.cart-item .total-price {
    font-size: 14pt;
    width: 80px;
    text-align: right;
}

#cart-totals{
    width: 200px;
    float: right;
}

#cart-totals > .total {
    padding: 5px;
    color: #666;
}

#cart-totals span {
    float: right;
    color: #000;
    font-size: 14pt;
}

.empty-cart{
    padding: 20px;
    text-align: center;
}

.checkout{
    text-align: center;
    padding: 30px;
}

.checkout > form {
    margin-bottom: 0px;
}

.checkout button {
    width: 100%;
    height: 5%;
    border-radius: 4px;
    font-size: 12pt;
    outline: none;
}

.checkout button:hover{
    background-color: #EEE;
}

.checkout button:active{
    box-shadow: 0 1px 5px rgba(0,0,0,0.12);
    background-color: #DDD;
}

.payment .type {
    padding: 10px;
    border: 1px solid #CCC;
    border-radius: 4px;
    margin: 10px;
    vertical-align: middle;
}

.payment .creditcard{
    padding: 15px;
    display: none;
}

.payment .cctypes {
    height: 20px;
}

.payment .creditcard div{
    padding: 5px;
}

.payment .creditcard span {
    color: #666;
    display: inline-block;
    width: 100px;
}

.payment .creditcard span.cvv {
    width: 50px;
    margin-left: 50px;
}

.payment .creditcard input {
    padding: 5px;
    border: 1px solid #CCC;
    border-radius: 2px;
}

.payment .finalise{
    float: right;
    padding: 30px;
}

.payment .finalise button {
    width: 100%;
    height: 5%;
    border-radius: 4px;
    font-size: 12pt;
    outline: none;
}

.payment .finalise button:hover{
    background-color: #EEE;
}

.payment .finalise button:active{
    box-shadow: 0 1px 5px rgba(0,0,0,0.12);
    background-color: #DDD;
}

input.cardname {
    width: 200px;
}

input.cardnum {
    width: 200px;
}

input.exp {
    width: 50px;
}

input.cvv {
    width: 50px;
}


table{
    width: 100%;
    border: 1px solid #666;
    border-radius: 4px;
    font-weight: normal;
    padding: 5px;
}

td{
    border: none;
}

#search-content{
    width: 1000px;
    overflow: auto;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.search-result{
    width: 280px;
    display: inline-block;
    margin: 10px;
    padding: 10px;
    border: 1px solid #666;
    border-radius: 5px;
}

.search-result > .image{
    width: 100%;
    height: 280px;
    margin-left: auto;
    margin-right: auto;
    background-color: #F00;
}

.search-result > .description{
    padding-top: 10px;
    text-align: left;
}

.search-result .name{
    font-size: 14pt;
}

.search-result .sku{
    font-size: 8pt;
    color: #666;
}

.search-result .price {
    text-align: center;
    font-size: 18pt;

}

.no-search-result{
    margin: 30px;
}

.no-search-result > span{
    display: block;
    margin-top: 10px;
}

.no-search-result > .quote::before, .no-search-result > .quote::after{
    content:"'";
    padding-right: 5px;
    font-size: 16pt;
    font-style: italic;
    color: #666;
}

.admin-header{
    overflow: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.title{
    float: left;
}
/*
ADMIN PAGES
*/

.admin-add{
    padding: 10px;
    border: 1px solid #666;
    border-radius: 4px;
}

.admin-add:hover{
    background-color: #EEE;
}

.admin-add:active{
    box-shadow: 0 1px 5px rgba(0,0,0,0.12);
    background-color: #DDD;
}

.admin-heading{
    border: none;
    color: #666;
    font-size: 10pt;
    text-align: left;
    margin-top: 20px;
}

table.admin {
    padding: 0px;
    border-spacing: 0px;
}

table.admin td {
    border-top: 1px solid #CCC;
    padding: 10px;
}

/* Remove border from top of list*/
table.admin tr:first-of-type > td {
    border-top: none;
}

table.admin span.category {
    font-size: 10pt;
    background-color: #666;
    color: #FFF;
    border-radius: 2px;
    margin-right: 5px;
    padding: 3px;
}

table.admin span.category:hover {
    background-color: #333;
}


/* 
ADMIN ORDER LIST PAGE
*/

.admin-orders .col1, .admin-orders-heading .col1{ width: 8%;}
.admin-orders .col2, .admin-orders-heading .col2{ width: 12%;}
.admin-orders .col3, .admin-orders-heading .col3{ width: 15%;}
.admin-orders .col4, .admin-orders-heading .col4{ width: 12%;}
.admin-orders .col5, .admin-orders-heading .col5{ width: 10%;}
.admin-orders .col6, .admin-orders-heading .col6{ width: 8%;}
.admin-orders .col7, .admin-orders-heading .col7{ width: 35%;}

.admin-orders-heading{
    border: none;
    color: #666;
    font-size: 10pt;
    text-align: left;
    margin-top: 20px;
}

.admin-orders-heading .ASC:after{
    content: "↑";
}

.admin-orders-heading .DESC:after{
    content: "↓";
}

.admin-orders-heading a {
    color: #666;
}

.admin-orders {
    padding: 0px;
    border-spacing: 0px;
}

.admin-orders td {
    border-top: 1px solid #CCC;
    padding: 10px;
}

.admin-orders span.status{
    color: #FFF;
    font-size: 10pt;
    padding: 4px;
    border-radius: 3px;
    margin: 5px;
}

.admin-orders span.status.waiting_payment{
    background-color: rgb(250, 37, 37, 0.95);
}

.admin-orders span.status.processing{
    background-color: rgb(255, 166, 0, 0.95);
}

.admin-orders span.status.picked{
    background-color: rgb(26, 82, 238);
}

.admin-orders span.status.completed{
    background-color: rgb(15, 167, 15, 0.95);
}

/* Remove border from top of list*/ 
.admin-orders tr:first-of-type > td {
    border-top: none;
}

.admin-orders span.category {   
    font-size: 10pt;
    background-color: #666;
    color: #FFF;
    border-radius: 2px;
    margin-right: 5px;
    padding: 3px;
}

.admin-orders span.category:hover {
    background-color: #333;
}

.admin-orders span.action {
    font-size: 10pt;
    padding: 3px 5px 3px 5px;
    border: 1px solid #666;
    border-radius: 4px;
}

.admin-orders span.action:hover {
    background-color: rgb(153, 153, 153, 0.2);
    border: 1px solid #333;
    border-radius: 4px;
    box-shadow: 0 1px 5px rgba(0,0,0,0.12);
}

.order-action{
    margin: 0px;
    display: inline-block;
}

.admin-orders button.action {
    display: inline-block;
    font-size: 10pt;
    padding: 3px 5px 3px 5px;
    border: 1px solid #666;
    border-radius: 4px;
}

.admin-orders button.action:hover {
    background-color: rgb(153, 153, 153, 0.2);
    border: 1px solid #333;
    border-radius: 4px;
    box-shadow: 0 1px 5px rgba(0,0,0,0.12);
}

td.currency, td.num{
    text-align: right;
}

/* 
ADMIN PRODUCT LIST PAGE
*/

.add-product{
    padding: 10px;
    border: 1px solid #666;
    border-radius: 4px;
}

.add-product:hover{
    background-color: #EEE;
}

.add-product:active{
    box-shadow: 0 1px 5px rgba(0,0,0,0.12);
    background-color: #DDD;
}

.list-menu{
    display: table-cell;
    box-shadow: 0 1px 5px rgba(0,0,0,0.12);
    margin-bottom: 10px;
    padding: 0px;
    border-spacing: 0px;
}

.list-menu td > a {
    padding: 5px;
    display: block;
}

.list-menu td {
    border-left: 1px solid #AAA;
}

.list-menu td:first-of-type{
    border-left: none;
}

.list-menu td:hover{
    background-color: #DDD;
}

.list-menu td:first-of-type:hover {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.list-menu td:last-of-type {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.list-menu td.selected {
    background-color: #AAA;
}

.list-menu td.selected:first-of-type {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.list-menu td.selected:last-of-type {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}


.admin-products .col1, .admin-products-heading .col1{ width: 10%;}/* SKU */
.admin-products .col2, .admin-products-heading .col2{ width: 30%;}/* NAME */
.admin-products .col3, .admin-products-heading .col3{ width: 20%;}/* CATEGORIES */
.admin-products .col4, .admin-products-heading .col4{ width: 10%;}/* PRICE */
.admin-products .col5, .admin-products-heading .col5{ width: 8%;}/* ON SALE */
.admin-products .col6, .admin-products-heading .col6{ width: 8%;}/* FEATURED */
.admin-products .col7, .admin-products-heading .col7{ width: 8%;}/* STOCK */
.admin-products .col8, .admin-products-heading .col8{ width: 6%;}/* ACTION */



.admin-products-heading{
    border: none;
    color: #666;
    font-size: 10pt;
    text-align: left;
    margin-top: 20px;
}

.admin-products-heading .ASC:after{
    color: #666;
    content: "↑";
}

.admin-products-heading .DESC:after{
    color: #666;
    content: "↓";
}

.admin-products-heading a {
    color: #666;
}

.admin-products {
    padding: 0px;
    border-spacing: 0px;
}

.admin-products td {
    border-top: 1px solid #CCC;
    padding: 10px;
}

/* Remove border from top of list*/
.admin-products tr:first-of-type > td {
    border-top: none;
}

.admin-products span.category {
    font-size: 10pt;
    background-color: #666;
    color: #FFF;
    border-radius: 2px;
    margin-right: 5px;
    padding: 3px;
}

.admin-products span.category:hover {
    background-color: #333;
}

td.currency, td.num{
    text-align: center;
}

.admin-products span.action {
    font-size: 10pt;
    padding: 3px 5px 3px 5px;
    border: 1px solid #666;
    border-radius: 4px;
}

.admin-products span.action:hover {
    background-color: rgb(153, 153, 153, 0.2);
    border: 1px solid #333;
    border-radius: 4px;
    box-shadow: 0 1px 5px rgba(0,0,0,0.12);
}

/*
ADD NEW PRODUCT PAGE
*/

.new-product input {
    padding: 5px;
    border: 1px solid #CCC;
    border-radius: 4px;
    font-size: 12pt;
    outline: none;
}

.new-product > form > div {
    padding: 10px;
}

.new-product .field-name {
    display: block;
    font-size: 10pt;
    padding-bottom: 5px;
    color: #666;
}

.new-product .currency-field{
    display: inline-block;
    border: 1px solid #CCC;
    color: #666;
    border-radius: 4px;
    font-size: 12pt;
    padding-left: 5px;
}

.new-product .currency-field > input {
    padding: 5px;
    border: none;
    border-radius: none;
}

.new-product .note {
    padding-left: 5px;
    font-size: 10pt;
    color: #666;
}

.new-product div.category {
    font-size: 10pt;
    background-color: #666;
    color: #FFF;
    border-radius: 2px;
    margin-left: 5px;
    padding: 5px;
    display: inline-block;
}

.new-product div.category:first-of-type{
    margin-left: 0px;
}

.category-name{
    display: flex;
}

.new-product div.category img{
    width: 16px;
    height: 16px;
    padding-left: 5px;   
}

#categories-list{
    margin-top: 10px;
    padding: 10px;
    display: inline-block;
    border: 1px solid #BBB;
    border-radius: 4px;
    background-color: #DDD;
    font-size: 10pt;
    color: #333;
}

textarea.description{
    border: 1px solid #CCC;
    border-radius: 4px;
    width: 500px;
    height: 200px;   
}

.sku-field{width: 100px;}
.name-field{width: 300px;}
.price-field{width: 100px;}
.stock-field{width: 80px;}

input.images{
    font-size: 10pt;
    color: #333;
    border: 1px solid #BBB;
    background-color: #DDD;
}

.url-field{ width: 500px;}

.submit-form{
    padding: 10px;
    border: 1px solid #CCC;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
    border-radius: 3px;
    font-size: 10   pt;
}

.submit-form:hover{
    background-color: #EEE;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

.product-card{
    width: 280px;
    display: inline-block;
    margin: 10px;
    padding: 10px;
    border: 1px solid #666;
    border-radius: 5px;
}

.product-card > .image{
    width: 100%;
    height: 280px;
    margin-left: auto;
    margin-right: auto;
    background-color: #F00;
}

.product-card img {
    min-width: 100%;
    min-height: 100%;
    max-width: 100%;
    max-height: 100%;
}

.product-card > .description{
    padding-top: 10px;
    text-align: left;
}

.product-card .name{
    font-size: 14pt;
}

.product-card .sku{
    font-size: 8pt;
    color: #666;
}

.product-card .price {
    text-align: center;
    font-size: 18pt;
}

.product-card .old-price {
    text-decoration: line-through;
    padding-left: 10px;
}

.product-card .sale-price{
    color: #F00;
}

.order{
    padding: 10px;
    margin-top: 20px;
}

.order div {
    float: none;
}

.order .title{
    font-size: 18pt;
    margin-bottom: 10px;
}

.order .date{
    margin-bottom: 10px;
}

.order .status{
    margin-bottom: 10px;
}

.order .status > span{
    color: #FFF;
    font-size: 10pt;
    padding: 4px;
    border-radius: 3px;
    margin: 5px;
}

.order .status > span.waiting_payment{
    background-color: #F00;
}

.order .status > span.processing{
    background-color: rgb(255, 166, 0);
}

.order .status > span.picked{
    background-color: rgb(26, 82, 238);
}

.order .status > span.completed{
    background-color: rgb(13, 175, 13);
}

.order .status > span.last_updated{
    color: #000;
}

.order .payment{
    margin-bottom: 10px;
}

.order .payment span{
    font-weight: bold;
}

.order .shipping{
    margin-bottom: 10px;
}

.order .shipping .title {
    font-size: 12pt;
    display: inline-block; 
    vertical-align: top;
}

.order .shipping .holder {
    margin-left: 10px;
    display: inline-block;
}

.order .shipping .holder span {
    display: block;
    font-size: 10pt;
    margin-bottom: 5px;
}

.order .shipping .holder span.type{
    font-size: 12pt;
    font-weight: bold;
}

.order .shipping .holder span.address{
    font-weight: bold;
}

.order hr {
    border: 0.5px solid #666;
}

.order-item{
    height: 100px;
    width: calc(100% - 20px);
    margin: 10px;
}

.order-item > .image{
    height: 80px;
    width: 80px;
    float: left;
    background-color: #F00;
}

.order-item img {
    min-width: 100%;
    min-height: 100%;
    max-width: 100%;
    max-height: 100%;
}

.order-item > .content {
    float: left;
    height: 80px;
    width: calc(100% - 100px);
    margin-left: 15px;
    display: flex;
    align-items: center;
}

.order-item .description {
    float: left;
    width: calc(100% - 155px);
}

.order-item .name {
    font-size: 16pt;
    padding-bottom: 5px;
}

.order-item .sku {
    font-size: 8pt;
    color: #666;
}

.order-item .price {
    float: left;
    width: 80px;
    font-size: 14pt;
}

.order-item .quantity {
    float: left;
    width: 100px;
    font-size: 14pt;
}

.order-item .total-price {
    font-size: 14pt;
    width: 80px;
    text-align: right;
}

.order-totals{
    width: 200px;
    float: right !important;
}

.order-totals > .total {
    padding: 5px;
    color: #666;
}

.order-totals span {
    float: right;
    color: #000;
    font-size: 14pt;
}

.pick-order .title{
    float: none;
    font-size: 16pt;
    font-weight: bold;
}

table.picked th{
    text-align: left;
}

table.not-picked th{
    text-align: left;
}

table.not-picked button {
    padding: 5px;
    border: 1px solid #666;
    border-radius: 3px;
}

table.not-picked td.product-barcode{
    display: none;
}

.pick-float{
    display: none;
    position: fixed;
    top: 30%;
    left: 50%;
    width: 600px;
    height: 300px;
    margin-top: -150px;
    margin-left: -300px;
    background-color: #DDD;
    border: 1px solid #666;
    border-radius: 5px;
    text-align: center;
}

.pick-float div{
    padding: 20px;
}

.pick-float .heading{
    font-size: 16pt;
    font-weight: bold;
}

.pick-float .quantity{
    font-size: 16pt;
    font-weight: bold;
}

.pick-float input{
    font-size: 16pt;
    text-align: center;
    padding: 10px;
    border: 1px solid #666;
    border-radius: 5px;
}

.pick-float button{
    padding: 10px;
    border: 1px solid #666;
    border-radius: 3px;
}

.pick-float button:active{
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

#pick-order-form{
    margin-bottom: 0px;
}

.all-picked{
    margin: 10px;
    text-align: center;
}

.empty-category{
    padding: 50px;
    text-align: center;
}

.add-category{
    float: none;

}

.add-category input {
    margin-left: 10px;
    padding: 5px;
    border: 1px solid #CCC;
    border-radius: 4px;
    font-size: 12pt;
    outline: none;
}

.login{
    padding-top: 200px;
    width: 50%;
    margin: auto;
    text-align: center;
}

.login .heading {
    font-size: 18pt;
    margin-bottom: 30px;
}

.login .input-heading {
    display: inline-block;
    width: 100px;
}

.login .input{
    padding: 5px;
}

.login .input input{
    width: 200px;
    border: 1px solid #CCC;
    border-radius: 3px;
    padding: 5px;
}

.customer-orders .col1, .customer-orders-heading .col1{ width: 8%;}
.customer-orders .col2, .customer-orders-heading .col2{ width: 12%;}
.customer-orders .col3, .customer-orders-heading .col3{ width: 15%;}
.customer-orders .col4, .customer-orders-heading .col4{ width: 12%;}
.customer-orders .col5, .customer-orders-heading .col5{ width: 10%;}
.customer-orders .col6, .customer-orders-heading .col6{ width: 8%;}
.customer-orders .col7, .customer-orders-heading .col7{ width: 35%;}

.customer-orders-heading{
    border: none;
    color: #666;
    font-size: 10pt;
    text-align: left;
    margin-top: 20px;
}

.customer-orders-heading .ASC:after{
    content: "↑";
}

.customer-orders-heading .DESC:after{
    content: "↓";
}

.customer-orders-heading a {
    color: #666;
}

.customer-orders {
    padding: 0px;
    border-spacing: 0px;
}

.customer-orders td {
    border-top: 1px solid #CCC;
    padding: 10px;
}

.customer-orders span.status{
    color: #FFF;
    font-size: 10pt;
    padding: 4px;
    border-radius: 3px;
    margin: 5px;
}

.customer-orders span.status.waiting_payment{
    background-color: rgb(250, 37, 37, 0.95);
}

.customer-orders span.status.processing{
    background-color: rgb(255, 166, 0, 0.95);
}

.customer-orders span.status.picked{
    background-color: rgb(26, 82, 238);
}

.customer-orders span.status.completed{
    background-color: rgb(15, 167, 15, 0.95);
}

/* Remove border from top of list*/ 
.customer-orders tr:first-of-type > td {
    border-top: none;
}

.customer-orders span.category {   
    font-size: 10pt;
    background-color: #666;
    color: #FFF;
    border-radius: 2px;
    margin-right: 5px;
    padding: 3px;
}

.customer-orders span.category:hover {
    background-color: #333;
}

.customer-orders span.action {
    font-size: 10pt;
    padding: 3px 5px 3px 5px;
    border: 1px solid #666;
    border-radius: 4px;
}

.customer-orders span.action:hover {
    background-color: rgb(153, 153, 153, 0.2);
    border: 1px solid #333;
    border-radius: 4px;
    box-shadow: 0 1px 5px rgba(0,0,0,0.12);
}

.order-action{
    margin: 0px;
    display: inline-block;
}

.customer-orders button.action {
    display: inline-block;
    font-size: 10pt;
    padding: 3px 5px 3px 5px;
    border: 1px solid #666;
    border-radius: 4px;
}

.customer-orders button.action:hover {
    background-color: rgb(153, 153, 153, 0.2);
    border: 1px solid #333;
    border-radius: 4px;
    box-shadow: 0 1px 5px rgba(0,0,0,0.12);
}

td.currency, td.num{
    text-align: right;
}

.account-dropdown{
    float: left;
    display: inline-block;
    overflow: visible;
}

.account-dropdown .dropdown-links{
    width: 5%;
    display: none;
    background-color: #FFF;
    border-left: 1px solid #666;
    border-bottom: 1px solid #666;
    border-right: 1px solid #666;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    margin: 0px;
    padding-top: 10px; 
    top: 40px;
    position: absolute;
}

.account-dropdown .dropdown-links > a{
    text-align: center;
    display: block;
    line-height: 30px;
    color: #000;
}

.account-dropdown:hover .dropdown-links{
    display: block;
}

.account-dropdown .dropdown-links  a:hover{
    text-decoration: line-through;
}