/**
 $Id: bosi.css 17188 2007-05-31 19:50:47Z tyardley $
 (C) 2006 DHC, Champaign, IL
 */

/** Default Element Styles ****************************************************/

body {
    font-size: 0.8em;
    font-family: Arial, "sans-serif";
}

/** Outside *******************************************************************/

body#osi {
    background-color: black;
    height: 100%;
    color: #999;
}

a:link, a:visited {
    color: #999;
}

a:hover, a:active {
    color: #fff;
}

div#osi-outside {
    max-width: 60em;
    margin: 0 auto;
    padding: 0;
    position: relative;
}

/** IE max-width hack */
div#osi-outside { width: 60em; }
* > div#osi-outside { width: auto; max-width: 60em; }

/** Header ********************************************************************/

div#osi-header {
    position: relative;
    background-color: black;
    background-repeat: no-repeat;
    background-position: top center;
    font-family: Verdana, sans-serif;
    margin: 1em auto 2em auto;

    height: 138px; /* height of the image */
    width: 696px; /* width of the image */
    background-image: url("../images/header.gif");
    color: #fff;
}

div#osi-header.osi-smallheader {
    height: 81px; /* height of the image */
    background-image: url("../images/header-small.gif");
    margin-bottom: 1em;
}

div#osi-header div#home {
    text-align: left;
    position: absolute;
    padding: 0.5em;
    top: 0;
    right: 70px; /* based on background image... eech */
}

div#osi-header div#home a:link, div#osi-header div#home a:visited {
    color: #000;
    font-weight: normal;
}
div#osi-header div#home a:active, div#osi-header div#home a:hover {
    color: #fff;
}

div#osi-header a:link, div#osi-header a:visited {
    color: #92499e;
    font-size: 1.1em;
    font-weight: bold;
}

div#osi-header h1 {
    position: absolute;
    bottom: 0.25em;
    right: 2em;
    padding: 0;

    font-size: 2em;
    font-weight: normal;
    color: inherit;
}

img#osi-print-logo {
    display: none;
}

/** Footer ********************************************************************/

div#osi-footer {
    font-family: Verdana, sans-serif;
    font-size: 0.9em;
    margin: 0;
}

div#osi-footer-netinfo {
    position: relative;
    color: #000;
    font-size: 1em;
    text-align: center;
    margin: 1em 4em 0.5em 4em;
    padding: 0.5em 0;
    background-color: #6cb600;
}

div#osi-footer-netinfo a:link, div#osi-footer-netinfo a:visited {
    color: #000;
}
div#osi-footer-netinfo a:active, div#osi-footer-netinfo a:hover {
    color: #fff;
}

div#osi-footer-copyright {
    text-align: right;
    padding: 0.5em 1em 0 1em;
    margin: 0;
}

div#osi-faq {
    position: absolute;
    left: 5em;
    bottom: 5em;
}

div#osi-faq img {
    border: none;
    display: block;
}

/** Process / Interactive Steps ***********************************************/

div#proc-steps, div#interactive-steps {
    padding-top: 4em;
    width: 12em;
}

ul#proc-list, ul#interactive-list {
    font-size: 1em;
    padding: 0 1em 0 0;
    list-style-type: none;
}

#proc-list li, #interactive-list li {
    text-align: right;
    margin: 0;
    padding: 0;
    padding-right: 1.5em;
    background-position: right center;
    background-repeat: no-repeat;
}

#proc-list li {
    background-image: url('../images/bullet-gray.gif');
}

#proc-list li.active {
    list-style-type: none;
    background-image: url('../images/bullet-white.gif');
}

#proc-list li.active a, #interactive-list li.active a {
    color: #ebab00;
    font-size: 1.1em;
    font-weight: bold;
}

#proc-list li.completed {
    list-style-type: none;
    background-image: url('../images/bullet-green.gif');
}

#proc-list li.failed {
    list-style-type: none;
    background-image: url('../images/bullet-red.gif');
}

#proc-list li.failed a,
#proc-list li.failed a:link,
#proc-list li.failed a:visited {
    color: #900;
    font-weight: bold;
}

#proc-list li.available {
    list-style-type: none;
    background-image: url('../images/bullet-gray.gif');
}

#interactive-list li a, #interactive-list li a:link, #interactive-list li a:visited,
#proc-list li a, #proc-list li a:link, #proc-list li a:visited {
    font-size: 1em;
    color: #999;
    text-decoration: none;
}

