/* RESET */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;500;600;700;900&display=swap');

::-webkit-input-placeholder{ color:#fff;}


html {height:100%;}

html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; }
ul,ol { list-style: none; }
img { border: none; }
#no_javascript { border-width: 1px; border-color: #E9E5AC; border-style: solid; padding: 10px 40px; background-color: #F9F4B8;}
#no_javascript p {margin: 0; }


@font-face {
font-family: "frankGothicIt";
src: url("https://resultclothing.com/fonts/FRABKIT.TTF");
}

/* BG IMAGE */

body { }
#bgimage { 
	position:fixed; 
	z-index:-1; 
	top:0; 
	left:0; 
	float: left; 
}

#bgimage img { 
	height:100%; 
	width:100%; 
	position:absolute; 
	z-index: -1; 
}

/*Below added by EB to allow site to work in IE11 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	#bgImage {
		background: url('https://img.resultclothing.net/misc/R405F.jpg') no-repeat; background-size:114%; 
	}

	input[type=text]::-ms-clear {  
		display: none; width : 0; height: 0; 
	}
	input[type=text]::-ms-reveal {  
		display: none;
		width : 0; 
		height: 0; 
	}
}

#myCookieConsent {
    z-index: 999;
    min-height: 20px;
    padding: 10px 20px;
    background: rgba(0,0,0,0.6);
    overflow: hidden;
    position: fixed;
    color: #FFF;
    bottom: 0px;
    right: 10px;
    display: none;
    left: 0;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
}
#myCookieConsent div {
    padding: 5px 0 0;
}
#myCookieConsent a {
    color: #ffba55;
    display: inline-block;
    padding: 0 10px;
}

#myCookieConsent p {
	color:#fff;
	font-size:14px;
	font-weight:500;
}

#myCookieConsent a:hover {
	color: #fda016;
}
#myCookieConsent a#cookieButton {
    display: inline-block;
    color: #000000;
    font-size: 1.1em;
	background: #ffba55;
    text-decoration: none;
    cursor: pointer;
    padding: 2px 20px;
    float: right;
    
}
#myCookieConsent a#cookieButton:hover {
    background: #fda016;
	color: #000;
}

label {
	line-height: normal;
}

.cookietable {
  font-family: font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, Roboto, sans-serif;

  border-collapse: collapse;
  max-width: 90%;
  width: 90%;
  font-size:14px;
}

.cookietable td, .cookietable th {
  border: 1px solid #ddd;
  padding: 8px;
}

.cookietable tr:nth-child(even){background-color: #f2f2f2;}

.cookietable th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #9f9f9f;
  color: white;
  font-weight:600;
}
/*Cookie Consent End*/

/* video BG */

/* Style the video: 100% width and height to cover the entire window */
.homepage-video {
  position: fixed;
  right: 0;
  /*bottom: 5%;*/
  min-width: 100%;
  height:100vh;
}

/* Add some content at the bottom of the video/page */
.vidcontent {
  position: fixed;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #f1f1f1;
  width: 100%;
 padding: 10px 20px 43px 20px;
}

/* Style the button used to pause/play the video */
#myBtn {
  width: 200px;
  font-size: 18px;
  padding: 10px;
  border: none;
  background: #000;
  color: #fff;
  cursor: pointer;
}

#myBtn:hover {
  background: #ddd;
  color: black;
}

/* end video BG */


code { 
	display:block; 
	background-color:white; 
	padding:5px; 
	border:solid 1px #c0c0c0;
}

/* LAYOUT */
.clear { 
	clear: both; 
	height:1px; 
}

.clearer, .spacer { 
	clear: both; 
	display: block; 
	margin: 0; 
	padding: 0; 
	height: 0; 
	line-height: 1px; 
	font-size: 1px;
	width: 100%;
}

.left { /* environment.php */
	float: left; 
	text-align:left;
	margin-top: 30px;
}

.right { /* environment.php */
	float: right; 
	text-align:left;
	margin-top: 30px;
}

.divider { /* tech_guide */
	background: white url(https://img.resultclothing.net/misc/divider.jpg) top left repeat-x; 
}

/* GRID */
.column { 
	float: left; 
}
/*NB 23.11.21 PRINTABLE SPEC SHEET BUTTON */
.print_link {
	/*position: absolute 
	right:12em; 
	top:6.5em; */
	position: relative;
	width:5em;
	float: right;
	margin-top: 4px;
}
.print_link:hover { 
	-webkit-filter: invert(1);
  filter: invert(1);
}
/* end of printable spec sheet button */

#redLogo {	width:95px;	}

.grid2col, .grid2colb, .grid3col, .grid4col, .grid5col, .grid6col { 
	width: 100%; 
}

.grid2colh { 
	overflow:hidden; 
}

.grid2col .column { 
	width: 50%; 
}

.grid2colb-prod .column { /* products.php */
	width: 44%; 
	margin-left:4%; 
}

.new-colour {
	position: absolute; 
	color: #fff; 
	background: #0a76c1; 
	border-radius: 50%; 
	width: 27px; 
	height: 27px; 
	line-height: 25px; 
	font-weight: 600; 
	right: 7px;
	top: 3px;
	padding: 4px;
}
/* NB - added this long version becuase french word for new was longer and didn't fit in circle */
.new-colour.long {
	width: auto;
	padding: 0 4px;
	font-size: 11px;
	height: auto;
	line-height: 21px;
	border-radius: 5px;
}

.feature-header {
	background: none; 
	padding-left: 0px; 
	line-height: 30px; 
	font-weight: bold;
	border-bottom: #CCCCCC dotted 1px; 
	margin-bottom: 5px;
}
.feature-item {
	float: none; 
	margin: 0;
	padding: 3px 0px 3px 12px; 
	line-height: 20px;
}

/* product page where product is not active */
.not-found {
	padding: 10rem 2rem;
	text-align: center;
}
.not-found h1 {
	font-size: 30px;
	font-weight: 500;
	margin-bottom: 2rem;
}
.not-found p {
	font-size: 18px;
	margin: 1rem auto;
}
.not-found a {
	background: #383232;
	color: #fff;
	padding: 14px 22px;
	font-size: 18px;
	display: inline-block;
	margin: 2rem auto;
	text-decoration: none;
}
.not-found a:hover {
	text-decoration: none;
}

.lastOne{
    float: left;
    width:45%;
}

.prod-logos {
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	display: -ms-flexbox;      /* TWEENER - IE 10 */
	display: -webkit-flex;     /* NEW - Chrome */
	display: flex;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
	gap: 1rem;
	-webkit-align-items: flex-start;
	align-items: center;
	width: 100%;
	flex-wrap: wrap;
	margin: 1rem 0;
}
.prod-logo {
	height: 73px;
	max-width: 200px;
	width: auto;
}
.prod-logo img {
	width: 100%;
	height: 100%;
}
/* page that handles product codes being passed in the URL instead of product IDs */
.suggested-products > .inner {
	width: 90%;
	margin: 0 auto;
	max-width: 1200px;
	padding: 2rem 0;
	margin-bottom: 1rem;
}
.suggested-products .title {
	font-size: 28px;
	font-weight: 600;
	margin-bottom: 2rem;
	text-align: center;
	line-height: normal;
}
.suggested-products .sub-title {
	font-size: 18px;
	margin-bottom: 1.5rem;
	text-align: center;
}
.suggested-products .product {
	max-width: 300px;
	width: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	color: #08c !important;
	margin-bottom: 3rem;
}
.suggested-products img {
	width: 100%;
}
.suggested-products .prod-code {
	font-size: 16px;
	font-weight: bold;
}
.suggested-products .prod-name {
	font-size: 15px;
	font-weight: 500;
	margin-bottom: 0.5rem;
}
.suggested-products .browse-btn { text-align: center; }
.suggested-products .browse-btn a {
	background: #383232;
    color: #fff;
    padding: 14px 22px;
    font-size: 18px;
    display: inline-block;
}
/* grid2cold being used by browsecategory, search_results and newproducts */
.grid2cold { 
	width: 100%; 
	margin: 0 10px; 
	margin-left: 0;
}

.grid2cold.cat-products {
	width: 95%;
	margin: 1rem auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 1rem;
}
.grid2cold.cat-products .column {
	width: 100%;
	padding: 0;
}

.grid2cold .column { 
	width: 33%; 
	padding: 0 2px;

}

.grid2cold .column.last { 
	float: right; 
}

.grid2cold .grid2col { 

}

.grid2cold .grid2col .column { 

}

.grid2cold .grid2col .column.last { 
	width: 64%; 
	float: right; 
}

.grid2cold .site-logo {
	width: 65px;
	display: block;
	margin-bottom: 0.25rem;
}

.prod-instruction {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.25rem;
	margin: 0.25rem;
}
.prod-instruction img {
	width: 30px;
}

/* below is used in categories.php and browsecategory.php */

/* new categories styles NB 18.05.23 */
.cat-page .wrapper {
	display: grid;
	grid-template-columns: repeat(auto-fill, 450px);
	column-gap: 3rem;
	row-gap: 2rem;
	margin-bottom: 2rem;
}
.cat-page .cat-box {
	height: 310px;
}
.cat-box a:hover {
	text-decoration: none;
}
.cat-box .cat-wrapper {
	position: relative;
	background: rgba(0,0,0,0.2);
	width: 100%;
	height: 100%;
}
.cat-box .cat-img {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: -1;
}
.cat-img img {
	width: 100%;
	display: block;
}
.cat-box .cat-txt {
	margin-left: 15px;
	width: 55%;
	height: 100%;
	display: flex;
	flex-direction: column;
}
.cat-box.lang-view .cat-txt {
	width: 80%;
}
.cat-box.lang-view .cat-txt p {
	font-size: 14px;
}
.cat-box a {
	text-decoration: none;
}
.cat-box sup {
	vertical-align: baseline;
 	position: relative;
  	top: -0.4em;
}

.cat-txt h4 {
	margin: 1.5rem 0;
	margin-bottom: 1rem;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
}
.cat-txt p {
	font-size: 15px;
	color: #fff;
}

._cat_style2 p {
	color:#fff;
}


.grid3col .column { 
	width: 30%; padding:15px; 
}

.column.first, .column.last { 
	margin-left: 0 !important; 
}

.column.last { 
	float: right !important; 
}

.margin10 { 
	width:95%; 
	margin:0 auto;
}

.cat_margin { 
	position: relative;
	top:-56px; /* to counter act the #content */
}


/* TYPE */

body { 
	font: 12px/18px "open sans", "Lucida Sans Unicode", Arial, Verdana, sans-serif; 
	color: #000000; 
}

a { 
	color: #08c; 
}

a:link, a:visited, a:active { 
	text-decoration: none; 
}

a:hover { 
	text-decoration: underline; 
}

strong, b { 
	font-weight: bold; 
}

em, i { 
	font-style: italic; 
}

h1 { 
	font-weight: bold; 
	font-size: 30px; 
	line-height: 36px; 
	margin-bottom: 18px; 
	color: #000000; 
}

h2 { 
	font-weight: bold; 
	font-size: 70px; 
	line-height: 70px; 
	margin-bottom: 0px; 
	color: #999999;  
}

h3 { 
	font-weight: bold; 
	font-size: 28px; 
	line-height: 29px; 
	margin-bottom: 8px; 
	/*text-shadow:0 1px 1px white;*/  
	color: #262626;
}

#orange {
	color: #ff8100;
    font-size: 21px;
    line-height: 21px;
    margin-bottom: 3px;
}

h4 { 
	font-weight: bold; 
	font-size: 10px; 
	line-height: 18px; 
}

/* this is the code for the 'new size', 'new colour' and 'new product' */
.new { display: block; 
		width: auto;
		padding: 0 5px;
		margin-right: 5px; 
       height:16px; 
       background: #0a76c1;
       color: #fff;
       font-size: 10px;
       text-align: center;      
       overflow: hidden; float: left;
       border-radius: 4px;
       -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
       line-height: 17px;
}

