body{
    background:#1C2128;
}
.logo{
    width: 100%;
    width: 100%;
    max-width: 130px;
    display: block;
    margin: 0 auto;
}

.sidebar-alerts{
    background: linear-gradient(rgba(16, 15, 19, 0.77),rgba(0, 0, 0, 0.83)),url('../images/sidebar.png');
    background-position:center;
    background-size:cover;
    padding:40px 20px;
    border-radius:20px;
    min-height:450px;
}

.fresh-data{
    color:#FFF;
    border-radius: 10px;
    animation: change 4s ease-in-out both;
}

#gameResults{
    background:#1C2128;
}

.table-title{
    font-weight: bold;
color: #ddd;
text-transform: uppercase;
}

.alerts-pre{
    font-family: 'Roboto', sans-serif;
    font-size:16px;
    color:#FFF;
    margin-bottom:10px;
}
.text-area{
    height:75px !important;
}

.alerts-title{
    font-family: 'Roboto', sans-serif;
    font-size:36px;
    font-weight:bold;
    color:#FFF;
    line-height:44px;
    margin-bottom:20px;
}
.hamburger .line{
    background:#00C853 !important;
    display: block;
}

.deznav{
    background:#181c22 !important;
}

[data-sidebar-style="overlay"] .deznav .metismenu > li:hover > a, [data-sidebar-style="overlay"] .deznav .metismenu > li.mm-active > a{
    box-shadow:0 12px 15px 0 rgb(83 235 177 / 10%) !important;
}
.alerts-sub{
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    color:#FFF;
    font-weight:400;
    margin-bottom:70px;
    width:50%;
}

.fav-icon{
    position: absolute;
    left: 40px;
    top: 50%;
    transform: translateY(-50%);
}
.alerts-btn{
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    background:#00C853;
    color:#FFF;
    padding:10px 20px;
    border-radius:10px;
    font-weight:normal;
    border:none;
}

.live-row{
    min-height:100px;
}

.active-background{
    background:#00c853 !important;
    color:#FFF;
}

.wrong-direction{
    background:#4C5462 !important;
    color:#FFF;
    transition:all 0.5s ease-out;
}

.trend-background{
    background:#0088c8 !important;
    color:#FFF;
}

.live-stat-title-row{
    padding:0px 10px;
}

.live-stat-title{
    font-size:15px;
    font-family: 'Roboto', sans-serif;
    color:#DCDFE3;
    text-align: center;
    margin:auto
}

.stat-row:hover{
    cursor: pointer;
}

.even-row{
    font-family: 'Roboto', sans-serif;
    background:#2C343A;
    color:#FFF;
    border-radius:10px;
    padding:20px 10px;
    margin-top:10px;
    transition:all 0.5s ease-in;
    position:relative;
}

.odd-row{
    font-family: 'Roboto', sans-serif;
    background:#22272F;
    color:#FFF;
    border-radius:10px;
    padding:20px 10px;
    margin-top:10px;
    transition:all 0.5s ease-in;
    position:relative;
}

.live-row-stat{
    font-family: 'Roboto', sans-serif;
    font-weight:400;
    font-size:20px;
    text-align:center;
    margin: auto;
}

.text-white p{
    color:#FFF !important;
}

.bold{
    font-weight:bold;
}

.live-game{
    color:#00C853;
    font-weight:bold;
}

.widget-instagram{
    background:linear-gradient(#e66465, #9198e5);
}

.datepicker-default{
    background:#00C853 !important;
    color:#FFF !important;
}

.live-indicator{
    padding-top:1px;
    color: #ff3434;
}

.team-icon{
    width: 50px;
    max-height: 40px;
}

.text-main-green{
    color:#00C853!important;
}
.time-stat{
    color:#DDD;
    font-size:18px;
}

.hide{
    display:none !important;
}

.year-picker{
    background:#00C853 !important;
    color:#FFF !important;
}

.chart-logo{
    max-width:35px;
    position:absolute;
    top: 130px;
    left: 10px;
}

#away-chart-logo{
    top:300px;
}

.bold{
    font-weight:bold !important;
}
.global-stat{
    
    text-align:center;
    color:#FFF;
}

.global-stat-wrapper{
    padding:10px;
}

