/* NOTE: color schemes are changed with look and feel in page settings */

/*
@font-face {
    font-family: 'Calibri';
    src: url('fonts/Calibri.woff2?version=1.0') format('woff2'),
        url('fonts/Calibri.woff?version=1.0') format('woff');
    font-weight: normal;
}
@font-face {
    font-family: 'Calibri';
    src: url('fonts/Calibri-BoldItalic.woff2?version=1.0') format('woff2'),
        url('fonts/Calibri-BoldItalic.woff?version=1.0') format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Calibri';
    src: url('fonts/Calibri-Italic.woff2?version=1.0') format('woff2'),
        url('fonts/Calibri-Italic.woff?version=1.0') format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Calibri';
    src: url('fonts/Calibri-Bold.woff2?version=1.0') format('woff2'),
        url('fonts/Calibri-Bold.woff?version=1.0') format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
	font-family: 'Bree-SH-Headline';
	font-weight: 400;
	font-style: normal;
	src: url('fonts/Bree-Bold.woff2?version=1.0') format('woff2'),
		url('fonts/Bree-Bold.woff?version=1.0') format('woff');
}

@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/material/MaterialIcons-Regular.woff2?version=1.0') format('woff2'),
       url('fonts/material/MaterialIcons-Regular.woff?version=1.0') format('woff');
} */

@mixin icon($content, $size, $display, $lineheight){
	font-family: 'Material Icons';
	font-style:normal;
	content:$content;
	font-size:$size;
	@if $display {
		display:$display;
	} @else {
		display:inline-block;
	}
	@if $lineheight {
		line-height:$lineheight;
	}
}
@mixin button($width) {
	text-align: center;
	font-size: 14px;
	line-height:24px;
	font-weight: 600;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-transform: capitalize;
	border-radius: 32px;
	border: 0;
    padding: 8px;
	cursor: pointer;
	display: flex;
	align-items:center;
	justify-content:center;
	text-align: center;
    width:$width;
}
@mixin triangle($size,$color,$left,$right,$margin) {
    border-bottom: $size solid $color;
	border-left: $size solid transparent;
	border-right: $size solid transparent;
	height: 0;
	width: 0;
	display: block;
	content: "";
	position: absolute;
	top: -$size;
	left: $left;
    right:$right;
    margin:$margin;
}
@mixin input {
	font-size: 14px;
	line-height: 24px;
	color: var(--text-90);
	background: var(--highlight-5);
	border-radius: 2px;
	width: 100%;
	transition: .2s all ease-in-out;
	font-weight: 300;
	padding:16px 8px 0px 8px;
	border:0;
	cursor:pointer;
	height:40px;
}
@mixin label {
	outline: 0;
	border: none;
	color: var(--text-90);
	border-radius: 2px;
	width: 100%;
	box-sizing: border-box;
	padding: 8px 8px 0 8px;
	transition: .2s all ease-in-out;
	font-weight: 300;
	position:absolute;
	top:4px;
	left:4px;
	font-size:14px;
	line-height:24px;
    &.active {
    	color: var(--text-55);
	    position: absolute;
	    top: 0px;
	    left: 4px;
	    width: calc(100% - 16px);
	    transition: .2s all ease-in-out;
	    line-height: 16px;
	    pointer-events: none;
	    font-size: 12px;
	    white-space: nowrap;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    padding: 8px 8px 0 8px;
    }
    &.focus {
    	color:var(--primary-color);
	    position: absolute;
	    top: 0px;
	    left: 4px;
	    width: calc(100% - 16px);
	    transition: .2s all ease-in-out;
	    line-height: 16px;
	    pointer-events: none;
	    font-size: 12px;
	    white-space: nowrap;
	    overflow: hidden;
	    text-overflow: ellipsis;
	    padding: 8px 8px 0 8px;
    }
}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 32px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}

@-ms-viewport {
  width: device-width;
}
html.aui.sense body{
	width: 100%;
	font-family:'Calibri', sans-serif;
	color:var(--text-90);
	font-size:14px;
}
body.signed-out{
	display:block;
}
input,
div {
	box-sizing:border-box;
    -moz-box-sizing:border-box
}

/* Native scrolling, as on by default in the theme, BREAKS THE PAGE ON iOS.
   It makes everything look transparent.
   TODO: move to theme & try to avoid important!!!!
 */

/* correct viewport */
/*#ext-global-floatWrap {
	position:fixed;
	top:10px;
	left:8px;
}*/

/* FARBEN */
.background-highlight-5,
.background-highlight-5 > div {
	background: var(--highlight-5)!important;

}
.background-base-1,
.background-base-1 > div,
.x-sheet {
	background: var(--base-1)!important;

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

/*ALLGEMEIN*/
.aui.sense body {
	font-family:Calibri, Arial, sans-serif;
	font-size:14px;
}
.hide {
	display:none;
}
input:focus, select:focus, textarea:focus, button:focus, button, a, .slick-slide:focus, a:focus {
   outline: none !important;
}
.alert-block.popup-alert-notice, .alert-block.popup-alert-warning{
	z-index:99999999;
}
#navigation .gn-menu > li > .gn-submenu.menu_hidden {
	display:none!important;
}
#wrapper {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color: var(--base-1);
	padding:0;
}
#banner + #navigation + #wrapper {
	top:72px;
	height:calc(100% - 72px);
}
#banner + #wrapper,
#banner.embeddedAdminHeader + #wrapper {
	top:56px;
	height:calc(100% - 56px);
}
#banner.embeddedAdminHeader > div {
	width: 100%;
    justify-content: flex-end;
}
#navigation.embedNavigation,
#banner + #navigation.embedNavigation {
	width:0;
}
#navigation.embedNavigation + #wrapper,
#banner + #navigation.embedNavigation + #wrapper {
	padding-left:0;
}
#navigation.embedNavigation .gn-menu > li > .gn-submenu {
	width:100%;
	left:0;
}
#navigation.embedNavigation .gn-menu > li {
	width:0;
}
#navigation.embedNavigation .gn-menu > li.selected.haschild > .gn-submenu {
	top:0;
}
#banner + #navigation.embedNavigation .gn-menu > li.selected.haschild > .gn-submenu {
	top:72px;
}
#wrapper.patientPortalHeader {
	background:var(--base-0);
}
#content {
	overflow: auto;
	height: 100%;
}
.logo.default-logo {
	display:flex;
	flex-direction:column;
}
.logo.default-logo .secondlogo {
	margin-top:20px;
}

.image-column {
	background: url(../images/loginscreen.png) no-repeat left top ;
	background-size:contain;
	background-color: var(--base-1);
}
.image-column.physician {
	background: url(../images/loginscreen2.jpg) no-repeat top right;
	background-size:cover;
	background-color: var(--base-1);
}
.image-column.patient {
	background: url(../images/loginscreen3.jpg) no-repeat 30% top;
	background-size:cover;
	background-color: var(--base-1);
}
#navigation + #wrapper {
	padding-left:72px;
}
#navigation.showSubnavi + #wrapper {
	padding-top:56px;
}
.lfr-has-edit-layout #wrapper,
.lfr-has-add-content #wrapper {
	padding-left:472px!important;
}
#navigation li#additionalSubNaviContent,
#dropdown li#additionalSubNaviContent1 {
	align-self: center;
	margin-left: auto;
}

/* HEADER */

#additionalBannerContent {

}
header#banner{
	background: var(--base-0);
	position: fixed;
    width: 100%;
    top: 0;
    left: 0;
	box-shadow: 0 2px 4px var(--shadow-light);
	display: flex;
	align-items:center;
	z-index: 1000;
	height: 72px;
	justify-content:space-between;
	max-width: 100%;
}
header#banner .logo {
	padding:0 16px;
}
header#banner .site-title {
	margin:0;
	font-size:18px;
	font-weight:300;
	display:flex;
	align-items:center;
	font-family: Bree-SH-Headline,sans-serif;
}
header#banner .page-title {
	padding-right:16px;
}
header#banner a {
	color: var(--text-55);
}
header#banner a:focus,
header#banner a:active,
header#banner a:hover {
	color: var(--primary-color);
}
/* Navigation Headerleiste */
.portlet-dockbar {
	max-height:72px;
	display:flex;
	.dockbar-messages {
		order:1;
		display: flex;
		align-items: center;
		justify-content: center;
		/*min-width:72px;*/
	}
	.navbar {
		order:2;
		color:var(--text-55);
		a.open,
		a:hover,
		a:focus {
			color:var(--primary-color);
		}
	}
}

/* Navigation Headerleiste - Buttons */

.dockbarResponsiveButton {
	display:flex;
	height:72px;
	cursor:pointer;
	> ul > li > a,
	> a {
		min-width:52px;
		display:flex;
		align-items:center;
		justify-content:center;
		height:72px;
		overflow:hidden;
		text-decoration:none;
	}
	.user-avatar-image {
		max-width:50px;
		border-radius:50%;
		clip-path: circle();
	}
	.icon {
		font-size:32px;
		line-height:32px;
		display:flex;
	}
}
#banner .dockbarResponsiveButton a.btn-navbar {
	text-decoration:none;
}

#banner .dockbarResponsiveButton a.btn-navbar:active,
#banner .dockbarResponsiveButton a.btn-navbar:focus,
#banner .dockbarResponsiveButton a.btn-navbar:visited {
	color: var(--text-55);
	text-decoration:none;
}
#banner .dockbarResponsiveButton a.btn-navbar:hover,
#banner .dockbarResponsiveButton a.btn-navbar:focus,
#banner .dockbarResponsiveButton a.btn-navbar.active,
#banner .dockbarResponsiveButton a.btn-navbar.active:focus {
	text-decoration:none;
	color: var(--primary-color);
}
/* Navigation Headerleiste - Content */
.dockbarbodyContent {
	position:fixed;
	z-index: 1000000;
	top:72px;
	right:0;
}
.dockbarbodyContent .nav-collapse,
.adminLinksWrap .dropdown-menu {
	position: absolute;
	top: 0;
	right: 0;
	transform: translateY(-1000px);
	opacity:0;
	/*transition:transform 1s, opacity 2s;*/
	background:var(--base-0);
	margin:20px 16px 0;
	min-width:260px;
	> ul {
		background:var(--base-0);
	}
}
.dockbarbodyContent .nav-collapse.open:before,
.adminLinksWrap .open .dropdown-menu:before {
    border-bottom: 10px solid var(--base-0);
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    height: 0;
    width: 0;
    display: block;
    content: "";
    position: absolute;
    top: -10px;
    right: 16px;
}
.dockbarbodyContent #navAddControlsNavbarCollapse.nav-collapse.open:before {
	left:16px;
	right:auto;
}
.patientPortalHeader {
	.dockbarbodyContent .nav-collapse.open:after{
		width: 102%;
		height: 102%;
		position: absolute;
		top: -1%;
		left: -1%;
		background: var(--highlight-20);
		content: "";
		z-index: -1;
		filter: blur(5px);
	}
	.adminLinksWrap .open .dropdown-menu:after {
		background:white;
	}
}

.adminLinksWrap .open .dropdown-menu,
.dockbarbodyContent .nav-collapse.open {
    box-shadow: 0 0px 15px var(--highlight-20);
}
.dockbarbodyContent .nav-collapse.open,
.adminLinksWrap .open .dropdown-menu {
	transform:translateY(0);
	opacity:1;
}
.adminLinksWrap .open .dropdown-menu {
	top:92px;
}
.control-panel-layout {
	#navigation {
		display:none;
		+ #wrapper {
			padding-left:0;
		}
	}
	.dockbarbodyContent .nav-collapse {
		position:fixed;
		top:72px;
	}
	.x-panel-header {
		background-color:var(--text-20)!important;
	}
	.x-form-invalid-field {
		border:1px solid var(--functional-red)!important;
	}
}

