Layout #025: Layout with a Seaside View
Стиль: S2 Smooth Sailing
Тип аккаунта: любой
Разрешение экрана: 1024+
Посты: резиновые
Картинки: резиновые (по размеру поста)
Браузеры: Mozilla 3.5 и выше, Chrome 4 и выше, Safari 4 и выше, Opera 10.5 и выше (в IE есть проблемы) *
Комментарии в стиле журнала: да
Контрольная панель: отключена (можно включить **)
Сайдбар: полный
Заголовок и подзаголовок: только заголовок
Style: S2 Smooth Sailing
Account type: all types
Screen Resolution: 1024+
Entries: stretch
Images: stretch (entries width)
Browsers: Mozilla 3.5 or up, Chrome 4 or up, Safari 4 or up, Opera 10.5 or up (IE has issues) *
Comments in journal's style: yes
Controlstrip: disabled (can be enabled **)
Sidebar: enabled, full
Title & Subtitle: title only
Вживую // Live preview:
recent // friends // comments
1. В настройках журнала выбираете тему Smooth Sailing (положение сайдбара - слева!) и жмете кнопку внизу "Customise selected theme ->".
2. На вкладке "Display" в разделе "Basic Options" выбираете положение юзерпиков справа:
Userinfo Position in Entries - Right side of the entry text
3. В левом меню выбираете пункт "Custom CSS". В разделе "Page" ставите:
- Use layout's stylesheet(s): Yes
- Use layout's stylesheet(s) when including custom external stylesheet: No
4. В окошко Custom stylesheet вставляете текст:
1. In Customize section choose Smooth Sailing style (sidebar on the left!) and click "Customise selected theme ->" below.
2. In "Display" section, in "Basic Options" submenu, choose userpics position:
Userinfo Position in Entries - Right side of the entry text
3. In left menu choose "Custom CSS". In "Page" section choose:
- Use layout's stylesheet(s): Yes
- Use layout's stylesheet(s) when including custom external stylesheet: No
4. In Custom stylesheet block, insert the following code:
/* Layout #25: Layout with a Seaside View */
/* Date: July 19, 2010 */
/* S2 Style: Smooth Sailing */
/*--------CREDITS---------*/
/* Design & Codes: Ruthenia Alba (ruthenia_alba.livejournal.com) */
/* Tiny Icons: Scuba Diving Set by pcconsultants.co.uk @ iconfinder.com */
/*--------COLORS-------------
36686a - text (dark marine)
#4c9b9e - a (light marine)
#ac8f6b - a:hover (sand yellow)
#85663f - header (dark yellow)
---------------------------*/
/*-------- BASICS ---------*/
body {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bg2.jpg) repeat scroll;
}
.pageblock {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-pageblock-bg.png) repeat-x bottom left
transparent;
border: 0;
margin-top: 3px;
}
.body-title,
.body-midtitle {
display: none;
}
/*-------- links---------*/
a, a:link, a:visited {
color: #4c9b9e;
text-decoration: none;
}
a:hover {
color: #ac8f6b;
text-decoration: none;
}
/* ----------- CONTENT ----------- */
/* ----------- header ----------- */
.pageheaderblock {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-header2.jpg) no-repeat top left,
url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-sand.jpg) repeat-x;
//background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-header2.jpg) no-repeat top left transparent;
height: ;
border: ;
margin: ;
padding: ;
}
/* ----------- title & subtitle ----------- */
.header-title {
position: relative;
z-index: 10;
padding: 320px 0px 19px 0px;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-title-bg.png) repeat-x bottom transparent;
text-align: center;
font: normal 20px Candara, Arial;
letter-spacing: 0px;
color: #85663f;
}
.header-subtitle {
display: none;
}
.header-icon {
display:none;
}
/* ----------- header navigation ----------- */
.header-menu {
position: relative;
background: transparent;
border: 0;
padding: 0;
margin-top: 7px;
text-align: center;
letter-spacing: 0;
}
.header-menu ul {
border: 0;
padding: 0;
margin: 0;
}
.header-menu ul li {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
padding: 10px 5px;
margin: -50px 10px;
font: normal 18px Candara !important;
border-radius: 0 0 10px 10px;
-moz-border-radius: 0 0 10px 10px;
-webkit-border-radius: 0 0 10px 10px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
.header-menu a,
.header-menu a:visited {
color: #36686a !important;
}
.header-menu a:hover {
background: transparent;
color: #4c9b9e !important;
}
.bodyheaderblock {
display: none;
}
/* ---- SIDEBAR ---- */
.sidebar {
background: transparent;
width: 250px;
margin: 8px 40px 0 0;
font: normal 11px Tahoma;
line-height: 20px;
color: #36686a;
}
.sidebox {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-star2.png) no-repeat transparent;
border: 0;
padding: 15px 0 0;
}
.sideboxTitle {
position: relative;
z-index: 1;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-title-bg.png) bottom left repeat-x
transparent;
border: 0;
padding: 0px 5px 20px 70px;
font: normal 18px Candara, Arial;
color: #36686a;
}
.sideboxContent {
position: relative;
z-index: 0;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
padding: 10px;
margin: -3px 15px 25px 15px;
color: #36686a;
border-radius: 0 0 10px 10px;
-moz-border-radius: 0 0 10px 10px;
-webkit-border-radius: 0 0 10px 10px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
/* ---- sidebar blurb ---- */
#freetext {
text-align: center;
}
/* ---- sidebar calendar ---- */
#latestmonth {
font: normal 18px Candara, Arial;
}
.latestmonth-inactive {
padding: 5px;
margin: 3px;
font: normal 11px Tahoma, Arial;
}
.latestmonth-active {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bullet-big.png) no-repeat transparent;
padding: 6px;
margin: 1px;
font: normal 11px Tahoma, Arial;
}
.latestmonth-active a {
color: #36686a;
}
/* ---- sidebar links ---- */
.listitem {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bullet.png) top left no-repeat transparent;
margin: 5px 0;
text-align:left;
}
.listitem a {
margin: 0 0 0 20px;
}
/* ---- sidebar summary ---- */
.summaryList {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bullet.png) top left no-repeat transparent;
margin: 5px 0;
padding-left: 20px;
text-align:left;
}
.summaryList b {
color: transparent;
}
.summaryList a b {
color: #4c9b9e;
}
.summaryList a:hover b {
color: #ac8f6b;
}
/* --------- ENTRY --------------------------- */
.bodyblock {
width: 80%;
min-width: 750px;
max-width: 1200px;
margin: 30px auto 0 30px;
padding: 0;
}
.entryHolder {
margin: 0 0 40px 0;
background: transparent;
border: 0;
}
.entryHolder table {
margin-top: -5px;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
border-radius: 0 0 10px 10px;
-moz-border-radius: 0 0 10px 10px;
-webkit-border-radius: 0 0 10px 10px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
.entryUserinfo {
position: relative;
float: right !important;
margin: 0 -150px 0 30px;
background: ;
padding: ;
text-align: ;
}
.entryUserinfo .ljuser a b {
font: bold 11px Tahoma, Arial;
color: #;
}
.entryUserinfo-usericon {
padding: 10px;
}
.entryUserinfo-username {
padding: 10px 2px;
}
/* ------ entry header: date & subject ------ */
.entryHeader {
position: relative;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-shell2.png) no-repeat top right,
url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-rope-big.png) bottom repeat-x;
//background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-rope-big.png) bottom repeat-x;
min-height: 50px;
padding: 0px 10px 20px 10px;
font: normal 18px Candara, Arial;
text-align: right;
color: #36686a;
}
.entryHeader a {
margin-right: 50px;
}
.entryHeaderDate {
background: transparent;
margin-right: 50px;
display: block;
}
.entryHeaderSubject {
margin-right: 50px;
color: transparent;
font-size: 1px;
}
.entryHeaderSubject a,
.entryHeaderSubject a:link,
.entryHeaderSubject a:visited {
font: normal 18px Candara, Arial;
color: #36686a;
}
.entryHeaderSubject a:hover {
color: #4c9b9e;
}
a .subj-link {
margin: 0;
padding: 0;
}
/* -------- entry text -------------- */
.entryText {
margin: 10px 5px;
padding: 0 10px;
font: normal 11px Tahoma;
color: #36686a;
text-align: justify;
line-height: 20px;
letter-spacing: 0;
}
.entryText img {
max-width: 100%;
}
blockquote {
background: #fff;
opacity: .5;
margin: 10px 100px;
padding: 10px;
color: #36686a;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
/* ------- entry metadata: tags etc. ---------- */
.entryMetadata {
margin: 0;
padding: 5px 12px 10px 12px;
}
.entryMetadata ul {
margin: 5px 0 0 0;
}
.entryMetadata ul li {
margin: 0 10px 0 0;
}
.entryMetadata-content {
font: normal 11px Tahoma, Arial;
color: #4c9b9e;
}
.entryMetadata-label {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bullet.png) no-repeat transparent;
padding: 0 4px 0 15px;
font: normal 16px Candara, Arial;
color: #36686a;
}
/* ------- entry links (comments, memories etc.) --------- */
.entryLinkbar {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-title-bg.png) top left repeat-x transparent;
margin: 0;
padding: 10px 12px;
font: normal 14px Candara, Arial;
color: #36686a;
text-align: left;
}
.entryLinkbar ul {
margin-top: 10px;
}
.entryLinkbar li,
.commentLinkbar li {
padding: 0 15px 0 0;
}
/* --------- FOOTER ----------- */
#footer-menu,
.bodynavblock,
.bodynavblock b {
background: transparent;
border: 0;
font: normal 20px candara, Arial;
color: #36686a;
letter-spacing: 0;
text-align: center;
}
#footer-menu a, #footer-menu a:visited,
.bodynavblock a, .bodynavblock a:visited {
color: #36686a;
text-decoration: none;
}
#footer-menu a:hover,
.bodynavblock a:hover {
color: #4c9b9e;
}
.pagefooterblock {
height: 143px;
border: 0;
margin: 0 20px;
padding: 20px 0 5px 20px;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-footer-bg.png) bottom right no-repeat,
url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-credit.png) no-repeat bottom left;
//background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-footer-bg.png) bottom right no-repeat;
color: transparent;
//color: #72C5C7;
}
/* ---------------- COMMENTS PAGE ------------------------ */
.commentHolder {
margin: 0 0 20px 0;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
border: 0;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
border-radius: 5px 5px 10px 10px;
-moz-border-radius: 5px 5px 10px 10px;
-webkit-border-radius: 5px 5px 10px 10px;
}
.commentHolder table {
background: transparent;
}
.commentHeader {
position: relative;
background: transparent;
padding: 5px 10px 2px 10px;
font: normal 14px Candara, Arial;
text-align: left;
color: #36686a;
}
.commentUserinfo {
position: relative;
}
.commentUserinfo .ljuser a b {
}
.commentUserinfo-username {
font: bold 11px Tahoma, Arial;
padding: 3px;
}
.commentUserinfo-usericon {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bg2.jpg) repeat transparent;
padding: 5px;
margin: 5px 0 0 10px;
}
.commentText {
margin: 0 5px 5px 0;
padding: 0 5px 0 0;
font: normal 11px Tahoma;
color: #36686a;
text-align: justify;
line-height: 20px;
letter-spacing: 0;
}
.commentText img {
max-width: 100%;
}
.commentLinkbar {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-title-bg.png) top left repeat-x transparent;
margin: 0;
padding: 8px 12px;
font: normal 12px Candara, Arial;
color: #36686a;
text-align: left;
}
.commentLinkbar ul {
margin-top: 7px;
}
/* ------ QUICK REPLY ------ */
#postform {
margin: 0 !important;
padding: 0;
}
.quickreply_entry form table,
.quickreply_comment form table,
#postform table {
color: #36686a;
width: 95%;
background: transparent;
padding: 0 0 10px 10px;
margin: 0;
border: 0 !important;
font: normal 11px Tahoma;
}
.textbox {
border: 0;
width: 100%;
padding: 3px;
background: #fff;
opacity: .5;
font: normal 11px Tahoma;
color: #36686a;
margin-bottom: 15px;
}
.replyform {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
border: 0;
margin: 0;
padding: 15px 5px;
font: normal 11px Tahoma;
line-height: 20px;
color: #36686a;
border-radius: 5px 5px 10px 10px;
-moz-border-radius: 5px 5px 10px 10px;
-webkit-border-radius: 5px 5px 10px 10px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
#postform b {
color: #36686a;
}
/* ---- TAGS PAGE ---- */
.tagstable {
margin-top: 50px !important;
width: 100%;
border: 0;
padding: 20px;
}
.tagstable tbody tr td {
border: 0;
}
/* ---------------- CALENDAR ------------------------ */
.month {
background: transparent;
width: 90% !important;
margin: 0 auto;
padding: 20px 60px;
border: 0;
}
.daysubjects {
}
.daytitles {
background: transparent;
border: 0;
margin: 15px;
padding: 2px;
font: normal ;
text-transform: uppercase;
color: #36686a !important;
font: normal 16px Candara, Arial;
text-align: center;
}
.day-blank {
border: 0;
}
.day {
background: transparent;
border: 0;
margin:10px;
padding:3px;
}
.day-date {
width:30%;
border: 0;
padding: 5px 2px;
color: #36686a !important;
font: normal 14px Candara, Arial;
text-align: center;
}
.day-count {
float: right;
text-align: center;
width: 50%;
color: #36686a !important;
font: normal 12px Candara, Arial;
}
.day-count a,
.day-count a:visited {
padding:5px;
text-decoration:none;
}
.day-count a:hover {
}
/* --------- MISCELLANEOUS --------------- */
/* ------ input & textarea ---------------- */
textarea, input, select {
border: 0;
background: #fff;
margin:2px;
padding: 2px 3px;
opacity: .5;
color: #36686a !important;
font: normal 12px Candara, Arial;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
/* -------- lj user & images ------------ */
img[src*="userinfo.gif"] {
width: 0;
height: 0;
padding: 17px 14px 7px 18px;
margin: 0 0 0 3px;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-ljuser2.png) no-repeat transparent;
}
img[src*="community.gif"] {
width: 0;
height: 0;
padding: 10px 14px 12px 20px;
margin: 0 0 0 3px;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-ljcomm2.png) no-repeat transparent;
}
/* -------- lj controlstrip ------------ */
#lj_controlstrip {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-title-bg.png) bottom repeat-x;
padding-bottom: 8px;
font: normal 11px Tahoma, Arial;
}
#lj_controlstrip tbody {
background: ;
}
#lj_controlstrip_user,
#lj_controlstrip_actionlinks,
#lj_controlstrip_search,
#lj_controlstrip_login,
#lj_controlstrip_loggedout_userpic {
border-right:0 none;
}
#lj_controlstrip_statustext,
#lj_controlstrip_user {
color: #36686a;
font: normal 11px Tahoma, Arial;
}
#lj_controlstrip a,
#lj_controlstrip a:link,
#lj_controlstrip a:visited,
#lj_controlstrip .ljuser a b {
color: #4c9b9e !important;
font: normal 11px Tahoma, Arial;
}
#lj_controlstrip a:hover,
#lj_controlstrip .ljuser a:hover b {
color: #ac8f6b !important;
text-decoration: none;
}
#lj_controlstrip_login td,
#lj_controlstrip td td {
border-bottom: 0;
}
#lj_controlstrip input {
background: #acacac !important;
border: 1px solid #!important;
padding: 3px;
color:#;
}
#lj_controlstrip_search_input_text,
#lj_controlstrip select,
#lj_controlstrip input#xc_user,
#lj_controlstrip input#xc_password,
#lj_controlstrip input#xc_remember,
#lj_controlstrip #Logout {
font: normal 11px Tahoma, Arial;
color: # !important;
background: # !important;
border: !important;
padding: 1px 5px !important;
}
#lj_controlstrip_search_submit {
margin: 0 30px !important;
padding: 1px 5px !important;
}
/* ------------------ Contextual Popup ------------------ */
div.ContextualPopup img {
border: 0;
}
div.ContextualPopup div.Inner {
opacity: .8;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
border: 0;
color:#36686a !important;
font: normal 11px Tahoma;
margin:0;
padding:5px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
div.ContextualPopup .Relation {
border-bottom: 0;
color:#!important;
font: ;
margin:2px 0;
padding:2px 0;
}
div.ContextualPopup .Content .OnlineStatus {
font-weight:bold;
}
div.ContextualPopup .Userpic {
padding:8px 8px 0 0;
}
div.ContextualPopup div.Inner a,
div.ContextualPopup div.Inner a:link,
div.ContextualPopup div.Inner a:visited {
color:#36686a !important;
font: normal 11px Tahoma;
text-decoration: none !important;
}
div.ContextualPopup div.Inner a:hover {
color: #4c9b9e !important;
text-decoration: none !important;
}
/* ---- delete this block to add controlstrip ---- */
#lj_controlstrip {
display: none;
}
.pageblock {
margin-top: -45px;
}
/* ---- end of controlstrip block ---- */
* В этом дизайне я использовала элементы нового стандарта CSS3, который работает начиная с последних версий браузеров (кроме IE). Если дизайн после установки не выглядит так, как на скриншоте, советую обновить браузер. Если у вас IE - рекомендую его сменить на любой из списка:)
* In this layout I used some elements of the new CSS3 standard which works in latest versions of popular browsers (except IE). If the layout after installation doesn't look like the screenshot, I recommend to update your browser. If you have IE - then to replace it to another one from the list:)
** Включить контрольную панель можно, удалив блок в конце кода, начинающийся строчкой:
/* ---- delete this block to add controlstrip ---- */
** You can enable controlstrip by removing the next block (in the very end of the code), starting with:
/* ---- delete this block to add controlstrip ---- */
Тип аккаунта: любой
Разрешение экрана: 1024+
Посты: резиновые
Картинки: резиновые (по размеру поста)
Браузеры: Mozilla 3.5 и выше, Chrome 4 и выше, Safari 4 и выше, Opera 10.5 и выше (в IE есть проблемы) *
Комментарии в стиле журнала: да
Контрольная панель: отключена (можно включить **)
Сайдбар: полный
Заголовок и подзаголовок: только заголовок
Style: S2 Smooth Sailing
Account type: all types
Screen Resolution: 1024+
Entries: stretch
Images: stretch (entries width)
Browsers: Mozilla 3.5 or up, Chrome 4 or up, Safari 4 or up, Opera 10.5 or up (IE has issues) *
Comments in journal's style: yes
Controlstrip: disabled (can be enabled **)
Sidebar: enabled, full
Title & Subtitle: title only
Вживую // Live preview:
recent // friends // comments
1. В настройках журнала выбираете тему Smooth Sailing (положение сайдбара - слева!) и жмете кнопку внизу "Customise selected theme ->".
2. На вкладке "Display" в разделе "Basic Options" выбираете положение юзерпиков справа:
Userinfo Position in Entries - Right side of the entry text
3. В левом меню выбираете пункт "Custom CSS". В разделе "Page" ставите:
- Use layout's stylesheet(s): Yes
- Use layout's stylesheet(s) when including custom external stylesheet: No
4. В окошко Custom stylesheet вставляете текст:
1. In Customize section choose Smooth Sailing style (sidebar on the left!) and click "Customise selected theme ->" below.
2. In "Display" section, in "Basic Options" submenu, choose userpics position:
Userinfo Position in Entries - Right side of the entry text
3. In left menu choose "Custom CSS". In "Page" section choose:
- Use layout's stylesheet(s): Yes
- Use layout's stylesheet(s) when including custom external stylesheet: No
4. In Custom stylesheet block, insert the following code:
/* Layout #25: Layout with a Seaside View */
/* Date: July 19, 2010 */
/* S2 Style: Smooth Sailing */
/*--------CREDITS---------*/
/* Design & Codes: Ruthenia Alba (ruthenia_alba.livejournal.com) */
/* Tiny Icons: Scuba Diving Set by pcconsultants.co.uk @ iconfinder.com */
/*--------COLORS-------------
36686a - text (dark marine)
#4c9b9e - a (light marine)
#ac8f6b - a:hover (sand yellow)
#85663f - header (dark yellow)
---------------------------*/
/*-------- BASICS ---------*/
body {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bg2.jpg) repeat scroll;
}
.pageblock {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-pageblock-bg.png) repeat-x bottom left
transparent;
border: 0;
margin-top: 3px;
}
.body-title,
.body-midtitle {
display: none;
}
/*-------- links---------*/
a, a:link, a:visited {
color: #4c9b9e;
text-decoration: none;
}
a:hover {
color: #ac8f6b;
text-decoration: none;
}
/* ----------- CONTENT ----------- */
/* ----------- header ----------- */
.pageheaderblock {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-header2.jpg) no-repeat top left,
url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-sand.jpg) repeat-x;
//background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-header2.jpg) no-repeat top left transparent;
height: ;
border: ;
margin: ;
padding: ;
}
/* ----------- title & subtitle ----------- */
.header-title {
position: relative;
z-index: 10;
padding: 320px 0px 19px 0px;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-title-bg.png) repeat-x bottom transparent;
text-align: center;
font: normal 20px Candara, Arial;
letter-spacing: 0px;
color: #85663f;
}
.header-subtitle {
display: none;
}
.header-icon {
display:none;
}
/* ----------- header navigation ----------- */
.header-menu {
position: relative;
background: transparent;
border: 0;
padding: 0;
margin-top: 7px;
text-align: center;
letter-spacing: 0;
}
.header-menu ul {
border: 0;
padding: 0;
margin: 0;
}
.header-menu ul li {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
padding: 10px 5px;
margin: -50px 10px;
font: normal 18px Candara !important;
border-radius: 0 0 10px 10px;
-moz-border-radius: 0 0 10px 10px;
-webkit-border-radius: 0 0 10px 10px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
.header-menu a,
.header-menu a:visited {
color: #36686a !important;
}
.header-menu a:hover {
background: transparent;
color: #4c9b9e !important;
}
.bodyheaderblock {
display: none;
}
/* ---- SIDEBAR ---- */
.sidebar {
background: transparent;
width: 250px;
margin: 8px 40px 0 0;
font: normal 11px Tahoma;
line-height: 20px;
color: #36686a;
}
.sidebox {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-star2.png) no-repeat transparent;
border: 0;
padding: 15px 0 0;
}
.sideboxTitle {
position: relative;
z-index: 1;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-title-bg.png) bottom left repeat-x
transparent;
border: 0;
padding: 0px 5px 20px 70px;
font: normal 18px Candara, Arial;
color: #36686a;
}
.sideboxContent {
position: relative;
z-index: 0;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
padding: 10px;
margin: -3px 15px 25px 15px;
color: #36686a;
border-radius: 0 0 10px 10px;
-moz-border-radius: 0 0 10px 10px;
-webkit-border-radius: 0 0 10px 10px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
/* ---- sidebar blurb ---- */
#freetext {
text-align: center;
}
/* ---- sidebar calendar ---- */
#latestmonth {
font: normal 18px Candara, Arial;
}
.latestmonth-inactive {
padding: 5px;
margin: 3px;
font: normal 11px Tahoma, Arial;
}
.latestmonth-active {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bullet-big.png) no-repeat transparent;
padding: 6px;
margin: 1px;
font: normal 11px Tahoma, Arial;
}
.latestmonth-active a {
color: #36686a;
}
/* ---- sidebar links ---- */
.listitem {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bullet.png) top left no-repeat transparent;
margin: 5px 0;
text-align:left;
}
.listitem a {
margin: 0 0 0 20px;
}
/* ---- sidebar summary ---- */
.summaryList {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bullet.png) top left no-repeat transparent;
margin: 5px 0;
padding-left: 20px;
text-align:left;
}
.summaryList b {
color: transparent;
}
.summaryList a b {
color: #4c9b9e;
}
.summaryList a:hover b {
color: #ac8f6b;
}
/* --------- ENTRY --------------------------- */
.bodyblock {
width: 80%;
min-width: 750px;
max-width: 1200px;
margin: 30px auto 0 30px;
padding: 0;
}
.entryHolder {
margin: 0 0 40px 0;
background: transparent;
border: 0;
}
.entryHolder table {
margin-top: -5px;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
border-radius: 0 0 10px 10px;
-moz-border-radius: 0 0 10px 10px;
-webkit-border-radius: 0 0 10px 10px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
.entryUserinfo {
position: relative;
float: right !important;
margin: 0 -150px 0 30px;
background: ;
padding: ;
text-align: ;
}
.entryUserinfo .ljuser a b {
font: bold 11px Tahoma, Arial;
color: #;
}
.entryUserinfo-usericon {
padding: 10px;
}
.entryUserinfo-username {
padding: 10px 2px;
}
/* ------ entry header: date & subject ------ */
.entryHeader {
position: relative;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-shell2.png) no-repeat top right,
url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-rope-big.png) bottom repeat-x;
//background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-rope-big.png) bottom repeat-x;
min-height: 50px;
padding: 0px 10px 20px 10px;
font: normal 18px Candara, Arial;
text-align: right;
color: #36686a;
}
.entryHeader a {
margin-right: 50px;
}
.entryHeaderDate {
background: transparent;
margin-right: 50px;
display: block;
}
.entryHeaderSubject {
margin-right: 50px;
color: transparent;
font-size: 1px;
}
.entryHeaderSubject a,
.entryHeaderSubject a:link,
.entryHeaderSubject a:visited {
font: normal 18px Candara, Arial;
color: #36686a;
}
.entryHeaderSubject a:hover {
color: #4c9b9e;
}
a .subj-link {
margin: 0;
padding: 0;
}
/* -------- entry text -------------- */
.entryText {
margin: 10px 5px;
padding: 0 10px;
font: normal 11px Tahoma;
color: #36686a;
text-align: justify;
line-height: 20px;
letter-spacing: 0;
}
.entryText img {
max-width: 100%;
}
blockquote {
background: #fff;
opacity: .5;
margin: 10px 100px;
padding: 10px;
color: #36686a;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
/* ------- entry metadata: tags etc. ---------- */
.entryMetadata {
margin: 0;
padding: 5px 12px 10px 12px;
}
.entryMetadata ul {
margin: 5px 0 0 0;
}
.entryMetadata ul li {
margin: 0 10px 0 0;
}
.entryMetadata-content {
font: normal 11px Tahoma, Arial;
color: #4c9b9e;
}
.entryMetadata-label {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bullet.png) no-repeat transparent;
padding: 0 4px 0 15px;
font: normal 16px Candara, Arial;
color: #36686a;
}
/* ------- entry links (comments, memories etc.) --------- */
.entryLinkbar {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-title-bg.png) top left repeat-x transparent;
margin: 0;
padding: 10px 12px;
font: normal 14px Candara, Arial;
color: #36686a;
text-align: left;
}
.entryLinkbar ul {
margin-top: 10px;
}
.entryLinkbar li,
.commentLinkbar li {
padding: 0 15px 0 0;
}
/* --------- FOOTER ----------- */
#footer-menu,
.bodynavblock,
.bodynavblock b {
background: transparent;
border: 0;
font: normal 20px candara, Arial;
color: #36686a;
letter-spacing: 0;
text-align: center;
}
#footer-menu a, #footer-menu a:visited,
.bodynavblock a, .bodynavblock a:visited {
color: #36686a;
text-decoration: none;
}
#footer-menu a:hover,
.bodynavblock a:hover {
color: #4c9b9e;
}
.pagefooterblock {
height: 143px;
border: 0;
margin: 0 20px;
padding: 20px 0 5px 20px;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-footer-bg.png) bottom right no-repeat,
url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-credit.png) no-repeat bottom left;
//background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-footer-bg.png) bottom right no-repeat;
color: transparent;
//color: #72C5C7;
}
/* ---------------- COMMENTS PAGE ------------------------ */
.commentHolder {
margin: 0 0 20px 0;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
border: 0;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
border-radius: 5px 5px 10px 10px;
-moz-border-radius: 5px 5px 10px 10px;
-webkit-border-radius: 5px 5px 10px 10px;
}
.commentHolder table {
background: transparent;
}
.commentHeader {
position: relative;
background: transparent;
padding: 5px 10px 2px 10px;
font: normal 14px Candara, Arial;
text-align: left;
color: #36686a;
}
.commentUserinfo {
position: relative;
}
.commentUserinfo .ljuser a b {
}
.commentUserinfo-username {
font: bold 11px Tahoma, Arial;
padding: 3px;
}
.commentUserinfo-usericon {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-bg2.jpg) repeat transparent;
padding: 5px;
margin: 5px 0 0 10px;
}
.commentText {
margin: 0 5px 5px 0;
padding: 0 5px 0 0;
font: normal 11px Tahoma;
color: #36686a;
text-align: justify;
line-height: 20px;
letter-spacing: 0;
}
.commentText img {
max-width: 100%;
}
.commentLinkbar {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-title-bg.png) top left repeat-x transparent;
margin: 0;
padding: 8px 12px;
font: normal 12px Candara, Arial;
color: #36686a;
text-align: left;
}
.commentLinkbar ul {
margin-top: 7px;
}
/* ------ QUICK REPLY ------ */
#postform {
margin: 0 !important;
padding: 0;
}
.quickreply_entry form table,
.quickreply_comment form table,
#postform table {
color: #36686a;
width: 95%;
background: transparent;
padding: 0 0 10px 10px;
margin: 0;
border: 0 !important;
font: normal 11px Tahoma;
}
.textbox {
border: 0;
width: 100%;
padding: 3px;
background: #fff;
opacity: .5;
font: normal 11px Tahoma;
color: #36686a;
margin-bottom: 15px;
}
.replyform {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
border: 0;
margin: 0;
padding: 15px 5px;
font: normal 11px Tahoma;
line-height: 20px;
color: #36686a;
border-radius: 5px 5px 10px 10px;
-moz-border-radius: 5px 5px 10px 10px;
-webkit-border-radius: 5px 5px 10px 10px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
#postform b {
color: #36686a;
}
/* ---- TAGS PAGE ---- */
.tagstable {
margin-top: 50px !important;
width: 100%;
border: 0;
padding: 20px;
}
.tagstable tbody tr td {
border: 0;
}
/* ---------------- CALENDAR ------------------------ */
.month {
background: transparent;
width: 90% !important;
margin: 0 auto;
padding: 20px 60px;
border: 0;
}
.daysubjects {
}
.daytitles {
background: transparent;
border: 0;
margin: 15px;
padding: 2px;
font: normal ;
text-transform: uppercase;
color: #36686a !important;
font: normal 16px Candara, Arial;
text-align: center;
}
.day-blank {
border: 0;
}
.day {
background: transparent;
border: 0;
margin:10px;
padding:3px;
}
.day-date {
width:30%;
border: 0;
padding: 5px 2px;
color: #36686a !important;
font: normal 14px Candara, Arial;
text-align: center;
}
.day-count {
float: right;
text-align: center;
width: 50%;
color: #36686a !important;
font: normal 12px Candara, Arial;
}
.day-count a,
.day-count a:visited {
padding:5px;
text-decoration:none;
}
.day-count a:hover {
}
/* --------- MISCELLANEOUS --------------- */
/* ------ input & textarea ---------------- */
textarea, input, select {
border: 0;
background: #fff;
margin:2px;
padding: 2px 3px;
opacity: .5;
color: #36686a !important;
font: normal 12px Candara, Arial;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
/* -------- lj user & images ------------ */
img[src*="userinfo.gif"] {
width: 0;
height: 0;
padding: 17px 14px 7px 18px;
margin: 0 0 0 3px;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-ljuser2.png) no-repeat transparent;
}
img[src*="community.gif"] {
width: 0;
height: 0;
padding: 10px 14px 12px 20px;
margin: 0 0 0 3px;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-ljcomm2.png) no-repeat transparent;
}
/* -------- lj controlstrip ------------ */
#lj_controlstrip {
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-title-bg.png) bottom repeat-x;
padding-bottom: 8px;
font: normal 11px Tahoma, Arial;
}
#lj_controlstrip tbody {
background: ;
}
#lj_controlstrip_user,
#lj_controlstrip_actionlinks,
#lj_controlstrip_search,
#lj_controlstrip_login,
#lj_controlstrip_loggedout_userpic {
border-right:0 none;
}
#lj_controlstrip_statustext,
#lj_controlstrip_user {
color: #36686a;
font: normal 11px Tahoma, Arial;
}
#lj_controlstrip a,
#lj_controlstrip a:link,
#lj_controlstrip a:visited,
#lj_controlstrip .ljuser a b {
color: #4c9b9e !important;
font: normal 11px Tahoma, Arial;
}
#lj_controlstrip a:hover,
#lj_controlstrip .ljuser a:hover b {
color: #ac8f6b !important;
text-decoration: none;
}
#lj_controlstrip_login td,
#lj_controlstrip td td {
border-bottom: 0;
}
#lj_controlstrip input {
background: #acacac !important;
border: 1px solid #!important;
padding: 3px;
color:#;
}
#lj_controlstrip_search_input_text,
#lj_controlstrip select,
#lj_controlstrip input#xc_user,
#lj_controlstrip input#xc_password,
#lj_controlstrip input#xc_remember,
#lj_controlstrip #Logout {
font: normal 11px Tahoma, Arial;
color: # !important;
background: # !important;
border: !important;
padding: 1px 5px !important;
}
#lj_controlstrip_search_submit {
margin: 0 30px !important;
padding: 1px 5px !important;
}
/* ------------------ Contextual Popup ------------------ */
div.ContextualPopup img {
border: 0;
}
div.ContextualPopup div.Inner {
opacity: .8;
background: url(http://ruthenia-alba.webs.com/025seaside-layout/upload/025seaside-entry-bg2.jpg) repeat transparent;
border: 0;
color:#36686a !important;
font: normal 11px Tahoma;
margin:0;
padding:5px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 1px 1px 5px #8cb5b7;
-moz-box-shadow: 1px 1px 5px #8cb5b7;
-webkit-box-shadow: 1px 1px 5px #8cb5b7;
}
div.ContextualPopup .Relation {
border-bottom: 0;
color:#!important;
font: ;
margin:2px 0;
padding:2px 0;
}
div.ContextualPopup .Content .OnlineStatus {
font-weight:bold;
}
div.ContextualPopup .Userpic {
padding:8px 8px 0 0;
}
div.ContextualPopup div.Inner a,
div.ContextualPopup div.Inner a:link,
div.ContextualPopup div.Inner a:visited {
color:#36686a !important;
font: normal 11px Tahoma;
text-decoration: none !important;
}
div.ContextualPopup div.Inner a:hover {
color: #4c9b9e !important;
text-decoration: none !important;
}
/* ---- delete this block to add controlstrip ---- */
#lj_controlstrip {
display: none;
}
.pageblock {
margin-top: -45px;
}
/* ---- end of controlstrip block ---- */
* В этом дизайне я использовала элементы нового стандарта CSS3, который работает начиная с последних версий браузеров (кроме IE). Если дизайн после установки не выглядит так, как на скриншоте, советую обновить браузер. Если у вас IE - рекомендую его сменить на любой из списка:)
* In this layout I used some elements of the new CSS3 standard which works in latest versions of popular browsers (except IE). If the layout after installation doesn't look like the screenshot, I recommend to update your browser. If you have IE - then to replace it to another one from the list:)
** Включить контрольную панель можно, удалив блок в конце кода, начинающийся строчкой:
/* ---- delete this block to add controlstrip ---- */
** You can enable controlstrip by removing the next block (in the very end of the code), starting with:
/* ---- delete this block to add controlstrip ---- */