/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    height: 100%;
    position: relative;
}

body {
    font-size: 14px;
    font-family: 'Droid Sans', sans-serif;
    /*font-family: 'Arial', 'Helevicta', sans-serif;*/
    color: #464646;
    line-height: 1.4;
    height:100%;
    background: #1a5926;
}

.bkdrop {
    min-width: 1024px;
    background-color: #e9e9e9;
}

.headerwrap {
    min-width: 1024px;
    background: rgba(255,255,255,0.7);
    height: 135px;
    position: relative;
    z-index: 1;
    border-bottom: 2px solid #1a5926;
}

header, .wrapper, footer {
    width: 960px;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 100px;
}

header {
    overflow: hidden;
    width: 940px;
    padding: 10px;
    color: #999;
    font-weight: bold;
}

header a, header a:visited {
    color: inherit;
}

header a:hover, header a:active {
    color: inherit;
}

.headeremail a, .headeremail a:visited {
    color: #dad999;
    font-size: 75%;
    vertical-align: middle;
    padding-right: 15px;
}

.headeremail a:hover, .headeremail a:active {
    color: #FFF;
}

.headertitle {
    float: left;
    text-align: right;
    background-image: url('../img/logo.png');
    background-size: 150px;
    background-repeat: no-repeat;
}

.headertitle span {
    font-size: 300%;
    font-weight: normal;
    line-height: 70%;
    margin-right: 19px;
}

.headertitle span:first-child {
    color: #888;
    display: block;
    font-weight: bold;
    margin-top: 29px;
    margin-left: 158px;
    margin-right: 0px;
}

.headerslogan {
    margin-left: 340px;
    font-family: 'Homemade Apple', cursive;
    margin-top: 50px;
    font-style: italic;
    font-weight: normal;
    color: #3f9a50;
    font-size: 20px;
    transition: all 2s;
    -webkit-transition: all 2s; /* Safari */
}

.headerslogan:hover {
    color: #dad999;
    margin-left: 350px;
    transition: all 1s;
    -webkit-transition: all 1s; /* Safari */
}

.headercontact {
    float: right;
    font-size: 20px;
    text-align: right;
    list-style: none;
}

.headercontact li {
    line-height: 25px;
    vertical-align: top;
    margin-bottom: 3px;
}

.headeremail {
    background: rgba(26,89,38,0.7);
    float: right;
    clear: left;
    margin-right: -230px;
    padding: 3px 10px 3px 20px;
    display: inline-block;    
}

#hp:before,
#mp:before {
    width: 25px;
    height: 25px;
    display: inline-block;
    margin-right: 10px;
}

#hp:before {content: url(/../img/icons/phone.png)}
#mp:before {content: url(/../img/icons/mobile.png)}


.wrapper {
    margin-top: -35px;
    overflow: hidden;
    padding-bottom: 25px;
    min-height: 775px;
}

.mainpage-topcontent-index {
    box-shadow: 0px 0px 50px #999;
    overflow: hidden;
}

.mainpage-topcontent {
    box-shadow: 0px 0px 50px #999;
    overflow: visible;
}

.mainpage-gallery-container {
    margin-top: 35px;
    background: black;
}

.services-gallery-container {
    margin-top: -4px;
    margin-bottom: 6px;
    box-shadow: 0px 0px 50px #999;
}

#gallery-prime {
    height: 500px;
    width: 100%;
    position: relative;
}

#gallery-prime img {
    height: 500px;
    width: 960px;
}

#gallery-prime > div { 
    position: absolute;
}

#gallery-prime span {
    background: rgba(26,89,38,0.5);
    font-size: 150%;
    color: #FFF;
    position: relative;
    bottom: 135px;
    width: auto;
    padding: 5px 50px 5px 15px;
    font-family: 'Lobster', cursive;
}

.main-content {margin-top: 6px;}

.main-content article, .main-content aside, .main-content section {
    background: #fff;
    box-shadow: 0px 10px 10px #b7b7b7;
    padding: 10px;
    border-radius: 5px 5px 10px 10px;
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top,  #ffffff 30%, #eaeaea 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%,#ffffff), color-stop(100%,#eaeaea)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #ffffff 30%,#eaeaea 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #ffffff 30%,#eaeaea 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #ffffff 30%,#eaeaea 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #ffffff 30%,#eaeaea 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eaeaea',GradientType=0 ); /* IE6-9 */
    margin-bottom: 6px;
}

