/**
* This overlord styling was taken from blog.css and is common to all wide-layout
* pages but not all pages are wide-layout yet, so if we remove blog.css from a
* page and want the wide layout we have to target it specifically.
* @TODO: move to common.css
*/
body#brand-page .overlord {
    width: 100%;
    max-width: 1300px;
    margin: 0 auto 0 auto;
}
/**
* This transition styling was taken from blog.css and should be moved to common.css
* @TODO: move to common.css
*/
* {
    transition: background .25s ease;
    transition: border .25s ease;
}
/**
* This pagination styling was taken from blog.css and should be moved to common.css or pagination.css
* @TODO: move to common.css or pagination.css
*/
.pagination {
    width: 100%;
    text-align: center;
}
.infinite-scroll-load-more,
.pagination .clean-next,
.pagination .clean-previous,
.pagination .clean-pages {
    display: inline-block;
    border-radius: 3px;
    background: #8cbdbd;
    padding: 6px 12px;
    color: #fff;
    text-shadow: 0 0 4px rgba(150, 150, 150, 1);
    font-size: 16px;
    margin:0 0 6px 0;
}
.infinite-scroll-load-more {
    display:block;margin:0 2.5% 1em;width:95%;box-sizing:border-box;left:-3px;position:relative; /* to match .profileSortFilter, left:-3px is due to 3px left padding in .prod_table_container */
}
@media only screen and (max-width:979px) {
    .infinite-scroll-load-more {
        left:0;
    }
}
.pagination .clean-previous,
.pagination .clean-next {
    margin-right:6px;
    margin-left:6px
}
.pagination .clean-pages {
    margin-right:2px;
    margin-left:2px
}
.pagination .clean-previous {
    position:static;
    float: left;
}
.pagination .clean-next {
    position:static;
    float: right;
}

/**
* This styling was taken from blog.css
*/
.shipping_promo {
    font-size: 15px;
}
#brand-header {
    width: 100%;
    float: left;
    position: relative;
    background: url('/content/cleansalon/banner.jpg') center center;
    background-size: cover;
    margin: 5px 0 15px 0;
    text-align: center;
    border-radius: 6px;
	z-index: 1;
}
#brand-header img {
    max-width: 300px;
    min-width: 100px;
    max-height: 200px;
    position: relative;
    padding: 20px;
    margin: 60px 0 60px 0;
    background-color: rgba(255,255,255,.85);
    border-radius: 6px;
    overflow: auto;
	pointer-events: none;
}
/**
* This is where the profile.css file used to begin
*/
.att_video {
	width: 100%;
	display: block;
	clear: both;
	margin: 0 auto;
	float: left;
	text-align: center;
	position: relative;
}

.att_video iframe {
	width: 90%;
	max-width: 980px;
	height: 53.35vw;
	max-height: 550px;

}

/* Product Page V2 */
/*
.bread-shipping {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	margin: 0 0 0 0 !important;
	padding: 3px 0 0 0;
}
*/
.v2_branded_table {
	width: 100%;
	overflow: auto;
	float: left;
	position: relative;
}

.v2_breadcrumb {
	float: left;
	position: relative;
}

.v2_shipping_promo {
	float: right;
	position: relative;
}

#v2_left_column {
	float: left;
	position: relative;
	width: 200px;
	margin: 30px 0 10px 10px;
}

#v2_right_column {
	position: relative;
	float: left;
	width: 100%;
	margin: 0 0 0 0;
}

#v2_long_desc {
	border: 1px solid #7f7f7f;
	width: 96%;
	padding: 2%;
	background: #f4f4f4;
	margin: 0 0 0 15px;
}

#v2_long_desc img{
	width: 100%;
}

.branded_table {
	position: absolute;
	top: 0;
	left: 0;
	height: 372px;
}

.brandpage_container {
	position: relative;
	width: 100%;
	overflow: expand;
}


.test-branded-header {
	max-width: 778px;
	width: 100%;
	margin: 0 auto 0 auto;
}

.mobile_logo_container {
	display: none;
}

.no_branding_logo {
	display: block;
	margin: 0 auto;
	width: 250px;
}

.no_branding_text {
	display: block;
	margin: 10px auto 20px auto;
	width: 650px;
	text-align: center;
}

.no_branding_table {
	padding-top: 30px !important;
}

.prod_video {
	width: 710px;
	height: 400px;
}

/* Logo & Descriptions */

.profile_container {
	padding-top: 10px;
	width: 750px;
	margin-left: 10px;
}

.profile_logo_box {
	position: relative;
	display: table-cell;
	float: left;
	width: 750px;
	vertical-align: middle;
	text-align: left;
	overflow: hidden;
	border: 1px solid #7f7f7f;
	background: #eee;

}

