Untitled

 

 

* {    -moz-box-sizing: border-box;    -webkit-box-sizing: border-box;    box-sizing: border-box;}

.a {    color: #FBFBFB;    font-family: sans-serif;    width: 40px;    display: inline-block;    margin: 0;    padding-top: 1px;    height: 20px;    vertical-align: top;    margin: 0 -4px;    text-shadow: 0 1px 0 black;    border-radius: 3px;}

.b {    position: relative;    left: 20px;    width: 100px;    margin: 0 -100px 0 0;    padding: 0;    opacity: 0}

label {    text-align: center;}

#toggle-1 {    -webkit-transition: margin 0.2s ease-in-out;}

#toggleLabel {  background-color: #2d4266;  margin-right: -5px;  border-top-right-radius: 0;  border-bottom-right-radius: 0;}

#toggle-1:checked {    margin-left: -65%}

#switch {    height: 20px;    margin: 0;    padding: 0;    margin: 0;    border: 1px solid #d1d1d1;    background: lightgray;    background-color: #a7a7a7;    background-image: -webkit-gradient(linear, left top, left bottom, from(#a7a7a7), to(#FBFBFB)); /* Saf4+, Chrome */    background-image: -webkit-linear-gradient(top, #a7a7a7, #FBFBFB); /* Chrome 10+, Saf5.1+, iOS 5+ */    background-image:    -moz-linear-gradient(top, #a7a7a7, #FBFBFB); /* FF3.6 */    background-image:     -ms-linear-gradient(top, #a7a7a7, #FBFBFB); /* IE10 */    background-image:      -o-linear-gradient(top, #a7a7a7, #FBFBFB); /* Opera 11.10+ */    background-image:         linear-gradient(to bottom, #a7a7a7, #FBFBFB);}

#switchHolder {    border: 1px solid #d1d1d1;    border-radius: 3px;    background: gray;    width: 80px;    overflow: hidden;    white-space: nowrap;    position: relative;}