html *{
    font-size: var(--fontDefault);
}

a {
	color:var(--colorBlueFull);
}

innertable {
	display: table;
	width:100%;
}
innertr{
	display: table-row;
}
innerth{
	display: table-cell;
	padding: 0.25rem 0.25rem;
	background-color:var(--colorBlack005);
	border-bottom:1px solid var(--colorBlack025);
}
innertd{
	display: table-cell;
	padding: 0.25rem 0.25rem;
	border-bottom:1px solid var(--colorBlack025);
}
innertd:nth-child(2){
	width:13%;
}
innertd:nth-child(3),
innertd:nth-child(4),
innertd:nth-child(5){
	width:22%;
}

label{
	user-select:none;
}

/*@media (orientation: landscape) {*/
    
	h1 {
		font-size: var(--fontHeader1);
		margin-bottom: 0.2rem;
	}                        
	h2 {                     
		font-size: var(--fontHeader2);
		margin-bottom: 0.1rem;
	}                        
	.smallfont,
	.smallfont * {                   
		font-size: var(--fontSmall1);
    }
	.smallfont2,
	.smallfont2 * {                   
		font-size: var(--fontSmall2);
    }

	
	.headermenu {
		position: fixed;
		top: 0px;
		left: 0px;
		width: calc(100% - 2rem);
		height: 2.5rem;
		padding: 0.5rem 1rem;
		z-index: 500;
		color: var(--colorBrightGrayFull);
		user-select: none;
		display: block;
		/*color: white;
		mix-blend-mode: screen;*/
	}

	.headermenu .background {
		position: absolute;
		top: 0;
		left: 0;
		background-color: var(--colorBlack025);
		transition: background-color var(--transitionSemi);
		/*top: 1rem;
		height: calc(100% - 1rem);
		width: calc(100% - 1rem);*/
	/*	-webkit-mask-image: linear-gradient(90deg ,var(--colorBlackFull) 0%, var(--colorBlack050) 25%,  var(--colorBlack050) 75%, var(--colorBlackFull) 100%);
		mask-image: linear-gradient(90deg ,var(--colorBlackFull) 0%, var(--colorBlack050) 25%, var(--colorBlack050) 75%,  var(--colorBlackFull) 100%);
	*/
		/*opacity: 0.75;*/
		top: 0;
		height: 100%;
		width: 100%;
		
	}
	
	.headermenu .background.blue {
		background: unset;
		background-color: var(--colorBlueFull);
	}
	
	.headermenu .links {
		display: flex;
		position: relative;
		top: 0.3rem;
		height: 100%;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: space-between;
	}
	
	.headermenusmall .links {
		display: flex;
		position: relative;
		top: 0.3rem;
		height: 100%;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: space-between;
	}

	.headermenu img {
		height:67%;
		float: left;
		margin-right: 3rem;
	}
	
	.headermenu text {
		font-family: 'Montserrat';
		letter-spacing: -0.025rem;
		margin: 0.5rem 0rem 0rem 0.5rem;
		color: var(--colorWhiteFull);
		opacity: 0.75;
		cursor: pointer;
		font-size: var(--fontHeader1);
		float: left;
		/*text-shadow: 0px 0px 1rem 2rem var(--colorBlackFull);*/
		transition: opacity var(--transitionSemi) ease;
		position: relative;
	}

	
	#pagelinksoptions,
	#pagelinksmore
 	{
		display: inline-block;
	}
	#pagelinksoptions .links,
	#pagelinksmore .links{
		font-family: 'Montserrat';
		letter-spacing: -0.025rem;
		color: var(--colorBlack075);
		opacity: 0.75;
		cursor: pointer;
		font-size: var(--fontHeader1);
		transition: opacity var(--transitionQuick);
		position: relative;
		display: inline-block;
		margin-bottom: 1rem;
	}
	
	#pagelinksmore a.links {
		text-decoration: none;   /* real links (crawlable), look like the other menu entries */
	}
	.headermenu text:hover,
	#pagelinksoptions .links:hover,
	#pagelinksmore .links:hover {
		opacity: 1;
	}
	.topHeader .breadcrump text:after,
	.headermenu text:after, 
	#pagelinksoptions .links:after,
	#pagelinksmore .links:after,
	.footerlink:after{
	  content: '';
	  position: absolute;
	  width: 0; 
	  height: 1px;
	  display: block;
	  margin-top: 0.1rem;
	  right: 0;
	  background: var(--colorOrangeFull);
	  transition: width var(--transitionSemi) ease;
	  -webkit-transition: width var(--transitionSemi) ease;
	}
	/*
	.mainmenu text:after*/
	.mainmenu>div:after{
	  content: '';
	  position: absolute;
	  width: 0; 
	  height: 1px;
	  display: block;
	  margin-top: 0.1rem;
	  right: 0;
	  background: var(--colorOrangeFull);
	  transition: width var(--transitionSemi) ease;
	  -webkit-transition: width var(--transitionSemi) ease;
	}
	
	.topHeader .breadcrump text:hover:after,	
	.mainmenu>div:hover:after,
	/*.mainmenu text:hover:after,*/
	.headermenu text:hover:after,
	#pagelinksmore .links:hover:after,
	#pagelinksoptions .links:hover:after,
	.footerlink:hover:after{
	  width: 100%;
	  left: 0;
	  background:  var(--colorOrangeFull);
	}
	

	
	.headermenu img[buttonlink="normal"] {
		height: 0.9rem;
		width: unset;
		margin-right: 0.1rem;
		opacity:1;
	}
	
	
	.headermenu .options {
		float: right;
		position: relative;
		top: 0.5rem;
		cursor: pointer;
		background-image: url(/img/64/options.png);
		opacity:0.75;
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100%;
		width: 1.5rem;
		height: 1.5rem;
	}
	
	.headermenu .options:hover {
		opacity:1;
	}


	
	.cookienotice {
		position:fixed;
		bottom:0px;
		left:0px;
		width:100%;
		height: 2rem;
		padding: 0.7rem 1rem;
		color: var(--colorWhiteFull);
		background-color: var(--colorBlack075);
		z-index:500;
		text-align: center;
		border-top: solid 1px var(--colorWhiteFull);
	}
	
	.cookienotice *{
		font-size: var(--fontHeader1);
	}
	
.form {
    text-align: center;
}
	
.formInput {
	position: relative;
    margin: auto;
    display: block;
	height: 3rem;
	width: 22rem;
}	
.formInputButton {
	position: relative;
}

.formInputButton label {
  position: absolute;
    top: -0.9rem;
    margin: auto;
    font-size: 0.8rem;
    left: 1rem;
    transition: all 0.3s ease-in-out;
    z-index: 1;
    color: var(--colorBlack050);
    padding: 0 0.25rem;
}


.formInputSelect {
    display: block;
	position:relative;
	top: 0;
	left: 0;
	height: 3rem;
}

.formInputD.nobreak,
.formInput.nobreak, 
.formInputSelect.nobreak {
    display: inline-block;
}

.formInputSelect label{
	position: absolute;
    top: -0.2rem;
    left: 0.5rem;
    transition: all 0.3s ease-in-out;
    z-index: 1;
    color: var(--colorBlack050);
    background-color: var(--colorWhiteFull);
    padding: 0 0.25rem;
    border-radius: var(--border25);
    font-size: var(--fontSmall3);
}



.formInputArea {
	position: relative;
    margin: 0.5rem auto;
    display: block;
	/*height: 6rem;*/
	width: 44rem;
}

.formInputArea textarea {
	width: 41rem;
    height: 10rem;
}

.formInputCaptcha {
	position: relative;
    margin: 0.2rem auto 0.5rem auto;
	height: 3rem;
    width: 20rem;
    display: block;
	border: solid 1px var(--colorBlack025);
	border-radius: var(--borderDefault);
	background-color: var(--colorWhiteFull);	
}

.formInputCaptcha img{
	height: 90%;
	padding: 0.25rem 1rem;
	display:inline-block;
}
.formInputArea label,
.formInput label{
  position: absolute;
  top: 0.5rem;
  left: 1.5rem;
  transition: all 0.3s ease-in-out;
  z-index: 1;
  color: var(--colorBlack050);
}


.formInputB {
	position: relative;
    margin: auto;
    display: block;
	height: 3rem;
	width: 22rem;
}

.formInputD {
	position: relative;
    margin: auto;
    display: block;
	height: 3rem;
}

.formInputD label,
.formInputB label{
  position: absolute;
  top: 0.75rem;
  left: 1.0rem;
  transition: all 0.3s ease-in-out;
  z-index: 1;
  color: var(--colorBlack050);
}

.formInputC {
	position: relative;
    margin: auto;
    display: block;
	height: 3rem;
	width: 22rem;
}

.formInputC.nolable {
	width: unset;
	height: unset;
}

.formInputC.nowidth {
	width: unset;
}

.formInputC label:not(.switch) {
  position: absolute;
  top: 0.5rem;
  left: 3.0rem;
  transition: all 0.3s ease-in-out;
  z-index: 1;
  color: var(--colorBlack050);
}

.formCheckbox {
	display: block;
    position: relative;
    width: 33rem;
    height: 2rem;
}

.formresponse {
	padding: 0.5rem 1rem;
    text-align: left;
}

#contactform .formCheckbox {
	margin: 0rem auto auto auto;
    width: 40rem;
    text-align: left;
    padding-left: 2rem;
}

#contactform .checkmark {
    top: 0.25rem;
}
/* Hide the browser's default checkbox */
.formCheckbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 1.1rem;
  width:  1.1rem;
  background-color: var(--colorWhiteFull);
  border: solid 1px var(--colorBlack025);
  border-radius: var(--borderQuater);
}

.formCheckbox input:checked ~ .checkmark {
  background-color:  var(--colorBlueFull);
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.formCheckbox input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.formCheckbox .checkmark:after {
     left: 0.3rem;
    width: 0.3rem;
    height: 0.7rem;
    border: solid var(--colorWhiteFull);
    border-width: 0 0.2rem 0.2rem 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.formInputRegisterCheckbox .formCheckbox{
	margin:auto;
	width: 18rem;
	height: 4rem;
	text-align: left;
    padding-left: 2rem;
}


input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
-webkit-box-shadow: 0 0 0px 1000px var(--colorWhiteFull) inset !important;
}

select:focus,
input:focus {
	outline: none;
}

textarea:focus {
	border: solid 1px var(--colorBlack025);
	outline: none;
}

textarea:focus + label,
textarea:not(:placeholder-shown) + label,
input:focus + label,
input:not(:placeholder-shown) + label,
input:-webkit-autofill + label,
textarea:-webkit-autofill + label,
input:autofill + label,
textarea:autofill + label {
    top: -0.2rem;
    font-size: var(--fontSmall3);
    line-height: var(--fontSmall2);
    background-color: var(--colorWhiteFull);
    padding: 0rem 0.5rem;
	border-radius: var(--borderThreeQuater);
}


.formInputB input:focus + label,
.formInputB input:not(:placeholder-shown) + label {
    top: -0.2rem;
	left: 0.5rem;
    font-size: var(--fontSmall3);
    line-height: var(--fontSmall2);
    background-color: var(--colorWhiteFull);
    padding: 0rem 0.5rem;
	border-radius:var(--borderThreeQuater);
}

.forminfo {
	top: -0.15rem;
    font-size: var(--fontSmall3);
    background-color: var(--colorWhiteFull);
    padding: 0rem 0.5rem;
	color: var(--colorBlack050);
}

	
	button,
	input[type="submit"],
	input[type="button"] {
		padding: 0.25rem 1rem;
		display:inline-block;
		color: var(--colorBlack075);
		border: solid 1px var(--colorBlack025);
		cursor: pointer;
		border-radius: var(--borderDefault);
		background-color: var(--colorWhiteFull);
		transition: color var(--transitionQuick), background-color var(--transitionQuick);
		user-select: none;
	}
	
	button:hover,
	input[type="submit"]:hover, 
	input[type="button"]:hover	{
		background-color: var(--colorBlue005Opa);
		border: solid 1px var(--colorBlack050);
	}
	
	button:disabled,
	input[type="submit"]:disabled,
	input[type="button"]:disabled,
	button:disabled:hover,
	input[type="submit"]:disabled:hover,
	input[type="button"]:disabled:hover {
		background-color: var(--colorBlack010);
	}
	text.disabled ,
	td.disabled {
		color: var(--colorBlack050);
	}
	
	.darkbutton {
		background-color: var(--colorBlack025);
		border: solid 1px var(--colorWhite075);
		color: var(--colorWhiteFull);
	}
	
	.darkbutton:hover {
		background-color: var(--colorLightGray025);
		border: solid 1px var(--colorWhiteFull);
		color: var(--colorWhiteFull);
	}
	
	.landingPage {
		padding: 0.5rem 1rem;
		font-size: var(--fontHeader1);
	}
	
	.switch.right,
	input[type="submit"].right,
	button.right {
		float:right;
	}
	
	button.center {
		margin: -20px -50px;
		position: relative;
		top: 50%;
		left: 50%;
	}
	input[type="submit"].left,
	button.left {
		float:left;
	}
	
	
	
	button.mini{
		padding: 0.1rem 0.1rem;
		border-radius: var(--border04);
		margin: 0 0.1rem;
	}
	
	
	textarea {
		resize: none;
	}
	
	textarea,
	input[type="search"],
	input[type="datetime-local"],
	input[type="text"],
	input[type="number"],
	input[type="password"] {
		border: solid 1px var(--colorBlack025);
		margin: 0.25rem 0rem;
		border-radius: var(--borderQuater);
		padding: 0rem 0.5rem;
		width: 19rem;
		font-size: var(--fontDefault);
		line-height:2rem;
		color: var(--colorBlack075);
	}
	
	input[type="datetime-local"]{
		width: 18rem;
	}
	
	input[type="datetime-local"] {
		padding: 0rem 0.5rem;
		
		line-height:1.85rem;
		
	}
	
	.contentwrap:has(input[type="datetime-local"]:open) {
		
		filter: blur(2px) grayscale(0.5);

	}
	textarea {
		padding-top: 0.25rem;
		border-radius: var(--borderDefault);
		line-height:1.5rem;
		height: 5rem;
	}
	
	input[type="range"] {
		-webkit-appearance: none;
		appearance: none;
		width: 20rem;
		height: 1rem;
		background: var(--colorBlueFull); /* Grey background */
		outline: none; /* Remove outline */
		border-radius: var(--borderFull);
		padding: 0.2rem;
		/*left: 0.2rem;
		bottom: 0.2rem;*/
	}
	
	input[type="range"]::-webkit-slider-thumb {
		-webkit-appearance: none; /* Override default look */
		appearance: none;
		width: 1rem; /* Set a specific slider handle width */
		height: 1rem; /* Slider handle height */
		background: var(--colorWhiteFull); /* Green background */
		cursor: pointer; /* Cursor on hover */
		border-radius: var(--borderDefault);
	}
	
	input[type="range"]::-moz-range-thumb {
		width: 1rem; /* Set a specific slider handle width */
		height: 1rem; /* Slider handle height */
		background: var(--colorWhiteFull); /* Green background */
		cursor: pointer; /* Cursor on hover */
		border-radius: var(--borderDefault);
	}
	
	.brightInput {
		background: var(--colorWhiteFull) !important;
	}
	
	._minibutton{
		padding: 0.1rem 0.1rem;
		display: inline;
		background-color: var(--colorWhiteFull);
		color: var(--colorBlackFull);
		border: solid 1px var(--colorBlack050);
		cursor: pointer;
		border-radius: var(--border04);
		margin: 0 0.1rem;
		user-select: none;
		transition: color var(--transitionQuick), background-color var(--transitionQuick);
	}

	._minibutton:hover {
		background-color: var(--colorBlue005Opa);
		border: solid 1px var(--colorBlackFull);
	}

	
	/* The switch - the box around the slider */
	.switch {
		position: relative;
		display: inline-block;
		width: 2.4rem;
		height: 1.4rem;
		margin: 0.4rem 0;
	}

	/* Hide default HTML checkbox */
	.switch input {
	  opacity: 0;
	  width: 0;
	  height: 0;
	}

	/* The slider */
	.slider {
	  position: absolute;
	  cursor: pointer;
	  top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  background-color: var(--colorBlack010);
	  -webkit-transition: var(--transitionQuick);
	  transition: var(--transitionQuick);
	  transition-timing-function: cubic-bezier(0.88, 0, 0.2, 1.03);
	}
	
	

	.slider:before {
		position: absolute;
		content: "";
	    height: 1rem;
		width: 1rem;
		left: 0.2rem;
		bottom: 0.2rem;
		background-color: var(--colorWhiteFull);
		-webkit-transition: var(--transitionQuick);
		transition: var(--transitionQuick);
		transition-timing-function: cubic-bezier(0.88, 0, 0.2, 1.03);
	}

	input:disabled + .slider {
		background-color: var(--colorBlack025);
	}
	
	input:checked + .slider {
	  background-color: var(--colorBlueFull);
	}

	input:checked + .slider:before {
	  -webkit-transform: translateX(1rem);
	  -ms-transform: translateX(1rem);
	  transform: translateX(1rem);
	}
	
	input:checked:disabled + .slider {
		background-color: var(--colorBlack050);
	}

	/* Rounded sliders */
	.slider.round {
	  border-radius: var(--borderFull);
	}

	.slider.round:before {
	  border-radius: var(--borderDefault);
	}

	
	select {
		background-color: var(--colorWhiteFull);
		border: solid 1px var(--colorBlack025);
		padding: 0.25rem;
		margin: 0.25rem 0rem;
		border-radius: var(--borderQuater);
		width: 19rem;
		font-size: var(--fontSmall1);
		line-height:2rem;
		height: 2.1rem;		
		text-overflow: ellipsis;
	}
	
	a {
		opacity: 0.75;
		transition: opacity var(--transitionQuick);
	}
	a:hover {
		opacity: 1;
	
	}
	
	img[buttonlink="normal"]{
		opacity: 0.75;
		cursor: pointer;
		transition: opacity var(--transitionQuick);
	}
	
	img[buttonlink="normal"]:hover {
		opacity: 1;
	}
	
	img[buttonlink="noshadow"] {
		opacity: 0.75;
		cursor: pointer;
		transition: opacity var(--transitionQuick);
	}
	
	img[buttonlink="noshadow"]:hover {
		opacity: 1;
	}
	
	.error,
	.error tr>th{
		color: var(--colorRedFull) !important;
	}
	
	.loginblack {
		background-image: url(/img/64/chevron_r_black.png);
		background-size: 1rem;
		background-repeat: no-repeat;
		background-position: 0.25rem center;
		padding-left: 1.75rem !important;
	}
/*}*/




.mainlogo {
	width: 22rem;
    padding-bottom: 0.5rem;
}

.handimage {
	width: 15rem;
}


.contentpage {
	width: 100%;
    min-height: 100vh;
    /*overflow: hidden;*/
    background-color: var(--colorWhiteFull);
    /* background: linear-gradient(175deg, var(--colorWhite025) 50%, var(--colorGrayishBlue025) 100%); */
    display: flex;
    position: relative;
    z-index: 0;
    align-items: center;
}

div[name="content_page_3"],
div[name="content_page_5"],
div[name="content_page_7"],
.backgrey {
	background-color: var(--colorBackGrayFull) !important; 
}

div[name="content_page_7"]{
	min-height: calc(100vh - 3rem);
}

.contentpage h1 {
	font-size: var(--fontHomeHeader1);
	line-height: var(--fontHomeHLineHeight);
	color: var(--colorHeaderBlueBright);
}
.contentpage h1 text {
	font-size: var(--fontHomeHeader1);
	line-height: var(--fontHomeHLineHeight);
	color: var(--colorHeaderBluedark);
}

.contentpage .subtext {
	padding-top: 1rem;
	width: 30%;
    position: relative;
    left: 35%;
    display: block;
	font-size: var(--fontDefault);
}

.contentpage .contentstart {
    display: block;
    width: 100%;
    z-index: 10;
    font-family: 'Montserrat';
    letter-spacing: -0.025rem;
    position: relative;

	font-size: 1.5rem;
    line-height: 2rem;
	
}

.contentpage .contentstart .highlight{
	font-size: 1.5rem;
    line-height: 2rem;
	font-family: 'Montserrat';
    letter-spacing: -0.025rem;
	font-weight: 500;
	color: var(--colorOrangePastel) !important;

}

.contentpage .contentend {
	padding-top:5rem;
	display: table-cell;
	width: 100%;
	color: var(--colorBlack075);
	position: relative;
	z-index: 10;
}


.contentpage .content {
	line-height: var(--fontHomeLineHeight);
	color: var(--colorHomeText);
	display: table-cell;
    width: 100%;
	padding-top: 5rem;
	padding-left: 4rem;
	padding-right: 4rem;
	padding-bottom: 5rem;
}

.nobreak {
	white-space: nowrap;
}

.section-header {
	width: 80%;
    margin: 0rem auto 0rem auto;
	text-align: center;
}

.contentpage .contentend .section-header {
	margin: 2rem auto 0rem auto;
	width: 60%;
}

.section-title,
.section-title * {
	font-family: 'Montserrat';
	font-size: 3.2rem;
	line-height: 3.8rem;
	font-weight: 400;
}

.section-subtitle {
	font-family: 'Montserrat';
	font-size: 1.4rem;
    margin: 0.9rem auto 0rem auto;
}

.section-subtext {
	font-family: 'Montserrat';
	font-size: 1.2rem;
    margin: 0.9rem auto 0rem auto;
	text-align:left;
}

.section-subtext strong{
	font-family: 'Montserrat';
	font-size: 1.2rem;
    font-weight:600;
}


.highlight{
	color: var(--colorOrangeFull) !important;
}

.section-subtitle .highlight {
	font-size: 1.2rem;
}

.problem-grid {
	display: flex;
    gap: 2rem;
    margin: 4rem auto auto auto;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
}
.problem-card {
    width: 30%;
	aspect-ratio:3.7;
    text-align: center;
    padding: 2rem;
    background-color: var(--colorBackGrayFull);
    border-radius: var(--borderDouble);
}

.features-grid {
	display: flex;
    gap: 2rem;
    margin: 4rem auto auto auto;
    justify-content: center;
    flex-direction: row;
    flex-wrap: wrap;
}


.feature-card {
	 width: 20%;
	aspect-ratio:1.7;
    text-align: center;
    padding: 2rem;
    background-color: var(--colorWhiteFull);
    border-radius: var(--borderDouble);
}

.audience-grid {
    width: 70%;
    padding-top: 3rem;
    margin: 0rem auto 0rem auto;
}

.audience-icon {
	height: 5rem;
	width: 3.5rem;
    position: relative;
}
.audience-icon .icon {
    width: 	3.5rem;
    height: 3.5rem;
    color: var(--colorBlueFull);
	position: absolute;
    left: 0px;
    top: 1rem;
}
.audience-text {
	display:inline-block;
	position: relative;
	border-bottom: 1px solid var(--colorBlack075);
	width: calc(100% - 3.5rem);
	padding-bottom: 0.5rem;
	margin-bottom: 1rem;
	margin-left: 1rem;
	margin-top: 1rem;

}



.feature-card h3,
.problem-card h3{
	font-size: 1.4rem;
	margin-bottom: 1rem;
}

.audience-text h3 {
	font-size: 1.4rem;
	padding-bottom:0.4rem;
}

.audience-text p, 
.feature-card p,
.problem-card p{
	font-size: 1.3rem;
}

.feature-icon,
.problem-icon {
    margin-bottom: 1rem;
}

.problem-icon .icon {
    width: 3rem;
    height: 3rem;
    /*color: var(--colorOrangeFull);*/
	color: var(--colorBlueFull);
}

.feature-icon .icon {
    width: 3rem;
    height: 3rem;
    color: var(--colorBlueFull);
}


.workflow-steps {
	display: flex;
    gap: 2rem;
    margin: 4rem auto auto auto;
    flex-wrap: nowrap;
    justify-content: center;
}
.workflow-step {
    text-align: center;
	width: 21%;
}

.step-number {
    width: 4rem;
    height: 4rem;
    background: var(--colorBlueFull);
    color: var(--colorWhiteFull);
    border-radius: var(--border50);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 auto 1.5rem;
}

.step-content p {
	text-align:left;
	width: 80%;
    margin: 3rem auto;
	font-size: 1.3rem;
}

.patcharrow {
    aspect-ratio: 2.55;
    mask-image: url(../img/arrowmask_r.png);
    mask-repeat: no-repeat;
    mask-size: 100%;
    margin-bottom: 1rem;
    position: relative;
	
}

.patcharrow text {
	font-weight: bold;
    color: var(--colorBlack065);
    font-size: 1.4rem;
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
}


.patchPlaning {
    aspect-ratio: 2.55;
    border-radius: var(--borderDouble);
    mask-repeat: no-repeat;
    mask-size: 100%;
    margin-bottom: 1rem;
    position: relative;
}

.patchPlaning text {
	font-weight: bold;
    color: var(--colorWhiteFull);
    font-size: 1.5rem;
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    transform: translateY(-50%);
	
}

.patcharrow1 {
	background-color: var(--colorLightBlue1);
}
.patcharrow2 {
	background-color: var(--colorLightBlue2);
}
.patcharrow3 {
	background-color: var(--colorLightBlue3);
}
.patcharrow4 {
	background-color: var(--colorLightGreen1);
}

.contact-left {
	position: absolute;
	margin: 2rem 0 0 10%;
}

.contact-grid {
    margin: 2rem auto 0rem auto;
}

.contact-grid td{
	text-align: center;
}

.contact-left h3,
.contact-grid h3 {
	font-size: var(--fontHomeDefault);
	margin-top:0.5rem;
}
.contact-left p,
.contact-grid p {
	color: var(--colorBlack050);
	margin-bottom:1rem;
}
#customeruserdata_response {
	margin-bottom: 1rem;
}
#contact_response{
	margin-top: 1rem;
}


