/*---------------------------------------------------------
    MAIN LIVESPORTS
---------------------------------------------------------*/
#main_livesports {
    display: block;
    margin:0;
    
    text-align: center;
    position: relative;
}

#main_livesports > .titlebox {
    display: block;
    margin:0 auto;
    text-align: left;
    padding-left:20px;
    padding-right:20px;
    padding-top:10px;
    padding-bottom:10px;
}

#main_livesports > .titlebox > h3 {
    margin:0;
    padding:0;
    border:0;
    display: block;
    font-size:18px;
    color:#ffffff;
}

#main_livesports > .inner_center {
    display: block;
    margin:0 auto;
    padding:0;
    border:0;
    text-align: left;
    min-width: 1400px;
    max-width: 2200px;
    padding-left:20px;
    padding-right:20px;
}

#main_livesports > .gridbox {
    display: grid;
    grid-auto-flow: column;
    gap:5px;
    min-width: 1400px;
    max-width: 2200px;
    margin:0 auto;
    height:530px;
    text-align: left;
    padding-left:20px;
    padding-right:20px;
    grid-template: repeat(8, 1fr) / repeat(18, 1fr);
}

#main_livesports  .video_tab {
    grid-column: span 6;
    grid-row: span 1;
    height:44px;
    display: grid;
    grid-gap: 5px;
    margin-left:5px;
    margin-right:5px;
    margin-bottom:5px;
    grid-template: repeat(1, 1fr) / repeat(2, 1fr);
}

#main_livesports .video_tab > .tabitem {
    display: flex;
    justify-content: center;
    width: 100%;
    border: 2px solid #242424;
    cursor: pointer;
    border-radius: 5px;
}

#main_livesports .video_tab > .tabitem:hover,
#main_livesports .video_tab > .tabitem.active  {
    background: #29324b;
}

#main_livesports .video_tab > .tabitem > .icon {
    object-fit: scale-down;
    object-position: center;
    height:16px;
    margin-top:12px;
    margin-bottom:12px;
}

#main_livesports .video_tab > .tabitem > .icon.icon_statistics {
    object-fit: scale-down;
    object-position: center;
    height:14px;
    margin-top:13px;
    margin-bottom:13px;
}


#main_livesports .video_tab > .tabitem > .label {
    height:40px;
    line-height:36px;
    font-size:13px;
    margin-left:5px;
    font-family: 'Gmarket Sans';
    padding-top:4px;
}


#main_livesports > .gridbox > .video {
    display: block;
    grid-column: span 6;
    grid-row: span 7;
    border:1px solid #313742;
    background:#000000;
    z-index:4;
    position: relative;
}

#main_livesports > .gridbox > .view {
    display: grid;
    grid-auto-flow: row;
    grid-template: repeat(8,1fr) / repeat(8,1fr);
    grid-column: span 5;
    grid-row: span 8;
    border: 3px solid #2f3c64;
    background: #11141d;
    z-index: 1;
    position: relative;
    border-radius: 10px;
}

#main_livesports > .gridbox > .category {
    display: flex;
    grid-column: span 7;
    grid-row: span 1;
    border:1px solid #313742;
    background:#11141d;
    z-index:3;
    height:62px;
}

#main_livesports > .gridbox > .list {
    display: block;
    grid-column: span 7;
    grid-row: span 7;
    overflow-y: scroll;
    overflow-x: hidden;
    position: relative;
    z-index:2;
}

#main_livesports > .gridbox > .video > .video_inner {
    position: relative;
    display: block;
    height:fit-content;
}

#main_livesports > .gridbox > .view > .title {
    height: 61px;
    line-height: 60px;
    text-align: center;
    border-bottom: 4px solid #ef7c00;
    grid-row: span 1;
    grid-column: span 8;
    overflow: hidden;
    font-size: 28px;
    font-weight: 100;
    border-radius: 10px;    
}

#main_livesports > .gridbox > .view > .title > span {
    color:#ef7c00;
}

#main_livesports > .gridbox > .view > .team {
    text-align: center;
    border-bottom: 5px solid #586e97;
    grid-row: span 5;
    grid-column: span 4;
    overflow: hidden;
    display: block;
    position: relative;
    border-radius: 10px;
}

#main_livesports > .gridbox > .view > .team.team_home {
    border-right:1px solid #313742;
}


#main_livesports > .gridbox > .view > .team.team_home > .team_icon {
    width:100px;
    height:100px;
    position: absolute;
    display: block;
    right:100px;
    top:50%;
    transform: translate(0, -50%);
    border-radius:50px;
    background:radial-gradient(#0344a1 60%, #5f91d8 70%, #0344a1 80%);
    border:1px solid #313742;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
    object-fit: scale-down;
    padding:10px;
}

