a
{
    color: #6c2482;
}

a:hover
{
    color: #6c2482;
}

h1, h2, h3
{
    color: #acca57;
    font-weight: bold;
}
h1
{
    font-size: 22px;
}

h2
{
    font-size: 18px;
}

h3
{
    font-size: 14px;
}

p, ul
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    padding-right: 5px;
}

fieldset
{
    border: solid 1px #c1a8ce;
    margin-top: 10px;
    padding: 5px;
}

/* adds some right padding to dropdown list options as some browsers(FireFox 2.0)  truncate them */
option
{
    padding-right: 5px;
}

/* removes the style type of each list item. 
The unordered list has to be within table cell or div element - otherwise this style will not apply */
td ul li, div ul li
{
    list-style-type: none;
}

/* section elements default styles ends */

.label
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

/*main style for tables - empty cells are hidden*/
table.contentTable
{
    empty-cells: hide;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #6c2482;
    border-collapse: collapse;
    width: 100%;
}

/*main style for tables - empty cells are not hidden*/
table.contentTableEmptyCells
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #6c2482;
    border-collapse: collapse;
    width: 100%;
}

/*use this style for the left cell only*/
td.TableCellLeft
{
    text-align: left;
    width: 30%;
    vertical-align: top;
    padding-top: 4px;
    padding-bottom: 4px;
}

td.TableCellRight
{
}

/*use this style for the left cell with indent*/
td.TableCellLeftPadded
{
    text-align: left;
    width: 30%;
    vertical-align: top;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 30px;
}

/*use this style for tables where has only one cell*/
td.tableCell
{
    text-align: left;
    padding-top: 4px;
    padding-bottom: 4px;
}

/* use this style for tables where has only one cell with indent */
td.tableCellPadded
{
    text-align: left;
    vertical-align: top;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 30px;
}

/* use this style for header cell within content table */
td.headerCell
{
    background-color: #6C2482;
    color: #FFF;
    font-weight: bold;
    padding: 2px;
}

/* bordered table with hidden empty cells */
table.BorderedTable
{
    empty-cells: hide;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    background-color: #6c2482;
    border: solid 1px #6C2482;
    border-collapse: collapse;
    margin-top: 10px;
    width: 100%;
}

/* use this style for bordered table with empty cells and appy obly for table html elements */
table.borderedTableWithEmptyCell
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    background-color: #6c2482;
    border: solid 1px #6C2482;
    border-collapse: collapse;
    margin-top: 10px;
    width: 100%;
}

/*gives a space on top and bottom within cell*/
td.BorderedCell
{
    border-top: solid 1px #6C2482;
    background-color: #FFF;
    font-weight: bold;
    padding: 0 2px 0 2px;
    line-height: 25px;
}

/*only apply a border without any space on top and bottom*/
td.borderedCellPlain
{
    border-top: solid 1px #6C2482;
    background-color: #FFF;
    font-weight: bold;
    padding: 0 2px 0 2px;
}

td.HeaderBorderedCell
{
    border-top: solid 1px #6C2482;
    font-weight: bold;
    color: #FFFFFF;
    background-color: Transparent;
    padding: 0 2px 0 2px;
}

/* use this style to display hyper links withitn table */
table.displaylinks
{
    border-collapse: collapse;
    margin-top: 5px;
}


.paddedCell
{
    padding-left: 6px;
    padding-right: 6px;
}

/* use this style for sub titles within the page with fonr size 18px */
.pageTitle
{
    font-family: Arial Narrow;
    font-weight: bold;
    font-size: 18px;
    color: #acca57;
}

/* use this style for the main page title */
.pageTitleBig
{
    font-family: Arial Narrow;
    font-weight: bold;
    font-size: 20px;
    color: #acca57;
}

/* bolded text */
.BoldedText
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
}

/* bolded number style */
.BoldedNumber
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    text-align: right;
}

/* use this style for bolded label*/
.BoldLabel
{
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 12px;
}

/* use this style for notes, descr etc...*/
.descr
{
    color: #6c2482;
    font-size: 12px;
    font-style: italic;
    margin-bottom: 6px;
}

/* use this style for bolded appeal "Please enter..", "Please select..." ...*/
.appealBold
{
    color: #6c2482;
    font-size: 12px;
    font-weight: bold;
    margin-bottom: 6px;
}

/* use this style for bolded notes, descr etc...*/
.descrBold
{
    color: #6c2482;
    font-size: 12px;
    font-style: italic;
    font-weight: bold;
    margin-bottom: 6px;
}

