@media print {
aside,header,footer,.entry-unrelated,#footer-boxes,[class^=bsap],#comment-stats,#thread-closed,#respond {
display:none;
}

#comments {
page-break-before:always;
}
}

@media screen {
html {
background:url('./images/bglines.png');
}

body {
font:16px/1.4 "myriad-pro-1","myriad-pro-2","Lucida Grande",Sans-Serif;
color:#333;
overflow-x:hidden;
}

article,aside,figure,footer,header,hgroup,menu,nav,section {
display:block;
}

h1,h2,h3,h4 {
font-family:"kulturista-web-1","kulturista-web-2",Serif;
font-weight:300;
line-height:1;
margin:0 0 25px;
}

h1 {
font-size:50px;
font-weight:800;
}

h2 {
font-size:40px;
}

article h2 a:hover {
color:#f3a01e;
background:none;
}

.subtitle {
font-size:16px;
font-weight:600;
color:#999;
text-transform:uppercase;
letter-spacing:2px;
margin:0 0 4px;
}

h3 {
font-size:32px;
margin-top:50px;
background-image:0;
padding-left:58px;
margin-left:-58px;
}

h4 {
font-weight:600;
font-size:24px;
margin-bottom:15px;
}

h5 {
font-family:Baskerville, Georgia, Serif;
font-style:italic;
font-size:30px;
font-weight:100;
margin:0 0 15px;
}

h1 a,h2 a,h3 a,h4 a,h5 a {
border:0 !important;
}

a {
text-decoration:none;
color:#000;
}

table {
border-collapse:collapse;
width:100%;
}

p {
margin:0 0 15px;
}

blockquote p:first-child:before {
content:"\201C";
}

blockquote p:last-child:after {
content:"\201D";
}

code {
background:#eee;
color:#000;
font-family:Monaco, Courier, MonoSpace;
border-radius:4px;
font-size:12px;
white-space:nowrap;
padding:0 5px 1px;
}

table code {
white-space:normal;
}

pre {
position:relative;
background:#333;
color:#FFF;
font-family:Monaco, Courier, MonoSpace;
line-height:1.8;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
font-size:12px;
overflow:auto;
margin:0 0 25px;
padding:10px;
}

pre code {
color:#FFF;
background:#333;
white-space:pre;
padding:0;
}

pre[rel] {
padding-top:40px;
}

pre[rel]:after {
content:attr(rel);
position:absolute;
top:0;
background:#F3A01E;
left:0;
right:0;
font-size:24px;
line-height:0;
color:#FFF;
font:bold 16px "myriad-pro-1","myriad-pro-2","Lucida Grande",Sans-Serif;
-webkit-border-top-left-radius:7px;
-webkit-border-top-right-radius:7px;
-webkit-border-bottom-right-radius:0;
-webkit-border-bottom-left-radius:0;
-moz-border-radius-topleft:7px;
-moz-border-radius-topright:7px;
-moz-border-radius-bottomright:0;
-moz-border-radius-bottomleft:0;
border-top-left-radius:7px;
border-top-right-radius:7px;
border-bottom-right-radius:0;
border-bottom-left-radius:0;
padding:5px;
}

pre .str {
color:#ff8400;
}

pre .kwd {
color:#e8ed97;
}

pre .com {
color:#999;
}

pre .typ {
color:#9a848c;
}

pre .lit {
color:#c9783e;
}

pre .pun {
color:#eee;
}

pre .atv {
color:#8e9c5c;
}

pre .dec {
color:#ccc;
}

#juice article blockquote {
font-family:"kulturista-web-1","kulturista-web-2",Serif;
font-style:italic;
font-size:21px;
text-align:center;
position:relative;
padding:50px 0;
}

#juice article blockquote p {
margin:0 0 20px;
}

#juice article blockquote:before {
top:25px;
}

#juice article blockquote:after {
bottom:25px;
}

#juice article blockquote:before,#juice article blockquote:after {
content:"";
position:absolute;
left:0;
right:0;
height:1px;
background-image:0;
}

.link blockquote {
font-style:italic;
margin:0;
padding:0;
}

.button,.gsc-search-button input[type=submit],#wp_page_numbers a {
display:inline-block;
position:relative;
-moz-border-radius:18px;
-webkit-border-radius:18px;
border-radius:18px;
font:15px/1.4 "myriad-pro-1","myriad-pro-2","Lucida Grande",Sans-Serif;
background-color:#b6d3f4;
background-image:0;
color:#FFF !important;
-webkit-box-shadow:inset 0 1px 1px #fff,0 3px 3px rgba(0,0,0,0.6);
-moz-box-shadow:inset 0 1px 1px #fff,0 3px 3px rgba(0,0,0,0.6);
box-shadow:inset 0 1px 1px #fff,0 3px 3px rgba(0,0,0,0.6);
border:1px solid #9ac9ff !important;
font-weight:600;
text-shadow:0 -1px 0 rgba(0,0,0,0.3);
padding:7px 15px;
}

.ie8 .button,.ie8 .gsc-search-button input[type=submit],.ie8 #wp_page_numbers a {
background:#4b8db5;
}

.button:hover,.gsc-search-button input[type=submit]:hover,#wp_page_numbers a:hover {
-webkit-box-shadow:inset 0 2px 6px #fff,0 3px 3px rgba(0,0,0,0.6);
-moz-box-shadow:inset 0 2px 6px #fff,0 3px 3px rgba(0,0,0,0.6);
box-shadow:inset 0 2px 6px #fff,0 3px 3px rgba(0,0,0,0.6);
}

.button:active,.gsc-search-button input[type=submit]:active,#wp_page_numbers a:active {
-webkit-box-shadow:inset 0 2px 6px #fff,0 1px 1px rgba(0,0,0,0.6);
-moz-box-shadow:inset 0 2px 6px #fff,0 1px 1px rgba(0,0,0,0.6);
box-shadow:inset 0 2px 6px #fff,0 1px 1px rgba(0,0,0,0.6);
top:2px;
}

