.nocopy * {
	-webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none;   /* Chrome/Safari/Opera */
	-khtml-user-select: none;    /* Konqueror */
	-moz-user-select: none;      /* Firefox */
	-ms-user-select: none;       /* Internet Explorer/Edge */
	user-select: none;           /* Non-prefixed version, currently not supported by any browser */
}
input:focus, select:focus, textarea:focus, button:focus {
	outline: none;
}
input[type='number'] {
	-moz-appearance:textfield;
}
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
	-webkit-appearance: none;
}
@font-face {
	font-family: 'ukplate';
	src: url('../fonts/uknumberplate-webfont.woff2') format('woff2'),
		 url('../fonts/uknumberplate-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
body  {
	margin: 0px;
	padding: 0px;
	font-family: 'Roboto', sans-serif;
}
.header {
	background-color: #152028;
	position: inherit;
}
.header .logo {
	width: 200px;
	padding: 30px;
}
.header h1 {
	color: white;
	font-weight: bold;
	font-size: 20px;
	position: absolute;
	right: 30px;
	top: 35px;
	margin: 0px;
	padding: 10px 0px 0px;
}

.wrapper {
	width: 100%;
	max-width: 600px;
	margin: 0px auto;
	box-sizing: border-box;
	padding: 0px 20px;
}

.break {
	height: 40px;
}


.action, .complete {
	display: block;
	margin-bottom: 5px;
	border-radius: 5px;
	background-color: #4d86c4;
	font-size: 15px;
	border: 0px;
	color: white;
	cursor: pointer;
	padding: 15px 70px 15px 50px;
	text-decoration: none;
	box-sizing: border-box;
	background-image: url('../images/right.png');
	background-repeat: no-repeat;
	background-position: 85% center;
	background-size: 25px;
	float: right;
}
.action:hover {
	opacity: 0.8;
}
.action.left, .complete.left {
	background-image: none;
	background-color: #adadad;
	float: left;
	padding: 15px 50px 15px 50px;
	box-sizing: border-box;
}
.action.green {
	background-color: #15c03e;
}

.field {
	width: 100%;
	font-size: 15px;
	padding: 10px;
	font-size: 25px;
	text-align: center;
	border-radius: 3px;
	border: 1px solid #152028;
	box-sizing: border-box;
	margin: 10px 0px;
}
textarea.field {
	height: 200px;
}
.field.notfilled {
	border: 1px solid #d9534f;
	background-color: #f8dddc;
}
.field.veh_reg {
	background-color: #eedb05;
	text-transform: uppercase;
	font-family: 'ukplate';
	font-weight: normal;
	font-size: 30px;
	padding: 15px;
	border: 3px solid black;
}
.veh_details {
	width: 100%;
	display: none;
}
.permit_details {
	width: 100%;
}
.veh_details h2 {
	padding: 0px;
}
.veh_details td, .permit_details td {
	padding: 3px 0px;
}
[data-field] {
	text-align: right;
}

.notice {
	padding: 10px;
	color: white;
	background-color: #c02a18;
	background-color: #d9534f;
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	margin-top: 0px;
	display: none;
}
.notice.success {
	background-color: #15c03e;
}

[data-step] {
	display: none;
}
[data-step="1"] {
	display: block;
}

.loading {
	text-align: center;
	font-size: 14px;
	display: none;
}
.spinner {
	width: 48px;
	height: 48px;
	border: 5px solid #152028;
	border-bottom-color: transparent;
	border-radius: 50%;
	display: inline-block;
	box-sizing: border-box;
	animation: rotation 1s linear infinite;
	margin: 50px auto;
	display: block;
}

@keyframes rotation {
0% {
	transform: rotate(0deg);
}
100% {
	transform: rotate(360deg);
}
} 

@media screen and (max-width: 600px) {
	.header .logo {
		margin: 0px auto;
		display: block;	
		padding-bottom: 0px;
	}
	.header h1 {
		position: relative;
		right: auto;
		top: auto;
		display: block;
		text-align: center;
		padding: 20px 0px;
	}
	.action, .complete {
		float: none;
		position: absolute;
		right: 20px;
		bottom: 20px;	
	}
	.action.left, .complete.left {
		float: none;
		position: absolute;
		left: 20px;
		right: auto;
		bottom: 20px;	
	}
}