Avalanche (S2 - Tranquility II)
Plain white and grey.
This is just a plane boring layout for bloggers not wanting anything 'special', and just a plain layout without any distractions.
Its my first time publicly releasing a tranquility II layout, remember, all my layouts are Beta and subject to change at anytime.
Dont comment about the spaces below the entries, this is apparently a known bug in tranquility II.
Comment if taking and credit in your userinfo!
Link back to apricot_13
For information on installing this layout read the FAQ
Save this as style.css and upload to your own server or copy into custom css
edit I've fixed the weird page summary links.
/* CSS by Han - http://community.livejournal.com/apricot_13 */
@media screen, print {
ul#lj-links, ul#lj-summary, ul#user-links {
margin: 0;
padding: 0;
}
body {
background-color: #eeeeee;
font-family: Georgia, serif;
font-size: 12px;
line-height: 125%;
color: #333333;
text-align: center;
}
a {
font-family: Georgia, serif;
font-size: 100%;
color: #8ad1c9;
text-decoration: none;
}
a:visited { color: #8ad1c9; }
a:hover, a:visited:hover { color: #8ed9bd; text-decoration: underline; }
a:active { color: #8ad1c9; }
a img { border: none; }
a.comm {
background: transparent url(http://stat.livejournal.com/img/community.gif) no-repeat;
padding-left: 19px;
padding-bottom: 7px;
}
a.user {
background: transparent url(http://stat.livejournal.com/img/userinfo.gif) no-repeat;
padding-left: 19px;
padding-bottom: 7px;
}
p {
margin: 5px;
padding: 5px;
}
form {
display: inline;
margin: 0px;
padding: 0px;
}
input, select, textarea {
font-family: Verdana, Helvetica, sans-serif;
font-size: 80%;
color: #666666;
padding: 2px;
margin: 3px;
}
#container {
position: relative;
width: 90%;
margin: 0 auto;
text-align: left;
background-color: #ffffff;
padding: 15px;
}
#header {
margin-bottom: 15px;
background-repeat: no-repeat;
border-bottom: 1px dashed #cccccc;
}
#header h1 {
font-family: "century gothic", serif;
text-transform: uppercase;
font-weight: lighter;
font-size: 30px;
color: #cccccc;
height: auto;
}
#menu {
position: relative;
background-color: #ffffff;
float: left;
width: 150px;
font-family: Georgia, serif;
font-size: 100%;
color: #ffffff;
border: 0px solid #333333;
padding: 4px;
border-right: 1px dashed #cccccc;
}
#content {
position: relative;
margin-left: 160px;
width: auto;
}
#entries {
border: 0px solid #000000;
padding: 15px;
background-color: #ffffff;
}
#menu h2 {
font-family: "century gothic", Georgia, serif;
font-size: 15px;
color: #666666;
text-transform: uppercase;
font-weight: lighter;
border-bottom: 1px solid #cccccc;
}
#menu h2.userpic {
text-align: center;
background-color: #ffffff;
padding: 15px;
width: 100px;
margin-left: 10px;
border-bottom: 0px;
border: 1px solid #f1f1f1;
}
#menu h2.userpic:hover{
background-color: #f1f1f1;
}
#menu a {
font-family: "Century Gothic", Verdana, Helvetica, sans-serif;
color: #666666;
}
* html body #menu a {
width:100%;
}
#menu a:visited { color: #cccccc; }
#menu a:hover, #menu a:visited:hover {
color: #cccccc;
text-decoration: none;
}
#menu a:active { color: #cccccc; }
#menu ul {
margin: 3px;
list-style: none;
display: block;
}
#menu ul li, #menu ul li:active {
color: #ccc;
font-family: "Century Gothic", Verdana, Helvetica, sans-serif;
margin: 3px;
padding: 2px;
list-style: none;
display: block;
background-color: #ffffff;
padding: 10px;
text-align: center;
text-transform: uppercase;
border: 1px solid #f1f1f1;
}
* html body #menu ul {
width:100%;
}
* html body #menu ul li{
width:100%;
}
#menu ul.lj-links {
}
* html body #menu ul.lj-links {
width:100%;
}
#menu #lj-summary li {
font-size: 8px;
}
#menu #lj-summary li a {
color: #555;
text-transform: lowercase;
}
#menu ul li a:active {
font-family: "Century Gothic", Verdana, Helvetica, sans-serif;
font-size: 15px;
color: #666666;
display: block;
background-color: #f1f1f1;
padding: 10px;
text-align: center;
text-transform: uppercase;
border: 1px solid #f1f1f1;
}
* html body #menu ul li a:active{
width:100%;
}
#content h2 {
margin: -8px 0;
}
#entries, #comments {
margin: 10px;
}
.ind-entry {
padding: 5px;
padding-bottom: 15px;
border-bottom: 1px solid #cccccc;
background-color: #ffffff;
}
.ind-entry h3 img, .ind-comment-one h3 img, .ind-comment-two h3 img, .ind-comment-screened h3
img {
position: relative;
float: right;
padding: 5px;
}
.ind-entry h2 {
font-family: "century gothic", Georgia, serif;
font-size: 30px;
color: #666666;
margin: 20px 0px;
line-height: 140%;
text-transform: uppercase;
font-weight: lighter;
}
.ind-entry h4, .ind-comment-one h4, .ind-comment-two h4, .ind-comment-screened h4 {
font-family: Verdana, Helvetica, sans-serif;
font-size: 80%;
color: #aaaaaa;
font-weight: bold;
text-transform: uppercase;
margin-top: -11px;
}
.ind-entry h4 {
background-color: #ffffff;
}
.ind-entry h4 a, .ind-comment-one h4 a, .ind-comment-two h4 a, .ind-comment-screened h4 a,
.ind-entry h4 a:visited, .ind-comment-one h4 a:visited, .ind-comment-two h4 a:visited,
.ind-comment-screened h4 a:visited {
font-family: Verdana, Helvetica, sans-serif;
font-size: 10px;
color: #666666;
text-decoration: none;
font-weight: lighter;
}
.ind-entry h4 a:hover, .ind-comment-one h4 a:hover, .ind-comment-two h4 a:hover,
.ind-comment-screened h4 a:hover { color: #cccccc; }
.ind-entry h4 a:visited:hover, .ind-comment-one h4 a:visited:hover, .ind-comment-two h4
a:visited:hover, .ind-comment-screened h4 a:visited:hover { color: #cccccc; font-weight: lighter;}
.ind-entry h4 a:active, .ind-comment-one h4 a:active, .ind-comment-two h4 a:active,
.ind-comment-screened h4 a:active { color: #cccccc; }
.ind-entry div.entry-item, .ind-entry div.month-entries {
font-family: verdana, Georgia, serif;
font-size: 10px;
color: #666666;
margin: 15px 0px;
}
.ind-entry div.entry-item a, .ind-entry div.month-entries a {
font-family: verdana, Georgia, serif;
font-size: 10px;
color: #949494;
text-decoration: underline;
}
.ind-entry div.entry-item a:visited, .ind-entry div.month-entries a:visited { color: #5ab300;
}
.ind-entry div.entry-item a:hover, .ind-entry div.entry-item a:visited:hover { color:
#336600; }
.ind-entry div.month-entries a:hover, .ind-entry div.month-entries a:visited:hover { color:
#336600; }
.ind-entry div.entry-item a:active, .ind-entry div.month-entries a:active { color: #336600; }
.ind-comment-one, .ind-comment-two, .ind-comment-screened {
margin: 10px 0;
padding: 5px;
}
.ind-comment-one { background-color: #ffffff; border-bottom: 1px solid #999999; }
.ind-comment-two { background-color: #ffffff; border-bottom: 1px solid #999999; }
.ind-comment-screened { background-color: #ffffff; border-bottom: 1px solid #999999; }
.ind-comment-one h2 {
font-family: Georgia, serif;
font-size: 130%;
color: #333333;
margin: 20px 0px;
}
.ind-comment-one div.entry-item {
font-family: Georgia, serif;
font-size: 100%;
color: #333333;
margin: 15px 0px;
}
.ind-comment-one div.entry-item a {
font-family: Georgia, serif;
font-size: 100%;
color: #5ab300;
text-decoration: underline;
}
.ind-comment-one div.entry-item a:visited { color: #5ab300; }
.ind-comment-one div.entry-item a:hover, .ind-comment-one div.entry-item a:visited:hover {
color: #336600; }
.ind-comment-one div.entry-item a:active { color: #336600; }
.ind-comment-two h2 {
font-family: Georgia, serif;
font-size: 130%;
color: #333333;
margin: 20px 0px;
line-height: 140%;
}
.ind-comment-two div.entry-item {
font-family: Georgia, serif;
font-size: 100%;
color: #333333;
margin: 10px 0px;
}
.ind-comment-two div.entry-item a {
font-family: Georgia, serif;
font-size: 100%;
color: #5ab300;
text-decoration: underline;
}
.ind-comment-two div.entry-item a:visited { color: #5ab300; }
.ind-comment-two div.entry-item a:hover, .ind-comment-two div.entry-item a:visited:hover {
color: #336600; }
.ind-comment-two div.entry-item a:active { color: #336600; }
.ind-comment-screened h2 {
font-family: Georgia, serif;
font-size: 130%;
color: #333333;
margin: 20px 0px;
}
.ind-comment-screened div.entry-item {
font-family: Georgia, serif;
font-size: 100%;
color: #333333;
margin: 10px 0px;
}
.ind-comment-screened div.entry-item a {
font-family: Georgia, serif;
font-size: 100%;
color: #708cc4;
text-decoration: underline;
}
.ind-comment-screened div.entry-item a:visited { color: #5ab300; }
.ind-comment-screened div.entry-item a:hover, .ind-comment-screened div.entry-item
a:visited:hover { color: #336600; }
.ind-comment-screened div.entry-item a:active { color: #336600; }
.month-entries {
margin: 10px 0;
}
.month-entries ul {
list-style: none;
margin: 10px;
}
.month-entries ul li {
list-style: none;
padding: 3px;
}
.ljtaglist {
margin-left: 5px;
}
#footer {
position: relative;
font-family: "Century Gothic", Georgia, serif;
font-size: 100%;
text-transform: uppercase;
color: #666666;
background-color: #ffffff;
}
#footer p {
padding: 20px;
}
#footer a {
font-family: Georgia, serif;
font-size: 100%;
color: #8ad1c9;
}
#footer a:visited { color: #8ad1c9; }
#footer a:hover, #footer a:visited:hover { color: #8ed9bd; }
#footer a:active { color: #8ad1c9; }
}
@media print {
#menu {
display: none;
}
#content {
margin-left: 0px;
}
#entries, .ind-entry, .ind-comment, #footer, #header {
border: none;
}
}
/* CSS by Han - http://community.livejournal.com/apricot_13 */