* {
    margin: 0;
    padding: 0;
}

html, body, form {
    font-size: 14px;
}

html {
    position: relative !important;
    min-height: 100% !important;
}

#wrap {
    min-height: 100%;
}

body.login #wrap {
    overflow: hidden;
}

main {
    padding-top: 10px;
}

    main > .container {
        margin-top: 20px;
    }

::selection {
    background: #6f61db; /* WebKit/Blink Browsers */
}

::-moz-selection {
    background: #6f61db; /* Gecko Browsers */
}

.align-left {
    text-align: left !important;
}

.align-center {
    text-align: center;
}

body {
    font-family: Arial, Helvetica, sans-serif !important;
    margin: 0px;
    padding-left: 0px;
    position: relative;
    min-height: 100% !important;
}

label {
    display: inline-block;
    font-weight: bold;
    position: relative;
    top: -0.25em;
    vertical-align: middle;
}

textarea {
    font-family: inherit;
    font-size: inherit;
}

a {
    cursor: pointer;
}

a {
    color: #6f61db;
}

    a:visited {
        color: #231F20;
    }

    a:hover {
        color: #4F4C4D;
        text-decoration: none;
    }

    a:active {
        color: #231F20;
    }

input[type= submit] {
    font-size: 1em;
    font-family: Tahoma, Verdana, Helvetica, Helvetica-Narrow, sans-serif;
    /*color: #0F004B;*/
    /*border: 1px solid gray;*/
}

input[type= file] {
    color: #0F004B;
    font-family: Tahoma,Verdana,Helvetica,Helvetica-Narrow,sans-serif;
    font-size: 1em;
    width: 77px;
}

select {
    font-size: 1em;
    font-family: Arial, Helvetica, sans-serif !important;
    color: #0F004B;
    border: 1px solid #bbbbbb;
}

input[type= text] {
    color: #0F004B;
    border: 1px solid #bbbbbb;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 1em;
    width: 77px;
}

input[type= password] {
    font-size: 1em;
    font-family: Tahoma, Verdana, Helvetica, Helvetica-Narrow, sans-serif;
    color: #0F004B;
}

h2 {
    margin: 2px 0 2px 0;
    font-size: 1.5em;
    color: #333;
    font-weight: normal;
    margin: 0px;
    padding: 0px;
}

ul {
    list-style: none;
    margin-top: 10px;
    margin-left: 0px;
}

li h2 {
    list-style: none;
}

h3 {
    margin: 2px 0 2px 0;
    font-size: 1em;
    font-weight: bold;
    margin: 0px;
    padding: 0px;
    display: block;
    color: #0A317A;
}

h1, .h1, h2, .h2, h3, .h3 {
    margin-top: 20px;
    margin-bottom: 10px;
}

h1 {
    font-size: 28px;
    font-weight: bold;
}

@media (max-width: 767px) {
    h1 {
        padding-left: 15px;
    }
}

h1 a:link, h1 a:visited, h1 a:hover, h1 a:active {
    text-decoration: none;
    color: #0F004B;
}

.membercard h3 {
    font-size: 1em;
}

#loginbanner h2 {
    font-size: 1em;
    font-weight: normal;
    margin-top: 8px;
}

#poster h2 {
    font-size: 10px;
    font-weight: bold;
    color: #50700E;
}

#poster a {
    color: #fff;
}

.leftblock h2, .rightblock h2, .fullwidth h2 {
    font-size: 1.2em;
    color: teal;
}

.rightblock h3 {
    font-size: 1em;
    font-weight: bold;
    margin: 0px;
    padding: 0px;
    display: block;
}

.eventmonth h3 {
    padding-left: 20px;
    padding-right: 20px;
}

.eventlist label {
    font-weight: bold;
    padding-right: 4px;
}

.colourPanel {
    background-color: #F4F4F4;
    padding: 15px;
    vertical-align: top;
    border: LightGrey 1px solid;
}
/************************************************************************
*
* Main navigation used by the masterpage
*
************************************************************************/
#loginposter {
    background: url(images/ncfelogo.gif) no-repeat; /*margin-right: auto;     margin-left: auto;     margin-left :10px;*/
    width: 100%;
    height: 110px;
    margin-top: 17px;
}

/* Picture at the top of the site */
#poster {
    background: #fff;
    height: 135px;
    margin-top: 0px;
    margin: 0 auto;
    width: 950px;
    color: #fff;
}

/* Navigation strips */
#navtop, #navbottom {
    font-size: 11px;
    font-weight: bold;
    font-family: Verdana, Helvetica, Helvetica-Narrow, Tahoma, sans-serif; /*  margin-left :10px; margin-right: auto; 	margin-left: auto;*/
    height: 35px;
    background-color: #333;
    color: white;
    width: 950px;
    margin: 0 auto;
    line-height: 1.2;
}

#navbottom {
    margin-top: 15px;
}


/* Make main navigation bars from a unordered list for easy update and better accessibility */

#navtop ul {
    height: 19px;
    list-style-type: none;
    padding-left: 0;
    padding-top: 9px;
    text-align: left;
    margin: 0;
    padding: 0;
    text-align: center;
}

    #navtop ul li {
        display: inline;
        list-style-type: none;
        margin: 3px 0 0;
        padding: 0;
    }

        #navtop ul li a {
            color: #FFFFFF;
            display: inline-block;
            font-family: tahoma,verdana,helvetica,helvetica-narrow,sans-serif;
            font-size: 12px;
            font-weight: bold;
            height: 24px;
            padding: 9px 7px 0;
            text-decoration: none;
        }

            #navtop ul li a:hover {
                color: #ff937d;
                text-decoration: none;
            }

#navtop a:link, #navtop a:visited {
    color: #FFFFFF;
    text-decoration: none;
}

#navtop a:active {
    text-decoration: underline;
}

/************************************************************************
*
* Formatting common to most pages
*
************************************************************************/
.HeaderContent {
    background-color: #fff;
    /*width: 950px;
    margin: 0 auto; */
}

.BodyContent {
    margin: 0 auto;
    line-height: 1.5;
}

/* Main part of the page that holds contents */
#body {
    width: 80%;
    margin-top: 7px; /* margin-right: auto;     margin-left: auto;*/
    position: relative;
}

/* 2 column layout
#columnleft
{
    float: left;
    width: 30%;
    }
*/
#columnright {
    width: 70%;
    position: relative;
}

.leftblock {
    padding: 15px;
    margin-bottom: 10px; /*  background: #FEFAAB url(images/background_columnleft.gif) repeat-y;*/
    vertical-align: top;
    border-right: #85107B 1px solid;
    border-top: #85107B 1px solid;
    border-left: #85107B 1px solid;
    border-bottom: #85107B 1px solid;
}

.rightblock {
    border-right: #85107B 1px solid;
    border-top: #85107B 1px solid;
    border-left: #85107B 1px solid;
    border-bottom: #85107B 1px solid;
    padding: 15px;
    margin-bottom: 10px; /*background: #FEFFAB url(images/background_columnright.gif) repeat-y;*/
    position: relative;
    width: 453px;
}

/*Ashik Wani
New Classes
*/

.Mainrightblock {
    border-right: #85107B 1px solid;
    border-top: #85107B 1px solid;
    border-bottom: #85107B 1px solid;
    padding: 15px;
    margin-bottom: 10px; /*background: #FEFFAB url(images/background_columnright.gif) repeat-y;*/
    position: relative;
    height: 450px;
}

.Mainleftblock {
    padding: 15px;
    margin-bottom: 10px; /*  background: #FEFAAB url(images/background_columnleft.gif) repeat-y;*/
    vertical-align: top;
    border-right: #85107B 1px solid;
    border-top: #85107B 1px solid;
    border-left: #85107B 1px solid;
    border-bottom: #85107B 1px solid;
    height: 450px;
}

    .Mainleftblock h2, .Mainrightblock h2, .fullwidth h2 {
        font-size: 1.2em;
        color: teal;
    }

    .Mainleftblock h3 {
        font-size: 1em;
        font-weight: bold;
        margin: 0px;
        padding: 0px;
        display: block;
    }

div#footer {
    color: #999999;
    margin: 0 auto;
    width: 100%;
    position: relative;
    /*margin-top: -180px !important;*/ /* negative value of footer height */
    height: 180px;
    clear: both;
}

    div#footer > div {
        width: 950px;
        margin: 0 auto;
        padding: 10px;
        padding-bottom: 22px;
        color: #999;
        line-height: 1.5;
    }

/*=======================*/
.clear2column {
    margin: 0;
    padding: 0;
    line-height: 0;
    font-size: 0px;
    height: 0px;
    clear: both;
}


/* A full width block on the page */

.fullwidth, #loginbanner {
    border: 1px solid #DBDB79;
    width: 694px;
    margin-right: auto;
    margin-left: auto;
    background: #FEFFAB url(images/background_fullwidth.jpg) repeat-y;
    margin-bottom: 10px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: left;
}

/* for the login block
    picks up most of its properties from .fullwidth */

#loginbanner {
    padding-bottom: 0px;
}

/* Goes around controls that need to be presented as a block of functionality  */
.controlblock {
    border: 1px solid #DBDB79;
    padding: 3px;
    margin: 2px 0 5px 0;
    vertical-align: top;
}

/* shows a visual seperation */
.dashedline {
    border-bottom: 1px dashed #85107B;
    padding-top: 10px;
    margin-bottom: 10px;
    clear: right;
}

/* Command buttons on pages */
.actionbuttons {
    text-align: right;
    position: relative;
    padding: 1px 1px 1px 1px;
}

/************************************************************************
*
* Calendar specific formatting
*
************************************************************************/

