﻿/* DEFAULTS
----------------------------------------------------------*/

body {
    background: #fff;
    font-size: .80em;
    font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;
    margin: 0px;
    padding: 0px;
    color: #696969;
}

.myaccount-master {
    position: relative;
    margin: 0px;
    padding: 0px;
    background: #225A40;
    width: 100%;
}

.fti-myaccount-logo {
    top: 44px;
    left: 0px;
    width: 1920px;
    height: 110px;
    background: #EDF1F4 0% 0% no-repeat padding-box;
    opacity: 1;
}

.fti-myaccount-header {
    top: 0px;
    left: 0.5px;
    width: 1920px;
    height: 44px;
    background: #716135 0% 0% no-repeat padding-box;
    opacity: 1;
    font-size: 1.2rem;
}

.fti-myaccount-headerText {
    height: 17px;
    text-align: left;
    letter-spacing: 0.6px;
    color: #FFFFFF;
    text-transform: uppercase;
    opacity: 1;
	font-family: 'source_sans_proregular';
	font-size: 1rem;
}

    .fti-myaccount-headerText > a:link {
        color: #FFFFFF;
        background-color: transparent;
        text-decoration: none;
    }

    .fti-myaccount-headerText > a:visited {
        color: #FFFFFF;
        background-color: transparent;
        text-decoration: none;
    }

    .fti-myaccount-headerText > a:hover {
        color: #FFFFFF;
        background-color: transparent;
        text-decoration: underline;
    }

    .fti-myaccount-headerText > a:active {
        color: #FFFFFF;
        background-color: transparent;
        text-decoration: underline;
    }

.myaccount-master-footer {
    bottom: 0px;
    position: fixed;
    width: 100%;
    height: 63px;
}

.fti-myaccount-footer {
    bottom: 0px;
    left: 0px;
    width: 1920px;
    height: 63px;
    background: #D9D3AC 0% 0% no-repeat padding-box;
    opacity: 1;
    font-size: 1.2rem;
}

.fti-myaccount-footerText {
    height: 17px;
    text-align: left;
    letter-spacing: 0.6px;
    color: #173963;
    text-transform: uppercase;
    opacity: 1;
	font-family: 'source_sans_proregular';
	font-size: 1rem;
}

.fti-myaccount-copywrightText {
    height: 17px;
    text-align: left;
    letter-spacing: 0.6px;
    color: #3c3c3c;
    opacity: 1;
    font-size: 11px;
}

    .fti-myaccount-footerText > a:link {
        color: #173963;
        background-color: transparent;
        text-decoration: none;
    }

    .fti-myaccount-footerText > a:visited {
        color: #173963;
        background-color: transparent;
        text-decoration: none;
    }

    .fti-myaccount-footerText > a:hover {
        color: #173963;
        background-color: transparent;
        text-decoration: underline;
    }

    .fti-myaccount-footerText > a:active {
        color: #173963;
        background-color: transparent;
        text-decoration: underline;
    }

.fti-myaccount-bgimage {
    background-image: url(../images/FTI_Retail_Image.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

.portalLogo-img12 {
    width: 410px;
    height: 130px;
    background-image: url(../images/Retail_Portal_Logo12.jpg);
    margin-left: 300px;
    margin-top: 50px;
}

#ContentPlaceHolderBody_bodywrapdiv.login-section, #ContentPlaceHolderBody_mngaccbodywrapdiv.login-section {
    width: 30% !important;
}

#ContentPlaceHolderBody_bodywrapdiv.irashadowBox, #ContentPlaceHolderBody_mngaccbodywrapdiv.irashadowBox {
    width: 580px !important;
}

#ContentPlaceHolderBody_bodywrapdiv.login-section-dp, #ContentPlaceHolderBody_mngaccbodywrapdiv.login-section-dp {
    width: 30% !important;
}

.login-section {
    width: 789px !important;
    background: #FFFFFF 0% 0% no-repeat padding-box !important;
    box-shadow: 0px 0px 20px #00000066 !important;
    border: 2px solid #173963 !important;
    padding: 0px !important;
    border-radius: 0px !important;
    opacity: 1;
    color: #333333 !important;
}

.title-Separator {
    border: 0.5px solid #666666;
    opacity: 1;
    margin-left: 5%;
    width: 90%;
}

.login-section #divTitle {
    text-align: left;
    padding-left: 45px;
}

    .login-section #divTitle > h2 {
        letter-spacing: 2.1px;
        /*font: normal normal 600 30px/50px Source Sans Pro;*/
        text-transform: uppercase !important;
    }

.login-section > h2 {
    letter-spacing: 2.1px;
    font: normal normal 600 30px/50px Source Sans Pro;
    text-transform: uppercase !important;
    font-family: 'source_sans_proregular';
}

.login-section .usertext, .login-section .radtextbox, .login-section .riTextBox {
    width: 100% !important;
    border-color: gray !important;
    background: #FFFFFF !important;
}

.login-section .rcbInputCell, .login-section .rcbInputCellLeft {
    width: 100% !important;
    border-color: gray !important;
    background: #173963 !important;
    color: #FFFFFF !important;
}

.login-section .rcbInput {
    color: #FFFFFF !important;
    border-color: gray !important;
}

.fti-myaccount-bgimage .RadComboBoxDropDown_Forest {
    background: #173963 !important;
    color: #FFFFFF !important;
}

.RadComboBoxCustom {
    width: 380px !important;
}

.login-section #ContentPlaceHolderBody_PanelAccountLogin {
    font-family: proxima-nova-bold-italic;
}

.login-section .userspan1 {
    font-family: proxima-nova-bold;
    color: #000000 !important;
}

.login-section #paneldiv1 {
    margin-bottom: 50px;
    width: auto !important;
    float: none !important;
    text-align: center !important;
}

