/*-----------------------------------------------------------------------------------*/
/*  FONT-SIZE
/*-----------------------------------------------------------------------------------*/
.f13 {
	font-size: 13px;
}

.f14 {
	font-size: 14px;
}

.f15 {
	font-size: 15px !important;
}

.f16 {
	font-size: 16px;
}

.f17 {
	font-size: 17px;
}

.f18 {
	font-size: 18px;
}

.f19 {
	font-size: 19px;
}

.f20 {
	font-size: 20px;
}

.f21 {
	font-size: 21px;
}

.f22 {
	font-size: 22px;
}

.f23 {
	font-size: 23px;
}

.f24 {
	font-size: 24px !important;
}

.f25 {
	font-size: 25px;
}

.f26 {
	font-size: 26px;
}

/*-----------------------------------------------------------------------------------*/
/*  FONT-WEIGHT
/*-----------------------------------------------------------------------------------*/
.font100 {
	font-weight: 100;
}

.font300 {
	font-weight: 300;
}

.font400 {
	font-weight: 400 !important;
}

.font500 {
	font-weight: 500;
}

.font600 {
	font-weight: 600;
}

.font700 {
	font-weight: 700;
}

.font900 {
	font-weight: 900;
}

.italic {
	font-style: italic;
}

.bold {
	font-weight: bold;
}

/*-----------------------------------------------------------------------------------*/
/*  SPACING
/*-----------------------------------------------------------------------------------*/
.space0 {
	margin-top: 0px !important;
}

.space5 {
	margin-top: 5px !important;
}

.space10 {
	margin-top: 10px !important;
}

.space15 {
	margin-top: 15px !important;
}

.space18 {
	margin-top: 18px !important;
}

.space20 {
	margin-top: 20px !important;
}

.space25 {
	margin-top: 25px !important;
}

.space30 {
	margin-top: 30px !important;
}

.space40 {
	margin-top: 40px !important;
}

.space50 {
	margin-top: 50px !important;
}

.space60 {
	margin-top: 60px !important;
}

.space70 {
	margin-top: 70px !important;
}

.space80 {
	margin-top: 80px !important;
}

.space90 {
	margin-top: 90px !important;
}

.space132 {
	margin-top: 132px !important;
}

.space138 {
	margin-top: 138px !important;
}

.space100 {
	margin-top: 100px !important;
}

.space180 {
	margin-top: 180px !important;
}

.no-space {
	margin: 0 !important;
	padding: 0 !important;
}

body .container.body {
	padding: 0;
}

body .container.body .right_col {
	background: #f8f8f8;
}

/*-----------------------------------------------------------------------------------*/
/*  HAUPTMENU links und oben
/*-----------------------------------------------------------------------------------*/
.nav_menu {
	float: left;
	background: #173346;
	margin-bottom: 10px;
	min-width: 300px;
	width: 100%;
	padding: 1px 15px;
}

.nav.side-menu>li>a,
.nav.side-menu>li.active>a,
.nav.navbar-right>li>a,
.nav.toggle a {
	color: #fff;
}

.nav.side-menu>li>a:active,
.nav.side-menu>li>a:focus,
.nav.side-menu>li>a:hover,
.nav.side-menu>li.active>a,
.nav.navbar-right>li>a:active,
.nav.navbar-right>li>a:focus,
.nav.navbar-right>li>a:hover,
.nav.toggle a:active,
.nav.toggle a:focus,
.nav.toggle a:hover {
	background-color: transparent;
	color: #337ab7;
}

.top_nav .toggle {
	background-repeat: no-repeat;
	background-position: center right;
}

.top_nav .toggle {
	float: left;
	margin: 0;
	padding-top: 16px;
	width: 190px;
	height: 90px;
}

.top_nav .toggle a {
	cursor: pointer;
	margin: 0;
}

.top_nav .toggle a i {
	font-size: 26px;
}

.top_nav a.jsg-notification span {
	color: #014993;
	position: absolute;
	left: 25px;
	width: 25px;
	background: #fff;
	border-radius: 50%;
	padding: 1px;
	font-size: 15px;
	bottom: 6px;
	border: 1px solid #014993;
	text-align: center;
}

.top_nav .navbar-right {
	width: 70%;
}

.top_nav .navbar-right li {
	display: inline-block;
	min-width: 75px;
	float: right;
}

