
.content-columns-50.lm-cat-columns{ 

		display: grid;
		grid-template-columns: 1fr 1fr;	
	
	}

#cat-heading-1 { 
display: grid; 
grid-template-columns:  1fr auto;
}	
.cat-heading-2 { 
display: none; 
height: 60px;
height: 3.75rem;
}
#cat-heading-3 { 
display: none; 
}
#cat-heading-1 h1 {
margin-bottom: 12px;
}
#cat-heading-3 h1 {
margin-top: -10px;
margin-bottom: 12px;
}

#cat-heading-1 h1,
#cat-heading-3 h1
 {
word-break: break-word;
line-height: 2.2rem;
}


#cat-right-column {
container-type: inline-size;	
container-name: cat-right-column;		
}

@container cat-right-column (max-width: 860px) {
.full-width-button {
width: 100%;
text-align: center;
}	
	
}

.ruler1000 { display: none; }		
.ruler2000 { display: block; }

@media only screen and (max-width: 680px)
{
.ruler1000 { display: block; }		
.ruler2000 { display: none; }
}

@media only screen and (min-width: 901px) and (max-width: 1280px)
{
.ruler1000 { display: block; }		
.ruler2000 { display: none; }	
}

.ruler1000 text.d.lm-caption,
.ruler2000 text.d.lm-caption {
	font-size: var(--lm-font-size-12px);
}

@media only screen and (min-width: 0px) {
	
		.content-columns-50.lm-cat-columns {
		grid-template-columns: 100%;
		}
}

@media only screen and (min-width: 901px) {	

		.content-columns-50.lm-cat-columns{
		grid-template-columns: repeat(2, calc(50% - 20px));
		}

		#cat-heading-1 { display: none; }	
		.cat-heading-2 { 
		display: block;
		}
		#cat-heading-3 { display: none; }


}

	
	
@media screen and (min-width: 1281px) {
	
		.content-columns-50.lm-cat-columns {
		grid-template-columns: auto calc(34% - 20px);
/*		padding-top: 60px;	*/
		padding-top: 20px;
		}
		
		.container, main {
		max-width: 1920px !important;		
		}
		
		#cat-heading-1 { display: none; }	
		.cat-heading-2 { display: none; }	
		#cat-heading-3 { 
		display: grid; 
		grid-template-columns:  1fr auto;
		}


		
}

	
	@media screen and (min-width: 1620px) {
	    .content-columns-50.lm-cat-columns{
		grid-template-columns: auto 480px;
		}			
	}
	
	@media screen and (min-width: 1920px) {
		.container {
		max-width: 1920px !important;
		}
	} 
	
	




 /** ABOUT THIS DESIGN SECTION */

#atd { text-align: left; }

@media only screen and (min-width: 680px) {
	
#atd { text-align: center; }	
	
}


.content-container.narrow.about-this-design {
	width: 760px;
}

@media only screen and (max-width: 680px) {
.lm-cat-columns .lm-mobile-full-width  {
margin-left: -20px;
width: 100vw;	
}
}

.about-this-design button {
	border: 0;
	margin: 0;
	padding: 0;
	background: var(--lm-lightslate-t85); 
	width: 100%;
	height: 100%;
	padding:  15px 20px;	
	text-align: left;
	cursor: pointer;
	transition: 0.5s ease;	
	color: var(--lm-charcoal-s15);	
}

.about-this-design h3 {
	margin-bottom: 0;
}

.about-this-design h3 svg {
			display: inline-block;
			height: 12px;
			float: right;
			margin-top: 10px;
			fill: var(--lm-charcoal-s15);		
			transform: rotateX(180deg);
			transition: .3s ease-in-out;
}

.about-this-design .hidden-atd h3 svg {
	transform: rotateX(0);
}


.content-atd {
display: grid;
grid-template-rows: 0fr;
transition: all 0.3s ease;
background: var(--lm-lightslate-t85); 
opacity: 0;
}


.about-this-design .show-atd > .content-atd {
grid-template-rows: 1fr;
opacity: 1;
}

.inner-content-atd {
	overflow: hidden;
}

.inner-content-padding-atd,
#closed-area-data {
	padding: 0 20px 20px 20px;
}

@media (hover: hover) {
.about-this-design button:hover {
background: var(--lm-lightslate-t75); 
}
}

.about-this-design button:active {
background: var(--lm-lightslate); 
}

.hide-content {
display: none;	
}

 
@supports (content-visibility: hidden) {
.hide-content {		
    content-visibility: hidden;
    display: inherit;		
}
}



 /** INFORMATION BUTTON */

.lm-info {
	vertical-align: middle;

}

.lm-info svg {
	display: inline-block;
	fill: var(--lm-dark-blue);
	cursor: pointer;
	transition: all 0.3s ease;
}

@media(hover: hover) {
.lm-info svg:hover {	
	fill: var(--lm-dark-blue-s15);	
}
}

.lm-info button {

	margin: 0;
	padding: 0;
	border: 0;
	background: #FFF;
	width: 24px;
	height: 24px;
	border-radius: 12px;
}
 
  /** TOGGLE SWITCH */

 
.switch-grid { 
display: grid;
grid-gap: 10px;
grid-template-columns: auto 48px;
justify-content: end;
}


 .switch {
  position: relative;
  display: inline-block;
  width: 48px;
  height: 24px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--lm-lightslate); 
  transition: .3s;
  border-radius: 24px;
}


.slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 4px;
  bottom: 4px;
  background-color: white;
   -webkit-transition: .3s; 
  transition: .3s;
  border-radius: 50%;
}

input:checked + .slider {
  background-color: var(--lm-dark-blue);
}

input:focus-visible + .slider {
outline-color: var(--lm-dark-blue);
outline-offset: 3px;
outline-style: auto;
outline-width: 1px;
transition: all 0.1s ease;
}

input:checked + .slider:before {
	  -webkit-transform: translateX(24px);
  transform: translateX(24px);
}


 /** Previoudly viewed designs   */


#previously-viewed-designs {
visibility: hidden;	
}

#prev_thumbs1, #related-thumbs {
list-style-type: none;
max-height: 254px;
padding: 0;
margin: 0 0 6px 0;
}

#prev_thumbs1 li, #related-thumbs li {
display: flex;
width: 159px;
padding: 0;
margin: 0 0 6px 0;
}

@media only screen and (max-width: 359px) {
#prev_thumbs1 li, #related-thumbs li  {
width: 138px;
}	
}

.lm-button-default.samplebutton {
	background-color: var(--lm-charcoal);
}
@media(hover: hover) {
.lm-button-default.samplebutton:hover {
	background-color: var(--lm-charcoal-s15);
}
}
.lm-button-default.samplebutton:active {
	background-color: var(--lm-charcoal-s25);
}

#sample_colours_list {
margin: 0 0 6px 0;
padding: 0;	
list-style-type: none;
}

#sample_colours_list li {
	max-width: 42px;
	max-height: 42px;
	display: inline-block;
	padding: 6px;
}

#sample_colours_list img {
	border: 1px solid var(--lm-charcoal);
	max-width: 30px;

}

@media only screen and (max-width: 1280px) {
.lm-heading-xl.lm-quatro-medium {
	margin-top: 3px;
}
}