﻿@import url("font-awesome/css/font-awesome.min.css");
@media (min-width: 768px) {

    /*navigation*/
    .link_nav {
        float: right;
        display: block;
    }

        .link_nav ul {
            list-style-type: none;
            margin: 10px 0px 0px 0px;
            padding: 0;
            float: left;
        }

        .link_nav > ul > li {
            float: left;
            padding: 0px 3px;
        }

            .link_nav > ul > li:nth-child(1) {
                float: left;
                padding: 0px 3px;
            }

        .link_nav ul li a {
            float: left;
            padding: 0;
            text-decoration: none;
            border-left: 1px solid transparent;
            border-right: 1px solid transparent;
            font-size: 14px;
            color: #777777 !Important;
        }

            .link_nav ul li a:hover {
                text-decoration: none;
            }

        .link_nav > ul > li:hover {
            border-bottom: 2px solid #fcb714;
            border-radius: 3px;
            padding: 0px 3px;
        }

        .link_nav > ul > li:nth-child(1):hover {
            border-bottom: 2px solid #fcb714;
            border-radius: 3px;
            padding: 0px 3px;
        }

        .link_nav ul li.active {
            border-bottom: 2px solid #fcb714;
            border-radius: 3px;
        }

        .link_nav ul li a span {
            padding: 5px 10px;
            float: left;
        }

            .link_nav ul li a span.bus {
                padding: 0.5em 2.5em 0.5em .8em;
                float: left;
            }

        .link_nav ul li a.active {
            border-left: 1px solid #fff;
            border-right: 1px solid #fff;
        }

        .link_nav ul li a span.serv {
            padding: 0.5em 2.5em 0.5em .8em;
            float: left;
        }

        .link_nav ul li a span.train {
            padding: 0.5em 2.5em 0.5em .8em;
            float: left;
        }

        .link_nav ul li a span.account {
            padding: 0.5em 2.5em 0.5em .8em;
            float: left;
        }

        /*subnaigation*/
        .link_nav ul li {
            position: relative;
        }

            .link_nav ul li:hover .subnav {
                display: block;
            }

    .subnav {
        position: absolute;
        border: 2px solid #eee;
        padding: .3%;
        display: none;
        top: 29px;
        left: 0;
        z-index: 700;
        background: #fff;
    }

    .subnav_box {
        float: left;
        padding: 0.2em;
    }

        .subnav_box ul {
            list-style: none;
            display: block;
            padding: 0 0 0 0px;
            margin: 0px;
        }

            .subnav_box ul li {
                padding: 1.5% 0% 1.5% 0%;
                margin: 1px;
                float: left;
                width: 99%;
                border-bottom: 1px solid #fcb714;
            }

                .subnav_box ul li a {
                    padding-left: 5px;
                }

                .subnav_box ul li:hover a {
                    text-decoration: none;
                }

                .subnav_box ul li:hover {
                    border-bottom: 2px solid #fcb714;
                    border-radius: 3px;
                }

    .ntficons {
        float: right;
        height: 25px;
        margin: 6px;
        margin: 20px 8px 0 0;
    }

        .ntficons a {
            float: left;
            text-decoration: none;
        }

    .width_submenu {
        width: 165px;
    }
}
@media (max-width: 767px) {

    /*navigation*/

    .link_nav ul{
        width:100%;
        background:#04abe0;
    }
    .link_nav ul li{
        width:100%;
        list-style-type:none;
        text-align:center;        
        border-bottom:1px solid #FFFFFF;
        padding:4px;
    }
    .link_nav ul li a{
        color:#FFFFFF;
        font-size:12px;
        
    }
    .link_nav ul li a:hover{
        text-decoration:none;
        color:#000000;
    }
    .link_nav ul li:hover {
        background:#fec14c;
        color:#000000;
    }
    .link_nav ul li:hover .subnav{
        display:block;
    }

    .link_nav ul li .subnav{
        width:100%;
        display:none;
        position:relative;
        border-top:1px solid #FFFFFF;
        margin-bottom:-5px;
    }
        .link_nav ul li .subnav .subnav_box {
           width:100%;
        }
    .link_nav ul li .subnav .subnav_box ul{
        width:100%;
    }
    .link_nav ul li .subnav .subnav_box ul li{
        width:100%;
        list-style-type:none;
        text-align:center;
        border-bottom:1px solid #FFFFFF;
        padding:4px;
    }
    .link_nav ul li .subnav .subnav_box ul li a{
        color:#FFFFFF;
        font-size:12px;
        
    }
    .link_nav ul li .subnav .subnav_box ul li a:hover{
        text-decoration:none;
        color:#000000;
    }
}