NN2022090201/public/assets/shop/css/menu/bootstrapmb.com.css

body {
    /*background: -webkit-linear-gradient(top, #F68344 0.00%, #98370F 60.00%);*/
    /*background: linear-gradient(top, #F68344 0.00%, #98370F 60.00%);*/
    /*background-size: 2500px 1600px;*/
    background-repeat: no-repeat;
    font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font-weight: 300;
    -webkit-font-smoothing: subpixel-antialiased;

    font-size: 100%;
    font-family: Helvetica;
}

#warp {
    /*background: -webkit-linear-gradient(top, #F68344 0.00%, #98370F 60.00%);*/
    /*background: linear-gradient(top, #F68344 0.00%, #98370F 60.00%);*/
    background-size: 2500px 1600px;
    background-repeat: no-repeat;
    position: relative;
    width: 800px;
    height: 200px;
    margin: 100px auto 0px;
    padding: 5px;
    display: block;
    text-align: center;
    border-radius: 10px;
}

#menu {
    padding: 0 6px;
    border-bottom: 1px solid #DDD;
    position: fixed;
    bottom: -15px;
    background: -webkit-linear-gradient(top, #F8F8F8 0.00%, #EFEFEF 32.86%, #D7D7D7 68.93%, #CFCFCF 100.00%);
    background: linear-gradient(top, #F8F8F8 0.00%, #EFEFEF 32.86%, #D7D7D7 68.93%, #CFCFCF 100.00%);
    height: 50px;
    width: 100%;
    list-style: none;
    border-radius: 0 15px 0 0;
    box-shadow: 0 2px 1px 0 #BEBEBE, 0 4px 1px -1px #B8B8B8, 0 6px 1px -2px #B3B3B3, 0 8px 1px -3px #ADADAD, 0 10px 1px -4px #AAAAAA, 0 12px 1px -5px #A7A7A7, 0 14px 1px -6px #9C9C9C, 0 16px 1px -7px #939393, 0 18px 1px -8px #8B8B8B, 0 20px 1px -9px #666666, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 20px 4px -6px rgba(0, 0, 0, 0.9), 0 45px 5px -5px rgba(0, 0, 0, 0.05), 0 35px 10px -5px rgba(0, 0, 0, 0.1), 0 25px 55px 5px rgba(0, 0, 0, 0.15);
    z-index: 0;
    /*margin: 100px auto;*/
}

#menu:before {
    content: "";
}

#menu:after {
    content: "";
}

#menu li {
    background: transparent;
    padding: 0px;
    width: 19%;
    height: 62px;
    margin: 0px;
    overflow: hidden;
    line-height: 50px !important;
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
    text-align: center;
}

/* hover statut */

#menu li.active {

    background: -webkit-linear-gradient(top, #F58246 0.00%, #ED7F44 32.86%, #CC7244 68.93%, #BE6E48 100.00%);

    background: linear-gradient(top, #F58246 0.00%, #ED7F44 32.86%, #CC7244 68.93%, #BE6E48 100.00%);
    z-index: 2;
    width: 19%;
    top: -8px;
    border-radius: 10px 10px 0 0;
    border-top: 1px solid #f7a273;
    border-left: none;
    border-right: none;
    text-align: center;
    box-shadow: 0 2px 1px 0 #963004, 0 4px 1px -1px #852A03, 0 6px 1px -2px #812802, 0 8px 1px -3px #7D2803, 0 10px 1px -4px #661F01, 0 12px 1px -5px #521A02, 0 14px 1px -6px #401601, 0 16px 1px -7px #3C1501, 0 18px 1px -8px #2D1001, 0 20px 1px -9px #110500, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 10px 20px rgba(0, 0, 0, 0.75), 0 20px 4px -6px rgba(0, 0, 0, 0.9), 0 45px 5px -5px rgba(0, 0, 0, 0.05), 0 35px 10px -5px rgba(0, 0, 0, 0.1), 0 25px 55px 5px rgba(0, 0, 0, 0.15);
    z-index: 0;
    -webkit-transition: background border-radius 0.75s ease-in;
    transition: background border-radius 0.75s ease-in;
    -webkit-transition: box-shadow 0.5s ease-in;
    transition: box-shadow 0.5s ease-in;
}

#menu li.active {
    background-color: #DADADA
}

.item:hover {
    position: relative;
    display: inline-block;
    text-align: center;
}

/* item */
.item {
    font-size: 100%;
    position: relative;
    display: inline-block;
    text-align: center;
}

.item:hover:before,
.active.item:before {
    content: "";
    background: -webkit-linear-gradient(top, rgba(247, 144, 88, 0.05) 60.00%, rgba(147, 50, 14, 0.5) 100.00%);
    background: linear-gradient(top, rgba(247, 144, 88, 0.05) 60.00%, rgba(147, 50, 14, 0.5) 100.00%);
    display: block;
    height: 200px;
    width: 200px;
    border-radius: 100px;
    position: absolute;
    top: -130px;
    left: -120px;
    z-index: -1;
}

/* item separateur */
.item:after {
    content: "";
    padding: 0px;
    width: 0px;
    height: 12px;
    top: 20px;
    display: block;
    position: absolute;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    border-right: 1px solid rgba(255, 255, 255, 0.1);
    z-index: 2;
}

.item:hover:after,
.item.active:after {
    content: "";
    display: none;
}

/* lien */
.item a {
    text-align: center;
    color: #787878;
    font-size: 70%;
    text-decoration: none;
    text-shadow: 0px 1px 0px white;
}

.item:hover a,
.item.active a {
    text-align: center;
    color: #FFF;
    z-index: 10;
    font-weight: lighter;
    text-shadow: 0px 1px 0px black;
    width: 100%;
    display: block;
}

a, a:hover {
    color: black;
    text-decoration: underlink;
}