@font-face {
    font-family: 'Ambit-Bold';
    src: url(/fonts/Ambit-Bold.woff);
}

@font-face {
    font-family: 'Ambit-Light';
    src: url(/fonts/Ambit-Light.woff);
}

@font-face {
    font-family: 'Ambit-Regular';
    src: url(/fonts/Ambit-Regular.woff);
}

#new-loading-img {
    position: fixed;
    height: 100%
}

#acceptpage-header {
    background-color: #F5F6F8;
    padding: 20px;
}

#show_loading_screen {
    background: rgba(1000,1000,1000,0.75) !important;
    width: 100%;
    height: 100%;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(/Images/Acceptpage/dropdown-icon.png) white no-repeat 98.5% !important;
    background: url(/Images/Acceptpage/dropdown-icon.png) white no-repeat calc(100% - 20px) !important;
}

.text-center {
    text-align: center;
}

body {
    font-family: Ambit-Regular;
}

.bold {
    font-weight: 800;
}

h1 {
    font-family: 'Ambit-Regular' !important;
}

#loading-img {
    content: url('/Images/Acceptpage/Loading-new.svg') !important;
}

#greetings-wrapper {
    padding: 20px;
    margin-bottom: 40px !important;
}

.data-container {
    padding: 20px;
    background-color: #FFFFFF;
}


#accept-conditions {
    background-color: #FFFFFF;
    border-style: solid;
    border-color: #F5F5F5;
    border-width: 1px;
    box-shadow: 2px 1px 60px 1px #F5F5F5;
    border-radius: 20px;
}

#personal-data, #order-data, #gradient-overlay {
    border-radius: 20px;
    padding: 50px;
}

#personal-data-header, #order-data-header, #conditions-header {
    font-size: 40px;
    font-weight: normal !important;
    margin-top: 20px;
    margin-bottom: 60px;
}

#conditions-header {
    margin-top: 50px;
    margin-bottom: 0;
    margin-left: 15px;
}

.ribbonAccordion {
    width: 48px;
    height: 48px;
    float: right;
}

@media only screen and (max-device-width: 700px) {
    #personal-data, #order-data {
        border-style: none;
        box-shadow: none;
        padding: 0;
    }

    .data-container {
        padding: 0;
    }

    #foldout-section-wrapper {
        border-top-right-radius: 0 !important;
        border-top-left-radius: 0 !important;
        margin-top: 15px;
    }

    .social-media {
        padding-top: 10px;
        font-size: 10px;
    }
}

#foldout-section {
    border-style: none !important;
    box-shadow: none !important;
}


#el-productspecification-section {
    padding: 0 30px 30px 15px;
    background-color: #FFFFFF !important;
    border-style: none;
    box-shadow: none;
    font-size: 14px;
}

@media only screen and (min-device-width: 701px) {
    .fsize72 {
        font-size: 72px;
    }

    .social-media {
        padding-top: 10px;
        margin: 5px;
        font-size: 10px;
    }
}

#personal-data, #order-data {
    box-shadow: 2px 2px 60px 1px #f5f5f5 !important;
}

.entry {
    margin: 10px 0 5px 0;
    padding: 0;
}

#accept_agreement {
    background-color: #00C800;
    color: #000000;
    font-weight: bold;
    padding: 10px;
    border-radius: 10px;
}

.green-divider {
    color: #00C800;
    margin: 5px;
    font-size: 10px;
}

#address-line > div > a {
    color: #000000;
}

#address-line > div {
    margin-bottom: 5px;
}

#footer {
    text-align: center;
}

.textfield {
    color: black !important;
}



/*-----*/

*, ::after, ::before {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: currentColor
}

[type=password]:not(.placeholder-visible)::placeholder, [type=text]:not(.placeholder-visible)::placeholder, select:not(.placeholder-visible)::placeholder, textarea:not(.placeholder-visible)::placeholder {
    color: transparent
}

