.calendar-archives { position: relative; width: 100%; } .calendar-archives * { -webkit-box-sizing: border-box !important; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box !important; /* Firefox, other Gecko */ box-sizing: border-box !important; } .calendar-archives .archives-years { position: relative; overflow: hidden; } .calendar-archives .cal-nav { position: relative; width: 98%; height: 26px; margin-bottom: 5px; } .calendar-archives .cal-nav * { line-height: 26px; text-decoration: none!important; } .calendar-archives .cal-nav .prev-year, .calendar-archives .cal-nav .next-year { display: block; position: absolute; width: 26px; font-size: 18px; text-align: center; color: #757575; } .calendar-archives .cal-nav .prev-year:hover, .calendar-archives .cal-nav .next-year:hover { color: #21759b; } .calendar-archives .cal-nav .prev-year.disabled, .calendar-archives .cal-nav .next-year.disabled { opacity: .4; cursor: default; text-decoration: none; } .calendar-archives .cal-nav .prev-year.disabled:hover, .calendar-archives .cal-nav .next-year.disabled:hover { background: none; color: #757575; } .calendar-archives .cal-nav .prev-year { left: 0; } .calendar-archives .cal-nav .next-year { right: 0; } .calendar-archives .cal-nav .year-nav { position: absolute; width: 100px; left: 50%; margin-left: -50px; text-align: center; } .calendar-archives .cal-nav .year-nav:hover .arrow-down { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); background-color: #e6e6e6; background-repeat: repeat-x; background-image: -moz-linear-gradient(top, #f4f4f4, #e6e6e6); background-image: -ms-linear-gradient(top, #f4f4f4, #e6e6e6); background-image: -webkit-linear-gradient(top, #f4f4f4, #e6e6e6); background-image: -o-linear-gradient(top, #f4f4f4, #e6e6e6); background-image: linear-gradient(top, #f4f4f4, #e6e6e6); border: 1px solid #d2d2d2; } .calendar-archives .cal-nav .year-nav a.year-title { display: block; width: 100%; } .calendar-archives .cal-nav .year-nav a.year-title:hover { color: #21759b!important; } .calendar-archives .cal-nav .year-nav a.year-title:visited { color: #757575; } .calendar-archives .cal-nav .year-nav .arrow-down { color: #757575; position: absolute; width: 20px; right: 0; top: 0; cursor: pointer; font-size: 10px; border: 1px solid #fff; font-family: Verdana, Arial, Helvetica, sans-serif; } .calendar-archives .cal-nav .year-nav .arrow-down:hover { color: #5e5e5e; background-color: #ebebeb; background-repeat: repeat-x; background-image: -moz-linear-gradient(top, #f9f9f9, #ebebeb); background-image: -ms-linear-gradient(top, #f9f9f9, #ebebeb); background-image: -webkit-linear-gradient(top, #f9f9f9, #ebebeb); background-image: -o-linear-gradient(top, #f9f9f9, #ebebeb); background-image: linear-gradient(top, #f9f9f9, #ebebeb); } .calendar-archives .cal-nav .year-nav .year-select { position: absolute; z-index: 99; display: none; width: 100%; background: #F0F0F0; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4); overflow: hidden; top: 0; } .calendar-archives .cal-nav .year-nav .year-select .year { display: block; color: #757575; } .calendar-archives .cal-nav .year-nav .year-select .year:hover { background: #21759b; cursor: pointer; color: #fff; } .calendar-archives .cal-nav .year-nav .year-select .year.selected { color: #757575; background: #fff; } .calendar-archives .archives-years { overflow: hidden; } .calendar-archives .archives-years .year { position: absolute; top: 0; left: 0; margin-left: -100%; width: 100%; z-index: 0; background: #fff; padding-left: 2px; } .calendar-archives .archives-years .year.last { position: relative; } .calendar-archives .archives-years .year.current { margin-left: 0; z-index: 1; } .calendar-archives .archives-years .year .month { float: left; width: 22%; margin: 0 3% 3% 0; height: 50px; overflow: hidden; background: #757575; position: relative; border: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); } .calendar-archives .archives-years .year .month a { display: block; margin: 0; padding: 0; width: 100%; height: 100%; color: #FFF!important; } .calendar-archives .archives-years .year .month .month-name { text-transform: capitalize; font-size: 16px; font-weight: 400; display: block; position: absolute; top: 6px; left: 8px; } .calendar-archives .archives-years .year .month .postcount { display: block; position: absolute; bottom: 6px; right: 6px; } .calendar-archives .archives-years .year .month .postcount .count-text { font-size: 9px; } .calendar-archives .archives-years .year .month:hover { background: #21759B; } .calendar-archives .archives-years .year .month.empty { color: #ccc; background: #f0f0f0; } .calendar-archives .archives-years .year .month.last { border-right: 0; }