/****** CSS ******/

/****** LAYOUT ******/
/* <!-- Layout --> */
/* <!-- Gallery Grid --> */

/****** CONTENT ******/
/* <!-- Typography --> */
/* <!-- Icons --> */

/****** COMPONENTS ******/
/* <!-- Alerts --> */
/* <!-- Buttons --> */
/* <!-- Bootstrap Card Overrides --> */
/* <!-- Input group --> */
/* ---- checkbox - circle ---- */
/* ---- search by slide numbers ---- */
/* <!-- Navbar --> */
/* <!-- Tab group --> */

/****** UTILITIES ******/
/* <!-- Borders --> */
/* <!-- Display --> */
/* <!-- Colors --> */
/* ---- background color ---- */
/* ---- border color ---- */

/****** CUSTOM ******/
/* <!-- Characteristics filter lists panel --> */ 
/* <!-- Diagnosis --> */
/* <!-- Slide Cards --> */
/* ---- long-label ---- */
/* ---- silde action links ---- */
/* ---- column title ---- */


/****** LAYOUT ******/

/* <!-- Layout --> */
#header {
}
#content {
}

#column-middle {
	padding: 0.5rem;
	padding-bottom: 0;
}

@media (min-width: 992px) {
	#column-middle {
		padding: 1rem;
	}
}

#list-diagnosis-selections {
	margin-bottom: 3rem;
}
#controls-panel {
	margin-bottom: 2rem;
}
#charband nav {
	/*margin-bottom: 1rem;*/
}

/* ---- panel UI ---- */
#slides-header
/*,#diagnosis-search-group,
#diagband-options,
#charband-options,
#bologsectbtns,
#textderm4sectbtns,
#slide-numbers-search-form*/ {
	padding: 0 0.5rem 0.25rem;
}



/* ---- search mode ---- */
#search-mode > div:first-child {
	padding: 1rem;
}
#search-mode div:first-child > div {
	margin-right: 1rem;
	margin-left: 0.5rem;
}
@media (min-width: 768px) {
	#search-mode div:first-child > div {
		display: inline-block;
		vertical-align: top;
	}
	#search-mode div:first-child > div:first-child {
		display: block;
	}
}
@media (min-width: 1218px) {
	#search-mode div:first-child > div:first-child {
		display: inline-block;
	}
}


nav .card > div {
	margin-bottom: 0.25rem;
}



/* <!-- Gallery Grid --> */
#gallery-grid {
	display: flex;
}
#gallery-grid.list {
	flex-direction: column;
	align-items: center;
}
#gallery-grid.tile,
#gallery-grid.group {
	flex-flow: row wrap;
	/*justify-content: space-between;
	align-content: flex-start;*/
}
#gallery-grid > div {
	/*flex: 2 0 auto;*/
	position: relative;
}
#footer {
	position: fixed; 
	right: 20px;
	bottom: 0;
	border-top: 1px solid;
}
#diagband-options {
	position: relative;
}

#slides-result-controller {
	position: relative;
	/*ext-align: justify;*/
}
#slides-result-controller::after {
	/*content: '';
	display: inline-block;
	width: 100%;
	height: 0;
	font-size: 0;
	line-height: 0;*/
}
/* Accordion search buttons */
#toggle-search-tools {
	/* Bootstrap < 5 */
	top: -48px;
	right: 20px; 
	background-color: #333; }
#toggle-search-tools[aria-expanded=true] {
	color: #fff;
	border-color: #007bff;
	background-color: #007bff; }
#search-tools {
	margin-bottom: 0.5rem; }
.slides-controller
/*,#slide-options-menu*/ {
	/*margin-top: 0.5rem;
	margin-bottom: 0.5rem;*/ }
.slides-control {
	display: flex;
	vertical-align: middle;
	width: 100%;
	margin-right: auto;
	margin-left: 0; }
#slides-result-controller .slides-control {
	justify-content: space-between; }

.more-menu {
	display: inline-block;
	vertical-align: middle;
	width: 19%;
	margin-right: 0;
	margin-left: auto;
	text-align: right;
}
.more-menu button:not(.collapsed) {
	color: #fff;
	background-color: #007bff
}
#slide-options-group {
	position: relative;
	z-index: 10;
	padding-top: 1rem;
}
#slide-options-menu {
	background-color: transparent;
}
#slide-options-controls {
	margin-bottom: 1rem;
}


/****** CONTENT ******/

/* <!-- Typography --> */
.badge.found-label,
.badge.queried-label {
	font-size: +1rem;
}
.ehsl-badge-pill-addsl,
.ehsl-badge-pill-faddsl,
.ehsl-badge-pill-blocksl ,
.ehsl-badge-pill-auditsl {
	font-size: 0.875rem;
}
h4 i,
h5 i,
.uictl,
.count {
	font-size: 0.75rem;
}
.ehsl-card-header .card-title h5,
.badge.found-label,
.badge.queried-label {
	font-weight: 400;
}
.ehsl-card-header .card-title h5 {
	line-height: 1.5;
}
.uictl,
.count,
.strong
/*,nav .card-title.list-label*/,
nav .card-title a[aria-expanded="true"],
.ehsl-badge-pill-addsl,
.ehsl-badge-pill-auditsl,
.ehsl-badge-pill-faddsl ,
.ehsl-badge-pill-blocksl {
	font-weight: 700;
}
.strike {
	text-decoration: line-through;
}
.badge.found-label,
.badge.queried-label,
.ehsl-card-header .card-title h5 {
	font-style: italic;
}
.uppercase {
	text-transform: uppercase;
}


