html, body {
height: 100%;
} 

/*The below styles how the header DIV will look*/
.header {
	font-family: tahoma;
	font-size: 20px;
	text-align: left;
	color: #000000;
	margin-left: 10px;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 60px;
	background-image: url(../images/logo.png);
	background-repeat: no-repeat;
	background-position: center left;
	height: 48px;
	line-height: 200%;
}

/*The below styles how the logout DIV will look*/
.logout {
	font-family: tahoma;
	font-size: 12px;
	text-align: right;
	color: #000000;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-right: 20px;
	margin-right: 15px;
	text-decoration: none;
	background-image: url(../images/logout.png);
	background-repeat: no-repeat;
	background-position: center right;
}

/*The below styles how the logout link will look*/
.logout a:link, .logout a:visited {
	font-family: tahoma;
	font-size: 12px;
	color: #000000;
	text-decoration: none;
}

/*The below styles how the main DIV which holds the all other DIVs will look*/
.placeholder {
	margin-bottom: 25px;
	text-align: center;
	width: 800px;
	margin-left: auto;
	margin-right: auto;
}

/*The below styles how the upload form DIVS will look (the rounded edges of the boxes)*/
/*To change the background colour of these boxes change every occurrence of #EEEEEE*/
.container{
  display:block; 
  }