.gsc-search-button input[type=submit] {
padding:3px 15px;
}

.explanation {
background-color:#fefcaf;
background-image:0;
-webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.25);
-moz-box-shadow:1px 1px 3px rgba(0,0,0,0.25);
box-shadow:1px 1px 3px rgba(0,0,0,0.25);
margin:0 0 20px;
padding:15px;
}

.explanation p:only-child,.explanation p:last-child {
margin:0;
}

.author-byline {
font:italic 21px Baskerville, Georgia, Serif;
color:#f3a01e;
margin:0 0 25px;
}

.screen-reader-text {
position:absolute;
top:-9999px;
left:-9999px;
}

.group:before,.group:after {
content:"";
display:table;
}

.group:after {
clear:both;
}

.group {
zoom:1px;
}

.rainbow,.bsap_1235262 a:hover {
background-image:0;
}

.last {
margin-right:0 !important;
}

header {
background-color:rgba(0,0,0,0.65);
-webkit-box-shadow:inset 0 -5px 8px -5px rgba(0,0,0,0.65);
-moz-box-shadow:inset 0 -5px 8px -5px rgba(0,0,0,0.65);
box-shadow:inset 0 -5px 8px -5px rgba(0,0,0,0.65);
}

header .inside {
width:80%;
position:relative;
margin:0 auto;
}

#logo {
display:block;
background:url('./images/CSS-Tricks-logo.png') no-repeat;
width:590px;
height:166px;
position:absolute;
top:100px;
left:-166px;
z-index:2;
-moz-transition:all 0.2s ease;
-o-transition:all 0.2s ease;
-webkit-transition:all 0.2s ease;
-ms-transition:all 0.2s ease;
}

#logo:active #slogan span {
text-shadow:0 0 6px #FFF;
}

#logo:active #slogan hr:nth-of-type(1) {
background-color:#f3a01e;
}

#logo:active #slogan hr:nth-of-type(2) {
background-color:#D05D2A;
}

#logo:active #slogan hr:nth-of-type(3) {
background-color:#4b8db5;
}

#logo:before {
content:"";
position:absolute;
width:1000px;
right:100%;
top:16px;
height:125px;
background:url('./images/logorepeat.png') repeat-x;
}

.ie8 #logo {
top:60px;
zoom:1px;
}

#slogan {
width:85px;
-moz-transform:rotate(-90deg);
-o-transform:rotate(-90deg);
-webkit-transform:rotate(-90deg);
-ms-transform:rotate(-90deg);
filter:progid:DXImageTransform.Microsoft.Matrix(M11=$m11, M12=$m12,M21=$m21, M22=$m22, sizingMethod='auto expand');
zoom:1px;
position:absolute;
top:26px;
left:52px;
text-transform:uppercase;
text-align:center;
font-family:"kulturista-web-1","kulturista-web-2",Serif;
font-weight:600;
color:#545453;
font-size:12px;
}

#slogan hr {
height:1px;
background:rgba(255,255,255,0.8);
border:0;
margin:5px 0;
}

#slogan span:nth-of-type(1) {
letter-spacing:6px;
}

#slogan span:nth-of-type(2) {
letter-spacing:4px;
font-size:10px;
}

#slogan span:nth-of-type(3) {
letter-spacing:6px;
font-size:13px;
}

#slogan em {
color:#FFF;
font-style:italic;
text-transform:none;
font-size:15px;
display:block;
}

#tag {
position:absolute;
top:93px;
left:184px;
font-family:"kulturista-web-1","kulturista-web-2",Serif;
font-weight:600;
color:#807b77;
font-size:12px;
text-transform:uppercase;
letter-spacing:6px;
}

.top-ad-treehouse {
position:absolute;
right:0;
top:100px;
width:420px;
}

.top-ad-treehouse strong {
background:#91ad57;
color:#FFF;
border-radius:5px;
padding:1px 5px;
}

.the-frog {
width:200px;
height:144px;
float:right;
position:relative;
}

.the-frog span {
background-image:url('./images/frog-sprite.png');
position:absolute;
top:0;
right:8px;
background-size:100% 300%;
-moz-transition:opacity 0.2s ease;
-o-transition:opacity 0.2s ease;
-webkit-transition:opacity 0.2s ease;
-ms-transition:opacity 0.2s ease;
}

.the-frog-1 {
background-position:0 0;
width:200px;
height:144px;
}

.the-frog-2 {
background-position:0 -121px;
opacity:0;
width:170px;
height:122px;
}

.the-frog-3 {
background-position:0 -188px;
opacity:0;
width:130px;
height:94px;
}

.ad-treehouse-text {
position:absolute;
right:210px;
bottom:65px;
}

.ad-treehouse-title {
font-weight:700;
font-size:18px;
line-height:20px;
margin:0 0 3px;
}

.ad-treehouse-desc {
font-size:12px;
}

input.gsc-input {
background:#FFF !important;
-moz-border-radius:15px;
-webkit-border-radius:15px;
border-radius:15px;
border:0 !important;
-webkit-box-shadow:inset 0 2px 3px rgba(0,0,0,0.5);
-moz-box-shadow:inset 0 2px 3px rgba(0,0,0,0.5);
box-shadow:inset 0 2px 3px rgba(0,0,0,0.5);
outline:0;
width:80% !important;
padding:6px 13px !important;
}

#browse-archives {
font-family:"kulturista-web-1","kulturista-web-2",Serif;
font-size:14px;
-moz-transition:all 0.6s ease-out;
-o-transition:all 0.6s ease-out;
-webkit-transition:all 0.6s ease-out;
-ms-transition:all 0.6s ease-out;
margin:0 0 20px;
}

