/**
 * Main Site Css
 */

* { box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }

body { margin: 0; padding: 0px; background: #FFF; }
body, input, option, select, textarea { font-family: 'Open Sans'; font-size: 13px; }

/* Status Bar */
.develop { width: 100%; background: #993333; margin:0 0 0 0; text-align: center; padding: 10px 0; }

/* Head */
img.logo { float: left; margin: 20px; width: 150px; }
.stats { float: left; margin: 20px 10px 10px 100px; }
.stats table { border-collapse: collapse; }
.stats th,
.stats td { border: 1px solid #e5e5e5; padding: 5px; text-align: center; }

/* Form stuff */
input[type=text],
input[type=password],
textarea { border: 1px solid #CCC; padding: 8px; border-radius: 3px; }
input[type=text]:focus { border-color: #999; box-shadow: 0 0 2px #CCC; }

textarea.order-note { height: 140px; }

input[type=text].amount { width: 60px; }
input[type=text].price { width: 80px; }

form.login,
form.form-store { width: 300px; }

form div.field div.error { display: none; color: red; }
form div.error input { border: 1px solid red; }
form div.error div.error { display: inline-block; }

form div.field { float: left; width: 100%; margin-bottom: 10px; }
form div.field .radio { float: left; margin-right: 10px; }
form div.field label { display: block; font-weight: bold; padding: 0 0 2px; }
form div.field input[type=text],
form div.field input[type=password],
form div.field textarea { width: 100%; }

form div.field label.checkbox { display: inline-block; font-weight: normal; padding: 0; }

/* Knapp */
input[type=submit],
.btn { display: inline-block; white-space: nowrap; cursor: pointer; border: 0; padding: 8px 15px; font-size: 12px; background: #262626; color: #FFF; text-decoration: none; border-radius: 3px; text-transform: uppercase; font-weight: bold; }
.btn:hover { background: #000; }
.btn-r { float: right; }
.btn-delete { background: #CC0000; }
input[type=submit] { background: #33b726; }


/* Menu */
.menu { float: left; width: 100%; background: #0266b0; margin-bottom: 20px; }
.menu ul { list-style: none; margin: 0 20px; padding: 0; }
.menu li { float: left; }
.menu li a { float: left; padding: 15px 15px; height: 100%; color: #FFF; text-transform: uppercase; text-decoration: none; font-weight: bold; font-size: 12px; }
.menu li a:hover { background: #035da0; }
.menu li.active a { background: #09428f; }

.menu li.logout { float: right; }
.menu li.logout a { color: #FFF; font-weight: bold; text-align: center; height: 100%; }

/* Pagination */

ul.pagination { list-style: none; margin: 0; padding: 0; }
ul.pagination li { float: left; height: 36px; }
ul.pagination li a { float: left; padding: 0px 15px; line-height: 36px; height: 100%; color: #000; text-transform: uppercase; text-decoration: none; font-weight: 300; font-size: 12px; }
ul.pagination li a:hover { background: #ededed; }
ul.pagination li.active a { background: #999; }


/* Lista */
table.list { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
table.list th,
table.list td { text-align: left; border-bottom: 1px solid #CCC; padding: 5px 10px; border: 1px solid #e5e5e5; }
table.list th { font-weight: bold; text-transform: uppercase; color: #FFF; background: #0266b0; }
table.list th.head { padding-top: 40px; border: 0; font-size: 16px; color: #000; background: none;  }
table.list th span.disabled { color: #999; }
table.list tbody tr:nth-child(odd) td { background: #fafafa; }
table.list tr.disabled td,
table.list tr.disabled td a { color: #999; font-style: italic; }
table.list th.r,
table.list td.r { text-align: right; }
table.list th.c,
table.list td.c { text-align: center; }
table.list td a:hover span.icon-trash { color: #CC0000; }

table.list td.invoice-0 { color: red;}
table.list td.invoice-1 { color: green;}

table.list td a.btn { font-size: 11px; padding: 5px 10px; }

table.list-a { width: auto; }

/* Skylt */
table.list td.sign div { float: left; margin-right: 20px; }

table.list tr.product-category th { background: #000; }

/* Filter */
div.filter { padding: 10px; margin: 0 0 25px 0; background: #ededed; }
div.filter div.field { float: left; margin: 0 15px 0 0; width: auto; }
div.filter div.field label { display: block; }
div.filter div.field input[type="submit"] { margin-top: 22px; }

/* Box */
.box { float: left; width: 100%; margin-bottom: 30px; }
.box h2 { background: #0266b0; color: #FFF; margin: 0; padding: 10px; }
.box .box-content { float: left; width: 100%; padding: 20px; border: 1px solid #e5e5e5; }

.box .thumb { float: left; width: 160px; border: 1px solid #CCC; padding: 10px; margin: 0 10px 10px 0; }
.box .thumb img { max-width: 100%; }
.box .thumb textarea { width: 100%; }

.main-content { float: left; padding: 0 20px 40px; width: 100%; }


/* Flashes */
.flashes { float: left; width: 100%; margin: 0; padding: 20px; list-style: none; }
.flashes li { float: left; width: 100%; background: #33b726; color: #fff; padding: 10px; font-weight: bold; }
.flashes li.failure { background: #CC0000; }
.flashes li.success { background: #00CC00; }
