* {
  font-family:Verdana,Arial,"Sans Serif";
}

body {
  background-image:url(back.png);
  background-size:cover;
  background-attachment: fixed;
  font-size: 16px;
  text-align:center;
  padding:0px;
  margin:0px
}

a {
	color:blue;
	text-decoration:none;
}

a:hover {
	text-decoration:underline;
}

p:first-letter {
  /*color:#cc6600;*/
  /*font-weight:bold;*/
}

footer {
  text-align:center;
  clear:both;
}

footer p {
  
}

h1 {
  border:1px solid #cc9933;
  background-color:#ffffdd;
  padding:0.25em;
  margin:10px 10px 0px 10px;
  font-size:20px;
  font-weight:bold;
}

h2 {
  color:#cc6600;
  font-size:18px;
  font-weight:bold;
  padding:0em 0em 0em 0em;
  margin:0em 0.25em 0.25em 0em;
}

img.preview {
  width:125px;
  float:right;
  border:1px solid gray;
  margin:0em 0em 0.5em 0.5em;
}

figure.preview {
  float:right;
  margin:0.5em 0em 0.5em 0.5em;
}

figure.preview img {
  width:125px;
  border:1px solid gray;
}

figure.preview figcaption {
	text-align:center;
	font-size:smaller;
}

section#website {
  margin: auto;
  text-align:left;
}

section section section, section.box {
  margin:10px 10px 10px 10px;
  padding:10px;
  background-color: #ffffdd;
  border:1px solid #cc9933;
  text-align:left;
}



@media all and (min-width: 800px) {

  section#website {
    width:780px;
  }

  section.floatable {
		width:345px;
		float:left;
		clear:none;
	}
  
  h1 {
    clear:both;
  }

}