/* Live in Style -- Snap Backup */
/* colors: Teal (#008080), Pale Green (#98FB98), Yellow (#FFFF00) */

/* Base */
body     { color: teal; background-color: white;
           background-image: url("graphics/arches.png"); background-repeat: no-repeat;
           font-size: 90%; font-family: geneva, tahoma, sans-serif; margin: 0px; }
table    { font-size: 100%; }
td       { vertical-align: top; }
ul, ol   { font-size: 90%; }
hr       { background-color: silver; height: 1px; border: none; }
textarea { font-family: sans-serif; }
br.clear { clear: both; }
br.all   { clear: both; }  /* old */

/* Links */
a         { color: slategray; font-weight: bold; text-decoration: none; }
a:hover   { color: navy; }
a:active  { color: darkgray; }
a:visited { color: darkgray; }
img       { border-style: none; }
a.norm    { text-decoration: underline; }

/* Navigation Buttons */
a.nav             { color: white; padding-right: 10px; }
a.nav:hover       { color: yellow; background: teal; }
a.nav:active      { color: teal; }
a.nav:visited     { color: white; }
a.current         { color: teal; padding-right: 10px; }
a.current:hover   { color: teal; }
a.current:active  { color: teal; }
a.current:visited { color: teal; }

/* Layout */
.stress { font-weight: bold; font-style: italic; color: firebrick; }
.click  { cursor: pointer; }  /* use for submit buttons */
.center { text-align: center; margin-left: auto; margin-right: auto; }
.indent { margin-left: 30px; }
.code   { color: seagreen; font-weight: bold; font-size: 120%; font-family: monospace; margin: 10px 30px; }
.stage_l  { float: left; margin-right: 10px; }
.stage_c  { text-align: center; margin-left: auto; margin-right: auto; }
.stage_r  { float: right; text-align: right; font-size: 80%; margin: 0px 0px 10px 10px; }
.stage_r2 { float: right; font-size: 80%; background-color: teal; margin: 0px 0px 10px 10px; }
.stage_r3 { float: right; font-size: 80%; border: solid teal 2px; padding: 5px; margin: 0px 0px 10px 10px; }
.stage_r4 { float: right; font-weight: bold; font-size: 70%; font-family: sans-serif;
            border: solid palegreen 3px; padding: 5px; margin: 10px 0px 10px 10px; }
.stage_r5 { float: right; border: solid silver 1px; margin: 0px 0px 10px 20px; }
img.screen { border: 3px solid teal; margin: 10px 0px; }

/* Side Bar */
a.lime         { color: white; font-weight: bold; text-decoration: none; }
a.lime:hover   { color: yellow; }
a.lime:active  { color: white; }
a.lime:visited { color: silver; }
div.lime       { color: palegreen; font-size: 90%; font-weight: bold; text-align: center;
                 font-family: comic sans ms, sans-serif; background-color: teal; padding: 10px; }

/* Document */
div.nav    { float: left; background-color: darkgray; text-transform: uppercase; font-weight: bold;
             font-size: 75%; font-family: verdana, sans-serif; padding: 20px 10px 20px 0px; margin-top: 250px; }
div.main   { width: 550px; margin: 20px; }
div.sub    { margin: 0px 30px; }
div.steps  { font-size: 90%; border: 1px solid silver; padding: 2px; margin: 3px 0px 0px 30px; }
h1         { font-family: comic sans ms, american typwriter, sans-serif; margin-top: 60px; margin-left: 80px; }
h2         { margin: 0px; font-size: 110%; }
h3         { margin: 10px 0px 0px 0px; font-size: 100%; font-style: italic; }
div.news   { float: left; font-size: 80%; border: dashed 1px teal; width: 150px;
             padding: 7px 7px 7px 10px; margin: 10px 15px 5px 0px; }
div.news_header { font-size: 100%; font-weight: bold; text-align: center; color: teal;
                  border: solid teal 1px; background-color: yellow; padding: 1px; margin-bottom: 9px; }
div.date   { float: left; font-style: italic; color: white; background-color: darkgray; padding: 0px 7px 1px 8px; }
div.footer { display: table; text-align: center; color: gray; font-size: 70%; font-family: sans-serif;
             border-top: solid gray 1px; padding: 3px; margin: 20px auto; }
div.footer a { color: gray; font-weight: normal; }

/* Data Boxes */
table.bento    { margin-left: auto; margin-right: auto; margin-top: 10px; }
table.bento th { color: white; background-color: darkgoldenrod; border: solid darkolivegreen 1px; padding: 1px 15px; }
table.bento td { font-size: 90%; border: solid darkolivegreen 1px; padding: 5px; }

table.boxed    { background-color: #CCCC99; border: 3px solid darkgoldenrod; }
caption.boxed  { color: darkgoldenrod; }

div.box_top    { font-weight: bold; font-size: 110%; border: solid teal 1px; text-align: center;
                 background: darkgray; padding: 3px; }
div.box_middle { border-left: solid teal 1px; border-right: solid teal 1px; text-align: center; padding: 5px; }
div.box_bottom { border: solid teal 1px; text-align: center; padding: 5px; }

/* Form Box OLD */
table.perfect         { background-color: gainsboro; border: solid teal 1px;
                        padding: 7px; margin-left: auto; margin-right: auto; }
table.perfect caption { color: gold; background-color: teal;
                        font-size: 120%; font-weight: bold; padding: 3px;
                        margin-left: auto; margin-right: auto; }
table.perfect th      { text-align: right; font-weight: bold; }
table.perfect div     { text-align: center; margin-top: 6px; }
table.perfect span    { float: right; font-size: 65%; }
table.perfect a       { color: darkslategray; text-decoration: none; }
table.perfect .click  { cursor: pointer; }

/* PERFECT Style */
div.perfect       { display: inline-block; background-color: gainsboro; color: dimgray;
                    font-size: 80%; border: 1px solid teal; }
div.perfect h1    { text-align: center; background-color: teal; color: gold;
                    font-size: 110%; padding: 4px; margin: 0px; }
div.perfect table { padding: 10px; }
div.perfect th    { text-align: right; }
div.perfect p     { float: right; font-size: 70%; margin: 10px 0px 0px 0px; color: gray; }
div.perfect p a   { color: gray; text-decoration: none; }
div.perfect div   { text-align: center; }
input.click       { cursor: pointer; }