/* Surrounds the calendar */
.eventmonth {
    border: 1px solid #DBDB79;
    width: 694px;
    margin-right: auto;
    margin-left: auto;
    background: #FEFFAB url(images/background_fullwidth.jpg) repeat-y;
    margin-bottom: 10px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 10px;
    text-align: center;
}

/* used as the cssclass of the actual calendar */
.eventmonthtable {
    width: 694px;
    margin-right: auto;
    margin-left: auto;
    position: relative;
    margin-bottom: 15px;
    border: 1px solid #DBDB79;
    border-collapse: collapse;
}


.dayNumber {
    float: right;
    border-bottom: 1px solid #C7C272;
    border-left: 1px solid #C7C272;
    clear: none;
    padding: 2px;
}


.calcurrentmonth {
    /* no styles needed at this time */
}

.calothermonth {
    background-color: #DCD78E;
}

.calcurrentday {
    background-color: #FFFFC1;
}

.calweekend {
    background-color: #FEEB95; /*  width: 15%; */
}

.calcurrentmonth, .calcurrentmonth, .calothermonth, .calcurrentday, .calweekend {
    text-align: left;
    border: 2px solid #C7C272;
    height: 60px;
    vertical-align: top; /* needed for positioning the dayNumber part */
    position: relative;
    border-collapse: separate;
    border-spacing: 5px;
}

/************************************************************************
*
* Next / previous specific formatting
*
************************************************************************/

.nextlink {
    position: absolute;
    right: 0;
    padding-right: 15px;
}



/************************************************************************
*
* Global formatting
*
************************************************************************/

/* all the legend tags use this same style */

legend {
    font-weight: bold;
    color: #666666;
    font-size: 1em;
    padding-left: 4px;
    padding-right: 4px;
    margin-bottom: 7px;
}

/* apply zero margin to all forms and hide fieldset borders. Keep fieldset borders in the markup for better accessibility */

form {
    margin: 0px;
}

fieldset {
    margin: 0px;
    padding: 0px;
    border: none;
}

/* sometimes we hide elements from display in visual browsers (but leave them in the source for non visual browsers and for accessibility) */

.hidden {
    visibility: hidden;
}

.none {
    display: none;
}


/************************************************************************
*
* Image functionality
*
************************************************************************/

.photo {
    background: #FEFFC8 url(images/background_thumbnail.jpg) repeat-x center;
    border: solid 1px #E8DCA3;
    padding: 5px;
}

.picture {
    background: #FEFFC8 url(images/background_thumbnail.jpg) repeat-x center;
    border: solid 1px #E8DCA3;
    padding: 5px;
    margin: 5px;
}

/* add hover border to href thumbnail images */
/*todo: rectify whether these should be .photo instead

.thumbnail a:link img, #thumbnail a:visited img
{
    border: 2px solid #883D08;
}
.thumbnail a:hover img
{
    border: 2px solid #FFFFFF;
}
.thumbnail a:active img
{
    border: 2px solid #333;
}
*/

/************************************************************************
*
* List type pages
*
************************************************************************/

/* represents each item in a vertical list */
.listitem {
    margin: 0px 0px 0px 0px;
    width: 444px;
}

/* surrounds the buttons for list items */
.editbuttons {
    padding-top: 6px;
}

/* floats the thumbnail off to the right */
.thumbnail {
    float: right;
    margin: 0 0 0 5px;
}

/*used to clear the float for the thumbnail */
.clearlist {
    clear: right;
    margin: 0;
    padding: 0;
    height: 0px;
    font-size: 0px;
    line-height: 0px;
}

/* Used by the page number control */
.PageNumbers {
    display: inline;
}

    .PageNumbers span {
        padding-left: 3px;
    }

.newscrumbs a {
    font-weight: bold;
    padding-right: 2px;
}

/* Used in the two column lists */

.membercard {
    background-color: #FEFEB1;
    border: 1px solid #E8DCA3;
    padding: 10px;
    margin-bottom: 10px;
    width: 198px;
}

.clearcard {
    clear: left;
    height: 0;
    margin: 0;
    padding: 0;
}

#membercardcolumnleft {
    float: left;
    position: relative;
}

#membercardcolumnright {
    margin-left: 226px;
}

.membercard p {
    margin: 5px;
}

/************************************************************************
*
* Compact Event list
*
************************************************************************/


/* define event grid view columns */
/* todo: use or remove */

.eventlistdate {
    padding-right: 4px;
}

.eventlisticon {
    text-align: center;
}

.eventlisttime {
    text-align: center;
    width: 95px;
}

.eventlistevent {
    font-weight: bold;
}

.eventlistlocation {
    /* no styles needed at this time */
}

.eventlist td {
    padding-bottom: 4px;
}

/*
.eventlist, .eventlist td, .eventlist tr
{
    border-style:none;
}
*/

/************************************************************************
*
* Rollover buttons
*
************************************************************************/

.buttonsmall, .buttonsmall-ovr {
    background: url(images/background_button_small.gif) repeat-x;
    border: none;
    color: #FFFFFF;
    height: 22px;
    font-weight: normal;
    font-size: 9px;
    padding-bottom: 9px;
    padding-left: 3px;
    padding-right: 3px;
    cursor: pointer;
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

.buttonsmall-ovr {
    text-decoration: underline;
    background: url(images/background_button_small-ovr.gif) repeat-x;
}

/************************************************************************
*
* Page specific
*
************************************************************************/

/* even dowload button */
.downloadevent img {
    margin-right: 5px;
    vertical-align: middle;
    border: none;
}

/* Header on view details type pages */
.itemdetails {
    font-size: 1.3em;
}



/************************************************************************
*
* Photo selection controls
*
************************************************************************/

#popupbody {
    font-family: Tahoma, Verdana, Helvetica, Helvetica-Narrow, sans-serif;
    margin: 0px;
    background: #FED36B;
    font-size: 0.7em;
}

#popupinner {
    border: 1px solid #DBDB79;
    margin: 5px;
    background: #FEFFAB;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 10px;
    padding-bottom: 10px;
}

#popupbody h2 {
    font-weight: bold;
    margin: 0px;
    padding: 1px 0px 5px 5px;
    display: block;
}

.selected, .unselected {
    width: 80px;
    height: 100px;
    text-align: center;
    padding: 2px 2px 2px 2px;
}

.unselected {
    background-color: transparent;
    border: solid 1px #FEFFAB;
}

.selected {
    background: #FED36B;
    border: solid 1px #DBDB79;
}

.scrollablelist {
    overflow: auto;
    height: 230px;
    width: 460px;
    border: solid 1px #DBDB79;
}

.scrollablelist2 {
    overflow: auto;
    height: 230px;
    width: 210px;
    border: solid 1px #DBDB79;
}


.scrolledtable {
}

.selectablephoto {
    background: #FEFFC8 url(images/background_thumbnail.jpg) repeat-x center;
    border: 1px solid #E8DCA3;
    padding: 2px;
}

.contextbuttons {
    margin: 5px 3px 5px 3px;
}

/************************************************************************
*
* Forms
*
************************************************************************/

/* label column */
.formlabel {
    width: 120px;
    vertical-align: top;
}

/* value column */
.formvalue {
    vertical-align: top;
}

.txtfield {
    width: 300px;
}

.txtblock {
    width: 300px;
}

.passStrengthControl {
    background-color: #0A317A;
    color: #FFFFFF;
}

/*********************GRID*************************/
/*Author: Ashik Wani*******************************/

.gridview .actions div {
    float: right;
    padding-right: 2px;
    text-align: right;
    width: 95px;
}

.gridview .edit td, .gridview .create td {
    padding: 4px;
}

.gridview td {
    padding: 3px 4px;
}

    .gridview td a {
        color: #8b4513;
        padding: 2px;
        line-height: normal;
    }

.gridview th {
    background: #69acb7;
    padding: 4px;
    text-align: left;
    font-weight: bold;
    color: #004040;
}

    .gridview th a {
        color: #FFFFFF;
    }

        .gridview th a:hover {
            color: #008080;
        }

.gridview tr.even td, .detailsview tr.even td {
    background: #d9eaed;
}

.gridview tr.selrow td {
    background: #C69B9B;
    color: #FFFFFF;
}




.gridview tr.header {
    background: #C5DBF7;
}

.gridview {
    font-size: 0.8em;
    font-family: Tahoma, Verdana, Helvetica, Helvetica-Narrow, sans-serif;
    width: 100%;
}
/**********************GRID END*/

.bodytext {
    font-family: Tahoma, Verdana, Helvetica, Helvetica-Narrow, sans-serif;
    font-size: 0.8em;
}

/*******AJAX Extensions CSS**************/
/* Content Page Layout */
.demoarea {
    padding: 20px;
    background: #FFF url(images/demotop.png) no-repeat left top;
}

    .demoarea p {
        padding: 5px;
    }

.demoheading {
    padding-bottom: 20px;
    color: #5377A9;
    font-family: Arial, Sans-Serif;
    font-weight: bold;
    font-size: 1.5em;
}

.demobottom {
    height: 8px;
    background: #FFF url(images/demobottom.png) no-repeat left bottom;
}


.heading {
    padding: 1em 0 1em 0;
    color: #5377A9;
    font-family: Arial, Sans-Serif;
    font-weight: bold;
    font-size: 1.2em;
}

.subheading {
    padding: .8em 0 0.5em 0;
    color: #0F2543;
    font-weight: bold;
    font-family: Arial, Sans-Serif;
    font-size: 1.1em;
}

p {
    margin: 1em 0;
}

em {
    font-style: italic;
}

i {
    font-style: italic;
}

