Advertisement
Guest User

Untitled

a guest
Jun 14th, 2018
64
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 20.33 KB | None | 0 0
  1. /* fonts */
  2.  
  3. @import url('https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700');
  4.  
  5. /* fonts */
  6.  
  7. *{
  8. padding: 0px;
  9. margin: 0px;
  10. outline: none;
  11. }
  12.  
  13. a {
  14. text-decoration: none;
  15. }
  16.  
  17.  
  18. @media (min-width: 1200px) and (max-width: 1920px) {
  19. body {
  20. margin: 0 auto;
  21. font-family: 'Ubuntu', sans-serif;
  22. background-position: center top!important;
  23. }
  24.  
  25. #container {
  26. margin: auto;
  27. max-width: 1200px;
  28. }
  29. .clear {
  30. clear: both;
  31. height: 0;
  32. overflow: hidden;
  33. }
  34.  
  35. /* HOME */
  36.  
  37. body.s_Index {
  38. overflow: hidden;
  39. background: url('../img/bg1.jpg') no-repeat;
  40. width: 100%;
  41. height:100%;
  42. min-height:732px;
  43. }
  44. body.s_Donate {
  45. overflow: hidden;
  46. background: url('../img/bg1.jpg') no-repeat;
  47. width: 100%;
  48. height:100%;
  49. min-height:732px;
  50. }
  51. .SectionContent {
  52. float: left;
  53. z-index: 1;
  54. position: relative;
  55. width: 100%;
  56. }
  57. .SectionContent .s_IndexName {
  58. position: absolute;
  59. text-transform: uppercase;
  60. font-weight: 600;
  61. width: 100%;
  62. transition: 5s;
  63. }
  64. .SectionContent .s_IndexName h1 {
  65. position: absolute;
  66. top: 125px;
  67. left: 30px;
  68. font-size: 100px;
  69. color: #242525;
  70. }
  71. .SectionContent .s_IndexName h2 {
  72. position: absolute;
  73. top: 240px;
  74. right: 85px;
  75. font-size: 85px;
  76. color: #157ebb;
  77. }
  78. .SectionContent .s_persone {
  79. position: absolute;
  80. background: url('../img/man.png');
  81. background-repeat: no-repeat;
  82. background-position: center top;
  83. width: 100%;
  84. height: 936px;
  85. min-height: 732px;
  86. }
  87. #SectionNavigation {
  88. z-index: 3;
  89. margin-bottom: 15px;
  90. position: relative;
  91. background: #fff;
  92. line-height: 80px;
  93. box-shadow: 0 0 4px 1px rgba(0,0,0,.07);
  94. width: 100%;
  95. height: 80px;
  96. }
  97. #SectionNavigation .logo {
  98. float: left;
  99. background: url('../img/logo.png') no-repeat;
  100. background-position: left center;
  101. width: 23.333%;
  102. height: 80px;
  103. }
  104.  
  105. #SectionNavigation .nav {
  106. float: left;
  107. text-align: center;
  108. width: 55.333%;
  109. height: 80px;
  110. }
  111. #SectionNavigation .account ul,
  112. #SectionNavigation ul {position: relative;}
  113. #SectionNavigation .account ul li,
  114. #SectionNavigation ul li {
  115. list-style: none;
  116. margin-right: 40px;
  117. display: inline-block;
  118. }
  119. #SectionNavigation .account ul li a,
  120. #SectionNavigation ul li a {
  121. line-height: 15px;
  122. text-decoration: none;
  123. display: inline-block;
  124. text-transform: uppercase;
  125. padding-bottom: 6px;
  126. font-size: 14px;
  127. font-weight: 400;
  128. color: #242525;
  129. }
  130. #SectionNavigation .account ul li:last-child,
  131. #SectionNavigation ul li:last-child {margin-right: 0px;}
  132. #SectionNavigation .account a:after,
  133. #SectionHeader a:after,
  134. #SectionNavigation ul li a:after {
  135. content: '';
  136. margin-top: 5px;
  137. display: block;
  138. height: 1.5px;
  139. width: 0;
  140. background: transparent;
  141. transition: width .5s ease, background-color .5s ease; /* .5 seonds for changes to the width and background-color */
  142. -webkit-transition: width .5s ease, background-color .5s ease; /* Chrome and Safari */
  143. -moz-transition: width .5s ease, background-color .5s ease; /* FireFox */
  144. }
  145. #SectionNavigation ul li a:hover:after {
  146. width: 100%;
  147. background: #157ebb;
  148. }
  149.  
  150. #SectionNavigation .account {
  151. float: left;
  152. position: relative;
  153. width: 21.333%;
  154. height: 80px;
  155. }
  156. #SectionNavigation .account .imgprofile {
  157. float: left;
  158. margin: 15px 0;
  159. overflow: hidden;
  160. border-radius: 50%;
  161. background: #fff;
  162. width: 50px;
  163. height: 50px;
  164. }
  165. #SectionNavigation .account .imgprofile img {
  166. margin: -1px -3px;
  167. width: 100%;
  168. }
  169.  
  170.  
  171. /* DONATE & LOGIN */
  172.  
  173. .SectionAbout form {
  174. width: 100%
  175. }
  176. .SectionAbout form h2 {
  177. height: 40px;
  178. line-height: 40px;
  179. font-size: 21px;
  180. font-weight: 400;
  181. color: #fff;
  182. }
  183. .SectionAbout form h3 {
  184. font-size: 14px;
  185. font-weight: 300;
  186. margin-bottom: 55px;
  187. color: #fff;
  188. }
  189. .doncf_wrap {
  190. display: block;
  191. max-width: 300px;
  192. min-width: 300px;
  193. max-height: 43px;
  194. min-height: 43px;
  195. margin-bottom: 17px;
  196. }
  197. .doncf_wrap .doncfw_icon_player {
  198. float: left;
  199. position: relative;
  200. top: 14px;
  201. margin-right: 9px;
  202. background: url('../img/form_icons.png') no-repeat 0px -27px;
  203. background-size: 14px;
  204. width: 17px;
  205. height: 16px;
  206. }
  207. .doncf_btn #input_ok {
  208. border: 0;
  209. padding: 14px 0 13px;
  210. background: #1db33a;
  211. color: white;
  212. font-weight: bold;
  213. text-transform: uppercase;
  214. border-radius: 7px;
  215. width: 100%;
  216. }
  217. .doncf_btn {
  218. float: left;
  219. margin-left: 30px;
  220. width: 270px;
  221. margin-top: 20px;
  222. }
  223. .doncf_wrap .doncfw_icon_rub {
  224. float: left;
  225. position: relative;
  226. top: 14px;
  227. margin-right: 9px;
  228. background: url('../img/form_icons.png') no-repeat center -115px;
  229. background-size: 17px;
  230. width: 17px;
  231. height: 16px;
  232. }
  233. .doncf_wrap input {
  234. float: right;
  235. width: 240px;
  236. border: 0;
  237. text-transform: inherit;
  238. font-size: 16px;
  239. background: white;
  240. padding: 13px 15px 12px;
  241. border-radius: 10px;
  242. }
  243. .doncf_wrap input#input_donate {
  244. width:50%;
  245. }
  246. /* DONATE */
  247.  
  248. /* HOME */
  249. .block {
  250. float: left;
  251. top: -60px;
  252. z-index: 9999;
  253. padding-top: 60px;
  254. position: relative;
  255. background: #fff;
  256. width: 33.3333%;
  257. height:100%;
  258. min-height:732px;
  259. }
  260.  
  261. .SectionAbout {
  262. margin: 0 auto;
  263. width: 1200px;
  264. height: 100%;
  265. position: absolute;
  266. top: 0;
  267. overflow: hidden;
  268. }
  269. .s_Auth_info,
  270. .s_About_info {
  271. position: absolute;
  272. width: 600px;
  273. height: 550px;
  274. margin-top: -125px;
  275. margin-bottom: -125px;
  276. top: 47%;
  277. bottom: 47%;
  278. }
  279. .s_Auth_pers,
  280. .s_About_pers {
  281. position: absolute;
  282. top: 20px;
  283. right: 0;
  284. background: url('../img/s_Aboutbg.png');
  285. background-repeat: no-repeat;
  286. background-position: center;
  287. width: 809px;
  288. height: 936px;
  289. min-height: 732px;
  290. }
  291. .s_Auth_pers .s_persone_man3 {
  292. position: relative;
  293. margin-top: 20px;
  294. background: url('../img/man3.png');
  295. background-repeat: no-repeat;
  296. background-position: center;
  297. width: 700px;
  298. height: 909px;
  299. min-height: 732px;
  300. }
  301. .s_About_pers .s_persone_man2 {
  302. position: relative;
  303. margin-top: 30px;
  304. background: url('../img/man2.png');
  305. background-repeat: no-repeat;
  306. background-position: center;
  307. width: 700px;
  308. height: 909px;
  309. min-height: 732px;
  310. }
  311. .s_About ul li a {
  312. color: #f4b650!important;
  313. }
  314. .s_About ul li a:hover:after {
  315. background: #f4b650!important;
  316. }
  317. .s_About .logo {
  318. background: url('../img/logo2.png')!important;
  319. }
  320. .mobile-menu {display: none;}
  321.  
  322.  
  323. /* cabinet */
  324. /* ------------- GLOBA: INNER-SECTION ------------- */
  325. .inner-container {
  326. float: left;
  327. overflow: hidden;
  328. background: #fff;
  329. border-radius: 9px;
  330. position: relative;
  331. box-shadow: 31.113px 31.113px 31px 0px rgba(0, 0, 0, 0.1);
  332. height: 400px;
  333. padding: 30px;
  334. }
  335. .inner-container:nth-child(1) {
  336. text-align: center;
  337. max-width: 305px;
  338. margin-right: 60px;
  339. }
  340.  
  341.  
  342. .inner-container:nth-child(1) .inner-photo {
  343. overflow: hidden;
  344. transition: all 0.3s ease-in-out;
  345. margin: 10px auto 0 auto;
  346. background-image: -webkit-linear-gradient(359deg, rgb(252,118,179) 0%, rgb(250,205,104) 100%);
  347. background-image: -o-linear-gradient(359deg, rgb(252,118,179) 0%, rgb(250,205,104) 100%);
  348. background-image: linear-gradient(89deg, rgb(252,118,179) 0%, rgb(250,205,104) 100%);
  349. border-radius: 50%;
  350. width: 100px;
  351. height: 100px;
  352. }
  353. .inner-container:nth-child(1) .inner-photo:hover {
  354. background-image: -webkit-linear-gradient(180deg, rgb(252,118,179) 0%, rgb(250,205,104) 100%);
  355. background-image: -o-linear-gradient(180deg, rgb(252,118,179) 0%, rgb(250,205,104) 100%);
  356. background-image: linear-gradient(180deg, rgb(252,118,179) 0%, rgb(250,205,104) 100%);
  357. box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.13);
  358. }
  359. .inner-container:nth-child(1) .inner-photo img {
  360. padding-top: 10px;
  361. width: 70%;
  362. }
  363. .inner-container:nth-child(1) h2 {
  364. padding-top: 30px;
  365. font-size: 16px;
  366. font-weight: 400;
  367. color: #b8bfc3;
  368. }
  369. .inner-container:nth-child(1) h2 span {
  370. font-weight: 600;
  371. color: #a1acb2;
  372. }
  373. .inner-container:nth-child(1) .inner-level {
  374. margin: 30px 0;
  375. padding: 20px 0;
  376. border-top: solid 1px #f4f4f4;
  377. border-bottom: solid 1px #f4f4f4;
  378. font-size: 24px;
  379. font-weight: 600;
  380. color: #444444;
  381. }
  382.  
  383. .inner-container:nth-child(1) a.exit {
  384. display: inline-block;
  385. border-radius: 3px;
  386. padding: 15px 25px;
  387. transition: .3s;
  388. background-image: -webkit-linear-gradient(359deg, rgb(17,83,252) 0%, rgb(85,129,241) 100%);
  389. background-image: -o-linear-gradient(359deg, rgb(17,83,252) 0%, rgb(85,129,241) 100%);
  390. background-image: linear-gradient(89deg, rgb(17,83,252) 0%, rgb(85,129,241) 100%);
  391. box-shadow: 0px 20px 35px 0px rgba(0, 0, 0, 0.14);
  392. font-size: 14px;
  393. font-weight: 400;
  394. color: #fff;
  395. }
  396. .inner-container:nth-child(1) a.exit:hover {
  397. opacity: .9;
  398. box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.14);
  399. }
  400. .inner-container:nth-child(1) a.exit i {
  401. float: right;
  402. display: block;
  403. margin-left: 15px;
  404. background: url('../img/exit.png');
  405. width: 24px;
  406. height: 19px;
  407. }
  408.  
  409. .inner-container:nth-child(2) {
  410. width: 805px;
  411. }
  412. .inner-container:nth-child(2):before {
  413. content: "";
  414. top: -600px;
  415. left: 150px;
  416. position: absolute;
  417. border-radius: 66px;
  418. transform: rotate(45deg);
  419. background-image: -webkit-linear-gradient(269deg, rgb(181,136,247) 0%, rgb(29,229,226) 100%);
  420. background-image: -o-linear-gradient(269deg, rgb(181,136,247) 0%, rgb(29,229,226) 100%);
  421. background-image: linear-gradient(359deg, rgb(181,136,247) 0%, rgb(29,229,226) 100%);
  422. width: 598px;
  423. height: 598px;
  424. }
  425. .inner-container:nth-child(2) .inner-stats {
  426. float: left;
  427. width: 300px;
  428. }
  429. .inner-container:nth-child(2) .inner-skills {
  430. float: right;
  431. position: relative;
  432. overflow-y: scroll;
  433. overflow-x: hidden;
  434. width: 210px;
  435. height: 370px;
  436. }
  437. .inner-container:nth-child(2) .inner-skills .item_weapon {
  438. padding: 15px;
  439. width: 85%;
  440. height: 700px;
  441. }
  442.  
  443. .inner-container:nth-child(2) .inner-skills::-webkit-scrollbar {
  444. position: relative;
  445. transition: .3s;
  446. opacity: .3;
  447. width: 6px;
  448. height: 3px;
  449. }
  450. .inner-container:nth-child(2) .inner-skills::scrollbar {
  451. opacity: 0;
  452. }
  453. .inner-container:nth-child(2) .inner-skills::-webkit-scrollbar-track {
  454. background-color: #ab8ef6;
  455. }
  456. .inner-container:nth-child(2) .inner-skills::-webkit-scrollbar-track-piece {
  457. background-color: #eeeeee;
  458. }
  459. .inner-container:nth-child(2) .inner-skills::-webkit-scrollbar-thumb {
  460. height: 50px;
  461. background-color: #ab8ef6;
  462. border-radius: 3px;
  463. }
  464. .inner-container:nth-child(2) .inner-skills::-webkit-resizer {
  465. background-color: #ab8ef6;
  466. }
  467.  
  468. .inner-container:nth-child(2) .inner-skills .item-drop {
  469. position: relative;
  470. margin-bottom: 40px;
  471. border-radius: 6px;
  472. background: #fff;
  473. text-align: center;
  474. box-shadow: 0px 15px 21px 0px rgba(0, 0, 0, 0.1);
  475. width: 100%;
  476. height: 105px;
  477. }
  478. .inner-container:nth-child(2) .inner-skills .item-drop img {
  479. margin: 20px 0 15px 0;
  480. }
  481. .inner-container:nth-child(2) .inner-skills .item-drop h4 {
  482. padding: 0 10px;
  483. font-size: 14px;
  484. font-weight: 400;
  485. color: #242424;
  486. width: 100%;
  487. }
  488. .inner-container:nth-child(2) .inner-skills .item-drop h4 strong {
  489. margin-left: 25px;
  490. font-weight: 400;
  491. }
  492. .inner-container:nth-child(2) .inner-skills:after {
  493. content: "";
  494. position: fixed;
  495. top: 410px;
  496. background: -moz-linear-gradient(top, rgba(255,255,255,1) 15%, rgba(255,255,255,0) 100%);
  497. background: -webkit-linear-gradient(top, rgba(255,255,255,1) 15%,rgba(255,255,255,0) 100%);
  498. background: linear-gradient(to top, rgba(255,255,255,1) 15%,rgba(255,255,255,0) 100%);
  499. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
  500. width: 205px;
  501. height: 120px;
  502. }
  503. .player-stat {width: 100%;}
  504. .player-stat tr {
  505. border-bottom: solid 1px #fbfbfb;
  506. }
  507. .player-stat tr td:nth-child(1) {
  508. width: 50%;
  509. height: 40px;
  510. font-weight: 400;
  511. font-size: 14px;
  512. text-align: left;
  513. color: #8a9198;
  514. }
  515. .player-stat tr td:nth-child(2) {
  516. width: 50%;
  517. height: 40px;
  518. font-weight: 400;
  519. font-size: 14px;
  520. text-align: right;
  521. color: #55595d;
  522. }
  523. .container {
  524. margin: 0 auto;
  525. max-width: 1200px;
  526. padding: 0 15px;
  527.  
  528. }
  529.  
  530. .admin-nav {
  531. list-style: none;
  532. }
  533. .admin-nav li a {
  534. display: block;
  535. line-height: 40px;
  536. color: #333;
  537. font-size: 14px;
  538. }
  539. .acc-func {
  540. list-style: none;
  541. }
  542. .acc-func li a {
  543. display: block;
  544. font-size: 14px;
  545. line-height: 30px;
  546. }
  547. /* ---------- ADMIN PANEL STYLE ------------- */
  548.  
  549. .admin-nav {
  550. list-style: none;
  551. }
  552. .admin-nav li a {
  553. display: block;
  554. line-height: 40px;
  555. color: #333;
  556. font-size: 14px;
  557. }
  558. .server-stats p {
  559. display: block;
  560. color: #999;
  561. font-size: 14px;
  562. line-height: 30px;
  563. }
  564. /* ------------------------------------------------------------ */
  565. /* ------------------------ CABINET.HTML ---------------------- */
  566. /* ------------------------------------------------------------ */
  567.  
  568. .section-player-info {
  569. padding: 0;
  570. margin-top: 100px;
  571. }
  572. .pi-name {
  573. color: #ff4800;
  574. }
  575.  
  576. .pi-wrap {
  577. margin-top: 100px;
  578. }
  579. .pi-skin {
  580. width: 144px;
  581. }
  582. .block-title {
  583. height: 50px;
  584. background: #202020;/*e7e7e7*/
  585. }
  586. .block-title h2 {
  587. text-transform: uppercase;
  588. line-height: 50px;
  589. font-size: 20px;
  590. font-family: 'Ubuntu', sans-serif;
  591. margin-left: 10px;
  592. color: #FFFFFF;/*909090*/
  593. }
  594. .pi-table {
  595. width: 100%;
  596. border: 1px solid #e4e4e4;
  597. }
  598. .pi-table td {
  599. padding: 10px;
  600. font-size: 16px;
  601. }
  602. /* */
  603. .section-player-info2 {
  604. padding: 0;
  605. margin-top: 100px;
  606. }
  607. .pi-name2 {
  608. color: #ff4800;
  609. }
  610.  
  611. .pi-wrap2 {
  612. margin-top: 100px;
  613. }
  614. .pi-skin2 {
  615. width: 144px;
  616. }
  617. .block-title2 {
  618. height: 50px;
  619. background: #202020;
  620. }
  621. .block-title2 h2 {
  622. text-transform: uppercase;
  623. line-height: 50px;
  624. font-size: 20px;
  625. font-family: 'Ubuntu', sans-serif;
  626. margin-left: 10px;
  627. color: #FFFFFF;
  628. }
  629. .pi-table2 {
  630. width: 100%;
  631. border: 1px solid #e4e4e4;
  632. }
  633. .pi-table2 td {
  634. padding: 10px;
  635. font-size: 16px;
  636. }
  637. /**/
  638.  
  639. /* play page */
  640.  
  641.  
  642. #gray {
  643. background: #fbfbfb;
  644. width: 100%;
  645. height: auto;
  646. }
  647. #white {
  648. background: #fff;
  649. width: 100%;
  650. height: auto;
  651. }
  652. #gray .header {
  653. text-align: center;
  654. margin-top: -13px;
  655. height: 200px;
  656. }
  657. #gray .header h2 {
  658. line-height: 40px;
  659. padding-top: 45px;
  660. padding-bottom: 30px;
  661. font-weight: 500;
  662. font-size: 27px;
  663. color: #242424;
  664. height: 40px;
  665. }
  666. #gray .header h2 span {
  667. color: #157ebb
  668. }
  669. #gray .header p {
  670. font-size: 14px;
  671. font-weight: 300;
  672. color: #b7b7b7;
  673. }
  674.  
  675. .start,
  676. .add,
  677. .setup {
  678. height: 320px;
  679. }
  680. .setup .icon {
  681. float: left;
  682. background: url('../img/setup.png') no-repeat;
  683. background-position: center;
  684. width: 225px;
  685. height: 320px;
  686. }
  687. .start .info,
  688. .setup .info {
  689. float: left;
  690. width: 700px;
  691. }
  692. .setup .info ul,
  693. .add .info ul {
  694. float: left;
  695. margin-top: 30px;
  696. display: inline-block;
  697. }
  698. .add .info ul li,
  699. .setup .info ul li {
  700. margin-right: 20px;
  701. list-style: none;
  702. float: left;
  703. }
  704. .add .info ul li a,
  705. .setup .info ul li a {
  706. float: left;
  707. text-align: center;
  708. line-height: 51px;
  709. font-size: 14px;
  710. transition: 0.3s;
  711. background: url('../img/btn.png') no-repeat;
  712. background-position: 0 0;
  713. width: 201px;
  714. height: 51px;
  715. color: #fff;
  716. }
  717. .add .info ul li a:hover,
  718. .setup .info ul li a:hover {
  719. background-position: 0 -51px;
  720. }
  721. .add .info h3,
  722. .start .info h3,
  723. .setup .info h3 {
  724. padding-top: 60px;
  725. font-size: 18px;
  726. font-weight: 500;
  727. color: #157ebb;
  728. }
  729. .add .info p,
  730. .start .info p,
  731. .setup .info p {
  732. padding-top: 27px;
  733. font-size: 14px;
  734. font-weight: 300;
  735. color: #242424;
  736. }
  737. .add .info h3 {
  738. padding-top: 23px!important;
  739. }
  740. .add .info p {
  741. width: 700px;
  742. }
  743. .add .info {
  744. float: left;
  745. width: 935px;
  746. }
  747.  
  748. .add .icon {
  749. float: left;
  750. background: url('../img/add.png') no-repeat;
  751. background-position: center;
  752. width: 225px;
  753. height: 320px;
  754. }
  755. .start .info h3 {
  756. padding-top: 80px!important;
  757. }
  758. .start .icon {
  759. float: left;
  760. background: url('../img/start.png') no-repeat;
  761. background-position: center;
  762. width: 225px;
  763. height: 320px;
  764. }
  765. .start .info a {
  766. margin: 0 3px;
  767. background: #edf4f8;
  768. color: #157ebb;
  769. transition: 0.3s;
  770. padding: 1px 6px;
  771. border-radius: 6px;
  772. }
  773. .start .info a:hover {
  774. background: #157ebb;
  775. color: #fff;
  776. }
  777. }
  778.  
  779.  
  780. @media (min-width: 769px) and (max-width: 1199px) {
  781. body {
  782. background: #f8fbfc;
  783. }
  784. }
  785.  
  786. @media (min-width: 680px) and (max-width: 768px) {
  787. body {
  788. background: #f8fbfc;
  789. }
  790. }
  791.  
  792. @media (min-width: 320px) and (max-width: 679px) {
  793. body {
  794. margin: 0 auto;
  795. overflow: hidden;
  796. font-family: 'Ubuntu', sans-serif;
  797. background-position: center top!important;
  798. width: 100%;
  799. height:100%;
  800. min-height:732px;
  801. }
  802.  
  803. #container {
  804. margin: auto;
  805. max-width: 1200px;
  806. }
  807. .clear {
  808. clear: both;
  809. height: 0;
  810. overflow: hidden;
  811. }
  812.  
  813. /* HOME */
  814.  
  815. body.s_Index {
  816. background: url('../img/bg1.jpg') no-repeat;
  817. }
  818. body.s_Donate {
  819. overflow-y: auto;
  820. background: url('../img/bg2.jpg') no-repeat;
  821. }
  822. .SectionNavigation,
  823. .SectionHeader .right a,
  824. .SectionContent .s_IndexName,
  825. .SectionHeader,
  826. .s_About_pers {
  827. display: none;
  828. }
  829. .mobile-menu .left .logo,
  830. .SectionHeader .left .logo {
  831. float: left;
  832. transition: 0.3s;
  833. background: url('../img/logo.png');
  834. width: 93px;
  835. height: 19px;
  836. }
  837. .SectionContent {
  838. float: left;
  839. z-index: 1;
  840. position: relative;
  841. width: 100%;
  842. }
  843. .SectionContent .s_persone {
  844. position: absolute;
  845. background: url('../img/man_mobile.png');
  846. background-repeat: no-repeat;
  847. background-position: center top;
  848. width: 100%;
  849. height: 730px;
  850. min-height: 732px;
  851. }
  852. /* HOME */
  853. .SectionAbout {
  854. margin: 0 auto;
  855. max-width: 1200px;
  856. height: 100%;
  857. }
  858. .s_About_info {margin: 35px 0 0 20px;}
  859. .s_About_info h2 {
  860. height: 40px;
  861. line-height: 40px;
  862. margin-bottom: 55px;
  863. border-left: solid 4px #f19d30;
  864. padding-left: 45px;
  865. font-size: 21px;
  866. font-weight: 400;
  867. color: #fff;
  868. }
  869. .s_About_info p {
  870. padding-left: 49px;
  871. font-size: 14px;
  872. width: 70%;
  873. color: #fff;
  874. }
  875. /* Mobile Menu */
  876. .menu-toggle {
  877. display: block;
  878. z-index: 100;
  879. width: 23px;
  880. border-radius: 50%;
  881. position: absolute;
  882. top: 45px;
  883. right: 32px;
  884. cursor: pointer;
  885. }
  886. .menu-toggle:before,
  887. .menu-toggle:after,
  888. .menu-toggle span {
  889. display: block;
  890. height: 3px;
  891. content: "";
  892. background: #fff;
  893. position: relative;
  894. top: 0;
  895. -webkit-transform: rotate(0deg);
  896. -moz-transform: rotate(0deg);
  897. -o-transform: rotate(0deg);
  898. transform: rotate(0deg);
  899. -webkit-transition: all 0.5s;
  900. -moz-transition: all 0.5s;
  901. -o-transition: all 0.5s;
  902. transition: all 0.5s;
  903. }
  904. .menu-toggle span {
  905. margin: 4px 0;
  906. }
  907. .menu-toggle.open {
  908. z-index: 100;
  909. right: 32px;
  910. position: fixed;
  911. }
  912. .menu-toggle.open:before {
  913. top: 1px;
  914. background: #fff;
  915. -webkit-transform: rotate(-45deg);
  916. -moz-transform: rotate(-45deg);
  917. -o-transform: rotate(-45deg);
  918. transform: rotate(-45deg);
  919. }
  920. .menu-toggle.open:after {
  921. top: -1px;
  922. background: #fff;
  923. -webkit-transform: rotate(45deg);
  924. -moz-transform: rotate(45deg);
  925. -o-transform: rotate(45deg);
  926. transform: rotate(45deg);
  927. }
  928. .menu-toggle.open span {display: none;}
  929. .mobile-menu {
  930. width: 100%;
  931. height: 100%;
  932. text-align: center;
  933. overflow: auto;
  934. background: #f4b650;
  935. position: fixed;
  936. top: 0;
  937. right: -100%;
  938. z-index: 90;
  939. -webkit-transition: all 0.5s;
  940. -moz-transition: all 0.5s;
  941. -o-transition: all 0.5s;
  942. transition: all 0.5s;
  943. }
  944. .mobile-menu .mobile-header {display: none;}
  945. .mobile-menu.open {
  946. right: 0%;
  947. }
  948. .mobile-menu ul {
  949. padding: 90px 0 0;
  950. }
  951. .mobile-menu li {
  952. text-align: left;
  953. margin-bottom: 15px;
  954. margin-left: 35px;
  955. list-style: none;
  956. font-weight: 600;
  957. }
  958. .mobile-menu a {
  959. font-size: 14px;
  960. text-transform: uppercase;
  961. font-weight: 400;
  962. text-decoration: none;
  963. color: #242525;
  964. }
  965. .mobile-menu a:hover {color: #fff;}
  966. .mobile-menu p {
  967. width: 100%;
  968. position: absolute;
  969. left: 0;
  970. bottom: 60px;
  971. }
  972. .mobile-menu .btn {
  973. padding: 24px 38px;
  974. font: 16px/24px 'Stolzl-Medium', sans-serif;
  975. text-transform: uppercase;
  976. }
  977. .mobile-menu .left .logo {
  978. margin-top: 40px;
  979. margin-left: 35px;
  980. }
  981. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement