.btn { font-size: 1rem; cursor: pointer; min-height: 45px; height: 45px; padding: 5px 20px; border: none; display: flex; justify-content: center; align-items: center; font-family: 'Titillium Web', sans-serif; text-transform: uppercase; text-align: center; border-radius: 3px; font-weight: 600; }
.btn.red { background-color: #E94D43; color: #fff; }
.btn.red:hover { background-color: #0063BC; color: #fff; }
a:hover .btn.red { background-color: #0063BC; color: #fff; }
.btn.blue { background-color: #0063BC; color: #fff; }
.btn.blue:hover { background-color: #E94D43; color: #fff; }
a:hover .btn.blue { background-color: #E94D43; color: #fff; }
.btn.dgrey { background-color: #333; color: #fff; }
.btn.dgrey:hover { background-color: #666; }
a:hover .btn.dgrey { background-color: #666; }
.btn.grey { background-color: #f1f1f1; color: #343738; }
.btn.grey:hover { background-color: #666; color: #fff; }
a:hover .btn.grey { background-color: #666; color: #fff; }
.btn.grey:hover i { color: #fff !important; }
.btn.white { background-color: #fff; color: #343738; }
.btn.white:hover { background-color: #E94D43; color: #fff; }
.btn.white:hover i { color: #fff !important; }

.btn.paypal { background-color: #f7be37; color: #222d65; width: 100%;}
.btn.icon { padding: 0; width: 45px; display: flex; align-items: center; justify-content: center; }
.btn.icon i { margin: 0; }
.btn.paypal img { max-height: 30px; margin-left: 10px; }

.btn.pay { height: 60px; border-radius: 50px; width: 100%; }
.btn.klarna { background-color: #ffb3c7; }
.btn.klarna:hover { filter: brightness(0.9); }

.kstate { font-size:0.9em; color:#fff; margin-top:20px; margin-bottom:-10px; }
.kstate a{ color:#fff; }

.btn.round { width: 21px; height: 21px; min-height: 21px; padding: 0px; border-radius: 100%; }
.btn.full { width: 100%; }
.btn i { margin-left: 5px; font-size: 1.3em; }
.btn i.fa-plus, .btn i.fa-minus { font-size: 1em; margin: 0px; }

.btn.sml { padding: 0px 20px; height: 40px; }
.btn.narrow { padding: 5px 10px; }
input[type="submit"].btn { height: auto !important; padding-left: 20px; }
.fav-btn-outter { height: 47px; overflow: visible; position: relative; }
.btn.fav { padding: 0px 10px; height: 45px; font-weight: 700; background-color: #fff; display: flex; justify-content: space-between; align-content: center; }
.btn.fav .txt:before { content: "Add to Favourites"; display: block; font-weight: 700; margin-right: 5px; }
.btn.fav .heart { display: none; width: 20px; height: 20px; position: relative; margin-right: 5px; }
.btn.fav .heart i:first-child { font-size: 1.3em; color: #E94D43; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); margin: 0px !important; }
.btn.fav .heart i:last-child { color: #E94D43; position: absolute; font-size: 1.3em; opacity: 0; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.btn.fav.on .txt:before { content: "Remove from Favourites"; display: block; }
.btn.fav.on .heart i:last-child { opacity: 1; }
.btn.fav i { color: #E94D43; }

a.block { display: block; }
.inline-link { display: inline-block; }
.inline-link.with-icon { display: inline-block; position: relative; padding-left: 30px; }
.inline-link.with-icon img { position: absolute; top: 50%; transform: translateY(-50%); left: 7px; }
.inline-link.white { color: #fff; }
.inline-link.white:hover { color: #E94D43; }
.inline-link:hover { }
.inline-link a { color: #0063BC; display: inline; position: relative; }
.inline-link a:before { position: absolute; opacity: 0; content: ""; display: block; width: 100%; height: 2px; left: 0px; top: 81%; background-color: #0063BC; }
.inline-link a:hover { color: #0063BC; text-decoration: none; }
.inline-link a:hover:before { opacity: 1; }
.inline-link.white a { color: #fff; }
.inline-link.white a:before { background-color: #fff; }

.blocklink { border: 1px solid #0063BC; background-color: #fff; border-radius: 5px; display: block; padding: 30px; text-align: center; color: #333; font-size: 1.5em; }
.blocklink i { display: block; text-align: center; margin-bottom: 15px; color: #E94D43; }
.blocklink:hover { box-shadow: 0 11px 11px #00000026; transform: translateY(-5px); border: 1px solid #E94D43; }

.products .OK, .products .ok { border-radius: 10px; padding: 15px; text-align: center; }
.products .OK span, .products .ok span { display: block; text-align: center; font-weight: 600; }
.products .OK span span, .products .ok span span { font-size: 1.1em; }
.products .OK .btn, .products .ok .btn { max-width: 200px; margin: 15px auto 0px; }

.btn.close { padding: 0px !important; width: 40px; height: 40px; border-radius: 100%; background-color: #E94D43; min-height: initial; }
.btn.close:hover { background-color: #0063BC; }
.btn.close > div { width: 40px; height: 40px; position: relative; transform: rotate(45deg); }
.btn.close > div:before { display: block; content: ""; width: 1px; height: 20px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #fff; }
.btn.close > div:after { display: block; content: ""; width: 20px; height: 1px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background-color: #fff; }

.new-addr-link { border: 1px solid #0063BC; height: 100%; display: flex; justify-content: center; align-items: center; }
.new-addr-link:hover { }
.new-addr-link:hover .btn { background-color: #E94D43; }
.new-addr-link i { display: inline-block; width: 30px; height: 30px; line-height: 30px; text-align: center; background-color: #0063BC; border-radius: 100%; color: #fff; margin-bottom: 30px; }

.flex-list { display: flex; }
.flex-list > * { margin: 0px 10px 10px 0px; }

.best-seller:hover .btm { background-color: #0063BC; }
.best-seller .top-title img { max-width: 12px; margin-left: 5px; }
.best-seller .btm { background-image: url(../images/icons/flame.svg); background-position: 10px -22px; background-repeat: no-repeat; }



.checkswitch { cursor: pointer; width: 50px; display: block; position: relative; height: 26px; border-radius: 25px; border: 1px solid #d2d2d2; background-color: #d2d2d2; }
.checkswitch:before { box-shadow: 0px 3px 6px #00000029; content: ""; display: block; width: 50%; height: 100%; border-radius: 100%; left: 0px; position: absolute; background-color: #fff; }
.checkswitch.on { background-color: #4dd162; }
.checkswitch.on:before { transform: translateX(100%); }
.checkswitch input { display: none; }

.bx-controls-direction > span { cursor: pointer; }
.bx-controls-direction > span:hover { background-color: #E94D43; }
.account-widget:hover { background-color: #E94D43 !important; }
.topsearch:hover .submitSearch, .submitSearch:hover, .basket-widget:hover { background-color: #0063BC !important; cursor: pointer; }
.topsearch:hover { border-color: #0063BC !important; }

@media screen and (max-width: 500px) {
  .btn.submitbtn { width: 100%; max-width: 100%; }
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


.btn.loading {
    position: relative;
    color: transparent !important;
}

.btn.loading::before {
    content: "";
    width: 36px;
    height: 36px;
    border-width: 5px;
    border-style: solid;
    border-color: rgb(255, 255, 255) rgb(255, 255, 255) transparent;
    border-image: initial;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: 1s linear 0s infinite normal none running rotation;
    position: absolute;
    left: calc(50% - 18px);
    top: calc(50% - 18px);
}