[type=password]::placeholder, [type=text]::placeholder, select::placeholder, textarea::placeholder {
    --tw-text-opacity: 1;
    color: rgba(204,208,212,var(--tw-text-opacity))
}

[type=password]:focus, [type=text]:focus, select:focus, textarea:focus {
    box-shadow: none;
    --tw-border-opacity: 1;
    border-color: rgba(0,200,0,var(--tw-border-opacity))
}

[type=password], [type=text], select, textarea {
    appearance: none;
    font-size: 18px;
    outline: 2px solid transparent;
    outline-offset: 2px;
    --tw-text-opacity: 1;
    font-weight: normal;
}

.textarea-wrapper, [type=password], [type=text], select {
    --tw-border-opacity: 1;
    border-color: rgba(204,208,212,var(--tw-border-opacity));
    border-width: 2px;
    transition-property: background-color,border-color,color,fill,stroke;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 150ms;
    caret-color: #00c800
}

.textarea-wrapper, [type=password], [type=text], select {
    width: 100%;
    line-height: 1;
    border-radius: 10px;
    padding: 27px 20px 7px;
    position: relative;
}

.bg-theme-dark .textarea-wrapper, .bg-theme-dark [type=password], .bg-theme-dark [type=text], .bg-theme-dark select {
    --tw-border-opacity: 1;
    border-color: rgba(255,255,255,var(--tw-border-opacity))
}

.input-validation-error .textarea-wrapper, .input-validation-error [type=password], .input-validation-error [type=text], .input-validation-error select {
    --tw-border-opacity: 1;
    border-color: rgba(255,101,113,var(--tw-border-opacity));
    caret-color: #ff6571
}

.input-validation-error .floating-placeholder {
    --tw-text-opacity: 1;
    color: black;
}

select {
    padding: 29px 20px 9px;
    position: relative;
    background-repeat: no-repeat;
    background-position: right 15px top 13px;
    background-image: url(/assets/images/input/select-arrow.png)
}

    select:not(.is-dirty) {
        padding: 20px 20px 17px
    }

        select:not(.is-dirty) ~ .floating-placeholder {
            display: none
        }

.textarea-wrapper textarea {
    border: none;
    width: 100%;
    padding: 0 2px;
    resize: none
}

.floating-placeholder {
    --tw-text-opacity: 1;
    color: black;
    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 150ms;
    position: absolute;
    top: 19px;
    left: 21px;
    pointer-events: none;
    transform-origin: top left;
    padding-left: 0;
    font-weight: normal;
}

[type=password].is-dirty ~ .floating-placeholder, [type=password]:focus ~ .floating-placeholder, [type=text].is-dirty ~ .floating-placeholder, [type=text]:focus ~ .floating-placeholder, select.is-dirty ~ .floating-placeholder, select:focus ~ .floating-placeholder, textarea.is-dirty ~ .floating-placeholder, textarea:focus ~ .floating-placeholder {
    transform: translateY(-8px) scale(.8)
}

.ribbonAccordion .on:hover .icon {
    --tw-bg-opacity: 1;
    background-color: rgba(0,0,0,var(--tw-bg-opacity));
    --tw-border-opacity: 1;
    border-color: rgba(0,0,0,var(--tw-border-opacity));
    --tw-text-opacity: 1;
    color: rgba(255,255,255,var(--tw-text-opacity))
}

.ribbonAccordion .on .icon {
    --tw-bg-opacity: 1;
    background-color: rgba(0,200,0,var(--tw-bg-opacity));
    --tw-border-opacity: 1;
    border-color: rgba(0,200,0,var(--tw-border-opacity));
    --tw-rotate: 45deg;
}

.autocomplete-container {
    position: relative;
    width: 100%;
    max-width: 30em
}

    .autocomplete-container input {
        width: 100%;
        box-sizing: border-box
    }