.login-section #paneldiv2 {
    font-family: proxima-nova-bold;
    color: #000000 !important;
    text-align: center;
    float: none !important;
}

    .login-section #paneldiv2 a {
        color: #337AB7 !important;
    }

.login-section .RadButton, .login-section .RadInput {
    background-image: none !important;
    background-color: #173963 !important;
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-family: proxima-nova-regular;
    border: 1px solid #173963;
    opacity: 1;
    text-transform: uppercase !important;
}

.login-section .cancel-section .RadButton, .login-section .cancel-section .RadInput {
    background-image: none !important;
    color: #173963 !important;
    background-color: #FFFFFF !important;
    font-size: 14px !important;
    font-family: proxima-nova-regular;
    border: 1px solid #FFFFFF;
    opacity: 1;
    text-transform: uppercase !important;
    font-weight: bold;
}

.login-section .loginspan2 .RadButton {
    padding: 5px 10px !important;
}

.login-section .RadButton, .login-section .RadButton_Forest {
    padding: 5px 0px !important;
    margin-top: 5px !important;
}

.login-section .RadButton_Forest, .login-section .RadInput_Forest {
    background-image: none !important;
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-family: proxima-nova-regular;
}

.login-section .rbDecorated, .login-section .riSingle {
    background-image: none !important;
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-family: proxima-nova-regular;
}

.login-section .cancel-section .rbDecorated, .login-section .cancel-section .riSingle {
    background-image: none !important;
    color: #173963 !important;
    font-size: 14px !important;
    font-family: proxima-nova-regular;
    font-weight: bold;
}

.login-section-button-spacing {
    height: 5px;
}

.login-section .login-section-button-spacing {
    height: 0px !important;
}

.login-section #pwddiv, .login-section #logindiv {
    margin-top: 20px !important;
}

.login-section div.divCellData {
    text-align: initial !important;
}

.login-section #divCell, .login-section #divCell1, .login-section #divCell2,
.login-section #divCell3, .login-section #divCell4 {
    width: 40% !important;
}

.login-section #ContentPlaceHolderBody_PanelForgotUsernameResetPassword #divCell {
    text-align: right !important;
}

.custom-width {
    width: 500px !important;
}

#ContentPlaceHolderBody_passwordResetSection.login-section {
    width: 580px !important;
}

    /*#ContentPlaceHolderBody_accountcompletionSection.login-section .custom-width {
    width: 230% !important;
}*/

    #ContentPlaceHolderBody_passwordResetSection.login-section .divPaddingTop {
        padding-left: 15% !important;
    }

#ContentPlaceHolderBody_mngaccbodywrapdiv.login-section #ContentPlaceHolderBody_PanelRetrieveUsername #divCell3 {
    width: 30% !important;
}

#ContentPlaceHolderBody_PanelRetrieveUsername + #ContentPlaceHolderBody_PanelReturnButton #divCell4 {
    width: 35% !important;
}

a:link, a:visited {
    color: #034af3;
}

a:hover {
    color: #1d60ff;
    text-decoration: none;
}

a:active {
    color: #034af3;
}

p {
    margin-bottom: 10px;
    line-height: 1.6em;
}

.userspan2 {
    color: red;
}


/* HEADINGS   
----------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 {
    font-size: 1.5em;
    color: #666666;
    text-transform: none;
    font-weight: 200;
    margin-bottom: 0px;
}

h1 {
    font-size: 1.6em;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

h2 {
    font-size: 1.5em;
    font-weight: 600;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

h5, h6 {
    font-size: 1em;
}

/* this rule styles <h1> and <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2 {
    margin-top: 0px;
}


/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

.page {
    background-color: #fff;
    margin: 0px auto 0px auto;
}

.header {
    position: relative;
    margin: 0px;
    padding: 0px;
    background: #006634;
    width: 100%;
}

.DCSheader {
    position: relative;
    margin: 0px;
    padding: 0px;
    background: #adc9f7;
    width: 100%;
    border-bottom: #1443a9;
    border-bottom-style: solid;
    border-bottom-width: 1px;
}

.header h1 {
    font-weight: 700;
    margin: 0px;
    padding: 0px 0px 0px 20px;
    color: #f9f9f9;
    border: none;
    line-height: 2em;
    font-size: 2em;
}

.main {
    padding: 0px 12px;
    margin: 12px 8px 8px 8px;
}

.leftCol {
    padding: 6px 0px;
    margin: 12px 8px 8px 8px;
    width: 200px;
    min-height: 200px;
}

.footer {
    color: #4e5766;
    padding: 8px 0px 0px 0px;
    margin: 0px auto;
    text-align: center;
    line-height: normal;
}

.iraheader {
    position: relative;
    margin: 0px;
    padding: 0px;
    width: 100%;
}

.iraCustomHeader {
    background-image: url('../Images/horiz_line_pattern.png');
    background-color: #E0E1E3;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}



/* TAB MENU   
----------------------------------------------------------*/

div.hideSkiplink {
    background-color: #1d5737;
    width: 100%;
}

div.menu {
    padding: 4px 0px 4px 8px;
}

    div.menu ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        width: auto;
    }

        div.menu ul li a, div.menu ul li a:visited {
            background-color: #1d5737;
            border: 1px #4e667d solid;
            color: #dde4ec;
            display: block;
            line-height: 1.35em;
            padding: 4px 20px;
            text-decoration: none;
            white-space: nowrap;
        }

            div.menu ul li a:hover {
                background-color: #1d5737;
                color: #465c71;
                text-decoration: none;
            }

            div.menu ul li a:active {
                background-color: #1d5737;
                color: #cfdbe6;
                text-decoration: none;
            }

/* FORM ELEMENTS   
----------------------------------------------------------*/

