/*
1.1 Header Area


.navbar-nav>li>a {
    padding-top: 0;
    padding-bottom: 0;
}

.mainmenu {
    background-color: transparent;
    border-color: transparent;
    margin-bottom: 0;
    border: 0px !important;
}

.navbar-nav>li:last-child>a {
    padding-right: 0px;
    margin-right: 0px;
}

.dropdown-menu {
    padding: 0px 0;
    margin: 0 0 0;
    border: 0px solid transition !important;
    border: 0px solid rgba(0, 0, 0, .15);
    border-radius: 0px;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.navbar-nav .open .dropdown-menu>li>a {
    padding: 16px 15px 16px 25px;
}

.header_bottom {
    background: #6f7a9f;
}

.header_area .header_bottom .mainmenu a,
.navbar-default .navbar-nav>li>a {
    color: #dadde6;
    font-size: 15px;
    padding: 10px 10px;
    font-family: 'Prompt', sans-serif;
}

.header_area .mainmenu .active a,
.header_area .mainmenu .active a:focus,
.header_area .mainmenu .active a:hover,
.header_area .mainmenu li a:hover,
.header_area .mainmenu li a:focus,
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>a:hover {
    color: #fff;
    background: #6f7a9f;
    outline: 0;
}

.navbar-default .navbar-toggle {
    border-color: #fff;
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
}

.mainmenu .collapse ul>li:hover>a {
    background: #4d5674;
}

.mainmenu .collapse ul ul>li:hover>a,
.navbar-default .navbar-nav .open .dropdown-menu>li>a:focus,
.navbar-default .navbar-nav .open .dropdown-menu>li>a:hover {
    background: #4d5674;
}

.mainmenu .collapse ul ul ul>li:hover>a {
    background: #58617f;
}

.mainmenu .collapse ul ul,
.mainmenu .collapse ul ul.dropdown-menu {
    background: #586283;
}

.mainmenu .collapse ul ul ul,
.mainmenu .collapse ul ul ul.dropdown-menu {
    background: #7d87a8;
}

.mainmenu .collapse ul ul ul ul,
.mainmenu .collapse ul ul ul ul.dropdown-menu {
    background: #e4eeb8;
}

.mainmenu {
    background: none;
    border: 0 solid;
    margin: 0;
    padding: 0;
    min-height: 20px;
}

@media only screen and (min-width: 767px) {
    .mainmenu .collapse ul li {
        position: relative;
    }
    .mainmenu .collapse ul li:hover>ul {
        display: block
    }
    .mainmenu .collapse ul ul {
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 250px;
        display: none
    }
    .mainmenu .collapse ul ul li {
        position: relative
    }
    .mainmenu .collapse ul ul li:hover>ul {
        display: block
    }
    .mainmenu .collapse ul ul ul {
        position: absolute;
        top: 0;
        left: 100%;
        min-width: 250px;
        display: none
    }
    .mainmenu .collapse ul ul ul li {
        position: relative
    }
    .mainmenu .collapse ul ul ul li:hover ul {
        display: block
    }
    .mainmenu .collapse ul ul ul ul {
        position: absolute;
        top: 0;
        left: -100%;
        min-width: 250px;
        display: none;
        z-index: 1
    }
}

***************************************************/

a:hover,
a:focus {
    text-decoration: none;
    outline: none;
}

body {
    font-family: 'Roboto', sans-serif;
}


/*
1.1 Header Area
***************************************************/


/*Bootstrap Reset*/

.navbar-nav>li>a {
    padding-top: 0;
    padding-bottom: 0;
}

.mainmenu {
    background-color: transparent;
    border-color: transparent;
    margin-bottom: 0;
    border: 0px !important;
}

.navbar-nav>li:last-child>a {
    padding-right: 0px;
    margin-right: 0px;
}

.dropdown-menu {
    padding: 0px 0;
    margin: 0 0 0;
    border: 0px solid transition !important;
    border: 0px solid rgba(0, 0, 0, .15);
    border-radius: 0px;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}


/*=-====Main Menu=====*/

.navbar-nav .open .dropdown-menu>li>a {
    padding: 16px 15px 16px 25px;
}

.header_bottom {
    /* background: #0071ba; */
    background: #58617f;
}

.header_area .header_bottom .mainmenu a,
.navbar-default .navbar-nav>li>a {
    color: #fff;
    font-size: 15px;
    padding: 11px 11px;
    font-family: 'Prompt', sans-serif;
}

.header_area .mainmenu .active a,
.header_area .mainmenu .active a:focus,
.header_area .mainmenu .active a:hover,
.header_area .mainmenu li a:hover,
.header_area .mainmenu li a:focus,
.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>a:hover {
    /* color: #0071ba; */
    color: #58647f;
    background: #8b96ae;
    outline: 0;
}


/*-----./ Main Menu-----*/

.navbar-default .navbar-toggle {
    border-color: #fff;
}


/*Toggle Button*/

.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff
}


/*Toggle Button*/


/*==========Sub Menu=v==========*/

.mainmenu .collapse ul>li:hover>a {
    /*  Click Active Color */
    background: #4d5674;
}

.mainmenu .collapse ul ul>li:hover>a,
.navbar-default .navbar-nav .open .dropdown-menu>li>a:focus,
.navbar-default .navbar-nav .open .dropdown-menu>li>a:hover {
    /* สีสะไล L 1 */
    background: #e7eaef;
}

.mainmenu .collapse ul ul ul>li:hover>a {
    /* สีสะไล L 2 */
    background: #CBEAF0;
}

.mainmenu .collapse ul ul,
.mainmenu .collapse ul ul.dropdown-menu {
    /* bg L 1 */
    /* background: #98D7E1; */
    background: #adb5c6;
    /*  background-color: #328dc7;*/
}

.mainmenu .collapse ul ul ul,
.mainmenu .collapse ul ul ul.dropdown-menu {
    /* bg L 2 */
    background: #0a1464;
}

.mainmenu .collapse ul ul ul ul,
.mainmenu .collapse ul ul ul ul.dropdown-menu {
    /* bg L 3 */
    background: #e4eeb8
}


/******************************Drop-down menu work on hover**********************************/

.mainmenu {
    background: none;
    border: 0 solid;
    margin: 0;
    padding: 0;
    min-height: 20px
}

@media only screen and (min-width: 767px) {
    .mainmenu .collapse ul li {
        position: relative;
    }
    .mainmenu .collapse ul li:hover>ul {
        display: block
    }
    .mainmenu .collapse ul ul {
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 250px;
        display: none
    }
    /*******/
    .mainmenu .collapse ul ul li {
        position: relative
    }
    .mainmenu .collapse ul ul li:hover>ul {
        display: block
    }
    .mainmenu .collapse ul ul ul {
        position: absolute;
        top: 0;
        left: 100%;
        min-width: 250px;
        display: none
    }
    /*******/
    .mainmenu .collapse ul ul ul li {
        position: relative
    }
    .mainmenu .collapse ul ul ul li:hover ul {
        display: block
    }
    .mainmenu .collapse ul ul ul ul {
        position: absolute;
        top: 0;
        left: -100%;
        min-width: 250px;
        display: none;
        z-index: 1
    }
}