@import url(https://fonts.googleapis.com/css?family=Roboto);
@import url(//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css);

 
.navbar .nav {
    text-align:center;
    list-style-type: none;
    height: 50px;
    background: #3f6b9d;
    -moz-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
    -webkit-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
    box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
    
   

}

    .navbar .nav .nav-item {
        display: inline-block;
        /*float: left;*/
        position: relative;
     
        *zoom: 1;
        filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF5C79BC', endColorstr='#FF6C9DDD');
        background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIxMCUiIHN0b3AtY29sb3I9IiM1Yzc5YmMiLz48c3RvcCBvZmZzZXQ9IjEwJSIgc3RvcC1jb2xvcj0iIzZjOWRkZCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
        background-size: 100%;
        background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(10%, #5c79bc), color-stop(10%, #3f6b9d));
        background-image: -moz-linear-gradient(top, #5c79bc 10%, #3f6b9d 10%);
        background-image: -webkit-linear-gradient(top, #5c79bc 10%, #3f6b9d 10%);
        background-image: linear-gradient(to bottom, #5c79bc 10%, #3f6b9d 10%);
        background-position: 0 -5px;
        background-size: 100% 110%;
        transition: all 0.3s;
    }

        .navbar .nav .nav-item:hover {
            background-position: 0 0;
        }

        .navbar .nav .nav-item:before {
            content: '';
            opacity: 0;
            display: block;
            background-color: #5c79bc;
            width: 5px;
            height: 8px;
            position: absolute;
            left: 50%;
            top: -20%;
            margin-left: -5px;
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
            transition: all 0.3s;
        }

        .navbar .nav .nav-item:hover:before {
            top: 0;
            opacity: 1;
        }

        .navbar .nav .nav-item a {
            display: block;
            padding: 15px 30px;
            text-decoration: none;
            color: #EEE;
            font-size: 15px;
            line-height: 20px;
            font-family: unset;
        }

            .navbar .nav .nav-item a:hover {
               
                color:#333;
            }

            .navbar .nav .nav-item .activeTab {
                color: #333;
                background-color: #FFF;
            }