.contentpage * ul {
	padding-left: 1.3rem;
}

.contentpage .content2x {
	line-height: var(--fontHomeLineHeight);
	color: var(--colorHomeText);
	display: table-cell;
    width: 50%;
	padding-top: 5rem;
	padding-left: 4rem;
	padding-right: 4rem;
	padding-bottom: 1rem;
    vertical-align: top;
}


.footer {
	/*display: table-footer-group;*/
	z-index: 10;
    position: relative;
	bottom: 0px;
	width: 100%;
	border-top: solid 1px var(--colorWhiteFull);
	background-color: var(--colorBlack075);
}

.footer .content {
	color: var(--colorWhite075);
    padding: 1rem 0rem;
    margin: auto;
    width: 80%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
}

.footer-left {
	width:30%;
}

.footer .content a{
	color: var(--colorWhite075);
	text-decoration:none;
	position:relative;
}


.footer .content a:hover{
	color: var(--colorWhiteFull);
}

.centered {
	text-align: center;
}

.fullline {
	width: 100%;
	text-align: center;
}

.backblue {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
	color: var(--colorWhiteFull);
}

.backlightblue {
	background-color: var(--colorBlue025);
}

.bg1 {
	background-image: url(../img/back_higher.png);
}

.bg2 {
	background-image: url(../img/bg2.jpg);
}
.bg3 {
	background-color: var(--colorBlackFull);
	background-image: url(../img/back_a_last.jpg);
}

.bgbw {
	background-attachment: fixed;
	background-image: url(../img/bgbw.jpg);
	background-size: cover;
}

table {
	/*table-layout: fixed;*/
	border-spacing: 0px;
}

table tr td,
table tr th {
	vertical-align: top;
	text-align:left;
	/*overflow: auto;*/
	padding: 0px;
}

table.middlealign td {
	vertical-align:middle;
}

.hovertablecontainer {
	overflow-y:auto;
    /*max-height: calc(100vh - 7rem);*/
    border-radius: var(--borderDefault) var(--borderDefault) 0rem 0rem;
}

#dashboard_import_protocol_table_container {
	height: 55%;
}


table.hovertable {
	background-color: var(--colorWhiteFull);
	
	width: 100%;
    table-layout: auto;
	
    border: 1px solid var(--colorBlack025);
    border-radius: var(--borderDefault);

    margin-bottom: 1rem;
    box-shadow: 0rem 0.5rem 1rem var(--colorBlack005);
}

table.hovertable .center{
    text-align: center;
}

table.hovertable tr{
	transition: color var(--transitionQuick), background-color var(--transitionQuick);
}

table.hovertable td {
	padding: 0.75rem 0.5rem;
	border-bottom:1px solid var(--colorWhiteFull);
	border-top:1px solid var(--colorBlack025);
}

table.hovertable tr{
	background-color: var(--colorWhite025);
}

/*
table.hovertable tr:nth-child(odd){
	background-color: var(--colorLightGray075);
}

table.hovertable tr:nth-child(even){
	background-color: var(--colorWhite025);
}*/

table.hovertable th.edit {
	background-color: var(--colorOrange075HTFull);
	text-align:center;
}


table.hovertable th.view {
	background-color: var(--colorOrange075HTFull);
    background-image: url(/img/svg/folder_black.svg);
    background-repeat: no-repeat;
    background-position: 0.4rem 1.6rem;
    background-size: 1.2rem;
	text-align:center;
}
table.hovertable th.view2 {
	background-color: var(--colorOrange075HTFull);
    background-image: url(/img/svg/folder_black.svg);
    background-repeat: no-repeat;
    background-position: 2.2rem 1.6rem;
    background-size: 1.2rem;
	text-align:center;
}
table.hovertable th.view2.open ,
table.hovertable th.view.open {
	background-image: url(/img/svg/closefolder_black.svg);
}

table.hovertable th{
	padding: 0.5rem 0.5rem;
	text-overflow: ellipsis;
    overflow: hidden;
	position:sticky;
	top:0;
	z-index: 1;
	font-weight: 600;
    font-size: var(--fontSmall2);
    color: var(--colorBlack050);
    background-color: var(--colorBlack001);
}

/*
table.hovertable th{
	padding: 0.5rem 0.5rem;
	background-color: var(--colorBlueFull);
    color: var(--colorWhiteFull);
	text-overflow: ellipsis;
    overflow: hidden;
}*/

table.hovertable td.edit {
	background-image: url(/img/64/edit_black_50.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 1.2rem;
	width:1.2rem;
	padding: 0.75rem 0.0rem;
	cursor:pointer;
}


table.hovertable td.delete {
	background-image: url(/img/svg/delete_black.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 1.2rem;
	width:1.2rem;
	padding: 0.75rem 0.0rem;
	cursor:pointer;
}


table.hovertable td.view {
	background-image: url(/img/svg/folder_black.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 1.2rem;
	width:1.2rem;
	padding: 0.75rem 0.0rem;
	cursor:pointer;
}

table.hovertable td.opencves {
	background-image: url(/img/svg/mag_black.svg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 1.2rem;
	width:1.2rem;
	padding: 0.75rem 0.0rem;
	cursor:pointer;
}

table.hovertable td.view.open {
	background-image: url(/img/svg/closefolder_black.svg);
}


table.hovertable td.edit.alarm {
	background-image: url(/img/64/bell_black_50.png);
	background-repeat: no-repeat;
	background-position: 0.5rem;
	background-size: 1.5rem;
}

table.hovertable td.edit.alarm ul {
	list-style: none;
}

table.hovertable:not(#dashboard_import_protocol_table) tr:hover{
	background-color: var(--colorBlue005Opa);
}

.projectfiltercontainer {
	background: linear-gradient(var(--colorBlack001) 90%, var(--colorBlack005));
	box-shadow: 0 0 0.5rem var(--colorBlack010) inset;
}
.projectfiltercontainer>td {
    padding: 0rem !important;
	border: none !important;
}

.projectfiltercontainer>td>div {
	position:relative;
	padding: 0rem;
    height: 0rem;          
	overflow: hidden;
    transition: padding var(--transitionNormal) ease, height var(--transitionNormal) ease;
    interpolate-size: allow-keywords;
}

.projectfiltercontainer>td>div .maxinfo {
	top: 2rem;
}

.projectfiltercontainer.shown>td>div {
	padding: 0.75rem 2rem 2rem 2rem;
	height: auto;
}
.buttonWithMargin {
	margin-bottom:1rem;
}
#searchfilterproduct .inner {
	width: 90%;
}

#current_search_terms table{
	margin: 0rem 0.5rem 1rem 0.5rem;
	background: linear-gradient(var(--colorBlack001) 90%, var(--colorBlack005));
    box-shadow: 0 0 0.5rem var(--colorBlack010) inset;
	border:			1px solid var(--colorBlack025);
	border-radius:	var(--borderDefault);
	box-shadow:		0rem 0.5rem 1rem var(--colorBlack005);
	width: calc(100% - 1rem);
}

#new_search_terms button{
	margin: 0.5rem 0.5rem 0.5rem 0;
}


#current_search_terms th {
	padding: 0.5rem 0.5rem;
    text-overflow: ellipsis;
    overflow: hidden;
    position: sticky;
    top: 0;
    z-index: 1;
    font-weight: 600;
    font-size: var(--fontSmall2);
    color: var(--colorBlack050);
    background-color: var(--colorBlack001);
}

#inputsearchname {
	margin: 1rem 1rem 1rem 1rem;
	width: calc(100% - 2rem);
}

#inputsearchterm {
	margin: 0rem 1rem 1rem 1rem;
	width: calc(100% - 2rem);
}


table.hovertable tr:not(.projectfiltercontainer):hover td.view,
table.hovertable tr:not(.projectfiltercontainer):hover td.edit:not(.disabled),
table.hovertable tr:not(.projectfiltercontainer):hover td.delete:not(.disabled){
	background-color: var(--colorOrange025);
	transition: color var(--transitionQuick), background-color var(--transitionQuick);
}

table.hovertable tr:not(.projectfiltercontainer):hover td.opencves {
	background-color: var(--colorBlue025);
	transition: color var(--transitionQuick), background-color var(--transitionQuick);
}


table.hovertable tr:hover td.edit:not(.disabled):hover {
	background-image: url(/img/64/edit.png);
	background-color: var(--colorOrangeFull);
	color: var(--colorWhiteFull);
}

table.hovertable tr:hover td.delete:not(.disabled):hover {
	background-image: url(/img/svg/delete.svg);
	background-color: var(--colorOrangeFull);
	color: var(--colorWhiteFull);
}

table.hovertable tr:hover th.view:hover,
table.hovertable tr:hover td.view:hover {
	background-image: url(/img/svg/folder.svg);
	background-color: var(--colorOrangeFull);
	color: var(--colorWhiteFull);
}

table.hovertable tr:hover td.opencves:hover {
	background-image: url(/img/svg/mag.svg);
	background-color: var(--colorBlueFull);
	color: var(--colorWhiteFull);
}

table.hovertable tr:hover th.view.open:hover,
table.hovertable tr:hover td.view.open:hover {
	background-image: url(/img/svg/closefolder.svg);
}

table.hovertable tr:hover:not(th) td.edit.alarm:hover {
	background-image: url(/img/64/bell.png);
	background-color: var(--colorOrangeFull);
	color: var(--colorWhiteFull);
}

.innerhovertable td {
	padding: 0rem 0rem;
	border-top:1px solid var(--colorWhiteFull);
	border-bottom:1px solid var(--colorBlack025);
}

.autotransform {
	text-transform: capitalize;
}

.gridlist {
	display: flex;
	width: 100%;
    justify-content: center;
}

.gridcell{
	width: 20%;
}

.gridcell ul {
	position: relative;
	left: 15%;
}

.hidden {
	display: none !important;
	opacity: 0 !important;
}

.optionpanel.hidden,
.userpanel.hidden {
	display: none !important;
	opacity: 0 !important;
	transition-property: display, opacity;
	transition-duration: var(--transitionQuick);
	transition-behavior: allow-discrete;
}


#scanner_alert_config {
	min-width: 30vw;
	height: unset;
	opacity: 1;
	transition: var(--transitionSemi);
}
#scanner_alert_config td {
	width: 50%;
}

.invisible {
	height: 0rem;
	opacity: 0 !important;
}

.invisible2 {
	visibility: hidden;
}

.mandotory:after{
	content: ' *';
}

.optionpanel {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100vw;
	height:100vh;
	overflow: hidden;
    backdrop-filter: blur(2px) grayscale(0.5);
	background: radial-gradient(circle, var(--colorDarkGray025) 0%, var(--colorBlack025) 100%);
	z-index:501;
	
	opacity:1;
	display:block;
	transition-property: display, opacity;
	transition-duration: var(--transitionQuick);
	transition-behavior: allow-discrete;
	@starting-style {
		opacity:0;
	}
}

.optionpanel .inner {
    position: absolute;
    right: 1.5rem;
    top: 1rem;
    width: 23rem;
    display: inline-block;
    overflow: hidden;
    background-color: var(--colorWhiteFull);
    padding: 0.5rem;
    color: var(--colorBlackFull);
    border-radius: var(--borderDefault);
	box-shadow: 0 0 1rem var(--colorBlack050);
	padding: 1rem;
}


.optionpanel .inner>img {
	height: 1.5rem;
	margin-bottom: 1rem;
}


.optionpanel .inner .languagesbox {
	position: relative;
    bottom: 0.5rem;
}
.optionpanel .inner .languages text{
	font-family: 'Montserrat';
    letter-spacing: -0.025rem;
    color: var(--colorBlack075);
    opacity: 0.75;
    cursor: pointer;
    font-size: var(--fontHeader1);
}

.optionpanel .inner .languages:hover {
	opacity: 1;
}
	

.userpanel {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100vw;
	height:100vh;
	overflow: hidden;
    backdrop-filter: blur(2px) grayscale(0.5);
	background: radial-gradient(circle, var(--colorDarkGray025) 0%, var(--colorBlack025) 100%);
	z-index:2;
	opacity:1;
	display:block;
	transition-property: display, opacity;
	transition-duration: var(--transitionQuick);
	transition-behavior: allow-discrete;
	@starting-style {
		opacity:0;
	}
}



.userpanel .inner {
	min-width: 30vw;
    border-radius: var(--borderDefault);;
    position: relative;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    top: 50%;
    display: inline-block;
	overflow:hidden;
	box-shadow: 0 0 1rem var(--colorBlack050);
}

.userpanel .big {
	width: 90%;
	height: 80%;
}

.userpanel .inner form {
	white-space: nowrap;
}

 
.userpanel > .inner > .title {
	height: 2.5rem;
	text-align: center;
	vertical-align: middle;
	background-color: var(--colorWhiteFull);
	color: var(--colorBlack075);
	border: solid 1px var(--colorBlack025);
}