/* use this style only for error text messages */
.ErrorText
{
    color: #FF3300 !important;
    font-weight: bold !important;
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
    vertical-align: top;
    font-variant: normal;
    text-transform: none;
}

/* use this style for bolded errors */
.ErrorLabel
{
    color: #FF3300 !important;
    font-weight: bold !important;
    font-size: small;
    font-family: Arial, Helvetica, sans-serif;
    vertical-align: top;
    font-variant: normal;
    text-transform: none;
}

/* use this style for a list of error messages */
.errorList
{
    font-family: Arial, Helvetica, Sans-Serif;
    font-size: 10px;
    color: #FF3300;
    margin-bottom: 10px;
}

.linkWithinError
{
    font-weight: bold !important;
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
    vertical-align: top;
    font-variant: normal;
    text-transform: none;
}

/* apply this style only for div or asp:panel elements,
 when you want to separate the current element from the bottom element*/
.bottomOffset
{
    margin-bottom: 10px;
}

/* use this style to dysplay a text within the centered div, like on HFUnderwriting page.
 Apply style only for div */
div.smallBox
{
    width: 650px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
}

/* use this style for drop down list if the font is different rather than the other controls within the page */
.DropDownListFont
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    border: solid 1px #c1a8ce;
}

/* apply this style for buttons*/
.ButtonSearch
{
    color: #6C2482;
    cursor: pointer;
}

/*ASK: what will happen if we do not use this style fro the password? 
I think that the style apply for all input will apply and for this textbox*/
.PasswordStrengthInvalid
{
    color: #FF3300 !important;
    font-weight: bold !important;
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
    vertical-align: top;
    font-variant: normal;
    text-transform: none;
    padding: 3px 3px 3px 3px;
}

.PasswordStrengthValid
{
    color: #6c2482 !important;
    font-weight: bold !important;
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
    vertical-align: top;
    font-variant: normal;
    text-transform: none;
    padding: 3px 3px 3px 3px;
}


/* Starts Address pop-up styles */
.modalBackground
{
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.panelPopupStyle
{
    height: 370px;
    overflow: auto;
    background-color: #f2f2f2;
    border-color: #808080;
    border-style: solid;
    border-width: 0px 1px;
    padding-top: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
}

.panelPopupStyleConfirm
{
    height: 370px;
    overflow: auto;
    background-color: #f2f2f2;
    border-color: #808080;
    border-style: solid;
    border-width: 0px 1px;
    padding-top: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
}

.modalPopup
{
    background-color: #fff;
    padding-top: 2px;
    padding-right: 3px;
    display: block;
    position: absolute;
    z-index: 1000;
}

.popupContainer
{
    width: 420px;
    border: solid 1px #808080;
    border-width: 1px 0px;
}

.popupHeader
{
    background: url(          'Images/sprite.png' ) repeat-x 0px -200px;
    color: #000;
    border-color: #808080 #808080 #ccc;
    border-style: solid;
    border-width: 0px 1px 1px;
    padding: 3px 10px;
}

.popupHeader .msg
{
    font-weight: bold;
}

.popupClose
{
    right: 7px;
    background: url(          'Images/sprite.png' ) no-repeat 0px -300px;
    width: 25px;
    cursor: pointer;
    position: absolute;
    top: 7px;
    height: 15px;
}

.popupFooter
{
    background-color: #f2f2f2;
    border-color: #808080;
    border-style: none solid;
    border-width: 0px 1px;
    text-align: right;
    padding-bottom: 8px;
    padding-right: 15px;
    padding-top: 15px;
}
/*Ends Address pop-up styles */

/* header with border on top and on the bottom - apply only on divs or table cell */
div.Header2, td.Header2
{
    border-top: solid 1px #6C2482;
    border-bottom: solid 1px #6C2482;
    font-size: 16px;
    font-weight: bold;
    width: 100%;
}

/* display help info message with border */
table.ContributionBreakdown
{
    border: solid 1px #6C2482;
    background-color: #c1a8ce;
}

/* use this style for amounts displayed within the static text */
.ContributionAmount
{
    margin-left: 4px;
    margin-right: 4px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #6C2482;
    font-weight: bold;
}

/*use this style when you want to apply a dotted top border for div or table cell*/
div.dottedTopBorder, td.dottedTopBorder
{
    width: 100%;
    border-top: dotted 1px #6C2482;
}

/* Div layout styles*/

/* Apply this style to div elements only - div element represents a row with no padding and margin*/
div.formView
{
    clear: left;
    margin: 0;
    padding: 0;
    padding-top: 5px;
}

/* Apply this style to div elements only - div element represents a row with no padding and margin*/
div.formViewPlain
{
    clear: left;
    margin: 0;
    padding: 0;
}

/* Apply this style to label within the div row – 
when the label is on the left to be positioned every label on each row 
in the same manner it has to be flotten using this style */
.floatlabel
{
    float: left;
    width: 30%;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

/* float label when use div for rows - this style is inuse for datalist item templates layout */
.floatlabellong
{
    float: left;
    width: 80%;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
}

.editBoxMargin
{
    margin: 4px;
}

/* style for accordion */
.accordionHeader
{
    border: 1px solid #6C2482;
    color: White;
    background-color: #6C2482;
    font-family: Arial,Sans-Serif;
    font-size: 12px;
    font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;
}

.accordionContent
{
    background-color: #F1E0F4;
    border: 1px dashed #2f4f4f;
    border-top: none;
    padding: 5px;
    padding-top: 10px;
}

/* progressbar styles */
.unproccessedState
{
    background-color: #F1E0F4;
    color: #6C2482;
    padding: 0.3em;
}
.proccessedState
{
    background-color: #B240C6;
    color: #FFFFFF;
    padding: 0.3em;
}
.selectedState
{
    background-color: #6C2482;
    color: #FFFFFF;
    padding: 0.3em;
}

/* this style is for the loading update progress control within the master page */
.updateProgress
{
    background-color: #6C2482;
    color: #fff;
}

/* this style is for the forgot login link within the welcome page */

/* login control layout styles */
#userLoginSection
{
    position: relative; 
    width: 500px; 
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
}

#userLoginWrapper
{
    background-image:url('Images/Welcome/Rounded_bg.gif');
    background-repeat:no-repeat;
    background-position:0 0;
    height:85px;
    padding:4px 3px 4px 7px;
    text-align:left;
}

table.loginTableStyle
{
    border-collapse: collapse; 
    display: block; 
    border:none 0;
}
th.loginTitle
{
    color: #acca57;
    font-size: 14px;
    text-align: left;
    font-weight: bold;
}

.loginLabel
{
    margin-right: 5px;
    text-align: left;
    padding-top: 5px;
}

.loginTextBox
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    height: 18px;
    border: Solid 1px #c1a8ce;
    color: #6c2482;
}

/* position the link buttons on new line */
.linkBlock, span.displayBlock
{
    display: block;
    margin-bottom: 3px;
}

/* this style is used for the Welcome page */
.imageButtonMarginR
{
    margin-top: 10px;
    margin-left: 45px;
}

/* apply this style for all radio buttons */
table.radioButtonList
{
    padding: 0;
    margin: 0;
}

/* this style applyes automatically, when the radio button list has the style above */
table.radioButtonList td label
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    margin-left: 5px;
    margin-right: 5px;
}

