// Make sure the charset is set appropriately
@charset "UTF-8";

@import "compass";
@import "compass/reset";
@import "theme_variables";
@import "bootstrap";
@import "font-awesome";

a:hover {
	text-decoration: none;
}

@media only screen and (min-width: 1200px) {
	.container {
		padding-left: 0;
		padding-right: 0;
	}
}

body {
	min-width: 320px;
	height: 100%;
	line-height: 18px;
	font-size: 13px;
	color: $base-body-color;
	&.content_only {
		background: none;
	}
}

textarea {
	resize: none;
}

//structure
#header {
	z-index: 5003;
}

.columns-container {
	background: $light-background;
}

#columns {
	position: relative;
	padding-bottom: 50px;
	padding-top: 15px;
}

#index {
	.tab-content {
		margin-top: 35px;
		margin-bottom: 34px;
	}
}

header {
	z-index: 1;
	position: relative;
	background: $light-background;
	padding-bottom: 15px;
	.banner {
		background: black;
		max-height: 100%;
		.row {
			margin: 0px;
		}
	}
	.nav {
		background: $dark-background;
		.row {
			margin: 0px;
		}
		nav {
			width: 100%;
			#currencies-block-top {
				float: right;
			}
		}
	}
	.row {
		position: relative;
		> .container {
			position: relative;
		}
		#header_logo {
			padding-top: 15px;
			@extend .col-sm-4;
			@media (max-width: $screen-md) {
				padding-top: 40px;
			}
			@media (max-width: $screen-xs-max) {
				padding-top: 15px;
				img {
					margin: 0 auto;
				}
			}
		}
	}
	@media (min-width: $screen-xs-max){
		.col-sm-4 + .col-sm-4 + .col-sm-4 {
			float: right;
		}
	}
}

.ie8 #header #header_logo {
	width: 350px;
}

//title
#center_column {
	.page_product_box {
		h3 {
			@include sub-heading;
		}
	}
}

//text
p.info-title {
	font-weight: bold;
	color: $base-text-color;
	margin-bottom: 25px;
}

p.info-account {
	margin: -4px 0 24px 0;
}

.dark {
	color: $base-text-color;
}

.main-page-indent {
	margin-bottom: $base-page-indent;
}

.alert {
	font-weight: bold;
	ul, ol {
		padding-left: 15px;
		margin-left: 27px;
		li {
			list-style-type: decimal;
			font-weight: normal;
		}
	}
	&.alert-success {
		text-shadow: 1px 1px rgba(0, 0, 0, 0.1);
		&:before {
			font-family: $font-icon;
			content: "\f058";
			font-size: 20px;
			vertical-align: -2px;
			padding-right: 7px;
		}
	}
	&.alert-danger {
		text-shadow: 1px 1px rgba(0, 0, 0, 0.1);
		&:before {
			font-family: $font-icon;
			content: "\f057";
			font-size: 20px;
			vertical-align: -2px;
			padding-right: 7px;
			float: left;
		}
	}
}

.label {
	white-space: normal;
	display: inline-block;
	padding: 6px 10px;
}

label {
	color: $base-title-color;
	&.required {
		&:before {
			content: "*";
			color: red;
			font-size: 14px;
			position: relative;
			line-height: 12px;
		}
	}
}

.unvisible {
	display: none;
}

.checkbox {
	line-height: 16px;
	label {
		color: #777777;
	}
}

.close {
	opacity: 1;
	&:hover {
		opacity: 1;
	}
}

//buttons
input.button_mini,
input.button_small,
input.button,
input.button_large,
input.button_mini_disabled,
input.button_small_disabled,
input.button_disabled,
input.button_large_disabled,
input.exclusive_mini,
input.exclusive_small,
input.exclusive,
input.exclusive_large,
input.exclusive_mini_disabled,
input.exclusive_small_disabled,
input.exclusive_disabled,
input.exclusive_large_disabled,
a.button_mini,
a.button_small,
a.button,
a.button_large,
a.exclusive_mini,
a.exclusive_small,
a.exclusive,
a.exclusive_large,
span.button_mini,
span.button_small,
span.button,
span.button_large,
span.exclusive_mini,
span.exclusive_small,
span.exclusive,
span.exclusive_large,
span.exclusive_large_disabled {
	position: relative;
	display: inline-block;
	padding: 5px 7px;
	border: 1px solid #cc9900;
	font-weight: bold;
	color: black;
	background: url(../img/bg_bt.gif) repeat-x 0 0 #f4b61b;
	cursor: pointer;
	white-space: normal;
	text-align: left;
}

*:first-child+html input.button_mini,
*:first-child+html input.button_small,
*:first-child+html input.button,
*:first-child+html input.button_large,
*:first-child+html input.button_mini_disabled,
*:first-child+html input.button_small_disabled,
*:first-child+html input.button_disabled,
*:first-child+html input.button_large_disabled,
*:first-child+html input.exclusive_mini,
*:first-child+html input.exclusive_small,
*:first-child+html input.exclusive,
*:first-child+html input.exclusive_large,
*:first-child+html input.exclusive_mini_disabled,
*:first-child+html input.exclusive_small_disabled,
*:first-child+html input.exclusive_disabled,
*:first-child+html input.exclusive_large_disabled {
	border: none;
}

//hover button
input.button_mini:hover,
input.button_small:hover,
input.button:hover,
input.button_large:hover,
input.exclusive_mini:hover,
input.exclusive_small:hover,
input.exclusive:hover,
input.exclusive_large:hover,
a.button_mini:hover,
a.button_small:hover,
a.button:hover,
a.button_large:hover,
a.exclusive_mini:hover,
a.exclusive_small:hover,
a.exclusive:hover,
a.exclusive_large:hover {
	text-decoration: none;
	background-position: left -50px;
}

//active button
input.button_mini:active,
input.button_small:active,
input.button:active,
input.button_large:active,
input.exclusive_mini:active,
input.exclusive_small:active,
input.exclusive:active,
input.exclusive_large:active,
a.button_mini:active,
a.button_small:active,
a.button:active,
a.button_large:active,
a.exclusive_mini:active,
a.exclusive_small:active,
a.exclusive:active,
a.exclusive_large:active {
	background-position: left -100px;
}

input.button_disabled,
input.exclusive_disabled,
span.exclusive {
	border: 1px solid #cccccc;
	color: #999999;
	background: url(../img/bg_bt_2.gif) repeat-x 0 0 #cccccc;
	cursor: default;
}

.btn.disabled,
.btn[disabled]:hover {
	opacity: 0.3;
}

.button.button-small {
	font: bold 13px / 17px $font-family;
	color: $button-text-color;
	background: $button-small-bg;
	border: 1px solid;
	border-color: #666666 #5f5f5f #292929 #5f5f5f;
	padding: 0;
	text-shadow: 1px 1px rgba(0, 0, 0, 0.24);
	@include border-radius(0);
	span {
		display: block;
		padding: 3px 8px 3px 8px;
		border: 1px solid;
		border-color: #8b8a8a;
		i {
			vertical-align: 0px;
			margin-right: 5px;
			&.right {
				margin-right: 0;
				margin-left: 5px;
			}
		}
		&:hover {
			background: $button-small-hover-bg;
			border-color: #303030 #303030 #666666 #444444;
		}
	}
}