strong {
    color: #317833;
}

.main-content article {
    width: 512px;
    float: left;
}

h1 {
    margin: 0;
    font-family: 'Lobster', cursive;
    color: #3f9a50;
    font-weight: normal !important;
    font-size: 220%;
}

h2 {
    margin: 0;
    margin-left: 50px;
    text-indent: -30px;
    line-height: 1em;
    color: #3f9a50;
}

h3 {
    font-style: italic;
    color: #3f9a50;
    text-shadow: 2px 1px 0px #1a5926;
}

.ticklist {
    margin-left: 50px;
    font-weight: bold;
    color: #317833;
    list-style-type: none;
    overflow: hidden;
}

.ticklist li {
    line-height: 20px;
    width: 100%;
    vertical-align: top;
    display: block;
    float: left;
}

.ticklist li:before {
    content: url(/../img/tick.png);
    margin-right: 20px;
    display: block;
    margin-bottom: 1px;
    float: left;
    clear: left;
}

.main-content aside {
    width: 402px;
    float: right;
    clear: right;
}

.main-content aside img {
    box-shadow: 1px 1px 2px #406641;
    float: left;
    margin-right: 15px;
}

.main-content aside p {
    margin-top: 0px;
}

.main-content aside div {
    font-size: 90%;
    clear: both;
    margin: 0 auto;
    text-align: center;
}

.box {
    box-shadow: 0px 10px 10px #406641;
    padding: 10px;
    border-radius: 5px 5px 10px 10px;
    text-align: center;
    color: #fff;
    margin-bottom: 6px;
}

.box em {
    font-weight: normal;
    font-style: normal;
    font-size: 175%;
    color: #dad999;
}

.box a {
    font-weight: bold!important;
    color: #dad999!important;
}

.partners img {
    box-shadow: none!important;
    height: 76px;
}

.partners h1 {
    font-family: 'Droid Sans', sans-serif;
    font-weight: bold!important;
    font-style: italic;
}

