body.mobile, html .mobile {
    font-size: 12px!important;
}

.chart_title_container {
  	border-bottom: none;
  	margin-bottom: 0;
  	margin-top: 0;
  	height: auto;
}

.chart_title {
	
	font-size: 18px;
  	font-weight: bold;
  	font-family: Magistral;
  	margin-top: 12px;
  	text-transform: uppercase;
}

#toolTip {
	font-size: 15px;
}

.mobile .toolTip {font-size: 15px; height: 102px; width: 140px;margin-top: -3px; }

#toolTip #count {
	border-radius: 15px;
	font-size: 15px;
	font-weight: bold;
	padding-left: 5px;
	padding-right: 5px;
	width: auto;
}
.viewChart {
	color: #888888;
    cursor: pointer;
    display: inline;
    font-size: 16px;
    margin-left: 10px;
}

.viewChart:hover { 
	color: #0099cc;
	text-decoration: underline;
}

.mobile .viewChart {
	margin-left: 0px;
	margin-top: 15px;
	
}

#toolTip #max,
#toolTip #min,
#toolTip #avg {
	font-size: 20px;
	padding-left: 10px;
	text-align: right;
	width: 65px;
}
.svg-graph text[fill="#555"] {font-size: 18px; font-weight:bold;}

.mobile #toolTip #max,
.mobile #toolTip #min,
.mobile #toolTip #avg {font-size: 20px; }

.avg {display: inline-flex;line-height: 37px; }
.avg > span {width: 60px; }


.mobile .avg {line-height: 26px; }
.mobile .avg > span {width: 65px; display:inline-block;}

hr {margin: 10px 0; border-color:#000;}
.mobile hr {margin: 4px 0; }

.chart_title_container .buttonGroup { 
    padding-bottom: 10px;
    text-align: right;
    float: right;
}

.mobile .buttonGroup { width: 100%; text-align: center; border-bottom: medium none; margin-bottom: 0; padding-bottom: 0; position: relative; float: none;}

.button {
	/*background-color: #0099FF;*/
	color: #fff;
	padding: 7px;
	text-align: center;
}
.mobile .button{
	border-radius: 4px;
    display: inline-block;
    margin-top: 10px;
    width: 90px;
}

.selected {background-color: #0033cc; }
.button:hover {background-color: #2da0ce; }
.title {float: left;font-size: 25px;}
.column {cursor: pointer; -webkit-tap-highlight-color: rgba(201, 224, 253, 0.8)!important; opacity:0.88; }

.mobile svg {cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}

.loading {
	background-image: url('/images/loading_icon.gif')!important;
	background-size: 96px 16px;
	background-repeat:no-repeat !important;
	background-position:50% 50% !important;
	margin:0px;padding:0px;
	display: inline-block!important;
}

.message {
	width:100%;
	text-align:center;
	padding-top:200px;
	color: #CCC;
	text-shadow: 1px 1px 1px #fff;
	font-size: 20px;
}

.dropButton {
	border: 1px solid #0099cc;
    border-radius: 3px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3) inset;
    color: #0099cc;
    cursor: pointer;
    display: inline-block;
    font-family: Arial,sans-serif;
    height: 18px;
    line-height: 18px;
    margin-left: 5px;
    padding: 5px 10px;
    text-align: left;
    width: 71px;
}

.dropArrow {
	background-image: url("/images/icons/drop_blue.png");
    background-position: 100% 50%;
    background-repeat: no-repeat;
    background-size: 10px auto;
    display: inline-block !important;
    float: right;
    height: 14px;
    margin: 2px 0 0;
    padding: 0;
    width: 10px;
}

.disable {color: #bbb; cursor: unset; border: 1px solid #bbb; }
.disable:hover {border: 1px solid #bbb; background-color: #fff!important;color:#bbb!important;}
.disableArrow{ background-image: url("/images/icons/drop_grey.png"); }

.path {stroke-array: 1; }
.dash_path {stroke-array: 1; stroke-dasharray: 6; }
.avg_path {stroke-array: 2; }

#fairwayChart {width: 90%; height: 600px; margin: 0 auto;position: relative; text-align: center;}
#approachChart {width: 570px; height: 570px; margin: 0 auto;position: relative; text-align: center;}

svg image:nth-child(n+4) {
	cursor: pointer;
}

.dropBox {
	background-color: #fff;
    border: 1px solid #bbb;
	border-top: 3px solid #09c;
    display: none;
    position: absolute;
    text-align: center;
    z-index: 9999;
	overflow-x: hidden;
	overflow-y: auto;
	padding: 10px;
	height: auto;
	max-height: 320px;
}

.dropButton:hover {background-color: #09c; color: #fff;}

.dropButton:hover .dropArrow {
    background-image: url("/images/icons/drop_white.png");
}

#holeBox {width: 267px;}
#clubBox {width: 197px; }
#dateBox {width: 84px;}
#courseBox  {width: 301px;}

.dropBox .selected {color: #fff!important; background-color: #0099cc; border: 1px solid #0099cc; }

.unsetHole {
	padding: 5px;
	width: 223px;
	cursor: pointer;
	text-align: center;
	cursor: pointer;
	display: inline-table !important;
}

#clubBox .items {width: 150px;}
.selectHole {width: 100px;}
.selectDate {width: 55px; text-align: center!important;}
#courseBox .items {width: 260px; height: 30px!important; margin: 10px 0px 0px 0px!important;}
#courseBox .items span {float: right;	padding-top: 6px; }

#clubBox .items span,
#holeBox .items span {
	float: right;
    padding: 0px;
}

.dropBox .items {
	border: 1px solid #0099cc;
    border-radius: 5px;
    display: inline-table;
    height: 16px;
    margin: 10px 0px 0 2px;
    padding: 10px;
    text-align: left;
    cursor: pointer;
	color: #0099cc ;
}

.dropBox .items:hover {background-color: #ccc; }

.dropBox .items div {display: table-cell; vertical-align: middle; max-width: 200px}

#shotDescription {
	background-color: #ccc;
    border: 1px solid #ccc;
    border-radius: 6px;
    display: none;
    height: auto;
    position: absolute;
    width: 230px;
	padding: 1px;
	z-index: 99;
}

#shotDescription #course {
	box-sizing: border-box;
    display: inline-table;
    font-weight: bold;
    height: 15px;
    line-height: 15px;
    padding: 5px;
    text-align: center;
    width: 100%;
}

#shotDescription .inner {
	background-color: #fff;
	border-radius: 5px;
	padding: 5px;
}

#shotDescription .inner .group1 {
	display: inline-block;
    min-width: 100px;
    padding: 5px 0;
    width: 100%;
	border-bottom: 2px solid #ccc;
	color: #0099cc ;
}
#shotDescription .inner .group1 #hole,
#shotDescription .inner .group1 #par {
	float: left;
    text-align: center;
    width: 33%;
}

#shotDescription .inner .group1 #date {
	width: 34%;
	float: left;
    text-align: center;
}