.dockbarbodyContent .nav-collapse{
	ul,
	li {
		list-style-type:none;
	}
}
#navAccountControls,
#navAddControls {
	padding:16px;
	margin:0;
}
#navAccountControls  .dropdown-toggle {
	cursor:auto;
	font-size:10px;
	text-transform:uppercase;
	color:var(--highlight-20);
	display: block;
}
#navAccountControls .dropdown-menu {
	margin:0;
	padding:0;
}
#navAccountControls .dropdown-menu a,
.adminLinksWrap .dropdown-menu a,
#navAddControls a {
	color:var(--text-90);
	font-size:14px;
	padding:4px 0;
	display:block;
}
#navAccountControls {
	a:focus,
	a:active,
	a:hover {
		text-decoration:none;
	}
}
#navAccountControls a:not(.dropdown-toggle):focus,
#navAccountControls a:not(.dropdown-toggle):active,
#navAccountControls a:not(.dropdown-toggle):hover,
#navAddControls a:focus,
#navAddControls a:hover,
#navAddControls a:active {
	text-decoration:none;
	color:var(--primary-color);
}
#navAccountControls .dropdown-menu a {
	display:flex;
	align-items:center;
}
#navAccountControls .dropdown-menu ul,
#navAddControls ul {
	padding:0;
	margin:0;

}
#navAccountControls .dropdown-menu a i {
	padding-right:5px;
}
#navAccountControls .taglib-my-sites.dropdown-menu a i,
#navAccountControls .taglib-my-sites.dropdown-menu a .site-type{
	display:none;
}
#navAccountControlsNavbarBtn {
	padding-left:10px;
	div.user {
		flex: 1 1 auto;
		display: block;
		padding: 8px;
		padding-right: 20px;
	}

    .user-full-name {
		font-size: 14px;
		padding-bottom: 3px;
		font-family: Bree-SH-Headline,sans-serif;
		color: var(--text-90);
	}
	.user-institution {
		font-size: 13px;
		color: var(--text-55);
	}
	.user-head-text {
		font-size: 13px;
		color: var(--secondary-color);
	}
}
.user-avatar .user-avatar-image {
	display:none;
}
#navAccountControls .my-sites + .divider-vertical {
	border-top: 1px solid var(--highlight-10);
	margin: 8px 0;
}
#navAccountControls .dropdown-menu a .icon-user:before {
	@include icon("\E7FD",18px,inline-block,18px);
}
#navAccountControls .dropdown-menu a .icon-off:before {
	@include icon("\E888",18px,inline-block,18px);
}
#navAccountControls .dropdown-menu ul li a {
	font-size:12px;
	position:relative;
	padding-left:16px;
}
#_145_styleButtons button {
	border: 1px solid var(--primary-color);
	background: var(--base-0);
	color: var(--primary-color);
	border-radius: 3px;
	margin: 0 2px;
}
#_145_addContentForm .dropdown {
	position:relative;
	> a {
		/*@include button(100%);*/
		background: var(--primary-color);
	    color: var(--base-0);
	    max-width: 160px;
	}
}
#_145_addContentForm .dropdown {
	> a .icon-plus:before {
		@include icon("\E145",20px,inline-block,20px);
	}
	&.open .dropdown-menu {
		display:block;
	}
	.dropdown-menu {
		display:none;
		background:var(--highlight-5);
		position:relative;
		margin:16px;
		&:before {
			@include triangle(10px,var(--highlight-5),16px,auto,0);
		}
	}
}
#_145_addContentForm .dropdown-menu a {
	color:var(--primary-color);
	padding:8px;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	&:hover,
	&:focus {
		text-decoration:none;
	}
}
/* SHOW ADMIN ON TOP */

.adminLinksWrap {
	#_145_adminLinks a {
		text-decoration:none;
		color:var(--text-90);
		&:hover,
		&:focus,
		&:active {
			color:var(--primary-color);
		}
	}
	> li > a {
		width:72px;
	}
	.dropdown-menu {
		padding:16px;
		margin:0;
		link-style-type:none;
	}
}
.adminLinksWrap,
.adminLinksWrap ul,
.adminLinksWrap li {
	list-style-type:none;
	margin:0;
	padding:0;
}
.admin-links.dropdown {
	position:relative;
}
.admin-links > a > .nav-item-label {
	font-family: 'Material Icons';
	font-size:0;
	color:var(--text-55);
	&:before {
		@include icon("\E8B8",26px,block,26px);
	}
}
.admin-links > a:hover > .nav-item-label,
.admin-links > a:focus > .nav-item-label,
.admin-links.open > a > .nav-item-label {
	color:var(--primary-color);
	&:before {
		@include icon("\E8B8",26px,block,26px);
	}
}
/* FORM */
.form .control-group {
	position:relative;
	padding:4px;
}
.form .control-group .field,
.language-value,
.form .control-group select {
	@include input;
}
.form .control-group select {
	background:var(--base-1);
}
.form .control-group .checkbox .field,
.form .control-group .radio .field {
	font-size: 14px;
	line-height: 24px;
	color: var(--primary-color);
	background: transparent;
	border-radius: 2px;
	width: auto;
	transition: none;
	font-weight: normal;
	padding:8px;
	border:0;
	cursor:pointer;
	height:auto;
}
.form:not(.edit-layout-form) .control-group .control-label {
	@include label;
}
.form .control-group.error {
	.control-label {
		color:var(--functional-red);
	}
	.required {
		font-weight:500;
		padding:8px 8px 8px 24px;
		position:relative;
		&:before {
			position:absolute;
			top:8px;
			left:0;
			background:var(--functional-red);
			height:16px;
			width:16px;
			color:var(--base-0);
			content:"i";
			text-align:center;
			display:block;
			border-radius:16px;
			font-size:12px;
			line-height:17px;
		}
	}
}
.login-content .form .control-group.input-checkbox-wrapper {
	.field {
		display:none;
	}
	.checkbox {
		position:relative;
		padding:4px 4px 4px 44px;
		cursor:pointer;
		color: var(--text-90);
		font-size:14px;
		line-height:24px;

		&:before {
			position:absolute;
			top:0;
			left:0;
			height:16px;
			width:32px;
			margin:5px;
			background:var(--highlight-10);
			border-radius:16px;
			content:"";
			display:block;

		}
		&:after {
			position:absolute;
			top:0;
			left:0;
			height:16px;
			width:16px;
			margin:5px;
			background:var(--text-55);
			border-radius:16px;
			content:"";
			display:block;
			transition: .2s all ease-in-out;
		}
		&.active:after {
			position:absolute;
			top:0;
			left:16px;
			background:var(--primary-color);
			border-radius:16px;
		}
	}
}
.login-content .form .control-group.input-checkbox-wrapper .field:checked + .checkbox:after {
	position:absolute;
	top:0;
	left:16px;
	background:var(--primary-color);
	border-radius:16px;
}
/*LOGIN*/
html, body {
	margin:0;
	padding:0;
	height:100%;
	min-height:100%;
}
body * {
	box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.hidden {
	display:none;
}
.columnContainer {
	display:flex;
	height:100%;
	width:100%;
	overflow:hidden;
	.column-50 {
		width:50%;
	}
}
.login-content {
	overflow:auto;
	padding:16px;
	display:flex;
	justify-content:flex-start;
	flex-direction: column;
	align-items:center;
	flex-wrap:nowrap;
	position:relative;
	background:var(--base-2);
	.progress-card {
		position:relative;
	}
	.site-title,
	.rightContainer {
		margin: 10px 0;
	}
	.rightContainer {
		text-align:right;
	}
	header {
	    width: 100%;
	    padding:16px 16px 80px 16px;
    }
    #main-content {
		width: 100%;
		max-width: 450px;
	}
	.portalname {
		font-family: Bree-SH-Headline;
		line-height:24px;
		font-size:28px;
		margin-top:0;
		text-align:center;
	}
	.progress-bar {
    	display: block;
    	height: 8px;
    	border-radius: 8px;
    	margin-bottom:20px;
    	background:var(--base-1);
    	.progress {
    		height:8px;
    		border-radius:8px;
    		background:var(--primary-color);
    	}
    }
    > div {
    	width: 100%;
    	max-width: 450px;
    }
}
@media screen and (max-width: 1400px) {
	.image-column {
		background-size:cover;
	}
}
@media screen and (max-width: 1024px) {
	.columnContainer {
		.login-content {
			width:100%;
			display:flex;
		}
	}
	.image-column {
		display:none;
	}
	.login-content header {
    	padding: 0 0 32px 0;
    }
}

@media screen and (max-width: 420px) {
	.site-title,
	.rightContainer {
		width: 50%;
		img {
			max-width:100%;
			height:auto;
		}
	}
	.site-title {
		padding-right: 5px;
	}
	.rightContainer {
		padding-left: 5px;
	}
}


.portlet-login {
	span#_58_passwordCapsLockSpan {
		border:1px solid var(--functional-yellow);
		border-left:26px solid var(--functional-yellow);
		/*color:var(--functional-red);*/
		padding:8px;
		margin:16px 16px 8px 16px;
		position:relative;
		border-radius:2px;
		font-size:14px;
		line-height:24px;
		background:var(--base-0);
		display:block;
		&:before {
			content: "i";
			font-size: 11px;
			font-weight: bold;
			color: var(--base-0);
			border: 2px solid var(--base-0);
			border-radius: 20px;
			display: block;
			position: absolute;
			top: 11px;
			left: -22px;
			height: 15px;
			width: 15px;
			text-align: center;
			line-height: 15px;
		}
	}
	&:after {
		display: block;
	    content: "";
	    clear: both;
	}
	.form {
		.fieldset {
			padding:16px 16px 0;
		}
		.button-holder {
			padding:16px 22px;
			margin:0;
		}
	}
	/*.portlet-content,
	.portlet-body{
		background: var(--base-3);
		box-shadow: 1px 2px 1px var(--shadow-strong),-1px -1px 1px var(--shadow-light);
		width: 100%;
		height: fit-content;
		display: flex;
		flex-direction: column;
		border-radius: 2px;
	}*/
	.btn-primary:hover,
	.btn-primary:focus {
		background-color: var(--primary-2);
	}
}

.portlet-login .btn-primary,
.portlet-login .btn-primary:hover,
.portlet-login .btn-primary:focus,
#portlet_new-password .btn-primary,
.btn-primary,
.btn-primary:hover,
.btn-primary:focus {
	@include button(100%);
	background: var(--primary-color);
	color:var(--color-button);
	max-width:160px;
	display:inline-block;
}
.login-content .btn-primary,
.login-content .btn-primary:hover,
.login-content .btn-primary:focus {
	max-width:100%;
}
.login-content .customLoadingMask > .loadingText {
    display: block;
    z-index: 100;
    position: absolute;
    top: 0;
    font-weight: bold;
    width: calc(100% - 32px);
}
.alert-error,
.popup-alert-notice {
	border:1px solid var(--functional-red);
	border-left:26px solid var(--functional-red);
	padding:8px;
	margin:16px 16px 8px 16px;
	position:relative;
	border-radius:2px;
	font-size:14px;
	line-height:24px;
	background:var(--base-0);
	box-sizing:border-box;
	&:before {
		content: "!";
		font-size: 12px;
		font-weight: bold;
		color: white;
		border: 2px solid white;
		border-radius: 20px;
		display: block;
		position: absolute;
		top: 12px;
		left: -22px;
		height: 19px;
		width: 19px;
		text-align: center;
		line-height: 18px;
		box-sizing:border-box;
	}
}
.alert-info {
	border:1px solid var(--functional-yellow);
	border-left:26px solid var(--functional-yellow);
	padding:8px;
	margin:16px 16px 8px 16px;
	position:relative;
	border-radius:2px;
	font-size:14px;
	line-height:24px;
	background:var(--base-0);
	box-sizing:border-box;
	&:before {
		content: "i";
		font-size: 12px;
		font-weight: bold;
		color: white;
		border: 2px solid white;
		border-radius: 20px;
		display: block;
		position: absolute;
		top: 12px;
		left: -22px;
		height: 19px;
		width: 19px;
		text-align: center;
		line-height: 18px;
		box-sizing:border-box;
	}
}
.alert-valid {
	border:1px solid var(--functional-green);
	border-left:26px solid var(--functional-green);
	padding:8px;
	margin:16px 16px 8px 16px;
	position:relative;
	border-radius:2px;
	font-size:14px;
	line-height:24px;
	background:var(--base-0);
	box-sizing:border-box;
	&:before {
		content: "i";
		font-size: 12px;
		font-weight: bold;
		color: white;
		border: 2px solid white;
		border-radius: 20px;
		display: block;
		position: absolute;
		top: 12px;
		left: -22px;
		height: 19px;
		width: 19px;
		text-align: center;
		line-height: 18px;
		box-sizing:border-box;
	}
}
.alert-message {
	border:1px solid var(--highlight-20);
	border-left:26px solid var(--highlight-20);
	padding:8px;
	margin:16px 16px 8px 16px;
	position:relative;
	border-radius:2px;
	font-size:14px;
	line-height:24px;
	background:var(--base-0);
	box-sizing:border-box;
	&:before {
		content: "i";
		font-size: 12px;
		font-weight: bold;
		color: white;
		border: 2px solid white;
		border-radius: 20px;
		display: block;
		position: absolute;
		top: 12px;
		left: -22px;
		height: 19px;
		width: 19px;
		text-align: center;
		line-height: 18px;
		box-sizing:border-box;
	}
}

