body {
background-image: url(../images/background.jpg);
background-position: top left;
background-repeat: repeat;
background-color:#eee;
color:#000;
font-family:Arial, Helvetica, sans-serif;
margin:2em;
line-height:1.5em;
}

#intro, #toc{
background-color:#fff;
color:#000;
}

#wrapper {
background-color: #fff;
border:1px #fff solid;
box-shadow:0 0 10px rgba(0,0,0,.8);
color:#000;
margin:auto;
max-width:40em;
padding:2.5em 3em 2em;
}

h1,h2 {
background-color:#fff;
color:#7A0019;
font-variant:small-caps;
margin:.3em 0 0;
}

h1 {
line-height:0.95;
margin-bottom:.5em;
}

h2 {
margin-top:1.8em;
font-size:1.5em;
}

h3 {
font-style:oblique;
padding-bottom:0;
border-bottom:1px #000 solid;
}

h3 + p{
margin-top:-0.2em;
}

blockquote {
background-color:#eee;
background-image:url(../images/quote.gif);
background-position:.8em .6em;
background-repeat:no-repeat;
border:#dedede solid .1em;
font-size:1em;
margin:1em 3.5em;
padding:0 1em;
}

.takeaway blockquote:hover,  .takeaway blockquote:focus{
background-color:#ffc;
color:#000;
}

.takeaway blockquote {
background-color:#fff;
color:#000;
border:#dedede solid .1em;
}

.takeaway blockquote:hover,  .takeaway blockquote:focus{
background-color:#fff;
color:#000;
}

.challenge {
background-color:#eee;
background-position:.8em .6em;
background-repeat:no-repeat;
border:#dedede solid .1em;
font-size:1em;
margin:-.5em 3em 0em 2em;
padding:0 1em;
}

.challenge:hover,  .challenge:focus{
background-color:#ffc;
color:#000;
}

.takeaway {
background-color:#eee;
background-position:.8em .6em;
background-repeat:no-repeat;
border:#dedede solid .1em;
font-size:1em;
margin:1em 3em 0em 2em;
padding:0 1em 0 1em;
} 

.takeaway h3{
margin:-1.4em 0.5em 1em 0.5em ;
}

.takeaway p{
margin-bottom: 0.5em;
}

.takeaway:before{
content: "";
border-color: transparent red;
border-style: solid;
border-width: 1em 0 1em 1em;
display: block;
height: 0;
width: 0;
left: -1em;
top: 0em;
position: relative;
}

.takeaway:hover,  .takeaway:focus{
background-color:#ffc;
color:#000;
}

blockquote p {
margin-left:1.5em;
}

blockquote cite {
border-top:dashed 1px;
display:block;
font-size:.9em;
margin:.5em -.7em 0 -2.2em;
text-align:right;
}

.finding_recommendation ul {
margin-left: -2em;
}

table {
background-color:#eee;
border-color:#d3d1c2;
border-radius:1em;
border-spacing:0;
color:#000;
margin-bottom:1em;
padding:0;
}

tr,th,td {
border:1px solid #000;
border-style:outset;
}

tr:hover, tr:focus {
background-color:#FFC;
color:#000;
}

caption {
font-size:1.2em;
font-weight:300;
padding-left:.5em;
text-align:left;
}

th {
background-color:#ccc;
color:#000;
font-weight:600;
padding:0 .5em;
text-align:left;
vertical-align:top;
}

td {
border-color:#d3d1c2;
padding:0 .5em;
vertical-align:top;
}

th:first-child {
border-radius:1em 0 0 0;
}

th:last-child {
border-radius:0 1em 0 0;
}

tr:last-child > td:first-child {
border-radius:0 0 0 1em;
}

tr:last-child > td:last-child {
border-radius:0 0 1em 0;
}

a {
color:#039;
}

a:hover,a:focus,a:active {
background:#ffa;
color:#039;
}

a:focus {
outline:.1em #039 solid;
text-decoration:none;
}

#skiplink {
font-size:1.1em;
text-align:center;
}

#skiplink a,#skiplink a:hover,#skiplink a:visited {
height:1px;
left:-9999px;
overflow:hidden;
position:absolute;
width:1px;
}

#skiplink a:active,#skiplink a:focus {
background:#ffa;
color:#039;
height:auto;
overflow:auto;
position:static;
width:auto;
}

.markup {
background-color:#f0e9d1;
border :#d3d1c2 dotted 0.1em;
border-left :#d3d1c2 solid 0.3em;
color :#000;
font-family :Courier, Monaco, monospace;
font-size :1em;
margin :1em 3em;
padding :0.5em 1em 0.5em 2em;

.note {
font-size:.95em;
margin-left:1em;
margin-top:-1em;
padding-top:0;
}

.small {
font-size:.92em;
}


div.figures {
margin:-3em auto .5em;
text-align:center;
}

div#satfig {
float:left;
margin-top:.8em;
}

div#sat_callout {
margin-bottom:-5em;
margin-left:-1.5em;
margin-top:-1.5em;
}

figure {
border:1px #ccc solid;
float:left;
margin:.5em auto;
max-width:220px;
text-align:center;
}

figcaption {
background-color:#eee;
border-bottom:1px #ccc solid;
color:#000;
font-size:.89em;
font-style:oblique;
font-weight:800;
text-align:center;
}

div.callout {
margin-left:-3em;
margin-top:-2em;
}

div.callout strong {
font-size:2em;
font-weight:400;
}

.callout ul,.callout li {
list-style:none;
}

.callout ul {
overflow:hidden;
padding:3em;
}

.callout ul li a {
-moz-box-shadow:5px 5px 7px rgba(33,33,33,1);
-moz-transform:rotate(-6deg);
-moz-transition:0 .15s linear;
-o-transform:rotate(-6deg);
-o-transition:0 .15s linear;
-webkit-box-shadow:5px 5px 7px rgba(33,33,33,.7);
-webkit-transform:rotate(-6deg);
-webkit-transition:0 .15s linear;
background:#7A0019;
box-shadow:5px 5px 7px rgba(33,33,33,.7);
color:#fff;
display:block;
font-size:1.1em;
height:10em;
padding:.5em 1em 1em 1.6em;
text-decoration:none;
width:10em;
}

.callout ul li {
float:left;
margin:0 2em 2em 0;
}

.callout ul li:nth-child(even) a {
-moz-transform:rotate(4deg);
-o-transform:rotate(4deg);
-webkit-transform:rotate(4deg);
background:#c33;
position:relative;
top:5px;
}

.callout ul li a:hover, .callout ul li a:focus {
-moz-box-shadow:10px 10px 7px rgba(0,0,0,.7);
-moz-transform:scale(1.25);
-o-transform:scale(1.25);
-webkit-box-shadow:10px 10px 7px rgba(0,0,0,.7);
-webkit-transform:scale(1.25);
box-shadow:10px 10px 7px rgba(0,0,0,.7);
position:relative;
z-index:5;
}