html body {
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-tap-highlight-color: transparent;
    background-color: #f2f4f7;
    background: #f2f4f7;
    font-size: 18px;
    line-height: 26px;
}
h1, h2, h3, h4, h5, h6 {
    line-height: 1.3em;
    margin-bottom: 30px;
    color: #321e41;
    text-transform: none !important
}
.cookies-eu-banner {
    background: #444;
    color: #fff;
    padding: 6px;
    font-size: 13px;
    text-align: center;
    position: fixed;
    bottom: 0;
    /* width: 100%; */
    z-index: 10;
    
    } 
    .cookies-eu-banner button {
    text-decoration: none;
    background: #222;
    color: #fff;
    border: 1px solid #000;
    cursor: pointer;
    padding: 4px 7px;
    margin: 2px 0;
    font-size: 13px;
    font-weight: 700;
    transition: background 0.07s, color 0.07s, border-color 0.07s;
    
    }
    .cookies-eu-banner button:hover {
    background: #fff;
    color: #222;
    }
    .hidden {
    display: none;
    }
    
header {
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom-width: 10px;
    border-color: #ebebeb;
    background: #fff;
   /* border-bottom: 10px solid #ebebeb;
    */
}

.mt-5, .my-5 {
    margin-top: 1rem!important;
}
.logo-bar {
    padding-top: 5px;
    padding-bottom: 5px;
    margin: 0 auto;
    text-align: center
}
.logo-bar img {
    margin: 0 30px;
}
.icnbar ul {
    text-align: right;
    margin-bottom: 0;
    margin-right: 14px;
}
.add-menu li {
    position: relative;
    display: inline-block;
    margin: 0 15px;
    vertical-align: top;
    font-size: 16px;
}
.add-menu a {
    display: block;
    position: relative;
    text-align: left;
    white-space: nowrap;
    color: inherit;
    -webkit-transition: 0.4s all;
    transition: 0.4s all;
    text-decoration: none;
}
.topMain {
    padding: 24px 35px 30px;
    background-color: #fff;
    border-radius: 8px 8px 0 0;
}
section.homePage.heroBanner {
    position: relative;
    padding: 20px 0 60px;
}
.topMain h1 {
    margin: 0 0 10px;
    padding: 0;
    font-family: "Roboto", sans-serif;
    font-size: 36px;
    font-weight: 900;
    color: #404347;
    line-height: 48px;
}
.belowHeadingDescription {
    margin: 0;
    padding: 0;
    font-family: "Open Sans", sans-serif;
    font-size: 20px;
    line-height: 23px;
    font-weight: 400;
    color: #2c3038;
}
.pageNavigation {
    text-align: center;
    border: solid 1px #457ae6;
    background-color: #fff;
    margin: 20px auto 10px;
    max-width: 625px;
}
.pageNavigation a {
   font-family: "Roboto", sans-serif;
    text-decoration: none;
    vertical-align: middle;
    padding: 9px 0px;
    text-align: center;
    color: #007bff;
    font-size: 20px;
    font-weight: 600;
}
.pageNavigation a.active {
    background-color: #007bff;
    color: #fff;
    border-radius: 0;
}
.cardsInfo {
    margin: 0 0 30px;
    background-color: #f2f4f7;
}
.cardsInfo h2 {
    margin: 0;
    padding: 12px 0;
    font-family: "Roboto", sans-serif;
    font-size: 28px;
    font-weight: 700;
    text-align: center;
    color: #fff;
}
.cardsInfo.blueCard h2 {
    background-color: #0000ff;
}
.cardsInfo .cardBody {
    margin: 0;
    padding: 20px 25px 42px;
}
ol, ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.cardsInfo ul li {
   /* display: flex;
    */
    list-style: none;
    margin: 0 0 20px;
    padding: 0;
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    color: #2c3038;
}

