.referralBox, .referralBoxEndM {
    padding: 10px;
    margin-bottom: 10px;
    text-align: left;
    display: flex;
    flex-direction: row;
    flex-flow: row;
    padding-top: 0px;
    position: relative;
    width: 100%;
    min-height: 1px;

}




.rowMreverse {
    display: flex;
    flex-direction: row;
    width: 50%
}

.card-bodyREf {
    word-break: break-word;

}


p {
    margin-bottom: 5px !important;
}

.chevron-img, .chevron-img-left, .chevron-img-downM, .chevron-img-left-downM {
    height: 30px;
    width: 30px;
    margin: auto;
    padding-left: 20px;
}

.hiddenL {
    display: none;
}
.hiddenNotM{
    display:none;
}
.hiddenNotS {
    display: none;
}

.bannerRow {
    flex-direction: row;
    display: flex;
}
.bannerButton {
    text-align: center;
    margin:auto 0px auto auto;
    padding-left: 10px;
}
.bannerText {
    text-align: center;
    margin: auto auto auto 0px;
    padding-right: 10px;
}



    @media (min-width: 576px) and (max-width:991px) {

    
    }

    @media (max-width: 576px) {
  
    }


    @media (min-width: 1440px) {

        .referralBox, .referralBoxEndM {
            flex: 0 0 25%;
            max-width: 25%;
            -ms-flex: 0 0 25%;
        }

        .bannerBox {
            width: 50%;
        }
    }




    .box-default {
        background-color: white;
        color: black;
    }

        .box-default.disabled {
            opacity: 0.5;
            background-color: inherit;
            color: white;
            border: 2px solid;
            box-shadow: none;
        }

    .titleText {
        font-size: 24px;
        text-transform: uppercase;
        font-weight: 500
    }

    .normalText {
        font-size: 16px;
    }

    .standartInput {
        border-radius: 5px;
        font-size: 16px;
    }

    .inputSpace {
        color: #495057 !important;
        background-color: #fff;
        border-color: #80bdff;
        outline: 0;
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
    }

    .dataTables_length label .select2 {
        padding: 0px 10px 0px 10px;
    }

    .dataTables_length label {
        display: flex;
        flex-direction: row;
        flex-flow: row;
    }


    .nav-tabs-custom > .nav-tabs > li > a, .nav-tabs-custom > .nav-tabs > li > a:hover {
        background-color: #3e4248;
        height: 100%;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }

        .nav-tabs-custom > .nav-tabs > li > a.active:hover, .nav-tabs-custom > .nav-tabs > li > a.active {
            background-color: #efefef;
            color: black;
            border-top-color: #efefef;
        }

    .no-padding {
        padding: 0px;
    }

    .toolbar-text {
        width: 200px;
    }

    .row {
        margin-left: 0px;
    }

    .userProfileButton {
        background-color: #26C6DA;
        border-color: #17acbf;
        color: white;
        padding: 10px 20px 10px 20px;
        border-top-right-radius: 5px !important;
        border-bottom-right-radius: 5px !important;
    }

    .nav-tabs-custom > .tab-content {
        padding-left: 0px;
    }

    .box {
        padding-left: 30px;
        padding-right: 10px;
        border-radius: 5px;
    }

    @media only screen and (max-width: 640px) {
        .HiddenM {
            display: none;
        }
        .visibleS {
            display: inherit;
        }
        .bannerButton {
            margin-right: auto;
            padding-left: 0px;
        }

        .bannerText {
            margin-left: auto;
        }

        .bannerRow {
            flex-direction: column;
        }


        .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
            padding-right: 0px;
            padding-left: 0px;
        }

        .hiddenL {
            display: inherit;
        }

        .hiddenNotS {
            display: inherit;
        }



        .hiddenS {
            display: none
        }

        .rowMreverse {
            width: 100%;
            flex-wrap: inherit;
        }

        .referralBox, .referralBoxEndM {
            flex-direction: column;
        }

        .chevron-img, .chevron-img-downM {
            padding-left: 20px;
            -webkit-transform: rotate(90deg);
            -moz-transform: rotate(90deg);
            -ms-transform: rotate(90deg);
            -o-transform: rotate(90deg);
            transform: rotate(90deg);
        }

        .chevron-img-left, .chevron-img-left-downM {
            -webkit-transform: rotate(270deg);
            -moz-transform: rotate(270deg);
            -ms-transform: rotate(270deg);
            -o-transform: rotate(270deg);
            transform: rotate(270deg);
            padding-right: 20px;
            padding-left: 0px;
        }

        .reverse-colS {
            flex-direction: column-reverse
        }
    }

    @media (min-width: 641px) and (max-width: 1440px) {
        .referralBox, .referralBoxEndM {
            flex: 0 0 50%;
            max-width: 50%;
            -ms-flex: 0 0 50%;
        }
        .HiddenM {
            display: none;
        }

        .reverseM {
            -webkit-transform: rotate(180deg);
            -moz-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            padding-right: 20px;
            padding-left: 0px;
        }
        .padding-bottomM {
            padding-bottom: 35px;
        }
        .rowMreverse {
            flex-direction: row-reverse;
            width: 100%
        }




        .hiddenNotM {
            display: inherit;
        }


        .padding-leftM {
            padding-left: 50px;
        }



        .padding-rightM {
            padding-right: 50px;
        }


        .referralBoxEndM {
            flex-direction: column;
        }
        .arrow-correction {
            padding-right: 30px;
        }

        .card-bodyREf {
            min-height: 145px;
        }



        .hiddenL {
            display: inherit;
        }



        .chevron-img-downM {
            -webkit-transform: rotate(90deg);
            -moz-transform: rotate(90deg);
            -ms-transform: rotate(90deg);
            -o-transform: rotate(90deg);
            transform: rotate(90deg);
        }

        .chevron-img-left-downM {
            -webkit-transform: rotate(270deg);
            -moz-transform: rotate(270deg);
            -ms-transform: rotate(270deg);
            -o-transform: rotate(270deg);
            transform: rotate(270deg);
            padding-right: 20px;
            padding-left: 0px;
        }

        .rightBoxM {
            padding-left: 10px;
            padding-right: 40px;
        }
    }

    @media (min-width: 768px) {
        .rightBav-tab {
            margin-right: auto !important;
        }
    }