@charset 'utf-8';
/** *  * 
@author		George Iancu*
@copyright	Digitalogy (c) 2025
@license	Commercial
* */

:root{
    --news-bg:#39a3a1;       /* teal left pane */
    --pill:#e19033;          /* badge colour */
    --dot:#dfdfdf;           /* light dot */
    --dot-active:#333;
    --radius:22px;
}


/*****************
*
*   GENERAL
*
******************/
.visible-on-mobile{ display: none; }
hr{ max-width: 100%; }

/*****************
*
*   Rewrite CoreCMS
*
******************/
#CF_admin .CF_label{ color: white; }


/*****************
*
*   CONTAINER
*
******************/
.container{max-width: var(--container-width);padding-left: var(--container-padding-left);padding-right: var(--container-padding-right);margin-left: var(--container-margin-left);margin-right: var(--container-margin-right);width: 100%;}
.flex{ display: flex; align-items: center; gap: var(--container-gap); }
.flex.justify{ justify-content: space-between; }
.flex.evenly,
.flex.evenly > div{flex: 1;}


/*****************
*
*   FORMS
*
******************/
.formio-form{padding: 1rem;background-color: #f9f9f9;}
.formio-form .form-group{  }
.formio-form .form-group label{margin-bottom: 5px;}
.formio-form .form-group .form-control{background-color: #FFFFFF;border: 1px solid #eee;border-radius: 20px;padding: 0.5rem 1rem;}




/*****************
*
*   TOP ACCESSIBILITY BAR
*
******************/
body.is-muted svg {
    filter: grayscale(0.8);
}

body.is-muted img {
    filter: grayscale(0.8);
}

body.is-muted a {
    filter: grayscale(0.8);
}

body.is-muted iframe {
    filter: grayscale(0.8);
}

body.is-muted .landing-hero {
    filter: grayscale(0.8);
}

body.is-muted .image {
    filter: grayscale(0.8);
}

body.is-muted #homehero{
    filter: grayscale(1);
}

.skip-to-content {
    position: absolute;
    top: -1px;
    left: 0;
    right: 0;
    width: 160px;
    margin: auto;
    background: var(--LHC-yellow);
    color: var(--LHC-purple);
    font-weight: 700;
    text-align: center;
    padding: 10px;
    transform: translateY(-100%);
    transition: 0.5s;
    z-index: 99999999;
}
.skip-to-content:focus {
    transform: translate(0,0);
    color: var(--LHC-purple);
}
.accessibility-bar {
    display: none !important;
}
#accessibility {
    background-color: #E7ECEC !important;
    padding-top: 5px;
}
#accessibility > .wrap {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}
#accessibility > .wrap > div {
    display: flex;
    align-items: flex-end;
    position: relative;
}
#accessibility > .wrap > div > span {
    background-color: white;
    display: inline-flex;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 12px 15px 10px 15px;
    align-items: center;
    justify-content: center;
    height: 40px;
    margin-right: 8px;
}
#accessibility > .wrap > div > span.tone-btn {
    margin-right: 0;
    color: #425563;
    font-size: 1.4rem;
    font-weight: 600;
    padding-left: 20px;
    padding-right: 20px;
}
#accessibility > .wrap > div > span.tone-btn > .field {
    display: flex;
    align-items: center;
    font-size: 1rem;
}
#accessibility > .wrap > div > span.tone-btn > .field .mdc-switch {
    margin-left: 5px;
    margin-right: 5px;
}
#accessibility > .wrap > div > span.accessibility-btn {
    background-color: #312667;
    padding-left: 10px;
    padding-right: 10px;
}
#accessibility > .wrap > div > span.contrast-btn {
    padding-left: 20px;
    padding-right: 20px;
}
#accessibility > .wrap > div > span.contrast-btn svg {
    margin-left: 3px;
    margin-right: 3px;
    cursor: pointer;
}
#accessibility > .wrap > div > span.increase-btn {
}
#accessibility > .wrap > div > span.decrease-btn {
}
#accessibility > .wrap > div > span.translation-btn {
    background-color: #233978;
    margin-right: 0;
    padding-left: 10px;
    padding-right: 10px;
    position: relative;
}
#accessibility .tone-switch {
    margin: 0 2px 0 6px;
    cursor: pointer;
}
#accessibility .switch-underlay {
    width: 50px;
    height: 26px;
    border: 1px solid #425563;
    border-radius: 60px;
    padding: 4px;
    display: flex;
    align-items: center;
}
#accessibility .switch-underlay:focus-within {
    outline: solid #002f87 3px;
}
#accessibility .switch-thumb {
    transition: 0.2s;
    width: 20px;
    height: 20px;
    background: #425563;
    border-radius: 50%;
}
#accessibility .switch-thumb.selected {
    transform: translateX(20px)
}
#accessibility .switch-control {
    opacity: 0;
}
#accessibility .tooltip-hover {
    position: relative;
}
#accessibility .tooltip-hover::before {
    display: none;
    position: absolute;
    top: 93%;
    z-index: 99990;
    background-color: white;
    width: 20px;
    height: 20px;
    transform: rotate(45deg);
    content: "";
}
#accessibility #google_translate_element.tooltip-hover::before {
    right: 0;
    left: 0;
    margin: auto;
}
#accessibility .tooltip-hover::after {
    display: none;
    position: absolute;
    top: 105%;
    z-index: 99999;
    background-color: white;
    color: black;
    font-weight: 700;
    padding: 10px;
    border-radius: 6px;
    right: 0;
    text-align: center;
}
#accessibility .tooltip-hover:hover::after {
    display: block;
}
#accessibility .tooltip-hover:hover::before {
    display: block;
}
#accessibility #google_translate_element.tooltip-hover::after {
    content: "Language Translation";
}
#accessibility .accessibility-btn.tooltip-hover::after {
    content: "Accessibility Information";
    left: 0px;
    right: auto;
}
#accessibility .decrease-btn.tooltip-hover::after {
    content: "Decrease text size";
}
#accessibility .increase-btn.tooltip-hover::after {
    content: "Increase text size";
}

