/* Custom styles for skills section */
.features-section{
    min-height: 160px;
}

/* Custom styles for social share circles */
.share {
    font-size: 1.4em !important;
}

.socialCircle-item {
    width: 32px !important;
    height: 32px !important;
    font-size: 20px !important;
}

.socialCircle-center {
    width: 32px !important;
    height: 32px !important;
    font-size: 20px !important;
}

.svg-featured{
    width: 70px;
    height: 70px;
    margin-bottom: 15px;
}

.font-size-1{
    font-size: 1em;
}
.testimonial-style2 h6, .testimonial-style2 .name{
    font-size: 1.3em;
}


/* Custom styles for error */
svg {
    width: 20vw;
    height: 20vh;

    margin-top: 3vh;
}

/*main-logo*/
.ha-logo path,
.ha-logo circle {
    fill: none;
    stroke: #787b80;
    stroke-width: 0.125px;
    stroke-linejoin: round;
}
.ha-logo path.house,
.ha-logo circle.house {
    stroke-linecap: round;
    stroke-width: 0.3px;
}

.loading.ha-logo circle {
    animation: nodes 6s linear infinite;
}

.loading.ha-logo .house {
    animation: house 6s ease infinite;
}

.loading.ha-logo .circut {
    animation: circut 6s cubic-bezier(0.7, 0.1, 0.1, 0.9) infinite;
}

@keyframes house {
    0% {
        stroke-dashoffset: -50;
        stroke-dasharray: 50 50;
    }
    45% {
        stroke-dashoffset: -100;
    }
    50% {
        stroke: #cfcfcf;
    }
    60% {
        stroke: white;
    }
    75% {
        stroke: #c5c5c5;
    }
    80% {
        stroke-dashoffset: -100;
    }
    100% {
        stroke-dashoffset: -130;
        stroke-dasharray: 50 50;
    }
}

@keyframes circut {
    0% {
        stroke-dasharray: 20 20;
        stroke-dashoffset: -20;
    }
    13% {
        stroke-dashoffset: -20;
    }
    50% {
        stroke-dashoffset: -40;
        stroke: #d4d4d4;
    }
    60% {
        stroke: white;
    }
    70% {
        stroke: #d4d4d4;
    }
    85% {
        stroke-dashoffset: -40;
    }
    100% {
        stroke-dashoffset: -60;
        stroke-dasharray: 20 20;
    }
}

@keyframes nodes {
    0% {
        stroke-dasharray: 0 4;
    }
    25% {
        stroke-dasharray: 0 4;
    }
    35% {
        stroke-dasharray: 4 0;
        stroke: #cfcfcf;
    }
    41% {
        fill: none;
    }
    42% {
        fill: #cfcfcf;
    }
    55% {
        fill: none;
        stroke: #cfcfcf;
    }
    65% {
        fill: white;
        stroke: white;
    }
    75% {
        stroke: #cfcfcf;
        fill: none;
        stroke-dasharray: 4 0;
    }
    85% {
        fill: #cfcfcf;
        stroke: #cfcfcf;
    }
    93% {
        fill: none;
        stroke-dasharray: 4 0;
        stroke-dashoffset: 0;
    }
    100% {
        stroke-dashoffset: -4;
        stroke-dasharray: 0 4;
    }
}

.ha-logo circle:nth-child(1n) {
    animation-delay: -0.054s;
}

.ha-logo circle:nth-child(2n) {
    animation-delay: -0.108s;
}

.ha-logo circle:nth-child(3n) {
    animation-delay: -0.162s;
}

.ha-logo circle:nth-child(4n) {
    animation-delay: -0.216s;
}

.ha-logo circle:nth-child(5n) {
    animation-delay: -0.27s;
}

.ha-logo circle:nth-child(6n) {
    animation-delay: -0.324s;
}

.ha-logo circle:nth-child(7n) {
    animation-delay: -0.378s;
}

.ha-logo circle:nth-child(8n) {
    animation-delay: -0.432s;
}

.ha-logo circle:nth-child(9n) {
    animation-delay: -0.486s;
}

.ha-logo circle:nth-child(10n) {
    animation-delay: -0.54s;
}

.ha-logo circle:nth-child(11n) {
    animation-delay: -0.594s;
}

.ha-logo circle:nth-child(12n) {
    animation-delay: -0.648s;
}

.ha-logo circle:nth-child(13n) {
    animation-delay: -0.702s;
}

.ha-logo circle:nth-child(14n) {
    animation-delay: -0.756s;
}


/* Button below error SVG */
.home-button {
    background-color: #ffffff;
    border: 1px solid #cfcfcf;
    color: #333333;
    padding: 10px 20px;
    border-radius: 9999px;
    display: block;
    width: fit-content;
    text-decoration: none;
    margin: 5em auto 0;
}

.home-button:hover {
    background-color: #f9f9f9;
    border-color: #bfbfbf;
    color: #333333;
    text-decoration: none;
}