fieldset {
    margin: 1em 0px;
    padding: 1em;
    border: 1px solid #ccc;
}

    fieldset p {
        margin: 2px 12px 10px 10px;
    }

    fieldset.login label, fieldset.register label, fieldset.changePassword label {
        display: block;
    }

    fieldset label.inline {
        display: inline;
    }

legend {
    font-size: 1.1em;
    font-weight: 600;
    padding: 2px 4px 8px 4px;
}

input.textEntry {
    width: 320px;
    border: 1px solid #ccc;
}

input.passwordEntry {
    width: 320px;
    border: 1px solid #ccc;
}

div.accountInfo {
    width: 42%;
}

/* MISC  
----------------------------------------------------------*/

.clear {
    clear: both;
}

.title {
    display: block;
    float: left;
    text-align: left;
    width: auto;
}

.loginDisplay {
    font-size: 1.1em;
    text-align: right;
    padding: 0px 0px 0px 0px;
    color: White;
    text-align: right;
}

    .loginDisplay a:link {
        color: white;
    }

    .loginDisplay a:visited {
        color: white;
    }

    .loginDisplay a:hover {
        color: white;
    }

.failureNotification {
    font-size: 1.2em;
    color: Red;
}

.bold {
    font-weight: bold;
}

.submitButton {
    text-align: right;
    padding-right: 10px;
}

.page-center {
    margin-left: auto !important;
    margin-right: auto !important;
    margin: 0;
    text-align: center;
}

.page-left {
    margin-left: auto !important;
    margin-right: auto !important;
    margin: 0;
    text-align: left;
}

.page-right {
    position: absolute;
    right: 50px;
    top: 180px;
}

.FTIButton {
    background-color: darkGreen;
    color: White;
    border-color: darkgreen;
    font-weight: bold;
}

    .FTIButton[disabled] {
        background-color: lightgray;
    }

.FTILabel {
    color: darkgreen;
    font-size: large;
}

.AdminPanel {
    background-color: AliceBlue;
    border-style: groove;
}

.TablePanel {
    width: 500px;
    border-style: groove;
    height: auto;
    text-align: left;
    vertical-align: middle;
    padding-bottom: 10px;
}

.TableHeader {
    background-color: darkgreen;
    text-align: center;
    vertical-align: middle;
    font-size: small;
    font-weight: bold;
    color: white;
}

/*
Price Quote Screen
*/

table.PaddedTable {
    border-collapse: collapse;
    border-style: solid;
    border-width: 3px;
    text-align: center;
}

    table.PaddedTable td {
        padding: 15px;
        border-style: solid;
        border-width: 1px;
    }

table.StandardTable, table.TradeBlotterTable {
    border-collapse: collapse;
    border-style: solid;
    border-width: 2px;
    border-color: darkgrey;
}

    table.StandardTable td, table.TradeBlotterTable td {
        padding: 5px;
        border-style: solid;
        border-width: 1px;
    }

    table.TradeBlotterTable td {
        text-align: left;
    }

td.pqsdescription {
    text-align: center;
    color: black;
    font-weight: bold;
}

td.pqscommodity {
    border-top-style: solid;
    border-left-style: solid;
    border-right-style: solid;
    border-color: black;
    text-align: center;
    font-weight: bold;
}

td.pqsglobex {
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-color: black;
    text-align: center;
    color: red;
}

td.pqsvenue {
    background-color: Teal;
    border-style: solid;
    border-color: black;
    text-align: center;
    color: black;
}

td.pqsftispot {
    background-color: blue;
    color: white;
    font-weight: bold;
    border-style: solid;
    border-color: black;
    text-align: right;
    color: white;
}

td.pqschangepos {
    border-style: solid;
    font-weight: bold;
    text-align: right;
    color: green;
}

td.pqschangeneg {
    border-style: solid;
    font-weight: bold;
    text-align: right;
    color: red;
}

td.pqsasofdate {
    border-style: solid;
    font-weight: bold;
    text-align: center;
    color: black;
}

td.pqsmanual {
    border-style: solid;
    font-weight: bold;
    text-align: right;
    color: black;
}

td.housepositionheader {
    background-color: ThreeDFace;
    border-style: solid;
    border-color: black;
    text-align: center;
    color: black;
}

td.houseposition {
    background-color: Orange;
    border-style: solid;
    border-color: black;
    text-align: center;
    color: black;
}

td.label {
    text-align: left;
    color: black;
    font-weight: bold;
}

td.labelRight {
    text-align: right;
    color: black;
    font-weight: bold;
}

/*RadMenu*/
.menu-container {
    margin: 10px 0;
}

    .menu-container .RadMenu {
        float: none;
    }

.loginbox {
    width: 70%;
}

/* FORMS */
.form-panel, #panel-customer-search, #template-picker {
    clear: both;
}

p.row {
    clear: both;
    float: left;
    margin: 0;
    padding-bottom: 10px;
}

    p.row span {
        float: left;
        height: 20px;
    }

        p.row span.label {
            text-align: right;
            margin-right: 4px;
            font-style: italic;
        }

        p.row span.data {
            margin-left: 1px;
        }

            p.row span.data.right {
                text-align: right;
            }

        p.row span.smallest {
            width: 75px;
        }

        p.row span.smaller {
            width: 100px;
        }

        p.row span.small {
            width: 125px;
        }

        p.row span.normal {
            width: 150px;
        }

        p.row span.long {
            width: 175px;
        }

        p.row span.longer {
            width: 200px;
        }

        p.row span.longest {
            width: 350px;
        }

        p.row span.full {
            width: 450px;
        }

    p.row.first {
        margin-top: 10px;
    }

    p.row.right {
        position: absolute;
        right: 10px;
        top: 10px;
    }

    p.row.center {
        position: absolute;
        left: 340px;
        right: 340px;
        top: 20px;
        border: solid 1px #006634;
        text-align: center;
        background-color: Yellow;
    }

    p.row.buttons {
        width: 55%;
        padding: 10px 0;
        text-align: right;
    }

        p.row.buttons a {
            color: #FFF;
            font-size: 12px;
        }

            p.row.buttons a:hover {
                color: #FFF;
            }

        p.row.buttons input {
            margin: 0;
            padding: 2px 5px;
            border: solid 1px #006634;
            color: White;
            background-color: #ffffff;
        }

        p.row span.required, p.row.buttons span.required {
            color: red !important;
            font-size: 10px;
            padding-right: 2px;
        }

    p.row span.label span.required {
        float: none;
        font-size: 11px;
    }

