﻿/* Stylesheet updates may be ignored if page still has style in cache.
    Clear cache by using "CTRL+F5".*/
body {
    margin: 0 auto;
    background: url(../images/background_shaded_grey.bmp) top repeat-y;
    width: 100%;
    color: #000;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px; /*smaller*/
    text-align: center;
    background-color: #B8B8B8;
}

h1, .h1 {
    color: #003365;
    font-family: "Times New Roman", Times, serif;
    font-size: 24px; /*x-large*/
    font-weight: bold;
    margin: 4px;
}

h2, .h2 {
    color: #DD7C3B;
    font-family: "Times New Roman", Times, serif;
    font-size: 18px; /*large*/
    font-weight: bold;
    margin: 4px;
}

h3, .h3 {
    color: #336699;
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    font-weight: bold;
    margin: 4px;
}

h4, .h4 {
    font-family: "Times New Roman", Times, serif;
    color: #003365;
    font-size: 16px; /*medium*/
    margin: 0px 0px -3px 20px;
}

h5, .h5 {
    font-family: "Times New Roman", Times, serif;
    color: #DD7C3B;
    font-size: 13px; /*small*/
    margin: 0px;
}

h6, .h6 {
    font-family: "Times New Roman", Times, serif;
    color: #000000;
    font-size: 16px; /*medium*/
    margin: 4px;
}

h7, .h7 {
    font-family: "Times New Roman", Times, serif;
    color: #FF0000;
    font-size: 13px; /*small*/
    margin: 0px;
}

.boldText {
    font-weight: bold;
}

.errorText {
    color: #FF0000;
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    font-weight: bold;
    margin: 4px;
}

.errorTextNoBold {
    color: #FF0000;
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    margin: 4px;
}

input, select, option, textarea {
    font-size: 13px; /*small*/
    font-family: arial,helvetica;
}

/* end overall settings */

/* Master Page Settings */
.framedContainer {
    width: 920px;
    height: 100%;
    background-color: #fff;
    margin-left: auto;
    margin-right: auto;
}

.masterContainer {
    border: 0px solid #000;
    float: none;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0px;
    text-align: center;
    z-index: 15;
}

.masterHeader {
    float: none;
    width: 100%;
    height: 93px;
    text-align: right;
    background-color: #003365;
}

.masterleft {
    float: left;
    width: 250px;
    height: 92px;
    top: 0px;
    left: 0px;
    text-align: left;
}

.masterLogo {
    float: left;
    width: 250px;
    height: 70px;
    top: 0px;
    left: 0px;
    text-align: left;
}

.master_otb {
    float: left;
    width: 250px;
    height: 22px;
    top: 0px;
    left: 0px;
    text-align: left;
}

.topMenu {
    background-color: #003365;
    float: left;
    width: 670px;
    height: 100%;
    z-index: 5;
    margin: 0px;
    text-align: center;
}

.topheader {
    float: none;
    width: 670px;
    height: 40px;
}

.topPortalHyperlink {
    float: left;
    text-align: left;
    margin: 10px;
}

    .topPortalHyperlink a, .topPortalHyperlink a:visited, .topPortalHyperlink a:active {
        color: #FFFFFF;
        text-decoration: none !important;
    }

        .topPortalHyperlink a:hover {
            color: #FFFFFF;
            text-decoration: underline !important;
        }

.bottomheader {
    float: none;
    width: 670px;
    height: 52px;
    text-align: center;
    margin: 0 auto;
}

.placeholder {
    float: none;
    width: 670px;
    height: 23px;
}

.masterContentArea {
    width: 100%;
    height: 100%;
    float: left;
    text-align: left;
    background-color: #FFFFFF;
    padding-bottom: 40px;
}

.masterSidbarHolder {
    background: #fff;
    float: left;
    text-align: center;
    width: 175px;
    z-index: 50;
    top: 0px;
    left: 0px;
    height: 100%;
}

