amavel_bel | Brokeback Mountain - Brokeback is all we got (Reply)

Ufa, finally I've finished my first Brokeback Mountain layout. I wanted to make a layout about the movie since I watched it, but just now I found time to make it. Hope you like it. As always, it's a shareable layout. Just give me credit if you're going to use it ;-).

Style: S2 Flexible Squares
Title: Brokeback Mountain - Brokeback is all we got
Website: Not needed
Default Icon: No needed
Best view: 800x600 and higher.
Browser(s) Compatible: Firefox, Internet Explorer, Netscape, Opera.
Maker:

amavel_bel (Mabel). Credit me in your user info page.
Resources: Images from the web sites O Segredo de Brokeback Mountain and Cinemagay. Other resources (like brushes, textures and so on) are credited at my LJ Info Page.
Notes: For free and paid accounts and it works with Nav bar strip and Sponsored Plus Account.

Preview:

Working preview:

bel_movie007

| IMAGES |
Obs.: The images are provided in the code for convenience. They are hosted and I don't intend to take them down (hopefully I won't have exceeding bandwidth problem). If you want, I'm providing the links below, so you can take the images and upload them in your own server. Just the FRIENDS ONLY BANNER and the ICON are optional.

Header:
http://i38.photobucket.com/albums/e107/bel_layouts/bbm-allwegot_header.jpg

Background:
http://i38.photobucket.com/albums/e107/bel_layouts/bbm-allwegot_back.jpg

Friends Only Banner:

Icon:

Extra images:

- divider between entries

- decoration of the sidebar titles

| CUSTOM COLORS |

Leave all the color fields blank. Actually, it's better to leave all the color fields blank.

| CSS CODE |

/* BACKGROUND, ENTRIES TEXT, COLORS */
body {
background: #FFFFFF url(http://i38.photobucket.com/albums/e107/bel_layouts/bbm-allwegot_back.jpg) repeat;
color: #161C1C;
font-family: "Verdana", sans-serif;
font-size: 10px;
text-align: center;
margin: 0px 0px 0px 0px;
}

a, a:link, a:visited {
color: #4A6060;
font-weight:bold;
text-decoration: none;
}

a:hover {
color:#161C1C; 
font-weight:bold;
text-decoration: none;
}

p, td, blockquote {
font-size: 11px;
}

code, kbd, pre, tt {
font-family: monospace;
}

/* HEADER */
#header {
position: relative;
width: auto !important;
width: 760px;
height: 420px;
padding: 0;
margin: 0px 0px 0px 0px;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: bold;
letter-spacing: 1px;
color: #161C1C;
background: transparent url(http://i38.photobucket.com/albums/e107/bel_layouts/bbm-allwegot_header.jpg) no-repeat top center;
border: 0;
}

/* NAVIGATION BAR */
ul.navheader {
position: relative;
width: auto !important;
width: 760px;
height: 22px;
top: 350px; 
left: 0px;
margin: 0px;
padding: 0px;
padding-top: 6px;
background-color: #E6EDF0;
text-align: center;
text-transform: uppercase;
font-family: georgia, times new roman;
font-size: 8pt;
font-weight: bold;
color: #161C1C;
border-top: 1px solid #B5BFC8;
border-bottom: 1px solid #B5BFC8;
}

ul.navheader li  {
padding: 0 10px 0 10px;
margin: 0px;
display: inline;
list-style-type: none;
}

/* NAVIGATION BAR LINKS */
div#header a:active, div#header a:link, div#header a:visited {
color: #161C1C; 
padding: 0 10px 0 10px;
}

div#header a:hover {
color: #FFFFFF;
background-color: #161C1C;
text-decoration: none;
}

/* TITLE OF JOURNAL */
.title{
display: none;
}

/* SUBTITLE OF JOURNAL */
.subtitle{
display: none;
}

/* SIDEBAR */ 
#sidebar {
margin-top: 0px; 
margin-left: 3px !important; 
margin-left: 0px; 
width: 205px;
padding-top: 0;
color: #4A6060;
font-size: 10px;
font-family: "Verdana", sans-serif;
text-align: left;
float: left;
z-index: 15;
background-color: transparent;
border: 0;
}

/* SIDEBAR - LINKS */ 
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #4A6060; 
font-weight:bold;
}

div#sidebar a:hover {
color: #FFFFFF; 
font-weight:bold;
text-decoration: none;
background-color: #B5BFC8;
}

/* SIDEBAR - FRAMES */ 
.sbarheader {
padding: 0px 5px 0px 20px;
}

.sbarbody {
padding: 0px 5px 0px 0px;
}

.sbarbody2 {
padding: 0px 5px 10px 30px;
}

/* SIDEBAR - DEFAULT USERPIC */ 
.defaultuserpic {
text-align: center;
margin-top: 15px;
margin-left: 6px;
}

.defaultuserpic img {
border: 1px solid #B5BFC8;
background-color: #FFFFFF;
padding: 2px;
}

