﻿@charset "utf-8";
/* CSS Document */

/* >>>>>>>>>>    Fonts     <<<<<<<<<<<<*/

/*
PROXIMA NOVA
font-family: proxima-nova, sans-serif;
-------------------
Proxima Nova Black - font-weight: 900;
-------------------
Proxima Nova Extrabold - font-weight: 800;
--------------------
Proxima Nova Bold & Bold Italic - font-weight: 700;
--------------------
Proxima Nova Semibold & Semibold Italic - font-weight: 600;
--------------------
Proxima Nova Regular & Italic - font-weight: 400;
--------------------
Proxima Nova Light - font-weight: 300;
--------------------
*/

/*
ROBOTO
font-family: 'Roboto', sans-serif;
-------------------
ROBOTO BLACK - font-weight: 900; (swap from 800)
-------------------
ROBOTO BOLD - font-weight: 700; (Same)
-------------------
ROBOTO REG - font-weight: 400; 
-------------------
ROBOTO LIGHT - font-weight: 300; (Swap from 400)
-------------------

*/

/*
POYNTER GOTHIC - NO LONGER USED
font-family: poynter-gothic-text, sans-serif;
-------------------
Poynter Gothic Black - font-weight: 800;
-------------------
Poynter Gothic Bold & Bold Italic - font-weight: 700;
-------------------
Poynter Gothic Reg & Italic - font-weight: 400;
-------------------
Poynter Gothic Light & Italic - font-weight: 300;
-------------------
*/



/*
/* >>>>>> Google Icons <<<<<<<*/
/* instructions - http://google.github.io/material-design-icons/#icon-font-for-the-web
search - https://material.io/resources/icons/?style=baseline
use example - <i class="material-icons">face</i>*/

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2.4rem; /* Preferred icon size was 24px */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;
    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;
    /* Support for IE. */
    font-feature-settings: 'liga';
}

    /* Rules for sizing the icon. */
    .material-icons.md-18 {
        font-size: 1.8rem;
    }

    .material-icons.md-24 {
        font-size: 2.4rem;
    }

    .material-icons.md-36 {
        font-size: 3.6rem;
    }

    .material-icons.md-48 {
        font-size: 4.8rem;
    }

/* >>>>>> clearfix for floats <<<<<<<*/
.clearfix {
    overflow: hidden;
}

    .clearfix::after {
        content: "";
        clear: both;
        display: table;
    }

/* >>>>>> REUSE <<<<<<<*/
/* --- Reuse Text--- */
.text-uppercase {
    text-transform: uppercase;
}

.text-initial {
    text-transform:initial;
}

.text-italic {
	font-style:italic;
}

/* --- Reuse Display --- */
.block {
    display: block;
}

.inline {
    display: inline;
}

.hidden {
    display: none !important;
}

/* --- Reuse Float --- */
.floatLeft {
    float: left;
}

.floatRight {
    float: right;
}

.clear {
    clear: both;
}

.clearRight {
    clear: right;
}

.clearLeft {
    clear: left;
}

/* --- Reuse Align --- */
.tAlignLeft {
    text-align: left;
}

.tAlignRight {
    text-align: right;
}

.tAlignCen {
    text-align: center;
}

.marginZeroAuto {
    margin: 0 auto;
    display: block;
}

/* --- Reuse Font Styles --- */
.italic {
    font-style: italic;
}

.strong {
    font-weight: bold;
}

.normal {
    font-weight: normal;
}

/* --- Reuse All Pad --- */
.pad0Horz {
    padding-left: 0px;
    padding-right: 0px;
}

.pad0 {
    padding: 0px;
}

.pad5 {
    padding: 5px;
}

.pad10 {
    padding: 10px;
}

.pad15 {
    padding: 15px;
}

.pad20 {
    padding: 20px;
}

.pad25 {
    padding: 25px;
}

.pad30 {
    padding: 30px;
}

.pad35 {
    padding: 35px;
}

/* --- Reuse Vert Pad --- */
.vpad5 {
    padding: 5px 0px;
}

