/*your custom css goes here*/ 





.top-navbar{
    background: #F4F6F8;
}

.loged-menu{
     position: relative;
    top: -18px;
    left: -75px;
   
}

.header-menus ul li:first-child{
border-left: 1px solid #dfdfe6;
}

.resin-box a {
    display: block;
    min-width: 250px;
    padding: 23px;
    border-radius: 51px;
    font-size: 20px;
    font-weight: 600;
    color: #fff;
    background: #1E7F43;
    box-shadow: rgb(16 192 51 / 40%) 0px 4px 12px;
}


.calculators .grid-3 {
    display: grid;
    grid-gap: 20px;
    grid-template-columns: repeat(3,1fr);
    padding: 30px 0;
    overflow: hidden
}

.calculators .grid-3 .box {
    min-height: 350px
}

.calculators .grid-3 .box h3,.calculators .grid-3 .box h4,.calculators .grid-3 .box h5,.calculators .grid-3 .box h6 {
    margin-top: 1rem
}

.calculators #circle-volume-calculator,.calculators #epoxy-resin-volume-calculator,.calculators #mix-ratio-2,.calculators #mix-ratio-3,.calculators #mix-ratio-5,.calculators #mix-ratio-annies,.calculators #mix-ratio-artpro,.calculators #mix-ratio-deeppour,.calculators #mix-ratio-deeppourx,.calculators #mix-ratio-lv,.calculators #mix-ratio-marine,.calculators #mix-ratio-penetrating,.calculators #mix-ratio-tabletop {
    background-color: #ebebeb;
    padding: 1.5rem;
    margin: 1px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border: 2px solid #598E3A;
    border-radius: .3rem
}

.calculators #circle-volume-calculator h3 span,.calculators #epoxy-resin-volume-calculator h3 span,.calculators #mix-ratio-2 h3 span,.calculators #mix-ratio-3 h3 span,.calculators #mix-ratio-5 h3 span,.calculators #mix-ratio-annies h3 span,.calculators #mix-ratio-artpro h3 span,.calculators #mix-ratio-deeppour h3 span,.calculators #mix-ratio-deeppourx h3 span,.calculators #mix-ratio-lv h3 span,.calculators #mix-ratio-marine h3 span,.calculators #mix-ratio-penetrating h3 span,.calculators #mix-ratio-tabletop h3 span {
    color: #da291c;
    font-weight: 400!important;
    font-size: 1.5rem
}

.calculators h4 {
    font-size: 1.25rem
}

.calculators .results span {
    display: block;
    font-size: 1.6em;
    font-weight: 700;
    padding: .3em
}

.calculators label {
    color: #000;
    display: block;
    font-size: .9em;
    font-weight: 400;
    margin: 0;
    padding: .3em 0
}

.calculators input {
    max-width: 200px;
    border-radius: .3rem;
    -webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
    font-size: 15px;
    border: 0;
    border-bottom: transparent 2px solid;
    background-color: #fff;
    color: #000;
    font-weight: 700;
    padding: .75em 1em;
    height: auto;
    margin: 0;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out
}

.calculators input:focus {
    border-bottom: #3596fd 2px solid;
    color: #3596fd
}

.calculators input::-webkit-inner-spin-button,.calculators input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

.calculators input[type=number] {
    -moz-appearance: textfield
}

.calculator-table {
    text-align: center
}

.calculator-table td {
    padding: 10px;
    border: solid #000 1px
}

@media only screen and (max-width: 800px) {
    .calculators .grid-3 {
        grid-template-columns:repeat(1,1fr)
    }
}

.cart-remove>svg {
    fill: white
}

.apple-pay-checkout-button {
    background-image: -webkit-named-image(apple-pay-logo-black);
    background-color: #fff
}

.apple-pay-checkout-button {
    width: 200px;
    height: 60px
}

.previewCartCheckout .button+.button {
    background-color: #da291c;
    border: #da291c;
    color: #fff
}

.optimizedCheckout-buttonPrimary {
    color: #fff!important
}

#add-shipping .form-select {
    background-color: #fff!important
}

.epic-product-card .box-cart,.epic-product-card .box-cart .card-figcaption-button:hover {
    background-color: #000;
    color: #fff;
    border-radius: .3rem
}

#facetedSearch-navList .accordion-block,.facetedSearch-refineFilters,.sidebar-categories {
    border: 0 solid #000;
    margin-bottom: 20px;
    border-radius: .3rem;
    -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.1);
    box-shadow: 0 2px 10px rgba(0,0,0,.1)
}

