﻿/*** fonts ***/

@import url(http://fonts.googleapis.com/css?family=Muli:300,400);

@import url(http://fonts.googleapis.com/css?family=Raleway:700,400,300);

/*** element styles ***/

body {

	margin: 0;

	padding: 0;

	font-family: Arial, sans-serif;

	font-size: 1em; /* 16px */

	color: #7b7b7b;

	background-color: #ffffff;

	-webkit-font-smoothing:antialiased;

	-moz-osx-font-smoothing: grayscale;

}



p, div, h1, h2, h3 {

	position: relative;

	margin: 0;

	padding: 0;

	font-weight: normal;

}



h1, h2, h3 {

	font-weight: normal;

	margin: 0.5em 0;

	font-family: 'Raleway', sans-serif;

}

h1 {

	font-size: 36px;

	font-weight: lighter;

}

h2 {

	font-size: 24px;

}

h3 {

	font-size: 1.125em;

}



p {

	font-family: 'Muli', sans-serif;

	font-size: 17px;

	color: #6d6d6d;

	line-height: 24px;

	margin-bottom:1em;
	

}



a {

	text-decoration: none;

	color: #0a5368;

	transition: color 0.2s;

	transition: background-color 0.2s;

}



a:hover, a:focus {

	text-decoration: underline;

}



a img {

	border: none;

}



/*** globally relevant styles ***/

.button {

	display: inline-block;

	margin: 12px 30px;

	padding: 5px;

	border: none;

	background: #666;

	color: #FFF;

	font-size: 1em;

	line-height: 1.5em;

	text-align: center;

	text-decoration: none;

	cursor: pointer;

	-webkit-border-radius: 5px;

	-moz-border-radius: 5px;

	border-radius: 5px;

}



.button:hover, .button:focus {

	text-decoration: none;

	background: #999;

}



.pages {

	text-align: center;

	font-weight: bold;

}



.pages a:link, .pages a:visited {



}



.pages .current {



}



.pagination .pages

{

	text-align: center;

}



.pagination .pages .current

{

	font-weight: bold;

}



.pagination .pages a

{

	text-decoration: none;

}



.pagination .pages a:hover,

.pagination .pages a:focus,

.pagination .pages a:active

{

	text-decoration: underline;

}



.struct {

	display: none;

}



/* float clearing usually applied to <br /> sometimes div or span  */

.clear {

	display: block;

	width: 99%;

	height: 1px;

	clear: both;

	overflow: hidden;

}



/*** section styles ***/

.header, .midsection, .base {

	position: relative;

	width: 100%;

	margin: 0px auto;

}

.container {

	width: 1140px;

	margin: 0 auto;

}

.header {

	height: 110px;

	background: rgba(0, 0, 0, 0.8);

	z-index: 10;

}

.header-spacer {

	height: 110px;

	display: block;

	position: static;

	display: none;

}

.banner {

	float: left;

	width: 40%;

	height: 110px;

}

.logo {

	display: block;

	margin: 12px 0;

}

.main-navigation {

	display: block;

	float: left;

	width: 60%;

	height: 110px;

	padding: 0;

	color: #ffffff;

	text-align: left;

}



.main-navigation ul {

	margin: 0;

	padding: 0;

}



.main-navigation  li {

	position: relative;

	display: inline-block;

	height: 110px;

	line-height: 110px;

	margin: 0;

	padding: 0;

}



*+html .main-navigation > ul  li {

	display: block; float: left;

} /* IE7*/



.main-navigation > ul li:first-child {

	background-image: none; /* remove separator */

}



.main-navigation a:link, .main-navigation a:visited, .main-navigation a:active {

	display: inline-block;

	color: #ffffff;

	font-size: 17px;

	transition: color 0.2s;

	text-decoration: none;

	line-height: 110px;

	font-family: 'Muli', sans-serif;

}



.main-navigation a:hover, .main-navigation a:focus {

	color: #ffc000;

}



.main-navigation .sel > a, .main-navigation .sel .sel > a {

	color: #ffc000;

}



.main-navigation li ul {

	display: block;

	position: absolute;

	top: 100%;

	left: 0;

	width: 190px;

	height: 0;

	overflow: hidden;

	margin: 0;

	padding: 0;

	background: #575757;

}



.main-navigation li:hover ul, .main-navigation a:focus+ul {

	height: auto;

}



.main-navigation li li {

	position: relative;

	display: block;

	width: 175px; /* 190px */

	height: auto;

	padding: 0 0 0 15px;

	line-height: 1em;

	text-align: left;

	margin:0;

	background-image: none;

}



.main-navigation li li a:link, .main-navigation li li a:visited, .main-navigation li li a:active {

	padding: 5px 0;

	width: 100%;

}



.midsection {

	z-index: 5;

}

.midsection h1 {

	color: #0a5368;

	margin-bottom: 40px;

}

.midsection h1:before {

	content: "";

	position: absolute;

	height: 2px;

	width: 100%;

	left:0;

  right:0;

	bottom: -15px;

  margin-left:auto;

  margin-right:auto;

	border-bottom: 2px #0a5368 solid;

}

.midsection a.one-third {

	width: 30%;

	margin: 0 1.5%;

	float: left;

	display: block;

	margin-top: 30px;

}

.midsection a.left {

	margin-left: 0;

	margin-right: 3%;

}

.midsection a.right {

	margin-right: 0;

	margin-left: 3%;

}

.midsection a.one-third:hover {

	text-decoration: none !important;

}

.midsection a.one-third > img {

	display: block;

	width: 100%;

	height: auto;

	border-top-left-radius: 3px;

	border-top-right-radius: 3px;

}

.midsection a.one-third > span {

	display: block;

	text-align: left;

	background-color: #e6e6e6;

	transition: background-color 0.2s;

	padding: 12px 15px 12px 15px;

	font-size: 24px;

	color: #000000;

	font-weight: normal;

	font-family: 'Raleway', sans-serif;

	background-image: url("/resources/template/box-arrow-right.png");

	background-repeat: no-repeat;

	background-position: 96% center;

}

.midsection a.one-third:hover > span {

	background-color: #c0c0c0;

}

.content {

	background: #FFFFFF;

	margin: 40px 0;

}



.hasSidebar {

	display: block;

	float: left;

	width: 74%;

}



.sidebar {

	display: block;

	float: right;

	width: 25%;

}



.content-wrapper:before,

.content-wrapper:after

{

	content: "";

	width: 0px;

	height: 0px;

	clear: both;

	display: block;

}



.content-wrapper > .struct {

	display: block;

	position: absolute;

	top: 0;

	height: 0px;

	width: 0px;

}



.leftwing {

	right: 100%;

}



.rightwing {

	left: 100%;

}



.base {

	z-index: 0;

	background-color: #e6e6e6;

	width: 100%;

}

.base .footer {

	height: 202px;

	padding: 0;

	background-color: #e6e6e6;

	text-align: left;
	z-index: 5;
}

.base .footer .one-forth {

	width: 22%;

	display: block;

	float: left;

	height: 150px;

}







.base .footer .one-forth.footer-logo {

	width: 34%;

}

.base .footer .one-forth > a.footer-logo {

	width: 100%;

	height: 150px;

	display: block;

	background-image: url("/resources/template/footer-logo.png");

	background-repeat: no-repeat;

	background-size: 80% auto;

	background-position: left center;

}

.base .footer .one-forth > a.facebook {

	float: right;

	margin-top: 50px;

	height: 32px;

}

.base .footer .one-forth > a.facebook > span {

	height: 32px;

	line-height: 32px;

	display: inline-block;

	vertical-align: middle;

	font-size: 13px;

	margin-right: 10px;

	color: #6d6d6d;

	font-family: "Muli", sans-serif;

}

.base .footer .one-forth > a.facebook > img {

	display: inline-block;

	width: 32px;

	height: 32px;

	vertical-align: middle;

}

.base .footer .one-forth > p {

	margin-top: 50px;

	font-size: 13px;

	margin-left: 10px;

	line-height: 18px;

	font-family: "Muli", sans-serif;

}

.base .footer .one-forth > p.extra {

	margin-left: 50px;

}

.base .footer .facebook {

}

.base .legal {

	height: 50px;

	background-color: #dddddd;

	box-shadow: 0 500px 0 500px #dddddd;

}

.base .legal .copyright {

	float: left;

	line-height: 50px;

	width: 50%;

	display: block;

	font-family: "Muli", sans-serif;

	font-size: 13px;

	color: #6c6c6c;

}

.base .legal .act {

	float: left;

	width: 50%;

	display: block;

}

.base .legal .act
{
	float: right;
	line-height: 50px;
	font-family: "Muli", sans-serif;
	font-size: 13px;
	color: #6c6c6c;
	text-align: right;
}

.base .legal .act a
{
	color: #6c6c6c;
}



/* slideshow overrides */

/* ss dimensions */

.slideshow {

	top: -110px;

	margin-bottom: -110px;

	position: relative;

	width: 100%;

	height: 775px;

}



.orbit-wrapper .slideshow {



}



.slideshow .timer {

	display: none;

	visibility: hidden;

}



.caption {

	border-radius: 50%;

	background: rgba(0, 0, 0, 0.6);

	width: 400px;

	height: 400px;

	margin: 0 auto;

}

.caption > h1 {

	padding-top: 100px;

	color: #ffffff;

	text-transform: uppercase;

}

.caption > p {

	color: #ffffff;

	text-align: center;

	padding: 0 30px;

	line-height: 25px;

}

.caption > a {

	display: block;

	-webkit-border-radius: 28;

	-moz-border-radius: 28;

	border-radius: 28px;

	color: #ffffff;

	font-size: 17px;

	font-family: 'Raleway', sans-serif;

	background: #ff8a00;

	text-align: center;

	width: 200px;

	height: 50px;

	line-height: 50px;

	margin: 25px auto;



}

.caption > a:hover {

	text-decoration: none;

	background-color: #f15a29;

}



.slider {



}

.orbit-wrapper > .orbit-caption {

	background: none !important;

	padding: 0;

	top: 30%;

}



.slider > div.slide {

	position: absolute;

	top: 0;

	left: 0;

	background-position: center top;

}



div.orbit-wrapper {

	width: 100% !important;

	height: 775px !important;

}



div.orbit {

	width: 100% !important;

	height: 775px !important;

}

div.slider-nav span {

	height: 61px;

	width: 61px;

	margin-top: -370px;

	background-repeat: no-repeat;

}

div.slider-nav span.left {

	background: url("/resources/template/slide-left.png");

}



div.slider-nav span.right {

	background: url("/resources/template/slide-right.png");

}



/* ss overlay */

/*

.slideshow:after {

	content: url('slideshow_overlay.png');

	position: absolute;

	top: 0;

	right: 0;

	z-index: 10;

}



.orbit > div {

	z-index: 0;

}

*/



/* ss nav features */

/*

div.slider-nav span {



}



div.slider-nav span.left {

	background-image: url('slider_left.png');

}



div.slider-nav span.right {

	background-image: url('slider_right.png');

}



.orbit-wrapper .orbit-caption {



}



.orbit-wrapper .timer {

	display: none;

}



.orbit-bullets {

	bottom: 10px;

	left: 0;

	margin: 0;

}



.orbit-bullets li {

	width: 10px;

	height: 10px;

	background: transparent url('slider_bullet.png') center center no-repeat;

	margin-left: 10px;

}



.orbit-bullets li.active {

	background-image: url('slider_active.png');

	background-position: center center;

}

*/



/* galleries */

div.gallery {

	padding: 0px;

	/*

	border: 1px solid #CCCCCC;

	border-radius: 5px;

	*/

	position: relative;

	margin: 0px auto;

	overflow: hidden;

}



div.gallery ul {

	list-style-type: none;

	margin: 0 0;

	padding: 0;

	position: relative;

}



div.gallery li {

	float: left;

	margin: 15px 25px 10px 0px !important;

	padding: 0;

	width: 260px;

	height: 260px;

	line-height: 260px;

	text-align: center;

}



div.gallery a {

	display: inline-block;

	vertical-align: middle;

	width: 100%;

	overflow: hidden;

}



.gallery img {

	box-sizing: border-box;

	vertical-align: middle;

	width: 260px;

	height: 260px;

	max-width: 100%;

	max-height: 100%;

	border: 1px solid #CCCCCC;

	border-radius: 5px;

}



/* default form styling

 * - apply .contact class to any form

 * - note .button styling at top of file

 */

form.contact {
	margin-top: 8px;
}

.contact p {
	margin-bottom: 10px;
}

.contact p.action {
	
}

.contact .action .button {
	border-bottom: none;
}

.contact label {
	display: inline-block;
	/*width: 100%; */
	vertical-align: top;
	line-height: 40px;
}

.contact label.error {
	width: auto;
	font-size: 0.875em;
	color: #fd1a00;
	margin-left: 10px;
}

.contact input[type=text],
.contact input[type=password],
.contact select {
	width: 100%;
	font-family: inherit;
	font-size: 16px;
	border: none;
	background: #f4f4f4;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	padding: 12px 15px;
	
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	
}

.contact input[type=submit] {
	border: none !important;
}

.contact input[type=password], form.contact input.password, .contact .auth + input {
	
}
img.auth { vertical-align: middle; }

.contact textarea {
	width: 100%;
	height: 115px;
	font-family: inherit;
	font-size: 16px;
	
	border: none;
	background: #f4f4f4;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	padding: 12px 15px;
	
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}

/* basic code for using customised radio button graphics
 * - checkboxes can be handled similarly
 * - fallback to normal in <= IE8
 */
.contact input[type=radio] + label {
	position: relative;
	width: auto;
	margin-right: 30px;
}

.contact input[type=radio] {
	margin-top: 12px;
}
 
.contact input[type=radio] + label:after {
	content: '';
	display: block;
	position: absolute;
	left: -22px;
	top: 12px;
	height: 18px;
	width: 18px;
	border-radius: 9px;
	background: #e1e1e1;
}

.contact input[type=radio]:checked + label:after {
	background: #000;
}

.login-form .more-details {
	display: none;
}
.login-form .update-details {
	display: none;
}

/* blog */

.blog-summary > div {

	clear: both;

	padding-bottom: 1em;

	margin-bottom: 1em;

	border-bottom: 1px solid #CCC;

	overflow: hidden;

}



.hasSidebar .blog-feature-image {

	display: table-cell;

}



.blog-feature-image img {

	display: block;

	border: 1px solid #CCC;

	border-radius: 5px;

	max-width: 100%;

}



.hasSidebar .blog-summary {

	display: table-cell;

	vertical-align: top;

	padding-left: 10px;

}



.blog-article .blog-feature {

	display: block;

	margin: 0 auto 1em;

	display: block;

	border: 1px solid #CCC;

	border-radius: 5px;

}



.articleNav {

	width: 100%;

	height: 2em;

}





.articleNav {

	width: 100%;

	height: 2em;

}



.articleNav .previous { /* older */

	float: right;

}



.articleNav .previous a:after {

	content: '>>';

	position: absolute;

	left: 101%;

	top: -0.0625em;

}



.articleNav .next { /* newer */

	float: left;

}



.articleNav .next a:before {

	content: '<<';

	position: absolute;

	right: 101%;

	top: -0.0625em;

}





.regionList

{

	padding: 15px 10px;

	box-shadow: 0px 0px 7px 7px rgba(0, 0, 0, 0.05);

	border-radius: 10px;

	overflow: hidden;

	font-size: 15px;

	width: 696px;

	margin: auto;

}



.regionList li

{

	float: left;

	display: block;

}



.regionList li a

{

	width: 150px;

	padding: 10px;

	border: 3px;

	display: block;

	color: #6d6e71;

	background-color: #f9f9f9;

	border: 2px solid #dfdfdf;

	border-bottom: 1px solid #dfdfdf;

}



.regionList li.sel a,

.regionList li a:hover,

.regionList li a:focus,

.regionList li a:active

{

	background-color: #a29061;

	color: #fff;

}



.stockists

{

	width: 716px;

	margin: auto;

	border-radius: 10px;

	margin-top: 80px;

	position: relative;

	margin-bottom: 50px;

}



.stockists:before,

.stockists:after

{

	content: "\0000a0";

	width: 0px;

	height: 0px;

	clear: both;

	overflow: hidden;

	display: block;

}



.stockists h2

{

	position: absolute;

	top: -65px;

	left: 10px;

}



.stockists div

{

	float: left;

	height: 155px;

	padding: 10px;

	width: 155px;

	position: relative;

	box-shadow: 0px 0px 7px 7px rgba(0, 0, 0, 0.05);

	margin: 2px;

}



.stockists h3

{

	font-size: 17px;

	margin: 0px;

}



.stockists p

{

	margin: 0px;

	font-size: 14px;

	line-height: 19px;

}



.stockists .mapLink

{

	position: absolute;

	bottom: 10px;

	left: 10px;

	padding-left: 40px;

	padding-top: 15px;

	background: url(map.png) left no-repeat;

}



/** shopping cart (collapsible) **/

/*

.cart-bg {

 	display: block;

	margin: 0;

	padding: 40px 25px 40px;

	background: #f0f6f7 url('bg.jpg') left top repeat;

}

*/



.cart_options {

	border: 1px solid #bcc6d5;

	background: #FFF;

	margin-bottom: 15px;

}

.cart_options h4 {

	font-size: 1em;

	font-weight: normal;

	padding: 10px;

	background: #ffebf0;

	border-bottom: 1px solid #bcc6d5;

	margin: 0;

}



.cart_options p {

	padding: 10px 30px;

	background: #FFF;

	margin: 0;

}



.cart table {

	text-align: center;

	width: 100%;

	border: none;

	border-collapse: collapse;

}



.cart thead {

	border: 1px solid #bcc6d5;

	background: #ffebf0;

}



.cart th {

	font-weight: normal;

	padding: 10px 5px;

	font-size: 0.875em;

}



.cart tbody {

	border-left: 1px solid #bcc6d5;

	border-right: 1px solid #bcc6d5;

	background: #FFF;

	font-size: 0.875em;

}



.cart td {

	padding: 10px;

	vertical-align: middle;

}



.cart td.image a {

	display: block;

	position: relative;

	width: 105px;

	height: 105px;

	border: 1px solid #80c5e0;

	border-radius: 3px;

	background: #FFF;

}



.cart td.image img {

	display: block;

	position: absolute;

	top:0; left: 0; bottom: 0; right: 0;

	margin: auto;

	height: auto;

	max-height: 100px;

	max-width: 100px;

}



.cart td.name {

	text-align: left;

	font-size: 1.143em;

}



.cart td.quantity input {

	width: 1em;

	padding: 10px;

	text-align: center;

}



.cart td.total {

	font-weight: bold;

	color: #f13c65;

}



.cart tfoot {

	border-top: 1px solid #bcc6d5;

}



.cart tfoot td:last-child {

	text-align: right;

}



.cart span.total {

	font-weight: bold;

}



.cart span.value.total {

	font-size: 1.123em;

	color: #f13c65;

}



.cart h2 {

	font-family: Arial, serif;

	font-size: 1em;

}



.cart h3 {



	font-family: Arial, serif;

	color: #F13C65;

	margin: 0;

}



form.checkout-options {

	width: 50%;

	float: left;

}



form.checkout-options + .checkout-options {

	width: 45%;

	float: right;

}



form.checkout-options .button {

	margin-top: 0;

	margin-bottom: 0;

}



.cart .login-form p {

	position: relative;

}



.cart .login-form label {

	position: absolute;

	left: 0;

	top: 0;

	z-index: -1;

}



.cart .login-form input[type=text], .cart .login-form input[type=password] {

	display: block;

	width: 100%;

}



.cart .warning

{

	color: #fd1a00;

	font-size: 2em;

}



.ui-helper-reset {

	font-size: 1em;

}



.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {

	background: #ffebf0;

	border-color: #bcc6d5;

	border-radius: 0;

}



.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {

	background: #ffebf0;

	border-color: #bcc6d5;

	border-radius: 0;

}



.ui-accordion-content {

	margin-bottom: 10px;

	border-radius: 0;

	font-size: 0.875em;

}



.ui-accordion-header {

	font-size: 0.875em;

}



.ui-accordion-content  + .ui-accordion-header {

	margin-top: 10px;

}



/* print order */

#print-order table {

	width: 100%;

}



#print_order th, #print-order td {

	vertical-align: top;

}



