﻿
.main_header {
  border-bottom: none;
  overflow: auto;
  background: #ffffff;
  overflow:visible;
}

.menus { float:right; padding-top:10px;}

.main_header > .innercustom1 {max-width: 1040px; box-sizing:border-box; margin: 0 auto; overflow:visible; height:auto; position:relative;}
.main_header > .innercustom1 .logoout { float:left; padding-top:20px; padding-bottom:20px; max-width:380px; }

.main_header > .innercustom1 .topsearchbox { top:80px; width:300px; position:absolute; right:0; box-sizing:border-box; padding:16px; border: solid 1px #e1e1e1;
		background: #ffffff;
		  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1); display:none; }
.main_header > .innercustom1 a.top-fa-search { cursor:pointer; }
.main_header > .innercustom1 .topsearchbox input { background:#f7f7f7; }

	#menu, #menu ul {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	
	#menu {
		width: 100%;
		margin: 20px auto;
		border: none;
		background-color: #fff;
	}
	
	#menu:before,
	#menu:after {
		content: "";
		display: table;
	}
	
	#menu:after {
		clear: both;
	}
	
	#menu {
		zoom:1;
	}
	
	#menu li {
		float: left;
		position: relative;
	}
	
	#menu a {
		float: left;
		padding: 12px 16px;
		color: #666;
		font-size: 14px;
		text-decoration: none;
	}
	
	#menu li:hover > a {
		color: #444444;
	}
	
	*html #menu li a:hover { /* IE6 only */
		color: #fafafa;
	}
	
	#menu ul {
		margin: 20px 0 0 0;
		_margin: 0; /*IE6 only*/
		opacity: 0;
		visibility: hidden;
		position: absolute;
		top: 38px;
		left: 0;
		z-index: 1;    
        border: solid 1px #e1e1e1;
		background: #f7f7f7;
		  box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
		border-radius: 3px;
		transition: all .2s ease-in-out;  
	}

    #menu li.lastmenu ul{
        right:0; left:auto;
}
    #menu li.lastmenu ul li:first-child > a:after {
		content: '';
		position: absolute;
		right: 30px;
        left:auto;
		top: -6px;
		border-left: 6px solid transparent;
		border-right: 6px solid transparent;
		border-bottom: 6px solid #eee;
	}
    #menu li.lastmenu ul ul li:first-child a:after {
		left: -6px;
		top: 50%;
		margin-top: -6px;
		border-left: 0;	
		border-bottom: 6px solid transparent;
		border-top: 6px solid transparent;
		border-right: 6px solid #eeeeee;
	}

	#menu li:hover > ul {
		opacity: 1;
		visibility: visible;
		margin: 0;
	}
	
	#menu ul ul {
		top: 0;
		left: 150px;
		margin: 0 0 0 20px;
		_margin: 0; /*IE6 only*/
		box-shadow: -1px 0 0 rgba(255,255,255,.3);		
	}
	
	#menu ul li {
		float: none;
		display: block;
		border: 0;
		_line-height: 0; /*IE6 only*/
	}
	
	#menu ul li:last-child {   
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;    
	}
	
	#menu ul a {    
		padding: 10px;
		width: 130px;
		_height: 10px; /*IE6 only*/
		display: block;
		white-space: nowrap;
		float: none;
		text-transform: none;
	}
	
	#menu ul a:hover {
		background-color: #eeeeee;
	}
	
	#menu ul li:first-child > a {
		border-radius: 3px 3px 0 0;
	}
	
	#menu ul li:first-child > a:after {
		content: '';
		position: absolute;
		left: 30px;
		top: -6px;
		border-left: 6px solid transparent;
		border-right: 6px solid transparent;
		border-bottom: 6px solid #eee;
	}
	
	#menu ul ul li:first-child a:after {
		left: -6px;
		top: 50%;
		margin-top: -6px;
		border-left: 0;	
		border-bottom: 6px solid transparent;
		border-top: 6px solid transparent;
		border-right: 6px solid #eeeeee;
	}
	
	#menu ul li:first-child a:hover:after {
		_border-bottom-color: #eeeeee; 
	}
	
	#menu ul ul li:first-child a:hover:after {
		border-right-color: #eeeeee; 
		border-bottom-color: transparent; 	
	}
	
	#menu ul li:last-child > a {
		-moz-border-radius: 0 0 3px 3px;
		-webkit-border-radius: 0 0 3px 3px;
		border-radius: 0 0 3px 3px;
	}
	
	/* Mobile */
	#menu-trigger, #menu-trigger-search {
		display: none;
	}

