@font-face {
    font-family: 'Asap';
    src: url('webfonts/Asap-Regular-webfont.eot');
    src: url('webfonts/Asap-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('webfonts/Asap-Regular-webfont.woff') format('woff'),
         url('webfonts/Asap-Regular-webfont.ttf') format('truetype'),
         url('webfonts/Asap-Regular-webfont.svg#AsapRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'AsapBold';
    src: url('webfonts/Asap-Bold-webfont.eot');
    src: url('webfonts/Asap-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('webfonts/Asap-Bold-webfont.woff') format('woff'),
         url('webfonts/Asap-Bold-webfont.ttf') format('truetype'),
         url('webfonts/Asap-Bold-webfont.svg#AsapBold') format('svg');
    font-weight: normal;
    font-style: normal;
}

body {
	background:url(../images/common/header.jpg) top center repeat-x;
	font-family:'Asap',Calibri,Arial;
	font-size:13px;
	line-height:17px;
	color:#444444;
	margin:0;
	padding:0;
}

img {
	border:0;
}

form {
	margin:0;
	padding:0;
}

input, select {
	font-size:13px;
	color:#444444;
	border-top:1px solid #6d6d6d;	
	border-left:1px solid #e1e1e1;
	border-bottom:1px solid #e1e1e1;
	border-right:1px solid #e1e1e1;
	padding:3px;
}

input.btn_form {
	background-color:#f1f1f1;
	border:1px solid #d9d9de;
	font-size:12px;
}

.trans {	
	background-color: rgb(255,255,255);
	background-color: rgba(255,255,255,.9);
	background-color: transparent\9; /* Hide solid background for IE8 */
	filter:progid:DXImageTransform.Microsoft.gradient( 
	startColorstr=#DDFFFFFF,endColorstr=#DDFFFFFF); /* IEs */
	zoom:1;			
}





/* ++++++++++++++++++++++ LINKS +++++++++++++++++++++++++++++++++++ */
a {
	color:#007398;
	text-decoration:none;
	outline:none;
}


#diagramm_home area, #diagramm_home img {
	outline:none !important;
  border: none !important;
}


a:hover {
	color:#0e436b; /*#007398;	*/
}

a.a-extern {
	background:url(../images/common/new_window.png) center right no-repeat;	
	padding-right:20px;
}

a:focus {
	outline:none;
}

.pdf_15x19 {
	padding-left:20px;
	height:19px;	
	display:block;
	float:left;
	background:url(../images/common/pdf_15x19.png) top left no-repeat;	
}

.next_navi_next {
	float:right;
	padding-right:15px;
	background:url(../images/common/pfeil_blue_rechts_kurz.png) center right no-repeat;
}

.next_navi_back {
	float:left;
	padding-left:15px;
	background:url(../images/common/pfeil_blue_links_kurz.png) center left no-repeat;	
}

.important_to_know .key {
	float:left;
	width:220px;	
}

/* ++++++++++++++++++++++ BUTTONS +++++++++++++++++++++++++++++++++++++++ */

.link_pfeil {	
	background:url(../images/common/pfeil_blue_a.png) center right no-repeat;
	padding-right:15px;
}


.btn_2zeilig_pfeil {
	background:url(../images/common/btn_grau_2zeilig_pfeil_blau.png) top left no-repeat;	
	width:220px;
	height:70px;
	display:block;	
	font-size:20px;
	line-height:22px;	
}

.btn_2zeilig_pfeil span {
	margin:0;
	display:block;
	padding:12px 20px 0 20px;
}

.btn_1zeilig_pfeil {
	background:url(../images/common/btn_grau_1zeilig_pfeil_blau.png) top left no-repeat;	
	width:340px;
	height:70px;
	display:block;	
	font-size:20px;
	line-height:22px;	
}

.btn_1zeilig_pfeil span {
	margin:0;
	display:block;
	padding:22px 20px 0 20px;
}


.btn_verlauf_blau {
	background:transparent url(../images/common/btn_blau_verlauf.png) no-repeat scroll top right; 		
	height:31px;
	color:#fff;
	line-height:27px;
	padding-right:30px;
	display:block;
	float:left;
}

.btn_verlauf_blau span {
	display:block;	
	background:transparent url(../images/common/btn_blau_verlauf_ende.png) no-repeat;
	line-height:26px;
	padding: 2px 0 5px 12px;
}

.btn_verlauf_blau:hover, .btn_verlauf_blau_links:hover {
	color:#fff;
}

.btn_verlauf_blau_links {
	background:transparent url(../images/common/btn_blau_verlauf_links.png) no-repeat scroll top left; 		
	height:31px;
	color:#fff;
	line-height:27px;
	padding-left:30px;
	display:block;
	float:left;
}


.btn_verlauf_blau_links span {
	display:block;	
	background:transparent url(../images/common/btn_blau_verlauf_links_ende.png) no-repeat top right;
	line-height:26px;
	padding: 2px 12px 5px 0;
}


.back_to_top {
	background:transparent url(../images/common/btn_nachoben.png) no-repeat scroll top left; 		
	height:25px;
	color:#007398;
	line-height:22px;
	padding-left:10px;
	display:block;
	float:right;
	margin:30px 0 15px 0;
}


.back_to_top span {
	display:block;	
	background:transparent url(../images/common/btn_nachoben_pfeil.png) no-repeat top right;
	line-height:26px;
	padding: 0 24px 5px 0;
}


.btnbackground_3spaltig {
	background:transparent url(../images/common/btnbackground_3spaltig.png) top left no-repeat;
	width:700px;
	height:110px;
}

.btnbackground_3spaltig_default {
	font-size:20px;
	color:#444;	
	display:block;
	width:230px;		
}

.btnbackground_3spaltig_default a {
	color:#444;
	line-height:22px;
}

.btnbackground_3spaltig_default a span {
	color:#007398;
	font-size:14px;
	clear:both;
	float:left;
	margin-top:15px;
	padding-right:15px;
	background:url(../images/common/pfeil_blue_a.png) center right no-repeat;
}

.btnbackground_3spaltig_default a:hover {
	color:#0e436b;
}

.btnbackground_3spaltig_default span.tp {
	margin-top:35px;	
}

.btnbackground_3spaltig_a  {
	float:left;
	padding:16px 40px 0 80px;
}

.btnbackground_3spaltig_measures {		
	background:url(../images/common/btn_measures.png) top left no-repeat;	
	background-position:25px 20px;
}

.btnbackground_3spaltig_reports {		
	background:url(../images/common/btn_reports.png) top left no-repeat;	
	background-position:20px 20px;
}

.btnbackground_3spaltig_abouttideproject {		
	background:url(../images/common/btn_abouttideproject.png) top left no-repeat;	
	background-position:20px 20px;
}

.btnbackground_3spaltig_tidetools {		
	background:url(../images/common/btn_tidetools.png) top left no-repeat;	
	background-position:20px 20px;
}

.btn_tideproject {
	background:url(../images/common/btn_tideproject.jpg) top left no-repeat;	
	width:700px;
	height:150px;
	display:block;
	font-size:14px;
}

.btn_tideproject span {
	text-align:right;
	display:block;
	padding:65px 12px 0 0;
}

.btn_tideproject span span {
	padding:10px 15px 0 0;
	font-weight:bold;
	background:url(../images/common/pfeil_blue_a.png) top left no-repeat;
	background-position:679px 15px;
}


/* ++++++++++++++++++++++ TEXTANPASSUNGEN +++++++++++++++++++++++++++++++ */
h1 {
	margin:0 0 30px 0;
	font-size:32px;
	font-weight:normal;	
	line-height:32px;
}

h2 {
	margin:0 0 20px 0;
	font-size:22px;
	font-weight:normal;	
	line-height:23px;
}

#reports_detail h2 {
	color:#2f5125;
}

h2.line {
	color:#fff;
	font-size:22px;
	padding:10px 10px 8px 10px;
	margin:0 0 10px 0;
}

h3 {
	margin:0 0 10px 0;
	padding:0;
	font-size:14px;
	font-weight:bold;	
}

.green {
	color:#2f5125;
}

.bold {
	font-weight:bold;
}

.underline {
	text-decoration:underline;
}

.ub {
	text-decoration:underline;
	font-weight:bold;
}

.textup {
	text-transform:uppercase;
}

.smaller {
	font-size:10px;
	line-height:11px;
}



/* +++++++++++++++++++++++++ PADDINGS/MARGINS/AUSRICHTUNGEN ++++++++++++++++++++++++++ */
.ptr-20 {
	padding:20px 20px 0 0;
}

.ml-10 {
	margin-left:10px;
}

.ml-20 {
	margin-left:20px;
}

.mr-10 {
	margin-right:10px;
}

.mr-30 {
	margin-right:30px;
}

.ml-10 {
	margin-left:10px;
}

.mt-10 {
	margin-top:10px;
}

.mt-20 {
	margin-top:20px;
}

.mb-40 {
	margin-bottom:40px;
}

.mb-20 {
	margin-bottom:20px;
}

.mb-10 {
	margin-bottom:10px;
}

.mlb {
	margin:0 0 20px 30px;
}

.mrb {
	margin:0 20px 30px 0;
}

.fl {
	float:left;
}

.fr {
	float:right;
}

.cb {
	clear:both;
}

.pa {
	position:absolute;
}

.bt {
	border-top:1px solid #cdcdcd;
}

.bb {
	border-bottom:1px solid #cdcdcd;
}


/* ++++++++++++++++++++++++++++++ SEITE / HEADER / LOGO / FOOTER +++++++++++++++++++++ */
#seite {
	width:940px;
	margin:0 auto;		
}

#logo {
	display:block;
	height:183px;
	width:280px;
	background:url(../images/common/logo.png) top left no-repeat;
	margin-left:-24px;
}