/* Navigation */
div.menu__toggle__container {
	width:50px;
}
#menu__toggle {
  opacity: 0;
}
#menu__toggle:checked + .menu__btn > span {
  transform: rotate(45deg);
}
#menu__toggle:checked + .menu__btn > span::before {
  top: 0;
  transform: rotate(0deg);
}
#menu__toggle:checked + .menu__btn > span::after {
  top: 0;
  transform: rotate(90deg);
}
#menu__toggle:checked + .menu__box {
  left: 0 !important;
}
.menu__btn {
  position: fixed;
  top: 35px;
  left: 20px;
  width: 26px;
  height: 26px;
  cursor: pointer;
  z-index: 1;
}
.menu__btn > span,
.menu__btn > span::before,
.menu__btn > span::after {
  display: block;
  position: absolute;
  width: 100%;
  height: 2px;
  background-color: #616161;
  transition-duration: .25s;
}
.menu__btn > span::before {
  content: '';
  top: -8px;
}
.menu__btn > span::after {
  content: '';
  top: 8px;
}

.menu__box {
  display: block;
  position: fixed;
  top: 0;
  left: -100% !important;
  height: 100%;
  margin: 0;
  box-shadow: 2px 2px 6px rgba(0, 0, 0, .4);
  transition-duration: .25s;
}


@media screen and (max-width: 768px) {
	div.bottom_navigation {
		display: flex !important;
	}

	body.bottom_navi #content {
		height: calc(100% - 80px) !important;
	}


	body.bottom_navi .mobile-menu.visible .main-nav li:not(#appSettings) a:not([href="/c/portal/logout"]):not(#navHelpNavbarBtnMobile):not([href$="account-settings"]) {
		display:none;
	}

	body.bottom_navi #heading {
		margin: 0px 12px;
	}

}

.left_login_element {
	padding-left: 40px;
	padding-right: 40px;
	min-width: 500px;
}
.right_login_element {
    flex: auto;

}
.cms {
	padding: 40px;
    overflow-y: auto;
}

.cms h1 {
	font-family: Bree-SH-Headline;
    line-height: 24px;
    font-size: 28px;
}

.cms h2 {
	font-family: 'Calibri', sans-serif;
    line-height: 16px;
	font-weight: bold;
    font-size: 16px;
}

.slick-prev:before, .slick-next:before { color:var(--text-90) !important;}

@media screen and (max-width: 1024px) {
	.left_login_element {
		padding-left: auto;
		padding-right: auto;
	}
	.right_login_element {
		display: none;
	}
	.columnContainer .login-content {
		min-width: 200px;
	}
}

div.bottom_navigation {
	display:none;
	position:fixed;
	bottom:0;
	left:0;
	right:0;
	z-index:1000;
    flex-direction: row;
    width: 100%;
    margin: auto;
    padding: 5px 10px;
    box-shadow: -5px 5px 20px rgba(0,0,0,0.3);
	background-color:var(--base-2);
}

div.bottom_navigation .nav-item {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: center;
    flex-grow: 2;
    padding: 5px;
	color:var(--text-70) !important;
}
div.bottom_navigation .nav-text {
    text-align: center;
	    font-family: 'Calibri', sans-serif;
}

div.bottom_navigation .nav-item.selected {
    flex-grow: 3;
	color:var(--primary-color) !important;
}


#navigation.dd {
	width:0px !important;
}

#navigation.dd .gn-menu>li>.gn-submenu, #navigation.dd .gn-menu>li>.gn-submenu {
	left:0px !important;
	width: 100% !important;
}

#navigation.dd + #wrapper {
    padding-left:0px !important;
}
@media screen and (min-width: 768px) {
	#navigation.wt {
		width:172px !important;
	}

	#navigation.wt .gn-menu>li>.gn-submenu, #navigation.wt .gn-menu-wt>li>.gn-submenu {
		left:172px;
	}
	#navigation.wt + #wrapper {
		padding-left: 172px;
	}


	#navigation.wt .gn-menu>li, #navigation.wt .gn-menu-wt>li {
		width:172px !important;
	}
}
#navigation.wt .gn-menu>li>a>span, #navigation.wt .gn-menu-wt>li>a>span {
	padding-left:8px;
	text-align: left;
	font-size: 14px;
    padding-top: 5px;
    font-weight: bold;
}

#navigation.wt:not(.showNavTitle) .gn-icon .gn-icons-text {
	display: block !important;
}

#navigation.wt .gn-menu>li a, #navigation.wt .gn-menu-wt>li a {
	display: flex;
    justify-content: center;
    position: relative;
    flex-direction: row;
    align-items: center;
}

#navigation {
	position: fixed;
	top: 72px;
	left: 0;
	height: calc(100vh - 72px) !important;
	width: 72px;
	display:block;
	z-index:100;
	background:var(--base-4);
	/* Show Title only if custom condition is selected */
	&:not(.showNavTitle) .gn-icon .gn-icons-text {
		display:none;
	}
	&.showNavTitle,
	&.showNavTitle .gn-menu > li {
		width:82px;
	}
	&.showNavTitle .gn-icon img {
		max-width:35px;
	}
	&.showNavTitle .gn-menu > li > .gn-submenu {
		left: 82px;
		width: calc(100% - 82px);
	}
	.gn-icon .gn-icons-text {
		font-size:12px;
		padding-top:5px;
	}
	ul,
	li {
		list-style-type:none;
		padding:0;
		margin:0;
	}
	.gn-menu-main > li {
		> a {
			display:none;
		}
	}


	#nav_pager_down.inactive,
	#nav_pager_up.inactive {
		    color: var(--base-3);
	}

	#nav_pager_down.inactive a:hover,
	#nav_pager_up.inactive a:hover{
	    background: transparent;
	}

	#nav_pager_up {
		position: absolute;
		top:0px;
		left:0px;
		z-index:999;
		display: none;
	}

	#nav_pager_down {
		position: absolute;
		bottom:0px;
		left:0px;
		z-index:999;
		display: none;
	}
	.haveHiddeFields {
	}
	.haveHiddeFields>ul {
	}

	.haveHiddeFields #nav_pager_down,
	.haveHiddeFields #nav_pager_up {
	}
	.gn-menu > li,
	.gn-menu-wt > li	{
		width:72px;
		/*height:72px; */
		text-overflow: ellipsis;
		/*display:flex;*/
		opacity:0;
		color:var(--base-0);
		/*align-items:stretch; */
		/*justify-content:center; */
		border-bottom:1px solid var(--divider);
		&.selected {
			border-bottom:0;
		}
		a {
			color:var(--base-5);
			text-decoration:none;
			padding:8px;
			display:flex;
			justify-content:center;
			align-items:center;
			position:relative;
			flex-direction:column;
		}
		li a {
			padding:8px 36px;

		}
		> a {
			text-align:center;
			width:100%;
			> span {
				display:block;
				max-width:100%;
				width:100%;
				overflow:hidden;
				text-overflow:ellipsis;
			}
			img {
				display: inline-block;
				max-height: 100%;
			}
			&:hover,
			&:active,
			&:focus {
				background:var(--secondary-color);
			}

		}
		&.selected > a {
			color:var(--primary-color);
			text-decoration:none;
			background:var(--base-0);
			position:relative;
			&:before {
				position:absolute;
				top:21px;
				left:0;
				right:0;
				margin:auto;
				display:block;
				content:"";
			}
			img {
				background:var(--highlight-20);
			}
		}
		> .gn-submenu {
			display:flex;
			align-items:center;
			width:calc( 100% - 72px );
			position:fixed;
			top:-72px;
			left:72px;
			height:56px;
			box-shadow: 0 2px 4px var(--shadow-strong);
			text-overflow:ellipsis;
			z-index:-1;
			background:var(--base-2);
		}
		&.selected.haschild > .gn-submenu {
			top:72px;
			 a {
				color:var(--text-55);
				font-weight:700;
			}
		}
		> .gn-submenu {
			.selected a,
			a:hover,
			a:active,
			a:focus {
				color:var(--text-90);
			}

			a:hover:after {
				position:absolute;
				bottom:0;
				left:0;
				right:0;
				margin:auto;
				height:3px;
				width:75%;
				display:block;
				content:"";
				background:var(--secondary-color);
			}

			.selected #navHelpNavbarBtn:after,
			#navHelpNavbarBtn:hover:after,
			#navHelpNavbarBtn:active:after,
			#navHelpNavbarBtn:focus:after {
				background:none;
			}

			#navHelpNavbarBtn .ehealthicon-help.icon:hover {
				color: var(--primary-color);
				cursor: pointer;
			}

			#navHelpNavbarBtn {
				font-size: 32px;
			}

			.selected a:after,
			a:hover:after,
			a:active:after,
			a:focus:after {
				position:absolute;
				bottom:0;
				left:0;
				right:0;
				margin:auto;
				height:3px;
				width:75%;
				display:block;
				content:"";
				background:var(--primary-color);
			}

		}
		.gn-submenu,
		.gn-submenu li {
			min-width:72px;
			display:flex;
			align-items:stretch;
			a {
				display:flex;
				align-items:center;
			}
		}
		.gn-menu > li {

			ul,
			li {
				list-style-type:none;
				padding:0;
				margin:0;
			}
		}

	}
}
#navigation {
	> ul,
	> ul > li,
	> ul > li > nav,
	> ul > li > nav > div,
	> ul > li > nav > div > ul {
		height:100%;
	}
	.gn-menu {
		display:flex;
		flex-direction:column;
		overflow-y: auto;
		overflow-x: hidden;
	}
	.gn-menu-tooltip {
		background:var(--base-0);
		z-index: 1000;
		position: absolute;
		left:82px;
		color:var(--text-90);
		padding: 8px;
		box-shadow: 5px 2px 5px 0px var(--text-20);
		text-overflow:inherit;
		width:auto;
		max-width:none;
		overflow:visible;
		font-size:16px;
		white-space: nowrap;
		&:before {
			border-right: 5px solid var(--base-0);
			border-top: 5px solid transparent;
			border-bottom: 5px solid transparent;
			height: 0;
			width: 0;
			display: block;
			content: "";
			position: absolute;
			margin: 0;
			top: 12px;
			left: -5px;
		}
	}
}
#additionalNaviContent {
	display: flex;
    justify-content: flex-start;
    flex: 1 1 auto;
    height:100%;
    align-items:stretch;
    overflow-x:auto;
    overflow-y:hidden;
}
@media screen and (max-width: 1200px) {
	#additionalNaviContent > div {
		flex: none;
		order:2;
	}
	#additionalNaviContent #startPatientSearchButton,
	#additionalNaviContent > div.selected {
		order: 1;
	}
}
#additionalNaviContentRight {
	display: flex;
    justify-content: flex-start;
    height:100%;
    align-items:stretch;
    .x-button {
    	padding: 0;
    	min-width:52px;
    }
	button {
		margin: 0 8px;
	}
	button div.icon {
		font-size: 34px;
		margin-bottom: 5px;
		color: var(--text-55);
	}
	button:hover div.icon {
		color: var(--primary-color);
	}
}
.dockbar-icon #additionalNaviContent  .x-icon-el:before,
#additionalNaviContent .dockbar-icon .x-icon-el:before {
	font-size:30px!important;
	line-height:30px!important;
}
/* AdminItems - Edit, Preview,... */

#editLayoutPanelSidebar,
#addPanelSidebar {
	z-index: 1001;
	background: var(--base-0);
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	padding:16px;
	width:440px;
	box-shadow: 0 2px 4px var(--shadow-strong);
}
#editLayoutPanelSidebar,
#previewPanelSidebar,
#addPanelSidebar {
	h1 {
		font-weight:lighter;
	}
	.btn.close {
		font-weight: bold;
		font-size: 32px;
		border: none;
		background: transparent;
		line-height: 38px;
	}
	ul,
	li {
		list-style-type:none;
		padding:0;
		margin:0;
	}
	#_145_layoutsNav,
	.nav-pills {
		display:flex;
		align-items:center;
		justify-content:space-between;
		background:var(--highlight-5);
		padding:16px;
		margin-bottom:16px;
		a {
			color:var(--primary-color);
			&:hover {
				text-decoration:none;
			}
		}
		.active a {
			background: var(--primary-color);
			text-align: center;
			width: fit-content;
			line-height: 24px;
			font-size: 14px;
			font-weight:600;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			text-transform: capitalize;
			border-radius:32px;
			border:0;
			width:100%;
			color:var(--base-0);
			padding:8px;
			cursor:pointer;
			max-width:160px;
			display:inline-block;
			text-align:center;
		}
	}
	#_145_layoutsNav a {
		color:var(--text-55);
		display:flex;
		font-size:14px;
		align-items:center;
		&:hover,
		&:active {
			color:var(--primary-color);
			text-decoration:none;
		}
		i:before {
			@include icon("\E897",18px,block,18px);
		}
		.icon-lock:before {
			content:"\E897";
		}
		.icon-remove:before {
			content:"\E872";
		}
		.icon-list-alt:before {
			content:"\E896";
		}
	}
	.control-label {
		width: 100%;
		display: block;
		font-weight: bold;
		position: relative;
		top: 0;
		left: 0;
		padding: 8px;
	}
}

