dalton academy
s2 flexible squares
→
IMAGE →
LIVE instructions
→ Go to
CUSTOMIZE and choose any S2 Flexible Squares layout, apply it, then scroll down and make sure ads are set to HORIZONTAL and sidebar placement is on the RIGHT.
→ Go to
CUSTOMIZE JOURNAL STYLE and then to
CUSTOM CSS.
→ Set dropdown menus to NO/NO/YES, paste the code in, and save!
code
/*--Dalton Academy by Tessisamess--*/
/*--Made On: May 2012--*/
/*--S2 Style: Flexible Squares--*/
/*--Tessisamess Layout Comm: layouttesst@LJ--*/
body {
background: #0B1F37 url(
http://i.imgur.com/xgtiI.jpg) center center fixed repeat-x;
text-align: center;
color: #222222;
font-family: Tahoma;
font-size: 11px;
margin: 20px 0 20px 0;
}
a, a:link, a:visited {
color: #143764;
text-decoration: none;
}
a:hover {
color: #D1D1D1;
text-decoration: none;
text-shadow: 1px 1px 1px #ddd;
filter: dropshadow(color=#ddd, offx=1, offy=1);
}
p, td, blockquote {
font-size: 11px;
}
code, kbd, pre, tt {
font-family: monospace;
}
/*-- General page alignment and width --*/
#content {
width: 85%;
margin-left: auto; margin-right: auto;
background-color: #f8f8f8;
border-style: none;
padding: 15px;
-webkit-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.6);
box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.6);
}
#maincontent {
margin-top: 15px;
font-family: Tahoma;
font-size: 11px;
color: #222222;
border-style: none;
margin-right: 220px;
text-align: left;
background: transparent;
}
#sidebar {
padding-top: 15px;
margin-top: 15px;
background: transparent;
border-style: none;
font-size: 11px;
font-family: Tahoma;
color: #222222;
width: 190px;
float: right;
text-align: left;
line-height: 180%;
}
/*-- Header --*/
#header {
width: 100%;
padding: 10px 0px 20px 0px;
margin: 0px;
text-align: center;
font-size: 30px;
font-family: 'Bilbo';
text-shadow: 1px 1px 1px #777;
filter: dropshadow(color=#777, offx=1, offy=1);
color: #FF7400;
letter-spacing: 2px;
border-style: none;
background: transparent;
color: #D1D1D1;
}
.headerimage {
height: 280px;
background-image: url(
http://i.imgur.com/ZG9qR.png) !important;
background-repeat: no-repeat !important;
background-attachment: scroll !important;
background-position: center !important;
margin-bottom: 25px;
}
/*look and color of links (also partly for footer)*/
div#header a, div#header a:link, div#header a:visited, div#footer a, div#footer a:link, div#footer a:visited {
color: #184378;
}
div#header a:hover, div#footer a:hover {
color: #D1D1D1;
text-decoration: none;
}
.title {
display: none;
}
.subtitle{
display: none;
}
/*-- Header - top navigation --*/
ul.navheader
{
padding: 0px;
margin: 0px;
}
ul.navheader li {
display: inline;
padding: 0 3px 0 3px;
}
/*-- Entry stuff --*/
.subcontent {
}
.entry {
margin: 0px 10px 10px 30px;
padding: 10px;
color: #222222;
font-family: Tahoma;
font-size: 11px;
text-align: left;
border-style: none;
background: transparent;
line-height: 180%;
}
.userpic {
position: relative;
background-color: #fff !important;
float: left;
padding: 5px;
margin: 10px;
text-align: center;
border-style: none;
text-transform: uppercase;
font-family: 'Yanone Kaffeesatz';
font-size: 11px;
z-index: 15;
-webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
}
.userpic img {
height: 70px;
width: 70px;
}
.date {
top: 5px;
color: #DEDEDE;
font-family: 'Bilbo';
font-weight: bold;
font-size: 27px;
}
.subject {
margin-top: -20px;
padding: 10px;
font-family: 'Bilbo';
font-size: 26px;
font-weight: bold;
color: #184378;
}
.subject a, .subject a:link, .subject a:visited {
color: #143764;
}
.subject a:hover {
color: #a6a6a6;
}
.datesubject {
background-color: transparent;
padding: 5px;
}
.entry ul li
{
padding-left: 5px;
margin-left: 15px;
}
.entry ol li
{
padding-left: 5px;
margin-left: 15px;
}
/*-- Entry Stuff - Current Mood, Music and Location --*/
.currents, .currentmood, .currentmusic {
font-family: Monospace;
font-size: 10px;
width: 100%;
background: #E7E7E7;
}
.currents strong{
font-weight:normal;
}
.ljtags {
width: 100%;
background: #E7E7E7;
font-family: Monospace;
font-size: 10px;
margin-top: 15px;
margin-bottom: -30px;
}
.ljtags:hover, .currents:hover, .currentmood:hover, .currentmusic:hover {
font-size: 12px;
}
/*-- Entry Stuff - Comments --*/
.comments {
font-family: 'Bilbo';
font-size: 25px;
text-align: right;
background-color: transparent;
padding: 8px;
position: relative;
top: 15px;
text-shadow: 1px 1px 1px #999;
filter: dropshadow(color=#999, offx=1, offy=1);
}
div.comments a, div.comments a:link, div.comments a:visited{
color: #184378;
}
div.comments a:hover {
color: #D1D1D1;
text-decoration: none;
}
/*-- Entry Stuff - Separator --*/
.separator {
height: 35px;
}
/*-- Special friends page customization --*/
.userpicfriends {
position: relative;
background-color: #fff !important;
float: left;
padding: 5px;
margin: 10px;
text-align: center;
border-style: none;
text-transform: uppercase;
font-family: 'Yanone Kaffeesatz';
font-size: 11px;
z-index: 15;
-webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
color: #184378;
}
.userpicfriends a font {
color: #184378;
}
.userpicfriends img {
height: 70px;
width: 70px;
}
/*-- Sidebar --*/
.defaultuserpic {
text-align: center;
}
.sbarheader {
padding: 0px 5px 0px 5px;
}
.sbarbody {
padding: 0px 5px 0px 5px;
}
.sbarbody2 {
padding: 0px 5px 0px 5px;
}
div#sidebar a, div#sidebar a:link, div#sidebar a:visited{
color: #222;
}
div#sidebar a:hover {
color: #D31818;
text-decoration: none;
}
/*-- Sidebar - Calendar --*/
table.calendar {
margin-right: auto;
margin-left: auto;
background: url(
http://i.imgur.com/YqkBp.png) center center no-repeat;
padding: 22px;
}
.sbarcalendar {
border:none;
text-align: center;
font-family: 'Bilbo';
font-size: 15px;
padding: 3px;
}
.sbarcalendarposts {
border-style: none;
background: transparent url(
http://i.imgur.com/tw2aC.png) center center no-repeat;
text-align: center;
font-family: 'Bilbo';
font-size: 15px;
padding: 3px;
}
/*-- Sidebar - Linkslist --*/
ul.sbarlist {
padding-left: 0px;
margin-left: 0px;
list-style: none;
}
li.sbaritem {
display: block;
background: #f7f7f7;
padding-left: 0px;
list-style: none;
border-bottom: 1px solid #a6a6a6;
}
li.sbaritem:hover {
background: #ececec;
border-bottom: #BBBBBB;
}
li.sbartitle {
text-align: left;
text-shadow: 1px 1px 1px #777;
filter: dropshadow(color=#777, offx=1, offy=1);
list-style: none;
border-style: none;
background-color: transparent;
font-family: 'Bilbo';
color: #184378;
font-size: 23px;
letter-spacing: 2px;
margin-bottom: 10px;
margin-top: 20px;
}
/*-- footer --*/
#footer {
width: 100%;
text-align: center;
font-family: 'Bilbo';
font-size: 25px;
letter-spacing: 2px;
color: #184378;
z-index: 100;
clear: both;
background: transparent;
border: none;
padding: 10px;
text-shadow: 1px 1px 1px #777;
filter: dropshadow(color=#777, offx=1, offy=1);
}
ul.navfooter{
padding: 0px;
margin: 0px;
}
ul.navfooter li {
display: inline;
margin: 0 5px 0 5px;
}
.clearfoot {
clear: both;
}
/*-- Archive Pages --*/
ul.year {
text-align: center;
padding-bottom: 30px;
padding-top: 10px;
font-family: 'Bilbo';
font-size: 26px;
}
ul.year li {
display: inline;
}
table.yeartable {
padding: 10px;
background: #E7E7E7 url(
http://i.imgur.com/MiEla.png) bottom right no-repeat;
margin-left: auto;
margin-right: auto;
width: 80%;
}
table.yeartable td.yeardate, table.yeartable td.yearday {
border: 1px solid #999;
font-family: 'Bilbo';
font-size: 20px;
}
table.yeartable td.yearday {
background-color: #184378;
color: #f8f8f8;
text-align: center;
}
td.yearmonth {
border-style: none;
font-family: 'Bilbo';
font-size: 25px;
text-shadow: 1px 1px 1px #777;
filter: dropshadow(color=#777, offx=1, offy=1);
}
/*-- Comment Pages --*/
.datesubjectcomment {
background-color: #E7E7E7;
padding: 5px;
margin-top: 20px;
font-size:13px;
}
.userpiccomment {
position: relative;
background-color: #fff !important;
float: left;
top: -20px;
left: 0px;
padding: 5px;
margin: 10px;
text-align: center;
border-style: none;
text-transform: uppercase;
font-family: 'Yanone Kaffeesatz';
font-size: 11px;
z-index: 15;
-webkit-box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.2);
height: 70px !important;
width: 70px !important;
}
.box {
border: none;
padding: 5px;
clear: left;
}
textarea.textbox {
width: 90% !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: transparent;
color: #000000;
}
.replytosubject {
font-weight: bold;
}
.commentreply {
position: relative;
margin: 10px;
font-size: 11px;
font-family: "Verdana", sans-serif;
color: #000000;
}
.commentbox {
border: none;
padding: 10px;
margin: 10px;
background-color: transparent;
}
.datesubjectcomment a:link, .datesubjectcomment a:visited {
color: #184378;
}
.datesubjectcomment a:hover {
color: #b0b9c8;
}
.commentboxpartial {
border: none;
padding: 10px;
margin: 10px;
background-color: transparent;
}
.commentinfo {
background-color: transparent;
margin-top: 10px;
width: 100%;
}
.skiplinks {
text-align: center;
}
/*-- Misc --*/
.clear {
height: 15px;
}
h1 {
font-size: 25px;
font-family: 'Bilbo';
font-weight: normal;
color: #184378;
margin-bottom: -15px;
margin-top: -5px;
}
h2 {
font-size: 22px;
font-family: 'Bilbo';
font-weight: normal;
color: #143764;
margin-bottom: -15px;
margin-top: -5px;
}
h3 {
font-size: 20px;
font-family: 'Bilbo';
font-weight: normal;
color: #184378;
margin-bottom: -15px;
margin-top: -5px;
}
h4 {
font-size: 18px;
font-family: 'Bilbo';
font-weight: normal;
color: #143764;
margin-bottom: -15px;
margin-top: -5px;
}
blockquote {
background: #DADDE1 url(
http://i.imgur.com/rEZs8.png) top left no-repeat;
min-height: 100px;
padding: 10px;
padding-left: 87px;
-webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.5);
box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.5);
text-align: justify;
line-height: 150%;
font-face: verdana;
border-top: 2px solid #D31818;
border-left: 2px solid #D31818;
}
textarea {
background: #ffffff url(
http://i.imgur.com/CHvPu.png) center repeat;
padding: 10px;
}
input {
background: #ffffff url(
http://i.imgur.com/CHvPu.png) center repeat;
}
code {
color: #184378;
padding: 10px;
}
.ljtaglist {
padding: 20px;
line-height: 200%;
list-style-type:none;
}
/* Cleaned CSS for new ControlStrip */
.w-cs {
background: #0B1F38;
color: #fff;
}
.w-cs A:link, .w-cs A:visited, .w-cs A:active {
color: #f5f5f5 !important;
}
.w-cs A:hover {
color: #fff !important;
}
/* User info */
.w-cs .w-cs-userinfo {
background: #0B1F38;
border-style: none;
}
/* Summary */
.w-cs .w-cs-summary {
background: #192636;
}
.w-cs .w-cs-summary LI.w-cs-i-tokens {
border-color: #C9F5F0;
}
/* Generated by Malionette's Tiny Icon Generator - Tinyicons by Tessisamess */
img[src*="img/userinfo.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i.imgur.com/UUFHW.png) no-repeat !important; padding: 16px 0 0 14px !important; }
img[src*="img/community.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i.imgur.com/ZWOrY.png) no-repeat !important; padding: 16px 0 0 18px !important; }
img[src*="img/icon_protected.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i.imgur.com/Ardkn.png) no-repeat !important; padding: 16px 0 0 16px !important; }
img[src*="img/icon_private.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i.imgur.com/SMgDB.png) no-repeat !important; padding: 16px 0 0 16px !important; }
img[src*="img/icon_groups.gif"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i.imgur.com/Ardkn.png) no-repeat !important; padding: 16px 0 0 16px !important; }
img[src*="img/icon_sticky.png"] {width: 0 !important; height: 0 !important;
background: transparent url(
http://i.imgur.com/sAJfZ.png) no-repeat !important; padding: 16px 0 0 17px !important; }
@font-face {
font-family: 'Bilbo';
font-style: normal;
font-weight: 400;
src: local('Bilbo Regular'), local('Bilbo-Regular'), url('
http://themes.googleusercontent.com/static/fonts/bilbo/v3/xwLgRJ9fZWeUWclu8zW0Jw.woff') format('woff');
}
I offer a download of this layout in addition to the copy/paste code.
The download includes:
Layout and profile codes, all image files, all tinyicons, and a replacement guide for customizing the colors, fonts, and images in this layout. [
DOWNLOAD]
notes
Next up: WMHS and Lima Bean.
Hidden: Title and subtitle.
Custom: Tinyicons, controlstrip, comment page, archive page.
credit
Credit when using this layout is a must, no matter how much you change in the code. Comments are nice, but not necessary.
You can credit in your profile with a text link, lj usertag, or a
button (in your journal's linklist or blurb is fine too).
dalton acceptance
profile code
→
ENLARGE code
http://i.imgur.com/enlxD.png"> |
d a l t o n · a c a d e m y |
Donec congue orci in quam luctus at scelerisque dui scelerisque. Proin lectus sapien, faucibus vel consectetur et, posuere sit amet lacus. Vivamus ut dolor eros, nec luctus neque. Fusce lacinia facilisis nisl, consequat eleifend eros commodo faucibus. Morbi mollis aliquam nisl, ac ultricies lorem rhoncus sed. Nullam pharetra nunc id turpis dignissim vulputate. Pellentesque pellentesque interdum mauris sed aliquet.
Sed mi risus, imperdiet sed accumsan nec, mattis sit amet ipsum. Etiam ut velit non augue vulputate fermentum. Duis condimentum ornare auctor. Proin ac arcu eu quam euismod ullamcorper vitae nec eros. Mauris placerat interdum nunc, a gravida lectus luctus vitae. Integer eu elit vitae metus lobortis eleifend eu iaculis nisi. Integer cursus mattis justo, eu scelerisque orci adipiscing sit amet.
Fusce eu mi quam, nec blandit velit. Mauris scelerisque malesuada lorem, nec pulvinar mi bibendum id. Fusce at leo dolor. Donec congue commodo justo ac ullamcorper. Nulla sollicitudin accumsan ante, a porta nulla ullamcorper vel. Sed mi ligula, fringilla vel posuere sed, rutrum vel urna.
|
t i t l e · h e r e |
Donec congue orci in quam luctus at scelerisque dui scelerisque. Proin lectus sapien, faucibus vel consectetur et, posuere sit amet lacus. Vivamus ut dolor eros, nec luctus neque. Fusce lacinia facilisis nisl, consequat eleifend eros commodo faucibus. Morbi mollis aliquam nisl, ac ultricies lorem rhoncus sed. Nullam pharetra nunc id turpis dignissim vulputate. Pellentesque pellentesque interdum mauris sed aliquet.
|
l i n k · l i n k · http://layouttesst.livejournal.com/profile" target="_blank">♬ · l i n k · l i n k |
|
|
rules
→Leave my credit.
→You can change the credit symbol or placement; just make sure it's still visible.
→You may change colors, fonts, widths, etc.
→That's it!