#browse-archives em {
font-family:Baskerville, Georgia, Serif;
}

#browse-archives a {
text-transform:uppercase;
}

#browse-archives a:hover span:nth-of-type(5n-4),.contact-link span:nth-of-type(5n-4) {
color:#f3a01e;
}

#browse-archives a:hover span:nth-of-type(5n-3),.contact-link span:nth-of-type(5n-3) {
color:#D05D2A;
}

#browse-archives a:hover span:nth-of-type(5n-2),.contact-link span:nth-of-type(5n-2) {
color:#9dc425;
}

#browse-archives a:hover span:nth-of-type(5n-1),.contact-link span:nth-of-type(5n-1) {
color:#4b8db5;
}

#browse-archives a:hover span:nth-of-type(5n-0),.contact-link span:nth-of-type(5n-0) {
color:#7c48b5;
}

.contact-link {
font-weight:700;
text-transform:uppercase;
}

.main-nav li {
float:left;
width:12.5%;
position:relative;
-moz-transition:background-color 0.4s ease;
-o-transition:background-color 0.4s ease;
-webkit-transition:background-color 0.4s ease;
-ms-transition:background-color 0.4s ease;
}

.main-nav li:hover {
background:rgba(0,0,0,0.4);
-moz-transition:background-color 0.1s ease;
-o-transition:background-color 0.1s ease;
-webkit-transition:background-color 0.1s ease;
-ms-transition:background-color 0.1s ease;
}

.main-nav a {
border-top:0;
display:block;
text-align:center;
position:relative;
z-index:2;
color:#FFF;
font:bold 15px "kulturista-web-1","kulturista-web-2",Serif;
text-decoration:none;
text-transform:uppercase;
letter-spacing:0.5px;
overflow:hidden;
padding:5px 10px 10px;
}

.main-nav a:before {
content:"";
display:block;
height:40px;
background:url('./images/nav-sprite.png') top center no-repeat;
}

.ie8 .main-nav a {
padding:10px !important;
}

.main-nav span {
display:block;
text-align:center;
font-size:9px;
white-space:nowrap;
}

.main-nav .forums a:before {
background-position:center -40px;
}

.main-nav .history a:before {
background-position:center -80px;
}

.main-nav .signup a:before {
background-position:center -160px;
}

.main-nav .applet a:before {
background-position:center -120px;
}

.main-nav .contact a:before {
background-position:center -200px;
}

.main-nav .homelink a:before {
background-position:center -240px;
}

.main-nav .tos a:before {
background-position:center -280px;
}


.main-nav .forums2 a:before {
background-position:center -40px;
}

.main-nav .history2 a:before {
background-position:center -80px;
}

.main-nav .signup2 a:before {
background-position:center -160px;
}

.main-nav .applet2 a:before {
background-position:center -120px;
}

.main-nav .contact2 a:before {
background-position:center -200px;
}

.main-nav .homelink2 a:before {
background-position:center -240px;
}

.main-nav .tos2 a:before {
background-position:center -280px;
}

.main-nav li:before {
content:"";
position:absolute;
top:100%;
left:0;
right:0;
height:8px;
}
.main-nav .homelink:hover,.main-nav .homelink2:hover,.main-nav .homelink2,.main-nav .homelink2:before {
background:#ef7901;
}

.main-nav .applet:hover,.main-nav .applet2:hover,.main-nav .applet2,.main-nav .applet2:before {
background:#d54421;
}

.main-nav .games:hover,.main-nav .games2:hover,.main-nav .games2,.main-nav .games2:before {
background:#98bf0d;
}

.main-nav .forums:hover,.main-nav .forums2:hover,.main-nav .forums2,.main-nav .forums2:before {
background:#01b0ec;
}

.main-nav .history:hover,.main-nav .history2:hover,.main-nav .history2,.main-nav .history2:before {
background:#7449f1;
}

.main-nav .signup:hover,.main-nav .signup2:hover,.main-nav .signup2,.main-nav .signup2:before {
background:#b147a3;
}

.main-nav .contact:hover,.main-nav .contact2:hover,.main-nav .contact2,.main-nav .contact2:before {
background:#f6b402;
}

.main-nav .tos:hover,.main-nav .tos2:hover,.main-nav .tos2,.main-nav .tos2:before {
background:#8d8d8d;
}

ul,.main-nav {
list-style:none;
}

pre .pln,pre .tag,pre .atn {
color:#dfc484;
}

.twitter-tweet-rendered blockquote:before,.twitter-tweet-rendered blockquote:after,.ie8 #logo:before,.no-csstransforms #slogan,.ie8 #slogan,.ie8 .top-ad-treehouse,.ie8 .the-frog,.gsc-clear-button,.gsc-branding,.ie8 .main-nav a:before,.ie8 .main-nav li:before {
display:none;
}
}

@media screen and max-width 1024px {
#main-content,header .inside,footer .inside {
width:95%;
}

.page #juice,.single #juice {
width:75%;
}

.bsap_1235262 a,.bsap_1235262 a.even {
float:none !important;
width:auto !important;
margin:0 0 8px !important;
}

.bsap_1235262 a img {
float:none;
width:100% !important;
}

.date-bubble,.comment-bubble {
position:relative;
width:auto;
height:auto;
left:0;
top:0;
background:left;
text-align:left;
color:#f3a01e;
padding-top:0;
font-size:14px;
line-height:1.2;
z-index:1;
margin:0 0 5px;
}

.date-bubble span {
display:inline;
}

aside {
width:25%;
margin:0;
}

aside .inside {
border:0;
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;
}

.comment-bubble,#slogan {
display:none;
}
}

@media screen and max-width 1200px {
#hot-links {
float:none;
clear:both;
}

