|
| 1 | +/* |
| 2 | +* Skeleton V1.2 |
| 3 | +* Copyright 2011, Dave Gamache |
| 4 | +* www.getskeleton.com |
| 5 | +* Free to use under the MIT license. |
| 6 | +* http://www.opensource.org/licenses/mit-license.php |
| 7 | +* 6/20/2012 |
| 8 | +*/ |
| 9 | + |
| 10 | + |
| 11 | +/* Table of Content |
| 12 | +================================================== |
| 13 | +#Reset & Basics |
| 14 | +#Basic Styles |
| 15 | +#Site Styles |
| 16 | +#Typography |
| 17 | +#Links |
| 18 | +#Lists |
| 19 | +#Images |
| 20 | +#Buttons |
| 21 | +#Forms |
| 22 | +#Misc */ |
| 23 | + |
| 24 | + |
| 25 | +/* #Reset & Basics (Inspired by E. Meyers) |
| 26 | +================================================== */ |
| 27 | +html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video { |
| 28 | +margin:0; |
| 29 | +padding:0; |
| 30 | +border:0; |
| 31 | +font-size:100%; |
| 32 | +font: inherit; |
| 33 | +vertical-align: baseline; } |
| 34 | +article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { |
| 35 | +display: block; } |
| 36 | +body { |
| 37 | +line-height:1; } |
| 38 | +ol,ul { |
| 39 | +list-style: none; } |
| 40 | +blockquote,q { |
| 41 | +quotes: none; } |
| 42 | +blockquote:before,blockquote:after, |
| 43 | +q:before,q:after { |
| 44 | +content:''; |
| 45 | +content: none; } |
| 46 | +table { |
| 47 | +border-collapse: collapse; |
| 48 | +border-spacing:0; } |
| 49 | + |
| 50 | + |
| 51 | +/* #Basic Styles |
| 52 | +================================================== */ |
| 53 | +body { |
| 54 | +background:#fff; |
| 55 | +font:14px/21px"Raleway""HelveticaNeue-Light", Arial, sans-serif; |
| 56 | +color:#444; |
| 57 | +-webkit-font-smoothing: antialiased;/* Fix for webkit rendering */ |
| 58 | +-webkit-text-size-adjust:100%; |
| 59 | + } |
| 60 | + |
| 61 | + |
| 62 | +/* #Typography |
| 63 | +================================================== */ |
| 64 | +h1,h2,h3,h4,h5,h6 { |
| 65 | +font-weight:300; } |
| 66 | +h1a,h2a,h3a,h4a,h5a,h6a {font-weight: inherit; } |
| 67 | +h1 {font-size:46px;line-height:50px;margin-bottom:14px;} |
| 68 | +h2 {font-size:35px;line-height:40px;margin-bottom:10px; } |
| 69 | +h3 {font-size:28px;line-height:34px;margin-bottom:8px; } |
| 70 | +h4 {font-size:21px;line-height:30px;margin-bottom:4px; } |
| 71 | +h5 {font-size:17px;line-height:24px; } |
| 72 | +h6 {font-size:14px;line-height:21px; } |
| 73 | +.subheader {color:#777; } |
| 74 | + |
| 75 | +p {margin:0020px0; } |
| 76 | +pimg {margin:0; } |
| 77 | +p.lead {font-size:21px;line-height:27px;color:#777; } |
| 78 | + |
| 79 | +em {font-style: italic; } |
| 80 | +strong {font-weight: bold; } |
| 81 | +small {font-size:80%; } |
| 82 | + |
| 83 | +/*Blockquotes */ |
| 84 | +blockquote,blockquotep {font-size:17px;line-height:24px;color:#777;font-style: italic; } |
| 85 | +blockquote {margin:0020px;padding:9px20px019px;border-left:1px solid#ddd; } |
| 86 | +blockquotecite {display: block;font-size:12px;color:#555; } |
| 87 | +blockquotecite:before {content:"\2014 \0020"; } |
| 88 | +blockquotecitea,blockquotecitea:visited,blockquotecitea:visited {color:#555; } |
| 89 | + |
| 90 | +hr {border: solid#ddd;border-width:1px00;clear: both;margin:10px030px;height:0; } |
| 91 | + |
| 92 | + |
| 93 | +/* #Links |
| 94 | +================================================== */ |
| 95 | +a,a:visited {text-decoration: underline;outline:0; } |
| 96 | +a:hover,a:focus { } |
| 97 | +pa,pa:visited {line-height: inherit; } |
| 98 | + |
| 99 | + |
| 100 | +/* #Lists |
| 101 | +================================================== */ |
| 102 | +ul,ol {margin-bottom:20px; } |
| 103 | +ul {list-style: none outside; } |
| 104 | +ol {list-style: decimal; } |
| 105 | +ol,ul.square,ul.circle,ul.disc {margin-left:30px; } |
| 106 | +ul,ul.square {list-style: square outside; } |
| 107 | +ulul,ul.circle {list-style: circle outside; } |
| 108 | +ululul,ul.disc {list-style: disc outside; } |
| 109 | +ulul,ulol, |
| 110 | +olol,olul {margin:4px05px30px;font-size:90%; } |
| 111 | +ululli,ulolli, |
| 112 | +ololli,olulli {margin-bottom:6px; } |
| 113 | +li {line-height:18px;margin-bottom:12px; } |
| 114 | +ul.largeli {line-height:21px; } |
| 115 | +lip {line-height:21px; } |
| 116 | + |
| 117 | +/* #Images |
| 118 | +================================================== */ |
| 119 | + |
| 120 | +img.scale-with-grid { |
| 121 | +max-width:100%; |
| 122 | +height: auto; } |
| 123 | + |
| 124 | + |
| 125 | +/* #Buttons |
| 126 | +================================================== */ |
| 127 | + |
| 128 | +.button, |
| 129 | +button, |
| 130 | +input[type="submit"], |
| 131 | +input[type="reset"], |
| 132 | +input[type="button"] { |
| 133 | +background:#eee;/* Old browsers */ |
| 134 | +background:#eee-moz-linear-gradient(top,rgba(255,255,255,.2)0%,rgba(0,0,0,.2)100%);/* FF3.6+ */ |
| 135 | +background:#eee-webkit-gradient(linear, left top, left bottom,color-stop(0%,rgba(255,255,255,.2)),color-stop(100%,rgba(0,0,0,.2)));/* Chrome,Safari4+ */ |
| 136 | +background:#eee-webkit-linear-gradient(top,rgba(255,255,255,.2)0%,rgba(0,0,0,.2)100%);/* Chrome10+,Safari5.1+ */ |
| 137 | +background:#eee-o-linear-gradient(top,rgba(255,255,255,.2)0%,rgba(0,0,0,.2)100%);/* Opera11.10+ */ |
| 138 | +background:#eee-ms-linear-gradient(top,rgba(255,255,255,.2)0%,rgba(0,0,0,.2)100%);/* IE10+ */ |
| 139 | +background:#eeelinear-gradient(top,rgba(255,255,255,.2)0%,rgba(0,0,0,.2)100%);/* W3C */ |
| 140 | +border:1px solid#aaa; |
| 141 | +border-top:1px solid#ccc; |
| 142 | +border-left:1px solid#ccc; |
| 143 | +-moz-border-radius:3px; |
| 144 | +-webkit-border-radius:3px; |
| 145 | +border-radius:3px; |
| 146 | +color:#444; |
| 147 | +display: inline-block; |
| 148 | +font-size:11px; |
| 149 | +font-weight: bold; |
| 150 | +text-decoration: none; |
| 151 | +text-shadow:01pxrgba(255,255,255,.75); |
| 152 | +cursor: pointer; |
| 153 | +margin-bottom:20px; |
| 154 | +line-height: normal; |
| 155 | +padding:8px10px; |
| 156 | +font-family:"HelveticaNeue","Helvetica Neue", Helvetica, Arial, sans-serif; } |
| 157 | + |
| 158 | +.button:hover, |
| 159 | +button:hover, |
| 160 | +input[type="submit"]:hover, |
| 161 | +input[type="reset"]:hover, |
| 162 | +input[type="button"]:hover { |
| 163 | +color:#222; |
| 164 | +background:#ddd;/* Old browsers */ |
| 165 | +background:#ddd-moz-linear-gradient(top,rgba(255,255,255,.3)0%,rgba(0,0,0,.3)100%);/* FF3.6+ */ |
| 166 | +background:#ddd-webkit-gradient(linear, left top, left bottom,color-stop(0%,rgba(255,255,255,.3)),color-stop(100%,rgba(0,0,0,.3)));/* Chrome,Safari4+ */ |
| 167 | +background:#ddd-webkit-linear-gradient(top,rgba(255,255,255,.3)0%,rgba(0,0,0,.3)100%);/* Chrome10+,Safari5.1+ */ |
| 168 | +background:#ddd-o-linear-gradient(top,rgba(255,255,255,.3)0%,rgba(0,0,0,.3)100%);/* Opera11.10+ */ |
| 169 | +background:#ddd-ms-linear-gradient(top,rgba(255,255,255,.3)0%,rgba(0,0,0,.3)100%);/* IE10+ */ |
| 170 | +background:#dddlinear-gradient(top,rgba(255,255,255,.3)0%,rgba(0,0,0,.3)100%);/* W3C */ |
| 171 | +border:1px solid#888; |
| 172 | +border-top:1px solid#aaa; |
| 173 | +border-left:1px solid#aaa; } |
| 174 | + |
| 175 | +.button:active, |
| 176 | +button:active, |
| 177 | +input[type="submit"]:active, |
| 178 | +input[type="reset"]:active, |
| 179 | +input[type="button"]:active { |
| 180 | +border:1px solid#666; |
| 181 | +background:#ccc;/* Old browsers */ |
| 182 | +background:#ccc-moz-linear-gradient(top,rgba(255,255,255,.35)0%,rgba(10,10,10,.4)100%);/* FF3.6+ */ |
| 183 | +background:#ccc-webkit-gradient(linear, left top, left bottom,color-stop(0%,rgba(255,255,255,.35)),color-stop(100%,rgba(10,10,10,.4)));/* Chrome,Safari4+ */ |
| 184 | +background:#ccc-webkit-linear-gradient(top,rgba(255,255,255,.35)0%,rgba(10,10,10,.4)100%);/* Chrome10+,Safari5.1+ */ |
| 185 | +background:#ccc-o-linear-gradient(top,rgba(255,255,255,.35)0%,rgba(10,10,10,.4)100%);/* Opera11.10+ */ |
| 186 | +background:#ccc-ms-linear-gradient(top,rgba(255,255,255,.35)0%,rgba(10,10,10,.4)100%);/* IE10+ */ |
| 187 | +background:#ccclinear-gradient(top,rgba(255,255,255,.35)0%,rgba(10,10,10,.4)100%);/* W3C */ } |
| 188 | + |
| 189 | +.button.full-width, |
| 190 | +button.full-width, |
| 191 | +input[type="submit"].full-width, |
| 192 | +input[type="reset"].full-width, |
| 193 | +input[type="button"].full-width { |
| 194 | +width:100%; |
| 195 | +padding-left:0!important; |
| 196 | +padding-right:0!important; |
| 197 | +text-align: center; } |
| 198 | + |
| 199 | +/* Fix for odd Mozilla border & padding issues */ |
| 200 | +button::-moz-focus-inner, |
| 201 | +input::-moz-focus-inner { |
| 202 | +border:0; |
| 203 | +padding:0; |
| 204 | +} |
| 205 | + |
| 206 | + |
| 207 | +/* #Forms |
| 208 | +================================================== */ |
| 209 | + |
| 210 | +form { |
| 211 | +margin-bottom:20px; } |
| 212 | +fieldset { |
| 213 | +margin-bottom:20px; } |
| 214 | +input[type="text"], |
| 215 | +input[type="password"], |
| 216 | +input[type="email"], |
| 217 | +textarea, |
| 218 | +select { |
| 219 | +border:1px solid#ccc; |
| 220 | +padding:6px4px; |
| 221 | +outline: none; |
| 222 | +-moz-border-radius:2px; |
| 223 | +-webkit-border-radius:2px; |
| 224 | +border-radius:2px; |
| 225 | +font:13px"HelveticaNeue","Helvetica Neue", Helvetica, Arial, sans-serif; |
| 226 | +color:#777; |
| 227 | +margin:0; |
| 228 | +width:210px; |
| 229 | +max-width:100%; |
| 230 | +display: block; |
| 231 | +margin-bottom:20px; |
| 232 | +background:#fff; } |
| 233 | +select { |
| 234 | +padding:0; } |
| 235 | +input[type="text"]:focus, |
| 236 | +input[type="password"]:focus, |
| 237 | +input[type="email"]:focus, |
| 238 | +textarea:focus { |
| 239 | +border:1px solid#aaa; |
| 240 | +color:#444; |
| 241 | +-moz-box-shadow:003pxrgba(0,0,0,.2); |
| 242 | +-webkit-box-shadow:003pxrgba(0,0,0,.2); |
| 243 | +box-shadow:003pxrgba(0,0,0,.2); } |
| 244 | +textarea { |
| 245 | +min-height:60px; } |
| 246 | +label, |
| 247 | +legend { |
| 248 | +display: block; |
| 249 | +font-weight: bold; |
| 250 | +font-size:13px; } |
| 251 | +select { |
| 252 | +width:220px; } |
| 253 | +input[type="checkbox"] { |
| 254 | +display: inline; } |
| 255 | +labelspan, |
| 256 | +legendspan { |
| 257 | +font-weight: normal; |
| 258 | +font-size:13px; |
| 259 | +color:#444; } |
| 260 | + |
| 261 | +/* #Misc |
| 262 | +================================================== */ |
| 263 | +.remove-bottom {margin-bottom:0!important; } |
| 264 | +.half-bottom {margin-bottom:10px!important; } |
| 265 | +.add-bottom {margin-bottom:20px!important; } |
| 266 | + |
| 267 | + |