*{
margin: 0;
padding: 0;
}
body{
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
font-size: 13px;
background: #fff;
}
#wrapper{
max-width: 1080px;
padding: 15px 2% 40px 2%;
margin: 20px auto;
}
h1{
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
margin: 0 0.1% 15px 0.1%;
word-wrap: break-word;
}
a{
width: 100%;
display: block;
display: inline-block;
word-wrap: break-word;
vertical-align: top;
text-decoration: none;
color: #000;
border: 1px solid transparent;
box-sizing: border-box;
transition: all 0.3s;
}
a:hover, a:focus{
background: #f0f0f0;
}
a:active{
border-color: #c8c8c8;
}
ul{
list-style-type: none;
padding: 0;
}
li:nth-child(2n){
background: #f8f8f8;
}
.date{
display: inline-block;
float: right;
padding: 3px 0.1%;
}
.link{
float: left;
max-width: 75%;
padding: 3px 0.1%;
}
.header{
overflow: auto;
clear: left;
padding: 15px 0.1% 7px 0.1%;
border-bottom: 5px solid #f1f1f1;
font-size: 1.2em;
width: 99.8%;
}
.header-txt{
float: left;
}
.header-date{
float: right;
}
#attr{
width: 100%;
font-size: 0.85em;
margin-top: 25px;
padding-right: 0.1%;
box-sizing: border-box;
}
#attr-a{
float: right;
width: auto;
padding: 7px;
}
h1 a{
display: inline;
}
h1 a:hover{
background: none;
opacity: 0.6;
}
@media (max-width: 960px){
body{
font-size: 12px;
}
#wrapper{
padding-left: 0%;
padding-right: 0%;
}
h1{
padding-left: 7px;
padding-right: 7px;
}
ul .link{
display: block;
max-width: 100%;
width: 100%;
padding: 4px 7px 2px 7px;
box-sizing: border-box;
float: none;
}
.date{
float: none;
padding: 0 7px 4px 7px;
}
.header{
padding: 13px 7px 5px 7px;
width: auto;
}
.header-date{
display: none;
}
#attr{
padding-right: 7px;
}
}
@media (max-width: 500px){
body{
font-size: 11px;
}
}