/* being used in product.php and newproducts.php  "new for [year]"*/
.big_new { 
	position: absolute; 
	display: block; 
	width: 95px; 
	height:95px; 
	top: 13px; 
	right:80px; 
	background: url(https://img.resultclothing.net/misc/big_new.png) right top no-repeat; 
	z-index: 1;
}

@font-face { 
	font-family: 'Courier'; src: url('fonts/ufonts.com_courier.ttf');
}

@font-face { 
	font-family: 'Joolygood-sansbasic'; src: url('fonts/JollyGoodSans-Basic-webfont.ttf');
}

/* transitioning to recycled logo */
.rec-img-right {
	right: 3px;
	top: 3px;
	position: absolute;
	max-width: 160px;
}
.rec-img-right img {
	width: 100%;
}
.rec-img {
	position: absolute;
    top: 20px;
    left: 0;
    max-width: 140px;
	z-index: 1;
}
.rec-img img {
	width: 100%;
}
.cert-recycled {
	max-width: 180px;
	margin-right: auto;
}
.cert-recycled img {
	width: 100%;
}

/* POI label sits over the image on the product page*/
.poi-label, .poi-label-green{ 
	position: absolute; 
	top: 7%; 
	left: 15%; 
	width: 95px; 
	height:95px; 
	background: #fff; 
	z-index: 1; 
	border-radius:5px; 
	transform:rotate(20deg); 
	border:1px solid #f1f1f1; 
	box-shadow: 5px 5px 2px rgba(136,136,136,0.28); 
}

.poi-label-green {
	background: #3CB371;
	border: 1px solid #35a969;
    box-shadow: 5px 5px 2px rgba(136,136,136,0.28);	
}

.poi-label span {   
	width: 8px;
    border: 1px solid #f1f1f1;
    height: 8px;
    border-radius: 10px;
    position: absolute;
    top: 8px;
    left: 44px;
    background: #060606;
	}

.poi-label-green span{
	width: 8px;
    border: 1px solid #f1f1f1;
    height: 8px;
    border-radius: 10px;
    position: absolute;
    top: 5px;
    left: 5px;
	background:#262626;
}

.poi-label h2, .poi-label-green h2 {
	font-size:18px; 
	line-height:12px; 
	text-align:center; 
	margin-top:20px; 
	color:#333; 
	font-family:'Courier', Courier !important;
}

.poi-label-green h2 {
	color:#fff;
	margin-top:6px;
}

.poi-label-green.lang h2 {
	font-size: 14px !important;
}

.poi-label2{ 
	float:left;
	margin-left:12px;
	width: 95px; 
	height:95px; 
	background: #fff; 
	z-index: 1; 
	border-radius:5px; 
	transform:rotate(-21deg); 
	border:1px solid #f1f1f1; 
	box-shadow: -5px 5px 10px rgba(136,136,136,0.28); 
}

.poi-label2 span {   
	width: 8px;
    border: 1px solid #f1f1f1;
    height: 8px;
    border-radius: 10px;
    position: absolute;
    top: 8px;
    left: 44px;
    background: #060606;}



.poi-label2 h2 {
	font-size:15px; 
	line-height:18px; 
	text-align:center; 
	margin-top:20px; 
	color:#333; 
	font-family:'Courier',Courier !important;
}

/* BUTTONS */

/* FORMS */
#searchForm{	/* navigation.php */
	display: flex;
	width: 100%;
	margin: auto;
}

#searchForm .small_button {
	padding-left: 3px; 
    font-size:10px; 
     background:url(https://img.resultclothing.net/misc/small_button_left.png) top left no-repeat; 
}

input { 
	resize:none; 
	font:10px "Lucida Grande",Lucida,Verdana,sans-serif; 
	padding: 0; 
	margin:0; 
	border:none; 
	background: none;
	}

input.field,textarea.textarea { 
	-moz-border-radius:3px; 
	-webkit-border-radius:3px; 
	resize:none; font:10px "Lucida Grande",Lucida,Verdana,sans-serif; 
	padding: 3px 5px 2px 3px; 
	margin:0; 
	border-top:1px solid #8e8e8e; 
	border-left:1px solid #8e8e8e; 
	border-bottom:1px solid #e1e1e1; 
	border-right:1px solid #e1e1e1; 
	background:#fefefe; 
}

input.search { 
	border-top:1px solid #404040; 
	border-left:1px solid #404040; 
	border-bottom:1px solid #404040; 
	border-right:1px solid #404040; 
	background:#666; color: white; 
	margin-right: 10px; 
}

.contactSub {
	padding: 5px 10px;
    background: #ed1e24;
    color: #fff;
}

/* contact us error messages */
#contactus .error
{
   font-family: Verdana, Arial, sans-serif; 
   font-size: 1em;
   color: #fff;
   background-color : #EF3133;
}


#content {
	clear: both;
	position:relative;
	margin-top: 56px;
}

/* BREADCRUMBS */

#breadcrumbs { 
	border-bottom: #CCC solid 1px; 
	background: #f3f3f3; 
	/*padding: 0px 5px 0px; */
	/*padding: 56px 5px 0px; */
	margin: 0px; 
	list-style: none; 
	height: 39px;	
}
#breadcrumbs li { 
	float: left; 
	background-image: url("https://img.resultclothing.net/misc/breadcrumb_bg.jpg"); 
	background-repeat: no-repeat; 
	background-position: 0 1px; 
	padding-left: 25px; 
	margin-right: 25px; 
	height:39px; 
}

#breadcrumbs li.breadcrumb_home { 
	padding-left: 1.8%; 
	margin-right: 10px; 
	background: none; 
}



#breadcrumbs li a { 
	font: normal 13px/38px Arial, Verdana, sans-serif; 
}

#breadcrumbs #home { 
	position: relative; 
	top: 10px; 
	left: 0; 
	width: 20px; 
	height: 16px; 
	background-image: url("https://img.resultclothing.net/misc/home.png"); 
	background-repeat: no-repeat; 
	background-position: 0 0; 
	z-index: 2; 
}

#breadcrumbs #home span {
	display: block; 
	text-indent: -5000px; 
}

#breadcrumbs #home span a { 
	display: block; 
	width: 16px; 
	height: 16px; 
}

/* New homepage design - NB 27.07.22 */
.index-container {
	clear: both;
	position: relative;
	margin-top: 56px;
	font-family: 'Poppins', 'Open Sans', sans-serif;
}
.welcome-section {
	/* background: linear-gradient(to bottom right, rgb(226, 29, 29), rgb(232, 74, 74));*/
	/*background: #383232;*/
	background: #292424;
	padding: 0;
}
.welcome {
	display: flex;
	align-items: center;
}
.welcome > * {
	width: 50%;
}
.welcome-text {
	color: #fff;
	text-align: center;
	line-height: normal;
}
.welcome-text > * {
	padding: 0 2rem;
}
.welcome-text h1 {
	font-weight: bold;
	font-size: 36px;
	text-transform: uppercase;
	margin-bottom: 2rem;
	color: #fff;
}
.welcome-sub {
	font-size: 25px;
	font-weight: 300;
	text-transform: uppercase;
	margin: 1rem;
	color: #fff;
}
.welcome-small {
	font-size: 14px;
	margin-top: 1rem;
	color: #fff;
}
.welcome-vid video { width: 100%; }
.cat-title h2 {
	text-align: center;
	color: #fff;
	font-size: 18px !important;
	font-weight: normal;
}
.pop-cat a:hover h2 {
	text-decoration: underline;
}
.cat-title i {
	font-size: 10px;
}
.cat-title i:first-child {
	margin-left: 1rem;
}
.home-boxes {
	display: flex;
	justify-content: center;
	gap: 15%;
	margin-top: 2rem;
}
.home-box {
	width: 250px;
	height: 250px;
}
.home-box a {
	display: block;
	width: 100%;
	height: 100%;
}
.box-img {
	height: 100%;
	width: 100%;
	position: relative;
	text-align: center;
}
.box-img img {
	width: 100%;
	height: 100%;
}

@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

.box-img video {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	visibility: hidden;
	opacity: 0;
	animation: fadeIn 2s;
}
.box-title {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 30%;
	padding-top: 8%;
	background-image: linear-gradient(rgb(0,0,0,0.4), rgb(0,0,0));
	/*background-image: linear-gradient(rgb(0,0,0,0), rgb(0,0,0));*/
}
.box-title h2 {
	font-size: 16px;
	color: #fff;
	/*margin-top: 1.5rem;*/
	/*margin: 2rem auto 3.5rem;*/
	line-height: 0;
}
.brand-spotlight {
	display: flex;
	align-items: center;
}
.brand-img {
	flex: 5;
}
.brand-img img {
	width: 100%;
}
.brand-text {
	flex: 6;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.brand-text .wrapper {
	width: 88%;
	margin: 0 auto;
}
.brand-text h2 {
	font-size: 40px;
	color: #000;
	font-weight: 400;
	margin-bottom: 1.5rem;
}
.brand-text p {
	font-size: 26px;
	margin-bottom: 1.5rem;
	line-height: 30px;
}
.brand-text-small {
	font-size: 16px !important;
	margin-bottom: 1.5rem;
}
.brand-text a {
	border: 1px solid #000;
	color: #000;
	font-size: 16px;
	font-weight: 600;
	text-transform: uppercase;
	display: inline-block;
	padding: 12px 22px;
}

/* New Homepage - NB 15.08.22 */
.homepage-videos {
	display: flex;
	height: 670px;
	/*padding: 2rem;*/
}
.welcome-vid-main {
	width: 65%;
	height: 100%;
}
.welcome-vids {
	width: 35%;
	padding: 1rem 1rem 0.5rem;
}
.welcome-vids > .wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	gap: 1rem;
	margin: 0 auto;
}
.welcome-vid-main video {
	width: 100%;
	height: 100%;
	object-fit: fill;
}
.welcome-vid-main a {
	display: block;
	width: 100%;
	height: 100%;
}

.vids-row {
	width: 100%;
	display: flex;
	gap: 1rem;	
	height: 48%;
}
.vids-row > * {
	width: 50%;
	height: 100%;
}
.box-video {
	width: 100%;
	height: 100%;
	position: relative;
}
.box-video img {
	width: 100%;
	height: 100%;
}
.box-video video {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: fill;
	visibility: hidden;
	opacity: 0;
}
.box-video .box-title {
	text-align: center;
	height: 10%;
}
/* img carousel added 31.03.23 */
.homepage-videos.carousel-videos {
	height: auto !important;
	align-items: center;
}
.carousel-videos .carousel {
	flex: 0 0 64%;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
}
.carousel .slider {
	width: 100%;
	overflow: hidden;
	margin: auto;
	position: relative;
}
.carousel .slider ul {
	width: 100%;
	list-style: none;
	display: flex;
	align-items: center;
	-webkit-transition: 1s;
	-moz-transition: 1s;
	-ms-transition: 1s;
	-o-transition: 1s;
	transition: 1s;
}
.carousel .slider ul li {
	width: 100%;
}
.carousel .slider ul li img {
	width: 100%;
	height: 100%;
	display: block;
}
.slider__btns {
	width: fit-content;
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	display: flex;
	justify-content: center;
	gap: 10px;
	bottom: 24px;
}
.carousel .slider input[type="radio"] {
	display: none;
}
.slider__btns label {
	border: 2px solid #fff;
	border-radius: 10px;
	cursor: pointer;
	padding: 6px;
	transition: 1s all ease;
	display: inline-block;
	width: auto;
}
.slider__btns label.active {
	background: #4dc3ff;
}
/* updated video boxes */
.video__boxes {
	height: 100%;
	flex: 0 0 36%;
}
.video__boxes .inner {
	width: 96%;
	height: 100%;
	margin: auto;
	display: grid;
	display: -ms-grid;
	gap: 1rem;
	justify-content: center;
	align-items: center;
	grid-template-columns: repeat(2, calc(50% - 0.5rem));
}
.video__boxes .box {
	width: 100%;
	height: 100%;
	position: relative;
}
.video__boxes .box a {
	display: block;
	width: 100%;
	height: 100%;
}
.video__boxes .box img {
	width: 100%;
	height: 100%;
	display: block;
}
.video__boxes .box video {
	visibility: hidden;
	opacity: 0;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	object-fit: fill;
}
/* end of homepage */

/* logos that appear at the bottom of the product page*/

#logos { /* products.php */
	float: right; 
	margin-top: 25px; 
	margin-bottom:15px;
	/*margin-right: 20px; */
}

#logos img {
	float: left; margin-right:2px;
	/*border-right: #ccc solid 1px; */
}

#categories p { /* categories.php */
	border-bottom: #CCCCCC dotted 1px;
	padding-bottom: 10px;
	margin-bottom: 15px;
}

#categories p span {
	font-weight: bold;
	color: #262626;
}

#categories_main_text { /* browsecategory.php */
	position: absolute;
	width: 510px;
	top:0;
	left: 0;
	border: 1px solid #fff;
	border-left: 0px solid #000;
}

#categories_main_text img {
	margin: 0;
	padding: 0;
	display: block;
}

#categories_main_text p {
	color: white;
	/*background: #383232;*/
	padding: 10px 10px 10px 40px;
	margin: 0;
}

#categories_main_text.airdown_text { /* browsecategory.php, newproducts.php, search_results.php */
	/*top: 45px;*/
}

/* GALLERY */
#gallery_imgcontainer {
	display: block;
	overflow: hidden;
	width: 75% ;
	margin:0 auto;
	-moz-border-radius-topleft:3px;
	-webkit-border-top-left-radius:3px;
	-moz-border-radius-topright:3px;
	-webkit-border-top-right-radius:3px;
}

#gallery_img.loading, #gallery_imgzoom.loading {
	background: url(https://img.resultclothing.net/misc/spinner.gif) 50% 50% no-repeat;
}

#gallery_menu .wrapper {
	width: 480px;
	overflow: auto;
	min-height: 110px;
	position: absolute;
	top: 0;
	margin-left: 70px;
}

#gallery_menu .wrapper ul {
	width: 3000px;
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
	margin:0;
	padding:0;
	position: absolute;
	top: 0; 
}

#gallery_menu ul li a img, #gallery_menu ul li.small a img {
	display:block;
}

#gallery_menu .arrow {
	display: block;
	height: 29px;
	width: 29px;
	background: url(https://img.resultclothing.net/misc/gallery_arrow.png) no-repeat 0 0;
	text-indent: -999px;
	position: absolute;
	top: 35px;
	cursor: pointer;
}

#gallery_menu .forward {
	background-position: 0 0;
	right: 20px;
}

#gallery_menu .back {
	background-position: 0 -87px;
	left: 20px;
}

#gallery_menu .forward:hover {
	background-position: 0 -29px;
}

#gallery_menu .back:hover {
	background-position: 0 -116px;
}

#gallery_menu .forward.inactive {
	background-position: 0 -58px;
	cursor: default;
}

#gallery_menu .back.inactive {
	background-position: 0 -145px;
	cursor: default;
}

#gallery_menu .zoom_close {
	width: 620px;
	overflow: auto;
	height: 30px;
	position: absolute;
	top: 100px;
}

#gallery_menu .close {
	display: block;
	height: 29px;
	width: 29px;
	background: url(https://img.resultclothing.net/misc/gallery_arrow.png) no-repeat 0 -174px;
	text-indent: -999px;
	cursor: pointer;
	/*position: absolute;*/
	top:0;
	right: 20px;
}

#gallery_menu .close:hover {
	background-position: 0 -203px;
}
/* NEW TABS */
/* Style the tab */
div.tab {
    overflow: hidden; 
    border: 1px solid #eee;
    background-color: #f1f1f1;
}

/* Style the buttons inside the tab */
div.tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 10px;
    transition: 0.3s;
}

/* Change background color of buttons on hover */
div.tab button:hover {
    background-color: #ddd;
}

/* Create an active/current tablink class */
div.tab button.active {
    /*background-color: #ccc;*/
    background-color: #383232;
	color: #fff;
}

/* Style the tab content */
.tabcontent {
    display: none;
    padding: 6px 12px;
    border: 1px solid #eee;
    border-top: none;
	height:25em;
	overflow-y:auto;
	-webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s; /* Fading effect takes 1 second */
}

.techguide {
	height: auto;
	padding:0;
}

