@charset "UTF-8";



/******** Organizational | Static Calendar Icon *******/

#calendaricon {
		
	--calendaricon-title-font-size:2rem;
	--calendaricon-title-font-weight:600;
	--calendaricon-title-font-color:#464646;
		
	--calendaricon-info-font-size:1.25rem;
	--calendaricon-info-font-weight:400;
	--calendaricon-info-font-color:#464646;	
		
	--calendaricon-background-color:rgb(240,240,240);
	--calendaricon-background:linear-gradient(to top, rgba(241, 241, 241, 1), rgba(255, 255, 255, 1) 92.86%);
	--calendaricon-boxshadow:0 10px 10px -10px rgba(0,0,0,0.25), 0 0 3px 0 rgba(0,0,0,0.25);
		}
		
#calendaricon {
	/* background:var(--calendaricon-background-color); */
	/* background:var(--calendaricon-background); */
	/* box-shadow:var(--calendaricon-boxshadow); */
	/* border-radius: 1rem; */
	/* border-bottom: 2px solid #ffffff; */
	display: inline-block;
	}
		
.calendaricon-title {
	font-size:var(--calendaricon-title-font-size);
	font-weight:var(--calendaricon-title-font-weight);
	color:var(--calendaricon-title-font-color);
	}
		
.calendaricon-info {
	font-size:var(--calendaricon-info-font-size);
	font-weight:var(--calendaricon-info-font-weight);
	color:var(--calendaricon-info-font-color);
	}
		
#calendaricon .fa-icon {
	width: 2rem;
	text-align: center;
	font-size: 1.25rem;
	line-height: 1.5rem;
	}			


/******** Organizational | Static Calendar Date *******/

#calendarday {
		
	--calendarday-title-font-size:2rem;
	--calendarday-title-font-weight:600;
	--calendarday-title-font-color:#464646;
		
	--calendarday-info-font-size:1.25rem;
	--calendarday-info-font-weight:400;
	--calendarday-info-font-color:#464646;	
		
	--calendarday-background-color:rgb(240,240,240);
	--calendarday-background:linear-gradient(to top, rgba(241, 241, 241, 1), rgba(255, 255, 255, 1) 92.86%);
	--calendarday-boxshadow:0 10px 10px -10px rgba(0,0,0,0.25), 0 0 3px 0 rgba(0,0,0,0.25);
		}
		
#calendarday {
	background:var(--calendarday-background-color);
	background:var(--calendarday-background);
	box-shadow:var(--calendarday-boxshadow);
	border-radius: 1rem;
	border-bottom: 2px solid #ffffff;
	}
		
.calendarday-title {
	font-size:var(--calendarday-title-font-size);
	font-weight:var(--calendarday-title-font-weight);
	color:var(--calendarday-title-font-color);
	}
		
.calendarday-info {
	font-size:var(--calendarday-info-font-size);
	font-weight:var(--calendarday-info-font-weight);
	color:var(--calendarday-info-font-color);
	}
		
#calendarday .fa-icon {
	width: 2rem;
	text-align: center;
	font-size: 1.25rem;
	line-height: 1.5rem;
	}			


			
/* simple accordion */

	#calendarday details {font-size: 1rem;}
	#calendarday details > * {padding: 0.75rem;}
	#calendarday summary {border-radius: 1rem; font-size: 1rem; font-family: sans-serif;
		font-weight: bold;color: #464646;cursor: pointer; position: relative;border-top: 3px solid #ffffff; 
		background: rgb(250, 250, 250); transition: all 0.3s ease-in-out;}	
	#calendarday summary:hover {}
	#calendarday summary::marker {content: "";}
	#calendarday summary::before {content:"";position:absolute;inset: .75rem;left: auto;aspect-ratio: 1;
		background: conic-gradient(from 90deg at 33% 33%, #0000 90deg, #cccccc 0) 100% 100%/60% 60%;clip-path: inset(1px);}
	#calendarday details[open] summary::before {background: linear-gradient(#cccccc 0 0) 50%/100% 25% no-repeat;}
	#calendarday details[open] summary {border-radius: 1rem 1rem 0 0;}
	#calendarday details > div {background: #ffffff;border-radius: 0 0 1rem 1rem;border-bottom: 3px solid white;
		border-left: 1px solid white;border-right: 1px solid white;}		
	
/*** end.contactcard ***/
	


/******** Organizational | Contact Card *******/



