/*
	Desc: Willis Contructions Screen Style Sheet
	Author: Jesse Steinfort - Stolen design
=== === === === === === === === === === */


/* COLOURS
=== === === === === === === === === === *

	List of colours and hex values used, eg:
	
	black: 000000
	dark blue: 00081c
	blue grey: 4E4E62
	grey: A4A5AE
	light grey: C2C3C9

*/

* /* Global reset removes default styling added by browsers */ { 
	padding: 0;
	margin: 0;
	border: none;
	text-decoration: none;
	text-align: left;
	font-weight: normal;
	font-family: inherit;
	list-style: none;
}

/* STRUCTURE
=== === === === === === === === === === */

html {
	min-height: 100%;
	height: auto;
	font-size: 100%; /* for font scaling consistency in ie6 */
}

body {
	text-align: center; /* for center aligning container in ie6 */
	color: #00081c; /* default font colour */
	font: 62.5%/2.2em helvetica, sans-serif; /* resets default font size to 10px (so 1.0em = 10px) and sets leading at 22px */
	background-color: #00081c;
}

#page {
	width: 96em;
	margin: 0 auto;
}

#container {
	margin: 10px 0 0 0;
	background: #576882 url(images/page.jpg) 0 0 no-repeat;
	border-radius: 15px;
}


/* COMMON
=== === === === === === === === === === */

h1 {
	font-size: 8.4em; /* be careful when setting font-size higher than the default line-height, wrapped lines may overlap */
	margin-top: 0; /* vertical spacing for elements should be a sum of the line-height to give 'vertical rythym' */
	margin-bottom: 0.525em;
	line-height: 1.05em;
}

h2 {
	font-size: 3.0em;
	line-height: 1em;
	margin-bottom: .55em;
	color: #00081c;
	font-family: Georgia, serif;
}

h3 {
	font-size: 1.6em;
	font-weight: bold;
}

h3#description {
	font-family: Georgia, serif;
	font-style: italic;
	font-size: 2em;
	font-weight: normal;
	color: #A4A5AE;
}

h4 {
	font-size: 2.1em;
	margin-bottom: 0.524em;
	font-family: Georgia, serif;
	font-style: italic;
	color: #C2C3C9;
}

.description h4 {
	color: #FFF;
}

h5 {
	font-size: 1.3em;
	margin-top: 0.525em;
	font-weight: bold;
}

h5 a,
h5 a:link  {
	color: #888;
	text-decoration: none;
}

h5 a:hover {
	color: #A4A5AE;
}

.entry p, .entry li /* default font-size for most elements is set here 14px for readability */ {
	font-size: 1.4em; /* using ems for font sizes because they scale consistently in all browsers */
}

.entry p {
	padding-bottom: 1.31em;
}

#home .content p,
#home .content li {
	color: #DDDDDD;
}

#links .content p {
	font-family: Georgia, serif;
	font-style: italic; 
}

#links .content p a {
	font-family: Helvetica, sans-serif;
	font-style: normal; 
}


.entry ul li {
	list-style-type: square;
}

p.excerpt { 
	font-size: 1.4em;
	margin-bottom: 1.499em;
}

p {

}

.entry ol,
.entry ul {
	padding-left: .8em;
	padding-bottom: 2.1em;
	margin-left: 1.6em; 
}

address /* style for addresses */ {
	padding-bottom:  1.05em;
}

blockquote /* style for quotes */ {
	padding-bottom:  1.05em;
	margin-left: 2.4em;
}

cite /* style for source of a quote */ {
}

strong, b {
	font-weight: bold;
}

em, i {
	font-style: italic;
}


small {
	font-size: 1.0em;
}

p small {
	font-size: 0.625em; /* because of inherited font-size 0.625em = 10px going lower is not recommended */
}

a, a:link {	
	color: #333949;
	text-decoration: underline;
}

a:hover {
	color: #A4A5AE;
}

a:visited {
}

a.more-link {
	float: right;
	font-family: Georgia, serif;
	font-style: italic;
	margin-top: 8px;
	color: #C2C3C9;
	text-decoration: none;
}

a.more-link:hover {
	color: #FFF;
}

.align_right {
	text-align: right;
}

.date {
	font-size: 1.6em;
}

.alignleft {
	float: left;
	margin-right: 1em;
	margin-bottom: .55em;
}

.alignright {
	float: right;
	margin-left: 1em;
	margin-bottom: .55em;
}


.entry img {
	background-color: #C2C3C9;
	padding: .315em;
}

/* STRUCTURE
=== === === === === === === === === === */

.section {
	width: 960px;
	overflow: hidden;
	padding-bottom: 2.2em;
}

.content {
	padding-top: 2.2em;
	padding-bottom: 2.2em;
}

.entry {
	padding: 2em;
	background: #FFF;
 	border-radius: 10px;
	opacity:.8;
}

.wide .entry {
	width: 53.5em;
}

#home .entry,
.intro .entry {
	background: none;
	padding: 0;
}

.top {
	display: block;
	height: 10px;
	line-height: 0;
	background: transparent url(images/content-top.png) 0 0 no-repeat;
}

.bottom {
	height: 10px;
	display: block;
	line-height: 0;
	background: transparent url(images/content-bottom.png) 0 0 no-repeat;
}

.container {
	width: 88em;
	overflow: hidden;
	margin: 0 auto;
}


/* header  */

.header {

}

.header .wide {
	padding-top: 50px;
}

.logo {
	float: left;
	display: block;
}

.logo img {
	border: none;
}