.dawa-autocomplete-suggestions {
    margin: .3em 0 0 0;
    padding: 0;
    text-align: left;
    border-radius: .3125em;
    background: #fcfcfc;
    box-shadow: 0 .0625em .15625em rgba(0,0,0,.15);
    position: absolute;
    left: 0;
    right: 0;
    z-index: 9999;
    overflow-y: auto;
    box-sizing: border-box
}

#el-accept, #accept-agreement, #accept-egenspot {
    background-color: #F5F5F5;
    border-radius: 20px;
    padding: 20px;
    margin: 10px 0;
}

#AcceptChangeOfSupply, #AcceptAgreement {
    margin: 0;
}

#accept-section {
    padding-top: 0 !important;
}

.dawa-autocomplete-suggestions .dawa-autocomplete-suggestion {
    margin: 0;
    list-style: none;
    cursor: pointer;
    padding: .4em .6em;
    color: #333;
    border: .0625em solid #ddd;
    border-bottom-width: 0
}

    .dawa-autocomplete-suggestions .dawa-autocomplete-suggestion:first-child {
        border-top-left-radius: inherit;
        border-top-right-radius: inherit
    }

    .dawa-autocomplete-suggestions .dawa-autocomplete-suggestion:last-child {
        border-bottom-left-radius: inherit;
        border-bottom-right-radius: inherit;
        border-bottom-width: .0625em
    }

    .dawa-autocomplete-suggestions .dawa-autocomplete-suggestion.dawa-selected, .dawa-autocomplete-suggestions .dawa-autocomplete-suggestion:hover {
        background: #f0f0f0
    }

.bg-theme {
    --tw-bg-opacity: 1;
    background-color: rgba(0,200,0,var(--tw-bg-opacity))
}

.bg-theme-dark {
    --tw-bg-opacity: 1;
    background-color: rgba(0,70,40,var(--tw-bg-opacity))
}

.bg-white {
    --tw-bg-opacity: 1;
    background-color: rgba(255,255,255,var(--tw-bg-opacity))
}

.bg-black {
    --tw-bg-opacity: 1;
    background-color: rgba(0,0,0,var(--tw-bg-opacity))
}

.bg-gray-light {
    --tw-bg-opacity: 1;
    background-color: rgba(245,246,248,var(--tw-bg-opacity))
}

.bg-current {
    background-color: currentColor !important
}

.hover\:bg-black:hover {
    --tw-bg-opacity: 1;
    background-color: rgba(0,0,0,var(--tw-bg-opacity))
}

.bg-opacity-50 {
    --tw-bg-opacity: 0.5
}

.bg-opacity-75 {
    --tw-bg-opacity: 0.75
}

.bg-center {
    background-position: center
}

.bg-cover {
    background-size: cover
}

.border-theme {
    --tw-border-opacity: 1;
    border-color: rgba(0,200,0,var(--tw-border-opacity))
}

.border-white {
    --tw-border-opacity: 1;
    border-color: rgba(255,255,255,var(--tw-border-opacity))
}

.border-gray {
    --tw-border-opacity: 1;
    border-color: rgba(204,208,212,var(--tw-border-opacity))
}

.border-gray-light {
    --tw-border-opacity: 1;
    border-color: rgba(245,246,248,var(--tw-border-opacity))
}

.group:hover .group-hover\:border-theme {
    --tw-border-opacity: 1;
    border-color: rgba(0,200,0,var(--tw-border-opacity))
}

.rounded-none {
    border-radius: 0
}

.rounded {
    border-radius: 12px
}

.rounded-lg {
    border-radius: 20px
}

.rounded-full {
    border-radius: 9999px
}

.rounded-1\/2 {
    border-radius: 50%
}

.border-solid {
    border-style: solid
}

.border-0 {
    border-width: 0
}

.border-2 {
    border-width: 2px
}

.border-4 {
    border-width: 4px
}

.border {
    border-width: 1px
}

.border-t-2 {
    border-top-width: 2px
}

.border-b-2 {
    border-bottom-width: 2px
}

