/*
http://andyrutledge.com
August 2012
Design and Development by Andy Rutledge
Thanks to Richard Clark - http://richclarkdesign.com - for the html5 reset
*/

/* RESET STYLES ------------------------------------------------------------- */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video{ margin:0;  padding:0;  border:0;  outline:0;  font-size:100%;  vertical-align:baseline;  background:transparent}
body{line-height:1; background:#161616; font-family:"ff-tisa-web-pro-1","ff-tisa-web-pro-2", Georgia, Times, serif; color:#222; text-align:center;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display:block}
h1 {font-weight:normal; text-align:left; color:#fff;}
h2, h3, h4, h5 {text-align:left; font-weight:normal;}
h6 {font-weight:normal; text-align:left;}
p, ul, ol, dl, blockquote {text-align:left; color:#333;}
ul, ol{ list-style:none}
a:link, a:visited {text-decoration: none;}
a:hover {text-decoration: underline;}
blockquote a:link, blockquote a:visited {color: #000 !important; text-decoration: underline; border: none; text-shadow: none;}
blockquote a:hover {color: #f0ce4a !important; text-decoration: none; border-bottom: 1px dotted #999; text-shadow: 1px 1px 0 #666;}
li a:link, li a:visited, p a:link, p a:visited{color:#000; text-decoration:none;}
li a:hover, p a:hover{text-decoration:none; border:none;}
blockquote, q{quotes:none;}
blockquote:before, blockquote:after, q:before, q:after{content:'';  content:none}
del{text-decoration:line-through}
abbr[title], dfn[title]{border-bottom:1px dotted; cursor:help}
acronym {cursor: help; border-bottom:1px dotted #999;}
table{border-collapse:collapse; border-spacing:0}
input, select{vertical-align:middle}
.clear{clear:both; display:block; height:1px}

a:hover {cursor:pointer;}

/* BASIC PAGE STYLES ---------------------------------------------- */

.background {position: fixed; top: 0; left: 0; width: 100%; z-index: 1;}
.background img {text-align: center; margin: 0 auto;}
header {clear: both; position: relative; z-index: 10; padding: 30px 0; width: 100%; background: url(../images2013/header_bg.png) repeat; text-align: left;}
header figure {float: left; max-width: 252px; padding: 0 20px;}
header figure img {max-width: 100%;}
header nav {float: right; margin-top: 35px; max-width: 320px;}
header nav ul {margin: 0 20px; font-size: 20px; color: #fff;}
header nav li {margin: 0 20px; float: right; text-align: center;}
header nav li a:link, header nav li a:visited {color: #fff; text-decoration: none;}
header nav li a:hover {color: #999; text-decoration: underline;}

section.title {margin: 80px auto 80px; max-width: 840px; position: relative; z-index: 10; text-align: center;}
section.title h1 {margin: 0 20px; font-size: 60px; color: #fff; font-style: italic; text-align: center; line-height: 1.4em; text-shadow: 1px 1px 0 #000;}
section.title h1 span {clear: both; display: block; font-size: 34px; color: #000; text-shadow: none;}
.diversity section.title h1 span {color: #f0ce4a; text-shadow: none;}
.contr section.title h1 {text-shadow: 3px 3px 0 #000;}
.capitalism section.title h1 span, .serenity section.title h1 span, .plain section.title h1 span {color: #f0ce4a; text-shadow: 1px 1px 0 #000;}
section.title p {margin: 0 20px; font-size: 18px; color: #ccc; font-style: italic; text-align: center; line-height: 1.6em;}

section.bodyCopy {margin: 60px auto; padding:70px 20px 120px; max-width: 80%; background: url(../images2013/bodycopy_bg.png) repeat; position: relative; z-index: 10;}

section.bodyCopy figure {clear: both; margin: 40px auto; max-width: 615px;}
section.bodyCopy figure img {max-width: 100%;}
section.bodyCopy figcaption {margin: 20px 0; padding-bottom: 20px; font-size: 22px; color: #666; line-height: 1.4em; text-align: center; border-bottom: 1px dashed #999;}
section.bodyCopy h2 {margin: 0 auto 40px; padding: 40px 0; max-width: 800px; font-size: 38px; color: #333; font-style: italic; border-bottom: 1px solid #999;}
section.bodyCopy h3 {margin: 40px auto 20px; max-width: 800px; font-size: 34px; color: #222; font-style: italic;}
section.bodyCopy h4 {margin: 40px auto 20px; padding: 40px 0 0; max-width: 800px; font-size: 28px; color: #000; font-style: normal;}
section.bodyCopy p {margin: 5px auto 0; font-size: 25px; color: #222; line-height: 1.4em; max-width: 800px;}
section.bodyCopy p.reset {margin-top: 30px; margin-bottom: 25px; text-align: center; text-indent: 0;}
section.bodyCopy p.repub {color: #999; font-style: italic; text-indent: 0;}
section.bodyCopy p+p {text-indent: 2em;}
section.bodyCopy p.break {text-indent: 0 !important;}
section.bodyCopy p.breakout {font-weight: bold; text-indent: 0; margin: 0 auto 40px; padding-bottom: 30px; border-bottom: 1px solid #999;}
section.bodyCopy p br {display: none;}
section.bodyCopy p cite br {display: block;}
section.bodyCopy ul {margin: 30px auto 10px; padding: 0 20px; font-size: 24px; max-width: 760px; list-style: disc; list-style-position: outside; text-align: left;}
section.bodyCopy ol {margin: 30px auto 10px; padding: 0 20px; font-size: 24px; max-width: 760px; list-style: decimal; list-style-position: outside; text-align: left;}
section.bodyCopy li {margin: 0 20px; padding: 0 0 10px; color: #444; line-height: 1.4em;}
section.bodyCopy dl {margin: 30px auto 20px; font-size: 25px; color: #222; line-height: 1.4em; max-width: 800px;}
section.bodyCopy dt {margin: 0 0 5px; font-weight: bold; color: #000;}
section.bodyCopy dd {padding: 0 0 20px; color: #444;}
section.bodyCopy cite {font-weight: bold; padding: 40px 0; display: block; color: #630;}
.serenity section.bodyCopy cite {color: #000;}
.plain section.bodyCopy cite {color: #777;}

section.bodyCopy blockquote {margin: 5px auto 0; font-size: 25px; line-height: 1.4em; max-width: 800px; font-family: Arial, Helvetica, sans-serif; font-weight: normal; padding: 40px 0; display: block; color: #777; font-style: italic;}
section.bodyCopy blockquote a:link, section.bodyCopy blockquote a:visted {color: #000 !important; text-decoration: underline; border: none; text-shadow: none;}
section.bodyCopy blockquote a:hover {color: #f0ce4a; text-decoration: none; border-bottom: 1px dotted #999; text-shadow: 1px 1px 0 #666;}

span.source {display: block; clear: both; text-align: right;}
span.source a:link, span.source a:visted {color: #000 !important; text-decoration: underline; border: none; text-shadow: none;}
span.source a:hover {color: #f0ce4a; text-decoration: none; border-bottom: 1px dotted #999; text-shadow: 1px 1px 0 #666;}

section.bodyCopy h2 a:link, section.bodyCopy h2 a:visited, section.bodyCopy p a:link, section.bodyCopy p a:visited, section.bodyCopy ul a:link, section.bodyCopy ul a:visited, section.bodyCopy dl a:link, section.bodyCopy dl a:visited, section.bodyCopy figcaption a:link, section.bodyCopy figcaption a:visited, section.bodyCopy ol a:link, section.bodyCopy ol a:visited {color: #000; text-decoration: underline; border: none; text-shadow: none;}
section.bodyCopy h2 a:hover, section.bodyCopy p a:hover, section.bodyCopy ul a:hover, section.bodyCopy dl a:hover, section.bodyCopy figcaption a:hover, section.bodyCopy ol a:hover {color: #f0ce4a; text-decoration: none; border-bottom: 1px dotted #999; text-shadow: 1px 1px 0 #666;}

img.righty {float: right; margin: 0 0 40px 40px;}

.secHead h2.heading-link a:link, .secHead h2.heading-link a:visited {color: #000 !important;}

/* EMBEDDED TWEET STYLES ---------------------------------------------- */
.tBox {clear: both; margin: 0 auto; padding: 40px 0;}
.tBox blockquote {margin: 0 auto !important; padding: 15px !important; font-style: normal !important; max-width: 470px !important; font-size: 16px !important; font-weight: normal !important; background: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 3px 3px 5px 6px #ccc;  -webkit-box-shadow: 3px 3px 5px 6px #ccc; box-shadow: 1px 1px 4px 4px #ccc;}
.tBox blockquote p {font-size: 16px !important;}


/* FOOTER STYLES ---------------------------------------------- */
footer {clear: both; margin: 80px auto; text-align: center; position: relative; z-index: 10;}
footer figure {clear: both; margin: 0 auto; padding: 0 20px 40px; max-width: 252px; border-bottom: 1px solid #333;}
footer figure img {max-width: 100%;}
footer nav {clear: both; margin: 60px auto 0; padding: 0 20px;}
footer nav p {margin: 0 auto; padding: 0 20px; font-size: 20px; color: #fff; text-align: center; max-width: 800px;}
footer nav p a:link, footer nav p a:visited {margin: 0 20px; color: #fff; text-decoration: none;}
footer nav p a:hover {color: #999; text-decoration: underline;}
p.copyright {margin: 60px auto; padding: 0 20px; text-align: center; font-size: 18px; color: #999; line-height: 1.6em; max-width: 800px;}
p.copyright a:link, p.copyright a:visited {margin: 0 5px; color: #ccc; text-decoration: none;}
p.copyright a:hover {color: #999; text-decoration: underline;}



/*medium screen layouts */
@media screen and (max-width:1049px){

}


/*layouts 1024px: tablets horizontal */
@media screen and (max-width:1023px){

}


/*layouts smaller than 1024px: tablets vertical */
@media screen and (max-width:1023px){
header figure {float: none; margin: 0 auto;}
header nav {float: none; margin: 35px auto;}
header nav li.home {float: left;}
header nav li.arch {float: right;}
section.title {margin: 80px auto 60px;}
section.title h1 {font-size: 45px;}
section.title h1 span {font-size: 24px;}
section.title p {font-size: 16px;}
section.bodyCopy p {font-size: 20px;}
section.bodyCopy figcaption {font-size: 18px;}

}


/*layouts smaller than 640px, iPhone and mobiles */
@media screen and (max-width:639px){
section.bodyCopy { max-width: 100%;}
section.bodyCopy h3 {font-size: 24px;}
section.bodyCopy p {font-size: 18px;}
section.bodyCopy ul, section.bodyCopy ol {font-size: 18px !important;}
section.bodyCopy dl {font-size: 18px;}
section.bodyCopy p br {display: block;}
section.bodyCopy figcaption {font-size: 16px;}
img.righty {float: none; margin: 0 auto 40px; max-width: 100%; clear: both; display: block;}
}




/* For modern browsers */
.cf:before, .cf:after {content:""; display:table;}
.cf:after {clear:both;}
/* For IE 6/7 (trigger hasLayout) */
.cf {zoom:1;}