.dropbtn {
      background-color: #f8f8ff;
      color: #696969;
      padding: 5px;
      font-size: 18px;
      font-weight:bolder;
      border: 5px;
      cursor: pointer;
      min-width:200px;
}
/*
.dropbtn:hover, .dropbtn:focus {
   div class="dropdown">
    <button onclick="showlinks()" class="dropbtn">Dropdown</button>
    <div id="action" class="dropdown-content">
      <a href="#">Link 1</a>
      <a href="#">Link 2</a>
      <a href="#">Link 3</a>
    </div>
    </div>
    background-color: #00ff00;
}
*/
.dropdown {
    float: left;
    position: relative;
    display: inline-block;					    
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color:#faebd6;// #005A9C;
  font-size: 14px;
  font-weight: bold;
  min-width: 250px;//with of dropdown box
  overflow: auto;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  left:205px;
}
.dropdown-content a {
  color: navy;//white;
  padding: 0px 0px;
  text-decoration: underline;
  display: block;
}
.dropdown a:hover {background-color: #0EF}
.show {display:block;}
/*------------------------------------------------------------*/
.drop-btn {
      background-color: #191970;
      color: white;
      padding: 0px;
      font-size: 12px;
      font-weight:bolder;
      border: 0px;
      cursor: pointer;
      min-width:150px;
}

.drop-down {
    float: left;
    position: relative;
    display: inline-block;					    
}
.drop-down-content {
  display: none;
  position: absolute;
  background-color: #005A9C;
  font-size: 12px;
  font-weight: bold;
  min-width: 100%;//with of dropdown box
  overflow: auto;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  left:0;
}
.drop-down-content a {
  color: white;
  padding: 0px 0px;
  text-decoration: underline;
  display: block;
}
.drop-down a:hover {background-color: #0EF}
.show {display:block;}