@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet');
/* CSS Document */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
outline: none;
list-style: none;
text-decoration: none;	
font-family: 'Open Sans', sans-serif;	
}

h1 {
margin-bottom: 65px;
font-size: 36px;
line-height: 40px; 
color: #8B008B;	
text-align: center;
}

p {
    margin-bottom: 15px;
    font-size: 18px;
    line-height: 22px;
    color: #8B008B;
    font-family: 'Open Sans', sans-serif;	
    text-align: center;
    padding: 15px;
}

.textmain p {
    margin-bottom: 15px;
    font-size: 18px;
    line-height: 24px;
    color: #FFF;
    font-family: 'Open Sans', sans-serif;	
    text-align: left;
    padding: 15px;
}

.textpoem p {
    margin-bottom: 15px;
    font-size: 18px;
    line-height: 24px;
    color: #FFF;
    font-family: 'Open Sans', sans-serif;	
    text-align: left;
    padding: 15px;
	margin-left:30%;
}

h3 {
    margin-bottom: 15px;
    font-size: 14px;
    line-height: 20px;
    color: #8B008B;
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
    text-align: center;
	text-transform:uppercase;
    padding: 10px;
}

h4 {
	margin-bottom: 15px;
    font-size: 14px;
    line-height: 20px;
	background:#99CC00;
    color: #970C92;
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
    text-align: center;
	padding: 10px;	
	
}
h5 {
	margin-bottom: 15px;
    font-size: 16px;
	font-stretch: expanded;  
    line-height: 24px;
    color: #fff;
    font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"
    text-align: left; 
	padding: 10px;	
	
}

.main_container {
position: relative;	
}

/*Nav bar*/
.navbar {
	width: 100%;
	height: 65px;
	display: flex;
	justify-content: space-around;
	align-items: center;
	position: absolute;
}
	/*ligt aan wat voor logo het is*/
.logo a {
	margin-top: 15px;
	
}

.navbar .navbar_items ul {
	display: flex;	
}
.navbar .navbar_items ul li  {
	text-transform: uppercase;
	margin: 0 10px;
}
.navbar .navbar_items ul li a {
	color: #8B008B;
}

/*banner image*/
.banner_image {
	background: url("images/bla.jpg") no-repeat top center;
	background-size: cover;
	width: 100%;
	height: 500px;
	display: flex;
	justify-content: center;
	align-items: center;
	
}

.banner-content {
	text-align: center;
	color: #666;
}

.banner-content h1 {
	text-transform: capitalize;
	line-height: 34px;
	
}
	.banner-content h1 span {
		color: #970C92;
}

.textbanner h1 {
	text-transform: capitalize;
    margin-bottom: 15px;
    font-size: 32px;
    line-height: 20px;
    color: #8B008B;
    font-family: 'Open Sans', sans-serif;
    text-align: center;
   	padding: 5% auto;
}

.textbanner h2 {
    margin-bottom: 15px;
    font-size: 18px;
    line-height: 22px;
    color: #8B008B;
    font-family: 'Open Sans', sans-serif;
    text-align: left;
   	padding: 2% 25%;
}

.textbanner p {
	margin-bottom: 15px;
    font-size: 18px;
    line-height: 24px;
    color: #8B008B;
    font-family: 'Open Sans', sans-serif;	
    text-align: left;
    padding: 15px;
	margin-left:15%;
	margin-right:15%;
}

/*About us*/
.about
{
padding: 5% 10%;
background: #bb99ff;
color: #FFF;
text-align: left;

	}
.about a
{
color: #555;

	}
.textpoem a {
    color: #666;
}

.narratives
{
padding: 5% 10%;
text-align: center;
	}

.narratives {
	background:#fff;
}

.narratives_wrapper .team{
	display:flex;
	justify-content: space-between;
}
.narratives_wrapper .team-1.team {
	margin-bottom: 25px;	
}

.narratives_wrapper .team_member {
	width:30%;
	height: auto;
	cursor: pointer;
	overflow: hidden;
}
.narratives_wrapper .team_comp {
	width:100%;
	height: auto;
	cursor: pointer;
	overflow: hidden;
}


.narratives_wrapper .team_member img {
	width: 100%;
	display: block;
	height: auto;
	transition:all 0,5s ease;
}

.narratives_wrapper .team_member:hover img {
	transform:scale(1.1);	
}

.narratives_wrapper .team_member .tekstblokje {
	width: 100%;
	display: block;
	background: #99CC00;
	height: auto;
	transition:all 0,5s ease;
}

.about
{
	background:#bb99ff;
	color:#fff;
}

.footer {
	width: 100%;
	text-align: center;
	background:#FFF;
	padding: 20 0px;
	margin-top: 20px;
}

.socialbar {
	width: 100%;
	height: 65px;
	display: flex;
	justify-content: space-around;
	align-items: center;
	position: absolute;
}
.socialbar .socialbar_items ul {
	display: flex;	
}
.socialbar .socialbar_items ul li  {
	text-transform: uppercase;
	margin: 0 10px;
}
.socialbar .socialbar_items ul li a {
	color: #970C92;
}



@media (max-width:720px){
	.navbar{
		height: auto;
		flex-direction: column;
		
	}
	.navbar ul{
		flex-direction: column;
		text-align:center;
	}
	.logo{
		margin-bottom:25px;
	}
	.navbar ul li {
		margin-bottom: 5px;
	}
	
	.banner_content{
		margin-top:35px;
		margin-bottom: 30px;
	}
	h1 {
	margin-bottom: 20px;
	margin-top: 250px;
	font-size: 20px; 
	color: #8B008B;	
	text-align: center;
}

	h3 {
    margin-bottom: 12px;
    font-size: 12px;
    line-height: 16px;
    color: #8B008B;
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
    text-align: center;
	text-transform:uppercase;
    padding: 10px;
}

	.textmain p {
    margin-bottom: 5px;
    font-size: 14px;
    line-height: 20px;
    color: #FFF;
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
    text-align: left;
    padding: 15px;
}

.textbanner h1 {
	margin-top: 120px;
    font-size: 20px;
    line-height: 20px;
    color: #8B008B;
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
    text-align: center;
   	padding: 2% 15%;
}
.textbanner p {
    font-size: 12px;
    line-height: 18px;
    color: #8B008B;
    font-family: 'Open Sans', sans-serif;	
    text-align: left;
    padding: 15px;
	margin-left:15%;
	margin-right:15%;
}


}