#contact-card {
					
	/* Profile Picture */
			
	--contactcard-accent-color: #f58232;
	--contactcard-full-name: #464646;
	--contactcard-full-name-font-size:2rem;
	--contactcard-job-title-color:#464646;
	--contactcard-job-title-fontsize:1.75rem;
	--contactcard-job-team-color:#464646;
	--contactcard-job-team-fontsize:1.75rem;
	--contactcard-job-department-color:#464646;
	--contactcard-job-department-fontsize:1.75rem;
	--contactcard-pronouns-color:#888888;
	--contactcard-pronouns-fontsize:1.25rem;
	--contactcard-optional-color:#464646;
	--contactcard-optional-fontsize:1.75rem;
	
	--contactcard-about-color:#888888;
	--contactcard-about-fontsize):3rem;
	
	/* --contactcard-email-icon:;
	--contactcard-phone-icon:;
	--contactcard-zoom-icon:;
	--contactcard-fax-icon:;
	--contactcard-building-icon:; 
	--contactcard-work-days-icon:;
	--contactcard-hours-icon:;
	--contactcard-open-office-hours-icon:; */
			
	--contactcard-background-color:rgb(240,240,240);
	--contactcard-background:linear-gradient(to top, rgba(241, 241, 241, 1), rgba(255, 255, 255, 1) 92.86%);
	--contactcard-boxshadow:0 10px 10px -10px rgba(0,0,0,0.25), 0 0 3px 0 rgba(0,0,0,0.25);
	}
			
.hide {display:none}
		
.contactcard {
	display:block;
	min-height: 5rem;
	padding: 1rem;
	margin: 2rem 0.5rem;
	border-radius: 1rem;
	border-bottom: 2px solid #ffffff;	
	background:var(--contactcard-background-color);
	background:var(--contactcard-background);
	box-shadow:var(--contactcard-boxshadow);
	}	
			
.contactcard-img {
	display: block;
	border-radius: 20rem;
	border: 0.2rem solid #ffffff;
	width: 10rem;
	height: 10rem;		
	background-color:#ffffff;
	margin: -2rem auto 0.5rem auto;
	box-shadow: 0 -31px 37px -8px rgba(0, 0, 0, 0.1) inset, 0 -4px 4px -1px rgba(0, 0, 0, 0.25);
	transition: all 0.3s ease-in-out;
	transform: scale(1);	
	transform-origin: bottom;
	}
			
.contactcard-img:hover {
			transform: scale(1.3);
			}
	
.contactcard-fullname {
		display:block;
		font-size:var(--contactcard-full-name-font-size);
		font-weight: 900;
		color: var(--contactcard-full-name);
		line-height: 2rem;
		
		}

.contactcard-title {
		display:block;
		font-weight: 600;
		line-height: 1.75rem;
		font-size: var(--contactcard-job-title-fontsize);
		font-style: oblique;
		color:var(--contactcard-job-title-color);
		margin-top: 0.5rem;
		}
			
			
			
.contactcard-team {
		display:block;
		font-weight: 600;
		line-height: 1.75rem;
		font-size: var(--contactcard-job-team-fontsize);
		color:var(--contactcard-job-team-color);
		margin-top: 1rem;
		}
			
			
.contactcard-department {
		display:block;
		font-weight: 600;
		line-height: 1.75rem;
		font-size: var(--contactcard-job-department-fontsize);
		color:var(--contactcard-job-department-color);
		}			
			
.contactcard-pronouns {
		display:block;
		font-weight: 300;
		font-size: var(--contactcard-pronouns-fontsize);
		font-style: oblique;
		color:var(--contactcard-pronouns-color);
		margin-top: 1rem;
			}			

.contactcard-optional {
		display:block;
		font-weight: 300;
		font-size: var(--contactcard-optional-fontsize);
		color:var(--contactcard-optional-color);
		margin-top: 2rem;
			}			
		
			
.connect, .office {
			border-radius:1rem;
			background-color:#ffffff;
			padding: 0.5rem;
			margin:1rem 0;
			}			
			
		
.contactcard-fa-icon {
	width: 2rem;
	text-align: center;
	font-size: 1.25rem;
	line-height: 2.25rem;
	margin-right: 0.5rem;
	}			
			
			
			
#mapthumbnail {
			border-radius:1rem; 
			background-color:#ffffff;
			/* border: 3px solid #ffffff; */
			margin:1rem 0;
			/* box-shadow:0 10px 10px -10px rgba(0,0,0,0.25), 0 0 3px 0 rgba(0,0,0,0.25); */
			}			
			
.overview p {
		font-weight: 300;
		font-size:2rem;
		color:var(--contactcard-overview-color);
		line-height: 2rem;
			font-style: oblique;			
			}	

			
/* simple accordion */
					
	#contact-card details {font-size: 1rem; font-size: 1rem;