.button.button-medium {
	font-size: 17px;
	line-height: 21px;
	color: $button-text-color;
	padding: 0;
	font-weight: bold;
	background: rgb(67, 183, 84);
	background: -moz-linear-gradient(top, rgba(67, 183, 84, 1) 0%, rgba(65, 183, 87, 1) 2%, rgba(65, 184, 84, 1) 4%, rgba(67, 183, 86, 1) 6%, rgba(65, 179, 84, 1) 38%, rgba(68, 179, 85, 1) 40%, rgba(69, 175, 85, 1) 66%, rgba(65, 174, 83, 1) 74%, rgba(66, 172, 82, 1) 91%, rgba(65, 174, 85, 1) 94%, rgba(67, 171, 84, 1) 96%, rgba(66, 172, 82, 1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(67, 183, 84, 1)), color-stop(2%, rgba(65, 183, 87, 1)), color-stop(4%, rgba(65, 184, 84, 1)), color-stop(6%, rgba(67, 183, 86, 1)), color-stop(38%, rgba(65, 179, 84, 1)), color-stop(40%, rgba(68, 179, 85, 1)), color-stop(66%, rgba(69, 175, 85, 1)), color-stop(74%, rgba(65, 174, 83, 1)), color-stop(91%, rgba(66, 172, 82, 1)), color-stop(94%, rgba(65, 174, 85, 1)), color-stop(96%, rgba(67, 171, 84, 1)), color-stop(100%, rgba(66, 172, 82, 1)));
	background: -webkit-linear-gradient(top, rgba(67, 183, 84, 1) 0%, rgba(65, 183, 87, 1) 2%, rgba(65, 184, 84, 1) 4%, rgba(67, 183, 86, 1) 6%, rgba(65, 179, 84, 1) 38%, rgba(68, 179, 85, 1) 40%, rgba(69, 175, 85, 1) 66%, rgba(65, 174, 83, 1) 74%, rgba(66, 172, 82, 1) 91%, rgba(65, 174, 85, 1) 94%, rgba(67, 171, 84, 1) 96%, rgba(66, 172, 82, 1) 100%);
	background: -o-linear-gradient(top, rgba(67, 183, 84, 1) 0%, rgba(65, 183, 87, 1) 2%, rgba(65, 184, 84, 1) 4%, rgba(67, 183, 86, 1) 6%, rgba(65, 179, 84, 1) 38%, rgba(68, 179, 85, 1) 40%, rgba(69, 175, 85, 1) 66%, rgba(65, 174, 83, 1) 74%, rgba(66, 172, 82, 1) 91%, rgba(65, 174, 85, 1) 94%, rgba(67, 171, 84, 1) 96%, rgba(66, 172, 82, 1) 100%);
	background: -ms-linear-gradient(top, rgba(67, 183, 84, 1) 0%, rgba(65, 183, 87, 1) 2%, rgba(65, 184, 84, 1) 4%, rgba(67, 183, 86, 1) 6%, rgba(65, 179, 84, 1) 38%, rgba(68, 179, 85, 1) 40%, rgba(69, 175, 85, 1) 66%, rgba(65, 174, 83, 1) 74%, rgba(66, 172, 82, 1) 91%, rgba(65, 174, 85, 1) 94%, rgba(67, 171, 84, 1) 96%, rgba(66, 172, 82, 1) 100%);
	background: linear-gradient(to bottom, rgba(67, 183, 84, 1) 0%, rgba(65, 183, 87, 1) 2%, rgba(65, 184, 84, 1) 4%, rgba(67, 183, 86, 1) 6%, rgba(65, 179, 84, 1) 38%, rgba(68, 179, 85, 1) 40%, rgba(69, 175, 85, 1) 66%, rgba(65, 174, 83, 1) 74%, rgba(66, 172, 82, 1) 91%, rgba(65, 174, 85, 1) 94%, rgba(67, 171, 84, 1) 96%, rgba(66, 172, 82, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#43b754', endColorstr='#42ac52',GradientType=0 );
	border: 1px solid;
	border-color: #399a49 #247f32 #1a6d27 #399a49;
	@include border-radius(0);
	span {
		display: block;
		padding: 10px 10px 10px 14px;
		border: 1px solid;
		border-color: #74d578;
		// max 480px
		@media (max-width: $screen-xs) {
			font-size: 15px;
			padding-right: 7px;
			padding-left: 7px;
		}
		i {
			&.left {
				font-size: 24px;
				vertical-align: -2px;
				margin: -4px 10px 0 0;
				display: inline-block;
				// max 480px
				@media (max-width: $screen-xs) {
					margin-right: 5px;
				}
			}
			&.right {
				margin-right: 0;
				margin-left: 9px;
				// max 480px
				@media (max-width: $screen-xs) {
					margin-left: 5px;
				}
			}
		}
	}
	&:hover {
		background: rgb(58, 160, 76);
		background: -moz-linear-gradient(top, rgba(58, 160, 76, 1) 0%, rgba(58, 160, 74, 1) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(58, 160, 76, 1)), color-stop(100%, rgba(58, 160, 74, 1)));
		background: -webkit-linear-gradient(top, rgba(58, 160, 76, 1) 0%, rgba(58, 160, 74, 1) 100%);
		background: -o-linear-gradient(top, rgba(58, 160, 76, 1) 0%, rgba(58, 160, 74, 1) 100%);
		background: -ms-linear-gradient(top, rgba(58, 160, 76, 1) 0%, rgba(58, 160, 74, 1) 100%);
		background: linear-gradient(to bottom, rgba(58, 160, 76, 1) 0%, rgba(58, 160, 74, 1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3aa04c', endColorstr='#3aa04a',GradientType=0 );
		border-color: #196f28 #399a49 #399a49 #258033;
	}
}

.button.button-medium.exclusive {
	border-color: #db8600 #d98305 #c86d26 #d98305;
	background: rgb(253, 170, 2);
	background: -moz-linear-gradient(top, rgba(253, 170, 2, 1) 0%, rgba(254, 151, 2, 1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(253, 170, 2, 1)), color-stop(100%, rgba(254, 151, 2, 1)));
	background: -webkit-linear-gradient(top, rgba(253, 170, 2, 1) 0%, rgba(254, 151, 2, 1) 100%);
	background: -o-linear-gradient(top, rgba(253, 170, 2, 1) 0%, rgba(254, 151, 2, 1) 100%);
	background: -ms-linear-gradient(top, rgba(253, 170, 2, 1) 0%, rgba(254, 151, 2, 1) 100%);
	background: linear-gradient(to bottom, rgba(253, 170, 2, 1) 0%, rgba(254, 151, 2, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdaa02', endColorstr='#fe9702',GradientType=0 );
	span {
		border-color: #fec133 #febc33 #feb233 #febc33;
		&:hover {
			filter: none;
			background: #f89609;
			border-color: #a6550c #ba6708 #db8600 #ba6708;
			span {
				border-color: #fec133;
			}
		}
	}
}

.link-button {
	font-weight: bold;
	i {
		margin-right: 5px;
		&.large {
			font-size: 26px;
			line-height: 26px;
			vertical-align: -3px;
			color: silver;
		}
	}
}

.btn.button-plus,
.btn.button-minus {
	font-size: 14px;
	line-height: 14px;
	color: $button-pm-color;
	text-shadow: 1px -1px rgba(0, 0, 0, 0.05);
	padding: 0;
	border: 1px solid;
	border-color: #dedcdc #c1bfbf #b5b4b4 #dad8d8;
	@include border-radius(0);
	span {
		display: block;
		border: 1px solid $light-border-color;
		vertical-align: middle;
		width: 25px;
		height: 25px;
		text-align: center;
		vertical-align: middle;
		padding: 4px 0 0 0;
		background: rgb(30, 87, 153);
		background: rgb(255, 255, 255);
		background: -moz-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(251, 251, 251, 1) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 1)), color-stop(100%, rgba(251, 251, 251, 1)));
		background: -webkit-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(251, 251, 251, 1) 100%);
		background: -o-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(251, 251, 251, 1) 100%);
		background: -ms-linear-gradient(top, rgba(255, 255, 255, 1) 0%, rgba(251, 251, 251, 1) 100%);
		background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(251, 251, 251, 1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#fbfbfb',GradientType=0);
	}
	&:hover {
		color: $base-text-color;
		span {
			filter: none;
			background: #f6f6f6;
		}
	}
}

.button.exclusive-medium {
	font-size: 17px;
	padding: 0;
	line-height: 21px;
	color: $button-em-color;
	font-weight: bold;
	border: 1px solid;
	border-color: #cacaca #b7b7b7 #9a9a9a #b7b7b7;
	text-shadow: 1px 1px rgba(255, 255, 255, 1);
	span {
		border: 1px solid;
		border-color: $light-border-color;
		display: block;
		padding: 9px 10px 11px 10px;
		background: rgb(247, 247, 247);
		background: -moz-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(247, 247, 247, 1)), color-stop(100%, rgba(237, 237, 237, 1)));
		background: -webkit-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
		background: -o-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
		background: -ms-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
		background: linear-gradient(to bottom, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#ededed',GradientType=0);
		// max 480px
		@media (max-width: $screen-xs) {
			font-size: 15px;
			padding-right: 7px;
			padding-left: 7px;
		}
		&:hover {
			border-color: #9e9e9e #c2c2c2 #c8c8c8 #c2c2c2;
			span {
				background: rgb(231, 231, 231);
				background: -moz-linear-gradient(top, rgba(231, 231, 231, 1) 0%, rgba(231, 231, 231, 1) 0%);
				background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(231, 231, 231, 1)), color-stop(0%, rgba(231, 231, 231, 1)));
				background: -webkit-linear-gradient(top, rgba(231, 231, 231, 1) 0%, rgba(231, 231, 231, 1) 0%);
				background: -o-linear-gradient(top, rgba(231, 231, 231, 1) 0%, rgba(231, 231, 231, 1) 0%);
				background: -ms-linear-gradient(top, rgba(231, 231, 231, 1) 0%, rgba(231, 231, 231, 1) 0%);
				background: linear-gradient(to bottom, rgba(231, 231, 231, 1) 0%, rgba(231, 231, 231, 1) 0%);
				filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e7e7e7', endColorstr='#e7e7e7',GradientType=0);
			}
		}
	}
}

.button.ajax_add_to_cart_button {
	font: 700 17px / 21px $font-family;
	color: $button-text-color;
	text-shadow: 1px 1px rgba(0, 0, 0, 0.2);
	padding: 0;
	border: 1px solid;
	border-color: #0079b6 #006fa8 #012740 #006fa8;
	span {
		border: 1px solid;
		border-color: #06b2e6;
		padding: 10px 14px;
		display: block;
		background: rgb(0, 154, 208);
		background: -moz-linear-gradient(top, rgba(0, 154, 208, 1) 0%, rgba(0, 122, 183, 1) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 154, 208, 1)), color-stop(100%, rgba(0, 122, 183, 1)));
		background: -webkit-linear-gradient(top, rgba(0, 154, 208, 1) 0%, rgba(0, 122, 183, 1) 100%);
		background: -o-linear-gradient(top, rgba(0, 154, 208, 1) 0%, rgba(0, 122, 183, 1) 100%);
		background: -ms-linear-gradient(top, rgba(0, 154, 208, 1) 0%, rgba(0, 122, 183, 1) 100%);
		background: linear-gradient(to bottom, rgba(0, 154, 208, 1) 0%, rgba(0, 122, 183, 1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#009ad0', endColorstr='#007ab7',GradientType=0);
	}
	&:hover {
		border-color: #01314e #004b74 #0079b6 #004b74;
		span {
			filter: none;
			background: #0084bf;
		}
	}
}

