dreamwidthlayouts | Tabula Rasa: Gorki

Title: Gorki
Credit to:

coliseu
Base style: Tabula Rasa
Type: CSS
Best resolution: 1366x768
Tested in: Google Chrome, Firefox
Features: Topbar
Screenshot: Here

• Instructions:

Customize • Select Plain (Tabula Rasa);

Customize • Select 1 Column (modules at top and bottom; no sidebar);

Modules • In Main Module Section select Profile (position 1) and Links (position 2). All the other modules, including Navigation must be disabled;

Text • In Text for the 'Links' heading, write the desired title for your journal. A single word is recommended.

Custom CSS • Make sure Use layout's stylesheet(s) is selected. Paste this code:

/* ----- FONTS ----- */

/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v11/UyBMtLsHKBKXelqf4x7VRQ.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v11/1YwB1sO8YE1Lyjf12WNiUA.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* latin */
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: local('Quicksand Regular'), local('Quicksand-Regular'), url(https://fonts.gstatic.com/s/quicksand/v5/sKd0EMYPAh5PYCRKSryvW1tXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}

/* ----- BODY ----- */

body {   font-family: Lato; background: #fff url() repeat fixed; }

a, a:link, a:hover, a:visited, a:active { text-decoration: none; color: #777; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

a:hover { color: #77CCA4; text-decoration: none; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

blockquote { padding: 10px; font-style: italic; color: #555; border-bottom: 10px solid #aaa; }

/* ---- CONTENT ---- */

#content { margin: 0 auto;  width: 50%; margin-top: 20px; }

/* ---- PRIMARY ---- */

#primary { margin: 0 auto;  }

#primary > .inner { margin-top: 30px; }

.entry { background: #ffffff; }

.entry-title { font-size: 25px; text-transform: uppercase;  color: #77CCA4; font-family: Quicksand; letter-spacing: 1px; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

.entry-title a { color: #77CCA4; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

.entry-title a:hover { color: #77CCA4; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

.datetime a, .datetime { text-transform: uppercase; font-size: 13px; color: #555; margin-top: -10px !important; }

.datetime a:hover { color: #333 !important; }

.header { padding: 5px; text-align: center;   }

.entry-content { padding: 15px; color: #333; font-size: 16px;  line-height: 1.6em;  }

.entry-content:first-letter { font-size: 50px; background-color: #77CCA4; border: 3px double #fff; color: #fff; padding: 10px; padding-top: 15px; padding-bottom: 15px; margin: 5px; margin-bottom: 1px; float: left; }

ul.entry-interaction-links.text-links { text-align: center; padding-bottom: 10px; text-transform: uppercase;}

ul.entry-management-links.icon-links { text-align: center; }

img { max-width: 500px; text-align: center; }

/* ---- SECONDARY ---- */

#secondary { margin-left: 20%; }

#secondary > .inner { margin: 0 auto;  }

h2.module-header { text-align: center; text-transform: uppercase; padding-bottom: 10px; color: #77CCA4; font-size: 30px; font-family: Quicksand; }

ul.module-list { display: inline; padding-top: 5px; padding: 10px; }

li.module-list-item { display: inline; margin: 5px; text-transform: lowercase; padding: 5px; padding-left: 10px; padding-right: 10px; border-radius: 50px; background-color: #fff; border: 1px solid #e1e1e1; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

li.module-list-item:hover { background-color: #77CCA4; border: 1px solid #77CCA4; color: #fff !important; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

li.module-list-item a { -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

li.module-list-item a:hover { color: #fff !important; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

.module { display: inline-block; }

.module-userprofile.module { vertical-align: middle;  }

.userpic img { border-radius: 100%;  }

/* ---- FOOTER ---- */

li.page-back { display: inline; margin: 5px; text-transform: lowercase; padding: 5px; padding-left: 10px; padding-right: 10px; border-radius: 50px; background-color: #fff; border: 1px solid #e1e1e1; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

li.page-back:hover { background-color: #77CCA4; border: 1px solid #77CCA4; color: #fff !important; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

li.page-back a:hover { color: #fff !important; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

li.page-forward { display: inline; margin: 5px; text-transform: lowercase; padding: 5px; padding-left: 10px; padding-right: 10px; border-radius: 50px; background-color: #fff; border: 1px solid #e1e1e1; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

li.page-forward:hover { background-color: #77CCA4; border: 1px solid #77CCA4; color: #fff !important; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

li.page-forward a:hover { color: #fff !important; -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
-ms-transition: all 0.4s ease-in-out;
-o-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out; }

/* ---- DISPLAY ---- */

h2#pagetitle, h2#subtitle, #footer, div.navigation.topnav, .tag, .manage-link, .ljuser img, .header img, .cuttag img, div.inner > div.userpic, .module-userprofile.module > h2.module-header, #header, .journal-name  { display: none; }

/* ----- CONTROL STRIP ----- */

#lj_controlstrip {
background:#ffffff;
background-position: 0 0;
color: #666 !important;
border:0px;
z-index: 1000;
text-align: center; box-shadow: 3px 3px 3px #aaa;
 }

#lj_controlstrip a { color: #666 !important; }

#lj_controlstrip_userpic { display: none !important; }

#lj_controlstrip td, #lj_controlstrip_statustext {
color: #777 !important;
}

#lj_controlstrip input {
color:#606060 !important;
background-color: #f5f5f5 !important; 
border: 0px solid #cccccc;
}

#lj_controlstrip_user, #lj_controlstrip_actionlinks, #lj_controlstrip_login {
border-right: 0 !important;
color: #666 !important;
}

Notes:
• Accent color: #77CCA4
• Credit is appreciated. Customize as you like.
• Inspired by Svbtle.

Flat | Top-Level Comments Only

OMG, this one's sweet. You're doing very modern, easy to look at, easy to use templates. Just love it (not planning on using any because I kind of roll my own, but if I was looking for something different, I'd definitely start right here).

i'm trying to install this, but for some reason the top head keeps jumping to the bottom like this?

anything you know i might have done wrong? i'm using it in chrome.

oh nevermind, i had the wrong 1 column layout selected!!

it works now, and it's super cute!

Tabula Rasa: Gorki

no subject

no subject

no subject