@charset "UTF-8";
/* CSS Document */

h1 {
	text-align: center;
	font-size: 3em;
	padding-top: 2em;
}
.clunky {
	background: repeating-linear-gradient(
  45deg,
  #B92A19,
  #4C1D09 1em,
  #fce2bf 2em,
  #E18E04 6em
		)}
.funky {
	background: repeating-linear-gradient(
  135deg,
  #B92A19,
  #4C1D09 1em,
  #fce2bf 2em,
  #E18E04 6em
	)}

.spunky {
	background: repeating-linear-gradient(
  135deg,
  #B92A19,
  #B92A19 2em,
  #E18E04 2em,
  #E18E04 4em
)}
.flunky {
	background: repeating-linear-gradient(
  0deg,
  #813C01,
  #813C01 1em,
  #4C1D09 1em,
  #4C1D09 2em
)}
.junky {
	background: repeating-linear-gradient(
  90deg,
  #813C01,
  #813C01 1em,
  #4C1D09 1em,
  #4C1D09 2em
)}
.deg45 {
	background: repeating-linear-gradient(
  45deg,
  #E18E04,
  #E18E04 1em,
  #fce2bf 1em,
  #fce2bf 2em
		)}
.deg90 {
	background: repeating-linear-gradient(
  90deg,
  #E18E04,
  #E18E04 1em,
  #fce2bf 1em,
  #fce2bf 2em
		)}
.deg135 {
	background: repeating-linear-gradient(
  135deg,
  #E18E04,
  #E18E04 1em,
  #fce2bf 1em,
  #fce2bf 2em
		)}
.deg0 {
	background: repeating-linear-gradient(
  0deg,
  #4C1D09,
  #4C1D09 1em,
  #411400 1em,
  #411400 2em
		)}
.circle {	
	background: repeating-radial-gradient(
  circle,
  #4C1D09,
  #4C1D09 1em,
  #411400 1em,
  #411400 2em
		)}
.dark{
	background: rgb(0 255 0);
}
.foundation {	
	background: repeating-radial-gradient(
  circle,
  #471247,
  #471247 1em,
  #3D0D3C 1em,
  #3D0D3C 2em
		)}
.research {	
	background: repeating-radial-gradient(
  circle,
  #30441D,
  #30441D 1em,
  #283A1A 1em,
  #283A1A 2em
		)}
.design {	
	background: repeating-radial-gradient(
  circle,
  #123544,
  #123544 1em,
  #0C2C3A 1em,
  #0C2C3A 2em
		)}
.technology {	
	background: repeating-radial-gradient(
  circle,
  #161743,
  #161743 1em,
  #0F133B 1em,
  #0F133B 2em
		)}
/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
/*  border-bottom: 1px dotted black;  If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
 
  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 1;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
}
.masked{
	-webkit-mask-image: url("../images/circleMask.png");
	mask-image: url("../images/circleMask.png");
	mask-repeat: no-repeat;
	mask-position: center;

}
.referenceAPA {
	text-indent: -3em;
    margin-left: 3em;

}
.carousel-header .carousel-custom {
	visibility: hidden;
}
/* Override Bootstrap 4.4.1 carousel control icons */

/* Previous (left) arrow */
.carousel-control-next-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000000' viewBox='0 0 8 8'%3E%3Cpath d='M5.5 0l-1.5 1.5L7 4 4 6.5 5.5 8l4-4-4-4z'/%3E%3C/svg%3E");
}

/* Next (right) arrow */
.carousel-control-prev-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23000000' viewBox='0 0 8 8'%3E%3Cpath d='M2.5 0l1.5 1.5L1 4l3 2.5L2.5 8l-4-4 4-4z'/%3E%3C/svg%3E");
}

/* Optional: resize the icons */
.carousel-control-prev-icon,
.carousel-control-next-icon {
  width: 2rem;
  height: 2rem;
  background-size: 100% 100%;
}
/* Change default inactive indicator color */
.carousel-indicators li {
  background-color: #9a9a9a;  /* gray */
}

/* Change the active indicator color */
.carousel-indicators .active {
  background-color: #000000;  /* your brand green */
}