@media screen and (max-width: 960px) {
    .li-top-search { display:none !important; }
    .main_header > .innercustom1 .logoout { max-width:380px; }
    /* nav-wrap */
    .innercustom1 > .menus { }
    #menu-wrap {
        position: absolute;
        width:100%; right:0; 
    }


    #menu-wrap #menu-trigger { float:right;}
    #menu-wrap  #menu-trigger-search { float:right;}
        #menu-wrap * {
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

    /* menu icon */
    #menu-trigger{
        display: block; /* show menu icon */
        cursor: pointer;
        margin-top: 20px;
        margin-right: 10px;
        padding: 6px;
        border: 1px solid #666666;
        color: #666666;
        font-size: 22px;
        font-weight: bold;
        background-color: #ffffff;
        border-radius: 2px;
        line-height: 100%;
        text-indent: -999px;
        width: 32px; float:left;
        height: 32px;
        background: url(/images/icon-menu.png) no-repeat;
    }
    #menu-trigger-search 
    {
        display: block; /* show menu icon */
        cursor: pointer;
        margin-top: 20px;
        margin-right: 10px;
        padding: 6px;
        border: 1px solid #666666;
        color: #666666;
        font-size: 16px;
        font-weight: bold;
        background-color: #ffffff;
        border-radius: 2px;
        line-height: 100%;
        text-align:center; 
        width: 32px; float:left;
        height: 32px;
    }
    #menu-trigger-search a { color:#666666; }
    /* main nav */
    #menu {
        margin: 0;
        padding: 0px;
        margin-top: 40px;
        position: absolute;
        top: 40px;
        max-width:360px;
        width:100%;
        right: 0;
        left: auto;
        z-index: 1;
        background-color: #444444;
        border: solid 1px #444444;
        display: none;
        box-shadow: none;
        box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
    }

        #menu:after {
            content: '';
            position: absolute;
            right: 60px;
            left: auto;
            top: -8px;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-bottom: 8px solid #444444;
        }

        #menu li.lastmenu ul li:first-child > a:after {
            content: '';
            display: none;
        }

        #menu li.lastmenu ul ul li:first-child a:after {
            display: none;
        }

        #menu ul {
            position: static;
            visibility: visible;
            opacity: 1;
            margin: 0;
            background: none;
            box-shadow: none;
            border: none;
        }

            #menu ul ul {
                margin: 0 0 0 20px !important;
                box-shadow: none;
            }

        #menu li {
            position: static;
            display: block;
            float: none;
            border: 0;
            margin: 0px;
            box-shadow: none;
            background: #444;
        }

            #menu li:hover {
                background: #444;
            }

                #menu li:hover a {
                    color: #eee;
                }

            #menu li a:hover, #menu li ul li a:hover {
    background:#333333;
}

            #menu li ul li a:before {
                content: "\f0da";
                font-family: FontAwesome;
                font-style: normal;
                font-weight: normal;
                text-decoration: inherit;
            /*--adjust as necessary--*/
                color: #eee;
                font-size: 13px;
                padding-right: 0.5em;
                top: 10px;
                left: 0;
            }
		#menu ul li{
			
			box-shadow: none;	
            
            

		}
            #menu ul li a {
                padding-left: 30px;
                background:#4a4a4a;border-bottom:solid 1px #555;	
            }
            #menu ul li a:hover { background:#444;
            }
		#menu a{
			display: block;
			float: none;
			padding: 0;
			color: #eee;
            padding:6px;
            padding-left:20px;
            border-bottom:solid 1px #555;	
            background:#444;
		}

		#menu a:hover{
			color: #fafafa;
		}	

		#menu ul a{
			padding: 0;
			width: auto;		
            padding:6px;
            border-bottom:none;
		}

		#menu ul a:hover{
			color:#ddd;
		}

		#menu ul li:first-child a:after,
		#menu ul ul li:first-child a:after {
			border: 0;
		}		

	}

	@media screen and (min-width: 960px) {
		#menu {
			display: block !important;

		}
	}	

	/* iPad */
	.no-transition {
		transition: none;
		opacity: 1;
		visibility: visible;
		display: none;  		
	}

	#menu li:hover > .no-transition {
		display: block;
	}

@media screen and (max-width: 500px) {
    .main_header > .innercustom1 .logoout {
        max-width: 260px;
    }
}
@media screen and (max-width: 400px) {
    .main_header > .innercustom1 .logoout {
        max-width: 220px;
    }
}
@media screen and (max-width: 320px) {
    .main_header > .innercustom1 .logoout {
        max-width: 180px;
    }
}