/* Resetting all styling + Adding base styling */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: "Roboto", sans-serif;

}

/* Modifying delite styling */
.dlt-links.standalone {
	text-decoration: none;
}

.dlt-links:focus {
	outline: var(--dlt-border-width-hover, 2px) var(--dlt-border-style-hover, solid) var(--dlt-cards-color-interactive-primary-default, var(--dlt-component-color-interactive-primary-default, var(--dlt-color-background-interactive-primary-default, #1776bf))) !important;
	outline-offset: 2px;
	text-decoration: underline !important;
}

.multiselect-icon {
	line-height: 1.2 !important;
}

/* Body element styling  */

body {
	margin: 0px;
	height: 100vh;
	width: 100vw;
	overflow-y: hidden;
	overflow-x: hidden;

	/* OLD - iOS 6-, Safari 3.1-6 */
	-webkit-box-flex: 1;
	/* Safari 6.1+. iOS 7.1+, BB10 */
	-webkit-flex: 1;
	/* IE 10 */
	-ms-flex: 1;
	/* NEW, Spec - Firefox, Chrome, Opera */
	flex: 1;

	-moz-flex-direction: column;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
}

/* Main Nav-bar + Nav-bar elements styling  */
#master-nav {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 999;
	column-gap: 16px;

	display: -moz-flex;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;

	-moz-align-items: center;
	-webkit-align-items: center;
	-ms-align-items: center;
	align-items: center;

	padding: 12px 16px;
}

#master-nav .logo {
	display: inline-block;
	height: 40px;
	width: auto;
	padding: 4px;
}

#master-nav .logo img {
	height: 32px;
}

/* Left menu of main nav bar styling */
/* This contain the global search, app switch(optional), elipses men(optional) */
.utility-wrapper {
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;

	display: -moz-flex;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;

	-moz-justify-content: right;
	-webkit-justify-content: right;
	-ms-justify-content: right;
	justify-content: right;
}

/* Download button */
#deliverable-download {

    padding: 4px;
    margin-right: 10px;

}

.shortdesc {
    padding: 0px;
}

.remark {
    padding: 0px;
	margin-top: 15px;
}

/**
* * DUMMY styling for .global-search (in main nav-bar). 
* * Will be replaced by Google Programmable Search in the future
*/
.search-icon{
   margin-top: 4px;
   position: relative;
 }
 .search-icon:hover{
	 cursor: pointer;
	 border-radius: 0px;
 }
 .search-input
 {
	 min-width: 120px;
	 width: 100%;
	 /*max-width: 480px !important;*/
	 height: 32px;
	 border: none;
	 overflow: hidden;
	 padding: 5px;
 }
 input[type=text]:focus {
	 border: none !important;
	 outline: none !important;
	   }
 #searchbox
 {
	 width: 100%;
	 max-width: 480px;
 }
 form.search {
		display: flex;
		 border: solid #011f3d 1px;
		 font-size: 14px;
	     font-style: italic;
	  }

/*#gcse-searchbox {
	min-width: 120px;
	width: 100%;
	max-width: 480px;
	height: 32px;
	border: solid #011F3D 1px;
	overflow: hidden;
}
/* Search button icon in searchbox 
.gsc-search-button-v2 svg {
    height: 16px !important;
    width: 16px !important;
}
/* "td" that contains the search input box 
table.gsc-search-box td#gs_tti50 {
    padding: 2px 4px !important;
}*/

/* Search button 
.gsc-search-button-v2 {
    padding: 4px !important;
    margin-top: -0.5px;
    margin-right: 4px;
}

.gsc-search-button-v2:hover{
    outline: solid #058192 2px;
    outline-offset: -2px;
    cursor: pointer;
    border-radius: 0px;
}

.gsc-search-button-v2:active{
    outline: solid #058192 2px;
    outline-offset: -2px;
    cursor: pointer;
    border-radius: 0px;
    background-color: #c5edea;
}*/


/**
* * DUMMY styling for .global-search (in main nav-bar). 
* * Will be replaced by Google Programmable Search is the future
*/

/*
form.gsc-search-box {
	min-width: 120px;
	width: 100%;
	max-width: 400px;
	height: 32px;
	border: solid #011F3D 1px;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 4px 2px 4px 6px;
}
form.gsc-search-box::before{
	content: 'Search all Software AG Documentation';
	font-size: 14px;
	font-style: italic;
	display: inline-block;
	flex: 1;
}

form.gsc-search-box:lang(de)::before {
	content: 'Suche in gesamter Software AG Dokumentation';
	font-size: 14px;
	font-style: italic;
	display: inline-block;
	flex: 1;
}

form.gsc-search-box:lang(ja)::before {
	content: 'Software AG ドキュメント全体を検索する';
	font-size: 14px;
	font-style: italic;
	display: inline-block;
	flex: 1;
}

form.gsc-search-box::after {
	content: ' ';
	background-image: url('../images/search-icon.svg');
	height: 32px;
	width: 32px;
	background-repeat: no-repeat;
	background-position: center center;
}

/* Landing hero banner styling */
.landing-hero-banner {
	height: 160px;
	min-height: 160px;
	max-height: 160px;

	background-color: transparent;
	color: white;
	position: relative;

	display: -moz-flex;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;

	-moz-flex-direction: row;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;

	-moz-align-items: center;
	-webkit-align-items: center;
	-ms-align-items: center;
	align-items: center;
}