#print-order thead tr:first-child > * {

	border-bottom: 1px solid #423f3f;

	padding-bottom: 4px;

}



#print-order thead th:first-child {

	text-align: left;

}



#print-order tbody th {

	font-weight: normal;

	padding-bottom: 4px;

}



#print-order tfoot tr:first-child > * {

	border-top: 1px solid #423f3f;

	padding-top: 4px;

}



#print-order tbody {

	padding: 4px 0;

}



#print-order tbody th, #print-order tfoot th {

	font-weight: normal;

	text-align: left;

}





#print-order td+td, #print-order tfoot td+td {

	text-align: center;

}



#print-order td+td+td, #print-order tfoot td+td+td {

	text-align: right;

}



#print-order th:last-child {

	text-align: right;

}



/* customers/orders */

table.orders {

	width: 100%;

	border-collapse: collapse;

}



.orders th, .orders td {

	padding: 4px;

	vertical-align: top;

}



.orders tbody *:first-line {



}



.orders thead tr:first-child > * {

	border-bottom: 1px solid #423f3f;

	text-indent: 0;

}



.orders tbody th {

	font-weight: normal;

	text-indent: 0;

}



.orders .ref {

	text-align: left;

}



.orders .date {

	width: 95px;

}



.orders .details {

	text-align: left;

	text-indent: 1em;

}



