
/******************************************************************************************
Grid 4 Styles
*/

.options .row {
    display: inline-block;
}

.options img {
    width: 100%;
}


/******************************************************************************************
Grid 6 Styles
*/



/******************************************************************************************
Anwsers Styles
*/

body.single-vote .modal-header {
    padding: 20px 50px 10px 20px !important;
    position: relative !important
}

.options .optionsWrapper {
    position: relative;
}




.options .col-md-4, .options .col-md-6 {
    padding: 10px;
    background-color: #f2f2f2;
    border: 1px solid #dfdfdf;
    margin: 10px;
    text-align: center;
}


.options .option:hover {
    background-color: #fafafa;
    border: 1px solid #999;
}

.options .option.disabled, .options .option.disabled:hover {
    opacity: .3 !important;
    background-color: #f2f2f2;
    border: 1px solid #dfdfdf;
}

.options .option.selected, .options .option.selected:hover {
    opacity: 1 !important;
    background-color: #fafafa;
    border: 1px solid #999;
}

.options .option.disabled:hover .imgWrapper img, .options .option.selected:hover .imgWrapper img {
    opacity: 1 !important;
}


.options .option:hover img {
   opacity: .5;
}

.options .col-md-4 img, .options .col-md-6 img {
    width: 100%;
    height: auto;
}

.options .optionTitle {

    font-size: 16px;
    color: #585858;
    text-align: center;
    line-height: 16px;
    margin-top:10px;
}

.options .option .circle {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #2d9def;
    position: absolute;
    bottom: 4px;
    right: 5px;
    cursor: pointer;
}

.options .option .fa-info {
    color: #fff;
    font-size: 25px;
    position: absolute;
    top: 3px;
    left: 11px;
}

.options .option .fa-info:hover {
   cursor: pointer;
}

.options .option .Vote.btn {
    margin-top: 15px;
}

.options .optionInfo {
    background: #fff;
    border: 4px solid #f6bb3a;
    width: 252px;
    position: absolute;
    bottom: 53px;
    left: 0px;
    text-align: left;
    display: none;
    z-index: 10000;
}

.options .optionInfo .optionInfo-title {
    background: none;
    border: none;
    color: #55595c;
    font-size: 14px;
    padding: 8px 14px 0px 14px;
    font-size: 14px;
    font-weight: normal;
    line-height: 18px;
    margin: 0px;
}

.options .optionInfo .optionInfo-content {
    background: none;
    border: none;
    color: #55595c;
    font-size: 12px;
    line-height: 14px;
    padding: 9px 14px;
}


.optionsModal .modal-header .close {
    margin-top: 2px;
    position: absolute;
    right: 13px;
    top: 10px;
}

.optionsModal .modal-header h3 {
  font-size: 16px;
}


/******************************************************************************************
Options Listed
*/

ul.listOptions  {
margin: 0px;
}

ul.listOptions li.listOption  {
 padding: 10px 10px 10px 85px;
 font-size: 16px;
 margin: 0px;
}

ul.listOptions li.listOption.disabled {
    opacity: .5;
}
ul.listOptions li.listOption.selected .Vote   {
    opacity: .3;
}

ul.listOptions li.listOption.selected  {
    opacity: 1;
    font-weight: bold;
}
ul.listOptions li .Vote  {
    margin-right: 20px;
    margin-left: -85px;
}

/******************************************************************************************
results
*/


.options .results {
    position: relative;
    display: block !important;
    width: calc(100% + 60px);
    margin-left: -30px;
}

.options .results h1 {
    margin-left: 15px !important;
}

.options .results .result ul {
    /* Just for this example */
    list-style: none;
    padding: 0;
    font-size: 14px;
    margin: 0px;
    padding: 0px 30px;
}

.options .results .result ul li {
    border-bottom: 2px dotted #fff;
    position: relative;
    float: left;
    line-height: 1.2em;
    width: 100%;
    text-align: left;
    list-style: none;
}

