/* ----------- COLOURS -------------------------------------------------------------------- {
	
	RED				:	#FC060B
	
}
/* ---------------------------------------------------------------------------------------- } */
/* ----------- DEFAULTS ------------------------------------------------------------------- { */
	
	*, *:before, *:after { margin:0; padding:0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
	
	img { border:none; width: 100%; height: auto; }
	button:focus { outline: 0; }
	
	html, body { width: 100%; height: 100%; }
	
	body {
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 0.95em;
		background-color: #000;
		color: #fff;
	}
	h1, h2, h3, h4, h5, h6 {
		position: relative;
		font-family: 'Pontano Sans', sans-serif;
		font-weight: normal;
	}
	a, button, .tabbed-content > ul:first-child > li,
	#header-nav > nav > ul > li {
		webkit-transition: all, 300ms, ease-in;
		-moz-transition: all, 300ms, ease-in;
		-ms-transition: all, 300ms, ease-in;
		-o-transition: all, 300ms, ease-in;
		transition: all, 300ms, ease-in;
	}
	a:link, a:visited {
		text-decoration: none;
		color: #fff;
	}
	a:hover, a:active {
		color: #FC060B;
	}
	a.btn:link, a.btn:visited {
		display: inline-block;
		background-color: #FC060B;
		border: 1px solid #FC060B;
		color: #fff;
		text-transform: uppercase;
		padding: 10px 16px;
	}
	a.btn:hover, a.btn:active {
		background-color: transparent;
	}
	button {
		width: 100%;
		font-family: 'Pontano Sans', sans-serif;
		font-weight: normal;
		text-align: center;
		text-transform: uppercase;
		background-color: #FC060B;
		border: 1px solid #FC060B;
		color: #fff;
		padding: 1.2em;
		cursor: pointer;
	}
	button:hover, div.btn:hover {
		background-color: transparent;
	}
	.center {
		left: 50%;
		-webkit-transform: translate(-50%, 0);
		-moz-transform: translate(-50%, 0);
		-o-transform: translate(-50%, 0);
		-ms-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}
	.hideme {
		display: none !important;
	}
	.red {
		color: #FC060B;
	}
	.ajax-preloader-container-bg {
		position: fixed;
		z-index: 9999;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0,0,0,0.7);
	}
	.ajax-preloader-container-bg > .ajax-preloader {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		background-size: 40px;
		min-width: 40px;
		min-height: 40px;
		color: #FFFFFF;
		font-size: 2em;
	}
	.tooltip {
		display: inline;
		position: relative;
	}
	.tooltip:hover:after {
		background: #333;
		background: rgba(0,0,0,.8);
		border-radius: 5px;
		bottom: 20px;
		color: #fff;
		content: attr(data-tooltip);
		left: 0;
		padding: 1em;
		position: absolute;
		z-index: 98;
		min-width: 130px;
		font-size: 0.8em;
	}
	.tooltip:hover:before {
		border: solid;
		border-color: #333 transparent;
		border-width: 6px 6px 0 6px;
		bottom: 15px;
		content: "";
		left: 50%;
		position: absolute;
		z-index: 99;
	}
	.parallax {
		background-attachment: fixed;
		background-position: center center;
		background-size: cover;
	}
	#scroll-top {
		display: none;
		position: fixed;
		bottom: 20px;
		right: 20px;
		background-color: rgba(0, 0, 0, 0.4);
		color: #fff;
		cursor: pointer;
		padding: 12px 20px;
	}
	.goto {
		cursor: pointer;
	}