#breadcrumb {
	font-size:11px;
	color:#999999;
	float:right;
	width:700px;
	text-align:left;
	height:40px;
}

#breadcrumb a {
	font-size:11px;
	color:#999999;
}

#column_left {
	float:left;
	width:204px;
	display:block;
}

#column_right {
	float:right;
	width:700px;
	text-align:left;
	display:block;	
	margin-top:1px;
}

#footer {
	margin-top:30px;
	display:block;
	background:url(../images/common/footer.png) top left repeat-x;
	height:106px;
	font-size:11px;
	color:#fff;
}

#footer-in {
	width:940px;
	margin:0 auto;	
	background:url(../images/common/footer.jpg) top left no-repeat;
	height:106px;
}

#footer a {
	font-size:11px;
	color:#fff;
}



/* +++++++++++++++++++ NAVIGATION +++++++++++++++++++++++++++++++++++++ */
#navigation {
	padding-bottom:40px;	
}

#navigation ul.navigation_ul {
	list-style-type:none;
	margin:0;
	padding:0;	
	border-bottom:1px solid #cdcdcd;
}

#navigation li {
	margin:0;
	padding:0;
	border-top:1px solid #cdcdcd;	
}

#navigation ul.navigation_ul > li > a {
	font-size:16px;
	background:url(../images/common/pfeil_blue_a.png) center left no-repeat;
	background-position:10px center;
	padding:9px 0 9px 28px;
	display:block;
}

