* { box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; }

body { padding: 20px; }
body, td, th, option, select, input, textarea { font-family: Tahoma; font-size: 12px; }

input[type=text],
input[type=password],
textarea { border: 1px solid #CCC; width: 300px; padding: 5px; }
input[type=text].amount { width: 50px; }
input[type=text].price, input[type=text].cost { width: 100px; }
textarea { height: 100px; width: 400px; }
textarea.img_desc { height: 50px; width: 100%; }
input[type=submit] { padding: 5px 10px; background: #19B400; border: 1px solid #138B00; color: #FFF; font-weight: bold; }

a.btn { float: left; background: #ff9933; color: #FFF; padding: 6px 10px; font-weight: bold; text-decoration: none; border: 1px solid #e58500; }

a img { border: 0; }

/* LOGO */
.logo { float: left; }
.logo-foot { float: left; width: 100%; border-top: 1px solid #CCC; margin-top: 40px; padding-top: 20px; }


/* LOGO */
.user_login { float: right; }

/* Statistik */
.stats { float: left; margin: 0px 0 0 100px; border: 1px solid #CCC; padding: 5px; }

/* Menu */
div.menu { float: left; width: 100%; margin: 20px 0 30px; }
div.menu ul { float: left; list-style: none; margin: 0; padding: 0; }
div.menu ul li { float: left; margin: 0 5px 0 0; }
div.menu ul li a { float: left; border: 1px solid #CCC; background: #f7f7f7; color: #000; text-decoration: none; padding: 6px 10px; }
div.menu ul li a:hover { background: #e5e5e5; }


/* Meddelande */
div.flash { float: left; clear: left; margin: 20px 0 0; border: 1px solid #DDD; padding: 10px; }
div.flash .ok { color: #108a00; }
div.flash .error { color: #8a0000; }

/* form */
label { display: block; font-weight: bold; padding: 10px 0 3px; }


/* Standard lista */
table.list { border-collapse: collapse; }
table.list th, table.list td { padding: 5px 20px 5px 5px; border-bottom: 1px solid #CCC; } 
table.list th a { color: #000; }
table.list td { border-color: #f2f2f2;}
table.list tr.done td { background: #f2f2f2; }
table.list tr:hover td { background: #f7f7f7; }
table.list .btn { background: #262626; border-color: #000; padding: 3px 7px; }

table.list td.r, table.list th.r { text-align: right; }

table.list th.b-left, table.list td.b-left { border-left: 1px solid #CCC; }

th { text-align: left; }


/* Filter */
.filter { float: left; width: 100%; padding: 10px; border: 1px solid #CCC; background: #f7f7f7; margin-bottom: 20px; }


/* Station */
.station td { vertical-align: top; }


/* Bokning */
.booking ul.stations { float: left; list-style: none; padding: 0; margin: 0; }
.booking ul.stations li { float: left; clear: both; margin-bottom: 5px; width: 200px; }
.booking ul.stations li a { float: left; background: #f7f7f7; width: 100%; padding: 5px; color: #000; border: 1px solid #CCC; text-decoration: none; }
.booking .body table { border-collapse: collapse; }
.booking .body table td { padding: 2px 10px 2px 0; }
.booking .block { float: left; width: 100%; padding: 20px; border: 1px solid #CCC; background: #f7f7f7; margin-bottom: 20px; }

.booking .block .data-fields { float: left; border: 1px solid #CCC; padding: 10px; background: #FFF; margin: 0 10px 10px 0; }
.booking .block .data-fields.hide { display: none; }
.booking .block .data-fields h3 { margin: 0; }

.booking .block .images { float: left; width: 100%; padding-top: 20px; }
.booking .block .image { float: left; width: 200px; margin: 0 20px 20px 0; }
.booking .block .image .thumb { float: left; width: 100%; margin-bottom: 10px; }
.booking .block .image .thumb img { float: left; width: 100%; }
.booking .block .image label { display: inline; font-weight: normal; }

/* Lagersaldo */
.stock .body table { border-collapse: collapse; }
.stock .body td, .stock .body th { border: 1px solid #CCC; padding: 5px; }
.stock .body .filter td, .stock .body .filter th { border: 0; }
.stock .body th { border-color: #000; background: #000; color: #FFF; text-align: left; border-bottom: 1px solid #CCC; }
.stock .body td { text-align: center; }
.stock .body .used th { background: #888888; border-color: #CCC; }
.stock .body .used td { background: #888888; color: #FFF; font-weight: bold; }
.stock .body .delivered th { background: #888888; border-color: #CCC; font-weight: bold; }
.stock .body .delivered td { font-weight: bold; }
.stock .body .sum th, .stock .body .sum td { background: #444444; border-color: #444444; color: #FFF; font-weight: bold; }


/* Spill */
.spill .body td { text-align: left; }

div.menu-foot { display: none; }


/* Erbjudande */
.offer label { font-weight: normal; padding: 0; }

/* Mobil-version */
@media only screen and (max-width: 500px) {
	body { padding: 5px; }
	.logo { float: left; width: 40%; }
	.logo img { width: 100%; }

	.user_login { display: none; }

	.stats { float: right; margin: 0; }
	.stats table.list th,
	.stats table.list td { padding: 5px; }

	.booking .block { padding: 5px; }

	.menu { display: none; }
	div.menu-foot { display: block; margin-top: 50px; }
	div.menu-foot ul li { float: left; width: 100%; margin-bottom: 3px; }
	div.menu-foot ul li a { width: 100%; }

	input[type="text"], input[type="password"], textarea { width: 100%; }
}