.cardsInfo h3 {
    position: relative;
    margin: 0 0 15px;
    padding: 0;
    font-family: "Roboto", sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: #2c3038;
}
.sectionProducts,.sectionFooter {
    padding: 20px 35px 30px;
    background-color: #ebedf1;
}
.sectionProducts article {
    background: #fff;
    padding: 20px 34px 30px;
    border: 1px solid #efefef;
    border-top: 3px solid #0000ff;
    margin: 20px auto 50px;
    border-radius: 4px;
    box-shadow: 0 2px 13px 0 rgb(0 0 0 / 5%);
    position: relative;
    overflow: hidden;
}
.sectionProducts article:last-child,.cardsInfo ul li:last-child,p:last-child{
    margin-bottom: 0;
}
.sectionProducts h3 {
    font-family: "Roboto", sans-serif;
    margin: 4px 0 0;
    line-height: 1;
    padding-right: 100px;
}
.sectionProducts h3 a {
    text-decoration: none;
    font-size: 28px;
    font-weight: bold;
    color: #404347;
}
.sectionProducts .byLineProduct {
    font-size: 18px;
    line-height: 1.5;
    color: #40394a;
    margin-bottom: 25px;
}
.sectionProducts .guranteeImgBox {
    position: absolute;
    top: 10px;
    right: 45px;
}
.sectionProducts .byLineProduct a {
    text-decoration: underline;
    color: blue;
}
.sectionProducts .productIimage, .sectionProducts .circleSummaryProduct, .sectionProducts .gradeProduct {
    display: inline-block; 
    padding: 24px;
    text-align: center;
    height: 200px;
}
.sectionProducts .productIimage img {
    max-height: 190px;
    margin-top: -20px;
}
.sectionProducts svg {
    transform: rotate(190deg);
}
.sectionProducts .percent {
    stroke-dasharray: 100;
    stroke-dashoffset: calc(100 - var(--val));
}
.sectionProducts .fifty {
    --val: 52;
}
.sectionProducts .sixty {
    --val: 60;
}
.sectionProducts .seventy {
    --val: 71;
}
.sectionProducts .eighty {
    --val: 82;
}
.sectionProducts .ninety {
    --val: 90;
}
.sectionProducts .ninetyFive {
    --val: 96;
}
.sectionProducts .hundered {
    --val: 100;
}
.circleRating h4, .gradeProduct p {
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 0;
    margin-top: 25px;
}
.circleRating h5 {
    color: #4a4a4a;
    font-size: 24px;
    font-weight: bold;
    line-height: 0.83;
    text-align: center;
    position: absolute;
    top: 82px;
    left: 50%;
    transform: translateX(-50%);
}
.gradeProduct h1 {
    font-family: "Open Sans", sans-serif;
    font-size: 72px;
    font-weight: normal;
    line-height: 1.6;
    margin-bottom: 0;
}
.productProsBottomLine h3 {
    margin: 25px 0 15px;
    padding: 0;
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #404347;
}
ul.listWithIcon li {
    position: relative;
    font-size: 17px;
    line-height: 1.25;
    color: #2c3038;
    margin-bottom: 10px;
    padding-left: 30px;
}
.checkIcon li:before, .crossIcon li:before {
    position: absolute;
    left: 0;
    font: normal normal normal 14px/1 FontAwesome;
    content: "\f05d";
    color: #59b377;
   /* position: absolute;
    left: 0;
    top: 0;
    */
    font-size: 24px;
}
.crossIcon li:before {
    content: "\f05c";
    color: #eb5757;
}
.productProsBottomLine {
    margin-left: -50px;
    margin-right: -50px;
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
    padding-left: 30px;
    padding-right: 30px;    padding-bottom: 20px;
}
.productCrons h5 {
    margin-top: 18px;
    margin-bottom: 10px !important;
}
.productCrons p {
    font-size: 17px;
    line-height: 1.4;
    color: #2c3038;
}
.borderRight {
    border-right: 1px solid #f0f0f0;
}
.button {
    font-family: "Roboto", sans-serif;
    display: inline-block;
    padding: 11px 42px; 
    color: #fff;
    font-size: 18px;
    transition: all 0.3s;
    position: relative;
    overflow: hidden;
    z-index: 1;
    min-width: 200px;
    font-weight: bold;
    text-decoration: none;
}
.button:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #eb525b; 
    z-index: -2;
}
.button:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background-color: #f31423;
    transition: all 0.3s; 
    z-index: -1;
}
.button:hover {
    color: #fff;
    text-decoration: none;
}
.button:hover:before {
    width: 100%;
}
.productFooter {
    margin-top: 18px;
}
.productProsBottomLine h3:last-of-type {
    margin-top: 25px;
}

