@charset "UTF-8";

/* reset styling */
* {
    margin: 0;
    padding: 0;
    outline: none;
    box-sizing: border-box;
}

@font-face {
    font-family: 'allura-regular';
    src: url('allura-regular-webfont.eot');
    src: url('allura-regular-webfont.eot') format('embedded-opentype'),
         url('allura-regular-webfont.woff') format('woff'),
         url('allura-regular-webfont.ttf') format('truetype'),
         url('allura-regular-webfont.svg#allura-regular') format('svg');

    font-family: 'sofadione-regular';
    src: url('sofadione-regular-webfont.eot');
    src: url('sofadione-regular-webfont.eot') format('embedded-opentype'),
         url('sofadione-regular-webfont.woff') format('woff'),
         url('sofadione-regular-webfont.ttf') format('truetype'),
         url('sofadione-regular-webfont.svg#sofadione-regular') format('svg');

    font-family: 'liberation_sansregular';
    src: url('LiberationSans-Regular-webfont.eot');
    src: url('LiberationSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('LiberationSans-Regular-webfont.woff') format('woff'),
         url('LiberationSans-Regular-webfont.ttf') format('truetype'),
         url('LiberationSans-Regular-webfont.svg#liberation_sansregular') format('svg');

    font-family: 'permiansanstypefaceregular';
    src: url('PermianSansTypeface-webfont.eot');
    src: url('PermianSansTypeface-webfont.eot?#iefix') format('embedded-opentype'),
         url('PermianSansTypeface-webfont.woff') format('woff'),
         url('PermianSansTypeface-webfont.ttf') format('truetype'),
         url('PermianSansTypeface-webfont.svg#permiansanstypefaceregular') format('svg');
         
    font-weight: normal;
    font-style: normal;
	font-display: swap;
}

/* grid systeem */
/* For desktop: */
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

@media only screen and (max-width: 768px) {
  /* For mobile phones: */
  [class*="col-"] {
    width: 100%;
  }
}

.row::after {
  content: "";
  clear: both;
  display: block;
}

[class*="col-"] {
  float: left;
  padding: 25px;
}

html {
	font-family: permiansanstypefaceregular,Verdana,Helvetica,sans-serif;
	color: #C60;	
	background: url(../images/layout/backgrnd2.jpg) fixed;
	font-size: 100%;
}

body {
	margin: 0;
	color: #CC6600;
	font-family: permiansanstypefaceregular, Verdana, Helvetica, sans-serif;
	font-size: 1.0em;
	line-height: 1.5;
	background: url(../images/layout/backgrnd2.jpg) fixed;
}

#contenttable {
	width: 100%;
	border: 0px;
	margin: 0px;
	padding: 0px 0px 0px 0px;
}

p {
/*	color: #CC6600; */
	margin-top: 7px;
}

a:link, a:visited { 
	color: #8b0000; 
	text-decoration: none;
}
a:hover, a:active { 
	color: #8b0000; 
	text-decoration: underline;
}

h1 {
	color: #CC6600;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-style: italic;
	font-size: 20px;
}

h2 {
	color: #CC6600;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-style: italic;
	font-size: 16px;
}

ul, ol {
    margin: 1em 0;
    padding: 0 0 0 20px;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td {
  vertical-align: top;
  padding: 3px;
}

/*****************/
/* hoofdindeling */
/*****************/
.header {
	width: 100%;
	color: #ffffff;
	padding: 5px;
	z-index: 1000;
	position: fixed;
	top: 0;
	box-shadow: 0 4px 10px 6px #666;
	background-image: url(../images/layout/backgrnd2.jpg);
}
.header-inner {
	max-width: 1280px;
	margin-left: auto;
	margin-right: auto;	
}
.content {
	max-width: 1168px;;
	margin-left: auto;
	margin-right: auto;
	margin-top: 75px;
	padding: 50px;
	padding-top: 25px;
	box-shadow: 5px 5px 20px 6px #666;
	border-radius: 7px;
	background: url(../images/layout/backgrnd2.jpg);
}
.footer {
	color: #CC9966;
	text-align: center;
	padding: 5px;
}
.copyright {
	font-family: 'sofadione-regular', verdana;
	font-size: 0.9em; 
	color: #8b0000;
	margin-bottom: 10px;
}



/*************************/
/* kaders op de homepage */
/*************************/
.box_actueel {
  display: block;
  font-size: 1.2em;
  background-color: #FFC;
  border: 1px solid black;
  border-radius: 10px;
  box-shadow: 9px 10px 10px -4px rgba(0,0,0,0.75);
  margin-bottom: 10px;
  padding: 8px;
}

/* printlogo alleen wanneer geprint wordt dus standaard uit */
#prntlogo {
	display: none;
}

