.lottery {

	background: #FFF;
	min-height: calc(~"100vh - 92px");

	.submenu {

		padding: 5px 0;

		li {
			width: 32vw;
		}
	}

	.container.inner-page{

		ul,li {list-style:none;}

		.picHolder {
		    color: #fff;
		    background: url('@{cdnUrl}images/lottery/lotteryBg.jpg') top center;
		    background-size: 130%;
		    padding: 5%;

			h1 {color:#fff;}

			p {
			    padding: 0px;
			    margin: 0px;
			    font-size: 14px;
			    line-height: 19px;
			}
		}


		h1 {
		    color: #444444;
		    position: relative;
		    margin:0px;
		    margin-bottom:10px;
		}



		.lotteries{

			.item {
			    display: -webkit-box;
			    padding: 10px 0;
			    background: #f3f3f3;
			    background: -moz-linear-gradient(top, #f3f3f3 0%, #c3c3c3 100%);
			    background: -webkit-linear-gradient(top, #f3f3f3 0%, #c3c3c3 100%);
			    background: linear-gradient(to bottom, #f3f3f3 0%, #c3c3c3 100%);
			    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3f3f3', endColorstr='#c3c3c3', GradientType=0);
			    margin-bottom: 1px;
			    position: relative;
			    text-align: center;
			    font-size: 13px;
			    font-weight: 600;
			    height: 29px;
			    font-family:'Roboto Condensed', sans-serif;

			    h2 {
					line-height: 27px;
					text-overflow: ellipsis;
					white-space: nowrap;
					overflow: hidden;
				}


				.arrow {
				    background: #FFC000;
				    height: 49px;
				    display: block;
				    position: absolute;
				    right: 0px;
				    width: 100%;
				    top: -10px;
					/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#febe00+0,e68000+100 */
					background: rgb(254,190,0); /* Old browsers */
					background: -moz-linear-gradient(top,  rgba(254,190,0,1) 0%, rgba(230,128,0,1) 100%); /* FF3.6-15 */
					background: -webkit-linear-gradient(top,  rgba(254,190,0,1) 0%,rgba(230,128,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
					background: linear-gradient(to bottom,  rgba(254,190,0,1) 0%,rgba(230,128,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
					filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#febe00', endColorstr='#e68000',GradientType=0 ); /* IE6-9 */


					&:before {
					    content: '';
					    background: url('@{cdnUrl}images/icons.png') -3px -333px #ffffff;
					    height: 40px;
					    width: 40px;
					    position: absolute;
					    -webkit-border-radius: 50px;
					    -moz-border-radius: 50px;
					    border-radius: 50px;
					    top: 28px;
					    right: 10%;
					    border: 1px solid #ccc;
					    zoom: 0.5;
					}
				}


				b{color:#444444;}

				span {
				    display: block;
				    color: #777777;
				    font-weight: 100;
				    font-size: 11px;
				    text-transform: uppercase;
				    margin-bottom: 2px;
				}

				.col-sm-1.ball:before {
				    background: url('@{cdnUrl}images/lottery/lotteryBall.png') no-repeat top center;
				    content: '';
				    position: absolute;
				    width: 50px;
				    height: 30px;
				    top: 4px;
				    left: -4px;
				    zoom: 0.8;
				}


		    }

		}



		.leaderboard {
		    background: #ffffff;
		    background: -moz-linear-gradient(left, #ffffff 0%, #eeeeee 100%);
		    background: -webkit-linear-gradient(left, #ffffff 0%, #eeeeee 100%);
		    background: linear-gradient(to right, #ffffff 0%, #eeeeee 100%);
		    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=1);
		    -webkit-box-shadow: 2px 16px 25px -7px rgba(189,189,189,1);
		    -moz-box-shadow: 2px 16px 25px -7px rgba(189,189,189,1);
		    box-shadow: 2px 16px 25px -7px rgba(189,189,189,1);

		    .picHolder {background: url('@{cdnUrl}images/lottery/leaderBg.jpg') top center; color:#000;}

		    p a {
			    display: block;
			    color: #ff0042;
			    font-size: 12px;
			    margin-top: 7px;
			}

		    .list {

				li {
				    margin-bottom: 1px;
				    padding: 15px;
				    font-size: 18px;
				    position:relative;
				    padding-left:50px;

				    div {font-family:'Roboto Condensed', sans-serif;}
				}

				.name {
				    width: 46%;
				    margin-left: 0px;
				    font-weight: 400;
				    text-shadow: 0px 1px 0px #000000;
				    font-size: 16px;
				    color:#fff;
				}

		    	li.blue {
		    	    background: #00193e;
				    background: -moz-linear-gradient(left, #00193e 0%, #116aa8 51%, #00193e 100%);
				    background: -webkit-linear-gradient(left, #00193e 0%, #116aa8 51%, #00193e 100%);
				    background: linear-gradient(to right, #00193e 0%, #116aa8 51%, #00193e 100%);
				    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00193e', endColorstr='#00193e', GradientType=1);
				    color:#fff;

					.pic {
					    position: absolute;
					    top:4px;
					    right: 0;
					}
		    	}

		    	li.grey{
					/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,b7b7b7+47,939393+98 */
					background: rgb(0,0,0); /* Old browsers */
					background: -moz-linear-gradient(left,  rgba(0,0,0,1) 0%, rgba(183,183,183,1) 47%, rgba(147,147,147,1) 98%); /* FF3.6-15 */
					background: -webkit-linear-gradient(left,  rgba(0,0,0,1) 0%,rgba(183,183,183,1) 47%,rgba(147,147,147,1) 98%); /* Chrome10-25,Safari5.1-6 */
					background: linear-gradient(to right,  rgba(0,0,0,1) 0%,rgba(183,183,183,1) 47%,rgba(147,147,147,1) 98%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
					filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#939393',GradientType=1 ); /* IE6-9 */
		    	}

		    	li.grey.first{margin-top:10px;}

		    	li.gold {
					/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e67e00+0,ffc000+47,945700+100 */
					background: rgb(230,126,0); /* Old browsers */
					background: -moz-linear-gradient(left,  rgba(230,126,0,1) 0%, rgba(255,192,0,1) 47%, rgba(148,87,0,1) 100%); /* FF3.6-15 */
					background: -webkit-linear-gradient(left,  rgba(230,126,0,1) 0%,rgba(255,192,0,1) 47%,rgba(148,87,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
					background: linear-gradient(to right,  rgba(230,126,0,1) 0%,rgba(255,192,0,1) 47%,rgba(148,87,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
					filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e67e00', endColorstr='#945700',GradientType=1 ); /* IE6-9 */

					.name {
					    text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.76);
					    font-weight: 600;
					    color:#000;
					}

					.pic {
					    position: absolute;
					    top: 8px;
					    right: 0;
					    zoom: 0.8;
					}

		    	}

		    	div {display: inline-block;  font-family: BebasNeue Regular;}

				.number {
				    background: #ccc;
				    -webkit-border-radius: 50px;
				    -moz-border-radius: 50px;
				    border-radius: 50px;
				    padding: 10px;
				    height: 10px;
				    width: 10px;
				    text-align: center;
				    font-size: 20px;
				    line-height: 12px;
				    background: #f3f3f3;
				    background: -moz-linear-gradient(top, #f3f3f3 0%, #c3c3c3 100%);
				    background: -webkit-linear-gradient(top, #f3f3f3 0%, #c3c3c3 100%);
				    background: linear-gradient(to bottom, #f3f3f3 0%, #c3c3c3 100%);
				    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3f3f3', endColorstr='#c3c3c3', GradientType=0);
				    border: 1px solid #ccc;
				    color: #000;
				    position: absolute;
				    top: 9px;
				    left: 6px;
				}

				.points {
				    -webkit-border-radius: 50px;
				    -moz-border-radius: 50px;
				    border-radius: 50px;
				    background: #000000;
				    padding: 0px 10px 0px 10px;
				    color: #fff;
				    font-size: 14px;
				}
		    }
		}
	}
}