* {
  margin: 0;
  padding: 0;
  font-family: "Poppins";
  color: white;
  box-sizing: border-box;
}

p {
  font-weight: 600;
}


/*PARALAX*/
.parallax1 {
  /* The image used */
  background-image: url("./assets/autocar\ pe\ inserate\ background\ autocolant.jpg");
  padding-top: 8vh;
  /* width: 100%; */
  min-height: 100vh;
}

.parallax2 {
  /* The image used */
  background-image: url("./assets/autocar\ la\ mare.jpeg");
  padding-top: 10vh;
  padding-bottom: 20vh;
  /* width: 100%; */
  min-height: 100vh;
}

.parallax3 {
  background-image: url("./assets/fete\ autocar.jpg");
  padding-top: 10vh;
  padding-bottom: 20vh;
  /* width: 100%; */
  min-height: 100vh;
}

.parallax4 {
  background-image: url("./assets/foto\ smile\ pe\ asfalt\ 1.jpg");
  padding-top: 10vh;
  padding-bottom: 20vh;
  /* width: 100%; */
  min-height: 100vh;
}

.parallax5 {
  background-image: url("./assets/img\ contact.jpg");
  background-color: #ee9e96;
  padding-top: 10vh;
  padding-bottom: 20vh;
  /* width: 100%; */
  min-height: 100vh;
}

.parallax1,
.parallax2,
.parallax3,
.parallax4,
.parallax5 {
  /* Set a specific height */
  /* min-height: 800px; */

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.separator1 {
  height: 50px;
  background-color: #918d8a;
  /* background-color: #8aca84; */
  /* font-size: 120%; */
  text-align: center;
}
.separator2 {
  height: 50px;
  /* background-color:#336a9b51; */
  background-color: #acc991;
  /* font-size: 120%; */
  text-align: center;
}
.separator3 {
  height: 50px;
  /* background-color:#336a9b51; */
  background-color: #f7d768;
  /* font-size: 120%; */
  text-align: center;
}

.separator4 {
  height: 50px;
  /* background-color:#336a9b51; */
  background-color: #acc991;
  /* font-size: 120%; */
  text-align: center;
}

.separator5 {
  height: 50px;
  /* background-color:#336a9b51; */
  background-color: rgb(38, 14, 68);
  /* font-size: 120%; */
  text-align: center;
}

/* HEADER */

header {
  position: sticky;
  top: 0;
  padding: 0.7% 7%;
  width: 100%;
  /* height: 100%; */
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #336a9b;
  z-index: 3;
}

.logo {
  /* height: 70px; */
  height: 10vh;
  display: flex;
  align-items: center;
  border-radius: 8px;
  color: #ebf5ac;
  box-shadow: 4px 0px 28px -10px;
}

.text-logo {
  border-color: #4b8bec;
  border-bottom-style: double;
  border-top-style: double;
  color: #ebf5ac;
}

#img-logo {
  border-radius: 8px;
}

.menu a {
  text-decoration: none;
  color: #dbe9f4;
  display: inline-block;
  padding: 0 20px;
}

.menu a:hover {
  color: #ebf5ac;
  /* padding: 6px; */
  /* border-radius: 4px; */
  transition: background-color 05s ease;
  box-shadow: 4px 0px 28px -10px;
}

.nav-toggle {
  display: none;
}

/* ACASA / SECTION 1 */

.img-acasa {
  display: none;
}

.section1 {
  position: static;
  height: 100%;
  padding: 10% 7%;
}

.title_1 {
  padding-right: 55%;
  margin-top: -3%;
  /* font-size: 1.2em; */
  font-size: 2.5vh;
}

.title_1_2 {
  text-align: justify;
  line-height: 1.5em;
  padding: 1.2% 55% 0 0;
  /* font-size: 1.25em; */
  font-size: 2.2vh;
}

#text-acasa,
#first_paragraph {
  text-align: justify;
  line-height: 1.5em;
  letter-spacing: 0.8px;
  padding: 1.2% 55% 0 0;
  font-size: 1.9vh;
}

.title_1 h1, .section1 h3, .section1 p, .title_5 h1, .title_5 h3 {
  background-color: #336a9b4d;
}


#button_1,
#button_1_1 {
  width: 15vw;
  padding: 1%;
  border-radius: 8px;
  border-color: #336a9ba4;
  background-color: #336a9ba4;
  color: #ebf5ac;
  font-size: 18px;
  margin-top: 30px;
}

