/* Theme Name: littlest MONSTER Theme URI: http://www.repeatpenguin.com/ Description: The Littlest Monster theme was designed and coded by Jeremy Anderson. Version: 1.0 Author: Jeremy Anderson [ Object Adjective ] Author URI: http://www.objectadjective.com */ /* Main Globals --------------------------------------------------------------------------------------------*/ body {margin: 0; padding: 0; text-align: center; font-family: Verdana, Helvetica, sans-serif; font-size: 90%; color: #4e3e3c; background: #b8bab9 url(../img/body-bg.jpg) 0 0 repeat; min-width: 800px;} * html body {font-size: 75%;} :first-child+html body {font-size: 75%;} body, html {min-height: 100.1%;} img {border: 0;} table {border-collapse: collapse;} td {vertical-align: middle;} ul {list-style: none; margin: 10px 0 10px -9px;} * html ul {margin-left: 30px;} *:first-child+html ul {margin-left: 30px;} li {margin: 0;} .hr {background: transparent url(../img/dot-line.jpg) 0 bottom repeat-x; height: 4px; margin: 18px 0;} .small {font-size: 90%;} .skip {display: none;} .block, #content .block {display: block !important;} .none {display: none;} .normal {font-weight: normal !important;} /* Global Float Control Classes (left=float: left, right=float: right, shocking!) --------------------------------------------------------------------------------------------*/ .left {float: left;} .right {float: right;} .center {text-align: center;} .clear {clear: both;} /* Links --------------------------------------------------------------------------------------------*/ :focus, :active {outline: none !important;} a {color: #f39d6a; padding: 1px 2px; font-weight: bold; text-decoration: none;} a:visited {color: #e2b79e;} a:hover, a.hover {color: #405661; background-color: #f4f6f5; text-decoration: none;} /* Main Wrapper --------------------------------------------------------------------------------------------*/ #wrapper {width: 100%; height: 100%; margin: 0 auto; background: transparent url(../img/header-bg.jpg) 0 0 repeat-x; text-align: center;} /* Header --------------------------------------------------------------------------------------------*/ #header {height: 329px; width: 800px; background: transparent url(../img/deadgirl.png) 0 0 no-repeat; margin: 0 auto;} #header form {width: 246px; float: right; margin: 22px 19px 0 0;} * html #header form {margin: 15px 8px 0 0;} #s {background: #e8eae9 !important; width: 178px; float: left; margin-right: 10px; color: #afb0af; padding-top: 3px;} #header .btn-search:after {content: "."; clear: both; height: 0; visibility: hidden; display: block;} * html #header .btn-search {height: 22px;} #header #logo {height: 92px; width: 294px; padding: 0; display: block; float: left; margin: 5px 0 29px 262px; background: transparent url(../img/littlestmonster.jpg) 0 0 no-repeat; text-indent: -4000px;} * html #header #logo {margin-left: 21px; clear: both; float: none;} #header #logo:hover {background-position: 0 -92px;} #header .quote {clear: both; color: #7f8b7d; font-family: "Courier New", Courier, monospace; font-style: italic; margin: 0 10px 0 592px; text-align: left;} /* Nav */ #nav {height: 38px; margin-left: 163px;} #nav a {height: 27px; background: transparent url(../img/nav.jpg) 0 0 no-repeat; display: block; float: left; margin: 4px 8px 0 0; text-indent: -4000px; padding: 0;} * html #nav a {position: relative;} #nav #home {margin-right: 396px; width: 27px;} #nav #home:hover {background-position: 0 -27px;} #nav #home.on {background-position: 0 -54px;} #nav #archives {background-position: -35px 0; width: 79px;} #nav #archives:hover {background: transparent url(../img/nav.jpg) -35px -27px no-repeat;} #nav #archives.on {background-position: -35px -54px;} #nav #mici {background-position: -122px 0; width: 47px;} #nav #mici:hover {background: transparent url(../img/nav.jpg) -122px -27px no-repeat;} #nav #mici.on {background-position: -122px -54px;} #nav #blink {background-position: -174px 0; width: 58px;} #nav #blink:hover {background: transparent url(../img/nav.jpg) -174px -27px no-repeat;} #nav #blink.on {background-position: -174px -54px;} /* Content --------------------------------------------------------------------------------------------*/ #mid-wrap {width: 800px; margin: 0 auto; text-align: left; background: transparent url(../img/content-mid.jpg) 23px 0 repeat-y;} #mid {width: 800px; background: transparent url(../img/content-top.jpg) 0 0 no-repeat; padding-top: 31px;} #content {width: 499px; float: right; margin-right: 84px;} * html #content {margin-right: 42px;} #content .date, .monthtitle {color: #f39d6a; font-weight: bold; padding: 24px 0 0 29px; background: transparent url(../img/date.jpg) 0 2px no-repeat;} #content .monthtitle {display: block;} h2 {margin: 6px 0 18px 0;} h2 a {color: #405661;} h2 a:hover {color: #261e1d; background: transparent;} h3 {color: #61645d; font-size: 120%; margin: 18px 0 5px 0;} #content img {background: #fff; padding: 8px; border: 1px solid #b8bab9; border-width: 0 0 1px 1px; position: relative; top: -12px; right: -41px; visibility: hidden;} #content p {margin: 18px 0; text-align: justify;} #content .img, #content .img-lg {background: #e0e1e1; margin: 24px -20px 6px 18px; width: auto; float: right; text-align: right;} #content p.img-lg {float: none; position: relative; right: 0;} #content .img img, #content .img-lg img {visibility: visible;} #content p span.clear {display: block; clear: both;} #content .post {background: transparent url(../img/dot-line.jpg) 0 bottom repeat-x; padding-bottom: 18px; margin-bottom: 18px; clear: both;} #content .postmetadata {color: #afb0af; font-size: 95%; clear: both; margin: 18px 0;} #content .postmetadata a {color: #14303b; text-decoration: underline; font-weight: normal;} #content .postmetadata a:hover {color: #405661; background: transparent; text-decoration: none;} #content .postcat {background: transparent url(../img/cat-icon.jpg) 0 0 no-repeat; padding: 3px 0 0 22px;} #content .postcat a {font-weight: bold;} #content .postcat span a {font-weight: normal; text-decoration: underline;} #content .postmetadata .postcomment a, .postcomment span {color: #f39d6a; font-weight: bold; background: transparent url(../img/comment-icon.jpg) 0 12px no-repeat; padding: 0 0 19px 26px; text-decoration: none;} * html #content .postmetadata .postcomment a {padding-bottom: 25px;} *:first-child+html #content .postmetadata .postcomment a {padding-bottom: 25px;} .postcomment span {padding-left: 32px;} #content .postmetadata .postcomment a:hover {background: transparent url(../img/comment-icon.jpg) 0 -42px no-repeat; color: #405661;} #content .navigation .right {width: 40%; text-align: right; padding-right: 20px; background: transparent url(../img/arrow-right.jpg) right 0 no-repeat;} #content .navigation .left {width: 40%; text-align: left; padding-left: 20px; background: transparent url(../img/arrow-left.jpg) 0 0 no-repeat;} #content .top {margin-bottom: 18px;} .commentlist div {padding: 10px; overflow: hidden;} .commentlist .alt {background: #f4f6f5;} #content blockquote {margin: 18px 50px; border-left: 2px solid #ddd; padding-left: 15px;} .postspermonth a {font-weight: normal !important; color: #405661;} /* Form Styles --------------------------------------------------------------------------------------------*/ #content form {margin-top: 18px;} input, #content #s, textarea {background: #f4f6f5 !important; height: 20px; width: 250px; padding: 2px 4px 0 4px; border: 1px solid #afb0af;} input:focus, input.focus, textarea:focus, #s.focus, #content #s:focus {background: #e8eae9 url(../img/inputfocus.jpg) 0 0 repeat-x !important; border-color: #8c371b; color: #14303b !important;} textarea {height: 300px; width: 491px; font-family: Verdana, Helvetica, sans-serif; font-size: 97%;} .btn-search, .btn-search2 {height: 22px; width: 48px; display: block; float: left; background: transparent url(../img/search.jpg) 0 0 no-repeat; text-indent: -4000px; padding: 0; margin-top: 2px;} .btn-comment {height: 22px; width: 74px; display: block; float: left; background: transparent url(../img/btn-comment.jpg) 0 0 no-repeat; text-indent: -4000px; padding: 0; margin-top: 20px;} .btn-search:hover, .btn-search2:hover, .btn-comment:hover {background-position: 0 -22px;} #content form label {display: block; margin-bottom: 3px;} #content form label span {font-size: 90%; color: #f39d6a;} #content form div {margin: 5px 0;} /* Sidebar Styles --------------------------------------------------------------------------------------------*/ #sidebar {width: 138px; float: left; margin: 65px 0 60px 36px;} * html #sidebar {left: -30px; position: relative;} #sidebar a {color: #d88c5f; padding: 0 5px; margin: 5px 0; display: block; font-weight: normal;} #sidebar a:hover {background: #ced5c9;} #sidebar h3 {font-size: 100%; margin-left: 5px;} #sidebar .hr {background: transparent url(../img/hr.jpg) 0 0 repeat-x; margin: 16px 0 0 0;} #sidebar .subscribe {font-weight: bold; color: #df8956; background: transparent url(../img/rss.jpg) 0 3px no-repeat; padding-left: 15px;} #sidebar .subscribe:hover {color: #405661; background: transparent url(../img/rss.jpg) 0 -21px no-repeat;} /* Footer Styles --------------------------------------------------------------------------------------------*/ #footer {height: 221px; background: transparent url(../img/footer.jpg) 0 6px repeat-x; color: #345a6a; margin-bottom: -12px;} #footer .base {width: 611px; background: transparent url(../img/footer-bg.jpg) 0 0 no-repeat; padding: 40px 0 0 189px; margin: 0 auto; text-align: left;} #footer a {font-weight: bold; color: #3e6c7f; margin: 0 5px;} #footer a:hover {color: #f0b28d; background: transparent;} #footer .credits {background: #261e1d url(../img/bunny.jpg) 15px 0 no-repeat; margin: 115px 0 0 0; padding: 21px 15px 20px 44px; text-align: left;} #footer .credits span {display: block; width: 297px; text-align: right; float: right;} #footer .credits span a {color: #afb0af; margin: 0;} #footer .credits span a:hover {color: #f0b28d;} #footer .credits span:after {content: "."; clear: both; height: 0; visibility: hidden; display: block;} * html #footer .credits span {height: 1px;}