/**
	* screen.css for large mode (desktop / tablets)
	*
	* @author Michael Stamm, KWP Communications <m.stamm@kwp-communications.com>
	* @version 1.0
	* @timestamp 2014-07-17
	*/

* {
	-webkit-text-size-adjust: none;
}

html, body {
	margin: 0;
	padding: 0;
	height: 100%;
	border: 0 none;
}

body {
	background: url(../images/screen/throbber-01.gif) #ffffff center center no-repeat scroll;
}

body.pageReady {
	background-image: none;
}

.anchor {
	cursor: pointer;
}

#pageCanvas {
	width: 100%;
	height: 100%;
}

#pageCanvas:after {
	content: '.';
	clear: both;
	height: 0;
	max-height: 0;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
}

#pageFrame {
	margin: 0 auto 0 auto;
	max-width: 948px;
	width: 948px;
}

#pageHead {
	position: relative;
	height: 116px;
}

#pageLogo {
	position: absolute;
	top: 28px;
	left: 0;
}

#pageLogo,
#pageLogo a,
#pageLogo img {
	display: block;
	width: 194px;
	height: 29px;
}

#pageHead .mainNav {
	position: absolute;
	top: 10px;
	right: -18px;
	text-align: right;
	white-space: nowrap;
	font-size: 0;
}

#pageHead .mainNav > li {
	display: inline-block;
	padding-right: 18px;
	padding-left: 19px;
	background: url(../images/content/icon-list-gutter-01.png) transparent 0 10px no-repeat scroll;
	color: #707173;
	font-size: 15px;
	font-family: Verdana, sans-serif;
	line-height: 22px;
}

#pageHead .mainNav > li:first-child {
	background-image: none;
	cursor: pointer;
}

#pageBody {
	position: relative;
}

.navLevel1Frame {
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 33px;
	background: url(../images/content/level-2-nav-bg-left-01.png) #002663 left top no-repeat scroll;
}

.navLevel1 {
	display: block;
	margin: 0;
	padding: 0 10px 0 10px;
	height: 33px;
	background: url(../images/content/level-2-nav-bg-right-01.png) transparent right top no-repeat scroll;
}

/* MERGE */
/*       */
.navLevel1 > li {
	display: block;
	float: left;
	padding: 7px 4px 0 18px; /* 30px -> 25px -> 25px */
	height: 26px;
	color: #ffffff;
	font-weight: bold;
	font-size: 14px;
	font-family: Verdana, sans-serif;
	line-height: 16px;
}
/*       */
/* MERGE */

.navLevel1Frame .calculatorButton {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 10;
	padding: 11px 0 0 10px;
	width: 109px;
	height: 59px;
	background: url(../images/content/level-2-nav-button-01.png) transparent 0 0 no-repeat scroll;
	color: #002663;
	font-weight: bold;
	font-size: 16px;

	font-family: Verdana, sans-serif;
	line-height: 22px;
}

.navLevel1 > li.active {
	color: #ccccd9;
}

#gCrossfader {
	position: relative;
}

#gCrossfader > .gFadeBox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

.sliderLevel1 {
	width: 942px;
	height: 477px;
}


/*.orange {
	color: orange;
}

.blue {
	color: cornflowerblue;
}

li.active {
	color: red;
}*/


.navBox,
.navBox > ul {
	margin: 0;
	padding: 0;
	height: 52px;
	text-align: center;
	font-size: 0;
}

.navBox > ul > li {
	display: inline-block;
	margin-left: 6px;
	padding: 5px;
	width: 69px;
	height: 42px;
	background: url(../images/content/nav-level-3-bg-01.png) transparent 0 0 no-repeat scroll;
}

.navBox > ul > li:first-child {
	margin-left: 0;
}

.navBox > ul > li.active {
	background-position: 0 -52px;
}

.navBox > ul > li > span {
	display: table-cell;
	width: 69px;
	height: 42px;
	color: #002663;
	vertical-align: middle;
	text-align: center;
	font-weight: bold;
	/*font-size: 12px;*/
	font-size: 10px;
	font-family: Verdana, sans-serif;
	line-height: 14px;
}