/* <!-- Icons Fonts --> */
.icon-font:before/*,
.icon-font:after,
.checkbox-button-group label:before*/ {
	display: inline-block;
    font-family: "Material Icons";
	font-size: 24px;
	content: "link";
	line-height: 1;
	-webkit-font-feature-settings: "liga" 1;
	   -moz-font-feature-settings: "liga" 1;
	        font-feature-settings: "liga" 1;
	/* font-family: "Font Awesome 5 Free";
    font-size: inherit;
    font-weight: 900;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;*/
}
/*.icon-eye[aria-expanded="false"]:before {content: "\f06e";padding-right: 0.5rem;} *//* <!-- Eye slash --> */
/*.icon-eye[aria-expanded="true"]:before  {content: "\f070";padding-right: 0.5rem;} *//* <!-- Eye open --> */
/*.icon-close[aria-expanded="true"]:after {content: "\f057";padding-right: 0.5em;}  *//* <!-- Times-circle --> */
#gallery-layout-controls .icon-font:before {
	font-size: 36px;
}
.ehsl-slide-img .slide-add-results.badge-pill {
	padding: 0.25em 0.4em;
}
.ehsl-slide-img .slide-add-results.icon-font:before {
	font-size: 14px;
}
#gallery-layout-controls .icon-font {
	display: inline-block;
	height: 36px;
}
#gallery-layout-controls .icon-font,
#gallery-layout-controls .icon-font:before {
	color: rgba(0, 0, 0, 0.75);
}
#gallery-layout-controls .icon-font:hover,
#gallery-layout-controls .icon-font:hover::before {
	color: #007bff;
	background-color: inherit;
}
#gallery-layout-controls .icon-font.active {
	opacity: 0.25;
	background-color: inherit;
}
#gallery-layout-controls .icon-font.active:hover,
#gallery-layout-controls .icon-font.active:hover::before {
	color: rgba(0, 0, 0, 0.75);
	opacity: 0.5;
	border: 0;
	cursor: default;
}

.icon-close[aria-expanded="true"]:after {content: 'cancel';} 
.icon-eye[aria-expanded="false"]:before {content: 'visibility';}
.icon-eye[aria-expanded="true"]:before  {content: 'visibility_off';}
.icon-actors:before {content: 'recent_actors';}
.icon-apps:before   {content: 'apps';}
.icon-headline:before {content: 'view_headline';}
.icon-image:before  {content: 'image';}
.icon-list:before   {content: 'view_list';}
.icon-meal:before   {content: 'set_meal';}
.icon-menu:before   {content: 'menu';}
.icon-reader:before {content: 'chrome_reader_mode';}
.icon-reorder:before{content: 'reorder';}
.icon-tile:before   {content: 'view_module';}

#options .button-actions a.icon-eye[aria-expanded="false"]:before,
#options .button-actions a.icon-close[aria-expanded="false"]:after {content: '';}


.summ-str,
.summ-str-diag {
	margin-top: 0.5em;
	font-style: italic;
}

/****** COMPONENTS ******/

/* <!-- Alerts --> */
.bd-callout {
	border: 1px solid; 
	border-left-width: 0.25rem;
	border-radius: 0.25rem;
	margin-top: 1.25rem;
	margin-bottom: 1.25rem;
	padding: 1.25rem;
}

/* <!-- Buttons --> */
.navbar #search-tools-controller button.btn {
	/*border: 1px solid #007bff;
	border-radius: 0.2rem;
	color: #007bff;*/
	margin-left: 5px;
	background-color: #333;
}
#search-tools-controller button.btn[aria-expanded=true],
#search-tools-controller button.btn[aria-expanded=true] svg {
	color: #fff;
	background-color: #007bff;
}
button svg {
	margin-bottom: 2px;
}
.btn-sm {
	padding: 1px 6px;
}
.btn-circle-sm {width: 30px;height: 30px;padding:  6px  0;  border-radius: 15px;font-size: 8px; text-align: center;}
.btn-circle-md {width: 50px;height: 50px;padding:  7px 10px;border-radius: 25px;font-size: 10px;text-align: center;}
.btn-circle-xl {width: 70px;height: 70px;padding: 10px 16px;border-radius: 35px;font-size: 20px;text-align: center;}

/* <!-- dismiss and close buttons --> */
.dismiss {
	display: inline-block;
	margin-right: 0.5rem;
	margin-left: 0.5rem;
}
.dismiss:after {
	content: '';
	display: block;
	clear: both;
}
.dismiss a:hover,
.dismiss a i:hover,
.dismiss .close:hover {
	cursor: pointer;
	opacity: 1;
}
.dismiss .close {
	float: inherit;
	position: relative;
	border-radius: 50%;
	content: '';
	opacity: 1;
	font-size: inherit;
	font-weight: inherit;
	line-height: 1;
}
.dismiss .close:before,
.dismiss .close:after  {
	position: absolute;
	content: ' ';
}
.dismiss .close:before {
	transform: rotate(45deg);
}
.dismiss .close:after {
	transform: rotate(-45deg);
}
.dismiss .close.size-18 {
	border: 2px solid;
	width: 18px;
	height: 18px;
}
.dismiss .close.size-18:before,
.dismiss .close.size-18:after {
	left: 6px;
	bottom: 0;
	width: 2px;
	height: 14px;
}

.ehsl-slide-title .dismiss,
#gallery-grid.slide-v .ehsl-slide-title .dismiss {
	position: absolute;
	right: 0.5rem;
	clear: right;
}
.ehsl-slide-title .dismiss {
	top: 0.5rem;
	margin-right: inherit;
}
.stretched-link, .slidenum {
	z-index: 1;
}
#gallery-grid.slide-v .ehsl-slide-title .dismiss {
	top: inherit;
	bottom: 0.5rem;
	/*z-index: 10;*/
}
.ehsl-slide-title .dismiss .close,
#gallery-grid.slide-v .ehsl-slide-title .dismiss .close,
nav.catsel-lists .d-flex .dismiss .close {
	float: right;
}

a.toggle-info[href="#diagnosis-search-info"] {
	display: inherit;
	width: 16px;
	margin-right: auto;
	margin-left: auto;
}

#diagnosis-search-info .dismiss,
#slide-show-help .dismiss {
	position: relative;
	width: 100%;
	margin-right: inherit;
	margin-left: inherit;
	text-align: right;
}

#slide-show-help {
	max-width: 650px;
	margin-top: 0;
}

#slide-show-help strong {
	color: rgba(255, 255, 255, 0.8);
}
	

/* <!-- Bootstrap Card Overrides --> */
.card {
	border: 0;
}
.card-title {
	margin-bottom: 0;
}
.card-deck {
	margin-right:  inherit;
	margin-bottom: inherit;
	margin-left:   inherit;
}