.landing-hero-banner .title-container {
	/* OLD - iOS 6-, Safari 3.1-6 */
	-webkit-box-flex: 1;
	/* Safari 6.1+. iOS 7.1+, BB10 */
	-webkit-flex: 1;
	/* IE 10 */
	-ms-flex: 1;
	flex: 1;

	padding-left: min(70px, 5vw);
	color: white;
}

.landing-hero-banner .title-container h1 {
	font-size: 32px;
	font-weight: 40px;
	font-weight: bolder;
	color: white;
}

.landing-hero-banner .image-container {
	height: 100%;
	width: 100%;
	overflow: clip;

	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
}

.landing-hero-banner .image-container img {
	height: 100%;
	width: 100%;
	object-fit: cover;
}

/* Main content area styling */
.main-content {
	overflow-y: auto;
	overflow-x: hidden;

	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;

	display: -moz-flex;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;

	-moz-flex-direction: column;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;

	height: calc(100vh - 64px);
	margin-top: 60px;
}

/* div.product-details-wrapper styling */
/* This wraps the breadcrumbs, left toc and docs list */
.product-details-wrapper {
	height: max-content;
	padding: 24px min(70px, 5vw) 40px;
}

/* Breadcrumbs styling */
nav[aria-label="breadcrumb"] {
	padding-bottom: 8px;
}

/* Product details div styling */
/* Contains the left toc and docs list */
.product-details-wrapper .product-details {
	display: -moz-flex;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;

	column-gap: 18px;
	position: relative;
}

/* Left toc styling */
/* Includes the version picker and left toc */
.left-toc-wrapper {
	padding-top: 24px;
	height: max-content;
	width: 340px;
	position: sticky;
	top: 0px;
}

.version-dropdown{
	width: 320px;
}

