

* {
	box-sizing: border-box;
}

body {
	margin: 0;
	font: 14px/24px 'Open Sans', sans;
	font-weight: 300;
}

.wrapper	{
	width: 100%;
	overflow: auto;
}

header	{
	margin: 60px auto 50px auto;
	width: 20%;
}

header img	{
	width: 100%;
}

.headPic	{
	width: 100%;
}

.headPic img	{
	width: 100%;
	display: block;
}

.headPic2	{
	background-image: url(images/interior1.jpg);
	background-size: cover;
	width: 100%;
	height: 70vw;
	display: flex;
	justify-content: center;
	align-items: center;
}

.headline	{
	color:  #fff;
	font: 20px/32px 'Open Sans', sans;
	font-weight: 300;
	background-color: rgba(0, 0, 0, 0.7);
	padding: 10px;
	text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.headline table {
    width: 100%;
}

.headline table img {
    border: 7px solid white;
}

.headline a	{
	text-decoration: none;
	color: #fff;
	display: block;
	width: 150px;
	border: 1px solid #fff;
	margin: 0 auto;
}

.headline a:hover	{
	background-color: rgba(156, 134, 94, 0.8);
}

.headline table td {
    padding: 10px;
}

.headline table td img {
    width: 35%;
}

.kaderTekst	{
	color: #fff;
	display: block;
	
	border: 1px solid #fff;
	padding: 0 7px 0 7px;
    background-color: rgba(156, 134, 94, 0.8);
}

strong	{
	font-weight: 400;
}

section	{
	background-color: #ececec;
	padding: 60px 70px 250px 5.5%;
}

figure	{
	width: 50%;
	margin: -190px 5.5% 0 0;
	float: right;
	padding-bottom: 10px;
}

figure img	{
	width: 100%;
}

blockquote	{
	margin: 20px 0 0 0;
}

.pictures	{
	width: 89.3%;
	margin: 80px auto 120px auto;
	padding: 0 0 0 0;
	overflow: auto;
}

.pictures img	{
	width: 31.8%;
	float: left;
	margin-right: 1.5%;
}

.coffeePic	{
	width: 100%;
}

.coffeePic img	{
	width: 100%;
}

.txt1   {
    width: 30%;
    margin: 70px 0 0 80px;
}

.pottekes   {
    width: 100%;
    background-color:#ededed;
    display: flex;
	justify-content: center;
    margin: 70px 0 300px 0;
}

.pottekesAlign   {
    width: 80%; 
    //border: 1px solid red;
}

.txtAlign1   {
    width: 100%;
    display: flex;
	justify-content: flex-end;
}

.pottekesTxt1   {
    width: 50%;
    text-align: end;
    margin: 50px 2% 90px 0;
}

.pottekesAlign img   {
    width: 31.3%;
    margin-right: 2%;
}

.pottekesAlign img:nth-child(4)   {
    margin-right: 0;
}

.txtAlign2   {
    width: 100%;
    display: flex;
	justify-content: flex-start;
}

.pottekesTxt2   {
    width: 50%;
    margin: 50px 0 90px 0;
}

.broodnmuziek   {
    width: 100%;
    background-color:#ededed;
    display: flex;
	flex-direction: column;
    align-items: center;
    margin: 70px 0 0 0;
}

.broodnmuziekTop    {
    width: 80%;
    margin-top: -170px;
    display: flex;
    justify-content: space-between;
}

.broodnmuziekimgTop img {
    width: 50%
}

.broodnmuziekTxtTop    {
    margin: 40px 0 0 0;
}



.broodnmuziekBottom    {
    width: 70%;
    margin: 70px 0 70px 0;
    //display: flex;
    //justify-content: space-between;
    float: left;
}

.broodnmuziekTxtBottom    {
    margin: 20px 0 0 0;
    width: 40%;
    float: left;
}


.broodnmuziekimgBottom img  {
    width: 45%;
    float: right;
}



.gatherings {
    width: 100%;
    display: flex;
	flex-direction: column;
    align-items: center;
    
}

.gaterhingsContent  {
    width: 55%;
    margin: 70px 0 100px 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

.gaterhingsTxt  {
    width: 80%;
}

.bloemen    {
    width: 15%;
    padding-right: 30px;
}

.bloemen img   {
    width: 100%;
    display: block;
}

.hrdz	{
	width: 100%;
}

.hrdz img	{
	width: 100%;
}


.baseline	{
	width: 100%;
    margin: 50px 0 30px 0;
	text-align: center;
	letter-spacing: 1px;
    font: 15px/24px 'Open Sans', sans;
    font-weight: 600;
}


.openingsuren	{
	width: 100%;
	text-align: center;
    font: 12px/24px 'Open Sans', sans;
	letter-spacing: 2px;
	font-weight: 400;
}

footer	{
	min-height: 50px;
	background-color: #a29061;
	margin: 70px 0 0 0;
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	letter-spacing: 1px;
}

footer a	{
	color:  #fff;
	text-decoration: none;
}

footer a:hover	{
	text-decoration: underline;
}

footer img	{
	width: 20px;
	margin-left: 5px;
	display: block;
}

footer a:nth-child(2)	{
	margin-left: 0;
}

.sm	{
	display: flex;
	margin: 0 0 0 10px;
}

.italic {
  font-style: italic;
}

.link-reset {
  color: inherit;
  text-decoration: none;
}


@media screen and (max-width: 900px) {
	
	header	{
		margin:  60px auto 50px auto;
		width: 30%;
	}

	footer	{
		font: 11px/12px 'Open Sans', sans;
	}
    

    .headline table td img {
        width: 60%;     /* foto homepage */ 
        margin-top: 50px;
    }
    

    .pictures	{
        margin: 50px auto 80px auto;
    }
    
    .txt1   {
        width: 90%;
        margin: 70px 0 0 5%;
        transition: .5s all;
    }

    
    .pottekes   {
        margin: 70px 0 150px 0;
    }

    .pottekesTxt1   {
        width: 100%;
        margin: 50px 2% 70px 0;
    }
    
    .pottekesAlign img   {
        width: 30%;
        margin-right: 2%;
        transition: .5s all;
    }
    
    .pottekesTxt2   {
        width: 100%;
        margin: 50px 0 90px 0;
    }
    
    .broodnmuziekTop    {
        margin-top: -100px;
    }
    
    .broodnmuziekimgTop img {
        width: 80%;
        transition: .5s all;
    }
    
    .broodnmuziekTxtBottom    {
        margin: 10px 0 30px 0;
        width: 100%;
        float: left;
    }

    .broodnmuziekimgBottom img  {
        width: 80%;
        float: right;
        transition: .5s all;
    }
    
    .broodnmuziekTxtTop    {
        margin: 0 0 0 0;
    }

    
    .gaterhingsContent  {
        width: 90%;
        margin: 70px 0 100px 0;
    }
    
    .gaterhingsTxt  {
        width: 100%;
    }

    .bloemen    {
        width: 30%;
        transition: .5s all;
        padding-right: 20px;
    }
    
    .baseline	{
        letter-spacing: 0;
    }

}


@media screen and (max-width: 768px) {
	
	header	{
		margin:  30px auto 30px auto;
		width: 60%;
	}
	
	section	{
		padding: 60px 20px 250px 20px;
	}
    
   .headline	{
        font: 16px/28px 'Open Sans', sans;
        font-weight: 300;
        padding: 5px;
    }
    
    
	footer	{
		padding: 20px 0 20px 0;
		font: 11px/21px 'Open Sans', sans;
		display: flex;
		flex-direction: column;
		text-align: center;
	}
	
	figure	{
		width: 100%;
		margin: -190px 0 0 0;
		padding-bottom: 10px;
	}
	
	blockquote	{
		margin: 20px 0 0 40px;
	}
	
	.pictures img	{
		width: 30.3%;
        margin-left: 1%;
	}

	.sm	{
		margin: 10px 0 0 0;
	}

}
