.ehsl-card {border-radius: 0.25rem;}
/* fix expanding jump when margin, 
   padding set to element with 
   class .collapse
*/
#column-middle .ehsl-card { 
	margin-bottom: 1rem;
}
.collapse .ehsl-card-body,
.ehsl-card .ehsl-card-title { 
	margin-bottom: 1rem;
}
.ehsl-card-brd-dotted {
	border-top: 1px dotted blue;
}

/* <!-- Input group --> */

/* ---- checkbox - circle ---- */
.checkbox-circle-group {
	position: relative;display: block;/*min-height: 1.5rem;*/padding-left: 1.5rem;}
.checkbox-circle-group input[type='checkbox'] {position: absolute;z-index: -1;opacity: 0;}
.checkbox-circle-group label {width: 100%;}
.checkbox-circle-group label:before,
.checkbox-circle-group label:after {position: absolute;display: block;content: '';}
.checkbox-circle-group label:before { /* <!-- Circle --> */
	top: 0.1rem;
	left: 0;
	width: 18px;
	height: 18px;
	margin: 1px 11px 1px 1px;
	border-radius: 50%;
	border: 1px solid;
	transition: background-color .15s ease-in-out,
					border-color .15s ease-in-out,
					box-shadow   .15s ease-in-out;
}
.checkbox-circle-group label:after { /* <!-- Check mark --> */
	display: none;
	top: 7px;
	left: 5px;
	width: 10px;
	height: 7px;
	border-left: 2px solid;
	border-bottom: 2px solid;
	transform: rotate(-45deg);
}
.checkbox-circle-group input[type='checkbox'] + label:after {content: none;}
.checkbox-circle-group input[type='checkbox']:checked + label:after {content: "";}