/* apply this class to all checkbox controls */
span.checkBox
{
    padding: 0;
    margin: 0;
}

/* this style applies automatically to the label element within the checkBox control */
span.checkBox label
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    margin-left: 5px;
}

/* Rounded Button styles */
.extraSmallButton
{
    background-color: #6c2482;
    background-image: url(          'Images/extraSmallButton.png' );
    background-repeat: no-repeat;
    width: 80px;
    height: 22px;
    font-size: 12px;
    font-weight: bold;
    color: #FFF;
    border: none;
    border-width: 0;
    border-color: #fff;
    cursor: pointer;
    font-family: Arial, Helvetica, sans-serif;
}
.smallButton
{
    background-color: #6c2482;
    background-image: url(              'Images/smallButton.png' );
    background-repeat: no-repeat;
    width: 120px;
    height: 22px;
    font-size: 12px;
    font-weight: bold;
    color: #FFF;
    border: none;
    cursor: pointer;
    font-family: Arial, Helvetica, sans-serif;
}
.medButton
{
    background-color: #6c2482;
    background-image: url(              'Images/medButton.png' );
    background-repeat: no-repeat;
    width: 160px;
    height: 22px;
    font-size: 12px;
    font-weight: bold;
    color: #FFF;
    border: none;
    cursor: pointer;
    font-family: Arial, Helvetica, sans-serif;
}
.largeButton
{
    background-color: #6c2482;
    background-image: url(              'Images/largeButton.png' );
    background-repeat: no-repeat;
    width: 200px;
    height: 22px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #FFF;
    border: none;
    cursor: pointer;
}
.extraLargeButton
{
    background-color: #6c2482;
    background-image: url(              'Images/extraLargeButton.png' );
    background-repeat: no-repeat;
    width: 260px;
    height: 22px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #FFF;
    border: none;
    cursor: pointer;
}
.helpButton
{
    background-color: #6c2482;
    background-image: url(              'Images/helpButton.png' );
    background-repeat: no-repeat;
    width: 16px;
    height: 16px;
    border: none;
    cursor: pointer;
}
/* styles for disabled rounded buttons */
.extraSmallButtonDisable
{
    background-color: #6c2482;
    background-image: url(          'Images/extraSmallButtonDisable.png' );
    background-repeat: no-repeat;
    width: 80px;
    height: 22px;
    font-size: 12px;
    font-weight: bold;
    color: #a3a3a3;
    border: none;
    border-width: 0;
    border-color: #fff;
    font-family: Arial, Helvetica, sans-serif;
}
.smallButtonDisable
{
    background-color: #6c2482;
    background-image: url(              'Images/smallButtonDisable.png' );
    background-repeat: no-repeat;
    width: 120px;
    height: 22px;
    font-size: 12px;
    font-weight: bold;
    color: #a3a3a3;
    border: none;
    font-family: Arial, Helvetica, sans-serif;
}
.medButtonDisable
{
    background-color: #6c2482;
    background-image: url(              'Images/medButtonDisable.png' );
    background-repeat: no-repeat;
    width: 160px;
    height: 22px;
    font-size: 12px;
    font-weight: bold;
    color: #a3a3a3;
    border: none;
    font-family: Arial, Helvetica, sans-serif;
}
.largeButtonDisable
{
    background-color: #6c2482;
    background-image: url(              'Images/largeButtonDisable.png' );
    background-repeat: no-repeat;
    width: 200px;
    height: 22px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #a3a3a3;
    border: none;
}
.extraLargeButtonDisable
{
    background-color: #6c2482;
    background-image: url(              'Images/extraLargeButtonDisable.png' );
    background-repeat: no-repeat;
    width: 260px;
    height: 22px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #a3a3a3;
    border: none;
}
.buttonOffset
{
    padding-top: 3px;
    padding-bottom: 3px;
}

