-* {
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
-}
-
-body {
- margin: 10px;
- font-family: 'Roboto',Verdana,Geneva,sans-serif;
- font-size: 16px;
- color: #000;
-}
-
-h1 span {
- color #FFF;
- background: #000;
- display: inline-block;
- padding: 0.2em 1em 0.2em 1.2em;
- font-size: 0.7em;
- position: relative;
- top: -1em;
- left: -1em;
-}
-
-h1 a {
- color: #FFF;
- text-decoration: none;
-}
-
-#menu {
- font-family: 'fontello';
- position:fixed;
- z-index: 11;
- top: 0.7em;
- right: 0.5em;
- border:0;
- font-size: 2em;
- background: #000;
- color:#FFF;
- height: 58px;
- width: 58px;
- line-height:58px;
- border-radius:120px;
-}
-
-#menu:hover, #menu:focus {
- background: #FFF;
- color:#000;
- cursor: pointer;
-}
-
-#menu span {
- position: absolute;
- top: -99999px;
-}
-
-#menuContainer ul, #article_toolbar ul {
- position:fixed;
- top: 0;
- left:0;
- width: 100%;
- padding: 0;
- margin: 0;
- text-align:center;
- height:80px;
-}
-
-/*Inspired by http://tympanus.net/Tutorials/AnimatedBorderMenus/index.html */
-
-#menuContainer, #article_toolbar {
- position: fixed;
- top: 0;
- left:0;
- width: 100%;
- height: 0;
- overflow: hidden;
- border-width:0;
- border-style: solid;
- border-color:#000;
- background-color: transparent;
- -webkit-transition: border-width 0.3s, background-color 0.3s, height 0s 0.3s;
- -moz-transition: border-width 0.3s, background-color 0.3s, height 0s 0.3s;
- transition: border-width 0.3s, background-color 0.3s, height 0s 0.3s;
-}
-
-#article_toolbar ul {
- padding: 1.7em;
-}
-
-#menuContainer.open, #article_toolbar.open {
- border-width:80px;
- height: 100%;
- background: rgba(0,0,0,0.5);
- -webkit-transition: border-width 0.3s, background-color 0.3s;
- -moz-transition: border-width 0.3s, background-color 0.3s;
- transition: border-width 0.3s, background-color 0.3s;
- z-index: 1;
-}
-
-#links li, #article_toolbar li {
- list-style: none;
- display: inline-block;
-}
-
-#links li a, #article_toolbar a {
- color:#FFF;
- display: block;
- position:relative;
- top: -200px;
- -webkit-transition: top 0.3s ease;
- -moz-transition: top 0.3s ease;
- transition: top 0.3s ease;
- padding:1.85em 1em;
-}
-
-#links li a {
- text-decoration:none;
- text-transform:uppercase;
-}
-
-#links li a:hover, #links li a:focus {
- background: #FFF;
- color:#000;
-}
-
-#menuContainer.open li a, #article_toolbar.open a {
- top: 0;
- -webkit-transition: top 0.3s ease;
- -moz-transition: top 0.3s ease;
- transition: top 0.3s ease;
- -webkit-transition-delay:0.25ms;
- -moz-transition-delay:0.25ms;
- transition-delay:0.25ms;
-}
-
-#menuContainer.open li:nth-child(2) a {
- -webkit-transition-delay:0.50ms;
- -moz-transition-delay:0.50ms;
- transition-delay:0.50ms;
-}
-
-#menuContainer.open li:nth-child(3) a {
- -webkit-transition-delay:1ms;
- -moz-transition-delay:1ms;
- transition-delay:1ms;
-}
-
-#menuContainer.open li:nth-child(4) a {
- -webkit-transition-delay:1.25ms;
- -moz-transition-delay:1.25ms;
- transition-delay:1.25ms;
-}
-
-#menuContainer.open li:nth-child(5) a {
- -webkit-transition-delay:1.55ms;
- -moz-transition-delay:1.55ms;
- transition-delay:1.55ms;
-}
-
-#article_toolbar li:nth-child(2) { display: none; }
-
-#menu:before {
- content: "\e801";
- display: block;
- text-indent: 0;
-}
-
-body > header {
- position: fixed;
- top: 0;
- left: 1em;
- z-index: 10;
-}
-
-#main {
- padding:6em;
-}
-
-/* ==========================================================================
- entrie
- ========================================================================== */
-
-.entrie, #article {
- width: 45em;
- margin: auto;
- position:relative;
- padding: 0 0 1em 0;
- margin-bottom: 1.5em;
-}
-
-#article a {
- text-decoration: underline;
- color:#000;
-}
-
-#article a:hover, #article a:focus {
- text-decoration: none;
-}
-
-.entrie:after {
- content:"";
- position: absolute;
- width: 100%;
- height: 4px;
- background: #000;
- bottom:0;
- left: -1em;
-}
-
-.entrie p {
- padding:0 0 0 1.5em;
-}
-
-.entrie:before {
- content:'';
- position: absolute;
- top: 0;
- left: -1em;
- width: 4px;
- height: 100%;
- background: #000;
-}
-
-.entrie h2:after {
- content:"";
- display: block;
- width: 0;
- height: 0;
- border-color: #000;
- border-width:7px;
- border-color:transparent transparent transparent #000;
- border-style: solid;
- position: absolute;
- top: 0.8em;
- right: -0.58em;
-}
-
-.entrie h2 {
- margin:0;
- display: inline-block;
- position: relative;
- max-width: 78%;
-}
-
-.entrie h2 a {
- color:#000;
- text-decoration:none;
- display: block;
- background: #000;
- padding: 0.4em 1em;
- color:#FFF;
- margin-left: -0.5em;
- -webkit-transition: all 0.3s ease-out;
- -moz-transition: all 0.3s ease-out;
- transition: all 0.3s ease-out;
-}
-
-.entrie h2 a:hover, .entrie h2 a:focus {
- padding:0.4em 1em 0.4em 2em;
-}
-
-ul {
- padding:0;
- margin:0;
-}
-
-ul li {
- list-style: none;
-}
-
-.tools {
- display: inline-block;
- margin-left: 1em;
- vertical-align: top;
- padding-top: 1em;
-}
-
-.tools a span {
- position:absolute;
- top: -99999px;
-}
-
-.tools li {
- display: inline-block;
-}
-
-.tools a {
- display: block;
- color:#FFF;
- background: #000;
- text-decoration:none;
- height: 1.5em;
- width: 1.5em;
- text-align: center;
- line-height:1.5em;
- border-radius: 90px;
-}
-
-.tools a:hover, .tools a:focus {
- background: #FFF;
- color:#000;
-}
-
-.tools a:before { display: block; font-family: 'icomoon'; }
-
-
-.fav-off:before, .fav:before { content: '\e805'; } /* '' */
-.archive-off:before, .archive:before { content: '\e804'; } /* '' */
-.tools .archive, .tools .fav {
- background: #FFF;
- color:#000;
-}
-.link:before { content: '\e801'; } /* '' */
-.delete:before { content: '\e80c'; } /* '' */
-.reading-time:before { content: '\e803'; } /* '' */
-
-#article_toolbar a:before {
- display: block;
- font-family: 'icomoon';
-}
-
-#article_toolbar a {
- display: block;
- color:#000;
- background: #FFF;
- text-decoration:none;
- height: 1.5em;
- width: 1.5em;
- text-align: center;
- line-height:1.5em;
- border-radius: 90px;
- padding: 0;
-}
-
-#article_toolbar a:hover, #article_toolbar a:focus {
- background: #000;
- color:#FFF;
-}
-
-#article_toolbar span {
- position: absolute;
- top: -99999px;
-}
-
-.email:before { content: '\e80a'; } /* '' */
-.icon-check:before { content: '\e804'; } /* '' */
-.back:before { content: '\e806'; } /* '' */
-.flattr:before { content: '\e800'; } /* '' */
-.bad-display:before { content: '\e600'; } /* '' */
-.twitter:before { content: '\e807'; } /* '' */
-
-#article_toolbar .flattrli {
- display: none;
-}
-
-#article_toolbar li {
- margin: 0 0 0 1em;
-}
-
-
-footer {
- position: fixed;
- bottom: 0;
- width: 100%;
- padding: 0 2%;
- left: 0;
- text-align:right;
- font-size: 0.8em;
- font-style: italic;
- background: rgba(255,255,255,0.5);
-}
-
-footer a {
- color:#000;
-}
-
-footer a:hover,footer a:focus {
- text-decoration: none;
-}
-
-footer p:first-child {
- float:left;
-}
-
-#loginForm fieldset {
- border:5px solid #000;
- padding: 1.5em;
-}
-
-fieldset {
- border:0;
- padding: 0;
-}
-
-#loginForm {
- max-width: 25em;
- margin: auto;
-}
-
-#loginForm .row {
- margin-bottom: 0.5em;
-}
-
-form h2 {
- margin-top: 0;
-}
-
-form label {
- width: 40%;
- display: inline-block;
-}
-
-form input[type="text"], form input[type="password"], form input[type='url'], form select {
- border:1px solid #000;
- padding:0.5em 1em;
-}
-
-@media screen and (-webkit-min-device-pixel-ratio:0){
- form select{
- -webkit-appearance: none;
- background: url(../img/bg-select.png) no-repeat right center;
- padding-right: 2.2em;
- border-radius: 0;
- }
-}
-
-form button, form input[type="submit"] {
- background: #000;
- color:#FFF;
- border:0;
- font-size:1em;
- padding:0.5em 1em;
- margin-top: 1em;
- cursor: pointer;
-}
-
-form button:hover, form button:focus, form input[type="submit"]:hover, form input[type="submit"]:focus {
- background: #FFF;
- color: #000;
-}
-
-/* ==========================================================================
- Config
- ========================================================================== */
-
-#config {
- max-width: 60%;
- margin: auto;
-}
-
-#config a {
- background: #000;
- text-decoration: none;
- color:#FFF;
- padding: 0.2em 1em;
-}
-
-#config .special {
- background: none;
- padding:0;
- color: #000;
-}
-
-#config a:hover, #config a:focus {
- background: #FFF;
- color:#000;
-}
-
-#config li {
- margin-bottom: 1em;
-}
-
-#plainurl {
- font-size: 1em;
-}
-
-#config label {
- width: 20%;
-}
-
-.results {
- max-width: 62.5%;
- font-style:italic;
- margin: 1em auto 2.5em;
-}
-
-#sort {
- max-width: 62.5%;
- margin: 0 auto -2.5em;
- text-align: right;
- border-bottom:1px dotted #000;
-}
-
-#sort li {
- display: inline-block;
- vertical-align: top;
- position: relative;
- top: -0.1em;
- margin-left: 1em;
-}
-
-#sort li img {
- display: none;
-}
-
-#sort a {
- display: inline-block;
- font-family: 'fontello';
- color:#000;
- text-decoration: none;
-}
-
-#sort a:hover, #sort a:focus {
- text-decoration: underline;
-}
-
-#sort a:before {
- display: block;
-}
-
-#sort li a:first-child:before {
- content: '\e809';
-}
-
-#sort li a:first-child + a:before {
- content: '\e80b';
-}
-
-@media screen and (max-width: 860px) {
- .entrie, #article {
- width: 30em;
- }
-}
-
-@media screen and (max-width: 650px) {
- #menuContainer ul, #article_toolbar ul {
- width: 120px;
- height: 100%;
- }
-
- body > header {
- position: static;
- }
-
- #main {
- padding: 0 0.5em 6em;
- }
-
- #menu {
- display: none;
- }
-
- #main:before {
- content:none;
- }
-
- #menuContainer, #article_toolbar, #menuContainer ul, #article_toolbar ul {
- position: static;
- width: 100%;
- height: auto;
- }
-
- #links li a, #article_toolbar a {
- position: static;
- color: #000;
- }
-
- #links li a {
- padding: 1em;
- min-width: 120px;
- text-align: left;
- }
-
- #article_toolbar li {
- margin-bottom: 1em;
- margin-left: 0.5em;
- }
-
-}
-
-@media screen and (max-width: 500px) {
- .entrie, #article {
- width: 17em;
- }
- .entrie h2 {
- width: 100%;
- max-width: none;
- }
- .entrie h2 a:hover, .entrie h2 a:focus {
- padding-left: 1em;
- background: #FFF;
- color: #000;
- }
- .entrie h2:after {
- content:none;
- }
-
- .messages {
- width: 100%!important;
- }
-
- #sort {
- margin: 3em auto 0;
- max-width: none;
- text-align: center;
- }
- #config {
- margin: 7em auto 0;
- max-width: none;
- }
- #config label { width: 100%; }
- .results {
- max-width: none;
- margin-bottom: 1em;
- }
-
- footer p:first-child {
- float: none;
- }
- footer {
- position:static;
- }
-}
-
-
-.w600p {
- width: 70%;
- margin: auto;
-}
-
-.tagForm {
- margin: 1em 0;
-}
-
-.tagForm p {
- font-style: italic;
- margin: 0;
- font-size: 0.8em;
- color: #999;
-}
-
-.tagForm label {
- width: auto;
- margin-right: 1em;
-}
-
-.back:before {
- font-family: "icomoon";
-}
-
-.back.link {
- color: #000;
- text-decoration: none;
-}
-
-.back.link:before {
- margin-right: 0.5em;
-}
-
-.tag-list a {
- color: #000;
- text-decoration: none;
-}
-
-.tag-list li {
- display: inline-block;
- margin-right: 1em;
-}
-
-a:hover {
- text-decoration: underline;
-}
-
-.tag {
- background: #000;
- color: #FFF;
- padding: 0.5em 1em;
- text-decoration: none;
-}
-
-.tag:hover, .tag:focus {
- background: #FFF;
- color: #000;
-}
\ No newline at end of file