textarea, input.textbox, input.readonly {
    padding: 2px;
    margin: 0;
    font-size: 12px;
    border: dotted 1px #fbcb09;
    color: #333;
    background-color: #fdf5ce;
}

    textarea.default, input.default {
        color: #999;
        font-style: italic;
        border: solid 1px #ccc;
        text-align: center;
        background-color: #f6f6f6;
    }

input.readonly {
    color: #000;
}

input.number {
    text-align: right;
}

input.password {
    color: #999;
    font-style: italic;
    border: solid 1px #eee;
    text-align: left;
}

input.smallest {
    width: 75px;
}

input.smaller {
    width: 100px;
}

input.small {
    width: 125px;
}

input.normal {
    width: 150px;
}

input.long {
    width: 175px;
}

input.longer {
    width: 200px;
}

input.longest {
    width: 350px;
}

input.full {
    width: 460px;
}

.validator {
    color: #900 !important;
}

.validatorExtreme {
    background-color: red;
    font-weight: bold;
    color: white;
}

.validatorSuccess {
    background-color: green;
    font-weight: bold;
    color: white;
}

.panel {
    display: none;
}

.hidden {
    display: none;
}

.unhidden {
    display: block;
}

.requried {
    color: red;
}

.errormessage {
    color: darkred;
    font-size: larger;
    font-weight: bold;
}

.successmessage {
    color: green;
    font-size: larger;
    font-weight: bold;
}

.textAlignLeft {
    text-align: left !important;
}

.textAlignCenter {
    text-align: center !important;
}

.textAlignRight {
    text-align: right !important;
}

.TradingPartnerNameLabel {
    width: 1100px;
    margin: 0 auto;
    font-size: larger;
    font-weight: bold;
    background-color: #FFF8C6;
    border: solid 1px black;
    padding: 5px;
}

.InActiveLabel {
    color: red;
}

.ActiveLabel {
    color: dimgray;
}

.BinocularClass {
    vertical-align: bottom;
}

.classImage {
    background: url(~/Images/binoculars.png);
    background-position: 0 0;
    width: 150px;
    height: 94px;
}

.classHoveredImage {
    background-position: 0 -100px;
}

.classPressedImage {
    background-position: 0 -200px;
}

.enterAsTab {
}

table.OrderConfirmationData {
    border-collapse: collapse;
    font-size: 9pt;
}

    table.OrderConfirmationData tr.HeaderRow td {
        background-color: #4C7822;
        font-weight: bold;
        color: white;
        text-align: center;
    }

    table.OrderConfirmationData tr.DataRow td {
        background-color: #C7D6A7;
        color: black;
        text-align: center;
    }

table.OrderConfirmation {
    border-collapse: collapse; /*border: solid 1px black;*/
}

    table.OrderConfirmation td {
        /*border: solid 1px black;*/
        padding: 2px;
        vertical-align: top;
    }

table.BlankTable {
    border-collapse: collapse;
    border-style: none;
}

    table.BlankTable td {
        border-style: none;
    }

div.shadowBox {
    border: solid 1px #006634;
    padding: 10px;
    border-radius: 10px;
    box-shadow: 10px 10px 5px #C7D6A7;
}

div.irashadowBox {
    border: solid 1px #E0E1E3;
    padding: 10px;
    border-radius: 10px;
    background-color: #EEEEEE;
    font-family: futura-medium;
}

    div.irashadowBox .RadInput_Forest .riTextBox {
        border-color: #808080;
        background: #FFFFFF;
    }

    div.irashadowBox .RadButton .rbDecorated {
        background-color: #003961;
        border: transparent;
        color: #FFFFFF;
        padding: 5px 10px;
    }

.irashadowBox .cancel-section .RadButton {
    padding-top: 5px !important;
}

.irashadowBox #pwddiv, .irashadowBox #logindiv {
    margin-top: 20px;
}

.irashadowBox #paneldiv1 {
    width: auto !important;
    float: none !important;
    text-align: center !important;
}

.irashadowBox #paneldiv2 {
    margin-top: 40px;
    float: none !important;
    text-align: center !important;
}

.irashadowBox .successmessage {
    text-align: center;
    display: inherit;
}

.irashadowBox #divCell1,
.irashadowBox #divCell4 {
    width: 1% !important;
}

.irashadowBox .divCellCaption {
    width: 30% !important;
}



.irashadowBox #ContentPlaceHolderBody_PanelPasswordResetStepOne .divCellCaption {
    width: 35% !important;
}

.irashadowBox #ContentPlaceHolderBody_PanelPasswordResetStepTwo .divCellCaption {
    width: 40% !important;
}

.irashadowBox .RadComboBox_Forest .rcbHovered .rcbReadOnly .rcbInput {
    color: #FFFFFF;
}

.irashadowBox .RadComboBox_Forest .rcbInputCell {
    background-image: none !important;
    background-color: #003961 !important;
}

.irashadowBox .RadComboBox_Forest .rcbArrowCell {
    background-image: url('../Images/arrow-bottom.png');
    background-color: #003961;
    background-position: center center !important;
    background-repeat: no-repeat;
    background-size: cover;
}

