body.ui-body-c {
  background: #c8beb6;
}
.content_edition_toc .toc-edition-entry-0 { background: #ebe8e5 }
.content_edition_toc .toc-edition-entry-1 { background: #FFF }
.content_edition_toc .toc-edition-title a, .content_edition_toc .toc-edition-title a:link,  .content_edition_toc .toc-edition-title a:visited { color: #000; }
.content_edition_toc .toc-edition-title a:hover { text-decoration: none }

#app-actions, #app-actions-popup {
	transition: right 0.2s linear, top 0.2s linear; -webkit-transition: right 0.2s linear, top 0.2s linear; -moz-transition: right 0.2s linear, top 0.2s linear;
}
#app-actions { z-index: 4; top: 0; left: auto; right: 0; text-align: right; width: 28px; height: auto; line-height: 18px; background: #FFFFFF; }
#app-actions a.control { background: none; border: none; text-indent: -9999px; overflow: hidden; display: block; width: 30px; height: 30px; font-size: 13px; margin: 0 3px 0 3px; cursor: pointer }
#app-actions #button-editions { background: url('../images/bt_editions.png') }
#app-actions #button-editions:hover { background: url('../images/bt_editions_hover.png') }
#app-actions #button-subscribe { background: url('../images/bt_newsletter_subscribe.png') }
#app-actions #button-subscribe:hover { background: url('../images/bt_newsletter_subscribe_hover.png') }
#app-actions #button-share { background: url('../images/bt_share.png') }
#app-actions #button-share:hover { background: url('../images/bt_share_hover.png') }
#app-actions #button-tellafriend { background: url('../images/bt_tell_a_friend.png') }
#app-actions #button-tellafriend:hover { background: url('../images/bt_tell_a_friend_hover.png') }
#app-actions #button-contact { background: url('../images/bt_contact.png') }
#app-actions #button-contact:hover { background: url('../images/bt_contact_hover.png') }
#app-actions .ui-btn, #app-editcontrols .ui-btn { margin: 0 }
#app-actions-popup { z-index: 5; top: 0; left: auto; right: 28px; width: auto; height: auto; position: absolute; display: none; }
#app-create-buttons {  }
#app-foldoutmenu { position: absolute; z-index: 2 }
#xs_editpreview_topmenu { position: relative; z-index: 5; height: 35px !important }
#app-editcontrols .ui-btn { float: left; margin-right: 4px }
#app-actions-popup.app-actions-popup-active { background: #fff; width: 380px; display: block; box-shadow: 0 1px 2px #999; padding: 10px   }

/* landscape template conditions */
.body-horizontal #app-actions, .body-horizontal #app-actions-popup { top: 0; right: 0 }
/* fluid template conditions */
.body-fluid #app-actions, .body-fluid #app-actions-popup { top: 0; }
.body-fluid.version-edit #app-actions, .body-fluid.version-edit #app-actions-popup { top: 0; }
.body.nomenu #app-actions { display: none }

#app-actions .sharebuttons { padding: 0 10px }
#app-actions .sharebuttons .sharebuttons_inner a { display: block; margin-bottom: 10px; padding: 0; font-size: 14px; font-weight: normal; text-decoration: none }
#app-actions .sharebuttons .sharebuttons_inner a img, #app-actions.left .sharebuttons .sharebuttons_inner a span { vertical-align: middle }
#app-actions .sharebuttons .sharebuttons_inner a span { padding-left: 10px }
#app-actions .sharebuttons .sharebuttons_inner a:link, #app-actions.left .sharebuttons .sharebuttons_inner a:visited, #app-actions.left .sharebuttons .sharebuttons_inner a:hover  { color: #000 }

/* control tooltip */
#app-actions-tooltip { position: absolute; top: 0; font-size: 160%; line-height: 160%; background: url('../images/actions_tooltip_images.png') no-repeat top left white; background-position: 20px 25px; min-height: 210px; color: #000; padding: 20px 25px 25px 80px; z-index: 99; width: 170px; -webkit-box-shadow: 0 0 10px black; -moz-box-shadow: 0 0 10px black; box-shadow: 0 0 10px black }
#app-actions-tooltip .app-actions-tooltip-close { position: absolute; top: 0; right: 5px; color: #333; font-size: 16px }
#app-actions.right #app-actions-tooltip:before { content: "\25B6"; float: right; font-size: 64px; margin: 0 -40px 0 0; color: white  }
#app-actions.left #app-actions-tooltip:before { content: "\25C2"; float: left; font-size: 64px; margin: 0 0 0 -95px; color: white  }
#app-actions.right #app-actions-tooltip { top: 10px; right: 100%; margin-right: 70px }
#app-actions.left #app-actions-tooltip { top: 10px; left: 100%; margin-left: 70px }


/* mobile adjustments */
#app-actions.topright {
	height: 100%; z-index: 1200; top: 0; right: 0;
	transition: right 0.2s linear, top 0.2s linear; -webkit-transition: right 0.2s linear, top 0.2s linear; -moz-transition: right 0.2s linear, top 0.2s linear;
}
#app-actions.topleft {
	height: 100%; z-index: 1200; top: 0; left: 0; right: auto;
	transition: left 0.2s linear, top 0.2s linear; -webkit-transition: left 0.2s linear, top 0.2s linear; -moz-transition: left 0.2s linear, top 0.2s linear;
}
#app-actions.top {
	width: 100%; z-index: 1200; top: 0; left: 0; right: auto;
	transition: left 0.2s linear, top 0.2s linear; -webkit-transition: left 0.2s linear, top 0.2s linear; -moz-transition: left 0.2s linear, top 0.2s linear;
}
#app-actions.left {
	height: 100%; z-index: 1200; top: 0; left: 0;
	-webkit-transition: left 0.5s ease-in-out, top 0.5s ease-in-out; -moz-transition: left 0.5s ease-in-out, top 0.5s ease-in-out; transition: left 0.5s ease-in-out, top 0.5s ease-in-out;
}
#app-actions.right {
	height: 100%; z-index: 1200;  top: 0; right: 0;
	-webkit-transition: right 0.5s ease-in-out, top 0.5s ease-in-out; -moz-transition: right 0.5s ease-in-out, top 0.5s ease-in-out; transition: right 0.5s ease-in-out, top 0.5s ease-in-out;
}
#app-actions .button-hide { display: block; position: relative; width: 48px; height: 48px; font-size: 16px }
#app-actions .button-logo { display: block; background: #FFFFFF; background: rgba(255,255,255,0.7) }
#app-actions .buttons-additional .button-email { display: block; width: 48px; height: 48px; background: #FFFFFF url('/images/icons_light/bt_mail.png') no-repeat center center; background-color: rgba(255,255,255,0.7) }
#app-actions .buttons-additional .button-share { display: block; width: 48px; height: 48px; background: #FFFFFF url('/images/icons_light/bt_share.png') no-repeat center center; background-color: rgba(255,255,255,0.7) }
#app-actions .buttons-additional .button-content { text-align: center; background: #FFFFFF; background: rgba(255,255,255,0.7); display: block; padding-top: 5px; padding-bottom: 5px }
#app-actions #page-number { display: block; position: absolute; bottom: 0; width: 48px;  }
#app-actions #page-number .page-number-val { display: block; color: #000; text-align: center; padding-top: 14px; height: 34px; background: #FFFFFF; background: rgba(255,255,255,0.8); font-size: 14px; font-weight: bold }
#app-actions.top a { display: inline-block; margin-bottom: 0; margin-right: 5px; vertical-align: top }
#app-actions.top .button-hide { top: 110%; left: 0; padding-left: 10px; padding-top: 2px; color: #000  }
#app-actions.top .button-hide:before { content: "▲" }
#app-actions.top.hide { top: -48px }
#app-actions.top.hide .button-hide:before { content: "▼" }
#app-actions.topleft .button-hide { top: 0; left: 110%; padding-top: 10px; padding-left: 2px; color: #000  }
#app-actions.topleft .button-hide:before { content: "◀" }
#app-actions.topleft.hide { left: -48px }
#app-actions.topleft.hide .button-hide:before { content: "▶" }
#app-actions.topright .button-hide { top: 10px; right: 110%; padding-right: 2px; color: #000 }
#app-actions.topright .button-hide:before { content: "▶" }
#app-actions.topright.hide .button-hide:before { content: "◀" }
#app-actions.topright.hide { right: -48px }
/* autohide */
#app-actions.left .button-hide { background: url('../images/icons_light/bt_menu.png') no-repeat center center; background-color: #FFFFFF; background-color: rgba(255,255,255,0.7); }
#app-actions.left.hide .button-hide { background: url('../images/icons_light/bt_menu.png') no-repeat center center; background-color: #FFFFFF; background-color: rgba(255,255,255,0.7); }
#app-actions.right .button-hide { background: url('../images/icons_light/bt_menu.png') no-repeat center center; background-color: #FFFFFF; background-color: rgba(255,255,255,0.7); }
#app-actions.right.hide .button-hide { background: url('../images/icons_light/bt_menu.png') no-repeat center center; background-color: #FFFFFF; background-color: rgba(255,255,255,0.7); }
/* conditions for panels that are split into halves of screen */
body.mobile .panel-bottom {
	background: #FFFFFF; background: rgba(255,255,255,0.7); z-index: 99; position: absolute; bottom: 0; left: 0; width: 100%; height: auto;
	transition: left 0.2s linear, top 0.2s linear, bottom 0.2s linear; -webkit-transition: left 0.2s linear, top 0.2s linear, bottom 0.2s linear; -moz-transition: left 0.2s linear, top 0.2s linear;
}
body.mobile .panel-bottom.panel-hide { bottom: -200px; }
body.mobile .panel-bottom .content_edition_toc { min-height: 126px; white-space: nowrap }
body.mobile .panel-bottom .content_edition_toc h2 { display: none }
body.mobile .panel-bottom .content_edition_toc .toc-edition-cover, body.mobile .panel-bottom .content_edition_toc .toc-edition-page { clear: none; display: inline-block; width: auto; margin-right: 10px; margin-bottom: 0; padding-bottom: 0 }
body.mobile .panel-bottom .content_edition_toc .mCSB_horizontal .mCSB_container { margin-bottom: 20px }
body.mobile .panel-bottom .content_edition_toc .mCSB_horizontal .mCSB_container.mCS_no_scrollbar { margin-bottom: 0 }
/* the autohide sliding panel styling */
#app-actions .part-top { z-index: 2; position: absolute; top: 10px; left: 0; height: 40px; width: 100%; text-align: center }
#app-actions .container { z-index: 1; position: absolute; height: 100%; width: 100%; left: 0; bottom: 50px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; padding-top: 90px; overflow: visible; overflow-y: hidden; background: none }
#app-actions .container_inner { position: absolute; width: 100%; height: 100%; overflow: visible; overflow-y: hidden;  }
#app-actions .part-bottom { padding-top: 10px; z-index: 2; position: absolute; bottom: 10px; left: 5%; height: 30px; width: 90%; text-align: center }
#app-actions .autohide-panel { color: #000; height: 100%; overflow-y: hidden; padding-bottom: 110px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;  }
#app-actions .autohide-panel .panel-scroll-wrap { padding-bottom: 130px; height: 100%; overflow-y: hidden; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box }
#app-actions .content_edition_toc, #app-actions .content_tell_a_friend { height: 100%; position: absolute }
#app-actions .divgumbuttons { display: block }