/* #button_1 a,
#button_1_1 a {
  text-decoration: none;
  color: #ebf5ac;
} */

#button_1:hover,
#button_1_1:hover {
  background-color: #20496c;
  transition: background-color 0.3s ease;
}



/* TARIFE */

.title_2 {
  position: relative;
  width: 100%;
  padding: 4% 30% 2%;
  font-size: 2.5vh;
  text-align: center;
}
.title_2 h1,
h3 {
  background-color: #336a9b4d;
}

.brasov {
  position: static;
  width: 55%;
  background-color: #336a9ba4;
  margin: 3% 35% 0 10%;
}

.brasov-berlin:hover,
.brasov-berna:hover,
.brasov-bruxelles:hover,
.brasov-budapesta:hover,
.brasov-madrid:hover,
.brasov-paris:hover,
.brasov-roma:hover,
.brasov-viena:hover,
.bucuresti-berlin:hover,
.bucuresti-berna:hover,
.bucuresti-bruxelles:hover,
.bucuresti-budapesta:hover,
.bucuresti-madrid:hover,
.bucuresti-paris:hover,
.bucuresti-roma:hover,
.bucuresti-viena:hover,
.craiova-berlin:hover,
.craiova-berna:hover,
.craiova-bruxelles:hover,
.craiova-budapesta:hover,
.craiova-madrid:hover,
.craiova-paris:hover,
.craiova-roma:hover,
.craiova-viena:hover,
.sibiu-berlin:hover,
.sibiu-berna:hover,
.sibiu-bruxelles:hover,
.sibiu-budapesta:hover,
.sibiu-madrid:hover,
.sibiu-paris:hover,
.sibiu-roma:hover,
.sibiu-viena:hover,
.valcea-berlin:hover,
.valcea-berna:hover,
.valcea-bruxelles:hover,
.valcea-budapesta:hover,
.valcea-madrid:hover,
.valcea-paris:hover,
.valcea-roma:hover,
.valcea-viena:hover {
  background-color: #336a9b;
  transition: background-color 0.3s ease;
}

.brasov-berlin a,
.brasov-berna a,
.brasov-bruxelles a,
.brasov-budapesta a,
.brasov-madrid a,
.brasov-paris a,
.brasov-roma a,
.brasov-viena a,
.bucuresti-berlin a,
.bucuresti-berna a,
.bucuresti-bruxelles a,
.bucuresti-budapesta a,
.bucuresti-madrid a,
.bucuresti-paris a,
.bucuresti-roma a,
.bucuresti-viena a,
.craiova-berlin a,
.craiova-berna a,
.craiova-bruxelles a,
.craiova-budapesta a,
.craiova-madrid a,
.craiova-paris a,
.craiova-roma a,
.craiova-viena a,
.sibiu-berlin a,
.sibiu-berna a,
.sibiu-bruxelles a,
.sibiu-budapesta a,
.sibiu-madrid a,
.sibiu-paris a,
.sibiu-roma a,
.sibiu-viena a,
.valcea-berlin a,
.valcea-berna a,
.valcea-bruxelles a,
.valcea-budapesta a,
.valcea-madrid a,
.valcea-paris a,
.valcea-roma a,
.valcea-viena a {
  text-decoration: none;
}


.bucuresti {
  position: static;
  margin: 5% 10% 0 35%;
  width: 55%;
  background-color: #336a9ba4;
  display: flex;
  justify-content: flex-end;
  z-index: -1;
}



.craiova {
  position: static;
  width: 55%;
  margin: 5% 35% 0 10%;
  background-color: #336a9ba4;
  z-index: -1;
}

.sibiu {
  position: static;
  margin: 5% 10% 0 35%;
  width: 55%;
  background-color: #336a9ba4;
  display: flex;
  justify-content: flex-end;
  z-index: -1;
}

.valcea {
  position: static;
  width: 55%;
  margin: 5% 35% 0 10%;
  background-color: #336a9ba4;
  z-index: -1;
}

table {
  width: 100%;
  border-style: groove;
}