#editLayoutPanelSidebar {
	.edit-layout-form {
		max-height: calc( 100vh - 214px );
		overflow: auto;
		fieldset {
			padding:16px;
			margin:0 0 16px;
			background:var(--highlight-5);
			border:0;
		}
	}
	.site-admin-link {
		color:var(--primary-color);
		&:hover {
			text-decoration:none;
		}
	}
	.fieldset > div > .control-group {
		margin-bottom:16px;
	}
}


#editLayoutPanelSidebar .lfr-input-text,
.language-value {
	padding:8px;
	width:100%;
}
#editLayoutPanelSidebar,
#addPanelSidebar {
	.lfr-input-text.focus {
		color:var(--primary-color);
	}
	.input-localized .palette-item-inner,
	.input-localized-content .palette-item-inner {
		position:relative;
	}
	.input-localized-content {
		margin-top:10px;
	}
	.input-localized .palette-item-selected .lfr-input-localized-state,
	.input-localized-content .palette-item-selected .lfr-input-localized-state {
		position: absolute;
		top: -5px;
		left: -7px;
		height: 15px;
		width: 20px;
		z-index: -1;
	}
	label.checkbox {
		display:flex;
		align-items:center;
		position:relative;
		.field {
			width:auto;
		}
	}
	label > .taglib-icon-help {
		position:relative;
	}
	.taglib-icon-help img + span {
		display: none;
		position: absolute;
		top: 150%;
		right: -16px;
		background: var(--base-0);
		padding: 8px;
		font-size: 12px;
		box-shadow: 0 2px 4px var(--highlight-5);
		min-width:100px;
		z-index:2;
	}
	label .taglib-icon-help {
		img + span:before {
			border-bottom: 10px solid var(--base-0);
			border-left: 10px solid transparent;
			border-right: 10px solid transparent;
			height: 0;
			width: 0;
			display: block;
			content: "";
			position: absolute;
			top: -10px;
			right: 16px;
		}
		img:hover + span {
			display:block;
		}
	}
	.radio {
		display:flex;
		align-items:center;
		justify-content:flex-start;
		.field {
			width:auto;
		}
	}
}
#editLayoutPanelSidebar {
	.lfr-inherit-theme-options {
		padding:8px;
	}
	.lfr-current-theme legend,
	.lfr-theme-options legend {
		font-weight: lighter;
		font-size: 20px;
		padding-bottom: 16px;
	}
	.lfr-current-theme legend + div{
		display:flex;
		justify-content:space-between;
		align-items:flex-start;
	}
	.lfr-current-theme .theme-title {
		color:var(--primary-color);
		font-size:12px;
	}
	.lfr-current-theme .theme-fields {
		margin:8px 0;
		dt {
			font-size:12px;
		}
		dd {
			font-size:14px;
			color:var(--text-55);
		}
	}
	.btn-toolbar {
		display:flex;
	}
	.btn-toolbar .field,
	#_145_addPageFm .field {
		padding:8px;
	}
	.btn-toolbar .btn-group {
		display:flex;
	}
}
#addPanelSidebar li.lfr-content-item {
	color:var(--primary-color);
	padding:0 8px;
	font-size:14px;
}
.accordion {
	margin:0;
	.accordion-group .accordion-heading {
		background: var(--base-0);
		padding: 8px 16px;
		box-shadow: 0 2px 4px var(--highlight-5);
		margin-bottom: 8px;
		position:relative;
		&:after {
			@include icon("\E315",28px,block,35px);
			position: absolute;
			top: 0;
			right: 0;
		}
		&.toggler-header-expanded {
			color:var(--primary-color);
			&:after {
				content: "\E313";
			}
		}
	}
}
.icon-th-large:before,
.icon-stop:before,
.icon-th-list:before,
.icon-list:before,
.icon-file:before {
	@include icon("\E8F0",26px,inline-block,26px);
}
.icon-th-large:before {
	content:"\E8F0";
}
.icon-stop:before {
	content:"\E047";
}
.icon-list:before {
	content:"\E896";
}
.icon-th-list:before {
	content:"\E8EF";
}
.icon-file:before {
	content:"\E24D";
}
.lfr-content-item {
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.lfr-add-panel .add-content-menu .lfr-content-item {
	.drag-content-item {
		display:flex;
		justify-content:flex-start;
		align-items:center;
	}
	.add-content-item{
		position:relative;
	}
}

#addApplicationPanelContainer {
	background:var(--highlight-5);
	padding:6px;
	overflow:auto;
	max-height:calc( 100vh - 450px );
}

.lfr-add-apps-legend span {
	display:flex;
	align-items:center;
}
#_145_addPageFm {
	.fieldset {
		border:0;
		padding:0;
		margin:0;
	}
	.input-container {
		max-height: calc( 100vh - 265px );
		overflow: auto;
		border:none;
	}
}
#addLayoutSubmit {
	@include button(auto);
	background: var(--primary-color);
	color:var(--base-0);
	padding:8px 16px;
	max-width:160px;
	display:inline-block;
}
#_145_cancelAddOperation {
	border: 1px solid var(--primary-color);
	text-align: center;
	width: fit-content;
	line-height: 24px;
	font-size: 14px;
	font-weight:600;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-transform: capitalize;
	border-radius:32px;
	color:var(--primary-color);
	padding:8px 16px;
	cursor:pointer;
	max-width:160px;
	display:inline-block;
	text-align:center;
	background:var(--base-0);
}
.icon-minus,
.icon-folder-open,
.icon-check,
.icon-folder-close {
	font-family: 'fontawesome-alloy';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
}
.lfr-edit-layout-panel .taglib-form-navigator .button-holder,
.lfr-add-panel .add-content-menu .lfr-add-page-toolbar {
	background:var(--base-0);
}
.lfr-add-panel .add-content-menu .lfr-page-template:hover {
	background: var(--highlight-10);
}

/*CSSLOADER*/
.sk-fading-circle:before {
    content: '';
    width: 16px;
    border-radius: 50%;
    height: 16px;
    display: block;
    background: var(--primary-color);
    top: 12px;
    left: 12px;
    position: relative;
}
.sk-fading-circle .sk-circle {
	display:none!important;
}

/* CONTROL PANEL */
.panel-manage-frontpage {

}
.panel-manage-frontpage .control-panel-home-menu {
	.row-fluid,
	.control-panel-home-actions {
		display:flex;
		flex-wrap:wrap;
		align-items:flex-start;
		justify-content: flex-start;
	}
	.row-fluid .span3 {
		padding:16px;
		width:25%;
	}
}

.control-panel-layout .dockbarbodyContent {
	position:absolute;
	top:0;
	left:0;
	right:auto;
	background:var(--base-0);
	height: 72px;
	display:flex;
	align-items:center;
	justify-content:flex-start;
	a {
		color:var(--text-90);
		&:hover {
			color:var(--primary-color);
			text-decoration:none;
		}
	}
	.brand {
		display:flex;
		align-items:center;
		justify-content:flex-start;
	}
	.control-panel-back-link {
		position:relative;
		&:hover {
			text-decoration:none;
			.control-panel-back-text {
				transform: scale(1);
				top: 100%;
				clip: unset !important;
				left: 100%;
				background: var(--base-0);
				padding: 3px 6px;
				border-radius: 6px;
				border: 1px solid var(--highlight-10);
			}
		}
	}
	.control-panel-back-icon:before {
		@include icon('\E5CB',26px,block,26px);
	}
	h1 {
		font-weight:lighter;
		margin:0;
		padding:0;
		display:flex;
	}
	/*.brand + .nav-collapse {
		display:flex;
		align-items:center;
		justify-content:flex-start;
		position:relative;
		top:auto;
		right:auto;
		transform:none;
		min-width:auto;
		opacity:1;
		margin:0;
		padding:0;
		.nav-navigation {
			display:flex;
			align-items:center;
			justify-content:flex-start;
			padding:0;
			margin:0;
			li a {
				padding:8px 16px;
				display:flex;
				align-items:center;
				justify-content:center;
			}
		}
	}*/
	#_145_navSiteNavigation {
		i:before {
			@include icon("\E7FD",18px,inline-block,18px);
		}
		.icon-user:before {
			content:"\E7FD";
		}
		.icon-globe:before {
			content:"\E894";
		}
		.icon-th:before {
			content:"\E5C3";
		}
		.icon-cog:before {
			content:"\E8B8";
		}
	}
}

.control-panel-layout {
	header#banner .site-title{
		display:none;
	}
	.hide-accessible {
		display:none;
	}
	.tooltip-content {
		background:var(--base-0);
	}
	.control-panel-home-category-header {
		font-weight:lighter;
		color:var(--primary-color);
	}
	ul {
		list-style-type:none;
		padding:0;
		margin:0;
	}
	.control-panel-home-link a {
		color:var(--text-90);
		padding:8px;
		display:inline-block;
		img {
			padding-right:8px;
		}
	}
	#content .control-panel-home-link a:hover,
	#content .control-panel-home-link a:hover .taglib-text {
		text-decoration:none;
	}
}
.control-panel-layout .control-panel-home-category-header a,
.control-panel-layout #content-wrapper .control-panel-home-menu .control-panel-home-category-header a:hover {
	color:var(--primary-color);
	text-decoration:none;
}


.taglib-icon-help {
	position:relative;
	.tooltip-text {
		display:none;
	}
	&:hover .tooltip-text {
		display:block;
		position:absolute;
		top:32px;
		left:-100px;
		width: 200px;
		background: var(--base-0);
		padding: 8px;
		z-index:100;
		font-size:12px;
	}
	.tooltip-text:before {
		@include triangle(10px,var(--base-0),0,0,auto);
	}
}

.tooltip-help {
	display:none;
}

.aui.sense #content .pull-right {
	float:none;
	display:flex;
	justify-content:flex-end;
	align-items:center;
}

.table-bordered {
	border-collapse:collapse;
	color:var(--text-90);
}

.table-bordered a {
	color:var(--text-90);
}
.table-bordered td,
.table-bordered th {
	border:1px solid var(--highlight-5);
	padding:8px;
}

.table-bordered th {
	background:var(--base-0);
	color:var(--primary-color);
	font-weight:lighter;
}
.table-bordered th a {
	color:var(--primary-color);
}

.table-bordered tr:nth-of-type(even) td {
	background:var(--highlight-5);
}


