選択できるのは25トピックまでです。
トピックは、先頭が英数字で、英数字とダッシュ('-')を使用した35文字以内のものにしてください。
302 行
6.5 KiB
302 行
6.5 KiB
/*-------------------------
|
|
Simple reset
|
|
--------------------------*/
|
|
|
|
|
|
*{
|
|
margin:0;
|
|
padding:0;
|
|
}
|
|
|
|
|
|
/*-------------------------
|
|
General Styles
|
|
--------------------------*/
|
|
|
|
|
|
html{
|
|
|
|
}
|
|
|
|
body{
|
|
font:15px/1.3 Arial, sans-serif;
|
|
color: #4f4f4f;
|
|
}
|
|
|
|
a, a:visited {
|
|
outline:none;
|
|
color:#389dc1;
|
|
}
|
|
|
|
a:hover{
|
|
text-decoration:none;
|
|
}
|
|
.Site {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%; /* 1, 3 */
|
|
}
|
|
|
|
.Site-header,
|
|
.Site-footer {
|
|
flex: none; /* 2 */
|
|
}
|
|
|
|
.Site-content {
|
|
flex: 1 0 auto; /* 2 */
|
|
padding: var(--space) var(--space) 0;
|
|
width: 100%;
|
|
}
|
|
.Site-content::after {
|
|
content: '\00a0'; /* */
|
|
display: block;
|
|
margin-top: var(--space);
|
|
height: 0px;
|
|
visibility: hidden;
|
|
}
|
|
@media (--break-lg) {
|
|
.Site-content {
|
|
padding-top: var(--space-lg);
|
|
}
|
|
.Site-content::after {
|
|
margin-top: var(--space-lg);
|
|
}
|
|
}
|
|
|
|
.Site-content--full {
|
|
padding: 0;
|
|
}
|
|
.Site-content--full::after {
|
|
content: none;
|
|
}
|
|
footer {
|
|
position: fixed;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
background-color: #efefef;
|
|
text-align: center;
|
|
}
|
|
|
|
/*----------------------------
|
|
Headings
|
|
-----------------------------*/
|
|
|
|
|
|
h1{
|
|
font: 14px 'Open Sans Condensed', sans-serif;
|
|
text-transform:uppercase;
|
|
margin-bottom: 24px;
|
|
}
|
|
|
|
h2{
|
|
font: 48px 'Open Sans Condensed', sans-serif;
|
|
}
|
|
|
|
h1 a, h2 a{
|
|
color:#4f4f4f !important;
|
|
text-decoration: none !important;
|
|
}
|
|
|
|
|
|
/*----------------------------
|
|
Content & Posts
|
|
-----------------------------*/
|
|
|
|
|
|
#content{
|
|
position: absolute;
|
|
font: 16px/1.5 'PT Serif', Times, Cambria, serif;
|
|
width: 580px;
|
|
left: 50%;
|
|
margin-left: -100px;
|
|
}
|
|
|
|
#content p,
|
|
#content ul{
|
|
margin-bottom:25px;
|
|
}
|
|
|
|
#content ul{
|
|
padding-left:20px;
|
|
}
|
|
|
|
#content li{
|
|
margin-bottom:5px;
|
|
}
|
|
|
|
#content div.actions{
|
|
margin-top:25px;
|
|
font-size:14px;
|
|
font-family:'Open Sans Condensed', sans-serif;
|
|
}
|
|
|
|
#content div.actions .readmore{
|
|
text-decoration: none !important;
|
|
padding:0 2px;
|
|
}
|
|
|
|
#content div.actions .readmore:hover{
|
|
background-color:#389dc1;
|
|
color:#fff;
|
|
}
|
|
|
|
#content div.actions .comments{
|
|
color:#ccc;
|
|
margin-left:10px;
|
|
text-decoration:none;
|
|
}
|
|
|
|
.post{
|
|
padding: 50px 0 15px 0;
|
|
border-bottom: 1px solid #dfdfdf;
|
|
}
|
|
|
|
.post .date{
|
|
font: bold 12px 'Open Sans Condensed', sans-serif;
|
|
text-transform: uppercase;
|
|
color: #a7a7a7;
|
|
margin: 24px 0 30px 20px;
|
|
position: relative;
|
|
}
|
|
|
|
.post .date:before{
|
|
width:18px;
|
|
height:18px;
|
|
position:absolute;
|
|
content:'';
|
|
left: -22px;
|
|
top: -1px;
|
|
background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2RpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoyNjZDQjA1OTM1ODZFMjExQUUwM0IwQzQwMjlEOTczMyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpENjYzQjI4QjhCNDYxMUUyQjNENkFGQ0NCRUExRDM1NSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpENjYzQjI4QThCNDYxMUUyQjNENkFGQ0NCRUExRDM1NSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IFdpbmRvd3MiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4NjA1NUJCNzUzOEFFMjExQUUwM0IwQzQwMjlEOTczMyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyNjZDQjA1OTM1ODZFMjExQUUwM0IwQzQwMjlEOTczMyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PhTXJRoAAADXSURBVHjaYvz//z8DNQDL7t27sYmDTGfEoQdDztXVlYEJyg4B4rdA/AGLJhjGJgfS4wfiwAyaCcRCQMwGxMxQMTY0jdjkQHqmwQzihwqAACcQ50CdXoRmEC45aXAYYQmDCVDMQIocskGMZEbYB+QwQokBEAaCzch8dDF0wMRAJcC4a9cufqjzYF7bTKReX5jXgC4UYMHiNbACYEJ9AaQkkL2BLIaekIeA15AUbEZiM+ARo67XQAZ9BOJ3eFxGSOwFcspOBOLnoBgh0SEgQ+LAgU2tgg0gwACqTkAIjemp4gAAAABJRU5ErkJggg==')
|
|
}
|
|
|
|
/*----------------------------
|
|
Pagination buttons
|
|
-----------------------------*/
|
|
|
|
|
|
.pagination-circular li.current {
|
|
border: 1px solid #1779ba;
|
|
border-radius: 5000px;
|
|
padding: 0.285em 0.8em;
|
|
font-size: 18px;
|
|
}
|
|
|
|
.pagination-circular li.disabled {
|
|
border: 1px solid #cacaca;
|
|
padding: 0.285em 0.8em;
|
|
border-radius: 5000px;
|
|
font-size: 18px;
|
|
}
|
|
|
|
.pagination-circular a {
|
|
border-radius: 5000px;
|
|
padding: 0.285em 0.8em;
|
|
border: 1px solid #1779ba;
|
|
font-size: 18px;
|
|
}
|
|
|
|
.pagination-circular li:not(.disabled):hover a {
|
|
background: #1779ba;
|
|
color: #fefefe;
|
|
}
|
|
|
|
.pagination-circular li a {
|
|
transition: background 0.15s ease-in, color 0.15s ease-in;
|
|
}
|
|
|
|
|
|
.pagination-pointed .pagination-previous::after {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
left: -18px;
|
|
width: 0;
|
|
height: 0;
|
|
border-bottom: 17px solid transparent;
|
|
border-top: 17px solid transparent;
|
|
border-right: 17px solid #2c3840;
|
|
transition: all 0.2s linear;
|
|
}
|
|
|
|
|
|
|
|
/*----------------------------
|
|
The 404 page
|
|
-----------------------------*/
|
|
|
|
|
|
.message{
|
|
padding-top:50px;
|
|
}
|
|
|
|
.message h1{
|
|
font-size:36px;
|
|
margin-bottom: 18px;
|
|
}
|
|
|
|
.message p{
|
|
font-size:13px;
|
|
}
|
|
|
|
.center{
|
|
text-align:center;
|
|
}
|
|
|
|
|
|
/*----------------------------
|
|
Media queries
|
|
-----------------------------*/
|
|
|
|
|
|
@media all and (max-width: 1024px) {
|
|
aside{
|
|
left: 5%;
|
|
margin-left: 0;
|
|
width: 25%;
|
|
}
|
|
|
|
#content{
|
|
left: 35%;
|
|
margin-left: 0;
|
|
width: 60%;
|
|
}
|
|
}
|
|
|
|
@media all and (max-width: 840px) {
|
|
|
|
h2{
|
|
font-size:36px;
|
|
}
|
|
|
|
aside{
|
|
margin-left: 0;
|
|
position: static;
|
|
width: 90%;
|
|
padding: 5% 5% 0 5%;
|
|
text-align: center;
|
|
}
|
|
|
|
aside .description{
|
|
margin-bottom: 25px;
|
|
}
|
|
|
|
aside li {
|
|
display: inline-block;
|
|
}
|
|
|
|
aside ul{
|
|
text-align: center;
|
|
}
|
|
|
|
aside .author{
|
|
display: none;
|
|
}
|
|
|
|
#content{
|
|
position: static;
|
|
padding: 5%;
|
|
padding-top: 0;
|
|
width: 90%;
|
|
}
|
|
}
|