:root {
    --albastru-principal: #266E99;
    --text-fundal-deschis: #000000;
    --verde: #17C38C;
    --white: #ffffff;
    --inchis: #4F4F4F;
}
body{
    font-family:Open Sans;
}

.required{
   color: red;
}

/* globale */
@media (min-width: 0) and (max-width: 65px) {
   .container{
      max-width: 560px;
   }
}

@media (min-width: 660px) and (max-width: 800px) {
   .container {
      max-width:700px;
   }
}

@media (min-width: 801px) and (max-width: 991px) {
   .container {
      max-width:760px;
   }
}

/* @media (min-width: 992px) {
   .container{
       max-width: 940px;
   }
} */

@media (min-width: 992px) and (max-width: 1024px) {
   .container {
      max-width:940px;
   }
}

@media (min-width: 1300px) {
   .container{
       max-width: 1276px;
   }
}

@media (min-width: 1600px) {
   .container-webis{
      max-width: 1585px;
      margin:0 auto;
   }
}

.d-none-desktop{
   display: none;
}

.container-webis{
    max-width: 1585px;
    width:100%;
    margin: 0 auto;
}

.text-principal{
    color:var(--albastru-principal);
}

.bg-principal{
    background-color: var(--albastru-principal);
}

.subtitlu,
.titlu-albastru{
   font-size:40px;
   font-weight:bold;
   color: var(--albastru-principal);
}

.subtitlu{
   margin-bottom: 20px;
   font-size:20px;
}

.titlu-negru-mediu{
   font-size:25px;
   font-weight:600;
   color: var(--inchis);
}

.hero-dreapta{
   z-index: 1;
}


.navbar-toggler{
   line-height: 1.5;
}

.bgProiectImplementare{
   padding: 10px;
   border-radius: 10px;
   background-color: #f2f2f2;
   margin-bottom: 20px;
}

.fontLight{
   color: #999
}

/* header */
#header-bara{
   background: var(--albastru-principal);
   padding: 10px 0;
   line-height:28px;
   font-size:15px;
} 


#header-bara-text{
   color:white;
   padding-top:7px;
}

#header-bara .dropdown-menu{
   z-index: 99999; 
}

.btn-principal,
.btn-header-no-hover,
.btn-bg-dark,
.btn-header{
   color:white !important;
   background-color: var(--albastru-principal);
   border: solid 1px white;
   border-radius:5px;
   line-height:43px;
   padding: 0 15px;
}

.btn-webis{
   border: solid 1px white;
   border-radius:5px;
   line-height:43px;
   padding: 0 15px;
}

.btn-favorite-stil{
   color:white !important;
   background-color: #ED7474;
}

.btn-vot{
   color:white !important;
   background-color: #17C38C;
}

.btn-social{
   color:white !important;
   background-color: #3B5998;
}

.btn-social:hover{
   opacity: 0.8;
}

.btn-principal:hover,
.btn-header:hover{
   color:var(--albastru-principal) !important;
   background: white;
   border:solid 1px var(--albastru-principal);
}


.btn-header-reverse{
    color:var(--albastru-principal) !important;
    background: white;
    border: solid 1px var(--albastru-principal);
    border-radius:5px;
    line-height:43px;
    padding: 0 15px;
}

.btn-header-reverse:hover{
   color: white !important;
   background:var(--albastru-principal);
   border:solid 1px white;
}

#header-logo{
   padding-top:28px;
   padding-bottom:28px;
}

.meniuPMB{
   justify-content: end;
   z-index:9999;
}

.meniuPMB li{
   padding:0 20px;
   line-height:16px;
}

.meniuPMB li:last-child{
   padding-right:0;
}

.meniuPMB a{
   color: var(--text-fundal-deschis);
   padding:0;
}

.meniuPMB a:hover{
   color:var(--albastru-principal);
}

.meniuPMB .active{
   color:var(--albastru-principal);
}

.border-dreapta-principal{
   border-right: solid 1px var(--albastru-principal);
}

#logo-box{
   width:217px;
   height:71px;
}

#logo{
   width:217px;
   transition: all 0.2s ease-out;
}

#logo:hover{
   width:207px;
   padding:5px;
}

.submeniu{
   position: absolute;
   width: 100%;
   background-color: #fff;
   padding: 0;
   border: 0;
   top: 7px !important;
   border-radius: 0;
   box-shadow: 0 4px 30px 0 #266e9926;
}

.submeniu li{
   border: none;
   text-align: left;
   border-top: 2px solid #f3f9ff;
   padding-left: 0;

}

.submeniu li:hover{
   background-color: var(--albastru-principal);
}
.submeniu li:hover a{
   color: #fff;
}

.submeniu a{
   font-size: 15px;
   font-weight: 500;
   padding: 5px 10px;
}

.submeniu .dropdown-item{
   border: 0;
   line-height: 30px;
   font-size: 14px;
}


.submeniu a{
   color: var(--text-fundal-deschis);
}

.meniuPMB .submeniu{
   top: 25px !important;
}

.dropdown-item.active, .dropdown-item:active{
   background-color: var(--albastru-principal);
}
.dropdown-item.active, .dropdown-item:active{
   color: #fff !important;
}