.taglib-search-toggle-advanced {
	background:var(--base-0);
	padding:8px;
	position:relative;
	display:none;
}
.yui3-widget-bd .dropdown-menu {
	background:var(--base-0);
	padding:8px;
}
.yui3-widget-bd .dropdown-menu {
	box-shadow: 0 2px 4px var(--shadow-light);
}
.yui3-widget-bd .dropdown-menu a {
	color:var(--primary-color);
}
.taglib-search-toggle-advanced:before {
	position:absolute;
	top:-10px;
	left:0;
	right:0;
	margin:auto;
	height:0;
	width:0;
	border-bottom: 10px solid var(--base-0);
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	content:"";
}
.taglib-page-iterator .lfr-pagination-config .lfr-pagination-delta-selector,
.taglib-page-iterator .lfr-pagination-config .lfr-pagination-page-selector{
	margin:4px 0;
	display:block;
}
.taglib-page-iterator .lfr-pagination-buttons {
	display:flex;
}
.lfr-pagination-buttons a {
	color: var(--primary-color);
	text-align: center;
	line-height: 18px;
	font-size: 14px;
	font-weight:600;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-transform: capitalize;
	border-radius:32px;
	border:0;
	background:var(--base-0);
	padding:8px;
	cursor:pointer;
	display:flex;
	justify-content:center;
	align-items:center;
	text-align:center;
	margin:0 16px;
	min-width:50px;
}
.lfr-pagination-buttons a:hover {
	text-decoration:none;
}
.lfr-pagination-buttons .disabled a {
	color: var(--text-55);
	background:var(--highlight-5);
}
.lfr-icon-menu .dropdown-toggle + .dropdown-menu {
	display:none;
}
.panel-page-body .site-title {
	font-weight:lighter;
	margin-top:0;
}
.panel-page-body .site-title a {
	color:var(--primary-color);
}
.panel-page-body .site-title a:hover {
	text-decoration:none;
}
#controlPanelSiteHeading .control-panel-back-icon:before {
	@include icon("\E14A",18px,inline-block,18px);
	color:var(--primary-color);
}
.visit-links {
	font-size:12px;
	line-height:14px;
	a {
		color:var(--primary-color);
		&:hover {
			text-decoration:none!important;
		}
	}
}
.license-form .btn {
	@include button(auto);
	background:var(--primary-color);
	color:var(--color-button);
}
.panel-manage-frontpage .row-fluid {
	display:flex;
	.panel-page-menu {
		width:300px;
		a {
			padding:8px;
			color:var(--primary-color);
			display:inline-block;
			img {
				padding-right:8px;
			}
		}
		.search-panels {
			display: flex;
			justify-content: center;
			align-items: center;
			padding-bottom: 16px;
		}
	}
	.panel-page-application {
		flex:1;
		.tree-node-content {
			display:flex;
			color:var(--text-55);
			a {
				color:var(--text-55);
				&:hover {
					text-decoration:none;
				}
			}
			&:hover {
				text-decoration:none;
			}
			.icon-minus:before {
				@include icon("\E145",18px,inline-block,18px);
			}
			.icon-plus:before {
				@include icon("\E15B",18px,inline-block,18px);
			}
		}
	}
}
/*.input-radio-wrapper {
	.field {
		display:none;
	}
	.radio {
		position:relative;
		padding:4px 4px 4px 44px;
		cursor:pointer;
		color: var(--text-90);
		font-size:14px;
		line-height:24px;
		&:before {
			position:absolute;
			top:0;
			left:0;
			height:16px;
			width:32px;
			margin:5px;
			background:var(--highlight-10);
			border-radius:16px;
			content:"";
			display:block;
		}
		&:after {
			position:absolute;
			top:0;
			left:0;
			height:16px;
			width:16px;
			margin:5px;
			background:var(--text-55);
			border-radius:16px;
			content:"";
			display:block;
			transition: .2s all ease-in-out;
		}
		&.active:after {
			position:absolute;
			top:0;
			left:16px;
			background:var(--primary-color);
			border-radius:16px;
		}
	}
}*/

.dockbar-messages {
	cursor:pointer;
	&.active {
		.user-notifications {
			display:block;
		}
	}
	.user-notifications {
		display:none;
		position: absolute;
		top: 72px;
		list-style-type: none;
		right: 0;
		background: var(--base-0);
	}
}
.dockbar-user-notifications {
	display:none;
}
.dockbar-icon .x-icon-el {
	height:auto!important;
	width:auto!important;
}
.dockbar-icon .x-icon-el:before {
	font-size:26px!important;
	line-height:26px!important;
}

/* MENU ICONS */
.menu-icon {
	display: inline-block;
  	font-family: "ehealthfont";
  	font-style: normal;
  	font-weight: normal;
  	font-variant: normal;
	line-height: 1;
	text-decoration: inherit;
	text-rendering: optimizeLegibility;
	text-transform: none;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	font-size:36px;
}
.aui {
	#wrapper {
		#content {
			.portlet-borderless-container {
				min-height: 1px;
				padding:8px 16px 0;
			}
		}
	}
	/*.controls-visible {
		#wrapper {
			#content {
				.portlet-borderless-container {
					min-height: 29px;
				}
			}
		}
	}*/
}
.controls-visible .show-controls {
	display:none;
}
.controls-hidden .remove-controls {
	display:none;
}
.aui #wrapper #content .sense-portlet.additionalPadding {
	padding:0 16px;
	overflow:visible;
	> .x-panel {
		margin-top:8px;
	}
}

/* other icons */
.ehealthfont {
	display: inline-block;
  	font-family: "ehealthfont"!important;
  	font-style: normal;
  	font-weight: normal;
  	font-variant: normal;
	line-height: 1;
	text-decoration: inherit;
	text-rendering: optimizeLegibility;
	text-transform: none;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	font-size:18px;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background-color: transparent
}

::-webkit-scrollbar-track {
    box-shadow: inset 0 0 8px 8px transparent;
    border: solid 2px transparent
}

::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 8px 8px var(--text-20);
    border: solid 2px transparent;
    border-radius: 10px;
}
.modal.modal-hidden {
	display:none;
}
body > .modal {
	overflow-y:hidden;
}
.modal {
	background:var(--base-0);
	padding:16px;
	overflow-x:hidden;
	overflow-y:auto;
	box-shadow: 0 0 10px 5px var(--shadow-strong);
	.modal-header {
		display: flex;
		flex-direction: row-reverse;
		justify-content: space-between;
		align-items:center;
		h3 {
			font-weight: 300;
			font-size: 26px;
			margin: 0;
		}
		.close {
			background: none;
			border: none;
			font-size: 32px;
			color: var(--primary-color);
			cursor:pointer;
		}
	}
	.tab-content .tab-pane {
		display:none;
		border:none;
		&.active {
			display:block;
		}
		.control-label {
			position: relative;
			top: 0;
			left: 0;
		}
		.checkbox {
			display:inline-block;
		}
	}
	.nav-tabs {
		margin:0;
		padding:0;
		list-style-type:none;
		display:flex;
		a.tab-label {
			color:var(--text-55);
			background:var(--highlight-5);
			padding: 24px 32px;
			display: block;
			position:relative;
			&:hover {
				text-decoration:none;
			}
			&:hover:after,
			&:focus-visible:after {
				position: absolute;
				bottom: 0;
				left: 0;
				right: 0;
				margin: auto;
				height: 3px;
				width: 75%;
				display: block;
				content: "";
				background: var(--primary-color);
			}
		}
		.active a.tab-label:after {
			position: absolute;
			bottom: 0;
			left: 0;
			right: 0;
			margin: auto;
			height: 3px;
			width: 75%;
			display: block;
			content: "";
			background: var(--primary-color);
		}
	}
}
.yui3-color-picker-popover {
	background:var(--base-0);
	padding:8px;
	max-width:225px;
	border:1px solid var(--highlight-5);
}


/**welcome banner**/
#headerwrap {
	/*position: absolute;*/
	top: 0px;
	left: 50px;
	/*width: calc(100% - 60px);
	width: -moz-calc(100% - 60px);
	width: -webkit-calc(100% - 60px);
	width: -o-calc(100% - 60px);
	width: calc(100% - 60px);*/
	background: var(--base-1);
	padding: 20px 20px;
	color:var(--text-55);
	opacity: 0;
	transition: visibility 0.33s linear , opacity 0.33s linear;
}
#headerwrap.enabled {
	opacity: 1 !important;
}

div#patientWelcome{
	font-size:26px;
	color:var(--text-90);
	/*font-family: 'Merriweather', serif;*/
}
.headerwrapinner{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	max-width: 1635px;
    margin: 0 auto;
    width: 100%;
}


/* TODO: move to right portlet */
.x-panel.listccappointmentsportlet > div > .x-panel-body {
	padding:16px!important;
}
.x-panel.listccappointmentsportlet .x-panel-body .x-grid-row-expander:before {
	content:"\f12a"!important;
	font-family: ehealthfont !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size:18px;
}
.x-panel.listccappointmentsportlet .x-panel-body .x-grid-row-collapsed .x-grid-row-expander:before {
	content:"\f129"!important;
}
.x-panel.listccappointmentsportlet .x-panel-body .appointment-grid table {
	background:rgba(255,255,255,0.5);
}

.aui.sense .patientClass .patient-compare-view input.x-form-field {
	padding-top:10px;
	padding-bottom:0;
}
.aui.sense .patientClass .patient-compare-view .x-toolbar input.x-form-field {
	padding-top:5px;
	padding-bottom:4px;
}

/* CUSTOM LOADING MASK */

