body
{
    margin: 0px;
    text-align: center;
    font-family: Arial, Verdana, Sans-Serif;
    font-size: small;
}

h1
{
}
h2
{
    color:#A71431;
}

h3
{
    padding:0px;
    margin:0px;
    color:#A71431;
    font-weight:bold;
}


 
h4 
{
    color:black;
}

textarea
{
    font-family: Arial, Verdana, Sans-Serif;
}
input, select, textarea
{
    font-size: inherit;
    margin-top: 0px;
}

a:link, a:visited, a:active
{
    text-decoration: none;
    color:#006c9d; /* blue */
}

a:active 
{
    color:#A71431; /* red */
}

a:hover
{
    color:#A71431; /* red */
    text-decoration:underline;
}

div#wrapper
{
    margin: 0px auto;
    text-align: left;
    padding: 2%;
    width: 80%;
    width: 1000px;
}


.header
{
    width: 100%;
    float: left;    
}

.footer
{
    margin-top:10px;
    width: 100%;
    float: left;
    
    font-size: smaller;
}

.annoucement 
{
    margin-top:10px;
    /*background-color:#e29fb2;*/
    background-color:Yellow;
    float:left;
    width:100%;
    font-size:large;
}

.publicSiteHeader
{
    margin-top:5px;
    font-weight:bold;
    float:left;
    width:100%;
}

.guidance
{    
    width: 97%;
    float: left; 
    margin-top:10px;
}

.standardLoginContainer, .standardIndexContainer 
{
    width: 100%;
    float: left;        
}

.standardIndexContainer .leftCol {width:50%}
.standardIndexContainer .rightCol {width:49%}
.standardIndexContainer .standardSection 
{
    padding:5px;
    
}

.standardContainer, .smartNavContainer
{
    width: 98%;
    float: left;        
}

.smartNavContainer 
{
    margin:0px 10px 10px 0px;   
}

.smartNavContainer .leftCol
{
    margin-left:10px;
    width: 48%
}

.standardContainer .buttonRow
{
    margin:0px 0px 2px 0px;
    width:100%;
}

.leftCol
{
    float: left;
    width: 50%;
}

.rightCol
{
    float: right;
    width: 50%;
}

.leftCol65
{
    float: left;
    width: 65%;
}

.rightCol35
{
    float: right;
    width: 35%;
}

.standardRow
{
    float: left;
    margin: 10px 5px 0px;
    width: 100%;
}

.standardContainerRow
{
    float: left;
    margin: 5px 30px 0px;
    width: 100%;
}


.standardRow .standardContainerRow 
{
    width:96%;
    margin-top:0px;
}

.standardSection, .downloadSection
{
    float: left;
    margin: 10px 0px 0px 2px;
    padding: 2px 0px 0px 2px;
    width: 98%;
}

.standardSection, .downloadSection
{
    border: solid 1px #A71431;   /*red*/
}

.downloadSection 
{
    margin:15px 0px 20px 20px;
}

.indentedContainerShort
{
    margin:5px 0px 5px 105px;
    float:left;
}

.indentedContainerShort .courseIndent
{
    margin:5px 0px 5px 55px;
    float:left;
}

.attachmentContainer 
{
    margin:5px 0px 5px 10px;
    float:left;
    border: solid 1px #A71431;  /*red*/
}

.attachmentContainer .standardRow 
{
    width:98%;
    padding-bottom:5px;
}

.formMenuSection
{
    margin-bottom:50px;
}

.buttonRow
{
    float: left;
    margin: 2px;
    width: 98%;
    /*padding-top: 10px;*/
}


.buttonNavigationRow, .footerRightColumnRow
{
    padding-top: 0px;
    margin-left: 30px;
    float: right;
}


.mainNav
{
    float: left;
    width: 100%;
    margin-bottom: 5px;
}

.mainNavItem 
{
    padding:0px;
    margin-right:5px;
}

.mainNavSelectedItem 
{
    font-size:large;
    font-weight:bold;
    padding:0px 20px 0px 20px;
    margin:0px;
}

.mainNavSelectedItem a:link, .mainNavSelectedItem a:visited, .mainNavSelectedItem a:active
{
    color:#A71431; /* red */
}

.box {
    background-color:White;
    Width:400px;
    border-width:5px;
    border-color:Navy;
    border-style: Solid;
    margin: 25px;
    padding:25px;
}

