:root {
  --primary-clr: #479eb8;
}

body,
html {
  background: url(img/wall3.jpg) fixed;
}

html {
  scroll-behavior: smooth;
}

.servicii,
.contact,
.prezentare {
  background-color: #f8f9fa;
  padding-top: 10px;
  margin-top: 50px;
  border-radius: 20px;

  padding-left: 2em;
  padding-right: 2em;
  padding-bottom: 1em;

  overflow: hidden;
}

/* scale on hover */
.hover-zoom {
  transition: transform 200ms ease-in-out;
}
.hover-zoom:hover,
.hover-zoom:focus,
.hover-zoom:active {
  transform: scale(1.1);
}

/* underline links effect */
.underline {
  position: relative;
  display: inline-block;
}
.underline:hover,
.underline:focus,
.underline:active {
  text-decoration: none;
}
.underline::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: currentColor;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: right;
  transform-origin: right;
  transition: -webkit-transform 250ms ease-in;
  transition: transform 250ms ease-in;
  transition: transform 250ms ease-in, -webkit-transform 250ms ease-in;
}

.underline:hover::after {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transform-origin: left;
  transform-origin: left;
}

/* Navbar *********************************/

.navbar {
  padding: 0.8rem;
  background-color: rgba(248, 249, 250, 0.7) !important;
  /* height: 100px; */
}

.navbar-nav li {
  padding-right: 20px;
}
.navbar-nav li a {
  color: black !important;
}

.nav-link {
  font-size: 1.1em;
}

.nav-link:hover {
  color: var(--primary-clr) !important;
}

.invisible {
  padding-top: 50px;
  margin-top: -50px;
}

/* remove border from language icon in mobile menu*/
nav ul li:last-child {
  border-bottom: none;
}

a .lang-icon {
  max-width: 30px;
  max-height: auto;
  transition: all 1s;
}

/* back to top ****************************/
.back-to-top {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  border: none;
  outline: none;
  color: white;
  cursor: pointer;
  /* border-radius:50%; */
}

.back-to-top a {
  color: white;
  background-color: var(--primary-clr);
  padding: 0px 10px;
  font-size: 30px;
  border-radius: 10px;
}

/* Cookie banner ******************/
.cookie-container {
  position: fixed;
  bottom: -100%;
  left: 0;
  right: 0;
  background-color: rgba(44, 43, 53, 0.9);
  color: #f5f6fa;
  padding: 10px 32px;
  box-shadow: 0 -2px 16px rgba(47, 54, 64, 0.39);
  text-align: center;
  transition: 400ms;

  z-index: 100;
}

.cookie-container.active {
  bottom: 0;
}

.cookie-container a {
  color: var(--primary-clr);
}

.cookie-btn {
  background-color: var(--primary-clr);
  border: 1px solid var(--primary-clr);
  /* border: 0; */
  color: #f5f6fa;
  padding: 12px 48px;
  font-size: 18px;
  /* margin-bottom: 16px; */
  border-radius: 8px;
  cursor: pointer;
}

/* Carousel ************************/

.hero {
  padding: 0;
  max-height: 100%;
  /* background: rgba(26, 28, 32, 0.5); */
}

.carousel {
  /* padding-bottom: 15px; */
  padding-left: 0;
  padding-right: 0;
}

.carousel-control-prev,
.carousel-control-next {
  font-size: 70px;
  color: var(--primary-clr);
}

.carousel-control-prev:hover,
.carousel-control-next:hover {
  color: var(--primary-clr);
}

.carousel-caption {
  background-color: rgba(44, 43, 53, 0.6);
  border-radius: 20px;
  text-shadow: 1px 1px 15px #000;
}

.btn-car {
  background-color: var(--primary-clr);
  border: 1px solid var(--primary-clr);
}

.btn-car:hover {
  background-color: #215261;
  border: 1px solid #215261;
}

/* Prezentare ***************************/

.prezentare p {
  margin-bottom: 10px;
}

.indent p {
  text-indent: 40px;
}

.fancy-title {
  color: var(--primary-clr);
}

/* Servicii *****************************/

.servicii p {
  padding-bottom: 1em;
}
.servicii ul {
  margin-bottom: 40px;
}

