Smoothy

[artphilia]

Title: Smoothy
System: s2
Theme: Smooth Sailing
Account: free, plus & paid
Header: no
Browser: Chrome & Firefox (others unknown!)
Preview: here or live @ trekfix



/*
CSS by a r t p h i l i a.livejournal.com
Download @ c s s b o x.livejournal.com
TinyIcons by: famfamfam.com
Style System: S2
Theme: Smooth Sailing
Account: Free, Plus & Paid
*/

body {
color: #7D7D7D;
font-family: Calibri, Tahoma, Verdana, sans-serif;
font-size: 12px;
margin: 0;
padding: 0;
background-color: #F1F1F1;
}

a, a:visited, a:active {
color: #61D2D6;
text-decoration: none;
font-weight: normal !important;
}
a:hover {
color: #EDE5E2;
}

input, textarea, select {
background-color: #fafafa;
font-family: Calibri, Tahoma, Verdana, sans-serif;
font-size: 11px;
color: #7D7D7D;
border: 1px solid #CCCCCC;
margin: 1px;
}

code, kbd, pre, tt {
font-family: Consolas, monospace;
}
blockquote {
margin: 15px;
padding: 5px 15px 20px 15px;
font-size: 11px;
font-family: Consolas, Inconsolata, Monaco, monospace;
border: 1px dashed #D3D3D3;
background-color: #F1F1F1F;
text-align: justify;
}

.headimg {
margin: 5px;
width: 160px;
border: 4px solid #FFFFFF;
}

/* CONTAINER */
.pageblock{
padding: 0;
background-color: #fafafa;
width: 1000px;
margin: 0 auto;
-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px #888;
box-shadow: 0 0 5px #888;
}

.pagefooterblock, .pageheaderblock {
display: none;
}

.header-title, .header-subtitle, .header-icon {
display: none;
}

.header-menu {
display: none;
}
.header-menu a, .header-menu a:visited {
white-space: nowrap;
padding: 2px 6px;
text-decoration: none;
}
.header-menu a:hover {
}
.header-menu ul, #footer-menu ul {
margin: 0;
padding: 0;
}
.header-menu li, #footer-menu li {
display: inline;
}

/* BODY */
.bodyblock {
padding: 0;
background-color: #fafafa;
}
.bodyheaderblock {
display: none;
}
.bodynavblock {
margin: 5px;
padding: 5px;
text-align: center;
}
.bodynavblock a, .bodynavblock a:active, .bodynavblock a:visited, .bodynavblock a:hover {
font-weight: normal;
}
.body-title {
display: none;
}
.body-midtitle {
display: none;
}

/* ENTRIES */
.entryHolder {
padding: 10px 5px;
}
.entryUserinfo {
text-align: center;
margin: 5px;
}
.entryUserinfo-usericon img {
-webkit-border-radius: 25px 8px;
-moz-border-radius: 25px 8px;
border-radius: 25px 8px;
position: relative;
}
.entryText {
text-align: justify;
padding: 5px;
}
.entryHeader {
-webkit-border-radius: 25px 8px;
-moz-border-radius: 25px 8px;
border-radius: 25px 8px;
background-color: #F1F1F1;
padding: 4px;
}
.entryHeader a, .entryHeader a:active, .entryHeader a:visited {
color: #61D2D6;
text-decoration: none;
font-weight: normal !important;
}
.entryHeader a:hover {
color: #EDE5E2;
}
.entryHeaderDate {
font-size: 10px;
color: #7D7D7D;
}
.entryHeaderSubject {
text-transform: none;
font-size: 15px;
font-style: italic;
}

