﻿@font-face {
	font-family: Roboto;
	src: url(./Fonts/roboto.woff) format("woff")
}

@font-face {
	font-family: Docons;
	src: url(./Fonts/docons.woff2) format('woff')
}

body 
{
	font-family: Roboto, Arial, Helvetica, Sans-Serif;
	font-size: 0.9em;
	margin: 0px;
}

h1 {
	font-size: 130%;
	color: #003478;
	/* color: #2b76ca; */
}

h2 {
	font-size: 120%;
	color: #003478;
	/* color: #2b76ca; */
}

h3 {
	font-size: 110%;
	color: #003478;
	/* color: #2b76ca; */
}

.headerLabel {
	font-size: 130%;
	font-weight: bold;
	color: #003478;
}

.shortSeparator {
	margin-left: 12px;
	/* width: 75%; */
	color: #999999;
	text-align: left;
}

.customDownloadNav {
	vertical-align: top;
	overflow-y: auto;
	border-right: 2px solid #EEEEEE;
	min-width: 300px;
}

.topCenter {
	 vertical-align: top; 
	/* text-align: center; */
}

.tdtCenter {
	text-align: center;
	vertical-align: top;
}
.fpIcon {
	width: 80px;
	height: 80px;
	/* vertical-align: middle; */
}

#banner {
	height: 85px;
	/* 
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top,#2b76ca,#002e67);
	background-image: -webkit-gradient(linear,left top,left bottom,from(#2b76ca),to(#002e67));
	background-image: url(images/banner.png);
		
	background-image: url(images/25/Medicomp-logo-wh-crp.svg);
	background-size: 70% 400%; */
	/* background-repeat: no-repeat; */
	background-color: #0071CE;
}

#bannerText {
	color: #ffffff;
	background-color: transparent;
	padding-top: 24px;
	padding-left: 12px;
	font-size: 180%;
	font-weight: bold;
	display: none;
	visibility: hidden;
}


#bannerImage {
	position: absolute;
	height: 65px;
	top:  10px;
	left: 14px;

} 
#banner a
{
	color: #ffffff;
}

#banner a:visited
{
	color: #ffffff;
}

#banner a:hover {
	text-decoration: underline;
}

.loginBox {
	background-color: white;
	box-shadow: 2.72px 8px 24px 0px #00000033;
	text-align: center;
	padding-top: 44px;
	padding-bottom: 44px;
}

.subBox {
	text-align: center;
}

#logoHolder {
	background-image: url(images/25/Medicomp-TM-crp.svg);
	width: 341px;
	height: 110px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 27px;
	background-size: contain;
	background-position-y: 8px;
	background-repeat: no-repeat;
}

.checkboxContainer {
	width: 242px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	margin-top: 24px;
}

.checkboxContainer .loginBoxControl {
	display: inline-block;
	margin-top: -2px;
	vertical-align: top;
}

.checkboxContainer input[type=checkbox] {
	margin: 0px;
	width: 20px;
	height: 20px;
	border: 1px solid #909295;
	border-radius: 0;
	margin-right: 10px;
}

.loginBoxControl {
	color: #909295;
	width: 212px;
	font-family: Roboto;
	font-weight: 400;
	font-size: 16px;
}

input.loginBoxControl {
	border: 1px solid #909295;
	height: 40px;
	margin-top: 24px;
	padding-left: 14px;
	padding-right: 14px;
}

.loginBoxControl:focus {
	outline: none;
}

.signUpBox {
	margin-top: 64px;
}

/* . class 
	# id */
.flatBlueButton {
	background-color: #0071CE;
	font-weight: 600;
	border: none;
	color: white;
	border-radius: 4px;
	margin-top: 24px;
	width: 200px;
	height: 42px;
	font-size: 16px;
	cursor: pointer;
}

.loginErrorMessage {
	color: firebrick;
	display: block;
	width: 242px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 24px;
}

.imac {
	animation-delay: 0s;
}

input[type="checkBox"]:checked {
	background-color: #4CAF50;
	border: 2px solid #4CAF50;
}

#CheckBox1 {
}


.flex-container {
	display: flex;
	flex-direction: column;
}

	.flex-container > div {
		/*background-color: #f1f1f1;
		position: fixed; 
		left: 500px;
		position: fixed; 
			width: 40%;
		*/
		left: 30%;
		margin: 0px;
		text-align: center;
		/* line-height: 75px;
	font-size: 30px; */
	}