/* footer */
#footer{
   background-color: #1F1F1F;
   background-image:url("/images/VectorFooter.png");
   background-repeat: no-repeat;
   background-position: left 0 bottom -20px;
   padding:120px 0;
   color:white;
   margin-top:50px;
}

.titlu-alb{
   color:white;
   font-size:30px;
   font-weight:bold;
   padding:0;
   margin:0;
}

#logo-footer{
   width:218px;
}

#footer-blue{
   background-color: var(--albastru-principal);
   background-size: 1000px;
   padding:28px 0;
}

#footer-blue p{
   color:white;
   opacity: 0.5;
   padding:0;
   margin:0;
   line-height:17px;
   font-size:14px;
}

#footer-blue a{
   color:white;
}

#footer-social{
   margin-top: 50px;
}

#footer-social a i{
   background: var(--albastru-principal);
   color: white;
   text-align: center;
   width: 50px;
   height: 50px; 
   border-radius: 25px;
   vertical-align: middle;
   font-size: 30px;
   line-height: 50px;
}

#footer-social a:hover i{
   opacity:0.7;
}
 
.link-footer a{
   color:white;
}



/* hero */
#hero{
   background: rgb(15,68,100);
   background: linear-gradient(122deg, rgba(15,68,100,1) 0%, rgba(38,110,153,1) 100%);
   border-radius:40px;
   padding: 100px 0;
   color:white;
   border:solid 1px var(--albastru-principal);
   position:relative;
   margin-bottom:50px;
}

#titlu-hero{
   font-size:70px;
   font-weight: bold;
   line-height:80px; 
}

#subtitlu-hero{
   font-size:28px;
   font-weight:300;
}

#subtitlu-hero span{
   font-weight: bold;
}

#img-hero-interior{
   position: absolute;
   right: 0;
   bottom: -70px; /* Inițial, imaginea este deplasată mai jos cu 70px */
   height: 100%;
   opacity: 0;
   animation: slideIn 1s ease forwards 2s; /* Adaugăm o întârziere de 1 secundă */
 }

#img-hero {
  position: absolute;
  right: 0;
  bottom: -70px; /* Inițial, imaginea este deplasată mai jos cu 70px */
  height: calc(100% + 70px);
  opacity: 0;
  animation: slideIn 1s ease forwards 2s; /* Adaugăm o întârziere de 1 secundă */
}

/* Definim animația pentru apariția imaginii */
@keyframes slideIn {
  to {
    bottom: 0; /* Imaginea revine la poziția normală */
    opacity: 1;
  }
}


/* home etape */
#etape{
   padding:125px 0;
   position:relative;
   z-index:999;
}

#etape svg{
   color: black;
   background:white;
}

#etape .trecuta,
#etape .trecuta svg{
   color: var(--albastru-principal);
}

#etape .activ,
#etape .activ svg{
   color: var(--verde);
}

#etape .inactiv,
#etape .inactiv svg{
   color: gray;
}

#etape p{
   font-size: 25px;
   font-weight:600;
   line-height:28px;
   margin-top:20px;
}

.svg-status-etapa{
   height:61px;
   margin-bottom:20px;
   line-height: 61px;
}

#linie-etape{
   height:5px;
   background:silver;
   border-radius:3px;
   bottom:220px;
   position:absolute;
   width:100%;
   z-index:-1;
}

#etape .date span{
   display: block;
}

/* domenii */
#domenii{
   position:relative;
   padding-top:100px;
}


#domenii-overlay{
   background-color:rgba(38, 110, 153, 0.05000000074505806);
   filter:drop-shadow(0px 2px 27.100000381469727px rgba(0.14901961386203766,0.4313725531101227,0.6000000238418579,0.20000000298023224));
   border-radius:40px;
   padding-top:150px;
   height:calc(100% - 230px);
   width:100%;
   top:0;
   position:absolute;
}

.project-box {
   background-color: var(--albastru-principal);
   color: white;
   padding: 20px;
   margin: 10px;
   text-align: center;
   border-radius: 10px;
   width:100%;
   position:relative;
   padding-top:100px;
   padding-bottom:30px;
   margin-bottom: 100px;
   z-index:99;
}


.bg-domenii{
   position:absolute;
   bottom:0px;
   right:0px;
   z-index:-1;
   width:35%;
   filter: brightness(4);
   opacity: 0.2;
   display:none;
   animation: all 1s ease-in; /* Adaugăm o întârziere de 1 secundă */
}

.project-box:hover .bg-domenii{
   display: block;
}


.project-box h5{
   font-size:25px;
   font-weight:600;
   line-height:31px;
}

.text-domenii{
   height:62px;
   margin-bottom:30px;
}


.box-domenii {
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
}

.proiect{
   border: solid 4px var(--albastru-principal);
   border-radius:20px;
   padding:20px;
   margin-bottom:90px;
   position: relative;
}

.proiect .icon-cerc{
   background-color: var(--albastru-principal);
   left:auto;
   right:40px;
}


.proiect .icon-cerc img{
   filter: brightness(5);
}