/* footer  */
.footer {
	padding-top: 2.2em;
	padding-bottom: 2.2em;
	font-size: 1.1em;
}
.footer .wider p {
	text-align: center;
	color: #333949;
}

.footer a {
	color: #333949;
}

.footer a:hover {
	color: #FFFFFF;
}

/* navigation  */

#navigation {
	padding-left: 15px;
	overflow: hidden;
	text-align: left;
	height: 4em;
}

#navigation a {
	color: #EEEEEE;
	text-decoration: none;
	padding: 1.428em 1.071em .714em 1.071em; 
	font-size: 1.4em;
	line-height: 3em;
}

#navigation a:hover {
	color: #FFF;
	background: transparent url(images/nav-hover-BG.png) 0 0 repeat-x;
} 

#profile .link-1,
#mission .link-2,
#recent .link-3,
#gallery .link-4,
#links .link-5,
#contact .link-6 {
	color: #FFF;
	background: transparent url(images/nav-hover-BG.png) 0 0 repeat-x;
}

/* columns  */

.column {
	overflow: hidden;
	padding-left: 35px;
	float: left;
}

.wide {
	width: 575px;
}

#contact .content .wide,
#profile .content .wide,
#mission .content .wide,
#links .content .wide {
	padding-top: 1.1em;
}

.narrow {
	width: 270px;
}

#profile .content .narrow {
	height: 35em;
	background: transparent url(images/profile.jpg) 30px 0 no-repeat;
}

#contact .content .narrow {
	height: 35em;
	background: transparent url(images/contact.jpg) 30px 0 no-repeat;
}

#mission .content .narrow {
	height: 35em;
	background: transparent url(images/history.jpg) 30px 0 no-repeat;
}

#links .content .narrow {
	height: 35em;
	background: transparent url(images/maintinence.jpg) 30px 0 no-repeat;
}

.wide .narrow {
	padding-left: 0; 
}

.wider {
	margin: 0 auto;
	float: none;
	padding-left: 0;
}

/* entry  */

.blurb {
	padding-top: 3.3em;
	font-family: Georgia, serif;
	color: #A4A5AE;
	font-style: italic;
}

.blurb p {
	margin-bottom: .687em;
	font-size: 2.0em;
	line-height: 1.2em;
}


/* GALLERY
=== === === === === === === === === === */

#home .gallery {
	margin-top: 50px;
	padding-top: 1.1em;
	padding-bottom: 1.1em;
}


.gallery {
	padding-top: 2.2em;
	padding-bottom: 2.2em;
	border-bottom: 1px solid #A4A5AE;
}


.single {
	padding-top: 0em;
	border-bottom: none;
}

.gallery .wide {
	padding-left: 0em;
	padding-bottom: 2.2em;
	width: 575px;
}

.archives .narrow,
.gallery .narrow {
	width: 260px;
}

.archives {
	margin-top: 2.2em;
	padding-top: 2.2em;
	padding-bottom: 2.2em;
}

.archives .wide {
	padding-left: 5em;
}

.images {
	padding: 1em;
	background: #FFF;
 	border-radius: 10px;
	width: 55em;
    opacity: .8;
}

.description {
	padding-top: 40px;
}

.description p {
	font-size: 1.4em;
	
	color: #C2C3C9;
}

.count {
	color: #C2C3C9;
	font-family: Georgia, serif;
	font-style: italic;
}

#image {
	background: transparent;
}

#image img {
	padding: .5em;
	background: #C2C3C9;
}

#image td.top {
	height: 10px;
	background: transparent url(images/content-top.png) 0 0 no-repeat;
}

#image td {
	vertical-align: middle;
	text-align: center;
	width: 57.5em;
	height: 57.5em;
	background: transparent url(images/content-BG.png) 0 0 repeat-y;
}

#image td.bottom {
	height: 10px;
	background: transparent url(images/content-bottom.png) 0 0 no-repeat;
}

.thm-links {
	padding-top: 4.4em;
	width: 30em;
}

.thm-links a.thm {
	width: 12.5em;
	height: 12.5em;
	margin-bottom: 1em;
	margin-right: 1em;
}

.thm-links a.thm img {
	width: 11.4em;
	height: 11.4em;
}

.thm-links a.selected {
	background: #FFF;
}

.excerpt a.thm {
	margin-bottom: 0;
}

a.thm  {
	width: 17.0em;
	height: 17.0em;
	background: #C2C3C9;
	display: block;
	text-align: center;
	float: left;
	margin-right: 13px;
	margin-bottom: 2em;
}

.images a.thm  {
	background: #C2C3C9;
	opacity: 1.0;	
}

a.thm:hover  {
	background: #A4A5AE;
}

a.thm img  {
	margin-top: .5em;
	width: 16.0em;
	height: 16.0em;
}


/* FORMS
=== === === === === === === === === === */


label {
	font-family: Georgia, serif;
	font-style: italic;
	color: #4E4E62;
}

.textinput {
	padding: .5em;
	border: 1px solid #A4A5AE;
	height: 1.1em;
	font-size: 1.0em;
	font-family: helvetica, sans-serif;
}

.textarea {
	padding: .5em;
	border: 1px solid #A4A5AE;
	width: 90%;
	height: 8.8em;
	font-size: 1.0em;
	font-family: helvetica, sans-serif;
}

.submit input {
	font-family: Georgia, serif;
	font-style: italic;
	font-weight: bold;
	padding: 0.625em 1.25em;
	background: #A4A5AE;
	color: #FFF;
	text-align: center;
}