@-ms-keyframes spin {
    from { -ms-transform: rotate(0deg); }
    to { -ms-transform: rotate(360deg); }
}
@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    from { transform:rotate(0deg); }
    to { transform:rotate(360deg); }
}
.customLoadingMask:before {
	background: var(--base-2);
    content: "";
    display: block;
    z-index: 10;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity:0.75;
}
@-ms-keyframes spinIE {
	0% {
		border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
    	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
    40% {
    	border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
     	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
	50% {
    	border-right: 6px solid var(--primary-color);
     	border-left: 6px solid var(--primary-color);
     	border-top: 6px solid var(--text-20);
     	border-bottom: 6px solid var(--text-20);
	}
    90% {
    	border-right: 6px solid var(--primary-color);
     	border-left: 6px solid var(--primary-color);
     	border-top: 6px solid var(--text-20);
     	border-bottom: 6px solid var(--text-20);
    }
  	100% {
   		border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
     	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
}
@-moz-keyframes spinIE {
	0% {
		border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
    	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
    40% {
    	border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
     	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
	50% {
    	border-right: 6px solid var(--primary-color);
     	border-left: 6px solid var(--primary-color);
     	border-top: 6px solid var(--text-20);
     	border-bottom: 6px solid var(--text-20);
	}
    90% {
    	border-right: 6px solid var(--primary-color);
     	border-left: 6px solid var(--primary-color);
     	border-top: 6px solid var(--text-20);
     	border-bottom: 6px solid var(--text-20);
    }
  	100% {
   		border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
     	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
}
@-webkit-keyframes spinIE {
	0% {
		border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
    	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
    40% {
    	border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
     	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
	50% {
    	border-right: 6px solid var(--primary-color);
     	border-left: 6px solid var(--primary-color);
     	border-top: 6px solid var(--text-20);
     	border-bottom: 6px solid var(--text-20);
	}
    90% {
    	border-right: 6px solid var(--primary-color);
     	border-left: 6px solid var(--primary-color);
     	border-top: 6px solid var(--text-20);
     	border-bottom: 6px solid var(--text-20);
    }
  	100% {
   		border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
     	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
}
@keyframes spinIE {
	0% {
		border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
    	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
    40% {
    	border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
     	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
	50% {
    	border-right: 6px solid var(--primary-color);
     	border-left: 6px solid var(--primary-color);
     	border-top: 6px solid var(--text-20);
     	border-bottom: 6px solid var(--text-20);
	}
    90% {
    	border-right: 6px solid var(--primary-color);
     	border-left: 6px solid var(--primary-color);
     	border-top: 6px solid var(--text-20);
     	border-bottom: 6px solid var(--text-20);
    }
  	100% {
   		border-top: 6px solid var(--primary-color);
     	border-bottom: 6px solid var(--primary-color);
     	border-right: 6px solid var(--text-20);
     	border-left: 6px solid var(--text-20);
    }
}
.customLoadingMask:after {
	content:"";
    position: absolute;
    top: calc(50% - 15px);
    left: calc(50% - 15px);
    z-index: 11;
    border: 6px solid var(--text-20);
  	border-radius: 50%;
  	width: 30px;
  	height: 30px;
  	border-top:6px solid var(--primary-color);
  	-webkit-animation: spin 1.5s linear infinite;
  	-moz-animation: spin 1.5s linear infinite;
  	-ms-animation: spin 1.5s linear infinite;
  	animation: spin 1.5s linear infinite;
  	font-size:0;
  	line-height:30px;
  	box-sizing:border-box;
}

.x-edge .customLoadingMask:after {
	content:"";
    position: absolute;
    top: calc(50% - 15px);
    left: calc(50% - 15px);
    z-index: 11;
    border: 6px solid var(--text-20);
  	border-radius: 50%;
  	width: 30px;
  	height: 30px;
  	-webkit-animation: spinIE 1s linear infinite;
  	-moz-animation: spinIE 1s linear infinite;
  	-ms-animation: spinIE 1s linear infinite;
  	animation: spinIE 1s linear infinite;
  	font-size:0;
  	line-height:30px;
  	box-sizing:border-box;
}

.secondFactorType option {
	display:none;
	z-index:-1;
 	-moz-appearance: none;
	-webkit-appearance: none;
}
.selectDropdown {
	position: absolute;
    top: calc(100% - 3px);
    left: 4px;
    width: calc(100% - 8px);
    background: var(--base-1);
    z-index: 10;
    border-radius:4px;
    box-shadow: 0px 4px 10px var(--text-20);
    div {
    	padding:8px;
    	cursor: pointer;
    	&:hover,
    	&:focus-visible {
    		background:var(--text-20);
    	}
    }
}
.bold {
	font-weight:bold!important;
}
.otp .app {
	padding-bottom:16px;
}
.x-viewport .x-viewport-body-el > .x-container > .x-body-el > div {
	height:100%;
}
.aui.sense .x-listitem {
	background-color:var(--base-1);
}
.aui.sense .x-list.x-dataview .x-list-item,
.aui.sense .x-list .x-list-outer-ct {
	background-color:var(--base-1);
}
.codeLine-container .codeLine {
	display:inline-block;
	background:var(--secondary-color);
	color:var(--base-0);
	font-weight:bold;
	padding:8px 16px;
}
.center {
	text-align:center;
}

.flex-column {
	display:flex;
	flex-direction:column;
}

/* NEW PASSWORD PORTLET */
#portlet_new-password {
	background: var(--base-1);
    border-radius: 3px;
    margin: 16px;
    box-shadow: 0 2px 4px var(--shadow-strong);
    padding: 16px;
    max-width:550px;
}
#portlet_new-password h1 {
	margin:0;
	font-family:Bree-SH-Headline;
	font-weight:normal;
	font-size:17px;
}
#portlet_new-password .portlet-content {
	padding: 0;
}
#portlet_new-password .alert {
	margin-left:0;
	margin-right:0;
}
#portlet_new-password .fieldset {
	border:0;
	margin:0;
	padding:0;
}
#portlet_new-password .fieldset-legend {
	display:none;
}
#portlet_new-password .button-holder {
	margin-top:10px;
	margin-bottom:0;
	text-align:right;
}
#portlet_new-password .btn-primary {
	margin-top: 10px;
    width: auto;
    padding: 8px 16px;
    display: inline-block;
    font-size: 14px;
    line-height: 14px;
    margin: 4px;
}
.headerIcon {
	color: var(--text-55);
	cursor: pointer;

}
.headerIcon.selected {
	color: var(--text-90);
}
.headerIcon.selected:after {
    content: "";
    display: block;
    background: var(--primary-color);
    height: 3px;
    width: 75%;
    margin: auto;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}
.aui.sense .x-tab.x-button.x-hovered .x-inner-el {
    background:transparent;
}
.aui.sense .x-form-trigger-wrap-default.x-form-trigger-wrap {
	border:1px solid transparent;
}
.aui.sense .x-form-trigger-wrap-default.x-form-trigger-wrap.x-form-trigger-wrap-invalid {
	border: 1px solid var(--functional-red);
}
/* Security Settings Portlet */
.auth-method .big {
	font-size:150%;
}
.auth-img {
	font-size:48px;
	line-height:54px;
	padding-right:16px;
}
.device-img {
	font-size: 30px;
    line-height: 32px;
    padding-right: 16px;
    display:flex;
}
.flex {
	display:flex;
	align-items:center;
}
.flex1 {
	flex:1;
}
.aui.sense .trusted-devices .x-button {
	padding:0;
}
.aui.sense .trusted-devices .x-button .x-icon-el {
	height:18px;
	width:18px;
}
.trusted-devices .x-container {
    border-bottom: 1px solid var(--text-20);
}
.trusted-devices-header {
	border-bottom: 1px solid var(--text-20);
}
.card-layout,
.card-layout.data-item {
	border-radius: 4px;
    box-shadow: 0 0 10px var(--shadow-strong);
    background:var(--base-0);
}
.card-layout .x-paneltitle {
	padding:0;
}
.rec-nr {
	padding:0 8px;
	color:var(--text-55);
}
.rec-code {
	font-size:180%;
	font-weight:bold;
	padding:0 8px;
}
.recovery-codes .x-container {
	border-bottom:1px solid var(--text-20);
}
.recovery-codes > .x-body-el  {
	display:flex;
	flex-wrap:wrap;
	border-top: 1px solid var(--text-20);
    margin-top: 16px;
    max-height:100px;
    flex-direction:column;
}

/* Patient Query Result Portlet */
/*.aui.sense .patient-compare-view div[class*='property-container'] .x-form-cb-checked .x-form-checkbox-default:before,
.aui.sense .currentPatientContainer div[class*='property-container'] .x-form-cb-checked .x-form-checkbox-default:before,
.aui.sense .matching-patients-label div[class*='property-container'] .x-form-cb-checked .x-form-checkbox-default:before {
	content:"\f14e";
	font-family: 'ehealthfont';
	color: var(--text-90);
}
.aui.sense .patient-compare-view div[class*='property-container'] .x-form-checkbox-default:before,
.aui.sense .currentPatientContainer div[class*='property-container'] .x-form-checkbox-default:before,
.aui.sense .matching-patients-label div[class*='property-container'] .x-form-checkbox-default:before {
	content:"\f150";
	font-family: 'ehealthfont';
	color: var(--text-90);
}
.aui.sense .patient-compare-view .x-panel-header-title-default,
.aui.sense .currentPatientContainer .x-panel-header-title-default {
	font-size:14px;
	font-family: 'Calibri';
}*/
.primaryColor.x-action-col-icon {
	color:var(--primary-color)!important;
}

@keyframes rotate {
    0% { transform: rotate(0deg); }
   80% { transform: rotate(0deg); }
   85% { transform: rotate(15deg); }
   95% { transform: rotate(-15deg); }
  100% { transform: rotate(0deg); }
}
@keyframes wiggle {
    0% { transform: translateX(0); }
   80% { transform: translateX(0); }
   85% { transform: translateX(5px); }
   95% { transform: translateX(-5px); }
  100% { transform: translateX(0); }
}
@keyframes zoom {
    0% { transform: scale(1); }
   80% { transform: scale(1); }
   85% { transform: scale(1.25); }
   95% { transform: scale(1.25); }
  100% { transform: scale(1); }
}
.animatedNote {
  display: inline-block;
  animation: rotate 2.5s infinite;
  position:relative;
}
.newNote {
	position: absolute!important;
    bottom: 10px;
    right: 10px;
    font-weight: bold;
    color:var(--primary-color)!important;
}
/* .newNote:after {
	position:absolute;
	bottom:15px;
	right:15px;
	background:var(--secondary-color);
	height:10px;
	width:10px;
	border-radius:10px;
	content:"";
}*/
.animatedNote:hover {
  animation: none;
}


.x-btn.hidden {
	opacity: 0!important;
    height: 0!important;
    overflow: hidden!important;
    padding: 0!important;
}

.x-toolbar-item.x-btn,
.aui.sense .x-body .x-btn-default-small.x-btn,
.aui.sense .x-body .x-btn-default-toolbar-small.x-btn {
	border-radius: 30px;
}

.aui.sense .x-btn-icon-top .x-btn-icon-el {
    font-size: 20px;
    line-height: 30px;
    height: auto;
}

.productiveValueSet {
	border-left:3px solid var(--functional-green);
}
.activeValueSet {
	border-left:3px solid var(--functional-yellow);
}
.inactiveValueSet {
	border-left:3px solid var(--functional-red);
}

.spacerButton {
	opacity:0;
	height:0;
	overflow:hidden;
}

/* Domain Policy Editor */
.aui.sense .x-fieldset.andContainer,
.aui.sense .x-fieldset.orContainer {
	padding:5px 0 5px 10px;
}
.andContainer + .x-container {
	margin-top:-5px!important;
}
.andContainer > legend {
	background:var(--secondary-color);
	border-radius:10px;
	font-size:12px;
	line-height:12px;
	position:absolute;
	top:calc(50% - 12px);
	left:-5px;
	transform:rotate(-90deg);
	padding:3px 6px!important;
	z-index:10;
	text-transform:uppercase;
}
.andContainer > legend.x-fieldset-header-default > .x-fieldset-header-text {
	font-size:12px!important;
	line-height:12px!important;
	color: var(--base-0)!important;
	padding:0!important;
}
.andContainer > .x-fieldset-body {
	border-left:4px solid var(--secondary-color);
	padding-left:16px!important;
}
.orContainer {
	padding-left:10px!important;
}
.orContainer > legend {
	display:none!important;
	background:var(--primary-color);
	border-radius:10px;
	font-size:12px;
	line-height:12px;
	position:absolute;
	top:calc(50% - 22px);
	left: -12px;
	transform:rotate(-90deg);
	padding:3px 6px!important;
	z-index:10;
	text-transform:uppercase;
	width: 50px !important;
    text-align: center !important
}
.orContainer.showLegend > legend {
	display:block!important;

}
.orContainer > legend.x-fieldset-header-default > .x-fieldset-header-text {
	font-size:12px!important;
	line-height:12px!important;
	color: var(--base-0)!important;
	padding:0!important;
	width: 100%!important;
}
.orContainer.showLegend > .x-fieldset-body {
	border-left:4px solid var(--primary-color);
	padding-left:16px!important;
}
.orContainer  .x-btn:not(.simple) {
	text-transform:uppercase;
}
.orContainer .x-btn .moveUp {
	margin-top:-29px;
	line-height:30px;
}
.orContainer .x-btn .moveUp:before {
	line-height:24px;
}
.andContainer .x-btn {
	background:var(--secondary-color)!important;
}
.andContainer + .x-container .x-btn {
	margin-top:-15px!important;
}

.aui.sense .x-panel.noStyling .x-title-text {
	font-family:Calibri,CCandara,Segoe,Arial,sans-serif;
}


.aui.sense .sense-portlet .x-accordion-hd .x-tool-tool-el,
.aui.sense .sense-portlet .x-accordion-hd .x-tool-tool-el {
	color: var(--text-90);
}
.aui.sense .sense-windowmode-HIDDEN {
	display: none;
}
.aui.sense input:-webkit-autofill,
.aui.sense textarea:-webkit-autofill,
.aui.sense select:-webkit-autofill {
	background-color: transparent!important;
}

.aui.sense .x-keyboard-mode .x-tool.x-focused {
	outline: 0px;
}

/* CHANGES FOR HELP PAGE */
.icon-circle-arrow-left:before {
	font-family: ehealthfont !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f12c"!important;
}
.icon-zoom-in:before {
	font-family: ehealthfont !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f199"!important;
}
.icon-circle-arrow-right:before {
	font-family: ehealthfont !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f12d"!important;
}
/* CHROME OVERRIDES */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus-visible,
input:-webkit-autofill:active  {
	-webkit-box-shadow: 0 0 0px 1000px var(--base-1) inset;
	-webkit-text-fill-color: var(--text-90)!important;
	border:1px solid var(--base-0);
}



body.signed-in.private-page .logo img {
	max-height: 33px;
    width: auto;
    max-width: 180px;
    height: auto;
}
@media screen and (max-width: 1024px) {
	body.signed-in.private-page .logo img {
		max-height: 18px;
    	max-width: 70px;
	}
	#banner .dockbarResponsiveButton a.btn-navbar {
	    padding: 0;
    	display: flex;
    	margin: 0
	}
	.dockbarResponsiveButton .user-avatar-image {
    	max-width: 35px;
	}
}
#navAccountControlsNavbarBtn img {
	border: 2px solid var(--text-55);
}

/* PATIENT PORTAL */
.aui.sense #wrapper.patientPortalHeader {
	#content {
		.portlet-column-content {
			padding-bottom:0;
		}
		.flex-container {
			display: flex;
		    padding: 8px;
		    flex-wrap: wrap;
		    .flex-column-item { /* add media query */
		    	width:100%;
		    	@media screen and (min-width: 768px) {
		    		width: 50%;
		    	}
		    	@media screen and (min-width: 1024px) {
		    		width: 33.333%;
		    	}
		    	@media screen and (min-width: 1400px) {
		    		width: 25%;
		    	}
		    	.portlet-borderless-container {
		    		padding:8px;
		    	}
		    }
		}
		.x-panel-body-default {
			background: transparent;
		}
		.x-form-trigger-wrap-default.x-form-trigger-wrap {
			border:1px solid transparent;
			border-radius:3px;
			background-color: var(--highlight-5);
			&.x-form-trigger-wrap-invalid {
				border: 1px solid var(--functional-red);
			}
		}
	}
}


.modern-portlet-area > div > div {
	height:100%;
}

