@import url("style.css");


/* landscape */
@media screen and (min-width: 321px) {
  #wrapper {
    margin: 0 auto;
    width: 90%;
    width: 400px;
    overflow: auto;
  }
  
  #access,
  #access .menu-header,
  div.menu,
  #colophon,
  #branding,
  #main,
  #footer {
    margin: 0 auto;
    width: 100%;
  }
  
  #branding  {
    overflow:hidden;
  }
  
  #site-title,
  #site-info,
  #site-description,
  #site-generator   {
    width: 100%;
    clear: left;
    float: left;
    margin-top: 0;
    padding-top:0;
    margin-bottom: 0;
    padding-bottom:0;
  }
  

  #container {
    float: left;
    width: 100%;
    overflow: auto;
  }
  #content {
    width: 99%;
    margin: 0 0px 0 0px;
  }

  .alignleft, img.alignleft, .alignright, img.alignright {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
    float: none;
  }

  #primary,
  #secondary {
    clear: both;
    float: left;
    overflow: hidden;
    width: 99%; 
	}
}


/* portrait */
@media screen and (max-width: 320px) {
  #wrapper {
    margin: 0 auto;
    width: 300px;
    overflow: auto;
  }
  
  #access,
  #access .menu-header,
  div.menu,
  #colophon,
  #branding,
  #main,
  #footer {
    margin: 0 auto;
    width: 100%;
  }
  
  #branding  {
    overflow:hidden;
  }
  
  #site-title,
  #site-description,
  #site-info,
  #site-generator   {
    width: 100%;
    clear: left;
    float: left;
    margin-top: 0;
    padding-top:0;
    margin-bottom: 0;
    padding-bottom:0;
  }
  

  #container {
    float: left;
    width: 100%;
    overflow: auto;
  }
  #content {
    width: 99%;
    margin: 0 0px 0 0px;
  }

  .alignleft, img.alignleft, .alignright, img.alignright {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
    float: none;
  }

  #primary,
  #secondary {
    clear: both;
    float: left;
    overflow: hidden;
    width: 99%; 
	}
}

 
#site-title {
	float: left;
	font-size: 20px;
	line-height: 25px;
	
}

/* This is the custom header image */
#branding img {
	border-top: 10px solid #0d8b28;
	border-bottom: 0px solid #0d8b28;
	display: block;
	float: left;
	width:100%;
	height: 100%;
}

#site-description {
	clear: right;
	float: right;
	font-size: 15px;
	margin: 15px 0 18px 0;
	width: 100%;
}