Untitled

<!doctype html>
<html lang="de">
	<head>
		<meta charset="utf-8">
		<title>Juicy Erfrischungsgetränke</title>
		<style>
		@import url('https://fonts.googleapis.com/css?family=Merienda+One|Open+Sans:400,700');

			body {
				background-image: url(bilder/verlauf.png);
				background-repeat:repeat-x;
				background-color: rgb(151,191,13);
				font-family: "Open Sans", sans-serif;
			}

			h2, nav {
				font-family: "Merienda One", cursive;
			}

			h1 {
				display:none;
			}

			#rahmen {
				width: 960px;
				margin: 0 auto;
			}

			header img {
				margin-top: 10px;
			}

			nav {
				display: inline-block;
				width:713px;
				text-align:right;

			}
			nav ul {
				list-style-type: none;
				padding-left: 0;
			}
			nav li {
				display: inline;
				margin-left:20px;
			}
			nav a {
				color: white;
				text-decoration:none;
				font-size: 21px;
			}

			#visual {
				background-image: url(bilder/kopfbild.png);
				height: 234px;
				margin-bottom: 20px;
			}
			main {
				display: block;  /* fix für IE */
			}
			.spalte {
				width:260px;
				background-color:white;
				display: inline-block;
				margin-right:30px;
				border-radius:20px;
				padding:20px;
				font-size: 14px;
				color: rgb(90,63,24);
				vertical-align:top;
			}

			.letzte {
				margin-right:0;
			}
			.breit {
				width: 590px;
			}
			h2 {
				margin-top: 5px;
			}

			img {
				border-radius:20px;
			}

			footer {
				background-image: url(bilder/fuss.png);
				margin-top: 20px;
				height: 31px;
				padding: 6px 20px;
			}
			#icons {
				margin-left: 759px;
			}
		</style>
	</head>
	<body>
		<h1>Juicy Erfrischungsgetränke</h1>
		<div id="rahmen">
			<header>
				<a href="index.html"><img src="bilder/juicy_logo.png" alt="Juicy Logo"></a><nav>
					<ul>
						<li><a href="index.html">Startseite</a>
						<li><a href="ueber.html">Über Juicy</a>
						<li><a href="sorten.html">Sorten</a>
						<li><a href="galerie.html">Galerie</a>
						<li><a href="kontakt.html">Kontakt</a>
					</ul>
				</nav>
				<div id="visual"></div>
			</header>
			<main>
				<section class="spalte">
					<h2>Willkommen!</h2>
					<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes.</p>
					<a href="">zum Gewinnspiel</a>
				</section><img src="bilder/juicy_startbild.jpg" alt="Produktbild der Juicy Flaschen">

			</main>
			<footer>
				<img src="bilder/mail.png" alt="eMail Button">
				<img id="icons" src="bilder/social_icons.png" alt="Links zu sozialen Netzwerken">
			</footer>
		</div>
	</body>
</html>