#main_livesports > .gridbox > .view > .team.team_away > .team_icon {
    width:100px;
    height:100px;
    position: absolute;
    display: block;
    left:100px;
    top:50%;
    transform: translate(0, -50%);
    border-radius:50px;
    background:radial-gradient(#d70029 60%, #ff8da1 70%, #d70029 80%);
    border:1px solid #313742;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
    object-fit: scale-down;
    padding:10px;
}

#main_livesports > .gridbox > .view > .team.team_home > .team_score {
    position: absolute;
    display: block;
    right:20px;
    top:50%;
    transform: translate(0,-50%);
    width:55px;
    margin-right:5px;
    text-align: center;
    color:#ffffff;
    font-weight:900;
    font-size:40px;
    font-family: 'Rajdhani';
}

#main_livesports > .gridbox > .view > .team.team_away > .team_score {
    position: absolute;
    display: block;
    left:20px;
    top:50%;
    transform: translate(0,-50%);
    width:55px;
    margin-right:5px;
    text-align: center;
    color:#ffffff;
    font-weight:900;
    font-size:40px;
    font-family: 'Rajdhani';
}

#main_livesports > .gridbox > .view > .team > .team_name {
    position: absolute;
    display: block;
    text-align:center;
    left:20px;
    right:20px;
    top:50%;
    margin-top:60px;
    color:#ffffff;
    font-weight:900;
    font-size:20px;
    font-family: 'Rajdhani';
}

#main_livesports > .gridbox > .view > .bet {
    display: flex;
    border-bottom:1px solid #313742;
    grid-row: span 1;
    grid-column: span 8;
    overflow: hidden;
    margin-left:-1px;
    height:100px;
    position: relative;
}

#main_livesports > .gridbox > .view > .bet > .empty {
    display: block;
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%, -50%);
    font-size:16px;
}


#main_livesports > .gridbox > .view > .bet > .betgroup {
    display: block;
}

#main_livesports > .gridbox > .view > .bet > .betgroup.betgroup_winlose,
#main_livesports > .gridbox > .view > .bet > .betgroup.betgroup_handycap {
    display: block;
    width:200%;
    border-left:1px solid #313742;
}

#main_livesports > .gridbox > .view > .bet > .betgroup.betgroup_windrawlose {
    display: block;
    width:300%;
    border-left:1px solid #313742;
}

#main_livesports > .gridbox > .view > .bet > .betgroup.betgroup_overunder {
    display: block;
    width:250%;
    border-left:1px solid #313742;
}

#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_type {
    display: block;
    border-bottom: 2px solid #313742;
    height: 36px;
    line-height: 36px;
    text-align: center;
    color: #a8a8a8;
    font-weight: 600;
    font-size: 14px;
    border-radius: 10px;
}

#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list {
    display: flex;
}

#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item {
    display: block;
    width:100%;
    text-align: center;
    border-left:1px solid #313742;
    margin-left:-1px;
    height:64px;
    cursor:pointer;
    transition: all 300ms;
    border-top:2px solid transparent;
}

#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item.activable.active,
#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item.activable:hover {
    background: #29324b;
    border-top:2px solid #ef7c00;
    transition: all 300ms;
}

#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item > .label {
    display: block;
    text-align: center;
    border-bottom:1px solid #313742;
    height:32px;
    line-height: 32px;
    color:#a8a8a8;
    font-size:13px;
}

#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item > .odds {
    display: block;
    text-align: center;
    line-height: 32px;
    height:32px;
    color:#a8a8a8;
    font-size:13px;
}
#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item.bet_item_option {
    width:50%;
}
#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item > .option {
    display: block;
    text-align: center;
    padding-top:17px;
    line-height: 15px;
    height:15px;
    color:#ef7c00;
    font-size:13px;
}

#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item.activable.active > .label,
#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item.activable:hover > .label,
#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item.activable.active > .odds,
#main_livesports > .gridbox > .view > .bet > .betgroup > .bet_list > .bet_item.activable:hover > .odds   {
    color: #ffffff;
}

#main_livesports > .gridbox > .view > .btn_betting {
    display: block;
    text-align: center;
    height:100px;
    line-height: 100px;
    grid-row: span 1;
    grid-column: span 8;
    font-weight: 600;
    font-size:28px;
    cursor:pointer;
}

#main_livesports > .gridbox > .view > .btn_betting:hover {
    background: #29324b;
    transition: all 200ms;
    color:#ffffff;
}

