/* Reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

::-moz-selection{ background: #ccc; colour:#fff; text-shadow: none; }
::selection { background:#ccc; colour:#fff; text-shadow: none; }

/* Inserts */
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }

/* Global Styles */
body { font: #777; font: 16px/22px 'GillSansStdRegular', Helvetica, Sans-serif; background: url("../img/body-bg.jpg") no-repeat 0 0 transparent; }
ul { list-style: none; padding: 0; }
p { color: #888888; font: 16px/24px 'GillSansStdRegular',Helvetica,Arial,Sans-serif; padding: 0 0 15px; text-shadow: 0 1px 1px #FFFFFF; }
a { background: none repeat scroll 0 0 transparent; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline; }
h1 { font:52px/68px 'Raleway', Helvetica, Arial, Sans-serif; padding:0 0 25px; color:#bbb5b3; text-shadow: 0 1px 0 #FFFFFF; font-weight:100; }
h2 { font:22px 'GillSansStdRegular', Helvetica, Arial, Sans-serif; padding: 0 0 10px; color:#555; text-shadow: 0 1px 0 #FFFFFF; line-height:normal; }

.shadow { 
-moz-box-shadow: 1px 0 2px #999; /* Firefox */
-webkit-box-shadow: 1px 0 2px #999; /* Safari and Chrome */
box-shadow: 1px 0 2px #999; /* Opera 10.5+, future browsers and IE6+ using IE-CSS3 */
behavior: url(ie-css3.htc); /* This lets IE know to call the script on all elements which get the 'box' class */ }

.inset { -moz-box-shadow: 0 1px 1px #CCCCCC inset; -webkit-box-shadow: 0 1px 1px #CCCCCC inset; box-shadow: 0 1px 1px #CCCCCC inset; }

@font-face {
    font-family: 'GillSansStdRegular';
    src: url('../fonts/gillsansstd-webfont.eot');
    src: url('../fonts/gillsansstd-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/gillsansstd-webfont.woff') format('woff'),
         url('../fonts/gillsansstd-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* Header */
header { background: url("../img/head-bg.jpg") no-repeat 0 0 #fdfdfd; padding: 18px 20px 20px; max-height:65px; border-top:6px solid #c1d72e; border-bottom: 1px solid #ddd;  width:100%; position:fixed; z-index: 999; display:block; }
h1.logo a { display: block; position: relative; text-decoration:none; max-width: 90%; }
h1.logo a:hover { text-decoration:none; }
h1.logo { display: block; float: left; margin-bottom: -1px; width: 65%; padding: 0; }
h1.logo { position: relative; z-index: 9; }

a.to_nav { float: right; color: #fff; font:14px 'GillSansStdRegular', Helvetica, Arial, Sans-serif;  background: #ccc; text-decoration: none; padding: 0 10px; line-height: 22px; height: 22px; text-transform: uppercase; letter-spacing: 0.1em; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin: 8px 35px 0 0; }
a.to_nav:hover, a.to_nav:focus { color: #fff; background: #c1d72e; }

/* Buttons */
.section .button-link { -moz-transition-duration: 0.2s; -moz-user-select: none; background: none repeat scroll 0 0 #C1D72E; border: 1px solid #A2BA66; border-radius: 4px 4px 4px 4px; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, 0.2); color: #FFFFFF; font: 12px GillSansStdRegular,Helvetica,Arial,Sans-serif; padding: 6px 26px 6px; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3); text-transform: uppercase; letter-spacing:0.1em; text-decoration:none; }
.section .button-link:hover { background: #b7cc27; border: solid 1px #a2ba66; text-decoration: none; }
.section .button-link:active { -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6); -moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6); box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.6); background: #adc222; border: solid 1px #a2ba66; text-decoration:none; }

/*Layout */
.text { width: 90%; }
img { max-width:100% }
#welcome, #services, #gallery, #contact { position:relative; padding: 145px 0 0; } 
#welcome{ padding-top: 140px; }
#welcome .img { position: absolute; right: 0; top: 100px; z-index:-9; }
#services .img  { position: absolute; right: 0; top: 280px; z-index:-9; }
#contact .img  { position: absolute; right: 0; top: 190px; z-index:-9; }
#welcome .section { height: 350px; }
#welcome .text , #services .text , #welcome .text  { max-width:600px; float: left; }
#welcome .text { padding: 30px 20px 0 30px; }
#services .text { padding: 30px 20px 0 30px; }
#services .section { height: 260px; }
#gallery .slides { width:440px; display: block; padding:30px 20px 0 30px; }
#gallery .section { height: 270px; }
#contact .text { max-width:550px; padding:30px 20px 0 30px; float: left; }
#contact .text p.name { color: #555; }
#contact .text span { color: #888; }
#contact .section { height: 780px; }

.section .group { float:left; position: relative; margin: 0 25px 0 0; padding:0 12px 0 0; list-style-type: none; }
.section .group li { color: #888888; font: 16px/20px 'GillSansStdRegular',Helvetica,Arial,Sans-serif; padding: 0 0 5px; text-shadow: 0 1px 1px #fff; }

/*shorter clearfix http://nicolasgallagher.com/micro-clearfix-hack/*/
header:before, header:after { content:""; display:table; }
header:after { clear:both; }

/* For IE 6/7 (trigger hasLayout) */
header { zoom:1; }

/* Gallery */
.slides_container { width:440px; display:none; float:left; height: 105px; margin-top:20px; }
.slides_container div { width:440px; height:105px; display:block; }
.pagination { margin: 26px auto 0; left: 193px; }
.pagination li { float: left; list-style: none outside none; margin: 0 1px; }
.pagination li a { background-image: url("../img/pagination.png"); background-position: 0 0; display: block; float: left; height: 0; overflow: hidden; padding-top: 12px; width: 12px; }
.pagination li.current a { background-position: 0 -12px; }
.slides_container .fancybox img { margin:0 0 0 3px; }
.section ul { float:left; position: relative; margin: 8px 25px 0 0; padding:0 12px 0 0; list-style-type: none; }

/* Quotes */
.contact { float:left; display:block; width: 820px; }
#article { display: block; float: left; position:relative; z-index:9; margin: 0 0 0 20px; width: 300px; }
blockquote p { font:14px/22px 'Georgia', Times New Roman, Serif; font-style:italic; }
blockquote cite { font-style: normal; display: block; text-align: right; text-transform: uppercase; font-size: 10px; font-weight: bold; letter-spacing: 1px; font-family: Arial, Helvetica, sans-serif; }

/*
 |	Setting the width for the blockquotes is required
 |	to accurately adjust it's contianer
*/

blockquote { font-family: Georgia, Times, serif; width: 250px; /* required */ margin: 0 auto; }
	
/*
 |	The #quote_wrap div is created
 |	by Quovolver to wrap the quotes
*/

#quote_wrap {  background: url(../img/quote-mark.png) no-repeat 20px 20px; margin: 15px 0; padding: 20px; }

/* Contact Form */
#contact-form { float: left; margin: 15px 12px 0 0; width: 460px; position:relative; z-index:3; }
#contact-form textarea { height: 120px; border: 1px solid #e2e2e2; padding: 8px; }
#contact-form .area { border:1px solid #e1e1e1; background-color:#e2e2e2; float: left; font-family: Helvetica,sans-serif; font-size: 12px; line-height:22px; margin: 0 0 10px; padding: 8px; width: 330px; }
#contact-form .field input:required:invalid, #contact-form input:focus:invalid { font-size: 12px; }
#contact-form .field input:required:valid { font-size: 12px; }
#contact-form .field input:focus:invalid, #contact-form .field input:focus, #contact-form .field textarea:focus, #contact-form  textarea .large:focus { border: 1px solid #939393; box-shadow: 0 0 0.25em #868686; }
label { color: #888; font: normal 16px/24px GillSansStdRegular, Helvetica, Arial, Sans-serif; padding: 6px 0; text-shadow: 0 1px 1px #fff; float: left; text-align: right; margin-right: 12px; width: 100px; }
label.error { float: none; margin-left: 120px; font-size: 12px; color: #a03038; }
select { box-shadow: 0 1px 1px #CCCCCC; float: left; font-family: Helvetica,sans-serif; font-size: 12px; margin: 0 0 10px; padding: 8px; width: 150px; }
#contact-form input:required:valid, #contact-form input:required:invalid { background-color:#e2e2e2; float: left; font-family: Helvetica,sans-serif; font-size: 12px; margin: 0 0 10px; padding: 8px; width: 330px; }
#contact-form input.submit-button:hover, #contact input.submit-button:focus { background-position: -258px -131px; }
#contact-form .field { float:left; width: 480px; }

/* Navigation */	
#primary_nav ul { list-style: none; padding: 5px 0; }
#primary_nav li a { display: block; padding: 0 20px; color: #c1d72e; text-decoration: none; font-weight: normal; text-transform: uppercase; letter-spacing: 0.1em; line-height: 2em; height: 2em; border-bottom: 1px solid #eee; text-shadow: 1px 1px 1px #FFFFFF; }
#primary_nav li:last-child a { border-bottom: none; }
#primary_nav li a:hover, #primary_nav li a:focus { color: #7b8823; background: #c1d72e; text-shadow: 1px 1px 1px #e8f1aa; }

/* Footer */
footer { background-color: #eee; cursor: pointer; font-family: Helvetica, Helevetica, Arial, Sans-serif; opacity: 0.6; position: absolute; right: 0; bottom: 0; z-index:9; }
footer p { color:#555; padding:5px 10px; font: 11px/18px Helvetica, Helevetica, Arial, Sans-serif; text-align:right; }
footer a { font: 11px/18px Helvetica, Helevetica, Arial, Sans-serif; }
footer a:link { color:#555; text-decoration:none; }
footer a:hover, a:active { outline: none; color:#111; }
footer a:active, a:visited { text-decoration: none; color: #555; }

/* Media Queries*/
@media only screen and (min-width: 768px) {
		
a.to_nav { display: none; }
.wrapper { position: relative; width: 100%; }	
#primary_nav { position: fixed; top: 0; right: 0; margin-right:25px; background: none; z-index:999; }
#primary_nav li { display: inline; }
#primary_nav li a { border: medium none; border-radius: 2px 2px 2px 2px; float: left; margin: 0 0 0 5px; padding: 35px 12px 0; }
#primary_nav li.top { display: none; }

}