﻿:root {
    --i-light-blue: #dff2fa;
    --i-ice-blue-white: #f1f9fc;
    --i-dark-blue: #0871b2;
    --i-steel-blue: #7e8da0;
    --i-bright-sky-blue: #42b3e0;
    --i-gray-blue: #8494a5;
    --i-blue-gray: #7d8d9f;
    --i-ocean-blue: #0773b2;
    --i-tech-blue: #2aa7dd;
    --i-deep-sky-blue: #0871b2;
}

body {
    font-size: 16px !important;
}

i {
    min-width: 30px;
    text-align: center;
}

.alertBox {
    position: fixed;
    bottom: 10%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1050;
    width: 300px;
    text-align: center;
    display: block;
}

.nav-content .nav-link {
    color: white !important;
    font-weight: 700;
    font-size: 1.4rem;
}

    .nav-content .nav-link.nav-dropdown {
        color: #666 !important;
        font-weight: 700;
    }

.nav-dropdown {
    border-radius: 10px;
    color: #666 !important;
    font-weight: 700;
    padding: .5rem 1.5rem;
    background-color: white;
}

@media(max-width:991px) {
    .nav-content {
        background-color: white;
        padding: .5rem 1.5rem;
        border-radius: 15px;
    }

        .nav-content .nav-link {
            color: #666 !important;
        }

        .nav-content .dropdown-menu {
            border: none;
        }

        .nav-content .dropdown-li {
            display: inline-block;
            width: 32%;
        }

        .nav-content .dropdown-li {
            background-color: #dff2fa;
            border-radius: 10px;
        }
}

footer {
    background-color: transparent;
    color: white;
    position: relative;
    text-align: center;
}

.footer-bar {
    background-color: var(--i-light-blue);
    padding: 2rem;
    position: relative;
}

    .footer-bar p {
        margin: 0;
        color: var(--i-bright-sky-blue);
    }

    .footer-bar img {
        position: absolute;
        left: 5%;
        top: 20%;
    }

.triangle-up {
    width: 0;
    height: 0;
    border-left: 45px solid transparent;
    border-right: 45px solid transparent;
    border-bottom: 45px solid var(--i-light-blue);
    margin: 0 auto;
    position: relative;
    cursor: pointer;
}

    .triangle-up span {
        position: absolute;
        top: 15px;
        left: 50%;
        transform: translateX(-50%);
        color: var(--i-steel-blue);
        font-size: 1.3rem;
        font-weight: bold;
    }

.mtitle {
    color: var(--i-ocean-blue);
    font-size: 3rem;
    font-weight: 700;
}

.stitle {
    color: var(--i-blue-gray);
    font-size: 1.8rem;
    font-weight: 700;
}

.mcontent {
    color: var(--i-tech-blue);
    font-size: 1.4rem;
    font-weight: 700;
}

.content {
    color: var(--i-gray-blue);
    font-size: 1.1rem;
}