strong {
    font-weight: bold;
}

.codeReference {
    font-family: 'Courier New', Monospace;
    font-style: normal;
    font-weight: bold;
}

pre, code {
    display: block;
    margin: 15px 15px 15px 0;
    padding: 10px;
    border: 1px dashed #CCC;
    background-color: #FFF;
    color: #333;
    font-family: 'Courier New', Monospace;
    font-size: 0.9em;
    font-style: normal;
}

.releaseList {
    list-style-type: disc;
}


/* Styles for the Animation Reference */
.animationReferenceTable {
}

.animationReferenceRow {
}

.animationReferenceField {
    text-align: right;
    vertical-align: top;
    padding-top: 5px;
}

.animationReferenceCode {
    margin-top: 5px;
    vertical-align: top;
    font-family: 'Courier New', Monospace;
    font-style: normal;
    font-weight: bold;
    display: block;
    background-color: #FFF;
    color: #333;
    font-family: 'Courier New', Monospace;
    font-size: 0.9em;
    font-style: normal;
    font-weight: bold;
    margin-bottom: 5px;
}

.animationReferenceItems {
    vertical-align: top;
}

.animationReferenceItemTable {
    width: 100%;
    padding: 0px;
    margin: 0px;
}

.animationReferenceItemRow {
    width: 100%;
    padding: 0px;
    margin: 0px;
}

.animationReferenceItem {
    width: 100%;
    padding: 0px;
    margin: 0px;
    padding-bottom: 10px;
}

.animationReferenceItemCode {
    display: block;
    background-color: #FFF;
    color: #333;
    font-family: 'Courier New', Monospace;
    font-size: 0.9em;
    font-style: normal;
    font-weight: bold;
}

/******************************/
/**Styling information specific to individual content pages**/

/* Accordion */
.accordionHeader {
    border: 1px solid #2F4F4F;
    color: white;
    background-color: #69acb7;
    font-family: Arial, Sans-Serif;
    font-size: 12px;
    font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;
}

/*.accordionHeader
{
    color: #004040;
    background-color: #69acb7;
    font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;

    font-size: 1em;
    font-family: Tahoma, Verdana, Helvetica, Helvetica-Narrow, sans-serif;
}
*/


#master_content .accordionHeaderSelected a {
    color: #FFFFFF;
    background: none;
    text-decoration: none;
}

    #master_content .accordionHeaderSelected a:hover {
        background: none;
        text-decoration: underline;
    }


/*.accordionHeaderSelected
{
    background-color: #69acb7;
    font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;
    font-size: 1em;
    font-family: Tahoma, Verdana, Helvetica, Helvetica-Narrow, sans-serif;
}
*/

.accordionHeaderSelected {
    border: 1px solid #2F4F4F;
    color: white;
    background-color: #008080;
    font-family: Arial, Sans-Serif;
    font-size: 12px;
    font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;
}

#master_content .accordionHeaderSelected a {
    color: #FFFFFF;
    background: none;
    text-decoration: none;
}

    #master_content .accordionHeaderSelected a:hover {
        background: none;
        text-decoration: underline;
    }

.accordionContent {
    border: 1px dashed #2F4F4F;
    border-top: none;
    padding: 5px;
    padding-top: 10px;
}

/*AutoComplete flyout */

.autocomplete_completionListElement {
    visibility: hidden;
    height: 150px;
    margin: 0px !important;
    background-color: inherit;
    color: windowtext;
    border: buttonshadow;
    border-width: 1px;
    border-style: solid;
    cursor: 'default';
    overflow: auto;
    text-align: left;
    list-style-type: none;
}

/* AutoComplete highlighted item */

.autocomplete_highlightedListItem {
    color: #333;
    padding-top: 1px;
    padding-bottom: 1px;
    padding-left: 15px;
    cursor: default;
    background-color: #dcdcdc;
}

/* AutoComplete item */

.autocomplete_listItem {
    background-color: window;
    color: #333;
    padding-top: 1px;
    padding-bottom: 1px;
    padding-left: 15px;
    cursor: default;
}

/*Cascading DropDown*/

/*CollapsiblePanel*/
.collapsePanel {
    background-color: white;
    overflow: hidden;
}

.collapsePanelHeader {
    width: 90%;
    height: 25px; /*	background-image: url(images/bg-menu-main.png); 	color:#FFF;*/
    color: teal;
    font-weight: bold;
    background-color: #f5f5f5;
    text-decoration: underline;
}

#master_content .collapsePanelHeader a {
    color: #FFF;
}

    #master_content .collapsePanelHeader a:hover {
        text-decoration: none;
        background: none;
    }

/*Confirm Button*/

/* DropShadow */

#master_content .dropShadowPanel span {
    color: white;
    text-decoration: underline;
}

    #master_content .dropShadowPanel span:hover {
        text-decoration: none;
    }


.dropShadowPanel {
    width: 300px;
    background-color: #5377A9;
    color: white;
    font-weight: bold;
}

/*Drag Panel*/
.dragMe {
    width: 100%;
    height: 21px;
    background-color: #FFF;
    background-image: url(images/header-opened.png);
    text-align: center;
    cursor: move;
    font-weight: bold;
}

.overflowHidden {
    overflow: hidden;
}

.overflowScroll {
    overflow: hidden;
}

/*Hover Menu*/
.popupMenu {
    position: absolute;
    visibility: hidden;
    background-color: #F5F7F8;
    opacity: .9;
    filter: alpha(opacity=90);
}

.popupHover {
    background-image: url(images/header-opened.png);
    background-repeat: repeat-x;
    background-position: left top;
    background-color: #F5F7F8;
}

/* PagingBulletedList */
.selectIndex {
    font-weight: bold;
    text-decoration: none;
}

.unselectIndex {
    font-weight: normal;
    text-decoration: underline;
}


/*Modal Popup*/
.modalBackground {
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.modalPopup {
    background-color: #D5D3DC;
    border-width: 1px;
    border-style: solid;
    border-color: #85107B;
    padding: 3px;
    width: 250px;
}

.modalPopupEntry {
    background-color: #D5D3DC;
    border-width: 1px;
    border-style: solid;
    padding: 3px;
    width: 80%;
}

.sampleStyleA {
    background-color: #FFF;
}

.sampleStyleB {
    background-color: #FFF;
    font-family: monospace;
    font-size: 10pt;
    font-weight: bold;
}

.sampleStyleC {
    background-color: #ddffdd;
    font-family: sans-serif;
    font-size: 10pt;
    font-style: italic;
}

.sampleStyleD {
    background-color: Blue;
    color: White;
    font-family: Arial;
    font-size: 10pt;
}

/*Popup Control*/
.popupControl {
    background-color: White;
    position: absolute;
    visibility: hidden;
}

/*Reorder List*/
.dragHandle {
    width: 10px;
    height: 15px;
    background-color: Blue;
    background-image: url(images/bg-menu-main.png);
    cursor: move;
    border: outset thin white;
}

.callbackStyle {
    border: thin blue inset;
}

    .callbackStyle table {
        background-color: #5377A9;
        color: Black;
    }


.reorderListDemo li {
    list-style: none;
    margin: 2px;
    background-image: url(images/bg_nav.gif);
    background-repeat: repeat-x;
    color: #FFF;
}

    .reorderListDemo li a {
        color: #FFF !important;
        font-weight: bold;
    }

.reorderCue {
    border: dashed thin black;
    width: 100%;
    height: 25px;
}

.itemArea {
    margin-left: 15px;
    font-family: Arial, Verdana, sans-serif;
    font-size: 1em;
    text-align: left;
}


/* Rounded Corners*/

.roundedPanel {
    width: 300px;
    background-color: #5377A9;
    color: white;
    font-weight: bold;
}

/* ResizableControl */

.frameImage {
    width: 130px;
    height: 65px;
    overflow: hidden;
    float: left;
    padding: 3px;
}

.frameText {
    width: 100px;
    height: 100px;
    overflow: auto;
    float: left;
    background-color: #ffffff;
    border-style: solid;
    border-width: 2px;
    border-color: Gray;
    font-family: Helvetica;
    line-height: normal;
}

.handleImage {
    width: 15px;
    height: 16px;
    background-image: url(images/HandleHand.png);
    overflow: hidden;
    cursor: se-resize;
}

.handleText {
    width: 16px;
    height: 16px;
    background-image: url(images/HandleGrip.png);
    overflow: hidden;
    cursor: se-resize;
}

.resizingImage {
    padding: 0px;
    border-style: solid;
    border-width: 3px;
    border-color: #B4D35D;
}

.resizingText {
    padding: 0px;
    border-style: solid;
    border-width: 2px;
    border-color: #7391BA;
}

/*Textbox Watermark*/

.unwatermarked {
    height: 18px;
    width: 148px;
}

.watermarked {
    height: 20px;
    width: 150px;
    padding: 2px 0 0 2px;
    border: 1px solid #BEBEBE;
    background-color: #F0F8FF;
    color: gray;
}

/* Rating */
.ratingStar {
    font-size: 0pt;
    width: 13px;
    height: 12px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    display: block;
    background-repeat: no-repeat;
}

.filledRatingStar {
    background-image: url(Images/FilledStar.png);
}

.emptyRatingStar {
    background-image: url(Images/EmptyStar.png);
}

.savedRatingStar {
    background-image: url(Images/SavedStar.png);
}


/*Toggle Button*/

/*Setup*/
.walkthrough li {
    padding-bottom: 5px;
}

/*Using a sample extender*/

/*Creating a new extender*/
.walkthroughNote {
    padding-left: 25px;
    font-style: italic;
}

/*Other neat stuff*/

#uploadCSVForm #csvFileName {
    display: inline-block;
    color: #a199fa;
    width: 250px;
    height: 30px;
    overflow-x: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
    padding: 0 0 0 5px;
}