/* SIDEBAR - ITEMS */ 
ul.sbarlist {
padding-left: 0px;
margin-left: 10px;
list-style: none;
}

/* SIDEBAR - ITEMS LINKS */ 
ul.sbarlist a, ul.sbarlist a:link, ul.sbarlist a:visited {
font-weight:none;
display:block;
padding-left:3px;
padding-bottom:3px;
line-height: 16px;
}
	
ul.sbarlist a:hover {
text-decoration: none;
padding-left:3px;
padding-bottom:3px;
}

li.sbaritem {
padding-left: 0px;
list-style: none;
}

/* SIDEBAR - TITLES */ 
li.sbartitle {
font-family: georgia, arial;
padding-left: 34px; 
padding-top: 7px; 
padding-bottom: 3px;
list-style: none;
border: 0;
border-bottom: 0px solid #161C1C;
background-color: transparent; 
margin-bottom: 5px;
margin-top: 5px;
height: 28px;
color:#000000;
font-size: 11px;
font-weight: bold;
letter-spacing: 2px;
background: transparent url(http://i38.photobucket.com/albums/e107/bel_layouts/bbm-allwegot_decoration.gif) no-repeat top left;
}

/* SIDEBAR - CALENDAR */
table.calendar {
margin-right: auto;
margin-left: auto;
}

.sbarcalendar {
border-width: 1px;
border-style: solid;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
color: #161C1C;
background-color:#E9EDF3;
border-color: #161C1C;
padding: 3px;
}

.sbarcalendarposts {
border-color: #161C1C;
border-width: 1px;
border-style: solid;
background-color: #B5BFC8;
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: bold;
padding: 3px;
}

td.sbarcalendarposts a, td.sbarcalendarposts a:link, td.sbarcalendarposts a:visited, td.sbarcalendarposts a:hover {
padding: 0 0 0 0;
margin: 0 0 0 0;
line-height: 14px;
}

/* MAINCONTENT */
#maincontent { 
margin-top: 0px;
margin-left: 220px; 
margin-right: 5px;
font-family: "Verdana", sans-serif;
font-size: 10px;
background-color: transparent;
color: #161C1C;
border: none;
text-align: left;
border:0;
border-left: 1px solid #B5BFC8;
}

#content {  
width: 760px;
margin-left: auto; 
margin-right: auto;
border: 1px solid #B5BFC8;
padding: 0;
z-index:1;
background-color: #FFFFFF;
}

div.subcontent {
background-color: transparent;
}

.subcontent div.subcontent {
background-color: transparent;
border:0;
}

/* ENTRIES */
.entry {
margin: 0px 0px 0px 10px;
padding: 10px;
background-color: transparent;
color: #3D4E4E;
color: #4A6060;
font-family: "Verdana", sans-serif;
font-size: 10px;
text-align: left;
border: 0;
}

.entry ul li {
padding-left: 5px;
margin-left: 15px;
}

.entry ol li {
padding-left: 5px;
margin-left: 15px;
}

/* SEPARATOR BETWEEN ENTRIES */
.separator{
height: 50px;
background: transparent url(http://i38.photobucket.com/albums/e107/bel_layouts/bbm-allwegot_divider.gif) no-repeat center center;
}

/* ENTRY ICON */
.userpic {
position: relative;
float: right;
background-color: #FFFFFF;
padding: 1px 1px 1px 1px;
margin: 0px 0px 0px 0px;
border: 1px solid #B5BFC8;
z-index: 15;
}

/* FRIENDS ICON */
.userpicfriends {
position: relative;
float: right;
background-color: #FFFFFF;
padding: 1px 1px 1px 1px;
margin: 0px 0px 0px 0px;
border: 1px solid #B5BFC8;
text-align: center;
z-index: 15;
}

/* ENTRY DATE */
.date {
line-height: 200%;
top: 5px;
color: #000000;
font-family: "georgia", sans-serif;
font-size: 11px;
font-weight: bold;
background-color: transparent;
text-align: center;
padding: 1px;
margin-left: 10px;
border-bottom: 1px solid #B5BFC8;
}

/* ENTRY SUBJECT */
.subject {
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: bold;
text-align: center;
padding: 3px; 
margin-left: 10px;
background-color: transparent;
color: #4A6060;
}

.subject a, .subject a:link, .subject a:visited {
color: #4A6060;
}

.subject a:hover {
color: #000000;
}

.datesubject {
background-color: transparent;
padding:0;
}

/* TAGS */
.ljtags {
font-weight: bold;
margin-top: 20px;
}

/* MOOD AND MUSIC */
.currents, .currentmood, .currentmusic {
font-family: "Verdana", sans-serif;
font-size: 11px;
}

.currents {
margin-top: 10px;
}

/* COMMENTS */
.comments {
position: relative;
font-family: "Verdana", sans-serif;
font-size: 11px;
text-align: center;
background-color: #E6EDF0;
padding: 5px 0px 5px 0px;
top: 15px;
width: auto !important;
width: 472px;
}

div.comments a, div.comments a:link, div.comments a:visited {
color: #626B71;  
}

div.comments a:hover {
color: #000000;
text-decoration: none;
}

.datesubjectcomment {
background-color: transparent;
padding: 5px;
margin-top: 20px;
background-color: #E6EDF0;
}

.userpiccomment {
position: relative;
top: -30px;
left: 0px;
float: left;
margin: 10px 10px -20px 10px;
z-index: 15;
border: 1px solid #B5BFC8;
background-color: #FFFFFF;
padding: 2px;
}

.box {
padding: 10px;
clear: right;
}

input, textarea {
background-color: transparent;
color: #161C1C;
}

textarea.textbox  {
width: 100% !important;
}

.reply{
position: relative;
margin: 20px 30px 10px 30px;
padding: 25px 10px 10px 10px;
text-align: left;
font-family: "Verdana", sans-serif;
font-size: 11px;
line-height: 125%;
background-color: #FFFFFF;
color: #161C1C;
}

.replytoposter {
line-height: 200%;
top: 5px;
color: #000000;
font-family: "georgia", sans-serif;
font-size: 11px;
font-weight: bold;
background-color: transparent;
text-align: left;
padding-top: 5px;
padding-left: 5px;
margin-left: 10px;
border-bottom: 1px solid #393937;
}

.replytosubject {
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: bold;
text-align: center;
padding: 3px; 
margin-left: 10px;
background-color: transparent;
color: #393937;
}

.commentreply {
position: relative;
margin: 10px;
font-size: 11px;
font-family: "Verdana", sans-serif;
color: #161C1C;
}

.commentbox {
background-color: transparent;
border: 1px solid #B5BFC8; 
padding: 10px; 
margin: 10px; 
}

.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #626B71;
}

