webshims-rails 0.4.4 → 0.4.5

data/vendor/assets/javascripts/webshims/shims/range-ui.js

@@ -0,0 +1,66 @@
+(function($){
+	"use strict";
+	var id = 0;
+	
+	
+	var rangeProto = {
+		_create: function(){
+			id++;
+			this.id = 'range'+id;
+			this.thumb = $('<span class="ws-range-thumb" />');
+			this.element.addClass('ws-range').html(this.thumb);
+			this.updateMetrics();
+			this.addDrag();
+		},
+		addDrag: function(){
+			var that = this;
+			var o = this.options;
+			
+			var remove = function(){
+				$(document).off('mousemove', move);
+			};
+			var move = function(e){
+				var nl = l + e.pageX - x;
+				if(nl < 0 && l > 0){
+					nl = 0;
+				} else if(nl > that.maxLeft && l < that.maxLeft) {
+					nl = that.maxLeft;
+				}
+				if(nl >= 0 && nl <= that.maxLeft){
+					x = e.pageX;
+					l = nl;
+					that.thumb.css({left: l});
+				}
+			};
+			var x, l;
+			this.thumb.on({
+				mousedown: function(e){
+					if(!o.readOnly && !o.disabled){
+						x = e.pageX;
+						l = parseFloat(that.thumb.css('left'), 10);
+						$(document).on({
+							mouseup: remove,
+							mousemove: move
+						});
+					}
+				}
+			});
+		},
+		updateMetrics: function(){
+			this.rangeWidth = this.element.innerWidth();
+			this.thumbWidth = this.thumb.outerWidth();
+			this.maxLeft = this.rangeWidth - this.thumbWidth;
+		}
+	};
+	
+	$.fn.rangeUI = function(opts){
+		return this.each(function(){
+			$.webshims.objectCreate(rangeProto, {
+				element: {
+					value: $(this)
+				}
+			}, opts || {});
+		});
+	};
+	console.log('range-ui')
+})(jQuery);

data/vendor/assets/javascripts/webshims/shims/styles/shim.css

