.redText {
	color					: red;												/* TODO */
}

.tooltip {
	background-color:black;
}

.tooltip > .nub {
     border-color: transparent transparent black transparent;
}

.has-tip img.tng-icon-small {
	vertical-align:text-bottom;
}

.has-tip.noborder {
	border:none;
}

#wrapper {
	background-color 	: #232323;
	margin 				: 0 auto;
}

#content {
	background-color 	: inherit;
	max-width 			: 63rem;
	margin 				: 0 auto;
}

#footer {
	padding 			: 0.5rem;
	border-top 			: 0.375rem solid #1e3143;
	padding-bottom 		: 2rem;
	background-color 	: inherit;
}

#middle {
	margin-bottom 		: 1rem;
}

.top-bar {
	background 			: #2b2b2b;
	border-bottom 		: 0.375rem solid #1e3143;
	height 				: 3.1875rem;
	margin				: 0;
	padding				: 0;
}

.top-bar .top-bar-section ul li {
	border-right 		: 0.1875rem solid #2b2b2b;
}

.top-bar .top-bar-section ul li.tng a {
	color 	: #008cba;
}

.top-bar .top-bar-section ul li.tng a:hover {
	color 	: #3d6b95;
}


@media only screen and (max-width: 40em) { 
	#middle {
		padding 			: 0 0.25rem;
	}
}

@media only screen and (min-width: 40.063em) { 
	#middle {
		padding 			: 0 0.25rem;
	}
}

@media only screen and (min-width: 64.063em) {
	#wrapper {
		max-width 			: 73rem;
	}
	
	.top-bar {
		margin				: 0 -5rem;
		padding-left		: 5rem;
		padding-right		: 5rem;
	}
	
	#footer {
		margin 				: 0 -5rem;
		padding-left		: 5rem;
		padding-right		: 5rem;
	}
}

/* --- HTML Overrides --------------------------------------------------------*/

body {
	background 			: #093e70;
	background-image 	: url(../../images/design/bg_px.png);
	background-repeat 	: repeat-x;	
	color 				: #e0e0e0;
	width 				: 100%;
	font-size 			: 95%;
}

a {
	font-weight 		: bold;
	color 				: white;
}

a:hover {
	font-weight 		: bold;
	color 				: #3d6b95;
}

table {
	width 				: 100%;
}

h1, 
h2, 
h3 {
	color 				: #e0e0e0;
	padding-top			:0.5rem;
	padding-bottom		:0.5rem;
}

h1 {
	font-size 			: 1.75rem;
}

h2 {
	font-size 			: 1.5rem;
}

h3 {
	font-size 			: 1.25rem;
}

p {
	padding 			: 0.25rem;
}

form {
	margin 				: 0;
}

fieldset legend {
	background 			: transparent;
}

input[type="radio"] {
	margin-right 		: 1rem;
}

textarea {
	resize 				: vertical;
	height				: 8rem;
}

input[type=text],
input[type=password],
input[type=email],
input[type=number],
textarea,
select {
	color 				: #e0e0e0;
	font-weight 		: bold;
	background-color 	: #3e3e3e !important;
	border-color 		: #303030 !important;
}

input[type=checkbox] {
	margin-bottom 		: 1.375rem;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

label {
	color 				: inherit;
}

/* --- IDs -------------------------------------------------------------------*/

/* --- Helper ----------------------------------------------------------------*/

.clear,
.clear-paddings {
	padding 			: 0 !important;
}

.clear,
.clear-margins {
	margin 				: 0 !important;
}

.nowrap {
	white-space 		: nowrap;
}

.bold {
	font-weight 		: bold;
}

/* --- Foundation Overrides --------------------------------------------------*/

#middle .panel {
	margin-left 		: -0.25rem;
	margin-right		: -0.25rem;
}

.button {
	background-color 	: transparent;
	background-image 	: url(../../images/design/button-px.png);
	background-repeat 	: repeat-x;
	border-radius 		: 5px;
}

.button:hover {
	background-color 	: transparent;
	background-image 	: url(../../images/design/button-px-hover.png);
}

.button.secondary {
	color 				: #b9b9b9;
	background-color 	: transparent;
	background-image 	: url(../../images/design/button-px_second.png);
	background-repeat 	: repeat-x;
}

