@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");


.checker {
    position: absolute;
    top: 50px;
    right: 5px;
    color: black;
    background-color: red;
    display: block;
}
body, html {
    /*    margin: 0;
    padding: 0;*/
    height: 100%;
}
body {
    color: #696969;
    /*font-size: 1.2rem;*/
    font-size: 0.875em;
    /*font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
    font-family: "Varela Round", sans-serif;*/
    font-family: "Open Sans", sans-serif;
}
.boxes img {
max-width: 200px;
}
/*.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1600px;
    margin-right: auto;
    margin-left: auto;
}*/
h1, h2, h3, h4, h5 {
    font-family: "Varela Round", sans-serif;
    font-weight: 400;
    font-style: normal;
}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h1 a, h2 a, h3 a, h4 a, h5 a {
    text-decoration: none !important;
}
h1 {
    font-size: 3em;
    font-size: 2.7em;
    letter-spacing: -3px;
}
h2 {
    font-size: 2.2em;
    letter-spacing: -2px;
}
h3 {
    font-size: 1.8em;
}
h4 {
    font-size: 1.6em;
}
h5 {
    font-size: 1.4em;
}
h6 {
    font-size: 1.2em;
}
a:link, a:visited {
    text-decoration: none;
    color: #666;
}
a:hover, a:active {
    /*text-decoration: underline;*/
    color: #000;
}

/*.lnkHoz a {
    display: block;
}*/
.lnkHoz a:link, .lnkHoz a:visited {
    color: #666;
}
.lnkHoz a:hover, .lnkHoz a:active {
    color: #222;
}
.tempbg a {
    color: #444;
    text-decoration:none
}
.bg-body {
    background: transparent url('../im/body-bgs.jpg') no-repeat fixed top center;
    background-size: contain;
}
.main-bg-bord-round {
    background-color: #fff;
    border: 1px solid #eee;
    /*border-top-left-radius: 12px;
    border-top-right-radius: 12px;*/
    border-radius: 12px;
    margin-top: 52px;
    padding: 0px;
    /*margin-bottom: 2em;
    margin: 2em auto;*/
}
.main-bg-bord-round-b {
    background-color: #fff;
    border: 1px solid #eee;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
/*    margin: 2em auto;
    padding: 2em 0em;*/
}
/*.section-bord {
    background-color: #fff;
    border: 1px solid #eee;*/
    /*margin: 2em auto;*/
    /*padding-top: 3em;
    padding-bottom: 3em;
}*/
.mainHead {
    padding: 2em 0px 3em 0px;
    padding: 2em 0px 1em 0px;
}
.tempbg {
    background-color: #494949;
    color: #dedede;
    background-color: #fff;
    color: #889988;
    background: #fff url('../im/info-w-BG.jpg') top center repeat-x;
    border-bottom: 1px solid #dedede;
}
.bread {
    font-size: 0.9em;
    text-align: right;
    margin-bottom: 3em;
    padding-right: 3em;
    color: #999;
}
.bread a {
    color: #999;
    text-decoration: none;
    font-weight: 600;
}
.bread a:hover {
    text-decoration: underline;
}
.bread span {
    color: #444;
}
a.prod, .prod {
    color: orangered;
}
a.prodon:hover {
    color: orangered;
}
a.app, .app {
    color: orange;
}
a.supply, .supply {
    color: dodgerblue;
}
a.ourc, .ourc {
    color: seagreen;
}
a.l-prod {
    color: orangered;
    font-weight: 500;
}
a.l-prod:hover {
    text-decoration: underline;
}
a.l-app {
    color: orange;
    font-weight: 500;
}
a.l-app:hover {
    text-decoration: underline;
}
a.l-white{
    color: #efefef;
    font-weight: 700;
    text-decoration: underline;
}
a.l-white:hover {
    color: #fff;    
}
a.l-ourc {
    color: seagreen;
    font-weight: 500;
}
a.l-ourc:hover {
    text-decoration: underline;
}
.u-prod {
    border-bottom: 1px solid orangered;
}
.u-app {
    border-bottom: 1px solid orange;
}
/*.u-supply {
    border-bottom: 1px solid dodgerblue;
}*/
.u-ourc {
    border-bottom: 1px solid seagreen;
}
.bordBot {
    border-bottom: 1px #dedede solid;
}
.bordTopBot {
    border-top: 1px #dedede solid;
    border-bottom: 1px #dedede solid;
}
.bordTopHome {
    border-top: 1px #dedede solid;
    padding-top: 2em;
}
.bordTopProd {
    border-top: 1px solid orangered;
    padding-top: 2em;
}
.bordTopApp {
    border-top: 1px orange solid;
    padding-top: 2em;
}
.bordTopOurc {
    border-top: 1px seagreen solid;
    padding-top: 2em;
}
/*.bordTopSupply {
    border-top: 1px dodgerblue solid;
    padding-top: 2em;
}*/
.ole {
    margin: 1em 0em 2em 0em;
}
.ole span {
    font-size: 0.94em;
    color: #aaa;
    display: block;
}
.tab-pane {
    /*padding-left: 15%;
    padding-top: 4em;
    padding: 4em 0px 4em 12%;
    background-color: orange;
    color: #222;*/
}
.nav-link {
    color: #444;
}
.nav-link:hover {
    background-color: #ddd;
    color: #000;
}
.nav-link {
    color: #444;
    margin:2px;
}
.nav-pills .nav-link {
    border: 1px solid #eee;
    margin: 6px;
    background-color: #efefef;
}
.nav-pills .nav-link.active{/*, .nav-pills .show > .nav-link */
    color: #333;
}
.nav-pills .nav-link.tab-yellow.active { 
    color: #333;
    background-color: #feff8b
}
.nav-pills .nav-link.tab-yellow.active { 
    background-color: #feff8b
}
.nav-pills .nav-link.tab-brown.active { 
    background-color: #8b4110;
    color: #fff;
}
.nav-pills .nav-link.tab-orange.active {
    background-color: #ff8500;
    color: #fff;
}
.nav-pills .nav-link.tab-red.active {
    background-color: #f71313;
    color: #fff;
}
.nav-pills .nav-link.tab-green.active {
    background-color:  #30e405;
}
.nav-pills .nav-link.tab-blue.active {
    background-color: #1f9cee;
    color: #fff;
}
.nav-pills .nav-link.tab-black.active {
    background-color: #111;
    color: #fff;
}
.nav-pills .nav-link.tab-AC.active {
    background-color: #aaa;
    color: #fff;
}
.nav-pills .nav-link.tab-AS.active {
    background-color: #777;
    color: #fff;
}
.nav-pills .nav-link.tab-UN.active {
    background-color: #ccc;
}
.nav-pills .nav-link.tab-LF.active {
    background-color: #aaa;
}
.nav-pills .nav-link.tab-AK.active {
    background-color: #888;
    color: #fff;
}
.nav-pills .nav-link.tab-PUPO.active {
    background-color: #555;
    color: #fff;
}
.nav-pills .nav-link.tab-Microblanc.active {
    background-color: #dedede;
    color: #444;
}
.nav-pills .nav-link.tab-Zetafil.active {
    background-color: #cacaca;
    color: #444;
}
.nav-pills .nav-link.tab-CalciumCarbonate.active {
    background-color: #ddd;
    color: #666;
}
.nav-pills .nav-link.tab-Talc.active {
    background-color: #888;
    color: #fff;
}
.nav-pills .nav-link.tab-Dolomite.active {
    background-color: #bbb;
    color: #222;
}
.nav-pills .nav-link.tab-Stearates.active {
    background-color: #f5b69e;
    color: #222;
}
.nav-pills .nav-link.tab-AlkalineSoaps.active {
    background-color: #d19d88;
    color: #222;
}
.nav-pills .nav-link.tab-Esters.active {
    background-color: #d7b9ad;
    color: #222;
}
.nav-pills .nav-link.tab-MetalSoaps.active {
    background-color: #efc4b3;
    color: #222;
}
.nav-pills .nav-link.tab-FattyAcids.active {
    background-color: #fbb092;
    color: #222;
}
.nav-pills .nav-link.tab-OilsWaxes.active {
    background-color: #d38768;
    color: #222;
}
.nav-link {
    background-color: #fff;
}