body.nav-sm .container.body .left_col {
	width: 70px;
	padding: 0;
	position: absolute;
	height: 100%;
	z-index: 200;
	left: 0;
	background: #173346;
}

.left_col .navbar {
	margin-bottom: 23px;
}

body.nav-sm .container.body .right_col {
	margin-left: 70px;
	z-index: 2;
}

.right_col_content {
	padding: 20px;
}

body.nav-sm .main_container .top_nav {
	margin-left: 70px;
	z-index: 2;
}

.right_col .bcrump {
	background-color: #e7eaec;
	padding-left: 30px;
}

.right_col .bcrump p {
	padding-bottom: 6px;
	margin: 0;
}

body .main_container .top_nav {
	padding: 0 !important;
	display: block;
}

body.nav-sm ul.nav.child_menu {
	left: 100%;
	position: absolute;
	top: 0;
	padding: 0;
	width: 250px;
	z-index: 4000;
	background: #a8b3ba;
	border: solid 1px #a8b3ba;
	display: none;
}

body.nav-md .container.body .col-md-3.left_col {
	display: none;
}

body.nav-md .container.body .right_col,
body.nav-md .container.body .top_nav {
	width: 100%;
}

body.nav-md .container.body .nav_menu,
body.nav-md .right_col {
	border-left: none;
}

.nav.side-menu>li {
	max-height: 60px;
}

.nav.side-menu>li>a {
	padding: 10px 5px;
	text-align: center;
	font-size: 25px;
}

ul.nav.side-menu li.active {
	background: #2f4859;
}

ul.nav.child_menu li {
	border-bottom: 1px solid #ddd;
}

body.nav-sm ul.nav.child_menu li a {
	color: #333;
	font-size: 14px;
	padding: 4px 0 4px 10px;
}

ul.nav.child_menu li.submenu-title {
	background: #173346;
	font-weight: bold;
}

ul.nav.child_menu li.submenu-title label {
	color: #fff;
	padding: 4px 0 4px 10px;
}

body.nav-md .content {
	background: #e7eaec;
	position: absolute;
	right: 0;
	padding: 23px 10px;
	top: 0;
	width: 75%;
}

body.nav-sm .content {
	display: none;
}

/* -----------------
ID ANSPRACHE
---------------- */
.tab-content>.tab-pane>.tab-pane {
	display: none;
}

.tab-content>.tab-pane>.active {
	display: block;
}

#overviewkunde,
#bilanzsicht {
	height: 455px;
}

#overviewkundequick,
#bilanzsichtquick {
	height: 220px;
}

#CusData1 {
	height: 245px;
}

#depot-konto1,
#depot-konto2,
#depot-konto3 {
	height: 240px;
	overflow-y: scroll;
}

#bilanzsicht #beteiligung {
	height: 60px;
	overflow-y: auto;
}

#bilanzsicht #beteiligung table {
	margin-bottom: 0;
}

/* -----------------
BOOTSTRAP OVERRIDES
-----------------*/
.tooltip {
	position: absolute;
	z-index: 1070;
	display: block;
	font-size: 16px;
	font-style: normal;
	font-weight: normal;
	line-height: 1.42857143;
	text-align: left;
	font-family: "Roboto Condensed";
	text-align: start;
	text-decoration: none;
	text-shadow: none;
	text-transform: none;
	letter-spacing: normal;
	word-break: normal;
	word-spacing: normal;
	word-wrap: normal;
	white-space: normal;
	filter: alpha(opacity=0);
	opacity: 0;
	line-break: auto;
}

.tooltip.top {
	padding: 5px 0;
	margin-top: -3px;
}

.tooltip.right {
	padding: 0 5px;
	margin-left: 3px;
}

.tooltip.bottom {
	padding: 5px 0;
	margin-top: 3px;
}

.tooltip.left {
	padding: 0 5px;
	margin-left: -3px;
}

.tooltip-inner {
	max-width: 200px;
	color: #fff;
	text-align: center;
	background-color: #5cb85c;
	padding: 6px 12px;
	font-size: 14px;
	border-radius: 0 !important;
	font-family: "Roboto";
}

.tooltip-arrow {
	position: absolute;
	width: 0;
	height: 0;
	border-color: transparent;
	border-style: solid;
}

.tooltip.top .tooltip-arrow {
	bottom: 0;
	left: 50%;
	margin-left: -5px;
	border-width: 5px 5px 0;
	border-top-color: #5cb85c;
}