#shotDescription .inner .group2 {
	width: 50%;
	float: left;
	text-align: center;
	padding: 5px 0;
}

#numShots {
	color: #0099cc;
	text-align: left;
    font-size: 15px;
    margin-left: 5px;
    padding-top: 15px;
	float: left;
}

.floatRight {
	float: right;
}

#shotDescription .inner .group3 {
	width: 100%;
	text-align: center;
	padding-bottom: 5px;
}

#aimPointText, #aimPointTextY {
    float: left;
    padding-top: 1px;
}

#aimPointIcon, #aimPointIconY {
	float: left;
    padding-right: 2px;
    padding-top: 0;
}

.bigSize {font-size: 35px!important;}
.red-10 {font-size: 10px!important; fill: red; color: red;}
.red-20 {font-size: 20px!important; fill: red; color: red;}
.red-30 {font-size: 30px!important; fill: red; color: red;}
.grey-30 {font-size: 30px!important; fill: #555; color: #555;}
.green-30 {font-size: 30px!important; fill: green; color: green;}
.green-20 {font-size: 20px!important; fill: green; color: green; }

.xAxisLabels,
.yAxisLabels,
.grey-20 { font-size: 20px!important; fill: #555; color: #555; }
.grey-15 { font-size: 15px!important; fill: #555; color: #555; }
.white-15 { font-size: 15px!important; fill: #fff; color: #fff;font-weight:bold; }

.graphArea {width: 100%; min-height:300px!important; height: 630px; position:relative;}
.axis {width:100%; text-align: center; display: none; color: green; }
#score {cursor: pointer; }
#viewOption {display: none;}

#legendTop,
#legendTop_ {display: inline-flex; justify-content: center; width: 100%; text-align:center; padding-bottom: 15px}
#legendTop_ {margin-top: 40px;}

#legendBottom {display: inline-block; width: 100%; text-align:center; padding-top: 15px; margin-bottom: 20px;}
#legendLeft {width: 180px; text-align:center; height: 225px; padding-top:225px; float: left;}
#legendRight {width: 180px; text-align:center; height: 225px; padding-top:225px;  float: right; }

#subLegendTop {
    display: none;
    height: 62px;
    position: absolute;
    text-align: center;
    width: 550px;
	font-size: 30px;
	color: red;
}

#subLegendMiddle {
    display: none;
    height: 62px;
    position: absolute;
    text-align: center;
    width: 550px;
	font-size: 30px;
	color: red;
	top: 245px;
}

#subLegendBottom {
    display: none;
    height: 62px;
    position: absolute;
    text-align: center;
    width: 550px;
	font-size: 26px;
	color: red;
	top: 490px;
}


#subLegendTop .stat,
#subLegendMiddle .stat,
#subLegendBottom .stat,
#approachChart .stat {
    padding-top: 11px;
    width: 62px;
	text-align: center;
	position: absolute;
	color: red;
    font-size: 26px;
	height: 50px;
	margin-left: 10px;
    margin-top: 10px;
}