.accordion--navList .accordion-title,.sidebarBlock-heading {
    font-family: ProximaNova-SemiBold;
    font-size: 1.2rem;
    text-transform: unset
}

.navList-action {
    color: #000
}

.card-body .card-text {
    color: #000
}

.productView-thumbnail-link {
    -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.1);
    box-shadow: 0 2px 10px rgba(0,0,0,.1);
    border: 0
}

.epic-product-card:hover {
    -webkit-box-shadow: unset;
    box-shadow: unset
}

.form-select {
    background: unset
}

.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    -ms-flex-line-pack: space-evenly;
    align-content: space-evenly
}

.flex-top {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.flex-start-left {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.flex-75 {
    -ms-flex-preferred-size: 75%;
    flex-basis: 75%;
    padding: 25px
}

.flex-66 {
    -ms-flex-preferred-size: 66%;
    flex-basis: 66%;
    padding: 25px
}

.flex-50 {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    padding: 25px
}

.flex-33 {
    -ms-flex-preferred-size: 33%;
    flex-basis: 33%;
    padding: 25px
}

.flex-25 {
    -ms-flex-preferred-size: 25%;
    flex-basis: 25%;
    padding: 25px
}

.flex-20 {
    -ms-flex-preferred-size: 20%;
    flex-basis: 20%;
    padding: 25px
}

.flex-tight .flex-75 {
    padding: 1rem
}

.flex-tight .flex-66 {
    padding: 1rem
}

.flex-tight .flex-50 {
    padding: 1rem
}

.flex-tight .flex-33 {
    padding: 1rem
}

.flex-tight .flex-25 {
    padding: 1rem
}

.flex-tight .flex-20 {
    padding: 1rem
}

@media only screen and (max-width: 800px) {
    .flex-50 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        padding: 10px;
    }
}

@media only screen and (max-width: 768px) {
    
.policy-file svg {
    padding-bottom: 8px;
}

a.padd {
    padding: 8px 2px !important;
}

h4.h6.text_mobile {
    font-size: 8px;

}

.resin-box a {
     display: block;
    min-width: 150px;
    padding: 18px;
    border-radius: 51px;
    font-size: 13px;
    font-weight: 500
}

form#ratioCalculator {
    margin-right: 5px;
}

}

.mescalculator{
        background-color: #ebebeb;
    padding: 1.5rem;
    margin: 1px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
     justify-content: center;
    border: 2px solid #598E3A;
    border-radius: .3rem;
}

form#ratioCalculator {
    margin-right: 35px;
}

      select {
        appearance: none; /* remove default appearance set by the browser */
        outline: none; /* remove the outline shown on focus */
        cursor: pointer; /* change the mouse cursor icon */

        color: navy;  /* text color */
        background-color: #fff;
        border: 2px solid blue;

        border-radius: 5px;  /* round the border corners */
        padding: 5px 10px;
        width: 200px;
        height: 40px;
        box-shadow: 3px 6px 11px rgb(206 206 206 / 80%);

        font-family: serif;
        font-size: 16px;
        font-weight: bold;
        text-align: center;
      }

      select:focus {
        outline: none;  /* replace the focus outline removed with 'outline: none' */
      }

/* ===============================
   Announcement Slider
=================================*/

.announcement-bar{
    background:#000;
    color:#fff;
    overflow:hidden;
    height:36px;
    display:flex;
    align-items:center;
    position:relative;
    z-index:9999;
}

.announcement-slider{
    display:flex;
    width:max-content;
    animation: slideText 25s linear infinite;
}

.announcement-bar .slide{
    padding:0 60px;
    white-space:nowrap;
    font-size:14px;
}

@keyframes slideText{
    0%{
        transform:translateX(0);
    }
    100%{
        transform:translateX(-50%);
    }
}


/* ===============================
   Top Navbar (Desktop)
=================================*/

.top-navbar ul.list-inline{
    display:flex;
    justify-content:space-between;
    align-items:center;
}


/* ===============================
   Mobile View Fix
=================================*/

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

    .top-navbar{
        display:block !important;
        position:relative;
        top:0;
        width:100%;
        background:#F4F6F8;
        z-index:9999;
    }

    .top-navbar .container{
        padding-left:10px;
        padding-right:10px;
    }

    .top-navbar ul.list-inline{
        display:flex;
        flex-direction:row;               /* এক লাইনে রাখবে */
        justify-content:space-between;    /* left + right ভাগ করবে */
        align-items:center;
        width:100%;
    }

    .top-navbar ul.list-inline li{
        margin-bottom:0;
    }

}