.login-section .RadComboBox_Forest .rcbArrowCell {
    background-image: url(../Images/arrow-bottom.png);
    background-color: #003961;
    background-position: center center !important;
    background-repeat: no-repeat;
    background-size: cover;
}



.iraCustomClass .RadComboBoxDropDown_Forest {
    background-color: #003961;
    color: #FFFFFF;
}

    .iraCustomClass .RadComboBoxDropDown_Forest .rcbHovered {
        background-color: #65879F;
        color: #FFFFFF;
    }

div.login-section-dp {
    padding: 10px;
    border-radius: 10px;
    background-color: #CCCCCC;
    font-family: futura-medium;
}

    div.login-section-dp .RadInput_Forest .riTextBox {
        border-color: #808080;
        background: #FFFFFF;
    }

    div.login-section-dp .RadButton .rbDecorated {
        background-color: #003961;
        border: transparent;
        color: #FFFFFF;
        padding: 5px 10px;
    }

.login-section-dp #pwddiv, .login-section-dp #logindiv {
    margin-top: 20px;
}

.login-section-dp #paneldiv1 {
    width: auto !important;
    float: none !important;
    text-align: center !important;
}

.login-section-dp #paneldiv2 {
    margin-top: 40px;
    float: none !important;
    text-align: center !important;
}

.login-section-dp .successmessage {
    text-align: center;
    display: inherit;
}

.login-section-dp #ContentPlaceHolderBody_PanelForgotUsernameResetPassword .divCellCaption,
.login-section-dp #ContentPlaceHolderBody_PanelForgotUsernameResetPassword + #ContentPlaceHolderBody_PanelReturnButton .divCellCaption {
    /*width: 40% !important;*/
}

.login-section-dp #ContentPlaceHolderBody_PanelPasswordResetStepOne .divCellCaption {
    width: 35% !important;
}

.login-section-dp #ContentPlaceHolderBody_PanelPasswordResetStepTwo .divCellCaption {
    width: 40% !important;
}

.login-section-dp .RadComboBox_Forest .rcbHovered .rcbReadOnly .rcbInput {
    color: #FFFFFF;
}

.login-section-dp .RadComboBox_Forest .rcbInputCell {
    background-image: none !important;
    background-color: #003961 !important;
}

.login-section-dp .RadComboBox_Forest .rcbArrowCell {
    background-image: url('../Images/arrow-bottom.png');
    background-color: #003961;
    background-position: center center !important;
    background-repeat: no-repeat;
    background-size: cover;
}

.dpCustomClass .RadComboBoxDropDown_Forest {
    background-color: #003961;
    color: #FFFFFF;
}

    .dpCustomClass .RadComboBoxDropDown_Forest .rcbHovered {
        background-color: #65879F;
        color: #FFFFFF;
    }

.dpCustomHeader {
    padding: 10px 0px;
}

    .dpCustomHeader #masterdiv {
        border-bottom: 1px solid #003961;
    }

.custom-invalid-msg {
    margin-top: 50px;
}

    .custom-invalid-msg + #ContentPlaceHolderBody_passwordResetSection,
    .custom-invalid-msg + #ContentPlaceHolderBody_accountcompletionSection {
        width: 40% !important;
        box-shadow: none !important;
        background-color: #f2dede !important;
        border: 1px solid #ebccd1 !important;
        color: #a94442 !important;
    }

        .custom-invalid-msg + #ContentPlaceHolderBody_passwordResetSection #ContentPlaceHolderBody_lblRequestInvalid,
        .custom-invalid-msg + #ContentPlaceHolderBody_accountcompletionSection #ContentPlaceHolderBody_lblRequestInvalid {
            color: #a94442 !important;
        }

div.divPaddingTop {
    padding-top: 20px;
}

div.divPaddingLeft {
    padding-left: 20px;
}

div.divCellCaption {
    float: left;
    font-weight: bold;
    text-align: right;
}

div.divCellData {
    clear: both;
    display: table-cell;
    text-align: left;
}

/****Media Queries****/
@media screen and (min-width :980px) {

    .bodywrap {
        width: 550px;
    }

    #paneldiv1 {
        width: 300px;
        float: left;
        text-align: right;
    }

    #paneldiv2 {
        float: left;
        text-align: left;
    }

    #pwddiv {
        margin-top: 10px;
    }

    #logindiv {
        margin-top: 10px;
    }


    .userspan1 {
        width: 100px;
        text-align: right;
        display: inline-block;
    }

    .userspan2 {
        color: red;
    }

    .userspan3 {
        width: 200px;
        text-align: left;
        display: inline-block;
    }

    .usertext {
        width: 150px;
    }

    .loginspan1 {
        width: 100px;
        text-align: right;
        display: inline-block;
    }

    .sendVerificationCodeSpan {
        width: 50px;
        text-align: right;
        display: inline-block;
    }

    .loginspan2 {
        width: 200px;
        text-align: left;
        display: inline-block;
    }

    .logo-container img {
        white-space: nowrap;
        width: 240px;
        height: auto;
    }
}

@media screen and (min-width : 480px) and (max-width : 980px) {
    .bodywrap {
        width: 440px;
    }

    #paneldiv1 {
        width: auto;
        float: left;
        text-align: right;
    }

    #paneldiv2 {
        float: right;
        text-align: left;
    }

    #pwddiv {
        margin-top: 10px;
    }

    #logindiv {
        margin-top: 10px;
        float: none;
    }

    .irashadowBox .userspan1 {
        width: 100px;
    }

    .login-section-dp .userspan1 {
        width: 100px;
    }

    .custom-invalid-msg + #ContentPlaceHolderBody_passwordResetSection,
    .custom-invalid-msg + #ContentPlaceHolderBody_accountcompletionSection {
        width: 80% !important;
    }

    .userspan1 {
        width: auto;
        text-align: left;
        display: inline-block;
    }

    .userspan2 {
        color: red;
    }

    .userspan3 {
        width: auto;
        text-align: left;
        display: inline-block;
    }

    .usertext {
        width: auto;
    }

    .loginspan1 {
        width: auto;
        text-align: right;
        display: inline-block;
    }

    .loginspan2 {
        width: auto;
        text-align: left;
        display: inline-block;
        float: none;
    }

    .hide {
        display: none;
    }

    .logo-container img {
        white-space: nowrap;
        width: 100%;
        height: auto;
    }
}