/* ---------------------------------------------------------------------------------------- } */
/* ----------- STRUCTURE ------------------------------------------------------------------ { */
	
	.container {
		padding: 0 15%;
	}
	.dev-content {
		
	}
	.dev-content h1 {
		font-size: 3em;
		padding: 12px 0 8px 0;
	}
	.dev-content h2 {
		font-size: 2em;
		margin: 20px 0;
	}
	.dev-content h3 {
		font-size: 1.3em;
		margin-bottom: 10px;
	}
	.dev-content p {
		margin-bottom: 10px;
		line-height: 1.6em;
	}
	.dev-row {
		position: relative;
		display: table;
		width: 100%;
		margin-bottom: 20px;
	}
	.dev-column {
		position: relative;
		display: table-cell;
		vertical-align: top;
	}
	.dev-section > img {
		display: block;
	}
	.dev-column.one-up { width: 100%; }
	.dev-column.two-up { width: 50%; }
	.dev-column.three-up { width: 33.33%; }
	.dev-column.four-up { width: 25%; }
	.dev-column.five-up { width: 20%; }
	.dev-column.six-up { width: 16.66%; }
	.dev-column.seven-up { width: 14.29%; }
	.dev-column.eight-up { width: 12.5%; }
	.dev-column.nine-up { width: 11.11%; }
	.dev-column.ten-up { width: 10%; }
	.dev-column.eleven-up { width: 9.09%; }
	.dev-column.twelve-up { width: 8.33%; }
	.dev-column.thirteen-up { width: 7.69%; }
	.dev-column.fourteen-up { width: 7.14%; }
	.dev-column.fifteen-up { width: 6.66%; }
	.dev-column.sixteen-up { width: 6.25%; }
	.dev-column.seventeen-up { width: 5.88%; }
	.dev-column.eighteen-up { width: 5.55%; }
	.dev-column.nineteen-up { width: 5.26%; }
	.dev-column.twenty-up { width: 5%; }

/* ---------------------------------------------------------------------------------------- } */
/* ----------- HEADER --------------------------------------------------------------------- { */
	
	body > header {
		position: relative;
		margin: 20px 0 10px;
	}
	body > header > .header {
		display: table;
		position: relative;
		width: 100%;
	}
	#header-logo {
		display: table-cell;
		vertical-align: bottom;
		width: 300px;
		padding-right: 20px;
	}
	#header-nav {
		display: table-cell;
		vertical-align: bottom;
		padding-bottom: 16px;
	}
	#header-contact {
		position: absolute;
		top: 0;
		right: 0;
		text-align: right;
	}

/* ---------------------------------------------------------------------------------------- } */
/* ----------- FOOTER --------------------------------------------------------------------- { */
	
	body > footer > .footer {
		padding-bottom: 60px;
	}