/************ PasswordStrength Related Styles ***********************/
.TextIndicator_TextBox1 {
    background-color: Gray;
    color: White;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 2px 3px 2px 3px;
}

.BarIndicator_TextBox2 {
    color: Blue;
    background-color: Blue;
}

.BarBorder_TextBox2 {
    border-style: solid;
    border-width: 1px;
    width: 200px;
    vertical-align: middle;
}

.TextIndicator_TextBox3 {
    background-color: Blue;
    color: Yellow;
    font-size: small;
    font-variant: small-caps;
    padding: 2px 3px 2px 3px;
}

.TextIndicator_TextBox3_Handle {
    width: 16px;
    height: 14px;
    background-image: url(images/Question.png);
    overflow: hidden;
    cursor: help;
}

.TextIndicator_TextBox1_Strength1 {
    background-color: Gray;
    color: Maroon;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 2px 3px 2px 3px;
}

.TextIndicator_TextBox1_Strength2 {
    background-color: Gray;
    color: Orange;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 2px 3px 2px 3px;
}

.TextIndicator_TextBox1_Strength3 {
    background-color: Gray;
    color: Yellow;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 2px 3px 2px 3px;
}

.TextIndicator_TextBox1_Strength4 {
    background-color: Gray;
    color: Aqua;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 2px 3px 2px 3px;
}

.TextIndicator_TextBox1_Strength5 {
    background-color: Gray;
    color: Lime;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 2px 3px 2px 3px;
}



.dynamicPopulate_Normal {
    border: silver 1px inset;
    padding: 2px;
    text-align: center;
    height: 2em;
    margin: 5px;
    width: 200px;
}

.dynamicPopulate_Updating {
    background-image: url(images/loading.gif);
    background-repeat: no-repeat;
    border: silver 1px inset;
    text-align: center;
    padding: 2px;
    height: 2em;
    margin: 5px;
    width: 200px;
}
/************ MaskedEdit Related Styles ***********************/
.MaskedEditFocus {
    background-color: #ffffcc;
    color: #333;
}

.MaskedEditMessage {
    color: #ff0000;
    font-weight: bold;
}

.MaskedEditError {
    background-color: #ffcccc;
}

.MaskedEditFocusNegative {
    background-color: #ffffcc;
    color: #ff0000;
}

.MaskedEditBlurNegative {
    color: #ff0000;
}

.MyCalendar .ajax__calendar_container {
    border: 1px solid #646464;
    background-color: yellow;
    color: red;
}

.MyCalendar .ajax__calendar_other .ajax__calendar_day, .MyCalendar .ajax__calendar_other .ajax__calendar_year {
    color: black;
}

.MyCalendar .ajax__calendar_hover .ajax__calendar_day, .MyCalendar .ajax__calendar_hover .ajax__calendar_month, .MyCalendar .ajax__calendar_hover .ajax__calendar_year {
    color: black;
}

.MyCalendar .ajax__calendar_active .ajax__calendar_day, .MyCalendar .ajax__calendar_active .ajax__calendar_month, .MyCalendar .ajax__calendar_active .ajax__calendar_year {
    color: black;
    font-weight: bold;
}

/* SlideShow styles */

.slideTitle {
    font-weight: bold;
    font-size: small;
    font-style: italic;
}

.slideDescription {
    font-size: small;
    font-weight: bold;
}

.validatorCalloutHighlight {
    background-color: yellow;
}

.ListSearchExtenderPrompt {
    font-style: italic;
    color: Gray;
    background-color: white;
}



/*Custom Tab Theme*/
/* NCFE theme */
.ajax__tab_NCFE .ajax__tab_header {
    font-family: verdana,tahoma,helvetica;
    font-size: 11px;
    background: url(images/tab-line.gif) repeat-x bottom;
}

.ajax__tab_NCFE .ajax__tab_outer {
    padding-right: 4px;
    background: url(images/tab-right.gif) no-repeat right;
    height: 21px;
}

.ajax__tab_NCFE .ajax__tab_inner {
    padding-left: 3px;
    background: url(images/tab-left.gif) no-repeat;
}

.ajax__tab_NCFE .ajax__tab_tab {
    height: 13px;
    padding: 4px;
    margin: 0;
    background: url(images/tab.gif) repeat-x;
}

.ajax__tab_NCFE .ajax__tab_hover .ajax__tab_outer {
    background: url(images/tab-hover-right.gif) no-repeat right;
}

.ajax__tab_NCFE .ajax__tab_hover .ajax__tab_inner {
    background: url(images/tab-hover-left.gif) no-repeat;
}

.ajax__tab_NCFE .ajax__tab_hover .ajax__tab_tab {
    background: url(images/tab-hover.gif) repeat-x;
}

.ajax__tab_NCFE .ajax__tab_active .ajax__tab_outer {
    background: url(images/tab-active-right.gif) no-repeat right;
}

.ajax__tab_NCFE .ajax__tab_active .ajax__tab_inner {
    background: url(images/tab-active-left.gif) no-repeat;
}

.ajax__tab_NCFE .ajax__tab_active .ajax__tab_tab {
    background: url(images/tab-active.gif) repeat-x;
}

.ajax__tab_NCFE .ajax__tab_body {
    font-family: verdana,tahoma,helvetica !important;
    border: 1px solid #999999;
    border-top: 0;
    padding: 8px;
    background-color: #ffffff;
}


/*Calander Theme*/
.ajax__calendar_container {
    padding: 4px;
    position: absolute;
    cursor: default;
    width: 180px !important;
    font-size: 11px;
    text-align: center !important;
    font-family: tahoma,verdana,helvetica;
}

.ajax__calendar_body {
    height: 139px !important;
    width: 170px !important;
    position: relative;
    overflow: hidden;
    margin: auto;
}

.ajax__calendar_days, .ajax__calendar_months, .ajax__calendar_years {
    top: 0px;
    left: 0px;
    height: 139px;
    width: 170px;
    position: absolute;
    text-align: center !important;
    margin: auto;
}

.ajax__calendar_container TABLE {
    font-size: 11px;
}

.ajax__calendar_header {
    height: 20px;
    width: 100%;
}

.ajax__calendar_prev {
    cursor: pointer;
    width: 15px;
    height: 15px !important;
    float: left;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: url(../../images/CalendarLeftArrow.gif);
}

.ajax__calendar_next {
    cursor: pointer;
    width: 15px;
    height: 15px !important;
    float: right;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-image: url(../../images/CalendarRightArrow.gif);
}

.ajax__calendar_title {
    cursor: pointer;
    font-weight: bold;
}

.ajax__calendar_footer {
    height: 15px;
}

.ajax__calendar_today {
    cursor: pointer;
    padding-top: 3px;
}

.ajax__calendar_dayname {
    height: 17px !important;
    width: 17px;
    text-align: right;
    padding: 0 2px;
}

.ajax__calendar_day {
    height: 17px !important;
    width: 18px;
    text-align: center;
    padding: 0 2px;
    cursor: pointer;
}

.ajax__calendar_month {
    height: 44px !important;
    width: 40px;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
}

.ajax__calendar_year {
    height: 44px !important;
    width: 40px;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
}

.ajax__calendar .ajax__calendar_container {
    border: 1px solid #646464;
    background-color: #ffffff;
    color: #333;
}

.ajax__calendar .ajax__calendar_footer {
    border-top: 1px solid #f5f5f5;
}

.ajax__calendar .ajax__calendar_dayname {
    border-bottom: 1px solid #f5f5f5;
}

.ajax__calendar .ajax__calendar_day {
    border: 1px solid #ffffff;
}

.ajax__calendar .ajax__calendar_month {
    border: 1px solid #ffffff;
}

.ajax__calendar .ajax__calendar_year {
    border: 1px solid #ffffff;
}

.ajax__calendar .ajax__calendar_active .ajax__calendar_day {
    background-color: #edf9ff;
    border-color: #0066cc;
    color: #0066cc;
}

.ajax__calendar .ajax__calendar_active .ajax__calendar_month {
    background-color: #edf9ff;
    border-color: #0066cc;
    color: #0066cc;
}

.ajax__calendar .ajax__calendar_active .ajax__calendar_year {
    background-color: #edf9ff;
    border-color: #0066cc;
    color: #0066cc;
}

.ajax__calendar .ajax__calendar_other .ajax__calendar_day {
    background-color: #ffffff;
    border-color: #ffffff;
    color: #646464;
}

.ajax__calendar .ajax__calendar_other .ajax__calendar_year {
    background-color: #ffffff;
    border-color: #ffffff;
    color: #646464;
}

.ajax__calendar .ajax__calendar_hover .ajax__calendar_day {
    background-color: #edf9ff;
    border-color: #daf2fc;
    color: #0066cc;
}

.ajax__calendar .ajax__calendar_hover .ajax__calendar_month {
    background-color: #edf9ff;
    border-color: #daf2fc;
    color: #0066cc;
}

.ajax__calendar .ajax__calendar_hover .ajax__calendar_year {
    background-color: #edf9ff;
    border-color: #daf2fc;
    color: #0066cc;
}

.ajax__calendar .ajax__calendar_hover .ajax__calendar_title {
    color: #0066cc;
}

.ajax__calendar .ajax__calendar_hover .ajax__calendar_today {
    color: #0066cc;
}


.DialogHeaderStyle {
    background-color: #0A317A;
    width: 100%;
    height: 17px;
    vertical-align: middle;
    font-weight: bold;
    color: white;
    padding-top: 4px;
    font-size: 1em;
    padding-left: 5px;
    text-align: left;
}