.masterContentPlaceholder {
    background: #fff;
    width: 100%;
    height: 100%;
    float: left;
    margin-top: 20px;
}

    .masterContentPlaceholder table, tr {
        border-width: 0px;
        margin: 0px;
        padding: 0px;
    }

    .masterContentPlaceholder td {
        border-width: 0px;
        margin: 0px;
        padding: 0px 15px 0px 5px;
        vertical-align: top;
    }

    .masterContentPlaceholder A, h1 A, h4 A {
        color: #003365;
        text-decoration: underline;
    }

        .masterContentPlaceholder A:hover, A:active, h1 A:hover, h1 A:active, h4 A:hover, h4 A:active, h2 A:hover, h2 A:active, h5 A:hover, h5 A:active, h3 A:hover, h3 A:active {
            color: #0000CC;
            text-decoration: underline;
        }

    .masterContentPlaceholder h2 A, h5 A {
        color: #DD7C3B;
        text-decoration: underline;
    }

    .masterContentPlaceholder h3 A {
        color: #336699;
        text-decoration: underline;
    }

.masterFooter {
    background-color: #003365;
    width: 100%;
    clear: both;
    float: left;
    height: 30px;
    text-align: center;
    color: #FEFDC3;
    padding-top: 10px;
    margin-bottom: 20px;
}

.adRotator {
    float: left;
    margin: 2px 0px 0px 10px;
    padding: 0px 0px 0px 0px;
    width: 150px;
    height: 150px;
}

.sideImage {
    margin: 0px;
    text-align: center;
    padding: 0px 10px 0px 10px;
}

.masterFooter a:link, .masterFooter a:visited {
    color: #FEFDC3;
}

.masterContentPlaceholderNoImages {
    background: #fff;
    width: 870px;
    height: 100%;
    float: left;
    margin-top: 20px;
    margin-left: 30px;
}

    .masterContentPlaceholderNoImages table, tr {
        border-width: 0px;
        margin: 0px;
        padding: 0px;
    }

    .masterContentPlaceholderNoImages td {
        border-width: 0px;
        margin: 0px;
        padding: 0px 15px 0px 5px;
        vertical-align: top;
    }

    .masterContentPlaceholderNoImages A, h1 A, h4 A {
        color: #003365;
        text-decoration: underline;
    }

        .masterContentPlaceholderNoImages A:hover, A:active, h1 A:hover, h1 A:active, h4 A:hover, h4 A:active, h2 A:hover, h2 A:active, h5 A:hover, h5 A:active, h3 A:hover, h3 A:active {
            color: #0000CC;
            text-decoration: underline;
        }

    .masterContentPlaceholderNoImages h2 A, h5 A {
        color: #DD7C3B;
        text-decoration: underline;
    }

    .masterContentPlaceholderNoImages h3 A {
        color: #336699;
        text-decoration: underline;
    }
/* End Master Page Settings*/

.contentHeader {
    width: 100%;
}

.contentLeftWidthSmall {
    float: left;
    width: 30%;
}

.contentLeftWidthMedium {
    float: left;
    width: 50%;
}

.contentLeftWidthLarge {
    float: left;
    width: 70%;
}

.contentLeftWidthFull {
    float: left;
    width: 98%;
}

.contentRightWidthLarge {
    float: right;
    width: 49%;
}

.contentRightWidthMedium {
    float: right;
    width: 25%;
}

.contentRightWidthInfo {
    float: right;
    width: 30%;
}

.contentRightWidthMediumTextRight {
    float: right;
    width: 25%;
    text-align: right;
}

.contentRightWidthSmall {
    float: right;
    width: 15%;
}

.contentFooter {
    clear: both;
    width: 100%;
    margin-bottom: 40px;
}

    .contentFooter a:link, .contentFooter a:visited {
        color: #003365;
        text-decoration: underline;
    }

/* IRA Style */

.iraWrapContent {
    margin-left: auto;
    margin-right: auto;
    float: left;
}

.rightAlign {
    float: right;
}

div.iraContainer {
    display: inline-block;
    text-align: right;
    margin: 2px;
}