/* ---------------------------------------------------------------------------------------- } */
/* ----------- NAV ------------------------------------------------------------------------ { */
	
	li.active a:link, li.active a:visited {
		color: #FC060B;
	}
	.mobile-btn {
		background-color: transparent;
		text-align: left;
		width: auto;
		padding: 10px 15px;
		border: none;
	}
	#header-nav {
		position: relative;
		font-size: 1em;
		text-align: right;
	}
	#header-nav > nav ul {
		list-style-type: none;
	}
	#header-nav > nav > ul {
		display: table;
		width: 100%;
	}
	#header-nav > nav > ul > li {
		position: relative;
		display: table-cell;
		text-align: center;
		border-left: 1px solid #FC060B;
		padding: 5px 0;
	}
	#header-nav > nav > ul > li:last-child {
		border-right: 1px solid #FC060B;
	}
	#header-nav > nav > ul > li > ul {
		webkit-transition: all, 300ms, ease-in;
		-moz-transition: all, 300ms, ease-in;
		-ms-transition: all, 300ms, ease-in;
		-o-transition: all, 300ms, ease-in;
		transition: all, 300ms, ease-in;
		visibility: hidden;
		filter: alpha(opacity=100);
		opacity: 0;
		position: absolute;
		top: 100%;
		left: 0;
		z-index: 1001;
		background-color: #383838;
		border: 1px solid #1f1f1f;
		text-align: left;
		border-top: 25px solid #000;
	}
	#header-nav > nav > ul > li > ul a {
		display: inline-block;
		padding: 6px 18px;
		white-space: nowrap;
		color: #fff;
	}
	#header-nav > nav > ul > li > ul > li:first-child > a {
		padding-top: 20px;
	}
	#header-nav > nav > ul > li > ul > li:last-child > a {
		padding-bottom: 20px;
	}
	#header-nav > nav > ul > li:hover > ul {
		visibility: visible;
		filter: alpha(opacity=0);
		opacity: 1;
	}
	#header-nav > nav i.md-icon {
		display: none;
		position: absolute;
		top: 0;
		right: 0;
		padding: 12px;
		cursor: pointer;
	}
	#header-nav > nav i.md-icon:hover {
		color: #DA251C;
	}
	#header-nav > nav.mobile i.md-icon {
		display: block;
	}
	#header-nav > nav.mobile {
		display: none;
		clear: both;
		float: initial;
		position: absolute;
		top: 105%;
		left: 0;
		z-index: 2;
		width: 100%;
		background-color: #4d4d4d;
		border-top: 2px solid #DA251C;
	}
	#header-nav > nav.mobile > ul li {
		display: block;
		padding: 12px;
		border-bottom: 1px solid #e4e4e4;
		border-left: none;
		text-align: center;
	}
	#header-nav > nav.mobile > ul > li:last-child {
		border-right: none;
	}
	#header-nav > nav.mobile a {
		white-space: initial;
		padding: 0;
	}
	#header-nav > nav.mobile > ul > li > ul > li:first-child > a {
		padding-top: 0;
	}
	#header-nav > nav.mobile > ul > li > ul > li:last-child a {
		padding-bottom: 0;
	}
	#header-nav > nav.mobile > ul > li > ul {
		display: none;
		position: relative;
		visibility: visible;
		filter: alpha(opacity=0);
		opacity: 1;
		border: none;
		margin-top: 10px;
	}
	#header-contact > .social {
		margin-bottom: 6px;
	}
	#header-contact > .social > a {
		margin-left: 10px;
		color: #b8b8b8;
		font-size: 1.2em;
	}
	#header-contact > .social > a:hover, #header-nav > .social > a:active {
		color: #FC060B;
	}

/* ---------------------------------------------------------------------------------------- } */
/* ----------- MAIN ----------------------------------------------------------------------- { */
	
	.row-box3up .dev-column {
		background: #404245; /* Old browsers */
		background: -moz-linear-gradient(top,  #404245 0%, #000000 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #404245 0%,#000000 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #404245 0%,#000000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#404245', endColorstr='#000000',GradientType=0 ); /* IE6-9 */
	}
	.row-box3up .dev-column-inner {
		padding: 30px 20px;
		text-align: center;
	}
	.row-box3up p {
		text-align: justify;
	}
	.fullpic-btn {
		display: none;
		position: absolute;
		bottom: 0;
		right: 0;
		padding: 10px;
	}
	.layout-sidemenu .dev-column h1 {
		font-size: 1.8em;
	}
	.layout-sidemenu .dev-column:first-child {
		width: 33.33%;
		padding-right: 40px;
	}
	.layout-sidemenu .dev-column:first-child h1 {
		font-size: 1.6em;
		text-transform: uppercase;
		border-right: 1px solid #B8B8B8;
		border-bottom: 1px solid #B8B8B8;
	}
	.layout-sidemenu .dev-column:last-child {
		width: 66.66%;
	}
	.layout-sidemenu .dev-column:first-child ul {
		list-style-type: none;
	}
	.layout-sidemenu .dev-column:first-child ul > li {
		border-right: 1px solid #B8B8B8;
		border-bottom: 1px solid #B8B8B8;
		font-size: 1em;
		padding: 10px;
	}
	.layout-sidemenu .dev-column:first-child ul > li.active {
		border-bottom: 1px solid #FC060B;
		background: url("/custom/images/icon.png") center left / 20px 20px no-repeat;
		padding-left: 30px;
	}
	.awards .dev-section:not(:first-child) {
		display: inline-block;
		width: 80%;
		vertical-align: middle;
	}
	.awards .dev-section:nth-child(even) {
		width: 20%;
		padding: 2em;
	}
	.contact {
		margin-top: 2em;
	}
	.contact .table-cell:first-child {
		font-size: 2em;
		width: 50px;
	}
	#contact-form button {
		width: auto;
	}
	.charcoal-products {
		margin-top: 170px;
		padding: 1em;
		background-color: #464646;
		min-height: 210px;
	}
	.charcoal-products.shoprite {
		margin-top: 80px;
	}
	.charcoal-products .table-cell {
		position: relative;
		vertical-align: bottom;
	}
	.charcoal-products h1 {
		padding: 2em 0;
	}
	.charcoal-products h2 {
		display: inline-block;
		width: auto;
		padding: 5px;
		margin: 0 0 10px 0;
		font-size: 1.6em;
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff;
	}
	.charcoal-products h3 {
		margin: 0 !important;
		font-weight: bold;
	}
	.charcoal-products p {
		margin-bottom: 10px !important;
		line-height: 1.4em !important;
	}
	.charcoal-products .table-cell:first-child {
		width: 40%;
	}
	.charcoal-products .table-cell:first-child img {
		position: absolute;
		bottom: 0;
		left: 0;
	}
	#map {
		height: 430px;
	}

