body {
width: 100%;
}

body #department {
     width: 500px;
 }

 #search {
 padding-top: 40px; float: right;
 }

 #left-nav {
 margin-top: -1rem;
 }

article .pro-box {
     max-width: 47% !important;
     background-color: #F5F5F5;
     display: block;
     margin-left: auto;
     margin-right: auto; 
     position: relative;
 }

article .pro-box .feature-copy {
margin: 20px 20px 80px 20px;
}

article .pro-box a.button {
    width: 100%;
    bottom: 0;
    position: absolute;
}

 /*Quote Formatting*/
 #quote_back {
     background-image: url("https://msc.northwestern.edu/wp-content/uploads/2017/07/QuoteBackground-e1478197003202-gsm.png");
     background-repeat: no-repeat;
     background-size: cover;
 background-position: center center;
 display: block;
    width: 90%;
 margin-left: auto;
 margin-right: auto;
 min-width: 300px;
 }
 
 #quote_test {
 padding-left: 50px;
 padding-right: 160px;
 padding-top: 20px;
 padding-bottom: 10px;
 min-width: 250px;
 }

@media screen and (max-width: 960px) {
    #quote_test {
    clear: both;
    padding-left: 30px;
    padding-right: 160px;
    padding-top: 20px;
    padding-bottom: 10px;
       }
    }
    
    @media screen and (max-width: 600px) {
    #quote_test {
    clear: both;
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 20px;
    padding-bottom: 10px;
    }
}

 /*Pardot formatting */
 div.pardot-forms-body {
     position: relative;
     padding-bottom: 10%;
     padding-top: 0px;
    padding-left: 10px;
     margin: -40px 0px 0px 0px;
     height: 460px;
     overflow: hidden;
    background: #F1EEF5;
 }
 
 div.pardot-forms-body iframe {
     position: absolute;
     top:0;
     left: 0;
     width: 100%;
     height: 100%;
 }

 /* Button Formatting */
a.button, button.filter {
     font: 16px "Akkurat Pro Bold","Arial Black",sans-serif;
     color: #fff;
     background: #4e2a84;
     text-align: center;
     text-decoration: none;
     text-transform: uppercase;
     font-weight: normal;
     margin: 0 1em 1em;
     padding: 0em 1em 1em 1em;
     cursor: pointer;
     box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.28) !important;
     -webkit-tap-highlight-color: rgba(0,0,0,0);
     display: inline-block;
     vertical-align: middle;
     -webkit-transform: translateZ(0);
     transform: translateZ(0);
         box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.28);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
     -moz-osx-font-smoothing: grayscale;
     position: relative;
     -webkit-transition-property: color;
     transition-property: color;
     -webkit-transition-duration: 0.2s;
     transition-duration: 0.2s;
     min-width: 165px;
     border: none;
 }

/* Hide the content section header */
body .page-title {
    display:none;
 }
 
 p.byline.entry-meta.vcard {
   display:none;
 }
 
 body .article-footer {
    display:none;
 }

 /* Keeps left nav widget in mobile views */
 @media (max-width:768px) {
   body #left-nav {
       display: block;
       width: 100%;
   }
 }

/*People Grid Formatting */
.photo-grid article {
    box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.2);
    background-color: white;
    width: 31% !important;
    position: relative;
    transition: all 0.25s ease-in;
    border-bottom: 5px solid transparent;
}

.photo-grid article:hover {
  transform: translateY(-5px);
}

.photo-grid img {
    width: 100%;
}

.photo-box-text {
    padding: 1rem;
    margin-bottom: 3rem;
}

.photo-grid article a.button, .pro-box a button {
    width: 100%;
    margin: 0 0 -5px 0;
    position: absolute;
    bottom: 0;
    box-shadow: 0 0 0 0 !important;
}
/*Faculty new formatting*/
.photo-grid-2 {
    display: inline-block;
}
.photo-grid-2 article {
    box-shadow: 2px 2px 4px 2px rgba(0, 0, 0, 0.2);
    background-color: white;
   width:300px;
margin:20px;
padding:10px;
    position: relative;
    transition: all 0.25s ease-in;
    border-bottom: 5px solid transparent;
}

