/* ================================================================ 
This copyright notice must be kept untouched in the stylesheet at 
all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/css3-slideout.html
Copyright (c) 2005-2009 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

.holder {width:200px;} /*adjust this smaller when using with Framed paged no scroll*/
/*.holder img.vogue {float:left; padding-right:20px;}*/

.navigation { width:130px; height:200px; padding:0px 0 0 5px; margin-right:20px; float:left;}
.backing {padding:0; margin:0; list-style:none; position:relative; z-index:50; width:20px;}/*width is how close to it before it opens up. moves whole buttons with backgroud image*/
.backing table {border-collapse:collapse; padding:0; margin:-1px 0 -5px -1px;}

.pageHolder .page {width:0; height:750px;/*to adjust the black line to the left adjust the heitht */ background:url(images/paper-rotated2.gif) no-repeat right top; position:absolute; z-index:-1; top:-100px; /* border-left:3px solid #333; to kill the line on left temporarly*/  -webkit-transition-duration: .4s; -moz-transition-duration: .4s; -o-transition-duration: .4s;}
.slide {padding:0; margin:0; list-style:none; width:130px; position:relative; z-index:100;}
.slide li.nosub {height:45px; position:relative;}
.slide li div.section {position:absolute; left:145px; top:-80px; width:0; overflow:hidden; height:800px;}	
		.slide li div.section1 {position:absolute; left:140px; top:-60px; width:0; overflow:hidden; height:800px;}
		.slide li div.section2 {position:absolute; left:120px; top:-60px; width:0; overflow:hidden; height:800px;}
.slide li a {display:block; width:110px; height:45px; line-height:42px; padding:0 20px 0 0; text-align:right; text-decoration:none; font-family:arial, sans-serif; color:#fff; font-size:14px; -webkit-transition-duration: .2s; -moz-transition-duration: .2s; -o-transition-duration: .2s; }
.slide li a b {display:block; width:130px; height:45px; position:absolute; left:0; background:url(images/tab.png) no-repeat right top; z-index:-1; -webkit-transition-duration: .2s; -moz-transition-duration: .2s; -o-transition-duration: .2s; }
.slide li div.section dl {width:0; float:left; padding:40px 0px 0px 10px; margin:0 130px 0 0; overflow:hidden; height:220px; -webkit-transition-duration: .3s; -moz-transition-duration: .3s; -o-transition-duration: .3s;}
		.slide li div.section1 dl {width:0; float:left; padding:5px 0px 0px 0px; margin:10px 130px 0px 0px; overflow:hidden; height:820px; -webkit-transition-duration: .3s;-moz-transition-duration: .3s;-o-transition-duration: .3s;}
		.slide li div.section2 dl {width:0; float:left; padding:25px 120px 0px 25px; margin:0px 130px 0px 0px; overflow:hidden; height:820px; -webkit-transition-duration: .3s;-moz-transition-duration: .3s;-o-transition-duration: .3s;}
.slide dt {padding:0 0 0 10px; margin:0; font-family:arial, sans-serif; font-size:18px; font-weight:bold; white-space:nowrap; height:20px; line-height:20px; color:#fc0;}
.slide dd {padding:0; margin:0; text-align:left; font-size:20px; /*added increse text size*/ }
.slide dd a {width:80px; height:35px; line-height:20px; text-align:left; background:transparent; font-size:18px; font color:#fff; padding:0 0 0 10px; white-space:nowrap;} 
      .slide ddb a {width:80px; height:35px; line-height:10px; text-align:left; background:transparent; font-size:18px; font color:#fff; padding:0 0 0 10px; white-space:nowrap;} 
.slide dd a:hover {color:#fc0;}

.backing li:hover div.page {width: 500px;} /*Moves paper background left or right*/
.backing li a.lv1-a:hover {direction:ltr;}
.backing li a.lv1-a:hover div.page {width:490px;}

.slide li:hover a {width:130px;}
.slide li:hover a b {width:150px;}
.slide li a:hover {width:130px;}
.slide li a:hover b {width:150px;} /*Moves Buttons left or right*/

.backing li:hover .slide li:hover {background:url(images/trans.gif);}

.backing li:hover .slide li:hover a {width:130px;} /*Moves text with buttons left or right*/
.backing li a.lv1-a:hover .slide li a:hover {width:130px;}

.slide li:hover div.section {width:330px; background:url(images/trans.gif);}
.slide li a:hover div.section  {width:330px; background:url(images/trans.gif);}
		.slide li:hover div.section1 {	width:300px; background:url(images/trans.gif);}
		.slide li a:hover div.section1 {width:300px; background:url(images/trans.gif);}
		.slide li:hover div.section2 {	width:300px; background:url(images/trans.gif);}
		.slide li a:hover div.section2 {width:300px; background:url(images/trans.gif);}


.slide li:hover div dl { /*Width of colums of links and images shown*/ width:140px; /*Width Between colums*/ margin-right:10px; -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s;}
.backing li a.lv1-a:hover .slide li a:hover div dl {width:110px; margin-right:20px;}
.backing li a.lv1-a:hover .slide li a:hover div dl dt {color:#fc0; text-align:left;}

p.txt {padding:5px 0; margin:0; line-height:20px; font-family:"trebuchet ms", sans-serif; font-size:12px; color:#456}
p.txt span {display:block; font-size:55px; padding:0; font-family:georgia, serif; color:#456}