#approachChart .longLeft,
#approachChart .left,
#approachChart .shortLeft {
	left: 0;
}

#approachChart .shortLeft {
	bottom: 0;
}

#approachChart .long,
#approachChart .short {
	left:245px;
}
#approachChart .longRight,
#approachChart .right,
#approachChart .shortRight {
	right:8px;
}

#approachChart .left,
#approachChart .right {
	top: 245px;
}

#approachChart .shortLeft,
#approachChart .shortRight,
#approachChart .short {
	bottom: 6px;
}

#offGrid {
	width: 100%;
	position: absolute;
	bottom: -10px;
}

.borderTopBottom {/*margin: 0 145px; */display: inline-block; width: 100%; text-align:center; height: 40px;background-color: #aac005;}
.borderTopBottom .innerLabel {width: 159px; display:inline-block; font-size: 20px; padding: 10px; color:#333;}
.borderTopBottom .innerLabelB {width: 159px; display:inline-block; font-size: 20px; padding: 4px 10px;color:#333;}

.borderLeft,
.borderRight {
	width: 40px; 
	height: 570px; 
	background-color: #aac005; 
	font-size: 20px; 
	color:#333;
}
.borderLeft { float: left;/* margin-left: 145px;*/}
.borderRight { float: right;/* margin-right: 145px;*/}
.borderLeft .innerLabel {
	-webkit-transform: rotate(-90deg); 
	-moz-transform: rotate(-90deg);    
	transform:rotate(-90deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	margin-top: 260px;
    text-align: center;
}

.borderRight .innerLabel {
	-webkit-transform: rotate(90deg); 
	-moz-transform: rotate(90deg);    
	transform:rotate(90deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
	margin-top: 260px;
    text-align: center;
}

#shotDescription #course {
	background-image: url("/images/icons/close.png");
    background-position: right center;
    background-repeat: no-repeat;
    background-size: 17px auto;
	cursor: pointer;
}
	
#legendTop .legend {display: inline-block; width: 170px; text-align:center;}

.mobile #viewOption {
	background-color: #8e908f;
    background-image: url("/images/icons/drop_white.png");
    background-position: 50% 96%;
    background-repeat: no-repeat;
    border: 1px solid #ccc;
    border-radius: 0 0 5px 5px;
    color: #fff;
    display: inline-block;
    height: 40px;
    padding: 8px;
    position: absolute;
    width: auto;
    z-index: 9999;
	
}

.mobile .dropButton {
	margin: 10px 3px;
	box-sizing: content-box!important;
	height: 25px;
	line-height: 25px;
	background-color: #fff;
}

.mobile .dropButton:hover {
	background-color: #09c; color: #fff;
}
.mobile .dropArrow {margin: 5px 0 0; }

.mobile .dropBox .items {
	box-sizing: content-box!important;
	margin: 10px 5px 0 5px;
	padding: 10px;
}

.mobile #dateBox {width: 130px; }
.mobile #clubBox {width: 206px; overflow-x: hidden; overflow-y: auto; }
.mobile #courseBox {width: 305px; }
.mobile #holeBox { width: 286px; }


.mobile .unsetCourse {width: 257px; }
.mobile .unsetClub {width: 151px; }
.mobile .selectDate {width: 70px; }
.mobile .unsetHole {width: 231px; }

.mobile #shotDescription #course {height: 25px; }

.mobile #numShots {
	display: inline-block;
    text-align: center;
    width: 100%;
	margin-top: 0px;
	margin-left: 0px;
	float: none;
}

#sg360_tabs_container .groupHeader {width: 100%!important; display: inline-block;border-bottom: 1px dotted #666666;}
.mobile .groupHeader {height: auto; }
#subHeader {color: #000;padding: 15px 0px;text-align: right; }
#subHeader div {display: inline-block; }

#subHeader .filter,
#subHeader .filterDefault {
	color: #666;
    cursor: pointer;
    display: inline-block;
    margin-right: 5px;
	padding-left: 5px;
    width: auto;
}

#subHeader .filterDefault {
	font-size: 13px;
    font-weight: bold;
    position: relative;
	cursor: revert;
}