div#IRARightContainer {
    display: inline-block;
    text-align: right;
    margin-bottom: 0px;
}

div#IRASearchResults th {
    border: 1px solid black;
    background-color: #E5DBBC;
    color: #20356b;
}

div#IRASearchResults td {
    border: 1px solid black;
    padding-left: 2px;
    padding-right: 2px;
    vertical-align: middle;
}

div#IRACountyDiv {
    height: 150px;
    width: 100%;
    margin-left: 0px;
    overflow: auto;
    border: 2px inset;
}

div#IRASearchResults table tbody tr td table tbody tr td /* yeah, i know this looks crazy... */ {
    border: 0px;
}

.iraMarginBottom16 {
    margin-bottom: 16px;
}

.subContentLeftFullWithPadding {
    float: left;
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
}

/* END IRA Style */

.subContentLeftFullWithPaddingTop {
    float: left;
    width: 100%;
    padding-top: 10px;
}

.subContentLeftLargeWithPadding {
    float: left;
    width: 70%;
    padding-top: 10px;
    padding-bottom: 10px;
}

.subContentLeftMediumWithPadding {
    float: left;
    width: 40%;
    padding-top: 10px;
    padding-bottom: 10px;
}

.subContentLeftSmallWithPadding {
    float: left;
    width: 28%;
    padding-top: 10px;
    padding-bottom: 10px;
}

.subContentRightSmallWithPadding {
    float: right;
    width: 24%;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: right;
}

.subContentHighlightLeftFull {
    float: left;
    width: 100%;
    background-color: #EEEDE8;
}

.subContentHighlightLeftMedium {
    float: left;
    width: 49%;
    background-color: #EEEDE8;
}

.subContentHighlightRightSmall {
    float: right;
    width: 24%;
    text-align: right;
    background-color: #EEEDE8;
}

.subContentHighlightLeftFullWithPadding {
    float: left;
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #EEEDE8;
}

.subContentHighlightLeftMediumWithPadding {
    float: left;
    width: 49%;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #EEEDE8;
}

.subContentHighlightRightSmallWithPadding {
    float: right;
    width: 24%;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: right;
    background-color: #EEEDE8;
}

/* Home Page Settings */
#column_container {
    border: 0px solid #000;
    clear: both;
    float: left;
    margin: 0px;
    padding: 0px;
    width: 730px;
}

    #column_container p {
        margin-left: 10px;
        margin-right: 5px;
    }

    #column_container strong {
        color: #336699;
        font-weight: bold;
    }

    #column_container UL {
        margin: 0px 0px 0px 20px;
        padding: 0px;
    }

    #column_container LI {
        list-style-image: url(../images/bullet.bmp);
        margin: 0px;
        padding: 0px;
    }

        #column_container LI a:hover, LI a:active {
            list-style-image: url(../images/bullet_hover.bmp);
        }

    #column_container A {
        color: #DD7C3B;
        text-decoration: none;
    }

        #column_container A:hover, A:active {
            color: #FF9933;
            text-decoration: underline;
        }

.column {
    font-size: 13px; /*small*/
    width: 162px;
    font-family: Arial, Helvetica, sans-serif;
    vertical-align: text-top;
    background-color: #E3EEF9;
    height: 270px;
    position: relative;
}

.roundtopleft {
    background: url(../images/rounded_tl.bmp) no-repeat;
    width: 15px;
    height: 15px;
    border: none;
    display: block !important;
    float: left;
}

.roundtopright {
    background: url(../images/rounded_tr.bmp) no-repeat;
    width: 15px;
    height: 15px;
    border: none;
    display: block !important;
    float: right;
}

.roundbottomleft {
    background: url(../images/rounded_bl.bmp) no-repeat;
    width: 15px;
    height: 15px;
    border: none;
    bottom: 0px;
    left: 0px;
    position: absolute;
}

.roundbottomright {
    background: url(../images/rounded_br.bmp) no-repeat;
    width: 15px;
    height: 15px;
    border: none;
    bottom: 0px;
    right: 0px;
    position: absolute;
}
/* End Home Page Settings*/