aside {
width:35%;
max-width:none;
margin:20px;
}

#juice {
width:58%;
}

#main-content {
margin:115px auto 65px;
}

.page #juice,.single #juice {
width:60%;
}

.main-nav li {
width:25%;
border-right:1px solid rgba(255,255,255,0.2);
border-bottom:1px solid rgba(255,255,255,0.2);
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}

.main-nav a {
background-position:20px center !important;
text-align:left !important;
padding:13px 0 2px;
}

.main-nav a:before {
float:left;
width:40px;
margin:-13px 5px 0 10px;
}

.main-nav li:nth-child(4n) {
border-right:0;
}

.main-nav li:nth-child(n+5) {
border-bottom:0;
}

.top-ad-treehouse {
top:113px;
width:392px;
}

.the-frog-1 {
opacity:0;
}

.the-frog-2 {
opacity:1px;
}

.ad-treehouse-text {
bottom:78px;
right:185px;
}

#logo {
top:85px;
}

#slogan {
top:66px;
left:104px;
}

.comment {
width:100%;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}

.comment-content,.children .comment-content {
width:100%;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
float:none;
padding-left:110px;
}

.comment-author-wrap {
left:10px;
z-index:4;
}

.avatar-wrap {
border-color:#c2c2c2;
}

.cancel-comment-reply {
margin:4px 0 10px;
}

#inputs {
float:none;
width:auto;
}

#inputs textarea {
background:none;
}

.infoput {
width:100%;
position:static;
}

.comment-reply-link {
opacity:0.6px;
}

.main-nav span,.main-nav li:before,.main-nav li.current span:after,#slogan span,#slogan hr,#meee,#inputs>h4,#commenting-tips,.avatar-wrap:before {
display:none;
}
}

@media screen and max-width 1350px {
.children .avatar-wrap:before {
width:400px;
}
}

@media screen and max-width 600px {
.main-nav li {
width:50%;
}

.main-nav li:nth-child(even) {
border-right:0;
}

.main-nav li:nth-child(n+5) {
border-bottom:1px solid rgba(255,255,255,0.2);
}

.top-ad-treehouse {
top:315px;
}

.ad-treehouse-desc {
display:none;
}

#tos a.footer-box {
background-size:480px 190px;
}

.sharing {
width:100%;
padding-right:0 !important;
}

.alignright {
float:none;
margin:0;
}
}

@media screen and max-width 860px {
header {
background:none;
}

header .inside {
padding:0;
}

.main-nav li {
background:#434343;
}

.main-nav a {
text-align:center !important;
background:none !important;
padding:10px !important;
}

.main-nav span {
display:block;
}

.main-nav li:nth-child(n+7) {
border-bottom:0;
}

.main-nav-wrap {
margin:-19px 0 0;
}

.ie8 .main-nav-wrap {
margin:0;
}

#logo {
position:relative;
bottom:auto;
top:0;
margin-top:-20px;
background-size:100% 100%;
width:420px !important;
left:-100px;
overflow:hidden;
height:120px !important;
}

.ie8 #logo {
background:none !important;
position:static !important;
text-indent:0 !important;
top:0 !important;
left:0 !important;
height:auto !important;
margin:0 !important;
padding:20px !important;
}

.ie8 #logo h1 {
position:static !important;
top:0 !important;
left:0 !important;
text-indent:0;
margin:0 !important;
padding:0 !important;
}

#tag {
left:160px;
top:70px;
font-size:10px;
line-height:11px;
letter-spacing:1px;
}

.ie8 #tag {
position:static !important;
display:none !important;
}

h1 {
font-size:30px;
}

h2 {
font-size:26px;
}

#main-content {
margin-top:80px;
}

.ie8 #main-content {
margin:0 !important;
}

.top-ad-treehouse {
top:215px;
width:100%;
}

.ad-treehouse-text {
position:static;
display:block;
padding:3px 0 0 20px;
}

.the-frog-2,.the-frog-1 {
opacity:0;
}

.the-frog-3 {
opacity:1px;
}

#juice,aside {
float:none;
width:auto;
}

#juice .inside {
padding:20px;
}

.bsap_1235262 a,.bsap_1235262 a.even {
float:left !important;
width:auto !important;
margin:0 8px 8px 0 !important;
padding:1%;
}

.footer-box {
width:100%;
height:auto;
margin:10px 0;
}

.footer-box p {
width:auto;
}

.footer-box:after {
left:13%;
top:110%;
display:none !important;
}

.footer-box:hover:after {
top:60%;
left:13%;
}

.footer-link-group {
float:none;
width:100%;
border:0;
margin:0;
padding:10px !important;
}

.infoput,#inputs textarea {
-webkit-box-shadow:none;
-moz-box-shadow:none;
box-shadow:none;
border:1px solid #ccc;
}

#main-content,header .inside,footer .inside,.page #juice,.single #juice {
width:100%;
}

.main-nav a:before,#primary-sponsor {
display:none;
}
}

audio[controls],canvas,video {
display:inline;
zoom:1px;
}

html {
overflow-y:scroll;
overflow-x:hidden;
-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-text-size-adjust:100%;
-ms-text-size-adjust:100%;
}

body,button,input,select,textarea {
font-family:sans-serif;
}

a {
color:#000000;
}

a:focus {
outline:thin dotted;
}

a:hover,a:active {
outline:0;
}

abbr[title] {
border-bottom:1px dotted;
}

b,strong {
font-weight:700;
}

blockquote {
margin:1em 40px;
}

dfn {
font-style:italic;
}

mark {
background:#ff0;
color:#000;
}

pre,code,kbd,samp {
font-family:monospace, monospace;
_font-family:'courier new', monospace;
font-size:1em;
}

pre {
white-space:pre-wrap;
word-wrap:break-word;
}

