.bg-industry {
  background: url('../../assets/images/industry.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}
.bg-about {
  background: url('../../assets/images/about.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}
.bg-contact {
  background: url('../../assets/images/contact.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}

.bg-services {
  background: url('../../assets/images/services.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}
.bg-dots {
  background: url('../../assets/images/dots.png');
  background-repeat: repeat;

}
.bg-project {
  background: url('../../assets/images/project-hero.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}
.bg-product {
  background-color: #317081;
}

.bg-career {
  background: url('../../assets/images/career.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}
.bg-services-dev {
  background: url('../../assets/images/background_1.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}
.bg-cat4heavy {
  background: url('../../assets/images/DSC_0097.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}
.header.md-light span:not(.btn) {
    color: #ffffff;
    /*  opacity: 0.7;*/
}
.header.md-light span:not(.btn) {
    color: #ffffff;
    /*  opacity: 0.7;*/
}
.header.light span:not(.btn) {
    color: #000;
  /*  opacity: 0.7;*/
}
.btn-cta {
  text-transform: capitalize !important;
  font-weight: 900;
  font-family: 'Manrope';
}

.loading {
   display: flex;
   align-items: center;
   justify-content: center;
}

 

.spinner {
  animation: rotator 1.4s linear infinite;
}

@keyframes rotator {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(270deg); }
}

.path {
  stroke-dasharray: 187;
  stroke-dashoffset: 0;
  transform-origin: center;
  animation:
    dash 1.4s ease-in-out infinite,
    colors (1.4s*4) ease-in-out infinite;
}

@keyframes colors {
	0% { stroke: #4285F4; }
	25% { stroke: #DE3E35; }
	50% { stroke: #F7C223; }
	75% { stroke: #1B9A59; }
  100% { stroke: #4285F4; }
}

@keyframes dash {
 0% { stroke-dashoffset: $offset; }
 50% {
   stroke-dashoffset: $offset/4;
   transform:rotate(135deg);
 }
 100% {
   stroke-dashoffset: $offset;
   transform:rotate(450deg);
 }
}

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) {
  .bg-industry {
    background: url('../../assets/images/industry.jpg');
    background-repeat: no-repeat;
    background-size: cover;
  }
  .bg-about {
    background: url('../../assets/images/contact@2x.jpg');
    background-repeat: no-repeat;
    background-size: cover;
  }
}

.svg-white {
fill: url(sprite.svg#my-warm-gradient) red;
}
.icon-vgradient {
  fill: url(#gradient-vertical) gray;
}
#gradient-horizontal {
  --color-stop-1: #a770ef;
  --color-stop-2: #cf8bf3;
  --color-stop-3: #fdb99b;
}
#gradient-vertical {
  --color-stop-1: #00c3ff;
  --color-stop-2: #77e190;
  --color-stop-3: #ffff1c;
}
.col-centered{
    float: none;
    margin: 0 auto;
}
.b-t-10 {
  border-top-width: 10px!important;
}
.b-r-10 {
  border-right-width: 10px!important;
}
.b-b-10 {
  border-bottom-width: 10px!important;
}
.b-l-10 {
  border-left-width: 10px!important;
}
