@import url(../core.css);


.parallax:before {
    content: "";
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -10;
    background: url(../../images/chromatech/mine-aerial-3.jpg) no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.parallax {
    background-image: url(../../images/chromatech/mine-aerial-3.jpg);
    background-attachment: fixed;
  
    background-size: 100% 100vh;

}

 ul, h5, figure {
	color: var(--light);
}

 .chroma-office-pic {
     width: 100%;
     
 }

.color-change {
	-webkit-animation: color-change-2x 2s  linear alternate both;
	        animation: color-change-2x 2s  linear alternate both;
   
}


@-webkit-keyframes color-change-2x {
  0% {
    color: #ef2525;
      
  }
  100% {
    color: #b22cff;
  }
}
@keyframes color-change-2x 
{
     0%{color: #8ac475;}
    50%{color:aqua;}
    100%{color: var(--light-blue);}
}


.rotate-center {
	-webkit-animation: rotate-center 2s  ;
	        animation: rotate-center 2s  ;
}



@-webkit-keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg);
  }
}
@keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
            transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(-360deg);
            transform: rotate(-360deg);
  }
}