* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: Arial;
	text-decoration: none;
}

body {
	font-size: 16px;
}

header, footer, body > div {
	border: 1px solid black;
	width: 1248px;
	margin: 1em auto;
	padding: 10px;
	max-width: calc(100% - 1em);
}

header, footer {
	text-align: center;
}

body > div {
	display: flex;
	flex-direction: row;
}

nav {
	width: 200px;
}
	
	nav a {
		display: inline-block;
		width: 100%;
		padding: 5px;
		border-bottom: 1px solid rgba(0, 0, 0, .5);
	}

main {
	width: calc(100% - 200px);
}

/* search */

#search {
	width: 50%;
    float: left;
}

#map {
	width: 50%;
	height: 500px;
}

#search form {
	width: 100%;
	max-width: 500px;
	text-align: center;
}

	#search form label {
		font-weight: bold;
	}
	
	#search form input {
		margin: 10px;
		border: 1px solid black;
		padding: 10px;
		text-align: center;
	}
	
	#search form button {
		background: green;
		color: white;
		padding: 10px;
		border: 0px;
	}

#search .vehicles {}

	#search .vehicles .vehicle {
	}

            #search .vehicles .vehicle > div {
                display: flex;
                margin: 10px 0;
                border: 1px solid blue;
            }

                #search .vehicles .vehicle > div div {
                    width: calc(100% / 2);
                    padding: 10px;
                }
        
        #search .vehicles .error {
            padding: 10px;
            border: 1px solid brown;
            color: brown;
        }
        
        #search .vehicles .vehicle a {
            cursor: pointer;
        }
        
        #search .vehicles img {
            height: 100px;
            margin-right: 5px;
        }

#reservation {
	text-align: center;
}
	
	#reservation table {
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
	}

	#reservation tr td {
		vertical-align: top;
		padding: 15px;
		text-align: center;
	}

	#reservation form input {
		margin: 10px 0;
		border: 1px solid black;
		padding: 5px 10px;
		text-align: center;
	}
	
	#reservation form button {
		background: green;
		color: white;
		padding: 10px;
		border: 0px;
	}
	
	#reservation .message {
		flex-direction: column;
		color: #ffffff;
	}
	
	#reservation .message.error { background: red; }
	#reservation .message.success { background: green; }