.asideBox {
	-moz-transform: perspective(0px);

	-ms-transform: perspective(0px);
	-webkit-perspective: 0;
	-moz-perspective: 0;
	-ms-perspective: 0;
	perspective: 0;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;

}

/* START: Accommodating for IE */
	.asideBox.turned .sideB {
	-webkit-transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	-o-transform: rotateY(0deg);
	transform: rotateY(0deg);
}

.asideBox.turned .sideA {
	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	transform: rotateY(180deg);
}

/* END: Accommodating for IE */

.asideBox, .sideA, .sideB {
	width: 302px;
	height: 430px;
	overflow-y: auto;
	overflow-x: hidden;
	scrollbar-width: thin;
	padding-right: 10px;
}

.flipCard {

	position: relative;
	-webkit-transition: 0.6s;

	-moz-transition: 0.6s;
	-ms-transition: 0.6s;

	transition: 0.6s;
	-moz-transform: perspective(0px);
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.sideA, .sideB {

	position: absolute;
	top: 0;
	left: 0;

	background: url(../images/content/flipper-card-bg-01.png) transparent 0 0 no-repeat scroll;

	-webkit-transition: 0.6s;

	-moz-transition: 0.6s;

	-ms-transition: 0.6s;

	-o-transition: 0.6s;

	transition: 0.6s;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.sideA {
	z-index: 2;
	-webkit-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
}

.sideB {
	-webkit-transform: rotateY(-180deg);
	-moz-transform: rotateY(-180deg);
	-ms-transform: rotateY(-180deg);
	-o-transform: rotateY(-180deg);
	transform: rotateY(-180deg);
}

.uaIE11.uaWindows10 .sideA,
.uaIE11.uaWindows10 .sideB,
.uaIE11.uaWindows10 .flipCard {
	transition: none;
}

/*.uaIE11 .sideA,
.uaIE11 .sideB,
.uaIE11 .flipCard,
.uaEdge .sideA,
.uaEdge .sideB,
.uaEdge .flipCard {
	transition: none;
}*/

.lte9 .sideA,
.lte9 .turned .sideB,
.uaIE11.uaWindows10 .sideA,
.uaIE11.uaWindows10 .turned .sideB {
/*.uaIE11 .sideA,
.uaIE11 .turned .sideB,
.uaEdge .sideA,
.uaEdge .turned .sideB {*/
	display: block;
}

.lte9 .turned .sideA,
.lte9 .sideB,
.uaIE11.uaWindows10 .turned .sideA,
.uaIE11.uaWindows10 .sideB {
/*.uaIE11 .turned .sideA,
.uaIE11 .sideB,
.uaEdge .turned .sideA,
.uaEdge .sideB {*/
	display: none;
}

/* ---------- flexslider start ---------- */

.flexslider {
	height: 500px;
	/*color: #fff; */
}

.flex-direction-nav a:before {
	display: none;
}

.flex-direction-nav a {
	top: 0;
	margin: 0;
	height: 100%;
	background-color: transparent;
	font-size: 0;
	line-height: 0;
	opacity: 1;
	transition: none 0s ease 0s;
}
.flex-direction-nav .flex-prev {
	left: 0;
}

.flex-direction-nav .flex-next {
	right: 0;
}

/* ---------- flexslider end ---------- */

/* ---------- Formslider start ---------- */

.formsliderWrapper {
	position: relative;
	width: 960px;
}

.formslider {
	margin-right: 0;
	margin-left: auto;
	width: 960px;
	height: 540px;
	font-family: Verdana, Arial, sans-serif;
}

.formslider .flex-direction-nav.invisible {
	display: none;
}

.formslider .flex-direction-nav a {
	display: table;
	margin-top: 500px;
	width: 40px;
	height: 40px;
	-webkit-background-size: 26px 26px;
	background-size: 26px 26px;
	text-align: center;
	text-shadow: none;
	/* background: none no-repeat center 490px transparent scroll; */
	background: none no-repeat center top transparent scroll;
}

.formslider .flex-direction-nav .flex-prev {
	background-image: url(../assets/images/formslider/direction-nav-prev-01-01.png);
}

.formslider .flex-direction-nav .flex-next {
	background-image: url(../assets/images/formslider/direction-nav-next-01-01.png);
}

.ie8 .formslider .flex-direction-nav .flex-prev {
	background-image: url(../assets/images/formslider/direction-nav-prev-01-02.png);
}

.ie8 .formslider .flex-direction-nav .flex-next {
	background-image: url(../assets/images/formslider/direction-nav-next-01-02.png);
}

.formslider .flex-direction-nav a:hover {
	text-decoration: none;
}

.formslider .slides li {
	position: relative;
	margin: 0;
	padding-left: 0;
	background-image: none;
	font-size: 0;
	line-height: 0;
	height: 540px;
	background-color: #fff;
}

.formslider .flex-direction-nav i {
	display: table-cell;
	width: 100%;
	height: 100%;
	color: #fff;
	vertical-align: middle;
	font-size: 40px;
	line-height: 40px;
}

.formslider-nav-wrapper {
	overflow: hidden;
	width: 960px;
}

.formslider-nav {
	margin-bottom: 0;
	width: 963px;
	font-size: 0;
	line-height: 0;
}

.formslider-nav > li {
	display: inline-block;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	margin-right: 1px;
	padding: 0;
	width: 319px;
	height: 30px;
	background-color: #b3b1b1;
	background-image: none;
	cursor: pointer;
}

.formslider-nav > li.flex-active {
	background-color: #0063be;
}

.formslider-nav .label {
	display: table;
	width: 100%;
	height: 100%;
}

.formslider-nav .text {
	display: table-cell;
	color: #fff;
	vertical-align: middle;
	text-align: center;
	font-size: 14px;
	line-height: 14px;
}

.formslider-nav i {
	display: none;
	padding-left: 10px;
}

.formslider .slides img {
	width: auto;
}


/* ---------- Formslider end ---------- */

/* ---------- Form pages start ---------- */
.formPage {
	position: absolute;
	top: 0;
	right: 0;
}

.formPage01,
.formPage03 {
	width: 540px;
}

.formPage02 {
	display: none;
}

.formPage02.show {
	display: block;
	width: 960px;
	height: 540px;
}

.formPage02 .scrolleableArea {
	position: absolute;
	top: 0;
	right: 0;
}

.formPage .scrolleableArea {
	padding: 20px 20px 0px 20px;
	width: 500px;
	height: 520px;
	background-color: transparent;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.ie8 .formPage .scrolleableArea {
	overflow: auto;
}

.formPage .scrolleableArea .jspVerticalBar {
	right: 1px;
	/* display: none; */
	width: 8px;
	height: 90%;
	border-radius: 5px;
	background-color: transparent;
}

.formPage .scrolleableArea .jspTrack {
	background-color: transparent;
}

.formPage .scrolleableArea .jspDrag {
	border: 1px solid gray;
	border-radius: 5px;
	background-color: #002663;
}

.uaIPad .formPage .scrolleableArea,
.uaTablet .formPage .scrolleableArea {
	position: relative;
	overflow-y: auto;
/* 	-webkit-overflow-scrolling: touch; */
}

.uaIPad .formPage02 .scrolleableArea,
.uaTablet .formPage02 .scrolleableArea {
	position: absolute;
}

.formPage02 .content {
	vertical-align: top;
}

.formPage h2 {
	margin-bottom: 40px;
}

.formPage h3 {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.formPage fieldset h3 {
	display: inline-block;
	padding-right: 10px;
}

.formPage00 fieldset h3 {
	display: block;
	padding-right: 0;
}

.formPage h2 i {
	display: none;
	padding-left: 20px;
	vertical-align: middle;
	font-size: 16px;
	line-height: 32px;
}

.formPage fieldset {
	display: block;
	margin-bottom: 40px;
	font-size: 0;
	line-height: 0;
}

.formPage fieldset[editable="false"] {
	opacity: .5;
	pointer-events: none;
}

.formPage .marginBottom360 {
	margin-bottom: 360px;
}

.formPage .marginBottom120 {
	margin-bottom: 120px;
}

.formPage .marginBottom150 {
	margin-bottom: 150px;
}

.formPage .marginBottom160 {
	margin-bottom: 160px;
}

.formPage fieldset.marginBottom0 {
	margin-bottom: 0;
}

.formPage fieldset.marginBottom20 {
	margin-bottom: 20px;
}

.formPage fieldset.marginBottom30 {
	margin-bottom: 30px;
}

.formPage fieldset.marginBottom40 {
	margin-bottom: 40px;
}

.formPage fieldset.marginBottom50 {
	margin-bottom: 50px;
}

.formPage fieldset.marginBottom60 {
	margin-bottom: 60px;
}

.formPage fieldset.marginBottom80 {
	margin-bottom: 80px;
}

.formPage fieldset.marginBottom90 {
	margin-bottom: 90px;
}

.formPage fieldset.marginBottom100 {
	margin-bottom: 100px;
}

.formPage fieldset.marginBottom110 {
	margin-bottom: 110px;
}

.formPage fieldset.marginBottom120 {
	margin-bottom: 120px;
}

.formPage label {
	display: inline-block;
	padding-right: 10px;
	color: #000;
	vertical-align: top;
	font-size: 13px;
	line-height: 20px;
}

.formPage .promise {
	display: none;
}

.formPage .promise.visible {
	display: block;
}

.formPage .promise > span {
	display: inline-block;
	padding-right: 20px;
	color: #000;
	vertical-align: top;
	font-size: 13px;
	line-height: 20px;
}

.formPage .promise > span:last-child {
	padding-right: 0;
}

.formPage .promise > span.radioButton {
	font-size: 16px;
}

.formPage .promise > span:first-child {
	width: 150px;
}

.radioButton i {
	font-size: 20px;
}

.radioButton > span {
	display: inline-block;
}

.radioButton .icon-circle-blank,
.radioButton.selected .icon-ok-circle {
	display: inline-block;
}

.radioButton .icon-ok-circle,
.radioButton.selected .icon-circle-blank {
	display: none;
}

.formPage label:focus {
	background-color: blue;
}

.formPage .resultLabel,
.formPage .result,
.unit {
	display: inline-block;
	vertical-align: top;
	text-align: right;
	font-size: 16px;
	line-height: 20px;
}

.retirementAnnuity .resultLabel {
	vertical-align: bottom;
}

.retirementAnnuity .info {
	margin-right: 0;
	margin-top: 13px;
}

.meanEmploymentLevel > span {
	color: #002663;
	font-weight: bold;
}

.formPage input {
	display: inline-block;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 0 5px;
	height: 20px;
	border: none;
	border-radius: 5px;
	background-color: #b3b1b1;
	color: #fff;
	vertical-align: top;
	text-align: right;
	font-size: 14px;
	line-height: 14px;
	-webkit-appearance: none;
}

.formPage input.error {
	border: 2px solid #ff0000;
}

.formPage01 label {
	width: 160px;
}

.formPage01 input {
	width: 170px;
}

.formPage #group {
	width: 200px;
}

.formPage02 .tableHeader {
	margin-bottom: 5px;
}

.formPage02 .tableHeader > span {
	display: inline-block;
	width: 110px;
	color: #000;
	text-align: left;
	font-size: 12px;
	line-height: 12px;
}

.formPage02 .tableHeader span:first-child {
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	margin-right: 0;
	padding-right: 10px;
	padding-left: 0;
	width: 100px;
}

.formPage02 input {
	margin-right: 10px;
}

.formPage02 input {
	width: 100px;
}

.formPage02 input#salary {
	margin-right: 0;
	width: 200px;
}

.formPage02 label {
	width: 200px;
}

.formPage02 .partTimes label {
	width: 60px;
}

.partTimes {
	margin-bottom: 30px;
}

.partTimes > fieldset {
	margin-bottom: 28px;
}

.partTimes fieldset:last-child {
	margin-bottom: 0;
}

.button,
.go,
.toTzr,
.toResult,
.applyPartTimes {
	display: inline-block;
	margin-bottom: 40px;
	padding: 5px 16px 5px 16px;
	height: 20px;
	border-radius: 5px;
	background-color: #b3b1b1;
	background-color: #002663;
	cursor: pointer;
}

.toTzr {
	position: absolute;
	top: 125px;
	left: 300px;
	width: 170px;
	padding-left: 0;
	padding-right: 0;
	font-size: 0;
	line-height: 0;
}

.button {
	margin-bottom: 0;
}

.button.typeB {
	height: auto;
	background-color: transparent;
}

.denyFormslider {
	margin-right: 20px;
}

.applyPartTimes {
	margin-right: 55px;
	margin-left: 10px;
}

.go {
	margin-bottom: 0;
	padding: 10px 0px;
	width: 166px;
	background-color: #002663;
	text-align: center;
}

.disclaimerLangzeitKonto {
	display: inline;
	position: absolute;
	top: 32px;
	background: white
}

.goLangzeitKonto {
	background: #002663;
	color: #ffffff;
	border-radius: 5px;
	width: 166px;
	height: 20px;
	font-family: Verdana, Sans-Serif;
	font-weight: bold;
	padding: 10px 0px;
	text-align: center;
	left: 0px;
}

.errorLangzeitKonto {
	margin-top: 40px;
	font-size: 14px;
}

.toResult {
	margin-bottom: 0;
}

.calculateMeanPercentage {
	margin-right: 60px;
}

.button > span,
.toTzr > span,
.toResult > span,
.applyPartTimes > span {
	color: #fff;
	font-size: 14px;
	line-height: 20px;
}

.button.typeB > span {
	color: #002663;
	font-weight: bold;
	font-size: 16px;
	line-height: 20px;
}

.toTzr.button.typeB > span {
	font-weight: normal;
	font-size: 13px;
}

.button.typeB i {
	color: #333;
	font-size: 16px;
	line-height: 20px;
}

.button.typeB i.icon-chevron-left {
	padding-right: 8px;
}

.button.typeB i.icon-chevron-right {
	padding-left: 8px;
}

.toTzr.button.typeB i {
	position: absolute;
	top: 20px;
	right: 0;
	padding-left: 0;
	font-size: 30px;
	line-height: 13px;
}

.go > span {
	color: #fff;
	font-weight: bold;
	font-size: 18px;
	line-height: 20px;
}

.removeField {
	display: inline-block;
	width: 20px;
	height: 20px;
	text-align: center;
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.removeField.locked {
	display: none;
}

.removeField .icon {
	color: #ad5156;
	font-size: 14px;
	line-height: 20px;
}

.removeField i {
	vertical-align: middle;
}

.addField {
	display: inline-block;
	margin-right: 10px;
	margin-bottom: 20px;
	padding: 5px;
	height: 20px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	background-color: #fff;
	color: #000;
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.addField .text {
	color: #000;
	font-size: 13px;
	line-height: 13px;
}

.addField i {
	padding-right: 10px;
	color: #002663;
	vertical-align: middle;
}

.ie8 .formPage input {
	padding-top: 2px;
	padding-bottom: 2px;
	height: 20px;
}

fieldset.currentEmploymentLevel {
	display: none;
}

fieldset.currentEmploymentLevel.visible {
	display: block;
}

.toolWrapper {
	margin-left: 40px;
}

.toolWrapper > span.infotext {
	font-size: 14px;
	line-height: 19px;
	font-weight: bold;
}

.toolWrapper > span.infoline {
	font-size: 14px;
	line-height: 19px;
}

/* Plots */
.chartDrawer .gearsDrawerContent:after {
	display: block;
	visibility: hidden;
	clear: both;
	height: 0;
	content: " ";
	font-size: 0;
}

.chartWrapper .jqplot-title {
	display: none;
	font-weight: normal;
	font-size: 10px;
	line-height: 12px;
}

.chartWrapper .jqplot-xaxis-label,
.chartWrapper .jqplot-yaxis-label {
	color: #000;
	text-align: center;
	font-size: 12px;
	line-height: 12px;
}

.chartWrapper .jqplot-target {
	margin-left: 10px;
	width: 440px;
	height: 200px;
}

.chartWrapper .infoBoxHeader span {
	display: inline-block;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 5px;
	width: 100%;
	border: 1px solid #002663;
	color: #000;
	font-style: italic;
	font-size: 13px;
	line-height: 20px;
}

.chartWrapper .infoBoxContent {
	padding-top: 10px;
}

.chartWrapper table.jqplot-table-legend {
	border: none;
}

.chartWrapper td.jqplot-table-legend {
	padding-bottom: 10px;
}

.chartWrapper .jqplot-table-legend-label {
	padding-left: 10px;
	color: #000;
	font-size: 14px;
	font-family: 'Corbel';
	line-height: 14px;
}

.chartWrapper .jqplot-yaxis-tick,
.chartWrapper .jqplot-xaxis-tick {
	color: #002663;
	font-size: 12px;
	line-height: 12px;
}

.toggleLines {
	font-size: 0;
	line-height: 0;
}

.toggleLines .line {
	display: inline-block;
	width: 76px;
	font-size: 0;
	line-height: 0;
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.toggleLines .line:first-child {
	margin-right: 10px;
}

.toggleLines .line .text {
	padding-right: 10px;
}

.toggleLines .line .text,
.toggleLines .line i {
	color: #fff;
	vertical-align: middle;
	font-size: 16px;
	line-height: 16px;
}

.toggleLines .line > span {
	display: inline-block;
}

.toggleLines .line.visible .icon-check-empty,
.toggleLines .line .icon-check {
	display: none;
}

.toggleLines .line.visible .icon-check {
	display: inline;
}

/* ---------- Form pages end ---------- */

.centerBox {
	position: relative;
	margin: 0 auto 0 auto;
	width: 960px;
}

/* ---------- Range slider start ---------- */

.formPage .gr-wrapper {
	margin: 10px 0 0 0;
	width: 160px;
}

.formPage02 .gr-wrapper {
	margin: 10px 0 0 0;
	width: 200px;
}

.formPage .gr-indicatorFrame {
	background-color: #666;
}

.formPage .gr-indicator {
	background-color: #002663;
}

.formPage .gr-bubble {
	top: -26px;
	padding: 0;
	background: none;
	color: #000;
	font-weight: bold;
	font-size: 11px;
	font-family: Verdana, sans-serif;
	line-height: 13px;
	cursor: default;
	-moz-user-select: none;
	-webkit-user-select: none;
}

.formPage .gr-handle {
	top: -22px;
	right: -22px;
	width: 44px;
	height: 44px;
	background-image: url(../images/content/bg-gr-handle-01-02.png);
	background-position: center center;
	box-shadow: none;
}

/* ---------- Range slider end ---------- */

/* ---------- Info start ---------- */

.info {
	position: relative;
	display: inline-block;
	margin-right: 10px;
	width: 20px;
	height: 20px;
	vertical-align: top;
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.info .icon {
	display: inline-block;
	width: 20px;
	height: 20px;
	text-align: center;
	/* background: url('../images/content/icon-info-sign-ret-01-02.png') no-repeat 0 0 transparent scroll; */
	background-size: 20px 20px;
}

.bubble-anchor .icon-info-sign {
	color: #002663;
	font-size: 17px;
	line-height: 19px;
}

.info .icon i {
	color: #333;
	font-size: 17px;
	line-height: 19px;
}

.info.error .icon i {
	color: #ff0000;
}

.info.active .icon {
	/* background-image: url('../images/content/icon-info-sign-ret-a-01-02.png'); */
}

.info.active .icon i {
	color: #002663;
}

.ie8 .info .icon {
	/* background-image: url('../images/content/icon-info-sign-01-02.png'); */
}

.ie8 .info.active .icon {
	/* background-image: url('../images/content/icon-info-sign-a-01-02.png'); */
}

.info .infoContent {
	display: none;
}

/* ---------- Info end ---------- */

/* ---------- Info bubble start ---------- */

.infoBubble {
	position: absolute;
	top: 0;
	left: 0;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	width: 200px;
	border: 2px solid #ffffff;
	border-radius: 10px;
	background-color: #002663;
	-webkit-transition: -webkit-transform 0 ease;
	transition: transform 0 ease;
	-webkit-transform: scale(0) translateZ(0);
	transform: scale(0) translateZ(0);
}

.formPage00 .infoBubble {
	width: 320px;
	background-color: #f2f2f2;
}

.infoBubble .icon {
	position: absolute;
	top: 12px;
	right: 12px;
	display: inline-block;
	color: #fff;
	font-size: 14px;
	line-height: 14px;
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.formPage00 .infoBubble .icon {
	color: #000;
}

.infoBubble .contentWrapper {
	display: table;
	width: 100%;
	height: 100%;
}

.infoBubble .infoContent {
	display: table-cell;
	padding: 25px;
	width: 100%;
	height: 100%;
	color: #fff;
	font-size: 14px;
	line-height: 26px;
}

.infoBubble .infoContent p {
	margin-bottom: 0;
	color: #fff;
}

.infoBubble .infoContent p.marginBottom20 {
	margin-bottom: 20px;
}

.formPage00 .infoBubble .infoContent p {
	color: #000;
}

/* ---------- Info bubble end ---------- */

/* ---------- Chart drawer start ---------- */

.positionRelative {
	position: relative;
}

.chartWrapper fieldset {
	margin-bottom: 0;
}

.chartWrapper .info {
	position: absolute;
	left: 0;
	top: 12px;
	margin-right: 0;
}

.chartDrawer {
	margin-left: 40px;
	width: 460px;
}

.chartDrawerHeader {
	position: relative;
	display: table-cell;
	height: 40px;
	vertical-align: middle;
	cursor: pointer;
}

.chartDrawerHeader span {
	display: inline-block;
	margin-right: 10px;
}

.chartDrawerHeader span,
.chartDrawerHeader i {
	color: #000;
	font-size: 13px;
	line-height: 20px;
}

.chartDrawerHeader i {
	color: #002663;
	font-size: 16px;
}

.chartDrawer.opened .icon-chevron-up,
.chartDrawer.closed .icon-chevron-down {
	display: inline-block;
}

.chartDrawer.opened .icon-chevron-down,
.chartDrawer.closed .icon-chevron-up {
	display: none;
}

.chartDrawer .gearsDrawerContent {
	padding: 10px 0px;
	width: 460px;
}

/* ---------- Chart drawer end ---------- */

/* ---------- Slogan start ---------- */
.slogan {
	position: absolute;
}

.slogan01 {
	top: -25px;
	left: 500px;
}
/* ---------- Slogan end ---------- */

/* ---------- Form page 00 start ---------- */
.formPage00 .scrolleableArea {
	height: 385px;
	padding-top: 135px;
	width: 320px;
}

.formPage00 .info {
	position: absolute;
	right: 15px;
	bottom: 170px;
	margin-right: 0;
	width: 166px;
	height: 40px;
}

.formPage00 h3 {
	margin-bottom: 14px;
	padding-bottom: 0;
	border-bottom: none;
	color: #f1aa00;
	font-size: 19px;
	line-height: 21px;
}

.formPage00 h2 {
	margin-bottom: 0;
	color: #002663;
	font-size: 32px;
	line-height: 21px;
}
/* ---------- Form page 00 start ---------- */

/* ---------- Form page 01 start ---------- */
.formPage01 .button {
	margin-left: 285px;
}
/* ---------- Form page 01 end ---------- */

/* ---------- Form page 02 start ---------- */
.formPage02 .button.goToSlide {
	margin-right: 55px;
}
/* ---------- Form page 02 end ---------- */

/* ---------- Form page 03 start ---------- */
.button.print {
	margin-right: 20px;
}

.button.print i {
	margin-right: 15px;
}

.formPage03 label {
	width: 220px;
}

.formPage03 .resultLabel,
.formPage03 .result {
	color: #002663;
}

.formPage03 fieldset.retirementAnnuity,
.formPage03 fieldset.capitalValue {
	margin-bottom: 16px;
}

.capitalValue .info {
	margin-right: 0;
}

.retirementAnnuity .resultLabel {
	font-size: 22px;
	line-height: 22px;
	font-weight: bold;
	margin-bottom: 10px;
}

.retirementAnnuity .result,
.retirementAnnuity .unit {
	font-size: 45px;
	line-height: 45px;
	font-weight: bold;
	color: #002663;
	/* width: 470px; */
}

.capitalValue .resultLabel,
.capitalValue .result,
.capitalValue .unit {
	font-size: 13px;
	line-height: 19px;
	color: #000;
}

.formPage03 .borderBox {
	position: relative;
	padding: 20px 20px 40px 20px;
	border: 1px solid #002663;
	border-radius: 10px;
	-webkit-border-radius: 10px;
}

.formPage03 .borderBox fieldset {
	margin-bottom: 15px;
}

.borderBox h3 {
	font-size: 13px;
	line-height: 19px;
	color: #000;
}

.formPage03 .borderBox fieldset:first-child {
	margin-bottom: 30px;
}

.retirementAge .resultLabel,
.retirementAge .result {
	text-align: left;
	font-size: 12px;
	line-height: 19px;
	color: #000;
}

.formPage03 fieldset.retirementAge {
	margin-bottom: 0;
}

.retirementAge {
	position: absolute;
	right: 40px;
	top: 170px;
}

.retirementAge .result {
	font-weight: bold;
}

/* Der Rechenweg im Detail */
.calculationDetail fieldset {
	margin-bottom: 20px;
}

i {
	/*font-style: italic;*/
}

.calculationDetail > fieldset > .formula.betriebsrente > span > .rente {
	display: inline-block;
	font-size: 12px;
	/*font-weight: bold;*/
	line-height: 20px;
	color: #000;
}

.calculationDetail > fieldset > .formula.betriebsrente > span > .rentenkuerzung,
.calculationDetail > fieldset > .formula.betriebsrente > span > .dbg,
.calculationDetail > fieldset > .formula.betriebsrente > span > .mindestbetragMntl,
.calculationDetail > fieldset > .formula.betriebsrente > span > .abz,
.calculationDetail > fieldset > .formula.betriebsrente > span > .dienstjahre,
.calculationDetail > fieldset > .formula.betriebsrente > span > .sockelbetrag {
	display: inline-block;
	font-size: 12px;
	/*font-style: italic;*/
	line-height: 20px;
	color: #000;
}

.calculationDetail .value,
.calculationDetail .value > span,
.calculationDetail .formula,
.calculationDetail .formula > span,
.calculationDetail .formula .result {
	display: inline-block;
	font-size: 12px;
	line-height: 20px;
	color: #000;
}

.calculationDetail .value,
.calculationDetail .formula {
	display: block;
}

.calculationDetail .value .label {
	font-weight: bold;
	width: 300px;
}

.calculationDetail .formula .label {
	font-weight: bold;
	display: block;
}

/* ---------- Form page 03 end ---------- */

/* arrows for flip cards */

[data-content="langzeit-konto"] .flipperSide > .cardBox:not([data-backside=""]):after,
[data-content="langzeit-konto"] .flipperSide > .anchor:after {
	display: block;
	content: '.';
	position: absolute;
	font-size: 0;
	line-height: 0;
	width: 30px;
	height: 30px;
	background: transparent 0 0 no-repeat scroll;
	backround-size: 30px 30px;
}

[data-content="langzeit-konto"] .flipperSide > .cardBox:not([data-backside=""]):after {
	/*right: 0px;
	bottom: 10px;*/
	right: -15px;
	bottom: -5px;
	background-image: url('../images/screen/flipper/flipper-arrow-next-01.svg');
}

[data-content="langzeit-konto"] .flipperSide > .anchor:after {
	/*left: 20px;
	bottom: 20px;*/
	left: 5px;
	bottom: 5px;
	background-image: url('../images/screen/flipper/flipper-arrow-prev-01.svg');
}

/* arrows for flip cards */