/* === Bod CSS === */
.biography-main-wrapper.bg-green-light{background-color:var(--green-light);}
.biography-main-wrapper.bg-beige-light{background-color:var(--beige-light);}
.biography-main-wrapper.bg-beige{background-color:var(--beige-light);}
.biography-main-wrapper.bg-
.biography-item-wrapper a.bod-box-wrapper{text-decoration: none;overflow: hidden;display: block;color:inherit}
.biography-item-wrapper a.bod-box-wrapper.active .bod-box:before, .biography-item-wrapper a.bod-box-wrapper:hover .bod-box:before{ content: "";position: absolute; width: 100%;    height: 5px;background: var(--blue); bottom: 0; left: 0;}
.biography-item-wrapper a.bod-box-wrapper *{transition: all 0.3s ease-in-out}
.biography-item-wrapper a.bod-box-wrapper .title h3{font-weight: 400;}
.biography-item-wrapper a.bod-box-wrapper .image{min-height: 288px}
.biography-item-wrapper a.bod-box-wrapper .bod-box{padding: 12px 0 16px 16px;position: relative;background-color: var(--white);color: var(--dark-text);}
.biography-item-wrapper .bod-content{width: calc(300% + 60px);position: relative;display: none;padding: 56px 102px 56px 64px;margin-top:30px;background-color:var(--white)}
.biography-item-wrapper .bod-member:nth-child(3n+2) .bod-content{left: calc(-100% - 30px);}
.biography-item-wrapper .bod-member:nth-child(3n) .bod-content{left: calc(-200% - 60px);}
.biography-item-wrapper .bod-content a.btn-close{font-size: 2.1rem;color: var(--grey);position: absolute;right: 64px;top: 56px;z-index: 1;line-height:1.8rem}
.biography-item-wrapper .bod-content .designation{display: inline-block; border-bottom: 2px solid var(--blue);}
.biography-item-wrapper .bod-content .title{margin-top: 20px;margin-bottom: 16px;}
.biography-item-wrapper .bod-content .content{padding-right: 40px;}
.biography-item-wrapper .bod-content .content p {margin-bottom: 18px;}
.biography-item-wrapper .bod-content .end-note{padding-top:16px; border-top: 1px solid var(--beige-light);}
.biography-main-wrapper .biography-item-wrapper .bod-member:nth-child(1n+4) {margin-top: 34px;}
/* === Bod CSS === */

@media all and (max-width: 991.98px){
	.biography-item-wrapper .bod-content{width: calc(200% + 30px);}
    .biography-item-wrapper .bod-member:nth-child(odd) .bod-content{left: 0}
    .biography-item-wrapper .bod-member:nth-child(even) .bod-content{left: calc(-100% - 30px);}
    .biography-main-wrapper .biography-item-wrapper .bod-member {    margin-top: 34px;}
	.bod-row.row{margin-top: -34px;}
}
@media all and (max-width: 767.98px){
	.biography-item-wrapper .bod-content{padding: 20px 15px;}
	.biography-item-wrapper .bod-content{width: 100%}
    .biography-item-wrapper .bod-member:nth-child(even) .bod-content{left: 0;    margin-top: 10px;}
    .biography-item-wrapper a.bod-box-wrapper.active{border-radius: 10px 10px 0 0;margin-bottom: 0}
    .biography-item-wrapper .bod-content{border-radius: 0;}
    /*.biography-item-wrapper a.bod-box-wrapper.active .bod-box{height: 0;min-height: 0;padding: 0;overflow: hidden;}*/
    .biography-item-wrapper .bod-content .designation{margin: 10px 30px 10px 0;}
    .biography-item-wrapper .bod-content .social-wrapper{height: auto;margin-bottom: 38px;}
    .biography-item-wrapper .bod-content a.btn-close{text-decoration: none;top: 32px;right:15px;}
	.biography-item-wrapper .bod-content .top-copntent.intro-body, .biography-item-wrapper .bod-content .content {padding-right: 0;}
    .biography-main-wrapper .biography-item-wrapper .bod-member{margin-top:30px}
    .biography-main-wrapper .biography-item-wrapper .bod-member:first-child{margin-top:0}
	.bod-row.row{margin-top: 0;}
}

body.nojs .biography-main-wrapper .bod-member{width: 100% !important;flex: 0 0 100% !important;max-width: 100% !important;}
body.nojs .biography-item-wrapper .bod-content{width: 100% !important; display: block !important; left: 0 !important; right: 0 !important}

@media screen and (min-width:566.98px) and (max-width:767px) {
.biography-item-wrapper a.bod-box-wrapper .image {
   min-height: 470px;
  background-position-y: -5px;
}
}
@media screen and (max-width:566.98px) {
.biography-item-wrapper a.bod-box-wrapper .image {
   min-height: 320px;
  background-position-y: -5px;
}
}
