:root {
    --main-color: #4d646b;
    --blue1: #3bafbf;
    --blue2: #075576;
    --blue3: #3071c8;
}

body {
    position: relative;
}

.starter-template {
    padding: 3rem 1.5rem;
    text-align: center;
}

.bg-white,
.bg-toggle {
    background: white;
    box-shadow: 0px 3px rgba(0,0,0,0.5) !important;
    transition: 0.3s;
}

.img-logo {
    filter: brightness(1);
}

.tfg-filter {
    filter: brightness(100) opacity(0.4);
}

.bg-toggle .tfg-filter,
.bg-white .tfg-filter {
    filter: none;
}

.navbar-brand,
.navbar-brand:hover {
    color: rgba(255,255,255,0.5);
}

.bg-toggle .navbar-brand,
.bg-toggle .navbar-brand:hover,
.bg-white .navbar-brand,
.bg-white .navbar-brand:hover {
    color: var(--blue2);
}

nav .icon-bar {
    background-color: var(--blue2);
}

.navbar-toggler .icon-bar {
    background-color: rgba(255,255,255,0.5);							/*Color changes here*/
    transform: rotate(0deg) translate(0px, 0px);
    transition: ease all .2s;
}

.bg-white .navbar-toggler .icon-bar,
.bg-toggle .navbar-toggler .icon-bar {
    background-color: var(--blue2);							/*Color changes here*/
    transform: rotate(0deg) translate(0px, 0px);
    transition: ease all .2s;
}

.navbar-toggler .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px;
}

.navbar-toggler .icon-bar+.icon-bar {
    margin-top: 4px;
}

.icon-bar:nth-child(2) {
    width: 16px;
    transition: ease all .2s;
}

.navbar-toggler:hover>.icon-bar:nth-child(2) {
    width: 22px;
    transition: ease all .2s;
}

.navbar-toggler:active>.icon-bar:nth-child(2) {
    width: 22px;
    transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(1) {
    transform: rotate(45deg) translate(5px, 4px);
    transition: ease all .2s;
}

.bg-white .navbar-toggler:not(.collapsed) .icon-bar:nth-child(1),
.bg-white .navbar-toggler:not(.collapsed) .icon-bar:nth-child(3) {
    background-color: var(--blue2);
}

.bg-toggle .navbar-toggler:not(.collapsed) .icon-bar:nth-child(1),
.bg-toggle .navbar-toggler:not(.collapsed) .icon-bar:nth-child(3) {
    background-color: var(--blue2);
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(2) {
    opacity: 0;
    transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(3) {
    transform: rotate(-45deg) translate(4px, -4px);
    transition: ease all .2s;
}

.navbar-toggler {
    border: none;
}

nav .navbar-nav .active > .nav-link {
    color: var(--blue1);
    transition: 0.2s ease-in-out;
    position: relative;
}

nav ul li.nav-item {
    list-style: none;
}

/* ==== Responsive Stuff ==== */
@media (max-width: 575px) {
    .navbar-title,
    .brand-text,
    .b-text {
        font-size: 15px;
    }

    h2 {
        font-size: 1.4rem;
    }

    h3 {
        font-size: 1.2rem;
    }

    .navbar-brand img {
        width: 75%;
    }

    nav ul {
        text-align: center;
    }
}

@media (max-width: 366px) {
    a.b-text {
        display: none;
    }
}

.triangle-down-menu {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0px 2400px 50px 0px;
    border-color: transparent #fff transparent transparent;
    position: absolute;
    right: 0;
    bottom: -50px;
    z-index: 2;
}

.triangle-down-shadow-menu {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 2400px 50px 0;
    border-color: transparent rgba(0,0,0,0.5) transparent transparent;
    right: 0;
    bottom: -55px;
    position: absolute;
    z-index: 1;
}

nav  .navbar-nav a.nav-link {
    color: var(--main-color);
}

nav .navbar-nav .show > .nav-link,
nav .navbar-nav a.nav-link:hover {
    color: var(--blue2);
    transition: 0.2s ease-in-out;
}