@charset "UTF-8";

/*
===================================================
Additional styles other than COC pattern library 
and Overwritten styles of COC pattern library 
===================================================
*/

/*
Overwritten styles for COC Pattern Library (coc-styles.css) file
---------------------------------------------------------------------
 
table.cui td, table.cui th {
  text-align: left;
  padding: 0px 3px;
  padding: 0rem 0.3rem;
  background-color: transparent;
  font-size: 13px;
}

table.cui.dark-header th {
  background-color: #424242;
  color: #ffffff;
  border: 1px solid #cccccc;
  font-weight: normal;
}
   
    p {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 12px;
  margin-top: 12px;
  font-weight: 400;
  /*max-width: $text-max-width;*/
/*max-width: 1680px;
}
@media only screen and (min-width: 320px) {
  p {
    font-size: 16px;
    font-size: 1.6rem;
    /*max-width: 440px;
    max-width: 44rem;*/
/* }
}
@media only screen and (min-width: 480px) {
  p {
    font-size: 16px;
    font-size: 1.6rem;
    /*max-width: 490px;
    max-width: 49rem;*/
/* }
}
@media only screen and (min-width: 768px) {
  p {
    font-size: 16px;
    font-size: 1.6rem;
   /* max-width: 560px;
    max-width: 56rem;*/
/* }
}
@media only screen and (min-width: 992px) {
  p {
    font-size: 16px;
    font-size: 1.6rem;
    /*max-width: 600px;
    max-width: 60rem;*/
/*}
}
@media only screen and (min-width: 1200px) {
  p {
    font-size: 16px;
    font-size: 1.6rem;
    /*max-width: 680px;
    max-width: 56rem;*/
/*}
}
@media only screen and (min-width: 1680px) {
  p {
    font-size: 16px;
    font-size: 1.6rem;
   /* max-width: 700px;
    max-width: 70rem;*/
/*}
}

=========================
End of overwritten styles
=========================
*/


/* MASTER PAGE AND LAYOUT
----------------------------------------------------------*/

.topLabelRight
{
    /*  text-align: right;*/
    float: right;
    width: auto;
    display: table-row;
    vertical-align: middle;
    text-align: right;
    padding-right: 24px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    padding-top: 2px;
}

.topLabelRightInternalDivs
{
    float: right;
    width: auto;
    display: table-column;
    margin-left: 4px;
    margin-bottom: 0px;
    padding-bottom: 0px;
}

.mainConetentPanel
{
    /* Main panel the page; used in header, body, and footer */
    vertical-align: top;
    padding-left: 272px;
    padding-right: 24px;
    padding-top: 26px;
}


.sideMenuContainer
{
    margin-right: 20px;
    padding-left: 36px;
    clear: left;
    float: left;
}

