/* Colours:
Light Green: #3a7d3c; Dark Yellow: #ffc000;
*/

/* Colors */
.colour-1 {background:#3a7d3c;}
.colour-2 {background:#ffc000;}
.colour-3 {background:#010101;}
.colour-4 {background:#FA9600;}
.colour-5 {background:#E88B2E;}


/* Body formating */
html, body { color: #fff;min-width:1059px;text-align: center; /*For IE*/font-size:100%;font-size:16px;font-weight:100;background: #ecf2e0;font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	transition: width ease .5s;-webkit-transition: width ease .5s;-moz-transition: width ease .5s;-o-transition: width ease .5s;-ms-transition: width ease .5s;
}
img {border:0;}
p {line-height:1.5em;font-size:16px;}
/* Remove iOS formatting */
input[type="submit"], input[type="reset"], input[type="text"], input[type="email"], input[type="number"], textarea, select {-webkit-appearance: none;border:none;border-radius:0;max-width:100%;box-sizing:border-box;}
/* Firefox formatting */
input[type="submit"], input[type="reset"], input[type="text"], input[type="email"], input[type="number"], select {padding:.3em .1em;}
select { -webkit-appearance:none;border-radius:0;border:none;background:white;font-size:1em;line-height:1em;}
/* Remove Spacing */
html, body, h1, h2, h3, .noMP {margin: 0; padding: 0;}
h1, h2, h3, h4, h5, h6 {font-family: 'Coda Caption';}

.loading {background: url('../resources/img/loader.gif') repeat center top;color:#333;}

section {opacity: 0;}

.loaded section {opacity: 1;-webkit-transition: opacity 300ms ease-out;-moz-transition: opacity 300ms ease-out;transition: opacity 300ms ease-out;}

/* Columns */
.c1 {width:100%;}
.c2 {width:49%;}
.c3 {width:33%;}
.c2of3 {width:67%;}
.c4 {width:25%;}
.c1padd {width:96%;margin:0 2%;}
.c2padd {width:46%;margin:0 2%;}
.c3padd {width:29%;margin:0 2%;}
.c2of3padd {width:63%;margin:0 2%;}
.c4padd {width:21%;margin:0 2%;}

.wrapper {width:1059px;margin:0 auto;text-align:left;}
/* Links */
a {color:#fff;text-decoration:none;}
a:hover {color:#093;}
/* Button */
.button {text-transform:uppercase;width: 45%;padding: .5em 1em;font-size: 1.5em;color: white;text-align: center;background: #3a7d3c;border: 0;border-bottom: 4px solid #1a511b;cursor: pointer;}
.button:hover { background:#27ae60;}
.button:active { background:#FC0;}
.reset {background:#1a511b;}
.reset:hover {background:#D32127;}

/* Header */
header {position:fixed;z-index:9999;background:#331919;opacity:.9;width:100%;text-align:left;}
header img {vertical-align:middle;}
header nav ul {list-style:none;}
header nav ul li {display:inline-block;}
header nav ul li a {font-size:1.5em;text-transform:uppercase;text-decoration:none;padding:.5em 1em;color:#fff;}

.IE7 header nav ul li {display:inline;}

.fixedposition header { position: absolute; } /* IOS devices turned the header position into absolute at the point the keyboard is selected */

/* SLIDES */
#slides {overflow-x: hidden; text-align:center;-webkit-transition: all 3ms ease;-moz-transition: all 3ms ease;transition: all 3ms ease;}
#slides h2 {font-size:4em;}

#slides section:before {content: '';display: inline-block;height: 100%; vertical-align: middle;margin-right: -0.25em; /* Adjusts for spacing */ }

#slides section {background-repeat: no-repeat;background-attachment:fixed;background-size: cover;height:100%;width:100%;}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
   /* IE10+ specific styles go here */ 
   #slides section {background-attachment:scroll;} /* Problem with IE11 not fixing a fixed background on divs */
}

.v-center {display: inline-block;vertical-align: middle;}
hr {border: 0;
    height: 2px;
    background-image: -webkit-linear-gradient(left, rgba(255,255,255,0), rgba(255,255,255,0.75), rgba(255,255,255,0)); 
    background-image:    -moz-linear-gradient(left, rgba(255,255,255,0), rgba(255,255,255,0.75), rgba(255,255,255,0)); 
    background-image:     -ms-linear-gradient(left, rgba(255,255,255,0), rgba(255,255,255,0.75), rgba(255,255,255,0)); 
    background-image:      -o-linear-gradient(left, rgba(255,255,255,0), rgba(255,255,255,0.75), rgba(255,255,255,0)); }

/* Custom Slides */
#onthetools {background:url('../resources/img/tools.jpg'); background-position: center top;}
#options {padding:3em 0;}
#options ul {list-style:none;padding:0;margin:0;}
#options ul li {display:inline-block;width:33%;text-align:center;}
#options ul li svg {display:block;width:25%;margin:0 auto;padding:0;height:1%;}
#options ul li a:hover svg {fill:#FA9600;}
#options ul li a:hover {color:#FA9600;}
#submit {padding:3em 0; background: #ecf2e0; background:url('../resources/img/submit.jpg');color:#555;}
#submit h2 {color:#331919}
#submit label {color:#333;}
#submit-c1 {width:33%;}
#submit-c2 {width:64%;}
#example {display:none;background:#FFD;color:#333;padding:3em 0;}
.example_link {cursor:pointer;}

#contact {background:#AE9C96;color:#333;padding:3em 0;}
#contact label {color:#333;}
#contact-c1 {width:30%;margin-right:3%;display:inline-block;vertical-align:top;}
#contact-c2 {width:64%;display:inline-block;vertical-align:top;}

#contact-sending {color:#333;}
#contact-success {color:#fff;}

label {color: #fff;font-size: 1.2em;display:block;}
input[type="text"], input[type="email"], select {color: #555;font-style:italic;font-size:1.5em;line-height: 1.5em;border: #CCC solid 2px;position: relative;}
textarea {color: #555;font-style:italic;font-size:1.5em;line-height: 1.5em;border: #CCC solid 2px;postion: relative;}

.form-textarea {width:100%;}
.form-error {display:none;background:#D32127;color: #fff;font-size:1.5em;-text-transform: uppercase;padding:.5em;margin-right:1em;margin-top:2.5em;position:absolute;z-index:9;}
.form-error:after {content:"";display:block;position:absolute;top:-15px;left:15px;width:0; height:0;border-width:0 10px 15px 10px;border-style:solid;border-color:#D32127 transparent;z-index:9;}

footer {background:#331919;padding:3em 0;}
footer img {vertical-align:middle;}
footer nav ul {list-style:none;}
footer nav ul li {display:inline-block;}
footer nav ul li a {font-size:1em; text-transform:uppercase; text-decoration:none;padding:.5em 1em;color:#fff;}

#logo_footer {width:80%;}

/* Misc. CSS */
#big-catch-design {color:#9d7622;text-decoration: none;float:right;}
#big-catch-design:hover {text-decoration: underline;}
.redFont {color: #cc0000;}
.padding1em {padding: 1em;}
.padding3em {padding: 3em;}
.margin1em {margin: 1em;}
.mobile, .tablet {display: none;}
.desktop {display: inherit;}
.inline-block {display:inline-block;}
.block {display:block;}
.IE7 .desktop {display:inline-block;}
.textShadow {text-shadow:1px 1px 0px rgba(0,0,0, .4);}
.emboss {text-shadow:0px -1px 0px rgba(0,0,0, .4), 1px 1px 2px rgba(255,255,255, 0.4);}
.width100percent {width:100% !important;}
.width90percent {width:90% !important;}
.auto-center {margin: 0 auto;}
.align-right {text-align:right;}
.align-left {text-align:left;}
.align-center {text-align: center;}
.float-right {float:right;}
.float-left {float:left;}
.visible {overflow:hidden;}
.clear {clear:both;}
.bold {font-weight: 500;}
.one-margin-left {margin-left: 1em;}
.one-margin-right {margin-right: 1em;}
.uppercase {text-transform: uppercase;}
.underline {text-decoration:underline;}
.fine-print {font-size: .8em;font-style: italic;line-height: 1.8em;}
.pointer {cursor:pointer;}
.mid-tan {background-color: #d6c28f;}
.white-border {border: solid 4px #fff;}
.round-padded-box {border: #CCC solid 2px;-webkit-border-radius: 5px;border-radius: 5px;}

/* Remove Skype Phone CSS */
span.skype_pnh_container {display:none !important;}
span.skype_pnh_print_container {display:inline !important;}

#nav_toggle {display:none;}
#mobile_nav {display:none;}
@media screen and (max-width: 1059px) {
	html, body {min-width:0;}
	.wrapper {width:90%; margin: 0 5%;}
	#slides section {background-position: center center;background-repeat: no-repeat;height:100%;width:100%;background-attachment:scroll;}
	#slides section:before {display:none}
	header nav ul li a {font-size:1.3em;padding:.6em;}
	.v-center {}
	#logo {margin-top:15em;}
	#submit-c1 {width:50%;}
	#submit-c2 {width:50%;}
	#slides h2 {font-size:2.8em;}
}
@media screen and (max-width:850px) {
	#submit-c1 {width:100%;margin:0;}
	#submit-c2 {width:100%;margin:0;}
	#contact .button {width:100%;margin-bottom:.2em;}
}
@media screen and (max-width:750px) {
	header nav ul li a {font-size:1.1em;padding:.4em;}
	#contact-c1 {width:45%;margin-rigth:4%;}
	#contact-c2 {width:50%;}
}
@media screen and (max-width:600px) {
	#desktop_nav {display:none;}
	#nav_toggle {display:block;width:100%;padding:1em 0;}
	#nav_toggle span {padding:1em;font-size:1.5em;color:#fff;}
	
	#slides h2 {font-size:2.2em;}
	#contact-c1 {width:100%;}
	#contact-c2 {width:100%;}
	
	header nav {display:none;}
	header nav ul {margin:0;padding:0;}
	header nav li {display:block;width:100%;padding:.5em 2em;}
	header nav li a {display:block;font-size:1.5em;padding:1em 2em;}
	header nav li:last-child {padding-bottom:2em;}
	
	html, body {min-width:0;}
	.wrapper {width:90%; margin: 0 5%;}
	
	#logo {margin-top:15em;max-width:80%;}
	
	
	.c2 {width:100%;}
	footer {text-align:left;}
	footer nav ul {margin:0;padding:0;}
	footer nav ul li {display:block;margin:0;}
	footer nav ul li a {display:block;padding:1em;margin:0;border-bottom:solid #333 1px;}
	footer .button {margin:2em 5%;width:80%;}
}

@media screen and (max-width:400px) {
	#options ul li {width:60%;margin:2em 0;}
	#options ul li a {width:100%;height:10em;}
}