q {
quotes:none;
}

q:before,q:after {
content:none;
}

small {
font-size:75%;
}

sub,sup {
font-size:75%;
line-height:0;
position:relative;
vertical-align:baseline;
}

sup {
top:-0.5em;
}

sub {
bottom:-0.25em;
}

ul,ol {
margin:0;
padding:0;
}

dd {
margin:0 0 0 40px;
}

nav ul,nav ol {
list-style:none;
}

img {
border:0;
-ms-interpolation-mode:bicubic;
}

svg:not(:root) {
overflow:hidden;
}

fieldset {
margin:0 2px;
padding:0.35em 0.625em 0.75em;
}

legend {
border:0;
margin-left:-7px;
}

button,input,select,textarea {
font-size:100%;
vertical-align:middle;
margin:0;
}

button,input {
line-height:normal;
overflow:visible;
}

table button,table input {
overflow:auto;
}

button,html input[type="button"],input[type="reset"],input[type="submit"] {
cursor:pointer;
-webkit-appearance:button;
}

input[type="checkbox"],input[type="radio"] {
box-sizing:border-box;
}

input[type="search"] {
-webkit-appearance:textfield;
-moz-box-sizing:content-box;
-webkit-box-sizing:content-box;
box-sizing:content-box;
}

input[type="search"]::-webkit-search-decoration {
-webkit-appearance:none;
}

button::-moz-focus-inner,input::-moz-focus-inner {
border:0;
padding:0;
}

textarea {
overflow:auto;
vertical-align:top;
}

table {
border-collapse:collapse;
border-spacing:0;
}

.home .main-nav .games {
-webkit-animation:nav-1 1.5s 1s ease 1px;
-moz-animation:nav-1 1.5s 1s ease 1px;
}

.home .main-nav .forums {
-webkit-animation:nav-2 1.5s 1.1s ease 1px;
-moz-animation:nav-2 1.5s 1.1s ease 1px;
}

.home .main-nav .history {
-webkit-animation:nav-3 1.5s 1.2s ease 1px;
-moz-animation:nav-3 1.5s 1.2s ease 1px;
}

.home .main-nav .applet {
-webkit-animation:nav-4 1.5s 1.3s ease 1px;
-moz-animation:nav-4 1.5s 1.3s ease 1px;
}

.home .main-nav .signup {
-webkit-animation:nav-5 1.5s 1.4s ease 1px;
-moz-animation:nav-5 1.5s 1.4s ease 1px;
}

.home .main-nav .contact {
-webkit-animation:nav-6 1.5s 1.5s ease 1px;
-moz-animation:nav-6 1.5s 1.5s ease 1px;
}

.home .main-nav .homelink {
-webkit-animation:nav-7 1.5s 1.6s ease 1px;
-moz-animation:nav-7 1.5s 1.5s ease 1px;
}

.home .main-nav .tos {
-webkit-animation:nav-8 1.5s 1.7s ease 1px;
-moz-animation:nav-8 1.5s 1.7s ease 1px;
}

#main-content {
width:80%;
margin:125px auto 35px;
}

#main-content>.inside {
position:relative;
background:#FFF;
border:8px solid transparent;
-webkit-box-shadow:0 0 8px rgba(0,0,0,0.3);
-moz-box-shadow:0 0 8px rgba(0,0,0,0.3);
box-shadow:0 0 8px rgba(0,0,0,0.3);
-webkit-background-clip:padding-box;
-moz-background-clip:padding-box;
background-clip:padding-box;
}

#juice {
width:50%;
float:left;
}

#juice .inside {
padding:50px;
}

article {
position:relative;
padding-bottom:25px;
}

figure,.image-wrap {
background:#eee;
border:1px solid #ccc;
text-align:center;
margin:0 0 25px;
padding:15px;
}

.fluid-width-video-wrapper {
width:100%;
position:relative;
padding:0;
}

.fluid-width-video-wrapper iframe,.fluid-width-video-wrapper object,.fluid-width-video-wrapper embed {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
}

article img,.image-wrap img {
max-width:100%;
height:auto !important;
}

figure img,.image-wrap img {
border:1px solid #ccc;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}

.alignright {
float:right;
margin:0 0 5px 20px;
}

article ul,article ol {
margin:0 0 25px 25px;
}

article ul ul,article ol ol {
margin:10px 0 10px 25px;
}

article ul {
list-style:disc;
}

article p,article li {
max-width:650px;
}

figure p {
max-width:100%;
}

article a,.comment a,.Message a {
color:#4b8db5;
border-bottom:1px dotted #9dc425;
padding:0 1px;
}

article a:hover,.comment a:hover,.Message a:hover {
background-color:#d9efff;
border-bottom:1px solid #2382c5;
color:#2382c5;
}

article a:active,.comment a:active,.Message a:active {
outline:0;
color:#000;
}

figcaption {
display:block;
text-align:center;
font-style:italic;
padding-top:7px;
}

.page #juice,.single #juice {
width:73%;
}

.single h1 {
margin:0 0 5px;
}

.end-of-article-stuff {
overflow:hidden;
margin-top:25px;
}

.sharing {
width:33.3333%;
float:left;
text-align:center;
color:#FFF;
margin-bottom:10px;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}

.sharing>div {
height:21px;
-moz-border-radius:15px;
-webkit-border-radius:15px;
border-radius:15px;
padding:15px 5px;
}

.sharing-twitter,.sharing-google-plus {
padding-right:10px;
}

.sharing-twitter>div {
background:#46d0fe;
}

.sharing-google-plus>div {
background:#DD4B39;
}

.sharing-facebook>div {
background:#3B5998;
}

.previous-article {
width:100%;
}

.previous-article>div {
background:#7C48B5;
height:auto;
}

