/*About PI*/

:root{
   --nar-body-color:rgb(78, 75, 80);
   --var-body-light-color:rgb(132, 124, 138);
   --nav-logo-color: rgb(125, 1, 182);
}

.breaker_line{
    width:85%;
    margin-left: 7.5%;
    border-top: 2px solid #eee9f4;
    margin-top:150px;

}
 
.PI-box {
    display:inline-flex;
    flex-direction: row;
    flex-wrap:nowrap;
    justify-content:start;
    width:85%;
    position:relative;
    margin-left: 7.5%;
}

.photo {
    display:flex;
    margin: 5vw 12px 2vw 2vw;
    width:25vw;
    align-items:flex-start;
    justify-content: start;
    object-fit: contain;
    top:0;
 }

.text-box {
    display:flex;
    flex-direction: column;
    width:100%;
    position:relative;
    justify-content:start;
    margin: 5vw 2vw 2vw 12px;
 }

.title {
    margin: 0.5vw 4vw 2vw 18px;
    max-width:auto;
    padding-left:18px;
    align-items:start;
    justify-content: end;
    text-align:left;
    font-size:32px
    
 }

 .member-box:hover{
   cursor:pointer;
 }

 .team-title:hover{
   color:var(--nav-logo-color);
 }

 .PI-description {
    margin: 0px 2vw 5vw 18px;
    padding-left:18px;
    max-width:auto;
    align-items:start;
    justify-content: end;
    text-align:justify;
    font-size:20px
 }

 .PI-expert {
    margin: 0px 1vw 1vw 18px;
    padding-left:18px;
    max-width:auto;
    align-items:start;
    justify-content: end;
    text-align:justify;
    font-size:20px
 }

 .PI-title {
    margin: 2vw 0vw 0vw 18px;
    padding-left:18px;
    max-width:auto;
    align-items:start;
    justify-content: end;
    text-align:justify;
    font-size:20px
 }

 .PI-description-bottom {
    width:85%;
    margin-left: 7.5%;
    padding-left:2vw;
    padding-right:2vw;
    padding-bottom: 5vw;
    text-align:justify;
    align-items:start;
    background-color:white;
    font-size:19px
 }

 .PI-title-bottom {
    width:85%;
    margin-left: 7.5%;
    padding-left:2vw;
    padding-right:2vw;
    padding-bottom: 12px;
    text-align:justify;
    align-items:start;
    background-color:white;
    display:none;
    font-size:19px
 }

 .PI-name-bottom {
    width:85%;
    margin-left: 7.5%;
    padding-left:2vw;
    padding-right:2vw;
    padding-bottom: 6px;
    text-align:justify;
    align-items:start;
    background-color:white;
    display:none;
    font-size:24px
 }

 .PI-expert-bottom {
    width:85%;
    margin-left: 7.5%;
    padding-left:2vw;
    padding-right:2vw;
    padding-bottom: 12px;
    text-align:left;
    align-items:start;
    background-color:white;
    display:none;
    font-size:16px;
 }

/*Team Member*/

.member-type{
   width:85%;
   margin-left: 7.5%;
   padding-left: 2vw;
   margin-top:50px;
   margin-bottom:20px;
   text-align:left;
   align-items:center;
   background-color:white;
   font-size: 28px;
   color:var(--nav-logo-color);
}



.member-box{
   width:20%;
   min-width: 20%;;
   display:flex;
   margin-left:2vw;
   margin-right:2vw;
   flex-direction: column;
   flex-wrap:wrap;
   justify-content:start;
   position:relative;
}

.member-photo {
   display:flex;
   width:100%;
   align-items:flex-start;
   justify-content: start;
   object-fit: contain;
   margin-top:30px;
}

.member-photo:hover{
   cursor:pointer;
}

.member-name {
   margin-top: 12px;
   max-width:auto;
   align-items:start;
   text-align:center;
   font-size:20px;
   color: var(--nar-body-color);
   text-decoration:none;
}

