title: Adding a circle around a rounded image
body: <p>I created a round-image using following HTML</p>
  
  <pre><code>&lt;div class="thumb"&gt;
  &lt;img src="http://www.gettyimages.in/gi-resources/images/Homepage/Category-Creative/UK/UK_Creative_462809583.jpg" alt="img"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and CSS</p>
  
  <pre><code>.thumb{
  width: 150px;
  height: 150px;
  overflow: hidden;
  border-radius: 50%;
  }
  </code></pre>
  
  <p>I tried adding a new circle around the rounded image, failed eventually. How am I supposed to do this? Should I create a new <code>div</code> and add this rounded image inside it and style that div to make it round? I tried to achieve circled image in this google link <a href="https://www.gmail.com/intl/en/mail/help/about.html" rel="nofollow">https://www.gmail.com/intl/en/mail/help/about.html</a> which is placed right below the slider.
  Here is my fiddle of what I've gotten so far <a href="http://jsfiddle.net/adityasingh773/rzsmpmc9/" rel="nofollow">http://jsfiddle.net/adityasingh773/rzsmpmc9/</a></p>