.mobile #subHeader .filterDefault {
	font-weight: 500;
}

.mobile #subHeader {
	text-align: left!important;
	border: 0px solid #cccccc!important;
	font-size: 13px!important;
	font-weight: normal!important;
	width: 100%; 
	color: #0099cc ; 
	padding: 0px;
	margin-bottom: 0px;
	overflow-x: auto;
	min-height: 21px;
}

#legend {width: 100%; text-align: center; margin: 20px 0px;}
#legend .block {
	display: inline-block;
	width: 15%;
}

#clubsList {
	padding: 10px;
	font-size: 16px;
	display: none;
}
#clubsList .header {
	width: 100%;
	display: inline-block;
	font-size: 18px;
}
#clubsList .chk {
	width: 5%;
	display: inline-block;
}
#clubsList .date {
	width: 10%;
	display: inline-block;
}
#clubsList .course {
	width: 40%;
	display: inline-block;
}
#clubsList .hole {
	width: 8%;
	display: inline-block;
	text-align: center;
}
#clubsList .club {
	width: 10%;
	display: inline-block;
	text-align: center;
}
#clubsList .distance {
	width: 12%;
	display: inline-block;
	text-align: center;
}
#clubsList .viewShot {
	width: 15%;
	display: inline-block;
}

@media only screen and (max-height : 640px) {
	.mobile .graphArea {height: 300px;}
	.mobile .axis {width:100%; text-align: center; display: inline-block;}
}
@media only screen and (min-height : 650px) {
	.mobile .graphArea {height: 500px;}
}


.mobile #fairwayChart {
	height: 100%;
	width: 98%; 
	max-width: 846px;
}


.mobile #maincontentarea {
    background: #fff!important;
}

#bodyContent {
	width: 100%;
}

#bodyContent #innerContent {
	width: 650px;
	margin: 0 auto;
	background-color: #aac005;
	margin: 0 auto 50px;
}

#targetChart {
/*
	width: 456px;
	height: 456px;
*/
	width: 686px;
	height: 686px;
	margin: 0 auto 30px;
}


.mobile #legendTop {
    padding-bottom: 15px;
    display: -webkit-flex; /* Safari */
    -webkit-align-items: top; /* Safari 7.0+ */
    display: flex;
    align-items: center;
	margin: 0 auto;
}
.mobile #legendBottom {margin-bottom: 20px;}

.mobile .selectCourse, 
.mobile .optionButton {
	display: inline-table!important;
	background-color: #fff!important;
}

/** smarttags changes **/
#shotDescription.shotDetailsActive {
	width: 650px;
}
#shotDescription.shotDetailsActive .inner_container {
	display: flex;
	height: 455px
}
#shotDescription.shotDetailsActive .inner_container-left { 
	width: 330px;
	padding-top: 20px;
}
#shotDescription.shotDetailsActive .inner_container-left .group_exclude-shot {
	display: none;
}
#shotDescription.shotDetailsActive.minShotDetails .inner_container { 
	height: 285px;
}
#shotDescription.shotDetailsActive .inner_container-right {
	width: 330px;
  border-left: 1px solid #ccc;
  padding-left: 15px;
}

#shotDescription #shotDetails .statClass .groupStat {
	display: inline-flex;
	flex-direction: column;
	width: 100%;
	padding-left: 3%;
	line-height: 30px;
	font-size: 12px;
	text-align: left;
}
#shotDescription #shotDetails .statClass .groupStatVal {
		float: right;
		padding-right: 10px;
		font-weight: bold;
}

