/* ****************************************************************************** * Copyright © 1996-2006 SealedMedia Limited. * * All Rights Reserved. * * * * This document contains copyrighted and/or trade secret and confidential * * information which is the property of SealedMedia Limited. No part of * * this document may be reproduced, copied, edited , disclosed, transmitted, * * stored in a retrieval system or translated into any human or computer * * language in any form, by any means, in whole or in part, without the * * prior express written consent of SealedMedia Limited. * * * ****************************************************************************** ****************************************************************************** * This is a customizable file subject to the licensing terms of the * * SealedMedia Management Website and related extensions. Please refer to * * your SealedMedia representative for details of extension licensing. * * * * Backup this file before making any changes or upgrading the * * SealedMedia Management Website. * * * * You are solely responsible for any errors, damages, inaccuracies or loss * * of data that may result from editing this file. SealedMedia recommends * * that you test your changes thoroughly. * ****************************************************************************** IE is plain weird when it comes to CSS. A lot of its weirdness can be explained by the mysterious 'hasLayout' property which gets an excellent write up here: http://www.satzansatz.de/cssd/onhavinglayout.html Any rule below that begins with an underscore is an IE specific style that will only be observed by IE and ignored by other browsers. These have been kept to a minimum but one or two are inevitable. The underscore hack is described here: http://www.wellstyled.com/css-underscore-hack.html */ * { margin: 0; padding: 0; } body { background: #eee url(/images/bg.gif); color: black; line-height: 1.3em; font-size: 76%; font-family: verdana, arial, sans-serif; } /* Page structure */ #container { width: 60em; border: 1px solid #999; margin: 15px auto; background: #fff; padding: 10px 20px; } #navContainer { width: 18%; height: 400px; float: left; } #pageContent { margin-left: 21%; _width: 78.2%; } #pageEnd { clear: both; } /* Main page body styles */ a { color: #00086E; } a:visited { color: #039; } a:hover { color: #A20106; } #pageHeader h1 { color: #00086E; border-bottom: 2px solid #00086E; padding: 12px 0px; margin-bottom: 18px; background: url(/custom/org_logo.gif) no-repeat right; } .pageTitle { color: #00086E; margin-bottom: 1em; font-size: 1.8em; font-weight: normal; } #pageContent p { margin-bottom: 1em; } #pageContent .sectionTitle { color: #009; font-size: 1.1em; margin-bottom: 0.1em; margin-top: 1em; } #pageContent ul,ol { margin: 0em 0 1em 1.4em; padding-left: 3px;} #pageContent .captionedImg { font-size: 0.8em; text-align: center; margin: 1.5em auto; } .smallText { font-size: 0.9em; } .separator { width: 100%; height: 0px; margin: 1.4em 0em 1.2em 0em; border-top: 1px solid #aaa; border-bottom: 1px solid #fff; } .errorMsg { border: 1px solid #b00; padding: 5px 5px 5px 50px; color: #b00; min-height: 2.5em; _height: 2.5em; background: #FFF8f0 url(/images/error_triangle.gif) 9px 7px no-repeat; margin-bottom: 1.5em; } .updateMsg { border: 1px solid #007; padding: 5px 5px 5px 43px; color: #007; min-height: 2.2em; _height: 2.2em; background: #fafafd url(/images/info_i.gif) 9px 7px no-repeat; margin-bottom: 1.5em; } .bigBttn { background: #2D4988 url(/images/button_bg.gif) repeat top; height: 20px; cursor: hand; color: #fff; padding: 0px 4px 3px 4px; _padding: 0px; margin: 0; border-bottom: 1px solid #335; border-right: 1px solid #335; border-left: 1px solid #bbc; border-top: 1px solid #bbc; } /* box corner curving */ .roundedLine { position: absolute; width: 5px; height: 5px; z-index: 1; background: #0ff; } .roundedLine.tlRed { background: url(/images/round_line_red_tl.gif) no-repeat top left; left: -2px; top: -2px; } .roundedLine.trRed { background: url(/images/round_line_red_tr.gif) no-repeat top right; right: -2px; top: -2px; } .roundedLine.blRed { background: url(/images/round_line_red_bl.gif) no-repeat bottom left; left: -2px; bottom: -2px; } .roundedLine.brRed { background: url(/images/round_line_red_br.gif) no-repeat bottom right; right: -2px; bottom: -2px; } .roundedLine.tlGrey { background: url(/images/round_line_grey_tl.gif) no-repeat top left; left: -2px; top: -2px; } .roundedLine.trGrey { background: url(/images/round_line_grey_tr.gif) no-repeat top right; right: -2px; top: -2px; } .roundedLine.blGrey { background: url(/images/round_line_grey_bl.gif) no-repeat bottom left; left: -2px; bottom: -2px; } .roundedLine.brGrey { background: url(/images/round_line_grey_br.gif) no-repeat bottom right; right: -2px; bottom: -2px; } /* navigation */ #nav { font-size: 0.9em; margin-top: 2px; line-height: 1.2em; } #nav li a { display: block; padding: 3px 1px 3px 7px; text-decoration: none; } #nav li.level1 { border-bottom: 1px solid #999; background: #eee; } #nav li.level1.active { background: #d5d5d5 url(/images/arrow_right.gif) no-repeat 0px 7px; font-weight: bold; } #nav li.level1 a:hover { color: #00a; background: #bbb url(/images/arrow_right.gif) no-repeat 0px 7px; } #nav ul.level1 { border-top: 1px solid #999; list-style: none; } #nav ul.level2 { display: none; } /* hide level2 nav unless it is active */ #nav ul.level2.active { display: block; } #nav li.level2 { margin-left: 24px; list-style: disc; } #nav li.level2 a { padding: 0px 1px 2px 0px; font-weight: normal; } #nav li.level2 a:hover { background: #bbb; } * html #nav a { height: 1px; } /* IE fix: set hasLayout=true for all the elements */ /* Tables */ #sealedFormats { border-collapse: collapse; border: 1px solid #aaa; width: 320px; margin: 0 auto 1em auto; text-align: center; } #sealedFormats td { border-top: 1px solid #aaa; padding: 3px; } #sealedFormats thead { background: #eef; } #sealedFormats .app { font-weight: bold; text-align: left; padding-left: 10px; } #sealedFormats thead td.app { font-weight: normal; } #diagnosticInfo { text-align: center; } #diagnosticInfo table { border-collapse: collapse; width: 400px; margin: 1em auto; background: white; } #diagnosticInfo thead td { text-align: center; font-weight: bold; background: #ddd; } #diagnosticInfo td { border: 1px solid #aaa; padding: 3px; font-size: 12px; } #contextName { font-weight: bold; font-style: italic; } #sealedContent { margin: 0em auto 1em auto; } #sealedContent td { padding: 0 3px; } #downloadButton { width: 100px; margin: 0 auto; } /* help pages */ #answers ul.a { padding: 0; margin: 0; } #answers li.q,li.a { list-style: none; margin-left: 1.6em; text-indent: -1.6em; } #answers li.q { color: #00086E; font-style: italic; font-weight: bold; margin-top: 1em; } #answers li p { margin-bottom: 0.5em; } #answers li p.two,p.three { text-indent: 0; } #answers li ul { margin-top: 0em; } #answers li li { list-style: disc; text-indent: 0; } /* user_rights page */ #searchField { width: 200px; margin: 0 0.5em; } #rightsTable { border: 1px solid #779; margin: 6px 0;} #rightsTable td { padding: 1px 20px 1px 3px; vertical-align: top; } #rightsTable td.header { background: #779; color: #fff; } #rightsTable td.shaded { background: #fff; } div.greyBox { position: relative; border: 1px solid #999; padding: 5px 10px; background: #f6f6fd; _width: 95%; } /* reset password pages */ .boxWrapper { margin: 1.5em auto; } #emailForm { border: 1px solid #999; position: relative; height: 22px; padding: 6px; text-align: center; } #emailForm #email { margin: 0 0.3em; } #passwordForm table { margin: 0 auto; } #passwordForm td.fieldName { margin: 0 auto; width: 70px; background: #e6e6f6; padding-left: 2px; } #passwordForm .bigBttn { margin-top: 0.3em; } #tokenLink a { font-size: 0.8em; color: #999; text-align: center; } #progressMeter { font-size: 0.9em; font-family: verdana, arial, helvetica, sans-serif; color: #999; height: 85px; width: 48em; margin: 3em auto 0 auto; background: url(/images/blob_line.gif) no-repeat left 2em;} #progressMeter ul { margin-left: 2em; } #progressMeter li { display: block; float: left; line-height: 1.2em; width: 9em; height: 5em; margin: 0 8px; } #progressMeter li span { background: #fff; border: 1px solid #999; display: block; height: 4em; position: relative; } #progressMeter li.active { background: url(/images/arrow_red_up.gif) no-repeat center bottom; } #progressMeter li.active span { border: 1px solid #c00; color: #c00; } /* To center an element vertically and horizontally within it's parent you can surround it with two div elements, the outer one with a class of centerMeOuter and the inner most one with a class of centerMeInner. Non-IE browsers understand the use of a table and table cell, with vertical-align: middle. IE ignores these. Instead for IE we make use of the underscore hack (described above) and shift the first div down by half the parent height, then the second div up by half the height of the first div (which should be the height of what you are trying to center). */ .centerMeOuter { display: table; position: absolute; height: 100%; width: 90%; left: 5%; _height: 0%; _top: 50%; } .centerMeInner { display: table-cell; position: relative; _top: -50%; text-align: center; vertical-align: middle;}