.previous-article a {
color:#FFF;
border-radius:10px;
padding:3px 6px;
}

.date-bubble,.comment-bubble {
position:absolute;
width:105px;
height:90px;
-moz-border-radius:65px;
-webkit-border-radius:65px;
border-radius:65px;
left:-153px;
top:0;
background:#c0bbb9;
text-align:center;
color:#444;
padding-top:15px;
font-family:"kulturista-web-1","kulturista-web-2",Serif;
font-weight:600;
font-size:21px;
line-height:1.2;
overflow:hidden;
z-index:-1;
}

.comment-bubble {
top:90px;
color:#d8d2ce;
font-size:98px;
padding-top:0;
height:105px;
letter-spacing:-5px;
background:#cdc7c3;
text-indent:-6px;
z-index:-2;
}

.comment-bubble a {
color:#d4ceca;
}

.comments-rss-link {
display:inline-block;
text-indent:-9999px;
width:26px;
height:26px;
background:url('./images/rss.png') no-repeat;
vertical-align:middle;
}

.commentlist {
list-style:none;
padding-top:5px;
margin:0 0 30px;
}

.comment {
position:relative;
font-size:16px;
clear:both;
margin:0 0 20px;
}

.comment-content {
width:70%;
float:right;
background:#e8e8e8;
min-height:165px;
overflow:hidden;
position:relative;
-moz-border-radius:15px;
-webkit-border-radius:15px;
border-radius:15px;
border-top:1px solid #ccc;
z-index:2;
padding:15px;
}

.comment-author-wrap {
position:absolute;
left:0;
top:0;
width:25%;
display:block;
margin-top:10px;
color:#000;
font:12px "myriad-pro-1","myriad-pro-2","Lucida Grande",Sans-Serif;
}

.comment-author-wrap a {
border:0;
color:#000;
}

.comment-author {
font-size:15px;
}

.avatar {
border-radius:42px;
position:relative;
z-index:1;
}

.avatar-wrap {
width:68px;
height:68px;
border-radius:42px;
position:relative;
border:8px solid #e8e8e8;
margin:0 0 3px;
}

.avatar-wrap:before {
content:"";
position:absolute;
width:350px;
height:8px;
background:#e8e8e8;
left:60px;
top:30px;
}

.comment-reply-link {
border:none !important;
position:absolute;
bottom:10px;
right:15px;
display:block;
width:24px;
height:19px;
text-indent:-9999px;
background:url('./images/css-tricks.png') -10px -284px no-repeat !important;
opacity:0;
}

.comment-content:hover>.reply .comment-reply-link {
opacity:0.6px;
}

.comment-reply-link:hover {
opacity:1px;
}

.children {
padding-left:25px;
}

.children .children {
padding-left:0;
}

.children .avatar {
border-color:#f2f2f2;
}

.children .avatar-wrap:before {
background:#f2f2f2;
width:580px;
}

.children .comment-content {
width:50%;
background:#f2f2f2;
margin-top:-5px;
}

.comment.featured:after {
content:url('./images/icon-goldstar.png');
position:absolute;
top:-16px;
right:-12px;
z-index:5;
}

.comment p {
width:90%;
margin:0 0 15px;
}

#commentPreview .commentlist .comment {
width:auto;
float:none;
padding-bottom:15px;
}

#commentPreview .commentlist .comment:before {
content:"Comment Preview: ";
font-weight:700;
}

#commentPreview .comment-content {
width:auto;
float:none;
}

#thread-closed {
background:#D05D2A;
color:#FFF;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
font-weight:700;
padding:10px;
}

#thread-closed a {
color:#FFF;
border-bottom:1px dotted #FFF;
}

#thread-closed a:hover {
border-bottom-style:solid;
}

#respond {
position:relative;
width:100%;
}

#comment-form {
clear:both;
position:relative;
width:100%;
}

#comment-form h4 {
position:relative;
min-height:90px;
margin:10px 0 0;
}

#inputs {
position:relative;
width:75%;
float:left;
}

#inputs>div {
margin:0 0 8px;
}

.infoput {
width:48%;
position:absolute;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
font-size:18px;
padding:10px 10px 10px 45px;
}

.infoput,#inputs textarea {
font-family:"myriad-pro-1","myriad-pro-2","Lucida Grande",Sans-Serif;
background:#FFF;
border:0;
-webkit-box-shadow:inset 1px 1px 5px rgba(0,0,0,0.4);
-moz-box-shadow:inset 1px 1px 5px rgba(0,0,0,0.4);
box-shadow:inset 1px 1px 5px rgba(0,0,0,0.4);
}

#inputs textarea {
width:100%;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
height:250px;
font-size:16px;
background:#fff url('./images/comment-star.png') 110% 125% no-repeat;
-moz-transition:all 0.3s ease;
-o-transition:all 0.3s ease;
-webkit-transition:all 0.3s ease;
-ms-transition:all 0.3s ease;
margin:0 0 10px;
padding:10px;
}

#inputs textarea:focus {
background-position:130% 195%;
}

#author {
background:#fff url('./images/icon-name.png') 6px center no-repeat;
top:0;
right:0;
}

#email {
background:#fff url('./images/icon-email2.png') 6px center no-repeat;
left:0;
top:54px;
}

#url {
background:#fff url('./images/icon-web.png') 6px center no-repeat;
right:0;
top:54px;
}

#submit {
font-family:"myriad-pro-1","myriad-pro-2","Lucida Grande",Sans-Serif;
}

#commenting-tips {
width:22%;
float:right;
font-size:14px;
line-height:1.4;
}

#commenting-tips strong {
color:#dd7556;
cursor:pointer;
}

#commenting-tips strong:hover {
color:#ff8400;
}

#commenting-tips h5 {
font-size:20px;
white-space:nowrap;
margin:15px 0 5px;
}