.icon-cerc{
   width:130px;
   height:130px;
   border-radius: 50%;
   filter:drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.2));
   background-color:#ffffff;
   position:absolute;
   text-align:center;
   top:-70px;
   left: calc(50% - 65px);
   transition: all 0.2s ease-out;
}

.project-box:hover .icon-cerc{
   top: -80px;
}

.project-box:hover .btn-header{
   color: var(--albastru-principal) !important;
   background: white;
}

.icon-cerc img{
   object-fit: contain;
   text-align: center;
   height:70px;
   margin-top:25px;
}

#ce-este{
   background: url('/images/ce-este.jpg');
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
   padding:60px 0 227px 0;
   border-bottom-left-radius: 40px;
   border-bottom-right-radius: 40px;
}


#ce-trebuie{
   margin-bottom: -50px;
   margin-top: -150px;
   
}

#ce-trebuie img{
   max-width:100%;
   height:auto;
   object-fit: contain;
   position: absolute;
   bottom: 1px;
}

.text-ce-trebuie{
   padding-top: 200px;
   padding-bottom: 40px;
}

#map-canvas{
   margin-bottom:70px;
   border-radius: 20px;
}

/* proiect */
#taburi-proiect{
   margin-top:50px; 
}

#taburi-proiect p{
   margin:0;
   padding:0;
   font-weight: 300;
   font-size:14px;
}

#taburi-proiect img{
   filter: brightness(5);
}

#taburi-proiect p.taburi-text-bold{
   font-weight: bold;
}

#hero.hero-proiect{
   background: rgb(15,68,100);
   background: linear-gradient(122deg, rgba(15,68,100,0.9) 0%, rgba(38,110,153,0.9) 100%);
}

.background-proiect{
   background-image: url('/images/background-hero-proiect.jpg');
   background-blend-mode: color-burn;
   border-radius:40px;
} 


#atasamente{
   background: #F2FAFF;
   border-radius:10px;
   box-shadow: #ddd 0 0 10px;
   padding:30px;
   margin-bottom:50px;
}

.atasament{
   padding:10px 0;
   border-bottom:solid 1px #CAEBFF;
}

.atasament:last-child{
   border:none;
}

.open-accessibility{
   min-width:auto;
}

/* inregistrare */
.form-check{
   display:inline-block;
   padding-left:0;
}

.form-check-input{
   margin-left:0;
}

.form-check-input input{
   padding-left:0;
}

.form-check-label{
   padding-left:20px;
   padding-right:20px;
}

.relative{
   position:relative;
}

.togglePassword{
   position:absolute;
   top:10px;
   right:20px;
   color:gray;
}

#inregistrare input[type='checkbox']{
   margin-left:0;
}

/* arhiva proiecte */
.domeniu{
   display:inline-block;
}

.linieBottom{
   border-top: 1px solid #f2f2f2;
}

.proiect .titlu-albastru{
   font-size: 24px;
   width: 87%;
}

.titlu-albastru-small{
   font-weight:bold;
   color: var(--albastru-principal);
   font-size: 24px;
}

.domeniu a{
   padding:10px 50px;
   background-color: var(--albastru-principal);
   color:white;
   display:block;
   margin-right:50px;
   border-radius:5px;
}


.status_proiect{
   padding: 10px;
   border-radius: 5px;
   display: block;
   font-size: 14px;
   line-height: 14px;
   color: #fff;
   font-weight: 500;
   cursor: pointer;
}

.status_proiect.portocaliu{
   background:orange
}
.status_proiect.albastru{
   background:blue
}

.status_proiect.verde{
   background:green
}

.status_proiect.verde-deschis{
   background:#5ed15c
}

.status_proiect.rosu{
   background:red
}

.status_proiect.negru{
   background: #222;
}

.footer_proiect{
   position: absolute;
   bottom: 15px;
   left: 15px;
}
.nrVoturi{
   border-radius: 5px;
   display: inline-flex;
   border: 1px solid #266e99;
   padding: 5px;
   align-items: baseline;
}

.nrVoturi span{
   display: inline-block;
   line-height: 20px;
   font-size: 15px;
   color: #266e99;
   margin-left: 5px;
}

.imgSmall{
   height: 15px;
}

/* arhiva proiecte */
.arhiva_etapa{
   display: inline-block;
   margin-top: 10px;
   padding: 5px 7px;
   color: #fff;
   border-radius: 5px;
   font-size: 14px;
}
.arhiva_etapa.orange{
   background: orange;
}
.arhiva_etapa.green{
   background: green;
}
.arhiva_etapa.black{
   background: black;
}
.arhiva_etapa.blue{
   background: blue;
}


/* depune proiect */
.ck-editor__editable {
   min-height: 200px;
}


.swal2-confirm{
   background:var(--albastru-principal) !important;
}

.swal2-confirm a{
   color:white;
}

.swal2-cancel{
   background:var(--white) !important;
   border: solid 1px var(--albastru-principal) !important;
   color:var(--albastru-principal) !important;
}

.swal2-cancel a{
   color:var(--albastru-principal) !important;
}


.divProfil .row{
   margin-bottom: 10px;
}