.sidebar_left {
	border: 0px solid #CC9966;
	background-color: #F8F8F8;
	color: #CC6600;
	font-size: .9em;
	border-radius: 7px;
	box-shadow: 0 -1px 1px 1px #aaa inset;
	padding: 8px;
}
.sidebar_right {
	font-size: 11px;
}

/* Sub menu */
.submenu {
	margin: 0;
}
.submenu h4 {
	margin-top: 0;
	margin-bottom: 0;
	padding-bottom: 1.5%;
	border-bottom: solid 1px #F0E68C;
}
.submenu ul {
	list-style: none outside none;
	margin: 0;
	padding: 0;
}
.submenu li {
	margin-left: 0;
	border-left: 1px solid #F0E68C;
	padding-left: 1.5%;
}

#logo {
	display: inline-block;
}

/********/
/* menu */
/********/
#hamburgermenu {
	display: none;
	margin-left: 25px;
	font-size: 30px;
}
#hamburgermenu img {
	width: 30px;
	height: 30px;
}

#navcontainer {
	background-color: #F0E68C;
	width: auto;
	position: relative;
	right: 0px;
	float: right;
}
#navigation {
	position: relative;
	float: left;
	margin: 0;
	margin-right: 10px;
	z-index: 1000;
}

/* Minimaal 768px betekend regels die gelden voor tablets */
@media screen and (max-width: 768px) {
	#navcontainer {
		background-color: transparent;	
	}
	#hamburgermenu {
		display: initial;
	}
	#navigation {
/*		display: none; */
  }
  .sb_container {
		display: none;
  }
}

/**************/
/* paginering */
/**************/
#cmspagineringcontainer {
	margin: 5px 0px 0px 0px;
	padding: 2px 2px 2px 2px;
	font-size: 12pt;
	border-style: none;
	vertical-align: middle;
	width: 100%;
}
#cmspagineringlinks {
	position: relative;
	float: left;
	width: 10%;
	margin: 0px;
}
#cmspagineringmidden {
	position: relative;
	float: left;
	width: 80%;
	margin-left: auto;
	margin-right:auto;
	padding-top: 6px;
/*	font-size: 12px; */
	font-weight: bold;
	text-align: center;
	vertical-align: middle;
}
#cmspagineringmidden a {
	color: #CC6600;
	padding-right: 5px;
	padding-left: 5px;
}
#cmspagineringrechts {
	position: relative;
	float: right;
	width: 10%;
	margin: 0px;
	text-align: right;
}
.paginering { /* links naar de andere pagina's van de lijst */
	display: inline-block;
/*	padding: 10px 10px 30px 0px; */
	font-weight: bold;
	min-width: 25px;
	margin: 2px;
}
.paginering a {
	color: #CC6600;
	padding-right: 5px;
	padding-left: 5px;
}
.paginering a:hover {
	color: #FF660D;
}

.paginering_standard {
	padding-right: 5px;
	padding-left: 5px;
	color: #CC6600;
}
.paginering_highlight {
	display: inline-block;
	padding-right: 5px;
	padding-left: 5px;
	color: #FF660D;
	border: solid 2px #FF660D;
	min-width: 25px;
	margin: 2px;
	cursor: pointer;
}


/****************/
/* afbeeldingen */
/****************/
figure {
  display: block;
}
figure img {
	border: 1px solid #CC6600;
	max-width: 100%;
}	
figcaption, .caption {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-style: italic;
	font-size: 8pt;
	color: #696969;
}
figcaption p {
	margin-top: 0;
	margin-bottom: 0;
}

.figure_left, .afbeeldingstabel_links {
	border: none;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 10px;
	margin-top: 10px;
	float: left;
}
	
