/*---------------------------------------------------------
    BETHISTORY VISUAL
---------------------------------------------------------*/

#bethistory_visual {
    display: block;
    margin: 0;
    border-top: 1px solid #454462;
    border-bottom: 1px solid #454462;
}

#bethistory_visual > .visual_list {
    display: block;
    margin: 0;
    min-width: 1400px;
    height: 483px;
    position: relative;
    overflow: hidden;
}

#bethistory_visual > .visual_list > .visual_item {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    transition: all 600ms;
}

#bethistory_visual > .visual_list > .visual_item.active {
    opacity: 1;
    transition: all 600ms;
}

#bethistory_visual > .visual_list > .visual_item > .visual_bg {
    display: block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1600px;
    height: 483px;
    object-fit: none;
    object-position: center;
}

#bethistory_visual > .visual_list > .visual_item > .visual_entity {
    display: block;
    position: absolute;
    left: 50%;
    top:-100px;
    width: 800px;
    height: 483px;
    object-fit: none;
    object-position:top center;
    transform: translate(-50%) scale(1);
    opacity: 0;
}

#bethistory_visual > .visual_list > .visual_item.active > .visual_entity {
    transition-delay: 200ms;
    transition-property: all;
    transition-duration: 400ms;
    transform: translate(-50%) scale(1);
    top: 0px;
    opacity: 1;
}

#bethistory_visual > .visual_list > .visual_item > .visual_label {
    display: block;
    position: absolute;
    left: 50%;
    bottom:10px;
    width: 800px;
    object-fit: none;
    object-position: center bottom;
    transform: translate(-50%) scale(0.5);
    opacity: 0;
}

#bethistory_visual > .visual_list > .visual_item.active > .visual_label {
    transition-delay: 400ms;
    transition-property: all;
    transition-duration: 400ms;
    transform: translate(-50%) scale(1);
    opacity: 1;
}

#bethistory_visual > .visual_list > .visual_item > .visual_mask_left {
    display: block;
    position: absolute;
    right: 50%;
    top: 0px;
    bottom: 0px;
    width: 800px;
}

#bethistory_visual > .visual_list > .visual_item > .visual_mask_right {
    display: block;
    position: absolute;
    left: 50%;
    top: 0px;
    bottom: 0px;
    width: 800px;
}

#bethistory_visual .visual_btns {
    position: absolute;
    display: none;
    left: 50%;
    height: 0px;
    bottom: 50px;
    transform: translate(-50%, -50%);
}

#bethistory_visual .visual_btns > .btn_circle {
    display: block;
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    margin: 10px;
    border-radius: 10px;
    background: #42425f;
    transform: translateY(-50%);
    cursor: pointer;
    transition: all 300ms;
}

#bethistory_visual .visual_btns > .btn_circle.active {
    background: #ffc967;
    box-shadow: 0px 0px 20px 5px #ffc967;
    width: 16px;
    height: 16px;
    border-radius: 10px;
    transition: all 300ms;
}

/*---------------------------------------------------------
    BETHISTORY NAV
---------------------------------------------------------*/
#bethistory_nav {
    display: flex;
    justify-content: center;
    min-width: 1400px;
    background: #29324b;
    border-bottom: 1px solid #29324b;
}

#bethistory_nav > .flexbox {
    display: flex;
    min-width: 1400px;
    max-width: 2200px;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
}

#bethistory_nav > .flexbox > .navitem {
    display: block;
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    margin-left: 1px;
    background: #07172d;
    font-size: 16px;
    font-weight: 600;
    color: #888888;
    cursor: pointer;
}

#bethistory_nav > .flexbox > .navitem.active,
#bethistory_nav > .flexbox > .navitem:hover {
    border-top: 2px solid #ef7c00;
    line-height: 46px;
    background: #29324b;
    color: #ffffff;
}

/*---------------------------------------------------------
    BETHISTORY LIST
---------------------------------------------------------*/
#bethistory_list {
    display: flex;
    justify-content: center;
    min-width: 1400px;
}

#bethistory_list .nation_flag {
    height:22px;
}

#bethistory_list > .listbox {
    display: block;
    min-width: 1400px;
    max-width: 2200px;
    padding:20px;
    width:100%;
}

#bethistory_list > .listbox > .listitem {
    display: block;
    /*margin-bottom:20px;*/
}

#bethistory_list > .listbox > .listitem > .row {
    display: flex;
}

#bethistory_list > .listbox > .listitem > .row.row_title {
    height:62px;
}

