/*-- FLEXBOX --*/
.flex_container{
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	align-items: stretch;
	align-content: flex-start;}
.flex_container.middle{
	align-content: center;}
.flex_container.nowrap{
	flex-flow: nowrap;}

.flex_item{
	flex: 1 auto;}
.flex_item.start{
  align-self: flex-start;}
.flex_item.middle{
	align-self: center;}
.flex_item.end{
	align-self: flex-end;}

.container{
  width:100%;
  max-width:100%;
  margin:auto;}
.container_1600{
  width:100%;
  max-width:1600px;
  margin:auto;}
.container_1400{
  width:100%;
  max-width:1400px;
  margin:auto;}
.container_1300{
  width:100%;
  max-width:1300px;
  margin:auto;}
.container_1200{
  width:100%;
  max-width:1200px;
  margin:auto;}
.container_1100{
  width:100%;
  max-width:1100px;
  margin:auto;}
.container_1000{
  width:100%;
  max-width:1000px;
  margin:auto;}
.container_900{
  width:100%;
  max-width:900px;
  margin:auto;}
.container_800{
  width:100%;
  max-width:800px;
  margin:auto;}

.width10{width:10%;}
.width15{width:15%;}
.width20{width:20%;}
.width25{width:25%;}
.width30{width:30%;}
.width33{width:33.33%;}
.width35{width:35%;}
.width40{width:40%;}
.width45{width:45%;}
.width50{width:50%;}
.width55{width:55%;}
.width60{width:60%;}
.width65{width:65%;}
.width66{width:66.66%;}
.width70{width:70%;}
.width75{width:75%;}
.width80{width:80%;}
.width85{width:85%;}
.width90{width:90%;}
.width100{width:100%;}

.gap10{
	gap:10px;}
.gap10 .width25{
	width:calc(25% - 10px);}
.gap20{
	gap:20px;}
.gap20 .width50{
	width:calc(50% - 40px);}

/* Alle blokken naar 100% */
@media (max-width : 850px) {
	.width10, .width15, .width20, .width25, .width30, .width33, .width35, .width40, .width45, .width50, .width55, .width60, .width65, .width66, .width70, .width75, .width80, .width85, .width90, .width100{
		width:100%;
		max-width:100%;}
	.gap20 .width50{
		width:calc(100% - 40px);}
}

.minWidth100{min-width:100px;}
.minWidth150{min-width:150px;}
.minWidth200{min-width:200px;}
.minWidth250{min-width:250px;}
.minWidth300{min-width:300px;}
.minWidth350{min-width:350px;}
.minWidth400{min-width:400px;}


/*-- LAYOUT --*/