.figure_right, .afbeeldingstabel_rechts {
	border: none;
	margin-bottom: 0px;
	margin-left: 10px;
	margin-right: 0px;
	margin-top: 10px;
	float: right;
}


.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
figure img {
  border: 1px solid #C60;
  max-width: 100%;
}	

.afbeelding_rechts {
/*	 HSPACE:'10';
	 VSPACE:'5';
	 ALIGN:'right';
*/	 border: thin solid;
	margin-bottom: 10px;
	margin-left: 10px;
	margin-right: 0px;
	margin-top: 0px;
	float: right;
	margin: 0px 0px 5px 10px;
	}

/* twee kolommen */
.kolomcontainer {
	width: 100%;
	float: left;	
}
.kolom_links, .kolom_rechts {
	float: left;
	width: 50%;
}

/* Formulieren nieuwe stijl */
.form {
    margin: 0;
    margin-top: 20px;
}
.form .tbl_container {
    display: table;
}
.form .tbl_row {
    display: table-row;
}
.form .tbl_column1 {
    display: table-cell;
    width: 30%;
    vertical-align: top;
    padding-top: 3px;
}
.form .tbl_column2 {
    display: table-cell;
    width: 70%;
}
.form .infoicon {
	float: right; 
	margin-right: 10px;
	cursor: pointer;
}

/* standaard elementen pagina's */
.popuptext {
  display: none;
  text-align: left;
  padding-top: 5px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 5px;
}
.popuplink {
  text-decoration: none;
  border-bottom: dotted 1px;
  cursor: pointer;
}


.tekst_zeerklein {
	font-size: 14px;	
}
.intermezzo {
	font-size: 10pt;
	color: gray;
	border-bottom: 1px solid #708090;
	border-bottom-style: solid;
	border-top-style: solid;
	border-top-width: 1px;
	border-top-color: #708090;
	margin-left: 40px;
	margin-right: 40px;
}
.lijstsubkop {
  font-style: italic;
  /*font-weight: bold;*/
  margin-top: 7px;
}
/********************************* 
* Scheepsgegevens 
*********************************/
.ls-preloader {
	background: url(/images/layout/liquid-slider/loading.gif) #F8F8F8 no-repeat center 50%;
}
.ls-wrapper {
	margin-top: 15px;
}
.ls-wrapper h2 {
	display: none;
}
.liquid-slider {
	background: #F8F8F8;
	width: 100%;
	border-radius: 7px;
	box-shadow: 0 -1px 1px 1px #aaa inset;
}
.liquid-slider .ls-panel {  
	width: 900px;
}
.panel-wrapper {  
	padding: 0 10px;
}
.ls-nav a {
  background: #cc6600;
  color: #fff;
  font-weight: bold;
  font-style: italic;
  border-top-right-radius: 12px;
	-webkit-border-top-right-radius: 12px;
	-moz-border--top-right-radius: 12px;
}
.ls-nav a:hover {
	background: #cc6600;
	color: yellow;
}
.ls-nav .current a {
	background: #F0E68C;
	color: #cc6600;
	border-top-right-radius: 12px;
	-webkit-border-top-right-radius: 12px;
	-moz-border--top-right-radius: 12px;
}
.ls-nav ul li {
	font-size: 0.8em;
}
.ls-wrapper [class$="-arrow"] {
  background-image: url(/images/layout/liquid-slider/arrow.png);
}

#schepenindex {
	width: 100%;
	float: left;
	font-family: 'sofadione-regular';
	font-size: 1.45em;
	font-weight: bold;
}
#schepenindex .letter {
	width: 17px;
	display: inline-block;
	text-align: center;
}
#schepenindex .actief a:link, #schepenindex .actief a:visited {
	color: red;
}
#scheepsnaam {
  font-size: 1.2em;
  font-weight: bold;
}
#scheepsnaam p {
	margin-top: 0;
}
.panel-wrapper {
	padding-top: 0;
}