@media screen and (max-width: 1600px) {

    #main_livesports > .gridbox > .view > .title {
        grid-column: span 8;
        grid-row: span 1;
        order:1;
    }

    #main_livesports > .gridbox > .view > .team.team_home {
        grid-column: span 2;
        grid-row: span 3;
        order:2;
    }

    #main_livesports > .gridbox > .view > .bet {
        grid-column: span 6;
        grid-row: span 3;
        order:3;
    }

    #main_livesports > .gridbox > .view > .team.team_away {
        grid-column: span 2;
        grid-row: span 3;
        order:4;
        border-right:1px solid #313742;
    }

    #main_livesports > .gridbox > .view > .btn_betting {
        grid-column: span 6;
        grid-row: span 3;
        order:5;
    }

    #main_livesports > .gridbox > .view > .team.team_away > .team_score {
        position: absolute;
        display: block;
        right:20px;
        left:auto;
        top:50%;
        transform: translate(0,-50%);
        width:55px;
        text-align: center;
        color:#ffffff;
        font-weight:900;
        font-size:40px;
        font-family: 'Rajdhani';
    }

    #main_livesports > .gridbox > .view > .team.team_home > .team_icon {
        width:60px;
        height:60px;
        position: absolute;
        display: block;
        left:20px;
        right:auto;
        top:50%;
        transform: translate(0, -50%);
        border-radius:30px;
        background:radial-gradient(#0344a1 60%, #5f91d8 70%, #0344a1 80%);
        border:1px solid #313742;
        box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
        object-fit: scale-down;
        padding:10px;
    }
        
    #main_livesports > .gridbox > .view > .team.team_away > .team_icon {
        width:60px;
        height:60px;
        position: absolute;
        display: block;
        left:20px;
        right:auto;
        top:50%;
        transform: translate(0, -50%);
        border-radius:30px;
        background:radial-gradient(#d70029 60%, #ff8da1 70%, #d70029 80%);
        border:1px solid #313742;
        box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
        object-fit: scale-down;
        padding:10px;
    }
}

#main_livesports > .gridbox > .category > .btn_left,
#main_livesports > .gridbox > .category > .btn_right {
    display: block;
    flex-shrink: 0;
    width:30px;
    border-left:1px solid #313742;
    position:relative;
    cursor:pointer;
}

#main_livesports > .gridbox > .category > .btn_left > span,
#main_livesports > .gridbox > .category > .btn_right > span {
    display: block;
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%, -50%) scaleX(0.6);
    font-size:24px;
    font-weight: 600;
    color:#a8a8a8;
}

#main_livesports > .gridbox > .category > .btn_left:hover,
#main_livesports > .gridbox > .category > .btn_right:hover {
    background: #29324b;
    transition: all 300ms;
    animation: beat .25s infinite alternate;
}

#main_livesports > .gridbox > .category > .btn_left:hover > span,
#main_livesports > .gridbox > .category > .btn_right:hover > span {
    color:#ffffff;
    text-shadow: 
        0 0 5px #cfff5e,
        0 0 10px #ffb25e,
        0 0 20px #ef7c00;
}

#main_livesports > .gridbox > .category > .btn_search {
    display: block;
    flex-shrink: 0;
    width:130px;
    border-left:1px solid #313742;
    position:relative;
    cursor:pointer;
}

#main_livesports > .gridbox > .category > .btn_search > span {
    display: block;
    position: absolute;
    right:15px;
    top:50%;
    transform: translate(0, -50%);
    font-size:16px;
    font-weight: 600;
    color:#a8a8a8;
}

#main_livesports > .gridbox > .category > .btn_search > img {
    display: block;
    position: absolute;
    margin-top:2px;
    left:15px;
    top:50%;
    transform: translate(0, -50%);
    filter: grayscale(1);
}

#main_livesports > .gridbox > .category > .btn_search:hover {
    background: #29324b;
    color:#ef7c00;
    border:1px solid #29324b;
    transition: all 300ms;
    animation: beat .25s infinite alternate;
}

#main_livesports > .gridbox > .category > .btn_search:hover > span {
    color:#ffffff;
    text-shadow: 
        0 0 5px #cfff5e,
        0 0 10px #ffb25e,
        0 0 20px #ef7c00;
}

#main_livesports > .gridbox > .category > .btn_search:hover > img {
    filter: grayscale(0);
}

#main_livesports > .gridbox > .category > .sort {
    display: block;
    list-style: none;
    flex-shrink: 0;
    width:100px;
    position:relative;
    cursor:pointer;
}

#main_livesports > .gridbox > .category > .sort > li {
    list-style: none;
    position:absolute;
    display: block;
    left:0px;
    top:0px;
    right:0px;
    bottom:0px;
    border-left:1px solid #313742;
    transition: all 300ms;
}

