:root{
     --file-accent: #b080f2;
    
}
.parallax:before {
    content: "";
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -10;
    background: url(../../images/chromatech/mine-aerial-2.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-2.jpg);
    background-attachment: fixed;
  
    background-size: 100% 100vh;

}

/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) { 

   
    .essa-container{
        margin-left: 0px; 
        margin-top: 60px;
    }
    
    .btn-group {
        flex-wrap: wrap;
        margin-top: 25px;
    }
    
    .btn {
         border-radius: 0px !important;
    }

}
/* Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) { 

   
    .essa-container{
        margin-left: 0px; 
        margin-top: 60px;
    }
    .btn-group {
        flex-wrap: wrap;
        margin-top: 25px;
    }
    
    .btn {
         border-radius: 0 !important;
    }
    
}
/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) { 


    .essa-container{
        margin-left: 0px; 
        margin-top: 60px;
    }
    .btn-group {
        flex-wrap: wrap;
        margin-top: 25px;
    }
    
    .btn {
         border-radius: 0px !important;
    }
    
}
/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px) { 
       
    .essa-container{
        margin-left: 175px; 
        margin-top: 0px;
    }
    .btn-group {
        flex-wrap: wrap;
        margin-top: 0px;
    }
    
   

}



/*// Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {

   
    .essa-container{
        margin-left: 175px; 
        margin-top: 0px;
    }

}

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

.active {
    color: #b080f2 !important;
}

.download-link {
    color: #b080f2;
}
.download-link i {
    margin-bottom: 25px;
    font-size: 3em;
}
.ic-text {
    display: block;
    margin-top: 10px;
    font-size: 0.4em !important;
    font-family: sans-serif;
    font-weight: 400;
    color: var(--light);
}

.download-link :hover{
   
    cursor: pointer;
}

.icon {
    color: var(--light);
}

.vertical-align {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}


hr{
    border-width: 1px;
    border-color: var(--light);
}
h1,h2,h3,h4,h5  {
    color: var(--light-blue);
}
.nav-hamburger {
    color: #b080f2;
}
.bg-accent {
    background-color: #b080f2;
}



@-webkit-keyframes color-change-2x {
  0% {
    color: #ef2525;
      
  }
    100% {
        color: #b080f2;
    }
}
@keyframes color-change-2x 
{
     0%{color: #8ac475;}
    50%{color:aqua;}
    100% {
        color: #b080f2;
    }
}


.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);
  }
}