/* <!-- checkbox circle colors --> */
.checkbox-circle-group label:hover  {background-color: #f1f1f1;}
.checkbox-circle-group label:before {border-color:     #adb5bd;}
.checkbox-circle-group label:after  {border-color:     #fff;}
.checkbox-circle-group input[type='checkbox']:checked + label:before {
	border-color: var( --color-success );
	background-color: var( --color-success );
}

/* <!-- Checkbox as button --> */
.checkbox-button-group       {display: inline-block;line-height: 1;}
.checkbox-button-group:hover {color: #007bff;}
.checkbox-button-group input[type='checkbox'] {position: absolute;z-index: -1;opacity: 0;}
.checkbox-button-group label:before {}
.checkbox-button-group label {margin-bottom: 0;}

/* <!-- Characteristics filter optons --> */
/*.checkbox-button-group .ehsl-badge-pill-hide-label:before {content: "\f070";padding: 2px 0.4em 0;}*/ /* <!-- Eye slash --> */
/*.checkbox-button-group .ehsl-badge-pill-show-label:before {content: "\f192";padding: 2px 0.4em 0;} *//* <!-- Circle dot, image \f03e*/
/*.checkbox-button-group input:checked + .ehsl-badge-pill-hide-label:before {content: "\f06e";}*/ /*Eye open --> */
.checkbox-button-group .ehsl-badge-pill-hide-label:before,
.checkbox-button-group .ehsl-badge-pill-show-label:before {
	font-family: "Material Icons";
	font-size: 28px;
	content: "link";
	-webkit-font-feature-settings: "liga" 1;
	   -moz-font-feature-settings: "liga" 1;
	        font-feature-settings: "liga" 1;
}
.checkbox-button-group .ehsl-badge-pill-hide-label:before {content: 'visibility';}
.checkbox-button-group .ehsl-badge-pill-show-label:before {content: 'preview';} 
/* ---- input checkbox checked ---- */
.checkbox-button-group input:checked + .ehsl-badge-pill-hide-label:before {content: 'visibility_off';} 
.checkbox-button-group input + .ehsl-badge-pill-show-label:before,
.checkbox-button-group input + .ehsl-badge-pill-hide-label:before {color: #007bff;}
.checkbox-button-group input:checked + .ehsl-badge-pill-show-label:before,
.checkbox-button-group input:checked + .ehsl-badge-pill-hide-label:before {color: #ff0000;}

/* <!-- Checkbox - switch --> */
.custom-switch input[type="checkbox"] {margin-left: 1rem;}
.custom-switch input[type="checkbox"]:checked~.custom-control-label:before {margin-left: 0;background-color: #28a745;}
.custom-switch .custom-control-label {padding-left: 30px;}
.custom-switch .custom-control-label:before {left: -0.25rem;}
.custom-switch .custom-control-label:after  {left: -0.1rem;}

/*.custom-checkbox input[type="checkbox"] {}
.custom-checkbox input[type="checkbox"]~.custom-control-label:before {content: "\f111";color: #f1f1f1;background-color: #f1f1f1;}*/
.custom-checkbox input[type="checkbox"]:checked~.custom-control-label:before {
	/*content: "\f058";
	background-color: #007bff;*/
	color: #007bff;
}
/*.custom-checkbox input[type="checkbox"]:checked~.custom-control-label:later {
	content: "";
}*/

/*.custom-checkbox .custom-control-label:before,
.custom-checkbox .custom-control-label:after { 
	display: inline-block;
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
 }*/
#card-diagnosis_abscess .form-check-label {
	color: #999;
	font-style: italic;
}
.custom-control .custom-control-label:hover,
.checkbox-circle-group input[type='checkbox'] + label,
.checkbox-circle-group input[type='checkbox'] + label:before,
.checkbox-circle-group input[type='checkbox'] + label:after,
.checkbox-button-group input[type='checkbox'] + label:before {
	cursor: pointer;
}
#btnRow .dropdown a {
	padding: 0.75em 1.25em 0.75em 0.5em;
}
#btnRow .dropdown a.active {
	background-color: #f1f1f1;
}
#btnRow .dropdown-toggle {/*white-space: pre-line;*/}

/* caret direction for dropdown-toggle */
.dropdown-toggle:before,
.dropdown-toggle:after {
	transition: all 0.5s ease-in-out;
}
.dropdown-toggle[aria-expanded="true"]:after,
#navSearchByChar #btn_all[aria-expanded="true"]::after,
#charband nav.catsearch .dropdown-toggle[aria-expanded="true"]::after,
#bologsectbtns > nav .dropdown-toggle[aria-expanded="true"]::after,
#textderm4sectbtns > nav .dropdown-toggle[aria-expanded="true"]::after  {
	/*transform: rotate(-90deg);*/
}
.collapseBtns.dropdown-toggle[aria-expanded="true"]:after,
#charband nav .dropdown-toggle[aria-expanded="true"]::after
/*,#bologsectbtns > nav .dropdown-toggle[aria-expanded="true"]::after*/ {
	/*transform: rotate(180deg);*/
}
#btnSearchByChar.dropdown-toggle[aria-expanded="true"]::after {
	/*top: 2rem;*/
}

/* -- directions -- */
/* top */
.carettop.dropdown-toggle[aria-expanded="true"]::before ,
.carettop.dropdown-toggle[aria-expanded="true"]::after {
	transform: rotate(180deg);
}
/* right */
.caretright.dropdown-toggle[aria-expanded="true"]::before ,
.caretright.dropdown-toggle[aria-expanded="true"]::after {
	transform: rotate(-90deg);
}
/* left */
.caretleft.dropdown-toggle[aria-expanded="true"]::before,
.caretleft.dropdown-toggle[aria-expanded="true"]::after {
	transform: rotate(90deg);
}
/* bottom */
.carettop.dropdown-toggle[aria-expanded="false"]::before ,
.carettop.dropdown-toggle[aria-expanded="false"]::after,
.caretleft.dropdown-toggle[aria-expanded="false"]::before,
.caretleft.dropdown-toggle[aria-expanded="false"]::after ,
.caretright.dropdowntoggle[aria-expanded="false"]::before ,
.caretright.dropdowntoggle[aria-expanded="false"]::after {
	transform: rotate(0deg);
}

.dropdown-toggle {
	white-space: normal;
}

/*button.toggle-chevron,*/
.toggle-chevron {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	border: inherit;
	border-radius: inherit;
	padding: inherit;
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	background: inherit;
	text-align: left;
	padding-left: 0;
}
.toggle-chevron {
	width: 100%;
}
.toggle-chevron:hover {
	cursor: pointer;
}
.toggle-chevron .chevron,
.toggle-chevron .icon-border {
	position: absolute;
	right: 0;
}
.toggle-chevron.inherit {
	border: 0;
	border-radius: 0;
	width: inherit;
	padding: 0.25rem 0.5rem;
	color:  #007bff;
	font-size:  0.875rem;
	font-weight: 400;
	line-height: 1.5;
	background-color: transparent;
	-webkit-appearance: none;
}
.btn-link.toggle-chevron.inherit {
	border-radius: 0.2rem;
}
.toggle-chevron.inherit .chevron {
	position: relative;
	right: inherit;
	vertical-align: text-bottom;
}
.toggle-chevron.inherit[aria-expanded=true],
.toggle-chevron.inherit[aria-expanded=true] .chevron:after {
	color: #fff;
}
.navbar button.btn-link[aria-expanded=true] {
	margin-right: 4px;
	/*color: #fff;
	background-color: #007bff;*/
}
.toggle-chevron .icon-border {
	top: 5px;
	right: 10px;
}
.card-title .toggle-chevron {
	line-height: 1.5;
}
#slides button.toggle-chevron {
	padding-right: 10px;
	padding-left: 10px;
}
/* <!-- cheveron icon --> */
.chevron {
	display: inline-block;
	position: relative;
	margin-bottom: 1rem;
	margin-left: 1rem;
}
.chevron:after {
	display: inline-block;
	position: absolute;
	right: 6px;
	top: 0.45rem;
	border-style: solid;
	border-width: 0.15rem 0.15rem 0 0;
	width: 0.5rem;
	height: 0.5rem;
	content: '';
	vertical-align: middle;
	color: #007bff;/*color: rgb(136,136,136);*/
	transition: all 0.3s ease-in-out;
}
.chevron.up:after    {transform: rotate(-45deg);}
.chevron.right:after {/*left: 0;*/transform: rotate(45deg);}
.chevron.down:after  {top: 0.25rem;transform: rotate(135deg);}
.chevron.left:after  {/*left: 0.25rem;*/transform: rotate(-135deg);}

/* <!-- icon-square --> */
.icon-border {
	display: inline-flex;
	border:  1px solid #007bff;
	border-radius:  0.2rem;
	padding: 4px;
	color: #007bff;
	background-color: #333;
}
.toggle-chevron:hover .icon-border,
.toggle-chevron[aria-expanded=true] .icon-border {
	color: #fff;
	background-color: #007bff;
}


nav .card-title button.btn {
	border: 0;
	padding-right: 0.25rem;
	padding-left: 0.25rem;
}
nav .card-title button.dropdown-toggle[aria-expanded="true"],
#charfilterbtns .card-title button.dropdown-toggle[aria-expanded="true"] {
	color: #999;
	background-color: rgba(0, 0, 0, 0.1);
}
nav .card-title button.dropdown-toggle.collapsed,
#charfilterbtns .card-title button.dropdown-toggle.collapsed {
	opacity: 1;
	background-color: transparent;
}
nav .card-title button strong {
	color: #999;
	font-weight: 400;
	/*text-transform: uppercase;*/
}

#slides-filters {
	padding: 8px 10px;
}
/* ---- search by slide numbers ---- */
#slides-result-controller {
	/*margin-top: 0.5rem;*/
}
#slides-result-controller > button {
	margin-bottom: 0.25rem;
	background-color: #333;
}
#slides-result-controller .slide-layout:not(.active) {
	background-color: #333;
}
#lbl_choose_opt {
	margin-left: inherit;
}
#slide_range_op label {
	margin-left: 1rem;
}
#slide_range_op label span {
	display: inline-block;
}
#slide_range_op .custom-control-input:checked ~ label {
	background-color: #e2e6ea;
}

