Diligent web site
您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

custom.css 11KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617
  1. /* #navigation ul li.active.portfolio .nav-active-mark
  2. {
  3. bottom: -20px;
  4. } */
  5. a:hover
  6. {
  7. text-decoration: none!important;
  8. }
  9. .h3
  10. {
  11. font-size: 36px;
  12. }
  13. .section-title h1
  14. {
  15. font: 72px 'bebas_neue', Helvetica, Arial, sans-serif;
  16. color: #1d1d1d;
  17. padding: 0;
  18. margin-bottom: -10px;
  19. }
  20. .red-background
  21. {
  22. background-color: #cd1e28
  23. }
  24. .white-background, .contact-social.linkedin .hex-area.white-background
  25. {
  26. background-color: #d7dbd8!important;
  27. }
  28. .gray-background, .contact-social.linkedin .outer-hex.gray-background
  29. {
  30. background-color: #9e9e9e !important;
  31. }
  32. .dark-blue-background ,.contact-social.linkedin .dark-blue-background.hex-area
  33. {
  34. background-color: #103576!important;
  35. }
  36. .light-blue-background, .contact-social.linkedin .light-blue-background.hex-area
  37. {
  38. background-color: #089bcf!important;
  39. }
  40. #gallery .contact-socials .contact-social-overlay .hex-area ,#portfolio-header .contact-socials .contact-social-overlay .hex-area {
  41. /*background-color: #d7dbd8!important;*/
  42. background-color: #cccccc!important;
  43. }
  44. #gallery .gallery-item-overlay .hex-area, #portfolio-header .gallery-item-overlay .hex-area{
  45. background-color: #d7dbd8!important;
  46. }
  47. #gallery .gallery-item-overlay .hex-area.no-partner
  48. {
  49. background-color: rgba(104,104,104)!important;
  50. position: relative;
  51. z-index: 999999999;
  52. }
  53. #gallery .hex_overlay
  54. {
  55. background-color: rgba(104,104,104)!important;
  56. position: relative;
  57. z-index: 99999999999;
  58. width: 100%;
  59. height: 100%;
  60. }
  61. #gallery .gallery-item-overlay .outer-hex , #portfolio-header .gallery-item-overlay .outer-hex {
  62. background-color: #9e9e9e;
  63. transition: background-color .35s;
  64. -webkit-transition: background-color .35s;
  65. }
  66. #gallery .flex-control-paging
  67. {
  68. display: none;
  69. }
  70. .white-color
  71. {
  72. color:#fff;
  73. }
  74. #gallery .gallery-item .socials {
  75. padding-top: 80px;
  76. }
  77. #gallery .gallery-item-overlay:hover .outer-hex, #portfolio-header .gallery-item-overlay:hover .outer-hex {
  78. background-color: rgba(153,60,149,0.7);
  79. }
  80. #intro {
  81. height: 540px;
  82. }
  83. #gallery .gallery-box
  84. {
  85. padding: 0px 100px;
  86. }
  87. #our_partners-section
  88. {
  89. position: relative;
  90. z-index: 1;
  91. padding-bottom: 55px;
  92. }
  93. #our_partners-wrap .our_partners-cont
  94. {
  95. position: absolute;
  96. width: 100%;
  97. height: 100%;
  98. left: 0;
  99. top: 0;
  100. opacity: .1;
  101. background-size: cover;
  102. background-color: #000;
  103. z-index: 4;
  104. }
  105. .gallery-cont
  106. {
  107. position: relative;
  108. z-index: 7;
  109. position: relative;
  110. opacity:1;
  111. }
  112. #gallery .contact-social .outer-hex, #portfolio-header .contact-social .outer-hex{
  113. background-color: #9e9e9e !important;
  114. }
  115. .services-wrap-cont
  116. {
  117. border-top: 5px solid #ddd;
  118. }
  119. .typewriter-span {
  120. font-size: 3.82rem;
  121. text-shadow: 0 0 2px #000;
  122. }
  123. .non-margin
  124. {
  125. margin: 0!important;
  126. }
  127. .about-item.highlight {
  128. background-color: #fff;
  129. }
  130. .about-item, .serevices-item {
  131. text-align: center;
  132. padding: 180px 5px;
  133. }
  134. #portfolio-header .hive .outer-hex:hover
  135. {
  136. background-color: rgba(153,60,149,0.7)!important;
  137. }
  138. #galery .gallery-item-overlay:hover .hex-area.no-partner
  139. {
  140. background-color: #d7dbd8!important;
  141. }
  142. #gallery .section-triangle-grey
  143. {
  144. /*background-color: #f6f6f6;*/
  145. display: none;
  146. }
  147. #about-section
  148. {
  149. padding-bottom: 240px;
  150. }
  151. #gallery
  152. {
  153. position: relative;
  154. }
  155. #our_partners-wrap::before{
  156. content: "";
  157. position: absolute;
  158. width: 0;
  159. height: 0;
  160. border-style: solid;
  161. border-width: 36px 63px 0px 63px;
  162. border-color: #f6f6f6 transparent transparent transparent;
  163. top: 0;
  164. left:50%;
  165. transform: translateX(-50%);
  166. z-index: 11;
  167. }
  168. #our_partners_title
  169. {
  170. font-size: 40px;
  171. }
  172. #services:before
  173. {
  174. content: "";
  175. position: absolute;
  176. width: 0;
  177. height: 0;
  178. border-style: solid;
  179. border-width: 36px 63px 0px 63px;
  180. border-color: #060504 transparent transparent transparent;
  181. top: -5px;
  182. left: 50%;
  183. transform: translateX(-50%);
  184. z-index: 11;
  185. opacity: .8;
  186. }
  187. .successfully
  188. {
  189. color:#00FF00;
  190. }
  191. .error
  192. {
  193. background-color: #FF0000;
  194. }
  195. /*careers page*/
  196. .careers-intro
  197. {
  198. min-height: 500px;
  199. padding-top: 30px;
  200. padding-bottom: 100px;
  201. display: flex;
  202. flex-direction: row;
  203. }
  204. .careers .section-title
  205. {
  206. position: relative;
  207. }
  208. .careers, .apply-form-cont
  209. {
  210. padding-top: 70px;
  211. padding-bottom: 80px;
  212. }
  213. .careers .one_half
  214. {
  215. float: left;
  216. }
  217. .position-cont
  218. {
  219. position: relative;
  220. width:100%;
  221. }
  222. .position
  223. {
  224. position: relative;
  225. width:100%;
  226. color: inherit;
  227. padding: 16px 35px;
  228. border: 4px solid #993c95;
  229. display: flex;
  230. flex-direction: column;
  231. justify-content: space-between;
  232. margin-bottom: 20px;
  233. color: #1d1d1d;
  234. -webkit-transition: background-color .35s, color .35s;
  235. transition: background-color .35s, color .35s;
  236. border-radius: 65px;
  237. cursor: pointer;
  238. }
  239. .position:hover
  240. {
  241. background-color: #993c95!important;
  242. color:#fff!important;
  243. }
  244. .position.active{
  245. background-color: #993c95!important;
  246. color:#fff!important;
  247. }
  248. .position-name
  249. {
  250. padding-top: 20px;
  251. }
  252. .position-name h4
  253. {
  254. position: relative;
  255. margin-right: 55px;
  256. }
  257. .chevron
  258. {
  259. position: absolute;
  260. top: 50%;
  261. right: 30px;
  262. transform: translateY(-50%);
  263. }
  264. .chevron__line1, .chevron__line2
  265. {
  266. stroke-width: 10;
  267. stroke-linecap: round;
  268. -webkit-transition: -webkit-transform 0.4s, stroke 0.4s;
  269. transition: transform 0.4s, stroke 0.4s;
  270. }
  271. .chevron__line1 {
  272. -webkit-transform-origin: 50px 50px;
  273. transform-origin: 50px 50px;
  274. }
  275. .chevron__line2 {
  276. -webkit-transform-origin: 50px 50px;
  277. transform-origin: 50px 50px;
  278. }
  279. .chevron--down, .chevron--up {
  280. display: block;
  281. }
  282. .chevron--down .chevron__container, .chevron--up .chevron__container {
  283. -webkit-transition: -webkit-transform 0.4s;
  284. transition: transform 0.4s;
  285. -webkit-transform: translateY(13px);
  286. transform: translateY(13px);
  287. }
  288. .chevron--down .chevron__line1, .chevron--up .chevron__line1 {
  289. stroke: #993c95;
  290. -webkit-transform: rotate(40deg);
  291. transform: rotate(40deg);
  292. }
  293. .chevron--down .chevron__line2, .chevron--up .chevron__line2 {
  294. stroke: #993c95;
  295. -webkit-transform: rotate(-40deg);
  296. transform: rotate(-40deg);
  297. }
  298. .chevron--up .chevron__container {
  299. -webkit-transform: translateY(-13px);
  300. transform: translateY(-13px);
  301. }
  302. .chevron--up .chevron__line1 {
  303. stroke: white;
  304. -webkit-transform: rotate(-40deg);
  305. transform: rotate(-40deg);
  306. }
  307. .chevron--up .chevron__line2 {
  308. stroke: white;
  309. -webkit-transform: rotate(40deg);
  310. transform: rotate(40deg);
  311. }
  312. .position:hover .chevron--down .chevron__line1, .position:hover .chevron--down .chevron__line2 {
  313. stroke: #fff;
  314. }
  315. .position-content {
  316. padding: 30px 0px;
  317. }
  318. .apply-cont
  319. {
  320. height: auto;
  321. width: 100%;
  322. text-align: center;
  323. margin-top: 50px;
  324. }
  325. .btn-apply
  326. {
  327. color: #fff;
  328. padding: 20px;
  329. border-radius: 45px;
  330. background-color: #993c95;
  331. border: none;
  332. font-size: 1.5rem;
  333. font-weight: bold;
  334. cursor: pointer;
  335. }
  336. .btn-apply:hover{
  337. opacity: .8;
  338. color: #fff;
  339. }
  340. /*end careers*/
  341. /*apply page*/
  342. .apply-title-cont
  343. {
  344. text-align: center;
  345. padding-bottom: 25px;
  346. }
  347. .aplly-title
  348. {
  349. margin-top: 30px;
  350. }
  351. .apply-form-cont .selectize-input input[type="text"]
  352. {
  353. display: none;
  354. }
  355. .apply-form-cont .selectize-control
  356. {
  357. position: relative;
  358. margin-bottom: 30px;
  359. border-bottom: 2px solid #993c95;
  360. cursor: pointer;
  361. }
  362. .apply-form-cont .selectize-control .item
  363. {
  364. padding: 13px 0px 12px 10px;
  365. background-color: #fff;
  366. border-bottom: 1px solid #993c95;
  367. }
  368. .apply-form-cont .selectize-control:hover:after{
  369. color: #993c95;
  370. }
  371. .apply-form-cont .selectize-control:after
  372. {
  373. content:"\25bc";
  374. position: absolute;
  375. right:0;
  376. top:11px;
  377. font-size: 20px;
  378. pointer-events: none;
  379. }
  380. .apply-form-cont .selectize-dropdown
  381. {
  382. position: absolute;
  383. }
  384. .apply-form-cont .selectize-dropdown-content .option
  385. {
  386. background-color: #fff;
  387. -webkit-transition: background-color 0.35s;
  388. transition: background-color 0.35s;
  389. padding: 7px 5px;
  390. padding-left: 10px;
  391. }
  392. .apply-form-cont .selectize-dropdown-content .option:hover{
  393. background-color: #993c95;
  394. color: #fff;
  395. }
  396. .apply-field:not(.resume-file)
  397. {
  398. width:100%;
  399. height:50px;
  400. margin-bottom: 30px;
  401. padding-left: 10px;
  402. border:none;
  403. border-bottom:2px solid #993c95;
  404. }
  405. input[type="file"].apply-field
  406. {
  407. opacity: 0;
  408. /* visibility: hidden; */
  409. position: relative;
  410. z-index: 3;
  411. cursor: pointer;
  412. }
  413. .resume-cont
  414. {
  415. display: block;
  416. position: relative;
  417. z-index: 1;
  418. }
  419. .resume-cont label
  420. {
  421. display: inline-block;
  422. margin-bottom: .5rem;
  423. position: absolute;
  424. font-size: 1.3rem;
  425. /* right: 85px; */
  426. left:50px;
  427. top: 5px;
  428. cursor: pointer;
  429. z-index: 1;
  430. pointer-events: none;
  431. }
  432. .apply-option
  433. {
  434. padding: 10px 0px;
  435. }
  436. .apply-option:hover
  437. {
  438. background-color: #993c95;
  439. }
  440. .apply-field::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  441. opacity: 1; /* Firefox */
  442. }
  443. select.apply-field
  444. {
  445. cursor: pointer;
  446. }
  447. .apply-field:not(.resume-file){
  448. display: block;
  449. }
  450. textarea.apply-field
  451. {
  452. resize: none;
  453. padding-top: 13px;
  454. height: 170px!important;
  455. }
  456. .apply-submit
  457. {
  458. float:right;
  459. display: block;
  460. width: 84px;
  461. height: 24px;
  462. color: #1d1d1d;
  463. border: none;
  464. font-size: 14px;
  465. font-weight: bold;
  466. float: right;
  467. cursor: pointer;
  468. margin-top: 20px;
  469. background-color: #993c95;
  470. transition: opacity 300ms;
  471. -webkit-transition: opacity 300ms;
  472. }
  473. .apply-submit:hover,.contact-form input#submit:hover
  474. {
  475. opacity: .8;
  476. }
  477. .collapse
  478. {
  479. transition: display 300ms;
  480. -webkit-transition: display 300ms;
  481. }
  482. .resume-file
  483. {
  484. display: block;
  485. }
  486. .delete-file
  487. {
  488. position: relative;
  489. }
  490. .btn-delete-file
  491. {
  492. position: relative;
  493. float: right;
  494. height: 30px;
  495. width: 30px;
  496. cursor: pointer;
  497. z-index: 1;
  498. border: none;
  499. background-color: transparent;
  500. }
  501. .btn-delete-file svg{
  502. font-size: 20px;
  503. }
  504. .btn-delete-file svg path
  505. {
  506. transition: fill 300ms;
  507. -webkit-transition: fill 300ms;
  508. }
  509. .btn-delete-file:hover svg path{
  510. fill: #993c95;
  511. }
  512. .apply-submit:focus,.btn-delete-file:focus{
  513. border:none;
  514. outline: none;
  515. }
  516. .apply-msg-cont
  517. {
  518. margin-top: 50px;
  519. text-align: center;
  520. }
  521. .apply-msg
  522. {
  523. visibility: hidden;
  524. opacity: 0;
  525. color: #28a745;
  526. transition: visibility 0s linear 300ms, opacity 300ms;
  527. -webkit-transition: visibility 0s linear 300ms, opacity 300ms;
  528. font-size: 20px;
  529. }
  530. .apply-msg.active
  531. {
  532. visibility: visible;
  533. opacity: 1;
  534. }
  535. /*apply page end*/
  536. .slides > * {
  537. opacity :1!important;
  538. }
  539. .mobile-nav-toggle:hover{
  540. color: #993c95;
  541. }
  542. @media (max-width: 1024px){
  543. #gallery .gallery-box
  544. {
  545. padding: 0px 80px;
  546. }
  547. }
  548. @media (max-width: 768px){
  549. #gallery .gallery-box
  550. {
  551. padding: 0px 50px;
  552. }
  553. .careers-intro
  554. {
  555. flex-direction: column;
  556. }
  557. }
  558. @media (max-width: 480px){
  559. #gallery .gallery-box
  560. {
  561. padding:0px;
  562. }
  563. .chevron
  564. {
  565. right:20px;
  566. }
  567. .position-name h4
  568. {
  569. position: relative;
  570. margin-right: 55px;
  571. font-size: 1.2rem;
  572. }
  573. }
  574. .diligent-purple-background
  575. {
  576. background-color: #993c95 !important;
  577. }
  578. .diligent-purple-title
  579. {
  580. color: #993c95 !important;
  581. }