﻿/* #Navigation
================================================== */			
		/** Show menu icon for Mobile Devices **/
		.menu-icon{ display:block; z-index:9999; color:#2b99c9; width:30px; top:8px; text-align:center; left:6%; height:30px; position:absolute; cursor:pointer;}
		.menu-icon:before{ content: "\f0c9"; font-family:FontAwesome; font-size:2em; line-height:30px; -webkit-font-smoothing: antialiased; }
			.menu-icon:hover{ color:#888888; }
                        
                /* if home, change padding */
                .home .menu-icon, .page-template-frontspanish .menu-icon{ top: 20px; }
		
                #menu-primary { padding: 0 !important; }
		.menu-primary ul > li { list-style: none; text-transform:uppercase; }		
		.menu-primary ul{ padding:0; margin:0 !important;}	
		.menu-primary ul li{ display:block; padding:0 20px; margin:5px 0; position: relative; }
		.menu-primary ul li a{ 
                    display: block;
                    text-decoration: none;
                    padding: 0.5em 0;
                    line-height: 1em;
                    margin: 0 !important;
                    position: relative;
                }
                .menu-primary ul li a:after{ 
                    content: '';
                    display: block;
                    margin-top: 8px;
                    width: 15px;
                    height: 1px;
                    background-color: #ccc;
                    position: absolute;
                    left: 0;
                }
                .home .menu-primary ul li a:after, .page-template-frontspanish .menu-primary ul li a:after {
                    right: 0 !important; left: auto;
                }
                .home .menu-primary ul li a, .page-template-frontspanish .menu-primary ul li a{ text-align: right; }
		
		.menu-primary .current-menu-item > a,
		.menu-primary .current-menu-ancestor > a,
		.menu-primary .current_page_item > a,
		.menu-primary .current_page_ancestor > a {
                    color: #1b5b91;
		}
                
                .menu-primary .current-menu-item > a:after,
		.menu-primary .current-menu-ancestor > a:after,
		.menu-primary .current_page_item > a:after,
		.menu-primary .current_page_ancestor > a:after {
                    content: ''; height: 1px; background-color: #1b5b91; width: 100%;
		}
                
                .menu-primary .current-menu-item ul li > a:after,
		.menu-primary .current-menu-ancestor ul li > a:after,
		.menu-primary .current_page_item ul li > a:after,
		.menu-primary .current_page_ancestor ul li > a:after,
                .menu-primary ul ul li a:after
                {
                    content: none;
		}
		
		/** Menu Hover **/
		.menu-primary li:hover {  }
		.menu-primary li a:hover{ color:#2b99c9; }

		.menu-icon.active{ background-position:right;}
		
		.menu-primary li{
		-webkit-transition: all 0.2s ease-in;
		transition: all 0.2s ease-in;		
		}
		
		.menu-primary .current-menu-item > a,
		.menu-primary .current-menu-ancestor > a,
		.menu-primary .current_page_item > a,
		.menu-primary .current_page_ancestor > a {
			font-weight:bold;
		}
				
		.menu-primary,
		#header .nav-menu ul { 
			font-family:'Open Sans', Arial, Helvetica, sans-serif; 
			font-weight:400; 
			width:100%; 
			padding:0; 
			margin:0; 
			z-index:9999;
		}
		
		/* Nav Link */
		#header .nav-menu a{ display:block; }	
		
		/** Appear Menu **/	
		.menu-icon{ margin-bottom:0; }
                
                /* General styles for all menus */
		.cbp-spmenu {
                    background: #31aee6;
                    position: fixed; z-index:9999;
                    padding: 0;
                    height: 100%;
                    color: #fff;
                }
                
		body.cbp-spmenu-push-toright .menu-icon{ color:#31aee6; }

		/*** Slide Menu Style Starts Here ***/
		
		/* Orientation-dependent styles for the content of the menu */		
		.cbp-spmenu-vertical { width: 200px; top: 0; z-index: 9999; }		
		.cbp-spmenu-vertical a { padding: 1em; color: #fff; }
		
		/* Vertical menu that slides from the left or right */		
		.cbp-spmenu-left { left: -200px; }
		
		/* Push classes applied to the body */		
		.cbp-spmenu-push { overflow-x: hidden; overflow-y:scroll; position: relative; left: 0; }
                
		.cbp-spmenu-push-toright { left: 200px; }	
		
		/* Transitions */		
		.cbp-spmenu,
		.cbp-spmenu-push {
                    -webkit-transition: all 0.3s ease;
                    transition: all 0.3s ease;
		}		
		body.cbp-spmenu-push-toright { overflow:hidden; }



	/* ++++++++++++++++++++++++++++++ media queries +++++++++++++++++++++++++++++++++
	++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	
	/* Up to Mobile Landscape Size */
	@media only screen and (max-width: 479px) {}
	
	/* Upwards of Mobile Landscape Size  */
	@media only screen and (min-width: 480px) {
				
	}
	/* Tablet Portrait */
	@media only screen and (min-width: 768px) {
					
	}
	
	/* Max Screen size 960 */
	@media screen and (max-width: 960px) {
		
            .cbp-spmenu-left.cbp-spmenu-open {
                    overflow-y: auto;
                    left: 0px; 
                    z-index:999999 !important;
                    overflow-x:hidden;
            }
            .site-navigation li a:hover{ background-color:#FFEB63; }
            .menu-primary ul li a{ color: #fff;}
            .menu-primary ul ul{ margin: 0 0 0 10px !important }

	}
		
	/* Beyond standard 960 */
	@media only screen and (min-width: 960px) {		
		
		/* open/visible menu for desktop */
		.cbp-spmenu-left {
                    left: 0px;
		}
		.home .cbp-spmenu, .page-template-frontspanish .cbp-spmenu{ background: transparent; }
                .home .menu-primary ul li a, .page-template-frontspanish .menu-primary ul li a { color: #333;}
		body.cbp-spmenu-push-toright{ overflow-y:scroll; }
                
                #container {position: relative;}
                
		.cbp-spmenu{ position:absolute; width: 20%; float: left; bottom: 0; }
                #main{ width: 80%; float: left; clear:none; margin-left: 20%; }
                
                #menu-primary{ margin-top: 140px; }
		
		/* ensure #nav is visible on desktop version */
                .nav-menu { display: block !important; }
		
		/* Hide Menu Icon */
		.menu-icon{ display:none; }		
		
		//.cbp-spmenu-vertical{width:auto;}		
		.nav-menu .current-page-item > a,
		.nav-menu .current-menu-ancestor > a,
		.nav-menu .current_page_item > a,
		.nav-menu .current_page_ancestor > a
		 {
			font-weight:bold;
		}
		
		.nav-menu .current-page-item,
		.nav-menu .current-menu-ancestor,
		.nav-menu .current_page_item,
		.nav-menu .current_page_ancestor
		{
			border-left:none !important;
		}
                
                .menu-primary ul ul .current-menu-item a,
		.menu-primary ul ul .current-menu-ancestor a,
		.menu-primary ul ul .current-menu-ancestor a,
		.menu-primary ul ul .current_page_ancestor a {
                    background:#1b5b91 !important; color:#fff;
		}
		
		/** Menu Hover **/
		.site-navigation li:hover,
		#header .nav-menu li:hover {
                    background-color:#eaebeb; border-left:none !important;
		}
		.site-navigation li a:hover,
		#header .nav-menu li a:hover{ color:#333; }
			
		
                .menu-primary ul ul li{ margin: 0; }
                
		/** Drop down menu **/
		.menu-primary ul ul {  
			font-size:0.97em; 
			position :absolute; 
                        left: 0; top: 0;                        
			margin:0 !important; 
			z-index:1; 
			width:220px; 
			background:#888888;
			z-index:9999; 
			box-shadow: 4px 4px 0 0 rgba(49,49,46,0.3);
                        
                        display: none;
                        transition: transform 0.2s;
                        transform: translateX(50px);
		}
		
		.menu-primary ul ul li { display:block !important; float:none; position:relative; padding: 0; }
		.menu-primary ul ul li a { display:block; color:#fff !important; line-height:20px; padding:0.5em 0.8em; text-align: left !important; }
		.menu-primary ul ul li a:last-child { border-bottom:none; }
		.menu-primary ul ul li a:hover { background:#1b5b91 !important; color:#fff; }
		
		
		/** Drop down menu appear **/
		.menu-primary ul li:hover > ul {                     
                    left:100%;
                    display: block;
                    transform: translateX(0px);                    
                }		
		.menu-primary li:hover ul li a{ background:none;}		
		.menu-primary ul ul li:hover{ background:none;border:none !important; }
		
		/** Second level dropdown menu **/
		.menu-primary ul ul ul { left:0; top:0; background:#666565; border-top:none !important; }		
		.cbp-spmenu-push-toright {
                    left: 0px;
		}	
				
	}
	
	/* big screen */
	@media only screen and (min-width: 1220px) {

	}
	
	@media only screen and (min-width: 1420px) {
					
	}