/* GENERAL */
*													{ margin: 0; padding: 0; }
html											{ overflow-y: scroll; }
body											{ font: 14px Helvetica, Sans-Serif; background: #888; }
#main-content							{ width: 1040px; margin: 10px auto; padding: 1px;  background: #0f0; -moz-border-radius: 20px; -moz-box-shadow: #222 5px 5px 5px; -webkit-border-radius: 20px; -webkit-box-shadow: #222 5px 5px 5px; position: relative; }
pre												{ width: 96%; overflow-x: auto; overflow-y: hidden; margin: 0 0 12px 0; padding: 15px; background: #eee; border: 1px solid #ccc; }
code											{ font: 11px Monaco, Courier, MonoSpace; background: #eee; }
ul												{ margin: 0 0 12px 30px; }
button										{ padding: 5px; }
button.selected						{ color: #00f; }
a { TEXT-DECORATION: none; }
a:hover { TEXT-DECORATION: underline; }

/* NAV */
#nav											{ width: 510px; list-style: none; overflow: hidden; margin: 0 auto 22px auto; }
#nav li										{ display: inline; }
#nav li a									{ display: block; float: left; padding: 8px; text-decoration: none; color: #000; background: #efefef; margin-left: 2px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
#nav li a.play						{ background: #070; color: #fff; }
#nav li a.use							{ background: #006; color: #fff; }
#nav li a.issue						{ background: #600; color: #fff; }
#nav li a:hover,
#nav li a.current					{ background: #444; color: white; }

#to-top										{ font: bold 40px Helvetica, Sans-Serif; text-decoration: none; position: fixed; top: 70px; left: 0px;width: 55px; height: 50px; background: #000; color: #fff; }

h1, h2, h3, h4, h5						{ font: bold 45px Verdana, Sans-Serif; text-align: center; letter-spacing: -1px; }
h1												{ width: 600px; margin: 0 auto 12px auto; font-family: 'Merienda One', cursive; }
h2												{ font-size: 60px; margin: 0 0 0 0; }
h3												{ font-size: 16px; text-align: left;  }
h4												{ font-size: 14px; text-align: left; margin-left: 6px; }
h5												{ font-size: 36px; margin: 0 0 6px 0; color: blue; }
sup												{ color: red; font-size: 30px; }
p, #use p.sections				{ margin: 0 0 0 0; text-align: left; }
#dl												{ position: absolute; top: 15px; right: 15px; text-decoration: none; background: #222; color: white; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; padding: 8px 14px; }
#dl:hover									{ background: #999; }
hr												{ margin-bottom: 20px; }
#use p,
.large p,
.small p									{ text-align: left; }
.info											{ margin: left auto; }
ul.info										{ width: 470px; }
div.info									{ width: 470px; float: right; border:  #00aa00 4px solid; padding: 8px; }
div.info ul, ul.info			{ list-style: disc; }
div.texte									{ width: 1015px; float: none; border: #333 1px solid; padding: 8px; background: #fff; }
div.paragraphe									{ float: none; padding: 8px; margin: 8px 0 8px 16px }
div.paragraphe2									{ float: none; padding: 8px; margin: 8px 200px 8px 200px;text-align: justify;  }

/* CODE HIGHLIGHTING */
.c-wrap										{ background: #f3a01e; }
.c-ovrly									{ background: #95421e; }
.c-small									{ background: #d05d2a; }
.c-large									{ background: #7c48b5; }
.c-zoom										{ background: #4b8db5; }
.c-commt									{ background: #9dc425; }
.c-commt2									{ color: #6b861a; }
span.cc										{ float: left; width: 10px; height: 14px; margin-right: 7px; }
code											{ line-height: 14px; }
ul												{ list-style: none; }

/* ZOOM CONTAINER */
.zoom											{ display: block; margin: 0 auto; }
.large										{ background: white; }

/* FOR IMAGE DEMO */
.small img								{ width: 1000px; height: 676px; }
.large img								{ width: 3127px; height: 2113px; }