﻿/* FIRST RESETTING STYLES FOR DETAIL WEBPAGES */


html, body { margin:0; border:0; padding:0;	font-family:Verdana, Geneva, Tahoma, sans-serif; font-size:14px}

table; tr, th, td,  { display: table; border-collapse:collapse; border-spacing:0; height:10px; border:0; padding:0; margin:0; text-align:left ;vertical-align: top }

img {border:0;	padding:0;	margin:0; }

div, span, blockquote, iframe, h1, h2, h3, h4, h5, h6, ul; ol, li, p, a, {display:block ;border:0; padding:0; margin:0; vertical-align: top;}

a:link {color: #FFFFFF; text-decoration: none}

article, aside, figure, footer, header, section {display:block;}

flex: none


/*STYLES VOOR DE CONTENT WEBPAGES*/


/* GLOBAL STYLES */


body {background-color: #E4E4E4; }

section {background-color:#FF9148;}

div {background-color:inherit, }
	
div a {overflow:auto; }

div p {overflow:auto; }

hr {background-color:inherit;}


/* KLEURENCODES:  licht roze: #DB6FC9; licht groen #007272  licht blauw #215AAE;   licht bruin #F9DEC6    roze #FFB3BA    #FF9148 basis oranje  licht grijs #E4E4E4 */ 
/* #FFCCB1  licht roze achtergrond  #5D705A  jagersgroen (Titel)   #576F57 idem donkerder #DEC0A3  aardbruin (tekstkaders)  hoofdoranje #FF9148 */
/* BODY COLOR SHIFTS   #ff9aa2 zacht bloesem    #ffe6c9 zacht crème  #ffb784  warm oranje   #FFAC6F  abrikoos,perzik  #ffbfa1  pastel zalm    */
  
  
/* GEGEVEN BREEDTE INCLUSIEF MARGIN EN PADDING */


* {
  box-sizing: border-box;  /* in de width zijn border padding inbegrepen - margin NIET */
}
 
  
.pagecolor_D {
    margin: 0;
    padding: 0;
    /* Zachte diagonale overgang met oranje als basis */
    background: linear-gradient(
      135deg,
      #ff9148 0%,     /* basis oranje */
      #FF9F5A 25%,    /* lichter oranje */         
      #FFA566 50%,    /* abrikoos, perzik */      
      #FF9F5A 75%,    /* lichter oranje */
      #ff9148 100%    /* basis oranje */
    );
    background-attachment: fixed; /* zorgt voor stabiele achtergrond op tablets/pc */
    background-size: cover;
}


.pagecolor_R {
  margin: 0;
  padding: 0;
  /* cirkelvormige overgang radiaal vanuit het midden */
  background: radial-gradient(
    circle at center,
    #ffa566 0%,     /* abrikoos in het midden */
    #FF9F5A 40%,    /* lichter oranje */
    #ff9148 100%    /* basis oranje naar de randen */
  );
  background-attachment: fixed;
  background-size: cover;
}


.pagecolor_M {
    margin: 0;
    padding: 0;
    /* Zachte diagonale overgang tusse blauw en groen en roze */
    background: linear-gradient(
      135deg,
      #a0c4ff, /* licht blauw */
      #a0c4ff,
      #fdfdf0, /* ijs groen  */
      #f8cdda, /* oud roze  */
      #fdfdf0, 
      #a0c4ff, 
      #a0c4ff
    );
    background-attachment: fixed; /* zorgt voor stabiele achtergrond op tablets/pc */
    background-size: cover;
}


/* FRAME POSITION and CELL STYLES */   

.frame-left {
	border-collapse: collapse;
	margin-left: 3px;
	float: left;
	width: 594px;	
	}

.frame-right {
	border-collapse: collapse;
	margin-right: 3px;
	float: right;
	width: 594px;	 
	}

.frame-center {
	border-collapse: collapse;
	margin: 0 auto;
	display: flex; 
	justify-content: center; 
	align-items: center;	 
}


/* TABEL VOORAFGAAND - tussen tabellen  */

.topic-bericht {
	border-collapse: collapse;
	margin: 3px;
	padding-left:6px;
	text-align: center;
	font-family: "Georgia";
  	font-size: medium;
  	letter-spacing: 1px;
  	font-weight: normal;
	font-style:italic; 
	font-size: medium;
	color: navy;
	width: 99%;	
	}


/* TABEL HOOFDING  zonder <h>  */

.frame-heading {
	width: 100%;
	height: auto;
	background-color: #EBD2AF;
	border: 1px solid #F38A45;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	letter-spacing: 3px;
	font-weight: bold;
	color:#0000FF;
	padding-bottom: 7px;
	padding-top: 7px;
	}


/* HEADER TAGS */

h3 {
	font-family: "Bookman Old Style";
	font-size: large;
	letter-spacing: 1px;
	font-weight: normal;
	font-style:italic;	
	color: #FFFFFF;
	margin: 0;
	padding: 0;	
}


/* NOT IN USE 
h4 {
	font-family: "Bookman Old Style";
	font-size: large;
	letter-spacing: 3px;
	font-weight: bold;
	font-style:normal;
	color: #4275AB;
	margin-bottom:9px;
	margin-top:6px;
	}
*/

h5 {
	font-family: "Trebuchet MS";
	font-size: small;
	letter-spacing: 1px;
	font-weight: normal;
	font-style:italic;	
	color: #4E2E26;
	margin:0;
	padding: 0;
	}


/* NOT IN USE 
h6 {
	font-family: "Segoe UI";
	font-size: small;
	letter-spacing: 1px;
	font-weight: normal;
	font-style: normal;	
	color:#36454f; 
	margin-bottom:1px;
	margin-top:1px;
	}
*/

	
/* DOORLOPENDE TEKST in TABEL-RIJEN */ 


#content-titels { width:99%;	
	padding:1px;
	height: auto; 	
	text-align: center;	 
}


.frame-row {
	width: 100%;
	height:auto;
	background-color:#EBD2AF;
	border: solid;
  	border-width: 1px;
  	border-color:#F38A45;
  	text-align: left;
  	text-indent:0px;
	line-height:200%;
	padding-left:12px;
	padding-bottom: 3px;
	padding-top:3px;
	padding-right:3px;
 	}

.frame-link {
	width: 100%;
	height:auto;
	background-color: #FCEDE1; 
	border: solid;
  	border-width: 1px;
  	border-color:#F38A45;
  	text-align: center;
  	text-indent:0px;
	line-height:170%;
	padding-left:3px;
	padding-bottom: 5px;
	padding-top:5px;
	padding-right:3px;
	font-family: "Trebuchet MS";
	font-size: medium;
	letter-spacing: 2px;
	font-weight: normal;
	font-style:italic;	
	margin-bottom:1px;
	margin-top:1px;
	}


/* RECEPT ETIKET in WEBSHOP ETALAGE */  /* Naar CSS OPTION verplaatst  */

.bedrijf-rooster-left {
	width: 100%;
	height:auto;
	background-color: #EBD2AF;
	border: solid;
  	border-width: 1px;
  	border-color:#F38A45;
  	text-align: left;
  	text-indent:1px;
  	line-height:120%;
	padding-left:3px;
	padding-bottom: 3px;
	padding-top:3px;
	padding-right:3px;	
	}

.bedrijf-column-heads {
	font-family:Verdana;
	font-size: x-small;
	font-weight:bold;
	letter-spacing:1px;
	height:27px;
	border-style: solid;
	border-width: 1px;
	border-spacing:15px;
	text-align:center;
	}

.bedrijf-row {
	height:auto;
	border-style: solid;
	border-width: 0px;
	border-spacing:1px;
	line-height:200%;
	}

ul { 
	border-collapse:collapse;
	list-style-position: inside;
	list-style-type: circle;
	padding-left: 6px;
	padding-top:1px;
	padding-bottom:1px;
	margin:0px;
	margin-bottom: auto;
	 }

.bedrijf-etiket {
	text-align: left;
  	background-color: #FFBFC6;
  	font-family: "Calibri";
  	font-style:normal;
	font-size: small;
	color: #006666;
	width: auto;
	}

.bedrijf-value {
	text-align: left;
  	background-color: #FFBFC6;
  	font-family: "Georgia";
  	font-size: small;
  	letter-spacing: 1px;
  	font-weight: normal;
	font-style:italic;
	font-weight:500;
	color: #00246C;
	width: auto;
	}


/* POSTKAART MODEL van de POPUPS */


/* Postkaart is de container met achtergrond */

.postkaart {
    display: inline-block;
    margin:0 auto;
    padding-top: 21px;
    padding-bottom:21px;
    border-radius: 0px;
    background: linear-gradient(135deg, #a0c4ff, #a0c4ff, #fdfdf0, #f8cdda, #fdfdf0, #a0c4ff, #a0c4ff);
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  }


#content-titel { 
	text-align: center;
	background-color: #FF9148;
	margin:0;
	padding:0;
	padding-bottom:12px;
	padding-top:12px;
	border-radius: 9px;
	white-space: nowrap;
}


.icon {}

.collectie-events {
  display: flex;
  overflow-x: auto;   /* horizontale scrollbalk indien nodig */
  padding-bottom: 0px;
  background: transparant;!important;
}


.flyer-frame {
  flex: 0 0 auto;      /* blokken behouden vaste breedte */
  background: transparent;!important;
  box-sizing: border-box;    
  border: none;
  margin: 0;
  padding-top: 12px;
  padding-bottom:21px;
  }


.event-title,
.event-link,
.event-text {
  border: none;
  margin: 0; 
  background: #FCEDE1;
  text-align: center;
  text-indent: 1px;
  line-height: 150%;
  padding: 6px 6px ;
}

.event-title h5,
.event-link h5,
.event-text h5 {
  margin: 0;
}

.event-flyer img {
  display: block;
  background:inherit;
  margin: 0 auto;
}



/* ANDERE POPUPS  */


/* Behoud van titel/voetnoten-opmaak */
.table-link {
	width: 100%;
	height:auto;
	background-color: #FCEDE1; 
	border: solid;
  	border-width: 1px;
  	border-color:#F38A45;
  	text-align: center;
  	text-indent:0px;
	line-height:170%;
	padding-left:3px;
	padding-bottom: 5px;
	padding-top:5px;
	padding-right:3px;
	font-family: "Trebuchet MS";
	font-size: medium;
	letter-spacing: 2px;
	font-weight: normal;
	font-style:italic;	
	margin-bottom:1px;
	margin-top:1px;
}



/* ANDER WEBPAGE */

.frame-center {
	border-collapse: collapse;
	margin: 0 auto;
	display: flex; 
	justify-content: center; 
	align-items: center;	 
}


.frame-heading {
	width: 100%;
	height: auto;
	background-color: #EBD2AF;
	border: 1px solid #F38A45;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	letter-spacing: 3px;
	font-weight: bold;
	color:#0000FF;
	padding-bottom: 7px;
	padding-top: 7px;
	}


/* EXTERNAL HYPERLINKS &  TABEL OPMAAK #30B424   */


/* 1. Tabel gecentreerd met rijhoogte en lichtgroene dunne lijnen */

.ext-link-tabel {
  margin: 0 auto;
  padding: 0;
  border-collapse: collapse;
  border: 1px solid #90EE90;   /* lichtgroene rand */
}


/* 2. Rijen van link-tabel  */

.ext-link-tabel-rij {
	width:100%;
	border: 1px solid #90EE90;   /* lichtgroene rand */	
	text-align: left;
  	text-indent:1px;
	line-height:175%;	
}



/* 3. Titel boven de tabel */

.ext-link-titel {
  background-color:#9BBB59;  
  font-family: 'Bookman Old Style', serif;
  color: white;
  font-style:normal;
  font-weight: lighter;
  font-stretch: normal;
  font-size: 17px;
  letter-spacing: 3px;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
  padding:6px;
  width:auto;
  margin: 0 auto;
}


/* 4. Donkerbruine cel met hyperlink en groene rand */

.ext-link-dark {
  background-color: #E7CFB4; /* donkerbruin */
  font-family: 'Trebuchet MS', sans-serif;
  font-size: 14px;
  padding: 6px;
  width: auto;
  vertical-align: middle;
}

.ext-link-dark a {
  color:#6060FF;
  text-decoration: underline;
  font-weight: lighter;
  white-space: nowrap;
}

/* 5. Lichtbruine cel met hyperlink en groene rand */

.ext-link-light {
  background-color: #F0E4D5; /* lichtbruin */
  font-family: 'Trebuchet MS', sans-serif;
  font-size: 14px;
  padding: 6px;
  width:auto;
  vertical-align: middle;
}

.ext-link-light a {
  color:#6060FF;
  text-decoration: underline;
  font-weight: lighter;
  white-space: nowrap;
}



/* INTERNAL HYPERLINKS & MOUSE OVER */

/* om een afbeelding te laten verschijnen zolang de cursor er op staat */


/* If the link is unvisited you see this color*/
a:link {
        color: #6060FF;
        text-decoration: underline;
        }
  
/* If the link is visited you see this color*/
a:visited {
        background-color:ivory;
        color:#4E2E26;
        padding:5px 2px 5px 2px;
        }
 
/* On placing mouse over the link */
       
a:hover  {
	background-color:#81FFFF;
	color:#CC0C66;
	padding:5px 2px 5px 2px;
	}
