﻿/*General*/
img, a, input[type=image] {
    border: none;
}
input, select, textarea {
    font-family: 'Lucida Sans Unicode',Calibri,Verdana,Arial;
    font-size: 13px;
    border: 1px solid silver;
}
textarea {
	font-size: 1em;
}
.validatorText {
	color: red;
	font-weight: normal;
}
.hidden {
    display: none;
}
.visible {
    display: normal;
}

/*Text*/
p {
    color: black;
}
h1 {
    margin: 0;
    padding: 0;
}
h2 {
    margin: 0;
    padding: 10px 0 0 0;
}
h3
{
	color: #27378F;
	margin: 0;
	padding: 0;
}
h4
{
	color: #27378F;
	font-weight: bold;
	margin: 0;
	padding: 0 0 10px 0;
}
.requiredAsterisk, .toolbarErrorText, .warningText {
    color: red;
    font-weight: bold;
}
.subText {
    font-weight: normal;
    color: black;
}
.bold {
    font-weight: bold;
}

/*Layout*/
html {
    height: 100%;
    min-height: 100%;
    margin: 0;
}
body {
    height: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    background-color: white;
    background-image: url('../images/bkg_body_grad.png');
    background-repeat: repeat-x;
    background-position: left top;
    font-family: 'Lucida Sans Unicode',Calibri,Verdana,Arial;
    font-size: 13px;
}
#container {
    position: relative;
    width: 80%;
    max-width: 1600px;
    min-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
#header {
    position: relative;
    width: 100%;
    height: 56px;
    padding: 0;
    vertical-align: middle;
}
    #header .gnosisLogo {
        float: right;
        height: 40px;
        margin: 10px 0 0 0;
    }
    #header .customerLogo {
        height: 40px;
        margin: 5px 0 0 0;
    }
#mainContent {
    position: relative;
    width: 98.5%;
    min-height: 400px;
    background-color: white;
    margin: 0 0 50px 0;
    padding: 10px 10px 30px 10px;
    border: 1px solid #CCCCCC;
}
#footer {
    position: fixed;
    bottom: 0px;
    width: 100%;
    height: 20px;
    margin: 20px 0 0 0;
    background-color: #27378F;
    text-align: center;
    color: white;
}
    #footer a, a:visited {
        color: white;
    }

#divInfo {
    height: 27px;
}
.divSiteMessage {
    clear: both;
    width: 99.3%;
    padding: 5px;
    background-color: red;
    color: white;
}

/* Links */
a, a:visited {
    color: blue;
    text-decoration: none;
}
    a:hover {
        text-decoration: underline;
    }
    a:active {
        color: blue;
        text-decoration: none;
    }

/* Top menu */
#menuBar {
    position: absolute;
    height: 20px;
    top: 17px;
    right: 130px;
}
    #menuBar #topMenu {
        float: right;
        color: silver;
    }
        #menuBar #topMenu a, a:visited {
            color: silver;
            margin-right: 20px;
        }
            #menuBar #topMenu a:hover {
                color: white;
                text-decoration: none;
            }
    #menuBar .popupMenu {
        display: none;
        background-color: whitesmoke;
        border-left: 1px solid silver;
        border-right: 1px solid silver;
        border-bottom: 1px solid silver;
        margin: 0;
        z-index: 99;
    }
        #menuBar .popupMenu a, .popupMenu a:visited {
            color: grey;
            font-size: 0.9em;
            display: block;
            width: 150px;
            padding: 5px 5px 5px 5px;
            border-bottom: 1px solid white;
            font-weight: normal;
        }
            #menuBar .popupMenu a:hover {
                background-color: white;
                color: black;
                text-decoration: underline;
            }

/* Buttons */
.button {
    min-width: 100px;
    min-height: 30px;
    font-size: 12px;
    font-weight: normal;
    color: #656565;
    background-color: #F0F5FF;
    border: 1px solid #C0C0C0;
}
.button:hover {
    color: black;
    background-color: #DFEAFF;
}

/* Toolbar */
.pnlToolbar {
    width: 100%;
	height: 29px;
	border-bottom: 1px solid #C0C0C0;
	text-align: left;
	margin-bottom: 5px;
}
    .pnlToolbar #divTBButtons {
        float: right;
        margin-top: 0;
    }
