.om,
.row-icon {
    position: relative;
    display: inline-block;
    margin-inline: 0.5rem;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
}

.omicon {
    width: 16px;
    height: 16px;
    top: 5px;
}

.x22 {
    top: 7px;
    width: 22px;
    height: 22px;
}

.xom {
    top: 3px;
    width: 16px;
    height: 16px;
    filter: invert(10%) sepia(11%) saturate(6465%) hue-rotate(188deg) brightness(92%) contrast(104%);
}


.so-media {
    display: inline-block;
    margin-inline: 0.5rem;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
}

.om-dot {
    background-image: url(../omicons/logodot.svg);
}

.more {
    background-image: url(../omicons/armore.svg);
}

.blue {
    color: #218fe9;
    filter: invert(40%) sepia(94%) saturate(1674%) hue-rotate(187deg) brightness(97%) contrast(106%);
}

.om-wt {
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(173deg) brightness(100%) contrast(104%);
}



.user {
    background-image: url(../omicons/om-usercard.svg);
}

.cart {
    background-image: url(../omicons/airbnb.svg);
}

.lang {
    background-image: url(../omicons/airbnb.svg);
}

.om-home {
    background-image: url(../omicons/om-home.svg);
}

.om-new {
    background-image: url(../omicons/om-new-plus.svg);
}

.om-save {
    background-image: url(../omicons/om-save.svg);
}

/*------------ Table Icons --------------*/

.arrow-left {
    background-image: url(../omicons/arrow-left.svg);
}

.arrow-right {
    background-image: url(../omicons/arrow-right.svg);
}

/*----------------- Social Media ------------------*/
.whatsapp {

    width: 40px;
    height: 40px;
    background-image: url(../omicons/whatsapp.svg);
}

.som {
    width: 22px;
    height: 22px;
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(173deg) brightness(100%) contrast(104%);
}

.twitter {
    background-image: url(../omicons/twitter.svg);
}

.facebook {
    background-image: url(../omicons/facebook.svg);
}

.instagram {
    background-image: url(../omicons/instagram.svg);
}

.linkedin {
    background-image: url(../omicons/linkedin.svg);
}

.youtube {
    background-image: url(../omicons/youtube.svg);
}

/*---------------- Color -----------------------*/
.wt {
    color: #ffffff;
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(173deg) brightness(100%) contrast(104%);
}

.gd {
    filter: invert(98%) sepia(28%) saturate(6185%) hue-rotate(315deg) brightness(98%) contrast(98%);
}

.red {
    color: #f35b5b;
    filter: invert(56%) sepia(24%) saturate(6444%) hue-rotate(326deg) brightness(97%) contrast(95%);
}

.blu {
    color: #0d6efd;
    filter: invert(32%) sepia(84%) saturate(3624%) hue-rotate(208deg) brightness(99%) contrast(102%);
}

.indigo {
    color: #6610f2;
    filter: invert(13%) sepia(98%) saturate(7118%) hue-rotate(267deg) brightness(92%) contrast(108%);
}

.row-up {
    background-image: url(../omicons/row-up.svg);
    filter: invert(32%) sepia(84%) saturate(3624%) hue-rotate(208deg) brightness(99%) contrast(102%);
}

.row-down {
    background-image: url(../omicons/row-down.svg);
    filter: invert(56%) sepia(24%) saturate(6444%) hue-rotate(326deg) brightness(97%) contrast(95%);
}

.row-edit {
    background-image: url(../omicons/edit.svg);
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(173deg) brightness(100%) contrast(104%);
}

.row-view {
    background-image: url(../omicons/view.svg);
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(173deg) brightness(100%) contrast(104%);
}

.row-delete {
    background-image: url(../omicons/delete.svg);
    filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(173deg) brightness(100%) contrast(104%);
}


/*------------------- OmaIcons -----------------------*/
/*
how to use:
 <span><i class="omicon arrow-right"></i></span>

 https://codepen.io/sosuke/pen/Pjoqqp
*/