.mediaTable {
    margin: 0px;
    padding: 0px;
}

    .mediaTable tr {
        margin: 0px;
        padding: 0px;
    }

    .mediaTable td {
        border-color: #888888;
        border-width: 1px;
        border-style: solid;
        margin: 0px;
        padding: 5px;
    }

    .mediaTable a:link, .mediaTable a:visited {
        color: #26307C;
        text-decoration: none;
        font-family: 'Times New Roman', Times, serif;
        font-size: 12px;
    }

    .mediaTable a:hover {
        color: #903232;
        text-decoration: underline;
        font-family: 'Times New Roman', Times, serif;
        font-size: 12px;
    }

.mediaTableDropdownList {
    font-family: 'Times New Roman', Times, serif;
    font-size: 12px;
    width: 43px;
}

.mediaTableDropdownListWider {
    font-family: 'Times New Roman', Times, serif;
    font-size: 12px;
    width: 48px;
}

.tableProductAvailability {
    width: 700;
}

    .tableProductAvailability td {
        text-align: center;
        vertical-align: middle;
        border: solid 1px #cccccc;
    }

    .tableProductAvailability tr {
        padding: 5px 5px 5px 5px;
    }

.blankCellProductAvailability {
    background-color: #fff;
}

.productHeaderCellProductAvailability {
    background-color: #DD7C3B;
    color: #000;
}

.productNameCellProductAvailability {
    background-color: #E3EEF9;
    color: #000;
}

.productStateCellProductAvailability {
    background-color: #003365;
    color: #fff;
}

.calendarSalesEvents {
    width: 100%;
    color: #fff;
    border: 1px solid #000;
}

    .calendarSalesEvents td {
        border: 1px solid #000;
    }

    .calendarSalesEvents a:link, .calendarSalesEvents a:visited {
        color: #26307C;
    }

.calendarSalesEventsNextPrevStyle {
    color: #fff;
}

.calendarSalesEventsDayStyle {
    background-color: #E3EEF9;
    text-align: left;
    height: 75px;
    color: #000;
}

    .calendarSalesEventsDayStyle a:link, .calendarSalesEventsDayStyle a:visited {
        color: #DD7C3B;
        text-decoration: none;
    }

    .calendarSalesEventsDayStyle a:hover {
        color: #FF9933;
        text-decoration: underline;
    }

.calendarSalesEventsDayHeaderStyle {
    background-color: #003365;
    border: 1px solid #000;
    color: #fff;
    height: 10px;
    text-align: left;
}

.calendarSalesEventsTodayDayStyle {
    background-color: #DD7C3B;
    color: #fff;
    text-align: left;
}

    .calendarSalesEventsTodayDayStyle a:link, .calendarSalesEventsTodayDayStyle a:visited {
        color: #003365;
        text-decoration: none;
    }

    .calendarSalesEventsTodayDayStyle a:hover {
        color: #0055AA;
        text-decoration: underline;
    }

.calendarSalesEventsOtherMonthDayStyle {
    background-color: #fff;
    color: #808080;
    text-align: left;
    height: 75px;
}

.calendarSalesEventsTitleStyle {
    background-color: #DD7C3B;
    color: #fff;
    font-weight: bold;
    text-align: center;
}

    .calendarSalesEventsTitleStyle td {
        border: 0px solid #000;
    }

.gridviewSalesEvents {
    width: 100%;
    margin: 4px 4px 4px 4px;
    color: #333;
    border: 1px solid #000;
}

    .gridviewSalesEvents td {
        padding: 4px;
        border: 1px solid #000;
    }

    .gridviewSalesEvents a:link, .gridviewSalesEvents a:visited {
        color: #003365;
        text-decoration: none;
    }

    .gridviewSalesEvents a:hover {
        color: #0055AA;
        text-decoration: underline;
    }

.gridviewSalesEventsHeaderStyle {
    background-color: #003365;
    font-weight: bold;
    color: #fff;
}

