@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700');
@import url('https://fonts.googleapis.com/css?family=Ubuntu:400,500');

body{
	font-family: 'Roboto', sans-serif;
	font-size:15px;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6{
	line-height: 1.3;
}
hr{
	border-bottom:1px solid #eee;
}
a{
	color:inherit;
}
a:hover,a:focus{
	color:inherit;
	text-decoration: none;
}
.no-space{
	margin:0;
	padding:0;
}
.no-margin{
	margin:0;
}
.text-white{
	color:#fff;	
}
.navbar-nav{
	margin:27px 10px 0;
	font-weight: bold;
}
.navbar-brand{
	height:inherit;
	padding:10px 0;
}
.navbar-default{
	background:#fff;
}
.navbar{
	margin:0;
}
.navbar-right > li > a{
	padding:8px 20px;
}
.nav > li > a:hover, .nav > li > a:focus{
	background-color: inherit;
}
.navbar-right{
	margin-top:28px;
}
.temp2{
	margin-top:15px;	
	margin-bottom:15px;	
}
.temp2 .side_right{
	border-left:1px solid #eee;
}
.odd-row {
    background: #ffecea;
}
.carousel-inner img {
    width: 100%;
}
.mainNav {
			
			
		}
			/* First Level */
			.mainNav ul {
				margin: 0;
				padding: 0;
				list-style: none;
				border-bottom: 1px solid #eee;
			}
			.mainNav ul li {
				border-top: 1px solid #eee;
			}
			.mainNav ul li a {
				color: #c21101;
				display: block;
				font-size: 22px;
				line-height: normal;
				padding:12px 20px;
				font-weight: 300;
				text-decoration:none;
				cursor:pointer;
			}
			.mainNav ul li a:hover {
				background: #f1f1f1;
				text-decoration: none;
			}
			.tile_menu_btns.active.accordion-header-only {
				background: #f1f1f1;
				border-left: 3px solid #c21101;
			}
				/* Second Level */
				.mainNav ul ul {
					border-bottom: none
				}
				.mainNav ul ul li {
					border-top: 1px solid #eee;
					
				}
				.mainNav ul ul li a {
					color: #c21101;
					display: block;
					font-size: 1em;
					line-height: normal;
					padding: 0.5em 1em 0.5em 2.5em;
				}
				.mainNav ul ul li a:hover {
					
				}
						/* Third Level */
				.mainNav ul ul ul {
					border-top:1px solid #eee;
				}
				.mainNav ul ul ul li {
					border:none;
				}
				.mainNav ul ul ul li a {
					padding-left:3.5em; 
					padding-top:0.25em; 
					padding-bottom:0.25em;
				}
			/* Accordion Button */
			ul li.has-subnav .accordion-btn {
				color: #c21101;
				
				font-size: 14px;
			}
		
	
.tile_menu_btns.grad {
    text-align: right;
    padding: 15px;
    font-size: 28px;
    font-weight: 300;
    color: #c21101;
    border-bottom: 1px solid #eee;
	cursor:pointer;
}
.tile_menu_btns.grad.active {
    background: #f1f1f1;
    border-left: 3px solid #c21101;
}
.main-title{
	color:#c21101;
	font-weight:300;	
}
.next-arrow, .previous-arrow {
    margin-top: 70%;
}
/*winning history table*/
/*table color*/
.title-bg{
	padding:6px 0;
	background:#27235e;	
	color:#fff;
	text-transform: uppercase;
}
.odd{
	padding:10px 0;	
	background:#e5e5e5;
}
.even{
	padding:10px 0;
	background:#f1f1f1;	
}

.announcement{
	color:#fc0000;	
	margin:15px 0;
}

.shadow{
	background:url('../images/shadow.png')no-repeat bottom;	
	margin-bottom:15px;
	padding-bottom:50px;
}

.effect2{
	margin-bottom:30px;
	-webkit-box-shadow: 0 8px 6px -6px #ccc;
		 -moz-box-shadow: 0 8px 6px -6px #ccc;
			  box-shadow: 0 8px 6px -6px #ccc;
}
.meaning{
	color:#fc0000;	
	text-transform:uppercase;
}
.paper {
    margin-top: 17px;
}
.paper h4{
	color:#c21101;
	font-weight:300;	
	font-size:28px;
}
/*hide edge menu scrollbar*/
html {
  -ms-overflow-style: -ms-autohiding-scrollbar;
}
.sidenav::-webkit-scrollbar {
    width: 0.8em;
	
}
 
.sidenav::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius:10px;
	
}
 