.UserBroadcastDialogHeaderStyle {
    background-color: red;
    height: 34px;
    vertical-align: middle;
    font-weight: bold;
    color: white;
    margin: 3px;
    padding: 3px;
    font-size: 1.5em;
}

.UserBroadcastDialogTitle {
    margin: 3px;
    padding: 3px;
    font-size: 1em;
    max-width: 600px;
    word-wrap: break-word;
}

.UserBroadcastDialogBody {
    margin: 3px;
    padding: 3px;
    font-size: 1em;
    max-width: 600px;
    max-height: 500px;
    word-wrap: break-word;
    overflow-y: auto;
}

.UserDialogTitle {
    margin: 3px;
    padding: 3px;
    font-size: 1em;
    max-width: 330px;
    word-wrap: break-word;
}

.UserDialogBody {
    margin: 3px;
    padding: 3px;
    font-size: 1em;
    max-width: 330px;
    max-height: 500px;
    word-wrap: break-word;
    overflow-y: auto;
}

.htmlbutton {
    font-size: 1em;
    font-family: Tahoma, Verdana, Helvetica, Helvetica-Narrow, sans-serif;
    color: #0F004B;
    border: 1px solid gray;
}

#MasterPageAjaxProgressIndicator_Horizon {
    position: absolute;
    top: 50%;
    width: 100%; /* Height must be set inline so that centering javascript works */
    text-align: center;
    overflow: visible;
    display: block;
}

#MasterPageAjaxProgressIndicator_Content {
    position: absolute;
    width: 200px;
    height: 100px;
    left: 45%;
    margin-left: -50px;
    top: 10px;
    display: block;
    z-index: 999999999;
    border: 1px solid #666;
    background-color: #FFF;
    padding: 20px;
    vertical-align: middle;
    text-align: center;
}

ul {
    margin: 0px 30px 30px;
}

    ul.qanda {
        padding: 0;
        margin: 0;
    }

        ul.qanda li {
            list-style-type: none;
        }

            ul.qanda li label {
                display: inline-block;
                font-weight: bold;
                margin: 4px 0 0 0;
                text-align: right;
                width: 220px;
            }

            ul.qanda li span.note {
                font-weight: normal;
                display: inline-block;
                margin-left: 9px;
                text-align: left;
            }

            ul.qanda li input {
                margin: 0 4px;
                vertical-align: top;
                width: 100px;
            }

                ul.qanda li input[type="checkbox"] {
                    cursor: pointer;
                    margin: 4px 1px;
                }

.w33pc {
    width: 32%;
}

.w65pc {
    width: 65%;
}

.h232px {
    height: 232px;
}

.h496px {
    height: 496px;
}

.bubble {
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    behavior: url(/App_Themes/Default/PIE.htc);
    /*background-color: #F4F4F4;
    border: 1px solid #D3D3D3;*/
    margin-top: 10px;
    padding: 10px;
}

.left {
    float: left;
}

.right {
    float: right;
}

.clearboth {
    clear: both;
}

.ajax__tab_body {
    /* font-family: verdana,tahoma,helvetica !important; */
    font-size: 10pt !important;
}

.homeRightCol {
    vertical-align: top;
    margin-left: 20px;
    width: 300px;
    padding-left: 75px;
    padding-top: 16px;
}

/************ Rebrand 2014 - Chris Thompson ***********************/

.login p {
    color: #999;
}

.page {
    width: 960px;
    margin: 0 auto;
}

.card {
    background-color: #fff;
}

.card-login {
    width: 300px;
    margin: 60px auto 30px;
    padding: 10px;
    position: relative;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 3px 7px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255,255,255,1), inset 0 -1px 2px rgba(0,0,0,0.25);
    border-radius: 5px;
    background: white;
    background: -moz-linear-gradient(#eeefef, #ffffff 10%);
    background: -ms-linear-gradient(#eeefef, #ffffff 10%);
    background: -o-linear-gradient(#eeefef, #ffffff 10%);
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#eeefef), color-stop(0.1, #ffffff));
    background: -webkit-linear-gradient(#eeefef, #ffffff 10%);
    background: linear-gradient(#eeefef, #ffffff 10%);
}

.card-login__input-wrap {
}

.card-login__input-wrap__icon {
    left: 0px;
    top: 0px;
    position: absolute;
    z-index: 2;
    width: 36px;
    height: 40px;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 1px 0 0 rgba(255, 255, 255, 0.7);
    color: #777777;
    text-align: center;
    line-height: 42px;
}

.card-login__input-wrap__input {
    position: relative;
    z-index: 1;
    width: 100% !important;
    height: 40px;
    margin-bottom: 12px;
    padding: 10px 18px 10px 45px;
    border: 0px !important;
    border-radius: 2px;
    -webkit-box-shadow: inset 3px 0px 5px 0px rgba(199,199,199,1);
    -moz-box-shadow: inset 3px 0px 5px 0px rgba(199,199,199,1);
    box-shadow: inset 3px 0px 5px 0px rgba(199,199,199,1);
}

.card-login__submit-wrap {
    width: 65px;
    height: 65px;
    position: absolute;
    top: 24px;
    right: -25px;
    padding: 10px;
    z-index: 2;
    background: #ffffff;
    border-radius: 50%;
    box-shadow: 0 0 2px rgba(0,0,0,0.1), 0 0px 3px rgba(0,0,0,0.1), inset 0 -2px 2px rgba(0,0,0,0.2);
}

    .card-login__submit-wrap::after {
        content: "";
        width: 10px;
        height: 12px;
        position: absolute;
        top: -4px;
        left: 30px;
        background: #ffffff;
        box-shadow: 0 62px white, -32px 30px white;
    }

.card-login__submit-wrap__button {
    width: 100% !important;
    height: 100% !important;
    margin-top: -1px;
    font-size: 1.4em;
    line-height: 1.75;
    text-indent: 5000px;
    color: white;
    border: none;
    border-radius: inherit;
    cursor: pointer;
    background-color: #fff;
    background-image: url('Images/login-arrow.png');
    background-size: 45px;
    image-rendering: -webkit-optimize-contrast;
    transition: 0.1s;
}

    .card-login__submit-wrap__button:hover {
        background-color: #a199fa;
    }

.header {
    height: 150px;
}

.signin input[type="email"],
.signin input[type="password"],
.signin input[type="text"],
.signin input[type="submit"] {
    -moz-appearance: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: none repeat scroll 0 0 #DEDEDE;
    border: none;
    color: #404040;
    display: inline-block;
    font-size: 17px;
    height: 45px;
    margin: 0;
    padding: 0 10px;
    -moz-box-sizing: border-box;
    display: block;
    margin-bottom: 10px;
    position: relative;
    width: 100%;
    z-index: 1;
    border: 1px solid #e8e8e6;
}

.signin input:hover, .signin input:focus {
    border: 1px solid #bebebe;
}

.logo {
    display: block;
    float: none;
    margin: 30px auto 60px;
}

.signin input[type="submit"] {
    background: #6f61db;
    width: 100%;
    color: #fff;
    border: none;
}

.col {
    float: left;
    width: 49%;
}


div#userdetail {
    color: #FFFFFF;
    float: right;
    margin-top: 12px;
    line-height: 1.5;
}

.searchform {
    /* background-color:#ededed; */
    padding: 10px;
    width: 100%;
}

    .searchform input {
        font-size: 130%;
        border: 1px solid #dddddd;
    }

.PortalUsersTable th, .PortalUsersTable td {
    padding: 4px;
    font-size: 110%;
}

#support-notice {
    width: 365px;
    margin: 0 auto;
}

    #support-notice h3 {
        color: #444;
    }

    #support-notice > p {
        padding-bottom: 10px;
    }

div.gridviewTableContainer {
    overflow: auto;
    border-top: 1px solid #cccccc;
    min-height: 0%; /* IE9 bug fix doesn't adversely affect other browsers */
}

.gridviewTable {
    border-collapse: collapse;
    border: 0;
}

    .gridviewTable th {
        padding: 4px 5px 4px 5px;
        background-color: #555555;
        color: white !important;
        font-weight: bold;
        font-style: normal;
        border: 0;
    }

    .gridviewTable td {
        padding: 4px 5px 4px 5px;
        white-space: nowrap;
        border: 0;
        border-bottom: 1px solid #ccc;
    }

    .gridviewTable input[type='text'] {
        padding: 1px 3px;
    }

    .gridviewTable tr:nth-child(1n) td {
        background: none repeat scroll 0 0 #e3e3e3;
    }

    .gridviewTable tr:nth-child(2n) td {
        background: none repeat scroll 0 0 #f9f9f9;
    }

tr.success > td {
    background-color: #e6efc2 !important;
    color: #3c763d;
}

tr.error > td {
    background-color: #f2dede !important;
    color: #a94442;
}

tr.warning > td {
    background-color: #fdf0ad !important;
    color: #8a6d3b;
}

tr.error input[type='text'], tr.warning input[type='text'] {
    background-color: #fff !important;
}

a.submit, input[type="submit"].submit {
    width: 100px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}

a.narrow, input[type="submit"].narrow {
    width: 68px;
}

a.submit, a.submitnarrow, input[type="submit"].submit {
    display: inline-block;
    margin: 1px;
    padding: 1px;
    border: 1px solid gray;
    background-color: #ece9d8;
    color: #333;
    text-align: center;
    text-decoration: none;
    font-family: tahoma,verdana,helvetica,helvetica-narrow,sans-serif;
    cursor: pointer;
}

    a.submit:hover, a.submitnarrow:hover, input[type="submit"].submit:hover {
        border-color: #fec810;
        background-color: #feeba7;
    }

    a.submit[disabled], a.submit[disabled]:hover {
        border: 1px solid #ddd;
        background-color: #e9e9e9;
        color: #999;
        font-style: italic;
        cursor: not-allowed;
    }

