/* Variable colors */ :root { --light-symtrax: #f8f9fa; --primary-symtrax: #006bb4; --secondary-symtrax: #424b5a; --bg-symtrax: #F2F7FB; --universal-black:#000000; --universal-white:#FFFFFF; --dark-primary: #005690; } /********** UTILITIES ***********/ /*************** COLORS ***************/ /*************************************/ /*************** SIZES ***************/ /*************************************/ /*** MEDIA QUERIES ***/ /*** FONTS ***/ /************** CLASSES **************/ .inner-wrapper { width: 100%; max-width: 1140px; padding: 30px 10px; } @media (min-width: 992px) { .inner-wrapper { margin: 0px auto; padding: 48px 10px; } } @media (min-width: 1200px) { .inner-wrapper { width: 1140px; } } .sym-header { padding: 50px 0px; text-align: center; color: #FFFFFF; display: flex; justify-content: center; align-items: center; padding: 0; min-height: 194px; background: #424B5A; } @media (min-width: 768px) { .sym-header .entry-title { font-size: 2.75em; } } .cta-grow a { transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); } .cta-grow a:hover { box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22); } .sticky-top { position: fixed !important; top: 0; } .sticky-submenu { top: 52px !important; } /*************** CF7 Get live demo ***************/ .spanhidden { display: none !important; } .labelhidden { display: none !important; } .selecthidden { display: none !important; } .sized { height: 580px; } .us, .gb, .fr, .in, .de, .es, .mx, .ca { color: #424B5A; background: #F2F2F2; font-weight: bold; } /************************************************/ /***************** MOBILE MENU ******************/ @media (max-width: 991.98px) { .slide-in-right { -webkit-animation: slideInRight 500ms forwards; -moz-animation: slideInRight 500ms forwards; animation: slideInRight 500ms forwards; } } @media (max-width: 991.98px) { .slide-in-left { -webkit-animation: slideInLeft 500ms forwards; -moz-animation: slideInLeft 500ms forwards; animation: slideInLeft 500ms forwards; } } @media (max-width: 991.98px) { .slide-out-right { -webkit-animation: slideOutRight 500ms forwards; -moz-animation: slideOutRight 500ms forwards; animation: slideOutRight 500ms forwards; } } @media (max-width: 991.98px) { .slide-out-left { -webkit-animation: slideOutLeft 500ms forwards; -moz-animation: slideOutLeft 500ms forwards; animation: slideOutLeft 500ms forwards; } } @-webkit-keyframes slideInRight { 0% { transform: translateX(-999px); } 100% { transform: translateX(0); } } @-moz-keyframes slideInRight { 0% { transform: translateX(-999px); } 100% { transform: translateX(0); } } @keyframes slideInRight { 0% { transform: translateX(-999px); } 100% { transform: translateX(0); } } @-webkit-keyframes slideInLeft { 0% { transform: translateX(999px); } 100% { transform: translateX(0); } } @-moz-keyframes slideInLeft { 0% { transform: translateX(999px); } 100% { transform: translateX(0); } } @keyframes slideInLeft { 0% { transform: translateX(999px); } 100% { transform: translateX(0); } } @-webkit-keyframes slideOutRight { 0% { transform: translateX(0); } 100% { transform: translateX(999px); } } @-moz-keyframes slideOutRight { 0% { transform: translateX(0); } 100% { transform: translateX(999px); } } @keyframes slideOutRight { 0% { transform: translateX(0); } 100% { transform: translateX(999px); } } @-webkit-keyframes slideOutLeft { 0% { transform: translateX(0); } 100% { transform: translateX(-999px); } } @-moz-keyframes slideOutLeft { 0% { transform: translateX(0); } 100% { transform: translateX(-999px); } } @keyframes slideOutLeft { 0% { transform: translateX(0); } 100% { transform: translateX(-999px); } } /************************************************/ .open-sans { font-family: open_sansregular,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif !important; font-weight: 400; } .open-sans-bold { font-family: open_sansbold,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif !important; font-weight: 700; } .open-sans-light { font-family: open_sanslight,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif !important; font-weight: 300; } /* FAQ */ .fa-angle-right { -moz-transition: all .35s linear; -webkit-transition: all .35s linear; transition: all .35s linear; } .faq-link.down .fa-angle-right { -ms-transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); } .close { position: absolute; top: 0.5rem; right: 0.5rem; } @media (min-width: 768px) { .close { top: 1.2rem; right: 1.2rem; } } /*font-weight */ .font-weight-300 { font-weight: 300 !important; } .font-weight-400 { font-weight: 400 !important; } .font-weight-500 { font-weight: 500 !important; } .font-weight-600 { font-weight: 600 !important; } .font-weight-700 { font-weight: 700 !important; } .font-weight-800 { font-weight: 800 !important; } .font-weight-900 { font-weight: 900 !important; } .parallax { overflow: hidden; position: relative; min-height: 350px; } @media (min-width: 768px) { .parallax { height: 50vh; min-height: 320px; } } .parallax .parallax-image { position: absolute; bottom: 0; top: 0; left: 0; right: 0; height: 100%; width: 100%; background-attachment: fixed; background-position: center top; background-repeat: no-repeat; background-size: cover; } .parallax .parallax-image.e-invoicing { background-image: url(https://www.symtrax.com/wp-content/uploads/2019/06/picture-header-electronic-invoice.jpg); } .parallax .parallax-image::before { position: absolute; height: 100%; bottom: 0; left: 0; right: 0; top: 0; content: ""; display: block; background: #000000; opacity: 0.52; } .parallax .parallax-content { position: relative; height: 100%; } .border-2 { border-width: 2px !important; } .sym-shadow { box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.13); } .sym-hover-shadow { box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.13); transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); } .sym-hover-shadow:hover { box-shadow: 0 14px 28px rgba(0, 0, 0, 0.17), 0 10px 10px rgba(0, 0, 0, 0.15); } .sym-hover-grow { transition: all .3s; -webkit-transition: all .3s; -moz-transition: all .3s; } .sym-hover-grow:hover { transform: scale(1.1); } .btn-sym { background: #6582BB !important; border: 1px solid #6582BB !important; color: #ffffff !important; } .btn-sym:hover { background: #4d6dad !important; border: 1px solid #4968a4 !important; } .btn-sym:active { background: #4968a4 !important; border: 1px solid #45629c !important; } .btn-sym-hybrid { background: #006BB4 !important; border: 1px solid #006BB4 !important; color: #ffffff !important; } .btn-sym-hybrid:hover { background: #00548e !important; border: 1px solid #004d81 !important; } .btn-sym-hybrid:active { background: #004d81 !important; border: 1px solid #004574 !important; } .btn-sym-dark { background: #424B5A !important; border: 1px solid #424B5A !important; color: #ffffff !important; } .btn-sym-dark:hover { background: #323944 !important; border: 1px solid #2c323d !important; } .btn-sym-dark:active { background: #2c323d !important; border: 1px solid #272c35 !important; } .btn-outline-sym { color: #3a4251 !important; border-color: #3a4251 !important; } .btn-outline-sym:hover { color: #ffffff !important; background-color: #424B5A !important; border-color: #424B5A !important; } .outline-none { outline: 0 !important; } .outline-none:hover, .outline-none:active, .outline-none:focus { outline: 0 !important; } .text-compleo { color: #cc513f; } .text-hybrid { color: #006BB4 !important; } .text-sym-blue { color: #3a4251 !important; } .text-sym-blue.sym-link { color: #424B5A !important; } .text-sym-blue.sym-link:hover { color: #3a4251 !important; } .sym-links a:not(.reset-color) { color: #006BB4 !important; text-decoration: underline; font-weight: bold !important; } .sym-links a:not(.reset-color):hover { color: #004371 !important; } .countries a, .demo-cards a { color: #6582BB; } .countries a:hover, .demo-cards a:hover { color: #3a4251; } .bg-sym-grey { background: #F2F2F2; } .bg-white { background: #ffffff; } .bg-light-blue { background: #E9EDF5; } .bg-dark-blue { background: #424B5A; } .bg-hybrid-blue { background: #006BB4 !important; } .d-none { display: none !important; } .mx-auto { margin-left: auto; margin-right: auto; } .is_hidden { visibility: hidden; } .z-1 { z-index: 1; } .z-2 { z-index: 2; } .no-scroll { position: fixed; overflow-y: scroll; top: 0; height: 100%; width: 100%; } .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .entry-content img, .entry-content iframe, .entry-content object, .entry-content embed { max-width: 100%; } /************** CUSTOMIZED **************/ html, body { width: 100%; overflow-x: hidden; } body { font-family: 'open_sansregular', sans-serif !important; color: #3e3e3e; line-height: 1.2; } #comments, .eael-reading-progress-wrap, .eael-reading-progress-wrap-local { display: none !important; } /*.grecaptcha-badge { width: 70px !important; overflow: hidden !important; transition: all 0.3s ease !important; left: 4px !important; } .grecaptcha-badge:hover { width: 256px !important; }*/ /********** COMPONENTS **********/ /************** CARD MODELS **************/ .solutionCard{ min-height: 280px; box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%) !important; } .btn-solution{ background-color: var(--light-symtrax); border-color: var(--light-symtrax); color: var(--primary-symtrax); padding: 10px!important; } .btn-solution:hover{ background: var(--primary-symtrax); border-color: var(--primary-symtrax); color: var(--universal-white); text-decoration: none; transition: .3s; } .h3solution{ font-size: 1.25em; } .h3solution strong:hover{ text-decoration: underline!important; } .bgImgCard{ background-color: var(--bg-symtrax); } @media(max-width: 767px){ .solutionCard{ min-height: auto!important; } } @media(max-width: 991px){ .imgCardSolutions { display: none!important; } } /************** YOAST BREADCRUMB **************/ .sym-breadcrumb { display: none; background: #E9EDF5; color: #424B5A; } @media (min-width: 576px) { .sym-breadcrumb { display: block; } } .sym-breadcrumb .sym-breadcrumb-inner-wrapper { width: 100%; padding-top: 12px; padding-bottom: 12px; } .sym-breadcrumb .sym-breadcrumb-inner-wrapper a { color: #424B5A; } .sym-breadcrumb .sym-breadcrumb-inner-wrapper p { margin: 0px; } /************** RESOURCES CAROUSEL **************/ .resources-carousel-wrapper { user-select: none; position: relative; overflow: hidden; } .resources-carousel-wrapper .resources-carousel { display: flex; /* negative margin-left assigned dynamically with JS to center the resource on all screen */ } .resources-carousel-wrapper .resources-carousel .resource-wrapper { min-width: calc(100vw - 37px); } @media (min-width: 1200px) { .resources-carousel-wrapper .resources-carousel .resource-wrapper { min-width: 373.33px; padding: 10px; } } .resources-carousel-wrapper .resources-carousel .resource-wrapper:nth-child(1) { order: 2; } .resources-carousel-wrapper .resources-carousel .resource-wrapper:nth-child(2) { order: 3; } .resources-carousel-wrapper .resources-carousel .resource-wrapper:nth-child(3) { order: 4; } .resources-carousel-wrapper .resources-carousel .resource-wrapper:nth-child(4) { order: 5; } .resources-carousel-wrapper .resources-carousel .resource-wrapper:nth-child(5) { order: 1; } .resources-carousel-wrapper .resources-carousel .resource-wrapper .resource { flex-shrink: 0; width: 280px; margin: 0px auto; height: 100%; } @media (min-width: 576px) { .resources-carousel-wrapper .resources-carousel .resource-wrapper .resource { width: 353.33px; } } .resources-carousel-wrapper .resources-carousel .resource-wrapper .resource .resource-img-link .carousel-overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; opacity: 0.5; transition: .3s ease; background-color: #424b5a; } .resources-carousel-wrapper .resources-carousel .carousel-btn-prev, .resources-carousel-wrapper .resources-carousel .carousel-btn-next { position: absolute; top: 55%; font-size: 30px; color: #424B5A; cursor: pointer; z-index: 1001; opacity: 0.3; } .resources-carousel-wrapper .resources-carousel .carousel-btn-prev { transform: translateX(-100%); /* Move 'prev' item to the left */ left: 40px; } .resources-carousel-wrapper .resources-carousel .carousel-btn-next { transform: translateX(100%); /* Move 'next' item to the right */ right: 40px; } /******************** COOKIES CONSENT ********************/ /*.cc-window { z-index: 2147483001 !important; background-color: $sym-very-dark-blue !important; box-shadow: 0 0 1em rgba(136,136,136,0.5) !important; max-width: 20em !important; padding: 1.4em !important; font-size: 0.75em !important; line-height: 1.4em !important; .cc-compliance { .cc-btn { color: $sym-very-dark-blue !important; border-width: 1px; } } }*/ #symtrax-cookies-consent { display: none; position: fixed; bottom: 0px; left: 0px; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background: #ffffff; z-index: 2147483001; /*box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.05);*/ -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; padding: 15px 21px 15px 15px; /*border: 1px solid #efefef;*/ } @media (min-width: 576px) { #symtrax-cookies-consent { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; left: 20px; bottom: 20px; width: 275px; } } #symtrax-cookies-consent p { margin: 0; display: inline-block; font-size: 0.75em; color: #3a4251; } #symtrax-cookies-consent p a { color: #6582BB; } #symtrax-cookies-consent #okCookies { font-size: 10px; padding: 7px 9px; cursor: pointer; color: #3a4251; font-family: Arial, sans-serif; position: absolute; background: transparent; text-align: center; right: 0; top: 0; } /***************** INTERCOM CHAT WIDGET ******************/ /****************** BACK TO TOP BUTTON *******************/ #back-to-top { display: none; position: fixed; padding: 0px; height: 45px; width: 45px; bottom: 90px; right: 27px; z-index: 999999; border: none; outline: none; cursor: pointer; color: #FFFFFF; background: #3a4251; border-radius: 50%; font-family: "Font Awesome"; font-weight: 400; font-size: 1.2em; } @media (min-width: 992px) { #back-to-top { right: 91px; bottom: 27px; } } /************** WEBINAR COUNTDOWN **************/ .webinar-countdown { display: flex; justify-content: center; color: #FFFFFF; } .webinar-countdown .countdown-wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0px 15px; line-height: 1.2; } @media (min-width: 992px) { .webinar-countdown .countdown-wrap { padding: 0px 70px; } } .webinar-countdown .countdown-wrap div:first-child { font-size: 2em; } @media (min-width: 992px) { .webinar-countdown .countdown-wrap div:first-child { font-size: 4.5em; font-weight: 300; } } @media (min-width: 992px) { .webinar-countdown .countdown-wrap div:last-child { font-size: 1.5em; } } .webinar-countdown .countdown-separator { margin: 30px 0px; border-right: 1px solid #FFFFFF; } @media (min-width: 992px) { .webinar-countdown .countdown-separator { margin: 30px 0px; } } /************** FORMS **************/ #lightbox-loader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(66, 74, 91, 0.5); /* 0.5 - semi-transparent */ transition: opacity .15s linear; z-index: 10000; } #lightbox-loader-overlay { display: none; height: 100%; width: 100%; top: 0; left: 0; position: absolute; background-color: #424B5A; opacity: .5; } @media (min-width: 992px) { #lightbox-loader-overlay { display: block; } } .wpcf7 #country { margin-bottom: 14px; } .wpcf7 #country option:nth-child(-n+9):not(:nth-child(1)) { color: #424B5A; background: #F2F2F2; font-weight: bold; } #country option:nth-child(-n+9):not(:nth-child(1)) { color: #424a5b; background: #F2F2F2; font-weight: bold; } .sym-form { background: #ffffff; padding: 1.5rem; margin: auto; box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); z-index: 10; min-width: 300px; } @media (min-width: 576px) { .sym-form { min-width: 450px; max-width: 450px; } } @media (min-width: 992px) { .sym-form { margin: 0; } } .sym-form h1 { text-align: center; margin-top: 0; font-size: 1.75em; color: #3a4251; font-weight: 700; } .sym-form .wpcf7 .ajax-loader { display: none; } .sym-form .wpcf7 form:not(.cta-form) input:not([type='checkbox']), .sym-form .wpcf7 form:not(.cta-form) textarea { border-radius: 0px; padding: 4px 8px; width: 100%; } .sym-form .wpcf7 form:not(.cta-form) select { width: 100%; font: inherit; padding: 4px 3px; border-radius: 0px; margin-bottom: 1rem; border-color: #666; color: #757575; } .sym-form .wpcf7 form:not(.cta-form) #first-last-name { margin-bottom: 1rem; } .sym-form .wpcf7 form:not(.cta-form) #first-last-name #firstname { margin-bottom: 0.9rem; } @media (min-width: 992px) { .sym-form .wpcf7 form:not(.cta-form) #first-last-name { display: flex; justify-content: space-between; } .sym-form .wpcf7 form:not(.cta-form) #first-last-name #firstname { margin-bottom: 0; } } .sym-form .wpcf7 form:not(.cta-form) #first-last-name .firstname, .sym-form .wpcf7 form:not(.cta-form) #first-last-name .lastname { width: 49%; } .sym-form .wpcf7 form:not(.cta-form) #phone, .sym-form .wpcf7 form:not(.cta-form) #email, .sym-form .wpcf7 form:not(.cta-form) #company { margin-bottom: 1rem; } .sym-form .wpcf7 form:not(.cta-form) p { margin: 0 0 0.9rem 0; } .sym-form .wpcf7 form:not(.cta-form) p:last-of-type { margin-bottom: 0; } .sym-form .wpcf7 form:not(.cta-form) #acceptance { display: inline-flex; } .sym-form .wpcf7 form:not(.cta-form) #acceptance span:first-child { margin-right: 1px; } .sym-form .wpcf7 form:not(.cta-form) #acceptance #checkboxtxt { font-size: 80%; line-height: 1.2em; } .sym-form .wpcf7 form:not(.cta-form) #acceptance #checkboxtxt a { color: #6582BB; } .sym-form .wpcf7 form:not(.cta-form) #acceptance #checkboxtxt a:hover { color: #424B5A; } .sym-form .wpcf7 form:not(.cta-form) #register, .sym-form .wpcf7 form:not(.cta-form) .register { /* width: 100%; color: #FFF; padding: 12px; background: #3a4251; border: 1px solid #3a4251; border-radius: 0px; font-size: 1em; cursor: pointer; */ padding: .5rem 1rem!important; width: auto!important; margin-top: 1rem; } .sym-form .wpcf7 form:not(.cta-form) .screen-reader-response { margin-bottom: 8px; } .sym-form .wpcf7 form:not(.cta-form) .screen-reader-response ul { display: none; } .sym-form .wpcf7 form:not(.cta-form) .wpcf7-not-valid-tip, .sym-form .wpcf7 form:not(.cta-form) .mandatory, .sym-form .wpcf7 form:not(.cta-form) #cf7-dynamics { display: none; } .sym-form .wpcf7 form:not(.cta-form) #cliModalClose:hover { background: none; } .sym-form .wpcf7 form:not(.cta-form) .wpml-ls-sub-menu { box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); } .sym-form .wpcf7 form:not(.cta-form) .screen-reader-response { display: none; padding: 0px 4px; margin-bottom: 10px; border: 1px solid #6582BB; color: #6582BB; } .sym-form .wpcf7 form:not(.cta-form) .screen-reader-responseul { display: none; } .sym-form .wpcf7 form:not(.cta-form) .wpcf7-mail-sent-ok { padding: 0px 4px; margin-bottom: 10px; border: 1px solid green; color: green; } .sym-form .wpcf7 form:not(.cta-form) .wpcf7-mail-sent-okul { display: none; } .sym-form .wpcf7 form:not(.cta-form) .wpcf7-validation-errors { padding: 0px 4px; margin-bottom: 10px; border: 1px solid darkorange; color: darkorange; } .sym-form .wpcf7 form:not(.cta-form) .wpcf7-validation-errorsul { display: none; } .sym-form .wpcf7 form:not(.cta-form) .wpcf7-form select.wpcf7-not-valid { color: crimson; } .sym-form .wpcf7 form:not(.cta-form) input.wpcf7-not-valid, .sym-form .wpcf7 form:not(.cta-form) select.wpcf7-not-valid { border: 1px solid darkorange !important; } .sym-form .wpcf7 form:not(.cta-form) input.wpcf7-not-valid::-webkit-input-placeholder, .sym-form .wpcf7 form:not(.cta-form) input.wpcf7-not-valid:-ms-input-placeholder, .sym-form .wpcf7 form:not(.cta-form) input.wpcf7-not-valid::placeholder, .sym-form .wpcf7 form:not(.cta-form) input.wpcf7-not-validoption:first-child, .sym-form .wpcf7 form:not(.cta-form) select.wpcf7-not-valid::-webkit-input-placeholder, .sym-form .wpcf7 form:not(.cta-form) select.wpcf7-not-valid:-ms-input-placeholder, .sym-form .wpcf7 form:not(.cta-form) select.wpcf7-not-valid::placeholder, .sym-form .wpcf7 form:not(.cta-form) select.wpcf7-not-validoption:first-child { color: darkorange; } .sym-form .wpcf7 form:not(.cta-form) .wpcf7-not-valid-tip { margin-top: 4px; margin-left: 2px; font-weight: 700; font-size: 0.9em; color: darkorange; } .sym-cta-form .wpcf7 { margin-left: auto; margin-right: auto; } .sym-cta-form .wpcf7 .screen-reader-response { line-height: 1.2em; margin-bottom: 8px; } .sym-cta-form .wpcf7 .screen-reader-response ul { display: none; } .sym-cta-form .wpcf7 input, .sym-cta-form .wpcf7 select, .sym-cta-form .wpcf7 textarea { /* border: 1px solid #424B5A; */ border-radius: 0; } @media (min-width: 992px) { .sym-cta-form .wpcf7 #first-last-name { display: flex; justify-content: space-between; } } .sym-cta-form .wpcf7 #acceptance { display: inline-flex; } .sym-cta-form .wpcf7 #acceptance span:first-child { margin-right: 1px; } .sym-cta-form .wpcf7 #acceptance #checkboxtxt { font-size: 80%; line-height: 1em; } .sym-cta-form .wpcf7 #acceptance #checkboxtxt a { color: #6582BB; } .sym-cta-form .wpcf7 #acceptance #checkboxtxt a:hover { color: #424B5A; } .sym-cta-form .wpcf7 p:last-of-type { margin-bottom: 0; } .sym-cta-form .wpcf7 .wpcf7-response-output, .sym-cta-form .wpcf7 .wpcf7-not-valid-tip, .sym-cta-form .wpcf7 .mandatory, .sym-cta-form .wpcf7 #cf7-dynamics { display: none; } .sym-cta-form .wpcf7 .wpcf7-form select.wpcf7-not-valid { color: crimson; } .sym-cta-form .wpcf7 input.wpcf7-not-valid, .sym-cta-form .wpcf7 select.wpcf7-not-valid { border: 2px solid #ff8c00 !important; } .sym-cta-form .wpcf7 input.wpcf7-not-valid::-webkit-input-placeholder, .sym-cta-form .wpcf7 input.wpcf7-not-valid:-ms-input-placeholder, .sym-cta-form .wpcf7 input.wpcf7-not-valid::placeholder, .sym-cta-form .wpcf7 input.wpcf7-not-validoption:first-child, .sym-cta-form .wpcf7 select.wpcf7-not-valid::-webkit-input-placeholder, .sym-cta-form .wpcf7 select.wpcf7-not-valid:-ms-input-placeholder, .sym-cta-form .wpcf7 select.wpcf7-not-valid::placeholder, .sym-cta-form .wpcf7 select.wpcf7-not-validoption:first-child { color: crimson; } .sym-cta-form .wpcf7 .wpcf7-not-valid-tip { margin-top: 4px; font-weight: 700; font-size: 80%; color: #424B5A; } .sym-cta-form .wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output{ border: 2px solid #ff8c00 !important; } /************** QUOTES **************/ .quote-wrapper { background-color: #5a5766; } /************ LAYOUT ************/ /************** NAV **************/ #lang_sel_click { width: auto; margin-left: 30px; } #lang_sel_click a { border: none; } #header-top-wrapper { text-align: center; border-bottom: 1px solid #DCDCDC; } #header-top-wrapper #header-top { display: none; } @media (min-width: 1200px) { #header-top-wrapper #header-top { display: flex; align-items: center; max-width: 1140px; margin: 0 auto; justify-content: flex-end; padding: 10px 0px; z-index: 1000; } } #header-top-wrapper #header-top #secondary-menu { display: flex; justify-content: flex-end; width: 1140px; margin: auto; } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu { display: flex; justify-content: flex-end; height: 100%; list-style: none; margin-bottom: 0; /* Bootstrap override */ } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li { padding: 0px 10px; } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li a { font-size: 0.9em; color: #606060; line-height: 27.72px; } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li a .top-menu-icon::before { margin-right: 4px; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li a:hover { color: #3a4251; } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li.top-menu-separator { color: #606060; } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li:last-child.top-menu-separator, #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li:nth-child(10).top-menu-separator { display: none; } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li.menu-item-language-current { margin-left: 60px; z-index: 9999; } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li.menu-item-language-current:after { font-family: "Font Awesome 5 Free"; font-weight: 400; content: "\f0e7"; font-size: 0.9em; } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li.menu-item-language-current ul.sub-menu { display: none; position: absolute; margin-left: -10px; list-style: none; padding: 5px; } #header-top-wrapper #header-top #secondary-menu div:first-child ul.menu li.menu-item-language-current ul.sub-menu li.top-menu-separator { display: none; } #header-top-wrapper #header-top #secondary-menu #lang_sel_click a { color: #3a4251; } #header-top-wrapper #header-top #secondary-menu #lang_sel_click a.wpml-ls-link:hover { color: #3a4251; } #site-header { z-index: 1000; background: rgba(255, 255, 255, 0.9); width: 100%; } #site-header #header { display: flex; align-items: center; justify-content: space-between; margin-top: 46px; padding: 10px; max-width: 1140px; margin: auto; } @media (min-width: 992px) { #site-header #header { padding: 0px; } } @media (min-width: 992px) { #site-header #header #logo { padding-left: 10px; } } #site-header #header #logo .custom-logo { vertical-align: middle; } @media (min-width: 992px) { #site-header #header #lang_sel_click { display: none; } } #site-header #header nav { display: none; } @media (min-width: 992px) { #site-header #header nav { display: flex; justify-content: flex-end; flex: auto; } } #site-header #header nav div:first-child { width: 100%; } #site-header #header nav div:first-child ul { display: flex; justify-content: flex-end; list-style: none; margin-bottom: 0; /* Bootstrap override */ } #site-header #header nav div:first-child ul li { text-align: center; } #site-header #header nav div:first-child ul li a { display: block; padding: 15px 20px 12px 20px; color: #606060; font-weight: 500; text-decoration: none !important; } #site-header #header nav div:first-child ul li a:hover { color: #424B5A; border-bottom: 3px solid #424B5A; font-weight: bold; } #site-header #header nav div:first-child ul li:nth-child(1) { width: 105px; cursor: context-menu; } #site-header #header nav div:first-child ul li:nth-child(2) { width: 105px; cursor: context-menu; } #site-header #header nav div:first-child ul li:nth-child(3) { width: 125px; cursor: context-menu; } #site-header #header nav div:first-child ul li:nth-child(4) { width: 123px; } #site-header #header nav div:first-child ul li:nth-child(4) a { font-weight: 700; padding-top: 20px !important; font-size: 13px; color: #006BB4; } #site-header #header nav div:first-child ul li:nth-child(4) a:hover { border-bottom: 3px solid #006BB4 } #site-header #header nav div:first-child ul li:nth-child(5) { background: #6582BB; } #site-header #header nav div:first-child ul li:nth-child(5) a { color: #FFF !important; font-weight: 500 !important; border-bottom: 3px solid transparent !important; transition: 0.3s; } #site-header #header nav div:first-child ul li:nth-child(5) a:hover { background: #424B5A; } @media (min-width: 992px) { #site-header #header nav div:first-child ul .menu-item-language { display: none; } } #site-header #header i { color: #6582BB; font-size: 1.75em; margin-top: 2px; } #site-header #header #user-id-icon { margin-left: auto; } @media (min-width: 992px) { #site-header #header #user-id-icon { display: none; } } #site-header #header #globe-icon { margin-left: 15px; } @media (min-width: 992px) { #site-header #header #globe-icon { display: none; } } #site-header #header #mobile-nav-right { display: flex; align-items: center; } #site-header #header #mobile-nav-right #hamburger { width: 30px; height: 23px; position: relative; margin-left: 15px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; } @media (min-width: 992px) { #site-header #header #mobile-nav-right #hamburger { display: none; } } #site-header #header #mobile-nav-right #hamburger span { display: block; position: absolute; height: 4px; width: 100%; background: #6582BB; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; } #site-header #header #mobile-nav-right #hamburger span:nth-child(1) { top: 0px; } #site-header #header #mobile-nav-right #hamburger span:nth-child(2), #site-header #header #mobile-nav-right #hamburger span:nth-child(3) { top: 9px; } #site-header #header #mobile-nav-right #hamburger span:nth-child(4) { top: 18px; } #site-header #header #mobile-nav-right #hamburger.open span:nth-child(1) { top: 9px; width: 0%; left: 50%; } #site-header #header #mobile-nav-right #hamburger.open span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } #site-header #header #mobile-nav-right #hamburger.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } #site-header #header #mobile-nav-right #hamburger.open span:nth-child(4) { top: 9px; width: 0%; left: 50%; } @media (min-width: 768px) { #site-header #solutions-desktop-menu, #site-header #services-desktop-menu { -webkit-box-shadow: 0px 16px 32px -16px rgba(0, 0, 0, 0.75); -moz-box-shadow: 0px 16px 32px -16px rgba(0, 0, 0, 0.75); box-shadow: 0px 16px 32px -16px rgba(0, 0, 0, 0.75); transition: box-shadow 0.9s ease-in-out; /*-webkit-box-shadow: 0px 1px 10px rgba(0,0,0,0.75); -moz-box-shadow: 0px 1px 10px rgba(0,0,0,0.75); box-shadow: 0px 1px 10px rgba(0,0,0,0.75); transition: box-shadow 0.9s ease-in-out;*/ } } #site-header #solutions-desktop-menu { display: none; height: 194px; padding: 20px 0px; } @media (min-width: 992px) { #site-header #solutions-desktop-menu { position: absolute; /*top: 100px; removed for bootstrap*/ width: 100%; background: #424B5A; z-index: 1000; } #site-header #solutions-desktop-menu div:first-child { max-width: 1140px; height: 100%; margin: auto; display: flex; } #site-header #solutions-desktop-menu div:first-child ul { display: flex; justify-content: center; width: 100%; padding: 0px; list-style: none; margin: 0 auto; } #site-header #solutions-desktop-menu div:first-child ul li { display: flex; justify-content: center; align-items: center; width: 20%; padding: 0px 20px; } #site-header #solutions-desktop-menu div:first-child ul li a { display: flex; flex-direction: column; justify-content: center; align-items: stretch; text-align: center; color: #FFF; font-weight: bold; width: 100%; /* IE11 workaround */ max-width: 100%; } #site-header #solutions-desktop-menu div:first-child ul li a:before { margin-bottom: 8px; } #site-header #solutions-desktop-menu div:first-child ul li a:hover { color: #E9EDF5; } #site-header #solutions-desktop-menu div:first-child ul li:not(:last-child) { border-right: 1px dashed #E9EDF5; } #site-header #solutions-desktop-menu div:first-child ul li:first-child a:before { /*content:url(https://www.symtrax.com/wp-content/uploads/2019/09/Order-purchase-processes.png);*/ content: url(https://www.symtrax.com/wp-content/uploads/2020/02/order-purchase-processes-menu-icon.png); /*background:url(https://www.symtrax.com/wp-content/uploads/2019/10/Order-purchase-processes-menu-icon.png); background-size: 80px 80px;*/ } #site-header #solutions-desktop-menu div:first-child ul li:nth-child(2) a:before { content: url(https://www.symtrax.com/wp-content/uploads/2021/04/Production-workflows-menu-icons.png); /*content:url(https://www.symtrax.com/wp-content/uploads/2019/09/Production-workflows.png);*/ } #site-header #solutions-desktop-menu div:first-child ul li:nth-child(3) a:before { content: url(https://www.symtrax.com/wp-content/uploads/2020/02/validation-and-signature-menu-icon.png); /*content:url(https://www.symtrax.com/wp-content/uploads/2020/02/validation-and-signature-icon-2.png);*/ } #site-header #solutions-desktop-menu div:first-child ul li:nth-child(4) a:before { content: url(https://www.symtrax.com/wp-content/uploads/2020/02/E-invoicing-menu-icon.png); /*content:url(https://www.symtrax.com/wp-content/uploads/2019/09/E-invoicing.png);*/ } #site-header #solutions-desktop-menu div:first-child ul li:nth-child(5) a:before { content: url(https://www.symtrax.com/wp-content/uploads/2020/02/creation-and-distribution-menu-icon.png); /*content:url(https://www.symtrax.com/wp-content/uploads/2019/09/creation-and-distribution.png);*/ } } #site-header #services-desktop-menu { display: none; height: 194px; padding: 20px 0px; } @media (min-width: 992px) { #site-header #services-desktop-menu { position: absolute; /*top: 100px;*/ width: 100%; background: #424B5A; z-index: 1000; } #site-header #services-desktop-menu div:first-child { max-width: 1140px; height: 100%; margin: auto; display: flex; justify-content: center; } #site-header #services-desktop-menu div:first-child ul { display: flex; justify-content: center; width: 100%; padding: 0px; list-style: none; margin: 0; } #site-header #services-desktop-menu div:first-child ul li { display: flex; justify-content: center; align-items: center; width: 100%; padding: 0px 20px; } #site-header #services-desktop-menu div:first-child ul li a { display: flex; flex-direction: column; justify-content: center; align-items: stretch; text-align: center; color: #FFF; font-weight: bold; width: 100%; /* IE11 workaround */ max-width: 100%; } #site-header #services-desktop-menu div:first-child ul li a:before { margin-bottom: 8px; } #site-header #services-desktop-menu div:first-child ul li a:hover { color: #E9EDF5; } #site-header #services-desktop-menu div:first-child ul li:not(:last-child) { border-right: 1px dashed #E9EDF5; }} #site-header #header-dropdown { display: none; position: fixed; top: 52px; bottom: 0px; width: 100%; z-index: 2; background: #FFF; } @media (min-width: 992px) { #site-header #header-dropdown { top: 106px; max-width: 1140px; } } #site-header #header-dropdown #main-menu-mobile { position: absolute; top: 0; width: 100%; background: #FFF; z-index: 3; } #site-header #header-dropdown #main-menu-mobile ul { min-height: 100vh; width: 100%; list-style: none; margin: 0 !important; padding: 50px 10px 0px 10px; } #site-header #header-dropdown #main-menu-mobile ul li { padding: 0px 30px; /*&:not(:first-child) a .fa-chevron-right { display: none; }*/ } #site-header #header-dropdown #main-menu-mobile ul li a { color: #333; font-size: 1.75em; font-weight: 300; } #site-header #header-dropdown #main-menu-mobile ul li .menu-separator { width: 10%; border-top: 1px solid #DCDCDC; margin: 20px 0px 20px 5px; } #site-header #header-dropdown #main-menu-mobile ul li:not(:last-child) a { display: flex; justify-content: space-between; align-items: center; } #site-header #header-dropdown #main-menu-mobile ul li:last-child .menu-separator, #site-header #header-dropdown #main-menu-mobile ul li:nth-child(3) .menu-separator { display: none; } #site-header #header-dropdown #main-menu-mobile ul li:last-child { text-align: center; background: #6582BB; padding: 15px 0px; } #site-header #header-dropdown #main-menu-mobile ul li:last-child a { color: #FFF; font-size: 1.2em; font-weight: 400; } #site-header #header-dropdown #main-menu-mobile ul li:last-child i { display: none; } #site-header #header-dropdown #main-menu-mobile ul li:nth-child(3) { margin-bottom: 50px; } #site-header #header-dropdown #solutions-mobile-menu, #site-header #header-dropdown #services-mobile-menu, #site-header #header-dropdown #resources-mobile-menu { position: absolute; top: 0; width: 100%; background: #fff; } #site-header #header-dropdown #solutions-mobile-menu ul, #site-header #header-dropdown #services-mobile-menu ul, #site-header #header-dropdown #resources-mobile-menu ul { list-style: none; } #site-header #header-dropdown #solutions-mobile-menu #solutions-mobile-header, #site-header #header-dropdown #solutions-mobile-menu #services-mobile-header, #site-header #header-dropdown #services-mobile-menu #solutions-mobile-header, #site-header #header-dropdown #services-mobile-menu #services-mobile-header, #site-header #header-dropdown #resources-mobile-menu #solutions-mobile-header, #site-header #header-dropdown #resources-mobile-menu #resources-mobile-header { padding: 15px 30px; background: #F5F5F5; } #site-header #header-dropdown #solutions-mobile-menu #solutions-mobile-header .back-arrow, #site-header #header-dropdown #solutions-mobile-menu #services-mobile-header .back-arrow, #site-header #header-dropdown #services-mobile-menu #solutions-mobile-header .back-arrow, #site-header #header-dropdown #services-mobile-menu #services-mobile-header .back-arrow { display: flex; align-items: center; color: #333; font-size: 1.75em; font-weight: 400; margin: 0px; } #site-header #header-dropdown #solutions-mobile-menu #solutions-mobile-header .back-arrow i, #site-header #header-dropdown #solutions-mobile-menu #services-mobile-header .back-arrow i, #site-header #header-dropdown #services-mobile-menu #solutions-mobile-header .back-arrow i, #site-header #header-dropdown #services-mobile-menu #services-mobile-header .back-arrow i, #site-header #header-dropdown #resources-mobile-menu #resources-mobile-header .back-arrow i { margin-right: 10px; } #site-header #header-dropdown #solutions-mobile-menu #solutions-mobile-list ul, #site-header #header-dropdown #solutions-mobile-menu #services-mobile-list ul, #site-header #header-dropdown #services-mobile-menu #solutions-mobile-list ul, #site-header #header-dropdown #services-mobile-menu #services-mobile-list ul, #site-header #header-dropdown #resources-mobile-menu #resources-mobile-list ul { list-style: none; padding: 30px 10px 20px 10px; } #site-header #header-dropdown #solutions-mobile-menu #solutions-mobile-list ul li, #site-header #header-dropdown #solutions-mobile-menu #services-mobile-list ul li, #site-header #header-dropdown #services-mobile-menu #solutions-mobile-list ul li, #site-header #header-dropdown #services-mobile-menu #services-mobile-list ul li, #site-header #header-dropdown #resources-mobile-menu #resources-mobile-list ul li { padding: 0px 30px; } #site-header #header-dropdown #solutions-mobile-menu #solutions-mobile-list ul li a, #site-header #header-dropdown #solutions-mobile-menu #services-mobile-list ul li a, #site-header #header-dropdown #services-mobile-menu #solutions-mobile-list ul li a, #site-header #header-dropdown #services-mobile-menu #services-mobile-list ul li a, #site-header #header-dropdown #resources-mobile-menu #resources-mobile-list ul li a { color: #333; font-size: 1em; font-weight: 300; } #site-header #header-dropdown #solutions-mobile-menu #solutions-mobile-list ul li .menu-separator, #site-header #header-dropdown #solutions-mobile-menu #services-mobile-list ul li .menu-separator, #site-header #header-dropdown #services-mobile-menu #solutions-mobile-list ul li .menu-separator, #site-header #header-dropdown #services-mobile-menu #services-mobile-list ul li .menu-separator, #site-header #header-dropdown #resources-mobile-menu #resources-mobile-list ul li .menu-separator { width: 10%; border-top: 1px solid #DCDCDC; margin: 2vh 0vh; } #site-header #header-dropdown #solutions-mobile-menu #solutions-mobile-list ul li:last-child .menu-separator, #site-header #header-dropdown #solutions-mobile-menu #services-mobile-list ul li:last-child .menu-separator, #site-header #header-dropdown #services-mobile-menu #solutions-mobile-list ul li:last-child .menu-separator, #site-header #header-dropdown #services-mobile-menu #services-mobile-list ul li:last-child .menu-separator, #site-header #header-dropdown #resources-mobile-menu #resources-mobile-list ul li:last-child .menu-separator { display: none; } /************** FOOTER **************/ #main-footer a { color: #3a4251 !important; } #main-footer a:hover { color: #424B5A !important; } /************ PAGES *************/ /************** HOMEPAGE **************/ #home-quote-custom .numb2{ min-height: 224px; background-color: #F2F7FB; border-radius: 13px; } @media (max-width: 767px){ #home-quote-custom .numb2, #home-quote-custom .numb4{ min-height: auto!important; } #home-quote-custom .numb1{ margin-top:0!important; } #home-quote-custom .numb5{ margin-bottom: 0px; } .colQuote{ margin-right: 0px!important; background-color: #99c4e1!important; } .numb2 i, .numb4 i, .numb7 i{ font-size: 40px!important; } } .quoteDetail p{ margin-bottom: 0!important; font-size: 13px; } .numb2 i, .numb4 i, .numb7 i{ font-size: 32px; color: var(--secondary-symtrax); } #home-quote-custom .numb2 p, #home-quote-custom .numb4 p, #home-quote-custom .numb7 p{ color: var(--universal-black); } #home-quote-custom .numb2:hover, #home-quote-custom .numb4:hover, #home-quote-custom .numb7:hover{ background-color: var(--universal-white); box-shadow: 0 0.5rem 2rem rgb(0 0 0 / 15%) !important; transition: .3s; } #home-quote-custom .numb2{ min-height: 224px; background-color: #F2F7FB; border-radius: 13px; } @media (max-width: 767px){ #home-quote-custom .numb2, #home-quote-custom .numb4{ min-height: auto!important; } #home-quote-custom .numb1{ margin-top:0!important; } #home-quote-custom .numb5{ margin-bottom: 0px; } .colQuote{ margin-right: 0px!important; background-color: #99c4e1!important; } .numb2 i, .numb4 i, .numb7 i{ font-size: 40px!important; } } .numb2 i, .numb4 i, .numb7 i{ font-size: 32px; color: var(--secondary-symtrax); } #home-quote-custom .numb2 p, #home-quote-custom .numb4 p, #home-quote-custom .numb7 p{ color: var(--universal-black); } #home-quote-custom .numb2:hover, #home-quote-custom .numb4:hover, #home-quote-custom .numb7:hover{ background-color: var(--universal-white); box-shadow: 0 0.5rem 2rem rgb(0 0 0 / 15%) !important; transition: .3s; } #figures-number1 p:first-child, #figures-number1 p:nth-child(3), #figures-number2 p:first-child, #figures-number2 p:nth-child(3){ color: var(--universal-black); font-size: 25px; } #figures-number1 p:nth-child(2), #figures-number2 p:nth-child(2){ color: var(--secondary-symtrax); font-size: 78px; font-weight: 800; } #figures-number1 p, #figures-number2 p{ margin-bottom: -1rem; } .dot { height: 25px; width: 25px; background-color: var(--primary-symtrax); border-radius: 50%; display: inline-block; } /************** CHALLENGES 2021 **************/ @media(max-width: 700px){ #custom-challenges-header h1{ font-size: 1.7rem!important; } #custom-challenges-section2 h2, #custom-challenges-section3 h2, #custom-challenges-section4 h2, #custom-challenges-section7 h2 { font-size: 1.5rem!important; } } #custom-challenges-header{ background: linear-gradient(355deg,var(--bg-symtrax) 30%,var(--universal-white) 29%); } #custom-challenges-header h1{ font-size: 3rem; } #custom-challenges-header p{ font-size: 1.2rem; } #custom-challenges-header .btn-solution{ background-color: var(--light-symtrax); border-color: var(--primary-symtrax); color: var(--primary-symtrax); padding: 10px!important; } #custom-challenges-header .btn-solution:hover{ background: var(--primary-symtrax); border-color: var(--primary-symtrax); color: var(--universal-white); text-decoration: none; transition: .3s; } #custom-challenges-header .btn-form{ padding: 10px!important; } @media (max-width: 397px) { #custom-challenges-header .btn-solution{ margin-top: 10px; } } #custom-challenges-section1{ background: linear-gradient(177deg,var(--bg-symtrax) 90%,var(--universal-white) 40%); } #custom-challenges-section1 h3{ font-size: 1.5em; } #custom-challenges-section1 i { font-size: 32px; padding-top: 15px; padding-left: 20px; color: var(--dark-primary); } #custom-challenges-section1 .dot { height: 72px; width: 72px; background-color: #DDEAF3; border-radius: 50%; border: 5px solid var(--bg-symtrax); display: inline-block; } #custom-challenges-section2 .card:hover .btn-solution, #custom-challenges-section6 .card:hover .btn-solution { background: var(--primary-symtrax); border-color: var(--primary-symtrax); color: var(--universal-white); transition: .3s; } #custom-challenges-section2 .solutionCard, #custom-challenges-section6 .solutionCard { box-shadow: none!important; } #custom-challenges-section2 h2, #custom-challenges-section3 h2, #custom-challenges-section4 h2, #custom-challenges-section7 h2 { font-size: 2.5rem; } #custom-challenges-section2 h3, #custom-challenges-section2 p, #custom-challenges-section6 h3, #custom-challenges-section6 p{ font-size: 1em; } #custom-challenges-section2 .imgCardSolutions{ background-color: var(--bg-symtrax); } #custom-challenges-section2 .solutionCard:hover, #custom-challenges-section6 .solutionCard:hover { box-shadow: 0 0rem 1.3rem rgb(0 0 0 / 10%) !important; transition: .3s; } #custom-challenges-section2 .card{ border-radius: 0.4rem!important; } #custom-challenges-section2 .sizeBlockh3{ min-height: 86px; } #custom-challenges-section2 .sizeBlockp{ min-height: 86px; } #custom-challenges-section2 .sizeBlockp:lang(fr), #custom-challenges-section2 .sizeBlockp:lang(de), #custom-challenges-section2 .sizeBlockp:lang(es){ min-height: 96px; } #custom-challenges-section2 .btn-solution{ position: absolute; bottom: 15px; } @media(max-width: 576px){ #custom-challenges-section2 .sizeBlockh3{ min-height: 0!important; } #custom-challenges-section2 .sizeBlockp{ min-height: 0!important; } } #custom-challenges-section3 i { font-size: 35px; } #custom-challenges-section3, #custom-challenges-section4 .bg-faq, #custom-challenges-section7 { background-color: var(--bg-symtrax); } #custom-challenges-section4 .border{ border-radius: 9px; } #custom-challenges-section6 .card-img-top{ width: 100%; height: 220px; object-fit: cover; position: relative; border-radius: 6px 6px 0 0; } #custom-challenges-section6 .carousel-overlay{ border-radius: 6px 6px 0 0; } #custom-challenges-section6 .solutionCard{ border-radius: 6px; } #custom-challenges-section6 .resource-icon{ position:absolute; top: 50%; } #custom-challenges-section6 .sizeBlockh3{ min-height: 70px; } #custom-challenges-section6 .sizeBlockp{ min-height: 100px; } @media (max-width: 1199px) and (min-width: 992px) { #custom-challenges-section6 .carousel-overlay{ height: 220px!important; } } @media (min-width: 1199px){ #modalFormRequest .modal-lg, #modalFormRequest2 .modal-lg{ position: absolute; float: left; left: 50%; top: 50%; transform: translate(-50%, -50%); } #modalFormRequest .modal-body, #modalFormRequest2 .modal-body{ min-width: 790px; } } #modalFormRequest button, #modalFormRequest2 button{ position: absolute; right: 0; top: 3px; } /* IFRAME */ #modalFormRequest iframe, #modalFormRequest2 iframe{ width: 100%; border:none; min-height:446px; } .multistepFormLP #startMultistep input[type=checkbox], .surveyMultistep input[type="checkbox"], #modalFormRequest2 #startMultistep input[type=checkbox]{ display:none; } .multistepFormLP input[type=text], .multistepFormLP input[type=email], .multistepFormLP input[type=tel], .multistepFormLP select, .multistepFormLP select{ border:none!important; border-bottom: 1px solid black!important; } .multistepFormLP select{ width: 60%; } .multistepFormLP select:focus{ box-shadow: none; } .multistepFormLP #startMultistep span.wpcf7-list-item-label, .surveyMultistep span.wpcf7-list-item-label{ cursor: pointer; color: var(--universal-white); font-size: 1em; padding: .5em; border-radius: 4px; background: var(--primary-symtrax); border: 1px solid var(--primary-symtrax); } .multistepFormLP .surveyMultistep{ min-height: 240px!important; } .multistepFormLP #questionMultistep span.wpcf7-list-item{ display: block; margin-top: 10px; } .multistepFormLP #questionMultistep span.wpcf7-list-item label{ display: block; width: 50%; } .multistepFormLP #questionMultistep span.wpcf7-list-item-label{ background: var(--light-symtrax); color: var(--primary-symtrax); font-size: 1em; border: 1px solid var(--primary-symtrax); padding: .4em; display: block; } .multistepFormLP #questionMultistep span.wpcf7-list-item-label:hover{ background: var(--primary-symtrax); color: var(--universal-white); transition: .3s; } .surveyMultistep #acceptance input[type="checkbox"]{ display: block!important; } .surveyMultistep #acceptance span.wpcf7-list-item-label{ background: var(--light-symtrax); color: var(--primary-symtrax); font-size: 1em; border: 1px solid var(--primary-symtrax); padding: .4em; } .surveyMultistep #acceptance span.wpcf7-list-item-label:hover{ background: var(--primary-symtrax); color: var(--universal-white); transition: .3s; } .surveyMultistep #thanksMultistep{ font-size: 1.1em; } .surveyMultistep #acceptance input[type="checkbox"]{ display:none!important } /************** CHALLENGES **************/ @media (max-width: 575.98px) { #challenge-header h1 { font-size: 3em !important; } } @media (min-width: 576px) { #challenge-header h1 { font-size: 3.5em !important; } } #challenge-header #challenge-header-cta:visited { color: #f8f9fa !important; /*text-light*/ } #challenge-header #challenge-header-cta:visited:hover { color: inherit !important; } @media (min-width: 768px) { #challenge-baseline { position: absolute; left: 50%; transform: translate(-50%); } } @media (min-width: 768px) { .challenge-solutions-row { margin-bottom: 1.5rem; } .challenge-solutions-row:last-of-type { margin-bottom: 0 !important; } } @media (max-width: 575.98px) { #challenge-solutions-inner-wrapper .challenge-solutions-row .challenge-solution { margin-bottom: 1.5rem; } #challenge-solutions-inner-wrapper .challenge-solutions-row:last-of-type div:last-of-type { margin-bottom: 0; } } .challenge-solution-inner-wrapper { box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.13); transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); } .challenge-solution-inner-wrapper:hover { box-shadow: 0 14px 28px rgba(0, 0, 0, 0.17), 0 10px 10px rgba(0, 0, 0, 0.15); } .challenge-solution-img { flex-shrink: 0; /* initial value: 1 */ flex-basis: 125px; /* width/height - initial value: auto */ height: 125px; } @media (min-width: 768px) { #challenge-faq #challenge-accordion { width: 75%; } } #challenge-faq #challenge-accordion div:last-of-type { border-bottom: none !important; } #challenge-faq #challenge-accordion div:last-of-type .faq-answer { border-radius: 0px 0px 4px 4px; } #challenge-resources #challenge-resources-container .challenge-resource { max-width: 370px; } #challenge-resources #challenge-resources-container div:not(:last-of-type) { margin-bottom: 24px; } @media (min-width: 992px) { #challenge-resources #challenge-resources-container div:not(:last-of-type) { margin-bottom: 0; } } #challenge-cta #challenge-cta-text h2 { font-size: 2.5em !important; } #challenge-cta #challenge-form { max-width: 400px; } /************** SINGLE SOLUTION **************/ /* Button Cta header */ .buttonSolutionCta{ background-color: var(--light-symtrax)!important; border-color: var(--light-symtrax)!important; color: var(--primary-symtrax)!important; } .buttonSolutionCta:hover{ background: var(--primary-symtrax)!important; border-color: var(--primary-symtrax)!important; transition: .3s!important; color: var(--universal-white)!important; } .buttonSolutionCta:focus{ background-color: var(--light-symtrax)!important; border-color: var(--light-symtrax)!important; color: var(--primary-symtrax)!important; outline: none!important; } /* video player */ #solution-video-wrapper .videoBandeNoireSolution{ position: relative; } #solution-video-wrapper img{ cursor: pointer; } #solution-video-wrapper .videoplayer{ position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } #solution-video-wrapper .videoplayer:hover{ filter: brightness(50%); transition: .3s; } .videoBandeNoireSolution{ overflow: hidden; } #modalSolutionVideo .modal-content{ background-color: var(--universal-black)!important; } #modalSolutionVideo button{ position: absolute; right: 0px; top: 3px; } #modalSolutionVideo iframe{ width: 100%; height:640px; } @media (max-width: 576px) { #solution-video-wrapper .video-img{ max-width: 300px!important; } } /* Overrides Flexboxgrid row margin (include only if class container-fluid not used) */ .row { margin-right: 0 !important; margin-left: 0 !important; } .border-bottom-l { border-bottom: 4px solid #f2f2f2; } /*** SECTION 1 - HEADER ***/ #solution-header { background: #424B5A; color: #ffffff; } @media (min-width: 576px) { #solution-header { padding: 24px 0px; } } #solution-header .inner-wrapper #solution-header-challenge { opacity: 0.5; margin-bottom: 16px; font-size: 1.125em; } #solution-header .inner-wrapper h1 { font-size: 1.5em; font-family: 'open_sansbold', sans-serif !important; margin: 0px 0px 8px 0px; } @media (min-width: 992px) { #solution-header .inner-wrapper h1 { font-size: 2.5em; } } #solution-header .inner-wrapper #solution-header-subtitle { font-size: 1.3em; font-family: 'open_sanslight', sans-serif !important; margin: 0; } @media (min-width: 992px) { #solution-header .inner-wrapper #solution-header-subtitle { font-size: 1.5em; } } /*** SECTION 2 - BREADCRUMB ***/ #solution-breadcrumb { display: none; background: #E9EDF5; color: #424B5A; } @media (min-width: 576px) { #solution-breadcrumb { display: block; } } #solution-breadcrumb #solution-breadcrumb-inner-wrapper { width: 100%; padding: 12px 0px; } @media (min-width: 1200px) { #solution-breadcrumb #solution-breadcrumb-inner-wrapper { width: 1140px; margin: 0px auto; } } #solution-breadcrumb #solution-breadcrumb-inner-wrapper a { color: #424B5A; } #solution-breadcrumb #solution-breadcrumb-inner-wrapper p { margin: 0px; } #solution-wrapper h2{ font-weight: 600!important; } @media (min-width: 992px) { #solution-wrapper #solution-context .inner-wrapper { display: flex; } } #solution-wrapper #solution-context .inner-wrapper #solution-context-img { margin: 0px 30px 30px 0px; } @media (min-width: 992px) { #solution-wrapper #solution-context .inner-wrapper #solution-context-img { width: 35%; margin: auto; margin-right: 50px; } } @media (min-width: 992px) { #solution-wrapper #solution-context .inner-wrapper #solution-context-text { width: 65%; min-width: 65%; } } #solution-wrapper #solution-context .inner-wrapper #solution-context-text h2 { margin-top: 0; font-family: 'open_sansbold', sans-serif !important; font-size: 1.75em; font-weight: 500; margin-bottom: 50px; } #solution-wrapper #solution-context .inner-wrapper #solution-context-text p { font-size: 1.125em; } @media (min-width: 992px) { #solution-wrapper #solution-faq { width: 50%; } } #solution-wrapper #solution-faq #solution-faq-inner-wrapper { padding-left: 10px; padding-right: 10px; } #solution-wrapper #solution-faq #solution-faq-inner-wrapper h2 { margin-top: 0; font-size: 1.75em; } #solution-wrapper #solution-faq #solution-faq-inner-wrapper a { color: #424B5A; } #solution-wrapper #solution-faq #solution-faq-inner-wrapper a:hover { color: #3a4251; } #solution-wrapper #solution-added-value { background: #E9EDF5; color: #424B5A; } #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper h2 { font-size: 1.75em; font-family: 'open_sansbold', sans-serif !important; margin-top: 0px; margin-bottom: 30px; } @media (min-width: 992px) { #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper h2 { text-align: center; margin-bottom: 50px; } } #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper #solution-added-value-wrapper { display: flex; flex-direction: column; justify-content: space-around; } @media (min-width: 992px) { #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper #solution-added-value-wrapper { flex-direction: row; justify-content: center; } } #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper #solution-added-value-wrapper #solution-added-value-text { order: 2; } @media (min-width: 992px) { #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper #solution-added-value-wrapper #solution-added-value-text { order: 1; width: 55%; margin-right: 2%; } } #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper #solution-added-value-wrapper #solution-added-value-text p { font-size: 1.225em; font-weight: 600; } #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper #solution-added-value-wrapper #solution-added-value-text ul { margin-bottom: 0; /*1.75em*/ padding: 0; list-style-type: none; } #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper #solution-added-value-wrapper #solution-added-value-text ul li { font-size: 1.125em; padding: 0px 0px 18px 32px; } #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper #solution-added-value-wrapper #solution-added-value-text ul li:before { font-family: 'Font Awesome 5 Pro'; content: '\f058'; /**/ position: absolute; font-size: 1em; margin-left: -24px; margin-top: 0px; } #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper #solution-added-value-wrapper #solution-added-value-img { order: 1; margin: auto; margin-bottom: 30px; } @media (min-width: 992px) { #solution-wrapper #solution-added-value #solution-added-value-inner-wrapper #solution-added-value-wrapper #solution-added-value-img { margin: auto; margin-left: 2%; margin-right: 0; } } #solution-wrapper #solution-testimonial { background-color: #5a5766; /*background-image: url("https://light.symtrax.com/wp-content/uploads/2019/10/solution-testimonial-background-1024x235.png");*/ /*background-repeat: no-repeat; background-size: 100% 100%;*/ } @media (min-width: 992px) { #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper { display: flex; justify-content: center; } } @media (min-width: 1200px) { #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper { justify-content: space-around; } } #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-titles { color: #ffffff; margin: auto; margin-left: 0; } @media (min-width: 992px) { #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-titles { width: 33%; margin-right: 30px; } } #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-titles #solution-testimonial-type { font-size: 1.125em; font-weight: 300; margin: 0px 0px 12px 0px; } #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-titles #solution-testimonial-title { font-size: 1.75em; margin: 0px 0px 8px 0px; } @media (min-width: 992px) { #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-titles #solution-testimonial-title { margin: 0px; } } #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-titles h3 a { color: #ffffff !important; } #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-titles .ctaCaseStudy { color: var(--universal-white)!important; } #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-titles h3 a:hover { color: #f5f5f5 !important; } #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-infos { background: #ffffff; width: 100%; padding: 0px 30px 20px 30px; } @media (min-width: 1200px) { #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-infos { padding: 10px 50px 30px 50px; } } #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-infos #solution-testimonial-quote { font-size: 1.5em; margin: 0px 0px 20px 0px; } #solution-wrapper #solution-testimonial #solution-testimonial-inner-wrapper #solution-testimonial-infos #solution-testimonial-quote-author { font-family: 'open_sansbold', sans-serif !important; } #solution-wrapper #solution-arguments { /*background: $sym-light-blue;*/ color: #424B5A; } #solution-wrapper #solution-arguments #solution-arguments-inner-wrapper h2 { margin-top: 20px; margin-bottom: 50px; font-size: 1.75em; font-family: 'open_sansbold', sans-serif !important; } #solution-arguments #solution-arguments-inner-wrapper h3{ font-weight: bold; font-size: 22px; } @media (min-width: 768px) { #solution-wrapper #solution-arguments #solution-arguments-inner-wrapper h2 { text-align: center; } } @media (min-width: 768px) { #solution-wrapper #solution-arguments #solution-arguments-inner-wrapper .solution-arguments-row { margin-bottom: 50px; } } #solution-wrapper #solution-arguments #solution-arguments-inner-wrapper .solution-arguments-row .solution-argument { margin-bottom: 30px; } @media (min-width: 768px) { #solution-wrapper #solution-arguments #solution-arguments-inner-wrapper .solution-arguments-row .solution-argument { margin-bottom: 0px; } } #solution-wrapper #solution-arguments #solution-arguments-inner-wrapper .solution-arguments-row .solution-argument h3 { font-size: 1.225em; font-family: 'open_sansbold', sans-serif !important; } #solution-wrapper #solution-arguments #solution-arguments-inner-wrapper .solution-arguments-row .solution-argument p { font-size: 1.125em; } #solution-wrapper #solution-arguments #solution-arguments-inner-wrapper .solution-arguments-row:last-child { margin-bottom: 0; } #solution-wrapper .sep-wrapper { width: 100%; background: #e9edf5; } #solution-wrapper .sep-wrapper .solution-sep { width: 100%; max-width: 1140px; margin: 0px auto; padding: 0px 10px; height: 1px; background: #DCDCDC; } #solution-wrapper #solution-resource { background: #424B5A; color: #ffffff; } @media (min-width: 992px) { #solution-wrapper #solution-resource #solution-resource-inner-wrapper { display: table; width: 100%; } } #solution-wrapper #solution-resource #solution-resource-inner-wrapper h4 { font-weight: 300; } #solution-wrapper #solution-resource #solution-resource-inner-wrapper h3 { font-size: 1.5em; } #solution-wrapper #solution-resource #solution-resource-inner-wrapper h3 a { color: #ffffff !important; } #solution-wrapper #solution-resource #solution-resource-inner-wrapper h3 a:hover { color: #f5f5f5 !important; } @media (min-width: 992px) { #solution-wrapper #solution-resource #solution-resource-inner-wrapper #solution-resource-text { display: table-cell; vertical-align: middle; padding-right: 30px; } } @media (max-width: 575.98px) { #solution-wrapper #solution-resource #solution-resource-inner-wrapper #solution-video-wrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; } } @media (min-width: 992px) { #solution-wrapper #solution-resource #solution-resource-inner-wrapper #solution-video-wrapper { max-width: 100%; height: auto; margin: auto; } } #solution-wrapper #solution-resource #solution-resource-inner-wrapper #solution-video-wrapper #solution-video-iframe { box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); } @media (max-width: 575.98px) { #solution-wrapper #solution-resource #solution-resource-inner-wrapper #solution-video-wrapper #solution-video-iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } } #solution-wrapper #solution-key-features { /*background: $sym-light-blue;*/ color: #424B5A; } #solution-wrapper #solution-key-features #solution-key-features-inner-wrapper h2 { margin-top: 20px; margin-bottom: 50px; font-size: 1.75em; font-family: 'open_sansbold', sans-serif !important; } #solution-wrapper #solution-key-features #solution-key-features-inner-wrapper h3{ font-weight: bold; font-size: 22px; } @media (min-width: 768px) { #solution-wrapper #solution-key-features #solution-key-features-inner-wrapper h2 { text-align: center; } } @media (min-width: 768px) { #solution-wrapper #solution-key-features #solution-key-features-inner-wrapper .solution-key-features-row { margin-bottom: 50px; } } #solution-wrapper #solution-key-features #solution-key-features-inner-wrapper .solution-key-features-row .solution-key-feature { margin-bottom: 30px; } @media (min-width: 768px) { #solution-wrapper #solution-key-features #solution-key-features-inner-wrapper .solution-key-features-row .solution-key-feature { margin-bottom: 0px; } } #solution-wrapper #solution-key-features #solution-key-features-inner-wrapper .solution-key-features-row .solution-key-feature h3 { font-size: 1.225em; font-family: 'open_sansbold', sans-serif !important; } #solution-wrapper #solution-key-features #solution-key-features-inner-wrapper .solution-key-features-row .solution-key-feature p { font-size: 1.125em; } #solution-wrapper #solution-key-features #solution-key-features-inner-wrapper .solution-key-features-row:last-child { margin-bottom: 0; } #solution-wrapper #solution-technical { color: #424B5A; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper h2 { margin-top: 20px; margin-bottom: 50px; font-size: 1.75em; font-family: 'open_sansbold', sans-serif !important; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper h3 { font-weight: bold; font-size: 22px; } @media (min-width: 768px) { #solution-wrapper #solution-technical #solution-technical-inner-wrapper h2 { text-align: center; } } @media (min-width: 992px) { #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-layout-wrapper { display: flex; } } @media (min-width: 992px) { #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-text { width: 50%; margin-right: 30px; } } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-text h2 { font-size: 1.75em; font-family: 'open_sansbold', sans-serif !important; margin-bottom: 50px; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-text h3 { display: flex; align-items: center; font-size: 1.225em; font-weight: 600; margin-bottom: 8px; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-text h3:before { font-family: 'Font Awesome 5 Pro'; content: '\f061'; /**/ margin-right: 10px; font-size: 1.225em; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-text p { margin-bottom: 16px; font-size: 1.125em; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-text p:last-child { margin-bottom: 0px; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-diagram { text-align: center; } @media (min-width: 992px) { #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-diagram { margin: auto; margin-right: 0; width: 50%; } } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-diagram h2 { font-size: 2.25em; font-weight: 300; color: #424B5A; margin: 30px 0px; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-diagram img { margin: auto; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-diagram .lightbox { /** Default lightbox to hidden */ display: none; /** Position and style */ position: fixed; z-index: 999; width: 100%; height: 100%; text-align: center; top: 0; left: 0; background: rgba(0, 0, 0, 0.8); color: #6582BB; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-diagram .lightbox img { /** Pad the lightbox image */ max-width: 80%; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-diagram .lightbox:target { /** Remove default browser outline */ outline: none; /** Unhide lightbox **/ display: flex; flex-direction: column; justify-content: center; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-diagram .lightbox:hover { color: #6582BB; } #solution-wrapper #solution-technical #solution-technical-inner-wrapper #solution-technical-diagram .lightbox #close-lightbox { position: absolute; top: 10%; right: 6%; z-index: 1000; } #solution-wrapper #solution-cta { background: #E9EDF5; } @media (min-width: 992px) { #solution-wrapper #solution-cta #solution-cta-inner-wrapper { display: flex; align-items: center; justify-content: space-around; padding: 70px 12px; } } @media (min-width: 992px) { #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-cta-text { width: 60%; } } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-cta-text h2 { font-size: 2.25em; font-family: 'open_sansbold', sans-serif !important; line-height: 1; display: block; margin: 0px 0px 16px 0px; } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-cta-text p { font-size: 1.625em; margin: 0px 0px 16px 0px; } @media (min-width: 992px) { #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-cta-text p { margin: 0; } } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-form { max-width: 400px; } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-form .wpcf7 form .screen-reader-response { display: none; } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-form .wpcf7 form .ajax-loader { display: none; } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-form .wpcf7 form .wpcf7-response-output { margin: 0 !important; margin-top: 16px !important; } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-form #zugferd-forms #zugferdPdfDropzone { height: 150px !important; border: 1px dashed #6c757d !important; } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-form #zugferd-forms .dz-button { color: #6c757d; border: none; background-color: #fff; } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-form #zugferd-forms .dz-button:hover { background-color: #fff; } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-form #zugferd-forms .dz-button:focus { outline: none; } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-cta-btn { font-size: 1.125em; display: block; color: #ffffff; font-weight: 400; background: #6582BB; padding: 15px 45px; text-align: center; -webkit-transition: all .3s; -moz-transition: all .3s; transition: all .3s; } #solution-wrapper #solution-cta #solution-cta-inner-wrapper #solution-cta-btn:hover { transform: scale(1.1); } #solution-wrapper #solution-learn-more { background: #424B5A; color: #fff; } #solution-wrapper #solution-learn-more h2 { font-size: 2.25em; font-family: 'open_sansbold', sans-serif !important; text-align: center; margin: 0px 0px 50px 0px; } #solution-wrapper #solution-learn-more h3 { font-weight: 300; } #solution-wrapper #solution-learn-more #solution-featured { margin-bottom: 30px; } @media (min-width: 576px) { #solution-wrapper #solution-learn-more #solution-featured { padding: 0px 16px; } } #solution-wrapper #solution-learn-more #solution-featured #solution-featured-inner-wrapper { height: 100%; background: rgba(251, 249, 249, 0.19); border-radius: 8px; padding: 16px; } @media (min-width: 576px) { #solution-wrapper #solution-learn-more #solution-featured #solution-featured-inner-wrapper { display: flex; } } #solution-wrapper #solution-learn-more #solution-featured #solution-featured-inner-wrapper #solution-featured-img { display: flex; justify-content: center; /* align horizontal */ align-items: center; /* align vertical */ } #solution-wrapper #solution-learn-more #solution-featured #solution-featured-inner-wrapper #solution-featured-text { flex: 1; display: flex; flex-direction: column; justify-content: center; margin-left: 16px; } #solution-wrapper #solution-learn-more #solution-featured #solution-featured-inner-wrapper #solution-featured-text a { color: #fff !important; } #solution-wrapper #solution-learn-more #solution-featured #solution-featured-inner-wrapper #solution-featured-text h5 { margin-top: 0px; } #solution-wrapper #solution-learn-more #solution-featured #solution-featured-inner-wrapper #solution-featured-text #solution-featured-more { font-weight: 300; font-size: 1.25em; transition: 0.2s ease-in-out; transform-origin: left; } #solution-wrapper #solution-learn-more #solution-featured #solution-featured-inner-wrapper #solution-featured-text #solution-featured-more:hover { transform: scale(1.1); } @media (min-width: 576px) { #solution-wrapper #solution-learn-more #solution-related h3 { padding: 0px 16px; } } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row:not(:last-child) { margin-bottom: 20px; } @media (min-width: 992px) { #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row:not(:last-child) { margin-bottom: 30px; } } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution { width: 100%; } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution:first-child { margin-bottom: 20px; } @media (min-width: 768px) { #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution:first-child { margin-bottom: 0px; } } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper { display: flex; height: 100%; background: rgba(251, 249, 249, 0.19); border-radius: 8px; padding: 10px 20px 10px 8px; } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper:not(:last-child) { margin-bottom: 16px; } @media (min-width: 992px) { #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper:not(:last-child) { margin-bottom: 0px; } } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper .solution-related-img { display: flex; justify-content: center; /* align horizontal */ align-items: center; /* align vertical */ } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper .related-solution-text { flex: 1; display: flex; flex-direction: column; justify-content: center; margin-left: 10px; } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper .related-solution-text a { color: #ffffff !important; } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper .related-solution-text a:hover { color: #f5f5f5 !important; } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper .related-solution-text h4 { margin: 0px 0px 8px 0px; font-size: 1.125em; font-weight: 600; } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper .related-solution-text p { margin: 0px 0px 4px 0px; color: #ffffff; } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper .related-solution-text .related-solution-more { font-weight: 300; transition: 0.2s ease-in-out; transform-origin: left; } #solution-wrapper #solution-learn-more #solution-related #solution-related-inner-wrapper .solution-related-row .related-solution .related-solution-inner-wrapper .related-solution-text .related-solution-more:hover { transform: scale(1.1); } @media (min-width: 576px) { #solution-wrapper #solution-learn-more #solution-related-blog h3 { padding: 0px 16px; } } #solution-wrapper #solution-learn-more #solution-related-blog #solution-related-blog-inner-wrapper { display: inline-block; padding: 16px; background: rgba(251, 249, 249, 0.19); border-radius: 8px; } @media (min-width: 576px) { #solution-wrapper #solution-learn-more #solution-related-blog #solution-related-blog-inner-wrapper { margin: 0 16px; } } #solution-wrapper #solution-learn-more #solution-related-blog #solution-related-blog-inner-wrapper a { color: #ffffff !important; } #solution-wrapper #solution-learn-more #solution-related-blog #solution-related-blog-inner-wrapper a:hover { color: #f5f5f5 !important; } #solution-wrapper #solution-learn-more #solution-related-blog #solution-related-blog-inner-wrapper a { font-size: 1.125em; } /************** PRODUCTS **************/ #products-header { color: #ffffff; background: #424B5A; padding: 30px 10px; } @media (min-width: 768px) { #products-header { display: flex; justify-content: center; align-items: center; min-height: 400px; padding: 0px; } } #products-header #products-header-inner-wrapper { max-width: 1140px; margin: auto; } @media (min-width: 768px) { #products-header #products-header-inner-wrapper { display: flex; justify-content: center; align-items: center; } } #products-header #products-header-inner-wrapper #products-compleo-logo { text-align: right; width: 75%; margin: auto; margin-bottom: 20px; } @media (min-width: 768px) { #products-header #products-header-inner-wrapper #products-compleo-logo { width: 40%; margin-right: 10px; } } #products-header #products-header-inner-wrapper #products-titles { text-align: center; } @media (min-width: 768px) { #products-header #products-header-inner-wrapper #products-titles { width: 60%; margin-left: 10px; text-align: left; } } #products-header #products-header-inner-wrapper #products-titles h3 { font-size: 1.25em; font-weight: 400; line-height: 1; margin: 0; margin-bottom: 20px; } #products-header #products-header-inner-wrapper #products-titles h1 { line-height: 1; margin: 0; } #products-container #products-container-inner-wrapper { padding: 30px 10px; margin: auto; } #products-container #products-container-inner-wrapper a { color: #424B5A !important; } @media (min-width: 1200px) { #products-container #products-container-inner-wrapper { max-width: 1140px; } } #products-container #products-container-inner-wrapper #products-container-text { text-align: center; max-width: 822px; margin: auto; margin-bottom: 30px; } #products-container #products-container-inner-wrapper #products-container-text h2 { font-size: 2.875em; font-weight: 600; margin-top: 0px; } @media (min-width: 768px) { #products-container #products-container-inner-wrapper #products-container-text h2 { margin-top: inherit; } } #products-container #products-container-inner-wrapper #products-container-text p { font-weight: 300; line-height: 2; margin: 0px; } @media (min-width: 768px) { #products-container #products-container-inner-wrapper #products-grid-inner-wrapper .row:not(last-child) { margin-bottom: 30px; } } #products-container #products-container-inner-wrapper #products-grid-inner-wrapper .row .product { margin: 0px auto 20px auto; } @media (min-width: 992px) { #products-container #products-container-inner-wrapper #products-grid-inner-wrapper .row .product { margin: 0px; } } #products-container #products-container-inner-wrapper #products-grid-inner-wrapper .row .product .product-inner-wrapper { width: 300px; padding: 40px 50px; margin: auto; height: 100%; color: #3a4251; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); border-top-right-radius: 15px; border-top-left-radius: 15px; border-bottom-right-radius: 15px; } @media (min-width: 576px) { #products-container #products-container-inner-wrapper #products-grid-inner-wrapper .row .product .product-inner-wrapper { width: 332px; } } @media (min-width: 992px) { #products-container #products-container-inner-wrapper #products-grid-inner-wrapper .row .product .product-inner-wrapper { width: 300px; } } @media (min-width: 1200px) { #products-container #products-container-inner-wrapper #products-grid-inner-wrapper .row .product .product-inner-wrapper { width: 100%; } } #products-container #products-container-inner-wrapper #products-grid-inner-wrapper .row .product .product-inner-wrapper:hover { box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22); } #products-container #products-container-inner-wrapper #products-grid-inner-wrapper .row .product .product-inner-wrapper img { display: block; margin: auto; width: 165px; } #products-container #products-container-inner-wrapper #products-grid-inner-wrapper .row .product .product-inner-wrapper h3 { font-size: 1.25em; } /************** SINGLE PRODUCT **************/ .product-feature0, .product-feature2, .product-feature4 { background-color: #e9edf5; } .discoverLink{ position: absolute; bottom: 17px; right: 34px; } #single-product-header { background: #424b5a; color: #ffffff; padding: 30px; } @media (min-width: 768px) { #single-product-header { padding: 45px; } } #single-product-header #single-product-header-inner { max-width: 1140px; margin: auto; text-align: center; } #single-product-header #single-product-header-inner .row #single-product-logo { margin: auto; } @media (min-width: 992px) { #single-product-header #single-product-header-inner .row #single-product-header-right { text-align: left; } } #single-product-header #single-product-header-inner .row #single-product-header-right p { width: 75%; margin-left: auto; margin-right: auto; font-size: 1.25em; } @media (min-width: 992px) { #single-product-header #single-product-header-inner .row #single-product-header-right p { width: 100%; } } @media (min-width: 768px) { #single-product-header #single-product-header-inner #header-features-container .row:not(:last-child) { margin-bottom: 10px; } } #single-product-header #single-product-header-inner #header-features-container .row .header-feature { margin-bottom: 12px; } @media (min-width: 768px) { #single-product-header #single-product-header-inner #header-features-container .row .header-feature { padding: 0px 5px; margin-bottom: 0px; } } #single-product-header #single-product-header-inner #header-features-container .row .header-feature .header-feature-inner-wrapper { text-align: center; background: #ffffff; color: #50656e; padding: 15px; } #single-product-container #single-product-inner-container #single-product-diagram-container { max-width: 1140px; margin: auto; padding: 30px 10px; } @media (min-width: 768px) { #single-product-container #single-product-inner-container #single-product-diagram-container { padding: 50px 0px; } } #single-product-container #single-product-inner-container #single-product-diagram-container #single-product-diagram-inner-container #single-product-diagram-text { width: 100%; } #single-product-container #single-product-inner-container #product-features-container #product-features-inner-container { max-width: 1140px; margin: auto; } #single-product-container #single-product-inner-container #product-features-container #product-features-inner-container .product-feature div { padding: 0px; } #single-product-container #single-product-inner-container #product-features-container #product-features-inner-container .product-feature .product-feature-text { text-align: left; } @media (min-width: 768px) { #single-product-container #single-product-inner-container #product-features-container #product-features-inner-container .product-feature .product-feature-text { padding: 15px 55px; } } #single-product-container #single-product-inner-container #product-features-container #product-features-inner-container .product-feature .product-feature-text h2 { font-size: 2em; font-weight: 400; } #single-product-container #single-product-inner-container #single-product-cta { color: #ffffff; background: #424B5A; } #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper { max-width: 1140px; margin: auto; padding: 30px 0px; text-align: center; } @media (min-width: 768px) { #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper { padding: 100px 0px; } } #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper #single-product-cta-inner { margin: auto; } @media (min-width: 576px) { #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper #single-product-cta-inner { display: inline-flex; justify-content: center; align-items: center; } } #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper #single-product-cta-inner #single-product-cta-text { margin-right: 10px; } #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper #single-product-cta-inner #single-product-cta-text span:first-child { font-weight: 300; } #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper #single-product-cta-inner #single-product-cta-text h3 { text-align: center; font-size: 30px; } @media (min-width: 768px) { #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper #single-product-cta-inner #single-product-cta-text h3 { text-align: right; } } #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper #single-product-cta-inner #single-product-cta-btn { display: inline-block; margin-left: 10px; padding: 15px 30px; background: #006BB4; border-radius: 4px; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); } #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper #single-product-cta-inner #single-product-cta-btn:hover { box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); } #single-product-container #single-product-inner-container #single-product-cta #single-product-cta-wrapper #single-product-cta-inner #single-product-cta-btn i { margin-right: 4px; } #single-product-container #single-product-inner-container #single-product-grid { background: #e9edf5; padding: 30px 10px; } @media (min-width: 768px) { #single-product-container #single-product-inner-container #single-product-grid { padding: 50px 10px; } } #single-product-container #single-product-inner-container #single-product-grid #single-product-grid-inner-wrapper { max-width: 1140px; margin: auto; } #single-product-container #single-product-inner-container #single-product-grid #single-product-grid-inner-wrapper h3 { font-size: 1.75em; text-align: center; color: #000000; margin-top: 0; } @media (min-width: 768px) { #single-product-container #single-product-inner-container #single-product-grid #single-product-grid-inner-wrapper h3 { font-size: 2.25em; } } @media (min-width: 768px) { #single-product-container #single-product-inner-container #single-product-grid #single-product-grid-inner-wrapper .row { margin-bottom: 20px; } } #single-product-container #single-product-inner-container #single-product-grid #single-product-grid-inner-wrapper .row .product { width: 90%; min-height: 100%; margin: 0px auto 20px auto; } @media (min-width: 576px) { #single-product-container #single-product-inner-container #single-product-grid #single-product-grid-inner-wrapper .row .product { width: 55%; } } @media (min-width: 768px) { #single-product-container #single-product-inner-container #single-product-grid #single-product-grid-inner-wrapper .row .product { width: 50%; margin: 0px 0px 20px 0px; } } #single-product-container #single-product-inner-container #single-product-grid #single-product-grid-inner-wrapper .row .product .product-inner-wrapper { padding: 32px; height: 100%; background: #ffffff; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); border-top-right-radius: 15px; border-top-left-radius: 15px; border-bottom-right-radius: 15px; } #single-product-container #single-product-inner-container #single-product-grid #single-product-grid-inner-wrapper .row .product .product-inner-wrapper:hover { box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22); } #single-product-container #single-product-inner-container #single-product-grid #single-product-grid-inner-wrapper .row .product .product-inner-wrapper .single-product-image { margin: auto; } /************** SINGLE RESOURCE **************/ .single-header { padding: 30px 10px; text-align: center; color: #FFFFFF; background: #3a4251; } @media (min-width: 992px) { .single-header { padding: 50px 50px 125px 50px; } } .single-header .single-inner-header { max-width: 1140px; margin: auto; } .single-header .single-inner-header .icon-wrapper { display: flex; justify-content: center; align-items: center; } .single-header .single-inner-header .icon-wrapper h2 { font-weight: 300; } .single-header .single-inner-header .icon-wrapper i { font-size: 2.225em; margin-right: 16px; } .single-wrapper { background: #ffffff; width: 100%; max-width: 1140px; margin: auto; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.13); } @media (min-width: 992px) { .single-wrapper { margin-top: -100px; } } .single-wrapper .single-inner-wrapper { padding: 10px; margin-bottom: 30px; } @media (min-width: 768px) { .single-wrapper .single-inner-wrapper { padding: 30px; } } .single-wrapper .single-inner-wrapper .single-thumbnail { margin-bottom: 30px; } .single-wrapper .single-inner-wrapper .single-thumbnail img { display: block; margin-left: auto; margin-right: auto; } .single-wrapper .single-inner-wrapper .single-content a { color: #006BB4 !important; } .single-wrapper .single-inner-wrapper .single-content a:hover { color: #00548e !important; } .single-wrapper .single-inner-wrapper .single-content #testimonial-about { padding: 20px; background: #f2f2f2; border-radius: 8px; } .single-wrapper .single-inner-wrapper .single-content h2 { color: #424B5A; } .single-wrapper .single-inner-wrapper .single-content blockquote { padding-left: 16px; margin-left: 0px; margin-top: 24px; margin-bottom: 24px; border-left: 5px solid #424B5A; } .single-wrapper .single-inner-wrapper .single-content blockquote p:first-of-type { font-size: 1.75em; font-style: italic; } .single-wrapper .single-inner-wrapper .single-content iframe { text-align: center; } .single-wrapper .single-inner-wrapper .single-related-challenges { padding: 1em 0 1em 0; border-top: 1px solid #DCDCDC; border-bottom: 1px solid #DCDCDC; } @media (min-width: 992px) { .single-wrapper .single-inner-wrapper .single-related { display: flex; justify-content: space-between; } } .single-wrapper .single-inner-wrapper .single-related .resource-card { max-width: 345px; margin-left: auto; margin-right: auto; } @media (min-width: 992px) { .single-wrapper .single-inner-wrapper .single-related .resource-card { margin: initial; flex-basis: 300px; min-width: 30%; } } @media (min-width: 1200px) { .single-wrapper .single-inner-wrapper .single-related .resource-card { flex-basis: 345px; } } .single-wrapper .single-inner-wrapper .single-related .resource-card .resource-title-link { font-size: 1em !important; } .single-wrapper .single-inner-wrapper .single-related .resource-card:not(:last-child) { margin-bottom: 20px; } @media (min-width: 992px) { .single-wrapper .single-inner-wrapper .single-related .resource-card:not(:last-child) { margin-bottom: 0px; } } .single-cta { background: #E9EDF5;} .single-cta .single-cta-inner-wrapper { max-width: 1140px; margin: auto; padding: 30px 0px; } @media (min-width: 992px) { .single-cta .single-cta-inner-wrapper { display: flex; align-items: center; justify-content: space-around; padding: 70px 0px; } } @media (min-width: 992px) { .single-cta .single-cta-inner-wrapper .single-cta-text { width: 60%; } } .single-cta .single-cta-inner-wrapper .single-cta-text h2 { font-size: 2.25em; font-weight: bold; line-height: 1; display: block; margin: 0px 0px 16px 0px; } .single-cta .single-cta-inner-wrapper .single-cta-text p { font-size: 1.625em; margin: 0px 0px 16px 0px; } @media (min-width: 992px) { .single-cta .single-cta-inner-wrapper .single-cta-text p { margin: 0; } } .single-cta .single-cta-inner-wrapper .single-cta-btn { font-size: 1.125em; display: block; color: #ffffff; font-weight: 400; background: #6582BB; padding: 15px 45px; text-align: center; } /* Single Video/Webinar */ #single-video-container, #single-webinar-container { margin-bottom: 20px; } @media (min-width: 768px) { #single-video-container, #single-webinar-container { margin-bottom: 0px; } } #single-video-container #single-video-iframe-wrapper, #single-video-container #single-webinar-iframe-wrapper, #single-webinar-container #single-video-iframe-wrapper, #single-webinar-container #single-webinar-iframe-wrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; } #single-video-container #single-video-iframe-wrapper #single-video-iframe, #single-video-container #single-video-iframe-wrapper #single-webinar-iframe, #single-video-container #single-webinar-iframe-wrapper #single-video-iframe, #single-video-container #single-webinar-iframe-wrapper #single-webinar-iframe, #single-webinar-container #single-video-iframe-wrapper #single-video-iframe, #single-webinar-container #single-video-iframe-wrapper #single-webinar-iframe, #single-webinar-container #single-webinar-iframe-wrapper #single-video-iframe, #single-webinar-container #single-webinar-iframe-wrapper #single-webinar-iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; /*box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);*/ } /* Single Webinar */ #webinar-header .fa-calendar-alt, #webinar-header .fa-clock, #webinar-header .webinfo { font-size: 20px; } #newFormGoToWebinar, #formToIframe{ margin-top: -322px!important; color: var(--universal-black); } /* disclaimer */ #newFormGoToWebinar p { font-size: 12px; color: #424B5A; } #externGoLink{ margin-top:-306px!important; } .formCardGo{ background-color: var(--universal-white); border-radius: 9px; box-shadow: 0px 32px 62px #00000047; min-height:650px; } .formCardGo h2{ color:#006BB4; } #externGoLink .formCardGo{ min-height: auto!important; } .new-single-header{ text-align: center; color: var(--universal-white); background: #3a4251; } .blueDiv{ margin-top: -178px; background-image: url("/wp-content/themes/Symtrax/library/images/blue-background.png"); background-repeat: no-repeat; background-size: cover; min-height: 450px; } .blueDiv img{ margin-top: -100px; } .tag-webinar{ display:inline-block; border: 1px solid #FFF; border-radius: 5px; font-size: 14px;; } #presented .presented{ color:#B3B7BD; } #presented{ font-size: 23px; color:#424B5A; position:absolute; } #presented .jobtitle{ font-size: 1.1rem; } .webinarLearn{ background-color: #F2F7FB; border-color: #F2F7FB; color:#3389C3; } .webinarLearn:hover{ background-color: var(--primary-symtrax); border-color: var(--primary-symtrax); } .webinarLearn:focus{ background-color: var(--primary-symtrax); border-color: var(--primary-symtrax); color:#fff; outline: none; } #webinar-number-custom .webinar-number p:first-child, #webinar-number-custom .webinar-number p:nth-child(3) { color:#001524; font-size: 25px; } #webinar-number-custom .webinar-number p:nth-child(2){ color:#001524; font-size: 78px; font-weight: 800; } #webinar-number-custom .webinar-number p{ margin-bottom: -1rem; } @media (max-width: 1199px){ .blueDiv{ display: none; } #newFormGoToWebinar, #formToIframe, #externGoLink{ margin-top: 30px!important; } #presented{ position: relative!important; } .formCardExterne{ min-height: auto!important; } } #formToIframe iframe{ border:none; } .formCardExterne{ min-height:360px; } #webinar-challenges a:hover{ background-color: var(--primary-symtrax); border-color: var(--primary-symtrax); } #webinar-challenges a::before{ font-family: 'Font Awesome 5 Pro'; content: '\f02c'; display: inline-block; padding-right: 10px; } #webinar-header #webinar-subtitle { font-size: 1.5em; margin-bottom: 20px; } @media (min-width: 992px) { #webinar-header #webinar-subtitle { margin-bottom: 50px; } } #webinar-header #webinar-registration-cta { margin-bottom: 20px; } #webinar-header #webinar-registration-cta a { display: inline-block; padding: 15px 30px; color: #424B5A; background: #ffffff; font-weight: 600; font-size: larger; border-radius: 4px; } @media (min-width: 992px) { #webinar-header #webinar-registration-cta { margin-bottom: 50px; } } #webinar-header #webinar-countdown { min-height: 60px; } @media (min-width: 992px) { #webinar-header #webinar-countdown { min-height: 162px; } } @media (min-width: 992px) { #single-webinar-wrapper { margin-top: -125px; } } #single-webinar-wrapper #webinar-registration-form { text-align: center; padding: 50px 0px; border-bottom: 1px solid #DCDCDC; background: #DCDCDC; } #single-webinar-wrapper #webinar-registration-form h3 { margin-top: 0px; } #single-webinar-wrapper #webinar-registration-form iframe { border: 1px solid #DCDCDC; border-radius: 4px; /*box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);*/ } #single-webinar-wrapper #webinar-presenter-wrapper { padding: 50px 0px; border-bottom: 1px solid #DCDCDC; color: #3a4251; text-align: center; } @media (min-width: 992px) { #single-webinar-wrapper #webinar-presenter-wrapper { display: flex; justify-content: space-around; align-items: center; text-align: left; } } #single-webinar-wrapper #webinar-presenter-wrapper #webinar-presented-by { font-size: 2em; margin-bottom: 30px; } #single-webinar-wrapper #webinar-presenter-wrapper #webinar-presenter-icon { margin-bottom: 30px; } #single-webinar-wrapper #webinar-presenter-wrapper #webinar-presenter-infos #webinar-presenter-name { font-size: 1.2em; margin-bottom: 0.2em; } #single-webinar-wrapper #webinar-presenter-wrapper #webinar-presenter-infos #webinar-presenter-jobtitle { margin-bottom: 1em; } #single-webinar-wrapper #webinar-presenter-wrapper #webinar-presenter-infos #webinar-presenter-phone { margin-bottom: 0.2em; } #webinar-presenter-wrapper { max-width: 1140px; } #related-webinars { max-width: 1140px; } #related-webinars .resource-card { max-width: 345px; margin-left: auto; margin-right: auto; } @media (min-width: 992px) { #related-webinars .resource-card { margin: initial; flex-basis: 300px; min-width: 30%; } } @media (min-width: 1200px) { #related-webinars .resource-card { flex-basis: 345px; } } #related-webinars .resource-card .resource-title-link { font-size: 1em !important; } #related-webinars .resource-card:not(:last-child) { margin-bottom: 20px; } @media (min-width: 992px) { #related-webinars .resource-card:not(:last-child) { margin-bottom: 0px; } } /* Single Webinar with form */ #webinar-header-with-form { background: var(--bg-symtrax); } #webinar-header-with-form .dot { height: 50px; width: 50px; background-color: var(--universal-white); border-radius: 50%; display: inline-block; } #webinar-header-with-form .fa-users-class{ padding-top:13px!important; } #webinar-header-with-form h2{ font-size: 1.7em; } #single-webinar-wrapper-with-form{ background: linear-gradient(172deg, var(--bg-symtrax) 40%, var(--universal-white) 40%); } #single-webinar-wrapper-with-form ul{ list-style-type: none; } #single-webinar-wrapper-with-form li:before{ font-family: 'Font Awesome 5 Pro'; content: "\f138"; display: inline-block; margin-left: -27px; width: 1.6em; } .with-form-form{ border-radius: 10px; } .bg-with-form{ background: #FFFFFF5b; } /* Single Video */ #video-challenges a::before{ font-family: 'Font Awesome 5 Pro'; content: '\f02c'; display: inline-block; padding-right: 10px; } #video-challenges a{ display: inline-block; font-weight: 400; color: #006bb4; border-color: #006bb4!important; text-align: center; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: transparent; border: 1px solid transparent; padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; border-radius: .25rem; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; } #video-challenges a:active{ box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 50%); } #video-challenges a:hover{ color: #fff; background-color: var(--primary-symtrax); border-color: var(--primary-symtrax); text-decoration: none; } #single-video-text { padding: 30px; } /* Single eBook/testimonial */ #page-whitepapers-section1 .fa-book { padding-top: 0.9rem !important; padding-left: 0.9rem !important; } #page-whitepapers-section1 { background: var(--bg-symtrax); } #page-whitepapers-section1 h2 { font-size: 1.7em; } #page-whitepapers-section1 .dot { height: 50px; width: 50px; background-color: var(--universal-white); border-radius: 50%; display: inline-block; } #page-whitepapers-section1 .fa-book { padding-top: 0.9rem !important; padding-left: 0.9rem !important; } #page-whitepapers-section-2 { background-color: #fff; } .bg-linear-symtrax { background: linear-gradient(90deg, var(--bg-symtrax) 40%, var(--universal-white) 40%); } #page-whitepapers-section1 #page-whitepapers-content li:before { font-family: 'Font Awesome 5 Pro'; content: "\f138"; display: inline-block; margin-left: -27px; width: 1.6em; } #page-whitepapers-section1 #page-whitepapers-content ul { list-style-type: none; } #whitepaper-challenges a::before, #testimonial-challenges a::before{ font-family: 'Font Awesome 5 Pro'; content: '\f02c'; display: inline-block; padding-right: 10px; } #whitepaper-challenges a, #testimonial-challenges a{ display: inline-block; font-weight: 400; color: #006bb4; border-color: #006bb4!important; text-align: center; vertical-align: middle; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: transparent; border: 1px solid transparent; padding: .375rem .75rem; font-size: 1rem; line-height: 1.5; border-radius: .25rem; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; } #whitepaper-challenges a:active, #testimonial-challenges a:active{ box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 50%); } #whitepaper-challenges a:hover, #testimonial-challenges a:hover{ color: #fff; background-color: var(--primary-symtrax); border-color: var(--primary-symtrax); text-decoration: none; } #whitepaper-inner-header #download-btn { display: inline-block; padding: 15px 30px; color: #424B5A; background: #ffffff; font-weight: 600; border-radius: 4px; } /************** JOB OPPORTUNITIES **************/ #jobs-header { padding: 50px 0px; text-align: center; color: #FFFFFF; background: #3a4251; } @media (min-width: 768px) { #jobs-header .entry-title { font-size: 2.75em; } } @media (min-width: 1200px) { #jobs-header { margin-bottom: 50px; } } #apply-now { background: #E9EDF5; padding: 20px; text-align: center; font-size: 1.3em; } @media (min-width: 1200px) { #apply-now { width: 1140px; padding: 40px 50px; margin: 0px auto 50px auto; border-radius: 4px; } } @media (min-width: 1200px) { #jobs-wrapper { width: 320px; margin: auto; margin-bottom: 100px; } } @media (min-width: 1200px) and (min-width: 768px) { #jobs-wrapper { width: 1140px; } } #jobs-wrapper .job-opportunity { display: flex; flex-wrap: wrap; align-items: flex-start; border-bottom: 1px solid #DCDCDC; padding: 20px; margin: 0px 10px; } @media (min-width: 1200px) { #jobs-wrapper .job-opportunity { padding: 30px 0px; justify-content: space-between; transition: background-color 200ms linear; } #jobs-wrapper .job-opportunity:hover { background-color: #FBFBFC; } #jobs-wrapper .job-opportunity > * { margin: auto; } } #jobs-wrapper .job-opportunity:last-child { border-bottom: none; } #jobs-wrapper .job-opportunity .job-title { width: 100%; line-height: 1; } @media (min-width: 1200px) { #jobs-wrapper .job-opportunity .job-title { width: 40%; line-height: 24px; margin-left: 10px; } } #jobs-wrapper .job-opportunity .job-title .job-title-link { font-size: 24px; color: #424B5A; } #jobs-wrapper .job-opportunity .job-title .job-title-link:hover { color: #424B5A; } @media (min-width: 1200px) { #jobs-wrapper .job-opportunity .job-location, #jobs-wrapper .job-opportunity .job-career { width: 15%; margin-left: 0px; margin-right: 0px; } } #jobs-wrapper .job-opportunity .job-location { margin-right: 10px; } @media (min-width: 1200px) { #jobs-wrapper .job-opportunity .separator { display: none; } } #jobs-wrapper .job-opportunity .job-career { margin-left: 10px; } #jobs-wrapper .job-opportunity .job-cta-wrap { width: 100%; } @media (min-width: 1200px) { #jobs-wrapper .job-opportunity .job-cta-wrap { width: auto; margin-right: 10px; } } #jobs-wrapper .job-opportunity .job-cta-wrap .job-cta { margin: 10px 0px 0px 0px; } @media (min-width: 1200px) { #jobs-wrapper .job-opportunity .job-cta-wrap .job-cta { margin: 0px; } } #apply-now-cta, .job-cta { display: inline-block; color: #FFFFFF; border: 1px solid #3a4251; background: #3a4251; padding: 8px 20px; border-radius: 4px; } @media (min-width: 768px) { #apply-now-cta, .job-cta { padding: 10px 22px; } } #apply-now-cta:hover, .job-cta:hover { background: #424B5A; color: #FFFFFF; } /**************************************************/ #job-form { padding: 0px 20px 10px 20px; margin: auto; background: #FFFFFF; } @media (min-width: 768px) { #job-form { background: #FFFFFF; } } #job-form h2 { text-align: center; padding: 20px 20px 10px 20px; margin-top: 0px; color: #3a4251; font-weight: bold; } #job-form a { color: #6582BB; } #job-form a:hover { color: #424B5A; } #job-form #first-name-label, #job-form #last-name-label, #job-form #email-label, #job-form #phone-label, #job-form #office-label, #job-form #department-label { display: none; } #job-form #first-name, #job-form #last-name, #job-form #candidate-email, #job-form #candidate-phone, #job-form #office, #job-form #department, #job-form #message, #job-form #register { border-radius: 0px; } /* #job-form #register { width: 100%; color: #FFFFFF; background: #3a4251; border: 1px solid #333A48; } */ /* Page Job careers 2022 */ #header-career2022 { background: var(--bg-symtrax); background-image: url('https://www.symtrax.com/wp-content/uploads/2022/11/bg-careers.png'); background-repeat: no-repeat; background-position-x: center; background-position-y: bottom; } @media (max-width: 1200px) { #header-career2022 { background-image: none !important; } } #header-career2022 i { padding-top: 11px; } #header-career2022 h1 { color: #002B48; font-size: 2.3em; } #header-career2022 p { font-size: 1.3em; } #header-career2022 .dot { height: 50px; width: 50px; background-color: var(--universal-white); border-radius: 50%; display: inline-block; } #carousel-career2022, #corporate-value-career2022, #open-positions-career2022, #show-positions-career2022, #show-positions-career2022 .card { background-color: #F5F5F5 !important; } #carousel-career2022 h1, #corporate-value-career2022 h1, #corporate-value-career2022 h1 { color: #00406C; font-size: 2.3em; } #corporate-value-career2022 h3 { font-size: 1.5em; } #corporate-value-career2022 h3::before { font-family: 'Font Awesome 5 Pro'; content: "\f00c"; color: #12b76a; display: inline-block; margin-left: -35px; height: 20px; width: 20px; background-color: #d1fadf; margin-right: 13px; padding-left: 4px; border-radius: 50%; font-size: 13px; padding-top: 1px; } #carousel-career2022 button { position: absolute; right: 0; top: 3px; } #carousel-career2022 .modal { background-color: #00000082 !important; } #carousel-career2022 img, #carousel-career2022 h2 { cursor: pointer; } #carousel-career2022 .videoplayer { position: absolute; bottom: 10%; left: 7%; } #carousel-career2022 h2 { position: absolute; bottom: 10%; left: 21%; color: var(--universal-white); font-size: 19px; font-weight: bold; } #carousel-career2022 div:hover>.videoplayer { filter: brightness(50%); transition: .3s; } #carousel-desktop-career-2022, #carousel-mobile-career-2022{ position:relative; } #carousel-desktop-career-2022 .arrowLeftCarouJobDektop, #carousel-mobile-career-2022 .arrowLeftCarouJobMobile { position: absolute; top: 35%; left: -5%; font-size: 33px; color: var(--secondary-symtrax); } #carousel-desktop-career-2022 .arrowRightCarouJobDesktop, #carousel-mobile-career-2022 .arrowRightCarouJobMobile { position: absolute; top: 35%; right: -5%; font-size: 33px; color: var(--secondary-symtrax); } #carousel-desktop-career-2022 .arrowLeftCarouJobDektop:focus, #carousel-desktop-career-2022 .arrowRightCarouJobDesktop:focus, #carousel-mobile-career-2022 .arrowLeftCarouJobMobile:focus, #carousel-mobile-career-2022 .arrowRightCarouJobMobile:focus { box-shadow: none!important; outline: none!important; } #open-positions-career2022 span { height: 10px !important; width: 10px !important; } #open-positions-career2022 .rounded, #show-positions-career2022 .rounded { border-radius: 1.5rem !important; } #open-positions-career2022 .activeCareer { border: 2px solid #383838; } #open-positions-career2022 .Sales.activeCareer { border: 2px solid #006BB4 !important; } #open-positions-career2022 .Development.activeCareer { border: 2px solid #633E0B !important; } #open-positions-career2022 .Marketing.activeCareer { border: 2px solid #B02A37 !important; } #open-positions-career2022 .Support.activeCareer { border: 2px solid #324B4E !important; } #open-positions-career2022 .Administration.activeCareer { border: 2px solid #1A6355 !important; } #show-positions-career2022 h2 { font-size: 1.3em; } #show-positions-career2022 .dot { width: 5px; height: 5px; } #show-positions-career2022 p:hover { cursor: default; } @media (min-width: 409px) and (max-width: 575px){ #carousel-career2022 .videoplayer{ left:19%!important; } #carousel-career2022 h2{ left: 29%!important; } } @media (min-width: 576px) and (max-width: 991px){ #carousel-career2022 .videoplayer{ left:4%!important; } } /* Page Single Job */ #single-job-header { padding: 50px 20px; text-align: left; margin-bottom: 30px; background-color: #E9EDF5; color: #424B5A; } @media (min-width: 1200px) { #single-job-header { padding: 50px 0px; margin-bottom: 50px; } } #single-job-header .entry-title { font-size: 2.75em; } #single-job-header .inner-header { margin: auto; } @media (min-width: 1200px) { #single-job-header .inner-header { width: 1140px; } } #single-job-header #apply-job-cta { display: inline-block; color: #FFFFFF; border: 1px solid #3a4251; background: #3a4251; padding: 8px 20px; border-radius: 4px; } @media (min-width: 768px) { #single-job-header #apply-job-cta { padding: 10px 22px; } } #single-job-header #apply-job-cta:hover { background: #424B5A; color: #FFFFFF; } #single-job-wrapper { margin-bottom: 50px; } @media (min-width: 1200px) { #single-job-wrapper { width: 1140px; display: flex; margin: 0px auto 50px auto; } } #single-job-wrapper #job-main { order: 2; margin: auto; } @media (min-width: 1200px) { #single-job-wrapper #job-main { order: 1; margin-right: 30px; } } #single-job-wrapper #job-main #job-content { margin: 0px 20px 20px 20px; } @media (min-width: 1200px) { #single-job-wrapper #job-main #job-content { margin: 0px; } } @media (max-width: 575.98px) { #single-job-wrapper #job-main #job-content ul { padding-left: 20px; } } #single-job-wrapper #job-main #job-content h3, #single-job-wrapper #job-main #job-content h4, #single-job-wrapper #job-main #job-content strong { color: #3a4251; } #single-job-wrapper #job-main #job-form-wrapper { background: #424B5A; padding: 10px; } @media (min-width: 1200px) { #single-job-wrapper #job-main #job-form-wrapper { background: #424B5A; padding: 50px; } } #single-job-wrapper #job-main #job-form-wrapper #job-form { padding: 0px 20px 10px 20px; margin: auto; background: #FFFFFF; } @media (min-width: 1200px) { #single-job-wrapper #job-main #job-form-wrapper #job-form { background: #FFFFFF; } } #single-job-wrapper #job-main #job-form-wrapper #job-form h2 { text-align: center; padding: 20px 20px 10px 20px; margin-top: 0px; color: #3a4251; font-weight: bold; } #single-job-wrapper #job-main #job-form-wrapper #job-form a { color: #6582BB; } #single-job-wrapper #job-main #job-form-wrapper #job-form a:hover { color: #424B5A; } #single-job-wrapper #job-main #job-form-wrapper #job-form #first-name-label, #single-job-wrapper #job-main #job-form-wrapper #job-form #last-name-label, #single-job-wrapper #job-main #job-form-wrapper #job-form #email-label, #single-job-wrapper #job-main #job-form-wrapper #job-form #phone-label, #single-job-wrapper #job-main #job-form-wrapper #job-form #office-label, #single-job-wrapper #job-main #job-form-wrapper #job-form #department-label { display: none; } #single-job-wrapper #job-main #job-form-wrapper #job-form #first-name, #single-job-wrapper #job-main #job-form-wrapper #job-form #last-name, #single-job-wrapper #job-main #job-form-wrapper #job-form #candidate-email, #single-job-wrapper #job-main #job-form-wrapper #job-form #candidate-phone, #single-job-wrapper #job-main #job-form-wrapper #job-form #office, #single-job-wrapper #job-main #job-form-wrapper #job-form #department, #single-job-wrapper #job-main #job-form-wrapper #job-form #message, #single-job-wrapper #job-main #job-form-wrapper #job-form #register { border-radius: 0px; } /* #single-job-wrapper #job-main #job-form-wrapper #job-form #register { width: 100%; color: #FFFFFF; background: #3a4251; border: 1px solid #333A48; } */ #single-job-wrapper #job-side { order: 1; margin: 0px 20px; } @media (min-width: 1200px) { #single-job-wrapper #job-side { order: 2; min-width: 385px; max-width: 385px; } } #single-job-wrapper #job-side strong { color: #3a4251; } #single-job-wrapper #job-side #job-infos { border: 1px solid #DCDCDC; border-radius: 4px; padding: 20px; margin-bottom: 20px; background: #FBFBFC; } #single-job-wrapper #job-side #job-infos h4 { margin-top: 0px; padding-bottom: 10px; color: #3a4251; border-bottom: 1px solid #DCDCDC; } @media (min-width: 1200px) { #single-job-wrapper #job-side #job-infos { margin-bottom: 30px; } } #single-job-wrapper #job-side #job-infos #job-location a { color: #6582BB; } #single-job-wrapper #job-side #job-infos #job-language { margin-bottom: 1rem; } #single-job-wrapper #job-side #job-benefits { border: 1px solid #DCDCDC; border-radius: 4px; padding: 20px; margin-bottom: 20px; background: #FBFBFC; } #single-job-wrapper #job-side #job-benefits h4 { margin-top: 0px; padding-bottom: 10px; color: #3a4251; border-bottom: 1px solid #DCDCDC; } @media (min-width: 768px) { #single-job-wrapper #job-side #job-benefits { margin-bottom: 30px; } } #single-job-wrapper #job-side #job-benefits ul { padding-left: 20px; } #single-job-wrapper #job-side #job-map, #single-job-wrapper #job-side .mapouter, #single-job-wrapper #job-side .gmaps_canvas, #single-job-wrapper #job-side iframe { display: none; height: 250px; background: #DCDCDC; border-radius: 4px; } @media (min-width: 1200px) { #single-job-wrapper #job-side #job-map, #single-job-wrapper #job-side .mapouter, #single-job-wrapper #job-side .gmaps_canvas, #single-job-wrapper #job-side iframe { display: block; } } /********************************************************/ /************* Page Spontaneous application *************/ #application-header { padding: 50px 0px; text-align: center; color: #FFFFFF; background-color: #E9EDF5; color: #424B5A; margin-bottom: 30px; } @media (min-width: 768px) { #application-header .entry-title { font-size: 2.75em; } } @media (min-width: 768px) { #application-header { margin-bottom: 50px; } } #application-header .inner-header { margin: auto; } @media (min-width: 768px) { #application-header .inner-header { width: 1140px; } } #application-wrapper { margin: auto; margin-bottom: 50px; } @media (min-width: 768px) { #application-wrapper { width: 600px; } } #application-wrapper #introduction-text p { text-align: center; } #application-wrapper #job-form-wrapper { background: #3a4251; padding: 10px; } @media (min-width: 768px) { #application-wrapper #job-form-wrapper { padding: 30px; } } /************** RESOURCES **************/ #resources-header { padding: 50px 0px; text-align: center; color: #FFFFFF; display: flex; justify-content: center; align-items: center; padding: 0; min-height: 194px; background: #424B5A; } @media (min-width: 768px) { #resources-header .entry-title { font-size: 2.75em; } } #resources-header h1 { margin: 0; } #sym-featured { color: #FFFFFF; background: #424B5A; } @media (min-width: 992px) { #sym-featured { display: flex; justify-content: center; padding: 50px; } } #sym-featured #featured-text { padding: 5% 5% 0px 5%; } #sym-featured #featured-text a { color: #FFFFFF; } #sym-featured #featured-text a:hover { color: #C0C0C0; } @media (min-width: 992px) { #sym-featured #featured-text { display: flex; flex-direction: column; margin-right: 30px; width: 25%; padding: 0px; } } #sym-featured #featured-img { padding: 0px 5% 5% 5%; } @media (min-width: 992px) { #sym-featured #featured-img { width: 25%; padding: 0px; } } #resources-menu { margin: 0px 15% 0px 15%; } @media (min-width: 992px) { #resources-menu { margin: 0px; } } #resources-menu #mobile-resources-btn, #resources-menu #mobile-resources-btn:hover { display: block; width: 90%; margin: 20px auto 20px auto; color: #FFFFFF; border: 1px solid #3a4251; background: #3a4251; } @media (min-width: 992px) { #resources-menu #mobile-resources-btn, #resources-menu #mobile-resources-btn:hover { display: none; } } #resources-menu div { display: none; } @media (min-width: 992px) { #resources-menu div { display: block; } } #resources-menu div .menu { padding: 0px 7%; } @media (min-width: 992px) { #resources-menu div .menu { display: flex; justify-content: space-between; margin: auto; max-width: 1140px; padding: 30px 0px; } } #resources-menu div .menu li { padding: 10px 0px; list-style: none; } @media (min-width: 992px) { #resources-menu div .menu li { padding: 0px; } } #resources-menu div .menu li a { color: #424B5A; } @media (min-width: 992px) { #resources-menu div .menu li a { padding: 12px 25px; } } @media (min-width: 992px) { #resources-menu div .menu li a.active { background: #3a4251; color: #FFFFFF; border-radius: 4px; border: none; font-weight: 400; } } @media (min-width: 992px) { #resources-menu div .menu li a.hovered { text-decoration: none !important; } #resources-menu div .menu li a.hovered:not(.active) { background: #424B5A; color: #FFFFFF; border-radius: 4px; border: none; font-weight: 400; } } #menu-resources-tags { display: none; } @media (min-width: 992px) { #menu-resources-tags { display: flex; justify-content: center; margin: auto; max-width: 1140px; padding: 20px 0px; } } #menu-resources-tags li { list-style: none; margin: 0px 30px; } #menu-resources-tags li a { color: crimson; } @media (min-width: 992px) { #menu-resources-tags li a { padding: 5px; } } .page-content { min-height: 70vh; } .page-content #resources-wrapper { margin: 30px auto; } @media (min-width: 992px) { .page-content #resources-wrapper { max-width: 1140px; } } @media (min-width: 768px) { .page-content #resources-wrapper .resources-block { width: 570px; display: flex; flex-wrap: wrap; justify-content: space-between; margin: 0px auto 0px auto; } } @media (min-width: 992px) { .page-content #resources-wrapper .resources-block { width: 1140px; justify-content: start; } } .page-content #resources-wrapper .resources-block .resource { max-width: 270px; padding-bottom: 39px; margin: 0px auto 39px auto; border-bottom: 1px solid #DCDCDC; } .page-content #resources-wrapper .resources-block .resource:last-child { padding-bottom: 0px; margin-bottom: 0px; border-bottom: none; } @media (min-width: 992px) { .page-content #resources-wrapper .resources-block .resource:nth-child(4n+2) { margin-left: 20px; margin-right: 10px; } .page-content #resources-wrapper .resources-block .resource:nth-child(4n+3) { margin-left: 10px; margin-right: 20px; } } @media (min-width: 768px) { .page-content #resources-wrapper .resources-block .resource { border: none; padding: 0px; margin: 0px; margin-bottom: 30px; } } .page-content #resources-wrapper .resources-block .resource .resource-grid-img-link { display: block; position: relative; overflow: hidden; } .page-content #resources-wrapper .resources-block .resource .resource-grid-img-link img { display: block; } .page-content #resources-wrapper .resources-block .resource .resource-grid-img-link .custom-grid-placeholder { width: 270px; height: 180px; background: #DCDCDC; } .page-content #resources-wrapper .resources-block .resource .resource-grid-img-link .resource-icon { z-index: 1; color: white; font-size: 50px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align: center; font-family: "Font Awesome 5 Free"; font-weight: 400; } .page-content #resources-wrapper .resources-block .resource .resource-grid-img-link.resource-overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; opacity: 0.5; transition: .3s ease; background-color: #424b5a; } .page-content #resources-wrapper .resources-block .resource .resource-grid-img-link:hover .resource-overlay { opacity: 0.3; } .page-content #resources-wrapper .resources-block .resource .resource-grid-img-link:hover .resource-icon { opacity: 0.5; } .page-content #resources-wrapper .resources-block .resource h3.resource-grid-title { width: 270px; margin: 0px auto 8px auto; line-height: 0.7; } .page-content #resources-wrapper .resources-block .resource h3.resource-grid-title a { color: #424B5A; font-size: 20px; } .page-content #resources-wrapper .resources-block .resource .resource-grid-challenge { color: #424B5A; width: 270px; font-size: 14px; } @media (max-width: 575.98px) { .page-content #resources-wrapper .resources-block .resource .resource-grid-challenge { margin: 0px auto; } } .page-content #resources-wrapper .resources-block .resource .resource-grid-challenge a { color: #424B5A; } .page-content #resources-wrapper #load-more { text-align: center; margin-top: 50px; font-size: 18px; color: #424B5A; } .resource-card { background: #F2F2F2; } .resource, .resource-card { padding: 20px 25px 30px 25px; } .resource .resource-grid-img-link, .resource .resource-img-link, .resource-card .resource-grid-img-link, .resource-card .resource-img-link { display: block; position: relative; overflow: hidden; } .resource .resource-grid-img-link img, .resource .resource-img-link img, .resource-card .resource-grid-img-link img, .resource-card .resource-img-link img { display: block; margin: 0px auto; } .resource .resource-grid-img-link .custom-placeholder, .resource .resource-img-link .custom-placeholder, .resource-card .resource-grid-img-link .custom-placeholder, .resource-card .resource-img-link .custom-placeholder { /*width: 309.98px; height: 207.22px;*/ width: 303.33px; height: 202.56px; margin: 0px auto; background: #6582BB; } @media (max-width: 575.98px) { .resource .resource-grid-img-link .custom-placeholder, .resource .resource-img-link .custom-placeholder, .resource-card .resource-grid-img-link .custom-placeholder, .resource-card .resource-img-link .custom-placeholder { height: 153.75px; } } .resource .resource-grid-img-link .resource-icon, .resource .resource-img-link .resource-icon, .resource-card .resource-grid-img-link .resource-icon, .resource-card .resource-img-link .resource-icon { z-index: 2; color: white; font-size: 50px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align: center; } .resource .resource-grid-img-link .resource-overlay, .resource .resource-img-link .resource-overlay, .resource-card .resource-grid-img-link .resource-overlay, .resource-card .resource-img-link .resource-overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; opacity: 0.5; transition: .3s ease; background-color: #424b5a; } .resource .resource-grid-img-link:hover .resource-overlay, .resource .resource-img-link:hover .resource-overlay, .resource-card .resource-grid-img-link:hover .resource-overlay, .resource-card .resource-img-link:hover .resource-overlay { opacity: 0; } .resource .resource-text-wrapper, .resource-card .resource-text-wrapper { padding: 0px 25px; text-align: center; } .resource .resource-text-wrapper .resource-title, .resource-card .resource-text-wrapper .resource-title { line-height: 1; } .resource .resource-text-wrapper .resource-title .resource-title-link, .resource-card .resource-text-wrapper .resource-title .resource-title-link { color: #3a4251; font-size: 0.75em; } .resource .resource-text-wrapper .resource-title .resource-title-link:hover, .resource-card .resource-text-wrapper .resource-title .resource-title-link:hover { color: #424B5A; } .resource .resource-text-wrapper .resource-excerpt, .resource-card .resource-text-wrapper .resource-excerpt { color: #808080; } .resource .resource-text-wrapper .resource-cta, .resource-card .resource-text-wrapper .resource-cta { color: #6582BB; font-weight: 600; } .resource .resource-text-wrapper .resource-cta:hover, .resource-card .resource-text-wrapper .resource-cta:hover { color: #424B5A; } /************** WEBSIGN DEMO FORM **************/ #websign-demo-header { height: 45px; background: #424B5A; margin-bottom: 16px; } #websign-demo-header #websign-demo-header-inner-wrapper { height: 100%; margin: auto; padding: 0px 20px; } @media (min-width: 992px) { #websign-demo-header #websign-demo-header-inner-wrapper { width: 400px; } } #websign-demo-header #websign-demo-header-inner-wrapper #helper { display: inline-block; height: 100%; vertical-align: middle; } #websign-demo-header #websign-demo-header-inner-wrapper img { width: 98px; height: 21px; vertical-align: middle; } #websign-demo-container { font-family: Open Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif; } #websign-demo-container #websign-demo-wrapper { padding: 0px 20px; } @media (min-width: 992px) { #websign-demo-container #websign-demo-wrapper { width: 400px; margin: auto; } } #websign-demo-container #websign-demo-wrapper #websign-demo-text h1 { font-size: 18px; color: #050505; } #websign-demo-container #websign-demo-wrapper #websign-demo-text h1 #compleo-highlight { display: block; color: #da5635; font-size: 24px; font-weight: 700; } #websign-demo-container #websign-demo-wrapper #websign-demo-text p { font-size: 0.75em; color: #7f7f7f; line-height: 1em; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p { position: relative; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p::before { font-family: "Font Awesome 5 Free"; position: absolute; left: 12px; top: 3px; font-size: 1.5em; color: #424B5A; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:first-of-type::before { content: '\f007'; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:nth-of-type(2)::before { content: '\f007'; font-weight: 900; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:nth-of-type(3)::before { content: '\f0e0'; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:nth-of-type(4)::before { content: '\f3cd'; font-weight: 900; left: 15px; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:nth-of-type(4) .wpcf7-not-valid-tip { display: initial; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:nth-of-type(5)::before { content: '\f1ad'; font-weight: 900; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:not(:last-of-type) input { border: 1px solid #c2d1d9; padding-left: 42px; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p input::-webkit-input-placeholder { color: #c2d1d9; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p input:-ms-input-placeholder { color: #c2d1d9; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p input::placeholder { color: #c2d1d9; } #websign-demo-container #websign-demo-wrapper #websign-demo-form#acceptance #checkboxtxt { font-size: 9px; color: #3f424e; } #websign-demo-container #websign-demo-wrapper #websign-demo-form #send { display: block; width: 100%; color: #ffffff; background: #424B5A; border-radius: 0; border: 1px solid #424B5A; } @media (max-width: 575.98px) { .hidden-mobile #intercom-container { display: none !important; } } #websign-demo-thanks-wrapper { line-height: 1.3; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container { padding: 40px 0px; width: 70%; margin: auto; text-align: center; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #approved-icon { font-size: 2.375em; /*2.25em;*/ color: #00955d; margin-bottom: 10px; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #thank-you { font-size: 2.25em; font-weight: bold; color: #050505; margin-bottom: 20px; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #lead-name { font-size: 1.5em; font-weight: 300; margin-bottom: 20px; color: #424B5A; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #your-request { color: #404040; font-weight: 500; font-size: 1.125em; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #envelope-icon { color: #424B5A; font-size: 1.75em; /*1.625em;*/ } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #email-sent { color: #404040; font-weight: 500; font-size: 1.125em; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #email-sent span { font-weight: bold; color: #424B5A; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #team-thanks { color: #404040; font-weight: 500; font-size: 1.125em; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #websign-demo-thanks-separator { width: 80px; margin: 20px auto; height: 1px; background: #404040; opacity: 0.25; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #symtrax-website-link { margin-bottom: 10px; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #websign-demo-thanks-socials { display: flex; justify-content: space-between; width: 112px; margin: auto; font-size: 1.3em; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #websign-demo-thanks-socials div i { color: #404040 !important; } /************** CONTACT **************/ #contact-header { padding: 30px 10px; background-color: #424B5A; } @media (min-width: 992px) { #contact-header { position: relative; background-color: transparent; } #contact-header::after { content: ""; background: url("https://www.symtrax.com/wp-content/uploads/2022/09/map-contact-office.png"); background-color: #424B5A; background-repeat: no-repeat; background-position: bottom 50% left 25%; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: -1; } } @media (min-width: 768px) { #contact-header { padding: 50px 10px; } } #contact-header #contact-inner-header { max-width: 1140px; margin: auto; } @media (min-width: 992px) { #contact-header #contact-inner-header { display: flex; justify-content: flex-end; } } #contact-header #contact-inner-header #contact-header-image { display: none; } @media (min-width: 992px) { #contact-header #contact-inner-header #contact-header-image { display: flex; flex-direction: column; justify-content: center; margin-right: 50px; } } #contact-container { max-width: 1140px; margin: auto; } #contact-container #contact-inner-container #contact-locations-menu { padding: 30px 0px; } @media (min-width: 768px) { #contact-container #contact-inner-container #contact-locations-menu { margin: 0; padding: 50px 1rem; } } #contact-container #contact-inner-container #contact-locations-menu #mobile-locations-btn, #contact-container #contact-inner-container #contact-locations-menu #mobile-locations-btn:hover { display: block; /*width: 90%;*/ margin-left: 16px; padding: 12px 25px; color: #FFFFFF; border: 1px solid #424B5A; background: #424B5A; font-size: 1em; } @media (min-width: 768px) { #contact-container #contact-inner-container #contact-locations-menu #mobile-locations-btn, #contact-container #contact-inner-container #contact-locations-menu #mobile-locations-btn:hover { display: none; } } #contact-container #contact-inner-container #contact-locations-menu div { display: none; } @media (min-width: 768px) { #contact-container #contact-inner-container #contact-locations-menu div { display: block; } } #contact-container #contact-inner-container #contact-locations-menu div .menu { margin-left: 16px; padding: 8px 0px 0px 8px; } @media (min-width: 768px) { #contact-container #contact-inner-container #contact-locations-menu div .menu { display: flex; justify-content: space-between; margin: auto; max-width: 1140px; padding: 30px 0px; } } #contact-container #contact-inner-container #contact-locations-menu div .menu li { padding: 10px 0px; list-style: none; } @media (min-width: 768px) { #contact-container #contact-inner-container #contact-locations-menu div .menu li { padding: 0px; } } #contact-container #contact-inner-container #contact-locations-menu div .menu li a { color: #424B5A; font-weight: bold; border-radius: 4px; border: none; /*-webkit-transition: background-color 0.2s ease-in; -moz-transition: background-color 0.2s ease-in; -o-transition: background-color 0.2s ease-in; transition: background-color 0.2s ease-in;*/ } @media (min-width: 768px) { #contact-container #contact-inner-container #contact-locations-menu div .menu li a { padding: 12px 25px; } #contact-container #contact-inner-container #contact-locations-menu div .menu li a.active { background: #3a4251; color: #FFFFFF; } #contact-container #contact-inner-container #contact-locations-menu div .menu li a:not(.active) { background: #F4F6FA; } #contact-container #contact-inner-container #contact-locations-menu div .menu li a.hovered:not(.active) { background: #424B5A; color: #FFFFFF; } } #contact-container #contact-inner-container #locations-wrapper { min-height: 80vh; } #contact-container #contact-inner-container #locations-wrapper a { color: #6582BB !important; } @media (min-width: 768px) { #contact-container #contact-inner-container #locations-wrapper .location-section .row { margin-bottom: 36px; } } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location { margin-bottom: 30px; } @media (min-width: 576px) { #contact-container #contact-inner-container #locations-wrapper .location-section .row .location { margin-bottom: 50px; } } @media (min-width: 1200px) { #contact-container #contact-inner-container #locations-wrapper .location-section .row .location { margin: 0; } } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper { margin: auto; padding-bottom: 10px; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-mobile-headings { display: none; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-mobile-headings h2 { margin: 0; margin-bottom: 4px; font-size: 24px; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-mobile-headings h3 { margin: 0; margin-bottom: 8px; font-size: 20px; font-weight: 600; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-map-container { /*position: relative; margin: 0px 0px 10px 0px; @include for-size(sm) { margin: 0px 8px 0px 0px; }*/ padding: 0px 8px; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container { padding: 0px 8px; color: #424B5A; min-width: 33%; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container i { margin-right: 4px; padding: 2px 0px 0px 0px; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-headings { margin-bottom: 1em; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-headings h2 { margin: 0px 0px 4px 0px; font-size: 1.5em; font-weight: 700; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-headings h3 { font-size: 1.25em; font-weight: 600; margin: 0; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-infos { font-size: 0.9em; margin-bottom: 16px; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-infos h4 { font-size: 1.25em; margin: 0px 0px 8px 0px; text-decoration: underline; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-infos p { margin: 0; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-infos > div { display: flex; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-infos > div:not(:last-child) { margin-bottom: 4px; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-support-infos { font-size: 0.9em; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-support-infos h4 { font-size: 1.25em; margin: 0px 0px 8px 0px; text-decoration: underline; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-support-infos > div { display: flex; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-inner-wrapper .location-text-container .location-support-infos > div:not(:last-child) { margin-bottom: 4px; } #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-separator { background: #424B5A; height: 6px; } @media (min-width: 768px) { #contact-container #contact-inner-container #locations-wrapper .location-section .row .location .location-separator { max-width: 100%; } } /************** GET DEMO **************/ #get-demo-container { padding: 30px 10px; background: #424B5A; } @media (min-width: 992px) { #get-demo-container { position: relative; min-height: 600px; background: none; } #get-demo-container.demo-form-simple::after { content: ""; background: url("https://www.symtrax.com/wp-content/uploads/2019/10/marc-1.jpg"); background-color: #424B5A; background-repeat: no-repeat; background-size: cover; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: -1; } #get-demo-container.demo-form-detailed::after { content: ""; background: url("https://www.symtrax.com/wp-content/uploads/2020/03/background-maxime-1024x576.png"); background-color: #424B5A; background-repeat: no-repeat; background-size: cover; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: -1; -moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; } } #get-demo-container #get-demo-inner-container { max-width: 1140px; margin: auto; } @media (min-width: 768px) { #get-demo-container #get-demo-inner-container { display: flex; justify-content: center; align-items: center; min-height: 692px; } } #get-demo-container #get-demo-inner-container #contact-header-image { display: none; } @media (min-width: 768px) { #get-demo-container #get-demo-inner-container #contact-header-image { display: flex; flex-direction: column; justify-content: center; margin-right: 50px; } } #get-demo-container #get-demo-inner-container #get-demo-text-wrapper { color: #ffffff; z-index: 10; } @media (min-width: 768px) { #get-demo-container #get-demo-inner-container #get-demo-text-wrapper { display: flex; flex-direction: column; justify-content: center; /*width: 50%;*/ } } @media (min-width: 992px) { #get-demo-container #get-demo-inner-container #get-demo-text-wrapper { margin-right: 15px; } } #get-demo-container #get-demo-inner-container #get-demo-text-wrapper h1 { font-size: 1.75em; } @media (min-width: 576px) { #get-demo-container #get-demo-inner-container #get-demo-text-wrapper h1 { font-size: 2.5em; margin: 0 0 20px 0; } } @media (min-width: 992px) { #get-demo-container #get-demo-inner-container #get-demo-text-wrapper h1 { font-size: 3em; } } #get-demo-container #get-demo-inner-container #get-demo-text-wrapper p { font-size: 1.125em; } @media (min-width: 576px) { #get-demo-container #get-demo-inner-container #get-demo-text-wrapper p { font-size: 1.75em; font-weight: 300; margin: 0 0 15px 0; } } @media (min-width: 992px) { #get-demo-container #get-demo-inner-container #get-demo-text-wrapper p { font-size: 2.5em; } } #get-demo-container #get-demo-inner-container #get-demo-form { display: inline-block; } @media (min-width: 992px) { #get-demo-container #get-demo-inner-container #get-demo-form { margin-left: 15px; } } #get-demo-container #get-demo-inner-container #get-demo-form #enter-system { display: none; } #get-demo-container #get-demo-inner-container #get-demo-form h1 { display: none; } /************** RESELLERS **************/ #resellers-header { padding: 50px 0px; text-align: center; color: #FFFFFF; display: flex; justify-content: center; align-items: center; padding: 0; min-height: 194px; background: #424B5A; } @media (min-width: 768px) { #resellers-header .entry-title { font-size: 2.75em; } } @media (min-width: 768px) { #resellers-header { padding: 50px 10px; } } #resellers-header h1 { display: block; } #resellers-container #resellers-inner-container #resellers-menu { padding: 30px 0px; } @media (min-width: 768px) { #resellers-container #resellers-inner-container #resellers-menu { margin: 0; padding: 50px 1rem; } } #resellers-container #resellers-inner-container #resellers-menu #mobile-resellers-btn, #resellers-container #resellers-inner-container #resellers-menu #mobile-resellers-btn:hover { display: block; margin-left: 16px; padding: 12px 25px; color: #FFFFFF; border: 1px solid #3a4251; background: #3a4251; font-size: 1em; } @media (min-width: 768px) { #resellers-container #resellers-inner-container #resellers-menu #mobile-resellers-btn, #resellers-container #resellers-inner-container #resellers-menu #mobile-resellers-btn:hover { display: none; } } #resellers-container #resellers-inner-container #resellers-menu div { display: none; } @media (min-width: 768px) { #resellers-container #resellers-inner-container #resellers-menu div { display: block; } } #resellers-container #resellers-inner-container #resellers-menu div .menu { margin-left: 16px; padding: 8px 0px 0px 8px; } @media (min-width: 768px) { #resellers-container #resellers-inner-container #resellers-menu div .menu { display: flex; justify-content: space-between; margin: auto; max-width: 1140px; padding: 30px 0px; } } #resellers-container #resellers-inner-container #resellers-menu div .menu li { padding: 10px 0px; list-style: none; } @media (min-width: 768px) { #resellers-container #resellers-inner-container #resellers-menu div .menu li { padding: 0px; } } #resellers-container #resellers-inner-container #resellers-menu div .menu li a { color: #424B5A; font-weight: bold; } @media (min-width: 768px) { #resellers-container #resellers-inner-container #resellers-menu div .menu li a { padding: 12px 25px; border-radius: 4px; border: none; -webkit-transition: background-color 0.2s ease-in; -moz-transition: background-color 0.2s ease-in; -o-transition: background-color 0.2s ease-in; transition: background-color 0.2s ease-in; } #resellers-container #resellers-inner-container #resellers-menu div .menu li a.active { background: #3a4251; color: #FFFFFF; } #resellers-container #resellers-inner-container #resellers-menu div .menu li a:not(.active) { background: #F4F6FA; } #resellers-container #resellers-inner-container #resellers-menu div .menu li a.hovered:not(.active) { background: #424B5A; color: #FFFFFF; } } #resellers-container #resellers-inner-container #resellers-wrapper { min-height: 70vh; } #resellers-container #resellers-inner-container #resellers-wrapper a { color: #6582BB !important; } #resellers-container #resellers-inner-container #resellers-wrapper #resellers-inner-wrapper { max-width: 1140px; margin: auto !important; } #resellers-container #resellers-inner-container #resellers-wrapper #resellers-inner-wrapper .reseller { margin-bottom: 30px; color: #424B5A; } #resellers-container #resellers-inner-container #resellers-wrapper #resellers-inner-wrapper .reseller .reseller-inner { height: 100%; padding: 16px; border: 1px solid #424B5A; border-radius: 4px; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.13); transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); } #resellers-container #resellers-inner-container #resellers-wrapper #resellers-inner-wrapper .reseller .reseller-inner:hover { box-shadow: 0 14px 28px rgba(0, 0, 0, 0.17), 0 10px 10px rgba(0, 0, 0, 0.15); } #resellers-container #resellers-inner-container #resellers-wrapper #resellers-inner-wrapper .reseller .reseller-inner .reseller-country { font-weight: 300; margin: 0; } #resellers-container #resellers-inner-container #resellers-wrapper #resellers-inner-wrapper .reseller .reseller-inner .reseller-name { font-size: 1.5em; margin: 0 0 16px 0; } #resellers-container #resellers-inner-container #resellers-wrapper #resellers-inner-wrapper .reseller .reseller-inner .separator { width: 20%; height: 1px; margin: 1em 0; background: #424B5A; } #resellers-container #resellers-inner-container #resellers-wrapper #resellers-inner-wrapper .reseller .reseller-inner .reseller-info { font-weight: 400; } #resellers-container #resellers-inner-container #resellers-wrapper #resellers-inner-wrapper .reseller .reseller-inner .reseller-info:not(last-child) { margin: 0px 0px 5px 0px; } #resellers-container #resellers-inner-container #resellers-wrapper #resellers-inner-wrapper .reseller .reseller-inner .reseller-info i { margin-right: 4px; } /************** THANK YOU **************/ #websign-demo-header { height: 45px; background: #424B5A; margin-bottom: 16px; } #websign-demo-header #websign-demo-header-inner-wrapper { height: 100%; margin: auto; padding: 0px 20px; } @media (min-width: 992px) { #websign-demo-header #websign-demo-header-inner-wrapper { width: 400px; } } #websign-demo-header #websign-demo-header-inner-wrapper #helper { display: inline-block; height: 100%; vertical-align: middle; } #websign-demo-header #websign-demo-header-inner-wrapper img { width: 98px; height: 21px; vertical-align: middle; } #websign-demo-container { font-family: Open Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif; } #websign-demo-container #websign-demo-wrapper { padding: 0px 20px; } @media (min-width: 992px) { #websign-demo-container #websign-demo-wrapper { width: 400px; margin: auto; } } #websign-demo-container #websign-demo-wrapper #websign-demo-text h1 { font-size: 18px; color: #050505; } #websign-demo-container #websign-demo-wrapper #websign-demo-text h1 #compleo-highlight { display: block; color: #da5635; font-size: 24px; font-weight: 700; } #websign-demo-container #websign-demo-wrapper #websign-demo-text p { font-size: 0.75em; color: #7f7f7f; line-height: 1em; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p { position: relative; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p::before { font-family: "Font Awesome 5 Free"; position: absolute; left: 12px; top: 3px; font-size: 1.5em; color: #424B5A; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:first-of-type::before { content: '\f007'; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:nth-of-type(2)::before { content: '\f007'; font-weight: 900; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:nth-of-type(3)::before { content: '\f0e0'; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:nth-of-type(4)::before { content: '\f3cd'; font-weight: 900; left: 15px; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:nth-of-type(4) .wpcf7-not-valid-tip { display: initial; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:nth-of-type(5)::before { content: '\f1ad'; font-weight: 900; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p:not(:last-of-type) input { border: 1px solid #c2d1d9; padding-left: 42px; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p input::-webkit-input-placeholder { color: #c2d1d9; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p input:-ms-input-placeholder { color: #c2d1d9; } #websign-demo-container #websign-demo-wrapper #websign-demo-form p input::placeholder { color: #c2d1d9; } #websign-demo-container #websign-demo-wrapper #websign-demo-form#acceptance #checkboxtxt { font-size: 9px; color: #3f424e; } #websign-demo-container #websign-demo-wrapper #websign-demo-form #send { display: block; width: 100%; color: #ffffff; background: #424B5A; border-radius: 0; border: 1px solid #424B5A; } @media (max-width: 575.98px) { .hidden-mobile #intercom-container { display: none !important; } } #websign-demo-thanks-wrapper { line-height: 1.3; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container { padding: 40px 0px; width: 70%; margin: auto; text-align: center; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #approved-icon { font-size: 2.375em; /*2.25em;*/ color: #00955d; margin-bottom: 10px; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #thank-you { font-size: 2.25em; font-weight: bold; color: #050505; margin-bottom: 20px; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #lead-name { font-size: 1.5em; font-weight: 300; margin-bottom: 20px; color: #424B5A; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #your-request { color: #404040; font-weight: 500; font-size: 1.125em; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #envelope-icon { color: #424B5A; font-size: 1.75em; /*1.625em;*/ } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #email-sent { color: #404040; font-weight: 500; font-size: 1.125em; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #email-sent span { font-weight: bold; color: #424B5A; } @media (min-width: 992px) { #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #thank-you-form { width: 50%; } } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #thank-you-form textarea, #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #thank-you-form input { border-radius: 0; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #thank-you-form #project-description { margin-bottom: 8px; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #team-thanks { color: #404040; font-weight: 500; font-size: 1.125em; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #websign-demo-thanks-separator { width: 80px; margin: 20px auto; height: 1px; background: #404040; opacity: 0.25; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #symtrax-website-link { margin-bottom: 10px; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #websign-demo-thanks-socials { display: flex; justify-content: space-between; width: 112px; margin: auto; font-size: 1.3em; } #websign-demo-thanks-wrapper #websign-demo-thanks-inner-container #websign-demo-thanks-socials div i { color: #404040 !important; } /************** LANDING PAGE **************/ @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .ie-d-non { display: none !important; } ie-d-blck { display: block !important; } } /*@media screen and (-webkit-min-device-pixel-ratio:0) { .ie-d-one { display: none !important; } ie-d-bloc { display: block !important; } }*/ /* Classes for Gutemberg */ /* Center text inside all columns*/ .col-text-center .wp-block-column { text-align: center !important; } .center .wp-block-group__inner-container { display: flex !important; justify-content: center !important; } .group-flex .wp-block-group__inner-container { display: flex; justify-content: space-between; } @media (min-width: 992px) { .group-lg-flex .wp-block-group__inner-container { display: flex; justify-content: space-between; } } /* Font-size */ .text-11 { font-size: 11px !important; } .text-13 { font-size: 13px !important; } .text-16 { font-size: 16px !important; } .text-18 { font-size: 18px !important; } .text-20 { font-size: 20px !important; } .text-24 { font-size: 24px !important; } .text-28 { font-size: 28px !important; } .text-32 { font-size: 32px !important; } .text-36 { font-size: 36px !important; } .text-42 { font-size: 42px !important; } .text-48 { font-size: 48px !important; } .btn-text-24 a { font-size: 24px !important; } /* Widths .w-25 { width: 25% !important; } .w-50 { width: 50% !important; } .w-75 { width: 75% !important; }*/ /* Paddings .py-3 { padding-top: 16px !important; padding-bottom: 16px !important; } .py-4 { padding-top: 24px !important; padding-bottom: 24px !important; } .py-5 { padding-top: 48px !important; padding-bottom: 48px !important; } .px-5 { padding-left: 48px !important; padding-right: 48px !important; } .pl-32 { padding-left: 32px !important; }*/ /* Margins .m-0 { margin: 0 !important; } .my-0 { margin-top: 0 !important; margin-bottom: 0 !important; } .mx-0 { margin-left: 0 !important; margin-right: 0 !important; } .mt-0 { margin-top: 0 !important; } .mb-0 { margin-bottom: 0 !important; } .mx-auto { margin-left: auto; margin-right: auto; } .mb-8 { margin-bottom: 8px !important; } .mb-16 { margin-bottom: 16px !important; } .mb-24 { margin-bottom: 24px !important; } .mb-48 { margin-bottom: 48px !important; }*/ /* Borders .border-xl-left { border-left: 5px solid $sym-dark-blue; }*/ /* Colors */ .color-blue { color: #424B5A !important; } .bg-compleo { background: #cc513f !important; color: #fff; } .bg-light { background: #f2f2f2; } .text-light { color: #f2f2f2 !important; } #landing-page-container #landing-page-inner-container, #landing-page-container .wp-block-group__inner-container, #landing-page-container .wp-block-cover__inner-container { width: 100%; padding: 0px 20px; } @media (min-width: 1200px) { #landing-page-container #landing-page-inner-container, #landing-page-container .wp-block-group__inner-container, #landing-page-container .wp-block-cover__inner-container { width: 1140px; margin: 0px auto; padding: 0px; } } #landing-page-container #landing-page-inner-container .wp-block-cover p, #landing-page-container .wp-block-group__inner-container .wp-block-cover p, #landing-page-container .wp-block-cover__inner-container .wp-block-cover p { margin-top: 0 !important; } #landing-page-container #landing-page-inner-container .wp-block-cover h2, #landing-page-container .wp-block-group__inner-container .wp-block-cover h2, #landing-page-container .wp-block-cover__inner-container .wp-block-cover h2 { margin-top: 0 !important; margin-bottom: 16px !important; } #landing-page-container #landing-page-inner-container .wp-block-cover #checkboxtxt, #landing-page-container .wp-block-group__inner-container .wp-block-cover #checkboxtxt, #landing-page-container .wp-block-cover__inner-container .wp-block-cover #checkboxtxt { color: #e8e8e8; } #landing-page-container #landing-page-inner-container .wp-block-group, #landing-page-container #landing-page-inner-container .wp-block-cover, #landing-page-container .wp-block-group__inner-container .wp-block-group, #landing-page-container .wp-block-group__inner-container .wp-block-cover, #landing-page-container .wp-block-cover__inner-container .wp-block-group, #landing-page-container .wp-block-cover__inner-container .wp-block-cover { width: 100vw; margin-left: calc(-50vw + 50%); } #landing-page-container h2 { font-weight: bold; } #landing-page-container hr { background-color: #f2f2f2; height: 4px; margin: initial; border: none; } #landing-page-container .wp-block-columns { margin-bottom: 0; } #landing-page-container .lp-form .wp-block-group__inner-container { max-width: 500px; margin: 0px auto; } #landing-page-container .wpcf7 { max-width: 400px; display: flex; flex-direction: column; justify-content: center; word-wrap: normal; } #landing-page-container .wpcf7 #acceptance .wpcf7-not-valid-tip { display: none; } #landing-page-container .wpcf7 p:last-of-type { margin-bottom: 0; } #landing-page-container .wpcf7 input.email, #landing-page-container .wpcf7 .register { border: none; padding: 10px 15px; } #landing-page-container .wpcf7 .register { margin: 0; } #landing-page-container .wp-block-embed-youtube { margin-right: 0; margin-left: 0; } /************** UNSUBSCRIBE **************/ #unsubscribe-confirm-wrapper { padding: 100px 10px; } #unsubscribe-confirm-wrapper h1 { text-align: center; } /************** SAAS **************/ /************** Template: Saas Page 2021 **************/ #custom-saas-header h1::before{ content: url("https://blob.symtrax.com/doc/logo/services/SasS.svg"); margin-right: 30px; } #custom-saas-header h1{ font-size: 2.75em; } #custom-saas-header h2{ font-size: 2em; } #saas-section1 h2, #saas-section2 h2, #saas-section3 h2, #saas-section4 h2, #saas-section5 h2{ font-size: 1.75em; } #saas-section1 h3, #saas-section3 h3, #saas-section4 .card strong, #saas-section5 h3{ font-size: 1.25em; } #saas-section2 li, #saas-section4 li, #saas-section3 p, #saas-section5 p{ font-size: 1em; } #saas-section4 .card p, #section1 .card p{ font-size: 15px; } #saas-section1 i{ font-size: 35px; } #saas-section4 i{ font-size: 33px; } #saas-section1, #saas-section3, #saas-section5{ background-color: var(--bg-symtrax); } #saas-section4 .card, #saas-section1 p, #saas-section2 li, #saas-section3 p, #saas-section4 li{ color: var(--secondary-symtrax); } #saas-section2 li::before, #saas-section4 li::before{ font-family: 'Font Awesome 5 Pro'; content: "\f138"; display: inline-block; margin-left: -32px; width: 1.6em; } #saas-section2 ul, #saas-section4 ul{ list-style-type: none; } #saas-section1 .dot, #saas-section4 .dot{ height: 68px; width: 68px; background-color: #fff; border-radius: 50%; display: inline-block; box-shadow: 0px 0px 40px #00000042; } #saas-section1 .cardSection .dot, #saas-section4 .cardSection .dot{ background-color: var(--bg-symtrax); box-shadow: none; } #saas-section1 .card{ min-height:294px; } #saas-section1:lang(fr) .card, #saas-section1:lang(es) .card{ min-height:318px; } #saas-section4 .card{ min-height:350px; } #saas-section4 .card:lang(fr), #saas-section4 .card:lang(es){ min-height:354px; } #saas-section5 .solutionCard{ min-height: 283px; box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%) !important; } #saas-section5 .solutionCard:lang(de), #saas-section5 .solutionCard:lang(es){ min-height: 320px; } @media (max-width: 370px) { #saas-section1 .dot, #saas-section4 .dot{ height: 53px!important; width: 53px!important; } #saas-section1 i, #saas-section4 i{ font-size: 25px; } } @media (max-width: 1200px) { #saas-section1 .card, #saas-section4 .card{ min-height:0!important; } } /************** Saas default template **************/ #saas-header { padding: 50px 0px; text-align: center; color: #FFFFFF; display: flex; justify-content: center; align-items: center; padding: 0; min-height: 194px; background: #424B5A; } @media (min-width: 768px) { #saas-header .entry-title { font-size: 2.75em; } } #saas-container .content-container { max-width: 1140px; padding: 0px 20px; } @media (min-width: 1200px) { #saas-container .content-container { padding: 0px; } } #saas-container .content-container a { text-decoration: initial; color: #6582BB; } #saas-container .content-container a:hover { color: #424B5A; } #saas-container .content-container hr { background-color: #f2f2f2; height: 4px; margin: initial; border: none; } #saas-container .content-container figure { margin: 0; } /************** SAP **************/ /************** Template: Sap Page 2021 **************/ #custom-sap-header h1, #sap-section2 h2{ font-size: 2.75em; } #custom-sap-header h2, #sap-section3 h2, #sap-section4 h2{ font-size: 2em; } #sap-section2 h3, #spa-section2 h4, #sap-section3 h4, #sap-section3 h3, #sap-section4 h4{ font-size: 1.5em; } #sap-section1 li, #sap-section2 p, #sap-section3 p, #sap-section4 p{ font-size: 1em; } #sap-section1, #sap-section3, #sap-section5 { background-color: var(--bg-symtrax); } #sap-section1 li::before { font-family: 'Font Awesome 5 Pro'; content: "\f138"; display: inline-block; margin-left: -32px; width: 1.6em; } #sap-section1 li{ list-style-type: none; } #sap-section2 .card{ background-color: #F2F2F3; border: none; min-height: 369px; } #sap-section2 .card:lang(de){ min-height: 374px; } #sap-section3{ padding-bottom: 160px!important; } #sap-section3 .dot{ height: 68px; width: 68px; background-color: #F2F2F3; border-radius: 50%; display: inline-block; } #sap-section3 i { font-size: 35px; } #sap-section3 .fa-project-diagram { font-size: 29px!important; } #sap-section3 .card{ min-height:330px; } #sap-section3 .card:lang(de){ min-height: 354px; } @media(max-width: 974px){ #sap-section3 .card{ min-height: 0!important; } } .sapImg{ margin-top: -148px; } #sap-header { padding: 50px 0px; text-align: center; color: #FFFFFF; display: flex; justify-content: center; align-items: center; padding: 0; min-height: 194px; background: #424B5A; } @media (min-width: 768px) { #sap-header .entry-title { font-size: 2.75em; } } #sap-container { max-width: 1140px; padding: 0px 20px; } @media (min-width: 1200px) { #sap-container { padding: 0px; } } #sap-container a { text-decoration: initial; } #sap-container hr { background-color: #f2f2f2; height: 4px; margin: initial; border: none; } #sap-container figure { margin: 0; } #sap-container .sap-section-text div { width: 100%; /* Elementor undebug fix */ } @media (min-width: 992px) { #sap-container .sap-section-text { width: 50%; } } /************** IBM **************/ #ibm-header { padding: 50px 0px; text-align: center; color: #FFFFFF; display: flex; justify-content: center; align-items: center; padding: 0; min-height: 194px; background: #424B5A; } @media (min-width: 768px) { #ibm-header .entry-title { font-size: 2.75em; } } #ibm-container { max-width: 1140px; padding: 0px 20px; } @media (min-width: 1200px) { #ibm-container { padding: 0px; } } #ibm-container a { text-decoration: initial; color: #6582BB; } #ibm-container a:hover { color: #424B5A; } #ibm-container hr { background-color: #f2f2f2; height: 4px; margin: initial; border: none; } #ibm-container figure { margin: 0; } #ibm-container .ibm-section-text div { width: 100%; /* Elementor undebug fix */ } @media (min-width: 992px) { #ibm-container .ibm-section-text { width: 50%; } } /************** SUBSCRIPTION SERVICE **************/ #subscription-header { padding: 50px 0px; text-align: center; color: #FFFFFF; display: flex; justify-content: center; align-items: center; padding: 0; min-height: 194px; background: #424B5A; } @media (min-width: 768px) { #subscription-header .entry-title { font-size: 2.75em; } } #subscription-container { max-width: 1140px; padding: 0px 20px; } @media (min-width: 1200px) { #subscription-container { padding: 0px; } } #subscription-container a { text-decoration: initial; } #subscription-container hr { background-color: #f2f2f2; height: 4px; margin: initial; border: none; } #subscription-container figure { margin: 0; } #subscription-container .subscription-section-text div { width: 100%; /* Elementor undebug fix */ } @media (min-width: 992px) { #subscription-container .subscription-section-text { width: 50%; } } #consulting-header { padding: 50px 0px; text-align: center; color: #FFFFFF; display: flex; justify-content: center; align-items: center; padding: 0; min-height: 194px; background: #424B5A; } @media (min-width: 768px) { #consulting-header .entry-title { font-size: 2.75em; } } #consulting-container hr { background-color: #f2f2f2; height: 4px; margin: initial; border: none; } #support-header { padding: 50px 0px; text-align: center; color: #FFFFFF; display: flex; justify-content: center; align-items: center; padding: 0; min-height: 194px; background: #424B5A; } @media (min-width: 768px) { #support-header .entry-title { font-size: 2.75em; } } #support-container hr { background-color: #f2f2f2; height: 4px; margin: initial; border: none; } /* * Customer support page */ .customer-support h1, .consulting-service h1 { font-size: 3.75rem; color: #101828; font-weight:600; } .customer-support h3, .consulting-service h3 { font-size: 2.25rem; } .customer-support h5, .consulting-service h5 { font-size: 1.25rem; color: #101828; } .customer-support p, .consulting-service p { font-size: 1.25rem; } .customer-support h1, .customer-support h3, .customer-support h5 { font-weight: 600; } .customer-support .bg-soft, .consulting-service .bg-soft, .consulting-service .bg-soft-right, .customer-support .bg-soft-right { background-color: #F2F4F7; } .customer-support .bg-soft-right:after, .consulting-service .bg-soft-right:after { background-color: #F2F4F7; right: -999em; content: ''; display: block; position: absolute; width: 999em; top: 0; bottom: 0; } .customer-support .bg-softer, .consulting-service .bg-softer { background-color: #F9FAFB } .customer-support .header-container{ padding: 128px 135px 116px 32px; } .customer-support header img { position: absolute; left: -80px; top: 50%; transform: translateY(-50%); } .customer-support .header-container .service-support, .consulting-service .header-container .service-support { background-color: #C7E4F7; color: #00406C; border-radius: 16px; display: flex; padding: 4px 10px 4px 4px; align-items: center; gap: 12px; width: fit-content; font-weight: 500; } .customer-support .header-container .service-support-service, .consulting-service .header-container .service-support-service { display: flex; padding: 2px 10px; align-items: center; background-color: white; border-radius: 12px; font-weight: 500; } .customer-support > header > .col-6.bg-soft { min-height: 720px; } .customer-support .section1 { padding: 96px 0; } .customer-support .section1 i { border: 13px #DDF1FF solid; border-radius: 50%; color: #005690; background-color: #C7E4F7; font-size: 40px; width: 100px; height: 100px; text-align: center; line-height: 75px; vertical-align: middle; } .customer-support .section1 h5 { color: #101828; font-size: 20px; font-weight: 600; } .customer-support .section1 p { font-size: 20px; color: #475467; } .customer-support .section2 .support-card { margin: 35px 0px; background-color: #002B48; display: flex; border-radius: 24px; box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03); } .customer-support .section2 .support-card-content { padding: 45px 42px; color: white; } .customer-support .section2 .support-card-content p { font-size: 20px; margin: 20px 0; color: #B1D6F0; } .customer-support .section2 .support-card-content p.white { color: white; } .customer-support .section2 .support-card-content span { font-size: 23px; font-weight: 600; margin-bottom: 20px; } .customer-support .section2 > div > div > div:nth-child(2){ background-image: url(https://www.symtrax.com/wp-content/uploads/2024/06/our-support.png); border-radius: 0 18px 18px 0; background-size: cover; background-position: right; min-height: 490px; } .customer-support .section2 .support-card .col-5, .customer-support .section2 .support-card .col-7{ padding: 0; } .customer-support .section3 { text-align: center; } .customer-support .section3 span { color: #00406C; padding: 4px 12px; border-radius: 16px; background: #EAF2F7; font-family: 'Inter', sans-serif; font-size: 14px; font-weight: 600; } .customer-support .section3 p { max-width: 768px; margin: 32px auto 32px; } .customer-support .section3 img { max-width: 100%; min-width: 0px; border: 4px solid black; border-radius: 10px; box-shadow: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03); } .customer-support .section4 .formation-wrapper { padding: 0 32px 0 68px; display: flex; flex-direction: column; justify-content: center; } .customer-support .section4 div:nth-child(1) img { max-width: 100%; width: 100%; object-fit: cover; height: 100%; } .customer-support .section4 i { border: 8px #DDF1FF solid; border-radius: 50%; color: #005690; background-color: #C7E4F7; font-size: 16px; width: 58px; height: 58px; text-align: center; line-height: 42px; vertical-align: middle; } .customer-support .section5, .consulting-service .section5 { margin: 70px auto; } @media (max-width: 991.98px) { .customer-support .section3 p { padding: 1rem 2rem; } } /* * Consulting service page */ .consulting-service .header-container { min-height: 787px; padding: 128px 83px 246px 32px; } .consulting-service header img { margin-left: -90px; } .consulting-service .section1 h2 { font-weight: 600; color: #101828; } .consulting-service .consulting-card { margin: 0 18px; padding: 22px 0px; border-radius: 10px; border: #E3E5E8; background: white; max-width: 358px; box-shadow: 0px 263px 74px 0px rgba(0, 0, 0, 0.00), 0px 168px 67px 0px rgba(0, 0, 0, 0.00), 0px 95px 57px 0px rgba(0, 0, 0, 0.02), 0px 42px 42px 0px rgba(0, 0, 0, 0.03), 0px 11px 23px 0px rgba(0, 0, 0, 0.03), 0px 0px 0px 0px rgba(0, 0, 0, 0.03); } .consulting-service .section1 .consulting-card i { border: 6px #DDF1FF solid; border-radius: 50%; color: #005690; background-color: #C7E4F7; font-size: 40px; width: 90px; height: 90px; text-align: center; line-height: 77px; vertical-align: middle; } .consulting-service .consulting-card h5 { font-weight: 700; color: #002B48; } .consulting-service .consulting-card ul { padding-left: 31px; margin: 0px 31px; list-style-type: none; } .consulting-service .consulting-card ul li { text-align: start; color: #353C48; } .consulting-service .consulting-card ul li::before { content: "\f058"; font-family: 'Font Awesome 5 Pro'; width: 1.6em; color: #2CA58D; font-size: 1.3rem; display: flex; transform: translate(-31px, 27px); } .consulting-service .section1 p { font-size: 16px; color: #101828; text-align: start; padding: 0 125px; } .consulting-service .section2 > span { color: #002B48; font-family: 'Inter', sans-serif; font-size: 16px; font-weight: 600; } .consulting-service .section2 h2 { color: #101828; font-family: 'Inter', sans-serif; font-size: 36px; font-weight: 600; } .consulting-service .section2 p { color: #475467; font-family: 'Inter', sans-serif; font-size: 20px; font-weight: 400; padding: 0px 302px; } .consulting-service .section2 .row { padding: 0px 135px; } .consulting-service .intervention-card { border-radius: var(--espacements-16, 16px); border: 1px solid var(--Gray-200, #EAECF0); background: #FFF; box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03); text-align: start; } .consulting-service .intervention-card .intervention-card-header { height: 170px; } .consulting-service .intervention-card h5 > span { color: #2CA58D; font-family: 'Inter', sans-serif; font-size: 36px; font-weight: 600; } .consulting-service .intervention-card h5 { color: #101828; font-family: 'Inter', sans-serif; font-size: 24px; font-weight: 600; padding: 32px; } .consulting-service .intervention-card ul { list-style-type: none; padding: 32px 32px 32px 72px; } .consulting-service .intervention-card ul li::before { content: "\f00c"; font-family: 'Font Awesome 5 Pro'; width: 1.6em; color: #12B76A; font-size: 1rem; display: inline-block; position: absolute; left: 50px; margin-top: -1px; background-color: #D1FADF; text-align: center; border-radius: 50%; } .consulting-service .intervention-card ul li { color: #475467; margin-bottom: 16px; } .review-card { background-color: #00406C; color: white; border-radius: 9px; padding: 28px 38px; margin: 0 32px; height: auto; } .review-card .rating { font-size: 18px; color: #FEC84B; margin-top: 42px; } .review-card .rating i { margin-right: 5px; } .review-card .comment { font-size: 14px; margin: 24px 0 32px 0; } .review-card .author-comment { font-size: 18px; font-weight: 600; } .review-card .author-job { font-size: 16px; color: #E9D7FE; } @media (max-width: 576px) { .consulting-service .section1 p { padding: 0 40px; } } @media (max-width: 991.98px) { .consulting-service .section2 p { padding: 0 50px; } } /*# sourceMappingURL=symtrax.css.map */ /* IMAGES AS RADIIO BUTTON */ input.hideradio{ /* HIDE RADIO */ visibility: hidden; /* Makes input not-clickable */ position: absolute; /* Remove input from document flow */ } .imgradio label > input + img{ /* IMAGE STYLES */ cursor:pointer; border:2px solid transparent; } .imgradio label > input:checked + img{ /* (RADIO CHECKED) IMAGE STYLES */ border:2px solid #f00; } .imgradio { display: inline; } .imgradio img:hover { filter: invert(1); } /* EN IMAGES AS RADIO BUTTON */ /* Survey support */ #wpcf7-f42968-o1 , #wpcf7-f42978-o1 , #wpcf7-f41981-o1 , #wpcf7-f43246-o1 { max-width: 100% !important; } .survey { /* margin-top: 7em; */ margin-bottom: 7em; padding: 2em; margin-left: auto; margin-right: auto; width: 750px !important; max-width: 770px !important; background-color: bisque; /* width: 779px; */ height: 413px; border-radius: 21px; background: #fff; box-shadow: 0px 0px 32px rgba(0, 0, 0, 0.16); text-align: center; line-height: 3em; } .question { color: #006BB4; padding-bottom: 2em; font-size: 2.2em; } .step { color: #c5c5c5; bottom: -26px; position: relative; padding: 0.5em; margin-left: auto; margin-right: auto; max-width: 100px; border-radius: 5px; background: #f2f2f2; margin-top: 2em; } .survey input[type="checkbox"] { display: none; } .survey span.wpcf7-list-item-label { cursor: pointer; color: #006bb4; font-size: 1pc; padding: 0.5em; border-radius: 4px; background: rgba(0, 107, 180, 0.14); border: 1px solid #006bb4; } .survey span.wpcf7-list-item-label:hover { filter: invert(1); } /* end survey */ /* Menu resoures */ #site-header #resources-desktop-menu div{ position: absolute; width: 100%; background: #424B5A; z-index: 1000; height: 194px; padding: 35px 0px; box-shadow: 0px 16px 32px -16px rgba(0, 0, 0, 0.75); transition: box-shadow 0.9s ease-in-out; } #site-header #resources-desktop-menu div:first-child ul li a { display: flex; flex-direction: column; justify-content: center; align-items: stretch; text-align: center; font-weight: bold; width: 100%; max-width: 100%; text-decoration: none; color:white; padding: 0px 70px; } /* #site-header #resources-desktop-menu div:first-child ul li{ display: flex; justify-content: center; } */ #site-header #resources-desktop-menu div:first-child ul{ list-style-type: none; display: flex; justify-content:space-evenly; max-width: 1140px; margin:auto; } #site-header #resources-desktop-menu div:first-child ul li:not(:last-child) { border-right: 1px dashed #E9EDF5; } /* IMG MENU RESOURCES */ #site-header #resources-desktop-menu div:first-child ul li:first-child a:before { padding-top: 20px; font-family: 'Font Awesome 5 Pro'; font-size: 2.3em; font-weight: 300; content: "\f1ea"; } #site-header #resources-desktop-menu div:first-child ul li:nth-child(2) a:before { padding-top: 20px; font-family: 'Font Awesome 5 Pro'; font-size: 2.3em; font-weight: 300; content: "\f144"; } #site-header #resources-desktop-menu div:first-child ul li:nth-child(3) a:before { padding-top: 20px; font-family: 'Font Awesome 5 Pro'; font-size: 2.3em; font-weight: 300; content: "\f63d"; } #site-header #resources-desktop-menu div:first-child ul li:nth-child(4) a:before { padding-top: 20px; font-family: 'Font Awesome 5 Pro'; font-size: 2.3em; font-weight: 300; content: "\f518"; } #site-header #resources-desktop-menu div:first-child ul li:nth-child(5) a:before { padding-top: 20px; font-family: 'Font Awesome 5 Pro'; font-size: 2.3em; font-weight: 300; content: "\f075"; } #resources-desktop-menu a { font-size: 1rem; } #resources-desktop-menu a:hover { opacity:0.6; } #whitepaper-content{ border-bottom: 1px solid #DCDCDC; } /* Custom Landing Page 2021 */ #section2 ,#section4, #section6, #section8 { background-color: #F2F7FB; } div[id^='section'] h2 { font-size: 40px; font-family: 'Open Sans Semibold', arial; color: #424B5A; } div[id^='section'] p { /* font-size: 20px; */ font-family: 'Open Sans', sans-serif; } /* Form Go to webinars Api 2021 */ #single-webinar-wrapper #webinar-registration-form{ padding: 0!important; border-bottom:none!important; } .webinar-registration-header{ display:none; } #gotowebinar_registration_submit{ border-radius: 50rem!important; border:none!important; padding: .5rem 1rem!important; font-size: 1.25rem!important; line-height: 1.5!important; background-color: var(--primary-symtrax)!important; color: #ffffff!important; } #gotowebinar_registration_submit:hover{ color: #fff!important; background-color: #00406C!important; border-color: #00406C!important; } .webinar-registration{ background-color: #ffffff!important; } .webinar-registration td{ border:none; padding: 10px 35px 10px 35px!important; background-color:#ffffff!important; /* width: 332%; */ display: block; } @media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) { .webinar-registration td{ width: 332%; } } .webinar-registration tbody>tr:last-child>td:last-child{ text-align: center; padding-bottom: 25px!important; } #formGoToWebinar{ background-color:#f2f2f2; } .gotowebinar-field{ border-radius: 5px!important; border-color: gray!important; } .webinar-registration tbody>tr:first-child>td:first-child{ padding-top: 25px!important; } #gotowebinar_registration_submit:focus{ outline: none!important; } /* cookie banner */ #cc-window{ z-index: 9999999999!important; } /********** DESKOP **********/ /********** MENU **********/ @media (min-width: 1200px){ #mobileMenu{ display:none; } } @media(max-width: 1200px){ #deskopMenu{ display:none; } #header-top-wrapper { border-bottom:none; } } .navbar-light .nav-item .nav-link{ text-transform: none!important; font-size: 1rem!important; } .dropCss .nav-link{ font-weight:500!important; } .navbar{ padding: 0!important; } @media(min-width:768px){ .no-x-pad-xs{ padding:0 15px; } .dropdown-menu{ -webkit-transition: -webkit-transform 0.3s; transition: -webkit-transform 0.3s; transition: transform 0.3s; transition: transform 0.3s, -webkit-transform 0.3s; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); display:block!important; visibility: hidden; z-index:-1; margin: 0; opacity: 0; top: 800px!important; } .dropdown-menu.show{ visibility: visible; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); top: 49px!important; transition: all 0.3s; opacity: 1; } } .nav-item{ padding: 15px 15px 0 15px; } .navbar-light .nav-item .nav-link{ font-weight: 600; text-transform: uppercase; font-size: 12px; color: #aaa; padding: 0 5px 10px 5px; border-bottom:3px solid transparent; -webkit-transition: all .2s; -o-transition: all .2s; transition: all .2s; } .dropdown-menu{ border: 1px solid transparent; } .liveDemo{ background: #006bb4; } .liveDemo a { color: #fff !important; font-weight: 500 !important; } .liveDemo:hover{ background: #424b5a; transition: .3s; } .liveDemo a:hover{ border-bottom: none!important; } .signIn a{ font-weight: 700; color: #006bb4!important; } .signIn a:hover{ border-bottom: 3px solid #006bb4!important; } .dropdown-menu{ width: 700px; } #servicesDropdown, #aboutDropdown{ width: 260px; } @media(max-width:696px){ .dropdown-menu{ width: 429px; } } .solutionsBlock{ left:-266%!important; padding-bottom: 0!important; } .solutionsBlock:lang(fr){ left:-241%!important; } .solutionsBlock:lang(de){ left:-241%!important; } @media(max-width:1199px){ .solutionsBlock{ left:-160%!important; } .solutionsBlock::after{ right:62%!important; } .solutionsBlock:lang(de)::after{ right:61%!important; } .solutionsBlock:lang(es)::after{ right:60%!important; } .solutionsBlock::before{ right:431px!important; } .solutionsBlock:lang(de)::before{ right:424px!important; } .solutionsBlock:lang(es)::before{ right:417px!important; } .servicesBlock:lang(en)::before{ right:140px!important; } .resourcesBlock:lang(en)::before{ right:321px!important; } .resourcesBlock:lang(fr)::before{ right:414px!important; } } .servicesBlock{ left:-45%!important; } .aboutBlock{ left:-45%!important; } .resourcesBlock{ left:-39%!important; padding-bottom: 0!important; width: 550px!important; } .resourcesBlock:lang(fr){ left:-43%!important; } .resourcesBlock:lang(de){ left:-59%!important; } .resourcesBlock:lang(es){ left:-23%!important; } .solutionsBlock::after{ position: absolute; content: ""; width: 0; height: 0; border: 8px solid transparent; border-bottom-color: #fff; top: -1rem; right: 43%; } .solutionsBlock::before{ position: absolute; content: ""; width: 0; height: 0; border: 10px solid transparent; border-bottom-color: rgba(0,0,0,.15); top: -20px; right: 299px; } .solutionsBlock:lang(de)::before{ right:315px; } .solutionsBlock:lang(es)::before{ right:270px; } .solutionsBlock:lang(fr)::before{ right:330px; } .solutionsBlock:lang(fr)::after{ right:332px; } .solutionsBlock:lang(de)::after{ right:317px; } .solutionsBlock:lang(es)::after{ right:39%; } .servicesBlock::after{ position: absolute; content: ""; width: 0; height: 0; border: 8px solid transparent; border-bottom-color: #fff; top: -1rem; right: 55%; } .servicesBlock::before{ position: absolute; content: ""; width: 0; height: 0; border: 10px solid transparent; border-bottom-color: rgba(0,0,0,.15); top: -20px; right: 139px; } .servicesBlock:lang(fr)::before, .servicesBlock:lang(de)::before, .servicesBlock:lang(es)::before{ right:140px; } .resourcesBlock::after{ position: absolute; content: ""; width: 0; height: 0; border: 8px solid transparent; border-bottom-color: #fff; top: -1rem; right: 426px; } .resourcesBlock::before{ position: absolute; content: ""; width: 0; height: 0; border: 10px solid transparent; border-bottom-color: rgba(0,0,0,.15); top: -20px; right: 424px; } .resourcesBlock:lang(fr)::before{ right:415px; } .resourcesBlock:lang(fr)::after{ right:76%; } .resourcesBlock:lang(de)::after{ right:71%; } .resourcesBlock:lang(de)::before{ right:387px; } .resourcesBlock:lang(es)::after{ right:456px; } .resourcesBlock:lang(es)::before{ right:454px; } .aboutBlock::after{ position: absolute; content: ""; width: 0; height: 0; border: 8px solid transparent; border-bottom-color: #fff; top: -1rem; right: 159px; } .aboutBlock::before{ position: absolute; content: ""; width: 0; height: 0; border: 10px solid transparent; border-bottom-color: rgba(0,0,0,.15); top: -20px; right: 157px; } .aboutBlock:lang(fr)::before{ right:139px; } .aboutBlock:lang(fr)::after{ right:141px; } .aboutBlock:lang(de)::before{ right:139px; } .aboutBlock:lang(de)::after{ right:141px; } .menudropdown ul{ list-style-type:none; padding-left: 15px!important; padding-right: 0!important; } .menudropdown li::before{ font-family: 'Font Awesome 5 Pro'; content: '\f0a9'; color:#006bb4; display: inline-block; margin-left: -1.3em; /* same as padding-left set on li */ width: 1.6em; /* same as padding-left set on li */ } #servicesLi li:first-child:before { content: url("https://blob.symtrax.com/doc/logo/services/Consulting-services.svg"); position: absolute; left: 15px; top: 23px; } #servicesLi li:nth-child(2):before { content: url("https://blob.symtrax.com/doc/logo/services/SasS.svg"); position: absolute; left: 15px; top: 95px; } #servicesLi li:nth-child(3):before { content: url("https://blob.symtrax.com/doc/logo/services/Customer-services.svg"); position: absolute; left: 15px; top: 166px; } #aboutLi li:first-child:before { content: url("https://blob.symtrax.com/doc/logo/about/Company.svg"); position: absolute; left: 15px; top: 23px; } #aboutLi li:nth-child(2):before { content: url("https://blob.symtrax.com/doc/logo/about/products.svg"); position: absolute; left: 15px; top: 95px; } #aboutLi li:nth-child(3):before { content: url("https://blob.symtrax.com/doc/logo/about/blog.svg"); position: absolute; left: 15px; top: 166px; } #aboutLi li:nth-child(4):before { content: url("https://blob.symtrax.com/doc/logo/about/careers.svg"); position: absolute; left: 15px; top: 238px; } #aboutLi li:nth-child(5):before { content: url("https://blob.symtrax.com/doc/logo/about/contact.svg"); position: absolute; left: 15px; top: 310px; } .servicesBlock a, .aboutBlock a{ padding-left: 15px; } .menudropdown a, #challengeLi a, .servicesBlock a, .resourcesBlock a, .solutionsBlock a, .aboutBlock a{ color: #6c757d; } .menudropdown a:hover, .menudropdown a:focus{ color: #006bb4; text-decoration: none; } #challengeLi li:hover, #challengeLi h6:hover, #resourcesLi li:hover, #servicesLi li:hover, #aboutLi li:hover{ background-color: #F0F4F9; color: #006bb4; } #challengeLi a:hover, #challengeLi a:focus, #resourcesLi li:hover>a, #challengeLi li:hover>a, .menudropdown li:hover a, .latestSolution a:hover, .ourFutureWebinar a:hover{ color: #006bb4; text-decoration: none; } .menudropdown li:last-child{ border-bottom: none!important; } #challengeLi ul, #resourcesLi ul{ padding-inline-start:0; } #challengeLi li, #resourcesLi li{ list-style-type: none; padding-left: 69px; } #challengeLi li, #resourcesLi li, .menudropdown li, #servicesLi li, #aboutLi li{ cursor:pointer; } .servicesBlock li, .resourcesBlock li, .aboutBlock li{ list-style-type: none; } #challengeLi li:first-child:before{ content: url("/wp-content/themes/Symtrax/library/images/logos/menu/Entreprise-e-invoicing.png"); position: absolute; left:21px; top: 15px; } #challengeLi li:nth-child(2):before{ content: url("/wp-content/themes/Symtrax/library/images/logos/menu/Signature-solutions.png"); position: absolute; left:21px; top:93px; } #challengeLi li:nth-child(3):before{ content: url("/wp-content/themes/Symtrax/library/images/logos/menu/EDi-ready.png"); position: absolute; left:21px; top:172px; } #challengeLi li:nth-child(4):before{ content: url("/wp-content/themes/Symtrax/library/images/logos/menu/Digital-data-and-document-transformation.png"); position: absolute; left:21px; top:253px; } #challengeLi li:nth-child(5):before{ content: url("https://blob.symtrax.com/doc/logo/solutions/small-icons/creation-and-distribution.png"); position: absolute; left:10px; top:320px; } .consultant p{ margin: 0!important; font-size: 21px; } .consultant{ background-color: #F0F4F9; } .consultant a:hover{ text-decoration: none; color: #006bb4; } #resourcesLi li:first-child:before{ font-family: 'Font Awesome 5 Pro'; font-size: 1.7em; font-weight: 300; content: "\f1ea"; position: absolute; left:26px; top: 15px; } #resourcesLi li:nth-child(2):before{ font-family: 'Font Awesome 5 Pro'; font-size: 1.7em; font-weight: 300; content: "\f144"; position: absolute; left:26px; top: 87px; } #resourcesLi li:nth-child(3):before{ font-family: 'Font Awesome 5 Pro'; font-size: 1.7em; font-weight: 300; content: "\f63d"; position: absolute; left:26px; top: 158px; } #resourcesLi li:nth-child(4):before{ font-family: 'Font Awesome 5 Pro'; font-size: 1.7em; font-weight: 300; content: "\f02d"; position: absolute; left:26px; top: 231px; } #resourcesLi li:nth-child(5):before{ font-family: 'Font Awesome 5 Pro'; font-size: 1.7em; font-weight: 300; content: "\f075"; position: absolute; left:26px; top: 303px; } #servicesLi li:hover a, #aboutLi li:hover a{ color: #006bb4; text-decoration: none; } .latestSolution figure{ background-color: #F2F7FB; } .borderSolution:hover, .borderServices:hover, .borderResources:hover, .borderAbout:hover{ color: #424b5a!important; border-bottom: 3px solid #424b5a!important; } #servicesLi ul, #aboutLi ul{ margin: 0; padding-left: 15px; padding-right: 15px; padding-top: 0; padding-bottom: 0; } #servicesLi li, #aboutLi li{ padding-left: 40px; } @keyframes FadeIn { 0% { opacity: 0; } 100% { opacity:1; } } .dropdown-menu.show #challengeLi li { animation: FadeIn 0.3s linear; animation-fill-mode: both; } .dropdown-menu.show #challengeLi li:nth-child(1) { animation-delay: .1s } .dropdown-menu.show #challengeLi li:nth-child(2) { animation-delay: .15s } .dropdown-menu.show #challengeLi li:nth-child(3) { animation-delay: .20s } .dropdown-menu.show #challengeLi li:nth-child(4) { animation-delay: .25s } .dropdown-menu.show #challengeLi li:nth-child(5) { animation-delay: .30s } /********** MOBILE **********/ /********** MENU **********/ .overlay { height: 100%; width: 0; position: fixed; z-index: 9999; top: 40px; left: 0; background: #FFF; overflow-x: hidden; transition: 0.5s; } @media screen and (max-width: 575px) { .overlay { top: 40px; } } .overlay-content { position: relative; width: 100%; } .overlay a { padding: 8px; text-decoration: none; font-size: 1.2em; color: #16181b; display: block; transition: 0.3s; font-weight: 500; } .resourcess { font-size: 1.5em !important; padding: 0px !important; } .overlay a:hover, .overlay a:focus { color: #006bb4; text-decoration: none; } @media screen and (max-height: 450px) { .overlay a { font-size: 20px; } .overlay .closebtn { font-size: 40px; top: 15px; right: 35px; } .resourcess { font-size: 1.5em !important; padding: 0px !important; } } .navbar button { height: 52px; } #closeNav { margin-right: 4px; } #myNav .card-header { background-color: rgba(0, 0, 0, 0) !important; } #mobileMenu .buttonMobileCta{ background-color: #006bb4; padding: 7px; } #mobileMenu .buttonMobileCta:hover{ background: #424b5a; transition: .3s; text-decoration: none; } #card-body-challenge1 ul, #card-body-challenge2 ul, #card-body-challenge3 ul, #card-body-challenge4 ul, #card-body-challenge5 ul, #card-body-solution ul, #card-body-services ul, #card-body-resources ul, #card-body-about ul{ list-style-type: none; padding-inline-start: 0; } #card-body-services a::before, #card-body-resources a::before, #card-body-challenge1 a::before, #card-body-challenge2 a::before, #card-body-challenge3 a::before, #card-body-challenge4 a::before, #card-body-challenge5 a::before, #card-body-about a::before{ font-family: 'Font Awesome 5 Pro'; content: '\f0a9'; color:#006bb4; display: inline-block; margin-left: -1.3em; /* same as padding-left set on li */ width: 1.6em; /* same as padding-left set on li */ } #card-body-challenge1 li:last-child, #card-body-challenge2 li:last-child, #card-body-challenge3 li:last-child, #card-body-challenge4 li:last-child, #card-body-challenge5 li:last-child, #card-body-solution li:last-child{ border-bottom: none!important; } #card-body-solution li, #card-body-solution{ padding-left: 0; padding-right: 0; } @media(max-width: 992px){ #lang_sel_click{ width: max-content; margin-left: 12px; } .wpml-ls-statics-shortcode_actions .wpml-ls-current-language a{ background-color: #eee; } } .mobileSolutionsLi{ font-size: 20px; } /*** accordion arrow ***/ .rotate-icon { float: right; } .rotate-icon { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .collapsed .rotate-icon { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: transform 0.25s ease; -o-transition: transform 0.25s ease; transition: transform 0.25s ease; } /* NEW carroussel */ @media(max-width: 992px){ #carrouDesktop{ display:none; } } @media(min-width: 993px){ #carrouMobile{ display:none; } } @media(max-width: 1199px) and (min-width: 992px){ .carousel-overlay{ height: 180px!important; } .custom-placeholder{ height: 180px!important; } .sizeTop{ height: 180px!important; } #carrouDesktop img{ max-height:180px!important; } } #carrouMobile img{ max-height:180px!important; } .sizeBody{ min-height: 350px!important; } .buttonResources{ background-color: var(--light-symtrax); border-color:var(--light-symtrax); color: var(--primary-symtrax); position: absolute; bottom: 11px; left: 12px; padding: 10px; text-transform : lowercase; } .buttonResources:hover{ background: var(--primary-symtrax); border-color:var(--primary-symtrax); transition: .3s; color: var(--universal-white); text-decoration: none; } .buttonResources::first-letter{ text-transform: uppercase; } .buttonResources:focus{ background-color: var(--light-symtrax); border-color:var(--light-symtrax); color: var(--primary-symtrax); outline: none; } .resource-icon{ z-index: 2; color: var(--universal-white); font-size: 50px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); text-align: center; } .testimonials-icon { z-index: 2; color: #006BB44D; font-size: 50px; position: absolute; top: 82%; left: 50%; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); text-align: center; } .resource-img-link{ position: relative; } .carousel-overlay{ position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 220px; width: 100%; opacity: .5; background-color: var(--secondary-symtrax); } .carousel-overlay-light { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 220px; width: 100%; opacity: .5; background-color: #92aad21f; } .custom-placeholder{ width: 337.33px; height: 220px; margin: 0 auto; border: none!important; } #carrouMobile .carousel-inner{ width:300px; } #carrouMobile .carousel-overlay{ height:179px!important; } #carrouMobile .sizeBody{ margin-top:-41px; } .sizeTop{ height: 220px; } @media(max-width: 375px){ .contain-mobile{ padding: 0!important; } #carrouMobile .arrowLeftCarou { left:-7%!important; } #carrouMobile .arrowRightCarou{ right:-7%!important; } } #carrouMobile .resource-icon{ top:41%!important; } #carrouDesktop, #carrouMobile{ position: relative; } .arrowLeftCarou{ position: absolute; top: 39%; left: -3%; } .arrowRightCarou{ position: absolute; top: 39%; right: -3%; } #carrouMobile .arrowLeftCarou { left:3%; } #carrouMobile .arrowRightCarou{ right:3%; } .arrowLeftCarou i{ font-size: 33px; color: var(--secondary-symtrax); } .arrowRightCarou i{ font-size: 33px; color: var(--secondary-symtrax); } .arrowLeftCarou:focus, .arrowRightCarou:focus{ box-shadow: none!important; } #carrMobil shadow, #carrouDeskop shadow{ box-shadow: 0 0rem 1rem rgb(0 0 0 / 9%) !important } #carrouDesktop h4 a, #carrouMobile h4 a{ color: var(--primary-symtrax); font-size: 20px; font-weight: 600; } #carrouDesktop h4 a:hover, #carrouMobile h4 a:hover{ color: var(--primary-symtrax); text-decoration: underline; transition: .3s; } #home-carousel h2{ font-size: 2.5em; color: var(--secondary-symtrax); } /********** 404 PAGE **********/ #page404 h1{ font-size: 7em; } #page404 p{ font-size: 2.2em; } @media(max-width: 575px){ #page404 h1{ font-size: 4em; } #page404 p{ font-size: 1.8em; } } @media(max-width: 992px){ .img404{ display:none; } } /* SINGLE TESTIMONIALS 2021 */ #custom-testimonial-section1, #custom-testimonial-section4, #custom-testimonial-section7{ background-color: var(--bg-symtrax); } #custom-testimonial-section1 h2{ font-size: 1.7em; } #custom-testimonial-section1 .fa-comment{ padding-top: 0.8rem!important; padding-left: 0.8rem!important; } #custom-testimonial-section1 .dot{ height: 50px; width: 50px; background-color:var(--universal-white); border-radius: 50%; display: inline-block; } #testimonial-number-custom .testimonial-number p:first-child{ color:var(--universal-black); font-size: 1.5em; } #testimonial-number-custom .testimonial-number p:nth-child(2){ color:var(--universal-black); font-size: 2.5em; font-weight: 800; } #testimonial-number-custom .testimonial-number p:nth-child(3){ color:var(--universal-black); font-size: 1em; } #testimonial-number-custom .testimonial-number p{ margin-bottom: -0.5rem; } #custom-testimonial-section1 #testimonial-number-custom .dot{ background-color: var(--primary-symtrax); height: 14px; width: 14px; } #custom-testimonial-section2, #custom-testimonial-section6{ background: linear-gradient(172deg, var(--bg-symtrax) 44%, var(--universal-white) 40%); } #custom-testimonial-section2 #video-testimonial{ position: relative; } #custom-testimonial-section2 #videoplayer{ position: absolute; right: 45%; top: 184px; } #custom-testimonial-section2 #videoplayer:hover{ filter: brightness(50%); transition: .3s; } @media(max-width: 992px){ #custom-testimonial-section2 #videoplayer{ right:42%; } } @media(max-width: 768px){ #custom-testimonial-section2 #videoplayer{ right:39%; top:133px; } } @media(max-width: 574px){ #custom-testimonial-section2 #videoplayer{ width: 20%; right:41%; top:42%; } } #custom-testimonial-section2 #video-testimonial img{ cursor: pointer; } .videoBandeNoire{ overflow: hidden; } #custom-testimonial-section2 .modal-content{ background-color: var(--universal-black)!important; } #custom-testimonial-section2 button{ position: absolute; right: 0px; top: 3px; } .videoBandeNoire img { margin: -6% 0; } #custom-testimonial-section3 #testimonial-quote-buble{ background-color: var(--bg-symtrax); border: 1px solid #E2E6EA; border-radius: 27px; opacity: 1; } #custom-testimonial-section3 #testimonial-quote-buble{ font-size: 1.5em; color: #00406C; } #custom-testimonial-section3 #testimonial-quote-buble:before { border-left: 20px solid var(--bg-symtrax) ; border-right: 14px solid transparent; border-top: 16px solid var(--bg-symtrax) ; border-bottom: 20px solid transparent; content: ""; width: 0px; height: 0px; position: absolute; bottom: -36px; left: 119px; } #custom-testimonial-section3 #testimonial-quote-buble:after { border-left: 22px solid #E2E6EA; border-right: 14px solid transparent; border-top: 18px solid #E2E6EA; border-bottom: 20px solid transparent; content: ""; width: 0px; height: 0px; position: absolute; bottom: -36px; left: 117px; z-index:-1 } #custom-testimonial-section3 #testimonial_info p, #custom-testimonial-section5 h3{ font-size: 1.5em; } #custom-testimonial-section4 h2{ font-size: 2em; color: #00406C; } #custom-testimonial-section4 ul li::before{ font-family: 'Font Awesome 5 Pro'; content: "\f138"; display: inline-block; margin-left: -32px; width: 1.6em; } #custom-testimonial-section4 ul{ list-style-type: none; } #custom-testimonial-section4 blockquote{ padding-left: 16px; margin-left: 0; margin-top: 24px; margin-bottom: 24px; border-left: 5px solid #424b5a } #custom-testimonial-section4 blockquote p:first-child{ font-size: 25px; font-style: italic; } #custom-testimonial-section6 h2, #custom-testimonial-section8 h2{ font-size: 2.5em; color: #00406C; } #custom-testimonial-section6 #about-testimonial{ background-color: var(--universal-white); border: 1px solid #E2E6EA; border-radius: 27px; font-size: 1em; } #custom-testimonial-section6 #about-testimonial p{ margin-bottom: 0!important; } #form-testimonial{ background-color: var(--universal-white); } #custom-testimonial-section2 .modal{ background-color: #00000082!important; } #custom-testimonial-section8 .solutionCard{ min-height: 180px!important; } #custom-testimonial-section8 .card-body{ background-color: #f2f2f3; } #custom-testimonial-section8 .imgCardSolutions img { width: 100%; height: 178px; object-fit: contain; } #custom-testimonial-section8 figure{ margin: 0!important; } #custom-testimonial-section8 .btn-solution { position: absolute; bottom: 15px; } #custom-testimonial-section8 .solutionCard{ box-shadow: none!important; } #custom-testimonial-section8 .h3solution{ font-size: 1em; } #custom-testimonial-section9 #testimonial-challenges{ padding: 1em 0; border-top: 1px solid #dcdcdc; border-bottom: 1px solid #dcdcdc; } /* contact form count */ span.wpcf7-character-count.up::after { content: " /1000"; } span.wpcf7-character-count.up{ font-size: 12px; display: block; margin-top: -5px; color: #6c757d; } /* Youtube-read */ #bg-read { background: linear-gradient(172deg, var(--bg-symtrax) 60%, var(--universal-white) 40%); } #custom-read h2 { font-size: 1.7em; } #custom-read .fa-users{ padding-top:0.6rem!important; } #custom-read .dot { height: 50px; width: 50px; background-color: var(--universal-white); border-radius: 50%; display: inline-block; } #custom-read #video-testimonial { position: relative; } #custom-read #videoplayer { position: absolute; right: 45%; top: 184px; } @media(max-width: 992px){ #custom-read #videoplayer{ right:42%; } } @media(max-width: 768px){ #custom-read #videoplayer{ right:39%; top:133px; } } @media(max-width: 574px){ #custom-read #videoplayer{ width: 20%; right:41%; top:42%; } } #custom-read #videoplayer:hover { filter: brightness(50%); transition: .3s; } #custom-read #video-testimonial img { cursor: pointer; } #custom-read .videoBandeNoire img { margin: -3% 0; } #custom-read .modal { background-color: #00000082 !important; } #custom-read button { position: absolute; right: 0; top: 3px; } /* PAGE EBOOKS 2022 - PAGE TESTIMONIALS 2022 - PAGE VIDEOS 2022 - PAGE WEBINARS 2022 - PAGE NEWS 2022 */ #whitepappers-section-1 h2, #testimonials-section-1 h2, #videos-section-1 h2, #webinars-section-1 h2, #news-section-1 h2 { font-size: 1.7em; } #whitepappers-section-1 h3, #testimonials-section-1 h3, #videos-section-1 h3, #webinars-section-1 h3, #news-section-1 h3 { font-size: 2.5rem; } #whitepappers-section-2 .filters-content h4, #testimonials-section-2 .filters-content h4, #videos-section-2 .filters-content h4, #webinars-section-2 .filters-content h4, #news-section-2 .filters-content h4 { font-size: 1.1em; } #whitepappers-section-1, #testimonials-section-1, #videos-section-1, #webinars-section-1, #news-section-1 { background: var(--bg-symtrax); } #whitepappers-section-2 .filters-content .tagsChallenges a, #testimonials-section-2 .filters-content .tagsChallenges a, #videos-section-2 .filters-content .tagsChallenges a, #webinars-section-2 .filters-content .tagsChallenges a, #news-section-2 .filters-content .tagsChallenges a { font-size: 0.8em; border: 1px solid #006bb4; border-radius: 5px; display:block; text-align: center; margin-bottom: 5px; } #whitepappers-section-1 .dot, #testimonials-section-1 .dot, #videos-section-1 .dot, #webinars-section-1 .dot, #news-section-1 .dot { height: 50px; width: 50px; background-color: var(--universal-white); border-radius: 50%; display: inline-block; } #whitepappers-section-1 .fa-book { padding-top: 0.9rem !important; padding-left: 0.9rem !important; } #testimonials-section-1 span .fa-comment, #videos-section-1 span .fa-play-circle, #news-section-1 span .fa-newspaper { padding-top: 0.8rem!important; padding-left: 0.8rem!important; } #webinars-section-1 span .fa-users-class{ padding-top: 0.8rem!important; } #whitepappers-section-1 p:first-child, #testimonials-section-1 p:first-child, #videos-section-1 p:first-child, #webinars-section-1 p:first-child, #news-section-1 p:first-child { cursor: default !important; background-color: #2CA58D !important; border-color: #2CA58D !important; } #whitepappers-section-1 p:first-child:hover, #testimonials-section-1 p:first-child:hover, #videos-section-1 p:first-child:hover, #webinars-section-1 p:first-child:hover, #news-section-1 p:first-child:hover { background-color: #2CA58D !important; border-color: #2CA58D !important; } #whitepappers-section-1 p:first-child::before, #testimonials-section-1 p:first-child::before, #videos-section-1 p:first-child::before, #webinars-section-1 p:first-child::before, #news-section-1 p:first-child::before { position: absolute; content: ""; border-top: 0.5em solid; border-right: 0.5em solid transparent; border-bottom: 0; border-left: 0.5em solid transparent; top: 38px; color: #2CA58D; } #whitepappers-section-2 li, #testimonials-section-2 li, #videos-section-2 li, #webinars-section-2 li, #news-section-2 li { list-style-type: none; border-left: 2px solid var(--primary-symtrax); position: relative; cursor: pointer; } #whitepappers-section-2 .filters ul, #testimonials-section-2 .filters ul, #videos-section-2 .filters ul, #webinars-section-2 .filters ul, #news-section-2 .filters ul { padding-inline-start: 15px; } #whitepappers-section-2 .filters-mobile ul, #testimonials-section-2 .filters-mobile ul, #videos-section-2 .filters-mobile ul, #webinars-section-2 .filters-mobile ul, #news-section-2 .filters-mobile ul { padding-inline-start: 0px; } #whitepappers-section-2 .filters ul li:after, #testimonials-section-2 .filters ul li:after, #videos-section-2 .filters ul li:after, #webinars-section-2 .filters ul li:after, #news-section-2 .filters ul li:after { content: ''; display: block; width: calc(0% - 60px); position: absolute; height: 2px; background: var(--primary-symtrax); transition: width 350ms ease-out; } #whitepappers-section-2 .filters ul li:hover:after, #testimonials-section-2 .filters ul li:hover:after, #videos-section-2 .filters ul li:hover:after, #webinars-section-2 .filters ul li:hover:after, #news-section-2 .filters ul li:hover:after { width: calc(100% - 60px); transition: width 350ms ease-out; } #whitepappers-section-2 .filters ul li.active:after, #testimonials-section-2 .filters ul li.active:after, #videos-section-2 .filters ul li.active:after, #webinars-section-2 .filters ul li.active:after, #news-section-2 .filters ul li.active:after { width: calc(100% - 60px); } #whitepappers-section-2 .filters ul li.active, #whitepappers-section-2 .filters ul li:hover, #whitepappers-section-2 .filters-mobile ul li.active, #whitepappers-section-2 .filters-mobile ul li:hover, #testimonials-section-2 .filters ul li.active, #testimonials-section-2 .filters ul li:hover, #testimonials-section-2 .filters-mobile ul li.active, #testimonials-section-2 .filters-mobile ul li:hover, #videos-section-2 .filters ul li.active, #videos-section-2 .filters ul li:hover, #videos-section-2 .filters-mobile ul li.active, #videos-section-2 .filters-mobile ul li:hover, #webinars-section-2 .filters ul li.active, #webinars-section-2 .filters ul li:hover, #webinars-section-2 .filters-mobile ul li.active, #webinars-section-2 .filters-mobile ul li:hover, #news-section-2 .filters ul li.active, #news-section-2 .filters ul li:hover, #news-section-2 .filters-mobile ul li.active, #news-section-2 .filters-mobile ul li:hover { color: var(--primary-symtrax); } #whitepappers-section-2 .filters-content .card, #testimonials-section-2 .filters-content .card, #videos-section-2 .filters-content .card, #webinars-section-2 .filters-content .card, #news-section-2 .filters-content .card { min-height: 570px; } #whitepappers-section-2 .filters-content a, #testimonials-section-2 .filters-content a, #videos-section-2 .filters-content a, #webinars-section-2 .filters-content a, #news-section-2 .filters-content a { text-decoration: none; } #whitepappers-section-2 .filters-content .card-top, #testimonials-section-2 .filters-content .card-top, #news-section-2 .filters-content .card-top { background-color: var(--bg-symtrax); height: 180px; overflow: hidden; } #whitepappers-section-2 .filters-content .card-top img { padding-top: 100px; } #webinars-section-2 .filters-content .card-top img, #videos-section-2 .filters-content .card-top img { width: 100%; } #webinars-section-2 .filters-content .card-top, #videos-section-2 .filters-content .card-top{ overflow: hidden; } #whitepappers-section-2 .filters-content .card:hover img { margin-top: -100px; transition: .3s; } #testimonials-section-2 .filters-content .card-top img, #webinars-section-2 .filters-content .card-top img, #videos-section-2 .filters-content .card-top img, #news-section-2 .filters-content .card-top img { -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */ filter: grayscale(100%); -ms-transform: scale(1); /* IE 9 */-webkit-transform: scale(1); /* Safari 3-8 */transform: scale(1); transition: .3s; } #testimonials-section-2 .filters-content .card:hover img, #webinars-section-2 .filters-content .card:hover img, #videos-section-2 .filters-content .card:hover img, #news-section-2 .filters-content .card:hover img { -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */ filter: grayscale(0%); -ms-transform: scale(1.1); /* IE 9 */-webkit-transform: scale(1.1); /* Safari 3-8 */transform: scale(1.1); transition: .3s; } #whitepappers-section-2 .filters-content .card:hover .btn-solution, #testimonials-section-2 .filters-content .card:hover .btn-solution, #videos-section-2 .filters-content .card:hover .btn-solution, #webinars-section-2 .filters-content .card:hover .btn-solution, #news-section-2 .filters-content .card:hover .btn-solution { background: var(--primary-symtrax); border-color: var(--primary-symtrax); color: var(--universal-white); text-decoration: none; transition: .3s; } #whitepappers-section-2 .filters-content h4, #testimonials-section-2 .filters-content h4, #videos-section-2 .filters-content h4, #webinars-section-2 .filters-content h4, #news-section-2 .filters-content h4 { min-height: 93px; } #whitepappers-section-2 .filters-content p, #testimonials-section-2 .filters-content p, #videos-section-2 .filters-content p, #webinars-section-2 .filters-content p, #news-section-2 .filters-content p { min-height: 180px; } #whitepappers-section-2 .terms-size, #testimonials-section-2 .terms-size, #videos-section-2 .terms-size, #webinars-section-2 .terms-size, #news-section-2 .terms-size{ min-height: 85px; } .fixLeft { z-index: 2; position: fixed; top: 80px; max-width: 376px; } .fixLeft-mobile { z-index: 2; position: fixed; top: 40px; width: 90%; background-color: #fff; } #whitepappers-section-2 .filters-mobile, #testimonials-section-2 .filters-mobile, #videos-section-2 .filters-mobile, #webinars-section-2 .filters-mobile, #news-section-2 .filters-mobile { display: none; } @media (max-width: 1199px) { #whitepappers-section-2 .filters, #testimonials-section-2 .filters, #videos-section-2 .filters, #webinars-section-2 .filters, #news-section-2 .filters { display: none; } #whitepappers-section-2 .filters-mobile, #testimonials-section-2 .filters-mobile, #videos-section-2 .filters-mobile, #webinars-section-2 .filters-mobile, #news-section-2 .filters-mobile { display: block; } #whitepappers-section-2 .filters-content .card-top img, #testimonials-section-2 .filters-content .card-top img, #videos-section-2 .filters-content .card-top img, #webinars-section-2 .filters-content .card-top img, #news-section-2 .filters-content .card-top img { padding-top: 0px; } #whitepappers-section-2 .filters-content .card:hover img, #testimonials-section-2 .filters-content .card:hover img { margin-top: 0px; } } @media (max-width: 992px) { #whitepappers-section-1 .last-whitepappers-img, #testimonials-section-1 .last-testimonials-img, #videos-section-1 .last-videos-img, #webinars-section-1 .last-webinars-img, #news-section-1 .last-news-img { display: none; } } @media (min-width: 650px) and (max-width: 767px) { .fixLeft-mobile { width: 72%; } } @media (min-width: 768px) and (max-width: 850px) { .fixLeft-mobile { width: 89%; } } @media (min-width: 850px) and (max-width: 992px) { .fixLeft-mobile { width: 81%; } } /* SINGLE SOLUTIONS 2022 */ #solution-header-2022 { background: linear-gradient(175deg, var(--bg-symtrax) 79%, var(--universal-white) 40%); padding-bottom: 5rem!important; } #architecture-solutions-2022, #form-solutions-2022, #faq-solutions-2022 .bg-faq, #related-solutions-2022, .solutions2022-tags { background-color: var(--bg-symtrax)!important; } .solutions2022-tags{ cursor:default!important; } #architecture-solutions-2022 .solutions2022-tags { background-color: var(--universal-white)!important; cursor:default!important; } #resources-solutions-2022, #resources2-solutions-2022 { background-color: #E9E9E9; } #solution-header-2022 h2, #related-solutions-2022 h3 { font-size: 1em; } #solution-header-2022 h1, #buisiness-benefits-solutions-2022 h1, #buisiness-benefits-solutions-2022 h2, #architecture-solutions-2022 h1, #form-solutions-2022 h1, #faq-solutions-2022 h1, #related-solutions-2022 h1, #features-solutions-2022 h1, #resources-solutions-2022 h1, #resources2-solutions-2022 h1 { font-size: 2.2rem; } #solution-header-2022 h3, #form-solutions-2022 h2, #form-solutions-2022 p, #faq-solutions-2022 h2 { font-size: 1.7em; } @media (max-width: 768px) { #solution-header-2022 img { display: block; margin-left: -15px; } #solution-header-2022 h1, #buisiness-benefits-solutions-2022 h1, #buisiness-benefits-solutions-2022 h2, #architecture-solutions-2022 h1, #form-solutions-2022 h1, #faq-solutions-2022 h1, #related-solutions-2022 h1, #features-solutions-2022 h1, #resources-solutions-2022 h1, #resources2-solutions-2022 h1 { font-size: 1.7rem; } #solution-header-2022 h3, #form-solutions-2022 h2, #form-solutions-2022 p, #faq-solutions-2022 h2 { font-size: 1.5em; } } @media (max-width: 991.98px) { #solution-header-2022 { background: none; background-color: var(--bg-symtrax); } #solution-header-2022 .thumbnail-header /* #features-solutions-2022 .thumbnail-feature */ { display: none; } #features-solutions-2022 .btn { margin-right: -20px!important; margin-left: -20px!important; } #features-solutions-2022 .row{ height:auto!important; } #features-solutions-2022 img{ border-radius: 0 0 16px 16px!important; width: 100%!important; height: auto!important; } } #buisiness-benefits-solutions-2022 h3 { font-size: 1.3em; min-height: 50px; } #buisiness-benefits-solutions-2022 i { font-size: 32px; padding-top: 14px; color: var(--dark-primary); } #buisiness-benefits-solutions-2022 .dot { height: 72px; width: 72px; background-color: #DDEAF3; border-radius: 50%; border: 5px solid var(--bg-symtrax); display: inline-block; } #buisiness-benefits-solutions-2022 ul { list-style-type: none; } #buisiness-benefits-solutions-2022 li::before { font-family: 'Font Awesome 5 Pro'; content: "\f00c"; color: #12b76a; display: inline-block; margin-left: -35px; height: 20px; width: 20px; background-color: #d1fadf; margin-right: 13px; padding-left: 4px; border-radius: 50%; font-size: 13px; padding-top: 1px; } #buisiness-benefits-solutions-2022 li { padding-bottom: 1rem; text-align: left; } #buisiness-benefits-solutions-2022 .card { border-radius: 16px; box-shadow: 0px 11px 8px #0000000A; } #architecture-solutions-2022 .dot { height: 70px; width: 70px; background-color: var(--universal-white); border-radius: 50%; display: inline-block; } #architecture-solutions-2022 .fa-sitemap { font-size: 27px; padding-top: 1.3rem; color: var(--dark-primary); } #architecture-solutions-2022 .msitemap{ padding-left:1.2rem; } #architecture-solutions-2022 .border-primary { border: 2px solid #006bb4; border-color: #006bb4 !important; } #architecture-solutions-2022 .card { box-shadow: 0px 11px 8px #0000000a; } #architecture-solutions-2022 img { object-fit: contain; height: 100%; width: auto; } /* #architecture-image-solutions-2022 .architecture-image-solutions-2022, #process-image-solutions-2022 .process-image-solutions-2022{ height:280px!important; } */ #features-solutions-2022 .row { min-height: 378px; border-radius: 16px; margin-right: -1px !important; } #features-solutions-2022 img { border-radius: 0 16px 16px 0; object-fit: cover; } #features-solutions-2022 .arrowLeftCarou i, #features-solutions-2022 .arrowRightCarou i { color: #006BB4; } #features-solutions-2022 .btn { padding-right: 0; margin-right: -10px; padding-left: 0; margin-left: -10px; } #features-solutions-2022 a { color:var(--universal-white); text-decoration: underline; } #features-solutions-2022 a:hover { opacity: 0.5; transition: .3s; } #related-solutions-2022 .solutionCard { box-shadow: none !important; } #related-solutions-2022 .solutionCard:hover { box-shadow: 0 0rem 1.3rem rgb(0 0 0 / 10%) !important; transition: .3s; } #related-solutions-2022 .card { border-radius: 0.4rem !important; } #related-solutions-2022 .sizeBlockh3 { min-height: 86px; } #related-solutions-2022 .sizeBlockp { min-height: 86px; } #related-solutions-2022 .sizeBlockp:lang(fr), #related-solutions-2022 .sizeBlockp:lang(de), #related-solutions-2022 .sizeBlockp:lang(es) { min-height: 96px; } @media(max-width: 576px) { #related-solutions-2022 .sizeBlockh3 { min-height: 0 !important; } #related-solutions-2022 .sizeBlockp { min-height: 0 !important; } #features-solutions-2022 .arrowLeftCarou i, #features-solutions-2022 .arrowRightCarou i { color: var(--secondry-symtrax) !important; } #features-solutions-2022 .btn { margin-right: 20px!important; margin-left: 20px!important; } } #resources-solutions-2022 .dot, #resources2-solutions-2022 .dot { height: 68px; width: 68px; background-color: var(--universal-white); border-radius: 50%; display: inline-block; } #resources-solutions-2022 .fa-users-class, #resources2-solutions-2022 .fa-users-class { font-size: 27px; padding-top: 1.3rem; padding-left: 1.1rem; color: var(--dark-primary); } #resources-solutions-2022 .fa-play-circle, #resources2-solutions-2022 .fa-play-circle { font-size: 33px; padding-left: 1.1rem; padding-top: 1.1rem; color: var(--dark-primary); } #resources-solutions-2022 .fa-book, #resources2-solutions-2022 .fa-book { padding-left: 1.4rem; padding-top: 1.3rem; font-size: 27px; color: var(--dark-primary); } #resources-solutions-2022 .fa-comment, #resources2-solutions-2022 .fa-comment{ font-size: 27px; padding-top: 1.3rem; padding-left: 1.3rem; color: var(--dark-primary); } .resources-webinars-solutions-2022, .resources-videos-solutions-2022 { position: relative; } .resources-webinars-solutions-2022 img, .resources-videos-solutions-2022 .video-img { display: block; border-left: 12px solid black; border-right: 12px solid black; border-top: 12px solid black; border-radius: 12px 12px 0 0; box-shadow: 0px 11px 8px #0000000a; } .resources-videos-solutions-2022 .videoplayer { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .resources-videos-solutions-2022 .videoplayer:hover{ filter: brightness(50%); transition: .3s; } #resources-whith-quote-solutions-2022 .resources-whith-quote-solutions-2022{ background-color: var(--dark-primary); border-radius: 16px; } #resources-whith-quote-solutions-2022 .stars-resource-solutions-2022 { color: #F79B1C; font-size: 27px; } #resources-whith-quote-solutions-2022 .quote-resources-solutions-2022{ font-size: 2rem; } #resources-whith-quote-solutions-2022 .fa-user-circle{ font-size: 35px; } #form-solutions-2022:lang(fr) .sym-cta-form .wpcf7 #acceptance #checkboxtxt, #form-solutions-2022:lang(es) .sym-cta-form .wpcf7 #acceptance #checkboxtxt, #form-solutions-2022:lang(de) .sym-cta-form .wpcf7 #acceptance #checkboxtxt{ font-size: 45%!important; } #form-solutions-2022 #zugferd-forms .dz-button{ color: #6c757d; border: none; background-color: #fff; } #form-solutions-2022 #zugferd-forms #zugferdPdfDropzone { height: 150px !important; border: 1px dashed #6c757d !important; } #related-solutions-2022 .card:hover .btn-solution { background: var(--primary-symtrax); border-color: var(--primary-symtrax); color: var(--universal-white); transition: .3s; } /* PAGE GET DEMO 2022 */ #get-demo-2022-form { border-radius: 25px; } #get-demo-2022-form .wpcf7-not-valid-tip { display: none; } #get-demo-2022-form input.wpcf7-not-valid, #get-demo-2022-form select.wpcf7-not-valid, #get-demo-2022-form .wpcf7 form.invalid .wpcf7-response-output { border: 2px solid #ff8c00 !important; } #get-demo-2022-form .wpcf7-response-output { background-color: var(--universal-white); } #get-demo-2022-form { position: relative; } #get-demo-2022-form .ajax-loader { position: absolute; bottom: 36px; left: 36px; } #get-demo-2022-form label { display: none; } #get-demo-2022-form form#sym-cf7-form label { display: block; } /* PAGE CONTACT US 2024 */ .contact-us .image-container { background: url('https://www.symtrax.com/wp-content/uploads/2024/07/contact-page-form-img.png') no-repeat center center; background-size: cover; background-position: right; } .contact-us { font-family: "Open Sans", sans-serif; } .contact-us header { margin-bottom: 96px; } .contact-us header .title-wrapper { margin: 96px 0; } .contact-us header .title-wrapper span { color: #005690; font-size: 16px; font-weight: 600; } .contact-us header .title-wrapper h1 { color: #101828; font-size: 48px; font-weight: 600; letter-spacing: -0.96px; margin: 12px 0 24px; } .contact-us header .title-wrapper p { color: #475467; font-size: 20px; } .offices-wrapper { position: relative; display: inline-block; } .offices-wrapper .tooltip-btn { position: absolute; transform: translate(-50%, -50%); padding: 0; background-color: #006BB4 !important; box-shadow: 0 0 0 8px #006bb430, 0 0 0 16px #006bb40d; width: 8px; height: 8px; border-radius: 50%; border: 0; } .offices-wrapper .tooltip-btn:hover { background-color: #006BB4 !important; } .offices-wrapper div.tooltip-inner { color: #475467; background-color: #fff; border: 1px #000 solid; } .offices-wrapper .office-fr { top: 37.5%; left: 49.5%; } .offices-wrapper .office-en { top: 31.5%; left: 48%; } .offices-wrapper .office-de { top: 33.5%; left: 51.5%; } .offices-wrapper .office-in { top: 54%; left: 69.5%; } .offices-wrapper .office-pu { top: 53.5%; left: 68.5%; } .offices-wrapper .office-sg { top: 61.5%; left: 76.5%; } .offices-wrapper .office-ca { top: 43.5%; left: 16%; } .offices-wrapper .office-ny { top: 39.5%; left: 28.5%; } .contact-us .our-offices { font-family: "Open Sans"; } .contact-us .our-offices span { color: #B1D6F0; font-size: 16px; font-weight: 600; } .contact-us .our-offices h2 { color: white; font-size: 36px; font-weight: 600; } .contact-us .our-offices p { color: #B1D6F0; font-size: 20px; margin-bottom: 0; } .contact-us .our-location { background-color: #005690; } .contact-us .our-location #contact-container { margin: 96px auto; } .contact-us .location-card { font-family: "Open Sans", sans-serif; margin: 15px 0; } .contact-us .location-card h2 { text-transform: uppercase; } .contact-us .location-card h2, .contact-us h3 { color: white; font-size: 20px; font-weight: 600; } .contact-us .location-card i { display: none; } .contact-us .location-card .location-infos, .contact-us .location-card .location-infos a, .contact-us .location-card .location-support-infos>h4, .contact-us .location-card .location-support-infos a { color: #B1D6F0; font-size: 16px; } .contact-us .location-card .location-infos a, .contact-us .location-card .location-support-infos a { text-decoration: underline; } .contact-us .location-card .location-infos p { margin: 0; } .contact-us #contact-inner-container nav { padding: 50px 0rem !important; } .contact-us #menu-continents { justify-content: start !important; } .contact-us #menu-continents li { margin: 0 20px 0 0; } .contact-us #menu-continents li a { padding: 7px 12px !important; font-size: 14px; } .contact-us #menu-continents .menu-item a { background-color: #58A1D2 !important; color: white !important; } .contact-us #menu-continents .menu-item a.active { font-weight: bold; background-color: #EAF2F7 !important; color: #00406C !important; } .contact-us #contact-container #contact-inner-container #contact-locations-menu #mobile-locations-btn, .contact-us #contact-container #contact-inner-container #contact-locations-menu #mobile-locations-btn:hover { border-radius: 8px; background-color: white; color: #005690; font-weight: 600; } .contact-us .form-container { padding: 32px 104px !important; max-width: 720px; } .contact-us .form-container h2 { font-size: 36px; color: #101828; font-weight: 600; } .contact-us .form-container label { font-size: 14px; font-family: 'Open Sans'; font-weight: 600; color: #344054; } .contact-us #contact-page-2022-form input[type=text], .contact-us #contact-page-2022-form input[type=email], .contact-us #contact-page-2022-form input[type=tel], #contact-page-2022-form select { border-radius: 8px !important; border: 1px #D0D5DD solid !important; padding: 10px 14px; box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); color: #667085; font-size: 16px; } .contact-us #contact-page-2022-form input[type=text]:focus, .contact-us #contact-page-2022-form input[type=email]:focus, .contact-us #contact-page-2022-form input[type=tel]:focus, .contact-us #contact-page-2022-form select:focus { box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.10); } .contact-us input:-webkit-autofill, .contact-us input:-webkit-autofill:hover, .contact-us input:-webkit-autofill:focus, .contact-us input:-webkit-autofill:active { background-color: white; } .contact-us #register { font-size: 16px; border-radius: 8px !important; display: flex; padding: 12px 20px; justify-content: center; align-items: center; width: 100%; margin-top: 32px; } @media (max-width: 768px) { .contact-us #contact-container #contact-inner-container #contact-locations-menu div .menu { margin-left: 0px; } .contact-us .form-container { padding: 32px 32px !important; margin: 0 auto; } } /* New Forms Zoho */ .wpcf7 { justify-items: center; } .wpcf7 .my-custom-form { display: flex; justify-content: center; width: 100%; } form.sym-cf7-form[action="https://crm.zoho.eu/crm/WebToLeadForm"] { display: flex; flex-wrap: wrap; max-width: 423px; padding: 10px 16px; border-radius: 8px; background: var(--White, #FFF); box-shadow: 0px 204px 57px 0px rgba(0, 0, 0, 0.00), 0px 131px 52px 0px rgba(0, 0, 0, 0.01), 0px 74px 44px 0px rgba(0, 0, 0, 0.05), 0px 33px 33px 0px rgba(0, 0, 0, 0.09), 0px 8px 18px 0px rgba(0, 0, 0, 0.10); } form.sym-cf7-form .zcwf_row { flex: 0 0 100%; max-width: 100%; margin: 5px 0px; } form.sym-cf7-form .zcwf_row.wfrm_fld_dpNn { display: none; } form.sym-cf7-form :nth-child(1 of .zcwf_row) { padding-right: 5px; } form.sym-cf7-form :nth-child(2 of .zcwf_row) { padding-left: 5px; } form.sym-cf7-form :nth-child(-n + 2 of .zcwf_row) { flex: 0 0 50%; max-width: 50%; } form.sym-cf7-form .zcwf_row label { color: #344054; font-family: "Open Sans"; font-size: 14px; margin-bottom: 6px; line-height: 20px; } form.sym-cf7-form .zcwf_row label > span { color: #344054 !important; } form.sym-cf7-form .zcwf_row input, form.sym-cf7-form .zcwf_row select, form.sym-cf7-form .zcwf_row textarea { font-size: 16px; padding: 10px 14px; border-radius: 8px; border: 1px solid #D0D5DD; background: var(--White, #FFF); box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05); color: #667085; font-family: "Open Sans"; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; } form.sym-cf7-form .zcwf_row textarea { height: 120px; max-height: 120px; resize: none; } form.sym-cf7-form .zcwf_row input:focus, form.sym-cf7-form .zcwf_row textarea:focus { color: black; } form.sym-cf7-form .zcwf_row .g-recaptcha { justify-items: center; } form.sym-cf7-form .zcwf_row .zcwf_privacy_txt { font-size: 9px !important; } .zcwf_col_fld_slt option:nth-child(-n+9):not(:nth-child(1)) { color: #424a5b; background: #F2F2F2; font-weight: bold; } form.sym-cf7-form .zcwf_row input[type="submit"] { display: flex; padding: 8.667px 16.66px 8.667px 16.67px; flex-direction: column; justify-content: center; align-items: center; justify-self: center; color: white; border-radius: 800px; border: #006BB4; background: #006BB4; } form.sym-cf7-form .zcwf_row input[type="reset"] { display: none; } form.sym-cf7-form .zcwf_row .zcwf_privacy { display: flex; align-items: flex-start; flex-wrap: wrap; max-width: 100%; } form.sym-cf7-form .zcwf_row .dIB.vaT { flex-shrink: 0; padding-right: 8px; } form.sym-cf7-form .zcwf_row .zcwf_privacy_txt { flex: 1; max-width: calc(100% - 24px); } form.sym-cf7-form .zcwf_row .zcwf_privacy_txt a { color: black; text-decoration: underline; } .zcwf_privacy > div:nth-child(3) { margin-top: 5px; display: block; width: 100%; } form.sym-cf7-form .zcwf_row .zcwf_privacy > div:nth-child(3)[style*="visibility:visible"] { display: block; } form.sym-cf7-form .zcwf_row .zcwf_privacy > div:nth-child(3)[style*="visibility:hidden"] { display: none; } form.sym-cf7-form .zcwf_row .zcwf_privacy > div:nth-child(3) { display: none; } form.sym-cf7-form.light-form label, form.sym-cf7-form.light-form label > span, form.sym-cf7-form.light-form .zcwf_privacy_txt, form.sym-cf7-form.light-form .zcwf_privacy_txt a{ color: white !important; } form.sym-cf7-form { position: relative; overflow: hidden; box-sizing: border-box; --animate-duration: 1s; } form.sym-cf7-form .wpcf7-turnstile { place-items: center; margin: 16px 0; } /* background */ form.sym-cf7-form::before { content: ''; position: absolute; inset: 0; background-color: rgba(255, 255, 255, 0.7); z-index: 10; opacity: 0; pointer-events: none; transition: opacity 0.2s ease; } /* SPINNER + CHECK */ form.sym-cf7-form::after { content: ''; position: absolute; top: 50%; left: 50%; margin: -20px 0 0 -20px; width: 40px; height: 40px; border: 4px solid transparent; border-top: 4px solid black; border-radius: 50%; opacity: 0; z-index: 11; animation: none; transition: opacity 0.3s ease; } /* Block clics */ form.sym-cf7-form.loading::before, form.sym-cf7-form.finished::before, form.sym-cf7-form.abort::before { opacity: 1; pointer-events: all; } /* SPINNER set */ form.sym-cf7-form.loading::after { opacity: 1; animation: spin 1s linear infinite; } /* CHECK visible with bounce */ form.sym-cf7-form.finished::after { opacity: 1; border: none; font-size: 32px; color: green; content: '✔'; /* can be change with other things */ animation: bounceIn calc(var(--animate-duration, 1s) * 0.75) ease both; } /* ABORT visible with bounce */ form.abort::after { opacity: 1; border: none; font-size: 32px; color: red; content: '🗙'; /* can be change with other things */ animation: bounceIn calc(var(--animate-duration, 1s) * 0.75) ease both; } /* Animations */ @keyframes spin { to { transform: rotate(360deg); } } @keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); } 20% { transform: scale3d(1.1, 1.1, 1.1); } 40% { transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; transform: scale3d(1.03, 1.03, 1.03); } 80% { transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; transform: scale3d(1, 1, 1); } } .no-box-shadow { box-shadow: none !important; } /******************************/ /* Homepage2025 */ /******************************/ .hero-section { padding: 0; height: 650px; max-height: 650px; display: flex; align-items: center; } @media (max-width: 768px) { .hero-section { height: 820px; max-height: 820px; } } #HeroHomepageCarousel { display: flex; flex-direction: column; justify-content: space-between; } .hero-section .carousel { height: 100%; } .hero-section .carousel .carousel-inner { height: 100%; } .hero-section .carousel-item { height: 100%; align-items: center; justify-content: center; } .hero-section .carousel-item.active { display: flex; } .hero-section .carousel-item.carousel-item-right, .hero-section .carousel-item.carousel-item-right, .hero-section .carousel-item.carousel-item-next { display: flex; } .hero-section .carousel-item .row { width: 100%; margin: 0; align-items: center; } .hero-section .carousel-item img { max-height: 300px; width: auto; object-fit: contain; } .hero-section .carousel-item .col-12 { display: flex; flex-direction: column; justify-content: center; align-items: center; } .carousel-indicators { bottom: 20px; margin-bottom: 0; position: static; } .hero-section h1, .hero-section h2 { color: var(--primary, #006BB4); font-family: "Open Sans", sans-serif; font-size: 28px; font-weight: 700; line-height: 150%; letter-spacing: -0.56px; margin-bottom: 28px; } .hero-section p { color: var(--Secondary-800, #1A1E24); font-family: "Open Sans", sans-serif; font-size: 20px; font-weight: 400; line-height: 30px; } .carousel-indicators { position: relative !important; display: flex !important; margin-bottom: 12px; } .carousel-indicators li { background-color: #00406C !important; width: 20% !important; height: 3px !important; } .benefit-section { padding: 86px 0; background: var(--Primary-0, #EAF2F7); } .benefit-section i { font-size: 27px; color: #00406C; font-size: 27px; color: #00406C; background-color: white; padding: 14px; border-radius: 50%; } .benefit-section h2 { color: var(--Primary-800, #002B48); text-align: right; font-family: "Open Sans", sans-serif; font-size: 32px; font-weight: 700; line-height: 150%; letter-spacing: -0.64px; margin: 34px 0; } .benefit-section p { color: #686F7B; text-align: right; font-family: "Open Sans", sans-serif; font-size: 24px; font-weight: 400; line-height: 32px; } .benefit-list { padding: 20px 0; } .benefit-list li { display: flex; align-items: center; } .benefit-list li:before { font-family: 'Font Awesome 5 Pro'; content: "\f00c"; color: #12B76A; height: 20px; width: 20px; background-color: #d1fadf; border-radius: 50%; font-size: 13px; text-align: center; margin-left: 10px; } .benefit-list .bullet-wrapper .bullet-title { color: var(--primary, #006BB4); text-align: right; font-family: "Open Sans", sans-serif; font-size: 16px; font-weight: 700; line-height: 24px; } .benefit-list .bullet-wrapper .bullet-text { color: var(--secondary, #424B5A); text-align: right; font-family: "Open Sans", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; } .solution-section { background: linear-gradient(104deg, var(--Primary-700, #00406C) 11.11%, var(--primary, #006BB4) 99.93%); } .solution-section i { font-weight: 300; font-size: 27px; color: #00406C; } .solution-section .tag, .solution-categories-section .tag, #home-carousel .tag { text-align: center; color: #006BB4; border-color: white; border-radius: 4px; background: var(--White, #FFF); width: 180px; height: 22px; text-align: center; font-family: "Open Sans", sans-serif; font-size: 12px; font-weight: 700; line-height: 18px; align-content: center; justify-self: center; } .solution-section h2 { color: var(--White, #FFF); text-align: center; font-family: "Open Sans", sans-serif; font-size: 32px; font-weight: 700; line-height: 150%; letter-spacing: -0.64px; } .solution-section p { color: var(--White, #FFF); text-align: center; font-family: "Open Sans", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; } .solution-section .button-wrapper { display: flex; justify-content: center; align-items: center; gap: 16px; } .solution-section .button-wrapper .btn { border-radius: 8px; border: 1px solid var(--success, #2CA58D); background: var(--success, #2CA58D); box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05); color: #FFF; font-family: "Open Sans", sans-serif; font-size: 14px; font-weight: 600; line-height: 20px; } .solution-section .button-wrapper .btn.symtrax-btn-alt-light { border: 1px solid #2C86C3; background: #2C86C3; } .solution-section .button-wrapper .btn.symtrax-btn-secondary { border: 1px solid #2CA58D; background: #2CA58D; } .solution-section img { max-width: 600px; } .solution-categories-section { background: linear-gradient(173deg, rgba(0, 43, 72, 1) 63.8%, rgba(255, 255, 255, 1) 64%); } .solution-categories-section h2 { color: var(--White, #FFF); text-align: center; font-family: "Open Sans", sans-serif; font-size: 32px; font-weight: 700; line-height: 150%; letter-spacing: -0.64px; margin: 32px 0; } .solution-categories-section #challenges-list { justify-content: center; gap: 31px; } .solution-categories-section #challenges-list .challenge-card:nth-child(1) { display: none; } .solution-categories-section .challenge-card { border-radius: 10px; border: 1px solid var(--Secondary-50, #E3E5E8); background: var(--White, #FFF); box-shadow: 0 20px 9px 7px rgba(16, 24, 40, 0.08), 0 8px 8px -4px rgba(16, 24, 40, 0.03); display: flex; width: 260px; padding: 48px 12px; flex-direction: column; justify-content: center; align-items: center; font-family: "Open Sans", sans-serif; gap: 19px; transition: .3s; } .solution-categories-section .challenge-card:hover { box-shadow: 0 263px 74px 0 rgba(0, 0, 0, 0.00), 0 168px 67px 0 rgba(0, 0, 0, 0.00), 0 95px 57px 0 rgba(0, 0, 0, 0.02), 0 42px 42px 0 rgba(0, 0, 0, 0.03), 0 11px 23px 0 rgba(0, 0, 0, 0.03), 0 0 0 0 rgba(0, 0, 0, 0.03); transition: .3s; transform: translateY(-10px); text-decoration: none !important; } .solution-categories-section .challenge-card .categories-2 { content: ""; display: inline-block; height: 92px; width: 92px; background: url(/wp-content/themes/Symtrax/library/images/signature-solutions-logo.png) center center / 80% no-repeat;; background-position: center center; } .solution-categories-section .challenge-card .categories-3 { content: ""; display: inline-block; height: 92px; width: 92px; background: url(/wp-content/themes/Symtrax/library/images/edi-ready-logo.png) center center / 80% no-repeat; background-position: center center; } .solution-categories-section .challenge-card .categories-4 { content: ""; display: inline-block; height: 92px; width: 92px; background: url(/wp-content/themes/Symtrax/library/images/digital-data-and-document-transformation-logo.png) center center / 80% no-repeat;; background-position: center center; } .solution-categories-section .challenge-card .challenge-card-title { color: #002B48; text-align: center; font-size: 20px; font-weight: 700; line-height: 30px; } .solution-categories-section .challenge-card p { color: #353C48; font-size: 16px; font-weight: 400; } .benefit-2-section { padding: 34px 0 0 0; } .benefit-2-section i { font-size: 20px; color: #00406C; border-radius: 50%; background: #F2F7FB; margin-bottom: 34px; } .benefit-2-section h2 { color: var(--Primary-800, #002B48); font-family: "Open Sans", sans-serif; font-size: 32px; font-weight: 700; line-height: 150%; letter-spacing: -0.64px; margin-bottom: 34px; } .benefit-2-section p { color: #686F7B; font-family: "Open Sans", sans-serif; font-size: 24px; font-weight: 400; line-height: 32px; margin-bottom: 34px; } .benefit-2-section .bullet-text { color: #424B5A; font-family: "Open Sans", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; margin-bottom: 40px; } .benefit-2-section ul { padding: 20px 0; list-style: none; } .benefit-2-section ul li { display: flex; align-items: flex-start; margin-bottom: 40px; } .benefit-2-section ul li:before { font-family: 'Font Awesome 5 Pro'; content: "\f00c"; color: #12B76A; height: 20px; width: 20px; min-width: 20px; background-color: #d1fadf; border-radius: 50%; font-size: 13px; text-align: center; line-height: 20px; margin-right: 10px; flex-shrink: 0; align-self: center; } .key-numbers { padding: 28px 0; } .trusted_us { padding: 69px 0; } .trusted_us h3 { color: var(--Primary-800, #002B48); text-align: center; font-family: "Open Sans", sans-serif; font-size: 28px; font-weight: 700; line-height: 150%; letter-spacing: -0.56px; margin-bottom: 32px; } .trusted_us img { filter: grayscale(100%); transition: filter 0.3s ease; } .trusted_us img:hover { filter: grayscale(0%); transition: filter 0.3s ease; } #home-carousel { background-color: #EAF2F7; } .free-demo { background: linear-gradient(102deg, var(--Primary-600, #005690) 0.08%, var(--Primary-800, #002B48) 99.92%); } @keyframes circle { from { transform: scale(0); opacity: 1; } to { transform: scale(1); opacity: 0; } } .circle-wrapper { width: 100%; height: 100%; max-width: 420px; max-height: 420px; aspect-ratio: 1/1; position: relative; justify-self: center; } .circle { width: 100%; height: 100%; max-width: 420px; max-height: 420px; border-radius: 50%; position: absolute; justify-self: center; transform: translate(50%, 50%); opacity: 0; } .one { animation: circle 6s infinite cubic-bezier(0, .75, .90, 1); background: transparant; border: 3px solid white; } .two { animation: circle 6s 1.5s infinite cubic-bezier(0, .75, .90, 1); background: transparant; border: 3px solid white; } .three { animation: circle 6s 3s infinite cubic-bezier(0, .75, .90, 1); background: transparant; border: 3px solid white; } .four { animation: circle 6s 4.5s infinite cubic-bezier(0, .75, .90, 1); background: transparant; border: 3px solid white; } .free-demo p { color: var(--White, #FFF); font-family: "Open Sans"; font-size: 16px; font-weight: 400; line-height: 24px; margin: 0 0 48px 0; } .free-demo h2 { color: var(--White, #FFF); font-family: "Open Sans", sans-serif; font-size: 40px; font-weight: 700; line-height: normal; } .free-demo a { border-radius: 8px; border: 1px solid #2CA58D; background: #2CA58D; box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05); padding: 8px 14px; color: white !important; text-decoration: none; color: var(--Base-White, #FFF); font-family: "Open Sans", sans-serif; font-size: 14px; font-weight: 600; line-height: 20px; } .free-demo img { width: 75%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .wrapper-cta { padding: 38px 63px; background: #00406c; color: white; margin: 96px 0; border-radius: 16px; box-shadow: 0 20px 24px -4px rgba(16, 24, 40, 0.08), 0 8px 8px -4px rgba(16, 24, 40, 0.03); display: flex; justify-content: space-between; align-items: center; position: relative; overflow: hidden; } .wrapper-cta::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(91deg, #00406c 20.65%, #006bb4 99.89%); opacity: 0; transition: opacity 1s ease; border-radius: 16px; z-index: 0; } .wrapper-cta:hover::before { opacity: 1; } .wrapper-cta > * { position: relative; z-index: 1; } .wrapper-cta h3 { color: var(--Base-White, #FFF); font-family: "Inter", sans-serif; font-size: 30px; font-weight: 600; line-height: 38px; margin-bottom: 16px; } .wrapper-cta p { color: var(--Secondary-100, #D1D4D8); font-family: "Inter", sans-serif; font-size: 20px; font-weight: 400; line-height: 30px; margin: 0; } .wrapper-cta a { border-radius: 8px; border: 1px solid #2CA58D; background: #2CA58D; box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05); padding: 8px 14px; color: white !important; text-decoration: none; color: var(--Base-White, #FFF); font-family: "Open Sans", sans-serif; font-size: 14px; font-weight: 600; line-height: 20px; } .wrapper-cta a::after { content: "\f054"; font-size: 14px; margin-left: 8px; font-weight: 600; font-family: "Font Awesome 5 Pro"; } .wrapper-cta a:hover, .solution-section .button-wrapper .btn:hover, #home-quote-custom .quote-cta-content-wrapper a:hover, .free-demo a:hover { text-decoration: none !important; border: 1px solid #00406C; background: #00406C; transition: .3s; } #home-quote-custom { max-height: 1080px; overflow: hidden; background-color: #002B48; } #home-quote-custom .quote-cta-content-wrapper h2 { color: white; font-family: "Open Sans", sans-serif; font-size: 40px; font-weight: 700; margin-bottom: 29px; } #home-quote-custom .quote-cta-content-wrapper p { color: white; font-family: "Open Sans", sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; margin-bottom: 51px; } #home-quote-custom .quote-cta-content-wrapper a { padding: 8px 14px; border-radius: 8px; border: 1px solid #2CA58D; background: #2CA58D; color: white; font-family: "Open Sans", sans-serif; font-size: 14px; font-weight: 600; line-height: 20px; box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05); } #home-quote-custom .scrolling-list { animation: scroll 45s linear infinite; } #home-quote-custom .scrolling-list.inverted { animation: scroll 45s reverse linear infinite; } #home-quote-custom .scrolling-list:hover { animation-play-state: paused; } /* bootstrap md width */ @media (max-width: 768px) { #HeroHomepageCarousel img { max-height: 250px; } #home-quote-custom .scrolling-list { animation-play-state: paused; transform: translateY(0) !important; } #home-quote-custom .scrolling-list .subTestimonial { display: flex; } /*only two first testimonials displayed*/ #home-quote-custom .scrolling-list .subTestimonial:nth-child(n+3) { display: none; } } #home-quote-custom .card.numb2 { border-radius: 20px; background: #ececec; } #home-quote-custom .quote_text { color: #424B5A; font-family: "Open Sans", sans-serif; font-size: 12px; font-weight: 400; } #home-quote-custom .quote_author { color: #424B5A; font-family: "Open Sans", sans-serif; font-size: 14px; font-weight: 700; } #home-quote-custom .numbRelative { color: #424B5A; font-family: "Open Sans", sans-serif; font-size: 12px; font-weight: 400; } #home-quote-custom .testimonial_company { color: #424B5A; font-family: "Open Sans", sans-serif; font-size: 12px; font-weight: 400; } #home-quote-custom .col-12.col-md-6.p-0 .row, #home-quote-custom .col-md-6.p-0.pl-2 .row { max-height: 1080px; display: flex; } #home-quote-custom .col-12.col-md-6.p-0 .row>div, #home-quote-custom .col-md-6.p-0.pl-2 .row>div { display: flex; flex-direction: column; justify-content: center; } #home-quote-custom .placeholder-card { border-radius: 20px; background: var(--Primary-700, #00406C); flex-grow: 1; min-height: 100px; } #home-quote-custom .placeholder-card:first-child { border-radius: 0 0 20px 20px; margin-bottom: 8px; } #home-quote-custom .placeholder-card:last-child { border-radius: 20px 20px 0 0; margin-top: 8px; } #home-quote-custom .placeholder-card:only-child { border-radius: 20px; margin: 0; } #home-quote-custom .subTestimonial { background-color: transparent; } #home-quote-custom .subTestimonial a:hover { text-decoration: none !important; } #home-quote-custom .subTestimonial .card:hover { background: white; transition: .3s; box-shadow: 0 0.5rem 2rem rgb(0 0 0 / 15%) !important; } #home-quote-custom .subTestimonial .card:focus { background-color: var(--light-symtrax); } @keyframes scroll { to { transform: translateY(-50%); } } #home-figures-custom { background-color: white; } /******************************/ /* Symtrax Button Library */ /******************************/ /* Base Button */ .sbl-btn { font-family: 'Open Sans', sans-serif; font-weight: 600; font-size: 14px; line-height: 20px; display: flex; align-items: center; justify-content: center; text-decoration: none; border-radius: 8px; border: 1px solid transparent; box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05); } /* Primary Button */ .sbl-btn-primary { border: 1px solid #2C86C3; background: #2C86C3; color: white; } .sbl-btn-primary:hover { background: #006BB4; border: 1px solid #006BB4; transition: .3s; } .sbl-btn-primary:active { background: #005690; border: 1px solid #005690; transition: .3s; } .sbl-btn-primary:focus { box-shadow: 0 0 0 4px #006bb430, 0 0 0 8px #006bb40d; outline: none; } /* Primary alt Button */ /* Secondary Button */ /* Secondary alt Button */ /* Success Button */ /* Sizes */ /* Thickness */ .sbl-btn-thin { padding: 8px; } .sbl-btn-large { padding: 12px 20px; } /* Rounded */ .sbl-btn-square { border-radius: 0px; } .sbl-btn-rounded-medium { border-radius: 16px; } .sbl-btn-rounded { border-radius: 50%; } /* shadow */