.userpanel .inner .title .back {
	height: 2.5rem;
    width: 2.5rem;
    color: var(--colorWhiteFull);
    position: absolute;
    right: 0%;
    top: 0.0rem;
    background-color: var(--colorWhite000);
	transition: background-color var(--transitionQuick);
    cursor: pointer;
    background-image: url(/img/64/chevron_l_black.png);
    background-size: 1.1rem;
	background-position:center;
    background-repeat: no-repeat;
}
.userpanel .inner .title .back:hover {
	background-color: var(--colorOrange025);
}

.userpanel .inner .title .back.close {	
    background-image: url(/img/64/close_black.png);
}

.userpanel .inner .title text {
	font-family: 'Montserrat';
	letter-spacing: -0.025rem;
	font-size: 1.4rem;
	position:relative;
	top: 0.4rem;
}

.userpanel .inner .title.delete {
	color: var(--colorWhiteFull);
	background-color: var(--colorRedFull);
}

.userpanel .inner .title.warning {
	color: var(--colorBlackFull);
	background-color: var(--colorOrangeFull);
}

.userpanel .inner #alertboxtitleback.title {
	color: var(--colorWhiteFull);
	background-color: var(--colorBlueFull);
}

.userpanel .inner .title.delete .back{
	background-image: url(/img/64/chevron_l_white.png);
}



.userpanel .inner .content {
	background-color: var(--colorWhiteFull);
	padding: 1rem 0.5rem 1rem 0.5rem;
	height: 100%;
	overflow: auto;
	max-height: 80vh;
    max-width: 96vw;
}

#searchfilterproduct.userpanel .inner .content {
	min-height: 60vh;
}
/*#searchalarmproduct.userpanel .inner .content {
	min-height: 60vh;
}*/


.userpanel td {
	padding: 0rem 0.5rem;
}

#password_strength_indicator_invite,
#password_strength_indicator_change,
#password_strength_indicator {
	width: 20rem;
    margin: auto;
    height: 1.5rem;
    position: relative;
	
}

#password_strength_indicator_back_invite,
#password_strength_indicator_back_change,
#password_strength_indicator_back {
	width: 1%;
    background-color: red;
    height: 1rem;
	border-radius: var(--borderQuater);
	transition: var(--transitionNormal);
	margin-top: 0.25rem;
	border: solid 1px var(--colorBlack025);
}

#password_strength_indicator_text_invite,
#password_strength_indicator_text_change,
#password_strength_indicator_text {
    position: absolute;
    top: 2px;
    text-align: center;
    width: 100%;
	/*text-shadow: 0px 1px 2px var(--colorWhiteFull);*/
	transition: var(--transitionNormal);
	font-size: var(--fontSmall3);
	color: var(--colorBlack050);
}

.password_strength_indicator_text_too_long{
	color: var(--colorWhiteFull) !important;
}

.mainpages {
	z-index: 1;
}

.teaserContainerParent{
	position: absolute;
    top: 0;
    left: 0;
    height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
.teaserContainer {
	position: absolute;
    bottom: 2rem;
    left: 2rem;
    height: 16vw;
	-webkit-perspective: 100px;
    perspective: 500px;
	perspective-origin: left center;
	z-index: 2;
	aspect-ratio: 2;
}

.teaserContainer #subtitle {
	height: 8rem;
	max-height: 8rem;
	text-overflow: ellipsis;
    overflow: hidden;
}

/*
.teaser {
	position: absolute;
    top: 0rem;
    left: 0rem;
    width: calc(100% - 1rem);
	padding: 0.5rem;
    
	aspect-ratio:2;
    color: var(--colorWhite075);
    overflow: hidden;
	transform-origin: left center;
	-webkit-transform-origin: left center;
	transform: translate(0rem) rotateY(0deg);
    -webkit-transform: translate(0rem) rotateY(0deg);
	opacity:1;
	transition: var(--transitionQuick);
	transition-timing-function: ease-in-out;
	transform-style: preserve-3d;
    transition-behavior: allow-discrete;
	
	background-color: var(--colorBlue033);
	border: solid 1px var(--colorWhite075);
	color: var(--colorWhiteFull);
	border-radius: var(--borderDefault);
}
*/
.teaser {
    position: absolute;
    top: 0rem;
    left: 0rem;
    /*width: calc(100% - 1rem);*/

    transform-origin: left center;
    -webkit-transform-origin: left center;
    transform: translate(0rem) rotateY(0deg);
    -webkit-transform: translate(0rem) rotateY(0deg);
    opacity: 1;
    transition: var(--transitionQuick);
    transition-timing-function: ease-in-out;
    transform-style: preserve-3d;
    transition-behavior: allow-discrete;

}

.teaser .cveCard {
	background-color: var(--colorWhite025);
	box-shadow: 0 0 0 var(--colorBlue025), -1px 1px 0.5rem var(--colorWhite050) inset;
	transition: background-color var(--transitionSemi);
	backdrop-filter: blur(0.2rem);
}

.turnedaway {
	color: var(--colorOrange075);
	/*opacity:0;*/
	/*transform: translate(-5rem) rotateY(90deg);
    -webkit-transform: translate(-5rem) rotateY(90deg);*/
	transform: translate(-80rem) rotateY(0deg);
    -webkit-transform: translate(-80rem) rotateY(0deg);
}

.teaser:hover  .cveCard {
	background-color: var(--colorWhiteFull);
	box-shadow: 0 0 1rem var(--colorBlue025);
	/*border: solid 1px var(--colorWhiteFull);
	color: var(--colorWhiteFull);*/
	/*transform: translate(0rem) rotateX(-2deg);
    -webkit-transform: translate(0rem) rotateX(-2deg);*/
}


.teaserTitle {
	font-size: 1.2rem;
    font-weight: bold;
    text-align: center;
    padding: 0.5rem 0 0.8rem 0;
	/*text-shadow: 0.0rem 0.0rem 0.3rem var(--colorBlackFull);*/
}

.teaserText {
	/*text-shadow: 0.0rem 0.0rem 0.2rem var(--colorBlackFull);*/
}


#chart-cves {
	width: 40vw;
	aspect-ratio: 16 / 9;
	background-color: var(--colorWhiteFull);
}

/*
#productSearchResutlts {
    max-height: 80vh;
}*/



.autocomplete {
  position: absolute;
  background-color: var(--colorWhiteFull);
  box-shadow: 0.1rem 0.1rem 1rem var(--colorBlack025);
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-radius:var(--borderDefault);
  min-width:12rem;
  z-index:2;
}
.autocomplete ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}
.autocomplete ul li {
  padding: 0.5rem 0;
}
.autocomplete ul li:hover {
  background: var(--colorLightGray025);
}

.inputsmall {
	width:5rem;
}


span.cpestring {
	display: block;
}

.cpestring {
	padding-top: 0.5rem !important;
}
.cpestring text {
	padding-left: 0.25rem;
	padding-right: 0.25rem;
}

.cpestring text:not(.grey) {
	cursor:pointer;
}
/*
.cpestring text:hover:not(.grey) {
	background-color: var(--colorBlue025);
}*/

.inputCPEHighlight,
.stringCPEHighlight {
	color: var(--colorWhiteFull) !important;
	background-color: var(--colorBlue050) !important;
}


.grey {
	color:  var(--colorDarkGrayFull);
}

.inactive {
	color:  var(--colorHalfGrayFull);
}

.sizeResTableA {
	width:13%;
}

.deletebutton {
	color: var(--colorRedFull);
}

.deletebutton:hover {
	color: var(--colorWhiteFull);
	background-color: var(--colorRedFull);
}

.deletebuttonaction {
	width: 9rem;
	user-select:none;
}

.table33 {
	width:33%;
}

.table66 {
	width:66%;
	vertical-align:top !important;
}

.table40 {
	width:40%;
}

.table60 {
	width:60%;
}

.table33 input:not([type="radio"]){
	width: 95%;
}

.table33smallselect{
	width: 100%;
}

.leftspace1 {
	padding-left:1%;
}

.footerTable {
	position: absolute;
    bottom: 2vh;
}

#ProductSearchResultListPager, 
#productSearchResutltsPager,
#ProductProductCveListPager {
	display: flex;
	justify-content: center;
	align-items: center;
}

#ProductSearchResultListPager button,   
#productSearchResutltsPager button,
#ProductProductCveListPager button{
	margin: 0.5vw;
}

#ProductSearchResultListPager button.selected, 
#productSearchResutltsPager button.selected,
#ProductProductCveListPager button.selected {
	background-color: var(--colorBlack010);
}

mark{
	background-color: var(--colorOrangeFull);
	color: var(--colorWhiteFull);
	font-weight: bold;
}

.clickable {
	cursor: pointer;
}

.help {
		cursor: help;
}

.cvePanel {
	width: 100%;
	position:relative;
	background-color: var(--colorWhiteFull);
	border-radius: var(--borderDefault);
	overflow:hidden;
}

.cvePanel .cvetitleid {
	text-align: center;
	background-color: var(--colorBlack010);
	color: var(--colorBlackFull);
	padding: 0.3rem;
	font-size: 1.4rem;
}


.cvePanel .cvenumber {
	position:absolute; 
	left: 1rem;
    top: 1.0rem;
    font-size: var(--fontHeader1);
}

.cvePanel .siderect {
	float: right;
    display: table;
    margin: 1rem;
    width: 18%;
    position: relative;
    font-size: var(--fontSmall12);
}

.cvePanel .siderect *{
    font-size: var(--fontSmall2);
}


.cvePanel .detailrect {
	display: table;
	width: calc(100% - 1rem);
	background-color:var(--colorBlack005);
	position:relative;
	top: 0rem;
	right: 0rem;	
	padding: 0.5rem;
	font-size: var(--fontSmall2);
}

.cvePanel .detailrect *{
	font-size: var(--fontSmall2);
}

.cvePanel .detailrect.detailrectB {
	position:relative;
	margin-top: 1rem;
}

.cvePanel .detailrect .cve_detailrect_main_title {
	font-size: 1rem;
	font-weight:bold;
	text-transform: uppercase;
}
.cvePanel .detailrect .cve_detailrect_sub_title {
	font-size: 0.75rem;
	font-weight:bold;
	text-transform: uppercase;
}


.cvePanel .cveData {
	display: flow-root;
	margin: 1rem;
}

.cvePanel .cveData .cveDataSplit{
	display: inline-block;
    width: calc(50% - 1rem);
    vertical-align: top;
}
.cvePanel .cveData .cveDataSplit.left{
	margin-right:2rem;
}



.cvePanel .catTitle {
	display: table;
	width: calc(100% - 0.75rem);
	position:relative;
	padding: 0.25rem;
	padding-left: 0.5rem;
	border-radius: var(--borderDefault) var(--borderDefault) 0 0;
	font-weight:bold;
	background-color: var(--colorWhiteFull);
    color: var(--colorBlackFull);
    border-bottom: solid 1px var(--colorBlack025);
    user-select: none;
	font-size: 1.25rem;
}

.cvePanel .catTitle>text{
	
	font-size: 1.25rem;
}
.cvePanel .datasourceTitle {
	position:relative;
	font-weight:bold;
	background-color: var(--colorWhiteFull);
    color: var(--colorBlackFull);
    user-select: none;
}

.cvePanel ._minibutton {
	display: block;
    width: 10%;
    text-align: center;
    margin: 0.1rem 40%;
}

.cvePanel .catContent {
	display: table;
	width: calc(100% - 1rem);
	padding: 0.5rem;
	background-color:var(--colorWhiteFull);
	border-radius: 0 0 var(--borderDefault) var(--borderDefault);
}

.cvePanel .catContent.history {
	margin-bottom: 1rem;
}

.cvePanel .catTitleSub {
	display: table;
	width: calc(100% - 0.75rem);
	position:relative;
	padding: 0.25rem;
	padding-left: 0.5rem;
	border-radius: var(--borderDefault) var(--borderDefault) 0 0;
	font-weight:bold;
	background-color: var(--colorBlack005);
    color: var(--colorBlack075);
    border-bottom: solid 1px var(--colorBlack025);
    user-select: none;
}


.cvePanel .productsRect {
	display: table;
	width:100%;
	left: 0rem;
	padding: 0.5rem;
	background-color: var(--colorBlack001);
	border: 1px solid var(--colorBlack010);
}

.cvePanel .productsRect .shortside {
	width:15%;
}

.cvePanel .productsRect .vulnerable {
	color: var(--colorRedFull);
}

.cvePanel .productsRect .title {
	font-weight:bold;
}

.cvePanel .productsRect .cpe {
	text-decoration: italic;
}

.cvePanel .productsRect .conjunction {
	font-weight:bold;
    color: var(--colorBlue050);
}
/*
.cvePanel .cvemoredetails{
	width: calc(100% - 2rem);
    margin: 1rem;
	display: table;
}*/

.mainmenu {
	position:fixed;
	top:2.5rem;
	left:0px;
	height: calc(100% - 2.5rem);
	padding: 0rem 0rem;
	color: var(--colorBlack075);
	user-select: none;
	display: table-cell;
	line-height: 1.5rem;
	transition: width var(--transitionNormal) ease, padding var(--transitionNormal) ease;
} 

.frontendpage {
	position: absolute;
	top:2.5rem;
	/*min-height: 100vh;*/
	display: table-cell;
	vertical-align: top;
	transition: width var(--transitionNormal) ease, left var(--transitionNormal) ease;
}


.bodyloggedin {
	
    height: 100vh;
	background-color: var(--colorWhiteFull);
   /* background-image: url(/img/back_bez_a.jpg);
    background-attachment: fixed;
    background-size: cover;
    background-position: left top;*/
}

.mainmenu .cat {

	margin: 1rem 0rem;
	padding:0.75rem 2.5rem 0.5rem 0rem;
	opacity:0.75;
	background-position: 0.2rem center;
	background-repeat: no-repeat;
	background-size: 1.5rem;
	padding-left: 2.5rem;
}

.mainmenu .cat.sub {
	width: 100%;
    margin: 0.5rem 0rem;
    padding: 0rem 2.5rem;
    opacity: 0.75;
}

.mainmenu .cat.sub text {
	font-size: 1rem;
}

.mainmenu .catactive {
	opacity:1;
	background-color: var(--colorBlueFull);
	color: var(--colorWhiteFull);
}


.mainmenu>div {
	cursor: pointer;
}
.mainmenu text {
	margin: 0rem 0rem;
	position: relative;
	transition: var(--transitionQuick);

	
	font-size: var(--fontDefault);
}

.mainmenu>div:has(> *:hover) {
	opacity:1;
}

.mainmenu .languages {
	position:absolute;
	bottom:1rem;
	left: 1rem;
}


#cat_Dashboard {
	background-image: url(../img/64/home_black.png);
	margin-bottom:2rem;
}
#cat_Dashboard.catactive {
	background-image: url(../img/64/home.png);	
}

#cat_Projects {
	background-image: url(../img/64/dart_black.png);	
}
#cat_Projects.catactive {
	background-image: url(../img/64/dart.png);	
}

#cat_Products {
	background-image: url(../img/products_black.svg);	
}
#cat_Products.catactive {
	background-image: url(../img/products.svg);	
}

#cat_Projects_Scanners {
	background-image: url(../img/filterlist_black.svg);	
}
#cat_Projects_Scanners.catactive {
	background-image: url(../img/filterlist.svg);	
}

#cat_CVE {
	background-image: url(../img/64/shield_black.png);
	margin-bottom:2rem;
}
#cat_CVE.catactive {
	background-image: url(../img/64/shield.png);	
}

#cat_Profile {
	margin-bottom:2rem;
	background-image: url(../img/user-settings_black.svg);	
}
#cat_Profile.catactive {
	background-image: url(../img/user-settings.svg);	
}

#cat_GlobalSettings {
	margin-bottom:4rem;
	background-image: url(../img/global-settings_black.svg);	
}
#cat_GlobalSettings.catactive {
	background-image: url(../img/global-settings.svg);	
}

#cat_Usermanager {
	background-image: url(../img/user_black.svg);	
}
#cat_Usermanager.catactive {
	background-image: url(../img/users.svg);	
}

#cat_Teammanager {
	background-image: url(../img/users_black.svg);	
}
#cat_Teammanager.catactive {
	background-image: url(../img/users.svg);	
}

#cat_Logout {
	background-image: url(../img/64/logout_black.png);	
}


/*
#cat_Dashboard {
	background-image: url(../img/64/home.png);	
}*/

.loggedin {
	display: table-cell;
}


.frontendpage .contentwrap {
	background: var(--colorBackGrayFull);
	height: fit-content;
	min-height: calc(100vh - 2.5rem);
}

.frontendpage .content {
	display: table;
	table-layout:fixed;
    width: calc(100% - 2rem);
	padding-top: 1rem;
	padding-left: 1rem;
	padding-right: 1rem;
	padding-bottom: 1rem;
}

.frontendpage #dashboard {
	display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.frontendpage .imagebutton {
	width: 0.6rem;
	padding-right: 0.2rem;
}



.loading {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100vw;
	height:100vh;
	overflow: hidden;
    backdrop-filter: blur(2px);
	background-color: var(--colorBlack050);
	z-index:1000;
	display:table-cell;
	text-align:center;
	vertical-align:middle;
	opacity: 1;
	transition: opacity var(--transitionNormal);
}


.loading h2 {
	color: var(--colorWhiteFull);
    position: absolute;
    top: calc(50% - 0.5rem);
    left: calc(50% - 5rem);
}


.hiddenanim {
	visibility: hidden;
	opacity: 0;
}

.loader {
    position: absolute;
    top: calc(50% + 1.5rem);
    left: calc(50% - 1.5rem);
    width: 3rem;
    height: 3rem;
    padding: 0.2rem;
    aspect-ratio: 1;
    border-radius: var(--border50);
    background: 
			conic-gradient(var(--colorWhiteFull) 0%, var(--colorWhiteFull) 45%, var(--colorBlueFull) 50%, var(--colorWhiteFull) 50% , var(--colorWhiteFull) 95%, var(--colorOrangeFull) 100%);
    --_m: 
			conic-gradient(var(--colorBlack000) 20%, var(--colorBlackFull) 50%, var(--colorBlack000) 50%, var(--colorBlack000) 70%, var(--colorBlackFull) 100%), linear-gradient(var(--colorBlackFull) 0 0) content-box;
    -webkit-mask: var(--_m);
    mask: var(--_m);
    -webkit-mask-composite: source-out;
    mask-composite: subtract;
    animation: scroller 4s infinite linear
}
@keyframes scroller {to{transform: rotate(1turn)}}


.cards {
	display: flex;
    justify-content: left;
    flex-direction: row;
    flex-wrap: wrap;
	gap: 1rem;
}

.cards>div {
	width: calc(33% - 0.5rem);
    min-height: 6vw;
	position: relative;
	box-shadow: 0px 0px 1rem var(--colorBlack000);
	transition: var(--transitionQuick);
	border-radius: var(--borderDefault);
	overflow:hidden;
	background-color:var(--colorWhiteFull);
	cursor: pointer;
}

#ProductSearchTermCards.cards>div {
    min-height: 10vw;
}

#ProductProductCveCards.cards>div {
    min-height: 17vw;
}

.cards>div:hover {
	transform-style: preserve-3d;
    transform: perspective(50cm) rotateX(-1deg) scale(1.015);
	z-index:1;
	box-shadow: 0px 0px 1rem var(--colorBlack010);
}
.cards>div:hover .edit {
    background-color: var(--colorOrange075);
}


.cards table {
	width: 100%;
}

