style.css (2705B)
1 @import "colors.css"; 2 3 html { 4 overflow-y: scroll; 5 } 6 7 body { 8 font-family: sans-serif; 9 font-size: 1em; 10 } 11 12 .container { 13 max-width: 680px; 14 margin: 0 auto; 15 } 16 17 .upstart { 18 clear: both; 19 text-align: right; 20 } 21 22 /* menu */ 23 .menu { 24 line-height: 1.5em; 25 text-align: center; 26 } 27 28 .menu li { 29 display: inline; 30 padding: 0 4px; 31 } 32 33 .menu li a { 34 text-decoration: none; 35 padding: 0.3em; 36 border-top: 0.5ex solid #a7a9ac; 37 margin-right: 5px; 38 margin-left: -5px; 39 } 40 41 .menu li a:hover, .menu li a.current { 42 border-top: 0.5ex solid #0091d0; 43 } 44 45 h1, h2, h3, h4, h5 { 46 font-weight: normal; 47 } 48 49 h1 { 50 font-size: 1.8em; 51 } 52 53 h3 { 54 margin-top: 30px; 55 } 56 57 .latart { 58 text-align: center; 59 } 60 61 a, a:hover { 62 text-decoration: underline; 63 } 64 65 a em { 66 font-size: 0.9em; 67 } 68 69 .previewlink { 70 text-decoration: none; 71 text-align: right; 72 display: block; 73 } 74 75 .previewlink:hover { 76 text-decoration: underline; 77 } 78 79 .preview { 80 border: 1px solid #c0c0c0; 81 padding: 5px 20px; 82 position: relative; 83 margin: 0 auto; 84 transition: background-color 400ms linear; 85 } 86 87 .preview:hover { 88 background: #e3e3e3; 89 } 90 91 a.indexlink { 92 line-height: 2em; 93 } 94 95 p { 96 max-width: 680px; 97 white-space: normal; 98 line-height: 1.6em; 99 text-align: justify; 100 } 101 102 .preview p { 103 margin-top: 0em; 104 margin-bottom: 0em; 105 } 106 107 .container ul li { 108 /* list-style: none; */ 109 } 110 111 .container ul li:before { 112 /* content: "\2192"; */ 113 /* float: left; */ 114 } 115 116 pre { 117 font-family: monospace; 118 border: 1px solid #c0c0c0; 119 padding: 5px; 120 max-width: 680px; 121 word-wrap: break-word; 122 white-space: pre-wrap; 123 overflow-x: auto; 124 } 125 126 p code, li code { 127 border: 1px solid #c0c0c0; 128 max-width: 680px; 129 padding: 0.3em; 130 margin: 0.3em; 131 word-wrap: break-word; 132 white-space: pre-wrap; 133 } 134 135 code { 136 font-family: Monaco, Consolas, "Courier New", monospace; 137 font-size: 13px; 138 } 139 140 .logo { 141 border: none; 142 display: block; 143 margin-left: auto; 144 margin-right: auto; 145 margin-bottom: 70px; 146 } 147 148 img { 149 margin-top: 20px; 150 max-width: 100%; 151 height: auto; 152 } 153 154 li { 155 line-height: 1.6em; 156 text-align: justify; 157 } 158 159 hr { 160 width: 300%; 161 margin-left: -40%; 162 margin-top: 40px; 163 } 164 165 blockquote { 166 margin: 10px 0 10px 50px; 167 padding-left: 15px; 168 border-left: 3px solid #ccc; 169 } 170 171 footer { 172 max-width: 100%; 173 text-align: center; 174 margin: 2em auto 0 auto; 175 padding-top: 2em; 176 padding-bottom: 3em; 177 border-top: 1px solid #c0c0c0; 178 } 179 180 #disqus_thread { 181 max-width: 680px; 182 margin: 0 auto; 183 } 184 185 @media screen and (min-width: 481px) { 186 .menu { 187 margin-left: -30px; 188 } 189 } 190 191 @media screen and (max-width: 480px) { 192 .menu li { 193 display: list-item; 194 margin-left: -40px; 195 list-style: none; 196 text-align: center; 197 padding-top: 10px; 198 text-transform: uppercase; 199 } 200 201 .menu li a { 202 border: none; 203 } 204 205 .menu li a:hover { 206 border: none; 207 } 208 209 a em { 210 font-size: 1em; 211 } 212 }