.techtitle { background: #ccc; color: white; padding: 10px; font-weight: bold;}
.airdown { background: #349aaf;}
.hydradri { background: #1e2c6f;}
.stormdri { background: #1e2c6f;}
.softshelltwo { background: #b7001d;}
.softshellthree { background: #b7001c;}
.hyvat { background: #77ab1b;}
.healspo { background: #df4e17;}
.warmalite { background: #790013;}
.techthree { background: #305e1f;}

.wash_instruction li {
    list-style-type: none;
    padding: 5px;
    display: flex;
	align-items: center;
	gap: 0.5rem;
    margin-bottom: 1px;
    background-color: white;
}
.wash_instruction li img {
	width: 30px;
}

#top-bar {
    background: #006;
    /* margin-left: 0% !important; */
    padding-left: 0% !important;
    margin-bottom: 20px;
    color: #FFFFFF;
}

/* TABS  that appear in the product page*/
.tabcontent .colour {
	text-align: center;
	min-height:131px; 
	position: relative;
	max-width: 300px;
}
.tabcontent .colours-wrap {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 1rem;
	width: 95%;
	margin: 0 auto;
}
.tabcontent .colour-link p {
	font-size: 12px;	
}
/* styles below for new model 360 videos added to product videos tab 14.06.23 */
.prod-videos {
	display: flex;
	margin-top: 0.5rem;
	gap: 2rem;
	flex-wrap: wrap;
}
.prod-video {
	width: 300px;
	height: 300px;
	position: relative;
}
.vid-play-btn {
	background: none;
	margin: 0;
	padding: 0;
	border: none;
	cursor: pointer;
}
.prod-video img {
	width: 100%;
	height: 100%;
	display: block;
}
.prod-video video {
	position: absolute;
	width: 100%;
	height: 100%;
	display: block;
	top: 0;
	left: 0;
	display: none;
}

#tabs ul {
	background: white;
	border-top: #ccc solid 1px;
}

#tabs ul li {
	float: left;
	margin: 14px;
}

.ui-tabs .ui-tabs-hide {
	display: none;
}

.ui-state-active a {
	background: #ccc;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	color: #333;
}

#tabs ul.section {
	background: none;
	border: none;
	margin-bottom: 15px;
}

#tabs ul.section li {
	float: none;
	margin: 0;
}

#tabs ul.section li {
	float: none;
	margin: 0;
	background: url(https://img.resultclothing.net/misc/bullet.png) 0 8px no-repeat;
	padding: 3px 0px 3px 12px;
	line-height: 20px;
}

#tabs ul.section li.section_header {
	background: none;
	padding-left: 0px;
	line-height: 30px;
	font-weight: bold;
	color: #262626;
	border-bottom: #CCCCCC dotted 1px;
	margin-bottom: 5px;
}

#tabs ul.section li.section_ratings {
	background: none;
	padding-left: 0px;
	font-weight: bold;
	font-size: 18px;
}

#tabs ul.section li span {
	font-weight: bold;
}

#tabs ul.section li.colour { /* product.php*/
	background: none;
	float: left; 
	height:auto;
	width: 85px; 
	margin: 10px; 
	line-height: 13px; 
	padding: 0; 
	text-align: center;
}

#tabs ul.section li.colour span {
	font-weight: normal;
}

a #sizingpdfs {
	background: #D31E23;
    width: 50%;
    padding: 1%;
    text-align: center;
    margin: 1% auto;
	color:#fff;
	font-weight:600;
	text-decoration:none;
}

a #sizingpdfs:hover{
	background:#383232;
	text-decoration:none !important;
}

#tabs ul.sizes {
	background: none;
	border: none;
	margin-bottom: 0px;
}

#tabs ul.sizes li {
	line-height: 5px;
}

#tabs ul.sizes li p {
	margin-bottom:16px;
}

#tabs ul.sizes li.section_header {
	float: none;
	background: none;
	padding: 0;
	margin: 0;
	line-height: 30px;
	font-weight: bold;
	color: #262626;
	border-bottom: #CCCCCC dotted 1px;
	margin-bottom: 5px;
}

/* product documents in product tabs */
.tab-heading {
	margin: 0;
	padding: 0;
	font-size: 14px;
	font-weight: 600;
    border-bottom: #CCCCCC dotted 1px;
    margin-bottom: 10px;
	list-style: none;
	margin-top: 5px;
}
.tab-docs .wrapper {
	display: flex;
	gap: 2rem;
}
.doc-wrapper.wrapper,
.doc-wrapper.wrapper .wrapper {
	flex-wrap: wrap;
}
.doc-wrapper .doc-section {
	min-width: calc(50% - 2rem);
}
.tab-docs .doc-subTitle {
	font-size: 15px;
	margin-bottom: 0.5rem;
	font-weight: 500;
	border-bottom: 1px solid #ccc;
	padding-bottom: 5px;
	padding-left: 5px;
}
.prod-document {
	background-color: #e9e9e9;
	border-radius: 6px;
	border: 1px solid transparent;
	transition: 0.3s ease;
	width: 120px;
	min-height: 119px;
	display: flex;
	justify-content: center;
	cursor: pointer;
}
.prod-document:hover {
	border: 1px solid #08c;
	transition: 0.3s ease;
}
.prod-document .wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	padding: 1rem 2.5%;
	text-align: center;
}
.prod-document a {
	width: 100%;
}
.prod-document a:hover {
	text-decoration: none;
}
.prod-document i {
	font-size: 2.4rem;
	color: #2a2222;
}
.prod-document .fa-file-pdf {
	margin-left: 4px;
}
.prod-document .doc-title p {
	font-size: 13.5px;
}
.doc-section .view-all {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 14px;
	font-weight: 500;
	width: fit-content;
	text-decoration: none;
}
.doc-section .view-all i {
	font-size: 16px;
}
/* AFTER */

#container:after, #menu:after, #menu li:hover ul ul:after, #menu ul ul ul:after, #breadcrumbs:after, #tabs ul:after, .grid2col:after, .grid2colb:after, .grid2cold:after, .grid2cold .grid2col:after, .grid3col:after, .grid4col:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/* SIFR */
/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0; 
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}
/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
	display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */
.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing: -9px;
	font-size: 90px;
}

/* Distributors */	

#map_container{
    min-height: 595px;
    padding: 10px;
}

#news_detail_left_distributors #map_container{
    background:none;
    min-height: 350px;
    padding: 10px 0;
    margin-left:10px;
}

#map_canvas {
    border-color: #cccccc;
    border-style: solid;
    border-width: 1px;
   /* width: 620px;*/
    height: 450px;
    margin-top:10px;
    margin-left:-10px;
}

#news_detail_left #map_canvas {
    border-color: #cccccc;
    border-style: solid;
    border-width: 1px;
    /*width: 300px;*/
    width: 100%;
    /*height: 350px;*/
    overflow: hidden;
}

#dist_search {
    width: 700px;
    margin-right: 10px;
    margin-bottom: -60px;
    position: relative;
    top:0px;
    float: left;
}

.search_box{
    float: left;
    padding-right: 10px;
    margin-left: 1%;
    margin-top: 1%;
    border-radius: 10%;
}

#instructions p {
    padding: 10px 10px 0 10px;
}

label {
    width: 200px;
    display: block;
    color:#535353;
}

select {
    width:200px;
}

#dist_list {
    min-height: 595px;
    padding: 10px;
    margin-top:15px;
    margin-left:-10px;
}

#dist_list ul {
    margin-top: 15px;
    border-top-color: #cccccc;
    border-top-style: solid;
    border-top-width: 1px;
    width: 620px;
}

#dist_list li {
    list-style-type: none;
    border-bottom-color: #cccccc;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    height: 40px;
}

#dist_list li .dist_company {
    float: left;
    width: 300px;
}

#dist_list li .dist_company p {
    font: bold 13px/40px Arial, Verdana, sans-serif;
    color: #000000;
}

#dist_list li .dist_features_icon_sm {
    position: relative;
    margin-right: 10px;
    top: 10px;
    width: 20px;
    height: 20px;
    float: left;
}

#dist_list li .more_info {
    float: right;
    /*width: 80px;*/
    background-image:url(https://img.resultclothing.net/misc/bullet.gif); 
    background-repeat: no-repeat; 
    background-position: 10px 13px;
    /*padding-left:25px;*/
}

#dist_list li .more_info p a {
    font: normal 12px/40px Arial, Verdana, sans-serif;
    color: #789CC2;
}

#dist_details {
    min-height: 595px;
    padding: 10px;
    margin-top:40px;
}

#dist_details ul {
    margin-top: 15px;
    border-top-color: #cccccc;
    border-top-style: solid;
    border-top-width: 1px;
    width: 300px;
}

#dist_details ul#dist_details_left {
    float:left;
}

#dist_details ul#dist_details_right {
    float:right;
    margin-left:10px;
}

#dist_details li {
    list-style: none;
    width: 310px;
    border-bottom-color: #cccccc;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    height: 163px;
}

#dist_details li.dist_details_icon  {
    list-style-type: none;
    border-bottom-color: #cccccc;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    margin-right: 20px;
    width: 260px;
    padding-left: 40px;
    height: 40px;
}

#dist_details li.dist_details_icon p a {
    font: bold 12px/40px Arial, Verdana, sans-serif; 
}

#dist_details li.dist_details_icon p{
    font: normal 12px/40px Arial, Verdana, sans-serif; 
}

.dist_details_title {
    font: bold 16px/2em Arial, Verdana, sans-serif;
    color: #000000;
}

.dist_details_tel{
    font: bold 12px/1.6em Arial, Verdana, sans-serif;
}

#tab4 { /*resources.php */
    width: 620px;
    margin-left:10px;	
}

/* login used for image downloads? */	

#login { /* resources.php */
    width: 300px;
    margin-left: auto;
    margin-right:auto;
    margin-top:-20px;
    position: relative;
}

#loginform { /*resources.php */
    background-image:url("https://img.resultclothing.net/misc/login_bg.jpg");
    background-repeat: no-repeat;
    background-position: top left;
    width: 300px;
    height: 111px;
    padding: 15px 25px 25px 25px;
}

#resourcesTr {
	
	 border-left-style: solid;
	
	}

/* new brochure download & flipbook buttons */
.download-btns {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	gap: 1rem;
}
.download-btns a {
	display: flex;
	gap: 8px;
	align-items: baseline;
	padding: 6px 16px;
	background-color: #e22120;
	color: #fff;
	font-weight: 500;
	font-size: 15px;
	border-radius: 20px;
}
.flyer_img .download-btns {
	align-items: flex-start;
	margin: 0.5rem 0;
}
.download-btns a:hover {
	text-decoration: none;
}
.download-btns a i {
	font-size: 18px;
}

#login p {
    font: bold 25px/3em Arial, Verdana, sans-serif;
}

fieldset {
    border: none;
    margin: 0;
    padding: 0;
}

#loginform ul{
    list-style-type: none;
    padding: 0;
    margin: 0;
    float:left;
}

#loginform ul li{
    list-style-type: none;
    padding: 0;
    margin: 0;
    line-height: 25px;
}

#loginform label {
    font: normal 12px/25px Arial, Verdana, sans-serif;
    color:#535353;
    display: block;
    width: 92px;
    float: left;
}

table.tableS {
	width: 40%;
	border: 1px solid white;
	text-align:center;
}

table {
    margin: 10px 10px 30px 10px;
    max-width: 940px;
    border-collapse: collapse;
}

table tr {
    border-bottom-color: #cccccc;
    border-bottom-style: solid;
    border-bottom-width: 1px;
}

table th p {
    font: bold 11px/1.3em Arial, Verdana, sans-serif;
    color:#000000;
}

table td p span {
    font: bold 10px/1.3em Arial, Verdana, sans-serif;
}


/* columns on the how to order page (links to the distributor page)*/
.howtocol {
	float: left;
    width: 100%;
    margin: 1%;
    position: relative;
}

/* techguide*/
#outline2 {
    width: 100%;
}

#sizetext {
    width: 100%;
	padding:5px;
}

/* fabric glossary */
.fabGloss1{
	width:50%;
	float:left;
}

.fabGloss2{
	width:50%;
	float:left;
}

.fabGloss3{
	width:50%;
	float:left;
}



#sizetext p{
	color: #fff !important;
}

/* Media Centre */

#tab4 td img {
    margin: 20px;
}

table.mediatable tr {
    border: none;
}

table.mediatable td img {
    margin-right: 20px;
}

table.mediaimages {
    margin: 10px 10px 30px 10px;
    width: 710px;
    border-collapse: collapse;
    border-color: #FFF;
}

.brochurerow {
    
}

.brochureimage {
    padding: 10px 10px 10px 10px;
}

.brochuretitle {
    color:#FFFFFF;
}

table td p span {
    font: normal 13px/1.3em Arial, Verdana, sans-serif;
    color: #789CC2;
}

#downloadNav ul li {
    float: right;
    margin-right: 10px;
    list-style: none;
    display: inline;
    text-indent: -5000px;
}

#downloadNav ul li a {
    display: block;
    width: 24px;
    height: 19px;
}

.newrange{
	color: red;
    font-size: 19px;
    font-weight: 700;
    padding: 5px;
    position: absolute;
    top: -8px;
    left: -2px;
    -ms-transform: rotate(334deg);
    -webkit-transform: rotate(334deg);
    transform: rotate(334deg);
}

 .newrange2 {
      background: red;
      display: inline-block;
      height: 55px;
      margin-left: 20px;
      margin-top: 55px;
      position: relative;
      width: 100px;
    }
     .newrange2:before {
      border-bottom: 35px solid red;
      border-left: 50px solid transparent;
      border-right: 50px solid transparent;
      content: "";
      height: 0;
      left: 0;
      position: absolute;
      top: -35px;
      width: 0;
    }

.advanced_search{
	background-repeat: repeat;
    width: 80%;
    margin: 0 auto;
    margin-top: 1%;
    padding: 1%;
    padding-top: 3%;
    overflow: hidden;
}       

.sub button[type=submit]{
    cursor: pointer;
    padding: 1%;
    border: 1px solid #FF0808;
    background: rgba(255, 8, 8, 0.5) !important;
    transition: 0.3s all ease-in;
}

.sub button[type=submit]:hover{                
    color: #fff;                
    text-align: left;                 
    transition: 0.3s all ease-out;
}