.salesPublicationHeader {
    font-size: xx-large;
    font-family: Arial;
    color: #00558C;
    font-weight: bolder;
    text-align: center;
    width: 800px;
}

/* Base class for all sales publication sections */
.sales-publication {
    font-size: large;
    font-family: Arial, sans-serif;
    color: #00558C;
    font-weight: bold;
    text-align: center;
    width: 810px;
}

/* Specific background colors for each section */
.sales-publication--incentives {
    background-color: #EAEBEB;
}

.sales-publication--leaderboards {
    background-color: #E2ECF8;
}

.sales-publication--agent-resources {
    background-color: #A9D6B0;
}

.sales-publication--eagles {
    background-color: #C5EAEF;
}

.sales-publication--train-more,
.sales-publication--additional-links {
    background-color: #D6EEEC;
}


.salesPublicationTDheader {
    width: 400px;
    font-size: medium;
    font-family: Arial;
    font-weight: bold;
    color:black;
    margin: 0px;
    padding-bottom: 0px;
}

.salesPublicationHRheader {
    width: 400px;
    height: 5px;
    background-color: #00558C;
    margin-top: 0px;
    margin-left: 0px;
}

.salesPublicationTRsub {
    width: 400px;
    padding-top: 2px;
    vertical-align: top;
}
.salesPublicationTDsub {
    width: 400px;
}

.salesPublicationDL {
    vertical-align: top;
    padding-top: 0px;
    margin-top: 0px;
}

.salesPublicationDT {
    font-size: small;
    font-family: Arial;
    font-weight: bold;
    padding-top: 5px;
    color: black;
    padding-left: 30px;
}
.salesPublicationSpacer{
    width: 5px;
}
.salesPublicationDD {
    font-size: small;
    font-family: Arial;
    padding-top: 5px;
    margin-left: 15px;
    
}
.section-grid .spanning-header::after {
    content: '';
    position: absolute;
    top: 0;
    right: -100%;
    width: 100%;
    height: 100%;
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    border-left: none;
    z-index: -1;
}
.section-grid .spanning-header-right {
    background-color: #f0f0f0;
    height: 100%;
    border: 1px solid #ccc;
    border-left: none;
}
.loginSalesProfessionals {
    color: #333333;
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    background-color: #F7F6F3;
    border: 1px solid #E6E2D8;
}

.loginSalesProfessionalsTitleTextStyle {
    color: #fff;
    background-color: #003365;
    font-weight: bold;
    font-size: 18px; /*large*/
}

.loginSalesProfessionalsLoginButtonStyle {
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    color: #284775;
    background: #FFFBFF;
    border: 1px solid #CCCCCC;
}

.loginSalesProfessionalsInstructionTextStyle {
    color: #000;
    font-style: italic;
}

.loginSalesProfessionalsTextBoxStyle {
    font-size: 16px; /*medium*/
}

.cpwdSalesProfessionalsCancelButtonStyle {
    display: none;
}

.box {
    padding: 10px;
    border: 1px solid #000;
    width: 100%;
}

.gridviewPublications {
    width: 90%;
}

.gridviewPublicationsHeaderStyle {
    background-color: #003365;
    font-weight: bold;
    color: #fff;
    text-align: center;
}

.gridviewPublicationsRowStyle {
    height: 20px;
}

.gridviewPublications a:link, .gridviewPublications a:visited {
    color: #003365;
    text-decoration: none;
}

.gridviewPublications a:hover {
    color: #0000CC;
    text-decoration: underline;
}

.gridviewSalesGuides {
    width: 100%;
}

.gridviewSalesGuidesHeaderStyle {
    background-color: #DD7C3B;
    font-weight: bold;
    color: #fff;
    text-align: center;
}

.gridviewSalesGuidesRowStyle {
    height: 20px;
}

.gridviewSalesGuides a:link, .gridviewSalesGuides a:visited {
    color: #003365;
    text-decoration: none;
}

.gridviewSalesGuides a:hover {
    color: #0000CC;
    text-decoration: underline;
}