.button.lnk_view {
	font: 700 17px / 21px $font-family;
	color: $base-text-color;
	text-shadow: 1px 1px rgba(255, 255, 255, 1);
	padding: 0;
	border: 1px solid;
	border-color: #cacaca #b7b7b7 #9a9a9a #b7b7b7;
	span {
		border: 1px solid;
		border-color: $light-border-color;
		padding: 10px 14px;
		display: block;
		background: rgb(247, 247, 247);
		background: -moz-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(247, 247, 247, 1)), color-stop(100%, rgba(237, 237, 237, 1)));
		background: -webkit-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
		background: -o-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
		background: -ms-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
		background: linear-gradient(to bottom, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
		filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#ededed',GradientType=0);
	}
	&:hover {
		border-color: #9e9e9e #9e9e9e #c8c8c8 #9e9e9e;
		span {
			filter: none;
			background: #e7e7e7;
		}
	}
	i.left {
		padding-right: 8px;
		color: #777777;
	}
}

//form
.form-control {
	padding: 3px 5px;
	height: 27px;
	@include box-shadow(none);
	&.grey {
		background: $base-box-bg;
	}
}

//table
table.std,
table.table_block {
	margin-bottom: 20px;
	width: 100%;
	border: 1px solid #999999;
	border-bottom: none;
	background: white;
	border-collapse: inherit;
}

table.std th,
table.table_block th {
	padding: 14px 12px;
	font-size: 12px;
	color: $light-text-color;
	font-weight: bold;
	text-transform: uppercase;
	text-shadow: 0 1px 0 black;
	background: #999999;
}

table.std tr.alternate_item,
table.table_block tr.alternate_item {
	background-color: #f3f3f3;
}

table.std td,
table.table_block td {
	padding: 12px;
	border-right: 1px solid #e9e9e9;
	border-bottom: 1px solid #e9e9e9;
	font-size: 12px;
	vertical-align: top;
}

.table {
	margin-bottom: 30px;
	> thead {
		> tr {
			> th {
				background: $table-background;
				border-bottom-width: 1px;
				color: $base-text-color;
				vertical-align: middle;
			}
		}
	}
	td {
		a.color-myaccount {
			color: $link-color;
			text-decoration: underline;
			&:hover {
				text-decoration: none;
			}
		}
	}
	tfoot {
		tr {
			background: $table-background;
		}
	}
}

//product elements
.product-name {
	font-size: 17px;
	line-height: 23px;
	color: $product-name-color;
	margin-bottom: 0;
	a {
		font-size: 17px;
		line-height: 23px;
		color: $product-name-color;
		&:hover {
			color: $product-name-hover-color;
		}
		@media (max-width: $screen-sm) {
			font-size: 14px;
		}
	}
}

.price {
	font-size: 13px;
	color: $price-color;
	white-space: nowrap;
}

.price.product-price {
	font: 600 21px / 26px $font-custom;
	color: $product-price-color;
}

.old-price {
	color: $product-old-price-color;
	text-decoration: line-through;
}

.old-price.product-price {
	font-size: 17px;
}

.special-price {
	color: $product-special-price-color;
}

.price-percent-reduction {
	background: #f13340;
	border: 1px solid #d02a2c;
	font: 600 21px / 24px $font-custom;
	color: $light-text-color;
	padding: 0 5px 0 3px;
	display: inline-block;
	&.small {
		font: 700 14px / 17px $font-family;
		padding: 1px 6px;
	}
}

//Labels New/Sale
.new-box,
.sale-box {
	position: absolute;
	top: -4px;
	overflow: hidden;
	height: 85px;
	width: 85px;
	text-align: center;
	z-index: 0;
}

.new-box {
	left: -4px;
}

.sale-box {
	right: -5px;
}

.new-label {
	font: 700 14px / 12px $font-family;
	color: $light-text-color;
	background: #6ad4ff;
	text-transform: uppercase;
	padding: 9px 0 7px;
	text-shadow: 1px 1px rgba(0, 0, 0, 0.24);
	width: 130px;
	text-align: center;
	display: block;
	position: absolute;
	left: -33px;
	top: 16px;
	z-index: 1;
	@include rotate(-45deg);
	&:before {
		position: absolute;
		bottom: -3px;
		right: 5px;
		width: 0px;
		height: 0px;
		border-style: solid;
		border-width: 4px 4px 0px 4px;
		border-color: #21a3d8 transparent transparent transparent;
		content: ".";
		text-indent: -5000px;
		@include rotate(225deg);
	}
	&:after {
		position: absolute;
		bottom: -3px;
		left: 3px;
		width: 0px;
		height: 0px;
		border-style: solid;
		border-width: 4px 4px 0px 4px;
		border-color: #21a3d8 transparent transparent transparent;
		content: ".";
		text-indent: -5000px;
		@include rotate(135deg);
	}
}

.sale-label {
	font: 700 14px / 12px $font-family;
	color: $light-text-color;
	background: #f13340;
	text-transform: uppercase;
	padding: 9px 0 7px;
	text-shadow: 1px 1px rgba(0, 0, 0, 0.24);
	width: 130px;
	text-align: center;
	display: block;
	position: absolute;
	right: -33px;
	top: 16px;
	z-index: 1;
	@include rotate(45deg);
	&:before {
		position: absolute;
		bottom: -3px;
		right: 4px;
		width: 0px;
		height: 0px;
		border-style: solid;
		border-width: 4px 4px 0px 4px;
		border-color: #ad2b34 transparent transparent transparent;
		content: ".";
		text-indent: -5000px;
		@include rotate(225deg);
	}
	&:after {
		position: absolute;
		bottom: -3px;
		left: 5px;
		width: 0px;
		height: 0px;
		border-style: solid;
		border-width: 4px 4px 0px 4px;
		border-color: #ad2b34 transparent transparent transparent;
		content: ".";
		text-indent: -5000px;
		@include rotate(135deg);
	}
}

.ie8 {
	.new-label {
		left: 0px;
		top: 0px;
		width: auto;
		padding: 5px 15px;
		&:after {
			display: none;
		}
		&:before {
			display: none;
		}
	}
	.sale-label {
		right: 0px;
		top: 0px;
		width: auto;
		padding: 5px 15px;
		&:after {
			display: none;
		}
		&:before {
			display: none;
		}
	}
	.new-box {
		top: -1px;
		left: -1px;
	}
	.sale-box {
		right: -1px;
		top: -1px;
	}
}

//BOXES
.box {
	background: $base-box-bg;
	border: 1px solid $base-border-color;
	padding: $base-box-padding;
	margin: $base-box-indent;
	line-height: 23px;
	p {
		margin-bottom: 0;
	}
	&.box-small {
		padding: 9px 10px 9px 20px;
		.dark {
			padding-top: 10px;
			padding-right: 20px;
			margin-bottom: 0;
			width: auto;
		}
	}
}

.page-product-box {
	padding-bottom: 10px;
}

.product-box {
	width: 178px;
	float: left;
	@include box-sizing(border-box);
	.product-image {
		border: $main_border;
		background: white;
		padding: 5px;
		display: block;
		margin-bottom: 11px;
		img {
			max-width: 100%;
			width: 100%;
			height: auto;
		}
	}
}

//Homepage Tabs
#home-page-tabs {
	border: none;
	background: $light-background;
	// min 768px
	@media (min-width: $screen-sm) {
		padding: 10px 0;
		margin: 0 0 0 -18px;
	}
	> li {
		margin-bottom: 0;
		// min 768px
		@media (min-width: $screen-sm) {
			border-left: 1px solid $base-border-color;
			margin: 0 0px 0 9px;
			padding: 0 0px 0 9px;
		}
		// max 479px
		@media (max-width: $screen-xs - 1) {
			width: 100%;
		}
		a {
			font: 600 21px / 24px $font-custom;
			color: $base-heading-color;
			text-transform: uppercase;
			border: none;
			outline: none;
			margin: 0;
			padding: 10px;
			// min 768px
			@media (min-width: $screen-sm) {
				padding: 1px 10px;
			}
		}
		&:first-child {
			border: none;
		}
	}
	> li.active a,
	>li a:hover {
		background: $dark-background;
		color: $light-text-color;
		padding: 10px;
		// min 768px
		@media (min-width: $screen-sm) {
			margin: -9px 0;
		}
	}
}

.block {
	margin-bottom: 30px;
	// max 767px
	@media (max-width: $screen-xs-max) {
		margin-bottom: 0px;
	}
	.block_content {
		// max 767px
		@media (max-width: $screen-xs-max) {
			margin-bottom: 20px;
		}
	}
}

.block {
	.title_block,
	h4 {
		font: 600 18px / 22px $font-custom;
		color: $base-heading-color;
		background: #f6f6f6;
		border-top: 5px solid $dark-border-color;
		text-transform: uppercase;
		padding: 14px 5px 17px 20px;
		margin-bottom: 20px;
		@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
			font-size: 14px;
		}
		// max 767px
		@media (max-width: $screen-xs-max) {
			position: relative;
			&:after {
				display: block;
				font-family: $font-icon;
				content: "";
				position: absolute;
				right: 0;
				top: 15px;
				height: 36px;
				width: 36px;
				font-size: 26px;
				font-weight: normal;
			}
			&.active:after {
				content: "";
			}
		}
		a {
			color: $base-heading-color;
			&:hover {
				color: $base-text-color;
			}
		}
	}
	.list-block {
		margin-top: -8px;
		// max 767px
		@media (max-width: $screen-xs-max) {
			margin-top: 0;
		}
		li {
			padding: 5px 0 6px 20px;
			border-top: 1px solid $base-border-color;
			a {
				i {
					display: none;
				}
				&:before {
					content: "\f105";
					display: inline;
					font-family: $font-icon;
					color: $base-text-color;
					padding-right: 8px;
				}
				&:hover {
					color: $base-text-color;
					font-weight: bold;
				}
			}
			&:first-child {
				border-top: none;
			}
		}
		.form-group {
			padding-top: 20px;
			border-top: 1px solid $base-border-color;
			margin-bottom: 0;
			select {
				max-width: 270px;
				// max 767px
				@media (max-width: $screen-xs-max) {
					width: 270px;
				}
			}
		}
		.btn {
			margin-top: 12px;
		}
	}
	.products-block {
		li {
			padding: 0 0 20px 0;
			margin-bottom: 20px;
			border-bottom: 1px solid $base-border-color;
			.products-block-image {
				float: left;
				border: 1px solid $base-border-color;
				margin-right: 19px;
				// min 768px max 991px
				@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
					float: none;
					display: inline-block;
					margin: 0 auto 10px;
					text-align: center;
				}
			}
			.product-content {
				overflow: hidden;
				h5 {
					margin: -3px 0 0 0;
				}
			}
		}
		.product-name {
			font-size: 15px;
			line-height: 18px;
		}
		.product-description {
			margin-bottom: 14px;
		}
		.price-percent-reduction {
			font: 700 14px / 17px $font-family;
			padding: 1px 6px;
		}
	}
}

