#71 - The Doctor and the reindeer

Dec 29, 2009 10:26

Description Name: The Doctor and the reindeer Description: A Doctor Who layout evolved from the BBC Christmas Doctor Who indent in which the Doctor finds his Tardis snowed in, surrounded by reindeer.
I meant to use more reindeer graphics (hence the title), but eventually it turned out to be more of a Tardis-centered design.

General Information Layout Style: Minimalism
Thanks to grrliz for the template! Tested in: Mozilla Firefox and Internet Explorer Best Resolution: 1024*768 and above Account Levels: Layout works with all account levels (Basic, Plus, Paid). [ How to change add orientation] Works with Navigation Strip: Yes [ How to enable/disable] Credit:
  • Pattern found somewhere online, can't remember where, it was just in my stock.
  • some Doctor Who mini-icons by Icon Factory
  • Images in header were capped by me from this YouTube video
Credit to me is implemented in the footer of the page.



{Bigger} {Live Preview}

Installation Go to Manage: Customize Select a new Theme:
  • Check the box next to 'Only show themes available to me'
  • Type 'Minimalism' in the Search box
  • Click search
  • Apply any theme that has the header icon on the top left (e.g. Deep Ocean, Bad Weather, Stone Age, ...)
Choose a Page Setup
  • Plus accounts: Choose an Ad placement: Choose Vertical and save
  • Apply the following: '2 Column (sidebar on left)' or '2 Column (sidebar on right) (sidebar will always appear on the left!)'
  • Click 'Customize Selected Theme'
Choose 'Custom CSS' from the menu on the left:
  • Use layout's stylesheets: No
  • Use layout's theme's stylesheet : No
  • Custom external stylesheet URL: Leave empty
  • Custom stylesheet: Paste the codes (given bellow) in the box

Hit 'Save Changes'

Images & Code The images are uploaded to my own accounts. If you want to avoid bandwidth getting exceeded it is recommended to upload the images to your own server.
If you upload the images to your own account, don't forget to change the URL's in the code!

Paste these codes in the "Custom stylesheet" box.