#navigation ul.navigation_ul > li > a:hover, #navigation ul.navigation_ul > li > a.active {
	font-weight:bold;
	background:url(../images/common/pfeil_blue_a_hover.png) center left no-repeat;
	background-position:10px center;
}

#navigation ul.navigation_ul > li > ul > li > a {
	font-size:16px;
	background:url(../images/common/pfeil_blue_small_a.png) center left no-repeat;
	background-position:10px center;
	padding:9px 0 9px 28px;
	display:block;
	white-space:nowrap;
}

#navigation ul.navigation_ul > li > ul > li > a:hover, #navigation ul.navigation_ul > li > ul > li > a.active {
	font-weight:bold;
	background:url(../images/common/pfeil_blue_small_a_hover.png) center left no-repeat;
	background-position:10px center;
}


#navigation ul.navigation_ul ul {
	list-style-type:none;
	margin:0;
	padding-left:28px;
}

.next_navi {	
	clear:both;
	border-top:1px solid #cdcdcd;
	padding-top:15px;
}


/* +++++++++++++++++ IMAGE-ZOOM ++++++++++++++++++++++++++++++++++++++++++ */
.pic_zoom img, .pic_zoom_img {
	border:1px solid #dedede;	
}

.pic_zoom span {
	display:block;
	color:#444444;
	font-size:11px;
	line-height:13px;
	font-weight:bold;
	background:url(../images/common/zoom.png) top left no-repeat;
	background-position:0 10px;
	padding:10px 0 5px 23px;
}

