1 /* ==========================================================================
11 ========================================================================== */
18 background-color: #eee;
22 background-color: #333;
31 background-color: #fff;
33 box-shadow: 0 1px 8px rgba
(0, 0, 0, 0.9);
48 /* ==========================================================================
50 ========================================================================== */
54 background-color: #000;
71 font-family: "PT Sans", sans-serif
;
72 text-transform: uppercase
;
87 text-decoration: none
;
92 text-decoration: none
;
101 form input
[type
="text"],
102 form input
[type
="number"],
104 form input
[type
="password"],
105 form input
[type
="url"],
106 form input
[type
="email"] {
107 border: 1px solid
#999;
113 @media screen and
(-webkit-min-device-pixel-ratio: 0) {
115 -webkit-appearance: none
;
117 background: #fff url
("../../_global/img/bg-select.png") no-repeat right center
;
122 display: inline-block
;
131 display: inline-block
;
141 margin-bottom: 0.5em;
145 input
[type
="submit"] {
147 background-color: #000;
150 display: inline-block
;
151 border: 1px solid
#000;
156 input
[type
="submit"]:hover
,
157 input
[type
="submit"]:focus
{
158 background-color: #fff;
160 -webkit-transition: all
0.5s ease
;
161 -moz-transition: all
0.5s ease
;
162 -ms-transition: all
0.5s ease
;
163 -o-transition: all
0.5s ease
;
164 transition: all
0.5s ease
;
175 background-color: #000;
196 background-color: #333;
199 box-shadow: inset
-4px 0 20px rgba
(0, 0, 0, 0.6);
213 padding: 0.5em 2em 0.5em 1em;
216 text-transform: uppercase
;
217 text-decoration: none
;
219 font-family: "PT Sans", sans-serif
;
220 -webkit-transition: all
0.5s ease
;
221 -moz-transition: all
0.5s ease
;
222 -ms-transition: all
0.5s ease
;
223 -o-transition: all
0.5s ease
;
224 transition: all
0.5s ease
;
227 #links > li
> a:hover
,
228 #links > li
> a:focus
{
229 background-color: #999;
233 #links .current::after
{
240 border-color: transparent
#eee transparent transparent
;
246 #links li:last-child
{
252 #links li:last-child
a::before
{
260 list-style-type: none
;
262 display: inline-block
;
276 vertical-align: middle
;
280 vertical-align: baseline
;
296 display: inline-block
;
297 text-decoration: none
;
300 #listmode.tablemode
{
301 background-image: url
("../../_global/img/table.png");
302 background-repeat: no-repeat
;
303 background-position: bottom
;
307 background-image: url
("../../_global/img/list.png");
308 background-repeat: no-repeat
;
309 background-position: bottom
;
314 background-color: #ff6347;
322 /* ==========================================================================
324 ========================================================================== */
348 letter-spacing: -5px;
365 .card-entry-labels li {
366 margin: 10px 10px 10px auto
;
367 padding: 5px 12px 5px 25px;
368 background-color: rgba
(0, 0, 0, 0.6);
369 border-radius: 0 3px 3px 0;
374 text-overflow: ellipsis
;
386 .card-entry-tags span {
387 display: inline-block
;
390 background-color: rgba
(0, 0, 0, 0.6);
394 text-overflow: ellipsis
;
398 .card-entry-labels a {
399 text-decoration: none
;
408 .list-entries + .results {
420 .estimatedTime small {
426 background-color: #fff;
427 letter-spacing: normal
;
428 box-shadow: 0 3px 7px rgba
(0, 0, 0, 0.3);
429 display: inline-block
;
431 margin-bottom: 1.5em;
436 padding: 1.5em 1.5em 3em;
445 border-color: transparent transparent
#000;
451 -webkit-transition: all
0.5s ease
;
452 -moz-transition: all
0.5s ease
;
453 -ms-transition: all
0.5s ease
;
454 -o-transition: all
0.5s ease
;
455 transition: all
0.5s ease
;
465 background-color: #000;
466 -webkit-transition: all
0.5s ease
;
467 -moz-transition: all
0.5s ease
;
468 -ms-transition: all
0.5s ease
;
469 -o-transition: all
0.5s ease
;
470 transition: all
0.5s ease
;
474 box-shadow: 0 3px 10px rgba
(0, 0, 0, 1);
477 .entry:hover::after {
481 .entry:hover::before {
490 text-transform: none
;
501 text-decoration: none
;
503 word-wrap: break-word
;
504 -webkit-transition: all
0.5s ease
;
505 -moz-transition: all
0.5s ease
;
506 -ms-transition: all
0.5s ease
;
507 -o-transition: all
0.5s ease
;
508 transition: all
0.5s ease
;
512 max-width: calc
(100% + 3em);
524 .entry h2 a::first-letter {
525 text-transform: uppercase
;
528 .entry:hover .tools {
538 padding-right: 0.5em;
540 -webkit-transition: all
0.5s ease
;
541 -moz-transition: all
0.5s ease
;
542 -ms-transition: all
0.5s ease
;
543 -o-transition: all
0.5s ease
;
544 transition: all
0.5s ease
;
549 text-decoration: none
;
554 .entry .tools a:hover {
559 display: inline-block
;
562 .entry:nth-child(3n+1) {
567 letter-spacing: -5px;
572 display: inline-block
;
574 letter-spacing: normal
;
587 display: inline-flex
;
590 div
.pagination ul
> * {
591 display: inline-block
;
595 div
.pagination ul a
{
597 text-decoration: none
;
600 div
.pagination ul
a:hover
,
601 div
.pagination ul
a:focus
{
602 text-decoration: underline
;
605 div
.pagination ul
.prev
.disabled
,
606 div
.pagination ul
.next
.disabled
{
610 div
.pagination ul
.current
{
613 border: 1px solid
#d5d5d5;
614 text-decoration: none
;
617 background-color: #ccc;
624 /* ==========================================================================
625 2.1 = "save a link" related styles
626 ========================================================================== */
629 background: rgba
(0, 0, 0, 0.5);
637 margin-top: -30% !important
;
640 border-left: 1px #eee solid
;
644 background-color: #fff;
649 border: 10px solid
#000;
655 #bagit-form-form .addurl
{
661 background-color: #000;
668 text-decoration: none
;
674 .close-button:focus {
675 background-color: #999;
679 .close-button--popup {
680 display: inline-block
;
688 background-color: #999;
691 .active-current::after {
698 border-color: transparent
#eee transparent transparent
;
708 .add-to-wallabag-link-after {
709 background-color: #000;
714 a
.add-to-wallabag-link-after
{
718 transition-duration: 2s;
719 transition-timing-function: ease-out
;
722 #article article
a:hover
+ a
.add-to-wallabag-link-after
,
723 a
.add-to-wallabag-link-after:hover
{
726 transition-duration: 0.3s;
727 transition-timing-function: ease-in
;
730 a
.add-to-wallabag-link-after::after
{
743 /* ==========================================================================
745 ========================================================================== */
748 font-family: icomoon
;
749 src: url
("../fonts/IcoMoon-Free.ttf");
755 font-family: 'Material Icons';
758 src: url
(../fonts
/MaterialIcons-Regular
.eot
);
761 src: local
("Material Icons"), local
("MaterialIcons-Regular"), url
(../fonts
/MaterialIcons-Regular
.woff2
) format
("woff2"), url
(../fonts
/MaterialIcons-Regular
.woff
) format
("woff"), url
(../fonts
/MaterialIcons-Regular
.ttf
) format
("truetype");
765 font-family: 'Material Icons';
768 font-size: 1em; /* Preferred icon size */
771 display: inline-block
;
773 text-transform: none
;
774 letter-spacing: normal
;
779 /* Support for all WebKit browsers. */
780 -webkit-font-smoothing: antialiased
;
782 /* Support for Safari and Chrome. */
783 text-rendering: optimizeLegibility
;
785 /* Support for Firefox. */
786 -moz-osx-font-smoothing: grayscale
;
788 /* Support for IE. */
789 font-feature-settings: 'liga';
792 .material-icons.md-18 { font-size: 18px; }
793 .material-icons.md-24 { font-size: 24px; }
794 .material-icons.md-36 { font-size: 36px; }
795 .material-icons.md-48 { font-size: 48px; }
803 [class^
="icon-"]::before
,
804 [class
*=" icon-"]::before
{
805 font-family: icomoon
;
809 font-variant: normal
;
810 text-transform: none
;
813 /* Enable Ligatures ================ */
815 -webkit-font-feature-settings: "liga";
816 -moz-font-feature-settings: "liga=1";
817 -moz-font-feature-settings: "liga";
818 -ms-font-feature-settings: "liga" 1;
819 -o-font-feature-settings: "liga";
820 font-feature-settings: "liga";
822 /* Better Font Rendering =========== */
823 -webkit-font-smoothing: antialiased
;
824 -moz-osx-font-smoothing: grayscale
;
827 .icon-flattr::before {
835 .icon-up-open::before {
843 .icon-check::before {
851 .icon-reply::before {
859 .icon-clock::before {
863 .icon-twitter::before {
867 .icon-down-open::before {
871 .icon-trash::before {
875 .icon-delete::before {
879 .icon-power::before {
883 .icon-arrow-up-thick::before {
891 .icon-print::before {
895 .icon-reload::before {
899 .icon-price-tags::before {
907 .icon-no-eye::before {
911 .icon-calendar::before {
915 .icon-pencil2::before {
919 .icon-users::before {
927 /* .icon-image class, for image-based icons
928 ========================================================================== */
931 background-size: 16px 16px;
932 background-repeat: no-repeat
;
933 background-position: center
;
934 padding-right: 1em !important
;
935 padding-left: 1em !important
;
938 /* Carrot (http://carrot.org) */
939 .icon-image--carrot {
940 background-image: url
("../../_global/img/icons/carrot-icon--white.png");
944 .icon-image--diaspora {
945 background-image: url
("../../_global/img/icons/diaspora-icon--black.png");
949 .icon-image--unmark {
950 background-image: url
("../../_global/img/icons/unmark-icon--black.png");
954 .icon-image--shaarli {
955 background-image: url
("../../_global/img/icons/shaarli.png");
959 .icon-image--scuttle {
960 background-image: url
("../../_global/img/icons/scuttle.png");
963 /* ==========================================================================
965 ========================================================================== */
967 .icon-star.fav::before {
971 .icon-check.archive::before {
975 /* ==========================================================================
977 ========================================================================== */
985 display: inline-block
;
1004 /* ==========================================================================
1006 ========================================================================== */
1011 text-align: justify
;
1023 border: 1px solid
#999;
1024 background-color: #fff;
1036 text-transform: none
;
1039 #article h2::after
{
1054 #article_toolbar li
{
1055 display: inline-block
;
1059 #article_toolbar a
{
1060 background-color: #000;
1061 padding: 0.3em 0.5em 0.2em;
1063 text-decoration: none
;
1066 #article_toolbar a:hover
,
1067 #article_toolbar a:focus
{
1068 background-color: #999;
1084 text-decoration: none
;
1090 margin-right: 0.5em;
1099 background-color: #000;
1101 padding: 0.2em 0.5em;
1110 margin-bottom: 0.5em;
1113 .list-tags
.icon-rss:hover
,
1114 .list-tags .icon-rss:focus {
1115 background-color: #fff;
1117 text-decoration: none
;
1121 text-decoration: none
;
1125 .list-tags a:focus {
1126 text-decoration: underline
;
1130 font-family: "Courier New", Courier
, monospace
;
1139 background-color: #fff;
1141 padding-right: 30px;
1143 border-left: 1px #333 solid
;
1148 #filters form
.filter-group
{
1158 background-color: #fff;
1160 padding-right: 30px;
1162 border-left: 1px #333 solid
;
1169 padding: 0.5em 2em 0.5em 1em;
1172 text-transform: uppercase
;
1173 text-decoration: none
;
1175 font-family: PT Sans
, sans-serif
;
1176 transition: all
0.5s ease
;
1179 /* ==========================================================================
1181 ========================================================================== */
1183 @media screen and
(max-width: 1050px) {
1188 .entry:nth-child(3n+1) {
1192 .entry:nth-child(2n+1) {
1197 @media screen and
(max-width: 900px) {
1207 @media screen and
(max-width: 700px) {
1218 @media screen and
(max-height: 770px) {
1226 @media screen and
(max-width: 500px) {
1233 background-color: #333;
1241 #links li:last-child
{
1246 #links li:last-child
a::before
{
1271 margin-left: -37.5px;
1284 background-color: #999;
1289 .desktopHide:focus {
1290 background-color: #fff;
1311 padding-right: 1.5em;
1316 .card-entry-labels {
1320 #article_toolbar .topPosF
{
1332 #article_toolbar a
{
1333 padding: 0.3em 0.4em 0.2em;