﻿.beginUpdatingLiveScore, .chosen.beginUpdatingLiveScore { /* color of score banner cells when the scores are updated*/
    background-color: red !important;
    transition: all .5s linear;
}

.endUpdatingLiveScore {
    background-color: white !important;
    transition: all .5s linear;
}

.carouselSkeletonItem {
    border: 1px solid gray;
    flex-grow: 1;
}

#Carousel {
    width: 100%;
    display:flex !important;
}
#Carousel .carousel-inner{
    height:75px !important;
}

.carousel-item.active, .carousel-item-next, .carousel-item-prev{
    display:flex !important;
    opacity:1!important; /*override bootstrap default opacity*/

}
a.carousel-control-next, a.carousel-control-prev {
    background-color:gray !important;
}
.carouselBlock {
    flex-grow: 1;
    display: inline-block;
    border: solid 1px #aaa;
    background-color: white;
    padding: 4px;
}
.carouselBlock > :first-child{
    display:block;
    text-align:center;
}
.carouselBlockRow {
    background-color:inherit !important;
    display: flex;
    white-space:nowrap;
}
.carouselBlockRow:not(td  div) {
    justify-content: space-between;
}
td > .carouselBlockRow >*{
    margin-left:5px;
}

.carouselBlockRow div {
    position:relative;
    top:7.5px;
}

.carouselBlockRow img {
    position:relative;
    bottom:5px;
}
.winner {
    color: red;
    font-weight: bold;
}
.carousel-control-next, .carousel-control-prev{
    width: 50px;
    position: relative !important;
}

.teamLogo {
    align-content: center;
    height:24px;
    width:24px;
}

[organizationTypeId=1] .teamLogo { /* NFL*/

    image-rendering: optimizeQuality; /* Non-chrome*/
    image-rendering: -webkit-optimize-contrast; /* Chrome*/
}

#Carousel .timeLeft{
    color:red;
}

#carouselWeek {
    writing-mode: vertical-lr;
    align-content: safe center;
    transform: rotate(180deg);
    padding: 4px;
    width: 23px;
    background-color:#59aeef;
}

.carousel-item {
    background-color: #F0F0F0 !important/*same as body background color*/
}
@media (max-width: 576px) {
    .carousel-control-next, .carousel-control-prev {
        width: 30px !important;

    }
}

@media (min-width: 576px) {
    #Carousel {
        font-size: 12px;
        font-weight: bold;
    }
}

@media (min-width: 0px) {
    #Carousel, #mySurvivalPick {
        font-size: 10px;
        font-weight: bold;
    }
}
.fadeout {
    opacity: 0;
    transition: opacity .5s ease-in;
}

.fadein {
    opacity: 1;
    transition:opacity .5s ease-in;
}

#Carousel .teamName{
    position:relative;
    top:-4px;
}
#Carousel .score, #Carousel .teamRecord{
    position:relative;
    top:6px;
}
.picksPageTable .carouselBlockRow > * {
    margin-left:5px;
}
 .picksPageTable .teamRecord, .picksPageTable .teamName{
    position:relative;
    top:-2px;
}
.carouselBlockRow.header {
    text-decoration: none !important;
}