/*this css file should be saved in UTF-8!*/

td {
    text-transform: none !important;
}

/*hide both language links*/
.header__top ul li a {font-size: 0px;}   
.lang_list li:last-child::before{visibility: hidden;} /*optional: hide the vertical line. Could also use: "width: 0"*/
.lang_list li:last-child a::after{content: "ENGLISH"; font-size: 12px;} /*show English, not tied to Title of page*/

.header__top .row {align-items: end;}
/* for full width header: */
.header__top--left {height: 60px; background-image: url("/fileadmin/depts/dent.uoa.gr/www/uploads/Images/Common/uoa_dent_logo_top_gr.svg");
                    background-size: contain; background-repeat: no-repeat; background-position-y: bottom; margin: 0;}

.header__bottom .row {background-image: none;
                      background-size: auto 80%; background-repeat: no-repeat; background-position: 20px bottom;}
  
.header__top .row .col-sm-5 {width: 30%;}
.header__top .row .col-sm-7 {width: 70%;}
.header__top--right {text-align: right;}

/* for header smaller than 991, showing hamburger menu: */
@media (max-width: 991px) { /*if 991 or smaller, then...*/
   .header__bottom .row {background-image: url("/fileadmin/depts/dent.uoa.gr/www/uploads/Images/Common/uoa_dent_logo_top_gr_white.svg");}

   .header__top--left {height: 0; background-image: none;}

   .header__top .row .col-sm-5 {width: 0%;}
   .header__top .row .col-sm-7 {width: 100%;}
}

/* remove Athina logo and title: */
.page_category_title {display: none;}

/* full width: */
.col-sm-8 {width: 100%; margin: auto;}
@media (max-width: 991px) {.col-sm-8 {width: 100%; margin: auto;}}

/* remove sidebar: */
.sidebar {display: none;} 

/* for CV data of faculty members: */
.cv_data {
  display: grid;
  grid-template-columns: auto 1fr;
  margin: 0 0 30px 0;
}
.cv_data h2 {
  font-size: 2.3rem;
  font-family: "Open Sans", sans-serif;
  font-weight: 700;
}
@media (max-width: 480px) {
  .cv_data {
    grid-template-columns: auto;}
  .cv_data h2 {
    font-size: 1.5rem;}
}

/* for banner with overlay title: */
.my_banner {
  position: relative; border-bottom: 10px solid #0D5EAF;
}
.my_banner_img {
  overflow: hidden; display: flex; justify-content: center;
}
.my_banner_txt {
  max-width: 1140px; margin: 0 auto; padding: 0 12px;
}
.my_banner_txt h2 {
  position: absolute; top: 90%; transform: translateY(-100%); padding: 0.5rem 1.5rem;
  color: black; font-size: 2rem; font-family: 'Open Sans', sans-serif; font-weight: 600;
  background: rgba(255, 255, 255, 0.85); box-shadow: 0 0 20px 0 #000;
}

/* for simple banner: */
.my_s_banner {
  display: flex;
  justify-content: center;
}
.my_s_banner_img {
  max-width: 100%;
  height: auto; 
}

/* full width image */
.showcase {
  background-color: #f2f2f2;
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  justify-items: center;
  gap: 1rem;
  padding: 10px;
}

/* cards */
.cards{
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 1.5rem auto 2rem;
    gap: 1.5rem;
}
@media (max-width: 1024px) {
  .cards{grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 648px) {
  .cards{grid-template-columns: 1fr;}
}
/*@media (max-width: 480px) {
  .cards{grid-template-columns: 1fr;}
}*/
.acard{ /* the bootstrap css has a predefined style 'card', so I use 'acard' here */
    /*background-image: linear-gradient(#fff, #fff, #f2f2f2);*/
    background-color: #f2f2f2;
    padding: 0;
    /*border: 1px solid rgba(0,0,0,.125);*/
    /*border-radius: .5rem;*/
    box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px;
}
.acard img{
    margin-top: 0; /*.3rem;*/
}
.cardtext{
    padding: 1.5rem;
}