* { margin: 0; padding: 0; border: 0; outline: 0; } html, body { height: 100%; width: 100%; font-size: 100%; overflow: hidden; } body { background: #A7A7A7 url(images/background.gif) repeat-y center; text-align: left; font-family: Arial; color: #000; } a { text-decoration: none; font-weight: bold; } a:link { color: #383838; text-decoration: underline; } a:hover, a:active { color: #000; text-decoration: none; } a:visited, a:visited:hover { color: #545454; } p a:hover, p a:active { text-decoration: underline; } acronym, abbr { border-bottom: dotted 1px; cursor: help; } h1,h2,h3,h4,h5,h6 { font-weight: bold; } h1 { font-size: 2em; } h2 { font-size: 1.5em; } h3 { font-size: 1.4em; } h4 { font-size: 1.2em; } h5 { font-size: 1.1em; } h6 { font-size: 1em; } p { font-family: "Tahoma"; text-align: justify; font-size: 0.8em; line-height: 1.4em; word-spacing: 1px; } button { background-color: #FFF; border: 1px #000 solid; border-bottom-width: 2px; border-right-width: 2px; padding: 2px 6px; cursor: pointer; font-weight: bold; } button:hover, button:active { color: #FFF; background-color: #000; } input { border: #000 solid 1px; padding: 1px; margin: 1px; background-color: #FFF; } #start { position: absolute; top: 45%; left: 0; width: 100%; font-size: 1.1em; text-align: center; } .window { position: absolute; top: 10%; left: 25%; width: 50%; height: 60%; } .window .top, .window .bottom { height: 6px; position: relative; font-size: 1px; left: 0; } .window .top { top: 0; } .window .bottom { bottom: 0; } .window .top .topcenter { display: block; margin: 0 6px; height: 6px; background: transparent url(images/top.gif) repeat-x 0 0; cursor: n-resize; } .window .bottom .bottomcenter { display: block; margin: 0 6px; height: 6px; background: transparent url(images/bottom.gif) repeat-x 0 0; cursor: n-resize; } .window .top .topleft, .window .top .topright, .window .bottom .bottomleft, .window .bottom .bottomright { height: 6px; width: 6px; position: absolute; top: 0; } .window .top .topleft { left: 0; background: transparent url(images/topleft.png) no-repeat 0 0; cursor: nw-resize; } .window .top .topright { right: 0; background: transparent url(images/topright.png) no-repeat 0 0; cursor: ne-resize; } .window .bottom .bottomleft { left: 0; background: transparent url(images/bottomleft.png) no-repeat 0 0; cursor: sw-resize; } .window .bottom .bottomright { right: 0; background: transparent url(images/bottomright.png) no-repeat 0 0; cursor: se-resize; } .window .barre { height: 17px; background: #5D5D5D url(images/barre.gif) repeat-x 0 0; border-left: #707070 1px solid; border-right: #707070 1px solid; } .window .barre:active, .window .barre:focus { cursor: move; } .window .barre .button { float: right; margin-right: 10px; height: 13px; } .window .barre .button * { float: left; width: 30px; height: 13px; margin: 0 2px; background: transparent none no-repeat 0 0; overflow: hidden; cursor: pointer; } .window .barre .button *:hover { background-position: 0 -13px; } .window .barre .button *:active { background-position: 0 -26px; } .window .barre .button .close { background-image: url(images/close.gif); } .window .barre .button .full { background-image: url(images/full.gif); } .window .barre .button .hide { background-image: url(images/hide.gif); } .window .barre .titre { font-size: 14px; color: #FFF; font-weight: bold; float: left; padding-left: 20px; position: relative; bottom: 3px; } .window .content { position: relative; border-left: #707070 1px solid; border-right: #707070 1px solid; overflow: auto; height: 100%; background-color: #FFFFFF; padding: 10px; text-align: justify; clear: both; } #barre { position: absolute; z-index: 200000; bottom: 0; left: 0; width: 100%; background-color: #4D4D4D; height: 25px; border-top: #FFF 1px solid; } #barre div { float: left; padding: 1px 10px; width: 150px; font-size: 13px; color: #BCBCBC; height: 15px; font-weight: bold; margin: 3px 2px 0 2px; border: #282828 1px solid; overflow: hidden; cursor: pointer; text-align: center; } #barre div:hover { background-color: #393939; color: #FFFFFF; } #menu { position: absolute; top: 10%; left: 0; } #menu li { list-style-type: none; width: 180px; font-size: 13px; font-weight: bold; color: #000; background-color: #FFF; margin: 3px 0 3px 10px; padding: 3px 0 3px 20px; text-align: left; cursor: pointer; border-left: 3px solid #FFF; } #menu li:hover { border-color: #000; } #darkness { position: absolute; z-index: 100000; width: 100%; height: 100%; background-color: #000; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; opacity: 0; } #dialog { position: absolute; z-index: 100000; padding: 2% 3%; width: 20%; left: 37%; top: 35%; background-color: #FFF; text-align: center; font-size: 14px; font-weight: bold; -moz-border-radius: 3px; -webkit-border-radius: 3px; } #dialog button { float: right; margin: 15px 0 0 20px; } #dialog .quit { display: block; position: absolute; top: 3px; right: 3px; width: 12px; height: 12px; background: #FFF url(images/cancel.gif) no-repeat 0 0; cursor: pointer; overflow: hidden; } #dialog .quit:hover { background-position: 0 -12px; } #ressources { position: absolute; top: 0; left: 0; padding-left: 5%; width: 95%; font-size: 0.8em; } #ressources div { text-align: center; float: left; padding: 4px 0; width: 18%; background-color: #FFF; border: 1px solid #000; border-top-width: 0; margin: 0 2%; font-weight: bold; -moz-border-radius-bottomleft: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-left-radius: 4px; -webkit-border-bottom-right-radius: 4px; } #ressources div strong { font-weight: normal; } #planetes { position: absolute; top: 10%; right: 20px; width: 100px; } #planetes .up, #planetes .down { display: block; width: 15px; height: 15px; background: transparent url(images/up.gif) no-repeat 0 0; cursor: pointer; margin: 0 auto; } #planetes .up:hover, #planetes .down:hover { background-position: 0 100%; } #planetes .down { background-image: url(images/down.gif); } #planetes img { display: block; height: 75px; width: 75px; border: 1px solid #000; cursor: pointer; margin: 10px auto; } #planetes img:hover { border-color: #FFF; } #planetes img.selected { border: 3px #FFF solid; } p#notification { position: absolute; z-index: 100000; right: 10px; bottom: -110px; width: 250px; height: 100px; padding: 10px 20px; background-color: #000; color: #FFF; font-weight: bold; text-align: center; filter: alpha(opacity=80); -moz-opacity: 0.8; -khtml-opacity: 0.8; opacity: 0.8; -moz-border-radius: 2px; -webkit-border-radius: 2px; } .window dl.menu { width: 30%; height: 97%; padding-top: 2%; float: left; list-style-type: none; background-color: #F2F2F2; font-size: 0.8em; } .window dl.menu dt { font-weight: bold; font-size: 1.2em; padding-left: 2%; margin-bottom: 8px; } .window dl.menu dd { margin: 0 0 1px 4%; padding: 3px 0 3px 14px; cursor: pointer; background: transparent url(images/li.gif) no-repeat 0 center; font-size: 0.9em; font-weight: bold; } .window dl.menu dd:hover, .window dl.menu dd.selected { background: #FFF url(images/li2.gif) no-repeat 0 center; } .window .description { width: 70%; float: right; } .window .description h4 { font-size: 0.9em; padding-left: 10%; float: left; margin-top: 100px; } .window .description img { float: right; margin: 5% 5% 25px 0; cursor: help; } .window .description p { clear: both; margin: 0 25px; } .window .description button { float: right; margin: 20px 10% 0 0; } .window .info { text-align: center; } #background { position: absolute; top: 25px; left: 230px; height: 100%; width: 100%; } #background .content { border: 1px #8E8D8D dotted; width: 100%; height: 80%; } #resize { border: #000 1px solid; position: absolute; top: 0; left: 0; z-index: 100000000; } #console { position: absolute; right: 2px; bottom: 2px; width: 50%; height: 50%; z-index: 100000000; background-color: #000; filter: alpha(opacity=80); -moz-opacity: 0.8; -khtml-opacity: 0.8; opacity: 0.8; }