/* ---------------------------------------------------------------------------------------- } */
/* ----------- FORMS ---------------------------------------------------------------------- { */
	
	.page-status {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		text-align: center;
		min-width: 320px;
		padding: 2em;
		margin-left: 0;
		width: auto;
	}
	.page-status > p {
		margin-bottom: 1em;
		font-size: 0.8em;
	}
	.status:not(:empty) {
		width: 100%;
		margin: 20px 0;
		padding: 10px;
		border-radius: 5px;
		font-size: 0.8em;
		color: black;
		text-align: center;
	}
	.success {
		background-color: #D4FECC;
		border: 1px solid #A1DA96;
		color: #000000;
	}
	.error, .validate-msg {
		background-color: #FED2D3;
		border: 1px solid #D8929C;
		color: #000000;
	}
	.validate-msg-wrapper {
		position: absolute;
		top: -2px;
		right: 5px;
	}
	.validate-msg {
		font-family: sans-serif;
		font-size: 0.7em;
		padding: 5px;
	}
	.validate-msg-error {
		outline: none;
		border-color: #D8929C !important;
		box-shadow: 0 0 5px #D8929C;
	}
	div.form-section {
		margin: 1em 0;
		border: 1px dashed #888;
		padding: 0.5em 1em 1em;
	}
	div.form-section > h2 {
		position: relative;
		text-align: left;
		padding-left: 50px;
		margin: 10px 0;
	}
	div.form-section > h2 > span {
		position: absolute;
		top: 0;
		left: 0;
		background-color: #E60033;
		color: #fff;
		width: 40px;
		height: 35px;
		line-height: 35px;
		text-align: center;
		font-size: 0.6em;
	}
	div.form-row {
		position: relative;
		float: left;
		width: 100%;
		padding: 0.2em;
		margin-bottom: 5px;
		text-align: left;
	}
	div.form-row.one-up {
		clear: both;
		float: initial;
	}
	div.form-row.two-up {
		width: 50%;
	}
	div.form-row.three-up {
		width: 33.33%;
	}
	div.form-row.four-up {
		width: 25%;
	}
	div.form-row label {
		display: block;
		margin-bottom: 0.2em;
		font-size: 0.8em;
	}
	div.form-row input, div.form-row select, div.form-row textarea {
		width: 100%;
		border: 1px solid #61727b;
		color: #61727b;
		padding: 0 35px 0 1em;
		font-size: 1em;
		line-height: 3.1em;
	}
	div.form-row select {
		padding: 0.5em;
	}
	div.form-row textarea {
		height: 160px;
		line-height: initial;
		padding: 1em;
	}
	div.form-row > button {
		margin-bottom: 0.5em;
	}
	div.form-row > button > p {
		text-transform: initial;
	}
	div.form-row > i.fa {
		position: absolute;
		bottom: 8px;
		right: 15px;
		font-size: 1.6em;
		color: #15171C;
	}
	div.form-row.checkbox input, div.form-row.checkbox label {
		display: inline-block;
		vertical-align: middle;
		width: auto;
		font-size: 1.2em;
	}
	div.form-row.checkbox input {
		width: 1.5em;
	}
	div.form-row input[type=number] {
		padding-right: 0;
	}
	div.form-row > button.boolean {
		width: 50%;
		border-right: 1px solid #FFFFFF;
		margin-bottom: 0;
		padding: 1.3em;
	}
	div.form-row > button.boolean:last-child {
		border-right: none;
	}
	div.form-row > button.boolean.active {
		background-color: #F16522;
	}
	div.form-row > button.boolean.active:hover {
		color: #fff;
	}
	div.form-row.one-up > button.boolean {
		width: 25%;
	}
	#filter div.form-row > button.boolean {
		padding: 10px;
	}
	div.form-row span.currency:before {
		position: absolute;
		bottom: 3px;
		left: 3px;
		content: "R";
		padding: 10px;
		background-color: #23272F;
		color: #fff;
	}
	div.form-row span.currency > input[type=number] {
		padding-left: 40px;
	}
	div.form-row.submit-control {
		display: table;
	}
	div.form-row.submit-control > div {
		display: table-cell;
		padding-right: 10px;
	}
	div.form-row.submit-control > div:last-child {
		padding-right: 0;
	}
	div.areuhuman {
		height: 48px;
		border: 1px solid;
		text-align: center;
		background-color: #fff;
		overflow: hidden;
	}
	div.areuhuman > img {
		width: auto;
		height: 58px;
	}
	.ui-timepicker-table th.periods {
		padding: 0 0.5em;
	}
	.ui-timepicker-table td a {
		padding: .2em;
		cursor: pointer;
		width: 3em;
		font-size: 0.8em;
		text-align: center;
	}
	