#accessibility .reset-text.tooltip-hover::after {
    content: "Reset text size";
    width: 95px;
}
#accessibility .contrast-btn.tooltip-hover::after {
    content: "Change Colour Scheme";
}
#accessibility .tone-btn.tooltip-hover::after {
    content: "Change Colour Tone";
    left: 0;
    margin: auto;
    max-width: 180px;
    font-size: 1rem;
}
#accessibility #google_translate_element.tooltip-hover {
    position: static;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 150px;
    z-index: 9999;
    cursor: pointer;
}


/*****************
*
*   TOP BAR
*
******************/
#topbar{background-color: var(--light-color);padding-top: 0.5rem;padding-bottom: 0.5rem;}
#topbar #topnav{ }
#topbar #topnav ul{display: flex;align-items: center;gap: 1.5rem;list-style: none;margin: 0;padding: 0;}
#topbar #topnav ul li{position: relative;}
#topbar #topnav ul li a{display: flex;align-items: center;gap: 0.5rem;font-size: 15px;}
#topbar #topnav ul li a img{ width: 14px; }

#topbar #topnav ul ul{display: none;position: absolute;top: 1.2rem;left: -1rem;background-color: var(--light-color);padding: 1rem;padding-top: 2rem;width: max-content;z-index: 999999999;}
#topbar #topnav ul ul li{ margin: 0.5rem 0; }
#topbar #topnav ul ul li a img{ display: none; }

#topbar #topnav ul ul ul{ display: none; }

#topbar #topnav ul li:hover > ul{ display: block; }

#topbar #social{ display: flex; align-items: center; gap: 1rem; }
#topbar #social a:not(.btn){height: 35px;}
#topbar #social a:not(.btn) img{width: 35px;height: 35px;}
#topbar #social a.btn{height: 35px;}



/*****************
*
*   LOGO BAR
*
******************/
#logobar{ padding-top: 1rem; padding-bottom: 1rem; }
#logobar #logo{position: relative;z-index: 99999999;}
#logobar #logo a img{ width: 100%; max-width: 300px; }
#logobar #logosearch{display: flex;gap: 1.8rem;flex-direction: column;align-items: flex-end;}
#logobar #logosearch .logonhs{width: 100%;max-width: 250px;}
#logobar #logosearch form{width: 100%;margin: 0;position: relative;}
#logobar #logosearch form input[type="text"]{box-shadow: none;border: none;border-radius: 20px;background-color: var(--light-color);padding: 0 3rem 0 1rem; width: 300px;margin: 0;}
#logobar #logosearch form input[type="text"]::placeholder{ color: black; }
#logobar #logosearch form button{ position: absolute; z-index: 1; right: 0; top: 0; }
#logobar #logosearch form button img{ width: 39px; height: 39px; }