#version-dropdown-select{
	width: 100%; /* Modified 3: Ensured dropdown container spans the entire width */
	margin: 0px; /* Modified 4: Removed unwanted margin */
	background-color: white; /* Modified 6: Added background color */
	padding: 8px;
	color: var(--dlt-component-color-text-default,#011F3D);
	border: var(--dlt-border-width-default,1px) var(--dlt-border-style-default,solid) var(--dlt-forms-color-border-input-default,var(--dlt-component-color-border-input-default,var(--dlt-color-border-interactive-secondary,#666)));
}

/* Modified 2: Styling for default HTML version picker. This makes it look closer to delite. */
select#version-dropdown-select:focus{
	outline: var(--dlt-border-width-default, 2px) var(--dlt-border-style-default, solid) var(--dlt-forms-color-interactive-primary-default, var(--dlt-component-color-interactive-primary-default, #058192));
}

select#version-dropdown-select option{
	color: var(--dlt-component-color-text-default,#011F3D);
}

.chosen-container .chosen-results li.active-result {
	display: inline-block;
	position: relative;
	width: 100%;
	/* padding: 6px 8px; */ /* Modified 5: Removed redundent padding */
	padding-right: 65px;
}

.chosen-container .chosen-results li.active-result.updated::before {
	content: 'Updated';
	background: linear-gradient(to right, #8E3CF7 0%, #8E3CF7 20%, #7D58E9 33%, #5A91CE 61%, #44B4BD 82%, #3CC1B6 93%);
	border-radius: 40px;
	padding: 2px 7px;
	font-size: 10px;
	position: absolute;
	right: 4px;
	top: 4px;
}

.chosen-container .chosen-results li.active-result.updated::after {
	content: 'Updated';
	background: white;
	border-radius: 40px;
	padding: 0.5px 5px;
	font-size: 10px;
	position: absolute;
	right: 6px;
	top: 5.6px;
	color: #8E3CF7;
	font-weight: bold;
}

.version-dropdown .fa-solid.fa-caret-down {
	font-size: 20px;
	margin-top: 4px;
	margin-right: 4px;
}


/* Toc header styling */
/*
 *.emphasis-title::before {
 *	content: '';
 *	width: 250px;
 *	height: 1px;
 *	display: inline-block;
 *	background-color: #7E96AE;
 *	margin-bottom: 12px;
 *}
 */

.emphasis-title {
	/* line-height: 20px; */
	font-weight: 500;
	font-size: 18px;
	margin-bottom: 14px;
	margin-top: 20px;
	height: max-content;
}

/* Left toc topics styling */
span.toc-item {
	display: block;
	font-size: 14px;
	line-height: 24px;
	font-weight: 500;
	padding: 10px 4px 10px 16px;
	border-left: solid #F0F2F4 4px;
	width: 100%;
	transition: background-color 150ms ease-in-out, font-weight 150ms ease-in-out;
	color: #36597D;
}

span.toc-item:hover {
	cursor: pointer;
	color: #011f3d;
	outline: solid #058192 2px;
	outline-offset: -2px;
}

span.toc-item.active {
	color: #011f3d;
	font-weight: 600;
	border-left-color: #058192;
	background-color: #F0F2F4;
	border-bottom: solid #DBDEE0 1px;
	border-top: solid #DBDEE0 1px;
	border-right: solid #DBDEE0 1px;
}

/* Left page content styling*/
/* Wrapers the in page search, quick filter and topics list */

/* actually a products-card-container... */

.products-list-container-orig {
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-moz-flex-direction: column;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;

	-moz-align-items: center;
	-webkit-align-items: center;
	-ms-align-items: center;
	align-items: center;
}


.products-list-container {
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-moz-flex-direction: row;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;

	-moz-align-items: flex-start;
	-webkit-align-items: flex-start;
	-ms-align-items: flex-start;
	align-items: flex-start;
}
.products-view
{
	display: flex; 
	justify-content: space-between; 
	align-items: center;
	margin-left: 10px;
}

/* Category dropdown styling */
/* Showing only for smaller resolutions */
.categories-filter-sm {
	width: 320px;
	margin-top: 16px;
	display: none;
}

.categories-filter-sm .fa-solid.fa-caret-down {
	font-size: 20px;
	margin-top: 4px;
	margin-right: 4px;
}

/* In page search and quick filter tags styling */
.quickfilter-search-container {
	position: sticky;
	top: 0px;
	background-color: white;
	z-index: 1;
	padding: 12px 0px;
	padding-top: 32px;

	grid-column: 1/-1;
}

/* version dropdown for smaller screens styling */
.version-dropdown-sm {
	width: 320px;
	margin-bottom: 32px;
	display: none;
}

.version-dropdown-sm .fa-solid.fa-caret-down {
	font-size: 20px;
	margin-top: 4px;
	margin-right: 4px;
}

/* Quick-filter header styling */
.quickfilter-search-container h3 {
	font-size: 22px;
	font-weight: 500;
}

.quickfilter-search-container #valid-topic-count {
	color: #36597D;
}

/* In page search styling */
.search-input-container {
	display: flex;
	width: 320px;
	align-items: center;
	column-gap: 12px;
	border: solid #7E96AE 1px;
	margin: 8px 0px;
}

.search-input-container input[type="text"] {
	border: none;
	outline: none;

	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

/* Quickfilter selectable tags styling (Recently Updated tag) */
.dlt-tags .dlt-tags__item {
	margin-top: 6px;
	transition: all 150ms ease-in-out;
}

.dlt-tags[data-allow-selection] .dlt-tags__item--selected::before {
	display: none;
}

.dlt-tags .dlt-tags__item i {
	margin-left: 2px;
	display: none;
}

.dlt-tags[data-allow-selection] .dlt-tags__item.dlt-tags__item--selected i {
	display: block;
}

#recent-filter .dlt-icon-close {
	margin-top: -2px;
	font-size: 16px;
}

/* Topic container and card styling */
.grid-view{
	display: -ms-grid;
	display: grid;

	grid-template-columns: repeat(auto-fit, minmax(300px, 360px));
	width: 100%;
	column-gap: 24px;
	row-gap: 20px;
	/* orig row-gap: 24px;  */

	-moz-justify-content: center;
	-webkit-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
}
/* Topic container and list styling */
.list-view{
	display: -ms-grid;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	width: 95%;
	column-gap: 24px;
	row-gap: 20px;
	margin: 0 auto;
	/* orig row-gap: 24px;  */

	/*-moz-justify-content: center;
	-webkit-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;*/
}

/* use that for h3 with category title when in list context */
.category-title-in-list {
    padding-top: 24px;
    padding-bottom: 24px;
}

/* 1. Modified: Added styling for Categories header, short descriptions and remark. 
This makes it span the entire width of the parent container. */
.topics-list h3{
	grid-column: 1/-1;
}

/* deprecated */
.topics-list > .shortdesc {
	grid-column: 1/-1;
}
    
.topics-list > .project-shortdesc {
	grid-column: 1/-1;
}

.topics-list > .component-shortdesc {
	grid-column: 1/-1;
}

.topics-list > .remark {
	grid-column: 1/-1;
}

/*.topics-list > .topic-li {
	grid-column: 1/-1;
}*/
.products-view{
    grid-column: 1/-1;
}


.topic-card {
	min-height: 160px;
	height: max-content;

	background-color: white;
	border: solid #D4D8DD 1px;
	padding: 34px 12px 12px;
	position: relative;

	display: none;

	-moz-flex-direction: column;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
}

.topic-li {
	min-height: 20px;
	height: max-content;

	background-color: white;
	/*border: solid #D4D8DD 1px;*/
	padding: 2px 12px 0px;
	position: relative;
	-moz-flex-direction: row;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
}

.topic-card[search-valid="true"][filter-valid="true"] {
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
}

.topic-li[search-valid="true"][filter-valid="true"] {
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
}
.topic-li[filter-valid="false"]
{
	display: none !important;
}
.topic-card[filter-valid="false"]
{
	display: none !important;
}

/* Hover interaction styling for topic card */
.topic-card::before {
	content: "";
	position: absolute;
	top: 0px;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 0;
	height: 2px;
	border-top: 2px;
	background: linear-gradient(99.14deg, #8e3cf7 6.93%, #3cc1b6 93.07%);
	-webkit-transition: width .2s;
	transition: width .2s;
}

/* Hover interaction styling for topic card */
.topic-li::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0px;;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 2px;
	height: 0;
	border-left: 2px;
	background: linear-gradient(99.14deg, #8e3cf7 6.93%, #3cc1b6 93.07%);
	-webkit-transition: height .2s;
	transition: height .2s;
}

.topic-card:focus,
.topic-card:focus-visible,
.topic-card:hover {
	box-shadow: 0px 2px 12px 2px rgba(1, 31, 61, 0.12);
	cursor: -moz-pointer;
	cursor: -webkit-pointer;
	cursor: pointer;
	transition: box-shadow 150ms linear;
	outline: transparent;
}

.topic-li:focus,
.topic-li:focus-visible,
.topic-li:hover {
	box-shadow: 0px 2px 12px 2px rgba(1, 31, 61, 0.12);
	cursor: -moz-pointer;
	cursor: -webkit-pointer;
	cursor: pointer;
	transition: box-shadow 150ms linear;
	outline: transparent;
}


.topic-card:focus::before,
.topic-card:focus-visible::before,
.topic-card:hover::before {
	width: 100%;
}

.topic-li:focus::before,
.topic-li:focus-visible::before,
.topic-li:hover::before {
	width: 100%;
}


/* Topic card content styling */
/* This wraps the Topic card's title, description, update-tag and category tag */
.topic-card .topic-card-content {
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-moz-flex-direction: column;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;

	-moz-justify-content: center;
	-webkit-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;

	padding: 0px 0px 12px 0px;
}

.topic-li .topic-li-content {
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-moz-flex-direction: row;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;

	-moz-justify-content: flex-start;
	-webkit-justify-content: flex-start;
	-ms-justify-content: flex-start;
	justify-content: flex-start;

	padding: 5px 0px 5px 0px;
}


.topic-card .topic-card-content .topic-title {
	font-weight: bold;
	font-size: 16px;
	line-height: 20px;
}
.topic-card-content .topic-title{
	top: 2.5rem;
	display: block;
	position: absolute;
}

.topic-li .topic-li-content .topic-title {
	font-weight: bold;
	font-size: 14px;
	line-height: 18px;
}

.topic-card .topic-category {
	width: max-content;
	max-width: 80%;
	background-color: #E2DFDF;
	display: none;
	font-size: 10px;
	line-height: 14px;
	padding: 2px 6px;
	margin-top: 16px;
}

.topic-li .topic-category {
	width: max-content;
	max-width: 80%;
	display:none;
	background-color: #E2DFDF;
	font-size: 10px;
	line-height: 14px;
	padding: 2px 2px 0px 2px;
	margin-left: 10px;
}

.topic-li .module-shortdesc {
    margin-left: 10px;
}

.topic-li .module-download {
    /*
    -moz-justify-content: flex-end;
	-webkit-justify-content: flex-end;
	-ms-justify-content: flex-end;
	justify-content: flex-end;
*/
	-moz-align-items: flex-end;
	-webkit-align-items: flex-end;
	-ms-align-items: flex-end;
	align-items: flex-end;
	width: max-content;
}    
.topic-card #module-download
{
	position: absolute;
	top: 2.5rem;
	right: 1rem;
	margin: 0;
	display: inline-block;
}
.topic-li #module-download
{
	position: absolute;
	display: inline-block;
	right: 3rem;
}
.topic-li #module-download
{
	padding-left: 2rem;
}

h5.topic-title a.topic-link {
    color: black;
    text-decoration: none;
}

.topic-card a.action-link,
.topic-li a.action-link {
	font-size: 14px;
	line-height: 20px;
	font-weight: bold;
	color: #058192;
	height: 18px;

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-moz-align-items: center;
	-webkit-align-items: center;
	-ms-align-items: center;
	align-items: center;

	column-gap: 4px;
	width: max-content;
	border: solid transparent 1px;
}

.topic-card a.action-link:hover,
.topic-li a.action-link:hover {
	text-decoration: none;
	cursor: pointer;
	border-bottom: solid #058192 1px;
}

.topic-card .action-link i {
	font-size: 12px;
	line-height: 18px;
	padding-top: 2px;
}

.topic-li .action-link i {
	font-size: 12px;
	line-height: 18px;
	padding-top: 2px;
}


/* Styling recently updated tag on the topic card */
.topic-card .topic-card-content[update-date]::before {
	/* content: ''; */
	content: "Updated in " attr(update-date);
	font-size: 10px;
	font-weight: bold;

	background: linear-gradient(to right, #8E3CF7 0%, #8E3CF7 20%, #7D58E9 33%, #5A91CE 61%, #44B4BD 82%, #3CC1B6 93%);
	padding: 6px 8px;
	border-radius: 100px;

	display: inline-block;
	position: absolute;
	right: 6px;
	top: 8px;
}

.topic-li .topic-li-content[update-date]::before {
	/* content: ''; */
	content: "Updated in " attr(update-date);
	font-size: 10px;
	font-weight: bold;

	background: linear-gradient(to right, #8E3CF7 0%, #8E3CF7 20%, #7D58E9 33%, #5A91CE 61%, #44B4BD 82%, #3CC1B6 93%);
	padding: 6px 8px;
	border-radius: 100px;

	display: inline-block;
	position: absolute;
	right: 6px;
	top: 8px;
}

.topic-card .topic-card-content[update-date]::after {
	content: "Updated in " attr(update-date);
	font-size: 10px;
	font-weight: bold;
	color: #8E3CF7;

	background: white;
	padding: 4px 6px;
	border-radius: 100px;

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-moz-justify-content: center;
	-webkit-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;

	-moz-align-items: center;
	-webkit-align-items: center;
	-ms-align-items: center;
	align-items: center;

	position: absolute;
	right: 7.8px;
	top: 10px;
}

.topic-li .topic-li-content[update-date]::after {
	content: "Updated in " attr(update-date);
	font-size: 10px;
	font-weight: bold;
	color: #8E3CF7;

	background: white;
	padding: 4px 6px;
	border-radius: 100px;

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-moz-justify-content: center;
	-webkit-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;

	-moz-align-items: center;
	-webkit-align-items: center;
	-ms-align-items: center;
	align-items: center;

	position: absolute;
	right: 7.8px;
	top: 10px;
}


/* Footer styling */
.custom-footer {
	background-color: #E7EBEE;
	padding: 70px 10% 70px;
}

.footer-top {
	text-align: left;
}

.footer-logo {
	display: inline-block;
	width: 150px;
	height: 50px;
}

.footer-line {
	border: 0;
	height: 1px;
	background-color: #ccc;
	margin: 10px 0;
}

.footer-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding-top: 16px;
	padding-bottom: 12px;
}

.footer-container .resources {
	flex: 1;
	display: flex;
	flex-wrap: wrap;
	column-gap: 24px;
	min-width: 700px;
}

.footer-column {
	min-width: 200px;
	margin-bottom: 20px;
}

.footer-column.intro {
	max-width: 440px;
	flex: 1;
}

@media only screen and (max-width: 750px) {
	.footer-container {
		flex-direction: column;
	}

	.footer-container .resources {
		min-width: revert;
	}
}

.footer-column h3 {
	font-size: 16px;
	line-height: 20px;
	margin-bottom: 10px;
	color: #011F3D;
	font-weight: 650;
}

.footer-column a {
	display: block;
	color: #36597D;
	text-decoration: none;
	margin-bottom: 10px;
	width: max-content;
	padding: 4px;
}

.footer-column a:hover {
	text-decoration: underline;
}

.footer-column a:focus {
	outline: 2px solid #36597D;
	text-decoration: underline;
}

.footer-bottom {
	text-align: left;
	padding-top: 10px;
}

.footer-bottom p {
	font-size: 12px;
	color: #36597D;
}

.socials-container {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	row-gap: 12px;
}

.footer-social-media {
	min-width: max-content;
	text-align: right;
}

a.social-media-icon {
	text-decoration: none;
	margin: 0 20px 0px 0px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	padding: 2px;
	height: 32px;
	width: 32px;
}

a.social-media-icon:last-child {
	margin: 0px
}

a.social-media-icon:hover,
a.social-media-icon:focus {
	outline: var(--dlt-border-width-hover, 2px) solid var(--dlt-links-color-border, var(--dlt-component-color-interactive-primary-default, var(--dlt-color-background-interactive-primary-default, #1776bf)));
}

.footer-privacy {
	flex: 1;
	min-width: max-content;
	font-size: 12px;
	display: inline-flex;
	align-items: center;
	column-gap: 14px;
	white-space: nowrap;
}

.footer-privacy span,
.footer-privacy a {
	color: #36597D;
	text-decoration: none;
	padding: 2px;
}

.footer-privacy a:hover {
	text-decoration: underline;
}

.footer-privacy a:focus {
	outline: solid #36597D 2px;
	text-decoration: underline;
}

.site-tour {
	display: flex;
	align-items: center;
}

.site-tour-btn {
	padding: 0px 12px;
	background-color: #F0F2F4;
	border-width: 2px;
	font-weight: bold;
}

.dlt-button-secondary.site-tour-btn:focus {
	padding: 0px 12px;
	background-color: #c5edea;
	border-width: 2px;
	font-weight: bold;
}

.dlt-button-secondary.site-tour-btn:hover:not(:disabled) {
	padding: 0px 12px;
	background-color: #c5edea;
	border-width: 2px;
	font-weight: bold;
}

.site-tour-btn svg {
	width: 24px;
	height: 24px;
	margin-right: 8px;
}

.site-tour-icon {
	margin-right: 7px;
	display: flex;
	align-items: center;
}

.site-tour-icon svg {
	fill: #058192;
	width: 26px;
	height: 26px;
}

/* Empty State styling */

.empty-state-container {
	grid-column: 1/-1;

	display: none;

	-moz-flex-direction: column;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;

	-moz-align-items: center;
	-webkit-align-items: center;
	-ms-align-items: center;
	align-items: center;
}

.topics-list[count="0"] .empty-state-container {
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
}

/* Responsive styling */

@media only screen and (max-width: 750px) {

	/* Hiding the left toc for smaller screns */
	.left-toc-wrapper {
		display: none;
	}

	.version-dropdown-sm {
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
	}

	/* Showing the categroies dropdown for smaller screens */
	.categories-filter-sm {
		display: -webkit-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
	}
}

/* Feedback Styling */
/* Feedback Button Active Styling */
#feedback-tab {
	display: none;
}

.feedback {
	display: inline-block;
	width: 45px;
	height: 45px;
	background-position: 50% 50%;
	background-size: 48%;
	background-repeat: no-repeat;
	border-radius: 50%;
	background-color: #058192;
	color: white;
	box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
}

/*replacing button with icon */
.feedback-icon {
	background-image: url("../images/feedback-2.svg");
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	position: fixed;
	bottom: 24px;
	right: 24px;
}

.feedback-icon:not(.down-arrow):hover {
	background-image: url("../images/feedback-hover.svg");
	background-color: white;
	border: 2px solid #058192;
	cursor: pointer;
}

.feedback-icon-active {
	background-image: url("../images/feedback-active2.svg");
	-webkit-transform: rotate(360deg);
	-moz-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	-o-transform: rotate(360deg);
	transform: rotate(360deg);
	position: fixed;
	bottom: 24px;
	right: 24px;
	z-index: 996;
	background-color: #E4FEFF;
	border: solid teal 2px;
	cursor: pointer;

}

.feedback-icon-active.down-arrow {
	background-color: #058192;
}

.down-arrow {
	background-image: url("../images/dlt-icon-chevron-down.svg");
	background-size: 100%;
}


.down-arrow:hover {
	cursor: pointer;
}

form {
	font-family: 'Roboto', sans-serif;
	font-size: 13px;
}

/* ------------ Feedback Form Styling ----------- */

@media only screen and (min-width: 360px) {

	#feedback-tab,
	#feedback-form {
		display: none;
	}

	#mob_feedback-tab {
		display: block;
	}

	.d-md-none {
		display: block;
	}
}

@media only screen and (min-width: 768px) {
	#feedback-tab {
		display: block;
	}

	#mob_feedback-tab,
	#mob_feedbackform {
		display: none !important;
	}

	.d-md-none {
		display: none;
	}
}

@media only screen and (max-width: 768px) {

	#feedback-form,
	#feedback-tab {
		display: none !important;
	}
}

@media only screen and (min-width: 992px) {
	#feedback-tab {
		display: block;
	}

	#mob_feedback-tab,
	#mob_feedbackform {
		display: none !important;
	}

	.d-md-none {
		display: none;
	}
}

@media only screen and (min-width: 1200px) {
	#feedback-tab {
		display: block;
	}

	#mob_feedback-tab,
	#mob_feedbackform {
		display: none !important;
	}

	.d-md-none {
		display: none;
	}
}