.toolbarButton {
    width: 120px;
    height: 30px;
    font-size: 0.9em;
    font-weight: normal;
    color: #656565;
    background-color: #F0F5FF;
    border: 1px solid #C0C0C0;
}
    .toolbarButton:hover {
        color: black;
        background-color: #DFEAFF;
    }

.buttonDisabled, .buttonDisabled:hover {
    color: #C0C0C0;
    background-color: white;
    border-top: 1px solid #ebebeb;
    border-left: 1px solid #ebebeb;
    border-right: 1px solid #ebebeb;
}

/* Sub toolbar */
.pnlSubToolbar {
    position: relative;
    height: 20px;
    font-size: 11px;
	text-align: left;
    margin: 0 0 5px 0;
    padding: 1px 5px 1px 5px;
    background-color: #F0F5FF;
    border: 1px solid #CCCCCC;
}
    .pnlSubToolbar .subToolbarLeftLabel {
        float: left;
        padding: 0 10px 0 0;
    }
    .pnlSubToolbar .subToolbarLeftButton {
        float: left;
        padding: 0 20px 0 0;
        color: blue;
    }
    .pnlSubToolbar .subToolbarRightButton {
        float: right;
        padding: 0 0 0 20px;
        color: blue;
    }
    .pnlSubToolbar .subToolbarButtonDisabled {
        color: #b0beff;
    }
        .pnlSubToolbar .subToolbarButtonDisabled:hover {
            text-decoration: none;
        }
    .pnlSubToolbar .pnlSubToolbarError {
        position: absolute;
        top: -21px;
        right: -1px;
        height: 20px;
        color: white;
        background-color: red;
        padding: 0 10px;
    }

/* Data Input tables */
.tdDataInputLabel {
    width: 250px;
    font-weight: bold;
    text-align: right;
    padding: 0 5px 0 0;
    background-color: #f5f5f5;
}
.tdDataInputLabelMultiline {
    width: 250px;
    font-weight: bold;
    text-align: right;
    padding: 0 5px 0 0;
    background-color: #f5f5f5;
    vertical-align: top;
}
.tdDataInputLabelCombined {
    width: 280px;
    font-weight: bold;
    text-align: right;
    padding: 0 5px 0 0;
    background-color: #f5f5f5;
}
.tdDataInputLabelNCRS {
    width: 180px;
    font-weight: normal;
    text-align: right;
    padding: 0 5px 0 0;
    background-color: #f5f5f5;
}
.tdDataInputLabelCombinedSubhead {
    font-weight: bold;
    text-align: left;
    padding: 0 0 0 10px;
    background-color: #f5f5f5;
}
.tdDataInputLabelCombinedMultiline {
    width: 250px;
    font-weight: bold;
    text-align: right;
    padding: 0 5px 0 0;
    background-color: #f5f5f5;
    vertical-align: top;
}
.tdDataInputLabelCombinedMultilineNCRS {
    width: 250px;
    font-weight: bold;
    text-align: right;
    padding: 4px 5px 0 0;
    background-color: #f5f5f5;
    vertical-align: top;
}
.tdDataInputValidation {
	color: red;
	font-weight: normal;
	width: 210px;
	padding: 0 0 0 10px;
	text-align: right;
}
.tdDataInputValidationCombined {
	color: red;
	font-weight: normal;
	width: 350px;
	padding: 0 5px 0 0;
	text-align: right;
}
.dataInputTextBox {
	width: 96%;
}
.dataInputTextBox2Digit {
	width: 30px;
	text-align: left;
}
.dataInputTextBoxShort {
	width: 100px;
	text-align: left;
}
.dataInputTextBoxMedium {
	width: 150px;
}
.dataInputTextBoxPostcode {
	width: 100px;
	text-align: left;
}
.dataInputComboBox {
	width: 100%;
}
.dataInputComboBoxRequired {
	width: 97%;
}
.dataSectionSeparator {
	color: #27378F;
	background-color: #F2F3F4;
	font-weight: bold;
	padding: 0 0 0 10px;
	border: 1px solid silver;
}
.trBlankSectionSeparator {
	height: 3px;
}