.vpad10 {
    padding: 10px 0px;
}

.vpad15 {
    padding: 15px 0px;
}

.vpad20 {
    padding: 20px 0px;
}

.vpad25 {
    padding: 25px 0px;
}

.vpad30 {
    padding: 30px 0px;
}

.vpad35 {
    padding: 35px 0px;
}

.vpad100 {
	padding-top:100px;
		padding-bottom:100px;
}

/* --- Reuse Horizontal Pad --- */
.hpad0 {
    padding-left:0px;
    padding-right:0px;
}

.hpad5 {
    padding: 0px 5px;
}

.hpad10 {
    padding: 0px 10px;
}

.hpad15 {
    padding: 0px 15px
}

.hpad20 {
    padding: 0px 20px;
}

.hpad25 {
    padding: 0px 25px;
}

.hpad30 {
    padding: 0px 30px;
}

.hpad35 {
    padding: 0px 35px;
}

/* --- Reuse Left Right Pad --- */
.padLeftRight5 {
    padding-left: 5px;
    padding-right: 5px;
}

.padLeftRight10 {
    padding-left: 10px;
    padding-right: 10px;
}

.padLeftRight15 {
    padding-left: 15px;
    padding-right: 15px;
}

.padLeftRight20 {
    padding-left: 20px;
    padding-right: 20px;
}

.padLeftRight25 {
    padding-left: 25px;
    padding-right: 25px;
}

.padLeftRight30 {
    padding-left: 30px;
    padding-right: 30px;
}

.padLeftRight35 {
    padding-left: 35px;
    padding-right: 35px;
}

.padLeftRight40 {
    padding-left: 40px;
    padding-right: 40px;
}

/* --- Reuse Top Bottom Pad --- */
.padTopBot5 {
    padding-top: 5px;
    padding-bottom: 5px;
}

.padTopBot10 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.padTopBot15 {
    padding-top: 15px;
    padding-bottom: 15px;
}

.padTopBot20 {
    padding-top: 20px;
    padding-bottom: 20px;
}

.padTopBot25 {
    padding-top: 25px;
    padding-bottom: 25px;
}

.padTopBot30 {
    padding-top: 30px;
    padding-bottom: 30px;
}

.padTopBot35 {
    padding-top: 35px;
    padding-bottom: 35px;
}

.padTopBot75 {
    padding-top: 75px;
    padding-bottom: 75px;
}

/* --- Reuse Top Pad --- */
.padTop5 {
    padding-top: 5px;
}

.padTop10 {
    padding-top: 10px;
}

.padTop15 {
    padding-top: 15px;
}

.padTop20 {
    padding-top: 20px;
}

.padTop25 {
    padding-top: 25px;
}

.padTop30 {
    padding-top: 30px;
}

.padTop35 {
    padding-top: 35px;
}

.padTop100 {
	padding-top:100px;
}


/* --- Reuse Bottom Pad --- */
.padBot5 {
    padding-bottom: 5px;
}

.padBot10 {
    padding-bottom: 10px;
}

.padBot15 {
    padding-bottom: 15px;
}

.padBot20 {
    padding-bottom: 20px;
}

.padBot25 {
    padding-bottom: 25px;
}

.padBot30 {
    padding-bottom: 30px;
}

.padBot35 {
    padding-bottom: 35px;
}

.padBot40 {
    padding-bottom: 40px;
}

.padBot45 {
    padding-bottom: 45px;
}

.padBot50 {
    padding-bottom: 50px;
}

.padBot100 {padding-bottom:100px;}

/* --- Reuse Left Pad --- */
.padLeft0 {
    padding-left: 0px;
}

.padLeft5 {
    padding-left: 5px;
}

.padLeft10 {
    padding-left: 10px;
}

.padLeft15 {
    padding-left: 15px;
}

.padLeft20 {
    padding-left: 20px;
}

.padLeft25 {
    padding-left: 25px;
}

.padLeft30 {
    padding-left: 30px;
}

