:root {
     --blue: rgba(60, 114, 184, 1);
     --blue-50: rgba(60, 114, 184, .5);
     --orange: rgba(245, 152, 68, 1);
     --orange-gradient: linear-gradient(top, #f59a47 0%, #e8760e 100%);
     --orange-gradient: -webkit-linear-gradient(top, #f59a47 0%, #e8760e 100%);
     --font: 'Teko', sans-serif;
 }
 
 *,
 *:before,
 *:after {
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
     margin: 0;
     padding: 0;
     -webkit-appearance: none;
     outline: none
 }
 
 #wuc_application {
     font-family: var(--font);
     font-size: 1rem;
     line-height: 1.5;
     width: 100vw;
     height: 100vh;
     background-image: url(../img/DuPont-wuc-background-header.gif);
     background-repeat: no-repeat;
     background-attachment: fixed;
 }
  #wuc_application .print {
     display: none;
  }
 #wuc_application a:not([class]) {
     color: var(--orange);
 }
 
 #wuc_application a {
     text-decoration: none;
 }
 
 #wuc_application .button {
     font-size: 1.5rem;
     font-weight: 900;
     display: block;
     padding: .5rem 2rem;
     text-align: center;
     text-decoration: none;
     letter-spacing: .05rem;
     text-transform: uppercase;
     color: #fff;
     background: var(--orange-gradient);
 }
 
 #wuc_application .button:active {
     background: var(--blue);
 }
 
 #wuc_application .flex {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
 }
 
 #wuc_application .wrapper {
     overflow: none;
     -webkit-overflow-scrolling: touch;
 }
 
 #wuc_application .center {
     text-align: center;
 }
 
 #wuc_application img {
     max-width: 100%;
     height: auto;
 }
 
 #wuc_application .pad5 {
     padding: 5rem;
 }
 
 #wuc_application .flex.column {
     flex-direction: column;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
 }
 
 #wuc_application header > div {
     padding: 1rem 2rem;
 }
 
 #wuc_application #home header div:first-child {
     padding: 1rem 5rem;
 }
 
 #wuc_application #home header div:last-child {
     padding: .5rem 5.5rem;
 }
 
 #wuc_application #home article {
     height: 55%;
 }
 
 #wuc_application #home article > a {
     position: relative;
     top: calc(60px / 2);
     display: block;
     width: 60px;
     height: 60px;
     margin: 0 auto;
     -webkit-transform: rotate(45deg);
     transform: rotate(45deg);
     text-decoration: none;
     outline: 6px solid white;
     background: var(--orange-gradient);
 }
 
 #wuc_application #home article > a > span {
     font-size: 1.7rem;
     font-weight: 900;
     position: absolute;
     top: 50%;
     left: 50%;
     display: block;
     -webkit-transform: translate(-50%, -50%) rotate(-45deg);
     transform: translate(-50%, -50%) rotate(-45deg);
     text-align: center;
     letter-spacing: -.05rem;
     text-transform: uppercase;
     color: white;
 }
 
 #wuc_application #form header {
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }
 
 #wuc_application #form header > div:first-child {
     -webkit-box-ordinal-group: 3;
     -ms-flex-order: 2;
     order: 2;
 }
 
 #wuc_application #form header > div:last-child {
     -webkit-box-ordinal-group: 2;
     -ms-flex-order: 1;
     order: 1;
 }
 
 #wuc_application #form article {
     padding: 1rem 2rem;
     padding-bottom: 15rem;
 }
 
 #wuc_application #form article .flex:not(.no-select) {
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
 }
 
 #wuc_application #form label {
     position: relative;
     font-size: 1.2rem;
     width: 100%;
     padding-right: 2rem;
     color: var(--blue);
 }
 
 #wuc_application #form label p {
     position: absolute;
     background-color: rgba(245, 152, 68, 1);
     color: #fff;
     z-index: 2;
     border: 1px solid rgba(60, 114, 184, 1);
     padding: 1rem;
     line-height: 1.2;
     font-weight: 400;
 }
 
 #wuc_application #form label p h4 {
     font-weight: 400;
     border-bottom: 1px solid white;
     text-transform: uppercase;
     margin: .5rem 0px;
 }
 
 #wuc_application #form label svg {
     -webkit-transform: translate(5px, 5px);
     transform: translate(5px, 5px);
     cursor: pointer;
 }
 
 body.desktop #wuc_application #form label {
     cursor: pointer
 }
 
 #wuc_application #form .postcode {
     width: 50%;
 }
 
 #wuc_application #form .postcode > label {
     padding: .2rem;
     padding-right: 0;
     color: #fff;
     background-color: var(--blue);
 }
 
 #wuc_application #form .postcode > div {
     width: 100%;
 }
 
 #wuc_application #form .postcode span {
     display: block;
     padding: .2rem;
     color: #fff;
 }
 
 #wuc_application #form .postcode span.pc-searching {
     background-color: #344358;
 }
 
 #wuc_application #form .postcode span.pc-valid {
     background-color: var(--orange);
 }
 
 #wuc_application #form .postcode span.pc-valid-but {
     background-color: #b22a00;
 }
 
 #wuc_application #form .postcode span.pc-invalid {
     background-color: red;
 }
 
 #wuc_application #form .postcode span.pc-invalid:after {
     font-size: 1.2rem;
     content: 'Postcode NOT FOUND!';
 }
 
 #wuc_application #form label.error {
     color: red !important;
 }
 
 #wuc_application #form div:not(.postcode) > label.valid {
     color: var(--orange)!important;
 }
 
 #wuc_application #form input,
 #wuc_application #form select {
     font-size: 16px;
     position: relative;
     overflow: hidden;
     width: 100%;
     padding: .5rem;
     border: solid 1px var(--blue);
     border-radius: 0;
     background-color: #fff !important;
 }
 
 #wuc_application #form input[name=input_postcode] {
     text-transform: uppercase;
     width: 50%;
 }
 
 #wuc_application #form .inputs {
     position: relative;
     width: 98%;
 }
 
 #wuc_application #form .inputs > div {
     position: relative;
     margin-bottom: .4rem;
 }
 
 #wuc_application #form .inputs > div:not(.no-select):after {
     position: absolute;
     top: 50%;
     right: .3rem;
     display: block;
     width: 25px;
     height: 25px;
     content: '';
     -webkit-transform: translateY(2px);
     transform: translateY(2px);
     background-image: url(../img/DuPont-wuc-icon-select.svg);
     background-repeat: no-repeat;
     background-size: cover;
 }
 
 #wuc_application #form .inputs > div .icon {
     position: absolute;
     top: 50%;
     right: 0;
     -webkit-transform: scale(.6) translate(60px, -15px);
     transform: scale(.6) translate(60px, -15px);
 }
 
 #wuc_application #form .button-result {
     width: 100%;
     margin: 1rem 0;
 }
 
 #wuc_application #form_result {
     -webkit-box-pack: start;
     -ms-flex-pack: start;
     justify-content: flex-start;
 }
 
 #wuc_application #form_result .popup {
     margin: 3rem;
 }
 
 #wuc_application #form_result .popup > div {
     font-size: 1.5rem;
     font-weight: 600;
     line-height: 1.2;
     padding: 2rem;
     color: #fff;
     background-color: var(--blue);
 }
 body.desktop #wuc_application #form_result .popup > div {
     padding: 2rem 25%;
 }
 
 #wuc_application #form_result .popup a {
     width: 100%;
 }
  #wuc_application #form_result .popup strong {
    color: rgba(245, 152, 68, 1);
 }
 

 #wuc_application .developer-block {
     padding: 1rem 2rem;
     color: #fff;
     color: #fff;
     background-color: rgba(0, 0, 0, 1);
     -webkit-column-count: 2;
     column-count: 2;
     -webkit-column-gap: 25px;
     column-gap: 25px;
     -webkit-column-rule: 1px solid #454545;
     column-rule: 1px solid #454545;
 }
 
 #wuc_application .developer-block ol {
     margin: 0;
 }
 
 #wuc_application .developer-block li {
     line-height: 1.7rem;
 }
 
 #wuc_application .developer-block li > span {
     font-size: 1.3rem;
 }
 
 #wuc_application .gold {
     color: gold;
 }
 
 #wuc_application .content {
     line-height: 1.3;
     margin-top: 2rem;
     padding: 2rem 3rem;
     padding-bottom: 8rem;
     padding-bottom: 15rem;
 }
 
 body:not(.desktop) #wuc_application .content p {
     font-size: 1.2rem;
     margin-bottom: 1rem;
 }
 
 body:not(.desktop) #wuc_application .content.map {
     margin-bottom: 0;
     position: relative;
     margin-top: -1.5rem;
 }
 
 body:not(.desktop) #wuc_application .content.map img {
     width: 90%;
 }
 
 body:not(.desktop) #wuc_application .content.map p:last-child {
     position: relative;
     margin-top: -1rem;
     font-size: .95rem;
 }
 
 #wuc_application .content button {
     font-size: .9rem;
     font-weight: bold;
     position: relative;
     width: 100%;
     margin-bottom: .2rem;
     padding: 1rem .5rem;
     text-align: left;
     text-indent: 1.5rem;
     color: #fff;
     background-color: var(--blue);
 }
 
 #wuc_application .content button.active {
     background-color: var(--blue-50);
 }
 
 #wuc_application .content button:before {
     font-size: 1.5rem;
     position: absolute;
     top: 10px;
     left: -15px;
     display: block;
     width: 10px;
     height: 10px;
     content: '+';
     color: #fff;
 }
 
 #wuc_application .content button.active:before {
     left: -10px;
     content: '-';
 }
 
 #wuc_application .content .text-block {
     padding: 1rem;
 }
 
 #wuc_application .content .text-block strong {
     display: block;
     margin-bottom: .5rem;
 }
 
 #wuc_application .content .text-block span {
     display: inline-block;
     color: var(--orange);
 }
 
 #wuc_application .popup-close {
     font-size: 1.5rem;
     font-weight: 900;
     position: fixed;
     top: .5rem;
     right: .5rem;
     display: inline-block;
     padding: .15rem 1rem;
     text-align: center;
     text-decoration: none;
     text-transform: uppercase;
     color: #fff;
     background: var(--orange-gradient);
     z-index: 999;
 }
 
 #wuc_application footer#partner {
     bottom: 60px;
     background-color: #fff;
 }
 
 #wuc_application footer#partner div.flex {
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }
 
 #wuc_application footer#partner div.flex > div {
     text-align: center;
     -webkit-box-flex: 1;
     -ms-flex: 1;
     flex: 1;
 }
 
 #wuc_application footer#partner img[src*=-ce] {
     width: calc(100px / 2);
 }
 
 #wuc_application footer#partner img[src*=-bba] {
     width: calc(170px / 2);
 }
 
 #wuc_application footer#partner img[src*=-nsai] {
     width: calc(180px / 2);
 }
 
 #wuc_application footer {
     position: fixed;
     z-index: 99;
     bottom: -5px;
     left: 0;
     width: 100%;
     border-top: 5px solid var(--blue);
     -webkit-box-pack: end;
     -ms-flex-pack: end;
     justify-content: flex-end;
 }
 
 #wuc_application footer a {
     font-size: 110%;
     text-transform: uppercase;
 }
 
 #wuc_application footer > div {
     height: 100%;
     padding: 1rem 0;
     text-align: center;
     background-color: #fff;
     -webkit-box-flex: 1px;
     -ms-flex: 1px;
     flex: 1px;
 }
 
 #wuc_application footer:not(#partner) > div:active,
 #wuc_application footer:not(#partner) > div:hover,
 #wuc_application footer:not(#partner) > div.active {
     background: var(--orange-gradient);
     -webkit-box-shadow: none !important;
     box-shadow: none !important;
 }
 
 #wuc_application footer > div:active a,
 #wuc_application footer > div:hover a,
 #wuc_application footer > div.active a {
     color: #fff;
 }
 
 #wuc_application footer > div:active svg *,
 #wuc_application footer > div:hover svg *,
 #wuc_application footer > div.active svg * {
     fill: #fff;
 }
 
 #wuc_application footer > div:not(:first-child) {
     -webkit-box-shadow: inset 10px 0 20px #d4e0ef;
     box-shadow: inset 10px 0 20px #d4e0ef;
 }
 
 #wuc_application footer svg {
     -webkit-transform: scale(.7) translateY(10px);
     transform: scale(.7) translateY(10px);
 }
 
 #wuc_application .copyright {
     text-align: center;
     padding: 1rem 0px;
 }
 /*DESKTOP VERSION*/
 
 body.desktop * {
     outline: none;
 }
 
 body.desktop a img {
     border: none
 }
 
 body.desktop {
     background-image: url(../img/DuPont-wuc-background-header.gif);
     background-repeat: repeat-x;
 }
 
 body.desktop p {
     font-family: 'Roboto';
     font-size: 1rem !important;
     line-height: 1.5;
 }
 
 body.desktop #wuc_application {
     width: 100%;
     max-width: 990px;
     margin: 0 auto;
     background-image: none;
     height: auto;
     font-family: 'Teko', sans-serif;
 }
 
 body.desktop #wuc_application a:not([class]) {
     color: rgba(245, 152, 68, 1);
 }
 
 body.desktop #wuc_application footer:not(#partner) > div:hover,
 body.desktop #wuc_application footer:not(#partner) > div.active {
     background: rgba(245, 152, 68, 1);
     background: -webkit-gradient(linear, left top, left bottom, from(#f59a47), to(#e8760e));
     background: linear-gradient(top, #f59a47 0%, #e8760e 100%);
 }
 
 body.desktop #wuc_application footer:not(#partner) > div:hover a,
 body.desktop #wuc_application footer:not(#partner) > div.active a {
     color: #fff;
 }
 
 body.desktop #wuc_application p.copyright {
     line-height: 1;
     font-size: .65em;
     opacity: .75;
     padding-bottom: 3rem;
 }
 
 body.desktop #wuc_application p.welcome {
     position: absolute;
     bottom: 15%;
     left: 15%;
     width: 90%;
     padding: 2rem;
     z-index: 999;
     font-size: 3rem !important;
     line-height: 1;
     -webkit-transform: translate(-10%, 35%);
     transform: translate(-10%, 35%);
     color: #fff;
     font-family: 'Teko', sans-serif;
     background-color: rgba(60, 114, 184, .85);
     border: 2px solid #fff;
     text-align: center;
 }
 
 body.desktop #wuc_application p a:hover {
     text-decoration: underline;
 }
 
 body.desktop #wuc_application p.press-enter {
     text-align: right;
     color: red;
     font-weight: bold;
 }
 
 body.desktop button {
     cursor: pointer;
 }
 
 body.desktop section {
     height: auto !important;
 }
 
 body.desktop #wuc_application #home {
     height: auto !important;
 }
 
 body.desktop #wuc_application #home article>div {
     height: 600px;
     overflow: hidden;
     position: relative;
 }
 
 body.desktop #wuc_application #home article img {
     -webkit-transform: translateY(0);
     transform: translateY(0);
     width: 100%;
     height: auto;
 }
 
 body.desktop #wuc_application header {
     width: 100%;
     height: 220px;
     margin: 0 auto;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
 }
 
 body.desktop #wuc_application header img {
     width: 100%;
     max-width: 220px;
     height: auto;
 }
 
 body.desktop #wuc_application header div {
     padding: 0 !important;
     -webkit-box-flex: 1 !important;
     -ms-flex: 1 !important;
     flex: 1 !important;
     width: 50%;
 }
 
 body.desktop #wuc_application header div:first-child {
     text-align: right !important;
     -webkit-box-ordinal-group: 3;
     -ms-flex-order: 2;
     order: 2;
 }
 
 body.desktop #wuc_application header div:last-child {
     text-align: left !important;
     -webkit-box-ordinal-group: 2;
     -ms-flex-order: 1;
     order: 1;
 }
 
 body.desktop #wuc_application #form .postcode span.pc-searching>img {
     width: 40px;
 }
 
 body.desktop #wuc_application #form article {
     padding-bottom: 5rem !important;
 }
 
 body.desktop #wuc_application #form .postcode > label,
 body.desktop #wuc_application .content button,
 body.desktop #wuc_application #form_result .popup > div {
     background-color: rgba(60, 114, 184, 1);
 }
 
 body.desktop #wuc_application #form .postcode span.pc-valid {
     background-color: rgba(245, 152, 68, 1);
 }
 
 body.desktop #wuc_application .button {
     background-color: rgba(245, 152, 68, 1);
     background: -webkit-gradient(linear, left top, left bottom, from(top), color-stop(0%, #f59a47), to(#e8760e));
     background: linear-gradient(top, #f59a47 0%, #e8760e 100%);
 }
 
 body.desktop #wuc_application footer {
     position: relative;
     bottom: 0;
     height: 60px;
 }
 
 body.desktop #wuc_application footer {
     border-top: 1px solid rgba(60, 114, 184, 1);
     border-bottom: 1px solid rgba(60, 114, 184, 1);
 }
 
 body.desktop #wuc_application footer#partner {
     margin: 0 auto;
     height: auto;
     border: 1px solid rgba(60, 114, 184, 1);
 }
 
 body.desktop #wuc_application footer > div a,
 body.desktop #wuc_application footer svg * {
     -webkit-transition: all 600ms ease;
     transition: all 600ms ease
 }
 
 body.desktop #wuc_application footer > div:hover svg * {
     fill: white
 }
 
 body.desktop #wuc_application footer > div {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     cursor: pointer;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
 }
 
 body.desktop #wuc_application footer a {
     font-size: 1.5rem;
 }
 
 body.desktop #wuc_application footer svg {
     -webkit-transform: scale(.8) translateX(-20px);
     transform: scale(.8) translateX(-20px);
 }
 
 body.desktop img.uk-map,
 body.desktop #partner img {
     width: auto !important;
     max-width: 400px !important;
     top: 0 !important;
 }
 
 body.desktop #wuc_application #form_result .popup {
     margin-bottom: 10rem;
     text-align: center;
 }
 
 #wuc_application #form_result .popup > div {
     font-weight: 400;
     text-transform: uppercase;
 }