@media screen and (min-width:1241px) and (max-width:1500px)
{

}

@media screen and (min-width:1025px) and (max-width:1240px)
{
	.voting-section{
		max-width: 500px;
	}	
	.candidate label{
		font-size: 17px;
	}
	.time-unit{
		font-size: 20px
	}
}

@media screen and (min-width:992px) and (max-width:1024px)
{
	.voting-section{
		max-width: 500px;
	}	
	.candidate label{
		font-size: 17px;
	}
	.time-unit{
		font-size: 20px
	}
}

@media screen and (min-width:768px) and (max-width:991px)
{
	.voting-section{
		max-width: 500px;
	}	
	.candidate label{
		font-size: 17px;
	}
	.time-unit{
		font-size: 20px
	}	
}

@media (max-width: 767px)
{	
	.voting-section{
		max-width: 500px;
		padding: 0 10px
	}	
	.candidate label{
		font-size: 17px;
	}
	.time-unit{
		font-size: 16px
	}
	.countdown{
		flex-wrap: nowrap;
	}
	#candidateOverlay{
		padding: 20px 12px
	}
	.popup-btn{
		flex-wrap: wrap;
	}
	.modal-body{
		padding: 30px 20px 10px
	}
	.checkbox label{
		text-align: left;
	}
	#timer{
		padding: 0 14px
	}
	.checkbox{
		margin-bottom: 0
	}
	.modal-footer{
		flex-wrap: wrap;
		gap:10px;
		margin-bottom: 10px!important
	}
	button.btn.btn-secondary.back,
	button.btn.btn-primary.confirm{
		width: 100%;
		margin:0;
		padding: 12px 5px;
		font-size: 16px
	}
	.candidate{
		border-radius: 15px
	}
}

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

@media screen and (max-width:480px)
{
	.candidate label{
		font-size: 16px;
		padding: 0 5px
	}
	.candidates{
		gap:15px;
	}
	.candidate{
		width: 25%
	}
	.voting-section .btn{
		margin-top: 10px
	}
}