* {
  box-sizing: border-box;
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
}

::-webkit-scrollbar {
    width: 8px;
    padding-right: 20px;
    ;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px rgb(61, 134, 202);
    border-radius: 50px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: rgba(38, 16, 238, 0.76);
    border-radius: 50px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: rgb(13, 11, 151);
}

body {
  margin-top: 20px;
  margin-left: 100px;
  margin-bottom: 60px;
}

.sidebar {
    /* border: 1px solid green; */
  width: 250px;
  margin-bottom: 40px;
  height: 100%;
  float: left;
  /* position: fixed; */
  overflow-y: auto;

  
}

.sidebar .profile-img {
  display: flex;
  justify-content: center;
}

.sidebar .profile-img > img {
  padding: 4px;
  border: 6px solid rgb(177, 177, 177);
  /* border-radius: 20%; */
  margin-bottom: 20px;
}

.sidebar .social-media {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.sidebar .fab {
  font-size: 25px;
  color: black;
}

.sidebar .fab:hover {
  font-size: 29px;
}

.sidebar .fa-facebook:hover {
  color: #0d8af0;
}

.sidebar .fa-blogger:hover {
  color: #ee5f00;
}

.sidebar .fa-youtube:hover {
  color: red;
}

.sidebar .table-content {
  padding: 4px 5px 4px 5px;
  background-color: rgb(236, 230, 230);
  border-radius: 10px;

}

.sidebar .table-content > a {
  font-weight: bold;
  font-size: 15px;
  display: block;
  text-decoration: none;
  color: black;
  margin: 10px 0px;
}

.sidebar .table-content > a:hover {
  font-weight: bolder;
  font-size: 17px;
  color: red;
  font-weight: bold;
}

.layout-container {
    margin-left: 350px;
    display: grid;
    grid-template-columns: auto 22%;
        /*grid-template-columns: auto 300px;*/
    grid-column-gap: 0px;
    /* margin-right: 5px; */
}

.main-content {
  /* border: 1px solid blue; */
  font-family: "Fira Sans", sans-serif;
}

.main-content .contact-details > .name {
  font-size: 40px;
  font-weight: bold;
  font-family: Georgia, "Times New Roman", Times, serif;
  margin-bottom: 15px;
}

.main-content .contact-details > .designation {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 2px;
}

.contact-details > .telephone-num {
  margin: 18px 0px;
}

.contact-details > .biosketch {
  color: red;
  font-size: 20px;
  font-weight: bold;
}

.dropdown {
    margin-bottom: 20px;
    position: relative;
    margin-right: 150px;
    /* border: 1px solid black; */
}

.dropbtn {
    background-color: #90ccf4;
    font-weight: bold;
    cursor: pointer;
    padding: 16px;
    font-size: 16px;
    border: none;
}

.dropdown-content {
    display: none;
    background-color: #f1f1f1;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
}

.dropdown-content a {
    margin-top: 10px;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown-content a:hover {
    background-color: #ddd;
    color: red;
}

.dropdown:hover .dropbtn {
    background-color: #59cea5;
}

.box-details {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    margin-right: 20px;
}

.box-details > .box {
  position: relative;
  height: 120px;
  width: 120px;
  margin-left: 0px;
  margin-right: 20px;
  margin-top: 30px;
}

#box1 {
  background-color: #00afd1;
}

#box2 {
  background-color: #94c523;
}

#box3 {
  background-color: #f36510;
}

#box4 {
  background-color: #6a3da3;
}

#box5 {
  background-color: #6a3da3;
}

#box6 {
  background-color: #0bb586;
}

#box7 {
  background-color: #f8ba01;
}

#box8 {
  background-color: #15a382;
}

#box9 {
    background-color: #fa0e0eeb;
}

#box10 {
    background-color: #f111aed2;
}

.box div {
  color: white;
  position: absolute;
  left: 50%;
  font-size: 12px;
  transform: translate(-50%, 0);
}