.labelErrorMessage {
    font-weight: bold;
    color: #FF0000;
}

.buttonGeneral {
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    color: #284775;
    background: #FFFBFF;
    border: 1px solid #CCCCCC;
}

    .buttonGeneral:hover {
        font-family: "Times New Roman", Times, serif;
        font-size: 16px; /*medium*/
        color: #0000CC;
        background: #FFFBFF;
        border: 1px solid #0000CC;
    }

.buttonGeneralDark {
    background-position: #FFFBFF;
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    color: #284775;
    background: #EEEDE8;
    border: 1px solid #CCCCCC;
}

    .buttonGeneralDark:hover {
        font-family: "Times New Roman", Times, serif;
        font-size: 16px; /*medium*/
        color: #0000CC;
        background: #EEEDE8;
        border: 1px solid #0000CC;
    }

.boxGeneral {
    padding: 10px;
    color: #333333;
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    background-color: #F7F6F3;
    border: 1px solid #E6E2D8;
    float: left;
}

/* Accordion */
.accordionHeader {
    background-position: right center;
    border: 1px solid #003365;
    color: white;
    background-color: #003365;
    font-family: Arial, Sans-Serif;
    font-size: 12px;
    font-weight: bold;
    padding: 5px 20px 5px 5px;
    margin-top: 5px;
    cursor: pointer;
    background-image: url(../images/blue_ShowReports.jpg);
    background-repeat: no-repeat;
}

.accordionHeaderSelected {
    background-position: right center;
    border: 1px solid #003365;
    color: #003365;
    background-color: #B6D7E6;
    font-family: Arial, Sans-Serif;
    font-size: 12px;
    font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;
    background-image: url(../images/blue_HideReports.jpg);
    background-repeat: no-repeat;
}

.accordionContent {
    background-color: #F7F6F3;
    border: 1px dotted #003365;
    border-top: none;
    padding: 5px;
    padding-top: 10px;
}

.boxShipping {
    padding: 10px 10px 10px 10px;
    color: #333333;
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    background-color: #F7F6F3;
    border: 1px solid #E6E2D8;
    float: left;
}

.shippingContainer {
    width: 98%;
    margin-left: 10px;
    float: left;
}

.shippingAddress {
    width: 95%;
    border-width: thin;
    border-style: solid;
    padding-right: 10px;
    padding-left: 10px;
    margin-bottom: 10px;
    margin-left: 10px;
    float: left;
}

.shippingMethod {
    width: 95%;
    border-width: thin;
    border-style: solid;
    margin-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
    float: left;
    margin-left: 10px;
}

.shoppingCartColumnHeader {
    color: #336699;
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    font-weight: bold;
}

.shoppingCartHeader {
    float: left;
    width: 100%;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    padding-top: 3px;
    padding-bottom: 3px;
    border-top-style: solid;
    border-top-width: 1px;
}