.sterge_cont{
   color: red;
   font-size: 14px;
   padding: 0
}

.text-alb{
   color: var(--white);
}

.domenii{
   display: grid;
   grid-column-gap: 20px;
   grid-row-gap: 20px;
   grid-template-columns: repeat(1, 1fr)
}

.domeniu{
   text-align: left;
   padding: 15px;
   cursor: pointer;
   border: 2px solid #f2f2f2
}

.domeniu img{
   height: 150px;
   width: auto;
}

.z-index-2{
   z-index: 2;
}

.imgPreviewProiecte{
   height: 42px;
   width: 132px;
   object-fit: cover;
   position: relative;
   border: 1px solid #f2f2f2;
   padding: 10px;
   margin-right: 15px;
   display: inline-block;
}

.imgPreviewProiecte .stergeAtasament {
   color: #fff;
   position: absolute;
   top: -5px;
   right: -5px;
   padding: 7px;
   background: red;
   border-radius: 50%;
   font-size: 12px;
   cursor: pointer;
}

.icon_img{
   color: var(--text-fundal-deschis);
}

.proiect .icon_img {
   font-size: 14px;
}

.proiect .icon_img img{
   height: 30px;
   opacity: 0.4;
}

.alerta-custom{
   border-radius: 5px;
   border:1px solid #4ca1f6;
   color: #4ca1f6;
}

.sesiuni{
   display: grid;
   grid-template-columns: repeat(4,1fr);
   column-gap: 5px;
   row-gap: 5px;
}

.sesiune{
   text-align: left;
   padding: 15px;
   cursor: pointer;
   border: 2px solid #f2f2f2
}
.sesiune a{
   display: block;
}

.sesiune.active,
.sesiune:hover{
   border:2px solid #266e99;
   background: #f2f2f2;
}

.sesiune{
   text-align: center;
}

.open-accessibility-menu-button span {
   position: absolute;
   display: block;
   width: 100%;
   bottom: 10px;
   font-weight: 400;
   font-size: 13px;
}

.open-accessibility-menu-button {
   display: flex;
   float: left;
   box-sizing: border-box;
   width: 100%;
   /* width: 60px; */
   height: 48px;
   cursor: pointer;
   transition: background-color .1s;
   text-align: left;
   position: relative;
   border-radius: 2px;
   align-content: space-between;
   justify-content: flex-start;
}

.open-accessibility.open-accessibility-expanded .open-accessibility-container {
   width: 190px;
   height: 430px;
   border-radius: 2px;
   color: var(--text-fundal-deschis);
   background-color: #fff;
   transform: scale(1,1) translate3d(0,0,0);
}

.open-accessibility-expand-button{
   line-height: 65px;
   width: 70px;
}

.open-accessibility-expand-button svg {
   height: 31px;
   line-height: 31px;
}

.open-accessibility.open-accessibility-collapsed .open-accessibility-container {
   height: 60px;
   width: 70px;
   border-radius: 0px;
   position: absolute;
   background-color: #9ca6af;
}


.open-accessibility-menu-button span {
   position: absolute;
   display: block;
   width: 60%;
   bottom: 16px;
   font-weight: 400;
   font-size: 13px;
}

.open-accessibility {
   position: fixed;
   direction: rtl;
   z-index: 10;
   right: 0px;
   top: 31px;
   min-width: 300px;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}

/* anunturi */
.blocText{
   color: #333;
}

.proiect .titlu_proiect{
   color: #266e99;
   font-size:18px;
   width: 80%;
}