.page-heading {
	font: 600 18px / 22px $font-custom;
	color: $base-heading-color;
	text-transform: uppercase;
	padding: 0px 0px 17px 0px;
	margin-bottom: 30px;
	border-bottom: 1px solid $base-border-color;
	overflow: hidden;
	span.heading-counter {
		font: bold 13px / 22px $font-family;
		float: right;
		color: $base-text-color;
		text-transform: none;
		margin-bottom: 10px;
		@media (max-width: $screen-xs) {
			float: none;
			display: block;
			padding-top: 5px;
		}
	}
	span.lighter {
		color: #9c9c9c;
	}
	&.bottom-indent {
		margin-bottom: 16px;
	}
	&.product-listing {
		border-bottom: none;
		margin-bottom: 0;
	}
}

.page-subheading {
	font-family: $font-custom;
	font-weight: 600;
	text-transform: uppercase;
	color: $base-heading-color;
	font-size: 18px;
	padding: 0 0 15px;
	line-height: normal;
	margin-bottom: 12px;
	border-bottom: 1px solid $base-border-color;
}

h3.page-product-heading {
	@include sub-heading;
}

// BLOCK .footer_links (cms pages)
ul.footer_links {
	padding: 20px 0 0px 0;
	border-top: 1px solid $base-border-color;
	height: 65px;
	li {
		float: left;
		&+li {
			margin-left: 10px;
		}
	}
}

// barre comparaison / tri
.content_sortPagiBar {
	.sortPagiBar {
		border-bottom: 1px solid $base-border-color;
		clear: both;
		#productsSortForm {
			float: left;
			margin-right: 20px;
			margin-bottom: 10px;
			select {
				max-width: 192px;
				float: left;
				@media (max-width: $screen-sm-max) {
					max-width: 160px;
				}
			}
			.selector {
				float: left;
			}
		}
		.nbrItemPage {
			float: left;
			select {
				max-width: 59px;
				float: left;
			}
			.clearfix > span {
				padding: 3px 0 0 12px;
				display: inline-block;
				float: left;
			}
			#uniform-nb_item {
				float: left;
			}
		}
		label,
		select {
			float: left;
		}
		label {
			padding: 3px 6px 0 0;
		}
		&.instant_search {
			#productsSortForm {
				display: none;
			}
		}
	}
	.display,
	.display_m {
		float: right;
		margin-top: -4px;
		li {
			float: left;
			padding-left: 12px;
			text-align: center;
			a {
				color: $GL-text-color;
				font-size: 11px;
				line-height: 14px;
				cursor: pointer;
				i {
					display: block;
					font-size: 24px;
					height: 24px;
					line-height: 24px;
					margin-bottom: -3px;
					color: $GL-icon-color;
				}
				&:hover {
					i {
						color: lighten($GL-icon-color-hover, 30%);
					}
				}
			}
			&.selected {
				a {
					cursor: default;
				}
				i {
					color: $GL-icon-color-hover;
				}
			}
			&.display-title {
				font-weight: bold;
				color: $base-text-color;
				padding: 7px 6px 0 0;
			}
		}
	}
}

//pagination
.top-pagination-content,
.bottom-pagination-content {
	text-align: center;
	padding: 12px 0 12px 0;
	position: relative;
	div.pagination {
		margin: 0;
		float: right;
		width: 530px;
		text-align: center;
		// min 992px max 1199px
		@media (min-width: $screen-md) and (max-width: $screen-md-max) {
			width: 380px;
		}
		// max 991px
		@media (max-width: $screen-sm-max) {
			float: left;
			width: auto;
		}
		.showall {
			float: right;
			margin: 8px 53px 8px 14px;
			// min 992px max 1199px
			@media (min-width: $screen-md) and (max-width: $screen-md-max) {
				margin-right: 11px;
			}
			// max 991px
			@media (max-width: $screen-sm-max) {
				margin-right: 0;
			}
			.btn {
				span {
					font-size: 13px;
					padding: 3px 5px 4px 5px;
					line-height: normal;
				}
			}
		}
	}
	ul.pagination {
		margin: 8px 0px 8px 0;
		// max 991px
		@media (max-width: $screen-sm-max) {
			float: left;
		}
		li {
			display: inline-block;
			float: left;
			> a,
			> span {
				margin: 0 1px 0 0px;
				padding: 0;
				font-weight: bold;
				border: 1px solid;
				border-color: #dfdede #d2d0d0 #b0afaf #d2d0d0;
				display: block;
				span {
					border: 1px solid $light-border-color;
					padding: 2px 8px;
					display: block;
					background: url(../img/pagination-li.gif) 0 0 repeat-x $pagination-bgcolor;
				}
			}
			> a:hover {
				span {
					background: $pagination-hover-bg;
				}
			}
			&.pagination_previous,
			&.pagination_next {
				color: $pagination-prevnext-color;
				font-weight: bold;
				> a,
				> span {
					border: none;
					background: none;
					display: block;
					padding: 4px 0;
					// max 767px
					@media (max-width: $screen-xs-max) {
						b {
							display: none;
						}
					}
					span {
						border: none;
						padding: 0;
						background: none;
						b {
							font-weight: bold;
						}
					}
				}
			}
			&.pagination_previous {
				margin-right: 10px;
			}
			&.pagination_next {
				margin-left: 10px;
			}
			&.active {
				> span {
					color: $base-text-color;
					border-color: #dfdede #d2d0d0 #b0afaf #d2d0d0;
					span {
						background: $pagination-hover-bg;
					}
				}
			}
		}
	}
	.compare-form {
		float: right;
		// max 479px
		@media (max-width: $screen-xs - 1) {
			float: left;
			width: 100%;
			text-align: left;
			padding-bottom: 10px;
			clear: both;
		}
	}
	.product-count {
		padding: 11px 0 0 0;
		float: left;
		// max 991px
		@media (max-width: $screen-sm-max) {
			clear: left;
		}
	}
}

.bottom-pagination-content {
	border-top: 1px solid $base-border-color;
}

