/* CSS RESET */
* {
    vertical-align: baseline;
    font-family: inherit;
    font-style: inherit;
    font-size: 100%;
    border: none;
    padding: 0;
    margin: 0;
}

h1, h2, h3, h4, h5, h6, p, pre, blockquote, form, ul, ol, dl {
    margin: 10px 0px;
}
li, dd, blockquote {
    margin-left: 40px;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* MAIN */
body { 
  font: normal 16px/20px "Helvetica Neue", Helvetica, sans-serif;
  background: #6C8AF6;
  margin: 0;
  padding: 0;
}

h1 {
  padding-top: 10px;
  font-size: 140%;
}

h2 {
  padding-top: 20px;
  font-size: 100%;
}

#wrapper {
  width: 960px;
  margin: 0 auto;
  background: #fff;
  padding-bottom: 76px;
}

#two-columns {
	height: 385px;
}

#two-columns .col1 {
	float: left;
	width: 670px;
	height: 385px;
	background: #eee;
}

#two-columns .col2 {
	float: right;
	width: 230px;
	height: 335px;
	padding: 30px 30px 20px 30px;
	background: #FFC900;
	line-height: 135%;
	letter-spacing: -1px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 36px;
	font-style: italic;
	color: #000;
}

#two-columns .col2 blockquote {
	margin: 0px;
	padding: 0px;
}

#two-columns .col2 span {
    font-size: 32px;
}

#article {
    margin: 20px;
}

/* picture slider */
#foobar
{
	width: 670px;
	height: 385px;
	position: relative;
}

#foobar .navigation
{
	position: absolute;
	display: block;
	z-index: 100;
	color: #ffffff;
	bottom: 0px;
	right: 0px;
	padding: 10px;
	background-color: #303030;
	opacity: 0.75;
}

#foobar .navigation a
{
	color: #ffffff;
	text-decoration: none;
	outline: none;
}

#foobar .viewer
{
	width: 670px;
	height: 385px;
}

#foobar .viewer .reel .slide
{
	position: relative;
	width: 670px;
	height: 385px;
}

#foobar .viewer .reel .slide span
{
	position: absolute;
	display: block;
	width: 670px;
	opacity: 0.70;
	padding: 10px;
	background-color: #404040;
	color: #ffffff;
	bottom: 0px;
	left: 0px;
}