.servicii button {
  color: var(--primary-clr);
  font-size: 1.2rem;
  text-align: left;
}

.servicii .sub-ul {
  margin-bottom: 0;
}

/* .servicii .card-header {
  position: relative;
}

.servicii .card-header i {
  font-size: 25px;
  color: var(--primary-clr);
  position: absolute;
  right: 10px;
  top: 20px;
} */

.servicii .card-btn-icon {
  display: flex;
  justify-content: space-between;
}

/* Contact ********************************/

.map {
  overflow: hidden;
  padding-bottom: 56.25%;
  position: relative;
  height: 0;
}
.map iframe {
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  position: absolute;
}

.contact {
  margin-bottom: 3.5em;
}

.contact h6 {
  margin-bottom: 15px;
}

.fa-map-marker-alt {
  color: #e64636;
}

.contact .fa-phone-alt {
  color: #0056b3;
}

.contact .fa-linkedin {
  color: #0077b5;
}

/* Disable spinner */

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"] {
  -moz-appearance: textfield;
}

/* Footer ***************************************/

footer {
  background-color: rgba(44, 43, 53, 0.8);
  color: #fff;
  overflow: hidden;
}

.footer-legal {
  font-size: smaller;
  display: flex;
  justify-content: space-around;
  max-width: 380px;
  margin: 10px auto;
}

footer a {
  color: #fff;
  display: block;
  transition: all 0.3s;
}

footer a:hover {
  color: rgb(143, 142, 142);
  text-decoration: none;
  transform: scale(1.1);
}

.light {
  background-color: gray;
}
/* Media query **********************************/

@media screen and (max-width: 767px) {
  .navbar-brand {
    width: 75%;
  }

  .navbar-nav li {
    font-weight: 700;
    margin-top: 30px;
    margin-bottom: 30px;
    border-bottom: 2px solid var(--primary-clr);
  }

  .invisible {
    display: block;
    position: relative;
    top: 0;
    visibility: hidden;
  }

  .carousel-control-prev,
  .carousel-control-next {
    font-size: 2em;
  }

  .carousel {
    padding-bottom: 20px;
  }

  .carousel-indicators li {
    margin-bottom: -100px !important;
  }
  .carousel-caption {
    font-size: 90%;
    max-height: 50%;
  }

  .servicii,
  .contact {
    padding-left: 1em;
    padding-right: 1em;
  }

  .servicii {
    margin-top: 10px;
  }

  h2 {
    font-size: 1.5em;
  }

  h3 {
    font-size: 1.2em;
  }

  h5 {
    font-size: 1em;
  }
}

/* after menu expands*/
@media screen and (min-width: 768px) {
  /* resize on scroll *******/
  .navbar {
    height: 100px;
    transition: all 1s;
  }
  .scrolling-active {
    height: 75px;
    background-color: rgba(248, 249, 250, 0.9) !important;
  }
  .navbar-brand {
    transition: all 1s;
  }
  .scrolling-active .navbar-brand {
    transform: scale(0.9);
  }

  .nav-link {
    font-size: 1.1rem;
    font-weight: 500;
    transition: all 2s;
  }
  .scrolling-active .nav-link {
    font-size: 1rem;
  }
  .scrolling-active a .lang-icon {
    max-width: 23px;
  }

  /* scroll spy *********/
  li.nav-item a.active {
    color: var(--primary-clr) !important;
  }

  /* nav link hover effect*/
  nav ul li a {
    position: relative;
  }

  nav ul li a::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: var(--primary-clr);
    left: 0;
    bottom: 0;
    transform-origin: left;
    transform: scaleX(0);
    transition: all 0.5s;
  }

  nav ul li a:hover::after {
    transform: scaleX(1);
  }

  /* disable underline for language icon */
  nav ul li:last-child a:hover::after {
    transform: scale(0);
  }

  /* nav padding */
  .navbar-nav li {
    padding-right: 0;
  }
  .brand {
    padding-left: 0;
  }

  .hero {
    background: rgba(26, 28, 32, 0.5);
  }

  /* servicii */
  h2 {
    font-size: 1.5em;
    letter-spacing: 5px;
  }

  h3 {
    font-size: 1.2em;
  }

  h5 {
    font-size: 1em;
  }
}