/*=================================================================================================================================================*/ /*------------------------------------------------------- LAYOUT 71: THE DOCTOR AND THE REINDEER --------------------------------------------------*/ /*------------------------------------------------------------- S2 STYLE: MINIMALISM --------------------------------------------------------------*/ /*----------------------------------------------------------------- DATE: DECEMBER 2009 -----------------------------------------------------------*/ /*------------------------------- AVAILABLE AT GAWARIEL_DESIGN (http://community.livejournal.com/gawariel_design/) -------------------------------*/ /*--------------------------------------------- CREATED BY GAWARIEL (http://gawariel.livejournal.com/) --------------------------------------------*/ /*---------------------------------------------------------- IMAGES MADE IN PHOTOSHOP CS ----------------------------------------------------------*/ /*------------------------- MINIMALISM TEMPLATE BY GRRLIZ FROM THE FULCRUM (http://community.livejournal.com/thefulcrum/) -------------------------*/ /*=================================================================================================================================================*/ /*----------------------------------------*/ /*---------- GENERAL FORMATTING ----------*/ /*----------------------------------------*/ * { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; } html { font-size: 100%; } body { margin: 0; padding: 0; text-align: center; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/pattern.jpg); font-family: candara, helvetica, verdana, arial, tahoma, sans-serif; font-size: 62.5%; } table { border-collapse: collapse; /*sets default to single border instead of double*/ border-spacing: 0; } blockquote { width: 80%; margin: 0 auto; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/blockquote.jpg); padding: 10px; border: 3px double #98BECB; } a { color: #007BE1; text-decoration: none; } a:hover { color: #B59E33; text-decoration: underline; } .ljuser img[src="http://l-stat.livejournal.com/img/userinfo.gif"] { width: 0; height: 0; background-repeat: no-repeat; background-color:transparent; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/user.png); padding: 28px 0 0 18px!important; } .ljuser img[src="http://l-stat.livejournal.com/img/community.gif"] { width: 0; height: 0; background-repeat: no-repeat; background-color:transparent; background-image: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/community.png); padding: 28px 0 0 26px!important; } /*--------------------------* /*---------- PAGE ----------*/ /*--------------------------*/ #page { font-size: 1.2em; height: 615px; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/header.jpg) no-repeat top center; } .layout { width: 1055px; margin: 0px auto; text-align: left; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/sig.png) no-repeat bottom right; } .layout-inner { position: relative; overflow: hidden; } /*-- CONTAINS HEADER AND MAIN CONTENT BUT NOT SIDEBAR --*/ .content { float: right; display: inline; width: 808px; margin-top: 620px; } .header { position: relative; } .sidebar { float: left; display: inline; width: 247px; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/sidebar-top.png) no-repeat top center; margin-top: 620px; margin-bottom: 20px; } /*----------------------------*/ /*---------- HEADER ----------*/ /*----------------------------*/ .header .userpic, .header .vcard, .header h1, .header h2, .header h3 { display: none; } .header ul.nav { position: absolute; top: -95px; right: 81px; width: 874px; height: 64px; text-align: center; list-style-type: none; text-transform: uppercase; font-size: 2.0em; } .header ul.nav li.item { display: inline; } .header ul.nav li.item a{ line-height: 51px; color: #FFFFFF; font-weight: normal; text-decoration: none; padding: 20px 23px; } .header ul.nav li.item a:hover{ color: #A2C9D5; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/nav.png) no-repeat center; } .header ul.nav-sub, .item-addfriend, .item-rss { display: none; } /*-----------------------------*/ /*---------- CONTENT ----------*/ /*-----------------------------*/ .content-inner { position: relative; width: 790px; margin: 0 auto; } /*-- EACH SEPARATE ENTRY --*/ div.entry-wrap { margin: 0 0 100px 0; padding: 0px 20px 0px 20px; background: #FFFFFF; line-height: 1.5em; color: #0C273C; } /*-- USERPIC AND USERNAME --*/ dl.vcard { z-index: 101; max-width: 120px; } dl.vcard dt img { border: 8px solid #0C273C; } dl.vcard { display: inline; float: right; margin: 0px 0px 5px 10px; text-align: center; } .ljuser img { vertical-align:middle !important; } .ljuser .ico img { vertical-align: -.4em !important; } dd.entry-date { font-size: 1.1em; font-style: italic; color: #7F8280; } /*-- ENTRY TITLE --*/ dt.entry-title { position: relative; right: 20px; width: 790px; height: 42px; margin: 0 0 20px 0; background: #AEB3B0 url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/subject.png) no-repeat; text-transform: uppercase; font-size: 2.0em; color: #FFFFFF; padding: 6px 0 0 70px; } dt.entry-title a { text-decoration: none; color: #FFFFFF; padding: 0 140px 0 0; } dt.entry-title a:hover { color: #A2C9D5; } dt.entry-title img { padding-right: 5px; } /*-- CURRENT MOOD, MUSIC, LOCATION --*/ .metadata { margin-bottom: 1.5em; font-size: 0.9em; overflow: hidden; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/meta.jpg) no-repeat top left; min-height: 51px; } .metadata dl { margin: 0; display: block; } .metadata dt, .metadata dd { display: inline; margin-left: 0; font-style: italic; color: #5F6260; } .metadata dt { font-weight: bold; margin-right: .4em; } .metadata dd img { vertical-align: bottom; } /*-- ENTRY AREA --*/ div.entry-content { } div.entry-content ol { margin: 1em 3em; } div.entry-content ul { margin: 1em 1.4em; list-style: none; } div.entry-content ul li { background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/li-item.png) no-repeat top left; padding: 0 0 0 15px; } div.entry-content p { padding: 1em 0; } div.entry-content br { height: 1em; } div.ljtags { display: block; padding: 2em 0 2em 45px; font-weight: bold; font-style: italic; color: #5F6260; font-size: 0.9em; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/tags.png) no-repeat left center; } /*-- COMMENT BAR --*/ dd.entrymenu { clear: both; position: relative; right: 20px; width: 790px; height: 51px; background: #AEB3B0 url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/comment.png) no-repeat; text-transform: uppercase; font-size: 1.2em; } dd.entrymenu ul { list-style-type: none; padding-bottom: 20px; margin-left: 150px; } dd.entrymenu ul li { display: block; float: left; padding: 20px 15px 0 0px; } dd.entrymenu ul li.comments { position: absolute; top: -5px; left: 0px; padding: 0; } dd.entrymenu ul li.comments a { display:block; width: 144px; height:50px; text-align:center; color: #ffffff; font-size: 3.5em; line-height: 50px; padding:0px 10px 5px 0; } dd.entrymenu ul li.comments a:hover { color: #A2C9D5; text-decoration: none; font-style: italic; } /*-- PREVIOUS AND NEXT LINKS --*/ ul.page-nav { list-style-type: none; overflow: hidden; margin:0px; padding: 0px 0px 20px 30px; } .prev a{ font-size:0px; display:block; width:128px; height:64px; background:url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/previous.png) no-repeat top left; visibility:visible; float:left; line-height:0px; } .prev a:hover{ background:url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/previous.png) no-repeat bottom left; } .next a{ font-size:0px; display:block; width:128px; height:64px; background:url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/next.png) no-repeat top left; visibility:visible; float:right; line-height:0px; } .next a:hover{ background:url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/next.png) no-repeat bottom left; } /*-----------------------------*/ /*---------- SIDEBAR ----------*/ /*-----------------------------*/ div.hr {clear: both;} div.hr hr {display: none;} .sidebar-inner { background: #0C263C; margin: 221px 13px 0 14px; padding: 0 10px 10px 10px; color: #A2C9D5; } .sidebar-block { margin: 20px 0 10px 0; } .sidebar-block ul { list-style-type: none; } .sidebar-block ul li { background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/li-item.png) no-repeat top left; padding: 0 0 0 20px; margin: 0 0 0 20px; line-height: 1.5em; } /*-- BLOCKTITLE --*/ .sidebar-block dt { margin: 0 0 10px 0; padding: 8px 0 5px 35px; text-transform: uppercase; font-size: 1.5em; color: #FFFFFF; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/sb-title.png) no-repeat left top; border-bottom: 1px solid #2A637C; } /*-- BLOCK CONTENT --*/ .sidebar-block dd { padding: 2px 5px; } .sidebar-links dd { margin: 0 0 0 20px; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/li-item.png) no-repeat top left; padding: 0 0 0 20px; line-height: 1.5em; } .sidebar-custom { line-height: 1.5em; } .sidebar-powered { display: none; } /*-- SIDEBAR CALENDAR --*/ .sidebar .calendar-wrap { float: left; padding: 1em 2em; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/blockquote.jpg); border: 3px double #98BECB; color: #0C273C; } .sidebar .calendar-wrap { float: none; width: auto; height: auto; padding: 0 0 0 1px; } .sidebar .calendar-wrap table { width: 100%; } .sidebar .calendar-wrap table caption { text-align: center; height: 2em; font-size: 1.2em; text-transform: uppercase; } .sidebar .calendar-wrap table thead th { background: none; text-align: center; font-weight: normal; background: #0C263C; padding: 1px; color: #FFFFFF; } .sidebar .calendar-wrap table tbody td { font-size: 1.1em; line-height: 29px; text-align: center; } .sidebar .calendar-wrap table tbody td a { display: block; line-height: 27px; text-decoration: none; font-size: 1.5em; } /*----------------------------------*/ /*---------- ARCHIVE PAGE ----------*/ /*----------------------------------*/ .view-archive .content-inner .entry-title { position: relative; right: 20px; width: 790px; height: 42px; margin: 0 0 20px 0; background: #AEB3B0 url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/subject.png) no-repeat; text-transform: uppercase; font-size: 2.0em; color: #FFFFFF; padding: 6px 0 0 70px; } .view-archive .content-inner .entry-text ul { list-style-type: none; } .view-archive .content-inner .entry-text ul li { display: inline; padding-right: 15px; font-size: 1.2em; } .content-inner .calendar-wrap table { width: 90%; margin: 0 auto; padding: 10px 0 30px 0; border-collapse: separate; border-spacing: 1px; text-align: center; font-size: 1.2em; } .content-inner .calendar-wrap table caption { text-align: left; padding: 20px; height: 2em; font-size: 1.2em; text-transform: uppercase; } .content-inner dl.entry .calendar-wrap table caption .year { display: none; } .content-inner .calendar-wrap table th { background: #0C273C; color: #FFFFFF; padding: 2px; } .content-inner .calendar-wrap table tbody td { padding: 2px 4px; text-align: center; background: url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/blockquote.jpg) center; } .content-inner .calendar-wrap table tbody td a { display: block; padding: 2px 4px; border: 0; margin: -2px -4px; text-align: center; text-decoration: none; background: #FFFFFF; } /*-----------------------------------*/ /*---------- COMMENTS PAGE ----------*/ /*-----------------------------------*/ dt.entry-linkbar { position: relative; background: transparent url(http://i19.photobucket.com/albums/b153/gawariel_design/71_The%20Doctor%20and%20the%20Reindeer/pattern.jpg); margin: 0 auto; padding: 0 0 0 30px; } dt.entry-linkbar a { margin: 0; padding: 0; } .comments-links { font-size: 1.5em; text-align: center; margin: 10px 0 30px 0; } .entry-comments-text { overflow: auto; overflow-y: hidden; } .entry-comments-text .hr { } .comment-wrap { padding: 2em 0; border-bottom: 1px solid #AEB3B0; } .comment-head { background: #0C273C; color: #A2C9D5; padding: 5px 0; } .comment-head h3 { text-transform: uppercase; font-size: 1.5em; color: #FFFFFF; font-weight: normal; padding: 5px 0; } .comment-head-in { padding: 0 10px; } .cwoup .comment-head-in {} .comment-head .comment-upic { float: left; display: inline; padding: 0px 10px 5px 0px; } .comment-head .comment-upic img { float: left; border: 8px solid #0C273C; } .comment-head p, .comment-head img { vertical-align: bottom; } .comment-text { padding: 0px 0px 0px 130px; } .comment-menu { text-align: right; padding: 10px 0; } .comment-wrap .odd {} .comment-wrap .even {} .comment-wrap .comment-text .hr {display: none;} #qrdiv form { display: block; padding: 5px; border: 1px solid #999999; margin: 5px 1px 1px; } #qrdiv #subject { margin: 3px 0; } #qrdiv table { border: none !important; } .replyform table td, #qrdiv table td { padding-right: .4em; vertical-align: top; } .replyform textarea, #qrdiv textarea { width: 90%; border: 1px solid #0C273C; font-size: 1.2em; padding: 1px; } input { margin: 5px; background: #0C273C; color: #FFFFFF; padding: 1px 2px; }

Troubleshooting Before asking any questions, make sure you read all information above thoroughly and that your question isn't adressed in the FAQ. If your problem still isn't solved, you are welcome to ask your question here.

layouts: account status: plus, layouts: [s2], layouts: [s2]: minimalism, layouts: account status: paid, layouts, layouts: account status: basic

Previous post Next post
Up