﻿/******************** Poll ********************/
.ramadanPoll { display: inline-block; float: left; width: 300px; background: #fff; position: relative; padding: 10px; border: 1px solid #e0e0e0; border-top: 4px solid #511c62; }
.ramadanPoll .ttl { background: none; border-right: none; padding-right: 0; margin-bottom: 12px ;border-bottom:none!important}
.ramadanPoll .ttl .more { display: none }
.wcDiv .ramadanPoll .ttl:after { display: none }
 .ramadanPoll .ttl h3{background:transparent!important;color:#000!important;padding:0!important}
.ramadanPoll .allItems { display: inline-block; width: 100%; float: right }
.ramadanPoll .allItems h3 { display: inline-block; width: 100%; float: right; padding: 8px 0; text-align: right; font-family: DroidKufiBold, Arial; font-size: 13px; color: #000; margin: 0 0 20px; }
.ramadanPoll .allItems input[type="radio"] + label { font-size: 13px; margin: 0 5px 10px}
.ramadanPoll .allItems .step { display: inline-block; float: right; width: 100% }
.ramadanPoll .allItems .pollBullets { display: inline-block; float: right; width: 100%; margin-bottom: 40px }
.ramadanPoll .allItems .btns { display: inline-block; float: left; }
.ramadanPoll .allItems .btns .vote { float: left; position: relative; display: inline-block; width: 90px; height: 40px; text-align: center;  font-size: 13px; color: #fff; line-height: 40px; background: #55281F!important; }
 .ramadanPoll .allItems .btns .vote:hover{background:#9F6332!important}

/** Second Step **/
.ramadanPoll .allItems .secondStep { display: inline-block; width: 100%; float: right }
.ramadanPoll .allItems .secondStep ul { padding-right: 0; float: right }
.ramadanPoll .allItems .secondStep li { display: inline-block; width: 100%; float: right; margin-bottom: 30px; }
.ramadanPoll .allItems .secondStep .itemDiv { display: inline-block; width: 100%; float: right }
.ramadanPoll .allItems .secondStep .itemDiv .item { display: inline-block; width: 100%; float: right; font-family: DroidKufiBold, Arial; font-size: 13px !important; white-space: unset !important; text-align: right; direction: rtl; color: #000; margin: 0 !important; margin-left: 0px !important }
.ramadanPoll .allItems .secondStep .itemDiv .votes { display: inline-block; width: auto; float: right;  white-space: unset !important; font-size: 12px !important; text-align: right; direction: rtl; color: #a7a7a7 !important; margin: 0 !important; line-height: 2.9; }
.ramadanPoll .allItems .secondStep .itemDiv .votes span { display: inline-block; width: auto; float: left;  font-size: 12px !important; text-align: right; direction: rtl; color: #a7a7a7 !important; margin: 0 !important; line-height: 2.9; }
.ramadanPoll .allItems .secondStep .itemDiv .percentage { display: inline-block; width: auto; float: left; font-size: 15px !important; font-weight: bold; margin: 0 !important; font-family: Arial; line-height: 34px; }
.ramadanPoll .allItems .secondStep .votesPercent { display: inline-block; float: right; width: 100%; position: relative; height: 6px; background: #ddd; overflow: hidden }
.ramadanPoll .allItems .secondStep .votesPercent .voteSlide { position: absolute; right: 0; top: 0; width: auto; height: 6px; background: #9F6332 }

.article .ramadanPoll{width:100%;margin:0 0 20px;border: 1px solid #eee;}
.article .ramadanPoll .allItems input[type="radio"] + label{background-color:#F5F5F5 ;border:0}
article .ramadanPoll.articlePoll .ttl{border-bottom:2px solid #9F6332!important}
article .ramadanPoll.articlePoll .allItems h3{font-size:17px;    margin-bottom: 21px;}
.article .surveyHint{display:inline-block;float:right;width:100%;background:#511c62;padding:16px 20px;margin-bottom:20px}
.article .surveyHint p{display: inline-block;float: right;width: 100%;font-size: 15px;color: #fff;text-align: right;pointer-events:none}
article .ramadanPoll.articlePoll .allItems input[type="radio"] + label{margin-bottom:10px}

@media screen and (max-width: 1023px) {
     .ramadanPoll { margin: 0 calc((100% - 300px) / 2) 20px }

}