[type=radio],[type=checkbox]{position:absolute;opacity:0}
[type=radio]+label,[type=checkbox]+label{position:relative;z-index:0;padding-left:1.2em}
[type=radio]+label:before,[type=checkbox]+label:before{content:"";position:absolute;left:1px;top:1px;border:solid 1px #666;box-shadow:inset 0 2px 3px -1px #fff,inset 0 -2px 3px -3px #000;z-index:-1;background:#aaa url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAANCAYAAABo1wTyAAAAAXNSR0IArs4c6QAAAC9JREFUCNc9ySEOACEQBLBm/v9JMJhTh0CQsDhck6qqFvzBF4ygB+1pvJ3BCnZwLi10DxeJ6TdLAAAAAElFTkSuQmCC') 0 -1px repeat-x}

@media(min-width:1px){
[type=radio]+label:before,[type=checkbox]+label:before{width:12px;height:12px}
[type=radio]+label:after{left:4px;top:4px;width:6px;height:6px}
[type=checkbox]+label:after{left:5px;top:1px;width:4px;height:9px}
}
@media(min-width:1100px){
[type=radio]+label:before,[type=checkbox]+label:before{width:14px;height:14px}
[type=radio]+label:after{left:5px;top:5px;width:6px;height:6px}
[type=checkbox]+label:after{left:6px;top:1px;width:5px;height:10px}
}
[type=radio]+label:before{border-radius:100%}
[type=checkbox]+label:before{border-radius:3px}
[type=radio]+label:hover:before,[type=checkbox]+label:hover:before{opacity:.7}
[type=radio]+label:after,[type=checkbox]+label:after{content:"";position:absolute;display:none;z-index:-1}
[type=radio]:checked+label:after,[type=checkbox]:checked+label:after{display:block}
[type=radio]+label:after{background:#fff;border:solid 1px #999;border-radius:100%}
[type=checkbox]+label:after{border:solid #fff;border-width:0 2px 1px 0;transform:rotate(45deg);box-shadow:1px 1px 1px rgba(0,0,0,.7)}
[type=radio]:disabled+label,[type=checkbox]:disabled+label,[type=radio]:disabled+label:before,[type=checkbox]:disabled+label:before,[type=checkbox]:disabled+label:after{opacity:.7!important}
[type=checkbox]:focus+label:before,[type=radio]:focus+label:before{background-color:#555}

.form{position:relative;width:26em;margin:auto}
form *{vertical-align:middle}
fieldset{position:relative;margin:1em 0;padding:.5em}
#comment{margin-bottom:0;padding-top:1em}
.scroll-textarea{border:solid 1px}
.scroll-textarea >.scroll-content{height:8em}
/*textarea{}*/
#action{margin:0;padding:0 .5em}
legend{position:absolute;top:-.7em;left:.5em;width:auto;line-height:1}
form dl,form p{position:relative;margin:0}
form dt,form dd{position:relative;display:inline-block;padding:0;margin:.2em 0}
.radio dd,.check dd{padding-bottom:.2em;margin:0}
[type=submit],[type=reset],[type=button],[type=password],[type=search],[type=url],[type=tel],button{padding:.1em .3em}
[type=submit]{margin-right:.2em}
.form select,.form [type=text],.form [type=email],.sbox{width:15em;height:1.6em}
label,.form dt{width:7em;text-align:right}
.radio dt,.radio label,.check dt,.check label,.sbox label,.multicheck label{width:auto;text-align:left}
#browser,#firstname,#lastname,#email,#selected,.select{padding-left:.3em}
/*button,select{text-transform:none}*/
input,button,.range,.selectbox,.sbox{line-height:normal}
input,.roto{margin-bottom:.2em}
[type=search],[type=submit],[type=reset]{margin-bottom:0}
.form hr{margin:.5em auto}

/**/
.selectbox{display:inline-block;position:relative;z-index:0}
.selectbox select{position:relative;border:0;z-index:9}/*.styled*/
.select{position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;padding-right:1.1em;line-height:1.6em;border:solid 1px;overflow:hidden;z-index:0}

/**/
.selectbox:before,.sbox:before,.selectbox:after,.sbox:after{content:"";position:absolute;top:0;bottom:0;right:0;width:calc(1em + 1px)}
.selectbox:before,.sbox:before{background:#888 url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAANCAYAAABo1wTyAAAAAXNSR0IArs4c6QAAADNJREFUCNc9yjESQEAABLDc/v81PmVuKCgUClYndbRdgis403bLGGMGazCDPTj+dwdP8H64eRIXQMlTBQAAAABJRU5ErkJggg==') repeat-x;box-shadow:inset 0 .2em .5em #fff;border:solid 1px;z-index:2}
.selectbox:after,.sbox:after{background:url(img/down.png) no-repeat center;z-index:4}
.sbox span{display:block;font-style:italic;padding-left:.2em;text-shadow:none}

/**/
dd .scroll{height:100%}

#selection{position:relative;z-index:99}/*use different ID-s with reverse indexes (later=smaller index)*/
#selected{position:relative;z-index:-1;margin:0}/*change ID in other #selection*/
.shold.scroll{position:absolute;left:0;top:1.7em;right:0;height:8em;background:#fff;box-shadow:2px 2px 5px rgba(0,0,0,.7);border:solid 1px;visibility:hidden}
.shold.scroll.scroll-content{top:0}
.shold.scroll.scroll-content.scroll-scrolly_visible{left:-1em}
.sbox:focus .shold.scroll{visibility:visible}
.shold [type=radio]+label{display:block;padding:1px .4em;line-height:1.2}
.shold [type=radio]+label:before,.shold [type=radio]:checked+label:after{display:none}
.shold [type=radio]+label:hover,.shold [type=radio]:checked+label{background:#999;color:#fff}
.shold:hover [type=radio]:checked+label{background:transparent;color:inherit;cursor:default}
.shold:hover [type=radio]:checked+label:hover{background:#999;color:#fff}

/**/
.multicheck dd{height:6em;background:#fff;border:solid 1px}
.multicheck .inner{padding:.3em;line-height:1.2}
.multicheck [type=checkbox]+label{display:block;padding-right:1.4em}
.multicheck [type=checkbox]+label:hover{background-color:#999;color:#fff}
.multicheck .scroll-content.scroll-scrolly_visible{left:0;margin-left:0}

/**/
#upload{margin:.5em 0}
#upload *{float:left}
#upload:after{content:"";display:block;clear:both}
#upload div{position:relative;background:#fff;border:solid 1px;margin:0 .2em;overflow:hidden}
#upload [type=file]{position:absolute;right:0;top:0;bottom:0;cursor:pointer;opacity:0}
#fileName,.file_input{margin:0!important;padding:.1em .2em}
#fileName{pointer-events:none}
.file_input{background:none;border:0;box-shadow:none}

#search{margin-bottom:.5em}
output{display:inline-block;line-height:1.4;border:solid 1px;padding:0 .2em}

*,::-webkit-slider-thumb{-webkit-appearance:none}

.range,[type=range],output{height:1.4em}
.range{position:relative;display:inline-block;vertical-align:bottom}
[type=range]{width:10em}
.roto{width:1.4em/*calc(1.4em + border)*/;height:10em/*calc(10em + border)*/}
.rotated{transform:rotate(-90deg)translate(-4.29em,-4.29em)/*width-height/2 ?*/}

::-moz-range-track{height:.2em;background:linear-gradient(#eee,#999);border:solid;border-width:1px 0}
::-ms-track{height:.2em;background:linear-gradient(#eee,#999);border:solid;border-width:1px 0}
::-webkit-slider-runnable-track{height:.3em;margin-top:.1ex;background:linear-gradient(#eee,#999);border:solid;border-width:1px 0}

::-moz-range-thumb{background:linear-gradient(#ddd,#000);width:.5em;height:1em;border:solid 1px;box-shadow:inset 0 .2em .6em #fff;border-radius:0}
::-ms-thumb{background:linear-gradient(#ddd,#000);width:.5em;height:1.2em;border:solid 1px;box-shadow:inset 0 .2em .6em #fff}
::-webkit-slider-thumb{background:linear-gradient(#ddd,#000);width:.62em;height:1.1em;margin-top:-.48em;border:solid 1px;box-shadow:inset 0 .2em .6em #fff}

.range:before{content:"";position:absolute;left:.3em;right:.37em;bottom:100%;height:.3em;background:linear-gradient(90deg,currentColor 1px,transparent 0);background-size:10% .3em;border-right:solid 1px}
.range.roto:before{right:100%;left:auto;top:.3em;bottom:.37em;width:.3em;height:auto;background:linear-gradient(currentColor 1px,transparent 1px);background-size:.3em 10%;border-bottom:solid 1px;border-right:0}
@media(-webkit-min-device-pixel-ratio:0){.range:before{background-size:10.1352%/*calc(9.46% + 1px)*/ .3em}.range.roto:before{background-size:.3em 10.1352%/*calc(9.46% + 1px)*/}}/*rounding errors*/

.bubble{margin-top:1.8em;margin-left:1em}
.bubble:before{display:none}
.bubble [type=range]{border-color:transparent;background:0;box-shadow:none}
.bubble output{position:absolute;bottom:125%;left:0;width:2.4em;padding:0;background:linear-gradient(#444,#999);text-align:center;color:white;border-radius:.6em;margin-left:calc(-.95em + 2px)/*outputWidth/2-thumbWidth/2+rangeBorder*/}
.bubble output:before{content:"";position:absolute;top:100%;left:50%;border-top:10px solid #999;border-left:5px solid transparent;border-right:5px solid transparent;margin-left:-5px;margin-top:-2px;z-index:-1}

.prg{position:relative}
#progCtrl{width:9.4em;margin-left:.25em;border:solid 1px}
#rangeCtrl{position:absolute;top:0;left:0;border:0;box-shadow:none;background:0}

progress,meter{height:1.2em;background:#fff;border:solid 1px;vertical-align:bottom}
::-webkit-progress-bar,::-webkit-meter-bar{background:none}

::-moz-progress-bar{background:linear-gradient(#999,#ddd,#999);border-right:solid 1px}
::-ms-fill{background:linear-gradient(#999,#ddd,#999);border-right:solid 1px}
::-webkit-progress-inner-element{}
::-webkit-progress-value{background:linear-gradient(#999,#ddd,#999);border-right:solid 1px}


::-moz-meter-bar{
/*Block styles that would change the type of frame we construct*/
/*display:inline-block!important;
float:none!important;
position:static!important;
overflow:visible!important;
-moz-appearance:meterchunk;
height:100%;
width:100%;*/
}
/*:-moz-meter-optimum::-moz-meter-bar{background:linear-gradient(#fff,green);border-right:solid 1px}
:-moz-meter-sub-optimum::-moz-meter-bar{background:linear-gradient(#fff,orange);border-right:solid 1px}
:-moz-meter-sub-sub-optimum::-moz-meter-bar{background:linear-gradient(#fff,red);border-right:solid 1px}

::-webkit-meter-optimum-value{background:linear-gradient(#fff,green);border-right:solid 1px}
::-webkit-meter-suboptimum-value{background:linear-gradient(#fff,orange);border-right:solid 1px}
::-webkit-meter-even-less-good-value{background:linear-gradient(#fff,red);border-right:solid 1px}*/

[type=date],[type=datetime-local],[type=month],[type=week],[type=time],[type=number],[type=datetime]/*,[type=color]*/{height:1.4em;padding-left:.3em}
[type=number]{-moz-appearance:textfield}
[type=color]{width:2em;height:1.4em;padding:.2em}
@media(-webkit-min-device-pixel-ratio:0){[type=color]{padding:.02em .1em}}
/*button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}*/
/*[type=search]{-webkit-appearance:textfield}*/
/*::-webkit-search-cancel-button,::-webkit-search-decoration{-webkit-appearance:none}*/

::-webkit-inner-spin-button{position:relative;height:100%;visibility:hidden}
::-webkit-inner-spin-button:before,::-webkit-inner-spin-button:after {content:"^";position:absolute;left:0;right:0;height:100%;text-align:center;line-height:1;visibility:visible}
::-webkit-inner-spin-button:after{-webkit-transform:rotate(180deg);border-right:solid 1px}
::-webkit-inner-spin-button:before{background:linear-gradient(#eee 0%,#999 50%,#eee 50%,#999 100%);border-left:solid 1px}

::-webkit-calendar-picker-indicator{position:relative;height:100%;visibility:hidden}
::-webkit-calendar-picker-indicator:before{content:"";position:absolute;left:0;right:0;visibility:visible;height:100%;background:#999 url(img/hl1.png) repeat-x;box-shadow:inset 0 0 .6em rgba(255,255,255,.9);border-left:solid 1px}
::-webkit-calendar-picker-indicator:after{content:"";position:absolute;top:50%;right:50%;visibility:visible;border:solid;border-width:.6em .3em 0;border-color:currentColor transparent transparent;margin:-.22em -.3em 0 0}
.data ::-webkit-calendar-picker-indicator:before{display:none}
::-webkit-clear-button{position:relative;-webkit-appearance:listitem;width:1em;height:100%}
::-webkit-clear-button:before{content:"x";position:absolute;width:100%;height:100%;line-height:1.2em;text-align:center}

/*::-webkit-datetime-edit-year-field[aria-valuetext=blank],::-webkit-datetime-edit-year-field:not([aria-valuenow]){color:red}*/
::-webkit-datetime-edit-ampm-field:focus,::-webkit-datetime-edit-day-field:focus,::-webkit-datetime-edit-hour-field:focus,::-webkit-datetime-edit-millisecond-field:focus,::-webkit-datetime-edit-minute-field:focus,::-webkit-datetime-edit-month-field:focus,::-webkit-datetime-edit-second-field:focus,::-webkit-datetime-edit-week-field:focus,::-webkit-datetime-edit-year-field:focus{background:0;color:inherit;box-shadow:inset 0 0 1em -.2em}

/*Color*/
::-webkit-color-swatch{position:relative/*;visibility:hidden*/}
/*::-webkit-color-swatch:before{content:"";position:absolute;top:0;left:0;bottom:0;right:0;visibility:visible;background:blue}*/
/*::-webkit-color-swatch-wrapper{border:solid 1px red}*/
/*::-webkit-color-swatch:before{background:inherit;border:solid 1px}*/
/***/

::-webkit-datetime-edit{/*background:blue;*//*border:solid 1px #000*//*color:#fff*/}
/*::-webkit-datetime-edit-fields-wrapper{background:red}*/
/*::-webkit-datetime-edit-text{color:#fff;padding:0 .5em}*/
/*::-webkit-datetime-edit-month-field{color:blue}
::-webkit-datetime-edit-day-field{color:green}
::-webkit-datetime-edit-year-field{color:purple}*/

/*Remove the rounded corners*/
/*input[type=search]{-webkit-appearance:none}*/
/*Hide the cancel button*/
/*::-webkit-search-cancel-button{-webkit-appearance:none}*/

::-webkit-search-cancel-button{position:relative}
/*::-webkit-search-cancel-button:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:red}*/
/*input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;width:10px;height:10px;background:red}*/

/*Hide the magnifying glass*/
/*::-webkit-search-results-button{-webkit-appearance:none}*/

/*Trident*/
::-ms-fill-lower{background:orange}
::-ms-fill-upper{background:green}
/*::-ms-thumb{background:red}*/
::-ms-ticks-after{display:block;color:blue}
::-ms-ticks-before{display:block;color:black}
/*::-ms-track{padding:4px 0}*/
::-ms-tooltip{display:none/*display and visibility only*/}