.button.secondary:hover {
	color 				: white;
	background-color 	: transparent;
	background-image 	: url(../../images/design/button-px-hover_second.png);
}

input.button,
a.button {
	font-weight 		: bold;
}

span.has-tip {
	color 				: #e0e0e0;
}

.tab-bar .right-small {
	border-left 		: 0 none transparent;
	height 				: 2rem;
	line-height 		: 2rem;
}

.tab-bar .menu-icon {
	height 				: 2rem;
	line-height 		: 2rem;
}

.tab-bar .menu-icon span {
	margin-top 			: 0.5rem;
}

.tab-bar {
	background-color 	: #2b2b2b;
	border-bottom 		: 0.375rem solid #1e3143;
	border-top 			: 0.375rem solid #1e3143;
	height 				: 2.375rem;
	line-height 		: 2.375rem;
}

.tab-bar .right-small {
	padding: 0.1875rem 0.375rem;
	height 				: 2.375rem;
	line-height 		: 2.375rem;
}

.panel li,
.panel h3,
.panel p {
	color 				: inherit;
}

.panel p {
	margin-bottom 		: 0.5rem;
}

.side-nav li .button {
	margin 				: 0;
}

.side-nav li a {
	color: white !important;
}

.side-nav li a:hover {
	color: #3d6b95 !important;
}

[class*="block-grid-"] {
    margin-bottom 		: 0.5rem; 
}

[class*="block-grid-"] > li {
	padding-bottom 		: 0;
    margin-bottom 		: 0.5rem; 
}

[class*="block-grid-"] > li .button {
    margin-bottom 		: 0; 
}

.panel [class*="block-grid-"] > li {
    margin-bottom 		: 0;
    padding-right 		: 0; 
}

.panel {
	background 			: #2b2b2b;
	color 				: #e0e0e0;
	border 				: 0 solid transparent;
	padding 			: 0.75rem;
	margin-bottom 		: 1.25rem;
}

/* --- BREADCRUMBS --- */

.breadcrumbs {
	color 				: #e0e0e0;
	border 				: 0 none transparent;
	border-radius 		: 0;
	background-color 	: #2b2b2b;
	border-bottom 		: 0.375rem solid #1e3143;
}

.breadcrumbs a,
.breadcrumbs li {
	color 				: #e0e0e0;
}

.breadcrumbs a {
	max-width 			: 8rem;
	display 			: inline-block;
	overflow 			: hidden;
	white-space 		: nowrap;
}

.breadcrumbs > *:before {
	content 			: "-";
	margin 				: 0 0.25rem;
	vertical-align 		: super;
	
}

/* --- GRID --- */

.row {
	line-height 		: 2.75; 
}

.row.low {
	line-height 		: 2;
	font-size 			: 0.6rem;
}

.row .columns.icon {
	padding 			: 0 0.1875rem;
}

.row.low .columns.icon {
	padding 			: 0 0.1875rem;
}

/* --- ACCORDION --- */

.tng.accordion {
	color 				: #e0e0e0;
	background-color 	: #2b2b2b; 
	margin-bottom 		: 1.25rem;
}

.tng.accordion .accordion-navigation {
	background-image		: url(../../images/icons/arrow_right.svg);
	background-size 		: 2rem;
    background-repeat 		: no-repeat;
    background-position 	: 0.25rem 0.75rem;
	background-color 		: #1e3143;
	border-bottom 			: 0.375rem solid #232323;
}

.tng.accordion .accordion-navigation.active {
	background-image		: url(../../images/icons/arrow_down.svg);
}

.tng.accordion .accordion-navigation a.head {
	font-weight 		: bold;
	padding-left		: 2.5rem;
	background-color 	: transparent !important;
	color 				: #e0e0e0 !important;
}

.tng.accordion .accordion-navigation .content.active {
	background-color 	: #2b2b2b !important;
}

/* --- Own Classes -----------------------------------------------------------*/

input.integrated {
	height 				: 1.375rem;
	padding 			: 0.1875rem;
	margin 				: 0;
	display 			: inline;
	text-align 			: center;
	font-weight 		: normal;
	width 				: 100%;
	z-index 			: 100;
}