.colLeft 
{
    float:left;
}

.colRight
{
    float:right;
}

.colRightLogin
{
    float:right;
    font-size:smaller;
}

.mainBody
{
    float: left;
    width: 1000px;
    border: solid 1px #A71431;
    margin-bottom:5px;
}

#formContainer 
{
    width: 100%;
    float: left;   
}

.formLeftNav
{
    float: left;
    width: 200px;
    /*height: 600px;*/
    width: 20%;
}

.formLeftNav .details
{
    float: left;    
    padding: 2px 0px 0px 2px;
    width: 98%;
    border: solid 1px #A71431;
}

.formNavItem 
{
    padding:0px;
    margin-right:0px;
}

.formNavSelectedItem 
{
    font-size: medium;
    font-weight:bold;
    padding:0px;
    margin:0px;
}

.formNavSelectedItem a:link, .formNavSelectedItem a:visited, .formNavSelectedItem a:active
{
    color:#A71431; /* red */
}


.formMainBody
{
    float: left;
    width: 800px;
    width: 79%;
    border: solid 1px #A71431;
}

.vsmValidationSummary
{
    float: left;
    width: 100%;
}

/*************** Styles for Label control *********************/
.lblMini, .lblShort, .lblMedium, .lblMediumLong, .lblLong, .lblShortDisplayValue, .lblMediumDisplayValue, 
.lblMediumLongDisplayValue, .lblLongDisplayValue, .lblStatus, .lblGridResultLabel
{
    display: inline-block; 
    vertical-align: top;
}
.lblMini 
{
    width:20px;
}

.lblShort, .lblShortDisplayValue
{
    width: 100px;
}
.lblMedium, .lblMediumDisplayValue 
{
    width: 180px;
}
.lblMediumLong, .lblMediumLongDisplayValue
{
    width:250px;
}
.lblLong
{
    width: 400px;
}
.lblShortDisplayValue {}
.lblMediumDisplayValue {}
.lblLongDisplayValue 
{ 
    width: 500px;
}

.lblSpan, .lblStatus, .lblGridResultLabel
{
    display: inline-block;
    padding: 10px 0 0 2px;
    width: 100%;
}

.lblGridResultLabel 
{
    margin-left:200px;
    color:Red;
}

.lblStatus 
{
    float:left;
    color:Red;
}

/*************** Styles for Buttons, Image Buttons, Link Buttons controls ************/
.btnRight, .ibtnRight, .btnLink, .lbtnRight
{
    float: right;
}

.btnLeft
{
    float: left;
}

.lbtnLeft
{
    display: inline-block;
}

.btnLink /****** Styles for Button controls that looks like links ******/
{
    float: left;
    text-align: left;
    color: #006c9d; /*blue*/
    background: none;
    margin: 0;
    padding: 0;
    border: none;
    cursor: pointer;
}

/*************** Styles for Textbox control *********************/
.txtMini, .txtShort, .txtMedium, .txtLong
{
    display: inline-block;
    vertical-align: top;
}
.txtMini
{
    width: 45px;
}
.txtShort
{
    width: 100px;
}
.txtMedium
{
    width: 225px;
}
.txtLong
{
    width: 400px;
}

.txtMultiRow
{
    width: 540px;
    height: 165px;
    border: 1px solid #BEBEBE;
    left: 20px;
    position:relative;
}

.txtSmallMultiRow 
{
    width: 400px;
    height: 80px;
    border: 1px solid #BEBEBE;

}
/*************** Styles for Listbox control *********************/
.lstMedium, .lstLong, .lstMediumLong
{
    display: inline-block;
    vertical-align: top;
}
.lstMedium
{
    width: 230px;
}
.lstMediumLong 
{
    width:540px;
}
.lstLong 
{
    width:650px;
}
/*************** Styles for Dropdownlist control *********************/
.ddlShort, .ddlMedium, .ddlLong, .ddlYesNo
{
    display: inline-block;
    vertical-align: top;
}
.ddlShort
{
    width: 100px;
}
.ddlMedium
{
    width: 230px;
}
.ddlLong
{
    width: 400px;
}
.ddlYesNo
{
    color: Red;
    width: 120px;
}