@media screen and (min-width : 320px) and (max-width : 480px) {
    .bodywrap {
        width: 235px;
    }

    .irashadowBox {
        width: 90%;
    }

    .login-section-dp {
        width: 90%;
    }

    #paneldiv1 {
        width: auto;
        float: left;
        text-align: right;
    }

    #paneldiv2 {
        float: right;
        text-align: left;
    }

    #pwddiv {
        margin-top: 10px;
    }

    .irashadowBox #logindiv {
        float: none;
    }

    .login-section-dp #logindiv {
        float: none;
    }

    #logindiv {
        margin-top: 10px;
        float: right;
    }

    .custom-invalid-msg + #ContentPlaceHolderBody_passwordResetSection,
    .custom-invalid-msg + #ContentPlaceHolderBody_accountcompletionSection {
        width: 80% !important;
    }

    .userspan1 {
        width: auto;
        text-align: left;
        display: inline-block;
    }

    .userspan2 {
        color: red;
    }

    .userspan3 {
        width: auto;
        text-align: left;
        display: inline-block;
    }

    .usertext {
        width: auto;
    }

    .loginspan1 {
        width: auto;
        text-align: right;
        display: inline-block;
    }

    .loginspan2 {
        width: auto;
        text-align: left;
        display: inline-block;
        float: none;
    }

    .logo-container img {
        white-space: nowrap;
        width: 100%;
        height: auto;
    }

    .hide {
        display: none;
    }
}

@media screen and (max-width : 320px) {

    .bodywrap {
        width: 235px;
    }

    .irashadowBox {
        width: 90%;
    }

    .login-section-dp {
        width: 90%;
    }

    .custom-invalid-msg + #ContentPlaceHolderBody_passwordResetSection,
    .custom-invalid-msg + #ContentPlaceHolderBody_accountcompletionSection {
        width: 90% !important;
    }

    #paneldiv1 {
        width: auto;
        float: left;
        text-align: right;
    }

    #paneldiv2 {
        float: right;
        text-align: left;
    }

    #pwddiv {
        margin-top: 10px;
    }

    #logindiv {
        margin-top: 10px;
        float: none;
    }


    .userspan1 {
        width: auto;
        text-align: left;
        display: inline-block;
    }

    .userspan2 {
        color: red;
    }

    .userspan3 {
        width: auto;
        text-align: left;
        display: inline-block;
    }

    .usertext {
        width: auto;
    }

    .loginspan1 {
        width: auto;
        text-align: right;
        display: inline-block;
    }

    .loginspan2 {
        width: auto;
        text-align: left;
        display: inline-block;
        float: none;
    }

    .logo-container img {
        white-space: nowrap;
        width: 100%;
        height: auto;
    }

    .hide {
        display: none;
    }
}


@media screen and (min-width :980px) {
    .mngaccbodywrap {
        width: 500px;
    }

    #divCell {
        width: 175px;
    }

    #divCell1 {
        width: 175px;
    }

    #divCell2 {
        width: 175px;
    }

    #divCell3 {
        width: 175px;
    }

    #divCell4 {
        width: 175px;
    }

    #divCell5 {
        width: 175px;
    }

    .RadButton .radtextbox {
        width: 100%;
    }

    .shadowBox #divCell1,
    .shadowBox #divCell4 {
        width: 1% !important;
    }

    #ContentPlaceHolderBody_bodywrapdiv.shadowBox, #ContentPlaceHolderBody_mngaccbodywrapdiv.shadowBox {
        width: 590px !important;
    }
}

@media screen and (min-width : 480px) and (max-width : 980px) {
    .mngaccbodywrap {
        width: 440px;
    }

    #divCell {
        width: 175px;
    }

    #divCell1 {
        width: 175px;
    }

    #divCell2 {
        width: 175px;
    }

    #divCell3 {
        width: 175px;
    }

    #divCell4 {
        width: 175px;
    }

    #divCell5 {
        width: 175px;
    }

    .radtextbox {
        width: 175px;
    }
}

@media screen and (min-width : 320px) and (max-width : 480px) {
    .mngaccbodywrap {
        width: 240px;
    }

    #divCell {
        width: auto;
    }

    #divCell1 {
        width: auto;
    }

    #divCell2 {
        width: auto;
    }

    #divCell3 {
        width: auto;
    }

    #divCell4 {
        width: auto;
    }

    #divCell5 {
        width: auto;
    }

    .radtextbox {
        width: auto;
    }
}

@media screen and (max-width : 320px) {
    .mngaccbodywrap {
        width: 240px;
    }

    #divCell {
        width: auto;
    }

    #divCell1 {
        width: auto;
    }

    #divCell2 {
        width: auto;
    }

    #divCell3 {
        width: auto;
    }

    #divCell4 {
        width: auto;
    }

    #divCell5 {
        width: auto;
    }

    .radtextbox {
        width: auto;
    }
}