.orders .price {

	text-align: right;

}



.orders .link {

	text-align: right;

	width: 75px;

}



/** files **/

.file {

	position: relative;

	overflow: hidden; /* float clearing */

	padding: 15px;

	margin-bottom: 10px;

}



.file h2 {

	margin-bottom: 1em;

}



.file .button {

	position: absolute;

	top: 6px;

	right: 10px;

}



#hoverCart

{

	position: fixed;

	top: 50px;

	right: 50px;

	width: 200px;

	background-color: rgba(48, 48, 48, 0.8);

	background-color: #303030\9;

	color: #fff;

	padding: 15px;

	border-radius: 5px;

	overflow: auto;

	z-index: 1000;

	max-height: 100%;

	max-height: calc(100% - 100px);

}



#hoverCart h1,

#hoverCart h2,

#hoverCart h3

{

	color: #fff;

	margin: 0px 0px 5px;

	border-bottom: 1px solid #fff;

	padding-bottom: 3px;

}



#hoverCart a

{

	color: #fff;

}



#hoverCart .items

{

	overflow: hidden;

	display: block;

	border-bottom: 1px solid #fff;

	padding-bottom: 5px;

	margin-bottom: 5px;

}



#hoverCart .checkout

{

	float: left;

}



#hoverCart .dismiss