//CART steps
ul.step {
	margin-bottom: 30px;
	overflow: hidden;
	//min 480px
	@media (min-width: $screen-xs) {
		@include border-radius(4px);
	}
	li {
		float: left;
		width: 20%;
		text-align: left;
		border: 1px solid;
		border-top-color: #cacaca;
		border-bottom-color: #9a9a9a;
		border-right-color: #b7b7b7;
		border-left-width: 0px;
		// max 480px
		@media (max-width: $screen-xs - 1) {
			width: 100%;
			border-left-width: 1px;
		}
		a,
		span,
		&.step_current span,
		&.step_current_end span {
			display: block;
			padding: 13px 10px 14px 13px;
			color: $base-text-color;
			font-size: 17px;
			line-height: 21px;
			font-weight: bold;
			text-shadow: 1px 1px rgba(255, 255, 255, 1);
			position: relative;
			// max 991px
			@media (max-width: $screen-md) {
				font-size: 15px;
			}
			// min 991px
			@media (min-width: $screen-md) {
				&:after {
					content: ".";
					position: absolute;
					top: 0;
					right: -31px;
					z-index: 0;
					text-indent: -5000px;
					display: block;
					width: 31px;
					height: 52px;
					margin-top: -2px;
				}
			}
			&:focus {
				text-decoration: none;
				outline: none;
			}
		}
		&.first {
			border-left-width: 1px;
			border-left-color: #b7b7b7;
			//min 480px
			@media (min-width: $screen-xs) {
				@include border-top-left-radius(4px);
				@include border-bottom-left-radius(4px);
			}
			span,
			a {
				z-index: 5;
				padding-left: 13px !important;
				//min 480px
				@media (min-width: $screen-xs) {
					@include border-top-left-radius(4px);
					@include border-bottom-left-radius(4px);
				}
			}
		}
		&.second {
			span, a {
				z-index: 4;
			}
		}
		&.third {
			span, a {
				z-index: 3;
			}
		}
		&.four {
			span, a {
				z-index: 2;
			}
		}
		&.last {
			span {
				z-index: 1;
			}
			//min 480px
			@media (min-width: $screen-xs) {
				@include border-top-right-radius(4px);
				@include border-bottom-right-radius(4px);
				span {
					@include border-top-right-radius(4px);
					@include border-bottom-right-radius(4px);
				}
			}
		}
		&.step_current {
			font-weight: bold;
			background: rgb(66, 184, 86);
			background: -moz-linear-gradient(top, rgba(66, 184, 86, 1) 0%, rgba(67, 171, 84, 1) 100%);
			background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(66, 184, 86, 1)), color-stop(100%, rgba(67, 171, 84, 1)));
			background: -webkit-linear-gradient(top, rgba(66, 184, 86, 1) 0%, rgba(67, 171, 84, 1) 100%);
			background: -o-linear-gradient(top, rgba(66, 184, 86, 1) 0%, rgba(67, 171, 84, 1) 100%);
			background: -ms-linear-gradient(top, rgba(66, 184, 86, 1) 0%, rgba(67, 171, 84, 1) 100%);
			background: linear-gradient(to bottom, rgba(66, 184, 86, 1) 0%, rgba(67, 171, 84, 1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#42b856', endColorstr='#43ab54',GradientType=0);
			border-color: #399b49 #51ae5c #208931 #369946;
			span {
				color: $light-text-color;
				text-shadow: 1px 1px rgba(32, 137, 49, 1);
				border: 1px solid;
				border-color: #73ca77 #74c776 #74c175 #74c776;
				position: relative;
				//min 991px
				@media (min-width: $screen-md) {
					padding-left: 38px;
					&:after {
						background: url(../img/order-step-a.png) right 0 no-repeat;
					}
				}
			}
		}
		&.step_current_end {
			font-weight: bold;
		}
		&.step_todo {
			background: rgb(247, 247, 247);
			background: -moz-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
			background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(247, 247, 247, 1)), color-stop(100%, rgba(237, 237, 237, 1)));
			background: -webkit-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
			background: -o-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
			background: -ms-linear-gradient(top, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
			background: linear-gradient(to bottom, rgba(247, 247, 247, 1) 0%, rgba(237, 237, 237, 1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#ededed',GradientType=0);
			span {
				display: block;
				border: 1px solid;
				border-color: $light-border-color;
				color: $base-text-color;
				position: relative;
				// min 991px
				@media (min-width: $screen-md) {
					padding-left: 38px;
					&:after {
						background: url(../img/order-step-current.png) right 0 no-repeat;
					}
				}
			}
		}
		&.step_done {
			border-color: #666666 #5f5f5f #292929 #5f5f5f;
			background: rgb(114, 113, 113);
			background: -moz-linear-gradient(top, rgba(114, 113, 113, 1) 0%, rgba(102, 102, 102, 1) 100%);
			background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(114, 113, 113, 1)), color-stop(100%, rgba(102, 102, 102, 1)));
			background: -webkit-linear-gradient(top, rgba(114, 113, 113, 1) 0%, rgba(102, 102, 102, 1) 100%);
			background: -o-linear-gradient(top, rgba(114, 113, 113, 1) 0%, rgba(102, 102, 102, 1) 100%);
			background: -ms-linear-gradient(top, rgba(114, 113, 113, 1) 0%, rgba(102, 102, 102, 1) 100%);
			background: linear-gradient(to bottom, rgba(114, 113, 113, 1) 0%, rgba(102, 102, 102, 1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#727171', endColorstr='#666666',GradientType=0);
			a {
				color: $light-text-color;
				text-shadow: 1px 1px rgba(0, 0, 0, 0.3);
				border: 1px solid;
				border-color: #8b8a8a;
				// min 991px
				@media (min-width: $screen-md) {
					padding-left: 38px;
					&:after {
						background: url(../img/order-step-done.png) right 0 no-repeat;
					}
				}
			}
		}
		&.step_done.step_done_last {
			@media (min-width: $screen-md) {
				a:after {
					background: url(../img/order-step-done-last.png) right 0 no-repeat;
				}
			}
		}
		&#step_end {
			span {
				@media (min-width: $screen-md) {
					&:after {
						display: none;
					}
				}
			}
		}
		em {
			font-style: normal;
			// min 480px max 767px
			@media (min-width: $screen-xs) and (max-width: $screen-xs-max) {
				display: none;
			}
		}
	}
}

// module productcomments
.rating {
	clear: both;
	display: block;
	margin: 2em;
	cursor: pointer;
}

.rating:after {
	content: ".";
	display: block;
	height: 0;
	width: 0;
	clear: both;
	visibility: hidden;
}

.cancel, .star {
	overflow: hidden;
	float: left;
	margin: 0 1px 0 0;
	width: 16px;
	height: 16px;
	cursor: pointer;
}

.cancel, .cancel a {
	background: url(../../../modules/productcomments/img/delete.gif) no-repeat 0 -16px !important;
}

.cancel a, .star a {
	display: block;
	width: 100%;
	height: 100%;
	background-position: 0 0;
}

div.star_on a {
	background-position: 0 -16px;
}

div.star_hover a,
div.star a:hover {
	background-position: 0 -32px;
}

.pack_content {
	margin: 10px 0 10px 0;
}

.confirmation {
	margin: 0 0 10px;
	padding: 10px;
	border: 1px solid #e6db55;
	font-size: 13px;
	background: none repeat scroll 0 0 lightyellow;
}

#page .rte {
	background: transparent none repeat scroll 0 0;
}

.listcomment {
	list-style-type: none;
	margin: 0 0 20px 0 !important;
}

.listcomment li {
	padding: 10px 0;
	border-bottom: 1px dotted $base-border-color;
	color: #666666;
}

.listcomment .titlecomment {
	display: block;
	font-weight: bold;
	font-size: 12px;
	color: $base-text-color;
}

.listcomment .txtcomment {
	display: block;
	padding: 5px 0;
	color: $base-text-color;
}

.header-container {
	background: $light-background;
}

// BREADCRUMB
.breadcrumb {
	display: inline-block;
	padding: 0 11px;
	border: 1px solid $base-border-color;
	font-weight: bold;
	font-size: 12px;
	line-height: 24px;
	min-height: 6px;
	@include border-radius(3px);
	overflow: hidden;
	margin-bottom: 16px;
	position: relative;
	z-index: 1;
	.navigation-pipe {
		width: 18px;
		display: inline-block;
		text-indent: -5000px;
	}
	a {
		display: inline-block;
		background: $light-background;
		padding: 0 15px 0 22px;
		margin-left: -26px;
		position: relative;
		z-index: 2;
		color: $base-text-color;
		&.home {
			font-size: 17px;
			color: $text-color;
			width: 38px;
			text-align: center;
			padding: 0;
			margin: 0 0 0 -10px;
			@include border-top-left-radius(3px);
			@include border-bottom-left-radius(3px);
			z-index: 99;
			line-height: 22px;
			display: inline-block;
			height: 25px;
			i {
				vertical-align: -1px;
			}
			&:before {
				border: none;
			}
		}
		&:after {
			display: inline-block;
			content: ".";
			position: absolute;
			right: -10px;
			top: 3px;
			width: 18px;
			height: 18px;
			background: $light-background;
			border-right: 1px solid $base-border-color;
			border-top: 1px solid $base-border-color;
			border-radius: 2px;
			text-indent: -5000px;
			z-index: -1;
			@include rotate(45deg);
		}
		&:before {
			display: inline-block;
			content: ".";
			position: absolute;
			left: -10px;
			top: 3px;
			width: 18px;
			height: 18px;
			background: transparent;
			border-right: 1px solid $base-border-color;
			border-top: 1px solid $base-border-color;
			border-radius: 2px;
			text-indent: -5000px;
			z-index: -1;
			@include rotate(45deg);
		}
		&:hover {
			color: #777777;
		}
	}
}

.ie8 {
	.breadcrumb {
		min-height: 1px;
		a:after {
			display: none;
		}
		.navigation-pipe {
			width: 20px;
		}
	}
}

// FOOTER
.footer-container {
	background-color: $dark-background;
	// min 768px
	@media (min-width: $screen-sm) {
		background: url(../img/footer-bg.png) repeat-x $dark-background;
	}
	.container {
		padding-bottom: 100px;
	}
	#footer {
		color: #777777;
		.row {
			position: relative;
		}
		.footer-block {
			margin-top: 45px;
			// max 767px
			@media (max-width: $screen-xs-max) {
				margin-top: 20px;
			}
		}
		a {
			color: #777777;
			&:hover {
				color: $light-text-color;
			}
		}
		h4 {
			font: 600 18px / 22px $font-custom;
			color: $light-text-color;
			margin: 0 0 13px 0;
			// max 767px
			@media (max-width: $screen-xs-max) {
				position: relative;
				margin-bottom: 0;
				padding-bottom: 13px;
				&:after {
					display: block;
					content: "\f055";
					font-family: $font-icon;
					position: absolute;
					right: 0;
					top: 1px;
				}
				&.active:after {
					content: "\f056";
				}
			}
			a {
				color: $light-text-color;
			}
		}
		ul {
			li {
				padding-bottom: 8px;
				a {
					font-weight: bold;
					text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.4);
				}
			}
		}
		#block_contact_infos {
			border-left: 1px solid #515151;
			// max 767px
			@media (max-width: $screen-xs-max) {
				border: none;
			}
			> div {
				padding: 0 0 0 5px;
				// max 767px
				@media (max-width: $screen-xs-max) {
					padding-left: 0;
				}
				ul {
					li {
						padding: 0 0 7px 4px;
						overflow: hidden;
						line-height: 30px;
						> span,
						> span a {
							color: $light-text-color;
							font-weight: normal;
						}
						i {
							font-size: 25px;
							width: 32px;
							text-align: center;
							padding-right: 12px;
							float: left;
							color: #908f8f;
						}
					}
				}
			}
		}
		.blockcategories_footer {
			clear: left;
		}
		#social_block {
			float: left;
			width: 50%;
			padding: 22px 15px 0 15px;
			// max 767px
			@media (max-width: $screen-xs-max) {
				width: 100%;
				float: left;
				padding-top: 5px;
			}
			ul {
				float: right;
				@media (max-width: $screen-xs-max) {
					float: none;
				}
				li {
					float: left;
					width: 40px;
					text-align: center;
					// min 768px max 991px
					@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
						width: 30px;
					}
					a {
						display: inline-block;
						color: #908f8f;
						font-size: 28px;
						// min 768px max 991px
						@media (min-width: $screen-sm) and (max-width: $screen-sm-max) {
							font-size: 20px;
						}
						span {
							display: none;
						}
						&:before {
							display: inline-block;
							font-family: $font-icon;
							vertical-align: -5px;
						}
						&:hover {
							color: $light-text-color;
						}
					}
					&.facebook {
						a {
							&:before {
								content: "\f09a";
							}
						}
					}
					&.twitter {
						a {
							&:before {
								content: "\f099";
							}
						}
					}
					&.rss {
						a {
							&:before {
								content: "\f09e";
							}
						}
					}
					&.youtube {
						a {
							&:before {
								content: "\f167";
							}
						}
					}
					&.google-plus {
						a {
							&:before {
								content: "\f0d5";
							}
						}
					}
					&.pinterest {
						a {
							&:before {
								content: "\f0d2";
							}
						}
					}
				}
			}
			h4 {
				float: right;
				margin-bottom: 0;
				font-size: 21px;
				line-height: 25px;
				text-transform: none;
				padding: 0 10px 0 0;
				// max 767px
				@media (max-width: $screen-xs-max) {
					display: none;
					text-align: center;
				}
			}
		}
		.bottom-footer {
			position: absolute;
			bottom: -55px;
			left: 0;
			div {
				padding: 15px 0 0 0;
				border-top: 1px solid #515151;
				width: 100%;
			}
		}
	}
}