.cards .title {
    position: relative;
    top: 0px;
	height: 1rem;
    width: calc(100% - 1rem);
    left: 0.0rem;
    padding: 0.5rem;
    font-weight: bold;
    background-color: var(--colorBlueFull);
    color: var(--colorWhiteFull);
	text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.cards .title.inactive {
    background-color: var(--colorBlue050);
}


.cards .edit {
	position: absolute;
    bottom: 0px;
    right: 0rem;
    padding: 0.25rem;
    font-weight: bold;
	background-color: var(--colorBlack025);
    color: var(--colorWhite075);
    cursor: pointer;
    transition: var(--transitionQuick);
    height: 2rem;
    min-width: 2rem;
    border-top-left-radius: var(--borderDefault);
    overflow: hidden;
    text-align: center;
    vertical-align: middle;
}

.cards .edit.alarm {
	position: absolute;
    bottom: 0px;
    left: 0rem;
    padding: 0.25rem;
    font-weight: bold;
    background-color: var(--colorBlack025);
    color: var(--colorWhite075);
    transition: var(--transitionQuick);
    height: 2rem;
    min-width: 2rem;
    border-radius: 0 var(--borderDefault);
    overflow: hidden;
    text-align: center;
    vertical-align: middle;
    aspect-ratio: 1;
}

.cards .edit text {
	position: relative;
    top: 0.5rem;
}

.cards .edit img {
	position: relative;
    top: 0.3rem;
    height: 1.4rem;
}

.cards>div:has(> *:hover) .edit:hover {
	background-color: var(--colorOrangeFull);
}

.cards .cvss {
	padding: 0.5rem 0;
	width: calc(100% - 2.5rem);
    height: 2rem;
    cursor: pointer;
    color: var(--colorBlack050);
}

.cards .description {
	height: calc(100% - 2rem);
	padding: 0.5rem;
	transition: 0.25s;
	position: relative;
	text-overflow: ellipsis;
    overflow: hidden;
}

#ProductProductCveCards .description {
	max-height: calc(100% - 11rem);
	-webkit-mask-image: linear-gradient(180deg, var(--colorBlackFull) 70%, var(--colorBlack000) 90%);
    mask-image: linear-gradient(180deg, var(--colorBlackFull) 70%, var(--colorBlack000) 90%);
}

.cards .metric {
	display: table;
	padding: 0.5rem;
    position: absolute;
    bottom: 2.5rem;
    height: 4rem;
    cursor: pointer;
	color: var(--colorBlack075);
}

.cards .metricversion {
	display: table-cell;
}

.cards .footer {
	padding: 0.5rem;
    position: absolute;
    bottom: 0.25rem;
    height: 2rem;
    cursor: pointer;
    color: var(--colorBlack075);
}

.cards .amount {
	padding: 0.5rem 0;
    position: relative;
    height: 1rem;
    cursor: pointer;
    color: var(--colorBlack050);
}



#userprofile table{
	table-layout: unset;
}

.innerform.left,
.innercard.left {
	width: 20rem;
}

.innerform.right,
.innercard.right {
	width: 50rem;
}
.innerform>div,
.innercard>div{
    background:		var(--colorWhiteFull);
	border:			1px solid var(--colorBlack025);
	border-radius:	var(--borderDefault);
	padding:		1rem 1rem;
	margin-bottom:	1rem;
	box-shadow:		0rem 0.5rem 1rem var(--colorBlack005);
}
.innerformNoBorder>div{
	padding:		1rem 1rem;
	margin-bottom:	1rem;
}
.innercard>div h2{
	font-size:var(--fontSmall1);
	display:flex;
	align-items:center;
	gap:0.5rem;
	margin-bottom: 1rem;
	color:var(--colorBlack075);
}
.innercard>div h2 text{
	font-size:var(--fontSmall1);
	
}

/*

.cveCard {
	background:		var(--colorWhiteFull);
	border:			1px solid var(--colorBlack025);
	border-radius:	var(--borderDefault);
	padding:		1rem 1rem;
	margin-bottom:	1rem;
	box-shadow:		0rem 0.5rem 1rem var(--colorBlack005);
}

#cvefollowList .cveCard {
	padding:		0.5rem 0.5rem;
	margin-bottom:	0.5rem;
}
.cveCard h2 {
	font-size:var(--fontSmall1);
	display:flex;
	align-items:center;
	gap:0.5rem;
	margin-bottom: 1rem;
	color:var(--colorBlack075);
}

.cveCard .alarm {
	margin-bottom: 0rem;
}
.cveCard h2 text {
	font-size:var(--fontSmall1);
}

*/

.innerform.right>div,
.innercard.right>div{
	margin-left:1rem;
    display: block;
    border-radius: var(--borderDefault);
    overflow: hidden;
    background-color: var(--colorWhiteFull);
    margin-bottom: 1rem;
	position: relative;
	width: 100%;
}

.innerform .title ,
.innercard .title {
    position: relative;
    top: 0px;
    width: calc(100% - 1rem);
    left: 0.0rem;
    padding: 0.5rem;
    font-weight: bold;
    background-color: var(--colorBlueFull);
    color: var(--colorWhiteFull);
	text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.innerform .title ,
.innercard .title {
	background-color: var(--colorBlack010);
    color: var(--colorBlackFull);
}


.innerform .innercardcontent ,
.innercard .innercardcontent {
	padding: 0.5rem;
}

/*
.innerform .innerformcontent table td:first-child ,
.innercard .innercardcontent table td:first-child {
	width: 10rem;
}
*/
#impressum .inner .content,
#dataprotection .inner .content{
	max-height: 70vh;
	max-width: 70vw;
}

dialog {
	border: none;
	max-width: 100% !important;
    max-height: 100% !important;
}

.formtable{
	width:100%;
	transition: var(--transitionQuick);
}

.formtable td{
	vertical-align: middle;
}

.formtable text{
	width:10rem;
}

.formtable .right{
	text-align: right;
}
.formtable .center{
    text-align: center
}

.formtable .selecttype{
    width: 7rem;
}
.formtable .product_vendor{
    width: 10rem;
}
.formtable .product_product{
    width: 15rem;
}

.formtable .inputsmaller{
    width: 7rem;
}

.formtable td.firstline {
    width: 11rem;
}
.formtable td.firstlineb {
    width: 5rem;
}
#cve_alert_config_flags > tbody > tr > td.firstlineb {
	vertical-align: middle;
	width: 50%;
}

#product_search_advanced_cpe_visualizer {
   height: 1.8rem;
}

.userdataconfig{
	position:relative;
	width: 40rem;
}
.mailconfig{
	position:relative;
	width: 40rem;
}

#imageView {
    display:flex;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(2px) grayscale(0.5);
	background: radial-gradient(circle, var(--colorDarkGray025) 0%, var(--colorBlack025) 100%);
    z-index: 100;
    justify-content: center;
    align-items: center;
}


@-webkit-keyframes scale-up-center {
  0% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes scale-up-center {
  0% {
    -webkit-transform: scale(0.5);
            transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

#imageViewInner {
    animation: scale-up-center 0.4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
    box-shadow: 0 0 1rem var(--colorBlack010);
	border-radius: var(--borderDefault);
    max-width: 90vw;
    max-height: 90vh;
}

#mail_teampreview,
#mail_customerpreview,
#mailpreview {
	text-align: center;
	position: absolute;
    left: 25rem;
    top: 2rem;
	width: 20rem;
	cursor:pointer;
}
#mail_teampreview img,
#mail_customerpreview img,
#mailpreview img{
	width: 20rem;
}

#mail_alert_detail {
	padding: 0rem 1rem;
}


.edit.alarm {
	padding-left: 3rem;
}

.dontstretch {
	height: 2rem;
}

.collabsable {
	
}

.collabsed {
	height: 20rem !important;
    overflow: hidden;
    display: block !important;
	/*-webkit-mask-image: linear-gradient(180deg, var(--colorWhiteFull) 60%, var(--colorBlack000) 70%);
    mask-image: linear-gradient(180deg, var(--colorWhiteFull) 60%, var(--colorBlack000) 70%);*/
	/*background-image: url(/img/64/chevron_d_black.png);
	background-size: 1rem;
	background-repeat: no-repeat;
	background-position: center 9rem;*/
}

.collabsed .collabsedinner {
	height: 20rem !important;
    overflow: hidden;
    display: block !important;
	-webkit-mask-image: linear-gradient(180deg, var(--colorWhiteFull) 80%, var(--colorBlack000) 90%);
    mask-image: linear-gradient(180deg, var(--colorWhiteFull) 80%, var(--colorBlack000) 90%);
}


.icon_active {
	background-image: url(/img/64/check.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 1rem;
}
.icon_inactive {
	background-image: url(/img/64/close_gray.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 1rem;
}

#mail_alert_custom_detail > td:nth-child(3),
#mail_alert_default_detail > td:nth-child(3) {
	    padding: 0rem 1rem;
}

#mail_alert_default_detail > td:nth-child(3) td {
	    padding: 0.25rem 0rem;
}


#cve_alert_config_global > tbody > tr > td:nth-child(2){
	    padding: 0rem 1rem;
}

.backgroundvideo {
	position: absolute;
    bottom: 0;
    right: 0;
    z-index: 0;
	width: 100%;
    height: 100%;
    object-fit: cover;
}

/*
background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom right;
	*/
/*
div[name="content_page_6"] .backgroundvideo {
	right: unset;
	left: 0;
}*/


#header_main_project,
#header_main_scanner {
	text-align:center;
	border-bottom: 1px solid var(--colorGray153Full);
}

#header_main_project,
#header_project_active,
.productSearchTermListBorder tr td:nth-child(2) {
	border-right: 1px solid var(--colorGray153Full);
}


.cveview_reftable{
	width:100%;
}
/*
.cveview_metrictableinner {
	width:100%;
}
.cveview_metrictableinner tr:nth-child(odd){
	background-color: var(--colorLightGray010);
}
*/

.cveview_reftable th {
	padding: 0.25rem;
    padding-left: 0.5rem;
    background-color: var(--colorBlack005);
    color: var(--colorBlack075);
    border-bottom: solid 1px var(--colorBlack025);
	line-height: 1.4rem;
}
.cveview_reftable td {
	padding: 0.25rem;
	border-top: 1px solid var(--colorWhiteFull);
	border-bottom: 1px solid var(--colorGray204Full);
}

.cveview_reftable tr th:nth-child(2) {
	width:23%;
}
.cveview_reftable tr th:nth-child(3) {
	width:16%;
}
/*
.cveview_metrictableinner {
	table-layout: fixed;
}
.cveview_metrictableinner th,
.cveview_metrictableinner td{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

 */
/*
#projectList th:nth-child(1){
	width:5%;
}
#projectList th:nth-child(2){
	width:15%;
}*/
#projectList th{
	height: 2rem;
}
#projectList .name {
	width:15rem;
}
#projectList .project_description {

}
#projectList .project_amount_searches {
	width:1.2rem;
}
#projectList .active {
	width:1.2rem;
}
#projectList .team_shares {
	background-image: url(../img/users_black.svg);
    background-repeat: no-repeat;
    background-position: 0.1rem 0.5rem;
    background-size: 1rem;
    opacity: 0.75;
	width:1.2rem;
}
#projectList .user_shares {
    background-image: url(../img/user_black.svg);
    background-repeat: no-repeat;
    background-position: 0.1rem 0.5rem;
    background-size: 1rem;
    opacity: 0.75;
	width:1.2rem;
}
.tablebutton{
	width:1.2rem;
}
.tablebutton3{
	width:6rem;
	max-width:6rem;
}

#searchtermTable tr>th:nth-child(1){
	width:10%;
}
#searchtermTable tr>th:nth-child(3){
	width:5%;
}
/*#projectList th:nth-child(7){
	width:5%;
}*/

.sharetableContainer {
	overflow-y:auto;
	overflow-x:hidden;
	max-height: 30vh;
}

#project_shares_user,
#project_shares,
#project_shares_team,
#members_team,
#membership_team,
.sharetable {
    width: 100%;
	min-width: 30vw;
    table-layout: auto;
}

#project_teams,
#project_shares,
#membership_team,
#members_team,
#project_shares_team,
#project_shares_user {
	min-width: 30vw;
}

.sharetable .title {
	font-family: 'Montserrat';
    height: 1.5rem;
    text-align: center;
    vertical-align: middle;
    background-color: var(--colorWhiteFull);
    color: var(--colorBlack075);
    border-bottom: solid 1px var(--colorBlack025);
	margin-bottom:0.5rem;
}

.sharetable th{
	padding: 0.5rem 0.5rem;
    text-overflow: ellipsis;
    overflow: hidden;
	position:sticky;
	top:0;
	z-index: 100;
    font-weight: 600;
    font-size: var(--fontSmall2);
    color: var(--colorBlack050);
    background-color: var(--colorBlack001opa);
}

#dashboard_import_protocol_table th { 
	background-color: var(--colorBlack001opa);
}

#project_shares tr:nth-child(2),
#project_teams tr:nth-child(2),
#members_team tr:nth-child(2),
#project_shares_team tr:nth-child(2),
#membership_team tr:nth-child(2),
#project_shares_user tr:nth-child(2){

	font-style: italic;
}

#project_teams td,
#project_shares_team td,
#members_team td,
#membership_team td,
#project_shares_user td,
#project_shares td {
	border-bottom: solid 1px var(--colorBlack010);
	vertical-align:middle;
}

#project_shares
#project_teams th:nth-child(3),
#project_teams th:nth-child(4),
#project_teams th:nth-child(5),
#project_shares_team th:nth-child(2),
#project_shares_team th:nth-child(3),
#project_shares_team th:nth-child(4),
#members_team th:nth-child(4),
#membership_team th:nth-child(3),
#project_shares_user th:nth-child(2),
#project_shares th:nth-child(4),
#project_shares th:nth-child(5),
#project_shares th:nth-child(6),
#project_shares_user th:nth-child(3),
#project_shares_user th:nth-child(4),
#project_shares_user th:nth-child(5){
	width:4rem;
}



/*
#project_shares_user th:nth-child(2){
	width:20rem;
}*/

#ProductSearchTermList > tbody > tr > th:nth-child(2) {
	width:5%;
}
#ProductSearchTermList > tbody > tr > th:nth-child(3) {
	width:5%;
}

#ProductSearchTermList td {
	overflow:hidden;
}

#ProductSearchTermList > tbody > tr > th:nth-child(7) {
	width:5%;
}

.nomargin {
    margin: unset;
}
.nowidth {
    width: unset;
}

.cveview_metricTableHeader {
	display:inline;
    position: absolute;
    top: 0.0rem;
}

.tableMetric {
	display: table;

    table-layout: fixed;
	width: 100%;
}
.tableMetric tr {
	display: table-cell;
	overflow: hidden;
    text-overflow: ellipsis;
}
.tableMetric tr td, 
.tableMetric tr th {
	display: block;
	line-height: 1.4rem;
	height: 1.4rem;
	padding: 0.25rem;
	/*border-top: 1px solid var(--colorWhiteFull);*/
	border-bottom: 1px solid var(--colorBlack010);
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/*.tableMetric tr th {
	background-color: var(--colorBlack005);
}*/

.tableMetric tr:nth-child(1){
	width:15%;
} 
.tableMetric tr:last-child td{
	border-bottom: 1px solid var(--colorBlack000);
} 



.cveview_metricTable{
	width: 100%;
	
}
.metricunselected {
	padding: 0.25rem 1rem;
	display:inline-block;
	margin: 0rem 1rem;
	color: var(--colorBlack025);
	border: solid 1px var(--colorBlack025);
	cursor: pointer;
	border-radius: var(--borderDefault);
	background-color: var(--colorWhiteFull);
	transition: color var(--transitionQuick), background-color var(--transitionQuick), border var(--transitionQuick);
	user-select: none;
}
.metricunselected:hover {
	background-color: var(--colorBlue005Opa);
	border: solid 1px var(--colorBlack050);
}

	
.metricselected {
	padding: 0.25rem 1rem;
	display:inline-block;
	margin: 0rem 1rem;
	color: var(--colorBlack075);
	border: solid 1px var(--colorBlack025);
	cursor: pointer;
	border-radius: var(--borderDefault);
	background-color: var(--colorBackGrayFull);
	transition: color var(--transitionQuick), background-color var(--transitionQuick), border var(--transitionQuick);
	user-select: none;
}
.metricselected:hover {
	background-color: var(--colorBlue005Opa);
	border: solid 1px var(--colorBlack050);
}

/*
severityCritical	Critical (9.0–10.0): Immediate, severe risk; often allows remote code execution and complete system compromise.
severityHigh 		High (7.0–8.9): Serious risk; likely to result in significant data theft or unauthorized access.
severityMedium		Medium (4.0–6.9): Moderate risk; may allow information disclosure or limited system access.
severityLow			Low (0.1–3.9): Low risk; minimal impact on system security.
severityNone		None (0.0): No security impact
*/
.severity {
    border-radius: var(--borderFull);
    padding: 0.2rem 0rem 0.1rem 0rem;
    text-align: center;
    display: block;
    line-height: var(--fontDefault);
	color: white;
}
	
	
	
.severityCritical {
	background-color: var(--colorSeverityCritical);
}
.severityHigh {
	background-color: var(--colorSeverityHigh);
}
.severityMedium {
	background-color: var(--colorSeverityMedium);
}
.severityLow {
	background-color: var(--colorSeverityLow);
}
.severityNone {
	background-color: var(--colorSeverityNONE);
}

.severityCriticalColor {
	color: var(--colorSeverityCritical);
}                       
.severityHighColor {    
	color: var(--colorSeverityHigh);
}                       
.severityMediumColor {  
	color: var(--colorSeverityMedium);
}                       
.severityLowColor {     
	color: var(--colorSeverityLow);
}                       
.severityNoneColor {    
	color: var(--colorSeverityNONE);
}

.greyLine {
	color: #aaaaaa;
}

.greyLine2 {
	color: #dddddd;
}



.dashboard_widget {
	background:		var(--colorWhiteFull);
	border:			1px solid var(--colorBlack025);
	border-radius:	var(--borderDefault);
	padding:		1rem 1rem;
	box-shadow:		0rem 0.5rem 1rem var(--colorBlack005);
	height: 40rem;
	max-width: calc(50% - 3rem);
}

.dashboard_widget h2 {
	font-size:var(--fontSmall1);
	display:flex;
	align-items:center;
	gap:0.5rem;
	margin-bottom: 1rem;
	color:var(--colorBlack075);
}

.dashboard_widget h2 text {
	font-size:var(--fontSmall1);
}


.dashboard_widget .overviewdialog{
	height: 40%;
	position:relative;
	top:0;
	left:0;
}

.dashboard_widget .overviewdialog .options{
	display:inline-block;
	width: 20rem;
}

.dashboard_widget .overviewdialog .diagram{

    width: calc(100% - 20rem);
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
}


.dashboard_widget.typeFull{
	width:100%;
	max-width: calc(100% - 2rem);
}

.dashboard_widget.typeThreeQuater {
	width:75%;
	max-width: calc(75% - 3rem);
}
.dashboard_widget.typeHalve{
	width:50%;
	max-width: calc(50% - 3rem);
}

.dashboard_widget.typeQuater {
	width:25%;
	max-width: calc(25% - 3rem);
}


/* diagram of the import protocol, drawn like the CVE trend (updateImportOverview in js/main_b.js, .cb-chart / .cb-legend) */
#importDiagramCanvas {
	width: 100%;
	height: 100%;
	padding-left: 0.5rem;
	box-sizing: border-box;
	overflow: hidden;
}
#importDiagramCanvas .cb-legend {
	max-height: 3.4rem;
	overflow-y: auto;
}
/* wide widget: legend as a column on the right side of the chart (class set by updateImportOverview) */
#importDiagramCanvas.ip-side {
	display: flex;
	align-items: stretch;
	gap: 0.75rem;
}
#importDiagramCanvas.ip-side .ip-chart {
	flex: 1 1 0;
	min-width: 0;
}
#importDiagramCanvas.ip-side .cb-legend {
	flex: 0 0 auto;
	flex-direction: column;
	flex-wrap: nowrap;
	gap: 0.15rem;
	max-width: 35%;
	max-height: none;
	margin-top: 0;
	align-self: stretch;
}
#importDiagramCanvas.ip-side .cb-legenditem {
	justify-content: flex-start;
	text-align: left;
}
#importDiagramCanvas.ip-side .cb-legenditem b {
	margin-left: auto;
	padding-left: 0.4rem;
}
#importDiagramCanvas button.cb-legenditem.off {
	opacity: 0.45;
	text-decoration: line-through;
}
#importDiagramCanvas .cb-legenditem b {
	font-weight: 600;
}
#importDiagramCanvas .cb-bar.clickable {
	cursor: pointer;
}
#importDiagramCanvas .cb-chart rect.ip-part {
	fill: var(--sev);
}
/* weaknesses / products: categories without order */
#importDiagramCanvas .ip-c0 { --sev: #007bff; }
#importDiagramCanvas .ip-c1 { --sev: #00a3c4; }
#importDiagramCanvas .ip-c2 { --sev: #00c197; }
#importDiagramCanvas .ip-c3 { --sev: #94d327; }
#importDiagramCanvas .ip-c4 { --sev: #e0a800; }
#importDiagramCanvas .ip-c5 { --sev: #e8743b; }
#importDiagramCanvas .ip-c6 { --sev: #b04aa8; }
#importDiagramCanvas .ip-c7 { --sev: #18418d; }
#importDiagramCanvas .ip-other { --sev: #8a96a8; }

