Hue. - 01 - Niitty

Souce code

HEAD

/*--------------- 初期値 ---------------*/
*{ margin: 0; padding: 0; box-sizing: border-box;}
body{
color: #111;
font-size: 12px;
font-family: 'Meera Inimai', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, sans-serif;
line-height: 2em;
letter-spacing: 1.9px;
word-break:break-all;
-webkit-tap-highlight-color:rgba(0,0,0,0);
}
img{ max-width: 100%;}
a{
text-decoration: none;
color: #a50e32;
}
a:hover{
color: #c5c0c1;
}

/*--------------- レイアウト ---------------*/
#wrap,section{
width: 400px;
max-width: 85%;
margin: 80px auto 0;
}
#wrap{ text-align: center;}
.rank{
font-size: 10px;
line-height: 1.6em;
background-color: #f3f3f3;
margin: 2em 0 0;
padding: 0.5em;
}
.rank a{
display: inline-block;
padding: 2px;
}
footer{
text-align: center;
margin: 1em 0;
}
/*--------------- メニュー ---------------*/
nav{ margin: 3em 0 0;}
nav a{
display: inline-block;
color: #111;
border-bottom: 1px solid transparent;
margin: 0 0.7em;
padding: 0 1px;
}
nav a:hover{ border-bottom: 1px solid #a50e32;}

/*--------------- 見出し、文字 ---------------*/
h1,h2,h3,.sub{ font-family: 'Meera Inimai', "小夏", sans-serif;}
.sub{
display: block;
height: 12px;
color: #c5c0c1;
font-size: 10px;
font-weight: normal;
line-height: 12px;
background: linear-gradient(#fff 5px, #111 5px, #fff 6px);
}
.sub span{
background-color: #fff;
padding: 0 0.5em;
}
h2{
text-align: center;
margin: 0 0 40px;
}
h3{ margin: 30px 0 5px;}
h3:before{
content: " ";
display: inline-block;
width: 10px;
height: 10px;
-webkit-background-size: 3px 3px;
-moz-background-size: 3px 3px;
background-size: 3px 3px;
background-color: #c5c0c1;
background-image: -webkit-gradient(linear, 0 0, 0 100%, color-stop(.5, #fff), color-stop(.5, transparent), to(transparent));
background-image: -moz-linear-gradient(#fff 50%, transparent 50%, transparent);
background-image: -o-linear-gradient(#fff 50%, transparent 50%, transparent);
background-image: linear-gradient(#fff 50%, transparent 50%, transparent);
margin: 0 0.3em 0 0;
}
mark{
text-decoration: underline;
background-color: transparent;
padding: 0 2px;
}

/*--------------- 装飾 ---------------*/
.box{
background: #f3f3f3;
padding: 0.5em 1em;
}
hr{
border: none;
height: 1px;
border-top: 1px solid #111;
}
</style>

BODY - トップページ
BODY - 子ページ

Quiet awakening.

Infomation

First

About this template

Souce code