/*****************
*
*   NAVIGATION BAR
*
******************/
#navigation{padding-top: 1rem;}
#navigation #navband1{background-color: var(--secondary-color);padding-top: 2rem;padding-bottom: 2rem;}
#navigation #navband1 ul{list-style-type: none;display: flex;align-items: center;gap: 0.5%;margin: 0;padding: 0;justify-content: center;}
#navigation #navband1 ul ul{display: none !important;}
#navigation #navband1 ul li{border-left: 2px solid var(--text-color);padding-left: 1%;flex: 1;}
#navigation #navband1 ul li:first-child{ border: none; padding-left: 0; }
#navigation #navband1 ul li a{font-size: 20px;font-weight: 600;display: flex;align-items: center;gap: 1rem;line-height: 1.2;font-size: 15px;color: #000;}
#navigation #navband1 ul li a img{height: 35px;}
#navigation #navband2{background-color: var(--primary-color);padding-top: 0.75rem;padding-bottom: 0.75rem;}
#navigation #navband2 ul{list-style-type: none;display: flex;align-items: center;gap: 1rem;margin: 0;padding: 0;}
#navigation #navband2 ul li{border-left: 2px solid white;padding-left: 1rem;}
#navigation #navband2 ul li:first-child{ border: none; padding-left: 0; }
#navigation #navband2 ul li a{color: #000;display: flex;align-items: center;gap: 0.5rem;font-size: 15px;}
#navigation #navband2 ul li a img{ width: 14px; }
#navigation #navband2 a.btn{display: flex;align-items: center;gap: 1rem;padding-top: 0.5rem;padding-bottom: 0.5rem;font-size: 15px;}
#navigation #navband2 a.btn img{ height: 14px; }