#infoElementHover {
	display: inline-block;
	box-shadow: 0px 0px 0.2rem var(--colorBlackFull);
    position: absolute;
    top: 0;
    left: 0;
	padding: 0.25rem;
	background-color: var(--colorWhiteFull);
}

.limited {
	position: fixed;
    top: 0;
    right: 0;
    padding: 0.25rem;
	background-color: var(--colorBlueFull);
    color: var(--colorWhiteFull);
}

.diagramtext {
	font-size: var(--fontSmall1);
}


.slice {
	opacity: 1;
	transition: filter var(--transitionSemi), opacity var(--transitionSemi);
}

.slice:hover {
	opacity: 0.5;
	filter: drop-shadow(0px 0px 0.2rem var(--colorBlackFull));
}

.hint::after { 
	content : "🛈";
}

.historytable {
	width: 100%;
}
.historydetailtable {
	margin-top: 1rem;
	width: 100%;
}

.togglepassword {
	cursor: pointer;
	font-size:1.2rem;
	width:1.2rem;
	user-select:none;
	
	position: absolute;
	right: -0.5rem;
    top: 0.6rem;
}

#userprofile .togglepassword {
	right: 0rem;
	top: 0.65rem;
}

.maxinfo {
	position: absolute;
    top: 4rem;
    left: 50%;
    transform: translate(-50%, -50%);
}

.beta {
	position: absolute;
    top: -0.5rem;
    left: 53%;
    font-size: 1.2rem;
    text-shadow: 0 0 rgba(0, 0, 0, 0) !important;
}

/*DARK MODE */

.dark .bg1 {
	background-image: url(../img/back_dark_higher.png);
}

.dark .contentpage {
    background-color: var(--colorDarkestGrayFull);
}

.dark div[name="content_page_3"],
.dark div[name="content_page_5"],
.dark div[name="content_page_7"],
.dark .backgrey {
	background-color: var(--colorDarkerGrayFull) !important; 
}


.dark .contentpage .content {
    color: var(--colorHomeTextDark);
}

.dark .problem-card {
	background-color: var(--colorDarkerGrayFull);
}

.dark .problem-icon .icon {
	color: var(--colorBlueBrightFull);
}

.dark .feature-card {
	background-color: var(--colorDarkGrayFull);
}

.dark .feature-icon .icon {
	color: var(--colorBlueBrightFull);
}

.dark .patcharrow1 {
	background-color: var(--colorLightBlue3);
}
.dark .patcharrow2 {
	background-color: var(--colorLightBlue4);
}
.dark .patcharrow3 {
	background-color: var(--colorLightBlue5);
}
.dark .patcharrow4 {
	background-color: var(--colorLightGreen1);
}

.dark .patcharrow text {
	color: var(--colorBlackFull);
}

.dark .audience-icon .icon {
	color: var(--colorBlueBrightFull);
}

.dark .audience-text {
    border-bottom: 1px solid var(--colorWhite075);
}

.dark textarea, 
.dark input[type="text"], 
.dark input[type="number"], 
.dark input[type="password"] {
    border: solid 1px var(--colorWhite025);
    color: var(--colorWhite075);
	background-color: var(--colorHalfGrayFull);
}

.dark .formInputArea label, 
.dark .formInput label {
	color: var(--colorWhite075);
}


.dark textarea:focus + label,
.dark textarea:not(:placeholder-shown) + label,
.dark input:focus + label,
.dark input:not(:placeholder-shown) + label {
    background-color: var(--colorHalfGrayFull);
}


.dark .formInputB input:focus + label,
.dark .formInputB input:not(:placeholder-shown) + label {
    background-color: var(--colorHalfGrayFull);
}

.dark a{
    color: var(--colorBlueBrightFull);
}

.dark .checkmark {
    background-color: var(--colorHalfGrayFull);
    border: solid 1px var(--colorWhite025);
}
	
.dark .formCheckbox input:checked ~ .checkmark {
    background-color: var(--colorBlueBrightFull);
}

.dark button, 
.dark input[type="submit"], 
.dark input[type="button"] {
    color: var(--colorWhite075);
    border: solid 1px var(--colorWhite025);
    background-color: var(--colorHalfGrayFull);
}

.inner#cvecontent{
	max-width: 90vw;
    max-height: 80vh;
}

#CVE .inner#cvecontent {
	padding: 1rem 3rem;

}

#CVE .inner#cvecontent::-webkit-scrollbar {
  /* Chrome, Safari, newer Edge */
}


.cveNPanel{background:var(--colorBackGrayFull,#f1f5f9);border-radius:var(--borderThreeQuater);padding:0;overflow:hidden;margin-bottom:1.5rem;}
.cveNHeader {
	background:var(--colorBlueFull);
	color:var(--colorWhiteFull);
	padding: 0.5rem 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: space-between;
}
.cveNHeaderId{font-size:1.6rem;font-weight:700;letter-spacing:0.02em;color:var(--colorWhiteFull);}
.cveNBadge {display:inline-block;padding:0.2rem 0.6rem;border-radius:0.3rem;font-size:0.75rem;font-weight:600;}
.cveNBadge text {font-size:0.75rem;}
.cveNBadgeMeta {background:rgba(255,255,255,0.15);color:var(--colorWhiteFull);}
.cvetitleinfo {	
	top: 0.5rem !important;
	left: 3rem;
	font-size:1rem !important;
}
.cvetitleinfo text{	
	top: 0rem !important;
	font-size:1rem !important;
}
.cveNBody{
	
}
.cveNLayout{display:flex;gap:1rem;align-items:flex-start;}
.cveNMain{flex:1;min-width:0;display:flex;flex-direction:column;}
.cveNSidebar{width:21rem;flex-shrink:0;display:flex;flex-direction:column;}


#cve_alert_config {
    height: 0rem;          
	overflow: hidden;
    transition: height var(--transitionNormal) ease;
    interpolate-size: allow-keywords;
}

.cveCard:has(#followTogle:checked) #cve_alert_config{
	height: auto;
}


.cveNCardTitle {
	padding:0.6rem 1rem;
	font-weight:700;
	font-size:0.95rem;
	border-bottom:0.125rem solid var(--colorOrangeFull,rgba(255,128,0,1));
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:0.5rem;
	flex-wrap:wrap;
}
.cveNCardTitle .cntCount{
	font-size: var(--fontSmall4);
	font-weight:400;
	color:var(--colorHalfGrayFull);
	background:var(--colorBlack005);
	padding:0.1rem 0.4rem;
	border-radius:0.25rem;
	margin-left:auto;
	}
.cveNMetricTabs{display:flex;gap:0;margin-left:auto;}
.cveNMetricTab{
	padding:0.25rem 0.6rem;
	cursor:pointer;
	font-size:var(--fontSmall3);
	font-weight:600;
	color:var(--colorHalfGrayFull);
	}
.cveNMetricTab.metricselected {
	color:var(--colorBlueFull);
	}
.cveNMetricTab.metricunselected{color:var(--colorHalfGrayFull);}
.cveNMetricTab:hover {
	color:var(--colorBlueFull);
	}
.cveNCardBody {
	height: 16rem;          
	overflow: hidden;
	position: relative;
	transition: height var(--transitionNormal) ease;
	interpolate-size: allow-keywords;
}
.cveNCardBody::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 3em;
  /*background: linear-gradient(transparent, white);*/
}

.cveNToggle { display: none; }

/* expanded state */
.cveNToggle:checked ~ .cveNCardBody {
  height: auto;
  padding-bottom: 2rem;
}
.cveNToggle:checked ~ #confmore,
.cveNToggle:checked ~ #metricmore,
.cveNToggle:checked ~ #refmore 
{ display: none; }
.cveNToggle:not(:checked) ~ #confless,
.cveNToggle:not(:checked) ~ #metricless,
.cveNToggle:not(:checked) ~ #refless 
{ display: none; }


.cveNCardBodyNoPad{padding:0;}
.cveNSectionLabel{font-size:0.68rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--colorOrangeFull,rgba(255,128,0,1));margin:0.6rem 0 0.1rem;}
.cveNSectionLabel:first-child{margin-top:0;}
.cveNDataRow{display:flex;gap:0.5rem;padding:0.25rem 0;border-bottom:1px solid var(--colorBlack005,rgba(0,0,0,0.05));}
.cveNDataRow:last-child{border-bottom:none;}
.cveNDataLabel{
	color:var(--colorHalfGrayFull);
	min-width:12rem;
	flex-shrink:0;
	}
.cveNWeaknessBlock .cveNDataLabel{
	min-width:4rem;
	}
.cveNDataValue{
	color:var(--colorBlackFull);
	word-break:break-word;
	}
.cveNDsTag {
	font-size:var(--fontSmall3);
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:0.05em;
	display:inline-block;
	padding:0.1rem 0.4rem;
	border-radius:0.2rem;
	background:var(--colorBlue005Opa,#f3f3f7);
	color:var(--colorBlueFull,rgba(14,26,104,1));
	margin-right:0.4rem;
}
.cveNDsTag text {
	font-size:var(--fontSmall3);
}
.cveNGroupTitle{
	font-size:var(--fontSmall3);
	color:var(--colorBlueFull);
	margin-top:1rem;
	margin-bottom:0.5rem;
}

.cveNSelectRow{padding:0.2rem 0;}
.cveNSelectLabel{font-size:0.72rem;color:var(--colorHalfGrayFull);margin-bottom:0.1rem;}
.cveNSelectRow select{width:100%;font-size:0.78rem;padding:0.25rem 0.4rem;border:1px solid var(--colorLightGrayFull,rgba(220,220,220,1));border-radius:0.25rem;background:var(--colorWhiteFull);}
.cveNWeaknessBlock{
	padding: 0.5rem 0.75rem;
    border-left: 3px solid var(--colorBlueFull);
    margin: 0.4rem 0 0.7rem 0;
    background: var(--colorBackGrayFull);
    border-radius: 0 0.25rem 0.25rem 0;
}

.cveNCisaBlock{
	background: #fff4e5;
	border-left:3px solid var(--colorOrangeFull);
	padding:0.5rem 0.75rem;
	border-radius:0.25rem;
	}
.cveNShowMore{
	display:block;
	text-align:center;
	padding:0.4rem;
	font-size:0.8rem;
	font-weight:600;
	color:var(--colorBlueFull);
	cursor:pointer;
	border-top:1px solid var(--colorBlack010);
	transition: background var(--transitionQuick);
	}
.cveNShowMore:hover{
	background:var(--colorBlue005Opa);
	}
.cveNMetricWrap{overflow-x:auto;padding:0.5rem;}
table.tableMetric{white-space:nowrap;}
table.tableMetric th,
table.tableMetric td{
	padding:0.25rem 0.5rem;
	/*border:1px solid var(--colorLightGrayFull,rgba(220,220,220,1));*/
	text-align:left;
}
table.tableMetric th{
	
	font-weight:600;
	font-size:var(--fontSmall2);
	color:var(--colorBlack050);
	background-color:var(--colorBlack001);
}

table.cveview_reftable{border-collapse:collapse;width:100%;font-size:0.8rem;}
table.cveview_reftable th{background:var(--colorBackGrayFull,#f1f5f9);padding:0.3rem 0.5rem;font-weight:600;border-bottom:2px solid var(--colorLightGrayFull);}
table.cveview_reftable td{padding:0.3rem 0.5rem;border-bottom:1px solid var(--colorBlack005);word-break:break-all;}
table.cveview_reftable tr:hover td{background:var(--colorOrange075HTFull,#ffdfbf);}
table.cveview_reftable a{color:var(--colorBlueFull);text-decoration:none;}
table.cveview_reftable a:hover{text-decoration:underline;}
table.productsRect{border-collapse:collapse;width:100%;font-size:0.8rem;}
table.productsRect td{padding:0.2rem 0.5rem;border-bottom:1px solid var(--colorBlack005);}
table.productsRect td.shortside{width:5rem;color:var(--colorHalfGrayFull);font-size:0.72rem;}
.cveNConfigTitle{font-size:0.8rem;font-weight:600;color:var(--colorBlueFull);padding:0.4rem 0 0.2rem;border-top:1px solid var(--colorBlack010);}
.cveNConfigTitle:first-child{border-top:none;}
.vulnerable,.titlevulnerable,.cpevulnerable{color:var(--colorRedFull,rgba(200,0,0,1));}
.conjunction{color:var(--colorOrangeFull);font-weight:600;font-size:0.75rem;}
table.historytable{border-collapse:collapse;width:100%;font-size:0.82rem;}
table.historytable td{padding:0.25rem 0.5rem;}
table.historydetailtable{border-collapse:collapse;width:100%;font-size:0.78rem;margin:0.4rem 0;}
table.historydetailtable th{background:var(--colorBackGrayFull,#f1f5f9);padding:0.3rem 0.5rem;font-weight:600;border-bottom:2px solid var(--colorLightGrayFull);}
table.historydetailtable td{padding:0.3rem 0.5rem;border-bottom:1px solid var(--colorBlack005);word-break:break-word;vertical-align:top;}
.collabsable{position:relative;}

.collabsed::after{content:"";position:absolute;bottom:0;left:0;right:0;height:2.5rem;background:linear-gradient(transparent,var(--colorWhiteFull));pointer-events:none;}


.cvePage{

}
.cveCard {
	background:		var(--colorWhiteFull);
	border:			1px solid var(--colorBlack025);
	border-radius:	var(--borderDefault);
	padding:		1rem 1rem;
	margin-bottom:	1rem;
	box-shadow:		0rem 0.5rem 1rem var(--colorBlack005);
}

#ProductProductCveList,
.cveCardList,
#cvefollowList {
	display: flex;
    flex-wrap: wrap;
    flex-direction: row;
	gap: 0.5rem;
}

#ProductProductCveList .cveCard,
.cveCardList .cveCard,
#cvefollowList .cveCard {
	padding:		0.5rem 0.5rem;
	margin-bottom:	0.0rem;
	width:	calc(50% - 1.5rem);
}

#dashboard_import_protocol_table .gauge-box,
#ProductProductCveList .gauge-box,
.cveCardList .gauge-box,
.cb-suggest .gauge-box,
#cvefollowList .gauge-box{
	text-align:center;padding:0.1rem
}

#dashboard_import_protocol_table .gauge-num,
#ProductProductCveList .gauge-num,
.cveCardList .gauge-num,
.cb-suggest .gauge-num,
#cvefollowList .gauge-num{
	font-size: var(--fontSmall1);
	margin-top: -1.8rem;
}

#dashboard_import_protocol_table .gauge-label,
#ProductProductCveList .gauge-label,
.cveCardList .gauge-label,
.cb-suggest .gauge-label,
#cvefollowList .gauge-label{
	font-size:var(--fontSmall5);
	margin-top:-0.1rem;
	letter-spacing:0rem;
}
#dashboard_import_protocol_table .gauge-sub,
#ProductProductCveList .gauge-sub,
.cveCardList .gauge-sub,
.cb-suggest .gauge-sub,
#cvefollowList .gauge-sub{
	font-size:var(--fontSmall4);
	margin-top:0.1rem;
}



.cveCard h2 {
	font-size:var(--fontSmall1);
	display:flex;
	align-items:center;
	gap:0.5rem;
	margin-bottom: 1rem;
	color:var(--colorBlack075);
}

.cveCard .alarm {
	margin-bottom: 0rem;
}
.cveCard h2 text {
	font-size:var(--fontSmall1);
}
.cveCard h2 .cnt {
	margin-left:auto;
	font-size:.75rem;
	font-weight:600;
	background:var(--bg);
	border:1px solid var(--colorBlack010);
	border-radius:var(--borderFull);
	padding:1px 9px;
	color:var(--colorBlack050);
}

.cveCard .firstlineb {
	padding-top:0.5rem;
	font-size: var(--fontSmall3);
	color: var(--colorBlack075);
}

.cveIcon {
	width:18px;
	height:18px;
	color:var(--colorBlueFull);
}

#cvecontent {
	overflow-y: scroll;
    background-color: var(--colorBrightLightGrayFull);
}

#cvegaugepath {
	transition: stroke-dashoffset var(--transitionSlow)
}
.hero {
	display:flex;
	gap:0.5rem;
	/*flex-wrap:wrap*/
}
.hero-main {
	flex:1;
	/*min-width:320px*/
}
.hero h1 {
	font-size:var(--fontHeader0);
	margin-bottom: 1rem;
}

#dashboard_import_protocol_table .hero h1,
#ProductProductCveList .hero h1,
.cveCardList .hero h1,
#cvefollowList .hero h1 {
	font-size:var(--fontDefault);
	margin-bottom: 0.1rem;
}

.hero h1::before {
  content: "";
  display: inline-block;
  width: 1.4rem;
  height: 1.4rem;
  position:relative;
  top: -0.15rem;
  background: url(../img/64/shield_black.png) no-repeat center / contain;
  margin-right: 0.2rem;
  vertical-align: middle; /* aligns icon with text */
}

#dashboard_import_protocol_table .hero ::before,
#ProductProductCveList .hero h1::before ,
.cveCardList .hero h1::before,
#cvefollowList .hero h1::before {
  width: var(--fontDefault);
  height: var(--fontDefault);
}

.hero .back {
	height: 2.5rem;
    width: 2.5rem;
    color: var(--colorWhiteFull);
    position: absolute;
    right: 0%;
    top: 0.0rem;
    background-color: var(--colorWhite000);
	transition: background-color var(--transitionQuick);
    cursor: pointer;
    background-size: 1.1rem;
	background-position:center;
    background-repeat: no-repeat;
}