#reinsurance_block {
	clear: both !important;
}

// Make sure lists are correctly displayed in tinyMCE BO edition mode too
#short_description_content ul,
#short_description_content ol,
#short_description_content dl,
#tinymce ul,
#tinymce ol,
#tinymce dl {
	margin-left: 20px;
}

.rte ul {
	list-style-type: disc;
}

.rte ol {
	list-style-type: decimal;
}

.block_hidden_only_for_screen {
	display: none;
}

// PAIMENT - PAGE ORDER

//nav bottom
.cart_navigation {
	margin: 0 0 20px;
	.button-medium {
		float: right;
		@include border-radius(4px);
		font-size: 20px;
		line-height: 24px;
		span {
			@include border-radius(4px);
			padding: 11px 15px 10px 15px;
			// max 992px
			@media (max-width: $screen-md) {
				font-size: 16px;
			}
		}
		i.right {
			font-size: 25px;
			line-height: 25px;
			vertical-align: -4px;
			margin-left: 6px;
		}
	}
	.button-exclusive {
		border: none;
		background: none;
		padding: 0;
		font-size: 17px;
		font-weight: bold;
		color: $base-text-color;
		margin: 9px 0 0 0;
		i {
			color: #777777;
			margin-right: 8px;
		}
		&:hover, &:focus, &:active {
			color: $link-hover-color;
			@include box-shadow(none);
		}
	}
	@media (max-width: $screen-xs) {
		> span {
			display: block;
			width: 100%;
			padding-bottom: 15px;
		}
	}
}

// step 1 - cart
.cart_last_product {
	display: none;
}

.cart_quantity .cart_quantity_input {
	height: 27px;
	line-height: 27px;
	padding: 0;
	text-align: center;
	width: 57px;
}

.cart_gift_quantity .cart_quantity_input {
	height: 27px;
	line-height: 27px;
	padding: 0;
	text-align: center;
	width: 57px;
}

.table {
	tbody > tr > td {
		vertical-align: middle;
		&.cart_quantity {
			padding: 41px 14px 25px;
			width: 88px;
			.cart_quantity_button {
				margin-top: 3px;
				a {
					float: left;
					margin-right: 3px;
					&+ a {
						margin-right: 0;
					}
				}
			}
		}
		&.cart_delete,
		&.price_discount_del {
			padding: 5px;
		}
	}
	tfoot > tr > td {
		vertical-align: middle;
	}
}

.cart_delete a.cart_quantity_delete,
a.price_discount_delete {
	font-size: 23px;
	color: $base-text-color;
	&:hover {
		color: silver;
	}
}

#cart_summary {
	tbody {
		td {
			&.cart_product {
				padding: 19px;
				width: 137px;
				img {
					border: 1px solid $table-border-color;
				}
			}
			&.cart_unit {
				.price {
					span {
						display: block;
						&.price-percent-reduction {
							margin: 5px auto;
							display: inline-block;
						}
						&.old-price {
							text-decoration: line-through;
						}
					}
				}
			}
			&.cart_description {
				width: 480px;
				small {
					display: block;
					padding: 5px 0 0 0;
				}
			}
			&.cart_avail {}
		}
	}
	tfoot {
		td {
			&.text-right {
				font-weight: bold;
				color: $base-text-color;
			}
			&.price {
				text-align: right;
			}
			&.total_price_container {
				span {
					font: 600 18px / 22px $font-custom;
					color: #555454;
					text-transform: uppercase;
				}
			}
			&#total_price_container {
				font: 600 21px / 25px $font-custom;
				color: $product-price-color;
				background: $light-background;
			}
		}
	}
}

@media (max-width: $screen-xs-max) {
	#order-detail-content {
		#cart_summary {
			table, thead, tbody, th, td, tr {
				display: block;
			}
			thead tr {
				position: absolute;
				top: -9999px;
				left: -9999px;
			}
			tr {
				border-bottom: 1px solid #cccccc;
				overflow: hidden;
			}
			td {
				border: none;
				position: relative;
				width: 50%;
				float: left;
				white-space: normal;
				&.cart_product {}
				&.cart_description {}
				&.cart_avail {
					clear: both;
				}
				&.cart_unit {}
				&.cart_quantity {
					clear: both;
					padding: 9px 8px 11px 18px;
				}
				&.cart_total {}
				&.cart_delete {
					width: 100%;
					clear: both;
					text-align: right;
					&:before {
						display: inline-block;
						padding-right: 0.5em;
						position: relative;
						top: -3px;
					}
				}
				div {
					display: inline;
				}
			}
			td:before {
				content: attr(data-title);
				display: block;
			}
			tfoot {
				td {
					float: none;
					width: 100%;
					&:before {
						display: inline;
					}
				}
				tr {
					.text-right, .price {
						display: block;
						float: left;
						width: 50%;
					}
				}
			}
		}
	}
}

@media (max-width: $screen-sm) {
	#order-detail-content {
		#cart_summary {
			tbody {
				td {
					.price {
						text-align: center;
					}
					&.cart_description {
						width: 300px;
					}
				}
			}
		}
	}
}

.cart_voucher {
	vertical-align: top !important;
	h4 {
		font: 600 18px / 22px $font-custom;
		color: $base-heading-color;
		text-transform: uppercase;
		padding: 7px 0 10px 0;
	}
	.title-offers {
		color: $base-text-color;
		font-weight: bold;
		margin-bottom: 6px;
	}
	fieldset {
		margin-bottom: 10px;
		#discount_name {
			float: left;
			width: 219px;
			margin-right: 11px;
		}
	}
	#display_cart_vouchers {
		span {
			font-weight: bold;
			cursor: pointer;
			color: $link-color;
			&:hover {
				color: $link-hover-color;
			}
		}
	}
}

.enable-multishipping {
	margin: -13px 0 17px;
	label {
		font-weight: normal;
	}
}

#HOOK_SHOPPING_CART {
	#loyalty {
		i {
			font-size: 26px;
			line-height: 26px;
			color: #cfcccc;
		}
	}
}

#order_carrier {
	clear: both;
	margin-top: 20px;
	border: 1px solid #999999;
	background: $light-background;
}

#order_carrier .title_block {
	padding: 0 15px;
	height: 29px;
	font-weight: bold;
	line-height: 29px;
	color: $light-text-color;
	font-weight: bold;
	text-transform: uppercase;
	background: url(../img/bg_table_th.png) repeat-x 0 -10px #999999;
}

#order_carrier span {
	display: block;
	padding: 15px;
	font-weight: bold;
}

.multishipping_close_container {
	text-align: center;
}

table#cart_summary .gift-icon {
	color: white;
	background: #0088cc;
	line-height: 20px;
	padding: 2px 5px;
	border-radius: 5px;
}

// step 3 - address
#multishipping_mode_box {
	padding-top: 12px;
	padding-bottom: 19px;
	.title {
		font-weight: bold;
		color: $base-text-color;
		margin-bottom: 15px;
	}
	.description_off {
		display: none;
		div {
			margin-bottom: 10px;
		}
	}
	.description_off a:hover,
	.description a:hover {
		background: #f3f3f3;
		border: 1px solid #cccccc;
	}
}

#multishipping_mode_box.on .description_off {
	display: block;
}

.multishipping-cart {
	.cart_address_delivery {
		&.form-control {
			width: 198px;
		}
	}
}

#order .address_add.submit {
	margin-bottom: 20px;
}

#ordermsg {
	margin-bottom: 30px;
}

#id_address_invoice.form-control,
#id_address_delivery.form-control {
	width: 269px;
}

.addresses {
	.select label,
	.selector,
	.addresses .address_select {
		clear: both;
		float: left;
	}
	.waitimage {
		display: none;
		float: left;
		width: 24px;
		height: 24px;
		background-image: url("../../../img/loader.gif");
		background-repeat: no-repeat;
		position: relative;
		bottom: -2px;
		left: 10px;
	}
	.checkbox.addressesAreEquals {
		clear: both;
		float: left;
		margin: 15px 0 25px 0;
	}
}

// step 4 - paiement
#order .delivery_option,
#order-opc .delivery_option {
	> div {
		display: block;
		margin-bottom: 20px;
		font-weight: normal;
		> table {
			background: $light-background;
			margin-bottom: 0;
			&.resume {
				height: 53px;
				&.delivery_option_carrier {
					margin-top: 10px;
					width: 100%;
					background: $state-info-bg;
					color: $state-info-text;
					border: 1px solid $state-info-border;
					font-weight: bold;
					td {
						padding: 8px 11px 7px 11px;
						i {
							font-size: 20px;
							margin-right: 7px;
							vertical-align: -2px;
						}
					}
				}
				td {
					&.delivery_option_radio {
						width: 54px;
						padding-left: 0;
						padding-right: 0;
						text-align: center;
					}
					&.delivery_option_logo {
						width: 97px;
						padding-left: 21px;
					}
					&.delivery_option_price {
						width: 162px;
					}
				}
			}
		}
	}
}