table.kenmerken .kenmerk_label {
	width: 110px;
	font-size: 0.9em;
	font-style: italic;
}
table.voyagedata {
	
}
.reisvia {
  color: #C60;
  font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
  font-size: 11px;
  padding-top: 0;
  padding-bottom: 3px;
}
.reisvia p {
	margin: 0;
}
.bron {
  color: #C60;
  font-family: Verdana,Geneva,Arial,Helvetica,sans-serif;
  font-size: 11px;
}
.paragraafkop {
	background-color: #f8e4c1;
	font-weight: bold;
	border: 0px none #A0522D;
	border-bottom: double;
	font-size: 1.1em; /* tov body */
	margin-bottom: 2px;
	margin-top: 20px;
	clear: both;
}
.paragraafkop_bronnen {
	background-color: #f8e4c1;
	font-weight: bold;
	border: 0px none #A0522D;
	border-bottom: double;
	font-size: 1.0em;
	margin-bottom: 2px;
	margin-top: 20px;
}
.subparagraafkop {
	font-weight: bold;
	border: 0px none #A0522D;
	border-bottom: thin solid;
	font-size: 1em; /* tov body */
	margin-bottom: 2px;
	margin-top: 20px;
	clear: both;
}

/************************
* OpenLayers
************************/
.ol-layerswitcher .panel ul {
	margin-top: 0;
}
.ol-layerswitcher .layerup {
  background-color: #A0522D;
  height: 1.5em;
  opacity: 0.75;
}

/************************
* Tijdbalk
************************/
#tijdbalk table {
	border: 1px groove green;
	font-size: 10.4pt;
}
#tijdbalk ul {
	margin-top: 0px;
}
#tijdbalk li {
	margin-left: -5px;
}
.tijdbalk_jaartal {
	background-color: #f8e4c1;
	font-weight: bold;
	border: 0px none #A0522D;
	border-top: double;
	font-size: 10.4pt;
	margin-bottom: 2px;
	}
.tabelkop {
	background-color: #f8e4c1;
	font-weight: bold;
	border: 0px none #A0522D;
	border-bottom: solid;
	border-bottom-width: 1px;
	text-align: left;
	}

/************************
* Forten
************************/
.forten_plaats {
	width: 200px;
}
.forten_maplink {
	width: 25px;
}
.forten_naam {
	width: 350px;
}
.forten_funct {
	width: auto;
}

/************************
* Sphider-plus zoeken
************************/
.sphider h1 {
	display: none
}
.sphider .searchBox {
	background: transparent;
	box-shadow: none;
	width: 475px;
}
.sphider input {
	padding: 4px;
}
.sphider .mainlist a {
	margin-left: 4px;
	margin-right: 4px;
}
.sphider .ui-widget {
	font-size: 0.9em;
}
.stats {
	display: none;
}


/******************************/
/* print stijlen */
/******************************/
@media print {
	@page {
		margin: 1.0cm;
	}
	body {
		font-size: 10.5pt;
	}
	a:link, a:visited {
		content: "" !important;
	}
	a:link:after, a:visited:after {
		content: "" !important;
	}
	.header {
		box-shadow: none;
	}
	#header, .header-inner {
		display: none;
	}
	#prntlogo {
		display: block;
		float: right;
		position: relative;
		width: 125px;
		height: 62px;
		margin-right: 10px;
	}
	.gridContainer, .content {
		width: 100%;
		box-shadow: none !important;
		margin: 0;
		padding: 5px;
		padding: 0;
	}
	.col-3, #sidebar_left {
		display: none;
	}
	.col-9, #maincontent_wide {
		width: 100%;
	}
}

@media only screen and (max-width: 992px) {
	#logo img {
		max-width: 170px;
	}
	.content {
		padding: 15px;
	}
}

@media only screen and (max-width: 768px) {
	[class*="col-"] {
		width: 100%;
		padding: 10px;
	}
	.col-3 {
		display: none;
	}
	.header {
		position: relative;
	}
	.sidebar_left { display: none; }
	.content {
		margin-top: 0;
		padding: 5px;
	}
}

@media only screen and (max-width: 576px) {
	#navcontainer {
		padding-right: 0;
		float: left;
	}
	#navigation {
		margin-left: auto;
		margin-right: auto;
	}
	ul#nav {
		font-size: 0.7em;
		border: none;
	}
	ul#nav li span, ul#nav li a {
		padding-left: 4px;
		padding-right: 4px;
	}
}