/* Color Trends Gallery */	

section.color-trends-gallery {
    cursor: pointer;
}

@media (min-width: 1331px) {
	.scrollable-content {
	    padding-left: calc((100% - 1190px)/2) !important; /* 1190px is container width */
	}
}

@media (min-width: 1200px) and (max-width: 1330px) {
	.scrollable-content {
	    padding-left: calc((100% - 1060px)/2) !important; /* 1060px is container width */
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	.scrollable-content {
	    padding-left: 56px!important;
	}
} 

@media (min-width: 768px) and (max-width: 991px) {
	.scrollable-content {
	    padding-left: 29px!important;
	}
}

@media (max-width: 767px) {
	.scrollable-content {
	    padding-left: 18px!important;
	}
}

.scrollable-content {
	overflow: auto;
	overflow-y: hidden;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.scrollable-content::-webkit-scrollbar {
	display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.scrollable-content {
	-ms-overflow-style: none;  /* IE and Edge */
	scrollbar-width: none;  /* Firefox */
}

.stain-color-trends-gallery p.explore {
    font-weight: var(--behr-bold-600);
    color: #000000;
}

.stain-color-trends-gallery p.scroll-text {
    font-weight: var(--behr-bold-600);
    color: #000000;
}

#section-bring-color-to-life .text-content-area,
.section-bring-color-to-life .content_desktop-bring-color-to-life,
#section-bring-colour-to-life .text-content-area,
.section-bring-colour-to-life .content_desktop-bring-colour-to-life,
#section-donnez-vie-à-la-couleur .text-content-area,
.section-donnez-vie-à-la-couleur .content_desktop-donnez-vie-à-la-couleur  {
	padding-left: 10%;
}

#section-bring-color-to-life .fifty-fifty-image-text__logo-text-content,
#section-bring-colour-to-life .fifty-fifty-image-text__logo-text-content,
#section-donnez-vie-à-la-couleur .fifty-fifty-image-text__logo-text-content {
    text-align: center;
}

#section-bring-color-to-life #row_id-bring-color-to-life .image-text-left-bring-color-to-life,
#section-bring-colour-to-life #row_id-bring-colour-to-life .image-text-left-bring-colour-to-life,
#section-donnez-vie-à-la-couleur #row_id-donnez-vie-à-la-couleur .image-text-left-donnez-vie-à-la-couleur {
	padding: 0px;
}

@media (max-width: 991px) {
	.section-bring-color-to-life  .image-text-left-bring-color-to-life,
	.section-bring-colour-to-life  .image-text-left-bring-colour-to-life,
	.section-donnez-vie-à-la-couleur  .image-text-left-donnez-vie-à-la-couleur {
		background: var(--behr-beige);
	}	
}

.section-bring-color-to-life .content_mobile-bring-color-to-life .fifty-fifty-image-text__logo-text-content,
.section-bring-colour-to-life .content_mobile-bring-colour-to-life .fifty-fifty-image-text__logo-text-content,
.section-donnez-vie-à-la-couleur .content_mobile-donnez-vie-à-la-couleur .fifty-fifty-image-text__logo-text-content {
	padding-top: 0px !important;
	text-align: center;
}

#section-bring-color-to-life .content_desktop-bring-color-to-life .text-content-area a.button.black-primary,
.section-bring-color-to-life .content_desktop-bring-color-to-life a.primary-button-orange,
#section-bring-color-to-life .content_mobile-bring-color-to-life a.button.black-primary,
.section-bring-color-to-life .content_mobile-bring-color-to-life a.primary-button-orange,
#section-bring-colour-to-life .content_desktop-bring-colour-to-life .text-content-area a.button.black-primary,
.section-bring-colour-to-life .content_desktop-bring-colour-to-life a.primary-button-orange,
#section-bring-colour-to-life .content_mobile-bring-colour-to-life a.button.black-primary,
.section-bring-colour-to-life .content_mobile-bring-colour-to-life a.primary-button-orange,
#section-donnez-vie-à-la-couleur .content_desktop-donnez-vie-à-la-couleur .text-content-area a.button.black-primary,
.section-donnez-vie-à-la-couleur .content_desktop-donnez-vie-à-la-couleur a.primary-button-orange,
#section-donnez-vie-à-la-couleur .content_mobile-donnez-vie-à-la-couleur a.button.black-primary,
.section-donnez-vie-à-la-couleur .content_mobile-donnez-vie-à-la-couleur a.primary-button-orange {
	min-width: 284px !important;
}

div.find-your-center a.start-exploring {
	min-width: 218px !important;
}

section#section-available-in-a-variety-of-finishes,
section.section-available-in-a-variety-of-finishes,
section.section-disponible-dans-une-variété-de-finis {
    background: var(--behr-beige);
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

section#section-available-in-a-variety-of-finishes .container,
section.section-available-in-a-variety-of-finishes .container,
section.section-disponible-dans-une-variété-de-finis .container {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

section#section-available-in-a-variety-of-finishes .text-content-area,
section#section-disponible-dans-une-variété-de-finis .text-content-area {
    padding-right: 20% !important;
}

section.section-available-in-a-variety-of-finishes .content_desktop-available-in-a-variety-of-finishes,
section.section-disponible-dans-une-variété-de-finis .content_desktop-disponible-dans-une-variété-de-finis {
    padding-right: 15% !important;
}

section.section-available-in-a-variety-of-finishes .content_desktop-available-in-a-variety-of-finishes h2,
section.section-disponible-dans-une-variété-de-finis .content_desktop-disponible-dans-une-variété-de-finis h2 {
	font-weight: var(--behr-normal);
	font-size: 45px;
	line-height: 54px;
}

section.section-available-in-a-variety-of-finishes .content_mobile-available-in-a-variety-of-finishes h2,
section.section-disponible-dans-une-variété-de-finis .content_mobile-disponible-dans-une-variété-de-finis h2 {
	font-weight: var(--behr-normal);
	font-size: 45px;
	line-height: 54px;
}

section.section-available-in-a-variety-of-finishes .content_mobile-available-in-a-variety-of-finishes.fifty-fifty-image-text__logo-text-content,
section.section-disponible-dans-une-variété-de-finis .content_mobile-disponible-dans-une-variété-de-finis.fifty-fifty-image-text__logo-text-content {
	padding-top: 0px;
}

/* Stain 2023 */

section.coty-cordovan-brown {
	background: #302524;
	height: 94px;
}

section.coty-cordovan-brown p.text-cordovan-brown {
	font-weight: var(--behr-normal);
	font-size: 36px;
	line-height: 37px;
	color: #FFFFFF;
    font-family: var(--behr-heading-font) !important;
}

@media (max-width: 991px) {
	section.coty-cordovan-brown {
		height: 64px;
	}

	section.coty-cordovan-brown p.text-cordovan-brown {
		font-size: 29px;
		line-height: 37px;
	}
}


/* Stain Gallery */
.stain-color-trends-gallery .color-area {
	font-family: var(--behr-body-and-label-font) !important;
	font-weight: var(--behr-bold-600);
	font-size: 12px;
	line-height: 25px;
}
.stain-color-trends-gallery .color-name {
	font-family: var(--behr-body-and-label-font) !important;
	font-weight: var(--behr-bold-600);
	font-size: 16px;
	line-height: 25px;
}
.stain-color-trends-gallery .color-code {
	font-family: var(--behr-body-and-label-font) !important;
	font-weight: var(--behr-normal);
	font-size: 16px;
	line-height: 25px;
}

.stain-color-trends-gallery .color-chip-details p,
.stain-color-trends-gallery .solid-color-chip-details p,
.stain-color-trends-gallery .semi-transparent-color-chip-details p  {
    color: unset;
}

.gallery-color-chip-2 {
	background: #F6F5F0;
	min-width: 645px !important;
}

.gallery-color-chip-2 .content-wrapper {
	width: 63%;
}
.scroll-button {
	border: 1px solid;
    border-radius: 50px;
    cursor: pointer;
}

.column-1-and-2 {
	min-width: 375px;
}

@media (min-width: 992px) and (max-width: 1199px) {
	.gallery-img-1 {
		min-width: 50%;
	}

	.gallery-color-chip-2 {
		min-width: 50% !important;
	}
}

.column-4 {
	min-width: 225px;
}

.column-4 .column-4-chip-1 {
	height: 46%;
}

.column-4 .column-4-chip-2 {
	height: 27%;
}

.column-4 .column-4-chip-3 {
	height: 27%;
}

.column-5 {
	min-width: 784px !important;
}

.column-5-chip-1, 
.column-5-chip-2,
.column-5-chip-3 {
	width: 33.33%;
	height: 133px;
}

@media (max-width: 991px) {
	.column-5 {
		min-width: 590px !important;
	}
	
	.column-5-chip-1, 
	.column-5-chip-2,
	.column-5-chip-3 {
		width: 33.33%;
		height: 145px;
	}
	
	.column-5-chip-1.pro, 
	.column-5-chip-2.pro,
	.column-5-chip-3.pro {
		width: 33.33%;
		height: 160px;
	}
}

.column-7-color-chips {
	min-width: 232px !important;
}

.column-10 {
	min-width: 225px;
}

.column-10 .column-10-chip-1 {
	height: 46%;
}

.column-10 .column-10-chip-2 {
	height: 18%;
}

.column-10 .column-10-chip-3 {
	height: 18%;
}

.column-10 .column-10-chip-4 {
	height: 18%;
}

.column-11 {
	min-width: 225px;
}

.column-11 .column-11-chip-1 {
	height: 64%;
}

.column-11 .column-11-chip-2 {
	height: 36%;
}

.column-14 {
	min-width: 225px;
}

.column-14 .column-14-chip-1 {
	height: 64%;
}

.column-14 .column-14-chip-2 {
	height: 36%;
}

.column-16-color-chips {
	min-width: 225px !important;
}

.column-19 {
	min-width: 225px;
}

.column-19 .column-19-chip-1 {
	height: 25%;
}

.column-19 .column-19-chip-2 {
	background: #DCD9D1;
	height: 25%;
}

.column-19 .column-19-chip-3 {
	height: 25%;
}

.column-19 .column-19-chip-4 {
	height: 25%;
}

.column-20 {
	min-width: 225px;
}

.column-20 .column-20-chip-1 {
	height: 64%;
}

.column-20 .column-20-chip-2 {
	height: 36%;
}

.stain-color-trends-gallery img {
	min-width: fit-content;
}


/* Introducing Stain */

.introducing-coty-stain-2023 h2 {
	font-size: 66px !important;
	line-height: 80px !important;
}

.introducing-coty-stain-2023 p.description {
	font-size: 20px !important;
	line-height: 26px !important;
}

.introducing-coty-stain-2023 label.stain-type {
	font-weight: var(--behr-bold-600) !important;
	font-size: 12px !important;
	line-height: 25px !important;
	text-transform: unset;
}

label.stain-color-name,
label.stain-color-code {
	font-weight: var(--behr-bold-600) !important;
	font-size: 18px !important;
	line-height: 25px !important;
}

@media (max-width: 991px) {
	.introducing-coty-stain-2023 .img-text-centent {
	    max-width: 100%;
	}
	
	.introducing-coty-stain-2023 h2 {
		font-size: 45px !important;
		line-height: 45px !important;
	}
	
	.introducing-coty-stain-2023 label.stain-type {
		font-size: 12px !important;
		line-height: 16px !important;
	}
	
	.introducing-coty-stain-2023 label.stain-color-name,
	.introducing-coty-stain-2023 label.stain-color-code {
		font-size: 15px !important;
		line-height: 25px !important;
	}
	
	.introducing-coty-stain-2023 .img-content img {
		min-width: 160px;
	}
}


/* Good Pairing  */

.good-paring {
	background: #F1EDE2;
}

.good-paring p.description {
	font-size: 18px;
    line-height: 22px;
}

.good-paring .welcoming-atmosphere h2 {
	font-weight: var(--behr-normal);
	font-size: 45px;
	line-height: 54px;
}

.good-paring .stain-color-chip {
	height: 50px;
	width: 50px;
}

.stain-separator {
	border-top: 1px solid #000000;
}

.find-your-center label.sub-title {
	font-weight: var(--behr-bold-600);
	font-size: 18px;
	line-height: 56px;
}

.good-paring label.stain-color-name,
.good-paring label.stain-color-code {
	font-weight: var(--behr-bold-600);
	font-size: 18px !important;
	line-height: 20px !important;
}

a.buy-samples-and-gallons,
a.buy-samples-and-gallons:hover {
    font-family: var(--behr-body-and-label-font);
    font-weight: var(--behr-bold-600);
    font-size: 14px;
    line-height: 25px;
    color: #000000;
    text-decoration: underline;
}

@media (max-width: 991px) {
	
	.good-paring .welcoming-atmosphere h2 {
		font-weight: var(--behr-normal);
		font-size: 34px;
		line-height: 36px;
	}

	.good-paring label.stain-color-name,
	.good-paring label.stain-color-code {
		font-size: 16px !important;
	}
	
	.good-paring .stain-color-chip-details {
		display: flex;
		justify-content: center;
		flex-direction: column;
	}

	.good-paring .welcoming-atmosphere .stain-chip-description {
		flex-direction: column;
		padding: 10px;
	}

	.good-paring .welcoming-atmosphere .left {
		display: flex;
		justify-content: center;
		padding-bottom: 10px;
	}
	
	.good-paring .set-the-tone .stain-chip-description {
		flex-direction: column-reverse;
	}
	
	.good-paring .set-the-tone .left {
		padding: 10px;
	}
	
	.good-paring .set-the-tone .right {
		display: flex;
		justify-content: center;
	}
}


/* Best In Performance */
.best-in-performance {
	background: #F6F5F0;
}

.best-in-performance .desktop-video {
	max-height: 399px;
    max-width: 710px;
}

.best-in-performance .how-to-videos {
	font-family: var(--behr-body-and-label-font);
    font-weight: var(--behr-bold-600);
}

.mobile-video iframe {
	min-height: 210px;
    min-width: 374px;
}

.best-in-performance .how-to-videos {
	min-width: 412px;
}

@media (max-width: 991px) {
	.product-line-listing__item {
	    width: 50% !important;
	}	
	
	.best-in-performance .how-to-videos {
		min-width: 343px;
	}
	
	.product-line-listing__wrapper h2 {
	    font-size: 30px !important;
	    line-height: 36px !important;
	}
	
	.product-line-listing__wrapper p {
	    font-size: 18px !important;
	    line-height: 22px !important;
	}
	
	.product-line-listing__item-title {
		font-size: 18px !important;
		line-height: 18px !important;
	}
}

img {
    max-width: 100%;
}

.section-bring-color-to-life  .col-12.col-lg-6.pr-0.d-flex.justify-content-center.align-items-center.fifty-fifty-image-text__left.image-text-left-bring-color-to-life,
.section-bring-colour-to-life  .col-12.col-lg-6.pr-0.d-flex.justify-content-center.align-items-center.fifty-fifty-image-text__left.image-text-left-bring-colour-to-life,
.section-donnez-vie-à-la-couleur  .col-12.col-lg-6.pr-0.d-flex.justify-content-center.align-items-center.fifty-fifty-image-text__left.image-text-left-donnez-vie-à-la-couleur {
    padding: 0px;
}

.page-header.no-top-image h1 {
	font-weight: var(--behr-normal);
	font-size: 45px !important;
	line-height: 54px !important;
	padding-top: 60px !important;
}

.page-header.no-top-image span {
	font-weight: var(--behr-normal);
	font-size: 18px !important;
	line-height: 22px !important;
}

@media (max-width: 991px) {
	.page-header.no-top-image h1 {
		font-weight: var(--behr-normal);
		font-size: 36px !important;
		line-height: 43px !important;
	}
	
	.page-header.no-top-image span {
		font-weight: var(--behr-normal);
		font-size: 18px !important;
		line-height: 22px !important;
	}
}

.section-2023-exterior-stain-color-of-the-year {
	background: var(--behr-beige);
	padding-bottom: 60px !important;
}

.section-2023-exterior-stain-color-of-the-year .content_desktop-2023-exterior-stain-color-of-the-year h2 {
	font-size: 24px;
    line-height: 28.8px;
}


.section-2023-exterior-stain-color-of-the-year .content_desktop-2023-exterior-stain-color-of-the-year p {
	font-size: 16px;
    line-height: 16px;
}

.section-2023-exterior-stain-color-of-the-year .image-text-left-2023-exterior-stain-color-of-the-year {
	padding: 0px;
}

.section-2023-exterior-stain-color-of-the-year .content_desktop-2023-exterior-stain-color-of-the-year {
	padding-left: 60px;
}

.section-2023-exterior-stain-color-of-the-year .content_desktop-2023-exterior-stain-color-of-the-year .primary-button-orange {
	min-width: 218px;
}

.section-2023-exterior-stain-color-of-the-year .content_mobile-2023-exterior-stain-color-of-the-year h2 {
	font-size: 24px;
    line-height: 28.8px;
}


.section-2023-exterior-stain-color-of-the-year .content_mobile-2023-exterior-stain-color-of-the-year p {
	font-size: 16px;
    line-height: 20px;
}

.section-2023-exterior-stain-color-of-the-year .content_mobile-2023-exterior-stain-color-of-the-year .primary-button-orange {
	width: 100%;
    max-width: 343px;
}


.product-available-sheens .col-12.text-center h2,
.product-available-sheens .col-12.text-center p {
	text-align: left;
}

.product-available-sheens .row.available-sheen-list.item-container .col-12.available-sheens-list-desktop {
	justify-content: left !important;
}

@media (max-width: 991px) {
	.product-available-sheens .available-sheens-list-mobile .col-12 {
		flex: 0 0 50%;
		max-width: 50%;
	}
	
	.product-available-sheens .available-sheens-list-mobile {
		justify-content: start !important;
	}
}

.solid-color-chip-details, 
.semi-transparent-color-chip-details,
.color-chip-details {
	cursor: pointer;
}


/** Color Detail Drawer **/

#semi-transparent-color-modal .modal-dialog {
	position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;	
    margin-top: 0;
}  

#semi-transparent-color-modal .modal-dialog .modal-content {
	border-radius: 0;
    border: 0;
    -webkit-box-shadow: -12px 0 38px -14px rgb(0 0 0 / 25%);
    -moz-box-shadow: -12px 0 38px -14px rgba(0, 0, 0, 0.25);
    box-shadow: -12px 0 38px -14px rgb(0 0 0 / 25%);
    background-clip: padding-box;
    height: 100vh;
    overflow-x: hidden;
}

