/***********************************************************************************************************************
DOCUMENT: style/format.css
DEVELOPED BY: Ryan Stemkoski
COMPANY: Zipline Interactive
EMAIL: ryan@gozipline.com
PHONE: 509-321-2849
DATE: 2/26/2009
DESCRIPTION: This document contains the structural formatting files for the accordion style menu.
************************************************************************************************************************/
.nav2 {width:94%; margin:40px auto 0 auto; background:url(../images/bg-navigation2.png) no-repeat right top; padding-right:8px;}
.nav2 ul {float:left; margin:0px; padding:0px; width:100%;}
.nav2 ul li.btn {width:100%; background:url(../images/bg-nav-btn.png) no-repeat right bottom #fff; list-style:none; width:100%; color:#000; font-size:26px; height:70px; cursor:pointer;}
.btn-txt {float:left; margin:22px 35px 0 35px;}
.nav2 ul li.con {width:100%; background:#3B456E; list-style:none; width:100%; color:#fff; font-size:23px; line-height:27.6px; padding-bottom:20px;}
.nav2 ul li.con a {color:#fff; text-decoration:none;}
.nav2-bot {width:94%; height:23px; margin:0 auto; background:url(../images/bg-nav2-bot.png) left top; padding-right:8px; border-bottom-radius:3px 3px 3px #333;}
.nav2 ul li.on {
	background:url(../images/bg-nav-btn-on.png) no-repeat right bottom #fff; 
	}
.nav2 ul li.con span.btn1 {background:url(../images/bg-btn1.png) repeat-x; border:1px solid #B8BFE4; color:#000; font-size:18px; padding:6px 8px; text-decoration:none; border-radius:4px; transition:all .3s ease-in-out; -moz-transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.nav2 ul li.con:hover span.btn1{background:url(../images/bg-btn1.png) repeat-x 0 -20px;}


@media only screen and (max-width: 480px){
.nav2 ul li.btn {width:100%; background:url(../images/bg-nav-btn.png) no-repeat right center #fff;  list-style:none; width:100%; color:#000; font-size:20px; height:54px; cursor:pointer;}
.btn-txt {float:left; margin:16px 15px 0 15px;}
.nav2 ul li.con {width:100%; background:#3B456E; list-style:none; width:100%; color:#fff; font-size:16px; line-height:20px; padding-bottom:20px;}
.nav2 ul li.on {
	background:url(../images/bg-nav-btn-on.png) no-repeat 0 5px #fff; 
	}
.nav2 ul li.con span.btn1{background:url(../images/bg-btn1.png) repeat-x; border:1px solid #B8BFE4; color:#000; font-size:18px; padding:6px 8px; text-decoration:none; border-radius:4px; transition:all .3s ease-in-out; -moz-transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.nav2 ul li.con:hover span.btn1 {background:url(../images/bg-btn1.png) repeat-x 0 -20px;}

}
@media only screen and (max-width: 360px){
.nav2 {width:92%; margin:40px auto 0 auto; background:url(../images/bg-navigation2.png) no-repeat right top; padding-right:8px;}
.nav2 ul li.btn {width:100%; background:url(../images/bg-nav-btn2.png) no-repeat right bottom #fff; list-style:none; width:100%; color:#000; font-size:17px; height:54px; cursor:pointer;}
.nav2 ul li.con {width:100%; background:#3B456E; list-style:none; width:100%; color:#fff; font-size:14px; line-height:17.6px; padding-bottom:20px;}
.nav2 ul li.on {
	 background:url(../images/bg-navigation2.png) no-repeat  right top;
	}
.nav2 ul li.on {
	background:url(../images/bg-nav-btn2-on.png) no-repeat right bottom #fff; 
	}
.nav2 ul li.con span.btn1 {background:url(../images/bg-btn1.png) repeat-x; border:1px solid #B8BFE4; color:#000; font-size:16px; padding:4px 8px; text-decoration:none; border-radius:4px; transition:all .3s ease-in-out; -moz-transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out; margin-top:5px;}
.nav2 ul li.con:hover span.btn1 {background:url(../images/bg-btn1.png) repeat-x 0 -20px;}

.nav2-bot {width:92%; height:23px; margin:0 auto; background:url(../images/bg-nav2-bot.png) left top; padding-right:8px; border-bottom-radius:3px 3px 3px #333;}
}
	
/***********************************************************************************************************************
 EXTRA STYLES ADDED FOR MOUSEOVER / ACTIVE EVENTS
************************************************************************************************************************/


	
.over {
	background: #CCCCCC;
	}