#main_livesports > .gridbox > .category > .sort > li > span.value {
    display: block;
    position: absolute;
    padding-left:15px;
    line-height:59px;
    left:0;
    right:0;
    bottom:0;
    top:0;
    font-size:16px;
    font-weight: 600;
    color:#a8a8a8;
    z-index:3;
    transition: all 300ms;
}

#main_livesports > .gridbox > .category > .sort > li > span.arrow {
    display: block;
    position: absolute;
    right:15px;
    top:50%;
    transform: translate(0, -50%) scaleX(0.6);
    font-size:24px;
    font-weight: 600;
    color:#a8a8a8;
    z-index:2;
    transition: all 300ms;
}

#main_livesports > .gridbox > .category > .sort > li:hover,
#main_livesports > .gridbox > .category > .sort > li.active {
    background: #29324b;
    color:#ef7c00;
    border:1px solid #29324b;
    transition: all 300ms;
    animation: beat .25s infinite alternate;
}

#main_livesports > .gridbox > .category > .sort > li:hover > span.value,
#main_livesports > .gridbox > .category > .sort > li.active > span.value {
    color:#ffffff;
    transition: all 300ms;
    text-shadow: 
    0 0 5px #cfff5e,
    0 0 10px #ffb25e,
    0 0 20px #ef7c00;
}

#main_livesports > .gridbox > .category > .sort > li:hover > span.arrow,
#main_livesports > .gridbox > .category > .sort > li.active > span.arrow {
    color:#ffffff;
    transform: translate(0, -50%) scaleY(0.7) rotate(90deg);
    transition: all 300ms;
    text-shadow: 
    0 0 5px #cfff5e,
    0 0 10px #ffb25e,
    0 0 20px #ef7c00;
}


#main_livesports > .gridbox > .category > .sort > li > ul {
    display: block;
    list-style: none;
    overflow: hidden;
    max-height: 0px;
    position: absolute;
    left:-1px;
    right:-1px;
    top:59px;
    transition: all 300ms;
    z-index:1;
}

#main_livesports > .gridbox > .category > .sort > li > ul > li {
    display: block;
    background:#11141d;
    height:60px;
    line-height:60px;
    border-top:1px solid #313742;
    text-align: center;
    z-index:1;
}

#main_livesports > .gridbox > .category > .sort.active > li > ul {
    display: block;
    max-height: 130px;
    border:1px solid #313742;
    transition: all 300ms;
}

#main_livesports > .gridbox > .category > .sort.active > li > ul > li:hover,
#main_livesports > .gridbox > .category > .sort.active > li > ul > li.active {
    background:#344474;
}

#main_livesports > .gridbox > .category > .swipebox {
    display: flex;
    overflow-x: scroll;
    overflow-y: hidden;
    flex-grow: 1;
    margin-bottom:-3px;
}

#main_livesports > .gridbox > .category > .swipebox::-webkit-scrollbar {
    height:3px;
}

#main_livesports > .gridbox > .category > .swipebox::-webkit-scrollbar-track {
    background: #888888;
}

#main_livesports > .gridbox > .category > .swipebox::-webkit-scrollbar-track {
    background: #444444;
}

#main_livesports > .gridbox > .category > .swipebox > .ca_item {
    width:65px;
    flex-shrink: 0;
    overflow: hidden;
    border-right:1px solid #313742;
    display: block;
    position: relative;
    background: transparent;
    transition: background 300ms;
    cursor:pointer;
}

#main_livesports > .gridbox > .category > .swipebox > .ca_item > img {
    filter:brightness(0.6);
    position: absolute;
    display: block;
    bottom:38px;
    left:50%;
    transform: translate(-50%, 50%);
    width:20px;
    height:20px;
    object-fit: scale-down;
    object-position: center;
    transition: all 300ms;
}

#main_livesports > .gridbox > .category > .swipebox > .ca_item > span {
    position:absolute;
    bottom:8px;
    left:50%;
    transform: translate(-50%);
    color:#a8a8a8;
    font-weight:600;
    font-size:9px;
    letter-spacing: -1px;
    transition: all 300ms;
}

#main_livesports > .gridbox > .category > .swipebox > .ca_item:hover,
#main_livesports > .gridbox > .category > .swipebox > .ca_item.active {
    border-top:2px solid #ef7c00;
    background:#29324b;
    transition: background 300ms;
}

#main_livesports > .gridbox > .category > .swipebox > .ca_item:hover > img,
#main_livesports > .gridbox > .category > .swipebox > .ca_item.active > img {
    filter:brightness(1);
    transition: all 300ms;
}

#main_livesports > .gridbox > .category > .swipebox > .ca_item:hover > span,
#main_livesports > .gridbox > .category > .swipebox > .ca_item.active > span {
    color:#ffffff;
    transition: all 300ms;
}

#main_livesports > .gridbox > .list::-webkit-scrollbar {
    width:3px;
}