.Yellow-Pigments {
    border-left: 4px solid #feff8b;
    border-right: 4px solid #feff8b;
    border-bottom: none;
    border-top: none;
}
.Brown-Pigments {
    border-left: 4px solid #8b4110;
    border-right: 4px solid #8b4110;
    border-bottom: none;
    border-top: none;
}
.Orange-Pigments {
    border-left: 4px solid #ff8500;
    border-right: 4px solid #ff8500;
    border-bottom: none;
    border-top: none;
}
.Red-Pigments {
    border-left: 4px solid #f71313;
    border-right: 4px solid #f71313;
    border-bottom: none;
    border-top: none;
}
.Green-Pigments {
    border-left: 4px solid #30e405;
    border-right: 4px solid #30e405;
    border-bottom: none;
    border-top: none;
}
.Blue-Pigments {
    border-left: 4px solid #1f9cee;
    border-right: 4px solid #1f9cee;
    border-bottom: none;
    border-top: none;
}
.Black-Pigments {
    border-left: 4px solid #000;
    border-right: 4px solid #000;
    border-bottom: none;
    border-top: none;
}
/*pigment dispersions*/
.Senasperse-AC {
    padding-bottom: 3em;
    border-left: 4px solid #aaa;
    border-right: 4px solid #aaa;
    border-bottom: none;
    border-top: none;
}
.Senasperse-AS {
    padding-bottom: 3em;
    border-left: 4px solid #777;
    border-right: 4px solid #777;
    border-bottom: none;
    border-top: none;
}
.Senasperse-UN {
    padding-bottom: 4em;
    border-left: 4px solid #ccc;
    border-right: 4px solid #ccc;
    border-bottom: none;
    border-top: none;
}
.Senaflor-LF {
    padding-bottom: 4em;
    border-left: 4px solid #aaa;
    border-right: 4px solid #aaa;
    border-bottom: none;
    border-top: none;
}
.Senasperse-AK {
    padding-bottom: 4em;
    border-left: 4px solid #888;
    border-right: 4px solid #888;
    border-bottom: none;
    border-top: none;
}
.Senasperse-PUPO {
    padding-bottom: 3em;
    border-left: 4px solid #555;
    border-right: 4px solid #555;
    border-bottom: none;
    border-top: none;
}
.CalciumCarbonate {
    border-left: 4px solid #ddd;
    border-right: 4px solid #ddd;
    border-bottom: none;
    border-top: none;
}
.Talc {
    border-left: 4px solid #888;
    border-right: 4px solid #888;
    border-bottom: none;
    border-top: none;
}
.Dolomite {
    border-left: 4px solid #bbb;
    border-right: 4px solid #bbb;
    border-bottom: none;
    border-top: none;
}
.Stearates {
    border-left: 4px solid #f5b69e;
    border-right: 4px solid #f5b69e;
    border-bottom: none;
    border-top: none;
}
.AlkalineSoaps {
    border-left: 4px solid #d19d88;
    border-right: 4px solid #d19d88;
    border-bottom: none;
    border-top: none;
}
.Esters {
    border-left: 4px solid #d7b9ad;
    border-right: 4px solid #d7b9ad;
    border-bottom: none;
    border-top: none;
}
.MetalSoaps {
    border-left: 4px solid #efc4b3;
    border-right: 4px solid #efc4b3;
    border-bottom: none;
    border-top: none;
}
#D {
    border-left: 4px solid #fbb092;
    border-right: 4px solid #fbb092;
    border-bottom: none;
    border-top: none;
}
.OilsWaxes {
    border-left: 4px solid #d38768;
    border-right: 4px solid #d38768;
    border-bottom: none;
    border-top: none;
}
.Yellow-Pigments ul li::marker {
    color: #feff8b;
}
.Brown-Pigments ul li::marker {
    color: #8b4110;
}
.Orange-Pigments ul li::marker {
    color: #ff8500;
}
.Red-Pigments ul li::marker  {
    color: #f71313;
}
.Green-Pigments ul li::marker {
    color: #30e405;
}
.Blue-Pigments ul li::marker {
    color: #1f9cee;
}
.Black-Pigments ul li::marker {
    color: #000;
}
.Senasperse-AC ul li::marker, .Senasperse-AC ul li::marker {
    color: #aaa;
}
.Senasperse-AS ul li::marker, .Senasperse-AS ul li::marker {
    color: #777;
}
.Senasperse-UN ul li::marker, .Senasperse-UN ul li::marker {
    color: #ccc;
}
.Senaflor-LF ul li::marker, .Senaflor-LF ul li::marker {
    color: #aaa;
}
.Senasperse-AK ul li::marker, .Senasperse-AK ul li::marker {
    color: #888;
}
.Senasperse-PUPO ul li::marker, .Senasperse-PUPO ul li::marker {
    color: #555;
}
.CalciumCarbonate ul li::marker, .CalciumCarbonate ul li::marker {
    color: #ddd;
}
.Talc ul li::marker, .Talc ul li::marker {
    color: #888;
}
.Dolomite ul li::marker, .Dolomite ul li::marker {
    color: #bbb;
}
.Stearates ul li::marker, .Stearates ul li::marker {
    color: #f5b69e;
}
.AlkalineSoaps ul li::marker, .AlkalineSoaps ul li::marker {
    color: #d19d88;
}
.Esters ul li::marker, .Esters ul li::marker {
    color: #d7b9ad;
}
.MetalSoaps ul li::marker, .MetalSoaps ul li::marker {
    color: #efc4b3;
}
.FattyAcids ul li::marker, .FattyAcids ul li::marker {
    color: #fbb092;
}
.OilsWaxes ul li::marker, .OilsWaxes ul li::marker {
    color: #d38768;
}
.tab-pane ul {
    list-style-type: square;
}
.tab-pane p {
    margin-bottom: 2em;
}
a.norm, a.norm:hover {
    color: unset;
    text-decoration: none;
}
.btn-prod:link, .btn-prod:visited, .btn-prod:active, .btn-prod:focus {
    color: #fff;
    background-color: orangered;
    border-color: orangered;
    font-size: 1em;
}
.btn-prod:hover {
    color: #000;
    background-color: #ff7d00;
    border-color: #ff7d00;
}

