html
{
font-size: 62.5% !important;
overflow-y: scroll;
scroll-behavior: smooth;
}

*
{
margin: 0;
padding: 0;
border: 0;
box-sizing: border-box;
outline: none;
line-height: 1.3;
}

body
{
font-family: Arial, Verdana, san-serif;
background: #f6f6ff;
}

img
{
vertical-align: middle;
}

input,
label,
select,
button,
textarea
{
	margin:0;
	border:0;
	padding:0;
	display:inline-block;
	vertical-align:middle;
	white-space:normal;
	background:none;
	line-height:1;
	
	/* Browsers have different default form fonts */
	font-size:13px;
	font-family:Arial;
}

/* Remove the outer glow in Webkit */
input:focus
{
	outline:0;
}

/* Box Sizing Reset
-----------------------------------------------*/

/* All of our custom controls should be what we expect them to be */
input,
textarea
{
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;
}

/* These elements are usually rendered a certain way by the browser */
button,
input[type=reset],
input[type=button],
input[type=submit],
input[type=checkbox],
input[type=radio],
select
{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

/* Text Inputs
-----------------------------------------------*/

input[type=date],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=range],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
input[type=url],
input[type=week]
{
}

/* Button Controls
-----------------------------------------------*/

input[type=checkbox],
input[type=radio]
{
	width:13px;
	height:13px;
}

/* File Uploads
-----------------------------------------------*/

input[type=file]
{

}

/* Search Input
-----------------------------------------------*/

/* Make webkit render the search input like a normal text field */
input[type=search]
{
	-webkit-appearance:textfield;
	-webkit-box-sizing:content-box;
}

/* Turn off the recent search for webkit. It adds about 15px padding on the left */
::-webkit-search-decoration
{
	display:none;
}

/* Buttons
-----------------------------------------------*/

button,
input[type="reset"],
input[type="button"],
input[type="submit"]
{
	/* Fix IE7 display bug */
	overflow:visible;
	width:auto;
}

/* IE8 and FF freak out if this rule is within another selector */
::-webkit-file-upload-button
{	
	padding:0;
	border:0;
	background:none;
}


/* Form */

form
{
max-width: 30rem;
text-align: left;
margin: 3rem auto 0 auto;
}

.form-section
{
margin: 2.1rem 0;
}

label
{
font-size: 1.4rem;
display: block;
margin-bottom: 0.5rem;
color: #505052;
}

input
{
display: block;
font-size: 1.3rem;
border: 0.1rem solid #606062;
border-radius: 0.4rem;
padding: 1rem 1.3rem;
width: calc(100% - 2.8rem);
}

#submit
{
display: block;
width: 100%;
margin: 0.5rem auto 0 auto;
border: none;
cursor: pointer;
max-width: 20rem;
}

input:focus
{
border-colour: #111;
}

/* Header */

header
{
padding: 2rem;
text-align: center;
background: #25252a;
}

header img
{
display: inline-block;
height: 8rem;
width: 40rem;
}

#info
{
background: #fff;
display: block;
width: 90%;
max-width: 80rem;
padding: 2rem;
margin: 2rem auto;
border-radius: 0.3rem;
position: relative;
}

#info img
{
width: 100%;
}

#info:after
{
  content: " ";
  z-index: 10;
  display: block;
  position: absolute;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0);
}

@media screen and (max-width: 800px) {
	
	body
	{
	background: #fff;
	}

	#info
	{
	width: 100%;
	padding: 4rem 2rem;
	margin: 0 auto;
	border-radius: 0;
	}
}