#mainMenu {
	float: right;
	background-color: transparent;
	margin-top: 35px;
	offset-position: bottom;
	margin-right: 8px;
}

#mainMenu .menuItem
{
	display: inline;
	padding-left: 12px;
}

#mainMenu .menuItem a
{
	color: #ffffff;
	text-decoration: none;
}

#mainMenu .menuItem a:visited
{
	color: #ffffff;
	text-decoration: none;
}

#mainMenu .menuItem a:hover
{
	color: #ffffff;
	text-decoration: underline;
}


#pageBody
{
	/* width: 1130px; (2025) */
	width: 100%; /* 2025 */
	font-size: 16px; /* 2025 */
	line-height: 24px;
}

#mainContent
{
	clear: both;
	margin: 12px;
	padding: 12px;
}

#footer {
	clear: both;
	margin: auto;
	margin-bottom: 2rem;
	padding-top: 40px;
	font-size: 75%;
	color: #999999;
	text-align: center;
	border-top: 2px solid #f6f7f8;
}

.bulletList ul
{
	margin-bottom: 0px;
}

.bulletList li
{
	list-style-type: none;
	background-image: url(images/bullet_ball_glass_blue_32.png);
	background-repeat: no-repeat;
	background-position: left, center;
	padding-left: 38px;
	vertical-align: middle;
	line-height: 32px;
}

.contentBox
{
	padding: 8px;
}

.aspLoginBox
{
	line-height: 32px;
}

.aspLoginLabel
{
	padding-right: 8px;
}

.entryHeader
{
	color: #2b76ca;
	/* border-bottom: 3px #2b76ca solid;	 */
}

.entryBody
{
	margin-bottom: 42px;
}

.entryDate
{
	display: inline;
	float: right;
}

.entryTitle
{
	font-size: 120%;
	font-weight: bold;
	display: inline;
	font-size: 120%;
}

#leftCol
{
	width: 800px;
	float: left;
}

#rightCol
{
	margin-left: 830px;
}

.infoBox
{
	min-height: 100px;
	margin-bottom: 12px;
}

