Skip to content

Instantly share code, notes, and snippets.

@austinbv
Created July 21, 2012 20:42
Show Gist options
  • Save austinbv/3157096 to your computer and use it in GitHub Desktop.
Save austinbv/3157096 to your computer and use it in GitHub Desktop.
* {
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
}
body {
background-image:0 99% 99%;
-webkit-background-size:80px 80px;
-moz-background-size:80px 80px;
background-size:80px 80px;
background-position:0 0 40px;
}
.fridge {
position:fixed;
background-color:#a0e0a9;
-moz-border-radius-topleft:100px;
-webkit-border-top-left-radius:100px;
-o-border-top-left-radius:100px;
-ms-border-top-left-radius:100px;
border-top-left-radius:100px;
-moz-border-radius-topright:100px;
-webkit-border-top-right-radius:100px;
-o-border-top-right-radius:100px;
-ms-border-top-right-radius:100px;
border-top-right-radius:100px;
height:750px;
width:900px;
bottom:0;
background-image:linear-gradient(left,#a0e0a90%,#7ebe87100%);
-webkit-box-shadow:inset -18px 0 10px #5c9c65,inset 18px 0 10px #b1f1ba;
box-shadow:inset -18px 0 10px #5c9c65,inset 18px 0 10px #b1f1ba;
margin:2% 2% 0;
}
.fridge .reflection {
background:#b1f1ba;
opacity:.3;
-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
filter:alpha(opacity=30);
position:fixed;
height:650px;
width:150px;
bottom:0;
left:150px;
-moz-border-radius-topleft:30px;
-webkit-border-top-left-radius:30px;
-o-border-top-left-radius:30px;
-ms-border-top-left-radius:30px;
border-top-left-radius:30px;
-webkit-box-shadow:0 0 5px 5px #b1f1ba;
box-shadow:0 0 5px 5px #b1f1ba;
}
.fridge .logo {
-webkit-transform:rotate(-3deg);
-moz-transform:rotate(-3deg);
-o-transform:rotate(-3deg);
-ms-transform:rotate(-3deg);
transform:rotate(-3deg);
font-family:'Sonsie One',cursive;
font-size:40px;
color:rgba(192,192,192,0.8);
text-shadow:-1px -1px #d1d1d1,1px 1px #606060;
top:100px;
left:370px;
position:absolute;
}
.handle {
-webkit-transform:rotate(2deg);
-moz-transform:rotate(2deg);
-o-transform:rotate(2deg);
-ms-transform:rotate(2deg);
transform:rotate(2deg);
background-image:linear-gradient(left,#c0c0c030%,#606060100%);
-webkit-box-shadow:inset -2px -2px 10px #606060;
box-shadow:inset -2px -2px 10px #606060;
-moz-border-radius-topleft:30px;
-webkit-border-top-left-radius:30px;
-o-border-top-left-radius:30px;
-ms-border-top-left-radius:30px;
border-top-left-radius:30px;
-moz-border-radius-bottomleft:30px;
-webkit-border-bottom-left-radius:30px;
-o-border-bottom-left-radius:30px;
-ms-border-bottom-left-radius:30px;
border-bottom-left-radius:30px;
position:absolute;
height:40px;
width:300px;
bottom:300px;
right:80px;
z-index:10;
}
.handle:after /* Handle Base */ {
-webkit-transform:rotate(-2deg);
-moz-transform:rotate(-2deg);
-o-transform:rotate(-2deg);
-ms-transform:rotate(-2deg);
transform:rotate(-2deg);
content:'';
position:absolute;
height:70px;
width:120px;
background:#000;
right:-23px;
bottom:-15px;
-webkit-border-radius:12px;
border-radius:12px;
background-image:linear-gradient(left,#c0c0c00%,#9e9e9e100%);
border:4px outset #d2d2d2;
-webkit-box-shadow:3px 3px 10px 2px #5c9c65;
box-shadow:3px 3px 10px 2px #5c9c65;
}
.handle span {
-webkit-transform:rotate(-2deg);
-moz-transform:rotate(-2deg);
-o-transform:rotate(-2deg);
-ms-transform:rotate(-2deg);
transform:rotate(-2deg);
font-family:'Sonsie One',cursive;
width:50px;
display:inline-block;
position:absolute;
right:27px;
bottom:-2px;
z-index:4;
color:rgba(175,175,175,0.8);
text-shadow:1px 1px #c0c0c0,-1px -1px #1c1c1c;
line-height:150%;
}
.handle span:before {
content:'';
height:20px;
width:100px;
border-top:4px silver groove;
border-bottom:4px silver groove;
right:-35px;
top:-3px;
z-index:4;
position:absolute;
}
.handle span:after {
content:'';
width:100px;
height:2px;
position:absolute;
border-bottom:4px silver groove;
right:-35px;
bottom:0;
}
.shadow /* Handle Shaddow */ {
content:'';
position:absolute;
background:#7ebe87;
-webkit-box-shadow:0 0 20px 20px #7ebe87;
box-shadow:0 0 20px 20px #7ebe87;
height:7px;
width:200px;
right:120px;
-moz-border-radius-bottomleft:30px;
-webkit-border-bottom-left-radius:30px;
-o-border-bottom-left-radius:30px;
-ms-border-bottom-left-radius:30px;
border-bottom-left-radius:30px;
-moz-border-radius-bottomright:30px;
-webkit-border-bottom-right-radius:30px;
-o-border-bottom-right-radius:30px;
-ms-border-bottom-right-radius:30px;
border-bottom-right-radius:30px;
bottom:299px;
z-index:1;
}
.post {
display:none;
background-image:linear-gradient(left,#adadad30%,#131313100%);
-webkit-box-shadow:11px 7px 39px -2px;
box-shadow:11px 7px 39px -2px;
-moz-border-radius-topleft:15px;
-webkit-border-top-left-radius:15px;
-o-border-top-left-radius:15px;
-ms-border-top-left-radius:15px;
border-top-left-radius:15px;
-moz-border-radius-bottomleft:15px;
-webkit-border-bottom-left-radius:15px;
-o-border-bottom-left-radius:15px;
-ms-border-bottom-left-radius:15px;
border-bottom-left-radius:15px;
position:absolute;
height:30px;
width:40px;
right:125px;
bottom:135px;
z-index:4;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment