@charset "UTF-8";
/* CSS Document */

.address_container {
	padding: 5% 10% 0% 60%;
	}	
.wrapper {
	display: flex;  
	flex-flow: row wrap;
	background-color: rgba(16, 18, 99, .8);
}

.wrapper > * {
  /*padding: 10px;*/
  flex: 1 100%;
}

.header {
	margin: .9em;
	padding: 1 0 1 0 ;
	flex-grow: 1;
}
.header > h2 {
	font-size: 1.5em; 
	line-height: 1em;

	text-align: center;
	color:#8586c6
	}
.footer {
	background: lightgreen;
}
.aside-1 {
	margin: 0px 0px 0px 1em;
	flex-grow:1;
}
.aside-1 > p {color:white; line-height: 1.2em;}
.aside-1 > h1 {color:white;
	font-size: 1.2em;
	margin-bottom: .5em; 
	color:#8586c6;
	}

.aside-2 {
	margin: .5em;
	flex-grow:2;
	flex-shrink: 1;
}

@media all and (min-width: 600px) {
	.aside { flex: 1 0 0; }
}

@media screen and (max-width: 800px) {
	.address_container {padding: 5% 5% 0% 5%; }
  	.main    { flex: 3 0px; }
	.headers {order: 1;  border-bottom: 2px; border-color: white;}
	.header > h2 { font-size: 1.3em; margin-top: .5em;}
	.aside-1 { order: 1; margin-top: 1em; } 
	.aside-1 > h1 {font-size: 1.1em}
	.aside-1 > p {font-size: .9em}
	.main    { order: 2; }
	.aside-2 { order: 3; }
	.wrapper {flex-flow: column; text-align: center;}
}