@media screen and (min-width: 1150px) {
  .nav-link {
    font-weight: 700;
  }

  /* nav padding */
  .navbar-nav li {
    padding-right: 50px;
  }
  .brand {
    padding-left: 20px;
  }
}

@media screen and (min-width: 1550px) {
  /* nav padding */
  .brand {
    padding-left: 10em;
  }

  .navbar-nav li {
    padding-right: 70px;
  }

  /* resize on scroll */
  .nav-link {
    font-size: 1.3rem;
    transition: all 2s;
  }
  .scrolling-active .nav-link {
    font-size: 1.2rem;
  }

  /* .contact {
    max-width: 75% !important;
  } */
}

/*---Firefox Bug Fix --*/
.carousel-item {
  transition: -webkit-transform 0.5s ease;
  transition: transform 0.5s ease;
  transition: transform 0.5s ease, -webkit-transform 0.5s ease;
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
}

/* Animations *********************************/

/* element scroll from the right */
@keyframes scroll-from-right {
  0% {
    transform: translatex(10rem);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* element scroll from the left */
@keyframes scroll-from-left {
  0% {
    transform: translatex(-10rem);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* back to top */
@keyframes up {
  0% {
    /* opacity: 0; */
    transform: translateY(0px);
  }

  50% {
    /* opacity: 1; */
  }

  100% {
    /* opacity: 0; */
    transform: translateY(-10px);
  }
}

/* turn animation */
@keyframes turn {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(180deg);
  }
}
/* turn back animation */
@keyframes turn-back {
  from {
    transform: rotate(180deg);
  }
  to {
    transform: rotate(0deg);
  }
}

.rotate {
  animation: turn 0.5s forwards;
}
.rotate-back {
  animation: turn-back 0.5s forwards;
}

.back-to-top {
  opacity: 1;
  animation: scroll-from-right 0.5s forwards;
}

@media screen and (max-width: 767px) {
  /* animate open nav menu */
  nav ul li:nth-child(1) {
    opacity: 0;
    animation: scroll-from-left 0.5s forwards;
    animation-delay: 0.3s;
  }
  nav ul li:nth-child(2) {
    opacity: 0;
    animation: scroll-from-left 0.5s forwards;
    animation-delay: 0.5s;
  }
  nav ul li:nth-child(3) {
    opacity: 0;
    animation: scroll-from-left 0.5s forwards;
    animation-delay: 0.7s;
  }
  nav ul li:nth-child(4) {
    opacity: 0;
    animation: scroll-from-left 0.5s forwards;
    animation-delay: 0.9s;
  }
  nav ul li:nth-child(5) {
    opacity: 0;
    animation: scroll-from-left 0.5s forwards;
    animation-delay: 1.1s;
  }
}

@media screen and (min-width: 767px) {
  /* back to top hover */
  .back-to-top i:hover {
    animation: up 2s infinite alternate;
  }
}

/* desktop animate navbar*/
/* @media screen and (min-width: 768px) {
  nav ul li:nth-child(1) {
    opacity: 0;
    animation: scroll-from-right 0.5s forwards;
    animation-delay: 0.3s;
  }
  nav ul li:nth-child(2) {
    opacity: 0;
    animation: scroll-from-right 0.5s forwards;
    animation-delay: 0.6s;
  }
  nav ul li:nth-child(3) {
    opacity: 0;
    animation: scroll-from-right 0.5s forwards;
    animation-delay: 0.9s;
  }
  nav ul li:nth-child(4) {
    opacity: 0;
    animation: scroll-from-right 0.5s forwards;
    animation-delay: 1.2s;
  }
  nav ul li:nth-child(5) {
    opacity: 0;
    animation: scroll-from-right 0.5s forwards;
    animation-delay: 1.5s;
  }
  nav ul li:nth-child(6) {
    opacity: 0;
    animation: scroll-from-right 0.5s forwards;
    animation-delay: 1.8s;
  }
  .navbar-brand {
    opacity: 0;
    animation: scroll-from-left 0.5s forwards;
    animation-delay: 0.3s;
  }
} */