/* The body styling */
body {
	margin: 0;
	font-family: 'Raleway', sans-serif;
	color: black;
}

/* Simpele space */
.space {
	margin-top: 10px;
}

/* The navigation bar */
.navbar {
    	overflow: hidden;
    	background-color: #333;
    	position: fixed; /* Set the navbar to fixed position */
    	top: 0; /* Position the navbar at the top of the page */
    	width: 100%; /* Full width */
}

.navbar .navbar-links {
	margin-left: 15px;
}

/* Links inside the navbar */
.navbar a {
	float: left;
	display: block;
	color: #f2f2f2;
	text-align: center;
	padding: 14px 16px;
	text-decoration: none;
}

/* Change background on mouse-over */
.navbar a:hover {
    	background: #ddd;
    	color: black;
}

/* Main content */
.main {
    	margin-top: 30px; /* Add a top margin to avoid content overlay */
}


.form-control .submit {
    	width: 100%;
    	background-color: #4CAF50;
    	color: white;
    	padding: 14px 20px;
    	margin: 8px 0;
    	border: none;
	border-radius: 4px;
	cursor: pointer;
}

.form-control .submit:hover {
	background-color: #45a049;
}

.form-control .reset {
    	width: 100%;
    	background-color: #ff0000;
    	color: white;
    	padding: 14px 20px;
    	margin: 8px 0;
    	border: none;
	border-radius: 4px;
	cursor: pointer;
}

.form-control .reset:hover {
	background-color: #680000;
}

.content {
	width: 100%;
	margin-top: 70px;
  	text-align: center;
}

.content .innerhtml {
	width: 30%;
	padding: 20px;
	margin-top: 40px;
	margin-left: auto;
        margin-right: auto;
	border-radius: 5px;
	background-color: #f2f2f2;
	
}

.input-container {
  display: -ms-flexbox; /* IE10 */
  display: flex;
  width: 100%;
  margin-bottom: 15px;
}

.icon {
  padding: 10px;
  color: white;
  min-width: 50px;
  text-align: center;
}

.input-field {
  width: 100%;
  padding: 10px;
  outline: none;
}

 .fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}