/* General appearance */ * { font-family: Arial, sans-serif; font-size: 10pt; padding: 0px; margin: 0px; color: white; scrollbar-face-color: #1f1f1f; scrollbar-highlight-color: #1f1f1f; scrollbar-3dlight-color: #3f3f3f; scrollbar-darkshadow-color: #3f3f3f; scrollbar-shadow-color: #1f1f1f; scrollbar-arrow-color: #afafaf; scrollbar-track-color: #1f1f1f; } h1 { font-size: 16pt } h2 { font-size: 14pt } h3 { font-size: 12pt } h4 { font-size: 11pt } h5 { font-size: 11pt } h6 { font-size: 10pt } body { background-color: #000; color: #888; overflow: auto; } /* Page layout */ #extframe { position: absolute; top: 50%; left: 0px; width: 100%; height: 1px } .internal { margin-left: -475px; position: absolute; left: 50%; width: 950px; } #intframe { top: -280px; height: 560px; background-image: url(../img/background.jpg); background-repeat: no-repeat; } /* Footer (DCD link) */ #footer { top: 280px; text-align: center; font-size: 8pt; font-style: italic; padding: 2px 0 0 0; } #footer a,#footer a:visited { font-size: 8pt; text-decoration: none; color: white; } #footer a:hover { text-decoration: underline; } /* "Home" button */ #hbutton { display: block; position: absolute; top: 12px; left: 10px; width: 272px; height: 90px; background-color: transparent; } #hbutton span { display: none; } /* Current version text */ #version { position: absolute; top: 89px; left: 299px; width: 640px; height: 22px; font-size: 10pt; text-align: center; font-style: italic; font-weight: bold; } /* Log-in/player info box */ #lbox { position: absolute; top: 9px; left: 699px; width: 230px; height: 60px; text-align: right; font-size: 10pt; } #lbox a { color: white; text-decoration: none; font-style: italic; } #lbox a:hover { text-decoration: underline; } /* Menu and buttons */ a.mbutton { display: block; position: absolute; height: 21px; width: 250px; left: 14px; padding: 18px 0px; background-repeat: no-repeat; border-style: none; border-width: 0px; font-weight: bold; text-align: center; text-decoration: none; color: #ddd; background-position: 0px 0px; font-size: 12pt; } a.mbutton:hover { color: white; background-position: 0px -57px; } a#b0 { top: 136px; background-image: url(../img/button-0.png); } a#b1 { top: 193px; background-image: url(../img/button-1.png); } a#b2 { top: 250px; background-image: url(../img/button-2.png); } a#b3 { top: 307px; background-image: url(../img/button-3.png); } a#b4 { top: 364px; background-image: url(../img/button-4.png); } a#b5 { top: 421px; background-image: url(../img/button-5.png); } a#b6 { top: 478px; background-image: url(../img/button-6.png); } /* Content frame */ .cframe { position: absolute; left: 299px; top: 117px; width: 637px; height: 426px; overflow: auto; background-color: transparent; color: white; } .cframe.full-width { left: 15px; width: 921px; } .cframe.offline { height: 279px; top: 264px; overflow: hidden; } .cframe p { color: #CCCCCC; } .cframe ul,.cframe ol { margin: 0px 0px 0px 20px; padding: 0px 0px 0px 10px; } .cframe li { margin: 0px 0px 0px 20px; padding: 0px 0px 0px 0px; } /* Text in the content frame */ .cframe ul { list-style-type: square; } .cframe li { font-size: 10pt; } .cframe li:first-letter { font-size: 11pt; font-weight: bold; } .cframe p { margin: 5px 10px 5px 30px; text-align: justify; text-indent: 10px; font-size: 10pt; } .cframe p:first-letter { font-size: 11pt; font-weight: bold; } /* Tabs */ .tab-buttons { width: 100%; text-align: center; margin: 0 0 5px 0; padding: 5px 0 0 0; height: 20px; } a.tab-button { padding: 4px; margin: 1px 0 0 5px; background-color: #3f3f3f; border: 1px solid #7f7f7f; text-decoration: none; font-style: normal; } a.tab-button:hover { background-color: #4f4f4f; border-color: #8f8f8f; } a.tab-button.selected-tab,a.tab-button.selected-tab:hover { background-color: #7f7f7f; border-color: white; } /* Top/centered layer (title, planet links) */ div.top-centered { position: absolute; left: 330px; width: 320px; top: 10px; height: 50px; text-align: center; } #tc-title { font-weight: bold; font-size: 13pt; text-align: center; } div#tc-title { top: 30px; height: 30px; } span.special-info { color: red; font-weight: bold; } /* Forms */ .form-container { width: 509px; margin: 0 64px; } .full-width .form-container { width: 793px; margin: 0 64px; } .form-container table { width: 509px; table-layout: fixed; } .full-width .form-container table { width: 793px; } .form-field th,.form-submit th { text-align: right; vertical-align: middle; height: 16px; width: 200px; padding: 4px; font-weight: normal; } .form-field td { padding: 1px 2px 1px 0px; } .form-submit td { padding: 10px 0px 30px 0px; } .form-part th { padding: 30px 0 0 0; } .form-submit .input { padding: 5px 20px; } .form-submit .input:hover { padding: 5px 20px; border-color: #dfdfdf; background-color: #7f7f7f; } .form-extra td { padding: 4px 0px 0px 100px; text-align: justify; } .form-field .input { width: 100%; height: 20px; } .form-error td { font-size: 11pt; color: white; background-color: red; font-weight: bold; margin: 2px 0px; padding: 5px; } .input { border-style: solid; border-width: 1px; border-color: #afafaf; background-color: #3f3f3f; color: white; font-size: 10pt; margin: 1px 0px } /* Data display */ .data-table { width: 100%; margin: 0 0 10px 0; } .data-table th { text-align: right; padding: 2px 10px 2px 0px; font-weight: normal; color: #cccccc; width: 50%; } .data-table th.title { text-align: center; padding: 0px 0px 5px 0px; font-weight: bold; font-size: 12pt; color: white; } .data-table td.status { text-align: center; color: #cccccc; } /* List display */ .list-view { width: 573px; margin: 0 32px 20px 32px; border-collapse: collapse; } .list-view th,.list-view td { padding: 0; margin: 0; vertical-align: top; } .list-view .headers th { border-style: solid; border-color: white; border-width: 0 0 1px 0; } .list-view td { color: #cccccc; } /* Column layout */ .column { width: 310px } .left-column { float: left } .right-column { padding: 0 0 0 310px; } /* Misc */ div.auto-hide { padding: 2px 0px 5px 20px; } /* Map */ table.map { border: 1px solid white; border-collapse: collapse } .map td { border: 1px solid white; vertical-align: top } .map img { display: block; float: left; border: 0; padding: 0; margin: 0; border: 0 } .map a { display: block; text-decoration: none } .map a.own-planet { color: #afffaf; } .map a.allied-planet { color: #afafff; } .map a.other-planet { color: #ffffaf; } .map a.enemy-planet { color: #ffafaf; } .map-empty div { text-align: center; font-style: italic } div.map-invert { cursor: pointer; } .map div.map-invert a,.map div.map-invert a.own-planet,.map div.map-invert a.allied-planet,.map div.map-invert a.other-planet { color: black } div.map-bg-none { background-color: #cccccc } div.map-bg-allied { background-color: #afafff } div.map-bg-own { background-color: #afffaf } div.map-bg-other { background-color: #ffffaf } div.map-bg-enemy { background-color: #ffafaf } /* Map - 3x3 */ .map-0 { width: 540px; height: 540px; margin: 0 49px 0 48px; } .map-0 * { font-size: 9pt } .map-0 tr { height: 180px } .map-0 td { width: 180px } .map-0 div.map-planet { height: 36px; width: 100% } .map-0 img { height: 36px; width: 36px } .map-0 a { padding: 10px 0 0 41px } .map-0 .map-empty div { padding: 82px 0 0 0; } /* Map - 5x5 */ .map-1 { width: 600px; height: 600px; margin: 0 19px 0 18px; } .map-1 * { font-size: 6pt } .map-1 tr { height: 120px } .map-1 td { width: 120px } .map-1 div.map-planet { height: 24px; width: 100% } .map-1 img { height: 24px; width: 24px } .map-1 a { padding: 7px 0 0 27px } .map-1 .map-empty div { padding: 54px 0 0 0; } /* Map - 7x7 */ .map-2 { width: 595px; height: 595px; margin: 0 22px 0 22px; } .map-2 * { font-size: 4pt } .map-2 tr { height: 85px } .map-2 td { width: 85px } .map-2 div.map-planet { height: 17px; width: 100% } .map-2 img { height: 17px; width: 17px } .map-2 a { padding: 5px 0 0 19px } .map-2 .map-empty div { padding: 37px 0 0 0; } /* Fleets */ table.fleets-planet,table.fleets-moving { border: 1px solid white; border-collapse: collapse; margin: 0 0 20px 5px; width: 610px; } table.selected-fleets { border: 1px solid white; border-collapse: collapse; margin: 10px 0 20px 15px; width: 600px; } table.fleets-planet td { border: 1px solid white; } table.fleets-planet td.pic { width: 32px; height: 32px; } table.fleets-planet td.planet-data { width: 150px; text-align: center; } table.fleets-planet th.planet-name { text-align: left; font-weight: normal; padding: 0 0 0 5px; } table.fleets-planet p { padding: 8px 0px; margin: 0; text-align: center; } table.fleets-list { width: 100%; padding: 0; margin: 0; border-style: none; border-collapse: collapse; } table.fleets-list td,table.selected-fleets td { border-style: none; vertical-align: top; padding: 2px 0px; } table.fleets-moving th.mv-header { border-style: solid; border-width: 0px 0px 1px 0px; border-color: white; height: 32px; } table.fleets-list th,table.selected-fleets th { font-weight: bold; border-style: solid; border-width: 0px 0px 1px 0px; border-color: white; } table.fleets-list table.data-table th { text-align: right; padding: 2px 10px 2px 0px; font-weight: normal; color: #cccccc; width: 40%; border-style: none; } table.fleets-list .selector,table.selected-fleets .selector { width: 20px; text-align: center; } table.fleets-list .name,table.selected-fleets .name { text-align: left; } table.fleets-list .owner { text-align: left; width: 120px; } table.fleets-list .mode { text-align: center; width: 20px; } table.fleets-list .power,table.selected-fleets .power { text-align: right; width: 80px; } table.fleets-list .fltime,table.selected-fleets .fltime { text-align: right; width: 80px; } table.fleets-list .status { text-align: center; width: 80px; } table.fleets-moving .timeleft { text-align: right; width: 160px; } table.fleets-moving .destination { text-align: right; width: 160px; } table.selected-fleets .status { text-align: center; width: 60px; } table.selected-fleets .cloc { text-align: left; width: 190px; } .list-view .own-fleet,.list-view .own-fleet *,.own-fleet,.own-fleet * { color: #afffaf; } .list-view .allied-fleet,.list-view .allied-fleet *,.allied-fleet,.allied-fleet * { color: #afafff; } .list-view .enemy-fleet,.list-view .enemy-fleet *,.enemy-fleet,.enemy-fleet * { color: #ffafaf; } .fleet-ships table { margin: 0 0 5px 28px; width: 300px; border-collapse: collapse; } .fleet-ships table.data-table { margin: 0 0 5px 0; width: 280px; } .fleet-ships .ships-type { text-align: left; } .fleet-ships .ships-amount { text-align: center; width: 60px; } .fleet-ships .ships-power { text-align: right; width: 120px; } #fleet-actions { text-align: center; } /* Messages */ tr.unread-msg * { font-weight: bold; } tr.int-msg * { color: #ffffaf; } tr.admin-msg * { color: #ffafaf; } tr.alliance-msg * { color: #afafff; } tr.empire-msg * { color: #afafaf; } /* Research and technologies */ div.research-entry { padding: 0 0 15px 0; } div.research-entry div { padding: 0 0 0 20px; } div.research-entry div.title { color: white; font-size: 110%; font-weight: bold; padding: 0; } div.research-entry div.description { padding: 0 0 5px 20px; font-style: italic; } div.research-entry div.progress { padding: 0 0 5px 20px; } div.research-entry span.progress { font-weight: bold; color: white; } div.research-entry form.implement { padding: 5px 0 0 40px; } div.tech-category { padding: 0 0 15px 0; } div.technology { padding: 15px 0 0 20px; } div.technology div { padding: 0 0 0 20px; } div.technology div.title { color: white; font-size: 105%; font-weight: bold; padding: 0; } div.technology div.description { padding: 0; }