{

	display: block;

	text-align: right;

	float: right;

}



#hoverCart .row

{

	border-bottom: 1px solid #fff;

	position: relative;

	overflow: hidden;

	padding: 10px 0px 5px;

}



#hoverCart .row .right

{

	text-align: right;

	font-family: "Courier New", Courier, monospace;

}



#hoverCart .remove

{

	font-size: 12px;

	display: block;

}



input:disabled,

textarea:disabled

{

	opacity: 0.5;

}



/* tinymce universal formatting */

#tinymce {width: 940px; padding: 10px; background: #FFF; text-align: left; font-size: 1em; color: #666;}

#tinymce p { padding: 0 0 1em;}

#tinymce form { outline: 1px dotted #F00;}

#tinymce a { border-bottom: 1px dotted #002D4A; color: #002D4A; text-decoration: none; }

.limg, .rimg {
	border-radius:3px;
}

.rimg {
	float: right;
}

.bookbutton {
  background:#FF8A00;
  border-radius:28px;
  color:#FFFFFF;
  display:block;
  font-family:Raleway, sans-serif;
  font-size:17px;
  height:50px;
  line-height:50px;
  margin:25px 0px;
  text-align:center;
  width:200px; 
}

.bookbutton:focus, .bookbutton:hover {
  background:#333333;
  text-decoration:underline;
}

.contact-left {
	float:left;
	width: 45%;
}

.google-map {
	float:right;
	width: 45%;
	text-align:right;
}

#google_translate_element {
	float: left;
	
}

.transpace {
	width:100%;
	height:35px;
	margin-top:-30px;
	margin-bottom:20px;
}
	

.award {
	height:150px;
}