/* People: Faculty, Staff, PostDocs, Grad and profile pages */

/* Directory pages: directory links */

.people-toggles {
    margin-bottom: 1rem;
}

.toggle-tab {
     cursor: pointer;
     float: left;
     font-size: 1.2rem;
     text-transform: uppercase;
     margin-right: 40px;
}

 .people-faculty-area, .people-staff-area, .people-offices-area {
     background-color: #fff;
     /* padding: 2rem 0; */
}

/* Search filter */

#people-filter {
    margin-block: 1.5rem;
}

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.form-control:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);
}

.btn.btn-default.purdue-home-button {
    font-size: initial;
    line-height: initial;
    padding: 0.33rem 1rem;
}

/* Directory pages: directory grid */

 .people-faculty-row, .people-staff-row, .people-postdoc-row {
     display: grid;
     grid-auto-rows: minmax(auto,auto);
     grid-template-columns: repeat(3,1fr);
     grid-gap: 2rem;
}

.people-grad-row {
     display: grid;
     grid-auto-rows: minmax(auto,auto);
     grid-template-columns: repeat(5,1fr);
     grid-gap: 2rem;    
}

 .people-faculty-row .areas, 
 .people-staff-row .areas, 
 .people-grad-row .areas,
 .people-postdoc-row .areas {
     padding-block: 0.5rem;
}

 .people-item img {
     margin: 0;
     overflow: auto;
     width: 100%;
}

 .people-item p {
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
}

 .people-name {
    font-size: 1.25em;
    font-weight: 700;
    margin-bottom: 0 !important;
    padding: 1em 0 0;
}

.people-name a {
    font-weight:700;
}

.people-title {
    font-weight: bold;
}

     @media screen and (max-width: 991px) {
         
         .people-faculty-row, .people-staff-row, .people-postdoc-row {
             grid-template-columns: repeat(2,1fr);
        }

         .people-grad-row {
             grid-template-columns: repeat(3,1fr);
        }        
        
    }
    
     @media screen and (max-width: 767px) {
         
         .people-faculty-row, .people-staff-row, .people-postdoc-row {
             grid-template-columns: 1fr;
        }
        
         .people-grad-row {
             grid-template-columns: repeat(2,1fr);
        }         
        
    }
    
     @media screen and (max-width: 600px) {
         
         .toggle-tab {
             float: initial;
             margin: 1rem 0;
             width: 100%;
        }
        
         .people-grad-row {
             grid-template-columns: 1fr;
        }        
        
    }
    
 .staff-phone, .postdoc-phone {
    /* background-image: url(https://sci-dev.science.purdue.edu/eaps/images/people/phone-icon.png); */
     background-image: url(/images/people/phone-icon.png); 
}

 .staff-email, .postdoc-email {
    /* background-image: url(https://sci-dev.science.purdue.edu/eaps/images/people/mail-icon.png); */
     background-image: url(/images/people/mail-icon.png);
}

 .staff-office, .postdoc-office {
    /* background-image: url(https://sci-dev.science.purdue.edu/eaps/images/people/location-icon.png); */
     background-image: url(/images/people/location-icon.png); */
}

 .staff-phone, .staff-email, .staff-office {
     background-repeat: no-repeat;
     background-size: 1rem;
     color: #333;
     line-height: 1em;
     margin: 0.8em 0 0;
     padding-left: 1.75rem;
}

 .postdoc-phone, .postdoc-email, .postdoc-office {
     background-repeat: no-repeat;
     background-size: 1rem;
     color: #333;
     line-height: 1em;
     margin: 0.8em 0 0;
     padding-left: 1.75rem;
}

 .sidenav > ul a.active,
 .quick-links-content > ul a.active {
     color: #000;
     text-decoration: underline;
}

/* Profile pages */

 .hero-info {
     background-color: rgba(0, 0, 0, 0.5);
     color: #fff;
     margin: 1rem;
     width: 50%;
}

 .hero-info p {
     font-size: 1.25rem;
     margin-bottom: 0;
     padding: 1rem;
}

     @media screen and (max-width: 767px) {
         .hero-info {
             width: 90%;
        }
    }
    
/* People Bio pages: People links, hero intro, content and contact areas */

 .people-bio-links {
     background-color: #fff;
     padding: 1.5rem 0;
}

 .people-bio-intro {
     background-color: #eee;
     border-top: solid 1px #ccc;
     border-bottom: solid 1px #ccc;
     padding: 1rem;
}

 .hero-intro-row h1 {
     margin-bottom: 0;
}

 .image-caption-row {
     display: flex;
     flex-wrap: wrap;
     justify-content: space-between;
}

 .bio-photo {
     flex: 0 1 70.75%;
}

 .bio-caption {
     flex: 0 1 24%;
}

     @media screen and (max-width: 991px) {
         
         .bio-photo {
             flex: 0 1 auto;
        }
        
         .bio-caption {
             flex: 0 1 auto;
        }
        
    }
    
    @media screen and (max-width: 767px) {
    
         .people-bio-links {
             padding: 0;
        }         
        
    }
    
 .people-bio-contact-info {
     background-color: #fff;
     padding: 1.5rem 0;
}

 .contact-info-row {
     display: flex;
     flex-wrap: wrap;
     justify-content: space-between;
}

 .contact-info-row .info {
     flex: 0 1 70.75%;
}

 .contact-info-row .contact {
     flex: 0 1 24%;
     border: 1px solid #a9a9a9;
     padding: 1rem;
     word-break: break-all;
}

 .contact-info-row .contact h4 {
     margin: 1rem 0;
}

 .contact-info-row .contact p {
     margin-bottom: 0;
     padding-top: 0;
     padding-bottom: 1rem;
}

 .bio-phone {
    /* background-image: url(https://sci-dev.science.purdue.edu/eaps/images/people/phone-icon.png); */
     background-image: url(/images/people/phone-icon.png); 
 }

 .bio-email {
    /* background-image: url(https://sci-dev.science.purdue.edu/eaps/images/people/mail-icon.png); */
     background-image: url(/images/people/mail-icon.png); 
}

 .bio-office {
    /* background-image: url(https://sci-dev.science.purdue.edu/eaps/images/people/location-icon.png); */
     background-image: url(/images/people/location-icon.png); 
 }

 .bio-website {
    /* background-image: url(https://sci-dev.science.purdue.edu/eaps/images/people/homepage-icon.png); */
     background-image: url(/images/people/homepage-icon.png); */
}

 .bio-phone, .bio-email, .bio-office, .bio-website {
     background-repeat: no-repeat;
     background-size: 1rem;
     border-bottom: 1px solid #a9a9a9;
     color: #333;
     line-height: 1em;
     margin: 0.8em 0 0;
     padding-left: 1.75rem;
}

.associated-websites-no-icon {
    word-break: break-word;
}

     @media screen and (max-width: 767px) {
         .contact-info-row .info {
             flex: 0 1 auto;
        }
         .contact-info-row .contact {
             flex: 1 1 auto;
        }
    }
 
 