.sectionFooter h3 {
    margin: 0;
    padding: 20px 40px;
    font-size: 16px;
    font-weight: 700;
    color: #404347;
    background-color: #fff;
    margin-left: -40px;
    margin-right: -40px;
    padding-left: 40px;
    padding-right: 40px;
    text-transform: uppercase;
}
.sectionFooter  ol {
    padding: 20px 40px;    padding-left: 0;
}
.sectionFooter ol li {
    margin: 0 0 24px;
    padding: 0;
    font-family: "Open Sans",sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #404347;
}
.sectionFooter ol li:last-of-type {
    margin-bottom: 0;
}
.backToTop {
    background: white;
    text-align: center;
    padding: 10px;
}

footer#footer {
    background: #fff;
    padding: 20px 0px;
}
.footerLinks ul{ display: flex; flex-wrap: wrap; justify-content: center; padding: 0;}
.footerLinks ul li{ padding-left: 10px; padding-right: 10px;font-size: 14px; color: #9b9b9b;
    text-decoration: none;}
    .footerLinks {
        padding-top: 20px;
        padding-bottom: 20px;
    }
.footerDisclaimer{
    border-top: 1px solid #f0f0f0;
    margin: 0;
    padding: 19px 0 0px;

}
.footerDisclaimer p {
    font-size: 11px;
    line-height: 1.25;
}
.asideBar .card {     padding: 0 15px 15px;  margin-bottom: 20px;     border-radius: 8px;}
.asideBar  h5 {
    font-family: "Open Sans",sans-serif;
    overflow: hidden;
     font-size: 18px;
    font-weight: 600;
     color: #fff;
    padding: 4px 15px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;

    margin-left: -15px;
    margin-right: -15px;
    
}
.asideBar  p{ font-size: 14px;}

/*** RADIAL PROGRESS ***/
/* Circumference = 2πr */
/* π = 3.1415926535898 */
/* r = 35 */
svg.radial-progress {
    height: auto;
    max-width: 95px;
    transform: rotate(-90deg);
    width: 100%;
}
svg.radial-progress circle {
    fill: rgba(0,0,0,0);
    stroke: #fff;
    stroke-dashoffset: 219.91148575129; /* Circumference */
    stroke-width: 6;
}
svg.radial-progress circle.incomplete {
    opacity: 0.25;
}
svg.radial-progress circle.complete {
    stroke-dasharray: 219.91148575129; /* Circumference */
}
svg.radial-progress text {
    fill: #000;
    text-anchor: middle;
}
.progressAnimatedBar .sidebarHeading {
    font-family: "Roboto",sans-serif;
    font-size: 24px;
    line-height: 24px;
    color: #404347;
    width: 120px;
    text-align: left;
    padding-left: 10px;  
}

.progressAnimatedBar {
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 12px;
    margin-bottom: 20px;
}
.gradeProduct{ position: relative;}
/*** COLORS ***/
/* Primary */
svg.radial-progress:nth-of-type(6n+1) circle {
    stroke: #007bff;
}

/* Secondary */
svg.radial-progress:nth-of-type(6n+2) circle {
    stroke: #83e4e2;
}

/* Tertiary */
svg.radial-progress:nth-of-type(6n+3) circle {
    stroke: #fd6470;
}

/* Quaternary */
svg.radial-progress:nth-of-type(6n+4) circle {
    stroke: #fca858;
}