@supports (-moz-appearance:none) {
	#feedback-form {
		bottom: 130px;
	}
}

#feedback-form {
	width: 332px;

	position: fixed;
	z-index: 999;
	bottom: 84px;
	right: 25px;
	opacity: 1;
	background: white;
	box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	padding: 24px;

	display: none;
}

.feedback-form-inner {
	display: flex;
	display: -webkit-flex;
	flex-direction: column;
	height: 100%;
	row-gap: 24px;
}

.formheader {
	color: #011F3D;
	font-weight: 500;
	font-size: 16px;
	line-height: 20px;
	display: flex;
	display: -webkit-flex;
	align-items: center;
	position: relative;
}

.feedback-radio-container-sm {
	display: flex;
	display: -webkit-flex;
	justify-content: center;
	column-gap: 24px;
}

.response-option-label {
	display: inline-flex;
	flex-direction: column;
	width: 40px;
	margin: 0;
	align-items: center;
	row-gap: 8px;
	cursor: pointer;
	padding: 5px;
	border: solid rgba(5, 129, 146, 0) 2px;
	transition: all 250ms linear;
}

.response-option-label:hover,
.response-option-label:focus {
	border: solid #058192 2px;
}

.response-option-label:active {
	border: solid #058192 2px;
	background-color: #c5edea;
}