/* mobile */
@media all and (min-width:0px) and (max-width: 767px) {
   .subtitlu{
      margin-bottom: 0;
   }
   
   .btn-header,
   .btn-header-reverse{
      line-height: 30px;
      padding: 0 6px;
      font-size: 12px;
   }

   #logo-box{
      height: auto;
      width: auto;
   }

   #logo{
      height: 46px;
      width: auto;
      object-fit: contain;
   }

   #header-bara-text{
      font-size: 14px;
      padding-top: 0;
      line-height: 24px;
      margin-bottom: 5px;
   }

   #header-logo{
      padding-top: 15px;
      padding-bottom: 15px;
   }
   .meniu_mobile{
      justify-content: flex-end;
      padding: 0;
   }

   .meniu_mobile .navbar-toggler-icon{
      line-height: 1.5em;
   }

   .meniuPMB{
      position: absolute;
      top: -2px;
      width: 100%;
      background-color: #fff;
      padding: 0;
   }

   .meniuPMB li{
      border: none;
      text-align: left;
      border-top: 2px solid #f3f9ff;
      padding-left: 0;

   }

   .meniuPMB li:hover{
      background-color: var(--albastru-principal);
   }
   .meniuPMB li:hover a{
      color: #fff;
   }

   .meniuPMB a{
      font-size: 15px;
      font-weight: 500;
      padding: 15px 20px !important;
   }

   .meniuPMB .dropdown-item{
      border: 0;
      padding: 0 !important;
      line-height: 30px;
      font-size: 14px;

   }

   .meniuPMB .dropdown-menu{
      background-color: #fff;
      border: 0;
      padding: 0;
      padding-left: 30px;
      border-radius: 0;
   }

   .meniuPMB .dropdown-menu a{
      color: var(--text-fundal-deschis) !important;
   }

   /* ----------- HOME ------------- */
   #img-hero{
      bottom: 0;
      height: 56%;
   }

   #titlu-hero{
      font-size: 40px !important;
      line-height: 44px !important;
   }

   #subtitlu-hero{
      font-size: 18px;
      line-height: 14px;
   }

   #text-hero{
      font-size: 14px;
      margin-bottom: 20px !important;
   }

   #hero{
      padding: 40px 0 40px 0;
      border-radius: 0;
      /* padding-bottom: 200px; */
      margin-bottom: 20px;
   }

   #hero.hero-image{
      padding-bottom: 150px;
   }

   #etape{
      padding: 30px;
      margin-bottom: 15px;
   }

   #etape svg{
      height: 44px;
      width: 44px;
   }

   #etape .svg-status-etapa{
      height: 30px;
      line-height: 30px;
   }

   #etape .svg-status-etapa svg{
      height: 25px;
      width: 25px;
   }

   #etape p{
      font-size: 14px;
      line-height: 18px;
      margin-top: 10px;
      font-weight: 600;
   }

   #etape .date span{
      font-size: 14px;
      line-height: 18px;
      font-weight: 600;
   }


   #linie-etape-first{
      top: 151px;
      position: absolute;
      height:5px;
      background:silver;
      border-radius:3px;
      width:85%;
      z-index:-1;
   }

   #linie-etape{
      bottom: 97px;
      width:85%;
   }

   #etape .row .col-6:nth-child(3),
   #etape .row .col-6:nth-child(4){
      margin-top: 30px;
   }

   .subtitlu, .titlu-albastru{
      font-size: 25px;
      line-height: 30px;
   }

   #domenii{
      padding-top: 50px;
   }

   #domenii-overlay{
      border-radius: 0;
      padding-top: 50px;
      height: calc(100% - 150px);
   }

   .box-domenii{
      margin-top: 10px !important;
   }

   .project-box{
      padding-top: 55px;
      margin: 0;
      margin-bottom: 60px;
   }

   .text-domenii {
      height: 35px;
   }

   .text-domenii h5{
      font-size: 14px ;
      line-height: 23px;
   }

   .icon-cerc{
      width: 72px;
      height: 72px;
      left: calc(50% - 36px);
      top: -44px;
      right: 0 !important;
   }

   .icon-cerc img{
      height: 47px;
      width: 47px;
      margin-top: 14px;
   }

   .titlu-negru-mediu{
      line-height: 30px;
   }

   #ce-este{
      padding-top: 0;
      padding-bottom: 60px;
      margin-top: 0;
      border-radius: 0;
   }

   #ce-este .row .col:nth-child(2){
      margin-top: 30px;
   }

   #ce-este .btn{
      border: 0;
   }

   #ce-trebuie{
      margin-top: 50px;
   }

   #ce-trebuie .row .col:nth-child(1){
      display: none;
   }

   .text-ce-trebuie{
      padding-top: 0;
      padding-bottom: 30px;
   }

   /* ------------ FOOTER ---------------- */
   #footer{
      padding: 40px 0
   }

   #footer p{
      font-size: 14px;
      margin-bottom: 5px;
   }

   #text-footer{
      font-size: 14px;
      padding-bottom: 10px !important;
   }

   .titlu-alb{
      font-size: 22px !important;
      margin-bottom: 10px !important;
      margin-top: 20px;
   }

   .link-footer {
      margin-bottom: 5px;
   }

   .link-footer a{
      font-size: 14px;
   }

   #footer-blue{
      padding: 14px 10px;
   }


   /* ------------ DOMENII ---------------- */
   #img-hero-interior{
      height: 41%;
   }

   .titlu-hero{
      font-size: 26px;
   }

   /* ------------ PROIECTE ---------------- */
   

   .proiect{
      margin-bottom: 60px;
   }

   .proiect div{
      word-wrap: break-word;
   }

   .proiect .btn{
      margin-top: 10px;
   }

   .proiect .btn-header, 
   .proiect .btn-header-reverse{
      padding: 5px;
   }

   #hero.hero-proiect{
      padding-bottom: 20px;
   }

   #taburi-proiect .col{
      margin-bottom: 10px;
   }

   #taburi-proiect{
      margin-top: 20px;
   }
   #atasamente{
      padding: 10px;
      margin-bottom: 0;
   }

   .sesiuni{
      grid-template-columns: repeat(3, 1fr);
   }

   .sesiune{
      padding: 7px;
   }


   /* ------------ GENERALE ---------------- */

   p#bread{
      font-size: 16px;
      text-wrap: nowrap;
      overflow-x: auto;
      margin-bottom: 10px;
   }

   .mt-5{
      margin-top: 2rem !important;
   }
   .container{
      padding-left: 30px;
      padding-right: 30px;
   }
   .open-accessibility{
      top: 210px;
   }

   .text-right-mobile{
      text-align: right;
   }

   .text-left-mobile{
      text-align: left !important;
   }

   .text-center-mobile{
      text-align: center !important;
   }

   .pl-mobile-0{
      padding-left: 0 !important;
   }

   .swal2-title{
      font-size: 1.275em !important;
   }

   .swal2-icon .swal2-icon-content{
      font-size: 2.75em !important;
   }

   .swal2-icon{
      width: 3em !important;
      height: 3em !important;
   }

   .open-accessibility{
      position: fixed !important;
   }

   .open-accessibility-container{
      z-index: 1
   }
   .open-accessibility-menu-button span{
      width: 90%
   }
   .open-accessibility-close-button{
      height: 30px
   }

   .d-block-mobile{
      display: block !important;
   }
   .d-none-mobile{
      display: none !important;
   }

   .p-0-mobile{
      padding: 0;
   }

   .mt-3-mobile{
      margin-top: 30px;
   }
}