.tooltip.top-left .tooltip-arrow {
	right: 5px;
	bottom: 0;
	margin-bottom: -5px;
	border-width: 5px 5px 0;
	border-top-color: #5cb85c;
}

.tooltip.top-right .tooltip-arrow {
	bottom: 0;
	left: 5px;
	margin-bottom: -5px;
	border-width: 5px 5px 0;
	border-top-color: #5cb85c;
}

.tooltip.right .tooltip-arrow {
	top: 50%;
	left: 0;
	margin-top: -5px;
	border-width: 5px 5px 5px 0;
	border-right-color: #5cb85c;
}

.tooltip.left .tooltip-arrow {
	top: 50%;
	right: 0;
	margin-top: -5px;
	border-width: 5px 0 5px 5px;
	border-left-color: #5cb85c;
}

.tooltip.bottom .tooltip-arrow {
	top: 0;
	left: 50%;
	margin-left: -5px;
	border-width: 0 5px 5px;
	border-bottom-color: #5cb85c;
}

.tooltip.bottom-left .tooltip-arrow {
	top: 0;
	right: 5px;
	margin-top: -5px;
	border-width: 0 5px 5px;
	border-bottom-color: #5cb85c;
}

.tooltip.bottom-right .tooltip-arrow {
	top: 0;
	left: 5px;
	margin-top: -5px;
	border-width: 0 5px 5px;
	border-bottom-color: #5cb85c;
}

.logo {
	background-repeat: no-repeat;
	background-position: 50px 10px;
	height: 100px;
	overflow: hidden;
}

/**  ------------------------------------------  **/
.container {
	width: 100%;
}

body {
	background-color: #173346;
	font-family: 'Roboto';
	font-size: 13px;
	font-weight: 400;
	line-height: 1.471;
}

.fixed_height_320 {
	height: 320px;
}

.fixed_height_390 {
	height: 390px;
}

.fixed_height_200 {
	height: 200px;
}

.grid_slider .col-md-6 {
	padding: 0 40px;
}

h1,
.h1,
h2,
.h2,
h3,
.h3 {
	margin-top: 10px;
	margin-bottom: 10px;
}

h3 {
	font-size: 14px;
}

a,
a:visited,
a:focus,
a:active,
:visited,
:focus,
:active,
.btn:focus,
.btn:active:focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn.active.focus {
	outline: 0;
}

.user-icon {
	position: relative;
	top: -2px;
}

.dropdown-menu>li>a:active,
.dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover {
	color: #333;
	text-decoration: none;
	background-color: transparent;
}

.badge {
	width: 22px;
	height: 22px;
	line-height: 1.4;
	background-color: #3498db;
	position: absolute;
	top: -6px;
	right: 4px;
}

.nav-tabs {
	border-bottom: 0;
}

span.blue {
	color: #3498db;
}

.header {
	background-color: #e7eaec;
	padding: 0 30px 0 15px;
	margin-left: 70px;
}

.header p {
	margin: 0;
	line-height: 2.45;
}

#chart {
	padding-top: 18px;
}

.thumbnail {
	border: 1px solid #e7eaec !important;
	border-radius: 0px !important;
	padding: 0px !important;
}

.bg {
	background-color: #e7eaec;
	margin: 0px !important;
}

p.pull-right {
	margin-top: 0px !important;
	margin-bottom: 0px !important;
}

/*===================================max css========================*/
.listnone {
	list-style: none;
}

.arrow_box:active,
.arrow_box:focus,
.arrow_box:hover {
	background: #a8b3ba;
}

.arrow_box {
	position: relative;
	background: #a8b3ba;
	border: 0;
	border-radius: 0;
}

.arrow_box:after,
.arrow_box:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.arrow_box:after {
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #a8b3ba;
	border-width: 11px;
	margin-left: -9px;
}

.arrow_box:before {
	border-color: rgba(194, 225, 245, 0);
	border-bottom-color: #a8b3ba;
	border-width: 0px;
	margin-left: 0px;
}

.show-on-hover:active>ul.dropdown-menu,
.show-on-hover:focus>ul.dropdown-menu,
.show-on-hover:hover>ul.dropdown-menu {
	display: block;
}

/* range */
.range-plus-minus {
	display: flex;
	margin-bottom: 35px;
	user-select: none;
}

.range-plus-minus.disable input[type="range"],
.range-plus-minus.disable .plus-btn,
.range-plus-minus.disable .minus-btn {
	opacity: 0.5;
	pointer-events: none;
}

