Advertisement
Guest User

Untitled

a guest
Aug 28th, 2016
97
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 53.41 KB | None | 0 0
  1. html, body, div, span, applet, object, iframe,
  2. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  3. a, abbr, acronym, address, big, cite, code,
  4. del, dfn, em, img, ins, kbd, q, s, samp,
  5. small, strike, strong, sub, sup, tt, var,
  6. b, u, i, center,
  7. dl, dt, dd, ol, ul, li,
  8. fieldset, form, label, legend,
  9. table, caption, tbody, tfoot, thead, tr, th, td,
  10. article, aside, canvas, details, embed,
  11. figure, figcaption, footer, header, hgroup,
  12. menu, nav, output, ruby, section, summary,
  13. time, mark, audio, video {
  14. margin: 0;
  15. padding: 0;
  16. border: 0;
  17. font: inherit;
  18. font-size: 100%;
  19. vertical-align: baseline; }
  20.  
  21. html {
  22. line-height: 1; }
  23.  
  24. ol, ul {
  25. list-style: none; }
  26.  
  27. table {
  28. border-collapse: collapse;
  29. border-spacing: 0; }
  30.  
  31. caption, th, td {
  32. text-align: left;
  33. font-weight: normal;
  34. vertical-align: middle; }
  35.  
  36. q, blockquote {
  37. quotes: none; }
  38. q:before, q:after, blockquote:before, blockquote:after {
  39. content: "";
  40. content: none; }
  41.  
  42. a img {
  43. border: none; }
  44.  
  45. elements-of-type(html5-block) {
  46. display: block; }
  47.  
  48. .row:after, .chat-message:after {
  49. content: "";
  50. display: table;
  51. clear: both; }
  52.  
  53. .clearfix:before, .clearfix:after {
  54. content: " ";
  55. display: table; }
  56.  
  57. .clearfix:after {
  58. clear: both; }
  59.  
  60. /*------------------------------------* $Variables
  61. \*------------------------------------*/
  62. /*------------------------------------* $Mixins
  63. \*------------------------------------*/
  64. /*------------------------------------* $Extends
  65. \*------------------------------------*/
  66. .col-s-1, .col-m-1, .col-l-1, .col-s-2, .col-m-2, .col-l-2, .col-s-3, .col-m-3, .col-l-3, .col-s-4, .col-m-4, .col-l-4, .col-s-5, .col-m-5, .col-l-5, .col-s-6, .col-m-6, .col-l-6, .col-s-7, .col-m-7, .col-l-7, .col-s-8, .col-m-8, .col-l-8, .col-s-9, .col-m-9, .col-l-9, .col-s-10, .col-m-10, .col-l-10, .col-s-11, .col-m-11, .col-l-11, .col-s-12, .col-m-12, .col-l-12 {
  67. float: left;
  68. min-height: 1px;
  69. padding: 0 10px;
  70. width: 100%; }
  71.  
  72. /*------------------------------------* $Class
  73. \*------------------------------------*/
  74. .row {
  75. margin: 0 -10px; }
  76.  
  77. /*------------------------------------* $Grid
  78. \*------------------------------------*/
  79. .m-show {
  80. display: none !important; }
  81.  
  82. .l-show {
  83. display: none !important; }
  84.  
  85. .col-s-center {
  86. margin: 0 auto;
  87. float: none; }
  88.  
  89. .col-s-push-0 {
  90. left: 0%; }
  91.  
  92. .col-s-offset-0 {
  93. margin-left: 0%; }
  94.  
  95. .col-s-pull-0 {
  96. left: 0%; }
  97.  
  98. .col-s-1 {
  99. width: 8.33333%; }
  100.  
  101. .col-s-center {
  102. margin: 0 auto;
  103. float: none; }
  104.  
  105. .col-s-push-1 {
  106. left: 8.33333%; }
  107.  
  108. .col-s-offset-1 {
  109. margin-left: 8.33333%; }
  110.  
  111. .col-s-pull-1 {
  112. left: 8.33333%; }
  113.  
  114. .col-s-2 {
  115. width: 16.66667%; }
  116.  
  117. .col-s-center {
  118. margin: 0 auto;
  119. float: none; }
  120.  
  121. .col-s-push-2 {
  122. left: 16.66667%; }
  123.  
  124. .col-s-offset-2 {
  125. margin-left: 16.66667%; }
  126.  
  127. .col-s-pull-2 {
  128. left: 16.66667%; }
  129.  
  130. .col-s-3 {
  131. width: 25%; }
  132.  
  133. .col-s-center {
  134. margin: 0 auto;
  135. float: none; }
  136.  
  137. .col-s-push-3 {
  138. left: 25%; }
  139.  
  140. .col-s-offset-3 {
  141. margin-left: 25%; }
  142.  
  143. .col-s-pull-3 {
  144. left: 25%; }
  145.  
  146. .col-s-4 {
  147. width: 33.33333%; }
  148.  
  149. .col-s-center {
  150. margin: 0 auto;
  151. float: none; }
  152.  
  153. .col-s-push-4 {
  154. left: 33.33333%; }
  155.  
  156. .col-s-offset-4 {
  157. margin-left: 33.33333%; }
  158.  
  159. .col-s-pull-4 {
  160. left: 33.33333%; }
  161.  
  162. .col-s-5 {
  163. width: 41.66667%; }
  164.  
  165. .col-s-center {
  166. margin: 0 auto;
  167. float: none; }
  168.  
  169. .col-s-push-5 {
  170. left: 41.66667%; }
  171.  
  172. .col-s-offset-5 {
  173. margin-left: 41.66667%; }
  174.  
  175. .col-s-pull-5 {
  176. left: 41.66667%; }
  177.  
  178. .col-s-6 {
  179. width: 50%; }
  180.  
  181. .col-s-center {
  182. margin: 0 auto;
  183. float: none; }
  184.  
  185. .col-s-push-6 {
  186. left: 50%; }
  187.  
  188. .col-s-offset-6 {
  189. margin-left: 50%; }
  190.  
  191. .col-s-pull-6 {
  192. left: 50%; }
  193.  
  194. .col-s-7 {
  195. width: 58.33333%; }
  196.  
  197. .col-s-center {
  198. margin: 0 auto;
  199. float: none; }
  200.  
  201. .col-s-push-7 {
  202. left: 58.33333%; }
  203.  
  204. .col-s-offset-7 {
  205. margin-left: 58.33333%; }
  206.  
  207. .col-s-pull-7 {
  208. left: 58.33333%; }
  209.  
  210. .col-s-8 {
  211. width: 66.66667%; }
  212.  
  213. .col-s-center {
  214. margin: 0 auto;
  215. float: none; }
  216.  
  217. .col-s-push-8 {
  218. left: 66.66667%; }
  219.  
  220. .col-s-offset-8 {
  221. margin-left: 66.66667%; }
  222.  
  223. .col-s-pull-8 {
  224. left: 66.66667%; }
  225.  
  226. .col-s-9 {
  227. width: 75%; }
  228.  
  229. .col-s-center {
  230. margin: 0 auto;
  231. float: none; }
  232.  
  233. .col-s-push-9 {
  234. left: 75%; }
  235.  
  236. .col-s-offset-9 {
  237. margin-left: 75%; }
  238.  
  239. .col-s-pull-9 {
  240. left: 75%; }
  241.  
  242. .col-s-10 {
  243. width: 83.33333%; }
  244.  
  245. .col-s-center {
  246. margin: 0 auto;
  247. float: none; }
  248.  
  249. .col-s-push-10 {
  250. left: 83.33333%; }
  251.  
  252. .col-s-offset-10 {
  253. margin-left: 83.33333%; }
  254.  
  255. .col-s-pull-10 {
  256. left: 83.33333%; }
  257.  
  258. .col-s-11 {
  259. width: 91.66667%; }
  260.  
  261. .col-s-center {
  262. margin: 0 auto;
  263. float: none; }
  264.  
  265. .col-s-push-11 {
  266. left: 91.66667%; }
  267.  
  268. .col-s-offset-11 {
  269. margin-left: 91.66667%; }
  270.  
  271. .col-s-pull-11 {
  272. left: 91.66667%; }
  273.  
  274. .col-s-12 {
  275. width: 100%; }
  276.  
  277. .col-s-center {
  278. margin: 0 auto;
  279. float: none; }
  280.  
  281. .col-s-push-12 {
  282. left: 100%; }
  283.  
  284. .col-s-offset-12 {
  285. margin-left: 100%; }
  286.  
  287. .col-s-pull-12 {
  288. left: 100%; }
  289.  
  290. /*------------------------------------* $RESPONSIVE
  291. \*------------------------------------*/
  292. /* Medium Screen */
  293. @media only screen and (min-width: 640px) {
  294. .col-m-center {
  295. margin: 0 auto;
  296. float: none; }
  297. .col-m-push-0 {
  298. left: 0%; }
  299. .col-m-offset-0 {
  300. margin-left: 0%; }
  301. .col-m-pull-0 {
  302. left: 0%; }
  303. .col-m-1 {
  304. width: 8.33333%; }
  305. .col-m-center {
  306. margin: 0 auto;
  307. float: none; }
  308. .col-m-push-1 {
  309. left: 8.33333%; }
  310. .col-m-offset-1 {
  311. margin-left: 8.33333%; }
  312. .col-m-pull-1 {
  313. left: 8.33333%; }
  314. .col-m-2 {
  315. width: 16.66667%; }
  316. .col-m-center {
  317. margin: 0 auto;
  318. float: none; }
  319. .col-m-push-2 {
  320. left: 16.66667%; }
  321. .col-m-offset-2 {
  322. margin-left: 16.66667%; }
  323. .col-m-pull-2 {
  324. left: 16.66667%; }
  325. .col-m-3 {
  326. width: 25%; }
  327. .col-m-center {
  328. margin: 0 auto;
  329. float: none; }
  330. .col-m-push-3 {
  331. left: 25%; }
  332. .col-m-offset-3 {
  333. margin-left: 25%; }
  334. .col-m-pull-3 {
  335. left: 25%; }
  336. .col-m-4 {
  337. width: 33.33333%; }
  338. .col-m-center {
  339. margin: 0 auto;
  340. float: none; }
  341. .col-m-push-4 {
  342. left: 33.33333%; }
  343. .col-m-offset-4 {
  344. margin-left: 33.33333%; }
  345. .col-m-pull-4 {
  346. left: 33.33333%; }
  347. .col-m-5 {
  348. width: 41.66667%; }
  349. .col-m-center {
  350. margin: 0 auto;
  351. float: none; }
  352. .col-m-push-5 {
  353. left: 41.66667%; }
  354. .col-m-offset-5 {
  355. margin-left: 41.66667%; }
  356. .col-m-pull-5 {
  357. left: 41.66667%; }
  358. .col-m-6 {
  359. width: 50%; }
  360. .col-m-center {
  361. margin: 0 auto;
  362. float: none; }
  363. .col-m-push-6 {
  364. left: 50%; }
  365. .col-m-offset-6 {
  366. margin-left: 50%; }
  367. .col-m-pull-6 {
  368. left: 50%; }
  369. .col-m-7 {
  370. width: 58.33333%; }
  371. .col-m-center {
  372. margin: 0 auto;
  373. float: none; }
  374. .col-m-push-7 {
  375. left: 58.33333%; }
  376. .col-m-offset-7 {
  377. margin-left: 58.33333%; }
  378. .col-m-pull-7 {
  379. left: 58.33333%; }
  380. .col-m-8 {
  381. width: 66.66667%; }
  382. .col-m-center {
  383. margin: 0 auto;
  384. float: none; }
  385. .col-m-push-8 {
  386. left: 66.66667%; }
  387. .col-m-offset-8 {
  388. margin-left: 66.66667%; }
  389. .col-m-pull-8 {
  390. left: 66.66667%; }
  391. .col-m-9 {
  392. width: 75%; }
  393. .col-m-center {
  394. margin: 0 auto;
  395. float: none; }
  396. .col-m-push-9 {
  397. left: 75%; }
  398. .col-m-offset-9 {
  399. margin-left: 75%; }
  400. .col-m-pull-9 {
  401. left: 75%; }
  402. .col-m-10 {
  403. width: 83.33333%; }
  404. .col-m-center {
  405. margin: 0 auto;
  406. float: none; }
  407. .col-m-push-10 {
  408. left: 83.33333%; }
  409. .col-m-offset-10 {
  410. margin-left: 83.33333%; }
  411. .col-m-pull-10 {
  412. left: 83.33333%; }
  413. .col-m-11 {
  414. width: 91.66667%; }
  415. .col-m-center {
  416. margin: 0 auto;
  417. float: none; }
  418. .col-m-push-11 {
  419. left: 91.66667%; }
  420. .col-m-offset-11 {
  421. margin-left: 91.66667%; }
  422. .col-m-pull-11 {
  423. left: 91.66667%; }
  424. .col-m-12 {
  425. width: 100%; }
  426. .col-m-center {
  427. margin: 0 auto;
  428. float: none; }
  429. .col-m-push-12 {
  430. left: 100%; }
  431. .col-m-offset-12 {
  432. margin-left: 100%; }
  433. .col-m-pull-12 {
  434. left: 100%; }
  435. .m-hide {
  436. display: none !important; }
  437. .m-show {
  438. display: initial !important; }
  439. .s-show {
  440. display: none !important; } }
  441.  
  442. /* Large Screen */
  443. @media only screen and (min-width: 1024px) {
  444. .col-l-center {
  445. margin: 0 auto;
  446. float: none; }
  447. .col-l-push-0 {
  448. left: 0%; }
  449. .col-l-offset-0 {
  450. margin-left: 0%; }
  451. .col-l-pull-0 {
  452. left: 0%; }
  453. .col-l-1 {
  454. width: 8.33333%; }
  455. .col-l-center {
  456. margin: 0 auto;
  457. float: none; }
  458. .col-l-push-1 {
  459. left: 8.33333%; }
  460. .col-l-offset-1 {
  461. margin-left: 8.33333%; }
  462. .col-l-pull-1 {
  463. left: 8.33333%; }
  464. .col-l-2 {
  465. width: 16.66667%; }
  466. .col-l-center {
  467. margin: 0 auto;
  468. float: none; }
  469. .col-l-push-2 {
  470. left: 16.66667%; }
  471. .col-l-offset-2 {
  472. margin-left: 16.66667%; }
  473. .col-l-pull-2 {
  474. left: 16.66667%; }
  475. .col-l-3 {
  476. width: 25%; }
  477. .col-l-center {
  478. margin: 0 auto;
  479. float: none; }
  480. .col-l-push-3 {
  481. left: 25%; }
  482. .col-l-offset-3 {
  483. margin-left: 25%; }
  484. .col-l-pull-3 {
  485. left: 25%; }
  486. .col-l-4 {
  487. width: 33.33333%; }
  488. .col-l-center {
  489. margin: 0 auto;
  490. float: none; }
  491. .col-l-push-4 {
  492. left: 33.33333%; }
  493. .col-l-offset-4 {
  494. margin-left: 33.33333%; }
  495. .col-l-pull-4 {
  496. left: 33.33333%; }
  497. .col-l-5 {
  498. width: 41.66667%; }
  499. .col-l-center {
  500. margin: 0 auto;
  501. float: none; }
  502. .col-l-push-5 {
  503. left: 41.66667%; }
  504. .col-l-offset-5 {
  505. margin-left: 41.66667%; }
  506. .col-l-pull-5 {
  507. left: 41.66667%; }
  508. .col-l-6 {
  509. width: 50%; }
  510. .col-l-center {
  511. margin: 0 auto;
  512. float: none; }
  513. .col-l-push-6 {
  514. left: 50%; }
  515. .col-l-offset-6 {
  516. margin-left: 50%; }
  517. .col-l-pull-6 {
  518. left: 50%; }
  519. .col-l-7 {
  520. width: 58.33333%; }
  521. .col-l-center {
  522. margin: 0 auto;
  523. float: none; }
  524. .col-l-push-7 {
  525. left: 58.33333%; }
  526. .col-l-offset-7 {
  527. margin-left: 58.33333%; }
  528. .col-l-pull-7 {
  529. left: 58.33333%; }
  530. .col-l-8 {
  531. width: 66.66667%; }
  532. .col-l-center {
  533. margin: 0 auto;
  534. float: none; }
  535. .col-l-push-8 {
  536. left: 66.66667%; }
  537. .col-l-offset-8 {
  538. margin-left: 66.66667%; }
  539. .col-l-pull-8 {
  540. left: 66.66667%; }
  541. .col-l-9 {
  542. width: 75%; }
  543. .col-l-center {
  544. margin: 0 auto;
  545. float: none; }
  546. .col-l-push-9 {
  547. left: 75%; }
  548. .col-l-offset-9 {
  549. margin-left: 75%; }
  550. .col-l-pull-9 {
  551. left: 75%; }
  552. .col-l-10 {
  553. width: 83.33333%; }
  554. .col-l-center {
  555. margin: 0 auto;
  556. float: none; }
  557. .col-l-push-10 {
  558. left: 83.33333%; }
  559. .col-l-offset-10 {
  560. margin-left: 83.33333%; }
  561. .col-l-pull-10 {
  562. left: 83.33333%; }
  563. .col-l-11 {
  564. width: 91.66667%; }
  565. .col-l-center {
  566. margin: 0 auto;
  567. float: none; }
  568. .col-l-push-11 {
  569. left: 91.66667%; }
  570. .col-l-offset-11 {
  571. margin-left: 91.66667%; }
  572. .col-l-pull-11 {
  573. left: 91.66667%; }
  574. .col-l-12 {
  575. width: 100%; }
  576. .col-l-center {
  577. margin: 0 auto;
  578. float: none; }
  579. .col-l-push-12 {
  580. left: 100%; }
  581. .col-l-offset-12 {
  582. margin-left: 100%; }
  583. .col-l-pull-12 {
  584. left: 100%; }
  585. .l-hide {
  586. display: none !important; }
  587. .l-show {
  588. display: initial !important; }
  589. .m-show {
  590. display: initial !important; } }
  591.  
  592. .btn {
  593. display: inline-block;
  594. background-color: #a73232;
  595. border: 2px solid transparent;
  596. padding: 0 15px;
  597. height: 34px;
  598. line-height: 30px;
  599. font-weight: bold;
  600. text-align: center;
  601. transition: all 0.3s;
  602. color: #f0f0f0;
  603. font-size: 16px;
  604. cursor: pointer;
  605. font-family: inherit; }
  606. .btn:not(:last-child) {
  607. margin-bottom: 5px; }
  608. .btn:last-child:first-child {
  609. margin-bottom: 0px; }
  610. .btn:hover {
  611. border: 2px solid #a73232;
  612. color: #a73232;
  613. background-color: transparent; }
  614. .btn:disabled {
  615. cursor: not-allowed;
  616. background-color: #a73232;
  617. color: #f0f0f0; }
  618.  
  619. .btn-block {
  620. display: block !important;
  621. margin: 0;
  622. width: 100%; }
  623.  
  624. .btn-dark {
  625. background-color: #555; }
  626. .btn-dark:hover {
  627. border-color: #555;
  628. color: #555; }
  629.  
  630. .btn-border {
  631. background: transparent;
  632. border: 2px solid #555;
  633. color: #555; }
  634. .btn-border:hover {
  635. border-color: #000;
  636. color: #555; }
  637.  
  638. .btn-border-white {
  639. border-color: #e0e0e0;
  640. color: #e0e0e0; }
  641. .btn-border-white:hover {
  642. border-color: #fff;
  643. color: #FFF; }
  644.  
  645. .social-btn {
  646. display: inline-block;
  647. position: relative;
  648. width: 2em;
  649. height: 2em;
  650. line-height: 2em;
  651. text-align: center;
  652. font-size: 17px;
  653. background: #555;
  654. border-radius: 50%;
  655. margin: 0 0.1em; }
  656.  
  657. .social-btn:hover {
  658. color: #FFF;
  659. transition: all 0.2s ease; }
  660.  
  661. .social-btn.facebook:hover {
  662. background: #4b70ab; }
  663.  
  664. .social-btn.twitter:hover {
  665. background: #32b9e7; }
  666.  
  667. .cmn-toggle {
  668. position: absolute;
  669. margin-left: -9999px;
  670. visibility: hidden; }
  671.  
  672. .cmn-toggle + label {
  673. display: block;
  674. position: relative;
  675. cursor: pointer;
  676. outline: none;
  677. -webkit-user-select: none;
  678. -moz-user-select: none;
  679. -ms-user-select: none;
  680. user-select: none; }
  681.  
  682. input.cmn-toggle-round-flat + label {
  683. padding: 2px;
  684. width: 120px;
  685. height: 30px;
  686. background-color: #a73232;
  687. border-radius: 60px;
  688. transition: background 0.4s; }
  689.  
  690. input.cmn-toggle-round-flat + label:before, input.cmn-toggle-round-flat + label:after {
  691. display: block;
  692. position: absolute;
  693. content: ""; }
  694.  
  695. input.cmn-toggle-round-flat + label:before {
  696. top: 2px;
  697. left: 2px;
  698. bottom: 2px;
  699. right: 2px;
  700. background-color: #f5f5f5;
  701. border-radius: 60px;
  702. transition: background 0.4s; }
  703.  
  704. input.cmn-toggle-round-flat + label:after {
  705. top: 4px;
  706. left: 4px;
  707. bottom: 4px;
  708. width: 52px;
  709. background-color: #a73232;
  710. -o-border-radius: 52px;
  711. border-radius: 52px;
  712. transition: margin 0.4s, background 0.4s; }
  713.  
  714. input.cmn-toggle-round-flat:checked + label {
  715. background-color: #555; }
  716.  
  717. input.cmn-toggle-round-flat:checked + label:after {
  718. margin-left: 60px;
  719. background-color: #555; }
  720.  
  721. .flag-btn img {
  722. height: 34px;
  723. vertical-align: bottom; }
  724.  
  725. .radial-button {
  726. display: -webkit-flex;
  727. display: -ms-flexbox;
  728. display: flex;
  729. -webkit-align-items: center;
  730. -ms-flex-align: center;
  731. align-items: center;
  732. -webkit-justify-content: center;
  733. -ms-flex-pack: center;
  734. justify-content: center;
  735. width: 140px;
  736. height: 140px;
  737. border: solid 12px #555;
  738. background: #fafafa;
  739. border-radius: 100%;
  740. margin: 0 auto;
  741. color: #000;
  742. transition: all 0.1s ease;
  743. font-size: 20px; }
  744. .radial-button:hover {
  745. border-color: #a73232;
  746. border-width: 6px;
  747. box-shadow: 0 0 0px 9px #555; }
  748.  
  749. p {
  750. margin: 1rem 0; }
  751.  
  752. .pt {
  753. padding-top: 2rem; }
  754.  
  755. .pb {
  756. padding-bottom: 2rem; }
  757.  
  758. .mt {
  759. margin-top: 2rem; }
  760.  
  761. .mb {
  762. margin-bottom: 2rem; }
  763.  
  764. .container {
  765. margin: 0 15px; }
  766.  
  767. @media only screen and (min-width: 1100px) {
  768. .container {
  769. width: 1100px;
  770. margin: 0 auto; } }
  771.  
  772. .hero-title {
  773. padding-top: 40px;
  774. font-size: 40px;
  775. color: #FFF;
  776. font-weight: bold; }
  777.  
  778. h1 {
  779. font-size: 32px;
  780. font-weight: bold; }
  781.  
  782. h2 {
  783. font-weight: bold;
  784. font-size: 28px; }
  785.  
  786. h3 {
  787. font-size: 22px;
  788. color: #f2f2f2;
  789. text-transform: uppercase; }
  790.  
  791. h5 {
  792. font-size: 24px;
  793. font-weight: 600; }
  794.  
  795. strong, b {
  796. font-weight: 600; }
  797.  
  798. i {
  799. font-style: italic; }
  800.  
  801. input[type="text"], input[type="password"], input[type="email"], input[type="number"], textarea {
  802. padding: 10px 15px;
  803. font-size: 18px;
  804. border: none;
  805. border-bottom: solid 3px #555;
  806. outline: none;
  807. box-shadow: 0 0 0 1px #e0e0e0;
  808. font-family: Arial, sans-serif;
  809. transition: all 0.3s ease; }
  810. input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="number"]:focus, textarea:focus {
  811. border-color: #a73232; }
  812.  
  813. textarea {
  814. resize: none;
  815. width: 650px; }
  816.  
  817. input[type="text"], input[type="password"], input[type="email"], input[type="number"] {
  818. width: 325px; }
  819. input[type="text"].large, input[type="password"].large, input[type="email"].large, input[type="number"].large {
  820. width: 650px; }
  821.  
  822. input[type="number"] {
  823. width: 100px; }
  824.  
  825. select {
  826. border: solid 1px #e0e0e0;
  827. width: 325px;
  828. font-size: 17px;
  829. padding: 8px 10px;
  830. outline: none; }
  831.  
  832. .form-group {
  833. margin: 10px 0; }
  834. .form-group input[type="checkbox"] {
  835. height: 13px; }
  836.  
  837. .center {
  838. text-align: center; }
  839.  
  840. .right {
  841. text-align: right; }
  842.  
  843. .section-dark {
  844. background: #1b1b1b;
  845. border-bottom: 5px solid #a73232;
  846. border-top: 5px solid #a73232;
  847. padding: 15px;
  848. color: #FFF;
  849. min-height: 100px; }
  850.  
  851. .primary {
  852. color: #a73232; }
  853.  
  854. .primary-link {
  855. color: #a73232; }
  856. .primary-link:hover {
  857. color: #a73232;
  858. text-decoration: underline; }
  859.  
  860. .strong {
  861. font-weight: bold; }
  862.  
  863. .alert {
  864. padding: 15px;
  865. margin-top: -20px;
  866. margin-bottom: 40px;
  867. border: 1px solid transparent; }
  868.  
  869. .alert h4 {
  870. margin-top: 0;
  871. color: inherit; }
  872.  
  873. .alert .alert-link {
  874. font-weight: bold; }
  875.  
  876. .alert > p,
  877. .alert > ul {
  878. margin-bottom: 0; }
  879.  
  880. .alert > p + p {
  881. margin-top: 5px; }
  882.  
  883. .alert-dismissable,
  884. .alert-dismissible {
  885. padding-right: 35px; }
  886.  
  887. .alert-dismissable .close,
  888. .alert-dismissible .close {
  889. position: relative;
  890. top: -2px;
  891. right: -21px;
  892. color: inherit; }
  893.  
  894. .alert-success {
  895. background-color: #dff0d8;
  896. border-color: #d6e9c6;
  897. color: #3c763d; }
  898.  
  899. .alert-success hr {
  900. border-top-color: #c9e2b3; }
  901.  
  902. .alert-success .alert-link {
  903. color: #2b542c; }
  904.  
  905. .alert-info {
  906. background-color: #d9edf7;
  907. border-color: #bce8f1;
  908. color: #31708f; }
  909.  
  910. .alert-info hr {
  911. border-top-color: #a6e1ec; }
  912.  
  913. .alert-info .alert-link {
  914. color: #245269; }
  915.  
  916. .alert-warning {
  917. background-color: #fcf8e3;
  918. border-color: #faebcc;
  919. color: #8a6d3b; }
  920.  
  921. .alert-warning hr {
  922. border-top-color: #f7e1b5; }
  923.  
  924. .alert-warning .alert-link {
  925. color: #66512c; }
  926.  
  927. .alert-danger {
  928. background-color: #f2dede;
  929. border-color: #ebccd1;
  930. color: #a94442; }
  931.  
  932. .alert-danger hr {
  933. border-top-color: #e4b9c0; }
  934.  
  935. .alert-danger .alert-link {
  936. color: #843534; }
  937.  
  938. .invoice-body {
  939. background: #e0e0e0;
  940. padding: 0 !important; }
  941.  
  942. .invoice-viewer {
  943. padding-left: 350px; }
  944. .invoice-viewer .invoice-page {
  945. box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
  946. margin: 50px auto; }
  947.  
  948. .invoice-page {
  949. padding: 25px;
  950. width: 1000px;
  951. min-height: 1000px;
  952. background: #FFF;
  953. position: relative; }
  954.  
  955. .invoice-header {
  956. background: #000;
  957. color: #FFF;
  958. text-transform: uppercase;
  959. text-align: center;
  960. margin-bottom: 50px; }
  961.  
  962. .invoice-address {
  963. font-size: 18px; }
  964.  
  965. .invoice-address-label {
  966. color: #555;
  967. float: left;
  968. width: 105px;
  969. text-align: right; }
  970.  
  971. .invoice-address-content {
  972. margin-left: 115px;
  973. border-left: solid 1px #ccc;
  974. padding-left: 10px; }
  975.  
  976. .invoice-items {
  977. margin-top: 65px;
  978. width: 100%;
  979. border-collapse: collapse;
  980. border-spacing: 0; }
  981. .invoice-items th {
  982. font-size: .9em;
  983. text-align: left;
  984. font-weight: bold;
  985. font-size: 16px;
  986. padding: 10px; }
  987. .invoice-items td {
  988. padding: 10px;
  989. border: solid 1px #ccc;
  990. border-left: none;
  991. border-right: none; }
  992. .invoice-items tbody tr:nth-child(odd) {
  993. background: #f1f1f1; }
  994. .invoice-items .total {
  995. background: transparent !important;
  996. font-size: 1.2em; }
  997. .invoice-items .total td {
  998. border: none !important;
  999. padding: 5px 10px; }
  1000. .invoice-items .total-first td {
  1001. padding-top: 30px; }
  1002. .invoice-items .total-label {
  1003. text-align: right; }
  1004. .invoice-items .total-bold {
  1005. font-size: 1.5em;
  1006. font-weight: bold;
  1007. padding-top: 10px; }
  1008.  
  1009. .invoice-footer {
  1010. border-top: solid 1px #ccc;
  1011. position: absolute;
  1012. bottom: 0;
  1013. left: 0;
  1014. right: 0;
  1015. padding: 25px; }
  1016.  
  1017. .invoice-sidebar {
  1018. background: #a73232;
  1019. position: fixed;
  1020. top: 0;
  1021. left: 0;
  1022. bottom: 0;
  1023. width: 350px;
  1024. padding: 30px 20px 15px; }
  1025. .invoice-sidebar .btn {
  1026. background: #FFF;
  1027. color: #a73232; }
  1028. .invoice-sidebar .btn:hover {
  1029. background: #a73232;
  1030. border-color: #FFF;
  1031. color: #FFF; }
  1032. .invoice-sidebar .btn-border {
  1033. border-color: #FFF;
  1034. color: #FFF;
  1035. background: #a73232; }
  1036.  
  1037. .invoice-sidebar-header {
  1038. text-align: center;
  1039. margin-bottom: 50px; }
  1040. .invoice-sidebar-header .wrapper {
  1041. display: inline-block;
  1042. width: 250px;
  1043. text-align: right; }
  1044. .invoice-sidebar-header .wrapper .label {
  1045. letter-spacing: 5px;
  1046. color: #000;
  1047. text-transform: uppercase; }
  1048.  
  1049. .invoice-sidebar-row {
  1050. margin: 25px 0;
  1051. text-align: center; }
  1052. .invoice-sidebar-row .row-title {
  1053. color: #FFF;
  1054. border-bottom: solid 2px #fff;
  1055. font-size: 22px;
  1056. font-weight: bold; }
  1057. .invoice-sidebar-row .row-content {
  1058. padding: 10px; }
  1059.  
  1060. .invoice-sidebar-status {
  1061. font-size: 32px;
  1062. color: #000; }
  1063. .invoice-sidebar-status.paid {
  1064. color: #75FF00; }
  1065.  
  1066. .invoice-pdf .invoice-page {
  1067. height: 100%;
  1068. width: 100%; }
  1069.  
  1070. @media only screen and (max-height: 950px) {
  1071. .invoice-sidebar {
  1072. position: absolute; } }
  1073.  
  1074. @media only screen and (max-width: 1400px) {
  1075. .invoice-viewer {
  1076. padding: 0; }
  1077. .invoice-viewer .invoice-page {
  1078. margin: 0 auto;
  1079. box-shadow: none; }
  1080. .invoice-sidebar-header {
  1081. margin-bottom: 15px; }
  1082. .invoice-sidebar {
  1083. position: static;
  1084. width: 100%;
  1085. min-width: 1000px;
  1086. height: 400px;
  1087. margin-bottom: 50px; }
  1088. .invoice-sidebar-row {
  1089. margin: 0 20px; }
  1090. .invoice-sidebar-rows {
  1091. display: -webkit-flex;
  1092. display: -ms-flexbox;
  1093. display: flex;
  1094. -webkit-justify-content: center;
  1095. -ms-flex-pack: center;
  1096. justify-content: center; } }
  1097.  
  1098. .contact-title {
  1099. background-color: #a73232;
  1100. width: 300px;
  1101. color: #FFF;
  1102. font-size: 24px;
  1103. padding: 10px; }
  1104. .contact-title i {
  1105. margin: 0 10px; }
  1106.  
  1107. .contact-item {
  1108. font-size: 20px;
  1109. margin: 25px 0 25px 100px; }
  1110. .contact-item a {
  1111. color: #000; }
  1112. .contact-item a:hover {
  1113. text-decoration: underline; }
  1114.  
  1115. .contact-list {
  1116. list-style: circle; }
  1117. .contact-list li {
  1118. margin-left: 35px; }
  1119.  
  1120. .cf-header {
  1121. border-bottom: solid 1px #e0e0e0;
  1122. text-align: center;
  1123. margin-bottom: 50px;
  1124. background: #FFF;
  1125. padding-top: 10px; }
  1126.  
  1127. .cf-block {
  1128. background: #FFF;
  1129. padding: 15px; }
  1130.  
  1131. .cf-info {
  1132. display: block;
  1133. margin-top: 10px;
  1134. font-style: italic; }
  1135.  
  1136. .footer.cf-footer {
  1137. color: #555;
  1138. background: transparent;
  1139. border-top: solid 1px #e0e0e0; }
  1140. .footer.cf-footer h3 {
  1141. color: #555; }
  1142. .footer.cf-footer hr {
  1143. border-color: #555; }
  1144. .footer.cf-footer .footer-left {
  1145. border-color: #555; }
  1146.  
  1147. .cf-stats {
  1148. text-align: center; }
  1149. .cf-stats .value {
  1150. font-size: 28px; }
  1151.  
  1152. .cf-bigbtn {
  1153. display: inline-block;
  1154. background: #e0e0e0;
  1155. transition: all 0.2s ease;
  1156. text-align: center;
  1157. width: 300px;
  1158. padding: 20px;
  1159. margin-bottom: 5px; }
  1160. .cf-bigbtn img {
  1161. height: 50px; }
  1162. .cf-bigbtn:hover {
  1163. background: #555; }
  1164.  
  1165. .cf-progress {
  1166. display: block;
  1167. /* default: inline-block */
  1168. width: 300px;
  1169. margin: 1em auto;
  1170. padding: 4px;
  1171. border: 0 none;
  1172. background: #444;
  1173. border-radius: 14px;
  1174. box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2); }
  1175.  
  1176. .cf-progress::-moz-progress-bar {
  1177. background: #FFF;
  1178. border-radius: 12px; }
  1179.  
  1180. @media screen and (-webkit-min-device-pixel-ratio: 0) {
  1181. .cf-progress {
  1182. height: 25px;
  1183. /* légèrement plus fin sur Chrome par défaut */ } }
  1184.  
  1185. .cf-progress::-webkit-progress-bar {
  1186. background: transparent; }
  1187.  
  1188. .cf-progress::-webkit-progress-value {
  1189. background: #FFF;
  1190. border-radius: 12px; }
  1191.  
  1192. .sm-multicraft {
  1193. /* Background Colors */
  1194. /* Chrome */
  1195. /* Foreground Colors */
  1196. /* IE10 */
  1197. /* Firefox */
  1198. /* Chrome */
  1199. /* Polyfill */ }
  1200. .sm-multicraft .status-btn {
  1201. display: block;
  1202. float: left;
  1203. background: #FFF;
  1204. width: 30%;
  1205. height: 86px;
  1206. color: #000;
  1207. text-align: center;
  1208. line-height: 86px;
  1209. font-size: 30px;
  1210. transition: font-size 0.1s linear; }
  1211. .sm-multicraft .status-btn:hover {
  1212. font-size: 40px; }
  1213. .sm-multicraft .status-info {
  1214. float: left;
  1215. background: #D02020;
  1216. color: #FFF;
  1217. text-align: right;
  1218. width: 70%; }
  1219. .sm-multicraft .status-info.online {
  1220. background: #35D020; }
  1221. .sm-multicraft .status-status {
  1222. font-size: 24px;
  1223. padding: 5px 10px; }
  1224. .sm-multicraft .status-players {
  1225. color: #EEE;
  1226. text-transform: uppercase;
  1227. font-size: 18px;
  1228. background: rgba(0, 0, 0, 0.35);
  1229. padding: 5px 10px; }
  1230. .sm-multicraft .box {
  1231. background: #fff;
  1232. border-radius: 5px;
  1233. padding: 10px 15px;
  1234. float: left;
  1235. margin-right: 15px; }
  1236. .sm-multicraft .box:last-child {
  1237. margin: 0; }
  1238. .sm-multicraft .box-item {
  1239. float: left;
  1240. padding-right: 5px;
  1241. margin-right: 5px;
  1242. border-right: solid 1px #EEE; }
  1243. .sm-multicraft .box-item:last-child {
  1244. margin-right: 0;
  1245. padding-right: 0;
  1246. border-right: none; }
  1247. .sm-multicraft .box-title {
  1248. text-transform: uppercase;
  1249. font-size: 18px;
  1250. font-weight: bold; }
  1251. .sm-multicraft .box-label {
  1252. font-size: 13px;
  1253. text-transform: uppercase;
  1254. font-weight: bold; }
  1255. .sm-multicraft .box-value {
  1256. margin-left: 10px; }
  1257. .sm-multicraft .resources-block {
  1258. margin-bottom: 4px; }
  1259. .sm-multicraft .resources-block:last-child {
  1260. margin-bottom: 0; }
  1261. .sm-multicraft .resources-label {
  1262. margin-bottom: -8px; }
  1263. .sm-multicraft .resources-progress, .sm-multicraft .resources-progress[role][aria-valuenow] {
  1264. /* Polyfill */
  1265. background: #e0e0e0 !important;
  1266. /* !important is needed by the polyfill */ }
  1267. .sm-multicraft .resources-progress::-webkit-progress-bar {
  1268. background: #e0e0e0; }
  1269. .sm-multicraft .resources-progress {
  1270. color: #555; }
  1271. .sm-multicraft .resources-progress::-moz-progress-bar {
  1272. background: #555; }
  1273. .sm-multicraft .resources-progress::-webkit-progress-value {
  1274. background: #555; }
  1275. .sm-multicraft .resources-progress[aria-valuenow]:before {
  1276. background: #555; }
  1277.  
  1278. .sm-solusvm .info-block {
  1279. padding: 15px 15px;
  1280. border-radius: 3px;
  1281. background-color: #fff;
  1282. box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2);
  1283. width: 100%; }
  1284.  
  1285. .sm-solusvm .info-status {
  1286. font-weight: normal; }
  1287.  
  1288. .sm-solusvm .info-row {
  1289. font-size: 24px;
  1290. margin: 15px 0 15px 20px; }
  1291.  
  1292. .sm-solusvm .resources-block .resource-row {
  1293. margin-bottom: 15px; }
  1294. .sm-solusvm .resources-block .resource-row:last-child {
  1295. margin: 0; }
  1296.  
  1297. .sm-solusvm .resources-block progress {
  1298. background-color: #f3f3f3;
  1299. border: 0;
  1300. width: 85%;
  1301. height: 18px;
  1302. border-radius: 9px; }
  1303.  
  1304. .sm-solusvm .resources-block progress::-webkit-progress-bar {
  1305. background-color: #f3f3f3;
  1306. border-radius: 9px; }
  1307.  
  1308. .sm-solusvm .resources-block progress::-webkit-progress-value {
  1309. background: #cdeb8e;
  1310. background: linear-gradient(to bottom, #cdeb8e 0%, #a5c956 100%);
  1311. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cdeb8e', endColorstr='#a5c956', GradientType=0);
  1312. border-radius: 9px; }
  1313.  
  1314. .sm-solusvm .resources-block progress::-moz-progress-bar {
  1315. background: #cdeb8e;
  1316. background: linear-gradient(to bottom, #cdeb8e 0%, #a5c956 100%);
  1317. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cdeb8e', endColorstr='#a5c956', GradientType=0);
  1318. border-radius: 9px; }
  1319.  
  1320. .sm-solusvm .resources-block .progress-value {
  1321. padding: 0px 5px;
  1322. line-height: 20px;
  1323. margin-left: 5px;
  1324. font-size: .8em;
  1325. color: #555;
  1326. height: 18px;
  1327. float: right; }
  1328.  
  1329. .sm-cpanel .item {
  1330. font-size: 21px; }
  1331.  
  1332. *, *:after, *:before {
  1333. box-sizing: border-box; }
  1334.  
  1335. html {
  1336. min-height: 100%;
  1337. position: relative; }
  1338.  
  1339. body {
  1340. padding: 0 0 182px !important; }
  1341.  
  1342. .box-register {
  1343. padding: 40px 60px;
  1344. background-color: #525962;
  1345. height: 300px; }
  1346.  
  1347. .footer {
  1348. background-color: #272727;
  1349. padding: 30px 0px;
  1350. color: #f2f2f2;
  1351. position: absolute;
  1352. left: 0;
  1353. bottom: 0;
  1354. height: 132px;
  1355. width: 100%; }
  1356.  
  1357. .footer-left {
  1358. text-align: right;
  1359. width: 50%;
  1360. padding-right: 30px;
  1361. border-right: 2px solid #f2f2f2;
  1362. display: inline-block; }
  1363. .footer-left .copyright {
  1364. font-weight: 300; }
  1365. .footer-left a {
  1366. color: #a73232; }
  1367. .footer-left a:hover {
  1368. color: #a73232;
  1369. text-decoration: underline; }
  1370.  
  1371. @media only screen and (max-width: 640px) {
  1372. .footer-left {
  1373. width: 100%;
  1374. border-right: none;
  1375. text-align: center;
  1376. padding: 0; }
  1377. .footer-left hr {
  1378. display: none; } }
  1379.  
  1380. .footer-right {
  1381. width: 50%;
  1382. padding-left: 30px;
  1383. display: inline-block; }
  1384.  
  1385. .footer-left hr {
  1386. margin: 5px 2px 5px auto;
  1387. border: 0;
  1388. border-top: 2px solid #EEE;
  1389. width: 110px; }
  1390.  
  1391. .home-animation {
  1392. position: absolute;
  1393. top: 120px;
  1394. right: 0; }
  1395. .home-animation img {
  1396. position: absolute; }
  1397.  
  1398. .home-boxes {
  1399. padding: 30px; }
  1400.  
  1401. .home-boxes img {
  1402. width: 100%;
  1403. display: block; }
  1404.  
  1405. .home-boxes iframe {
  1406. width: 100%; }
  1407.  
  1408. .feature-box {
  1409. position: relative;
  1410. padding: 15px 15px 15px 95px;
  1411. background-color: #F7F7F7;
  1412. border-radius: 5px;
  1413. width: 100%;
  1414. margin: 10px 0;
  1415. text-align: left;
  1416. color: #000;
  1417. font-size: 14px; }
  1418. .feature-box p {
  1419. margin: 5px 0 0; }
  1420. .feature-box a {
  1421. color: #a73232; }
  1422. .feature-box a:hover {
  1423. color: #a73232;
  1424. text-decoration: underline; }
  1425.  
  1426. .feature-box.left {
  1427. border-radius: 5px 0 0 5px;
  1428. float: right;
  1429. border-right: 6px solid #a73232; }
  1430.  
  1431. .feature-box.right {
  1432. border-radius: 0 5px 5px 0;
  1433. border-left: 6px solid #a73232; }
  1434.  
  1435. .feature-icon {
  1436. position: absolute;
  1437. left: 20px;
  1438. top: calc(50% - 25px);
  1439. text-align: center;
  1440. width: 50px;
  1441. font-size: 50px;
  1442. line-height: 50px;
  1443. color: #313131; }
  1444.  
  1445. .home-animation-webpage {
  1446. -webkit-animation: webpage 1s 3s ease forwards;
  1447. animation: webpage 1s 3s ease forwards;
  1448. right: 32px;
  1449. top: -100px;
  1450. box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  1451. width: 200px;
  1452. opacity: 0; }
  1453.  
  1454. .home-animation-icon {
  1455. opacity: 0;
  1456. -webkit-animation: icon 0.5s ease forwards;
  1457. animation: icon 0.5s ease forwards;
  1458. width: 50px; }
  1459. .home-animation-icon.terminal {
  1460. right: -105px;
  1461. -webkit-animation-delay: 3.6s;
  1462. animation-delay: 3.6s; }
  1463. .home-animation-icon.minecraft {
  1464. top: -90px;
  1465. -webkit-animation-delay: 3.2s;
  1466. animation-delay: 3.2s; }
  1467. .home-animation-icon.activity-monitor {
  1468. top: -90px;
  1469. right: 275px;
  1470. -webkit-animation-delay: 3.8s;
  1471. animation-delay: 3.8s; }
  1472. .home-animation-icon.owncloud {
  1473. top: 110px;
  1474. -webkit-animation-delay: 3.4s;
  1475. animation-delay: 3.4s; }
  1476.  
  1477. @-webkit-keyframes webpage {
  1478. from {
  1479. opacity: 0;
  1480. -webkit-transform: scale(0.5);
  1481. transform: scale(0.5); }
  1482. to {
  1483. opacity: 1;
  1484. -webkit-transform: scale(1);
  1485. transform: scale(1); } }
  1486.  
  1487. @keyframes webpage {
  1488. from {
  1489. opacity: 0;
  1490. -webkit-transform: scale(0.5);
  1491. transform: scale(0.5); }
  1492. to {
  1493. opacity: 1;
  1494. -webkit-transform: scale(1);
  1495. transform: scale(1); } }
  1496.  
  1497. @-webkit-keyframes icon {
  1498. 0% {
  1499. right: 0;
  1500. top: 0; }
  1501. 40% {
  1502. opacity: 0;
  1503. -webkit-transform: scale(1);
  1504. transform: scale(1); }
  1505. 60% {
  1506. -webkit-transform: scale(0.8);
  1507. transform: scale(0.8); }
  1508. 100% {
  1509. opacity: 1;
  1510. -webkit-transform: scale(1);
  1511. transform: scale(1); } }
  1512.  
  1513. @keyframes icon {
  1514. 0% {
  1515. right: 0;
  1516. top: 0; }
  1517. 40% {
  1518. opacity: 0;
  1519. -webkit-transform: scale(1);
  1520. transform: scale(1); }
  1521. 60% {
  1522. -webkit-transform: scale(0.8);
  1523. transform: scale(0.8); }
  1524. 100% {
  1525. opacity: 1;
  1526. -webkit-transform: scale(1);
  1527. transform: scale(1); } }
  1528.  
  1529. .home-animation-server {
  1530. width: 350px;
  1531. top: 0;
  1532. right: 0; }
  1533.  
  1534. .home-animation-loader {
  1535. -webkit-animation: loader 3s 0.5s linear forwards;
  1536. animation: loader 3s 0.5s linear forwards;
  1537. top: -75px;
  1538. right: 150px;
  1539. width: 150px;
  1540. opacity: 0; }
  1541.  
  1542. @-webkit-keyframes loader {
  1543. 0% {
  1544. opacity: 0;
  1545. top: -50px;
  1546. -webkit-transform: rotate(0deg);
  1547. transform: rotate(0deg); }
  1548. 25%, 95% {
  1549. top: -75px;
  1550. opacity: 1; }
  1551. 100% {
  1552. top: -50px;
  1553. opacity: 0;
  1554. -webkit-transform: rotate(500deg);
  1555. transform: rotate(500deg); } }
  1556.  
  1557. @keyframes loader {
  1558. 0% {
  1559. opacity: 0;
  1560. top: -50px;
  1561. -webkit-transform: rotate(0deg);
  1562. transform: rotate(0deg); }
  1563. 25%, 95% {
  1564. top: -75px;
  1565. opacity: 1; }
  1566. 100% {
  1567. top: -50px;
  1568. opacity: 0;
  1569. -webkit-transform: rotate(500deg);
  1570. transform: rotate(500deg); } }
  1571.  
  1572. .tweet-box {
  1573. border-radius: 0 0 5px 5px;
  1574. overflow: hidden;
  1575. border-bottom: solid 3px #32b9e7; }
  1576.  
  1577. .tweet-box-header {
  1578. background: #a73232;
  1579. color: #FFF;
  1580. padding: 5px 10px;
  1581. font-weight: 600; }
  1582.  
  1583. .tweet-box-content {
  1584. background: #FFF;
  1585. padding: 15px;
  1586. font-size: 13px; }
  1587. .tweet-box-content a {
  1588. color: #000; }
  1589.  
  1590. @media only screen and (max-width: 640px) {
  1591. .tweet-box {
  1592. margin-bottom: 15px; } }
  1593.  
  1594. .section-tweets {
  1595. margin-top: 20px;
  1596. text-align: center; }
  1597. .section-tweets h1 {
  1598. margin-bottom: 15px; }
  1599.  
  1600. .support-menu-item {
  1601. display: block;
  1602. background: #fafafa;
  1603. color: #555;
  1604. font-size: 24px;
  1605. padding: 5px 15px;
  1606. box-shadow: 0 0 0 1px #e0e0e0;
  1607. margin-bottom: 15px;
  1608. border-bottom: solid 2px #555; }
  1609.  
  1610. .support-menu-item.active {
  1611. background: #a73232;
  1612. color: #FFF;
  1613. border-color: #a73232; }
  1614. .support-menu-item.active:hover {
  1615. background: #a73232; }
  1616.  
  1617. .support-menu-item:hover {
  1618. background: #555;
  1619. color: #FFF; }
  1620.  
  1621. .faq-box {
  1622. border: solid 1px #e0e0e0;
  1623. margin-bottom: 20px; }
  1624.  
  1625. .faq-box-header {
  1626. font-size: 26px;
  1627. border-bottom: solid 2px #555;
  1628. background: #FFF;
  1629. padding: 2px 10px 0; }
  1630.  
  1631. .faq-box-list {
  1632. list-style: square inside url("http://www.free.fr/assistance/img/liste-menu.png");
  1633. background: #e0e0e0;
  1634. padding: 6px 5px 8px 12px; }
  1635. .faq-box-list a {
  1636. color: #555; }
  1637.  
  1638. .breadcrumb {
  1639. background: #e0e0e0;
  1640. height: 50px;
  1641. margin-bottom: 25px;
  1642. margin-top: -25px;
  1643. overflow: hidden;
  1644. border: solid 1px #e0e0e0; }
  1645.  
  1646. .breadcrumb-item {
  1647. background: #fafafa;
  1648. color: #555;
  1649. height: 100%;
  1650. display: block;
  1651. float: left;
  1652. margin-right: 3px;
  1653. padding: 15px 15px 15px 40px;
  1654. font-size: 16px;
  1655. line-height: 20px;
  1656. position: relative; }
  1657. .breadcrumb-item i {
  1658. font-size: 32px;
  1659. top: -6px;
  1660. position: relative; }
  1661. .breadcrumb-item.active {
  1662. font-weight: 600; }
  1663.  
  1664. .breadcrumb-item:hover {
  1665. background: whitesmoke; }
  1666.  
  1667. .breadcrumb-item:first-child {
  1668. padding: 15px 15px 15px 15px; }
  1669.  
  1670. .breadcrumb-item:first-child:before {
  1671. display: none; }
  1672.  
  1673. .breadcrumb-item:before {
  1674. content: "";
  1675. border-top: 25px solid transparent;
  1676. border-bottom: 24px solid transparent;
  1677. border-left: 25px solid #e0e0e0;
  1678. position: absolute;
  1679. left: 0;
  1680. top: 0; }
  1681.  
  1682. .breadcrumb-item:after {
  1683. content: "";
  1684. border-top: 25px solid transparent;
  1685. border-bottom: 24px solid transparent;
  1686. border-left: 25px solid #fafafa;
  1687. position: absolute;
  1688. right: -25px;
  1689. top: 0;
  1690. z-index: 1; }
  1691.  
  1692. .breadcrumb-item:hover:after {
  1693. border-left-color: whitesmoke; }
  1694.  
  1695. .credit-intro {
  1696. margin: 50px 0; }
  1697.  
  1698. .credit-intro-btn {
  1699. display: block;
  1700. background: #555;
  1701. text-align: center;
  1702. padding: 25px;
  1703. transition: all 0.2s ease;
  1704. color: #fafafa; }
  1705.  
  1706. .credit-logo {
  1707. height: 62px;
  1708. display: -webkit-flex;
  1709. display: -ms-flexbox;
  1710. display: flex;
  1711. -webkit-align-items: center;
  1712. -ms-flex-align: center;
  1713. align-items: center;
  1714. -webkit-justify-content: center;
  1715. -ms-flex-pack: center;
  1716. justify-content: center;
  1717. padding-bottom: 10px; }
  1718. .credit-logo img {
  1719. max-width: 100%;
  1720. max-height: 100%; }
  1721.  
  1722. .support-intro-btn {
  1723. display: block;
  1724. background: #555;
  1725. text-align: center;
  1726. width: 100%;
  1727. max-width: 400px;
  1728. padding: 5px;
  1729. margin: 0 auto;
  1730. transition: all 0.2s ease;
  1731. color: #fafafa; }
  1732.  
  1733. .credit-intro-btn:hover, .support-intro-btn:hover {
  1734. background: #a73232;
  1735. color: #FFF; }
  1736.  
  1737. .support-intro-btn i {
  1738. font-size: 110px;
  1739. margin-top: 10px; }
  1740.  
  1741. .support-intro-btn p {
  1742. color: #fafafa; }
  1743.  
  1744. .support-intro-btn h1 {
  1745. color: #FFF;
  1746. font-size: 36px; }
  1747.  
  1748. .support-intro {
  1749. margin-bottom: 50px; }
  1750.  
  1751. .login-form {
  1752. float: left;
  1753. height: 100%;
  1754. background: #fafafa;
  1755. width: calc(80% - 25px);
  1756. margin-right: 25px;
  1757. border: solid 1px #e0e0e0;
  1758. text-align: center;
  1759. padding: 15px; }
  1760.  
  1761. .login-sidebar {
  1762. float: right;
  1763. height: 100%;
  1764. width: 20%; }
  1765.  
  1766. .login-box {
  1767. height: 400px;
  1768. margin-bottom: 30px; }
  1769.  
  1770. .login-sidebar-item {
  1771. display: -webkit-flex;
  1772. display: -ms-flexbox;
  1773. display: flex;
  1774. -webkit-align-items: center;
  1775. -ms-flex-align: center;
  1776. align-items: center;
  1777. -webkit-justify-content: center;
  1778. -ms-flex-pack: center;
  1779. justify-content: center;
  1780. height: 33.33%;
  1781. background: #555;
  1782. color: #fafafa;
  1783. border-bottom: solid 1px #626262;
  1784. transition: all 0.2s ease;
  1785. text-align: center; }
  1786. .login-sidebar-item:hover {
  1787. color: #FFF;
  1788. background: #a73232; }
  1789. .login-sidebar-item:last-child {
  1790. border-bottom: none; }
  1791. .login-sidebar-item i {
  1792. display: block;
  1793. font-size: 62px; }
  1794.  
  1795. @media only screen and (max-width: 640px) {
  1796. .login-form, .login-sidebar {
  1797. float: none; }
  1798. .login-box {
  1799. height: auto; }
  1800. .login-form {
  1801. width: 100%; }
  1802. .login-sidebar {
  1803. margin-top: 50px;
  1804. width: 100%; } }
  1805.  
  1806. .login-form-content {
  1807. margin: 50px 0; }
  1808.  
  1809. .chat-conversation {
  1810. background: #e0e0e0;
  1811. height: 500px;
  1812. padding: 15px;
  1813. overflow-y: scroll; }
  1814.  
  1815. .chat-box {
  1816. border: solid 1px #e0e0e0; }
  1817.  
  1818. .chat-input {
  1819. background: #FFF; }
  1820. .chat-input input[type="text"] {
  1821. border: none;
  1822. box-shadow: none;
  1823. width: calc(100% - 60px);
  1824. height: 50px; }
  1825.  
  1826. .chat-message {
  1827. margin-bottom: 15px; }
  1828.  
  1829. .chat-message-text {
  1830. background: #555;
  1831. color: #FFF;
  1832. width: 70%;
  1833. border-radius: 2px;
  1834. border-top-left-radius: 0;
  1835. margin: 0 10px;
  1836. position: relative;
  1837. float: left; }
  1838. .chat-message-text:before {
  1839. content: "";
  1840. position: absolute;
  1841. top: 0;
  1842. left: -9px;
  1843. width: 0;
  1844. height: 0;
  1845. border-style: solid;
  1846. border-width: 0 10px 10px 0;
  1847. border-color: transparent #414141 transparent transparent; }
  1848.  
  1849. .chat-message.ni .chat-message-text {
  1850. background: #a73232;
  1851. border-color: transparent #a73232 transparent transparent;
  1852. float: right;
  1853. border-radius: 2px;
  1854. border-top-right-radius: 0; }
  1855. .chat-message.ni .chat-message-text:before {
  1856. left: auto;
  1857. right: -9px;
  1858. border-width: 10px 10px 0 0;
  1859. border-color: #882929 transparent transparent transparent; }
  1860.  
  1861. .chat-message-header {
  1862. padding: 5px 10px;
  1863. font-size: 13px;
  1864. color: #e0e0e0;
  1865. background: rgba(0, 0, 0, 0.2); }
  1866.  
  1867. .chat-message-body {
  1868. padding: 5px 10px; }
  1869.  
  1870. .chat-input-button {
  1871. background: #272727;
  1872. border: none;
  1873. border-radius: 100%;
  1874. outline: none;
  1875. font-size: 24px;
  1876. height: 40px;
  1877. width: 40px;
  1878. text-align: center;
  1879. color: #FFF;
  1880. position: relative;
  1881. top: 3px;
  1882. margin-left: 5px; }
  1883. .chat-input-button:hover {
  1884. background: #a73232; }
  1885.  
  1886. .plan {
  1887. border: solid 1px #e0e0e0;
  1888. background: #fafafa;
  1889. width: 215px;
  1890. text-align: center;
  1891. margin: 0 5px; }
  1892.  
  1893. .plan-block {
  1894. width: 100%; }
  1895.  
  1896. .plan-price {
  1897. font-size: 24px;
  1898. background: #555;
  1899. color: #e0e0e0;
  1900. font-weight: 300;
  1901. margin-bottom: 15px; }
  1902.  
  1903. .plan-price .amount {
  1904. font-size: 40px;
  1905. color: #FFF;
  1906. font-weight: 600; }
  1907.  
  1908. .plan-price .currency {
  1909. font-size: 30px; }
  1910.  
  1911. .plan-name {
  1912. font-weight: 600;
  1913. font-size: 28px;
  1914. padding: 20px 0; }
  1915.  
  1916. .plan-features {
  1917. text-align: left;
  1918. padding: 0 20px;
  1919. margin-bottom: 15px; }
  1920. .plan-features li {
  1921. margin: 5px 0; }
  1922. .plan-features li span {
  1923. font-size: 22px;
  1924. font-weight: 600; }
  1925.  
  1926. .plans-table {
  1927. display: -webkit-flex;
  1928. display: -ms-flexbox;
  1929. display: flex;
  1930. -webkit-justify-content: center;
  1931. -ms-flex-pack: center;
  1932. justify-content: center;
  1933. -webkit-align-items: flex-start;
  1934. -ms-flex-align: start;
  1935. align-items: flex-start;
  1936. padding-top: 15px; }
  1937.  
  1938. @media only screen and (max-width: 640px) {
  1939. .plans-table {
  1940. display: block; }
  1941. .plan {
  1942. width: 100%;
  1943. margin: 0 0 10px; }
  1944. .plan.plan-popular {
  1945. position: initial;
  1946. width: 100%; } }
  1947.  
  1948. .plan-popular {
  1949. position: relative;
  1950. top: -20px;
  1951. width: 245px;
  1952. border-width: 3px; }
  1953. .plan-popular .plan-btn {
  1954. border-color: #a73232;
  1955. color: #a73232; }
  1956. .plan-popular .plan-btn:hover {
  1957. background: #a73232;
  1958. color: #FFF;
  1959. border-color: #a73232; }
  1960. .plan-popular .plan-name {
  1961. font-size: 36px; }
  1962. .plan-popular .plan-price .amount {
  1963. font-size: 50px; }
  1964.  
  1965. .plan-btn {
  1966. margin-bottom: 20px;
  1967. width: 80%; }
  1968. .plan-btn:hover {
  1969. border-color: #a73232;
  1970. color: #a73232; }
  1971.  
  1972. .plans-pricing {
  1973. margin-bottom: 50px;
  1974. text-align: center; }
  1975. .plans-pricing .row {
  1976. display: inline-block; }
  1977. .plans-pricing .switch {
  1978. float: left;
  1979. margin: 0 10px; }
  1980. .plans-pricing .text {
  1981. float: left;
  1982. height: 30px;
  1983. line-height: 30px; }
  1984.  
  1985. .plans-list:hover .plan {
  1986. opacity: .7; }
  1987.  
  1988. .plans-list .plan {
  1989. width: 100%;
  1990. margin-bottom: 10px;
  1991. display: -webkit-flex;
  1992. display: -ms-flexbox;
  1993. display: flex;
  1994. height: 65px;
  1995. transition: opacity 0.2s ease; }
  1996. .plans-list .plan:hover {
  1997. opacity: 1; }
  1998. .plans-list .plan:hover .plan-price {
  1999. background: #a73232; }
  2000.  
  2001. .plans-list .plan-name, .plans-list .plan-price, .plans-list .plan-features {
  2002. padding: 0 20px;
  2003. height: 100%;
  2004. line-height: 65px;
  2005. margin: 0; }
  2006.  
  2007. .plans-list .plan-price {
  2008. width: 250px;
  2009. transition: background 0.2s ease; }
  2010.  
  2011. .plans-list .plan-name {
  2012. width: 190px; }
  2013.  
  2014. .plans-list .plan-features {
  2015. width: 510px;
  2016. padding: 0 0 0 5px;
  2017. margin: 0; }
  2018. .plans-list .plan-features li {
  2019. padding: 0 0 0 10px;
  2020. display: block;
  2021. float: left;
  2022. margin: 0;
  2023. height: 100%;
  2024. text-align: center; }
  2025.  
  2026. .plans-list .plan-popular {
  2027. position: static;
  2028. border-width: 3px;
  2029. height: 69px !important; }
  2030.  
  2031. .plans-list .plan-btn {
  2032. margin: 15px;
  2033. width: initial; }
  2034.  
  2035. .plans-footer {
  2036. text-align: center;
  2037. padding: 50px 0; }
  2038.  
  2039. .plan-images {
  2040. padding-top: 10px; }
  2041. .plan-images li {
  2042. float: left;
  2043. width: 250px;
  2044. margin-bottom: 10px;
  2045. border: solid 5px #555;
  2046. transition: border-color 0.2s ease;
  2047. border-radius: 5px; }
  2048. .plan-images li:hover {
  2049. border-color: #a73232; }
  2050. .plan-images li:nth-child(2n-1) {
  2051. margin-right: 10px; }
  2052. .plan-images li img {
  2053. width: 100%;
  2054. float: left; }
  2055.  
  2056. .register-form {
  2057. background: #fafafa;
  2058. border: solid 1px #e0e0e0;
  2059. text-align: center;
  2060. padding: 15px;
  2061. margin-bottom: 25px; }
  2062.  
  2063. .register-form-content {
  2064. margin: 25px 0; }
  2065.  
  2066. .register-switch {
  2067. margin: 50px 0 25px;
  2068. text-align: center; }
  2069. .register-switch .row {
  2070. display: inline-block; }
  2071. .register-switch .switch {
  2072. float: left;
  2073. margin: 0 10px; }
  2074. .register-switch .text {
  2075. float: left;
  2076. height: 30px;
  2077. line-height: 30px; }
  2078.  
  2079. .capatcha {
  2080. text-align: center; }
  2081.  
  2082. .g-recaptcha {
  2083. display: inline-block; }
  2084.  
  2085. .section-client {
  2086. background: #313131;
  2087. color: #FFF;
  2088. padding: 25px 0; }
  2089.  
  2090. .client-menu-item {
  2091. display: block;
  2092. background: #555;
  2093. color: #fff;
  2094. font-size: 24px;
  2095. padding: 5px 15px;
  2096. margin-bottom: 15px; }
  2097. .client-menu-item:last-child {
  2098. margin: 0; }
  2099.  
  2100. .client-menu-item:hover {
  2101. background: #fafafa;
  2102. color: #555; }
  2103.  
  2104. .client-hello {
  2105. font-size: 28px; }
  2106.  
  2107. .client-email {
  2108. font-style: italic;
  2109. font-size: 18px;
  2110. color: #fafafa; }
  2111.  
  2112. .client-balance {
  2113. margin-top: 50px;
  2114. font-size: 22px; }
  2115.  
  2116. .notifications {
  2117. margin-top: 50px; }
  2118.  
  2119. .notification {
  2120. border-left: solid 6px #a73232;
  2121. background: #555;
  2122. height: 70px;
  2123. overflow: hidden;
  2124. margin: 5px 0; }
  2125.  
  2126. .notification-icon {
  2127. float: left;
  2128. height: 100%;
  2129. font-size: 40px;
  2130. line-height: 70px;
  2131. color: #fff;
  2132. width: 70px;
  2133. text-align: center; }
  2134.  
  2135. .notification-content {
  2136. padding: 5px 0;
  2137. float: left;
  2138. height: 100%;
  2139. width: calc(100% - (250px + 70px)); }
  2140.  
  2141. .notification-title {
  2142. color: #fff;
  2143. font-size: 18px;
  2144. line-height: 23px;
  2145. font-weight: bold; }
  2146.  
  2147. .notification-detail {
  2148. color: #fafafa;
  2149. font-size: 14px;
  2150. line-height: 18px; }
  2151.  
  2152. .notification-buttons {
  2153. float: right;
  2154. height: 100%;
  2155. color: #e0e0e0;
  2156. transition: all 0.3s ease;
  2157. line-height: 70px;
  2158. padding: 0 15px; }
  2159. .notification-buttons .btn:not(.force) {
  2160. border-color: #555; }
  2161. .notification-buttons:hover {
  2162. background: #a73232;
  2163. color: #fff; }
  2164. .notification-buttons:hover .btn {
  2165. border-color: initial; }
  2166.  
  2167. .client-header {
  2168. text-align: center; }
  2169. .client-header .title {
  2170. margin-bottom: 2rem; }
  2171.  
  2172. .client-boxes {
  2173. margin-top: 50px; }
  2174.  
  2175. .client-box-header {
  2176. text-align: center;
  2177. border-bottom: solid 2px #555;
  2178. background: #e0e0e0; }
  2179.  
  2180. .client-box-content {
  2181. background: #fff;
  2182. border: solid 1px #e0e0e0;
  2183. border-top: none; }
  2184.  
  2185. div.cs-select {
  2186. display: inline-block;
  2187. vertical-align: middle;
  2188. position: relative;
  2189. text-align: left;
  2190. z-index: 0;
  2191. -webkit-touch-callout: none;
  2192. -webkit-user-select: none;
  2193. -khtml-user-select: none;
  2194. -moz-user-select: none;
  2195. -ms-user-select: none;
  2196. user-select: none; }
  2197.  
  2198. div.cs-select:focus {
  2199. outline: none; }
  2200.  
  2201. .cs-select select {
  2202. display: none; }
  2203.  
  2204. .cs-select span {
  2205. display: block;
  2206. position: relative;
  2207. cursor: pointer;
  2208. white-space: nowrap;
  2209. overflow: hidden;
  2210. text-overflow: ellipsis;
  2211. padding-left: 1em;
  2212. padding-right: 2em; }
  2213.  
  2214. .cs-select > span::after,
  2215. .cs-select .cs-selected span::after {
  2216. speak: none;
  2217. position: absolute;
  2218. top: 50%;
  2219. -webkit-transform: translateY(-50%);
  2220. transform: translateY(-50%);
  2221. -webkit-font-smoothing: antialiased;
  2222. -moz-osx-font-smoothing: grayscale; }
  2223.  
  2224. .cs-select.cs-active > span::after {
  2225. -webkit-transform: translateY(-50%) rotate(180deg);
  2226. transform: translateY(-50%) rotate(180deg); }
  2227.  
  2228. div.cs-active {
  2229. z-index: 200; }
  2230.  
  2231. /* Options */
  2232. .cs-select .cs-options {
  2233. position: absolute;
  2234. overflow: hidden;
  2235. width: 100%;
  2236. background: #fff;
  2237. visibility: hidden; }
  2238.  
  2239. .cs-select.cs-active .cs-options {
  2240. visibility: visible; }
  2241.  
  2242. div.cs-skin-slide {
  2243. color: #fff;
  2244. font-size: 1.5em;
  2245. width: 150px; }
  2246.  
  2247. @media screen and (max-width: 30em) {
  2248. div.cs-skin-slide {
  2249. font-size: 1em;
  2250. width: 250px; } }
  2251.  
  2252. div.cs-skin-slide::before {
  2253. content: '';
  2254. background: #555;
  2255. position: absolute;
  2256. width: 100%;
  2257. height: 100%;
  2258. top: 0;
  2259. left: 0;
  2260. -webkit-backface-visibility: hidden;
  2261. backface-visibility: hidden;
  2262. transition: -webkit-transform 0.3s;
  2263. transition: transform 0.3s; }
  2264.  
  2265. .cs-skin-slide.cs-active::before {
  2266. -webkit-transform: scale3d(1, 5, 1);
  2267. transform: scale3d(1, 5, 1); }
  2268.  
  2269. .cs-skin-slide > span {
  2270. height: 50px;
  2271. line-height: 50px;
  2272. transition: text-indent 0.3s, opacity 0.3s; }
  2273.  
  2274. @media screen and (max-width: 30em) {
  2275. .cs-skin-slide > span {
  2276. height: 60px;
  2277. line-height: 28px; } }
  2278.  
  2279. .cs-skin-slide.cs-active > span {
  2280. text-indent: -290px;
  2281. opacity: 0; }
  2282.  
  2283. .cs-skin-slide > span::after,
  2284. .cs-skin-slide.cs-active > span::after {
  2285. font: normal normal normal 14px/1 FontAwesome;
  2286. right: 1em;
  2287. content: "\f0c9";
  2288. color: #e0e0e0;
  2289. font-size: 20px; }
  2290.  
  2291. .cs-skin-slide.cs-active > span::after {
  2292. -webkit-transform: translate3d(0, -50%, 0);
  2293. transform: translate3d(0, -50%, 0); }
  2294.  
  2295. .cs-skin-slide .cs-options {
  2296. background: transparent;
  2297. top: 50%;
  2298. left: 50%;
  2299. -webkit-transform: translate3d(-50%, -50%, 0);
  2300. transform: translate3d(-50%, -50%, 0); }
  2301.  
  2302. @media screen and (max-width: 30em) {
  2303. .cs-skin-slide .cs-options {
  2304. padding-top: 3em; } }
  2305.  
  2306. .cs-skin-slide .cs-options li {
  2307. opacity: 0;
  2308. -webkit-transform: translate3d(30%, 0, 0);
  2309. transform: translate3d(30%, 0, 0);
  2310. transition: -webkit-transform 0.3s, opacity 0.3s;
  2311. transition: transform 0.3s, opacity 0.3s; }
  2312.  
  2313. .cs-skin-slide.cs-active .cs-options li {
  2314. -webkit-transform: translate3d(0, 0, 0);
  2315. transform: translate3d(0, 0, 0);
  2316. opacity: 1; }
  2317.  
  2318. .cs-skin-slide.cs-active .cs-options li:first-child {
  2319. transition-delay: 0.05s; }
  2320.  
  2321. .cs-skin-slide.cs-active .cs-options li:nth-child(2) {
  2322. transition-delay: 0.1s; }
  2323.  
  2324. .cs-skin-slide.cs-active .cs-options li:nth-child(3) {
  2325. transition-delay: 0.15s; }
  2326.  
  2327. .cs-skin-slide.cs-active .cs-options li:nth-child(4) {
  2328. transition-delay: 0.2s; }
  2329.  
  2330. .cs-skin-slide.cs-active .cs-options li:nth-child(5) {
  2331. transition-delay: 0.25s; }
  2332.  
  2333. /* more options need more delay declaration */
  2334. .cs-skin-slide .cs-options li span {
  2335. font-weight: 500;
  2336. letter-spacing: 2px;
  2337. font-size: 65%;
  2338. padding: 0.8em 1em 0.8em 2.5em; }
  2339.  
  2340. .cs-skin-slide .cs-options li span:hover,
  2341. .cs-skin-slide .cs-options li.cs-focus span,
  2342. .cs-skin-slide .cs-options li.cs-selected span {
  2343. background: #a73232; }
  2344.  
  2345. .cs-skin-slide .cs-selected span::after {
  2346. content: ''; }
  2347.  
  2348. .domain-input {
  2349. font-size: 18px;
  2350. text-align: center; }
  2351.  
  2352. input.domain-input-field {
  2353. height: 50px;
  2354. border: solid 2px #e0e0e0;
  2355. line-height: 50px;
  2356. vertical-align: top;
  2357. box-shadow: none;
  2358. width: 500px; }
  2359.  
  2360. .domain-table {
  2361. width: 75%;
  2362. margin: 0 auto; }
  2363. .domain-table thead {
  2364. border-bottom: solid 2px #e0e0e0; }
  2365. .domain-table td, .domain-table th {
  2366. text-align: center; }
  2367. .domain-table td {
  2368. font-size: 22px;
  2369. padding: 10px 0; }
  2370.  
  2371. .support-article {
  2372. box-shadow: 0 0 0 1px #e0e0e0; }
  2373.  
  2374. .support-article-header {
  2375. background: #e0e0e0;
  2376. padding: 0 10px;
  2377. border-bottom: solid 2px #555; }
  2378.  
  2379. .support-article-content {
  2380. padding: 15px;
  2381. min-height: 350px; }
  2382. .support-article-content h2, .support-article-content h3, .support-article-content h4, .support-article-content h5, .support-article-content h6 {
  2383. font-weight: normal;
  2384. color: #000; }
  2385. .support-article-content h1 {
  2386. font-size: 28px;
  2387. font-weight: bold; }
  2388. .support-article-content h2 {
  2389. font-size: 26px; }
  2390. .support-article-content h3 {
  2391. font-size: 24px; }
  2392. .support-article-content h4 {
  2393. font-size: 18px; }
  2394. .support-article-content h5 {
  2395. font-size: 14px; }
  2396. .support-article-content h6 {
  2397. font-size: 12px; }
  2398. .support-article-content blockquote {
  2399. padding: 10px 20px;
  2400. margin: 0 0 20px;
  2401. font-size: 17.5px;
  2402. border-left: 5px solid #eee; }
  2403. .support-article-content pre {
  2404. display: block;
  2405. padding: 9.5px;
  2406. margin: 0 0 10px;
  2407. font-size: 13px;
  2408. line-height: 1.42857143;
  2409. color: #333;
  2410. word-break: break-all;
  2411. word-wrap: break-word;
  2412. background-color: #f5f5f5;
  2413. border: 1px solid #ccc;
  2414. border-radius: 4px;
  2415. font-family: Menlo,Monaco,Consolas,"Courier New",monospace; }
  2416. .support-article-content a {
  2417. color: #000; }
  2418. .support-article-content img {
  2419. max-width: 100%; }
  2420.  
  2421. .support-article-footer {
  2422. border-top: solid 1px #e0e0e0;
  2423. padding: 10px 0;
  2424. text-align: center; }
  2425.  
  2426. .cart-table {
  2427. width: 100%; }
  2428. .cart-table thead {
  2429. border-bottom: solid 2px #e0e0e0; }
  2430. .cart-table td, .cart-table th {
  2431. text-align: center; }
  2432. .cart-table td {
  2433. font-size: 18px;
  2434. padding: 10px 0; }
  2435. .cart-table .product-column {
  2436. width: 60%;
  2437. text-align: left; }
  2438. .cart-table .total-column {
  2439. text-align: right; }
  2440. .cart-table .row-subtotal td {
  2441. font-size: 20px;
  2442. border-top: solid 2px #e0e0e0; }
  2443. .cart-table .row-total td {
  2444. background: #e0e0e0;
  2445. font-weight: bold;
  2446. font-size: 24px; }
  2447. .cart-table .row-recurring td {
  2448. vertical-align: top;
  2449. font-size: 16px; }
  2450.  
  2451. input[type="text"].promo-code-input {
  2452. height: 34px;
  2453. border: solid 1px #e0e0e0;
  2454. box-shadow: none;
  2455. line-height: 34px;
  2456. width: 215px;
  2457. vertical-align: bottom; }
  2458.  
  2459. .cart-warning {
  2460. font-size: 14px;
  2461. margin: 15px Auto 0;
  2462. padding-left: 35px; }
  2463. .cart-warning label {
  2464. cursor: pointer; }
  2465. .cart-warning a {
  2466. color: #000; }
  2467. .cart-warning .checkbox {
  2468. float: left;
  2469. margin-left: -20px; }
  2470.  
  2471. .old-price {
  2472. text-decoration: line-through;
  2473. font-size: 15px;
  2474. color: #a73232; }
  2475.  
  2476. .active-promo-list {
  2477. margin: 15px 0 0; }
  2478.  
  2479. .product-price-switch {
  2480. margin: 10px;
  2481. text-align: left; }
  2482.  
  2483. .list-item-col {
  2484. padding: 0 20px;
  2485. height: 100%;
  2486. line-height: 65px; }
  2487. .list-item-col.primary {
  2488. color: #fff;
  2489. background: #a73232; }
  2490. .list-item-col.right {
  2491. margin-left: auto; }
  2492. .list-item-col.big {
  2493. font-size: 22px; }
  2494.  
  2495. .list-item {
  2496. background: #555;
  2497. margin-bottom: 10px;
  2498. display: -webkit-flex;
  2499. display: -ms-flexbox;
  2500. display: flex;
  2501. height: 65px;
  2502. font-size: 18px;
  2503. color: #FFF; }
  2504. .list-item.center {
  2505. -webkit-justify-content: center;
  2506. -ms-flex-pack: center;
  2507. justify-content: center; }
  2508. .list-item.light {
  2509. color: #000;
  2510. background: transparent;
  2511. border-bottom: solid 1px #e0e0e0;
  2512. margin-bottom: 0; }
  2513. .list-item.light:last-child {
  2514. border-bottom: none; }
  2515.  
  2516. .ticket-messages {
  2517. text-align: left; }
  2518.  
  2519. .app-screenshot {
  2520. width: 200px; }
  2521. .app-screenshot.little {
  2522. height: 200px;
  2523. width: initial; }
  2524.  
  2525. .app-box {
  2526. background: white;
  2527. text-align: center;
  2528. box-shadow: 0 0 1px white;
  2529. padding: 20px; }
  2530.  
  2531. .checkbox-item {
  2532. display: inline-block;
  2533. width: 200px;
  2534. text-align: left; }
  2535.  
  2536. .outsourcing-table {
  2537. width: 90%;
  2538. margin: 2em auto; }
  2539.  
  2540. .outsourcing-table thead td {
  2541. background: #fafafa;
  2542. text-align: center;
  2543. padding: 15px; }
  2544.  
  2545. .outsourcing-table tbody td {
  2546. padding: 5px;
  2547. text-align: center;
  2548. font-size: 25px; }
  2549.  
  2550. .outsourcing-table thead {
  2551. border: solid 1px #e0e0e0; }
  2552.  
  2553. /*# sourceMappingURL=app.css.map */
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement