/* 8. CUSTOM LAYOUT & TYPOGRAPHY (Daddy bear)
----------------------------------------------------------------------------------------*/

#container {
	padding: 0.7em;
	margin: 0 auto; 
	max-width: 60em;
	}
	
header h2:before, header h2:after { width: 42%; }

header p {
	font-size:0.8em;
	}

#main {
    max-width:55em;
    margin:0 auto;
}
	
#main p {
    float:left;
    clear:left;
	padding-bottom:2em;
	font-size:1em;
	line-height:1.42em;
	font-weight:100;
	width: 30em;
}

aside {
 margin: 0 0;
  float: right;
  clear: right;
  width: 22em;
  height:auto;
  }
  
 form {
	float:left;
    clear:left;
 }
 
 footer {
	clear;
	float:none;
	padding: 36em 0 0 0;
	font-size: 0.7em;
 }

 #main footer p {
 text-align: center;
	width: 100%;
	margin: 1em 0;
 }
 
/* 9. CUSTOM LAYOUT & TYPOGRAPHY (Mummy bear)
----------------------------------------------------------------------------------------*/
@media screen and (min-width: 30em) and (max-width: 63.236em) {

#container { width: 30em;
	}

#main p {
  float: none;
  width: auto;
  height: auto;
  margin: 0 1em 2em 1em;
}	
	
aside {
  float: none;
  width: auto;
  height: auto;
  margin: 0 0 2.2em;
  }
  
  form {
    float: none;
  width: auto;
  height: auto;
  }
  
   footer {
	padding: 12em 0 0 0;
 }
	
}