body{background:#5f686f;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;color:#333}.examplefield{display:inline-block;float:left;margin-left:20px;margin-top:20px;margin-bottom:20px;margin-right:20px;width:260px;height:400px;font-size:18px;font-weight:200;line-height:30px;background-color:#eee;border-radius:6px;padding:60px;padding-top:10px}.examplefield h1{font-size:45px;line-height:1;letter-spacing:-1px}.browsehappy{margin:.2em 0;background:#ccc;color:#000;padding:.2em 0}.exampletxt{font-size:14px;line-height:16px;min-height:64px}.example1,.example11,.example12,.example13,.example14,.example15,.example4,.example5,.example6,.example7,.example8,.example9{position:relative;background:#92a3b0;height:150px;width:250px}.example10button,.example11button,.example12button,.example13button,.example14button,.example15button,.example1button,.example2button,.example3button,.example4button,.example5button,.example6button,.example7button,.example8button,.example9button{display:block;background:linear-gradient(to bottom,#7d7e7d 0,#595959 100%);width:230px;height:60px;line-height:60px;text-align:center;font-size:32px;font-weight:bolder;color:#fff;font-family:helvetica;text-shadow:0 -1px 0 #000;transition:all .1s}.example10button:hover,.example11button:hover,.example12button:hover,.example13button:hover,.example14button:hover,.example15button:hover,.example1button:hover,.example2button:hover,.example3button:hover,.example4button:hover,.example5button:hover,.example6button:hover,.example7button:hover,.example8button:hover,.example9button:hover{-webkit-filter:brightness(120%);-moz-filter:brightness(120%);-o-filter:brightness(120%);filter:brightness(120%)}.example10button:active,.example11button:active,.example12button:active,.example13button:active,.example14button:active,.example15button:active,.example1button:active,.example2button:active,.example3button:active,.example4button:active,.example5button:active,.example6button:active,.example7button:active,.example8button:active,.example9button:active{-webkit-filter:brightness(80%);-moz-filter:brightness(80%);-o-filter:brightness(80%);filter:brightness(80%)}.example2{position:relative;background:#92a3b0;height:150px;width:250px;transition:all 1s}.example3{position:relative;background:#92a3b0;height:150px;width:250px;transition:all 1s ease}.example10{position:relative;height:150px;width:250px}.example3extraclass{background:#cacaca;transition:all 1s ease}.colorblue{height:25%}.colorgreen{height:25%;background:green}.colorblack{height:25%}.child{height:50px;background:#92a3b0;color:#fff}.prevOne{height:50%;background:#deccd1}.prevTwo{height:50%;background:#92a3b0}