/* Quinary */
svg.radial-progress:nth-of-type(6n+5) circle {
    stroke: #fddc32;
}
.asideBar .listIcon i{
    -webkit-text-stroke: 2px white;
    font-size: 36px;
}
.asideBar .cardBody ul li{ margin-bottom: 14px;}
.asideBar .cardBody ul li a{
    color: #2c3038;
    font-size: 14px;
    line-height: 19px;
    font-weight: 600;
    text-decoration: underline;text-align: left;
}
.asideBar .cardBody span.listText {
    padding-left: 10px;
}
.asideBar {
    position: sticky;
    top: 5px;
}
.backToTop p{margin-bottom: 0;}
.progressBar {
    position: relative;
    height: 90px;
    width: 90px;
    z-index: 999;
    display: inline-block;
    overflow: visible;
}
.progressBar .percent {
    position: absolute;
    top: 28px;
    right: -4px;
    font-size: 22px;
    font-weight: 500;
    color: #404347;
    display: inline;
    text-align: center;
    color: #404347;
    line-height: normal;
    width: 100%;
}
.progressBar svg.progress-circle {
    overflow: visible;
    fill: #cdcdcd;
    z-index: 999;
}
.progressBar svg path {
    fill: none;
}
.progressBar svg.progress-circle path {
    stroke: rgba(69, 122, 230);
    stroke-width: 7;
}
.progressBar svg.progress-circle-background {
    overflow: visible;
    fill: #cdcdcd;
    position: relative;
    top: -90px;
    z-index: -1;
}
.progressBar svg path {
    fill: none;
}
.progressBar svg.progress-circle-background path {
    stroke: #cdcdcd;
    stroke-width: 7;
    stroke-dashoffset: 0;
}

 .circle-summary {
    position: relative;
    padding-top: 120px;
}
 .circle-summary svg {
    width: 8rem;
    height: 8rem;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    fill: none;
}
 .circle-summary svg:nth-child(1) path {
    fill: none;
    stroke-width: 6;
    stroke-dasharray: 629;
    stroke: #6f6f6f;
}
.circle-summary svg:nth-child(1) path {
    stroke: #59b377;
    stroke-width: 20px;
}
.circle-summary svg:nth-child(2) {
    transform: translateX(-50%) rotate(-90deg);
    -webkit-transform: translateX(-50%) rotate(-90deg);
    -moz-transform: translateX(-50%) rotate(-90deg);
    -ms-transform: translateX(-50%) rotate(-90deg);
}
.circle-summary svg:nth-child(2) path {
    fill: none;
    stroke-width: 22px;
    stroke-dasharray: 629;
    /* stroke: #f3f3f3; */
}
.circle-summary svg:nth-child(2) path {
    stroke: #e4e3e3;
    stroke-width: 22px;
}
.no-padding-bottom{
    padding: 0
}
.ourTopPicks_SKALD {
    color: #2bb34d;
    font-weight: 700;
    font-family: 'Open Sans';
    margin-bottom: 0;
    font-size: 24px;
}
.listStyleno ul,.listStyleno{  list-style: none !important; }
.adjustUL{ margin-top: 25px; border-top: 0 }
.adjustUL ul{ margin-left: 0!important; }