.profile_logo_container {
	margin: 25px;
	width: 250px;
}

.profile_desc_box {
	position: relative;
	display: table-cell;
	float: left;
	width: 730px;
	vertical-align: middle;
	text-align: left;
	overflow: hidden;
	border: 1px solid #7f7f7f;
	background: #f2f2ec;
	padding: 10px;
	color: #000;
}

.profile_logo {
	position: relative;
	float: left;
	vertical-align: middle;
	border: 1px solid #7f7f7f;
	width: 250px;
	height: 62px;
}

.profile_copy_top {
	margin: 30px 10px 0 300px;
	height: 50px;
	color: #000;
}

.profile_readmore {
	position: relative;
	float: right;
	margin: 0 15px 10px 0;
}

.profile_marketing {
	width: 100%;
	padding: 10px 0 10px 10px;
	clear: both;
	text-align: center;
}

.profile_bottom_logo_container {
	margin-left: auto;
	margin-right: auto;

	text-align: center;
}

.profile_bottom_logo {
	display: block;
	position: relative;
	vertical-align: middle;
	border: 1px solid #7f7f7f;
	width: 250px !important;
	height: 62px;
	margin: 0 auto 15px auto;
}

.brand_left_banners img {
	width: 100%;
	margin: 5px 0 0 0;
	border: 1px solid #7f7f7f;
}

/* Product Table */

.prod_table_container {
	position: relative;
	width: 100%;
	background: #fff;
	min-height: 300px;
	padding: 3px 0 0 3px;
	text-align: center;
}

.prod_table_container hr {
	display: block;
	width: 100%;
	height: 1px;
	clear: both;
	overflow: hidden;
	border: 0;
	border-bottom: 1px solid #ccc;
	margin: 0;
	padding: 0;
}

.prod_table_container hr::after {
	content: " ";
	font-size: 0;
	display: block;
	clear: both;
	zoom: 1;
}

.clearance_container {
	position: relative;
	padding-top: 5px;
	display: inline-block;
	font-size: 1px;
	height: 1px;
}



#csBadges {
	display: block;
	position: relative;
	width: 80%;
	text-align: center;
	float: left;
	margin: -40px 0 15px 0;
	z-index: 10;
}

#csBadges img {
	width: 75px;
	height: 75px;
	margin: 0 -2px;
	border-radius: 50%;
	border: 5px solid #fff;
}

.profileSortFilter {
	display: inline-block;
	float: left;
	width: 95%;
	text-align: center;
	border-radius: 6px;
	background: #a4d7d6;
	margin: 0 2.5% 5px 2.5%;
	padding: 5px 0;
}

.profileSortFilter div {
	display: inline-block;
}

.profileSortFilter div select {
	text-align: center;
	font-size: 16px;
	padding: 3px 6px;
	margin: 5px 3px;
	border: none;
	border-radius: 6px;
    cursor:pointer;
}

.freeShipping span {
	background: #333;
	border-radius: 9px;
	color: #fff;
	font-family: Open Sans, sans-serif;
	font-size: 16px;
	padding: 10px 15px;
	border: 5px solid #fff;
	-webkit-box-shadow: 5px 5px 15px 1px rgba(0,0,0,0.19); 
	box-shadow: 5px 5px 15px 1px rgba(0,0,0,0.19);
}

.freeShippingBag {
	color: #fff;
	font-weight: bold;
	text-decoration: underline;
}

.freeShippingButton {
	border-radius: 3px;
	background: #fff;
	color: #333;
	padding: 3px 6px;
	font-weight: bold;
}

@keyframes freeShippingArrow {
	0% {padding: 0 1.5px 0 1.5px;}
	25% {padding: 0 3px 0 0;}
	50% {padding: 0 1.5px 0 1.5px;}
	75% {padding: 0 0 0 3px;}
}

.freeShipping span i {
	animation-name: freeShippingArrow;
	animation-duration: 1s;
	animation-iteration-count: 10;
	animation-timing-function: linear;
	padding: 0 1.5px 0 1.5px;
}

.slider-menu-toggle {
	display: none;
}
.brandpage_container {
	z-index: 1;
}
.left_barker_block {
	border-radius: 3px;
	border: 1px solid #e5e5e5;
}
.left_barker_block_two {
	border-radius: 3px;
	border: 1px solid #e5e5e5;
}
.left_barker_title {
	border-bottom: 1px dotted #e5e5e5;
	margin-bottom: 5px;
}
.brand_offer {
	width: 80%;
	margin: 20px 10%;
	overflow: hidden;
	border-radius: 6px;
	border: 1px solid #e8a264;
}
.brand_offer img {
	width: 100%;
}
#brand-header {
	width: 100%;
	float: left;
	position: relative;
	margin: 5px 0 15px 0;
	text-align: center;
	border-radius: 6px;
}