.pic_zoom p {
	padding:0;
	margin:0;
	width:330px;
}


/* ++++++++++++++++++ DESIGNELEMENTE +++++++++++++++++++++++++++++++++++++ */
.trenner {
	border-top:1px solid #d0d0d0;
	padding-top:22px;
}

.expert_head {
	background-color:#f6f6f6;
	border-top:1px solid #cdcdcd;
	border-bottom:1px solid #cdcdcd;
	padding:10px;
	margin-bottom:10px;
	color:#2f5125;
	font-size:22px;
	line-height:24px;
}

.expert_head div {
	font-size:14px;
	color:#444444;
	font-weight:bold;
}

.expert_text {
	padding-left:10px;
	margin-bottom:35px;
}

.litext {	
	padding:10px 30px 10px 0;
}

.invisible {
	display:none;
}



/* +++++++++++++++++++++++++++ ABC-BLOCK ++++++++++++++++++++++++++++++++++ */
.abc_block a {
	background-color:#007398;
	color:#fff;
	font-size:16px;
	padding:10px 9px 10px 8px;
}

.abc_block a:hover {
	background-color:#08567d;
}

.abc_output a {
	font-size:22px;
	padding:10px 0;
	display:block;
	background:url(../images/common/plus.png) center right no-repeat;
}

.abc_output a.small {
	font-size:13px;
	line-height:16px;
	padding:0;
	background:none;
}

#divc ul li a {
	font-size:13px;
	font-weight:bold;
	padding:10px 50px 10px 0;
	display:block;
	background:url(../images/common/plus.png) center right no-repeat;
}

.abc_block {
	height:50px;
}

.abc_output_block {
	font-size:22px;
	background-color:#999999;
	color:#fff;
	padding:7px 10px;
	float:left;
	clear:both;
	margin:0;
}

.abc_output ul, #divc ul {
	clear:both;
	margin:0;
	padding:10px 0 0 0;	
	list-style-type:none;
	border-bottom:1px solid #cdcdcd;
	
}

.abc_output ul li, #divc ul li {
	margin:0;
	padding:0 0 0 10px;
	border-top:1px solid #cdcdcd;
}

#divc ul li a.small {
	font-weight:normal;
	font-size:13px;
	line-height:16px;
	padding:0;
	background:none;
}



/* +++++++++++++++++++ TABELLEN +++++++++++++++++++++++++++++++++++++ */
.tab_pur_pr td {
	padding:2px 20px 2px 0;
}

.normtab {
	border:1px solid #c0c0c0;
	border-collapse:collapse;	
}

.normtab td {
	border:1px solid #c0c0c0;
	padding:4px;
}


/* +++++++++++++++++++ SKIPBOX +++++++++++++++++++++++++++++++++++++ */
.skipbox_rahmen {
	border:1px solid #cccccc;
	background-color:#ffffff;
}

.skipbox_headline {
	background:url(../images/skipbox/subline_background.png) top left no-repeat;	
	width:700px;
	height:51px;	
	display:block;
	cursor:pointer;
	margin-bottom:10px;	
}

