/*from the website http://html.net/tutorials/css/ */
body {  
	padding: 5.75em 0 0 0; 
	overflow: hidden; /* overflow: hidden prevents full scrollbar in IE */ 
	/*margin top right bottom left*/
	margin: 0 0 0 0;
	background-color: #7f7f7f; 
	width: 100%;
}

#header { 
	position: absolute;
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 1.25em; 
	background-color: #22001a; 
	overflow: hidden; 
} 
#mainlinks{
	padding: 0 0 0 0;
	margin: 0 0 25 0;
	width: 100%;
	min-width: 800px;
	height: 75px;
}
#title{
	position: absolute;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	top:1.25em;
	left: 0px;
	width: 100%;
	height: 4.5em;
	background: #7f7f7f url("Header-Phyto.png") no-repeat;
	background-position: right 0;
	overflow: hidden;
}
#content {  
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	height: 100%;
	width: 100%;
	overflow-y: scroll;
	overflow-x: ;
	background-color: #7f7f7f;
}

#home {
width: 100%; 
} 

IMG.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto; 
}

h1 {
	z-index: 2;
	font: small-caps bold 60px sans-serif;
	white-space: nowrap;
	top: .25em;
	right: 0.25em;
	margin: 0px 20px 0px 0px;
	padding: 0px 0px 0px 0px;
	text-align: right;
	color: #d7d7d7;
}

h2 {
	/*margin: top right bottom left*/
	margin: 10px 0 10px 0;
	padding: 10px 0 5px 0;
	width: 25%;
	min-width: 190px;
	font: 35px helvetica, arial, sans serif;
	text-align: center;
	float: left;
}

h3 {
	min-width: 400;
	margin: 0 0 0 0;
	padding: 5px 125px 15px 125px;
	font: bold 1.25em helvetica, arial, sans serif;
	text-align: center;
	float: left 50%;
}
h4{
	min-width: 400;
	margin: 0 0 0 0;
	padding: 5px 125px 5px 125px;
	font: 1.25em helvetica, arial, sans serif;
	text-align: center;
	float: left 50%;
}
h5 {
	/*margin: top right bottom left*/
	margin: 10px 0 10px 0;
	padding: 10px 0 5px 0;
	width: 100%;
	min-width: 190px;
	font: 35px helvetica, arial, sans serif;
	text-align: center;
	float: left;
}

span.h3lnk {	color: #22001a;}
span.h3lnk:hover { color: #d7d7d7;}

span.headlink{
	margin: 5px 10px 5px 10px;
	color: d7d7d7;
	padding: 0px 0px 0px 20px;
	font: 1em helvetica, arial, sans serif;
}
span.headlink:hover { color: #FFFFFF;}

span.clink{
	min-width: 400;
	max-width: 1200;
	margin: 0 0 0 0;
	padding: 5px 125px 5px 125px;
	color: 282828;
	font: 1.125em helvetica, arial, sans serif;
	text-align: center;
	float: left 50%;
}

p.description{
	min-width: 400;
	margin: 0 0 0 0;
	padding: 5px 25px 5px 25px;
	color: 282828;
	font: 1.125em helvetica, arial, sans serif;
	text-align: justify;
	float: left 50%;	
}
p.info{
	min-width: 400;
	max-width: 1200;
	margin: 0 0 0 0;
	padding: 5px 125px 5px 125px;
	color: 282828;
	font: 1.125em helvetica, arial, sans serif;
	text-align: center;
	float: left 50%;
}

a:hover {color:#FFFFFF;}

a:link{
	color: 22001a;
	text-decoration:none;
}

#photos {
   /* Prevent vertical gaps */
   line-height: 0;

   -webkit-column-count: 5;
   -webkit-column-gap:   0px;
   -moz-column-count:    5;
   -moz-column-gap:      0px;
   column-count:         5;
   column-gap:           0px;

}


#photos img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
}

#photos img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
}

@media (max-width: 1200px) {
  #photos {
  -moz-column-count:    4;
  -webkit-column-count: 4;
  column-count:         4;
  }
}
@media (max-width: 1000px) {
  #photos {
  -moz-column-count:    3;
  -webkit-column-count: 3;
  column-count:         3;
  }
}
@media (max-width: 800px) {
  #photos {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
}
@media (max-width: 400px) {
  #photos {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
}

.item img {

	width: 300px;
	height: auto;
}
#mason {
	/*width: 980px;*/
	/*width: 95%;*/
	width: auto;
	margin: 0 auto;
}