.border-t {
    border-top-width: 1px
}

.border-b {
    border-bottom-width: 1px
}

.cursor-pointer {
    cursor: pointer
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.inline {
    display: inline
}

.flex {
    display: flex
}

.table {
    display: table
}

.table-caption {
    display: table-caption
}

.table-cell {
    display: table-cell
}

.grid {
    display: grid
}

.contents {
    display: contents
}

.hidden {
    display: none
}

.flex-row-reverse {
    flex-direction: row-reverse
}

.flex-col {
    flex-direction: column
}

.flex-wrap {
    flex-wrap: wrap
}

.items-center {
    align-items: center
}

.content-center {
    align-content: center
}

.justify-end {
    justify-content: flex-end
}

.justify-center {
    justify-content: center
}

.flex-auto {
    flex: 1 1 auto
}

.flex-grow {
    flex-grow: 1
}

.flex-shrink-0 {
    flex-shrink: 0
}

.font-bold {
    font-weight: 700
}

.h-2 {
    height: 2px
}

.h-7 {
    height: 7px
}

.h-16 {
    height: 16px
}

.h-20 {
    height: 20px
}

.h-21 {
    height: 21px
}

.h-22 {
    height: 22px
}

.h-24 {
    height: 24px
}

.h-25 {
    height: 25px
}

.h-30 {
    height: 30px
}

.h-48 {
    height: 48px
}

.h-80 {
    height: 80px
}

.h-130 {
    height: 130px
}

.h-full {
    height: 100%
}

.h-screen {
    height: 100vh
}

.text-sm {
    font-size: 16px
}

.text-base {
    font-size: 18px
}

.text-md {
    font-size: 22px
}

.text-lg {
    font-size: 24px
}

.text-2xl {
    font-size: 42px
}

.m-10 {
    margin: 10px
}

.-m-10 {
    margin: -10px
}

.mx-2 {
    margin-left: 2px;
    margin-right: 2px
}

.my-10 {
    margin-top: 10px;
    margin-bottom: 10px
}

.mx-10 {
    margin-left: 10px;
    margin-right: 10px
}

.mx-auto {
    margin-left: auto;
    margin-right: auto
}

.-mx-9 {
    margin-left: -9px;
    margin-right: -9px
}

.-my-10 {
    margin-top: -10px;
    margin-bottom: -10px
}

.-mx-10 {
    margin-left: -10px;
    margin-right: -10px
}

.-mx-15 {
    margin-left: -15px;
    margin-right: -15px
}

.mt-2 {
    margin-top: 2px
}

.mr-2 {
    margin-right: 2px
}

.mt-6 {
    margin-top: 6px
}

.mt-10 {
    margin-top: 10px
}

.mr-10 {
    margin-right: 10px
}

.mb-10 {
    margin-bottom: 10px
}

.ml-10 {
    margin-left: 10px
}

.mb-13 {
    margin-bottom: 13px
}

.mb-14 {
    margin-bottom: 14px
}

.ml-14 {
    margin-left: 14px
}

.mt-15 {
    margin-top: 15px
}

.mb-16 {
    margin-bottom: 16px
}

.mt-20 {
    margin-top: 20px
}

.mr-20 {
    margin-right: 20px
}

.mb-20 {
    margin-bottom: 20px
}

.ml-20 {
    margin-left: 20px
}

.mb-22 {
    margin-bottom: 22px
}

.mt-24 {
    margin-top: 24px
}

.mt-25 {
    margin-top: 25px
}

.mb-25 {
    margin-bottom: 25px
}

.mt-30 {
    margin-top: 30px
}

.mr-30 {
    margin-right: 30px
}

.mb-30 {
    margin-bottom: 30px
}

.mt-35 {
    margin-top: 35px
}

.mt-40 {
    margin-top: 40px
}

.mb-40 {
    margin-bottom: 40px
}

.ml-40 {
    margin-left: 40px
}

.mt-55 {
    margin-top: 55px
}

.mt-60 {
    margin-top: 60px
}

.mt-80 {
    margin-top: 80px
}

.mb-80 {
    margin-bottom: 80px
}

.mt-auto {
    margin-top: auto
}

.mr-auto {
    margin-right: auto
}

.ml-auto {
    margin-left: auto
}

.-mb-0 {
    margin-bottom: 0
}

.-mt-1 {
    margin-top: -1px
}

.-ml-1 {
    margin-left: -1px
}

.-mt-3 {
    margin-top: -3px
}

.-mt-7 {
    margin-top: -7px
}

.-ml-7 {
    margin-left: -7px
}

.-mt-8 {
    margin-top: -8px
}

.-mb-8 {
    margin-bottom: -8px
}

.-ml-8 {
    margin-left: -8px
}

.-mb-15 {
    margin-bottom: -15px
}

.-mb-20 {
    margin-bottom: -20px
}

.-mt-24 {
    margin-top: -24px
}

.-mt-30 {
    margin-top: -30px
}

.-mb-30 {
    margin-bottom: -30px
}

.-ml-30 {
    margin-left: -30px
}

.-mb-40 {
    margin-bottom: -40px
}

.-mb-80 {
    margin-bottom: -80px
}

.max-w-2\/12 {
    max-width: 16.666667%
}

.min-h-400 {
    min-height: 400px
}

.min-h-screen {
    min-height: 100vh
}

.min-w-200 {
    min-width: 200px
}

.opacity-30 {
    opacity: .3
}

.overflow-hidden {
    overflow: hidden
}

.overflow-y-auto {
    overflow-y: auto
}

.overflow-y-hidden {
    overflow-y: hidden
}

.p-0 {
    padding: 0
}

.p-10 {
    padding: 10px
}

.p-20 {
    padding: 20px
}

.p-30 {
    padding: 30px
}

.p-40 {
    padding: 40px
}

.p-60 {
    padding: 60px
}

.px-9 {
    padding-left: 9px;
    padding-right: 9px
}

.px-15 {
    padding-left: 15px;
    padding-right: 15px
}

.py-20 {
    padding-top: 20px;
    padding-bottom: 20px
}

.py-30 {
    padding-top: 30px;
    padding-bottom: 30px
}

.px-30 {
    padding-left: 30px;
    padding-right: 30px
}

.py-40 {
    padding-top: 40px;
    padding-bottom: 40px
}

.px-40 {
    padding-left: 40px;
    padding-right: 40px
}

.py-60 {
    padding-top: 60px;
    padding-bottom: 60px
}

.pt-0 {
    padding-top: 0
}

.pl-0 {
    padding-left: 0
}

.pb-6 {
    padding-bottom: 6px
}

.pb-8 {
    padding-bottom: 8px
}

.pt-15 {
    padding-top: 15px
}

.pb-15 {
    padding-bottom: 15px
}

.pb-25 {
    padding-bottom: 25px
}

.pt-30 {
    padding-top: 30px
}

.pb-30 {
    padding-bottom: 30px
}

.pl-35 {
    padding-left: 35px
}

.pb-40 {
    padding-bottom: 40px
}

.pt-55 {
    padding-top: 55px
}

.pb-60 {
    padding-bottom: 60px
}

.pr-65 {
    padding-right: 65px
}

.pr-70 {
    padding-right: 70px
}

.pt-80 {
    padding-top: 80px
}

.pb-80 {
    padding-bottom: 80px
}

.pb-160 {
    padding-bottom: 160px
}

.pb-square {
    padding-bottom: 100%
}

.pb-wide {
    padding-bottom: 50%
}

.static {
    position: static
}

.fixed {
    position: fixed
}

.absolute {
    position: absolute
}

.relative {
    position: relative
}

.inset-0 {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

.-inset-10 {
    top: -10px;
    right: -10px;
    bottom: -10px;
    left: -10px
}

.inset-x-0 {
    right: 0;
    left: 0
}

.top-0 {
    top: 0
}

.right-0 {
    right: 0
}

.bottom-0 {
    bottom: 0
}

.left-0 {
    left: 0
}

.top-1 {
    top: 1px
}

.right-15 {
    right: 15px
}

.bottom-25 {
    bottom: 25px
}

.-top-1 {
    top: -1px
}

.-bottom-4 {
    bottom: -4px
}

.-top-5 {
    top: -5px
}

.-left-70 {
    left: -70px
}

.-top-220 {
    top: -220px
}

.top-1\/2 {
    top: 50%
}

.right-1\/2 {
    right: 50%
}

.left-1\/2 {
    left: 50%
}

.resize {
    resize: both
}

* {
    --tw-shadow: 0 0 #0000
}

.shadow {
    --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1),0 1px 2px 0 rgba(0, 0, 0, 0.06);
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)
}