.skipbox_headline_p {
	font-size:12px;
	font-weight:bold;
	padding:7px 0 0 20px;	
}

.skipbox_picture {
	border-bottom:1px solid #adadad;
	background-color:#fff;	
}

.skipbox_left {
	float:left;
	width:45px;	
	height:50px;	
}

.skipbox_text {
	float:left;
	width:610px;
	background-color:#fff;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
}

.skipbox_text_p {
	height:48px;
}

.skipbox_text a {
	padding:3px 0 0 20px;
	font-weight:bold;
	display:block;
	text-decoration:underline;	
}

.skipbox_text_pt {
	padding-top:2px;
}

.skipbox_right {
	float:right;
	width:45px;	
	height:50px;	
}



/* +++++++++++++++++++ PROBLEMS / REPORTS - COLOR NAVI+++++++++++++++++++++++++++++++++++++ */
ul.navicolor {
	list-style-type:none;
	margin:0;
	padding:0;
}

ul.navicolor li {
	float:left;
	margin-right:1px;
}

ul.navicolor li.ptb {
	padding:10px 0;
}

ul.navicolor li.grey, h2.greyline {
	background-color:#999;	
}

ul.navicolor li.gold, h2.goldline {
	background-color:#b68229;	
}

ul.navicolor li.green, h2.greenline {
	background-color:#95b156;	
}

ul.navicolor li.red, h2.redline {
	background-color:#d4413f;	
}

ul.navicolor li.blue, h2.blueline {
	background-color:#346383;	
}

ul.navicolor li a {
	color:#fff;
	background:url(../images/common/pfeil_white.png) center right no-repeat;
	padding:11px 19px 11px 9px;	
}



/* +++++++++++++++++++ REPORTS - OVERVIEW +++++++++++++++++++++++++++++++++++++ */
.reports_box {
	width:320px;
	padding:15px 0;	
}

.report_navi {
	border-top:1px solid #cdcdcd;
	border-bottom:1px solid #cdcdcd;
	background-color:#f6f6f6;
}

.report_navi_links {
	float:left;
	width:460px;
}

.report_navi_rechts {
	float:right;
	width:220px;
	text-align:left;
}

.report_navi h2 {
	margin:20px 0 0 20px;
}

.report_navi_links ul {
	list-style-type:none;
	margin:0;
	padding:10px 0;
}

.report_navi_links ul li {
	padding:3px 0;
}

.report_navi_links ul li a span, .report_navi_links ul li span {
	width:30px;
	display:block;
	float:left;	
}

.report_navi_links ul li {
	padding-left:22px;
}

.report_navi_links ul li a {
	display:block;
	background:url(../images/common/pfeil_blue_report.png) center right no-repeat;
	padding-right:30px;
}


.report_navi_rechts ul {
	list-style-type:none;
	margin:0;
	padding:0;
	border-bottom:1px solid #cdcdcd;
}

.report_navi_rechts ul li {
	padding:5px 10px 5px 0;
	text-align:right;
	border-top:1px solid #cdcdcd;
	clear:both;
}

.report_navi_rechts a {
	height:19px;
	display:block;
	float:right;	
	line-height:22px;
}

.report_navi_rechts a.pdf, .pdflist a.pdf {
	padding-right:20px;
	background:url(../images/common/icon_download.png) center right no-repeat;
}

.report_navi_rechts a.link {
	padding-right:20px;
	background:url(../images/common/pfeil_blue_rechts_kurz.png) center right no-repeat;
}

#reports_detail {
	padding-top:30px;
}




/* +++++++++++++++++++++++++++++ Important to know BOX ++++++++++++++++++++++++++++++++++++++++++++++++++ */
.important_to_know {
	background-color:#dddddd;
	margin-top:10px;
	padding:17px;
}

.important_to_know a {
	font-weight:bold;
	text-decoration:underline;
}

.important_to_know th {
	text-align:left;
	font-weight:normal;
	padding-right:10px;
}