#clearance {
	max-width: 100% !important;
	min-width: 100% !important;
	max-height: 100% !important;
	height: 100% !important;
	position: absolute !important;
	top: 0;
	left: 0;
	padding: 0 !important;
	margin: 0 0 0 0 !important;
	background-color: rgba(0,0,0,0) !important;
	border-radius: 0 !important;
	overflow: auto !important;
}

#v2_long_desc {
	margin: 20px 0 10px 0;
	border: none !important;
	background-color: #f2f2f2 !important;
	-webkit-box-shadow: 0 3px 3px 0 rgba(0,0,0,0.34);
	-moz-box-shadow: 0 3px 3px 0 rgba(0,0,0,0.34);
	box-shadow: 0 3px 3px 0 rgba(0,0,0,0.34);
	border-radius: 3px;
	line-height: 1.5em;
}
#brand-text {
	text-align: center;
	position: relative;
	vertical-align: middle;
	width: 96.1%;
	overflow: auto;
	padding: 15px 2%;
	margin: 0 auto 15px auto;
	letter-spacing: 1px;
	font-size: 16px;
	line-height: 150%;
	border-bottom: 1px solid #e1e1e1;
}
/*
.bread-shipping {
	width: 96%;
	overflow: auto;
	padding: 10px 1%;
	margin: 0 1% 0 1% !important;
	border-radius: 0 0 6px 6px;
	float: none;
}
*/
.shipping_promo, .breadcrumb_link {
	color: inherit !important;
}
div.sort-tabs-container {
	border-bottom: none !important;
	margin-left:auto;
	margin-right:auto;
}
div.sort-tabs {
	background-image: none !important;
}
.sort-tabs-header {
	background-image: none !important;
	border-left: none !important;
	border-right: none !important;
}
div.sort-tabs a.active {
	background-image: none !important;
	box-shadow: none !important;
}
div.sort-tabs-cap {
	background-image: none !important;
}
#v2_left_column {
	margin: 0 0 10px 10px;
}
.gwp-m-container-m {
	display: none;
}
.sortContainer {
	display: inline-block; float: right; margin: 0 10px 0 0;
}
.pageLabel {
	display: inline-block; float: left; margin: 0; padding: 0 0 0 10px; line-height: 10px;
}
.pageLabel h1 {
	font-size: 1.17em;
	font-weight: bold;
	margin-block-start: 1em;
	margin-block-end: 1em;
}
.sortContainer .label {
	font-weight: bold;
}

.sidebar-product-colors {
	text-align: center;
	padding: 0;
	width: 100%;
	margin: 0 !important;
}
.sidebar-product-colors input[type="radio"] {
	display: none;
}
.sidebar-product-colors input[type="radio"]:checked+label {
	font-weight: bold;
}
.sidebar-product-colors input[type="radio"]:checked+label img {
	border: 1px solid #000 !important;
}
.newatt-color {
	display: inline-block;
	border: 1px solid #e5e5e5;
	border-radius: 3px;
	overflow: hidden;
	margin: 1px;
	width: 42px;
	height: 42px;
	padding: 0;
	transition: none;
	cursor: pointer;
}
.newatt-color:hover {
	margin: -3px;
	width: 50px;
	height: 50px;
}
.newatt-color-all {
	display: inline-block;
	border: 1px solid #e5e5e5;
	border-radius: 3px;
	width: 95%;
	height: 20px;
	padding-top: 5px;
	cursor: pointer;
	margin: 0 0 5px 0;
	max-width: 190px;
}
.newatt-color:hover {
	margin: -3px;
	width: 50px;
	height: 50px;
}
.brandpage_container .profileSortFilter #sidebar-product-type label {
	display:inline;
	margin:0;
	width:auto;
}

#brand-header img {
	max-width: 40%;
	min-width: 100px;
	max-height: 200px;
	position: relative;
	padding: 20px;
	margin: 60px 0 60px 0;
	border-radius: 6px;
	overflow: auto;
}

.v3-bottom-logo {
	max-width: 30%;
	min-width: 100px;
	max-height: 200px;
	position: relative;
	padding: 20px;
	display:block;
	margin: 0 auto 25px auto;
	border-radius: 6px;
	overflow: auto;
	width: initial !important;
	height: initial !important;
}

	#csBadges {
		display: block;
		position: relative;
		width: 100%;
		text-align: center;
		float: left;
		margin: -40px 0 15px 0;
		z-index: 10;
	}

