template.css 26 KB

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