/*! HTML5 Boilerplate v5.3.0 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}
/*UNIT SIGNATURE*/
.unit-sig-32 { width:188px; margin:2em auto; display:block;
}
.unit-sig-48 { display:none;
}

.unit-sig-32 .logo,
.unit-sig-32 .wordmark,
.unit-sig-32 .unit {
  margin: 0;
}
.unit-sig-32 .logo a,
.unit-sig-32 .wordmark a,
.unit-sig-32 .unit a {
  display: block;
  text-indent: 120%;
  white-space: nowrap;
  overflow: hidden;
  padding: 0;
  background-position: left 0;
  background-repeat: no-repeat;
}
.unit-sig-32.center .logo a,
.unit-sig-32.center .wordmark a,
.unit-sig-32.center .unit a {
  margin-left: auto;
  margin-right: auto;
}
.unit-sig-32 .wordmark,
.unit-sig-32 .unit {
  margin-left: 42px;
}
.unit-sig-32.center .wordmark,
.unit-sig-32.center .unit {
  margin-left: 0;
}
.unit-sig-32 .logo a {
  width: 34px;
  height: 38px;
  background-image: url('../images/identity/mu-logo-32-stroked.svg');
  /* Neagative margin for 1px rule alignment */
  margin-left: -1px;
  float: left;
  margin-bottom: 10px;
}
.unit-sig-32.center .logo a {
  float: none;
}
.unit-sig-32 .wordmark a {
  width: 149px;
  height: 17px;
  background-image: url('../images/identity/unit-wordmark-32.svg');
  margin-bottom: 10px;
}
.unit-sig-32.reverse .wordmark a {
  background-image: url('../images/identity/unit-wordmark-32-white.svg');
}
.unit-sig-32 .wordmark a:hover,
.unit-sig-32 .wordmark a:focus,
.unit-sig-32 .wordmark a:active {
  background-position: left -17px;
}
.unit-sig-32 .unit {
  /* Adjust the space between unit name and wordmark as needed */
  margin-bottom: 4px;
}
.unit-sig-32 .unit a {
 
  /* Link to your 32px unit art file and set with and height */
  width: 146px;
  height: 56px;
  background-image: url('../images/identity/dps-32.svg');
}
.unit-sig-32 .unit a:hover,
.unit-sig-32 .unit a:focus,
.unit-sig-32 .unit a:active {
  /* Set the height to match your unit art file */
  background-position: left -55px;
}
/* If you want this size to print out, include this */
@media print {
  .unit-sig-32 .logo a,
  .unit-sig-32 .wordmark a,
  .unit-sig-32 .unit a {
    position: relative;
    background: none;
  }
  .unit-sig-32 .logo a:after,
  .unit-sig-32 .wordmark a:after,
  .unit-sig-32 .unit a:after {
    text-indent: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
  .unit-sig-32 .logo a:after {
    content: url('../images/identity/mu-logo-32.svg');
  }
  .unit-sig-32 .wordmark a:after {
    content: url('../images/identity/unit-wordmark-32.svg');
  }
  /* Link to your 32px unit art file, black text version */
  .unit-sig-32 .unit a:after {
    content: url('../images/identity/dps-32.svg');
  }
}
/* IE8 PNG fallback. Target with an ie8 class or place in your ie8 only stylesheet */
.ie8 .unit-sig-32 .logo a {
  background-image: url('../images/identity/mu-logo-32-stroked.png');
}
.ie8 .unit-sig-32.reverse .wordmark a {
  background-image: url('../images/identity/unit-wordmark-32-white.png');
}
.ie8 .unit-sig-32 .unit a {
  /* Link to your 32px unit art file */
  background-image: url('../images/identity/dps-32.png');
}
/* If you want this size to print out in ie8, include this */
@media print {
  .ie8 .unit-sig-32 .logo a {
    background-image: url('../images/identity/mu-logo-32-stroked.png');
  }
  .ie8 .unit-sig-32 .wordmark a,
  .ie8 .unit-sig-32.reverse .wordmark a {
    background-image: url('../images/identity/unit-wordmark-32.png');
  }
  /* Link to your 32px unit art file, black text version */
  .ie8 .unit-sig-32 .unit a:after {
    content: url('../images/identity/dps-32.png');
  }
}

/* UNIT SIGNATURE*/
@media only screen and (min-width:550px){
.unit-sig-32{display:none;
}
.unit-sig-48{display:block; padding:1em 0; width:451px; margin:auto auto;
}
.unit-sig-48 .logo,
.unit-sig-48 .wordmark,
.unit-sig-48 .unit {
  margin: 0;
}
.unit-sig-48 .logo a,
.unit-sig-48 .wordmark a,
.unit-sig-48 .unit a {
  display: block;
  text-indent: 120%;
  white-space: nowrap;
  overflow: hidden;
  padding: 0;
  background-position: left 0;
  background-repeat: no-repeat;
}
.unit-sig-48.center .logo a,
.unit-sig-48.center .wordmark a,
.unit-sig-48.center .unit a {
  margin-left: auto;
  margin-right: auto;
}
.unit-sig-48 .wordmark,
.unit-sig-48 .unit {
  margin-left: 63px;
}
.unit-sig-48.center .wordmark,
.unit-sig-48.center .unit {
  margin-left: 0;
}
.unit-sig-48 .logo a {
  width: 50px;
  height: 56px;
  background-image: url('../images/identity/mu-logo-48-stroked.svg');
  /* Neagative margin for 1px rule alignment */
  margin-left: -1px;
  float: left;
  margin-bottom: 15px;
}
.unit-sig-48.center .logo a {
  float: none;
}
.unit-sig-48 .wordmark a {
  width: 183px;
  height: 20px;
  background-image: url('../images/identity/unit-wordmark-48.svg');
  margin-bottom: 15px;
}
.unit-sig-48.reverse .wordmark a {
  background-image: url('../images/identity/unit-wordmark-48-white.svg');
}
.unit-sig-48 .wordmark a:hover,
.unit-sig-48 .wordmark a:focus,
.unit-sig-48 .wordmark a:active {
  background-position: left -20px;
}
.unit-sig-48 .unit {
  /* Adjust the space between unit name and wordmark as needed */
  margin-bottom: 0px;
}
.unit-sig-48 .unit a {
  /* Link to your 48px unit art file and set with and height */
  width: 388px;
  height: 41px;
  background-image: url('../images/identity/dps-48.svg');
}
.unit-sig-48 .unit a:hover,
.unit-sig-48 .unit a:focus,
.unit-sig-48 .unit a:active {
  /* Set the height to match your unit art file */
  background-position: left -41px;
}
/* If you want this size to print out, include this */
@media print {
  .unit-sig-48 .logo a,
  .unit-sig-48 .wordmark a,
  .unit-sig-48 .unit a {
    position: relative;
    background: none;
  }
  .unit-sig-48 .logo a:after,
  .unit-sig-48 .wordmark a:after,
  .unit-sig-48 .unit a:after {
    text-indent: 0;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
  .unit-sig-48 .logo a:after {
    content: url('../images/identity/mu-logo-48.svg');
  }
  .unit-sig-48 .wordmark a:after {
    content: url('../images/identity/unit-wordmark-48.svg');
  }
  /* Link to your 48px unit art file, black text version */
  .unit-sig-48 .unit a:after {
    content: url('../images/identity/dps-48.svg');
  }
}

/* IE8 PNG fallback. Target with an ie8 class or place in your ie8 only stylesheet */
.ie8 .unit-sig-48 .logo a {
  background-image: url('../images/identity/mu-logo-48-stroked.png');
}
.ie8 .unit-sig-48 .wordmark a {
  background-image: url('../images/identity/unit-wordmark-48.png');
}
.ie8 .unit-sig-48.reverse .wordmark a {
  background-image: url('../images/identity/unit-wordmark-48-white.png');
}
.ie8 .unit-sig-48 .unit a {
  /* Link to your 32px unit art file */
  background-image: url('../images/identity/dps-48.png');
}
/* If you want this size to print out in ie8, include this */
@media print {
  .ie8 .unit-sig-48 .logo a {
    background-image: url('../images/identity/mu-logo-48-stroked.png');
  }
  .ie8 .unit-sig-48 .wordmark a,
  .ie8 .unit-sig-48.reverse .wordmark a {
    background-image: url('../images/identity/unit-wordmark-48.png');
  }
  /* Link to your 48px unit art file, black text version */
  .ie8 .unit-sig-48 .unit a:after {
    content: url('../images/identity/dps-48.png');
  }
}
}
@media only screen and (min-width:800px){
.unit-sig-48{display:inline; float:left; padding-top:1em
}
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */


@font-face{font-family:proxima-nova;
src:url(../fonts/ProximaNova-Light-webfont.woff) format('woff');font-weight:300;
	font-style:normal;-webkit-font-smoothing: antialiased;}

@font-face{font-family:proxima-nova;
src:url(../fonts/ProximaNova-LightIt-webfont.woff) format('woff');
font-weight:300;
font-style:italic;-webkit-font-smoothing: antialiased;}

@font-face{font-family:proxima-nova;
src:url(../fonts/ProximaNova-Reg-webfont.woff) format('woff');
font-weight:400;
font-style:normal;-webkit-font-smoothing: antialiased;}

@font-face{font-family:proxima-nova;
src:url(../fonts/ProximaNova-RegIt-webfont.woff) format('woff');
font-weight:400;
font-style:italic;-webkit-font-smoothing: antialiased;}

@font-face{font-family:proxima-nova;
src:url(../fonts/ProximaNova-Bold-webfont.woff) format('woff');
font-weight:700;
font-style:normal;-webkit-font-smoothing: antialiased;}

@font-face{font-family:proxima-nova;
src:url(../fonts/ProximaNova-BoldIt-webfont.woff) format('woff');
font-weight:700;
font-style:italic;-webkit;-font-smoothing: antialiased;}


audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

body { width:100%; height:100%; background-color:#8f8885;  font-family:"proxima-nova", Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:400; letter-spacing:.02em;
}
a {color:#900000;
}
.prxma3,.prxma3i,.prxma4,.prxma4i,.prxma7,.prxma7i{font-family:"proxima-nova", Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; 
}
.prxma3,.prxma3i {font-weight:300;
}
.prxma4,.prxma4i {font-weight:400;
}
.prxma7,.prxma7i {font-weight:700;
}
.prxma3i,.prxma4i,.prxma7i {font-style:italic;
}
.expletus4,.expletus4i,.expletus5,.expletus5i,.expletus6,.expletus6i,.expletus7,.expletus7i {font-family: "expletus-sans", sans-serif;
}
.expletus4,.expletus4i {font-weight:400;
}
.expletus5,.expletus5i {font-weight:500;
}
.expletus6,.expletus6i {font-weight:600;
}
.expletus7,.expletus7i {font-weight:700;
}
.expletus4i,.expletus5i,.expletus6i,.expletus7i {font-style:italic;
}
.judson,.judsonI {font-family: judson, serif; font-weight:400;
}
.judsonI {font-style:italic; letter-spacing:-.01em;
}
/*h2 { font-size:1.1em; margin-bottom:1.5em;
}
h4 {margin:0; color:rgba(255,255,255,.9); font-size:1.2em; line-height:.8em; padding:2em 0; letter-spacing:-.01em; text-align:center; background-color:rgba(0,0,0,.2);
}
h5 { font-size:1.1em; font-weight:normal; color:white; padding:.62em; background-color:#444; letter-spacing:.05em; border-right:#6CDA59 solid 5px}
p {clear:both;
}
a {color:black; font-weight:bold;
}*/
h4 { font-size:1.7em; margin-bottom:0; line-height:1.2em;
}
h5 { margin-top: 0; font-size:1.2em;
}
video {margin-bottom:1em;
}
.ltgreen {color: #6CDA59;
}
.gold {color:#f1b92c;
}
.hvrGld:hover {color:#f1b92c;
}
.white {color:#fff;
}
.drkGrey { color:#444;
}
.red {color:#900000;
}
.center {text-align:center;
}
.geoIt {font-style:italic; font-family: Georgia, Constantia, "Lucida Bright", "DejaVu Serif", serif; line-height:95%
}
.txtMed{font-size: medium;
}
.lnHT1 {line-height:1em;
}
.per75{font-size:75%;
}
.per125{font-size:125%;
}
.per150{font-size:150%;
}
.per175{font-size:175%;
}
.margTP0{ margin-top:0;
}
.margTP5 {margin-top:.5em;
}
.margBT0 {margin-bottom:0;
}
.margBT5 {margin-bottom:.5em;
}
.right{ float:right;
}
.indent20 { padding-left:20px;
}
.normal {font-weight:normal;
}
.smallCaps {font-variant:small-caps;
}
.allCaps  { text-transform:uppercase;
}
.noWrap {text-wrap:none;
}
.noUnderline { text-decoration:none;
}
.noDecor { list-style:none;
}
.inlineBlock{display:inline-block;
}
.half{ width:100%; margin-bottom:1em;
}
.full{ width:100%; margin-bottom:1em;
}
.secHalf{ width:96%; background-color:white; padding:2%;
}
.secHalf:nth-child(odd){margin-bottom:1em;
}
.secFull{ width:96%; background-color:white; padding:2%;
}
.container {  max-width:1485px; margin:auto auto; width:100%; height:inherit; min-height:-500px;
}
.headerContainer {background-color:#000; height:auto; float:left; width:100%;
}
.header {  width:90%; margin:auto auto;  padding:1.5em 5% 1.5em 5%; max-width:1485px; 
}
.title{ font-size:1.2em; font-weight:bold; text-align:center; margin:0; float:right; width:100%; line-height:1.1em; color:white; padding-bottom:2em;
} 
.menuContainer{background-color: #f1b92c; clear:both;
}
.menu {
	text-transform:uppercase;
	max-width:1485px;
	text-align: center;
	width:90%;
	margin:auto auto; 
	padding: .5em 0;
}
.menu a,.menu a:active,.menu a:visited,.menu a:hover { color:black; font-weight:normal; text-decoration:none;
}
.sd { float:left; width:100%;
}	
.sd p{color:#fff; margin:0; width:80%; padding: 1.5em 10% 1em 10%;  background-color:rgba(0,0,0,0.3); line-height:1.3em; letter-spacing:.05em;
}
.homeContain {  float:left; width:90%; padding:10% 5%; background-color:#eeeeef
}
.homeContain a,.homeContain a:active,.homeContain a:visited,.homeContain a:hover {color:black; text-decoration:none; font-weight:normal;
}
.btnContain { width:100%; float:left; z-index:0; position:relative;
}
.twitter { width:94%; background-color:#fff; height:45em; float:right; padding:2em 3% 0 3%; overflow:scroll;
}
.btnBorder {
	 float:left;
	width: 96%;
	background-color: white;
	padding: 2%;
	height: auto;
	margin: 0 auto 1.7em auto;
	position: relative;
	-webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.3);
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.3);
}
.btnBorder:before
{
	content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 40px rgba(0,0,0,0.8);
    		box-shadow:0 0 40px rgba(0,0,0,0.8);
    bottom:0;
	width:80%;
	height:25%;
    -moz-border-radius:100%;
    border-radius:100%;
	left:10%;
	right:10%;
}

.cancel,.cancel2,.button,#lrgIMG a ,#lrgIMG:target, #lrgIMG:target + #cover,,#lrgIMG2 a,#lrgIMG:target, #lrgIMG2:target + #cover2, .noShowIMG {display:none;
}
.hideMobile {display:none;
}
.hideMobile a {pointer-events: none; cursor: default;
}
.secondaryContent a img{margin-bottom:0 !important;
}
#research,#people,#tools,#impacts{float:left; position: relative; background-position:top center; height:9em; width:100%;  overflow:hidden;
background-repeat: no-repeat;
background-size: cover;
}
#research{background-image:url('../images/research.jpg')
}
#people{background-image:url('../images/people.jpg')
}
#tools{background-image:url('../images/tools.jpg')
}
#impacts{background-image:url('../images/impacts.jpg')
}
h3 {position:absolute; margin:0; padding-top:.5em; 
	border-top: none;
	text-transform:uppercase;
	font-weight:normal;
	letter-spacing:.04em;
	bottom:.7em;
	text-align:left;
	line-height: 2.8em; 
	font-size: .9em; display: inline;
}
h3 span { padding: 0.8em 1.4em .7em 1.4em; background-color: rgba(241,186,9,0.90);
}
.contentContain h3 { position:relative; top:0; font-size:1.7em; display:block; color:#888; letter-spacing:-.02em; font-style:italic; font-family: Georgia, Constantia, "Lucida Bright", "DejaVu Serif", serif; text-transform: none; line-height: 1.5em; text-align:center; padding:0; 
}
.twitter-timeline{ width:100% !important; background:white; height:40em !important;
}
.contentContain {background-color:#fff; float:left; width:90%; padding: 5% 5% 10% 5%;
}
.contHR {margin: 4em 0 3em 0;
}
.mainContent { width:100%;
}
.secondaryContent { width:94%; background-color:#eee; padding:3%; height:auto;
}
.secondaryContent h4 {color:#900000; line-height:1em; font-size:135%
}
.bio {width:100%;
}
.bio img{width:100%; margin: 2em auto auto auto; max-width:250px; height:auto; border-radius:50%; display:block;
}
.bio h4,.bio h5,.bio h6 {display:block; text-align:center;
}
.bio h6{font-size:100%; color:#bbb; margin-top:0;
}
.bio h6 a{ text-decoration:none; color:#bbb;
}
.bio hr{ margin: 4em 0; border: solid 25px #eeeeef; 
}
.bio h5{color:#900000;
}
.undergrad h5 {color:black;
}
.undergrad span{color:#900000;
}
.footerContain {background-color:#555; height:auto; float:left; width:100%;
}
footer{ padding:0 5% 0 5%; overflow: auto; height:inherit; clear:both; width:90%; margin:auto auto;  max-width:1485px; opacity:.8;
}
footer a,footer a:hover,footer a:visited,footer a:active,footer a:focus{ color:white; text-decoration:none; 
}
footer div{ width:100%; color:white; float:left; padding:5% 0; text-align:center;
}
footer div:not(:first-child) { border-top: solid thin #999;
}
footer hr{display:none;
}
footer a{opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}
footer a:hover {opacity: .7; 
}
.hideMob {display:none;
}
#twitter{text-decoration: none;
margin: auto auto;
display: block;
float: none;
transition: background-position 0.3s ease;
position: 0 0; 
repeat:none;
width: 60px;
height: 50px;
background: url('../images/twitter.svg');
background-size:60px 100px;
}
#twitter:hover,#twitter:focus{background-position:0 -50px;
}
@media only screen and (min-width:350px){

#research,#people,#tools,#impacts{ height:12em
}
h3 {bottom:.8em;
	line-height: 2.7em; 
	font-size:1.2em;
}
}
@media only screen and (min-width:500px){
.sd p{ float:right; color:#fff;  width:42%; padding: 4% 4% 4% 4%; font-size:115%;   background-color: rgba(0,0,0,0.4);
}
.btnBorder { width:43%; margin:0 auto 2.5em auto;
}
.btnBorder:nth-child(odd) { margin-right:6%;
}
#research,#people,#tools,#impacts{height:16em;
}
h3 {bottom:1.3em;
	line-height: 2.8em; 
	font-size:1.3em;
}
.half{ width:49%; float:;left;
}
.half:nth-child(even){margin-right:2%;
}

}
@media only screen and (min-width:800px){
.menu {text-align:right;
}
.title {   width:auto; padding-top:1em; text-align:right
}
.sd p {margin:6% 0 6% 0; width:27%;
}
.homeContain{ padding:5% 5% 2% 5%;
}
.contentContain { padding:2% 0 5% 5%; width:95%
}
.contentContain h3 { text-align:right; margin-right:5%;
}
.mainContent { width:48%; float:left; margin: 0 0 2em 7%;
}
.secondaryContent { width:27%; float:right; flear:both; margin:2em 0;
}
.btnContain{ width:62%;
}
.btnBorder { padding:8px;
}
.twitter-timeline{height:29em !important;
}
.twitter { width:27%; height: 34.6em;
}
.bio {width:81%; margin:5% 12% 5% 7%;
}
.bio img{float:left; width:30%; margin-right:3em; margin-top:0
}
.bio p{display:block; overflow:hidden; border-left: thin solid lightgrey; padding-left:2em;
}
.bio h4,.bio h5,.bio h6{text-align:left;
}
.undergrad h5 {color:black;
}
.undergrad span{color:#900000;
}
.hideMobile {display:block;
} 
.hideMobile a { pointer-events:auto; cursor:pointer;
}
.hideFull {display:none;
}
#cover{ position:fixed; top:0; left:0; background:rgba(0,0,0,0.6); z-index:5; width:100%; height:100%; display:none; 
}
.noShowIMG {display:block;
}
#lrgIMG,#lrgIMG2 {height:80%; width:75%; position:absolute; z-index:10; display:none; padding-top:10em
} 
#lrgIMG:target, #lrgIMG:target + #cover,#lrgIMG2:target, #lrgIMG2:target + #cover{ display:block; opacity:2;
} 
.cancel,.cancel2 { display:block; position:absolute; text-decoration:none;
}
.cancel img,.cancel2 img { width:100%; text-align:center;
}
.fade {opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}
.fade:hover {opacity: .7; 
}
footer{ padding:5%
}
footer div{ width:44.7%; padding:2em 2.5%;
}
footer div:nth-child(odd){border-right: solid thin #999;
}
footer div:not(:first-child) {border-top:none;
}
footer hr,.contentContain hr {display:block; clear:both; 
}
footer hr {padding-bottom:.7em; border-top: solid thin #999;
}
.half{ width:100%; float:;left;
}
.half:nth-child(even){margin-right:0;
}
.contHR {margin: 0 45% 0 7%;
}
@media only screen and (min-width:1025px){
.logo{ float:left;
}
.contentContain { padding:2% 5% 5% 5%; width:90%
}
.contentContain h3 {margin-right:0;
}
.secondaryContent { width:27%; float:right; flear:both; margin:2em 7% 2em 0; 
}
.bio {width:86%; margin:5% 7% 5% 7%;
}

.half{ width:49%; float:;left;
}
.half:nth-child(even){margin-right:2%;
}
footer div{ width:19.8%;
}
footer div:not(:first-child) { border-left: solid thin #999;
}
footer div:nth-child(odd){border-right:none;
}
footer hr {display:none
}
@media only screen and (min-width:1485px){

.undergrad { float:right; width:74%;
}
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden {
    display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 1.25dppx),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after,
    *:first-letter,
    *:first-line {
        background: transparent !important;
        color: #000 !important; /* Black prints faster:
                                   http://www.sanbeiji.com/archives/953 */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    /*
     * Printing Tables:
     * http://css-discuss.incutio.com/wiki/Printing_Tables
     */

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}