.col_left{
  width: 48%; float: left;  
}

.sub div{
    cursor: pointer;
    padding: 0.79%;
    border: 1px solid #FF0808;
    background: rgba(255, 8, 8, 0.5);
    transition: 0.3s all ease-in;
    width: 5%;
    font-size: 0.88em;
    line-height: 21px;
    padding-bottom: 0.74%;
    text-align: center;
}

.sub div:hover{                
    color: #fff;                
    padding-left: 20%;
    text-align: center;                 
    transition: 0.3s all ease-out;
}

.search_ input[type="text"]{
    border:2px inset #FFF;
    padding: 0.5%; font-weight: 600; text-transform: uppercase;
    width: 50% !important;
    transition: 0.3s all ease-in;
}

.search_ input[type="text"]:focus{
    padding-right: 20%;
    text-align: left;                 
    transition: 0.3s all ease-out;
}

.opt{
    width: 100%;
	padding-left:3%;
	padding-top: 2%;
	padding-bottom: 2%;
}

/* News List */

.LatestNews {
    width:300px;
    margin-top:0px;
}

/* News Quick Nav */

ul#news_quickNav {
    list-style: none;
}

ul#news_quickNav li {
    width: 270px;
    padding-left: 10px;
    border-bottom-color: #cccccc;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    background-image: url("https://img.resultclothing.net/misc/bullet.gif");
    background-repeat: no-repeat;
    background-position: 0 18px;
    padding: 15px;
}

/* News Detail */

#news_detail_left {
    float:left;
    width: 25%;
    margin-left: 10px;
    border-top-color: #cccccc;
    border-top-style: solid;
    border-top-width: 1px;
}

#news_detail_left_distributors {
    float:left;
    width: 25%;
    margin-left: 10px;
    border-top-color: #cccccc;
    border-top-style: solid;
    border-top-width: 1px;
}

#diss_detail_left {
			float:left;
			width: 40%;
			margin-left: 10px;
			border-top-color: #cccccc;
			border-top-style: solid;
			border-top-width: 1px;
		}

#news_detail_left_contact {
    float:left;
    width: 25%;
    margin-left: 10px;
    border-top-color: #cccccc;
    border-top-style: solid;
    border-top-width: 1px;
}

#news_detail_right {
    float:right;
    width: 72%;
    margin-right: 10px;
}

#news_detail_right_distributors {
    float:right;
    width: 73%;
    margin-right: 10px;
}

#diss_detail_right {
		float:right;
		width: 56%;
		margin-right: 10px;
	}

#news_detail_right_contact {
    float:right;
    width: 73%;
    margin-right: 10px;
}

#news_details {

}

#news_details img {
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
}

#advance_sub{
    margin-right: 1%;
}

/* About */

.content {
	width:80%;
	margin:0 auto;
}

.content h1 {
	margin-top:1%;
}

.aboutCol {
	float:left;
	width:45%;
	background:#fff;
	padding:2%;
	margin-bottom:1%;
}

#left{
	margin-right:2%;
}

/* Environment */

#enviro_main {
    background-repeat: no-repeat;
    background-position: top left;
    background-color: #E0D2C7;
    color: #000 !important;
	padding: 5px 90px;
	min-height: 300px;
}

#enviro_main  h3{
	text-shadow: none !important;
	margin:5px 17px 20px 17px;
	
}

#enviro_main p {
    font: normal 13px/1.5em open sans, Verdana, sans-serif;
}

#enviro_main .left {
    width: 45%;
    float: left;
    padding-bottom: 40px;
    padding-left:20px;
}

#enviro_main .right {
    padding-left: 20px; 
    width: 45%;
    float:left;
    padding-bottom: 40px;
}

#dhtmltooltip{
    position: absolute;
    background-color: #2C2C2C;
    border: 0px solid black;
    padding: 2px;
    width:150px;
    visibility: hidden;
	z-index: 9999;
    text-align:left;
    font: normal 11px/17px "lucida grande", tahoma, arial, verdana, sans-serif;
    color: #FFFFFF;
}

#dhtmltooltipheader{
    position: absolute;
    background-color: #2C2C2C;
    border: 0px solid black;
    padding: 2px;
    width:150px;
    visibility: hidden;
    z-index: 9999;
    text-align:left;
    font: normal 11px/17px "lucida grande", tahoma, arial, verdana, sans-serif;
    color: #FFFFFF;
}

#news { /* latestnews.php */
   width: 95%;
   margin: 0 auto;
   margin-top:56px;
}

#news h3 {
    padding-left:20px;
    padding-top:10px;
    padding-bottom:10px;
}

.newsblock { /* latestnews.php */
   width:24%;
   float:left;
   margin:0.5%;
}

.newsblock .heading {
    font-weight: bold;
    background-color:#a8a8a8;
    color:white;
    padding:5px;
    font-size:14px;
}

.newsblock .categorybox{
	width:100%;
}

.newsblock .categorybox img {
	width:100%; 
	-webkit-border-top-left-radius: 5px; 
	-webkit-border-top-right-radius: 5px; 
	-moz-border-radius-topleft: 5px; 
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px; 
	border-top-right-radius: 5px;
}

.newsblock .categoryboxContent p{
	text-align:center;
}

.newsblock .categorybox {
	
}

.categoryboxConBut{ /* latestnews.php */
	background: #D31E23; 
	padding: 0.5em; 
	text-align: center; 
	color: #fff; 
	font-weight: 600;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px; 
	margin-top:0.5em;
}

.categoryboxContent a:hover {
	text-decoration:none;
}

.newsblock .heading a {
    float:right;
    width:60px;
    text-decoration:underline;
    font-size:10px;
    color:white;
    font-weight:normal;
}

.newsblock .item {
    padding-left:10px;
    padding-right:5px;
    padding-top:5px;
    padding-bottom:5px;
    border-bottom:dotted #a8a8a8 1px;
}

.newsblock .thumb {
    width:30px;
    height:30px;
    float:left;
    padding:5px;
} 

.newsdetailblock {
    width:100%;
    float:left;
}

.newsdetailblock .thumb {
	width:100%;
    float:left;
} 

.newsdetailblock .heading {
    font-weight: bold;
    background-color:#a8a8a8;
    color:white;
    padding:5px;
    font-size:14px;
}

.newsdetailblock .heading a {
    float:right;
    width:60px;
    text-decoration:underline;
    font-size:10px;
    color:white;
    font-weight:normal;
}

.newsdetailblock .item {
    padding-left: 10px;
    padding-right: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom: dotted #a8a8a8 1px;
    float: left;
    width: 90%;
}

.newsdetailblock .NewsPageBottom {
    width: 58%;
    margin: 0.5em;
    float: left;
    font-family: Lucida Grande,Lucida Sans Unicode, Arial, Verdana, sans-serif;
    color: #000;
}

.CategoryPageHeading { /* newsdetail.php */
    
}

.CategoryPageHeading span { 
    text-decoration:none;
    color:#FFF;
    text-align: left;
    font-family: Lucida Grande,Lucida Sans Unicode, Arial, Verdana, sans-serif;
    margin-left: 3px;
}
.CategoryPageHeading a {
    font-size: 20px;
}

.CategoryPageHeading a:link, a:visited, a:active { text-decoration: none; }

.CategoryPagePicture { /* newsdetail.php */
    float: left;
    margin: 1em 0;
}

.CategoryPageBottomDesc {
    text-align:left;
    padding:3px;
    margin-right:2px;
    font-size: 1em;
    line-height:1.3em;
}

.yjSizes table{ /* product_size.php */
    width: 550px !important; 
    margin: 10px 0px 5px 5px;
    border: none;
    border-collapse: collapse;
}
.yjSizes table td{

}

.yjSizes table th{
    color:#fff;
	text-align: left;    
}

.yjSizes table tr{    
    border: none !important; 
    font-size: 11px;
    height: 10px;
}

.otSizes table{ /* product_size.php */
	width: 500px !important; 
    margin: 10px 0px 5px 5px;
    border: none;
    border-collapse: collapse;
}
.otSizes table td{
    color:#000;
    font-weight: bold;

}
.otSizes table th{
    color:#fff;
    text-align: left;    
}
.otSizes table tr{    
    border: none !important; 
    font-size: 12px;
    height: 10px;    
}

._clear{
	line-height: 30px;
	font-family: Gill Sans, Verdana !important;
	font-size: 11px;
	background: none !important;
	color: #000 !important;
	font-weight: bold !important;
	border-bottom:  none !important;
}

/**
 BELOW IS WHERE THE COLOURS FOR THE PRODUCT PAGE CODE, NAME AND DESC IS DEFINED
**/
   