#interactive-list li a:hover, #interactive-list li a:active,
#proc-list li a:hover, #proc-list li a:active {
    color: #fff;
    text-decoration: inherit;
}

/** Page Body *****************************************************************/

#proc-body, #body, #interactive-body {
    background-color: #fff;
    color: #000;
    padding: 1em;
}

#body a:link, #proc-body a:link, #interactive-body a:link {
    color: #821f93;
}

#body a:visited, #proc-body a:visited, #interactive-body a:visited {
    color: #821f93;
}

#body a:hover, #body a:active,
#proc-body a:hover, #proc-body a:active,
#interactive-body a:hover, #interactive-body a:active {
    color: #000;
}

/** Errors ********************************************************************/

/* These error classes can be applied to <ul> or <p> */

div.msg-error, div.msg-warn, div.msg-info {
    position: relative;
    padding: 1em;
    margin: 0 1em;
    font-weight: bold;
}

.msg-error {
    color: #900;
}

.msg-error {
    background-color: #900;
    color: #fff;
}

.msg-warn {
    color: #000;
    background-color: #ebab00;
}

.msg-info {
    color: #000;
    background-color: #6cb600;
}

/** Make the formerror blend more naturally with our msg-error */
span.formerror {
    color: #900;
    font-weight: bold;
}

.msg-error span.formerror {
    color: #fff;
}

/** PHP-generated errors */
.php-error {
    background-color: #000;
    color: #fff;
}

/** Heading Elements **********************************************************/

h1, h2, h3, legend {
    font-family: Tahoma, Verdana, Arial, sans-serif;
    font-weight: normal;
    margin: 0;
}

h2 {
    font-size: 1.75em;
    padding: 0.25em;
    margin: 0.25em;
    color: #ebab00;
}

h3 {
    font-size: 1.5em;
    padding: 0.5em 0em;
    margin: 0;
    color: #92499e;
    background-image: none; /* no silly gray gradient */
}

/** Miscellaneous *************************************************************/

p.overpadded {
    padding-left: 4em;
    padding-right: 4em;
}

.promo {
    font-weight: bold;
    border-bottom: 2px solid #6cb600;
}

/* <form><table> for formatting between <label> and <input|select> */
form table {
    border-collapse: separate;
}

form label {
    white-space: nowrap;
}
/** Opera defaults buttons to big text */
input[type="submit"] {
    font-size: 1.2em;
}

/** tooo badddd IE can't style buttons */
form .continue input[type="submit"],
form .continue input[type="submit"]:active {
    background-color: #fff;
    color: #92499e;
    border: none;
    font-weight: bold;
    width:auto;
    overflow:visible;
    background-image: url("../images/arrow.gif");
    background-repeat: no-repeat;
    background-position: 3px center;
    padding: 3px 3px 3px 18px; /* 15px image on the left */
    margin: 0;
    cursor: pointer;
}

input.button {
    width:0;
}    
/* <form><p> is used for padding/spacing */
form p {
    margin: 0;
    padding: 0.5em 1em;
}

/* <fieldset> gives us a pretty gold border */
fieldset {
    border: 1px solid #ebab00;
    padding: 0.5em 1em 1em 1em;
    margin: 0.5em 0;
}

/* mimic the fieldset */
div.fieldset {
    margin: 1.5em 0;
    padding: 1em;
    border: 1px solid #ebab00;

}

/* Tables for Layout Weeeee! */
table.layout {
    width: 100%;
    padding: 0;
    border: none;
    border-collapse: collapse;
}

/* <legend> is a category label for <fieldsets> */
legend {
    font-size: 1.1em;
    font-weight: bold;
    padding: 0;
    margin: 0.25em 3em 0.25em 1em;
    color: #6cb600;
}

/* the "clicky here to log out" button <div> */
#bailout {
    position: absolute;
    bottom: 1em;
    right: 1em;
    text-align: right;
    font-size: 0.9em;
    font-family: Verdana, Arial, sans-serif;
}

/** Site Selection ************************************************************/