/* <!-- Tab group --> */
.tab-group-search {
	margin-bottom: 2em;
}
.tab-group-search .btn.tab {
	font-size: 0.85rem;
	text-transform: uppercase;
	opacity: 0.5;
}
.tab-group-search .btn.tab.focus,
.tab-group-search .btn.tab:focus {
	box-shadow: none;
}
.tab-group-search .btn.tab.active {
	border-bottom: 2px solid;
	opacity: 1;
}


/****** UTILITIES ******/

/* <!-- Borders --> */
#diagnosis-list-all {
	border: 0;
}
.title,
.ehsl-slide-label > span.queried-badge {
	border-radius: 10rem;
}
#bologsectbtns a.title,
#textderm4sectbtns a.title {
	border-radius: inherit;
}
.ehsl-slide-title .title,
.ehsl-slide-label > span:first-of-type,
.btn-slide-query-label:before {
	border-radius: 0.25rem;
}

#diagnosis-search-group .ehsl-card-body,
#diagband-options,
#charband-options,
#bologsectbtns,
#textderm4sectbtns,
#slide-numbers-search-form {
	border-radius: 0 0 1rem 1rem;
}

/* <!-- Display --> */


.more
/* -- navbar -- */,
.navbar-brand h4 span 
/* -- slide images -- */ ,
.multidiag.spaceimg
/* -- nav menu button toggle icons -- */,
[aria-controls="search-mode"][aria-expanded="true"] i.fa-cog,
[aria-controls="search-mode"][aria-expanded="false"] i.fa-times,
[aria-controls="navbarSupportedContent"][aria-expanded="false"] i.fa-times,
[aria-controls="navbarSupportedContent"][aria-expanded="true"] i.fa-bars {
	display: none;
}

#catsel-diagnosis.no-matches,
#catsel-diag-collapse-all.no-matches,
#navCharselect.no-matches,
.multiple-select-catsel.no-matches {
	display: none !important;
}

#bologsectbtns nav,
#textderm4sectbtns nav {
	display: block;
}

/**/
span.show ,
.dropdown-toggle span.show,
#search-characteristics.show,
#queried-characteristics.show 
/* -- Nav menu button toggle icons -- */,
[aria-controls="search-mode"][aria-expanded="false"] i.fa-cog,
[aria-controls="search-mode"][aria-expanded="true"] i.fa-times,
[aria-controls="navbarSupportedContent"][aria-expanded="false"] i.fa-bars,
[aria-controls="navbarSupportedContent"][aria-expanded="true"] i.fa-times {
	display: inline-block;
}


/* <!-- Colors --> */
/* <!-- #007bf-f; rgb(0,123,255) .blue (.bg-primary bootstrap)
/* <!-- #dc354-5; .red (.bg-danger bootstrap)
/* <!-- #28a74-5; .success | .green (.bg-success bootstrap)
/* <!-- #343a4-0; .dark (.bg-dark bootstrap)
/* <!-- #17a2b-8; .info bootstrap
/* <!-- #ffffe-0; light yellow
/* <!-- #80808-0; not found text
/* <!-- #ffdab-9; .slidenum
/* <!-- #467e9-9; .slide-show-title 
/* <!-- #2f4f4-f; dark slate gray
*/

:root {
	/* #ffffff */ --color-white: rgb( 255, 255, 255 );
	/* #808080 */ --color-grey-50: regb( 128, 128, 128 ); /* not found text */
	/* #dc3545 */ --color-red: rgb( 220, 53, 69 ); /* .red (.bg-danger bootstrap) */
	/* #ffdab9 */ --color-slidenum: rgb( 255, 218, 185 ); /* light peach .slidenum */
	/* #ffffe0 */ --color-yellow-light: rgb( 255, 255, 224 ); /* very light yellow (warm white) */
	/* #28a745 */ --color-success: rgb( 40, 167, 69 ); /* .success|.green (.bg-success bootstrap) */
	/* #17a2b8 */ --color-info: rgb( 23, 162, 184 ); /* torquois .info bootstrap */
	/* #2f4f4f */ --color-slate-grey: rgb( 47, 79, 79 ); /* dark green grey, dark slate grey */
	/* #467e99 */ --color-blue-grey: rgb( 70, 125, 153 ); /* .slide-show-title */
	/* #343a40 */ --color-dark-grey: rgb( 52, 58, 64 ); /* .dark (.bg-dark bootstrap) */
	/* #007bff */ --color-primary-blue: rgb( 0, 123, 255 ); /* .blue (.bg-primary bootstrap) */
	/* #007bff */ --color-focus: rgba( 0, 123, 255, 0.5 );
	/* #000000 */ --color-black: rgb( 0, 0, 0 );
}


.uictl,
.count-match,
.queried-badge, 
.queried-label,
.slide-show-title,
#header button.focus,
.ehsl-slide-img .slidenum,
.btn-slide-query-label:before,
.stretched-link:before,
.ehsl-badge-pill-addsl, 
.ehsl-badge-pill-faddsl, 
.ehsl-badge-pill-blocksl, 
.ehsl-badge-pill-auditsl {
	color: #fff;
}
.blue,
.count,
#diagnosis-list-all {
	color: #007bff;
}
.red,
.fa-times {
	color: #dc3545;
}
.badge-match,
.found-label,
.slide-diag-fnd,
.filter-opt-label {
	color: #2f4f4f;
}
.characteristic-notfound {
	color: #808080;
}
nav .card-title.list-label,
nav .card-title a[aria-expanded="true"],
nav.bolognia .f-sect-parent,
nav.textderm4 .f-sect-partent {
	color: #999;
}

.dismiss a,
.dismiss a i,
.dismiss .close,
.dismiss a:visited,
.icon-close {
	color: #dc3545;
}
.icon-close:hover {
	color: #222;
}
#diagnosis-list-all:hover {
	color: #fff;
}

/* <!-- Rules for using icons as black on a light background. --> */
/*a.icon-font:before,*/
a.icon-font.inactive:before,
a.icon-font:after {
	color: rgba(0, 0, 0, 0.54);
}
a.icon-font.inactive:after {
	color: rgba(0, 0, 0, 0.26);
}
/* <!-- Rules for using icons as white on a dark background. --> */
a.icon-font.text-white:before,
a.icon-font.text-white:after {
	color: rgba(255, 255, 255, 1);
}
a.icon-font.text-white.inactive:before,
a.icon-font.text-white.inactive:after {
	color: rgba(255, 255, 255, 0.3);
}

