﻿/* General body styles */
body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: black;
}

/* Stilizare pentru containerul care conține titlurile */
.container-acasa {
  text-align: center; /* Centrează textul pe orizontală */
  margin-top: 50px; /* Spațiu de sus pentru a nu se lipi de margine */
}

/* Stilizare pentru h1 (titlul principal) */
h1 {
  font-size: 3rem; /* Mărimea textului pentru titlul principal */
  color: #ffffff; /* Culoarea titlului */
  margin-bottom: 10px; /* Spațiu între titlu și subtitlu */
}

/* Stilizare pentru h2 (subtitlu) */
h2.content-acasa {
  font-size: 1.5rem; /* Mărimea subtitlului */
  color: #000000; /* Culoarea subtitlului */
}


h3 {
  color: #330066;
}

.container {
  text-align: center;
  padding: 22px;
}

.organization-name {
  text-align: center;
  color: #330066;
  font-weight: bold;
  font-size: 22px;
}

.tagline {
  text-align: center;
  font-weight: bold;
  font-size: 18px;
}

.title-main {
  font-size: 24pt;
  font-weight: bold;
}

.content {
  text-align: left;
  color: #000000;
  font-weight: bold;
  font-size: 16px;
}

a {
  color: #6633cc;
  font-size: 10x;
  text-decoration: none;
}

.accent-text {
  font-size: 8pt;
  color: #330066;
}

/* Menu styles */
.menu {
  background-color: #330066;
  padding: 10px 0;
}

.menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
}
.flex {
  display: flex;
}
.items-center {
  align-items: center;
}
.justify-center {
  justify-content: center;
}
header {
  background: rgb(108, 108, 108);
}
.menu ul li {
  margin: 0 15px;
  position: relative; /* Needed for dropdown */
}

.menu ul li a {
  color: white;
  text-decoration: none;
  font-size: 16px;
  font-weight: bold;
}

.menu ul li a:hover {
  color: #ffcc00;
}

/* Submenu styles */
.menu ul li ul {
  display: none; /* Hide submenu by default */
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #330066;
  padding: 10px 0;
  list-style: none;
  margin: 0;
  z-index: 1000; /* Ensure submenu is above other content */
}

.menu ul li ul li {
  margin: 0;
  position: relative; /* Needed for nested submenu */
}

.menu ul li ul li a {
  font-size: 14px;
  color: white;
  padding: 5px 20px;
  display: block;
}

.menu ul li ul li a:hover {
  background-color: #6633cc;
}

/* Nested submenu (second level) */
.menu ul li ul li ul {
  display: none; /* Hide nested submenu by default */
  position: absolute;
  top: 0;
  left: 100%; /* Position next to parent menu */
  background-color: #330066;
  padding: 10px 0;
  z-index: 999; /* Ensure the nested submenu is on top */
}

/* Show submenus on hover */
.menu ul li:hover > ul {
  display: block; /* Show the submenu when hovering over the parent */
}

.menu ul li ul li:hover > ul {
  display: block; /* Show nested submenu on hover */
}



/* Poziționează logo-ul în colțul din stânga sus */
.top-left-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 150px; /* Ajustează dimensiunea după nevoie */
  height: auto;
}

/* CertificariCalitate styles */

.content-certificari {
  font-size: 18px;
  text-align: left;
  color: #000000;
  font-weight: bold;
}

.content-certificari-1 {
  font-size: 18px;
  text-align: left;
  color: #000000;
  font-weight: bold;
}

.content-certificari-2 {
  width: 100%;
  text-align: left;
  padding: 22px;
  text-indent: 5px; /* Add indent (alignment) to the first line */
}

.politica-content {
  text-align: left;
  font-size: 20px;
}

.content-antete {
  text-align: left;
  width: 100%;
  font-size: 30px;
  color: #000000;
}

.content-acasa {
  text-align: left;
  width: 100%;
  font-size: 30px;
  color: #ffffff;
}

.sub-header {
  display: flex;
  align-items: center;
  justify-content: center; /* Center the content */
  border-bottom: 2px solid #ccc;
  padding-bottom: 15px;
}

.sub-header-text {
  flex-grow: 1; /* Allow the text container to grow */
  text-align: center; /* Center the text inside the container */  
}

.submenu-container {
  position: relative;
  display: inline-block;
}

/* Tabel SMI */

.titlu-tabel-smi{
  text-align:center
}

table {
  width: 100%;
  border-collapse: collapse;
}
th, td {
  border: 1px solid   #dddddd3f;
  padding: 8px;
  text-align: center;
}
th {
  background-color: #2929295a;
  color: rgb(0, 0, 0);
}
tr:nth-child(even) {
  background-color: #f2f2f2;
}

.merged-cell {
  font-weight: bold;
  background-color: #fffefe;
}