span.webFormCheckBox > input[type='checkbox'] {
    margin-left: 6px;
}

div.panelGroup {
    margin-top: 15px;
}

div.panelSection {
    margin-top: 30px;
}

table.radiobuttonGroup td {
    padding-right: 6px;
}

    table.radiobuttonGroup td input[type='radio'] {
        margin: 4px 6px 0 0;
    }

.infoOuterPanel {
    overflow: auto;
    width: 100%
}

.infoPanel {
    float: left;
    margin-right: 20px;
    padding: 0.8em;
}

.infoError {
    background-color: #f2dede;
    color: #a94442;
    border: 1px solid transparent;
    border-color: #ebccd1;
}

.infoWarning {
    background-color: #fdf0ad;
    color: #8a6d3b;
    border: 1px solid transparent;
    border-color: #faebcc;
}

.infoSuccess {
    background-color: #e6efc2;
    color: #3c763d;
    border: 1px solid transparent;
    border-color: #d6e9c6;
}

.mainActionButton {
    border: 1px solid #c25240 !important;
    background: #c25240;
    color: #fff !important;
    padding: .2em 1em .2em 1em !important;
    border-radius: 3px;
    line-height: inherit;
    width: auto !important;
    font-size: 1.2em !important;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    font-family: tahoma,verdana,helvetica,helvetica-narrow,sans-serif;
    cursor: pointer;
}

    .mainActionButton:hover {
        background: #f26750;
    }

table.programmeUnitList ol {
    padding-left: 36px;
}

/* Stand Alone Visual Elements */

.util-split-line-right::after {
    height: 100%;
    width: 1px;
    background-color: #999;
}

/* END Stand Alone Visual Elements */

/* Utility Classes */

.util-disp-block {
    display: block !important;
}

.util-disp-none {
    display: none;
}

.util-width-100-perc {
    width: 100%;
}

.util-bg-teal {
    background-color: #6f61db !important;
}

.util-bg-white {
    background-color: #fff !important;
}

.util-bg-black {
    background-color: #333;
}

.util-border-top-1-teal {
    border-top: 1px solid #6f61db;
}

.util-border-bottom-1-teal {
    border-bottom: 1px solid #6f61db;
}

.util-text-dark-grey {
    color: #333;
}

.util-text-teal {
    color: #6f61db !important;
}

.util-text-bold {
    font-weight: bold !important;
}

.util-text-white {
    color: #fff;
}

.util-text-small {
    font-size: 0.9em;
}

.util-text-align-right {
    text-align: right !important;
}

.util-text-align-center {
    text-align: center;
}

.util-text-align-left {
    text-align: left;
}

.util-hover-teal:hover {
    color: #009096;
}

.util-bg-black {
    background-color: #333;
}

.util-float-left {
    float: left;
}

.util-float-right {
    float: right;
}

.util-center-block {
    float: none;
    margin: auto;
}

.util-padding-none {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.util-padding-top-5 {
    padding-top: 5px;
}

.util-padding-top-10 {
    padding-top: 10px;
}

.util-padding-top-20 {
    padding-top: 20px;
}

.util-padding-top-40 {
    padding-top: 40px;
}

.util-padding-top-60 {
    padding-top: 60px;
}

.util-padding-bottom-0 {
    margin-bottom: 0px !important;
}

.util-padding-bottom-5 {
    padding-bottom: 5px;
}

.util-padding-bottom-10 {
    padding-bottom: 10px;
}

.util-padding-bottom-20 {
    padding-bottom: 20px;
}

.util-padding-bottom-50 {
    padding-bottom: 50px;
}

.util-padding-left-5 {
    padding-left: 5px !important;
}

.util-padding-left-12 {
    padding-left: 12px;
}

.util-padding-left-18 {
    padding-left: 18px;
}

.util-padding-right-12 {
    padding-right: 12px;
}

.util-margin-top-minus-10 {
    margin-top: -10px;
}

.util-margin-top-5 {
    margin-top: 5px;
}

.util-margin-top-10 {
    margin-top: 10px;
}

.util-margin-top-15 {
    margin-top: 15px;
}

.util-margin-top-20 {
    margin-top: 20px;
}

.util-margin-top-30 {
    margin-top: 30px;
}

.util-margin-top-60 {
    margin-top: 60px;
}

.util-margin-top-150 {
    margin-top: 150px;
}

.util-margin-right-15 {
    margin-right: 15px;
}

.util-margin-bottom-0 {
    margin-bottom: 0px !important;
}

.util-margin-bottom-5 {
    margin-bottom: 5px;
}

.util-margin-bottom-10 {
    margin-bottom: 10px;
}

.util-margin-bottom-15 {
    margin-bottom: 15px;
}

.util-margin-bottom-20 {
    margin-bottom: 20px;
}

.util-margin-bottom-30 {
    margin-bottom: 30px;
}

.util-margin-bottom-40 {
    margin-bottom: 40px;
}

.util-margin-bottom-50 {
    margin-bottom: 50px;
}

.util-margin-bottom-60 {
    margin-bottom: 60px;
}

.util-margin-bottom-150 {
    margin-bottom: 150px;
}

.util-margin-bottom-205 {
    margin-bottom: 205px;
}

.util-margin-left-3 {
    margin-left: 3px;
}

.util-margin-left-6 {
    margin-left: 6px;
}

.util-margin-left-5 {
    margin-left: 5px;
}

.util-margin-left-10 {
    margin-left: 10px;
}

.util-pos-rel {
    position: relative;
}

.util-box-shadow-light {
    -webkit-box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.36);
    -moz-box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.36);
    box-shadow: 0px 2px 5px 2px rgba(0, 0, 0, 0.36);
}

.util-border-teal {
    border-color: #6f61db;
}

.util-opacity-0 {
    opacity: 0;
}

/* Psuedo Element Utility Classes: */

.util-pipe-after::after {
    content: '';
    position: absolute;
    display: block;
    right: 0;
    height: 100%;
    width: 2px;
    background: #999;
}

/* END Psuedo Element Utility Classes: */

/* Utility classes with transitions: */

.util-fade-in-05-trigger:hover .util-fade-in-05 {
    transition: 0.5s opacity;
    opacity: 100;
}

/* END Utility classes with transitions: */

/* Responsive utility classes (Keep beneath other utility classes) */

@media (max-width: 991px) {
    .util-md-margin-top-0 {
        margin-top: 0px !important;
    }
}

@media (max-width: 767px) {

    .util-sm-margin-top-0 {
        margin-top: 0px !important;
    }

    .util-xs-text-align-center {
        text-align: center !important;
    }
}

@media (max-width: 576px) {

    .util-sm-width-100-perc {
        width: 100%;
    }

    .util-sm-width-50-perc {
        width: 50%;
    }
}

@media (min-width: 768px ) {

    .h-md-100 {
        height: 100% !important;
    }

    .util-sm-float-left {
        float: left !important;
    }

    .util-sm-float-right {
        float: right !important;
    }

    .util-md-margin-left-5 {
        margin-left: 5px;
    }

    .util-md-margin-left-10 {
        margin-left: 10px;
    }

    .util-md-margin-bottom-50 {
        margin-bottom: 50px;
    }

    .util-md-padding-bottom-50 {
        padding-bottom: 50px;
    }
}

@media (min-width: 992px ) {
    .util-lg-margin-left-10 {
        margin-left: 10px;
    }
}

/* END  Responsive utility classes */

/* END Utility Classes */

/* Spice Theme Styles */

#wrap {
    position: relative !important;
}

.wizard-gridbatch-table {
    border: none !important;
}

.wizard-gridbatch-table th {
    text-align: left !important;
    padding-right: 4px;
    padding-left: 6px;
    font-family: Arial, Helvetica, sans-serif !important;
    background-color: #333;
}

.wizard-gridbatch-table tr {
    font-family: Arial, Helvetica, sans-serif !important;
}

    .wizard-gridbatch-table tr:focus-within {
        background-color: #a199fa !important;
    }

    .wizard-gridbatch-table td {
        padding-top: 5px;
        padding-bottom: 5px;
    }

.wizard-gridbatch-table td:nth-child(1) {
    padding-left: 5px;
}

.wizard-gridbatch-table td input {
    margin-left: 3px;
    padding-left: 2px;
}

.wizard-gridbatch-table td input:focus {
        outline: #5529cc 1.5px solid;
    }

.wizard-gridbatch-table td input::selection {
        color: white;
    }

.wizard-gridbatch-data-row > td {
    padding-top: 9px;
    padding-bottom: 9px !important;
}

.wizard-gridbatch-delete-btn {
    margin-top: 4px;
    margin-bottom: 4px;
}

.wizard-gridbatch-delete-btn--small {
    /* width: 90%;
    padding-left: 9%; */ 
}

.dropdown-toggle .caret {
    margin-left: 3px;
}

/* Bootstrap Overrides */

    a {
    color: #6f61db;
}

p a {
    color: #6f61db !important;
}

a[disabled] {
    color: #c0c0c0 !important;
    cursor: default;
}

select {
    min-height: 28px;
}

@media (min-width: 1200px) {
    .container, .container-lg {
        width: 1170px !important;
        max-width: 1170px !important;
    }
}

@media (min-width: 1300px) {
    .container, .container-lg {
        width: 1270px !important;
        max-width: 1270px !important;
    }
}