#bethistory_list > .listbox > .listitem > .row.row_title > .type {
    display: flex;
    width:100px;
    text-align: center;
    flex-direction: column;
    justify-content: center;
    flex-shrink: 0;
    background:#29324b;
    position: relative;
    overflow: hidden;
    margin-right:1px;
}


#bethistory_list > .listbox > .listitem > .row.row_title > .type > .game_type {
    font-size:12px;
    color:#888888;
}

#bethistory_list > .listbox > .listitem > .row.row_title > .type > .game_category {
    font-size:14px;
    font-weight:600;
    color:#cccccc;
}

@keyframes bethistory_list_effect {
    0%{
        background-position: 0rem;
    }
    100%{
        background-position: 20rem;
    }
}

#bethistory_list > .listbox > .listitem > .row.row_title > .type > .effect {
    position: absolute;
    display: block;
    left:0px;
    top:0px;
    right:0px;
    bottom:0px;
    background:
            linear-gradient(135deg,
            rgba(255, 255, 255, .1) 25%,
            transparent 25%,
            transparent 50%,
            rgba(255, 255, 255, .1) 50%,
            rgba(255, 255, 255, .1) 75%,
            transparent 75%, transparent);
    background-size: 20rem 20rem;
    filter:blur(10px);
    animation: bethistory_list_effect 3s infinite linear;
}

#bethistory_list > .listbox > .listitem > .row.row_title > .league {
    flex-grow: 1;
    background:  #07172d;
    position: relative;
    overflow: hidden;
    display: flex;
    line-height:62px;
}

#bethistory_list > .listbox > .listitem > .row.row_title > .league > .nation_flag {
    margin-top:20px;
    margin-bottom:20px;
    margin-left:20px;
    margin-right:10px;
}

#bethistory_list > .listbox > .listitem > .row.row_title > .league > .nation_flag2 {
    margin-top:20px;
    margin-bottom:20px;
    margin-right:10px;
}

#bethistory_list > .listbox > .listitem > .row.row_title > .league > .bet365_flag {
    margin-top:20px;
    margin-bottom:20px;
    margin-left:10px;
}

#bethistory_list > .listbox > .listitem > .row.row_title > .league > .league_name {
    font-size:16px;
    text-shadow:
            0px 0px 5px rgba(0,0,0,0.5),
            0px 0px 10px rgba(0,0,0,0.5);
    color:#cccccc;
}

#bethistory_list > .listbox > .listitem > .row.row_title > .datetime {
    font-size:16px;
    text-shadow:
            0px 0px 5px rgba(0,0,0,0.5),
            0px 0px 10px rgba(0,0,0,0.5);
    color:#aaaaaa;
    flex-shrink: 0;
    background:  #07172d;
    margin-left:1px;
    width:160px;
    line-height:62px;
    text-align: center;
}

#bethistory_list > .listbox > .listitem > .row.row_title > .datetime > span {
    color:#ef7c00;
}

#bethistory_list > .listbox > .listitem > .row.row_item {
    height:40px;
    margin-top:1px;
}

#bethistory_list > .listbox > .listitem > .row.row_item > .result {
    display: block;
    width:100px;
    text-align: center;
    flex-direction: column;
    justify-content: center;
    flex-shrink: 0;
    background:#11141d;
    position: relative;
    overflow: hidden;
    margin-right:1px;
    font-size:14px;
    line-height:40px;
}

#bethistory_list > .listbox > .listitem > .row.row_item > .bet_type {
    display: block;
    width:100px;
    text-align: center;
    flex-direction: column;
    justify-content: center;
    flex-shrink: 0;
    background:#07172d;
    position: relative;
    overflow: hidden;
    margin-right:1px;
    font-size:14px;
    line-height:40px;
}


#bethistory_list > .listbox > .listitem > .row.row_item > .home_score {
    display: block;
    width:80px;
    text-align: center;
    flex-direction: column;
    justify-content: center;
    flex-shrink: 0;
    background:#0d1d32;
    position: relative;
    overflow: hidden;
    margin-right:1px;
    font-size:14px;
    line-height:40px;
}

#bethistory_list > .listbox > .listitem > .row.row_item > .away_score {
    display: block;
    width:80px;
    text-align: center;
    flex-direction: column;
    justify-content: center;
    flex-shrink: 0;
    background:#0d1d32;
    position: relative;
    overflow: hidden;
    font-size:14px;
    line-height:40px;
}