/****For Tablet Mode****/
@media only screen and (min-width: 768px) and (max-width: 991px) {
    #ContentPlaceHolderBody_bodywrapdiv.login-section,
    #ContentPlaceHolderBody_mngaccbodywrapdiv.login-section {
        width: 50% !important;
    }

    /*#ContentPlaceHolderBody_accountcompletionSection.login-section .custom-width {
        width: 200% !important;
    }*/

    #ContentPlaceHolderBody_passwordResetSection.login-section {
        width: 60% !important;
    }

        #ContentPlaceHolderBody_passwordResetSection.login-section .divPaddingTop {
            padding-left: 10% !important;
        }

    .login-section {
        width: 50% !important;
    }

        .login-section #paneldiv1 {
            width: auto !important;
            float: none !important;
            text-align: center !important;
        }

        .login-section #paneldiv2 {
            float: none !important;
            text-align: center !important;
        }

        .login-section .divCellCaption {
            width: 28% !important;
        }

    #ContentPlaceHolderBody_mngaccbodywrapdiv.login-section #ContentPlaceHolderBody_PanelRetrieveUsername #divCell3 {
        width: 30% !important;
    }

    #ContentPlaceHolderBody_PanelRetrieveUsername + #ContentPlaceHolderBody_PanelReturnButton #divCell4 {
        width: 35% !important;
    }
}

/****For Mobile Mode****/
@media only screen and (max-width: 767px) {
    #ContentPlaceHolderBody_bodywrapdiv.login-section,
    #ContentPlaceHolderBody_mngaccbodywrapdiv.login-section {
        width: 80% !important;
    }

    /*#ContentPlaceHolderBody_accountcompletionSection.login-section .custom-width {
        width: 150% !important;
    }*/

    #ContentPlaceHolderBody_passwordResetSection.login-section {
        width: 70% !important;
    }

        #ContentPlaceHolderBody_passwordResetSection.login-section .divPaddingTop {
            padding-left: 5% !important;
        }

    .login-section {
        width: 80% !important;
    }

        .login-section #paneldiv1 {
            width: auto !important;
            float: none !important;
            text-align: center !important;
        }

        .login-section #paneldiv2 {
            float: none !important;
            text-align: center !important;
        }

    #ContentPlaceHolderBody_mngaccbodywrapdiv.login-section #ContentPlaceHolderBody_PanelRetrieveUsername #divCell3 {
        width: 22% !important;
    }

    #ContentPlaceHolderBody_PanelRetrieveUsername + #ContentPlaceHolderBody_PanelReturnButton #divCell4 {
        width: 29% !important;
    }
}

/****Overwriting custom media queries****/
@media screen and (min-width: 981px) and (max-width: 1140px) {
    #ContentPlaceHolderBody_bodywrapdiv.login-section,
    #ContentPlaceHolderBody_mngaccbodywrapdiv.login-section {
        width: 580px !important;
    }

    .login-section {
        width: 40% !important;
    }

        .login-section .divCellCaption {
            width: 30% !important;
        }
}

@media screen and (min-width :980px) {
    #ContentPlaceHolderBody_accountcompletionSection.login-section {
        width: 770px !important;
    }

    #ContentPlaceHolderBody_accountcompletionSection.irashadowBox {
        width: 770px !important;
    }

    .login-section {
        width: 40% !important;
    }

        .login-section #paneldiv1 {
            width: auto !important;
            float: none !important;
            text-align: center !important;
        }

        .login-section #paneldiv2 {
            float: none !important;
            text-align: center !important;
        }

        .login-section #divCell, .login-section #divCell2, .login-section #divCell3 {
            width: 40% !important;
        }

        .login-section #divCell1,
        .login-section #divCell4 {
            width: 1% !important;
        }

        .login-section .divCellCaption {
            /*width: 30% !important;*/
        }

    .login-section-dp #divCell1,
    .login-section-dp #divCell4 {
        width: 1% !important;
    }
}

@media screen and (min-width : 480px) and (max-width : 980px) {
    #ContentPlaceHolderBody_bodywrapdiv.login-section,
    #ContentPlaceHolderBody_mngaccbodywrapdiv.login-section {
        width: 60% !important;
    }

    .login-section {
        width: 60% !important;
    }

        .login-section #paneldiv1 {
            width: auto !important;
            float: none !important;
            text-align: center !important;
        }

        .login-section #paneldiv2 {
            float: none !important;
            text-align: center !important;
        }

        .login-section #pwddiv .userspan3 {
            margin-left: 10px !important;
        }

        .login-section #logindiv .loginspan2 {
            margin-left: -20px !important;
        }

        .login-section #divCell, .login-section #divCell1,
        .login-section #divCell2, .login-section #divCell3,
        .login-section #divCell4 {
            /*width: 40% !important;*/
        }

        .login-section .divCellCaption {
            width: 28% !important;
            text-align: initial !important;
        }
}

@media screen and (min-width : 320px) and (max-width : 480px) {
    #ContentPlaceHolderBody_bodywrapdiv.login-section,
    #ContentPlaceHolderBody_mngaccbodywrapdiv.login-section {
        width: 90% !important;
    }

    .login-section {
        width: 90% !important;
    }

        .login-section #paneldiv1 {
            width: auto !important;
            float: none !important;
            text-align: center !important;
        }

        .login-section #paneldiv2 {
            float: none !important;
            text-align: center !important;
        }

        .login-section #logindiv {
            float: none !important;
        }

        .login-section #pwddiv .userspan3 {
            margin-left: 10px !important;
        }

        .login-section #logindiv .loginspan2 {
            margin-left: -20px !important;
        }

        .login-section #divCell, .login-section #divCell1,
        .login-section #divCell2, .login-section #divCell3,
        .login-section #divCell4 {
            width: 35% !important;
        }

    .irashadowBox #divCell, .irashadowBox #divCell1,
    .irashadowBox #divCell2, .irashadowBox #divCell3,
    .irashadowBox #divCell4 {
        width: 35% !important;
    }

    .login-section-dp #divCell, .login-section-dp #divCell1,
    .login-section-dp #divCell2, .login-section-dp #divCell3,
    .login-section-dp #divCell4 {
        width: 35% !important;
    }

    .login-section .divCellCaption {
        width: 25% !important;
        text-align: initial !important;
    }
}