/***************** Generic Data Grid Style *******************/
.genericDataGrid 
{
    clear:both;
    margin: 10px;
    padding: 10px 0px 0px 2px;    
}
.genericDataGrid table, .genericDataGrid td, .genericDataGrid th
{
    border-color: #600;
    border-style: solid;
}
.genericDataGrid table
{
    border-width: 0 0 1px 1px;
    border-spacing: 0;
    border-collapse: collapse;
    width: 100%;
}
.genericDataGrid td, .genericDataGrid th
{
    margin: 0;
    padding: 4px;
    border-width: 1px 1px 0 0;
    background-color: #FFC;
}
.genericDataGrid th
{
    text-align: left;
    background: #d1cf8c;
}

.genericPagination 
{
    float:left;
    width:100%;
    margin-left:10px;
}
/***************** Generic Data Grid Style *******************/


/***************** table Styles *******************/
.centreGrid, .courseCentreGrid, .userGrid, .uploadErrorGrid
{
    height:100px;
    overflow-y:auto;
}

.courseCentreGrid
{
    height:150px;
}

.userGrid, .uploadErrorGrid
{
    padding: 10px 0px 5px 5px;
    height:100%;
    width:99%;
}


#institutionDecision , #institutionDecision > tbody > tr > td, #institutionDecision > tbody > tr > th,
.centreGrid table, .centreGrid td, .centreGrid th,
.courseCentreGrid table, .courseCentreGrid td, .courseCentreGrid th,
.userGrid table, .userGrid td, .userGrid th,
.uploadErrorGrid table, .uploadErrorGrid td, .uploadErrorGrid th
{
    border-color: #600;
    border-style: solid;
}


#institutionDecision,
.centreGrid table,
.courseCentreGrid table,
.userGrid table,
.uploadErrorGrid table
{
    border-width: 0 0 1px 1px;
    border-spacing: 0;
    border-collapse: collapse;
    width: 100%;
}


#institutionDecision > tbody > tr > td, #institutionDecision > tbody > tr > th,
.centreGrid td, .centreGrid th,
.courseCentreGrid td, .courseCentreGrid th,
.userGrid td, .userGrid th,
.uploadErrorGrid td, .uploadErrorGrid th
{
    margin: 0;
    padding: 4px;
    border-width: 1px 1px 0 0;
    background-color: #FFC;
}


#institutionDecision > tbody > tr > th,
.centreGrid th,
.courseCentreGrid th,
.userGrid th,
.uploadErrorGrid th
{
    
    text-align: left;
    background-color: #d1cf8c;
}


/***************** end table Styles *******************/


/*************** Styles for Modal popups *********************/
.modalSiteBackground
{
    background-color: #6D7B8D; /* Blue Slate Gray */
    filter: alpha(opacity=50);
    opacity: 0.5;
    -moz-opacity: 0.5;
    z-index: 10000;
}

.modalSitePopup, .modalQualificationDetailPopup, .modalUserDetailPopup, .modalSitePopupInstitution, .modalSitePopupGuidance
, .modalSitePopupCourse 
{
    background-color:White;
    border: solid 2px #A71431;
    padding:5px;
}

.modalSitePopup
{
    width: 600px;    
}

.modalQualificationDetailPopup
{
    width: 800px;
}

.modalUserDetailPopup
{
    width: 500px;
}

.modalSitePopupInstitution, .modalSitePopupGuidance 
{
    width: 700px;
    height:600px;
    overflow-y:auto;
    overflow-x:hidden;   
    padding:2px;
   
}

.modalSitePopupCourse
{
    width: 900px;
    height:600px;
    overflow-y:auto;
    overflow-x:hidden;   
    padding:2px;
    position:fixed;
    left:50%;
    top:50%;
    margin-left:-450px;
    margin-top:-300px;
}

 .standardModalContainer h3, .standardIndexContainer h3
 {
    text-align:center;
 }
 
 .standardModalContainer
 {
     width:100%;
     float:left;
    
 }
 
 .standardModalContainer .closeImage
 {
    float: left;
    margin: 2px 0px 0px 0px;
    width: 100%;   
 }
 
.standardModalContainer .closeButton 
{
    float:left;
    width:100%;
    text-align:center;
    padding-top:10px;
}
/*************** END Styles for Modal popups *********************/

#infoCharCounter 
{
    width:100%;
    float:left;
    padding:5px 0px 0px 5px;
}