/*base styling */
	.product_header_base {
		width: 100%;
		height: auto !important;
		padding-bottom: 0.5%;
		margin-top: 3.5%;
		background: #8c8c8c; /*if there is no class specified below, this is the fall back colour (so it wont just be plain)*/
	}
		/*individual background colours for each cat*/
		.performance{background-color: #5da1c1;}
		.softshell{background-color: #61716c;}
		.fleece{background-color: #b9a998;}
		.womens {background-color: #e09382;}
		.junioryouth {background-color: #daeff7;}		
		.winteressentials {background-color: #1f8090;}
		.bodywarmers {background-color: #839c7d;}
		.urban {background-color: #232d35;}
		.core{background-color: #35434e;}
		.padded{background-color: #b6b6b6;}
		.resultcolour{background-color: #9685a1;}
		.\33 in1{background-color: #A7CFD9;} /*class is actually 3in1 but in css you need to escape it before you can use it*/
		.search {background: #383232;}
		.sustainable {background: #3CB371;}
		/* end of individual background colours */
	
	.product_header_base a {
		
	}
	
	.product_header_base h2 {
		font-family: 'Poppins', sans-serif;
		margin-left: 1%;
		color:#fff;
	}
		/*individual h2 colours for each cat*/
		/*only need to list those that arnt the default*/
		.junioryouth h2 {color: #000;}		
		
		/* end of individual h2 colours */
	
	.product_header_base h3 {
		margin-left: 1% !important;
	}
		/*individual h3 colours for each cat*/
		.performance h3{color: #c9efed;}
		.softshell h3{color: #BDC6C5;}
		.fleece h3{color: #ffedd5;}
		.womens h3 {color: #ffedd5;}
		.junioryouth h3 {color: #d85353;}		
		.winteressentials h3 {color: #a5d4dc;}
		.bodywarmers h3 {color: #c3d8cb;}
		.urban h3 {color: #e2830d;}
		.core h3{color: #bcccdc;}
		.padded h3{color: #fff;}
		.search h3{color: #fff;}
		/* end of individual h3colours */
		
	.product_header_base p {
		margin-left: 1% !important;
		color:#fff;
	}	
		/*individual p colours for each cat*/
		/*only need to list those that arnt the default*/
		.softshell p{color:#BDC6C5;}
		.junioryouth p {color: #000;}		
		
		/* end of individual p colours */
		
/* end of base styling */


.contact-wrapper {
	display: flex;
	justify-content: space-between;
}
.contact-info .row {
	display: flex;
	align-items: center;
	gap: 1rem;
}
.contact-info .row label {
	width: 145px !important;
	font-size: 15px;
	font-weight: bold;
	color: #000;
	text-align: right;
}



/**
*Below code is for changing Product categories colorscheme dynamically, phpcode is withing the header.php;
**/

.flyers_section{
	width: 100%;
}
.flyer_ {
	color: #eee ;
	float: left;
	width: 23%;
	margin-right:1%;
	margin-bottom: 1rem;
}

.flyer_img {

}

.flyer_img img{
	width: 45%;
}

.flyer_title {
	color:rgba(39, 38, 38, 1) !important;
}

.flyer_thumb{
	width: 100%;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.39);
}

._cat_box_style2{
	position: relative;
    width: 30%;
    min-height: 302px;
    background-color: #bebebe;
    padding: 5px;
    float: left;
    margin-right: 5px;
	margin-bottom: 5px;
}

._cat_box_style2_default-link{
  /* all rules required to make the whole div clickable */ 
  position:absolute; 
  width:100%;
  height:100%;
  top:0;
  left: 0;
  z-index: 1;
  /* this is a fix for IE7-9 */
  background-color:#ffffff;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";  
  filter: alpha(opacity=0);  
  opacity:0;  
}

._cat_box_style2_independent-link{
    /* all rules required to make other links to work */ 
    position: relative;
    z-index: 100;
}

._cat_style2 {
	margin: 5px; 
	padding:3px;
	float: left;
	width: 50%;
	color: #fff; 
	overflow:hidden;
}
				
._cat_style img{ /* categories.php */
	width: 100%; 
}

._cat_style2 p {
	color:#fff;
}
																																														
@font-face { 
	font-family: 'Courier'; src: url('fonts/ufonts.com_courier.ttf');
}

.tabbed{
	float : left;
	width : 100%;
	
	margin-bottom:1%;
}

.tabbed > input{
	display : none;
}

.tabbed > section > h1{
	float       : left;
	box-sizing  : border-box;
	margin      : 0;
	overflow    : hidden;
	font-size   : 1em;
	font-weight : normal;
}

.tabbed > input:first-child + section > h1{
  
}

.tabbed > section > h1 > label{
	display                 : block;
	padding                 : 0.25em 0.45em;
	border                  : 1px solid #ddd;
	border-bottom           : none;
	box-shadow              : 0 0 0.5em rgba(0,0,0,0.0625);
	background              : #fff;
	cursor                  : pointer;
	-moz-user-select     : none;
	-ms-user-select     : none;
	-webkit-user-select     : none;
	width:100%;
}

.tabbed > section > div{
	position      : relative;
	z-index       : 1;
	float         : right;
	box-sizing    : border-box;
	width         : 100%;
	height		: 376px;
	overflow-y	: scroll;
	margin        : 2.5em 0 0 -100%;
	padding       : 0.5em 0.75em;
	border        : 1px solid #ddd;
	box-shadow    : 0 0 0.5em rgba(0,0,0,0.0625);
	background    : #fff;
}

.tabbed > input:checked + section > h1{
	position : relative;
	z-index  : 2;
}

.tabbed > input:not(:checked) + section > div{
	display : none;
}

.tabbed > input:not(:checked) + section > label{
	display : block;
}

/** #.GENERAL **/
body {
	margin:0;
	overflow-x:hidden;
}
html#blend { /* used in header */
	background-blend-mode: darken;
	transition: 3s;
}

#bgImage {
	height:630px;
	height:100vh;
	
}

input.field, textarea.textarea {
	font-family: 'Open Sans', sans-serif;
}

.sansLight {
	font-family: 'Open Sans', sans-serif;
}

/** #.HEADER **/

header{
	background: rgba(0, 0, 0, 0.22);
	position: fixed;
	width: 100%;
	text-align: center;
	/*min-height: 56px;*/
	height: 56px;
	color: #fff;
	font-size: 19px;
	top: 0;
	z-index:600;
	
}

header#prodhead{
	background: #383232;
}

h1{
	margin:0;
}

#logo {
	float:left;
	margin: 0.5% 1%;
	width:19%;
}

header.sticky {
  background: rgba(0, 0, 0, 0.22);
  color:rgba(255, 255, 255, 0.53);
  text-align: center;
  font-size: 19px;
  transition: all 0.6s ease;
  
}

header#prodhead.sticky {
  background: rgba(0, 0, 0, 0.44);
  color:rgba(255, 255, 255, 1);
  text-align: center;
  font-size: 19px;
  transition: all 0.9s ease;
 
}

.searchbutton{ /* header.php */
	float: right;
    margin-right: 9%;
    margin-top: 2.5%;
    width: 20px;
    height: 20px;
    background: url(https://img.resultclothing.net/icons/search-icon.png);
}

/* #.MIDDLE **/

.leftDiv { /* main.php */
	position: absolute;
	top: 10%; 
	left: 2%;
	width: 30em;
}

/*NB 16/02/22 - New Homepage */
.home-container {
	/*margin-top: 56px;*/
	width: 100%;
	display: flex;
	height: 100%;
}
.home-showcase,
.home-vid {
	width: 50%;
}
.home-showcase {
	width: 47%;
	background: #E22120;
}
.home-vid {
	position: relative;
	background: #000;
	width: 53%;
}
.home-vid video {
	width: 100%;
	height: 100%;
	min-width: 100%;
	object-fit: fill;
}
.index-header header {
	background: none !important;
}
.index-header header nav ul {
	float: right !important;
	width: 50%;
}

@import url(https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);

@import url(https://fonts.googleapis.com/css?family=Raleway:400,200,300,800);

/*boxes on left on main.php */

figure.snip0014 {
	font-family: 'Open Sans', sans-serif;
	color: #fff;
	position: relative;
	float: left;
	overflow: hidden;
	margin: 0.75% 0.8%;
	width: 13.2em;
	height: 13.2em;
	text-align: center;
	border: 2px solid rgba(255,255,255, 0.51);
}

figure.snip0014.large {
	min-width: 327px;
	max-width: 371px;
	/*height:14em;*/
}

figure.snip0014 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

figure.snip0014 img, figure.snip0014.large img {
  width: 100%;
  opacity: 1;
  height: 100%;
  -webkit-transition: opacity 0.35s;
  transition: opacity 0.35s;
}

figure.snip0014 figcaption {
  font-size: 1.25em;
}

figure.snip0014 > div, figure.snip0014.large > div{
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 1em 1em;
  width: 100%;
  height: 100%;
}

figure.snip0014 > div::before , figure.snip0014.large > div::before{
  position: absolute;
  top: 30px;
  right: 50%;
  bottom: 30px;
  left: 50%;
  border-left: 1px solid rgba(255, 255, 255, 0.8);
  border-right: 1px solid rgba(255, 255, 255, 0.8);
  content: '';
  opacity: 0;
  background-color: #ffffff;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
}

figure.snip0014 h2, figure.snip0014 p {
  margin: 0 0 5px;
  opacity: 0;
  font-size:16px;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s,-webkit-transform 0.35s,-moz-transform 0.35s,-o-transform 0.35s,transform 0.35s;
}

figure.snip0014 h2, figure.snip0014.large h2 {
  word-spacing: 0.15em;
  font-weight: 300;
  font-size:19px;
  line-height:19px;
  text-transform: uppercase;
  color:#fff;
  -webkit-transform: translate3d(0%, 100%, 0);
  transform: translate3d(0%, 100%, 0);
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

figure.snip0014.large h2 {
	padding-top:3em;
}

figure.snip0014 h2 span {
  font-weight: 800;
}

figure.snip0014 p {
  font-weight: 200	;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}

figure.snip0014 a {
  font-weight:600;
  color: #ffffff;
  text-decoration:none;
}

figure.snip0014:hover img {
  opacity: 0.35;
}

figure.snip0014.large:hover img {

}

figure.snip0014:hover > div h2 {
  opacity: 1;
  -webkit-transform: translate3d(0%, 0%, 0);
  transform: translate3d(0%, 0%, 0);
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

figure.snip0014:hover > div p {
  opacity: 0.8;
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
}

figure.snip0014:hover > div::before {
  background: rgba(0, 0, 0, 0.25);
  left: 10px;
  right: 10px;
  top:10px;
  bottom:10px;
  opacity: 1;
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}

/* -- BUTTON -- */
/* right pop out buttons */
a.rightbutton  {
	text-decoration:none;
	color:#fff;
	font-weight:600;
	position: fixed;
    border: 0;
    text-decoration: none;
}

a.bottombutton  {
	text-decoration:none;
	color:#fff;
	font-weight:600;
	position: fixed;
    border: 0;
    text-decoration: none;
}

.button1{
	right: -153px;
	transition:1s;
    top: 8em;
}

.button2 {
	right: -153px;
	transition:1s;
    top: 12em;
}

.button3 {
	right: -153px;
	transition:1s;
    top: 16em;
}

.button4 {
	right: -153px;
	transition:1s;
    top: 20em;
}

.button5 {
	left: 20px;
    transition: 1s;
    bottom: 4em;
} 

.button1:hover, .button2:hover, .button3:hover, .button4:hover {
	right:0;
	transition:1s;
}

a#rightbutton:hover {
	text-decoration:none;
	color:#d31e23;
	font-weight:600;
	background:#fff;
}
/* EO pop out right buttons */

.button {
	font-size: 1em;
	padding: 10px;
	color: #fff;
	border: 2px solid #06D85F;
	border-radius: 20px/50px;
	text-decoration: none;
	cursor: pointer;
	transition: all 0.3s ease-out;
}

.button:hover {
	background: #06D85F;
}

.popup_overlay {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0, 0, 0, 0.7);
	transition: opacity 500ms;
	visibility: hidden;
	opacity: 0;
	z-index:50;
}

.popup_overlay:target {
	visibility: visible;
	opacity: 1;
}

.popup {
	margin: 70px auto;
	padding: 20px;
	background: #fff;
	border-radius: 5px;
	height:75%;
	width: 30%;
	position: relative;
	transition: all 5s ease-in-out;
}

.popup-lg { /*this is used for the company snapshot - more styling below new arrivals popup styling*/
	height:78%;
	width: 60%;
}
.leftCol, .rightCol{
	width:40%; margin:2% 5%;
} 

.popup h2 {
	margin-top: 0;
	color: #000;
	font-family: Tahoma, Arial, sans-serif;
	font-size:35px;
}

.popup .close {
	position: absolute;
	top: 20px;
	right: 30px;
	transition: all 200ms;
	font-size: 30px;
	font-weight: bold;
	text-decoration: none;
	color: #333;
}

.popup .close:hover {
	color: #d31e23;
}

.popup .content {
	max-height: 80%;
	overflow: auto;
	width:100%;
}

/* new arrivals popup */
.newArrival_item {
    padding: 2%;
    border-bottom: 1px solid #c7c3c3;
}

.newArrival_item #itemLeft{
	width:20%;
	float:left;
}

.newArrival_item #itemRight{
	width:75%;
	float:left;
	margin-left:2%;
}

/* company snapshot styling */

.snapshot li {
	font-size:1.5em; 
	margin-bottom:8px;
	height:3em;
}

.snap-left {
	text-align:left;
	
}

.snap-right {
	text-align:right;
	
}

span#POI { 
	color: #D31E23;
	font-weight:500;
}
/*left side*/
span#warehouse{
	float:left;
	display:block;
	width:100px;
	height:100px;
	margin-right:5px;
	margin-top: -29px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/md/warehouse.png');
}
span#SKU{
	float:right;
	display:block;
	width:50px;
	height:50px;
	margin-left:5px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/sm/SKU2.png');
}
span#carton{
	float:left;
	display:block;
	width:50px;
	height:50px;
	margin-right:5px;
	margin-left:5px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/sm/cartons.png');
}
span#styles{
	float:right;
	display:block;
	width:100px;
	height:100px;
	margin-left:-22px;
	margin-right:40px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/md/styles.png');
}
span#pallets{
	float:left;
	display:block;
	width:50px;
	height:50px;
	margin-right:5px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/sm/pallets.png');
}
span#colour{
	float:right;
	display:block;
	width:50px;
	height:50px;
	margin-left:5px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/sm/colours2.png');
}
span#team{
	float:left;
	display:block;
	width:100px;
	height:100px;
	margin-right:5px;
	margin-top: -29px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/md/employees.png');
}
span#country{
	float:right;
	display:block;
	width:75px;
	height:75px;
	margin-left:5px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/s-m/countries.png');
}
span#distrib{
	float:left;
	display:block;
	width:50px;
	height:50px;
	margin-right:5px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/sm/distributors.png');
}
/*right side*/
span#age{
	float:left;
	display:block;
	width:100px;
	height:100px;
	margin-right:5px;
	margin-top: -35px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/md/age2.png');
}
span#size{
	float:right;
	display:block;
	width:50px;
	height:50px;
	margin-left:5px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/sm/acres4.png');
}
span#brochures{
	float:left;
	display:block;
	width:50px;
	height:50px;
	margin-right:5px;
	margin-left:40px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/sm/brochures.png');
}
span#exbos{
	float:right;
	display:block;
	width:100px;
	height:100px;
	margin-left:5px;
	margin-right:40px;
	margin-top: 4px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/md/exhibitions.png');
}
span#collects{
	float:left;
	display:block;
	width:75px;
	height:75px;
	margin-right:5px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/s-m/collections.png');
}
span#containers{
	float:right;
	display:block;
	width:50px;
	height:50px;
	margin-left:5px;
	margin-top: -9px;
	background-image: url('https://img.resultclothing.net/icons/company_snapshot/sm/containers.png');
}

/* new tech guide page - NB 18.07.22 */
.tech-guide-container {
	width: 85%;
	margin: 2rem;
	margin-left: 4rem;
	background: #383232;
	padding: 1rem;
	color: #fff;
}
.tech-row {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	border-bottom: 1px solid #fff;
}
.tech-row > * {
	padding: 0.5rem;
}
.tech-logo,
.tech-title {
	width: 12.5%;
}
.tech-desc {
	width: 75%;
}
.tech-logo {
	border-right: 1px solid #fff;
}
.tech-logo img {
	width: 140px;
}
.tech-title {
	text-align: center;
}
.tech-title h4 {
	font-size: 15px;
	margin: 0.5rem;
}
.tech-desc p {
	color: #fff;
	font-size: 13px;
}
/* end of tech guide */

/* new product directory page NB 13.09.23 */
.prod-directory {
	width: 90%;
	margin: 0 auto;
	max-width: 2000px;
}
.prod-directory h1 {
	font-size: 30px;
	margin: 0;
	margin-bottom: 2rem;
	font-weight: bold;
	color: #fff;
}
.directory-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	background-color: #b80022;
	padding: 1rem;
	margin: 1rem 0;
}
.directory-header .intro-logo {
	max-width: 325px;
}
.intro-logo .main-img {
	max-width: 100%;
	display: block;
	margin-bottom: 0.5rem;
}
.guide-link a {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1rem;
	font-size: 16px;
	color: #fff;
	font-weight: 600;
}
.intro-logo.lang .guide-link a {
	font-size: 14px;
}
.guide-icon {
	width: 60px;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 2px solid #fff;
	border-radius: 50%;
	background-color: #000;
}
.intro-logo.lang .guide-icon {
	width: 50px;
	height: 50px;
}
.guide-icon img {
	width: 70%;
}
.prod-directory .intro-txt {
	font-size: 16px;
	max-width: 1000px;
	width: 100%;
	line-height: 1.5em;
	margin-bottom: 2rem;
	color: #fff;
}
.prod-directory .result-img {
	max-width: 140px;
	display: inline-block;
}
.prod-directory .result-img img {
	width: 100%;
	display: block;
}
.prod-directory .products {
	margin-bottom: 1rem;
}
.products .colour-section {
	display: grid;
	grid-template-columns: repeat(auto-fit, 125px);
	grid-gap: 1rem;
	margin-bottom: 1rem;
}
.prod-directory .prod-img {
	margin-bottom: 0.5rem;
}
.prod-directory .prod-img img {
	width: 100%;
	display: block;
}
.prod-directory .prod-txt {
	text-align: center;
}
.prod-txt .code {
	margin-bottom: 0.5rem;
	font-weight: 700;
}
.prod-txt .desc {
	font-size: 12px;
}
.prod-directory .prod a {
	color: #000;
}
.prod-directory .colours-select {
	margin-bottom: 1rem;
}
.colours-select label {
	font-size: 16px;
	color: #fff;
	font-weight: 600;
	display: inline-block;
	width: auto;
}
.colours-select select {
	font-size: 15px;
	padding: 5px 8px;
	max-width: 175px;
	width: 90%;
	border-radius: 4px;
	border: 1px solid #f2f2f2;
}
.prod-directory .colour-block {
	margin-bottom: 1rem;
	padding-bottom: 8px;
	border-bottom: 1px solid #999;
}
.prod-directory .colour-block span {
	padding: 14px 16px;
	color: #fff;
	display: inline-block;
	font-size: 15px;
	font-weight: 600;
	box-shadow: 0 0 5px rgba(0,0,0,0.4);
}
.page-info {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 2rem 0;
}
.page-info .page-products p {
	font-size: 16px;
}
.page-info .page-products span {
	font-weight: 700;
}
.page-links label {
	width: auto;
	margin-right: 1rem;
	font-size: 15px;
	color: #000;
}
.page-info .page-links {
	display: flex;
	align-items: center;
}
.page-links select {
	width: auto;
	height: 35px;
	margin: 0 10px;
	padding: 0 3px;
	font-size: 15px;
}
.page-links a {
	padding: 8px;
	background-color: #fff;
	color: #333;
	text-decoration: none;
	font-size: 17px;
}
.no-products p {
	margin: 2rem 0;
	margin-bottom: 4rem;
	font-size: 17px;
}
/* end product directory */




@media screen and (max-width: 700px){
  .popup, .popup-lg{
    width: 70%;
  }
  
   .leftCol, .rightCol {
	   width:100%;
   }
  
  ul.snapshot{
	  width: 100%;
  }
  
  #bgImage {
	  background:url('https://img.resultclothing.net/misc/mob1.jpg') top ;
  }
  
  ._cat_style2 {
	  width:50%;
  }
  
  span.new {
	width:58px;
	}
	/* NB 06.12.21 commented out because it was removing the text surrounding the product
	.grid2colh {
		height: 144px !important;
	}*/
}

/** #.FOOTER **/

/* updated footer design NB 07.01.25 */
.page-footer {
	display: flex;
	width: 95%;
	margin: 0 auto;
	padding: 1rem 0;
	gap: 2rem;
}

.page-footer h3 {
	font-family: "Poppins", "open sans";
	font-size: 14px;
	border-bottom: 1px solid #ccc;
}

.foot-column {
	flex: 1;
}
.foot-column.result-info {
	flex: 2;
}

.footer-logos {
	display: flex;
	gap: 0.5rem;
}
.footer-logos .left-logos {
	width: 120px;
	
}
.footer-logos .logo-30 {
	width: 148px;
}
.footer-logos .logo-30 img {
	width: 100%;
}
.footer-logos .left-logos img {
	width: 100%;
}
.footer-logos .logo-30-years {
	max-width: 110px;
}

.result-info .result-logo {
	max-width: 200px;
	width: 90%;
}

.result-info .socials {
	margin-top: 1rem;
	display: flex;
	gap: 0.5rem;
}
/* end of new footer styles */

.linkBox {
	position: absolute;
    background: #fff;
    left: 3%;
    top: 15%;
	height:20%;
	border:2px solid #fff; 
}

.linkBox img {
	height:100%;
}

.linkBox2 {
	position: absolute;
    background: #fff;
    left: 15%;
    top: 15%;
	width:10%;
	height:20%;
}

.LargelinkBox{
	position: absolute;
    background: #fff;
    left: 3%;
    top: 38%;
	width:22%;
	height:30%;
}

footer {
	background:#fff;
	position:absolute;
	border-top: 1px solid #dcdcdc;
	width: 100%;
}
.footer-wrapper {
	width: 90%;
	margin: 0 auto;
}

footer a {
	color:#000;
}

.footer-col {
	width:12%;
	float:left;
	padding:1%;
}
.footer-col .foot-logos {
	width:14%;
}
.footer-col-last {
	width:28%;
	float:right;
	padding:1%;
	color:#000;
}

@media only screen and (max-width: 768px) {
	.footer-col {
		width:100%;
	}
	.footer-col .foot-logos {
		width:100%;
	}
	.footer-col-last {
		width: 100%;
	}
}


footer  h3{
	text-transform:uppercase;
	color:#000;
	font-size:13px;
	border-bottom: 1px solid #e0e0e0;
}

footer  ul{
	list-style:none;
	margin:0;
	padding:0;
}

footer ul li{

}

footer p{
	font-size:11px;
}

/* ***********************************************************************************
*********************************************************************************** */
/* 
Below is coding for the mobile responsivness, it is coded firstly for mobile, 
and then further down adaptions to display on desktop
*/

/*firefox */
@-moz-document url-prefix() { 
	
  #nav ul li { 
	/*float:left;*/
  }
  
  #nav ul li ul {
	  top:0.85em;
  }
  
  #searchForm {
	  width:40%;
  }
  .field.search.right {
		width:49%;
  }
  
  footer{
	 	  
  }
}

@-webkit-keyframes bugfix {
  from {
    padding: 0;
  }
  to {
    padding: 0;
  }
}
/* needed for checkbox hack */
h1, p {
  color: #000;
  font-size:15px;
}

/*other browsers*/

.mobile {
	display:none;
}

.full-mobile{
	float: right !important;
    max-width: 100%!important;
	flex:1!important;
}

#logo {
	float:none;
	margin:2px auto;
	width:100%;
	padding-top: 12px;
	
}