#main_livesports > .gridbox > .list::-webkit-scrollbar-track {
    background: #444444;
}

#main_livesports > .gridbox > .list::-webkit-scrollbar-thumb {
    background: #888888;
}

#main_livesports > .gridbox > .list > .item {
    background-color: #003e6a;
    stroke: #177099;
    background-image: url('../img/main_livesports/list_item_bg.svg');
    margin-right:5px;
    margin-bottom:5px;
    height:150px;
    overflow: hidden;
    border-radius: 15px;
    box-shadow: inset 0px 0px 20px rgba(255,255,255,0.3);
    filter:grayscale(1) brightness(0.5);
    cursor:pointer;
    position: relative;
    transition: all 100ms;
}

#main_livesports > .gridbox > .list > .item:hover {
    filter:grayscale(0) brightness(1);
    transition: all 100ms;
}

#main_livesports > .gridbox > .list > .item.active{
    filter:grayscale(0) brightness(1);
    transition: all 100ms;
}


#main_livesports > .gridbox > .list > .item > .league_name {
    background: url('../img/main_livesports/list_item_league_name_bg.png'), linear-gradient(#436592 0%, #1f344f 15%) ;
    background-repeat: no-repeat;
    background-position:left;
    height:50px;
    line-height:50px;
    text-align: center;
    font-size:18px;
    font-weight:600;
    color:#ffffff;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.5);
}

#main_livesports > .gridbox > .list > .item > .game_home_icon {
    position: absolute;
    display: block;
    width: 70px;
    height: 70px;
    border-radius: 35px;
    left:50%;
    top:100px;
    margin-left:-100px;
    background:radial-gradient(#0344a1 60%, #5f91d8 70%, #0344a1 80%);
    border:1px solid #313742;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
    object-fit: scale-down;
    padding:10px;
    transform: translate(-50%,-50%);
} 

#main_livesports > .gridbox > .list > .item > .game_away_icon {
    position: absolute;
    display: block;
    width: 70px;
    height: 70px;
    border-radius: 35px;
    left:50%;
    top:100px;
    margin-left:100px;
    background:radial-gradient(#d70029 60%, #ff8da1 70%, #d70029 80%);
    border:1px solid #313742;
    box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
    object-fit: scale-down;
    padding:10px;
    transform: translate(-50%,-50%);
}

#main_livesports > .gridbox > .list > .item > .game_home_name {
    position: absolute;
    display: block;
    right:50%;
    top:100px;
    transform: translate(0,-50%);
    margin-right:150px;
    text-align: right;
    color:#ffffff;
    font-weight:600;
    font-size:16px;
    left:20px;
}

#main_livesports > .gridbox > .list > .item > .game_away_name {
    position: absolute;
    display: block;
    left:50%;
    top:100px;
    transform: translate(0,-50%);
    margin-left:150px;
    text-align: left;
    color:#ffffff;
    font-weight:600;
    font-size:16px;
    right:20px;
}

#main_livesports > .gridbox > .list > .item > .game_home_score {
    position: absolute;
    display: block;
    right:50%;
    top:100px;
    transform: translate(0,-50%);
    width:55px;
    margin-right:5px;
    text-align: center;
    color:#ffffff;
    font-weight:900;
    font-size:30px;
    font-family: 'Rajdhani';
}

#main_livesports > .gridbox > .list > .item > .game_away_score {
    position: absolute;
    display: block;
    left:50%;
    top:100px;
    transform: translate(0,-50%);
    width:55px;
    margin-left:5px;
    text-align: center;
    color:#ffffff;
    font-weight:900;
    font-size:30px;
    font-family: 'Rajdhani';
}

#main_livesports > .gridbox > .list > .item > .game_vs_score {
    position: absolute;
    display: block;
    left:50%;
    top:98px;
    color:#ffffff;
    transform: translate(-50%,-50%);
    font-weight:900;
    font-size:30px;
    font-family: 'Rajdhani';
}

#main_livesports > .gridbox > .list > .item > .game_datetime {
    position: absolute;
    right:10px;
    top:5px;
    height:40px;
    line-height:15px;
    padding:5px;
    padding-left:10px;
    padding-right:10px;
    background: #192a3f;
    font-weight:600;
    font-size:13px;
    border-radius:10px;
    border-bottom:2px solid #6e7c8d;
    border-left:2px solid #18283c;
    border-top:2px solid #18283c;
    border-right:2px solid #18283c;
}

#main_livesports > .gridbox > .list > .empty {
    position: absolute;
    left:50%;
    top:50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

#main_livesports > .gridbox > .list > .empty > img {
    margin-bottom:15px;
}

#main_livesports > .gridbox > .list > .empty > span {
    font-size:24px;
    color:yellow;
}

