#mainNav{min-height:56px;background-color:#0368b5}
 #mainNav .navbar-toggler{font-size:80%;padding:.75rem;color:#fff;border:1px solid #fff}
 #mainNav .navbar-toggler:focus{outline:0}
 #mainNav .navbar-brand{color:#ffffff;font-weight:700;padding:.9rem 0}
 #mainNav .navbar-nav .nav-item:hover{color:fade(white,80%);outline:0;background-color:transparent}
 #mainNav .navbar-nav .nav-item:active,#mainNav .navbar-nav .nav-item:focus{outline:0;background-color:transparent}
 
 @media (min-width:992px){
 #mainNav{padding-top:20px;padding-bottom:2px;border-bottom:none;background-color:rgba(0,102,179,.9);transition:background-color .1s ease-in-out}
 #mainNav .navbar-brand{padding:.5rem 0;color:rgba(255,255,255,.5)}
 #mainNav .nav-link{ transition:none;padding:.5rem 1.5rem;color:rgba(255,255,255,1)}
 #mainNav .nav-link:hover{color:rgba(255,255,255,.75)}
 #mainNav .nav-link:active{color:#fff}
 #mainNav.navbar-shrink{background-color:rgba(0,102,179,1)}<!-- color barra sin responsivo -->
 #mainNav.navbar-shrink .navbar-brand{color:#fff}
 #mainNav.navbar-shrink .nav-link{color:#ffffff;padding:1rem 1.5rem 1.25rem;border-bottom:.25rem solid transparent}
 #mainNav.navbar-shrink .nav-link:hover{color:#bbbcbd}
 #mainNav.navbar-shrink .nav-link:active{color:#467370}
 #mainNav.navbar-shrink .nav-link.active{color:#ffffff;outline:0;border-bottom:.25rem solid #ffffff}
 #mainNav .navbar-nav .nav-item{font-size:20px;}

 
 .navbar-center {
    position: absolute;
    left: 50%;
    transform: translatex(-50%);
}

}
@media (min-width:1400px){
    #mainNav{padding-top:17px;padding-bottom:2px;border-bottom:none;background-color:rgba(0,102,179,.9);transition:background-color .1s ease-in-out}
    #mainNav .navbar-brand{padding:.5rem 0;color:rgba(255,255,255,.5)}
    #mainNav .nav-link{ transition:none;padding:.5rem 1.5rem;color:rgba(255,255,255,1)}
    #mainNav .nav-link:hover{color:rgba(255,255,255,.75)}
    #mainNav .nav-link:active{color:#fff}
    #mainNav.navbar-shrink{background-color:rgba(0,102,179,1)}<!-- color barra sin responsivo -->
    #mainNav.navbar-shrink .navbar-brand{color:#fff}
    #mainNav.navbar-shrink .nav-link{color:#ffffff;padding:1rem 1.5rem 1.25rem;border-bottom:.25rem solid transparent}
    #mainNav.navbar-shrink .nav-link:hover{color:#bbbcbd}
    #mainNav.navbar-shrink .nav-link:active{color:#467370}
    #mainNav.navbar-shrink .nav-link.active{color:#ffffff;outline:0;border-bottom:.25rem solid #ffffff}
    #mainNav .navbar-nav .nav-item{font-size:20px;}


    .navbar-center {
        position: absolute;
        left: 55%;
        transform: translatex(-55%);
}