/* ---------------------------------------------------------------------------------------- } */
/* ----------- TABLE ---------------------------------------------------------------------- { */

	table {
		width: 100%;
		border-collapse: collapse;
		border: 1px solid #d6ab52;
	}
	table th, table td {
		padding: 10px;
		text-align: left;
		border-right: 1px solid #d6ab52;
	}
	table th:last-child, table td:last-child {
		border-right: none;
	}
	table th {
		background-color: #B19355;
		color: #000;
		font-weight: normal;
	}
	table > tbody tr {
		background-color: #f3f3f3;
	}
	table > tbody tr:nth-child(even) {
		background-color: #eaeaea;
	}
	.table-wrapper {
		display: table;
		width: 100%;
	}
	.table-cell {
		display: table-cell;
		vertical-align: top;
	}
	
/* ---------------------------------------------------------------------------------------- } */
/* ----------- LOGIN ---------------------------------------------------------------------- { */

	#login-status h3 {
		margin-bottom: 1em;
	}
	#login-status button {
		margin-bottom: 1px;
	}
	
/* ---------------------------------------------------------------------------------------- } */
/* ----------- SLIDER --------------------------------------------------------------------- { */

	.slider > ul {
		list-style-type: none;
	}
	.slider > ul > li {
		position: relative;
	}
	.slider > ul > li .image-layer {
		position: absolute;
		top: 0;
		left: 0;
	}
	.slider > ul > li .caption {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		color: black;
		font-size: 1.8em;
	}
	.slider > ul > li .caption.left {
		left: 10%;
		-webkit-transform: translate(0, -50%);
		-moz-transform: translate(0, -50%);
		-o-transform: translate(0, -50%);
		-ms-transform: translate(0, -50%);
		transform: translate(0, -50%);
	}
	.slider > ul > li .caption.right {
		right: 10%;
		-webkit-transform: translate(0, -50%);
		-moz-transform: translate(0, -50%);
		-o-transform: translate(0, -50%);
		-ms-transform: translate(0, -50%);
		transform: translate(0, -50%);
	}
	.slider > ul > li .caption h2, .slider > ul > li .caption h3, .slider > ul > li .caption h4 {
		color: #fff;
		text-shadow: 0px 1px 8px rgba(0, 0, 0, 0.8);
	}
	.slider > ul > li .caption h2 {
		font-size: 4em;
	}
	.slider > ul > li .caption h3 {
		font-size: 2.6em;
	}
	.slider > ul > li .caption h4 {
		font-size: 2em;
		margin-bottom: 10px;
	}
	.slider > ul > li .caption h2, .slider > ul > li .caption p, .slider > ul > li .caption a {
		white-space: nowrap;
	}
	.slider > ul > li .caption p {
		line-height: 1.2em;
	}
	.slider > ul > li .caption a {
		font-size: 0.5em;
	}
	.slider > ul > li .caption hr {
		margin: 10px 0;
		border: 2px solid #fff;
	}
	