@media (min-width: 1400px) {
    .container, .container-lg {
        width: 1370px !important;
        max-width: 1370px !important;
    }
}

.navbar {
    padding-top: 0;
    padding-bottom: 0;
}

.navbar, .navbar-nav {
    height: 50px;
}

.nav-item {
    padding: 0.5rem 0;
}

a.navbar-brand {
    padding: 0;
    margin-right: 10px;
}

.navbar-nav {
    margin-left: 0;
}

    .navbar-nav > li {
        margin-left: 1px !important;
    }

        .navbar-nav > li > a {
            color: #fff !important;
        }

            .navbar-nav > li > a:hover {
                color: #a199fa !important;
            }

.nav-item.active,
.nav-item.show,
.nav-item.active > a {
    background-color: #fff !important;
    color: #6F61db !important;
}

.navbar-nav > .show > a,
.navbar-nav > .show > a:hover,
.navbar-nav > .show > a:focus {
    color: #333 !important;
    background-color: #fff !important;
}

.dropdown-menu {
    border: none !important;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.18);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.18);
    margin-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.dropdown-toggle::after {
    margin-left: 0.17em;
}

.dropdown-menu > div {
    margin-left: -10px;
}

    .dropdown-menu > div > a {
        padding: 10px 30px;
        border-top-left-radius: 20px;
        border-bottom-left-radius: 20px;
        height: 40px;
        transition: 0.4s padding-left, 0.4s padding-right;
    }

        .dropdown-menu > div > a:hover,
        .dropdown-menu > div > a:focus {
            background-color: #a199fa;
            color: #333;
            transition: 0.4s padding-left, 0.4s padding-right;
            padding-left: 40px;
            padding-right: 20px;
        }

.dropdown-menu > .active > div > a,
.dropdown-menu > .active > div > a:hover,
.dropdown-item.active {
    transition: none !important;
    padding-left: 30px !important;
    background-color: #6F61db !important;
    color: #fff !important;
}

.navbar-overflow {
    background-color: #6F61db;
    -webkit-box-shadow: inset 0px -7px 17px -8px rgba(0, 0, 0, 0.50);
    -moz-box-shadow: inset 0px -7px 17px -8px rgba(0, 0, 0, 0.50);
    box-shadow: inset 0px -7px 17px -8px rgba(0, 0, 0, 0.50);
}

    .navbar-overflow .navbar-nav {
        -ms-flex-direction: row;
        flex-direction: row;
    }

        .navbar-overflow .navbar-nav .dropdown-menu {
            position: absolute;
        }

        .navbar-overflow .navbar-nav .nav-link {
            padding-right: 0.5rem;
            padding-left: 0.5rem;
        }

@media (max-width: 767px) {
    .navbar {
        align-items: flex-start;
    }

        .navbar, .navbar .navbar-nav {
            height: auto;
            min-height: 50px;
        }

    .container-lg {
        margin-top: 5px;
    }

    .navbar .dropdown-menu {
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .nav-item.dropdown,
    .nav-item.dropdown.show,
    .nav-item.dropdown.active {
        background-color: #333 !important;
    }

        .nav-item.dropdown .dropdown-menu a:not(.active),
        .nav-item.dropdown.show .dropdown-menu a:not(.active),
        .nav-item.dropdown.active .dropdown-menu a:not(.active) {
            color: #aaa !important;
        }

    .dropdown-menu {
        background-color: transparent;
    }
}

@media (max-width: 767px) {
    a.navbar-brand {
        margin-right: 0 !important;
    }
}

@media (max-width: 844.99px) {
 .navbar.navbar-overflow .grading-dropdown {
        display: block;
    }
}

@media (min-width: 845px) {
    .navbar .grading-dropdown {
        display: block;
    }

    .navbar.navbar-overflow .grading-dropdown {
        display: none;
    }
}

/* IE Width amd tramsition fix for glyphicon inside warning span */
.dropdown-menu__item--tall .warning.glyphicon::before {
    width: 20px;
    display: inline-block;
}

.dropdown-menu__item__subtext {
    display: block;
    font-size: 12px;
    color: #f00;
}

.dropdown-menu > li > a:hover .dropdown-menu__item__subtext {
    color: #fff !important;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    background-color: #a199fa;
    color: #333;
    transition: 0.4s padding-left, 0.4s padding-right;
    padding-left: 40px;
    padding-right: 20px;
}

.overflow-navbar .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    background-color: #a199fa;
}

/* END Bootstrap Overrides */

.btn-spice {
    min-width: 100px;
    border-radius: 4px;
    cursor: pointer !important;
}

.btn-spice--short {
    height: 30px;
    padding-top: 4px;
}

.btn-spice:hover {
}

.btn-spice--teal {
    color: #333 !important;
    background-color: #a199fa !important;
}

    .btn-spice--teal[disabled] {
    }

.btn-spice--choose {
    color: #333333 !important;
    background-color: #A199FA;
    height: 34px !important;
}

@media screen and (min-width:0\0) {
    /* for IE 9+ */
    .btn-spice--choose {
        margin-left: 225px;
    }
}

a.btn-spice--choose {
    display: inline-block;
}

.btn-spice--choose .btn-lbl {
    position: relative;
    z-index: 2;
    pointer-events: none;
}

.btn-spice--choose .btn-colour {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #A199FA;
    z-index: 1;
    pointer-events: none;
}


.btn-spice--choose input[type="file"] {
    position: absolute;
    top: 5px;
    left: -86px;
    margin-left: 95%;
    color: #6f61db;
    outline: none;
    z-index: 0;
}

