@charset "utf-8";
/* CSS Document */

body{ font-family:"Segoe UI", Sans-Serif; margin:0; }
h1, h2, h3, h4, h5, h6 { font-weight:400; line-height:1; margin:0; padding:2rem 0; }
h1 { color:#d04d6f; font-size:2.5rem; padding-top:0; }
h2 { color:#a52c4b; font-size:2.25rem; }
h3 { color:#c33459; font-size:2.15rem; }
h4 { color:#681c30; font-size:2rem; }
h5 { color:#912642; font-size:1.85rem; } /*Month Day Style*/
h6 { color:#541626; font-size:1.65rem; }  /*Year Style*/
p { color: #757575; line-height:1.5; margin:1rem 0; font-size:1.25rem;}
sup {font-size:12px; }
strong { font-weight:bold; font-stretch:none;}
a { font-size:1.25rem; color:#d04d6f;}
a:hover, a:focus { text-decoration:underline;}
a:active {}
ol, ul{ margin:1.5rem; padding-left: 1.5rem; }
li{ color: #757575; font-size:1.25rem; line-height:1.5em; margin:0.5rem 0; }

/* General Classes */

.section { width:100%; padding:5rem 0; position:relative; }
.content-container { max-width: 60rem; padding: 0 2.5rem; margin:0 auto;}
.content__background{ position:absolute; width:100%; height:100%; z-index:-1; }

.quote{ margin:0;  }
.quote p{ font-size:2.25rem; color:#555555; }
.quote__container{margin:3rem 0; padding:0.5rem 2rem; border-left:1rem solid #EEEEEE; }
.quote__author{ position:relative; margin-left:1.5rem; font-style: italic; }
.quote__author:before{ content:""; position:absolute; width:1rem; height:0.063rem; background-color: #757575; left:-1.5rem; top:1rem;  }

.breadcrumbs { margin-top:1rem; }
.breadcrumb__list{ list-style-type: none; padding-left:0; margin:0; display:inline-block; }
.breadcrumb{ float:left; font-size:1.15rem; }
.breadcrumb:not(:last-child){ padding-right: 2rem; position:relative; }
.breadcrumb:not(:last-child):before { content:""; position:absolute; width:0.35rem; height:0.35rem; border-top: 0.063rem solid rgba(0,0,0,0.3); border-right: 0.063rem solid rgba(0,0,0,0.5); top:0.75rem; right:1rem; transform-origin: center; transform: rotate(45deg); }
.breadcrumb__link{ font-size:1.10rem; }

/* Modifier Classes */

/*rgba(22,3,27,0.75) 10%, rgba(49,9,60,0.45)*/
.hero{ background-color:#993232; background-image: radial-gradient(ellipse at 50% 100%, rgba(153, 50, 50, 0.1), rgba(0,0,0,0.25) 75%),linear-gradient(180deg, rgba(22,3,27,0.85) 10%, rgba(49,9,60,0.65) 100%); min-height:30rem; display:grid; position:relative; z-index:0; overflow:hidden;  }
.hero-header__container{ width:100%; padding:0;}
.hero__background{ position:absolute; width:100%; height:100%; background-image: url("http://matthewvisyak.com/new-site/images/design/microbesUpperPart.jpg"); background-repeat: no-repeat; background-size: cover; z-index:-1; opacity:0.08;}
.hero-header{ padding: 0 2.5rem; display:grid; grid-template-columns: 3.5rem 1fr; grid-column-gap: 1rem; grid-row-gap:2rem; }
.hero-header__icon{ max-width:3.5rem; margin-top: -1rem; margin-bottom:-1rem; }
.hero-header__heading{ padding:0; text-shadow: 0.063rem 0.063rem 0.125rem rgba(0,0,0,0.6); color:#ffffff; font-size:1.35rem; text-decoration: none; grid-column: 2/4; }
.hero-header__navigation{ grid-column: 1 / -1; }
.hero__content-container{ align-content:flex-end; }
.hero__text{ color:white; text-shadow: 0.063rem 0.063rem 0.125rem rgba(0,0,0,0.6); font-size:1.35rem; }
.hero__tagline{ font-size:2.35rem; color:#9bc2f2; font-weight:600; text-shadow: 0.063rem 0.063rem 0.125rem rgba(0,0,0,0.6);}
.hero--no-text .hero__tagline{ font-size:2.5rem; }

.hero--content-page.hero{ min-height:0; padding-bottom: 0; } 

.navigation{  }
.navigation__list{ position:relative; margin:1rem 0 0 0; padding:0.5rem 0; float:left; list-style-type: none; }
.navigation__list:before { content:""; position:absolute; left:-100vw; top:0; width:200vw; height:100%; background-color: rgba(0,0,0,0.35); z-index:-1; }
.navigation__item{ float:left; margin: 0 1.5rem 0.5rem 0; }
.navigation__item:last-child{ margin-right: 0; }
.navigation__item a{ text-decoration: underline; color:rgba(255,255,255,0.9); font-size:1rem; }

.section__title{ padding-top:0;}
.section__content{ position:relative; z-index:1;}

.section__color-bg{ display:grid; padding-bottom:20rem; margin-bottom: -10rem;  }
.section__color-bg .content-container{ grid-column:3; padding:0; }
.section__color-bg .content__background{ grid-column:3; padding:0; height:calc(100% - 15rem); }
.section__color-bg .content__background-image{ position:absolute; width:100%; height:100%; opacity:0.25; z-index:-1; filter: saturate(0); background-size: cover; background-repeat: no-repeat;  overflow:hidden; }
.section__color-bg .content__background-image img{ height:100%; width:auto; }
.section__color-bg .content__background-image:before {content:""; position:absolute; width:100%; height:100%; }

.section--blue .content__background{ background-color: #6ea6ec; background-image:radial-gradient(ellipse at 50% 50%, rgba(110, 166, 236, 0.2), rgba(12,32,98,0.35) 75%),linear-gradient(180deg, rgba(16,65,126,0.2) 10%, rgba(16,65,126,0.7) 90%); }
.section--blue .section__title{ color:white; text-shadow: 0.063rem 0.063rem 0.125rem rgba(12,32,98,1); }
.section--blue .section__content p{ color:white; text-shadow: 0.063rem 0.063rem 0.125rem rgba(12,32,98,1); }
.section--blue .section__content a{ color:#ffd6d6; text-shadow: 0.063rem 0.063rem 0.125rem rgba(12,32,98,1); }

.section--pink .content__background{ background-color: #d04d6f; background-image:radial-gradient(ellipse at 50% 50%, rgba(208, 77, 111, 0.2), rgba(110,14,61,0.35) 75%),linear-gradient(180deg, rgba(140,23,53,0.2) 10%, rgba(140,23,53,0.7) 90%); }
.section--pink .section__title{ color:white; text-shadow: 0.063rem 0.063rem 0.125rem rgba(110,14,61,1); }
.section--pink .section__content p{ color:white; text-shadow: 0.063rem 0.063rem 0.125rem rgba(110,14,61,1); }
.section--pink .section__content a{ color:#ffd6d6; text-shadow: 0.063rem 0.063rem 0.125rem rgba(110,14,61,1); }

.section--left{ grid-template-columns: 1fr 2.5rem minmax(0, 55rem) 2.5rem 1fr; }
.section--left .content__background{ grid-column:1 / 5; border-radius: 0; } 
.section--left .content__background-image{ border-radius: 0 1rem 1rem 0; }
.section--left .content__background-image:before {background-image: linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 0) 80%, rgba(255, 255, 255, 1) 100%), radial-gradient(ellipse at 75% 25%, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 75%);}

.section--right{ grid-template-columns: 1fr 2.5rem minmax(0, 55rem) 2.5rem 1fr; }
.section--right .content-container{ grid-column:3; }
.section--right .content__background{ grid-column:2 / 7; border-radius: 0; } 
.section--right .content__background-image{ border-radius: 1rem 0 0 1rem; }
.section--right .content__background-image:before {background-image: linear-gradient(180deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0) 20%, rgba(255, 255, 255, 0) 80%, rgba(255, 255, 255, 1) 100%), radial-gradient(ellipse at 25% 25%, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 75%);}

.section--footer{ }
.section--footer:before{ content:""; position:absolute; width:100%; height:100%; left:0; top:0; background-image: linear-gradient(180deg, rgba(235,235,235,0.55), rgba(225, 225, 225, 1) 80%); z-index:-1; }
.section--footer:after{ content:""; position:absolute; width:100%; height:0.063rem; left:0; top:0; background-image: linear-gradient(90deg, rgba(242,242,242,1) 10%, rgba(175, 175, 175, 1) 50%, rgba(242,242,242,1) 90%); z-index:-1; }
.footer .content-container{ display:grid; grid-row-gap: 2rem; }
.footer__copyright{ grid-column: 1 / -1;}
.footer__social{ }

.triangle__container{ list-style-type: none; margin:0; padding:0; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; grid-template-rows: 0.8fr 0.9fr 1fr 1.3fr; width:100%; aspect-ratio:3 / 2; background-color: #6e0e3d; background-image: linear-gradient(53deg, rgba(255,255,255, 1) 33.25%, rgba(255,255,255, 0) 33.3%), linear-gradient(-53deg, rgba(255,255,255, 1) 33.25%, rgba(255,255,255, 0) 33.3%); }
	.triangle__item{ display:block; height:100%; width:100%; margin:0; }
	.triangle__item--pillar1{ grid-column: 1 / 3; grid-row: 1 / 3; }
	.triangle__item--pillar2{ grid-column: 3 / 5; grid-row: 1 / 3; }
	.triangle__item--pillar3{ grid-column: 2 / 4; grid-row: 3 / 5; }
	.triangle__item--circle{ grid-column: 2 / 4; grid-row: 2 / 4; z-index:1; background-image: radial-gradient(ellipse at center, rgba(255, 255, 255, 1) 65%, rgba(255, 255, 255, 0) 65.5%); height:80%; }
	.triangle__link{ display:grid; height:100%; width:100%; align-content: center; justify-content: center; color:rgba(255,255,255, 0.85); text-shadow: 0 0.063rem 0.125rem rgba(0,0,0,0.5); font-weight: bold; white-space: nowrap; }
	.triangle__link:focus, .triangle__link:hover { color:rgba(255, 255, 255, 1); }
	.triangle__item--pillar1 .triangle__link, .triangle__item--pillar2 .triangle__link{ margin-bottom: 3rem; height:calc(100% - 3rem); }
	.triangle__item--pillar1:focus, .triangle__item--pillar1:hover{ background-image: linear-gradient(140deg, rgba(255,255,255,0.35) 10%, rgba(255,255,255,0) 60%); } 
	.triangle__item--pillar2:focus, .triangle__item--pillar2:hover{ background-image: linear-gradient(-140deg, rgba(255,255,255,0.35) 10%, rgba(255,255,255,0) 60%); }
	.triangle__item--pillar3:focus, .triangle__item--pillar3:hover{ background-image: linear-gradient(0deg, rgba(255,255,255,0.35) 10%, rgba(255,255,255,0) 70%); }
	.triangle__item--circle .triangle__link{ color: #6e0e3d; padding:1rem 5rem; width:calc(100% - 10rem); height:calc(100% - 2rem); text-align: center; text-shadow: none; }
	.triangle__item--circle:focus, .triangle__item--circle:hover{ background-image: radial-gradient(ellipse at center, rgba(255, 255, 255, 1) 67.5%, rgba(255, 255, 255, 0) 68%); }
.triangle__link--longer-label{ visibility: hidden; width:0.063rem; height:0.063rem; display:block; }

.aside-box{ max-width:22.5rem; background-color:#EEEEEE; float:left; margin:0 2.5rem 1.5rem 0; padding:2rem; border-radius: 0.5rem; border-bottom:0.063rem solid #CCCCCC; }
.aside-box__heading{ color:#666666; padding:0; font-weight: lighter;}
.aside-box__content{ margin-top:2rem;}
.aside-box__content p, .aside-box__content ul li, .aside-box__content ol li{ color:#666666; }
.aside-box__content a{ color: #444444; }

.pillar-accent{ position:relative; padding-bottom: 2rem; }
.pillar-accent:before{ content:""; position:absolute; width:100%; height:0.5rem; left:0; bottom:0; background-color: #666666; z-index:0; }
.pillar-accent:after{ content:""; position:absolute; width:100%; height:0.5rem; left:0; bottom:0; background-image: linear-gradient(90deg, rgba(0,0,0,0.15) 5%, rgba(0,0,0,0) 10%, rgba(255,255,255,0) 25%, rgba(255,255,255,0.35) 50%, rgba(0,0,0,0) 100%); z-index:0; }
.pillar-accent--maroon:before{ background-color: #771461; }
.pillar-accent--blue:before{ background-color: #142077; }
.pillar-accent--green:before{ background-color: #147743; }

#footerArea{ width:100%; display:block; background-color:#f2f2f2; padding:50px 0px 60px 0px; margin-top:80px; }
#footerArea .left{ width:50%; text-align:left; vertical-align:top; float:left; }
#footerArea .right{ width:50%; text-align:right; vertical-align:top; float:left; }
#footerArea .full{ width:100%; text-align:left; float:left;}

@media only screen and (min-width: 40.625rem)
{
	.triangle__item--pillar1 .triangle__link, .triangle__item--pillar2 .triangle__link{ margin-bottom: 5rem; height:calc(100% - 5rem); }
	.hero-header{ grid-template-columns: 5rem 0.5fr 0.5fr; grid-column-gap: 1.5rem; }
	.hero-header__icon{ max-width:5rem; margin-top: -1.5rem; margin-bottom:-1.5rem; }
	.hero-header__heading{ font-size:1.5rem; }
}

@media only screen and (min-width: 43.75rem)
{
	
	.triangle__link--longer-label{ visibility:visible; width:auto; height:auto; display:inline; }
	
}

@media only screen and (min-width: 46.875rem)
{
	.footer .content-container{ grid-template-columns: 0.4fr 0.6fr; }
	.footer__social{ justify-self: flex-end; }
	.hero__tagline{ font-size:2.75rem; }
	.hero--no-text .hero__tagline{ font-size:3.25rem; }
}

@media only screen and (min-width: 50rem)
{
	.section--left{ grid-template-columns: 1fr 5rem minmax(0, 55rem) 5rem 5rem 1fr; }
	.section--left .content__background{ grid-column:1 / 5; border-radius: 0 1rem 1rem 0; } 
	.section--right{ grid-template-columns: 1fr 5rem 5rem minmax(0, 55rem) 2.5rem 1fr; }
	.section--right .content-container{ grid-column:4; }
	.section--right .content__background{ grid-column:3 / 7; border-radius: 1rem 0 0 1rem; } 
	.content-container { padding: 0 5rem;}
	.hero-header{ padding:0; grid-row-gap:3rem; }
}

@media only screen and (min-width: 53.125rem)
{
	.hero__tagline{ font-size:3.25rem; }
	.hero--no-text .hero__tagline{ font-size:4rem; }
	.hero__text{ font-size:1.5rem; }
}

@media only screen and (min-width: 64rem)
{
	.hero-header{ grid-template-columns: 5rem 0.4fr 0.5fr; }
	
}

@media only screen and (min-width: 68.75rem) 
{
	.hero__tagline{ font-size:4.25rem; }
	.hero--no-text .hero__tagline{ font-size:5rem; }
}

@media only screen and (min-width: 71.875rem) 
{
	.hero-header__heading{ grid-column:2; }
	.hero-header__navigation{ grid-column: 3; }
	.navigation__list:before { background-color: rgba(0,0,0,0); }
	.navigation__list{ float:right; padding:0; margin:0; }
	
	.hero--content-page.hero{ padding-bottom: 5rem; } 
}

@media only screen and (min-width: 75rem) 
{
	.hero-header{ grid-template-columns: 6.5rem 0.5fr 0.5fr; grid-column-gap: 2rem; }
	.hero-header__icon{ max-width:6.5rem; margin-top: -2rem; margin-bottom:-2rem; }
	.hero-header__heading{ font-size:1.85rem; }
}

@media only screen and (min-width: 77.5rem) 
{
	.section--left{ grid-template-columns: 1fr 5rem minmax(0, 60rem) 5rem 1fr; }
	.section--right{ grid-template-columns: 1fr 5rem minmax(0, 60rem) 5rem 1fr; }
	.section--right .content-container{ grid-column:3; }
	.section--right .content__background{ grid-column:2 / 6; border-radius: 1rem 0 0 1rem; } 
	
	.section__color-bg .content__background-image img{ width:100%; height:auto; }
}