background-color: #ffffff;
margin: 1rem -2rem -1rem -2rem;
border-radius: 1rem;
}
	#contact-card details > * {padding: 0.75rem; }
	#contact-card summary {border-radius: 1rem; font-size: 1rem; font-family: sans-serif;
		font-weight: bold; color: #464646;cursor: pointer; position: relative;border-top: 3px solid #ffffff; 
		background: rgb(250, 250, 250); transition: all 0.3s ease-in-out;}	
	#contact-card summary:hover {}
	#contact-card summary::marker {content: "";}
	#contact-card summary::before {content:"";position:absolute;inset: .75rem;left: auto;aspect-ratio: 1;
		background: conic-gradient(from 90deg at 33% 33%, #0000 90deg, #cccccc 0) 100% 100%/60% 60%;clip-path: inset(1px);}
	#contact-card details[open] summary::before {background: linear-gradient(#cccccc 0 0) 50%/100% 25% no-repeat;}
	#contact-card details[open] summary {border-radius: 1rem 1rem 0 0;}
	#contact-card details > div {border-radius: 0 0 1rem 1rem;border-bottom: 3px solid white;
		border-left: 1px solid #ffffff; border-right: 1px solid #ffffff; min-height:2rem; padding: 2rem 1rem;}	
		
		.contactcard-detailtext {padding:1rem;}

@media only screen and (max-width: 50em) {}

/*** end.contactcard ***/





/******** Organizational | Quotebox *******/


#quotebox-colors-light-mtsac-maroon {
	--quotebox-accent-color: #9c182f; 
	--quotebox-quotation-text: #464646;
	--quotebox-hyphen:#9e1b2a;
	--quotebox-author-name: #464646;
	--quotebox-author-title:#888888;
	--quotebox-background-color: #fbfbfb;
	--quotebox-boxshadow:0 10px 10px -10px rgba(0,0,0,0.25), 0 0 3px 0 rgba(0,0,0,0.25);
	}
			
#quotebox-colors-light-flame-orange {
	--quotebox-accent-color: #f58232; 
	--quotebox-quotation-text: #464646;
	--quotebox-hyphen:#9e1b2a;
	--quotebox-author-name: #464646;
	--quotebox-author-title:#888888;
	--quotebox-background-color: #fbfbfb;
	--quotebox-boxshadow:0 10px 10px -10px rgba(0,0,0,0.25), 0 0 3px 0 rgba(0,0,0,0.25);
	}
			
#quotebox-colors-light-mountain-blue {
	--quotebox-accent-color: #326195; 
	--quotebox-quotation-text: #464646;
	--quotebox-hyphen:#9e1b2a;
	--quotebox-author-name: #464646;
	--quotebox-author-title:#888888;
	--quotebox-background-color: #fbfbfb;
	--quotebox-boxshadow:0 10px 10px -10px rgba(0,0,0,0.25), 0 0 3px 0 rgba(0,0,0,0.25);
	}
		
#quotebox-colors-dark-mtsac-maroon {
	--quotebox-accent-color: #9c182f; 
	--quotebox-quotation-text: #f5f5f5;
	--quotebox-hyphen:#9e1b2a;
	--quotebox-author-name: #ffffff;
	--quotebox-author-title:#f5f5f5;
	--quotebox-background-color: #464646;
	--quotebox-boxshadow:none;
	}	
			
#quotebox-colors-dark-flame-orange {
	--quotebox-accent-color: #f58232; 
	--quotebox-quotation-text: #f5f5f5;
	--quotebox-hyphen:#9e1b2a;
	--quotebox-author-name: #ffffff;
	--quotebox-author-title:#f5f5f5;
	--quotebox-background-color: #464646;
	--quotebox-boxshadow:none;
	}		

#quotebox-colors-dark-mountain-blue {
	--quotebox-accent-color: #326195; 
	--quotebox-quotation-text: #f5f5f5;
	--quotebox-hyphen:#9e1b2a;
	--quotebox-author-name: #ffffff;
	--quotebox-author-title:#f5f5f5;
	--quotebox-background-color: #464646;
	--quotebox-boxshadow:none;
	}		

#quotebox-colors-dark-maroon-flame-orange {
--quotebox-accent-color: #f58232;
--quotebox-quotation-text: #f5f5f5;
--quotebox-hyphen: #9e1b2a;
--quotebox-author-name: #ffffff;
--quotebox-author-title: #f5f5f5;
--quotebox-background-color: #9c182f;
--quotebox-boxshadow: none;
}

#quotebox-colors-dark-charcoal-light-mountain {
			--quotebox-accent-color: #97999b;