#logo img {
	width:60%;
}

.nav {
	background: rgba(0,0,0,0) !important;
	padding-top: 0 !important;
}

#nav {
  position: relative;
      background: #383232;
}
#nav ul {
  display: none;
  /*width: 100%;*/
  /*width: 79%;*/
  float:left;
  list-style: none;
  margin: 0px;
  padding: 0px;
}

#nav ul li {
	padding:5px 5px;
	margin:0 5px; 
	background:#383232;
	
	
}

#nav ul li a {
  display: block;
  color: white;
  margin:0;
}
#nav ul li a:hover{
 
}

#nav ul li:last-of-type a {
  
}

#nav ul li ul li {
	margin:0;
}

#nav ul li ul li a {
  
}
#nav ul li ul li ul li a {
  padding-left: 3.125em;
}
#nav input.trigger {
  position: absolute;
  top: -9999px;
  left: -9999px;
}
#nav input.trigger:checked ~ ul{
 display: block ;
 background: #383232;
width: 100%;
}

#nav input.trigger:checked ~ ul li ul {
	
}

.field.search.right {
	width:60%;
}

/*** sub menu dropdown ***/

label#sub, label#sub2 {
	color: #fff;
    width: 26px;
    float: right;
    margin-top: -25px;
    font-size: 28px;
	line-height:21px;
    margin-bottom: 18px;
}

input#show, input#hide, input#show2, input#hide2{
    display:none;
}

ul#listcontent {
    width:147%;
}

ul#listcontent, ul#listcontent2 {
	display:block;
}

input#show:checked ~ .show:before, input#show2:checked ~ .show2:before{ 
    content: ""
}
input#show:checked ~ .hide:before {
    content: "-"
}

input#show2:checked ~ .hide2:before{
	content: "-"
}

input#hide:checked ~ .hide:before, input#hide2:checked ~ .hide2:before {
    content: ""
}

input#hide:checked ~ .show:before {
    content: "+"
}

 input#hide2:checked ~ .show2:before{
	content: "+"	
}

input#show:checked ~ ul#listcontent, input#show2:checked ~ ul#listcontent2 {
    opacity: 1;
    font-size: 100%;
    height: 100%;
}

input#hide:checked ~ ul#listcontent, input#hide2:checked ~ ul#listcontent2{
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
   height: 0;
    font-size: 0;
    overflow: hidden;*/
}

input#hide:checked ~ ul#listcontent, input#hide2:checked ~ ul#listcontent2 {
	display:block
}

#searchForm {
	margin-right:0;
	padding: 0.5em 0;
}
/*** end of sub menu dropdown ***/

/* company policy page */
.comp__policy .cp__heading {
	font-size: 16px !important;
	text-decoration: underline;
	margin-bottom: 0.5rem;
}
/* EOF company policy */
 

/* DISTRIBUTOR DETAIL */

#diss_detail_left {
    float: left;
    width: 40%;
    margin-left: 10px;
    border-top-color: #cccccc;
    border-top-style: solid;
    border-top-width: 1px;
	display:block;
}

#diss_detail_right {
    float: right;
    width: 56%;
    margin-right: 10px;
}
 
 #categories_main_text{
	 display:none;
 }
 
 .grid2cold .column {
	 width:100%;
 }
 
 ._cat_box_style2 {
	  width:100%;
  }
  
  ._cat_style2 {
	  width:50%;
  }
 
 #vidtext {
	 display:none;
 }
 
 #vidvid {
		width:100%;
	}
	
 .newsblock {
	 width:100%;
 }