.infoBox .title
{
	border-left: 1px #365f91 solid;	
	border-right: 1px #365f91 solid;	
	border-top: 1px #365f91 solid;	
	border-bottom: 0px #365f91 solid;	
	font-weight: bold;
	color: #ffffff;
	padding: 6px;
	margin-bottom: 0px;
	background-repeat: repeat-x;
	background-image: -moz-linear-gradient(top,#2b76ca,#002e67);
	background-image: -webkit-gradient(linear,left top,left bottom,from(#2b76ca),to(#002e67));
	background-image: url(images/titlebar.png);	
	border-top-left-radius: 6px;
	border-top-right-radius: 6px;
	-moz-border-radius-topleft: 6px;
	-moz-border-radius-topright: 6px;	
}

.infoBox .content
{
	margin-top: 0px;
	border: 1px #365f91 solid;	
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;	
	-moz-border-radius-bottomleft: 6px;
	-moz-border-radius-bottomright: 6px;
	min-height: 100px;
}

.linkList
{
	padding-left: 24px;
	line-height: 1.5em;
}

#allDownloadsLink
{
	text-align:right;
	margin-right: 6px;
}

/* 2025 */
#cardContainer {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	flex-basis: 30%;
	/* padding-left: 20%; */
}

.card {
	display: none;
	margin: 1em 2em;
	width: 300px;
	height: 360px;
	box-shadow: 0 3.2px 7.2px 0 rgba(0,0,0,.18), 0 0.6px 1.8px 0 rgba(0,0,0,.11);
	cursor: pointer;
	flex-direction: column;
	background-color: #ffffff;
	opacity: 0.0;
}


	.card.selected {
		display: flex;
		opacity: 1.0;
		transition-delay: 1s;
		transition-property: display, opacity;
		transition-duration: 1s;
		transition-timing-function: ease-in;
	}

	.card.placeHolder {
		display: flex;
		margin: 0px 2em;
		height: 1px;
		visibility: hidden;
	}

	.card:hover {
		box-shadow: 0 0 0.1px 1px #edebe9, 0 6.4px 14.4px 0 rgba(0,0,0,.18), 0 1.2px 3.6px 0 rgba(0,0,0,.11);
	}

	.card > * {
		margin: 1em;
		align-self: center;
	}

	.card > .moduleIcon {
		margin-top: 2em;
		width: 80px;
		height: 80px;
	}

	.card > .title {
		font-weight: bold;
		text-align: center;
	}

	.card > .text {
		flex-grow: 1;
	}

a {
	/* color: #0071B9; */
	color: #0071CE;
	text-decoration: none;
}

a:hover {
	color: rgb(200,100,100);
	text-decoration: none;
}

#viewLinks 
{
	display: flex;
	justify-content: center;
}

#viewLinks a 
{
	margin: 1em 2em;
	font-weight: bold;
	font-size: 120%;
	border-bottom: 3px solid transparent;
}

#viewLinks a.selected 
{
		color: rgb(200,100,100);
		border-bottom: 3px solid rgb(200,100,100);
}

.quippeSplashLogo {
	height: 10vh;
	object-fit: contain;
	display: block;
	margin: 0 auto;
}

.instrText 
{
	text-align: center;
}
/* Standard */
.blueTint1 {
	color: #0071CE;
}
/* Ligher */
.blueTint2 {
	color:#00AEEF;
}
/* Darker */
.blueTint3 {
	color: #003478;
}

.supportRequest, .currentVersion {
	text-align: left;
}

.largeBold {
	font-size: 1.25em;
	line-height: 1.5em;
	padding-bottom: .5em;
	font-weight: bold;
	/* font-size: larger; */
}

.justLarge {
	font-size: larger; 
}

.xLargeblueTint3 {
	font-size: x-large;
	color: #003478;
}
.extraLargeBold {
	font-weight: bold;
	font-size: x-large;
}

.faqEntry {
	/* box-shadow: 0 3.2px 7.2px 0 rgba(0,0,0,.18), 0 0.6px 1.8px 0 rgba(0,0,0,.11); */
	margin: 2em 5em;
}

.obfuscated {
	display:none;
	visibility: hidden;
}

.faqContent {
	display: grid;
	grid-template-columns: 80% 20%;
	grid-auto-rows: minmax(100px, auto); /* Adjust row height as needed */
	gap: 10px; /* Space between rows and columns */
	width: 100vw;
	/* height: 100vh; */
}

.faqLeft {
	flex: 0 0 80%;
	background-color: lightblue;
}

.faqRight {
	flex: 0 0 20%;
	background-color: lightcoral;
}

.plusToggler, .subPlus {
	cursor: pointer;
}

.textCenter {
	text-align: center;
	width: 100%;
}
.whatsNewContent {
	/* margin-left: 16%; */
	margin-left: auto;
	margin-right: auto;
	max-width: 1000px;
}

#WhatsNewText {
	padding-bottom: 2em;
}
.alignRight
{
	text-align: right;
}

.expanderAligner {
	margin-left: 4px;
	margin-top: 8px;
}

.updatesContent {
	/* margin-left: 2%;
	margin-right: 2%; */
}

.blueButton {
	background-color: #0071CE; 
	color: white; /* White text */
	border: none;
	border-radius: 8px; /* Rounded corners */
	padding: 10px 20px;
	font-size: 16px;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	display: inline-block;
}

	.blueButton:hover {
		/* background-color: #003478; */ /* Darker blue on hover */
		/*font-weight: bold;
		text-decoration-color: white;*/
		color:white;
	}

.subtleblueButton {
	background-color: #0071CE;
	color: white; /* White text */
	border: none;
	/* border-radius: 6px; 
	padding: 5px 10px;
		*/
	padding: .5em 1em;
	border-radius: .5em;
	font-size: 14px;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	display: inline-block;
}

	.subtleblueButton:hover {
		/* background-color: #003478; */ /* Darker blue on hover */
		font-weight: bold;
		text-decoration-color: white;
		color: white;
	}

.downloadHeader {
	border-right: 2px solid #f6f7f8;
}

.customDownloadNav > .downloadHeader {
	padding-top: 2em;
}

.downloadHeaderText 
{
	color: #003478; 
	font-weight: bold;
	padding: 5px;
	padding-left: 0;
}

.downloadHeaderText :hover {
	cursor: pointer;
}


.downloadHeaderText:hover {
	font-weight: bolder;
	/* text-decoration: underline; */
	cursor: pointer;
}

.downloadNavHeader {
	color: #003478; /* Blue color */
	font-weight: bold;
	padding: 5px;
	/* padding-left: 15px; */
}

	.downloadNavHeader:hover {
		font-weight: bolder;
		/* text-decoration: underline; */
		cursor: pointer;
	}


.downloadSubHeadIndent {
	padding-left: 22px;	
}

.downloadSubHeadIndent:not(.toggleParent) {
	padding-left: 42px;
}

.downloadNavIndent {
	padding-left: 42px;
}

.downloadNavDir:hover {
	font-weight: bolder;
	/* text-decoration: underline; */
	cursor: pointer;
}

.downloadDetailSubhead {
	font-size: smaller;
	color: lightslategray;
}

th {
	text-align: left;
}

.fileDisplay {
	padding-left: 35px;
}

.fdColDate {
	width: 15%;
	padding-right: 15px;
}
.fdColDescription {
	width: 20%;
	padding-right: 15px;
}
.fdColSize {
	width: 15%;
	padding-right: 15px;
}
.fdColFile {
	width: 50%;
}

.miniCard {
	border-width: 1px;
	border-style: solid;
	border-color: #0071CE;
	border-radius: 5px;
	padding: 15px;
	padding-top: 0px;
	/* padding-left: 30px;
	padding-right: 30px;*/	
}
.miniCardSpacer {
	border-width: 0px;
	border-style: none;
	border-radius: 5px;
	padding: 15px;
}

.miniCardtd {
	height: 150px;
}

.miniCardGroupTitle {
	font-size: larger;
	color: #0071CE;
}

.guideContainer {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem; /* optional spacing between columns */
}

/*.guideColumn {
	flex: 0 0 200px;*/ /* fixed width of 200px */
	/*height: 150px; 
	background-color: lightgray;
	border: 1px solid #ccc;
}*/

.guide-container {
	display: grid;
	/* grid-template-columns: repeat(3, 30%); */
	/* grid-template-columns: repeat(3, minmax(300px, 1fr)); */
	grid-template-columns: 30% 30% 30%;
	/* gap: 16px; */
	gap: 2rem;
	/* column-gap: 3%;
	row-gap: 7%; */
	/* row-gap: 7%; */
	
	padding-left: 5%;
	/* grid-auto-rows: 150px; */
	/* gap: 1rem; */ /* spacing between items */
}

.OLDguide-container-square {
	display: grid;
	grid-template-columns: repeat(3, 18%); /* 3 fixed-width columns */
	justify-content: center;
	/* gap: 16px; */
	gap: 8%;
	/* grid-auto-rows: 150px; */
	/* gap: 1rem; */ /* spacing between items */
}

.guide-container-square {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	justify-content: center;
	gap: 2rem;
	min-width: 64rem;
	max-width: 1024px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 1rem;
	margin-bottom: 2rem;
}

.guide-item-link {
    line-height: 2em;
    font-weight: 600;
    width: 100%;
}

.guide-item-square {
	width: 325px;
	height: 300px;
	padding: 22px;
	border-width: 1px;
	border-style: solid;
	border-color: #808285;
	border-radius: 6px;
	line-height: 1.5em;
	aspect-ratio: 1/1;
	/* padding-top: 3%; */
	box-shadow: 0px 4px 4px 0px #00000040;
	align-items: center;
	justify-content: center;
	display: flex;
	flex-direction: column;
}

.guide-item-square:hover {
	box-shadow: 0px 4px 12px 4px #00000040;
	color: #003478;
	text-decoration: none;
}

.guide-item-square > a:hover {
	color: #003478;
	text-decoration: none;
}

.guide-item-square > a {
	color: black;
	text-decoration: none;
	flex: 1;
	width: 100%;
}

.guide-button {
	padding-top: 3em;
}
.guide-item {
	border-width: 1px;
	border-style: solid;
	border-color: #808285;
	border-radius: 5px;
	padding: 15px;
	padding-top: 3%;
	box-shadow: 0px 4px 4px 0px #00000040;
	/* display: flex; NO */
	align-items: center;
	justify-content: center;
	cursor: pointer;
	aspect-ratio: 2 / 1;
	display: flex;
	flex-direction: column;
}

.guide-item:hover {
	box-shadow: 0px 4px 12px 4px #00000040;
	color: #003478;
	text-decoration: none;
}

.guide-item > *:first-child {
	display: block;
	width: 100%;
	flex: 1;
}

.guide-item > .miniCardURL {
	width: 100%;
	font-weight: 600;
}

.guide-item > a > div {
	color: black;
}

.guide-item > a:hover > div {
	color: #003478;
}

guide-spacer-videos {
}
.largePadLeft {
	padding-left: 5%;
}

.suppressedCard 
{
	display: none;
	visibility: hidden;
}

.shownCard {
	display: auto;
	visibility: visible;
}

#loginBoxOuter 
{
	display: block;
	width: 516px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 60px;
}

.whiteOnBlue {
	background-color: #0071CE;
	color: white;
	font-size: x-large;
	margin-left: auto;
	margin-right: auto;
	padding: 64px;
	border-radius: 8px;
	width: 1200px;
}

.podcastDiscover 
{
	margin-bottom: 32px;
}

.reverseBlueButton {
	background-color: white;
	color: #003478;
	border: none;
	border-radius: 8px; /* Rounded corners */
	padding: 10px 20px;
	font-size: 16px;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-weight: 600;
}

.card-title {
	font-size: larger;
	font-weight: bold;
	padding-top: .5em;
	color: black;
}

.guide-item > a:hover .card-title,
.guide-item > div:hover > .card-title,
.guide-item > div:hover > a > .card-title {
	color: #003478;
}

.card-icon {
	width: 30px;
	height: 30px;
	padding: .25em;
}

.fullWidthTable {
	width: 100%;
	border-spacing: 0;
}

.interCardPad {
	border-bottom: 2px solid #EEEEEE;
	/* padding-top: 2rem;
	padding-bottom: 2rem; */
	/* padding-top: 10px;
	padding-bottom: 10px; */
}

.truncated {
	max-width: 1024px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;

}
#dynamicFPContent {
	margin-top: 4rem;
	margin-bottom: 4rem;
}

