﻿:root {
    
    --grad: linear-gradient(320deg,rgba(130, 200, 190, 1) 0%, rgba(184, 238, 97, 1) 50%, rgba(191, 243, 85, 1) 100%);
    --grad2: linear-gradient(320deg, #83C8BE 0%, #BFF355 100%);
    
}

body,
p,
ul,
ol,
h1,
h2,
h3,
h4,
h5,
.font-m,
input[type="text"],
.key-contacts-v3 .header h2,
.popup-modal .popup-form .checkbox-field label *    {font: unset; font-family: 'Roobert', sans-serif !important}

.c2024 h1 {font-size: 35px; font-weight: 300; }


.key-contacts-v3 .header h2 {font-size: 35px; font-weight: 300}

strong  {font-weight: 700}

img.dcs-cc-logo {max-width: 100%; height: auto !important; width: 100%; max-width: 273px;}

.hero-home {bottom: -40px; align-items: flex-end; }

.wrapper.cols 						{display: flex; justify-content: space-between; padding-right: 10px;  }
.wrapper.cols .col-1 				{width: 100%; max-width: 362px; min-height: 331px; }
.wrapper.cols .header-and-events 	{width: 100%; max-width: 600px; min-height: 331px; }

@media (max-width: 980px) {
	.wrapper.cols .col-1 				{min-height: 345px;}
	.wrapper.cols .header-and-events 	{max-width: 500px; min-height: 345px;}
}

.default-header .events-container 	{width: 100% !important; }
.events-carousel .copy-container 	{max-height: 60px !important; overflow: hidden;}


/* 2025 HEADER */
section.header          {display: flex; align-items: flex-end; padding: 30px 0 15px 0; background-size: cover; background-position: center; min-height: 381px; }
section.header .col-1   {padding-bottom: 0; padding-top: 0;}

section.header .container {position: relative; z-index: 1; background-color: #243508; padding: 35px; width: 100%; max-width: 362px; background: var(--grad); clip-path:unset !important; }
section.header .container .logo-and-title {}

section.header .container .logo-and-title h1 { font-size: 32px; color: #ffffff; line-height: 1.1em; }
section.header .container .logo-and-title img { height: 70px; }

section.header .container .intro { margin: 20px 0; color: #ffffff; line-height: 1.3em; font-size: 17px; font-family: 'Roobert', sans-serif; }
section.header .container .intro p {color: inherit;  line-height: inherit; color: #243508}
section.header .container .intro :last-child { margin-bottom: 0; }

section.header .container .buttons { display: flex; flex-direction: row; gap: 10px; align-items: center; }


@media (max-width: 880px) {
	
	section.header .container {max-width: 100%; margin-bottom: 0px; }
	
	.wrapper.cols {flex-direction: column; gap: 20px; padding: 0 20px;  }
	.wrapper.cols .col-1 {max-width: 100% !important; padding: 0px !important; min-height: unset;}
	.wrapper.cols .header-and-events {min-height: unset;}
}






.btn-hollow-green { background-color: transparent; border-color: #BFF355; color: #ffffff; }
.btn-hollow-green:hover { background-color: #BFF355; color: #2d3d3c!important; }


.default-header {}
.default-header .header-and-events { display: flex; flex-direction: row; gap: 0; background-color: #E2D6CF; }

.default-header .header-intro { padding: 40px 80px 40px 30px; flex-basis: 50%; position: relative; }
.default-header .header-intro:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; background-color: #000000; opacity: 0.55; z-index: 0; }
.default-header .logo-and-title { display: flex; flex-direction: row; gap: 10px; align-items: start; position: relative; z-index: 1;  }

.default-header .logo-and-title h1 { font-size: 32px; color: #ffffff; line-height: 1.1em; }
.default-header .logo-and-title img { height: 70px; }

.default-header .intro { margin: 20px 0 0 0; color: #ffffff; line-height: 1.3em; font-size: 17px; font-family: 'Roobert', sans-serif; position: relative; z-index: 1;  }
.default-header .intro p { font: inherit; color: inherit; line-height: inherit; }
.default-header .intro :last-child { margin-bottom: 0; }

.default-header .events-container { width: 50%; flex-shrink: 0; flex-grow: 0; background-color: inherit; }


.events-carousel .event { padding: 30px 30px 25px 30px; background-color: #E2D6CF; /*color: #ffffff;*/ }

.events-carousel .event .caption { color: #2c4244; font-size: 13px; margin-bottom: 0.3em; }
.events-carousel .event .date { color: inherit; font-size: 13px; margin-bottom: 1em; }

.events-carousel .event .title { font-size: 23px; color: inherit; margin-bottom: 8px; line-height: 1.2em; }

.events-carousel a { border-color: #2c4244; background-color: transparent; color: #2c4244; }
.events-carousel a:hover { background-color: #2c4244R; color: #fff; }

.events-carousel .copy-container { color: inherit; margin-bottom: 20px; }
.events-carousel .copy-container * { color: inherit; }

.events-carousel-controls { padding: 5px 20px 20px 20px; }

.arrow-dots-line.carousel-buttons .buttons[role=toolbar] { position: relative; padding: 0; text-align: center; background-color: inherit; height: 30px; }
.arrow-dots-line.carousel-buttons .buttons[role=toolbar]:before { content: ""; position: absolute; top: 50%; margin-top: -1px; left: 0; width: 100%; height: 1px; background-color: #000000; }

.arrow-dots-line.carousel-buttons { padding: 5px 20px 20px 20px; background-color: inherit; }

.arrow-dots-line.carousel-buttons .slick-arrow { font-size: 0; width: 30px; height: 30px; background-image: url(/_assets/btn-arrow-white.png); background-position: right center; background-repeat: no-repeat; background-size: contain; background-color: inherit; position: relative; border: 0!important;  }

.carousel-buttons .slick-prev { transform: rotate(180deg); }

.arrow-dots-line.carousel-buttons .slick-prev { float: left; }
.arrow-dots-line.carousel-buttons .slick-next { float: right; }

.carousel-buttons   {display: flex; gap: 15px;}
.carousel-buttons ul { list-style: none; display: inline-block; margin: 0; background-color: inherit; padding: 0 10px; position: relative; z-index: 1; font-size: 0;}
.carousel-buttons ul li { padding: 0 5px; display: inline; line-height: 1; }
.carousel-buttons ul li button { font-size: 0; display: inline-block; width: 16px; height: 16px; border: 2px solid #ffffff; background-color: transparent; border-radius: 100%; }
.carousel-buttons ul li.slick-active button { background-color: #ffffff; }


.key-contacts-v3 { margin-top: 0px; }
.key-contacts-v3.with-background { background-color: #243508; padding: 45px 0 100px 0; clip-path: unset !important; }

.key-contacts-v3 .btn-contact-us { border-color: #ffffff; background-color: #ffffff; color: #243508; }
.key-contacts-v3 .btn-contact-us:before { content: ""; display: inline-block; width: 24px; height: 20px; background-image: url("/_assets/icon-envelope-green.png"); background-size: contain; background-position: center; background-repeat: no-repeat; }

.key-contacts-v3 .btn-contact-us:hover { background-color: transparent; color: #ffffff;  }
.key-contacts-v3 .btn-contact-us:hover:before { background-image: url("/_assets/icon-envelope-white.png"); }

.key-contacts-v3:not(.with-background) .header h2 { color: #3C4748; }

.key-contacts-v3 .header h2 {font-size: 35px;}

section.toolbar             {padding: 55px 0 30px; }
section.toolbar .col-1      {display: flex; flex-direction: row; gap: 30px; align-items: center; }
section.toolbar .actions-container { display: flex; flex-direction: row; align-items: center; gap: 10px; flex-wrap: nowrap; flex-shrink: 0;  }

section.toolbar .actions-container > * { height: 45px; padding-top: 0; padding-bottom: 0px; font-size: var(--font-16);  }

section.toolbar .search-container               {padding: 0 10px 0 0; flex-basis: 100%; display: flex; flex-direction: row; gap: 10px; align-items: center; background-color: #F3EFEC; border: none; padding-left: 16px; height: 45px;}
section.toolbar .search-container input.search  {position: static; flex-basis: 100%; padding: 0; font-size: 15px; font-weight: 500}
section.toolbar .search-container .btn-search   {position: static !important; left: initial; right: initial; width: 24px; height: 23px; background-image: url("/compliance-club/_assets/icon-search.png"); background-size: cover; background-position: center; background-repeat: no-repeat; background-color: transparent; cursor: pointer; flex-shrink: 0}

.btn-my-alerts          {background-color: #BFF355; border-color: #BFF355; color: #243508; white-space: nowrap; font-weight: 500}
.btn-my-alerts:before   {content: ""; width: 21px; height: 26px; background-image: url("/compliance-club/_assets/icon-alerts.png"); background-size: contain; background-position: center; background-repeat: no-repeat; }
.btn-my-alerts:hover    {background-color: transparent; }

.btn-introduce-colleague { background-color: #243508; border-color: #243508; color: #ffffff; }
.btn-introduce-colleague:hover { background-color: transparent; color: #243508; }

.my-alert-form .buttons { display: flex; flex-direction: row; justify-content: space-between; align-items: center; }

.my-alert-form .my-alerts-saved { font-size: 14px; color: #243508; display: none; }

.switch-control-toggle { box-shadow: 0 0 0 1px #333333 !important; }
.switch-control-toggle:before { background-color: #7CAF4D !important; border-color: #7CAF4D !important; }

.grey-bg { background-color: #F1F4F3!important; }

.btn-see-all { border-color: #6FA739; background-color: #6FA739; font-size: 16px; color: #ffffff; }
.btn-see-all:hover { background-color: transparent; color: #3C4748; }

/****/
section.topic-header,
section.know-how-header { margin-top: 30px; background-size: cover; background-position: center; background-repeat: no-repeat; }

section.know-how-header:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; right: 0; background-color: #000000; opacity: 0.62; z-index: 0; }

section.know-how-header .header { padding: 30px 0; display: flex; flex-direction: row; align-items: center; gap: 20px; }
section.know-how-header .header img.logo { height: 40px; width: auto; }
section.know-how-header .header .breadcrumbs { margin: 0; }


section.topic-header .header-container { padding-top: 40px; padding-right: 0; padding-bottom: 40px; padding-left: calc(50% - 590px); position: relative; width: calc(calc(50% - 590px) + 560px); clip-path: polygon(0 0, 100% 0, calc(100% - 80px) 100%, 0 100%); }
section.topic-header .header-container:before { content: ""; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-color: #243508; opacity: 0.92; z-index: 0; }

section.topic-header .header { position: relative; z-index: 1; padding-right: 50px; }
section.topic-header .header .content { }

section.topic-header .header .logo-and-breadcrumbs { display: flex; flex-direction: row; align-items: center; gap: 20px; margin: 0 0 20px 0; }
section.topic-header .header .logo-and-breadcrumbs img.logo { height: 40px; width: auto; }
section.topic-header .header .logo-and-breadcrumbs .breadcrumbs { margin: 0; }

section.topic-header .header .logo-and-breadcrumbs .breadcrumbs .wrapper { width: auto; }


section.topic-header .header h1 { font-size: 50px; color: #ffffff; max-width: 480px; }

section.topic-header .header p.date { color: #BFF355; font-size: 17px; margin-bottom: 0.8em; }

/* BREADCRUMBS */

#cpBody_secBread {margin-top: -30px; margin-bottom: -20px; }

@media (max-width: 740px)
{
	#cpBody_secBread {margin-top: 0px; margin-bottom: 0px; }
}


.breadcrumbs                        {margin: 0; }
.breadcrumbs .breadcrumbs-container {padding: 0; display: flex; flex-direction: row; gap: 10px; align-items: center; flex-wrap: wrap; }

.header .breadcrumbs .breadcrumb,
.header .seperator,
.breadcrumbs .breadcrumbs-container .current-page-breadcrumb { color: #243508; font-family: 'Roobert', sans-serif; font-size: 17px; font-style: 300;}

.breadcrumbs .breadcrumbs-container .breadcrumb {font-size: 17px;}

.header .seperator { transform: translateY(-2px);}
.breadcrumbs .breadcrumbs-container .current-page-breadcrumb { color: #243508; font-weight: 300; font-style: normal; border-bottom: 1px solid #243508 !important}

.breadcrumbs .breadcrumbs-container .current-page-breadcrumb:after { display: none; }

.breadcrumbs .breadcrumbs-container .breadcrumb { flex-shrink: 1; }
.breadcrumbs .breadcrumbs-container .breadcrumb:first-child { font-family: 'Roobert', sans-serif; color: #243508; font-weight: 300}

.breadcrumbs .breadcrumbs-container .breadcrumb:not(.not-border-highlight)                                    {border-bottom: 1px solid #ffffff}
div.breadcrumbs a.breadcrumb:not(.not-border-highlight):hover   {border-bottom: 1px solid #243508}

/****/
h2.section-header,
h2.section-title { font-size: 35px; font-weight: 300; margin-bottom: 0.75em; color: #3C4748; }

.carousel-controls { margin-top: 20px; display: flex; flex-direction: row; align-items: center; gap: 20px; justify-content: space-between; }
.carousel-controls .carousel-buttons { display: flex; flex-direction: row; align-items: center; gap: 20px; }

.slick-arrow,
.key-contacts-v3 .carousel-controls .slick-arrow {border: 2px solid #BFF355 !important; width: 39px; height: 39px; font-size: 0; background-color: transparent; background-image: url("/compliance-club/_assets/icon-slick-arrow.png"); background-size: 21px auto; background-position: center; background-repeat: no-repeat; }

.slick-arrow:hover,
.key-contacts-v3 .carousel-controls .slick-arrow:hover  {background-image: url("/compliance-club/_assets/icon-slick-arrow-dark.png");}

/****/

section.additional-resources .slick-arrow { border: 1px solid #BFF355; background-color: transparent; background-image: url("/_assets/icon-line-arrow-dark-green.png"); }
section.additional-resources .carousel-controls .carousel-buttons { padding: 0; }
sssection.additional-resources .carousel-buttons .slick-arrow { background-size: 17px auto; background-position: center; }

/****/

section.how-can-we-help-you { padding: 40px 0 50px 0; background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; }
section.how-can-we-help-you:before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: #f8f8f8; opacity: 0.85; }

.topic-list { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px;}

.topic-list a       {font-size: 23px; font-weight: 600; background: var(--grad2); min-height: 223px; padding: 18px 20px; color: #243508; text-decoration: none; display: flex; flex-direction: column; justify-content: space-between; gap: 20px; transition: all 0.2s; }
.topic-list a:after { content: ""; display: inline-block; width: 16px; height: 24px; flex-shrink: 0; background-image: url("/compliance-club/_assets/icon-arrow-up-2.png"); background-size: contain; background-position: center; background-repeat: no-repeat; align-self: flex-end; transition: 0.3s ease-out}

.topic-list a:hover         {background: var(--grad);}
.topic-list a:hover:after   {transform: rotate(45deg);}

/****/

.side-toolbar { position: fixed !important; bottom: 250px; right: 0; background-color: transparent !important; z-index: 1000; display: flex; flex-direction: column; }

.side-toolbar .btn-ask-question { padding: 14px; width: 40px; height: 40px; background-image: url("/compliance-club/_assets/icon-question.png"); background-size: 13px auto; background-position: center; background-repeat: no-repeat; background-color: #243508; cursor: pointer;}
.side-toolbar .btn-my-alerts    { margin-bottom: 10px; display: block; padding: 14px; width: 40px; height: 40px; background-image: url("/compliance-club/_assets/icon-alerts.png"); background-size: 20px; background-position: center; background-repeat: no-repeat; background-color: #BFF355; flex-basis: auto !important; cursor: pointer;}

/****/
.wrapper-left { margin-left: calc(100% - calc(600px + 50%)); }

section.gi-guide                    {margin-top: 0; background-position: top right; background-size: cover; background-repeat: no-repeat; padding:50px 0;}
section.gi-guide .content           {padding: 0; display: flex; position: relative; background-color: #E2D6CF}
section.gi-guide .content .intro    {display: inline-block; padding: 35px 40px; width: 410px; font-family: 'Roobert', sans-serif;  font-size: 18px; color: #ffffff; }
section.gi-guide .content .intro h2 {font-size: 35px; font-weight: 600; color: #243508; margin-bottom: 0.8em; line-height: 1.1em }
section.gi-guide .content .intro p  {font-size: 17px; color: #243508;}
section.gi-guide .content .map      {display: inline-block; width: 60%; background-position: top left; background-size: cover; background-repeat: no-repeat; flex: 1}
section.gi-guide .wrapper .col-1    {}

section.gi-guide + div.key-contacts-v3 { margin-top: 0; }



/****/

body.c2019 section.whats-new { padding:0 0 20px 0; }

section.whats-new .carousel                             {margin: 0; width: 887px; max-width: 100%;}
section.whats-new .slick-arrow                          {background-image: url("/_assets/icon-line-arrow-dark-green.png"); }
section.whats-new .carousel-container-flex              {display: flex; width: 100%;}
section.whats-new .carousel-container .carousel-buttons {margin-top: 30px;}

.knowhow-panel {  }

.knowhow-panel.slick-slide {/* padding: 0 10px; */ margin-right: 20px; }

.topic-panel > a,
.knowhow-panel > a { text-decoration: none; }

.topic-panel .inner { border-top-color: #dddddd; }

.topic-panel .inner,
.knowhow-panel .inner 		{background-color: #F3EFEC; padding:0; transition: background-color 0.2s; }

.whats-new .carousel-container .knowhow-panel.pinned .inner 		{position: relative;}
/*.whats-new .carousel-container .knowhow-panel.pinned .inner:after 	{	content: ''; position: absolute; top: 10px; right: 10px; width: 20px; height: 20px; z-index: 9;
																		background-image: url('/compliance-club/_assets/pin.png'); background-position: center; background-size: contain;
																		background-repeat: no-repeat;}*/


.topic-panel .inner .content,
.knowhow-panel .inner .content  {padding: 17px 17px 24px; display: flex; flex-direction: column; justify-content: space-between}

.topic-panel:hover .inner,
.knowhow-panel:hover .inner { background-color: #e0e0e0; }


.knowhow-panel .type,
.topic-panel .type { font-size: 13px; margin-bottom: 2px; }

.knowhow-panel .date,
.topic-panel .date { font-size: 13px; margin-bottom: 1em; color: #243508; }

.knowhow-panel .type-and-date { margin-bottom: 1em; }
.knowhow-panel .type-and-date p:last-child { margin-bottom: 0; }

.knowhow-panel .title      {font-size: 17px; color: #243508}
.topic-panel .title        {font-size: var(--font-21); margin: 0; color: #243508; }

.knowhow-panel .image { margin-top: 15px;  height: 126px; background-size: cover; background-position: center; background-repeat: no-repeat; }


.search-results {margin-top: 25px; }

div.search-results h3 { font-family: 'Roobert', sans-serif; color: #3C4748; margin-bottom: 1em; font-size: 20px; }

.search-results-list .search-context { font-size: 14px; line-height: 1.2em; margin-top: 0px; font-family: 'Roobert', sans-serif; color: #3C4748; padding: 0 17px 30px}

.search-results-list .search-highlight { color: #243508; font-weight: bold; }

.no-search-results p { color: #000000; font-size: 16px; margin-bottom: 0; }

.type-tag       {display: flex; align-items: center; gap: 9px;}
.type-tag p     {font-weight: 500; margin: 0; color: #243508}
.tag-icon       {width: 45px; height: 45px; display: flex; justify-content: center; align-items: center; background-color: #BFF355; flex-shrink: 0;}


.tag-icon img {width: 25px; height: auto;}


.panel-btn      {background-color: #243508; display: flex; flex-direction: column; justify-content: flex-end; padding: 25px 33px; text-decoration: none; flex: 1;}
.panel-btn p    {color: #BFF355; font-size: 33px; font-weight: 700; display: flex; justify-content: space-between; align-items: flex-end; margin: 0;}
.panel-btn span {width: 18px; height: 18px; display: block; background-image: url(/compliance-club/_assets/icon-arrow-up.png); background-size: cover;; transition: 0.3s ease-out; position: relative; top: -7px;}

.panel-btn:hover p      {color: #ffffff;}
.panel-btn:hover span   {filter: brightness(100); transform: rotate(45deg);}

/****/
.popup-form .header h2 { font-size: 24px; color: #243508; margin-bottom: 0.8em; }

.popup-form .header .icon-and-title { display: flex; flex-direction: row; gap: 10px; align-items: center; margin-bottom: 16px; }
.popup-form .header .icon-and-title img { height: 30px; width: auto; }
.popup-form .header .icon-and-title h2 { margin: 0; }


.popup-modal .popup-form .form-field input[type=text] { border-color: #6FA739; padding: 8px; }

.popup-modal .standard-page-content p { line-height: 1.3em; color: #3C4748; font-size: 17px;  }

.popup-modal .popup-form .checkbox-field .checkbox-marker { border-color: #6fa739; }

.popup-modal .popup-form .checkbox-field label:not(.checkbox-marker) { color: #3C4748; }


/* BUTTONS */
.btn-standard           {font-weight: 500; font-size: 15px; font-family: 'Roobert', sans-serif;}
.btn-dark               {background-color: #243508; border-color: #243508; color: #ffffff;}
.btn-standard.arrow:after   {width: 16px; height: 16px; background-image: url(/compliance-club/_assets/icon-arrow-up.png); content: ''; background-size: cover; transition: 0.3s ease-out}

.btn-dark:hover         {background-color: transparent; color: #243508}

.btn-standard.arrow:hover:after {transform: rotate(45deg);}

.btn-standard.btn-dark.arrow:hover:after    {background-image: url(/compliance-club/_assets/icon-arrow-up-2.png);}

.key-contacts-v3 .btn-contact-us                {padding-left: 14px; padding-right: 14px}
.btn-green.btn-contact-us:before,
.key-contacts-v3 .btn-contact-us:before         {width: 24px; height: 17px; background-image: url(/compliance-club/_assets/icon-email.png);}
.key-contacts-v3 .btn-contact-us:hover:before   {background-image: url(/compliance-club/_assets/icon-email-white.png);}

.btn-green.btn-contact-us           {background-color: #BFF355; border-color: #BFF355; font-size: 16px; font-weight: 500;}
.btn-green.btn-contact-us:before    {content: ''; background-size: cover;}
.btn-green.btn-contact-us:hover     {color: #243508; border-color: #243508; background-color: transparent}

/* NEW FORM STYLES */
.popup-modal .popup-form             {max-width: 700px;}
.popup-modal .popup-form .checkbox-field label     {font-size: 16px !important;}
.popup-modal .popup-form .wrapper    {padding: 30px 50px;}
.popup-modal .popup-form .header     {top: -30px !important; padding-top: 10px;}
/*
.popup-modal .popup-form .header h2  {font-size: 33px; font-weight: 500; color: #243508; margin-bottom: 0.3em; padding-right: 56px;}
*/
.popup-modal .popup-form .form-field label  {font-size: 16px; color: #243508; margin-bottom: 8px;}
.popup-modal .popup-form .form-field input[type=text]   {background-color: #F0EAE7; padding: 12px; color: #243508; border: none}
.popup-modal .popup-form .checkbox-field .checkbox-marker   {background-color: #F0EAE7; border:2px solid #929A83}
.popup-modal .popup-form .btn-standard  {background-color: #BFF355; font-weight: 500; color: #243508; border: 1px solid #BFF355;}
.popup-modal .popup-form .btn-standard:hover    {background-color: transparent;}

.popup-modal .popup-form .close-popup   {width: 46px; height: 46px; background-color: #BFF355; top: 0; right: 0; border-radius: 0; background-image: url("/compliance-club/_assets/icon-close.png"); background-size: 20px auto}

/****/

.switch { display: flex; flex-direction: row; align-items: center; margin: 0; gap: 20px; }
.switch .status-text { color: #000000; vertical-align: initial; }


.switch .switch-status { height: initial; width: initial; margin: 0; }
.switch .slider { position: relative; display: inline; top: initial; left: initial; right: unset; bottom: unset; height: 24px; width: 40px; cursor: pointer; background-color: transparent; box-shadow: 0px 0px 0px 1px #9a9a9a; -webkit-transition: .4s; transition: .4s; }
.switch .slider:before { background-color: #381634; border: 1px solid #9a9a9a; height: 16px; width: 16px; top: 1px; right: 2px; transition: all 0.4s; }
.switch input[type=checkbox]:checked + .slider:before { transform: translateX(-22px); }




/* 2025 SOCIAL LIST */
ul.share-icons li                       {margin-right: 0; margin-left: 5px;}
ul.share-icons li .share-icon           {border-radius: 0; width: 45px; height: 45px; background-color: #BFF355; border:1px solid #BFF355;}
ul.share-icons li .share-icon.twitter   {background-image: url(/compliance-club/_assets/icon-x.png) !important; background-size: 21px auto;}
ul.share-icons li .share-icon.linkedin  {background-image: url(/compliance-club/_assets/icon-linkedIn.png) !important; background-size: 19px auto;}
ul.share-icons li .share-icon.youtube   {background-image: url(/compliance-club/_assets/icon-youtube.png) !important; background-size: 24px auto;}
ul.share-icons li .share-icon.email     {background-image: url(/compliance-club/_assets/icon-share.png) !important; background-size: 23px auto;}

ul.share-icons li .share-icon:hover     {background-color: transparent;}

/* PAGE HEADING 2025 */
.page-heading h1    {font-size: 35px; font-weight: 300; color: #243508}

section.topic  {margin-top: 10px !important;} 

.standard-page-content:not(.inherit) ol,
.standard-page-content ol li,
.standard-page-content ul,
.standard-page-content ul li,
.standard-page-content p,
.standard-page-content a,
.wrapper .standard-page-content:not(.inherit) tr th,
.wrapper .standard-page-content:not(.inherit) tr td {color: #243508}

/* CONTACT RIGHT COL */
.contacts-container {background-color: #F3EFEC; padding: 28px 33px}



/* ********* */
/* DROP KICK */

.dk-select,
.dk-select * { font-family: Roobert, sans-serif; color: #000000; }

.dk-select.white .dk-selected,
.dk-select-multi.white .dk-selected { border-color: #ffffff; background-color: #ffffff; }

.dk-select.white .dk-select-options .dk-option-highlight,
.dk-select-multi.white .dk-select-options .dk-option-highlight { color: #000000; }

.dk-selected { border-color: var(--hl-taupe); background-color: var(--hl-taupe); width: 180px; }
.dk-select-options { background-color: var(--hl-taupe); }

.dk-select.white .dk-select-options,
.dk-select-multi.white .dk-select-options { background-color: #ffffff; }

.dk-select-options-highlight .dk-option-selected,
.dk-option-selected { background-color: rgba(var(--hl-dark-green-rgb), 0.3); color: var(--hl-dark-green); }


.dk-select-options .dk-option-highlight { background-color: rgba(var(--hl-dark-green-rgb), 0.2); color: #ffffff; }


.dk-select-open-down:not(.dk-always-open-up) .dk-select-options { padding: 10px; }
.dk-option { padding: 0.4em 20px; }

.dk-checkboxes li.dk-option { padding-left: 35px; }
.dk-checkboxes li.dk-option:before { left: 5px; border-color: var(--hl-dark-green); }


section.header-and-filter .filter-field,
section.header-and-filter .filter-field.topic,
section.header-and-filter .filter-field.date {width: auto !important;}


section.whats-new .btn-see-all.mobile { display: none;}
.carousel-controls { margin-top: 20px; display: flex; flex-direction: row; align-items: center; justify-content: space-between; }
.carousel-controls a.btn-see-all.mobile:after { width: 16px; height: 16px; }
section.whats-new .btn-see-all:after { content: ""; display: block; background-image: url(/_assets/icon-line-arrow-hl-light-green.png); background-position: center; background-size: contain; background-repeat: no-repeat; transform: rotate(-45deg);}

section.whats-new .btn-see-all:hover { background-color: var(--hl-light-green); color: var(--hl-dark-green); }
section.whats-new .btn-see-all:hover:after {background-image: url(/_assets/icon-line-arrow-hl-dark-green.png); }

@media (max-width: 730px)
{
	section.whats-new .btn-see-all { display: inline-block; border: 1px solid var(--hl-dark-green); background-color: var(--hl-dark-green); padding: 10px; color: #ffffff; text-decoration: none; transition: all 0.2s;}
	section.whats-new .btn-see-all.mobile { display: inline-flex; flex-direction: row; align-items: center; gap: 10px; }
	section.whats-new .carousel-container .carousel-buttons {margin-top: 0px; }
}


.popup-modal .form-fields {display: flex !important; flex-wrap: wrap !important; gap: 20px !important; }
.popup-modal .form-fields .form-row.two-col {display: flex; gap: 30px; flex: unset; width: 100%; }
.popup-modal .form-fields .form-row.two-col .form-field {flex: 1;}

@media (max-width: 640px)
{
	.popup-modal .form-fields .form-row.two-col {flex-direction: column;}
}










@media (max-width: 1210px) {
   section.topic-header .header { padding-left: 10px; }
}

@media (max-width: 1200px) {
   .wrapper-left { margin-left: auto; }

   .key-contacts-v3 { padding-bottom: 80px; }

   section.gi-guide { padding-bottom: 30px; }
   section.gi-guide .content .map { width: calc(100% - 465px); }
    
    section.whats-new .carousel {width: calc(79% - 40px);}
    .panel-btn                  {}
    
}

@media (max-width: 1000px) {
   section.topic-header .header-container { width: 100%; max-width: 620px; }
    
    .topic-list {grid-template-columns: repeat(4, 1fr);}
}

@media (max-width: 960px) {
    section.whats-new .carousel {width: calc(72% - 40px);}
}

@media (max-width: 900px) {

}

@media (max-width: 850px) {
   .key-contacts-v3 { padding-bottom: 60px; }
    .popup-modal .popup-form .wrapper   {padding: 30px;}
}

@media (max-width: 800px) {
 
    .topic-list {grid-template-columns: repeat(3, 1fr);}

}
    
@media (max-width: 740px) {
   .default-header .header-and-events { flex-direction: column; }
   .default-header .header-and-events .events-container { width: 100%; flex-basis: 100%; }

   section.toolbar .col-1               {display: grid; grid-template-areas: "search actions" "social social"; grid-row-gap: 20px; grid-template-columns: 2fr 1fr; }
   section.toolbar .share-icons         {grid-area: social; justify-self: end; }
   section.toolbar .search-container    {grid-area: search; width: 100%; margin: 0; }
   section.toolbar .actions-container   {grid-area: actions; flex-shrink: 1; }

	
	.additional-resources,
	.key-contacts-v3 {padding: 0 20px;}
	
    .whats-new .carousel-container      {overflow: hidden;}
    .whats-new .panel-btn               {display: none}
    section.whats-new .carousel         {width: calc(100% + 20px); margin-left: -10px; max-width: unset}
    .knowhow-panel.slick-slide          {margin: 0 10px;}

    section.gi-guide .content   {flex-direction: column-reverse;}
    section.gi-guide .content .map  {height: 50vw; width: 100%; flex:0 0 auto}
    section.gi-guide .content .intro    {width: 100%; padding:35px 30px;}
}

@media (max-width: 650px) {

    .col-1, .col-2, .col-3, .col-4  {padding-left: 18px; padding-right: 18px;}
    
    .key-contacts-v3 a.btn-contact-us   {position: absolute; bottom: 0; right: 16px; padding-top: 10px; padding-bottom: 10px;}
    .key-contacts-v3 .col-1             {padding-bottom: 0}
}

@media (max-width: 640px) {

    .topic-list     {display: block; width: calc(100% + 20px);}
    .topic-list a.slick-slide   {margin-right: 20px; display: flex;}
    
    .how-can-we-help-you                    {overflow: hidden;}
    .how-can-we-help-you .carousel-buttons  {padding-left: 18px; margin-top: 20px;}
    .how-can-we-help-you .slick-arrow       {background-image:url(/compliance-club/_assets/icon-slick-arrow-dark.png);}
}
    
@media (max-width: 600px) {
	.key-contacts-v3 { padding-bottom: 40px; }
	.key-contacts-v3 .key-contact {height: 96vw; }
    
    .popup-modal .popup-form .header    {padding-bottom: 10px;}
    .popup-modal .form-row.two-col  {display: block}
    .popup-modal .popup-form .form-field    {margin-bottom: 15px;}
}

@media (max-width: 540px) {
    
   section.toolbar .col-1           {grid-template-areas: "search" "actions" "social"; grid-template-columns: 1fr; }
    section.toolbar .share-icons    {justify-self: start}
    ul.share-icons li               {margin-left: 0; margin-right: 5px;}
}

@media (max-width: 500px) {
    
    section.whats-new .carousel                 {width: calc(100% + 200px)}
    section.whats-new .carousel .slick-list     {overflow: visible}
    section.whats-new .carousel-container       {width: calc(100% + 18px);}
    section.whats-new .carousel .slick-slide    {opacity: 0.5;}
    section.whats-new .carousel .slick-current  {opacity: 1;}
    section.whats-new .carousel-container-flex  {display: block;}
    
    .how-can-we-help-you .slick-list      {overflow: visible}
    .how-can-we-help-you .slick-slide     {opacity: 0.5}
    .how-can-we-help-you .slick-current   {opacity: 1}
    .topic-list                           {width: calc(100% + 218px);}
    
}

@media (max-width: 440px) {
   .topic-list { grid-template-columns: 1fr; }
}

@media (max-width: 340px) {
   section.toolbar .actions-container { flex-direction: column; align-items: start; }
}




