/** * Calendar toolbar */ .availability-calendar-toolbar { padding-bottom: 15px; font-size: 1.2em; font-weight: bold; margin-bottom: 10px; margin-top: 40px; } .availability-calendar-toolbar span:last-child { float: right; } .availability-calendar-toolbar input { padding: 7px 14px; background: #fff; background-image: none; border: 1px solid #BBB; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); font-weight: bold; cursor: pointer; outline: 0; } .availability-calendar-toolbar input:first-child { margin-right: 5px; padding: 8px 14px; border-radius: 3px; } .availability-calendar-toolbar input:nth-child(2) { border-radius: 3px 0 0 3px; } .availability-calendar-toolbar input:last-child { margin-left: -1px; border-radius: 0 3px 3px 0; } .availability-calendar-toolbar input:hover { color: #cecdd2; } .availability-calendar-toolbar input:active { background: #D5D5D5; background-image: linear-gradient(to bottom, #DDD, #C6C6C6); } /** * Calendar table and cells */ .availability-calendar { width: 100%; background: #FFF; table-layout: fixed; border-collapse: collapse; } .availability-calendar th, .availability-calendar td { border: 1px solid #DDD; padding: 5px; } .availability-calendar td { height: 60px; vertical-align: top; text-align: right; } .availability-calendar .ex-month { opacity: 0.4; } .availability-calendar .unavailable { position: relative; } .availability-calendar .unavailable div { position: absolute; top: 50%; left: 0; right: -1px; height: 10px; background: #f49a34; border-top: 1px solid #A33; border-bottom: 1px solid #A33; } .availability-calendar .unavailable:last-child div { right: 0; } .availability-calendar .unavailable .first { left: 51%; border-radius: 3px 0 0 3px; border-left: 1px solid #A33; } .availability-calendar .unavailable .last { right: 51%; border-radius: 0 3px 3px 0; border-right: 1px solid #A33; }