/* ---------------------------------------------------------------------------------------- } */
/* ----------- BLOG ----------------------------------------------------------------------- { */

	.blog-wrapper {
		display: table;
		width: 100%;
	}
	.blog-wrapper .blog-list, .blog-wrapper aside {
		display: table-cell;
		vertical-align: top;
	}
	.blog-wrapper .blog-box {
		display: table;
		margin-top: 40px;
		text-align: left;
	}
	.blog-wrapper .blog-img {
		position: relative;
		display: table-cell;
		vertical-align: top;
	}
	.blog-wrapper .blog-data {
		display: table-cell;
		vertical-align: top;
		padding-left: 20px;
	}
	.blog-wrapper .blog-date {
		position: absolute;
		top: 0;
		left: 0;
		margin: 1em;
		padding: 1em;
		background-color: #242424;
		color: #fff;
		text-align: center;
		font-size: 0.8em;
	}
	.blog-wrapper .blog-date > span {
		display: block;
	}
	.blog-wrapper .blog-date > span:first-child {
		font-size: 2em;
	}
	.blog-wrapper .blog-data > h2 {
		color: #fff;
		margin: 0;
	}
	.blog-wrapper .blog-data > .blog-admin, .blog-wrapper .blog-data > .blog-article {
		margin: 10px 0;
	}
	.blog-wrapper.widget .blog-box {
		display: table;
		width: 100%;
		margin-top: 20px;
	}
	.blog-wrapper.widget .blog-img, .blog-wrapper.widget .blog-data {
		display: table-cell;
		vertical-align: top;
	}
	.blog-wrapper.widget .blog-img {
		width: 80px;
		height: 80px;
	}
	.blog-wrapper.widget .blog-img > img {
		width: 100%;
		height: 100%;
	}
	.blog-wrapper.widget .blog-data {
		font-size: 0.8em;
		padding-left: 10px;
	}
	.blog-wrapper.widget .blog-data > h2, .blog-wrapper.widget .blog-data > .blog-admin, .blog-wrapper.widget .blog-data > .blog-article {
		margin: 0 0 5px 0;
	}
	.blog-wrapper aside {
		display: none;
		width: 360px;
		padding-left: 30px;
	}
	.blog-wrapper aside > section {
		margin-top: 40px;
	}
	.blog-wrapper aside > section > h3 {
		font-weight: bold;
		text-transform: initial;
		padding-bottom: 0;
		margin-bottom: 20px;
		color: #fff;
	}
	.blog-wrapper aside > section > h3:after {
		height: 0;
	}
	.blog-wrapper aside > section > ul {
		list-style-type: none;
	}
	.blog-wrapper aside > section > ul > li {
		padding: 1em 0;
		border-bottom: 1px solid #eee;
	}
	