.sidenav::-webkit-scrollbar-thumb {
  background-color: #ccc;
  outline: 1px solid #ccc;
}
.menu{
	margin-top:35px;
	display:block;
}
.menu-text{
	font-size: 15px;
    font-weight: bold;
    letter-spacing: 1px;
    color: #7c7c7c;
}
.menu-title{
	font-size: 25px;
    font-weight: 300;
    color: #fff;
    padding: 8px 8px 15px 32px;
    margin: 0 0 15px;
    border-bottom: 1px solid #444;
}
.hamburger-img{
	width:22px;
	float:left;
	margin:5px;
}
.jackpot-bar{
	background: #c21101;
    color: #ffffff;
	padding:5px 0;
}
.current-lang{
	font-weight:bold;color:#c21101;
}
.contact-form .form-control {
    padding: 11px 15px;
    height: auto;
    background: #f1f1f1;
    color: #808080;
    border: 1px solid #e2e2e2;
    border-radius: 25px;
}
.content-btn {
    color: #fff;
    background: #152364;
    padding: 10px 25px;
    border-radius: 25px;
    font-weight: bold;
}
.contact-info td {
    padding: 0 10px 10px 0;
}
.past-six-section{
	
}
.past-divider{
	background:#eee;
	height:30px;
}
.btn-login{
	border: 2px solid #1c377c;
    color: #1c377c !important;
    font-weight: bold;
    padding: 7px 15px;
    border-radius: 25px;
    display: inline-block;
    margin-top: 25px;
    transition: all ease-in-out .5s;
}
.btn-login:hover{
	border:2px solid #1c377c;
	background:#1c377c !important;
	color:#fff !important;
	font-weight: bold;
	border-radius:25px;
}
.lang{
	margin-top:35px;
	display:inline-block;
	text-align:right;
}
.lang.active{
	font-weight: bold;
    color: #c21101;
}
.lang-position{
	text-align:right;	
}
.rollpanel{
	display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
	  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
	  display: -ms-flexbox;      /* TWEENER - IE 10 */
	  display: -webkit-flex;     /* NEW - Chrome */
	  display: flex;
	  justify-content:center;
	-webkit-justify-content: center;
-webkit-flex-flow: row wrap;
}
.jp-drawcol{
	width:15%;
	float:left;
	padding:9px 15px;	
	text-align:left;
	border-right:1px solid #a20e01;
}
.jp-draw{
	display:block;	
	font-size:13px;
}
.jp-drawdate{
	display:inline-block;	
	font-size:11px;
}
.jp-info {
	width: 13.5%;
	float: left;
	padding: 5px 15px;
	text-align:center;
}
.jp-info.old-jackpot {
    width: 16%;
    float: left;
    padding: 5px 15px;
    text-align: center;
	margin:0;
}
.next-draw{
	text-align:right;
	margin:0 10px;	
}
.livedraw{
	width:35%;
	float:left;
	background:#1c377c;
	padding:30px 0;
	min-height: 440px
}
.livedraw-6d{
	width:35%;
	float:left;
	background:#bc2129;
	padding:80px 0;
	min-height: 440px
}
.livedraw-border{
	border:1px solid #ccc;	
	margin-bottom:10px;
}
.rolling-number.greyout{
	background:#777;
	/*background:#ccc;*/
}
.livedraw-tab {
	padding:10px 0;
}
.livedraw-tab > li{
	width:32%;
	margin:0 2px;
}
.livedraw-tab > li > a{
	text-align:center;
	border-radius:25px;
	margin:0;
	border:0;
	font-size:12px;
	background: #ccc; 
	color: #333;
}
.livedraw-tab > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus{
	border:none;    
	background: #bc2129; 
	color: #fff;
}
.jp-title{
	display:block;
	font-size:14px;	
}
.jp-currency{
	display:inline-block;	
	font-size:11px;
}
.jp-price{
	display:inline-block;	
	font-size:18px;
	font-weight:600;
}
.winning-title{
	color:#c21101;
	font-weight:300;
}
.winning-horse-label{
	color:#fff;	
	background:#bc2129;
	border-radius:25px;
	padding:5px 15px;
	display:block;
}
.winning-horse{
	display:block;	
	color:#fff;
	font-size:20px;
	font-weight:bold;
	margin:8px 0;
	min-height:28px;
}
.winning-horse-display{
	background:#fff;
	border-radius:25px;
	padding:5px 10px;
	display:block;
	text-align:center;
	font-weight:bold;
	font-size:25px;
    height: 50px;
    overflow: hidden;
    position: relative;
}
.rolling-number{
	float:left;
	width:70px;
	height:70px;
	line-height:70px;
	background:#fff;
	font-size:25px;
	border-radius:50%;
	font-weight:bold;
	margin:30px -8px;
	text-align:center;
	position:relative;
	overflow:hidden;
}
.winning-border{
	border-top:1px solid #eee;
	margin:0 0 10px;
}
.padding-5{
	padding:0 5px;
}
.prize-column{
	font-family: 'Ubuntu', sans-serif;
	width:32%;
	float:left;
	padding:0 5px;
	margin-top:15px;
}
.jackpot-column{
	font-family: 'Ubuntu', sans-serif;
	width:20%;
	float:left;
	padding:0 5px;
}
.livedraw-game {
    /*color: #bc2129;*/
    font-size: 18px;
    font-weight: bold;
    margin-top: 0;
}
.prize-column.old-game{
	width:60%;
}
.jackpot-column.old-game{
	width:40%;
}
.logo1{
	width:80px;
	display: block;
	margin:15px auto 20px;
}
.logo2{
	width:200px;
	display: block;
	margin:15px auto 20px;
}
.logo3{
	width:50px;
	display: block;
	margin:auto;
}
.jplogo1{
	width:60px;
	display: block;
	margin:auto;
}
.jplogo2{
	width:60px;
	display: block;
	margin:32px auto 0;
}
.jplogo3{
	width:45px;
	display: block;
	margin:32px auto 0;
}
.bonuslogo1{
	width: 68px;
    display: block;
    margin: 0 auto 32px;
}
.push-right-30 {
    right: 30%;
    position: relative;
}
.pull-left-20 {
    left: 20%;
    position: relative;
}
.prize-label{
	background:#1c377c;
	border-radius:25px;
	color:#fff;
	width: 100%;
	display: block;
	text-align:center;
	padding:5px;
	font-weight:bold;
}
.bonus-label{
	background:#bc2129;
	border-radius:25px;
	color:#fff;
	width: 100%;
	display: block;
	text-align:center;
	padding:5px;
	font-weight:bold;
}
.prize-number{
	display: block;
	width: 100%;
	text-align:center;
	padding:5px;
	font-weight:bold;
	font-size:18px;
	min-height: 35px;
}
.jackpot-title{
	display: block;
	width: 100%;
	color:#bc2129;
	text-align:center;
	padding:5px;
	font-weight:bold;
	font-size:18px;
}
.jackpot-prize{
	background:#1c377c;
	border-radius:25px 0 0 25px;
	font-size:18px;
	padding:10px;
	color:#fff;
	width: 83%;
	display: block;
	text-align:center;
	font-weight:bold;
	float:left;
}
.jp-prize-number{
	display: inline-block;
	
	text-align:center;
	padding:2px 5px;
	font-weight:bold;
	font-size:18px;
}
.bonus-prize{
	background:#1c377c;
	border-radius:25px;
	font-size:18px;
	padding:10px;
	color:#fff;
	width: 100%;
	display: block;
	text-align:center;
	font-weight:bold;
	float:left;
}
.fourdalign{
	margin-top:10px;
}
.sixdbonusalign{
	margin-top:10px;
}
.sixdalign{
	margin-top:8px;
}
.result-link{
	font-weight:bold;
}
.result-link span.fa.fa-angle-right {
    background: #c21101;
    color: #fff;
    padding: 2px 6px;
    border-radius: 50%;
    width: 20px;
    height: 20px;
}
.jackpot-result{
	float:left;
	width:17%;
	background:#bc2129;
	border-radius:0 25px 25px 0;
	color:#fff;
	font-size:32px;
	padding:0 12px;
}
.jackpot6d-label{
	text-align:right;
	padding:5px;
	font-weight:bold;
	font-size:18px;
	color:#bc2129;
	display:block;
}
.jackpot6d-number{
	display: block;
	
	padding:5px;
	font-weight:bold;
	font-size:18px;
}
.prize-footer{
	font-size:14px;
	color:#fff;
	background:#bc2129;
	padding:3px ;
	margin:15px -15px 0;
}
.old-jp {
    margin-top: 12px;
}
.jackpot-game {
    color: #bc2129;
    font-size: 18px;
    font-weight: bold;
	margin-top:0;
}
.jackpot-border {
    border-left: 1px solid #ccc;
    margin-top: 35px;
}
.jackpot-margin{
	margin-top:35px;
}
.fourdalign.old-game {
    margin-top: 27px;
}
.old-game-threed {
    margin-top: 35px;
}
.carousel-inner > .item > img{
	width:100%;
}
.carousel{
	margin:20px 0 0;
}
.stacked-on{
	margin-top:-50px;
}
.lucky-box{
	background:#c00000;
	padding:16px;
	color:#fff;
}
.special-box{
	background: #eee url(/media/1486/calendar-bg.png);
    background-repeat: no-repeat;
    background-position: top right;
    padding: 20px 0;
    display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -moz-flex;
	display: -webkit-flex;
	display: flex;
    align-content: center;
    flex-flow: row wrap;
    justify-content: center;
    min-height: 202px;
}
.special-box-space{
	width:100%;	
}
.specialdraw-label{
	background: #bc2129;
    border-radius: 50px;
    color: #fff;
    display: block;
    width: 65%;
    text-align: center;
    padding: 5px;
    margin: 10px auto;
	font-weight: 300;
	font-size:20px;
}
.special-date{
	font-weight:bold;
	font-size:30px;
}
.bonus-space{
	margin:40px 0 0;
}
.zodiac-center{
	text-align:center;
	margin-top:8px;
}
.zodiac-left{
	text-align:left;
	margin-top:8px;
	margin-bottom:5px;
}
.zodiac-prize{
	font-weight:bold;
	font-size:18px;
	padding:3px 0 0;
	min-height:35px;
}
.zodiac-img{
	width:27px;
	display:inline-block;
	margin:-10px 1px 0;
}
.tile-4{
	background-size:cover;
	background-repeat: no-repeat;
	min-height:285px;
}
.old-game-tile-wrapper{
		
}
.old-game-tile-wrapper .tile-4{
	background-size: cover;
    background-repeat: no-repeat;
    min-height: 240px;
    background-position: center center;
}
.tile-title{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+1,000000+100&0+0,0.65+100 */
	background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.01) 1%, rgba(0,0,0,0.80) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.01) 1%,rgba(0,0,0,0.80) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.01) 1%,rgba(0,0,0,0.80) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */
	color: #fff;
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
    margin: 0;
    padding: 100px 0 30px;
	text-shadow:1px 1px 3px #333;
	font-weight:300;
}
.press-section{
	background:#1b377c;
	min-height:280px;
	padding:30px 0 0;
}
.press-title, .press-paragraph{
	color:#fff;
	text-align:center;
}
.press-section-b{
	margin-top:-100px;
	margin-bottom:50px;
}
.press-border{
	border:3px solid #fff;
}
.btn-read{
	background:#23527c;
	color:#fff;
	border-radius:25px;
	padding:8px 30px;
	display:inline-block;
}
.btn-read:hover, .btn-read:focus{
	text-decoration: none;
    color: #fff;
    transition: all ease-in-out .5s;
    background: #091c4a;
}
.lucky_num{color:#fff; text-align:center;   }
.lucky_num_widget{padding-top:15px; padding-bottom:10px; padding-left:15px;position:relative; overflow:hidden; display:block;}
.lucky_num_widget .lucky_num_digits{float:left; width: 50%; text-align: center;}
.lucky_num-1, .lucky_num-2, .lucky_num-3, .lucky_num-4{ overflow:hidden;display:inline-block; zoom:1; padding:5px 13px; background:#fff; color:#000; font-size:23px;line-height: 46px; height:60px; margin-left:-15px;
position:relative; width:60px;  -webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px; 
}
.anim_mask{position:absolute; left:20px; width: 20px;height: 40px;overflow: hidden;}
.anim_numbers{background:#fff url("https://stgdmccms1.blob.core.windows.net/media/1079/num_sprite.jpg")  repeat-y center bottom; position:absolute; z-index:1; width:100%; width: 20px; left: 0px; bottom:0px; margin-bottom:-8px;
}

.lucky_num_widget .lucky_num_refresh{float:left; cursor:pointer;}
.lucky_num p{margin:0px; font-size:.9em; }
.lucky_num p img{vertical-align:middle;}

/* utilities */
#calc input[type=checkbox][disabled]+label{color:#666;}
.calc_close_small{position:absolute; right:0px; top:0px; background:url("https://stgdmccms1.blob.core.windows.net/media/1200/calc-close.png") no-repeat; width:19px; height:19px;  cursor:pointer;}
#calc{position:absolute; z-index:300; top:50%; left:50%; z-index:100; width:215px; min-height:60px; height:auto; background: #fff; margin-left:-107px; max-height:500px; overflow:auto; font-size:14px;
margin-top:-30px;display:none;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .4);
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.4);}
#calc_panel{background:#005EA2; height:30px; color:#fff; position:absolute; width:215px;}
#calc_panel span{line-height:30px; font-weight:bold; padding-left:15px;}
.calc_content{margin-top:30px;} 


