LibertysYarn

/*Now the styles*/
* {
  margin: 0; 
	padding: 0;
}
body {
	background: #ccc; 
	font-family: arial, verdana, tahoma;
}

LibertysYarn

.circle {
    background: rgb(255,255,255);
    border-radius: 100%;
    cursor: pointer;
    position: relative;
    margin: 0 auto;
    width: 15em; 
    height: 15em;
    overflow: hidden;
    transform: translateZ(0);

LibertysYarn

/*Lets load up a Google Font*/
@import url(http://fonts.googleapis.com/css?family=Ubuntu);

/*Basic Reset*/
* {margin: 0; padding: 0;}

/*Some fancy BG*/
body {
  background: url('http://thecodeplayer.com/uploads/media/bluebg.jpg') center center fixed;
	background-size: cover;

LibertysYarn

/*Basic reset*/
* {margin: 0; padding: 0;}

html, body {height: 100%;}

body {
  background: #B1E3E2;
	box-shadow: inset 0 0 100px 20px #80D0CF;
	text-align: center;
}

LibertysYarn

 #viewport {
position: relative;
width: 800px;
height: 600px;
overflow: hidden;
background:url('images/milk_tea.jpg') 0 0 no-repeat
}
#viewport .smoke {
position: absolute;
width: 250px;

LibertysYarn

//** ribbon menu **//
 .ribbon:after, .ribbon:before {
    margin-top:0.5em;
    content: "";
    float:left;
    border:1.5em solid  #383838 ;
}

.ribbon:after {
    border-right-color:transparent;

LibertysYarn

.thumb-wrapper {
  width: 269px;
  max-width: 100%;
  height: 250px;
  position: relative;
  left: -1px;
  display: block;
  overflow: hidden;
  text-align: center;

LibertysYarn

.featuredpage img, .featuredpost img, .post-image {      
 background-color: #F5F5F5; 
 border: 1px solid #DDDDDD; 
border-radius: 50% 50% 50% 50%;      
padding: 4px; 
}

LibertysYarn

.ch-grid {
    margin: 20px 0 0 0;
    padding: 0;
    list-style: none;
    display: block;
    text-align: center;
    width: 100%;
}
 
.ch-grid:after,

LibertysYarn

.ch-grid {
    margin: 20px 0 0 0;
    padding: 0;
    list-style: none;
    display: block;
    text-align: center;
    width: 100%;
}
 
.ch-grid:after,