.content_item {
    width: 45%;
    display: inline-block;
}

    .content_item:first-child {
        margin-left: 2%;
        margin-right: 1%;
    }

    .content_item:last-child {
        margin-left: 1%;
        margin-right: 2%;
    }

.content_img {
    width: 100%;
    height: 150px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    position: relative;
}

.content_data {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(140, 190, 70, 1);
    padding-left: 1%;
    font-size: 1.0em;
}

    .content_data table {
        width: 100%;
        table-layout: fixed;
    }

        .content_data table td {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .content_data_td_cart{
            width:32px;
        }


.audio_data {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding-left: 1%;
    font-size: .5em;
    background-color: #007cbc;
    display:table;
    table-layout:fixed;
}

.item_play_icon  {
    width: 5%;
    height: 5%;
    float: left;
    display: inline-block;
    
    background-size: 100% 100%;
    margin-right: 2%;
    cursor: pointer;
}

.audio_play_icon {
    width: 5%;
    height: 5%;
    float: left;
    display: block;
    background-image: url('images/play.svg');
    background-size: 100% 100%;
    margin-right: 2%;
    cursor: pointer;
}

.item_play_mode{
    background-image: url('images/play.svg');
}

.item_pause_mode{
    background-image: url('images/Pause.svg');
}

.item_cart_icon {
    width: 5%;
    height: 5%;
    float: left;
    display: inline-block;
    background-image: url('images/Purchase.svg');
    background-size: 100% 100%;
    cursor: pointer;
}

.audio_pause_icon {
    width: 5%;
    height: 5%;
    float: left;
    display: block;
    background-image: url('images/Pause.svg');
    background-size: 100% 100%;
    cursor: pointer;
}

.rte {
    text-align: right;
    
}

.ar-text{
    direction:rtl;
}

.item_song_title , .item_artist_title{
        overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.item_text {
    /*display: inline-block;
    float: right;


    */
    padding-right: 1%;
    color: #ffffff; 
    
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#8cbe4c+0,8cbe4c+100&0+0,0.71+17,1+100 */
    background: -moz-linear-gradient(left, rgba(140,190,76,0) 0%, rgba(140,190,76,0.71) 17%, rgba(140,190,76,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, rgba(140,190,76,0) 0%, rgba(140,190,76,0.71) 17%, rgba(140,190,76,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, rgba(140,190,76,0) 0%, rgba(140,190,76,0.71) 17%, rgba(140,190,76,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#008cbe4c', endColorstr='#8cbe4c', GradientType=1 ); /* IE6-9 */
}

.audio_text {
    display: block;
    float: right;
    padding-right: 1%;
    padding-top: .5em;
    padding-bottom: .5em;
    color: #ffffff; 
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis; 
}

.audio_song_title {
    font-size: 1.2rem;
}

.audio_artist_title {
    font-size: 1.2rem;
    color: #ffffff;
}

.country_operator .k-list, .country_operator .k-slider, .country_operator .km-widget {
    color: #ffffff;
    background-color: #007cbc;
}

.content_cart .k-list, .content_cart .k-slider, .content_cart .km-widget {
    color: #ffffff;
    background-color: #007cbc;
}

.content_subscription .k-list, .content_subscription .k-slider, .content_subscription .km-widget {
    color: #ffffff;
    background-color: #007cbc;
}

.about_service .k-list, .about_service .k-slider, .about_service .km-widget {
    color: #ffffff;
    background-color: #007cbc;
}

.about_service_header {
    color: #fff;
    background-color: rgba(140, 190, 70, 1);
    padding: .5em;
}

p.about_service_details {
    color: #fff;
    padding-top: .5em;
}

.audio_duration{
    font-family:'Avgardm';
    color: white;
    font-size: 1rem;
    /*position: absolute;
    bottom: 0px;*/
    display:block; 
    vertical-align :top;
    text-align:left;  
    white-space:nowrap;      
    color: #abe1ff;
}

/*----font awesome---------------------------------------------------------------------------------*/
.fa .km-icon:after, .fa .km-icon:before {
    font: 1em/1em 'FontAwesome';
}

.km-bars:after, .km-bars:before {
    content: "\f0c9";
}

.km-location:after, .km-location:before {
    content: "\e0b4";
}

.km-info:after, .km-info:before {
    content: "\e0fb";
}

.km-fa-chevron-circle-right:after, .km-fa-chevron-circle-right:before {
    content: "\f138";
}

/*------custom fonts---------*/
.km-root .km-pane .km-view .km-language {
    background-image: url("images/global-management.svg");
    background-size: 100% 100%;
    -webkit-background-clip: border-box;
}
/*----kendo font ---------------------------------------------------------------------------------*/
.km-drawer-button:before, .km-drawer-button:after {
    content: "\E0ab";
}

.km-inbox:before, .km-inbox:after {
    content: "\E0B0";
}

.km-sent:before, .km-sent:after {
    content: "\E0C6";
}

.km-trash:before, .km-trash:after {
    content: "\E0C3";
}

.km-spam:before, .km-spam:after {
    content: "\E0C5";
}

.km-star:before, .km-star:after {
    content: "\E0D7";
}

.km-settings:before, .km-settings:after {
    content: "\E0DA";
}

.km-off:before, .km-off:after {
    content: "\E0B9";
}


/*--------------------*/

@font-face {
    font-family: 'stc_ar';
    src: url('fonts/Ar/stc.otf') format('opentype');
}

@font-face {
    font-family: 'Avgardm';
    src: url('fonts/En/Avgardm.ttf') format('truetype');
}

.km-nova {
    font-family: 'stc_ar';
}

.km-novo-english {
    font-family: 'Avgardm';
}

.km-novo-arabic {
    font-family: 'stc_ar';
}


.icon-operator{
    display:inline-block;
    width:40px;
    height:40px;
    background-repeat:no-repeat;
    border: 1px solid #ffffff;
    border-radius: 5px;
    background-color: #ffffff;
}

.icon-operator-du{
    background-image:url('images/operator/du.png');
}

.icon-operator-etisalat{
    background-image:url('images/operator/etisalat.png');
}

.icon-operator-mobily{
    background-image:url('images/operator/mobily.png');
}

.icon-operator-ooredoo{
    background-image:url('images/operator/ooredoo.png');
}

.icon-operator-stc{
    background-image:url('images/operator/stc.png');
}

.icon-operator-viva{
    background-image:url('images/operator/viva.png');
}

.icon-operator-zain{
    background-image:url('images/operator/zain.png');
}