@import url('/assets/css/reset.css');




/* -------------------------------------------------------------------------------
			Default Layout: 1200px. 		
------------------------------------------------------------------------------- */
html, body {width: 100%; font-size: 18px; line-height: 150%; font-family: "mundial-narrow-variable", sans-serif; font-weight: inherit; font-variation-settings: "wght" 400; color: #0A0A0A; -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; -webkit-text-size-adjust: 100%; height: 100%;}


h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {display: block; clear: both; font-family: "mundial-narrow-variable", sans-serif; font-weight: inherit; font-variation-settings: "wght" 600; font-style: normal; margin: 0 0 15px 0; z-index: 10; line-height: 125%; letter-spacing: -0.015em;}
h1, .h1 {font-size: 45px;}
h2, .h2 {font-size: 35px;}
h3, .h3 {font-size: 30px;}
h4, .h4 {font-size: 25px;}
h5, .h5 {font-size: 20px;}
h6, .h6 {font-size: 18px;}


.viewport {display: none;}
.viewport:after {content: 'Full Desktop'; color: #FFFFFF; position: fixed; bottom: 15px; right: 15px; background: red; z-index: 999; padding: 2px 15px; font-size: 8px;}


button {border: 0; outline: none; cursor: pointer; text-decoration: none; font-family: "mundial-narrow-variable", sans-serif; font-weight: inherit; font-variation-settings: "wght" 600; color: #0A0A0A; background: none; padding: 0;}
button:disabled, .button.disabled {background: #F7F7F7!important; color: #C2C2C2; cursor: default; -moz-animation: none!important; -o-animation: none!important; animation: none!important; opacity: 0.50;}
.button.disabled:after {position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 100;}
.button {position: relative; padding: 35px 50px; cursor: pointer; z-index: 50; text-align: center; font-family: "mundial-narrow-variable", sans-serif; font-weight: inherit; font-variation-settings: "wght" 600; display: inline-block; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; margin: 0; text-decoration: none; background: #09BC8A; color: #FFFFFF; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; font-size: 22px; overflow: hidden; min-height: 70px;}
.button.smaller {font-size: 20px; padding: 15px 35px; min-height: auto;}
.button.full {width: 100%;}
.button i,
.link i {margin: 0 0 0 5px;}
.button.reverse-icon i,
.link.reverse-icon i {margin: 0 5px 0 0;}


p, .p {margin: 0 0 15px 0; display: block; clear: both; width: 100%; z-index: 10;}
a {color: #0A0A0A;}
strong {font-weight: inherit; font-variation-settings: "wght" 600;}
img {-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
i {margin: 0 2.5px 0 0;}
hr {margin: 25px 0; display: block; clear: both; float: left; width: 100%;}
hr.margin-smaller {margin: 25px 0;}
svg {display: block; fill: #0A0A0A; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.text-color-green {color: #09BC8A!important;}
.text-color-yellow {color: #FFDA1F!important;}
.text-color-blue {color: #003287!important;}
.text-color-red {color: #C1292E!important;}
.text-color-black {color: #0A0A0A!important;}
.text-color-white {color: #FFFFFF!important;}
.text-size-massive,
.text-size-massive * {font-size: 75px!important; line-height: 100%;}
.text-size-regular,
.text-size-regular * {font-size: 18px!important; line-height: 150%;}
.text-size-smaller,
.text-size-smaller * {font-size: 16px!important; line-height: 150%;}
.text-size-smallest,
.text-size-smallest * {font-size: 13px!important; line-height: 150%;}
.text-size-pence,
.text-size-caveat {display: inline-block; vertical-align: middle; font-size: 85%!important; margin: 0 0 0 1px;}
.text-size-caveat,
.text-size-smaller .text-size-caveat {font-size: 40%!important; vertical-align: top; line-height: 125%;}
.text-align-center {text-align: center;}
.text-align-right {text-align: right;}
.text-transform-uppercase {text-transform: uppercase;}
.text-capitalise-first-letter {text-transform: capitalize;}
.text-sentence-case:first-letter {text-transform: uppercase;}
.text-email-address {word-break: break-all;}
.text-break-all {white-space: nowrap;}
.text-weight-400 {font-weight: inherit; font-variation-settings: "wght" 400;}
.text-weight-600 {font-weight: inherit; font-variation-settings: "wght" 600;}
.text-opaque {opacity: 0.65;}
.margin-50 {margin: 0 0 50px 0!important;}
.margin-35 {margin: 0 0 35px 0!important;}
.margin-25 {margin: 0 0 25px 0!important;}
.margin-20 {margin: 0 0 20px 0!important;}
.margin-15 {margin: 0 0 15px 0!important;}
.margin-10 {margin: 0 0 10px 0!important;}
.margin-5 {margin: 0 0 5px 0!important;}
.margin-left-5 {margin: 0 0 0 5px!important;}
.margin-none {margin: 0!important;}
.margin-top-5 {margin: 5px 0 0 0!important;}
.margin-top-10 {margin: 10px 0 0 0!important;}
.margin-top-15 {margin: 15px 0 0 0!important;}
.margin-top-25 {margin: 25px 0 0 0!important;}
.padding-none {padding: 0!important;}
.background-none {background: none!important;}
.background-black {background: #0A0A0A!important;}
.background-grey {background: #F7F7F7!important;}
.background-dark-grey {background: #EBEBEB!important;}
.background-darkest-grey {background: #E0E0E0!important;}
.background-light-grey {background: #FAFCFF!important;}
.background-white {background: #FFFFFF!important;}
.background-blue {background: #003287!important;}
.background-blue-gradient {background: rgb(0,52,136); background: linear-gradient(130deg, rgba(0,52,136,1) 0%, rgba(0,160,221,1) 100%);}
.background-opaque {background: rgba(255,255,255,.25);}
.background-light-blue {background: #EBF2FF!important;}
.background-green {background: #09BC8A!important;}
.background-light-green {background: rgba(9,188,138,.35)!important;}
.background-yellow {background: #FFDA1F!important;}
.background-light-yellow {background: #FFFCEB!important;}
.background-red {background: #C1292E!important;}
.background-light-red {background: #FBEEEF!important;}
.border-none {border: 0!important;}
.border-blue {border: 2px solid #003287;}
.border-yellow {border: 2px solid #FFDA1F;}
.border-green {border: 2px solid #09BC8A;}
.border-red {border: 2px solid #C1292E;}
.border-black {border: 2px solid #0A0A0A;}
.border-opaque {border: 2px solid rgba(255,255,255,.25);}
.border-bottom-yellow {border-bottom: 2px solid #FFDA1F;}
.border-bottom-dark-grey {border-bottom: 2px solid #EBEBEB;}
.border-bottom-darkest-grey {border-bottom: 2px solid #E0E0E0;}
.border-bottom-opaque {border-bottom: 2px solid rgba(255,255,255,.25);}
.link {cursor: pointer; text-decoration: underline; display: inline-block; width: auto;color: inherit;}
.clear {display: block; clear: both; letter-spacing: 0;}
.hide {display: none!important;}
.disable-scroll {overflow: hidden; height: 100%;}
.select-none {-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.overflow-hidden {overflow: hidden;}
.rounded-highlight {padding: 5px 25px!important; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; background: #FFDA1F; display: table; width: auto; color: #0A0A0A; font-weight: inherit; font-variation-settings: "wght" 600; font-style: normal;}
.padded-box {padding: 35px!important; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}
.padded-box:before {width: 35px; height: 35px; position: absolute; top: -20px; right: 35px; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; background: #FFFCEB; border: 2px solid #FFDA1F; content: '\f129'; font: var(--fa-font-sharp-solid); text-rendering: auto; -webkit-font-smoothing: antialiased; text-align: center; line-height: 32px; color: #FFDA1F;}


.a2a_button_whatsapp span {width: 100%; padding: 35px 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; font-family: "mundial-narrow-variable", sans-serif; font-weight: inherit; font-variation-settings: "wght" 600; color: #FFFFFF; display: inline-block; vertical-align: middle;}
.a2a_button_whatsapp span i {font-size: 150%; display: inline-block; vertical-align: middle; margin: 0 10px 0 0;}
.a2a_button_whatsapp svg {display: none;}
.a2a_buttons_other { clear: both;overflow: hidden;padding: 15px 0;}


.wrap {width: 85%; max-width: 900px; margin: 0 auto; z-index: 250; clear: both;}
.wrap.largest {max-width: 1300px;}
.wrap.larger {max-width: 1100px;}
.wrap:after {content: ''; display: block; clear: both;}


header {height: 90px; width: 100%; position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
header .wrap {height: 100%;}
header .logo {position: absolute; top: 50%; left: 0; margin: 0; padding: 0; transform: translateY(-50%);}
header .reviews-logo {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
header .secure-badge {position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
header nav {position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
header nav ul {clear: both; display: block;}
header nav ul li {float: left; margin: 0 0 0 25px;}
header nav ul li:first-of-type {margin: 0;}
header nav p {text-align: right;}


footer {display: block; clear: both; width: 100%; z-index: 300; border-top: 2px solid #EBEBEB;}
footer .logo {display: block; clear: both; margin: 0 0 15px 0;}
footer p {margin: 0 0 15px 0;}
footer nav {margin: 0;}
footer nav ul li {display: inline-block; margin: 0 5px 5px 0;}
footer nav ul li a {color: #FFFFFF;}


.logo {width: 135px; max-width: 100%; z-index: 15; display: inline-block; margin: 0 0 15px 0;}


.secure-badge {width: 65px; clear: both; display: block;}


.form-content {width: 100%; display: block; clear: both; float: left;}
.form-content .column {width: 55%; float: left; z-index: 600;}
.form-content .image {position: absolute; top: -100px; right: -175px; width: 60%; max-width: 550px; z-index: 150; clear: both; height: auto;}


.secure-box {padding: 10px 0 15px 0; display: block; clear: both; width: 100%;}
.secure-box .secure-badge,
.secure-box p {margin: 0; display: inline-block; vertical-align: middle; clear: none;}
.secure-box p {width: auto; padding: 0!important;}
.secure-box .secure-badge {margin: 0 10px 0 0;}


.copyright-image {display: block; clear: both; width: 100%; float: left;}
.copyright-image .logo,
.copyright-image p {margin: 0; display: inline-block; vertical-align: middle; clear: none;}
.copyright-image p {width: auto;}
.copyright-image .logo {margin: 0 10px 0 0; width: 115px;}


.reviews-logo {clear: both; max-width: 85px; width: 100%; display: inline-block; vertical-align: middle;}


.sra-logo {width: 150px; display: block; clear: both; z-index: 5; margin: 0; position: absolute; top: -125px; right: 0; border: 0; -webkit-box-shadow: 0px 0px 0px 2px #FFFFFF; -moz-box-shadow: 0px 0px 0px 2px #FFFFFF; box-shadow: 0px 0px 0px 2px #FFFFFF;}


.as-seen-on {display: block; clear: both; margin: 0 0 5px 0;}
.as-seen-on ul {font-size: 0;}
.as-seen-on ul li {display: inline-block; vertical-align: middle; margin: 0; width: auto; font-size: 18px;}
.as-seen-on ul li {padding: 0 7.5px;}
.as-seen-on ul li img {max-width: 135px; margin: 0 auto; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; -webkit-filter: grayscale(100%); filter: grayscale(100%); border: 2px solid #EBEBEB;}


table {border: 0; border-collapse: collapse; margin: 0 0 15px 0; padding: 0; width: 100%; table-layout: fixed;}
table tr {background: #FFFFFF; border: 0; border: 0;}
table tr:nth-of-type(2n) {background: #EBEBEB;}
table th, table td {padding: 10px 15px; text-align: left; font-weight: inherit; font-variation-settings: "wght" 400;}
table td {font-weight: inherit; font-variation-settings: "wght" 400;}
table th {background: #E0E0E0; font-family: "mundial-narrow-variable", sans-serif; font-weight: inherit; font-variation-settings: "wght" 600;}


.basic-list {margin: 0 0 15px 0; padding: 0 25px; float: left; width: 100%; clear: both;}
.basic-list ul, .basic-list ol {display: block; clear: both;}
.basic-list ul li, .basic-list ol li {display: block; clear: both; padding: 0 0 0 25px; word-wrap: break-word; word-break: break-word; margin: 0 0 5px 0;}
.basic-list ul li:last-of-type, .basic-list ol li:last-of-type {margin: 0;}
.basic-list ul li:before {position: absolute; top: 4px; left: 0; width: 12px; height: 12px; background: #09BC8A; content: ''; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%;} 
.basic-list.text-size-smaller ul li:before {top: 8px;} 
.basic-list.check-bullets ul li:before {content: '\f00c'; font: var(--fa-font-sharp-regular); text-rendering: auto; -webkit-font-smoothing: antialiased; background: none; color: #09BC8A; width: auto; height: auto; top: 2px; z-index: 2; background: none; font-size: inherit;}
.basic-list.check-bullets ul li:after {display: none;}
.basic-list.text-size-smallest.check-bullets ul li:before {top: 1px;}
.basic-list.text-size-smaller.check-bullets ul li:before {top: 1px;}
.basic-list ul ul, .basic-list ol ol {padding: 5px 0 5px 5px;}
.basic-list ul ul:last-of-type, .basic-list ol ol:last-of-type {padding: 5px 0 0 5px;}
.basic-list ul ul li:before {top: 13px; width: 8px; height: 8px;}
.basic-list ol {counter-reset: item;}
.basic-list ol li:before {position: absolute; top: 0; left: 0; content: counters(item, ".") " "; counter-increment: item; color: #003287; margin: 0;}
.basic-list ol ol li:before {font-size: 10px; line-height: 150%; top: 5px;}
.basic-list.inline {text-align: center;}
.basic-list.inline ul li {display: inline-block; margin: 0 5px;}
.basic-list.car-details {padding: 0;}
.basic-list.car-details ul li {padding: 0; margin: 0;}
.basic-list.car-details ul li:first-of-type {margin: 0 0 10px 0;}
.basic-list.car-details ul li:before {display: none;}
.basic-list.no-spacing {padding: 0;}
.start_journey {cursor: pointer;}


.loading-step,
.loading-page,
.loading-lenders {width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 550; display: none;}
.loading-step .overlay,
.loading-page .overlay {width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgb(0,52,136); background: linear-gradient(130deg, rgba(0,52,136,1) 0%, rgba(0,160,221,1) 100%); opacity: 0.860;}
.loading-step .loading-message {margin: 25px 0 0 0; display: block; clear: both; float: left; width: 100%;}
.loading-lenders {position: absolute;}


.loading-page {z-index: 499; display: block;}
.loading-page.invisible {display: none;}
.loading-page .overlay {opacity: 1;}
.loading-page .contents,
.loading-step .contents {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 5; width: 100%; padding: 0 30px;}
.loading-page .contents .logo {margin: 0 auto 25px auto; display: block;}


.loading-status.active * {opacity: 0;}
.loading-status.active .loading-lenders {display: block; opacity: 1;}
.loading-status.active .loading-lenders * {opacity: 1;}


.loader {width: 100px; aspect-ratio: 1; box-sizing: border-box; display: grid; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 5;}
.loader:before,
.loader:after { content: ""; grid-area: 1/1;  width: 35px; height: 35px; background: #FFDA1F; animation: l7 2s infinite; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px;}
.loader:after{animation-delay: -1s;}


.confetti-pop {width: 100%; height: 100vh; position: absolute; top: -50vh; left: 50%; transform: translateX(-50%); z-index: 1;}
.confetti-pop #thank_you_confetti {width: 100%; height: 100%;}


.flex-container {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; z-index: 40; clear: both; width: 100%;}
.flex-container .column {padding: 0; z-index: 40; flex-basis: calc(100% / 1);}
.flex-container.center-vertically {align-items: center;}
.flex-container.center-vertically .column {align-self: center;}
.flex-container.two-col .column {flex-basis: calc(100% / 2);}
.flex-container.three-col .column {flex-basis: calc(100% / 3);}
.flex-container .column .image,
.flex-container .column .content {padding: 0 15px 0 0;}


form {display: block; width: 100%; clear: both;}
form input, form select, form textarea, .select {width: 100%; float: left; outline: none; -webkit-appearance: none; appearance: none; padding: 0 25px; height: 55px; font-size: 18px; color: #0A0A0A; font-family: "mundial-narrow-variable", sans-serif; font-weight: inherit; font-variation-settings: "wght" 500; border: 2px solid #003287; background: #FFFFFF; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px;}
form input:disabled {-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; opacity: 0.50;}
form select, .select {background: none; padding: 0 35px 0 25px; background: #FFFFFF url(/assets/img/svg/select.svg) no-repeat right 25px top 50%; -webkit-background-size: 15px; -moz-background-size: 15px; -o-background-size: 15px; background-size: 15px; font-weight: inherit; font-variation-settings: "wght" 500;}
form select::-ms-expand {display: none;}
form label {display: block; clear: both; z-index: 10; float: left; width: 100%; padding: 0 0 0 20px;}
form .field-icon {display: block; clear: both; float: left; width: 100%;}
form .field-icon input {padding: 0 25px 0 55px;}
form .field-icon:before {position: absolute; top: 0; left: 25px; color: #003287; width: auto; content: '\f007'; font: var(--fa-font-sharp-solid); text-rendering: auto; -webkit-font-smoothing: antialiased; opacity: 0.50; text-align: center; line-height: 53px; font-size: 18px; z-index: 5; pointer-events: none;}
form .field-icon.date:before {content: '\f073';}
form .field-icon.address:before {content: '\f3c5';}
form .field-icon.company:before {content: '\f1ad';}
form .field-icon.reg-number:before {content: '\23';}
form .field-icon.email:before {content: '\40';}
form .field-icon.telephone:before {content: '\f095';}
form .field-icon.currency:before {content: '\f154';}
form .field-icon.car-make:before {content: '\f5e4';}
form .field-icon.car-model:before {content: '\f02a';}
form .field-icon.secure:after {position: absolute; top: 50%; right: 20px; width: 61px; height: 25px; transform: translateY(-50%); background: url(/assets/img/webp/secure-hybrid.webp) no-repeat center center; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; content: '';}
form .field, .field-outside {display: block; clear: both; margin: 0 0 15px 0; width: 100%; float: left;}
form .field-icon.secure input {padding: 0 95px 0 55px;}
form .field.two {margin: 0;}
form .field.two .field {width: calc(50% - 7.5px); clear: none;}
form .field.two .field:first-of-type {margin: 0 7.5px 15px 0;}
form .field.two .field:nth-of-type(2n) {margin: 0 0 15px 7.5px;}
form .field.three .field {width: calc(31.5% - 5px); clear: none; margin: 0 5px 0 0;}
form .field.three .field:nth-of-type(2) {margin: 0 5px 0 0;}
form .field.three .field:last-of-type {width: calc(37% - 5px);}
form .field.disabled:before {position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: ''; z-index: 55;}
form .field.disabled * {opacity: 0.75;}
form span.error {background: #C1292E; display: none; width: 100%; margin: 5px 0 0 0; clear: both; float: left; position: relative; font-weight: inherit; font-variation-settings: "wght" 400; color: #FFFFFF!important; padding: 5px 15px; z-index: 50; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size: 14px; line-height: 150%; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px;}
form span.error:before {content: '\f071'; font: var(--fa-font-sharp-solid); text-rendering: auto; -webkit-font-smoothing: antialiased; margin: 0 5px 0 0; color: #FFDA1F;}
form span.error:after, form label.error:after {display: block; clear: both; width: 100%; content: '';}
form .field-error input, form .field-error select {border: 2px solid #C1292E;}
form .field-error .field-icon:before {color: #C1292E;}
form .field-error input::placeholder {color: #C1292E;}
form .field-error ::placeholder {color: #C1292E;}
form .field-error :-ms-input-placeholder {color: #C1292E;}
form .field-error ::-ms-input-placeholder {color: #C1292E;}
form .suggested_fix_conditional {display: none;}
form .suggested_fix_apply:before {display: block; clear: both; width: 100%; content: '';}
form .suggested_fix_apply {margin: 5px 0; clear: both; background: #FFFFFF; color: #0A0A0A; border: 2px solid #0A0A0A; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; padding: 5px 10px; display: table; cursor: pointer;}
form .suggested_fix_apply:after {background: none!important;}
form input::placeholder {color: #0A0A0A; text-transform: none; opacity: 0.50;}
form ::placeholder {color: #0A0A0A; text-transform: none; opacity: 0.50;}
form :-ms-input-placeholder {color: #0A0A0A; text-transform: none; opacity: 0.50;}
form ::-ms-input-placeholder {color: #0A0A0A; text-transform: none; opacity: 0.50;}
form .step {display: none; width: 100%; margin: 0;}
form .step.start {display: block;}
form nav {display: block; clear: both; width: 100%; padding: 5px 0 0 0; float: left; z-index: 51;}
form nav.disabled:before {content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 100; opacity: 1;}
form nav.disabled .button {background: #0A0A0A; opacity: 0.50;}
form input:-webkit-autofill,
form input:-webkit-autofill:hover,
form input:-webkit-autofill:focus,
form input:-webkit-autofill:active {transition: background-color 5000s ease-in-out 0s; box-shadow: 0 0 0px 1000px #FFFFFF inset!important; -webkit-text-fill-color: #0A0A0A!important;}


section,
footer {padding: 75px 0;}
section.padding-less {padding: 50px 0;}
section.form {padding: 150px 0 100px 0; overflow: hidden;}


.progressed .progressed_hide {display: none;}


@media (hover: hover) and (pointer: fine) {

}





/* -------------------------------------------------------------------------------
			Desktop wide
------------------------------------------------------------------------------- */
@media only screen and (min-width: 1200px) and (max-width: 1800px) {
span.viewport:after {content: 'Wide Desktop'; background: green;}

}





/* -------------------------------------------------------------------------------
			Tablet landscape: 960px.
------------------------------------------------------------------------------- */
@media only screen and (min-width: 960px) and (max-width: 1200px) {
span.viewport:after {content: 'Tablet Landscape 960px - 1200px'; background: skyblue;}


.as-seen-on ul li:first-of-type {width: 100%; max-width: 100%; display: block; clear: both; margin: 0 0 15px 0;}
.as-seen-on ul li {width: 25%; max-width: 150px; padding: 0 15px 0 0;}
.as-seen-on ul li img {max-width: 100%;}


.form-content .column {width: 60%;}
.form-content .image {top: -65px; right: -18%; width: 55%;}


section.form {padding: 150px 0 75px 0;}
}





/* -------------------------------------------------------------------------------
			Tablet portrait: 640px.
------------------------------------------------------------------------------- */
@media only screen and (min-width: 768px) and (max-width: 960px) {
span.viewport:after {content: 'Tablet Portrait'; background: blue;}


.as-seen-on ul li:first-of-type {width: 100%; max-width: 100%; display: block; clear: both; margin: 0 0 15px 0;}
.as-seen-on ul li {width: 25%; max-width: 150px; padding: 0 15px 0 0;}
.as-seen-on ul li img {max-width: 100%;}


.form-content .column {width: 75%;}
.form-content .image {top: -35px; right: -25%; width: 50%; max-width: 300px;}


section.form {padding: 150px 0 50px 0;}
}





/* -------------------------------------------------------------------------------
			Wide mobile: 480px.
------------------------------------------------------------------------------- */
@media only screen and (min-width: 480px) and (max-width: 768px) {
span.viewport:after {content: 'Mobile Wide'; background: purple;}


html, body,
.button.smaller {font-size: 16px;}


h1, .h1 {font-size: 35px;}
h2, .h2 {font-size: 30px;}
h3, .h3 {font-size: 25px;}
h4, .h4 {font-size: 20px;}
h5, .h5 {font-size: 18px;}
h6, .h6 {font-size: 16px;}


.button {font-size: 18px; padding: 25px;}


.text-size-massive,
.text-size-massive * {font-size: 60px!important; line-height: 100%;}
.text-size-regular,
.text-size-regular * {font-size: 16px!important;}
.text-size-smaller,
.text-size-smaller * {font-size: 14px!important;}
.text-size-smallest,
.text-size-smallest * {font-size: 10px!important;}


.padded-box {padding: 25px!important;}
.padded-box:before {width: 25px; height: 25px; top: -15px; right: 25px; line-height: 22px; font-size: 12px;}


header {height: 75px;}
header .reviews-logo {left: auto; right: 80px; transform: translateY(-50%);}


.as-seen-on ul li:first-of-type {width: 100%; max-width: 100%; display: block; clear: both; margin: 0 0 10px 0;}
.as-seen-on ul li {width: 25%; max-width: 150px; padding: 0 5px 0 0;}
.as-seen-on ul li img {max-width: 100%;}


.copyright-image .logo {margin: 0 10px 0 0; width: 85px;}


.form-content .column {width: 100%;}
.form-content .image {position: relative; top: 0; right: 0; width: 75%; max-width: 250px; margin: 0 auto -100px auto;}


form input, form select, form textarea, .select {font-size: 16px;}
form .field-icon.secure:after {width: 45px; height: 18px; background: url(/assets/img/webp/secure-hybrid.webp) no-repeat center center; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain;}
form .field-icon.secure input {padding: 0 75px 0 55px;}


section,
footer {padding: 35px 0;}
section.padding-less {padding: 25px 0;}
section.form {padding: 100px 0 35px 0;}
}





/* -------------------------------------------------------------------------------
			Mobile: 320px.
------------------------------------------------------------------------------- */
@media only screen and (max-width: 480px) {
span.viewport:after {content: 'Mobile Portrait'; background: pink;}


html, body,
.button.smaller {font-size: 16px;}


h1, .h1 {font-size: 35px;}
h2, .h2 {font-size: 30px;}
h3, .h3 {font-size: 25px;}
h4, .h4 {font-size: 20px;}
h5, .h5 {font-size: 18px;}
h6, .h6 {font-size: 16px;}


.button {font-size: 18px; padding: 25px;}


.text-size-massive,
.text-size-massive * {font-size: 60px!important; line-height: 100%;}
.text-size-regular,
.text-size-regular * {font-size: 16px!important;}
.text-size-smaller,
.text-size-smaller * {font-size: 14px!important;}
.text-size-smallest,
.text-size-smallest * {font-size: 10px!important;}


.padded-box {padding: 25px!important;}
.padded-box:before {width: 25px; height: 25px; top: -15px; right: 25px; line-height: 22px; font-size: 12px;}


header {height: 75px;}
header .reviews-logo {left: auto; right: 80px; transform: translateY(-50%);}


.as-seen-on ul li:first-of-type {width: 100%; max-width: 100%; display: block; clear: both; margin: 0 0 10px 0;}
.as-seen-on ul li {width: 25%; max-width: 150px; padding: 0 5px 0 0;}
.as-seen-on ul li img {max-width: 100%;}


.copyright-image .logo {margin: 0 10px 0 0; width: 85px;}


.form-content .column {width: 100%;}
.form-content .image {position: relative; top: 0; right: 0; width: 75%; max-width: 250px; margin: 0 auto -100px auto;}


form input, form select, form textarea, .select {font-size: 16px;}
form .field-icon.secure:after {width: 45px; height: 18px; background: url(/assets/img/webp/secure-hybrid.webp) no-repeat center center; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain;}
form .field-icon.secure input {padding: 0 75px 0 55px;}


section,
footer {padding: 35px 0;}
section.padding-less {padding: 25px 0;}
section.form {padding: 100px 0 35px 0;}
}





/* -------------------------------------------------------------------------------
			Animations
------------------------------------------------------------------------------- */
.animation-in-out {-webkit-animation: animation-in-out 1.25s infinite alternate; animation: animation-in-out 1.25s infinite alternate;}
.animation-in-out-yellow {-webkit-animation: animation-in-out-yellow 1.25s infinite alternate; animation: animation-in-out-yellow 1.25s infinite alternate;}
.animation-in-out-blue {-webkit-animation: animation-in-out-blue 1.25s infinite alternate; animation: animation-in-out-blue 1.25s infinite alternate;}
.animation-green-flash-infinite {-webkit-animation: animation-green-flash 1s linear infinite normal; animation: animation-green-flash 1s linear infinite normal;}
.animation-yellow-flash-infinite {-webkit-animation: animation-yellow-flash 1s linear infinite normal; animation: animation-yellow-flash 1s linear infinite normal;}
.animation-blue-flash-infinite {-webkit-animation: animation-blue-flash 1s linear infinite normal; animation: animation-blue-flash 1s linear infinite normal;}
@keyframes animation-in-out {
	0% {
	  transform: scale(1.1);
	  -webkit-box-shadow: 0 0 0 0 rgba(9,188,138,1);
	}
	100% {
	  transform: scale(1);
	  -webkit-box-shadow: 0 0 0 15px rgba(9,188,138,0.15);
	}
}
@-webkit-keyframes animation-in-out {
	0% {
	  transform: scale(1.1);
	  -webkit-box-shadow: 0 0 0 0 rgba(9,188,138,1);
	}
	100% {
	  transform: scale(1);
	  -webkit-box-shadow: 0 0 0 15px rgba(9,188,138,0.15);
	}
}
@keyframes animation-in-out-yellow {
	0% {
	  transform: scale(1.1);
	  -webkit-box-shadow: 0 0 0 0 rgba(255,218,31,1);
	}
	100% {
	  transform: scale(1);
	  -webkit-box-shadow: 0 0 0 15px rgba(255,218,31,0.15);
	}
}
@-webkit-keyframes animation-in-out-yellow {
	0% {
	  transform: scale(1.1);
	  -webkit-box-shadow: 0 0 0 0 rgba(255,218,31,1);
	}
	100% {
	  transform: scale(1);
	  -webkit-box-shadow: 0 0 0 15px rgba(255,218,31,0.15);
	}
}
@keyframes animation-in-out-blue {
	0% {
	  transform: scale(1.1);
	  -webkit-box-shadow: 0 0 0 0 rgba(0,50,135,1);
	}
	100% {
	  transform: scale(1);
	  -webkit-box-shadow: 0 0 0 15px rgba(0,50,135,0.15);
	}
}
@-webkit-keyframes animation-in-out-blue {
	0% {
	  transform: scale(1.1);
	  -webkit-box-shadow: 0 0 0 0 rgba(0,50,135,1);
	}
	100% {
	  transform: scale(1);
	  -webkit-box-shadow: 0 0 0 15px rgba(0,50,135,0.15);
	}
}
@-webkit-keyframes animation-green-flash {
	0%   {-webkit-box-shadow: 0 0 0 0 rgba(9,188,138,1);}
	70%  {-webkit-box-shadow: 0 0 0 15px rgba(9,188,138,0);}
	100% {-webkit-box-shadow: 0 0 0 0 rgba(9,188,138,0);}
}
@keyframes animation-green-flash {
	0%   {-moz-box-shadow: 0 0 0 0 rgba(9,188,138,1); box-shadow: 0 0 0 0 rgba(9,188,138,1);}
	70%  {-moz-box-shadow: 0 0 0 15px rgba(9,188,138,0); box-shadow: 0 0 0 15px rgba(9,188,138,0);}
	100% {-moz-box-shadow: 0 0 0 0 rgba(9,188,138,0); box-shadow: 0 0 0 0 rgba(9,188,138,0);}
}
@-webkit-keyframes animation-yellow-flash {
	0%   {-webkit-box-shadow: 0 0 0 0 rgba(255,218,31,1);}
	70%  {-webkit-box-shadow: 0 0 0 15px rgba(255,218,31,0);}
	100% {-webkit-box-shadow: 0 0 0 0 rgba(255,218,31,0);}
}
@keyframes animation-yellow-flash {
	0%   {-moz-box-shadow: 0 0 0 0 rgba(255,218,31,1); box-shadow: 0 0 0 0 rgba(255,218,31,1);}
	70%  {-moz-box-shadow: 0 0 0 15px rgba(255,218,31,0); box-shadow: 0 0 0 15px rgba(255,218,31,0);}
	100% {-moz-box-shadow: 0 0 0 0 rgba(255,218,31,0); box-shadow: 0 0 0 0 rgba(255,218,31,0);}
}
@-webkit-keyframes animation-blue-flash {
	0%   {-webkit-box-shadow: 0 0 0 0 rgba(0,50,135,1);}
	70%  {-webkit-box-shadow: 0 0 0 15px rgba(0,50,135,0);}
	100% {-webkit-box-shadow: 0 0 0 0 rgba(0,50,135,0);}
}
@keyframes animation-blue-flash {
	0%   {-moz-box-shadow: 0 0 0 0 rgba(0,50,135,1); box-shadow: 0 0 0 0 rgba(0,50,135,1);}
	70%  {-moz-box-shadow: 0 0 0 15px rgba(0,50,135,0); box-shadow: 0 0 0 15px rgba(0,50,135,0);}
	100% {-moz-box-shadow: 0 0 0 0 rgba(0,50,135,0); box-shadow: 0 0 0 0 rgba(0,50,135,0);}
}
@-webkit-keyframes animation-whatsapp-flash {
	0%   {-webkit-box-shadow: 0 0 0 0 rgba(18,175,10,1);}
	70%  {-webkit-box-shadow: 0 0 0 15px rgba(18,175,10,0);}
	100% {-webkit-box-shadow: 0 0 0 0 rgba(18,175,10,0);}
}
@keyframes animation-whatsapp-flash {
	0%   {-moz-box-shadow: 0 0 0 0 rgba(18,175,10,1); box-shadow: 0 0 0 0 rgba(18,175,10,1);}
	70%  {-moz-box-shadow: 0 0 0 15px rgba(18,175,10,0); box-shadow: 0 0 0 15px rgba(18,175,10,0);}
	100% {-moz-box-shadow: 0 0 0 0 rgba(18,175,10,0); box-shadow: 0 0 0 0 rgba(18,175,10,0);}
}
@keyframes l7{
	0%   {transform: translate(   0,0)}
	25%  {transform: translate(100%,0)}
	50%  {transform: translate(100%,100%)}
	75%  {transform: translate(   0,100%)}
	100% {transform: translate(   0,0)}
}