/*---------------------------------------------------------
    MAIN SERVICES
---------------------------------------------------------*/
#main_services {
    display: block;
    min-width: 1400px;
    margin:0px;
    text-align: center;
}

#main_services > .titlebox {
    display: flex;
    justify-content: space-between;
    margin:0 auto;
    text-align: left;
    padding-left:20px;
    padding-right:20px;
    margin-top:40px;
    min-width: 1400px;
    max-width: 2200px;
    height:30px;
}

#main_services > .titlebox > h3 {
    margin:0;
    padding:0;
    border:0;
    display: block;
    font-size:20px;
    line-height:30px;
    color:#ffffff;
    cursor:pointer;
    height:30px;
}

#main_services > .titlebox > .btn_more {
    display: block;
    font-size:16px;
    line-height:30px;
    font-weight: 600;
    color:#ef7c00;
    height:30px;
    cursor: pointer;
}

#main_services > .titlebox > .btn_more:hover {
    color:#ffffff;
    text-shadow: 
        0 0 5px #cfff5e,
        0 0 10px #ffb25e,
        0 0 20px #ef7c00;
    transition: all 300ms;
}

#main_services > .titlebox > .btn_more > span {
    color:#ef7c00;
    font-size:16px;
    font-weight: 900;
    line-height:30px;
    height:30px;
}

#main_services > .titlebox > .btn_more:hover > span{
    color:#ffffff;
    transition: all 300ms;
}

#main_services > .gridbox {
    display: grid;
    margin:0 auto;
    text-align: left;
    gap:20px;
    padding:20px;
    grid-template: repeat(2,1fr) / repeat(4,1fr);
    grid-auto-flow: row;
    min-width: 1400px;
    max-width: 2200px;
}

#main_services > .gridbox > .service_item {
    display: block;
    width: 100%;
    height: 130px;
    border:1px solid #313742;
    border-radius: 10px;
    background: linear-gradient(#070a0f, #10131c);
    overflow: hidden;
    position: relative;
    cursor:pointer;
}

#main_services > .gridbox > .service_item.wide_off {
    display: none;
}

@media screen and (max-width: 1600px) {
    #main_services > .gridbox {
        grid-template: repeat(2,1fr) / repeat(3,1fr);
    }

    #main_services > .gridbox > .service_item.mini_off {
        display: none;
    }
}


#main_services > .gridbox > .service_item > .label {
    filter: grayscale(0.8) brightness(0.6);
    position: absolute;
    display: block;
    left:10px;
    top:15px;
}

#main_services > .gridbox > .service_item > .bg {
    position: absolute;
    right:0px;
    bottom:0px;
    filter: grayscale(0.6) brightness(0.6);
}

#main_services > .gridbox > .service_item:hover {
    background: linear-gradient(#002867, #000001);
}

#main_services > .gridbox > .service_item:hover > .label {
    filter: grayscale(0) brightness(1);
    transition: all 300ms;
}

#main_services > .gridbox > .service_item:hover > .bg {
    filter: grayscale(0) brightness(1);
    transition: all 300ms;
}

/*---------------------------------------------------------
    MAIN ESPORTS
---------------------------------------------------------*/
#main_esports {
    margin-top:40px;
    display: block;
    min-width: 1400px;
    background: linear-gradient(#0e1520 0px, #070a0f 200px);
    text-align: center;
    overflow: hidden;
}

#main_esports > .titlebox{
    display: block;
    margin:0 auto;
    min-width: 1400px;
    max-width: 2200px;
    height:200px;
    position: relative;
}

#main_esports > .titlebox > img {
    display: block;
    position: absolute;
    left:50%;
    top:40px;
    transform: translate(-50%);
}

#main_esports > .slidebox {
    display: flex;
    margin:0 auto;
    min-width: 1400px;
    max-width: 2200px;
    padding-left:20px;
    padding-right:20px;
    overflow: hidden;
}

#main_esports > .slidebox > .slideitem {
    display: block;
    overflow: hidden;
    transition: all 500ms;
    opacity: 0;
    position: relative;
    aspect-ratio: 182/269;
    width:0px;
    cursor: pointer;
}

#main_esports > .slidebox > .slideitem.show {
    display: block;
    max-width: auto;
    transition: all 500ms;
    opacity: 1;
    width:100%;
}

#main_esports > .slidebox > .slideitem > img {
    position: absolute;
    display: block;
}

#main_esports > .slidebox > .slideitem > img.base {
    left:50%;
    top:50%;
    transform: translate(-50%, -50%);
    width:70%;
}

#main_esports > .slidebox > .slideitem > img.visual {
    transform: translate(-48.5%);
    left:50%;
    width:67%;
    bottom:28%;
    filter: grayscale(0.6) brightness(0.5);
    transition: all 300ms;
}

