/*===============================================*/
   /* MEDIA QUERIE 550 */
/*===============================================*/
@media screen and (min-width: 550px){ 

	.profiel-foto + .base > h1 { font-size: 1.5rem; }

	.base, .periode { max-width: 70%; }

	article { justify-content: center; flex-flow: row wrap; }

	footer article { justify-content: flex-start; }
		
}


/*===============================================*/
   /* MEDIA QUERIE 664 */
/*===============================================*/
@media screen and (min-width: 664px){

	.base { flex-basis: 50%; padding: 2rem;	}

	.profiel .base { flex-basis: 50%; }

	.skills .base  { padding: 1rem 2rem 2.5rem 2rem; }

	.opleiding .base { border: none; }

	.periode {
		max-width: 100%;
		display: flex;
		flex-flow: row;
		justify-content: center;
		align-items: flex-start; 	}

	.periode .werkDatum.left, .periode .werkFunctie.right {
		width: 70%;
		padding: 1rem;
		display: flex;
		flex-basis: 50%;
		flex-flow: column; }

	.werkDatum.left { align-items: flex-end; 	}

	.periode.switch .werkDatum.left {
    order: 2;
    align-items: flex-start; 	}

	.periode.switch .werkFunctie.right {
		order: 1;
		text-align: right;
		align-items: flex-end; 	}

	footer > article { flex-flow: column wrap; }
	footer img       { width: 50%; }

} 


/*===============================================*/
   /* MEDIA QUERIE 945 */
/*===============================================*/
@media screen and (min-width: 944px){	
	
	section.portfolio { padding: 3rem 2rem; }

	.profiel-foto + .base > h1 {
		text-align: left; 
		font-size: 1.8rem; 	}

	footer img { width: 30%; }

}


/*===============================================*/
   /* MEDIA QUERIE 1024 */
/*===============================================*/
@media screen and (min-width: 1024px){
	
	.base { flex-basis: 33%; }

} 
	

/*===============================================*/
   /* MEDIA QUERIE 1280 */
/*===============================================*/
@media screen and (min-width: 1240px){
	
} 
	