body{
	background-color: #7b1214;}


header{}
	.headerstart,
	.headerend{
		position:relative;}

.ribonstart,
.ribonend{
  width: 50%;
  height: 80px;
  position: absolute;
	top:40px;
	right:0;
	bottom:5px;
  background: #fff;}
.ribonend{
	left:0;
	background-color:#7b1214;}
.ribonstart:after{
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 0;
	z-index:1;
  border-left: 40px solid #7b1214;
  border-top: 40px solid #fff;
  border-bottom: 40px solid #fff;
	border-right: 40px solid #fff;}
.ribonend:after{
  content: "";
  position: absolute;
  left: -10px;
  bottom: 0;
  width: 0;
  height: 0;
	z-index:1;
	border-radius: 0 0 0 2px;
	border-left:40px solid #fff;
  border-right: 40px solid #7b1214;
  border-top: 40px solid #fff;
  border-bottom: 40px solid #fff;}
.ribonstart:before{
  content: "";
	z-index:0;
	width:100%;
	height:100%;
	display:block;
	background-color: #fff;
	border-radius: 0 0 4px 0;
	filter: drop-shadow(6px 5px 3px rgba(0,0,0,0.50));}
.ribonend:before{
  content: "";
	z-index:0;
	width:80%;
	height:100%;
	display:block;
	background-color:#7b1214;
	filter: drop-shadow(0 5px 3px rgba(0,0,0,0.50));}


ribon{
	position:absolute;
	/* top:70px; */
	display:flex;
	min-height: 50px;
	/* background-color: #fff; */
	width:100%;}
	ribon .ribonLeft{
		position:relative;
		width:10%;
		max-width:30px;
		/* background-color: #fff; */
		filter: drop-shadow(6px 5px 3px rgba(0,0,0,0.50));}
	ribon .ribonLeft:after{
		content: "";
	  position: absolute;
	  left: 0;
	  bottom: 0;
	  width: 0;
	  height: 0;
		z-index:0;
	  border-left: 20px solid transparent;
	  border-top: 25px solid #fff;
	  border-bottom: 25px solid #fff;
		border-right:15px solid #fff;}
	ribon .ribonCenter{
		margin:-10px 0 10px 0;
		background-color: #fff;
		z-index:1;
		width:80%;
		min-width:calc(100% - 60px);
		border-radius: 2px 2px 0 0;
		filter: drop-shadow(6px 5px 3px rgba(0,0,0,0.50));}
	ribon .ribonRight{
		position:relative;
		width:10%;
		max-width:30px;
		/* background-color: #fff; */
		filter: drop-shadow(6px 5px 3px rgba(0,0,0,0.50));}
	ribon .ribonRight:after{
	  content: "";
	  position: absolute;
	  left: -5px;
	  bottom: 0;
	  width: 0;
	  height: 0;
		z-index:1;
		border-radius: 0 0 0 2px;
		border-left:20px solid #fff;
	  /* border-right: 25px solid #7b1214; */
	  border-right: 25px solid transparent;
	  border-top: 25px solid #fff;
	  border-bottom: 25px solid #fff;}

@media (max-width : 720px) {
	.ribonLeft,
	.ribonRight{
		display:none;
	}
	ribon .ribonCenter{
		margin:-10px 0 10px 0;
		width:100%;
	}
}

	.logo_wrap{
		margin-top:30px;
		flex:1 auto;
		min-width:150px;
		max-height:120px;
		min-height:80px;
		position:relative;
		background-color:#fff;
		z-index:2;
		border-radius: 2px 0 0 2px;
		filter: drop-shadow(2px 5px 3px rgba(0,0,0,0.50));}
    .logo_wrap a{
			display:block;
			position:absolute;
			top: -30px;
			left: 20px;}
      .logo_wrap .logo{
				width:130px;}
@media (max-width : 1000px) {
	.logo_wrap{
		min-width:100px;}
	.resp{display: none;}
}

	.menu_wrap{
		margin-top:30px;
		flex:2 auto;
		padding:0;
		min-height:80px;
		background-color:#fff;
		z-index:2;
		border-radius: 0 2px 2px 0;
		filter: drop-shadow(6px 5px 3px rgba(0,0,0,0.50));}
		/* hamburger */
    .mini-menu_wrap{
      display:none;}
		.mini-menu_wrap .fa-bars{
			cursor:pointer;
			font-size:2em;}
		/* menu */
		.main-nav ul {
			margin: 0;
			padding: 0;
			min-height:80px;
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			list-style: none;}
		.main-nav ul li{
      display: flex;
      flex-direction: column;
			justify-content: center;
			align-items: center;}
		.main-nav ul li a{
			padding:0 20px;
			width:100%;
			text-transform: uppercase;
			color: #333;
			font-size:1.3em;
			font-family: 'Barlow Bold', sans-serif;
			text-decoration: none;}
.main-nav ul li a:hover,
.main-nav ul li.active a{
	color: #630d0d;}
.main-nav ul li.active{
	border-bottom:4px solid #630d0d;}
.main-nav ul li#over-ons a:hover,
.main-nav ul li#over-ons.active a{
	color: #1546b7;}
.main-nav ul li#over-ons.active{
	border-bottom:4px solid #1546b7;}

.main-nav ul li#springkastelen a:hover,
.main-nav ul li#springkastelen.active a{
	color: #cea413;}
.main-nav ul li#springkastelen.active{
	border-bottom:4px solid #cea413;}
.page_springkastelen .minisubmenuList li a{
	display: block;
	color: #630d0d;
	border-bottom:1px dashed #630d0d;
	text-decoration: none;}
.page_springkastelen .submenu li.product a:before{
	color: #775d08;}
.page_springkastelen .minisubmenuList li.product a,
.page_springkastelen .submenu li.product a{
	color:#775d08;
	border-bottom:1px dashed #cea413;}
.page_springkastelen .minisubmenuList,
.page_springkastelen .submenu{
	background-color: #edd380;}

.main-nav ul li#zaalshows a:hover,
.main-nav ul li#zaalshows.active a{
	color: #9315b7;}
.main-nav ul li#zaalshows.active{
	border-bottom:4px solid #9315b7;}
.page_zaalshows .minisubmenuList li a{
	display: block;
	color: #630d0d;
	border-bottom:1px dashed #630d0d;
	text-decoration: none;}
.page_zaalshows .submenu li.product a:before{
	color: #9315b7;}
.page_zaalshows .minisubmenuList li.product a,
.page_zaalshows .submenu li.product a{
	color:#9315b7;
	border-bottom:1px dashed #d579f2;}
.page_zaalshows .minisubmenuList,
.page_zaalshows .submenu{
	background-color: #e3d0e8;}

.main-nav ul li#verjaardagen a:hover,
.main-nav ul li#verjaardagen.active a{
	color: #159eb7;}
.main-nav ul li#verjaardagen.active{
	border-bottom:4px solid #159eb7;}
.page_verjaardagen .minisubmenuList li a{
	display: block;
	color: #630d0d;
	border-bottom:1px dashed #630d0d;
	text-decoration: none;}
.page_verjaardagen .submenu li.product a:before{
	color: #036c7f;}
.page_verjaardagen .minisubmenuList li.product a,
.page_verjaardagen .submenu li.product a{
	color:#036c7f;
	border-bottom:1px dashed #159eb7;}
.page_verjaardagen .minisubmenuList,
.page_verjaardagen .submenu{
	background-color:	#bed3dd;}

.page_nieuws .minisubmenuList li a{
	display: block;
	color: #630d0d;
	border-bottom:1px dashed #630d0d;
	text-decoration: none;}
.page_nieuws .submenu li.product a:before{
	color: #630d0d;}
.page_nieuws .minisubmenuList li.product a,
.page_nieuws .submenu li.product a{
	color:#630d0d;
	border-bottom:1px dashed #630d0d;}
.page_nieuws .minisubmenuList,
.page_nieuws .submenu{
	background-color: #eed2d2;}

.main-nav ul li#reservatie a:hover,
.main-nav ul li#reservatie.active a{
	color: #d15a12;}
.main-nav ul li#reservatie.active{
	border-bottom:4px solid #d15a12;}

.minisubmenu{
	display:none;}
.minisubmenu .mini-subnav{
	padding:20px;}
.minisubmenu .mini-subnav .fa{
	color:#fff;
	font-size:2em;
	cursor:pointer;}
.minisubmenuList{
	display:none;
	max-height:30vh;
	overflow-y: scroll;}
.minisubmenuList li{
	padding:5px 20px;
	/* width:calc(50% - 10px); */
	width:100%;
	/* display:inline-block; */
}

@media (max-width : 1000px) {
	.minisubmenu{
		display:block;}
	.submenu{
		display:none;}
	.headermiddle{
		background-color:#fff;}
	.headerstart,
	.headerend{display:none;}
	.logo_wrap{
		margin-top:0px;
		min-height:inherit;}
	.menu_wrap{
		margin-top:0px;}
}

section.news,
section.about{
	position:relative;}
section.news article,
section.about article{
	border: 7px solid #fff;
	background-color: #981b1e;
	height:calc(100% - 80px);}
section.welcome article{
	height:calc(100% - 80px);
	display: flex;
  align-items: center;
  justify-content: center;}
section.welcome img{max-width:100%;display:block;margin:auto;}
section.news ribon{
	top:80px;}
section.news ribon .ribonCenter{
	font-size:1.5em;
	font-family: 'Barlow Bold', sans-serif;
	color: #630d0d;}
section.about ribon{
	bottom:60px;}
section.about ribon .ribonCenter{
	font-size:1.5em;
	font-family: 'Barlow Bold', sans-serif;
	color: #1546b7;}
section.about article,
section.about article a,
section.news article,
section.news article a{
	color:#fff;}
section.welcome{
	background-image:url('../img/bgGrad.jpg');
	background-size:contain;
	background-repeat:no-repeat;
	background-position: center;}

/* section.about img{max-width:40%;display:block;margin:auto;} */

section.about figure{
	width:100%;
	max-height:200px;
}
section.about figure img{
	width:100%;
	max-height:200px;
	object-fit: cover;
	object-position: 100% 20%;
}

@media (max-width : 720px) {
	section.news ribon{
		top:50px;}
	section.about ribon{
		bottom:40px;}
	section.news article,
	section.about article,
	section.welcome article{
		height:calc(100% - 40px);}
	section.welcome img{max-width:60%;display:block;margin:auto;}
}
@media (max-width : 1050px) {
	section.welcome{
		order: 1;
	}
	section.news,
	section.about{
		order: 5;
	}
}

.quadro section{
	border: 7px solid #660303;
	background-color: #981b1e;
	position:relative;
	min-width:250px;}
.quadro article h5{
	background-color: #660303;
	color:#fff;
	text-align: center;
	margin:0;
	min-height:40px;
	font-size:1.1em;}
.quadro .icon{
	position: absolute;
	bottom:-30px;
	left:calc(50% - 60px)}
	.quadro .icon img{
		width:120px;
		max-width:120px;
	}

.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
	background-color:rgba(255,255,255,0.8);
	z-index: 999;
}
.sticky:before,
.sticky:after {
  content: '';
  display: table;}

.submenu ul{
	margin:20px 0;
}
.submenu ul,
.submenu ul li,
.submenu ul li.product{
  list-style: none;}
.submenu ul li a{
	background-color: #660303;
  color:#edd380;
  text-decoration: none;
	display:block;
	font-family: "Dosis medium";
  font-size:1.2rem;
	margin:10px 0;
	padding: 10px 20px;
	box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.4);}
.submenu ul li.product a{
	/* font-family: "Dosis medium"; */
	font-family: "Dosis semi bold";
	background:none;
	margin:0 20px;
	padding:0;
	box-shadow: none;}
.minisubmenuList li.product a,
.submenu li.product a{
	font-family: "Dosis medium";
  display:block;
	background:none;}
.submenu li.product a:before{
  font-family: "fontAwesome";
  content: "\f105";
  font-size: 1.4rem;
  font-weight:400;
  padding-right:10px;}
.minisubmenuList li a.active,
.submenu li.product a.active{
  font-family: "Dosis extra bold";}
.submenu li.product a.active:before{
	content: "\f0da";
  font-weight:400;}

.submenu .btnBackward{
  position: absolute;
  left:10px;
  top:3px;}
.submenu .btnForward{
  position: absolute;
  right:10px;
  top:3px;}
.submenu .btnBackward .fa,
.submenu .btnForward .fa{
  font-size:2em;}

@media (max-width : 1000px) {
  .submenu li a{
    height:40px;
    line-height:40px;
    white-space: nowrap;
    padding:0 10px;}
}

section,
main{
  min-height:100px;}

footer{
	font-size:90%;
	line-height:1.6em;
	padding:20px 20px 30px 20px;
  background-color:#660303;}
footer span{
	display:block;}
footer .small_logo{
	max-width: 100px;
	max-height:100px;
	margin:auto;}
footer .socials .fa{
	color:#fff;
	font-size:1.5em;
	padding:0 5px 5px 0;}
footer article p,
footer article p a,
footer div[role='navigation'] a{
	color:#fff;}
footer article ul li:before {
	content: "";}

footer .flex_container{
	height:100%;
	align-items:stretch;}
footer .flex_container .flex_item{
	align-self: center;}
footer div[role=navigation]{
	align-self:flex-start;}
footer .socials{
	justify-content: center;}
footer .company{
	min-width:350px;}

@media (max-width : 800px) {
	footer .companyWrap,
	footer .navigationWrap{
		width:100%;}
	footer .navigationWrap{
		padding:20px;
		background-color:#560202;}
	footer .navigationWrap ul li{
		text-align: center;}
}


.link{
	color:#777;
	height:44px;
	line-height:46px;
	border-radius:22px;
	border:1px solid #777;
	display:inline-block;
	font-weight:300;
	text-decoration: none;
	padding:0 20px;
	white-space: nowrap;
  background-color:#fff;}
.link:hover{
    background-color:#f3d083;
}
.link:after{
  line-height:19px;
  display:inline-block;
	font-family: 'fontAwesome';
	content: "\f105";
	margin-left:15px;}

.sub{
	color:#777;
	min-height:33px;
/*	line-height:35px;*/
	border-radius:17px;
	border:1px solid #777;
	display:inline-block;
	font-weight:300;
	text-decoration: none;
	padding:4px 15px;
	margin:0 15px 10px 0;
    line-height:1.5;
/*	white-space: nowrap;*/
    background-color:#fff;
/*	min-width:250px;*/
/*	max-width:280px;*/
}
.sub.active,
.sub:hover{
    color:#1c5661;
	font-weight:500;}
.sub:before{
    line-height:19px;
    display:inline-block;
	font-family: 'fontAwesome';
	content: "\f105";
	margin-right:8px;}


.album ul{
  display: flex;
  flex-wrap: wrap;}
.album li{
	height: 40vh;
	flex-grow: 1;}
.album ul li:last-child{
	flex-grow: 10;}
.album{
	justify-content: space-between;}
.picGrid {
	/* height:100px; */
	overflow: hidden;
	object-fit: cover;
	object-position: 100% 20%;}
.picGrid img{
	height:120px;}
.album img{
  max-height: 100%;
  min-width: 100%;
  object-fit: cover;
	object-position: 50% 70%;
  /* vertical-align: bottom;
  vertical-align: center; */
	border:1px solid #fff;}

@media (max-aspect-ratio: 1/1) {
	.album li{
		height: 30vh;}
}
@media (max-height: 480px) {
	.album li{
	  height: 80vh;}
}
@media (max-aspect-ratio: 1/1) and (max-width: 480px) {
	.album ul{
		flex-direction: row;}
	.album li {
  	height: auto;
    width: 100%;}
	.album img {
    width: 100%;
    max-height: 75vh;
    min-width: 0;}
	}

	.sidebar{
		position:fixed;
		top:0;
		right:0;
		background-color:#000;
		height:400px;
		color:#fff;
	}
	.sidebar:before{
		content
	}

.docList li:before{
	content: '';
	margin:0;
}
.docList li a{
	display:block;
	margin:5px 0;
	padding:8px;
	/* background-color: aqua; */
	background-color: #e6d096;
	color: #7b1214;
	border-radius:10px;
	overflow:hidden;
	white-space:nowrap
}

.block{
	box-shadow: 5px 5px 5px 0 rgb(46 50 50 / 30%);
	background-color: #e6d096;
	border-bottom-right-radius: 20px;
	position: relative;
}
.block .blockTitle{
	background-color: #7b1214;
	font-family: "Dosis bold";
	font-size:1.1em;
  font-weight: normal;
  color: #FFF;
  padding: 5px 10px;
}
.block .blockBody{
	padding: 5px 10px;
}
.block .blockIco{
	position:absolute;
	top:-15px;
	right:5px;
	width:65px;
}
.star{
	background-image:url('../img/ster.png');
	background-size:cover;
	background-position:center;
	width:200px;height:200px;
	margin:-40px 0 -30px 20px;
	position:relative;
	z-index:999;
	rotate: 10deg;
	filter: drop-shadow(0 0.2rem 0.2rem rgb(46 50 50 / 80%));
}
.star section{
	margin:0;position:absolute;
	top:50%;left:50%;
	transform: translate(-50%, -60%);
	text-align:center;
	font-size: 0.8em;
}
.star section p{
	margin:0;
	line-height:1;
	font-family: 'Dosis extra bold', sans-serif;
}

article.relative{
	position:relative;}
.pageIcon{
	position:absolute;
	right: 0;
	top: -80px;
	width:100px;}

/*-- MISCELLANEOUS --*/
.bg_white{
	background-color:#ffffff;}
.bg_lichtgrijs{
	background-color:#efefef;}
.bg_lichtlichtgrijs{
	background-color:#f9f9f9;}
.bg_gifgroen{
	background-color:#97B72A;}
.bg_lichtgroen{
	background-color:#E4EFC4;}

.border_dashed{
  border-width:0px;
  border-style: dashed;}
.border_dotted{
  border-width:0px;
  border-style: dotted;}
.border_gifgroen{
  border-width:1px;
	border-color:#97B72A;}
.border_bottom_gifgroen{
	border-bottom-width:1px;
	border-bottom-color:#97B72A;}
.border_top_gifgroen{
	border-top-width:1px;
	border-top-color:#97B72A;}
.border_left_gifgroen{
	border-left-width:1px;
	border-left-color:#97B72A;}
.border_right_gifgroen{
	border-right-width:1px;
	border-right-color:#97B72A;}

.gray{
	color:#888;}
.black{
	color:#000;}
.firebrick{
	color: firebrick;}
.gifgroen{
  color:#97B72A;}

hr{
  display:block;
  height:1px;
  border:0;
  border-top: 1px solid #7b1214;
  margin:1em 0;
  padding:0;}
hr.fat{
  border-width:5px;}
hr.lichtgroen{
	border-color:#E4EFC4;}
.objcentered{
  margin:auto;
}

.margin10_30{
    margin:10px 30px;}
.margin15_30{
    margin:15px 30px;}
.margin20_30{
    margin:20px 30px;}
.margin10_40{
    margin:10px 40px;}
.margin15_40{
    margin:15px 40px;}
.margin20_40{
    margin:20px 40px;}
.margin10_50{
    margin:10px 50px;}
.margin15_50{
    margin:15px 50px;}
.margin20_50{
    margin:20px 50px;}
.margin10{
    margin:10px;}
.margin20{
    margin:20px;}
.margin30{
    margin:30px;}
.margin40{
    margin:40px;}
.margin50{
    margin:50px;}
.nomargin{
	margin:auto;}
@media (max-width : 720px) {
    .margin10_30,
    .margin15_30,
    .margin20_30,
    .margin10_40,
    .margin15_40,
    .margin20_40,
    .margin10_50,
    .margin15_50,
    .margin20_50,
    .margin10,
    .margin20,
    .margin30,
    .margin40,
    .nomargin{
        margin:20px;
    }
}
article.marginauto{
	margin-left:auto;
	margin-right:auto;}

.padding10{
  padding:10px;}
.padding20{
  padding:20px;}
.padding30{
  padding:30px;}
.padding40{
  padding:40px;}
.nopadding{
  padding:0;}
@media (max-width : 720px) {
  .padding10,
  .padding20,
  .padding30,
  .padding40,
  .nopadding{
    padding:20px;}
}

.clear{clear:both;}
.clear_5{clear:both;height:5px}
.clear_10{clear:both;height:10px}
.clear_15{clear:both;height:15px}
.clear_20{clear:both;height:20px}
.clear_30{clear:both;height:30px}
.clear_40{clear:both;height:40px}
.clear_50{clear:both;height:50px}

.centered{
	text-align: center;}
.lefted{
	text-align: left;}
.righted{
	text-align: right;}
figure img{
	display:block;
	max-width:100%;}
.objectfit img{
	object-fit: cover;}

/*-- TEMPLATE	--*/
.example{
  min-height:200px;
	min-width:360px;
  display:inline-block;
  resize:horizontal;
  overflow:auto;
  border-radius:8px 8px 0 8px;
  border:1px solid #ccc;}

.example .flex_container{
	margin:10px;
	border:px solid rebeccapurple;}
.example .flex_container .flex_container{
	margin:0;
	border:1px solid blueviolet;}

.example .flex_container .flex_item{
  background-color: deeppink;
	border:5px solid rebeccapurple;
  min-height: 100px;}
.example .flex_container .flex_item .flex_container .flex_item{
  background-color: hotpink;
	border:5px solid blueviolet;
  min-height: 100px;}

.example .flex_item span{
	margin:5px;
	padding:5px;
	display:block;
	height:80px;}
pre{
	font-family: monospace;
  background-color:#efefef;
  display:inline-block;
  margin:10px;
  padding-right:20px;
  border-radius:8px;
  border:1px solid #ccc;}
code{
  font-family: monospace;
	font-style: normal;
  font-size:110%;}
.example .legende{
	margin:10px;}
.example .legende .rebeccapurple{
	color:rebeccapurple;}
.example .legende .blueviolet{
	color:blueviolet;}
.example .legende .deeppink{
	color:deeppink;}
.example .legende .hotpink{
	color:hotpink;}

@media (max-width : 850px) {
	.example{
		width:100%;}
	.example .flex_container .width50{
		width:50%;}
	.example .flex_container .width25{
		width:25%;}
}
@media (max-width : 850px) {
	.example .flex_container{
		max-width:100%;
	}
	.example .flex_container .width25,
	.example .flex_container .width50{
		width:100%;
	}
	.example .nested .width100,
	.example .nested .width50{
		width:33%;
	}
}
@media (max-width : 650px) {
	.example .nested .width100,
	.example .nested .width50{
		width:100%;
	}
}
.idem{
	font-size:0.9em;
	color:#999;
}