


.blogbanner {
  margin-bottom: 32px;
  height: 170px;
  float: left;
  overflow: hidden;
  width: 100%;
  position: relative;
}


.blogbanner:before {
  height: 100%;
  width: 100%;
  background: rgb(000,000,000);
  background: linear-gradient(180deg, rgb(255 255 255) 0%, rgba(255,255,255,0) 100%);
  position: absolute;
  z-index: 3;
  pointer-events: none;
  content: "";
}

.results {
 float: left;
 width: 100%;
 display: block;
 grid-column: span 4 / auto;
}

.productlisting {
 grid-column: span 4 / auto;
 /* display: grid; */
 grid-template-columns: repeat(12, 1fr);
 margin-bottom: 12px;
 /* gap: 16px; */
 border-bottom: 1px solid rgb(148, 144, 125);
 background-color: var(--nuvo-slate);
 padding: 8px;
 text-align: center;
 float: left;
 width: 24%;
 margin: 0.5%;
}

.applications, .modalities, .producttags  {
  float: left;
  width: 100%;
  margin-bottom: 8px;
  border: 1px solid var(--nuvo-slate);
  padding: 8px;
}

.applications label, .modalities label, .producttags label  {
  float: left;
  width: 100%;
  margin-bottom: 0px;
}

.productfilter h3 {
 margin: 0px;
 padding: 0px;
 color: var(--qms-accent);
 font-size: 20px;
}

.pagination {
  float: left;
  width: 100%;
  display: flex;
}

.pagination ul {
  float: left;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
  background-color: var(--nuvo-slate);
}

.pagination ul li {padding: 0px;background-color: var(--qms-darkblue);color: #fff;margin: 1px;}

.pagination ul li a{padding: 16px 16px;background-color: var(--qms-darkblue);color: #fff;/* margin: 1px; */float: left;}

.pagination ul li span{padding: 16px 16px;background-color: var(--nuvo-slate);color: #ccc;/* margin: 1px; */float: left;}

[aria-current]:not([aria-current="false"]) {
  font-weight: 600;
  color: var(--qms-accent);
}



.productwrapper .nuvo-grid {grid-column: span 3 / auto;display: grid;gap: 16px;grid-template-columns: repeat(12, 1fr);position: relative;z-index: 0;max-width: 1480px;width: 100%;}
.productfilter {grid-column: span 1 / auto;
               }

.productwrapper {
  background-color: #fff;
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(4, 1fr);
  position: relative;
  z-index: 0;
  max-width: 1480px;
  width: 100%;
}




.productlistingimage {
 float: left;
}

.productlistingimage a{
 float: left;
 wdith: 100%;
}

.productlistingimage img {
 float: left;
 display: block !important;
}

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


.productlistingtext a{
 
 
 float: left;
 width: 100%;
                   }


.productlistingtext h3{padding: 0px;
                       
                float: left;
                       width: 100%;
                       margin-top: 12px;font-size: 17px;height: 48px;}




.productmain {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, 1fr);
  position: relative;
  z-index: 0;
  max-width: 1480px;
  width: 100%;
}

.productswrapper h1 {
  font-size: 36px;
  line-height: 1.4;
  
}


.brandname {
  margin: 8px;
  border-bottom: 1px solid #ccc;
  width: 100%;
  padding-bottom: 12px;
  float: left;
}

.brandname span {
  background-color: var(--qms-accent);
  width: auto;
  padding: 8px;
  color: #fff;
  border-radius: 4px;
 display: inline-block;
  
}


.specname {
  padding: 4px 12px;
  float: left;
  background-color: var(--qms-accent);
  border-radius: 4px;
  margin-right: 12px;
  margin-bottom: 8px;
}

.specdetail {
  padding: 4px;
  font-size: 22px;
  font-weight: 600;
}


@media screen and (max-width: 1180px) {


.productlisting {

 width: 32.333333%;
 margin: 0.5%;
}

}

@media screen and (max-width: 768px) {



 .results {
 float: left;
 width: 100%;
 display: block;
 grid-column: span 6 / auto;
}



  .productwrapper .nuvo-grid {
    grid-column: span 6 / auto;
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(6, 1fr);
    position: relative;
    z-index: 0;
    max-width: 1480px;
    width: 100%;
    }
  
.productfilter {grid-column: span 4 / auto;}

.productlisting {
  width: 48%;
}

}


@media screen and (max-width: 540px) {



  .productwrapper .nuvo-grid {
    grid-column: span 12 / auto;
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(6, 1fr);
    position: relative;
    z-index: 0;
    max-width: 1480px;
    width: 100%;
    }
  