/* CURRENTS */
.entryMetadata {
text-transform: uppercase;
font-size: 10px;
padding: 5px 0;
}
.entryMetadata ul {
margin: 0;
padding: 0;
}
.entryMetadata li {
background-image: url(http://artphilia.de/pics/bullet_star.png);
background-repeat: no-repeat;
position: left middle;
padding: 2px 0 0 16px;
margin: 1px;
display: block;
}
.entryMetadata-label {
padding: 0 3px;
}

.entryLinkbar {
border-width: 1px 0;
border-style: dotted;
border-color: #CCCCCC;
text-transform: uppercase;
text-align: center;
font-size: 11px;
padding: 10px 0;
}
.entryLinkbar a, .entryLinkbar a:visited, .entryLinkbar a:active {
color: #61D2D6;
text-decoration: none;
}
.entryLinkbar a:hover {
color: #EDE5E2;
}
.entryLinkbar ul {
margin: 0;
padding: 0;
}
.entryLinkbar li {
padding: 0 10px;
display: inline;
}

/* FOOTER */
#footer-menu {
text-transform: lowercase;
background-color: transparent;
white-space: nowrap;
text-align: center;
padding: 10px 5px;
}

/* SIDEBAR */
.sidebar {
background-image: -webkit-linear-gradient(left, #fafafa, #F1F1F1);
background-image: -moz-linear-gradient(left, #fafafa, #F1F1F1);
background-image: -ms-linear-gradient(left, #fafafa, #F1F1F1);
background-image: -o-linear-gradient(left, #fafafa, #F1F1F1);
-moz-box-shadow: 5px 0px 5px -4px #888;
-webkit-box-shadow: 5px 0px 5px -4px #888;
box-shadow: 5px 0px 5px -4px #888;
padding: 0 10px;
width: 200px;
}
.sidebox {
margin: 0 auto;
padding: 0;
text-align: center;
}
.sideboxTitle {
-webkit-border-radius: 25px 8px;
-moz-border-radius: 25px 8px;
border-radius: 25px 8px;
background-color: #F1F1F1;
text-transform: none;
font-size: 15px;
font-style: italic;
padding: 2px;
text-align: center;
}
.sideboxContent {
line-height: 14px;
text-align: left;
padding: 3px;
}
.sidebox #freetext {
text-align: center;
}
.sidebox #profile {
display: none;
}
.sidebox #latestmonth {
text-align: center;
}
.sidebox #search {
text-align: left;
}
.listitem {
background-image: url(http://artphilia.de/pics/bullet_star.png);
position: left middle;
background-repeat: no-repeat;
padding: 2px 0 0 16px;
margin: 1px;
}
.sidebox #systemlinks, .summaryList {
font-weight: normal !important;
text-transform: uppercase;
font-size: 11px;
}
.sidebox #latestmonth table {
margin: 0 auto;
}
#latestmonth td {
text-align: center;
margin: 2px;
font-size: 11px;
}
.latestmonth-inactive {
border: 1px solid #F1F1F1;
padding: 5px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
background-color: transparent;
}
.latestmonth-active {
padding: 5px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
background-color: #F1F1F1;
}
.profile-label {
display: none;
}

/* COMMENT PAGE */
.commentHolder {
color: #7D7D7D;
background-color: #fafafa;
margin: 5px;
}
.commentUserinfo {
float: right;
text-align: center;
margin: 0;
background-color: #fafafa;
}
.commentUserinfo-usericon img {
padding: 5px;
border: 0;
}
.commentText {
width: 100%;
padding: 5px;
}
.commentHeader {
background-color: #F1F1F1;
font-style: italic;
font-size: 15px;
padding: 4px 8px;
}
.commentHeaderSubject {
font-weight: normal;
}
.commentLinkbar {
border-width: 1px 0;
border-style: dotted;
border-color: #CCCCCC;
text-transform: uppercase;
text-align: center;
font-size: 11px;
padding: 10px 0;
}
.commentLinkbar ul {
margin: 0;
padding: 0;
}
.commentLinkbar li {
padding: 0;
margin: 0 10px;
display: inline;
}
.replyform, #replyto {
border: 0;
}

/* ARCHIVE PAGE */
.yearlinks {
text-align: center;
}
.yearlink{
padding: 0 4px;
}
.month {
width: 80%;
margin: 0 auto;
padding: 10px 0;
}
.daysubjects {
padding: 8px 8px 8px 40px;
}
.daytitles {
text-align: center;
background-color: #F1F1F1;
}
.day-date {
width: 50%;
text-align: center;
}
.day-count {
width: 50%;
text-align: center;
float: right;
font-size: 13px;
}
.day-count a {
color: #61D2D6;
text-decoration: none;
font-weight: normal !important;
}