.calc_content select{width:90%; margin:5%; border:#ccc solid 2px; outline:none; -webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;}
#calc_panel .calc_close{background:url("https://stgdmccms1.blob.core.windows.net/media/1200/calc-close.png") no-repeat; width:28px; height:30px; float:right; cursor:pointer;}
.calc_key_num{width:90%; margin:0px auto 10px auto; display:none;}
.calc_key_num label{font-size:12px; margin-right:20px;}
.calc_calculate, .calc_add{color:#fff; background:#F00; padding:10px; margin-bottom:10px; border:none; display:block; margin:10px 0px;float:left; margin-right:5px;}
.calc_add{background:#181B60;} 

.jackpot3DSmallValue{font-size: 12px;padding-left: 3px;color: #fc0000;font-weight: 600;}
.calc_4djackpot input[type=text]:nth-child(-n+2){width:85px; margin:0px auto 5px; padding:3px 0px; display:inline-block; text-align: center; border: #CCC solid 1px;}
.calc_3djackpot input[type=text]:nth-child(-n+2){width:50px; margin:0px auto 5px; padding:3px 0px; display:inline-block; text-align: center; border: #CCC solid 1px;}
.calc_4djackpot input[type=text], .calc_3djackpot input[type=text]{padding:3px 5%; width:82%;}
.calc_dmcjackpot input[type=text]:nth-child(-n+2){width:85px; margin:0px auto 5px; padding:3px 0px; display:inline-block; text-align: center; border: #CCC solid 1px;}
.calc_dmcjackpotSP input[type=text]:nth-child(-n+2){width:85px; margin:0px auto 5px; padding:3px 0px; display:inline-block; text-align: center; border: #CCC solid 1px;}
.calc_dmcjackpotSP-old input[type=text]:nth-child(-n+2){width:85px; margin:0px auto 5px; padding:3px 0px; display:inline-block; text-align: center; border: #CCC solid 1px;}
.calc_entry select{border: #CCC solid 1px;}
.calc_entry input{border: #CCC solid 1px; text-align:center;}
.calc_onethreed input[type=text], .calc_threed input[type=text]{padding:3px 0px; width:185px; border: #CCC solid 1px; text-align:center;}
.calc_onethreed input[type=text]:nth-child(n+2), .calc_threed input[type=text]:nth-child(n+2){width:90px; margin:10px auto; padding:3px 0px; display:inline-block; border: #CCC solid 1px; text-align:center;}
.calc_superonethreed input[type=text], .calc_threed input[type=text]{padding:3px 0px; width:185px; border: #CCC solid 1px; text-align:center;}
.calc_superonethreed input[type=text]:nth-child(n+2), .calc_threed input[type=text]:nth-child(n+2){width:90px; margin:10px auto; padding:3px 0px; display:inline-block; border: #CCC solid 1px; text-align:center;}
.calc_entry:nth-child(n+2){border-top: #666 solid 1px;padding-top: 8px; margin-top: 6px;}
.calc_result{width:90%; margin:0px auto 10px auto; line-height:25px;}
.calc_result div{ border-top:#666 solid 3px; border-bottom:#666 solid 3px; padding:5px 0px;} 

.right-border{
	background: url(https://stgdmccms1.blob.core.windows.net/media/1190/line-bg.png);
    background-repeat: no-repeat;
    background-position: right 35px;
}
.jp-modal-btn,.jp-modal-btn:hover,.jp-modal-btn:focus{
	color:#fff;
	outline:inherit;
}

.jp-modal .modal-dialog{
	margin:50px auto;
}
.modal-content{
	border-radius:0;
}
.jp-modal button.close{
	margin: -35px 10px 0 0;
    color: #fff;
    opacity: 1;
    font-size: 30px;
}
.jackpot-won-modal .modal-content{
	border-radius:0;
	background:#c40001;
	color:#fff;
}
footer {
	padding:15px 0;
	background:#333;
	color:#fff;
}
footer a, footer p{
	color:#fff;
	margin:0;
}
footer a:hover{
	text-decoration:underline;	
}
.jp-btn {
    padding: 2px ;
    background: none;
    display: block;
    color: #eee;
}
/* The side navigation menu */
.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 1; /* Stay on top */
    top: 0; /* Stay at the top */
    left: 0;
    background:rgba(0,0,0,0.65);
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 30px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav a {
    padding: 4px 8px 4px 32px;
    text-decoration: none;
    font-size: 25px;
    color: #fff;
    display: block;
    font-weight: 300;
    transition: 0.3s;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover,.sidenav a:focus {
    color: #fff;
	background: #c21101;
}
.sidenav a.closebtn:hover,.sidenav a.closebtn:focus {
    color: #fff;
	background: transparent;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}
.winning-no-btn{
	margin-top:30px;
}
/*powertip abstract*/
#powerTip{cursor:default;font-size:1em; background-color:#333;background-color:rgba(255,0,0,.9);color:#fff;display:none;padding:10px;position:absolute;white-space:nowrap;z-index:2147483647}#powerTip:before{content:"";position:absolute}#powerTip.n:before,#powerTip.s:before{border-right:5px solid transparent;border-left:5px solid transparent;left:50%;margin-left:-5px}#powerTip.e:before,#powerTip.w:before{border-bottom:5px solid transparent;border-top:5px solid transparent;margin-top:-5px;top:50%}#powerTip.n:before{border-top:10px solid #333;border-top:10px solid rgba(255,0,0,.8);bottom:-10px}#powerTip.e:before{border-right:10px solid #333;border-right:10px solid rgba(255,0,0,.8);left:-10px}#powerTip.s:before{border-bottom:10px solid #333;border-bottom:10px solid rgba(255,0,0,.8);top:-10px}#powerTip.w:before{border-left:10px solid #333;border-left:10px solid rgba(255,0,0,.8);right:-10px}#powerTip.ne:before,#powerTip.se:before{border-right:10px solid transparent;border-left:0;left:10px}#powerTip.nw:before,#powerTip.sw:before{border-left:10px solid transparent;border-right:0;right:10px}#powerTip.ne:before,#powerTip.nw:before{border-top:10px solid #333;border-top:10px solid rgba(255,0,0,.8);bottom:-10px}#powerTip.se:before,#powerTip.sw:before{border-bottom:10px solid #333;border-bottom:10px solid rgba(255,0,0,.8);top:-10px}#powerTip.nw-alt:before,#powerTip.ne-alt:before,#powerTip.sw-alt:before,#powerTip.se-alt:before{border-top:10px solid #333;border-top:10px solid rgba(255,0,0,.8);bottom:-10px;border-left:5px solid transparent;border-right:5px solid transparent;left:10px}#powerTip.ne-alt:before{left:auto;right:10px}#powerTip.sw-alt:before,#powerTip.se-alt:before{border-top:0;border-bottom:10px solid #333;border-bottom:10px solid rgba(255,0,0,.8);bottom:auto;top:-10px}
#powerTip.se-alt:before{left:auto;right:10px}
#powerTip .win_stat{width:100%; margin-top:5px;}
#powerTip .win_stat th{border-top:medium solid #fff;border-bottom:medium solid #fff; text-align:center;}
#powerTip .win_stat td{border-bottom:thin solid #fff; text-align:center;}
#powerTip .more_hist{font-size: .9em;padding-top: 3px; cursor:pointer;}
/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
    /*transition: margin-left .5s;
    padding: 20px;*/
}
/* map only css*/
#map_container{background:#FFF; position:relative; min-height:500px; overflow: hidden;}
#map{position: absolute;width: 100%;height: 100%;}
#map_search{top:40px; bottom:auto; width:300px; left:auto; margin:0px; right:20px; height:45px;}
.direction_btn{background:#c61100; padding:10px; color:#fff; font-weight:bold; text-align:center; cursor:pointer;}
.map_btns{display:inline-block; padding:2px 6px; line-height:20px; color:#808080; vertical-align: middle; border-left:#666 solid thin; cursor:pointer; width:120px;}
.map_btns.activated{color:#E90000;}
.map_alert{position:absolute; z-index:100; top:0px; bottom:0px; left:0px; right:0px; width:250px; height:60px; padding:10px;
background:#fff; display:table; text-align:center; margin:auto;
border: 1px solid #CCC;
border-top-color: #D9D9D9;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);}
.map_alert p{display:table-cell; vertical-align:middle;}
.map_btns:first-child{ border-left:none; width:auto;}
#map_nav, #map_search{position:absolute; bottom:40px; left:50%; width:90%; margin-left:-45%; text-align:center; outline:rgba(0,0,0,.5) 8px solid;
  background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #cad6de 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#cad6de)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffffff 0%,#cad6de 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffffff 0%,#cad6de 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffffff 0%,#cad6de 100%); /* IE10+ */
background: linear-gradient(to bottom, #ffffff 0%,#cad6de 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cad6de',GradientType=0 ); /* IE6-9 */
}
#map_search_input{background:none; padding:10px; width:222px; float:left; border:none; outline:none; font-size:18px;}
#map_search_icon{border-left:#666 solid thin; display:inline-block; padding:5px 10px; line-height:20px; position: absolute;
right: 0px; cursor:pointer;}
#map_search{top:40px; bottom:auto; width:300px; left:auto; margin:0px; right:20px; height:45px;}

.jackpot-prize.face.back {
    background: #c21101;
    border-right: 1px solid #fff;
}
#jp-container {
      position: relative;
      margin: auto;
      width: 83%;
      height: 45px;
      z-index: 1;
	float:left;
}
#jp-container {
      perspective: 1000;
}
#jp_card {
    width: 100%;
    height: 100%;
}

.face {
      position: absolute;
      width: 100%;
      height: 100%;
	-ms-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
      backface-visibility: hidden; 
	-webkit-backface-visibility: hidden;
}
.face.back {
      display: block;
	-ms-transform: rotateX(180deg);
	-webkit-transform: rotateX(180deg);
	-moz-transform: rotateX(180deg);
	-o-transform: rotateX(180deg);
	transform: rotateX(180deg);
     
}

.face.back {
    -webkit-animation: BackRotate 4s linear infinite;
    animation: BackRotate 4s linear infinite;
}

.face.front {
    -webkit-animation: Rotate 4s linear infinite;
    animation: Rotate 4s linear infinite;
}

@-webkit-keyframes Rotate {
    60% {-webkit-transform:rotateX(0deg);}
    100% {-webkit-transform:rotateX(360deg);}
}
@-webkit-keyframes BackRotate {
    60% {-webkit-transform:rotateX(180deg);}
    100% {-webkit-transform:rotateX(540deg);}
} 
@keyframes Rotate {
    60% {-webkit-transform:rotateX(0deg);}
    100% {-webkit-transform:rotateX(360deg);}
}
@keyframes BackRotate {
    60% {-webkit-transform:rotateX(180deg);}
    100% {-webkit-transform:rotateX(540deg);}
}

.flip_effect.jackpot-prize.flipped {
    background: #bc2129;
	border-right:1px solid #fff;
}
.flip_effect.bonus-prize.flipped{
	background: #bc2129;
}
.card.flip_effect.flipped .card_front {
  -webkit-transform: rotateX(-180deg);
  transform: rotateX(-180deg);
}
.card.flip_effect.flipped .card_back {
  -webkit-transform: rotateX(0);
  transform: rotateX(0);
}
.card {
  position: relative;
  float: left;
  height:45px;
  text-align: center;
}
.card_front, .card_back {
  position: absolute;
  width: 100%;
  height: 100%;
	top:0;
	left:0;
	padding:10px;
  perspective: 1000px;
}
.card_front, .card_back {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: -webkit-transform 1s;
  transition: transform 1s;
}
.card_back {
  -webkit-transform: rotateX(-180deg);
  transform: rotateX(-180deg);
  animation: blink-animation .5s steps(5, start) infinite;
  -webkit-animation: blink-animation .5s steps(5, start) infinite;
	text-decoration:underline;
}
.prize-number {
		cursor:pointer;
	}
@keyframes blink-animation {
  to {
    visibility: hidden;
  }
}
@-webkit-keyframes blink-animation {
  to {
    visibility: hidden;
  }
}

@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
}
@media only screen and (max-width: 1300px) {
	.jp-info {
		width: 13.5%;
		float: left;
		padding: 5px 5px;
		text-align: center;
	}
	.jp-drawcol {
		width: 18%;
		float: left;
		padding: 5px 10px;
		text-align: left;
		border-right: 1px solid #a20e01;
	}
	.jp-title {
		display: block;
		font-size: 12px;
	}
	.jp-price {
		display: inline-block;
		font-size: 16px;
		font-weight: 600;
	}
	.jackpot6d-label{
		font-size:14px;
	}
	.jackpot6d-number{
		font-size:15px;
	}
	.prize-number {
		padding: 5px 0;
		font-size: 15px;
		min-height:inherit;
	}
	.zodiac-prize{
		font-size:14px;
	}
	.zodiac-img{
		width:20px;
		margin:-6px 1px 0;
	}
	#jp-container {
		
		  height: 42px;
		
	}
	.jackpot-prize {
		background: #1c377c;
		border-radius: 25px 0 0 25px;
		font-size: 16px;
		padding: 10px 5px;
		color: #fff;
		
		display: block;
		text-align: center;
		font-weight: bold;
		float: left;
	}
	.jackpot-result {
		float: left;
		width: 17%;
		background: #bc2129;
		border-radius: 0 25px 25px 0;
		color: #fff;
		font-size: 30px;
		padding: 0 10px;
	}
	.bonus-prize{
		font-size:16px;	
	}
	.prize-label,.bonus-label {
		font-size: 13px;
	}
	.logo1{
		width:60px;
	}
	.tile-4{
		background-size:cover;
		background-repeat: no-repeat;
		min-height:220px;
	}
	
}
@media only screen and (max-width: 1200px) {
	.jackpot-title{
		font-size:14px;	
	}
	.jplogo1{
		width:55px;	
	}
	.jplogo2 {
		width: 55px;
		display: block;
		margin: 31px auto 0;
	}
	.bonuslogo1{
		margin: 0 auto 29px;
    	width: 60px;
	}
	.logo1 {
		width: 60px;
		margin: 15px auto 22px;
	}
	.logo2{
		margin:15px auto 21px;
	}
	.logo3 {
		width: 34px;
		display: block;
		margin: 5px auto 0;
	}
	.zodiac-left{
		margin-bottom: 6px;
	}
	.bonus-space {
		margin: 35px 0 0;
	}
	.winning-horse-label{
		font-size: 12px;
	}
	.rolling-number{
		width: 60px;
		height: 60px;
		line-height: 60px;
	}
	.card{
		height:42px;	
	}
	
}
@media only screen and (max-width: 1082px) {
	.jp-draw{
		font-size:12px;	
	}
	
}
@media only screen and (max-width: 1024px) {
	.menu {
		margin-top: 25px;
	}
	.lang {
    	margin-top: 28px;
	}
	.btn-login{
		margin-top: 16px;	
	}
	.jackpot-title{
		font-size:15px;	
	}
	.logo2{
		margin: 15px auto 28px;	
	}
	.logo3 {
		width: 35px;
		display: block;
		margin: 10px auto 0;
	}
	.jplogo1{
		width:55px;
		display: block;
		margin:auto;
	}
	.jplogo2{
		width:55px;
		display: block;
		margin:32px auto 0;
	}
	.jplogo3{
		width:35px;
		display: block;
		margin:32px auto 0;
	}
	.bonuslogo1{
		width: 63px;
		display: block;
		margin: 0 auto 32px;
	}
	.old-game-tile-wrapper .tile-4{
		min-height: 220px;
	}
	.zodiac-img {
		width: 19px;
		margin: -4px 1px 0;
	}
	.zodiac-prize {
		font-size: 13px;
	}
	.jackpot6d-label {
		font-size: 13px;
	}
	.bonus-space {
		margin: 33px 0 0;
	}
	.sixdalign {
		margin-top: 5px;
	}                                                                                                                                                                                                                                                                                                                       
}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) { 
	.prize-number {
		font-size: 14px;
	}
	.jackpot6d-label {
		font-size: 12px;
	}
	.prize-label, .bonus-label {
		font-size: 12px;
	}
	.mobile-no-space{
		margin:0;
	}
}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) { 
	.push-right-30{
		right:inherit;
	}
	.pull-left-20{
		left:inherit;
	}
	.prize-column, .jackpot-column{
		width:80%;
		margin:0 auto;
		display:block;
		float:none;
	}
	.prize-label, .bonus-label {
		font-size: 16px;
	}
	.prize-number {
		font-size: 18px;
	}
	.lucky_num_refresh {
		float: left;
		cursor: pointer;
		width: 50%;
	}
	.lucky_num-1, .lucky_num-2, .lucky_num-3, .lucky_num-4 {
		padding: 1px 13px;
		line-height: 49px;
		height: 49px;
		width: 49px;
	}
}
@media only screen and (max-width: 1000px) {
	.container-fluid.mobile-padding-5{
		width:80%;
	}
	.navbar-nav{
		float:left;
	}
	.navbar-brand > img{
		width:160px;
	}
	.btn-login{
		padding: 7px 9px;
		font-size:13px;
		margin-top: 22px;
		
	}
	.menu-text{
		display: none;
	}
	.current-lang,.divider-lang{
		display:none;
	}
	.mobile-no-space{
		margin:0;
		padding:0;
	}
	.stacked-on .container{
		padding:0;
	}
	.stacked-on{
		margin-top:0;
	}
	.mobile-padding-5{
		padding:0 5px;
	}
	.livedraw{
		width:100%;
		float:left;
		background:#1c377c;
		padding:30px 0;
		min-height: inherit;
	}
	.livedraw-6d{
		width:100%;
		min-height: inherit;
	}
	.rolling-number{
		float:left;
		width:60px;
		height:60px;
		line-height:60px;
		background:#fff;
		font-size:25px;
		border-radius:50%;
		font-weight:bold;
		margin:30px -8px;
		text-align:center;
	}
	.winning-horse-label{
		font-size:14px;	
	}
	.prize-column, .jackpot-column{
		width:100%;
	}
	.jackpot-bar {
    	text-align: center;
	}
	.jp-drawcol{
		width:100%;
		float:none;
		padding:5px 15px;	
		text-align:center;
		border-right:none;
		border-bottom:1px solid #a20e01;
		color:#ccc;
	}
	.jackpot-result {
		float: left;
		width: 15%;
		background: #bc2129;
		border-radius: 0 25px 25px 0;
		color: #fff;
		font-size: 32px;
		padding: 0 22px;
	}
	.lucky_num_widget .lucky_num_refresh{
		float:none;	
	}
	.push-right-30{
		right:inherit;
	}
	.pull-left-20{
		left:inherit;
	}
	.jp-btn:hover, .jp-btn:focus{
		text-decoration: none;
	}
	.jp-draw{
		display:inline-block;	
		font-size:16px;
		padding-bottom:3px;
	}
	.jp-drawdate{
		display:inline-block;	
		font-size:14px;
	}
	.jp-info {
		width: 50%;
	}
	.jp-info.jp1{
		width:100%;	
	}
	.jp-title.jp1{
		font-size:22px;	
	}
	.jp-price.jp1{
		font-size:30px;	
	}
	.jackpot-prize,.bonus-prize {
		font-size: 18px;
	}
	.jackpot6d-label{
		font-size:18px;
	}
	.jackpot6d-number{
		font-size:18px;
	}
	.prize-number {
		padding: 5px 0;
		font-size: 18px;
	}
	.zodiac-prize{
		font-size:17px;
	}
	.press-section-b{
		margin:0;
	}
	.press-section{
		margin:0;
		padding:15px 15px 5px;
		min-height: inherit;
	}
	.home-press{
		margin:20px 0;
	}
	.winning-no-btn{
		margin-top:5px;
	}
	.lucky_num_widget .lucky_num_digits {
		width: 100%;
	}
	.lang.active{
		display:none;
	}
	.next-arrow, .previous-arrow {
		margin-top: 135%;
		width: 25px;
	}
	
}
@media only screen and (max-width: 767px) {
	.container-fluid.mobile-padding-5{
		width:100%;
	}
}
@media screen and (min-width: 340px) and (max-width: 676px) {
    .logo1 {
		width: 80px;
	}
}
@media only screen and (max-width: 385px) {
	.jackpot-prize {
		font-size: 16px;
	}
	.jackpot6d-label{
		font-size:16px;
	}
	.jackpot6d-number{
		font-size:16px;
	}
	.prize-number {
		padding: 5px 0;
		font-size: 15px;
		white-space:nowrap;
	}
	.zodiac-prize{
		font-size:15px;
	}
	.winning-horse-label {
		font-size: 13px;
	}
	.rolling-number {
		float: left;
		width: 55px;
		height: 55px;
		line-height: 55px;
	}
	.btn-login{
		padding: 7px 7px;
		font-size:12px;
		margin-top: 22px;
	}
}
@media only screen and (max-width: 325px) {
	.livedraw-tab > li {
		width: 31%;
		margin: 0 2px;
	}	
	.prize-number {
		padding: 5px 0;
		font-size: 13px;
	}
	.prize-label, .bonus-label {
		font-size: 12px;
	}
	.zodiac-prize {
		font-size: 13px;
	}
	.zodiac-img {
		width: 17px;
		
	}
	.livedraw-tab > li > a{
		font-size:11px;
	}
	.winning-horse-label {
		font-size: 12px;
	}
	.rolling-number {
		width: 51px;
		height: 55px;
	}
	.livedraw h4{
		font-size:15px;
	}
}
}