.shells { /* Внешний вид кнопки */
color: #FFF; /* Цвет текста в кнопке */
background: #343a40; /* Фоновый цвет */
padding: 2px; /* Отступ текста от границ - определяет размер кнопки */
font-family: comfortaa,cursive; 
font-size: 0.8571em; /* Размер текста */
border: 1px solid #54bb1a;
margin: 5px 1px;
border-radius: 0.1875rem;
box-shadow: 0px 1px 3px; /* Тень */
padding: 11px 22px;
cursor: pointer;

}
/* Меняем внешний вид при наведении */
.shells:hover { /* Добавляем псевдокласс :hover */
background: rgba(84,178,26,.5);/* Меняем фоновый цвет */
border: 2px solid #54bb1a;
position: relative;
margin-left: 2px;
box-shadow: 0 3px 8px 0 rgb(0 0 0 / 17%);
}