/* style used to apply skin for the Browse button within <asp:FileUpload /> control */
div.fileinputs
{
    position: relative;
    height: 22px;
    width: 350px; /*border: solid 1px red;*/
}

input.filehidden
{
    position: relative;
    text-align: right;
    -moz-opacity: 0;
    filter: alpha(opacity: 0);
    opacity: 0;
    z-index: 2;
    margin: 0;
    padding: 0;
    height: 22px;
    width: 350px;
    cursor: pointer;
}

div.fakefile
{
    position: absolute;
    top: 2px;
    left: 0px;
    width: 350px;
    height: 22px;
    padding: 0;
    margin: 0;
    z-index: 1;
}

div.fakefile input
{
    position: absolute;
    top: 0;
    left: 0;
    width: 260px;
    margin-left: 0;
    height: 18px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    border: Solid 1px #c1a8ce;
    color: #6c2482;
}

div.fakefile img
{
    position: absolute;
    top: 0;
    left: 265px;
    cursor: pointer;
}

/* popup message container */
.msgModalPopup
{
    position: absolute;
    display: block;
    z-index: 1000;
    padding-top: 2px;
    padding-right: 3px;
    border: solid 1px #808080;
    background-color: #fff;
}

.msgPopupContainer
{
    position: relative;
    width: 300px;
    height: 120px;
}

.msgPopupHeader
{
    height: 20px;
    background: url(          'Images/sprite.png' ) repeat-x 0px -200px;
    color: #000;
}

.msgPopupClose
{
    position: absolute;
    top: 2px;
    right: 4px;
    width: 25px;
    height: 15px;
    cursor: pointer;
    background: url(          'Images/sprite.png' ) no-repeat 0px -300px;
}

.msgPopupFooter
{
    width: 100%; 
    height: 25px; 
    text-align: center;
    position: absolute; 
    bottom: 4px; 
    left: 0px;
}

/* Starts FAQs user control styles - these styles are used only from the FAQs user control */
div.faqsAnswer
{
    padding-top:5px;
}

a.faqsQuestion
{
    color: #6c2482;
    text-decoration:underline;
    cursor:pointer;
}
/* Ends FAQs user control styles */

/* Starts Welcome page styles - these styles are only for use within Welcome page */
#advImageSection ul
{
    margin:0;
    padding:0;
    list-style-type: none;
}

#advImageSection li
{
    margin:0;
    padding:0;
    display: inline;
}

#buttonSection ul
{
    margin:0;
    padding:0;
    list-style-type: none; 
    padding-top:5px;
}

#buttonSection li
{
    margin:0;
    padding:0;
    display: inline; 
    padding-right:10px;
}
/* Ends Welcome page styles*/