/* ++++++++++++++++++++++++++++++++++ Diagramm +++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.diagrammmbilder {
	z-Index:99;
	display:none;
	position:absolute;
}

.diagrammmbild_start_blank {
	z-Index:98;
	display:none;
	position:absolute;
}

.digrammmbild_start {
	z-Index:97;	
	position:absolute;
}

#diagramm_home {
	width:661px;
	height:661px;
}

#diagrammnavi_functioning, #diagrammnavi_governance, #diagrammnavi_measures {
	position:absolute;
	z-Index:100;
	left:265px;
	top:157px;
	display:none;
}

#diagrammnavi_close {
	position:absolute;
	z-Index:101;
	left:612px;
	top:130px;
	display:none;
}

#diagrammnavi_functioning a, #diagrammnavi_governance a, #diagrammnavi_measures a {
	background:url(../images/diagramm/btn_out.png) top left no-repeat;
	width:360px;
	height:28px;
	display:block; 
	z-Index:100;
	color:#fff;
	line-height:28px;	
	margin-bottom:5px;
}

#diagrammnavi_functioning a:hover, #diagrammnavi_governance a:hover, #diagrammnavi_measures a:hover {
	background:url(../images/diagramm/btn_over.png) top left no-repeat;
	width:360px;
	height:28px;
}

#diagrammnavi_functioning a span, #diagrammnavi_governance a span, #diagrammnavi_measures a span, #diagrammnavi_functioning p span, #diagrammnavi_governance p span, #diagrammnavi_measures p span {
	padding-left:12px;
}

#diagrammnavi_functioning p, #diagrammnavi_governance p, #diagrammnavi_measures p {		
	margin:0;
	background:url(../images/diagramm/btn_ohne.png) top left no-repeat;
	width:360px;
	height:28px;
	display:block; 
	z-Index:100;
	color:#fff;
	line-height:28px;	
	margin-bottom:5px;
}

/* ++++++++++++++++++++++++++++++++++++++ TIDE TOOL ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.tidetoolbox, .reportsbox {
	border-bottom:1px solid #cdcdcd;
	padding-bottom:10px;
	margin-bottom:15px;
}

.tidetool_filter, .problems_filter, .measure_filter {
	background-color:#ebf4f7;
	border-bottom:1px solid #cdcdcd;
	border-top:1px solid #cdcdcd;
	padding:12px 9px;
}

.tidetool_filter select {
	width:300px;
}

.problems_filter select {
	width:660px;
}

.measure_filter select {
	width:150px;
}

.text_tidetool {
	background:url(../images/common/tidetool_700px_top.png) top right no-repeat;
	border-bottom:2px solid #007398;
	padding:23px 0 11px 0;
}

.tidetool {
	background:url(../images/common/tidetool.gif) top right no-repeat;	
}

.tidetoolbox_detail {	
	width:220px;	
}

.tidetoolbox_detail_out {
	float:right;
	margin:0 0 10px 10px;
}

.tidetool_bluebox {
	background-color:#007398;
	color:#fff;
	padding:20px 15px;
}

.tidetool_blueline {
	border-top:4px solid #007398;
	padding-top:25px;
}



/* +++++++++++++++++++++++++++++ START Diagramm Add-On ++++++++++++++++++++++++++++++++++++ */
.diagramm_imanagement {
	position:absolute;
	width:700px;
	height:640px;
	z-index:100;
	display:none;
}

.diagramm_imanagement .dimp {
	padding:140px 100px 0 100px;
}

.diagramm_imanagement #dimp_close {
	position:absolute;
	top:140px;
	left:620px;
}

.diagramm_radius {
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	width:360px;
	margin-bottom:6px;
}

.diagramm_radius div {
	padding:12px;
}

.diagramm_radius_functioning {
	background-color:#535d39;
	color:#fff;
}

.diagramm_radius_governance {
	background-color:#743534;
	color:#fff;
}

.diagramm_radius_measures {
	background-color:#2a3a46;
	color:#fff;
}
