API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jun 25th, 2018
180
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 11.49 KB | None | 0 0
raw download clone embed print report
  1. ###ЭТО ТЕСТОВЫЙ ФАЙЛ
  2. * {
  3.     box-sizing: border-box;
  4. }
  5. html, body {
  6.     background-color: #1a1f3d;
  7.     width: 100%;
  8.     height: 100%;
  9.     margin: 0;
  10.     padding: 0;
  11.     font-family: 'Rubik', sans-serif;
  12.     font-size: 100%;
  13. }
  14. a {
  15.     text-decoration: none;
  16. }
  17. button {
  18.     background-color: unset;
  19.     border: none;
  20.     border-radius: unset;
  21.     font-family: 'Rubik', sans-serif;
  22.     cursor: pointer;
  23.     outline: none;
  24. }
  25. input {
  26.     background-color: unset;
  27.     border: none;
  28.     font-family: 'Rubik', sans-serif;
  29.     outline: none;
  30. }
  31. textarea {
  32.     border: none;
  33.     font-family: 'Rubik', sans-serif;
  34.     outline: none;
  35.     resize: none;
  36. }
  37. p, ul, ol {
  38.     margin: 0;
  39. }
  40. select {
  41.     -moz-appearance: none;
  42.     -webkit-appearance: none;
  43.     appearance: none;
  44.     outline: none;
  45.     border: none;
  46.     border-radius: 0;
  47. }
  48. .wrapper {
  49.     width: 100%;
  50.     height: 100%;
  51.     margin: 0;
  52.     padding: 0;
  53. }
  54. .w-div {
  55.     background-color: #1d223d;
  56.     padding: 4rem;
  57.     box-shadow: 0px 6px 6px #181c33;
  58. }
  59. .w-button {
  60.     background-color: #8e24aa;
  61.     border: 1px solid #8e24aa;
  62.     padding: 1.2rem 2.4rem;
  63.     color: #ffffff;
  64.     font-size: 1rem;
  65.     font-weight: 400;
  66.     letter-spacing: 0.12rem;
  67.     transition: 0.4s;
  68.     box-shadow: 0 10px 60px rgba(142, 36, 170, 0.6);
  69. }
  70. .w-button-w {
  71.     background-color: unset;
  72.     border: 1px solid #ffffff;
  73.     box-shadow: unset;
  74. }
  75. .w-button:hover {
  76.     background-color: #ffffff;
  77.     border-color: #ffffff;
  78.     color: #8e24aa;
  79.     box-shadow: 0 10px 60px rgba(255, 255, 255, 0.6);
  80. }
  81. .w-a {
  82.     text-transform: uppercase;
  83.     color: #bdbdbd;
  84.     font-size: 1.2rem;
  85.     font-weight: 400;
  86.     transition: 0.4s;
  87. }
  88. .w-a:hover {
  89.     color: #ffffff;
  90. }
  91. .sidebar {
  92.     display: none;
  93.     position: fixed;
  94.     top: 0;
  95.     left: 0;
  96.     background-color: #181c33;
  97.     width: 100%;
  98.     height: 100%;
  99.     padding: 4rem;
  100.     z-index: 99999;
  101. }
  102. .sidebar ul {
  103.     padding: 0;
  104.     list-style-type: none;
  105. }
  106. .sidebar ul li {
  107.     margin-bottom: 2.6rem;
  108. }
  109. .sidebar a:nth-child(2) {
  110.     color: #ffffff;
  111. }
  112. .w-nav {
  113.     display: none;
  114.     position: fixed;
  115.     top: 0;
  116.     left: 0;
  117.     background-color: #181c33;
  118.     width: 100%;
  119.     padding: 1.6rem 10%;
  120.     z-index: 99999;
  121. }
  122. .w-nav img {
  123.     width: 12%;
  124.     float: left;
  125. }
  126. .w-nav a {
  127.     float: right;
  128. }
  129. .l1 {
  130.     background-image: url(../images/bg1.png);
  131.     background-size: cover;
  132.     background-position: center center;
  133.     width: 100%;
  134.     padding: 4rem 10% 8rem;
  135.     overflow: auto;
  136. }
  137. .l1_nav {
  138.     width: 100%;
  139.     float: left;
  140. }
  141. .l1_nav img {
  142.     width: 12%;
  143.     float: left;
  144. }
  145. .l1_nav a {
  146.     margin-left: 2.6rem;
  147.     float: right;
  148. }
  149. .l1_nav a:nth-child(2) {
  150.     display: none;
  151. }
  152. .l1_nav a:nth-child(7) {
  153.     color: #ffffff;
  154. }
  155. .l1_inner {
  156.     margin-top: 12rem;
  157.     float: left;
  158. }
  159. .l1_inner p {
  160.     margin-bottom: 2.4rem;
  161.     color: #ffffff;
  162.     font-size: 1rem;
  163.     font-weight: 300;
  164. }
  165. .l1_inner p span {
  166.     display: block;
  167.     margin-bottom: 1.8rem;
  168.     color: #ffffff;
  169.     font-size: 3.8rem;
  170.     font-weight: 600;
  171.     line-height: 3.6rem;
  172.     letter-spacing: -0.2rem;
  173. }
  174. .l1_inner button {
  175.     float: left;
  176. }
  177. .l1_inner button:last-child {
  178.     margin-left: 2.6rem;
  179.     padding: 1.2rem;
  180. }
  181. .l2 {
  182.     position: relative;
  183.     z-index: 1000;
  184.     width: 80%;
  185.     margin: 0 10%;
  186. }
  187. .l2 div:first-child, .l2 .w-div {
  188.     width: calc(50% - 1rem);
  189.     padding: 1rem;
  190.     color: #ffffff;
  191.     float: left;
  192. }
  193. .l2 div:first-child p {
  194.     font-size: 1rem;
  195.     font-weight: 300;
  196.     line-height: 2rem;
  197. }
  198. .l2 div:first-child p span {
  199.     display: block;
  200.     margin-bottom: 1.8rem;
  201.     text-transform: uppercase;
  202.     font-size: 2.4rem;
  203.     font-weight: 600;
  204.     letter-spacing: -0.12rem;
  205. }
  206. .l2 .w-div {
  207.     margin: 2rem 0 0 2rem;
  208. }
  209. .l2 .w-div button {
  210.     width: 3.2rem;
  211.     height: 3.2rem;
  212.     margin-bottom: 4rem;
  213.     padding: unset;
  214.     float: left;
  215. }
  216. .l2 .w-div button:nth-child(n+3){
  217.     float: right;
  218. }
  219. .l2 .w-div div {
  220.     width: 100%;
  221.     float: left;
  222. }
  223. .l2 .w-div p {
  224.     font-size: 1rem;
  225.     font-weight: 300;
  226.     line-height: 2rem;
  227. }
  228. .l2 .w-div p span:first-child {
  229.     display: block;
  230.     margin-bottom: 1.8rem;
  231.     text-transform: uppercase;
  232.     font-size: 2.4rem;
  233.     font-weight: 600;
  234.     letter-spacing: -0.12rem;
  235. }
  236. .l2 .w-div p span:last-child {
  237.     display: block;
  238.     margin-top: 1.8rem;
  239.     font-style: italic;
  240. }
  241. .l3 {
  242.     width: 100%;
  243.     padding: 12rem 10%;
  244.     overflow: auto;
  245. }
  246. .l3 .w-div, .l3 div:nth-child(2) {
  247.     width: calc(50% - 1rem);
  248.     padding: 4rem;
  249.     color: #ffffff;
  250.     float: left;
  251. }
  252. .l3 .w-div {
  253.     background-image: url(../images/bg1.png);
  254.     background-size: cover;
  255.     background-position: center center;
  256.     margin-right: 2rem;
  257. }
  258. .l3 .w-div button {
  259.     width: 3.2rem;
  260.     height: 3.2rem;
  261.     margin-bottom: 24rem;
  262.     padding: unset;
  263.     float: left;
  264. }
  265. .l3 .w-div button:nth-child(n+3) {
  266.     float: right;
  267. }
  268. .l3 div:nth-child(2) p {
  269.     font-size: 1rem;
  270.     font-weight: 300;
  271.     line-height: 2rem;
  272. }
  273. .l3 div:nth-child(2) p span:first-child {
  274.     display: block;
  275.     margin-bottom: 1.8rem;
  276.     text-transform: uppercase;
  277.     font-size: 2.4rem;
  278.     font-weight: 600;
  279.     letter-spacing: -0.12rem;
  280. }
  281. .l3 div:nth-child(2) p span:last-child {
  282.     display: block;
  283.     margin-top: 1.8rem;
  284.     font-style: italic;
  285. }
  286. .l3 div:nth-child(2) div {
  287.     width: 100%;
  288.     padding: 0;
  289.     float: left;
  290. }
  291. .l4 {
  292.     position: relative;
  293.     z-index: 1000;
  294.     max-width: 36rem;
  295.     margin: 0 auto -2rem;
  296.     overflow: auto;
  297. }
  298. .l4 p:first-child {
  299.     display: block;
  300.     margin-bottom: 1.8rem;
  301.     text-transform: uppercase;
  302.     text-align: center;
  303.     color: #ffffff;
  304.     font-size: 2.4rem;
  305.     font-weight: 600;
  306.     line-height: 2rem;
  307.     letter-spacing: -0.12rem;
  308. }
  309. .l4_inner {
  310.     width: 100%;
  311. }
  312. #form1, #form2 {
  313.     width: 100%;
  314. }
  315. #form2, #l4_start {
  316.     display: none;
  317. }
  318. #form1 .checkbox {
  319.     margin-bottom: 2.25rem;
  320. }
  321. #form1 .checkbox a {
  322.     text-transform: none;
  323.     font-size: inherit;
  324. }
  325. .l4_inner div button {
  326.     float: left;
  327. }
  328. .l4_inner div button:last-child {
  329.     padding: 1.2rem;
  330.     float: right;
  331. }
  332. .l5 {
  333.     background-color: #181c33;
  334.     width: 100%;
  335.     padding: 4rem 10%;
  336.     overflow: auto;
  337. }
  338. .l5 button {
  339.     padding: 1.2rem 1.4rem;
  340. }
  341. .l5 a {
  342.     margin: 1.2rem 0 0 2.8rem;
  343. }
  344. .l5 a:nth-child(2) {
  345.     color: #ffffff;
  346. }
  347. .l5 a:last-child {
  348.     float: right;
  349. }
  350. .header {
  351.     width: 100%;
  352.     padding: 4rem 10% 4rem;
  353. }
  354. .header img {
  355.     width: 12%;
  356.     float: left;
  357. }
  358. .header a {
  359.     margin-left: 2.6rem;
  360.     float: right;
  361. }
  362. .content {
  363.     width: 100%;
  364.     padding: 4rem 10%;
  365.     overflow: auto;
  366. }
  367. .c_p1 {
  368.     width: 100%;
  369. }
  370. .c_p1_skin {
  371.     background-color: #1d223d;
  372.     width: calc(30% - 1rem);
  373.     margin-right: 2rem;
  374.     padding: 4rem;
  375.     float: left;
  376.     box-shadow: 0px 6px 6px #181c33;
  377. }
  378. .c_p1_skin p {
  379.     text-align: center;
  380.     color: #ffffff;
  381.     font-size: 2.4rem;
  382.     font-weight: 500;
  383.     letter-spacing: -0.2rem;
  384. }
  385. .c_p1_skin hr {
  386.     background-color: #8e24aa;
  387.     border: none;
  388.     width: 4rem;
  389.     height: 0.4rem;
  390.     margin: 1.2rem auto 0;
  391.     box-shadow: 0 1px 1px #212121;
  392. }
  393. #skinpreview0 {
  394.     width: 100%;
  395.     float: left;
  396. }
  397. #skinpreview0 canvas {
  398.     width: 100%;
  399. }
  400. .c_p1_info {
  401.     background-color: #1d223d;
  402.     width: calc(70% - 1rem);
  403.     padding: 4rem;
  404.     float: left;
  405.     box-shadow: 0px 6px 6px #181c33;
  406. }
  407. .c_p1_info p:first-child {
  408.     text-align: center;
  409.     color: #ffffff;
  410.     font-size: 2.4rem;
  411.     font-weight: 500;
  412.     letter-spacing: -0.2rem;
  413. }
  414. .c_p1_info hr {
  415.     background-color: #8e24aa;
  416.     border: none;
  417.     width: 4rem;
  418.     height: 0.4rem;
  419.     margin: 1.2rem auto 0;
  420.     box-shadow: 0 1px 1px #212121;
  421. }
  422. .c_p1_info button {
  423.     border: 1px solid #ffffff;
  424.     margin: 1rem 1rem 0 0;
  425.     padding: 1.2rem 1.4rem;
  426.     color: #ffffff;
  427.     font-size: 1.2rem;
  428.     font-weight: 300;
  429.     float: left;
  430.     transition: 0.4s;
  431.     box-shadow: 0 1px 1px #212121;
  432. }
  433. .c_p1_info button:hover {
  434.     background-color: #ffffff;
  435.     color: #8e24aa;
  436. }
  437. .c_p1_info_div {
  438.     margin: 1rem 1rem 0 0;
  439.     color: #ffffff;
  440.     font-size: 1rem;
  441.     font-weight: 800;
  442.     float: left;
  443. }
  444. .c_p1_info_div div {
  445.     font-size: 1.4rem;
  446.     font-weight: 400;
  447. }
  448. #refill {
  449.     margin: 1rem 1rem 0 0;
  450.     float: left;
  451. }
  452. #refill button {
  453.     margin-top: 0;
  454. }
  455. #change_pass {
  456.     margin: 1rem 1rem 0 0;
  457.     float: left;
  458. }
  459. #change_pass button {
  460.     margin-top: 0;
  461. }
  462. .c_p1_inv {
  463.     background-color: #1d223d;
  464.     width: 100%;
  465.     margin-top: 2rem;
  466.     padding: 4rem;
  467.     float: left;
  468.     box-shadow: 0px 6px 6px #181c33;
  469. }
  470. .c_p1_inv p {
  471.     text-align: center;
  472.     color: #ffffff;
  473.     font-size: 2.4rem;
  474.     font-weight: 500;
  475.     letter-spacing: -0.2rem;
  476. }
  477. .c_p1_inv hr {
  478.     background-color: #8e24aa;
  479.     border: none;
  480.     width: 4rem;
  481.     height: 0.4rem;
  482.     margin: 1.2rem auto 0;
  483.     box-shadow: 0 1px 1px #212121;
  484. }
  485. .c_p1_inv div {
  486.     border: 1px solid #ffffff;
  487.     margin: 1rem 1rem 0 0;
  488.     padding: 1.2rem 1.4rem;
  489.     color: #ffffff;
  490.     font-size: 1.2rem;
  491.     font-weight: 300;
  492.     float: left;
  493.     transition: 0.4s;
  494. }
  495. .c_p2 {
  496.     width: 100%;
  497.     max-width: 26rem;
  498.     margin: 0 auto;
  499. }
  500. .c_p2 p {
  501.     text-transform: uppercase;
  502.     text-align: center;
  503.     color: #ffffff;
  504.     font-size: 2.4rem;
  505.     font-weight: 600;
  506.     line-height: 2rem;
  507.     letter-spacing: -0.12rem;
  508. }
  509. .c_p2 button {
  510.     display: block;
  511.     margin: 0 auto;
  512. }
  513. .c_s1 {
  514.     width: 100%;
  515.     float: left;
  516. }
  517. .c_s2 {
  518.     width: 100%;
  519.     margin-top: 2rem;
  520.     float: left;
  521. }
  522. .c_s2 .servers_divs {
  523.     display: flex;
  524. }
  525. .c_s2_i {
  526.     display: flex;
  527.     flex-direction: column;
  528. }
  529. .c_s2_i div {
  530.     border: 1px solid #ffffff;
  531.     padding: 0.8rem;
  532.     color: #ffffff;
  533.     font-size: 0.8rem;
  534.     font-weight: 300;
  535. }
  536. .c_s2_i:nth-child(n+3) div:nth-last-child(-n+2) {
  537.     border: none;
  538.     padding: 0;
  539. }
  540.  
  541. .c_s21_i {
  542.     display: flex;
  543.     flex-direction: column;
  544. }
  545. .c_s21_i div {
  546.     border: 1px solid #ffffff;
  547.     padding: 0.8rem;
  548.     color: #ffffff;
  549.     font-size: 0.8rem;
  550.     font-weight: 300;
  551. }
  552. .c_s21_i:nth-child(n+3) div:nth-last-child(-n+2) {
  553.     border: none;
  554.     padding: 0;
  555. }
  556.  
  557. .c_s3 {
  558.     width: 100%;
  559.     margin-top: 2rem;
  560.     float: left;
  561. }
  562. .c_s3 .servers_divs {
  563.     display: flex;
  564.     justify-content: space-between;
  565.     flex-wrap: wrap;
  566. }
  567. .c_s3_i {
  568.     width: calc(70% - 2rem);
  569.     max-height: 500px;
  570.     overflow: scroll;
  571.     float: left;
  572. }
  573. .c_s3_i button {
  574.     border: 1px solid #ffffff;
  575.     width: 6rem;
  576.     margin-bottom: 1rem;
  577.     padding: 1rem;
  578.     transition: 0.4s;
  579. }
  580. .c_s3_i button:hover {
  581.     background-color: #ffffff;
  582. }
  583. .c_s3_i button img {
  584.     width: 100%;
  585. }
  586. .c_s3_i button p {
  587.     display: none;
  588. }
  589. .c_s3_b {
  590.     width: calc(30% - 2rem);
  591.     margin-left: 4rem;
  592.     float: left;
  593. }
  594. .c_s3_b p {
  595.     display: block;
  596.     margin-bottom: 1.8rem;
  597.     text-transform: uppercase;
  598.     text-align: center;
  599.     color: #ffffff;
  600.     font-size: 2.4rem;
  601.     font-weight: 600;
  602.     line-height: 2rem;
  603.     letter-spacing: -0.12rem;
  604. }
  605. .c_s3_b img {
  606.     display: block;
  607.     width: 50%;
  608.     margin: 2rem auto;
  609. }
  610. .c_s3_b button {
  611.     width: 100%;
  612.     float: left;
  613. }
  614. .c_i {
  615.     width: 100%;
  616.     float: left;
  617. }
  618. .infcdt {
  619.     width: 100%;
  620.     float: left;
  621. }
  622. #infidt1 ol, #infidt2 ol {
  623.     color: #ffffff;
  624.     font-size: 1.4rem;
  625.     font-weight: 600;
  626. }
  627. #infidt1 ol li ol, #infidt1 ol li ul, #infidt2 ol li ol {
  628.     font-size: 1rem;
  629.     font-weight: 400;
  630. }
  631. #infidt3 {
  632.     color: #ffffff;
  633.     font-size: 1.2rem;
  634.     font-weight: 400;
  635. }
  636. .footer {
  637.     background-color: #181c33;
  638.     width: 100%;
  639.     padding: 4rem 10%;
  640.     overflow: auto;
  641. }
  642. .footer button {
  643.     padding: 1.2rem 1.4rem;
  644. }
  645. .footer a {
  646.     margin: 1.2rem 0 0 2.8rem;
  647. }
  648. .footer a:last-child {
  649.     float: right;
  650. }
  651. @media screen and (max-width: 1800px) {
  652.    
  653. }
  654. @media screen and (max-width: 1600px) {
  655.    
  656. }
  657. @media screen and (max-width: 1400px) {
  658.    
  659. }
  660. @media screen and (max-width: 1200px) {
  661.    
  662. }
  663. @media screen and (max-width: 1000px) {
  664.     .l1_nav a:nth-child(n+3) {
  665.         display: none;
  666.     }
  667.     .l1_nav a:nth-child(2) {
  668.         display: block;
  669.     }
  670.     .l2 div:first-child, .l2 .w-div {
  671.         width: 100%;
  672.     }
  673.     .l2 .w-div {
  674.         margin: -2rem 0 0 0;
  675.     }
  676.     .l3 .w-div, .l3 div:nth-child(2) {
  677.         width: 100%;
  678.     }
  679.     .l3 .w-div {
  680.         margin-right: 0;
  681.     }
  682.     .l5 a:nth-child(n+2):nth-child(-n+6) {
  683.         display: none;
  684.     }
  685.     .header a:nth-child(n+3) {
  686.         display: none;
  687.     }
  688.     .footer a:nth-child(n+2):nth-child(-n+6) {
  689.         display: none;
  690.     }
  691. }
  692. @media screen and (max-width: 800px) {
  693.    
  694. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!