.box .count {
  top: 25%;
  font-size: 30px;
  font-weight: bold;
}

.box .title {
  top: 55%;
}

.box .subtitle {
  top: 70%;
}

.box .subtitle2 {
  top: 80%;
}

.personalInfo {
  margin-top: 20px;
  background-color: #f9f9f9;
  box-shadow: 2.5px 2.5px 2px 1px rgba(44, 43, 43, 0.2);
}
.personalInfo-title {
  margin-top: 30px;
  font-weight: bolder;
  font-size: 24px;
}
.personalInfo p {
  line-height: 25px;
  font-size: 14px;
}
.personalInfo h4 {
  font-weight: bold;
  font-size: 16px;
}

.personalInfo .col1 {
  padding-left: 10px;
  display: inline-block;
}
.personalInfo .col2 {
  margin-left: 90px;
  display: inline-block;
}

.educationQual-title {
  margin-top: 30px;
  font-weight: bold;
  padding-bottom: 10px;
    font-size: 24px;
}

.educationQual-wrapper ul,
li {
  list-style: none;
  padding: 0;
}

.educationQual-wrapper li {
  padding-bottom: 1.5rem;
  border-left: 2px solid #000000;
  position: relative;
  padding-left: 20px;
  margin-left: 10px;
  margin-top: -16px;
}
.educationQual-wrapper li:last-child {
  border: 0px;
  padding-bottom: 0;
}
.educationQual-wrapper li:before {
  content: "";
  width: 15px;
  height: 15px;
  background: rgb(255, 0, 0);
  border: 1px solid #ff0000;
  /* box-shadow: 3px 3px 0px #ff0000; */
  /* box-shadow: 3px 3px 0px #ff0000; */
  border-radius: 50%;
  position: absolute;
  left: -9px;
  top: 0px;
}

.educationQual-wrapper li p {
  margin-top: -2.5px;
}
.educationQual-wrapper li b {
  font-weight: bolder;
}
.educationQual-wrapper {
  margin-top: 20px;
  padding: 25px;
  padding-bottom: 15px;
  background-color: #f9f9f9;
  box-shadow: 2.5px 2.5px 2px 1px rgba(44, 43, 43, 0.2);
}

.experience-title {
  margin-top: 30px;
  font-weight: bold;
  padding-bottom: 10px;
  margin-bottom: 15px;
    font-size: 24px;
}

.card {
  background-color: burlywood;
  padding: 1rem;
  width: 399px;
  height: 85px;
  /* margin: 0 auto; */
  display: inline-block;
  margin-bottom: 25px;
  color: white !important;
  font-weight: black !important;
  font-family: "Roboto Condensed";
  font-style: normal;
  font-size: 19px;
  line-height: 20px;
  /* or 65% */

  text-transform: uppercase;
}

.card.one,
.card.three {
  margin-right: 20px;
}
.cardTitle {
  font-size: 19px;
}
.cardText {
  font-size: 23px;
}
.card.one {
  background-color: #17a2b8;
}
.card.two {
  background-color: #f8ba01;
}

.card.three {
  background-color: #29972f;

}
.card.three .subflex{
  display: flex;
  flex-direction: row;

}
.subflex .small{
  font-size: 11px !important;
  width:33%;
  border-right: 1px solid white !important;
  padding-left: 4.5px;

}
.card.four {
  background-color: #6a3da3;
}

.experienceBody .post {
  margin-bottom: 15px;
  color: #002d68;
}
.experienceBody .time {
  font-weight: 900;
  font-size: 18px;
}

.experienceBody {
  /* margin-left: -10px; */
  margin-top: 15px;
  background-color: #f9f9f9;
  box-shadow: 2.5px 2.5px 2px 1px rgba(44, 43, 43, 0.2);
  padding: 15px 5px;
  padding-top: 25px;
  padding-left: 30px;
}

.experienceBody ul,
li {
  list-style: none;
  padding: 0;
}

