.dropbtn::before{

  top: -4px;

  left: 10%;

}



.dropbtn::after{

  bottom: -4px;

  right: 10%;

}



.dropbtn:hover::before{

  left: 80%;

}



.dropbtn:hover::after{

  right: 80%;

}

.views {

  overflow: hidden;

  background-color: #333;

  font-family: Arial, Helvetica, sans-serif;

}



.views a {

 align-items: auto;

  font-size: 16px;

  color: white;

  text-align: center;

  margin: 15px;

  padding: 20px;

  text-decoration: none;

  background-color: blue;

}


.dropdown {

  float: left;



}



.dropdown .dropbtns {

  font-size: 16px;  

  border: none;

  outline: none;

  color: white;

  padding: 14px 16px;

  background-color: inherit;

  font: inherit;

  margin: 0;

}



.views a:hover, .dropdown:hover .dropbtns {

  background-color: red;

}



.dropdown-content {

  display: none;

position: relative;

  background-color: #f9f9f9;

  width: 100%;

  left: 0;

  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);

  z-index: 2;

}



.dropdown-content .header {



  padding: 16px;

  color: white;

}



.show {display: block;}