oliverdoetsch/gist:8164086

## gistfile1.txt

<!doctype html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<style>
	   * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
body {
    font-family: Helvetica, Arial, sans-serif;
    line-height: 1.3em;
    -webkit-font-smoothing: antialiased;
}
.container {
    width: 90%;
    margin: 20px auto;
    background-color: rgba(255,255,255,.80);
    padding: 20px;
    text-align: center;
}
.other { color: #FFF }
    .other div {
        position: absolute;
        bottom: 0;
        width: 90%;
        background: #000;
        background: rgba(0,0,0,0.7);
    }
        .other div p {
            padding: 10px;
            text-align: center;
        }
.button {
    display: inline-block;
    margin: 0 0.2em;
    padding: 13px;
    border: 1px solid black;
    border-radius: 2px;
    -webkit-transition: all 0.3s ease-out;
       -moz-transition: all 0.3s ease-out;
         -o-transition: all 0.3s ease-out;
            transition: all 0.3s ease-out;
    /* Font styles */
    text-decoration: none;
    font-weight: bold;
    color: black;
}
.button:hover {
    background: #000;
    color: #fff;
}
.button:active {
    background: #444;
    color: #fdfdfd;
}
.button:visited { background: black }
	</style>
</head>
<body>
    <div class="container">

        <h1>Googledrive.com</h1>
        <p>Ein Boilerplate-Layout in Googledrive gehostet - Hintergrundbild mit backstretch.js fixiert!</p><a class="button" href="http://5202.blogspot.com/2012/12/nachgelegt-website-auf-google-drive.html
"><< Back to post<a>
        <div class="other">
          <div><p>Katsushika Hokusai: Die grosse Welle vor Kanagawa</p></div>
        </div>
             </div>
	<script src="https://googledrive.com/host/0B9jiMv20C91YdHNWWEpfOGR0cWc/libs/jquery/jquery.js"></script>
	<script src="https://googledrive.com/host/0B9jiMv20C91YdHNWWEpfOGR0cWc/src/jquery.backstretch.js"></script>
	<script>
	    $.backstretch(["https://lh5.googleusercontent.com/-M3Ykl2dQNcw/ULzHCe4jOYI/AAAAAAAADIc/bMR8Ryo7tLk/s2000/katsushika_HOKUSAI_grosse_welle_kanagawa.jpeg"]);
  </script>
</body>
</html>

	<!doctype html>
	<html lang="en">
	<head>
	<meta charset="utf-8" />
	<style>
	* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}
	body {
	font-family: Helvetica, Arial, sans-serif;
	line-height: 1.3em;
	-webkit-font-smoothing: antialiased;
	}
	.container {
	width: 90%;
	margin: 20px auto;
	background-color: rgba(255,255,255,.80);
	padding: 20px;
	text-align: center;
	}
	.other { color: #FFF }
	.other div {
	position: absolute;
	bottom: 0;
	width: 90%;
	background: #000;
	background: rgba(0,0,0,0.7);
	}
	.other div p {
	padding: 10px;
	text-align: center;
	}
	.button {
	display: inline-block;
	margin: 0 0.2em;
	padding: 13px;
	border: 1px solid black;
	border-radius: 2px;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	/* Font styles */
	text-decoration: none;
	font-weight: bold;
	color: black;
	}
	.button:hover {
	background: #000;
	color: #fff;
	}
	.button:active {
	background: #444;
	color: #fdfdfd;
	}
	.button:visited { background: black }
	</style>
	</head>
	<body>
	<div class="container">

	<h1>Googledrive.com</h1>
	<p>Ein Boilerplate-Layout in Googledrive gehostet - Hintergrundbild mit backstretch.js fixiert!</p><a class="button" href="http://5202.blogspot.com/2012/12/nachgelegt-website-auf-google-drive.html
	"><< Back to post<a>
	<div class="other">
	<div><p>Katsushika Hokusai: Die grosse Welle vor Kanagawa</p></div>
	</div>
	</div>
	<script src="https://googledrive.com/host/0B9jiMv20C91YdHNWWEpfOGR0cWc/libs/jquery/jquery.js"></script>
	<script src="https://googledrive.com/host/0B9jiMv20C91YdHNWWEpfOGR0cWc/src/jquery.backstretch.js"></script>
	<script>
	$.backstretch(["https://lh5.googleusercontent.com/-M3Ykl2dQNcw/ULzHCe4jOYI/AAAAAAAADIc/bMR8Ryo7tLk/s2000/katsushika_HOKUSAI_grosse_welle_kanagawa.jpeg"]);
	</script>
	</body>
	</html>