@media only screen and (max-width: 979px) {

	.sortContainer {
		float: initial; margin: 0;
	}
	.pageLabel {
		width: 100%; margin: 0;
		box-sizing: border-box;
		padding-left: 10px;
		padding-right: 10px;
	}
	.sortContainer .label {
		display: none;
	}

	/* MOBILE SLIDE MENU */
	input[type="radio"] + .fa-times-circle:before {
		display: none;
	}
	input[type="radio"]:checked + .fa-times-circle:before {
		display: block;
		margin-right: 5px;
		color: #f00;
		font-size: 18px;
	}
	.chosen-brand i {
		margin-right: 5px;
		color: #f00;
		font-size: 18px;
	}
	.slider {
	   border: none;
	   background-color: white;
	   height: 3px;
	   width: 45px;
	   margin-top: 10px;
	   border-radius:15px;
	}
	#slideButton {
	}
	#slideButton:focus {
	   outline: none;
	}
	#slideButton:hover {
	   background-color: rgba(100,100,100,0.1);
	   transition: ease 0.6s;
	}
	#listMobile {
	   margin-top: 100px;
	}
	.smallList {
	   display: block;
	   padding-top: 15px;
	   padding-bottom: 15px;
	   padding-left: 0;
	   font-size: 45px;
	}
	.mobile-slide-close {
		background: rgba(255,255,255,0);
		color: inherit;
		border: none;
		padding: 0;
		font: inherit;
		outline: inherit;
		width: 100%;
		height: 100%;
		position: absolute;
	}
	.mobile-slide-container {
		width: 250px;
		background: #fff;
	}
	.slider-menu-toggle {
		display: block;
		width: 90%;
		margin: 0 5% 20px 5%;
		border: 1px solid #0256d4;
		text-align: center;
		padding: 6px 2px;
		transition: all .25s ease;
		background: #0256d4;
		color: #fff;
		font-weight: bold;
		font-size: 14px;
		float: left;
		border-radius: 3px;
		overflow: hidden;
	}
	.slider-menu-toggle:hover {
		display: block;
		width: 90%;
		margin: 0 5% 20px 5%;
		border: 1px solid #0256d4;
		text-align: center;
		padding: 6px 2px;
		transition: all .25s ease;
		background: #0256d4;
		color: #fff;
		font-weight: bold;
		font-size: 14px;
		float: left;
		border-radius: 3px;
		overflow: hidden;
	}
	.mobile-slide-container {
		position: relative;
		z-index: 1200;
		max-height: 80%;
		width: 250px;
		overflow: scroll;
		border: 1px solid #ccc;
	}
	.mobile-slide-block a, .mobile-slide-block label, .mobile-slide-title, .mobile-slide-block strong {
		display: block;
		width: 100%;
		line-height: 26px;
		font-size: 16px;
	}
	.mobile-slide-block input {
		display: none;
	}
	.mobile-slide-title {
		background: #f5f5f6;
		height: 50px;
		line-height: 50px;
	}
	.gwp-container {
		margin: 0 auto 0 auto !important;
	}
	.under-brand-header {
		display: none;
	}
	.brandpage_container {
		margin-top: 0;
	}
	#brand-header {
		width: 95%;
		margin: -10px 2.5% 0 2.5%;
	}
	#brand-header img {
		max-width: 60%;
		margin: 40px 0 40px 0;
	}
	.desktop-header3 {
		z-index: 1000;
	}
	#v2_left_column {
		display: none;
		float: left;
		width: 100%;
		margin: 0;
	}
	.left_barker_block {
		display: none;
	}
	.product-colors {
		display: block;
	}
	#brand-header img {
		width: 90%;
	}
	#csBadges {
		display: block;
		position: relative;
		width: 100%;
		text-align: center;
		float: left;
		margin: 10px 0 0 0;
		z-index: 10;
	}
	#csBadges img {
		margin: -5px -2px;
	}
}

@media only screen and (max-width: 786px) {
	#brand-header img {
		max-width: 80%;
	}
	.freeShipping {
		background: #333;
		-webkit-box-shadow: 5px 5px 15px 1px rgba(0,0,0,0.19); 
		box-shadow: 5px 5px 15px 1px rgba(0,0,0,0.19);
		padding: 1px 0;
		border-radius: 0;
		width: 100%;
		text-align: center;
		margin-top: 10px;
	}
	.freeShipping span {
		background: none;
		color: #fff;
		font-family: Open Sans, sans-serif;
		font-size: 16px;
		padding: 10px 15px;
		border: none;
		-webkit-box-shadow: none; 
		box-shadow: none;
	}
	.freeShippingButton {
		border-radius: 3px;
		background: #fff;
		color: #333;
		padding: 3px 6px;
		font-weight: bold;
		display: inline-block;
		margin: 5px 0; 
	}
	.freeShipping i {
		display: none;
	}
}