.small-header {
	max-width 			: 20rem;
	padding 			: 0.5rem;
}

.large-header {
	display 			: block;
	width 				: 100%;
}

.tng-row {
	background-color 	: #303030;
	padding 			: 0.5rem;
	padding-bottom 		: 0rem;
	margin-bottom 		: 0.5rem;
}

.panel .tng-row {
	background-color 	: inherit;
}

.tng-row .left {
	line-hight 			: 1.5rem;
	float 				: left;
	font-weight 		: bold;
	padding-bottom		: 0.5rem;
}

.tng-row .right {
	float 				: right;
	padding-bottom		: 0.5rem;
}

.tng-row.small {
	padding 			: 0.25rem;
	margin-bottom 		: 0.25rem;
}

.tng-row.small .left,
.tng-row.small .right {
	font-size 			: smaller;
}

/* --- TABLE --- */

.accordion-table,
.table {
	margin-bottom 		: 1rem;
	margin-top 			: 1rem;
}

.accordion-table .accordion-navigation a.toggle {
	margin 				: 0;
	padding 			: 0;
	display 			: block;
	background 			: none;
	color	 			: #e0e0e0
}

.accordion-table .accordion-navigation a.toggle span.row {
	display 			: block;
}

.accordion-table .accordion-navigation .content.active {
	background 			: none;
	padding 			: 0.3125rem;
	margin 				: 0;
}

.accordion-table .accordion-navigation .content.active ul li {
	background 			: none;

}

.accordion-table a.row,
.table a.row {
	display 			: block;
}

.table .row {
	white-space 		: nowrap;
	overflow 			: hidden;
}

.table .row .columns {
	white-space 		: nowrap;
	overflow 			: hidden;
}

.accordion-table .row .columns.border,
.table .row .columns.border {
	border-left 		: 0.125rem solid #e0e0e0; 	
}

.accordion-table .row.head,
.table .row.head {
	background 			: #1e3143;
	font-weight 		: bold;
}

.accordion-table .row.head .row.head,
.table .row.head .row.head {
	background-color 	: transparent;
}

.accordion-table .row.head.low,
.table .row.head.low {
	line-height 		: 2;
}

.accordion-table .accordion-navigation {
	margin-left 		: auto;
	margin-right 		: auto;
	max-width 			: 62.5rem;
}

.accordion-table .row.even,
.accordion-table .accordion-navigation.even,
.table .row.even {
	background 			: #303030 !important;
}

.accordion-table .row.odd,
.accordion-table .accordion-navigation.odd,
.table .row.odd {
	background 			: #3e3e3e !important;
}

.accordion-table .accordion-navigation .toggle .switch {
	background-image		: url(../../images/icons/arrow_right.svg);
	background-size 		: 1.25rem;
    background-repeat 		: no-repeat;
}

.accordion-table .accordion-navigation.active .toggle .switch {
	background-image		: url(../../images/icons/arrow_down.svg);
}

.table .sub-nav {
	padding-top 		: 1rem;
}

.sub-nav li,
.table .sub-nav li {
	margin-left 		: 0;
	padding 			: 0;
}

/* --- ICONS --- */

.tng-icon,
.tng-icon-small,
.tng-icon-low,
.tng-icon-medium,
.tng-icon-large {
	padding 			: 0 0.125rem;
}

.tng-icon {
	height 				: 2rem;
}

.tng-icon-medium {
	height 				: 1.75rem;
	vertical-align		: middle;
}

.tng-icon-small {
	height 				: 1.5rem;
}

.tng-icon-low {
	height 				: 1.2rem;
	padding 			: 0 0.125rem;
}

.tng-icon-large {
	height 				: 2.5rem;
}

.tng-icon-spacer {
	line-height 		: 0.75;
	display 			: block;
}

/* --- START NEWS --- */

.news {
	margin-bottom 		: 2rem;
}

.news .panel {
	margin-top 			: 0.25rem;
	margin-bottom 		: 0.25rem;
	line-height			: 1.5;
}

.news .edit {
	font-style 			: italic;
	font-size 			: smaller;
}

.feature.row .columns {
	line-height 		: 2em;
}

.feature.row .columns span.accent {
	font-weight 		: bold;
	font-size 			: 125%;
}