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

474 lines
8.1 KiB

body {
background-color: #e6e6e6;
font-style: normal;
font-weight: 400;
font-size: 1.5em;
font-family: 'HiLo-DecoRegular';
padding: 20px;
margin: 0;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: 100%;
@media (min-width: 992px) {
padding: 35px 50px;
}
}
h2,
h3,
h4,
h5 {
margin: 45px 0 25px;
}
img {
max-width: 100%;
}
a {
outline: none;
color: inherit;
text-decoration: none;
border-bottom: 1px solid #555;
&.image {
display: block;
text-align: center;
border: 0;
border-radius: 5px;
margin: 30px 0;
}
}
mark {
background: #fffc76;
padding: 0 5px;
}
blockquote {
border-left: 5px solid #ccc;
margin: 40px 0;
padding: 5px 30px;
background: #eee;
}
.logo {
position: relative;
margin: 0 auto 35px;
text-align: center;
animation-duration: 0.7s;
animation-fill-mode: both;
animation-name: bounce;
-webkit-animation-duration: 0.7s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: bounce;
a {
background: #e6e6e6 url("gravatar_wrapper.svg");
text-decoration: none;
font-weight: 700;
height: 100px;
width: 100px;
font-size: 2.25em;
border-radius: 100%;
display: inline-block;
text-align: center;
line-height: 100px;
border: 5px solid #e6e6e6;
box-sizing: border-box;
-webkit-transition-duration: 0.8s;
transition-duration: 0.8s;
&:hover,
&:focus {
background: #f14e32;
}
&:hover + .logo-prompt,
&:focus + .logo-prompt {
display: inline-block !important;
}
.avatar {
margin-top: 5px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
@media (max-width : 480px) {&:hover + .logo-prompt,
&:focus + .logo-prompt {
display: none !important;
}
}
}
.logo-prompt {
position: absolute;
display: none;
vertical-align: middle;
padding: 5px;
border-radius: 3px;
background: #666;
background: rgba(0,0,0,0.5);
margin-left: 15px;
color: #fff;
font-size: 1.23525em;
text-align: center;
line-height: 1.2;
top: 50%;
margin-top: -10px;
&:before {
content: "";
border-width: 5px 5px 5px 0;
border-style: solid;
border-color: transparent #666;
border-color: transparent rgba(0,0,0,.5);
position: absolute;
top: 50%;
left: -5px;
margin-top: -5px;
}
}
}
iframe {
margin: 45px 0 !important;
}
ul,
ol {
list-style-type: circle;
margin: 40px 0;
padding-left: 50px;
li {
word-wrap: break-word;
}
img {
margin: 40px 0;
border-radius: 5px;
}
}
sup {
vertical-align: top;
position: relative;
top: -0.5em;
margin-left: 1px;
}
time {
color: #555;
}
code,
pre {
font-family: Consolas, monospace, x;
}
code {
color: #f14e32;
background: #eee;
padding: 2px 6px;
font-size: 15.0px;
}
pre {
display: block;
margin-top: 0;
margin-bottom: 1rem;
font-size: 1.6rem;
line-height: 1.4;
white-space: pre;
overflow-x: auto;
background-color: #f9f9f9;
border: 1px solid #ddd;
padding: 1rem;
code {
/* font-size: 100%; */
color: inherit;
background-color: transparent;
padding: 0;
}
}
table {
width: 100%;
table-layout: fixed;
margin: 45px 0;
thead {
background: #f2f2f2;
}
th {
text-align: left;
padding: 8px 10px;
border-bottom: 15px solid #fff;
}
td {
padding: 4px 0;
}
}
iframe {
width: 100%;
}
article {
max-width: 500px;
margin: 0 auto;
.title {
line-height: 1.4em;
text-align: center;
}
.divider {
background: #ddd;
background: -webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(#ccc),to(rgba(255,255,255,0)));
background: -webkit-linear-gradient(left,rgba(255,255,255,0),#ccc,rgba(255,255,255,0));
background: linear-gradient(to right,rgba(255,255,255,0),#ccc,rgba(255,255,255,0));
height: 1px;
margin: 2em 0;
}
.center {
text-align: center;
margin: 0 auto;
}
hr {
border: 0;
border-bottom: 1px solid #000;
margin: 30px 0;
}
p {
font-size: 22.5px;
line-height: 1.9em;
word-wrap: break-word;
}
.comment {
font-size: 22.5px;
line-height: 1.9em;
word-wrap: break-word;
padding-top: 5px;
padding-bottom: 5px;
.comment-headers {
font-style: italic;
font-weight: bold;
}
}
.tag-list {
font-size: 20px;
color: #555;
a {
-webkit-transition-duration: 0.4s;
transition-duration: 0.4s;
white-space: nowrap;
text-decoration: none;
width: 30px;
height: 15px;
border-radius: 8px;
color: #000000;
border: none;
background-color: #d6d6d6;
text-align: center;
}
a:hover {
background: #ffffff;
}
}
.footnote {
border: 0;
color: #0087BE;
}
.footnotes {
margin: 50px auto;
display: block;
p {
line-height: 1rem;
font-weight: normal;
}
ol {
margin: 0;
padding-left: 15px;
li {
font-weight: bold;
}
}
.reversefootnote {
border: 0;
color: #0087BE;
}
}
}
.tag-posts {
a {
text-decoration: none;
border: none;
}
color: #000000;
}
.back {
text-align: center;
a {
text-decoration: none;
margin: 40px auto 0;
display: inline-block;
padding: 10px;
border: 0;
&:before {
content: "<<";
margin-right: 5px;
color: #000;
}
}
}
.page-navigation,
.footer {
text-align: center;
max-width: 500px;
margin: 0 auto;
font-size: 1.6rem;
}
.page-navigation {
margin: 50px auto 0 auto;
a {
display: inline-block;
text-decoration: none;
border-bottom: none;
}
span {
display: inline-block;
}
}
.footer {
margin-top: 50px;
color: #777;
a {
border: none;
font-weight: bold;
}
.block {
display: block;
.copyright {
img {
width: 80px;
height: auto;
}
}
.rss {
img {
width: 48px;
height: auto;
}
}
}
}
section {
max-width: 500px;
margin: 0 auto 50px auto;
ul {
list-style: none;
margin: 0;
padding: 0;
li {
margin: 25px 0;
.title {
max-width: 100%;
//overflow: hidden !important;
//text-overflow: ellipsis !important;
//white-space: nowrap !important;
word-wrap: normal !important;
}
a {
text-decoration: none;
border: 0;
color: #000;
box-sizing: border-box;
}
.post-date {
float: right;
margin: 0 0 0 20px;
}
span {
display: inline-block;
color: #757575;
letter-spacing: 1px;
text-transform: uppercase;
}
.excerpt {
padding-top: 20.0px;
font-style: italic;
font-size: 20.0px;
color: #555;
}
@media (min-width: 992px) {a {
border-bottom: 2px solid transparent;
&:hover {
border-color: #000;
}
}
}
}
}
}
.main {
font-size: 20px;
text-align: center;
margin-bottom: 30px;
margin-top: 15px;
a {
color: #000000;
background-color: #d6d6d6;
text-align: center;
-webkit-transition-duration: 0.4s;
transition-duration: 0.4s;
white-space: nowrap;
text-decoration: none;
width: 40px;
height: 15px;
border: none;
}
a:hover {
background: #ffffff;
}
}
@keyframes bounce {0% {
transform: translate3d( 0, -1000px, 0 );
}
60% {
transform: translate3d( 0, 25px, 0 );
}
75% {
transform: translate3d( 0, -10px, 0 );
}
90% {
transform: translate3d( 0, 5px, 0 );
}
100% {
transform: none;
}
}
@-webkit-keyframes bounce {0% {
-webkit-transform: translate3d( 0, -1000px, 0 );
}
60% {
-webkit-transform: translate3d( 0, 25px, 0 );
}
75% {
-webkit-transform: translate3d( 0, -10px, 0 );
}
90% {
-webkit-transform: translate3d( 0, 5px, 0 );
}
100% {
-webkit-transform: none;
}
}
/* Reset margin and padding for the comments class. */
body {
margin:0;
padding: 0;
}
.comment-environment {
background-color: #f2f2f2;
}