/* Burgermenu */
.dropdown-container {
	top:-100000px;
	position:absolute;
	right:0;
	list-style-type:none;
	padding:0;
	margin:0;
    flex-direction: row;
    width: 750px;
    flex-wrap: wrap;
    &:before {
    	content: '';
	    border-bottom: 10px solid var(--base-1);
	    border-right: 10px solid transparent;
	    border-left: 10px solid transparent;
	    position: absolute;
	    top: -10px;
	    right: 10px;
    }
    &:after {
    	height: 100%;
	    width: 100%;
	    background: var(--base-1);
	    content: "";
	    position: absolute;
	    top: 0;
	    left: 0;
	    z-index: -1;
	    box-shadow: 5px 2px 5px 0px var(--text-20);
    }
}
.embedDropdown .dropdown-container:before {
	right:auto;
	left:10px;
}
.dropdown-container > li > a {
	display:flex;
	flex-direction:column;
}
.dropdown-container.visible {
	display: flex;
	top:92px;
	background: var(--base-1);
	padding:4px;
}
.embedDropdown .dropdown-container.visible {
	top:144px;
}
.dropdown-container.positionLeft {
	right: auto;
	position: fixed;
    left: 16px;
}
.dropdown-container > li,
#navigation .dropdown-container > li{
    width:20%;
    border: 4px solid var(--base-1);
    background: var(--text-20);
}
.dropdown-container > li a,
#navigation .dropdown-container > li a {
	display: flex;
	align-items:center;
	position:relative;
	flex: 1;
	padding:8px;
	background:var(--highlight-5);
	color: var(--base-0);
	height:100%;
    justify-content: center;
    min-height:130px;
}
#dropdown .dropdown-container > li > a,
#navigation #dropdown .dropdown-container > li > a {
	color: var(--text-55);
	font-weight:normal;
}
#dropdown .dropdown-container > li > a:hover,
#dropdown .dropdown-container > li > a:active,
#dropdown .dropdown-container > li > a:focus-visible,
#navigation #dropdown .dropdown-container > li > a:hover,
#navigation #dropdown .dropdown-container > li > a:active,
#navigation #dropdown .dropdown-container > li > a:focus-visible {
	text-decoration:none;
	color: var(--base-0);
	background: var(--secondary-color);
}

#navigation #dropdown .dropdown-container > li > a:after,
#navigation #dropdown .dropdown-container > li > a:hover:after,
#navigation #dropdown .dropdown-container > li > a:focus-visible:after,
#navigation #dropdown .dropdown-container > li > a:active:after {
	display:none;
}
#dropdown .dropdown-container .menu-icon {
	padding:8px;
}
.dropdown-container > li a span {
	font-size:16px;
	text-align:center;
	max-width:100%;
	overflow:hidden;
	text-overflow: ellipsis;
}
#dropdown {
	display:flex;
	justify-content:center;
	align-items:center;
	position:relative;
}
.dropdown-trigger {
	font-size: 26px;
	cursor: pointer;
	height:100%;
	padding: 8px;
	> div {
		height:100%;
		display:flex;
		align-items:center;
		justify-content:center;
	}
}
#dropdown .child-menu {
	display: flex;
    align-items: center;
    width: 100%;
    position: fixed;
    top: 72px;
    /* TODO: top can also be 0, depends on headerbanner */
    left: 0;
    height: 56px;
    padding:0;
    overflow: hidden;
    text-overflow: ellipsis;
    z-index: -1;
    background: var(--base-2);
    list-style-type:none;
    li {
    	position:relative;
    	height:100%;
    }
    a {
        color: var(--text-55);
    	font-weight: 700;
        padding: 8px 36px;
        height:100%;
        span {
        	font-size:14px;
        }
        &:hover,
        &:focus-visible,
        &:active {
        	color: var(--text-55);
        	text-decoration:none;
        }
    }
}

#dropdown .dropdown-container>li.selected a {
    background: var(--base-0);
}

#dropdown .dropdown-container>li.selected,
#dropdown .dropdown-container>li.selected i.menu-icon {
    color: var(--primary-color);
}
#dropdown .dropdown-container>li.selected span.gn-icons-text {
	color: var(--text-90);
}

div.ehealthicon-squared-menu {
	color: var(--text-55);
}

.embedDropdown {
	color: var(--text-90);
}
#navigation.embedNavigation .gn-menu > li li a {
	padding: 8px;
}
/* hide normal menu when burger is on */
.useDropDownMenu #navigation + #wrapper {
	padding-left:0;
}
.useDropDownMenu #navigation {
	left:-72px;
}
.useDropDownMenu #navigation .gn-menu > li > .gn-submenu {
	left: 0;
	width: 100%;
}
.hideDropDownMenu #navigation #dropdown.embedDropdown,
.hideDropDownMenu #dropdown,
.useDropDownMenu #navigation.embedNavigation .child-menu > li.embedNormal {
	display:none;
}





div.loginMask {

	.outline-headline {
		margin-left: 5px;
		margin-right: 5px;
		display: block;
		margin-block-start: 1.33em;
		margin-block-end: 1.33em;
		margin-inline-start: 0px;
		margin-inline-end: 0px;
		font-weight: bold;
		font-size: 14px;
	}

	table tr:last-child td {
		border-bottom-style: solid;
	}
	table {
		margin-left: 5px;
		margin-right: 5px;
		border-collapse: collapse;
		tr {
			td {
				border-color: var(--text-20);
				border-top-style: solid;
				border-collapse: collapse;
				border-width: 1px;
				padding-top: 10px;
				padding-bottom: 10px;

				p,h3,h4 {
					margin-bottom: 0px;
					margin-top: 0px;
				}
			}
			td.idp-icon {
				padding-left:5px;
				padding-right:5px;
			}
		}
	}
}


.sense-autologin-btns  {
	.button-holder {
		padding:16px 22px;
	}

	.btn-icon {
		min-width: 48px;
		min-height: 48px;
		border-radius: 24px;
		background-color: var(--base-0);
		border-style: solid;
		border-width: 0px;
		border-color: var(--text-90);
	}

	.clickable {
		padding: 10px;
		margin: 10px;
		cursor: pointer;

		.idp-icon p.icon-text {
			text-align: center;
			line-height: 48px;
			font-size: 24px;
 			color: var(--text-55);
		}
		.idp-text {
			margin-left: 10px;
			font-weight: bold;

			.idp-desc {
				font-weight: normal;
			}
		}
	}

	.clickable:hover,
	.clickable:focus-visible {
		background-color: var(--base-1);
	}
}


/* responsive version of burger menu */
@media screen and (max-width: 850px) {
	.dropdown-container.visible {
		position: fixed;
    	top: 72px;
    	width: 100%;
    	left: 0;
    	height:auto;
    	max-height:calc( 100% - 72px );
    	overflow:auto;
    	&:after {
    		box-shadow: inset 0px 3px 14px 0px var(--text-20);
		    position: fixed;
		    top: 72px;
		    height: calc(100% - 72px);
    	}
	}
	.embedDropdown .dropdown-container.visible {
		top:129px;
		height: auto;
		max-height:calc( 100% - 129px );
		&:after {
			top: 129px;
		    height: calc(100% - 129px);
		}
	}
}
@media screen and (max-width: 820px) {
	.dropdown-container > li,
	#navigation .dropdown-container > li {
		width:25%;
	}
}

@media screen and (max-width: 668px) {
	.dropdown-container > li,
	#navigation .dropdown-container > li {
		width:33.333%;
	}
}

@media screen and (max-width: 540px) {
	.dropdown-container > li,
	#navigation .dropdown-container > li {
		width:50%;
	}
}

/* responsive for header bar */
@media screen and (max-width: 1024px) {
	#banner .btn-navbar .user,
	#banner .page-title {
		display:none;
	}
}


/* Toolbar Reworking */
.imprint-container {
	display:block;
	height:100%;
	width:100%;
	#render-iframe {
		display:block!important;
		height:100%;
		width:100%;
	}
}
.imprint-container #main-content,
.imprint-container .portlet-layout,
.imprint-container .portlet-column,
.imprint-container .portlet-column-content,
.imprint-container .portlet-borderless-container,
.imprint-container .portlet-borderless.portlet-boundary_SimpleHtmlDisplayPortlet_WAR_SimpleHtmlDisplayPortlet_,
.imprint-container .portlet-boundary_SimpleHtmlDisplayPortlet_WAR_SimpleHtmlDisplayPortlet_ .portlet-body {
	height:100%;
}
.about-page .bigIcon,
.sign-out .bigIcon,
.my-account .bigIcon,
.imprint .bigIcon {
	font-size:24px;
	padding-right:8px;
}
.about-page .bigIcon:before,
.sign-out .bigIcon:before,
.my-account .bigIcon:before,
.imprint .bigIcon:before  {
	font-size:24px;
}
.login-imprint {
	display:flex;
	justify-content: flex-end;
	margin-top:8px;
}
.login-imprint a {
	text-decoration: none;
	color: var(--text-55);
	font-weight: bold;
}
.columnContainer #heading {
	display:flex;
	justify-content: space-between;
	align-items:center;
}
#login-imprint,
#user-panel-imprint,
#mobile-imprint {
	cursor:pointer;
}
.login-imprint.hidden {
	display:none!important;
}
/* Portlet Borderless Bar */
.portlet-borderless-bar {
	display:flex;
	margin-bottom:8px;
}
.portlet-borderless-bar .portlet-title-default {
	display:flex;
	align-items:center;
	color:var(--primary-color);
	background:var(--base-0);
	cursor:pointer;
	padding: 4px;
    border-radius: 20px 0 0 20px;
}
.portlet-borderless-bar .portlet-title-default:before {
	content: '\f1f0';
	font-family: ehealthfont;
	display:inline-block;
	font-size:24px;
	padding-right:8px;

}
.portlet-borderless-bar .portlet-actions {
	display:flex;
}
.portlet-borderless-bar .portlet-action-separator {
	display:none;
}
.portlet-borderless-bar .portlet-options {
	display: flex;
    align-items: stretch;
    margin: 0 2px;
    background: var(--primary-color);
    color: var(--base-0);
}
.portlet-borderless-bar .portlet-options .btn-group .dropdown-toggle {
	color: var(--base-0);
	flex:1 1 auto;
	display: flex;
    align-items: center;
    padding: 4px 8px;
    font-weight:bold;
}
.portlet-borderless-bar .portlet-close.portlet-action {
	display: flex;
    align-items: stretch;
    background: var(--primary-color);
    color: var(--base-0);
    padding: 4px;
    border-radius: 0 20px 20px 0;
}
.portlet-borderless-bar .portlet-action.portlet-close .taglib-icon {
	color: var(--base-0);
	flex:1 1 auto;
	display: flex;
    align-items: center;
    padding: 4px 8px;
    font-weight:bold;
}
.portlet-borderless-bar .portlet-action.portlet-close .taglib-icon:hover,
.portlet-borderless-bar .portlet-action.portlet-close .taglib-icon:focus-visible,
.portlet-borderless-bar .portlet-options .btn-group .dropdown-toggle:hover,
.portlet-borderless-bar .portlet-options .btn-group .dropdown-toggle:focus-visible,
.portlet-borderless-bar .portlet-action.portlet-close .taglib-icon:hover .taglib-text,
.portlet-borderless-bar .portlet-action.portlet-close .taglib-icon:focus-visible .taglib-text {
	color: var(--base-0);
	text-decoration:none;
}
.aui.sense .x-actionsheet.mobile-button-menu {
    max-height: 75%;
    min-height: 50%;
    background: var(--base-0) !important;

    .x-body-wrap-el {

        .x-actionsheet-body-el {
			overflow: auto;
			overscroll-behavior: none;
        }

        .x-button {
            display: table;
            width: 100%;

            .x-inner-el {
                background: transparent;
                color: var(--text-55);
            }

            .x-icon-el {
                min-width: 32px;
                min-height: 24px;
                padding-right: 8px;
            }

            .x-icon-el:before {
                color: var(--text-55);
                font-size: 24px
            }
        }

        .x-button:after {
            content: "";
            display: flex;
            background: var(--highlight-20);
            height: 1px;
            margin: 0 8px;
        }

        .x-button:last-child {
            padding-bottom: 12px;
		}

		.x-button.x-pressing .x-text-el {
		    color: var(--text-55);
		}
    }
}