.btn-apps:link, .btn-apps:visited, .btn-apps:active, .btn-apps:focus {
    color: #000;
    background-color: orange;
    border-color: orange;
    font-size: 0.95em;
    margin-right: 0.8em;
    margin-top: 1em;
}
.btn-apps:hover {
    color: #000;
    background-color: #ff850f;
    border-color: #ea7d13;
}
.btn-comp:link, .btn-comp:visited, .btn-comp:active, .btn-comp:focus {
    color: #fff;
    background-color: #46ac00;
    border-color: #45b778;
    font-size: 0.75em;
    letter-spacing: 1.2px;
    text-transform: uppercase
}
.btn-comp:hover {
    color: #000;
    background-color: #2e8b57;
    border-color: #2e8b57;
}
dl.dlt dt a {
    font-weight: bold;
    text-decoration:none;
    font-size: 1.2em;
}
dl.dlt dd a {
    font-size: 0.95em;
    padding-left: 0px;
    text-decoration: none
}
dl.dlt dd  {
    margin-bottom: 30px;
}
dl.dlt dd a:hover {
    color: #222;
}
.btn-dwn {
    padding: 0.1em 0.5em !important;
    font-size: 12px;
    margin: 0em 0.2em;
    line-height:1.2;
}

ul.check, ul.checkw, ul.checkr, ul.arr {
    list-style: none;
}
ul.check li:before {
    content: '✓';
    color: #309219;
    font-weight: bold;
}
ul.check li strong {
    padding-left: 4px;
}
ul.checkw li:before {
    content: '✓';
    color: #fff;
    font-weight: bold;
}
ul.checkr li:before {
    content: '✓';
    color: red;
    font-weight: bold;
}
ul.arr li:before {
    content: '⇾';
    color: #aaa;
    font-weight: bold;
}
li.ind:after {
    /*content: '🠊';
    color: #aaa;*/
    margin-right: 8px;
}
li.sc_prod ul.section-contents li.ind {
    margin-right: 8px;
}





