/* To override default background make a style like this in this file: */


body {
	background: black url(images/PCResBground.png) no-repeat top left;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;	
	filter: none;
	width: 100%;
	height: 100%;
	font-family: Arial;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}
/* These are the styles from the default CSS (Styles.css), so they all need to be overriden.
   The use of !important will definitely override default styles. */

body {
	background: White!important;
}

/*white Auckland Libraries logo at the top */
#logo
{
	position:absolute;
	left:20%;
	margin-top:5px;
	margin-bottom:5px;
   	height:154px;
    	width: 435px;
	width:30%;
    	background-image: url('./images/aklclogo.png');
    	background-repeat: repeat-x;
	background-size:100%;
	z-index: -1;
}


/* clock hide */

#clockSpace
{
	display:none;
}




/* background container on first page after login */
#container
{
    position: absolute;
	margin-top:20px;
	left: 20%;
	clear: left;
    width: 60%;
	min-width: 850px;
	min-height: 600px;
	height:80%;
	background-image: url('./images/bgPageGreen.PNG');
	background-size: auto 100%;
	
}

#homeBookingcontainer
{
    margin-top:80px;
	width: 90%;
	min-width:800px;
    margin-left: auto;color
    margin-right: auto;
	background-color:#1D3C51;
}

/*future res */

#createFutureContainer {
	position: absolute;
	margin-top:20px;
	left: 20%;
	clear: left;
    	width: 60%;
	min-width: 900px;
	min-height:500px;
	height:80%;
	background-image: url('./images/bgPageGreen.PNG');
	background-size: auto 100%;
}

/* future res confirmation */


.futureConfirmation {
	background-color: #1D3C51;
}



/*buttons underneath slider bar */
#createFutureContainer .buttonContainer {	
	width: 850px;
    margin-left: auto;
    margin-right: auto;
margin-top:0px;
    background-color: #1D3C51;
    min-height: 50px;
	min-width: 800px; 
	position: static;
}


#homeBookingcontainer
{
    margin-top:80px;
	width: 90%;
	min-width:800px;
    margin-left: auto;color
    margin-right: auto;
	background-color:#1D3C51;
}

/* labels and text fields on the future res page */
#MainContent_UpdatePanelLocation { 
	width: 850px;
    margin-left: auto;
    margin-right: auto;
	background-color:#1D3C51;
	min-height:100px;
	
}

#MainContent_SitePanel {
	padding-top:10px;
	background-color:#1D3C51; 
}

#MainContent_LocationPanel { 
 background-color: #1D3C51;
}

/* Instructions for the slider on Create Reservation/Scheduler.aspx page */
.sliderInstructions {
	color: #fff;
	text-align: center;
	width: 850px;
    margin-left: auto;
	margin-top: 0px;
margin-bottom:0px;
    margin-right: auto;
	background-color:#1D3C51;
}

#divSilverlightScheduler {
	background-color:#1D3C51;
	width: 820px !important;
	margin-left: auto;
	margin-right:auto;
	padding-top:10px;
	padding-right:25px;
	padding-left:5px;
	
	
}

/* Legend information underneath the availability slider */
.sliderLegend {
	text-align: center;
	margin-left:auto;
	margin-right:auto;
	width: 850px;
	background-color:#1D3C51;
}

#accountContainer
{
    position: absolute;
	margin-top:20px;
	left: 10%;
	clear: left;
    width: 80%;
	min-width: 950px;
	min-height:650px;
	height:400px;
	background-image: url('./images/bgPageGreen.PNG');
	background-size: auto 100%;
	padding:20px 20px 20px 20px;
background-color:blue;
}

#accountContainer .label {
	position: relative;
	padding-top:5px;
    	width: 30%;
	clear: both;
	left: 5%;
	min-width:50px;
    	float: left;
	background-color:#1D3C51; 
	height:30px;
	text-align:left;
	font-size:medium;
}

#accountContainer .detail {
	position: relative;
	padding-top: 5px;
    	width: 63%;
	min-width: 100px;
    	float: left;
	background-color:#1D3C51; 
	height:30px;
	text-align:left;
	font-size:medium;
}


/* For Account reservation and information page, add some margin between the edge of the page */
#Grid {
	padding-top:0px;
	padding-bottom:0px;
	padding-left:0px;
	padding-right:0px;
	position: relative;
	left: 15%;
	margin-top:310px;
	width:71.2%;
	min-width:910px;
	margin-left: 10px;
	background-color: #CCCCCC;
	border:none !important;
}

#Grid th {
	border-left-width: 1px !important;
	border-right-width: 1px !important;
	border-left-color: #8E9294 !important;
	border-right-color: #8E9294 !important;
	
}

#Grid td{
	border-left-width: 1px !important;
	border-right-width: 1px !important;
	border-left-color: #8E9294 !important;
	border-right-color: #8E9294 !important;
}


.buttonContainer {
	position:relative;
	left:15%; 
	width:71.2%;
	height:50px;
	min-width:910px;
	margin-left:10px;
	margin-top:0px;
	background-color: #1D3C51 !important;
	padding-top:10px;
}

.futureConfirmationFormButtons {
	position:relative;
	left:0%; 
	width:59.5%;
	height:50px;
	#min-width:950px;
	min-width:600px;
	margin-left:0px;
	margin-top:0px;
	background-color: #1D3C51 !important;

}

/* Override Telerik styling for dialog and table headers */
.t-header {
	background: #688D01 !important;
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#F9AB3F', endColorstr='#FF7B00'); /*For IE7-8-9*/
    color: #fff !important;
    font-weight: bold !important;
    font-size: 13px !important;
	
	
}

/* Move close button down a bit */
.t-window-titlebar .t-window-actions {
	top: 4px !important;	
}
/* Make title bar consistent with Web Print */
.t-window-titlebar {
	border-radius: 6px !important;
	padding: 0.45em 0 !important;
}
/* Pad in the dialog title */
.t-window-title {
	left: 1em !important;	
}

#contentContainer {
	padding-top:10px;
	padding-left:10px;
	padding-right:10px;
	padding-bottom:10px;
	margin-top: 100px;
	background-color:#1D3C51;
}

#contentContainer .buttonContainer{
	position:relative;
	left:0%; 
	width:59.5%;
	height:50px;
	#min-width:950px;
	min-width:600px;
	margin-left:0px;
	margin-top:0px;
	background-color: #1D3C51 !important;
}