#bethistory_list > .listbox > .listitem > .row.row_item > .betitem {
    display: flex;
    width:100%;
    padding-left:10px;
    /*padding-right:10px;*/
    justify-content: space-between;
    margin-left:1px;
    background:#0d1d32;
}

@keyframes bethistory_list_betitem_effect {
    0%{
        background-position: 0rem;
    }
    100%{
        background-position: 0.5rem;
    }
}

#bethistory_list > .listbox > .listitem > .row.row_item > .betitem.active {
    /*background: linear-gradient(135deg, rgba(255, 255, 255, .02) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .02) 50%, rgba(255, 255, 255, .02) 75%, transparent 75%, transparent), #29324b;
    background-size: 0.5rem 0.5rem;
    animation: bethistory_list_betitem_effect 0.5s infinite linear;
	background:url("/images/1bet1/bethistory_on_bg.png") no-repeat;*/
    background: url(/images/1bet1/sports/title_effect_overlay.png), #07172d;
}

#bethistory_list > .listbox > .listitem > .row.row_item > .betitem > .name {
    line-height:40px;
    font-size:14px;
    color:#cccccc;
    order:10;
}

#bethistory_list > .listbox > .listitem > .row.row_item > .betitem > .odds {
    line-height:40px;
    font-size:14px;
    color:#ffc967;
    order:20;
}

#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.away {
    padding-left:0px;
    scale:-1;
}

#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.home {
    padding-right:0px
}

#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.draw {
    width:100px;
    justify-content: center;
    flex-shrink: 0;
    padding:0px;
}

#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.draw > .name {
    display: none;
}
#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.away > .name ,
#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.away > .odds {
    scale:-1;
}

#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.away > .name {
    order:1;
    padding-right:10px;
}
#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.away > .odds {
    order: 5;
    width:100px;
    text-align: center;
    flex-shrink: 0;
    border-right:1px solid #070a0f;
}
#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.draw > .odds {
    width:100%;
    text-align: center;
}

#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.home > .odds {
    width:100px;
    text-align: center;
    flex-shrink: 0;
    border-left:1px solid #070a0f;
}

#bethistory_list.sports_nation > .listbox > .listitem > .row.row_item > .betitem.active > .odds {
    background: #ef7c00;
    color:#ffffff;
}




#bethistory_list > .listbox > .listitem > .row.row_result {
    height:40px;
    margin-top:1px;
}

#bethistory_list > .listbox > .listitem > .row.row_result > .chkbox {
    height:40px;
    width:40px;
    position: relative;
    background:#0d1015;
}

#bethistory_list > .listbox > .listitem > .row.row_result > .chkbox > input[type='checkbox'] {
    margin:0px;
    padding:0px;
    border:0px;
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%, -50%);
    filter:invert(0.8);
}

#bethistory_list > .listbox > .listitem > .row.row_result > .result_item {
    margin-left:1px;
    background:#0d1015;
    display: flex;
    padding-left:20px;
    padding-right:20px;
    justify-content: space-between;
    flex-shrink: 1;
}

#bethistory_list > .listbox > .listitem > .row.row_result > .result_item > .label {
    line-height:40px;
    height:40px;
    font-size:14px;
    color:#aaaaaa;
}


#bethistory_list > .listbox > .listitem > .row.row_result > .result_item > .value {
    line-height:40px;
    height:40px;
    font-size:14px;
    margin-left:80px;
    color:#ffffff;
    text-shadow:
            0 0 3px #fff,
            0 0 5px #ff8100,
            0 0 10px #f00,
            0 0 15px #ef7c00;
}

#bethistory_list > .listbox > .listitem > .row.row_result > .expand {
    flex-grow: 1;
    background:#0d1015;
    margin-left:1px;
}

#bethistory_list > .listbox > .listitem > .row.row_result > .btn {
    flex-shrink: 0;
    width:100px;
    line-height:40px;
    text-align: center;
    background:#11141d;
    margin-left:1px;
    cursor:pointer;
    transition: all 300ms;
    font-size:14px;
}

#bethistory_list > .listbox > .listitem > .row.row_result > .btn:hover {
    color:#ef7c00;
    background:#272f39;
    transition: all 300ms;
}

.btn {
    flex-shrink: 0;
    width:100px;
    line-height:40px;
    text-align: center;
    background:#11141d;
    margin-left:1px;
    cursor:pointer;
    transition: all 300ms;
    font-size:14px;
}

.btn:hover {
    color:#ef7c00;
    background:#272f39;
    transition: all 300ms;
}