.namgrass {
    border: 2px solid #a0c30d;
    text-align: left;
    background: #393939!important;/* Old browsers */
    background: -moz-linear-gradient(top,  #393939 30%, #000 100%)!important; /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%,#393939), color-stop(100%,#000))!important; /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #393939 30%,#000 100%)!important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #393939 30%,#000 100%)!important; /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #393939 30%,#000 100%)!important; /* IE10+ */
    background: linear-gradient(to bottom,  #393939 30%,#000 100%)!important; /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#393939', endColorstr='#000',GradientType=0 ) !important; /* IE6-9 */
}

.namgrass h1 {
    color: #a0c30d;
}

.timbertech h1 {
    color: #232323;
}

.timbertech {
    border: 2px solid #89ac34;
    color: #464646;
}

.timbertech a {
    color: #89ac34 !important;
}

.timbertech img {
    margin: 0 auto !important;
    float: none !important;
    display: block;
}

.bordered {
    float: left;
    width: 510px!important;
}

.bordered-2 {
    width: 401px!important;
}

.awards {
    border: 1px solid #ec2d33;
}

.awards img {
    box-shadow: none !important;
    height: 64px;
    width: 150px;
}

.awards span {
    font-family: 'Homemade Apple', cursive;
    text-transform: lowercase;
    font-size: 150%;
    font-weight: bold;
    vertical-align: middle;
    height: 64px;
    display: block;
    margin-top: 7px;
    margin-bottom: 5px;
}

.awards p {
    margin: 0;
    text-align: center;
}

.red  {
    border: 1px solid #ec2d33;
    /*color: #ec2d33 !important;
    font-weight: bold;*/
    font-size: 95%;
    background: #fff!important; /* Old browsers */
    background: -moz-linear-gradient(top,  #fff 30%, #e5d3d4 100%)!important; /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%,#fff), color-stop(100%,#e5d3d4))!important; /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #fff 30%,#e5d3d4 100%)!important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #fff 30%,#e5d3d4 100%)!important; /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #fff 30%,#e5d3d4 100%)!important; /* IE10+ */
    background: linear-gradient(to bottom,  #fff 30%,#e5d3d4 100%)!important; /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#e5d3d4',GradientType=0 ) !important; /* IE6-9 */
}

.red ul {
    margin: 0;
}

.red strong {color: #ec2d33}

.green {
    color: #fff!important;
    border: 1px solid #dad999;
    background: #317833!important; /* Old browsers */
    background: -moz-linear-gradient(top,  #317833 30%, #1a5926 100%)!important; /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%,#317833), color-stop(100%,#1a5926))!important; /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #317833 30%,#1a5926 100%)!important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #317833 30%,#1a5926 100%)!important; /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #317833 30%,#1a5926 100%)!important; /* IE10+ */
    background: linear-gradient(to bottom,  #317833 30%,#1a5926 100%)!important; /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#317833', endColorstr='#1a5926',GradientType=0 )!important; /* IE6-9 */
    transition: all 2s;
    -webkit-transition: all 2s; /* Safari */
}

.green:hover {
    background: #1a5926; /* Old browsers */
    background: -moz-linear-gradient(top,  #1a5926 30%, #317833 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%,#1a5926), color-stop(100%,#317833)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #1a5926 30%,#317833 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #1a5926 30%,#317833 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #1a5926 30%,#317833 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #1a5926 30%,#317833 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a5926', endColorstr='#317833',GradientType=0 ); /* IE6-9 */
    transition: all 0.2s;
    -webkit-transition: all 0.2s; /* Safari */
}

.yellow {
    font-family: 'Federo', sans-serif;
    color: #fff!important;
    font-size: larger;
    border: 1px solid #FFF;
    font-weight: bold;
    padding: 2px 10px!important;
    background: #F33A3A!important; /* Old browsers */
    background: -moz-linear-gradient(top,  #F33A3A 60%, #B93C3C 100%)!important; /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%,#F33A3A), color-stop(100%,#B93C3C))!important; /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #F33A3A 60%,#B93C3C 100%)!important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #F33A3A 60%,#B93C3C 100%)!important; /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #F33A3A 60%,#B93C3C 100%)!important; /* IE10+ */
    background: linear-gradient(to bottom,  #F33A3A 60%,#B93C3C 100%)!important; /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F33A3A', endColorstr='#B93C3C',GradientType=0 )!important; /* IE6-9 */
    transition: all 1s;
    -webkit-transition: all 1s; /* Safari */
    text-shadow: 0 1px 3px #222;
}

.yellow:hover {
    background: #B93C3C; /* Old browsers */
    background: -moz-linear-gradient(top,  #B93C3C 30%, #F33A3A 100%)!important; /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(30%,#B93C3C), color-stop(100%,#F33A3A))!important; /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #B93C3C 30%,#F33A3A 100%)!important; /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #B93C3C 30%,#F33A3A 100%)!important; /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #B93C3C 30%,#F33A3A 100%)!important; /* IE10+ */
    background: linear-gradient(to bottom,  #B93C3C 30%,#F33A3A 100%)!important; /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#B93C3C', endColorstr='#F33A3A',GradientType=0 )!important; /* IE6-9 */
    transition: all 0.2s;
    -webkit-transition: all 0.2s; /* Safari */
}

.yellow a {
    height: 40px;
    font-weight: normal!important;
    color: #FFF!important;
}

.yellow a:hover {
    text-decoration: none!important;
    text-shadow: 1px 1px 5px #ff9d08;
}

.yellow a:before {
    content: '';
    vertical-align: middle;
    border-radius: 2px 2px 6px 6px;
    width: 32px;
    height: 32px;
    overflow: hidden;
    display: inline-block;
    background: url('../img/icons/pdf.png');
    background-repeat: no-repeat;
    box-shadow: 1px 1px 2px #362f2d;
    margin-right: 5px;
}

#soc-box {}

#soc-box ul {
    margin: 0 auto;
    padding: 0px;
}

#soc-box ul li {
    display: inline-block;
}

.social {
    border-radius: 2px 2px 5px 5px;
    overflow: hidden;
    width: 32px;
    height: 32px;
    box-shadow: 1px 1px 2px #406641;
    background: #317833;
}

.social a img {
    width: 32px;
    height: 32px;
    -webkit-filter: grayscale(1) opacity(0.8);
    opacity: 0.5;
        -webkit-transition: all 1s;
            transition: all 1s;
}
.social a img:hover {
    -webkit-filter: grayscale(0) opacity(1);
    opacity: 1;
        -webkit-transition: all 0.2s;
            transition: all 0.2s;
}

nav, .frontpage {
    width: 100%;
    height: 80px;
    background: rgba(26,89,38,0.9);
    height: 70px;
    z-index: 2;
    margin-top: 35px;
    font-family: 'Lobster', cursive;
    color: #FFF;
    font-size: 1.5em;    
    position: relative;
}

.frontpage {
    margin-top: -106px;
    box-shadow: 10px 0px 50px #333;
}

nav ul {
    margin: 0px;
}

.frontpage ul {
    margin: 1em 0;
}

nav ul li, .frontpage ul li {
    display: inline-block;
    padding: 2px 10px;
    margin-left: 40px;
    background: none;
    position: relative;
    top: 18px;
}

nav ul li a, .frontpage ul li a, nav ul li a:visited, .frontpage ul li a:visited {
    color: #dad993;
    text-decoration: none;
    text-shadow: 1px 1px 5px #333;
    font-weight: normal !important;

}

nav ul li a:hover, .frontpage ul li a:hover, nav ul li a:active, .frontpage ul li a:active {
    color: #FFF;
}

nav ul.submenu{
    width: auto;
    padding: 10px 0px;
    margin: 0px;
    background: rgba(26,89,38,0.9);
    position: absolute;
    top:30px;
    left:-33px;
    display:none;
    text-align: center;
    overflow: visible;
 
    /*  Dropdown shadow */
    -webkit-box-shadow: 0 5px 5px 0 rgba(0,0,0,.5);
    box-shadow: 0 5px 5px 0 rgba(0,0,0,.5);
}

.frontpage ul.submenu{    
    top:-105px;
    background: rgba(26,89,38,0.6);
}

nav ul.submenu a {
    font-family: 'Droid Sans', sans-serif;
    font-size: 85%;
    white-space: nowrap;
}

nav li:hover > ul{
    display:block;
    -moz-animation: flipInX .3s ease-in;
    -webkit-animation: flipInX .3s ease-in ;
    animation: flipInX .3s ease-in;
}
 
/*nav ul li:hover > ul{
    display:block;
    -moz-animation: fadeIn .3s ease-in ;
    -webkit-animation: fadeIn .3s ease-in ;
    animation:fadeIn  .3s ease-in ;
}*/

ul.submenu li{
    padding: 0px;
    margin: 0px 25px;
    position: initial;
    display: block;
}

ul.submenu li:last-child {
    border: none;
}

a, a:visited {
    font-weight: bold;
    color: #c6023a;
    text-decoration: none;
    transition: all 1s;
    -moz-transition: all 1s;
}

a:hover, a:active {
    color: #fd0000;
    transition: all 0.2s;
    -moz-transition: all 0.2s;
}

.footerwrap {
    border-top: 1px solid #dad999;
    min-width: 1024px;
    height: auto;
    overflow: hidden;
    background: #0b3911; /* Old browsers */
    background: -moz-linear-gradient(top,  #0b3911 0%, #1a5926 40%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0b3911), color-stop(40%,#1a5926)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #0b3911 0%,#1a5926 40%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #0b3911 0%,#1a5926 40%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #0b3911 0%,#1a5926 40%); /* IE10+ */
    background: linear-gradient(to bottom,  #0b3911 0%,#1a5926 40%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0b3911', endColorstr='#1a5926',GradientType=0 ); /* IE6-9 */
}

footer {
    color: #fff;
    font-size: 85%;
    text-align: center;
    margin: 0 auto;
    padding: 15px!important;
}

footer a, footer a:visited, footer a:hover, footer a:active, .box a, .box a:visited, .box a:hover, .box a:active {color: inherit; font-weight: inherit;}

footer a:hover, footer a:active, .box a:hover, .box a:active {text-decoration: underline; }

#contact {
    border-top: 1px solid #464646;
    border-bottom: 1px solid #464646;
    margin-bottom: 10px;
}

#contact ul {
    padding: 0px;
}
 
#contact ul li {
    display: block;
    margin-bottom: 10px;
}

#contact ul li div {
    display: inline-block;
    width: 100px;
    text-align: right;
    color: #2b7544;
    vertical-align: top;
}

#contact label {
    text-align: right;
    color: #2b7544;
}

.bot {display: none !important;}

#city, #county {
    width: 50% !important;
}

#postcode {
    width: 20% !important;
}

#contact input {
    width: 70%;
    font-size: 80%;
}

#contact textarea {
    width: 285px;
    font-size: 85% !important;
    min-height: 200px;
}

.name {
    width: 125px !important;
}

.name input {
    display: block;
    width: 95% !important;
}

#name-last {width: 122% !important;}

.name label {
    clear: both;
    float: left;
    font-size: 80%;
    margin-left: 5px;
    color: #a1a1a1 !important;
}

.inputbox {
    text-align: left !important;
    font-size: 100% !important;
}

.req:before, .req-2:before {
    content: '';
    display: inline-block;
    width: 10px;
    height: 10px;
    background: url('../img/icons/asterix.png')   
}

.req-2:before {
    width: 20px;
}

.key {
    font-size: 85%;
}

.buttons {
    text-align: center;
}

.buttons input {
    width: auto !important;
    font-size: 100% !important;
}

.address li {
    list-style: none;
    font-weight: bold;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #999;
    font-style: italic;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #999;
    font-style: italic;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #999;
    font-style: italic;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #999;
    font-style: italic;
}

.smallgallerycontainer {
    overflow: auto;
}

.galleryimage, .smallgalleryimage {
    border: 1px solid #fff;  
    cursor: pointer;  
    float: left;  
    margin: 2px;  
    position: relative;  
    overflow: hidden;  
    -webkit-box-shadow: 1px 1px 1px 1px #ccc;  
    -moz-box-shadow: 1px 1px 1px 1px #ccc;  
    box-shadow: 1px 1px 1px 1px #ccc; 
}

.galleryimage {
    height: 140px;
    width: 160px;
}

.smallgalleryimage {
    height: 266px;
    width: 306px;
}

.galleryimage img, .smallgalleryimage img {
    width: 160px;
    height: 140px;
    position: absolute;  
    left: 0;  
    -webkit-transition: all 300ms ease-out;  
    -moz-transition: all 300ms ease-out;  
    -o-transition: all 300ms ease-out;  
    -ms-transition: all 300ms ease-out;  
    transition: all 300ms ease-out;  
}

.galleryimage img {
    width: 160px;
    height: 140px;
}

.smallgalleryimage img {
    width: 306px;
    height: 266px;
}

.galleryimage span {
    font-size: 85%;
    height: 30px;
    width: 160px;
    display: block;
    opacity: 1;
    bottom: 0px;
    line-height: 25pt;
    text-align: left;
    padding-left: 5px;
    background-color: rgba(26, 89, 38,0.8);
    position: absolute;
    color: #fff;
    z-index: 100;
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
    left: 0;
}

.smallgalleryimage span {
    font-size: 125%;
    height: 30px;
    width: auto;
    display: block;
    opacity: 1;
    bottom: 25px;
    line-height: 25pt;
    text-align: left;
    padding: 0 5px;
    background-color: rgba(26, 89, 38,0.5);
    position: absolute;
    color: #fff;
    z-index: 100;
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
    left: 0;
    font-family: 'Lobster', cursive;
    font-weight: normal;
}

/*
.galleryimage span {
    height: 30px;  
    width: 160px;  
    display: block;  
    bottom: -30px;  
    line-height: 25pt;  
    text-align: left; 
    padding-left: 5px;
    background-color: rgba(26, 89, 38,0.8);  
    position: absolute;  
    color: #fff;  
    z-index: 100;  
    -webkit-transition: all 300ms ease-out;  
    -moz-transition: all 300ms ease-out;  
    -o-transition: all 300ms ease-out;  
    -ms-transition: all 300ms ease-out;  
    transition: all 300ms ease-out;  
    left: 0; 
}  

.galleryimage:hover span {  
	-moz-transform: translateY(-100%);  
    	-o-transform: translateY(-100%);  
    	-webkit-transform: translateY(-100%);  
    	transform: translateY(-100%);  
}

*/
    
/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #6a7c63;
    margin: 0.5em 0;
    padding: 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

















/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (max-width: 800px) {
    /* Style adjustments for viewports that meet the condition */

    body {
        font-size: 24px;
    }

    .headerwrap {
        height: 150px;
    }

    header, .wrapper, footer {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    header {
        width: 100%;
        margin: 0 auto;
    }

    .headertitle span {
        margin-left: 27px;
    }

    .headercontact {
        font-size: 120%;
        margin-right: 5px;
    }

    .headercontact li {
        line-height: 35px;
    }

    .headertitle span {
        font-size: 200%;
    }

    .headerslogan,
    .headerslogan:hover {
        font-size: 100%;
        margin-left: 390px;
    }

    .headeremail {
        float: right;
        margin-right: -276px;
}

    .wrapper {
        margin-top: 0px;
    }

    .frontpage {
    margin-top: -125px!important;
    }

    #mainpage-gallery,
    #mainpage-gallery img {
        height: 535px;
        width: 100%;
    }

    #mainpage-gallery span {
        bottom: 135px;
    }

    .main-content article,
    .main-content aside,
    .bordered,
    .bordered-2 {
        width: 97.75%!important;
        margin: 10px auto;
        float: none;
        clear: both;
        overflow: hidden;
    }

    .ticklist li {
        line-height: 36px;
    }

    nav ul {
        padding-left: 0px;
    }

    nav {
        margin-top: 0px!important;
    }

    #contact ul li div {
        width: 15%;
    }

    #contact input, #city, #county {
        width: 80%;
    }

    .inputbox {
        width: 80.8% !important;
    }

    textarea {
        width: 100% !important;
    }

    .buttons input {
        width: 25%!important;
    }

    .address    {
        margin-left: 25%;
    }

    .name {
        width: 34.5% !important;
    }

    .social {
        border-radius: 6px 6px 15px 15px;
        width: 96px;
        height: 96px;
        margin-right: 10px;
    }

    .social a img {
        -webkit-filter: grayscale(0) opacity(1);
        opacity: 1;
        width: 96px;
        height: 96px;
    }

    .awards span {
        margin-top: 15px;
    }

    .main-content aside img {
        margin-right: 45px;
    }

    .lb-image {
        min-width: 800px;
        width: 600%;
        height: 600%;
        min-height: 600px;
    }

}