.datesubjectcomment a:hover {
color: #000000;
}

.commentboxpartial {
background-color: #E9EDF3;
border: 3px double #161C1C; 
padding: 10px; 
margin: 10px; 
}

.commentinfo {
background-color: #FFFFFF; 
margin-top: 10px; 
width: 100%;
}

/* YEAR AND ARCHIVE PAGES */
ul.year {
text-align: center;
padding-bottom: 40px;
}

ul.year li {
display: inline;
}

table.yeartable {
margin-left: auto;
margin-right: auto;
}

td.yeardate {
border-style: none;
}

td.yearday{
background-color: #9CA3AE;
color: #FFFFFF;
border: 1px solid #FFFFFF;
text-align: center;
}

td.yearmonth {
border-style: none;
}

/* FOOTER */
#footer {
text-align: center;
font-family: "Verdana", sans-serif;
font-size: 11px;
font-weight: bold;
letter-spacing: 1px;
background-color: transparent;
color: #161C1C;
border: none;
z-index: 100;
clear: both;
width: 100%;
}

div#footer a, div#footer a:link, div#footer a:visited {
color: #161C1C; 
}

div#footer a:hover {
color: #161C1C;
text-decoration: underline;
}

ul.navfooter{
padding: 0px;
margin: 0 0 0 0;
}

ul.navfooter li  {
display: inline;
margin: 0 5px 0 5px;
}

.clearfoot {
clear: both;
}

.skiplinks {
text-align: center;
}

div.sbarcalendar a:link {
color: #000000;
}

div.sbarcalendar a:hover {
color: #B5BFC8;
}

| SPECIAL INSTRUCTIONS |

Preparing the code:
- Copy the CSS code and paste it in the Notepad.
- If you decided to host the images in your own server, replace every i38.photobucket.com/albums/e107/bel_layouts by the server address where you uploaded the images.

Configuring the layout:
- In the LJ page, go to Journal >> Change Journal Theme.
- If you're using S1 style do the following. If not, skip this step: Click in the link Switch to S2 in the blue box on the right side of the page. Then, click in the button "Yes, I want to upgrade to S2".
- In the 2. Select a New Theme section, type Flexible Squares in the search box. Then select one of the themes listed and click in Apply Theme.
- In the 3. Choose a Page Setup section at the bottom of the page, choose "2 Column (sidebar on left)" and click in the button "Apply Layout".
- Then click in the button Customise your theme, in the bottom on the right side.
- Click in the option Custom CSS and under Use layout's stylesheet(s) choose No (THIS IS VERY IMPORTANT!). Then copy the CSS from the Notepad and paste it in the field Custom stylesheet.
- Then you can navigate through the links in the Customize Your Theme and personalize other things as you wish, like going to the Sidebar option and putting personalized labels or entering a personalized text inside the free text box/blurb, for example.
- Click in the button Save Changes and it's done.

Cross-posted to

layouts_for_fun and

freelayouts.

Bel's Journal

Brokeback Mountain - Brokeback is all we got

Profile

Most Popular Tags

Style Credit

Expand Cut Tags