template.css 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924
  1. @import url(//fonts.googleapis.com/css?family=Montserrat:400|Raleway:300,400,600|Inconsolata);
  2. #header #logo h3, #header #navbar .panel-activation, #footer p {
  3. position: relative;
  4. top: 50%;
  5. -webkit-transform: translateY(-50%);
  6. -moz-transform: translateY(-50%);
  7. -o-transform: translateY(-50%);
  8. -ms-transform: translateY(-50%);
  9. transform: translateY(-50%); }
  10. .button, .button-secondary {
  11. display: inline-block;
  12. padding: 7px 20px; }
  13. .button-small.button, .button-small.button-secondary {
  14. padding: 3px 10px;
  15. font-size: 0.9rem; }
  16. html, body {
  17. height: 100%; }
  18. body {
  19. background: #fff;
  20. color: #444;
  21. -webkit-font-smoothing: antialiased;
  22. -moz-osx-font-smoothing: grayscale; }
  23. a {
  24. color: #1BB3E9; }
  25. a:hover {
  26. color: #0e6e90; }
  27. b, strong, label, th {
  28. font-weight: 600; }
  29. #container {
  30. min-height: 100%;
  31. position: relative; }
  32. .fullwidth #body {
  33. padding-left: 0;
  34. padding-right: 0; }
  35. #body {
  36. background: #fff;
  37. padding-top: 8rem;
  38. padding-bottom: 11rem; }
  39. .left {
  40. float: left; }
  41. .right {
  42. float: right; }
  43. .default-animation, #body, #header, #header #logo h3, #header #navbar ul.navigation, .modular .showcase .button {
  44. -webkit-transition: all 0.5s ease;
  45. -moz-transition: all 0.5s ease;
  46. transition: all 0.5s ease; }
  47. .padding-horiz, .fullwidth #header, .fullwidth #breadcrumbs, .fullwidth .blog-header, .fullwidth .blog-content-item, .fullwidth .content-wrapper, .fullwidth ul.pagination, .fullwidth #body > .modular-row, #body, #header, #footer {
  48. padding-left: 7rem;
  49. padding-right: 7rem; }
  50. @media only all and (max-width: 59.938em) {
  51. .padding-horiz, .fullwidth #header, .fullwidth #breadcrumbs, .fullwidth .blog-header, .fullwidth .blog-content-item, .fullwidth .content-wrapper, .fullwidth ul.pagination, .fullwidth #body > .modular-row, #body, #header, #footer {
  52. padding-left: 4rem;
  53. padding-right: 4rem; } }
  54. @media only all and (max-width: 47.938em) {
  55. .padding-horiz, .fullwidth #header, .fullwidth #breadcrumbs, .fullwidth .blog-header, .fullwidth .blog-content-item, .fullwidth .content-wrapper, .fullwidth ul.pagination, .fullwidth #body > .modular-row, #body, #header, #footer {
  56. padding-left: 1rem;
  57. padding-right: 1rem; } }
  58. .padding-vert {
  59. padding-top: 3rem;
  60. padding-bottom: 3rem; }
  61. #header {
  62. position: fixed;
  63. z-index: 10;
  64. width: 100%;
  65. height: 5rem;
  66. background-color: rgba(255, 255, 255, 0.9);
  67. box-shadow: 0 0.05rem 1rem rgba(0, 0, 0, 0.15); }
  68. #header.scrolled {
  69. height: 3rem;
  70. background-color: rgba(255, 255, 255, 0.9) !important;
  71. box-shadow: 0 0.05rem 1rem rgba(0, 0, 0, 0.15) !important; }
  72. #header.scrolled #logo h3 {
  73. color: #444 !important;
  74. font-size: 1.6rem !important; }
  75. #header.scrolled #logo a, #header.scrolled #navbar span {
  76. color: #444 !important; }
  77. #header.scrolled #navbar a {
  78. color: #1BB3E9 !important; }
  79. #header.scrolled #navbar a:hover {
  80. color: #0e6e90 !important; }
  81. #header.scrolled #navbar a:before, #header.scrolled #navbar a:after {
  82. background-color: #1BB3E9 !important; }
  83. #header.scrolled .navigation {
  84. margin-top: 0.5rem !important; }
  85. #header > .grid, #header #logo, #header #navbar {
  86. height: 100%; }
  87. #header #logo {
  88. float: left; }
  89. #header #logo h3 {
  90. font-size: 2rem;
  91. line-height: 2rem;
  92. margin: 0;
  93. text-transform: uppercase; }
  94. #header #logo h3 a {
  95. color: #444; }
  96. #header #navbar {
  97. font-size: 0.9rem;
  98. text-transform: capitalize;
  99. /* Child Indicator */ }
  100. #header #navbar .has-children > a > span {
  101. display: inline-block;
  102. padding-right: 8px; }
  103. #header #navbar .has-children > a > span:after {
  104. font-family: FontAwesome;
  105. content: '\f107';
  106. position: absolute;
  107. display: inline-block;
  108. right: 8px;
  109. top: 4px; }
  110. #header #navbar .has-children > a:after, #header #navbar .has-children > a:before {
  111. display: none; }
  112. #header #navbar .has-children .has-children > a > span:after {
  113. content: '\f105'; }
  114. #header #navbar .navigation > .has-children:hover > a {
  115. background: #f6f6f6;
  116. border: 1px solid #ececec;
  117. border-bottom-color: #f6f6f6;
  118. margin: -1px -1px 0 -1px;
  119. z-index: 1000;
  120. position: relative;
  121. padding-bottom: 1px; }
  122. #header #navbar ul {
  123. margin: 0;
  124. padding: 0;
  125. list-style: none; }
  126. #header #navbar ul.navigation {
  127. display: inline-block;
  128. float: right;
  129. margin-top: 1.4rem; }
  130. #header #navbar ul.navigation li {
  131. float: left;
  132. position: relative;
  133. /*Active dropdown nav item */
  134. /* Dropdown CSS */
  135. /* Active on Hover */ }
  136. #header #navbar ul.navigation li a {
  137. font-family: "Montserrat", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  138. display: inline-block;
  139. padding: 0.3rem 0.8rem;
  140. -webkit-backface-visibility: hidden; }
  141. #header #navbar ul.navigation li a:before, #header #navbar ul.navigation li a:after {
  142. content: "";
  143. position: absolute;
  144. width: 100%;
  145. height: 1px;
  146. bottom: 0;
  147. left: 0;
  148. background-color: #1BB3E9;
  149. visibility: hidden;
  150. -webkit-transform: scaleX(0);
  151. -moz-transform: scaleX(0);
  152. -ms-transform: scaleX(0);
  153. -o-transform: scaleX(0);
  154. transform: scaleX(0);
  155. -webkit-transition: all 0.2s ease;
  156. -moz-transition: all 0.2s ease;
  157. transition: all 0.2s ease; }
  158. #header #navbar ul.navigation li a:hover:before {
  159. visibility: visible;
  160. -webkit-transform: scaleX(0.75);
  161. -moz-transform: scaleX(0.75);
  162. -ms-transform: scaleX(0.75);
  163. -o-transform: scaleX(0.75);
  164. transform: scaleX(0.75); }
  165. #header #navbar ul.navigation li a.active:after {
  166. top: 0;
  167. visibility: visible;
  168. -webkit-transform: scaleX(0.75);
  169. -moz-transform: scaleX(0.75);
  170. -ms-transform: scaleX(0.75);
  171. -o-transform: scaleX(0.75);
  172. transform: scaleX(0.75); }
  173. #header #navbar ul.navigation li.active a:after {
  174. top: 0;
  175. visibility: visible;
  176. -webkit-transform: scaleX(0.75);
  177. -moz-transform: scaleX(0.75);
  178. -ms-transform: scaleX(0.75);
  179. -o-transform: scaleX(0.75);
  180. transform: scaleX(0.75); }
  181. #header #navbar ul.navigation li ul {
  182. position: absolute;
  183. background-color: #f6f6f6;
  184. border: 1px solid #ececec;
  185. border-top: 0;
  186. min-width: 12rem;
  187. text-align: left;
  188. z-index: 999;
  189. left: -1px;
  190. display: none; }
  191. #header #navbar ul.navigation li ul li {
  192. display: block;
  193. float: none;
  194. /* Active Dropdown nav item */ }
  195. #header #navbar ul.navigation li ul li.active > a {
  196. background-color: #ececec;
  197. color: #1BB3E9; }
  198. #header #navbar ul.navigation li ul li:hover > a {
  199. background-color: #1BB3E9;
  200. color: #fff; }
  201. #header #navbar ul.navigation li ul li a {
  202. display: block;
  203. margin: 0 -1px; }
  204. #header #navbar ul.navigation li ul li a:after, #header #navbar ul.navigation li ul li a:before {
  205. display: none; }
  206. #header #navbar ul.navigation li ul ul {
  207. left: 100%;
  208. top: 0px; }
  209. #header #navbar ul.navigation li:hover > ul {
  210. display: block; }
  211. @media only all and (max-width: 59.938em) {
  212. #header #navbar ul.navigation {
  213. display: none; } }
  214. #header #navbar .panel-activation {
  215. padding: 1rem;
  216. display: none;
  217. font-size: 1.8rem;
  218. cursor: pointer;
  219. float: right; }
  220. @media only all and (max-width: 59.938em) {
  221. #header #navbar .panel-activation {
  222. display: inline-block; } }
  223. .header-image.fullwidth #body {
  224. padding-left: 0;
  225. padding-right: 0; }
  226. .header-image.fullwidth #body > .listing-row {
  227. padding-left: 7rem;
  228. padding-right: 7rem; }
  229. .header-image .listing-row:last-child {
  230. margin-bottom: 2rem; }
  231. .header-image #body .flush-top {
  232. margin-top: -9.5rem;
  233. padding-top: 9rem; }
  234. .header-image #breadcrumbs {
  235. margin-top: 1rem; }
  236. .header-image #header {
  237. background-color: rgba(255, 255, 255, 0);
  238. box-shadow: none; }
  239. .header-image #header .navigation .has-children:hover a {
  240. color: #1BB3E9; }
  241. .header-image #header #logo h3, .header-image #header #logo a {
  242. color: #FFFFFF; }
  243. .header-image #header a, .header-image #header .menu-btn {
  244. color: #FFFFFF; }
  245. .header-image #header a:before, .header-image #header a:after {
  246. background-color: rgba(255, 255, 255, 0.7) !important; }
  247. #footer {
  248. position: absolute;
  249. background: #333;
  250. height: 6rem;
  251. right: 0;
  252. bottom: 0;
  253. left: 0;
  254. color: #999;
  255. text-align: center; }
  256. #footer a:hover {
  257. color: #fff; }
  258. #footer .totop {
  259. position: absolute;
  260. bottom: 5rem;
  261. text-align: center;
  262. left: 0;
  263. right: 0; }
  264. #footer .totop span {
  265. font-size: 1.7rem;
  266. line-height: 2.5rem;
  267. background: #333;
  268. width: 3rem;
  269. height: 2rem;
  270. border-radius: 3px;
  271. display: inline-block;
  272. text-align: top; }
  273. #footer p {
  274. margin: 0; }
  275. #footer p .fa {
  276. color: #fff; }
  277. html, body, button, input, select, textarea, .pure-g, .pure-g [class*="pure-u"] {
  278. font-family: "Raleway", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  279. font-weight: 400; }
  280. h1, h2, h3, h4, h5, h6 {
  281. font-family: "Montserrat", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  282. font-weight: 400;
  283. text-rendering: optimizeLegibility;
  284. letter-spacing: -0px; }
  285. h1 {
  286. font-size: 3.2rem; }
  287. @media only all and (max-width: 47.938em) {
  288. h1 {
  289. font-size: 2.5rem;
  290. line-height: 1.2;
  291. margin-bottom: 2.5rem; } }
  292. @media only all and (min-width: 48em) and (max-width: 59.938em) {
  293. h2 {
  294. font-size: 2.1rem; } }
  295. @media only all and (max-width: 47.938em) {
  296. h2 {
  297. font-size: 2rem; } }
  298. @media only all and (min-width: 48em) and (max-width: 59.938em) {
  299. h3 {
  300. font-size: 1.7rem; } }
  301. @media only all and (max-width: 47.938em) {
  302. h3 {
  303. font-size: 1.6rem; } }
  304. @media only all and (min-width: 48em) and (max-width: 59.938em) {
  305. h4 {
  306. font-size: 1.35rem; } }
  307. @media only all and (max-width: 47.938em) {
  308. h4 {
  309. font-size: 1.25rem; } }
  310. h1 {
  311. text-align: center;
  312. letter-spacing: -3px; }
  313. h2 {
  314. letter-spacing: -2px; }
  315. h3 {
  316. letter-spacing: -1px; }
  317. h1 + h2 {
  318. margin: -2rem 0 2rem 0;
  319. font-size: 2rem;
  320. line-height: 1;
  321. text-align: center;
  322. font-family: "Raleway", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  323. font-weight: 300; }
  324. @media only all and (min-width: 48em) and (max-width: 59.938em) {
  325. h1 + h2 {
  326. font-size: 1.6rem; } }
  327. @media only all and (max-width: 47.938em) {
  328. h1 + h2 {
  329. font-size: 1.5rem; } }
  330. h2 + h3 {
  331. margin: 0.5rem 0 2rem 0;
  332. font-size: 2rem;
  333. line-height: 1;
  334. text-align: center;
  335. font-family: "Raleway", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  336. font-weight: 300; }
  337. @media only all and (min-width: 48em) and (max-width: 59.938em) {
  338. h2 + h3 {
  339. font-size: 1.6rem; } }
  340. @media only all and (max-width: 47.938em) {
  341. h2 + h3 {
  342. font-size: 1.5rem; } }
  343. blockquote {
  344. border-left: 10px solid #F0F2F4; }
  345. blockquote p {
  346. font-size: 1.1rem;
  347. color: #999; }
  348. blockquote cite {
  349. display: block;
  350. text-align: right;
  351. color: #666;
  352. font-size: 1.2rem; }
  353. blockquote > blockquote > blockquote {
  354. margin: 0; }
  355. blockquote > blockquote > blockquote p {
  356. padding: 15px;
  357. display: block;
  358. font-size: 1rem;
  359. margin-top: 0rem;
  360. margin-bottom: 0rem; }
  361. blockquote > blockquote > blockquote > p {
  362. margin-left: -71px;
  363. border-left: 10px solid #F0AD4E;
  364. background: #FCF8F2;
  365. color: #df8a13; }
  366. blockquote > blockquote > blockquote > p a {
  367. color: #b06d0f; }
  368. blockquote > blockquote > blockquote > p a:hover {
  369. color: #f2b866; }
  370. blockquote > blockquote > blockquote > blockquote > p {
  371. margin-left: -94px;
  372. border-left: 10px solid #D9534F;
  373. background: #FDF7F7;
  374. color: #b52b27; }
  375. blockquote > blockquote > blockquote > blockquote > p a {
  376. color: #8b211e; }
  377. blockquote > blockquote > blockquote > blockquote > p a:hover {
  378. color: #de6764; }
  379. blockquote > blockquote > blockquote > blockquote > blockquote > p {
  380. margin-left: -118px;
  381. border-left: 10px solid #5BC0DE;
  382. background: #F4F8FA;
  383. color: #28a1c5; }
  384. blockquote > blockquote > blockquote > blockquote > blockquote > p a {
  385. color: #1f7e9a; }
  386. blockquote > blockquote > blockquote > blockquote > blockquote > p a:hover {
  387. color: #70c8e2; }
  388. blockquote > blockquote > blockquote > blockquote > blockquote > blockquote > p {
  389. margin-left: -142px;
  390. border-left: 10px solid #5CB85C;
  391. background: #F1F9F1;
  392. color: #3d8b3d; }
  393. blockquote > blockquote > blockquote > blockquote > blockquote > blockquote > p a {
  394. color: #2d672d; }
  395. blockquote > blockquote > blockquote > blockquote > blockquote > blockquote > p a:hover {
  396. color: #6ec06e; }
  397. code,
  398. kbd,
  399. pre,
  400. samp {
  401. font-family: "Inconsolata", monospace; }
  402. code {
  403. background: #f9f2f4;
  404. color: #9c1d3d; }
  405. pre {
  406. padding: 2rem;
  407. background: #f0f0f0;
  408. border: 1px solid #ddd;
  409. border-radius: 3px; }
  410. pre code {
  411. color: #237794;
  412. background: inherit; }
  413. hr {
  414. border-bottom: 4px solid #F0F2F4; }
  415. .page-title {
  416. margin-top: -25px;
  417. padding: 25px;
  418. float: left;
  419. clear: both;
  420. background: #1BB3E9;
  421. color: #fff; }
  422. .label {
  423. vertical-align: middle;
  424. background: #1BB3E9;
  425. border-radius: 100%;
  426. color: #fff;
  427. height: 1rem;
  428. min-width: 1rem;
  429. line-height: 1rem;
  430. display: inline-block;
  431. text-align: center;
  432. font-size: 0.7rem;
  433. font-family: "Montserrat", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
  434. margin-right: 0.75rem; }
  435. fieldset {
  436. border: 1px solid #ddd; }
  437. textarea, input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"], select[multiple=multiple] {
  438. background-color: white;
  439. border: 1px solid #ddd;
  440. box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06); }
  441. textarea:hover, input[type="email"]:hover, input[type="number"]:hover, input[type="password"]:hover, input[type="search"]:hover, input[type="tel"]:hover, input[type="text"]:hover, input[type="url"]:hover, input[type="color"]:hover, input[type="date"]:hover, input[type="datetime"]:hover, input[type="datetime-local"]:hover, input[type="month"]:hover, input[type="time"]:hover, input[type="week"]:hover, select[multiple=multiple]:hover {
  442. border-color: #c4c4c4; }
  443. textarea:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="url"]:focus, input[type="color"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, select[multiple=multiple]:focus {
  444. border-color: #1BB3E9;
  445. box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06), 0 0 5px rgba(21, 163, 214, 0.7); }
  446. .form-field .required {
  447. color: #F3443F;
  448. font-size: 3rem;
  449. line-height: 3rem;
  450. vertical-align: top;
  451. height: 1.5rem;
  452. display: inline-block; }
  453. form .buttons {
  454. text-align: center; }
  455. form input {
  456. font-weight: 400; }
  457. table {
  458. border: 1px solid #eaeaea;
  459. table-layout: auto; }
  460. th {
  461. background: #f7f7f7;
  462. padding: 0.5rem; }
  463. td {
  464. padding: 0.5rem;
  465. border: 1px solid #eaeaea; }
  466. .button {
  467. background: #fff;
  468. color: #1BB3E9;
  469. border: 1px solid #1BB3E9;
  470. border-radius: 3px; }
  471. .button:hover {
  472. background: #1BB3E9;
  473. color: #fff; }
  474. .button:active {
  475. box-shadow: 0 1px 0 #118ab5; }
  476. .button-secondary {
  477. background: #fff;
  478. color: #F6635E;
  479. border: 1px solid #F6635E;
  480. border-radius: 3px; }
  481. .button-secondary:hover {
  482. background: #F6635E;
  483. color: #fff; }
  484. .button-secondary:active {
  485. box-shadow: 0 1px 0 #f32b24; }
  486. .bullets {
  487. margin: 1.7rem 0;
  488. margin-left: -0.85rem;
  489. margin-right: -0.85rem;
  490. overflow: auto; }
  491. .bullet {
  492. float: left;
  493. padding: 0 0.85rem; }
  494. .two-column-bullet {
  495. width: 50%; }
  496. @media only all and (max-width: 47.938em) {
  497. .two-column-bullet {
  498. width: 100%; } }
  499. .three-column-bullet {
  500. width: 33.33333%; }
  501. @media only all and (max-width: 47.938em) {
  502. .three-column-bullet {
  503. width: 100%; } }
  504. .four-column-bullet {
  505. width: 25%; }
  506. @media only all and (max-width: 47.938em) {
  507. .four-column-bullet {
  508. width: 100%; } }
  509. .bullet-icon {
  510. float: left;
  511. background: #1BB3E9;
  512. padding: 0.875rem;
  513. width: 3.5rem;
  514. height: 3.5rem;
  515. border-radius: 50%;
  516. color: #fff;
  517. font-size: 1.75rem;
  518. text-align: center; }
  519. .bullet-icon-1 {
  520. background: #1BB3E9; }
  521. .bullet-icon-2 {
  522. background: #1be9da; }
  523. .bullet-icon-3 {
  524. background: #d5e91b; }
  525. .bullet-content {
  526. margin-left: 4.55rem; }
  527. .sb-slidebar {
  528. background-color: #333 !important; }
  529. #panel {
  530. padding-top: 1rem;
  531. color: #ddd; }
  532. #panel .navigation {
  533. list-style: none;
  534. padding: 0; }
  535. #panel .navigation li {
  536. border-bottom: 1px solid #3d3d3d; }
  537. #panel .navigation li a {
  538. color: #ddd;
  539. display: block;
  540. padding: 0.5rem 1rem;
  541. font-weight: 600; }
  542. #panel .navigation li a:hover {
  543. color: white;
  544. background-color: #262626; }
  545. #panel .navigation li a:last-child {
  546. border-bottom: 0; }
  547. #panel .navigation li.active > a {
  548. background: #fff;
  549. color: #444; }
  550. #panel .navigation li.active > a:hover {
  551. color: #444; }
  552. #panel .navigation li:first-child {
  553. border-top: 1px solid #3d3d3d; }
  554. #panel .navigation li ul {
  555. list-style: none;
  556. padding: 0; }
  557. #panel .navigation li ul li {
  558. border: 0 !important; }
  559. #panel .navigation li ul li a {
  560. color: #c4c4c4;
  561. padding: 0.2rem 1rem 0.2rem 2rem;
  562. font-size: 0.9rem; }
  563. #panel .navigation li ul li li a {
  564. padding-left: 3rem; }
  565. #panel .navigation li ul li li a li a {
  566. padding-left: 4rem; }
  567. #panel .navigation li ul li.active > a {
  568. background: #ccc; }
  569. .blog-header {
  570. padding-top: 2rem;
  571. padding-bottom: 2rem; }
  572. .blog-header.blog-header-image {
  573. background-size: cover;
  574. background-position: center; }
  575. .blog-header.blog-header-image h1, .blog-header.blog-header-image h2 {
  576. color: #FFFFFF; }
  577. .blog-header h1 {
  578. font-size: 4rem;
  579. margin-top: 0; }
  580. @media only all and (min-width: 48em) and (max-width: 59.938em) {
  581. .blog-header h1 {
  582. font-size: 3rem; } }
  583. @media only all and (max-width: 47.938em) {
  584. .blog-header h1 {
  585. font-size: 2.5rem;
  586. line-height: 1.2;
  587. margin-bottom: 2.5rem; } }
  588. .blog-header + .blog-content {
  589. padding-top: 3rem; }
  590. .list-item {
  591. border-bottom: 1px solid #EEEEEE;
  592. margin-bottom: 3rem; }
  593. .list-item:last-child {
  594. border-bottom: 0; }
  595. .list-item .list-blog-header {
  596. position: relative; }
  597. .list-item .list-blog-header h4 {
  598. margin-bottom: 0.5rem; }
  599. .list-item .list-blog-header h4 a {
  600. color: #444; }
  601. .list-item .list-blog-header h4 a:hover {
  602. color: #1BB3E9; }
  603. .list-item .list-blog-header img {
  604. display: block;
  605. margin-top: 1rem;
  606. border-radius: 3px; }
  607. .list-item .list-blog-date {
  608. float: right;
  609. text-align: center; }
  610. .list-item .list-blog-date span {
  611. display: block;
  612. font-size: 1.75rem;
  613. font-weight: 600;
  614. line-height: 110%; }
  615. .list-item .list-blog-date em {
  616. display: block;
  617. border-top: 1px solid #EEEEEE;
  618. font-style: normal;
  619. text-transform: uppercase; }
  620. .blog-content-item .list-blog-padding > p:nth-child(2) {
  621. font-size: 1.2rem; }
  622. .tags a {
  623. display: inline-block;
  624. font-size: 0.8rem;
  625. border: 1px solid #1BB3E9;
  626. border-radius: 3px;
  627. padding: 0.1rem 0.4rem;
  628. margin-bottom: 0.2rem;
  629. text-transform: uppercase; }
  630. .archives, .related-pages {
  631. padding: 0;
  632. list-style: none; }
  633. .archives li, .related-pages li {
  634. border-bottom: 1px solid #EEEEEE;
  635. line-height: 2rem; }
  636. .archives li:last-child, .related-pages li:last-child {
  637. border-bottom: 0; }
  638. .related-pages li a {
  639. display: block; }
  640. .related-pages .score {
  641. display: block;
  642. float: right;
  643. color: #999;
  644. font-size: 85%; }
  645. .syndicate a {
  646. margin-bottom: 1rem; }
  647. div#breadcrumbs {
  648. padding-left: 0; }
  649. @media only all and (max-width: 47.938em) {
  650. div#breadcrumbs {
  651. display: none; } }
  652. #sidebar {
  653. padding-left: 3rem; }
  654. @media only all and (max-width: 47.938em) {
  655. #sidebar {
  656. padding-left: 0; } }
  657. #sidebar .sidebar-content {
  658. margin-bottom: 3rem; }
  659. #sidebar .sidebar-content h4 {
  660. margin-bottom: 1rem; }
  661. #sidebar .sidebar-content p, #sidebar .sidebar-content ul {
  662. margin-top: 1rem; }
  663. ul.pagination {
  664. margin: 0 0 3rem;
  665. text-align: center; }
  666. .prev-next {
  667. margin-top: 5rem;
  668. text-align: center; }
  669. #error {
  670. text-align: center;
  671. display: flex;
  672. align-items: center;
  673. justify-content: center;
  674. height: 100%;
  675. padding-bottom: 6rem; }
  676. #error h1 {
  677. font-size: 5rem; }
  678. #error p {
  679. margin: 1rem 0; }
  680. .simplesearch h1 {
  681. margin-bottom: 0; }
  682. .simplesearch .center {
  683. text-align: center; }
  684. .simplesearch input {
  685. display: inline-block;
  686. max-width: 30rem;
  687. font-size: 2rem; }
  688. .simplesearch .search-image {
  689. margin-top: 1rem; }
  690. .simplesearch .search-image img {
  691. border-radius: 4px; }
  692. @media only all and (max-width: 47.938em) {
  693. .simplesearch .search-image img {
  694. display: none; } }
  695. @media only all and (max-width: 47.938em) {
  696. .simplesearch .search-item {
  697. margin-left: 0; } }
  698. .simplesearch .search-wrapper .search-submit {
  699. height: 52px;
  700. padding: 0 10px; }
  701. .simplesearch .search-wrapper .search-submit img {
  702. width: 30px; }
  703. .simplesearch .search-details {
  704. float: right;
  705. margin-top: -2.5rem;
  706. font-weight: bold;
  707. font-size: 1rem;
  708. color: #777777; }
  709. @media only all and (max-width: 47.938em) {
  710. .simplesearch .search-details {
  711. float: none;
  712. margin-top: -0.2rem;
  713. margin-bottom: 1rem; } }
  714. .simplesearch hr {
  715. border-bottom: 1px solid #eee; }
  716. .grav-lightslider .lSSlideOuter .lSPager.lSpg > li a {
  717. z-index: 1; }
  718. #body > script:first-child + .grav-lightslider {
  719. margin-top: -3rem; }
  720. .modular.header-image #header {
  721. background-color: rgba(255, 255, 255, 0);
  722. box-shadow: none; }
  723. .modular.header-image #header #logo h3 {
  724. color: #FFFFFF; }
  725. .modular.header-image #header #navbar a {
  726. color: #FFFFFF; }
  727. .modular .showcase {
  728. padding-top: 4rem;
  729. padding-bottom: 4rem;
  730. background-color: #666;
  731. background-size: cover;
  732. background-position: center;
  733. text-align: center;
  734. color: #FFFFFF; }
  735. .modular .showcase h1 {
  736. font-size: 4rem;
  737. margin-top: 0; }
  738. @media only all and (min-width: 48em) and (max-width: 59.938em) {
  739. .modular .showcase h1 {
  740. font-size: 3rem; } }
  741. @media only all and (max-width: 47.938em) {
  742. .modular .showcase h1 {
  743. font-size: 2.5rem;
  744. line-height: 1.2;
  745. margin-bottom: 2.5rem; } }
  746. .modular .showcase .button {
  747. color: #FFFFFF;
  748. padding: 0.7rem 2rem;
  749. margin-top: 2rem;
  750. background: rgba(255, 255, 255, 0);
  751. border: 1px solid #FFFFFF;
  752. border-radius: 3px;
  753. box-shadow: none;
  754. font-size: 1.3rem; }
  755. .modular .showcase .button:hover {
  756. background: rgba(255, 255, 255, 0.2); }
  757. .modular .features {
  758. padding: 6rem 0;
  759. text-align: center; }
  760. .modular .features:after {
  761. content: "";
  762. display: table;
  763. clear: both; }
  764. .modular .features h2 {
  765. margin: 0;
  766. line-height: 100%; }
  767. .modular .features p {
  768. margin: 1rem 0;
  769. font-size: 1.2rem; }
  770. @media only all and (max-width: 47.938em) {
  771. .modular .features p {
  772. font-size: 1rem; } }
  773. .modular .features .feature-items {
  774. margin-top: 2rem; }
  775. @supports not (flex-wrap: wrap) {
  776. .modular .features .feature-items {
  777. overflow: hidden; } }
  778. .modular .features .feature {
  779. display: block;
  780. float: left;
  781. width: 25%;
  782. vertical-align: top;
  783. margin-top: 2rem;
  784. margin-bottom: 1rem; }
  785. @media only all and (min-width: 30.063em) and (max-width: 47.938em) {
  786. .modular .features .feature {
  787. margin-top: 1rem;
  788. width: 50%; } }
  789. @media only all and (max-width: 30em) {
  790. .modular .features .feature {
  791. margin-top: 1rem;
  792. width: 100%; } }
  793. .modular .features .feature i.fa {
  794. font-size: 2rem;
  795. color: #1BB3E9; }
  796. .modular .features .feature h4 {
  797. margin: 0;
  798. font-size: 1.1rem; }
  799. .modular .features .feature p {
  800. display: inline-block;
  801. font-size: 1rem;
  802. margin: 0.2rem 0 1rem; }
  803. .modular .features.big {
  804. text-align: center; }
  805. .modular .features.big .feature {
  806. width: 50%; }
  807. @media only all and (max-width: 30em) {
  808. .modular .features.big .feature {
  809. margin-top: 1rem;
  810. width: 100%; } }
  811. .modular .features.big i.fa {
  812. font-size: 3rem;
  813. float: left; }
  814. .modular .features.big .feature-content {
  815. padding-right: 2rem; }
  816. .modular .features.big .feature-content.icon-offset {
  817. margin-left: 5rem; }
  818. .modular .features.big .feature-content h4 {
  819. font-size: 1.3rem;
  820. text-align: left; }
  821. .modular .features.big .feature-content p {
  822. padding: 0;
  823. text-align: left; }
  824. .callout {
  825. background: #f6f6f6;
  826. padding: 6rem 0.938rem; }
  827. @media only all and (max-width: 59.938em) {
  828. .callout {
  829. text-align: center; } }
  830. .callout .align-left {
  831. float: left;
  832. margin-right: 2rem; }
  833. @media only all and (max-width: 59.938em) {
  834. .callout .align-left {
  835. float: none;
  836. margin-right: 0; } }
  837. .callout .align-right {
  838. float: right;
  839. margin-left: 2rem; }
  840. @media only all and (max-width: 59.938em) {
  841. .callout .align-right {
  842. float: none;
  843. margin-left: 0; } }
  844. .callout img {
  845. border-radius: 3px; }
  846. .modular .modular-row:last-child {
  847. margin-bottom: 2rem; }
  848. /*# sourceMappingURL=template.css.map */