/* Grid views */
.gridView {
    width: 100%;
    border: none;
}
    .gridView .gridAlternateRow {
        background-color: #f7fafe;
    }
    .gridView th {
        height: 25px;
        background-color: #f5f5f5;
        color: #5665b9;
        font-weight: bold;
        padding: 2px 4px;
        border: none;
        border-bottom: 1px solid lightgray;
    }
        .gridView th a {
            color: #5665b9;
            font-weight: bold;
        }

    .gridView a {
        color: blue;
        font-size: 1em;
        font-weight: normal;
        text-decoration: none;
    }
        .gridView a:hover {
            text-decoration: underline;
        }
        .gridView a:active, a:visited {
            color: blue;
        }
    .gridView td {
        height: 25px;
        padding: 2px 2px 2px 4px;
        border: none;
    }

    .gridView input {
        font-size: 1em;
    }
    .gridView .tdImageButton {
        text-align: center;
        vertical-align: middle;
        width: 50px;
        padding: 7px 0 0 0;
    }
.selectedRow {
    background-color: #FFFFD7;
}

.gridViewVertHeaderText th {
    vertical-align: bottom;
    height: 140px;
}
.verticalText {
    /*writing-mode:tb-rl;*/
    -webkit-transform:rotate(270deg);
    -moz-transform:rotate(270deg);
    -ms-transform:rotate(90);
    -o-transform: rotate(270deg);
    display:block;
}

.formEditArea 
{
	margin-top: 0;
	margin-bottom: 10px;
	padding: 6px 0px 5px 0px;
}
    .formEditArea .scrollx {
        overflow-x: scroll;
    }
.formEditAreaTitle {
    font-weight: bold;
    color: #333399; 
    background-color: transparent;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid #C0C0C0;
    display: block;
    width: 100%;
}

/* Pager */
.pager {
    margin: 5px 0;
}
.pagerButton {
    width: 60px; 
    margin: 0 2px;
}
.pagerLabelLeft {
    font-weight: bold; 
    margin: 10px 5px 10px 10px;
}
.pagerLabelRight {
    font-weight: bold; 
    margin: 10px 10px 10px 5px;
}
.pagerTextBox {
    text-align: center;
    font-weight: bold; 
    margin: 0;
}

/* Ajax Control Toolkit Tab Control  
HTML
<div id="main_tabContainerData" class="tabControl" style="width: 100%; visibility: hidden;">
    <div id="main_tabContainerData_header" class="ajax__tab_header">
	    <span id="main_tabContainerData_tabCore_tab">
	    	<span class="ajax__tab_outer">
		    	<span class="ajax__tab_inner">
		    		<a class="ajax__tab_tab" id="__tab_main_tabContainerData_tabCore" href="#" style="text-decoration:none;">
		    			<span>Tab text</span>
		    		</a>
		    	</span>
		    </span>
	    </span>

        repeat for more tabs...
    </div>
</div>
*/

/* default layout */
.tabControl .ajax__tab_header 
{
    font-family: 'Lucida Sans Unicode',Calibri,Verdana,Arial;
    font-size: 0.9em;
    font-weight: normal;
    display: block;
    background: url(../images/atctabcontrol/tab-line.gif) repeat-x bottom;
    white-space: nowrap;
}
.tabControl .ajax__tab_tab /*the <a> tag*/
{
    overflow: hidden;
    text-align: center;
    cursor: pointer;
    display: -moz-inline-box;
    display: inline-block;
    border: none;
    outline: none;
    color: #656565;
}
.tabControl .ajax__tab_header .ajax__tab_outer
{
    display: -moz-inline-box;
    display: inline-block;
    padding: 3px 20px 1px 20px;
    margin-right: 3px;
    border: solid 1px #C0C0C0;
    background-color: #f6f7f8; 
}
.tabControl .ajax__tab_header .ajax__tab_inner
{
    display: -moz-inline-box;
    display: inline-block;
}
.tabControl .ajax__tab_hover .ajax__tab_outer
{
    color: black;
    background-color: #ededed;
}
.tabControl .ajax__tab_hover .ajax__tab_inner
{
    /*color: #fff;*/
}
.tabControl .ajax__tab_active .ajax__tab_outer
{
    border-bottom-color: #ffffff;
    background-color: #ffffff;
}
.tabControl .ajax__tab_active .ajax__tab_inner
{
    /*color: #000;
    border-color: #333;*/
}
.tabControl .ajax__tab_active .ajax__tab_tab 
{
    color: red;
}
.tabControl .ajax__tab_hover .ajax__tab_tab 
{
    color: red;
}
.tabControl .ajax__tab_body
{
    font-family: 'Lucida Sans Unicode',Calibri,Verdana,Arial;
    font-size: 1em;
    border: 1px solid #999999;
    border-top: 0;
    padding: 8px;
    background-color: #ffffff;
}
/* scrolling */
.tabControl .ajax__scroll_horiz {overflow-x:scroll;}
.tabControl .ajax__scroll_vert {overflow-y:scroll;}
.tabControl .ajax__scroll_both {overflow:scroll}
.tabControl .ajax__scroll_auto {overflow:auto}

