#list_dates { height: 100px; overflow-x: auto; overflow-y: hidden; margin: 0; border-top: 1px solid #b61924; } #list_dates ul { list-style: none; padding: 0; margin: 0; } #list_dates li div { width: 50px; height: 50px; margin: auto; background: #b61924; color: #fff; padding-top: 15px; border-radius: 1000px; transition: 0.6s ease; margin-top: 15px; } #list_dates li div:hover { background-color: #fff; color: #b61924; border: 1px solid #b61924; } #list_dates .date div { padding-top: 18px; } #list_dates ul li:before { content: ""; width: 4px; height: 4px; position: absolute; left: 50%; margin-left: -2px; background: #b61924; border-radius: 1000px; } .event { padding-top: 15px; padding-bottom: 15px; font-size: 15px; } .event_days:hover { -ms-transform: scale(1.5); -webkit-transform: scale(1.5); transform: scale(1.5); } .event_days { width: 70px; height: 70px; position: absolute; float: left; cursor: pointer; margin-right: 1rem; text-align: center; transition: all 0.4s ease; } .year { font-size: 14px; } .date { font-size: 8px; } .yearSeed { text-align: center; color: #b61924; } .dateSeed { text-align: center; font-weight: 600; } .eventSeed { text-align: justify; margin: 10px 15px 10px 20px; } #backToAnni { background-color: #fff; color: #b61924; border: 1px solid #b61924; margin-bottom: 15px; margin-top: 15px; } #backToAnni:hover { background-color: #b61924; color: #fff; border: 1px solid #b61924; } #lemma_buttons { margin-bottom: 30px; margin-top: -5px; } #lemma_buttons button { color: #30383f; font-size: 15px; } #lemma_buttons button .fa { margin-right: 5px; } .geo-text { font-size: 14px; margin: 6px 0; padding-right: 0; } .geo-text i { margin-left: 3px; } .geo-text:hover { text-decoration: underline; } .highlight { background-color: yellow; font-weight: bold; }