/* ---------------------------------------------------------------------------------------- } */
/* ----------- TABBED CONTENT ------------------------------------------------------------- { */

	.tabbed-content > ul {
		list-style-type: none;
	}
	.tabbed-content > ul:first-child {
		display: table;
		width: 100%;
		table-layout: fixed;
	}
	.tabbed-content > ul:first-child > li {
		display: table-cell;
		vertical-align: top;
		background-color: #fff;
		border: 1px solid #eee;
		padding: 1em;
		text-align: center;
		cursor: pointer;
	}
	.tabbed-content > ul:first-child > li:hover, .tabbed-content > ul:first-child > li.active {
		color: #DA251C;
	}
	.tabbed-content > ul:first-child > li > i.fa {
		font-size: 2em;
	}
	.tabbed-content > ul:first-child > li > img {
		width: 206px;
	}
	.tabbed-content > ul:first-child > li > h3 {
		margin-top: 10px;
		margin-bottom: 0;
	}
	.tabbed-content > ul:first-child > li > h3:after {
		height: 0;
	}
	.tabbed-content > ul:last-child {
		position: relative;
		display: block;
		width: 100%;
		background-color: #fff;
		border: 1px solid #eee;
		margin-top: 4px;
	}
	.tabbed-content > ul:last-child > li {
		position: absolute;
		top: 0;
		left: 0;
		display: none;
		width: 100%;
		padding: 3em;
		background-color: #fff;
	}
	.tabbed-content > ul:last-child > li:first-child {
		display: block;
	}
	.tabbed-content > ul:last-child > li .dev-content {
		min-height: initial;
	}
	.tabbed-content > ul:last-child > li .container {
		padding: 0;
	}
	
/* ---------------------------------------------------------------------------------------- } */
/* ----------- GALLERY -------------------------------------------------------------------- { */

	.gallery ul {
		list-style-type: none;
		display: table;
		width: 100%;
	}
	.gallery li {
		display: table-cell;
		vertical-align: top;
	}
	.gallery li img {
		display: block;
	}
	
/* ---------------------------------------------------------------------------------------- } */
/* ----------- POPUP ---------------------------------------------------------------------- { */

	.popup-control {
		cursor: pointer;
	}
	.popup-bg {
		display: none;
		position: fixed;
		z-index: 9999;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0,0,0,0.7);
		cursor: initial;
	}
	.popup-bg > .popup {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		background-color: #F7F7F7;
		padding: 50px;
		overflow-y: auto;
		text-align: center;
		min-width: 312px;
		max-width: 98vw;
		max-height: 98vh;
	}
	.popup-bg > .popup > button.btn.btn-popup {
		position: absolute;
		top: 0;
		right: 0;
		width: auto;
	}
	.popup-inner > h1 {
		margin: 0 !important;
		font-size: 2.5em !important;
	}
	.popup-inner > form > button {
		margin-top: 1em;
	}
	.reset-inner {
		white-space: normal;
		text-align: initial;
	}

