.st-mod-quick-menu-casing{
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 1600px;
    
}

.st-mod-quick-menu
{
  justify-content: center;
  
    display: grid;
    column-gap: 1rem;
    
}
/****
.menucols-1 .st-mod-quick-menu {
    grid-template-columns: 1fr
}
.menucols-2 .st-mod-quick-menu {
    grid-template-columns: repeat(2,1fr)
}
.menucols-3 .st-mod-quick-menu {
    grid-template-columns: repeat(3,1fr)
}
.menucols-4 .st-mod-quick-menu {
    grid-template-columns: repeat(4,1fr)
}
.menucols-5 .st-mod-quick-menu {
    grid-template-columns: repeat(5,1fr)
}***/
 .st-mod-quick-menu{
    grid-template-columns: repeat( auto-fit, minmax(180px, 1fr) );
}



/*******
.menucols-6 .st-mod-quick-menu {
    grid-template-columns: repeat(6,1fr)
}
.menucols-7 .st-mod-quick-menu {
    grid-template-columns: repeat(7,1fr)
}
.menucols-8 .st-mod-quick-menu {
    grid-template-columns: repeat(8,1fr)
}
.menucols-9 .st-mod-quick-menu {
    grid-template-columns: repeat(9,1fr)
}
.menucols-10 .st-mod-quick-menu {
    grid-template-columns: repeat(10,1fr)
}
*****/
.st-mod-quick-menu > li{
    display: grid;
    margin: .5rem 0;
    padding: 8px;
    
    background-color: blueviolet;
    
    flex-basis: 0;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 100%;
    border: 1px solid transparent
    
}
.st-mod-quick-menu > li ul{
    display: none!important
}

.st-mod-quick-menu > li > a{
    text-decoration: none;
    line-height: 1.2
}
.st-mod-quick-menu-casing .st-mod-quick-menu > li > a, .st-mod-quick-menu-casing .st-mod-quick-menu > li > span{
    color: #fff;
   
    text-align: center
}
.st-mod-quick-menu-casing .st-mod-quick-menu > li:hover > a, .st-mod-quick-menu-casing .st-mod-quick-menu > li:hover > span{
    color: #fff;}


.st-mod-quick-menu-casing .st-mod-quick-menu.nav.link-color-light > li > a{
    color: #fff
}

.st-mod-quick-menu-casing .st-mod-quick-menu.nav.link-color-link > li > a{
    color: #2355b9
}

.st-mod-quick-menu-casing .st-mod-quick-menu.nav.link-color-dark > li > a{
    color: #515151
}
.st-mod-quick-menu-casing .st-mod-quick-menu.nav.link-color-dark > li{
    border-color: #515151
}


.st-mod-quick-menu-casing .st-mod-quick-menu.link-color-light > li > a::after{
    background-color: #fff
}

.st-mod-quick-menu-casing .st-mod-quick-menu.link-color-link > li > a::after{
    background-color: #2355b9
}

.st-mod-quick-menu-casing .st-mod-quick-menu.link-color-dark > li > a::after{
    background-color: #515151
}




.st-mod-quick-menu-casing .st-mod-quick-menu > li > a, .st-mod-quick-menu > li > span {
    display: grid;
    grid-template-columns: 1fr;
    padding: 0.5rem;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
   
}
.st-mod-quick-menu-casing.iconleft .st-mod-quick-menu > li > a{
    grid-template-columns: auto 1fr;
}

.st-mod-quick-menu-casing.icontop .st-mod-quick-menu > li > a{
    grid-template-columns: 1fr;
}
.st-mod-quick-menu-casing.icontop .st-mod-quick-menu > li > a::after{
    content: '';
    display: block;
    position: absolute;
    bottom: -3px;
    width: 20%;
    left: 40%;
    height: 2px;
    
    
    
    transition: all .6s
}
.st-mod-quick-menu-casing.icontop .st-mod-quick-menu > li:hover > a::after, .st-mod-quick-menu-casing.icontop .st-mod-quick-menu > li.current.active > a::after{
    width: 94%;
    left: 3%;
}

.st-mod-quick-menu > li > a > span{
    background-color: #fff;
    color: #282828;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    border-radius: 50%
}

.st-mod-quick-menu.border-circle > li > a > span{
    border-radius: 50%
}
.st-mod-quick-menu.border-rectangle > li > a > span{
    border-radius: 4px
}
.st-mod-quick-menu > li > a > .menu-toggler{
    display: none;
}
.st-mod-quick-menu-casing.iconmedium .st-mod-quick-menu > li > a > span::before{
    font-size: 30px
}
.st-mod-quick-menu-casing.iconbig .st-mod-quick-menu > li > a > span{
    width: 90px;
    height: 90px;
}
.st-mod-quick-menu-casing.iconbig .st-mod-quick-menu > li > a > span::before{
    font-size: 50px
}

.st-mod-quick-menu-casing.iconsmall .st-mod-quick-menu > li > a > span{
    width: 40px;
    height: 40px;
}

.st-mod-quick-menu-casing.iconsmall .st-mod-quick-menu > li > a > span::before{
    font-size: 20px
}

.st-mod-quick-menu > li > a > .image-title{
    background: none!important;
    color: #fff;
    width: auto;
    height: auto;
    padding: 5px 0
}
.st-mod-quick-menu > li.current.active, .st-mod-quick-menu-casing.iconleft .st-mod-quick-menu > li:hover{
    background-image: url(../menubg.png);
    
}
.st-mod-quick-menu.style-red > li > a > span{
    color: #bb1616
}
.st-mod-quick-menu.style-link > li > a > span{
    color: #1159b7
}
.st-mod-quick-menu.style-dark > li > a > span{
    color: #fff;
    background: #515151
}

/*** Icon Left ***/
.st-mod-quick-menu-casing.iconleft .st-mod-quick-menu > li > a{
    border: 1px solid #ddd ;
    padding: 10px;
    transition: .4s
}
.st-mod-quick-menu-casing.iconleft .st-mod-quick-menu > li:hover > a{
     border: 1px solid #fff
}

.st-mod-quick-menu-casing.iconleft .st-mod-quick-menu.link-color-dark  > li > a{
    border: 1px solid #515151;
}
.st-mod-quick-menu-casing.iconleft .st-mod-quick-menu.link-color-link  > li > a{
    border: 1px solid #2355b9;
}
/*** IconTop ***/
.st-mod-quick-menu-casing.icontop .st-mod-quick-menu > li > a > span{
    margin-bottom: 10px
}
.st-mod-quick-menu-casing.icontop .st-mod-quick-menu > li{
    padding: 20px 15px 20px 15px
}