You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

323 lines
6.4 KiB

6 years ago
6 years ago
  1. /*!
  2. * Start Bootstrap - Grayscale v3.3.7+1 (http://startbootstrap.com/template-overviews/grayscale)
  3. * Copyright 2013-2016 Start Bootstrap
  4. * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
  5. */
  6. /*
  7. original
  8. verd #42DCA3
  9. verd fosc #1d9b6c
  10. canviat
  11. groc rgb(61,235,214)
  12. cyan fosc #64acbc
  13. fons fosc #21252b
  14. fons més fosc #1B1E23
  15. fons fosquissim #070a0f
  16. */
  17. body {
  18. width: 100%;
  19. height: 100%;
  20. font-family: 'Roboto Slab', serif;
  21. color: black;
  22. /*background-color: #0E1218;*/
  23. background-color: white;
  24. }
  25. html {
  26. width: 100%;
  27. height: 100%;
  28. }
  29. h1,
  30. h2,
  31. h3,
  32. h4,
  33. h5,
  34. h6 {
  35. margin: 0 0 35px;
  36. /*text-transform: uppercase;*/
  37. font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
  38. font-weight: 700;
  39. letter-spacing: 1px;
  40. }
  41. p {
  42. margin: 0 0 25px;
  43. font-size: 18px;
  44. line-height: 1.5;
  45. }
  46. @media (min-width: 768px) {
  47. p {
  48. margin: 0 0 35px;
  49. font-size: 20px;
  50. line-height: 1.6;
  51. }
  52. }
  53. a {
  54. color: #B39DDB;
  55. -webkit-transition: all 0.2s ease-in-out;
  56. -moz-transition: all 0.2s ease-in-out;
  57. transition: all 0.2s ease-in-out;
  58. }
  59. a:hover,
  60. a:focus {
  61. text-decoration: none;
  62. color: #633ea8;
  63. }
  64. .light {
  65. font-weight: 400;
  66. }
  67. .navbar-custom {
  68. margin-bottom: 0;
  69. border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  70. text-transform: uppercase;
  71. font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
  72. /*background-color: black;*/
  73. }
  74. .navbar-custom .navbar-toggle {
  75. color: white;
  76. background-color: rgba(255, 255, 255, 0.2);
  77. font-size: 12px;
  78. }
  79. .navbar-custom .navbar-toggle:focus,
  80. .navbar-custom .navbar-toggle:active {
  81. outline: none;
  82. }
  83. .navbar-custom .navbar-brand {
  84. font-weight: 700;
  85. }
  86. .navbar-custom .navbar-brand:focus {
  87. outline: none;
  88. }
  89. .navbar-custom a {
  90. color: black;
  91. }
  92. .navbar-custom .nav li a {
  93. -webkit-transition: background 0.3s ease-in-out;
  94. -moz-transition: background 0.3s ease-in-out;
  95. transition: background 0.3s ease-in-out;
  96. }
  97. .navbar-custom .nav li a:hover {
  98. color: rgba(255, 255, 255, 0.8);
  99. outline: none;
  100. background-color: transparent;
  101. }
  102. .navbar-custom .nav li a:focus,
  103. .navbar-custom .nav li a:active {
  104. outline: none;
  105. background-color: transparent;
  106. }
  107. .navbar-custom .nav li.active {
  108. outline: none;
  109. }
  110. .navbar-custom .nav li.active a {
  111. background-color: rgba(255, 255, 255, 0.3);
  112. }
  113. .navbar-custom .nav li.active a:hover {
  114. color: white;
  115. }
  116. @media (min-width: 768px) {
  117. .navbar-custom {
  118. padding: 20px 0;
  119. border-bottom: none;
  120. letter-spacing: 1px;
  121. background: transparent;
  122. -webkit-transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
  123. -moz-transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
  124. transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
  125. }
  126. .navbar-custom.top-nav-collapse {
  127. padding: 0;
  128. background: white;
  129. border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  130. }
  131. }
  132. .intro {
  133. display: table;
  134. width: 100%;
  135. height: auto;
  136. padding: 100px 0;
  137. text-align: center;
  138. color: white;
  139. background-color: black;
  140. }
  141. .intro .intro-body {
  142. display: table-cell;
  143. vertical-align: middle;
  144. }
  145. .intro .intro-body .brand-heading {
  146. font-size: 40px;
  147. }
  148. .intro .intro-body .intro-text {
  149. font-size: 18px;
  150. }
  151. @media (min-width: 768px) {
  152. .intro {
  153. height: 100%;
  154. padding: 0;
  155. }
  156. .intro .intro-body .brand-heading {
  157. font-size: 100px;
  158. }
  159. .intro .intro-body .intro-text {
  160. font-size: 26px;
  161. }
  162. }
  163. .btn-circle {
  164. width: 70px;
  165. height: 70px;
  166. margin-top: 15px;
  167. padding: 7px 16px;
  168. border: 2px solid white;
  169. border-radius: 100% !important;
  170. font-size: 40px;
  171. color: white;
  172. background: transparent;
  173. -webkit-transition: background 0.3s ease-in-out;
  174. -moz-transition: background 0.3s ease-in-out;
  175. transition: background 0.3s ease-in-out;
  176. }
  177. .btn-circle:hover,
  178. .btn-circle:focus {
  179. outline: none;
  180. color: white;
  181. background: rgba(255, 255, 255, 0.1);
  182. }
  183. .btn-circle i.animated {
  184. -webkit-transition-property: -webkit-transform;
  185. -webkit-transition-duration: 1s;
  186. -moz-transition-property: -moz-transform;
  187. -moz-transition-duration: 1s;
  188. }
  189. .btn-circle:hover i.animated {
  190. -webkit-animation-name: pulse;
  191. -moz-animation-name: pulse;
  192. -webkit-animation-duration: 1.5s;
  193. -moz-animation-duration: 1.5s;
  194. -webkit-animation-iteration-count: infinite;
  195. -moz-animation-iteration-count: infinite;
  196. -webkit-animation-timing-function: linear;
  197. -moz-animation-timing-function: linear;
  198. }
  199. @-webkit-keyframes pulse {
  200. 0% {
  201. -webkit-transform: scale(1);
  202. transform: scale(1);
  203. }
  204. 50% {
  205. -webkit-transform: scale(1.2);
  206. transform: scale(1.2);
  207. }
  208. 100% {
  209. -webkit-transform: scale(1);
  210. transform: scale(1);
  211. }
  212. }
  213. @-moz-keyframes pulse {
  214. 0% {
  215. -moz-transform: scale(1);
  216. transform: scale(1);
  217. }
  218. 50% {
  219. -moz-transform: scale(1.2);
  220. transform: scale(1.2);
  221. }
  222. 100% {
  223. -moz-transform: scale(1);
  224. transform: scale(1);
  225. }
  226. }
  227. .content-section {
  228. padding-top: 100px;
  229. }
  230. .download-section {
  231. width: 100%;
  232. padding: 50px 0;
  233. color: white;
  234. background-color: black;
  235. }
  236. #map {
  237. width: 100%;
  238. height: 200px;
  239. margin-top: 100px;
  240. }
  241. @media (min-width: 767px) {
  242. .content-section {
  243. padding-top: 250px;
  244. }
  245. .download-section {
  246. padding: 100px 0;
  247. }
  248. #map {
  249. height: 400px;
  250. margin-top: 250px;
  251. }
  252. }
  253. .btn {
  254. text-transform: uppercase;
  255. font-family: "Montserrat", "Helvetica Neue", Helvetica, Arial, sans-serif;
  256. font-weight: 400;
  257. -webkit-transition: all 0.3s ease-in-out;
  258. -moz-transition: all 0.3s ease-in-out;
  259. transition: all 0.3s ease-in-out;
  260. border-radius: 0;
  261. }
  262. .btn-default {
  263. border: 1px solid #B39DDB;
  264. color: #B39DDB;
  265. background-color: transparent;
  266. }
  267. .btn-default:hover,
  268. .btn-default:focus {
  269. border: 1px solid #B39DDB;
  270. outline: none;
  271. color: black;
  272. background-color: #B39DDB;
  273. }
  274. ul.banner-social-buttons {
  275. margin-top: 0;
  276. }
  277. @media (max-width: 1199px) {
  278. ul.banner-social-buttons {
  279. margin-top: 15px;
  280. }
  281. }
  282. @media (max-width: 767px) {
  283. ul.banner-social-buttons li {
  284. display: block;
  285. margin-bottom: 20px;
  286. padding: 0;
  287. }
  288. ul.banner-social-buttons li:last-child {
  289. margin-bottom: 0;
  290. }
  291. }
  292. footer {
  293. padding: 50px 0;
  294. }
  295. footer p {
  296. margin: 0;
  297. }
  298. ::-moz-selection {
  299. text-shadow: none;
  300. background: #fcfcfc;
  301. background: rgba(255, 255, 255, 0.2);
  302. }
  303. ::selection {
  304. text-shadow: none;
  305. background: #fcfcfc;
  306. background: rgba(255, 255, 255, 0.2);
  307. }
  308. img::selection {
  309. background: transparent;
  310. }
  311. img::-moz-selection {
  312. background: transparent;
  313. }
  314. body {
  315. webkit-tap-highlight-color: rgba(255, 255, 255, 0.2);
  316. }