.hero .back:hover {
	background-color: var(--colorOrange025);
}
.hero .btn{display:inline-flex;align-items:center;gap:7px;border-radius:8px;padding:8px 16px;font-size:.9rem;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--card);color:var(--text)}
.hero .btn-primary{background:var(--colorOrangeFull);border-color:var(--accent);color:#fff}
.hero .btn-primary:hover{background:#dd8000;border-color:#dd8000}


.hero-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}

.hero .back.close {
	position:fixed;
    background-image: url(/img/64/close_black.png);
}

.hero .subtitle {
	font-size:var(--fontSmall1);
	color:var(--colorBlack050);
	margin:0.5rem 0 1rem 0;
}

#ProductProductCveList .hero .subtitle,
.cveCardList .hero .subtitle,
#cvefollowList .hero .subtitle {
	font-size:var(--fontSmall1);
	color:var(--colorBlack050);
	margin:0.1rem 0 0.1rem 0;
	height: 2rem;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(180deg, var(--colorBlackFull) 50%, var(--colorBlack000) 100%);
    mask-image: linear-gradient(180deg, var(--colorBlackFull) 50%, var(--colorBlack000) 100%);
}

#ProductProductCveList .hero .subtitle {
	height: 6rem;
}

#dashboard_import_protocol_table .hero .subtitle {
	font-size:var(--fontSmall1);
	color:var(--colorBlack050);
	margin:0.1rem 0 0.1rem 0;
}

.chip {
	font-size:var(--fontSmall3);
	font-weight:600;
	border-radius:var(--borderFull);
	padding:0.4rem 0.75rem;
	margin: 0.25rem 0.5rem 0.25rem 0rem;
	border:1px solid var(--colorBlack025);
	background:var(--colorBlack001);
	color:var(--colorBlack050);
	white-space: nowrap;
	display: inline-block;
}

.chip.status {
	position: relative;
    top: -0.25rem;
}
.chip.status text{
	font-size:var(--fontSmall3);
}

#dashboard_import_protocol_table .chip ,
#ProductProductCveList .chip ,
.cveCardList .chip,
#cvefollowList .chip {
	font-size:var(--fontSmall3);
	font-weight:600;
	border-radius:var(--borderFull);
	padding:0.2rem 0.5rem;
	margin: 0.15rem 0.0rem 0.25rem 0.5rem;
	border:1px solid var(--colorBlack025);
	background:var(--colorBlack001);
	color:var(--colorBlack050);
	white-space: nowrap;
	display: inline-block;
}

#dashboard_import_protocol_table .chip.status,
#ProductProductCveList .chip.status,
.cveCardList .chip.status,
#cvefollowList .chip.status {
	position: relative;
    top: -0.15rem;
}

#dashboard_import_protocol_table .chip.status text,
#ProductProductCveList .chip.status text,
.cveCardList .chip.status text,
#cvefollowList .chip.status text{
	font-size:var(--fontSmall3);
}

.chip.critical{background:var(--critical-soft);border-color:#f5c6c6;color:var(--critical)}
.chip.ok{background:var(--ok-soft);border-color:#bfe6d0;color:var(--ok)}
.chip.acc {
	background:#fff4e5;
	border-color:#f8d9ad;
	color:#b56a00
}
.hero-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}


.scores{display:flex;gap:1rem;align-items:stretch}
.gauge-box{text-align:center;padding:0.1rem 0.2rem}
.gauge-num{
	font-size: var(--fontHeader0);
	margin-top: -3.2rem;
	font-weight:800;
	}
.gauge-label{
	font-size: var(--fontSmall2);
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:0.1rem;
	margin-top:0.0rem;
	}
.gauge-sub{
	font-size: var(--fontSmall2);
	color:var(--colorBlack050);
	margin-top:0.4rem;
	}

.minimetric {
	padding: 0.0rem !important;
	height:3.5rem;
}
.minimetric .scores{
	display:block;
	height:3rem;
}
.minimetric .gauge-box{
	text-align:center;
	padding:0.0rem 0.2rem
}
.minimetric .gauge-num{
	font-size: var(--fontSmall3);
	margin-top: -1.8rem;
	font-weight:800;
}
.minimetric .gauge-label{
	font-size: var(--fontSmall4);
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:0.0rem;
	margin-top:0.0rem;
}
.minimetric .gauge-sub{
	font-size: var(--fontSmall4);
	color:var(--colorBlack050);
	margin-top:0.0rem;
}


.teaserContainer .gauge-num,
.teaserContainer .gauge-label {
	text-shadow:0px 0px 1px var(--colorWhiteFull), 0px 0px 1rem var(--colorWhiteFull), 0px 0px 5rem var(--colorWhiteFull);
}



.score-side{display:flex;flex-direction:column;gap:8px;justify-content:center}
.mini-score{display:flex;align-items:center;gap:8px;font-size:.82rem;color:var(--muted);background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:6px 12px}
.mini-score b{color:var(--text)}
  
.icon{
width:1.2rem;
height:1.2rem;
color:var(--colorBlueFull);
}
  
/* ---------- Timeline ---------- */
.timeline{display:flex;align-items:flex-start;position:relative;}
.timeline::before{content:"";position:absolute;top:7px;left:4%;right:4%;height:0.1rem;background:var(--colorBlack025)}
.t-item{flex:1;text-align:center;position:relative;font-size:.78rem}
.t-dot{
	width:0.75rem;
	height:0.75rem;
	border-radius:50%;
	background:var(--colorWhiteFull);
	border:0.1rem solid var(--colorBlueFull);
	margin:0 auto 0.5rem;
	position:relative;
	top:0.1rem;
	z-index:1
}
.t-item.muted .t-dot{border-color:var(--colorBlack025)}
.t-item b{display:block;font-size:var(--fontSmall2)}
.t-item span,
.t-item span text{font-size:var(--fontSmall2);color:var(--colorBlack075)}


/* ---------- Products ---------- */
  .prod {
	  display:flex;  
	  align-items:baseline;
	  flex-wrap:wrap;
	  /*padding:0 1rem;*/
	  flex-direction: row;
  }
  .break  { flex-basis: 100%; height: 0; }
  .prod-chip{
	  display:inline-flex;
	  position:relative;
	  align-items:flex-start;
	  background:var(--bg);
	  border:1px solid var(--colorBlack025);
	  border-radius:var(--borderDefault);
	  padding:0.4rem 0.6rem;
	  font-size:.88rem;
	  font-weight:600;
	  margin:0.5rem 0.5rem;
	  flex-direction: column;
	  min-width:30%;
}
	  
  .prod-chip.vulnerable {
	  background: #fff4e5;
      border-color: #f8d9ad;
	  color: #b56a00;
  }
  .prod-chip .vrange{
	  font-weight:400;
	  color:var(--colorBlack050)
	}
	
	 .prod-chip .cpe{
		padding-top:0.5rem;
	  font-weight:normal;
	}

.prod .prodoperator {
	font-weight:400;
	color:var(--colorBlack050)
}
.prod .prodlable {
    position: absolute;
    top: -0.6rem;
    left: 0.5rem;
    transition: all 0.3s ease-in-out;
    z-index: 1;
    color: var(--colorBlack050);
    background-color: var(--colorWhiteFull);
    padding: 0 0.25rem;
    border-radius: var(--border25);
    font-size: var(--fontSmall3);
}

.prod .prodlable.operator {
	 text-transform:uppercase;
}

  .ref-group{width:100%}
  .ref-group h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.5px;color:var(--faint);margin-bottom:6px}
  .ref-group tr{height:3rem;}
  .ref {
	  display:flex;
	  align-items:center;
	  gap:9px;
	  padding:6px 0;
	  }
  .ref .tag{
	  
  }



.topHeader{
	height:2.5rem;
	width:100%;
	display: flex;
    gap: 7rem;
	position:fixed;
	top:0px;
	left:0px;
	z-index:2;
}
.topHeader .breadcrumpwrap {
	height: 2.5rem;
	display: flex;
    width: 100%;
	background: var(--colorWhiteFull);
}

.topHeader .breadcrump {
	padding: 0.75rem 1rem 0.5rem 1rem;
    
	white-space:nowrap;
	color: var(--colorBlack075);
}

.topHeader .breadcrump text{
	font-size: var(--fontHeader2);
	display: inline-block;
    cursor: pointer;
    color: var(--colorBlack075);
    opacity: 0.75;
    position: relative;
}

.topHeader .breadcrump text:hover{
	opacity:1;
}


#cat_home {
	padding: 0 0.5rem;
	padding-top:0.36rem;
	height: 2.5rem;
	width: 7rem;
	transition: width var(--transitionNormal) ease;
}


#cat_home .divimg {
	height: 1.5rem;
	width: 6rem;
	
	background: url(/img/CVEAlarmBlue.svg) no-repeat center / contain;
	background-repeat: no-repeat;

	/*
	-webkit-mask: url(/img/CVEAlarmBlue.svg) no-repeat center / contain;
          mask: url(/img/CVEAlarmBlue.svg) no-repeat center / contain;
		  
	transition: background-size var(--transitionSemi) ease;
    -webkit-transition: background-size var(--transitionSemi) ease;	  */
}
/*
#cat_home .divimg:hover {
	 background-size: 100% 100%;
     background-position: left center;
}*/

/*
#cat_home .divimg::after {
  content: '';
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: 100%;
  background: var(--colorOrangeFull);
  -webkit-mask: url(/img/cvealarmlogo64_black.png) no-repeat center / contain;
          mask: url(/img/cvealarmlogo64_black.png) no-repeat center / contain;
  transition: width var(--transitionSemi) ease;
}

#cat_home .divimg:hover::after {
 width: 6rem;
  right: auto; left: 0;
  -webkit-mask-position: left center;
          mask-position: left center;
}
*/

@media (orientation: landscape) and (min-width: 1024.01px) {
	.mainmenu {
		width: 14rem;
	}
	.frontendpage {
		left: 14rem;
		width:  calc(100% - 14rem);	
	}
}
@media (orientation: portrait), (max-width: 1024px) {
	.mainmenu {
		width: 2.5rem;
	}
	.frontendpage {
		left: 2.5rem;
		width:  calc(100% - 2.5rem);
	}
	.topHeader{
      gap: 0rem;
	}
}



/* =====================================================================
   CVSS threshold inputs (global alert form, filter alarm, followed CVE)
   markup: cvssInputHtml() in _functions.php / templates, logic: cvssBadge() in main_b.js
   ===================================================================== */
.cvssInput {
	position: relative;
    margin: 0.5rem 0rem;
    display: block;
}
.cvssInput input[type="text"] {
	width: 8rem;
	text-align: right;
	font-variant-numeric: tabular-nums;
}
.cvssInput input.error {
	border-color: #c62828;
	outline-color: #c62828;
}
.cvssInput label {
  position: absolute;
  top: 0.75rem;
  left: 0.5rem;
  transition: all 0.3s ease-in-out;
  z-index: 1;
  color: var(--colorBlack050);
}
.cvssQuick button {
	padding: 0.1rem 0.45rem;
	font-size: var(--fontSmall3);
	border-radius: var(--border25);
	cursor: pointer;
}
.cvssInput input:disabled ~ .cvssQuick button {
	opacity: 0.4;
	pointer-events: none;
}

/* severity badge: official rating bands (CVSS 2.0 NVD, CVSS 3.x / 4.0 FIRST) */
.cvssBadge {
	display: inline-block;
    margin: 0 0.5rem;
    padding: 0.25rem 0.5rem;
    text-align: center;
    border-radius: 1rem;
    white-space: nowrap;
    font-size: var(--fontSmall3);
    line-height: var(--fontSmall2);
}

.cvssBadge:empty      { display: none; }
.cvssBadge.sev-none     { background: var(--colorSeverityNONE); color: var(--colorWhiteFull); }
.cvssBadge.sev-low      { background: var(--colorSeverityLow); color: var(--colorWhiteFull); }
.cvssBadge.sev-medium   { background: var(--colorSeverityMedium); color: var(--colorWhiteFull) }
.cvssBadge.sev-high     { background: var(--colorSeverityHigh); color: var(--colorWhiteFull) }
.cvssBadge.sev-critical { background: var(--colorSeverityCritical); color: var(--colorWhiteFull) }
.cvssBadge.sev-error    { background: none;  color: var(--colorWhiteFull) font-weight: bold; }
.cvssBadge.sev-inherit  {
	background: transparent;
	color: var(--colorBlack050);
	border: 1px dashed var(--colorBlack025);
}
.cvssInput input:disabled ~ .cvssBadge { opacity: 0.5; }

/* range hint ("Alerts for scores 6.5 - 10.0") or error message under the field */
.cvssMsg {
	display: inline-block;
    position: relative;
}
.cvssMsg:empty { display: none; }
.cvssMsg.cvssHint  { color: var(--colorBlack050); }
.cvssMsg.cvssError { color: #c62828; }

/*
#scanner_alert_config .cvssBadge {
	width: 16rem;
}*/
/*#cve_search_result .cvssBadge {
    width: 16rem;
}*/
#scanner_alert_config .cvssInput label,
#cve_search_result .cvssInput label {
	top: -0.2rem;
    font-size: var(--fontSmall3);
    line-height: var(--fontSmall2);
    background-color: var(--colorWhiteFull);
    padding: 0rem 0.5rem;
    border-radius: var(--borderThreeQuater);
}
/*
#cve_search_result .cvssInput input[type="text"] {
    width: 3rem;
}*/

#scanner_alert_config .cvssMsg {
	display: block;
    position: relative;
}


@keyframes newEntry {
  0% {
	    background-color: var(--colorGreenFull); 
		animation-timing-function: ease-in;
		opacity: 0;
		transform: translateX(-100vw);
	}

	38% {
		animation-timing-function: ease-out;
		opacity: 1;
		transform: translateX(0);
	}

	100% {
		background-color: var(--colorGreen000); 
		animation-timing-function: ease-out;
		transform: translateX(0);
	}
}
.newentry {
  animation: newEntry var(--transitionNormal) ease-out;
}

@keyframes removeEntry {
  0% {
	    background-color: var(--colorRedFull); 
		animation-timing-function: ease-in;
		opacity: 0;
		transform: translateX(0);
	}

	38% {
		animation-timing-function: ease-out;
		opacity: 1;
		transform: translateX(0);
	}

	100% {
		background-color: var(--colorRed000); 
		animation-timing-function: ease-out;
		transform: translateX(-100vw);
	}
}
.removeentry {
  animation: removeEntry var(--transitionNormal) ease-out;
}


@keyframes updateEntry {
	0%,
	50%,
	100% {
		background-color: var(--colorBlue000); 
	}

	25%,
	75% {
		background-color: var(--colorBlue050); 
	}
}

