docs.css (4103B)
1 @font-face { 2 font-family: 'Source Sans Pro'; 3 font-style: normal; 4 font-weight: 400; 5 src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url(//themes.googleusercontent.com/static/fonts/sourcesanspro/v5/ODelI1aHBYDBqgeIAH2zlBM0YzuT7MdOe03otPbuUS0.woff) format('woff'); 6 } 7 8 body, html { margin: 0; padding: 0; height: 100%; } 9 section, article { display: block; padding: 0; } 10 11 body { 12 background: #f8f8f8; 13 font-family: 'Source Sans Pro', Helvetica, Arial, sans-serif; 14 line-height: 1.5; 15 } 16 17 p { margin-top: 0; } 18 19 h2, h3, h1 { 20 font-weight: normal; 21 margin-bottom: .7em; 22 } 23 h1 { font-size: 140%; } 24 h2 { font-size: 120%; } 25 h3 { font-size: 110%; } 26 article > h2:first-child, section:first-child > h2 { margin-top: 0; } 27 28 #nav h1 { 29 margin-right: 12px; 30 margin-top: 0; 31 margin-bottom: 2px; 32 color: #d30707; 33 letter-spacing: .5px; 34 } 35 36 a, a:visited, a:link, .quasilink { 37 color: #A21313; 38 text-decoration: none; 39 } 40 41 em { 42 padding-right: 2px; 43 } 44 45 .quasilink { 46 cursor: pointer; 47 } 48 49 article { 50 max-width: 700px; 51 margin: 0 0 0 160px; 52 border-left: 2px solid #E30808; 53 border-right: 1px solid #ddd; 54 padding: 30px 50px 100px 50px; 55 background: white; 56 z-index: 2; 57 position: relative; 58 min-height: 100%; 59 box-sizing: border-box; 60 -moz-box-sizing: border-box; 61 } 62 63 #nav { 64 position: fixed; 65 padding-top: 30px; 66 max-height: 100%; 67 box-sizing: -moz-border-box; 68 box-sizing: border-box; 69 overflow-y: auto; 70 left: 0; right: none; 71 width: 160px; 72 text-align: right; 73 z-index: 1; 74 } 75 76 @media screen and (min-width: 1000px) { 77 article { 78 margin: 0 auto; 79 } 80 #nav { 81 right: 50%; 82 width: auto; 83 border-right: 349px solid transparent; 84 } 85 } 86 87 #nav ul { 88 display: block; 89 margin: 0; padding: 0; 90 margin-bottom: 32px; 91 } 92 93 #nav li { 94 display: block; 95 margin-bottom: 4px; 96 } 97 98 #nav li ul { 99 font-size: 80%; 100 margin-bottom: 0; 101 display: none; 102 } 103 104 #nav li.active ul { 105 display: block; 106 } 107 108 #nav li li a { 109 padding-right: 20px; 110 display: inline-block; 111 } 112 113 #nav ul a { 114 color: black; 115 padding: 0 7px 1px 11px; 116 } 117 118 #nav ul a.active, #nav ul a:hover { 119 border-bottom: 1px solid #E30808; 120 margin-bottom: -1px; 121 color: #E30808; 122 } 123 124 #logo { 125 border: 0; 126 margin-right: 12px; 127 margin-bottom: 25px; 128 } 129 130 section { 131 border-top: 1px solid #E30808; 132 margin: 1.5em 0; 133 } 134 135 section.first { 136 border: none; 137 margin-top: 0; 138 } 139 140 #demo { 141 position: relative; 142 } 143 144 #demolist { 145 position: absolute; 146 right: 5px; 147 top: 5px; 148 z-index: 25; 149 } 150 151 .yinyang { 152 position: absolute; 153 top: -10px; 154 left: 0; right: 0; 155 margin: auto; 156 display: block; 157 height: 120px; 158 } 159 160 .actions { 161 margin: 1em 0 0; 162 min-height: 100px; 163 position: relative; 164 } 165 166 .actionspicture { 167 pointer-events: none; 168 position: absolute; 169 height: 100px; 170 top: 0; left: 0; right: 0; 171 } 172 173 .actionlink { 174 pointer-events: auto; 175 font-family: arial; 176 font-size: 80%; 177 font-weight: bold; 178 position: absolute; 179 top: 0; bottom: 0; 180 line-height: 1; 181 height: 1em; 182 margin: auto; 183 } 184 185 .actionlink.download { 186 color: white; 187 right: 50%; 188 margin-right: 13px; 189 text-shadow: -1px 1px 3px #b00, -1px -1px 3px #b00, 1px 0px 3px #b00; 190 } 191 192 .actionlink.fund { 193 color: #b00; 194 left: 50%; 195 margin-left: 15px; 196 } 197 198 .actionlink:hover { 199 text-decoration: underline; 200 } 201 202 .actionlink a { 203 color: inherit; 204 } 205 206 .actionsleft { 207 float: left; 208 } 209 210 .actionsright { 211 float: right; 212 text-align: right; 213 } 214 215 @media screen and (max-width: 800px) { 216 .actions { 217 padding-top: 120px; 218 } 219 .actionsleft, .actionsright { 220 float: none; 221 text-align: left; 222 margin-bottom: 1em; 223 } 224 } 225 226 th { 227 text-decoration: underline; 228 font-weight: normal; 229 text-align: left; 230 } 231 232 #features ul { 233 list-style: none; 234 margin: 0 0 1em; 235 padding: 0 0 0 1.2em; 236 } 237 238 #features li:before { 239 content: "-"; 240 width: 1em; 241 display: inline-block; 242 padding: 0; 243 margin: 0; 244 margin-left: -1em; 245 } 246 247 .rel { 248 margin-bottom: 0; 249 } 250 .rel-note { 251 margin-top: 0; 252 color: #555; 253 } 254 255 pre { 256 padding-left: 15px; 257 border-left: 2px solid #ddd; 258 } 259 260 code { 261 padding: 0 2px; 262 } 263 264 strong { 265 text-decoration: underline; 266 font-weight: normal; 267 } 268 269 .field { 270 border: 1px solid #A21313; 271 }