ul.sitechoice {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

ul.sitechoice li {
    display: block;
    height: 3.5em;
    position: relative;
    border-bottom: 1px solid #ebab00;
    margin: 0.25em 0.25em 0.75em 0.25em;
}

ul.sitechoice input {
    position: absolute;
    left: 0.25em;
    bottom: 1.75em;
}

ul.sitechoice div.sitechoice-name {
    position: absolute;
    left: 2em;
    bottom: 1.75em;
}
ul.sitechoice div.sitechoice-address {
    position: absolute;
    right: 0.25em;
    bottom: 1.75em;
}

ul.sitechoice div.sitechoice-website {
    position: absolute;
    right: 0.25em;
    bottom: 0.25em;
    width: 50%;
    text-align: right;
    overflow: hidden;
    white-space: nowrap;
}

ul.sitechoice div.sitechoice-company {
    position: absolute;
    left: 2.25em;
    bottom: 0.25em;
    width: 50%;
    text-align: left;
    overflow: hidden;
    white-space: nowrap;
}


ul.sitechoice label {
    font-weight: bold;
    display: block;
    font-size: 1.2em;
}

/** Package Tree **************************************************************/


table.pkgpath {
    border-collapse: collapse;
    padding: 0;
    width: 100%;
    background-color: #fff;
    margin: 0.5em 0;
}

table.pkgpath td {
    padding: 3px 5px;
}

table.pkgpath tr.pkgrow-top {
    font-weight: bold;
}

table.pkgpath tr.pkgrow-bottom td {
    border-bottom: 1px solid #ebab00;
}


table.pkgpath th {
    color: #000;
    padding: 3px 5px;
    font-size: 1.1em;
    text-align: left;
    border-bottom: 2px solid #6cb600;
}

table.pkgpath td.pkgchoose {
    width: 3em;
    overflow: hidden;
    border-left: 2px solid #6cb600;
    border-bottom: none !important; /* override tr.pkgrow-bottom */
    vertical-align: top;
}


table.pkgpath th span.pkgqualifier {
    font-size: 0.8em;
    font-weight: bold;
}

table.pkgpath span.pkgqualifier a:link, table.pkgpath span.pkgqualifier a:visited {
    color: #821f93 !important;
}


table.pkgpath a.addon:link, table.pkgpath a.addon:visited {
    font-size: 0.8em;
}

table.pkgpath .pkgname label {
    font-size: 1.1em;
}

table.pkgpath .pkgname span.pkgquantity {
    font-size: 1.1em;
    font-weight: normal;
    padding-left: 2em;
}

table.pkgpath .pkgname span.pkgquantity input {
    vertical-align: middle;
    margin: -2px;
}

table.pkgpath .pkgnone {
    font-size: 1.1em;
}

table.pkgpath .pkgprice {
    text-align: right;
}

table.pkgpath .pkgerror {
    background-color: #900;
    color: #fff;
    font-weight: bold;
}

table.pkgpath input.upsell {
    margin: 0 auto;
    font-family: inherit;
    width: 1em;
    padding: 0.1em 0.25em;
}

/** Package Invoice ***********************************************************/

table.invoice-table td {
    vertical-align: top;
}

.invoice-label {
    font-weight: bold;
    text-align: right;
    white-space: nowrap;
    width: 6em;
}
.invoice-label:after {
    content: ":";
}

/** User Service Agreement (Confirmation) *************************************/

#usa {
    padding: 0;
    height: 40em;
}

#usa legend {
    margin-left: 1em; /** compensate for the lost padding */
}

#usa iframe {
    width: 100%;
    height: 90%;
    border: none;
    margin: 0;
}

#usa a {
    display: block;
    text-align: right;
    padding: 0.1em 2em;
}

#usa-ack label {
    font-weight: bold;
}

#confirm_wait {
    font-size: 1.75em;
    color: #ebab00;
    text-align: center;
    padding: 0 1.5em;
}

/** FAQ ***********************************************************************/

dl.faq dt {
    font-weight: bold;
}

dl.faq dd {
    margin: 0 0 1em 0;
    padding: 0;
}

/** My Account ****************************************************************/

fieldset#suspended {
    border-color: #700;
    border-width: 3px;
}

fieldset#suspended legend {
    background-color: #700;
    color: #fff;
    /* flip padding/margin because the background is colored */
    margin: 0;
    padding: 0.25em 3em 0.25em 1em;
}

/** Print-specific styles *****************************************************/

@media print {
    #interactive-body, #proc-body {
        margin-left: 0;
    }

    div#osi-header {
        height: auto !important;
        margin: 0;
        padding: 0;
    }

    div#proc-body, div#interactive-body, div#body, div#proc-frame {
        padding: 0;
        margin: 0;
    }

    img#osi-print-logo {
        display: block !important;
    }

    img,
    #home,
    #interactive-steps,
    #proc-steps
    {
        display: none !important;
    }
}

/** EOF ***********************************************************************/

