﻿/*
   These are overrides for the new Engage designs 2019.

   These are to override/add to the styles in mainStyles.css.
*/

:root { 
   --hl-dark-green: #243508;
   --hl-dark-green-rgb: 36, 53, 8;

   --hl-light-green: #BFF355;
   --hl-light-green-rgb: 191, 243, 85;

   --hl-mid-green: #72942F;
   --hl-mid-green-rgb: 114, 148, 47;

   --hl-taupe: #E2D6CF;
   --hl-taupe-rgb: 226, 214, 207;

	--hl-taupe-shade-1: #cbc0ba;

   --hl-dark-taupe: #d3c0b6;

   --hl-light-taupe: #F0EBE8;
   --hl-light-taupe-rgb: 240, 235, 232;

   --hl-very-light-taupe: #FBF9F8;
   --hl-very-light-taupe-rgb: 251, 249, 248;

   --free-tool-colour: #E2D6CF;
   --premium-tool-color: #82C8BE;

   --input-background-colour: #F0EAE7;
   --input-text-colour: #000000;
}

/* #AFA7FB */

.hl-gradient { background-image: linear-gradient(200deg, #BFF355 0%, #82C8BE 100%); }
.hl-gradient-0 { background-image: linear-gradient(0deg, #BFF355 0%, #82C8BE 100%); }
.hl-gradient-45 { background-image: linear-gradient(45deg, #BFF355 0%, #82C8BE 100%); }
.hl-gradient-90 { background-image: linear-gradient(90deg, #BFF355 0%, #82C8BE 100%); }
.hl-gradient-180 { background-image: linear-gradient(180deg, #BFF355 0%, #82C8BE 100%); }
.hl-gradient-240 { background-image: linear-gradient(240deg, #BFF355 0%, #82C8BE 100%); }

.hl-gradient-purple { background-image: linear-gradient(200deg, #BFF355 0%, #AFA7FB 100%); }
.hl-gradient-purple-0 { background-image: linear-gradient(0deg, #BFF355 0%, #AFA7FB 100%); }
.hl-gradient-purple-20 { background-image: linear-gradient(20deg, #BFF355 0%, #AFA7FB 100%); }
.hl-gradient-purple-45 { background-image: linear-gradient(45deg, #BFF355 0%, #AFA7FB 100%); }
.hl-gradient-purple-140 { background-image: linear-gradient(140deg, #BFF355 0%, #AFA7FB 100%); }
.hl-gradient-purple-180 { background-image: linear-gradient(180deg, #BFF355 0%, #AFA7FB 100%); }
.hl-gradient-purple-240 { background-image: linear-gradient(240deg, #BFF355 0%, #AFA7FB 100%); }
.hl-gradient-purple-280 { background-image: linear-gradient(280deg, #BFF355 0%, #AFA7FB 100%); }


.font-m { font-family: berlingske_sans_roundmedium, sans-serif !important; }
.font-r { font-family: berlingske_sans_roundregular, sans-serif !important; }
.font-l { font-family: berlingske_sans_roundlight, sans-serif !important; }

.font-14 { font-size: var(--font-14)!important; }

.inherit-bg { background-color: inherit !important; }

/* This way will cause all text to be the colour specified here, overriding any defined colour. */

/*.premium-content { position: relative; background: -webkit-linear-gradient(#000000 75%, transparent 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } */

/* This way allows the colour of the text to be retained, but could cover clickable content. */

.premium-content { position: relative; }
.premium-content:after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255, 1)); }


textarea { font-family: berlingske_sans_roundregular, sans-serif; -webkit-appearance: none; border-radius: 0; }

audio { width: 100%; }

.recaptcha-container { margin: 20px 0; }
.recaptcha-container .g-recaptcha { display: inline-block; }
.recaptcha-container.error .g-recaptcha { border: 2px solid #cc0000; }


/* Background cover, center, no-repeat */
.bg-cov-cen-nrp { background-size: cover; background-position: center; background-repeat: no-repeat; }

/* Background contain, center, no-repeat */
.bg-con-cen-nrp { background-size: contain; background-position: center; background-repeat: no-repeat; }

.bg-con-ct-nrp { background-size: contain; background-position: center top; background-repeat: no-repeat; }

/* Background container, center-bottom, no-repeat */
.bg-cov-cb-nrp { background-size: cover; background-position: center bottom; background-repeat: no-repeat; }



.grid-6 { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; }
.grid-5 { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }

.input-form { margin: 20px 0; font-size: 0; }
.input-form .form-row { margin: 10px 0; font-size: 0; }
.input-form .form-row .form-cell { padding-right: 30px; }
.input-form .form-row .form-cell label { font-family: berlingske_sans_roundmedium, sans-serif; font-size: 16px; color: #333333; display: block; margin-bottom: 5px; }

.input-form .form-row .form-cell input[type=text],
.input-form .form-row .form-cell input[type=password],
.input-form .form-row .form-cell textarea { font-family: berlingske_sans_roundregular, sans-serif; font-size: 16px; border: 1px solid #bed600; background-color: #ffffff; padding: 8px; display: block; width: 100%; color: #000000; }

.input-form .form-row .form-cell.error input[type=text],
.input-form .form-row .form-cell.error input[type=password],
.input-form .form-row .form-cell.error textarea { border-color: #cc0000!important; }

.input-form .form-row .form-cell.error .form-field-error { font-size: 14px; margin-top: 4px; color: #cc0000; font-family: berlingske_sans_roundlight, sans-serif; line-height: 1.2em; }

.input-form .form-row .form-cell.error .form-field-error p,
.input-form .form-row .form-cell.error .form-field-error a { font-family: inherit; font-size: inherit; color: inherit; line-height: inherit; }

.input-form .form-row .form-cell.error .form-field-error p:last-child { margin-bottom: 0; }

.input-form.login-form-fields { margin-top: 0; }

.hidden { position: absolute; opacity: 0; visibility: hidden; display: none !important; font-size: 0 !important; padding: 0 !important; margin: 0 !important; }

body.c2019 { padding-top: 155px; background-color: #ffffff; }
body.c2019 form#form1 { background-color: inherit; }

body.c2019.no-header { padding-top: 0; }

body.c2019 section { background-color: inherit; position: relative; }

.c2019.no-scroll header { padding-right: 18px; }

.col-row .no-tb-padding { padding-top: 0; padding-bottom: 0; }

/*** Header Navigation ***/
.c2019 nav.main-nav { padding: 0; margin: 5px 0 5px 0; z-index: 9999;  position:relative; display: block;}
.c2019 nav.main-nav ul { list-style: none; display: inline-block; margin-top: 0px; }
.c2019 nav.main-nav ul li { padding: 3px 20px; color: inherit; border-left: 2px solid var(--hl-light-green); display: inline-block;}
.c2019 nav.main-nav ul li:nth-child(1) { padding-left: 0; border-left: 0; }
.c2019 nav.main-nav ul li a { text-decoration: none; font-family: Roobert, sans-serif; font-size: 16px; color: #565656; cursor: pointer; /*padding-bottom: 2px;*/ }
.c2019 nav.main-nav ul li.engage-premium a { /*font-family: berlingske_sans_roundmedium, sans-serif;*/ font-weight: 600; }
.c2019 nav.main-nav ul li a:hover { /*border-bottom: 2px solid #bed400; padding-bottom: 0;*/ color: #666666; }


.popup-modal { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.6); z-index: 100000; font-size: 0; padding: 0 20px; display: flex; align-items: center; justify-content: center; margin: 0; max-width: initial; width: 100%; max-height: initial; height: 100%; }

.popup-modal .form-container {width: 100%;}
.popup-modal .form-container.message-container { top: 30vh; }

/*.popup-modal .form-container .close-form { position: absolute; right: 5px; top: 6px; width: 30px; height: 30px; background-color: #4d5357; border-radius: 50%; background-image: url("/_assets/icon-cross-white.png"); background-size: 14px 14px; background-position: center; background-repeat: no-repeat; cursor: pointer; }*/
.popup-modal .form-container .close-form { position: absolute; right: 0px; top: 0px; width: 30px; height: 30px; background-color: var(--hl-light-green); border-radius: 0; background-image: url("/_assets/icon-close-dark.png"); background-size: 14px 14px; background-position: center; background-repeat: no-repeat; cursor: pointer; }


.popup-modal .form-container .form { margin: 0 auto; background-color: #ffffff; position: relative; font-size: 0; width: 100%; max-width: 700px; max-height: 98vh; overflow-y: auto; }
.popup-modal .form-container .form:not(.with-fixed-header) { padding: 25px 30px; }

.popup-modal .form-container .form .fixed-header { position: sticky; top: 0; width: 100%; padding: 25px 30px 10px 30px; background-color: #ffffff; z-index: 1; }
.popup-modal .form-container .form .content { position: relative; z-index: 0; padding: 0 30px 30px 30px; }

.popup-modal .form-container .form.login-form { width: 100%; max-width: 590px; max-height: 98vh; overflow-y: auto; overflow-x: hidden;}

.popup-modal .form-container #umLoginForm { margin-top: 18vh; }

.popup-modal .form-container .form h2 { font-family: Roobert; font-weight: 600; margin-bottom: 0.75em; }
.popup-modal .form-container .form p { font-family: Roobert; font-size: var(--font-16); font-weight: 400; color: #333333; }

.popup-modal .form-container .form input[type=text],
.popup-modal .form-container .form input[type=password],
.popup-modal .form-container .form textarea { border: 1px solid #bed600; padding: 10px; font-size: 16px; width: 100%; }

.popup-modal .form-container .form .popup-login-register { font-size: 0; }

.popup-modal .form-container .form .popup-login-register .left,
.popup-modal .form-container .form .popup-login-register .right { display: inline-block; width: 50%; box-sizing: border-box; padding-bottom: 0; position: relative; vertical-align: top; }

.popup-modal .form-container .form .popup-login-register .left { border-right: 1px solid #dddddd; padding-right: 20px; }
.popup-modal .form-container .form .popup-login-register .right { padding-left: 20px; }

.popup-modal .form-container .form .popup-login-register .button { padding-top: 20px; }

.popup-modal .form-container .form .popup-login-register p { font-size: 20px; }

.popup-modal .form-container .form .tool-access-granted p { font-size: 20px; }

.popup-modal .form-container .form:not(.with-fixed-header) .content { margin-bottom: 20px; }
.popup-modal .form-container .form .buttons { margin-top: 20px; }

.popup-modal .form-container .form .buttons input { margin-bottom: 0; }

.popup-modal .form-container .form .content .errors { margin-bottom: 20px; }
.popup-modal .form-container .form .content .errors ul { list-style: disc; color: #cc0000; margin-left: 20px; }
.popup-modal .form-container .form .content .errors li { font-size: 14px; line-height: 1.2em; color: #cc0000; margin-bottom: 5px; }

.popup-modal .form-container div.header { margin-bottom: 30px; display: flex; align-items: center; gap: 20px; font-size: min(6vw, 36px); font-weight: 400; color: var(--hl-dark-green); font-family: Tiempos; line-height: 1.1; }
.popup-modal .form-container div.header img { height: 100%; max-height: 80px; max-width: 100%; flex-shrink: 0; flex-grow: 0; }

.popup-modal .form-container .login-form  div.header img { max-height: 60px; }

.popup-modal .form-container div.footer { margin-top: 30px; font-size: 14px; text-align: center; }
.popup-modal .form-container div.footer p { font-size: inherit; }
.popup-modal .form-container div.footer a { font-weight: normal; text-decoration: none; border-bottom: 0;  }

.popup-modal .form-container div.footer > :last-child { margin-bottom: 0; }

.popup-modal .form-container div.footer .copyright { margin: 20px 0 0 0; color: #5482ab; display: flex; gap: 10px; justify-content: center; }

.popup-modal .form-container div.remember-me,
.popup-modal .form-container div.direct-access { font-size: 1rem; font-weight: 700; display: flex; justify-content: space-between; align-items: center; margin-top: 10px; gap: 20px; }

.popup-modal .form-container div.reset-password { margin-top: 20px; display: flex; flex-direction: column; gap: 16px; color: #4d5357; align-items: start; font-size: 1rem; }

.popup-modal .form-container a:not(.btn):not(.btn-2024) { color: #5482ab; text-decoration: none; font-weight: 700; }

.popup-modal .form-container a:not(.btn):not(.btn-2024):hover { text-decoration: underline; }

.popup-modal .form-container a.btn { font-weight: normal; }

.popup-modal .form-container .form-cell { padding-right: 0; }

.popup-modal .form-container .form-row { display: block; }

.popup-modal .popup-form { position: relative; margin: 0vh auto 0 auto; width: 80vw; max-width: 600px; background-color: #ffffff; }

.popup-modal .popup-form .close-popup { position: absolute; display: block; width: 34px; height: 34px; background-color: #6FA739; border-radius: 100%; top: -14px; right: -14px; z-index: 100; background-image: url("/_assets/icon-close-white.png"); background-size: 16px; background-position: center; background-repeat: no-repeat; cursor: pointer; }

.c2024 .popup-modal .popup-form .close-popup { right: 0; top: 0; border-radius: 0; background-color: var(--hl-light-green); background-image: url("/_assets/icon-close-dark.png"); }

.popup-modal .popup-form .wrapper {
   padding: 0 30px 0 30px; /*max-height: min(580px, 80vh);*/
   border-bottom: 30px solid #ffffff;
   max-height: 80vh;
   overflow-x: hidden;
   overflow-y: auto;
}

.popup-modal .popup-form.my-alert-form .wrapper div.switch-control {
   margin: 2px 0;
}

.popup-modal .popup-form .header {
   font-family: Roobert, sans-serif;
   position: sticky;
   top: 0;
   padding: 20px 0 20px 0;
   background-color: #ffffff;
   margin: 0;
}

.popup-modal .popup-form .header h2 { 
   font-family: inherit;
   font-weight: normal;
}

.popup-modal .popup-form .form {
}
.popup-modal .popup-form .form-field { margin-bottom: 20px; }
.popup-modal .popup-form .form-field label { font-size: 14px; color: #000000; display: block; margin-bottom: 5px; font-family: berlingske_sans_roundregular, sans-serif; }
.popup-modal .popup-form .form-field input[type=text] { border: 1px solid #333333; padding: 5px; font-size: 16px; width: 100%; }

.popup-modal .popup-form .form-field.error input[type=text],
.popup-modal .popup-form .form-field.error textarea { background-color: #ffeeee; }

.popup-modal .recaptcha-container.form-field.error .form-field-error { text-align: left; }

.popup-modal .popup-form .form-field .form-field-error { font-size: 12px; font-weight: 600; line-height: 1.2; margin-top: 5px; color: #cc0000; text-align: right; }

.popup-modal .popup-form .form-field .form-field-error p,
.popup-modal .popup-form .form-field .form-field-error a { font-family: inherit; font-size: inherit; color: inherit; line-height: inherit; }

.popup-modal .popup-form .form-field .form-field-error p:last-child { margin-bottom: 0; }

.popup-modal .form-row.two-col { display: grid; gap: 30px; grid-template-columns: 1fr 1fr; }

.popup-modal .popup-form .checkbox-field { display: flex; flex-direction: row; gap: 10px; align-items: start; }

.popup-modal .popup-form .checkbox-field label:not(.checkbox-marker) { margin-top: 2px; font-size: 16px; line-height: 1.3em; color: #4d5357; }
.popup-modal .popup-form .checkbox-field label * { font: inherit; color: inherit; }

.popup-modal .popup-form .checkbox-field input[type=checkbox] { position: absolute; opacity: 0; visibility: hidden; }

.popup-modal .popup-form .checkbox-field .checkbox-marker { width: 24px; height: 24px; border: 1px solid #000000; flex-shrink: 0; }

.popup-modal .popup-form .checkbox-field input[type=checkbox]:checked + .checkbox-marker { background-image: url("/_assets/icon-tick-dark-green.png"); background-size: 16px 16px; background-position: center; background-repeat: no-repeat; }

.popup-modal textarea.contact-enquiry { height: 120px; }

.formLabel { margin-bottom: 10px; font-size: 14px; display: block }

.switch { font-size: 0; position: relative; color: #FFF; }
.switch .status-text { vertical-align: middle; font-size: 15px; font-family: berlingske_sans_roundmedium, sans-serif; }
.switch .switch-status { vertical-align: middle; position: relative; display: inline-block; width: 45px; height: 25px; margin: 0px 18px; flex-shrink: 0; }
.switch .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 1px; bottom: 0; background-color: #ededed; box-shadow: 0px 0px 0px 4px #8b8f92; -webkit-transition: .4s; transition: .4s; }
.switch .slider:before { position: absolute; content: ""; height: 17px; width: 17px; right: 3px; bottom: 4px; background-color: #53324a; -webkit-transition: .4s; transition: .4s; z-index: 9; }
.switch .slider.round { border-radius: 34px; }
.switch .slider.round:before { border-radius: 50%; }
.switch.margin { margin-top: 6px; }
.switch input { display: none; }
.switch input:checked + .slider { }
.switch input:focus + .slider { -webkit-box-shadow: 0 0 1px #ededed; box-shadow: 0 0 1px #ededed; }
.xswitch input:checked + .slider:before { -webkit-transform: translateX(-21px); transform: translateX(-21px); }
.switch input:checked + .slider + span.status-text .closed { visibility: hidden; opacity: 0; }
.switch input:checked + .slider + span.status-text .open { visibility: visible; opacity: 1; }


@media (min-width: 900px) {
   .c2019 nav.main-nav ul li.engage-premium a { color: #5482ab; padding-bottom: 0px; border-bottom: 0px solid #5482ab; font-family: berlingske_sans_roundregular, sans-serif; /* DONT PUT THIS CHANGE TO LIVE UNTIL REQUESTED */ transition: all 0.2s; }
   /*.c2019 nav.main-nav ul li.engage-premium a:after { content: ""; height: 1px; width: 100%; background-color: #5482ab; display: block; margin: 1px auto 0 auto; transition: all 0.2s; opacity: 1; }*/
   .c2019 nav.main-nav ul li.engage-premium a:hover { border-bottom-color: #ffffff; }
   .c2019 nav.main-nav ul li.engage-premium a:hover:after { width: 0; opacity: 0; }
}

.c2019 nav.main-nav .user-action-container { float: right; font-size: 0; }

.c2019 nav.main-nav .ua-button { display: inline-block; margin-left: 10px; border: 1px solid #bed600; padding: 10px; font-size: 15px; font-family: berlingske_sans_roundmedium, sans-serif; transition: all 0.2s; text-decoration: none; vertical-align: baseline; background-color: transparent; color: inherit; line-height: 1em; cursor: pointer; }

.c2019 nav.main-nav .ua-button:hover { background-color: #4d5558; color: #ffffff; }

.c2019 nav.main-nav .ua-button-container { display: inline-block; margin-left: 10px; position: relative; }

.caret {display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-top: 4px solid \9; border-right: 4px solid transparent; border-left: 4px solid transparent; transform: translateY(-1px)}

.slick-arrows .slick-arrow { position: absolute; display: block; width: 26px; height: 52px; background-color: #a594a0; font-size: 0; top: 50%; margin-top: -26px; background-size: 12px 24px; background-position: center; background-repeat: no-repeat; }
.slick-arrows .slick-arrow.slick-prev { left: -30px; background-image: url("/_assets/btn-arrow-white-left.png"); }
.slick-arrows .slick-arrow.slick-next { right: -30px; background-image: url("/_assets/btn-arrow-white.png"); }


.cms-btn { border: 1px solid #333333; padding: 8px 14px; font-size: 14px; background-color: #ffffff; color: #333333; text-decoration: none; display: inline-block; transition: color 0.2s, background-color 0.2s; cursor: pointer; }
.cms-btn:hover { background-color: #666666; color: #ffffff; }

.cms-btn.btn-blue { border-color: #5482ab; background-color: #5482ab; color: #ffffff; }
.cms-btn.btn-blue:hover { background-color: #ffffff; color: #333333; }

.cms-btn.btn-purple { border-color: #4b2942; background-color: #4b2942; color: #ffffff; }
.cms-btn.btn-purple:hover { background-color: #ffffff; color: #333333; }

.cms-btn.btn-hl-green { border-color: #bed600; background-color: #bed600; color: #333333; }
.cms-btn.btn-hl-green:hover { background-color: #ffffff; color: #333333; }

.cms-btn.has-icon-left > img { margin-right: 8px; display: inline-block; vertical-align: middle; }

.cms-btn.has-arrow-right { padding-right: 36px; position: relative; }

.cms-btn.has-arrow-right:after { content: ""; position: absolute; width: 10px; height: 18px; right: 10px; top: 50%; margin-top: -9px; background-image: url("/_assets/btn-arrow-white.png"); background-size: contain; background-position: center; background-repeat: no-repeat; }
.cms-btn.has-arrow-right.dark-arrow:after { background-image: url("/_assets/btn-arrow-dark.png"); }

.cms-btn.has-arrow-right:hover:after { background-image: url("/_assets/btn-arrow-dark.png"); }
.cms-btn.has-arrow-right.dark-arrow:hover:after { background-image: url("/_assets/btn-arrow-white.png"); }


/*.btn-blue,
.btn-purple {  padding: 6px 12px; cursor: pointer; width: 100%; max-width: 200px; display: inline-block; text-align: center; transition: all 0.2s; font-size: 14px; font-family: berlingske_sans_roundregular, sans-serif; }

.btn-blue { background-color: #5482ab !important; border: 1px solid #5482ab !important; color: #ffffff !important; }
.btn-purple { background-color: #4b2942 !important; border: 1px solid #4b2942 !important; color: #ffffff!important; }

.btn-blue:hover,
.btn-purple:hover { background-color: #ffffff !important; color: #333333 !important; }*/


/*** NAV DROPDOWN ***/
#pnlToolNavigation								{position: relative; z-index: 50}
.c2019 nav.main-nav .nav-dd { position: absolute; left: 0; top: 45px; background-color: #243508; z-index: 20; padding-bottom: 30px; padding-top: 15px; font-size: 0; width: 100%; visibility: hidden; opacity: 0; }
.c2019 nav.main-nav .nav-dd ul { display: inline-block; vertical-align: top; padding: 10px 15px; font-family: Roobert, sans-serif; width: 25%; }
.c2019 nav.main-nav .nav-dd ul li { display: block; padding: 0; border: none; color: #ffffff; font-size: 16px; margin: 10px 0; }
.c2019 nav.main-nav .nav-dd ul li a { color: #ffffff; font-family: Roobert, sans-serif; font-size: 15px; }
.c2019 nav.main-nav .nav-dd ul li a:hover { text-decoration: underline; }
.c2019 nav.main-nav .nav-dd ul li.dd-nav-head { font-size: 16px; margin-bottom: 20px; }
.c2019 nav.main-nav .nav-dd ul li.dd-nav-head a { font-size: 16px; }

.c2019 nav.main-nav .nav-dd ul li ul.submenu { display: block; margin: 0 0 0 20px; width: 100%; padding: 0; }

.c2019 nav.main-nav .nav-dd ul.wide { width: 46%; }

.c2019 nav.main-nav .nav-dd.active				{opacity: 1; visibility: visible;}

.ua-icon-button { margin-left: 10px; width: 30px; height: 30px; background-size: contain; background-position: center; background-repeat: no-repeat; background-color: transparent; cursor: pointer; position: relative; vertical-align: middle; }
/*
.ua-icon-button.login { background-image: url("/_assets/icon-key-dark.png"); }
.ua-icon-button.contact-us { background-image: url("/_assets/icon-email-dark.png"); width: 22px; }
.ua-icon-button.notes { background-image: url("/_assets/icon-pencil-dark.png"); width: 7px; }
.ua-icon-button.pins { background-image: url("/_assets/icon-pin-dark.png"); width: 13px; }
*/

.ua-icon-button.login { background-image: url("/_assets/icon-key-dark.png"); }
.ua-icon-button.contact-us { background-image: url("/_assets2024/icon-contact.png"); width: 29px; }
.ua-icon-button.notes { background-image: url("/_assets/icon-pencil-dark.png"); width: 7px; }
.ua-icon-button.pins { background-image: url("/_assets/icon-pin-dark.png"); width: 13px; }



.c2019 nav.main-nav .ua-icon-button.active:not(.ua-icon-button.contact-us):after { content: ""; position: absolute; width: 0; height: 0; width: 0; z-index: 500; border-top: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-bottom: 20px solid #4d5357; left: 50%; margin-left: -20px; bottom: -22px; }

.c2019 nav.main-nav .ua-icon-button.counter span.counter { position: absolute; top: -9px; right: -9px; width: 17px; height: 17px; border-radius: 20px; font-family: berlingske_sans_roundregular, sans-serif; font-size: 10px; background-color: #bed400; color: #000000; text-align: center; padding-top: 4px; line-height: 1em;  }

.c2019 .tool-header-buttons { position: absolute; right: 10px; bottom: 10px; z-index: 10; text-align: right; }

.c2019 header .container { position: relative; }

.c2019 header .container .user-management { float: right; vertical-align: top; }

/*** General stuff ***/

.c2019 h2.page-title { font-size: 24px; font-family: berlingske_sans_roundmedium; color: #333333; line-height: 1.3em; }
.c2019 h2.page-title:after { content: ""; display: block; margin: 5px 0 20px 0; width: 50px; height: 1px; background-color: #333333; }

.c2019 h2.page-title.no-underline:after { display: none; }

.c2019 .page-cover { width: 100%; background-color: inherit; position: relative; }

.fade-out { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(255,255,255, 0.5); background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 60%, rgba(255,255,255,1) 100%); }

/*** Page Banner ***/

.c2019 .page-banner { position: relative; margin: 0 0 20px 0;  font-size: 0; }

.c2019 .page-banner .clickable-for-cover-link { cursor: pointer; }


.c2019 .page-banner.banner-image { }
.c2019 .page-banner.banner-image .banner { padding: 0 20px 20px 30px; position: relative; background-size: cover; background-position: center; background-repeat: no-repeat; min-height: 250px; overflow: hidden;}

.c2019 .page-banner.supergraphic { padding: 30px 0 30px 0; background-position: top right; background-repeat: no-repeat; }
.c2019 .page-banner.supergraphic div.supergraphic { position: absolute; top: 0; right: 0; }

.c2019 .page-banner.supergraphic .banner { padding: 0 40% 0 0; }

.c2019 .page-banner.has-additional-controls.right .banner { margin-bottom: 20px; }
.c2019 .page-banner.has-additional-controls.right .copy {width: 80%;}


.c2019 .page-banner .banner { position: relative; font-size: 0; }
.c2019 .page-banner.has-additional-controls.right .banner .additional-controls { position: absolute; right: 40px; bottom: 10px; }
.c2019 .page-banner.has-additional-controls.bottom .banner .additional-controls { position: relative; margin-top: 30px; }


.c2019 .page-banner .banner.full-height { min-height: 303px; /*display:table-cell;*/ display: block; vertical-align:middle; }
.c2019 .page-banner .overlay { display: none; /* position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.40); z-index: 0;*/ /* Why do we have this? min-height:430px*/ }

.c2019 .page-banner .content { position: relative; z-index: 3; }
.c2019 .page-banner .click-through { z-index: 5; }
.c2019 .page-banner .additional-controls { z-index: 7; }

.c2019 .page-banner .left { width: 100%; display: inline-block; vertical-align: top; }

.c2019 .page-banner.banner-image .banner .left { padding-top: 85px; }


.c2019 .page-banner.extra-button .left { width: 58%; }

/*.c2019 .page-banner .right { width: 42%; display: inline-flex; position: absolute; z-index: 5; padding-top: 0; top: 20px; bottom: 20px; right: 20px; align-items: center; flex-wrap: wrap; } */

.c2019 .page-banner .right { width: 42%; z-index: 5; display: inline-block; position: relative; padding: 20px 0; vertical-align: top; }

.c2019 .page-banner.no-extra-buttons .left { width: 100%; }


.c2019 .page-banner .content .page-title {  }
.c2019 .page-banner .content .page-title h3.subtitle { }

.c2019 .page-banner .content .page-title h3.subtitle p { margin-top: 14px; font-size: 26px; color: #ffffff; line-height: 1em; }

.c2019 .page-banner.banner-image .banner.full-height .overlay { min-height: 303px; }

.c2019 .page-banner.extra-button .content { padding-right: 40%; }

.c2019 .page-banner.extra-button .extra-button { /*position: absolute; top: 45%; right: 20px;*/ background-color: rgba(255,255,255,0.6); padding: 20px 30px; color: #fff; font-size: 17px; font-family: berlingske_sans_roundregular, sans-serif; transition: 0.2s all; cursor: pointer; text-decoration: none; z-index: 5; width: 100%; display: inline-block; text-align: center; margin-bottom: 5px; }

.c2019 .page-banner.extra-button .extra-button:hover { background-color: rgba(255,255,255,0.85); color: #4d5357;}


.c2019 .page-banner.options-1 .content { padding-right: 0; }

.c2019 .page-banner .full-width-container.banner-image { background-size: cover; background-position: center; background-repeat: no-repeat; }

.vertc { visibility: hidden; }

@media (max-width: 990px) {
   .c2019 .page-banner.extra-button .content { padding-right: 0; }
   .c2019 .page-banner.extra-button .left { display: block; width: 100%; }
   .c2019 .page-banner .right { display: block; width: 100%; position: relative; padding-top: 20px!important; }
}

@media (max-width: 899px) {
}

@media (max-width: 705px) {
	.c2019 .page-banner .banner.full-height {display:block;}
	
	.c2019 .page-banner .banner.full-height,
	.c2019 .page-banner .banner.full-height .overlay {min-height: 340px;}

   .c2019 .page-banner.extra-button .content { padding-right: 0; }
   .c2019 .page-banner.extra-button a.extra-button { top: auto; bottom: 20px; }
}

@media (max-width: 400px) {
	.c2019 .page-banner h2 {line-height: 1.0em !important;}
	.c2019 .page-banner div.greeting h4.greeting {margin: 10px 0px !important;}
	.c2019 .page-banner .banner.full-height,
	.c2019 .page-banner .banner.full-height .overlay {min-height: 430px !important;}
}




.c2019 .page-banner h2 { color: #ffffff; font-size: 45px; font-family: berlingske_sans_roundregular, sans-serif; z-index: 1; position: relative; margin: 0; line-height: 1.4em; }
.c2019 .page-banner h2:after  { display: none; }

.c2019 .page-banner .copy { z-index: 1; position: relative; margin: 25px 0; }
.c2019 .page-banner .copy p { color: #ffffff; font-size: 20px; line-height: 1.2em; font-family: berlingske_sans_roundregular, sans-serif; font-weight: normal; margin-bottom: 0.75em; }

.c2019 .page-banner.dark-text h2,
.c2019 .page-banner.dark-text p { color: #333333; }

.c2019 .page-banner div.greeting { position: relative; z-index: 1; display: none;}
.c2019 .page-banner div.greeting  h4.greeting { color: #ffffff; font-size: 24px; margin: 30px 0; }


/*** Text Uner Banner ***/

.c2019 .text-inner {width: 100%; padding:0px 10px; }
.c2019 .text-inner p {line-height: 1.4em; margin-bottom: 0.75em; font-size: 18px; }


/*** Footer ***/

.c2019 footer { padding: 0; margin: 30px 0 0 0; position: relative; z-index: 1; }

.c2019 footer .copyright-notice { margin: 20px 0 0 0; }
.c2019 footer .copyright-notice p { color: #333333; font-family: Roobert, sans-serif; font-size: 10px; line-height: 1.3em; font-weight: 200; }

/*** Footer Navigation ***/

.c2019 footer nav.footer-nav { }
.c2019 footer nav.footer-nav ul { list-style: none; display: block; }
.c2019 footer nav.footer-nav ul li { display: inline-block; padding: 0 20px; border-left: 1px solid #333333;  }
.c2019 footer nav.footer-nav ul li a { text-decoration: none; color: #333333; font-family: Roobert, sans-serif; font-size: 13px; display: inline-block; vertical-align: middle; line-height: 1em; }
.c2019 footer nav.footer-nav ul li a:hover { color: #666666; }

.c2019 footer nav.footer-nav ul li:nth-child(1) { padding-left: 0; border-left: 0; }

.c2019 nav.main-nav.main-nav-mobile a.close,
.c2019 nav.main-nav.main-nav-mobile .mobile-user-management	{display: none}

.home-page-intro { 
   font-family: Roobert, sans-serif;
   font-size: 17px;
   font-weight: 300;
   color: var(--hl-dark-green);
   line-height: 1.3;
   margin: 40px 0 50px 0;
}

/*** Toolkit Filter ***/

.toolkits-filter { 
   display: flex;
   flex-direction: row;
   align-items: center;
   gap: 20px;
   justify-content: space-between;
}

.toolkits-filter .filter-option {
   flex-basis: 100%;
   max-width: 600px;
}

.toolkits-filter .dk-select-multi {
   width: auto;
}

.toolkits-filter.standard-filter .standard-filter-field .dk-selected { 
   min-width: 190px;
   max-width: 190px;
}


.toolkits-filter .information {
   display: flex;
   flex-direction: row;
   align-items: center;
   font-family: Roobert, sans-serif;
   font-size: 14px;
   font-weight: 400;
   color: var(--hl-dark-green);
   gap: 10px;
   line-height: 1;
}

.toolkits-filter .btn-clear-topic-filter { 
   background-color: transparent;
   font-family: Roobert, sans-serif;
   color: var(--hl-dark-green);
   cursor: pointer;

}

/*** Toolkit Panels ***/

.c2019 .toolkit-panels { /*margin: 20px 0;*/ }
.c2019 .toolkit-panels .filter { /*display: none;*/ }
.c2019 .toolkit-panels .filter label { display: block; margin: 0 0 10px 0; }
.c2019 .toolkit-panels .filter .dk-select { max-width: 200px; }

.c2019 .toolkit-panels .toolkit-panels-container { margin-top: 30px; padding: 0 10px; }

.c2019 .toolkit-panels .toolkit-category { margin-top: 40px; }
.c2019 .toolkit-panels .toolkit-category:first-child { margin-top: 20px; }

.c2019 .toolkit-panels .panel-container { margin: 0 -10px; }

.c2019 .toolkit-panels .pagination { 
   margin-top: 40px;
   display: flex; 
   flex-direction: row;
   align-items: center;
   gap: 10px;
   justify-content:center;
}

.c2019 .toolkit-panels .pagination .pages { 
   display: flex;
   gap: 10px;
}

.c2019 .toolkit-panels .pagination .pages input[type=button] {
   display: inline-flex;
   width: 45px;
   height: 45px;
   align-items: center;
   justify-content: center;
   font-family: Roobert, sans-serif;
   font-size: 16px;
   background-color: transparent;
   border:1px solid #ffffff;
   transition: all 0.2s;
}

.c2019 .toolkit-panels .pagination .pages input[type=button]:not(.current) { 
   cursor: pointer;
}

.c2019 .toolkit-panels .pagination .pages input[type=button].current {
   border-color: var(--hl-light-green);
}

.c2019 .toolkit-panels .pagination .pages input[type=button]:hover { 
   background-color: var(--hl-light-green);
   border-color: var(--hl-light-green);
}


@media (max-width: 650px) {
   .c2019 .toolkit-panels .panel-container { margin: 0 0px; }
}


.c2019 .toolkit-panels div.load-more { display: flex; justify-content: center;  }
.c2019 .toolkit-panels .btn-load-more { display: flex; flex-direction: row; align-items: center; gap: 20px; border-color: #4b2942; background-color: #4b2942; color: #ffffff; font-family: Roobert; font-size: 16px; font-weight: 600; }
.c2019 .toolkit-panels .btn-load-more:after { content: ""; width: 20px; height: 20px; background-image: url("/_assets/icon-plus-dark-green.png"); background-size: contain; background-position: center; background-repeat: no-repeat; }

.c2019 .toolkit-panels .toolkit-category-0 .btn-load-more { border-color: var(--free-tool-colour); background-color: var(--free-tool-colour); color: var(--hl-dark-green); } /* free */
.c2019 .toolkit-panels .toolkit-category-1 .btn-load-more { border-color: var(--premium-tool-color); background-color: var(--premium-tool-color); color: var(--hl-dark-green); } /* subs */

.c2019 .toolkit-panels .toolkit-category-1 .btn-load-more:after { background-image: url("/_assets/icon-plus-dark-green.png"); /*background-image: url("/_assets/icon-plus-hl-light-green.png");*/ }


.c2019 .toolkit-panels .btn-load-more:hover { background-color: transparent; color: #333333; }
.c2019 .toolkit-panels .btn-load-more:hover:after { background-image: url("/_assets/icon-plus-dark-green.png"); }

.c2019 .toolkit-panels .container { }

.c2019 .toolkit-panels .panel {
   padding: 14px;
   width: 100%;
   margin: 0;
   border-left: 1px solid var(--hl-taupe);
   border-right: 1px solid var(--hl-taupe);
   border-bottom: 1px solid var(--hl-taupe);
   border-top: 10px solid var(--hl-light-taupe);
   transition: all 0.2s;
   position: relative;
}

.c2019 .toolkit-panels .panel a { text-decoration: none; }

.c2019 .toolkit-panels .panel div.title { 
   display: flex; 
   flex-direction: row;
   gap: 20px;
   align-items: start;
   justify-content: space-between;
}

.c2019 .toolkit-panels .panel h4.title {
   margin: 0 0 14px 0;
   font-family: Roobert, sans-serif;
   font-weight: 400;
   font-size: 20px;
   line-height: 1.3em;
   color: var(--hl-dark-green);
   position: relative;
}

.c2019 .toolkit-panels .panel div.title img.subscription { 
   margin-top: 3px;
   width: 13px;
   height: 20px;
}

.c2019 .toolkit-panels .panel .image {
   width: 100%;
   padding-top: 55%;
   margin: 20px 0;
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
}

.c2019 .toolkit-panels .panel.subscribed h4.title,
.c2019 .toolkit-panels .panel.pending h4.title { padding-right: 40px;}


.c2019 .toolkit-panels .panel.subscribed h4.title:after,
.c2019 .toolkit-panels .panel.pending h4.title:after { content: ""; position: absolute; right: 0; top: 0; display: block; background-color: transparent; width: 26px; height: 26px; border-radius: 26px; background-size: 18px 18px; background-position: center; background-repeat: no-repeat; }

.c2019 .toolkit-panels .panel.subscribed h4.title:after { background-image: url("/_assets/icon-tick-dark-green.png"); }

.c2019 .toolkit-panels .panel.pending h4.title:after { background-image: url("/_assets2019/icon-clock-green-1.png"); background-size: 26px 26px; background-color: transparent; }

.c2019 .toolkit-panels .panel:hover {
   background-color: var(--hl-light-taupe);
   border-color: var(--hl-taupe);
}

/*.c2019 .toolkit-panels .panel:hover h4.title { color: #26A598; } */

.c2019 .toolkit-panels .panel .copy { font-family: Roobert; font-weight: 200; font-size: 14px; line-height: 1.2em; color: var(--hl-dark-green); }
.c2019 .toolkit-panels .panel .copy p { font: inherit; color: inherit; line-height: inherit; margin-bottom: 0.75em; }

/*.c2019 .toolkit-panels-container .toolkit-category { margin: 20px 0 40px 0; }*/

.c2019 .toolkit-panels-container .toolkit-category h3 { margin: 0 0 20px 0; padding: 10px 20px; background-color: #f0f0f0; color: #000000; font-family: Roobert; font-weight: 600; font-size: 19px; }

.c2019 .toolkit-panels-container .toolkit-category-0 h3 { background-color: var(--free-tool-colour); color: var(--hl-dark-green); }
.c2019 .toolkit-panels-container .toolkit-category-0 .container .panel { border-color: var(--free-tool-colour); }

.c2019 .toolkit-panels-container .toolkit-category-1 h3 { background-color: var(--premium-tool-color); color: var(--hl-dark-green); }
.c2019 .toolkit-panels-container .toolkit-category-1 .container .panel { border-color: var(--premium-tool-color); }


.c2019 .toolkit-panels-container .toolkit-category.my-toolkits h3 { background-color: #00a599; color: #ffffff; }
.c2019 .toolkit-panels-container .toolkit-category.my-toolkits .panel { border-color: var(--free-tool-colour); }

.c2019 .toolkit-panels-container .toolkit-category.my-toolkits .panel[data-content-type='1'],
.c2019 .toolkit-panels-container .toolkit-category.my-toolkits .panel[data-content-type='3'] { border-color: var(--premium-tool-color); }

.c2019 .toolkit-panels-container .toolkit-category.other-toolkits h3 { background-color: #61696f; color: #ffffff; }
.c2019 .toolkit-panels-container .toolkit-category.other-toolkits .panel { border-color: #61696f; }



.special-message-container { display: block; margin: 25vh auto 0 auto; border: 0; padding: 0; background-color: #ffffff; width: 100%; max-width: 530px; border-top: 8px solid #bed400; border-bottom: 8px solid #bed400; }
.special-message-container .content { padding: 20px; }
.special-message-container .content p { color: #000000; font-size: 16px; line-height: 1.4em; }

.special-message-container input[type=button] { margin: 10px 0 0 0; width: auto; padding: 8px 16px; }



.title-with-icon { display: flex; flex-direction: row; gap: 20px; align-items: center; margin-bottom: 20px; }
.title-with-icon img { width: 48px; height: auto; flex-shrink: 0; }
.title-with-icon h1 { font-family: Roobert; font-size: 32px; font-weight: 600; width: 100%; }

.close-page { display: inline-block; width: 46px; height: 46px; flex-shrink: 0; background-color: var(--hl-light-green); background-image: url("/_assets/icon-close-dark.png"); background-size: 24px; background-repeat: no-repeat; background-position: center;  }


.ua-user-options ul {font-family: 'Roobert';}
.ua-user-options-dropdown {width: 241px; }

.ua-user-options-dropdown .ua-option-button:before {width: 33px !important; height: 30px !important; position: relative; top: 2px;}
.ua-user-options-dropdown ul li {margin-bottom: 8px !important; }

.c2024 .title-with-icon {margin-top: 60px;}
.c2024 .title-with-icon h1 {font-size: 42px; }

.popup-login-register p {font-family: Roobert; font-weight: 300;}

.confirm-email h2,
.register-complete p {font-family: Roobert!important; font-weight: 400!important; font-size: 21px!important;}
.email-confirmed p {font-family: Roobert; font-weight: 300; font-size: 16px!important; }


@media (max-width: 440px) {
   .popup-modal .form-container div.header img { width: 100%; height: auto; }
}