/* ---------------------------------------------------------------------------------------- } */
/* ----------- MEDIA QUERIES -------------------------------------------------------------- { */

	/* Custom for container */
	@media only screen and (max-width : 1600px) {
		.container {
			padding: 0 10%;
		}
	}
	/* Custom for container */
	@media only screen and (max-width : 1366px) {
		.container {
			padding: 0 8%;
		}
		.charcoal-products {
			margin-top: 120px;
		}
		.charcoal-products.shoprite {
			margin-top: 10px;
		}
	}
	/* Large Devices, Wide Screens */
	@media only screen and (max-width : 1200px) {
		.container {
			padding: 0 5%;
		}
		#header-nav {
			position: initial;
		}
		#header-contact {
			top: -15px;
			right: -10px;
			font-size: 0.8em;
		}
	}
	/* Medium Devices, Desktops */
	@media only screen and (max-width : 1000px) {
		#header-nav > nav > ul > li {
			padding: 0 10px;
		}
		.charcoal-products {
			margin-top: 40px;
		}
		.slider > ul > li .caption h2 {
			font-size: 3em;
		}
		.slider > ul > li .caption h3 {
			font-size: 1.6em;
		}
		.slider > ul > li .caption h4 {
			font-size: 1em;
		}
	}
	/* Small Devices, Tablets */
	@media only screen and (max-width : 768px) {
		.dev-column.one-up,
		.dev-column.two-up,
		.dev-column.three-up,
		.dev-column.four-up,
		div.form-row.two-up,
		div.form-row.three-up,
		div.form-row.four-up,
		.table-cell,
		.blog-wrapper .blog-img,
		.blog-wrapper .blog-data {
			display: block;
			width: 100% !important;
		}
		.dev-column.one-up .dev-section,
		.dev-column.two-up .dev-section,
		.dev-column.three-up .dev-section,
		.dev-column.four-up .dev-section,
		.blog-wrapper .blog-img,
		.blog-wrapper .blog-data {
			padding-left: 0 !important;
			padding-right: 0 !important;
		}
		.layout-sidemenu .dev-column:first-child {
			display: none;
		}
		.layout-sidemenu .dev-column:last-child {
			width: 100%;
		}
		#dev-row-27.layout-sidemenu .dev-column:first-child {
			display: block;
		}
		.charcoal-products .table-cell:first-child img {
			position: relative;
		}
		.slider > ul > li .caption h2 {
			font-size: 2em;
		}
		.slider > ul > li .caption h3 {
			font-size: 1.2em;
		}
		.slider > ul > li .caption h4 {
			font-size: 0.8em;
		}
		.slider > ul > li .caption a {
			font-size: 0.3em;
		}
	}
	/* Extra Small Devices, Phones */ 
	@media only screen and (max-width : 480px) {
		.slider > ul > li .caption h2 {
			font-size: 1.2em;
		}
		.slider > ul > li .caption h3 {
			font-size: 0.8em;
		}
		.slider > ul > li .caption h4 {
			font-size: 0.6em;
		}
	}
	/* Custom, iPhone Retina */ 
	@media only screen and (max-width : 320px) {
		
	}
	
/* ---------------------------------------------------------------------------------------- } */
/* ----------- ANIMATIONS ----------------------------------------------------------------- { */

	@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
	@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
	@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
	
	.unslider-active .caption {
		opacity:0;
		-webkit-animation:fadeIn ease-in 1;
		-moz-animation:fadeIn ease-in 1;
		animation:fadeIn ease-in 1;
	
		-webkit-animation-fill-mode:forwards;
		-moz-animation-fill-mode:forwards;
		animation-fill-mode:forwards;
	
		-webkit-animation-duration:1s;
		-moz-animation-duration:1s;
		animation-duration:1s;
		
		-webkit-animation-delay: 1s;
		-moz-animation-delay:1s;
		animation-delay: 1s;
	}
	
	@-webkit-keyframes fadeOut { from { opacity:1; } to { opacity:0; } }
	@-moz-keyframes fadeOut { from { opacity:1; } to { opacity:0; } }
	@keyframes fadeOut { from { opacity:1; } to { opacity:0; } }
	
	.caption {
		opacity:1;
		-webkit-animation:fadeOut ease-out 1;
		-moz-animation:fadeOut ease-out 1;
		animation:fadeOut ease-out 1;
	
		-webkit-animation-fill-mode:forwards;
		-moz-animation-fill-mode:forwards;
		animation-fill-mode:forwards;
	
		-webkit-animation-duration:1s;
		-moz-animation-duration:1s;
		animation-duration:1s;
	}
	
/* ---------------------------------------------------------------------------------------- } */