/* mix & match page */
.page-content.mix-match {
	/* background-color: #f2f2f2; */
	background-color: #fff;
	padding-bottom: 3rem;
}
.mix-match .page-wrapper {
	max-width: 2000px;
	width: 90%;
	margin: 0 auto;
	font-family: 'Roboto', "open sans", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	margin-bottom: 3rem;
}
.mixmatch-imgs {
	display: grid;
	gap: 3rem;
	grid-template-columns: repeat(auto-fit, 200px);
	justify-content: center;
}
.mixmatch-imgs .mixmatch-header {
	padding: 0.25rem 1rem;
	grid-column: 1 / -1;
}
.mixmatch-imgs .mixmatch-header img {
	max-width: 275px;
	width: 90%;
}
.mixmatch-imgs .item {
	text-align: center;
	transition: 0.3s all;
}
.mixmatch-imgs .item:hover {
	transform: scale(1.075);
}
.mixmatch-imgs .item a { color: #000; }
.mixmatch-imgs .item img {
	/* box-shadow: 0 0 6px rgba(0,0,0,0.3); */
	width: 100%;
	display: block;
}
.mixmatch-imgs .item span {
	color: #000;
	margin: 0.5rem 0;
	display: block;
	font-size: 14px;
}
.logos-row .brand-logo {
	max-width: 200px;
	width: 90%;
}
.logos-row .mixmatch-logo {
	max-width: 270px;
	width: 90%;
}
/* v2 */
.mix-match .categories {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
.mix-match .cat-btn {
	display: flex;
	column-gap: 2.5rem;
	align-items: center;
	border: none;
	cursor: pointer;
	padding: 0.5rem 0;
}
.mix-match .cat-btn .cat-logo {
	max-width: 270px;
	width: 90%;
}
.mix-match .cat-btn .arrow-btn {
	width: 34px;
	height: 34px;
	background-color: #f2f2fd;
	border: 2px solid #383232;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-left: 2rem;
	transition: 0.3s all;
}
.mix-match .cat-btn:disabled {
	color: initial;
}
.mix-match .arrow-btn i {
	font-size: 1.2rem;
}
.mix-match .cat-btn .plus-icon {
	display: inline-block;
}
.mix-match .cat-btn .minus-icon {
	display: none;
}
.mix-match .cat-btn.active .plus-icon {
	display: none;
}
.mix-match .cat-btn.active .minus-icon {
	display: inline-block;
}
.mixmatch-imgs.sections {
	display: block;
}
.mixmatch-imgs .section {
	display: grid;
	grid-gap: 3rem;
	/* grid-template-columns: repeat(auto-fit, 220px); */
	grid-template-columns: repeat(auto-fit, 300px);
	justify-content: space-evenly;
	margin: 3rem 0;
}
.mixmatch-imgs .section.big-imgs {
	grid-template-columns: repeat(4, 1fr);
}
.mixmatch-imgs .section.big-imgs .item {
	max-width: 300px;
	margin: 0 auto;
	position: relative;
}
.mixmatch-imgs .recycled-note {
	position: absolute;
	top: 0;
	right: 10px;
}
.mixmatch-imgs .recycled-note.rec-logo {
	max-width: 120px;
	right: 0;
}
.mixmatch-imgs .recycled-note span {
	color: #595959;
}
.mixmatch-imgs .recycled-note i {
	font-size: 2rem;
	color: #32a852;
}
.mixmatch-intro {
	background-color: #383232;
	padding: 1.5rem 2rem;
	margin: 2rem 0 3rem 0;
}
.mixmatch-intro.mixmatch-instructions {
	padding: 1.5rem 0 1.5rem 1.5rem;
}
.mixmatch-intro .inner {
	display: flex;
	column-gap: 4rem;
	align-items: center;
}
.mixmatch-intro.mixmatch-instructions .mixmatch-logo {
	max-width: 245px;
}
.mixmatch-logo {
	max-width: 250px;
	width: 90%;
}
.mixmatch-logo img {
	width: 100%;
	display: block;
}
.mixmatch-intro .graphic {
	max-width: 650px;
}
.mixmatch-intro .graphic img {
	width: 100%;
}
.mixmatch-intro .intro-txt {
	width: 60%;
}
.mixmatch-intro h1 {
	font-size: 2.2rem;
	color: #fff;
	margin-bottom: 1.5rem;
	font-weight: 600;
}
.mixmatch-intro p {
	color: #fff;
	font-size: 1.1rem;
	line-height: 1.2em;
}
/* mix & match image page */
.page-content.mixmatch {
	background-color: #f2f2fd;
	font-family: "Roboto", "open sans", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	padding-bottom: 2rem;
}
.mixmatch .page-wrapper {
	max-width: 2000px;
	width: 85%;
	margin: 2rem auto;
}
.mixmatch-card {
	display: flex;
	overflow-y: auto;
}
.mixmatch-card .card-img {
	flex: 3;
	background-color: #fff;
}
.mixmatch-card .card-txt {
	flex: 4;
	background-color: #D9D9D9;
	border-top-right-radius: 48px;
	border-bottom-right-radius: 48px;
}
.mixmatch-card .card-txt h1 {
	font-size: 26px;
	font-weight: bold;
	margin: 0.5rem auto 1rem auto;
	width: 95%;
}
.mixmatch-card .card-txt a {
	color: #000;
}
.mixmatch-card .card-img img {
	max-width: 400px;
	width: 100%;
	display: block;
	margin: 0 auto;
}
.mixmatch-card .card-txt .inner {
	/*display: grid;
	grid-template-columns: repeat(auto-fit, 70px);
	grid-gap: 0.75rem;*/
	width: 95%;
	margin: 0 auto;
}
.mixmatch-card .prod-thumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	border-bottom: 1px solid #b3b3b3;
	margin-bottom: 0.5rem;
}
.mixmatch-card .prod-thumbs:last-child {
	border-bottom: none;
}
.mixmatch-card .prod-code {
	/* grid-column: 1 / -1; */
	display: inline-block;
}
.mixmatch-card .prod-code h2 {
	font-size: 16px;
	color: #000;
	line-height: 1.2em;
	font-weight: 600;
}
.mixmatch-card .prod-code h2 span {
	font-weight: normal;
}
.mixmatch-card .prod-code .green-txt {
	/* color: #2f9d4c; */
	color: #7db300;
	font-weight: bold;
}
.mixmatch-card .thumb-img {
	text-align: center;
	width: 67px;
	margin-bottom: 1rem;
	position: relative;
}
.mixmatch-card .thumb-img img {
	display: block;
	width: 100%;
}
.mixmatch-card .thumb-img.primary img {
	box-shadow: 0 0 4px rgba(0,0,0,0.6);
}
.mixmatch-card .more a {
	display: flex;
	height: 100%;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-decoration: none;
}
.mixmatch-card .more i {
	font-size: 18px
}
.mixmatch-card .more span {
	font-size: 15px;
}
.mixmatch-card .brand-logo {
	max-width: 225px;
	width: 90%;
	margin-left: 0.5rem;
	margin-top: 0.5rem;
}
.mixmatch-card .brand-logo img { 
	width: 100%;
	display: block;
}
.mixmatch-card .prod-link {
	display: flex;
	column-gap: 0.5rem;
	flex-wrap: wrap;
	position: relative;
	align-items: center;
	margin-bottom: 0.5rem;
}
.mixmatch-card .recycled-icon {
	font-size: 1.8rem;
    color: #32a852;
}
.mixmatch-card .colour-name {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	font-size: 15px;
	background: #1877F2;
	color: #ffffff;
	padding: 5px 8px;
	border-radius: 5px;
	box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
	border: 1px solid rgba(0,0,0,0.1);
	opacity: 0;
	pointer-events: none;
	transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
	z-index: 1;
}
.mixmatch-card .colour-name::before {
	position: absolute;
	content: "";
	height: 8px;
	width: 8px;
	/*background: #1877F2;*/
	background-color: inherit;
	bottom: -3px;
	left: 50%;
	transform: translate(-50%) rotate(45deg);
	transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.mixmatch-card .thumb-img a:hover ~ .colour-name {
	top: -35px;
  	opacity: 1;
 	visibility: visible;
  	/*pointer-events: auto;*/
}
/* EOF mix & match */

/* product decoration page */
.prod-decorations > .wrapper {
	width: 90%;
	margin: 0 auto;
}
.prod-decorations h1 {
	font-size: 20px;
	margin: 1rem 0;
}

.prod-decorations .decorations {
	display: grid;
	grid-template-columns: auto auto auto;
	max-width: 1000px;
	width: 90%;
	border-right: 1px solid #999;
	border-top: 1px solid #999;
	position: relative;
	height: 70vh;
	overflow-y: auto;
	margin-bottom: 2rem;
}

/* checkboxes verion */
.prod-decorations .decorations.checkboxes {
	grid-template-columns: auto auto auto auto 50px 50px auto auto;
	max-width: 1500px;
}
.decorations.checkboxes.lang {
	grid-template-columns: auto auto auto auto auto auto auto auto;
}
.prod-decorations .tick-icon {
	width: 20px;
	display: block;
	margin: 0 auto;
}
.checkboxes .dec-process {
	padding: 5px 2px;
}
.checkboxes .dec-process img {
	width: 16px;
	display: block;
	margin: 0 auto;
}

.prod-decorations .item,
.prod-decorations .header {
	padding: 5px;
	background-color: #fff;
	font-size: 13px;
	border-left: 1px solid #999;
	border-bottom: 1px solid #999;
}

.prod-decorations .header {
	background-color: #d9d9d9;
	font-weight: bold;
	position: sticky;
	top: 0;
}
.prod-decorations .header label {
	width: auto;
	display: block;
	text-align: center;
	font-weight: bold;
	color: #000;
}
.prod-decorations .export {
	display: flex;
	max-width: 1000px;
	width: 90%;
}
.prod-decorations .export a {
	display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    background: #d9d9d9;
    padding: 10px 16px;
    margin-bottom: 1rem;
    color: #000;
    font-size: 14px;
    font-weight: 500;
	text-decoration: none;
	transition: 0.3s all;
}
.prod-decorations .export a:hover {
	background: #ccc;
}
.prod-decorations .export a img {
	width: 17px;
}
/* EOF decoration */

/* datasheets page */
.data-sheets {
	max-width: 800px;
	width: 90%;
	margin: 0 5%;
	padding: 3rem 0;
}
.data-sheets h1 {
	font-size: 2.2rem;
	color: #333;
	padding-bottom: 5px;
	border-bottom: 2px solid #333;
	margin-bottom: 1rem;
}
.data-sheets .products-table {
	font-size: 14px;
	border: 1px solid #ccc;
	width: auto;
}
.data-sheets th {
	font-size: 15px;
    font-weight: bold;
    background-color: cornflowerblue;
    color: #fff;
}
.data-sheets td.code {
	min-width: 75px;
}
.data-sheets td,
.data-sheets th {
	padding: 8px;
    text-align: left;
}
.data-sheets tr:nth-child(even) td {
	background: #f8f6ff;
}
.data-sheets .languages {
	display: flex;
	align-items: center;
}
.data-sheets .languages a {
	padding: 0 7px;
	border-right: 1px solid #333;
}
.data-sheets .languages a:last-child {
	border: none;
}
.data-sheets .download-btn {
	display: flex;
	align-items: center;
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
}
.data-sheets .download-btn img {
	width: 22px;
}
.data-sheets .download-success {
	width: 20px;
}
.data-sheets .loading-spinner {
	width: 24px;
}

.products-list {
	max-width: 800px;
	width: 90%;
	margin: 0 5%;
	padding: 3rem 0;
}
.products-list h1 {
	font-size: 2.2rem;
	color: #333;
	padding-bottom: 5px;
	border-bottom: 2px solid #333;
	margin-bottom: 1rem;
}
.products-list .product {
	display: flex;
	align-items: center;
	font-size: 16px;
	margin: 12px 0;
}
.products-list .languages {
	display: flex;
	align-items: center;
}
.products-list .languages a {
	padding: 0 7px;
	border-right: 1px solid #333;
}
.products-list .languages a:last-child {
	border: none;
}

/* not found page */
.datasheet-not-found {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: 3rem 0;
	min-height: 50vh;
	text-align: center;
}
.datasheet-not-found h1 {
	font-size: 6.5rem;
	color: #333;
	font-weight: 600;
	line-height: 1em;
}
.datasheet-not-found h2 {
	font-size: 2.6rem;
	color: #333;
	line-height: 1em;
	margin-bottom: 1.5rem;
}
.datasheet-not-found p {
	font-size: 1.2rem;
	margin-bottom: 1.5rem;
}
.datasheet-not-found a {
	font-size: 1.1rem;
	color: #FFF;
	font-weight: 600;
	background: #333;
	padding: 12px 18px;
}
/* EOF datasheets */

/* declaration of conformity documents page */
.conformity-documents .wrapper {
	width: 90%;
	margin: 0 5%;
	padding: 2rem 0;
}
.conformity-documents h1 {
	font-size: 2rem;
    color: #333;
    padding-bottom: 5px;
    border-bottom: 2px solid #333;
    margin-bottom: 1rem;
}
.conformity-documents .description {
	font-size: 16px;
	margin-bottom: 1rem;
}

.conformity-documents label {
	font-size: 15px;
	color: #000;
	font-weight: 500;
}
.conformity-documents .documents-note {
	font-size: 15px;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: #e9e9e9;
    padding: 0.5rem 1rem;
    width: fit-content;
	margin-bottom: 1rem;
	max-width: 800px;
}
.conformity-documents .documents-note img {
	width: 26px;
}
.product-docs {
	font-size: 14px;
	width: auto;
	margin: 0;
	border: 1px solid #ccc;
}
.product-docs th {
	font-size: 15px;
	font-weight: bold;
	background-color: cornflowerblue;
	color: #fff;
}
.product-docs td,
.product-docs th {
	padding: 8px;
	text-align: left;
}
.product-docs td {
	min-width: 100px;
}
.product-docs .files {
	display: flex;
	align-items: center;
	gap: 1rem;
}
.product-docs .files a {
	display: flex;
	gap: 5px;
	align-items: center;
}
.product-docs .files img {
	width: 23px;
}
.product-docs .divider {
	width: 1px;
	height: 22px;
	background: #666;
}
.product-docs tr:nth-child(even) td {
  background: #f8f6ff;
}
.product-docs .prod-row.highlighted td {
	background: #a3c0f5;
	font-weight: bold;
}

.lang-dropdown {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background-color: #fff;
	width: 160px;
	padding: 0.65rem 0.75rem;
	cursor: pointer;
	user-select: none;
	margin-bottom: 1.5rem;
	border: 1px solid rgba(0,0,0,0.4);
	max-width: 90%;
	z-index: 2;
}
.lang-dropdown .inner {
	display: flex;
	gap: 1rem;
	align-items: center;
}
.lang-dropdown .arrow {
	width: 10px;
}
.lang-dropdown img {
	width: 30px;
}
.lang-dropdown .list {
	background-color: #fff;
	position: absolute;
	top: 43.5px;
	left: 0;
	border-radius: 0 0 5px 5px;
	box-shadow: 0 4px 8px rgba(0,0,0,0.3);
	cursor: pointer;
	max-height: 250px;
	overflow-y: auto;
	width: 100%;
	display: none;
	border: 1px solid rgba(0,0,0,0.35);
	border-top: none;
	z-index: 1;
}
.lang-dropdown .list.active {
	display: block;
}
.lang-dropdown .item {
	display: flex;
	align-items: center;
	padding: 0.65rem 1rem;
	gap: 1rem;
}
.lang-dropdown .item:hover {
	background-color: #f2f2f2;
}
.lang-dropdown .text {
	font-size: 0.9rem;
}
.lang-dropdown a {
	color: #000;
	text-decoration: none;
}
/* EOF */

@media (min-width: 60em) { /* Media small PCs upwards? */
	#logo {
    float: left;
    margin: 0.5% 1%;
    /*width: 19%;*/
    width: 17%;
}

#logo {
	padding-top:0;
}

#logo img {
	width:100%;
}


	
  #nav input.trigger:checked ~ ul, #nav input.trigger:checked ~ ul li ul {
    display: -webkit-box;
    display: -moz-box;
    display: box;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    box-orient: horizontal;
    display: flex;
    flex-direction: row;
  }
  
  ._cat_box_style2 {
	  width:45.5%;
  }
  
  ._cat_style2 {
	  width:58%;
  }
} /* end of small PC */

#nav label.main {
  position: relative;
  min-height: 2em;
  padding: .25em;
  font-size: 1.1em;
  margin: 0;
  cursor: pointer;
  background: #383232;
  line-height: 2em;
  color: #fff;
  width:100%;
}

#nav label.main:after {
  position: absolute;
  right: 1em;
  top: .1em;
  content: "\2261";
  font-size: 1.8em;
  color: white;
}

/* IPAD 1 & 2  Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {
	  
	#logo {
		float: left;
		/*margin: 1.5% 2%;*/
		width: 14%;
	}
	
	figure.snip0014.large {
		display:none;
	}
	
	._cat_box_style2 {
	  width:46.5;
  }
  
  ._cat_style2 {
	  width:50%;
  }
  
}

/* DESKTOP */
@media (min-width: 60em) { /* 48ems = 768px */

.mobile {
	display:block;
}

.full-mobile {
	
	max-width: 7%;
    padding-left: 1%;
    margin-right: 1%;
    flex: none;
}
	 
  #logo {background : rgba (0,0,0,0);}
  
  #nav ul {
    /* older flexbox */
    display: -ms-flexbox;
    flex-direction: -ms-row;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    box-orient: horizontal;
    /* newer flexbox */
    /*display: flex;*/
    flex-direction: row;
	margin-top: 10px;
		
  }
  #nav ul li {
    position: relative;
    text-align: center;
    /* older flexbox */
    /* newer flexbox */
    /*flex: 0;*/
	background:rgba(0,0,0,0);
	padding:4px 15px;
  }
  
 #nav ul li a.new_prod_link {
	color:red;
	font-weight:600;
 }
 
  #nav ul li ul {
    display: none !important;
    position: absolute;
    top: 1.4em;
    left: 0;
    display: block;
    z-index: 200;
	background: rgba(0,0,0,0.5);
  }
  
  #nav ul li ul li ul {
    z-index: 300;
    top: 0px;
    left: 12.4em;
  }
  
  #nav ul li ul li ul li a {
    padding-left: 30px !important;
  }
  
  #nav ul li:hover > ul {
    display: block !important;
  }
  
  input#hide:checked ~ ul#listcontent,  input#hide2:checked ~ ul#listcontent2{
	opacity:1;
	height: auto; 
	font-size: 18px; 
	overflow: hidden;
	clear:both;
  }
  
  #nav label {
    display: none;
  }
  
  #searchForm{
	  display: inline-block;
	  marign: auto;
	  padding:0;
	  width: 100%;
  }
  
  #categories_main_text{
	  display:block;
  }
  
  .grid2cold .column { 
	width: 33%; 
	padding: 0 2px;

}

.newsblock { /* latestnews.php */
   width:24%;
   float:left;
   margin:0.5%;
}
  
  #vidtext {
	 display:block;
 }
 
	#vidvid {
		width:50%;
	}
	
.howtocol {
	width:48%; /*this effects the how to page*/
}
/* techguide*/
/* fabric glossary */

.fabGloss1{
	width:15%;
}

.fabGloss2{
	width:10%;
}

.fabGloss3{
	width:65%;
}
/* sizing table */
	

#outline2 {
    width: 40%;
    margin-left: 1%;
    margin-top: 3%;
	float:left;
}

#sizetext {
    padding-right: 10px;
    padding-bottom: 10px;
    width: 50%;
    float: left;
}


#sizetext p{
	color: #fff !important;
}

._cat_box_style2 {
	  width:28.5%;
  }
  
  ._cat_style2 {
	  width:50%; /* desk top looks at this width */
  }
}