#commenting-tips ul {
list-style:disc;
margin:0 0 0 15px;
}

#commenting-tips li {
font-size:13px;
}

#commenting-tips code {
font-size:11px;
}

#hot-links,aside {
width:19%;
float:right;
position:relative;
z-index:20;
font-size:12px;
margin:20px 30px 0 0;
}

#hot-links .inside,aside .inside {
background:url('./images/brushed_alu.png');
border:8px solid transparent;
background-clip:padding-box;
-webkit-box-shadow:0 0 8px rgba(0,0,0,0.15);
-moz-box-shadow:0 0 8px rgba(0,0,0,0.15);
box-shadow:0 0 8px rgba(0,0,0,0.15);
padding:15px;
}

aside {
width:30%;
max-width:334px;
margin-right:-40px;
margin-bottom:20px;
}

aside .button {
font-size:14px !important;
padding:4px 8px !important;
}

aside input.button {
font-size:13px !important;
margin-right:5px;
}

.sidebar-box {
clear:both;
margin:0 0 20px;
}

.one .bsa_it_ad {
font:16px/1.4 "myriad-pro-1","myriad-pro-2","Lucida Grande",Sans-Serif !important;
}

.bsa_it_t {
font-size:15px !important;
}

.bsap_1235262 a {
width:44% !important;
max-width:125px;
-webkit-box-shadow:0 0 4px rgba(0,0,0,0.4);
-moz-box-shadow:0 0 4px rgba(0,0,0,0.4);
box-shadow:0 0 4px rgba(0,0,0,0.4);
-moz-transition:background-position 0.3s ease-out;
-o-transition:background-position 0.3s ease-out;
-webkit-transition:background-position 0.3s ease-out;
-ms-transition:background-position 0.3s ease-out;
margin:0 0 8px;
padding:5px;
}

.bsap_1235262 a img {
width:100%;
float:left;
height:auto !important;
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
}

.bsap_1241308 a,.bsap_1241308 img {
width:100% !important;
height:auto !important;
max-width:330px;
}

.bsap_1250418 {
min-height:180px;
margin:0 0 100px;
}

.bsap_1250418 .bsa_it_ad {
width:48%;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
background:url('./images/brushed_alu.png') !important;
border:0 !important;
-moz-border-radius:20px;
-webkit-border-radius:20px;
border-radius:20px;
-moz-transition:all 1s ease-out;
-o-transition:all 1s ease-out;
-webkit-transition:all 1s ease-out;
-ms-transition:all 1s ease-out;
}

.bsap_1250418 .bsa_it_ad:hover {
-webkit-box-shadow:0 0 10px rgba(0,0,0,0.3);
-moz-box-shadow:0 0 10px rgba(0,0,0,0.3);
box-shadow:0 0 10px rgba(0,0,0,0.3);
-moz-transition:all 0.1s ease-out;
-o-transition:all 0.1s ease-out;
-webkit-transition:all 0.1s ease-out;
-ms-transition:all 0.1s ease-out;
}

.bsap_1250418 .bsa_it_i {
float:none !important;
}

.bsap_1250418 .bsa_it_ad img {
height:auto !important;
-moz-border-radius:9px;
-webkit-border-radius:9px;
border-radius:9px;
max-width:100%;
margin:0 0 5px;
}

.bsap_1250418 .odd {
float:left;
}

.bsap_1250418 .bsa_it_p {
display:none !important;
}

.large-treehouse-ad {
max-width:100%;
margin:0 0 10px;
}

.mini-treehouse-logo {
float:right;
position:absolute;
right:0;
bottom:-20px;
width:25%;
max-width:70px;
margin:0 0 0 10px;
}

.treehouse-ad-intro {
padding-right:25%;
position:relative;
}

#hot-links h4,aside h4 {
color:#D05D2A;
border-bottom:1px solid #D05D2A;
font-size:14px;
letter-spacing:2px;
text-transform:uppercase;
margin-bottom:10px;
padding:0 0 5px;
}

aside h5 {
font-size:24px;
line-height:1.1;
}

.sidebar-box li a {
display:block;
overflow:hidden;
background-image:0;
-webkit-background-size:200% 100%;
-moz-background-size:200% 100%;
background-size:200% 100%;
-moz-transition:all 0.26s ease-out;
-o-transition:all 0.26s ease-out;
-webkit-transition:all 0.26s ease-out;
-ms-transition:all 0.26s ease-out;
}

#subscribe-main li a {
font-size:15px;
padding:4px 0 3px 26px;
}

.cssgradients #subscribe-main li a:hover {
padding:4px 0 3px 32px;
}

#subscribe-main .rss {
background:url('./images/icon-rss.png') center left no-repeat;
}

#subscribe-main .email {
background:url('./images/icon-email.png') center left no-repeat;
}

#subscribe-main .itunes {
background:url('./images/icon-apple.png') center left no-repeat;
}

#more {
display:block;
margin:5px 0 25px;
}

.wp-polls-ul {
margin:0 0 10px;
}

.wp-polls ul li,.wp-polls-ul li,.wp-polls-ans ul li {
padding:3px 0;
}

.wp-polls-form h5 a {
color:#4B8DB5;
}

.breadcrumbs {
position:relative;
font-size:16px;
margin:0 0 15px;
padding:0 100px 0 0;
}

.breadcrumbs a {
border:0;
}

footer {
min-height:140px;
background-color:#3f3f3f;
background-image:0;
font-size:16px;
color:#FFF;
position:relative;
overflow:hidden;
}

footer>span {
position:absolute;
top:0;
width:20%;
height:4px;
}

footer>.f1 {
left:0;
background:#f3a01e;
}

footer>.f2 {
left:20%;
background:#D05D2A;
}

footer>.f3 {
left:40%;
background:#9dc425;
}

