body{
 margin:0;
 padding:80px 0 50px 0;
 font-weight : normal; 
 font-size : 11px; 
 font-family : Helvetica, sans-serif; 
}
div#header{
 position:absolute;
 top:30px;
 left:40px;
 width:100%;
 height:80px;
}
div#backbutton{
 position:absolute;
 bottom:30px;
 left:40px;
 width:200px;
 height:50px;
 font-size:11px;
}
div#footer{
 position:absolute;
 bottom:0;
 left:40px;
 width:100%;
 height:50px;
 font-size:10px;
}
@media screen{
 body>div#header{
  position:fixed;
 }
 body>div#footer{
  position:fixed;
 }
}
#leftcontent {
 position:absolute;
 left:0;
 top:100px;
 width:350px;
 font-family: Verdana, Arial, Helvetica, san-serif;
 font-size: 10px;
}
#leftcontent h1, #leftcontent p{ 
 margin: 0 40px;
 font-family: Verdana, Arial, Helvetica, san-serif;
 font-size: 11px;
}

#middle {
 position:absolute;
 top:100px;
 left:290px;
 width:350px;
}
#middle h1, #middle p{ 
 margin: 0 40px;
 font-family: Verdana, Arial, Helvetica, san-serif;
 font-size: 11px;
}
#midadmin {
 position:absolute;
 top:100px;
 left:290px;
 width:700px;
}
#midadmin h1, #midadmin p{ 
 margin: 0 40px;
 font-family: Verdana, Arial, Helvetica, san-serif;
 font-size: 11px;
}

#rightcontent {
 position:absolute;
 left:530px;
 top:100px;
 width:500px;
}

#rightcontent h1, #rightcontent p{ 
 margin: 0 40px;
 font-family: Verdana, Arial, Helvetica, san-serif;
 font-size: 11px;
}

#rightcontent table{ 
 margin: 0 40px;
 font-family: Verdana, Arial, Helvetica, san-serif;
 font-size: 10px;
}


#page{
 position:absolute;
 bottom:15px;
 left:575px;
 width:500px;
 height:50px;
 font-size:10px;
 font-family: Verdana, Arial, Helvetica, san-serif;
 line-height:180%;
}

#rightadmin {
 position:absolute;
 left:550px;
 top:100px;
 width:700px;
}

#rightadmin h1, #rightadmin p, #rightadmin table{ 
 margin: 0 40px;
 font-family: Verdana, Arial, Helvetica, san-serif;
 font-size: 11px;
}

#login {
 margin: 100px auto 100px auto; 
 width:250px;
 top:500px;
}
#login h1, #login p{ 
 font-family: Verdana, Arial, Helvetica, san-serif;
 font-size: 11px;
}

#nav li {
 display: block;
 width:200px;
 text-decoration: none;
 display: block;
 margin: 0;
 padding: 4px 0;
 color: #000000;
}
#nav li a:link, #nav li a:visited, #nav li a:active {
 text-decoration: none;
 display: block;
 margin: 0;
 padding: 0 0;
 color: #000000;
}
#nav li a:hover {
 text-decoration: underline;
 color: #000000;
}

#container {
 width:700px;
 display: table;
}

#row  {
 display: table-row;
}

#left{
 width:200px;
 padding:0;
 display: table-cell;
}

#right {
 width:500px;
 padding:0;
 display: table-cell;
}

/**************************************************/
/*                FILE TABLE                   */
/**************************************************/
.files-table{
	margin:0 40px;
	padding:0;
}
.files-table li{
	margin:0 0 3px 0;
	padding:0;
	float:left;
	list-style:none;
}
.files-table li div{
	float:left;
	padding:3px 5px 3px 5px;
	height:15px;
}
.files-table li:hover a{
	color:#FFFFFF;
}
.files-table li a:hover{
	color:#000000;
}
.title-table{
	background-color:#666666;
}


/*Title background color*/

.check-box, .title-filename, .title-size, .title-date, .title-action{
	border-right:2px solid #FFFFFF;
	color:#FFFFFF;
}

/*Title DIV and Member details DIV*/

.check-box, .file-check-box{
	width:15px;
	text-align:center;
}
.title-filename, .file-name{
	width:285px;
}
.title-size, .file-size{
	width:100px;
}
.title-date, .file-date{
	width:150px;
}
.title-action, .file-action{
	width:85px;
}

/*Hover effect for each members*/

.row-hover{
	background-color:#CCCCCC;
}
.row-hover:hover{
	background-image:none;
	background-color:#999999;
	color:#FFFFFF;
}
.file-check-box, .check-box{
	padding:0;
	margin:0;
}

.file-check-box input, .check-box input{
	padding:0;
	margin:0;
	border:none;
}

/*This is for short details members*/

.file-check-box, .file-name, .file-size, .file-date, .file-action{
	border-right:2px solid #FFFFFF;
	font-size:11px;
}

/**************************************************/
/*                IMAGE TABLE                     */
/**************************************************/
.image-table{
	margin:0 40px;
	padding:0;
	position:absolute;
}
.image-table li{
	margin:0 0 0 0;
	padding:0;
	float:left;
	list-style:none;
}
.image-table li div{
	float:left;
	padding:0;
}
.image-table li:hover a{
	color:#FFFFFF;
}
.image-table li a:hover{
	color:#FFFFFF;
}



/*Hover effect for each members*/

.row-image{
	background-color:#FFFFFF;
	height:136px;
}

.row-text{
	font-size:10px;
	font-family: Verdana, Arial, Helvetica, san-serif;
	background-color:#FFFFFF;
	height:15px;
}

/*This is for short details members*/

.imagebox1, .imagebox2, .imagebox3, .imagebox4 {
	width:90px;
	display:table-cell;
	text-align:center;
	border-right:2px solid #FFFFFF;
	font-size:10px;
	font-family: Verdana, Arial, Helvetica, san-serif;
	vertical-align:middle;
}

 
a.pink:link {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: none; color: #FF6699}
a.pink:visited {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: none; color: #FF6699}
a.pink:active {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: none; color: #FF6699}
a.pink:hover {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: underline; color: #FF6699}

a.black:link {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: underline; color: #000000}
a.black:visited {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: underline; color: #000000}
a.black:active {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: underline; color: #000000}
a.black:hover {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: underline; color: #000000}

a.blacknoline:link {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: none; color: #000000}
a.blacknoline:visited {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: none; color: #000000}
a.blacknoline:active {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: none; color: #000000}
a.blacknoline:hover {  font-family: Verdana, Arial, Helvetica, san-serif; font-size: 10px; text-decoration: underline; color: #000000}

a:hover {background:#ffffff; text-decoration:none;}
a.tooltip span {display:none; padding:2px 3px; margin-left:8px;}
a.tooltip:hover span{display:inline; position:absolute; background:#000000; border:1px solid #000000; color:#ffffff;}

a.gallery, a.gallery:visited {display:inline; color:#000;}

a.gallery span {visibility:hidden; display:inline-block; position:absolute; width:310px; height:438px; cursor:default; border:none; text-align:center; vertical-align:middle;}

a.galleryunhide span {visibility:visible; display:inline-block; position:absolute; width:310px; height:438px; cursor:default; border:none; text-align:center; vertical-align:middle;}

a.slide span {left:415px; top:0;}

a.gallery:hover {z-index:100;}

a.gallery:hover span {visibility:visible; z-index:100;}

a.gallery:hover span img {position:relative; z-index:100;}


a.gallery:active span img, a.gallery:focus span img {position:relative; z-index:10;}

div.scroll {
height: 380px;
width: 700px;
overflow: auto;
}