The text below is selected, press Ctrl+C to copy to your clipboard. (⌘+C on Mac) No line numbers will be copied.
Guest
Stest
By Guest on 15th September 2021 06:41:29 PM | Syntax: CSS | Views: 74



New paste | Download | Show/Hide line no. | Copy text to clipboard
  1. /*
  2. Theme Name: Galia
  3. Theme URI: https://galia.be/
  4. Author: the CMSLeader team
  5. Author URI: https://galia.be/
  6. Description: Custom theme
  7. Version: 1.0
  8. Requires at least: 4.4
  9. Requires PHP: 5.2.4
  10. License: GNU General Public License v2 or later
  11. License URI: http://www.gnu.org/licenses/gpl-2.0.html
  12. Tags: one-column, two-columns, right-sidebar, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, flexible-header, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready, blog, block-patterns
  13. Text Domain: galia
  14.  
  15. This theme, like WordPress, is licensed under the GPL.
  16. Use it to make something cool, have fun, and share what you've learned with others.
  17. */
  18.  
  19. /* Language seletor */
  20. .ft-wrap ul#menu-1-5d49802 li a span .trp-ls-language-name::after {
  21.     content: "→";
  22.     padding-left: 5px;
  23. }
  24.  
  25. .header-hidden-home {
  26.   display: none !important;
  27. }
  28.  
  29. .translatepress-nl_NL .ft-wrap .menu-item-2493, .translatepress-en_US .ft-wrap .menu-item-2491 {
  30.     display: none;
  31. }
  32.  
  33. .logged-in.admin-bar header#ha-header, .logged-in.admin-bar #page {
  34.   margin-top: 30px;
  35. }
  36.  
  37. .int-hd-wrap {
  38.   background-image: url(https://www.galia.be/wp-content/uploads/2021/04/integrations-hd1-scaled.jpeg);
  39.   background-size: cover;
  40.   background-position: center;
  41.   margin-top: 78px;
  42. }
  43.  
  44. .int-hd-inner {
  45.   text-align: center;
  46.   padding: 57px 0 87px;
  47.   background-color: rgb(28 28 28 / 85%);
  48. }
  49.  
  50. .int-hd-txt {
  51.   text-align: center;
  52.   max-width: 1000px;
  53.   margin: auto;
  54.   padding-left: 25px;
  55.   padding-right: 25px;
  56. }
  57.  
  58. .head-search-wrap {
  59.   margin-top: -35px;
  60.   padding-left: 23px;
  61.   padding-right: 23px;
  62. }
  63.  
  64. .int-hd-txt p {
  65.   line-height: 29px;
  66.   font-size: 19px;
  67. }
  68.  
  69. .int-search-wrap {
  70.   text-align: center;
  71.   width: 100%;
  72. }
  73. .int-search-wrap input#model_search, .int-search-wrap input#model_search:focus, .int-search-wrap input {
  74.   max-width: 800px;
  75.   padding: 12px 14px;
  76.   font-size: 17px;
  77.   border: 13px solid #41B4A8;
  78.   background-color: #fff;
  79.   width: 100%;
  80.   outline: none;
  81.   border-radius: 0 !important;
  82. }
  83.  
  84. .int-hd-wrap, .int-hd-wrap h1 {
  85.   color: #fff;
  86. }
  87.  
  88. .int-hd-wrap h1 {
  89.   padding-bottom: 0;
  90.   margin-bottom: 25px;
  91. }
  92.  
  93.  
  94. .int-logo-inner {
  95.   display: -webkit-box;
  96.   display: -ms-flexbox;
  97.   display: flex;
  98.   height: 80px;
  99.   -webkit-box-align: center;
  100.   -ms-flex-align: center;
  101.   align-items: center;
  102.   -webkit-box-pack: center;
  103.   -ms-flex-pack: center;
  104.   justify-content: center;
  105. }
  106.  
  107. .int-search-wrap .int-search-desc {
  108.   font-size: 16px;
  109.   margin: 11px 0;
  110.   color: #73797E;
  111. }
  112.  
  113. .int-search-wrap .tags-selection {
  114.   cursor: pointer;
  115.   color: #41B4A8;
  116.   text-decoration: underline;
  117. }
  118.  
  119. .int-wrap {
  120.   max-width: 1280px;
  121.   margin: 50px auto 75px;
  122.   padding: 0 25px;
  123. }
  124.  
  125. .int-inner {
  126.   display: -webkit-flex;
  127.     display: flex;
  128.     flex-wrap: wrap;
  129. }
  130.  
  131. .int-card-wrap {
  132.     float: left;
  133.     margin: 0.5%;
  134.     flex: 0 0 24%;
  135.     display: flex;
  136.     background-color: #fff;
  137.     flex-direction: column;
  138. }
  139. .int-logo-wrap img {
  140.   max-width: 172px;
  141.   max-height: 60px;
  142. }
  143.  
  144. .int-logo-wrap {
  145.   border-bottom: 2px solid #f4f4f4;
  146.   padding: 16px 0;
  147. }
  148.  
  149. div#int-334 img {
  150.   max-width: 130px;
  151. }
  152.  
  153. div#int-2079 img {
  154.   max-width: 150px;
  155. }
  156.  
  157. .int-card-inner {
  158.   padding: 0;
  159.   text-align: center;
  160. }
  161.  
  162. /*FONTS*/
  163. @font-face{font-family:'Museo Sans';src:url('fonts/museosans-300.eot');src:url('fonts/museosans-300.eot?#iefix') format('embedded-opentype'),url('fonts/museosans-300.woff2') format('woff2'),url('fonts/museosans-300.woff') format('woff'),url('fonts/museosans-300.ttf') format('truetype'),url('fonts/museosans-300.svg#Galia300') format('svg');font-weight:normal;font-style:normal}
  164. @font-face{font-family:'Museo Sans';src:url('fonts/museosans-500.eot');src:url('fonts/museosans-500.eot?#iefix') format('embedded-opentype'),url('fonts/museosans-500.woff2') format('woff2'),url('fonts/museosans-500.woff') format('woff'),url('fonts/museosans-500.ttf') format('truetype'),url('fonts/museosans-500.svg#Galia500') format('svg');font-weight:500;font-style:normal}
  165. @font-face{font-family:'Museo Sans';src:url('fonts/museosans-700.eot');src:url('fonts/museosans-700.eot?#iefix') format('embedded-opentype'),url('fonts/museosans-700.woff2') format('woff2'),url('fonts/museosans-700.woff') format('woff'),url('fonts/museosans-700.ttf') format('truetype'),url('fonts/museosans-700.svg#Galia500') format('svg');font-weight:700;font-style:normal}
  166. @font-face{font-family:'Playfair Display';src:url("fonts/playfairdisplay-regular.eot");src:url("fonts/playfairdisplay-regular.eot?#iefix") format("embedded-opentype"),url("fonts/playfairdisplay-regular.woff2") format("woff2"),url("fonts/playfairdisplay-regular.woff") format("woff"),url("fonts/playfairdisplay-regular.ttf") format("truetype"),url("fonts/playfairdisplay-regular.svg#playfair_displayregular") format("svg");font-weight:normal;font-style:normal}
  167. @font-face{font-family:'Playfair Display';src:url("fonts/playfairdisplay-italic.eot");src:url("fonts/playfairdisplay-italic.eot?#iefix") format("embedded-opentype"),url("fonts/playfairdisplay-italic.woff2") format("woff2"),url("fonts/playfairdisplay-italic.woff") format("woff"),url("fonts/playfairdisplay-italic.ttf") format("truetype"),url("fonts/playfairdisplay-italic.svg#playfair_displayitalic") format("svg");font-weight:normal;font-style:italic}
  168.  
  169.  
  170. body {
  171.   color: #444;
  172.   margin: 0;
  173.   padding: 0;
  174.   font-family: "Museo Sans",open sans;
  175.   font-size: 1.11em;
  176.   font-weight: 300;
  177.   line-height: 1.65em;
  178.   background-color: #f4f4f4;
  179.   -webkit-font-smoothing: antialiased;
  180.   -moz-osx-font-smoothing: grayscale;
  181. }
  182.  
  183. div.elementor-heading-title, input, textarea, textarea#form-field-message, .elementor-field-type-select.elementor-field-group .elementor-select-wrapper select {
  184.   font-family: "Museo Sans",open sans;
  185.   color: #444;
  186.   font-size: 17px;
  187.   font-weight: 300;
  188.   line-height: 1.70em;
  189.   -webkit-font-smoothing: antialiased;
  190.   -moz-osx-font-smoothing: grayscale;
  191.   border-top: 0;
  192.   border-right: 0;
  193.   border-left: 0;
  194.   outline: none;
  195. }
  196.  
  197. #ha-header li.current-menu-item a, #ha-header li a:hover, #ha-header li a:focus {color: #41b4a8}
  198.  
  199. .elementor-field-group .elementor-field-textual:focus {box-shadow: none !important;}
  200.  
  201. p {
  202.   margin: 0 0 16px;
  203. }
  204.  
  205. .dialog-message {
  206.   font-size: 17px;
  207. }
  208.  
  209.  h1, h2, h3, h4, h5 {
  210.   font-weight: 400;
  211.   color: #41b4a8;
  212.   padding: 0;
  213.   line-height: 1.3em;
  214.   font-family: "Playfair Display";
  215. }
  216.  
  217. h1 {
  218.   font-size: 42px;
  219. }
  220.  
  221. h2 {
  222.   font-size: 30px;
  223. }
  224.  
  225. h3, h3.elementor-heading-title {
  226.   font-size: 26px;
  227.   color: #73797e;
  228.   line-height: 34px
  229. }
  230.  
  231.  
  232. a {color: #41B4A8; text-decoration: none;}
  233.  
  234. .bl {float: left; width: 100%}
  235.  
  236.  
  237. .aniborder-white a {position: relative !important;color:#ffffff !important;background-color: transparent !important; padding:18px 26px !important;}
  238. .aniborder-white a::before  {
  239.     content: '';
  240.     width: 100%;
  241.     height: 100%;
  242.     top: 0;
  243.     left: 0;
  244.     position: absolute;
  245.     z-index: 9;
  246.         background-repeat: no-repeat;
  247.         background-image: -webkit-gradient(linear, left top, right top, color-stop(100%, #ffffff), to(#ffffff)), -webkit-gradient(linear, left top, left bottom, color-stop(100%, #ffffff), to(#ffffff)), -webkit-gradient(linear, left top, right top, color-stop(100%, #ffffff), to(#ffffff)), -webkit-gradient(linear, left top, left bottom, color-stop(100%, #ffffff), to(#ffffff));
  248.         background-image: -o-linear-gradient(left, #ffffff 100%, #ffffff 100%), -o-linear-gradient(top, #ffffff 100%, #ffffff 100%), -o-linear-gradient(left, #41B4A8 100%, #ffffff 100%), -o-linear-gradient(top, #ffffff 100%, #ffffff 100%);
  249.         background-image: linear-gradient(to right, #ffffff 100%, #ffffff 100%), linear-gradient(to bottom, #ffffff 100%, #ffffff 100%), linear-gradient(to right, #ffffff 100%, #ffffff 100%), linear-gradient(to bottom, #ffffff 100%, #ffffff 100%);
  250.         background-size: 100% 2px, 2px 100%, 100% 2px, 2px 100%;
  251.         background-position: 0 0, 100% 0, 100% 100%, 0 100%;
  252. }
  253.  
  254. .aniborder-white a:hover::before {
  255.     content: '';
  256.     width: 100%;
  257.     height: 100%;
  258.     top: 0;
  259.     left: 0;
  260.     position: absolute;
  261.     z-index: 9;
  262.         background-repeat: no-repeat;
  263.         background-image: -webkit-gradient(linear, left top, right top, color-stop(100%, #ffffff), to(#ffffff)), -webkit-gradient(linear, left top, left bottom, color-stop(100%, #ffffff), to(#ffffff)), -webkit-gradient(linear, left top, right top, color-stop(100%, #ffffff), to(#ffffff)), -webkit-gradient(linear, left top, left bottom, color-stop(100%, #ffffff), to(#ffffff));
  264.         background-image: -o-linear-gradient(left, #ffffff 100%, #ffffff 100%), -o-linear-gradient(top, #ffffff 100%, #ffffff 100%), -o-linear-gradient(left, #ffffff 100%, #ffffff 100%), -o-linear-gradient(top, #ffffff 100%, #ffffff 100%);
  265.         background-image: linear-gradient(to right, #ffffff 100%, #ffffff 100%), linear-gradient(to bottom, #ffffff 100%, #ffffff 100%), linear-gradient(to right, #ffffff 100%, #ffffff 100%), linear-gradient(to bottom, #ffffff 100%, #ffffff 100%);
  266.         background-size: 0 2px, 2px 0, 0 2px, 2px 0;
  267.         background-position: 0 0, 100% 0, 100% 100%, 0 100%;
  268.         -webkit-animation: aniborder 2.3s cubic-bezier(0.19, 1, 0.22, 1) forwards 0s;
  269.         animation: aniborder 2.3s cubic-bezier(0.19, 1, 0.22, 1) forwards 0s;
  270. }
  271.  
  272.  
  273. .aniborder a {position: relative !important;color:#41B4A8 !important;background-color: transparent !important; padding:18px 26px !important;}
  274. .aniborder.small a {padding:14px 16px !important;}
  275. .aniborder a::before  {
  276.     content: '';
  277.     width: 100%;
  278.     height: 100%;
  279.     top: 0;
  280.     left: 0;
  281.     position: absolute;
  282.     z-index: 9;
  283.         background-repeat: no-repeat;
  284.         background-image: -webkit-gradient(linear, left top, right top, color-stop(100%, #41B4A8), to(#41B4A8)), -webkit-gradient(linear, left top, left bottom, color-stop(100%, #41B4A8), to(#41B4A8)), -webkit-gradient(linear, left top, right top, color-stop(100%, #41B4A8), to(#41B4A8)), -webkit-gradient(linear, left top, left bottom, color-stop(100%, #41B4A8), to(#41B4A8));
  285.         background-image: -o-linear-gradient(left, #41B4A8 100%, #41B4A8 100%), -o-linear-gradient(top, #41B4A8 100%, #41B4A8 100%), -o-linear-gradient(left, #41B4A8 100%, #41B4A8 100%), -o-linear-gradient(top, #41B4A8 100%, #41B4A8 100%);
  286.         background-image: linear-gradient(to right, #41B4A8 100%, #41B4A8 100%), linear-gradient(to bottom, #41B4A8 100%, #41B4A8 100%), linear-gradient(to right, #41B4A8 100%, #41B4A8 100%), linear-gradient(to bottom, #41B4A8 100%, #41B4A8 100%);
  287.         background-size: 100% 2px, 2px 100%, 100% 2px, 2px 100%;
  288.         background-position: 0 0, 100% 0, 100% 100%, 0 100%;
  289. }
  290.  
  291. .aniborder a:hover::before {
  292.     content: '';
  293.     width: 100%;
  294.     height: 100%;
  295.     top: 0;
  296.     left: 0;
  297.     position: absolute;
  298.     z-index: 9;
  299.         background-repeat: no-repeat;
  300.         background-image: -webkit-gradient(linear, left top, right top, color-stop(100%, #41B4A8), to(#41B4A8)), -webkit-gradient(linear, left top, left bottom, color-stop(100%, #41B4A8), to(#41B4A8)), -webkit-gradient(linear, left top, right top, color-stop(100%, #41B4A8), to(#41B4A8)), -webkit-gradient(linear, left top, left bottom, color-stop(100%, #41B4A8), to(#41B4A8));
  301.         background-image: -o-linear-gradient(left, #41B4A8 100%, #41B4A8 100%), -o-linear-gradient(top, #41B4A8 100%, #41B4A8 100%), -o-linear-gradient(left, #41B4A8 100%, #41B4A8 100%), -o-linear-gradient(top, #41B4A8 100%, #41B4A8 100%);
  302.         background-image: linear-gradient(to right, #41B4A8 100%, #41B4A8 100%), linear-gradient(to bottom, #41B4A8 100%, #41B4A8 100%), linear-gradient(to right, #41B4A8 100%, #41B4A8 100%), linear-gradient(to bottom, #41B4A8 100%, #41B4A8 100%);
  303.         background-size: 0 2px, 2px 0, 0 2px, 2px 0;
  304.         background-position: 0 0, 100% 0, 100% 100%, 0 100%;
  305.         -webkit-animation: aniborder 2.3s cubic-bezier(0.19, 1, 0.22, 1) forwards 0s;
  306.         animation: aniborder 2.3s cubic-bezier(0.19, 1, 0.22, 1) forwards 0s;
  307. }
  308.  
  309. @-webkit-keyframes aniborder {
  310.         0% {
  311.                 background-size: 0 2px, 2px 0, 0 2px, 2px 0;
  312.         }
  313.         25% {
  314.                 background-size: 100% 2px, 2px 0, 0 2px, 2px 0;
  315.         }
  316.         50% {
  317.                 background-size: 100% 2px, 2px 100%, 0 2px, 2px 0;
  318.         }
  319.         75% {
  320.                 background-size: 100% 2px, 2px 100%, 100% 2px, 2px 0;
  321.         }
  322.         100% {
  323.                 background-size: 100% 2px, 2px 100%, 100% 2px, 2px 100%;
  324.         }
  325. }
  326.  
  327. @keyframes aniborder {
  328.         0% {
  329.                 background-size: 0 2px, 2px 0, 0 2px, 2px 0;
  330.         }
  331.         25% {
  332.                 background-size: 100% 2px, 2px 0, 0 2px, 2px 0;
  333.         }
  334.         50% {
  335.                 background-size: 100% 2px, 2px 100%, 0 2px, 2px 0;
  336.         }
  337.         75% {
  338.                 background-size: 100% 2px, 2px 100%, 100% 2px, 2px 0;
  339.         }
  340.         100% {
  341.                 background-size: 100% 2px, 2px 100%, 100% 2px, 2px 100%;
  342.         }
  343. }
  344.  
  345. .menu-wrap header {
  346.   position: fixed;
  347.         top: 0;
  348.         left: 0;
  349.   width: 100%;
  350.   z-index: 5;
  351. }
  352.  
  353. .menu-wrap.home header {
  354.   position: absolute;
  355. }
  356.  
  357. .menu-wrap nav ul {
  358.   list-style: none;
  359.         display: flex;
  360.         flex-direction: column;
  361.   margin: 0;
  362. }
  363.  
  364. .menu-wrap.home nav ul {
  365.   padding: 20px 0;
  366. }
  367.  
  368. .menu-wrap nav ul {
  369.   flex-direction: row;
  370.   justify-content: center;
  371.   align-items: center;
  372.   margin: 0;
  373.   padding: 0;
  374. }
  375.  
  376. .menu-wrap nav ul li {
  377.   display: block;
  378.   line-height: 78px;
  379. }
  380.  
  381. .menu-wrap nav ul li img {
  382.   vertical-align: middle;
  383.   display: table-cell;
  384.   text-align: center;
  385.   max-width: 140px;
  386.   margin: auto;
  387. }
  388.  
  389.  
  390.  
  391.  
  392. .menu-wrap.home nav ul li img {
  393.   max-width: 80px;
  394. }
  395.  
  396. .menu-wrap nav ul li.menu-item {
  397.   flex: 0 0 13.333333%;
  398. }
  399.  
  400. .menu-wrap nav ul li.menu-logo {
  401.   flex: 0 0 20%;
  402. }
  403.  
  404. .menu-wrap nav {
  405.   max-width: 1260px;
  406.   margin: auto;
  407. }
  408.  
  409. .menu-wrap nav ul a {
  410.     display: block;
  411.     text-decoration: none;
  412.     text-align: center;
  413.     font-size: 15px;
  414.     color: #73797e;
  415.     padding: 0;
  416.     font-weight: 500;
  417.     text-transform: uppercase;
  418. }
  419.  
  420. .menu-wrap.home nav ul a {
  421.   color: #fff;
  422.   font-weight: 500;
  423. }
  424.  
  425.  .menu-wrap .visible {
  426.         display: block;
  427.   transform: scale(1);
  428. }
  429.  
  430.  
  431. .menu-wrap .visible {
  432.   display: block;
  433.   transform: scale(1);
  434. }
  435.  
  436. .scroll-down {
  437.   position: absolute;
  438.   left: 50%;
  439.   margin-left: -20px;
  440.   width: 34px;
  441.   height: 34px;
  442.   bottom: 40px;
  443.   padding-left: 7px;
  444.   cursor: pointer;
  445.   z-index: 2;
  446.   color: #c7c4b8;
  447.   -webkit-box-sizing: border-box;
  448.   -moz-box-sizing: border-box;
  449.   box-sizing: border-box;
  450. }
  451.  
  452.  
  453. .cover {
  454.     background-position: center center;
  455.     background-repeat: no-repeat;
  456.     background-size: cover;
  457.     -webkit-background-size: cover;
  458.     -moz-background-size: cover-o-background-size: cover;
  459. }
  460.  
  461.  
  462.  
  463. .case {
  464.     float: left;
  465.     width: 33.333333%;
  466.     box-sizing: border-box;
  467.     padding: 0 10px 30px;
  468. }
  469.  
  470. .cases-wrap figure.fig {
  471.     position: relative;
  472.     float: left;
  473.     overflow: hidden;
  474.     margin: 0;
  475.     width: 100%;
  476.     background-color: #fff;
  477.     cursor: pointer;
  478. }
  479.  
  480. .cases-wrap figure.fig .img-bg {
  481.     height: 250px;
  482.     position: relative;
  483. }
  484.  
  485.  
  486.  
  487. .cases-wrap figure.fig .img-bg {
  488.     -webkit-transition: opacity .35s;
  489.     transition: opacity .35s;
  490. }
  491.  
  492. .cases-wrap figure.fig .img-bg {
  493.     height: 250px;
  494.     position: relative;
  495. }
  496.  
  497. .cases-wrap {
  498.   margin-top: 135px;
  499.   margin-bottom: 50px;
  500.   padding-right: 10px;
  501.   padding-left: 10px;
  502.   box-sizing: border-box;
  503. }
  504. .cases-wrap figure.fig .caption h3 {
  505.     color: #363130;
  506. }
  507.  
  508.  
  509.  
  510. .cases-wrap figure.fig h3 {
  511.     font-family: "Playfair Display",serif;
  512.     font-size: 1.58em;
  513.     margin: 0;
  514.     font-weight: 400;
  515.     line-height: 1.17em;
  516.     color: #fff;
  517. }
  518.  
  519. .cases-wrap .details span, .int-desc-wrap span {
  520.     border: 1px solid #d7d6d6;
  521.     padding: 2px 5px;
  522.     font-weight: 600;
  523.     color: #b5b3b3;
  524.     font-size: 11px;
  525.     text-transform: uppercase;
  526.     letter-spacing: 0.045em;
  527.     display: inline-block;
  528.     line-height: 14px;
  529.     margin: 0 5px 0 0;
  530. }
  531.  
  532. .int-desc-wrap .details {
  533.   margin: 8px 8px 8px;
  534.   line-height: 0;
  535.   min-height: 48px;
  536.   justify-content: center;
  537.   vertical-align: middle;
  538.   display: flex;
  539.   align-items: center;
  540.   align-content: stretch;
  541.   flex-wrap: wrap;
  542.   flex-direction: row;
  543. }
  544.  
  545. .cases-wrap .details {
  546.   font-family: "Museo Sans",open sans;
  547.   font-weight: 700;
  548.   color: #b5b3b3;
  549.   display: block;
  550.   font-size: 0.65em;
  551.   line-height: normal;
  552.   margin-top: 15px;
  553.   padding-top: 10px;
  554.   position: relative;
  555.   text-transform: uppercase;
  556.   height: 50px;
  557.   vertical-align: middle;
  558.   display: flex;
  559.   justify-content: flex-start;
  560.   align-items: center;
  561.   align-content: stretch;
  562.   flex-wrap: wrap;
  563.   flex-direction: row;
  564. }
  565.  
  566. .cases-wrap .details::after {
  567.     background: #d7d6d6 none repeat scroll 0 0;
  568.     content: "";
  569.     display: block;
  570.     height: 1px;
  571.     left: 0;
  572.     position: absolute;
  573.     top: 0;
  574.     width: 43px;
  575. }
  576.  
  577. .cases-wrap .desc-bgclr {
  578.     background: #444 none repeat scroll 0 0;
  579.     bottom: 0;
  580.     left: 0;
  581.     opacity: 0;
  582.     position: absolute;
  583.     right: 0;
  584.     top: 0;
  585.     transition: opacity 0.35s ease 0s;
  586. }
  587.  
  588. .cases-wrap .desc-img {
  589.     bottom: 0;
  590.     left: 0;
  591.     margin: 0;
  592.     opacity: 0.4;
  593.     position: absolute;
  594.     right: 0;
  595.     top: 0;
  596. }
  597.  
  598. .cases-wrap .btn-wrap {
  599.     text-align: center;
  600.     margin-bottom: 28px;
  601. }
  602.  
  603. .cases-wrap .hv-fade.clrbox {
  604.     position: relative;
  605.     z-index: 1;
  606.     background-color: #41b4a7;
  607.     color: #fff;
  608.     text-decoration: none;
  609. }
  610.  
  611. .cases-wrap .linebox, .clrbox {
  612.     border: 2px solid #41b4a7;
  613. }
  614.  
  615. .cases-wrap .hv-fade {
  616.     background: 0;
  617.     border: 0;
  618.     font-family: inherit;
  619.     font-size: .93em;
  620.     color: inherit;
  621.     cursor: pointer;
  622.     padding: 4px 14px;
  623.     display: inline-block;
  624.     letter-spacing: 1px;
  625.     outline: 0;
  626.     position: relative;
  627.     -webkit-transition: all .3s;
  628.     -moz-transition: all .3s;
  629.     transition: all .3s;
  630. }
  631.  
  632. .cases-wrap .trigger {
  633.     height: 100%;
  634.     left: 0;
  635.     position: absolute;
  636.     top: 0;
  637.     width: 100%;
  638. }
  639.  
  640. .cases-wrap .cases-inner {
  641.     max-width: 1280px;
  642.     margin: auto;
  643. }
  644.  
  645. .cases-wrap figure.fig h3 small {
  646.     font-family: "Playfair Display",serif;
  647.     display: block;
  648.     font-size: 0.69em;
  649.     font-style: italic;
  650.     line-height: 1.46em;
  651.     margin-top: 4px;
  652.     color: #484747;
  653. }
  654.  
  655.  
  656. .cases-wrap figure.fig{position:relative;float:left;overflow:hidden;margin:0;width:100%;background-color:#fff;cursor:pointer}
  657. .cases-wrap figure.fig .desc h3, .cases-wrap figure.fig .desc small {color:#fff;}
  658. .cases-wrap figure.fig .caption h3  {color:#363130;}
  659. .cases-wrap h3 small {color:#484747;}
  660. .cases-wrap .desc .details {color:#fff}
  661. .cases-wrap figure.fig .caption {
  662.   min-height: 147px;
  663.   max-height: 147px;
  664.   margin: 22px 28px 16px;
  665. }
  666. .cases-wrap figure.fig p{color:#363130;padding:0;margin:0;line-height:1.30em;font-size:1.1em}
  667. .cases-wrap figure.fig .desc, .cases-wrap figure.fig .webdesign-desc{-webkit-transition:opacity .35s,-webkit-transform .35s;-webkit-transform:translate3d(-40px,0,0);transition:transform .35s;transform:translate3d(-40px,0,0);opacity:0;position:absolute}
  668. .cases-wrap figure.fig:hover .desc, .cases-wrap figure.fig:hover .webdesign-desc{z-index: 99999; opacity:1;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);left:45px;right:45px;bottom:40px;position:absolute}
  669. .cases-wrap .desc-img {bottom: 0;left: 0;margin: 0;opacity: 0.4;position: absolute;right: 0;top: 0;}
  670. .cases-wrap .desc-bgclr {background: #444 none repeat scroll 0 0;bottom: 0;left: 0;opacity: 0;position: absolute;right: 0;top: 0;transition: opacity 0.35s ease 0s;}
  671. .cases-wrap figure.fig:hover .desc-bgclr {opacity: 1;}
  672. .cases-wrap figure figcaption>a{z-index:1000;text-indent:200%;white-space:nowrap;font-size:0;opacity:0}
  673. .cases-wrap figure.fig .img-bg{-webkit-transition:opacity .35s;transition:opacity .35s}
  674. .cases-wrap figure.fig:hover .img-bg,figure.fig:hover .caption{opacity:1}
  675. .cases-wrap figure.fig figcaption::before,figure.fig figcaption::after{position:absolute;top:20px;right:20px;bottom:20px;left:20px;content:'';opacity:0;-webkit-transition:opacity .80s,-webkit-transform .80s;transition:opacity .80s,transform .80s}
  676. .cases-wrap figure.fig figcaption::before{z-index: 1;border-top:1px solid #fff;border-bottom:1px solid #fff;-webkit-transform:scale(0,1);transform:scale(0,1)}
  677. .cases-wrap figure.fig figcaption::after{border-right:1px solid #fff;border-left:1px solid #fff;-webkit-transform:scale(1,0);transform:scale(1,0)}
  678. .cases-wrap figure.fig:hover figcaption::before,figure.fig:hover figcaption::after{opacity:1;-webkit-transform:scale(1);transform:scale(1)}
  679. .cases-wrap figure.fig .img-bg{height: 250px;position: relative;}
  680.  
  681.  
  682. .cases-wrap span.subtitle-wrap {
  683.   height: 38px;
  684.   display: flex;
  685.   align-items: center;
  686. }
  687.  
  688.  
  689. /* Content style */
  690.  
  691. .scroll {
  692.         position: fixed;
  693.         top: 50%;
  694.         left: 50%;
  695.         -webkit-transform: translateX(-50%) translateY(-50%);
  696.         -moz-transform: translateX(-50%) translateY(-50%);
  697.         transform: translateX(-50%) translateY(-50%);
  698.         letter-spacing: 1px;
  699.         font-weight: 700;
  700.         line-height: 2;
  701.         width: 10em;
  702.         text-align: center;
  703.         height: 2em;
  704.         background: #fff;
  705.         font-style: normal;
  706.         text-transform: uppercase;
  707.         opacity: 0.8;
  708. }
  709.  
  710. .scroll::after {
  711.         display: block;
  712.         content: '\2193';
  713.         color: #fff;
  714.         line-height: 1;
  715. }
  716.  
  717. /* Header styles and animations */
  718.  
  719. .ha-header {
  720.         position: fixed;
  721.         top: 0;
  722.         left: 0;
  723.         width: 100%;
  724.         padding: 0;
  725.         z-index: 50;
  726.         -webkit-transform: translateY(0%);
  727.         -moz-transform: translateY(0%);
  728.         transform: translateY(0%);
  729.         -webkit-transition: all 0.5s;
  730.         -moz-transition: all 0.5s;
  731.         transition: all 0.5s;
  732. }
  733.  
  734. .ha-header-perspective {
  735.         width: 100%;
  736.         height: 100%;
  737.         position: relative;
  738.         -webkit-perspective: 1100px;
  739.         -moz-perspective: 1100px;
  740.         perspective: 1100px;
  741.         -webkit-perspective-origin: 50% 0;
  742.         -moz-perspective-origin: 50% 0;
  743.         perspective-origin: 50% 0;
  744. }
  745.  
  746. .ha-header-perspective > div {
  747.   box-shadow: 0 2px 5px rgb(0 0 0 / 10%);
  748.   background-color: #fff;
  749.   padding: 0;
  750.   height: 78px;
  751.   width: 100%;
  752.   margin: 0 auto;
  753.   position: relative;
  754.   text-align: justify;
  755.   -webkit-backface-visibility: hidden;
  756.   -moz-backface-visibility: hidden;
  757.   backface-visibility: hidden;
  758.   -webkit-transition: all 0s;
  759.   -moz-transition: all 0s;
  760.   transition: all 0s;
  761.   /*-webkit-transition: all 0.5s;
  762.   -moz-transition: all 0.5s;
  763.   transition: all 0.5s;*/
  764.   overflow: hidden;
  765. }
  766.  
  767. .ha-header-front {
  768.         z-index: 2;
  769.         -webkit-transform-origin: 50% 100%;
  770.         -moz-transform-origin: 50% 100%;
  771.         transform-origin: 50% 100%;
  772. }
  773.  
  774. .ha-header-perspective .ha-header-bottom {
  775.   background-image: -webkit-linear-gradient(left,#36968c, #3ba297 18%, #6bc7be 50%, #6bc7be 50%, #6bc7be 50%, #3ba297 82%, #36968c);
  776.   background-image: -moz-linear-gradient(left,#36968c, #3ba297 18%, #6bc7be 50%, #6bc7be 50%, #6bc7be 50%, #3ba297 82%, #36968c);
  777.   background-image: -o-linear-gradient(left,#36968c, #3ba297 18%, #6bc7be 50%, #6bc7be 50%, #6bc7be 50%, #3ba297 82%, #36968c);
  778.   background-image: -ms-linear-gradient(left,#36968c, #3ba297 18%, #6bc7be 50%, #6bc7be 50%, #6bc7be 50%, #3ba297 82%, #36968c);
  779.   background-image: linear-gradient(left,#36968c, #3ba297 18%, #6bc7be 50%, #6bc7be 50%, #6bc7be 50%, #3ba297 82%, #36968c);
  780.         z-index: 1;
  781.         -webkit-transform: rotateX(-90deg);
  782.         -moz-transform: rotateX(-90deg);
  783.         transform: rotateX(-90deg);
  784.         -webkit-transition: top 0.5s;
  785.         -moz-transition: top 0.5s;
  786.         transition: top 0.5s;
  787.         position: absolute;
  788.         top: 0;
  789. }
  790.  
  791. /* Justify inline-block elements (h1 on left side, nav on right) */
  792. .ha-header-perspective > div::after {
  793.     content: '';
  794.     display: inline-block;
  795.     width: 100%;
  796. }
  797.  
  798. /* Individual states */
  799.  
  800. .ha-header-large {
  801.         height: 78px;
  802. }
  803.  
  804. .ha-header-small {
  805.         height: 78px;
  806. }
  807.  
  808. .ha-header-hide {
  809.         height: 78px;
  810.         -webkit-transform: translateY(-78px);
  811.         -moz-transform: translateY(-78px);
  812.         transform: translateY(-78px);
  813. }
  814.  
  815. .ha-header-show {
  816.         height: 220px;
  817.         -webkit-transform: translateY(0%);
  818.         -moz-transform: translateY(0%);
  819.         transform: translateY(0%);
  820. }
  821.  
  822. .ha-header-show .ha-header-bottom {
  823.         opacity: 0;
  824.         -webkit-transition: top 0.5s, opacity 0s 0.5s;
  825.         -moz-transition: top 0.5s, opacity 0s 0.5s;
  826.         transition: top 0.5s, opacity 0s 0.5s;
  827.         -webkit-transform: rotateX(0deg);
  828.         -moz-transform: rotateX(0deg);
  829.         transform: rotateX(0deg);
  830.         top: 0%;
  831. }
  832.  
  833. .ha-header-subshow {
  834.         height: 78px;
  835. }
  836.  
  837. .ha-header-subshow .ha-header-bottom {
  838.         -webkit-transition: top 0.5s;
  839.         -moz-transition: top 0.5s;
  840.         transition: top 0.5s;
  841.         -webkit-transform: rotateX(0deg);
  842.         -moz-transform: rotateX(0deg);
  843.         transform: rotateX(0deg);
  844.         top: 78px;
  845. }
  846.  
  847. .ha-header-shrink {
  848.         height: 220px;
  849.         top: 50px;
  850.         padding-left: 50px;
  851.         padding-right: 50px;
  852. }
  853.  
  854. .ha-header-shrink .ha-header-bottom {
  855.         opacity: 0;
  856. }
  857.  
  858. .ha-header-rotate {
  859.         height: 220px;
  860.         top: 50px;
  861.         padding-left: 50px;
  862.         padding-right: 50px;
  863. }
  864.  
  865. .ha-header-rotate .ha-header-front {
  866.         -webkit-transform: translateY(-100%) rotateX(90deg);
  867.         -moz-transform: translateY(-100%) rotateX(90deg);
  868.         transform: translateY(-100%) rotateX(90deg);
  869. }
  870.  
  871. .ha-header-rotate .ha-header-bottom {
  872.         top: 50%;
  873.         -webkit-transition: -webkit-transform 0.5s;
  874.         -moz-transition: -moz-transform 0.5s;
  875.         transition: transform 0.5s;
  876.         -webkit-transform: rotateX(0deg) translateY(-100%);
  877.         -moz-transform: rotateX(0deg) translateY(-100%);
  878.         transform: rotateX(0deg) translateY(-100%);
  879. }
  880.  
  881. .ha-header-rotateBack {
  882.         height: 220px;
  883.         top: 50px;
  884.         padding-left: 50px;
  885.         padding-right: 50px;
  886. }
  887.  
  888. .ha-header-rotateBack .ha-header-front {
  889.         -webkit-transform: translateY(0%) rotateX(0deg);
  890.         -moz-transform: translateY(0%) rotateX(0deg);
  891.         transform: translateY(0%) rotateX(0deg);
  892. }
  893.  
  894. .ha-header-rotateBack .ha-header-bottom {
  895.         top: 50%;
  896.         -webkit-transition: -webkit-transform 0.5s;
  897.         -moz-transition: -moz-transform 0.5s;
  898.         transition: transform 0.5s;
  899.         -webkit-transform: rotateX(-90deg);
  900.         -moz-transform: rotateX(-90deg);
  901.         transform: rotateX(-90deg);
  902. }
  903.  
  904. .ha-header-color {
  905.         height: 420px;
  906. }
  907.  
  908. .ha-header-color .ha-header-front,
  909. .ha-header-color .ha-header-bottom {
  910.         background: #41B4A8;
  911. }
  912.  
  913. .ha-header-color h1,
  914. .ha-header-color nav a {
  915.         color: #fff;
  916. }
  917.  
  918. .ha-header-box {
  919.         height: 192px;
  920.         width: 100px;
  921.         top: 20px;
  922.         left: 20px;
  923. }
  924.  
  925. .ha-header-box h1 {
  926.         padding-left: 150px;
  927. }
  928.  
  929. .ha-header-box h1,
  930. .ha-header-box nav a {
  931.         color: transparent;
  932. }
  933.  
  934. .ha-header-box h1:after {
  935.         opacity: 1;
  936. }
  937.  
  938. .ha-header-box nav {
  939.         opacity: 0;
  940. }
  941.  
  942. .ha-header-fullscreen {
  943.         height: 100%;
  944.         opacity: 0.9;
  945. }
  946.  
  947. .ha-header-fullscreen .ha-header-front {
  948.         height: 100%;
  949. }
  950.  
  951. .ha-header-fullscreen .ha-header-bottom {
  952.         opacity: 0;
  953.         -webkit-transition: top 0.5s, opacity 0s 0.5s;
  954.         -moz-transition: top 0.5s, opacity 0s 0.5s;
  955.         transition: top 0.5s, opacity 0s 0.5s;
  956.         -webkit-transform: rotateX(0deg);
  957.         -moz-transform: rotateX(0deg);
  958.         transform: rotateX(0deg);
  959.         top: 50%;
  960.         background: #41B4A8;
  961. }
  962.  
  963. .ha-header-subfullscreen {
  964.         height: 100%;
  965.         opacity: 0.9;
  966. }
  967.  
  968. .ha-header-subfullscreen .ha-header-bottom {
  969.         -webkit-transition: top 0.5s;
  970.         -moz-transition: top 0.5s;
  971.         transition: top 0.5s;
  972.         -webkit-transform: rotateX(0deg);
  973.         -moz-transform: rotateX(0deg);
  974.         transform: rotateX(0deg);
  975.         top: 50%;
  976.         background: #41B4A8;
  977. }
  978.  
  979. .ha-header-subfullscreen .ha-header-bottom nav a {
  980.         color: #fff;
  981. }
  982.  
  983. .elementor-message.elementor-message-success {
  984.     margin: 22px 0;
  985. }
  986.  
  987. .dialog-message .elementor-message.elementor-message-success {
  988.     font-size: 17px;
  989.     text-align: center;
  990. }
  991.  
  992. .elementor-toc__body .elementor-toc__list-item-text-wrapper {
  993.   align-items: flex-start;
  994. }
  995.  
  996. .elementor-toc__body .elementor-toc__list-item {
  997.     margin-bottom: 14px;
  998. }
  999.  
  1000. header.elementor-slideshow__header.elementor-lightbox-prevent-close {
  1001.     display: none;
  1002. }
  1003.  
  1004. .single-integrations h2 {
  1005.     font-size: 32px;
  1006. }
  1007.  
  1008. @media (min-width: 768px) and (max-width: 1025px) {
  1009.   .case {
  1010.     width: 50%;
  1011.   }
  1012.   .int-card-wrap {
  1013.     flex: 0 0 32.33333%;
  1014.   }
  1015.  
  1016.   .menu-wrap nav ul li img {
  1017.     max-width: 124px;
  1018.   }
  1019. }
  1020.  
  1021.  
  1022. @media (max-width: 767px) {
  1023.   header#ha-header {
  1024.     display: none;
  1025.   }
  1026.   .taptap-logo-image img {
  1027.     max-height: auto;
  1028.     width: 140px;
  1029.   }
  1030.   .case {
  1031.     width: 100%;
  1032.   }
  1033.   .int-card-wrap {
  1034.     flex: 0 0 48.99999%;
  1035.   }
  1036.  
  1037. }
  1038.  
  1039. @media (max-width: 580px) {
  1040.   .int-card-wrap {
  1041.     flex: 0 0 100%;
  1042.     margin-bottom: 16px;
  1043.   }
  1044. }



  • Recent Pastes