/* ---- Seaerch by numbers icon fontawesome ---- */
/*.slide-add-query:before   {content: "\f00e";color: #fff;background-color: #28a745;} *//* <!-- search plus --> */
/*.slide-add-results:before {content: "\f055";color: #fff;background-color: #17a2b8;} *//* <!-- plus circle --> */
/*.slide-block:before       {content: "\f056";color: #fff;background-color: #dc3545;} *//* <!-- minus circle --> */
/*.slide-audit:before       {content: "\f06a";color: #fff;background-color: #ffc107;} *//* <!-- exclamation circle --> */
/*.slide-notation:before    {content: "\f304";color: #fff;background-color: #007bff;} *//* <!-- pen --> */

/* ---- Seaerch by numbers icon material design ---- */
.slide-add-query:before   {content: "zoom_in";color: #fff;background-color: #28a745;}       /* <!-- search plus --> */
.slide-add-results:before {content: "add_circle";color: #fff;background-color: #17a2b8;}    /* <!-- plus circle --> */
.slide-block:before       {content: "remove_circle";color: #fff;background-color: #dc3545;} /* <!-- minus circle --> */
.slide-audit:before       {content: "error";color: #fff;background-color: #ffc107;}         /* <!-- exclamation circle --> */
.slide-view:before        {content: "account_details";color: #fff;background-color: #007bff;} /* <!-- person's bust with detail --> */
.slide-notation:before    {content: "edit";color: #fff;background-color: #007bff;}          /* <!-- pen --> */

/* ---- background color ---- */
body {
	background-color: rgba(0, 0, 0, 0.02);
}
#header,
.count,
#footer,
#diagnosis-result .fetch-button,
#header-slides,
#gallery-grid.slide-v:not(.tall) .ehsl-slide-ctl a:hover span span {
	background-color: #fff;
}
#column-middle .panel .ehsl-card {
	background-color: rgba(255, 255, 255, 0.85);
}
.uictl {
	background-color: #007bff;
}
.checked,
input[type='text'],
nav .card-title a:hover,
.card-title button.collapsed {
	background-color: #f1f1f1;
}
#search-link.show {
	display: flex;
}
input#search-loc {
	border-radius: 0 0.25rem 0.25rem 0;
}
#search-link .input-group-text {
	border-radius: 0.25rem 0 0 0.25rem;
}
#basic-addon1:hover {
	cursor: pointer;
	color: var( --color-white );
	background-color: var( --color-primary-blue );
}
#copied-clipboard.message-box {
	border-radius: 0.25rem;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 10;
	padding: .375rem .75rem;
	font-size: 1rem;
	line-height: 1.5;
	text-align: center;
	color: var( --color-white );
	background-color: var( --color-success );
	transition: all 0.5s ease-out;
}
.badge-match,
.found-label,
.slide-diag-fnd,
.filter-opt-label {
	background-color: #ffffe0;
}
.count-match, 
.slide-show-title {
	background-color: #2f4f4f;
}
.dismiss .close:before,
.dismiss .close:after,
.ehsl-badge-pill-blocksl {
	background-color: #dc3545;
}
.queried-badge, 
.queried-label,
.ehsl-badge-pill-addsl,
#gallery .ehsl-card-body .queried-badge span:first-of-type {
	background-color: #28a745;
}
#header button.focus {
	background-color: #343a40;
}
#multidiag-dialog {
	/*background-color: #e6e6fa;*/
}
#multidiag-pref-msg {
	background-color: yellow;
}
.ehsl-slide-img .slidenum {
	background-color: rgba(0, 0, 0, 0.8);
}
.ehsl-slide-img div {
	z-index: 15;
}
#column-middle {
	/*background-color: #343a40;*/
	background-color: rgba(0, 0, 0, 0.2);
}
.dismiss .close:hover,
#gallery .ehsl-card-body .queried-badge {
	background-color: transparent;
}
.characteristic-notfound {
	background-color: inherit;
}
.uictl:hover {
	background-color: #ebf5ff;
	 /* background-color: rgba(0, 123, 255, 0.25); #007bff blue */
}


/* ---- border color ---- */
.bd-callout {
	border-color: #eee;
}
.bd-callout-info {
	border-left-color: #5bc0de;
}
.tab-group-search .btn.tab.active {
	border-color: #007bff;
}
#footer {
	border-color: #ccc;
}

/* ---- opacity ---- */
.btn.disabled,
.btn:disabled,
button:disabled {
	opacity: 0.35;
}
.card-title button.collapsed {
	opacity: 0.25;
}
#slides .card-title button.collapsed,
.card-title button:hover {
	opacity: 1;
}



/****** CUSTOM ******/

/* <!-- lists panel Characteristics filter, Bolognia sections--> */
nav > .ehsl-card .button-actions {position: relative;width: 100%;/*margin-top: 0.75rem;*/text-align: right;}
nav > .ehsl-card .card-title {width: calc( 100% - 1rem );margin-left: 1rem;}
nav > .ehsl-card .list-label strong {text-transform: uppercase;}
nav > .ehsl-card .column-count {margin-right: 1rem;margin-left: 1rem;column-count: auto;column-width: 9rem;}
nav > .ehsl-card .column-count.bolognia {column-width: auto;}
nav > .ehsl-card .column-count.textderm4 {column-width: auto;}
nav > .ehsl-card .column-count-margin {display: block;width: 100%;height: 1rem;}
nav > .ehsl-card .f-list-parent {display: block;}
nav > .ehsl-card .f-list-parent > div {margin-bottom: 2px;-webkit-column-break-inside: avoid;page-break-inside: avoid;break-inside: avoid;}
nav > .ehsl-card .f-list-parent a.clicklbl {display: inline-block;}