#shotDescription #shotDetails .shotStatTypes .title {
  border-bottom: 1px solid #4e4e4e;
  cursor: pointer;
  font-size: 15px;
  padding-top: 20px;
	padding-bottom: 5px;
  text-align: left;
	width: 100%;
}
#shotDescription #shotDetails .shotStatTypes {
	height: 400px;
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 8px;
	/*scrollbar-width:thin;
	scrollbar-color: #0678b7 #fff;*/
}
#shotDescription.minShotDetails #shotDetails .shotStatTypes {
	height: 220px;
}
#shotDescription #shotDetails .shotStatTypes .title::after{
  content: '';
  background-color: #000;
  width: 12px;
  height: 12px;
  padding-right: 0;
  left: 6px;
  position: relative;
  display: block;
  float: right;
  top: 6px;
  padding-left: 3px;
}
#shotDescription #shotDetails .shotStatTypes .title::after{
  -webkit-clip-path: polygon(0 0, 0 100%, 75% 50%);
  clip-path: polygon(0 0, 0 100%, 75% 50%);
}
#shotDescription #shotDetails .shotStatTypes .title.open::after{
  -webkit-clip-path: polygon(100% 0, 0 0, 50% 75%);
   clip-path: polygon(100% 0, 0 0, 50% 75%);
}
#shotDescription #shotDetails .shotLinkContainer {
	margin: 0 auto;
  display: inline-block;
}
#shotDescription #shotDetails .button3D {
	background:url('/images/skypro/skypro-3d-swing.png') right no-repeat;
	background-size: 40px;
	background-position-x:90%;
	background-position-y:-1px;	
	width: 130px;
	margin-top: 10px;
	padding: 12px;
	border: 1px solid #ccc;
	cursor: pointer;
}
#shotDescription #shotDetails .button3D .button3Dtxt {
	padding-right: 40px;
	font-weight: bold;
}
#shotDescription .group_exclude-shot label {
	font-size: 13px;
	border-top: 1px solid #ccc;
}
#shotDescription .group_exclude-shot input {
 margin-top: 13px;
 margin-right: 6px;
}
#supertags_content,
#pendingswing_content {
	background-color: rgba(0, 0, 0, 0.8);
	border: 2px solid #000;
	border-radius: 10px;
	box-sizing: content-box !important;
	color: #ececec;
	display: none;
	position: absolute;
	text-align: center;
	width: 650px;
	z-index: 99999;
	text-align: left;
}
#pendingswing_content {
	width: 360px;
}
#pendingswing_content p {
	padding: 0px 20px 0px 20px;
}
#supertags_content .container {width: unset;margin-top: -14px;}
#pendingswing_content .container {width: unset;}
#supertags_content #content {min-height: unset;margin: unset;}
#pendingswing_content #content {min-height: unset;margin: unset;}
#supertags_content .st-container {
display: flex;
margin-bottom: 18px;
}
#supertags_content .st-container .st-container_el{
width: 50%;
margin: 0 0 0 15px;
}
#supertags_content .st-left {
background-color: #fff;
color: #000;
padding-left: 20px;
}
#supertags_content .st-right {
padding-left: 16px;
}
#supertags_content .st-tag-line,
#supertags_content .st-header {
text-align: center;
font-weight: bold;
}
#supertags_content .st-header {
font-size: 20px;
}
#supertags_content .closeIcon {
	background-image: url("/images/icons/close_white.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 10px 10px;
    border: 1px solid #fff;
    border-radius: 13px;
    cursor: pointer;
    height: 20px;
    position: absolute;
    right: 5px;
    top: 10px;
    width: 20px;
    z-index: 99;
	box-shadow: 0 1px 6px #000;
}
#supertags_content .closeIcon:hover {
	border: 2px solid #e6740f;
	background-image: url("/images/icons/close_orange.png");
}

.mobile #top-header .btnBack {
    position: fixed;
    top: 55px;
    top: calc(constant(safe-area-inset-top) + 55px);
    top: calc(env(safe-area-inset-top) + 55px);
    right: 105px;
    z-index: 999;
    width: 76px;
    padding: 8px 10px;
    text-align: right;
}

#filterBox {
	height:345px!important;
	width:580px;
}

#filterBox.approachFilter {
	height:375px!important;
}

.mobile #filterBox {
	height:325px!important;
    width: 100%;
}

.mobile #filterBox.approachFilter {
	height:355px!important;
}

.mobile #filterBox select {
    width: 175px;
}

.mobile .form-select::after {
	right: 10px!important;
}

.mt-10 {
	margin-top: 10px;
}

.padding-10 {
	padding: 10px;
}

.mobile .form-radio-button {
    width: 22px !important;
}

