  /* ---------------------------------
  General Styles and Variables
------------------------------------ */
:root {
  --primary-color: #007bff; /* Bootstrap default primary */
  --secondary-color: #f8f9fa;
  --dark-color: #343a40;
  --light-color: #ffffff;
}

header{display:none;}
footer{display:none;}


body {
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  color: #333;
}

/* Logo */
.instituteLogo {
  max-height: 40px;
}
.uni_logo{
  height: 40px;
margin-left: 20px;
}

/* ---------------------------------
  Navbar
------------------------------------ */
.navbar-brand span {
  font-size: 1.2rem;
}

.navbar .nav-link {
  margin-left: 1rem;
}

/* ---------------------------------
  Hero Section
------------------------------------ */
.hero-section {
  min-height: 70vh;
  /* background:url("/fileadmin/website_uni_ulm/nawi.i3rc/website/assets/images/hero-bg.jpg") center/cover no-repeat; */
  color: #fff;
  background:#000;
  padding:4rem 0;

}

.white_btn{
  padding: 15px 45px !important;
  margin: 10px 0 !important;
  border-radius:35px !important;
  background-color: #ffffff !important;
  text-decoration:none !important;
  color: #000000 !important;

}

.dark_btn{
  padding: 15px 45px !important;
  margin: 10px 0 !important;
  border-radius:35px !important;
  background-color: #005EB0 !important;
  text-decoration:none !important;
  color: #ffffff !important;
}
.heroImage {
  text-align: right !important;
}
.heroImage img {
  max-width: 100%;
  margin-top: -2rem;
  text-align: right;
}

.banner-box {
background-color: #048C80;
border: none;
transition: box-shadow 0.3s ease;
color: #ffffff !important;
border-radius: 20px;
text-align: left;
padding: 50px;
background-image: url("https://www.uni-ulm.de/fileadmin/website_uni_ulm/nawi.i3rc/website/assets/images/recycle_bg_image.svg");
background-repeat: no-repeat;
background-position: bottom -25px right 50px;
}

.heroText{
  padding: 2rem 0;
}

.heroText h1{
  color: #20A3F5 !important;
}
.hero_sub_title{
  margin-top: 1.5rem !important;
  margin-bottom: 2.5rem !important;
  font-size: 1.87rem;
  font-weight: 300;
}

.standard_btn{
  width: 210px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  font-family: 'Plus Jakarta Sans', sans-serif !important;
  text-align: center !important;
}

/* Make text stand out on darker backgrounds */
.hero-section h1,
.hero-section p {
  color: #fff;
}

.content-type-tag {
  font-size: 0.9rem;
  padding: 5px 10px;
  margin-right: 20px;
  background-color: #95d3f9;
  color: #0781ec;
  text-align: center;
  max-width: 70px;
  border-radius:7px;
  display: inline-block;
  line-height: 1rem;
}

.content-type-tag-news {
  font-size: 0.9rem;
  padding: 5px 10px;
  margin-right: 20px;
  background-color: #95d3f9;
  color: #0781ec;
  text-align: center;
  max-width: 200px;
  border-radius:7px;
  display: inline-block;
  line-height: 1rem;
}
  