.padLeft35 {
    padding-left: 35px;
}

.padLeft40 {
    padding-left: 40px;
}

/* --- Reuse Right Pad --- */
.padRight5 {
    padding-right: 5px;
}

.padRight10 {
    padding-right: 10px;
}

.padRight15 {
    padding-right: 15px;
}

.padRight20 {
    padding-right: 20px;
}

.padRight25 {
    padding-right: 25px;
}

.padRight30 {
    padding-right: 30px;
}

.padRight35 {
    padding-right: 35px;
}

.padRight40 {
    padding-right: 40px;
}

.padRight50 {
    padding-right: 50px;
}

.padRight60 {
    padding-right: 60px;
}

.padRight70 {
    padding-right: 70px;
}

/* --- Reuse All Margin --- */
.margin0 {
    margin: 0px;
}

.margin5 {
    margin: 5px;
}

.margin10 {
    margin: 10px;
}

.margin15 {
    margin: 15px;
}

.margin20 {
    margin: 20px;
}

.margin25 {
    margin: 25px;
}

.margin30 {
    margin: 30px;
}

.margin35 {
    margin: 35px;
}

/* --- Reuse Vert Margin --- */
.vmargin1 {
    margin: 1px 0px;
}

.vmargin5 {
    margin: 5px 0px;
}

.vmargin10 {
    margin: 10px 0px;
}

.vmargin15 {
    margin: 15px 0px;
}

.vmargin20 {
    margin: 20px 0px;
}

.vmargin25 {
    margin: 25px 0px;
}

.vmargin30 {
    margin: 30px 0px;
}

.vmargin35 {
    margin: 35px 0px;
}

/* --- Reuse Horizontal Margin --- */
.hmargin5 {
    margin: 0px 5px;
}

.hmargin10 {
    margin: 0px 10px;
}

.hmargin15 {
    margin: 0px 15px
}

.hmargin20 {
    margin: 0px 20px;
}

.hmargin25 {
    margin: 0px 25px;
}

.hmargin30 {
    margin: 0px 30px;
}

.hmargin35 {
    margin: 0px 35px;
}

/* --- Reuse Top and Bottom Margin --- */
.marginTopBot5 {
    margin-top: 5px;
    margin-bottom: 5px;
}

.marginTopBot10 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.marginTopBot15 {
    margin-top: 15px;
    margin-bottom: 15px;
}

.marginTopBot20 {
    margin-top: 20px;
    margin-bottom: 20px;
}

.marginTopBot25 {
    margin-top: 25px;
    margin-bottom: 25px;
}

.marginTopBot30 {
    margin-top: 30px;
    margin-bottom: 30px;
}

.marginTopBot35 {
    margin-top: 35px;
    margin-bottom: 35px;
}

.marginTopBot40 {
    margin-top: 40px;
    margin-bottom: 40px;
}

.marginTopBot50 {
    margin-top: 50px;
    margin-bottom: 50px;
}

.marginTopBot60 {
    margin-top: 60px;
    margin-bottom: 60px;
}

/* --- Reuse Left Right Margin --- */
.marginLeftRight5 {
    margin-left: 5px;
    margin-right: 5px;
}

.marginLeftRight10 {
    margin-left: 10px;
    margin-right: 10px;
}

.marginLeftRight15 {
    margin-left: 15px;
    margin-right: 15px;
}

.marginLeftRight20 {
    margin-left: 20px;
    margin-right: 20px;
}

.marginLeftRight25 {
    margin-left: 25px;
    margin-right: 25px;
}

.marginLeftRight30 {
    margin-left: 30px;
    margin-right: 30px;
}

.marginLeftRight35 {
    margin-left: 35px;
    margin-right: 35px;
}

/* --- Reuse Top Margin --- */
.marginTop0 {
    margin-top: 0px;
}

.marginTop5 {
    margin-top: 5px;
}

.marginTop10 {
    margin-top: 10px;
}

.marginTop15 {
    margin-top: 15px;
}

.marginTop20 {
    margin-top: 20px;
}

