Advertisement
Guest User

css

a guest
Dec 18th, 2017
95
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 40.37 KB | None | 0 0
  1. #home {
  2. /*background-image: url(../images/background-header.jpg);
  3. background-repeat: no-repeat;
  4. background-size: cover;
  5. background-position: center center;*/
  6. position: relative;
  7. height: 100vh;
  8. }
  9.  
  10. .menu-trigger.second{
  11. transition: all 0.5s 0s;
  12. .line{
  13. width: 100%;
  14. position: absolute;
  15. top: 0;
  16. left: 0;
  17. height: 2px;
  18. background: #fff;
  19. transition: 0.3s;
  20. &.line-1{
  21. transition: all 0.3s 0.3s, transform 0.3s 0s;
  22. }
  23. &.line-2{
  24. top: 50%;
  25. margin-top: -1px;
  26. left: 0;
  27. transition: all 0.3s 0.3s;
  28. }
  29. &.line-3{
  30. bottom: 0;
  31. top: auto;
  32. left: 0;
  33. transition: all 0.3s 0.3s, transform 0.3s 0s;
  34. }
  35. }
  36. &.active{
  37. transform: rotate(135deg);
  38. transition: all 0.5s 0.3s;
  39. .line{
  40. background: #000;
  41. }
  42. .line-1{
  43. top: 50%;
  44. margin-top: -1px;
  45. transform: rotate(90deg);
  46. transition: all 0.3s, transform 0.3s 0.3s;
  47. }
  48. .line-2{
  49. opacity: 0;
  50. transition: all 0.3s, opacity 0.3s 0s;
  51. }
  52. .line-3{
  53. bottom: 50%;
  54. margin-bottom: -1px;
  55. transform: rotate(0deg);
  56. transition: all 0.3s, transform 0.3s 0.3s;
  57. }
  58. }
  59. }
  60.  
  61. .menu-trigger {
  62. width: 25px;
  63. height: 20px;
  64. }
  65.  
  66. .menu-trigger .line {
  67. width: 100%;
  68. position: absolute;
  69. top: 0;
  70. left: 0;
  71. height: 2px;
  72. background: #fff
  73. }
  74.  
  75. .menu-trigger.first .line {
  76. width: 100%;
  77. position: absolute;
  78. top: 0;
  79. left: 0;
  80. height: 2px;
  81. background: #fff;
  82. transition: 0.3s
  83. }
  84.  
  85. .menu-trigger.first .line.line-1 {
  86. transition: all 0.3s 0.3s, transform 0.3s 0s
  87. }
  88.  
  89. .menu-trigger.first .line.line-2 {
  90. top: 50%;
  91. margin-top: -1px;
  92. left: 0;
  93. transition: all 0.3s 0.3s
  94. }
  95.  
  96. .menu-trigger.first .line.line-3 {
  97. bottom: 0;
  98. top: auto;
  99. left: 0;
  100. transition: all 0.3s 0.3s, transform 0.3s 0s
  101. }
  102.  
  103. .menu-trigger.first.active .line {
  104. background: #000
  105. }
  106.  
  107. .menu-trigger.first.active .line-1 {
  108. top: 50%;
  109. margin-top: -1px;
  110. transform: rotate(45deg);
  111. transition: all 0.3s, transform 0.3s 0.3s
  112. }
  113.  
  114. .menu-trigger.first.active .line-2 {
  115. opacity: 0;
  116. transition: all 0.3s, opacity 0.3s 0s
  117. }
  118.  
  119. .menu-trigger.first.active .line-3 {
  120. bottom: 50%;
  121. margin-bottom: -1px;
  122. transform: rotate(-45deg);
  123. transition: all 0.3s, transform 0.3s 0.3s
  124. }
  125.  
  126. .menu-trigger.second {
  127. position: relative;
  128. transition: all 0.5s 0s;
  129. margin: 0 auto;
  130. margin-top: 20px;
  131. }
  132.  
  133. .menu-trigger.second .line {
  134. width: 100%;
  135. position: absolute;
  136. top: 0;
  137. left: 0;
  138. height: 3px;
  139. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, #39DF7B), color-stop(0.5, #33D8CC), color-stop(1, #449DD3));
  140. background-image: gradient( linear, left top, right top, color-stop(0, #39DF7B), color-stop(0.5, #33D8CC), color-stop(1, #449DD3));
  141. transition: 0.3s
  142. }
  143.  
  144. .menu-trigger.second .line.line-1 {
  145. transition: all 0.3s 0.3s, transform 0.3s 0s
  146. }
  147.  
  148. .menu-trigger.second .line.line-2 {
  149. top: 50%;
  150. margin-top: -1px;
  151. left: 0;
  152. transition: all 0.3s 0.3s
  153. }
  154.  
  155. .menu-trigger.second .line.line-3 {
  156. bottom: 0;
  157. top: auto;
  158. left: 0;
  159. transition: all 0.3s 0.3s, transform 0.3s 0s
  160. }
  161.  
  162. .menu-trigger.second.active {
  163. transform: rotate(135deg);
  164. transition: all 0.5s 0.3s;
  165. }
  166.  
  167. .menu-trigger.second.active .line {
  168. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, #39DF7B), color-stop(0.5, #33D8CC), color-stop(1, #449DD3));
  169. background-image: gradient( linear, left top, right top, color-stop(0, #39DF7B), color-stop(0.5, #33D8CC), color-stop(1, #449DD3));
  170. }
  171.  
  172. .menu-trigger.second.active .line-1 {
  173. top: 50%;
  174. margin-top: -1px;
  175. transform: rotate(90deg);
  176. transition: all 0.3s, transform 0.3s 0.3s
  177. }
  178.  
  179. .menu-trigger.second.active .line-2 {
  180. opacity: 0;
  181. transition: all 0.3s, opacity 0.3s 0s
  182. }
  183.  
  184. .menu-trigger.second.active .line-3 {
  185. bottom: 50%;
  186. margin-bottom: -1px;
  187. transform: rotate(0deg);
  188. transition: all 0.3s, transform 0.3s 0.3s
  189. }
  190.  
  191. .telegram-chat {
  192. cursor: pointer;
  193. position: fixed;
  194. bottom: 2em;
  195. right: 2em;
  196. background: #fff;
  197. padding: 10px 12px 12px 8px;
  198. border-radius: 20px;
  199. box-shadow: 1px 1px 65px rgba(0,0,0, 0.2);
  200. z-index: 1000;
  201. }
  202.  
  203. .text-decentralize {
  204. animation-duration: 3s;
  205. display: inline-block;
  206. letter-spacing: 2px;
  207. font-size: 2.0em !important;
  208. font-family: Brandon_bld;
  209. margin-top: -20px;
  210. color: #282a8f !important;
  211. }
  212.  
  213. .whitepaper-main-section {
  214. padding: 14em 0;
  215. }
  216.  
  217. .pulse-button {
  218. cursor: pointer;
  219. position: fixed;
  220. top: -90px;
  221. width: 214px;
  222. height: 149px;
  223. background: #fff;
  224. right: 0;
  225. left: 0;
  226. margin-right: auto;
  227. margin-left: auto;
  228. z-index: 9999;
  229. border-radius: 50%;
  230. box-shadow: 0px 0px 65px rgba(0, 0, 0, 0.2);
  231. }
  232.  
  233. .pulse-active {
  234. top: -125px;
  235. -webkit-perspective: 1000;
  236. -webkit-backface-visibility: hidden;
  237. -webkit-animation: pulse 2.5s infinite;
  238. transition: 1s;
  239. }
  240. .pulse-active:hover {
  241. top: -90px;
  242. transition: 1s;
  243. }
  244.  
  245. .text-pulse-button {
  246. position:absolute;
  247. bottom: 5px;
  248. display: inline-block;
  249. right: 0;
  250. left: 0px;
  251. margin-right: auto;
  252. margin-left: auto;
  253.  
  254. }
  255.  
  256. .pulse-button:hover {
  257. -webkit-animation: none;
  258. }
  259.  
  260. @-webkit-keyframes pulse {
  261. 0% {
  262. -webkit-transform: scale(0.9);
  263. -ms-transform: scale(0.9);
  264. transform: scale(0.9);
  265. }
  266. 70% {
  267. -webkit-transform: scale(1);
  268. -ms-transform: scale(1);
  269. transform: scale(1);
  270. box-shadow: 1px 1px 65px rgba(0,0,0, 0.2);
  271. }
  272. 100% {
  273. -webkit-transform: scale(0.9);
  274. -ms-transform: scale(0.9);
  275. transform: scale(0.9);
  276. box-shadow: 1px 1px 65px rgba(0,0,0, 0.2);
  277. }
  278. }
  279.  
  280. .gradient-color {
  281. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  282. background-image: gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  283. color: transparent !important;
  284. -webkit-background-clip: text;
  285. background-clip: text;
  286. text-decoration: none;
  287. }
  288.  
  289. .gradient-color-green {
  290. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgb(125,250,187)), color-stop(1, rgb(73,218,244)));
  291. background-image: gradient( linear, left top, right top, color-stop(0, rgb(125,250,187)), color-stop(1, rgb(73,218,244)));
  292. color: transparent !important;
  293. -webkit-background-clip: text;
  294. background-clip: text;
  295. text-decoration: none;
  296. }
  297.  
  298. .app-landing-title {
  299. letter-spacing: 5px;
  300. font-size: 2.0em;
  301. font-family: Brandon_bld;
  302. }
  303.  
  304. .slick-dotted.slick-slider {
  305. margin-bottom: 0px;
  306. }
  307.  
  308. .app-landing-subtitle {
  309. color: rgb(40, 42, 143);
  310. font-size: 1.3em;
  311. margin-top: 25px;
  312. font-family: Brandon_reg;
  313. line-height: 1.4;
  314. }
  315.  
  316. .presale-container {
  317. margin-top: 2em;
  318. }
  319.  
  320. .presale-description {
  321. font-family: Brandon_light;
  322.  
  323. }
  324.  
  325. .btn-gradient-large a {
  326. font-size: 1.1em;
  327. letter-spacing: 2px;
  328. font-family: Brandon_bld;
  329. }
  330.  
  331. .btn-gradient-large .btn-gradient-container {
  332. padding: 6px 20px;
  333. }
  334.  
  335. .btn-gradient-large {
  336. display: inline-block;
  337. width: auto !important;
  338. }
  339.  
  340. .whitepaper-download {
  341. border: 2px solid #32dccc;
  342. border-radius: 30px;
  343. background: none;
  344. color: #32dccc;
  345. padding: 10px 40px;
  346. font-family: Brandon_bld;
  347. font-size: 0.9em;
  348. letter-spacing:2px;
  349. }
  350.  
  351. .whitepaper-download:hover {
  352. color: #282a8f;
  353. background: #32dccc;
  354. }
  355.  
  356. .border-gradient-light {
  357. background: none !important;
  358. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgba(255, 230, 250, 1)), color-stop(1, rgba(227,252,245, 1))) !important;
  359. background-image: gradient( linear, left top, right top, color-stop(0, rgba(255, 230, 250, 1)), color-stop(1, rgba(227,252,245, 1))) !important;
  360. }
  361.  
  362. .border-gradient-green {
  363. background: none !important;
  364. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgb(125,250,187)), color-stop(1, rgb(73,218,244))) !important;
  365. background-image: gradient( linear, left top, right top, color-stop(0, rgb(125,250,187)), color-stop(1, rgb(73,218,244))) !important;
  366. }
  367.  
  368. .slick-list {
  369. margin: 0;
  370. }
  371.  
  372. .slick-dots {
  373. display: none !important;
  374. }
  375.  
  376. .comment-wrap {
  377. padding: 1px;
  378. width: 650px !important;
  379. max-width: 95vw;
  380. }
  381.  
  382. .line-grey {
  383. height: 3px;
  384. background: rgb(220,220,220);
  385. }
  386.  
  387. .line-color {
  388. height: 3px;
  389. background: #32dccc;
  390. width:0%;
  391. position:absolute;
  392. top: 0;
  393. }
  394.  
  395. .first-number-line-container {
  396. position:absolute;
  397. cursor: pointer;
  398. top: -4px;
  399. left: 2%;
  400. }
  401.  
  402. .second-number-line-container {
  403. position:absolute;
  404. cursor: pointer;
  405. top: -6px;
  406. left: 30%;
  407. }
  408.  
  409. .third-number-line-container {
  410. position:absolute;
  411. cursor: pointer;
  412. top: -9px;
  413. left:60%;
  414. }
  415.  
  416. .four-number-line-container {
  417. position:absolute;
  418. cursor: pointer;
  419. top: -11px;
  420. left:95%;
  421. }
  422.  
  423. .first-circle-line {
  424. width:10px;
  425. height:10px;
  426. border-radius: 50%;
  427. background: #32dccc;
  428. }
  429.  
  430. .second-circle-line {
  431. width:14px;
  432. height:14px;
  433. border-radius: 50%;
  434. background: rgb(220,220,220);
  435. }
  436.  
  437. .third-circle-line {
  438. width:18px;
  439. height:18px;
  440. border-radius: 50%;
  441. background: rgb(220,220,220);
  442. }
  443.  
  444. .four-circle-line {
  445. width:22px;
  446. height:22px;
  447. border-radius: 50%;
  448. background: rgb(220,220,220);
  449. }
  450.  
  451. .text-line {
  452. color: rgb(220,220,220);
  453. margin-top: 1em;
  454. margin-bottom: 0px;
  455. font-size: 1.25em;
  456. font-family: Brandon_bld;
  457. }
  458.  
  459. .text-line-color {
  460. color: #32dccc;
  461. }
  462.  
  463. p {
  464. font-family: Brandon_reg;
  465. color: rgb(109,109,102);
  466. line-height: 1.4;
  467. font-size: 1.2em;
  468. }
  469.  
  470. h2 {
  471. font-size: 2.0em !important;
  472. font-family: Brandon_bld;
  473. color: #32dccc !important;
  474. letter-spacing: 5px;
  475. margin-bottom: 0px;
  476. }
  477.  
  478. h3 {
  479. color: rgb(40, 42, 143) !important;
  480. font-size: 1.5em !important;
  481. letter-spacing: 4px;
  482. font-weight: bold;
  483. font-family: Brandon_bld;
  484. }
  485.  
  486. .logo-container .img-fluid {
  487. height: 8vh !important;
  488. }
  489.  
  490. .slider-title {
  491. /*font-size: 0.9vw;*/
  492. margin-left: -40px;
  493. }
  494.  
  495. .fullscreen-bg {
  496. position: absolute;
  497. top: 0;
  498. right: 0;
  499. bottom: 0;
  500. left: 0;
  501. overflow: hidden;
  502. z-index: -100;
  503. }
  504.  
  505. .fullscreen-bg__video {
  506. position: absolute;
  507. top: 0;
  508. left: 0;
  509. width: 100%;
  510. height: 100%;
  511. }
  512.  
  513. @media (min-aspect-ratio: 19/9) {
  514. .fullscreen-bg__video {
  515. height: 300%;
  516. top: -100%;
  517. }
  518. }
  519.  
  520. @media (max-aspect-ratio: 19/9) {
  521. .fullscreen-bg__video {
  522. width: 300%;
  523. left: -100%;
  524. }
  525. }
  526.  
  527. @media (max-width: 767px) {
  528. .fullscreen-bg {
  529. background: url('../images/mobile-header-bg.jpg') center center / cover no-repeat;
  530. }
  531.  
  532. .fullscreen-bg__video {
  533. display: none;
  534. }
  535. }
  536.  
  537. #white-paper {
  538. background-image: url(../images/nuvoledex.png), url(../images/nuvolesx.png), -webkit-gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  539. background-image: url(../images/nuvoledex.png), url(../images/nuvolesx.png), gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  540. background-repeat: no-repeat;
  541. background-position: right center, left center, center;
  542. height: 65vh;
  543. }
  544.  
  545. .owl-carousel .owl-item img {
  546. box-shadow: 0px 0px 35px rgba(0,0,0,0.2);
  547. }
  548.  
  549. .screen-set {
  550. width: 200px;
  551. height: auto;
  552. margin: 20px 0 0;
  553. }
  554.  
  555. .phone-wrap-fix {
  556. max-width: 100%;
  557. }
  558.  
  559. .dark-theme .nav-menu {
  560. background: none !important;
  561. border: none !important;
  562. }
  563.  
  564. .container {
  565. width: 100% !important;
  566. max-width: 98% !important;
  567. }
  568.  
  569. .navbar {
  570. padding: 0px !important;
  571. }
  572.  
  573. .dark-theme .navbar-light .navbar-nav .nav-link {
  574. color: #fff!important;
  575. font-family: Raleway-Bold;
  576. letter-spacing: 1px;
  577. }
  578.  
  579. .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.open, .navbar-light .navbar-nav .open > .nav-link,
  580. .modal-menu h2:hover, .modal-menu h1:hover , .navbar-light .navbar-nav .nav-link:hover{
  581. /*
  582. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, #39DF7B), color-stop(0.5, #33D8CC), color-stop(1, #449DD3));
  583. background-image: gradient( linear, left top, right top, color-stop(0, #39DF7B), color-stop(0.5, #33D8CC), color-stop(1, #449DD3));
  584. color: transparent !important;
  585. -webkit-background-clip: text;
  586. background-clip: text;*/
  587. border: none !important;
  588. color: #39DF7B !important;
  589. }
  590.  
  591. .navbar {
  592. font-size: 0.8vw;
  593. margin-top: 1.5vh;
  594. }
  595.  
  596. .nav-primary .nav-item:first-child {
  597. padding: 0 0 0 2em !important;
  598. }
  599.  
  600. .nav-secondary .nav-item, .nav-primary .nav-item{
  601. padding: 0 0 0 5em !important;
  602. }
  603.  
  604. .countdown {
  605. max-width: 100%;
  606. }
  607.  
  608. .navbar-expand-lg .navbar-nav {
  609. float: right !important;
  610. }
  611.  
  612. .dark-theme .navbar-light .nav-secondary .nav-link {
  613. color: #fff;
  614. font-family: Raleway-Regular !important;
  615. }
  616.  
  617. .btn-menu {
  618. margin-right: 1em;
  619. margin-top: 1em;
  620. font-size: 2em;
  621. background: none;
  622. color: #000;
  623. }
  624.  
  625. .btn-menu.focus, .btn-menu:focus {
  626. box-shadow: none;
  627. }
  628.  
  629. .nav-menu.sticky-top {
  630. background: none !important;
  631. z-index: 9999;
  632. }
  633.  
  634. .btn-header {
  635. border-radius: 30px;
  636. position: relative;
  637. overflow: hidden;
  638. padding: 3px 0;
  639. }
  640.  
  641. .btn-header:after {
  642. content: "";
  643. position: absolute;
  644. width: calc(100% - 4px);
  645. height: calc(100% - 4px);
  646. top: 0px;
  647. right: 0px;
  648. bottom: 0px;
  649. left: 0px;
  650. margin: auto;
  651. border-radius: inherit;
  652. box-shadow: -180px 0px 1px 10px rgb(40,42,206),
  653. -140px 0px 0px 10px rgb(65,51,205),
  654. -100px 0px 1px 10px rgb(116,69,203),
  655. -60px 0px 1px 10px rgb(158,84,201),
  656. 20px 0px 1px 10px rgba(213,68,194,1);
  657.  
  658. }
  659.  
  660. .btn-header p {
  661. line-height: 40px;
  662. }
  663.  
  664. .btn-header:hover {
  665. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  666. background-image: gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  667. }
  668.  
  669. .btn-header:hover p {
  670. color: #fff !important;
  671. }
  672.  
  673. .container-social-link {
  674. width: 40px;
  675. height: 40px;
  676. margin: 0 auto;
  677. border-radius: 50%;
  678. border: 2px solid rgb(40, 42, 143);
  679. }
  680.  
  681. .container-social-link i {
  682. color: rgb(40, 42, 143);
  683. line-height: 36px;
  684. }
  685.  
  686. .container-social-link:hover {
  687. background: rgb(40, 42, 143);
  688. border: none;
  689. }
  690.  
  691. .container-social-link:hover i {
  692. color: #fff;
  693. line-height: 40px;
  694. }
  695.  
  696. .btn-header:hover:after {
  697. box-shadow: none;
  698. }
  699.  
  700. .title-header {
  701. margin-bottom: 0px !important;
  702. }
  703.  
  704. .app-landing {
  705. background: #fff !important;
  706. }
  707.  
  708. .sticky-top .container{
  709. display: none;
  710. }
  711.  
  712. .container-mobile {
  713. display: none;
  714. }
  715.  
  716. .sticky-top .container-mobile {
  717. display: block;
  718. position: fixed;
  719. cursor: pointer;
  720. top: 30px;
  721. right: 30px;
  722. border-radius: 50%;
  723. width: 60px;
  724. height: 60px;
  725. background: #fff;
  726. box-shadow: 1px 1px 65px rgba(0,0,0, 0.2);
  727. }
  728.  
  729. .sticky-top .container-mobile.active {
  730. right: 47px;
  731. }
  732.  
  733. #name_user_gallery {
  734. color: #32dccc;
  735. font-size: 2em;
  736. font-family: KGManhattan;
  737. text-align: center;
  738. margin-bottom: 0px;
  739. letter-spacing: 2px;
  740. }
  741.  
  742. .cd-fixed-background .cd-content::after {
  743. content: '';
  744. display: block;
  745. width: 100%;
  746. padding: 60% 0;
  747. margin: 2em auto 0;
  748. }
  749.  
  750. .cd-fixed-background {
  751. height: 100vh;
  752. background-repeat: no-repeat;
  753. background-size: auto;
  754. background-position: center center;
  755. background-attachment: fixed;
  756. }
  757.  
  758. .cd-fixed-background.img-1 {
  759. background-image: url("../images/iphone_1.png");
  760. }
  761.  
  762. .cd-fixed-background.img-2 {
  763. background-image: url("../images/iphone_2.png");
  764. }
  765.  
  766. .cd-fixed-background.img-3 {
  767. background-image: url("../images/iphone_3.png");
  768. }
  769.  
  770. .cd-fixed-background.img-4 {
  771. background-image: url("../images/iphone_4.png");
  772. }
  773.  
  774. .cd-fixed-background.img-5 {
  775. background-image: url("../images/iphone_5.png");
  776. }
  777.  
  778. .modal-menu h2 {
  779. font-family: Brandon_med;
  780. font-size: 1.2em !important;
  781. letter-spacing: 4px;
  782. color: #808080 !important;
  783. text-align: center;
  784. display: inline-block;
  785. cursor: pointer;
  786. }
  787.  
  788. .modal-menu h1 {
  789. font-family: Brandon_bld;
  790. font-size: 2.2em;
  791. letter-spacing: 4px;
  792. color: #333;
  793. text-align: center;
  794. display: inline-block;
  795. cursor: pointer;
  796. }
  797.  
  798. .secondary-menu-modal {
  799. height: 10vh;
  800. }
  801.  
  802. .secondary-menu-modal > div {
  803. padding-top: 7em;
  804. }
  805.  
  806. .main-menu-modal {
  807. height: 90vh;
  808. display: -ms-flexbox;
  809. display: -webkit-flex;
  810. display: flex;
  811. -ms-flex-align: center;
  812. -webkit-align-items: center;
  813. -webkit-box-align: center;
  814. align-items: center;
  815. }
  816.  
  817. .main-menu-modal-content {
  818. margin: 0 auto;
  819. }
  820.  
  821. .main-menu-modal-content div:not(:first-child) {
  822. margin-top: 4em;
  823. }
  824.  
  825. @import url(https://fonts.googleapis.com/css?family=Righteous|Sigmar+One);
  826.  
  827. $color_coin: #FEF236;
  828. $color_outline: rgb(208, 111, 185);
  829. $time: 3s;
  830.  
  831. body {
  832. background-color: #353535;
  833. position: absolute;
  834. top: 0;
  835. bottom: 0;
  836. left: 0;
  837. right: 0;
  838. }
  839.  
  840. h1 {
  841. font-family: 'Righteous';
  842. color: white;
  843. position: relative;
  844. top: 10px;
  845. }
  846.  
  847. .container_coin {
  848. height: 216px;
  849. width: 216px;
  850. margin: 0 auto;
  851. }
  852.  
  853. .coin {
  854. height: 216px;
  855. width: 216px;
  856. -webkit-transform-style: preserve-3d;
  857. -webkit-transform-origin: 50%;
  858. -webkit-transition: all 1.5s cubic-bezier(0.25, 0.1, 0.25, 1);
  859. -webkit-transform: rotateY(0deg);
  860.  
  861. }
  862.  
  863. .container_coin:hover .coin {
  864. //-webkit-animation: spin $time;
  865. //-webkit-animation-timing-function: linear;
  866. //transition-timing-function: ease-out;
  867. -webkit-transform: rotateY(540deg);
  868. }
  869.  
  870. .coin .front,
  871. .coin .back {
  872. position: absolute;
  873. height: 216px;
  874. width: 216px;
  875. border-radius: 50%;
  876. background-size: cover;
  877. text-align: center;
  878. }
  879.  
  880. .container-coins img, .subsection-team img {
  881. max-width: 100%;
  882. }
  883.  
  884. .container_coin img {
  885. height: 100%;
  886. }
  887.  
  888. .coin .front {
  889. -webkit-transform: translateZ(8px);
  890. }
  891.  
  892. .coin .back {
  893. -webkit-transform: translateZ(-8px) rotateY(180deg);
  894. }
  895.  
  896. .coin .side {
  897. -webkit-transform: translateX(100px);
  898. -webkit-transform-style: preserve-3d;
  899. -webkit-backface-visibility: hidden;
  900. }
  901.  
  902. .coin .side .circle {
  903. height: 216px;
  904. width: 16px;
  905. position: absolute;
  906. -webkit-transform-style: preserve-3d;
  907. -webkit-backface-visibility: hidden;
  908. }
  909.  
  910. .coin .side .circle:before,
  911. .coin .side .circle:after {
  912. content: '';
  913. display: block;
  914. height: 23.682742452729697px;
  915. width: 16px;
  916. position: absolute;
  917. -webkit-transform: rotateX(84.375deg);
  918. background: rgb(208, 111, 185);;
  919. }
  920.  
  921. .coin .side .circle:before {
  922. -webkit-transform-origin: top center;
  923. }
  924. .coin .side .circle:after {
  925. bottom: 0;
  926. -webkit-transform-origin: center bottom;
  927. }
  928. .coin .side .circle:nth-child(16) {
  929. -webkit-transform: rotateY(90deg) rotateX(180deg);
  930. }
  931. .coin .side .circle:nth-child(15) {
  932. -webkit-transform: rotateY(90deg) rotateX(168.75deg);
  933. }
  934. .coin .side .circle:nth-child(14) {
  935. -webkit-transform: rotateY(90deg) rotateX(157.5deg);
  936. }
  937. .coin .side .circle:nth-child(13) {
  938. -webkit-transform: rotateY(90deg) rotateX(146.25deg);
  939. }
  940. .coin .side .circle:nth-child(12) {
  941. -webkit-transform: rotateY(90deg) rotateX(135deg);
  942. }
  943. .coin .side .circle:nth-child(11) {
  944. -webkit-transform: rotateY(90deg) rotateX(123.75deg);
  945. }
  946. .coin .side .circle:nth-child(10) {
  947. -webkit-transform: rotateY(90deg) rotateX(112.5deg);
  948. }
  949. .coin .side .circle:nth-child(9) {
  950. -webkit-transform: rotateY(90deg) rotateX(101.25deg);
  951. }
  952. .coin .side .circle:nth-child(8) {
  953. -webkit-transform: rotateY(90deg) rotateX(90deg);
  954. }
  955. .coin .side .circle:nth-child(7) {
  956. -webkit-transform: rotateY(90deg) rotateX(78.75deg);
  957. }
  958. .coin .side .circle:nth-child(6) {
  959. -webkit-transform: rotateY(90deg) rotateX(67.5deg);
  960. }
  961. .coin .side .circle:nth-child(5) {
  962. -webkit-transform: rotateY(90deg) rotateX(56.25deg);
  963. }
  964. .coin .side .circle:nth-child(4) {
  965. -webkit-transform: rotateY(90deg) rotateX(45deg);
  966. }
  967. .coin .side .circle:nth-child(3) {
  968. -webkit-transform: rotateY(90deg) rotateX(33.75deg);
  969. }
  970. .coin .side .circle:nth-child(2) {
  971. -webkit-transform: rotateY(90deg) rotateX(22.5deg);
  972. }
  973. .coin .side .circle:nth-child(1) {
  974. -webkit-transform: rotateY(90deg) rotateX(11.25deg);
  975. }
  976.  
  977. .btn-gradient-main {
  978. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  979. background-image: gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  980. width: 145px;
  981. padding:3px;
  982. }
  983.  
  984. .btn-gradient-container {
  985. background: #fff;
  986. padding: 10px;
  987. font-family: Raleway-Bold;
  988. }
  989.  
  990. .btn-gradient-container a {
  991. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  992. background-image: gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  993. color: transparent !important;
  994. -webkit-background-clip: text;
  995. background-clip: text;
  996. text-decoration: none;
  997. }
  998.  
  999. .btn-gradient-main:hover .btn-gradient-container {
  1000. background: none;
  1001. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  1002. background-image: gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  1003. }
  1004.  
  1005. .btn-gradient-main:hover .btn-gradient-container a {
  1006. background-image: none !important;
  1007. color: #fff !important;
  1008. }
  1009.  
  1010. .text-white-paper, .text-white-paper:hover {
  1011. color: #282A8F;
  1012. font-family: Brandon_bld;
  1013. font-size: 1.2em;
  1014. padding: 10px 55px;
  1015. letter-spacing: 2px;
  1016. background: #e9f8fa;
  1017. border-radius: 30px;
  1018. background: -webkit-gradient(linear, left top, right top, from(rgba(125,250,187, 0.7)), to(rgba(73,218,244, 0.3)));background: -webkit-linear-gradient(left, rgba(125,250,187, 0.7) 0%, rgba(73,218,244, 0.3) 100%);
  1019. background: -o-linear-gradient(left, rgba(125,250,187, 0.7) 0%, rgba(73,218,244, 0.3) 100%);
  1020. background: linear-gradient(to right, rgba(125,250,187, 0.7) 0%, rgba(73,218,244, 0.3) 100%);
  1021. }
  1022.  
  1023. @-webkit-keyframes spin {
  1024. //from {
  1025. // -webkit-transform: rotateY(0deg);
  1026. //}
  1027. //to {
  1028. -webkit-transform: rotateY(1960deg);
  1029. //}
  1030. }
  1031.  
  1032. .container-vision {
  1033. margin-top: 3em !important;
  1034. }
  1035.  
  1036. .main-container-centered {
  1037. width: 1200px !important;
  1038. margin: 0 auto;
  1039. }
  1040.  
  1041. .row {
  1042. width: 100%;
  1043. margin: 0;
  1044. }
  1045.  
  1046. .container {
  1047. margin: 0 auto;
  1048. }
  1049.  
  1050. .text-vision {
  1051. animation-duration: 1.0s;
  1052. color: #6d6d6d;
  1053. letter-spacing: 2px;
  1054. font-family: Brandon_light;
  1055. text-align: left;
  1056. line-height: 1.6;
  1057. }
  1058.  
  1059. .container-video {
  1060. height: 100vh;
  1061. display: -ms-flexbox;
  1062. display: -webkit-flex;
  1063. display: flex;
  1064. -ms-flex-align: center;
  1065. -webkit-align-items: center;
  1066. -webkit-box-align: center;
  1067. align-items: center;
  1068. margin-top: 4em;
  1069. }
  1070.  
  1071. .container-token-clients {
  1072. margin-top: 10em;
  1073. }
  1074.  
  1075. .element-list-token-users {
  1076. margin-top: 1.8em;
  1077. margin-left:0px;
  1078. }
  1079.  
  1080. .element-list-token-users img {
  1081. width: 55px;
  1082. height: 55px;
  1083. }
  1084.  
  1085. .container-text-element-list-token {
  1086. margin: 0px 0 8px 5%;
  1087. text-align: left;
  1088. }
  1089.  
  1090. .container-text-element-list-token h3 {
  1091. margin-bottom:2px !important;
  1092. font-size: 1.2em !important;
  1093. letter-spacing: 4px;
  1094. font-family: Brandon_bld;
  1095. }
  1096.  
  1097. .container-text-element-list-token p {
  1098. font-size: 1.4em !important;
  1099. }
  1100.  
  1101. .main-section-title {
  1102. letter-spacing: 8px;
  1103. font-family: Brandon_reg;
  1104. font-size: 5.5em !important;
  1105. margin-bottom: 36px;
  1106. }
  1107.  
  1108. .text-color {
  1109. color: #269e8d;
  1110. border: none !important;
  1111. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, #56e8a7), color-stop(0.5, #33d8cc), color-stop(1, #56c0e3));
  1112. background-image: gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  1113. color: transparent !important;
  1114. -webkit-background-clip: text;
  1115. background-clip: text;
  1116. }
  1117.  
  1118. .main-section-subtitle {
  1119. color: rgb(160, 160, 160);
  1120. max-width: 70%;
  1121. margin: 0 auto;
  1122. }
  1123.  
  1124. .container-avatar-gallery {
  1125. position: absolute;
  1126. top: 0px;
  1127. width: 50px;
  1128. margin: auto;
  1129. left: 0;
  1130. right: 243px;
  1131. border-radius: 50%;
  1132. box-shadow: 0px 0px 20px #252525;
  1133. }
  1134.  
  1135. .container-name-gallery {
  1136. position: absolute;
  1137. bottom: 0px;
  1138. width: 245px;
  1139. right: 0;
  1140. left: 0;
  1141. margin: auto;
  1142. }
  1143.  
  1144. .counter {
  1145. font-family: Brandon_bld;
  1146. display: inline-block;;
  1147. font-size: 2.7em;
  1148. margin-top: 10px;
  1149. letter-spacing: 2px;
  1150. margin-bottom: 5px;
  1151. }
  1152.  
  1153. .counter-name {
  1154. font-family: Brandon_reg;
  1155. letter-spacing: 2px;
  1156. font-size: 1em;
  1157. }
  1158.  
  1159. .container-clients {
  1160. margin:4em 0 2em 0;
  1161. background-image: url(../images/loghi_clienti.png);
  1162. background-repeat: no-repeat;
  1163. background-size: cover;
  1164. }
  1165.  
  1166. .counter-num-clients {
  1167. font-size: 2.0em;
  1168. margin-top: 20px;
  1169. }
  1170.  
  1171. .container-clients-mobile {
  1172. display: none;
  1173. }
  1174.  
  1175. .container-numbers {
  1176. margin: 7em 0 8em 0;
  1177. }
  1178.  
  1179. .main-container-coin {
  1180. margin-top: 2em;
  1181. width: 25%;
  1182. float: left;
  1183. }
  1184.  
  1185. .main-container-coin {
  1186. display: block;
  1187. }
  1188.  
  1189. .main-container-coin-mobile {
  1190. display: none;
  1191. }
  1192.  
  1193. .ico-team-name {
  1194. font-family: Brandon_bld !important;
  1195. letter-spacing: 2px;
  1196. font-size: 1.2em;
  1197. margin: 15px 0 5px 0;
  1198. text-transform: uppercase;
  1199. color: rgb(40, 42, 143);
  1200. }
  1201.  
  1202. .ico-team-role {
  1203. font-family: Brandon_med !important;
  1204. font-size: 0.8em;
  1205. color: rgb(40, 42, 143);
  1206. letter-spacing: 1px;
  1207. text-transform: uppercase;
  1208. }
  1209.  
  1210. .container-single-team-description {
  1211. display : flex;
  1212. align-items : center;
  1213. justify-content: center;
  1214. }
  1215.  
  1216. .container-single-team-description p {
  1217. margin: 0;
  1218. padding-right: 10px;
  1219. }
  1220.  
  1221. .btn-presale {
  1222. margin-top: -1em;
  1223. }
  1224.  
  1225. .main-container-countdown {
  1226. position: relative;
  1227. }
  1228.  
  1229. .container-line-eth {
  1230. width: 900px;
  1231. max-width: 90%;
  1232. margin: 0 auto;
  1233. }
  1234.  
  1235. .main-container-astronauta {
  1236. margin-top:6em !important;
  1237. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgba(40, 42, 143, 0.25)), color-stop(1, rgba(193,97,200, 0.25)));
  1238. background-image: gradient( linear, left top, right top, color-stop(0, rgba(40, 42, 143, 0.25)), color-stop(1, rgba(193,97,200, 0.25)));
  1239. height:30px;
  1240. border-radius: 30px;
  1241. position: relative;
  1242. }
  1243.  
  1244. .bonus-dot {
  1245. position:absolute;
  1246. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgba(125,250,187, 1)), color-stop(1, rgba(73,218,244, 1)));
  1247. background-image: gradient( linear, left top, right top, color-stop(0, rgba(125,250,187, 1)), color-stop(1, rgba(73,218,244, 1)));
  1248. border-radius:50%;
  1249. }
  1250.  
  1251. .bonus-name {
  1252. font-family: Brandon_med;
  1253. font-size: 1.9em;
  1254. color: #32dccc;
  1255. margin-bottom: 5px;
  1256. }
  1257.  
  1258. .bonus-percentage {
  1259. font-family: Brandon_blk;
  1260. font-size: 1.5em;
  1261. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgb(196,98,200)));
  1262. background-image: gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgb(196,98,200)));
  1263. color: transparent !important;
  1264. -webkit-background-clip: text;
  1265. background-clip: text;
  1266. text-decoration: none;
  1267. display: inline-block;
  1268. }
  1269.  
  1270. .center-absolute {
  1271. left: 0;
  1272. right: 0;
  1273. margin: auto;
  1274. }
  1275.  
  1276. .container-bonus-scale {
  1277. height: 400px;
  1278. position:relative;
  1279. margin: 0 0 16em 0;
  1280. }
  1281.  
  1282. .main-container-whitepaper-book {
  1283. margin-top: 35vh;
  1284. height: 550px;
  1285. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgb(127,55,221)), color-stop(0.25, rgb(73,57,255)), color-stop(0.5, rgb(59,51,208)), color-stop(0.75, rgb(40,42,143)));
  1286. background-image: gradient( linear, left top, right top, color-stop(0, rgb(127,55,221)), color-stop(0.25, rgb(73,57,255)), color-stop(0.5, rgb(59,51,208)), color-stop(0.75, rgb(40,42,143)));
  1287. }
  1288.  
  1289. .container-whitepaper-book {
  1290. margin:0 auto;
  1291. display: -ms-flexbox;
  1292. display: -webkit-flex;
  1293. display: flex;
  1294. -ms-flex-align: center;
  1295. -webkit-align-items: center;
  1296. -webkit-box-align: center;
  1297. align-items: center;
  1298. height: 550px;
  1299. }
  1300.  
  1301. .image-whitepaper {
  1302. margin-top: -329px;
  1303. box-shadow: 1px 1px 10px rgba(0,0,0,0.5);
  1304. }
  1305.  
  1306. .container-block-vision {
  1307. background:#fff;
  1308. margin: 3px;
  1309. padding: 70px 10px;
  1310. height:350px;
  1311. }
  1312.  
  1313. .container-business-model-block {
  1314. display: -ms-flexbox;
  1315. display: -webkit-flex;
  1316. display: flex;
  1317. -ms-flex-align: center;
  1318. -webkit-align-items: center;
  1319. -webkit-box-align: center;
  1320. align-items: center;
  1321. }
  1322.  
  1323. .bm-video-margin {
  1324. margin-left: -40px;
  1325. }
  1326.  
  1327. .title-bm-block {
  1328. font-family: Brandon_med;
  1329. font-size: 1.3em;
  1330. color: #32dccc;
  1331. margin-top: 1em;
  1332. margin-bottom: 25px;
  1333. letter-spacing:2px;
  1334. }
  1335.  
  1336. .subtitle-bm-block {
  1337. font-family: Brandon_light;
  1338. +font-size: 17px;
  1339. color: #6d6d6d;
  1340. margin-bottom: 0.2em;
  1341. text-align: justify;
  1342. text-align-last: left;
  1343. }
  1344.  
  1345. .friendz-app {
  1346. margin-top:10em;
  1347. }
  1348.  
  1349. .single-friendz-team {
  1350. margin-top: 2em;
  1351. }
  1352.  
  1353. .container-btn-header-internal, .container-social-ico, .container-btn-footer-internal {
  1354. max-width: 520px !important;
  1355. margin: 0 auto;
  1356. }
  1357.  
  1358. .container-box-loghi {
  1359. padding: 155px 0;
  1360. width: 76%;
  1361. margin: 0 auto;
  1362. }
  1363.  
  1364. .container-iphone-block {
  1365. height:100vh;
  1366. display: -ms-flexbox;
  1367. display: -webkit-flex;
  1368. display: flex;
  1369. -ms-flex-align: center;
  1370. -webkit-align-items: center;
  1371. -webkit-box-align: center;
  1372. align-items: center;
  1373. background-image: url(../images/background_block_2.png);
  1374. background-repeat: no-repeat;
  1375. background-position: center center;
  1376. background-size: 100%;
  1377. }
  1378.  
  1379. .footer {
  1380. background-image: url(../images/footer.png);
  1381. background-repeat: no-repeat;
  1382. background-size:contain;
  1383. background-position: center bottom;
  1384. padding-top: 16em;
  1385. }
  1386.  
  1387. .footer-container {
  1388. padding-bottom: 3em;
  1389. }
  1390.  
  1391. .footer-last {
  1392. background: #f2f2f2;
  1393. padding: 1em 0;
  1394. text-align: center;
  1395. }
  1396.  
  1397. .footer-last p {
  1398. margin: 0;
  1399. font-family: Raleway-Regular;
  1400. color: #5b5b5b;
  1401. font-size: 0.8em;
  1402. letter-spacing: 1px;
  1403. }
  1404.  
  1405. .subsection-team {
  1406. margin-top: 10em;
  1407. }
  1408.  
  1409. .subsection-team h2 {
  1410. font-size: 1.5em !important;
  1411. }
  1412.  
  1413. #team {
  1414. margin-top: 10em;
  1415. }
  1416.  
  1417. .subtitle-vision {
  1418. font-family: Brandon_med;
  1419. font-size: 1.3em;
  1420. color: #32dccc;
  1421. margin-top: 1em;
  1422. margin-bottom: 25px;
  1423. letter-spacing:2px;
  1424. }
  1425.  
  1426. .desc-sub-vision {
  1427. font-family: Brandon_light;
  1428. font-size: 18px;
  1429. color: #6d6d6d;
  1430. margin-bottom: 0.2em;
  1431. text-align: justify;
  1432. }
  1433.  
  1434. .main-container-bar-vision {
  1435. max-width: 80%;
  1436. margin: 0 auto;
  1437. }
  1438.  
  1439. .container-arrow-vision-mobile {
  1440. display: none;
  1441. width: 300px;
  1442. margin:0 auto;
  1443. max-width: 100%;
  1444. }
  1445.  
  1446. .arrow-vision {
  1447. font-size: 1.5em;
  1448. color: #32dccc;
  1449. }
  1450.  
  1451. .bm_video_show {
  1452. display: block;
  1453. }
  1454.  
  1455. .bm_mobile_image {
  1456. display: none;
  1457. }
  1458.  
  1459. @media only screen and (max-width: 1200px) {
  1460.  
  1461. .show_mobile {
  1462. display: none;
  1463. margin-top: 3em;
  1464. }
  1465.  
  1466. .container-logo img {
  1467. width: 300px !important;
  1468. }
  1469.  
  1470. .footer .text-decentralize {
  1471. font-size: 1.5em !important;
  1472. }
  1473.  
  1474. .footer .whitepaper-download {
  1475. width: 85% !important;
  1476. font-size: 0.7em;
  1477. margin: 0 auto;
  1478. }
  1479.  
  1480. .footer-container {
  1481. padding-bottom: 2em;
  1482. }
  1483.  
  1484. .main-container-bonus-scale {
  1485. overflow-x: auto;
  1486. overflow-y: hidden;
  1487. }
  1488.  
  1489. .container-bonus-scale {
  1490. margin: 6em 0 16em 5em !important;
  1491. }
  1492.  
  1493. .main-container-astronauta {
  1494. width: 80%;
  1495. margin: 0 auto;
  1496. }
  1497.  
  1498. .main-container-coin {
  1499. width: 33.33%;
  1500. }
  1501. .main-section-title {
  1502. font-size: 4.0em !important;
  1503. }
  1504.  
  1505. .main-container-centered {
  1506. width: 100% !important;
  1507. }
  1508.  
  1509. .container-token-users {
  1510. padding-bottom: 4em !important;
  1511. margin-top: 5em !important;
  1512. }
  1513.  
  1514. .main-section {
  1515. padding: 200px 0 0 0;
  1516. }
  1517. }
  1518.  
  1519. @media only screen and (max-width: 1000px) {
  1520.  
  1521. .container-mobile {
  1522. display: block;
  1523. position: fixed;
  1524. cursor: pointer;
  1525. top: 30px;
  1526. right: 30px;
  1527. border-radius: 50%;
  1528. width: 60px;
  1529. height: 60px;
  1530. background: #fff;
  1531. box-shadow: 1px 1px 65px rgba(0,0,0, 0.2);
  1532. }
  1533.  
  1534. .container-mobile.active {
  1535. right: 47px !important;
  1536. }
  1537.  
  1538. .nav-menu {
  1539. z-index: 9999 !important;
  1540. }
  1541.  
  1542. .main-menu-modal {
  1543. font-size: 1.5vw;
  1544. }
  1545.  
  1546. .btn-presale {
  1547. margin-top: 1em;
  1548. }
  1549.  
  1550. }
  1551.  
  1552. @media (min-width: 1600px) {
  1553. .footer-container {
  1554. padding-bottom: 5em;
  1555. }
  1556.  
  1557. .show_mobile {
  1558. display: none;
  1559. margin-top: 3em;
  1560. }
  1561. }
  1562.  
  1563. /*xs resolution*/
  1564. @media (max-width: 768px) {
  1565.  
  1566. .bm_video_show {
  1567. display: none;
  1568. }
  1569.  
  1570. .bm_mobile_image {
  1571. display: block;
  1572. }
  1573. .show_mobile {
  1574. display: block;
  1575. margin-top: 3em;
  1576. }
  1577.  
  1578. .hide_mobile {
  1579. display: none;
  1580. }
  1581.  
  1582. .container-country {
  1583. margin-top: 2em;
  1584. }
  1585.  
  1586. .telegram-chat {
  1587. bottom: 10px;
  1588. right: 10px;
  1589. }
  1590.  
  1591. .telegram-chat img {
  1592. width: 20px;
  1593. }
  1594.  
  1595. .counter-num-clients {
  1596. margin-top: 10px;
  1597. }
  1598.  
  1599. .container-box-loghi > div {
  1600. box-shadow: none !important;
  1601. padding: 0 1em !important;
  1602. }
  1603.  
  1604. .last-clients-icon {
  1605. margin-top: 0px !important;
  1606. }
  1607.  
  1608. .container-box-loghi img {
  1609. width: 120px;
  1610. }
  1611.  
  1612. .container-video {
  1613. height: auto !important;
  1614. margin: 4em 0 !important;
  1615. }
  1616.  
  1617. .container-video > div {
  1618. margin: 3em 0 !important;
  1619. }
  1620.  
  1621. #white-paper {
  1622. background-image: -webkit-gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  1623. background-image: gradient( linear, left top, right top, color-stop(0, rgba(25,0,200,1)), color-stop(1, rgba(213,68,194,1)));
  1624. }
  1625.  
  1626. .container-arrow-vision-mobile {
  1627. display: block;
  1628. }
  1629.  
  1630. .main-container-bar-vision {
  1631. display: none;
  1632. }
  1633.  
  1634. .desc-sub-vision {
  1635. font-size: 15px;
  1636. }
  1637.  
  1638. .whitepaper-main-section {
  1639. padding: 0 !important;
  1640. }
  1641.  
  1642. #team {
  1643. margin-top: 4em;
  1644. }
  1645.  
  1646. .subsection-team {
  1647. margin-top: 4em;
  1648. }
  1649.  
  1650. .subsection-team h2 {
  1651. font-size: 0.9em !important;
  1652. }
  1653.  
  1654. .footer {
  1655. background: #282A8F !important;
  1656. padding: 2em 0;
  1657. }
  1658.  
  1659. .container-box-loghi {
  1660. padding: 5px 0;
  1661. width: 100% !important;
  1662. }
  1663.  
  1664. .footer .text-decentralize {
  1665. font-size: 1.0em !important;
  1666. }
  1667.  
  1668. .app-landing-subtitle {
  1669. font-size: 1.2em !important;
  1670. }
  1671.  
  1672. .container-iphone-block img {
  1673. height: 400px !important;
  1674. }
  1675.  
  1676. .container-iphone-block {
  1677. margin-top: 3em;
  1678. }
  1679.  
  1680. .container-clients {
  1681. background-image: none !important;
  1682. }
  1683.  
  1684. .container-clients-mobile {
  1685. display: block;
  1686. }
  1687.  
  1688. .btn-header p {
  1689. line-height: 30px !important;
  1690. font-size: 0.7em !important;
  1691. }
  1692.  
  1693. .container-mobile {
  1694. top: 20px !important;
  1695. right: 20px !important;
  1696. width: 50px !important;
  1697. height: 50px !important;
  1698. }
  1699.  
  1700. .menu-trigger.second {
  1701. margin-top: 15px !important;
  1702. }
  1703.  
  1704. .menu-trigger {
  1705. width: 23px !important;
  1706. }
  1707.  
  1708. .container-mobile.active {
  1709. right: 37px !important;
  1710. }
  1711.  
  1712. .container-btn-header, .container-btn-footer {
  1713. margin-top: 5em !important;
  1714. }
  1715.  
  1716. .container-btn-footer {
  1717. margin-top: 2em !important;
  1718. }
  1719.  
  1720. .container-social-ico > div:nth-child(3), .container-social-ico > div:nth-child(4) {
  1721. margin-top: 10px;
  1722. }
  1723.  
  1724. .container-btn-header-internal, .container-social-ico {
  1725. max-width: 200px !important;
  1726. }
  1727.  
  1728. .container-btn-footer-internal {
  1729. max-width: 250px !important
  1730. }
  1731.  
  1732. .slider-title {
  1733. margin-left: 0px;
  1734. }
  1735.  
  1736. .text-decentralize {
  1737. color: #fff !important;
  1738. }
  1739.  
  1740. .btn-token-page {
  1741. margin-top: 2em;
  1742. }
  1743.  
  1744. .slider-bg {
  1745. padding-top: 10vh;
  1746. }
  1747.  
  1748. .container-business-model-block {
  1749. margin-top: 1em !important;
  1750. }
  1751.  
  1752. .counter {
  1753. font-size: 1.5em !important;
  1754. }
  1755.  
  1756. .counter-name {
  1757. font-size: 0.6em !important;
  1758. }
  1759.  
  1760. .friendz-app {
  1761. margin-top:3em !important;
  1762. }
  1763.  
  1764. .bm-video-margin {
  1765. margin-left: 0px;
  1766. }
  1767. .comment-img {
  1768. position: relative;
  1769. top: auto;
  1770. left: auto;
  1771. transform: none;
  1772. max-width: 80%;
  1773. }
  1774.  
  1775. .subtitle-vision {
  1776. margin-bottom: 10px;
  1777. }
  1778.  
  1779. .container-video-bm-block {
  1780. text-align: center !important;
  1781. }
  1782.  
  1783. .container-block-vision {
  1784. padding: 20px 0px;
  1785. height: auto !important;
  1786. }
  1787.  
  1788. .presale-container {
  1789. margin-bottom: 10em;
  1790. }
  1791.  
  1792. .main-container-whitepaper-book {
  1793. margin-top: 0px !important;
  1794. }
  1795.  
  1796. .col-download-whitepaper {
  1797. text-align: center;
  1798. padding-bottom: 3em;
  1799. }
  1800.  
  1801. .col-download-whitepaper h2 {
  1802. margin-bottom: 15px;
  1803. }
  1804.  
  1805. .main-container-whitepaper-book, .container-whitepaper-book {
  1806. height: auto !important;
  1807. }
  1808.  
  1809. .image-whitepaper {
  1810. margin-top: 20px !important;
  1811. height: 45vh !important;
  1812. margin-bottom: 2em;
  1813. }
  1814.  
  1815. .nuvola-image {
  1816. display: none;
  1817. }
  1818.  
  1819. .countdown {
  1820. width: 65% !important;
  1821. }
  1822.  
  1823. .main-container-countdown {
  1824. height: 200px;
  1825. }
  1826.  
  1827. .main-container-coin {
  1828. width: 50%;
  1829. }
  1830.  
  1831. .container-numbers {
  1832. margin: 7em 0 3em 0;
  1833. }
  1834.  
  1835. .screen-carousel-1 {
  1836. margin: 0px !important;
  1837. }
  1838.  
  1839. .container-vision, .container-image-vision {
  1840. margin-top: 1.5em !important;
  1841. }
  1842.  
  1843. .app-landing {
  1844. padding: 50px 0 0;
  1845. }
  1846.  
  1847. h1 {
  1848. font-size: 1.5em !important;
  1849. }
  1850.  
  1851. .main-section {
  1852. padding: 120px 0 0 0;
  1853. }
  1854.  
  1855. .main-section-title {
  1856. font-size: 2.5em !important;
  1857. }
  1858.  
  1859. .text-vision, .container-image-vision {
  1860. text-align: center !important;
  1861. }
  1862.  
  1863. h2, p, .container-image-token-clients {
  1864. text-align: center !important;
  1865. }
  1866.  
  1867. .container-vision img, .container-video img, .container-token-clients img {
  1868. max-width: 90% !important;
  1869. }
  1870.  
  1871. .container-token-clients, .container-token-users {
  1872. margin-top: 5em;
  1873. }
  1874.  
  1875. .container-token-users {
  1876. }
  1877.  
  1878. .container-image-token-clients {
  1879. margin-top: 2em;
  1880. }
  1881.  
  1882. .container-text-element-list-token {
  1883. width: 100%;
  1884. margin: 0;
  1885. text-align: center;
  1886. }
  1887.  
  1888. .container-img-element-list-token {
  1889. width: 100%;
  1890. text-align: center;
  1891. margin-bottom: 10px;
  1892. }
  1893.  
  1894. .element-list-token-users {
  1895. margin-top: 2.5em;
  1896. }
  1897.  
  1898. .container-image-token-users img {
  1899. max-width: 65% !important;
  1900. }
  1901.  
  1902. .container-image-token-users {
  1903. margin-top: 4em;
  1904. }
  1905.  
  1906. .main-section-subtitle {
  1907. max-width: 90% !important;
  1908. }
  1909.  
  1910. }
  1911.  
  1912. /*md resolution*/
  1913. @media (min-width: 768px) {
  1914.  
  1915. .show_mobile {
  1916. display: none;
  1917. margin-top: 3em;
  1918. }
  1919.  
  1920. .container-token-clients {
  1921. margin-top: 7em !important;
  1922. }
  1923.  
  1924. .container-token-users {
  1925. margin-top: 3em !important;
  1926. }
  1927.  
  1928. .main-section-subtitle {
  1929. max-width: 90% !important;
  1930. }
  1931.  
  1932. }
  1933.  
  1934. /*lg resolution*/
  1935. @media (min-width: 992px) {
  1936.  
  1937.  
  1938. h2 {
  1939. font-size: 2.0em !important;
  1940. margin-bottom: 40px;
  1941. }
  1942.  
  1943. .container-token-users {
  1944. padding-bottom: 0px !important;
  1945. margin-top: 1em !important;
  1946. }
  1947.  
  1948. .featured1-wrap {
  1949. padding: 124px 0 !important;
  1950. }
  1951. }
  1952.  
  1953. @media only screen and (max-width: 480px) {
  1954.  
  1955. .container_coin {
  1956. height: 168px;
  1957. width: 168px;
  1958. }
  1959.  
  1960. .main-container-coin {
  1961. display: none;
  1962. }
  1963.  
  1964. .main-container-coin-mobile {
  1965. display: block;
  1966. }
  1967.  
  1968. .coin {
  1969. height: 168px;
  1970. width: 168px;
  1971.  
  1972. }
  1973.  
  1974. .coin .front,
  1975. .coin .back {
  1976. height: 168px;
  1977. width: 168px;
  1978. }
  1979.  
  1980. .container_coin img {
  1981. height: 100%;
  1982. }
  1983.  
  1984. .coin .side {
  1985. -webkit-transform: translateX(80px);
  1986. }
  1987.  
  1988. .coin .side .circle {
  1989. height: 168px;
  1990. }
  1991.  
  1992. .coin .side .circle:before,
  1993. .coin .side .circle:after {
  1994. height: 15.682742452729697px;
  1995. width: 16px;
  1996. }
  1997.  
  1998. .ico-team-name {
  1999. font-size: 0.8em;
  2000. }
  2001.  
  2002. .ico-team-role {
  2003. font-size: 0.6em;
  2004. }
  2005.  
  2006. .title-header {
  2007. font-size: 2.5em !important;
  2008. }
  2009.  
  2010. .btn-gradient-large a {
  2011. font-size: 0.8em !important;
  2012. }
  2013.  
  2014. .main-menu-modal {
  2015. font-size: 2.5vw !important;
  2016. }
  2017.  
  2018. .secondary-menu-modal > div:nth-child(3), .secondary-menu-modal > div:nth-child(4) {
  2019. /*padding-top:1em !important;*/
  2020. }
  2021.  
  2022. .slider-title {
  2023. margin-left: 0px;
  2024. }
  2025.  
  2026. .slider-bg .container {
  2027. padding: 0;
  2028. }
  2029.  
  2030. .text-decentralize {
  2031. font-size: 1.0em !important;
  2032. }
  2033.  
  2034. .white-paper-top {
  2035. display: none;
  2036. }
  2037.  
  2038. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement