/* css STA-shop 
kleuren: 
donkerblauw: #1B2155 / blauw60: #43569A /  blauw80: #3B469F / blauw wapen: #332483 / lichtblauw80: #2473D8 / grijsblauw: #E2DFDA 
goud: #CC9933 / lichtgoud: #F5EBD6 / rood: #D61820 / geel wapen: #F5B900

header, nav, section, article {
	display:block;
} */

body {
	margin:0;
	padding:0;
/*	font-family:"Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif; */
	font-family:dejavu;
	font-size:1em;
	overflow-y: scroll;
	text-align: center;
	color:#1B2155;
}

header {
	width:100%;
	background-color:#fff; 
	color:#3B469F;
	padding:0.5em 0 0.1em 0;
	border-bottom:3px #D61820 solid; 
}

header {
	display:flex;
	justify-content:center;
	align-content:center;
}
header h1 {
	font-size:2.5em;
	text-shadow:2px 2px 5px #E2DFDA;
	margin:0; 
	padding:0.2em;
}
header div {
	padding:0.2em;
}

nav {
	background-color:#fff; 
	font-size:1.2em;
	letter-spacing:0.03em;
	word-spacing:0.03em;
	font-family:tahoma; 
}

section {
	padding:0 1em;
	background-color:#fff; 
}

aside {
	padding:0 1em;
	background-color:#fff; 
}

footer { 
	width:100%;
	text-align:center;
	background-color:#E2DFDA; 
	padding:0.5em;
}

h1 {
	text-align:left;
	font-family:retro;
	color:#43569A;
	letter-spacing:0.03em;
	word-spacing:0.03em;
}
h2,h3,h4,h5,h6 {
	font-family:zurich;
	color:#43569A;
	letter-spacing:0.03em;
	word-spacing:0.03em;
}

img {
	max-width:100%;
	height:auto;
}
figure {
	margin:1em 0;
	box-shadow:2px 2px 5px 1px #E2DFDA;
	max-width:100%;
	display:inline-block;
	text-align:center;
	border-bottom:0.1em #D61820 solid;
}
figure img {
	padding:0.5em;
	border:0.1em #E2DFDA solid;
	background-color:#fff;
}
figure p {
	text-align:left;
	font-family:zurich;
	padding:0 5px;
}
figcaption {
	text-align:left;
	font-size:0.9em;
	font-family:zurich;
	color:#2473D8;
	padding:0 5px;
	}

a {
	font-weight:bold;
	text-decoration:none;
	color:#741f5b;
	letter-spacing:0.02em;
	word-spacing:0.02em;
}
a:hover {
	color:#2473D8;
}

table {
	margin:10px 0;
}
tr:nth-child(even) {
	background-color:rgba(255, 255, 255, 0.5);
}

table, th, td {
	border-collapse:collapse; 
	border:1px #2473D8 solid;
}
th, td {
	padding:0 0.5em;
	text-align:left;
}
th:last-child, td:last-child {
	width:5em;
}

hr {
	color:#43569A;
	width:100%;
}
ul {
	padding:0 0 0 1em;
}
li {
	margin:0;
	padding:0;
	list-style-type:square;
} 

@font-face {
	font-family:bellgoth;
	src:url('docs/bellgoth.woff');
}
@font-face {
	font-family:dejavu;
	src:url('docs/dejavu.woff');
}
@font-face {
	font-family:tahoma;
	src:url('docs/tahoma.woff');
}
@font-face {
	font-family:zurich;
	src:url('docs/zurich.woff');
}
@font-face {
	font-family:tcm;
	src:url('docs/TCM.woff');
}
@font-face {
	font-family:retro;
	src:url('docs/retrofont.woff'); /* font MarketDeco */
}

.container {
	text-align:left;
}

label {
	width:250px;
	display:inline-block;
}

.flt-L {
	float:left;
}
.flt-R {
	float:right;
}

.logo {
	width:10em;
	min-width:7em;
	padding:0.6em; 
	background-color:#fff; 
}
.logo2 {
	width:6em;
	min-width:4em;
	padding:0.1em; 
	background-color:#fff; 
}
.logo-b {
	width:10em;
	min-width:7em;
	padding:0.1em; 
	border:1px #E2DFDA solid;
	background-color:#fff; 
}
.logo-header {
	width:100%;
	max-width:600px;
}

.fotocompl {
	width:600px;
}
.fotocompl-line {
	width:800px;
	margin-bottom:20px;
}
.fotocompl-100 {
	width:100%;
	margin-bottom:20px;
}
.fotocompl-50 {
	width:50%;
}
.fotocompl-30 {
	width:30%;
}

.item-1 a:hover, .item-2 a:hover, .item-3 a:hover, .item-4 a:hover {
/*	border:1em #303E85 solid; */
	box-shadow:2px 2px 5px 1px #303E85;
	}

