.SOGoTimePickerMenu { position: absolute; z-index: 1000; background-color: #fff; border: 1px solid #ccc; border: 1px solid rgba(0, 0, 0, 0.2); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; *border-right-width: 2px; *border-bottom-width: 2px; color: #000; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 11px; line-height: 18px; text-align: center; } .SOGoTimePickerMenu > DIV { padding: 5px; } .SOGoTimePickerMenu.bellow > DIV:before { content: ''; display: inline-block; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid #ccc; border-bottom-color: rgba(0, 0, 0, 0.2); position: absolute; top: -7px; left: 6px; left: 35px; } .SOGoTimePickerMenu.bellow > DIV:after { content: ''; display: inline-block; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #ffffff; position: absolute; top: -6px; left: 7px; left: 36px; } .SOGoTimePickerMenu.above > DIV:before { content: ''; display: inline-block; border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 7px solid #ccc; border-top-color: rgba(0, 0, 0, 0.2); position: absolute; bottom: -7px; right: 35px; } .SOGoTimePickerMenu.above > DIV:after { content: ''; display: inline-block; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #ffffff; position: absolute; bottom: -6px; right: 36px; } .SOGoTimePickerMenu .hours, .SOGoTimePickerMenu .minutes, .SOGoTimePickerMenu .button { clear: both; /* Opera fix */ } .SOGoTimePickerMenu SPAN DIV { padding: 2px; } .SOGoTimePickerMenu DIV.hours SPAN { float: left; width: 25px; } .SOGoTimePickerMenu DIV.hours SPAN DIV { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .SOGoTimePickerMenu DIV.min5 SPAN { float: left; width: 50px; } .SOGoTimePickerMenu DIV.min1 SPAN { float: left; width: 60px; } .SOGoTimePickerMenu DIV.minutes SPAN DIV { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .SOGoTimePickerMenu DIV.hours SPAN DIV:hover, .SOGoTimePickerMenu DIV.minutes SPAN DIV:hover { background-color: #eee; color: #333; cursor: pointer; } .SOGoTimePickerMenu DIV.hours SPAN DIV.selected, .SOGoTimePickerMenu DIV.minutes SPAN DIV.selected, .SOGoTimePickerMenu DIV.hours SPAN DIV.selected:hover, .SOGoTimePickerMenu DIV.minutes SPAN DIV.selected:hover { background-color: #006dcc; background-image: -moz-linear-gradient(top, #0088cc, #0044cc); background-image: -ms-linear-gradient(top, #0088cc, #0044cc); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc)); background-image: -webkit-linear-gradient(top, #0088cc, #0044cc); background-image: -o-linear-gradient(top, #0088cc, #0044cc); background-image: linear-gradient(top, #0088cc, #0044cc); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0); border-color: #0044cc #0044cc #002a80; border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25); filter: progid:dximagetransform.microsoft.gradient(enabled=false); color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); } .SOGoTimePickerMenu HR { clear: both; height: 0px; margin: 0px; padding: 0px; color: #fff; border: 0px; }