.photo-grid-2 article:hover {
  transform: translateY(-5px);
}

.photo-grid-2 img {
    width: 100%;
}


.web-form {
    display: flex;
    flex-wrap: wrap;
}
    
.web-form select {
    min-width: calc((100% / 2) - 30px) !important;
    height: 52px !important;
    margin-bottom: 1rem !important;
}
    
@media screen and (max-width: 960px) {
        .photo-grid article {
            width: 48% !important;
            max-width: 100% !important;
    }
}

@media screen and (max-width: 768px) {
 .photo-grid article {
     width: 100% !important;
     max-width: 100% !important;
 }
}

button.filter  {
     padding: 1em 1em 1em 1em;
 }
 
 button.secondary {
 font: 16px "Akkurat Pro Bold","Arial Black",sans-serif;
     color: #4e2a84;
     background: white;
     border: 2px solid;
     border-color: #4e2a84;
     text-align: center;
     text-decoration: none;
     text-transform: uppercase;
     font-weight: normal;
     margin: 0 1em 1em 0;
     padding: 1em 1em 1em 1em;
     cursor: pointer;
     -webkit-tap-highlight-color: rgba(0,0,0,0);
     display: inline-block;
     vertical-align: middle;
     -webkit-transform: translateZ(0);
     transform: translateZ(0);
         box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.28);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
     -moz-osx-font-smoothing: grayscale;
     position: relative;
     -webkit-transition-property: color;
     transition-property: color;
     -webkit-transition-duration: 0.2s;
     transition-duration: 0.2s;
     min-width: 165px;
 }
 
 button.secondary::hover {
     color: white;
     background-color: #4e2a84;
 }

/*Blog list or blist */

.blist {
 background-color: red;
 }
 
 .blist ul {
     padding: 0; 
     margin: 20px;
     list-style-type: none; 
 }
 
 .content .blist ul>li {
     padding: 0; 
     margin: 20px;
     width: 42%;
     height: auto;
     float: left;
     background: none;
 }
 
 .blist img {
 padding-bottom: 20px;
   width: 300px;
   height: 350px;
   object-fit: cover;
 }
 
 
 @media (max-width:768px) {
 .blist ul li {
     padding: 0; 
     margin: 20px;
     width: 90%;
     height: auto;
     float: left
    }
    }

/* Feature boxes */
.feature-box {    
    background: url(http://common.northwestern.edu/v8/css/images/purple-slashes-standard.jpg) no-repeat center / cover;
    text-align: center;
    display: table-cell;
    width: 100%;
    vertical-align: middle;
    position: relative;
    padding: 2rem 1em;
    margin: 0 auto;
    max-width: 780px;
    box-sizing: content-box;
    color: white;
}

.feature-box h3 {
color: white;
}

.feature-box a.button {
position: relative !important;
width: auto !important;
    background: #e4e0ee !important;
    color: #4e2a84 !important;
}

.feature-box-gray {
    background-color: #f1eef5;;
    display: table-cell;
    width: 100%;
    vertical-align: middle;
    position: relative;
    padding: 2rem 1em;
    margin: 0 auto;
    max-width: 780px;
    box-sizing: content-box;
}

.feature-box-gray p, li {
text-align: left;
}

/* flexboxes */
.flexbox {
    display: flex;
    position: relative;
}

.flexel {
    margin: 20px;
    width: 0;
    flex-grow: 1;
}

.flexel a.button {
    width: 100%;
    bottom: 0;
    position: absolute;
}

@media screen and (max-width: 960px) {
    .flexbox {
         display: inline;
       }
    }

/* Pardot on Homepage */
#msc_sidebar {
    width: 31.10048%;
    min-width: 200px;
    float: right;
    margin: 1.3rem 0 2rem 2rem;
}

