/* Features */
.features {
    position: relative;
    z-index: 2;
}
.features .features-box {
    color: var(--light);
    padding: 20px;
    border-radius: 10px;
    transition: all 0.3s ease-out 0s;
    border-radius: 1em;
    border: 4px solid transparent;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.features .features-box:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background: url('../images/features.svg') no-repeat;
    z-index: -1;
}

.ssd-drive {
    fill: var(--blue);
}
.firewall {
    fill: var(--red);
}
.setup {
    fill: var(--green);
}
.guranteed {
    fill: var(--yellow);
}
.cpu {
    fill: var(--purple);
}
.support {
    fill: var(--orange);
}

.box-blue {
    background: linear-gradient(var(--dark), var(--dark)) padding-box,
    linear-gradient(to right, var(--blue), var(--light-dark)) border-box !important;
}

.box-red {
    background: linear-gradient(var(--dark), var(--dark)) padding-box,
    linear-gradient(to right, var(--red), var(--light-dark)) border-box !important;
}

.box-green {
    background: linear-gradient(var(--dark), var(--dark)) padding-box,
    linear-gradient(to right, var(--green), var(--light-dark)) border-box !important;
}

.box-yellow {
    background: linear-gradient(var(--dark), var(--dark)) padding-box,
    linear-gradient(to right, var(--yellow), var(--light-dark)) border-box !important;
}

.box-purple {
    background: linear-gradient(var(--dark), var(--dark)) padding-box,
    linear-gradient(to right, var(--purple), var(--light-dark)) border-box !important;
}

.box-orange {
    background: linear-gradient(var(--dark), var(--dark)) padding-box,
    linear-gradient(to right, var(--orange), var(--light-dark)) border-box !important;
}

.features .features-box:hover {
    -webkit-box-shadow: 0px 0px 20px 0px rgba(28, 31, 55, 0.5);
    -moz-box-shadow: 0px 0px 20px 0px rgba(28, 31, 55, 0.5);
    box-shadow: 0px 0px 20px 0px rgba(28, 31, 55, 0.5);
}
.features .features-box h2 {
    color: var(--white);
    font-weight: 600;
    font-size: 26px;
}
.features .features-box p {
    font-size: 15px;
}