/*.tempbg #applications a {
    color: #999;
    text-decoration: none
}
.tempbg .hd.txt-gry{
    color: #999;
}*/
.nund, a.nund:hover {
    text-decoration: none;
}
.und {
    text-decoration: underline;
}
.pund a {
    text-decoration: underline;
}
.nowrap {
    white-space: nowrap
}
a img {
    border: none;
}
header {
    padding: 2em 0px 0em 0px;
}
.top-nav {
    border-bottom: 1px solid #dedede;
    padding: 7px;
    margin-bottom: 4px;  
    background-color: #ededed;
}
.top-nav ul {
    list-style: none;
    display: flex;
    justify-content: end;
    margin-bottom: 0px;
    font-weight: 900;
    font-size: 0.64rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.top-nav ul li {
    flex-direction: row;
    padding: 1px 5px;
}
.top-nav ul li a {
    border-radius: 2px;
}
.top-nav ul li a:link, .top-nav ul li a:visited {
    background-color: #dfdfdf;
    padding: 5px 8px;
    margin: 0px;
}
.top-nav ul li a:hover, .top-nav ul li a:active {
    background-color: #cdcdcd;
    text-decoration:none;
}

.ul_contact {
    font-size: 1.4em;
}
/*ul.horiz {
    list-style: none;
}*/
/*desktop nav*/
.navdesk {
    display: none;
}
ul.navdeskul {
    list-style:none;
    margin-bottom: 0px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
}
.navdeskul> li {
    padding-right:3%;
    text-align:right;    
}
a:link.section-title, a:visited.section-title {
    color: #000;
    font-weight: bold;
    display: block;
    font-size: 0.92rem;
    padding-bottom: 1px;
    margin-bottom: 12px;
    border-bottom: 1px solid #ddd;
}
a:hover.section-title, a:active.section-title {
    text-decoration: none;
}
ul.section-contents {
    list-style: none;
    font-size: 0.84rem;
    text-align: right;
    margin-left: 0px;
    padding-left: 0px;
}
ul.section-contents li {
    margin: 6px 0px;    
    line-height:1;
}
ul.section-contents li a {
    color: #333;
    display: block;
    border-right: 4px solid #efefef;
    padding: 0px 5px 0px 0px;
    margin: 0px;
    font-weight: 600;
}
ul.section-contents li a:hover {
    color: #000;
    text-decoration: none;
}
/* PRODUCTS */
li.sc_prod a:hover.section-title, li.sc_prod a:active.section-title {
    color: orangered;
    border-bottom: 1px solid orangered;
}
li.sc_prod ul.section-contents a:hover {
    border-right: 4px solid orangered;
}
/* APPLICATIONS */
li.sc_app a:hover.section-title, li.sc_app a:active.section-title {
    color: orange;
    border-bottom: 1px solid orange;
}
li.sc_app ul.section-contents a:hover {
    border-right: 4px solid orange;
}
/* SUPPLY */
li.sc_sup a:hover.section-title, li.sc_sup a:active.section-title {
    color: dodgerblue;
    border-bottom: 1px solid dodgerblue;
}
li.sc_sup ul.section-contents a:hover {
    border-right: 4px solid dodgerblue;
}
/* COMPANY */
li.sc_comp a:hover.section-title, li.sc_comp a:active.section-title {
    color: seagreen;
    border-bottom: 1px solid seagreen;
}
li.sc_comp ul.section-contents a:hover {
    border-right: 4px solid seagreen;
}
.li-seperator {
    border-bottom: 1px solid #dedede;
    padding-bottom: 3px;
    margin-bottom: 3px;
}
/*mobile menu*/
.burger {
    display: block;
    color: firebrick;
    margin-top: 0px;
    margin-right: 20px;
    margin-top: -10px;
}
.navmob {
    display: none;
}
/*.dropdown {
    position: relative;
}*/
nav {
    position: relative;
}
.dropdown:hover .navmob, .dropdown:active .navmob, .dropdown:active .focus {
    display: block;
    z-index: 1000;
}
ul.navmob {
    list-style: none;
    margin: 0px;
    padding: 0px;
    position: absolute;
    top: 50px;
    left: 10px;
    right: 10px;
    border-top: 1px solid #ededed;
    border-left: 1px solid #ededed;
}
ul.navmob li {
    list-style: none;
    font-size: 0.76em;
    text-align:  right;
}
ul.navmob li a:link, ul.navmob li a:visited {
    padding: 10px 0px;
    display: block;
    background-color: white;
    color: #555;
    font-weight: 600;
    padding-right: 10%;
    border-bottom: 1px solid #999;
    border-right: 4px solid #efefef;
}
ul.navmob li a:hover, ul.navmob li a:active {
    background-color: #ededed;
    text-decoration: none;
    color: #333;
    border-right: 4px solid #ccc;
}
.dropdown {
    text-align: right
}

/*lists*/
ul.none {
    list-style: none;
    margin-left: 0px;
    padding-left: 0px;
}
/*headers*/
.hd {
    font-size: 42px;
    margin: 0px;
    padding: 0px;
    font-weight: 700;
    display: inline-block;
    /*text-transform: uppercase;*/
}
.shd {
    font-size: 20px;
    margin: 0px;
    padding: 0px 0px 8px 0px;
    font-weight: 700;
    display: inline-block;
}
/*.tag {
    margin-top: -20px;
    margin-left: 20px;
    color: #aaa;
    font-style: italic;
    background: linear-gradient(90deg, rgba(180,58,58,1) 0%, rgba(252,170,26,1) 16%, rgba(246,250,54,1) 30%, rgba(13,207,19,1) 45%, rgba(5,2,215,1) 64%, rgba(255,81,242,1) 79%, rgba(252,69,82,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-transform: uppercase;
    font-weight: 600;
}*/
.bloc {
    min-height: 20px;
    margin: 2px;
}
.boxcols {
    height: 3px;
    margin-bottom: 1px;
    border-bottom: 3px solid #fff;
    opacity: 0.2;
}
/*slider
.slider {
    border-bottom: 1px solid #ddd;
}*/
.headspace h2 {
    font-size: 1.8rem;
    color: #666;
    color: #FFF;
}
    .headspace h2 img {
        display: inline-block;
        margin-right: 18px;
        vertical-align: top;
        width: auto;
        height: 30px;
    }
.headspace p {
    font-size: 1.1rem;
    color: #000;
    color: #888;
    color: #FFF;
    padding-top: 10px;
    padding-left: 0px;
}
.headspace a {
    color: #444;
}
a.ci-but {/*    background-color: yellow;    background-color: rgba(80,25,80,0.95);   bottom: -20px;    right: 30px;*/
    background-color: rgba(100,10,10,0.95);
    color: #fefefe;
    display: block;
    padding: 0.4rem 2rem;
    font-size: 1.4rem;
    position: absolute;
    bottom: 10px;
    right: 10px;
    font-size: 1rem;
    border: rgba(0,0,0,0.2) 1px solid;
}
a.ci-but:hover {
    background-color: orange;
    color: #fff;
    text-decoration: none;
    background-color: rgba(80,10,80,0.9);
}
.headspace {
    /*margin-top: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #ddd;*/
    min-height: 490px;
}
.colour-bg { /*background-position: -230px 220px;background-size: cover;*/
    background: #fff url('../im/color-explosion.jpg') no-repeat scroll bottom left;
    background-attachment: fixed;
    background-position: -340px 150px;
}
/*.in-carousel-itemL {
    padding: 1rem;
    background-color: rgba(50,50,50,0.4);
    background-color: rgba(255,255,255,0.75);
    border: rgba(0,0,0,0.2) 1px solid;
    color: #fff;
    padding: 2em;
    position: relative;
    margin: 0em 5%;
    width: 90%;
}
.in-carousel-itemL {
    padding: 1rem;
    background-color: rgba(50,50,50,0.4);
    border: rgba(0,0,0,0.2) 1px solid;
    color: #fff;
    padding: 2em;
    position: relative;
    margin: 0em 5%;
    width: 90%;
}
.in-carousel-itemB {
    padding: 1rem;
    padding: 2em;
    position: relative;
    margin: 0em 5%;
    width: 90%;
}
.in-carousel-itemB img {
    margin: auto;
}
*/
.itm6 {
    background-color: unset;
    border:  unset;
    padding: 2em 0em;
}
/*.carousel-control-next, .carousel-control-prev {
    width: 8%;
}
.carousel-control-next-icon, .carousel-control-prev-icon {
    color: #fff;
    height: 3rem;
    width: 3rem;
    font-weight: bold;
}

.carousel-control-prev-icon {
 background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23222' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
}

.carousel-control-next-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23222' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}
.carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0'/%3e%3c/svg%3e")
}
.carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708'/%3e%3c/svg%3e")
}

.carousel .carousel-control-prev,.carousel .carousel-control-next {
    visibility: hidden;
    opacity: 1;
}
.carousel:hover .carousel-control-prev,.carousel:hover .carousel-control-next {
    visibility: visible;
    animation-duration: 1s;
    transition-timing-function: linear;
}
.carousel:hover .carousel-control-prev {
    animation-name: FadeInPrev;
}
.carousel:hover .carousel-control-next {
    animation-name: FadeInNext;
}
@keyframes FadeInPrev {
    0% {
        opacity: 0;
        padding-left: 40px;
    }

    100% {
        opacity: 1;
        padding-left: 0px;
    }
}
@keyframes FadeInNext {
    0% {
        opacity: 0;
        padding-right: 40px;
    }

    100% {
        opacity: 1;
        padding-right: 0px;
    }
}

*/
/*card
.card-text {
    font-size: 0.84rem;
    color: #fff;
}*/
.card {
    margin-bottom : 1em;
}
.card-footer {
    vertical-align: top;
    text-align:right;
    position:relative;
}
.card-footer:hover, .card-footer:active {
    background-color: #dedede;
}
.card-footer a:link, .card-footer a:visited {
    color: #666;
}
.card-footer a:hover, .card-footer a:active {
    text-decoration:none;
    color: #222;
}
/*.cont_blocks {
    background-color: #dedede;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    border: 1px solid #fff;
    background-blend-mode: luminosity;
    min-height: 350px;
}
.cont_blocks:hover {
    background-blend-mode: normal;
}*/
.cont_blocks {
    margin-bottom: 2em;
    cursor: pointer;
}
.cont_body {
    display: block;
    padding: 1em 1em 1em 1em;
    color: #fff;
    background-color: #dedede;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    border: 1px solid #fff;
    background-blend-mode: luminosity;
    min-height: 350px;
}
.cont_body:hover {
    background-blend-mode: normal;
}
.cont_body .cont_hd {
    display: block;
    padding: 0em;
    font-size: 2.2em;
    text-shadow: rgba(10, 10, 10, 0.8) 0px 0px 10px, rgba(10, 10, 10, 0.6) 0px 0px 20px, rgba(10, 10, 10, 0.4) 0px 0px 30px;

        /*    margin-top: 0.1em;
    margin: 0.5em auto 1.2em auto;
    text-transform: uppercase;
    text-align: center;
    background-color: rgba(0,0,0,0.3);
    font-weight: bold;
    -webkit-text-stroke: 1px #000;
    */
    font-family: 'Open Sans', sans-serif;
    letter-spacing: normal;
}
.cont_body H2 a {
    color: white;
}
.appTR {
    display: inline-block;
    display: flex;
    justify-content: end;
}
.appTR a {
    background-color: rgba(0,0,0,0.3);
    color: #dedede;
    font-size: 8px;  
    padding: 0px 2px;
    text-transform: uppercase;
}
.appTR a:hover {
    color:white;
}
.card-text, a.card-text {
    color: #fff;
    font-size: 1.2em;
    font-weight: bold;
}
.card-text.stff {
    color: #777;
    font-size: 1em;
    font-weight: normal;
}
.card-text a, .card-title a {
    color: #fff;
}
/*footer*/
footer {
    background-color: #dedede;
    padding: 60px 0px 20px 0px;
    margin-top: 5em;
    font-size: 0.925em;
}
footer li {
    margin-bottom: 0.5em;
}
footer h3 {
    font-size:18px;
    font-weight:bold;
    margin-bottom:1.1em;
}
footer a:link, footer a:visited {
    font-weight:normal;
    text-decoration: none;
}
footer a:hover, footer a:active {
    font-weight: bold;
    text-decoration: none;
}
footer .isos {
  max-width: 150px;
  height:auto;
  margin: 1em auto
}
    /*text size*/
    .text-small {
        font-size: 0.8rem;
    }
.text-smaller {
    font-size: 0.7rem;
}
.text-big {
    font-size: 1.2rem;
}
.text-bigger {
    font-size: 1.4rem;
}
.txt-lred {
    color: rgb(255, 153, 153);
}
/*colour*/
.txt-white {
    color: #fff;
}
.txt-gry {
    color: #555;
}
.txt-dgry {
    color: #333;
}
.txt-lgry {
    color: #aaa;
}
.txt-blck {
    color: #000;
}
.sub {
    color: #aaa;
    margin-top: -10px;
    margin-bottom: -10px;
    font-size: 22px;
}
/*backgrounds*/
.bg-opaq-wh {
    background-color: rgba(255,255,255,0.8);
    background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
    padding-bottom: 40px;
}
.bg-opaq-bl {
    background-color: rgba(0,0,0,0.1);
}
.bg-lblue {
    background-color: #49b0ed;
}
.bg-lgrey {
    background-color: #dedede;
}
.bg-llgrey {
    background-color: #eeeeee;
}
.bg-grey-grad {
    background: #eee;
    background: radial-gradient(circle,rgba(221, 221, 221, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(221, 221, 221, 1) 100%);
}
.sustainability {
    background-color: green;
    background: #008000 url('../im/sustain.jpg') no-repeat scroll 85% center;
}
.bg-blue-arrows {
    background: #49b0ed url('../im/bue-arrows.png') repeat-x scroll center left;
}
.bg-grey-arrows {
    background: #dedede url('../im/grey-arrows.png') repeat-x scroll center left;
}

.in-blue-arrow {
    background-color: #3c8cbc;
    background-color: #49b0ed;
    padding: 2em;
}
.in-grey-arrow {
    background-color: #cecece;
    padding: 2em;
}
.py-6 {
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
}
.my-6 {
    margin-top: 4rem !important;
    margin-bottom: 4rem !important;
}
.appHold {
    border-bottom: 1px #dedede solid; 
    margin-top: 0.9em;
}
.appHold a:link, .appHold a:visited {
    color: #696969;
    text-decoration: none;
}
.appHold a:hover, .appHold a:active {
    color: #333;
    color: orangered;
    text-decoration: none;
}
.tab-pane h3 {
    margin-top: 1.5em;
}
/*.intro {
    background-color: white;
    padding: 2em;
    border-radius: 0.5em;
    color: #333
}*/
.textintro {
}
.video-bg {
    position: fixed;
    top: 80px;
    left: -30%;
    width: 150%;
    height: auto;
    overflow: hidden;
    z-index: -1;
}
#headvid {
    width: 100%
}
.logo-home {
    height: auto;
    max-width: 100%;
}
.logo {
    max-width: 100%;
    height: auto;
}
.slidelogo {
    margin-top: 30px;
}
.headspace h2 {
    font-size: 2rem;
}
.headspace h2 img {
    width: unset;
    height: unset;
}
.headspace p {
    font-size: 1rem;
    padding-left: 0px;
}
.contButs a {
    font-size: 0.8rem;
    color: #888;
}
.contButs a {
    display: block;
    margin-bottom: 8px; 
}
.text-lgrey {
    color: #999;
}
/*glow homepage bigtag*/
@keyframes fadeGlow {
    from {
        text-shadow: 0 0 0px rgba(255, 255, 255, 0);
    }
    to {
        text-shadow: 0 0 10px rgba(100, 100, 100, 0.8), 0 0 20px rgba(100, 100, 100, 0.6), 0 0 30px rgba(100, 100, 100, 0.4);
    }
}
.bigtag {
    animation: fadeGlow 8s ease-in forwards; 
}
.headspace {
    min-height: 200px;
}
.headspace {
    padding: 20px 0% 20px 0%;
    padding: 50px 0% 20px 0%;
}
.headspace .bigtag {
    font-size: 40px;
    margin-top: 90px;
    margin-bottom: 0px;
}
/*product display*/
.product-hold {

}
.product-row {
    display: flex;
    flex-wrap: nowrap; /*wrap wrap-reverse*/
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid #ddd;
}
.product-name {
    width: 25%;
    font-weight: 600;
    vertical-align:middle;
}
.product-shade {
    width: 15%;
}
.product-shade span {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: block;
    border: 1px solid #ddd;
}
.product-CI {
    width: 20%;
}
.product-LFast {
    width: 20%;
    text-align: center;
}
.product-PigLoad {
    width: 20%;
    text-align: center;
}
.bold {
    font-weight: 600
}
.bolder {
    font-weight: 900
}

.prod-top {
    padding-top: 12px;
}
/*.lnkHoz {
    position: unset;
    bottom: unset;
}
.relt {
    position: unset; 
    padding-bottom:30px;
}*/
.lnkHoz  {
    text-align: left;
}
.lnkHoz a {
    display: block;
    margin-bottom: 6px;
}
.lnkHoz {
   visibility: hidden;
    /* display: none;*/
}
.lnkHoz.showit {
   visibility: visible;
       
    /* display: none;*/
}
.initnav {
/*    display: none;*/
}
/*.imRhold {
    display: flex;
    flex-direction: column;
}*/
/*very small devices */
@media (min-width: 450px) {
    .headspace .bigtag {
        margin-top: 100px;
    }
}
/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
    .lnkHoz a {
        display: inline-block;
        margin-right: 3em;
    }
    .headspace .bigtag {
        font-size: 50px;
        margin-top: 90px;
    }
    .logo-home {
        height: auto;
        max-width: 280px;
    }
    .slidelogo {
        margin-top: 70px;
    }
    .video-bg {
        position: fixed;
        top: 100px;
        left: 0;
        width: 100%;
    }    
    .colour-bg {
        background-position: -80px 190px;
        background-position: -490px 160px;
        background-size: cover;
    }
    .headspace {
        min-height: 280px;
    }
    .headspace {
        padding: 40px 10%;
        padding: 50px 4% 40px 4%;
    }
}
/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
    /*imRhold {
        flex-direction: row;
    }*/
    .lnkHoz {
        text-align: left
    }
    .lnkHoz a {
        display: block;
    }
    .prod-top {
        padding-top: 0px;
    }
    .headspace .bigtag {
        font-size: 54px;
        margin-top: 60px;
    }
    .logo {        
        max-width: 300px;
    }
    .tab-pane {
        /*padding-left: 15%;
        padding-top: 4em;
        padding: 4em 0px 4em 12%;
        padding: 1.5em 15% 4em 15%;*/
    }
    .contButs a {
        display: inline-block;
        margin-right: 8px;
    }
    .slidelogo {
        margin-top: 30px;
    }
    .video-bg {
        position: fixed;
        top: 00px;
    }    
