Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /*
- Freebie Friday
- 10.03.17 | Light
- by Aly of Caedon
- */
- ::-webkit-scrollbar {
- border-left: 1px dashed #e1cebe;
- width: 10px;
- background-color: #fcf5ec;
- }
- ::-webkit-scrollbar-thumb {
- background-color: #e1cebe;
- }
- @import url(https://fonts.googleapis.com/css?family=Karla|Noto+Sans);
- @font-face {
- font-family: Karla;
- src: url(https://fonts.gstatic.com/s/karla/v5/Zi_e6rBgGqv33BWF8WTq8g.woff2);
- }
- @font-face {
- font-family: Noto Sans;
- src: url(https://fonts.gstatic.com/s/notosans/v6/LeFlHvsZjXu2c3ZRgBq9nFtXRa8TVwTICgirnJhmVJw.woff2);
- }
- * {
- box-sizing: border-box !important;
- }
- #wrap, #wrap * {
- border: 0;
- padding: 0;
- margin: 0;
- background: none;
- border-radius: 0;
- }
- body {
- background: none;
- font-family: Noto Sans;
- font-size: 10px;
- background-color: #fcf5ec;
- color: #c5ac96;
- }
- #sidebar img {
- position: fixed;
- left: 550px;
- top: -47px;
- right: 0;
- bottom: 0;
- height: 250px;
- margin: auto;
- z-index: 5;
- }
- #friendlist {
- display: none;
- }
- #wrap:before, #wrap:after {
- position: fixed;
- left: 0;
- width: 100%;
- height: 39px;
- background-color: #fff;
- content: close-quote;
- }
- #wrap:before {
- top: 0;
- border-bottom: 1px dashed #e1cebe;
- }
- #wrap:after {
- bottom: 0;
- border-top: 1px dashed #e1cebe;
- }
- #wrap {
- position: fixed;
- left: -145px;
- top: 0;
- bottom: 0;
- right: 0;
- margin: auto;
- width: 0;
- height: 100%;
- overflow: visible;
- }
- #bio, #comments {
- position: absolute;
- left: 0;
- right: 0;
- bottom: 25px;
- margin: auto;
- width: 500px;
- background-color: #fff;
- outline: 5px solid #fff;
- border: 1px dashed #e1cebe;
- }
- #sidebar h2 {
- display: none;
- }
- #bio h2 {
- float: left;
- margin-left: -10px;
- width: calc(100% + 20px);
- margin-bottom: 15px !important;
- }
- #bio {
- top: -125px;
- height: 250px;
- text-align: center;
- padding-left: 10px;
- padding-right: 10px;
- z-index: 1;
- }
- #comments {
- top: 310px;
- /* 10 for outline */
- height: 100px;
- overflow: visible;
- }
- ul#comment_list {
- width: 100%;
- height: 108px;
- overflow: auto;
- margin-top: -5px;
- }
- ul#comment_list li a, p {
- color: #ad9288;
- }
- ul#comment_list li p {
- position: relative;
- left: 8px;
- top: 0;
- width: 360px;
- text-align: left;
- }
- #comments li img+a {
- background-color: #e1cebe !important;
- font-weight: bold;
- padding: 5px !important;
- padding-top: 0px !important;
- padding-bottom: 2px !important;
- text-transform: lowercase;
- color: #FFF;
- letter-spacing: 1px;
- font-size: 9px;
- margin-top: 5px !important;
- position: relative;
- top: -9px;
- height: 15px;
- text-align: center;
- border-radius: 1em;
- border-bottom: 1px dashed #fff;
- color: #ffffff !important;
- font-weight: bold;
- text-transform: uppercase;
- letter-spacing: 1px;
- font-size: 10px;
- }
- h2, #comment-button {
- height: 20px;
- line-height: 20px;
- text-align: center;
- font-weight: bold;
- text-transform: uppercase;
- letter-spacing: 1px;
- font-size: 11px;
- color: #ad9288;
- font-family: Karla;
- margin-bottom: 5px !important;
- background-color: #fcf5ec !important;
- border-bottom: 1px dashed #e1cebe !important;
- }
- #content:before, #content:after {
- display: none;
- }
- #sidebar, #content {
- position: absolute;
- left: 0;
- top: 0;
- width: 100%;
- height: 100%;
- }
- #content {
- left: -100px;
- }
- #comments ul li:first-child {
- margin-top: 12px;
- margin-bottom: 18px;
- min-height: 86px;
- }
- #comments ul li:last-child {
- margin-bottom: 10px;
- }
- #comments ul li {
- background-color: #fcf5ec;
- margin: 10px;
- border: 1px dashed #e1cebe;
- position: relative;
- min-height: 88px;
- color: transparent;
- overflow: visible;
- margin-bottom: 15px;
- text-align: center;
- }
- .avatar_thumb {
- position: absolute;
- left: 0;
- top: 0;
- outline: 5px solid #fff !important;
- position: relative;
- margin: 10px !important;
- }
- #comment-form {
- position: fixed;
- left: -525px;
- top: 285px;
- right: 0;
- bottom: 0;
- margin: auto;
- padding: 5px !important;
- width: 125px;
- height: 130px;
- outline: 5px solid #fff;
- border: 1px dashed #e1cebe;
- background-color: #fff;
- }
- textarea {
- position: relative;
- left: 0;
- top: 20px;
- right: 0;
- margin: auto !important;
- width: 100%;
- height: 98px;
- background-color: #fcf5ec !important;
- border: 1px dashed #e1cebe !important;
- color: #ad9288;
- font-family: Noto Sans;
- font-size: 9px;
- padding: 5px !important;
- }
- #comment-button {
- position: absolute;
- left: 0;
- top: 0;
- width: 100%;
- transition: all .5s ease-in-out;
- }
- #comment-button:hover {
- color: #fcf5ec;
- background-color: #ad9288 !important;
- }
- .navigation li a {
- transition: all .5s ease-in-out;
- }
- .navigation li:hover a {
- letter-spacing: 3px;
- }
- .navigation {
- position: fixed;
- left: -526px;
- top: -250px;
- right: 0;
- bottom: 0;
- margin: auto;
- background-color: white;
- outline: 5px solid #fff;
- border: 1px dashed #e1cebe;
- width: 125px;
- height: 150px;
- }
- ul.navigation li a {
- float: left;
- width: 100%;
- list-style-type: none;
- border-top: 1px dashed #e1cebe;
- border-bottom: 1px dashed #e1cebe;
- margin-bottom: 8px !important;
- background-color: #fcf5ec;
- text-decoration: none;
- color: #ad9288;
- font-family: Karla;
- text-transform: uppercase;
- font-weight: bold;
- letter-spacing: 1px;
- line-height: 18px;
- height: 20px;
- font-size: 9px;
- margin-bottom: 10px !important;
- }
- ul.navigation li a:first-child {
- margin-top: -1px;
- }
- ul.navigation li {
- list-style-type: none;
- }
- li#hobbies, li#likes, li#dislikes {
- display: none;
- }
- li#view-posts a, li#view-topics a {
- color: #ceb3c0 !important;
- }
- li#view-posts, li#view-topics {
- float: left;
- width: 100%;
- list-style-type: none;
- background-color: #fcf5ec;
- color: #ad9288;
- font-family: Karla;
- text-transform: uppercase;
- font-weight: bold;
- letter-spacing: 1px;
- line-height: 12px;
- height: 12px;
- font-size: 8px;
- margin-bottom: 4px !important;
- text-align: center;
- }
- ul#actions {
- position: absolute;
- left: -380px;
- top: -132px;
- right: 0;
- bottom: 0;
- margin: auto;
- width: 123px;
- height: 40px;
- z-index: 25;
- }
- #send-message a {
- position: absolute;
- top: 64px;
- right: 0;
- width: 125px;
- height: 72px;
- outline: 5px solid #fff;
- border: 1px dashed #e1cebe;
- padding-top: 10px;
- text-align: center;
- font-weight: bold;
- font-size: 10px;
- text-transform: uppercase;
- letter-spacing: 2px;
- color: #ad9288;
- }
- #send-message a:before {
- content: close-quote;
- position: absolute;
- left: 8px;
- bottom: 0;
- height: 50px;
- width: 100px;
- background-image: url(https://s-media-cache-ak0.pinimg.com/originals/d6/28/97/d628976e7abc9aa1fab157683647e816.png);
- z-index: 1;
- background-size: auto 84px;
- background-position: 10px 5px;
- background-repeat: no-repeat;
- }
- #send-message a {
- color: inherit;
- }
- #comments p~a {
- position: absolute;
- right: 0;
- bottom: 5px !important;
- width: 52px;
- background-color: rgba(225, 206, 190, 1);
- text-align: center;
- color: #ad9288 !important;
- text-transform: uppercase;
- font-weight: bold;
- font-size: 9px;
- letter-spacing: 1px;
- font-family: Calibri;
- padding-left: 2px;
- height: 15px;
- line-height: 13px;
- border-radius: 1em 0 0 1em;
- }
- p>small {
- display: block;
- font-style: italic;
- margin-left: 10px !important;
- margin-top: 10px !important;
- padding-bottom: 15px !important;
- text-align: left;
- }
- #load-more {
- display: none;
- }
- #header {
- position: fixed;
- left: 0;
- top: 0;
- width: 0;
- height: 0;
- background: none;
- overflow: visible;
Add Comment
Please, Sign In to add comment