/* typography */

html {
  scroll-behavior: smooth !important;
}

body {
  background-color: #f9f9f9;
}

h1 {
}

h2 {
  font-size: 1.3em;
}

h3 {
  font-size: 1.1em;
}

h4 {
  font-size: 1.1em;
}

h5 {
}
/* for paragraphs */
.prominent-text {
  font-size: 1.2rem;
}
.heading-color-main{
  color: #37474f;
}
.article-box{
  background-color: #fff;
  padding: 20px;
  border-radius: 10px;
}
.article-head{
  margin-bottom: 30px;
}
.article-date{
  font-size: 14px;
  color: #666;
  font-style: italic;
}
article p{
  color: #333;
  text-align: justify !important;
}
figure{
  margin: 50px 0;
  text-align: center;
}
figcaption{
  color: #666;
  font-size: 14px;
}
.article-author{
  color: #666;
}


/* ========================== SECTIONS ============================= */

section {
  padding: 30px 0;
}
.section-about {
  background-color: #fff;
}
.section-bar {
  padding: 0;
}
.section-modules {
  padding-bottom: 0;
}
.section-pi {
  background-color: #37474f;
  color: #fff;
}
.section-research-associates {
  background-color: #455a64;
  color: #fff;
}

.section-heading {
  font-size: 2.4em;
  padding: 50px 0;
  text-transform: uppercase;
}
.section-heading .content {
  position: relative;
}
.section-heading .content:after {
  content: " ";
  position: absolute;
  top: 110%;
  left: 50%;
  width: 60%;
  border: 2px solid #607d8b;
  border-radius: 4px;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
  transform: translateX(-50%);
}

.box {
  background-color: transparent;
  padding: 20px;
}
.modal-content {
  border: none;
}
.btn-read-more:hover {
  cursor: pointer;
}
.spacer {
  height: 30px;
}

/* modules */

.module {
  width: 100%;
}

.module img {
  opacity: 0.7;
  -webkit-transition: all 0.4s;
  /* Safari */
  transition: all 0.4s;
}

.module img:hover {
  opacity: 1;
}

.module-info {
}

.info-bar {
  background: transparent url(../images/research-banner.jpg) center center/cover
    no-repeat scroll;
  padding-top: 35px;
  padding-bottom: 35px;
  color: #fff;
  font-weight: bold;
}

.info-bar .value {
}

.info-bar .label {
}

/* ============================== updates ========================== */

.latest-updates{
  background-color: rgba(150,150,0,0.1);
}
.update-heading {
  margin-bottom: 0px;
}

.update-date {
  font-size: 13px;
  font-style: italic;
}

.update-heading a{
  text-decoration: none;
}
.update-heading a:hover{
  color: #37474f;
}
/* team members */

.team-member .name {
}

/* =========================================== bg colors ================================ */
.bg-color-blue1 {
  background-color: #eceff1;
}
.bg-color-blue2 {
  background-color: #cfd8dc;
}
.bg-color-blue3 {
  background-color: #cfd8dc;
}
.bg-color-blue4 {
  background-color: #eceff1;
}
.bg-color-white {
  background-color: #fff;
}

/* ============================================ FOOTER ============================================== */

.footer {
  background: transparent url(../images/footer-background.jpg) center
    center/cover no-repeat scroll;
  padding: 30px;
  color: #ccc;
}

.footer .quick-links ul,
.footer .quick-links ul li {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.footer a {
  color: #ccc;
  font-weight: bold;
  font-size: 14px;
}

/*==============================================================*/

#nav_bottom_shadow {
  height: 5px;
  box-shadow: 0px 3px 5px 0px #888888;
  margin-top: 80px !important;
}

#menu li a {
  padding: 28px !important;
}

#menu li {
  border-bottom: 5px solid rgba(255, 255, 255, 0);
}

#menu li:hover {
  background-color: rgba(222, 222, 222, 0.22) !important;
  border-bottom: 5px solid #fff;
}

.bg-white {
  background-color: white !important;
}

nav {
  background-color: rgba(38, 50, 56, 0.9);
}

#nav-spacer {
  height: 85px;
  /* background-color: rgb(0, 123, 255); */
}

/* =================================================== MARGIN AND PADDINGS ========================== */
.no-padding {
  padding: 0;
}
.pd-top-0 {
  padding-top: 0px !important;
}
.pd-bottom-0 {
  padding-bottom: 0px !important;
}

.pd-top-20 {
  padding-top: 20px !important;
}
.pd-bottom-20 {
  padding-bottom: 20px !important;
}

.pd-top-30 {
  padding-top: 30px !important;
}
.pd-bottom-30 {
  padding-bottom: 30px !important;
}

.mg-top-10 {
  margin-top: 10px !important;
}
.mg-bottom-10 {
  margin-bottom: 10px !important;
}

.mg-top-20 {
  margin-top: 20px !important;
}
.mg-bottom-20 {
  margin-bottom: 20px !important;
}

.mg-top-30 {
  margin-top: 30px !important;
}
.mg-bottom-30 {
  margin-bottom: 30px !important;
}

/* ==================================   PARALLAX ===================== */
.plx1 {
  background: url("./../images/plx1.jpg");
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.plx2 {
  background: url("./../images/plx2.png");
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}