@@ -1,689 +1,697 @@
-article,aside,canvas,details,figcaption,figure,
-footer,header,hgroup,menu,nav,section,summary { 
-	display:block;
-}
-audio {
-	display: none;
-	height: 0;
-	width: 0;
-}
-audio.webshims-controls,
-video {
-	display: inline-block;
-	min-height: 45px;
-	min-width: 40px;
-}
-audio[controls] {
-	display: inline-block;
-	min-height: 45px;
-	min-width: 40px;
-}
-video *,
-audio * {
-	display: none !important;
-}
-.flashblocker-assumed {
-	min-height: 20px;
-	min-width: 20px;
-}
-.cue-display {
-	position: absolute !important;
-	margin: 0;
-	padding: 0px !important;
-	max-width: 100% !important;
-	max-height: 100% !important;
-	border: none !important;
-	background: none !important;
-	text-align: center;
-	visibility: hidden;
-	font-family: sans-serif;
-	font-size: 12px;
-	white-space: pre-wrap;
-	overflow: hidden;
-}
-.cue-display b {
-	font-weight: bold;
-}
-.cue-display i {
-	font-style: italic;
-}
-.cue-display u {
-	text-decoration: underline;
-}
-.cue-display span.cue-wrapper {
-	position: absolute;
-	left: 0;
-	bottom: 0;
-	right: 0;
-	display: block;
-	padding: 0;
-	margin: 0;
-	width: 100%;
-	font-size: 160%;
-	color: #fff;
-	visibility: visible !important;
-}
-.cue-display .cue-line {
-	display: block;
-}
-.cue-display span.cue {
-	display: inline-block;
-	padding: 3px 5px;
-	background: #000;
-	background: rgba(0,0,0,0.8);
-	color: #fff;
-}
-.cue-display .description-cues {
-	position: absolute;
-	top: -99px;
-	left: -99px;
-	display: block;
-	width: 5px;
-	height: 5px;
-	overflow: hidden;
-}
-mark {
-	background-color: #ff9;
-	color: #000; 
-	font-style: italic;
-	font-weight: bold;
-}
-
-/* reset */
-.input-range .ui-slider-range,
-.placeholder-box,
-.placeholder-text,
-.input-datetime-local,
-.step-controls,
-.step-controls span,
-.input-range,
-.input-range .ui-slider-handle,
-.input-range .ui-slider-range,
-.details-open-indicator {
-	margin: 0;
-	padding: 0;
-	border: none;
-	width: auto;
-	background: transparent none;
-}
-output {
-	position: relative;
-}
-
-.webshims-visual-hide {
-	position: absolute !important;
-	top: 0 !important;
-	left: 0 !important;
-	visibility: hidden !important;
-	width: 0 !important;
-	height: 0 !important;
-	overflow: hidden !important;
-}
-
-.webshims-visual-hide * {
-	visibility: hidden !important;
-}
-
-/* placeholder */
-.placeholder-box {
-	position: relative;
-	display: inline-block;
-	zoom: 1;
-}
-.polyfill-important .placeholder-box {
-	position: relative !important;
-	display: inline-block !important;
-	margin: 0 !important;
-	padding: 0 !important;
-	width: auto !important;
-	height: auto !important;
-}
-.placeholder-box-input {
-	vertical-align: bottom;
-}
-
-.placeholder-box-left {
-	float: left;
-}
-.placeholder-box-right {
-	float: right;
-}
-
-.placeholder-text {
-	position: absolute;
-	display: none;
-	top: 0;
-	left: 0;
-	overflow: hidden;
-	color: #999;
-	line-height: 1;
-	cursor: text;
-}
-.polyfill-important .placeholder-text { 
-	margin: 0 !important;
-	padding-right: 0 !important;
-	padding-bottom: 0 !important;
-	display: none !important;
-}
-.placeholder-box-input .placeholder-text {
-	white-space: nowrap;
-}
-.placeholder-visible {
-	color: #999;
-}
-.placeholder-visible .placeholder-text,
-.placeholder-text.placeholder-visible {
-	display: inline-block;
-}
-.placeholder-focused.placeholder-visible {
-	color: #ccc;
-}
-.polyfill-important .placeholder-visible .placeholder-text,
-.polyfill-important .placeholder-text.placeholder-visible {
-	display: inline-block !important;
-}
-
-/* datetime-local */
-.input-datetime-local {
-	display: inline-block;
-	zoom: 1;
-	vertical-align: middle;
-}
-.polyfill-important .input-datetime-local {
-	display: inline-block !important;
-	height: auto !important;
-	padding: 0 !important;
-	margin: 0 !important;
-	border: none !important;
-}
-.polyfill-important .input-datetime-local input {
-	display: inline !important;
-}
-.input-datetime-local-date {
-	margin: 0 2px 0 0;
-}
-.polyfill-important .input-datetime-local-date {
-	margin: 0 2px 0 0 !important;
-}
-.input-datetime-local-time {
-	margin: 0 0 0 2px;
-}
-.polyfill-important .input-datetime-local-time {
-	margin: 0 0 0 2px !important;
-}
-img.ui-datepicker-trigger {
-	display: inline;
-	display: inline-block;
-	width: 16px;
-}
-/* spinner control for time, number (usable for date, datetime-local) */
-.has-step-controls {
-	display: inline;
-}
-.polyfill-important .has-step-controls {
-	display: inline !important;
-}
-.step-controls {
-	position: relative;
-	zoom: 1;
-	overflow: hidden;
-	display: inline-block;
-	font-size: 0;
-	vertical-align: middle;
-	vertical-align: top;
-	margin-left: -17px;
-	height: 19px;
-	width: 15px;
-}
-.polyfill-important .step-controls {
-	display: inline-block !important;
-	padding: 0 !important;
-	vertical-align: top !important;
-}
-.step-controls span {
-	position: absolute;
-	display: inline-block;
-	overflow: hidden;
-	margin: 0 !important;
-	padding: 0 !important;
-	width: 15px;
-	height: 9px;
-	cursor: pointer;
-	font-size: 0;
-	line-height: 0;
-	background: url(forms.png) no-repeat 0 0;
-}
-.polyfill-important .step-controls span {
-	display: inline-block !important;
-	margin: 0 !important;
-	padding: 0 !important;
-	font-size: 0 !important;
-}
-
-.step-controls span.step-up {
-	top: 0;
-	background-position: -80px 0;
-}
-.step-controls span.step-up:hover {
-	background-position: -105px 0;
-}
-.step-controls > span.mousepress-ui.step-up {
-	background-position: -105px -20px;
-}
-.step-controls span.step-down {
-	bottom: 0;
-	background-position: -155px 0;
-}
-.step-controls span.step-down:hover {
-	background-position: -180px 0;
-}
-.step-controls > span.mousepress-ui.step-down {
-	background-position: -180px -20px;
-}
-/* disabled or readonly */
-.step-controls.disabled-step-control span {
-	opacity: 0.95;
-	cursor: default;
-}
-.step-controls.disabled-step-control span.step-up {
-	background-position: -130px 0;
-}
-.step-controls.disabled-step-control span.step-down {
-	background-position: -205px 0;
-}
-
-/* range */
-.input-range {
-	position: relative;
-	display: inline-block;
-	vertical-align: middle;
-	margin: 5px 0;
-	zoom: 1;
-	border: none;
-	height: 9px;
-	width: 155px;
-	border-radius: 1px;
-	background: url(forms.png) 0 -43px no-repeat;
-	cursor: pointer;
-	font-size: 0;
-	line-height: 0;
-}
-.polyfill-important .input-range {
-	display: inline-block !important;
-	padding: 0 !important;
-	font-size: 0 !important;
-}
-.input-range .ui-slider-handle {
-	top: 0;
-	position: absolute;
-	display: block;
-	z-index: 4;
-	overflow: hidden;
-	margin: -5px 0 0 -8px;
-	height: 22px;
-	width: 17px;
-	background: url(forms.png) 0 0 no-repeat;
-	cursor: pointer;
-	outline: none;
-	font-size: 0;
-	line-height: 0;
-}
-.input-range .ui-slider-handle:hover,
-.input-range .ui-slider-handle:focus {
-	background-position: -17px 0;
-}
-.input-range .ui-slider-handle.ui-state-active {
-	background-position: -34px 0;
-}
-.input-range.ui-slider-disabled {
-	cursor: default;
-	opacity: 0.95;
-}
-.input-range.ui-slider-disabled .ui-slider-handle {
-	cursor: default;
-	background-position: -51px 0;
-}
-.input-range .ui-slider-range {
-	position: absolute;
-	z-index: 1;
-	overflow: hidden;
-	display: block;
-	background: #b6e2fb;
-}
-.input-range .input-range .ui-slider-range,
-.polyfill-important .input-range .ui-slider-handle {
-	position: absolute !important;
-	display: block !important;
-	padding: 0 !important;
-}
-.input-range.ui-slider-horizontal .ui-slider-range {
-	top: 4px;
-	height: 1px;
-}
-.input-range.ui-slider-horizontal .ui-slider-range-min {
-	left: 0;
-}
-.input-range.ui-slider-horizontal .ui-slider-range-max {
-	right: 0;
-}
-.input-date-datepicker-control {
-	position: absolute;
-	zoom: 1;
-	display: none;
-	background-color: #fff;
-	z-index: 100;
-	overflow: visible;
-	padding: 5px;
-	font-family: "MS Shell Dlg", "Lucida Grande", "Calibri", sans-serif;
-	font-size: 14px;
-	border: 1px solid #333;
-}
-.polyfill-important .input-date-datepicker-control {
-	z-index: 999999999 !important;
-}
-.input-date-datepicker-control .ui-datepicker-header {
-	position: relative;
-	margin: 0 0 3px;
-	padding: 2px 0;
-}
-.input-date-datepicker-control .ui-datepicker-header select {
-    border: 1px solid #333;
-    padding: 1px 2px 2px;
-}
-.input-date-datepicker-control .ui-datepicker-header option {
-	padding-right: 8px;
-}
-.input-date-datepicker-control .ui-datepicker-header .ui-icon {
-	position: absolute;
-	display: block;
-	top: 0.2em;
-	width: 15px;
-	height: 18px;
-	text-indent: -9999em;
-	font-size: 10px;
-	line-height: 0;
-	background: url(forms.png) no-repeat;
-	cursor: pointer;
-}
-.input-date-datepicker-control .ui-datepicker-header .ui-state-disabled .ui-icon {
-	cursor: default;
-}
-.input-date-datepicker-control .ui-datepicker-header .ui-icon-circle-triangle-w {
-	left: 3px;
-	background-position: -235px 3px;
-}
-.input-date-datepicker-control .ui-datepicker-header .ui-state-hover .ui-icon-circle-triangle-w {
-	background-position: -235px -17px;
-}
-.input-date-datepicker-control .ui-datepicker-header .ui-icon-circle-triangle-e {
-	right: 3px;
-	background-position: -248px 3px;
-}
-.input-date-datepicker-control .ui-datepicker-header .ui-state-hover .ui-icon-circle-triangle-e {
-	background-position: -248px -17px;
-}
-.input-date-datepicker-control table {
-	font-size: 100%;
-	border-spacing: 1px;
-}
-.input-date-datepicker-control .ui-datepicker-title {
-	margin: 0 20px;
-}
-.input-date-datepicker-control .ui-datepicker-title,
-.input-date-datepicker-control th {
-	color: #069;
-	text-align: center;
-	font-weight: bold;
-}
-
-.input-date-datepicker-control td,
-.input-date-datepicker-control th {
-	padding: 0 2px;
-	text-align: center;
-	font-weight: normal;
-}
-
-.input-date-datepicker-control td {
-	padding: 0 4px;
-	cursor: pointer;
-	text-align: right;
-	border: 1px solid #fff;
-	border-radius: 2px;
-}
-
-.input-date-datepicker-control td.ui-datepicker-current-day {
-	background-color: #adf;
-	color: #000;
-	border-color: #06c;
-}
-.input-date-datepicker-control td.ui-datepicker-today{
-	border-color: #06c;
-}
-.input-date-datepicker-control td.ui-datepicker-current-day a {
-	color: #000;
-}
-.input-date-datepicker-control td a {
-	color: #000;
-	text-decoration: none;
-}
-
-.input-date-datepicker-control td:hover {
-	background-color: #bef;
-	border-color: #06c;
-}
-.input-date-datepicker-control td.ui-state-disabled {
-	cursor: default;
-	border-color: #fff;
-	color: #bbb;
-	background-color: transparent;
-}
-
-.input-date-datepicker-control .ui-datepicker-buttonpane {
-	margin: 4px 0 0;
-}
-.input-date-datepicker-control .ui-datepicker-cover {
-	display: none; /*sorry for IE5*/
-	display/**/: block; /*sorry for IE5*/
-	position: absolute; /*must have*/
-	z-index: -1; /*must have*/
-	filter: mask(); /*must have*/
-	top: -4px; /*must have*/
-	left: -4px; /*must have*/
-	width: 200px; /*must have*/
-	height: 200px; /*must have*/
-}
-
-datalist {
-	display: none;
-}
-.datalist-polyfill {
-	position: absolute !important;
-	font-family: "Lucida Grande", "MS Shell Dlg", "Calibri", sans-serif;
-	font-size: 100%;
-	top: 0;
-	left: 0;
-	margin: 0;
-	padding: 0;
-	display: none;
-	z-index: 999999999;
-}
-.datalist-polyfill.datalist-visible{
-	display: block;
-}
-.datalist-polyfill div {
-	margin: 0;
-	padding: 0;
-}
-.datalist-polyfill .datalist-box {
-	border: 1px solid #333;
-	max-height: 200px;
-	overflow: hidden;
-	overflow-x: hidden !important;
-	overflow-y: auto;
-}
-.datalist-polyfill ul,
-.datalist-polyfill li {
-	font-size: 100%;
-	list-style: none !important;
-}
-.datalist-polyfill ul {
-	position: static !important;
-	overflow: hidden;
-	margin: 0;
-	padding: 2px 0;
-	height:  auto !important;
-	background-color: #fff;
-	color: #000;
-	
-}
-.datalist-polyfill li {
-	margin: 1px 1px 1px 0;
-	padding: 2px 2px 2px 5px;
-	overflow: hidden;
-	white-space: nowrap;
-	cursor: default;
-	zoom: 1;
-	overflow: hidden;
-}
-.datalist-polyfill .option-label {
-	display: inline-block;
-	float: left;
-	max-width: 100%;
-	text-overflow: ellipsis;
-}
-.datalist-polyfill .option-value {
-	display: none;
-	float: right;
-	text-overflow: ellipsis;
-}
-.datalist-polyfill .hidden-item {
-	display: none !important;
-}
-.datalist-polyfill .active-item {
-	background-color: #39f;
-	color: #fff;
-	cursor: default;
-}
-
-.validity-alert-wrapper {
-	position: absolute !important;
-	overflow: hidden;
-	padding: 0 6px 6px 0;
-	font: 12px/140% sans-serif;
-	z-index: 1000000000;
-	
-}
-.validity-alert {
-	display: inline-block;
-	padding: 8px 0 0;
-}
-.validity-alert .va-box {
-	display: inline-block !important;
-	background: #fafafa;
-	color: #000;
-	border: 1px solid #ccc;
-	padding: 5px;
-	border-radius: 5px;
-	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
-	zoom: 1 !important;
-	min-width: 60px;
-}
-
-.validity-alert .va-arrow {
-	position: absolute;
-	top: 1px;
-	left: 20px;
-	display: block;
-	width: 0;
-	height: 0;
-	border-left: 9px solid transparent;
-	border-right: 9px solid transparent;
-	
-	border-bottom: 7px solid #ccc;
-	border-top: none;
-	zoom: 1;
-	font-size: 0;
-}
-html .validity-alert span.va-arrow,
-html .validity-alert .va-arrow .va-arrow-box{
-	border-left-color: transparent;
-	border-right-color: transparent;
-}
-.polyfill-important .validity-alert span.va-arrow,
-.polyfill-important .validity-alert .va-arrow .va-arrow-box {
-	border-left-color: transparent !important;
-	border-right-color: transparent !important;
-}
-* html .validity-alert .va-arrow {display: none;}
-.validity-alert .va-arrow .va-arrow-box {
-	position: relative;
-	top: 1px;
-	left: -9px;
-	display: block;
-	width: 0;
-	height: 0;
-	border-left: 9px solid transparent;
-	border-right: 9px solid transparent;
-	border-bottom: 7px solid #fafafa;
-	border-top: none;
-}
-
-/* localStorage */
-#swflocalstorageshim-wrapper {
-	position: absolute; 
-	top: -999px; 
-	left: -9999px; 
-	overflow: hidden; 
-	width: 215px; 
-	min-width: 215px !important;
-	z-index: 2147483647;
-}
-#swflocalstorageshim-wrapper .polyfill-exceeded-message {
-	margin: 0 0 5px;
-	padding: 5px;
-	background: #ffd;
-	color: #000;
-	font-size: 13px;
-}
-#swflocalstorageshim-wrapper object {
-	min-height: 138px !important;
-	min-width: 215px !important;
-}
-details {
-	overflow: hidden;
-}
-summary {
-	position: relative;
-}
-.closed-details-child {
-	display: none !important;
-}
-
-.details-open-indicator {
-	margin: -1px 0 0;
-	display: inline-block;
-	width: 16px;
-	height: 11px;
-	background: url(details-arrows.png) no-repeat 0 0;
-	vertical-align: middle;
-}
-.closed-details-summary .details-open-indicator {
-	background-position: 0 -20px;
-}
-.polyfill-important .details-open-indicator {
-	margin: -1px 0 0 !important;
-	padding: 0 !important;
-	border: 0 !important;
-	display: inline-block !important;
-	width: 16px !important;
-	height: 11px !important;
-	background: url(details-arrows.png) no-repeat 0 0 !important;
-	vertical-align: middle !important;
-}
-.polyfill-important .closed-details-summary .details-open-indicator {
-	background-position: 0 -20px !important;
-}
-summary.summary-has-focus {
-	outline: 1px dotted #aaa;
-	outline-offset: -1px;
-}
+article,aside,canvas,details,figcaption,figure,
+footer,header,hgroup,menu,nav,section,summary { 
+	display:block;
+}
+audio {
+	display: none;
+	height: 0;
+	width: 0;
+}
+audio,
+video {
+	overflow: hidden;
+}
+audio.webshims-controls,
+video {
+	display: inline-block;
+	min-height: 45px;
+	min-width: 40px;
+}
+audio[controls] {
+	display: inline-block;
+	min-height: 45px;
+	min-width: 40px;
+}
+video > *,
+audio > * {
+	visibility: hidden;
+}
+.no-swf video > *,
+.no-swf audio > * {
+	visibility: inherit;
+}
+.flashblocker-assumed {
+	min-height: 20px;
+	min-width: 20px;
+}
+.cue-display {
+	position: absolute !important;
+	margin: 0;
+	padding: 0px !important;
+	max-width: 100% !important;
+	max-height: 100% !important;
+	border: none !important;
+	background: none !important;
+	text-align: center;
+	visibility: hidden;
+	font-family: sans-serif;
+	font-size: 12px;
+	white-space: pre-wrap;
+	overflow: hidden;
+}
+.cue-display b {
+	font-weight: bold;
+}
+.cue-display i {
+	font-style: italic;
+}
+.cue-display u {
+	text-decoration: underline;
+}
+.cue-display span.cue-wrapper {
+	position: absolute;
+	left: 0;
+	bottom: 0;
+	right: 0;
+	display: block;
+	padding: 0;
+	margin: 0;
+	width: 100%;
+	font-size: 160%;
+	color: #fff;
+	visibility: visible !important;
+}
+.cue-display .cue-line {
+	display: block;
+}
+.cue-display span.cue {
+	display: inline-block;
+	padding: 3px 5px;
+	background: #000;
+	background: rgba(0,0,0,0.8);
+	color: #fff;
+}
+.cue-display .description-cues {
+	position: absolute;
+	top: -99px;
+	left: -99px;
+	display: block;
+	width: 5px;
+	height: 5px;
+	overflow: hidden;
+}
+mark {
+	background-color: #ff9;
+	color: #000; 
+	font-style: italic;
+	font-weight: bold;
+}
+
+/* reset */
+.input-range .ui-slider-range,
+.placeholder-box,
+.placeholder-text,
+.input-datetime-local,
+.step-controls,
+.step-controls span,
+.input-range,
+.input-range .ui-slider-handle,
+.input-range .ui-slider-range,
+.details-open-indicator {
+	margin: 0;
+	padding: 0;
+	border: none;
+	width: auto;
+	background: transparent none;
+}
+output {
+	position: relative;
+}
+
+.webshims-visual-hide {
+	position: absolute !important;
+	top: 0 !important;
+	left: 0 !important;
+	visibility: hidden !important;
+	width: 0 !important;
+	height: 0 !important;
+	overflow: hidden !important;
+}
+
+.webshims-visual-hide * {
+	visibility: hidden !important;
+}
+
+/* placeholder */
+.placeholder-box {
+	position: relative;
+	display: inline-block;
+	zoom: 1;
+}
+.polyfill-important .placeholder-box {
+	position: relative !important;
+	display: inline-block !important;
+	margin: 0 !important;
+	padding: 0 !important;
+	width: auto !important;
+	height: auto !important;
+}
+.placeholder-box-input {
+	vertical-align: bottom;
+}
+
+.placeholder-box-left {
+	float: left;
+}
+.placeholder-box-right {
+	float: right;
+}
+
+.placeholder-text {
+	position: absolute;
+	display: none;
+	top: 0;
+	left: 0;
+	overflow: hidden;
+	color: #999;
+	line-height: 1;
+	cursor: text;
+}
+.polyfill-important .placeholder-text { 
+	margin: 0 !important;
+	padding-right: 0 !important;
+	padding-bottom: 0 !important;
+	display: none !important;
+}
+.placeholder-box-input .placeholder-text {
+	white-space: nowrap;
+}
+.placeholder-visible {
+	color: #999;
+}
+.placeholder-visible .placeholder-text,
+.placeholder-text.placeholder-visible {
+	display: inline-block;
+}
+.placeholder-focused.placeholder-visible {
+	color: #ccc;
+}
+.polyfill-important .placeholder-visible .placeholder-text,
+.polyfill-important .placeholder-text.placeholder-visible {
+	display: inline-block !important;
+}
+
+/* datetime-local */
+.input-datetime-local {
+	display: inline-block;
+	zoom: 1;
+	vertical-align: middle;
+}
+.polyfill-important .input-datetime-local {
+	display: inline-block !important;
+	height: auto !important;
+	padding: 0 !important;
+	margin: 0 !important;
+	border: none !important;
+}
+.polyfill-important .input-datetime-local input {
+	display: inline !important;
+}
+.input-datetime-local-date {
+	margin: 0 2px 0 0;
+}
+.polyfill-important .input-datetime-local-date {
+	margin: 0 2px 0 0 !important;
+}
+.input-datetime-local-time {
+	margin: 0 0 0 2px;
+}
+.polyfill-important .input-datetime-local-time {
+	margin: 0 0 0 2px !important;
+}
+img.ui-datepicker-trigger {
+	display: inline;
+	display: inline-block;
+	width: 16px;
+}
+/* spinner control for time, number (usable for date, datetime-local) */
+.has-step-controls {
+	display: inline;
+}
+.polyfill-important .has-step-controls {
+	display: inline !important;
+}
+.step-controls {
+	position: relative;
+	zoom: 1;
+	overflow: hidden;
+	display: inline-block;
+	font-size: 0;
+	vertical-align: middle;
+	vertical-align: top;
+	margin-left: -17px;
+	height: 19px;
+	width: 15px;
+}
+.polyfill-important .step-controls {
+	display: inline-block !important;
+	padding: 0 !important;
+	vertical-align: top !important;
+}
+.step-controls span {
+	position: absolute;
+	display: inline-block;
+	overflow: hidden;
+	margin: 0 !important;
+	padding: 0 !important;
+	width: 15px;
+	height: 9px;
+	cursor: pointer;
+	font-size: 0;
+	line-height: 0;
+	background: url(forms.png) no-repeat 0 0;
+}
+.polyfill-important .step-controls span {
+	display: inline-block !important;
+	margin: 0 !important;
+	padding: 0 !important;
+	font-size: 0 !important;
+}
+
+.step-controls span.step-up {
+	top: 0;
+	background-position: -80px 0;
+}
+.step-controls span.step-up:hover {
+	background-position: -105px 0;
+}
+.step-controls > span.mousepress-ui.step-up {
+	background-position: -105px -20px;
+}
+.step-controls span.step-down {
+	bottom: 0;
+	background-position: -155px 0;
+}
+.step-controls span.step-down:hover {
+	background-position: -180px 0;
+}
+.step-controls > span.mousepress-ui.step-down {
+	background-position: -180px -20px;
+}
+/* disabled or readonly */
+.step-controls.disabled-step-control span {
+	opacity: 0.95;
+	cursor: default;
+}
+.step-controls.disabled-step-control span.step-up {
+	background-position: -130px 0;
+}
+.step-controls.disabled-step-control span.step-down {
+	background-position: -205px 0;
+}
+
+/* range */
+.input-range {
+	position: relative;
+	display: inline-block;
+	vertical-align: middle;
+	margin: 5px 0;
+	zoom: 1;
+	border: none;
+	height: 9px;
+	width: 155px;
+	border-radius: 1px;
+	background: url(forms.png) 0 -43px no-repeat;
+	cursor: pointer;
+	font-size: 0;
+	line-height: 0;
+}
+.polyfill-important .input-range {
+	display: inline-block !important;
+	padding: 0 !important;
+	font-size: 0 !important;
+}
+.input-range .ui-slider-handle {
+	top: 0;
+	position: absolute;
+	display: block;
+	z-index: 4;
+	overflow: hidden;
+	margin: -5px 0 0 -8px;
+	height: 22px;
+	width: 17px;
+	background: url(forms.png) 0 0 no-repeat;
+	cursor: pointer;
+	outline: none;
+	font-size: 0;
+	line-height: 0;
+}
+.input-range .ui-slider-handle:hover,
+.input-range .ui-slider-handle:focus {
+	background-position: -17px 0;
+}
+.input-range .ui-slider-handle.ui-state-active {
+	background-position: -34px 0;
+}
+.input-range.ui-slider-disabled {
+	cursor: default;
+	opacity: 0.95;
+}
+.input-range.ui-slider-disabled .ui-slider-handle {
+	cursor: default;
+	background-position: -51px 0;
+}
+.input-range .ui-slider-range {
+	position: absolute;
+	z-index: 1;
+	overflow: hidden;
+	display: block;
+	background: #b6e2fb;
+}
+.input-range .input-range .ui-slider-range,
+.polyfill-important .input-range .ui-slider-handle {
+	position: absolute !important;
+	display: block !important;
+	padding: 0 !important;
+}
+.input-range.ui-slider-horizontal .ui-slider-range {
+	top: 4px;
+	height: 1px;
+}
+.input-range.ui-slider-horizontal .ui-slider-range-min {
+	left: 0;
+}
+.input-range.ui-slider-horizontal .ui-slider-range-max {
+	right: 0;
+}
+.input-date-datepicker-control {
+	position: absolute;
+	zoom: 1;
+	display: none;
+	background-color: #fff;
+	z-index: 100;
+	overflow: visible;
+	padding: 5px;
+	font-family: "MS Shell Dlg", "Lucida Grande", "Calibri", sans-serif;
+	font-size: 14px;
+	border: 1px solid #333;
+}
+.polyfill-important .input-date-datepicker-control {
+	z-index: 999999999 !important;
+}
+.input-date-datepicker-control .ui-datepicker-header {
+	position: relative;
+	margin: 0 0 3px;
+	padding: 2px 0;
+}
+.input-date-datepicker-control .ui-datepicker-header select {
+    border: 1px solid #333;
+    padding: 1px 2px 2px;
+}
+.input-date-datepicker-control .ui-datepicker-header option {
+	padding-right: 8px;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-icon {
+	position: absolute;
+	display: block;
+	top: 0.2em;
+	width: 15px;
+	height: 18px;
+	text-indent: -9999em;
+	font-size: 10px;
+	line-height: 0;
+	background: url(forms.png) no-repeat;
+	cursor: pointer;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-state-disabled .ui-icon {
+	cursor: default;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-icon-circle-triangle-w {
+	left: 3px;
+	background-position: -235px 3px;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-state-hover .ui-icon-circle-triangle-w {
+	background-position: -235px -17px;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-icon-circle-triangle-e {
+	right: 3px;
+	background-position: -248px 3px;
+}
+.input-date-datepicker-control .ui-datepicker-header .ui-state-hover .ui-icon-circle-triangle-e {
+	background-position: -248px -17px;
+}
+.input-date-datepicker-control table {
+	font-size: 100%;
+	border-spacing: 1px;
+}
+.input-date-datepicker-control .ui-datepicker-title {
+	margin: 0 20px;
+}
+.input-date-datepicker-control .ui-datepicker-title,
+.input-date-datepicker-control th {
+	color: #069;
+	text-align: center;
+	font-weight: bold;
+}
+
+.input-date-datepicker-control td,
+.input-date-datepicker-control th {
+	padding: 0 2px;
+	text-align: center;
+	font-weight: normal;
+}
+
+.input-date-datepicker-control td {
+	padding: 0 4px;
+	cursor: pointer;
+	text-align: right;
+	border: 1px solid #fff;
+	border-radius: 2px;
+}
+
+.input-date-datepicker-control td.ui-datepicker-current-day {
+	background-color: #adf;
+	color: #000;
+	border-color: #06c;
+}
+.input-date-datepicker-control td.ui-datepicker-today{
+	border-color: #06c;
+}
+.input-date-datepicker-control td.ui-datepicker-current-day a {
+	color: #000;
+}
+.input-date-datepicker-control td a {
+	color: #000;
+	text-decoration: none;
+}
+
+.input-date-datepicker-control td:hover {
+	background-color: #bef;
+	border-color: #06c;
+}
+.input-date-datepicker-control td.ui-state-disabled {
+	cursor: default;
+	border-color: #fff;
+	color: #bbb;
+	background-color: transparent;
+}
+
+.input-date-datepicker-control .ui-datepicker-buttonpane {
+	margin: 4px 0 0;
+}
+.input-date-datepicker-control .ui-datepicker-cover {
+	display: none; /*sorry for IE5*/
+	display/**/: block; /*sorry for IE5*/
+	position: absolute; /*must have*/
+	z-index: -1; /*must have*/
+	filter: mask(); /*must have*/
+	top: -4px; /*must have*/
+	left: -4px; /*must have*/
+	width: 200px; /*must have*/
+	height: 200px; /*must have*/
+}
+
+datalist {
+	display: none;
+}
+.datalist-polyfill {
+	position: absolute !important;
+	font-family: "Lucida Grande", "MS Shell Dlg", "Calibri", sans-serif;
+	font-size: 100%;
+	top: 0;
+	left: 0;
+	margin: 0;
+	padding: 0;
+	display: none;
+	z-index: 999999999;
+}
+.datalist-polyfill.datalist-visible{
+	display: block;
+}
+.datalist-polyfill div {
+	margin: 0;
+	padding: 0;
+}
+.datalist-polyfill .datalist-box {
+	border: 1px solid #333;
+	max-height: 200px;
+	overflow: hidden;
+	overflow-x: hidden !important;
+	overflow-y: auto;
+}
+.datalist-polyfill ul,
+.datalist-polyfill li {
+	font-size: 100%;
+	list-style: none !important;
+}
+.datalist-polyfill ul {
+	position: static !important;
+	overflow: hidden;
+	margin: 0;
+	padding: 2px 0;
+	height:  auto !important;
+	background-color: #fff;
+	color: #000;
+	
+}
+.datalist-polyfill li {
+	margin: 1px 1px 1px 0;
+	padding: 2px 2px 2px 5px;
+	overflow: hidden;
+	white-space: nowrap;
+	cursor: default;
+	zoom: 1;
+	overflow: hidden;
+}
+.datalist-polyfill .option-label {
+	display: inline-block;
+	float: left;
+	max-width: 100%;
+	text-overflow: ellipsis;
+}
+.datalist-polyfill .option-value {
+	display: none;
+	float: right;
+	text-overflow: ellipsis;
+}
+.datalist-polyfill .hidden-item {
+	display: none !important;
+}
+.datalist-polyfill .active-item {
+	background-color: #39f;
+	color: #fff;
+	cursor: default;
+}
+
+.validity-alert-wrapper {
+	position: absolute !important;
+	overflow: hidden;
+	padding: 0 6px 6px 0;
+	font: 12px/140% sans-serif;
+	z-index: 1000000000;
+	
+}
+.validity-alert {
+	display: inline-block;
+	padding: 8px 0 0;
+}
+.validity-alert .va-box {
+	display: inline-block !important;
+	background: #fafafa;
+	color: #000;
+	border: 1px solid #ccc;
+	padding: 5px;
+	border-radius: 5px;
+	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
+	zoom: 1 !important;
+	min-width: 60px;
+}
+
+.validity-alert .va-arrow {
+	position: absolute;
+	top: 1px;
+	left: 20px;
+	display: block;
+	width: 0;
+	height: 0;
+	border-left: 9px solid transparent;
+	border-right: 9px solid transparent;
+	
+	border-bottom: 7px solid #ccc;
+	border-top: none;
+	zoom: 1;
+	font-size: 0;
+}
+html .validity-alert span.va-arrow,
+html .validity-alert .va-arrow .va-arrow-box{
+	border-left-color: transparent;
+	border-right-color: transparent;
+}
+.polyfill-important .validity-alert span.va-arrow,
+.polyfill-important .validity-alert .va-arrow .va-arrow-box {
+	border-left-color: transparent !important;
+	border-right-color: transparent !important;
+}
+* html .validity-alert .va-arrow {display: none;}
+.validity-alert .va-arrow .va-arrow-box {
+	position: relative;
+	top: 1px;
+	left: -9px;
+	display: block;
+	width: 0;
+	height: 0;
+	border-left: 9px solid transparent;
+	border-right: 9px solid transparent;
+	border-bottom: 7px solid #fafafa;
+	border-top: none;
+}
+
+/* localStorage */
+#swflocalstorageshim-wrapper {
+	position: absolute; 
+	top: -999px; 
+	left: -9999px; 
+	overflow: hidden; 
+	width: 215px; 
+	min-width: 215px !important;
+	z-index: 2147483647;
+}
+#swflocalstorageshim-wrapper .polyfill-exceeded-message {
+	margin: 0 0 5px;
+	padding: 5px;
+	background: #ffd;
+	color: #000;
+	font-size: 13px;
+}
+#swflocalstorageshim-wrapper object {
+	min-height: 138px !important;
+	min-width: 215px !important;
+}
+details {
+	overflow: hidden;
+}
+summary {
+	position: relative;
+}
+.closed-details-child {
+	display: none !important;
+}
+
+.details-open-indicator {
+	margin: -1px 0 0;
+	display: inline-block;
+	width: 16px;
+	height: 11px;
+	background: url(details-arrows.png) no-repeat 0 0;
+	vertical-align: middle;
+}
+.closed-details-summary .details-open-indicator {
+	background-position: 0 -20px;
+}
+.polyfill-important .details-open-indicator {
+	margin: -1px 0 0 !important;
+	padding: 0 !important;
+	border: 0 !important;
+	display: inline-block !important;
+	width: 16px !important;
+	height: 11px !important;
+	background: url(details-arrows.png) no-repeat 0 0 !important;
+	vertical-align: middle !important;
+}
+.polyfill-important .closed-details-summary .details-open-indicator {
+	background-position: 0 -20px !important;
+}
+summary.summary-has-focus {
+	outline: 1px dotted #aaa;
+	outline-offset: -1px;
+}