/* · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · Q V I T T E R · · · · http://github.com/hannesmannerheim/qvitter · · · · · · \\\\_\ · · \\) \____) · · · · · · · · Qvitter is free software: you can redistribute it and / or modify it · · under the terms of the GNU Affero General Public License as published by · · the Free Software Foundation, either version three of the License or (at · · your option) any later version. · · · · Qvitter is distributed in hope that it will be useful but WITHOUT ANY · · WARRANTY; without even the implied warranty of MERCHANTABILTY or FITNESS · · FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for · · more details. · · · · You should have received a copy of the GNU Affero General Public License · · along with Qvitter. If not, see . · · · · Contact h@nnesmannerhe.im if you have any questions. · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · · */ @font-face { font-family: 'FontAwesome'; src: url('../fonts/fontawesome-webfont.eot?v=4.2.0'); src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; } html { overflow-y: scroll; } html.fixed { position:fixed; width:100%; } .androidFix { overflow:hidden !important; overflow-y:hidden !important; overflow-x:hidden !important; } a:active { outline: none; } body { background-size:cover; background-attachment:fixed; background-repeat: no-repeat; background-position: 0 46px; margin:0; padding:0; padding-left:50%; padding-top:39px; color: #333333; font-size: 14px; line-height: 18px; font-family: "Helvetica Neue",Arial,sans-serif; } a, a:visited, a:active { text-decoration:none; } ul, li { margin:0; padding:0; list-style: none outside none; } #dynamic-styles { display:none; } .modal-close .icon, .chev-right, .close-right, button.icon.nav-search, .member-button .join-text i, .external-member-button .join-text i, .external-follow-button .follow-text i, .qvitter-follow-button .follow-text i, #logo, .upload-cover-photo, .upload-avatar, .upload-background-image, button.shorten i, .reload-stream, .topbar .global-nav:before, .stream-item.notification.repeat .dogear, .stream-item.notification.like .dogear, .ostatus-link, .close-edit-profile-window { background-image: url("../img/sprite.png?v=40"); background-size: 500px 1329px; } #logo { width:89px; height:34px; display:block; position:fixed; z-index:1001; margin-top:3px; left:50%; margin-left:-445px; background-position:0 0; cursor:pointer; top:5px; } #logo:hover { background-position: 0 -35px; } #top-compose { border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 4px; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset; box-sizing: border-box; cursor: pointer; display: block; height: 32px; margin: 0 -443px 0 0; position: fixed; right: 50%; top: 7px; width: 32px; z-index: 100; display:none; } #top-compose:before { cursor: pointer; display: block; height: 32px; margin-top: -3px; position: absolute; width: 32px; z-index: 101; text-align:center; line-height:36px; content:"\f040"; font-family:FontAwesome; color:#fff; top:0; font-size:18px; overflow:hidden; } #top-compose:hover { background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05)); } .topbar { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); left: 0; position: fixed; right: 0; top: 0; z-index: 3000; text-align:center; } #search { display:none; height: 26px; width: 202px; float: right; font-size: 12px; margin: 7px 92px 0 7px; position: relative; } #search-query { background-color: rgba(0,0,0,0.03); border: 1px solid rgba(0,0,0,0.1); border-radius: 21px; box-sizing: border-box; color: rgba(0,0,0,0.8); display: block; font-size: 12px; height: 32px; line-height: 1; padding: 5px 27px 6px 12px; transition: all 0.2s ease-in-out 0s; width:100%; outline:none; } #search-query::-webkit-input-placeholder { line-height:18px; height:18px; } #search-query:focus { box-shadow:none; text-shadow:none; background-color:#fff; color:#666; } .search-icon { font-size: 12px; cursor: pointer; display: block; height: 32px; position: absolute; right: 2px; top: 0; width: 26px; z-index: 3; text-align: left; } button.icon.nav-search { font-family: "Helvetica Neue",Arial,sans-serif; border: 0 none; background-repeat: no-repeat; display: inline-block; vertical-align: text-top; height: 14px; width: 14px; background-position: -20px -710px; background-color: transparent; margin-left: 7px; margin-top: 6px; cursor:pointer; } button.icon.nav-search span { font-family: "Helvetica Neue",Arial,sans-serif; border: 0 none; clip: rect(0px, 0px, 0px, 0px); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .global-nav .container { width:890px; margin: 0 auto; } .language-dropdown { float: right; text-align: left; margin-left: 6px; margin-right: 0; position: relative; display: block; } .dropdown { float: left; position: relative; } .dropdown-toggle { color: #333; cursor: pointer; display: block; font-family: Arial,sans-serif; font-size: 12px; font-weight: bold; height: 12px; line-height: 1; padding: 17px 12px 15px; position: relative; text-decoration: none; } .dropdown-toggle:hover { text-decoration:underline; } .dropdown-toggle small { font-weight: normal; font-size: 12px; } .dropdown-toggle .caret { border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid #777777; display: inline-block; height: 0; margin-left: 2px; margin-top: 5px; vertical-align: top; width: 0; } .dropdown-toggle .caret b { font-weight: normal; } .dropdown-menu { right: 0; width: 250px; background-clip: padding-box; background-color: #FFFFFF; border-color: rgba(0, 0, 0, 0.2); border-radius: 4px 4px 4px 4px; border-style: solid; border-width: 1px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); display: none; float: left; margin: 2px 0 0; padding: 4px 0; position: absolute; top: 100%; z-index: 900; } .quitter-settings.dropdown-menu { margin-right: -400px; right: 50%; } .quitter-settings.dropdown-menu.dropped { display:block; } .dropdown-caret { float: left; height: 7px; left: 12px; overflow: hidden; position: absolute; top: -7px; width: 12px; } .dropdown-caret .caret-outer { white-space: nowrap; display: inline-block; left: 0; margin-left: -1px; position: absolute; top: 0; border-bottom: 7px solid rgba(0, 0, 0, 0.2); border-left: 7px solid transparent; border-right: 7px solid transparent; } .dropdown-caret .caret-inner { white-space: nowrap; margin-left: -1px; position: absolute; border-bottom: 6px solid #FFFFFF; border-left: 6px solid transparent; border-right: 6px solid transparent; display: inline-block; left: 1px; top: 1px; } .dropdown-caret.right { left: auto; right: 10px; } .dropdown.dropped .dropdown-menu { display:block; } .dropdown.dropped .dropdown-toggle, .dropdown.dropped .dropdown-toggle .current-language { text-decoration:underline; } .dropdown-menu li:not(.dropdown-caret) { float: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 125px; position: relative; display: block; text-align:left; } .dropdown-menu li.fullwidth:not(.dropdown-caret) { width:100%; text-align:left; } body.rtl .dropdown-menu li:not(.dropdown-caret) { text-align:right; } .dropdown-menu li:not(.dropdown-caret) a { clear: both; color: #333333; cursor: pointer; display: block; float: none; font-size: 12px; font-weight: normal; line-height: 18px; padding: 3px 15px 3px 22px; position: relative; text-shadow: none; white-space: nowrap; text-decoration: none; } .dropdown-menu li:not(.dropdown-caret) a:hover { background-color: #2271A9; background: -moz-linear-gradient(top, #2f7eb6 0px, #2271a9 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,#2f7eb6), color-stop(100%,#2271a9)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #2f7eb6 0px,#2271a9 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #2f7eb6 0px,#2271a9 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #2f7eb6 0px,#2271a9 100%); /* IE10+ */ background: linear-gradient(to bottom, #2f7eb6 0px,#2271a9 100%); /* W3C */ background-repeat: repeat-x; color: #FFFFFF; text-decoration: none; } /* dropdown menu from ellipsis button */ .action-ellipsis-container { position:relative; } .action-ellipsis-container .dropdown-menu { display: block; float: right; left: -6px; top: 24px; right:auto; } .action-ellipsis-container .dropdown-menu, .action-ellipsis-container .dropdown-menu li:not(.dropdown-caret), .action-ellipsis-container .dropdown-menu a { width:auto; } #invite-link { font-weight:bold; } .dropdown-menu li.dropdown-divider { border-bottom: 1px solid #DDDDDD; margin: 5px 1px 6px; padding-top: 1px; width:123px; } .topbar .global-nav { position: relative; width: 100%; height: 46px; background-color: #fff; background-repeat:no-repeat; } .topbar .global-nav:before { display:block; content:' '; position:absolute; width:100px; height:46px; top:0; left:50%; margin-left:-50px; background-position:center -1245px; background-color:#fff; } .topbar .global-nav:not(.show-logo):before { background-position:center -1202px; } .topbar .global-nav.show-logo:before { animation: fadeinlogo 0.4s; animation-timing-function: ease; } @keyframes fadeinlogo { 0% {opacity:0;} 100% {opacity:1;} } .queet-text a:hover { text-decoration:underline; } .queet-text a[rel="nofollow external"] { direction: ltr; unicode-bidi: bidi-override; } #site-notice { color: #EEEEEE; font-size: 30px; font-weight: 300; line-height: 32px; margin: 0; padding: 20px; text-align: left; text-shadow: 0 1px 2px #000000; display:none; font-family: "Helvetica Neue",Arial,sans-serif; } .front-welcome-text { color: #333; font-size: 30px; font-weight: 300; line-height: 32px; margin: 0; padding: 20px 30px 20px 30px; margin:10px 0 20px 0; text-align: left; text-shadow: 0 1px 2px #fff; display:none; font-family: "Helvetica Neue",Arial,sans-serif; background-color:rgba(255,255,255,0.8); position:relative; border-radius:3px; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .front-welcome-text.expanded { padding-bottom:100px; background-color:rgba(255,255,255,1); } .front-welcome-text.expanded .show-full-welcome-text:before { content: "\f106"; } .show-full-welcome-text { width:100%; height:100px; position:absolute; bottom:0; left:0; cursor:pointer; } .show-full-welcome-text:before { content: "\f107"; font-family:FontAwesome; position:absolute; background:blue; text-align:center; display:block; width:100%; height:60px; padding-top:40px; font-size:100px; background: -moz-linear-gradient(top, rgba(255,255,255,0) 0px, rgba(255,255,255,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0px,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(255,255,255,0) 0px,rgba(255,255,255,1) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(255,255,255,0) 0px,rgba(255,255,255,1) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(255,255,255,0) 0px,rgba(255,255,255,1) 100%); /* W3C */ text-shadow:2px 2px 3px rgba(255,255,255,0.9), -2px 2px 3px rgba(255,255,255,0.9), -2px -2px 3px rgba(255,255,255,0.9), 2px -2px 3px rgba(255,255,255,0.9); } .front-welcome-text h1 { color: #333; font-size: 30px; font-weight: 700; margin: 0 0 3px 0; padding:0; line-height: 1.2; } .front-welcome-text sup { font-size:0.8em; cursor:pointer; } .front-welcome-text p { font-size:23px; line-height:29px; } .front-welcome-text p a, .front-welcome-text p a:active, .front-welcome-text p a:visited { color:#333; text-decoration:underline; } .welcome-text-register-link { text-decoration:underline; cursor:pointer; } .front-welcome-text p small.notes { display:inline-block; font-size:12px; line-height:17px; border-top:1px solid #666; padding-top:10px; } body.rtl .front-welcome-text { direction:rtl; text-align:right; font-family:Tahoma,Arial,sans-serif; } #site-notice{ display:block; } #qvitter-notice { text-shadow:none; color:#fff; font-size:11px; padding:10px; display:none; } #qvitter-notice a { color:#fff; opacity:0.5; line-height:17px; display:inline-block; } #qvitter-notice a:hover { opacity:0.8; } .front-welcome-text #federated-tooltip { text-decoration:underline; position:relative; cursor:help; } #federated-tooltip #what-is-federation { background-color: rgba(255, 255, 255, 0.95); border: 1px solid #333333; border-radius: 6px 6px 6px 6px; color: #333333; display: none; font-size: 17px; left: 0; line-height: 22px; padding: 5px 10px; position: absolute; text-shadow: 0 0 3px #CCCCCC; top: 0; width: 300px; z-index:10000; text-decoration:none; } #login-content, .front-signup { font-family: Arial,​sans-serif; font-size: 14px; color: #333333; line-height: 18px; background: #ffffff; /* Old browsers */ background: -moz-linear-gradient(top, #ffffff 0px, #dddddd 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,#ffffff), color-stop(100%,#dddddd)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #ffffff 0px,#dddddd 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #ffffff 0px,#dddddd 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #ffffff 0px,#dddddd 100%); /* IE10+ */ background: linear-gradient(to bottom, #ffffff 0px,#dddddd 100%); /* W3C */ background-clip: border-box; background-origin: padding-box; background-size: auto auto; width: 290px; height: 108px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-right-color: #EEEEEE; border-bottom-color: #CCCCCC; border-left-color: #EEEEEE; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 0px 0px; position:absolute; opacity:0; margin-top:1px; z-index:2000; } .front-signup { margin-top:123px; height: auto; padding-bottom: 53px; } .front-signup input, #login-content input#nickname, #login-content input#password { font-family: Arial,​sans-serif; font-size: 13px; color: #000000; line-height: 15.4333px; direction: ltr; background-color: #FFFFFF; width: 256px; height: 20px; top: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 4px; padding-right: 4px; padding-bottom: 4px; padding-left: 4px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-color: #CCCCCC; border-right-color: #CCCCCC; border-bottom-color: #CCCCCC; border-left-color: #CCCCCC; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; box-shadow: 0 1px 0 #EEEEEE inset, 0 1px 0 #FFFFFF; outline-color: #000000; position: absolute; display: block; border-image-outset: 0 0 0 0; border-image-repeat: stretch stretch; border-image-slice: 100% 100% 100% 100%; border-image-source: none; border-image-width: 1 1 1 1; outline-style: none; outline-width: 0px; transition-delay: 0s; transition-duration: 0.2s; transition-property: background; transition-timing-function: cubic-bezier(0, 0, 1, 1); } #login-content input#password { width:100%; font-size: 13px; color: #000000; line-height: 16.3667px; border-collapse: collapse; border-spacing:0px 0px; box-sizing:border-box; -moz-box-sizing:border-box; display: block; height: 30px; line-height: normal; width: 100%; position: absolute; top: 0; margin: 0; outline: 0 none; padding: 4px; margin-left:-1px; } .front-signup input { position:relative; } .front-signup input:focus, #login-content input#nickname:focus, #login-content input#password:focus { border: 1px solid #56B4EF; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 0 8px rgba(82, 168, 236, 0.6); } .front-signup input.disabled { background-color:#ccc; } table.password-signin { left: 12px; position: absolute; top: 48px; width: 266px; border-collapse: collapse; border-spacing: 0; } .flex-table-primary, .flex-table-secondary { vertical-align: top; } .flex-table-primary { padding-right: 5px; width: 99%; } .flex-table-secondary { max-width: 1%; width: 1%; vertical-align: top; } .placeholding-input { width: 100%; height: 30px; font-size: 13px; overflow: visible; position: relative; float: left; } button#submit-login { font-family: "Helvetica Neue",Arial,​sans-serif; font-size: 13px; font-weight: 700; color: #FFFFFF; line-height: 18px; background: -moz-linear-gradient(top, #33bcef 0%, #019ad2 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#33bcef), color-stop(100%,#019ad2)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #33bcef 0%,#019ad2 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #33bcef 0%,#019ad2 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #33bcef 0%,#019ad2 100%); /* IE10+ */ background: linear-gradient(to bottom, #33bcef 0%,#019ad2 100%); /* W3C */ background-repeat: repeat-x; height: 30px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 5px; padding-right: 10px; padding-bottom: 5px; padding-left: 10px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-color: #057ED0; border-right-color: #057ED0; border-bottom-color: #057ED0; border-left-color: #057ED0; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; box-shadow: #FFFFFF 0px 1px 0px 0px; position: relative; display: block; white-space: nowrap; border-collapse: collapse; border-image-outset: 0 0 0 0; border-image-repeat: stretch stretch; border-image-slice: 100% 100% 100% 100%; border-image-source: none; border-image-width: 1 1 1 1; border-spacing: 0px 0px; cursor: pointer; text-shadow: rgba(0, 0, 0, 0.25) 0px -1px 1px; } button#submit-login:hover { background: -moz-linear-gradient(top, #2daddc 0%, #0271bf 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2daddc), color-stop(100%,#0271bf)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #2daddc 0%,#0271bf 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #2daddc 0%,#0271bf 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #2daddc 0%,#0271bf 100%); /* IE10+ */ background: linear-gradient(to bottom, #2daddc 0%,#0271bf 100%); /* W3C */ background-repeat: repeat-x; border-color:#096eb3; color:#fff; } #remember-forgot { left: 12px; margin: 0; position: absolute; top: 82px; width: 276px; color: #999999; display: inline; font-size: 11px; line-height: 13px; margin: 3px 0 0 0; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6); text-decoration: none; font-family: Arial,sans-serif; } #remember-forgot span#rememberme_label { cursor:pointer; } #remember-forgot a { color: #999999; display: inline; font-size: 11px; line-height: 13px; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6); text-decoration: none; } #remember-forgot a:hover { text-decoration: underline; } #remember-forgot input[type="checkbox"] { height: 13px; margin: -1px 0 0 0; vertical-align: text-top; } #remember-forgot #openid-login { height:20px; width:20px; overflow:hidden; cursor:pointer; display:inline; font-size:0; } #remember-forgot #openid-login:hover { text-decoration:none; } #remember-forgot #openid-login:before { content: " · "; font-size:11px; } #remember-forgot #openid-login:after { font-family:FontAwesome; font-size:12px; content: "\f19b"; } #username-container { color: #333333; left: 12px; position: absolute; top: 12px; width: 276px; height: 30px; } .signup-input-container { position:relative; color: #333333; margin-left: 12px; margin-top:6px; width: 276px; height: 30px; } #password-container { left: 12px; position: absolute; top: 48px; } .front-signup h2 { border-bottom: 1px solid #E2E2E2; box-shadow: 0 1px 0 #FFFFFF; color: #777777; display: block; font-size: 16px; font-weight: 300; margin-top:0; margin-bottom: 12px; padding: 10px 12px; position: relative; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6); font-family: "Helvetica Neue",Arial,sans-serif; } .front-signup h2 strong { color: #333333; font-weight: 500; } .front-signup .signup-btn { font-family: "Helvetica Neue",Arial,sans-serif; border-radius: 4px 4px 4px 4px; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5); color: #333333; cursor: pointer; display: inline-block; font-size: 13px; font-weight: bold; line-height: 18px; background-color: #FD9A0F; background: -moz-linear-gradient(top, rgba(254,233,79,1) 0px, rgba(253,154,15,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,rgba(254,233,79,1)), color-stop(100%,rgba(253,154,15,1))); background: -webkit-linear-gradient(top, rgba(254,233,79,1) 0px,rgba(253,154,15,1) 100%); background: -o-linear-gradient(top, rgba(254,233,79,1) 0px,rgba(253,154,15,1) 100%); background: -ms-linear-gradient(top, rgba(254,233,79,1) 0px,rgba(253,154,15,1) 100%); background: linear-gradient(to bottom, rgba(254,233,79,1) 0px,rgba(253,154,15,1) 100%); border: 1px solid #FFAA22; bottom: 12px; box-shadow: 0 1px 0 #FFFFFF; height: 30px; margin: 0; padding-left: 12px; padding-right: 12px; position: absolute; right: 12px; } .front-signup .signup-btn:hover, .front-signup .signup-btn:focus { background-color: #FD9512; background: -moz-linear-gradient(top, rgba(254,220,77,1) 0px, rgba(253,149,18,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0px,rgba(254,220,77,1)), color-stop(100%,rgba(253,149,18,1))); background: -webkit-linear-gradient(top, rgba(254,220,77,1) 0px,rgba(253,149,18,1) 100%); background: -o-linear-gradient(top, rgba(254,220,77,1) 0px,rgba(253,149,18,1) 100%); background: -ms-linear-gradient(top, rgba(254,220,77,1) 0px,rgba(253,149,18,1) 100%); background: linear-gradient(to bottom, rgba(254,220,77,1) 0px,rgba(253,149,18,1) 100%); border-color: #EC8B11; } .modal-body .front-signup { width:100%; opacity: 1; position: relative; margin-top:10px; border:0 none; background:none; } .modal-body .front-signup #signup-terms-header { text-align:center; margin:20px 0 0 0; cursor:pointer; } .modal-body .front-signup #signup-terms-header:before { content: "\f05a"; display:inline-block; padding:0 6px 0 2px; font-family:FontAwesome; } .modal-body .front-signup #signup-terms-container { padding: 0 20px 20px; font-size:12px; } .modal-body .front-signup .signup-input-container { margin:6px auto 0 auto; width:276px; } .modal-body .front-signup #atsign, .modal-body .front-signup .fieldhelp { font-size: 16px; height: 20px; left: -20px; line-height: 20px; position: absolute; top: 3px; width: 20px; } .modal-body .front-signup .fieldhelp { color: #AAAAAA; font-size: 14px; left: 0; margin-left: 276px; padding-left: 5px; right: 3px; top: 6px; width: auto; } .modal-body .front-signup .signup-input-container input.invalid, .modal-body .front-signup .signup-input-container input.nickname-taken { background-color:pink; } #other-servers-link { height:150px; position: absolute; bottom:-170px; padding:10px; text-shadow:1px 1px 3px rgba(0, 0, 0, 0.6); color:rgba(255,255,255,0.8); } #page-container { width:890px; padding:17px 14px 0 14px; background-color:rgba(0,0,0,0.2); margin-left:-459px; opacity:0; } #footer { width:100%; clear:both; height:100px; } #footer-spinner-container { float: right; width:590px; position:relative; text-align: center; } body.rtl #footer-spinner-container { float: left; } #user-container { width:290px; font-size: 12px; text-shadow: 0 1px 0 #FFFFFF; line-height: 16px; position: relative; float:left; padding-top: 1px; } #user-header, #user-body, #user-footer { opacity:0; } #user-header { border:0 none; border-radius: 6px 6px 0 0; } #user-body { border-top:0 none; border-bottom:0 none; } #user-footer { border-top:0 none; border-radius: 0 0 6px 6px; margin-bottom:10px; } .menu-container { border: 1px solid rgba(0, 0, 0, 0.1); text-shadow: 0 1px 0 #FFFFFF; background-clip: padding-box; border-radius: 6px; line-height: 16px; margin-bottom: 10px; overflow:hidden; opacity:0; } .menu-container a:first-child { border-top-left-radius: 6px; border-top-right-radius: 6px; } .menu-container a:last-child { border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; } .menu-container a { display:block; cursor:pointer; background-color: #FFFFFF; text-decoration: none; padding: 8px 12px; position: relative; background-color: #F9F9F9; border-top: 1px solid #E8E8E8; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25) inset; font-size: 14px; } .menu-container a:first-child { border-top:0 none; } .menu-container a .chev-right { background-position: 0 -140px; background-repeat: no-repeat; display: block; height: 15px; position: absolute; right: 10px; top: 9px; width: 12px; } .menu-container a:hover { background-color:#fff; } .menu-container a:hover .chev-right { background-position: 0 -160px; } .menu-container a.current { background-color:#fff; font-weight:bold; color:#333; outline:none; } .menu-container a.my-timeline { display:none; } .menu-container a.current .chev-right { background-position: 0 -160px; } #history-container a:hover .chev-right { background-position:-20px -508px; } #history-container a:hover .chev-right:hover { background-position:-40px -508px; } .menu-container a.notifications { line-height:32px; padding:0 12px; position:relative; } #unseen-notifications { display:block; position:absolute; right:0px; top:0; width:24px; height:24px; line-height:24px; border-radius:12px; color:#fff; text-shadow:none; margin:4px 5px; z-index:10; display:none; text-align:center; font-weight:normal; } #history-container { display:none; } #settings-container { padding:10px 10px 150px 10px; } #settings-container > div { padding: 10px 0; } #settings-container label { float: left; padding-top: 5px; text-align: right; width: 120px; color: #333333; cursor: pointer; display: block; margin-bottom: 5px; padding-right:10px; font-size: 13px; line-height: 20px; font-family: "Helvetica Neue",Arial,sans-serif; } #settings-container input { font-family: "Helvetica Neue",Arial,sans-serif; font-size: 13px; line-height: 20px; background-color: #FFFFFF; border: 1px solid #CCCCCC; border-radius: 3px 3px 3px 3px; display: inline-block; outline: 0 none; height:26px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 1px 0 rgba(255, 255, 255, 0.075); transition: background 0.2s linear 0s; padding-right: 5px; } #settings-container #moresettings { cursor: pointer; display: inline-block; font-size: 13px; margin-left: 130px; margin-top: 10px; text-align: left; } #settings-container #moresettings:hover { text-decoration:underline; } #feed { display:none; font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 14px; color: #333333; line-height: 18px; width: 590px; border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; float: right; } #feed-header { font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 14px; color: #333333; line-height: 18px; background-clip: padding-box; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 0px; border-left-width: 1px; border-top-color: rgba(0, 0, 0,0.1); border-right-color: rgba(0,0,0,0.1); border-bottom-color: rgba(0, 0, 0, 0.1); border-left-color: rgba(0, 0, 0, 0.1); border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; border-image-outset: 0 0 0 0; border-image-repeat: stretch stretch; border-image-slice: 100% 100% 100% 100%; border-image-source: none; border-image-width: 1 1 1 1: } #feed-header-inner { position:relative; font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 14px; color: #333333; line-height: 18px; background-color: #FFFFFF; padding-top: 12px; padding-right: 12px; padding-bottom: 12px; padding-left: 12px; border-bottom-width: 1px; border-bottom-color: #E8E8E8; border-bottom-style: solid; border-top-left-radius: 6px; border-top-right-radius: 6px; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; min-height: 20px; } #feed-header-inner h2 { font-family: "Helvetica Neue",​Arial,​sans-serif; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; text-rendering: optimizelegibility; color: #66757F; font-size: 22px; font-weight: 300; line-height: 22px; } .queet-streams { bottom: 0; color: #999999; display:inline-block; font-size: 12px; font-weight: normal; margin: 3px 6px; } .queet-streams a { text-decoration: none; cursor:pointer; } .queet-streams a:hover { text-decoration: underline; } #new-queets-bar-container { height:40px; overflow:hidden; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; border-right-width: 1px; border-left-width: 1px; border-right-color: rgba(0, 0, 0, 0.1); border-left-color: rgba(0, 0, 0, 0.1); border-right-style: solid; border-left-style: solid; margin-top:-1px; } #new-queets-bar-container.hidden { height:0; margin-top:0; } #new-queets-bar { box-shadow: 0 3px 8px rgba(0, 0, 0, 0.05) inset; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.6); z-index: 2; background-color: #F5F5F5; border-bottom: 1px solid #DDDDDD; border-top: 1px solid #DDDDDD; cursor: pointer; display: block; font-size: 13px; font-weight: normal; padding: 10px 1px; position: relative; text-align: center; height:18px; } #new-queets-bar:hover { background-color: #eee; } .stream-item { font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 14px; color: #333333; line-height: 18px; background-color: #FFFFFF; background-image: none; background-repeat: repeat; background-position: 0% 0%; background-attachment: scroll; background-clip: padding-box; background-origin: padding-box; background-size: auto auto; border-right-width: 1px; border-left-width: 1px; border-right-color: rgba(0, 0, 0, 0.1); border-left-color: rgba(0, 0, 0, 0.1); border-right-style: solid; border-left-style: solid; list-style-image: none; list-style-position: outside; list-style-type: none; -webkit-transition: opacity 0.1s ease, height 0s linear, margin 0.05s linear; -moz-transition: opacity 0.1s ease, height 0s linear, margin 0.05s linear; -o-transition: opacity 0.1s ease, height 0s linear, margin 0.05s linear; transition: opacity 0.1s ease, height 0s linear, margin 0.05s linear; height:auto; /* position:relative; */ } .stream-item.collapsing { overflow:hidden; } .stream-item.hidden { display:none; } .stream-item.expanded > div.last-visible, .stream-item.expanded > div.last-visible .queet, .stream-item.expanded > div.last-visible .inline-reply-queetbox { border-radius: 0 0 6px 6px; } .stream-item.conversation { background-color:#F6F6F6; border:0 none; border-top:1px solid #F6F6F6; opacity:0.5; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; } .stream-item.conversation > .queet { background-color:#F6F6F6; } .stream-item.conversation.visible { opacity:1; } .stream-item.conversation.hidden-conversation { display:none; overflow:hidden; } .stream-item.conversation .queet:hover { background-color:#F6F6F6; } .stream-item.notification .not-seen { position:absolute; left:-5px; top:50%; margin-top:-5px; width:10px; height:10px; border-radius:6px; z-index:10; } .stream-item.notification.follow .queet, .stream-item.notification.repeat .queet, .stream-item.notification.like .queet { min-height:37px; cursor:default; } .stream-item.notification.follow .queet .queet-content, .stream-item.notification.repeat .queet .queet-content, .stream-item.notification.like .queet .queet-content { cursor:default; } .stream-item.notification.follow:hover, .stream-item.notification.repeat:hover, .stream-item.notification.like:hover { background-color:#fff; } .stream-item.notification.follow a.account-group img.avatar, .stream-item.notification.repeat a.account-group img.avatar, .stream-item.notification.like a.account-group img.avatar { width:24px; height:24px; left:36px; top:4px; } .stream-item.notification.repeat .dogear, .stream-item.notification.like .dogear { background-repeat: no-repeat; height: 24px; position: absolute; right: 0; top: 0; width: 24px; display: block; height: 24px; left: 36px; top: 7px; width: 24px; z-index: 10; } .stream-item.notification.like .dogear { background-position: -115px -1075px; } .stream-item.notification.repeat .dogear { background-position: -70px -1072px; } .stream-item.notification .small-grey-notice, .stream-item.notification .small-grey-notice a { color:#999; } .stream-item.notification .small-grey-notice a:hover { color:#333; text-decoration:underline; } .stream-item.notification .stream-item-header { color:#333; } .show-full-conversation { bottom: 3px; color: #777; font-family: "Helvetica Neue",Arial,sans-serif; font-size: 12px; line-height: 12px; position: absolute; right: 0; } .show-full-conversation:hover { text-decoration:underline; } .queet { font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 14px; color: #333333; line-height: 18px; position: relative; cursor: pointer; list-style-image: none; list-style-position: outside; list-style-type: none; min-height: 85px; } .stream-item.user .queet { cursor: auto; } .stream-item:not(.expanded):hover { background-color:#f5f5f5; } .stream-item .queet { border-bottom:1px solid #ddd; } .stream-item.conversation .queet { border-bottom:1px solid #ddd; } .stream-item.conversation:last-child .queet { border-bottom:0 none; } .stream-item.expanded:not(.conversation) > .queet { border-bottom:0 none; } .stream-item.expanded > div:last-child .inline-reply-queetbox { border-bottom:0 none; } .stream-item.next-expanded:not(.conversation) { border-bottom-left-radius:6px; border-bottom-right-radius:6px; } .stream-item.next-expanded:not(.conversation) > .queet { border-bottom:0 none; } .stream-item.expanded:not(.conversation) + .stream-item:not(.conversation) { border-top-left-radius:6px; border-top-right-radius:6px; } .stream-item.expanded.collapsing > .queet { background-color:#fff; -webkit-transition: margin-top 5s linear; -moz-transition: margin-top 5s linear; -o-transition: margin-top 5s linear; transition: margin-top 5s linear; } .stream-item.expanded .stream-item:last-child .queet { border-bottom:0 none; } .stream-item.expanded:not(.conversation) > div:last-child, .stream-item.expanded:not(.conversation) > div:last-child .inline-reply-queetbox, .stream-item.expanded:not(.conversation) > div:last-child .queet { border-radius:0 0 6px 6px; } .expanded-content { -webkit-transition: height 0s linear; -moz-transition: height 0s linear; -o-transition: height 0s linear; transition: height 0s linear; overflow:hidden; } body.rtl .queet.rtl .expanded-content { direction:rtl; } .stream-item.expanded div:first-child { border-top-left-radius:6px; border-top-right-radius:6px; } .stream-item.expanded .stream-item.conversation .queet:hover { background-color:#F6F6F6; } .queet:hover .stream-item-expand { } .queet:hover .stream-item-expand:hover { text-decoration:underline; } .stream-item.activity .queet { min-height:21px; } .stream-item.activity .stream-item-header { display:none; } .stream-item.activity .queet-content { margin-left:0; } .stream-item.activity .queet-text, .stream-item.activity .queet-text a { font-size: 12px; font-style: italic; margin:0; text-align:center; width: 565px; color:#999999; } .queet .queet-thumbs { -webkit-transition: max-height 0s linear; -moz-transition: max-height 0s linear; -o-transition: max-height 0s linear; transition: max-height 0s linear; overflow:hidden; margin-top:10px; position:relative; } .queet .queet-thumbs:empty { margin:0; } .queet .queet-thumbs.hide-thumbs { display:none; } .queet .attachment-thumb { opacity:0; width:100%; padding:0; margin:0; display:block; } .queet .thumb-container { display: inline-block; overflow: hidden; position: relative; background-size:cover; background-repeat:no-repeat; background-position: center; padding:0; margin:0; min-height:250px; } .queet .thumb-container.no-cover { background-size:100% auto; } .queet .queet-thumbs.thumb-num-1 .thumb-container.youtube { height:250px; } .stream-item:not(.expanded) .queet .queet-thumbs.thumb-num-1 .thumb-container.play-button:before, .queet .queet-thumbs:not(.thumb-num-1) .thumb-container.play-button:before, .modal-content .queet .thumb-container.play-button:before { display:block; position:absolute; width:100%; height:100%; z-index:1; content: "\f01d"; font-family:FontAwesome; line-height:250px; text-align:center; font-size:100px; color:rgba(255,255,255,0.65); } .queet .thumb-container.play-button img { z-index:2; position:relative; } .queet .queet-thumbs.thumb-num-1 .thumb-container.no-cover .attachment-thumb { min-height:0; } .queet .thumb-container:before { border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 10px; box-sizing: border-box; content: " "; display: block; position: absolute; width:100%; height:100%; } .queet .queet-thumbs.thumb-num-1 .thumb-container.no-cover { width:100%; min-height:0; } .queet .queet-thumbs.thumb-num-1 .thumb-container { width:100%; } .queet .queet-thumbs.thumb-num-2 .thumb-container { width:49.5%; margin-right:1%; } .queet .queet-thumbs.thumb-num-3 .thumb-container { width:32.33%; margin-right:1%; } .queet .queet-thumbs.thumb-num-4 .thumb-container { width:24%; margin-right:1%; } .queet .queet-thumbs.thumb-num-5 .thumb-container { width:19%; margin-right:1%; } .queet .queet-thumbs.thumb-num-6 .thumb-container { width:32.33%; margin-right:1%; } .queet .queet-thumbs.thumb-num-7 .thumb-container { width:24%; margin-right:1%; } .queet .queet-thumbs.thumb-num-7 .thumb-container:first-child, .queet .queet-thumbs.thumb-num-7 .thumb-container:nth-child(2), .queet .queet-thumbs.thumb-num-7 .thumb-container:nth-child(3) { width:32.33%; } .queet .queet-thumbs.thumb-num-8 .thumb-container { width:24%; margin-right:1%; } .queet .queet-thumbs.thumb-num-9 .thumb-container { width:19%; margin-right:1%; } .queet .queet-thumbs.thumb-num-9 .thumb-container:first-child, .queet .queet-thumbs.thumb-num-9 .thumb-container:nth-child(2), .queet .queet-thumbs.thumb-num-9 .thumb-container:nth-child(3), .queet .queet-thumbs.thumb-num-9 .thumb-container:nth-child(4) { width:24%; } .queet .queet-thumbs.thumb-num-10 .thumb-container { width:19%; margin-right:1%; } .queet .queet-thumbs.thumb-num-11 .thumb-container { width:24%; margin-right:1%; } .queet .queet-thumbs.thumb-num-11 .thumb-container:first-child, .queet .queet-thumbs.thumb-num-11 .thumb-container:nth-child(2), .queet .queet-thumbs.thumb-num-11 .thumb-container:nth-child(3) { width:32.33%; } .queet .queet-thumbs.thumb-num-12 .thumb-container { width:24%; margin-right:1%; } .queet .queet-thumbs.thumb-num-13 .thumb-container { width:24%; margin-right:1%; } .queet .queet-thumbs.thumb-num-13 .thumb-container:nth-child(9), .queet .queet-thumbs.thumb-num-13 .thumb-container:nth-child(10), .queet .queet-thumbs.thumb-num-13 .thumb-container:nth-child(11), .queet .queet-thumbs.thumb-num-13 .thumb-container:nth-child(12), .queet .queet-thumbs.thumb-num-13 .thumb-container:nth-child(13) { width:19%; } .queet .queet-thumbs.thumb-num-14 .thumb-container { width:19%; margin-right:1%; } .queet .queet-thumbs.thumb-num-14 .thumb-container:first-child, .queet .queet-thumbs.thumb-num-14 .thumb-container:nth-child(2), .queet .queet-thumbs.thumb-num-14 .thumb-container:nth-child(3), .queet .queet-thumbs.thumb-num-14 .thumb-container:nth-child(4) { width:24%; } .queet .queet-thumbs.thumb-num-15 .thumb-container, .queet .queet-thumbs.thumb-num-more-than-fifteen .thumb-container { width:19%; margin-right:1%; } .queet .queet-thumbs .thumb-container:last-child { margin-right:0 } .queet .queet-thumbs .thumb-container { border-radius: 10px; } .stream-item.expanded > .queet .queet-thumbs.thumb-num-1 .thumb-container, .stream-item.expanded > .queet .queet-thumbs.thumb-num-1 .thumb-container:before { border-radius: 0; } .queet .queet-thumbs.thumb-num-1 .thumb-container, .queet .queet-thumbs.thumb-num-2 .thumb-container, .queet .queet-thumbs.thumb-num-3 .thumb-container, .queet .queet-thumbs.thumb-num-4 .thumb-container, .queet .queet-thumbs.thumb-num-5 .thumb-container, .queet .queet-thumbs.thumb-num-1 .attachment-thumb, .queet .queet-thumbs.thumb-num-2 .attachment-thumb, .queet .queet-thumbs.thumb-num-3 .attachment-thumb, .queet .queet-thumbs.thumb-num-4 .attachment-thumb, .queet .queet-thumbs.thumb-num-5 .attachment-thumb { max-height: 250px; min-height: 250px; } .stream-item.expanded > .queet .queet-thumbs.thumb-num-1 .thumb-container, .stream-item.expanded > .queet .queet-thumbs.thumb-num-1 .attachment-thumb { max-height: none; } .queet .queet-thumbs.thumb-num-6 .thumb-container, .queet .queet-thumbs.thumb-num-7 .thumb-container, .queet .queet-thumbs.thumb-num-8 .thumb-container, .queet .queet-thumbs.thumb-num-9 .thumb-container, .queet .queet-thumbs.thumb-num-10 .thumb-container, .queet .queet-thumbs.thumb-num-6 .attachment-thumb, .queet .queet-thumbs.thumb-num-7 .attachment-thumb, .queet .queet-thumbs.thumb-num-8 .attachment-thumb, .queet .queet-thumbs.thumb-num-9 .attachment-thumb, .queet .queet-thumbs.thumb-num-10 .attachment-thumb { max-height: 125px; min-height: 125px; } .queet .queet-thumbs.thumb-num-6 .thumb-container.play-button:before, .queet .queet-thumbs.thumb-num-7 .thumb-container.play-button:before, .queet .queet-thumbs.thumb-num-8 .thumb-container.play-button:before, .queet .queet-thumbs.thumb-num-9 .thumb-container.play-button:before, .queet .queet-thumbs.thumb-num-10 .thumb-container.play-button:before{ line-height: 125px; font-size:70px; } .queet .queet-thumbs.thumb-num-11 .thumb-container, .queet .queet-thumbs.thumb-num-12 .thumb-container, .queet .queet-thumbs.thumb-num-13 .thumb-container, .queet .queet-thumbs.thumb-num-14 .thumb-container, .queet .queet-thumbs.thumb-num-15 .thumb-container, .queet .queet-thumbs.thumb-num-more-than-fifteen .thumb-container, .queet .queet-thumbs.thumb-num-11 .attachment-thumb, .queet .queet-thumbs.thumb-num-12 .attachment-thumb, .queet .queet-thumbs.thumb-num-13 .attachment-thumb, .queet .queet-thumbs.thumb-num-14 .attachment-thumb, .queet .queet-thumbs.thumb-num-15 .attachment-thumb, .queet .queet-thumbs.thumb-num-more-than-fifteen .attachment-thumb { max-height: 83px; min-height: 83px; } .queet .queet-thumbs.thumb-num-11 .thumb-container.play-button:before, .queet .queet-thumbs.thumb-num-12 .thumb-container.play-button:before, .queet .queet-thumbs.thumb-num-13 .thumb-container.play-button:before, .queet .queet-thumbs.thumb-num-14 .thumb-container.play-button:before, .queet .queet-thumbs.thumb-num-15 .thumb-container.play-button:before, .queet .queet-thumbs.thumb-num-more-than-fifteen .thumb-container.play-button:before { line-height: 83px; font-size:50px; } .stream-item.collapsing > .queet .thumb-container { -webkit-transition: max-height 0s linear; -moz-transition: max-height 0s linear; -o-transition: max-height 0s linear; transition: max-height 0s linear; } .stream-item.activity .created-at a { display:none; } .stream-item.activity.expanded .created-at a { font-size: 0.9em; display:inline; } .view-more-container-top { border-top: 0 none; border-top-left-radius: 6px; border-top-right-radius: 6px; background: none repeat scroll 0 0 #F6F6F6; cursor:pointer; border-bottom: 1px solid #DDDDDD; } .view-more-container-bottom { border-bottom: 0 none; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background: none repeat scroll 0 0 #F6F6F6; cursor:pointer; } body.rtl .view-more-container-top { direction:rtl; } body.rtl .view-more-container-bottom { direction:rtl; } .view-more-container-top a, .view-more-container-bottom a { display:block; font-size: 13px; padding: 14px 12px 14px 72px; } .view-more-container-top:hover a, .view-more-container-bottom:hover a { text-decoration:underline; } .queet-content { margin-left: 58px; cursor:pointer; padding-top: 9px; padding-right: 12px; padding-bottom: 9px; padding-left: 12px; } .stream-item.user .queet-content { cursor: auto; } .stream-item-header { color:#999; } .stream-item-header a.account-group:hover .name { text-decoration:underline; } .stream-item-header .avatar { line-height: 18px; width: 48px; height: 48px; margin-top: 3px; left:12px; border:0 none; border-radius: 6px; position:absolute; cursor: pointer; list-style-image: none; list-style-position: outside; list-style-type: none; } .stream-item:not(.like):not(.repeat):not(.follow) .stream-item-header .name:before { content:" "; position:absolute; display:block; width: 48px; height: 48px; margin-top: 3px; left:12px; border:1px solid rgba(0, 0, 0, 0.1); box-sizing:border-box; border-radius: 6px; } .stream-item:not(.like):not(.repeat):not(.follow) .queet.rtl .stream-item-header .name:before { right:12px; left:auto; } .modal-container .modal-body .stream-item-header .avatar { left:10px; } .modal-container .modal-footer .stream-item-header .avatar, .modal-container .modal-footer .stream-item-header .name:before { left:0px; } .modal-container .modal-footer .queet > .context { margin-bottom: 0; margin-top: -10px; padding-left: 59px; } .modal-container .modal-footer .queet > .context .with-icn .badge-requeeted { left: 32px; } #popup-external-profile .profile-card, #popup-external-profile .profile-card .profile-banner-footer, #popup-local-profile .profile-card, #popup-local-profile .profile-card .profile-banner-footer { border-radius:0; } #popup-external-profile ul.queet-actions, #popup-local-profile ul.queet-actions { display:none; } #popup-external-profile .queet, #popup-external-profile .queet-content, #popup-external-profile .queet-text #popup-local-profile .queet, #popup-local-profile .queet-content, #popup-local-profile .queet-text { cursor:auto; border-bottom:0 none; } #popup-external-profile .stream-item .stream-item-header .name:before, #popup-local-profile .stream-item .stream-item-header .name:before { left:10px; } #popup-external-profile .go-to-external-profile, #popup-local-profile .go-to-local-profile { font-weight:bold; } .stream-item-header .name { font-family: "Helvetica Neue",Arial,sans-serif; font-size: 14px; font-weight: 700; color: #333333; line-height: 18px; } .stream-item-header .screen-name, .stream-item-header .reply-to, .stream-item-header .in-groups, .stream-item-header .h-card { font-family: "Helvetica Neue",Arial,sans-serif; font-size: 13px; color: #999999; line-height: 18px; direction: ltr; font-style:normal; } .stream-item-header .h-card:hover { text-decoration:underline; } .stream-item-header .addressees span:first-child:before { content: "\f105"; display:inline-block; padding:0 6px 0 2px; font-size:12px; font-family:FontAwesome; font-style:normal; } .stream-item-header .created-at { color: #BBBBBB; font-family: "Helvetica Neue",Arial,sans-serif; font-size: 13px; line-height: 18px; } .stream-item-header .created-at a { font-family:"Helvetica Neue",Arial,sans-serif; font-size: 13px; color: #999999; text-decoration: none; line-height: 18px; } .stream-item-header .created-at a:hover { text-decoration: underline; } .stream-item-header .created-at:before { content:" · "; } .queet-text { font-family:"Helvetica Neue",Arial,sans-serif; font-size: 14px; color: #333333; line-height: 18px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; cursor: pointer; list-style-image: none; list-style-position: outside; list-style-type: none; word-wrap: break-word; max-height:400px; overflow-y:auto; padding: 1px 0; } .stream-item.user .queet-text { cursor: auto; } .stream-item.expanded .queet-text { max-height:none; } .queet-text img { max-width:100%; } .stream-item .queet-text p { margin:0;padding:0; } .queet-text span.attachment.more { } .queet-text span.attachment.more:hover { text-decoration:underline; } .stream-item.user .queet-content { margin-right:150px; } .stream-item.user .user-actions { float:right; padding:9px 12px; } body.rtl .stream-item.user .user-actions { float:left; } body.rtl .stream-item.user .queet-content { margin-left:150px; margin-right:58px; } body.rtl .stream-item.user .queet-text, body.rtl .stream-item.user .queet-content .stream-item-header { text-align:right; } ul.queet-actions { bottom: 0; display: block; font-family: "Helvetica Neue",Arial,sans-serif; font-size: 12px; line-height: 18px; list-style: outside none none; margin: 5px 0 0; padding: 0; position: relative; } .queet.rtl ul.queet-actions { right:auto; left:1px; padding: 0 5px 0 0; direction: rtl; } ul.queet-actions a { color:#ddd; } .queet:hover ul.queet-actions > li > a { color:#999; } .stream-item.expanded > .queet ul.queet-actions { display: block; } .stream-item.expanded > .stream-item.expanded .queet ul.queet-actions { display: block; } ul.queet-actions li { display:inline; } ul.queet-actions li .icon { background-repeat: no-repeat; display: inline-block; vertical-align: text-top; height: 25px; line-height:25px; width:25px; text-align:center; margin-right:31px; font-size:17px; } .queet.rtl ul.queet-actions li .icon { margin-right:0; margin-left:31px; } ul.queet-actions li.action-rt-container .with-icn.done .icon:before { color: #609928; } ul.queet-actions li.action-rt-container .with-icn .icon:not(.is-mine):hover:before { color: #609928; } ul.queet-actions li.action-fav-container .with-icn.done .icon:before { color: #ffac33; } .stream-item:not(.temp-post) ul.queet-actions li.action-fav-container .with-icn .icon:hover:before { color: #ffac33; } .stream-item:not(.temp-post) ul.queet-actions li.action-rt-container .with-icn .icon:not(.is-mine):hover:before { color: #609928; } ul.queet-actions li .icon:before { font-family:FontAwesome; font-size:inherit; color:rgba(0,0,0,0.15); height: 25px; line-height:25px; width:25px; text-align:center; display:block; } .stream-item.temp-post ul.queet-actions li .icon:before { color:rgba(0,0,0,0.05); } ul.queet-actions li .icon.sm-fav:before { transition: font-size 0.2s cubic-bezier(0, 0, 1, 1) 0s; } ul.queet-actions li .icon.sm-fav.pulse:before { animation: starpulse 0.4s; animation-timing-function: ease-in-out; } @keyframes starpulse { 0% {font-size: 17px;} 50% {font-size: 25px;} 100% {font-size: 17px;} } ul.queet-actions li .icon.sm-rt:before { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; transition-property: transform; } ul.queet-actions li .icon.sm-rt.rotate:before { -webkit-transform:rotate(360deg); -moz-transform:rotate(360deg); -o-transform:rotate(360deg); transform:rotate(360deg); } ul.queet-actions li .icon.sm-reply:before { content: "\f112"; } ul.queet-actions li .icon.sm-rt:before { content: "\f079"; } ul.queet-actions li .icon.sm-trash:before { content: "\f1f8"; } ul.queet-actions li .icon.sm-fav:before { content: "\f005"; } ul.queet-actions li .icon.sm-ellipsis:before { content: "\f141"; font-size: 22px; line-height: 28px; } ul.queet-actions li .icon.is-mine:before { opacity:0.4; cursor:default; } .queet.rtl .queet-content { margin-left:0; margin-right:58px; } .queet.rtl .account-group > .avatar { left:auto; right:12px; } .modal-container .queet.rtl .account-group > .avatar { right:0; } .queet.rtl .stream-item-header { direction: rtl; text-align: right; } .queet.rtl .account-group > .name { direction: rtl; text-align:right; } .queet.rtl .account-group > .screen-name { direction: ltr; display: inline-block; } .queet.rtl .created-at { direction: rtl; display: inline-block; } .queet.rtl .queet-text { text-align:right; direction: rtl; } .queet.rtl .stream-item-footer { text-align: right; } .queet.rtl .client-and-actions { text-align: right; } .queet.rtl .show-full-conversation { float:left; } .queet.rtl .inline-reply-queetbox { padding:10px 70px 10px 12px; } .queet-box-template a{ unicode-bidi:bidi-override; direction:ltr; } .stream-item-footer { padding-top:1px; position:relative; } .queet > .context { font-size: 14px; margin-bottom: -6px; min-height: 17px; padding-left: 69px; } .queet > .context .with-icn { display: block; font-size: 12px; padding-top: 6px; } .queet > .context .with-icn .badge-requeeted { width:17px; height:17px; background-color:#609928; display:block; position:absolute; border-radius:3px; left:42px; top:7px; } .queet > .context .with-icn .badge-requeeted:before { font-family:FontAwesome; content: "\f079"; font-style:normal; color:#fff; font-weight:normal; font-size:12px; width:17px; height:17px; display:block; position:absolute; line-height:17px; text-align:center; } .queet > .context .with-icn .requeet-text, .queet > .context .with-icn .requeet-text a, .queet > .context .with-icn .requeet-text a b { font-size:12px; color:#999; font-weight:normal; } .queet > .context .with-icn .requeet-text a:hover b { text-decoration:underline; color:#555; } .queet > .context .with-icn .requeet-text a:after { content:", "; } .queet > .context .with-icn .requeet-text a:last-child:after { content:""; } .ostatus-link { background-position: 7px -182px; display: block; height: 30px; line-height: 30px; opacity: 0.2 !important; position: absolute; right: 0; text-align: center; top: 0; width: 30px; outline:none; } .queet.rtl .ostatus-link { right:auto; left:0; } .ostatus-link:hover { background-position: 7px -212px; opacity:1 !important; } .stream-item.user .ostatus-link { background-position: 5px -188px; display: inline-block; height: 17px; line-height: 14px; position: relative; right: auto; top: auto; vertical-align: top; } .stream-item.user .ostatus-link:hover { background-position: 5px -218px; } .stream-item.expanded:not(.conversation) { border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 6px; margin:8px 0; } .stream-item.expanded .stream-item-expand:hover { text-decoration:underline; } .stream-item.expanded .stream-item.expanded { margin:0 0; border-bottom:0 none; border-left:0 none; border-right:0 none; } .stream-item .media { margin-top:10px; } .stream-item .media img, .stream-item .media video { max-width: 100%; } ul.stats { font-family: "Helvetica Neue",Arial,sans-serif; font-size: 18px; font-weight: 500; line-height: 20px; margin-top: 10px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top: 1px solid #E8E8E8; border-bottom: 1px solid #E8E8E8; overflow-x: hidden; overflow-y: hidden; cursor: pointer; list-style-image: none; list-style-position: outside; list-style-type: none; overflow: hidden; } .stream-item ul.stats { width: 1000px; } .queet.rtl ul.stats { text-align:right; } ul.stats li { display:block; float:left; padding: 4px 10px 0 0; min-width:82px; box-sizing:border-box; } .profile-card ul.stats li { padding-top: 7px; } .queet.rtl ul.stats li { float:right; } ul.stats a { width: auto; display:block; text-transform: uppercase; color: #999999; font-size: 10px; letter-spacing: 0.2px; line-height: 18px; font-weight: normal; } .queet.rtl ul.stats a{ border-right: 1px solid #E8E8E8; border-left: 0 none; } ul.stats a strong { font-size: 18px; font-weight:500; line-height: 16px; display: block; } ul.stats .avatar-row { overflow: hidden; border-left: 1px solid #E8E8E8; padding: 12px; } ul.stats .avatar-row a { padding: 11px 0; border-left: medium none; display:inline; } .queet.rtl ul.stats .avatar-row a { border-right: 0 none; padding-right: 0; border-left: 0 none; padding-left: 0; } .queet.rtl ul.stats .avatar-row a:last-child { border-right: 1px solid #E8E8E8; padding-right: 12px; border-left: 0 none; padding-left: 0; } ul.stats .avatar-row .avatar { float: left; margin-right: 5px; } .queet.rtl ul.stats .avatar-row .avatar { float: left; margin-left: 5px; margin-right: 0; } .avatar.size24 { border-radius: 3px 3px 3px 3px; height: 24px; width: 24px; } .avatar.size30 { border-radius: 3px 3px 3px 3px; height: 30px; width: 30px; margin:0 1px; } ul.stats .avatar-row .avatar { -moz-force-broken-image-icon: 1; } .client-and-actions { clear: both; margin-top: 10px; overflow: hidden; } .client-and-actions .metadata { line-height: 24px; overflow: hidden; color: #999999; font-size: 12px; line-height: 24px; } .longdate a, .longdate a:visited { color:#999999; } .permalink-link { color: #999999 !important; } .permalink-link:hover { text-decoration:underline; } .inline-reply-queetbox { padding: 10px 12px 10px 70px; position: relative; background-color:transparent; border-top:1px solid #DDDDDD; } .stream-item.expanded .stream-item.first-visible-after-parent { border-top:1px solid #DDDDDD; } .reply-avatar { border-color: #ff00ae; border-radius: 4px; border-style: none; border-width: 0; height: 30px; left: 27px; position: absolute; top: 11px; width: 30px; } .inline-reply-caret:before { border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 4px; box-sizing: border-box; content: " "; display: block; height: 30px; left: -15px; position: absolute; top: 21px; width: 30px; z-index: 10; } .queet.rtl .reply-avatar { left:auto; right:27px; } span.inline-reply-caret { border-left-color: rgba(0, 0, 0, 0) !important; border-right-color: rgba(0, 0, 0, 0) !important; border-width: 0 10px 10px; left: 34px; top: -10px; border-style: solid; font-size: 0; position: absolute; } .queet.rtl span.inline-reply-caret { left:auto; right:34px; } .queet.rtl span.inline-reply-caret:before { left:-13px; } .modal-container span.inline-reply-caret { display:none; } span.inline-reply-caret .caret-inner { border-left-color: rgba(0, 0, 0, 0) !important; border-right-color: rgba(0, 0, 0, 0) !important; border-width: 0 8px 8px; left: -8px; top: 2px; border-style: solid; font-size: 0; position: absolute; } .inline-reply-queetbox .queet-box-syntax { white-space:nowrap; overflow: hidden; text-overflow: ellipsis; } .inline-reply-queetbox .queet-box-syntax[contenteditable="true"] { white-space:normal; z-index:101; position:relative; } .inline-reply-queetbox .queet-box-syntax, .inline-reply-queetbox .syntax-two { cursor:text; } .inline-reply-queetbox .queet-box-syntax, .inline-reply-queetbox .queet-box-syntax[contenteditable="true"], .inline-reply-queetbox .syntax-middle, .inline-reply-queetbox .syntax-two { width:488px; } .inline-reply-queetbox .syntax-middle, .inline-reply-queetbox .syntax-two { left:70px; } .queet.rtl .inline-reply-queetbox .queet-box-syntax { direction: rtl; } .queet.rtl .inline-reply-queetbox .syntax-middle, .queet.rtl .inline-reply-queetbox .syntax-two { left:12px; direction: rtl; } .inline-reply-queetbox .mentions-suggestions { left: 71px; width: 504px; } .modal-body .inline-reply-queetbox .mentions-suggestions { left: 13px; } #user-header { border-top-left-radius: 6px; border-top-right-radius: 6px; line-height: 16px; padding: 12px; cursor: pointer; font-size: 12px; text-shadow: 0 1px 0 #FFFFFF; line-height: 16px; font-family: "Helvetica Neue",Arial,sans-serif; color: #333333; font-size: 14px; line-height: 18px; height:102px; background-repeat: no-repeat; background-size: cover; } #user-header .profile-header-inner-overlay { height:97px; background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0); position: absolute; top: 30px; width:100%; left:0; z-index:100; } #user-name, #user-screen-name { font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 14px; font-weight: 700; color: #fff; line-height: 16px; display: block; cursor: pointer; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); text-align:center; position: relative; z-index: 200; margin-top:8px; } #user-screen-name { font-weight:normal; margin-top:3px; } #user-screen-name:before { content:'@'; } #mini-edit-profile-button { width:30px; height:30px; position:absolute; z-index:102; right:5px; top:5px; } #mini-edit-profile-button:before { font-family: 'FontAwesome'; font-size:17px; content:'\f044'; display:block; position:absolute; width:30px; height:30px; line-height:30px; text-align:center; text-shadow:none; color:rgba(255,255,255,0.7); z-index:102; } #mini-edit-profile-button:hover:before { color:rgba(255,255,255,1); } #user-profile-link a { font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 11px; color: #999999; line-height: 16px; text-overflow: ellipsis; overflow-x: hidden; overflow-y: hidden; white-space: nowrap; cursor: pointer; overflow: hidden; text-shadow: #FFFFFF 0px 1px 0px; margin-left:42px; margin-right:20px; } #user-avatar-container { background-color: #ffffff; border: 2px solid #ffffff; border-radius: 4px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); color: #ff00ae; font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 12px; height: 40px; line-height: 16px; margin: 0 auto; overflow: hidden; position: relative; width: 40px; z-index: 200; margin-top:5px; } #user-avatar { width: 40px; height: 40px; border-radius: 3px; } #user-body { background-color: #fff; color: #333333; font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 12px; line-height: 16px; list-style: outside none none; margin: 0; overflow: hidden; padding: 0; position: relative; text-shadow: 0 1px 0 #ffffff; display:table; table-layout: fixed; box-sizing: border-box; min-width: 100%; padding: 10px 0 10px 11px; } body.rtl #user-body { padding: 10px 11px 10px 0; } #user-body > li { display:table-cell; width:1%; box-sizing: border-box; vertical-align: bottom; line-height: 1; overflow: hidden; text-align:start; } #user-body #user-queets, #user-body #user-groups, #user-body #user-following { display:block; } #user-body #user-queets .label, #user-body #user-groups .label, #user-body #user-following .label { color: #999999; font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 10px; letter-spacing:0.2px; line-height: 16px; list-style: outside none none; text-decoration: none; text-shadow: 0 1px 0 #ffffff; text-transform: uppercase; display:block; overflow: hidden; } #user-body #user-followers { display:none; } #user-body strong { font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 18px; font-weight:500; text-transform: uppercase; line-height: 16px; display: block; list-style-image: none; list-style-position: outside; list-style-type: none; text-shadow: #FFFFFF 0px 1px 0px; } #user-body a { cursor:pointer; } #user-footer { font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 12px; color: #333333; line-height: 12px; background-color:#fff; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; text-shadow: #FFFFFF 0px 1px 0px; position:relative; } #user-footer-inner { border-width:1px; border-style:solid; border-left:0 none !important; border-right:0 none !important; border-bottom:0 none !important; padding-top: 10px; padding-right: 12px; padding-bottom: 10px; padding-left: 12px; position:relative; border-radius: 0 0 6px 6px; } #user-footer-inner img, .inline-reply-queetbox img { margin-bottom: 5px; margin-left: 2px; max-width: 100px; max-height: 50px; } .queet-box { font-family: "Helvetica Neue",​Arial,​sans-serif; font-size: 13px; color: #AAAAAA; line-height: 18px; vertical-align: top; background-color: #FFFFFF; width: 248px; height: 19px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 6px; padding-right: 8px; padding-bottom: 5px; padding-left: 8px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-color: #CCCCCC; border-right-color: #CCCCCC; border-bottom-color: #CCCCCC; border-left-color: #CCCCCC; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 1px 0 rgba(255, 255, 255, 0.075); outline-color: #AAAAAA; display: block; border-image-outset: 0 0 0 0; border-image-repeat: stretch stretch; border-image-slice: 100% 100% 100% 100%; border-image-source: none; border-image-width: 1 1 1 1; outline-style: none; outline-width: 0px; text-shadow: none; word-wrap: break-word; } .queet-box-syntax[contenteditable="true"], .syntax-two, .syntax-middle { font-family: "Helvetica Neue",Arial,​sans-serif; font-size: 13px; color: #333333; line-height: 18px; vertical-align: top; background-color: #FFFFFF; width: 248px; height:auto; min-height: 100px; margin-top: 0px; margin-right: 0px; margin-bottom: 8px; margin-left: 0px; padding-top: 6px; padding-right: 8px; padding-bottom: 5px; padding-left: 8px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-color: #CCCCCC; border-right-color: #CCCCCC; border-bottom-color: #CCCCCC; border-left-color: #CCCCCC; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-left-radius: 3px; border-top-right-radius: 3px; border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 1px 0 rgba(255, 255, 255, 0.075); outline-color: #333333; display: block; overflow-x: hidden; overflow-y: auto; border-image-outset: 0 0 0 0; border-image-repeat: stretch stretch; border-image-slice: 100% 100% 100% 100%; border-image-source: none; border-image-width: 1 1 1 1; outline-style: none; outline-width: 0px; text-shadow: none; word-wrap: break-word; } .queet-box-syntax[contenteditable="true"]:focus { color:#333333; outline:0 none; border-color:#56B4EF; z-index:101; position:relative; display:inline-block; /* important! otherwise webkit will nest div:s in the contenteditable */ } div.syntax-middle, div.syntax-two { position:absolute; left:12px; top:10px; z-index:102; color:transparent; display:none; border-color:transparent; background-color:transparent; box-shadow:none; } div.syntax-two { z-index:103; opacity:0.5; } div.syntax-middle { opacity:1; } .mentions-suggestions { background-color:rgba(238, 238, 238, 0.97); left: 13px; position: absolute; top: 100px; width: 264px; z-index: 100; display:none; box-shadow:0 1px 4px rgba(0, 0, 0, 0.35); border-radius: 0 0 6px 6px; } .mentions-suggestions div:last-child { border-radius: 0 0 6px 6px; } .mentions-suggestions div { line-height: 40px; padding: 0 10px 0 40px; position:relative; font-size:14px; white-space: nowrap; overflow:hidden; text-overflow: ellipsis; color:#8899A6; text-shadow:none; } .mentions-suggestions div img { top:8px; position:absolute; left:10px; } .mentions-suggestions div strong { color:#333333; } .mentions-suggestions .selected { background-color:#333; color:#fff; } .mentions-suggestions .selected strong { color:#fff; } .queet-toolbar { position:relative; display:none; height:32px; } .queet-toolbar img { margin-left:1px; max-width:100px; } .queet-box-loading-cover { position:absolute; top:0; left:0; width:1000px; height:1000px; background:rgba(0,0,0,0.4); z-index:1000; text-align:center; } .queet-box-extras { float: left; } body.rtl .queet-box-extras { float: right; } .queet-button { float: right; } .queet.rtl .queet-button { float: left; } .queet.rtl .queet-button .queet-counter { float: right; text-align:left; margin-left:5px; margin-right:0; } .queet-counter { background-color: transparent; border: 0 none; color: #999999; display: inline-block; font-size: 14px; padding: 0 3px; position: relative; text-align: right; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); top: 7px; vertical-align: top; width: 35px; margin-right: 5px; } .queet-toolbar button { font-family: "Helvetica Neue",Arial,sans-serif; font-size: 13px; font-weight: 700; color: #FFFFFF; line-height: 16px; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 4px; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset; box-sizing: border-box; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 5px; padding-right: 10px; padding-bottom: 5px; padding-left: 10px; position: relative; display: inline-block; border-image-outset: 0 0 0 0; border-image-repeat: stretch stretch; border-image-slice: 100% 100% 100% 100%; border-image-source: none; border-image-width: 1 1 1 1; cursor: pointer; text-shadow: rgba(0, 0, 0, 0.25) 0px -1px 1px; } button.signup-btn.disabled:hover, button.signup-btn.disabled:focus, button.signup-btn.disabled { background-color: rgba(0,0,0,0.15); background-image: none; border-color: rgba(0,0,0,0.2); color: rgba(0,0,0,0.4); cursor: default; opacity: 0.65; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); } .queet-toolbar button.disabled { opacity: 0.4; cursor: default; } .queet-toolbar button.enabled:hover { background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05)); } #settingslink .dropdown-toggle { height: 32px; margin-right: -405px; padding: 7px; position: fixed; right: 50%; width: 32px; z-index: 1001; display:none; } div.nav-session { height: 32px; width: 32px; cursor: pointer; display: block; background-size:32px 32px; border-radius:4px; box-sizing:border-box; border:1px solid rgba(0,0,0,0.1); background-position: -1px -1px; } .profile-card { background-clip: padding-box; border-radius: 6px; line-height: 16px; margin-bottom: 10px; border: 1px solid rgba(0, 0, 0, 0.1); text-shadow: 0 1px 0 #FFFFFF; float: right; position: relative; width: 588px; } .modal-body .profile-card { margin-right:-1px; margin-top:-5px; margin-bottom:0; } .profile-header-inner { text-shadow: 0 1px 0 #FFFFFF; line-height: 16px; border-top-left-radius: 6px; border-top-right-radius: 6px; background-color: #444444; background-repeat: no-repeat; box-shadow: 0 -1px 0 rgba(0, 0, 0, 0.1) inset; height: 260px; overflow: hidden; padding: 0; text-align: center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .profile-header-inner .profile-header-inner-overlay { background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.65))); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); height: 200px; position: absolute; top: 60px; width: 100%; } .profile-header-inner .profile-picture { outline: 0 none; background-color: #FFFFFF; border: 4px solid #FFFFFF; border-radius: 6px 6px 6px 6px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25); display: block; height: 73px; margin: 20px auto 6px; position: relative; width: 73px; z-index: 5; } .profile-header-inner .profile-picture img { height: 73px; width: 73px; border-radius: 3px 3px 3px 3px; float: none; } .profile-header-inner .profile-card-inner { text-align: center; line-height: 16px; float: none; margin: auto; position: relative; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); width: 85%; } .profile-header-inner .profile-card-inner .fullname { text-rendering: optimizelegibility; font-weight: bold; line-height: 1; margin: 0 auto 2px auto; color: #FFFFFF; font-size: 24px; white-space: nowrap; padding:0; height:24px; line-height:24px; display:block; } .profile-header-inner .profile-card-inner h1.fullname span { font-size: 24px; white-space: nowrap; line-height: 1; } .profile-header-inner .profile-card-inner h2.username { margin-top:0; color: #FFFFFF; font-size: 18px; font-weight: normal; line-height: 24px; margin-bottom: 1px; text-rendering: optimizelegibility; } .profile-header-inner .profile-card-inner h2.username .follows-you { display:inline-block; font-size:11px; color:#eee; background-color:rgba(0,0,0,0.5); padding:3px 5px; height:15px; line-height:15px; border-radius:3px; margin-left:7px; text-transform:uppercase; } .profile-header-inner .profile-card-inner h2.username a { color:#fff; } .profile-header-inner .profile-card-inner .bio-container, .profile-header-inner .profile-card-inner .bio-container textarea { line-height: 18px; margin-bottom: 4px; font-size: 14px; } .profile-header-inner .profile-card-inner .bio-container p { color: #FFFFFF; margin:0; } .profile-header-inner .profile-card-inner .location-and-url, .profile-header-inner .profile-card-inner .location-and-url input { font-size: 14px; color: #FFFFFF; line-height: 18px; margin:0; } .profile-header-inner .profile-card-inner .location-and-url span.divider { padding: 0 2px; } .profile-header-inner .profile-card-inner .location-and-url .location:empty ~ .url > span.divider { display:none; } .profile-header-inner .profile-card-inner .location-and-url .url.empty { display:none; } .profile-header-inner .profile-card-inner .location-and-url span a { color:#fff; } .profile-header-inner .profile-card-inner .location-and-url span a:hover { text-decoration:underline; } .profile-banner-footer { padding: 0; background-color: #FFFFFF; line-height: 16px; text-shadow: 0 1px 0 #FFFFFF; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; min-height: 52px; position: relative; } .profile-banner-footer ul.stats { border-bottom: 0 none; border-top: 0 none; margin: 0; float:left; } .profile-banner-footer ul.stats li a { padding: 0 15px 8px 12px; } .profile-banner-footer ul.stats li:first-child a { padding-left: 12px; } .profile-banner-footer ul.stats li a strong { } .profile-card .user-actions { position:relative; float: right; margin: 10px; } div.clearfix { clear:both; height:0; } .member-button, .external-member-button, .external-follow-button, .qvitter-follow-button, .edit-profile-button, .save-profile-button, .abort-edit-profile-button, .crop-and-save-button { font-family: "Helvetica Neue",Arial,sans-serif; font-size: 13px; font-weight: 700; color: #333; line-height: 16px; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 4px; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.15) inset; box-sizing: border-box; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0; padding-right: 5px; padding-bottom: 0; padding-left: 5px; position: relative; display: inline-block; border-image-outset: 0 0 0 0; border-image-repeat: stretch stretch; border-image-slice: 100% 100% 100% 100%; border-image-source: none; border-image-width: 1 1 1 1; cursor: pointer; text-shadow: rgba(0, 0, 0, 0.15) 0px -1px 1px; } .qvitter-follow-button, .edit-profile-button, .abort-edit-profile-button, .member-button { background-color:#e2e2e2; text-shadow: rgba(255, 255, 255, 0.15) 0px -1px 1px; color:#333; } .external-member-button.disabled, .member-button.disabled, .external-follow-button.disabled, .qvitter-follow-button.disabled, .edit-profile-button.disabled, .save-profile-button.disabled, .crop-and-save-button.disabled { opacity:0.2; cursor:default; } .external-member-button.disabled i, .member-button.disabled i, .external-follow-button.disabled i, .qvitter-follow-button.disabled i { opacity:0.2; } .external-member-button:not(.disabled):not(.member):hover, .member-button:not(.disabled):not(.member):hover, .external-follow-button:not(.disabled):not(.following):hover, .qvitter-follow-button:not(.disabled):not(.following):hover, .edit-profile-button:hover, .abort-edit-profile-button:hover, button.shorten:not(.disabled):hover, .save-profile-button:not(.disabled):hover, .crop-and-save-button:not(.disabled):hover { background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05)); } .external-member-button:not(.disabled):not(.member):active, .member-button:not(.disabled):not(.member):active, .external-follow-button:not(.disabled):not(.following):active, .qvitter-follow-button:not(.disabled):not(.following):active, button.shorten:not(.disabled):active { background: none; background-color: #D8D8D8; border-color: #BBBBBB; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) inset, 0 1px 0 rgba(255, 255, 255, 0.5); } .external-member-button .button-text, .member-button .button-text, .external-follow-button .button-text, .qvitter-follow-button .button-text, .edit-profile-button .button-text, .save-profile-button .button-text, .abort-edit-profile-button .button-text, .crop-and-save-button .button-text { display:none; font-family: "Helvetica Neue",Arial,sans-serif; min-width: 70px; text-align: center; } .external-member-button .join-text, .member-button .join-text, .external-follow-button .follow-text, .qvitter-follow-button .follow-text { padding: 0 10px 0 40px; text-align:right; min-width: 0; } .external-member-button .join-text i, .member-button .join-text i, .external-follow-button .follow-text i, .qvitter-follow-button .follow-text i { background-position: -90px -92px; display: block; height: 28px; margin-left: -45px; margin-top: 0; position: absolute; width: 40px; } .member-button.member, .external-follow-button.following, .qvitter-follow-button.following, .save-profile-button, .crop-and-save-button { color:#fff; } .save-profile-button, .crop-and-save-button { margin-left:10px; } .member-button.member:hover, .external-follow-button.following:hover, .qvitter-follow-button.following:hover { background-color: #c43c35; background: -moz-linear-gradient(top, rgba(238,95,91,1) 0%, rgba(196,60,53,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(238,95,91,1)), color-stop(100%,rgba(196,60,53,1))); background: -webkit-linear-gradient(top, rgba(238,95,91,1) 0%,rgba(196,60,53,1) 100%); background: -o-linear-gradient(top, rgba(238,95,91,1) 0%,rgba(196,60,53,1) 100%); background: -ms-linear-gradient(top, rgba(238,95,91,1) 0%,rgba(196,60,53,1) 100%); background: linear-gradient(to bottom, rgba(238,95,91,1) 0%,rgba(196,60,53,1) 100%); background-repeat: repeat-x; border-color: #a93730 #a93730 #952f2a; } .external-member-button .join-text, .member-button .join-text, .external-follow-button .follow-text, .qvitter-follow-button .follow-text, .edit-profile-button .edit-profile-text, .save-profile-button .edit-profile-text, .abort-edit-profile-button .edit-profile-text, .crop-and-save-button .edit-profile-text { display:block; height: 28px; line-height: 28px; } .member-button.member .join-text, .external-follow-button.following .follow-text, .qvitter-follow-button.following .follow-text { display:none; height: 28px; line-height: 28px; } .member-button.member .ismember-text, .external-follow-button.following .following-text, .qvitter-follow-button.following .following-text { display:block; height: 28px; line-height: 28px; } .member-button.member:hover .ismember-text, .external-follow-button.following:hover .following-text, .qvitter-follow-button.following:hover .following-text { display:none; height: 28px; line-height: 28px; } .member-button.member:hover .leave-text, .external-follow-button.following:hover .unfollow-text, .qvitter-follow-button.following:hover .unfollow-text { display:block; height: 28px; line-height: 28px; } .queet-box-extras button { box-shadow: none; background:none !important; border:0 none; text-shadow:none; display:block; float:left; width:40px; height:15px; padding:0; margin:0; line-height:15px; font-size:12px; padding-bottom:15px; box-sizing:content-box; text-align:center; cursor: pointer; letter-spacing:1px; position:relative; font-weight:normal; opacity:0.8; } .queet-box-extras button:hover { opacity:1; } .queet-box-extras button.disabled { opacity:0.2; } button.upload-image:before { content:"\f03e"; display: block; font-family: FontAwesome; font-size: 24px; font-weight:400; height: 30px; left: 0; line-height: 30px; position: absolute; text-align: center; top: 0; width: 40px; z-index: 101; } button.shorten { font-weight:bold; } button.shorten:before, button.shorten:after { content:"\f061"; display: block; font-family: FontAwesome; font-size: 12px; height: 15px; right: 50%; margin-right: 0px; margin-top: 13px; position: absolute; text-align: right; top: 0; width: 20px; z-index: 101; } button.shorten:after { content:"\f060"; left: 50%; margin-left: 0; text-align: left; } /* SPINNER */ .loader { display: block; position: fixed; left:50%; margin-left:-20px; top: 2px; z-index:10000; } #footer-spinner-container .loader, .queet-box-loading-cover .loader { left: auto; margin: 0; position: relative; top: 20px; } #popup-external-profile-spinner .loader, #popup-local-profile-spinner .loader { position:absolute; top:150px; } .reload-stream { display: block; position: absolute; right: 5px; background-position: 0 -600px; width:35px; height:35px; top:5px; opacity:0.5; cursor:pointer; } .reload-stream:hover { opacity:1; } svg path, svg rect{ fill: #333; } #footer-spinner-container svg path, #footer-spinner-container svg rect, .queet-box-loading-cover svg path, .queet-box-loading-cover svg rect { fill: #fff; } .spinner-wrap { position: fixed; top: 29px; left:50%; margin-left:-10px; z-index:10000; } .signup-input-container .spinner-wrap { position:absolute; left:0; top:25px; margin-left:243px; } .spinner { height: 20px; width: 20px; margin: -20px auto 0; animation: spin 1s steps(12, end) infinite; -moz-animation: spin 1s steps(12, end) infinite; -webkit-animation: spin 1s steps(12, end) infinite; } .spinner i { height: 5px; width: 2px; margin-left: -1px; display: block; position: absolute; left: 50%; transform-origin: center 10px; -webkit-transform-origin: center 10px; -moz-transform-origin: center 10px; background: #fff; border-radius: 2px; } .signup-input-container .spinner i { background:rgba(0,0,0,0.2); } .spinner i:nth-child(1) { opacity: 0.08; } .spinner i:nth-child(2) { transform: rotate(30deg); transform: rotate(30deg); transform: rotate(30deg); opacity: 0.167; } .spinner i:nth-child(3) { transform: rotate(60deg); -moz-transform: rotate(60deg); -webkit-transform: rotate(60deg); opacity: 0.25; } .spinner i:nth-child(4) { transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); opacity: 0.33; } .spinner i:nth-child(5) { transform: rotate(120deg); -moz-transform: rotate(120deg); -webkit-transform: rotate(120deg); opacity: 0.4167; } .spinner i:nth-child(6) { transform: rotate(150deg); -moz-transform: rotate(150deg); -webkit-transform: rotate(150deg); opacity: 0.5; } .spinner i:nth-child(7) { transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); opacity: 0.583; } .spinner i:nth-child(8) { transform: rotate(210deg); -moz-transform: rotate(210deg); -webkit-transform: rotate(210deg); opacity: 0.67; } .spinner i:nth-child(9) { transform: rotate(240deg); -moz-transform: rotate(240deg); -webkit-transform: rotate(240deg); opacity: 0.75; } .spinner i:nth-child(10) { transform: rotate(270deg); -moz-transform: rotate(270deg); -webkit-transform: rotate(270deg); opacity: 0.833; } .spinner i:nth-child(11) { transform: rotate(300deg); -moz-transform: rotate(300deg); -webkit-transform: rotate(300deg); opacity: 0.9167; } .spinner i:nth-child(12) { transform: rotate(330deg); -moz-transform: rotate(330deg); -webkit-transform: rotate(330deg); opacity: 1; } @keyframes spin { from { transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); } to { transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); } } @-webkit-keyframes spin { from { transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); } to { transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); } } @-moz-keyframes spin { from { transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); } to { transform: rotate(360deg); -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); } } /* popups ------------*/ .modal-container { bottom: 0; display: block; left: 0; overflow-x: hidden; overflow-y: auto; position: fixed; right: 0; top: 0; z-index: 5000; background: none repeat scroll 0 0 rgba(0, 0, 0, 0.75); } .modal-draggable { margin: 0; padding-bottom: 30px; position: relative; top: 30%; left: 50%; width: 588px; z-index: 6000; } .modal-content { background-clip: padding-box; background-color: #FFFFFF; border-radius: 6px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(255, 255, 255, 0.5) inset; position: relative; } .modal-close { margin: 0; border: 0 none; cursor: pointer; padding: 11px 12px; background-color: transparent; cursor: pointer; padding: 11px 12px; border-radius: 0 6px 0 0; position: absolute; right: 0; top: 0; z-index: 11; } .modal-close:hover { } .modal-close .icon { background-position: -80px -510px; background-repeat: no-repeat; cursor: pointer; display: inline-block; float: left; height: 12px; margin-top: 2px; vertical-align: text-top; width: 10px; } .modal-close:hover .icon { background-position: -80px -510px; } .modal-header { padding: 15px; background-color: #fff; background-repeat: repeat-x; border-bottom: 1px solid #DDDDDD; border-radius: 6px 6px 0 0; box-shadow: 0 1px 0 #FFFFFF inset; cursor: move; padding-bottom: 8px; padding-top: 8px; min-height:20px; position: relative; z-index: 10; } .modal-header h3 { margin: 0; text-rendering: optimizelegibility; color: #999; font-size: 16px; font-weight: normal; line-height: 22px; margin: 0 auto; overflow: hidden; text-align: center; text-overflow: ellipsis; text-shadow: 0 1px 0 #FFFFFF; white-space: nowrap; width: 75%; } .modal-body { padding: 0; text-align: left; } .modal-footer { padding: 15px; text-align: left; border-top: 1px solid #DDDDDD; content: " "; clear: both; } .modal-footer .queet { border-bottom:0 none; cursor:auto; min-height:53px; } .modal-footer .queet:hover { background-color:#fff; } .modal-footer .queet-content { padding:0; cursor:auto; } .modal-footer .queet-text { cursor:auto; } .modal-body .inline-reply-queetbox { padding-left:12px; margin-top: -1px; } body.rtl .modal-body .inline-reply-queetbox { direction:rtl; text-align:right; } .modal-body .inline-reply-queetbox .queet-box-syntax, .modal-body .inline-reply-queetbox .syntax-middle, .modal-body .inline-reply-queetbox .syntax-two { width:auto; } .modal-body .inline-reply-queetbox .syntax-middle, .modal-body .inline-reply-queetbox .syntax-two { left:auto; } .modal-body .inline-reply-queetbox .reply-avatar { display:none; } .modal-body .queet { background-color:#f5f5f5; } .modal-footer div.right { text-align:right; } body.rtl .modal-footer div.right { text-align:left; direction:rtl; } .modal-footer button { border: 1px solid #CCCCCC; border-radius: 4px 4px 4px 4px; color: #333333; cursor: pointer; display: inline-block; font-size: 13px; font-weight: bold; line-height: 18px; padding: 5px 10px; position: relative; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5); background-color: #DDDDDD; background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(221,221,221,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(221,221,221,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(221,221,221,1) 100%); background-repeat: repeat-x; font-family: "Helvetica Neue",Arial,sans-serif; font-weight:700; margin-left: 10px; } .modal-footer button:hover { background-color: #D8D8D8; background: -moz-linear-gradient(top, rgba(248,248,248,1) 0%, rgba(216,216,216,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(248,248,248,1)), color-stop(100%,rgba(216,216,216,1))); background: -webkit-linear-gradient(top, rgba(248,248,248,1) 0%,rgba(216,216,216,1) 100%); background: -o-linear-gradient(top, rgba(248,248,248,1) 0%,rgba(216,216,216,1) 100%); background: -ms-linear-gradient(top, rgba(248,248,248,1) 0%,rgba(216,216,216,1) 100%); background: linear-gradient(to bottom, rgba(248,248,248,1) 0%,rgba(216,216,216,1) 100%); border-color: #BBBBBB; text-decoration: none; } .modal-footer button.primary { background-color: #019AD2; background: -moz-linear-gradient(top, rgba(51,188,239,1) 0%, rgba(1,154,210,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(51,188,239,1)), color-stop(100%,rgba(1,154,210,1))); background: -webkit-linear-gradient(top, rgba(51,188,239,1) 0%,rgba(1,154,210,1) 100%); background: -o-linear-gradient(top, rgba(51,188,239,1) 0%,rgba(1,154,210,1) 100%); background: -ms-linear-gradient(top, rgba(51,188,239,1) 0%,rgba(1,154,210,1) 100%); background: linear-gradient(to bottom, rgba(51,188,239,1) 0%,rgba(1,154,210,1) 100%); background-repeat: repeat-x; border-color: #057ED0; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset; color: #FFFFFF; text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25); } .modal-footer button.primary:hover { background-color: #0271BF; background: -moz-linear-gradient(top, rgba(45,173,220,1) 0%, rgba(2,113,191,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(45,173,220,1)), color-stop(100%,rgba(2,113,191,1))); background: -webkit-linear-gradient(top, rgba(45,173,220,1) 0%,rgba(2,113,191,1) 100%); background: -o-linear-gradient(top, rgba(45,173,220,1) 0%,rgba(2,113,191,1) 100%); background: -ms-linear-gradient(top, rgba(45,173,220,1) 0%,rgba(2,113,191,1) 100%); background: linear-gradient(to bottom, rgba(45,173,220,1) 0%,rgba(2,113,191,1) 100%); background-repeat: repeat-x; border-color: #096EB3; color: #FFFFFF; } .modal-footer button.primary.disabled { background-color: #DDDDDD; background-image: none; border-color: #CCCCCC; color: #777777; cursor: default; opacity: 0.65; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); } body.rtl .modal-footer button { font-family:Tahoma,Arial,sans-serif; margin-left: 10px; } .thread-container { margin:10px 20px 100px 20px; } .thread-container .stream-item { margin:0; margin-bottom:1px; border-radius:3px; } .thread-container .stream-item .stream-item-footer { height: 20px; } #popup-external-join .modal-body, #popup-external-follow .modal-body { padding:20px; } #popup-external-join input, #popup-external-follow input { background-color: #FFFFFF; border-color: #CCCCCC; border-image: none; border-radius: 3px 3px 3px 3px; border-style: solid; border-width: 1px; box-shadow: 0 1px 0 #EEEEEE inset, 0 1px 0 #FFFFFF; color: #000000; display: block; font-family: Arial,​sans-serif; font-size: 13px; height: 20px; line-height: 15.4333px; margin: 0; outline: 0 none #000000; padding: 4px; transition: background 0.2s cubic-bezier(0, 0, 1, 1) 0s; width:80%; } #popup-external-join input:focus, #popup-external-follow input:focus { border: 1px solid #56B4EF; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 0 8px rgba(82, 168, 236, 0.6); } #queet-thumb-popup .modal-header { border: 0 none; height: 0; margin: 0; min-height: 0; padding: 0; } #queet-thumb-popup .modal-body { position:relative; background-color: #000; } #queet-thumb-popup .modal-body .queet-thumbs, #queet-thumb-popup .modal-body .thumb-container, #queet-thumb-popup .modal-body .attachment-thumb { position:relative; display:block; width:100%; } #queet-thumb-popup .modal-body .attachment-thumb { opacity:0; } #queet-thumb-popup .modal-body .thumb-container { background-position: center center; background-repeat: no-repeat; background-size: 100% auto; max-width: 920px; margin: 0 auto; min-height: 0; } #queet-thumb-popup .modal-body .thumb-container.youtube iframe { position:absolute; z-index:2; } #queet-thumb-popup .modal-body .thumb-container.youtube { background-image:none !important; z-index:1; } #queet-thumb-popup .modal-body .thumb-container[href$=".svg"], #queet-thumb-popup .modal-body .thumb-container[href$=".png"] { background-color:#fff; } #queet-thumb-popup .modal-close { right: -35px; top: -11px; } #queet-thumb-popup .modal-close .icon { background-position: -120px -510px; } #queet-thumb-popup .thumb-container:not(.display-this-thumb) { display:none; } #queet-thumb-popup .prev-thumb, #queet-thumb-popup .next-thumb { box-sizing: border-box; display: block; height: 50%; line-height: 30px; left: -50px; margin-top: -15px; position: absolute; top: 50%; width: 60px; z-index: 1; text-align: center; cursor:pointer; font-size:60px; color:#e5e5e5; } #queet-thumb-popup .next-thumb { left:auto; right:-50px; } #queet-thumb-popup .prev-thumb:before, #queet-thumb-popup .next-thumb:before { font-family:"FontAwesome"; content: "\f104"; } #queet-thumb-popup .next-thumb:before { content: "\f105"; } #queet-thumb-popup .prev-thumb.disabled, #queet-thumb-popup .next-thumb.disabled { color:rgba(255,255,255,0.2); cursor:default; } #queet-thumb-popup .prev-thumb:not(.disabled):hover:before, #queet-thumb-popup .next-thumb:not(.disabled):hover:before { color:#fff; } /* edit profile ------------------------- */ .edit-profile-container { margin: 53px auto 0 auto; width: 890px; background:green; text-align: right; position:relative; } .edit-profile-container .profile-header-inner .profile-header-inner-overlay { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.65) 100%) repeat scroll 0 0 rgba(0, 0, 0, 0); height: 260px; top: 0; } .edit-profile-container .profile-card { float:none; position:absolute; right:0; box-shadow:0 0 100px 100px rgba(0, 0, 0, 0.4); } body.rtl .edit-profile-container .profile-card { right:auto; left:0; } .edit-profile-container .profile-banner-footer { padding-left:5px; text-align: left; min-height:51px; } .save-profile-button, .abort-edit-profile-button, .crop-and-save-button { display:none; } .edit-profile-container .profile-banner-footer .color-selection { padding-left:5px; display: inline-block; padding-top:12px; position: relative; } .edit-profile-container .profile-banner-footer .color-selection label { background-color: #333; border-radius: 4px; bottom: -32px; box-shadow: 0 0 14px 5px rgba(255, 255, 255, 0.3); color: #fff; display: none; font-size: 12px; letter-spacing: 0.3px; line-height: 15px; padding: 6px 12px; position: absolute; text-shadow: none; z-index: 1; } .edit-profile-container .profile-banner-footer .color-selection label:before { border:5px solid transparent; border-bottom: 5px solid #333; border-top:0 none; box-sizing: content-box; content: " "; display: none; height: 0; left: 10px; position: absolute; top: -5px; z-index: 1; } .edit-profile-container .profile-banner-footer .color-selection:hover label, .edit-profile-container .profile-banner-footer .color-selection:hover label:before { display: block; } #edit-profile-popup { background-color:rgba(0, 0, 0, 0); } .profile-header-inner input, .profile-header-inner textarea { background:rgba(0,0,0,0.4); border:0 none; text-align:center; width:84%; font-family: "Helvetica Neue",Arial,sans-serif; } .profile-header-inner input:focus, .profile-header-inner textarea:focus { outline: none; } .profile-header-inner input.invalid, .profile-header-inner textarea.invalid { background:rgba(217,91,9,0.4); } .profile-header-inner textarea { height:50px; color:#fff; resize: none; } .profile-header-inner input.location { width:40%; text-align:right; padding-right:5px; } .profile-header-inner input.url { width:40%; text-align:left; padding-left:5px; } .upload-cover-photo, .upload-avatar, .upload-background-image { background-position: -245px -45px; width:35px; height:35px; position:absolute; left:5px; top:5px; z-index:50; cursor:pointer; } .upload-background-image { position: fixed; top: 50px; } .close-edit-profile-window { background-position: -111px -502px; height:30px; width:30px; position:absolute; right:5px; top:5px; opacity:0.7; z-index:1; cursor:pointer; } .close-edit-profile-window:hover { opacity:1; } .upload-avatar { left: 50%; margin-left: -17.5px; right: auto; top: 45px; } .upload-cover-photo:hover, .upload-avatar:hover, .upload-background-image:hover { background-position: -245px -85px; } input#cover-photo-input, input#avatar-input, input#upload-image-input, input#background-image-input { opacity:0; position:absolute; height:0; width:0; overflow:hidden; } .jwc_frame.avatar-to-crop { top:20px; } .jwc_frame.background-to-crop { z-index:-1; position:fixed !important; top:46px; } /* jWindowCrop defaults */ .jwc_frame { } .jwc_image { cursor:move; } .jwc_controls { background-color:#000; width:100%; height:26px; opacity:0.6; filter:alpha(opacity=6); position:absolute; z-index:100; bottom:0px; left:0px; } .jwc_controls span { display:block; float:left; color:#FFF; font-size:11px; margin:7px 0px 0px 5px; text-shadow: none; } .jwc_zoom_in, .jwc_zoom_out { position:relative; font-family:"FontAwesome"; display:block; background-color:#FFF; cursor:pointer; border-radius:100px; width:18px; height:18px; float:right; margin:4px 4px 0px 0px; text-decoration:none; text-align:center; font-size:11px; font-weight:bold; color:#000; } .jwc_zoom_in::after,.jwc_zoom_out::after { display: block; height: 18px; left: 0; line-height: 20px; position: absolute; text-align: center; top: 0; width: 18px; } .jwc_zoom_in::after { content:"\f067"; } .jwc_zoom_out::after { content:"\f068"; } /* end jWindowCrop defaults */ .jwc_frame{ z-index:100; } /* FAQ -----------*/ #popup-faq #faq-container { padding:10px 20px 20px; color:#000; min-height:100vh; } #popup-faq #faq-container h1 { padding-top:10px; } #popup-faq #faq-container h2 { padding-top:20px; line-height: 27px; } #popup-faq #faq-container h2 a { font-size:0; } #popup-faq #faq-container h2 a:before { content:"\f0aa"; font-family:"FontAwesome"; font-size:20px; } #popup-faq #faq-container li { padding-left:20px; font-weight:bold; } #popup-faq #faq-container p.indent { background-color: rgba(0, 0, 0, 0.1); border-left: 3px solid #ccc; margin-left: 50px; padding: 5px 5px 5px 10px; } #popup-faq #faq-container p.faq-credits { margin-top:40px; } /* RTL --------- */ body.rtl .profile-card .user-actions { float: left; } body.rtl .profile-banner-footer ul.stats { float: right; } .queet-text .vcard .mention, .queet-text .vcard .group, .queet-text .tag a { direction:ltr; } .queet-text .vcard .mention, .queet-text .vcard .group { unicode-bidi:bidi-override; } .queet.rtl .queet-text .tag a { direction:rtl; } .queet.rtl .queet-text .vcard .mention:after, .queet.rtl .queet-text .h-card.mention:after { content: "@"; } .queet.rtl .queet-text .vcard .group:after, .queet.rtl .queet-text .h-card.group:after { content: "!"; } .queet.rtl .queet-text .tag a:before { content:"#"; } body.rtl table.password-signin { direction:rtl; } body.rtl .flex-table-primary { padding-left: 5px; padding-right: 0; } body.rtl #search { float:left; margin-left:93px; } body.rtl .search-icon { left:2px; right:auto; } body.rtl #search-query { padding: 6px 12px 6px 27px; direction:rtl; } body.rtl .profile-card { float:left; margin-left:-1px; margin-right:auto; } body.rtl #user-body { direction:rtl; } body.rtl .reload-stream { right:auto; left:5px; } body.rtl #remember-forgot, body.rtl #login-content input#nickname, body.rtl #login-content input#password, body.rtl .queet-box, body.rtl .syntax-middle, body.rtl .syntax-two, body.rtl #user-header, body.rtl .queet-box-template, body.rtl #new-queets-bar, body.rtl .longdate { direction:rtl; } body.rtl #queet-box[contenteditable="true"]:focus { text-align:right; direction:rtl; } body.rtl #queet-button, body.rtl .queet-button { direction: rtl; float:left; } body.rtl #queet-counter, body.rtl .queet-counter { margin-right:0; margin-left:5px; text-align: left; } body.rtl #user-body #user-queets, body.rtl #user-body #user-following, body.rtl #user-body #user-groups, body.rtl #user-body #user-followers, body.rtl .profile-banner-footer ul.stats li { float:right; direction: rtl; } body.rtl .profile-banner-footer ul.stats li:last-child a { border-left:0 none; } body.rtl #user-body #user-groups { border:0 none; } body.rtl #user-avatar { left:auto; right:12px; } body.rtl #user-container { float: right; } body.rtl #user-screen-name { direction:ltr; } body.rtl #feed { float: left; } body.rtl .language-dropdown { float:left; direction: rtl; margin-left: 0; margin-right: 6px; } body.rtl .quitter-settings.dropdown-menu { left:auto; right:50%; margin-right:147px; margin-left:0; } body.rtl #logo { left:auto; right:50%; margin-right: -443px; margin-left:auto; } body.rtl #top-compose { left:auto; right:50%; margin-right: 412px; margin-left:auto; } body.rtl .dropdown-caret.right { right: auto; left: 10px; } body.rtl .dropdown-menu { float: left; right: auto; left:0; } body.rtl .dropdown-toggle .caret { margin-right: 2px; margin-left:0; } body.rtl #settingslink .dropdown-toggle { margin-right: 358px; direction:rtl; } body.rtl #settingslink div.nav-session { margin-left:6px; margin-right:0; } body.rtl #settingslink .caret { display:block; position:absolute; margin-left:0; margin-right:25px; top:13px; } body.rtl .menu-container a .chev-right { right:auto; left:12px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } body.rtl .menu-container a .close-right { margin-right:5px; } body.rtl .menu-container a { direction:rtl; } body.rtl #feed-header-inner h2 { direction: rtl; } body.rtl, body.rtl label, body.rtl .label, body.rtl input, body.rtl textarea, body.rtl select, body.rtl button, body.rtl span, body.rtl span.screen-name, body.rtl strong.name, body.rtl a, body.rtl p, body.rtl div.queet-text, body.rtl .dropdown-toggle, body.rtl #remember-forgot, body.rtl .queet-box, body.rtl #new-queets-bar, body.rtl #user-name, body.rtl #feed-header-inner h2 { font-family: Tahoma,Arial,sans-serif !important; } /* =Responsive Structure ----------------------------------------------- */ @media (max-width: 1280px) { } @media (max-width: 1050px) { .language-dropdown { position:fixed; right:100px; } body.rtl .language-dropdown { left:100px; right:auto; } } @media (max-width: 910px) { body { background:none !important; } .upload-background-image { display:none; } .edit-profile-container .profile-card { top:0 !important; } .topbar .global-nav:before { background:none !important; } #site-notice, #qvitter-notice { display:none !important; } #new-queets-bar-container { height:77px; } .language-dropdown { width:170px; right:50%; margin-right:-85px; margin-top:5px; } .language-dropdown a.dropdown-toggle { color:#fff; } .language-dropdown a.dropdown-toggle small, .language-dropdown a.dropdown-toggle span { font-size:14px; } .language-dropdown .dropdown-toggle .caret { border-top-color:#fff; } .front-welcome-text { opacity:0; height:320px; overflow:hidden; } .front-welcome-text.registrations-closed { height:35px; } #page-container { margin-top:69px; background-color:transparent; } #login-content, .front-signup { left: 50%; margin-left: -150px; z-index:1; margin-top:10px; } .front-signup { margin-top:130px; } #feed, .profile-card { position:relative; z-index:10; } #search-query-hint { display:none; } #search-query { background-size: 500px 1329px; background-position: -100px -804px; border: 0 none; border-radius: 0; box-shadow: none; color: #444444; display: block; font-family: "Helvetica Neue",Arial,sans-serif; font-size: 12px; height: 52px; line-height: 1; margin: 0; outline: 0 none; padding: 6px 27px 6px 12px; position: fixed; right: 60px; top: 0; transition: all 0.2s ease-in-out 0s; width: 60px; z-index: 2; background-color:transparent; } #search-query:focus { right:auto; left:53px; z-index:101; display:block; width:100%; font-size:25px; line-height:40px; background-color: #FFFFFF; box-shadow: none; color: #666666; text-shadow: none; } #search-query::-webkit-input-placeholder { opacity:0; font-size:0; } #search-query:-moz-placeholder { /* Firefox 18- */ opacity:0; font-size:0; } #search-query::-moz-placeholder { /* Firefox 19+ */ opacity:0; font-size:0; } #search-query:-ms-input-placeholder { opacity:0; font-size:0; } #top-compose { border: 3px solid #fff; box-shadow: none; cursor: pointer; display: block; height: 41px; margin: 0; position: fixed; right: 6px; top: 5px; width: 41px; z-index: 100; } #top-compose.hidden { display:none; } #top-compose:before { font-size:25px; line-height: 41px; padding-left: 2px; } #page-container { width: 520px; margin-left: -275px; } #user-container { width:522px; } #feed { float:left; width:524px; } #logo { margin-left: -265px; } body.rtl #logo { margin-right:-265px; } #settingslink .dropdown-toggle { margin-left: -187px; } body.rtl #settingslink .dropdown-toggle { margin-right: -189px; margin-left:0; } .quitter-settings.dropdown-menu { margin-left:-260px; } body.rtl .quitter-settings.dropdown-menu { margin-left:0; margin-right:-260px; } #queet-box, #queet-box[contenteditable="true"] { width:478px; } body { overflow-x:hidden; } #logo{ margin-left: -48.5%; } #settingslink .dropdown-toggle { left:0; padding-left:5px; margin-left: 95px; } .quitter-settings.dropdown-menu { left:0; margin-left:20px; } body.rtl .quitter-settings.dropdown-menu { left:auto; right:0; margin-left:0; margin-right:15px; } body.rtl #settingslink .dropdown-toggle { left:auto; right:0; padding-left:0; margin-left: 0; padding-right:5px; margin-right: 92px; } body.rtl #logo{ margin-right: -48.5%; margin-left: auto; } #page-container { width: 200%; margin-left: -100%; padding:0; position:relative; } #user-container { width:95%; margin-left:2.5%; margin-top:14px; } #user-container { width:100%; margin-left:0%; margin-top:0px; top:50px; margin-bottom:-3px; position:fixed; } body.rtl #user-container { margin-right:2.5%; margin-left:0; } #feed { width:95%; margin-left:2.5%; } #user-footer { padding-left:2.5%; } .modal-draggable { width:95%; } #queet-box, #queet-box[contenteditable="true"], .queet-box-template, .modal-body .inline-reply-queetbox .queet-box-template { width:95%; } .stream-item.activity .queet-text { width:95%; } .stream-item.expanded .media img { max-width: 100%; } body { background-color:#000 !important; } #logo { display:none; } #settingslink .dropdown-toggle { margin-left:5px; } body.rtl #settingslink .dropdown-toggle { margin-right:5px; } .quitter-settings.dropdown-menu { left:0; margin-left:20px; } .quitter-settings.dropdown-menu .dropdown-caret { right: auto; left: 10px; } body.rtl .quitter-settings.dropdown-menu { left:auto; right:0; margin-left:0; margin-right:20px; } body.rtl .quitter-settings.dropdown-menu .dropdown-caret { left: auto; right: 10px; } .topbar { box-shadow:none; z-index:2000; height:51px; } .topbar .global-nav { height:52px; background-image:none; background-color:transparent; } div.nav-session { background-size: 41px 41px; height: 41px; margin-top: 5px; width: 41px; } #settingslink .caret { display:none; } #settingslink .dropdown-toggle { padding:0; } #user-footer, #feed-header-inner { border-radius:0 0 0 0; } body.rtl #user-container { margin-right:-1px; margin-left:0%; } #user-header, #user-body, #user-footer { display:none; } #history-container { display:none !important; } .menu-container { margin:0; height:59px; border:0 none !important; border-radius:0 0 0 0 !important; box-shadow: 0 25px 55px 0 rgba(255, 255, 255, 0.5) inset; margin: 0 0 0 -1%; width: 102%; } .menu-container a.my-timeline { display:block; } .menu-container a.favorites, .menu-container a.mentions, .menu-container a.public-and-external-timeline { display:none; } .menu-container a, .menu-container a.current { box-shadow:none; background-color:transparent; width:25%; float:left; font-size:0; color:transparent; height:55px; padding:0 !important; margin:0; border-radius:0 0 0 0 !important; background-size: 500px 1329px; background-position: center -1003px; } .menu-container a:hover, .menu-container a.current:hover { background-color:transparent; } .menu-container a, .menu-container a.current { border:0 none !important; } .menu-container a:not(.current) { height:63px; } .menu-container a:after, .menu-container a.current:after { } .menu-container a .chev-right { display:none; } .stream-selection.friends-timeline:after, .stream-selection.notifications:after, .stream-selection.my-timeline:after, .stream-selection.public-timeline:after { content: ""; position: absolute; top: 0; left: 50%; margin-left: -35px; width: 70px; height: 55px; background-size: 500px 1329px; background-color:#ccc; } .stream-selection.friends-timeline:after { background-position:0px -861px ; } .stream-selection.notifications:after { background-position:-78px -861px ; } .stream-selection.my-timeline:after { background-position:-150px -861px ; } .stream-selection.public-timeline:after { background-position:-230px -861px ; } .stream-selection.current:after { background-color:transparent; } #feed-header { display: none; } .profile-card { width:100%; border:0 none; margin-bottom:0; border-bottom:1px solid #E8E8E8; border-radius:0 0 0 0; } .modal-body .profile-card { margin-right:0; } .edit-profile-container { width:100%; margin-top:108px; } .profile-card ul.stats li { width:25%; display:inline-block; } .profile-banner-footer ul.stats li a strong { font-size: 16px; } .profile-header-inner, .profile-banner-footer { border-radius:0 0 0 0; } #new-queets-bar { height:55px; line-height:55px; font-size:15px; } #feed { width:101%; margin-left:-1px; } .stream-item.expanded > .queet .stream-item-header { height:50px; } .stream-item.expanded > .queet .stream-item-header .avatar { } .stream-item.expanded > .queet .stream-item-header .name { display:block; float:left; clear:both; } .stream-item.expanded > .queet .stream-item-header .created-at { display:none; } .stream-item.expanded > .queet .stream-item-header .screen-name, .stream-item.expanded > .queet .stream-item-header .reply-to, .stream-item.expanded > .queet .stream-item-header .in-groups { float:left; padding-left:5px; } .stream-item.expanded > .queet .stream-item-header .screen-name { clear:left; padding-left:0px; } .stream-item > .queet a { pointer-events: none; } .stream-item.expanded > .queet a, .stream-item.follow > .queet a, .stream-item.repeat > .queet a, .stream-item.like > .queet a { pointer-events: auto; } .queet:active { background-color:#eee; } .stream-item.expanded > .queet .queet-text { font-size: 16px; line-height: 22px; margin-left: -63px; margin-top: 5px; } .stream-item.expanded > .queet .queet-thumbs { margin-left: -63px; } .show-full-conversation { background-color:#ddd; color: #333333; display: block; float: none; font-style: normal; height: 45px; line-height: 50px; margin-top: -1px; padding: 0; position: relative; right: 0; text-align: center; width: 100%; } .show-full-conversation:before, .show-full-conversation:after { content: ""; position: absolute; top: 0; left:-10px; height:45px; width:0; border-left:10px solid transparent; background-color:#ddd; } .show-full-conversation:after { left:auto; right:-10px; } ul.queet-actions li { margin-right: 30px; } ul.queet-actions li .with-icn { margin-left: 0; } .stream-item:hover > .queet ul.queet-actions { display: none; } .stream-item.expanded:hover > .queet ul.queet-actions { display: block; } .stream-item.expanded > .queet ul.queet-actions { display: block; position:relative; width:100%; border-top: 1px solid #E8E8E8; border-bottom: 1px solid #E8E8E8; height:45px; margin-top:9px; } .queet-content { margin-bottom: -1px; padding-bottom:0; } /* .stream-item.collapsing > .queet ul.queet-actions { display:none !important; } */ ul.queet-actions li .icon.sm-fav, ul.queet-actions li .icon.sm-rt, ul.queet-actions li .icon.sm-trash, ul.queet-actions li .icon.sm-reply { font-size: 25px; height: 45px; width: 45px; margin-right:20px; } ul.queet-actions li .icon.sm-fav { margin-right:0px; } ul.queet-actions li .icon:before { line-height: 45px; width:45px; height: 45px; } @keyframes starpulse { 0% {font-size: 25px;} 50% {font-size: 40px;} 100% {font-size: 25px;} } ul.queet-actions li .icon.sm-reply { background-position: -10px -920px; } ul.queet-actions li .icon.sm-rt { background-position: -60px -920px; } ul.queet-actions li .icon.sm-fav { background-position:-110px -920px; } ul.queet-actions li .icon.sm-trash { background-position:-145px -921px; } .stream-item.expanded > .stream-item.expanded .queet ul.queet-actions li .icon.sm-reply { background-position: -10px -962px; } .stream-item.expanded > .stream-item.expanded .queet ul.queet-actions li .icon.sm-rt { background-position: -60px -962px; } .stream-item.expanded > .stream-item.expanded .queet ul.queet-actions li .icon.sm-fav { background-position:-110px -962px; } .stream-item.expanded > .stream-item.expanded .queet ul.queet-actions li .icon.sm-trash { background-position:-145px -963px; } .queet ul.stats { } .queet ul.stats li.rq-count, .queet ul.stats li.fav-count { padding-left: 5px; text-align: center; } .queet ul.stats li:first-child a { padding-left:0 !important; } .expanded-content { -webkit-transition: none !important; -moz-transition: none !important; -o-transition: none !important; transition: none !important; margin-left:-63px; } .client-and-actions .permalink-link { display:none; } .stream-item:not(.expanded) > .queet .queet-actions { display:none; } .stream-item-expand { display: none; } .stream-item.expanded > .queet .stream-item-expand { display: block; height: 23px; line-height: 23px; margin-top: -40px; padding: 5px 10px; position: absolute; right: 0; } .stream-item:not(.expanded) .queet { padding-bottom: 25px; min-height:30px; } .stream-item.expanded > .queet .stream-item-footer { margin-left: -63px; } .stream-item.expanded > .queet .stream-item-footer .context { display:none; } .stream-item-footer .with-icn .requeet-text { font-size:0; } .stream-item-footer .with-icn .requeet-text a { font-size:12px; } .client-and-actions .metadata { font-size:0; } .client-and-actions .metadata .longdate { font-size:12px; } .modal-footer .queet > .context { font-size: 14px; margin-bottom: 2px; min-height: 17px; padding-left: 59px; } .modal-footer .queet > .context .with-icn .badge-requeeted { left: 32px; } .stream-item.expanded div:last-child, .stream-item.expanded div:first-child, .queet, .view-more-container-top, .stream-item.expanded { border-radius: 0 0 0 0; } .inline-reply-queetbox { display:none; } .modal-container .inline-reply-queetbox { display:block; } .stream-item, .stream-item.expanded, .stream-item > .queet { -webkit-transition: none !important; -moz-transition: none !important; -o-transition: none !important; transition: none !important; } }