[layout 003] :: Curtain Call
[Click image for bigger preview]
Info Name:Curtain Call Style: Flexible Squares Browsers:Tested in Firefox 2.0, Internet Explorer 6 & 7, Opera 9, Safari 2 Resolutions:800x600 and up *Probably looks horrible if used with a "Plus" account
Images *Please upload these to your own server or image host. Thank you.
Code /******************************************************** * Title: 03 - Curtain Call * * Date: 2007-01-19 * * Style: Flexible Squares (S2) * * Made by: willowtree84 * * http://community.livejournal.com/lennie_layouts/ * ********************************************************/ /* ------------------- GENERAL ------------------- */ body { font-family: "Georgia", serif; font-size: 12px; margin: 0; text-align: center; background: #600 url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/bg.gif) top center repeat; } ::-moz-selection { background: #E9C9C9; color: #000; } a:link, a:visited, a:active { color: #600; text-decoration: none; border-bottom: 1px #600 dashed; } a:hover, a:focus { color: #933; border-bottom: 1px #C66 solid; } blockquote { margin: 10px 40px; padding: 10px 10px 30px 10px; font-style: italic; letter-spacing: 1px; color: #933; background: #E9C9C9 url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/blockquote.gif) bottom left repeat-x; } code, kbd, pre, tt {font-family: monospace;} hr { color: #E9C9C9; background-color: #E9C9C9; border: 0; height: 1px; width: 100%; text-align: center; margin-top: 10px; margin-bottom: 0; clear: left; } /* ------------------- NAV BAR ------------------- */ #lj_controlstrip { background: none; background-color: #933; border: 1px solid #933; } #lj_controlstrip td { color: #FFF; border: 1px solid #FFF; } #lj_controlstrip_statustext {color: #333;} #lj_controlstrip a {color: #C66;} #lj_controlstrip_user, #lj_controlstrip_userlinks, #lj_controlstrip_login {border-right: 1px solid #FFF;} #lj_controlstrip_login td {border-bottom: 0;} /* ------------------- CONTAINERS ------------------- */ #content { width: 700px; margin: 0 auto; background: #FFF url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/content.png) 0 0 repeat-y; } * html #content {background-color: transparent;} #header { width: 700px; height: 154px; text-align: left; background: #600 url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/header.gif) 0 0 repeat-x; } #sidebar { width: 200px; float: right; margin: 0; padding: 80px 0 0 0; text-align: left; color: #000; } #maincontent { margin-right: 250px; padding: 80px 0 0 0; } #footer { width: 450px; text-align: center; z-index: 100; clear: both; margin: 0 auto 0 0; color: #E9C9C9; } /* ------------------- HEADER ------------------- */ ul.navheader { padding: 15px 0 0 0; margin: 0; position: relative; top: 154px; left: 0; height: 41px; text-align: center; font-size: 1.2em; list-style-type: none; background: #600 url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/nav.png) 0 0 no-repeat; } ul.navheader li { padding: 0 25px 0 25px; display: inline; } ul.navheader li.view {color: #FFF;} ul.navheader li a:link, ul.navheader li a:visited, ul.navheader li a:active { color: #F99; border: none; } ul.navheader li a:hover, ul.navheader li a:focus {color: #FFF;} .title, .subtitle { position: relative; color: #FFF; } .title { top: 0; left: 60px; font-size: 3em; width: 580px; font-variant: small-caps; } .subtitle{ top: -5px; left: 140px; width: 500px; font-style: italic; } /* ------------------- SIDEBAR ------------------- */ .defaultuserpic { text-align: center; display: none; } .sbarbody {padding: 0;} .sbarbody2 { margin: 0; padding: 30px 10px 10px 10px; background: transparent url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/sidebar_titles.gif) top left no-repeat; } table.calendar { margin-right: auto; margin-left: auto; padding-right: 5px; text-align: center; color: #E9C9C9; } .sbarcalendar {border: 1px #E9C9C9 solid;} .sbarcalendarposts { border: 1px #E9C9C9 solid; background-color: #E9C9C9; } .sbarcalendarposts a {border: none;} ul.sbarlist { padding-left: 0; margin: 0; list-style: none; } ul.sbarcontent { margin: 0; padding: 30px 10px 10px 10px; background: transparent url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/sidebar_titles.gif) top left no-repeat; } li.sbartitle { list-style: none; padding: 30px 0 1px 10px; margin: 0; color: #600; text-align: left; background: url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/sidebar_bottom.png) 0 0 no-repeat; font-variant: small-caps; font-weight: bold; } /* ------------------- MAINCONTENT ------------------- */ #content .ljuser a {border: none;} .entry { margin: 0; padding: 30px 10px 10px 10px; text-align: justify; font-size: 1.1em; line-height: 1.3em; background: transparent url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/subject.png) top left no-repeat; } .entry ul, .entry ol { padding: 5px 0 0 15px; margin: 0; list-style: none; } .entry ul li, .entry ol li { padding: 0 0 0 15px; background: url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/bullet.gif) 0 .6em no-repeat; } .entry a img, .userpic a img, .userpicfriends a img, .Userpic a img {border: none;} .userpic, .userpicfriends { position: relative; float: right; padding: 0; margin: 0 0 5px 10px; text-align: center; z-index: 15; background-color: transparent !important; } .userpic, .userpicfriends {display: none;} /*.userpicfriends a {display: none;}*/ .datesubject { margin: 0; padding: 5px 5px 1px 9px; background-color: transparent; text-align: left; color: #600; } .date {top: 5px;} .subject { padding: 5px 0 0 0; font-weight: bold; font-variant: small-caps; } .datesubject a:hover, .datesubject a:focus {color: #FFF;} .ljtags { margin-top: 25px; font-weight: bold; } .ljtags a {font-weight: normal;} .currents, .ljtags { font-size: 0.9em; color: #E9C9C9; } .currents img {display: none;} .comments { font-size: 0.9em; text-align: right; background-color: transparent; padding: 0; margin: 0; clear: left; } /* ------------------- MAINCONTENT -- year/achive pages ------------------- */ ul.year { text-align: center; margin: 0; padding: 0; } ul.year li { display: inline; color: #E9C9C9; } table.yeartable { margin: 25px auto 0 auto; border: 1px #E9C9C9 solid; } table.yeartable td.yeardate, table.yeartable td.yearday { border: 1px #E9C9C9 solid; color: #E9C9C9; } table.yeartable td.yearday { background-color: #E9C9C9; color: #FFF; text-align: center; } td.yearmonth { border-style: none; color: #E9C9C9; } table.yeartable td.yeardate a {border: none;} /* ------------------- MAINCONTENT -- entry, reply pages ------------------- */ .datesubjectcomment { background-color: #E9C9C9 !important; padding: 5px; color: #FFF; } .userpiccomment { position: relative; float: left; background-color: #FFF; padding: 2px; margin: 0 5px 5px 0; z-index: 15; border: 1px #FC6 solid; } .box { border: none; border-top: 1px #E9C9C9 solid; margin-left: 10px; padding: 10px 10px 10px 0; text-align: left; } .box font{color: #000;} .box form#qrform table { border: 1px #E9C9C9 solid !important; margin-top: 10px; padding: 10px; } input, textarea, select, submit, button { background-color: #FFF; color: #000; border: 1px #E9C9C9 solid; } textarea.textbox { width: 100% !important; border: 1px #E9C9C9 solid; } submit, button {color: #E9C9C9;} .reply{ position: relative; margin: 20px 30px 10px 30px; padding: 25px 10px 10px 10px; text-align: left; line-height: 125%; background-color: #FFF; color: #E9C9C9; } .replytosubject { font-weight: bold; color: #FFF; } .replytoposter {color: #FFF;} .commentreply { position: relative; margin: 10px 5px; color: #000; background-color: #FFF; text-align: justify; } .commentbox { border: 1px #E9C9C9 solid; padding: 5px; margin: 10px 0; background-color: #FFF; } .commentbox div a { border: none; } .datesubjectcomment a:hover {color: #FFF;} .commentboxpartial { border: 1px #E9C9C9 solid; padding: 5px; margin: 10px; background-color: #FFF; } .commentinfo { background-color: #E9C9C9; margin-top: 10px; width: 100%; } /* ------------------- FOOTER ------------------- */ ul.navfooter{ padding: 0; margin: 0; } ul.navfooter li { display: inline; margin: 0 5px 0 5px; } .clearfoot {clear: both;} /* ------------------- MISC ------------------- */ .clear {height: 15px;} #maincontent .clear, #maincontent .entry .clear {height: 0;} .skiplinks { text-align: center; padding: 10px 0; } .separator{ height: 21px; width: 450px; margin: 0 auto 5px 0; background: url(http://img.photobucket.com/albums/v286/willowtree84/lj_layout/shared_layouts/layout_004/entry_bottom.gif) 0 0 no-repeat; } * html .separator {margin: 0 auto;}
Notes If you find something wonky or you have any problems with this layout, please let me know.