--quotebox-quotation-text: #f5f5f5;
--quotebox-hyphen: #9e1b2a;
--quotebox-author-name: #ffffff;
--quotebox-author-title: #f5f5f5;
--quotebox-background-color: #4a4f55;
--quotebox-boxshadow: none;
}
			
#quotebox-colors-dark-deep-light-mountain {
	--quotebox-accent-color: #326195;
--quotebox-quotation-text: #f5f5f5;
--quotebox-hyphen: #9e1b2a;
--quotebox-author-name: #ffffff;
--quotebox-author-title: #f5f5f5;
--quotebox-background-color: #0b122c;
--quotebox-boxshadow: none;
}


@media only screen and (max-width: 50em) {
	.position-left30, .position-left70, .position-right30, .position-right70, .position-center70 {
	float:none !important; margin: 2rem auto !important; width: 100% !important; border-left: 5px solid var(--quotebox-accent-color)!important; border-right: none !important; }}
	
			
	/* Size and Position - float: left/right/none - width: 30/70/100 */
			
	.position-left30 {
		float:left;
		margin: 0.75rem 2rem 0.75rem 0rem; 
		width: 30%; 
		border-left: 5px solid var(--quotebox-accent-color);
		}
	.position-left70 {
		float:left;
		margin: 0.75rem 2rem 0.75rem 0rem; 
		width: 70%; 
		border-left: 5px solid var(--quotebox-accent-color);
		}
	.position-center70 {
		float:none;
		margin: 2rem auto; 
		width: 70%; 
		border-right: 5px solid var(--quotebox-accent-color);
		}
	.position-center100 {
		float:none;
		margin: 2rem auto; 
		width: 100%; 
		border-right: 5px solid  var(--quotebox-accent-color);
		}	
	.position-right30 {
		float:right; 
		margin: 0.75rem 0 0.75rem 2rem; 
		width: 30%; 
		border-right: 5px solid  var(--quotebox-accent-color);
		}
	.position-right70 {
		float:right;
		margin: 0.75rem 0 0.75rem 2rem; 
		width: 70%; 
		border-right: 5px solid  var(--quotebox-accent-color);
		}
							
/* Quotation */
			
	.quotebox {
		padding: 1rem;
		border-radius: 0.5rem;
		background-color: var(--quotebox-background-color);
		box-shadow:var(--quotebox-boxshadow);
		}
			
	.quotebox p {
		color: var(--quotebox-quotation-text);
		font-size: 1.2rem;
		font-style: oblique;
		margin-bottom:0;
		}
			
/* Quote Mark */	
			
	.quotebox::before {
		content: "“";
		color: var(--quotebox-accent-color);
		font-size: 6rem;
		line-height: 1rem;
		position: absolute;
		margin: -0.1rem 0;
		}

	.quote-attribution {
		margin-top: 0.5rem;
		margin-left:1rem
		}
			
	.quote-hyphen {
		font-weight: 900;
		margin-left: -0.5rem;
		color: var(--quotebox-accent-color);
		} 
			
	/* Quote Author */
			
	.author-name {
		font-size: 1.2rem;
		font-weight: 900;
		color: var(--quotebox-author-name);
		}

	/* Quote Author's Title */
			
	.author-title {
		display:block;
		font-weight: 300;
		font-size: 1rem;
		font-style: oblique;
		color: var(--quotebox-author-title);
		margin-left: 0.5rem;
		margin-top: -0.5rem;
		}
				
/*** end.quotebox ***/


/******** Animated Stats Numbers *******/

.counters {
	display: flex;
	background: rgba($white, 0.75);
	padding: 20px;
	border-radius: 10px;
	box-shadow: 5px 5px 20px rgba($black, 0.2);
}		

.counter {
	letter-spacing: 3px;
	line-height: 1;
	position: relative;
	display: flex;
	overflow: hidden;
	align-items: center;
	height: 5.6rem; /* 3.6rem */
	font-size: 5rem; /* 3rem */
	margin-bottom: 1rem;
	font-weight: 600; /* 400 */
	left: 24%;
	& > span {
		z-index: 1;
		display: flex;
		flex-direction: column;
		height: 100%;
		transition: transform 2s ease;
		transform: translateY(0);
		line-height: 1;
		span {
			flex: 0 0 100%;
			height: 100%;
		}
	} 


	$d: 0;
	$inc: 0.375;
	@for $i from 1 through 20 {
		&;:nth-child(#{$i}) > span {
			transition-delay: #{$d * 1s};
		}
		$d: $d + $inc;
	}
}






/*** end.stats number ***/