/* <!-- Diagnosis Search --> */
#diagnosis-name-input {margin-bottom: 0.5em;}
#diagnosis-search-help {font-style: italic;}
#diagnosis-result .fetch-button {text-align: center;}
#diagresultsclose {margin-top: 1rem;margin-bottom: 1rem;}


/* ---- spacing for button stacking ---- */
#slide-options-menu button {
	margin-bottom: 0.25rem;
}
#gallery-slide-vert-short[aria-expanded=false],
#slide-options-menu button[aria-selected=false] {
	color: #007bff;
	background-color: #333;
}
#slide-options-menu button[aria-selected=true] {
	color: #fff;
	background-color: #007bff;
}
/* <!-- EHSL Slide Cards --> */
.gallery-group {
	width: 100%;
	margin-bottom: 1rem;
}
.group-title {
	margin-top: 2rem;
}
.group-title:first-child {
	/*margin-top: 0;*/
}
.ehsl-slide-card {
	flex-direction: row;
	width: calc( 100% - 0.5rem );
	/*height: 200px;*/
	margin-bottom: 0.5rem;
}
#gallery-grid.slide-h.list {
	align-items: inherit;
}
#gallery-grid.slide-h .slide-action-links:hover .btn-slide-query-label {
	position: absolute;
	left: 0px;
	padding: 2px 0px;
}
#gallery-grid.image.tile .ehsl-slide-card,
#gallery-grid.slide-v.tile .ehsl-slide-card {
	margin-right: 0.5rem;
}
#gallery-grid.image.list .ehsl-slide-card,
#gallery-grid.image.tile .ehsl-slide-card,
#gallery-grid.slide-v .ehsl-slide-card {
	flex-direction: column;
	width: 200px;
}
#gallery-grid.slide-v.list .ehsl-slide-card,
#gallery-grid.slide-v.tile .ehsl-slide-card {
	height: auto;
}
.ehsl-slide-img {
	flex: 0 0 200px;
	position: relative;
	overflow: hidden;
	width: 200px;
	/* height: 200px; */
	height: 50px;
	/* with padding */
	margin-left: -0.125em;
}
.ehsl-slide-img img {
	width: 100%;
	height: 100%;
}
.ehsl-slide-img .slidenum {
	position: absolute;
	font-size: 85%;
}
.ehsl-slide-body {
	position: relative;
	padding: 0.5rem;
}
.ehsl-slide-title .title  {
	position: static;
	width: inherit;
}
#gallery-grid.slide-v .ehsl-slide-title {
	min-height: 3.5rem;
}
/* ---- h6 class ---- */
#gallery-grid.slide-v .ehsl-slide-title .ehsl-slide-label {
	display: inline-block;
	margin-bottom: 0;
}
/* ---- badges inside of slide title ---- */
.ehsl-slide-label > span:first-of-type {}
.ehsl-slide-label > span.queried-badge {}
.ehsl-slide-ctl   {
	position: absolute;
	bottom: 0.5rem;
}
.ehsl-slide-ctl a {
	display: block;
}
/* ---- long-label ---- */
.slide-show-title {
	display: inline-block;
	padding: 0.1em 0.4em 0.35em;
	vertical-align: text-bottom;
}
/* ---- slide action links ---- */
.slide-action-links {
	/*margin-bottom: 1px;*/
}
/* ---- slide action links button icons ---- */
.btn-slide-query-label:before {
	width: 2rem;
	padding: 0.1rem;
	text-align: center;
	opacity: 1;
}
.btn-slide-query-label:hover:before {
	opacity: 0.5;
}
.stretched-link:before {
	width: 2rem;
	padding: 0.1rem;
	text-align: center;
	opacity: 1;
}
.stretched-link:hover:before {
	opacity: 0.5;
}
/* ---- slide action links button label ---- */
a:link .btn-slide-query-label span {
	opacity: 0.25;
}
#gallery-grid.slide-v:not(.tall) a:hover .btn-slide-query-label span {
	/*display: inline-block;*/
	display: block;
	/*margin-left: 0.25rem;
	margin-left: 0.125rem;
	margin-left: 0.06rem;*/
	margin-left: -2.5em;
	padding-left: 0.5em;
	width: auto;
	opacity: 1;
}
#gallery-grid.slide-v:not(.tall) a:hover .slide-add-results.btn-slide-query-label span {
	margin-left: -4.8em;
	padding-left: 2.8em;
}
#gallery-grid.slide-v:not(.tall) a:hover .slide-block.btn-slide-query-label span {
	margin-left: -7.1em;
	padding-left: 5.1em;
}

#gallery-grid.slide-v.tall a:hover .btn-slide-query-label span,
 #gallery-grid.slide-h a:hover .btn-slide-query-label span {
	opacity: 1;
	text-decoration: none;
}

/* ---- slide action links button label ---- */
a:link .stretched-link span {
	opacity: 0.25;
	color: white;
}
.stretched-link:hover span {
	display: inline-block;
	margin-left: 0.25rem;
	color: white;
	opacity: 1;
}

/* ---- card actions links ---- */
#gallery-grid.slide-v .ehsl-slide-ctl {
	position: relative;
	bottom: inherit;
}
/* ---- vertical card short ---- */
#gallery-grid.slide-v .ehsl-slide-ctl a {
	display: inline-block;
}
#gallery-grid.slide-v .ehsl-slide-ctl a,
#gallery-grid.slide-v .ehsl-slide-ctl span {
	position: relative;
}
/* ---- vertical card short, button labels hidden ---- */
#gallery-grid.slide-v .ehsl-slide-ctl a:link span span {
	display: none;
}
/* ---- vertical tall layout, button labels visible ---- */
#gallery-grid.slide-v.tall .ehsl-slide-ctl a:link span span {
	display: inline-block;
	margin-left: 0.25rem;
}
/* ---- vertical card short, show labels above buttons ---- */
#gallery-grid.slide-v:not(.tall) .ehsl-slide-ctl a:hover span span {
	display: inline-block;
	position: absolute;
	top: -2.5rem;
	z-index: 10;
	width: 200px;
	padding-top: 0.25rem;
}
#gallery-grid.slide-v:not(.tall) .ehsl-slide-ctl a[title="add to query"]:hover span span {
	left: -13px;
	padding-left: 8px;
}
#gallery-grid.slide-v:not(.tall) .ehsl-slide-ctl a[title="add to results"]:hover span span {
	left: -49px;
	padding-left: 40px;
}
#gallery-grid.slide-v:not(.tall) .ehsl-slide-ctl a[title="block in query"]:hover span span {
	left: -85px;
	padding-left: 80px;
}
#gallery-grid.slide-v:not(.tall) .ehsl-slide-ctl a[title="suggest audit"]:hover span span {
	left: -122px;
	padding-left: 85px;
}
#gallery-grid.slide-h.list .ehsl-slide-ctl a {
	margin-right: 1rem;
}
#gallery-grid.slide-v:not(.tall) .dismiss {
	display: none;
}
/*
@media (min-width: 768px) and (max-width: 991px) {
	#gallery-grid.slide-h.tile .ehsl-slide-card {
	 	flex-basis: 48%;
	 	min-width: 380px;
	}
}*/