#semi-transparent-color-modal .modal-dialog {
	max-width: 500px;
}

#semi-transparent-color-modal .modal-header {
	border-bottom: 1px solid black !important;
}


#semi-transparent-color-modal .modal-header {
	border-bottom: 1px solid black !important;
}


#semi-transparent-color-modal .modal-header .close span, 
#semi-transparent-color-modal .modal-header .close span:hover {
	font-size: 30px;
	line-height: 50px;
	font-weight: var(--behr-bold);
	color: #465058 !important;
}

#stain-color-modal .modal-dialog {
	position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;	
    margin-top: 0;
}  

#stain-color-modal .modal-dialog .modal-content {
	border-radius: 0;
    border: 0;
    -webkit-box-shadow: -12px 0 38px -14px rgb(0 0 0 / 25%);
    -moz-box-shadow: -12px 0 38px -14px rgba(0, 0, 0, 0.25);
    box-shadow: -12px 0 38px -14px rgb(0 0 0 / 25%);
    background-clip: padding-box;
    height: 100vh;
    overflow-x: hidden;
}

#stain-color-modal .modal-dialog {
	max-width: 500px;
}

#stain-color-modal .modal-header {
	border-bottom: 1px solid black !important;
}


#stain-color-modal .modal-header {
	border-bottom: 1px solid black !important;
}


