.websearch
{
  padding: 20px;
  text-align: center;
  display: block;
  position: relative;
  width: 100%;
  z-index: 9;
}
.inputsearch
{
    padding: 8px;
    outline: none;
    width: 100%;
    float: none;
    z-index: 18;
}

.searchresults
{

background-color:white;
display: none;
color: grey;
border: 2px solid;
width: 92%;
float: none;
text-align: left;
position: absolute;
z-index: 999;
}  
.searchlist
{
    width: 100%;
}
.searchlist li
{
font-size: medium;
color: grey;  
width: 100%; 
}
.searchlist li:hover
{
font-size: medium;
color:white;  
width: 100%; 
}
.searchlist li a
{
color: grey;
width: 100%;
text-decoration: none;

}
.clicklink
{
    width: 100%;
    padding: 8px;
}
.clicklink:hover,.namelink:hover
{
    background-color:grey ;
    color:white;
    
}
.searchimage
{
  width:20px;
  position:absolute;
}
.namelink
{
  margin-left:20px;
}

@media only screen and (min-width: 600px) {
    /* For tablets: */
    
  }
  
  @media only screen and (min-width: 768px) 
  {
    /* For desktop: */
    .websearch
    {
      padding: 9px;
      text-align: center;
      display: block;
      width: 300px;
      float: right;
      z-index: 9;
    }
    .webinput
    {
      z-index: 9;
      margin-top: -54px;
    }
    .inputsearch
    {
        outline: none;
        z-index:18;
    }
    .searchresults
    {  
    background-color:white;
    display:none;
    color: grey;
    border: 2px solid;
    position: absolute;
    right: 8px;
    width: 282px;
    z-index: 999;
}  
.searchlist li
{
  font-size: medium;
  color: grey;   
}
.searchlist li a
{
    color: grey;
 
}
    
  }