@media screen and (max-width : 320px) {
    .login-section #paneldiv1 {
        width: auto !important;
        float: none !important;
        text-align: center !important;
    }

    .login-section #paneldiv2 {
        float: none !important;
        text-align: center !important;
    }

    .login-section #divCell, .login-section #divCell1,
    .login-section #divCell2, .login-section #divCell3,
    .login-section #divCell4 {
        width: 35% !important;
    }

    .login-section .divCellCaption {
        width: 30% !important;
    }
}

.marginBottom {
    margin-bottom: 10px;
}

.displayInline {
    display: inline-block;
}

input[type=checkbox], input[type=radio] {
    vertical-align: text-bottom;
    margin-right: 5px !important;
    position: relative;
    bottom: 1px;
}

@font-face {
    font-family: 'proxima-nova-light';
    src: url("../fonts/proxima-nova-light-webfont.eot");
    src: url("../fonts/proxima-nova-light-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/proxima-nova-light-webfont.woff") format("woff"), url("../fonts/proxima-nova-light-webfont.ttf") format("truetype");
}

@font-face {
    font-family: 'proxima-nova-regular';
    src: url("../fonts/proxima-nova-regular-webfont.eot");
    src: url("../fonts/proxima-nova-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/proxima-nova-regular-webfont.woff") format("woff"), url("../fonts/proxima-nova-regular-webfont.ttf") format("truetype");
}

@font-face {
    font-family: 'proxima-nova-bold';
    src: url("../fonts/proxima-nova-bold-webfont.eot");
    src: url("../fonts/proxima-nova-bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/proxima-nova-bold-webfont.woff") format("woff"), url("../fonts/proxima-nova-bold-webfont.ttf") format("truetype");
}

@font-face {
    font-family: 'proxima-nova-bold-italic';
    src: url("../fonts/proxima-nova-bold-italic-webfont.eot");
    src: url("../fonts/proxima-nova-bold-italic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/proxima-nova-bold-italic-webfont.woff") format("woff"), url("../fonts/proxima-nova-bold-italic-webfont.ttf") format("truetype");
}

@font-face {
    font-family: 'futura-light';
    src: url('../fonts/Futura_WebFont/Futura-Light.eot');
    src: url("../fonts/Futura_WebFont/Futura-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/Futura_WebFont/Futura-Light.woff") format("woff"), url("../fonts/Futura_WebFont/Futura-Light.ttf") format("truetype");
}

@font-face {
    font-family: 'futura-medium';
    src: url('../fonts/Futura_WebFont/Futura-Medium.eot');
    src: url("../fonts/Futura_WebFont/Futura-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/Futura_WebFont/Futura-Medium.woff") format("woff"), url("../fonts/Futura_WebFont/Futura-Medium.ttf") format("truetype");
}

@font-face {
    font-family: 'futura-bold';
    src: url('../fonts/Futura_WebFont/Futura-Bold.eot');
    src: url("../fonts/Futura_WebFont/Futura-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Futura_WebFont/Futura-Bold.woff") format("woff"), url("../fonts/Futura_WebFont/Futura-Bold.ttf") format("truetype");
}

@font-face {
    font-family: 'futura-italic';
    src: url('../fonts/Futura_WebFont/Futura-Italic.eot');
    src: url("../fonts/Futura_WebFont/Futura-Italic.eot?#iefix") format("embedded-opentype"), url("../fonts/Futura_WebFont/Futura-Italic.woff") format("woff"), url("../fonts/Futura_WebFont/Futura-Italic.ttf") format("truetype");
}

@font-face {
    font-family: 'futura-book';
    src: url('../fonts/Futura_WebFont/Futura-Book.eot');
    src: url("../fonts/Futura_WebFont/Futura-Book.eot?#iefix") format("embedded-opentype"), url("../fonts/Futura_WebFont/Futura-Book.woff") format("woff"), url("../fonts/Futura_WebFont/Futura-Book.ttf") format("truetype");
}

@font-face {
    font-family: 'futura-thin';
    src: url('../fonts/Futura_WebFont/Futura-Thin.eot');
    src: url("../fonts/Futura_WebFont/Futura-Thin.eot?#iefix") format("embedded-opentype"), url("../fonts/Futura_WebFont/Futura-Thin.woff") format("woff"), url("../fonts/Futura_WebFont/Futura-Thin.ttf") format("truetype");
}

@font-face {
    font-family: 'futura-normal';
    src: url('../fonts/Futura_WebFont/Futura-Normal.eot');
    src: url("../fonts/Futura_WebFont/Futura-Normal.eot?#iefix") format("embedded-opentype"), url("../fonts/Futura_WebFont/Futura-Normal.woff") format("woff"), url("../fonts/Futura_WebFont/Futura-Normal.ttf") format("truetype");
}

@font-face {
    font-family: 'futura-heavy';
    src: url('../fonts/Futura_WebFont/Futura-Heavy.eot');
    src: url("../fonts/Futura_WebFont/Futura-Heavy.eot?#iefix") format("embedded-opentype"), url("../fonts/Futura_WebFont/Futura-Heavy.woff") format("woff"), url("../fonts/Futura_WebFont/Futura-Heavy.ttf") format("truetype");
}

@font-face {
    font-family: 'apex-new';
    src: url('../fonts/apexnewbookwebfont.eot');
    src: url("../fonts/apexnewbookwebfont.eot.eot?#iefix") format("embedded-opentype"), url("../fonts/apexnewbookwebfont.woff") format("woff"), url("../fonts/apexnewbookwebfont.ttf") format("truetype");
}
