/*********************** CLIENT AREA ****************/
/*general*/

body {
    margin: 0 0;
}

.center {
  width: 1000px;
  margin-left: auto ;
  margin-right: auto ;  
  text-align: center; 
}

td {
    vertical-align: top;
}
    
#header {
    position: fixed;
    width: 100%;
    height:100px;
    z-index: 10;    
}

#contents {
    position: relative;
    width: 100%;
    left: 0px;
    top: 100px;
    font-family: sans-serif;
    font-size: 14px;
    z-index: 5; 
}


.ender {
    position: relative;
    clear: both;
    text-align: center;
    padding-top: 10px;   
    z-index: 100;
}

body#clarea {
    padding: 1px;
}

#wrapper {
position: absolute; 
    width: 100%;
    height: 100%; 
    z-index: 10;
    }
 
body#clarea #header h2 {
    text-indent: -9999px;
    margin: 0px;
    padding:0px;    
}

body#clarea #container {
    position: relative;
    font-family: sans-serif;
    font-size: 14px;
    clear: both;
    width: auto;
    border: 1px solid red;
}

.half {
    width: 50%;
}


#left {
    float: left;
    height: 100px;
    width: 50%;
}

#right {
    float: right;
     height: 100px;
    width: 50%;
    text-align: right;
}

#logo {
   position: absolute;
    width: 75%;
    height: 55px;
    z-index: 100;
}

#logout {
    position: absolute; 
    height: 35px;
    right: 0px;
    z-index: 100;
}

#addiv {
    position: absolute;
    top: 40px;
    height: 35px;
      right: 0px;
      padding-top: 10px;
    z-index: 100;
}

.clear{
    clear:both;
}

.small {
    font-size: 10px;
}

body#clarea .imglink {
    font-size: 12px;
    text-decoration: none;
}

body#clarea .doclink, .doclink a {
    font-family: sans-serif;
    font-size: 14px;
    margin: 0 auto;
    
}

body#clarea .doclink a:link { 
    text-decoration: none;
}
  
.imglink {
    font-size: 12px;
    text-decoration: none;
}
    

/*login */

body#clarea #login {
    font-family: sans-serif;
    font-size: 14px;
    margin-top: 80px;
}

/*folders and files pages*/


/*folders*/
body#clarea .folderlist td {
    font-size: 24px;
}

table.folderscroll {
    table-layout: fixed;    
}
table.folderscroll th{
  padding:5px;
  font-size: 10px;
}

table.folderscroll tbody {
  width:auto;
  height: 150px;
  overflow-y:auto;
  overflow-x:auto;
}

table.folderscroll tr{
}
table.folderscroll td{
  text-align:center;
  width: 20%;
}

table.folderscroll.left {
    left: auto;
    right: auto;
}
table.folderscroll.left td{
  text-align:left;
  width: 20%;
}
/* end of folderscroll */


body#clarea .lister {
    width: 100%;   
    height: auto;
    padding: 20px 0px 20px 0px;
}    
 
/*form div*/

.form {
    position: relative;
    width: 90%;
    height: auto;
    z-index: 40;
    text-align: center;
    border: none;
    margin: auto;
    left: 0;
    right: 0;
}

.display {
    position: relative;
    height: auto;
    width: 50%;
    z-index: 40;
    text-align: justify;
    border: none;
    margin: auto;
    left: 0;
    right: 0;
}

.loggin {
    width: 50%;
    text-align:center;
    margin: auto;
    left: 0;
    right: 0;
}


#xlist {
    position: relative;
    width: 500px;
    height: 580px;
    z-index: 40;
    text-align: center;    
    clear:both;
    padding: 0px;
    margin: 0px; 
   left: 200px;
   overflow-y: scroll;
   overflow-x: auto;
}
 


/*end of form div */

/*admform*/
.form.admform {
    border: none;
    width: 90%;
}

.admform {
height: 725px;
  overflow-y: scroll;
  overflow-x: auto;
}