footer>.f4 {
left:60%;
background:#4b8db5;
}

footer>.f5 {
left:80%;
background:#7c48b5;
}

footer .inside {
width:80%;
margin:0 auto;
padding:25px 0;
}

#footer-boxes {
margin-top:35px;
}

.footer-box {
float:left;
width:22.97%;
height:175px;
background:#e6e2df;
-webkit-background-clip:padding-box;
-moz-background-clip:padding-box;
background-clip:padding-box;
color:#b2aaa4;
background-repeat:no-repeat;
border:8px solid transparent;
-webkit-box-shadow:0 0 8px rgba(0,0,0,0.3);
-moz-box-shadow:0 0 8px rgba(0,0,0,0.3);
box-shadow:0 0 8px rgba(0,0,0,0.3);
overflow:hidden;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
position:relative;
margin:0 2.7% 0 0;
padding:10px;
}

.footer-box h5 {
font-family:"kulturista-web-1","kulturista-web-2",Serif;
font-style:normal;
font-size:26px;
line-height:1;
font-weight:100;
letter-spacing:-1px;
margin:0 0 10px;
}

.footer-box>* {
position:relative;
z-index:1;
}

.footer-box:hover h5 {
text-shadow:0 0 4px rgba(0,0,0,0.4);
color:#FFF;
}

.footer-box:hover p {
color:#FFF;
}

.footer-box p {
font-size:12px;
width:74%;
line-height:1.5;
}

.footer-box:hover {
background-position:200px 50%;
}

.footer-box:after {
content:"";
position:absolute;
width:130px;
height:130px;
left:100%;
top:15px;
opacity:1px;
background-image:url('./images/css-tricks.png');
-moz-transition:all 0.2s ease;
-o-transition:all 0.2s ease;
-webkit-transition:all 0.2s ease;
-ms-transition:all 0.2s ease;
}

.footer-box:hover:after {
left:75%;
opacity:1px;
}

#f-wufoo:after {
background-position:-14px -982px;
}

#f-wufoo:hover {
background-color:#c03823;
}

#f-wufoo:hover p {
color:#fee17f;
}

#f-lynda:after {
background-position:-14px -1144px;
}

#f-lynda:hover {
background-color:#fed300;
}

#f-lynda:hover p {
color:#9f6618;
}

#f-diw:after {
background-position:-10px -1304px;
}

#f-diw:hover {
background-color:#237abe;
}

#f-qod:after {
background-position:-10px -1463px;
}

#f-qod:hover {
background-color:#37597a;
}

#f-qod:hover p {
color:#adbde3;
}

#f-htmlipsum:after {
background-position:-10px -1622px;
}

#f-htmlipsum:hover {
background-color:#333;
}

#f-html-ipsum:hover p {
color:#fff8da;
}

#f-bookshelf:after {
background-position:-10px -1782px;
}

#f-bookshelf:hover {
background-color:#ff8400;
}

#f-twitter:after {
background-position:-10px -1941px;
}

#f-twitter:hover {
background-color:#4ed2fe;
}

#f-forrst:after {
background-position:-10px -2103px;
}

#f-forrst:hover {
background-color:#203f16;
}

#f-forrst:hover p {
color:#92c59c;
}

.footer-link-group {
float:left;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
position:relative;
z-index:1;
}

.footer-link-group a {
display:block;
overflow:hidden;
color:#FFF;
background-image:0;
-webkit-background-size:200% 100%;
-moz-background-size:200% 100%;
background-size:200% 100%;
-moz-transition:all 0.26s ease-out;
-o-transition:all 0.26s ease-out;
-webkit-transition:all 0.26s ease-out;
-ms-transition:all 0.26s ease-out;
}

.footer-link-group-1 {
width:32%;
}

.footer-link-group-2,.footer-link-group-3,.footer-link-group-4 {
width:20%;
float:right;
border-right:1px solid rgba(255,255,255,0.2);
}

.footer-contact {
margin-top:5px;
}

.footer-contact #meee {
left:50%;
top:78%;
position:absolute;
z-index:0;
-moz-transition:all 0.26s ease-out;
-o-transition:all 0.26s ease-out;
-webkit-transition:all 0.26s ease-out;
-ms-transition:all 0.26s ease-out;
}

.footer-contact:hover #meee {
left:50%;
top:-25%;
position:absolute;
}

.footer-link-group .footer-contact a {
color:#9dc425;
}

.footer-link-group h5 {
font:bold 14px/1.4 "myriad-pro-1","myriad-pro-2","Lucida Grande",Sans-Serif;
color:#f3a01e;
letter-spacing:2px;
text-transform:uppercase;
margin:0 0 3px;
}

footer section .footer-link-group:nth-of-type(1) {
padding-right:20px;
}

footer section .footer-link-group:nth-of-type(1) small {
display:block;
margin-top:5px;
line-height:1.4;
color:#eee;
}

footer section .footer-link-group:nth-of-type(4) {
padding-left:26px;
}

video {
width:100% !important;
height:auto !important;
}

article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,.date-bubble span {
display:block;
}

body,figure,form,article li p,.children .comment {
margin:0;
}

.comment.buried,#commentPreview .comment-author-wrap,#commentPreview .reply,#wpstats {
display:none;
}

.bsap_1235262 a.even,.bsap_1250418 .even,.footer-box.last {
float:right;
}

.cssgradients .sidebar-box li a:hover,.cssgradients .footer-link-group a:hover {
background-position:100% 100%;
padding-left:5px;
}

.no-cssgradients .sidebar-box li a:hover,.no-cssgradients .footer-link-group a:hover {
text-decoration:underline;
}

footer section .footer-link-group:nth-of-type(2),footer section .footer-link-group:nth-of-type(3) {
padding-left:18px;
}