Layout 055 : Hope Orange

Jul 17, 2012 22:56

This layout was created in hopes to fundraise for my Relay for Life team. All collections are used to fund Cancer research. Use this free Livejournal Layout if Cancer has impacted your life in some way or another. In return, I simply ask you to spread my message by Reposting (click Repost button below).

I encourage you to read my story, and donate to fight back Cancer ($5 to $10 is a generous amount).

Thank you, donators: gimmick_game, mousewings



Click for a Live Preview.




Hope Orange
Layout 055
This layout was created in hopes to fundraise for my Relay for Life team. Use this free Livejournal Layout if Cancer has impacted your life in some way or another. In return, I simply ask you to spread my message by reposting. I aim to raise $100 in online donations. Every dollar and penny will be put towards combating Cancer.
Quick Layout Install
01. System

Select Theme
  1. Select any S2 Minimalism - Penguins layout.

02. Display
  1. Add text to your sidebar
  2. Add links

03. Custom CSS

Custom CSS
  1. Use layout's stylesheets: No. IMPORTANT!!

  2. Custom Stylesheet:
    /* S2 MINIMALISM --- 056 Hope Orange ---
    Fruitstyle @ LJ --- www.malionette.net ---
    Do not remove this note. */

    /* --------------------------- BODY --------------------------- */

    body {font: 9pt arial; color: #606060; background: #fff; margin: 0; }

    a {text-decoration: none; color: #ef9e1e; }
    a:hover {color: #ffbb00; }

    .hr {display: none; }

    .ljuser a, .subj-link { margin: 0 0 0 5px; }

    blockquote {
    display: inline-block; position: relative; padding: 5px 10px 5px 10px;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-bottom: 2px solid #dddddd; border-top: 2px solid #dddddd;
    font: 10px georgia; letter-spacing: 1px;
    }

    blockquote:first-letter {text-transform: uppercase; font-size: 24pt; padding: 0 3px 0 0; color: #dddddd; float: left ; }

    input, select, #lj_controlstrip input, #lj_controlstrip select {background: #f5f5f5; border: 0; font: 10px arial !important; color: #606060; padding: 1px; }
    textarea {border: 0; background: #f5f5f5; font: 12px arial; color: #606060; }

    ul {}
    li {list-style-type: circle; list-style-color: #dddddd;}

    /* --------------------------- HEADER --------------------------- */

    .header {border-top: 10px solid #dddddd; width: 960px; margin: 0 auto; padding: 0; height: 80px; overflow: hidden; }
    .header h2 {color: #ffc128; font: 16px arial; letter-spacing: -.5px; margin: 20px 0 5px 0; padding: 0; height: 20px;}
    .header h3 {color: #aaaaaa; font: 10px georgia; text-transform: uppercase; letter-spacing: 3px; margin: 5px 0 20px 0; height: 16px; padding: 0; }

    .nav-sub, .u-wrap h1 {display: none;}

    .u-wrap .userpic {position: absolute; margin-top: 80px; z-index: 30;}

    .nav {position: absolute; padding: 3px 0 0 0; margin: 0px 0 0 110px; width: 110px; z-index: 30; }
    .nav li {display: block; background: #ffbb00 url(http://i46.tinypic.com/x0s5s3.png) repeat-x; text-shadow: 0 -1px 1px #606060; color: #fff;
    display: inline-block; position: relative; margin: 3px 0 0 0; width: 100px; font-size: 11px; font-weight: bold;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; -moz-box-shadow: 0 1px 3px #aaaaaa; -webkit-box-shadow: 0 1px 3px #aaaaaa;
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.2); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.2); text-shadow: 0 -1px 1px rgba(0,0,0,0.15);}
    .nav a {color: #ffffff; display: block; padding: 3px 10px 3px 10px; }

    .nav li:hover {background-color: #ffa71d;}
    .nav li.item-selected:hover {background-color: #ffbb00;}
    .nav li a:hover { text-shadow: 0 -1px 1px rgba(0,0,0,.4);}
    .nav .item-selected a, .nav .item-selected a:hover { color: #fff; text-shadow: 0 -1px 1px rgba(0,0,0,0.15); }

    /* --------------------------- SIDEBAR --------------------------- */

    .sidebar { overflow: hidden; z-index: 20; position: relative; margin-top: -100px; height: 100px; background: #ffa71d url(http://i46.tinypic.com/x0s5s3.png) repeat-x; }
    .sidebar-inner { width: 796px; overflow: hidden; margin: 0 auto; padding: 0 0 0 260px; background: url(http://i46.tinypic.com/a35lx.png) no-repeat 0px 0px; height: 100px; }

    .sidebar dd, .sidebar dt, .sidebar dl {margin: 0; padding: 0;}

    .sidebar dd {}

    .sidebar-powered, .sidebar-cal, .sidebar-summary, .sidebar-block dt, .sidebar-tags, .sidebar-block {display: none;}

    .sidebar-links { position: absolute; display: block; z-index: 40;}
    .sidebar-links dd { display: inline; font: 10px arial; float: left; margin: 76px 0 0 0;}
    .sidebar-links dd a {display: block; padding: 3px 10px 3px 10px; color: #ffffff; text-shadow: 0 -1px 1px rgba(0,0,0,0.2);}
    .sidebar-links dd a:hover {color: #ffdf90;}

    .sidebar-custom {color: #ffffff; padding: 10px !important; font: 10px arial; overflow: hidden; line-height: 150%; width: 730px;
    height: 52px; text-shadow: 0 -1px 1px rgba(0,0,0,0.2); display: block; z-index: 50; position: absolute;}

    .sidebar-custom a {color: #ffdf90; letter-spacing: 1px;}
    .sidebar-custom a:hover {color: #ffffff;}

    /* --------------------------- CONTENT --------------------------- */

    .content {width: 960px; margin: 0 auto; margin-top: 100px; }
    .content-inner { float: left; background: #ffffff; padding: 0; z-index: 5; padding-top: 0px;}
    .content-inner-in { }

    /* --------------------------- ENTRY HEADER --------------------------- */

    #post-sticky {display: inline-block; position: relative; padding: 5px 10px 5px 10px; width: 720px;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-bottom: 2px solid #dddddd; border-top: 2px solid #dddddd;
    font: 10px georgia; letter-spacing: 1px; }
    #post-sticky .entry-title {margin: 10px 0 0 0;}

    .entry { padding: 0; border-bottom: 2px solid #dddddd; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin: 20px 0 0 112px;}

    .entry-title { font: 12px georgia; position: relative; padding: 0 0 20px 0; letter-spacing: -.5px; font: 16px arial; }
    .entry-title a {color: #ffc128; margin: 0;}
    .entry-title a:hover {color: #ef9e1e; }
    .entry-title img {float: right;}

    /* --------------------------- ENTRY META --------------------------- */

    .metadata { margin: 0 0 20px 0; font-size: 10px; }
    .metadata dt {float: left; padding: 0 5px 0 0; color: #aaaaaa; }

    .vcard dt, .vcard dl, .vcard dd {padding: 0; margin: 0;}

    .vcard { float: left; margin: -38px 0 0 -112px;}
    .vcard img {-moz-border-radius: 5px; -webkit-border-radius: 5px; border-top: 2px solid #dddddd; border-bottom: 2px solid #dddddd; padding: 5px 0 5px 0;}
    .username {font-size: 0px; }
    .username .ljuser, .entry-repost .ljuser, .entry-repost, .entry-repost a {display: block; font-size: 9px; text-transform: uppercase; }
    .username a {display: block; }
    .username img, .entry-repost img {display: none;}
    .vcard dt img { }
    .vcard dd {text-align: center;}
    .vcard .updated {color: #aaaaaa; font-size: 9px; border-bottom: 0; }

    /* --------------------------- ENTRY TEXT & FOOTER --------------------------- */

    .entry-text { margin: 0; padding: 0 0 20px 0; }

    .entrymenu {margin: 0; padding: 0 0 10px 0; clear: both; }
    .entrymenu ul {padding: 0; margin: 0; }
    .entrymenu li {display: inline; background: #ffbb00 url(http://i46.tinypic.com/x0s5s3.png) repeat-x; text-shadow: 0 -1px 1px #606060; color: #fff;
    display: inline-block; position: relative; margin: 8px 10px 0 0; font-size: 11px; font-weight: bold; float: left;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; -moz-box-shadow: 0 1px 3px #aaaaaa; -webkit-box-shadow: 0 1px 3px #aaaaaa;
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.2); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.2); text-shadow: 0 -1px 1px rgba(0,0,0,0.15);}
    .entrymenu a {color: #ffffff; display: block; padding: 3px 10px 3px 10px;}
    .entrymenu li:hover {background-color: #ffa71d;}

    .ljtags { font: 10px arial; margin: 20px 0 0 0; }

    .entrysubmenu { padding: 0; margin: 0; }
    .entrysubmenu ul {padding: 0; margin: 0; padding: 0 0 20px 0;}
    .entrysubmenu li {display: inline; font: 10px georgia; letter-spacing: 1px; text-transform: uppercase; padding: 0; margin: 0 10px 0 0;}
    .entrysubmenu li a {color: #aaaaaa; }
    .entrysubmenu li a:hover {color: #aaaaaa; }

    /* --------------------------- FOOTER --------------------------- */

    .page-nav {padding: 20px 0 0px 0; margin: 0 0 20px 0; text-align: center; }
    .page-nav li { display: inline;
    position: relative; margin: 8px 10px 0 0; font-size: 11px; font-weight: bold; list-style: none; }
    .page-nav a {color: #ffffff; padding: 3px 10px 3px 10px; background: #ffbb00 url(http://i46.tinypic.com/x0s5s3.png) repeat-x; text-shadow: 0 -1px 1px #606060; color: #fff;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; -moz-box-shadow: 0 1px 3px #aaaaaa; -webkit-box-shadow: 0 1px 3px #aaaaaa;
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.2); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.2); text-shadow: 0 -1px 1px rgba(0,0,0,0.15);}
    .page-nav li:hover {background-color: #ffa71d;}

    /* --------------------------- ARCHIVE / TAGS --------------------------- */

    .view-archive .entry {width: 100%;}

    .view-archive .entry ul {padding: 0; margin: 0; text-align: center; padding: 10px; }
    .view-archive .entry li {display: inline; margin: 0 5px 0 5px; }

    .view-archive .entry table {width: 100%; margin: 0 auto;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-bottom: 2px solid #dddddd; border-top: 2px solid #dddddd; border-right: 1px solid #dddddd; margin-top: 10px; }
    .view-archive .entry table caption {letter-spacing: -.5px; font-size: 16px; text-transform: lowercase; padding: 0 0 10px 0; }
    .view-archive .entry td, .view-archive .entry th {border-left: 1px solid #dddddd; border-bottom: 1px solid #dddddd; text-align: center; }
    .view-archive .entry {padding-bottom: 10px;}

    .view-tags .entry {padding: 10px;}

    /* --------------------------- COMMENTS PAGE --------------------------- */

    .entry-linkbar img {float: none; }

    .entry-linkbar a img, .comment-head-in a img { opacity: .5; }
    .entry-linkbar a img:hover, .comment-head-in a img:hover { opacity: .8; }

    .entry-comments-text { padding: 10px; }

    .comments-links {clear: both; text-align: center;}
    .comment-wrap {clear: both; padding: 10px; margin: 5px 0px 5px 0px;
    -moz-border-radius: 5px; -webkit-border-radius: 5px; border-bottom: 2px solid #dddddd; border-top: 2px solid #dddddd; }

    .comment-upic {float: left; margin: 10px; }
    .comment-text {border-top: 1px solid #dddddd; padding: 10px; margin: 0 0 10px 0; }

    .screened {background: #f5f5f5; }

    .comment-head-in a img {border: 0;}

    /* --------------------------- REPLY FORMS --------------------------- */

    #postform a img, #qrform table a img {border: 0;}
    #postform table, #postform table textarea {width: 100%; }

    #qrform table {border: 1px solid #dddddd !important; }

    /* --------------------------- LJ CUSTOMS --------------------------- */

    ::-moz-selection { background: #ffbb00; color: #ffffff; }
    ::selection { background: #ffbb00; color: #ffffff; }
    code::-moz-selection { background: #ffbb00; color: #ffffff; }
    code::selection { background: #ffbb00; color: #ffffff; }

    /* Generated by Malionette's Tiny Icon Generator
    http://malionette.net/generator/tinylite.html
    Icons from: http://www.brandspankingnew.net/
    */

    span.i-ljuser img[src*="img/userinfo.gif"], span.i-ljuser img[src*="userhead"] {width: 0 !important; height: 0 !important;
    background: transparent url(http://img3.imageshack.us/img3/8447/personl.gif) no-repeat !important; padding: 11px 2px 0 10px !important; }
    span.i-ljuser img[src*="img/community.gif"] {width: 0 !important; height: 0 !important;
    background: transparent url(http://img28.imageshack.us/img28/4821/starxq.gif) no-repeat !important; padding: 11px 2px 0 10px !important; }
    span.i-ljuser img[src*="img/syndicated.gif"] {width: 0 !important; height: 0 !important;
    background: transparent url(http://img692.imageshack.us/img692/6856/cubet.gif) no-repeat !important; padding: 11px 0 0 10px !important; }
    img[src*="img/icon_protected.gif"] {width: 0 !important; height: 0 !important;
    background: transparent url(http://img19.imageshack.us/img19/823/lockv.gif) no-repeat !important; padding: 11px 0 0 10px !important; }
    img[src*="img/icon_private.gif"] {width: 0 !important; height: 0 !important;
    background: transparent url(http://img3.imageshack.us/img3/2707/shields.gif) no-repeat !important; padding: 11px 0 0 10px !important; }
    img[src*="img/icon_groups.gif"] {width: 0 !important; height: 0 !important;
    background: transparent url(http://img19.imageshack.us/img19/823/lockv.gif) no-repeat !important; padding: 11px 2px 0 10px !important; }

    .entry-content span.i-ljuser img[src*="img/userinfo.gif"], .entry-content span.i-ljuser img[src*="userhead"], .entry-content span.i-ljuser img[src*="img/community.gif"]
    {padding-top: 13px !important;}

    /* --------------------------- INSERT ANY NEW CODE BELOW --------------------------- */


04. Give Love

First, press the Repost button.

Please link back to fruitstyle so others can find my layouts. Put either a button or the code in your Userinfo.
ButtonCode


View available buttonsLayout by fruitstyle
Customize and Personalize (Optional)
[- Click to slide open Customization options and hints. - ]

Add a Banner

The recommended banner size is 960px wide.
.layout {padding-top: ###px; background: url(TTP://URLHERE.PNG) no-repeat top center;}
Note: The top links will cover part of your header and your header will automatically have rounded edges.
  1. Replace HTTP://URLHERE.PNG with your banner url
    Replace ### with your banner height (pixels)
  2. Add the code to the bottom of the Custom Stylesheet box

Replace Colours
#ffffff#ffdf90#ffc128#ffbb00#ffa71d#f5f5f5#ef9313#dddddd#aaaaaa#606060
How do I replace layout colours?

Replace Images

Get all the images at Box.net

How do I replace layout images?


Fruitstyle: Livejournal Layouts by Malionette




layouts

Previous post Next post
Up