@media screen and (min-width:0\0) {
    /* for IE 9+ */
    .btn-spice--choose input[type="file"] {
        margin-left: -141px;
        height: 34px;
        top: -1px;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    /* Put your IE-only styles here. Works for IE10 & IE11 */
    .card-login__submit-wrap__button {
        text-indent: 0px !important;
        font-size: 0px !important;
    }
}

.btn-spice--white {
    color: #333333 !important;
    background-color: #fff;
    border: #A199FA 1px solid !important;
}

    .btn-spice--white[disabled] {
        border: #9eecef 1px solid !important;
    }

.btn-spice--home {
    color: #6f61db !important;
    background-color: #fff;
}

    .btn-spice--home[disabled] {
        border: #9eecef 1px solid !important;
    }

.btn-spice-no-fill--red {
    color: #cc0000 !important;
    background-color: #ffffff;
    border: #cc0000 1px solid !important;
}

.btn-spice-nofill--red[disabled] {
    border: #cc0000 1px solid !important;
}

.btn-spice--red {
    background-color: #cc0000;
    color: #fff;
}

    .btn-spice--red:hover {
        color: #fff !important;
    }

div.validation-summary-valid {
    display: none;
}

.cache-header-logo {
    width: 160px;
}

.cache-logo-wrap {
    width: 200px !important;
}

.ncfe-logo-header {
    height: 40px;
}

.ncfe-logo-login {
    height: 90px;
    padding-bottom: 10px;
}

.ncfe-logo-login-small {
    height: 60px;
    width: 160px;
    padding-bottom: 10px;
}

li .home-nav-icon {
    color: #fff;
}

li.active .home-nav-icon {
    color: #6f61db !important;
}

.spice-navbar a {
    font-weight: 200 !important;
    font-size: 1.2em !important;
}

.spice-homepage-hero {
    padding-top: 22px;
}

.home-centre-flirt {
    color: #6f61db;
    margin-bottom: 10px;
    display: block;
}

@media (max-width: 767px) {
    .home-centre-flirt {
        padding-left: 15px;
    }

    .spice-homepage-hero {
        padding-top: 10px;
    }
}

/* PreLogin page */
.page-header {
    max-width: var(--max-width);
    margin: 0 auto 1rem auto;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    padding-bottom: 0.5rem;
}

.page-header h1 {
    font-size: 1.8rem;
    font-weight: 700;
}

.page-header h1 span {
    color: var(--primary);
}

.page-section {
    max-width: var(--max-width);
    margin: 0 auto;
}

.login-card {
    display: flex;
    flex-wrap: nowrap;
    background: #fff;
    border-radius: var(--radius);
    box-shadow: 0 2px 6px rgba(0,0,0,.1);
    overflow: hidden;
    max-width: var(--max-width);
    width: 100%;
    height: 400px;
    align-items: stretch;
    margin: 10px auto 0;
}

.login-media {
    flex: 0 0 50%;
    min-width: 0;
}

.login-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.login-form {
    flex: 0 0 50%;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.login-form h2 {
    margin-bottom: 1rem;
}

.login-form input,
.login-form button {
    width: 100%;
    padding: .75rem;
    margin-bottom: 1rem;
    border-radius: var(--radius);
    border: 1px solid #ccc;
    font-size: 1rem;
}

.login-form button {
    background: #6f61db;
    color: #fff;
    border: none;
    cursor: pointer;
}

.login-form button:hover {
    background: #4e449c;
}

.login-form input[type=submit] {
    padding: .75rem;
    margin-bottom: 1rem;
    border-radius: var(--radius);
    border: none;
    background: #6f61db;
    color: #fff;
    font-size: 1rem;
    cursor: pointer;
    transition: background 0.3s;
}

    .login-form input[type=submit]:hover {
        background: #4e449c;
    }

@media (max-width:768px) {
    .login-card {
        flex-direction: column;
        height: auto;
    }

    .login-media {
        height: 220px;
    }
}
.footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 1rem 0;
    border-top: 1px solid #ddd;
    font-size: 0.9rem;
    color: #555;
}

.footer-left {
    max-width: 70%;
}

.footer-right {
    white-space: nowrap;
    text-align: right;
    font-weight: 600;
}

.tabs {
    max-width: 600px;
    margin: 0 auto;
    background: #fff;
    border-radius: var(--radius);
    box-shadow: 0 2px 6px rgba(0,0,0,.1);
}

.tab-buttons {
    display: flex;
    border-bottom: 1px solid #ddd;
}

.tab-buttons button {
    flex: 1;
    padding: 1rem;
    border: none;
    background: none;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    transition: border-color 0.3s;
}

    .tab-buttons button.active {
        border-color: #6f61db;
        color: #6f61db;
    }

.tab-content {
    padding: 1.5rem;
}

.tab-content div {
    display: none;
}

.tab-content div.active {
    display: block;
}

/* End of PreLogin page */

.hero-tab {
    text-align: center;
    height: 332px;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.3), 0 3px 7px rgba(0, 0, 0, 0.3), inset 0 1px rgba(255,255,255,1), inset 0 -3px 2px rgba(0,0,0,0.25);
    border-radius: 5px;
    background: white;
    background: -moz-linear-gradient(#eeefef, #ffffff 10%);
    background: -ms-linear-gradient(#eeefef, #ffffff 10%);
    background: -o-linear-gradient(#eeefef, #ffffff 10%);
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#eeefef), color-stop(0.1, #ffffff));
    background: -webkit-linear-gradient(#eeefef, #ffffff 10%);
    background: linear-gradient(#eeefef, #ffffff 10%);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-top: 20px;
}

    .hero-tab i, .hero-tab svg {
        color: #9b9b9b;
    }

    .hero-tab svg {
        width: 250px;
        height: 250px;
    }

    .hero-tab i {
        font-size: 250px;
        line-height: 250px;
    }

        .hero-tab i.bi-search {
            font-size: 200px;
        }

        .hero-tab i:hover,
        .hero-tab svg:hover {
            color: #a199fa;
        }

.hero-tab__title {
    display: block;
    width: 100%;
    position: relative;
    text-align: center;
    font-weight: 200;
    font-size: 2em;
    color: #231F20;
    padding-top: 8px;
    padding-bottom: 5px;
}

.hero-tab:hover .hero-tab__title {
    color: #4F4C4D;
}

@media (max-width: 1199px) {

    .hero-tab {
        height: 284px;
    }

        .hero-tab svg {
            width: 200px;
            height: 200px;
        }

        .hero-tab i {
            font-size: 200px;
            line-height: 200px;
        }

            .hero-tab i.bi-search {
                font-size: 180px;
            }

    .hero-tab__title {
        font-size: 1.4em;
    }
}

@media (max-width: 991px) {

    .hero-tab {
        height: 245px;
    }

        .hero-tab svg {
            width: 180px;
            height: 180px;
        }

        .hero-tab i {
            font-size: 180px;
            line-height: 180px;
        }

            .hero-tab i.bi-search {
                font-size: 160px;
            }

    .hero-tab__title {
        font-size: 1.3em;
    }
}

@media (max-width: 767px) {

    .hero-tab {
        height: 215px;
        margin-bottom: 25px;
        min-width: 221px;
    }

        .hero-tab svg {
            width: 150px;
            height: 150px;
        }

        .hero-tab i {
            font-size: 150px;
            line-height: 150px;
        }

    .hero-tab__title {
        font-size: 1.5em;
    }
}

.feature-wrap {
    position: relative;
}

    .feature-wrap:before {
        width: 50%;
        height: 100px;
        background-color: #6f61db;
        display: block;
        position: absolute;
        margin-top: 40px;
        left: 0px;
        margin-left: -15px;
    }

.home-feature-card {
    height: 100px;
    padding-top: 10px;
}

.home-feature-card--black-bg {
    background-color: #6f61db;
    position: relative;
}

    .home-feature-card--black-bg a {
        color: #fff !important;
    }

    .home-feature-card--black-bg:after {
        content: '';
        display: block;
        position: absolute;
        top: 0px;
        right: -3px;
        margin-top: -20px;
        height: 150px;
        width: 4px;
        background-color: #333;
    }

.home-feature-card__title {
    font-size: 1.5em;
    font-weight: 200;
    margin-top: 10px;
    display: block;
}

.home-feature-card__cta-link {
    font-size: 2.5em;
    margin-top: 13px;
    display: block;
    margin-left: 55px;
}

.home-feature-card--black-bg .home-feature-card__title {
    color: #fff !important;
}

.home-feature-card__img {
    width: 90px;
}

.home-subheader {
    font-size: 2em;
}

.link-group-header {
    font-size: 1.2em;
    color: #333;
    position: relative;
}

.home-feature-slice-link {
    font-size: 1.2em;
    font-weight: bold;
    color: #333 !important;
}

.home-feature-slice-link-button {
    width: 100%;
    height: 46px;
    line-height: 1.2;
    align-content: center;
    background: #a199fa;
    border: 2px solid #fff;
    border-radius: 25px;
    box-shadow: 2px 4px 10px 2px rgba(117, 117, 117, 0.51);
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -webkit-box-align: center;
    align-items: center;
}

.home-feature-slice-link-title {
    font-size: 16px;
    width: 100%;
}

.home-helpbar-slice {
}

.home-helpbar-slice-content {
    background: #a199fa;
}

.home-helpbar-slice-content-title {
    color: #333;
    font-size: 20px;
}

.home-helpbar-slice-content-button {
}

.link-group-header:before {
    content: '';
    position: absolute;
    display: block;
    width: 30px;
    height: 30px;
    left: -10px;
    top: -5px;
    border-radius: 15px;
    background-color: #6f61db;
    z-index: -1;
}

.spice-footer {
    border-top: 2px solid #6f61db;
    background: #333;
    color: #fff;
    font-weight: 200;
}

.spice-footer a {
    color: #fff !important;
}

    .spice-footer a:hover {
        color: #6f61db !important;
    }

.footer-line-divide {
    border-bottom: 1px solid #6f61db;
    margin-top: 4px;
    margin-bottom: 4px;
}

#poster {
    background: none !important;
}

#userdetail {
    float: none !important;
}

.candidate-entry-list input[type="submit"] {
    width: 55px;
    height: 30px;
    display: inline-block;
    padding: 1px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    border-radius: 4px;
    min-width: 100px;
    color: white !important;
    background-color: #6f61db !important;
}

.bulk-csv-batch-info-table td {
    text-align: left;
}

/* Spice Theme Table */

.spice-theme-table {
    width: 100%;
}

    .spice-theme-table thead tr {
        background-color: #333;
        color: #fff !important;
        border-bottom: 2px solid #6f61db;
    }

        .spice-theme-table thead tr th, .spice-theme-table tbody tr th {
            text-align: left !important;
            padding: 6px 5px;
        }

    .spice-theme-table tbody tr td {
        text-align: left !important;
        padding: 2px 5px;
    }

    .spice-theme-table tbody tr:nth-child(even) {
        background-color: #efefef;
    }

.spice-theme-table--no-lines tbody tr:nth-child(even) {
    background-color: none !important;
}

.spice-theme-table tbody tr:first-child td {
    padding-top: 5px;
}

.spice-theme-table--tall-rows tbody > tr > th {
    padding: 7px 4px;
    text-align: center;
    background-color: #333;
    color: #fff !important;
    border-bottom: 2px solid #6f61db;
}

.spice-theme-table--tall-rows tbody > tr > td {
    padding: 7px 4px;
}

    .spice-theme-table--tall-rows tbody > tr > td input[type="image"] {
        width: 26px;
    }

/* END Spice Theme Table*/

/* END Spice Theme */

.SelectedRow, .SelectedRow a:link, .SelectedRow a:hover, .SelectedRow td {
    background-color: #6f61db;
    color: #ffffff;
}

    .SelectedRow > td {
        padding-bottom: 9px !important;
    }

.Wizard {
    margin: auto !important;
    padding-bottom: 25px !important;
    Width: 100%;
    text-align: left;
}

    .Wizard h1 {
        font-size: 28px;
        font-weight: 700;
    }

    .Wizard h3 {
        color: #333 !important;
        font-size: 1.2em;
    }

    .Wizard > tbody > tr > td {
        padding-top: 10px;
        padding-left: 10px;
        padding-right: 10px;
        accent-color: #7e58e4;
    }

.btn--wizard-step {
    margin-bottom: 10px !important;
    margin-right: 10px !important;
}

.EntryWizard__btn {
    width: 100px;
    height: 24px;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 2px;
    background-color: #6f61db;
    border-style: Solid;
    border-width: 0px;
    color: #ffffff !important;
}

.Wizard__btn, input[type=submit].Wizard__btn {
    width: 100px;
    height: 32px;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 2px;
    background-color: #6f61db;
    border-style: Solid;
    border-width: 0px;
    color: #ffffff;
}

.centred {
    text-align: center;
}

.Grid th {
    font-size: 0.9em;
    padding-left: 5px;
    padding-right: 5px;
    text-align: left;
}

.Grid td, .SelectedRow td {
    padding-top: 9px;
    padding-left: 5px;
    padding-right: 5px;
}

.btn__wizard {
    margin: 5px;
}

.mt20 {
    margin-top: 20px;
}

.stretched-horizontal {
    margin-left: -1000%;
    margin-right: -1000%;
}

.hiddencol {
    display: none !important;
}

.flag {
    display: inline-block;
    text-align: center;
}

.flag-img {
    width: 25px;
    aspect-ratio: 4 / 3;
    border: 1px solid #e9ecef;
    border-radius: 2px;
    overflow: hidden;
}

.flag-code {
    text-align: center;
    font-size: 10px;
}

.flag-no-img {
    width:200px !important;
}