@charset "UTF-8";
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,300);

/* ==========================================================================
   GENERAL
   ========================================================================== */
body {font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, Sans-Serif;}
h1, h2, h3, h4 {margin-top: 0 }
blockquote { font-style:italic}
blockquote strong { font-style: normal}


.redFill, #cta {
	background-color: #ee5500;
	background-image: url(../img/tile.jpg);
	background-repeat: repeat-x;
	background-position: top;
	color:#FFF
}

h1, #products ul li h1{font-size: 24px; font-weight:600; color:#ee5500}
h2, #products ul li h2 {font-size: 20px; font-weight:600; color:#ee5500}
h3, #products ul li h3 {font-size: 16px; font-weight:600; color:#ee5500}
h4, #products ul li h4 {font-size: 14px; font-weight:600; color:#ee5500; line-height: 22px}
p, #products ul li {font-size: 14px; font-weight:400; color:#222; font-weight:400}
a  {color:#ee5500}
a:hover  {color:#F60}

.redFill h1, #cta h1, #banner h1{color:#FFF}
.redFill h2, #banner h2{color:#FFF}
.redFill h3, #banner h3{color:#FFF}
.redFill h4, #banner h4{color:#FFF}
.redFill p, #banner p {color:#FFF}
.redFill a, #banner a  {color:#FFF}
.redFill a:hover, #banner a:hover  {color:#FFF}


/*Header*/
#header h1 { font-size:28px; margin: 20px 0; font-weight: 600; text-align:center}
.topBox { text-align:center; padding-bottom: 20px; padding-top:20px; color:#222;}
.topBox p {margin: 0; color:#222}
.topBox a {margin: 0; color:#ee5500}


#header {background:#e5e8ec url(../img/head_tile.jpg) repeat-x}
#nav {margin-top:20px;border-bottom: solid 5px #ee5500}
#shortcuts { padding-top: 30px;padding-bottom: 10px;background:url(../img/shadow.jpg) no-repeat top}
#shortcuts img{ margin-bottom: 20px}
#shortcuts a:hover img{opacity:0.7; text-decoration:none}
#shortcuts a:hover{text-decoration:none}
#main {  padding-top: 30px;padding-bottom: 30px; margin-top: 10px}
#products {padding-top: 20px;padding-bottom: 10px; font-size:0 /*Stops inline elements getting extra white gap*/; background:url(../img/shadow.jpg) no-repeat top}
#products ul { list-style-type: none; padding: 0;}
#products li {margin-top: 10px; margin-bottom: 10px;display: inline-block; vertical-align: top; float:none; }
#products .productItem img{margin-bottom: 20px}



#cta { padding-top: 30px;padding-bottom: 30px; background-position:center}
#footer { font-size: 13px; background:#ffffff; padding-top: 30px;padding-bottom: 30px; background:url(../img/shadow.jpg) no-repeat top}
.center-sm {text-align: center}

/* ==========================================================================
   LISTS
   ========================================================================== */

/*FOOTER*/
#footer ul{ padding: 0;}
ul.footerMenu { margin-bottom: 10px; list-style-type:none}
ul.footerMenu li {display: inline}
ul.footerMenu li a {display: inline-block; padding: 1px 10px; border-left: solid 1px #aaa}
ul.footerMenu li:first-child a  {padding-left: 0 !important;border-left: none !important}
ul.social {float: right !important ; list-style-type:none}
ul.social li {float:left;}
ul.social li a{background-repeat:no-repeat;display:block;width:32px;height:32px;margin-right:5px;text-indent:9999px; overflow:hidden}
ul.social li a:hover{opacity:0.7;}

/* ==========================================================================
   BANNERS
   ========================================================================== */


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



/* ==========================================================================
   BLOG
   ========================================================================== */



/* ==========================================================================
   FORMS
   ========================================================================== */
   
.enquiry textarea,.enquiry input,.enquiry select{width:90%;}
.error{color:#D00;}
.trip{display:none;}
input[type=submit] {width: auto !important}
label {font-weight:300}
.enquiry {margin-bottom: 30px}


/* ==========================================================================
   MEDIA QUERIES
   ========================================================================== */

/* Print */
@media print {
  a[href]:after {
    content: none !important;
  }
}

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 
#header h1 {text-align: left}
.topBox {text-align:right; padding-top:40px}
h1, #products ul li h1{font-size: 32px; font-weight:600; color:#ee5500}
h2, #products ul li h2 {font-size: 28px; font-weight:600; color:#ee5500}
h3, #products ul li h3 {font-size: 20px; font-weight:600; color:#ee5500}
h4, #products ul li h4 {font-size: 16px; font-weight:600; color:#ee5500; line-height: 22px}
p, #products ul li {font-size: 14px; font-weight:400; color:#222; font-weight:400}

 }

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { 

.center-sm {text-align: left}
.text-right {text-align: right}
}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { ... }