.member-name:hover{
   color: var(--nav-logo-color);
   font-weight: bold;
   cursor: pointer;
   text-decoration:none;
}

a {
  text-decoration:none;
}

.member-title{
   margin-top: 0;
   max-width: auto;
   align-items:start;
   text-align:center;
   font-size:16px;
   color: rgb(132, 124, 138);
}

.PI-member-box{
   width:100%;
   min-width: 100%;;
   margin-left:2vw;
   margin-right:2vw;
   flex-direction: row;
   display:inline-flex;
   flex-wrap:nowrap;
   justify-content:start;
}

.PI-member-photo {
   display:flex;
   width:20%;
   align-items:flex-start;
   justify-content: start;
   object-fit: contain;
   margin-top:30px;
}

.team-text-box {
    display:flex;
    flex-direction: column;
    width:100%;
    position:relative;
    justify-content:start;
    margin: 5vw 2vw 2vw 12px;
 }

.PI-member-name {
   margin-top: 12px;
   max-width:auto;
   align-items:start;
   text-align:center;
   font-size:20px;
   color: var(--nar-body-color);
   text-decoration:none;
}

.PI-member-title{
   margin-top: 0;
   max-width: auto;
   align-items:start;
   text-align:center;
   font-size:16px;
   color: rgb(132, 124, 138);
}

.team-title {
    margin: 0px 12px 24px 18px;
    max-width:auto;
    padding-left:24px;
    align-items:start;
    justify-content: end;
    text-align:left;
    font-size:28px;
    font-weight:bold;
    color: var(--nar-body-color);
    
 }

 .team-PI-description {
    margin: 0px 12px 12px 18px;
    padding-left:24px;
    max-width:auto;
    align-items:start;
    justify-content: end;
    text-align:justify;
    font-size:18px;
    color: rgb(132, 124, 138);
 }

@media screen and (max-width: 480px) {

.member-name {font-size:18px;}
.member-title {font-size:14px;}
.member-type {font-size:23px;}


}


@media screen and (max-width: 1050px) {

.member-box{min-width:28%;}
.PI-member-photo{min-width:28%}
.PI-title{display:none}
.title {font-size:32px}
.PI-expert{font-size: 20px}
.PI-title-bottom {display:block}
.photo {width:25vw}
.team-title{font-size:22px}
.team-PI-description{font-size:16px}
}

@media screen and (max-width: 1350px) {
.title {font-size:28px}
.PI-expert{font-size: 19px}
.PI-title{font-size:19px}
.photo {width:40vw}
}



@media screen and (max-width: 768px) {

.PI-box .PI-description-bottom{width:90%; margin-left: 5%;}
.PI-title {display:none}
.PI-title-bottom {display:block; font-size:16px}
.PI-expert{font-size: 16px}
.title {font-size:24px}
.PI-description-bottom{font-size:16px}
.photo {width:25vw}
.member-box{min-width:45%;}
.PI-member-box {flex-direction: column}
.PI-member-photo{width:45%; align-items:center; justify-content: center; display:flex; margin-left: 30%;}
.member-type{width:90%;}
.team-title{padding_left:0px!important;margin: 0px 0 12px 0!important;text-align:center;justify-content:center;}
.team-PI-description{padding_left:0px!important;margin: 0px 0 12px 0!important;text-align:center; justify-content:center;}
.team-text-box{margin-left:0!important; margin-right:0;}
.PI-member-box{padding-right:5%;}



}


@media screen and (max-width: 600px) {

.PI-box .PI-description-bottom{width:90%; margin-left: 5%;}
.PI-title {display:none}
.PI-title-bottom {display:block; font-size:16px}
.PI-expert{display:none}
.title {display:none}
.PI-description-bottom{font-size:16px}
.photo {width:40vw}
.member-box{min-width:45%;}
.member-type{width:90%;}
.PI-expert-bottom{display:block}
.PI-name-bottom{display:block}
.PI-member-box {flex-direction: column}
.team-text-box{margin-left:0!important}


}