@media only screen and (min-device-width : 576px) and (max-device-width : 991px) {
   .meniuPMB{
      position: absolute;
      top: -2px;
      width: 100%;
      background-color: #fff;
      padding: 0;
   }

   .meniuPMB li{
      border: none;
      text-align: left;
      border-top: 2px solid #f3f9ff;
      padding-left: 0;

   }

   .meniuPMB li:hover{
      background-color: var(--albastru-principal);
   }
   .meniuPMB li:hover a{
      color: #fff;
   }

   .meniuPMB a{
      font-size: 15px;
      font-weight: 500;
      padding: 15px 20px !important;
   }

   .meniuPMB .dropdown-item{
      border: 0;
      padding: 0 !important;
      line-height: 30px;
      font-size: 14px;
   }

   .meniuPMB .dropdown-menu{
      background-color: #fff;
      border: 0;
      padding: 0;
      padding-left: 30px;
      border-radius: 0;
   }

   .meniuPMB .dropdown-menu a{
      color: var(--text-fundal-deschis) !important;
   }
}

@media only screen and (min-device-width : 576px) and (max-device-width : 1023px) {
   .meniu_mobile{
      justify-content: flex-end;
      padding: 0;
   }

   #img-hero{
      height: 81%;
   }

   #hero{
      border-radius: 0;
      padding: 35px 0;
   }

   #titlu-hero{
      font-size: 40px !important;
      line-height: 44px !important;
   }

   #logo{
      height: 54px;
      width: auto;
   }

   #logo-box{
      height: auto;
   }

   #header-logo{
      padding-top: 24px;
      padding-bottom: 24px;
   }

   .btn-header, .btn-header-reverse{
      font-size: 16px;
      padding: 3px 10px;
      line-height: 36px;
   }

   #hero .btn{
      margin-bottom: 10px;
   }

   #etape{
      padding: 30px;
      margin-bottom: 15px;
   }

   #etape svg{
      height: 44px;
      width: 44px;
   }

   #etape .svg-status-etapa{
      height: 30px;
      line-height: 30px;
   }

   #etape .svg-status-etapa svg{
      height: 25px;
      width: 25px;
   }

   #etape p{
      font-size: 14px;
      line-height: 18px;
      margin-top: 10px;
      font-weight: 600;
   }

   #etape .date span{
      font-size: 14px;
      line-height: 18px;
      font-weight: 600;
   }

   #linie-etape{
      bottom: 97px;
      width:85%;
   }

   #linie-etape-first{
      display: none !important;
   }

   #etape .row .col-6:nth-child(3),
   #etape .row .col-6:nth-child(4){
      margin-top: 0;
   }

   #linie-etape{
      width: 90%;
   }

   .btn-header, .btn-header-reverse{
      font-size: 14px;
      padding: 3px 8px;
      font-weight: 600;
   }

  
   .icon-cerc{
      width: 72px;
      height: 72px;
      left: calc(50% - 36px);
      top: -36px;
   }

   .icon-cerc img{
      height: 47px;
      width: 47px;
      margin-top: 14px;
   }


   #ce-este{
      background-position: bottom;
      padding-top: 0;
      padding-bottom: 112px;
      margin-top: 0;
      border-radius: 0;
   }

   #ce-este .btn{
      border: 0;
   }

   #ce-trebuie .row .col:nth-child(1){
      display: block;
   }

   #ce-trebuie img{
      max-width: 100%;
      height: 356px;
      position: absolute;
      top: -406px;
      right: -75px;
      object-fit: contain;
      z-index:0;
   }

   .titlu-negru-mediu{
      font-size: 20px;
   }

   #ce-este .row .col:nth-child(2){
      margin-top: 30px;
   }

   .subtitlu, .titlu-albastru{
      font-size: 35px;
      margin-bottom: 25px;
   }

   #domenii{
      padding-top: 50px;
   }

   #domenii-overlay{
      border-radius: 0;
      padding-top: 50px;
      height: calc(100% - 150px);
   }

   .box-domenii{
      margin-top: 10px !important;
   }

   .project-box{
      padding-top: 55px;
      padding-left: 10px;
      padding-right: 10px;
      margin: 0;
      margin-bottom: 60px;
   }

   .text-domenii{
      margin-bottom: 20px;
      height: 43px;
   }

   .text-domenii h5{
      font-size: 14px ;
      line-height: 19px;
   }

   footer .row .col:nth-child(2) .titlu-alb{
      margin-top: 0;
   }

   footer .row .col:nth-child(3) .titlu-alb{
      margin-top: 30px;
   }

   footer .row .col:nth-child(4) .titlu-alb{
      margin-top: 30px;
   }

   #footer-social{
      margin-top: 15px;
   }

   #footer-social a i{
      width: 40px;
      height: 40px;
      line-height: 40px;
      font-size: 20px;
   }

   footer .titlu-alb{
      font-size: 22px;
      margin-bottom: 15px !important;
   }

   #footer p{
      margin-bottom: 5px;
   }

   #footer{
      padding: 70px 0;
   }

   #logo-footer{
      width: 100%;
   }


   /* proiecte */
   .proiecte{
      margin-top: 20px;
   }

   .hero-image{
      padding-bottom: 100px;
   }

   #img-hero-interior{
      bottom: 0;
      height: 69%;
   }

   .titlu-hero{
      font-size: 30px;
   }

   #butoane-proiect .col{
      padding-left: 2px;
      padding-right: 2px;
   }

   #butoane-proiect .btn{
      font-size: 13px;
      padding: 0 10px;
   }

   .proiect{
      margin-bottom: 50px;
   }

   .img-hero-register{
      height: 50% !important;
   }

   .open-accessibility{
      top: 230px;
   }

   .open-accessibility{
      position: fixed !important;
   }

   .open-accessibility-container{
      z-index: 1
   }
   .open-accessibility-menu-button span{
      width: 90%
   }
   .open-accessibility-close-button{
      height: 30px
   }

   .text-left-tableta{
      text-align: left !important;
   }

   .text-right-tableta{
      text-align: right !important;
   }

   body, html{
      overflow-x: hidden;
   }   
}