/* Stil pentru meniul principal */
#menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
}

#menu li {
  position: relative;
  padding: 0 10px;
}

#menu a {
  text-decoration: none;
  color: white;
  font-weight: bold;
}

#menu a:hover {
  color: black;
}

/* Stil pentru submeniuri */
#menu ul ul {
  display: none;
  position: absolute;
  top: 100%; /* Submeniul apare dedesubt */
  left: 0;
  background-color: rgb(0, 150, 255);
  padding: 10px;
  flex-direction: column;
  min-width: 150px;
}

#menu li:hover > ul {
  display: block;
}

#menu ul ul li {
  padding: 5px;
}

#menu ul ul a {
  color: white;
}

#menu ul ul a:hover {
  color: #333;
}

/* Nested submenu (second level) */
#menu ul li ul li ul {
  display: none; /* Hide nested submenu by default */
  position: absolute;
  top: 0;
  left: 100%; /* Position next to parent menu */
  background-color: rgb(0, 150, 255);
  padding: 10px 0;
  z-index: 999; /* Ensure the nested submenu is on top */
}

/* Show submenus on hover */
#menu ul li:hover > ul {
  display: block; /* Show the submenu when hovering over the parent */
}

#menu ul li ul li:hover > ul {
  display: block; /* Show nested submenu on hover */
}


/* Containerul general pentru secțiunea textului și imaginii */
.container.content-wrapper {
  display: flex;
  justify-content: space-between; /* Asigură distribuirea textului și imaginii */
  align-items: flex-start; /* Aliniază la începutul containerului */
  gap: 30px; /* Adaugă un spațiu între text și imagine */
  padding: 20px; /* Adăugăm padding în jurul conținutului */
}

/* Stilizarea textului */
.text-content {
  flex: 1; /* Permite textului să ocupe tot spațiul disponibil */
  text-align: center; /* Aliniază textul pe centru pe mobil */
  max-width: 100%; /* Permite textului să ocupe întreaga lățime pe mobil */
}

.content-antete {
  font-size: 1.2rem; /* Mărimea textului */
  line-height: 1.6; /* Înălțimea liniei pentru o citire mai ușoară */
  margin-bottom: 20px; /* Spațiu între paragrafe */
  text-align: justify; /* Aliniem textul la ambele margini */
  text-indent: 40px; /* Adaugă alineat (spațiu de 30px la începutul fiecărui paragraf) */
}

/* Stilizarea imaginii */
.image-content img {
  width: 350px; /* Poți ajusta dimensiunea imaginii după necesitate */
  height: auto; /* Păstrează proporțiile imaginii */
  border-radius: 10px; /* Oferă un efect de colțuri rotunjite imaginii */
}

/* Responsivitate pentru mobil */
@media (max-width: 768px) {
  .container.content-wrapper {
      flex-direction: column; /* Pe ecrane mici, textul și imaginea sunt pe coloane */
      align-items: center; /* Centrează conținutul pe mobil */
  }

  .image-content img {
      width: 100%; /* Imaginea va ocupa 100% din lățimea containerului pe mobil */
  }

  .text-content {
      text-align: center; /* Aliniază textul pe centru pe mobil */
      max-width: 100%; /* Permite textului să ocupe întreaga lățime pe mobil */
  }
}

/* Stilizare pentru secțiunea de contact */
.contact {
  max-width: 800px;
  margin: 20px auto;
  padding: 20px;
  background-color: #f4f4f4;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.contact h1 {
  text-align: center;
  color: #333;
}

.contact-info ul {
  list-style-type: none;
  padding: 0;
}

.contact-info li {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}

.contact-info a {
  color: #007bff;
  text-decoration: none;
}

.contact-info a:hover {
  text-decoration: underline;
}

.contact-info .contact-icon {
  width: 30px;
  height: 30px;
  margin-right: 10px;
}

.contact-form label {
  display: block;
  margin: 10px 0 5px;
  font-weight: bold;
}

.contact-form input, .contact-form textarea {
  width: 100%;
  padding: 10px;
  margin-bottom: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
  font-size: 1rem;
}

.contact-form button {
  width: 100%;
  padding: 10px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 5px;
  font-size: 1rem;
  cursor: pointer;
}

.contact-form button:hover {
  background-color: #0056b3;
}


/* Stilizează doar textul din .container-acasa pentru a fi alb */
.container-acasa {
  background-image: url('../images/locomotiva.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 400px; /* Asigură că div-ul are înălțimea dorită */
  display: flex;
  justify-content: center;
  align-items: center;
  color: white; /* Face textul alb */
  text-align: center; /* Aliniază textul la centru */
}

footer {
  text-align: center;
  padding: 20px;
  background: rgb(108, 108, 108);
  color: white;
}
