list-style.css 19 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064
  1. body {
  2. font-family: 'Helvetica Neue';
  3. }
  4. .sec-00 {
  5. height: 295px;
  6. -webkit-transition-property: height;
  7. transition-property: height;
  8. -webkit-transition-duration: 300ms;
  9. transition-duration: 300ms;
  10. }
  11. @media (max-width: 1850px) {
  12. .sec-00 {
  13. height: 260px;
  14. }
  15. }
  16. @media (max-width: 1550px) {
  17. .sec-00 {
  18. height: 230px;
  19. }
  20. }
  21. @media (max-width: 1100px) {
  22. .sec-00 {
  23. height: 200px;
  24. }
  25. }
  26. .sec-00__close {
  27. position: absolute;
  28. top: 0;
  29. right: 20px;
  30. width: 50px;
  31. height: 30px;
  32. background-color: rgba(255, 255, 255, 0.66);
  33. border-radius: 0 0 50px 50px;
  34. color: #888;
  35. border: none;
  36. outline: none;
  37. font-size: 11px;
  38. -webkit-box-shadow: 0 0 10px rgba(32, 32, 32, 0.25);
  39. box-shadow: 0 0 10px rgba(32, 32, 32, 0.25);
  40. line-height: 12px;
  41. }
  42. .sec-00.bannerClose {
  43. height: 0;
  44. overflow: hidden;
  45. -webkit-transition-property: height;
  46. transition-property: height;
  47. -webkit-transition-duration: 300ms;
  48. transition-duration: 300ms;
  49. }
  50. .sec-00 .container-fluid {
  51. background-color: #cacaca;
  52. height: 295px;
  53. }
  54. @media (max-width: 1850px) {
  55. .sec-00 .container-fluid {
  56. height: 260px;
  57. }
  58. }
  59. @media (max-width: 1550px) {
  60. .sec-00 .container-fluid {
  61. height: 230px;
  62. }
  63. }
  64. @media (max-width: 1100px) {
  65. .sec-00 .container-fluid {
  66. height: 200px;
  67. }
  68. }
  69. .sec-00__slider {
  70. margin: 0 auto;
  71. width: 70%;
  72. height: 100%;
  73. max-width: 1344px;
  74. }
  75. @media (max-width: 1850px) {
  76. .sec-00__slider {
  77. max-width: 1176px;
  78. }
  79. }
  80. @media (max-width: 1550px) {
  81. .sec-00__slider {
  82. max-width: 1010px;
  83. }
  84. }
  85. .sec-00__slider .slide-item {
  86. width: 100%;
  87. height: 295px;
  88. background-position: center center;
  89. background-size: cover;
  90. background-repeat: no-repeat;
  91. cursor: pointer;
  92. }
  93. @media (max-width: 1850px) {
  94. .sec-00__slider .slide-item {
  95. height: 260px;
  96. }
  97. }
  98. @media (max-width: 1550px) {
  99. .sec-00__slider .slide-item {
  100. height: 230px;
  101. }
  102. }
  103. @media (max-width: 1100px) {
  104. .sec-00__slider .slide-item {
  105. height: 200px;
  106. }
  107. }
  108. .sec-00 .slick-prev:before, .sec-00 .slick-next:before {
  109. display: none;
  110. }
  111. @-webkit-keyframes slidein {
  112. 100% {
  113. height: 0px;
  114. }
  115. }
  116. @keyframes slidein {
  117. 100% {
  118. height: 0px;
  119. }
  120. }
  121. .navbar {
  122. box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  123. -webkit-box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  124. -moz-box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
  125. padding-top: 5px;
  126. padding-bottom: 5px;
  127. background-color: white !important;
  128. z-index: 99;
  129. }
  130. .navbar .container-fluid {
  131. padding: 0 2.5rem;
  132. }
  133. @media (max-width: 1100px) {
  134. .navbar .container-fluid {
  135. padding: 0 .6rem;
  136. }
  137. }
  138. .navbar-toggler {
  139. padding-left: 0;
  140. border-color: transparent !important;
  141. }
  142. .navbar-toggler:focus {
  143. -webkit-box-shadow: none;
  144. box-shadow: none;
  145. }
  146. .navbar-toggler-icon {
  147. display: -webkit-box;
  148. display: -ms-flexbox;
  149. display: flex;
  150. justify-items: center;
  151. }
  152. .navbar-toggler-icon i {
  153. font-size: 25px;
  154. line-height: 30px;
  155. display: inline-block;
  156. }
  157. .navbar-search, .navbar-login {
  158. padding-right: 2px;
  159. }
  160. .navbar-login {
  161. cursor: pointer;
  162. }
  163. .navbar-search-magnify {
  164. cursor: pointer;
  165. }
  166. .navbar-brand {
  167. font-size: 1.5rem;
  168. }
  169. .navbar-brand.navbar-logo {
  170. display: -webkit-box;
  171. display: -ms-flexbox;
  172. display: flex;
  173. -webkit-box-align: center;
  174. -ms-flex-align: center;
  175. align-items: center;
  176. }
  177. .navbar-brand .navbar-login {
  178. font-size: 1rem;
  179. color: #EE7800;
  180. text-decoration: none;
  181. }
  182. .navbar .nav-link {
  183. cursor: pointer;
  184. }
  185. @media (max-width: 1100px) {
  186. .navbar .nav-link {
  187. padding: .5rem .5rem;
  188. font-size: .9rem;
  189. }
  190. }
  191. .navbar .navbar-nav .nav-item {
  192. margin: 0 .5rem;
  193. }
  194. @media (max-width: 1100px) {
  195. .navbar .navbar-nav .nav-item {
  196. margin: 0 0rem;
  197. }
  198. }
  199. .navbar .navbar-nav .nav-item .dropbox {
  200. visibility: hidden;
  201. opacity: 0;
  202. -webkit-transition: all .4s;
  203. transition: all .4s;
  204. position: absolute;
  205. width: 100vw;
  206. top: 100%;
  207. left: 0;
  208. background-color: rgba(255, 255, 255, 0.932);
  209. padding-top: 1.5rem;
  210. padding-bottom: 3rem;
  211. z-index: 1012;
  212. }
  213. .navbar .navbar-nav .nav-item .dropbox ul {
  214. padding-left: 0;
  215. }
  216. .navbar .navbar-nav .nav-item .dropbox-item {
  217. margin-bottom: .5rem;
  218. }
  219. .navbar .navbar-nav .nav-item .dropbox-item.first {
  220. font-size: 1.1rem;
  221. font-weight: 600;
  222. }
  223. .navbar .navbar-nav .nav-item .dropbox-item.first .dropbox-link {
  224. color: black;
  225. }
  226. .navbar .navbar-nav .nav-item .dropbox-link {
  227. text-decoration: none;
  228. color: #929292;
  229. font-size: .85rem;
  230. }
  231. .navbar .navbar-nav .nav-item .dropbox-link:hover {
  232. color: #EE7800;
  233. }
  234. .navbar .navbar-nav .nav-item .dropbox-link.dropbox-btn {
  235. border: 1px solid #929292;
  236. padding: .5rem 2rem;
  237. border-radius: 5px;
  238. width: 85%;
  239. min-width: 7rem;
  240. max-width: 11rem;
  241. }
  242. .navbar .navbar-nav .nav-item .dropbox-btn {
  243. display: -webkit-box;
  244. display: -ms-flexbox;
  245. display: flex;
  246. -webkit-box-align: center;
  247. -ms-flex-align: center;
  248. align-items: center;
  249. -webkit-box-pack: center;
  250. -ms-flex-pack: center;
  251. justify-content: center;
  252. }
  253. .navbar .navbar-nav .nav-item .dropbox .container {
  254. max-width: 900px;
  255. width: 70%;
  256. }
  257. .navbar .navbar-nav .nav-item .dropbox .container.stylebox {
  258. -webkit-transform: translateX(-30%);
  259. transform: translateX(-30%);
  260. }
  261. .navbar .navbar-nav .nav-item .dropbox .container.designerbox {
  262. -webkit-transform: translateX(-5%);
  263. transform: translateX(-5%);
  264. }
  265. .navbar .navbar-nav .nav-item .dropbox .container.newbox {
  266. -webkit-transform: translateX(15%);
  267. transform: translateX(15%);
  268. }
  269. .navbar .navbar-nav .nav-item .dropbox .container.forumbox {
  270. -webkit-transform: translateX(50%);
  271. transform: translateX(50%);
  272. }
  273. .navbar .navbar-nav .nav-item .nav-link {
  274. position: relative;
  275. }
  276. .navbar .navbar-nav .nav-item .nav-link:after {
  277. position: absolute;
  278. content: " ";
  279. width: 100%;
  280. height: 90%;
  281. top: 0;
  282. right: 0;
  283. border-bottom: 2px solid #EE7800;
  284. opacity: 0;
  285. -webkit-transform: opacity 1s;
  286. transform: opacity 1s;
  287. }
  288. .navbar .navbar-nav .nav-item:hover .nav-link:after {
  289. opacity: 1;
  290. }
  291. .navbar .navbar-nav .nav-item:hover > .dropbox {
  292. visibility: visible;
  293. opacity: 1;
  294. }
  295. .navbar .navbar-nav .nav-item.lg .container {
  296. max-width: 1200px;
  297. width: 90%;
  298. }
  299. .navbar .navbar-nav .nav-item.lg .dropbox-link {
  300. text-decoration: none;
  301. color: #929292;
  302. font-size: .7rem;
  303. }
  304. .navbar .navbar-nav .nav-item.lg .dropbox-link:hover {
  305. color: #EE7800;
  306. }
  307. .navbar .navbar-nav .nav-item.lg .dropbox-item {
  308. margin-bottom: .1rem;
  309. }
  310. .navbar .navbar-nav .nav-item.lg .dropbox-item.first .dropbox-link {
  311. font-size: .85rem;
  312. }
  313. .navbar-search .container {
  314. max-width: 900px;
  315. width: 70%;
  316. }
  317. @media (max-width: 1100px) {
  318. .navbar-search .container {
  319. width: 90%;
  320. }
  321. }
  322. .navbar-search .dropbox {
  323. visibility: hidden;
  324. opacity: 0;
  325. -webkit-transition: all .2s;
  326. transition: all .2s;
  327. position: absolute;
  328. width: 100vw;
  329. top: 100%;
  330. left: 0;
  331. background-color: rgba(255, 255, 255, 0.932);
  332. padding-top: 1.5rem;
  333. padding-bottom: 3rem;
  334. }
  335. .navbar-search .dropbox.open {
  336. visibility: visible;
  337. opacity: 1;
  338. }
  339. .navbar-search .dropbox__searchtab {
  340. width: 100%;
  341. background-color: gray;
  342. border-radius: 3px;
  343. padding: .2rem 1rem;
  344. padding-bottom: 1rem;
  345. }
  346. .navbar-search .dropbox__hots__title {
  347. font-size: 1rem;
  348. color: #6b6b6b;
  349. }
  350. .navbar-search .dropbox__hots__link {
  351. font-size: .9rem;
  352. color: #929292;
  353. text-decoration: none;
  354. cursor: pointer;
  355. margin: 0 .2rem;
  356. }
  357. .navbar-search .dropbox__searchBar__input {
  358. width: 100%;
  359. outline: none;
  360. border: 2px solid #EE7800;
  361. border-radius: 5rem;
  362. padding: .3rem 1.2rem;
  363. font-size: .9rem;
  364. }
  365. .navbar-search .dropbox__searchBar__submit {
  366. outline: none;
  367. border: none;
  368. font-size: .9rem;
  369. background-color: transparent;
  370. color: #EE7800;
  371. margin-left: -1rem;
  372. -webkit-transform: translateX(-100%);
  373. transform: translateX(-100%);
  374. padding: 0 .6rem;
  375. }
  376. .navbar-search .dropbox__tab .nav-item {
  377. margin: 0 .6rem;
  378. }
  379. .navbar-search .dropbox .nav-item-link {
  380. border: none;
  381. outline: none;
  382. font-size: 1rem;
  383. color: white;
  384. padding: 3px;
  385. position: relative;
  386. }
  387. .navbar-search .dropbox .nav-item-link::after {
  388. position: absolute;
  389. content: "";
  390. top: 0;
  391. left: 0;
  392. width: 100%;
  393. height: 100%;
  394. border-bottom: 3px solid #EE7800;
  395. opacity: 0;
  396. }
  397. .navbar-search .dropbox .nav-item-link.active::after {
  398. opacity: 1;
  399. }
  400. .navbar-search .dropbox-tab-content .tabpar {
  401. display: -webkit-box;
  402. display: -ms-flexbox;
  403. display: flex;
  404. padding-top: .5rem;
  405. }
  406. .navbar-search .dropbox-tab-content .tabpar .col {
  407. margin: 0 .6rem;
  408. }
  409. .navbar-search .dropbox-tab-content .tabpar .select {
  410. font-size: 1rem;
  411. padding: .6rem;
  412. border-radius: 3px;
  413. color: #747474;
  414. }
  415. .navbar-search .dropbox-tab-content .tabpar button {
  416. border: none;
  417. outline: none;
  418. background-color: #EE7800;
  419. border-radius: 3px;
  420. color: white;
  421. font-size: 1rem;
  422. padding: .6rem;
  423. }
  424. .navbar-search .dropbox-tab-content .tabpar .image-search {
  425. border: none;
  426. outline: none;
  427. background-color: #EE7800;
  428. border-radius: 3px;
  429. color: white;
  430. font-size: 1rem;
  431. }
  432. .navbar-search .dropbox-tab-content .tabpar .article-btn {
  433. border: none;
  434. outline: none;
  435. background-color: #EE7800;
  436. border-radius: 3px;
  437. color: white;
  438. font-size: 1rem;
  439. padding: .6rem;
  440. }
  441. .navbar-search .dropbox-tab-content .tabpar .home-btn {
  442. border: none;
  443. outline: none;
  444. background-color: #EE7800;
  445. border-radius: 3px;
  446. color: white;
  447. font-size: 1rem;
  448. padding: .6rem;
  449. }
  450. .navbar-search .dropbox__tab .nav-item-link.active .nav-item-link::after {
  451. opacity: 1;
  452. }
  453. .navbar-main.sticky {
  454. position: fixed;
  455. top: 0;
  456. width: 100%;
  457. }
  458. .navbar-main.sticky + .sec-02 {
  459. padding-top: 53.5px;
  460. }
  461. .sec-02__slider {
  462. width: 100%;
  463. height: 100%;
  464. }
  465. .sec-02__slider .slide-item {
  466. width: 100%;
  467. height: 74vh;
  468. background-position: center center;
  469. background-size: cover;
  470. background-repeat: no-repeat;
  471. cursor: pointer;
  472. }
  473. .sec-02 .slick-prev:before, .sec-02 .slick-next:before {
  474. display: none;
  475. }
  476. .sec-02 .slick-prev {
  477. left: 15px;
  478. z-index: 3;
  479. }
  480. .sec-02 .slick-next {
  481. right: 15px;
  482. }
  483. a {
  484. text-decoration: none;
  485. }
  486. .text-hhh {
  487. color: #EE7800;
  488. }
  489. .content {
  490. background-color: #FCFCFC;
  491. padding: 1rem 30px 0.5rem;
  492. }
  493. .content .infoCard {
  494. color: #727679;
  495. text-align: center;
  496. padding: 1rem;
  497. background-color: rgba(244, 244, 244, 0.8);
  498. -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  499. box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  500. -webkit-transform: translateY(-150px);
  501. transform: translateY(-150px);
  502. }
  503. .content .infoCard__seo {
  504. font-size: .9rem;
  505. text-align: center;
  506. padding: 1rem;
  507. display: block;
  508. line-height: 1.2;
  509. }
  510. .content .infoCard__approve {
  511. color: #FF0000;
  512. }
  513. .content .infoCard__avatar {
  514. width: 200px;
  515. height: 200px;
  516. border: 3px solid #FFF;
  517. border-radius: 50%;
  518. background-size: cover;
  519. background-repeat: no-repeat;
  520. }
  521. .content .infoCard__detail aside {
  522. line-height: 2;
  523. font-size: .9rem;
  524. }
  525. .content .infoCard__detail__l {
  526. -ms-flex-preferred-size: 30%;
  527. flex-basis: 30%;
  528. display: -webkit-box;
  529. display: -ms-flexbox;
  530. display: flex;
  531. -webkit-box-pack: end;
  532. -ms-flex-pack: end;
  533. justify-content: flex-end;
  534. -webkit-box-flex: 0;
  535. -ms-flex-positive: 0;
  536. flex-grow: 0;
  537. max-width: 30%;
  538. }
  539. .content .infoCard__detail__l.title {
  540. color: #AAAAAA;
  541. font-size: 1.125rem;
  542. font-weight: bold;
  543. -webkit-transform: translateX(-15px);
  544. transform: translateX(-15px);
  545. }
  546. .content .infoCard__detail__r {
  547. -ms-flex-preferred-size: 70%;
  548. flex-basis: 70%;
  549. text-align: start;
  550. -webkit-box-flex: 0;
  551. -ms-flex-positive: 0;
  552. flex-grow: 0;
  553. max-width: 70%;
  554. word-break: break-all;
  555. }
  556. .content .infoCard__detail__r a {
  557. color: #727679;
  558. }
  559. .content .infoCard__detail__r a:hover {
  560. color: #EE7800;
  561. }
  562. .content .infoCard .scMedia {
  563. display: -webkit-box;
  564. display: -ms-flexbox;
  565. display: flex;
  566. padding: 1rem 0;
  567. width: 100%;
  568. margin-left: auto;
  569. margin-right: auto;
  570. -ms-flex-pack: distribute;
  571. justify-content: space-around;
  572. }
  573. .content .infoCard .scMedia a {
  574. width: 16%;
  575. }
  576. .content .infoCard .scMedia a img {
  577. width: 100%;
  578. }
  579. .content .infoCard .scMedia span {
  580. width: 16%;
  581. }
  582. .content .infoCard .scMedia span img {
  583. width: 100%;
  584. }
  585. .infoContent a {
  586. color: #727679;
  587. text-decoration: none;
  588. font-size: .9rem;
  589. }
  590. .infoContent a.active {
  591. color: #EE7800;
  592. }
  593. .infoContent .nav-item {
  594. margin: 0 0.8rem;
  595. width: auto;
  596. }
  597. .infoContent .nav-item-link {
  598. display: block;
  599. padding: 0.5rem 2.5rem;
  600. text-decoration: none;
  601. background-color: transparent;
  602. font-size: .9rem;
  603. color: #727679;
  604. }
  605. .infoContent .nav-item-link.active {
  606. color: #EE7800;
  607. border-bottom: 2px solid #EE7800;
  608. }
  609. .infoContent .likeSee {
  610. margin-top: .8rem;
  611. }
  612. .infoContent .likeSee span {
  613. color: #727679;
  614. font-size: .9rem;
  615. cursor: pointer;
  616. }
  617. .infoContent .likeSee span:hover {
  618. color: #EE7800;
  619. }
  620. .infoContent .likeSee__divider {
  621. height: 12px;
  622. display: inline-block;
  623. border: 0.5px solid #9d9d9d;
  624. }
  625. .infoContent .card {
  626. -webkit-box-shadow: 0 1px 10px #eee;
  627. box-shadow: 0 1px 10px #eee;
  628. margin: 0 0 1.5rem;
  629. border: none;
  630. }
  631. .infoContent .card__bgImg {
  632. height: 293px;
  633. background-repeat: no-repeat;
  634. background-size: cover;
  635. background-position: center;
  636. position: relative;
  637. display: -webkit-box;
  638. display: -ms-flexbox;
  639. display: flex;
  640. -ms-flex-pack: center;
  641. justify-content: center;
  642. -webkit-box-align: center;
  643. -ms-flex-align: center;
  644. align-items: center;
  645. -webkit-box-pack: center;
  646. }
  647. .infoContent .card-body {
  648. padding: 0.5rem 1rem;
  649. }
  650. .infoContent .card__title {
  651. font-size: 1.125rem;
  652. -webkit-box-orient: vertical;
  653. box-orient: vertical;
  654. -webkit-line-clamp: 2;
  655. height: calc(18px * 2 * 1.5);
  656. overflow: hidden;
  657. text-overflow: ellipsis;
  658. display: -webkit-box;
  659. font-weight: bold;
  660. margin: 0.5rem 0;
  661. color: #727679;
  662. }
  663. .infoContent .card__tag {
  664. margin: 0 0.2rem 0 0;
  665. }
  666. .infoContent .company__block {
  667. margin: 0 0 2rem;
  668. }
  669. .infoContent .company__title {
  670. color: #AAAAAA;
  671. font-size: 2rem;
  672. font-weight: bold;
  673. }
  674. .infoContent .company__text {
  675. color: #43484C;
  676. }
  677. .nav-collapse-fixed {
  678. position: fixed;
  679. top: 52px;
  680. z-index: -1;
  681. width: 100%;
  682. opacity: 0;
  683. -webkit-transition: opacity .5s;
  684. transition: opacity .5s;
  685. }
  686. .nav-collapse-fixed.sticky {
  687. display: block;
  688. opacity: 1;
  689. z-index: 1010;
  690. }
  691. .nav-collapse-fixed .nav-collpase {
  692. padding: 1rem 0;
  693. background-color: #FCFCFC;
  694. -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  695. box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  696. }
  697. .navbar-main.sticky + .hero {
  698. padding-top: 53px;
  699. }
  700. .fixed-btn {
  701. position: fixed;
  702. right: 15px;
  703. bottom: 2rem;
  704. }
  705. .fixed-btn .btn-gotop, .fixed-btn .btn-login, .fixed-btn .btn-favor {
  706. cursor: pointer;
  707. padding: 1.2rem .8rem;
  708. background-color: rgba(255, 255, 255, 0.897);
  709. display: -webkit-box;
  710. display: -ms-flexbox;
  711. display: flex;
  712. -webkit-box-align: center;
  713. -ms-flex-align: center;
  714. align-items: center;
  715. box-shadow: 1px 1px 1px -3px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  716. -webkit-box-shadow: 1px 1px 1px -3px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  717. -moz-box-shadow: 1px 1px 1px -3px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
  718. }
  719. .footer {
  720. background: #e9e9e9;
  721. padding: 2.5rem 0;
  722. }
  723. @media (max-width: 1100px) {
  724. .footer .container {
  725. width: 98%;
  726. max-width: 950px;
  727. }
  728. }
  729. .footer__block {
  730. padding: 1rem 3rem;
  731. border-left: 1px solid #8f8f8f;
  732. }
  733. @media (max-width: 1100px) {
  734. .footer__block {
  735. padding: 1rem 1rem;
  736. }
  737. }
  738. .footer__block-title {
  739. font-size: 1.3rem;
  740. margin-bottom: 1.5rem;
  741. }
  742. .footer__block-list {
  743. padding-left: 0;
  744. }
  745. .footer__block:nth-of-type(1) {
  746. border-left: none;
  747. }
  748. .footer__block:nth-of-type(2) {
  749. padding: 1rem 4rem;
  750. }
  751. @media (max-width: 1100px) {
  752. .footer__block:nth-of-type(2) {
  753. padding: 1rem 1rem;
  754. }
  755. }
  756. .footer__block-socials {
  757. padding-left: 0;
  758. display: -webkit-box;
  759. display: -ms-flexbox;
  760. display: flex;
  761. -webkit-box-align: center;
  762. -ms-flex-align: center;
  763. align-items: center;
  764. -webkit-box-pack: justify;
  765. -ms-flex-pack: justify;
  766. justify-content: space-between;
  767. }
  768. @media (max-width: 1100px) {
  769. .footer__block-socials img {
  770. width: 30px;
  771. }
  772. }
  773. .footer__block .follows-fp {
  774. text-decoration: none;
  775. color: #696969;
  776. font-size: .9rem;
  777. display: -webkit-box;
  778. display: -ms-flexbox;
  779. display: flex;
  780. -webkit-box-align: center;
  781. -ms-flex-align: center;
  782. align-items: center;
  783. }
  784. @media (max-width: 1100px) {
  785. .footer__block .follows-fp {
  786. font-size: .8rem;
  787. }
  788. }
  789. .footer__block-phone p {
  790. display: inline;
  791. }
  792. @media (max-width: 900px) {
  793. .footer__block-phone p {
  794. display: block;
  795. }
  796. }
  797. .footer__block-phone p, .footer__block-phone span {
  798. font-size: .9rem;
  799. }
  800. .footer__block-phone .text-phone {
  801. color: #EE7800;
  802. text-decoration: none;
  803. }
  804. .footer__block-links {
  805. display: -webkit-box;
  806. display: -ms-flexbox;
  807. display: flex;
  808. -webkit-box-align: center;
  809. -ms-flex-align: center;
  810. align-items: center;
  811. margin-top: 1rem;
  812. -webkit-box-pack: center;
  813. -ms-flex-pack: center;
  814. justify-content: center;
  815. }
  816. .footer__block-links-grp {
  817. padding: .3rem;
  818. border-left: 1px solid #b9b9b9;
  819. }
  820. .footer__block-links-grp:nth-of-type(1) {
  821. border-left: none;
  822. }
  823. .footer__block-links-grp a {
  824. display: block;
  825. text-decoration: none;
  826. color: #696969;
  827. font-size: .9rem;
  828. margin-bottom: .4rem;
  829. }
  830. @media (max-width: 1100px) {
  831. .footer__block-links-grp a {
  832. font-size: .8rem;
  833. }
  834. }
  835. .footer__block-subscribe {
  836. width: 100%;
  837. margin-top: 1rem;
  838. }
  839. .footer__block-subscribe .subscribeBar {
  840. font-size: .8rem;
  841. width: 70%;
  842. margin-left: 7%;
  843. }
  844. @media (max-width: 900px) {
  845. .footer__block-subscribe .subscribeBar {
  846. width: 75%;
  847. margin-left: 3%;
  848. font-size: .7rem;
  849. }
  850. }
  851. .footer__block-subscribe .subscribeBtn {
  852. width: 20%;
  853. padding: .4rem .6rem;
  854. padding-bottom: 9px;
  855. border: none;
  856. outline: none;
  857. background-color: #292929;
  858. color: white;
  859. border-radius: 0 3px 3px 0;
  860. margin-left: -.4rem;
  861. }
  862. @media (max-width: 900px) {
  863. .footer__block-subscribe .subscribeBtn {
  864. margin-left: -.3rem;
  865. font-size: .8rem;
  866. padding-top: 9px;
  867. padding-bottom: 10px;
  868. }
  869. }
  870. .footer__list-item {
  871. display: -webkit-box;
  872. display: -ms-flexbox;
  873. display: flex;
  874. -webkit-box-align: center;
  875. -ms-flex-align: center;
  876. align-items: center;
  877. text-decoration: none;
  878. margin-bottom: .5rem;
  879. }
  880. .footer__list-item p {
  881. color: #696969;
  882. font-size: .9rem;
  883. font-weight: 300;
  884. }
  885. .footer__list-icon {
  886. width: 30px;
  887. display: -webkit-box;
  888. display: -ms-flexbox;
  889. display: flex;
  890. -webkit-box-pack: center;
  891. -ms-flex-pack: center;
  892. justify-content: center;
  893. margin-right: .3rem;
  894. }
  895. .footer .bottom-box {
  896. padding: 1rem 0;
  897. border-top: 1px solid #b9b9b9;
  898. margin-top: 2.5rem;
  899. }
  900. .like {
  901. display: none;
  902. }
  903. /*# sourceMappingURL=list-style.css.map */