@media (min-width: 768px) and (max-width: 1023px) {
   #ce-trebuie img{
      top: -206px;
      right: -87px;
   }
}

@media (min-width: 576px) and (max-width: 991px) {
   .d-block-tableta{
      display: block;
   }
}

@media (min-width: 992px) and (max-width: 1023px) {
   .meniuPMB li{
      padding: 0 10px;
   }
   .navbar-nav .nav-link{
      font-size: 14px;
   }

   #logo{
      height: 47px;
   }

   .pl-tablet-0{
      padding-left: 0 !important;
   }

   #ce-trebuie img{
      position: absolute;
      height: 440px;
      top: unset;
      right: 0;
      bottom: 0;
      object-fit: contain;
   }

   #ce-trebuie{
      margin-top: -70px;
   }

   .text-ce-trebuie{
      padding-top: 150px;
   }

   #ce-este{
      padding-bottom: 200px;
   }

   footer .row .col:nth-child(3) .titlu-alb{
      margin-top: 0;
   }

   footer .row .col:nth-child(4) .titlu-alb{
      margin-top: 0;
   }

   .w-100{
      width: 100%;
      display: block;
   }
}

@media (min-width: 1024px) and (max-width: 1299px) {
   .w-100{
      width: 100%;
      display: block;
   }
   .meniuPMB li{
      padding: 0 10px;
   }

   #hero{
      border-radius: 0;
   }

   #logo-box{
      height: auto;
   }

   #logo{
      width: 100%;
   }

   .meniuPMB .navbar-nav .nav-link{
      font-size: 15px;
   }

   .btn-principal, .btn-header-no-hover, .btn-bg-dark, .btn-header{
      padding: 0 13px;
   }

   .status_proiect{
      padding: 10px !important;
   }

   .project-box h5{
      font-size: 20px;
      line-height: 25px;
   }

   .project-box{
      padding-top: 80px;
   }

   #img-hero-interior{
      height: 60%;
   }

   /* .d-block-tableta{
      display: block;
   } */

   .pl-tablet-0{
      padding-left: 0 !important;
   }
}

@media (min-width: 1200px) and (max-width: 1299px) {
   #hero .btn{
      margin-bottom: 10px;
   }
}



.z-2{
   z-index: 2
}

