/*------------------------------------------------------------ #Reset & Basics (Inspired by E. Meyers) --------------------------------------------------------------*/ #pixel_box_1 {position: absolute;top: 0px;left: 0px; width:42px; height:42px;z-index: 5; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); } #pixel_box_2 {position: absolute;top: 30px;left: 30px; width:42px; height:42px;z-index: 5; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); } #pixel_box_3 {position: absolute;top: 0px;left: 60px; width:42px; height:42px;z-index: 5; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); } #pixel_box{ position:absolute; border-radius:50%; width:100px; height:100px; z-index:11; top:50%; left:50%; margin-left: -50px; margin-top: -38px; } .pixel_1{ background-color:#878d1c; width:5px; height:5px; } .pixel_2{ background-color:#def21c; width:5px; height:5px; } .pixel_3{ background-color:#b1b91f; width:5px; height:5px; } #pixel_1_1{position: absolute;top: 0px;left: 0px;display:block;} #pixel_1_2{position: absolute;top: 0px;left: 6px;display:block;} #pixel_1_3{position: absolute;top: 0px;left: 12px;display:block;} #pixel_1_4{position: absolute;top: 0px;left: 18px;display:block;} #pixel_1_5{position: absolute;top: 0px;left: 24px;display:block;} #pixel_1_6{position: absolute;top: 0px;left: 30px;display:block;} #pixel_1_7{position: absolute;top: 0px;left: 36px;display:block;} #pixel_1_8{position: absolute;top: 6px;left: 0px;display:block;} #pixel_1_9{position: absolute;top: 6px;left: 6px;display:block;} #pixel_1_10{position: absolute;top: 6px;left: 12px;display:block;} #pixel_1_11{position: absolute;top: 6px;left: 18px;display:block;} #pixel_1_12{position: absolute;top: 6px;left: 24px;display:block;} #pixel_1_13{position: absolute;top: 6px;left: 30px;display:block;} #pixel_1_14{position: absolute;top: 6px;left: 36px;display:block;} #pixel_1_15{position: absolute;top: 12px;left: 0px;display:block;} #pixel_1_16{position: absolute;top: 12px;left: 6px;display:block;} #pixel_1_17{position: absolute;top: 12px;left: 12px;display:block;} #pixel_1_18{position: absolute;top: 12px;left: 18px;display:block;} #pixel_1_19{position: absolute;top: 12px;left: 24px;display:block;} #pixel_1_20{position: absolute;top: 12px;left: 30px;display:block;} #pixel_1_21{position: absolute;top: 12px;left: 36px;display:block;} #pixel_1_22{position: absolute;top: 18px;left: 0px;display:block;} #pixel_1_23{position: absolute;top: 18px;left: 6px;display:block;} #pixel_1_24{position: absolute;top: 18px;left: 12px;display:block;} #pixel_1_25{position: absolute;top: 18px;left: 18px;display:block;} #pixel_1_26{position: absolute;top: 18px;left: 24px;display:block;} #pixel_1_27{position: absolute;top: 18px;left: 30px;display:block;} #pixel_1_28{position: absolute;top: 18px;left: 36px;display:block;} #pixel_1_29{position: absolute;top: 24px;left: 0px;display:block;} #pixel_1_30{position: absolute;top: 24px;left: 6px;display:block;} #pixel_1_31{position: absolute;top: 24px;left: 12px;display:block;} #pixel_1_32{position: absolute;top: 24px;left: 18px;display:block;} #pixel_1_33{position: absolute;top: 24px;left: 24px;display:block;} #pixel_1_34{position: absolute;top: 24px;left: 30px;display:block;} #pixel_1_35{position: absolute;top: 24px;left: 36px;display:block;} #pixel_1_36{position: absolute;top: 30px;left: 0px;display:block;} #pixel_1_37{position: absolute;top: 30px;left: 6px;display:block;} #pixel_1_38{position: absolute;top: 30px;left: 12px;display:block;} #pixel_1_39{position: absolute;top: 30px;left: 18px;display:block;} #pixel_1_40{position: absolute;top: 30px;left: 24px;display:block;} #pixel_1_41{position: absolute;top: 30px;left: 30px;display:block;} #pixel_1_42{position: absolute;top: 30px;left: 36px;display:block;} #pixel_1_43{position: absolute;top: 36px;left: 0px;display:block;} #pixel_1_44{position: absolute;top: 36px;left: 6px;display:block;} #pixel_1_45{position: absolute;top: 36px;left: 12px;display:block;} #pixel_1_46{position: absolute;top: 36px;left: 18px;display:block;} #pixel_1_47{position: absolute;top: 36px;left: 24px;display:block;} #pixel_1_48{position: absolute;top: 36px;left: 30px;display:block;} #pixel_1_49{position: absolute;top: 36px;left: 36px;display:block;} #pixel_2_1{position: absolute;top: 0px;left: 0px;display:block;} #pixel_2_2{position: absolute;top: 0px;left: 6px;display:block;} #pixel_2_3{position: absolute;top: 0px;left: 12px;display:block;} #pixel_2_4{position: absolute;top: 0px;left: 18px;display:block;} #pixel_2_5{position: absolute;top: 0px;left: 24px;display:block;} #pixel_2_6{position: absolute;top: 0px;left: 30px;display:block;} #pixel_2_7{position: absolute;top: 0px;left: 36px;display:block;} #pixel_2_8{position: absolute;top: 6px;left: 0px;display:block;} #pixel_2_9{position: absolute;top: 6px;left: 6px;display:block;} #pixel_2_10{position: absolute;top: 6px;left: 12px;display:block;} #pixel_2_11{position: absolute;top: 6px;left: 18px;display:block;} #pixel_2_12{position: absolute;top: 6px;left: 24px;display:block;} #pixel_2_13{position: absolute;top: 6px;left: 30px;display:block;} #pixel_2_14{position: absolute;top: 6px;left: 36px;display:block;} #pixel_2_15{position: absolute;top: 12px;left: 0px;display:block;} #pixel_2_16{position: absolute;top: 12px;left: 6px;display:block;} #pixel_2_17{position: absolute;top: 12px;left: 12px;display:block;} #pixel_2_18{position: absolute;top: 12px;left: 18px;display:block;} #pixel_2_19{position: absolute;top: 12px;left: 24px;display:block;} #pixel_2_20{position: absolute;top: 12px;left: 30px;display:block;} #pixel_2_21{position: absolute;top: 12px;left: 36px;display:block;} #pixel_2_22{position: absolute;top: 18px;left: 0px;display:block;} #pixel_2_23{position: absolute;top: 18px;left: 6px;display:block;} #pixel_2_24{position: absolute;top: 18px;left: 12px;display:block;} #pixel_2_25{position: absolute;top: 18px;left: 18px;display:block;} #pixel_2_26{position: absolute;top: 18px;left: 24px;display:block;} #pixel_2_27{position: absolute;top: 18px;left: 30px;display:block;} #pixel_2_28{position: absolute;top: 18px;left: 36px;display:block;} #pixel_2_29{position: absolute;top: 24px;left: 0px;display:block;} #pixel_2_30{position: absolute;top: 24px;left: 6px;display:block;} #pixel_2_31{position: absolute;top: 24px;left: 12px;display:block;} #pixel_2_32{position: absolute;top: 24px;left: 18px;display:block;} #pixel_2_33{position: absolute;top: 24px;left: 24px;display:block;} #pixel_2_34{position: absolute;top: 24px;left: 30px;display:block;} #pixel_2_35{position: absolute;top: 24px;left: 36px;display:block;} #pixel_2_36{position: absolute;top: 30px;left: 0px;display:block;} #pixel_2_37{position: absolute;top: 30px;left: 6px;display:block;} #pixel_2_38{position: absolute;top: 30px;left: 12px;display:block;} #pixel_2_39{position: absolute;top: 30px;left: 18px;display:block;} #pixel_2_40{position: absolute;top: 30px;left: 24px;display:block;} #pixel_2_41{position: absolute;top: 30px;left: 30px;display:block;} #pixel_2_42{position: absolute;top: 30px;left: 36px;display:block;} #pixel_2_43{position: absolute;top: 36px;left: 0px;display:block;} #pixel_2_44{position: absolute;top: 36px;left: 6px;display:block;} #pixel_2_45{position: absolute;top: 36px;left: 12px;display:block;} #pixel_2_46{position: absolute;top: 36px;left: 18px;display:block;} #pixel_2_47{position: absolute;top: 36px;left: 24px;display:block;} #pixel_2_48{position: absolute;top: 36px;left: 30px;display:block;} #pixel_2_49{position: absolute;top: 36px;left: 36px;display:block;} #pixel_3_1{position: absolute;top: 0px;left: 0px;display:block;} #pixel_3_2{position: absolute;top: 0px;left: 6px;display:block;} #pixel_3_3{position: absolute;top: 0px;left: 12px;display:block;} #pixel_3_4{position: absolute;top: 0px;left: 18px;display:block;} #pixel_3_5{position: absolute;top: 0px;left: 24px;display:block;} #pixel_3_6{position: absolute;top: 0px;left: 30px;display:block;} #pixel_3_7{position: absolute;top: 0px;left: 36px;display:block;} #pixel_3_8{position: absolute;top: 6px;left: 0px;display:block;} #pixel_3_9{position: absolute;top: 6px;left: 6px;display:block;} #pixel_3_10{position: absolute;top: 6px;left: 12px;display:block;} #pixel_3_11{position: absolute;top: 6px;left: 18px;display:block;} #pixel_3_12{position: absolute;top: 6px;left: 24px;display:block;} #pixel_3_13{position: absolute;top: 6px;left: 30px;display:block;} #pixel_3_14{position: absolute;top: 6px;left: 36px;display:block;} #pixel_3_15{position: absolute;top: 12px;left: 0px;display:block;} #pixel_3_16{position: absolute;top: 12px;left: 6px;display:block;} #pixel_3_17{position: absolute;top: 12px;left: 12px;display:block;} #pixel_3_18{position: absolute;top: 12px;left: 18px;display:block;} #pixel_3_19{position: absolute;top: 12px;left: 24px;display:block;} #pixel_3_20{position: absolute;top: 12px;left: 30px;display:block;} #pixel_3_21{position: absolute;top: 12px;left: 36px;display:block;} #pixel_3_22{position: absolute;top: 18px;left: 0px;display:block;} #pixel_3_23{position: absolute;top: 18px;left: 6px;display:block;} #pixel_3_24{position: absolute;top: 18px;left: 12px;display:block;} #pixel_3_25{position: absolute;top: 18px;left: 18px;display:block;} #pixel_3_26{position: absolute;top: 18px;left: 24px;display:block;} #pixel_3_27{position: absolute;top: 18px;left: 30px;display:block;} #pixel_3_28{position: absolute;top: 18px;left: 36px;display:block;} #pixel_3_29{position: absolute;top: 24px;left: 0px;display:block;} #pixel_3_30{position: absolute;top: 24px;left: 6px;display:block;} #pixel_3_31{position: absolute;top: 24px;left: 12px;display:block;} #pixel_3_32{position: absolute;top: 24px;left: 18px;display:block;} #pixel_3_33{position: absolute;top: 24px;left: 24px;display:block;} #pixel_3_34{position: absolute;top: 24px;left: 30px;display:block;} #pixel_3_35{position: absolute;top: 24px;left: 36px;display:block;} #pixel_3_36{position: absolute;top: 30px;left: 0px;display:block;} #pixel_3_37{position: absolute;top: 30px;left: 6px;display:block;} #pixel_3_38{position: absolute;top: 30px;left: 12px;display:block;} #pixel_3_39{position: absolute;top: 30px;left: 18px;display:block;} #pixel_3_40{position: absolute;top: 30px;left: 24px;display:block;} #pixel_3_41{position: absolute;top: 30px;left: 30px;display:block;} #pixel_3_42{position: absolute;top: 30px;left: 36px;display:block;} #pixel_3_43{position: absolute;top: 36px;left: 0px;display:block;} #pixel_3_44{position: absolute;top: 36px;left: 6px;display:block;} #pixel_3_45{position: absolute;top: 36px;left: 12px;display:block;} #pixel_3_46{position: absolute;top: 36px;left: 18px;display:block;} #pixel_3_47{position: absolute;top: 36px;left: 24px;display:block;} #pixel_3_48{position: absolute;top: 36px;left: 30px;display:block;} #pixel_3_49{position: absolute;top: 36px;left: 36px;display:block;}