﻿.wrapper{
width:500px;
}

.clear{
	clear:both;
}

/****** FadeContent CSS  *****/
.fadecontentwrapper{ /* Total width: 350px+5px+5px=360px Read relative width relations for the other two containers below! */
position: relative;
width: 500px;
min-height: 300px; /* Set height to be able to contain height of largest content shown*/
height:420px;
border: 1px solid orange;
overflow: hidden;
}

.fadecontent{ /*style for each fade content DIV within wrapper. Total width: 330px+10px+10px=350px (".fadecontentwrapper" width minus its padding and borders, if any) */
position: absolute;
background: #F7F6F3;
padding: 10px;
visibility: hidden;
width: 480px;
}

.fadecontenttoggler{ /*style for DIV used to contain toggler links. Total width: 350px+5px+5px=360px */
width: 500px;
border: 1px solid orange;
border-top-width: 0;
overflow: hidden;
background:#F38E3C;
color: white;
height:20px;
text-align:center;
}

.capsule{
	text-align:center;
	height:20px;
	margin:0 0 0 2px;
}

.fadecontenttoggler a{ /*style for every navigational link within toggler */
float:left;
text-decoration: none;
border-left: 1px solid orange;
padding: 3px 19px 0 20px;
display: block;
color: white;
font-family:Arial, Helvetica, sans-serif;
height:20px;
text-align:center;
}

.fadecontenttoggler a:hover{
background: #646462;
color: white;
text-decoration:none;
}

.fadecontenttoggler a.toc{ /*style for individual toggler links (page 1, page 2, etc). ".toc" class auto generated! */
color:white;
}

.fadecontenttoggler a.prev, .fadecontenttoggler a.next{ /*style for "prev" and "next" toggler links. ".prev" and ".next" classes auto generated! */
color: black;
}

.fadecontenttoggler a.prev:hover, .fadecontenttoggler a.next:hover{
color: white;
background: black;
}

.fadecontenttoggler a.selected{ /*style for selected page's toggler link. ".selected" class auto generated! */
background:#808080;
color: white;
text-decoration:none;
}

/******End of Fade Content*********/

/****** Start of peeler **********/

#pageflip {
	position: relative;
}
#pageflip img {
	width: 50px; height: 52px;
	z-index: 120;
	position: absolute;
	right: 0; top: 0;
	-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
	width: 50px; height: 50px;
	position: absolute;
	right: 0; top: 0;
	background: url('../../images/egnc/2nd_main_back.png') no-repeat right top;
	text-indent: -9999px;
}


/******** End of Peeler *********/