Mint: A Fresh Look at your Site Minted
  1. 1 /**
  2. 2 * Theme: Flat Bootstrap
  3. 3 * File: theme-flat.css
  4. 4 *
  5. 5 * The stylesheet for our flat ui
  6. 6 *
  7. 7 * Contains our custom fonts, color palette, sections with padding, etc.
  8. 8 *
  9. 9 * @package flat-bootstrap
  10. 10 */
  11. 11
  12. 12 /*
  13. 13 * OVERALL STYLES
  14. 14 */
  15. 15
  16. 16 body {
  17. 17 font-family: "Lato", "Helvetica Neue", Arial, sans-serif;
  18. 18 font-weight: 300;
  19. 19 font-size: 18px;
  20. 20 color: #555;
  21. 21
  22. 22 -webkit-font-smoothing: antialiased;
  23. 23 -webkit-overflow-scrolling: touch;
  24. 24 }
  25. 25
  26. 26 a {
  27. 27 color: #16a085;
  28. 28 word-wrap: break-word;
  29. 29
  30. 30 -webkit-transition: color .1s ease-in, background .1s ease-in;
  31. 31 -moz-transition: color .1s ease-in, background .1s ease-in;
  32. 32 -ms-transition: color .1s ease-in, background .1s ease-in;
  33. 33 -o-transition: color .1s ease-in, background .1s ease-in;
  34. 34 transition: color .1s ease-in, background .1s ease-in;
  35. 35 }
  36. 36
  37. 37 a:hover,
  38. 38 a:focus {
  39. 39 color: #19B798;
  40. 40 text-decoration: none;
  41. 41 outline: 0;
  42. 42 }
  43. 43 a:before,
  44. 44 a:after,
  45. 45 a:hover i:before,
  46. 46 a:focus i:before {
  47. 47 -webkit-transition: color .1s ease-in, background .1s ease-in;
  48. 48 -moz-transition: color .1s ease-in, background .1s ease-in;
  49. 49 -ms-transition: color .1s ease-in, background .1s ease-in;
  50. 50 -o-transition: color .1s ease-in, background .1s ease-in;
  51. 51 transition: color .1s ease-in, background .1s ease-in;
  52. 52 }
  53. 53
  54. 54 h1,
  55. 55 h2,
  56. 56 h3,
  57. 57 h4,
  58. 58 h5,
  59. 59 h6 {
  60. 60 font-family: "Raleway", Arial, "Helvetica Neue", sans-serif;
  61. 61 }
  62. 62 h1,
  63. 63 h2,
  64. 64 h3 {
  65. 65 font-weight: 300;
  66. 66 }
  67. 67
  68. 68 p {
  69. 69 line-height: 28px;
  70. 70 }
  71. 71
  72. 72 blockquote {
  73. 73 border-color: #16a085;
  74. 74 }
  75. 75
  76. 76 hr {
  77. 77 display: block;
  78. 78 height: 1px;
  79. 79 border: 0;
  80. 80 border-top: 1px solid #ccc;
  81. 81 margin: 1em 0;
  82. 82 padding: 0;
  83. 83 }
  84. 84
  85. 85 .navbar-default
  86. 86 .navbar-brand {
  87. 87 color: #16a085;
  88. 88 }
  89. 89 .navbar-default
  90. 90 .navbar-brand:hover,
  91. 91 .navbar-default
  92. 92 .navbar-brand:focus {
  93. 93 color: #19b798;
  94. 94 }
  95. 95
  96. 96 /* Tone down field labels in the comments section and wherever else */
  97. 97 label {
  98. 98 font-weight: 300;
  99. 99 }
  100. 100
  101. 101 /*
  102. 102 * FULL-WIDTH SECTIONS
  103. 103 */
  104. 104 .section {
  105. 105 padding-top: 35px;
  106. 106 padding-bottom: 35px;
  107. 107 }
  108. 108
  109. 109 /* Bootstrap grids (rows) need this if not in a container */
  110. 110 .section.fullwidth {
  111. 111 padding-left: 15px;
  112. 112 padding-right: 15px;
  113. 113 }
  114. 114 .section.nopadding {
  115. 115 padding-top: 0;
  116. 116 padding-bottom: 0;
  117. 117 }
  118. 118 .section.nopadding-top {
  119. 119 padding-top: 0;
  120. 120 }
  121. 121 .section.nopadding-bottom {
  122. 122 padding-bottom: 0;
  123. 123 }
  124. 124 .section.padding-top {
  125. 125 padding-top: 35px;
  126. 126 }
  127. 127 .section.padding-bottom {
  128. 128 padding-bottom: 35px;
  129. 129 }
  130. 130 .section.border-bottom {
  131. 131 border-bottom: #bdc3c7 solid 1px;
  132. 132 }
  133. 133 .section.border-bottom-thick {
  134. 134 border-bottom: #bdc3c7 solid 5px;
  135. 135 }
  136. 136
  137. 137 /*
  138. 138 * PADDING AND OTHER UTILITIES
  139. 139 */
  140. 140 .padding {
  141. 141 padding: 25px;
  142. 142 }
  143. 143 .padding-top {
  144. 144 padding-top: 25px; /* Match Hx tag top margins */
  145. 145 }
  146. 146 .padding-bottom {
  147. 147 padding-bottom: 25px;
  148. 148 }
  149. 149 .padding-top-bottom {
  150. 150 padding-top: 25px;
  151. 151 padding-bottom: 25px;
  152. 152 }
  153. 153 .padding-right {
  154. 154 padding-right: 35px; /* Match grid gutters */
  155. 155 }
  156. 156 .padding-left {
  157. 157 padding-left: 35px; /* Match grid gutters */
  158. 158 }
  159. 159 .padding-left-right {
  160. 160 padding-left: 35px; /* Match grid gutters */
  161. 161 padding-right: 35px; /* Match grid gutters */
  162. 162 }
  163. 163 .nopadding-nomargin {
  164. 164 margin: 0;
  165. 165 padding: 0;
  166. 166 }
  167. 167 .centered {
  168. 168 text-align: center;
  169. 169 }
  170. 170
  171. 171 /*
  172. 172 * COLORED BACKGROUNDS FOR SECTIONS
  173. 173 */
  174. 174
  175. 175 .white,
  176. 176 .bg-white {
  177. 177 background-color: #fff;
  178. 178 }
  179. 179 .color-white {
  180. 180 color: #fff;
  181. 181 }
  182. 182
  183. 183 .offwhite,
  184. 184 .bg-offwhite {
  185. 185 background-color: #f2f2f2;
  186. 186 }
  187. 187 .color-offwhite {
  188. 188 color: #f2f2f2;
  189. 189 }
  190. 190
  191. 191 .lightgray,
  192. 192 .bg-lightgray {
  193. 193 background-color: #ebebeb;
  194. 194 }
  195. 195 .color-lightgray {
  196. 196 color: #ebebeb;
  197. 197 }
  198. 198
  199. 199 .gray,
  200. 200 .bg-gray {
  201. 201 background-color: #e7e7e7;
  202. 202 }
  203. 203 .color-gray {
  204. 204 color: #e7e7e7;
  205. 205 }
  206. 206
  207. 207 .darkgray,
  208. 208 .bg-darkgray {
  209. 209 background-color: #e0e0e0;
  210. 210 }
  211. 211 .color-darkgray {
  212. 212 color: #e0e0e0;
  213. 213 }
  214. 214
  215. 215 .lightgreen,
  216. 216 .bg-lightgreen {
  217. 217 background-color: #1abc9c;
  218. 218 color: #fff;
  219. 219 }
  220. 220 .color-lightgreen {
  221. 221 color: #1abc9c;
  222. 222 }
  223. 223 .lightgreen h1,
  224. 224 .lightgreen h2,
  225. 225 .lightgreen h3,
  226. 226 .lightgreen h4,
  227. 227 .lightgreen h5,
  228. 228 .lightgreen h6,
  229. 229 .bg-lightgreen h1,
  230. 230 .bg-lightgreen h2,
  231. 231 .bg-lightgreen h3,
  232. 232 .bg-lightgreen h4,
  233. 233 .bg-lightgreen h5,
  234. 234 .bg-lightgreen h6 {
  235. 235 color: #fff;
  236. 236 }
  237. 237
  238. 238 .darkgreen,
  239. 239 .bg-darkgreen {
  240. 240 background-color: #16a085;
  241. 241 color: #fff;
  242. 242 }
  243. 243 .color-darkgreen {
  244. 244 color: #16a085;
  245. 245 }
  246. 246
  247. 247 .darkgreen h1,
  248. 248 .darkgreen h2,
  249. 249 .darkgreen h3,
  250. 250 .darkgreen h4,
  251. 251 .darkgreen h5,
  252. 252 .darkgreen h6,
  253. 253 .bg-darkgreen h1,
  254. 254 .bg-darkgreen h2,
  255. 255 .bg-darkgreen h3,
  256. 256 .bg-darkgreen h4,
  257. 257 .bg-darkgreen h5,
  258. 258 .bg-darkgreen h6 {
  259. 259 color: #fff;
  260. 260 }
  261. 261
  262. 262 .brightgreen,
  263. 263 .bg-brightgreen {
  264. 264 background-color: #2ecc71;
  265. 265 color: white;
  266. 266 }
  267. 267 .color-brightgreen {
  268. 268 color: #2ecc71;
  269. 269 }
  270. 270
  271. 271 .brightgreen h1,
  272. 272 .brightgreen h2,
  273. 273 .brightgreen h3,
  274. 274 .brightgreen h4,
  275. 275 .brightgreen h5,
  276. 276 .brightgreen h6,
  277. 277 .bg-brightgreen h1,
  278. 278 .bg-brightgreen h2,
  279. 279 .bg-brightgreen h3,
  280. 280 .bg-brightgreen h4,
  281. 281 .bg-brightgreen h5,
  282. 282 .bg-brightgreen h6 {
  283. 283 color: #fff;
  284. 284 }
  285. 285
  286. 286 .darkbrightgreen,
  287. 287 .bg-darkbrightgreen {
  288. 288 background-color: #27AE60;
  289. 289 color: white;
  290. 290 }
  291. 291 .color-darkbrightgreen {
  292. 292 color: #27AE60;
  293. 293 }
  294. 294
  295. 295 .darkbrightgreen h1,
  296. 296 .darkbrightgreen h2,
  297. 297 .darkbrightgreen h3,
  298. 298 .darkbrightgreen h4,
  299. 299 .darkbrightgreen h5,
  300. 300 .darkbrightgreen h6,
  301. 301 .bg-brightgreen h1,
  302. 302 .bg-brightgreen h2,
  303. 303 .bg-brightgreen h3,
  304. 304 .bg-brightgreen h4,
  305. 305 .bg-brightgreen h5,
  306. 306 .bg-brightgreen h6 {
  307. 307 color: #fff;
  308. 308 }
  309. 309
  310. 310 .yellow,
  311. 311 .bg-yellow {
  312. 312 background: #f1c40f;
  313. 313 color: #fff;
  314. 314 }
  315. 315
  316. 316 .yellow h1,
  317. 317 .yellow h2,
  318. 318 .yellow h3,
  319. 319 .yellow h4,
  320. 320 .yellow h5,
  321. 321 .yellow h6,
  322. 322 .bg-yellow h1,
  323. 323 .bg-yellow h2,
  324. 324 .bg-yellow h3,
  325. 325 .bg-yellow h4,
  326. 326 .bg-yellow h5,
  327. 327 .bg-yellow h6 {
  328. 328 color: #fff;
  329. 329 }
  330. 330
  331. 331 .yellow p, .bg-yellow p {
  332. 332 font-weight: 500
  333. 333 }
  334. 334
  335. 335 .lightorange,
  336. 336 .bg-lightorange {
  337. 337 background-color: #F39C12;
  338. 338 color: #fff;
  339. 339 }
  340. 340 .color-lightorange {
  341. 341 color: #F39C12;
  342. 342 }
  343. 343
  344. 344 .lightorange h1,
  345. 345 .lightorange h2,
  346. 346 .lightorange h3,
  347. 347 .lightorange h4,
  348. 348 .lightorange h5,
  349. 349 .lightorange h6,
  350. 350 .bg-lightorange h1,
  351. 351 .bg-lightorange h2,
  352. 352 .bg-lightorange h3,
  353. 353 .bg-lightorange h4,
  354. 354 .bg-lightorange h5,
  355. 355 .bg-lightorange h6 {
  356. 356 color: #fff;
  357. 357 }
  358. 358
  359. 359 .lightorange p, .bg-lightorange p {
  360. 360 font-weight: 500
  361. 361 }
  362. 362
  363. 363 .orange,
  364. 364 .bg-orange {
  365. 365 background-color: #E67E22;
  366. 366 color: #fff;
  367. 367 }
  368. 368 .color-orange {
  369. 369 color: #E67E22;
  370. 370 }
  371. 371
  372. 372 .orange h1,
  373. 373 .orange h2,
  374. 374 .orange h3,
  375. 375 .orange h4,
  376. 376 .orange h5,
  377. 377 .orange h6,
  378. 378 .bg-orange h1,
  379. 379 .bg-orange h2,
  380. 380 .bg-orange h3,
  381. 381 .bg-orange h4,
  382. 382 .bg-orange h5,
  383. 383 .bg-orange h6 {
  384. 384 color: #fff;
  385. 385 }
  386. 386
  387. 387 .darkorange,
  388. 388 .bg-darkorange {
  389. 389 background-color: #D35400;
  390. 390 color: #fff;
  391. 391 }
  392. 392 .color-darkorange {
  393. 393 color: #D35400;
  394. 394 }
  395. 395
  396. 396 .darkorange h1,
  397. 397 .darkorange h2,
  398. 398 .darkorange h3,
  399. 399 .darkorange h4,
  400. 400 .darkorange h5,
  401. 401 .darkorange h6,
  402. 402 .bg-darkorange h1,
  403. 403 .bg-darkorange h2,
  404. 404 .bg-darkorange h3,
  405. 405 .bg-darkorange h4,
  406. 406 .bg-darkorange h5,
  407. 407 .bg-darkorange h6 {
  408. 408 color: #fff;
  409. 409 }
  410. 410
  411. 411 .blue,
  412. 412 .bg-blue {
  413. 413 background-color: #3498db;
  414. 414 color: #fff;
  415. 415 }
  416. 416 .color-blue {
  417. 417 color: #3498db;
  418. 418 }
  419. 419
  420. 420 .blue h1,
  421. 421 .blue h2,
  422. 422 .blue h3,
  423. 423 .blue h4,
  424. 424 .blue h5,
  425. 425 .blue h6,
  426. 426 .bg-blue h1,
  427. 427 .bg-blue h2,
  428. 428 .bg-blue h3,
  429. 429 .bg-blue h4,
  430. 430 .bg-blue h5,
  431. 431 .bg-blue h6 {
  432. 432 color: #fff;
  433. 433 }
  434. 434
  435. 435 .darkblue,
  436. 436 .bg-darkblue {
  437. 437 background-color: #2980b9;
  438. 438 color: #fff;
  439. 439 }
  440. 440 .color-darkblue {
  441. 441 color: #2980b9;
  442. 442 }
  443. 443
  444. 444 .darkblue h1,
  445. 445 .darkblue h2,
  446. 446 .darkblue h3,
  447. 447 .darkblue h4,
  448. 448 .darkblue h5,
  449. 449 .darkblue h6,
  450. 450 .bg-darkblue h1,
  451. 451 .bg-darkblue h2,
  452. 452 .bg-darkblue h3,
  453. 453 .bg-darkblue h4,
  454. 454 .bg-darkblue h5,
  455. 455 .bg-darkblue h6 {
  456. 456 color: #fff;
  457. 457 }
  458. 458
  459. 459
  460. 460 .purple,
  461. 461 .bg-purple {
  462. 462 background-color: #9B59B6;
  463. 463 color: #fff;
  464. 464 }
  465. 465 .color-purple {
  466. 466 color: #9B59B6;
  467. 467 }
  468. 468
  469. 469 .purple h1,
  470. 470 .purple h2,
  471. 471 .purple h3,
  472. 472 .purple h4,
  473. 473 .purple h5,
  474. 474 .purple h6,
  475. 475 .bg-purple h1,
  476. 476 .bg-purple h2,
  477. 477 .bg-purple h3,
  478. 478 .bg-purple h4,
  479. 479 .bg-purple h5,
  480. 480 .bg-purple h6 {
  481. 481 color: #fff;
  482. 482 }
  483. 483
  484. 484 .darkpurple,
  485. 485 .bg-darkpurple {
  486. 486 background-color: #8E44AD;
  487. 487 color: #fff;
  488. 488 }
  489. 489 .color-darkpurple {
  490. 490 color: #8E44AD;
  491. 491 }
  492. 492
  493. 493 .darkpurple h1,
  494. 494 .darkpurple h2,
  495. 495 .darkpurple h3,
  496. 496 .darkpurple h4,
  497. 497 .darkpurple h5,
  498. 498 .darkpurple h6,
  499. 499 .bg-darkpurple h1,
  500. 500 .bg-darkpurple h2,
  501. 501 .bg-darkpurple h3,
  502. 502 .bg-darkpurple h4,
  503. 503 .bg-darkpurple h5,
  504. 504 .bg-darkpurple h6 {
  505. 505 color: #fff;
  506. 506 }
  507. 507
  508. 508 .midnightblue,
  509. 509 .bg-midnightblue {
  510. 510 background-color: #34495e;
  511. 511 color: #fff;
  512. 512 }
  513. 513 .color-midnightblue {
  514. 514 color: #34495e;
  515. 515 }
  516. 516
  517. 517 .midnightblue h1,
  518. 518 .midnightblue h2,
  519. 519 .midnightblue h3,
  520. 520 .midnightblue h4,
  521. 521 .midnightblue h5,
  522. 522 .midnightblue h6,
  523. 523 .bg-midnightblue h1,
  524. 524 .bg-midnightblue h2,
  525. 525 .bg-midnightblue h3,
  526. 526 .bg-midnightblue h4,
  527. 527 .bg-midnightblue h5,
  528. 528 .bg-midnightblue h6 {
  529. 529 color: #fff;
  530. 530 }
  531. 531
  532. 532 .darkmidnightblue,
  533. 533 .bg-darkmidnightblue {
  534. 534 background-color: #2C3E50;
  535. 535 color: #fff;
  536. 536 }
  537. 537 .color-darkmidnightblue {
  538. 538 color: #2C3E50;
  539. 539 }
  540. 540
  541. 541 .darkmidnightblue h1,
  542. 542 .darkmidnightblue h2,
  543. 543 .darkmidnightblue h3,
  544. 544 .darkmidnightblue h4,
  545. 545 .darkmidnightblue h5,
  546. 546 .darkmidnightblue h6,
  547. 547 .bg-darkmidnightblue h1,
  548. 548 .bg-darkmidnightblue h2,
  549. 549 .bg-darkmidnightblue h3,
  550. 550 .bg-darkmidnightblue h4,
  551. 551 .bg-darkmidnightblue h5,
  552. 552 .bg-darkmidnightblue h6 {
  553. 553 color: #fff;
  554. 554 }
  555. 555
  556. 556 .red, .bg-red {
  557. 557 background-color: #ff7878;
  558. 558 color: #fff;
  559. 559 }
  560. 560 .color-red {
  561. 561 color: #ff7878;
  562. 562 }
  563. 563
  564. 564 .red h1,
  565. 565 .red h2,
  566. 566 .red h3,
  567. 567 .red h4,
  568. 568 .red h5,
  569. 569 .red h6,
  570. 570 .bg-red h1,
  571. 571 .bg-red h2,
  572. 572 .bg-red h3,
  573. 573 .bg-red h4,
  574. 574 .bg-red h5,
  575. 575 .bg-red h6 {
  576. 576 color: #fff;
  577. 577 }
  578. 578
  579. 579
  580. 580 .brightred, .bg-brightred {
  581. 581 background-color: #E74C3C;
  582. 582 color: #fff;
  583. 583 }
  584. 584 .color-brightred {
  585. 585 color: #E74C3C;
  586. 586 }
  587. 587
  588. 588 .brightred h1,
  589. 589 .brightred h2,
  590. 590 .brightred h3,
  591. 591 .brightred h4,
  592. 592 .brightred h5,
  593. 593 .brightred h6,
  594. 594 .bg-brightred h1,
  595. 595 .bg-brightred h2,
  596. 596 .bg-brightred h3,
  597. 597 .bg-brightred h4,
  598. 598 .bg-brightred h5,
  599. 599 .bg-brightred h6 {
  600. 600 color: #fff;
  601. 601 }
  602. 602
  603. 603 .darkred, .bg-darkred {
  604. 604 background-color: #C0392B;
  605. 605 color: #fff;
  606. 606 }
  607. 607 .color-darkred {
  608. 608 color: #C0392B;
  609. 609 }
  610. 610
  611. 611 .darkred h1,
  612. 612 .darkred h2,
  613. 613 .darkred h3,
  614. 614 .darkred h4,
  615. 615 .darkred h5,
  616. 616 .darkred h6,
  617. 617 .bg-darkred h1,
  618. 618 .bg-darkred h2,
  619. 619 .bg-darkred h3,
  620. 620 .bg-darkred h4,
  621. 621 .bg-darkred h5,
  622. 622 .bg-darkred h6 {
  623. 623 color: #fff;
  624. 624 }
  625. 625
  626. 626 .almostblack,
  627. 627 .bg-almostblack {
  628. 628 background-color: #2f2f2f;
  629. 629 color: #fff;
  630. 630 }
  631. 631 .color-almostblack {
  632. 632 color: #2f2f2f;
  633. 633 }
  634. 634
  635. 635 .almostblack h1,
  636. 636 .almostblack h2,
  637. 637 .almostblack h3,
  638. 638 .almostblack h4,
  639. 639 .almostblack h5,
  640. 640 .almostblack h6,
  641. 641 .bg-almostblack h1,
  642. 642 .bg-almostblack h2,
  643. 643 .bg-almostblack h3,
  644. 644 .bg-almostblack h4,
  645. 645 .bg-almostblack h5,
  646. 646 .bg-almostblack h6 {
  647. 647 color: #fff;
  648. 648 }
  649. 649
  650. 650 .notquiteblack,
  651. 651 .bg-notquiteblack {
  652. 652 background-color: #222;
  653. 653 color: #fff;
  654. 654 }
  655. 655 .color-notquiteblack {
  656. 656 color: #222;
  657. 657 }
  658. 658
  659. 659 .notquiteblack h1,
  660. 660 .notquiteblack h2,
  661. 661 .notquiteblack h3,
  662. 662 .notquiteblack h4,
  663. 663 .notquiteblack h5,
  664. 664 .notquiteblack h6,
  665. 665 .bg-notquiteblack h1,
  666. 666 .bg-notquiteblack h2,
  667. 667 .bg-notquiteblack h3,
  668. 668 .bg-notquiteblack h4,
  669. 669 .bg-notquiteblack h5,
  670. 670 .bg-notquiteblack h6 {
  671. 671 color: #fff;
  672. 672 }
  673. 673
  674. 674 .black,
  675. 675 .bg-black {
  676. 676 background-color: #000;
  677. 677 color: #fff;
  678. 678 }
  679. 679 .color-black {
  680. 680 color: #000;
  681. 681 }
  682. 682
  683. 683 .black h1,
  684. 684 .black h2,
  685. 685 .black h3,
  686. 686 .black h4,
  687. 687 .black h5,
  688. 688 .black h6,
  689. 689 .bg-black h1,
  690. 690 .bg-black h2,
  691. 691 .bg-black h3,
  692. 692 .bg-black h4,
  693. 693 .bg-black h5,
  694. 694 .bg-black h6 {
  695. 695 color: #fff;
  696. 696 }
  697. 697
  698. 698 /* Set the icons to white for all dark-colored sections */
  699. 699 .lightgreen i,
  700. 700 .bg-lightgreen i,
  701. 701 .darkgreen i,
  702. 702 .bg-darkgreen i,
  703. 703 .brightgreen i,
  704. 704 .bg-brightgreen i,
  705. 705 .darkbrightgreen i,
  706. 706 .bg-darkbrightgreen i,
  707. 707 .blue i,
  708. 708 .bg-blue i,
  709. 709 .darkblue i,
  710. 710 .bg-darkblue i,
  711. 711 .purple i,
  712. 712 .bg-purple i,
  713. 713 .darkpurple i,
  714. 714 .bg-darkpurple i,
  715. 715 .midnightblue i,
  716. 716 .bg-midnightblue i,
  717. 717 .darkmidnightblue i,
  718. 718 .bg-darkmidnightblue i,
  719. 719 .yellow i,
  720. 720 .bg-yellow i,
  721. 721 .lightorange i,
  722. 722 .bg-lightorange i,
  723. 723 .orange i,
  724. 724 .bg-orange i,
  725. 725 .darkorange i,
  726. 726 .bg-darkorange i,
  727. 727 .red i,
  728. 728 .bg-red i,
  729. 729 .brightred i,
  730. 730 .bg-brightred i,
  731. 731 .darkred i,
  732. 732 .bg-darkred i,
  733. 733 .notquiteblack i,
  734. 734 .bg-notquitetblack i,
  735. 735 .almostblack i,
  736. 736 .bg-almostblack i,
  737. 737 .black i,
  738. 738 .bg-black i {
  739. 739 color: #fff;
  740. 740 }
  741. 741
  742. 742 .lightgreen a i:hover,
  743. 743 .bg-lightgreen a i:hover,
  744. 744 .darkgreen a i:hover,
  745. 745 .bg-darkgreen a i:hover,
  746. 746 .brightgreen a i:hover,
  747. 747 .bg-brightgreen a i:hover,
  748. 748 .darkbrightgreen a i:hover,
  749. 749 .bg-darkbrightgreen a i:hover,
  750. 750 .blue a i:hover,
  751. 751 .bg-blue a i:hover,
  752. 752 .darkblue a i:hover,
  753. 753 .bg-darkblue a i:hover,
  754. 754 .purple a i:hover,
  755. 755 .bg-purple a i:hover,
  756. 756 .darkpurple a i:hover,
  757. 757 .bg-darkpurple a i:hover,
  758. 758 .midnightblue a i:hover,
  759. 759 .bg-midnightblue a i:hover,
  760. 760 .darkmidnightblue a i:hover,
  761. 761 .bg-darkmidnightblue a i:hover,
  762. 762 .yellow a i:hover,
  763. 763 .bg-yellow a i:hover,
  764. 764 .lightorange a i:hover,
  765. 765 .bg-lightorange a i:hover,
  766. 766 .orange a i:hover,
  767. 767 .bg-orange a i:hover,
  768. 768 .darkorange a i:hover,
  769. 769 .bg-darkorange a i:hover,
  770. 770 .red a i:hover,
  771. 771 .bg-red a i:hover,
  772. 772 .brightred a i:hover,
  773. 773 .bg-brightred a i:hover,
  774. 774 .darkred a i:hover,
  775. 775 .bg-darkred a i:hover,
  776. 776 .notquiteblack a i:hover,
  777. 777 .bg-notquitetblack a i:hover,
  778. 778 .almostblack a i:hover,
  779. 779 .bg-almostblack a i:hover,
  780. 780 .black a i:hover,
  781. 781 .bg-black a i:hover {
  782. 782 color: #e7e7e7;
  783. 783 }
  784. 784
  785. 785 /* Set the link color to white and underlined for certain background colors */
  786. 786 .lightgreen a:not(.btn),
  787. 787 .bg-lightgreen a:not(.btn),
  788. 788 .darkgreen a:not(.btn),
  789. 789 .bg-darkgreen a:not(.btn),
  790. 790 .brightgreen a:not(.btn),
  791. 791 .bg-brightgreen a:not(.btn),
  792. 792 .brightdarkgreen a:not(.btn),
  793. 793 .bg-brightdarkgreen a:not(.btn),
  794. 794 .yellow a:not(.btn),
  795. 795 .bg-yellow a:not(.btn),
  796. 796 .lightorange a:not(.btn),
  797. 797 .bg-lightorange a:not(.btn),
  798. 798 .orange a:not(.btn),
  799. 799 .bg-orange a:not(.btn),
  800. 800 .darkorange a:not(.btn),
  801. 801 .bg-darkorange a:not(.btn),
  802. 802 .blue a:not(.btn),
  803. 803 .bg-blue a:not(.btn),
  804. 804 .darkblue a:not(.btn),
  805. 805 .bg-darkblue a:not(.btn),
  806. 806 /*.midnightblue a:not(.btn),
  807. 807 .bg-midnightblue a:not(.btn),*/
  808. 808 .red a:not(.btn),
  809. 809 .bg-red a:not(.btn),
  810. 810 .brightred a:not(.btn),
  811. 811 .bg-brightred a:not(.btn),
  812. 812 .darkred a:not(.btn),
  813. 813 .bg-darkred a:not(.btn) {
  814. 814 color: #fff;
  815. 815 text-decoration: underline;
  816. 816 }
  817. 817
  818. 818 .lightgreen a:hover:not(.btn),
  819. 819 .bg-lightgreen a:hover:not(.btn),
  820. 820 .darkgreen a:hover:not(.btn),
  821. 821 .bg-darkgreen a:hover:not(.btn),
  822. 822 .brightgreen a:hover:not(.btn),
  823. 823 .bg-brightgreen a:hover:not(.btn),
  824. 824 .darkbrightgreen a:hover:not(.btn),
  825. 825 .bg-darkbrightgreen a:hover:not(.btn),
  826. 826 .yellow a:hover:not(.btn),
  827. 827 .bg-yellow a:hover:not(.btn),
  828. 828 .lightorange a:hover:not(.btn),
  829. 829 .bg-lightorange a:hover:not(.btn),
  830. 830 .orange a:hover:not(.btn),
  831. 831 .bg-orange a:hover:not(.btn),
  832. 832 .darkorange a:hover:not(.btn),
  833. 833 .bg-darkorange a:hover:not(.btn),
  834. 834 .blue a:hover:not(.btn),
  835. 835 .bg-blue a:hover:not(.btn),
  836. 836 .darkblue a:hover:not(.btn),
  837. 837 .bg-darkblue a:hover:not(.btn),
  838. 838 /*.midnightblue a:hover:not(.btn),
  839. 839 .bg-midnightblue a:hover:not(.btn),*/
  840. 840 .red a:hover:not(.btn),
  841. 841 .bg-red a:hover:not(.btn),
  842. 842 .darkred a:not(.btn),
  843. 843 .bg-darkred a:not(.btn) {
  844. 844 color: #e7e7e7;
  845. 845 }
  846. 846
  847. 847 .form-control {
  848. 848 color: #555;
  849. 849 }
  850. 850
  851. 851 /* Set input field focus color to green */
  852. 852 /*.form-control:focus,
  853. 853 textarea#comment:focus {*/
  854. 854 /*input:focus,
  855. 855 textarea:focus {
  856. 856 border-color: #1abc9c;
  857. 857 -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, 0.6);
  858. 858 box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(109, 233, 102, 0.6); */
  859. 859 /*-webkit-appearance: none !important;*/
  860. 860 /* outline: 0;
  861. 861 }*/
  862. 862
  863. 863 /* Force search field to not be rounded on iOS devices */
  864. 864 input.search-field {
  865. 865 -webkit-appearance: none !important;
  866. 866 -webkit-border-radius: 0 !important;
  867. 867 -moz-border-radius: 0 !important;
  868. 868 border-radius: 0 !important;
  869. 869 }
  870. 870
  871. 871 /*
  872. 872 * SET INPUT BUTTONS TO LOOK LIKE BTN-PRIMARY (GREEN)
  873. 873 */
  874. 874 button,
  875. 875 html input[type="button"],
  876. 876 input[type="submit"] {
  877. 877 color: #fff;
  878. 878 background-color: #C1C1C1;
  879. 879 border-color: #1abc9c;
  880. 880 background-image: none;
  881. 881 font-size: 16px;
  882. 882 line-height: 22px;
  883. 883 padding: 6px 12px;
  884. 884 border: none;
  885. 885 -webkit-border-radius: 4px;
  886. 886 -moz-border-radius: 4px;
  887. 887 border-radius: 4px;
  888. 888 outline: 0;
  889. 889 }
  890. 890 button:hover,
  891. 891 button:focus,
  892. 892 html input[type="button"]:hover,
  893. 893 html input[type="button"]:focus,
  894. 894 input[type="submit"]:hover,
  895. 895 input[type="submit"]:focus {
  896. 896 color: #fff;
  897. 897 background-color: #B1B1B1;
  898. 898 border-color: #16a085;
  899. 899 outline: 0;
  900. 900 }
  901. 901
  902. 902 /* Set navbar hover and active to green */
  903. 903 /*
  904. 904 .dropdown-menu>li>a:hover,
  905. 905 .dropdown-menu>li>a:focus {
  906. 906 color: #fff;
  907. 907 background-color: #1abc9c
  908. 908 }
  909. 909
  910. 910 .navbar-default .navbar-nav>.active>a,
  911. 911 .navbar-default .navbar-nav>.active>a:hover,
  912. 912 .navbar-default .navbar-nav>.active>a:focus {
  913. 913 color: #fff;
  914. 914 background-color: #1abc9c
  915. 915 }
  916. 916
  917. 917 .navbar-default .navbar-nav>li>a:hover,
  918. 918 .navbar-default .navbar-nav>li>a:focus {
  919. 919 color: #fff;
  920. 920 background-color: #1abc9c
  921. 921 }
  922. 922 .navbar-default .navbar-nav>.open>a,
  923. 923 .navbar-default .navbar-nav>.open>a:hover,
  924. 924 .navbar-default .navbar-nav>.open>a:focus {
  925. 925 color: #fff;
  926. 926 background-color: #1abc9c
  927. 927 }
  928. 928
  929. 929 @media (max-width:767px) {
  930. 930 .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover,
  931. 931 .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus {
  932. 932 color: #fff;
  933. 933 background-color: #1abc9c
  934. 934 }
  935. 935
  936. 936 .navbar-default .navbar-nav .open .dropdown-menu>.active>a,
  937. 937 .navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover,
  938. 938 .navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus {
  939. 939 color: #fff;
  940. 940 background-color: #1abc9c
  941. 941 }
  942. 942 }
  943. 943 */
  944. 944
  945. 945 /* Bootstrap uses "active" style on the <li>, but WordPress paginate_links() uses
  946. 946 * "current" in a <span> tag on the link. Also set the hover to match the primary button
  947. 947 * color.
  948. 948 */
  949. 949 .pagination>li>a,
  950. 950 .pagination>li>span,
  951. 951 span.page-numbers.current {
  952. 952 color: #16a085;
  953. 953 }
  954. 954 .pagination>li>a:hover,
  955. 955 .pagination>li>span:hover,
  956. 956 .pagination>li>a:focus,
  957. 957 .pagination>li>span:focus,
  958. 958 span.page-numbers.current {
  959. 959 z-index: 2;
  960. 960 color: #fff;
  961. 961 background-color: #16a085;
  962. 962 border-color: #16a085;
  963. 963 }
  964. 964
  965. 965 /* Get rid of gradient on carousel left and right */
  966. 966 .carousel-control.left, .carousel-control.right {
  967. 967 background-image: none;
  968. 968 background-repeat: none;
  969. 969 }
  970. 970 .carousel-caption,
  971. 971 .carousel-caption h4,
  972. 972 .carousel-caption p {
  973. 973 font-weight: bold;
  974. 974 }
  975. 975 .carousel-caption {
  976. 976 text-shadow: none;
  977. 977 background-color: #16a085;
  978. 978 color: #fff;
  979. 979 opacity: .75;
  980. 980 font-weight: bold;
  981. 981 }
  982. 982 .carousel-caption a {
  983. 983 color: #fff;
  984. 984 text-decoration: underline;
  985. 985 }
  986. 986 .carousel-caption a:hover,
  987. 987 .carousel-caption a:focus {
  988. 988 color: #bdc3c7; /*silver*/
  989. 989 }
  990. 990
  991. 991 .sticky .entry-title:after {
  992. 992 background-color: #1abc9c;
  993. 993 color: #fff;
  994. 994 }
  995. 995
  996. 996 .bypostauthor {
  997. 997 }
  998. 998
  999. 999 /* Push the carousel indicators down below the image or content */
  1000. 1000 .carousel-indicators {
  1001. 1001 bottom: -35px;
  1002. 1002 }
  1003. 1003
  1004. 1004 /* Make user profile pics (avatars) circles */
  1005. 1005 .avatar {
  1006. 1006 -webkit-border-radius: 50%;
  1007. 1007 -moz-border-radius: 50%;
  1008. 1008 border-radius: 50%;
  1009. 1009 }
  1010. 1010 img.avatar.thumbnail {
  1011. 1011 border: none;
  1012. 1012 padding: 0;
  1013. 1013 }
  1014. 1014
  1015. 1015 /*
  1016. 1016 * NEW STUFF ADDED, SUCH AS ADDITIONAL BUTTONS
  1017. 1017 */
  1018. 1018
  1019. 1019 /* New button that is inverted (hollow) so works on any dark background */
  1020. 1020 a.btn.btn-hollow,
  1021. 1021 button.btn.btn-hollow {
  1022. 1022 color: #fff;
  1023. 1023 border: 2px solid #fff;
  1024. 1024 background-color: transparent;
  1025. 1025 }
  1026. 1026 /*.btn-hollow:hover, a.btn.btn-hollow:hover {*/
  1027. 1027 .btn-hollow:hover,
  1028. 1028 btn.btn-hollow:hover,
  1029. 1029 button.btn.btn-hollow:hover {
  1030. 1030 color: #2f2f2f;
  1031. 1031 background-color: #fff
  1032. 1032 }
  1033. 1033 .white button.btn.btn-hollow,
  1034. 1034 .white .btn.btn-hollow,
  1035. 1035 .bg-white button.btn.btn-hollow,
  1036. 1036 .bg-white .btn.btn-hollow,
  1037. 1037 .offwhite button.btn.btn-hollow,
  1038. 1038 .offwhite .btn.btn-hollow,
  1039. 1039 .bg-offwhite button.btn.btn-hollow,
  1040. 1040 .bg-offwhite .btn.btn-hollow,
  1041. 1041 .lightgray button.btn.btn-hollow,
  1042. 1042 .lightgray .btn.btn-hollow,
  1043. 1043 .bg-lightgray button.btn.btn-hollow,
  1044. 1044 .bg-lightgray .btn.btn-hollow,
  1045. 1045 .gray button.btn.btn-hollow,
  1046. 1046 .gray .btn.btn-hollow,
  1047. 1047 .bg-gray button.btn.btn-hollow,
  1048. 1048 .bg-gray .btn.btn-hollow,
  1049. 1049 .darkgray button.btn.btn-hollow,
  1050. 1050 .darkgray .btn.btn-hollow,
  1051. 1051 .bg-darkgray button.btn.btn-hollow,
  1052. 1052 .bg-darkgray .btn.btn-hollow {
  1053. 1053 color: #1abc9c;
  1054. 1054 border: 2px solid #1abc9c;
  1055. 1055 background-color: transparent;
  1056. 1056 }
  1057. 1057 button.btn.btn-hollow:hover,
  1058. 1058 .btn.btn-hollow:hover {
  1059. 1059 color: #2f2f2f;
  1060. 1060 background-color: #fff;
  1061. 1061 }
  1062. 1062
  1063. 1063 /* New button that is partially transparent to let background color show through */
  1064. 1064 .btn-transparent {
  1065. 1065 display: inline-block;
  1066. 1066 background-color: rgba(0, 0, 0, 0.35);
  1067. 1067 color: inherit;
  1068. 1068 }
  1069. 1069
  1070. 1070 .btn-transparent:hover,
  1071. 1071 .btn-transparent:focus {
  1072. 1072 color: #fff;
  1073. 1073 text-decoration: none;
  1074. 1074 background-color: rgba(0, 0, 0, 0.5);
  1075. 1075 }
  1076. 1076
  1077. 1077 /* Enhance Bootstrap to allow for columns with no gutter (margin) */
  1078. 1078 .row.no-gutters {
  1079. 1079 margin-right: 0;
  1080. 1080 margin-left: 0;
  1081. 1081 }
  1082. 1082 .row.no-gutters > [class^="col-"],
  1083. 1083 .row.no-gutters > [class*=" col-"] {
  1084. 1084 padding-right: 0;
  1085. 1085 padding-left: 0;
  1086. 1086 }
  1087. 1087
Bookmark: javascript:location='http://shauninman.com/vs/?url='+escape(location)