.order_carrier_content {
	line-height: normal;
	padding-bottom: 16px;
	.carrier_title {
		font-weight: bold;
		color: $base-text-color;
	}
	.checkbox {
		input {
			margin-top: 2px;
		}
	}
	.delivery_options_address {
		.carrier_title {
			margin-bottom: 17px;
		}
	}
	& + div {
		padding-bottom: 15px;
	}
}

#carrierTable {
	border: 1px solid #999999;
	border-bottom: none;
	background: $light-background;
}

#carrierTable tbody {
	border-bottom: 1px solid #999999;
}

#carrierTable th {
	padding: 0 15px;
	height: 29px;
	font-weight: bold;
	line-height: 29px;
	color: $light-text-color;
	text-transform: uppercase;
	background: url(../img/bg_table_th.png) repeat-x 0 -10px #999999;
}

#carrierTable td {
	padding: 15px;
	font-weight: bold;
	border-right: 1px solid #e9e9e9;
}

#carrierTable td.carrier_price {
	border: none;
}

p.checkbox.gift {
	margin-bottom: 10px;
}

#gift_div {
	display: none;
	margin-top: 5px;
	margin-bottom: 10px;
}

a.iframe {
	color: $base-text-color;
	text-decoration: underline;
	&:hover {
		text-decoration: none;
	}
}

//step 5 - paiement
p.payment_module {
	margin-bottom: 10px;
	a {
		display: block;
		border: 1px solid $table-border-color;
		@include border-radius(4px);
		font-size: 17px;
		line-height: 23px;
		color: $base-text-color;
		font-weight: bold;
		padding: 33px 40px 34px 99px;
		letter-spacing: -1px;
		position: relative;
		&.bankwire {
			background: url(../img/bankwire.png) 15px 12px no-repeat $base-box-bg;
		}
		&.cheque {
			background: url(../img/cheque.png) 15px 15px no-repeat $base-box-bg;
		}
		&.cash {
			background: url(../img/cash.png) 15px 15px no-repeat $base-box-bg;
		}
		&.cheque, &.bankwire, &.cash {
			&:after {
				display: block;
				content: "\f054";
				position: absolute;
				right: 15px;
				margin-top: -11px;
				top: 50%;
				font-family: $font-icon;
				font-size: 25px;
				height: 22px;
				width: 14px;
				color: $link-color;
			}
		}
		&:hover {
			background-color: #f6f6f6;
		}
		span {
			font-weight: bold;
			color: $base-body-color;
		}
	}
}

.payment_module.box {
	margin-top: 20px;
}

p.cheque-indent {
	margin-bottom: 9px;
}

.cheque-box {
	.form-group {
		margin-bottom: 0px;
		.form-control {
			width: 269px;
		}
	}
}

.order-confirmation.box {
	line-height: 29px;
	a {
		text-decoration: underline;
		&:hover {
			text-decoration: none;
		}
	}
}

//PAGE ORDER-OPC
.delivery_option_carrier td {
	width: 200px;
}

.delivery_option_carrier td + td {
	width: 280px;
}

.delivery_option_carrier td + td + td {
	width: 200px;
}

.delivery_option_carrier tr td {
	padding: 5px;
}

.delivery_option_carrier.selected {
	display: table;
}

.delivery_option_carrier.not-displayable {
	display: none;
}

//PAGES ADRESSES, IDENTITY
#address,
#identity,
#account-creation_form,
#new_account_form,
#opc_account_form,
#authentication {
	.box {}
	padding-bottom: 20px;
	line-height: 20px;
	p.required {
		color: #f13340;
		margin: 9px 0 16px 0;
	}
	p.inline-infos {
		color: red;
	}
	.form-group {
		margin-bottom: 4px;
		.form-control {
			max-width: 271px;
			&#adress_alias {
				margin-bottom: 20px;
			}
		}
		&.phone-number {
			// min 1200px
			@media (min-width: $screen-lg) {
				float: left;
				width: 270px;
				margin-right: 13px;
			}
			+ p {
				@media (min-width: $screen-lg) {
					padding: 23px 0 0 0px;
					margin-bottom: 0;
				}
			}
		}
	}
	.gender-line {
		margin-bottom: 4px;
		padding-top: 4px;
		> label {
			margin-right: 10px;
			margin-bottom: 0;
		}
		.radio-inline {
			label {
				font-weight: normal;
				color: #777777;
			}
		}
	}
}

#identity,
#authentication,
#order-opc {
	#center_column {
		form.std {
			.row {
				margin-left: -5px;
				margin-right: -5px;
				.col-xs-4 {
					padding-left: 5px;
					padding-right: 5px;
					max-width: 94px;
					.form-control {
						max-width: 84px;
					}
				}
			}
		}
		.footer_links {
			border: none;
			padding-top: 0;
		}
	}
}

#new_account_form .box {
	line-height: 20px;
	.date-select {
		padding-bottom: 10px;
	}
	.top-indent {
		padding-top: 10px;
	}
	.customerprivacy {
		padding-top: 15px;
	}
}

#authentication {
	fieldset.account_creation {}
	margin-bottom: 20px;
}

// PASSWORD
#password {
	.box {
		p {
			margin-bottom: 9px;
		}
		.form-group {
			margin-bottom: 20px;
			.form-control {
				width: 263px;
			}
		}
	}
	.footer_links {}
	padding-top: 0;
	border: none;
}

//PAGE SEARCH
#instant_search_results {
	a.close {
		font-size: 13px;
		font-weight: 600;
		opacity: 1;
		line-height: inherit;
		text-transform: none;
		font-family: $font-family;
		&:hover {
			color: $link-hover-color;
		}
	}
}

// MANUFACTURERS/SUPPLIERS
#manufacturers_list,
#suppliers_list {
	h3 {
		font-size: 17px;
		line-height: 23px;
	}
	.description {
		line-height: 18px;
	}
	.product-counter {
		a {
			font-weight: bold;
			color: $base-text-color;
			&:hover {
				color: $link-hover-color;
			}
		}
	}
	&.list {
		li {
			.mansup-container {
				border-top: 1px solid $base-border-color;
				padding: 31px 0 30px 0;
				// < 768
				@media (max-width: $screen-xs-max) {
					text-align: center;
				}
			}
			&:first-child {
				.mansup-container {
					border-top: 0;
				}
			}
			.left-side {
				text-align: center;
			}
			h3 {
				margin-top: -5px;
				padding-bottom: 8px;
			}
			.middle-side {
				padding-left: 0;
				// < 768
				@media (max-width: $screen-xs-max) {
					padding-right: 15px;
					padding-left: 15px;
				}
			}
			.right-side-content {
				border-left: 1px solid $base-border-color;
				padding: 0 0 32px 31px;
				min-height: 108px;
				// < 768
				@media (max-width: $screen-xs-max) {
					min-height: 1px;
					padding: 0;
					border: none;
				}
				.product-counter {
					position: relative;
					top: -6px;
					margin-bottom: 12px;
					// < 768
					@media (max-width: $screen-xs-max) {
						top: 0;
					}
				}
			}
		}
	}
	&.grid {
		li {
			text-align: center;
			.product-container {
				padding-top: 40px;
				padding-bottom: 20px;
				border-bottom: 1px solid $base-border-color;
				.left-side {
					padding-bottom: 42px;
				}
				h3 {
					padding-bottom: 10px;
				}
				.product-counter {
					margin-bottom: 12px;
				}
			}
		}
		// > 1199
		@media (min-width: $screen-lg) {
			li.first-in-line {
				clear: left;
			}
			li.last-line {
				.product-container {
					border-bottom: none;
				}
			}
		}
		//768 -> 1199
		@media (min-width: $screen-sm) and (max-width: $screen-md-max) {
			li.first-item-of-tablet-line {
				clear: left;
			}
			li.last-tablet-line {
				.product-container {
					border-bottom: none;
				}
			}
		}
		// < 768
		@media (max-width: $screen-xs-max) {
			li.item-last {}
			.product-container {
				border-bottom: none;
			}
		}
	}
}

#manufacturer,
#supplier {
	.description_box {
		padding-top: 20px;
		padding-bottom: 20px;
		border-top: 1px solid $base-border-color;
		.hide_desc {
			display: none;
		}
	}
	.bottom-pagination-content,
	.top-pagination-content {
		min-height: 69px;
	}
	.top-pagination-content.bottom-line {
		border-bottom: 1px solid $base-border-color;
	}
}

//DISCOUNT PAGE
table.discount {
	i {
		font-size: 20px;
		line-height: 20px;
		vertical-align: -2px;
		&.icon-ok {
			color: #46a74e;
		}
		&.icon-remove {
			color: #f13340;
		}
	}
}

//GUEST TRACKING
#guestTracking {
	.form-control {
		max-width: 271px;
	}
	// > 1200px
	@media (min-width: $screen-lg) {
		.form-group {
			overflow: hidden;
			i {
				padding-left: 10px;
			}
		}
		.form-control {
			float: left;
		}
		label {
			float: left;
			clear: both;
			width: 100%;
		}
	}
}