@media only screen and (min-width: 800px) {
    /* Style adjustments for viewports that meet the condition */

header, .wrapper, footer {

    padding: 0 30px;
    padding-bottom: 20px;
}

header {
    padding: 10px!important;
}

.galleryimage span {
    opacity: 0;
}

.galleryimage:hover span {
    opacity: 1;
}

}

@media only screen and (min-width: 1100px) {
    /* Style adjustments for viewports that meet the condition */

    header, .wrapper, footer {
        padding: 0 50px;
        padding-bottom: 20px;
    }

    header {
        padding: 10px!important;
    }

/* line 84, ../sass/lightbox.sass */
.lb-prev {
  left: 0;
  float: left;
  background: url(../img/prev.png) left 48% no-repeat;
  opacity: 0;
}
/* line 87, ../sass/lightbox.sass */
.lb-prev:hover {
    opacity: 1;
}

/* line 90, ../sass/lightbox.sass */
.lb-next {
  right: 0;
  float: right;
    background: url(../img/next.png) right 48% no-repeat;
    opacity: 0;
}
/* line 93, ../sass/lightbox.sass */
.lb-next:hover {
    opacity: 1;
}


    @media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
        /* Style adjustments for high resolution devices */
    }

    /* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

    @media print {
        * {
            background: transparent !important;
            color: #000 !important; /* Black prints faster: h5bp.com/s */
            box-shadow: none !important;
            text-shadow: none !important;
        }

        a, a:visited {
            text-decoration: underline;
        }

        a[href]:after {
            content: " (" attr(href) ")";
        }

        abbr[title]:after {
            content: " (" attr(title) ")";
        }

        /*
     * Don't show links for images, or javascript/internal links
     */

        .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
            content: "";
        }

        pre, blockquote {
            border: 1px solid #999;
            page-break-inside: avoid;
        }

        thead {
            display: table-header-group; /* h5bp.com/t */
        }

        tr, img {
            page-break-inside: avoid;
        }

        img {
            max-width: 100% !important;
        }

        @page {
            margin: 0.5cm;
        }

        p, h2, h3 {
            orphans: 3;
            widows: 3;
        }

        h2, h3 {
            page-break-after: avoid;
        }
    }
}