@media only screen and (min-width : 600px) {
	.mobile #bodyContent #innerContent {
		width: 600px;
		margin: 0 auto;
	}
	.mobile #legendTop {width: 600px;}
	.mobile .legend {
		width: 140px!important;
		height: 100px!important;
	}
	.mobile #viewOption{display: none;}
	.mobile #approachChart {height: 520px; width: 520px;}
	.mobile .borderLeft, 
	.mobile .borderRight {
		height: 520px;
	}
	.mobile #approachChart .long, 
	.mobile #approachChart .short {
		left: 220px;
	}
	.mobile #approachChart .left, 
	.mobile #approachChart .right {
		top: 223px;
	}
	.mobile #approachChart .shortLeft, 
	.mobile #approachChart .shortRight, 
	.mobile #approachChart .short {
		bottom: 10px;
	}
	.mobile #subLegendTop .stat, 
	.mobile #subLegendMiddle .stat, 
	.mobile #subLegendBottom .stat, 
	.mobile #approachChart .stat {
		width: 55px;
	}
	
	.mobile #clubsList .course {width: 38%;}
}

@media only screen and (max-width : 500px) {
	.mobile #bodyContent #innerContent {
		width: 100%;
		margin: 0 auto;
	}
	.mobile #legendTop {
		display: inline-block;
	}
	.mobile #shotDescription {position: fixed;}
	
	.mobile .width_60 {width: 60px!important;}
	.mobile .width_70 {width: 70px!important;}
	
	.red-30 {font-size: 15px!important; fill: red;	}
	.green-30 {font-size: 15px!important; fill: green; }
	.grey-30 {font-size: 15px!important; fill: #555; color: #555;}
	.green-20 {font-size: 10px!important; fill: green; } 
	.red-20 {font-size: 10px!important; fill: red;	}
	.grey-15 { font-size: 8px!important; fill: #555; color: #555; }
	.white-15 { font-size: 8px!important; fill: #fff; color: #fff; }
	.xAxisLabels, .yAxisLabels,.grey-20 {font-size: 10px!important; fill: #555; }

	.borderTopBottom {
		background-color: #aac005;
		display: inline-block;
		height: 25px;
		margin: 0px 32px;
		text-align: center;
		width: calc(100% - 64px);
	}
	.borderTopBottom .innerLabel,
	.borderTopBottom .innerLabelB {
		font-size: 12px;
		width: 31%;
	}
	
	.borderLeft {
		float: left;
		margin-left: 0px;
	}
	.borderRight {
		float: right;
		margin-right: 0px;
	}
	.borderLeft, .borderRight {
		background-color: #aac005;
		font-size: 12px;
		height: 270px;
		width: 25px;
	}
	.borderLeft .innerLabel,
	.borderRight .innerLabel	{
		margin-top: 157px;
	}
	#subLegendTop .stat, #subLegendMiddle .stat, #subLegendBottom .stat, #approachChart .stat {
		color: red;
		font-size: 12px;
		height: 21px;
		margin-left: 10px;
		margin-top: 10px;
		padding-top: 0px;
		width: 21px;
	}
	#approachChart .left, #approachChart .right {
		top: 44%;
	}
	#approachChart .long, #approachChart .short {
		left: 44%;
	}
	.mobile .dropButton {width: auto; padding: 2px 7px; font-size: 11px; margin: 5px 1px;}
	.mobile .dropArrow {background-size: 80% auto;}
	.mobile .selectCourse {width: 245px;}
	.mobile .dropBox .items {margin: 10px 5px 0;}
	.mobile .unsetCourse {width: 243px;}
	
	.mobile #approachChart {height: 270px; width: 270px;}
	.mobile #legendLeft, 
	.mobile #legendRight {width: 50px; height: 110px; padding-top:110px;}
	
	.mobile #targetChart {
	/*
		width: 289px;
		height: 289px;
	*/	
		width: 324px;
		height: 324px;
		margin: 0 auto 30px;
	}
	.mobile #clubsList .header {
		font-size: 12px;
		font-weight: bold;
	}
	.mobile #clubsList {
		font-size: 11px;
		padding: 0;
	}
	.mobile #clubsList .date {width: 15%;}
	.mobile #clubsList .course {width: 31%;}
	.mobile .clubsList .button {width: 30px;min-width: 30px;padding: 1px;}
	.mobile .clubsList > div {height:50px; display: flex;}
	.mobile .viewChart {font-size: 12px;}
	.mobile .axis {display: none;}
}