/* .button_3 {
  position: fixed;
  width: 200px;
  height: 50px;
  left: 15%;
  top: 240px;
  border-radius: 8px;
  border-color: #336a9ba4;
  background-color: #336a9ba4;
  color: #EBF5AC;
  font-size: 18px;
  z-index: -1;
}


.button_3 a {
  color:#EBF5AC;
  text-decoration: none;
}

.button_3:hover {
  background-color: #20496c;
  transition: background-color 0.3s ease;
}


.button_4 {
  position: fixed;
  width: 200px;
  height: 50px; 
  left: 70%;
  top: 240px;
  border-radius: 8px;
  border-color: #336a9ba4;
  background-color: #336a9ba4;
  font-size: 18px;
  z-index: -1;
} 

.button_4 a {
  color:#EBF5AC;
  text-decoration: none;
}

.button_4:hover {
  background-color:  #20496c;
  transition: background-color 0.3s ease;
} */

/* REZERVARI / SECTION 2 */

.title_3 {
  width: 100%;
  padding: 4% 25% 2%;
  /* font-size: 1.2em; */
  font-size: 2.5vh;
  text-align: center;
}
.title_3 h1 {
  background-color: #336a9b4d;
}

.backgroundRezervari {
  position: fixed;
  top: -10%;
  height: 100%;
  width: 100%;
  z-index: -1;
}

.section2_1 {
  position: static;
  flex-direction: column;
  text-align: center;
  padding: 0% 30.5% 2% 30.5%;
}

.section2_1 h1 {
  background-color: #336a9b4d;
}
/* .section2_1 h1 {
  background-color: #336a9b;
} */
/* .section2_2 p {
  background-color: #336a9b4d;
} */

.section2_2 {
  /* background-color: chocolate; */
  position: static;
  /* padding-top: 30px;
  padding-left: 600px; */
  text-align: justify;
  /* padding: 45px 85px 127px 700px; */
  padding: 4% 7% 16% 55%;
  line-height: 1.5em;
  margin-top: -29%;
}

#section2_3 {
  /* float: left; */
  /* width: 537px; */
  /* background-color: cadetblue; */
  position: static;
  /* padding: 30px 600px 40px 85px; */
  padding: 2.5% 55% 4% 7%;
}

#section2_3 label {
  background-color: #336a9b4d;
}

.input_info {
  width: 60%;
  /* height: 31px; */
  height: 35%;
  background-color: #336a9ba4;
  color: #ebf5ac;
  font-size: 18px;
  border-radius: 8px;
  margin-bottom: 10px;
}

.orasul_ro select {
  width: 537px;
  height: 41px;
  background-color: #336a9ba4;
  color: #ebf5ac;
  font-size: 18px;
  border-radius: 8px;
  margin-bottom: 10px;
}

.orasul_ue select {
  width: 537px;
  height: 41px;
  background-color: #336a9ba4;
  color: #ebf5ac;
  font-size: 18px;
  border-radius: 8px;
  margin-bottom: 10px;
}

.plecare {
  position: relative;
  float: left;
  margin: 4% 0;
}

.intoarcere {
  position: relative;
  float: left;
  margin: 4% 6%;
}

.select_dus {
  width: 10vw;
  color: #336a9b;
}

.select_intors {
  width: 10vw;
  color: #336a9b;
}

#button_2, #button_2_1 {
  width: 15vw;
  padding: 1%;
  border-radius: 8px;
  border-color: #336a9ba4;
  background-color: #336a9ba4;
  color: #ebf5ac;
  font-size: 18px;
  /* box-shadow: 4px 4px 18px 1px; */
}

#button_2_1 {
  margin: 2% 10%;
}

#button_2:hover, #button_2_1:hover {
  background-color: #20496c;
  transition: background-color 0.3s ease;
}

#section_multumim {
  position: relative;
  left: 10%;
  width: 80%;
  height: 50vh;
  background-color: #81b86bc3;
  text-align: center;
  padding: 15% 0;
  z-index: 1;
}

/* RECENZII */

/* .backgroundRecenzii {
  position: fixed;
  top: 15%;
  height: 100%;
  width: 100%;
  z-index: -1;
} */

.title_4 {
  width: 100%;
  padding: 4% 30% 4%;
  /* font-size: 1.2em; */
  font-size: 2.5vh;
  text-align: center;
}
.title_4 h1 {
  background-color: #336a9b4d;
}

.section1_1_Recenzii {
  position: relative;
  left: 25%;
  width: 49%;
  font-size: 1.22em;
  color: aliceblue;
  z-index: -1;
}

.section1_2_Recenzii {
  position: relative;
  width: 27%;
  left: 7%;
  float: left;
}

.section1_2_Recenzii img {
  color: #8d8d8d;
  border-radius: 8px;
  box-shadow: 1px 4px 20px 0px;
  border-color: #ebf5ac;
  border-style: ridge;
}

