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;
	}
	
	.headermenu text:hover,
	#pagelinksoptions .links:hover,
	#pagelinksmore .links:hover {
		opacity: 1;
	}
	.frontendpage .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{
	  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;
	}
	
	.frontendpage .breadcrump text: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;
}

.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: 1rem auto auto auto;
    width: 40rem;
    text-align: left;
    padding-left: 2rem;
}

/* 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;
		margin: 0rem 1rem;
		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);
	}
	
	.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;
	}
	
	input[type="submit"].left,
	button.left {
		float:left;
	}
	
	
	
	button.mini{
		padding: 0.1rem 0.1rem;
		border-radius: var(--border04);
		margin: 0 0.1rem;
	}
	
	
	
	
	textarea,
	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);
	}
	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 {
		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: 30vmin;
    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;
}

table.hovertable {
	background-color: var(--colorWhiteFull);
	
	width: 100%;
    table-layout: auto;
}

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-top:1px solid var(--colorWhiteFull);
	border-bottom: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{
	padding: 0.5rem 0.5rem;
	background-color: var(--colorBrightGrayHTFull);
    /*color: var(--colorWhiteFull);*/
	text-overflow: ellipsis;
    overflow: hidden;
	position:sticky;
	top:0;
	z-index: 1;
}

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

table.hovertable td.edit {
	cursor: grab;
	background-image: url(/img/64/edit_black_50.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 1.5rem;
}



table.hovertable td.edit.alarm {
	cursor: grab;
	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 tr:hover :not(th):not(text):not(li):not(ul):not(a):not(innertable):not(innerth):not(innertr):not(innertd):not(span){
	background-color: var(--colorBlue025);
}


table.hovertable tr:hover td.edit {
	/*background-image: url(/img/64/edit.png);*/
	background-color: var(--colorOrange025);
	transition: color var(--transitionQuick), background-color var(--transitionQuick);
}

table.hovertable tr:hover td.edit.alarm {
	/*background-image: url(/img/64/bell.png);*/
	background-color: var(--colorOrange025);
	transition: color var(--transitionQuick), background-color var(--transitionQuick);
}

table.hovertable tr:hover td.edit:hover {
	background-image: url(/img/64/edit.png);
	background-color: var(--colorOrangeFull);
	color: var(--colorWhiteFull);
}
table.hovertable tr:hover 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 {
	height: unset;
	opacity: 1;
	transition: var(--transitionSemi);
}

.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.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;
}
.teaserContainer {
	position: absolute;
    top: 68vh;
    left: 2rem;
    width: 30vw;
	-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:0px;
	left:0px;
	width: 14rem;
	height: calc(100% - 2rem);
	padding: 1rem 0rem;
	color: var(--colorBlack075);
	user-select: none;
	display: table-cell;
	line-height: 1.5rem;
}

.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>img {
	margin-left:0.5rem;
	width:6rem;
}

.mainmenu text {
	margin: 0rem 0rem;
	position: relative;
	transition: var(--transitionQuick);

	cursor: pointer;
	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);	
}
#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_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);	
}
#cat_CVE.catactive {
	background-image: url(../img/64/shield.png);	
}

#cat_Profile {
	background-image: url(../img/gear_black.svg);	
}
#cat_Profile.catactive {
	background-image: url(../img/gear_white.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 {
	
	position: absolute;
    left: 14rem;
	width:  calc(100% - 14rem);
	min-height: 100vh;
	display: table-cell;
	vertical-align: top;
}

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

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

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

.frontendpage .breadcrumpwrap {
	height: 2rem;
	display: flex;
    width: 100%;
}
/*
.breadcrumpspace {
	background: var(--colorLightGrayFull);
	height: 2rem;
	width: -webkit-fill-available;
}
*/
.frontendpage .breadcrump {
	padding: 0.5rem 1rem;
    height: 1rem;
	white-space:nowrap;
	color: var(--colorBlack075);
}

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

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

.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: grab;
    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);
    cursor: grab;
    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);
}
.innerform.left,
.innercard.left {
	width: 25%;
}