/* Mobile Menu Styling */
/* Burger */
.mobile-menu-trigger {
	display:none;
    height:21px;
    width: 30px;
    position:relative;
    overflow:hidden;
    cursor: pointer;
    margin: 16px;
	min-width: 30px;
}
.mobile-menu-trigger .burger {
	position:absolute;
    top: 9px;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--text-90);
}
.mobile-menu-trigger .burger:before {
	position:absolute;
    top: -9px;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--text-90);
    content: '';
}
.mobile-menu-trigger .burger:after {
    position:absolute;
    top: 9px;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--text-90);
    content: '';
}
.mobile-menu-trigger.active .burger {
    background:transparent;
}
.mobile-menu-trigger.active .burger:before {
	top:0;
    transform: rotate(42deg);
}
.mobile-menu-trigger.active .burger:after {
    top:0;
    transform: rotate(-42deg);
}
/* menu styling */
.mobile-menu {
	display:none;
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 10;
    top:0;
    left:0;
}
.mobile-menu .overlay {
    width: 100%;
    cursor: pointer;
    background: var(--text-55);
    position:relative;
}
.mobile-menu.visible {
    display:flex;
}
.menu-container {
    background: var(--base-0);
    height:100%;
    width: 20%;
    min-width:300px;
    display:block;
    position:relative;
    z-index: 11;
    overflow: auto;
    padding-top:72px;
}
.mobile-menu .header.expand .header-content{
    display:flex;
    flex-direction: column;
}
.mobile-menu .header-title {
    display: flex;
    padding: 8px;
    align-items: center;
    justify-content: space-between;
    color: var(--text-55);
    position:fixed;
    z-index: 12;
    top: 0;
    left: 0;
    width:20%;
    min-width:300px;
    background: var(--base-0);
    box-shadow: 0px 3px 3px var(--shadow-strong);
}
@media screen and (max-width: 330px) {
	.mobile-menu .header-title {
		min-width:auto;
		width:75%;
	}
	.menu-container {
		min-width:auto;
		width:75%;
		position: fixed;
	}
}
.mobile-menu .header-title .user {
    display:flex;
    align-items: center;
}
.mobile-menu .header-title .user img {
    width:40px;
    height: 40px;
    margin: 8px;
    border-radius: 40px;
}
.mobile-menu .header-title .toggle {
    font-size: 32px;
    padding: 0 8px;
    cursor:pointer;
    display:flex;
}
.mobile-menu .header-title .toggle.active {
    transform: rotate(180deg);
}
.mobile-menu .flex-column {
	display:flex;
    flex-direction: column;
}
.mobile-menu .header-content {
    display:none;
}
.mobile-menu .nav {
    margin: 0px;
    padding: 16px;
    background: var(--base-2);
    list-style-type: none;
    box-shadow: 0 0 3px var(--shadow-strong);
}
.mobile-menu .nav > li {
    display:flex;
    flex-direction: column;
}
.mobile-menu .nav > li.border-bottom {
    border-bottom: 1px solid var(--text-20);
}
.mobile-menu .nav > li.border-top {
    border-top: 1px solid var(--text-20);
}
.mobile-menu .nav a {
    text-decoration:none;
    color: var(--text-90);
    flex: 1 1 auto;
    padding: 8px;
    display:flex;
    align-items: center;
}
.mobile-menu .nav a:hover,
.mobile-menu .nav a:focus-visible {
    color: var(--primary-color);
    text-decoration:none!important;
}
.mobile-menu .bigIcon {
    font-size: 24px;
    padding-right: 8px;
}
.mobile-menu .bigIcon.primaryColor {
    color: var(--primary-color);
}
.mobile-menu .text {
    display:flex;
    flex-direction:column;
}
.mobile-menu .text .small {
    font-size: 11px;
    color: var(--text-55);
}
.mobile-menu .nav-item-label {
    text-transform: uppercase;
    color: var(--text-55);
    font-size: 11px;
    flex: 1 1 auto;
    padding: 8px;
}
.mobile-menu .my-sites-menu {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.mobile-menu .menu-icon {
    font-family: ehealthfont;
    font-size: 32px;
    font-style: normal;
    color: var(--text-55);
    padding-right: 16px;
}
.mobile-menu .selected > a > .menu-icon,
header#banner .mobile-menu .selected > a {
	color: var(--primary-color);
}
header#banner .mobile-menu .main-nav > .selected > a {
	border-bottom: 1px solid var(--primary-color);
}
.mobile-menu .menu-text {
    flex: 1 1 auto;
}
.mobile-menu .main-nav {
    list-style-type: none;
    margin: 32px 0;
    padding: 0;
}
.mobile-menu .main-nav a {
    text-decoration: none;
    display: flex;
    align-items: center;
    padding: 8px;
    flex: 1 1 auto;
    border-bottom: 1px solid var(--base-2);
    color: var(--text-90);
}
.mobile-menu .main-nav a:hover,
.mobile-menu .main-nav a:focus-visible {
    border-bottom: 1px solid var(--primary-color);
    text-decoration:none;
}
.mobile-menu .main-nav a:hover .menu-icon,
.mobile-menu .main-nav a:focus .menu-icon {
    color: var(--primary-color);
}
.mobile-menu .main-nav li {
    display:flex;
    flex-direction:column;
}
.mobile-menu .openSub {
    color: var(--text-55);
    font-size: 24px;
    display:flex;
}
.mobile-menu .openSub.active {
    transform: rotate(180deg);
}
.mobile-menu .sub-nav {
    display:none;
    margin:0;
    padding:0;
    background: var(--base-2);
}
.mobile-menu .sub-nav.expand {
    display:flex;
    flex-direction: column;
}
.mobile-menu .badge {
    padding: 4px;
    border: 2px solid var(--functional-red);
    border-radius: 8px;
    min-width: 15px;
    text-align: center;
 }
 /* HIDE/SHOW */
 @media screen and (max-width: 768px) {
	.mobile-menu-trigger {
		display:block;
	}
	#banner + #navigation,
	.patientPortalHeader #dockbar,
	header#banner .logo,
	header#banner #dropdown,
	#banner .dockbarResponsiveButton a.btn-navbar#navAccountControlsNavbarBtn {
		display:none;
	}
	#navigation + #wrapper,
	#navigation.showSubnavi + #wrapper {
		padding-left: 0;
		padding-top:0;
	}
	#heading {
		overflow: hidden;
	}
	header#banner .site-title {
		font-family: Bree-SH-Headline;
		width: 100%;
	}
	header#banner .site-title .flex-column {
		width:100%;
		overflow:hidden;
		span {
			overflow: hidden;
			text-overflow: ellipsis;
		}
	}
}
/* HIDE/SHOW also if user agent is ehealth-native */
.ehealth-native .mobile-menu-trigger {
		display:block;
	}
#banner.ehealth-native + #navigation,
.patientPortalHeader.ehealth-native #dockbar,
header#banner.ehealth-native .logo,
header#banner.ehealth-native #dropdown {
	display:none;
}
.ehealth-native + #navigation + #wrapper,
.ehealth-native + #navigation.showSubnavi + #wrapper {
	padding-left: 0;
	padding-top:0;
}
header#banner.ehealth-native .site-title {
	font-family: Bree-SH-Headline;
}

/* enlarging ext js datepicker from 220px to 40vh */
.aui.sense .x-sheet.x-picker{
	height: 45vh !important;
}
/* imprint dialog */
#imprint-dialog-container.shown {
	position: fixed;
	z-index: 100001;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 2%;
	background: var(--overlay-color);
}
.dialog-content {
	background: var(--base-0);
	padding: 16px;
	display: flex;
	height: 100%;
	flex-direction: column;
	align-items: stretch;
	box-shadow: 0 0 3px var(--text-55);
	border-radius: 3px;
}
#imprint-dialog-container-inner {
	flex: 1 1 auto;
	height:100%;
	overflow: hidden;
}
#imprint-dialog-container .dialog-icon {
	cursor: pointer;
	padding: 8px;
	align-self: flex-end;
}
@media screen and (max-width: 1024px) {
	.dialog-content {
		padding:8px;
	}
}

/* Set in ReactClassic1Column.tpl */
div.portlet-column.classic-in-react #layout-column_column-1 {
	overflow: auto;
}
.react #main-content div.portlet-column.classic-in-react .portlet-boundary.sense-windowmode-MAXIMIZED {
	flex: 0 0 auto;
}
#content.react #main-content div.portlet-column.classic-in-react .portlet-borderless-container {
	padding: 8px 16px 0;
}

/* Set in ReactModernClassic1Column.tpl */
div.portlet-column.classic-and-modern-in-react #layout-column_column-1 {
	overflow: auto;
}
.react #main-content div.portlet-column.classic-and-modern-in-react .portlet-boundary.sense-windowmode-MAXIMIZED {
	flex: 1 1 auto;
}
#content.react #main-content div.portlet-column.classic-and-modern-in-react .portlet-borderless-container {
	padding: 8px 16px 0;
}

/* Set in ReactVCP1Column.tpl */
.react #main-content div.portlet-column.react-vcp.portlet-row-content {
	display: flex;
	flex-direction: row;
	width: 100%;
	height: 100%;
	overflow: hidden;
	padding-bottom: 0;
}

/* WCAG Theme adoptions */
div.collapse.nav-collapse.open {
	display: block !important;
}

div.collapse.nav-collapse {
	display:none;
}

// adding style for Nav Buttons to display  text to the button
a.btn-navbar.additional {
	display:flex;
	flex-direction:column;
}
a.btn-navbar.additional span{
	color:var(--text-90);
}

// adding wcag 400 percent reflow support
html.wcag_400 body {
    min-width: 400px !important;
    min-height: 500px !important;
    overflow: scroll !important;
}

html.wcag_400 #banner+#navigation+#wrapper,
html.wcag_400 header {
    position: inherit !important;
}

// adding skip link to the theme page
#skip_link {
    background: var(--base-1);
    border-color: var(--text-20);
    border-width: 1px;
    height: 30px;
    left: 50%;
    padding: 8px;
    position: absolute;
    transform: translateY(-100%);
    transition: transform 0.3s;
    z-index: 8888888;
    border-radius: 0px 0px 4px 4px;
    border-bottom-style: solid;
    font-weight: bold;
    border-left-style: solid;
    border-right-style: solid;
}
#skip_link:focus {
  transform: translateY(0%);
}

// tab highlighting
input[type="search"]:focus-visible,
input[type="text"]:focus-visible,
input[type="email"]:focus-visible,
input[type="file"]:focus-visible,
input[type="number"]:focus-visible,
input[type="password"]:focus-visible {
	outline: none !important;
}

[tabindex]:focus-visible {
    outline: 1px solid var(--text-55) !important;
}

x-button div:focus-visible,
x-button div:focus-within , button:focus-visible,.aui.sense .x-keyboard-mode .x-component.x-button.x-focused,.aui.sense .x-keyboard-mode .x-component.x-button.x-focused .x-inner-el .aui.sense .container-fluid .x-component.x-button.x-pressing,.aui.sense .x-keyboard-mode .container-fluid .x-component.x-button.x-focused,.aui.sense .x-keyboard-mode .container-fluid .x-component.x-button.x-focused .x-inner-el {
    outline: 1px solid var(--text-55) !important;
}

.ehs-toggle:focus-within {
    outline-offset: -5px;
    outline: 1px solid var(--text-55) !important;
}


h1 a.logo:focus-visible {
    outline-offset: 5px;
    outline: 1px solid var(--text-55) !important;
}


div#mobile_bottom_submenu {
	position: absolute;
    background-color: var(--base-2);
    bottom: 90px;
    right: 0;
    border-bottom: 1px solid var(--base-4);
	display:hidden;
}
div.bottom_navigation div#mobile_bottom_submenu .nav-item {
    flex-direction: row;
}

div.bottom_navigation .nav-item:focus {
	color:var(--base-0) !important;
	background-color:var(--secondary-color);
}

.mobile div.x-indicator {
    bottom: 50px !important;
}

#mobile_bottom_submenu {
	display:none;
}

#navigation .gn-menu>li>a:focus-visible,
#navigation .gn-menu-wt>li>a:focus-visible {
	outline-offset: -5px;
    outline: 1px solid var(--text-55) !important;
}
#navigation .child-menu.gn-submenu>li>a:focus-visible {
	outline-offset: -5px;
    outline: 1px solid var(--text-55) !important;
}

.aui.sense body[data-colorblind="true"] .ehs-link.button-primary:not(:disabled):not(.disabled),
.aui.sense body[data-colorblind="true"] .ehs-button.button-primary:not(:disabled):not(.disabled) {
	background-color: var(--primary-4) !important;
}

.aui.sense body[data-colorblind="true"] .ehs-link.button-primary:not(:disabled):not(.disabled):focus-visible,
.aui.sense body[data-colorblind="true"] .ehs-button.button-primary:not(:disabled):not(.disabled):focus-visible {
	background-color: var(--primary-4) !important;
}


.dockbarbodyContent .collapse.nav-collapse a,
.dockbarbodyContent .collapse.nav-collapse div[tabindex] {
	display:none !important;
}

.dockbarbodyContent .collapse.nav-collapse.open a,
.dockbarbodyContent .collapse.nav-collapse.open div[tabindex]
{
	display:flex !important;
}

.ehealthicon-upload.dashboard-portlet-Upload-icon:focus-visible {
    outline-width: 3px !important;
    border-color: var(--secondary-hover) !important;
}