/* ---- gallery grid image only view ---- */
/*#gallery-grid.image .ehsl-slide-card .ehsl-slide-body {
	display: none;
}*/
/*#gallery-grid.image .ehsl-slide-label,
 */
#gallery-grid.image .ehsl-slide-ctl {
	display: none;
}
#gallery-grid.image .ehsl-slide-ctl.show {
	display: block;
}
#gallery-grid.image .ehsl-slide-title .ehsl-slide-img {
	height: 20px;
}

/* ---- badges title ---- */

nav .title {
	position: relative;
	width: 17rem;
	margin-top: inherit;
	margin-bottom: 0;
	padding: 0.25rem 0.6rem;
}

nav h6.title {
	display: inline-flex;
	justify-content: space-between;
	align-items: center;
}
nav .card-title a {
	display: block;
	width: 100%;
}

.multiple-select > .d-flex,
.multiple-select-diagnosis > .d-flex {
	align-items: center;
}
.ehsl-diag-card,
.ehsl-char-card {height: 3.4rem;}
.ehsl-char-card .badge {display: inherit;display: flex;align-items: center;}
.ehsl-title-ctl-align  {margin-bottom: 0;}
.ehsl-title-ctl-align .badge {display: flex;align-items: center;}

.ehsl-badge-pill-addsl, 
.ehsl-badge-pill-faddsl, 
.ehsl-badge-pill-blocksl, 
.ehsl-badge-pill-auditsl {
	margin-right: 0.4em;
}
.ehsl-badge-pill-addsl .sliqdis,
.ehsl-badge-pill-blocksl .sliqdis {
	margin-left: 0.5em;
} 

/* ---- column title ---- */
h4.custom-title.btn-link {
	margin-bottom: 0;
}
.custom-title.btn-link {
	color: inherit;
}
.custom-title.btn-link:hover {
	cursor: default;
	text-decoration: none;
}
#slides-search-buttons button {
	margin-bottom: 0.5rem;
}
#header-slides {
	margin-bottom: 1rem;
}


/* ---- Characteristics sections ---- */
/* ---- Bolognia sections ---- */
#charfilterbtns {
	padding: 0;
	background-color: #fff;
}
#btnSearchByChar[aria-expanded="true"] {
	margin-top: 1rem;
}
#charband-options {
	position: relative;
}
#bologsectbtns,
#textderm4sectbtns,
#charband-options {
	margin-bottom: 1rem;
}
#diagband-options,
#charband-options,
#diagnosis-search-group .ehsl-card-body {
	padding-bottom: 1rem;
}
#navSearchByChar {
	/*padding-right: 0.5rem;
	padding-left: 0.5rem;*/
}
#diagband nav:first-of-type,
#charfilterbtns nav,
#bologsectbtns > nav,
#textderm4sectbtns > nav {
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}
#diagband nav:last-of-type,
#charfilterbtns nav:last-of-type,
#bologsectbtns > nav:last-of-type,
#textderm4sectbtns > nav:last-of-type {
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
#diagband nav .card div,
#charband nav .card div,
#bologsectbtns > nav .card div,
#textderm4sectbtns > nav .card div {
	margin-bottom: 0;
}
#charband nav .card-title a,
#bologsectbtns > nav .card-title a,
#textderm4sectbtns > nav .card-title a {
	width: 94%;
}
#charband nav .card-title a,
#bologsectbtns > nav .card-title a,
#textderm4sectbtns > nav .card-title a,
#bologsectbtns > nav .card-body a,
#textderm4sectbtns > nav .card-body a {
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
}
#diagband nav:first-of-type {
	padding-top: 0.5rem;
}
#diagband nav:last-of-type {
	padding-bottom: 0.5rem;
}
#bologsectbtns > nav .card-body a,
#textderm4sectbtns > nav .card-body a {
	display: block;
}
#charband nav .card-title a[aria-expanded='true'],
#bologsectbtns > nav .card-title a[aria-expanded='true'],
#textderm4sectbtns > nav .card-title a[aria-expanded='true'] {
	font-weight: 400;
}
#bologsectbtns > nav .card-body,
#textderm4sectbtns > nav .card-body {
	padding-top: 0.5rem;
}
nav .dropdown-toggle::after 
/*,#charband nav .dropdown-toggle::after,,
#bologsectbtns > nav .dropdown-toggle::after*/ {
	/*position: absolute;
	right: 10px;
	top: 1rem;*/
}
nav #btnSearchByChar:not(.collapsed) ~ #btnAllCharfilter.caretright.dropdown-toggle {
	/*margin-top: 0.25rem;*/
}
/* Height of #btnSearchByChar  */
nav #btnSearchByChar.dropdown-toggle[aria-expaned='true']::after {
	top: 2rem;
}
nav #btnSearchByChar:not(.collapsed) ~ #btnAllCharfilter.caretright.dropdown-toggle::after {
	top: 6.25rem;
}
nav #btnSearchByChar.collapsed ~ #btnAllCharfilter {
	margin-top: 0;
}


/* ---- bg logo ---- 

#column-middle {
	background: url('../templ/images/UofU_SoM_Horizontal_White.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 50%;
}*/


