#content {
  padding-top: 78px;
}
@media (max-width: 768px) {

  #content {
    padding-top: 50px;
  }
}

#intro {
  background: url("../img/airplane-sunset-travel.jpg") no-repeat center center;
  background-size: cover;
}

#contact {
  background-image: linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)), url("../img/bgr.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  min-height: 60vh;
}

@media (max-width: 768px) {
  #contact {
  }
}

.top-nav-collapse {
  background-color: white !important;
}

.navbar:not(.top-nav-collapse) {
  background: white !important;
}

@media (max-width: 768px) {

  .navbar:not(.top-nav-collapse) {
    background: white !important;
  }
}

.navbar.navbar-dark .navbar-toggler{
  background-color: #2a4a68;
}

.navbar.navbar-dark .navbar-nav .nav-item .nav-link{
  color: #2a4a68;
}

#intro .h6 {
  font-weight: 300;
  line-height: 1.7;
}

.hm-gradient .full-bg-img {
  background: rgba(42, 27, 161, 0.7);
  background: linear-gradient(45deg, rgba(42, 27, 161, 0.7), rgba(29, 210, 177, 0.7) 100%);
}

@media (max-width: 450px) {
  .margins {
    margin-right: 1rem;
    margin-left: 1rem;
  }
}

#pricing .lead {
  opacity: 0.7;
}

#pricing .card-image {
  background: url("../img/architecture.jpg") no-repeat center center;
}

#pricing ul li {
  font-size: 1.1em;
}

.themeColor {
background-color: #2A4A68 !important;
}

input[type=date]:focus:not([readonly]), input[type=datetime-local]:focus:not([readonly]), input[type=email]:focus:not([readonly]), input[type=number]:focus:not([readonly]), input[type=password]:focus:not([readonly]), input[type=search-md]:focus:not([readonly]), input[type=search]:focus:not([readonly]), input[type=tel]:focus:not([readonly]), input[type=text]:focus:not([readonly]), input[type=time]:focus:not([readonly]), input[type=url]:focus:not([readonly]), textarea.md-textarea:focus:not([readonly]){
border-bottom: 1px solid #2a4a68;
box-shadow: 0 1px 0 0 #2a4a68;
}

input[type=date]:focus:not([readonly])+label, input[type=datetime-local]:focus:not([readonly])+label, input[type=email]:focus:not([readonly])+label, input[type=number]:focus:not([readonly])+label, input[type=password]:focus:not([readonly])+label, input[type=search-md]:focus:not([readonly])+label, input[type=search]:focus:not([readonly])+label, input[type=tel]:focus:not([readonly])+label, input[type=text]:focus:not([readonly])+label, input[type=time]:focus:not([readonly])+label, input[type=url]:focus:not([readonly])+label, textarea.md-textarea:focus:not([readonly])+label {
color: #2a4a68;
}

.immagine{
width: 100%;
    padding-top: 25px;
   /* margin-left: -77px;*/
}

.immagin2 {
max-width: 72% !important;
    padding: 0 !important;
    /*margin-left: -52px;*/

}

.cool-link {
    display: inline-block;
    color: #fff;
    text-decoration: none;
}

.cool-link::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #fff;
    transition: width .3s;
}

.cool-link:hover::after {
    width: 100%;
    /* transition: width .3s; */
}

.navbar.navbar-dark .navbar-nav .nav-item .nav-link:hover {
  color: rgba(0,0,0,.5);
}

.my-float2{
	position:fixed;
	width:50px;
	height:50px;
	bottom:50px;
	right:5px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 1px 1px 2px #999;
  z-index:100;
}

.my-float{
	margin-top:10px;
}

.my-float2:hover {
  color: #999;
}

.py-3 {
  padding-bottom: 0rem !important;
}

footer.page-footer .footer-copyright
{
   height: 30px;
   line-height: 0px;
}


/* Stepper */
.stepper-wrapper {
  display: flex;
  justify-content: space-between;
  position: relative;
}

.stepper-wrapper::before {
  position: absolute;
  content: '';
  top: 20px;
  left: 10%;
  width: 80%;
  height: 2px;
  background-color: #ccc;
  /* z-index: -1; */
}

.stepper-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  flex: 0 0 100px;
  text-align: center;
}

@media (max-width: 768px) {
  .stepper-item {
    flex: 0 0 90px;
  }
}

.step-counter {
  width: 40px;
  height: 40px;
  border: 2px solid #ccc;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  color: #666;
  background-color: #fff;
}

.stepper-item.completed .step-counter {
  border-color: #2A4A68;
  color: #fff;
  background-color: #2A4A68;
}

.stepper-item.active .step-counter {
  border-color: #2A4A68;
  font-weight: bold;
  color: #2A4A68;
}

.step-name {
  margin-top: 4px;
  font-size: 12px;
  color: #666;
}

.stepper-item:first-child::before {
  display: none;
}

.stepper-item.completed::before {
  background-color: #2A4A68;
}


/* HTML: <div class="loader"></div> */
.loader {
  width: 50px;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 8px solid #2A4A68;
  animation:
    l20-1 0.8s infinite linear alternate,
    l20-2 1.6s infinite linear;
}
@keyframes l20-1{
   0%    {clip-path: polygon(50% 50%,0       0,  50%   0%,  50%    0%, 50%    0%, 50%    0%, 50%    0% )}
   12.5% {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100%   0%, 100%   0%, 100%   0% )}
   25%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 100% 100%, 100% 100% )}
   50%   {clip-path: polygon(50% 50%,0       0,  50%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
   62.5% {clip-path: polygon(50% 50%,100%    0, 100%   0%,  100%   0%, 100% 100%, 50%  100%, 0%   100% )}
   75%   {clip-path: polygon(50% 50%,100% 100%, 100% 100%,  100% 100%, 100% 100%, 50%  100%, 0%   100% )}
   100%  {clip-path: polygon(50% 50%,50%  100%,  50% 100%,   50% 100%,  50% 100%, 50%  100%, 0%   100% )}
}
@keyframes l20-2{ 
  0%    {transform:scaleY(1)  rotate(0deg)}
  49.99%{transform:scaleY(1)  rotate(135deg)}
  50%   {transform:scaleY(-1) rotate(0deg)}
  100%  {transform:scaleY(-1) rotate(-135deg)}
}