LibertysYarn

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

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

 #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

/*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

/*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

.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

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

LibertysYarn

/*Lets start with the cloud formation rather*/

/*The container will also serve as the SKY*/

*{ margin: 0; padding: 0;}

body {
  /*To hide the horizontal scroller appearing during the animation*/
	overflow: hidden;
}

LibertysYarn

ul.box {
position: relative;
z-index: 1; /* prevent shadows falling behind containers with backgrounds */
overflow: hidden;
list-style: none;
margin: 0;
padding: 0; }


ul.box li {

LibertysYarn

body {
background: #ccc;
}
#cloud {
width: 350px; height: 120px;
 
background: #f2f9fe;
background: linear-gradient(top, #f2f9fe 5%, #d6f0fd 100%);
background: -webkit-linear-gradient(top, #f2f9fe 5%, #d6f0fd 100%);
background: -moz-linear-gradient(top, #f2f9fe 5%, #d6f0fd 100%);