Nothing spectacular, a one-minute draft. :)

index.html

<div id="main"></div>

style.scss

@import "compass";
* {
	box-sizing:border-box;
  padding:0;
  margin:0;
}

body {
 	background:#222; 
}

#main {
  width:250px;
  height:250px;
  margin:40px auto;
  border:30px solid white;
  border-radius:50%;
  position:relative;
  transition:all 0.5s ease-out;
  box-shadow:0 0 10px rgba(255,255,255,0.1);
}

#main:before {
  content:"";
  display:block;
  position:absolute;
  width:50px;
  height:100px;
  background:#222;
  left:50%;
  margin-left:-25px;
  top:-50px;
}

#main:after {
  content:"";
  display:block;
  position:absolute;
  width:30px;
  height:150px;
  background:white;
  left:50%;
  margin-left:-15px;
  top:-60px;
  box-shadow:0 0 10px rgba(255,255,255,0.1);
  border-radius:20px;
}

#main:hover{
  transform:rotate(180deg);
}