html,body{font-family: 'IBM Plex Sans', sans-serif;overflow-x:hidden;}

.font-rock{font-family: 'Rock Salt', cursive;}
a{cursor:pointer;}
.row{margin:0;width:100%;}
.cursor-pointer{cursor:pointer;}
.padding-0{padding:0;}
.cor-primary{color:#09132c;}

#header {;font-size:10px;color:#FFF; position:fixed;width:100%;top:0;z-index:999;height:100px; background-color: black}
#header .logo { }
#header .div-nav {padding:30px 0;cursor:pointer;}
#header .div-nav i{color:#09132c;font-size:35px;padding:3px;}
#header .div-nav b{color:#09132c;font-size:15px;}
#header .div-nav:hover b, #header .div-nav:hover i{color:#FFF;}

#header .div-search {  margin-top: 20px}
#header .div-search input{border-radius:20px;background:white;font-weight:bold; width:90%  ; box-shadow: 0 0 0 0}
#header .div-search input::placeholder{color:#222;font-style:italic;font-weight:bold;}
#header .div-search button{background:none;border:0;font-size:18px;bottom:0px; right: 0px; height:38px; margin-top:-40px; color:#222;}
#header .div-menu {   height: 50px; font-size: 16px!important; color: white; font-weight: bold}

.espaco{ height: 230px; width: 100%; background: url(https://mrsun.com.br/assets/img/bgmrsun.jpg);}

#slider {background:#FFF;color:#FFF;position:relative;z-index:0;margin:0;width:100%;display:none;}
#slider .col-md-6{min-height:800px;}
#slider .col-md-8{min-height:800px;}
#slider .texto{padding:6% 8%;float:left;}
#slider .texto h3{font-size:30px;text-shadow:0px 0px 10px #EEE;}
#slider .texto h1{font-size:55px;font-weight:bold;text-shadow:0px 0px 10px #555;}
#slider .texto a{cursor:pointer;background:#FFF;color:#000;padding:10px 30px;border-radius:30px;}
#slider .texto:hover a{background:#09132c;color:#FFF;}

#slider .produto{padding:5%;color:#222;float:right;}
#slider .produto div.btn{width:100%;height:1px;text-align:center;}
#slider .produto div.btn a{opacity:0;text-decoration:none;position:relative;z-index:1;padding:10px 20px;background:#09132c;color:#FFF;font-weight:bold;top:0;font-size:12px;border-radius:30px;box-shadow:0px 0px 10px #999;-webkit-transition:top 1s, opacity 1s;}
#slider .produto:hover div.btn a{top:80px;opacity:1;}
#slider .produto div.image{text-align:center;}
#slider .produto div.image img{max-width:100%;max-height:170px;margin:0 auto;}
#slider p.itens {text-align:center;}
#slider p.itens i{padding:0 5px;font-size:12px;color:#999;}
#slider p.itens i.active{color:#09132c;}


#row-1 h5{ color: #09132c!important; font-weight: bold!important; margin-top: 10px}
#row-2 a{ text-decoration: none; color: #09132c; font-size: 16px; font-weight: bold }

#line-btns{width:100%;height:1px;position:absolute;}
#line-btns .box-nav{width:90px;height:90px;border-radius:100%;background:#FFF;box-shadow:0 0 20px #CCC;position:relative;top:140px;right:25%;z-index:1;margin:0;}
#line-btns .box-nav a{padding:15px 10px;cursor:pointer;}
#line-btns .box-nav a.nav-left{color:#999;position:relative;top:30px;}
#line-btns .box-nav a.nav-right{color:#999;position:relative;top:30px;}
#line-btns .box-nav a:hover{color:#09132c;}
#line-btns .box-nav a:hover{color:#09132c;}

#next-slider{background:#F9F9F9;padding:30px 15px;}

#back-fixed{display:none;position:fixed;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index:9998;}

#carrinho{display:none;overflow-y:scroll;color:#FFF;position:fixed;width:40%;height:100%;background:black;z-index:9999;top:0px;right:0px;box-shadow:0px 0px 20px #555;padding:0 2%;border-radius:0px 0px 10px 10px;}
#carrinho .div-title{color:#FFF;padding:30px 0px 15px;}
#carrinho .div-title i{font-size:35px;padding:0px 5px;}
#carrinho .div-title p{font-size:12px;}
#carrinho .div-title p b{font-size:15px;}
#carrinho .btn{border-radius:30px;padding:5px 25px;border:1px solid #FFF;margin-right:10px;}
#carrinho .btn-default{background:#FFF;border:0;font-size:17px;cursor:pointer;color:#999;font-weight:bold;}
#carrinho .btn-default:hover{color:#09132c;}
#carrinho svg{fill:#FFF;width:90px;}

#menu{display:none;color:#222;position:fixed;width:50vw;background: #549a9c;z-index:9999;top:100px;left:10vw;;padding:15px;border-radius:0px 0px 10px 10px;}
#menu .box_content a:last-child{border-bottom:0px; color: white }
#menu #second-html{display:none;color:#FFF;padding:15px;position:absolute;left:240px;width:220%;background:#222;height:400px;border-radius:0px 10px 10px 0px;overflow-y:scroll;}
#menu  a{font-size:18px;padding:5px;font-weight:100;color:#FFF;display:block;}

.text-content {padding:4%;color:#999;}
.text-content h3{color:#09132c;font-family: 'Rock Salt', cursive;font-size:17px;}
.text-content h1{color:#333;font-weight:bold;font-size:30px;}
.text-content hr{border:1px solid #222;width:70px;margin:10px 0 20px;}
.text-content a.btn-style1{background:#09132c;padding:5px 15px;border-radius:30px;color:#222;}
.text-content a.btn-style1 i{padding:0px 10px;}
.text-content:hover a.btn-style1{color:#FFF;background:#222;}




.produto {padding:1% 3%;}
.produto-box {padding:2% 5%;position:relative;background:#FFF;-webkit-transition:transform 0.5s;border:0px solid #EEE;}
.produto-box div.image{text-align:center;height:350px;}
.produto-box div.image2{text-align:center;height:160px;}
.produto-box div.image2 img{max-width:100%;max-height:170px;margin:0 auto;}
.produto-box div.image img{max-width:100%;max-height:200px;margin:0 auto;}
.produto-box div.btn{width:70%;height:1px;text-align:center;position:absolute;}
.produto-box div.btn a{opacity:0;text-decoration:none;position:relative;z-index:1;padding:10px 20px;background:#09132c;color:#FFF;font-weight:bold;top:0;font-size:12px;border-radius:30px;box-shadow:0px 0px 10px #999;-webkit-transition:top 1s, opacity 1s;}
.produto-box:hover div.btn {position:absolute;text-align:center;} .produto-box:hover div.btn a{top:80px;opacity:1;}
.produto-box:hover {z-index:2;box-shadow:0px 0px 20px #CCC;border-radius:10px;transform:scale(1.1);}
.produto-box .money {color:#09132c;font-weight:bold;}
.produto-box .image span{float:left;z-index:2;border-radius:100%;width:50px;height:50px;padding:7px 0;font-weight:bold;text-align:center;font-size:12px;border:2px dotted #0dc70e;color:#09132c;top:30px;left:30px;}
.produto-box .produto-text {height:40px;}
.produto-box .frete-gratis{background:#0dc70e;color:#FFF;border-radius:10px;bottom:10px;position:relative;padding:5px 15px;right:0px;font-size:11px;}
.produto-box .produto-text { height: 40px}


.area-banner .item-1{cursor:pointer;height:325px;width:100%;background:#000;box-shadow:0px 0px 10px #999;border-radius:10px;}
.area-banner .item-2{cursor:pointer;height:150px;width:100%;background:#000;box-shadow:0px 0px 10px #999;border-radius:10px;}
.area-banner p{color:#09132c;padding:5px 0;float:left;border-bottom:2px solid #09132c;margin:10px 30px;}
.area-banner h1{color:#FFF;text-shadow:0px 0px 10px #000;padding-top:5%;font-size:50px;font-weight:bold;}
.area-banner h3{color:#FFF;text-shadow:0px 0px 10px #000;font-size:20px;}
.area-banner a{color:#FFF;border:1px solid #FFF;text-shadow:0px 0px 10px #000;font-size:15px;padding:10px 30px;font-weight:bold;letter-spacing:5px;}
.area-banner:hover a{color:#222;background:#FFF;}

.brand-box div.image{text-align:center;}
.brand-box div.image img{max-width:100%;max-height:200px;margin:0 auto;}

.noticia{padding:1% 3%;}
.noticia-box div.btn{width:100%;height:1px;text-align:center;}
.noticia-box div.btn a{opacity:0;text-decoration:none;position:relative;z-index:1;padding:10px 20px;background:#09132c;color:#FFF;font-weight:bold;top:0;font-size:12px;border-radius:30px;box-shadow:0px 0px 10px #999;-webkit-transition:top 1s, opacity 1s;}
.noticia-box:hover div.btn a{top:80px;opacity:1;}
.noticia-box a{font-size:13px;text-decoration:underline;color:#222;}

#rodape{background-image: url("../../assets/img/bg-rodape.png"); background-size: cover;color:#FFF;padding:3% 0;box-shadow:0px 0px 20px #222;}
#rodape a{display:block;color:#FFF;font-size:18px;padding:5px 0px;}
#rodape a:hover{color: #cbcccf;}
#rodape hr{border-color:#000;}
#rodape i{color:#09132c;font-size:17px;padding:0 10px;}
#rodape h2{ color: #f1f4a5; font-weight: bold; font-size: 34px}
#rodape h4{ color: white; font-weight: bold; font-size: 18px}

#newsletter{background:black;color:#FFF;padding:0px 30px 0px;}
#newsletter h2{font-family: 'Rock Salt', cursive;font-size:20px;}
#newsletter input{font-size:15px;padding:15px;border-radius:30px;height:50px; margin-top: 20px; box-shadow: 0 0 0 0}
#newsletter input::placeholder{font-style:italic;}
#newsletter button{  background:none;color:#09132c;border:0;float:right;position:relative;bottom:40px;right:20px;font-weight:bold;}
#newsletter button i{padding:1px 5px;}

breadcrumb-wrapper{
    background:#f7f7f9;
    border-bottom:1px solid #e5e7eb;
}

.breadcrumb{
    max-width:1200px;
    margin:0 auto;
    padding:14px 20px;
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
    font-size:14px;
}

.breadcrumb-item{
    color:#6b7280;
    display:flex;
    align-items:center;
}

.breadcrumb-item a{
    color:#1f2933;
    text-decoration:none;
    font-weight:500;
}

.breadcrumb-item a:hover{
    color:#2563eb;
}

.breadcrumb-item.active{
    color:#111827;
    font-weight:600;
}

/* Separador  */
.breadcrumb-item + .breadcrumb-item::before{
    content:"›";
    margin:0 8px;
    color:#9ca3af;
}

.search-list{font-weight:bold;font-size:47px;border:none;color:#999;border-radius:0;border-bottom:1px solid #EEE;}.search-list::placeholder{color:#CCC;}
.box-filter{padding:0px;border-bottom:1px solid #EEE;border-right:0px solid #EEE;}
.box-filter .list{padding:10px;height:150px;overflow-y:scroll;box-shadow:0px 0px 20px #EEE;background:#FFF;}
.box-filter p{padding:0 0 0 20px}
.box-filter .list{padding:20px;box-shadow:0px 0px 0px #EEE;background:#FFF;}
.box-filter .list p{border-bottom:1px solid #EEE;}
.box-filter .titulo-filtro{background-color: black; color: white; margin-bottom: 30px; border-top: 55px solid transparent;border-bottom: 0px solid transparent;border-right: 30px solid white;z-index: 1;}
.background-filter {background: white;}


.navegation{text-align:center;}
.navegation-right ,.navegation-left,.navegation-center {background:#F9F9F9;padding:10px;}
.navegation-center{padding:15px;}
.navegation-right ,.navegation-left {cursor:pointer;}
.navegation-right i,.navegation-left i{color:#09132c;width:30px;padding:10px;border-radius:100%;}
.navegation-right b,.navegation-left b, .navegation-center b{color:#999;font-size:14px;font-weight:bold;}

.produto-galeria-thumb .thumb{height:100px;padding:10px;}
#produto-galeria-principal{height:650px;}
.padding-page-produto{padding:3%;}
.produto-info{font-size:14px;color:#999;}
.produto-info .title{color:#09132c;}
.produto-info small{font-size:14px;}
.produto-info b{color:#09132c;}


/* ===== PRODUTO INFO ===== */

.produto-info{
    padding:20px 10px;
}

/* SKU */
.sku{
    font-size:12px;
    letter-spacing:1px;
    color:#9ca3af;
    margin-bottom:6px;
}

/* Título */
.product-title{
    font-size:34px;
    font-weight:600;
    color:#0f172a;
    margin-bottom:20px;
}

/* Caixa de preço */
.price-box{
    background:#f9fafb;
    border:1px solid #e5e7eb;
    border-radius:14px;
    padding:22px;
    margin-bottom:25px;
}

/* Preço antigo */
.price-box small span{
    color:#9ca3af;
}

/* Preço principal */
.price-box b{
    font-size:36px;
    color:#0f172a;
}

/* Parcelamento */
.price-box h2 small{
    font-size:14px;
    color:#6b7280;
}

/* Pix */
.price-box h2:last-child{
    margin-top:10px;
    color:#15803d;
    font-size:22px;
}

/* Selo desconto */
.desconto-box{
    background:linear-gradient(135deg,#16a34a,#22c55e);
    width:90px;
    height:90px;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:white;
    font-weight:700;
    box-shadow:0 8px 18px rgba(22,163,74,.35);
}

.desconto-box label{
    font-size:14px;
}

/* Quantidade */
.qtd-box{
    display:flex;
    align-items:center;
    gap:15px;
    margin-bottom:25px;
}

.qtd-box a{
    width:42px;
    height:42px;
    border-radius:50%;
    background:#f1f5f9;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
}

.qtd-box .qtd{
    font-size:20px;
}

/* Botão comprar */
.btn-buy{
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    color:white;
    padding:18px 32px;
    border-radius:14px;
    font-size:17px;
    font-weight:600;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    letter-spacing:0.3px;
    box-shadow:0 10px 22px rgba(37,99,235,0.35);
    transition:all .25s ease;
}

.btn-buy:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 28px rgba(37,99,235,0.45);
    background: linear-gradient(135deg, #1d4ed8, #1e40af);
    color: lightskyblue;
}

.btn-buy:active{
    transform:scale(.98);
}

/* Botões secundários */
.btn-danger,
.btn-info{
    margin-top:10px;
    width:100%;
}



.btn{border-radius:30px;padding:5px 15px;}
.btn-primary{background:#09132c;margin:7px;color:#FFF!important;border:none;padding:5px 20px;}
.btn-primary:hover{background:#222;border:0;box-shadow:0 0 0 #222;}
.btn-danger{background:#dc3545;margin:7px;color:#FFF!important;border:none;padding:5px 20px;}
.variacao a.btn{border:1px solid #999;}
.variacao a.btn.active ,.variacao a.btn:hover{border-color:#09132c;color:#09132c;}

.aba-content{display:none;padding:5%;border:0px solid #CCC;}
.title-color{color:#09132c; cursor: pointer}.title-opacity{color:#999;}
.title-destaque{ background-color: black; color: white; padding:0 10px 0 10px;}

#fixed-car{position:fixed;right:20px;bottom:20px;z-index:99;background:#F9F9F9;width:240px;height:200px;padding:20px;border-radius:20px;color:#222;box-shadow:0px 0px 20px #CCC;}
#fixed-car .qtd{font-weight:bold;color:#222;font-size:15px;}
#fixed-car .close{position:relative;background:#F9F9F9;color:#222;border-radius:100%;float:right;padding:5px 10px;bottom:70px;box-shadow:0px 0px 20px #CCC;}

.form-group label{font-size:12px;position:relative;top:5px;left:10px;}
.form-control{border-radius:30px;border:1px solid #EEE;box-shadow:0px 0px 10px #EEE;}
.form-control:focus{box-shadow:0 0 0 #EEE;}

::-webkit-scrollbar {width: 8px;height: 4px;}
::-webkit-scrollbar-track {background-color: lightgrey;}
::-webkit-scrollbar-thumb {background-color: black;outline: 1px solid #999;}

.btn-default{margin:5px;}
.btn-info {color:#FFF!important;}
.btn-active{color:#09132c!important;border:1px solid #09132c;}

.logo img{width:68%;}
.banner-rodape{ height: 350px}
#menu-mobile,.visible-xs{display:none}

/* XS */
@media (max-width: 575.98px) {
    .hide-xs{display:none;}
    .logo img{width:100px;}
    .visible-xs{display:block}

    #slider .produto{padding:50px 15px;}
    #slider .produto #line-btns .box-nav{top:-110px;right:-25%}
    #slider .col-md-8{min-height:300px;}
    
    #carrinho{overflow-y:scroll;width:100%;height:100%;border-radius:0px;}

    #menu-mobile{padding:10px;position:fixed;top:110px;width:100%;height:calc(100% - 120px);background:#F9F9F9;z-index:9999;overflow-y:scroll;}
    #menu-mobile a, #menu-mobile p{padding:0px;color:#222;display:block;}
 }

/* MD */
@media (max-width: 767.98px) { }

/*  */
@media (max-width: 991.98px) {
    .espaco{ height: 60px; width: 100%}
    .banner-rodape{ height: 40vw}
}

/* LG */
@media (max-width: 1199.98px) {


}