.datatable_mobilescroll_wrapper::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}
.datatable_mobilescroll_wrapper::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0, 0, 0, .5);
    -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

@media(min-width: 1220px){
    .datatable_mobilescroll_wrapper {
        width: 100%;
        position: relative;
        display: block;
        white-space: normal !important; 
        overflow-x: visible !important;
    }
    .datatable_mobilescroll {
        display: block;
        position: relative;
        width: 100%;
        border: 1px solid #d3d3d3;

    }
}
@media (min-device-width: 980px) and (min-width: 980px), (max-device-width: 1024px) and (min-width: 1024px) and (orientation: landscape){
    .datatable_mobilescroll_wrapper {
        width: 100%;
        position: relative;
        display: block;
        white-space: nowrap;
        overflow-x: visible;
    }
    .datatable_mobilescroll {
        display: block;
        position: relative;
        width: 100% ;
        border: 1px solid #d3d3d3;

    }
}

.datatable_mobilescroll_wrapper {
    width: 100%;
    box-sizing: content-box;
    box-sizing: border-box;
    box-sizing: inherit;
    box-sizing: initial;
    box-sizing: unset;
    position: relative;
    display: block;
    white-space: nowrap;
    overflow-x: scroll;
}


/* iPads (landscape) ----------- */
@media only screen and (max-width : 768px)  {

    .datatable_mobilescroll_wrapper {
        width: 100%;
        box-sizing: content-box;
        box-sizing: border-box;
        box-sizing: inherit;
        box-sizing: initial;
        box-sizing: unset;
        position: relative;
        display: block;
        white-space: nowrap;
        overflow-x: scroll;
    }

    .datatable_mobilescroll {
        display: block;
        position: relative;
        width: 150% !important;
        border: 1px solid #d3d3d3;

    }
}
.datatable_mobilescroll_row{

}
.datatable_mobilescroll td {
    border-color: #7a792f;
    padding: 0px;
    border-spacing: 0px;
}
.datatable_mobilescroll_data_1{
    width: 10%;
}
.datatable_mobilescroll_data_2{
    width: 20%;

}
.datatable_mobilescroll_data_3{
    width: 30%;

}




/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    .datatable_mobilescroll_wrapper {
        width: 100%;
        box-sizing: content-box;
        box-sizing: border-box;
        box-sizing: inherit;
        box-sizing: initial;
        box-sizing: unset;
        position: relative;
        display: block;
        white-space: nowrap;
        overflow-x: scroll;
    }
    .datatable_mobilescroll{
        display: block;
        overflow: visible;
        position: relative;
        width: 150%;
        border: 1px solid #d3d3d3;

    }
    .datatable_mobilescroll td {
        border-color: #7a792f;
        border: 1px solid #7a792f !important;
        padding: 0px;
        border-spacing: 0px;
    }
}

/*!* Smartphones (landscape) ----------- *!*/
/*@media only screen and (min-width : 321px) {*/
    /*.datatable_mobilescroll_wrapper {*/
        /*width: 100%;*/
        /*box-sizing: content-box;*/
        /*box-sizing: border-box;*/
        /*box-sizing: inherit;*/
        /*box-sizing: initial;*/
        /*box-sizing: unset;*/
        /*position: relative;*/
        /*display: block;*/
        /*white-space: nowrap;*/
        /*overflow-x: scroll;*/
    /*}*/
    /*.datatable_mobilescroll{*/
        /*display: block;*/
        /*overflow: visible;*/
        /*position: relative;*/
        /*width: 100%;*/
        /*border: 1px solid #d3d3d3;*/

    /*}*/
    /*.datatable_mobilescroll td {*/
        /*border-color: #7a792f;*/
        /*border: 1px solid #7a792f !important;*/
        /*padding: 0px;*/
        /*border-spacing: 0px;*/
    /*}*/
