body{
background:#cfcfcf;
margin:0px;
font-family:arial;
}

/*------PAGE LAY OUT------*/

.wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 10px;
  grid-auto-rows: minmax(100px, auto);
}
.one {
  grid-column: 1;
  grid-row: 1;
  background:#3a3a3a;
  height:50px;
  padding:10px;
  line-height:50px;
  color:#fff;
  display:block;
}
.two { 
  grid-column: 1;
  grid-row: 2;
  background:#cfcfcf;
  height:calc(100% - 116px);
}
.three {
  grid-column: 1;
  grid-row: 3;
  background:;
  height:30px;
}

/*------END PAGE LAY OUT------*/


/*------FORMS------*/

#textbox{
margin:15px;
padding-top:15px;
padding-bottom:15px;
padding-left:15px;
padding-right:15px;
width:300px;
border:0px;
height:60px;
outline:none;
box-shadow: 0px 0px 30px #666;
font-size:40px;
line-height:35px;
background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(45deg, #ffffff 0%, #e0e0e0 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg, #ffffff 0%,#e0e0e0 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg, #ffffff 0%,#e0e0e0 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e0e0e0',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#textbox:hover{
background:;
box-shadow:inset 0px 0px 30px #666;
}

#textboxerr{
margin:15px;
padding-top:15px;
padding-bottom:15px;
padding-left:15px;
padding-right:15px;
width:300px;
border:0px;
height:60px;
outline:none;
box-shadow: 0px 0px 30px #666;
font-size:40px;
line-height:35px;
background: #ff9999; /* Old browsers */
}

#textboxerr:hover{
background:;
box-shadow:inset 0px 0px 30px #666;
}


/*------END FORMS------*/


/*----SEARCH-----*/

#itemlist{
width:calc(100% - 30px);
border-bottom:1px solid #bfbfbf;
padding:15px;

}

#itemlist:hover{
background:#fff;
}

#addnewbutton{
	 font-size:20px;
	 text-decoration:none;
	 color:#000;
	 background:#94b870;
	 width:calc(100% - 16px);
     border-bottom:1px solid #bfbfbf;
     padding:8px;
}
#addnewbutton:hover{
background:#fff;
}

#bread{
width:calc(100% - 16px);
padding:8px;

}

/*----END SEARCH-----*/


/*-----DISPLAY--------*/

#displayheader{
	background:#8c8c8c;
	color:#fff;
	padding:10px;
}

/* Style the buttons that are used to open and close the accordion panel */
.accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;
    border-bottom:1px solid #bcbcbc;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover {
    background-color: #adadad ;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
    padding: 0 18px;
    background-color:;
    display: none;
    border-bottom:1px solid #000;
}
/*-----------END DISPLAY---------------*/


/*----------FILE DISPLAY-----------*/

#fileitem1{
	 font-size:20px;
	 text-decoration:none;
	 color:#000;
	 background:#adadad;
	 width:calc(100% - 16px);
     border-bottom:1px solid #bfbfbf;
     padding:8px;

}

#fileitem1:hover{
background:#fff;
}


#fileitem2{
	 font-size:20px;
	 text-decoration:none;
	 color:#000;
	 background:;
	 width:calc(100% - 16px);
     border-bottom:1px solid #bfbfbf;
     padding:8px;

}

#fileitem2:hover{
background:#fff;
}


/*----------END FILE DISPLAY-----------*/