.content-date{    
  font-size: 0.9rem;
  padding: 5px 10px;
  margin-right: 20px;
  background-color: #ffffff;
  color: #a4a4a4;
  text-align: center;
  border-radius:7px;
  display: inline-block;
  line-height: 1rem;
}
.research-card{border: 1px solid #dfdfdf !important;}
.event-tag{ background-color: #95d3f9 !important;color: #0781ec !important;}
.press-tag{ background-color: #9cf995 !important;color: #059164 !important;}
.lectures-tag{ background-color: #fcc5e3 !important;color: #b30364 !important;}
.conforence-tag{ background-color: #eac0fa !important;color: #820bb5 !important;}

.project-box {
      background-color: #fff;
      border-radius: 25px;
      padding: 25px;
  }
.nav-item-space{
  width: 30%;
}

.project-tab-btn {
width: 100%;
font-size: 1.2rem;
color: #030304 !important;
font-weight: 500;
border: none !important;
padding-bottom: 15px;
border-bottom: 2px solid #e1e1e1 !important;
background: none !important;
margin-bottom: -6px !important;
}

.recruiting_blade h2{color: #ffffff !important;}

.nav-tabs{border-bottom: 2px solid #e1e1e1 !important;}

.card-body-research{
  padding-left: 40px;
  padding-top: 0px !important;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
color: var(--bs-nav-tabs-link-active-color);
background-color: var(--bs-nav-tabs-link-active-bg);
border-color: var(--bs-nav-tabs-link-active-border-color);
border-bottom: 2px solid #048C80 !important;
}


.card-rows {
border-bottom: 1px solid #bfbfbf !important;
border-radius: 0px !important;
padding: 25px;
  padding-bottom: 40px;

}

.card-rows:last-child{
  border-bottom: none !important;
}

.card-rows h5{
  font-weight: 600;
}

.card-rows img{
  object-fit: cover;
  border-radius: 20px;
}


/* ---------------------------------
  Section Titles & Subtitles
------------------------------------ */
.section-title {
  font-size: 2rem;
}

.section_blade {
margin: 0rem !important;
padding: 4rem 0 !important;
}
.priciples_blade{
  background-color: #20A3F5 !important;
}

.priciples_blade h2,.priciples_blade p {
  color: #ffffff;
}

/* ---------------------------------
  3R Principles Section
------------------------------------ */
.principle-card {
border: none;
background-color: #fff;
transition: box-shadow 0.3s ease;
color: #000000 !important;
border-radius: 20px;
text-align: left;
}
.principle-card:hover {
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
.card-box{
  margin-bottom: 1rem;
}
.card-text{
  color: #000 !important;
}
.highlight_card{
  padding: 50px !important;
}
.highlight_card h4{
  color: #FE8710!important;
}
.highlight_card image{
  height: 75px;
  margin-bottom: 15px;
}


.news-card{
border: none;
background-color: #fff;
transition: box-shadow 0.3s ease;
color: #000000 !important;
border-radius: 20px;
text-align: left;
  border: none !important;
}


.mission_blade{
  background-color: #FE8710;
}

.blade-image img{
  max-width: 100%;
  margin-top: -2rem;
  text-align: right;
}
.mission_blade h2{
  color: #ffffff !important;
}

.mission_blade p{
  color: #ffffff !important;
}
.banner-box-news{
background-color: #048C80;
border: none;
transition: box-shadow 0.3s ease;
color: #ffffff !important;
border-radius: 20px;
text-align: left;
padding: 50px;
}

.banner-box-news h2{
color: #ffffff !important;
}

.in-line-cta{text-decoration: underline !important;color: #005EB0 !important; font-weight: bold !important;}

.recruiting_blade{
background-image: url("https://www.uni-ulm.de/fileadmin/website_uni_ulm/nawi.i3rc/website/assets/images/scientist_recruiting.png");
background-position:bottom -25px right 30px;
background-size: 760px;
background-repeat: no-repeat;
}
/* ---------------------------------
  Initiatives Section
------------------------------------ */
.list-group-item {
  background-color: transparent;
  border: none;
  padding-left: 0;
}

/* ---------------------------------
  News & Events
------------------------------------ */
.news-card {
  border: 1px solid #ddd;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.news-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

/* ---------------------------------
  CTA Section
------------------------------------ */
.cta-section {
  background-color: #f5f5f5;
}

/* ---------------------------------
  Footer
------------------------------------ */
/* --- Container for the entire footer --- */
.footer-section {
width: 100%;
background-color: #fff; /* or any other color you prefer */
padding: 2rem;
box-sizing: border-box;
}

.footer{background-color: #000000;}

/* --- Inner wrapper to limit max width & center content --- */
.footer-content {
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: flex-start;
}

/* --- Left side with logos and address info --- */
.footer-left {
display: flex;
flex-direction: column;
gap: 1rem;
}
.footer-logos {
display: flex;
flex-wrap: wrap;
gap: 1rem;
align-items: center;
}
.footer-logos img {
height: 50px; /* adjust as needed */
width: auto;
}
.footer-contact-info p {
margin: 0.3rem 0;
}

/* --- Right side with navigation links --- */
.footer-right {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 1.5rem;
}
.footer-nav,
.footer-legal {
list-style: none;
margin: 0;
padding: 0;
text-align: right;
}
.footer-nav li,
.footer-legal li {
margin: 0.3rem 0;
}
.footer-nav a,
.footer-legal a {
text-decoration: none;
color: #000;
font-weight: normal;
}
/* ---------------------------------
  Responsive Tweaks
------------------------------------ */
/* Example: Adjust hero min-height on smaller screens */
@media (max-width: 768px) {
  .hero-section {
    min-height: 50vh;
  }
}