#main_esports > .slidebox > .slideitem > img.label {
    transform: translate(-50%);
    left:50%;
    height:40%;
    bottom:12%;
    object-fit: scale-down;
    filter: grayscale(1) brightness(0.6);
    transition: all 300ms;
}

#main_esports > .slidebox > .slideitem:hover > img.visual {
    filter: grayscale(0) brightness(1);
    transition: all 300ms;
}

#main_esports > .slidebox > .slideitem:hover > img.label {
    filter: grayscale(0) brightness(1);
    transition: all 300ms;
}

/*---------------------------------------------------------
    MAIN CASINO
---------------------------------------------------------*/
#main_casino {
    display:block;
    min-width:1400px;
    margin:0px;
    position: relative;
}

#main_casino > .titlebox {
    display: flex;
    justify-content: space-between;
    margin:0 auto;
    text-align: left;
    padding-left:20px;
    padding-right:20px;
    margin-top:40px;
    min-width: 1400px;
    max-width: 2200px;
    height:50px;
}

#main_casino > .titlebox > h3 {
    margin:0;
    padding:0;
    border:0;
    display: block;
    font-size:18px;
    color:#ffffff;
}

@keyframes main_casino_titlebox_h3_img {
    0% {
        filter: grayscale(0.6) brightness(0.8);
        transform: scale(1);
    }
    50% {
        filter: grayscale(0) brightness(1);
        transform: scale(1.1);
    }
    100% {
        filter: grayscale(0.6) brightness(0.8);
        transform: scale(1);
    }
}


#main_casino > .titlebox > h3 > img {
    margin-left:5px;
    filter: brightness(0.5);
    animation: main_casino_titlebox_h3_img 0.8s infinite;
}


#main_casino > .titlebox > .btn_more {
    display: block;
    font-size:16px;
    line-height:30px;
    font-weight: 600;
    color:#ef7c00;
    height:30px;
    cursor: pointer;
}

#main_casino > .titlebox > .btn_more:hover {
    color:#ffffff;
    text-shadow: 
        0 0 5px #cfff5e,
        0 0 10px #ffb25e,
        0 0 20px #ef7c00;
    transition: all 300ms;
}

#main_casino > .titlebox > .btn_more > span {
    color:#ef7c00;
    font-size:16px;
    font-weight: 900;
    line-height:30px;
    height:30px;
}

#main_casino > .titlebox > .btn_more:hover > span{
    color:#ffffff;
    transition: all 300ms;
}

#main_casino > .slidebox {
    display: flex;
    margin:0 auto;
    min-width: 1400px;
    max-width: 2200px;
    padding-left:20px;
    overflow: hidden;
}


#main_casino > .slidebox > .slideitem {
    display: block;
    overflow: hidden;
    transition: all 1000ms;
    opacity: 0;
    position: relative;
    aspect-ratio: 400/170;
    width:0px;
    cursor: pointer;
    overflow: hidden;
}

#main_casino > .slidebox > .slideitem.show {
    display: block;
    max-width: auto;
    transition: all 1000ms;
    opacity: 1;
    width:100%;
    margin-right:15px;
    border:2px solid transparent;
}

#main_casino > .slidebox > .slideitem:hover {
    border:2px solid #ef7c00;
}

#main_casino > .slidebox > .slideitem > img.bg {
    position: absolute;
    left:0px;
    top:0px;
    bottom:0px;
    right:0px;
    display: block;
    width: 100%;
    filter:grayscale(0.6) brightness(0.6);
    transition: all 300ms;
}

#main_casino > .slidebox > .slideitem > img.label {
    position: absolute;
    display: block;
    left:30px;
    top:50%;
    width:40%;
    transform: translate(0, -60%);
    filter:grayscale(1) brightness(0.8);
    transition: all 300ms;
}

#main_casino > .slidebox > .slideitem:hover > img.bg {
    filter:grayscale(0) brightness(1);
    transition: all 300ms;
}

#main_casino > .slidebox > .slideitem:hover > img.label {
    filter:grayscale(0) brightness(1);
    transition: all 300ms;
}



/*---------------------------------------------------------
    MAIN SLOT
---------------------------------------------------------*/
#main_slot {
    display:block;
    min-width:1400px;
    margin:0px;
    margin-bottom:40px;
    position: relative;
}

#main_slot > .titlebox {
    display: flex;
    justify-content: space-between;
    margin:0 auto;
    text-align: left;
    padding-left:20px;
    padding-right:20px;
    margin-top:40px;
    min-width: 1400px;
    max-width: 2200px;
    height:50px;
}

