backgrounds.css 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  1. /* Blurred backgrounds */
  2. .blurred-bg-1 {
  3. background-image: url('../image-resources/blurred-bg/blurred-bg-1.jpg');
  4. }
  5. .blurred-bg-2 {
  6. background-image: url('../image-resources/blurred-bg/blurred-bg-2.jpg');
  7. }
  8. .blurred-bg-3 {
  9. background-image: url('../image-resources/blurred-bg/blurred-bg-3.jpg');
  10. }
  11. .blurred-bg-4 {
  12. background-image: url('../image-resources/blurred-bg/blurred-bg-4.jpg');
  13. }
  14. .blurred-bg-5 {
  15. background-image: url('../image-resources/blurred-bg/blurred-bg-5.jpg');
  16. }
  17. .blurred-bg-6 {
  18. background-image: url('../image-resources/blurred-bg/blurred-bg-6.jpg');
  19. }
  20. .blurred-bg-7 {
  21. background-image: url('../image-resources/blurred-bg/blurred-bg-7.jpg');
  22. }
  23. .blurred-bg-8 {
  24. background-image: url('../image-resources/blurred-bg/blurred-bg-8.jpg');
  25. }
  26. .blurred-bg-9 {
  27. background-image: url('../image-resources/blurred-bg/blurred-bg-9.jpg');
  28. }
  29. .blurred-bg-10 {
  30. background-image: url('../image-resources/blurred-bg/blurred-bg-10.jpg');
  31. }
  32. .blurred-bg-11 {
  33. background-image: url('../image-resources/blurred-bg/blurred-bg-11.jpg');
  34. }
  35. .blurred-bg-12 {
  36. background-image: url('../image-resources/blurred-bg/blurred-bg-12.jpg');
  37. }
  38. .blurred-bg-13 {
  39. background-image: url('../image-resources/blurred-bg/blurred-bg-13.jpg');
  40. }
  41. .blurred-bg-14 {
  42. background-image: url('../image-resources/blurred-bg/blurred-bg-14.jpg');
  43. }
  44. .blurred-bg-15 {
  45. background-image: url('../image-resources/blurred-bg/blurred-bg-15.jpg');
  46. }
  47. .blurred-bg-16 {
  48. background-image: url('../image-resources/blurred-bg/blurred-bg-16.jpg');
  49. }
  50. /* Polygon backgrounds */
  51. .poly-bg-1 {
  52. background-image: url('../image-resources/poly-bg/poly-bg-1.jpg');
  53. }
  54. .poly-bg-2 {
  55. background-image: url('../image-resources/poly-bg/poly-bg-2.jpg');
  56. }
  57. .poly-bg-3 {
  58. background-image: url('../image-resources/poly-bg/poly-bg-3.jpg');
  59. }
  60. .poly-bg-4 {
  61. background-image: url('../image-resources/poly-bg/poly-bg-4.jpg');
  62. }
  63. .poly-bg-5 {
  64. background-image: url('../image-resources/poly-bg/poly-bg-5.jpg');
  65. }
  66. .poly-bg-6 {
  67. background-image: url('../image-resources/poly-bg/poly-bg-6.jpg');
  68. }
  69. .poly-bg-7 {
  70. background-image: url('../image-resources/poly-bg/poly-bg-7.jpg');
  71. }
  72. .poly-bg-8 {
  73. background-image: url('../image-resources/poly-bg/poly-bg-8.jpg');
  74. }
  75. .poly-bg-9 {
  76. background-image: url('../image-resources/poly-bg/poly-bg-9.jpg');
  77. }
  78. .poly-bg-10 {
  79. background-image: url('../image-resources/poly-bg/poly-bg-10.jpg');
  80. }
  81. /* Blurred images */
  82. .blurred-img-1 {
  83. background-image: url('../image-resources/blurred-img/blurred-img-1.jpg');
  84. }
  85. .blurred-img-2 {
  86. background-image: url('../image-resources/blurred-img/blurred-img-2.jpg');
  87. }
  88. .blurred-img-3 {
  89. background-image: url('../image-resources/blurred-img/blurred-img-3.jpg');
  90. }
  91. .blurred-img-4 {
  92. background-image: url('../image-resources/blurred-img/blurred-img-4.jpg');
  93. }
  94. .blurred-img-5 {
  95. background-image: url('../image-resources/blurred-img/blurred-img-5.jpg');
  96. }
  97. /* Full images */
  98. .full-bg-1 {
  99. background-image: url('../image-resources/full-bg/full-bg-1.jpg');
  100. }
  101. .full-bg-2 {
  102. background-image: url('../image-resources/full-bg/full-bg-2.jpg');
  103. }
  104. .full-bg-3 {
  105. background-image: url('../image-resources/full-bg/full-bg-3.jpg');
  106. }
  107. .full-bg-4 {
  108. background-image: url('../image-resources/full-bg/full-bg-4.jpg');
  109. }
  110. .full-bg-5 {
  111. background-image: url('../image-resources/full-bg/full-bg-5.jpg');
  112. }
  113. .full-bg-6 {
  114. background-image: url('../image-resources/full-bg/full-bg-6.jpg');
  115. }
  116. .full-bg-7 {
  117. background-image: url('../image-resources/full-bg/full-bg-7.jpg');
  118. }
  119. .full-bg-8 {
  120. background-image: url('../image-resources/full-bg/full-bg-8.jpg');
  121. }
  122. .full-bg-9 {
  123. background-image: url('../image-resources/full-bg/full-bg-9.jpg');
  124. }
  125. .full-bg-10 {
  126. background-image: url('../image-resources/full-bg/full-bg-10.jpg');
  127. }
  128. .full-bg-11 {
  129. background-image: url('../image-resources/full-bg/full-bg-11.jpg');
  130. }
  131. .full-bg-12 {
  132. background-image: url('../image-resources/full-bg/full-bg-12.jpg');
  133. }
  134. .full-bg-13 {
  135. background-image: url('../image-resources/full-bg/full-bg-13.jpg');
  136. }
  137. .full-bg-14 {
  138. background-image: url('../image-resources/full-bg/full-bg-14.jpg');
  139. }
  140. /* Pattern backgrounds */
  141. .pattern-bg-1 {
  142. background-image: url('../image-resources/pattern-bg/pattern-bg-1.png');
  143. }
  144. .pattern-bg-2 {
  145. background-image: url('../image-resources/pattern-bg/pattern-bg-2.png');
  146. }
  147. .pattern-bg-3 {
  148. background-image: url('../image-resources/pattern-bg/pattern-bg-3.png');
  149. }
  150. .pattern-bg-4 {
  151. background-image: url('../image-resources/pattern-bg/pattern-bg-4.png');
  152. }
  153. .pattern-bg-5 {
  154. background-image: url('../image-resources/pattern-bg/pattern-bg-5.png');
  155. }
  156. .pattern-bg-6 {
  157. background-image: url('../image-resources/pattern-bg/pattern-bg-6.png');
  158. }
  159. .pattern-bg-7 {
  160. background-image: url('../image-resources/pattern-bg/pattern-bg-7.png');
  161. }
  162. .pattern-bg-8 {
  163. background-image: url('../image-resources/pattern-bg/pattern-bg-8.png');
  164. }
  165. .pattern-bg-9 {
  166. background-image: url('../image-resources/pattern-bg/pattern-bg-9.png');
  167. }
  168. .pattern-bg-10 {
  169. background-image: url('../image-resources/pattern-bg/pattern-bg-10.png');
  170. }
  171. /* Gradients */
  172. .bg-gradient-1,
  173. .bg-gradient-2,
  174. .bg-gradient-3,
  175. .bg-gradient-4,
  176. .bg-gradient-5,
  177. .bg-gradient-6,
  178. .bg-gradient-7,
  179. .bg-gradient-8,
  180. .bg-gradient-9 {
  181. background-color: transparent !important;
  182. }
  183. .bg-gradient-1 {
  184. background: radial-gradient(circle at 8.75% 8.45%, #003973, transparent 100%),radial-gradient(circle at 94.06% 82.83%, #E5E5BE, transparent 100%),radial-gradient(circle at 50% 50%, #668cc2, #668cc2 100%);
  185. }
  186. .bg-gradient-2 {
  187. background: radial-gradient(circle at 1.98% 3.00%, #348F50, transparent 100%),radial-gradient(circle at 98.02% 98.00%, #56B4D3, transparent 100%),radial-gradient(circle at 50% 50%, #668cc2, #668cc2 100%);
  188. }
  189. .bg-gradient-3 {
  190. background: radial-gradient(circle at 1.98% 74.02%, #E55D87, transparent 100%),radial-gradient(circle at 98.02% 35.97%, #5FC3E4, transparent 100%),radial-gradient(circle at 50% 50%, #0cc285, #0cc285 100%);
  191. }
  192. .bg-gradient-4 {
  193. background: radial-gradient(circle at 1.98% 2.00%, #B993D6, transparent 100%),radial-gradient(circle at 98.02% 92.01%, #8CA6DB, transparent 100%),radial-gradient(circle at 50% 50%, #0cc285, #0cc285 100%);
  194. }
  195. .bg-gradient-5 {
  196. background: radial-gradient(circle at 1.98% 89.01%, #7474BF, transparent 100%),radial-gradient(circle at 98.02% 21.98%, #348AC7, transparent 100%),radial-gradient(circle at 50% 50%, #0cc285, #0cc285 100%);
  197. }
  198. .bg-gradient-6 {
  199. background: radial-gradient(circle at 1.98% 40.96%, #00c6ff, transparent 100%),radial-gradient(circle at 98.02% 52.04%, #0072ff, transparent 100%),radial-gradient(circle at 50% 50%, #0cc285, #0cc285 100%);
  200. }
  201. .bg-gradient-7 {
  202. background: radial-gradient(circle at 1.98% 85.01%, #134E5E, transparent 100%),radial-gradient(circle at 98.02% 18.98%, #71B280, transparent 100%),radial-gradient(circle at 50% 50%, #0cc285, #0cc285 100%);
  203. }
  204. .bg-gradient-8 {
  205. background: radial-gradient(circle at 1.98% 20.98%, #4b6cb7, transparent 100%),radial-gradient(circle at 98.02% 20.98%, #182848, transparent 100%),radial-gradient(circle at 50% 50%, #0cc285, #0cc285 100%);
  206. }
  207. .bg-gradient-9 {
  208. background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…IgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
  209. background: -moz-linear-gradient(-65deg, #008fe2 0, #00b29c 100%);
  210. background: -webkit-gradient(linear, left top, right bottom, color-stop(0%, #008fe2), color-stop(100%, #00b29c));
  211. background: -webkit-linear-gradient(-65deg, #008fe2 0, #00b29c 100%);
  212. background: -o-linear-gradient(-65deg, #008fe2 0, #00b29c 100%);
  213. background: -ms-linear-gradient(-65deg, #008fe2 0, #00b29c 100%);
  214. background: linear-gradient(154deg, #008fe2 0, #00b29c 100%);
  215. filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#008fe2', endColorstr='#00b29c', GradientType=1);
  216. }