.marginTop25 {
    margin-top: 25px;
}

.marginTop30 {
    margin-top: 30px;
}

.marginTop35 {
    margin-top: 35px;
}

.marginTop40 {
    margin-top: 40px;
}

.marginTop45 {
    margin-top: 45px;
}

.marginTop50 {
    margin-top: 50px;
}

/* --- Reuse Bottom Margin --- */
.marginBot0 {
    margin-bottom: 0px;
}

.marginBot5 {
    margin-bottom: 5px;
}

.marginBot10 {
    margin-bottom: 10px;
}

.marginBot15 {
    margin-bottom: 15px;
}

.marginBot20 {
    margin-bottom: 20px;
}

.marginBot25 {
    margin-bottom: 25px;
}

.marginBot30 {
    margin-bottom: 30px;
}

.marginBot35 {
    margin-bottom: 35px;
}

.marginBot40 {
    margin-bottom: 40px;
}

.marginBot45 {
    margin-bottom: 45px;
}

.marginBot50 {
    margin-bottom: 50px;
}

/* --- Reuse Right Margin --- */
.marginRight5 {
    margin-right: 5px;
}

.marginRight10 {
    margin-right: 10px;
}

.marginRight15 {
    margin-right: 15px;
}

.marginRight20 {
    margin-right: 20px;
}

.marginRight25 {
    margin-right: 25px;
}

.marginRight30 {
    margin-right: 30px;
}

.marginRight35 {
    margin-right: 35px;
}

/* --- Reuse Left Margin --- */
.marginLeft0 {
    margin-left: 0px;
}

.marginLeft5 {
    margin-left: 5px;
}

.marginLeft10 {
    margin-left: 10px;
}

.marginLeft15 {
    margin-left: 15px;
}

.marginLeft20 {
    margin-left: 20px;
}

.marginLeft25 {
    margin-left: 25px;
}

.marginLeft30 {
    margin-left: 30px;
}

.marginLeft35 {
    margin-left: 35px;
}

/* --- Reuse Border None --- */
.borderRightNone {
    border-right: none !important;
}

.borderLeftNone {
    border-left: none !important;
}

.borderTopNone {
    border-top: none !important;
}

.borderBotNone {
    border-bottom: none !important;
}

.borderNone {
    border: none !important;
}

/* --- percent width --- */
.per25 {
    width: 25%;
}

.per50 {
    width: 50%;
}

.per75 {
    width: 75%;
}

.per80 {
    width: 80%;
}

.per85 {
    width: 85%;
}

.per90 {
    width: 90%;
}

