.bg1 {
			background-image: url("/social-research-lab/images/bg2.jpg"); height: auto; background-position: bottom center; background-repeat: no-repeat; background-size: cover; padding-top: 40px;
		}
		.bg1 h1 {
			color:#013c65;
		}

		.bg1 p {
			color: #666; font-size: 1.175em; width: 60%; text-align: center; margin: 0 auto;
		}
		.bg1 blockquote {
			border:none;
		}
		.bg2 {
			background-image: url("/social-research-lab/images/bg3.jpg"); background-position: bottom center; background-repeat: no-repeat; background-size: cover;
		}
		.bg3 {
			background-image: url("/social-research-lab/images/bg2.jpg"); height:auto;background-position: top center; background-repeat: no-repeat; background-size: cover;
		}
		.bg4 {
			background-image: url("/economic-impact/images/bg/commencement-bright.jpg"); height:auto; background-position: top center; background-repeat: no-repeat; background-size: cover;
		}
		.bg5 {
			background-image: url("/economic-impact/images/bg/campus-commons-exterior.jpg"); height:auto; background-position: top center; background-repeat: no-repeat; background-size: cover;
		}
		.bg6 {
			background-image: url("/economic-impact/images/bg/colorado-foothills.jpg"); height:auto; background-position: center center; background-repeat: no-repeat; background-size: cover;
		}
		.eir-container {
			width:1200px; margin: 0 auto; text-align: center;
		}
		.eir-wrapper {
			width: 62.5em; text-align: center; margin: 0 auto; padding-top: 3%
		}
		.eir-info {
			float:left;
		}
		.bignum {
			font-family: 'Lato', sans-serif; color:#003a72; font-size:3.0em; font-weight:600; line-height: 1.5em;
		}
		.topnum {
			top: 100px; font-family: 'Lato', sans-serif; color:#003a72; font-size:3.75em; font-weight:600; line-height: 1.5em;
		}
		.numctr {
			text-align: center; margin: 0 auto;
		}
		.numblue {
			color:#003a72
		}
		.numgold {
			color: #f6b000;
		}
		.bright {
			color: #fff;
		}
		.smalltext {
			font-size: 1.25em;
		}
		.img-icon {
			text-align: right; width:100px; float: left; padding: 20px;
		}
		.eir-info-r {
			float:left;
		}
		.img-icon-r {
			text-align: right; width:100px; float: left; padding: 20px;
		}
		.block {
			display: block;
		}
		.forty {
			width: 40%;
		}
		.fifty {
			width: 50%;
		}
		.sixty {
			width: 60%; margin: 0 auto;
		}
		@media only screen and (max-width: 600px) {
		  .bg1 p, .forty, .fifty, .sixty {
    			width: 100%;
				padding: 5px;
				margin: 0 auto;
  			}
		  .img-icon, .eir-info {
			      margin: 0 auto;
    			  float: none;
   			 	  text-align: center !important;
		  }
		}
		@media only screen and (max-width: 1000px) {
		  .bg1 p, .forty, .fifty, .sixty {
    			width: 85%;
				padding: 5px;
				margin: 0 auto;
  			}
		  .img-icon, .eir-info {
			      margin: 0 auto;
    			  float: none;
   			 	  text-align: center !important;
		  }
		}

/*
  https://developer.mozilla.org/en/docs/Web/CSS/box-shadow
  box-shadow: [inset?] [top] [left] [blur] [size] [color];

  Tips:
    - We're setting all the blurs to 0 since we want a solid fill.
    - Add the inset keyword so the box-shadow is on the inside of the element
    - Animating the inset shadow on hover looks like the element is filling in from whatever side you specify ([top] and [left] accept negative values to become [bottom] and [right])
    - Multiple shadows can be stacked
    - If you're animating multiple shadows, be sure to keep the same number of shadows so the animation is smooth. Otherwise, you'll get something choppy.
*/

// Animate the size, inside
.fill:hover,
.fill:focus {
  box-shadow: inset 0 0 0 2em var(--hover);
}

// Animate the size, outside
.pulse:hover,
.pulse:focus {
  animation: pulse 1s;
  box-shadow: 0 0 0 2em rgba(#fff, 0);
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 var(--hover);
  }
}

// Stack multiple shadows, one from the left, the other from the right
.close:hover,
.close:focus {
  box-shadow: inset -3.5em 0 0 0 var(--hover), inset 3.5em 0 0 0 var(--hover);
}

// Size can also be negative; see how it's smaller than the element
.raise:hover,
.raise:focus {
  box-shadow: 0 0.5em 0.5em -0.4em var(--hover);
  transform: translateY(-0.25em);
}

// Animating from the bottom
.up:hover,
.up:focus {
  box-shadow: inset 0 -3.25em 0 0 var(--hover);
}

// And from the left
.slide:hover,
.slide:focus {
  box-shadow: inset 6.5em 0 0 0 var(--hover);
}

// Multiple shadows, one on the outside, another on the inside
.offset {
  box-shadow: 0.3em 0.3em 0 0 var(--color), inset 0.3em 0.3em 0 0 var(--color);

  &:hover,
  &:focus {
    box-shadow: 0 0 0 0 var(--hover), inset 6em 3.5em 0 0 var(--hover);
  }
}

// Basic button styles
button {
  background: none;
  border: 2px solid;
  font: inherit;
  line-height: 1;
  margin: 0.5em;
  padding: 1em 2em;
}