/* Ajax Control Toolkit CalendarExtender  
HTML

*/
.calendarControl .ajax__calendar_container {
    border: 1px solid #646464;
    background-color: white;
    color: black;
}

/* Donors page */
.donorFilterTable {
    width: 100%;
}
.divNoDonorsMatch {
    width: 100%;
    background-color: beige;
    color: dimgray;
    text-align: center;
    padding: 7px 0;
}

/* ACT COLLAPSIBLE PANEL CONTROL */
.collapsePanel {
    background-color: white;
    overflow: visible;
    margin: 0 0 10px 0;
}
.collapsePanelHeader {
    color: blue;
    font-size: 1em;
    margin: 0;
    padding: 0;
    cursor: pointer;
    vertical-align: middle;
}
    .collapsePanelHeader:hover {
        text-decoration: underline;
    }
    .collapsePanelHeader span {
        padding: 0;
    }
    .collapsePanelHeader img {
        margin: 0;
        padding: 0;
        border: none;
    }

.collapsePanelContent
{
	padding: 5px 5px 0 5px;
}

.collapsePanelHeaderRptCriteria {
    background-color: #F0F5FF;
    font-weight: normal;
}

.tmDivDonorCodes 
{
    width: 280px;
    float: right;
}

/* Transfer page - centre filters */
.transferDropDown {
    min-width: 200px;
}
.chkTransferExcludePrevious {
    display: block;
    margin: 10px 0 0 0;
}

/* C1 controls */
.c1InputMask 
{
    display: inline;
}
.C1_TransferCombo {
    display: inline-block;
}

/* CSV Export panel */
.pnlCSVExport {
    background-color: aliceblue;
    margin: 5px 0 10px 0;
    padding: 0 10px 0 10px;
    border: 1px solid #CCCCCC;
}

.pnlCSVExport #pnlCSVExportButtons {
    margin: 5px 0 0 0;
    text-align: right;
}

.verticalText {
    writing-mode:bt-lr;
    -webkit-transform:rotate(270deg);
    -moz-transform:rotate(270deg);
    -o-transform: rotate(270deg);
    white-space:nowrap;
    display:block;
    bottom:0;
    width:20px;
    height:20px;
}

/* PAD Cell type 'Other' check div */
.pnlCellTypeCheck {
    height: 40px;
    background-color: red;
    color: white;
    font-weight: bold;
    text-align: center;
    margin: 5px 0 10px 0;
    padding: 3px 0 5px 0;
}

/*Select/deselect All buttons - Export field headers */
.lbExportSelectAll {
    float: right;
    font-weight: normal;
    padding: 0 10px 0 0;
}
.tdExportFiltersRowTitle {
    width: 200px;
}

/*NCRAS import data tables */
.ncrasDataImportGrid {
    padding: 0;
}
    .ncrasDataImportGrid th {
        height: 20px;
        padding: 0 0 0 5px;
        color: grey;
        font-weight: normal;
        background-color: #EAF4FF;
    }
.ncrasDataImportIDColumn {
    text-align: center;
    width: 70px;
    background-color: #EAF4FF;
}
.ncrasDataImportDateColumnHeader {
    text-align: left;
}
.ncrasDataImportDateColumn {
    text-align: left;
    width: 170px;
    background-color: #EAF4FF;
}

/* TMS core set edit page */
.editTMACoreSetTable {
    margin: 0 0 0 0;
    width: 100%;
}
    .editTMACoreSetTable th {
        color: black;
        width: 200px;
        text-align: right;
    }
    .editTMACoreSetTable .errorColumn {
        width: 300px;
        color: red;
        font-weight: bold;
    }
    .editTMACoreSetTable .donorCodeTextBox {
        text-align: center;
    }

