#modalOverlay {
	background-color: rgba(0,0,0,.65);
	width:100%; height: 100%;
	margin:0; padding:0;text-align: center;
	z-index:9001; /* places the modal overlay between the main page and the modal dialog*/
	opacity:1; position:absolute; top:0; left:0; display:none;
}

#modal, #modalVote {
    background: #fff; width:80%; height: 80%; 
	margin: 0 auto; padding: 1.5em; text-align: center;
	border: solid 1px #e4e3e1; border-radius: 12px;
	z-index:9003; /* places the modal dialog on top of everything else */
	position:fixed; top:5%; left:10%; display:none; 
}

#modal h1:before, #modalVote h1:before{content: '\E240'; font-family: 'pepIcons'; color: #f36836; margin-right: .5em; display: block; float: left;}

.RadSlider.RadSliderHOY .rslMiddle .rslTrack,
.RadSlider.RadSliderHOY .rslMiddle .rslHandle {top: 75%;}

.RadSlider.RadSliderHOY .rslHorizontal .rslItemsWrapper .rslItem {cursor: pointer;}

.screen-reader-offscreen {
	position:absolute;
	left:-999px;
	width:1px;
	height:1px;
	top:auto;
}

@media (min-width: 1024px) {

    #modal, #modalVote {width: 60%; padding: 3em; left: 20%;}

}

@media (max-width: 440px) {

    #modal, #modalVote {width: 96%; padding: .5em; left: 2%;}
        #modal ul.formList, #modalVote ul.formList {padding-left: 0; padding-right: 0;}
        
        .RadSlider.RadSliderHOY .rslHorizontal .rslItem span {font-size: .8em; letter-spacing: -1px;}

}