/*}*/

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
    .datatable_mobilescroll_wrapper {
        width: 100%;
        box-sizing: content-box;
        box-sizing: border-box;
        box-sizing: inherit;
        box-sizing: initial;
        box-sizing: unset;
        position: relative;
        display: block;
        white-space: nowrap;
        overflow-x: scroll;
    }
    .datatable_mobilescroll{
        display: block;
        overflow: visible;
        position: relative;
        width: 150% !important;
        border: 1px solid #d3d3d3;

    }
    .datatable_mobilescroll td {
        border-color: #7a792f;
        border: 1px solid #7a792f !important;
        padding: 0px;
        border-spacing: 0px;
    }
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
    .datatable_mobilescroll_wrapper {
        width: 100%;
        box-sizing: content-box;
        box-sizing: border-box;
        box-sizing: inherit;
        box-sizing: initial;
        box-sizing: unset;
        position: relative;
        display: block;
        white-space: nowrap;
        overflow-x: scroll;
    }
    .datatable_mobilescroll{
        display: block;
        overflow: visible;
        position: relative;
        width: 150%;
        border: 1px solid #d3d3d3;

    }
    .datatable_mobilescroll td {
        border-color: #7a792f;
        border: 1px solid #7a792f !important;
        padding: 0px;
        border-spacing: 0px;
    }
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
    .datatable_mobilescroll_wrapper {
        width: 100%;
        box-sizing: content-box;
        box-sizing: border-box;
        box-sizing: inherit;
        box-sizing: initial;
        box-sizing: unset;
        position: relative;
        display: block;
        white-space: nowrap;
        overflow-x: scroll;
    }

    .datatable_mobilescroll{
        display: block;
        overflow: visible;
        position: relative;
        width: 100%;
        border: 1px solid #d3d3d3;

    }
    .datatable_mobilescroll td {
        border-color: #7a792f;
        border: 1px solid #7a792f !important;
        padding: 0px;
        border-spacing: 0px;
    }
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
    .datatable_mobilescroll_wrapper {
        width: 100%;
        box-sizing: content-box;
        box-sizing: border-box;
        box-sizing: inherit;
        box-sizing: initial;
        box-sizing: unset;
        position: relative;
        display: block;
        white-space: nowrap;
        overflow-x: scroll;
    }
    .datatable_mobilescroll{
        position: relative;
        width: 150%;
        border: 1px solid #d3d3d3;

    }
    .datatable_mobilescroll td {
        border: 1px solid #7a792f !important;
        border-color: #7a792f;
        padding: 0px;
        border-spacing: 0px;
    }

    /* Landscape */
    @media screen
    and (device-width: 320px)
    and (device-height: 640px)
    and (-webkit-device-pixel-ratio: 3)
    and (orientation: landscape) {
        .datatable_mobilescroll{
            position: relative;
            width: 150%;
            border: 1px solid #d3d3d3;

        }

    }

    /* Landscape */
    @media screen
    and (device-width: 320px)
    and (device-height: 640px)
    and (-webkit-device-pixel-ratio: 3)
    and (orientation: portrait) {
        .datatable_mobilescroll_wrapper {
            width: 100%;
            box-sizing: content-box;
            box-sizing: border-box;
            box-sizing: inherit;
            box-sizing: initial;
            box-sizing: unset;
            position: relative;
            display: block;
            white-space: nowrap;
            overflow-x: scroll;
        }
        .datatable_mobilescroll{
            position: relative;
            width: 150%;
            border: 1px solid #d3d3d3;

        }
        .datatable_mobilescroll td {
            border: 1px solid #7a792f !important;
            border-color: #7a792f;
            padding: 0px;
            border-spacing: 0px;
        }

    }
}

/* iPhone Portrait + Landscape */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 736px) 
and (-webkit-min-device-pixel-ratio: 2) {
    .datatable_mobilescroll_wrapper.scroll-shadow{
        background-color: transparent;
        -webkit-box-shadow: inset -27px 0px 40px -25px rgba(0,0,0,0.75);
        -moz-box-shadow: inset -27px 0px 40px -25px rgba(0,0,0,0.75);
        box-shadow: inset -27px 0px 40px -25px rgba(0,0,0,0.75);
    }
    .datatable_mobilescroll_wrapper.scroll-shadow > table{
        z-index:-1;
    }
}

/* iPad Portrait + Landscape */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
    .datatable_mobilescroll_wrapper.scroll-shadow{
        background-color: transparent;
        -webkit-box-shadow: inset -27px 0px 40px -25px rgba(0,0,0,0.75);
        -moz-box-shadow: inset -27px 0px 40px -25px rgba(0,0,0,0.75);
        box-shadow: inset -27px 0px 40px -25px rgba(0,0,0,0.75);
    }
    .datatable_mobilescroll_wrapper.scroll-shadow > table{
        z-index:-1;
    }
}