//PAGE 404
#pagenotfound {
	.pagenotfound {
		max-width: 824px;
		margin: 0 auto;
		text-align: center;
		.img-404 {
			padding: 8px 0 27px 0;
			img {
				max-width: 100%;
			}
		}
		h1 {
			font: 600 28px / 34px $font-custom;
			color: $base-text-color;
			text-transform: uppercase;
			margin-bottom: 7px;
		}
		p {
			font: 600 16px / 20px $font-custom;
			color: #555454;
			text-transform: uppercase;
			border-bottom: 1px solid $base-border-color;
			padding-bottom: 19px;
			margin-bottom: 20px;
		}
		h3 {
			font-weight: bold;
			color: $base-text-color;
			font-size: 13px;
			line-height: normal;
			margin-bottom: 18px;
		}
		label {
			font-weight: normal;
			@media (max-width: $screen-xs-max) {
				display: block;
			}
		}
		.form-control {
			max-width: 293px;
			display: inline-block;
			margin-right: 5px;
			// max 767px
			@media (max-width: $screen-xs-max) {
				margin: 0 auto 15px auto;
				display: block;
			}
		}
		.buttons {
			padding: 48px 0 20px 0;
			.button-medium {
				i.left {
					font-size: 17px;
				}
			}
		}
	}
}

//addon RerversoForm
#account-creation_form fieldset.reversoform {
	padding: 10px !important;
}

#account-creation_form fieldset.reversoform .text label {
	display: block;
	padding: 0 0 10px 0;
	width: 100%;
	text-align: left;
}

#account-creation_form fieldset.reversoform .infos-sup {
	padding: 0 !important;
	font-size: 10px;
	font-style: italic;
	text-align: right;
}

//addon customer privacy
#account-creation_form fieldset.customerprivacy label,
fieldset.customerprivacy label {
	cursor: pointer;
}

//addon referralprogram
.tab-content {
	margin-top: 20px;
}

//addons comments products
form#sendComment fieldset {
	padding: 10px;
	border: 1px solid #cccccc;
	background: #eeeeee;
}

form#sendComment h3 {
	font-size: 14px;
}

#new_comment_form p.text {
	margin-bottom: 0;
	padding-bottom: 0;
}

#sendComment p.text label,
#sendComment p.textarea label {
	display: block;
	margin: 12px 0 4px;
	font-weight: bold;
	font-size: 12px;
}

#sendComment p.text input {
	padding: 0 5px;
	height: 28px;
	width: 498px;
	border: 1px solid #cccccc;
	background: url(../img/bg_input.png) repeat-x 0 0 $light-background;
}

#sendComment p.textarea textarea {
	height: 80px;
	width: 508px;
	border: 1px solid #cccccc;
}

#sendComment p.submit {
	padding: 0;
	text-align: right;
}

#sendComment p.closeform {
	float: right;
	padding: 0;
	height: 12px;
	width: 12px;
	text-indent: -5000px;
	background: url(../img/icon/delete.gif) no-repeat 0 0;
}

.star {
	position: relative;
	top: -1px;
	float: left;
	width: 14px;
	overflow: hidden;
	cursor: pointer;
	font-size: 14px;
	font-weight: normal;
}

.star {
	display: block;
	a {
		display: block;
		position: absolute;
		text-indent: -5000px;
	}
}

div.star {
	&:after {
		content: "\f006";
		font-family: $font-icon;
		display: inline-block;
		color: #777676;
	}
}

div.star.star_on {
	display: block;
	&:after {
		content: "\f005";
		font-family: $font-icon;
		display: inline-block;
		color: #ef8743;
	}
}

div.star.star_hover {
	&:after {
		content: "\f005";
		font-family: $font-icon;
		display: inline-block;
		color: #ef8743;
	}
}

//CSS Modules
//IMPORTANT - Internet Explorer can read 31 CSS files max. Some CSS have been put here and erased from their own module folder.

//Block ADVERTISING
.advertising_block {
	width: 191px;
	margin-bottom: 1em;
	text-align: center;
}

//footer
.blockcategories_footer ul ul {
	display: none !important;
}

//Form validate
.form-group {
	&.form-error {
		input, textarea {
			border: 1px solid #f13340;
			color: #f13340;
			background: url(../img/icon/form-error.png) 98% 5px no-repeat #fff1f2;
		}
	}
	&.form-ok {
		input, textarea {
			border: 1px solid #46a74e;
			color: #35b33f;
			background: url(../img/icon/form-ok.png) 98% 5px no-repeat #ddf9e1;
		}
	}
	&.form-error, &.form-ok {
		.form-control {
			padding-right: 30px;
		}
	}
}

//uniform
.radio-inline, .checkbox {
	padding-left: 0;
	.checker {
		float: left;
		span {
			top: 0px;
		}
	}
	div.radio {
		display: inline-block;
		span {
			float: left;
			top: 0px;
		}
	}
}

.fancybox-skin {
	background: $light-background !important;
}

.fancybox-skin .fancybox-close {
	width: 28px;
	height: 28px;
	background: none;
	font-size: 28px;
	line-height: 28px;
	color: $base-text-color;
	text-align: center;
	background: white;
	@include border-radius(50px);
	&:hover {
		color: $link-hover-color;
	}
	&:after {
		content: "\f057";
		font-family: $font-icon;
	}
}

//Homepage pre-footer
#facebook_block,
#cmsinfo_block {
	overflow: hidden;
	background: $homepage-footer-bg;
	min-height: 344px;
	padding-right: 29px;
	padding-left: 29px;
	// max 991px
	@media (max-width: $screen-sm-max) {
		min-height: 348px;
		padding-left: 13px;
		padding-right: 13px;
	}
	// max 767px
	@media (max-width: $screen-xs-max) {
		width: 100%;
		min-height: 1px;
	}
}

#facebook_block {
	h4 {
		padding: 35px 0 0 0;
		margin: 0 0 12px 0;
		font: 300 21px / 25px $font-custom;
		color: lighten($base-heading-color, 10%);
		// max 991px
		@media (max-width: $screen-sm-max) {
			font-size: 18px;
		}
		// max 767px
		@media (max-width: $screen-xs-max) {
			padding-top: 20px !important;
		}
		// 768px
		@media (max-width: $screen-sm) {
			font-size: 16px;
		}
	}
	.facebook-fanbox {
		background: $light-background;
		border: 1px solid #aaaaaa;
		padding-bottom: 10px;
	}
}

#cmsinfo_block {
	border-left: 1px solid $homepage-footer-border;
	// max 767px
	@media (max-width: $screen-xs-max) {
		border: none;
		margin-top: 10px;
	}
	> div {
		padding: 35px 10px 0 0;
		// max 767px
		@media (max-width: $screen-xs-max) {
			padding-top: 20px;
		}
		// max 479px
		@media (max-width: $screen-xs - 1) {
			width: 100%;
			border-top: 1px solid $homepage-footer-border;
		}
	}
	> div + div {
		border-left: 1px solid $homepage-footer-border;
		min-height: 344px;
		padding-left: 29px;
		// max 479px
		@media (max-width: $screen-xs - 1) {
			border-left: none;
			padding-left: 10px;
			min-height: 1px;
			padding-bottom: 15px;
		}
	}
	em {
		float: left;
		width: 60px;
		height: 60px;
		margin: 3px 10px 0 0;
		font-size: 30px;
		color: $light-text-color;
		line-height: 60px;
		text-align: center;
		background: lighten($base-heading-color, 10%);
		@include border-radius(100px);
		// max 991px
		@media (max-width: $screen-sm-max) {
			width: 30px;
			height: 30px;
			line-height: 30px;
			font-size: 20px;
		}
	}
	.type-text {
		overflow: hidden;
	}
	h3 {
		margin: 0 0 5px 0;
		font: 300 21px / 25px $font-custom;
		color: lighten($base-heading-color, 10%);
		// max 1199px
		@media (max-width: $screen-md-max) {
			font-size: 18px;
		}
	}
	ul {
		li {
			padding-bottom: 22px;
			// max 1199px
			@media (max-width: $screen-md-max) {
				padding-bottom: 10px;
			}
			// max 991px
			@media (max-width: $screen-sm-max) {
				padding-bottom: 0;
			}
		}
	}
	p {
		em {
			background: none;
			@include border-radius(0);
			margin: 0;
			font-size: 13px;
			color: $text-color;
			float: none;
			height: inherit;
			line-height: inherit;
			text-align: left;
			font-style: italic;
		}
	}
}

.ie8 {
	#facebook_block,
	#cmsinfo_block {
		height: 344px;
	}
}

//Zoom
// max 1199px
@media (max-width: $screen-md-max) {
	.zoomdiv {
		display: none !important;
	}
}

//temporary fix for quickview
#product.content_only {
	div.pb-left-column {
		p.resetimg {
			margin-bottom: 0px;
			padding-top: 0px;
		}
		#thumbs_list_frame {
			margin-bottom: 0px;
		}
	}
}

//Product Compare
#product_comparison {
	td.compare_extra_information {
		padding: 10px;
	}
	#social-share-compare {
		margin-bottom: 50px;
	}
}

//Social Sharing
.btn-facebook, .btn-twitter, .btn-google-plus, .btn-pinterest {
	&:hover {
		border-color: white;
	}
}

.btn-facebook {
	i {
		color: #435f9f;
	}
	&:hover {
		color: white;
		background-color: #435f9f;
		i {
			color: white;
		}
	}
}

.btn-twitter {
	i {
		color: #00aaf0;
	}
	&:hover {
		color: white;
		background-color: #00aaf0;
		i {
			color: white;
		}
	}
}

.btn-google-plus {
	i {
		color: #e04b34;
	}
	&:hover {
		color: white;
		background-color: #e04b34;
		i {
			color: white;
		}
	}
}

.btn-pinterest {
	i {
		color: #ce1f21;
	}
	&:hover {
		color: white;
		background-color: #ce1f21;
		i {
			color: white;
		}
	}
}