.container *  {
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#EEEEEE}

.container1{
  margin-left:3px;
  margin-right:3px;
  padding-left:1px;
  padding-right:1px;
  border-left:1px solid #EEEEEE;
  border-right:1px solid #EEEEEE;
  background:#EEEEEE}

.container2{
  margin-left:1px;
  margin-right:1px;
  padding-right:1px;
  padding-left:1px;
  border-left:1px solid #EEEEEE;
  border-right:1px solid #EEEEEE;
  background:#EEEEEE}

.container3  {
  margin-left:1px;
  margin-right:1px;
  border-left:1px solid #EEEEEE;
  border-right:1px solid #EEEEEE;}

.container4{
  border-left:1px solid #EEEEEE;
  border-right:1px solid #EEEEEE}

.container5{
  border-left:1px solid #EEEEEE;
  border-right:1px solid #EEEEEE}

/*The below styles how the content contained within the rounded edged boxes will look*/
/*To change the background colour of this box change #EEEEEE*/
.containercontent{
 min-height: 130px;
 padding-top: 40px;
 color: #000000;
 text-align: left;
 font-family: Tahoma;
 padding-left: 4px;
 padding-right: 4px;
 padding-bottom: 1px;
 background:#EEEEEE}



/*The below styles how the main DIV which holds the all other DIVs will look*/
.placeholderoptions {
	margin-top: 25px;
	margin-bottom: 25px;
	text-align: center;
	width: 400px;
	margin-left: auto;
	margin-right: auto;
}
/*The below styles how the upload form DIVS will look (the rounded edges of the boxes)*/
/*To change the background colour of these boxes change every occurrence of #EEEEEE*/
.uploadoptions{
  display:block; 
  }

.uploadoptions *  {
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#FFFFFF}

.uploadoptions1{
  margin-left:3px;
  margin-right:3px;
  padding-left:1px;
  padding-right:1px;
  border-left:1px solid #FFFFFF;
  border-right:1px solid #FFFFFF;
  background:#FFFFFF}

.uploadoptions2{
  margin-left:1px;
  margin-right:1px;
  padding-right:1px;
  padding-left:1px;
  border-left:1px solid #FFFFFF;
  border-right:1px solid #FFFFFF;
  background:#FFFFFF}

.uploadoptions3  {
  margin-left:1px;
  margin-right:1px;
  border-left:1px solid #FFFFFF;
  border-right:1px solid #FFFFFF;}

.uploadoptions4{
  border-left:1px solid #FFFFFF;
  border-right:1px solid #FFFFFF}

.uploadoptions5{
  border-left:1px solid #FFFFFF;
  border-right:1px solid #FFFFFF}

/*The below styles how the content contained within the rounded edged boxes will look*/
/*To change the background colour of this box change #EEEEEE*/
.uploadoptionscontent{
 min-height: 50px;
 padding-top: 20px;
 color: #000000;
 text-align: left;
 font-family: Tahoma;
 font-size: 12px;
 padding-left: 4px;
 padding-right: 4px;
 padding-bottom: 20px;
 background:#FFFFFF}


.uploadprogress {
	font-family: tahoma;
	font-size: 16px;
	color: #000000;
	margin-left: 10px;
	padding-top: 25px;
	padding-left: 60px;
	background-image: url(../images/loading.gif);
	background-repeat: no-repeat;
	background-position: center left;
	height: 48px;
}

/*The below styles how a success message will look in the upload form*/
.success {
	font-family: tahoma;
	font-size: 16px;
	color: green;
	margin-left: 10px;
	padding-top: 25px;
	padding-left: 60px;
	background-image: url(../images/success.png);
	background-repeat: no-repeat;
	background-position: center left;
	height: 48px;
}

/*The below styles how a success message will look in the delete box*/
.deletesuccess {
	background-image: url(../images/success.png);
	background-repeat: no-repeat;
	background-position: center center;
	height: 48px;
	width: 100px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
}

/*The below styles how an error message will look in the upload form*/
.error {
font-family: tahoma;
	font-size: 16px;
	color: red;
	margin-left: 10px;
	padding-top: 25px;
	padding-left: 60px;
	background-image: url(../images/error.png);
	background-repeat: no-repeat;
	background-position: center left;
	height: 48px;
}

.renameerror {
	background-image: url(../images/error.png);
	background-repeat: no-repeat;
	background-position: center center;
	height: 48px;
	width: 100px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
}

/*The below styles how the login p will look*/
.login {
	display: block;
	text-align: center;
	}

/*The below styles how the various input boxes look*/
.optionsinput {
	font-family: tahoma;
	font-size: 14px;
	background: #FFFFFF;
	border: 1px solid #000000;
	margin-left: 10px;
	}

.logininput {
	font-family: tahoma;
	font-size: 14px;
	background: #FFFFFF;
	border: 1px solid #000000;
	margin-left: 10px;
	}
	
.renameinput {
	font-family: tahoma;
	font-size: 14px;
	background: #FFFFFF;
	border: 1px solid #000000;
	margin-left: 10px;
	}

/*The below styles how the file upload input box will look*/	
.fileinput {
	font-family: tahoma;
	font-size: 16px;
	background: #FFFFFF;
	border: 1px solid #000000;
	height: 25px;
	width: 600px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

/*The below styles how the form buttons look*/
.logincontainer {
	margin-bottom: 25px;
	text-align: center;
	width: 112px;
	margin-left: auto;
	margin-right: auto;
	min-height: 25px;
}

.buttoncontainer {
	margin-bottom: 25px;
	text-align: center;
	width: 240px;
	margin-left: auto;
	margin-right: auto;
	min-height: 25px;
}

.buttoncontainer a:link, .buttoncontainer a:visited {
	color: #ffffff;
	text-decoration: none;
	}

.button {
	font-family: Arial;
	font-size: 14px;
	color: #ffffff;
	background-image: url(../images/button_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
	border: 0;
	height: 25px;
	width: 112px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	margin-top: 15px;
	padding-left: 4px;
	padding-top: 10px;
	text-align: center;
	float: right;
	}
	
.okbutton {
	font-family: Arial;
	font-size: 14px;
	color: #ffffff;
	background-image: url(../images/button_bg.png);
	background-repeat: no-repeat;
	background-position: center center;
	border: 0;
	height: 25px;
	width: 112px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	margin-top: 15px;
	padding-left: 4px;
	padding-top: 10px;
	text-align: center;
	}
	
.inputbutton {
	font-family: Arial;
	font-size: 14px;
	color: #ffffff;
	background-image: url(../images/button_bg.png);
	background-repeat: no-repeat;
	border: 0;
	height: 25px;
	width: 112px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	margin-top: 20px;
	float: left;
	}

.imagecontainer {
	width: 700px;
	margin-left: auto;
	margin-right: auto;
	}

/*The below styles how the thumbnails will look when listed*/
.thumbnaildiv {
 	width: 120px;
 	float: left;
 	position: relative;
 	z-index: 1;
 	}

.thumbnail {
 	border: 1px solid #000000;
 	margin: 10px;
 	}

/*The below styles how the text associated with each image will look when listed*/
.imagetext {
	font-family: tahoma;
	font-size: 14px;
	color: #000000;
	width: 550px;
	padding: 8px;
	position: relative;
	z-index: 2;
	margin-left: 130px;
	}

.imageinfo {
	background-image: url(../images/information.png);
	background-repeat: no-repeat;
	margin-left: 10px;
	padding-left: 25px;
	height: 16px;
	margin-top: 0;
	margin-bottom: 5px;
}

.imagedetails {
	background-image: url(../images/image.png);
	background-repeat: no-repeat;
	margin-left: 10px;
	padding-left: 25px;
	height: 16px;
	margin-top: 0;
	margin-bottom: 5px;
}

.imagesize {
	background-image: url(../images/disk.png);
	background-repeat: no-repeat;
	margin-left: 10px;
	padding-left: 25px;
	height: 16px;
	margin-top: 0;
	margin-bottom: 5px;
}

.imagelink {
	background-image: url(../images/link.png);
	background-repeat: no-repeat;
	margin-left: 10px;
	padding-left: 25px;
	min-height: 16px;
	margin-top: 0;
	margin-bottom: 5px;
}

.imagelink a:link, .imagelink a:visited {
	color: #000000;
	text-decoration: none;
	}

/*The below styles the look of the screen blackout when the delete button is pressed*/	
.blackout{
	position: fixed;
	z-index: 5;
	background-color: #000000;
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
	top: 0; 
	right: 0; 
	bottom: 0; 
	left: 0;
	width: 100%;
	text-align: center;
	line-height: 0;	
	height: 100%;
	min-height: 100%;
}

/*The below styles how the box in the middle of the blackout screen will look*/
.box {
	color: #000000;
	margin-top: 200px;
	text-align: center;
	background-color: #ffffff;
	width: 500px;
	min-height: 300px;
	left: 0;
	line-height: 0;	
	margin-left: auto;
	margin-right: auto;
}

/*The below styles how the text at the of the box in the middle of the blackout screen will look*/
.boxheader {
	font-family: tahoma;
	font-size: 18px;
	font-weight: bold;
	display: block;
	padding-bottom: 10px;
	}

/*The below styles how the text in the box in the middle of the blackout screen will look*/
.boxtext {
	font-family: tahoma;
	font-size: 14px;
	color: #000000;
	padding: 20px;
	line-height: 100%;
	padding-top: 50px;
	}

.boxtext a:link, .boxtext a:visited{
	color: #ffffff;
	text-decoration: none;
	}

/*The below styles how the thumbnail in the box in the middle of the blackout screen will look*/
.boxthumbnail {
	border: 1px solid #000000;
	margin-top: 20px;
	margin-bottom: 20px;
	}

/*The below styles how the footer text will look*/
.footer {
	font-family: tahoma;
	font-size: 10px;
	color: #000000;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 20px;
	}