.resultsTitle span, .resultsCount
{
    background-color: #4998d3; /* For .restaurant_menu__row background rewriting */
}

.resultsTitle {
    padding-right: 3em; /* Custom number for space between text and right side of .restaurant_menu__row; must be greater than .restaurant_menu__price max-width to avoid overlapping */
    font-size: 16px;
}

.resultsTitle span {
    margin:0;
    position:relative;
    top: 1.6em;
    padding-right:5px; /* Custom number for space between text and dotted line */
    color: #fff;
}

.resultsCount {
    padding:1px 0 1px 5px;
    position:relative;
    top:.4em;
    left:1px;/* ie6 rounding error*/
    float:right;
    font-size: 25px;
    color: #f6b93a;

}


.options .result
{
    display:none;
}


.options .result {
    background: #fff;
    margin-top: 20px;
    padding-top: 20px;
}

.options .results p  {
    text-align: center;
}

.options .results p img {
    margin: 0px auto;
    width: auto;
    display: block;
}


.options .result h1 {
    font-size: 30px;
    margin-bottom: 0px;
}

.options .result .facebookWrap,  .options .result .twitterWrap {
    display: none;
}

.options .results-social {
    margin: 20px 0px 27px 0px;
}

.options .results-social .title {

    margin-right:5px;
    float: left;
    color:#fff;
    font-size: 29px;
    padding: 31px 22px 20px 22px !important;
}

.options .results-social .twitterWrap  {
    float: left;
    padding:7px 8px;
    margin-top: 10px;
}

.options .results-social .twitterWrap .fa-twitter {
    color:#fff;
    font-size: 50px;
}

.options .results-social .facebookWrap {
    margin-right:5px;
    float: left;
    padding: 7px 10px;
    margin-top: 10px;
}

.options .results-social .facebookWrap .fa-facebook-square {
    color:#fff;
    font-size: 50px;
}



/*@media (min-width: 621px) and (max-width: 940px) { *//*Begin Media Query */

    /*body.single-trivia input.btn[type="submit"] {*/
        /*margin-top: 10px;*/
    /*}*/

    /*.options .col-md-4, .options .col-md-6  {*/
        /*margin-left: 10px !important;*/
        /*margin-right: 10px !important;*/
    /*}*/

    /*.options .col-md-4.alpha, .options .col-md-6.alpha  {*/
        /*margin-left: 0px !important;*/
/*}*/

    /*.options .col-md-4.omega, .options .col-md-6.omega  {*/
        /*margin-right: 0px !important;*/
    /*}*/

/*}*/



@media screen and (max-width: 620px) {

    .optionsWrapper .row-eq-height {
        display: block;
    }

    .options .results-social .title {
        font-size: 18px;
        padding: 31px 6px 20px 22px !important;
        margin-right: 0px;
    }

    .options .results-social .facebookWrap .fa-facebook-square {
        color: #fff;
        font-size: 30px;
    }

    .options .results-social .twitterWrap .fa-twitter {
        color: #fff;
        font-size: 30px;
    }

    .options .results-social .facebookWrap {
        padding: 13px 7px;
    }

    .options .results-social .twitterWrap {
        padding: 13px 2px;
    }
}


/*@media screen and (max-width: 480px) {*/
    /*.options .results .result ul li .resultsCount {*/
        /*float: left;*/
        /*padding: 10px 0 1px;*/
    /*}*/
    /*.options .results .result ul li .resultsTitle span {*/
        /*top:0px;*/
    /*}*/

    /*.options .results .result ul li {*/
        /*border-bottom: 1px solid #efefef;*/
        /*float: left;*/
        /*padding: 25px 0;*/
    /*}*/
    /*.options .result h1 {*/
        /*font-size: 27px;*/
    /*}*/


    /*ul.listOptions li.listOption {*/
        /*border-bottom: 1px solid #efefef;*/
        /*font-size: 16px;*/
        /*margin: 0;*/
        /*padding: 20px 10px 20px 85px;*/
        /*text-align: left;*/
    /*}*/
/*}*/