@charset "utf-8";
/* CSS Document */




/*** Styles for the transitioning menu **/

.menu {display:none; 
	/*-webkit-transition: width 2s;*/ /* For Safari 3.1 to 6.0 */
	-webkit-transition-duration: 2s;
}

.menu-second-level-ul li > ul {display: none !important;}


@media screen and (max-width: 800px) and (orientation: landscape) {
	
	.menu {
    /*width: 55px;*/
    width: 100%;
    height: 40px;
    background: black;
    /*-webkit-transition: width 2s;*/ /* For Safari 3.1 to 6.0 */
	/*-webkit-transition-duration: 2s;*/
    /*transition: width 2s, height 2s;*/
	-webkit-transition: height 2s; /* For Safari 3.1 to 6.0  - by Jack 1/22/2017*/
    transition: height 2s;
    z-index:1;
    /*overflow: auto;*/
     right:0px;
    top:20px;
	display:block;
	text-align:justify;
    .menu-close {color:black;}
}

.menu  ul {display:none;}
.menu:hover {
    /*width: 500px;
    height: 200px;*/
    /*width: 23em;*/
   /* height: 400px;*/
	height: 30em;
    background: #b3b3b3;
    z-index:1;
    opacity: 0.9;
	overflow: auto;
    
}
.menu:hover ul {
     display:block;
     text-align:center;
	 
     
}
  .menu {color:white;font-weight:bold;}
  .menu > ul {list-style-type:none;z-index:1;font-family:Arial, Helvetica, sans-serif;}
  /*.jack {z-index:-1;}*/
  .menu  ul {list-style-type:none;display:none;font-size:2.5em;}
  .menu  ul li a {text-decoration:none;color:white;}
  .menu  ul li a:hover {color:#804d00;}

  .menu_listitem-color {color:#804d00;}
  
  .menu_listitem-social {
	margin-left: -70px;
  }

  #contribtopnav {display:none;}
  
   
	/*#leftnav ul li:hover ul {display:block !important; }  This is an example*/
	.menu-second-level-ul li:hover ul {display: block !important; margin-left:50px;}
	.menu-second-level-ul li ul li {font-size:20px;color:#804d00; text-align:center;}
    /*.menu-second-level-ul li ul li a {font-size:30px;}*/
	
	 .menu-close {color:black !important; font-size:25px !important; margin-top:-20px !important;}
	.menu-close:hover {color: #666 !important; font-size:25px !important;}
	
}
@media screen and (min-width: 400px) and (max-width: 600px) and (orientation: portrait) {
/*@media screen and (max-width: 600px) and (orientation: portrait) {*/
	
	.menu {
    /*width: 55px;*/
    width: 100%;
    height: 40px;
    background: black;
    /*-webkit-transition: width 2s;*/ /* For Safari 3.1 to 6.0 */
	/*-webkit-transition-duration: 2s;*/
    /*transition: width 2s, height 2s;*/
	-webkit-transition: height 2s; /* For Safari 3.1 to 6.0  - by Jack 1/22/2017*/
    transition: height 2s;
    z-index:1;
    /*overflow: auto;*/
     right:0px;
    top:20px;
    display:block;
	text-align:justify;
	}
	
	.menu  ul {display:none;}

	.menu:hover {
    /*width: 500px;
    height: 200px;*/
    /*width: 23em;*/
   /* height: 400px;*/
	height: 30em;
    background: #b3b3b3;
    z-index:1;
    opacity: 0.9;
	overflow: auto;
    
	}
	.menu:hover ul {
     display:block;
     text-align:center;
     
	}
  	.menu {color:white;font-weight:bold;}
  	.menu > ul {list-style-type:none;z-index:1;font-family:Arial, Helvetica, sans-serif;}
  	/*.jack {z-index:-1;}*/
  	.menu  ul {list-style-type:none;display:none;font-size:2.5em;}
  	.menu  ul li a {text-decoration:none;color:white;}
  	.menu  ul li a:hover {color:#804d00;}

  	.menu_listitem-color {color:#804d00;}
	
	.menu_listitem-social {
	   margin-left: -70px;
    }

     #contribtopnav {display:none;}
	 
	 
	/*#leftnav ul li:hover ul {display:block !important; }  This is an example*/
	.menu-second-level-ul li:hover ul {display: block !important; margin-left:50px; }
	.menu-second-level-ul li ul li {font-size:20px;color:#804d00; text-align:center;}
    /*.menu-second-level-ul li ul li a {font-size:30px;}*/
    
     .menu-close {color:black !important; font-size:25px !important; margin-top:-20px !important;}
	.menu-close:hover {color: #666 !important; font-size:25px !important;}
	
  
}

@media screen and (min-width: 300px) and (max-width: 399px) and (orientation: portrait) {
	
	.menu {
    /*width: 55px;*/
    width: 100%;
    height: 40px;
    background: black;
   /* -webkit-transition: width 2s;*/ /* For Safari 3.1 to 6.0 */
	/*-webkit-transition-duration: 2s;*/
    /*transition: width 2s, height 2s;*/
	-webkit-transition: height 2s; /* For Safari 3.1 to 6.0  - by Jack 1/22/2017*/
    transition: height 2s;
    z-index:1;
    /*overflow: auto;*/
     right:0px;
    top:20px;
    display:block;
	
	}
	
	.menu  ul {display:none;}

	.menu:hover {
    /*width: 500px;
    height: 200px;*/
    /*width: 23em;*/
   /* height: 400px;*/
	height: 30em;
    background: #b3b3b3;
    z-index:1;
    opacity: 0.9;
	overflow: auto;
    
	}
	.menu:hover ul {
     display:block;
     text-align:center;
	
	}
	
  	.menu {color:white;font-weight:bold;}
  	.menu > ul {list-style-type:none;z-index:1;font-family:Arial, Helvetica, sans-serif;}
 	 /*.jack {z-index:-1;}*/
 	.menu  ul {list-style-type:none;font-size:2.5em; text-align:justify;}
  	.menu  ul li a {text-decoration:none;color:white;}
  	.menu  ul li a:hover {color:#804d00;}

  	.menu_listitem-color {color:#804d00;}
	
	.menu_listitem-social {
	  margin-left: -70px;
    }

     #contribtopnav {display:none;}
	 
	/*#leftnav ul li:hover ul {display:block !important; }  This is an example*/
	.menu-second-level-ul li:hover ul {display: block !important; margin-left:50px;}
	.menu-second-level-ul li ul li {font-size:20px;color:#804d00; text-align:center;}
    /*.menu-second-level-ul li ul li a {font-size:30px;}*/
  
     .menu-close {color:black !important; font-size:25px !important; margin-top:-20px !important;}
	.menu-close:hover {color: #666 !important; font-size:25px !important;}
	
  
}



/*** End Mobile Friendly CSS ***/