Nin is a theme for twister-html
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

2700 lines
58 KiB

@charset "UTF-8";
9 years ago
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font: inherit;
font-size: 100%;
vertical-align: baseline;
}
html {
line-height: 1;
}
ol, ul {
list-style: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
vertical-align: middle;
}
q, blockquote {
quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
content: "";
content: none;
}
a img {
border: none;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
display: block;
}
@font-face {
font-family: "Roboto";
src: url("fonts/roboto/Roboto-Regular.ttf");
font-weight: 400;
}
@font-face {
font-family: "Roboto";
src: url("fonts/roboto/Roboto-Medium.ttf");
font-weight: 500;
}
@font-face {
font-family: "Roboto";
src: url("fonts/roboto/Roboto-Bold.ttf");
font-weight: 700;
}
@font-face {
font-family: "Roboto";
src: url("fonts/roboto/Roboto-Black.ttf");
font-weight: 900;
}
@font-face {
font-family: "Roboto";
src: url("fonts/roboto/Roboto-Italic.ttf");
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: "Droid";
src: url("fonts/DroidSerif-Italic.ttf");
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: "Roboto";
src: url("fonts/roboto/Roboto-MediumItalic.ttf");
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: "Roboto";
src: url("fonts/roboto/Roboto-BoldItalic.ttf");
font-weight: 700;
font-style: italic;
}
/******* fontello ****** */
@font-face {
font-family: "fontello";
src: url("fonts/fontello/fontello.eot?7584488");
src: url("fonts/fontello/fontello.eot?7584488#iefix") format("embedded-opentype"), url("fonts/fontello/fontello.woff?7584488") format("woff"), url("fonts/fontello/fontello.ttf?7584488") format("truetype"), url("fonts/fontello/fontello.svg?7584488#fontello") format("svg");
font-weight: normal;
font-style: normal;
}
9 years ago
[class^="icon-"]:before, [class*=" icon-"]:before, .extend-icon:before, .userMenu li.userMenu-config > a:before, .modal-header span:before, .post-context span:before, .post-reply:before, .post-propagate:before, .post-favorite:before, .post .show-more:before, ul.userMenu-search-profiles button:before, .mini-profile-indicators .userMenu-connections a:before, .mini-profile-indicators .userMenu-messages a:before, .mini-profile-indicators .userMenu-user a:before, .twister-user-remove:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before, .icon-down-after:after {
font-family: "fontello";
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 1em;
margin-right: 3px;
text-align: center;
font-variant: normal;
text-transform: none;
line-height: 1em;
margin-left: 2px;
}
.icon-search:before {
content: "";
}
/* '' */
.icon-mail:before, .mini-profile-indicators .userMenu-messages a:before {
content: "";
}
/* '' */
.icon-heart:before {
content: "";
}
/* '' */
.icon-star:before, .post-favorite:before {
content: "";
}
/* '' */
.icon-user:before, .mini-profile-indicators .userMenu-user a:before {
content: "";
}
/* '' */
.icon-camera:before {
content: "";
}
/* '' */
9 years ago
.icon-ok:before, .modal-header span.mark-all-as-read:before {
content: "";
}
/* '' */
9 years ago
.icon-cancel:before, .modal-header span.modal-close:before, .twister-user-remove:before {
content: "";
}
/* '' */
9 years ago
.icon-plus:before {
content: "";
}
/* '' */
9 years ago
.icon-minus:before {
content: "";
}
/* '' */
.icon-down:before {
content: "";
}
.icon-down-after:after {
content: "";
}
/* '' */
.icon-lock:before {
content: "";
}
/* '' */
.icon-quote:before {
content: "";
}
/* '' */
.icon-comment:before, .post-reply:before {
content: "";
}
/* '' */
.icon-chat:before, .post .show-more:before {
content: "";
}
/* '' */
9 years ago
.icon-left:before, .modal-header span.modal-back:before {
content: "";
}
/* '' */
.icon-right:before {
content: "";
}
/* '' */
.icon-up:before {
content: "";
}
/* '' */
.icon-cog:before, .userMenu li.userMenu-config > a:before {
content: "";
}
/* '' */
.icon-doc:before {
content: "";
}
/* '' */
.icon-arrows:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before, .refresh-toptrends:before, .twistday-reminder .refresh:before, .refresh-users:before {
content: "";
}
/* '' */
.icon-twistagain:before, .post-context span:before, .post-propagate:before {
content: "";
}
/* '' */
.icon-bell:before, .mini-profile-indicators .userMenu-connections a:before {
content: "";
}
/* '' */
/* FONTS */
/* usefull vars */
9 years ago
* {
outline: none !important;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
9 years ago
list-style: none;
9 years ago
color: #444;
9 years ago
}
html, body {
height: 100%;
min-height: 100%;
color: #444;
position: absolute;
width: 100%;
}
html {
font-size: 14px;
background-color: #EBEBEB;
9 years ago
background-attachment: fixed;
}
body {
font-size: 1rem;
line-height: 1.4rem;
font-family: "Roboto", sans-serif;
font-weight: 400;
overflow-y: scroll;
9 years ago
}
a {
text-decoration: none;
color: #A1B775;
9 years ago
}
a:hover, a:active {
color: #A1B775;
9 years ago
text-decoration: none;
}
a i {
text-decoration: underline;
font-style: normal;
}
i, em {
font-style: italic;
}
strong, b {
font-weight: 600;
}
9 years ago
img {
background: #FDFCFA;
9 years ago
}
9 years ago
h1 {
font-size: 1.1em;
text-transform: uppercase;
letter-spacing: 0.07em;
font-weight: 700;
line-height: 1.1em;
}
h2 {
font-size: 1.1em;
text-transform: uppercase;
letter-spacing: 0.07em;
font-weight: 400;
line-height: 1.1em;
}
h3 {
font-size: 1.1em;
font-weight: 400;
line-height: 1.1em;
}
br {
display: block;
}
textarea, input {
background: white;
display: block;
border: none;
}
samp {
background: #eee;
font-size: 0.9rem;
line-height: 0.9rem;
display: inline-block;
padding: 5px 8px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
color: #333;
font-weight: 500;
font-family: monospace;
}
9 years ago
/* isFollowing */
.isFollowing:after {
color: #A1B775;
9 years ago
content: "";
font-family: "fontello";
padding-left: 2px;
display: inline;
font-size: 10px;
vertical-align: top;
line-height: 10px;
}
.isFollowing:after:hover {
text-decoration: none !important;
}
h3 .isFollowing:after {
display: none;
}
.box-shadow, .modal-wrapper, .postboard .post, .dashboard > .module, .mini-profile, ul.dropdown-menu {
-moz-box-shadow: 0 8px 13px rgba(17, 17, 17, 0);
-webkit-box-shadow: 0 8px 13px rgba(17, 17, 17, 0);
box-shadow: 0 8px 13px rgba(17, 17, 17, 0);
9 years ago
}
.clear-fix:after, .userMenu > ul:after, .modal-content:after, .modal-header:after, .direct-messages-thread .post:after, .mini-following-info a:after, .forEdition.profile-card:after, .expanded-content:after, .following .following-list li a:after, .network.singleBlock:after, .options .tab-content:after, .dashboard > .module:after, ul.userMenu-search-profiles li:after, .mini-profile .post-area:after, .mini-profile-indicators:after, .profile-data:after, #postboard-top:after, #postboard-top .post-area:after, .who-to-follow ol:after, .twister-user:after {
content: "";
display: table;
clear: both;
}
9 years ago
/************** BUTTONS *********** */
9 years ago
button, a.button {
9 years ago
padding: 0.6rem 1rem;
display: inline-block;
line-height: 0.75rem;
letter-spacing: 0.07rem;
font-size: 0.75rem;
position: relative;
font-weight: 300;
text-transform: uppercase;
-moz-transition-property: background, border-color;
-o-transition-property: background, border-color;
-webkit-transition-property: background, border-color;
transition-property: background, border-color;
-moz-transition-duration: 0.1s;
-o-transition-duration: 0.1s;
-webkit-transition-duration: 0.1s;
transition-duration: 0.1s;
color: #444;
background: #F8F8F8;
border: 1px solid #ebebeb;
font-family: "fontello", "Roboto", sans-serif;
cursor: pointer;
}
9 years ago
button:hover, a.button:hover {
9 years ago
border-color: #d2d2d2;
}
9 years ago
button.disabled, a.button.disabled {
9 years ago
opacity: 0.5;
color: #999;
background-color: #EBEBEB;
9 years ago
}
9 years ago
button.disabled:hover, a.button.disabled:hover {
9 years ago
color: #666;
-moz-box-shadow: 1px 1px 0 rgba(68, 68, 68, 0.3);
-webkit-box-shadow: 1px 1px 0 rgba(68, 68, 68, 0.3);
box-shadow: 1px 1px 0 rgba(68, 68, 68, 0.3);
}
9 years ago
button.color-1, .modal-content button.postboard-news, button.follow, a.button.color-1, .modal-content a.button.postboard-news, a.button.follow {
background: #5E80A2;
border-color: #547392;
9 years ago
color: white;
font-weight: 500;
}
9 years ago
button.color-1:hover, .modal-content button.postboard-news:hover, button.follow:hover, a.button.color-1:hover, .modal-content a.button.postboard-news:hover, a.button.follow:hover {
border-color: #425a72;
9 years ago
}
9 years ago
button.color-2, button.unfollow, a.button.color-2, a.button.unfollow {
background: #64676C;
border-color: #585a5f;
9 years ago
color: white;
font-weight: 500;
}
9 years ago
button.color-2:hover, button.unfollow:hover, a.button.color-2:hover, a.button.unfollow:hover {
border-color: #3f4144;
9 years ago
}
button.small, .modal-wrapper.who-to-follow-modal button, .who-to-follow.module li button, a.button.small {
padding: 0.5rem;
9 years ago
font-weight: 700;
font-size: 0.7rem;
line-height: 0.7rem;
9 years ago
}
button.light, a.button.light {
background: #eee;
border-color: #e1e1e1;
color: #222;
font-weight: 500;
}
button.light:hover, a.button.light:hover {
border-color: #aeaeae;
}
9 years ago
.userMenu {
width: 100%;
position: fixed;
9 years ago
height: 50px;
left: 0;
margin: 0;
background-color: #64676C;
z-index: 2;
}
9 years ago
.userMenu > ul {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
9 years ago
width: 100%;
padding: 0 30% 0 15%;
background: url('../img/logo.png?1437893891') no-repeat 50% 50%;
background-size: 20px;
}
9 years ago
.userMenu > ul li {
float: left;
margin: 0 20px 0 0;
position: relative;
display: block;
}
9 years ago
.userMenu > ul li > a {
line-height: 50px;
padding: 0 0.5em;
display: inline-block;
9 years ago
color: rgba(255, 255, 255, 0.7) !important;
9 years ago
font-size: 1em;
position: relative;
9 years ago
font-weight: 500;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
9 years ago
.userMenu > ul li > a:hover {
9 years ago
color: white !important;
}
9 years ago
.userMenu > ul li > a span {
color: rgba(255, 255, 255, 0.7) !important;
}
.userMenu > ul li.current a, .userMenu > ul li.current a span {
9 years ago
color: white !important;
}
/* Menu specific entries */
.userMenu li.userMenu-home a span.label {
display: block !important;
text-align: center;
}
.userMenu li.userMenu-home .menu-news {
position: absolute;
text-align: center;
display: none;
top: 6px;
right: -6px;
background: #A1B775;
color: #fff;
width: 15px;
height: 15px;
line-height: 15px;
font-size: 10px;
padding: 3px;
font-weight: 900;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
}
.userMenu li.userMenu-home .menu-news.show {
display: block;
}
.userMenu li.userMenu-dhtindicator, .userMenu li.userMenu-connections, .userMenu li.userMenu-messages {
display: none !important;
}
.userMenu li.userMenu-config, .userMenu li.userMenu-search {
float: right;
position: relative;
margin-right: 0;
9 years ago
color: white;
}
.userMenu li.userMenu-config + a, .userMenu li.userMenu-search + a {
9 years ago
color: #222;
}
.userMenu li.userMenu-search {
margin: 3px;
}
.userMenu li.userMenu-search > input {
border: 1px solid #aaa;
line-height: 12px;
font-size: 12px;
padding: 7px;
}
.userMenu li.userMenu-search > input:focus {
9 years ago
border-color: #222;
}
.userMenu li.userMenu-config > a {
9 years ago
font-size: 1.5rem;
}
9 years ago
/*********** POPUP MODAL ************* */
.modal-wrapper {
background: #EBEBEB;
9 years ago
z-index: 3000;
width: 30%;
9 years ago
position: fixed;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
9 years ago
height: 100vh;
9 years ago
right: 0;
bottom: 0;
overflow: hidden;
-moz-box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
-webkit-box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
}
.modal-wrapper .postboard {
border: none;
padding: 0;
}
9 years ago
.modal-wrapper .post-area-new {
padding: 10px;
}
9 years ago
.modal-blackout {
background: transparent;
z-index: -1;
position: fixed;
left: 0;
top: 0;
width: 0;
height: 0;
}
9 years ago
.modal-content {
9 years ago
overflow: hidden;
9 years ago
overflow-y: auto;
background: #EBEBEB;
}
9 years ago
.modal-content .postboard-news {
position: fixed;
9 years ago
display: block;
right: 2px;
top: 52px;
z-index: 2000;
}
9 years ago
.modal-content h2 span {
display: none;
}
9 years ago
.modal-header {
position: relative;
background: #47494c;
9 years ago
height: 50px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
9 years ago
.modal-header h3 {
padding-left: 20px;
line-height: 50px;
font-weight: 500;
font-size: 1rem;
color: white;
}
9 years ago
.modal-header span {
9 years ago
position: absolute;
top: 0;
line-height: 50px;
9 years ago
font-size: 1rem;
9 years ago
cursor: pointer;
color: rgba(255, 255, 255, 0.7);
9 years ago
transition: color 0.1s linear;
}
9 years ago
.modal-header span:hover {
9 years ago
color: white;
}
9 years ago
.modal-header span b {
9 years ago
display: none;
}
9 years ago
.modal-header span.modal-close {
right: 10px;
}
9 years ago
.modal-header span.mark-all-as-read {
display: none;
right: 70px;
}
9 years ago
.modal-header span.modal-back {
9 years ago
right: 35px;
}
9 years ago
/* MODAL */
.modal-content {
width: 100%;
}
.modal-content .postboard {
padding: 0;
clear: none !important;
position: relative;
9 years ago
width: 100%;
margin: auto;
background: #EBEBEB;
}
9 years ago
.modal-content .postboard h2 {
display: block;
}
9 years ago
/*********** POPUP PROMPT ************ */
.prompt-wrapper {
9 years ago
background: #FDFCFA;
9 years ago
z-index: 5;
position: fixed;
top: 50%;
left: 50%;
width: 600px;
margin-left: -300px;
9 years ago
-moz-box-shadow: 0 8px 33px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 8px 33px rgba(0, 0, 0, 0.3);
box-shadow: 0 8px 33px rgba(0, 0, 0, 0.3);
}
9 years ago
.prompt-wrapper .modal-buttons {
padding: 10px;
text-align: right;
}
9 years ago
.prompt-wrapper .modal-content {
background: #FDFCFA;
padding: 10px 10px 30px 10px;
text-align: center;
}
9 years ago
/************ FOLLOWING-CONFIG MODAL ********* */
.prompt-wrapper.following-config-modal {
margin-top: -100px;
}
9 years ago
.prompt-wrapper.following-config-modal .modal-buttons {
display: none;
}
9 years ago
.prompt-wrapper.following-config-modal h2 {
text-transform: none;
9 years ago
display: inline-block !important;
font-size: 1rem;
font-weight: 400;
padding: 1rem;
}
.prompt-wrapper.following-config-modal h2 span {
display: inline-block !important;
}
.prompt-wrapper.following-config-modal h2 span b {
font-weight: 400;
}
9 years ago
/************ RETWIST POSTS MODAL ********* */
.prompt-wrapper.reTwist.prompt-wrapper {
margin-top: -110px;
}
9 years ago
.prompt-wrapper.reTwist .modal-content {
padding: 20px 15px;
}
9 years ago
.prompt-wrapper.reTwist .post-expand, .prompt-wrapper.reTwist .post-interactions {
display: none;
}
.prompt-wrapper.reTwist .post-info-time {
position: static;
float: right;
}
.prompt-wrapper.reTwist .post-text {
margin-top: 10px;
margin-bottom: 10px;
}
9 years ago
/********* REPLY POSTS MODAL************** */
.prompt-wrapper.reply.prompt-wrapper {
margin-top: -110px;
}
9 years ago
.prompt-wrapper.reply .modal-buttons, .prompt-wrapper.reply .post-expand, .prompt-wrapper.reply .post-interactions {
display: none;
}
9 years ago
.prompt-wrapper.reply .post-area {
padding-bottom: 6px;
}
9 years ago
/********* DIRECT MESSAGES MODAL ********** */
9 years ago
/****** DIRECT MESSAGES MODAL********* */
.modal-wrapper.directMessages .post-area-new {
display: none;
z-index: 5;
background: #FDFCFA !important;
9 years ago
position: absolute;
bottom: 0;
width: 100% !important;
padding: 20px !important;
-moz-box-shadow: 0 -8px 13px rgba(17, 17, 17, 0.1);
-webkit-box-shadow: 0 -8px 13px rgba(17, 17, 17, 0.1);
box-shadow: 0 -8px 13px rgba(17, 17, 17, 0.1);
}
.modal-wrapper.directMessages #post-preview {
background: none;
border: none;
padding: 5px;
width: 100% !important;
}
9 years ago
.modal-wrapper.directMessages .modal-header h3 span {
display: inline-block !important;
padding-left: 5px;
color: white;
cursor: default;
}
9 years ago
.modal-wrapper.directMessages .modal-content {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
background: #f0f0f0;
}
9 years ago
.modal-wrapper.directMessages .post-photo {
width: 40px;
}
9 years ago
.modal-wrapper.directMessages .post-text {
margin-left: 50px;
font-size: 0.9rem;
}
9 years ago
.modal-wrapper.directMessages .post-info-name {
float: none;
}
9 years ago
.modal-wrapper.directMessages .post-info-tag {
line-height: 1em;
padding: 0;
display: inline;
font-size: 80%;
margin: 0 0 0 1em;
}
.modal-wrapper.directMessages .post-info-sent {
position: absolute;
left: 50%;
top: 10px;
display: none;
}
9 years ago
.direct-messages-list .post {
padding: 20px;
cursor: pointer;
}
9 years ago
.direct-messages-list .post:after {
content: "";
font-family: "fontello";
position: absolute;
right: 5px;
top: 50%;
font-size: 1.1em;
margin: -6px 0 0 0;
color: rgba(0, 0, 0, 0.4);
display: none;
}
9 years ago
.direct-messages-list .post:hover:after {
display: block;
}
.direct-messages-list .post:hover {
background: white;
}
9 years ago
.direct-messages-list li {
position: relative;
border-bottom: 1px solid #EBEBEB;
background: #FDFCFA;
9 years ago
}
9 years ago
.direct-messages-thread {
padding-bottom: 180px;
max-width: 420px;
margin: auto;
}
9 years ago
.direct-messages-thread li {
position: relative !important;
9 years ago
}
9 years ago
.direct-messages-thread .post {
background: none;
left: 0;
margin: 0px 10px 20px 10px;
cursor: default;
}
.direct-messages-thread .post .post-info-time {
float: none;
display: block;
text-align: center;
font-size: 10px;
padding-top: 10px;
margin-bottom: 10px;
9 years ago
cursor: default;
9 years ago
position: static;
9 years ago
}
.direct-messages-thread .post .post-info-time:hover {
color: #aaa;
}
.direct-messages-thread .post .post-text:after, .direct-messages-thread .post .post-text:nth-child(2n):after {
content: "";
width: 1px;
background: transparent;
position: absolute;
top: 10px;
white-space: normal;
}
.direct-messages-thread .post .post-text:after {
border-top: solid 7px transparent;
border-bottom: solid 7px transparent;
border-right: solid 7px white;
left: -7px;
}
.direct-messages-thread .post .post-text {
background: white;
9 years ago
margin-right: 60px;
margin-left: 60px;
position: relative;
9 years ago
display: inline-block;
max-width: 300px;
font-size: 0.9rem;
9 years ago
padding: 5px 10px;
z-index: 4;
float: left;
word-wrap: break-word;
max-width: 70%;
min-height: 40px;
}
9 years ago
.direct-messages-thread .post .post-photo {
position: absolute;
left: 0;
top: 35px;
}
9 years ago
.direct-messages-thread .post.sent .post-text:after {
border-top: solid 7px transparent;
border-bottom: solid 7px transparent;
border-right: none;
border-left: solid 7px white;
right: -7px;
left: auto;
}
9 years ago
.direct-messages-thread .post.sent .post-text {
float: right;
}
9 years ago
.direct-messages-thread .post.sent .post-photo {
position: absolute;
right: 0;
left: auto;
}
9 years ago
/********* NEW USER MODAL************* */
.modal-wrapper.new-user .modal-content {
padding: 25px;
}
9 years ago
.modal-wrapper.new-user .modal-close {
display: none;
}
9 years ago
.modal-wrapper.new-user .text {
margin: 0 0 15px 0;
}
9 years ago
.modal-wrapper.new-user .emphasis {
text-align: center;
}
9 years ago
.modal-wrapper.new-user .secret-key {
display: block;
margin-top: 8px;
color: black;
font-weight: bold;
font-size: 110%;
}
9 years ago
/******** HASHTAG MODAL********** */
.modal-wrapper.hashtag-modal .postboard {
padding: 0;
}
9 years ago
/****** CONVERSATION MODAL********** */
.modal-wrapper.conversation-modal .postboard {
padding: 0;
}
9 years ago
/****** FOLLOWING MODAL****** */
9 years ago
.modal-wrapper.following-modal h2 {
display: none;
}
9 years ago
.mini-following-info {
border-bottom: 1px solid #EBEBEB;
line-height: 40px;
}
9 years ago
.mini-following-info a {
display: block;
padding: 10px;
width: 100%;
color: #444;
background: #FDFCFA;
9 years ago
}
.mini-following-info a:hover {
background: white;
9 years ago
}
.mini-following-info .mini-profile-photo {
width: 40px;
9 years ago
line-height: 0;
margin: 0 1rem 0 0;
float: left;
9 years ago
}
9 years ago
.mini-following-info .mini-screen-name {
9 years ago
display: none;
}
9 years ago
/******* WHO TO FOLLOW MODAL****** */
.modal-wrapper.who-to-follow-modal .open-profile-modal:hover {
text-decoration: none;
}
.modal-wrapper.who-to-follow-modal a.twister-user-name {
color: #444;
}
.modal-wrapper.who-to-follow-modal a.twister-user-name span {
padding-bottom: 0.5rem;
font-size: 1rem;
line-height: 1rem;
color: #444;
font-weight: 500;
opacity: 1;
letter-spacing: 0;
}
9 years ago
.modal-wrapper.who-to-follow-modal .twister-user-info {
text-align: left;
font-size: 0.8rem;
line-height: 1rem;
width: 80%;
padding-left: 60px;
9 years ago
}
9 years ago
.modal-wrapper.who-to-follow-modal button {
position: absolute;
right: 10px;
top: 10px;
}
9 years ago
.modal-wrapper.who-to-follow-modal .bio {
color: rgba(0, 0, 0, 0.6);
font-style: italic;
padding-bottom: 0.5rem;
}
9 years ago
/*************************************
******************* PROFILE MODAL
************************************** */
.profile-modal .modal-content {
overflow: hidden;
padding: 0;
9 years ago
position: relative;
}
9 years ago
.profile-modal .modal-content #profile-posts {
padding: 0;
}
9 years ago
.profile-modal .modal-content .postboard {
width: 100%;
height: 100%;
position: absolute;
}
9 years ago
.profile-modal .modal-content .postboard-posts {
display: block;
9 years ago
height: 100%;
overflow: auto;
9 years ago
}
.profile-modal .modal-content .postboard-posts .post {
padding: 0;
margin-bottom: 1px;
}
.profile-modal .modal-content .post-interactions {
margin: 2px 10px 3px 60px;
}
.profile-modal .modal-content .profile-card {
margin: 0;
padding: 0;
9 years ago
border-bottom: 1px solid #EBEBEB;
}
.profile-modal .modal-content .profile-data {
background: none;
}
9 years ago
.profile-modal h2.profile-screen-name {
display: block;
letter-spacing: 0;
text-transform: none;
color: #919191;
padding: 5px 0;
margin: 0;
font-size: 13px;
9 years ago
line-height: 13px;
}
9 years ago
/* Profile card */
.profile-card {
width: 100%;
background: #FDFCFA;
9 years ago
padding: 15px;
}
9 years ago
.profile-card-main {
position: relative;
text-align: center;
word-wrap: break-word;
transition: all 0.2s linear;
background: none !important;
padding: 10px;
}
9 years ago
.profile-card-main:before {
content: "";
border: solid 0px #fff;
transition: all 0.2s linear;
position: absolute;
9 years ago
left: 1px;
top: 1px;
right: 1px;
bottom: 1px;
z-index: 0;
}
9 years ago
.profile-card-main * {
position: relative;
z-index: 1;
}
9 years ago
.profile-card-photo {
height: auto;
width: 64px;
9 years ago
margin: 0 auto;
display: block;
float: left;
}
9 years ago
.profile-card-photo.forEdition {
float: none;
}
9 years ago
.profile-bio {
padding: 10px;
font-style: italic;
text-align: center;
font-size: 0.8em;
}
9 years ago
.profile-card-buttons {
text-align: center;
padding: 0 0 1rem 0;
}
9 years ago
.isFollowing:after {
font-size: 15px;
position: absolute;
}
9 years ago
.known-followers {
text-align: center;
clear: both;
width: 100%;
}
9 years ago
#msngrswr {
display: none;
9 years ago
text-align: center;
margin: 10px 0;
}
9 years ago
.profile-extra-contact {
display: none;
margin: 0 15px 0 0;
font-weight: 500;
padding: 2px 8px 3px 8px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}
9 years ago
.bitmessage-ctc, .tox-ctc {
font-size: 13px;
line-height: 15px;
cursor: pointer;
9 years ago
color: #222;
}
9 years ago
.bitmessage-ctc:hover, .tox-ctc:hover {
color: #A1B775;
}
9 years ago
.bitmessage-ctc:after, .tox-ctc:after {
font-family: "fontello";
content: "";
font-style: normal;
font-weight: normal;
speak: none;
display: inline-block;
text-decoration: inherit;
width: 1em;
text-align: center;
font-variant: normal;
text-transform: none;
line-height: 1em;
}
9 years ago
.profile-modal .profile-tox, .profile-modal .profile-bitmessage {
display: inline-block;
margin-right: 5px;
font-size: 13px;
}
.profile-modal .profile-tox:hover, .profile-modal .profile-bitmessage:hover {
color: #A1B775;
9 years ago
}
.profile-modal .modal-buttons {
display: none;
9 years ago
/* EDITION PROFILE */
}
9 years ago
.forEdition.profile-card {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: auto;
}
.forEdition.profile-card .profile-card-main {
margin: 0;
width: 330px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
padding: 10px;
}
.forEdition.profile-card .profile-card-main input {
display: block;
9 years ago
margin: 5px auto;
background: white;
border: 1px solid #c4c4c4;
padding: 6px 4px;
margin-bottom: 4px;
text-align: center;
transition: all 0.2s linear;
}
.forEdition.profile-card .profile-card-main input:hover, .forEdition.profile-card .profile-card-main input:focus {
background: white;
border-color: #aaa;
}
9 years ago
.input-description {
width: 90%;
}
9 years ago
.input-name {
font-size: 20px;
}
9 years ago
.forEdition .profile-card-main .input-website, .forEdition .profile-card-main .input-city {
display: inline-block;
}
9 years ago
.forEdition .profile-card-main .input-tox, .forEdition .profile-card-main .input-bitmessage {
width: 90%;
margin-top: 10px;
}
.forEdition .profile-card-main h2 {
text-transform: none;
font-weight: 700;
9 years ago
font-size: 0.9em;
}
.profile-edition-buttons {
text-align: right;
}
.selectable_theme.theme_calm {
display: none;
}
/************* POST BOARD ************ */
.postboard {
width: 55%;
margin-left: 15%;
padding: 7px 20px;
}
9 years ago
.postboard h2 {
display: none;
}
9 years ago
.postboard .postboard-posts {
position: relative;
9 years ago
z-index: 1;
clear: both;
}
9 years ago
.postboard .postboard-news {
display: none;
}
9 years ago
.postboard .post {
background: #FDFCFA;
9 years ago
position: relative;
margin-bottom: 1px;
-moz-transition-property: margin;
-o-transition-property: margin;
-webkit-transition-property: margin;
transition-property: margin;
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
9 years ago
-moz-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
.postboard .post .post, .postboard .post .original.post, .postboard .post .post.open, .postboard .post .mini-profile .post.post-area-new, .mini-profile .postboard .post .post.post-area-new, .postboard .post #postboard-top .post-area .post.post-area-new, #postboard-top .post-area .postboard .post .post.post-area-new {
position: relative;
}
9 years ago
.module.open .post, .mini-profile .module.post-area-new .post, #postboard-top .post-area .module.post-area-new .post {
color: #1e1e1e;
}
9 years ago
.post:hover {
color: #1e1e1e;
}
9 years ago
.post-data {
padding: 1rem;
}
9 years ago
.post.open .original, .mini-profile .post.post-area-new .original, #postboard-top .post-area .post.post-area-new .original, .post.open .related, .mini-profile .post.post-area-new .related, #postboard-top .post-area .post.post-area-new .related {
margin-bottom: 1px;
}
9 years ago
.postboard-posts > .post {
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}
9 years ago
.postboard-posts > .post.open, .mini-profile .postboard-posts > .post.post-area-new, #postboard-top .post-area .postboard-posts > .post.post-area-new {
margin-top: 1rem;
margin-bottom: 1rem;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}
9 years ago
.postboard-posts > .post:after {
content: "";
position: absolute;
right: 0;
top: 0;
width: 0;
height: 100%;
9 years ago
transition: all 0.2s linear;
}
9 years ago
.postboard-posts > .post.open:after, .mini-profile .postboard-posts > .post.post-area-new:after, #postboard-top .post-area .postboard-posts > .post.post-area-new:after {
width: 5px;
}
9 years ago
.post:hover {
cursor: pointer;
}
9 years ago
.open, .mini-profile .post-area-new, #postboard-top .post-area .post-area-new {
9 years ago
background: none !important;
}
9 years ago
.post-photo {
margin: 0;
display: inline-block;
float: left;
vertical-align: middle;
overflow: hidden;
width: 40px;
}
9 years ago
.post-photo img {
width: 100%;
height: auto !important;
}
9 years ago
.post-info-name {
font-weight: 600;
color: inherit;
9 years ago
text-decoration: none;
display: inline-block;
float: left;
margin-left: 10px;
}
9 years ago
.post-info-name:hover {
text-decoration: none;
color: black;
}
9 years ago
.post-info-tag {
font-size: 12px;
opacity: 0.6;
margin-top: 4px;
display: inline-block;
}
9 years ago
.post-info-time {
position: absolute;
9 years ago
font-size: 11px;
line-height: 14px;
text-decoration: none;
top: 11px;
right: 11px;
color: #919191;
}
9 years ago
.post-info-time:hover {
color: #515151;
}
9 years ago
.post-text {
margin: 0 0 0 50px;
9 years ago
word-wrap: break-word;
min-height: 20px;
padding: 0;
}
.post-text a:hover {
text-decoration: underline;
}
9 years ago
.post-context {
font-size: 11px;
line-height: 11px;
margin: 0 0 1em 0;
color: #919191;
}
9 years ago
.post-context:before {
display: block;
9 years ago
float: left;
background: #A1B775;
9 years ago
text-align: center;
padding: 1px 2px 2px 2px;
line-height: 9px;
font-size: 9px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
color: white;
margin-right: 0.4em;
}
9 years ago
.mini-screen-name {
font-size: 13px;
color: #444;
}
9 years ago
.post-retransmited-icon {
display: none;
}
9 years ago
.post-interactions {
margin: 10px 0 3px 0;
text-align: right;
height: 12px;
line-height: 12px;
}
.post-interactions span {
color: #919191;
cursor: pointer;
9 years ago
font-size: 12px;
line-height: 12px;
}
9 years ago
.post-expand {
color: #919191;
cursor: pointer;
font-size: 12px;
position: absolute;
left: 10px;
bottom: 10px;
}
9 years ago
.post-expand:hover {
color: #515151;
}
9 years ago
.post-reply, .post-propagate, .post-favorite {
padding-left: 10px;
display: none;
}
9 years ago
.post-reply:hover, .post-propagate:hover, .post-favorite:hover {
color: #515151;
}
9 years ago
.post-favorite {
display: none !important;
}
9 years ago
.post .show-more {
display: inline-block;
float: right;
font-size: 12px;
color: #919191;
}
9 years ago
.post .show-more:hover {
color: #515151;
}
9 years ago
.expanded-content.show-pic {
display: block;
}
9 years ago
.expanded-post .post-expand, .expanded-post .post-reply, .expanded-post .post-propagate, .expanded-post .post-favorite {
color: #919191;
}
9 years ago
.expanded-post .post-expand:hover, .expanded-post .post-reply:hover, .expanded-post .post-propagate:hover, .expanded-post .post-favorite:hover {
color: #515151;
}
9 years ago
.related .post-expand {
display: none;
margin: 0;
}
9 years ago
.post:hover .post-reply, .post:hover .post-propagate, .post:hover .post-favorite, .original.open .post-interactions .post-reply, .mini-profile .original.post-area-new .post-interactions .post-reply, #postboard-top .post-area .original.post-area-new .post-interactions .post-reply, .original.open .post-interactions .post-propagate, .mini-profile .original.post-area-new .post-interactions .post-propagate, #postboard-top .post-area .original.post-area-new .post-interactions .post-propagate, .original.open .post-interactions .post-favorite, .mini-profile .original.post-area-new .post-interactions .post-favorite, #postboard-top .post-area .original.post-area-new .post-interactions .post-favorite, .post:hover .original .post-interactions .post-reply, .post:hover .original .post-interactions .post-propagate, .post:hover .original .post-interactions .post-favorite, .related.post:hover .post-reply, .related.post:hover .post-propagate, .related.post:hover .post-favorite {
display: inline-block;
}
9 years ago
.open .related .post-reply, .mini-profile .post-area-new .related .post-reply, #postboard-top .post-area .post-area-new .related .post-reply, .open .related .post-propagate, .mini-profile .post-area-new .related .post-propagate, #postboard-top .post-area .post-area-new .related .post-propagate, .open .related .post-favorite, .mini-profile .post-area-new .related .post-favorite, #postboard-top .post-area .post-area-new .related .post-favorite {
display: none !important;
}
9 years ago
.open .related:hover .post-reply, .mini-profile .post-area-new .related:hover .post-reply, #postboard-top .post-area .post-area-new .related:hover .post-reply, .open .related:hover .post-propagate, .mini-profile .post-area-new .related:hover .post-propagate, #postboard-top .post-area .post-area-new .related:hover .post-propagate {
display: inline-block !important;
}
9 years ago
.expanded-content {
display: none;
padding: 5px 5px 0 5px;
}
9 years ago
.image-preview {
max-width: 100%;
width: auto;
9 years ago
display: block;
margin: auto;
}
9 years ago
.preview-container {
width: 100%;
text-align: center;
9 years ago
overflow-y: auto;
background: black;
}
.post-stats {
float: left;
}
9 years ago
.post-stats li {
display: inline-block;
}
9 years ago
.post-stats li.stat-count {
font-weight: 700;
font-size: 11px;
float: left;
line-height: 20px;
color: llighten(#444, 30%);
}
9 years ago
.post-stats li.stat-count span:last-child {
padding-right: 5px;
}
9 years ago
.post-stats a {
position: relative;
text-decoration: none;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 1px 0 0;
}
9 years ago
.post-stats a img {
width: 20px;
height: 20px;
}
9 years ago
.user-name-tooltip {
display: none;
position: absolute;
9 years ago
background: #2a2a2a;
9 years ago
font-size: 12px;
white-space: nowrap;
padding: 3px 5px;
color: #fff;
top: -42px;
left: 0px;
}
.user-name-tooltip:after {
content: "";
position: absolute;
width: 0;
left: 4px;
bottom: -5px;
9 years ago
border-top: solid 5px #2a2a2a;
9 years ago
border-left: solid 5px transparent;
border-right: solid 5px transparent;
}
9 years ago
.post-stats a:hover .user-name-tooltip {
display: inline-block;
}
9 years ago
.post-replies .sub-replies {
border-left: solid 18px #EBEBEB;
}
9 years ago
.following {
width: 40%;
margin-left: 30%;
9 years ago
padding: 20px;
}
9 years ago
.following h2 {
display: none;
}
9 years ago
.following .following-list li {
border-bottom: 1px solid #EBEBEB;
9 years ago
line-height: 45px;
background: #FDFCFA;
9 years ago
position: relative;
9 years ago
-moz-transition-property: background;
-o-transition-property: background;
-webkit-transition-property: background;
transition-property: background;
-moz-transition-duration: 0.1s;
-o-transition-duration: 0.1s;
-webkit-transition-duration: 0.1s;
transition-duration: 0.1s;
}
9 years ago
.following .following-list li:hover {
background: white;
}
.following .following-list li a {
display: block;
9 years ago
padding: 1rem;
width: 100%;
color: #444;
}
9 years ago
.following .mini-profile-photo {
width: 40px;
9 years ago
line-height: 0;
margin: 0 1rem 0 0;
float: left;
}
9 years ago
.following .mini-profile-name {
9 years ago
font-size: 1rem;
font-weight: 500;
float: left;
display: block;
9 years ago
line-height: 1rem;
padding: 10px 0;
}
9 years ago
.following .mini-screen-name {
display: block;
9 years ago
float: left;
line-height: 1rem;
font-weight: 400;
font-size: 1rem;
padding: 10px;
color: #666;
}
9 years ago
.following .mini-screen-name b {
font-weight: 400;
padding: 0;
color: inherit;
font-size: inherit;
line-height: inherit;
}
9 years ago
.following .mini-profile-actions {
display: none;
}
9 years ago
.following .following-config {
9 years ago
position: absolute;
top: 0;
9 years ago
right: 0;
padding: 1rem;
}
9 years ago
.following .swarm-status {
display: none !important;
}
9 years ago
.login .header-bold {
display: block;
width: 720px;
margin: 0px auto 12px auto;
}
.login .module {
background: white;
9 years ago
padding: 1rem;
}
9 years ago
.login .module p {
margin-bottom: 5px;
}
9 years ago
.login .module input {
padding: 5px 10px;
background: #f3f3f3;
border: solid 1px #dcdcdc;
transition: box-shadow 0.3s, border 0.3s;
font-size: 14px;
}
9 years ago
.login .module input:focus, .login .module select:focus {
background: white;
transition: background-color 100ms linear;
border-bottom: solid 2px #A1B775;
9 years ago
}
.login .module select {
height: 30px;
padding: 3px 30px 3px 10px;
margin: 0;
border: 1px solid #ccc;
font-size: 14px;
}
.login .module span.availability {
margin-left: 10px;
color: #45474d;
}
.login .module:nth-child(2) div,
.login .module:nth-child(3) div:nth-child(2),
.login .secret-key-import,
.login .username-import {
margin-top: 20px;
margin-bottom: 20px;
margin-left: 16px;
}
.login .create-user,
.login .import-secret-key {
display: block;
margin-left: auto;
margin-right: 16px;
}
.login .with-nickname, .login .import-secret-key, .login .create-user {
margin-top: 10px;
}
/********** LOGIN AND NETWORK PAGES ****** */
.network.singleBlock ul {
line-height: 2rem;
padding: 2rem;
}
.network.singleBlock .module {
background: #EBEBEB;
9 years ago
-moz-box-shadow: 0 1px 1px rgba(85, 85, 85, 0.1);
-webkit-box-shadow: 0 1px 1px rgba(85, 85, 85, 0.1);
box-shadow: 0 1px 1px rgba(85, 85, 85, 0.1);
margin-bottom: 50px;
}
.network.singleBlock .module:last-child h2 {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuNSIgeDI9IjEuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ExYjc3NSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzVlODBhMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
9 years ago
background-size: 100%;
background-image: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #a1b775), color-stop(100%, #5e80a2));
background-image: -moz-linear-gradient(left, #a1b775, #5e80a2);
background-image: -webkit-linear-gradient(left, #a1b775, #5e80a2);
background-image: linear-gradient(to right, #a1b775, #5e80a2);
9 years ago
}
.network .spam-msg {
resize: none;
width: 100%;
display: block;
padding: 1rem;
height: 180px;
border: solid 1px rgba(0, 0, 0, 0.1);
position: relative;
margin: 1rem 0;
font-family: "Roboto", sans-serif;
}
.network .highlight {
font-size: 1.2rem;
display: block;
margin: 1rem 0;
}
.network span.connection-status {
font-weight: 500;
}
.network span.connection-status:before {
content: "";
display: inline-block;
height: 0.8em;
width: 0.8em;
margin-right: 0.8em;
background: #EF5D43;
color: white;
}
.network span.connection-status.connected:before {
background: #A1B775;
9 years ago
}
.network .character-limit {
float: right;
margin-right: 1rem;
}
.network .connections span, .network .known-peers, .network .dht-nodes, .network .blocks, .network .last-block-time, .network .mining-difficulty {
color: #A1B775;
9 years ago
font-weight: 700;
font-family: Arial;
font-size: 95%;
}
.network h2 {
font-weight: 400;
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjEuMCIgeTE9IjAuNSIgeDI9IjAuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ExYjc3NSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzVlODBhMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
9 years ago
background-size: 100%;
background-image: -webkit-gradient(linear, 100% 50%, 0% 50%, color-stop(0%, #a1b775), color-stop(100%, #5e80a2));
background-image: -moz-linear-gradient(right, #a1b775, #5e80a2);
background-image: -webkit-linear-gradient(right, #a1b775, #5e80a2);
background-image: linear-gradient(to left, #a1b775, #5e80a2);
9 years ago
padding: 1rem 2rem;
color: white;
}
.network h3 {
font-weight: 600;
margin-top: 2rem;
padding: 0 1.5rem;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
.network h3:after {
display: block;
content: "";
height: 1px;
width: 100%;
background: rgba(95, 129, 161, 0.5);
margin-top: 1rem;
}
.options {
position: relative;
}
9 years ago
.options button, .options input, .options select {
9 years ago
font-size: 13px;
}
.options label {
cursor: pointer;
}
.options .label-h {
font-weight: 700;
}
.options input[type=radio] {
display: none !important;
visibility: hidden;
opacity: 0;
}
.options input[type='checkbox'] {
cursor: pointer;
vertical-align: sub;
}
.options input[type='range'] {
cursor: pointer;
vertical-align: -16px;
}
.options .container {
margin: 5px 0px 5px 12px;
}
.options .tab-content {
background: #EBEBEB;
9 years ago
position: relative;
padding: 20px;
}
.options .tab-content > div {
position: absolute;
top: 0;
left: 0;
height: auto;
width: 100%;
z-index: -1;
opacity: 0;
visibility: hidden;
}
.options input#tab_language:checked ~ .tab-content .language, .options input#t-2:checked ~ .tab-content .theme, .options input#t-3:checked ~ .tab-content .notifications, .options input#t-4:checked ~ .tab-content .keys, .options input#t-5:checked ~ .tab-content .appearance, .options input#t-6:checked ~ .tab-content .users {
position: relative;
z-index: 10;
opacity: 1;
visibility: visible;
}
.options label.tabs {
text-align: center;
width: auto;
display: inline-block !important;
margin: 0 5px 0 0;
padding: 5px 15px;
color: #aaa;
}
.options label.tabs:hover {
9 years ago
color: #222;
}
.options input:checked + label.tabs {
background: #EBEBEB;
9 years ago
color: #222;
}
.promoted-posts-only {
margin: 0 0;
}
.promoted-posts-only li {
cursor: pointer;
display: block;
margin: 0;
padding: 5px;
border-bottom: 1px solid #EBEBEB;
text-align: center;
font-size: 0.9em;
transition: color 0.1s linear;
}
.promoted-posts-only li.disabled {
background: #F4F3F2;
}
.promoted-posts-only li.active, .promoted-posts-only li.active span {
color: #444;
cursor: default;
}
.promoted-posts-only li:hover span, .promoted-posts-only li.disabled:hover span {
color: #444;
}
.promoted-posts-only li.disabled span {
color: rgba(68, 68, 68, 0.3);
}
/* Wrapper and blocks */
.wrapper {
width: 100%;
max-width: 100%;
9 years ago
margin: auto;
9 years ago
padding-top: 50px;
position: relative;
z-index: 1;
}
9 years ago
.dashboard.left {
position: absolute;
9 years ago
top: 50px;
left: 0;
width: 15%;
}
.dashboard.left > .module {
float: right;
width: 128px;
}
.dashboard.right {
9 years ago
position: fixed;
right: 0;
top: 50px;
overflow: hidden;
width: 30%;
}
.dashboard > .module {
max-width: 320px;
margin-bottom: 20px;
background: #FDFCFA;
width: 100%;
}
.dashboard > .module h3 {
float: left;
padding: 20px;
}
.dashboard > .module h4 {
clear: left;
border-top: 1px solid #EBEBEB;
padding: 10px;
}
9 years ago
.dashboard > .module small {
display: none;
}
/********** CONFIG SUBMENU & SEARCH RESULTS *********** */
.dialog-modal {
display: none;
9 years ago
background: #222;
position: absolute;
top: 46px;
right: 0;
width: 320px;
overflow: hidden;
9 years ago
-moz-box-shadow: 0 8px 33px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 8px 33px rgba(0, 0, 0, 0.3);
box-shadow: 0 8px 33px rgba(0, 0, 0, 0.3);
}
.userMenu-search .dialog-modal:after {
right: auto;
left: 150px;
}
.direct-messages, .dropdown-menu-item {
display: block;
padding: 10px;
}
ul.userMenu-search-profiles {
width: 100%;
padding: 0;
}
ul.userMenu-search-profiles li {
float: none;
display: block;
margin: 0;
cursor: pointer;
background: #FDFCFA;
border-bottom: 1px solid #EBEBEB;
}
ul.userMenu-search-profiles li:hover {
background: white;
}
ul.userMenu-search-profiles li a {
display: block;
width: 100%;
font-size: 12px;
font-weight: 400;
line-height: 40px;
display: block;
margin: 0;
padding: 0;
color: #444;
}
ul.userMenu-search-profiles li a span, ul.userMenu-search-profiles li a b, ul.userMenu-search-profiles li a span:hover, ul.userMenu-search-profiles li a b:hover {
display: inline-block;
color: #444;
font-weight: 400;
font-size: 12px;
}
ul.userMenu-search-profiles .mini-screen-name b,
ul.userMenu-search-profiles .mini-screen-name {
font-weight: 500;
}
ul.userMenu-search-profiles .mini-profile-photo {
width: 40px;
height: auto;
9 years ago
margin: 10px;
float: left;
}
ul.userMenu-search-profiles .mini-profile-info {
width: 100%;
float: none;
}
9 years ago
ul.userMenu-search-profiles button {
font-size: 1.4rem;
line-height: 25px;
height: 30px;
width: 40px;
text-align: center;
font-weight: 500;
padding: 0;
9 years ago
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
position: absolute;
top: 10px;
right: 10px;
}
.userMenu-search input[type="text"] {
float: right;
padding: 3px 10px;
margin: 10px 20px 0 0;
border: none;
background: #EBEBEB;
box-sizing: border-box;
}
.userMenu-search-sugestions a {
color: rgba(0, 0, 0, 0.7);
padding: 10x 20px;
display: block;
clear: both;
}
/***************** MINI PROFILE ****************************** */
.mini-profile a.button {
background: #aaa;
margin: 1em auto;
}
.mini-profile .post-area {
margin-top: 1px;
margin-bottom: 20px;
padding: 0.5em;
}
.mini-profile .post-area-new {
9 years ago
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
padding: 0;
margin: 0;
}
.mini-profile .post-area-new textarea {
width: 100%;
}
.mini-profile-indicators {
margin: 0;
text-align: center;
border-top: 1px solid #EBEBEB;
background: #F4F3F2;
}
.mini-profile-indicators li {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: block;
position: relative;
font-size: 0.8em;
text-align: center;
border-bottom: 1px solid #EBEBEB;
}
.mini-profile-indicators li a {
color: #777777;
display: block;
padding: 1rem 0;
}
.mini-profile-indicators li a:hover {
color: #444;
background: #FDFCFA;
}
.mini-profile-indicators li a:before {
display: block !important;
width: 100% !important;
font-size: 1.4rem !important;
}
.messages-qtd {
position: absolute;
top: 50%;
margin-top: -11px;
right: 11px;
background: #A1B775;
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.2);
color: #fff;
width: 25px;
height: 25px;
line-height: 25px;
font-size: 10px;
font-weight: 900;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
}
.mini-profile-view {
display: none;
}
.mini-profile-name {
9 years ago
color: #444;
font-size: 1em;
font-weight: 500;
padding: 10px 0;
display: block;
text-align: center;
margin: auto;
}
.mini-profile-name:hover {
color: #aaa;
}
.mini-profile-photo img {
width: 64px;
height: auto;
display: block;
margin: 32px auto 0 auto;
}
.profile-data {
clear: both;
padding: 0 0 1em 0;
text-align: center;
background: #EBEBEB;
}
9 years ago
.mini-profile .profile-data {
display: none;
}
.profile-data li {
9 years ago
display: inline;
margin: 0 5px;
float: none;
}
.profile-data li a {
9 years ago
color: #444;
display: inline-block;
font-size: 13px;
padding-bottom: 3px;
}
.profile-data li a:hover {
color: #aaa;
}
.profile-data li a span.posts-count, .profile-data li a span.following-count, .profile-data li a span.followers-count {
9 years ago
display: inline-block;
padding-right: 5px;
}
.mini-profile a span.following-count {
display: block;
font-weight: 900;
font-size: 1.2rem;
color: #777777;
}
.mini-profile a:hover span.following-count {
color: #444;
}
.mini-profile-info a:hover {
text-decoration: none;
}
.who-follow {
display: block;
position: absolute;
bottom: 10px;
text-align: center;
padding: 10px;
font-size: 12px;
z-index: 10;
-moz-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
-webkit-transition: all 0.2s linear;
transition: all 0.2s linear;
}
.show-more-followers {
font-weight: 700;
display: block;
cursor: pointer;
float: right;
9 years ago
color: #444;
}
.mini-follower-link {
display: inline-block;
margin: 1px;
line-height: 12px;
}
.mini-follower-link.isFollowing:after {
display: none;
}
.mini-follower-link:after {
content: "·";
font-weight: 900;
9 years ago
color: #222;
margin-left: 1px;
}
/***************** POST AREA ************** */
.post-area-new textarea {
resize: none;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
display: block;
transition: all 0.3s linear;
-webkit-transition: height 0.3s linear;
-moz-transition: height 0.3s linear;
-o-transition: height 0.3s linear;
-ms-transition: height 0.3s linear;
height: 40px;
border: none;
background: white;
border: 1px solid rgba(0, 0, 0, 0.1);
padding: 5px;
margin: 5px 0;
}
.post-area-new textarea:focus {
border-bottom: solid 1px #A1B775;
}
.mini-profile .post-area {
display: none;
}
#postboard-top {
clear: both;
position: relative;
margin-bottom: 10px;
transition: height 0.3s linear;
padding: 10px;
background: white;
overflow: hidden;
background: #FDFCFA;
-moz-box-shadow: 0 0 13px rgba(17, 17, 17, 0);
-webkit-box-shadow: 0 0 13px rgba(17, 17, 17, 0);
box-shadow: 0 0 13px rgba(17, 17, 17, 0);
-moz-transition-property: box-shadow;
-o-transition-property: box-shadow;
-webkit-transition-property: box-shadow;
transition-property: box-shadow;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
-webkit-transition-duration: 0.2s;
transition-duration: 0.2s;
-moz-transition-timing-function: ease-out;
-o-transition-timing-function: ease-out;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
z-index: 120;
}
#postboard-top.on, #postboard-top {
-moz-box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
-webkit-box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
box-shadow: 0 8px 13px rgba(17, 17, 17, 0.2);
}
#postboard-top.hide {
display: none !important;
}
#postboard-top.show {
display: block;
}
#postboard-top .profile-photo {
position: absolute;
top: 10px;
left: 10px;
width: 40px;
}
#postboard-top .profile-photo img {
width: 100%;
}
#postboard-top .post-area {
overflow: hidden;
width: 100%;
padding-left: 58px;
padding-right: 0;
display: inline;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background: none;
float: right;
}
9 years ago
#postboard-top .post-area .post-area-new {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}
#postboard-top .post-area .post-area-new textarea {
9 years ago
margin: 0 0 10px 0;
}
#post-preview {
background: #EBEBEB;
border: 1px solid #EBEBEB;
padding: 15px;
-moz-transition-property: all;
-o-transition-property: all;
-webkit-transition-property: all;
transition-property: all;
-moz-transition-duration: 0.1s;
-o-transition-duration: 0.1s;
-webkit-transition-duration: 0.1s;
transition-duration: 0.1s;
width: 100% !important;
word-wrap: break-word;
}
.post-area-new.open textarea, .mini-profile .post-area-new textarea, #postboard-top .post-area .post-area-new textarea {
height: 80px;
}
textarea.splited-post {
box-shadow: none !important;
height: 28px;
}
.splited-post-counter {
color: rgba(0, 0, 0, 0.3);
font-weight: bold;
}
.splited-post-counter:before {
content: "…";
}
.post-area-extras {
overflow: hidden;
height: 0;
text-align: right;
}
.post-area-new.open > .post-area-extras, .mini-profile .post-area-new > .post-area-extras, #postboard-top .post-area .post-area-new > .post-area-extras {
height: auto;
transition: all 0.6s linear;
}
.post-area-remaining {
padding-right: 3px;
}
.post-area-remaining.warn {
color: #ff0000;
}
/******** WHO TO FOLLOW ******* */
9 years ago
.who-to-follow.module li button {
position: absolute;
right: 10px;
top: 10px;
display: none;
}
.who-to-follow.module li:hover button {
display: block;
}
.who-to-follow.module .bio {
text-align: left !important;
}
.who-to-follow small {
display: none;
}
.who-to-follow h3 {
float: left;
padding: 20px;
}
.who-to-follow ol {
clear: both;
}
.twister-user {
position: relative;
box-sizing: border-box;
background: #FDFCFA;
border-top: 1px solid #EBEBEB;
width: 100%;
min-height: auto;
padding: 10px 0;
clear: left;
-moz-transition-property: background;
-o-transition-property: background;
-webkit-transition-property: background;
transition-property: background;
-moz-transition-duration: 0.1s;
-o-transition-duration: 0.1s;
-webkit-transition-duration: 0.1s;
transition-duration: 0.1s;
}
.twister-user:hover {
background: white;
}
img.twister-user-photo {
float: left;
display: block;
float: left;
width: 40px;
height: auto;
margin: 0 10px;
background: #EBEBEB;
}
.followers {
font-size: 12px;
9 years ago
color: #444;
}
.followers label, .followers a {
display: inline-block;
}
.followed-by {
color: #aaa;
font-size: 12px;
cursor: pointer;
display: block;
}
.twister-user-name, .twister-by-user-name {
font-weight: bold;
font-size: 14px;
color: #aaa;
text-decoration: none;
}
.twister-user-tag {
font-size: 12px;
line-height: 14px;
opacity: 0.8;
display: inline-block;
letter-spacing: 0px;
}
.twister-user-remove {
font-size: 13px;
opacity: 0.2;
text-decoration: none;
cursor: pointer;
position: absolute;
padding: 5px;
top: -5px;
right: -5px;
display: inline-block;
}
.twister-user:hover .twister-user-remove {
text-decoration: none;
}
.twister-user-remove:hover {
opacity: 1;
}
.refresh-toptrends, .twistday-reminder .refresh, .refresh-users {
9 years ago
color: #222;
cursor: pointer;
font-size: 11px;
font-weight: 500;
text-transform: none;
letter-spacing: 0;
float: right;
display: block;
margin: 5px;
position: relative;
}
.view-all-users {
9 years ago
color: #222;
cursor: pointer;
font-size: 11px;
font-weight: 500;
text-transform: none;
letter-spacing: 0;
float: right;
display: block;
margin: 5px;
position: relative;
}
.refresh-toptrends:hover, .twistday-reminder .refresh:hover, .refresh-users:hover, .view-all-users:hover {
color: #A1B775;
text-decoration: none;
background-color: transparent;
}
/***********TOP TRENDS************** */
.toptrends-list {
margin: 0;
clear: both;
border-top: 1px solid #EBEBEB;
padding: 10px;
}
.toptrends-list li {
display: inline-block;
}
.toptrends-list a {
color: #aaa;
padding: 3px 8px;
display: inline-block;
text-transform: uppercase;
font-size: 11px;
margin: 3px;
font-weight: 500;
9 years ago
background: white;
-moz-box-shadow: 0 5px 8px rgba(85, 85, 85, 0.2);
-webkit-box-shadow: 0 5px 8px rgba(85, 85, 85, 0.2);
box-shadow: 0 5px 8px rgba(85, 85, 85, 0.2);
}
.toptrends-list a:hover {
9 years ago
color: #222;
}
/********* TWISTDAY REMINDER ****** */
.twistday-reminder small {
display: none;
}
.twistday-reminder .twister-user {
background: #FDFCFA;
position: relative;
-moz-transition-property: background;
-o-transition-property: background;
-webkit-transition-property: background;
transition-property: background;
-moz-transition-duration: 0.1s;
-o-transition-duration: 0.1s;
-webkit-transition-duration: 0.1s;
transition-duration: 0.1s;
}
.twistday-reminder .twister-user:hover {
background: white;
}
.twistday-reminder .twister-user-full, .twistday-reminder .twister-user-tag {
font-size: 1rem;
line-height: 1rem;
color: #444;
font-weight: 500;
opacity: 1;
letter-spacing: 0;
display: inline-block;
}
.twistday-reminder .twisterday {
font-size: 12px;
}
/******* LOADER ************ */
.postboard-loading, .loading-roller {
font-size: 100px;
width: 0.4em;
height: 0.4em;
position: relative;
list-style: none;
border-radius: 50%;
margin: 100px auto;
display: none;
}
.postboard-loading div, .loading-roller div {
width: 0.1em;
height: 0.1em;
position: absolute;
border-radius: 50%;
}
.postboard-loading div:nth-child(1), .loading-roller div:nth-child(1) {
background: #62839F;
top: 0;
left: 50%;
margin-left: -0.05em;
transform-origin: 50% 250%;
animation: rota 1.13s linear infinite, opa 3.67s ease-in-out infinite alternate;
}
.postboard-loading div:nth-child(2), .loading-roller div:nth-child(2) {
background: #749294;
top: 50%;
right: 0;
margin-top: -0.05em;
transform-origin: -150% 50%;
animation: rota 1.86s linear infinite, opa 4.29s ease-in-out infinite alternate;
}
.postboard-loading div:nth-child(3), .loading-roller div:nth-child(3) {
background: #94AC7E;
bottom: 0;
left: 50%;
margin-left: -0.05em;
transform-origin: 50% -150%;
animation: rota 1.45s linear infinite, opa 5.12s ease-in-out infinite alternate;
}
.postboard-loading div:nth-child(4), .loading-roller div:nth-child(4) {
background: #B4C669;
top: 50%;
left: 0;
margin-top: -0.05em;
transform-origin: 250% 50%;
animation: rota 1.72s linear infinite, opa 5.25s ease-in-out infinite alternate;
}
@keyframes rota {
to {
transform: rotate(360deg);
}
}
@keyframes opa {
12.0% {
opacity: 0.8;
}
19.5% {
opacity: 0.88;
}
37.2% {
opacity: 0.64;
}
40.5% {
opacity: 0.52;
}
52.7% {
opacity: 0.69;
}
60.2% {
opacity: 0.6;
}
66.6% {
opacity: 0.52;
}
70.0% {
opacity: 0.63;
}
79.9% {
opacity: 0.6;
}
84.2% {
opacity: 0.75;
}
91.0% {
opacity: 0.87;
}
}
/* Options */
.options .appearance div {
clear: both;
}
.options .appearance div div {
float: left;
clear: none;
padding: 10px;
}
.options .appearance div div .label {
font-weight: 400;
}
.options #filterLangList {
width: 90%;
}
.options #filterLangListCont div, .options #TopTrendsCont div, .options #TwistdayReminderCont div {
float: none;
padding: 0px 4px;
}
.suboptions {
margin: 5px 30px;
border: double 2px rgba(69, 71, 77, 0.1);
height: 0px;
padding: 0 !important;
overflow: hidden;
float: right;
transition: height 0.3s linear;
-webkit-transition: height 0.3s linear;
-moz-transition: height 0.3s linear;
-o-transition: height 0.3s linear;
-ms-transition: height 0.3s linear;
font-size: 0.9em;
line-height: 0.9em;
font-style: italic;
}
.suboptions div {
float: none !important;
}
.suboptions span {
font-style: normal;
}
/********** AUTOCOMPLETING ******** */
.textcomplete-wrapper textarea {
display: inline;
}
ul.dropdown-menu {
min-width: 160px;
padding: 5px 0 7px;
margin: 2px 0 0;
list-style: none;
background-color: #fff;
border: 1px solid rgba(0, 0, 0, 0.2);
border-bottom: solid 2px #B4C669;
}
ul.dropdown-menu li > li > a {
padding: 3px 20px;
white-space: nowrap;
transition: all 100ms;
}
/* Language filter messages */
.langFilterSimData {
color: rgba(0, 0, 0, 0.7);
font: 10px "Open Sans", sans-serif;
text-align: center;
}
.langFilterSimData em {
color: #B4C669;
}
@media (max-width: 1200px) {
.right {
display: none;
}
.userMenu ul {
padding: 0;
}
.postboard {
width: 85%;
}
.modal-wrapper {
width: 85%;
}
}