/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;  
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

.main-wrapper {
	margin:0 auto;
}
.main-container {
	padding:15px;
}



a {
	text-decoration: none;
}
body {
	background-color:#fff;
	font-family:arial, sans-serif;
}

.ta-c {
	text-align:center;
}

header {
	width:100%;
}

.head-bar {
	height:60px;
	background-color:#002b59;	
	display: flex;
    justify-content: space-between;
	align-items: center;
	position:fixed;
	left:0;
	right:0;
	z-index: 1000;
}

.burger {
	padding: 10px 20px;
	color:#fff;
	height:50px;
}

.burger .btn-navbar {
	display:none;
}

.top-usp p {
	padding: 0 20px;
	font-family:arial;
	font-size:14px;
	color:#fff;
	margin-bottom:0;
}

.main-wrapper {
	padding-top:80px;
	margin-left:200px;
}

@media(max-width: 768px) {
	.main-wrapper {
		margin-left:0;
	}
	.burger .btn-navbar {
		display:block;
	}
}

.main-container h2 {
	font-family:arial;
	font-size:40px;
	color:#111;
	line-height:50px;
	text-align:center;
}

/*footer*/

footer {
	background-color: #002b59;
	color:#fff;
	margin-left: 200px;
}

/*signup.php*/

.signup-form, .login-form {
	width:400px;
	margin:0 auto;
	padding-top:30px;
	text-align: center;
	max-width: 100%;
}

.signup-form input, .login-form input {
	width: 90%;
	height: 40px;
	padding: 0 5%;
	margin-bottom:4px;
	border:none;
	background-color:#fff;
	font-family:arial;
	font-size:16px;
	color:#111;
	line-height:40px;
	border:1px solid #111;
}

.signup-form button, .login-form button, .update button {
	display:block;
	margin:0 auto 30px auto;
	min-width: 200px;
	height: 40px;
	border:none;
	background-color:#222;
	font-family:arial;
	font-size:16px;
	color:#fff;
}

.signup-form button:enabled, .login-form button:enabled, .update button:enabled {
	cursor:pointer;
}

.signup-form button:hover, .login-form button:hover, .update button:hover {
	color:#fff;
}

.signup-form button:enabled:hover, .login-form button:enabled:hover, .update button:enabled:hover {
	background-color:#111;
	opacity:0.7;
}

/* side menu */

#sidebar {
	position:fixed;
	top:60px;
	width:200px;
	height:100%;
	background-color:#002b59;
	z-index:1050;
	display:block;
	opacity: 1;
}

.logofield {
	width:200px;
	height:60px;
	background-color:#fff;
	display: flex;
    justify-content: center;
    align-items: center;
	position: fixed;
    top: 0;
    left: 0;
}

.logo {
	max-height:50px;
}

#sidebar ul.side-nav {
	padding-left: 18px;
}

@media(max-width: 768px) {
	#sidebar {
		display:none;
		width:170px;
		padding-top: 0;
	}
	#sidebar ul.side-nav {
		padding-left: 2px;
	}
	.logofield {
		display:none;
	}
}

#sidebar ul.side-nav li {
	list-style-type:none;
	padding:10px 20px;
}

#sidebar a, #sidebar a:visited, #sidebar a:focus, #sidebar a:active {
	color:#fff;
}

#sidebar a:hover {
	color:#fff;
	opacity:0.7;
	text-decoration:none;
}

.unbutton {
	-webkit-appearance: none;
    border: none;
    background: none;
    color: #ffff;
    padding: 0;
}

.unbutton:hover {
	opacity:0.7;
}

.backdrop {
	position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 900;
    opacity: 0.7;
    background: lightgrey;
}

/* uppdatera */

.update {
	overflow-x:hidden;
}

.csv-select {
	margin-bottom:10px;
}

.csv-select label {
	display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
	text-align:right;
}

.csv-select label:first-child {
	width:250px;
}

.csv-select input {
	width:60px;
}

pre {
    padding: 9.5px;
    margin: 0 0 10px;
    font-size: 13px;
    word-break: break-all;
    word-wrap: break-word;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    border-radius: 4px;
	overflow-x:scroll;
}

#csv-table {
	overflow:scroll;
	max-height:600px;
}

.updatera-knappar {
	display: flex;
    flex-wrap: wrap;
}
.updatera-knappar h3 {
	text-align: center;
    margin: 10px;
	width:100%
}

/* api page */

.main-container .api-menu {
	padding: 15px 0;
	border:1px solid #111;
	border-radius: 5px;
	height:100%;
	justify-content: space-between;
}

.api-col {
 margin-top:15px;
 margin-bottom:15px;
}

.api-btn {
	flex: 0 0 100px;
	padding:0 15px;
}

.api-menu .btn {
	width:100%;
}

.api-desc {
	padding:0 15px;
}

.api-desc p {
	margin-bottom:0;
}

/* help */

.help ol {
	padding-left:30px;
}

.help ol li {
	padding-left:9px;
}

/* general */

ul {
	padding-left:30px;
}

ul li {
	padding-left:9px;
}

/* xml */

#order-list {
	border-bottom: 1px solid;
    border-top: 1px solid;
}

#order-list thead td:not(.fw-n) {
	font-weight:bold;
}

.ordernr, .orderstatus, .ordercheck {
	display:inline-block;
	margin-right:8px;
}

.ordernr {
	width:100px;
}

.orderstatus {
	width:90px;
}

.ordercheck {
	width:80px;
}

.order input {
	width:45px;
}

tbody .ordership {
	display:none;
}

tbody .ordership.show {
	display:inline-block;
}

#order-list tr {
	height:30px;
}

.hide {
	display:none;
}

.text-link {
	color:blue;
}

.text-link:hover {
	cursor:pointer;
}

form#orderform {
	margin-top:12px;
}

form#orderform label, form#order_auto label {
	margin-right:12px;
}

#file-msg {
	display:none;
}

.settings-update {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-top: 18px;
  margin-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  text-align: left;
}

.settings-update input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.settings-update .checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border: 1px solid #007bff;
  border-radius: 3px;
}

.settings-update:hover input ~ .checkmark {
  background-color: #ccc;
}

.settings-update input:checked ~ .checkmark {
  background-color: #2196F3;
}

.settings-update .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.settings-update input:checked ~ .checkmark:after {
  display: block;
}

.settings-update .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.mr-12 {
	margin-right:12px;
}

.ml-12 {
	margin-left:12px;
}