.section1_1_Recenzii h1 {
  background-color: #336a9b4d;
}

.section1_2_Recenzii h2 {
  background-color: #336a9b4d;
}


/* SLIDERS RECENZII */
/* * {box-sizing:border-box} */

/* Slideshow container */
.slideshow-container {
  max-width: 40%;
  position: relative;
  left: 25%;
  margin-top: -5%;
  float: left;
}

/* Hide the images by default */
.mySlides {
  display: none;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active,
.dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}

/* CONTACT */

.title_5 {
  position: relative;
  width: 100%;
  text-align: center;
  padding: 4% 17% 2% 63%;
  font-size: 2.5vh;
}

.subtitle_5 {
  position: absolute;
  width: 100%;
  text-align: start;
  padding: 4% 75% 2% 3%;
}

#contact label {
  position: relative;
  left: 140vh;
  background-color: #336a9b4d;
}

#nameinput,
#emailinput,
#commentinput {
  position: relative;
  left: 62vw;
  width: 70vh;
  height: 35%;
  background-color: #336a9ba4;
  color: #ebf5ac;
  font-size: 18px;
  border-radius: 8px;
  margin-bottom: 10px;
}

#button_input {
  position: relative;
  width: 200px;
  height: 50px;
  margin-left: 140vh;
  border-radius: 8px;
  border-color: #336a9ba4;
  background-color: #336a9ba4;
  color: #ebf5ac;
  font-size: 18px;
  /* box-shadow: 4px 4px 18px 1px; */
}

#button_input:hover {
  background-color: #20496c;
  transition: background-color 0.3s ease;
}






/* FOOTER */

.footer {
  position: static;
  /* height: 150px; */
  height: 100%;
  background-color: rgb(38, 14, 68);
  color: white;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.logo-footer {
  /* width: 120px;
  height: 40px; */
  width: 10%;
  height: 100%;
  position: relative;
  left: 7%;
  display: flex;
  align-items: center;
  border-radius: 8px;
  color: #ebf5ac;
  box-shadow: 4px 4px 18px 1px;
}

.text-logo-footer {
  border-color: #a0a2de;
  border-bottom-style: double;
  border-top-style: double;
  color: #ebf5ac;
}

.menu-footer li {
  width: 100%;
  position: relative;
  list-style: none;
  display: flex;
  /* flex-direction: column; */
  align-items: center;
  line-height: 0.9%;
  padding-top: 8px;
}

.menu-footer li a {
  text-decoration: none;
  color: white;
  font-size: 70%;
}

.social {
  /* width: 30px; */
  width: 2%;
  position: relative;
  right: 7%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
}

.social a {
  text-decoration: none;
  margin-top: 5px;
}

.social_text {
  color: white;
  font-size: 10px;
}

.reserved {
  background-color: rgba(38, 14, 68);
  padding: 0 7%;
  font-size: 9px;
  letter-spacing: 1.5px;
  color: white;
}





@media(max-width: 576px) {
  
  .parallax1,
.parallax2,
.parallax3,
.parallax4,
.parallax5 {
  background-image: none;
  background-color: #a0a2de;
  width: 100vw;
}


header {
  position: sticky;
  top: 0;
  padding: 0.7% 7%;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #336a9b;
  z-index: 3;
}


/* ACASA / SECTION 1 */

.img-acasa {
  display: block;
}

.section1 {
  position: static;
  height: 100%;
  padding: 10% 7%;
}

.title_1 {
  padding-right: 55%;
  margin-top: -3%;
  font-size: 2.5vh;
}

.title_1_2 {
  text-align: justify;
  line-height: 1.5em;
  padding: 1.2% 55% 0 0;
  font-size: 2.2vh;
}

#text-acasa,
#first_paragraph {
  text-align: justify;
  line-height: 1.5em;
  letter-spacing: 0.8px;
  padding: 1.2% 55% 0 0;
  font-size: 1.9vh;
}

.title_1 h1, .section1 h3, .section1 p, .title_5 h1, .title_5 h3 {
  background-color: #336a9b4d;
}


#button_1,
#button_1_1 {
  width: 15vw;
  padding: 1%;
  border-radius: 8px;
  border-color: #336a9ba4;
  background-color: #336a9ba4;
  color: #ebf5ac;
  font-size: 18px;
  margin-top: 30px;
}



#button_1:hover,
#button_1_1:hover {
  background-color: #20496c;
  transition: background-color 0.3s ease;
}

}