/*    .logo {
        max-width: 200px;
    } */
    .colour-bg {
        background-position: -200px 130px;
        background-size: cover;
    }
    .headspace {
        min-height: 300px;
    }
    .headspace {
        padding: 10px 5%;
        padding: 70px 15% 20px 15%;
    }

    .Yellow-Pigments {
        border-top: 4px solid #feff8b;
        border-bottom: 4px solid #feff8b;
        border-left: none;
        border-right: none;
    }
    .Brown-Pigments {
        border-top: 4px solid #8b4110;
        border-bottom: 4px solid #8b4110;
        border-left: none;
        border-right: none;
    }
    .Orange-Pigments {
        border-top: 4px solid #ff8500;
        border-bottom: 4px solid #ff8500;
        border-left: none;
        border-right: none;
    }
    .Red-Pigments {
        border-top: 4px solid #f71313;
        border-bottom: 4px solid #f71313;
        border-left: none;
        border-right: none;
    }
    .Green-Pigments {
        border-top: 4px solid #30e405;
        border-bottom: 4px solid #30e405;
        border-left: none;
        border-right: none;
    }
    .Blue-Pigments {
        border-top: 4px solid #1f9cee;
        border-bottom: 4px solid #1f9cee;
        border-left: none;
        border-right: none;
    }
    .Black-Pigments {
        border-top: 4px solid #000;
        border-bottom: 4px solid #000;
        border-left: none;
        border-right: none;
    }
    /*pigment dispersions*/
    .Senasperse-AC {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #aaa;
        border-top: 4px solid #aaa;
    }
    .Senasperse-AS {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #777;
        border-top: 4px solid #777;
    }
    .Senasperse-UN {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #ccc;
        border-top: 4px solid #ccc;
    }
    .Senaflor-LF {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #aaa;
        border-top: 4px solid #aaa;
    }
    .Senasperse-AK {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #888;
        border-top: 4px solid #888;
    }
    .Senasperse-PUPO {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #555;
        border-top: 4px solid #555;
    }
    .CalciumCarbonate {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #ddd;
        border-top: 4px solid #ddd;
    }
    .Talc {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #888;
        border-top: 4px solid #888;
    }
    .Dolomite {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #bbb;
        border-top: 4px solid #bbb;
    }
    .Stearates {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #f5b69e;
        border-top: 4px solid #f5b69e;
    }
    .AlkalineSoaps {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #d19d88;
        border-top: 4px solid #d19d88;
    }
    .Esters {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #d7b9ad;
        border-top: 4px solid #d7b9ad;
    }
    .MetalSoaps {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #efc4b3;
        border-top: 4px solid #efc4b3;
    }
    .FattyAcids {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #fbb092;
        border-top: 4px solid #fbb092;
    }
    .OilsWaxes {
        border-left: none;
        border-right: none;
        border-bottom: 4px solid #d38768;
        border-top: 4px solid #d38768;
    }
}
/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    .headspace .bigtag {
        font-size: 54px;
        margin-top: 130px;
    }
    .slidelogo {
        margin-top: 60px;
    }
    .video-bg {
        position: fixed;
        top: 120px;
    }
    .colour-bg {
        background-position: -520px 220px;
        background-size: cover;
    }
    .navdesk {
        display: block;        
    }
    .burger {
        display: none;
    }
    .headspace {
        padding: 10px 5%;
        padding: 90px 20% 30px 20%;
    }
    .headspace {
        min-height: 275px;
    }
}
/*X-Large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
    .lnkHoz {
        text-align: left
    }
    .lnkHoz a {
        display: inline-block;
        margin-right: 0.9em;
        font-size: 14px;
    }
    /*
        .lnkHoz {
        position: absolute;
        bottom: 9px;
    }*/
    .relt {
        position: relative;
    }
    .headspace .bigtag {
        font-size: 64px;
        margin-top: 99px;
    }
    .video-bg {
        position: fixed;
        top: 55px;
        left: 0;
        width: 100%;
    }
    .headspace {
        padding: 10px 5%;
        padding: 90px 22% 30px 22%;
    }
    .headspace {
        min-height: 275px;
    }
}
/*XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {
    /*.lnkHoz a {
        display: inline-block;
        margin-right: 1.8em;
        font-size: unset;
    }
    .lnkHoz {
        bottom: 16px;
    }*/
    .logo {
        /*margin-left: 160px;*/
    }
    .video-bg {
        position: fixed;
        top: -20px;
        left: -1%;
        width: 95%;
    }
    .colour-bg {
        background-position: -180px 150px;
        background-size: contain;
    }
    .headspace {
        padding: 10px 5%;
        padding: 50px 28% 30px 28%;
    }
    .headspace {
        min-height: 300px;
        min-height: 250px;
    }
}
/*.sizer {
    width: 80px;
    height: 40px;
    font-weight: bold;
    background-color: #fff;
    position: fixed;
    bottom: 20px;
    right: 0;
    text-align: right;
}*/