/* TAGS PAGE */
.tagstable tr:nth-child(odd) {
background-color: #F1F1F1;
}
.tagstable tr:nth-child(even) {
background-color: #FAFAFA;
}
.tagstable {
border: 1px dashed #CCCCCC;
width: 90%;
}

/* USER, COMMUNITY, PROTECTED ICONS */

/* --- User icons --- */
.ljuser img[src*="userinfo.gif"] {
width: 0 !important;
height: 0 !important;
background-color: transparent !important;
background-image: url(http://i248.photobucket.com/albums/gg197/artphilia/livejournal/mccoy.png);
padding: 0 0 16px 17px !important;
background-repeat: no-repeat;
background-position: left center;
}

/* --- Community icons --- */
.ljuser img[src*="community.gif"] {
width: 0 !important;
height: 0 !important;
background-color: transparent !important;
background-image: url(http://i248.photobucket.com/albums/gg197/artphilia/livejournal/crew.png);
padding: 0 0 18px 27px !important;
background-repeat: no-repeat;
background-position: left center;
}

/* --- Lock icons --- */
.entryHeaderSubject img[src*="icon_protected.gif"], .summaryList img[src*="icon_protected.gif"] {
width: 0 !important;
height: 0 !important;
background-image: url(http://i248.photobucket.com/albums/gg197/artphilia/livejournal/tinyicons/key.png);
padding: 6px 8px 10px 10px !important;
background-repeat: no-repeat;
position: left middle;
}

/* --- Sticky icons --- */
.entryHeaderSubject img[src*="icon_sticky.png"], .summaryList img[src*="icon_sticky.png"] {
width: 0 !important;
height: 0 !important;
background-image: url(http://i248.photobucket.com/albums/gg197/artphilia/livejournal/tinyicons/attach.png);
padding: 2px 11px 12px 4px !important;
background-repeat: no-repeat;
position: left middle;
z-index: 15;
}

********* R E A D M E *********

* Please upload ALL images from the zip to your own host i.e. photobucket.com, flickr.com or imageshack.us
* Open the css.txt with your texteditor and search for the following urls and replace them with your own. I won't host the images for you. Thanks!
- http://artphilia.de/pics/bullet_star.png
- http://i248.photobucket.com/albums/gg197/artphilia/livejournal/mccoy.png
- http://i248.photobucket.com/albums/gg197/artphilia/livejournal/crew.png
- http://i248.photobucket.com/albums/gg197/artphilia/livejournal/tinyicons/key.png
- http://i248.photobucket.com/albums/gg197/artphilia/livejournal/tinyicons/attach.png

1) Go to your customize (http://www.livejournal.com/customize) site.
2) (Select a new theme) by searching for Smooth Sailing. If you have you own layer for Smooth Sailing use it.
3) (Choose a page setup) Set sidebar left.
4) Hit the customize selected theme button.
5) (customize your theme)
- (Sidebar) Set » Profile Position - hide
- (Sidebar) Set » Summary Position - up to you (I chose 5)
- (Sidebar) Set » Latest Month Position - up to you (I chose 4)
- (Sidebar) Set » Links Visibility - 2 (This is IMPORTANT because we're using the links for the *menu!!!)
- (Sidebar) Set » Tags Sidebox Position - up to you (I chose 3)
- (Sidebar) Set » Free Text Position - 1 (IMPORTANT if you wanna use a header image)
- (Sidebar) Set » Multisearch Position - up to you (I chose 17)
6) (Custom CSS) Set the three pulldowns to 'no', copy the css and paste it into » Custom stylesheet. Save changes!
7) A link back to my journal (cssbox) somewhere at yours would be very nice, but isn't a must.

* MENU
Add these Links to your linklist. Name it whatever you want and don't forget to replace USER with your username!

Recent = http://USER.livejournal.com
Archive = http://USER.livejournal.com/calendar
Friends = http://USER.livejournal.com/friends
Profile = http://USER.livejournal.com/profile
Tags = http://USER.livejournal.com/tag

If you wanna change the images or colours that's just fine. I won't be offended. But please do not claim my css as yours. Thank you and enjoy!

More layouts @ cssbox