a.sideMenuLink, a.sideMenuLink:active, a.sideMenuLink:link, .sideMenuLink:hover, .sideMenuHeading, a.sideMenuLinkDisabled, a.sideMenuLinkDisabled:active, a.sideMenuLinkDisabled:hover, a.sideMenuLinkDisabled:link
{
    border-style: none;
    padding-left: 14px;
    padding-right: 8px;
    text-align: left;
    background: #424242; /*background: #363D43;*/
    color: #EEF0F0;
    margin-top: 0px;
    text-decoration: none;
    border-top-color: #EEF0F0;
    border-top-style: inset;
    border-top-width: 1px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.sideMenuHeading
{
    font-weight: bold;
    background-color: #dee1e2;
    color: #424242;
    border-top-color: transparent;
}

.sideMenuLink:hover
{
    /* background: #6b767e;*/
    background: #6b767e;
    text-decoration: none;
    color: #EEF0F0;
}

a.sideMenuLinkDisabled, a.sideMenuLinkDisabled:active, a.sideMenuLinkDisabled:hover, a.sideMenuLinkDisabled:link
{
    color: #808080; /* #808080; gray; */
}

.sideMenu
{
    float: left;
    width: 216px;
    text-align: left;
    padding-top: 14px;
}


@media only screen and (max-width: 768px)
{
    .sideMenu
    {
        width: 144px;
        clear: both;
    }
    .sideMenuContainer
    {
        margin-right: 10px;
        padding-left: 10px;
    }
    .mainConetentPanel
    {
        /* Main panel the page; used in header, body, and footer */
        vertical-align: top;
        padding-left: 164px;
        padding-right: 24px;
        padding-top: 26px;
    }
}


@media only screen and (max-width: 320px)
{
    .sideMenu
    {
        width: 144px;
        clear: both;
    }
    .sideMenuContainer
    {
        margin-right: 10px;
        padding-left: 10px;
    }
    .mainConetentPanel
    {
        /* Main panel the page; used in header, body, and footer */
        clear: both;
        vertical-align: top;
        padding-left: 10px;
        padding-right: 24px;
        padding-top: 10px;
    }
}


/* Custom Gridview Styles
----------------------------------------------------------*/

.hideGridColumn
{
    display: none;
}

/* Table and COC Pattern library overwriten Styles
----------------------------------------------------------*/

table.cui td, table.cui th
{
    text-align: left;
    padding: 0px 3px;
    padding: 0rem 0.3rem;
    background-color: transparent;
    font-size: 13px;
}

table.cui.dark-header th
{
    background-color: #424242;
    color: #ffffff;
    border: 1px solid #cccccc;
    font-weight: normal;
}


table.cui.dark-header th a
{
    background-color: #424242;
    color: #ffffff;
    font-weight: normal;
    text-decoration: underline;
}


/* Table styles for input FORMS */
table.cui tdf
{
    text-align: left;
    padding: 0px 3px;
    padding: 0rem 0.3rem;
    background-color: transparent;
    font-size: 14px;
}

td.formElement
{
    font-size: 1em !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
    background-color: #dee1e2;
}

td.formElementCDStep
{
    font-size: 1em !important;
}

td.tdWizardStep
{
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    font-size: .8em !important;
}

tr.trWizardControl
{
    background-color: #eef0f0 !important;
}

tr.trWizardOptions
{
    height: 40px !important;
    background-color: #eee !important;
}


/* OTHERS
----------------------------------------------------------*/

.shadedContent
{
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 10px;
    margin-top: 10px;
    padding-bottom: 0px;
    padding-top: 4px;
    padding-left: 4px;
    padding-right: 4px;
    background-color: #eef0f0;
    width: 100%;
}

.inputFields
{
    padding-left: 2px;
    padding-bottom: 2px;
    padding-right: 2px;
    padding-top: 2px;
    color: #3F474E;
    font-size: 1em;
    width: 244px;
}

.formInstructionText
{
    padding-left: 3px;
    padding-right: 3px;
    text-align: left;
}

.divStepTabToBeVisited
{
    margin-right: 8px;
    padding-left: 6px;
    padding-right: 6px;
    background-color: #dee1e2; /*border-width: 2px; border-style: solid; border-color: gray; */ /*border: 2px solid #9da4a9;*/
    border: 2px solid #6e7172;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.divStepTabVisited
{
    margin-right: 8px;
    padding-left: 6px;
    padding-right: 6px;
    background-color: #9da4a9; /*border-width: 2px; border-style: solid; border-color: gray; */ /*border: 2px solid #9da4a9;*/
    border: 2px solid #6d7479;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.divStepTabActive
{
    margin-right: 8px;
    padding-left: 6px;
    padding-right: 6px;
    color: #FFFFFF; /*background-color: #337ab7;     border: 2px solid #0f5693;*/
    background-color: #005670;
    border: 2px solid #002640;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.wizardStepMainLabelCDMR
{
    font-size: .9em;
}
.wizardStepDetailLabelCDMR
{
    font-size: .8em;
}
.wizardStepMainLabelCD
{
    font-size: 1.6em;
}
.wizardStepDetailLabelCD
{
    font-size: 1.1em;
}
.wizardStepMainLabelSWMR
{
    font-size: 1.3em;
}
.wizardStepDetailLabelSWMR
{
    font-size: .9em;
}


.inputFields:focus
{
    -webkit-box-shadow: 0px 0px 2px 2px #0394FF, -4px 7px 11px rgba(0, 0, 0, 0.35);
    -moz-box-shadow: 0px 0px 2px 2px #0394FF, -4px 7px 11px rgba(0, 0, 0, 0.35);
    box-shadow: 0px 0px 2px 2px #0394FF, -4px 7px 11px rgba(0, 0, 0, 0.35);
    outline-style: none; /* 1st */
    outline: 2px solid #0394FF \9; /* 2nd -- IE8 hack  */
}


.frameHeadingWizardOptions
{
    width: 100%;
    background-color: #c8102e;
    color: #FFFFFF;
    font-weight: bold;
    margin-bottom: 12px;
    text-align: left;
}

.frameHeading
{
    width: 100%;
    background-color: #C8102E;
    color: #FFFFFF;
    margin-bottom: 8px;
    text-align: left;
}

.frameWizardOptions
{
    display: inline-block;
    padding-top: 2px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 2px;
    border-color: #485259;
    border-width: 2px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border-style: solid;
    margin-top: 18px;
    width: auto;
    margin-left: auto;
    margin-right: auto;
    background-color: #eee;
    margin-bottom: 10px;
}

.frameBlock
{
    display: inline-block;
    padding-top: 0px;
    padding-bottom: 2px;
    border-color: #bec0c0;
    border-width: 1px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border-style: solid;
    margin-top: 12px;
    width: auto;
    margin-left: auto;
    margin-right: auto;
}

.frameNFullWidth
{
    padding-top: 0px;
    padding-bottom: 2px;
    border-style: none;
    margin-top: 12px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.errorText
{
    width: 100%;
    color: Red;
    font-weight: bold;
}

.messageText
{
    width: 100%;
    color: Black;
    font-weight: bold;
}

.buttonDiv
{
    width: 100%;
    clear: both;
    float: right;
    text-align: right;
    margin-bottom: 2px;
}

.buttonDivCenter
{
    width: 100%;
    margin-top: 6px;
    margin-bottom: 10px;
    text-align: center;
}

.messageDiv
{
    width: 100%;
    text-align: center;
    margin-top: 14px;
    clear: both;
    margin-bottom: 14px;
}

.messageTextDetail
{
    width: 100%;
    color: Black;
    font-size: .8em;
}

.errorSummary
{
    width: 100%;
    color: Red;
    font-weight: bold;
    font-size: .9em;
    padding-left: 20px;
}

.sortImage
{
    height: 14px;
    width: 21px;
}

.divRow
{
    display: table-row;
    width: auto;
}


/*
====================
End of custom styles
====================
*/