.global-title{
    color:#FFF;
    font-weight:bold;
}
.global-inner{
    background:#2C343A;
    border-radius:10px;
    padding:20px;
}

.btn-custom{
    background:#00C853 !important;
    border-color:#00C853 !important;
}

.main-color{
    color:#00C853 !important;
}

.home-legend{
    background:#22272F;
    border-radius:10px;
    color:#FFF;
    padding:20px;
    margin-top:40px;
}

.away-legend{
background:#2C343A;
border-radius:10px;
color:#FFF;
padding:20px;
margin-top:20px;
}

.non-recommended{
    background:#333 !important;
    border-color:#333 !important;
}

.non-recommended-btn{
    background:#777 !important;
    border-color:#777 !important;
}

@-webkit-keyframes ticker {
    0% {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      visibility: visible;
    }
    100% {
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
  }
  @keyframes ticker {
    0% {
      -webkit-transform: translate3d(0, 0, 0);
      transform: translate3d(0, 0, 0);
      visibility: visible;
    }
    100% {
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
    }
  }
  .ticker-wrap {
    position: fixed;
    top: 0;
    width: 100%;
    overflow: hidden;
    height: 3rem;
    background-color: rgb(24 28 34);
    padding-left: 100%;
    box-sizing: content-box;
  }
  .ticker-wrap .ticker {
    display: inline-block;
    height: 3rem;
    line-height: 3rem;
    white-space: nowrap;
    padding-right: 100%;
    box-sizing: content-box;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-name: ticker;
    animation-name: ticker;
    -webkit-animation-duration: 30s;
    animation-duration: 30s;
  }
  .ticker-wrap .ticker__item {
    display: inline-block;
    padding: 0 2rem;
    font-size: 20px;
    color: white;
    text-transform:uppercase;
  }

  .ticker-logo{
    width: 30px;
    padding-bottom: 10px;
  }

  .header .navbar{
      padding:0px !important;
  }

.text-upper{
    text-transform:uppercase;
}
#gameResults .card-body{
    min-height:220px;
}

#gameResults .img-fluid{
    height:100px;
}

.hide-on-desktop{
    display:none !important;
}

[data-theme-version="dark"] .list-group-item{
    border-color:#272c32;
}

[data-theme-version="dark"] .border-right{
    border-color:#272c32 !important;
}
/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {

    .hide-on-mobile{
        display:none !important;
    }

    .mob-logo{
        max-width:50px;
        width:100%;
    }

    .hide-on-desktop{
        display:block !important;
    }

    .update-time{
        font-size:12px;
    }

    .live-stat-title-row{
        padding:0px !important;
    }

    .pad-l-mob{
        padding-left:20px !important;
    }

    
}


@media all and (max-width: 591px) {
    
    #message-banner{
        display:none !important;
    }

    #sample-trend-title{
        display:none !important
    }

    #sample-trend-chart{
        display:none !important;
    }

    .odd-time{
        margin-top:10px !important;
    }

    #home-logo-wrap{
        display:none;
    }
    #away-logo-wrap{
        display:none;
    }

    #last-update-title{
        display:none;
    }

    #status-title{
        display:none;
    }

    #home-status-wrap{
        display:none;
    }

    #away-status-wrap{
        display:none;
    }

    #moneyline-title{
        display:none;
    }

    #home-moneyline{
        display:none;
    }

    .moneyline{
        display:none;
    }

    #away-moneyline{
        display:none;
    }

    #spread-title-open{
        display:none;
    }

    #sms-signal-group{
        display:none;
    }
}

.live-refresh-progress{
    height:5px;
    background:#00C853;
    animation: progress-bar 10s linear infinite;
}



@keyframes change {
    from { background: #FDB927 }
    to   { background: transparent }
}

@-webkit-keyframes progress-bar {
    0% {
        width:0%;
    }
    10% {
        width:10%;
      }
      20% {
        width:20%;
      }
      30% {
        width:30%;
      }
      40% {
        width:40%;
      }
    50% {
        width:50%;
    }
    60% {
        width:60%;
      }
      70% {
        width:70%;
      }
      80% {
        width:80%;
      }
      90% {
        width:90%;
      }
    100% {
        width:100%;    
    }
  }