.learnMorebutton.button:after{background-color: #aeaeae;}
.learnMorebutton.button:before{    background-color: #727272;}
.sectionButton {
    gap: 40px;
    position: relative;
}
.home  .getOfferDiscount{
        position: absolute;
            right: 16.5%;
    top: 57px;

}
.getOfferDiscount{
    font-size: 14px;
    line-height: 1.2;
    color: #007bff;
}
.home  .getOfferDiscount-dt{
        position: absolute;
            right: 32%;
    top: 57px;

}
.getOfferDiscount-dt{
    font-size: 14px;
    line-height: 1.2;
    color: #007bff;
    padding: 4px 0 15px;
}

section#sectionProducts article:first-child {
    padding-bottom: 50px;
}
.learnMorebutton {
    color: #393939;
}
.button i {
    margin-left: 4px;
}

.forHomePage{display: none !important;}
.page-id-75 .forHomePage
,.home  .forHomePage
{display: inline-block !important;}
.page-id-75 .forInnerPages
,.home  .forInnerPages
{
    display: none !important;
}

.headerVersionTwo  .logo-bar img{margin: 0;}
.headerVersionTwo  .icnbar ul{
        margin-right: 0px;
}
.headerVersionTwo  .icnbar ul li:last-child{
        margin-right: 0px;
}
@media only screen and (min-width: 576px) {
    .prod-image{
        width: 500px;
    }
}
@media only screen and (max-width: 576px) {
    .prod-image{
        width: 100%;
    }
}
@media only screen and (min-width: 768px) {
    .hidden_desktop{ display: none;}
    .headerVersionTwo .logo-bar{text-align: left;}
}
@media only screen and (max-width: 1024px) {
    .add-menu li{
        font-size: 14px; 
    }
}
@media only screen and (max-width: 767px) {

.productFooter {
    margin-bottom: 10px;
}
    .asideBar{
        display: none;
    }
    nav.icnbar.navrght.col.text-right.add-menu.align-self-center{
        display: none;
    }
    .topMain {
        padding: 24px 10px 30px;

    }
    .gradeProduct h1 {
        font-size: 62px;
        line-height: 1.2;
    }
    .belowHeadingDescription {
        font-size: 16px;
        line-height: 20px;
    }
    
    .topMain h1{
        font-size: 32px;  
        line-height: 36px;
    }
    
    .circleRating h5 {
        font-size: 20px;
    }
    .pageNavigation a{
        font-size: 13px;
    }
    .pageNavigation{
        position: sticky;
        top: 0;
        z-index: 99;
        position: fixed;
        width: inherit;
        left: 0;
        right: 0;  
        margin: 0;
        visibility: hidden;
        opacity: 0;
        transition: visibility 0s, opacity 0.2s linear;   
    }
    .pageNavigation.scrollNavbar {
        visibility: visible;
        opacity: 1;
      }

    .cardsInfo h2{
        font-size: 20px; 
    }
    .cardsInfo .cardBody{
        padding: 20px 15px 20px;
    }
    .cardsInfo ul li{
        font-size: 17px;margin: 0 0 15px;line-height: 23px;
    }
    .cardsInfo h3{
        font-size: 20px;
    }
    p {
        font-size: 17px;
        line-height: 25px;
    }    
    .sectionProducts .guranteeImgBox{
        top: 0;
        transform: translate(-50%, -50%);
        left: 50%;
        right: auto;
    }

    .sectionProducts article {
        padding: 50px 10px 15px;
        margin: 20px auto 60px;
        overflow: initial;
    }
    .sectionProducts h3{
        padding-right: 0px;
    }
    .sectionProducts h3 a{
        font-size: 24px;
        line-height: 28px
    }

    .sectionProducts, .sectionFooter{
        padding: 40px 0px 30px;
    }
    .circleRating h4, .gradeProduct p{
        margin-top: 22px;
        font-size: 15px;
    }
    .productPros,.productCrons {
        padding-left: 0px;
    }
    .sectionFooter h3{
        margin-left: 0px;
        margin-right: 0px;
        padding-left: 12px;
        padding-right: 20px;        
    }
    .sectionFooter  ol {
        padding: 20px 0px;
    }
  
    
    .sectionProducts .gradeProduct{
       height: 100px;
       padding: 0
    }
    .productProsBottomLine{
        padding-left: 5px;
        padding-right: 5px;
        margin-left: 0px;
        margin-right: 0px;

    }
    .borderRight {
        border-right: 0px solid #f0f0f0;
    }
    .sectionProducts h3{
        font-size: 20px; 
        text-align: center
    }
    .sectionProducts .byLineProduct{text-align: center}
    section.homePage.heroBanner{
        padding: 15px 0 20px;  
    }
    .footerDisclaimer{
        padding: 19px 0 0px;
    }
    .footerLinks ul li{
        padding-left: 6px;
        padding-right: 6px; 
    }
    .progressAnimatedBar .sidebarHeading{
        width: 100%;
        text-align: center;
    }
    footer#footer .logo {
        max-width: 192px;
        margin-left: auto;
        margin-right: auto;
    }
    .footerLinks {
        padding-top: 10px;
        padding-bottom: 12px;
    }
    .logo-bar{
        text-align: center;  
    }
    .hidden_mobile{
       display: none
    }
    .gradeProduct .adjustHeightSec {
        display: flex;
        align-items: center;
        justify-content: center;    min-height: 0 !important;   
    }
    .gradeProduct .adjustHeightSec p {
        padding-left: 20px;
        font-family: "Open Sans",sans-serif;    font-size: 15px;    text-transform: uppercase;
        font-weight: bold;        
        margin-top: 10px
    }
    .home-page-logo{max-height: 45px;}
    .ourTopPicks_Beldt{text-align: center;padding-top: 58px;}
    section.sectionProducts {    margin-top: 22px;}
    .ourTopPicks_SKALD{padding-top: 55px;
    text-align: center;}
    .home .getOfferDiscount{position: static !important;}
    .productBody .mobileLInks, .getOfferDiscount {
        position: static;
        font-size: 14px;
        line-height: 1.4;
    }

}