/*============================================================================
  TweetYourVoteRating LAYOUT
  ============================================================================*/

#TweetYourVoteRatingLayout {
    background-image: url(../img/layouts/rating/rating-question-bg.png);
    background-repeat: no-repeat;
    background-position: 10px 10px;
    background-size: 295px 175px;
}

#TweetYourVoteRatingQuestionImageContainer {
    position: absolute;
    top: 21px;
    left: 207px;
    width: 100px;
    height: 100px;
}

#TweetYourVoteRatingQuestionImage{
    width: 87px;
}

#TweetYourVoteRatingQuestionLabel {
    position: absolute;
    top: 105px;
    left: 25px;
    width: 230px;
    height: 60px;
    padding-left: 20px;
    padding-right: 20px;
    color: #004779;
    font-weight: bold;
    text-align: left;
    vertical-align: middle;
}

.TweetYourVoteRatingAnswerBorderUp, .TweetYourVoteRatingAnswerBorderDisabled, .TweetYourVoteRatingAnswerBorderSelected {
    position:absolute;
    width:137px;
    height:68px;
    left:0;
    right:0;
    margin: 0 auto;
    margin-top:-5px;
    text-align:left;
}

.TweetYourVoteRatingAnswerBorderDisabled {
    border-color: #222222;
}

.TweetYourVoteRatingAnswerBorderSelected {
    border-color: #ffbd20;
}


.TweetYourVoteRatingAnswerContainerUp, .TweetYourVoteRatingAnswerContainerSelected {
    position: relative;
    width: 320px;
    height: 60px;
    background-size: 280px 51px;
    background-repeat: no-repeat;
    background-position: 20px 0px;
    z-index: 99;
}

#TweetYourVoteRatingAnswerContainer1 {
    padding-top: 190px;
    background-position: 20px 190px;
}

#TweetYourVoteRatingAnswerLabel1, #TweetYourVoteRatingAnswerLabel2, #TweetYourVoteRatingAnswerLabel3, #TweetYourVoteRatingAnswerLabel4, #TweetYourVoteRatingAnswerLabel5 {
    display: none;
}

.TweetYourVoteRatingAnswerContainerUp#TweetYourVoteRatingAnswerContainer1 {
    background-image: url(../img/layouts/rating/rating-answer1.png);
}

.TweetYourVoteRatingAnswerContainerSelected#TweetYourVoteRatingAnswerContainer1 {
    background-image: url(../img/layouts/rating/rating-answer1-selected.png);
}
.TweetYourVoteRatingAnswerContainerUp#TweetYourVoteRatingAnswerContainer2 {
    background-image: url(../img/layouts/rating/rating-answer2.png);
}

.TweetYourVoteRatingAnswerContainerSelected#TweetYourVoteRatingAnswerContainer2 {
    background-image: url(../img/layouts/rating/rating-answer2-selected.png);
}
.TweetYourVoteRatingAnswerContainerUp#TweetYourVoteRatingAnswerContainer3 {
    background-image: url(../img/layouts/rating/rating-answer3.png);
}

.TweetYourVoteRatingAnswerContainerSelected#TweetYourVoteRatingAnswerContainer3 {
    background-image: url(../img/layouts/rating/rating-answer3-selected.png);
}
.TweetYourVoteRatingAnswerContainerUp#TweetYourVoteRatingAnswerContainer4 {
    background-image: url(../img/layouts/rating/rating-answer4.png);
}

.TweetYourVoteRatingAnswerContainerSelected#TweetYourVoteRatingAnswerContainer4 {
    background-image: url(../img/layouts/rating/rating-answer4-selected.png);
}
.TweetYourVoteRatingAnswerContainerUp#TweetYourVoteRatingAnswerContainer5 {
    background-image: url(../img/layouts/rating/rating-answer5.png);
}

.TweetYourVoteRatingAnswerContainerSelected#TweetYourVoteRatingAnswerContainer5 {
    background-image: url(../img/layouts/rating/rating-answer5-selected.png);
}

.TweetYourVoteRatingAnswerLabelUp, .TweetYourVoteRatingAnswerLabelDisabled, .TweetYourVoteRatingAnswerLabelSelected {
    width: 180px;
    margin-top:42px;
    margin-left: 68px;
    margin-bottom:15px;
    color:#FFFFFF;
    font-weight: bold;
    text-align: left;
}

.TweetYourVoteRatingAnswerLabelDisabled {
    color:#999999;
}

.TweetYourVoteRatingAnswerLabelSelected {
    color:#ffbd20;
}