.paddingTop0{ padding-top: 0px !important }
.paddingTop5{ padding-top: 5px; }
.paddingTop10{ padding-top: 10px; }
.paddingTop20{ padding-top: 20px; }
.paddingTop30{ padding-top: 30px; }
.paddingTop40{ padding-top: 40px; }
.paddingTop50{ padding-top: 50px; }
.paddingTop60{ padding-top: 60px; }
.paddingTop70{ padding-top: 70px; }
.paddingTop80{ padding-top: 80px; }
.paddingTop90{ padding-top: 90px; }
.paddingTop100{ padding-top: 100px; }
.paddingBottom0{ padding-bottom: 0px !important; }
.paddingBottom10{ padding-bottom: 10px; }
.paddingBottom20{ padding-bottom: 20px !Important; }
.paddingBottom30{ padding-bottom: 30px; }
.paddingBottom40{ padding-bottom: 40px; }
.paddingBottom50{ padding-bottom: 50px; }
.paddingBottom60{ padding-bottom: 60px; }
.paddingBottom70{ padding-bottom: 70px; }
.paddingBottom80{ padding-bottom: 80px; }
.paddingBottom90{ padding-bottom: 90px; }
.paddingBottom100{ padding-bottom: 100px; }
.paddingLeft0{ padding-left: 0px; }
.paddingLeft5{ padding-left: 5px; }
.paddingLeft10{ padding-left: 10px; }
.paddingLeft15{ padding-left: 15px; }
.paddingLeft20{ padding-left: 20px; }
.paddingLeft25{ padding-left: 25px; }
.paddingLeft30{ padding-left: 30px; }
.paddingLeft35{ padding-left: 35px; }
.paddingLeft40{ padding-left: 40px; }
.paddingLeft50{ padding-left: 50px; }
.paddingLeft60{ padding-left: 60px; }
.paddingLeft70{ padding-left: 70px; }
.paddingLeft80{ padding-left: 80px; }
.paddingLeft90{ padding-left: 90px; }
.paddingLeft100{ padding-left: 100px; }
.paddingRight0{ padding-right: 0px; }
.paddingRight5{ padding-right: 5px; }
.paddingRight10{ padding-right: 10px; }
.paddingRight15{ padding-right: 15px; }
.paddingRight20{ padding-right: 20px; }
.paddingRight30{ padding-right: 30px; }
.paddingRight40{ padding-right: 40px; }
.paddingRight50{ padding-right: 50px; }
.paddingRight60{ padding-right: 60px; }
.paddingRight70{ padding-right: 70px; }
.paddingRight80{ padding-right: 80px; }
.paddingRight90{ padding-right: 90px; }
.paddingRight100{ padding-right: 100px; }
.padding0{ padding:0 !important; }
.padding5{ padding:5px; }
.padding10{ padding:10px; }
.padding20{ padding:20px !important;}
.padding30{ padding:30px; }
.padding40{ padding:40px; }
.padding80{ padding:80px; }

/* margins */
.marginTop0{ margin-top: 0px !important; }
.marginTop5{ margin-top: 5px; }
.marginTop10{ margin-top: 10px; }
.marginTop15{ margin-top: 15px; }
.marginTop20{ margin-top: 20px; }
.marginTop30{ margin-top: 30px; }
.marginTop35{ margin-top: 35px; }
.marginTop40{ margin-top: 40px; }
.marginTop50{ margin-top: 50px; }
.marginTop55{ margin-top: 55px; }
.marginTop60{ margin-top: 60px; }
.marginTop70{ margin-top: 70px; }
.marginTop80{ margin-top: 80px; }
.marginTop90{ margin-top: 90px; }
.marginTop100{ margin-top: 100px; }
.marginTop1_5rem{ margin-top: 1.5rem; }
.marginBottom0{ margin-bottom: 0px; }
.marginBottom5{ margin-bottom: 5px; }
.marginBottom10{ margin-bottom: 10px; }
.marginBottom15{ margin-bottom: 15px; }
.marginBottom20{ margin-bottom: 20px; }
.marginBottom30{ margin-bottom: 30px; }
.marginBottom35{ margin-bottom: 35px; }
.marginBottom40{ margin-bottom: 40px; }
.marginBottom45{ margin-bottom: 45px; }
.marginBottom50{ margin-bottom: 50px; }
.marginBottom60{ margin-bottom: 60px; }
.marginBottom65{ margin-bottom: 65px; }
.marginBottom70{ margin-bottom: 70px; }
.marginBottom80{ margin-bottom: 80px; }
.marginBottom85{ margin-bottom: 85px; }
.marginBottom90{ margin-bottom: 90px; }
.marginBottom100{ margin-bottom: 100px; }
.marginLeft0{ margin-left: 0px; }
.marginLeft5{ margin-left: 5px; }
.marginLeft10{ margin-left: 10px; }
.marginLeft15{ margin-left: 15px; }
.marginLeft20{ margin-left: 20px; }
.marginLeft25{ margin-left: 25px; }
.marginLeft30{ margin-left: 30px; }
.marginLeft35{ margin-left: 35px; }
.marginLeft40{ margin-left: 40px; }
.marginLeft50{ margin-left: 50px; }
.marginLeft60{ margin-left: 60px; }
.marginLeft70{ margin-left: 70px; }
.marginLeft80{ margin-left: 80px; }
.marginLeft90{ margin-left: 90px; }
.marginLeft100{ margin-left: 100px; }
.marginRight0{ margin-right: 0px; }
.marginRight5{ margin-right: 5px; }
.marginRight6{ margin-right: 6px; }
.marginRight10{ margin-right: 10px; }
.marginRight15{ margin-right: 15px; }
.marginRight20{ margin-right: 20px; }
.marginRight30{ margin-right: 30px; }
.marginRight40{ margin-right: 40px; }
.marginRight50{ margin-right: 50px; }
.marginRight60{ margin-right: 60px; }
.marginRight70{ margin-right: 70px; }
.marginRight80{ margin-right: 80px; }
.marginRight90{ margin-right: 90px; }
.marginRight100{ margin-right: 100px; }
.margin0{ margin:0; }
.margin10{ margin:10px; }
.margin20{ margin:20px; }