.foto {
	width:350px;
	margin:10px;
	border:1px #3B469F solid;
	box-shadow:2px 2px 2px 5px #E2DFDA;
}

/* foto container - ul */
.foto-container {
	display:grid;
	grid-template-columns:repeat(auto-fill,minmax(5em,1fr));
	grid-template-rows:;
	grid-gap:1em;
	grid-auto-flow:dense;
	list-style:none;
	margin:1em 0;
	padding:1em;
	max-width:100%;
}
.foto-container li {
	grid-column-start: span 2; 
	list-style:none;
}
.foto-container li img:hover {
	border:1px #D61820 solid;
} 

.foto-container li.portrait {
	grid-column-start: span 1;
} 
.foto-container li img {
	display:block;
	object-fit:cover;
	width:100%;
	height:auto;
	border:1px #E2DFDA solid; 
}

/* foto zoom */
.groot3t10 {
	width:30%; 
	transition: width 3s ease;
}
.groot3t10:hover {
	width:100%;
}

/* kolommen */
.kolom {
	column-width:20em; 
	column-gap:2em; 
	column-rule:0.1em #1B2155 solid;
	border-bottom:0.1em #D61820 solid;
}
.kolom p,h3 {
/*	margin-top:0; */
} 
.kolom h3 {
	column-span:all;
}

/* STA shop */
.blok {
	margin:0;
	padding:0;
	width:100%;
	border-bottom:0.1em #D61820 solid;
}

.kopArtikel {
	border-top:0.1em #1B2155 solid;
}
.fotoArtikel {
	border:0.1em #3B469F solid;
}
.textArttxt {
	color: #142952;
	border:0.1em #D61820 solid;
} 


/* go to top */
#myBtn {
	display: none;
	position: fixed;
	bottom: 20px; /* space from bottom */
	right: 20px; /* space from right */
	z-index: 99;
	cursor:default; /* Add a mouse pointer on hover */
	font-size:x-large;  /* Font size */
	border: none;  /* remove border */
	outline: none; /* remove outline */
	background-color:#3B469F; 
	color:#E2DFDA; 
	padding:0.4em 0.6em; 
	border-radius:50%; 
	opacity:0.8;
}
#myBtn:hover {
	background-color:#D61820; 
}

/* responsive: */

* {
	box-sizing:border-box;
}

.cent-cont { /* center for large screen  */
	margin-left:auto;
	margin-right:auto;
	max-width:1200px; 
}
 
.row {
	display:flex;
	flex-wrap:wrap;
} 

.cont-center {
	display:flex;
	justify-content:center;
	align-content:center;
}


 /* For mobile phones: */
@media screen and (max-width: 600px) {
	.navbar {
		width:100%;
		padding:0.5em;
	}
	.main {
		width:100%;
		border-top:2px #D61820 solid;
	}
	.side {
		width:100%;
		border-top:2px #D61820 solid;
	}
	.main-full {
		width:100%;
		border-top:2px #D61820 solid;
	}
	.item-4 {
		max-width:49%;
	}
	.item-3 {
		max-width:100%;
	}
	.item-2 {
		max-width:100%;
	}
	.item-1 {
		max-width:100%;
	}
	.knop {
		padding:0.5em;
		margin:0.5em;
		background-color:rgba(226, 223, 218,0.7);
		border:0.1em #D61820 solid;	
		border-radius:1em;
		box-shadow:2px 2px 5px 1px #E2DFDA;
		text-align:center;
	}

}

@media screen and (min-width: 601px) {
  /* For tablets: */
	.navbar {
		width:100%;
		padding:0.5em 1em 1em 0.1em;
	}
	.main {
		width:60%;
		border-top:2px #D61820 solid;
		border-right:1px #D61820 solid;
	}
	.side {
		width:40%;
		border-top:2px #D61820 solid;
	}
	.main-full {
		width:100%;
	}
	.item-4 {
		max-width:49%;
	}
	.item-3 {
		width:32%;
	}
	.item-2 {
		width:49%;
	}
	.item-1 {
		width:95%;
	}
	.knop {
		display:none;
	}	
}

@media screen and (min-width: 900px) {
  /* For large screens: */
	.navbar {
		width:100%;
		padding:0.5em 1em 1em 0.1em;
	}
	.main {
		width:60%;
		border-top:0;
		border-right:1px #D61820 solid;
/*		border-left:1px #D61820 solid; */
	}
	.side {
		width:40%;
		border-top:0;
	}
	.main-full {
		width:100%;
/*		border-right:1px #D61820 solid; 
		border-left:1px #D61820 solid;*/
	}
	.item-4 {
		max-width:24%;
	}
	.item-3 {
		width:32%;
	}
	.item-2 {
		width:49%;
	}
	.item-1 {
		width:90%;
	}
	.knop {
		display:none;
	}	
}