#stain-color-modal .modal-header .close span, 
#stain-color-modal .modal-header .close span:hover {
	font-size: 30px;
	line-height: 50px;
	font-weight: var(--behr-bold);
	color: #465058 !important;
}

/* Coty Available Sheens */
.coty-available-sheens {
	background: var(--behr-beige);
}
.coty-available-sheens h2 {
	font-weight: var(--behr-normal);
	font-size: 45px;
	line-height: 54px;
}

.coty-available-sheens p {
	font-weight: var(--behr-normal);
	font-size: 18px;
	line-height: 22px;
}

.content-area {
	padding-right: 20%;
}
.can-image-position {
	position: absolute;
	bottom: -10%;
	left: -12%;
}
@media (max-width:991px) {
	.coty-available-sheens h2 {
		font-weight: var(--behr-normal);
		font-size: 36px;
		line-height: 44px;
	}

	.order-0 {
		order: 1;
		padding-bottom: 50px;
	}
	.order-1 {
		order: 0;
	}
	.can-image-position {
		position: absolute;
		bottom: -15%;
		left: 10%;
	}
	.content-area {
		padding-right: 0%;
		margin-top: 7%;
	}
}
@media (min-width:768px) and (max-width:1330px) {
	.can-image-position img {
		width: 70%;
	}
}
@media (min-width:575px) and (max-width:767px) {
	.can-image-position img {
		width: 70%;
	}
}
@media (max-width:574px) {
	.can-image-position img {
		width: 30%;
	}
}
@media (min-width:1441px) {
	.coty-available-sheens .custom-container-coty-23 {
		max-width: 1190px !important;
		margin-right: auto;
		margin-left: auto;
		padding-left: 0px;
		padding-right: 0px;
		width: 100%;
		-webkit-transition: all 1s ease-in;
		-moz-transition: all 1s ease-in;
		-ms-transition: all 1s ease-in;
		-o-transition: all 1s ease-in;
		transition: all 1s ease-in;
	}
}
@media (min-width: 1400px) and (max-width: 1440px) {
	.custom-container-coty-23 {
		padding-left: 120px!important;
	}
}
@media (min-width: 1331px) and (max-width: 1399px) {
	.custom-container-coty-23 {
		padding-left: 80px!important;
	}
}
@media (min-width: 1251px) and (max-width: 1330px) {
	.custom-container-coty-23 {
		padding-left: 120px!important;
	}
}
@media (min-width: 1200px) and (max-width: 1250px) {
	.custom-container-coty-23 {
		padding-left: 65px!important;
	}
}
@media (min-width: 992px) and (max-width: 1199px) {
    .custom-container-coty-23 {
		padding-left: 56px!important;
    }
}
    
@media (min-width: 768px) and (max-width: 991px) {
    .custom-container-coty-23 {
		padding-left: 29px!important;
    }
}
@media (max-width: 767px) {
	.custom-container-coty-23 {
		padding-left: 18px!important;
	}
}