	/* Iphone X */
	@media only screen 
	and (min-device-width : 375px) 
	and (max-device-width : 812px)
	and (-webkit-device-pixel-ratio : 3) 
    { 
	 /* @viewport {
	  width: 100vw; /*Sets the width of the actual viewport to the device width*/
     /* }*/
    }


.w3-theme-l5 {color:#000 !important; background-color:#e9fffd !important}
.w3-theme-l4 {color:#000 !important; background-color:#b7fff8 !important}
.w3-theme-l3 {color:#000 !important; background-color:#6efff1 !important}
.w3-theme-l2 {color:#000 !important; background-color:#26ffe9 !important}
.w3-theme-l1 {color:#fff !important; background-color:#00dcc6 !important}
.w3-theme-d1 {color:#fff !important; background-color:#008578 !important}

/* colour of side banner mobile */
.w3-theme-d2 {color:#fff !important; background-color:#27264e !important}
.w3-theme-d3 {color:#fff !important; background-color:#00685d !important}
.w3-theme-d4 {color:#fff !important; background-color:#005950 !important}
.w3-theme-d5 {color:#fff !important; background-color:#004a43 !important}

.w3-theme-light {color:#000 !important; background-color:#e9fffd !important}
.w3-theme-dark {color:#fff !important; background-color:#292677 !important}
.w3-theme-action {color:#fff !important; background-color:#004a43 !important}
/* colour of main banner mobile */
.w3-theme {color:#fff !important; background-color:#27264e !important}
.w3-text-theme {color:#27264e!important}
.w3-border-theme {border-color:#27264e !important}

.w3-hover-theme:hover {color:#fff !important; background-color:#27264e !important}
.w3-hover-text-theme:hover {color:#27264e !important}
.w3-hover-border-theme:hover {border-color:#27264e !important}
sup{
    margin-top: -25px;
    margin-bottom: 1px;
    margin-right: 1px;
    margin-left: 1px;
	font-style: italic;
}
.imageLogo{	border-radius: 25px;
			padding-top:16px!important;
			padding-bottom:16px!important;
			padding-right:16px!important;
			padding-left:16px!important;
			}
ul.a {
    list-style-position: outside;
	padding-left: -2;
}

ul.b {
    list-style-position: inside;
}		
.inputstl { 
	font-size: 14px;
	padding: 2px; 
	border: solid 1px #0077B0; 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #233661), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #324a80  1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 240px;
	margin: 2px; 
} 
.inputstl1 { 
	font-size: 12px;
	padding: 2px; 
	border: solid 1px #0077B0; 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #324a80 1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 175px; 
	margin: 2px;
} 
.inputstl2 { 
	font-size: 14px;
	padding: 2px; 
	border: solid 1px #0077B0; 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #3c6096), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #324a80 1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 255px;
	margin: 2px; 
}
.inputstlE { 
	font-size: 14px;
	padding: 2px; 
	border: solid 1px #0077B0; 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #233661), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #324a80  1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 	
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 450px;
	margin: 2px; 
}
.inputstlR { 
	font-size: 14px;
	padding: 2px; 
	border: solid 1px #0077B0; 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #233661), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #324a80  1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 	
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 440px;
	margin: 2px; 
}
.inputstlD { 
	font-size: 14px;
	padding: 2px; 
	border: solid 1px #0077B0; 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #233661), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #324a80  1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 	
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 120px;
	margin: 2px; 
}
.updateTips { 
	font-size: 12px;
	padding: 5px; 
	border: solid 1px rgb(127, 155, 168); 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 190px;
	margin: 2px;
}
.updateTips1 { 
	font-size: 12px;
	padding: 5px; 
	border: solid 1px rgb(127, 155, 168); 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 200px;
	margin: 2px;
}
.blockedMob {
	font-size: 11px;
	padding: 5px; 
	border: solid 1px rgb(127, 155, 168); 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 27, from(#ae1c28), color-stop(50%, #FFFFFF), to(#ae1c28)); 
	background: -moz-linear-gradient(top, #FFFFFF, #ad6161 1px, #FFFFFF 25px); 
    box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 190px; 
	margin: 2px;
}
.viewTips { 
	font-size: 11px;
	padding: 5px; 
	border: solid 1px rgb(127, 155, 168); 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 196px; 
	margin: 2px;
}
.viewTips1 { 
	font-size: 11px;
	padding: 5px; 
	border: solid 1px rgb(127, 155, 168); 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 140px; 
	margin: 2px;
}
.viewTips2 { 
	font-size: 11px;
	padding: 5px; 
	border: solid 1px rgb(127, 155, 168); 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 120px; 
	margin: 2px;
}
.viewSelections { 
	font-size: 11px;
	padding: 5px; 
	border: solid 1px rgb(127, 155, 168); 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 180px; 
	margin: 2px;
}
.resultsBonusMsg{
	width: 380px;
}
.menuImage{
	width: 68%;
}	
.menuIcon{
	width: 43%;
	padding-top: 4px; 
}
.footerSpace{
	font-size : 11px;
}
.inputstUser { 
	font-size: 14px;
	padding: 2px; 
	border: solid 1px #0077B0; 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #233661), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #324a80  1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 240px;
	margin: 2px; 
} 

	/* Iphone 6/7/8 */
	/* I tried a lot of other combinations including min-device-width: 375px etc that didn't work */
	/* for iphone 6/7/8 - then finally got the the below solution working*/  
	@media screen 
	and (max-device-height: 667px), 
	screen
	and (device-height: 667px),
	screen
	and (-webkit-device-pixel-ratio : 2)  
	{
	.updateTips { 
		font-size: 12px!important;
		padding: 5px!important; 
		border: solid 1px rgb(127, 155, 168)!important; 
		outline: 0!important; 
		background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF))!important; 
		background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px)!important; 
		box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px!important; 
		-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px!important; 
		-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px!important; 
		border-radius: 5px!important;
		min-height: 27px!important;
		width: 157px!important;
		margin: 2px!important;
	}
	.updateTips1 { 
		font-size: 12px;
		padding: 5px; 
		border: solid 1px rgb(127, 155, 168); 
		outline: 0; 
		background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
		background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
		box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
		-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
		-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
		border-radius: 5px;
		min-height: 27px;
		width: 200px;
		margin: 2px;
	}
	.blockedMob {
		font-size: 11px;
		padding: 5px; 
		border: solid 1px rgb(127, 155, 168); 
		outline: 0; 
		background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #a34545), to(#FFFFFF)); 
	    background: -moz-linear-gradient(top, #FFFFFF, #ad6161 1px, #FFFFFF 25px); 
   	    box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
		-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
		-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
		border-radius: 5px;
		min-height: 27px;
		width: 155px; 
		margin: 2px;
	}
	.resultsBonusMsg{
		width: 334px;
		}
		.viewTips1 { 
			font-size: 11px;
			padding: 5px; 
			border: solid 1px rgb(127, 155, 168); 
			outline: 0; 
			background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
			background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
			box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
			-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
			-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
			border-radius: 5px;
			min-height: 27px;
			width: 120x; 
			margin: 2px;
		}
		.viewTips2 { 
			font-size: 11px;
			padding: 5px; 
			border: solid 1px rgb(127, 155, 168); 
			outline: 0; 
			background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
			background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
			box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
			-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
			-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
			border-radius: 5px;
			min-height: 27px;
			width: 70px; 
			margin: 2px;
		}
	.menuImage{
		width: 63%;
	}
	.menuIcon{
		width: 38%;
	}
	.footerSpace{
		font-size : 0px;
	}
	.loginFont{
		font-size: 9px!important;
	}
	.navFont{
		font-size: 11px;
	}
	.tipEntryMob1 {
		font-size: 9px!important;
	}
	.tipEntryColour {
		font-size: 9px!important;
		background-color: #5a89db;
		border-radius: 0px;
		color: black!important;
		font-weight: bold;
	}
	.tipEntryColourIndex {
		font-size: 9px!important;
		background-color: #5a89db;
		border-radius: 0px;
		color: black!important;
		font-weight: bold;
	}
	.tipEntryColourmyMates {
		font-size: 9px!important;
		background-color: #fd7b02;
		border-radius: 0px;
		color: black!important;
	}
	.tipEntryColourmyMatesIndex {
		font-size: 9px!important;
		background-color: #fd7b02;
		border-radius: 0px;
		color: black!important;
	}
	.tdrHighest {
		font-size: 11px;
		border: 1px solid #d5d5e6;
		/*background-color: #27264e;*/
		background-color: #97b5e7;
		color:black;
	}
	.buttonEntry{
		background-color: #27264e!important;
		border: 2!important;
		border-color: lightsteelblue!important;
		color: white!important;
		padding: 4px 8px 4px 8px!important;
		text-align: center!important;
		text-decoration: none!important;
		display: inline-block!important;
		cursor: pointer!important;
		font-size: 9px!important;
		border-radius: 15%!important;
	}
	.buttonLogin{
		background-color: #27264e!important;
		border: 2!important;
		border-color: lightsteelblue!important;
		color: white!important;
		padding: 4px 8px 4px 8px!important;
		text-align: center!important;
		text-decoration: none!important;
		display: inline-block!important;
		cursor: pointer!important;
		font-size: 14px!important;
		border-radius: 10%!important;
		padding-top:2px!important;
  	    height: 35px;
		width: 120px;
	}
	.buttonJoin{
		background-color: #ae1c28!important;
		border: 2!important;
		border-color: lightsteelblue!important;
		color: white!important;
		padding: 4px 8px 4px 8px!important;
		text-align: center!important;
		text-decoration: none!important;
		display: inline-block!important;
		cursor: pointer!important;
		font-size: 14px!important;
		border-radius: 10%!important;
		padding-top:2px!important;
  	    height: 35px;
		width: 125px;
	}
	.btn-link.btn-anchor {
		outline: none !important;
		padding: 0;
		border: 0;
		vertical-align: baseline;
		color: black;
	}
	.copyWidth{
		width: 170px!important;
	}
	.loginWidth{
		width: 73px!important;
	}
	.viewResult { 
		font-size: 12px!important;
		padding: 5px!important;
		border: solid 1px rgb(127, 155, 168)!important; 
		outline: 0!important;
		background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF))!important;
		background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px)!important;
		box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px!important;
		-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px!important;
		-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px!important; 
		border-radius: 5px!important;
		min-height: 27px!important;
		width: 140px!important;
		margin: 2px!important;
	}
	.inputstUser { 
		font-size: 14px;
		padding: 2px; 
		border: solid 1px #0077B0; 
		outline: 0; 
		background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #233661), to(#FFFFFF)); 
		background: -moz-linear-gradient(top, #FFFFFF, #324a80  1px, #FFFFFF 25px); 
		box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
		-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
		-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
		border-radius: 5px;
		min-height: 27px;
		width: 180px;
		margin: 2px; 
	} 
	.userUpdateHead{
		width: 180px!important;
		font-size: 9px!important;
		text-align: right!important;
	}
	.userUpdateDetail{
		width: 80px!important;
		font-size: 11px!important;
		padding-left: 10px!important;
	}
	.userUpdateError{
		width: 200px!important;
		font-size: 11px!important;
	}
	.userUpdateButton{
		width: 90px!important;
		font-size: 12px!important;
	}
	.w3-padding-18 {
		padding-top: 18px!important;
		padding-bottom: 14px!important;
		margin-left: -5px!important;
		} 
	.reduced-padding {
		margin-left: -2px!important;
		}
	.reduced-H4{
		font-size: 18px!important;
	}
	.reduced-H2{
		font-size: 20px!important;
	} 	
	.ipadMessage{
		font-size: 18px!important;
	}
	.copyWidth{
		width: 165px!important;
	}
	.levelPositionMob{
		margin-top: 66px;
	}
	.reducedFixedWidth{
		width: 50px!important;
		table-layout:fixed;
		word-break:break-word;
	}
	.reducedFixedWidthLess{
		width: 47px!important;
		table-layout:fixed;
		word-break:break-word;
	}
	.reducedFontSmall{
        font-size: 11px!important;
	}
	.reducedMates{
		width: 41px!important;
	}
	.reducedFontSmaller{
		font-size: 8px!important;
	}
	.reducedFontSmallerJust{
		font-size: 7px!important;
	}
	}
/* ---------------------- end of smaller mobile ------------------------- */	
.ladder { 
	font-size: 12px;
	padding: 5px; 
	border: solid 1px rgb(127, 155, 168); 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 190px; 
	margin: 2px;
}
.viewResult { 
	font-size: 12px;
	padding: 5px; 
	border: solid 1px rgb(127, 155, 168); 
	outline: 0; 
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #537ebe), to(#FFFFFF)); 
	background: -moz-linear-gradient(top, #FFFFFF, #8696be 1px, #FFFFFF 25px); 
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 80px; 
	border-radius: 5px;
	min-height: 27px;
	width: 190px; 
	margin: 2px;
}    
.weekColour {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 13px;
}
.weekColourLadderDesk {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 13px;
}
.weekColourSmall {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 9.5px;
}
.weekColourSmaller {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 9px;
}
.weekColourSmallerLadder {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 8px;
}
.weekColour3 {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 15px;
}
.weekColourSelectionsDesk {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 13px;
}
.fontNine{
	font-size: 9px;
}
.fontNineFive{
	font-size: 9.5px;
}
.fontTen{
	font-size: 10px;
}
.fontEleven{
	font-size: 11px;
}
.bonusColour {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #f57ada;
	color:white;
	font-size: 11px;
}
.weekColourDsk {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 15px;
}
.weekColour1Dsk {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #d3d2e0;
	color:black;
	font-size: 15px;
}
.weekColour1 {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 10px;
}
.totalColour {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #30305c;
	color:white;
	font-size: 10px;
}
.weekColour1 {
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #d3d2e0;
	color:black;
	font-size: 10px;
}
.rotate {
	transform: rotate(90deg);
	transform-origin: center;
}
.tipEntry {
    font-size: 12px;
}
.tipSelection {
    font-size: 10px!important;
}
.tipEntryMob {
    font-size: 10px!important;
}
.tipEntryMob1 {
    font-size: 9px!important;
}
.tipEntryColour {
	font-size: 10px!important;
	background-color: #5a89db;
	border-radius: 0px;
	color: black!important;
	font-weight: bold;
}
.tipEntryColourIndex {
	font-size: 10px!important;
	background-color: #5a89db;
	border-radius: 0px;
	color: black!important;
	font-weight: bold;
}
.tipEntryColourmyMates {
	font-size: 10px!important;
	background-color: #fd7b02;
	border-radius: 0px;
	color: black!important;
}
.tipEntryColourmyMatesIndex {
	font-size: 10px!important;
	background-color: #fd7b02;
	border-radius: 0px;
	color: black!important;
}
.checkColourmyMates {
	background-color: #fd7b02;
}
.tdrHighest {
	font-size: 11px;
	border: 1px solid #d5d5e6;
	/*background-color: #27264e;*/
	background-color: #97b5e7;
	color:black;
}
.tdrHighestIndex {
	font-size: 12px;
	/*background-color: #27264e;*/
	background-color: #97b5e7;
	color:black;
}
.tipHighestDsk {
	font-size: 15px;
	background-color: #7391c2;
	color:black;
	border-radius: 0;
}
.heightSmall
{
	font-size: 8px!important;
	height:5px;
}
.tipViewColour {
	background-color: #3a7cdf;
	border-radius: 0px;
	color: white;
	font-size: 10px;
	border: 1px solid #d5d5e6;
}
.tipViewMatesColour {
	background-color: #fd7b02;
	border-radius: 0px;
	color: white;
	font-size: 10px;
	border: 1px solid #d5d5e6;
}
.center {
	text-align: center;
}
.okButton {
	background-color: white;
	color: grey;
	cursor: pointer;
	height: 30px;
	margin-top: 1px;
	margin-right: 0px;
	margin-bottom: 1px;
	margin-left: 5px;
	padding-top: 0px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
	font-size: 12px;
	border-radius: 10px;
	outline: none;
	}
	.negative {
		color: red;
	}
	.negativeWhiteBack {
		color: red;
		background-color: white;
	}
	.joinCompComment {
		font-size: 11.5px !important;
		font-style: italic !important;
		font-weight: bold !important;
		color: white !important;
		background-color:#27264e !important;
		border-radius: 5px;
		display:inline-block;
		width: 348px !important;
		height: 50px !important;
		padding: 9px;
		margin-left: 0px;
	}
	.changePasswordComment {
		font-size: 11.5px !important;
		font-style: italic !important;
		font-weight: bold !important;
		color: white !important;
		background-color:#27264e !important;
		border-radius: 5px;
		display:inline-block;
		width: 348px !important;
		height: 70px !important;
		padding: 9px;
		margin-left: 0px;
	}
	.forgotPasswordComment {
		font-size: 11.5px !important;
		font-style: italic !important;
		font-weight: bold !important;
		color: white !important;
		background-color:#27264e !important;
		border-radius: 5px;
		display:inline-block;
		width: 348px !important;
		height: 55px !important;
		padding: 9px;
		margin-left: 0px;
	}
	.scoreFont {
		color: white;
	}
	.bonusScoring {
		color: rgb(187, 57, 57);
	}
	.ulDesk {
		padding-left: 2%;
	}
	.ulMob {
		padding-left: 5%;
	}
	.tdr {
		font-size: 11px;
		border: 1px solid #d5d5e6;
		/*background-color: #27264e;*/
		background-color: #f2f2fa;
		color:black;
		}
	.tdr1 {
		/*font-size: 12px;*/
		border: 1px solid #8484c2;
		}
	.tdr2 {
		font-size: 10px;
		border: 1px solid #d5d5e6;
		background-color: #f7f7f8e6;
		}
	.tdra {
		font-size: 10px;
		border: 1px solid #d5d5e6;
		/*background-color: #27264e;*/
		background-color: #f2f2fa;
		color:black;
		}
	.tdraDsk {
		font-size: 15px;
		background-color: #f2f2fa;
		border-radius: 0px; 
		}		
	.tdrP {
		font-size: 10px;
		border: 1px solid #d5d5e6;
		/*background-color: #27264e;*/
		background-color: #f2f2fa;
		color:black;
		}
		
	.noBorder{
		border-color: white;	
	}
	.noTopBorder{
		border-top-color: white;
	}
	.noBottomBorder{
		border-bottom-color: white;	
	}
	.bottomBorder{
		border-bottom-color: black;
	}
	.center {
		text-align: center;
	}
	.fifteenFont{
		font-size: 15px;
		font-weight: bold;
	}
	.smallFont{
		font-size: 13px;
	}
	.smallTwelveFont{
		font-size: 12px;
	}
	.smallElevenFont{
		font-size: 11px;
	}
	.smallerFont{
		font-size: 10px;
	}
	.smallestFont{
		font-size: 9px;
	}
	.tinyFont{
		font-size: 6px;
	}
	.currentWeekFont{
		font-size: 8px!important;
		margin-top: -1px;
		margin-bottom: -1px;
		border-top: -1px;
		border-bottom: -1px;
	}
	body {
	/* The image used */		
	background-image: url(../images/BackGroundSwirlMob3.JPG);
	/* Full height */
	height: 50%;
	/* Center and scale the image nicely */
	background-position: center;
	background-repeat: repeat;
	background-size: cover;
	opacity: 1.0;
	}
	.whiteColor {
		color:white;
	}
	.loginFont{
		font-size: 12px;
		margin-left: 20px;
	}
	.copyWidth{
		width: 198px;
	}
	.loginWidth{
		width: 93px;
    }
	.loginColor{
		color:rgb(140, 200, 240);
	}
	.loginColorHome{
		color:rgb(83, 134, 168);
	}
	.contactColor{
		color:#27264e;
	}
	.w3-menuMain{
		margin-top: 10px;
		margin-bottom: 0px;
		margin-right: -25px;
		margin-left: -30px;
		border-top: 50px;
	}
	.w3-padding-18 {
	padding-top: 18px!important;
	padding-bottom: 14px!important;
    }
	
	input[type=checkbox] {
		transform: scale(0.9);
	}
	.negative1 {
		color: rgb(243, 132, 132);
	}
	.negativeWhiteBack {
		color: rgb(243, 132, 132);
		background-color: white;
		font-size: 13px!important;
		border-radius: 5px;
		padding: 7px;
	}
    .paraBonus{
		margin-bottom: 0px;
	}
	.buttonEntry{
		background-color: #27264e; 
		border: 2;
		border-color: lightsteelblue;
		color: white;
		padding: 4px 8px 4px 8px;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		cursor: pointer;
		font-size: 10px;
		border-radius: 15%;
	}
	.buttonLogin{
		background-color: #27264e; 
		border: 2;
		border-color: lightsteelblue;
		color: white;
		padding: 4px 8px 4px 8px;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		cursor: pointer;
		font-size: 15px;
		border-radius: 10%;
		height: 35px;
		width: 120px;
	}
	.buttonJoin{
		background-color: #ae1c28;
		border: 2;
		border-color: lightsteelblue;
		color: white;
		padding: 4px 8px 4px 8px;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		cursor: pointer;
		font-size: 15px;
		border-radius: 10%;
		height: 35px;
		width: 125px;
	}
	.trackEntry{
		width: 70px;
	}
	.raceEntry{
		width: 35px;
	}
	.priceEntry{
		width: 30px;
	}
	.GTEntry{
		width: 25px;
	}
	.opacityClear{
		opacity: 0;
	}
	.buttonViewTips{
		background-color: #27264e; 
		border: 2;
		border-color: lightsteelblue;
		color: white;
		padding: 4px 8px 4px 8px;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		cursor: pointer;
		font-size: 11px;
		font-weight: bold;
		border-radius: 10%;
	}
	.buttonViewTipsTop{
		background-color: #27264e; 
		border: 2;
		border-color: lightsteelblue;
		color: white;
		margin-top: 5px;
		padding: 1px 8px 1px 8px;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		cursor: pointer;
		font-size: 8px;
		font-weight: bold;
		border-radius: 10%;
	}
	#tipsLink {
		padding-top: 20px;
		margin-top: -20px;
	}
	.Tabimg {
		width: 60%;
		height: 14%;
		margin-left: 28px; 
		margin-right: -26px;
	}
	.SportsBetimg {
	width: 80%;
	height: 20%;
	}
	.Racenetimg {
	width: 75%;
	height: 17%;
	}
	.AboutUsTab {
     background-color:#ecf0f5;
	}
	.pointsFont{
		font-size: 9px;
	}
	.pointsFontDsk{
		font-size: 12px;
	}
	.pointsFontDsk1{
		font-size: 13px;
	}
	.pointsTotal{
		font-size: 11px;
		border-style: solid;
		border-color: #8696be;
		border-width: .5px 0px 0px 0px;
	}
	.pointsTotalDsk{
		font-size: 15px;
		border-style: solid;
		border-color: #8696be;
		border-width: 1px 0px 0px 0px;
	}
	.userUpdateHead{
		width: 110px!important;
		font-size: 14px;
		text-align: right;
	}
	.userUpdateDetail{
		width: 250px!important;
		font-size: 13px!important;
		padding-left: 10px!important;
	}
	.userReadDetail{
		width: 250px!important;
		font-size: 13px!important;
		padding-left: 10px!important;
		background-color: rgb(191, 194, 209)!important;
		font-style: italic!important;
	}
	.userUpdateError{
		width: 340px!important;
		font-size: 14px;
	}
	.userUpdateButton{
		width: 100px!important;
		font-size: 14px;
	}
	.calculationLink{
		color: rgb(140, 200, 240);
		text-decoration: underline;
	}
	.smallPrice{
		font-size: 7.5px; 
	}
	.smallPriceDesk{
		font-size: 10px; 
	}
	.trackLen{
		width: 65px!important;
		font-size: 11px;
	}
	.trackLen1{
		width: 65px!important;
		font-size: 11px;
	}
	.raceLen{
		width: 40px!important;
		font-size: 11px;
		font-weight: bold!important;
	}
	.raceLenMob{
		width: 15px!important;
	}
	.selectionsLen{
		width: 280px!important;
		font-size: 11px;
	}
	.selectionPad{
		padding-left:1px!important;
	}
	.selectionsMsg{
		width: 380px;
	}
	.selectionsMsg1{
		width: 373px;
	}
	.placing{
		background-color: #ccd7e9;
	}
	.placingBox{
		background-color: #a5bbdd;
		border-color: #27264e !important;
		border: 1px solid #d5d5e6;
	}
	.WS{
		margin-top: -3px;
		border-radius: 0px;
	}
    .nounderline{
		text-decoration: none !important;
	}
	/* The sticky class is added to the header with JS when it reaches its scroll position */
    .sticky {
	    position: fixed;
	    top: 0;
	    width: 100%
    }
	.weekColourLadderHighestDesk {
		padding-top:2px!important;
		padding-bottom:2px!important;
		padding-right:2px!important;
		padding-left:2px!important;
		border-radius:0px;
		background-color: #27264e;
		color:white;
		font-size: 15px;
		width: 930px;
	}
	ul.a {
		list-style-type: square;
		margin: 10px;
		padding: 0px;
		font-size: 11px;
	}
	.myMatesEntry{
		width: 70px;
	}
	.bold{
		font-weight: bold;
	}	
	.clearAllButton {
		background-color: white;
		color: grey;
		cursor: pointer;
		height: 25px;
		margin-top: 1px;
		margin-right: 0px;
		margin-bottom: 12px;
		margin-left: 0px;
		padding-top: 0px;
		padding-right: 5px;
		padding-bottom: 0px;
		padding-left: 5px;
		font-size: 12px;
		border-radius: 10px;
		outline: none;
	}
	.GTImageMob{
		margin-top: -8px;
		margin-right: 0px;
		margin-bottom: -10px;
		margin-left: 0px;
		border-radius: 0px;
	}
.weekLevelMob{
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 12px;
	border-radius: 6px;
	font-weight: bold;
	height: 30px;
}
.weekLevelMobSubmit{
	padding-top:1px!important;
	padding-bottom:1px!important;
	padding-right:1px!important;
	padding-left:1px!important;
	margin-bottom:0px!important;
	border-radius:0px;
	background-color: #27264e;
	color:white;
	font-size: 14px;
	border-radius: 6px;
	font-weight: bold;
	height: 25px;
	width: 70px;
}
.weekLevelNowMob{
	padding-top:2px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	border-radius:0px;
	background-color: #ae1c28;
	color:white;
	font-size: 14px;
	border-radius: 6px;
	font-weight: bold;
	height: 35px;
	width: 105px;
}
.weekLevelNowMobSubmit{
	padding-top:1px!important;
	padding-bottom:2px!important;
	padding-right:2px!important;
	padding-left:2px!important;
	margin-top:2px!important;
	border-radius:0px;
	background-color: #ae1c28;
	color:white;
	font-size: 14px;
	border-radius: 6px;
	font-weight: bold;
	height: 25px;
	width: 70px;
}
.weekLevelCurrentMob{
	font-size: 7px!important;
	font-weight: bold;
	width: 80px;
	height: 15px;
	color: #ae1c28;
}
.levelPositionMob{
	margin-left: -0px;
}	
.levelPositionAnchorMob{
    display: block;
	margin-top: -420px;
}
.footerMob{
	margin-left : -32px;
}
.myTipsLogo{
	margin-left: 15px;
}
/* ------------------------------------------------------ */
	/* Ipad */
	@media screen 
	and (min-device-width: 760px)
	and (max-device-width: 1200px)
	and (min-device-height: 760px)
	and (max-device-height: 1200px)
	and (-webkit-device-pixel-ratio : 2)
	{
	.menuIcon{
		width: 89%;
		padding-top: 2px; 
	}
	.w3-menuMain{
		margin-top: 10px;
		margin-bottom: 0px;
		margin-right: 120px;
		margin-left: 0px;
		border-top: 50px;
	}
	.w3-theme {
		color:#fff !important;
		background-color:#27264e !important;
	    width: 900px;
	}
	.myTipsLogo{
		margin-left: -50px;
		margin-right: 50px;
	}
	.menuImage{
		width: 76%;
	}
	.navFont{
		font-size: 15px;
	}
	.homeImage1{
		margin-left: 0px;
		width: 24%!important;
	}
	/* -- this checks specifically for landscape Ipad -- */
	@media screen 
	and (min-device-width: 1020px)
	and (max-device-width: 1200px)
	and (min-device-height: 760px)
	and (max-device-height: 900px)
	and (-webkit-device-pixel-ratio : 2){
		.w3-theme {
			color:#fff !important;
			background-color:#27264e !important;
			width: 100%;
		}
		.menuIcon{
			width: 100%!important;
			padding-top: 2px; 
		}
		.myTipsLogo{
			width: 27%!important;
			margin-left: 80px;
		}
		.homeImage1{
			margin-left: 170px;
			width: 17%!important;
		}
		.loginFont{
			font-size: 15px!important;
			margin-left: 290px;
		}
		.ipadHome{
			margin-left: 350px!important;
			width:100%!important;
		}
		.ipadMessage{
			margin-left: 300px!important;
			font-size: 30px!important;
		}
		.ipadMessageComp{
			margin-left: 298px!important;
			font-size: 20px!important;
		}
		.levelPositionAnchorMob{
			display: block;
			margin-left: 70px!important;
		}
	}
	.w3-theme {
		color:#fff !important;
		background-color:#27264e !important;
		width: 100%;
	}
	.copyWidth{
		width: 460px!important;
		font-size: 15px!important;
	}
	.loginWidth{
		width: 250px!important;
		font-size: 15px!important;
	}
	.loginColor{
		color:rgb(140, 200, 240);
		margin-right: 160px;
	}
	.loginFont{
		font-size: 15px!important;
	}
	.ipadHome{
		margin-left: 200px;
		width:50%!important;
	}
	.levelPositionMob{
		margin-left: 0px;
	}
	.levelPositionAnchorMob{
		display: block;
		margin-top: -600px;
	}
	.weekLevelMob{
		padding-top:2px!important;
		padding-bottom:2px!important;
		padding-right:2px!important;
		padding-left:2px!important;
		border-radius:0px;
		background-color: #27264e;
		color:white;
		font-size: 20px;
		border-radius: 6px;
		font-weight: bold;
		height: 50px;
	}
	.weekLevelNowMob{
		padding-top:2px!important;
		padding-bottom:2px!important;
		padding-right:2px!important;
		padding-left:2px!important;
		border-radius:0px;
		background-color: #ae1c28;
		color:white;
		font-size: 24px;
		border-radius: 6px;
		font-weight: bold;
		height: 50px;
		width: 100px;
	}
	.weekLevelMobSubmit{
		padding-top:1px!important;
		padding-bottom:1px!important;
		padding-right:1px!important;
		padding-left:1px!important;
		margin-bottom:0px!important;
		border-radius:0px;
		background-color: #27264e;
		color:white;
		font-size: 14px;
		border-radius: 6px;
		font-weight: bold;
		height: 25px;
		width: 90px;
	}
	.weekLevelNowMobSubmit{
		padding-top:1px!important;
		padding-bottom:2px!important;
		padding-right:2px!important;
		padding-left:2px!important;
		margin-top:2px!important;
		border-radius:0px;
		background-color: #ae1c28;
		color:white;
		font-size: 14px;
		border-radius: 6px;
		font-weight: bold;
		height: 25px;
		width: 70px;
	}
	.weekLevelCurrentMob{
		font-size: 11px!important;
		font-weight: bold;
		width: 80px;
		height: 35px;
		color: #ae1c28;
	}
	.ipadMessage{
		margin-left: 190px;
		font-size: 30px!important;
	}
	.ipadMessageComp{
		margin-left: 178px;
		font-size: 20px!important;
	}
	.currentWeekFont{
		font-size: 11px!important;
		margin-top: -1px;
		margin-bottom: -1px;
		border-top: -1px;
		border-bottom: -1px;
	}
	}
	/*-- Ipad end --*/
/* ---------------------- end of smaller mobile ------------------------- */	