.response-option-label img.response-default {
	background-color: white;
	border-radius: 100%;
}

.response-option-label img.response-active {
	display: none;
}

.response-option-label span {
	color: #011f3d;
	font-weight: 400;
	font-size: 12px;
	line-height: 18px;
}

.response-option-item input {
	height: 0;
	margin: 0;
	opacity: 0;
	padding: 0;
	position: absolute;
	width: 0;
	outline: none;
}

.response-option-item input:focus+label.response-option-label {
	border: solid #058192 2px;
}

.response-option-item input:checked+label.response-option-label>img.response-default {
	display: none;
}

.response-option-item input:checked+label.response-option-label>img.response-active {
	display: block;
}

.feedbackoptions.container.mt-3 {
	color: #011F3D;
	width: max-content;
}

.mt-2.mb-2 {
	margin-bottom: 24px;
	width: 284px;
}

.feedbackoptions.container.mt-3>span {
	font-weight: 500;
	font-size: 12px;
	line-height: 12px;
}

/* Feedback radio buttons styling */
.feedback-radio-container fieldset {
	border: none;

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
}

.sm-radio .dlt-radio-button label::before {
	top: 50%;
	transform: translateY(-50%);
}

.sm-radio .dlt-radio-button label::after {
	top: 50%;
	transform: translateY(-50%);
	height: 5.5px;
}

