/*Block Headline*/
.headline {
	display: block;
	margin: 10px 0 25px 0;
	border-bottom: 1px dotted #e4e9f0;
}


.headline h2, .headline h3, .headline h4, h2 .headline {
    border-bottom: 2px solid var(--primary-color);
}

.headline h2, .headline h3, .headline h4 {
    margin: 0 0 -2px 0;
    padding-bottom: 5px;
    display: inline-block;
    border-bottom: 2px solid var(--primary-color);
}
.headline h2 {
    font-size: 1.5em;
}

/*SideBar - Contact Pages
------------------------------------*/

.contact-info ul {
    padding: 0;
    margin: 0;
}

.contact-info li {
    list-style: none;
    color: #888;
    border-bottom: 1px dashed rgba(255, 255, 255, .1);
    padding: 5px 0;
	width: 100%
}
.contact-info .address-addon {
    float: left;
    width: 27px;
    line-height: 24px;
}
.contact-info p {
    margin: 0;
    line-height: 24px;
    padding-left: 27px;
}

.business-info ul {
    padding: 0;
    margin: 0;
}

.business-info li {
    list-style: none;
    color: #888;
   border-bottom: 1px dashed rgba(255, 255, 255, .1);
	width: 100%;
	 padding: 5px 0;
}


/*Material Form
------------------------------------*/
.input-group {
    border: 1px solid #ccc;
    border-radius: 2px;
    padding: 10px 0;
    width: 100%;
	margin-top: 20px;
	list-style: none;
}
.input-group-addon {
    background: 0 0;
    border: 0;
   border-bottom: 1px dashed rgba(255, 255, 255, .1);
    padding: 0;
    text-align: center;
    width: 45px;
    color: #888;
    font-size: 15px;
}
.input-group .form-control {
    border: 0;
	background: 0 0;
    box-shadow: none;
    padding: 0 0 0 15px;
    height: 21px;
    line-height: 21px;
    font-size: 14px;	
	min-height: 21px;
	margin-top: 0;
}

.input-group input{
	height: 40px;
}

.input-group textarea{
	height: 100px !important;
}

.successBox{margin-bottom:.75rem;padding:1em;color:#468847;border:1px solid #d6e9c6;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;background-color:#dff0d8;text-shadow:0 1px 0 rgba(255,255,255,.5)}.errorBox{margin-bottom:.75rem;padding:1em;color:#dc3545;border:1px solid rgba(185,74,72,.3);-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;background-color:#f2dede;text-shadow:0 1px 0 rgba(255,255,255,.5)}
.message-inner-separator,.message-inner-separator-success{border: 1px solid #c3e6cb;}.message-inner-separator-danger{border: 1px solid #f5c6cb;}



.g-py-50 {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
}


.g-mb-20 {
    margin-bottom: 1.42857rem !important;
}



.g-mb-5 {
    margin-bottom: 0.35714rem !important;
}

.g-bg-gray-light-v5 {
    /*
    background: -webkit-linear-gradient(top, #f0f0f0 0%, #d9d9d9 68%, #bfbfbf 99%, #bfbfbf 100%);
    background: -o-linear-gradient(top, #f0f0f0 0%, #d9d9d9 68%, #bfbfbf 99%, #bfbfbf 100%);
    background: -ms-linear-gradient(top, #f0f0f0 0%, #d9d9d9 68%, #bfbfbf 99%, #bfbfbf 100%);
    background: -moz-linear-gradient(top, #f0f0f0 0%, #d9d9d9 68%, #bfbfbf 99%, #bfbfbf 100%);
    background: linear-gradient(to bottom, #f0f0f0 0%, #d9d9d9 68%, #bfbfbf 99%, #bfbfbf 100%);
    background-position: top center;
*/
    background: linear-gradient(253deg, #e3fffe 23.91%, #e6edfd 78.01%);
}

.hero {
    background-color: #f7f7f7 ;
    color: #000;
    position: relative;
    overflow: hidden;
  }

.hero .shape {
    position: absolute;
    pointer-events: none;
    z-index: 1;
  }
  
  .hero .shape svg {
    width: 100%;
    height: 100%;
  }
  
  .hero .shape svg path {
    fill: color-mix(in srgb, #666 50%, transparent);
  }
  
  .hero .shape-1 {
    width: 300px;
    height: 300px;
    top: -100px;
    right: 100px;
    opacity: 0.1;
    transform: rotate(45deg);
    animation: shapes-float 3s ease-in-out infinite;
  }
  
  .hero .shape-2 {
    width: 200px;
    height: 200px;
    bottom: -50px;
    left: 100px;
    opacity: 0.15;
    transform: rotate(-15deg);
    animation: shapes-float 4s ease-in-out infinite;
  }
  
  .hero .shape-3 {
    width: 150px;
    height: 150px;
    top: 20%;
    right: 25%;
    opacity: 0.08;
    transform: rotate(15deg);
    animation: shapes-float 4s ease-in-out infinite;
  }

.hero .shape-4 {
    width: 200px;
    height: 200px;
    top: 10%;
    left: 500px;
    opacity: 0.1;
    transform: rotate(-10deg);
    animation: shapes-float 4s ease-in-out infinite;
}
  
  .hero .dots {
    position: absolute;
    pointer-events: none;
    z-index: 1;
    color: #666;
  }
  
  .hero .dots svg {
    width: 100%;
    height: 100%;
  }
  
  .hero .dots-1 {
    width: 200px;
    height: 200px;
    top: 30px;
    left: 10%;
    opacity: 0.1;
    transform: rotate(15deg);
    animation: shapes-float 4s ease-in-out infinite;
  }
  
  .hero .dots-2 {
    width: 150px;
    height: 150px;
    bottom: 120px;
    right: 15%;
    opacity: 0.15;
    transform: rotate(-10deg);
    animation: shapes-float 4s ease-in-out infinite;
  }
  
  .hero .dots-3 {
    width: 200px;
    height: 200px;
    bottom: 30px;
    left: 30%;
    opacity: 0.1;
    transform: rotate(15deg);
    animation: shapes-float 4s ease-in-out infinite;
  }
  

  @keyframes shapes-float {
  
    0%,
    100% {
      transform: scale(0.8) rotate(45deg) translateY(0);
    }
  
    50% {
      transform: scale(0.8) rotate(45deg) translateY(-30px);
    }
  }
  
  @media (max-width: 992px) {
    .hero .container {
      padding: 3rem 1.5rem;
    }
  
    .hero .shape-1 {
      width: 200px;
      height: 200px;
    }
  
    .hero .shape-2 {
      width: 150px;
      height: 150px;
    }
  
    .hero .shape-3 {
      width: 100px;
      height: 100px;
    }

    .hero .shape-4 {
        width: 200px;
        height: 200px;
      }
    
  
    .hero .dots-1 {
      width: 150px;
      height: 150px;
    }
  
    .hero .dots-2 {
      width: 120px;
      height: 120px;
    }
  
    .hero .dots-3 {
      width: 80px;
      height: 80px;
    }
}