stylesheet.css (6190B)
1 /*Reset*/ 2 html { 3 overflow: -moz-scrollbars-vertical; 4 margin: 0; 5 padding: 0; 6 } 7 *,h1,h2,h3,h4,h5,h6 { 8 font-family: 'Open Sans', sans-serif; 9 font-weight: 400; 10 } 11 body { 12 margin: 0px; 13 padding: 0px; 14 line-height: 1.5; 15 background: #F6F6F6 url('../image/background.png'); 16 } 17 body, p, td, th, input, textarea, select, option { 18 color: #777777; 19 text-decoration: none; 20 font-size: 13px; 21 } 22 fieldset { 23 border: 1px solid #DBDBDB; 24 padding: 10px; 25 margin-bottom: 20px; 26 -webkit-border-radius: 5px 5px 5px 5px; 27 -moz-border-radius: 5px 5px 5px 5px; 28 -khtml-border-radius: 5px 5px 5px 5px; 29 border-radius: 5px 5px 5px 5px; 30 } 31 fieldset table { 32 width: 100%; 33 border-collapse: collapse; 34 } 35 fieldset table.form tr td:first-child { 36 width: 250px; 37 } 38 fieldset table td { 39 padding: 5px; 40 } 41 select, input[type='text'], input[type='password'], textarea { 42 background: #FFFFFF; 43 -webkit-border-radius: 5px 5px 5px 5px; 44 -moz-border-radius: 5px 5px 5px 5px; 45 -khtml-border-radius: 5px 5px 5px 5px; 46 border-radius: 5px 5px 5px 5px; 47 border: 1px solid #DBDBDB; 48 padding: 4px; 49 color: #000; 50 } 51 option { 52 color: #000; 53 } 54 a, a:visited, a b { 55 color: #23A1D1; 56 text-decoration: none; 57 cursor: pointer; 58 } 59 a:hover { 60 text-decoration: none; 61 } 62 b, strong { 63 color: #555; 64 } 65 label { 66 cursor: pointer; 67 } 68 div.required .control-label:before { 69 content: '* '; 70 color: #F00; 71 font-weight: bold; 72 } 73 74 /*Buttons*/ 75 a.button, input.button { 76 cursor: pointer; 77 color: #FFF; 78 font-size: 13px; 79 border: 1px solid #78883C; 80 background: url('../image/button.png') repeat-x; 81 text-shadow: 0px -1px #7A8A3D; 82 -webkit-border-radius: 5px 5px 5px 5px; 83 -moz-border-radius: 5px 5px 5px 5px; 84 -khtml-border-radius: 5px 5px 5px 5px; 85 border-radius: 5px 5px 5px 5px; 86 -webkit-box-shadow: 1px 2px 2px #DDDDDD; 87 -moz-box-shadow: 1px 2px 2px #DDDDDD; 88 box-shadow: 1px 2px 2px #DDDDDD; 89 margin-bottom: 2px; 90 } 91 .buttons { 92 border: 1px solid #DBDBDB; 93 overflow: auto; 94 padding: 6px; 95 margin-bottom: 20px; 96 } 97 .btn { 98 padding: 10px 25px; 99 text-transform: uppercase; 100 font-weight: bold; 101 webkit-border-radius: 5px; 102 border-radius: 5px; 103 -webkit-transition: all 0.3s ease-out; 104 -moz-transition: all 0.3s ease-out; 105 -o-transition: all 0.3s ease-out; 106 transition: all 0.3s ease-out; 107 } 108 .btn-default:visited, 109 .btn-default { 110 border: none; 111 color: #777; 112 background: #ddd; 113 } 114 .btn-default:hover { 115 background: #ccc; 116 color: #777; 117 } 118 .btn-primary:visited, 119 .btn-primary { 120 color: #fff; 121 background: #23a1d1; 122 border: none; 123 } 124 .btn-primary:hover { 125 background: #1f91bc; 126 } 127 .btn-secondary:visited, 128 .btn-secondary { 129 color: #fff; 130 background: transparent; 131 border: 2px solid #fff; 132 } 133 .btn-secondary:hover { 134 border: 2px solid #fff; 135 background: #fff; 136 color: #23a1d1; 137 } 138 139 /*Transitions*/ 140 .transition { 141 -webkit-transition: all 0.3s ease-out; 142 -moz-transition: all 0.3s ease-out; 143 -o-transition: all 0.3s ease-out; 144 transition: all 0.3s ease-out; 145 } 146 147 /*Layout*/ 148 #column-right { 149 float: right; 150 width: 284px; 151 margin-left: 30px; 152 margin-bottom: 20px; 153 min-height: 350px; 154 } 155 #column-right ul, #column-right ul li { 156 margin: 0; 157 padding: 0; 158 list-style: none; 159 } 160 #column-right ul ul { 161 margin-left: 30px; 162 } 163 #column-right ul a, #column-right ul a b { 164 color: #777777; 165 text-decoration: none; 166 } 167 #column-right ul li { 168 display: block; 169 padding: 0px 8px 8px 22px; 170 margin-bottom: 8px; 171 border-bottom: 1px solid #DBDBDB; 172 background: url('../image/bullet-arrow.png') 0px 5px no-repeat; 173 } 174 175 /*Header*/ 176 header { 177 padding: 50px; 178 } 179 header h1 { 180 margin: 0 25px 0 0; 181 font-size: 48px; 182 } 183 header h3 { 184 margin: 0; 185 float: left; 186 } 187 header h3 small { 188 margin: 10px 0 0 0; 189 display: block; 190 } 191 192 /*Visit*/ 193 .visit { 194 padding: 50px 0 50px 0; 195 color: #fff; 196 background: #23a1d1; 197 } 198 .visit p { 199 color: #FFF; 200 margin-bottom: 20px; 201 } 202 .visit i { 203 font-size: 100px; 204 } 205 .visit img { 206 height: 71px; 207 margin: 50px auto 25px auto; 208 display: block; 209 } 210 211 /*Modules*/ 212 .modules { 213 padding: 50px 50px 50px 50px; 214 background: #fff; 215 } 216 @media (min-width: 992px) { 217 .modules { 218 padding: 50px; 219 } 220 } 221 .modules h2 { 222 margin: 50px 0; 223 } 224 .modules .module { 225 margin: 0px 0 50px 0; 226 } 227 .modules .thumbnail { 228 margin: 0 25px 0 0; 229 } 230 231 /*Mailing list*/ 232 .mailing { 233 padding: 50px; 234 background: #23A1D1; 235 text-align: center; 236 } 237 .mailing i { 238 color: #FFF; 239 } 240 241 @media (min-width: 992px) { 242 .mailing { 243 padding: 50px 100px; 244 text-align: left; 245 } 246 } 247 @media (min-width: 992px) { 248 .mailing i { 249 margin: 0 50px 0 0; 250 float: left; 251 } 252 } 253 .mailing h3 { 254 margin: 25px 0; 255 color: #fff; 256 } 257 @media (min-width: 992px) { 258 .mailing h3 { 259 margin: 0; 260 float: left; 261 } 262 } 263 .mailing h3 small { 264 margin: 10px 0 0 0; 265 display: block; 266 color: #fff; 267 } 268 @media (min-width: 992px) { 269 .mailing a { 270 float: right; 271 } 272 } 273 274 /*Core modules*/ 275 .core-modules { 276 padding: 0 50px 50px 50px; 277 background: #fff; 278 } 279 @media (min-width: 992px) { 280 .core-modules { 281 padding: 0 100px 50px 100px; 282 background: #fff; 283 } 284 } 285 .core-modules h2 { 286 margin: 50px 0 0 0; 287 } 288 .core-modules img { 289 margin: 50px 0 0 0; 290 } 291 .core-modules p { 292 margin: 25px 0; 293 } 294 295 /*Support*/ 296 .support { 297 padding: 0 50px 50px 50px; 298 background: #173642; 299 color: #fff; 300 } 301 @media (min-width: 992px) { 302 .support { 303 padding: 0 100px 50px 100px; 304 } 305 } 306 .support p { 307 color: #fff; 308 } 309 .support a.icon { 310 margin: 50px auto 0 auto; 311 width: 100px; 312 height: 100px; 313 display: block; 314 border: 3px solid #23a1d1; 315 webkit-border-radius: 50px; 316 border-radius: 50px; 317 color: #fff; 318 } 319 .support a.icon:hover { 320 border: 3px solid #23a1d1; 321 background: #23a1d1; 322 } 323 .support .icon i { 324 line-height: 100px; 325 } 326 .support a:hover { 327 color: #fff; 328 } 329 330 /*Terms*/ 331 .terms { 332 background: #FFFFFF; 333 border: 1px solid #DBDBDB; 334 margin: 3px 0px 10px 0px; 335 padding: 4px; 336 height: 250px; 337 overflow-y: scroll; 338 } 339 .terms p, .terms ul, .terms ol { 340 color: #000000; 341 } 342 343 /*Alert*/ 344 .alert { 345 padding: 8px 14px 8px 14px; 346 } 347 348 /*Footer*/ 349 footer { 350 margin: 25px 0; 351 text-align: center; 352 } 353 footer a { 354 margin: 0px 5px; 355 line-height: 28px; 356 }