.sm-radio .dlt-radio-button label[for="specific"]::after {
	left: 2.8px;
}

/* Feedback form selected text styling */
#selected-text-container {
	display: none;
}

#feedback-form.specific #selected-text-container {
	display: block;
	margin-bottom: 16px;

}

#copiedText:placeholder-shown+#clearlink {
	display: none;
}

#copiedText {
	display: none;
}

#guidetext {
	height: max-content;
	max-height: 81px;
	overflow: hidden;

	background-color: white;
	font-size: 12px;
	line-height: 18px;
	color: rgba(54, 89, 125, 0.7);
	font-style: italic;
	border: none;
	width: 280px;
	padding: 8px 0px;

	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
	white-space: pre-wrap;
	pointer-events: none;
}

#clearlink {
	float: right;
}

.form-group {
	display: grid;
	margin-bottom: 24px;
	width: max-content;
}

.form-group label {
	font-weight: 500;
	font-size: 12px;
	line-height: 12px;
	color: #011F3D;
	margin-bottom: 6px;
	grid-row: 1;
}

/* Feedback comments styling */
.comments-container {
	margin-top: 12px;
	margin-bottom: 12px;
}

.comments-container::after {
	content: attr(count) ' characters available';
	background-image: url('../images/info-alert-symbol.svg');
	background-repeat: no-repeat;
	display: inline-block;
	padding: 4px 0px 4px 18px;
	background-position: left top 6px;
}