.shadow-2xl {
    --tw-shadow: 0 20px 80px -15px rgba(0, 0, 0, 0.15);
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)
}

.group:hover .group-hover\:shadow-lg {
    --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),0 4px 6px -2px rgba(0, 0, 0, 0.05);
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)
}

.text-left {
    text-align: left
}

.text-center {
    text-align: center
}

.text-right {
    text-align: right
}

.text-theme {
    --tw-text-opacity: 1;
    color: rgba(0,200,0,var(--tw-text-opacity))
}

.text-white {
    --tw-text-opacity: 1;
    color: rgba(255,255,255,var(--tw-text-opacity))
}

.text-black {
    --tw-text-opacity: 1;
    color: rgba(0,0,0,var(--tw-text-opacity))
}

.text-gray {
    --tw-text-opacity: 1;
    color: rgba(204,208,212,var(--tw-text-opacity))
}

.hover\:text-white:hover {
    --tw-text-opacity: 1;
    color: rgba(255,255,255,var(--tw-text-opacity))
}

.truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.italic {
    font-style: italic
}

.uppercase {
    text-transform: uppercase
}

.lowercase {
    text-transform: lowercase
}

.visible {
    visibility: visible
}

.invisible {
    visibility: hidden
}

.whitespace-nowrap {
    white-space: nowrap
}