.infoNugget {
	line-height: 1.5em;
}

/* #General > div:nth-child(3) 
{
	border-top: 2px solid #f6f7f8;
	padding-top: 2rem;
} */

#MainCol 
{
	margin-left: 5%;
	margin-right: 5%;
}

.fixedContentContainer {
	display: flex;
	/* max-width:1024px; */
	justify-content: center;
}

.updateTitle {
	margin-top: 1rem;
	/* margin-bottom: 2rem; */
	border-bottom: 2px solid #f6f7f8;
	padding-bottom: 2rem;
}

.defaultPageIcon {
	height: 60px;
	width: 60px;
	margin-bottom: 18px;
}

.expanderOuter {
	padding-top: 2rem;
}

.expanderInner {
	padding-bottom: 2rem;
}

.fivePercentMargin {
	margin-left: 5%;
	margin-right: 5%;
}

.tenPercentMargin {
	margin-left: 10%;
	margin-right: 10%;
}

.topHeader {
	padding-left: 5%;
	font-size: 2em;
	line-height: 1.5em;	
	color: #003478;
	text-align: center;
}

.topHeader2 {
	font-family: "Filson Soft", "Roboto", "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans";
	font-size: 32pt;
	font-weight: 500;
	color: #003478;
	line-height: 42px;
	color: var(--MC-dark-blue-css, #003478);
	text-align: center;
	font-size: 32px;
	font-style: normal;
	font-weight: 500;
	line-height: 48px; /* 150% */
	margin-bottom: 48px;
	margin-top: 32px;
}

.downloadContentHolder {
	flex: 1;
}

.miniCardMedia {
	margin-top: 1em;
}

.bottomPad {
	padding-bottom: 3em;
}

.currentReleaseText {
	line-height: 2em;
}

.customDownloadNav ul {
	list-style-type: none;
	padding-inline-start: 16px;
}

.customDownloadNav > ul {
	padding-inline-start: 0;
}

.customDownloadNav > ul > li > .node-label {
	text-transform: uppercase;
	color: #003478;
	font-weight: bold;
}

.customDownloadNav > ul > li {
	padding-top: 2rem;
}

.customDownloadNav > ul > li:first-of-type {
	padding-top: 0;
}

.customDownloadNav  li:not(.leaf) > .node-label:before {
	font-family: docons;
	font-size: 12px;
	display: inline-block;
	position: relative;
	top: -1px;
	content: "Ｔ";
	margin-right: 8px;
	color: black !important;
	font-weight: normal !important;
}

.customDownloadNav li:not(.leaf).expanded > .node-label:not(.leaf):before {
	transform: rotate(90deg);
}

.customDownloadNav li.leaf {
	padding-left: 20px;
}

.customDownloadNav li.leaf > .node-label:hover {
	text-decoration: underline;
}

.customDownloadNav li:not(.leaf):not(.expanded) > ul {
	display: none;
}

.customDownloadNav .node-label {
	cursor: pointer;
}

.customDownloadNav .node-label {
	padding-top: 8px;
	display: inline-block;
}

.customDownloadNav li.selected > .node-label {
	font-weight: bold;
}