/*****************
*
*   HOME HERO
*
******************/
#homehero{background-color: var(--light-color);background-image: url("/themes/default/assets/img/homehero-graphic.png");height: 30vw;background-position: 80% 0;background-repeat: no-repeat;background-size: 85%;display: flex;align-items: center;min-height: 400px;}
#homehero .herocontent{ max-width: 35%; }
#homehero .herocontent h1{ font-size: 68px; line-height: 67px; }
#homehero .herocontent a{ text-decoration: underline; font-weight: bold; }
@media screen and (max-width: 1400px) { #homehero{ background-size: 65%; background-position: 90% 100%; } }
@media screen and (max-width: 1150px) { #homehero{background-size: 75%;background-position: 100% 100%;} }
@media screen and (max-width: 991px) { 
    #homehero{background-size: 100%;background-position: center bottom;height: 100%;padding-bottom: 25rem;padding-top: 2rem;}
    #homehero .herocontent{max-width: 100%;text-align: center;}
}



/* ===============  
 * 
 * Footer
 * 
 * ===============
 */
 footer{background: var(--primary-color);padding: 4rem 0 2rem 0;border-top: 20px solid #4A4848;}

 footer .container:nth-child(1){display: flex;gap: 4rem;}
 footer .container:nth-child(1) > div{ flex: 1; }
 footer .container:nth-child(1) > div:nth-child(1){ flex: 1;min-width: 30%; }
 footer .container:nth-child(1) > div:nth-child(1) img{ width: 100px; }
 footer .container:nth-child(1) > div:nth-child(1) p:first-of-type{ font-weight: bold; line-height: 1.2; }


 footer .container:nth-child(1) > div p.heading{font-weight: bold;margin-bottom: 1rem;}
 footer .container:nth-child(1) a{ color: inherit; }
 footer .container:nth-child(1) div p,
 footer .container:nth-child(1) div ul{list-style: none;}
 footer .container:nth-child(1) div ul li{ margin-bottom: 0.5rem; }
 footer .container:nth-child(1) div ul li a{ }
footer .container:nth-child(1) div ul ul{ display: none; }

 footer .container:nth-child(1) .logo-white{ width: 100%; margin-bottom: 4rem; }

 footer .container:nth-child(1) #social-footer{display: flex;align-items: center;gap: 1rem;}
 footer .container:nth-child(1) #social-footer a:not(.btn){height: 51px;}
 footer .container:nth-child(1) #social-footer a:not(.btn) img{width: 51px;height: 51px;}
 
 footer .container:nth-child(2) .copyright{margin-top: 2rem;display: flex;gap: 2rem;justify-content: space-between;align-items: center; }
 footer .container:nth-child(2) .copyright p,
 footer .container:nth-child(2) .copyright p a{ letter-spacing: 0px; }
 footer .container:nth-child(2) .copyright p a{ text-decoration: underline; }


/*****************
*
*   MAIN
*
******************/
body.default #main-content{ background-color: var(--light-color); padding-bottom: 5rem; }
body.default #main-content .container:nth-child(2){gap: 4rem;align-items: flex-start;}
body.default #main-content #sidebar{position: relative;overflow: hidden;}
body.default #main-content #sidebar .sidebar-graphic{text-align: center;position: absolute;top: 0;left: 0;right: 0;transform: translateY(100%);opacity: 0;transition: transform 0.8s ease-out, opacity 0.8s ease-out;padding-top: 2rem;}
body.default #main-content #sidebar .sidebar-graphic.loaded{ transform: translateY(0); opacity: 1; }
body.default #main-content #sidebar .sidebar-graphic img{width: 360px;margin: 0 auto;display: block;margin-top: 2rem;}
body.default #main-content #sidebar .sidebar-graphic img.sidebar-graphic-icon{position: absolute;width: 70%;left: 0px;right: 0;top: 0;z-index: 1;}
body.default #main-content #sidebar .sidebar-box{width: 400px;background-color: white;border-radius: 10px;padding: 0;position: relative;z-index: 2;margin-top: 290px;}
body.default #main-content #sidebar .sidebar-box.noicon{ margin-top: 0; }
body.default #main-content #sidebar .sidebar-box ul{list-style: none;padding: 1.5rem;}
body.default #main-content #sidebar .sidebar-box ul li{ }
body.default #main-content #sidebar .sidebar-box ul li a{ }
body.default #main-content #content{ flex: 1; }
body.default #main-content #content h1{ margin-bottom: 3.5rem; }


body.publications #main-content{ background-color: var(--light-color); padding-bottom: 5rem; }
body.publications #main-content .container:nth-child(2){gap: 4rem;align-items: flex-start;}
body.publications #main-content #sidebar{position: relative;overflow: hidden;}
body.publications #main-content #sidebar .sidebar-graphic{text-align: center;position: absolute;top: 0;left: 0;right: 0; transform: translateY(100%); opacity: 0; transition: transform 0.8s ease-out, opacity 0.8s ease-out; }
body.publications #main-content #sidebar .sidebar-graphic.loaded{ transform: translateY(0); opacity: 1; }
body.publications #main-content #sidebar .sidebar-graphic img{width: 360px;margin: 0 auto;display: block;}
body.publications #main-content #sidebar .sidebar-graphic img.sidebar-graphic-icon{position: absolute;width: 70%;left: 0px;right: 0;top: 0;}
body.publications #main-content #sidebar .sidebar-box{width: 400px;background-color: white;border-radius: 10px;padding: 0;position: relative;z-index: 2;margin-top: 290px;}
body.publications #main-content #sidebar .sidebar-box ul{list-style: none;padding: 1.5rem;}
body.publications #main-content #sidebar .sidebar-box ul li{ }
body.publications #main-content #sidebar .sidebar-box ul li a{ }
body.publications #main-content #content{ flex: 1; }
body.publications #main-content #content h1{ margin-bottom: 3.5rem; }

body.publications .a-z { background-color: white;border-radius: 10px;padding: 0;position: relative;z-index: 2;padding: 1.5rem; margin-top: 1rem; }
body.publications .a-z .a-z-links{display: grid;grid-template-columns: repeat(5, 1fr);gap: 4px;margin: 10px 0;}
body.publications .a-z .a-z-links a {display: inline-flex;align-items: center;justify-content: center;padding: 6px 0;border: 1px solid #999;font-size: 13px;text-decoration: none;color: #333;border-radius: 3px;box-sizing: border-box;}
body.publications .a-z .a-z-links a:hover {border-color: #999;background: var(--secondary-color);color: white;}
body.publications .a-z .a-z-links a.active { background: #007bff; color: #fff; border-color: #007bff; font-weight: 600; }
body.publications .a-z .a-z-links a.disabled { opacity: 0.4;pointer-events: none; }


#main-content #content #article ul,
#main-content #content #article ol{margin-left: 1rem;margin-bottom: 1rem;margin: 0.5rem 0 1.5rem 1rem;0CONTAIN-INTRINSIC-BLOCK-SIZE: AUTO 100PX;0.5rem 0 1.5remCONTAIN-INTRINSIC-BLOCK-SIZE: AUTO 100PX;}

#main-content #content #article a{text-decoration: underline;font-weight: bold;color: #018786;}
#main-content #content #article em,
#main-content #content #article i{ font-style: italic; }


/*****************
*
*   BREADCRUMB
*
******************/
#breadcrumb{padding-top: 2rem;padding-bottom: 1rem;margin-bottom: 5rem;}
#breadcrumb ul{list-style: none;display: flex;gap: 1.5rem;}
#breadcrumb ul li{position: relative;}
#breadcrumb ul li:first-child { padding-left: 0; }  
#breadcrumb ul li + li::before {content: "|";position: absolute;font-weight: bold;left: -0.75rem;color: var(--text-color);}
#breadcrumb ul li a{ text-decoration: underline; }


/*****************
*
*   Sections
*
******************/
/*****************
*
*   QUICK LINKS
*
******************/
#quicklinks{background-color: var(--secondary-color);padding-top: 4rem;padding-bottom: 4rem;border-top: 20px solid #4A4848;border-bottom: 2px solid #4A4848;}
#quicklinks h2{ text-align: center; }
#quicklinks p{ text-align: center; max-width: 50%; margin: 0 auto; }
#quicklinks .qlinks{margin-top: 3rem;display: grid;grid-template-columns: repeat(4, 1fr);gap: 16px;margin-bottom: 2rem;}
#quicklinks .qlinks li{background: white;display: flex;align-items: center;justify-content: center;padding: 3rem;border-radius: 20px;}
#quicklinks .qlinks li a{font-weight: bold;line-height: 1.15;font-size: 20px;}
#quicklinks .qlinks li a img{width: 100%;}
#quicklinks .btn{background-color: #4A4848;color: white !important;display: inline-flex;margin-top: 3rem;}


/*****************
*
*   PAGE DRIVERS
*
******************/
.pagedrivers{display: grid;grid-gap: 1rem;grid-template-columns: repeat(3, 1fr);}
.pagedrivers .pagedriver{ background: #FFFFFF;border-radius: 1rem;padding: 2rem 1rem;text-align: center;}
.pagedrivers .pagedriver:hover{ background: #eeeeee; }
.pagedrivers .pagedriver img,
.pagedrivers .pagedriver svg{height: 120px;width: auto;}
.pagedrivers .pagedriver p{margin: 0;}
.pagedrivers .pagedriver p.pagetitle{font-weight: bold;margin-bottom: 1rem;margin-top: 1rem;}
.pagedrivers .pagedriver p.authors a{text-decoration: underline !important;}


/* ===============
 * 
 * NEWSLETTER
 * 
 * ===============
 */
 #newsletter-band{background: var(--primary-color);padding: 3rem 4rem 4rem 4rem;color: white;margin-top: 2.25rem;display: block;display: flex;flex-direction: column;flex-wrap: wrap;}
 #newsletter-band p > span.material-icons-outlined{font-size: 6rem;}
 #newsletter-band h2{text-align: center;margin: 0 0 .625rem 0;}
 #newsletter-band p{color: white;text-align: center;margin-top: 0;padding-top: 0;}
 #newsletter-band p.output{font-weight: bold;border: 1px solid white;border-radius: 13px;display: inline-block;margin: 0 auto;padding: .625rem;text-align: center;width: 100%;background: #3aaa93;}
 #newsletter-band p.output.error{background-color: #c16060;}
 #newsletter-band form{text-align: center;margin-top: 2rem;display: flex;max-width: 70%;margin-left: auto;margin-right: auto;min-width: 400px;}
 #newsletter-band form input[type="email"]{height: 50px;padding: .625rem;border: none;font-size: 15px;min-width: 300px;border-top-left-radius: 2rem;border-bottom-left-radius: 2rem;box-shadow: none;}
 #newsletter-band form input[type="submit"]{height: 50px;border: none;padding: .625rem 2.25em;font-size: 15px;border-top-right-radius: 2rem;border-bottom-right-radius: 2rem;background: #EE9944;margin-left: -5px;cursor: pointer;font-weight: 600;}
 

 /* ===============
 * 
 * ACCORDION
 * 
 * ===============
 */
ul.accordion{margin: 0 !important;background: none;}
ul.accordion li.accordion-item{background: none;margin-bottom: 0.5rem;}
ul.accordion li.accordion-item a.accordion-title{color: initial !important;border: none;font-size: var(--body-font-size);background: white;}
ul.accordion li.accordion-item .accordion-content{border: none;}


/*****************
*
*   Snippets
*
******************/
.content-box{padding: 2rem;box-shadow: 0 0 20px #eee;}

.white_drivers .content-box{ background: white; }

/**** SNIPPET 1 ****/
