ihavecookies.css 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. :root {
  2. --dialog-width: 600px;
  3. --dialog-color: #043d5f;
  4. --title-color: #ffffff;
  5. --message-color: #ffffff;
  6. --white: #ffffff;
  7. --links: #25a2c7;
  8. --accept-btn: #4ab98b;
  9. --accept-btn-hover: #16a369;
  10. --decline-btn: #ee4b5a;
  11. --decline-btn-hover: #de2c3d;
  12. }
  13. /* Cookie Dialog */
  14. #gdpr-cookie-message {
  15. position: fixed;
  16. right: 30px;
  17. bottom: 30px;
  18. max-width: var(--dialog-width);
  19. background-color: var(--dialog-color);
  20. padding: 20px;
  21. border-radius: 5px;
  22. box-shadow: 0 6px 6px rgba(0,0,0,0.25);
  23. margin-left: 30px;
  24. z-index: 99;
  25. }
  26. #gdpr-cookie-message h4 {
  27. color: var(--title-color);
  28. font-size: 20px;
  29. font-weight: 700;
  30. margin-bottom: 10px;
  31. }
  32. #gdpr-cookie-message p {
  33. color: var(--message-color);
  34. font-size: 15px;
  35. line-height: 1.5em;
  36. }
  37. #gdpr-cookie-message p:last-child {
  38. margin-bottom: 0;
  39. text-align: right;
  40. }
  41. #gdpr-cookie-message a {
  42. color: var(--links);
  43. text-decoration: none;
  44. font-size: 15px;
  45. padding-bottom: 2px;
  46. border-bottom: 1px dotted rgba(255,255,255,0.75);
  47. transition: all 0.3s ease-in;
  48. }
  49. #gdpr-cookie-message a:hover {
  50. color: var(--white);
  51. border-bottom-color: var(--links);
  52. transition: all 0.3s ease-in;
  53. }
  54. #gdpr-cookie-message button,
  55. button#ihavecookiesBtn {
  56. border: none;
  57. background: var(--accept-btn);
  58. color: var(--white);
  59. font-size: 15px;
  60. padding: 7px 40px;
  61. border-radius: 3px;
  62. margin-left: 15px;
  63. cursor: pointer;
  64. transition: all 0.3s ease-in;
  65. }
  66. #gdpr-cookie-message button:hover {
  67. background: var(--accept-btn-hover);
  68. color: var(--white);
  69. transition: all 0.3s ease-in;
  70. }
  71. button#gdpr-cookie-advanced {
  72. background: var(--decline-btn);
  73. color: var(--white);
  74. }
  75. button#gdpr-cookie-advanced:hover {
  76. background: var(--decline-btn-hover);
  77. color: var(--white);
  78. transition: all 0.3s ease-in;
  79. }