Ingen beskrivning

style.css 20KB

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