030 - Layout 010 [Flexisquares: Not Flowers] 

Dec 18, 2008 18:52


I have a headache. But I'm a little bored ('cause I don't have work to do!) so I decided to post this.
ilonga asked me to make a layout with a specific header. A small image (to my parameters, lol). So this one was kind of difficult because all my layouts are enormous. But I like the result. Watch the original here.
And enjoy these!



Live preview | Image Preview





Live preview | Image preview
/********************DO NOT REMOVE THIS******************** Layout 010 [Not Flowers] by Yam @ Frozen Mint (frozen_mint.livejournal.com) Style: Flexible Squares Account level: Basic / Paid / Plus Tested on: IE (7 and higher), Firefox, Safari and Chrome CREDITS: Vector in header provided by DryIcons (http://dryicons.com/free-graphics/) W/O SIDEBAR *****************************************************/ /*****BASICS*****/ * {margin: 0; padding: 0;} i, em{font-style:italic;} .ippu {font-size:12px;} a{outline:none;} a img{border:0;} p, td {font-size:inherit;} code, kbd, pre, tt {font-family:monospace;} body { background:#000 url(http://www.mentahelada.net/lj-layouts/layout010/bg-body.png) top left repeat fixed; color:#231f20; font-family:"Trebuchet MS", Tahoma, Helvetica, san-serif; font-size:100%/*16px*/; line-height:104%; } a, a:link, a:visited { color:#ce171f; font-weight:normal; text-decoration:none; text-transform:none; } a:hover {text-decoration:underline;} blockquote { background:#231f20; border-left:20px solid #ce171f; margin:10px auto; padding:20px 20px 20px 15px; width:70%; color:#fff; font-size:1.0833em/*13px*/; font-style:italic; text-align:left; } ::-moz-selection { background:#ce171f; color:#f4f4f4; } b, strong{ color:#bb141a; font-weight:bold; } /*****LAYOUT*****/ #content { background:#transparent; margin:0 auto; padding:0; width:750px; } #header { background:transparent url(http://www.mentahelada.net/lj-layouts/layout010/bg-header.png) top right no-repeat; height:350px; margin:0; padding:0; font-family:"Times New Roman", Times, serif; font-size:1.375em/*22px*/; text-align:left; } #sidebar { display:none; } #maincontent { background:transparent; margin: 0 0 0 25px; font-size:0.75em/*12px*/; } #footer { background:transparent; font-size:0.75em/*12px*/; text-align:right; } /*****HEADER*****/ ul.navheader { margin:0; padding:135px 0 0; width:253px; } ul.navheader li{ list-style:none; margin:0 0 5px; padding:0; } #header li.view { background:#ce171f; border:1px solid #ce171f; display:block; margin:0 0 5px; padding:10px 20px; color:#f4f4f4; font-style:italic; font-weight:normal; text-align:right; text-decoration:none; text-transform:lowercase; } #header a, #header a:link, #header a:visited { background:#000; border:1px solid #000; display:block; margin:0 0 5px 25px; padding:10px 15px; color:#f4f4f4; font-style:italic; font-weight:normal; text-align:right; text-decoration:none; text-transform:lowercase; } #header a:hover { background:#ce171f; border:1px solid #ce171f; margin:0 0 5px; padding:10px 20px; color:#f4f4f4; } .title, .subtitle {display:none;} /*****SIDEBAR******/ .defaultuserpic { display:none; margin:auto; text-align:center; } .defaultuserpic img { border:10px solid #f9f9f9; } li.sbartitle { background:#bb141a; border-right:1px solid #f0f0f0; list-style:none; margin-top:15px; padding:10px 15px; color:#f4f4f4; font-family:"Times New Roman", Times, serif; font-size:1.3333em/*16px*/; font-style:italic; text-align:right; text-transform:lowercase; font-weight:normal; } .sbarbody2 { background-color:#f9f9f9; border-right:1px solid #f0f0f0; padding:10px; } div#sidebar a, div#sidebar a:link, div#sidebar a:visited { color:#ce171f; font-weight:normal; text-decoration:none; text-transform:none; } div#sidebar a:hover { background:transparent; font-weight:normal; text-decoration:underline; } ul.sbarlist {list-style:none;} li.sbaritem { background:#f9f9f9; border-bottom:1px solid #f0f0f0; border-right:1px solid #f0f0f0; padding:5px 15px; font-weight:normal; text-align:right; text-decoration:none; text-transform:none; } #sidebar_linklist li.sbaritem a, #sidebar_tags li.sbaritem a{ display:block; text-decoration:none!important; } #sidebar_linklist li.sbaritem:hover, #sidebar_tags li.sbaritem:hover{ background:#e8e8e8; border-bottom:1px solid #231f20; border-right:1px solid #f0f0f0; } #sidebar_summary li.sbaritem { background:#f9f9f9; border-bottom:1px solid #f0f0f0; border-right:1px solid #f0f0f0; padding:5px 15px; font-weight:normal; text-align:right; text-decoration:none; text-transform:none; } #sidebar_summary li.sbaritem a:hover{ font-weight:normal!important; text-decoration:underline; } #sidebar_summary li.sbaritem:hover{ display:block; background:#e8e8e8; border-bottom:1px solid #231f20; border-right:1px solid #f0f0f0; } table.calendar { background:#f9f9f9; border-right:1px solid #f0f0f0; padding:10px; margin:auto; width:100%; } .sbarcalendar { background:#e8e8e8; border:1px solid #e8e8e8; font-size:1em/*12px*/; padding:2px; text-align:center; } .sbarcalendarposts { background:#231f20; border:1px solid #231f20; font-size:1em/*12px*/; padding:2px; text-align:center; } .sbarcalendarposts a, .sbarcalendarposts a:link, .sbarcalendarposts a:visited{color:#f9f9f9!important;} .sbarcalendarposts a:hover{ color:#f4f4f4!important; text-decoration: underline!important; font-weight:normal!important; } .sbarcalendarposts:hover{ background:#bb141a; border:1px solid #bb141a; } /*****FOOTER*****/ ul.navfooter { padding:10px 0; } ul.navfooter li { display:inline; list-style:none; } #footer li.viewing { background:#f9f9f9; color:#ccc; text-transform:uppercase; text-decoration:none; margin:0; padding:10px; } #footer a, #footer a:link, #footer a:visited { background:#e8e8e8; color:#bb141a; text-transform:uppercase; text-decoration:none; font-weight:normal; margin:0; padding:10px; } #footer a:hover { background:#f9f9f9; color:#ccc; } /*****ENTRY*****/ .subcontent { background:#fff; overflow:auto; margin-bottom:15px; padding:10px; } .entry{ text-align:left; overflow:hidden; padding:0 0 0 10px; } .entry ul li { list-style:disc; margin-left:20px; padding-left:0; } .entry ol li { list-style:lower-roman; margin-left:20px; padding-left:0; } /*****USERPICS*****/ .userpic, .userpicfriends { background:transparent!important; float:left; margin:0 10px 10px 0; position:relative; font-size:0.8333em/*10px*/; text-align:center; text-transform:lowercase; } .userpicfriends font{ color:#666; font-size:1em/*10px*/; text-align:center; text-transform:lowercase; } .userpic a, .userpic a:link, .userpic a:visited, .userpicfriends a, .userpicfriends a:link, .userpicfriends a:visited, userpicfriends font{ background:transparent; color:#ce171f!important; text-decoration: none; text-transform:lowercase; } .userpic a, .userpicfriends a:hover, userpicfriends a:hover font { background:transparent; color:#ce171f!important; text-decoration:underline; text-transform:lowercase; } /*****DATE, SUBJECT, CURRENTS GENERAL, COMMENTS, TAGS*****/ .datesubject { background:transparent!important; margin:0 0 10px 110px; padding:5px; } .date{ color:#bb141a; font-size:0.8333em/*10px*/; text-align:right; text-transform:lowercase; margin:0; } .subject { color:#bb141a; font-family:"Times New Roman", Times, serif; font-size:1.6666em/*20px*/; font-style:italic; font-weight:normal; text-align:left; text-transform:none; } .subject a, .subject a:link, .subject a:visited { color:#bb141a; font-style:italic; font-weight:normal; text-align:left; text-transform:none; } .subject a:hover { color:#231f20; text-decoration:none; } .ljtags { border-top:1px dotted #bb141a; margin-top:10px; color:#666; font-size:0.9166em/*11px*/; font-weight:normal; text-align:left; } .currents{ border-top:1px dotted #bb141a; margin-top:10px; color:#bb141a; font-size:0.9166em/*11px*/; font-weight:normal; text-align:left; } .currents strong, .ljtags strong { color:#666; font-weight:normal; } .ljtags a, .ljtags a:link, .ljtags a:visited, .currents a, .currents a:link, .currents a:visited { background:transparent; color:#bb141a; font-weight:normal; text-decoration:none; } .ljtags a:hover, .currents a:hover { color:#ce171f; text-decoration:underline; } .comments { border-top:1px dotted #bb141a; margin-top:10px; color:#bb141a; font-size:0.9166em/*11px*/; font-weight:normal; text-align:right; } .comments a, .comments a:link, .comments a:visited { background:transparent; color:#ce171f; font-weight:normal; text-decoration:none; text-transform:uppercase; } .comments a:hover { color:#bb141a; text-decoration:underline; } /*****TAGS PAGE*****/ h2{ background:#bb141a; list-style:none; padding:24px 10px 10px; color:#f4f4f4; font-family:"Times New Roman", Times, serif; font-size:1.6666em/*20px*/; font-weight:normal; line-height:1em; text-align:left; text-transform:lowercase; } .ljtaglist { background:#f9f9f9; list-style:none; width:100%; } .ljtaglist li { background:#f9f9f9; border-bottom:1px solid #bb141a; color:#666; padding:10px; } .ljtaglist a, .ljtaglist a:link, .ljtaglist a:visited { color:#ce171f; text-decoration:none; text-transform:none; } .ljtaglist a:hover { color:#bb141a; text-decoration:underline; font-weight:bold; } /*****CALENDAR PAGE*****/ ul.year{ background:#fff; list-style:none; margin: 0 auto; padding:15px; text-align:center; } ul.year a, ul.year a:link, ul.year a:visited { padding:5px; color:#bb141a; text-decoration:none; text-transform:none; } ul.year a:hover { background:#231f20; color:#f9f9f9; } ul.year li { display:inline; color:#666; } ul.year li.active { background:#231f20; padding:5px; color:#f9f9f9; font-size:1.1538em/*15px*/; font-weight:normal; } table.yeartable { margin-left:auto; margin-right:auto; width:100%; padding:20px; background:#fff; } table.yeartable td.yeardate{ border:1px solid #e8e8e8; background:#e8e8e8; height:4em; padding:2px; } table.yeartable td.yearday { background:#231f20; border:1px solid #231f20; color:#f4f4f4; text-align:center; } td.yearmonth {color:#ce171f;} .yearmonth a, .yearmonth a:link, .yearmonth a:visited { background:transparent; padding:3px; color:#ce171f; text-decoration:underline; text-transform:none; } .yearmonth a:hover { background:#231f20; color:#f9f9f9; } table.yeartable td.yeardate a, table.yeartable td.yeardate a:link, table.yeartable td.yeardate a:visited { background:transparent; display:block; padding:5px; color:#666; font-size:1em/*12px*/; text-decoration:underline; text-transform:none; } table.yeartable td.yeardate a:hover { background:#bb141a; color:#f4f4f4; } /*****CLEARS, SKIPLINKS*****/ .clear{ height:0; background:transparent; } .clearfoot { clear: both; height:0; background:transparent; } .separator { height:0; background:transparent; } .skiplinks { background:#fff; border:0; margin:auto; padding:10px; color:#666; font-size:0.9166em/*11px*/; text-transform:none; text-align:center; } .skiplinks a, .skiplinks a:link, .skiplinks a:visited { padding:5px; color:#bb141a; text-decoration:none; text-transform:none; } .skiplinks a:hover { color:#f4f4f4; background:#bb141a; } /*****COMMENTS VIEW*****/ .datesubjectcomment { border-bottom:1px dotted #ccc; padding:0; } .userpiccomment { float:left; margin:0 10px 10px 0; position:relative; width:70px; height:70px; } .box { font-size:1em/*12px*/; clear:right; color:#666; } input, textarea { background-color:#fff; border:1px solid #ccc; color:#666; } textarea.textbox {width:100%!important;} .reply{ background:#fff; margin:5px; padding:5px; position:relative; color:#666; text-align:left; } .replytosubject { font-weight:normal; } .commentreply { position:relative; padding:5px; color:#666; } .commentbox, .commentboxpartial { background:#fff; padding:10px; margin:5px 0; overflow:auto; } .datesubjectcomment a:link, .datesubjectcomment a:visited { color:#bb141a; text-decoration:none; } .datesubjectcomment a:hover { color:#ce171f; text-decoration:underline; } .commentinfo { background-color:#fff; margin-top:10px; width: 100%; } #qrform table { border:1px solid #fff!important; background:#fff; padding:10px; height:auto; } /*****LJ-USER / COMMUNITY / PROTECTED ICONS icons by http://www.pinvoke.com/*****/ .ljuser img {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-home.png) no-repeat; padding: 16px 16px 0 0!important;} .entry img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-key.png) no-repeat; padding: 16px 16px 0 0!important;} #sidebar_summary img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-key.png) no-repeat; padding: 16px 16px 0 0!important;} #sidebar_summary img[src="http://l-stat.livejournal.com/img/icon_private.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-key.png) no-repeat; padding: 16px 16px 0 0!important;} .subject img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-key.png) no-repeat; padding: 16px 16px 0 0!important;} .entry img[src="http://l-stat.livejournal.com/img/icon_private.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-key.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-home.png) no-repeat; padding: 16px 16px 0 0!important;} /*****CONTEXTUAL POPUP*****/ div.ContextualPopup img {border:0 none;} div.ContextualPopup div.Inner {background:#fff!important; border:1px solid #ccc; padding:5px; color:#303030!important; font-size:1em; font-weight:100!important;} div.ContextualPopup .Content {margin-right:50px; font-weight:100!important;} div.ContextualPopup .Relation {color:#ce171f; font-size:1.4em/*14px*/; font-weight:500!important; font-style:italic;} div.ContextualPopup .Content .OnlineStatus {font-weight:100!important;} div.ContextualPopup .Userpic {font-weight:100!important;} div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited {color:#ce171f!important; font-weight:100; text-decoration:none!important;} div.ContextualPopup div.Inner a:hover{color:#303030!important; font-weight:100; text-decoration:none!important;}

Live preview | Image Preview
/********************DO NOT REMOVE THIS******************** Layout 010 [Not Flowers] by Yam @ Frozen Mint (frozen_mint.livejournal.com) Style: Flexible Squares Account level: Basic / Paid / Plus Tested on: IE (7 and higher), Firefox, Safari and Chrome CREDITS: Vector in header provided by DryIcons (http://dryicons.com/free-graphics/) W/SIDEBAR *****************************************************/ /*****BASICS*****/ * {margin: 0; padding: 0;} i, em{font-style:italic;} .ippu {font-size:12px;} a{outline:none;} a img{border:0;} p, td {font-size:inherit;} code, kbd, pre, tt {font-family:monospace;} body { background:#000 url(http://www.mentahelada.net/lj-layouts/layout010/bg-body.png) top left repeat fixed; color:#231f20; font-family:"Trebuchet MS", Tahoma, Helvetica, san-serif; font-size:100%/*16px*/; line-height:104%; } a, a:link, a:visited { color:#ce171f; font-weight:normal; text-decoration:none; text-transform:none; } a:hover {text-decoration:underline;} blockquote { background:#231f20; border-left:20px solid #ce171f; margin:10px auto; padding:20px 20px 20px 15px; width:70%; color:#fff; font-size:1.0833em/*13px*/; font-style:italic; text-align:left; } ::-moz-selection { background:#ce171f; color:#f4f4f4; } b, strong{ color:#bb141a; font-weight:bold; } /*****LAYOUT*****/ #content { background:#transparent; margin:0 auto; padding:0; width:750px; } #header { background:transparent url(http://www.mentahelada.net/lj-layouts/layout010/bg-header.png) top right no-repeat; height:350px; margin:0; padding:0; font-family:"Times New Roman", Times, serif; font-size:1.375em/*22px*/; text-align:left; } #sidebar { background:fff; float:left; margin:0; padding-bottom:5px; width:253px; font-size:0.75em/*12px*/; text-align:left; } #maincontent { background:transparent; margin: 0 0 0 253px; font-size:0.75em/*12px*/; } #footer { background:transparent; font-size:0.75em/*12px*/; text-align:right; } /*****HEADER*****/ ul.navheader { margin:0; padding:135px 0 0; width:253px; } ul.navheader li{ list-style:none; margin:0 0 5px; padding:0; } #header li.view { background:#ce171f; border:1px solid #ce171f; display:block; margin:0 0 5px; padding:10px 20px; color:#f4f4f4; font-style:italic; font-weight:normal; text-align:right; text-decoration:none; text-transform:lowercase; } #header a, #header a:link, #header a:visited { background:#000; border:1px solid #000; display:block; margin:0 0 5px 25px; padding:10px 15px; color:#f4f4f4; font-style:italic; font-weight:normal; text-align:right; text-decoration:none; text-transform:lowercase; } #header a:hover { background:#ce171f; border:1px solid #ce171f; margin:0 0 5px; padding:10px 20px; color:#f4f4f4; } .title, .subtitle {display:none;} /*****SIDEBAR******/ .defaultuserpic { display:none; margin:auto; text-align:center; } .defaultuserpic img { border:10px solid #f9f9f9; } li.sbartitle { background:#bb141a; border-right:1px solid #f0f0f0; list-style:none; margin-top:15px; padding:10px 15px; color:#f4f4f4; font-family:"Times New Roman", Times, serif; font-size:1.3333em/*16px*/; font-style:italic; text-align:right; text-transform:lowercase; font-weight:normal; } .sbarbody2 { background-color:#f9f9f9; border-right:1px solid #f0f0f0; padding:10px; } div#sidebar a, div#sidebar a:link, div#sidebar a:visited { color:#ce171f; font-weight:normal; text-decoration:none; text-transform:none; } div#sidebar a:hover { background:transparent; font-weight:normal; text-decoration:underline; } ul.sbarlist {list-style:none;} li.sbaritem { background:#f9f9f9; border-bottom:1px solid #f0f0f0; border-right:1px solid #f0f0f0; padding:5px 15px; font-weight:normal; text-align:right; text-decoration:none; text-transform:none; } #sidebar_linklist li.sbaritem a, #sidebar_tags li.sbaritem a{ display:block; text-decoration:none!important; } #sidebar_linklist li.sbaritem:hover, #sidebar_tags li.sbaritem:hover{ background:#e8e8e8; border-bottom:1px solid #231f20; border-right:1px solid #f0f0f0; } #sidebar_summary li.sbaritem { background:#f9f9f9; border-bottom:1px solid #f0f0f0; border-right:1px solid #f0f0f0; padding:5px 15px; font-weight:normal; text-align:right; text-decoration:none; text-transform:none; } #sidebar_summary li.sbaritem a:hover{ font-weight:normal!important; text-decoration:underline; } #sidebar_summary li.sbaritem:hover{ display:block; background:#e8e8e8; border-bottom:1px solid #231f20; border-right:1px solid #f0f0f0; } table.calendar { background:#f9f9f9; border-right:1px solid #f0f0f0; padding:10px; margin:auto; width:100%; } .sbarcalendar { background:#e8e8e8; border:1px solid #e8e8e8; font-size:1em/*12px*/; padding:2px; text-align:center; } .sbarcalendarposts { background:#231f20; border:1px solid #231f20; font-size:1em/*12px*/; padding:2px; text-align:center; } .sbarcalendarposts a, .sbarcalendarposts a:link, .sbarcalendarposts a:visited{color:#f9f9f9!important;} .sbarcalendarposts a:hover{ color:#f4f4f4!important; text-decoration: underline!important; font-weight:normal!important; } .sbarcalendarposts:hover{ background:#bb141a; border:1px solid #bb141a; } /*****FOOTER*****/ ul.navfooter { padding:10px 0; } ul.navfooter li { display:inline; list-style:none; } #footer li.viewing { background:#f9f9f9; color:#ccc; text-transform:uppercase; text-decoration:none; margin:0; padding:10px; } #footer a, #footer a:link, #footer a:visited { background:#e8e8e8; color:#bb141a; text-transform:uppercase; text-decoration:none; font-weight:normal; margin:0; padding:10px; } #footer a:hover { background:#f9f9f9; color:#ccc; } /*****ENTRY*****/ .subcontent { background:#fff; overflow:auto; margin-bottom:15px; padding:10px; } .entry{ text-align:left; overflow:hidden; padding:0 0 0 10px; } .entry ul li { list-style:disc; margin-left:20px; padding-left:0; } .entry ol li { list-style:lower-roman; margin-left:20px; padding-left:0; } /*****USERPICS*****/ .userpic, .userpicfriends { background:transparent!important; float:left; margin:0 10px 10px 0; position:relative; font-size:0.8333em/*10px*/; text-align:center; text-transform:lowercase; } .userpicfriends font{ color:#666; font-size:1em/*10px*/; text-align:center; text-transform:lowercase; } .userpic a, .userpic a:link, .userpic a:visited, .userpicfriends a, .userpicfriends a:link, .userpicfriends a:visited, userpicfriends font{ background:transparent; color:#ce171f!important; text-decoration: none; text-transform:lowercase; } .userpic a, .userpicfriends a:hover, userpicfriends a:hover font { background:transparent; color:#ce171f!important; text-decoration:underline; text-transform:lowercase; } /*****DATE, SUBJECT, CURRENTS GENERAL, COMMENTS, TAGS*****/ .datesubject { background:transparent!important; margin:0 0 10px 110px; padding:5px; } .date{ color:#bb141a; font-size:0.8333em/*10px*/; text-align:right; text-transform:lowercase; margin:0; } .subject { color:#bb141a; font-family:"Times New Roman", Times, serif; font-size:1.6666em/*20px*/; font-style:italic; font-weight:normal; text-align:left; text-transform:none; } .subject a, .subject a:link, .subject a:visited { color:#bb141a; font-style:italic; font-weight:normal; text-align:left; text-transform:none; } .subject a:hover { color:#231f20; text-decoration:none; } .ljtags { border-top:1px dotted #bb141a; margin-top:10px; color:#666; font-size:0.9166em/*11px*/; font-weight:normal; text-align:left; } .currents{ border-top:1px dotted #bb141a; margin-top:10px; color:#bb141a; font-size:0.9166em/*11px*/; font-weight:normal; text-align:left; } .currents strong, .ljtags strong { color:#666; font-weight:normal; } .ljtags a, .ljtags a:link, .ljtags a:visited, .currents a, .currents a:link, .currents a:visited { background:transparent; color:#bb141a; font-weight:normal; text-decoration:none; } .ljtags a:hover, .currents a:hover { color:#ce171f; text-decoration:underline; } .comments { border-top:1px dotted #bb141a; margin-top:10px; color:#bb141a; font-size:0.9166em/*11px*/; font-weight:normal; text-align:right; } .comments a, .comments a:link, .comments a:visited { background:transparent; color:#ce171f; font-weight:normal; text-decoration:none; text-transform:uppercase; } .comments a:hover { color:#bb141a; text-decoration:underline; } /*****TAGS PAGE*****/ h2{ background:#bb141a; list-style:none; padding:24px 10px 10px; color:#f4f4f4; font-family:"Times New Roman", Times, serif; font-size:1.6666em/*20px*/; font-weight:normal; line-height:1em; text-align:left; text-transform:lowercase; } .ljtaglist { background:#f9f9f9; list-style:none; width:100%; } .ljtaglist li { background:#f9f9f9; border-bottom:1px solid #bb141a; color:#666; padding:10px; } .ljtaglist a, .ljtaglist a:link, .ljtaglist a:visited { color:#ce171f; text-decoration:none; text-transform:none; } .ljtaglist a:hover { color:#bb141a; text-decoration:underline; font-weight:bold; } /*****CALENDAR PAGE*****/ ul.year{ background:#fff; list-style:none; margin: 0 auto; padding:15px; text-align:center; } ul.year a, ul.year a:link, ul.year a:visited { padding:5px; color:#bb141a; text-decoration:none; text-transform:none; } ul.year a:hover { background:#231f20; color:#f9f9f9; } ul.year li { display:inline; color:#666; } ul.year li.active { background:#231f20; padding:5px; color:#f9f9f9; font-size:1.1538em/*15px*/; font-weight:normal; } table.yeartable { margin-left:auto; margin-right:auto; width:100%; padding:20px; background:#fff; } table.yeartable td.yeardate{ border:1px solid #e8e8e8; background:#e8e8e8; height:4em; padding:2px; } table.yeartable td.yearday { background:#231f20; border:1px solid #231f20; color:#f4f4f4; text-align:center; } td.yearmonth {color:#ce171f;} .yearmonth a, .yearmonth a:link, .yearmonth a:visited { background:transparent; padding:3px; color:#ce171f; text-decoration:underline; text-transform:none; } .yearmonth a:hover { background:#231f20; color:#f9f9f9; } table.yeartable td.yeardate a, table.yeartable td.yeardate a:link, table.yeartable td.yeardate a:visited { background:transparent; display:block; padding:5px; color:#666; font-size:1em/*12px*/; text-decoration:underline; text-transform:none; } table.yeartable td.yeardate a:hover { background:#bb141a; color:#f4f4f4; } /*****CLEARS, SKIPLINKS*****/ .clear{ height:0; background:transparent; } .clearfoot { clear: both; height:0; background:transparent; } .separator { height:0; background:transparent; } .skiplinks { background:#fff; border:0; margin:auto; padding:10px; color:#666; font-size:0.9166em/*11px*/; text-transform:none; text-align:center; } .skiplinks a, .skiplinks a:link, .skiplinks a:visited { padding:5px; color:#bb141a; text-decoration:none; text-transform:none; } .skiplinks a:hover { color:#f4f4f4; background:#bb141a; } /*****COMMENTS VIEW*****/ .datesubjectcomment { border-bottom:1px dotted #ccc; padding:0; } .userpiccomment { float:left; margin:0 10px 10px 0; position:relative; width:70px; height:70px; } .box { font-size:1em/*12px*/; clear:right; color:#666; } input, textarea { background-color:#fff; border:1px solid #ccc; color:#666; } textarea.textbox {width:100%!important;} .reply{ background:#fff; margin:5px; padding:5px; position:relative; color:#666; text-align:left; } .replytosubject { font-weight:normal; } .commentreply { position:relative; padding:5px; color:#666; } .commentbox, .commentboxpartial { background:#fff; padding:10px; margin:5px 0; overflow:auto; } .datesubjectcomment a:link, .datesubjectcomment a:visited { color:#bb141a; text-decoration:none; } .datesubjectcomment a:hover { color:#ce171f; text-decoration:underline; } .commentinfo { background-color:#fff; margin-top:10px; width: 100%; } #qrform table { border:1px solid #fff!important; background:#fff; padding:10px; height:auto; } /*****LJ-USER / COMMUNITY / PROTECTED ICONS icons by http://www.pinvoke.com/*****/ .ljuser img {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-home.png) no-repeat; padding: 16px 16px 0 0!important;} .entry img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-key.png) no-repeat; padding: 16px 16px 0 0!important;} #sidebar_summary img[src="http://l-stat.livejournal.com/img/icon_protected.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-key.png) no-repeat; padding: 16px 16px 0 0!important;} #sidebar_summary img[src="http://l-stat.livejournal.com/img/icon_private.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-key.png) no-repeat; padding: 16px 16px 0 0!important;} .subject img[src="http://l-stat.livejournal.com/img/icon_protected.gif"]{width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-key.png) no-repeat; padding: 16px 16px 0 0!important;} .entry img[src="http://l-stat.livejournal.com/img/icon_private.gif"] {width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-key.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-user.png) no-repeat; padding: 16px 16px 0 0!important;} #lj_controlstrip .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background: transparent url(http://www.mentahelada.net/lj-layouts/layout010/icon-home.png) no-repeat; padding: 16px 16px 0 0!important;} /*****CONTEXTUAL POPUP*****/ div.ContextualPopup img {border:0 none;} div.ContextualPopup div.Inner {background:#fff!important; border:1px solid #ccc; padding:5px; color:#303030!important; font-size:1em; font-weight:100!important;} div.ContextualPopup .Content {margin-right:50px; font-weight:100!important;} div.ContextualPopup .Relation {color:#ce171f; font-size:1.4em/*14px*/; font-weight:500!important; font-style:italic;} div.ContextualPopup .Content .OnlineStatus {font-weight:100!important;} div.ContextualPopup .Userpic {font-weight:100!important;} div.ContextualPopup div.Inner a, div.ContextualPopup div.Inner a:link, div.ContextualPopup div.Inner a:visited {color:#ce171f!important; font-weight:100; text-decoration:none!important;} div.ContextualPopup div.Inner a:hover{color:#303030!important; font-weight:100; text-decoration:none!important;}
LAYOUT INFO:
  • Style: Flexible Squares
  • Account level: Basic, Paid, Plus
  • Tested on: IE (7 and higher), Firefox, Safari and Chrome.

IMAGES:
Please upload the images to your own server. Thanks.
Background
Header (Graphic provided by DryIcons)
User, community icons:

(by Pinvoke)
Locked/protected icons:
(by Pinvoke)
Carlisle icon in the preview made by me. Find it here.
BASIC INSTRUCTIONS:
  1. Choose a Flexible Squares layout
  2. Go to Customize Journal Theme
  3. Select NO in the dropdowns
  4. Leave "Custom External Stylesheet" empty
  5. Paste the CSS that I give you in the "Custom Stylesheet" box
  6. Save.
  • Make changes if you know how (but still credit me!)
  • Ask if you have doubts, I'll try to answer asap

ADDING A HEADER:
If you want to change the header, find this part of the code:
#header {
background:transparent url(http://www.mentahelada.net/lj-layouts/layout010/bg-header.png) top right no-repeat;
height:350px;
margin:0;
padding:0;
font-family:"Times New Roman", Times, serif;
font-size:1.375em/*22px*/;
text-align:left;
}
And change the url to your own. The width of your header must be 497px and the height 350px.

EASY RULES:
  • Credit frozen_mint if you use. Please don't credit mintyapple, please change the credit you have in your userinfo. Thanks!
  • Comment if you like / if you take

@ mintyapple

ETA: I've changed the header, the image that I used is a copyrighted print. I didn't know about it, and apparently the DryIcons people didn't know either. Everything's fine now.

layouts:flexible squares, layouts

Previous post Next post
Up