.msc_box {
    background: #e4e0ee;
    padding: 1rem;
    margin-bottom: 2rem;
    font-size: 14px;
    line-height: 1.4em;
    max-width: 300px;
    text-align: center;
    height: auto;
}

#msc_sidebar .msc_box {
    background-position: 0 0.3em;
}

@media (max-width: 415px) {
   #msc_sidebar {
     width: 100%;
     float: none;
     clear: both;
     padding: 0px;
     margin: 0px;
   }

   .msc_box {
     width: 100%;
     float: none;
   }
}

.feature-two-col > .feature-box {
     min-width: 320px;
}

/*Slate Form Format*/
.textwidget form {
  background-color: #f1eef5;
  padding: 15px;
  margin-top: -42px;
}

.form_label, label, option {
  font-family: "Campton Book";
  font-size: 16px;
  margin-bottom: 3px;
}

form input{
   padding: 4px;
}

form select {
   height: 22px;
}

form button {
     font: 16px "Akkurat Pro Bold","Arial Black",sans-serif;
     color: #fff;
     background: #4e2a84;
     text-align: center;
     text-decoration: none;
     text-transform: uppercase;
     font-weight: normal;
     padding: 1em 1em 1em 1em;
     margin: .5em 0 1em 0;
     cursor: pointer;
     box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.28);
     -webkit-tap-highlight-color: rgba(0,0,0,0);
     display: inline-block;
     -webkit-transform: translateZ(0);
     transform: translateZ(0);
     box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.28);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
     -moz-osx-font-smoothing: grayscale;
     position: relative;
     -webkit-transition-property: color;
     transition-property: color;
     -webkit-transition-duration: 0.2s;
     transition-duration: 0.2s;
     min-width: 165px;
     border: none;
}

#search button {
    background: url(https://common.northwestern.edu/v8/css/images/icons/search.svg) no-repeat 1em 0.4em;
    background-size: 20px 20px;
    float: left;
    cursor: pointer;
    height: 35px;
    width: 35px;
    min-width: 35px;
     box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0);
    border: none;
    border-bottom: 1px solid #b6acd1;
    -webkit-appearance: none;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
    text-align: center;
}


/*  ----------------------------------------------------
fixes slate CSS conflicts on table hover 
-------------------------------------------------  */

body .responsive-table tr.hover > td,
body .responsive-table tr.hover > td a,
body .responsive-table tr.hover > td b
{
  color: black !important; 
  background-color: white !important;
}


body .responsive-table tr.hover.stripe > td,
body .responsive-table tr.hover.stripe > td a,
body .responsive-table tr.hover.stripe > td b 
{
  color:black !important;  
  background-color: #f0f0f0 !important;
}

/*  ----------------------------------------------------
Accessibility Fixes
-------------------------------------------------  */

/* Sidebar Fix */
#left-nav .widget_text h3 {
    background-color: #4e2a84;
    color: #ffffff;
    font-size: 30px;
    padding: 10px;
    text-align: center;
}

/* Search Button Fix */
body #search .search-form button {
    background-position: center;
}

/* Person Form Fix */
div.form_question .form_label span {
    color: #cc0000 !important;
}

/* Link indicators */
#page p a,
#page li a,
#page table a {
    text-decoration: underline !important;
}

/* People Page Fix */
h2.people-name {
    font-family: "Akkurat", Sans-serif;
    font-size: 18px;
    font-weight: bold;
}

p.people-title {
    font-family: "Akkurat Pro Bold", "Arial Black", sans-serif;
    font-size: 16px;
    color: #342f2e;
    margin: 1rem 0 0 0;
}

a.people-name-link {
    text-decoration: underline;
}

a.people-name-link:before {
    content: '';
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}