.comments-container[disabled]::after {
	display: none;
}

.comments-container .dlt-form-group {
	display: block;
}

textarea#comments {
	height: 80px;
}

/* Alert message styling */
.alert-success {
	background: none;
	border: none;
	color: #14629F;
}

form {
	user-select: none;
}

#emptyFeedbackForm {
	color: red;
}

div.email-group {
	display: flex;
	display: -webkit-flex;
	flex-direction: column-reverse;
	width: max-content;
}

div.email-group label {
	font-weight: 500;
	font-size: 12px;
	line-height: 12px;
	color: #011F3D;
	margin-bottom: 6px;
	grid-row: 1;
}

#userEmail {
	width: 284px;
	border: none;
	box-shadow: inset 0 0 0 1px #36597D;
	outline: 0 !important;
	margin: 0;
	padding: 8px;
	transition: all 200ms ease-in-out;
}

#userEmail.form-control:focus {
	outline: none;
	box-shadow: inset 0 0 0 2px #058192;
}

::-webkit-input-placeholder,
::-moz-placeholder,
:-ms-input-placeholder,
:-moz-placeholder {
	font-size: 12px;
}

#loading {
	margin-bottom: 16px;
	margin-top: 16px;
}

.form-submit-group {
	position: relative;
	display: flex;
	display: -webkit-flex;
	align-items: center;
}

#privacyPolicy2 {
	display: inline-block;
	font-size: 12px;
	padding: 4px;
	font-family: "Roboto", "Helvetica", Arial, sans-serif;
	font-weight: 500;
	line-height: 16px;
	border: solid rgba(0, 0, 0, 0) 2px;
	color: #058192;
	outline: none;
}

#privacyPolicy2:focus {
	outline: none;
	border: solid #058192 2px;
	text-decoration: underline;
}

#privacyPolicy2:active {
	color: #1C5569;
}

#privacyPolicy2>.divClass {
	display: none;
	visibility: hidden;
	font-family: "Roboto", "Helvetica", Arial, sans-serif;
}

#privacyPolicy2:hover>.divClass {
	display: inline-block;
	visibility: visible;
	background-color: white;
	position: absolute;
	width: 250px;
	height: auto;
	font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
	left: -260px;
	top: -12px;
	padding: 4px;
	border: solid 1px #d0d0d0;
	box-shadow: 0px 2px 4px 1px rgba(0, 0, 0, 0.16);
}


#privacyPolicy2:hover>.divClass::after {
	content: '';
	display: block;
	position: absolute;
	width: 12px;
	height: 12px;
	right: -6px;
	top: 18px;
	background-color: white;
	border: solid 1px #d0d0d0;
	border-bottom: none;
	border-left: none;
	transform: rotateZ(45deg);
}

#privacyPolicy2:hover>.divClass>#tooltip_title {
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	height: auto;
	width: 100%;
	padding: 4px;
	font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
	color: #011F3d;
	line-height: 16px;
}

#privacyPolicy2:hover>.divClass>#privacy_tooltip {
	display: inline-block;
	font-size: 12px;
	font-weight: 400;
	color: #011F3d;
	background-color: white;
	height: auto;
	padding: 0px 4px 4px;
	font-family: "Helvetica Neue", "Helvetica", Arial, sans-serif;
	line-height: 16px;
}

/* ---------- Feedback Form button styling --------- */

.form-btn-container {
	-moz-flex-direction: row;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;

	-moz-justify-content: right;
	-webkit-justify-content: right;
	-ms-justify-content: right;
	justify-content: right;

	column-gap: 8px;
}

/* ----------- Mobile feedback styling ----------- */

#mob_feedback-tab {
	display: block;
}

#mob_feedbackform {
	position: fixed;
	bottom: 20px;
	right: 24px;
	margin: 0px;
	box-sizing: border-box;
	height: max-content;
	max-height: revert;
	box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
	z-index: 999;
	background-color: white;
	color: #011F3D;
	padding: 16px;
	width: 310px;
	display: -webkit-flex;
	display: flex;
	flex-direction: column;
	display: none;
}


.mob_feedbackform_title.mob_container {
	display: flex;
	align-items: flex-start;
	justify-content: end;
	padding-bottom: 8px;
}

#mob_feedbackform .mob_feedbackform_title.mob_container span {
	font-size: 16px;
	font-weight: 500;
	line-height: 21px;
	flex: 1 0;
}

#mob_feedbackform .mob_feedbackform_minimizeBtn {
	background-color: transparent;
	border: solid transparent 2px;
	padding: 0px;
	margin: 0px;
	height: 24px;
	width: 24px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
}

#mob_feedbackform .mob_feedbackform_minimizeBtn:hover,
#mob_feedbackform .mob_feedbackform_minimizeBtn:focus {
	border: solid teal 2px;
	cursor: pointer;
	outline: transparent;
}

