* { -moz-box-sizing: border-box; box-sizing: border-box } body { background-color: #40aade } #owl { width: 100px; margin: 100px auto 0 auto } #hat { width: 107px; height: 52px; background-color: #124057; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; position: absolute; margin: -12px 0 0 -23px; -moz-box-shadow: 0 -4px 0 #40aade; -webkit-box-shadow: 0 -4px 0 #40aade; box-shadow: 0 -4px 0 #40aade } #hat:after { content: ""; display: block; position: relative; width: 36px; height: 16px; -webkit-border-top-left-radius: 73px; -moz-border-radius-topleft: 73px; border-top-left-radius: 73px; -webkit-border-top-right-radius: 73px; -moz-border-radius-topright: 73px; border-top-right-radius: 73px; background-color: #124057; margin: -18px auto 0 auto; z-index: -1 } #body { width: 61px; height: 122px; background-color: #124057; border: 4px solid #40aade; -webkit-border-top-left-radius: 50px; -moz-border-radius-topleft: 50px; border-top-left-radius: 50px; -webkit-border-top-right-radius: 50px; -moz-border-radius-topright: 50px; border-top-right-radius: 50px; -webkit-border-bottom-left-radius: 50px; -moz-border-radius-bottomleft: 50px; border-bottom-left-radius: 50px; -webkit-border-bottom-right-radius: 50px; -moz-border-radius-bottomright: 50px; border-bottom-right-radius: 50px; position: relative } #body:after { content: ""; display: block; width: 53px; height: 83px; background-color: #124057; -moz-border-radius: 70px/100px; -webkit-border-radius: 70px/100px; border-radius: 70px/100px; margin: -47px 0 0 0 } .eye { margin-top: 24px; width: 17px; height: 17px; background-color: #40aade; -moz-box-shadow: 0 0 0 5px #124057, 0 0 0 9px #40aade; -webkit-box-shadow: 0 0 0 5px #124057, 0 0 0 9px #40aade; box-shadow: 0 0 0 5px #124057, 0 0 0 9px #40aade; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; float: left } .eye.right { position: absolute; right: 3px } .eye.left { margin-left: 3px } .eye:before { content: ""; display: block; width: 9px; height: 9px; background-color: #124057; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; margin: 4px 0 0 4px; position: absolute } .eye:after { content: ""; display: block; width: 3px; height: 3px; background-color: #40aade; position: absolute; margin: 5px 0 0 4px } .nose { background-color: #124057; border: 4px solid #40aade; -webkit-border-top-left-radius: 3px; -moz-border-radius-topleft: 3px; border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topright: 3px; border-top-right-radius: 3px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; border-bottom-right-radius: 5px; width: 15px; height: 20px; position: absolute; top: 38px; left: 19px; -moz-border-radius: 50% 50% 50% 50%/50% 50% 40% 40%; -webkit-border-radius: 50% 50% 50% 50%/50% 50% 40% 40%; border-radius: 50% 50% 50% 50%/50% 50% 40% 40% } .nose:after { content: ""; display: block; width: 2px; height: 5px; background-color: #40aade; margin: 3px 0 0 1px; -webkit-border-top-left-radius: 3px; -moz-border-radius-topleft: 3px; border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-bottomleft: 3px; border-bottom-left-radius: 3px } .nose:before { content: ""; position: absolute; display: block; width: 11px; height: 5px; background-color: #124057; top: -14px; left: -1px } #button { width: 5px; height: 18px; margin: 64px 0 0 23px; position: relative } #button:before, #button:after { content: ""; display: block; width: 5px; height: 5px; background-color: #40aade; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px } #button:after { margin: 10px 0 0 0 } #wings { width: 85px; height: 40px; -moz-border-radius: 90px; -webkit-border-radius: 90px; border-radius: 90px; background-color: #124057; position: absolute; margin: -69px 0 0 -12px; z-index: -1 } #stick { width: 95px; height: 7px; background-color: #124057; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow: 0 3px 0 0 #40aade; -webkit-box-shadow: 0 3px 0 0 #40aade; box-shadow: 0 3px 0 0 #40aade; position: absolute; margin: -23px 0 0 -16px } #foot div:before, #foot div:after { content: ""; width: 5px; height: 10px; background-color: #40aade; position: absolute; display: block; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; position: initial; float: left } #foot { position: absolute; display: block; margin: -29px 0 0 8px; width: 45px; z-index: 1 } #foot .right { position: absolute; right: 0 } .glass { margin: 28px 0 0 0; position: absolute; width: 68px; z-index: 1 } .glass .left, .glass .right { position: absolute; display: inline-block; width: 0; height: 0; line-height: 0; border: 8px solid #124057; border-bottom: none; -webkit-border-top-right-radius: 8px; -moz-border-radius-topright: 8px; border-top-right-radius: 8px; -webkit-border-top-left-radius: 8px; -moz-border-radius-topleft: 8px; border-top-left-radius: 8px } .glass .left:before, .glass .right:before { content: ""; display: block; width: 7px; height: 7px; background-color: #40aade; position: absolute; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; margin: -4px 0 0 -3px } .glass .right:before { margin: -4px 0 0 -4px } .glass .left { left: -14px } .glass .right { right: 1px }