#aboutme { background-color:#fff; -moz-box-shadow:0 0 3px #e0e0e0; -webkit-box-shadow:0 0 3px #e0e0e0; box-shadow:0 0 3px #e0e0e0; border:1px solid #666; padding:3px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; margin:0 auto; margin-top:15px; padding:10px; width:270px; height:auto;}.name-author { margin:0 0 7px; display:block; width:100%;}.name-author h3 { position:relative; display:inline; background-color:#0097BD; color:#FFF; font-family:Segoe UI; font-size:15px; font-weight:bold; margin:0 0 0 -3px; padding:3px 5px 3px 10px; width:100%; -moz-text-shadow:0 1px 0 black; -webkit-text-shadow:0 1px 0 black; text-shadow:0 1px 0 black;}.name-author h3:after { content:” “; width:0; height:0; position:absolute; left:100%; top:0; border-width:13px; border-style:solid; border-color:transparent transparent transparent #0097BD;}@-webkit-keyframes name-author { 0% {color:white} 20% {color:Orange} 40% {color:pink} 60% {color:Orchid} 80% {color:gold} 100% {color:white}}@-moz-keyframes name-author { 0% {color:white} 20% {color:Orange} 40% {color:pink} 60% {color:Orchid} 80% {color:gold} 100% {color:white}}@-keyframes name-author { 0% {color:white} 20% {color:Orange} 40% {color:pink} 60% {color:Orchid} 80% {color:gold} 100% {color:white}}/* Penerapan efek pada element yang akan diberi efek*/.name-author h3 {/* Waktu 10 detik */ animation:10s infinite name-author linear; -webkit-animation:10s infinite name-author linear;}.aboutme-text { font-size:12px; text-align:left; margin:0;}.aboutme-image-container { float:left; width:70px; height:70px; margin-right:75px; z-index:1;}.aboutme-image-container { margin:-20px 0 5px 0; padding:9px; position:relative; -webkit-border-bottom-right-radius:10px; -webkit-border-bottom-left-radius:100%; -moz-border-radius-bottomright:100%; -moz-border-radius-bottomleft:100%; border-bottom-right-radius:100%; border-bottom-left-radius:100%; -webkit-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #666; -moz-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #666; box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #666; background-color:#59B52E;}.aboutme-image-container:before { content:’ ‘; position:absolute; top:0; left:-10px; width:0; height:0; border-style:solid; border-width:0 0 10px 10px; border-color:transparent transparent #333 transparent;}.aboutme-image-container:after { content:’ ‘; position:absolute; top:0; right:-10px; width:0; height:0; border-style:solid; border-width:10px 0 0 10px; border-color:transparent transparent transparent #333;}.aboutme-image-container img { width:100%; height:100%; border:2px solid yellow; border-radius:100%; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; transition:all 0.3s ease; -moz-box-shadow:1px 1px 4px #000; -webkit-box-shadow:1px 1px 4px #000; box-shadow:1px 1px 4px #000;}.aboutme-image-container img:hover { border:2px solid GOld; cursor:pointer; margin-left:0; -moz-transform:scale(1.2) rotate(360deg); -webkit-transform:scale(1.2) rotate(360deg); -o-transform:scale(1.2) rotate(360deg); -ms-transform:scale(1) rotate(-360deg); transform:scale(1.2) rotate(360deg); -moz-box-shadow:1px 1px 4px #000; -webkit-box-shadow:1px 1px 4px #000; box-shadow:1px 1px 4px #000;}