#mob_feedbackform .mob_feedbackform_minimizeBtn:active {
	border: solid teal 2px;
	background-color: #C5EDEA;
	outline: transparent;
	cursor: pointer;
}

#mob_feedbackform .mob_feedbackform_minimizeBtn svg {
	transform: rotateZ(90deg);
}

.d-flex.mt-2 {
	display: flex;
	justify-content: center;
	align-items: center;
	column-gap: 40px;
}

div.mob-form-group {
	padding: 0px 0px 8px 0px;
}

label.mob_comments_label {
	font-size: 12px;
	font-weight: 500;
	line-height: 12px;
	margin-bottom: 4px;
}

textarea.mob-form-control {
	background-image: none;
	background: white;
	border: 1px solid #36597D;
	padding: 6px;
	width: 100%;
	min-height: 34px;
	line-height: 1;
	transition: border .3s ease, box-shadow .3s ease;
	font-size: 12px;
	resize: none;
	scroll-behavior: auto;
	transition: all 80ms linear;
}

textarea.mob-form-control::placeholder {
	color: #436385;
	font-style: italic;
}

textarea.mob-form-control:focus-visible,
textarea.mob-form-control:focus {
	outline: solid #058192 2px;
	outline-offset: -2px;
}

.mob_form-btn-container {
	display: flex;
	justify-content: right;
	padding-top: 8px;
	column-gap: 8px;
}

.mob_form-btn-container #mob_cancel,
.mob_form-btn-container #mob_submit {
	font-weight: 500;
	font-size: 12px;
	line-height: 16px;
	text-align: center;
	width: 64px;
	height: 24px;
	outline: none;
	display: flex;
	display: -webkit-flex;
	justify-content: center;
	align-items: center;
}

.mob_form-btn-container #mob_cancel {
	color: #058192;
	border: solid #058192 1px;
	background-color: white;
}

.mob_form-btn-container #mob_cancel:hover {
	cursor: pointer;
}

.mob_form-btn-container #mob_cancel:hover,
.mob_form-btn-container #mob_cancel:focus {
	outline: solid #058192 2px;
	outline-offset: -1px;
}

.mob_form-btn-container #mob_cancel:active {
	outline: solid #058192 2px;
	outline-offset: -1px;
	background-color: #c5edea;
	color: #058192;
}

.mob_form-btn-container #mob_submit {
	background-color: #058192;
	color: white;
	border: solid #058192 1px;
}

.mob_form-btn-container #mob_submit:disabled {
	opacity: 0.5 !important;
	cursor: not-allowed !important;
}

.mob_form-btn-container #mob_submit:enabled:hover {
	background-color: white;
	color: #058192;
	outline: solid #058192 2px;
	outline-offset: -1px;
}

.mob_form-btn-container #mob_submit:enabled:active {
	color: white;
	background-color: #1c5569;
	border-color: #058192;
	outline: solid #058192 2px;
	outline-offset: -1px;
}

#message.alert-error {
	color: #D22D3D;
}

#message.alert-success {
	color: #8E3CF7;
}

/* ---------------- END: Mobile feedback styling ------------ */

.fa {
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body .fa {
	font-family: FontAwesome;
}

.fa-thumbs-up::before {
	content: "\f164";
}

.fa-thumbs-down::before {
	content: "\f165";
}

#mob_comments {
	margin-bottom: 7px;
	font-size: 13px;
	outline: 0 !important;
	background: #fff;
	border: 1px solid #ccc;
	padding: 6px 12px;
	width: 100%;
	min-height: 34px;
	line-height: 1;
	transition: border .3s ease, box-shadow .3s ease;
	color: #666;
}

textarea {
	overflow: auto;
	resize: vertical;
}

a#mob_cancel.float-right.mr-2.mt-2.mb-3 {
	margin-right: 15px;
	margin-top: 5px;
	padding-top: 2px;
	color: #058192;
	text-decoration: none;
	background-color: transparent;
}

.mob_container>#mob_cancel {
	float: right !important;
}

.mob_container>a#mob_cancel.float-right.mr-2.mt-2.mb-3:hover,
.mob_container>a#mob_cancel.float-right.mr-2.mt-2.mb-3:active {
	color: var(--dlt-color-text-interactive-link-default, #058192);
	outline: 0;
	text-decoration: underline;
}

#mob_submit:hover {
	cursor: pointer;
}

.mob_feedbackform #message {
	margin-top: 5px;
}

/* ------------ TOP Button Styling --------------- */

.top-btn {
	position: fixed;
	right: 24px;
	bottom: 24px;
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 400;
	font-size: 12px;
	line-height: 22px;
	letter-spacing: -0.01em;
	color: #058192;
	background-color: white;
	border: solid #058192 1px;
	padding: 1px 9px;
	text-align: center;
	cursor: pointer;
	z-index: 998;
	outline: none;
	display: none;
}

.top-btn:hover,
.top-btn:focus,
.top-btn:active {
	padding: 0px 8px;
	border: solid #058192 2px;
}

.top-btn:active {
	background-color: #c5edea;
}


@media print {

	html,
	body {
		padding: 0 !important;
		margin: 0 !important;
	}

	body {
		print-color-adjust: exact;
	}

	.tour-band-div {
		display: none !important;
	}

	#feedback-tab,
	#feedback-form,
	.top-btn {
		display: none !important;
	}

	#mob_feedback-tab,
	#mob_feedbackform {
		display: none;
	}
}