/* --- Reuse Background Image --- */
.bgCover {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* --- Reuse Sections --- */
.secPad {
    padding-top: 100px;
    padding-bottom: 100px;
}

.no-gutters {
    margin-right: -15px;
    margin-left: -15px;
}

/* >>>>>> FONTS <<<<<<<*/

/* >>>>>> Font-weights <<<<<<<*/
/* --- Prox Nova --- */
.nova-black {
    font-weight: 900;
}

.nova-exbold {
    font-weight: 800;
}

.nova-bold {
    font-weight: 700;
}

.nova-semi {
    font-weight: 600;
}

.nova-reg {
    font-weight: 400;
}

.nova-light {
    font-weight: 300;
}



/* --- Poynter Gothic - no longer used --- */
.poynter-black {
    font-weight: 800;
}

.poynter-bold {
    font-weight: 700;
}

.poynter-reg {
    font-weight: 300;
}

.poynter-light {
    font-weight: 300;
}

/* --- Roboto --- */
.roboto-black {
    font-weight: 900;
}

.roboto-bold {
    font-weight: 700;
}

.roboto-reg {
    font-weight: 300;
}

.roboto-light {
    font-weight: 300;
}


/* >>>> REUSE ITEMS <<<<<*/

/* --- Reuse Color --- */
/* Official university colors */
.medium-blue {
    color: var(--medium-blue);
}

.royal-blue {
    color: var(--royal-blue);
}

.university-gold {
    color: var(--university-gold);
}

.dark-gold {
    color: var(--dark-gold);
}

.dark-blue {
    color: var(--dark-blue);
}

/* Ssoe accent colors */
.dept-bio {
    color: var(--dept-bio);
}

.dept-chem {
    color: var(--dept-chem);
}

.dept-civ {
    color: var(--dept-civ);
}

.dept-ec {
    color: var(--dept-ec);
}

.dept-ind {
    color: var(--dept-ind);
}

.dept-mem {
    color: var(--dept-mem);
}

/* Grey and Black */
.copy {
    color: var(--copy);
}

.charcoal {
    color: var(--charcoal);
}

.gray {
    color: var(--gray);
}

.light-gray {
    color: var(--light-gray);
}

.white {
    color: #FFFFFF;
}

/* Background colors */
.BG-medium-blue {
    background-color: var(--BG-medium-blue);
}

.BG-royal-blue {
    background-color: var(--BG-royal-blue);
}

.BG-university-gold {
    background-color: var(--BG-university-gold);
}

.BG-dark-gold {
    background-color: var(--BG-dark-gold);
}

.BG-dark-blue {
    background-color: var(--BG-dark-blue);
}

.BG-charcoal {
    background-color: var(--BG-charcoal);
}

.BG-gray {
    background-color: var(--BG-gray);
}

.BG-white {
    background-color: #ffffff;
}

.BG-light-gray {
    background-color: var(--BG-light-gray);
}

.BG-dept-bio {
    background-color: var(--dept-bio);
}

.BG-dept-chem {
    background-color: var(--dept-chem);
}

.BG-dept-civ {
    background-color: var(--dept-civ);
}

.BG-dept-ec {
    background-color: var(--dept-ec);
}

.BG-dept-ind {
    background-color: var(--dept-ind);
}

.BG-dept-mem {
    background-color: var(--dept-mem);
}

/* Background colors fixed */
.BG-medium-blue-fixed {
    background-color: #1C2957;
}


/* Standard accent colors */
.accent {
    color: var(--university-gold) !important;
}

.accentBG {
    background-color: var(--university-gold) !important;
}

.accentAlt {
    color: var(--royal-blue) !important;
}

.accentBGAlt {
    background-color: var(--royal-blue) !important;
}

.accentBdr {
    border-color: var(--university-gold) !important;
}

.accentBdrAlt {
    border-color: var(--royal-blue) !important;
}

/* Department accent swaps colors */

/* Add these tags to <body> to swap/wrap for Departments 

- .dept-bio
- .dept-chem
- .dept-civ
- .dept-ec
- .dept-ind
- .dept-mem

*/

.dept-bio .accent, .dept-bio .accentAlt {
    color: var(--dept-bio) !important;
}

.dept-bio .accentBG, .dept-bio .accentBGAlt {
    background-color: var(--dept-bio) !important;
}

.dept-bio .accentBdr, .dept-bio .accentBdrAlt {
    border-color: var(--dept-bio) !important;
}


.dept-chem .accent, .dept-chem .accentAlt {
    color: var(--dept-chem) !important;
}

.dept-chem .accentBG, .dept-chem .accentBGAlt {
    background-color: var(--dept-chem) !important;
}

.dept-chem .accentBdr, .dept-chem .accentBdrAlt {
    border-color: var(--dept-chem) !important;
}

.dept-civ .accent, .dept-civ .accentAlt {
    color: var(--dept-civ) !important;
}

.dept-civ .accentBG, .dept-civ .accentBGAlt {
    background-color: var(--dept-civ) !important;
}

.dept-civ .accentBdr, .dept-civ .accentBdrAlt {
    border-color: var(--dept-civ) !important;
}

.dept-ec .accent, .dept-ec .accentAlt {
    color: var(--dept-ec) !important;
}

.dept-ec .accentBG, .dept-ec .accentBGAlt {
    background-color: var(--dept-ec) !important;
}

.dept-ec .accentBdr, .dept-ec .accentBdrAlt {
    border-color: var(--dept-ec) !important;
}

.dept-ind .accent, .dept-ind .accentAlt {
    color: var(--dept-ind) !important;
}

.dept-ind .accentBG, .dept-ind .accentBGAlt {
    background-color: var(--dept-ind) !important;
}

.dept-ind .accentBdr, .dept-ind .accentBdrAlt {
    border-color: var(--dept-ind) !important;
}

.dept-mem .accent, .dept-mem .accentAlt {
    color: var(--dept-mem) !important;
}

.dept-mem .accentBG, .dept-mem .accentBGAlt {
    background-color: var(--dept-mem) !important;
}

.dept-mem .accentBdr, .dept-mem .accentBdrAlt {
    border-color: var(--dept-mem) !important;
}

/*>>>>>>>>>>>>>>>>>> HR and Dept HR <<<<<<<<<<<<<<<<<<*/

hr {
    border: 0;
    border-bottom: 2px solid;
    border-color: var(--university-gold);
}

.dept-bio hr {
    border-color: var(--dept-bio) !important;
}

.dept-chem hr {
    border-color: var(--dept-chem) !important;
}

.dept-civ hr {
    border-color: var(--dept-civ) !important;
}

.dept-ec hr {
    border-color: var(--dept-ec) !important;
}

.dept-ind hr {
    border-color: var(--dept-ind) !important;
}

.dept-mem hr {
    border-color: var(--dept-mem) !important;
}

/* >>>> SECTION ITEMS - Border, Drop Shadow <<<<<*/

/* Border Styles - use in conjuction with .accentBdr .accentBdrAlt */
.secbdrBot {
    border-top: 0px;
    border-bottom: 2px;
    border-right: 0px;
    border-left: 0px;
    border-style: solid;
}

.secbdrTop {
    border-top: 2px;
    border-bottom: 0px;
    border-right: 0px;
    border-left: 0px;
    border-style: solid;
}

.secbdrTopBot {
    border-top: 2px;
    border-bottom: 2px;
    border-right: 0px;
    border-left: 0px;
    border-style: solid;
}

.secbdrLftRght {
    border-left: 2px;
    border-right: 2px;
    border-top: 0px;
    border-bottom: 0px;
    border-style: solid;
}

/* Drop Shadow Inset*/
.secDropTopIn {
    box-shadow: inset 0 40px 30px -40px rgba(0,0,0,0.8);
}

.secDropBotIn {
    box-shadow: inset 0 -40px 30px -40px rgba(0,0,0,0.8);
}

.secDropTopBotIn {
    box-shadow: inset 0 40px 30px -40px rgba(0,0,0,0.8), inset 0 -40px 30px -40px rgba(0,0,0,0.8);
}

/* Drop Shadow Outer*/
.secDropTopOut {
    box-shadow: 0 -40px 30px -40px rgba(0,0,0,0.6);
}

.secDropBotOut {
    box-shadow: 0 40px 30px -40px rgba(0,0,0,0.6);
}

.secDropTopBotOut {
    box-shadow: 0px 0px 25px 10px rgba(0,0,0,0.3);
}




/* >>>> BACKGROUND ITEMS <<<<<*/
/* --- BG gradients --- */
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#003594+0,141b4d+100 */
.BGRoyalToDark {
    /* this background maintains a workable contrast and doesn't require a fallback otherwise add to color.css and fallback to color-wcag.css*/
    background: -moz-linear-gradient(-45deg, #003594 0%, #141b4d 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #003594 0%,#141b4d 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, #003594 0%,#141b4d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003594', endColorstr='#141b4d',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

/* >>>> YOUTUBE EMBED <<<<<*/
.video-responsive {
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    height: 0;
    width: 100%;
}

    .video-responsive iframe {
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        position: absolute;
    }


/* >>>>>>>>>>>>>   REUSE MEDIA QUERY   <<<<<<<<<<<<<<<<<  */
@media (max-width: 991px) {

    .secPad {
        padding-top: 50px;
        padding-bottom: 50px;
    }
}
