/* *********************************** STRUCTURE *********************************** */

body { font: small/1.3 Verdana, Arial, sans-serif; margin: 0; padding: 2em; }

a:hover { border-bottom: 0px solid; }

p { margin: 1em 0; padding: 0; }

.skip { left: -99999em; position: absolute; top: -99999px; }

#structure { margin: 0 auto; max-width: 100%; width: 60em; }

#header { border-bottom: 0.2em solid; clear: both; float: left; line-height: 1; width: 100%; }

#header h1 { float: left; font-size: 1.5em; font-weight: normal; margin: 0; padding: 1.25em 0 1.25em 1.3em; }

#logo { float:right; margin-right: 0.5em; margin-top: 1em; border: 1px solid #111; }



/*
  EM >>  2em  +  40em  +  2em  +  14em  +  2em  = 60em
  %  >> 3.34% + 66.67% + 3.32% + 23.33% + 3.34% = 100%
*/

#main { clear: left; float: left; margin: 1em 0 1em 3.34%; width: 66.67%; }

#supplement { clear: right; float: right; margin: 1em 3.34% 1em 0; width: 23.33%; }

#supplement ul { border: 1px solid; margin: 1em 0; padding: 1em 0; }

#supplement li { margin: 0.5em 0; padding: 0; }

#footer { border-top: 1px solid; clear: both; font-size: 0.9em; padding: 0.5em 0 1em; }

/* fix ie */

* html #content { height: 1%; }

* html #main { margin-left: 1.67%; }

* html #supplement { margin-right: 1.67%; }

/* small */

body.small { padding: 0; }

body.small #structure { width: 100%; }

/* smaller */

body.smaller #structure { padding-bottom: 2em; }

body.smaller #header { float: none; text-align: center; }

body.smaller #header h1 { float: none; padding: 1.5em 0 0.5em; }

body.smaller #nav { float: none; padding: 0 0 3em; }

body.smaller #main { margin: 1em 5% 0; width: 90%; }

body.smaller #supplement { margin: 0 5% 1em; width: 90%; }

body.smaller #footer { background: none; border: none; padding: 0; }

/* *********************************** STYLE *********************************** */

body { background: #777; color: #222; }

a { color: #d72c34; text-decoration: none; }

a:hover { border-color: #fbe; color: #000; }

#structure { background: #fff; }

#header { background: #111; border-color: #d72c34; color: #fff; }

#header h1 { font-weight: normal; text-transform: capitalize; }

#main { text-align: left; }

#pic { float: left; margin-right: 6px; margin-bottom: 4px; border: 1px solid #d72c34; }

#supplement ul { background: #e2e2e2; border-color: #d72c34; list-style: none; }

#supplement li { list-style: none; text-align: center; }

#footer { background: #e2e2e2; border-color: #d72c34; color: #111; text-align: center; }

#credit { color: ffffff; text-align:center; padding: 1.2em 0 1.2em; }

#credit:a {color: #ffffff; }

#credit:hover {color: #d72c34;}