You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

1513 lines
32 KiB

  1. // Brink Pink CSS
  2. $light-green-color: #44ce6f;
  3. $white-color: #ffffff;
  4. $black-color: #0e314c;
  5. $navlink-color: #4a6f8a;
  6. $paragraph-color: #6084a4;
  7. $brink-pink-color: #f48665;
  8. $bg-color: #f7fafd;
  9. $bg-color2: #f9f6f6;
  10. $hosting-main-color: #032b8d;
  11. $gradient-color: linear-gradient(135deg, #f48665 0%, #fda23f 100%);
  12. $gradient-color2: linear-gradient(to right bottom, #1fa2ff, #00c0ff, #00d9f2, #53eedd, #a6ffcb);
  13. a {
  14. &:hover, &:focus {
  15. color: $brink-pink-color;
  16. }
  17. }
  18. .btn-primary {
  19. background-color: $brink-pink-color;
  20. box-shadow: 0 13px 27px 0 rgba(244, 134, 101, 0.25);
  21. &:hover, &:focus, &:active {
  22. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  23. }
  24. &:not(:disabled):not(.disabled).active, &:not(:disabled):not(.disabled):active, & .show > &.dropdown-toggle {
  25. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  26. }
  27. &.disabled, &:disabled {
  28. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  29. }
  30. &.disabled:hover, &.disabled:focus, &:disabled:hover, &:disabled:focus {
  31. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  32. }
  33. }
  34. .btn {
  35. &::after, &::before {
  36. background: $light-green-color;
  37. }
  38. }
  39. .owl-theme {
  40. .owl-dots {
  41. .owl-dot {
  42. &:hover, &.active {
  43. span {
  44. background: $brink-pink-color;
  45. }
  46. }
  47. }
  48. }
  49. }
  50. .form-control {
  51. &:focus {
  52. background: $white-color;
  53. border-color: $brink-pink-color;
  54. }
  55. }
  56. .section-title {
  57. .bar {
  58. background: #ffddd3;
  59. &::before {
  60. background: $brink-pink-color;
  61. }
  62. }
  63. }
  64. .preloader {
  65. background: $brink-pink-color;
  66. }
  67. .startp-mobile-nav {
  68. &.mean-container {
  69. .mean-nav {
  70. ul {
  71. li {
  72. a {
  73. &.active {
  74. color: $brink-pink-color;
  75. }
  76. }
  77. }
  78. }
  79. }
  80. }
  81. }
  82. .startp-nav {
  83. nav {
  84. .navbar-nav {
  85. .nav-item {
  86. a {
  87. color: $navlink-color;
  88. &:hover, &:focus, &.active {
  89. color: $brink-pink-color;
  90. }
  91. }
  92. .dropdown_menu {
  93. li {
  94. a {
  95. color: $navlink-color;
  96. &:hover, &:focus, &.active {
  97. color: $brink-pink-color;
  98. }
  99. }
  100. .dropdown_menu {
  101. li {
  102. a {
  103. color: $navlink-color;
  104. &:hover, &:focus, &.active {
  105. color: $brink-pink-color;
  106. }
  107. }
  108. }
  109. }
  110. &:hover {
  111. a {
  112. color: $brink-pink-color;
  113. }
  114. }
  115. }
  116. }
  117. }
  118. }
  119. .others-option {
  120. .btn {
  121. &.btn-light {
  122. border-color: #d6b4e7;
  123. &:hover, &:focus {
  124. color: $white-color;
  125. border-color: $brink-pink-color;
  126. }
  127. &::after, &::before {
  128. background: $brink-pink-color;
  129. }
  130. }
  131. &.btn-primary {
  132. background: $light-green-color;
  133. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  134. &::after, &::before {
  135. background: $brink-pink-color;
  136. box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
  137. }
  138. }
  139. }
  140. }
  141. }
  142. }
  143. .others-option-for-responsive {
  144. .dot-menu {
  145. &:hover {
  146. .inner {
  147. .circle {
  148. background-color: $brink-pink-color;
  149. }
  150. }
  151. }
  152. }
  153. .option-inner {
  154. .others-option {
  155. .btn {
  156. &.btn-light {
  157. border-color: #d6b4e7;
  158. &:hover, &:focus {
  159. color: $white-color;
  160. border-color: $brink-pink-color;
  161. }
  162. &::after, &::before {
  163. background: $brink-pink-color;
  164. }
  165. }
  166. &.btn-primary {
  167. background: $light-green-color;
  168. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  169. &::after, &::before {
  170. background: $brink-pink-color;
  171. box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
  172. }
  173. }
  174. }
  175. }
  176. }
  177. }
  178. .hosting-main-banner {
  179. .hosting-banner-content {
  180. ul {
  181. li {
  182. &::before {
  183. background: $brink-pink-color;
  184. }
  185. }
  186. }
  187. }
  188. }
  189. .single-box {
  190. &::before {
  191. background: $gradient-color;
  192. }
  193. }
  194. .single-why-choose-us {
  195. .icon {
  196. color: $brink-pink-color;
  197. }
  198. &::before {
  199. background: $gradient-color;
  200. }
  201. }
  202. .services-content {
  203. .box {
  204. &::before {
  205. background: $gradient-color;
  206. }
  207. svg {
  208. color: $brink-pink-color;
  209. }
  210. }
  211. }
  212. .single-services-box {
  213. &::before, &::after {
  214. background: $brink-pink-color;
  215. }
  216. }
  217. .services-details-desc {
  218. .services-details-accordion {
  219. .accordion {
  220. .accordion-title {
  221. i {
  222. background: $brink-pink-color;
  223. }
  224. }
  225. }
  226. }
  227. }
  228. .single-features {
  229. &:hover {
  230. .icon {
  231. background: $brink-pink-color;
  232. color: $white-color;
  233. &.bg-c679e3 {
  234. background: $brink-pink-color;
  235. }
  236. &.bg-eb6b3d {
  237. background: $brink-pink-color;
  238. }
  239. }
  240. }
  241. }
  242. .single-hosting-features {
  243. &::before, &::after {
  244. background: $brink-pink-color;
  245. }
  246. }
  247. .features-details-desc {
  248. .features-details-list {
  249. li {
  250. &::before {
  251. background: $brink-pink-color;
  252. }
  253. }
  254. }
  255. .features-details-accordion {
  256. .accordion {
  257. .accordion-title {
  258. i {
  259. background: $brink-pink-color;
  260. }
  261. }
  262. }
  263. }
  264. }
  265. .single-team {
  266. .team-content {
  267. ul {
  268. li {
  269. a {
  270. color: $light-green-color;
  271. &:hover {
  272. color: $brink-pink-color;
  273. }
  274. }
  275. }
  276. }
  277. }
  278. .team-info {
  279. background: $gradient-color;
  280. }
  281. &:hover {
  282. .team-image {
  283. img {
  284. border-color: $brink-pink-color;
  285. }
  286. }
  287. }
  288. }
  289. .single-works {
  290. &::before {
  291. background: $gradient-color;
  292. }
  293. }
  294. .funfact {
  295. h3 {
  296. color: $brink-pink-color;
  297. }
  298. }
  299. .contact-cta-box {
  300. .btn {
  301. &::before, &::after {
  302. background: $brink-pink-color;
  303. }
  304. }
  305. .btn-primary {
  306. background: $light-green-color;
  307. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  308. &:hover, &:focus {
  309. box-shadow: 0 13px 27px 0 rgba(244, 134, 101, 0.25);
  310. }
  311. }
  312. }
  313. .pricing-table {
  314. .pricing-header {
  315. &::before {
  316. background: $gradient-color;
  317. }
  318. }
  319. .price {
  320. span {
  321. color: $brink-pink-color;
  322. }
  323. }
  324. &.active-plan {
  325. .btn-primary {
  326. background: $light-green-color;
  327. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  328. &::after, &::before {
  329. background: $brink-pink-color;
  330. box-shadow: 0 13px 27px 0 rgba(244, 134, 101, 0.25);
  331. }
  332. }
  333. }
  334. }
  335. .single-pricing-table {
  336. .price {
  337. span {
  338. color: $brink-pink-color;
  339. }
  340. }
  341. &.active-plan {
  342. .btn-primary {
  343. background: $light-green-color;
  344. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  345. &::after, &::before {
  346. background: $brink-pink-color;
  347. box-shadow: 0 13px 27px 0 rgba(244, 134, 101, 0.25);
  348. }
  349. }
  350. }
  351. }
  352. .domain-search-content {
  353. form {
  354. button {
  355. background-color: $brink-pink-color;
  356. &:hover, &:focus {
  357. background-color: $light-green-color;
  358. }
  359. }
  360. }
  361. }
  362. .feedback-slides {
  363. .client-feedback {
  364. .single-feedback {
  365. .client-img {
  366. img {
  367. border-color: $brink-pink-color;
  368. }
  369. }
  370. span {
  371. color: $light-green-color;
  372. }
  373. }
  374. }
  375. .client-thumbnails {
  376. .item {
  377. .img-fill {
  378. img {
  379. border-color: $brink-pink-color;
  380. }
  381. }
  382. }
  383. }
  384. }
  385. .client-thumbnails {
  386. .next-arrow, .prev-arrow {
  387. &::before {
  388. background: $gradient-color;
  389. }
  390. &:hover {
  391. color: $white-color;
  392. border-color: $brink-pink-color;
  393. }
  394. }
  395. }
  396. .testimonials-slides {
  397. &.owl-theme {
  398. .owl-dots {
  399. .owl-dot {
  400. &:hover, &.active {
  401. span {
  402. border-color: $brink-pink-color;
  403. &::before {
  404. background: $brink-pink-color;
  405. }
  406. }
  407. }
  408. }
  409. }
  410. }
  411. }
  412. .single-feedback-item {
  413. .client-info {
  414. .image {
  415. img {
  416. border-color: $brink-pink-color;
  417. }
  418. }
  419. .title {
  420. span {
  421. color: $light-green-color;
  422. }
  423. }
  424. }
  425. }
  426. .ready-to-talk {
  427. background: $gradient-color;
  428. .btn-primary {
  429. background: $light-green-color;
  430. }
  431. }
  432. .single-blog-post {
  433. .blog-image {
  434. .date {
  435. background: $gradient-color;
  436. }
  437. }
  438. .blog-post-content {
  439. span {
  440. a {
  441. &:hover {
  442. color: $brink-pink-color;
  443. }
  444. }
  445. }
  446. .read-more-btn {
  447. &:hover {
  448. color: $brink-pink-color;
  449. }
  450. }
  451. }
  452. }
  453. .single-products {
  454. .products-image {
  455. ul {
  456. li {
  457. a {
  458. &:hover, &:focus {
  459. background-color: $brink-pink-color;
  460. }
  461. }
  462. }
  463. }
  464. }
  465. }
  466. #productsModalCenter {
  467. .modal-content {
  468. button.close {
  469. &:hover, &:focus {
  470. background-color: $brink-pink-color;
  471. }
  472. }
  473. .products-content {
  474. form {
  475. .quantity {
  476. .input-counter {
  477. span {
  478. &:hover {
  479. color: $brink-pink-color;
  480. }
  481. }
  482. }
  483. }
  484. button {
  485. background: $brink-pink-color;
  486. &:hover, &:focus {
  487. background-color: $light-green-color;
  488. }
  489. }
  490. }
  491. }
  492. }
  493. }
  494. .products-details {
  495. .availability {
  496. span {
  497. color: $brink-pink-color;
  498. }
  499. }
  500. form {
  501. .quantity {
  502. .input-counter {
  503. span {
  504. &:hover {
  505. color: $brink-pink-color;
  506. }
  507. }
  508. }
  509. }
  510. button {
  511. background: $brink-pink-color;
  512. &:hover, &:focus {
  513. background-color: $light-green-color;
  514. }
  515. }
  516. .add-to-wishlist-btn {
  517. &:hover, &:focus {
  518. background-color: $light-green-color;
  519. border-color: $light-green-color;
  520. }
  521. }
  522. .buy-btn {
  523. margin-top: 20px;
  524. .btn-primary {
  525. background: $light-green-color;
  526. box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
  527. &::after, &::before {
  528. background: $brink-pink-color;
  529. box-shadow: 0 13px 27px 0 rgba(244, 134, 101, 0.25);
  530. }
  531. }
  532. }
  533. }
  534. .products-share-social {
  535. ul {
  536. li {
  537. a {
  538. border-color: $brink-pink-color;
  539. color: $brink-pink-color;
  540. &:hover {
  541. background: $brink-pink-color;
  542. color: $white-color;
  543. }
  544. }
  545. }
  546. }
  547. }
  548. }
  549. .products-details-tabs {
  550. #tabs {
  551. li {
  552. &.active {
  553. &::before {
  554. background: $brink-pink-color;
  555. }
  556. }
  557. }
  558. }
  559. }
  560. .cart-table {
  561. table {
  562. tbody {
  563. tr {
  564. td {
  565. &.product-name {
  566. a {
  567. &:hover {
  568. color: $brink-pink-color;
  569. }
  570. }
  571. }
  572. &.product-quantity {
  573. .input-counter {
  574. span {
  575. &:hover {
  576. color: $brink-pink-color;
  577. }
  578. }
  579. }
  580. }
  581. }
  582. }
  583. }
  584. }
  585. }
  586. .user-actions {
  587. border-top-color: $brink-pink-color;
  588. svg {
  589. color: $brink-pink-color;
  590. }
  591. span {
  592. color: $brink-pink-color;
  593. a {
  594. &:hover, &:focus {
  595. color: $brink-pink-color;
  596. }
  597. }
  598. }
  599. }
  600. .order-details {
  601. .order-table {
  602. table {
  603. tbody {
  604. tr {
  605. td {
  606. &.product-name {
  607. a {
  608. &:hover {
  609. color: $brink-pink-color;
  610. }
  611. }
  612. }
  613. }
  614. }
  615. }
  616. }
  617. }
  618. .payment-method {
  619. p {
  620. [type="radio"] {
  621. &:checked, &:not(:checked) {
  622. + label {
  623. &::after {
  624. background: $brink-pink-color;
  625. }
  626. }
  627. }
  628. }
  629. }
  630. }
  631. }
  632. .faq-accordion {
  633. .accordion {
  634. .accordion-item {
  635. .accordion-title {
  636. i {
  637. background: $brink-pink-color;
  638. }
  639. }
  640. }
  641. }
  642. }
  643. .pagination-area {
  644. ul {
  645. .page-item {
  646. .page-link {
  647. &:hover, &:focus {
  648. background-color: $brink-pink-color;
  649. }
  650. }
  651. &.active {
  652. .page-link {
  653. background-color: $brink-pink-color;
  654. }
  655. }
  656. }
  657. }
  658. }
  659. .blog-details-desc {
  660. .article-content {
  661. .entry-meta {
  662. ul {
  663. li {
  664. a {
  665. &:hover {
  666. color: $brink-pink-color;
  667. }
  668. }
  669. svg {
  670. color: $light-green-color;
  671. }
  672. &::before {
  673. background: $brink-pink-color;
  674. }
  675. }
  676. }
  677. }
  678. .features-list {
  679. li {
  680. svg {
  681. color: $brink-pink-color;
  682. }
  683. }
  684. }
  685. }
  686. .article-footer {
  687. .article-tags {
  688. a {
  689. background-color: $light-green-color;
  690. &:hover {
  691. background-color: $brink-pink-color;
  692. }
  693. }
  694. }
  695. }
  696. }
  697. .comments-area {
  698. .comment-body {
  699. .reply {
  700. a {
  701. &:hover {
  702. background-color: $brink-pink-color;
  703. border-color: $brink-pink-color;
  704. }
  705. }
  706. }
  707. }
  708. .comment-metadata {
  709. a {
  710. &:hover {
  711. color: $brink-pink-color;
  712. }
  713. }
  714. }
  715. .comment-respond {
  716. input[type="date"], input[type="time"], input[type="datetime-local"], input[type="week"], input[type="month"], input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"], input[type="number"], textarea {
  717. &:focus {
  718. border-color: $brink-pink-color;
  719. }
  720. }
  721. .form-submit {
  722. input {
  723. background: $brink-pink-color;
  724. &:hover, &:focus {
  725. background-color: $light-green-color;
  726. }
  727. }
  728. }
  729. }
  730. }
  731. .prev-link-wrapper {
  732. a {
  733. &:hover {
  734. .prev-link-info-wrapper {
  735. color: $brink-pink-color;
  736. }
  737. }
  738. }
  739. .image-prev {
  740. &::after {
  741. background-color: $brink-pink-color;
  742. }
  743. }
  744. }
  745. .next-link-wrapper {
  746. a {
  747. &:hover {
  748. .next-link-info-wrapper {
  749. color: $brink-pink-color;
  750. }
  751. }
  752. }
  753. .image-next {
  754. &::after {
  755. background-color: $brink-pink-color;
  756. }
  757. }
  758. }
  759. blockquote, .blockquote {
  760. &::after {
  761. background-color: $brink-pink-color;
  762. }
  763. }
  764. .widget-area {
  765. .widget {
  766. .widget-title {
  767. &::before {
  768. background: $brink-pink-color;
  769. }
  770. }
  771. }
  772. .widget_search {
  773. form {
  774. .search-field {
  775. &:focus {
  776. border-color: $brink-pink-color;
  777. }
  778. }
  779. button {
  780. background-color: $brink-pink-color;
  781. &:hover {
  782. background-color: $light-green-color;
  783. }
  784. }
  785. }
  786. }
  787. .widget_recent_entries {
  788. ul {
  789. li {
  790. &::before {
  791. background: $brink-pink-color;
  792. }
  793. a {
  794. &:hover {
  795. color: $brink-pink-color;
  796. }
  797. }
  798. }
  799. }
  800. }
  801. .widget_recent_comments {
  802. ul {
  803. li {
  804. &::before {
  805. background: $brink-pink-color;
  806. }
  807. a {
  808. &:hover {
  809. color: $brink-pink-color;
  810. }
  811. }
  812. }
  813. }
  814. }
  815. .widget_archive {
  816. ul {
  817. li {
  818. &::before {
  819. background: $brink-pink-color;
  820. }
  821. a {
  822. &:hover {
  823. color: $brink-pink-color;
  824. }
  825. }
  826. }
  827. }
  828. }
  829. .widget_categories {
  830. ul {
  831. li {
  832. &::before {
  833. background: $brink-pink-color;
  834. }
  835. a {
  836. &:hover {
  837. color: $brink-pink-color;
  838. }
  839. }
  840. }
  841. }
  842. }
  843. .widget_meta {
  844. ul {
  845. li {
  846. &::before {
  847. background: $brink-pink-color;
  848. }
  849. a {
  850. &:hover {
  851. color: $brink-pink-color;
  852. }
  853. }
  854. }
  855. }
  856. }
  857. .tagcloud {
  858. a {
  859. &:hover, &:focus {
  860. background-color: $brink-pink-color;
  861. border-color: $brink-pink-color;
  862. }
  863. }
  864. }
  865. }
  866. .project-details-image {
  867. a {
  868. &:hover {
  869. color: $brink-pink-color;
  870. }
  871. }
  872. }
  873. .project-details-desc {
  874. .project-details-information {
  875. .single-info-box {
  876. ul {
  877. li {
  878. a {
  879. &:hover {
  880. color: $brink-pink-color;
  881. }
  882. }
  883. }
  884. }
  885. }
  886. }
  887. }
  888. .contact-info-box {
  889. .icon {
  890. color: $brink-pink-color;
  891. }
  892. p {
  893. a {
  894. &:hover {
  895. color: $brink-pink-color;
  896. }
  897. }
  898. }
  899. &:hover {
  900. .icon {
  901. background: $brink-pink-color;
  902. }
  903. }
  904. }
  905. .coming-soon-area {
  906. .social-list {
  907. li {
  908. a {
  909. background: $light-green-color;
  910. &:hover, &:focus {
  911. background-color: $brink-pink-color;
  912. }
  913. }
  914. }
  915. }
  916. }
  917. .coming-soon-content {
  918. form {
  919. .submit-btn {
  920. background-color: $brink-pink-color;
  921. &:hover, &:focus {
  922. background: $light-green-color;
  923. }
  924. }
  925. }
  926. #timer {
  927. div {
  928. color: $light-green-color;
  929. }
  930. }
  931. }
  932. .cta-area {
  933. background: $gradient-color;
  934. }
  935. .cta-right-content {
  936. .buy-btn {
  937. .btn-primary {
  938. background: $light-green-color;
  939. box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
  940. &::after, &::before {
  941. background: $white-color;
  942. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  943. }
  944. &:hover, &:focus {
  945. color: $light-green-color;
  946. }
  947. }
  948. }
  949. }
  950. .repair-about-content {
  951. .sub-title {
  952. color: $brink-pink-color;
  953. }
  954. ul {
  955. li {
  956. span {
  957. svg {
  958. color: $brink-pink-color;
  959. }
  960. &::before {
  961. background: $gradient-color;
  962. }
  963. }
  964. }
  965. }
  966. }
  967. .single-repair-services {
  968. &::before {
  969. border-color: #fbf0ec;
  970. }
  971. &::after {
  972. background: $gradient-color;
  973. }
  974. .icon {
  975. color: $brink-pink-color;
  976. border-color: #fbf0ec;
  977. }
  978. &:hover, &:focus {
  979. a {
  980. color: $brink-pink-color;
  981. }
  982. }
  983. }
  984. .repair-why-choose-us {
  985. background: $gradient-color;
  986. }
  987. .single-repair-box {
  988. border-color: #fbf0ec;
  989. .icon {
  990. &::before {
  991. background: $gradient-color2;
  992. }
  993. }
  994. &:hover, &:focus {
  995. border-color: $brink-pink-color;
  996. a {
  997. background-color: $brink-pink-color;
  998. }
  999. }
  1000. }
  1001. .single-repair-feedback {
  1002. .client-img {
  1003. img {
  1004. border-color: $brink-pink-color;
  1005. }
  1006. span {
  1007. color: $light-green-color;
  1008. }
  1009. }
  1010. }
  1011. .iot-banner-content {
  1012. span {
  1013. color: $brink-pink-color;
  1014. }
  1015. }
  1016. .single-iot-services {
  1017. border-color: #fbf0ec;
  1018. &::after {
  1019. background: $gradient-color;
  1020. }
  1021. .icon {
  1022. border-color: #fbf0ec;
  1023. color: $brink-pink-color;
  1024. }
  1025. &:hover, &:focus {
  1026. a {
  1027. color: $brink-pink-color;
  1028. }
  1029. }
  1030. }
  1031. .iot-why-choose-us {
  1032. background: $gradient-color;
  1033. }
  1034. .single-iot-box {
  1035. border-color: #fbf0ec;
  1036. &:hover, &:focus {
  1037. border-color: $brink-pink-color;
  1038. a {
  1039. background-color: $brink-pink-color;
  1040. }
  1041. }
  1042. }
  1043. .section-title {
  1044. .sub-title {
  1045. color: $light-green-color;
  1046. background-color: #d4f7df;
  1047. }
  1048. }
  1049. .btn {
  1050. &.btn-secondary {
  1051. background-color: $brink-pink-color;
  1052. box-shadow: 5px 5px 5px #ffcfc0;
  1053. &::before {
  1054. background: $light-green-color;
  1055. }
  1056. &::after {
  1057. background: $light-green-color;
  1058. }
  1059. &:not(:disabled):not(.disabled).active, &:not(:disabled):not(.disabled):active, .show>&.dropdown-toggle {
  1060. background-color: $brink-pink-color;
  1061. border-color: $brink-pink-color;
  1062. }
  1063. &:not(:disabled):not(.disabled).active:focus, &:not(:disabled):not(.disabled):active:focus, .show>&.dropdown-toggle:focus {
  1064. box-shadow: 5px 5px 5px #a6f5be;
  1065. }
  1066. &:hover, &:focus {
  1067. box-shadow: 5px 5px 5px #a6f5be;
  1068. }
  1069. }
  1070. }
  1071. .ml-about-content {
  1072. .sub-title {
  1073. color: $light-green-color;
  1074. background-color: #d4f7df;
  1075. }
  1076. .bar {
  1077. background: #ffddd3;
  1078. &::before {
  1079. background: $brink-pink-color;
  1080. }
  1081. }
  1082. }
  1083. .single-ml-services-box {
  1084. &::before {
  1085. background: $brink-pink-color;
  1086. }
  1087. }
  1088. .pricing-box {
  1089. .buy-btn {
  1090. .btn-primary {
  1091. &::after {
  1092. background: $brink-pink-color;
  1093. }
  1094. }
  1095. }
  1096. .pricing-features {
  1097. li {
  1098. svg {
  1099. color: $brink-pink-color;
  1100. }
  1101. }
  1102. }
  1103. }
  1104. .single-ml-feedback-item {
  1105. .client-info {
  1106. span {
  1107. color: $light-green-color;
  1108. }
  1109. }
  1110. }
  1111. .ml-feedback-slides {
  1112. .owl-dots {
  1113. .owl-dot {
  1114. span {
  1115. &::before {
  1116. background-color: $brink-pink-color;
  1117. }
  1118. }
  1119. &:hover, &.active {
  1120. span {
  1121. border-color: $brink-pink-color;
  1122. background-color: transparent;
  1123. }
  1124. }
  1125. }
  1126. }
  1127. }
  1128. .single-blog-post-box {
  1129. .entry-post-content {
  1130. .entry-meta {
  1131. ul {
  1132. li {
  1133. a {
  1134. &:hover {
  1135. color: $brink-pink-color;
  1136. }
  1137. }
  1138. }
  1139. }
  1140. }
  1141. }
  1142. }
  1143. .free-trial-content {
  1144. form {
  1145. button {
  1146. background-color: $brink-pink-color;
  1147. &:hover {
  1148. background-color: $light-green-color;
  1149. }
  1150. }
  1151. }
  1152. }
  1153. .single-ml-projects-box {
  1154. .plus-icon {
  1155. a {
  1156. background-color: $brink-pink-color;
  1157. &:hover {
  1158. background-color: $light-green-color;
  1159. }
  1160. }
  1161. }
  1162. }
  1163. .ml-projects-slides {
  1164. &.owl-theme {
  1165. .owl-dots {
  1166. .owl-dot {
  1167. span {
  1168. &::before {
  1169. background-color: $brink-pink-color;
  1170. }
  1171. }
  1172. &:hover, &.active {
  1173. span {
  1174. border-color: $brink-pink-color;
  1175. }
  1176. }
  1177. }
  1178. }
  1179. }
  1180. }
  1181. .solutions-box {
  1182. .icon {
  1183. color: $brink-pink-color;
  1184. }
  1185. .learn-more-btn {
  1186. &:hover {
  1187. color: $brink-pink-color;
  1188. }
  1189. }
  1190. }
  1191. .agency-about-content {
  1192. .sub-title {
  1193. color: $light-green-color;
  1194. background-color: #d4f7df;
  1195. }
  1196. .bar {
  1197. background: #ffddd3;
  1198. &::before {
  1199. background: $brink-pink-color;
  1200. }
  1201. }
  1202. }
  1203. .agency-services-box {
  1204. .content {
  1205. .read-more-btn {
  1206. &:hover {
  1207. background-color: $brink-pink-color;
  1208. border-color: $brink-pink-color;
  1209. }
  1210. }
  1211. }
  1212. }
  1213. .single-testimonials-item {
  1214. .client-info {
  1215. span {
  1216. color: $light-green-color;
  1217. }
  1218. }
  1219. }
  1220. .single-blog-post-item {
  1221. .post-content {
  1222. .post-meta {
  1223. li {
  1224. a {
  1225. &:hover {
  1226. color: $brink-pink-color;
  1227. }
  1228. }
  1229. }
  1230. }
  1231. .read-more-btn {
  1232. &:hover {
  1233. background-color: $brink-pink-color;
  1234. border-color: $brink-pink-color;
  1235. }
  1236. }
  1237. }
  1238. }
  1239. .single-footer-widget {
  1240. ul {
  1241. &.list {
  1242. li {
  1243. a {
  1244. &:hover {
  1245. color: $brink-pink-color;
  1246. }
  1247. }
  1248. }
  1249. }
  1250. &.footer-contact-info {
  1251. li {
  1252. a {
  1253. &:hover {
  1254. color: $brink-pink-color;
  1255. }
  1256. }
  1257. }
  1258. }
  1259. &.social-links {
  1260. li {
  1261. a {
  1262. border-color: $light-green-color;
  1263. &:hover {
  1264. background: $light-green-color;
  1265. color: $white-color;
  1266. }
  1267. }
  1268. }
  1269. }
  1270. }
  1271. }
  1272. .go-top {
  1273. background-color: $brink-pink-color;
  1274. &:hover {
  1275. background: $light-green-color;
  1276. }
  1277. }
  1278. .agency-portfolio-home-slides {
  1279. &.owl-theme {
  1280. .owl-nav {
  1281. [class*='owl-'] {
  1282. &:hover {
  1283. background-color: $brink-pink-color;
  1284. color: $white-color;
  1285. }
  1286. }
  1287. }
  1288. }
  1289. }
  1290. .single-text-box {
  1291. .learn-more-btn {
  1292. &:hover {
  1293. color: $brink-pink-color;
  1294. }
  1295. }
  1296. }
  1297. .creative-inner-area {
  1298. .col-lg-6 {
  1299. &:nth-child(1) {
  1300. .single-counter {
  1301. background-color: $brink-pink-color;
  1302. }
  1303. }
  1304. }
  1305. }
  1306. .navbar-color-white {
  1307. .startp-nav {
  1308. nav {
  1309. .navbar-nav {
  1310. .nav-item {
  1311. a {
  1312. &:hover, &:focus, &.active {
  1313. color: $brink-pink-color
  1314. }
  1315. }
  1316. }
  1317. }
  1318. .others-option {
  1319. .btn {
  1320. &.btn-primary {
  1321. background: $light-green-color;
  1322. box-shadow: 0 13px 27px 0 rgba(68, 206, 111, 0.25);
  1323. &::after, &::before {
  1324. background: $brink-pink-color;
  1325. box-shadow: 0 13px 27px 0 rgba(198, 121, 227, 0.25);
  1326. }
  1327. }
  1328. }
  1329. }
  1330. }
  1331. }
  1332. }
  1333. .single-banner-boxes {
  1334. &::before {
  1335. background: $gradient-color;
  1336. }
  1337. }
  1338. .single-what-we-do-box {
  1339. .icon {
  1340. background: $gradient-color;
  1341. }
  1342. }
  1343. .discover-area {
  1344. background: $gradient-color;
  1345. }
  1346. .single-services-box-item {
  1347. .learn-more-btn {
  1348. color: $brink-pink-color;
  1349. &:hover {
  1350. svg {
  1351. color: $brink-pink-color;
  1352. }
  1353. }
  1354. }
  1355. }
  1356. .single-funfact {
  1357. h3 {
  1358. color: $brink-pink-color;
  1359. }
  1360. }
  1361. .single-feedback-box {
  1362. &::before {
  1363. background: $gradient-color;
  1364. }
  1365. }
  1366. .industries-serve-area {
  1367. background: $gradient-color;
  1368. }
  1369. .newsletter-area {
  1370. &::before {
  1371. background: $gradient-color;
  1372. }
  1373. }
  1374. .newsletter-content {
  1375. &::before {
  1376. background: $gradient-color;
  1377. }
  1378. }
  1379. @media only screen and (max-width: 991px) {
  1380. .startp-responsive-nav {
  1381. .startp-responsive-menu {
  1382. &.mean-container {
  1383. .mean-nav {
  1384. ul {
  1385. li {
  1386. a {
  1387. &.active {
  1388. color: $brink-pink-color;
  1389. }
  1390. }
  1391. }
  1392. }
  1393. }
  1394. }
  1395. }
  1396. }
  1397. }