/* Import Google Font */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap');


* {
    font-family: 'Poppins', sans-serif;
}

.bg-deamblue {
    background-color: rgba(0, 166, 255, 0.2) !important;
}

:root {
    --heading-font: 'Playfair Display', serif;
    --body-font: 'Poppins', sans-serif;
    --blue-color: #00A6FF;
    --p-color: #555555;
    --gray-color: #DAE0E6;
}

.text-blue {
    color: var(--blue-color) !important;
}

.bg-blue {
    background-color: var(--blue-color) !important;
}

.bg-gray {
    background-color: var(--gray-color) !important;
}

.border-blue {
    background-color: var(--blue-color) !important;
}

/* Apply Playfair Display to All Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--heading-font) !important;
    color: black !important;
}

.my-skills .progress-bar {
    width: 100%;
    height: 8px;
    background-color: #ddd;
    border-radius: 5px;
    overflow: hidden;
    position: relative;
}

.my-skills .progress {
    height: 100%;
    background-color: #00a6ff;
    width: 0;
    /* Default */
    transition: width 1s ease-in-out;
}

p {
    font-family: var(--body-font);
    color: var(--p-color);
}

.footer p,
.footer a,
.footer span,
.footer h5 {

    color: #fff !important;
}

a {
    text-decoration: none !important;
    color: #555555 !important;
}

footer a:hover {
    color: #00a6ff !important;
}