.rounded-corners (@radius: 5px) {border-radius: @radius; -webkit-border-radius: @radius;-moz-border-radius: @radius;} .box-shadow (@h, @v, @b, @c){box-shadow: @h + 0px @v + 0px @b + 0px @c;-webkit-box-shadow: @h + 0px @v + 0px @b + 0px @c;-moz-box-shadow: @h + 0px @v + 0px @b + 0px @c;} .b{border: 1px solid #000;} a{text-decoration: none;color: inherit;} .clear{float: none;clear: both;} body{margin: auto;word-wrap: break-word;} .arvo{font-family: 'Arvo', serif;} .ptsans{font-family: 'PT Sans', sans-serif; } .mono{font-family: 'Droid Sans Mono', sans-serif;} .none{display: none;} @grey: #777; @darkgrey: #222; .nsfw{ display: none; } div.sfw div{ display: block; text-align: center; padding-top: 20px; } body{ .ptsans; font-size: 14px; color: @grey; padding-top: 0px; } #main{ /*padding-top: 100px;*/ padding-top: 0px; } .container{ margin: auto; width: 1000px; } .box{ background-color: #fff; border: 1px solid #000; margin-bottom: 20px; padding: 10px 20px; } .headerBox{ padding: 20px; background-color: #000; background-color: rgba(0, 0, 0, .6); color: #fff; margin-bottom: 20px; h2{ color: #fff; font-size: 20px; } .faded{ opacity: .5; } } h2{ .arvo; font-size: 18px; color: @darkgrey; } p{ padding-bottom: 0px; } #background_img{ position: fixed; z-index: -1; width: 100%; height: 100%; background: url(images/backgrounds/1.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/backgrounds/1.jpg', sizingMethod='scale'); -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/backgrounds/1.jpg', sizingMethod='scale')"; } #nsfw-controls{ position: fixed; /* top: 35px;*/ width: 100%; z-index: 0; pointer-events: none; #toggle-container{ z-index: 200; float: right; padding: 32px 20px; /* padding-bottom: 100px;*/ background-color: rgba(0, 0, 0, .6); /* border: 2px solid #FFF; border-top: 0px;*/ div#toggle{ pointer-events: all; /*float: right;*/ cursor: pointer; } } } /*#social{ width: 100%; position: absolute; top: 35px; a{ display: block; position: relative; float: right; margin-left: 12px; z-index: 200; } a:first-child{ margin-right: 20px; } img{ filter: url(filters.svg#grayscale); /* Firefox 3.5+ *!/ filter: gray; /* IE6-9 *!/ -webkit-filter: grayscale(1); /* Google Chrome & Safari 6+ *!/ } img:hover { filter: none; -webkit-filter: grayscale(0); } }*/ #header{ width: 100%; /* position: absolute;*/ /* top: 62px; height: 33px;*/ padding-bottom: 10px; border-bottom: 1px solid #000; /* background-color: #fff;*/ background-color: rgba(255,255,255,1); #header-left{ float: left; } #header-right{ float: right; } #nav-menu{ margin-right: 170px; clear: right; float: right; height: 30px; padding-top: 20px; position: relative; z-index: 200; } #clare, #bayley{ float: left; clear: left; .arvo; color: black; } #clare{ .arvo; position: relative; right: -20px; font-size: 33px; letter-spacing: 3px; padding-top: 12px; } #bayley{ .arvo; position: relative; right: -20px; font-size: 30px; letter-spacing: 1px; padding-top: 5px; } .searchbox{ float: right; position: relative; clear: right; z-index: 200; border: 1px solid @grey; background: #fff url('./images/search.png') no-repeat right center; background-position-x: 185px; margin-right: 170px; /*margin-top: 6px;*/ input{ width: 175px; margin: 0px; margin-right: 25px; border-style: none; padding: 5px 0px 5px 5px; } } li{ float: right; /* position: relative;*/ z-index: 200; /*.arvo;*/ font-size: 15px; color: @darkgrey; text-transform: uppercase; margin-left: 30px; /*margin-top: 9px;*/ } } #footer{ width: 100%; padding: 10px 0px; border-top: 1px solid #000; background-color: rgba(255,255,255,1); .container{ text-align: center; } #footer-left, #footer-right{ padding-top: 15px; } #footer-left{ float: left; } #footer-right{ float: right; } } #age_check{ padding: 40px; background: white; border: 1px solid #000; position: fixed; left: 50%; margin-left: -205px; top: 20%; text-align: center; line-height: 20px; width: 370px; #age_check-header{ .arvo; text-transform: uppercase; font-size: 30px; margin-bottom: 20px; } #age_check-yes, #age_check-no{ border: 1px solid #000; width: 120px; padding: 10px; margin: auto; font-size: 16px; font-weight: bold; margin-top: 20px; cursor: pointer; &:hover{ .box-shadow(3,3,5,#000) } &:active{ position: relative; top: 3px; left: 3px; .box-shadow(0,0,5,#000) } } #age_check-yes{ margin-top: 40px; } } #warningtext{ margin: 200px 0; padding: 20px; background-color: #000; background-color: rgba(0, 0, 0, .6); color: #fff; font-size: 16px; line-height: 20px; #warning{ .arvo; color: red; float: left; font-size: 32px; padding-right: 20px; line-height: 40px; } } #home-infobox{ background-color: #000; background-color: rgba(0, 0, 0, .75); margin-bottom: 20px; padding: 20px; #hi{ .arvo; color: #fff; font-size: 18px; float: left; padding: 25px 20px 20px 0px; } #hi-text{ color: @grey; font-size: 14px; img{ float: right; margin-left: 20px; } .text{ padding-top: 6px; line-height: 20px; } .follow{ margin-top: 5px; img{ float: none; margin-left: 10px; position: relative; top: 4px; } } } } #content{ padding-top: 20px; } .post-single, .type-post{ .box; .post-header{ width: 100%; border-bottom: 1px solid #aaa; padding-bottom: 10px; margin-bottom: 10px; .post-meta{ float: right; .ptsans; font-size: 10px; line-height: 11px; letter-spacing: 1px; color: @grey; text-align: right; em{ font-weight: bold; } } } .post-content{ width: 640px; margin: auto; padding: 20px 0px; font-size: 14px; line-height: 20px; p, ol, ul, h1, h2, h3, h4{ margin-bottom: 10px; } ul{ list-style: disc inside none; } ol{ list-style: decimal inside none; } li{ margin-left: 50px; } a{ color: #000; &:hover{ text-shadow: 1px 1px #aaa } } em{ font-style: italic; } strong{ font-weight: bold; } .code{ .mono; background-color: #f9f9f9; border: 1px dashed @darkgrey; padding: 20px; margin: 10px 0px; } img{ max-width: 960px; display: block; margin: auto; } } .post-nav{ width: 100%; border-top: 1px solid #aaa; padding-top: 10px; margin-top: 10px; } } .newer-older{ .box; padding-top: 10px; padding-bottom: 10px; } .older, .newer{ .arvo; color: @darkgrey; font-size: 14px; } .older{ float: left; } .newer{ float: right; } #comments{ #comments-title{ .box; } li.pingback{ .box; font-size: 14px; em{ font-weight: bold; } } li.comment{ article.comment{ .box; padding: 20px; } } .comment-text{ font-size: 14px; line-height: 18px; p{ padding-bottom: 10px; } } .avatar, .meta-text{ float: left; } .meta-text{ .ptsans; font-size: 11px; line-height: 13px; float: left; padding: 0px 10px 30px; p{ padding-bottom: 0px; } } .reply{ float: right; } ul.children{ margin-left: 50px; .meta-text{ padding: 0px 10px 0px; } } #respond{ .box; #reply-title{ .arvo; font-size: 18px; color: @darkgrey; width: 100%; border-bottom: 1px solid #aaa; padding-bottom: 10px; margin-bottom: 10px; small{ color: @grey; font-size: 14px; padding-left: 15px; } } #comment{ width: 100%; margin-top: 5px; } .form-allowed-tags{ display: none; } .comment-notes{ float: right; padding-top: 5px; } .logged-in-as{ padding-bottom: 5px; a{ color: @darkgrey; } } .comment-form-author, .comment-form-email, .comment-form-url{ float: left; margin-right: 30px; } .comment-form-comment{ clear: both; } } } .type-page{ .box; } #error404{ .box; h1{ .arvo; font-size: 18px; color: @darkgrey; width: 100%; border-bottom: 1px solid #aaa; padding-bottom: 10px; margin-bottom: 10px; } .post-content{ background: transparent url('./images/404.jpg') no-repeat center 50px; height: 600px; .arvo; font-size: 24px; color: #fff; text-align: center; padding-top: 100px; #whoops{ font-size: 36px; padding-bottom: 440px; } } }