No Description

style.css 20KB

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