.range-plus-minus .plus-btn,
.range-plus-minus .minus-btn {
	background: #FFA500;
	cursor: pointer;
	color: #fff;
	border-radius: 50%;
	font-size: 16px;
	width: 35px;
	height: 33px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.range-plus-minus .plus-btn {
	margin-left: 3px;
}

.range-plus-minus .minus-btn {
	margin-right: 3px;
}

.range-plus-minus .plus-btn i,
.range-plus-minus .minus-btn i {
	color: #fff;
}

.range-plus-minus input[type="range"] {
	-webkit-appearance: none;
	width: 100%;
	height: 33px;
	background: #00b5ec;
	outline: none;
	border-radius: 5px !important;
}

.range-plus-minus input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	width: 43px;
	height: 43px;
	background: #FFA500;
	cursor: pointer;
	border-radius: 50%;
}

.range-plus-minus input[type="range"]::-moz-range-thumb {
	width: 43px;
	height: 43px;
	background: #FFA500;
	cursor: pointer;
	border-radius: 50%;
}

.range-plus-minus input[type="range"]::-moz-range-progress {
	background-color: #00b5ec;
	height: 1em;
}

.range-plus-minus input[type="checkbox"] {
	height: 30px;
	width: 30px;
	margin: 0 10px 0 0;
	cursor: pointer;
}

/* berechnungen */
.berechnungen .boxes-berechnungen {
	user-select: none;
}

.berechnungen .box {
	box-shadow: 5px 7px 4px #aaa;
	height: 20vh;
	text-align: center;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 35px;
	position: relative;
	-webkit-transition: all .1s linear;
	-moz-transition: all .1s linear;
	-o-transition: all .1s linear;
	-ms-transition: all .1s linear;
	transition: all .1s linear;
	margin-top: 30px;
	border-radius: 8px;
	text-shadow: 1px 1px 1px #171717;
}

.berechnungen .box:hover {
	font-size: 40px;
}

.berechnungen .box::before {
	content: '';
	position: absolute;
	background-color: #f8f8f8;
	left: -0.4px;
	top: -0.4px;
	border-width: 30px;
	border-style: solid;
	border-left-color: transparent;
	border-top-color: transparent;
	border-bottom-right-radius: 8px;
	z-index: 1000000000000;
}

.berechnungen .zinsretter-box {
	background-color: #014b92;
}

.berechnungen .zinsretter-box::before {
	border-bottom-color: #021423;
	border-right-color: #021423;
	box-shadow: 8px 8px 6px  #0a243c;
}

.berechnungen .sparplan-box {
	background-color: #f8bb44;
}

.berechnungen .sparplan-box::before {
	border-bottom-color: #bc9750;
	border-right-color: #bc9750;
	box-shadow: 8px 8px 6px  #9f7f42;
}

.berechnungen .einmalanlage-box {
	background-color: #FF8C00;
}

.berechnungen .einmalanlage-box::before {
	border-bottom-color: #623e14;
	border-right-color: #623e14;
	box-shadow: 8px 8px 6px  #805016;
}

.berechnungen .entnahmeplan-box {
	background-color: #8c4b7e;
}

.berechnungen .entnahmeplan-box::before {
	border-bottom-color: #3a1231;
	border-right-color: #3a1231;
	box-shadow: 8px 8px 6px  #591a4b;
}

.berechnungen h2.title {
	padding: 0;
	margin: 0;
}

.berechnungen h2.title-zinsretter {
	color: #014b92;
}

.berechnungen h2.title-sparplan {
	color: #f8bb44;
}

.berechnungen h2.title-einmalanlage {
	color: #FF8C00;
}

.berechnungen h2.title-entnahmeplan {
	color: #8c4b7e;
}

.berechnungen .types-berechnungen {
	list-style: none;
	margin: 30px 0;
	padding: 0;
}

.berechnungen .types-berechnungen li {
	display: inline-block;
}

.berechnungen .result strong {
	font-size: 25px;
}

.berechnungen .result h3 {
	font-size: 50px;
}

.berechnungen label,
.berechnungen .label {
	font-size: 16px;
	color: #333;
	margin: 0 0 0 5px;
	padding: 0;
}

.berechnungen .value {
	font-size: 20px;
	font-weight: bold;
}

@media only screen and (max-width: 1405px) {
	.berechnungen .zinsretterResult .label {
		font-size: 14px;
	}
}