#userprofile table{
	table-layout: unset;
}
.innerform.right,
.innercard.right {
	width: 65%;
}
.innerform.left>div,
.innercard.left>div{
    display: inline-block;
    border-radius: var(--borderDefault);
    overflow: hidden;
    background-color: var(--colorWhiteFull);
    margin-bottom: 1rem;
	width: 100%;
}

.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;
}

#mail_customerpreview,
#mailpreview {
	text-align: center;
	position: absolute;
    right: 0;
    top: 3rem;
	width: 20rem;
	
}
#mail_customerpreview img,
#mailpreview img{
	width: 50%;
}

#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);
}
var(--colorWhiteFull)
#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:nth-child(4){
	width:5%;
}
#projectList th:nth-child(5){
	width:5%;
}
#projectList th:nth-child(6){
	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;
    background-color: var(--colorBrightLightGrayFull);
    text-overflow: ellipsis;
    overflow: hidden;
	position:sticky;
	top:0;
	z-index: 100;
}

#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){
    background-color: var(--colorBrightLightGrayFull);
}

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

#project_shares_user th:nth-child(1),
#project_shares th:nth-child(1),
#project_shares_user th:nth-child(3),
#project_shares th:nth-child(3),
#project_shares_user th:nth-child(4),
#project_shares th:nth-child(4),
#project_shares_user th:nth-child(5),
#project_shares th:nth-child(5){
	width:5rem;
}



/*
#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;
}

.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: #B81C35;
}
.severityHigh {
	background-color: #e47120;
}
.severityMedium {
	background-color: #cfa211;
}
.severityLow {
	background-color: #5f9522;
}
.severityNone {
	background-color: #2c85a3;
}

.severityCriticalColor {
	color: #B81C35;
}
.severityHighColor {
	color: #e47120;
}
.severityMediumColor {
	color: #cfa211;
}
.severityLowColor {
	color: #5f9522;
}
.severityNoneColor {
	color: #2c85a3;
}


#dashboard  #dashboard_import_protocol {
	width:100%;
	max-height: 90vh;
}

#dashboard #dashboard_import_protocol .title{
    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;
    color: var(--colorBlackFull);
    border-bottom: solid 1px var(--colorBlack025);
    user-select: none;
}

#dashboard #dashboard_import_protocol .overviewdialog{
	height: 31rem;
	position:relative;
	top:0;
	left:0;
}

#dashboard #dashboard_import_protocol .overviewdialog .diagram{
	height: 30rem;
	width:	60rem;
	/*background-color: #cc0000;*/
	position:absolute;
	top:0;
	left:0;
	display: inline-block;
	/*border: 1px solid gray;*/
}

#dashboard #dashboard_import_protocol .overviewdialog .options{
	height: calc(30rem - 2rem);
	width:	25rem;
	padding: 1rem;
	position:absolute;
	top:0;
	left: 60rem;
	display: inline-block;
	/*background-color:#00cc00;*/
}

#dashboard #dashboard_import_protocol .overviewdialog .filterselection{
	height: calc(30rem - 2rem);
	width:	calc(100% - 86rem);
	padding: 1rem;
	position:absolute;
	top:0;
	right: 0;
	display: inline-block;
}


#dashboard #dashboard_import_protocol .hovertablecontainer{
	height: calc(90vh - 30rem);
}


#importDiagramCanvasContainer {
	width: 30rem;
	height: 30rem;
}
#importDiagramCanvas {
	width: 100%;
	height: 100%;
	margin: 0.5rem;
}

#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(--fontSmall4);
}


.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.4rem;
}

.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;}

.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 { display: none; }
.cveNToggle:not(:checked) ~ #confless { 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);
}
.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:24px;
	flex-wrap:wrap
}
.hero-main {
	flex:1;
	min-width:320px
}
.hero h1 {
	font-size:var(--fontHeader0);
	margin-bottom: 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 */
}

.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;
}

.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.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:14px;align-items:stretch}
.gauge-box{text-align:center;padding:6px 18px}
.gauge-num{
	font-size:1.9rem;
	font-weight:800;
	line-height:1
	}
.gauge-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
.gauge-sub{font-size:.72rem;color:var(--colorBlack050);margin-top:3px}
.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{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{
	  
  }