No Description

style.css 21KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003
  1. @font-face {
  2. font-family: 'icomoon';
  3. src: url("../fonts/icomoon/icomoon.eot?srf3rx");
  4. src: url("../fonts/icomoon/icomoon.eot?srf3rx#iefix") format("embedded-opentype"), url("../fonts/icomoon/icomoon.ttf?srf3rx") format("truetype"), url("../fonts/icomoon/icomoon.woff?srf3rx") format("woff"), url("../fonts/icomoon/icomoon.svg?srf3rx#icomoon") format("svg");
  5. font-weight: normal;
  6. font-style: normal;
  7. }
  8. body {
  9. font-family: "Inconsolata", Arial, sans-serif;
  10. font-weight: 300;
  11. overflow: hidden;
  12. font-size: 20px;
  13. line-height: 1.5;
  14. color: #cccccc;
  15. background: #000;
  16. height: 100%;
  17. position: relative;
  18. }
  19. a {
  20. color: #8C7676;
  21. -webkit-transition: 0.5s;
  22. -o-transition: 0.5s;
  23. transition: 0.5s;
  24. }
  25. a:hover, a:active, a:focus {
  26. color: #8C7676;
  27. outline: none;
  28. }
  29. p {
  30. margin-bottom: 1.5em;
  31. font-size: 16px;
  32. }
  33. h1, h2, h3, h4, h5, h6 {
  34. color: #fff;
  35. font-family: "Inconsolata", Arial, sans-serif;
  36. font-weight: 400;
  37. margin: 0 0 0px 0;
  38. }
  39. ::-webkit-selection {
  40. color: #fff;
  41. background: #8C7676;
  42. }
  43. ::-moz-selection {
  44. color: #fff;
  45. background: #8C7676;
  46. }
  47. ::selection {
  48. color: #fff;
  49. background: #8C7676;
  50. }
  51. .navbar-collapse {
  52. border: none !important;
  53. }
  54. #fh5co-header {
  55. position: absolute;
  56. z-index: 999999;
  57. width: 100%;
  58. opacity: 1;
  59. top: 0;
  60. float: left;
  61. }
  62. #fh5co-header .navbar {
  63. padding-bottom: 0;
  64. margin-bottom: 0;
  65. display: table;
  66. }
  67. #fh5co-header #navbar {
  68. display: table-cell;
  69. vertical-align: middle;
  70. }
  71. #fh5co-header #navbar li {
  72. width: 16px;
  73. height: 16px;
  74. display: block !important;
  75. margin: 15px 0;
  76. clear: both;
  77. -webkit-border-radius: 50%;
  78. -moz-border-radius: 50%;
  79. -ms-border-radius: 50%;
  80. border-radius: 50%;
  81. }
  82. @media screen and (max-width: 768px) {
  83. #fh5co-header #navbar li {
  84. margin-left: 10px !important;
  85. }
  86. }
  87. #fh5co-header #navbar li a {
  88. font-family: "Inconsolata", Arial, sans-serif;
  89. background: rgba(255, 255, 255, 0.2);
  90. position: relative;
  91. font-size: 16px;
  92. font-weight: 400;
  93. margin: 0 auto;
  94. width: 12px;
  95. height: 12px !important;
  96. text-indent: -999999px;
  97. padding: 0;
  98. -webkit-border-radius: 50%;
  99. -moz-border-radius: 50%;
  100. -ms-border-radius: 50%;
  101. border-radius: 50%;
  102. }
  103. #fh5co-header #navbar li a span {
  104. position: relative;
  105. display: block;
  106. padding-bottom: 2px;
  107. }
  108. #fh5co-header #navbar li a:hover {
  109. color: #000;
  110. }
  111. #fh5co-header #navbar li a:hover span:before {
  112. visibility: visible;
  113. -webkit-transform: scaleX(1);
  114. -moz-transform: scaleX(1);
  115. -ms-transform: scaleX(1);
  116. -o-transform: scaleX(1);
  117. transform: scaleX(1);
  118. }
  119. #fh5co-header #navbar li.active {
  120. width: 16px;
  121. height: 16px;
  122. background: #fff;
  123. }
  124. #fh5co-header #navbar li.active a {
  125. background: #000;
  126. background: none;
  127. }
  128. @media screen and (max-width: 480px) {
  129. #fh5co-header #navbar li.active a {
  130. color: #8C7676;
  131. }
  132. }
  133. #fh5co-header .navbar-brand {
  134. float: left;
  135. display: block;
  136. font-size: 24px;
  137. font-weight: 700;
  138. padding-left: 28px;
  139. color: #535659;
  140. text-transform: uppercase;
  141. letter-spacing: 3px;
  142. position: relative;
  143. }
  144. #fh5co-header .navbar-brand:after, #fh5co-header .navbar-brand:before {
  145. content: "";
  146. position: absolute;
  147. display: block;
  148. width: 24px;
  149. height: 24px;
  150. left: -12px;
  151. margin-left: 0px;
  152. bottom: 16px;
  153. -webkit-border-radius: 50%;
  154. -moz-border-radius: 50%;
  155. -ms-border-radius: 50%;
  156. border-radius: 50%;
  157. }
  158. #fh5co-header .navbar-brand:before {
  159. left: 0px;
  160. background: rgba(140, 118, 118, 0.8);
  161. }
  162. #fh5co-header .navbar-brand > span {
  163. color: #8C7676;
  164. }
  165. @media screen and (max-width: 992px) {
  166. #fh5co-header .navbar-brand {
  167. padding-left: 55px !important;
  168. padding-right: 0 !important;
  169. }
  170. #fh5co-header .navbar-brand:after, #fh5co-header .navbar-brand:before {
  171. margin-left: 25px;
  172. }
  173. }
  174. #fh5co-header.navbar-fixed-top {
  175. position: fixed !important;
  176. -webkit-box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.1);
  177. -moz-box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.1);
  178. -ms-box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.1);
  179. box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.1);
  180. margin-top: 0px;
  181. top: 0;
  182. }
  183. #fh5co-header.navbar-fixed-top .navbar-brand {
  184. color: #535659;
  185. }
  186. #fh5co-header.navbar-fixed-top #navbar li a {
  187. -webkit-transition: 0.3s;
  188. -o-transition: 0.3s;
  189. transition: 0.3s;
  190. }
  191. #fh5co-header.navbar-fixed-top #navbar li a:hover {
  192. color: #8C7676;
  193. }
  194. @media screen and (max-width: 992px) {
  195. #fh5co-header.navbar-fixed-top #navbar li a {
  196. font-size: 20px;
  197. }
  198. }
  199. #fh5co-header.navbar-fixed-top #navbar li.active a {
  200. color: #8C7676 !important;
  201. }
  202. @media screen and (max-width: 768px) {
  203. #fh5co-header.navbar-fixed-top #navbar li.active a {
  204. color: #8C7676 !important;
  205. }
  206. }
  207. #fh5co-header.navbar-fixed-top #navbar li.active a span:before {
  208. visibility: visible;
  209. -webkit-transform: scaleX(1);
  210. transform: scaleX(1);
  211. background-color: #8C7676;
  212. }
  213. @media screen and (max-width: 768px) {
  214. #fh5co-header.navbar-fixed-top #navbar li.active a span:before {
  215. background-color: transparent;
  216. }
  217. }
  218. #fh5co-header .navbar-default {
  219. border: transparent;
  220. background: transparent;
  221. margin: 0;
  222. padding-left: 50px;
  223. padding-right: 50px;
  224. -webkit-border-radius: 0px;
  225. -moz-border-radius: 0px;
  226. -ms-border-radius: 0px;
  227. border-radius: 0px;
  228. }
  229. @media screen and (max-width: 768px) {
  230. #fh5co-header .navbar-default {
  231. margin-top: 0px;
  232. padding-right: 0px;
  233. padding-left: 0px;
  234. }
  235. }
  236. #fh5co-home {
  237. background-color: transparent;
  238. background-size: cover;
  239. position: relative;
  240. width: 100%;
  241. color: #fff;
  242. }
  243. @media screen and (max-width: 480px) {
  244. #fh5co-home {
  245. background-position: center center;
  246. background-attachment: initial;
  247. }
  248. }
  249. #fh5co-home a {
  250. color: rgba(255, 255, 255, 0.8) !important;
  251. text-decoration: underline;
  252. }
  253. #fh5co-home a:hover {
  254. color: #fff;
  255. text-decoration: none;
  256. }
  257. #fh5co-home .gradient {
  258. position: absolute;
  259. top: 0;
  260. bottom: 0;
  261. left: 0;
  262. right: 0;
  263. z-index: 2;
  264. background: rgba(0, 0, 0, 0.3);
  265. }
  266. #fh5co-home, #fh5co-home .text-wrap {
  267. height: 900px;
  268. }
  269. @media screen and (max-width: 768px) {
  270. #fh5co-home, #fh5co-home .text-wrap {
  271. height: 500px;
  272. }
  273. }
  274. #fh5co-home .text-wrap {
  275. display: table;
  276. width: 100%;
  277. position: relative;
  278. z-index: 4;
  279. }
  280. #fh5co-home .text-inner {
  281. display: table-cell;
  282. vertical-align: middle;
  283. }
  284. #fh5co-home .text-inner h1 {
  285. font-size: 60px;
  286. color: white;
  287. margin: 0 0 30px 0;
  288. font-weight: 700;
  289. line-height: 58px;
  290. }
  291. #fh5co-home .text-inner h1 span {
  292. color: #8C7676;
  293. }
  294. @media screen and (max-width: 768px) {
  295. #fh5co-home .text-inner h1 {
  296. font-size: 40px;
  297. }
  298. }
  299. #fh5co-home .text-inner h2 {
  300. font-size: 20px;
  301. line-height: 30px;
  302. font-weight: 300;
  303. color: rgba(255, 255, 255, 0.8);
  304. margin: 0 0 60px 0;
  305. }
  306. #fh5co-services,
  307. #fh5co-explore,
  308. #fh5co-team,
  309. #fh5co-footer,
  310. #fh5co-work,
  311. #fh5co-counters,
  312. #fh5co-pricing {
  313. padding: 8em 0;
  314. }
  315. @media screen and (max-width: 768px) {
  316. #fh5co-services,
  317. #fh5co-explore,
  318. #fh5co-team,
  319. #fh5co-footer,
  320. #fh5co-work,
  321. #fh5co-counters,
  322. #fh5co-pricing {
  323. padding: 3em 0;
  324. }
  325. }
  326. #fh5co-services {
  327. padding-bottom: 0;
  328. text-align: center;
  329. }
  330. .fh5co-explore {
  331. padding-bottom: 40px;
  332. }
  333. .fh5co-project .project-grid {
  334. width: 100%;
  335. height: 800px;
  336. background-size: cover;
  337. background-position: center center;
  338. position: relative;
  339. margin-bottom: 30px;
  340. display: table;
  341. }
  342. @media screen and (max-width: 768px) {
  343. .fh5co-project .project-grid {
  344. height: 400px;
  345. }
  346. }
  347. .fh5co-project .project-grid .desc {
  348. position: relative;
  349. display: table-cell;
  350. vertical-align: middle;
  351. width: 100%;
  352. height: 250px;
  353. background: rgba(0, 0, 0, 0.5);
  354. opacity: 0;
  355. -webkit-transition: 0.3s;
  356. -o-transition: 0.3s;
  357. transition: 0.3s;
  358. }
  359. @media screen and (max-width: 768px) {
  360. .fh5co-project .project-grid .desc {
  361. opacity: 1;
  362. }
  363. }
  364. .fh5co-project .project-grid .desc h3 {
  365. margin-bottom: 10px;
  366. }
  367. .fh5co-project .project-grid .desc h3 a {
  368. color: #fff;
  369. }
  370. .fh5co-project .project-grid .desc h3 a:hover, .fh5co-project .project-grid .desc h3 a:focus {
  371. text-decoration: none;
  372. }
  373. .fh5co-project .project-grid .desc span {
  374. font-size: 12px;
  375. text-transform: uppercase;
  376. color: rgba(255, 255, 255, 0.6);
  377. letter-spacing: 2px;
  378. }
  379. .fh5co-project .project-grid .desc p {
  380. padding: 0;
  381. }
  382. .fh5co-project .project-grid .desc p a {
  383. padding: 0;
  384. color: #fff;
  385. }
  386. .fh5co-project .project-grid .desc p a:hover, .fh5co-project .project-grid .desc p a:focus {
  387. text-decoration: none;
  388. }
  389. .fh5co-project .project-grid:hover .desc {
  390. opacity: 1;
  391. }
  392. .getting-started {
  393. background: #8C7676;
  394. display: -webkit-box;
  395. display: -moz-box;
  396. display: -ms-flexbox;
  397. display: -webkit-flex;
  398. display: flex;
  399. flex-wrap: wrap;
  400. -webkit-flex-wrap: wrap;
  401. -moz-flex-wrap: wrap;
  402. }
  403. .getting-started .getting-grid {
  404. background-size: cover;
  405. background-position: center center;
  406. position: relative;
  407. width: 100%;
  408. display: table;
  409. }
  410. .getting-started .getting-grid .desc {
  411. width: 50%;
  412. display: table-cell;
  413. vertical-align: middle;
  414. height: 400px;
  415. padding: 0 3em;
  416. }
  417. .getting-started h2 {
  418. color: #fff;
  419. margin-bottom: 10px;
  420. }
  421. .getting-started p {
  422. color: rgba(255, 255, 255, 0.8);
  423. }
  424. #fh5co-pricing .price-box {
  425. border: 2px solid rgba(255, 255, 255, 0.1);
  426. text-align: center;
  427. padding: 30px;
  428. -webkit-border-radius: 5px;
  429. -moz-border-radius: 5px;
  430. -ms-border-radius: 5px;
  431. border-radius: 5px;
  432. margin-bottom: 40px;
  433. position: relative;
  434. }
  435. #fh5co-pricing .price-box.popular {
  436. border: 2px solid #8C7676;
  437. }
  438. #fh5co-pricing .price-box.popular .popular-text {
  439. top: 0;
  440. left: 50%;
  441. margin-left: -65px;
  442. margin-top: -2em;
  443. position: absolute;
  444. padding: 4px 20px;
  445. background: #8C7676;
  446. color: #fff;
  447. -webkit-border-radius: 4px;
  448. -moz-border-radius: 4px;
  449. -ms-border-radius: 4px;
  450. border-radius: 4px;
  451. }
  452. #fh5co-pricing .price-box.popular .popular-text:after {
  453. content: "";
  454. position: absolute;
  455. top: 100%;
  456. left: 50%;
  457. margin-left: -10px;
  458. border-top: 10px solid black;
  459. border-top-color: #8C7676;
  460. border-left: 10px solid transparent;
  461. border-right: 10px solid transparent;
  462. }
  463. #fh5co-pricing .price-box hr {
  464. border: 1px solid #1a1a1a;
  465. }
  466. #fh5co-pricing .pricing-plan {
  467. margin: 0;
  468. padding: 0;
  469. font-size: 15px;
  470. letter-spacing: 2px;
  471. text-transform: uppercase;
  472. font-weight: 700;
  473. }
  474. #fh5co-pricing .price {
  475. font-size: 50px;
  476. color: #fff;
  477. }
  478. #fh5co-pricing .price .currency {
  479. font-size: 20px;
  480. top: -1.2em;
  481. }
  482. #fh5co-pricing .price small {
  483. font-size: 16px;
  484. }
  485. #fh5co-pricing .pricing-info {
  486. padding: 0;
  487. margin: 0 0 30px 0;
  488. }
  489. #fh5co-pricing .pricing-info li {
  490. padding: 0;
  491. margin: 0;
  492. list-style: none;
  493. text-align: center;
  494. }
  495. .core-features {
  496. display: -webkit-box;
  497. display: -moz-box;
  498. display: -ms-flexbox;
  499. display: -webkit-flex;
  500. display: flex;
  501. text-align: center;
  502. flex-wrap: wrap;
  503. -webkit-flex-wrap: wrap;
  504. -moz-flex-wrap: wrap;
  505. width: 100%;
  506. }
  507. .core-features .grid2 {
  508. width: 50%;
  509. background-size: cover;
  510. background-position: center center;
  511. position: relative;
  512. }
  513. @media screen and (max-width: 768px) {
  514. .core-features .grid2 {
  515. width: 100%;
  516. }
  517. }
  518. .core-features .grid2 .core-f {
  519. padding: 40px;
  520. }
  521. .core-features .grid2 .core-f h3 {
  522. margin-bottom: 10px;
  523. }
  524. .core-features .grid2 .core-f .core {
  525. margin-bottom: 2em;
  526. }
  527. .core-features .grid2 .core-f .core i {
  528. float: left;
  529. color: #8C7676;
  530. font-size: 28px;
  531. }
  532. .core-features .grid2 .core-f .core .fh5co-post {
  533. text-align: center;
  534. }
  535. .fh5co-counters {
  536. padding: 3em 0;
  537. background-size: cover;
  538. background-attachment: fixed;
  539. background-position: center center;
  540. }
  541. .fh5co-counters .counter-wrap {
  542. border: 1px solid red !important;
  543. }
  544. .fh5co-counters .fh5co-counter {
  545. font-size: 30px;
  546. display: block;
  547. color: white;
  548. font-family: "Inconsolata", Arial, sans-serif;
  549. width: 100%;
  550. font-weight: 400;
  551. margin-bottom: .3em;
  552. }
  553. .fh5co-counters .fh5co-counter-label {
  554. color: rgba(255, 255, 255, 0.5);
  555. text-transform: uppercase;
  556. font-size: 12px;
  557. letter-spacing: 2px;
  558. margin-bottom: 2em;
  559. display: block;
  560. }
  561. #fh5co-team .team-box {
  562. position: relative;
  563. padding: 30px;
  564. float: left;
  565. width: 100%;
  566. -webkit-box-shadow: 0px 2px 10px -1px rgba(0, 0, 0, 0.19);
  567. -moz-box-shadow: 0px 2px 10px -1px rgba(0, 0, 0, 0.19);
  568. -ms-box-shadow: 0px 2px 10px -1px rgba(0, 0, 0, 0.19);
  569. -o-box-shadow: 0px 2px 10px -1px rgba(0, 0, 0, 0.19);
  570. box-shadow: 0px 2px 10px -1px rgba(0, 0, 0, 0.19);
  571. -webkit-border-radius: 5px;
  572. -moz-border-radius: 5px;
  573. -ms-border-radius: 5px;
  574. border-radius: 5px;
  575. }
  576. @media screen and (max-width: 992px) {
  577. #fh5co-team .team-box {
  578. margin-bottom: 110px;
  579. }
  580. }
  581. #fh5co-team .team-box .user {
  582. margin: 0 auto;
  583. margin-bottom: 20px;
  584. width: 80%;
  585. }
  586. #fh5co-team .team-box .user img {
  587. width: 80%;
  588. -webkit-border-radius: 50%;
  589. -moz-border-radius: 50%;
  590. -ms-border-radius: 50%;
  591. border-radius: 50%;
  592. }
  593. #fh5co-team .team-box h3 {
  594. margin-bottom: 10px;
  595. font-weight: 700;
  596. }
  597. #fh5co-team .team-box .position {
  598. font-size: 16px;
  599. color: #8f989f;
  600. display: block;
  601. margin-bottom: 30px;
  602. }
  603. #fh5co-team .team-box .social-media {
  604. margin: 0;
  605. padding: 0;
  606. }
  607. #fh5co-team .team-box .social-media li {
  608. display: inline-block;
  609. margin: 0;
  610. padding: 0;
  611. font-size: 24px;
  612. margin-right: 10px;
  613. }
  614. #fh5co-team .team-box .social-media li a {
  615. color: rgba(255, 255, 255, 0.8);
  616. }
  617. #fh5co-team .team-box .social-media li a:hover, #fh5co-team .team-box .social-media li a:focus, #fh5co-team .team-box .social-media li a:active {
  618. text-decoration: none;
  619. color: #8C7676 !important;
  620. }
  621. .section-heading {
  622. float: left;
  623. width: 100%;
  624. padding-bottom: 50px;
  625. margin-bottom: 0px;
  626. }
  627. .section-heading h2 {
  628. margin: 0 0 20px 0;
  629. font-size: 40px;
  630. font-weight: 400;
  631. position: relative;
  632. padding-bottom: 10px;
  633. line-height: 1.5;
  634. }
  635. @media screen and (max-width: 768px) {
  636. .section-heading h2 {
  637. font-size: 28px;
  638. }
  639. }
  640. .section-heading h3 {
  641. font-size: 18px;
  642. font-weight: 400;
  643. line-height: 1.5;
  644. position: relative;
  645. display: block;
  646. padding-bottom: 0px;
  647. }
  648. @media screen and (max-width: 768px) {
  649. .section-heading h3 {
  650. font-size: 16px !important;
  651. line-height: 0px;
  652. }
  653. }
  654. #fh5co-footer {
  655. color: rgba(255, 255, 255, 0.6);
  656. }
  657. #fh5co-footer a {
  658. color: rgba(255, 255, 255, 0.6);
  659. }
  660. #fh5co-footer a:hover {
  661. color: #fff !important;
  662. text-decoration: underline;
  663. }
  664. #fh5co-footer .section-title {
  665. font-size: 22px;
  666. color: #fff;
  667. position: relative;
  668. padding-bottom: 20px;
  669. }
  670. #fh5co-footer .copy-right {
  671. position: relative;
  672. padding-top: 20px;
  673. margin-top: 40px;
  674. }
  675. #fh5co-footer .copy-right > a {
  676. color: rgba(255, 255, 255, 0.6);
  677. }
  678. #fh5co-footer .contact-info {
  679. margin: 0 0 60px 0;
  680. padding: 0;
  681. }
  682. #fh5co-footer .contact-info li {
  683. font-size: 16px;
  684. list-style: none;
  685. margin: 0 0 20px 0;
  686. position: relative;
  687. padding-left: 40px;
  688. }
  689. #fh5co-footer .contact-info li i {
  690. position: absolute;
  691. top: 0;
  692. left: 0;
  693. font-size: 22px;
  694. color: #8C7676;
  695. }
  696. #fh5co-footer .social-media {
  697. margin: 0 0 30px 0;
  698. padding: 0;
  699. }
  700. #fh5co-footer .social-media li {
  701. display: inline-block;
  702. margin: 0;
  703. padding: 0;
  704. font-size: 24px;
  705. margin-right: 10px;
  706. }
  707. #fh5co-footer .social-media li a {
  708. color: #8C7676;
  709. }
  710. #fh5co-footer .social-media li a:hover, #fh5co-footer .social-media li a:focus, #fh5co-footer .social-media li a:active {
  711. text-decoration: none;
  712. }
  713. #fh5co-footer .contact-form .form-group input[type="name"],
  714. #fh5co-footer .contact-form .form-group input[type="text"],
  715. #fh5co-footer .contact-form .form-group input[type="email"],
  716. #fh5co-footer .contact-form .form-group textarea {
  717. font-size: 16px;
  718. }
  719. #fh5co-footer .contact-form .form-group input[type="name"]::-webkit-input-placeholder,
  720. #fh5co-footer .contact-form .form-group input[type="text"]::-webkit-input-placeholder,
  721. #fh5co-footer .contact-form .form-group input[type="email"]::-webkit-input-placeholder,
  722. #fh5co-footer .contact-form .form-group textarea::-webkit-input-placeholder {
  723. color: rgba(255, 255, 255, 0.5);
  724. }
  725. #fh5co-footer .contact-form .form-group input[type="name"]:-moz-placeholder,
  726. #fh5co-footer .contact-form .form-group input[type="text"]:-moz-placeholder,
  727. #fh5co-footer .contact-form .form-group input[type="email"]:-moz-placeholder,
  728. #fh5co-footer .contact-form .form-group textarea:-moz-placeholder {
  729. /* Firefox 18- */
  730. color: rgba(255, 255, 255, 0.5);
  731. }
  732. #fh5co-footer .contact-form .form-group input[type="name"]::-moz-placeholder,
  733. #fh5co-footer .contact-form .form-group input[type="text"]::-moz-placeholder,
  734. #fh5co-footer .contact-form .form-group input[type="email"]::-moz-placeholder,
  735. #fh5co-footer .contact-form .form-group textarea::-moz-placeholder {
  736. /* Firefox 19+ */
  737. color: rgba(255, 255, 255, 0.5);
  738. }
  739. #fh5co-footer .contact-form .form-group input[type="name"]:-ms-input-placeholder,
  740. #fh5co-footer .contact-form .form-group input[type="text"]:-ms-input-placeholder,
  741. #fh5co-footer .contact-form .form-group input[type="email"]:-ms-input-placeholder,
  742. #fh5co-footer .contact-form .form-group textarea:-ms-input-placeholder {
  743. color: rgba(255, 255, 255, 0.5);
  744. }
  745. #fh5co-footer .contact-form .form-group input {
  746. color: #fff;
  747. background: transparent;
  748. border: none;
  749. background: rgba(255, 255, 255, 0.1);
  750. box-shadow: none;
  751. }
  752. #fh5co-footer .contact-form .form-group textarea {
  753. color: #fff;
  754. background: transparent;
  755. border: none;
  756. background: rgba(255, 255, 255, 0.1);
  757. box-shadow: none;
  758. }
  759. #fh5co-footer #btn-submit {
  760. color: rgba(255, 255, 255, 0.9) !important;
  761. background: #8C7676 !important;
  762. }
  763. .btn {
  764. -webkit-transition: 0.3s;
  765. -o-transition: 0.3s;
  766. transition: 0.3s;
  767. }
  768. .btn {
  769. text-transform: uppercase;
  770. letter-spacing: 2px;
  771. -webkit-transition: 0.3s;
  772. -o-transition: 0.3s;
  773. transition: 0.3s;
  774. }
  775. .btn.btn-primary {
  776. background: #8C7676;
  777. color: #fff;
  778. border: none !important;
  779. border: 2px solid transparent !important;
  780. }
  781. .btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus {
  782. box-shadow: none;
  783. background: #8C7676;
  784. }
  785. .btn:hover, .btn:active, .btn:focus {
  786. background: #393e46 !important;
  787. color: #fff;
  788. outline: none !important;
  789. }
  790. .btn.btn-default:hover, .btn.btn-default:focus, .btn.btn-default:active {
  791. border-color: transparent;
  792. }
  793. .social {
  794. padding: 0;
  795. margin: 0;
  796. display: inline-block;
  797. position: relative;
  798. width: 100%;
  799. }
  800. .social li {
  801. list-style: none;
  802. padding: 0;
  803. margin: 0;
  804. display: inline-block;
  805. }
  806. .social li a {
  807. font-size: 16px;
  808. display: table;
  809. width: 40px;
  810. height: 40px;
  811. margin: 0 4px;
  812. }
  813. .social li a i {
  814. display: table-cell;
  815. vertical-align: middle;
  816. }
  817. .social li a:hover, .social li a:active, .social li a:focus {
  818. text-decoration: none;
  819. border-bottom: none;
  820. }
  821. .social li a.social-box {
  822. background: #8C7676;
  823. color: #fff;
  824. }
  825. .social li a.social-circle {
  826. background: #8C7676;
  827. color: #fff;
  828. -webkit-border-radius: 50%;
  829. -moz-border-radius: 50%;
  830. -ms-border-radius: 50%;
  831. border-radius: 50%;
  832. }
  833. .social li a:hover {
  834. background: #393e46 !important;
  835. }
  836. .social.social-box a {
  837. background: #8C7676;
  838. color: #fff;
  839. }
  840. .social.social-circle a {
  841. background: #8C7676;
  842. color: #fff;
  843. -webkit-border-radius: 50%;
  844. -moz-border-radius: 50%;
  845. -ms-border-radius: 50%;
  846. border-radius: 50%;
  847. }
  848. .mfp-with-zoom .mfp-container,
  849. .mfp-with-zoom.mfp-bg {
  850. opacity: 0;
  851. -webkit-backface-visibility: hidden;
  852. /* ideally, transition speed should match zoom duration */
  853. -webkit-transition: all 0.3s ease-out;
  854. -moz-transition: all 0.3s ease-out;
  855. -o-transition: all 0.3s ease-out;
  856. transition: all 0.3s ease-out;
  857. }
  858. .mfp-with-zoom.mfp-ready .mfp-container {
  859. opacity: 1;
  860. }
  861. .mfp-with-zoom.mfp-ready.mfp-bg {
  862. opacity: 0.8;
  863. }
  864. .mfp-with-zoom.mfp-removing .mfp-container,
  865. .mfp-with-zoom.mfp-removing.mfp-bg {
  866. opacity: 0;
  867. }
  868. .js .to-animate,
  869. .js .to-animate-2,
  870. .js .to-animate-3,
  871. .js .single-animate {
  872. opacity: 0;
  873. }
  874. @media screen and (max-width: 480px) {
  875. .col-xxs-12 {
  876. float: none;
  877. width: 100%;
  878. }
  879. }
  880. .row-bottom-padded-lg {
  881. padding-bottom: 7em;
  882. }
  883. @media screen and (max-width: 768px) {
  884. .row-bottom-padded-lg {
  885. padding-bottom: 2em;
  886. }
  887. }
  888. .row-bottom-padded-md {
  889. padding-bottom: 4em;
  890. }
  891. @media screen and (max-width: 768px) {
  892. .row-bottom-padded-md {
  893. padding-bottom: 2em;
  894. }
  895. }
  896. .row-bottom-padded-sm {
  897. padding-bottom: 2em;
  898. }
  899. @media screen and (max-width: 768px) {
  900. .row-bottom-padded-sm {
  901. padding-bottom: 2em;
  902. }
  903. }
  904. .fh5co-animated {
  905. -webkit-animation-duration: .3s;
  906. animation-duration: .3s;
  907. -webkit-animation-fill-mode: both;
  908. animation-fill-mode: both;
  909. }
  910. /*# sourceMappingURL=style.css.map */
  911. a img{
  912. align-items: center;
  913. position: relative;
  914. width: 100%;
  915. padding: 70px;
  916. padding-left: 70px;
  917. margin-top: 20px;
  918. overflow: hidden;
  919. opacity: 0;
  920. animation-name: fadeIn;
  921. animation-delay: 0.6s;
  922. animation-duration: 0.8s;
  923. animation-fill-mode: forwards;
  924. text-decoration: none;
  925. color: white;
  926. }
  927. .article-content {
  928. margin-top: 10px;
  929. margin-bottom: 10px;
  930. padding: 5px;
  931. border: 1px solid #777;
  932. max-height: 200px;
  933. overflow: hidden;
  934. text-overflow: ellipsis;
  935. content: "";
  936. position: relative;
  937. }
  938. button.article-content {
  939. background: none;
  940. }
  941. .article-content:before {
  942. content: '';
  943. width: 100%;
  944. height: 100%;
  945. position: absolute;
  946. left: 0;
  947. top: 0;
  948. background: linear-gradient(transparent 150px, white);
  949. }
  950. .modal-content {
  951. background-color: rgb(75, 75, 75) !important;
  952. }
  953. .modal button.btn.btn-secondary {
  954. background-color: rgb(59, 59, 59) !important;
  955. }
  956. .modal button.close {
  957. color: rgb(255, 0, 0) !important;
  958. }
  959. .modal-body,
  960. button.article-content {
  961. white-space: pre-wrap
  962. }