@media only screen and (max-device-width: 770px) 
  { 
  
	  #nav ul li:hover > ul#listcontent, #nav ul li:hover > ul#listcontent2 {
		display: block !important;

	  }

	  #nav label.main {

	  }

	/* HOMEPAGE */

		#logo {
			background:#383232;
		}

		header.sticky {
			background:#000;
		}

		#nav ul {
			width:100%;
		}

		#breadcrumbs li {
			display:none;
		}

		a.rightbutton {
			display:none;
		}

		.leftDiv {
			width:90%;
			top:7em;
		}

		.aboutCol {
			width:100%;
		}

		figure.snip0014 {
			margin-top:20px;
			width:12em;
			height:12em;
		}

		figure.snip0014.large {
			display:none;
		}


		/* CATEGORY */

		.margin10{
			/*margin-top: 6em !important;*/
		}

		.grid3col .column { 
			width: 100%; 
			padding:0;
		}

		._cat_box_style2 {
			  width:100%;
		  }

		  ._cat_style2 {
			  width:50%;
		  }

		/* PRODUCT */

		.big_new {
			display:none;
		}

		#gallery_menu_container {
			width:250px !important;
		}

		#gallery_menu .wrapper {
			width:170px !important;
		}

		.grid2colb-prod {
			margin-top: 1em;
			display: block;
		}
	  
	  .rec-img {
		  position: static;
		  max-width: 100px;
		  margin-left: 5%;
	  }


		.grid2colb-prod .column label {
			/*width:60px;*/
		}


	/* RESOURCES */

		.margin10 {

		}

		._cat_box_style2 {
			  width:100%;
		  }

		  ._cat_style2 {
			  width:50%;
		  }

		#news_detail_left{
			display:none;
		}

		#news_detail_right {
			margin:0;
			width:100%;
			float:left;
		}

		.tab {
			width:100%;

		}

		.tab p {color:#000 !important;}

		table.mediaimages {
			width:100%;
		}

		table.mediaimages tr {
			width:100%;
		}
		table.mediaimages td {
		/*	width:100%;*/
			float:left;
		}


		table.mediaimages img {
			/*width:50%; */
			margin:0;
		}

		.flyer_ {
			color: #eee;
			float: left;
			width: 100%;
		}

		.flyer_ li {width:100%!important;}


		.flyer_thumb {
			width: 100%;
			min-height: 139px;
			max-height: none;
			padding: 0;
			margin-bottom: 2%;

		}

		#tab4{
			width:100%;
			margin:0;
		}

		#vidtext {
			 display:block;
		 }


	/* DISTRIBUTORS */
	#news_detail_left_distributors {
	   width:100%;
	}

	#news_detail_right_distributors{
		width:100%;
	}



	#news_detail_right_distributors #map_container{
		display:none;
	}

	#dist_list {
		margin:0;
		padding:0 1em;
	}

	/*  BROCHURE REQUEST */

	#dist_list ul {
		width:100%;
	}

	#dist_list li{
		border-bottom:0;
	}

	#dist_list li .dist_company {
		width:100%;
	}

	#dist-mob {
			margin-top: 85px!important;
	}

	/* DISTRIBUTOR DETAIL */

	#diss_detail_left {
		display:none;
	}

	#diss_detail_right {
		float: left;
		width: 100%;
		margin-right: 0;

	}


	#mob-width{
		width:100%;
		float:none;
		clear:both;
		margin:0 10px;
	}

	#mob-width li {
		float:left !important;
	}

	#request {
		width:100% !important;
	}

	/* CONTACT */

	#news_detail_left_contact {
	   width:100%;
	}

	#news_detail_right_contact{
		width:100%;
	}

	#map_canvas {
		width:100%;
		margin-left:0;
	}


	/*COMPANY POLICY */

	#enviro_main {
		padding:0;
		margin-top: -1em;
		padding-top: 1em;
	}

	#enviro_main .left{
		width:100%;
		padding-left:0;
	}

	#enviro_main .right{
		width:100%;
		padding-left:0;
	}
  
}

@media only screen and (max-width: 1600px) {
	.home-box {
		width: 200px;
		height: 200px;
	}
	.welcome-text h1 {
		font-size: 30px;
		margin-bottom: 1rem;
	}
	.welcome-text,
	.brand-text {
		width: 40%;
	}
	.brand-text a {
		font-size: 13px;
		padding: 8px 10px;
	}
	.welcome-vid,
	.brand-img {
		width: 60%;
	}
	.welcome-text > * {
		padding: 0 1rem;
	}
	.brand-text {
		padding: 1% 3%;
	}
	.brand-img img {
		width: 100%;
	}
	.brand-text h2 {
		font-size: 30px;
	}
	.brand-text > * {
		margin: 1rem 0 !important;
	}
	.brand-text p {
		font-size: 20px;	
	}
	.brand-text-small {
		font-size: 12px !important;
	}
	.homepage-videos {
		height: 550px;
	}
}

@media only screen and (max-width: 1250px) {
	.tech-guide-container {
		width: 100%;
		margin: 0;	
	}
	.tech-row {
		padding-right: 1rem;	
	}
	.tech-logo,
	.tech-title {
		width: 15%;
	}
	.tech-desc {
		width: 70%;
	}
	.welcome-text {
		width: 30%;
		padding: 0 0.5rem;
	}
	.welcome-vid {
		width: 70%;
	}
	.welcome-small {
		display: none;
	}
	.home-boxes {
		flex-direction: column;
		align-items: center;
	}
	.home-box {
		margin: 10px 0;
		width: 175px;
		height: 175px;
	}
	.welcome-text h1 {
		font-size: 24px;
	}
	.box-title h2 { font-size: 13px; }
	.brand-img {
		width: 50%;
	}
	.brand-text {
		width: 50%;
	}
	.brand-text a {
		font-size: 13px;
		padding: 8px 16px;
	}
	.brand-text > * {
		margin: 0.5rem 0 !important;
	}
	.brand-text p {
		line-height: 25px;
	}
	.brand-text h2 {
		line-height: 35px;
	}
	.homepage-videos {
		flex-direction: column;
		height: auto;
	}
	.welcome-vid-main {
		width: 100%;
	}
	.welcome-vids {
		width: 80%;
		margin: 0 auto;
	}
	.vids-row {
		gap: 5%;
		margin: 2%;
	}
	.contact-wrapper {
		flex-direction: column;
	}
	.contact-wrapper > div {
		width: 95% !important;
	}
	/* new homepage update 31.03.23 */
	.video__boxes .inner {
		margin: 2rem auto;
		width: 75%;
		gap: 2rem;
		grid-template-columns: repeat(2, 45%);
	}
	.cat-page .wrapper {
		justify-content: center;
	}
	.directory-header .intro-logo {
		max-width: 260px;
	}
	.guide-icon {
		width: 55px;
		height: 55px;
	}
	.prod-directory .intro-txt {
		font-size: 15px;
	}
	.grid2cold.cat-products {
		grid-template-columns: repeat(2, 1fr);
	}
	/* mix & match */
	.mix-match .cat-btn .cat-logo { max-width: 225px; }
	.mixmatch-intro { padding: 1rem; }
	.mixmatch-intro .inner { gap: 2rem; }
	.mixmatch-intro h1 { font-size: 2rem; }
	.mixmatch-intro p { font-size: 1rem; }
	.mixmatch-logo { max-width: 250px; }
	.mixmatch-instructions .inner {
		flex-direction: column;
	}
	.mixmatch-instructions .mixmatch-logo {
		margin: 1rem auto;
	}
	.mixmatch-intro.mixmatch-instructions { 
		padding: 1rem 2%;
		text-align: center;
	}
	.mixmatch-intro.mixmatch-instructions .intro-txt {
		width: 80%;
	}
	.mixmatch-imgs .section.big-imgs {
		grid-template-columns: repeat(3, 1fr);
	}
	.tabcontent .colours-wrap {
		grid-template-columns: repeat(3, 1fr);
	}
	.footer-logos .left-logos {
		width: 100px;
	}
	.footer-logos .logo-30 {
		width: 124px;
	}
	.page-footer {
		gap: 1rem;
	}
}

@media only screen and (max-width: 960px) {
	.tech-guide-container { padding: 0; }
	.tech-row {
		flex-wrap: wrap;
		text-align: center;
	}
	.tech-row > *,
	.welcome > *,
	.brand-spotlight > * {
		width: 100% !important;
	}
	.tech-logo { border: none; }
	.tech-logo img {
		display: block;
		margin: auto;
	}
	.tech-desc p { font-size: 12px; }
	.welcome {
		flex-direction: column;
	}
	.welcome-text {
		margin-bottom: 1rem;
	}
	.welcome-text h1 {
		font-size: 32px;
	}
	.welcome-small { 
		display: block;
		font-size: 14px;
	}
	.home-boxes { flex-direction: row; }
	.home-box {
		width: 250px;
		height: 250px;
	}
	.box-title h2 { font-size: 14px; }
	.brand-spotlight {
		flex-direction: column-reverse;
		padding: 2rem 10%;
	}
	.brand-text {
		marign-bottom: 1rem;
	}
	.brand-text .wrapper > * {
		margin: 1rem 0 !important;
	}
	.brand-text .wrapper {
		width: 100%;
	}
	.cat-page {
		padding-top: 20px;
	}
	/* mix & match */
	.mixmatch-card {
		flex-direction: column;
	}
	.mixmatch-card .card-txt {
		border-top-right-radius: 0;
		border-bottom-right-radius: 20px;
		border-bottom-left-radius: 20px;
	}
	.mixmatch-card .thumb-img {
		width: 60px;
	}
	.mixmatch-card .card-img img {
		max-width: 350px;
	}
	.mixmatch-intro.mixmatch-instructions .intro-txt {
		width: 100%;
	}
	.grid2colb-prod .column{
		width:100%;
		float:left;
		margin-left: 0;
	}
	.grid2colb-prod .lastOne{
		width:100%;
		position:relative;
	}
	.prod-decorations .item, 
	.prod-decorations .header {
		font-size: 12px;
	}
	/* new footer update 07.01.25 */
	.page-footer {
		flex-direction: column;
		gap: 1rem;
	}
	.product-docs { width: 100%; }
	.conformity-documents h1 { font-size: 1.6rem; }
	.conformity-documents .description { font-size: 14px; }
	.product-docs td { min-width: auto; }
	.product-docs .files {
		flex-direction: column;
		align-items: flex-start;
	}
	.product-docs .divider { display: none; }
	.conformity-documents .documents-note p { font-size: 13px; }
}

@media only screen and (max-width: 768px) {
	.welcome-section {
		padding: 3%;
		padding-top: 4rem;
	}
	.home-boxes { flex-direction: column; }
	/* new homepage update 31.03.23 */
	.brand-text .text-inner { width: 100%; }
	.brand-text .text-inner img {
		margin: 0 auto;
		display: block;
		margin-bottom: 2rem;
	}
	.video__boxes .inner {
		width: 90%;
	}
	.slider__btns {
		bottom: 17px;
	}
	.slider__btns label {
		padding: 5px;
	}
	.cat-page .wrapper {
		grid-template-columns: repeat(1, 1fr);
	}
	.cat-page .cat-box {
		max-width: 450px;
		width: 90%;
		margin: 0 auto;
	}
	.cat-img img {
		height: 100%;
		object-fit: cover;
	}
	.cat-box .cat-txt {
		width: 90%;
		margin: 0 auto;
	}
	.cat-box.lang-view {
		height: 400px;
	}
	.products .colour-section {
		justify-content: center;
	}
	.page-info {
		flex-direction: column;
		justify-content: center;
		gap: 1rem;
	}
	.prod-directory {
		margin-top: 2rem;
	}
	.prod-directory h1 {
		text-align: center;
	}
	.prod-directory .colour-block {
		text-align: center;
	}
	.prod-directory .intro-txt {
		font-size: 14px;
		text-align: center;
	}
	.prod-directory .result-img {
		max-width: 110px;
	}
	.directory-header {
		flex-direction: column-reverse;
		background: none;
		padding: 1rem 0;
		text-align: center;
	}
	.prod-directory .result-img img {
		filter: invert(1);
	}
	.colours-select label,
	.prod-directory .intro-txt,
	.guide-link a,
	.prod-directory h1 {
		color: #000;
	}
	.guide-link a {
		flex-wrap: wrap;
	}
	.colours-select select {
		border: 1px solid #666;
	}
	.rec-img { 
		max-width: 145px;
		left: 5px;
	}
	.rec-img-right {
		position: static;
		margin-left: 10px;
		max-width: 145px;
	}
	.cert-recycled {
		max-width: 145px;
	}
	.grid2cold.cat-products {
		grid-template-columns: repeat(1, 1fr);
	}
	#content {
		margin-top: 62px;
	}
	/* mix & match */
	.mixmatch-imgs {
		grid-template-columns: repeat(2, 45%);
		gap: 1.5rem;
	}
	.mixmatch-imgs .item {
		max-width: 350px;
		width: 100%;
		margin: 0 auto;
	}
	.mixmatch-imgs .mixmatch-header {
		padding: 1rem 2%;
	}
	.mixmatch .page-wrapper {
		width: 90%;
		margin-top: 0;
	}
	.mix-match .categories {
		grid-template-columns: repeat(1, 1fr);
		row-gap: 1rem;
	}
	.mixmatch-imgs .section,
	.mixmatch-imgs .section.big-imgs {
		grid-template-columns: repeat(2, 40%);
		justify-content: center;
	}
	.mix-match .cat-btn .cat-logo { max-width: 200px; }
	.mix-match .cat-btn { flex-wrap: wrap; }
	.mixmatch-intro { padding: 1.5rem 2%; }
	.mixmatch-intro .inner {
		row-gap: 2rem;
		flex-direction: column;
	}
	.mixmatch-intro .intro-txt {
		width: 100%;
		text-align: center;
	}
	.mixmatch-intro h1 { font-size: 1.7rem; }
	.mixmatch-intro p { font-size: 1rem; }
	.mixmatch-imgs .recycled-note.rec-logo {
		position: static;
		margin: 0 auto;
	}
	.prod-decorations .decorations {
		width: 100%;
		overflow: auto;
	}
	.prod-decorations .dec-access {
		min-width: 175px;
	}
	.prod-decorations .dec-process {
		min-width: 65px;
	}
	.prod-decorations .product {
		min-width: 50px;
	}
	.suggested-products .title { font-size: 22px; }
}
