@import "reset.css"; @import url(http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&subset=latin,latin-ext); .no-select { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } body { background: #d5d5d5; } .moka_view { display: inline-block; } .moka_view .mk_default { font-size: 12px; font-family: "Open Sans"; color: #555; text-shadow: 0 1px 0 white; } .moka_view span { font-size: 12px; font-family: "Open Sans"; color: #555; text-shadow: 0 1px 0 white; color: #333; padding: 4px; } .moka_view .mk_control, .moka_view .mk_control:active, .moka_view .mk_control:focus { font-size: 12px; font-family: "Open Sans"; color: #555; text-shadow: 0 1px 0 white; margin: 4px; padding: 3px 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border-top: solid 1px #999999; border-left: solid 1px #999999; border-right: solid 1px #999999; border-bottom: solid 1px #999999; -webkit-box-shadow: 0 0 3px 0 #cccccc; -moz-box-shadow: 0 0 3px 0 #cccccc; box-shadow: 0 0 3px 0 #cccccc; background: white; } .moka_view .mk_control:focus, .moka_view .mk_control:active:focus, .moka_view .mk_control:focus:focus { outline: 0; -webkit-box-shadow: 0 0 2px #0088cc; -moz-box-shadow: 0 0 2px #0088cc; box-shadow: 0 0 2px #0088cc; } .moka_view button { font-size: 12px; font-family: "Open Sans"; color: #555; text-shadow: 0 1px 0 white; margin: 4px; padding: 3px 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border-top: solid 1px #999999; border-left: solid 1px #999999; border-right: solid 1px #999999; border-bottom: solid 1px #999999; -webkit-box-shadow: 0 0 3px 0 #cccccc; -moz-box-shadow: 0 0 3px 0 #cccccc; box-shadow: 0 0 3px 0 #cccccc; background: white; background: #fafafa; background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #dedede), color-stop(1, #ffffff)); background: -ms-linear-gradient(bottom, #dedede, #ffffff); background: -moz-linear-gradient(center bottom, #dedede 0%, #ffffff 100%); background: -o-linear-gradient(#ffffff, #dedede); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dedede', GradientType=0); } .moka_view button:focus { outline: 0; -webkit-box-shadow: 0 0 2px #0088cc; -moz-box-shadow: 0 0 2px #0088cc; box-shadow: 0 0 2px #0088cc; } .moka_view button:active { background: #dedede; -webkit-box-shadow: inset 0 0 3px 0 #aaaaaa; -moz-box-shadow: inset 0 0 3px 0 #aaaaaa; box-shadow: inset 0 0 3px 0 #aaaaaa; } .moka_view input { font-size: 12px; font-family: "Open Sans"; color: #555; text-shadow: 0 1px 0 white; margin: 4px; padding: 3px 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border-top: solid 1px #999999; border-left: solid 1px #999999; border-right: solid 1px #999999; border-bottom: solid 1px #999999; -webkit-box-shadow: 0 0 3px 0 #cccccc; -moz-box-shadow: 0 0 3px 0 #cccccc; box-shadow: 0 0 3px 0 #cccccc; background: white; text-shadow: 0 0 0; } .moka_view input:focus { outline: 0; -webkit-box-shadow: 0 0 2px #0088cc; -moz-box-shadow: 0 0 2px #0088cc; box-shadow: 0 0 2px #0088cc; } .moka_view input:focus { -webkit-box-shadow: inset 0 0 3px 0 #0088cc; -moz-box-shadow: inset 0 0 3px 0 #0088cc; box-shadow: inset 0 0 3px 0 #0088cc; } .moka_view input[type="checkbox"] { position: absolute; left: -999999px; } .moka_view input[type="checkbox"] + label { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding: 0 6px; background: url('../images/moka/check.png') 50% 50% no-repeat; height: 16px; width: 16px; } .moka_view input[type="checkbox"]:focus + label { background-image: url('../images/moka/check-focus.png'); -webkit-box-shadow: 0 0 2px #0088cc; -moz-box-shadow: 0 0 2px #0088cc; box-shadow: 0 0 2px #0088cc; } .moka_view input[type="checkbox"]:checked + label { background-image: url('../images/moka/check-active.png'); }