body{padding-top: 70px;cursor: default;}
.nav a:hover{color: #273b41;}
.socials a,.language a{color: #6A848B;text-decoration: none;}
.socials a:hover,.language a:hover{color: #273b41;}
.main{margin-top: -20px;}
.main video{height: 650px;}
.card-img-overlay{padding-top:250px;}
.card-img-overlay img{width: 40vw;}
.about{background-image: url(../img/img.jpg);background-size:cover;background-position:center right;background-attachment: fixed;background-repeat: no-repeat;}
.ab{width: 80%;}
.ab1{width: 80%;}
.crd{transition: .3s ease-in-out;background-color: #99a2aba3; }
.crd:hover{scale: 0.98;}
.services{background-color: #5c6a78;}
.serv{width: 60%;}
.img1{width: 12%; height: auto;position: absolute;margin-left: 3% ;transition: .3s ease-in-out;z-index: 1;}
.img2{width: 8%; height: auto; position: absolute; margin-top: 2%; margin-left: 14%;transition: .3s ease-in-out;z-index: 0;}
.img3{width:7%; height: auto; position: absolute; margin-top: 5%;margin-left: 10%;transition: .3s ease-in-out;z-index: 2;}
.img1:hover,.img2:hover,.img3:hover{scale: 1.02;}
.portofoliu{width: 80%;}
.item{height: 400px;}
.button {margin: 10px;padding: 10px 30px;text-align: center;transition: 0.5s;background-size: 200% auto;color: white;border-radius: 10px;text-shadow: 0px 0px 15px rgba(0, 0, 0, 0.5);}
.button:hover {background-position: right center;}
.btn-1 {background-image: linear-gradient(to right, #f6d465ef 0%, #fd9f85ef 51%, #f6d365ef 100%);}
.btn-2{font-size: 130%;}
.about,.services,.portofoliu,.feedbacks,.contacts {scroll-margin-top:55px ;}
.carousel-item{height: 200px;}
.carousel-inner{width: 80%;}
.feedbacks{background-image: linear-gradient(to bottom, #ffffff00 0%,#5c6a7843 30%,#5c6a78ad 70%, #5c6a78 );}
.contacts{ width: 60%;}
textarea{
  resize: none;
 }
input[type="text"],
input[type="tel"],
input[type="email"],textarea,select {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  background-color: #fefefec1;
  box-sizing: border-box;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 3; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow:hidden; /* Enable scroll if needed */
  background-color: rgb(0, 0, 0); /* Fallback color */
  background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  color: #efecec;
  background-color: #080b0cd9;
  width: 50%; /* Could be more or less, depending on screen size */
  margin-top: 70px;
}

/* The Close Button (x) */
.close {
  position: absolute;
  right: 25px;
  top: 0;
  color: #ffffff;
  font-size: 35px;
  font-weight: bold;
  transition: .3s ease-in-out;
}

.close:hover {
  color: rgb(146, 135, 135);
  cursor: pointer;
}

/* Add Zoom Animation */
.animate {
  -webkit-animation: animatezoom 0.6s;
  animation: animatezoom 0.6s;
}

@-webkit-keyframes animatezoom {
  from {
    -webkit-transform: scale(0);
  }
  to {
    -webkit-transform: scale(1);
  }
}

@keyframes animatezoom {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(1);
  }
}

.footer{width: 80%;}
.footer img{width: 90%}






@media screen and (max-width:1400px){
  .ab1{width: 100%;}
}
@media screen and (max-width:991px){
  .main video{height: 450px;}
  .card-img-overlay{padding-top:140px;}
  .btn-2{font-size: 110%;}
  .headline{width: 80%;}
  .footer .col-lg-4{justify-content: center;align-items: center;}
  .footer img{width: 50%}
  .img1{width: 15%; margin-left: 6% ;}
  .img2{width: 10%; margin-top: 2%; margin-left: 19%;}
  .img3{width:8%; margin-top: 5%;margin-left: 17%;}
}
@media screen and (max-width:768px){
  .img1{width: 20%; margin-left: 2% ;}
  .img2{width: 12%; margin-top: 2%; margin-left: 20%;}
  .img3{width:10%; margin-top: 8%;margin-left: 17%;}
  .item{height: 400px;}
  .about{background-attachment: scroll ; background-position: left;}
  .serv{width: 85%;}
  .ab{width: 90%;}
  .ab .col-10{width: 100% !important;}
  .carousel-inner{width: 80%;}
  .modal-content {
    width: 90%; 
  }
}
@media screen and (max-width:650px){
  .item{height: 350px;}
  .contacts{ width: 90%;}
  .footer img{width: 90%}
}
@media screen and (max-width:575px){
  .img1{width: 30%; margin-left: 15% ;}
  .img2{width: 18%; margin-top: 2%; margin-left: 42%;}
  .img3{width:14%; margin-top: 8%;margin-left: 40%;}
  .item{height: 450px;}
  .ab{width: 98%;}
}
@media screen and (max-width:480px){
  .item{height: 380px;}
  .card-img-overlay img{width: 60vw;}
  .headline{width: 90%;}
}
@media screen and (max-width:425px){
  .img1{width: 35%; margin-left: 11% ;}
  .img2{width: 22%; margin-top: 2%; margin-left: 42%;}
  .img3{width:18%; margin-top: 14%;margin-left: 35%;}
  .item{height: 350px;}
}




@media screen and (min-width:1150px) {
  .item{height: 480px;}
  
}
@media screen and (min-width:1400px) {
  .item{height: 520px;}
}
@media screen and (min-width:1500px) {
  .item{height: 580px;}
}
@media screen and (min-width:1750px) {
  .item{height: 660px;}
  .footer img{width: 50%}
}
@media screen and (min-width:2000px) {
  .img1{width: 8%; margin-left: 5% ;}
  .img2{width: 5%; margin-top: 2%; margin-left: 13%;}
  .img3{width:4%; margin-top: 5%;margin-left: 12%;}
  .main video{height: 800px;}
  .card-img-overlay{padding-top:300px;}
  .grid{display: grid;grid-template-areas: 'ab ab1';}
  .ab{grid-area: ab;width: 100%;}
  .ab .col-10{width: 90% !important;}
  .ab1{grid-area: ab1; width: 100%;}
  .ab1 .col-md-5{width: 47% !important;}
  .about{background-image: none; box-shadow: none !important;}
  .item{height: 550px;}
}