#main_slot > .titlebox > h3 {
    margin:0;
    padding:0;
    border:0;
    display: block;
    font-size:18px;
    color:#ffffff;
}

@keyframes main_slot_titlebox_h3_img {
    0% {
        filter: grayscale(0.6) brightness(0.8);
        transform: scale(1);
    }
    50% {
        filter: grayscale(0) brightness(1);
        transform: scale(1.1);
    }
    100% {
        filter: grayscale(0.6) brightness(0.8);
        transform: scale(1);
    }
}


#main_slot > .titlebox > h3 > img {
    margin-left:5px;
    filter: brightness(0.5);
    animation: main_slot_titlebox_h3_img 0.8s infinite;
}


#main_slot > .titlebox > .btn_more {
    display: block;
    font-size:16px;
    line-height:30px;
    font-weight: 600;
    color:#ef7c00;
    height:30px;
    cursor: pointer;
}

#main_slot > .titlebox > .btn_more:hover {
    color:#ffffff;
    text-shadow: 
        0 0 5px #cfff5e,
        0 0 10px #ffb25e,
        0 0 20px #ef7c00;
    transition: all 300ms;
}

#main_slot > .titlebox > .btn_more > span {
    color:#ef7c00;
    font-size:16px;
    font-weight: 900;
    line-height:30px;
    height:30px;
}

#main_slot > .titlebox > .btn_more:hover > span{
    color:#ffffff;
    transition: all 300ms;
}

#main_slot > .slidebox {
    display: flex;
    margin:0 auto;
    min-width: 1400px;
    max-width: 2200px;
    padding-left:20px;
    overflow: hidden;
}


#main_slot > .slidebox > .slideitem {
    display: block;
    overflow: hidden;
    transition: all 1000ms;
    opacity: 0;
    position: relative;
    width:0px;
    height:168px;
    cursor: pointer;
    overflow: hidden;
}

#main_slot > .slidebox > .slideitem.show {
    display: block;
    max-width: auto;
    transition: all 1000ms;
    opacity: 1;
    width:100%;
    margin-right:15px;
    border:2px solid transparent;
}

#main_slot > .slidebox > .slideitem:hover {
    border:2px solid #ef7c00;
}

#main_slot > .slidebox > .slideitem > .title {
    height:90px;
    background: #11141d;
    display: block;
    position: relative;
}

#main_slot > .slidebox > .slideitem > .title > img.bg {
    position: absolute;
    display: block;
    right:0px;
    bottom:-1px;
    height:91px;
    filter:grayscale(0.6) brightness(0.4);
    transition: all 300ms;
}

#main_slot > .slidebox > .slideitem > .title > img.label {
    position: absolute;
    display: block;
    left:30px;
    top:50%;
    transform: translate(0,-50%);
    filter:grayscale(0.6) brightness(0.4);
}

#main_slot > .slidebox > .slideitem:hover > .title > img.bg {
    filter:grayscale(0) brightness(1);
    transition: all 300ms;
}

#main_slot > .slidebox > .slideitem:hover > .title > img.label {
    filter:grayscale(0) brightness(1);
    transition: all 300ms;
}


#main_slot > .slidebox > .slideitem > .info {
    height:78px;
    display: flex;
    position: relative;
    background: #0d1930;
    transition: all 300ms;
}


#main_slot > .slidebox > .slideitem:hover > .info {
    height:78px;
    display: flex;
    position: relative;
    background-color: #0d1930;
    stroke: #1d2f4b;
    background-image: url('../img/main_livesports/list_item_bg.svg');
    transition: all 300ms;
}


#main_slot > .slidebox > .slideitem > .info > .name {
    display: block;
    width:50%;
    line-height: 78px;
    color:#c8c8c8;
    font-size:16px;
    font-weight:400;
    padding-left:30px;
    margin-right:10px;
    white-space: nowrap;
    text-align: left;
    text-overflow: ellipsis;
    overflow: hidden;
    transition: all 300ms;
}

#main_slot > .slidebox > .slideitem:hover > .info > .name {
    text-shadow: 
        0 0 5px #517dce,
        0 0 10px #577ac2,
        0 0 20px rgb(194, 209, 235);
    color:#ffffff;
    transition: all 300ms;
}

#main_slot > .slidebox > .slideitem > .info > .credit {
    display: block;
    width:50%;
    line-height: 78px;
    color:#c8c8c8;
    font-size:16px;
    font-weight:400;
    padding-right:30px;
    margin-left:10px;
    white-space: nowrap;
    text-align: right;
    text-overflow: ellipsis;
    overflow: hidden;
    transition: all 300ms;
}


#main_slot > .slidebox > .slideitem:hover > .info > .credit {
    color:#ffffff;
    transition: all 300ms;
}