.experienceBody li {
  padding-bottom: 1.5rem;
  border-left: 2px solid #000000;
  position: relative;
  padding-left: 20px;
  margin-left: 10px;
  margin-top: -16px;
}
.experienceBody li:last-child {
  border: 0px;
  padding-bottom: 0;
}
.experienceBody li:before {
  content: "";
  width: 15px;
  height: 15px;
  background: rgb(255, 0, 0);
  border: 1px solid #ff0000;
  /* box-shadow: 3px 3px 0px #ff0000; */
  /* box-shadow: 3px 3px 0px #ff0000; */
  border-radius: 50%;
  position: absolute;
  left: -9px;
  top: 0px;
}

.experienceBody li p {
  margin-top: -2.5px;
}

.expertiseInfo-title {
  margin-top: 45px;
  font-weight: bold;
  padding-bottom: 15px;
font-size: 24px;
}

.expertiseInfo-body {
  background-color: #f9f9f9;
  box-shadow: 2.5px 2.5px 2px 1px rgba(44, 43, 43, 0.2);
  padding: 15px 5px;
  padding-left: 30px;
}

.wrapper-title {
  margin-top: 45px;
  font-weight: bold;
  padding-bottom: 15px;
 font-size: 24px;
}

.wrapper-body {
  background-color: #f9f9f9;
  box-shadow: 2.5px 2.5px 2px 1px rgba(44, 43, 43, 0.2);
  padding: 15px 5px;
  padding-left: 30px;
}

.wrapper-body .projrow {
  border-left: 5px solid #28a745;
  padding-left: 10px;
}

.projrow .row-title {
  margin-bottom: -9px;
  font-weight: bold;
}

.awardsrow .title {
  font-weight: bold;
  padding-bottom: 10px;
  padding-top: 10px;
}
.awardsrow {
  border-left: 5px solid #f8ba01;
  padding-left: 10px;
}

.editrow .row-title,.reviewrow .row-title {
    font-size: 20px;
}

.editrow .title, .reviewrow .title {
    border-left: 5px solid #32c749;
    padding-left: 10px;
}

.membrow .content {
  margin-top: -14px;
}
.membrow .title {
  font-weight: bolder;
  font-size: 18px;
}

.membrow {
  border-left: 5px solid #6a3da3;
  padding-left: 10px;
}

.wrapper-body .row {
    margin-bottom: 40px;
    padding-left: 10px;
    margin-right: 30px;
}

.row-title {
    font-size: 18px;
    font-weight: bold;
}

.cws {
    border-left: 5px solid #94c523;
}

.add-info {
    border-left: 5px solid #7bc8f1;
}

.academic-ids {
    margin-top: 50px;
    margin-left: -100px;
    min-width: auto;
    max-width: 260px;
}

.accounts {
    margin: 5px 0px;
    display: inline-flex;
    justify-content: space-around;
}

.block-title {
    margin-bottom: 25px;
    font-size: 30px;
    font-weight: bold;
}

.scholar-logo,
.scholar-info {
    margin-left: 20px;
}

.scholar-logo {
    margin-top: 5px;
}

.scholar-site,
.scholar-id {
    display: flex;
    align-items: center;
    font-size: 16px;
}

.scholar-site {
    font-size: 17px;
    margin-bottom: 10px;
    font-weight: bold;
}

.scholar-logo>img {
    height: 30px;
    width: 30px;
}

/* CSS for gallery */
.w-100{
  border: 11px solid #000000b9;
margin-left:17%;
box-shadow: 5px 5px 5px 3px rgba(44, 43, 43, 0.2);
max-width: 65%;
margin-bottom: 20px;

}

.gallery img {
  border: 5px solid #000000;
}

.carousel-control-prev-icon, .carousel-control-next-icon {
  height: 50px!important;
  width: 50px!important;
  outline: rgba(44, 43, 43, 0.2);
  background-color: rgba(44, 43, 43, 0.2)!important;
  background-size: 100%, 100%;
  border-radius: 50%;
  border: 1px solid rgba(44, 43, 43, 0.2);
}
