.elementor-23343 .elementor-element.elementor-element-d1af384{--display:flex;--min-height:86vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:stretch;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--overflow:hidden;--overlay-opacity:0.73;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:4%;--padding-bottom:0%;--padding-left:0%;--padding-right:0%;--z-index:0;}.elementor-23343 .elementor-element.elementor-element-d1af384:not(.elementor-motion-effects-element-type-background), .elementor-23343 .elementor-element.elementor-element-d1af384 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFFE8;background-image:url("https://www.techsavi.co.uk/wp-content/uploads/2026/10/modern_workspace_laptop.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-23343 .elementor-element.elementor-element-d1af384::before, .elementor-23343 .elementor-element.elementor-element-d1af384 > .elementor-background-video-container::before, .elementor-23343 .elementor-element.elementor-element-d1af384 > .e-con-inner > .elementor-background-video-container::before, .elementor-23343 .elementor-element.elementor-element-d1af384 > .elementor-background-slideshow::before, .elementor-23343 .elementor-element.elementor-element-d1af384 > .e-con-inner > .elementor-background-slideshow::before, .elementor-23343 .elementor-element.elementor-element-d1af384 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#FFFFFF;--background-overlay:'';}.elementor-23343 .elementor-element.elementor-element-d1af384::before{filter:brightness( 130% ) contrast( 100% ) saturate( 100% ) blur( 9.6px ) hue-rotate( 0deg );}.elementor-23343 .elementor-element.elementor-element-e4785de{--display:flex;--align-items:flex-start;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--overlay-opacity:0.5;--border-radius:20px 20px 20px 20px;box-shadow:0px 0px 41px 0px rgba(0,0,0,0.15);--padding-top:3%;--padding-bottom:3%;--padding-left:5%;--padding-right:5%;}.elementor-23343 .elementor-element.elementor-element-e4785de:not(.elementor-motion-effects-element-type-background), .elementor-23343 .elementor-element.elementor-element-e4785de > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-23343 .elementor-element.elementor-element-e4785de::before, .elementor-23343 .elementor-element.elementor-element-e4785de > .elementor-background-video-container::before, .elementor-23343 .elementor-element.elementor-element-e4785de > .e-con-inner > .elementor-background-video-container::before, .elementor-23343 .elementor-element.elementor-element-e4785de > .elementor-background-slideshow::before, .elementor-23343 .elementor-element.elementor-element-e4785de > .e-con-inner > .elementor-background-slideshow::before, .elementor-23343 .elementor-element.elementor-element-e4785de > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-image:url("https://www.techsavi.co.uk/wp-content/uploads/2026/10/bubble_bg_popup.png");--background-overlay:'';background-position:center right;background-repeat:no-repeat;background-size:contain;}.elementor-23343 .elementor-element.elementor-element-e4785de.e-con{--align-self:center;}.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}body:not(.rtl) .elementor-23343 .elementor-element.elementor-element-9b51bc6{right:28px;}body.rtl .elementor-23343 .elementor-element.elementor-element-9b51bc6{left:28px;}.elementor-23343 .elementor-element.elementor-element-9b51bc6{top:30px;}.elementor-23343 .elementor-element.elementor-element-9b51bc6 .elementor-icon-wrapper{text-align:center;}.elementor-23343 .elementor-element.elementor-element-9b51bc6.elementor-view-stacked .elementor-icon{background-color:#3D4459;}.elementor-23343 .elementor-element.elementor-element-9b51bc6.elementor-view-framed .elementor-icon, .elementor-23343 .elementor-element.elementor-element-9b51bc6.elementor-view-default .elementor-icon{color:#3D4459;border-color:#3D4459;}.elementor-23343 .elementor-element.elementor-element-9b51bc6.elementor-view-framed .elementor-icon, .elementor-23343 .elementor-element.elementor-element-9b51bc6.elementor-view-default .elementor-icon svg{fill:#3D4459;}.elementor-23343 .elementor-element.elementor-element-9b51bc6.elementor-view-stacked .elementor-icon:hover{background-color:#06D9FA;}.elementor-23343 .elementor-element.elementor-element-9b51bc6.elementor-view-framed .elementor-icon:hover, .elementor-23343 .elementor-element.elementor-element-9b51bc6.elementor-view-default .elementor-icon:hover{color:#06D9FA;border-color:#06D9FA;}.elementor-23343 .elementor-element.elementor-element-9b51bc6.elementor-view-framed .elementor-icon:hover, .elementor-23343 .elementor-element.elementor-element-9b51bc6.elementor-view-default .elementor-icon:hover svg{fill:#06D9FA;}.elementor-23343 .elementor-element.elementor-element-9b51bc6 .elementor-icon{font-size:16px;}.elementor-23343 .elementor-element.elementor-element-9b51bc6 .elementor-icon svg{height:16px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;color:var( --e-global-color-primary );}.elementor-23343 .elementor-element.elementor-element-85f39f6 > .elementor-widget-container{margin:0% 0% 0% 0%;}.elementor-23343 .elementor-element.elementor-element-85f39f6.elementor-element{--align-self:flex-start;}.elementor-23343 .elementor-element.elementor-element-85f39f6{text-align:start;}.elementor-23343 .elementor-element.elementor-element-85f39f6 .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-size:34px;font-weight:700;color:#3D4459;}.elementor-23343 .elementor-element.elementor-element-1852e44{text-align:start;}.elementor-23343 .elementor-element.elementor-element-1852e44 .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-size:16px;font-weight:300;line-height:21px;color:var( --e-global-color-2fd7cd1 );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-23343 .elementor-element.elementor-element-eb66ed6.elementor-element{--align-self:flex-end;}.elementor-23343 .elementor-element.elementor-element-eb66ed6{text-align:end;font-family:"Rubik", Sans-serif;font-weight:300;font-style:italic;color:var( --e-global-color-2fd7cd1 );}@media(min-width:768px){.elementor-23343 .elementor-element.elementor-element-e4785de{--width:70%;}}@media(max-width:1024px) and (min-width:768px){.elementor-23343 .elementor-element.elementor-element-d1af384{--width:1600px;}.elementor-23343 .elementor-element.elementor-element-e4785de{--width:716px;}}@media(max-width:1024px){.elementor-23343 .elementor-element.elementor-element-d1af384{--padding-top:0%;--padding-bottom:0%;--padding-left:8%;--padding-right:8%;}.elementor-23343 .elementor-element.elementor-element-e4785de{--padding-top:6%;--padding-bottom:6%;--padding-left:10%;--padding-right:10%;}.elementor-23343 .elementor-element.elementor-element-85f39f6{text-align:start;}.elementor-23343 .elementor-element.elementor-element-1852e44{text-align:start;}.elementor-23343 .elementor-element.elementor-element-1852e44 .elementor-heading-title{font-size:16px;}}@media(max-width:767px){.elementor-23343 .elementor-element.elementor-element-d1af384{--min-height:100vh;--padding-top:67px;--padding-bottom:0px;--padding-left:25px;--padding-right:025px;}.elementor-23343 .elementor-element.elementor-element-d1af384:not(.elementor-motion-effects-element-type-background), .elementor-23343 .elementor-element.elementor-element-d1af384 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-size:cover;}.elementor-23343 .elementor-element.elementor-element-e4785de{--padding-top:15%;--padding-bottom:15%;--padding-left:10%;--padding-right:10%;}.elementor-23343 .elementor-element.elementor-element-9b51bc6{width:auto;max-width:auto;top:21px;}body:not(.rtl) .elementor-23343 .elementor-element.elementor-element-9b51bc6{right:21px;}body.rtl .elementor-23343 .elementor-element.elementor-element-9b51bc6{left:21px;}.elementor-23343 .elementor-element.elementor-element-9b51bc6 .elementor-icon{font-size:12px;}.elementor-23343 .elementor-element.elementor-element-9b51bc6 .elementor-icon svg{height:12px;}.elementor-23343 .elementor-element.elementor-element-85f39f6 > .elementor-widget-container{margin:-3px -5px 0px -5px;}.elementor-23343 .elementor-element.elementor-element-85f39f6{text-align:center;}.elementor-23343 .elementor-element.elementor-element-1852e44{text-align:center;}.elementor-23343 .elementor-element.elementor-element-1852e44 .elementor-heading-title{font-size:16px;}body.elementor-page-23343{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}}/* Start custom CSS for shortcode, class: .elementor-element-1ca5d58 *//* ========================================================= TECHSAVI CUSTOM QUOTE FORM COMPLETE COMPACT VERSION ========================================================= */ #nf-form-1-cont, #nf-form-1_1-cont { --ts-navy: #11162f; --ts-green: #28cbd3; --ts-purple: #7838d1; --ts-text: #343747; --ts-muted: #858897; --ts-border: #dfe3eb; } /* ========================================================= HIDE DEFAULT NINJA FORM ELEMENTS ========================================================= */ #nf-form-1-cont .nf-form-title, #nf-form-1_1-cont .nf-form-title, #nf-form-1-cont .nf-form-fields-required, #nf-form-1_1-cont .nf-form-fields-required { display: none !important; } /* ========================================================= MAIN GRID ========================================================= */ #nf-form-1-cont nf-fields-wrap, #nf-form-1_1-cont nf-fields-wrap { display: grid !important; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 14px; row-gap: 10px; } #nf-form-1-cont nf-fields-wrap > nf-field, #nf-form-1_1-cont nf-fields-wrap > nf-field { display: block !important; min-width: 0; } #nf-form-1-cont .nf-field-container, #nf-form-1_1-cont .nf-field-container { margin-bottom: 0 !important; } /* ========================================================= ROW 1 FIRST NAME / COMPANY / EMAIL / PHONE ========================================================= */ #nf-form-1-cont nf-field:nth-child(1), #nf-form-1-cont nf-field:nth-child(2), #nf-form-1-cont nf-field:nth-child(3), #nf-form-1-cont nf-field:nth-child(4), #nf-form-1_1-cont nf-field:nth-child(1), #nf-form-1_1-cont nf-field:nth-child(2), #nf-form-1_1-cont nf-field:nth-child(3), #nf-form-1_1-cont nf-field:nth-child(4) { grid-column: span 3; } /* ========================================================= ROW 2 WHAT DO YOU NEED? ========================================================= */ #nf-form-1-cont nf-field:nth-child(5), #nf-form-1_1-cont nf-field:nth-child(5) { grid-column: 1 / -1; } /* ========================================================= ROW 3 QUANTITY / CONDITION / DEADLINE ========================================================= */ #nf-form-1-cont nf-field:nth-child(6), #nf-form-1-cont nf-field:nth-child(7), #nf-form-1-cont nf-field:nth-child(8), #nf-form-1_1-cont nf-field:nth-child(6), #nf-form-1_1-cont nf-field:nth-child(7), #nf-form-1_1-cont nf-field:nth-child(8) { grid-column: span 4; } /* ========================================================= ROW 4 COUNTRY / ZIP ========================================================= */ #nf-form-1-cont nf-field:nth-child(9), #nf-form-1_1-cont nf-field:nth-child(9) { grid-column: span 8; } #nf-form-1-cont nf-field:nth-child(10), #nf-form-1_1-cont nf-field:nth-child(10) { grid-column: span 4; } /* ========================================================= FINAL ROW REQUIREMENTS + REQUEST QUOTE BUTTON ========================================================= */ /* Requirements = 8 columns */ #nf-form-1-cont nf-field:nth-child(11), #nf-form-1_1-cont nf-field:nth-child(11) { grid-column: span 8; } /* Submit = 4 columns */ #nf-form-1-cont nf-field:nth-child(12), #nf-form-1_1-cont nf-field:nth-child(12) { grid-column: span 4; align-self: end; } /* ========================================================= LABELS ========================================================= */ #nf-form-1-cont .nf-field-label, #nf-form-1_1-cont .nf-field-label { margin-bottom: 4px !important; } #nf-form-1-cont .nf-field-label label, #nf-form-1_1-cont .nf-field-label label, #nf-label-field-16_1, #nf-label-field-16, #nf-label-field-14_1, #nf-label-field-14 { font-family: inherit !important; font-size: 12px !important; font-weight: 600 !important; line-height: 1.25 !important; color: var(--ts-text) !important; margin: 0 !important; } #nf-form-1-cont .ninja-forms-req-symbol, #nf-form-1_1-cont .ninja-forms-req-symbol { color: var(--ts-purple) !important; } /* ========================================================= NORMAL INPUTS ========================================================= */ #nf-form-1-cont input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), #nf-form-1_1-cont input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), #nf-form-1-cont textarea, #nf-form-1_1-cont textarea { width: 100% !important; box-sizing: border-box; min-height: 42px; padding: 9px 13px !important; background: #ffffff !important; border: 1px solid var(--ts-border) !important; border-radius: 7px !important; box-shadow: none !important; outline: none !important; color: var(--ts-text) !important; font-family: inherit !important; font-size: 13px !important; transition: border-color .2s ease, box-shadow .2s ease; } /* Focus */ #nf-form-1-cont input:not([type="checkbox"]):not([type="radio"]):focus, #nf-form-1_1-cont input:not([type="checkbox"]):not([type="radio"]):focus, #nf-form-1-cont textarea:focus, #nf-form-1_1-cont textarea:focus { border-color: var(--ts-green) !important; box-shadow: 0 0 0 3px rgba(40,203,211,.12) !important; } /* ========================================================= REQUIREMENTS TEXTAREA SHORT AND COMPACT ========================================================= */ #nf-field-3_1, #nf-field-3 { height: 58px !important; min-height: 58px !important; resize: none !important; } /* ========================================================= MODERN DROPDOWNS ========================================================= */ #nf-form-1-cont select.ninja-forms-field, #nf-form-1_1-cont select.ninja-forms-field { -webkit-appearance: none !important; appearance: none !important; width: 100% !important; height: 42px !important; padding: 0 42px 0 13px !important; background-color: #ffffff !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%237838d1' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 14px center !important; background-size: 11px auto !important; border: 1px solid var(--ts-border) !important; border-radius: 7px !important; color: var(--ts-text) !important; font-family: inherit !important; font-size: 13px !important; font-weight: 400 !important; outline: none !important; box-shadow: none !important; cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease; } #nf-form-1-cont select.ninja-forms-field:hover, #nf-form-1_1-cont select.ninja-forms-field:hover { border-color: #bfc3cf !important; } #nf-form-1-cont select.ninja-forms-field:focus, #nf-form-1_1-cont select.ninja-forms-field:focus { border-color: var(--ts-green) !important; box-shadow: 0 0 0 3px rgba(40,203,211,.12) !important; } /* ========================================================= PRODUCT CHECKBOXES ========================================================= */ #nf-field-16_1-container ul, #nf-field-16-container ul { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 7px 18px !important; margin: 3px 0 0 !important; padding: 0 !important; list-style: none !important; } #nf-field-16_1-container li, #nf-field-16-container li { display: inline-flex !important; align-items: center !important; width: auto !important; margin: 0 !important; padding: 0 !important; } #nf-field-16_1-container input[type="checkbox"], #nf-field-16-container input[type="checkbox"] { width: 15px !important; height: 15px !important; margin: 0 5px 0 0 !important; flex: 0 0 15px; accent-color: var(--ts-green); cursor: pointer; } #nf-field-16_1-container li label, #nf-field-16-container li label { display: inline-flex !important; align-items: center !important; margin: 0 !important; padding: 0 !important; line-height: 15px !important; font-size: 12px !important; font-weight: 400 !important; color: var(--ts-text) !important; cursor: pointer; } /* ========================================================= SUBMIT BUTTON SAME ROW AS REQUIREMENTS ========================================================= */ #nf-field-4_1-container, #nf-field-4-container { height: 100%; } #nf-field-4_1-container .nf-field-element, #nf-field-4-container .nf-field-element { display: flex !important; align-items: flex-end !important; height: 100%; } /* Button */ #nf-field-4_1, #nf-field-4 { width: 100% !important; height: 58px !important; padding: 0 24px !important; background: var(--ts-green) !important; color: #ffffff !important; border: none !important; border-radius: 999px !important; font-family: inherit !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .2px; cursor: pointer; box-shadow: none !important; transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease; } /* Hover */ #nf-field-4_1:hover, #nf-field-4:hover { background: var(--ts-purple) !important; color: #ffffff !important; transform: translateY(-1px); box-shadow: 0 8px 22px rgba(120,56,209,.20) !important; } /* ========================================================= ERROR MESSAGES ========================================================= */ #nf-form-1-cont .nf-error .ninja-forms-field, #nf-form-1_1-cont .nf-error .ninja-forms-field { border-color: #d94a4a !important; } #nf-form-1-cont .nf-error-msg, #nf-form-1-cont .ninja-forms-field-error, #nf-form-1_1-cont .nf-error-msg, #nf-form-1_1-cont .ninja-forms-field-error { color: #c63c3c !important; font-size: 11px !important; } /* ========================================================= TABLET ========================================================= */ @media (max-width: 1024px) { #nf-form-1-cont nf-field:nth-child(1), #nf-form-1-cont nf-field:nth-child(2), #nf-form-1-cont nf-field:nth-child(3), #nf-form-1-cont nf-field:nth-child(4), #nf-form-1_1-cont nf-field:nth-child(1), #nf-form-1_1-cont nf-field:nth-child(2), #nf-form-1_1-cont nf-field:nth-child(3), #nf-form-1_1-cont nf-field:nth-child(4) { grid-column: span 6; } #nf-form-1-cont nf-field:nth-child(6), #nf-form-1-cont nf-field:nth-child(7), #nf-form-1-cont nf-field:nth-child(8), #nf-form-1_1-cont nf-field:nth-child(6), #nf-form-1_1-cont nf-field:nth-child(7), #nf-form-1_1-cont nf-field:nth-child(8) { grid-column: span 6; } #nf-form-1-cont nf-field:nth-child(9), #nf-form-1-cont nf-field:nth-child(10), #nf-form-1_1-cont nf-field:nth-child(9), #nf-form-1_1-cont nf-field:nth-child(10) { grid-column: span 6; } /* Requirements and button remain side by side */ #nf-form-1-cont nf-field:nth-child(11), #nf-form-1_1-cont nf-field:nth-child(11) { grid-column: span 8; } #nf-form-1-cont nf-field:nth-child(12), #nf-form-1_1-cont nf-field:nth-child(12) { grid-column: span 4; } } /* ========================================================= MOBILE ========================================================= */ @media (max-width: 767px) { #nf-form-1-cont nf-fields-wrap, #nf-form-1_1-cont nf-fields-wrap { display: block !important; } #nf-form-1-cont .nf-field-container, #nf-form-1_1-cont .nf-field-container { margin-bottom: 11px !important; } #nf-field-16_1-container ul, #nf-field-16-container ul { display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; } /* Stack button underneath textarea on mobile */ #nf-field-4_1, #nf-field-4 { width: 100% !important; height: 48px !important; } }/* End custom CSS */