.w-2 {
    width: 2px
}

.w-7 {
    width: 7px
}

.w-16 {
    width: 16px
}

.w-21 {
    width: 21px
}

.w-22 {
    width: 22px
}

.w-30 {
    width: 30px
}

.w-48 {
    width: 48px
}

.w-1\/2 {
    width: 50%
}

.w-1\/3 {
    width: 33.333333%
}

.w-1\/5 {
    width: 20%
}

.w-full {
    width: 100%
}

.z-20 {
    z-index: 20
}

.z-30 {
    z-index: 30
}

.transform {
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-rotate-90 {
    --tw-rotate: -90deg
}

.translate-x-full {
    --tw-translate-x: 100%
}

.translate-y-9 {
    --tw-translate-y: 9px
}

.-translate-y-9 {
    --tw-translate-y: -9px
}

.transition {
    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 150ms
}

.transition-shadow {
    transition-property: box-shadow;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 150ms
}

.transition-transform {
    transition-property: transform;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 150ms
}

#approved-content, #error-content {
    line-height: 2em;
    padding: 20px;
    border-style: solid;
    border-color: #F5F5F5;
    border-style: solid;
    border-width: 1px;
    box-shadow: 2px 1px 2px 1px #F5F5F5;
    font-weight: 600;
    border-radius: 20px;
    font-family: 'Ambit-Regular' !important;
    font-weight: normal;
}

.white {
    background-color: #ffffff;
}

.no-padding {
    padding: 0;
}

ul {
}

    ul li::marker {
        color: #00C800;
        font-size: 25px;
        font-weight: bold;
    }


.el-header-margin {
    margin-top: 60px;
    margin-bottom: 50px;
}