.shoppingCartLineItem {
    float: left;
    width: 100%;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.shoppingCartDeleteHeader {
    float: left;
    width: 16%;
    text-align: center;
}

.shoppingCartDeleteColumn {
    float: left;
    width: 16%;
    text-align: center;
}

.shoppingCartItemHeader {
    float: left;
    width: 30%;
}

.shoppingCartItemColumn {
    margin: auto;
    float: left;
    width: 30%;
}

.shoppingCartDescriptionHeader {
    float: left;
    width: 38%;
}

.shoppingCartDescriptionColumn {
    float: left;
    width: 38%;
}

.shoppingCartQuantityHeader {
    float: left;
    width: 15%;
}

.shoppingCartQuantityColumn {
    float: left;
    width: 15%;
}

.shoppingCartItemTotalColumn {
    float: right;
    width: 27%;
}

.shoppingCartQuantityTotalColumn {
    float: right;
    width: 27%;
}

.orderReviewHeaderLabel {
    color: #336699;
    font-family: "Times New Roman", Times, serif;
    font-size: 18px; /*large*/
    font-weight: bold;
}

.orderReviewHeader {
    float: left;
    width: 18%;
    margin: 4px;
    height: 20px;
}

.orderReviewShippingAddressInfo {
    padding: 10px;
    float: left;
    width: 40%;
}

.orderReviewShippingMethodBillToInfo {
    padding: 10px;
    float: left;
    width: 55%;
}

.orderReviewButton {
    margin: 3px;
    float: left;
    width: 15%;
}

.orderReviewbox {
    border-color: #C0C0C0;
    float: left;
    width: 100%;
    border-top-style: solid;
    border-right-style: solid;
    border-left-style: solid;
    border-top-width: 1px;
    border-right-width: 1px;
    border-left-width: 1px;
}

.itemListHeader {
    float: left;
    width: 100%;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.itemColumnHeader {
    color: #336699;
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    font-weight: bold;
}

.itemLine {
    border-color: #C0C0C0;
    float: left;
    width: 100%;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.itemQuantityHeader {
    float: left;
    width: 15%;
    text-align: center;
}

.itemQuantityColumn {
    float: left;
    width: 15%;
    text-align: center;
}

.itemHeader {
    float: left;
    width: 30%;
}

.itemColumn {
    float: left;
    width: 30%;
}

.itemDescriptionHeader {
    float: left;
    width: 30%;
}

.itemDescriptionColumn {
    float: left;
    width: 30%;
}

.orderListHeader {
    float: left;
    width: 100%;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.orderColumnHeader {
    color: #336699;
    font-family: "Times New Roman", Times, serif;
    font-size: 16px; /*medium*/
    font-weight: bold;
}

.orderLine {
    border-color: #C0C0C0;
    float: left;
    width: 100%;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.keysLine {
    border-color: #C0C0C0;
    float: left;
    width: 100%;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.orderDateOrderedHeader {
    float: left;
    width: 15%;
    text-align: center;
}

.orderDateOrderedColumn {
    float: left;
    width: 15%;
    text-align: center;
}

.orderHeader {
    float: left;
    width: 30%;
}

.orderColumn {
    float: left;
    width: 30%;
}

.orderPurchaseOrderHeader {
    float: left;
    width: 30%;
}

.orderPurchaseOrderColumn {
    float: left;
    width: 30%;
}

.orderStatusHeader {
    float: left;
    width: 15%;
    text-align: center;
}

.orderStatusColumn {
    float: left;
    width: 15%;
    text-align: center;
}

.orderActionLinkHeader {
    float: left;
    width: 15%;
    text-align: center;
}

.orderActionLinkColumn {
    float: left;
    width: 15%;
    text-align: center;
}

.topAccountDetails {
    float: right;
    text-align: center;
    margin: 5px;
    color: white;
}

/* Dropdown Menu for the Account Options*/
.dropdown {
    position: relative;
    display: inline-block;
    z-index: 2;
    border: none;
    cursor: pointer;
    padding: 5px 10px;
    font-size: 13px;
}

    .dropdown:focus {
        pointer-events: none;
    }

        .dropdown:focus .dropdown-content {
            opacity: 1;
            visibility: visible;
        }

.dropdown-content {
    position: absolute;
    z-index: 1000;
    padding: 8px 0px;
    opacity: 0;
    visibility: hidden;
    margin: 5px;
    list-style: none;
    pointer-events: auto;
    cursor: auto;
    right: 0;
    border: 1px solid #003365;
    background-color: #B6D7E6;
    text-align: left;
    transition: visibility 1s;
}

    .dropdown-content a {
        display: block;
        background: transparent;
        border: none;
        text-align: left;
        margin: 0;
        padding: 4px 16px;
        color: #003365;
        font-size: 12px;
        font-weight: bold;
        text-decoration: none;
        width: auto;
        white-space: nowrap;
    }

        .dropdown-content a:hover {
            background-color: #DD7C3B;
            color: white;
            text-decoration: none;
        }

/* Arrow class along with orientation modifiers*/
.arrow {
    border: solid white;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 3px;
}

.right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.up {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}

.down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