.admform1 {
height: auto;
}

.subadmform {
    width: 90%
}

.invisibled {
    display: none;
    width: 100px;
    height: 20px;
}

body#clarea .form #invisibled {
    display: none;
    width: 100px;
    height: 20px;
}

body#clarea #form1 #invisibled {
    display: none;
    width: 100px;
    height: 20px;
}

body#clarea #list #invisibled { 
    display: none;
    width: 100px;
    height: 20px;
}

body#clarea #wbform #invisibled {
    display: none;
    width: 100px;
    height: 20px;
}


.form #admform td {                  
        font-size: 12px;
        padding: 0px;
        margin: 0px;
}
/*end of admform*/

body#clarea #folders {
  position: relative;  
  width:100%;;
  height: 100%;
  overflow-y:auto;
  overflow-x:hidden;
}

body#clarea #files{
    position: relative;
    width: 100%;
    height: 100%;
}



body#clarea .tallfolders {
    height: 500px;
    width: 100%;
    padding: 0px;
    margin: 0px;
    clear: both;
    overflow-y:auto;
    overflow-x:hidden;
}

body#clarea .tallfolders caption {
    width: 400px;
}
 

#subaddf #admtab{
    width: 60%;
    margin: 0 auto;
}

tr.border {
    border: 1px solid white;
}

#subolds {
    left: auto;
    right: auto;
}
 
#contents a {
    font-size: 12px;
}

.eight {
    font-size: 10px;
}


table.scrollable {
table-layout: fixed;
width: auto;
  height: auto;
  margin-left: auto ;
  margin-right: auto ;
}

table.scrollable caption{
	width: auto;
	border: none;
}
table.scrollable th {
  padding:5px;
  font-size: 10px;
  border: none;
   text-align: left;
}

table.scrollable tbody {
  width: auto;
   text-align: left;
  
}

table.scrollable tr {
 
}

table.scrollable td {
 text-align: left;
}

/* end of scrollable */

table.medwid {
    width: 100%;
}

#uploadad {
height: auto;
  overflow-y: auto;
  overflow-x: auto;
}

#uploadad caption {
    border: none;
}

#admin {
    position: absolute;
    width: 100%;
    left:0;
    right:0;
    margin: 0 auto; 
    text-align: center;
}
.table{
  display: table; 
  padding: 5px;
  margin: 5px;
  margin: 0 auto;
}

.table.half {
    width: 50%;
}

.table.quarter {
    width: 25%;
}

.table.third {
    width: 33%;
}
.row{
  display: table-row; 
  vertical-align: top;
  padding-bottom: 10px;
  border-left: 0px;
}
.cell{
  display: table-cell;
  vertical-align: top;
  padding-left: 10px;
  padding-bottom: 5px;
  xwidth: 30%;
  text-align: left;
  margin: 1px;
} 

.wider {
    padding: 0px 20px 0px 20px;
}

span.cell.user {
   text-align:center;
   padding-bottom: 20px;
}

span.cell.twenty {
     width: 0%;
}

.caption {
     display: table-caption;
     text-align: center;
     font-weight: bold;
     font-size: larger;
     width: 100%;
}

.bpadd {
    padding-bottom: 5px;
}

.th {
    font-weight: bold;
    font-size: medium;
    padding-left: 10px;
    padding-right: 10px;
}

.clear {
    clear:both;
}

.twenty {
    padding: 3px;
}
.widmed {
    width: 40px;
} 

.widlarg {
    width: 80px;
}


.centersquare {
    position: relative ;
    height: 100%;
    width: 100%;
    margin:auto;
    left: 0;
    right: 0;
}


.bolded {
    font-size: 18px;
    font-weight: bold;
    
}

.border {
  
}

.align {
    float: left;
}

.buttonscenter {
    position: relative;
    text-align: center; 
    width: 100%;
    margin: auto;
    border: 1px solid red;
    left: 0;
    right: 0;
}