#TweetYourVoteRatingTotalResponsesContainer {
    display: none;
}

#TweetYourVoteRatingResponses {
    display: none;
}

/*============================================================================
  BETWEEN 360px AND 969px WIDE
  ============================================================================*/
@media (min-width: 360px) and (max-width: 970px) {
    #TweetYourVoteRatingLayout {
        background-position: 25px 10px;
    }
    #TweetYourVoteRatingQuestionImageContainer {

        margin-left: 15px;
    }
    #TweetYourVoteRatingAnswerContainer1 {
        padding-top: 190px;
        background-position: 35px 190px;
    }

    #TweetYourVoteRatingQuestionLabel {
        left: 40px;
    }

    .TweetYourVoteRatingAnswerContainerUp, .TweetYourVoteRatingAnswerContainerSelected {
        background-position: 35px 0px;
    }
}

/*============================================================================
  WIDER THAN 970px
  ============================================================================*/
@media (min-width: 970px) {
    #TweetYourVoteRatingLayout {
    }
    #TweetYourVoteRatingQuestionImageContainer {
        position: absolute;
        top: 129px;
        left: 630px;
        width: 152px;
        height: 152px;
        z-index: 200;
    }

    #TweetYourVoteRatingQuestionImage{
        width: 152px;
    }
    #TweetYourVoteRatingQuestionLabel {
        z-index: 100;
        top: 100px;
        left: 180px;
        background-image: url(../img/layouts/rating/rating-question-bg-970.png);
        background-size: 622px 221px;
        background-repeat: no-repeat;
        padding-left: 100px;
        padding-right: 190px;
        width: 332px;
        padding-top: 120px;
        height: 101px;
        font-size: 24px;
        text-align: left;
    }

    #TweetYourVoteRatingAnswerContainer1 {
        background-position: 0px 0px;
        width: 81px;
        height: 99px;
        background-size: 81px 79px;
        left: 274px;
    }

    #TweetYourVoteRatingAnswerContainer2 {
        left: 355px;
    }

    #TweetYourVoteRatingAnswerContainer3 {
        left: 441px;
    }

    #TweetYourVoteRatingAnswerContainer4 {
        left: 527px;
    }

    #TweetYourVoteRatingAnswerContainer5 {
        left: 613px;
    }

    .TweetYourVoteRatingAnswerContainerUp, .TweetYourVoteRatingAnswerContainerSelected {
        position: absolute;
        top: 322px;
        background-position: 0px 0px;
        width: 86px;
        height: 79px;
        background-size: 86px 79px;
    }

    .TweetYourVoteRatingAnswerContainerUp#TweetYourVoteRatingAnswerContainer1 {
        background-image: url(../img/layouts/rating/rating-answer1-970.png);

    }

    .TweetYourVoteRatingAnswerContainerSelected#TweetYourVoteRatingAnswerContainer1 {
        background-image: url(../img/layouts/rating/rating-answer1-selected-970.png);
    }
    .TweetYourVoteRatingAnswerContainerUp#TweetYourVoteRatingAnswerContainer2 {
        background-image: url(../img/layouts/rating/rating-answer2-970.png);
    }

    .TweetYourVoteRatingAnswerContainerSelected#TweetYourVoteRatingAnswerContainer2 {
        background-image: url(../img/layouts/rating/rating-answer2-selected-970.png);
    }
    .TweetYourVoteRatingAnswerContainerUp#TweetYourVoteRatingAnswerContainer3 {
        background-image: url(../img/layouts/rating/rating-answer3-970.png);
    }

    .TweetYourVoteRatingAnswerContainerSelected#TweetYourVoteRatingAnswerContainer3 {
        background-image: url(../img/layouts/rating/rating-answer3-selected-970.png);
    }
    .TweetYourVoteRatingAnswerContainerUp#TweetYourVoteRatingAnswerContainer4 {
        background-image: url(../img/layouts/rating/rating-answer4-970.png);
    }

    .TweetYourVoteRatingAnswerContainerSelected#TweetYourVoteRatingAnswerContainer4 {
        background-image: url(../img/layouts/rating/rating-answer4-selected-970.png);
    }
    .TweetYourVoteRatingAnswerContainerUp#TweetYourVoteRatingAnswerContainer5 {
        background-image: url(../img/layouts/rating/rating-answer5-970.png);
    }

    .TweetYourVoteRatingAnswerContainerSelected#TweetYourVoteRatingAnswerContainer5 {
        background-image: url(../img/layouts/rating/rating-answer5-selected-970.png);
    }

}