.updateentry {
  animation: updateEntry var(--transitionSlow) ease-out;
}
/* ---------- EditSync (js/editsync.js): who is editing, live updates of open forms ---------- */
.syncbar {
	margin: 0 0 0.75rem 0;
	font-size: 0.9em;
	text-align: left;
	white-space: normal;
}
.syncbar.hidden {
	display: none;
}
.syncpresence {
	padding: 0.35rem 0.6rem;
	border-left: 3px solid var(--colorOrangeFull, #f39200);
	background-color: var(--colorOrange025, rgba(243, 146, 0, 0.12));
	border-radius: 3px;
	margin-bottom: 0.4rem;
}
.syncpresence::before {
	content: "\270E";              /* pencil */
	margin-right: 0.4rem;
}
.syncnotice {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	padding: 0.45rem 0.6rem;
	border-radius: 3px;
	border-left: 3px solid var(--colorBlueFull, #1d5fa8);
	background-color: var(--colorBlue025, rgba(29, 95, 168, 0.12));
}
.syncnotice > span:first-child {
	flex: 1 1 12rem;
}
.syncnotice_pending,
.syncnotice_readonly {
	border-left-color: var(--colorRedFull, #c0392b);
	background-color: rgba(192, 57, 43, 0.10);
}
.syncnotice .syncbuttons button {
	margin: 0 0 0 0.4rem;
	padding: 0.2rem 0.7rem;
	cursor: pointer;
}
.syncflash {
	animation: updateEntry var(--transitionSlow, 1s) ease-out;
}
/* list rows (project, filter, user, team) somebody else has open */

tr.syncediting {
	background-color: var(--colorBlue025) !important;
}

/*tr.syncediting > td:first-child::before {
	content: "\270E";
	color: var(--colorOrangeFull, #f39200);
	margin-right: 0.35rem;
}*/
/* websocket connection lost */
.syncoffline {
	position: fixed;
	left: 50%;
	bottom: 1rem;
	transform: translateX(-50%);
	z-index: 10000;
	padding: 0.5rem 1rem;
	border-radius: 3px;
	background-color: var(--colorRedFull, #c0392b);
	color: var(--colorWhiteFull, #fff);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
.syncoffline.hidden {
	display: none;
}

/* ---------- Chat (js/chat.js): button in the top bar, panel on the right, toasts ---------- */
.chatbutton {
	position: fixed;
	top: 0.3rem;
	right: 1rem;
	z-index: 600;
	height: 1.9rem;
	padding: 0 0.6rem;
	display: flex;
	align-items: center;
	gap: 0.3rem;
	border-radius: 1rem;
	cursor: pointer;
	background-color: var(--colorWhiteFull, #fff);
	color: var(--colorBlueFull, #0e1a68);
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
	user-select: none;
}
body:has(.limited) .chatbutton {        /* "limited account" badge sits in the top right corner */
	right: 12rem;
}
.chatbutton svg {
	width: 1.1rem;
	height: 1.1rem;
	fill: currentColor;
}
.chatbutton.active,
.chatbutton:hover {
	background-color: var(--colorBlueFull, #0e1a68);
	color: var(--colorWhiteFull, #fff);
}
.chatonlinecount:not(:empty)::before {
	content: "";
	display: inline-block;
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
	margin-right: 0.25rem;
	background-color: var(--colorGreenFull, #5f9522);
}
.chatunread {
	min-width: 1.1rem;
	padding: 0 0.3rem;
	border-radius: 0.6rem;
	font-size: 0.75rem;
	line-height: 1.1rem;
	text-align: center;
	background-color: var(--colorRedFull, #c80000);
	color: var(--colorWhiteFull, #fff);
}
.chatunread.hidden {
	display: none;
}

.chatpanel {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 600;                         /* above the form overlays (.userpanel) */
	width: 22rem;
	max-width: 100vw;
	height: 100vh;
	display: flex;
	flex-direction: column;
	background-color: var(--colorWhiteFull, #fff);
	color: var(--colorBlackFull, #000);
	box-shadow: -4px 0 16px rgba(0, 0, 0, 0.25);
	font-size: 0.9rem;
}
.chatpanel.hidden {
	display: none;
}
body.chatopen .chatbutton {
	right: 23rem;
}
@media (max-width: 40rem) {
	body.chatopen .chatbutton { display: none; }
}
.chathead {
	flex: 0 0 auto;
	height: 2.5rem;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0 0.75rem;
	background-color: var(--colorBlueFull, #0e1a68);
	color: var(--colorWhiteFull, #fff);
}
.chathead .chattitle {
	flex: 1 1 auto;
	font-weight: bold;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.chathead a {
	cursor: pointer;
	font-size: 1.4rem;
	line-height: 1;
	color: var(--colorWhiteFull, #fff);   /* global "a" is blue */
	padding: 0 0.2rem;
}
.chathead .chatback::before {
	content: "\2190";
}
.chathead .chatback.hidden {
	display: none;
}
.chatlist {
	flex: 1 1 auto;
	overflow-y: auto;
	padding-bottom: 1rem;
}
.chatlist.hidden,
.chatroom.hidden {
	display: none;
}
.chatsection {
	padding: 0.8rem 0.75rem 0.3rem 0.75rem;
	font-size: 0.75rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--colorHalfGrayFull, #7f7f7f);
}
.chatnone {
	padding: 0.3rem 0.75rem;
	color: var(--colorHalfGrayFull, #7f7f7f);
	font-style: italic;
}
.chatentry {
	display: grid;
	grid-template-columns: 1rem 1fr auto;
	align-items: center;
	column-gap: 0.4rem;
	padding: 0.45rem 0.75rem;
	cursor: pointer;
	color: inherit;
	text-decoration: none;
}
.chatentry:hover {
	background-color: var(--colorBackGrayFull, #f1f5f9);
}
.chatentry .chatname {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.chatentry .chatsub {
	grid-column: 2 / 4;
	font-size: 0.8rem;
	color: var(--colorHalfGrayFull, #7f7f7f);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.chatdot {
	width: 0.6rem;
	height: 0.6rem;
	border-radius: 50%;
	background-color: var(--colorGreenFull, #5f9522);
}
.chatdot.idle {
	background-color: var(--colorOrangeFull, #ff8000);
}
.chatdot.offline {
	background-color: var(--colorLightGrayFull, #dcdcdc);
}
.chatteamicon::before {
	content: "#";
	font-weight: bold;
	color: var(--colorBlueFull, #0e1a68);
}
.chatcount {
	min-width: 1.2rem;
	padding: 0 0.3rem;
	border-radius: 0.6rem;
	font-size: 0.75rem;
	line-height: 1.2rem;
	text-align: center;
	background-color: var(--colorRedFull, #c80000);
	color: var(--colorWhiteFull, #fff);
}
.chatroom {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
}
.chatmessages {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 0.75rem;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	background-color: var(--colorBackGrayFull, #f1f5f9);
}
.chatolder {
	align-self: center;
	cursor: pointer;
	font-size: 0.8rem;
	color: var(--colorBlueFull, #0e1a68);
	text-decoration: underline;
}
.chatmsg {
	max-width: 85%;
	align-self: flex-start;
	padding: 0.4rem 0.6rem;
	border-radius: 0.6rem;
	background-color: var(--colorWhiteFull, #fff);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.chatmsg.own {
	align-self: flex-end;
	background-color: var(--colorBlueFull, #0e1a68);
	color: var(--colorWhiteFull, #fff);
}
.chatmsg.pending {
	opacity: 0.6;
}
.chatmsg.failed {
	opacity: 1;
	background-color: var(--colorRedFull, #c80000);
}
.chatmsg .chatmeta {
	font-size: 0.7rem;
	opacity: 0.7;
	margin-bottom: 0.15rem;
}
.chatmsg .chatmeta a {
	cursor: pointer;
	font-weight: bold;
}
.chatmsg .chattext {
	white-space: pre-wrap;
	word-wrap: break-word;
	overflow-wrap: anywhere;
}
.chatinput {
	flex: 0 0 auto;
	display: flex;
	gap: 0.4rem;
	padding: 0.5rem;
	border-top: 1px solid var(--colorLightGrayFull, #dcdcdc);
}
.chatinput textarea {
	flex: 1 1 auto;
	resize: none;
	font: inherit;
	padding: 0.35rem;
	border: 1px solid var(--colorLightGrayFull, #dcdcdc);
	border-radius: 0.3rem;
}
.chatinput button {
	flex: 0 0 auto;
	cursor: pointer;
	padding: 0 0.9rem;
	border: none;
	border-radius: 0.3rem;
	background-color: var(--colorBlueFull, #0e1a68);
	color: var(--colorWhiteFull, #fff);
	font-weight: bold;
}
.chatinput button:hover {
	background-color: var(--colorOrangeFull, #ff8000);
}
.chattoasts {
	position: fixed;
	right: 1rem;
	transition: right var(--transitionQuick, 0.2s);
	bottom: 1rem;
	z-index: 700;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	width: 20rem;
	max-width: calc(100vw - 2rem);
}
.chattoast {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	padding: 0.5rem 0.75rem;
	border-left: 4px solid var(--colorBlueFull, #0e1a68);
	border-radius: 0.3rem;
	background-color: var(--colorWhiteFull, #fff);
	color: var(--colorBlackFull, #000);
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
	cursor: pointer;
	font-size: 0.85rem;
	animation: newEntry var(--transitionNormal, 0.5s) ease-out;
}
.chattoast span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
body.chatopen .chattoasts {
	right: 23rem;
}
.chatmsg.own .chatmeta a,
.chatentry,
.chatolder {
	color: inherit;
}
.chatolder {
	color: var(--colorBlueFull, #0e1a68);
}
/* names in "Also open by: ..." open a direct message */
.syncpresence .syncname {
	cursor: pointer;
	text-decoration: underline;
}

/* ---------- ProductAdd (js/productadd.js): product chip in the CVE view -> search term of a filter ---------- */
.prod-chip.addable {
	cursor: pointer;
	transition: box-shadow var(--transitionQuick, 0.2s), border-color var(--transitionQuick, 0.2s);
}
.prod-chip.addable:hover {
	border-color: var(--colorBlueFull, #0e1a68);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
.prod-chip.addable::after {                 /* "+" in the corner: can be added to a filter */
	content: "+";
	position: absolute;
	top: 0.15rem;
	right: 0.45rem;
	font-weight: bold;
	opacity: 0;
	color: var(--colorBlueFull, #0e1a68);
	transition: opacity var(--transitionQuick, 0.2s);
}
.prod-chip.addable:hover::after {
	opacity: 1;
}
#productaddpanel .inner.padd {
	width: 46rem;
	max-width: calc(100vw - 2rem);
	max-height: calc(100vh - 2rem);
	overflow-y: auto;
}
#productaddpanel .content {
	text-align: left;
	padding: 0 1rem 1rem 1rem;
}
#productaddpanel h3 {
	margin: 1rem 0 0.4rem 0;
}
.paddproduct {
	padding: 0.5rem 0.75rem;
	border-radius: var(--borderDefault, 0.3rem);
	background: #fff4e5;
	border: 1px solid #f8d9ad;
	color: #b56a00;
}
#productaddpanel .cpe {
	font-family: monospace;
	font-size: 0.85em;
	word-break: break-all;
	color: var(--colorBlack075, #333);
}
.paddoption {
	padding: 0.35rem 0;
}
.paddoption > label {
	cursor: pointer;
	font-weight: bold;
}
.paddoption.disabled > label {
	cursor: default;
	opacity: 0.5;
}
.paddextra {
	margin: 0.25rem 0 0 1.6rem;
}
.paddinline label {
	margin-right: 0.75rem;
	white-space: nowrap;
}
.paddinline select,
.paddinline input[type="text"] {
	padding: 0.2rem 0.35rem;
	max-width: 18rem;
}
.paddinline.inactive {
	opacity: 0.45;
}
.paddhint {
	font-style: italic;
	color: var(--colorHalfGrayFull, #7f7f7f);
}
.paddmsg {
	margin-top: 1rem;
	padding: 0.5rem 0.75rem;
	border-radius: 0.3rem;
	border-left: 3px solid var(--colorGreenFull, #5f9522);
	background: rgba(95, 149, 34, 0.1);
}
.paddmsg.error {
	border-left-color: var(--colorRedFull, #c80000);
	background: rgba(200, 0, 0, 0.08);
}
.paddmsg.hidden {
	display: none;
}
.paddmsg button {
	margin-left: 0.5rem;
}
.paddbuttons {
	margin-top: 1rem;
	display: flex;
	justify-content: space-between;
}
.paddbuttons .hidden {
	display: none;
}
/* context menu of a product chip (add to filter / search CVEs) */
.paddmenu {
	display: none;
	position: fixed;
	z-index: 650;
	min-width: 16rem;
	padding: 0.3rem 0;
	border-radius: 0.4rem;
	background: var(--colorWhiteFull, #fff);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
	font-size: 0.9rem;
}
.paddmenu a {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.45rem 0.9rem;
	cursor: pointer;
	color: var(--colorBlackFull, #000);
	text-decoration: none;
	white-space: nowrap;
}
.paddmenu a:hover {
	background: var(--colorBackGrayFull, #f1f5f9);
	color: var(--colorBlueFull, #0e1a68);
}
.paddmenu .paddicon {
	width: 1.1rem;
	text-align: center;
	font-weight: bold;
	color: var(--colorBlueFull, #0e1a68);
}

/* ---------- ProductBrowser (js/productbrowser.js): product overview, dashboard menu "Products" + public /Products ---------- */


.pb {
	text-align: left;
	color: var(--colorBlackFull, #000);
}
.pb h2 {
	font-size: 1.9rem;
	font-weight: 600;
	margin: 0;
	display: inline;
}
.pb h3 {
	font-size: 1.15rem;
	font-weight: 600;
	margin: 0;
}
.pb h3 small {
	font-weight: 400;
	color: var(--colorHalfGrayFull);
}
.pb-head {
	margin-bottom: 1rem;
}
.pb-crumbs {
	font-size: 0.95rem;
	margin-bottom: 0.75rem;
	color: var(--colorHalfGrayFull);
}
.pb-crumbs a {
	color: var(--colorBlueFull);
	cursor: pointer;
}
.pb-crumbs a:hover {
	text-decoration: underline;
}
.pb-sep {
	margin: 0 0.4rem;
}
.pb-searchrow {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
	margin: 0rem 0 0.25rem 0;
}
.pb-search {
	flex: 1 1 22rem;
	max-width: 40rem;
	font-size: 1.15rem;
	padding: 0.6rem 0.9rem;
	border: 1px solid var(--colorBlack025, rgba(0, 0, 0, 0.25));
	border-radius: 0.4rem;
	background: var(--colorWhiteFull);
	outline: none;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.pb-search:focus {
	border-color: var(--colorBlueFull);
	box-shadow: 0 0 0 3px var(--colorBlue025, rgba(14, 26, 104, 0.25));
}
.pb-tabs {
	display: inline-flex;
	flex-wrap: wrap;
	border: 1px solid var(--colorBlack025, rgba(0, 0, 0, 0.25));
	border-radius: 0.4rem;
	overflow: hidden;
}
.pb-tab {
	border: none;
	border-right: 1px solid var(--colorBlack010);
	background: var(--colorWhiteFull);
	color: var(--colorBlack075, #333);
	padding: 0.55rem 0.9rem;
	font-size: 0.95rem;
	cursor: pointer;
	border-radius: 0;
	margin: 0;
	box-shadow: none;
}
.pb-tab:last-child {
	border-right: none;
}
.pb-tab:hover {
	background: var(--colorBlue005Opa, #f3f3f7);
}
.pb-tab.active {
	background: var(--colorBlueFull);
	color: #fff;
}
.pb-totals,
.pb-hint {
	font-size: 0.9rem;
	color: var(--colorHalfGrayFull);
	margin-top: 0.4rem;
}
.pb-title {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.75rem;
}
.pb-vendorlink {
	font-size: 1.1rem;
	font-weight: 400;
	color: var(--colorBlueFull);
	cursor: pointer;
	margin-left: 0.4rem;
}
.pb-vendorlink:hover {
	text-decoration: underline;
}
.pb-id {
	font-family: monospace;
	font-size: 0.82rem;
	color: var(--colorHalfGrayFull);
	word-break: break-all;
}
.pb-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
	margin: 0.9rem 0;
}
.pb-stat {
	min-width: 7.5rem;
	padding: 0.6rem 0.9rem;
	border: 1px solid var(--colorBlack010);
	border-radius: 0.4rem;
	background: var(--colorWhiteFull);
}
.pb-statval {
	font-size: 1.45rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}
.pb-statlabel {
	font-size: 0.82rem;
	color: var(--colorHalfGrayFull);
}
.pb-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 0.5rem;
}
.pb-actions:empty {
	display: none;
}
.pb-actions .hidden {
	display: none;
}
.pb-body {
	transition: opacity 0.15s;
}
.pb-loading {
	opacity: 0.45;
	pointer-events: none;
}
.pb-tops {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
	margin-bottom: 1.25rem;
}
.pb-top {
	background:		var(--colorWhiteFull);
	border:			1px solid var(--colorBlack025);
	border-radius:	var(--borderDefault);
	padding:		1rem 1rem;
	box-shadow:		0rem 0.5rem 1rem var(--colorBlack005);
}


.pb-top h3 {
	font-size: 0.95rem;
	color: var(--colorBlack075, #333);
	margin-bottom: 0.5rem;
}
.pb-toplist {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: pbtop;
}
.pb-toplist li {
	counter-increment: pbtop;
}
.pb-toplist a {
	display: grid;
	grid-template-columns: 1.6rem minmax(0, 1fr) 6rem 3.2rem;
	align-items: center;
	gap: 0.5rem;
	padding: 0.32rem 0.25rem;
	border-radius: 0.3rem;
	cursor: pointer;
	color: inherit;
	text-decoration: none;
}
.pb-toplist a::before {
	content: counter(pbtop);
	color: var(--colorHalfGrayFull);
	font-size: 0.85rem;
	text-align: right;
}
.pb-toplist a:hover {
	background: var(--colorBlue005Opa, #f3f3f7);
}
.pb-topname {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.pb-topname small {
	color: var(--colorHalfGrayFull);
}
.pb-bar {
	height: 0.45rem;
	border-radius: 0.25rem;
	background: var(--colorOrange025, rgba(255, 128, 0, 0.25));
	overflow: hidden;
}
.pb-bar span {
	display: block;
	height: 100%;
	background: var(--colorOrangeFull);
	border-radius: 0.25rem;
}
.pb-topnum {
	text-align: right;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}
.pb-letters {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem;
	margin-bottom: 1rem;
}
.pb-letter {
	min-width: 2.1rem;
	padding: 0.35rem 0.45rem;
	margin: 0;
	border: 1px solid var(--colorBlack010);
	border-radius: 0.3rem;
	background: var(--colorWhiteFull);
	color: var(--colorBlack075, #333);
	font-size: 0.95rem;
	cursor: pointer;
	box-shadow: none;
}
.pb-letter.wide {
	padding: 0.35rem 0.75rem;
}
.pb-letter:hover:not(:disabled) {
	border-color: var(--colorBlueFull);
	color: var(--colorBlueFull);
}
.pb-letter.active {
	background: var(--colorBlueFull);
	border-color: var(--colorBlueFull);
	color: #fff;
}
.pb-letter.active:hover {
	color: #fff;
}
.pb-letter:disabled {
	opacity: 0.3;
	cursor: default;
}
.pb-section {
	margin-bottom: 1.5rem;
	scroll-margin-top: 6rem;
}
.pb-sectionhead {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	margin-bottom: 0.5rem;
}
.pb-sort {
	padding: 0.35rem 0.5rem;
	border-radius: 0.3rem;
	border: 1px solid var(--colorBlack025, rgba(0, 0, 0, 0.25));
	background: var(--colorWhiteFull);
} 
.pb-tablewrap {
	overflow-x: auto;
	border: 1px solid var(--colorBlack025);
    border-radius: var(--borderDefault);
	background-color: var(--colorWhiteFull);
	box-shadow: 0rem 0.5rem 1rem var(--colorBlack005);
}
	
.pb-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.98rem;
}
.pb-table th {
	text-align: left;
	font-size: 0.82rem;
	font-weight: 600;
	color: var(--colorHalfGrayFull);
	padding: 0.55rem 0.75rem;
	border-bottom: 1px solid var(--colorBlack010);
	white-space: nowrap;
	background: var(--colorBlack001opa, #fcfcfc);
}
.pb-table td {
	padding: 0.5rem 0.75rem;
	border-bottom: 1px solid var(--colorBlack010);
	vertical-align: middle;
}
.pb-table tbody tr:last-child td {
	border-bottom: none;
}
.pb-table .num {
	text-align: right;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.pb-table .act {
	text-align: right;
	white-space: nowrap;
	width: 1%;
}
.pb-row {
	cursor: pointer;
}
.pb-row:hover,
.pb-versions tr:hover {
	background: var(--colorBlue005Opa, #f3f3f7);
}
.pb-name {
	font-weight: 600;
	color: var(--colorBlueFull);
	cursor: pointer;
}
.pb-row:hover .pb-name {
	text-decoration: underline;
}
.pb-vendorof {
	color: var(--colorHalfGrayFull);
	font-size: 0.9rem;
}
.pb-row .pb-id {
	margin-top: 0.1rem;
}
.pb-cvecount {
	display: inline-block;
	min-width: 2.5rem;
	padding: 0.1rem 0.5rem;
	border-radius: 1rem;
	background: var(--colorBlue005, rgba(14, 26, 104, 0.05));
	color: var(--colorBlueFull);
	font-weight: 600;
	text-align: center;
	cursor: pointer;
}
.pb-cvecount:hover {
	background: var(--colorBlueFull);
	color: #fff;
}
.pb-hot {
	color: var(--colorSeverityHigh, #e47120);
	font-weight: 600;
}
.pb-zero {
	color: var(--colorGray204Full, #ccc);
}
.pb-type {
	display: inline-block;
	font-size: 0.78rem;
	padding: 0.1rem 0.5rem;
	border-radius: 1rem;
	background: var(--colorBackGrayFull, #f1f5f9);
	color: var(--colorBlack075, #333);
	white-space: nowrap;
}
.pb-type.t-any {
	font-style: italic;
	color: var(--colorHalfGrayFull, #7f7f7f);
}
.pb-type.t-o {
	background: var(--colorLightBlue1, #ebeeff);
}
.pb-type.t-h {
	background: var(--colorOrange075HTFull, #ffdfbf);
}
.pb .pb-add,
.pb .pb-small {
	margin: 0 0 0 0.3rem;
	padding: 0.2rem 0.55rem;
	min-width: 2rem;
	font-size: 0.9rem;
	line-height: 1.3;
	border-radius: 0.3rem;
	cursor: pointer;
}
.pb .pb-add {
	font-weight: 700;
}
.pb-ver {
	font-family: monospace;
	font-size: 1rem;
	white-space: nowrap;
}
.pb-ver i {
	font-family: inherit;
	color: var(--colorHalfGrayFull);
}
.pb-parts {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem;
}
.pb-part {
	font-family: monospace;
	font-size: 0.8rem;
	padding: 0.05rem 0.4rem;
	border-radius: 0.25rem;
	background: var(--colorBackGrayFull, #f1f5f9);
}
.pb-vtitle {
	font-size: 0.88rem;
	color: var(--colorHalfGrayFull);
}
.pb-depr {
	font-family: inherit;
	font-size: 0.75rem;
	padding: 0.05rem 0.4rem;
	border-radius: 0.25rem;
	background: var(--colorRed025, rgba(200, 0, 0, 0.25));
	color: var(--colorRedDarkFull, #960000);
}
.pb .show-s {
	display: none;
}
.pb-pager {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 0.75rem;
	margin-top: 0.6rem;
}
.pb-pageinfo {
	font-size: 0.9rem;
	color: var(--colorHalfGrayFull);
	font-variant-numeric: tabular-nums;
}
.pb .pb-pagebtn {
	margin: 0;
	padding: 0.3rem 0.8rem;
}
.pb-pagebtn:disabled {
	opacity: 0.35;
	cursor: default;
}
.pb-more {
	margin-top: 0.5rem;
	text-align: right;
}
.pb-more a {
	color: var(--colorBlueFull);
	cursor: pointer;
	font-weight: 600;
}
.pb-empty,
.pb-msg {
	padding: 1rem;
	color: var(--colorHalfGrayFull);
}
.pb-msg {
	border-left: 3px solid var(--colorBlueFull);
	background: var(--colorBlue005, rgba(14, 26, 104, 0.05));
	border-radius: 0.3rem;
	margin-bottom: 0.75rem;
}
.pb-msg.error {
	border-left-color: var(--colorRedFull, #c80000);
	background: rgba(200, 0, 0, 0.06);
}
#products_overview.pb {
	padding-bottom: 2rem;
}
/* public page: overlay */
#productspanel .inner.pbpanel {
	width: calc(100vw - 10rem);
	height: calc(100vh - 10rem);
	display: flex;
	flex-direction: column;
	background: var(--colorBrightGrayFull, #fafafa);
}
#productspanel .inner.pbpanel > .content {
	overflow-y: auto;
	padding: 1rem 1.5rem 1.5rem 1.5rem;
	font-size: 1.15rem;
}
@media (max-width: 800px) {
	.pb-tops {
		grid-template-columns: 1fr;
	}
	.pb .hide-s {
		display: none;
	}
	.pb .show-s {
		display: flex;
		margin-top: 0.25rem;
	}
	.pb-table td,
	.pb-table th {
		padding: 0.45rem 0.5rem;
	}
	#productspanel .inner.pbpanel > .content {
		padding: 0.75rem;
	}
}

/* ---------- CveBrowser (js/cvebrowser.js): CVE overview (menu "CVEs") + CVE dashboard widgets; uses the .pb-* parts above ---------- */
#cve_overview.cb {
	margin: 1.25rem 0 1rem 0;
}
.cb .sev-critical { --sev: var(--colorSeverityCritical, #B81C35); }
.cb .sev-high     { --sev: var(--colorSeverityHigh, #e47120); }
.cb .sev-medium   { --sev: var(--colorSeverityMedium, #cfa211); }
.cb .sev-low      { --sev: var(--colorSeverityLow, #5f9522); }
.cb .sev-none     { --sev: var(--colorSeverityNONE, #2c85a3); }
.cb .sev-unknown  { --sev: var(--colorGray204Full, #bbb); }
.cb-kev {
	display: inline-block;
	padding: 0.05rem 0.45rem;
	border-radius: 1rem;
	background: var(--colorRed025, rgba(200, 0, 0, 0.15));
	color: var(--colorRedDarkFull, #960000);
	font-size: 0.75rem;
	font-weight: 600;
	white-space: nowrap;
}
.cb-kev.overdue {
	background: var(--colorRedDarkFull, #960000);
	color: #fff;
}
.cb .cb-star {
	margin: 0;
	padding: 0 0.3rem;
	min-width: 0;
	border: none;
	background: none;
	box-shadow: none;
	font-size: 1.2rem;
	line-height: 1;
	color: var(--colorGray204Full, #bbb);
	cursor: pointer;
}
.cb .cb-star:hover,
.cb .cb-star.on {
	color: var(--colorOrangeFull, #ff8000);
}
/* key figures */
.cb .cb-kpis .pb-stats {
	margin-top: 0;
}
.cb button.cb-kpi {
	margin: 0;
	text-align: left;
	cursor: pointer;
	box-shadow: none;
	color: inherit;
	font: inherit;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.cb button.cb-kpi:hover {
	border-color: var(--colorBlueFull);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
	background: var(--colorWhiteFull);
}
.cb-kpi.sev-critical .pb-statval,
.cb-kpi.sev-high .pb-statval {
	color: var(--sev);
}
.cb-kpi.cb-kpikev .pb-statval {
	color: var(--colorRedDarkFull, #960000);
}
.cb-kpi .pb-statval small {
	font-size: 0.9rem;
	font-weight: 400;
	color: var(--colorHalfGrayFull);
}
/* boxes */
.cb-grid {
	display: grid;
	grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
	grid-template-areas: "lists trend" "lists cwes";
	gap: 1rem;
	margin: 1rem 0 1.5rem 0;
	transition: opacity 0.15s;
}
.cb-box[data-box="lists"] { grid-area: lists; }
.cb-box[data-box="trend"] { grid-area: trend; }
.cb-box[data-box="cwes"]  { grid-area: cwes; }
.cb-box {
	min-width: 0;
}
.cb-boxhead {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 0.6rem;
	height: 2rem;
}
.cb .cb-boxhead h3 {
	margin: 0;
}
.cb-tabs .pb-tab {
	padding: 0.3rem 0.65rem;
	font-size: 0.85rem;
}
/* trend chart */
.cb-chart {
	display: block;
	width: 100%;
	height: 190px;   /* = height of the drawing (js/cvebrowser.js renderTrend) */
}
.cb-chart rect.sev-critical,
.cb-chart rect.sev-high,
.cb-chart rect.sev-medium,
.cb-chart rect.sev-low,
.cb-chart rect.sev-none,
.cb-chart rect.sev-unknown {
	fill: var(--sev);
}
.cb-chart .cb-hit {
	fill: transparent;
}
.cb-chart .cb-bar:hover .cb-hit {
	fill: var(--colorBlack005, rgba(0, 0, 0, 0.05));
}
.cb-grid-line {
	stroke: var(--colorBlack010, rgba(0, 0, 0, 0.1));
	stroke-width: 1;
}
.cb-axis {
	font-size: 10px;
	fill: var(--colorHalfGrayFull, #7f7f7f);
}
.cb-kevdot {
	fill: var(--colorRedDarkFull, #960000);
}
.cb-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 0.75rem;
	margin-top: 0.4rem;
	font-size: 0.82rem;
}
.cb .cb-legenditem {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	margin: 0;
	padding: 0.1rem 0.2rem;
	border: none;
	background: none;
	box-shadow: none;
	font-size: inherit;
	color: var(--colorBlack075, #333);
}
.cb button.cb-legenditem {
	cursor: pointer;
}
.cb button.cb-legenditem:hover {
	text-decoration: underline;
}
.cb-swatch {
	display: inline-block;
	width: 0.7rem;
	height: 0.7rem;
	border-radius: 0.15rem;
	background: var(--sev);
}
.cb-swatch.cb-kevdot {
	border-radius: 50%;
	background: var(--colorRedDarkFull, #960000);
}
.cb-cwelist .pb-topname small {
	font-size: 0.8rem;
}
/* list of all CVEs */
.cb-filterrow {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.6rem;
	margin: 0.4rem 0 0.75rem 0;
}
.cb-filterrow .formInputSelect {
	margin: 0;
}
.cb .cb-kevtoggle {
	border: 1px solid var(--colorBlack025, rgba(0, 0, 0, 0.25));
	border-radius: 0.4rem;
}
.cb-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}
.cb-chips:empty {
	display: none;
}
.cb .cb-chip {
	margin: 0;
	padding: 0.2rem 0.6rem;
	border-radius: 1rem;
	border: 1px solid var(--colorBlueFull);
	background: var(--colorBlue005, rgba(14, 26, 104, 0.05));
	color: var(--colorBlueFull);
	font-size: 0.85rem;
	box-shadow: none;
	cursor: pointer;
}
.cb .cb-chip span {
	font-weight: 700;
	margin-left: 0.2rem;
}
.cb .cb-chip:hover {
	background: var(--colorBlueFull);
	color: #fff;
}
.cb .cb-chipclear {
	border-color: transparent;
	background: none;
}
/* CVE cards (design of #cvefollowList / #ProductProductCveList, .cveCardList rules above) */
.cb-cards {
	margin-bottom: 0.5rem;
}
.cb-box .cveCardList .cveCard,
.dw-body .cveCardList .cveCard {
	box-sizing: border-box;   /* padding + border inside the width: no horizontal scrollbar */
	width: 100%;
}
.cb-box .cveCardList,
.dw-body .cveCardList {
	flex-direction: column;
	flex-wrap: nowrap;
}
.cveCardList .chip.status.cb-kevchip {
	background: var(--colorRed025, rgba(200, 0, 0, 0.15));
	border-color: var(--colorRed025, rgba(200, 0, 0, 0.25));
	color: var(--colorRedDarkFull, #960000);
}
.cveCardList .chip.status.cb-kevchip.overdue {
	background: var(--colorRedDarkFull, #960000);
	color: #fff;
}
.cveCardList .hero h1 .cb-star {
	position: relative;
	top: -0.15rem;
	margin-left: 0.25rem;
}
/* search field with suggestions */
.cb-searchwrap {
	position: relative;
	z-index: 20;
}
.cb-suggest {
	position: absolute;
	left: 0;
	top: calc(100% + 0.25rem);
	width: 44rem;
	max-width: calc(100vw - 2rem);
	max-height: 70vh;
	overflow-y: auto;
	background: var(--colorWhiteFull, #fff);
	border: 1px solid var(--colorBlack025, rgba(0, 0, 0, 0.25));
	border-radius: 0.4rem;
	box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15);
	text-align: left;
}
.cb-suggest.hidden {
	display: none;
}
.cb-sugitem {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	padding: 0.45rem 0.75rem;
	cursor: pointer;
	border-bottom: 1px solid var(--colorBlack010);
}
.cb-sugitem:hover,
.cb-sugitem.active {
	background: var(--colorBlue005Opa, #f3f3f7);
}
.cb-sugmain {
	min-width: 0;
	flex: 1;
}
.cb-sugmain .cb-desc {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 0.86rem;
	color: var(--colorBlack075, #333);
	margin-top: 0.1rem;
}
/* CVE: gauge on the right (as on the CVE cards), vertically centred */
.cb-sugitem.cb-sugcve {
	align-items: center;
}
.cb-sugcve .scores {
	flex: 0 0 auto;
}
.cb-sugmain small {
	color: var(--colorHalfGrayFull);
}
.cb-sugicon {
	min-width: 2.6rem;
	text-align: center;
	color: var(--colorHalfGrayFull);
}
.cb-sughead {
	padding: 0.35rem 0.75rem;
	font-size: 0.78rem;
	font-weight: 600;
	color: var(--colorHalfGrayFull);
	background: var(--colorBlack001opa, #fcfcfc);
	border-bottom: 1px solid var(--colorBlack010);
}
.cb-sugall {
	color: var(--colorBlueFull);
	font-weight: 600;
	border-bottom: none;
}
/* dashboard widgets */
.dw-body.cb .pb-stats {
	margin: 0;
}
#dashboard_cvekpis.dashboard_widget {
	height: auto;      /* one row of key figures, not the 40rem of the other widgets */
}
@media (max-width: 800px) {
	.cb-grid {
		grid-template-columns: 1fr;
		grid-template-areas: "lists" "trend" "cwes";
	}
	.cb-cards .cveCard {
		width: 100%;
	}
}

/* ---------- crawlable pages (lib/seo.php): plain HTML for crawlers / without JavaScript, removed by an inline script in main.html ---------- */
.seo-content {
	position: relative;
	z-index: 1;
	max-width: 60rem;
	margin: 7rem auto 2rem auto;
	padding: 1.5rem 2rem;
	background: var(--colorWhiteFull, #fff);
	color: var(--colorBlackFull, #000);
	border-radius: var(--borderDefault, 0.5rem);
	text-align: left;
	line-height: 1.5;
}
.seo-content h1 {
	font-size: 1.8rem;
	margin: 0.5rem 0 1rem 0;
}
.seo-content h2 {
	font-size: 1.25rem;
	margin: 1.5rem 0 0.5rem 0;
}
.seo-content dt {
	font-weight: 600;
	margin-top: 0.5rem;
}
.seo-content a {
	color: var(--colorBlueFull, #0e1a68);
	word-break: break-word;
}

/* ---------- Dashboard (js/dashboard.js): widget loading, edit mode, changelog markup, version in the main menu ---------- */
.dash-toolbar {
	flex: 0 0 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.5rem;
    min-height: 2.2rem;
    flex-direction: row-reverse;
}
.dash-toolbar button,
.dash-toolbar select {
	margin: 0;
}
.dash-note {
	margin-right: auto;
	font-size: var(--fontSmall2, 0.9rem);
	color: var(--colorGreenFull, #5f9522);
	opacity: 0;
	transition: opacity 0.3s;
}
.dash-note.show {
	opacity: 1;
}
.dash-editonly {
	display: none !important;
}
.dash-editing .dash-editonly {
	display: inline-flex !important;
	gap: 0.5rem;
	align-items: center;
}
.dash-editing #dash_customize {
	display: none;
}
.dash-add {
	padding: 0.35rem 0.5rem;
	border-radius: 0.3rem;
	border: 1px solid var(--colorBlack025, rgba(0, 0, 0, 0.25));
	background: var(--colorWhiteFull, #fff);
}
.dash-empty {
	flex: 0 0 100%;
	padding: 2rem;
	text-align: center;
	color: var(--colorHalfGrayFull, #7f7f7f);
}
.dashboard_widget {
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.dashboard_widget.dw-off {
	display: none;
}
.dashboard_widget > h2 {
	flex: 0 0 auto;
}
.dashboard_widget .dw-body {
	flex: 1 1 auto;
	overflow-y: auto;
	min-height: 0;
}
/* loading animation of one widget */
.dw-loader {
	display: none;
	position: absolute;
	inset: 3.2rem 0 0 0;
	background: var(--colorWhite075, rgba(255, 255, 255, 0.75));
	align-items: center;
	justify-content: center;
	z-index: 2;
}
.dw-busy .dw-loader {
	display: flex;
}
.dw-spinner {
	width: 2rem;
	height: 2rem;
	border: 3px solid var(--colorBlue025, rgba(14, 26, 104, 0.25));
	border-top-color: var(--colorBlueFull, #0e1a68);
	border-radius: 50%;
	animation: dw-spin 0.8s linear infinite;
}
.dw-spinner-small {
	display: none;
	width: 0.9rem;
	height: 0.9rem;
	border-width: 2px;
	margin-left: 0.25rem;
}
.dw-busy-bg .dw-spinner-small {
	display: inline-block;
}
@keyframes dw-spin {
	to { transform: rotate(360deg); }
}
/* edit mode */
.dw-ctrl {
	display: none;
	margin-left: auto;
	gap: 0.25rem;
	align-items: center;
}
.dash-editing .dw-ctrl {
	display: inline-flex;
}
.dash-editing .dashboard_widget {
	outline: 2px dashed var(--colorBlue025, rgba(14, 26, 104, 0.25));
	outline-offset: -2px;
}
.dash-editing .dashboard_widget > :not(h2) {
	pointer-events: none;
	opacity: 0.6;
}
.dw-ctrl .dw-btn {
	margin: 0;
	padding: 0.15rem 0.45rem;
	min-width: 1.8rem;
	font-size: 0.85rem;
	line-height: 1.2;
	cursor: pointer;
}
.dw-ctrl .dw-handle {
	cursor: grab;
}
.dw-ctrl .dw-remove:hover {
	color: var(--colorRedFull, #c80000);
}
.dw-ctrl .dw-size {
	width: auto;
	max-width: 8rem;
	padding: 0.15rem 0.3rem;
	font-size: 0.85rem;
}
.dw-dragging {
	opacity: 0.4;
}
.dw-empty,
.dw-error {
	padding: 1rem;
	color: var(--colorHalfGrayFull, #7f7f7f);
}
.dw-error {
	color: var(--colorRedFull, #c80000);
}
.dw-error button {
	margin-left: 0.5rem;
}
.dw-more {
	margin-top: 0.75rem;
	text-align: right;
}
.dw-more a {
	cursor: pointer;
	color: var(--colorBlueFull, #0e1a68);
	font-weight: 600;
}
/* changelog */
.changelog-list .cl-entry {
	padding: 0.75rem 0.25rem;
	border-bottom: 1px solid var(--colorBlack010, rgba(0, 0, 0, 0.1));
}
.changelog-list .cl-entry:last-child {
	border-bottom: none;
}
.cl-head {
	display: flex;
	align-items: baseline;
	gap: 0.6rem;
	margin-bottom: 0.4rem;
}
.cl-version {
	font-weight: 700;
	font-size: var(--fontHeader1);
	color: var(--colorBlueFull);
}
.cl-date {
	font-size: var(--fontDefault);
	color: var(--colorHalfGrayFull);
}
.cl-text h3 {
	font-size: var(--fontHeader1);
	margin: 0.6rem 0 0.3rem 0;
}
.cl-text h4 {
	font-size: var(--fontHeader2);
	margin: 0.5rem 0 0.25rem 0;
	color: var(--colorBlack075, #333);
}
.cl-text p {
	margin: 0.3rem 0;
}
.cl-text ul,
.cl-text ol {
	margin: 0.3rem 0 0.3rem 1.4rem;
}
.cl-text li {
	margin: 0.15rem 0;
}
.cl-text code {
	font-family: monospace;
	font-size: 0.9em;
	padding: 0.05rem 0.3rem;
	border-radius: 0.2rem;
	background: var(--colorBackGrayFull, #f1f5f9);
}
.cl-text blockquote {
	margin: 0.4rem 0;
	padding: 0.3rem 0.75rem;
	border-left: 3px solid var(--colorOrangeFull, #ff8000);
	background: var(--colorOrange075HTFull, #ffdfbf);
}
.cl-text hr {
	border: none;
	border-top: 1px solid var(--colorBlack010, rgba(0, 0, 0, 0.1));
	margin: 0.6rem 0;
}
.cl-text a {
	color: var(--colorBlueFull, #0e1a68);
	text-decoration: underline;
}

/* version of the newest changelog entry at the bottom of the main menu */
.mainmenu .appversion {
	position: absolute;
	bottom: 0.75rem;
	left: 0;
	width: 100%;
	padding: 0 1rem;
	box-sizing: border-box;
	font-size: 0.8rem;
	opacity: 0.55;
	text-align: center;
}
.mainmenu .appversion text {
	font-size: 0.8rem;
}
/* ---------- CVE list of a filter: alarm thresholds (showCveListThresholds in main_b.js) ---------- */
.cvelist-threshold {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin: 0 1rem 0 0.5rem;
	cursor: pointer;
	user-select: none;
	vertical-align: middle;
}
.cvelist-threshold.disabled {
	opacity: 0.45;
	cursor: default;
}
.cvelist-thresholdinfo {
	margin: 0.75rem 0 0.25rem 0;
	padding: 0.45rem 0.75rem;
	border-left: 3px solid var(--colorBlueFull, #0e1a68);
	background: var(--colorBlue005, rgba(14, 26, 104, 0.05));
	border-radius: 0.3rem;
	font-size: 0.95rem;
}
.cvelist-thresholdinfo:empty {
	display: none;
}
.cvelist-thresholdinfo.ignored {
	border-left-color: var(--colorOrangeFull, #ff8000);
	background: var(--colorOrange025, rgba(255, 128, 0, 0.12));
}
.cvelist-thresholdinfo .cvelist-thsrc,
.cvelist-thresholdinfo .cvelist-thlist {
	color: var(--colorHalfGrayFull, #7f7f7f);
}
#cvepub_search_input,
#cve_search_input {
	width: 30rem;
}

#dashboard_cvetrend,
#dashboard_topvendors,
#dashboard_topproducts
{
	height: 24rem;
}


.savebutton{
	background-color: var(--colorBlueFull);
	color: var(--colorWhiteFull);
}

.savebutton:hover{
	color: var(--colorBlackFull);
}