.txt-grad-rainbow {
    background: rgb(180,58,58);
    background: linear-gradient(90deg, rgba(180,58,58,1) 0%, rgba(252,170,26,1) 16%, rgba(246,250,54,1) 30%, rgba(13,207,19,1) 45%, rgba(5,2,215,1) 64%, rgba(255,81,242,1) 79%, rgba(252,69,82,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.txt-grad-redyellow {
    background: rgb(238,54,30);
    background: linear-gradient(90deg, rgba(238,54,30,1) 0%, rgba(225,166,38,1) 28%, rgba(252,250,26,1) 52%, rgba(252,147,26,1) 70%, rgba(252,41,26,1) 92%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.txt-grad-bluesyellow {
    background: rgb(31,104,162);
    background: linear-gradient(90deg, rgba(31,104,162,1) 0%, rgba(255,252,0,1) 38%, rgba(241,255,125,1) 43%, rgba(125,189,255,1) 57%, rgba(0,5,255,1) 85%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.txt-grad-purpredorange {
    background: rgb(179,58,180);
    background: linear-gradient(90deg, rgba(179,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.txt-grad-greens {
    background: rgb(31,162,39);
    background: linear-gradient(90deg, rgba(31,162,39,1) 0%, rgba(64,225,38,1) 28%, rgba(145,240,61,1) 43%, rgba(10,209,87,1) 81%, rgba(113,255,77,1) 86%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.txt-grad-purpleblue {
    background: rgb(112,31,162);
    background: linear-gradient(90deg, rgba(112,31,162,1) 0%, rgba(38,199,225,1) 28%, rgba(176,38,225,1) 66%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}/*.*/




/*.itm1 {
    background-color: rgba(170,30,30, 0.6);
}
.itm2 {
    background-color: rgba(100,30,100, 0.6);
}
.itm3 {
    background-color: rgba(20,180,180, 0.8);
}
.itm4 {
    background-color: rgba(10,200,10, 0.6);
}
.itm5 {
    background-color: rgba(10,130,10, 0.6);
}
.itm6 {
    background-color: rgba(20,255,230, 0.6);
}
.itm1 .ci-but {
    background-color: rgba(170,30,30, 0.9);
}
.itm2 .ci-but {
    background-color: rgba(100,30,100, 0.9);
}
.itm3 .ci-but {
    background-color: rgba(20,180,180, 0.9);
}
.itm4 .ci-but {
    background-color: rgba(10,200,10, 0.9);
}
.itm5 .ci-but {
    background-color: rgba(10,130,10, 0.9);
}
.itm6 .ci-but {
    background-color: rgba(20,255,230, 0.9);
}
.itm1 .ci-but:hover {
    background-color: rgba(170,30,30, 0.2);
}
.itm2 .ci-but:hover {
    background-color: rgba(100,30,100, 0.2);
}
.itm3 .ci-but:hover {
    background-color: rgba(20,180,180, 0.2);
}
.itm4 .ci-but:hover {
    background-color: rgba(10,200,10, 0.2);
}
.itm5 .ci-but:hover {
    background-color: rgba(10,130,10, 0.2);
}
.itm6 .ci-but:hover {
    background-color: rgba(20,255,230, 0.2);
}*/