.trackBck {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #000;
	background-color: rgba(0,0,0,0.7);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: auto;
	overflow-scrolling: touch;
	-webkit-overflow-scrolling: touch;
}

.trackCardCont {
	width: 67vw;
	height: 42vw;
	background-color: #fff;
	display: flex;
	flex-direction: column;
}

.trackCardPhoto {
	flex: 0 0 13.44vw;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
}

.trackCardMainEvalCont {
	background-image: linear-gradient(70deg, var(--index-gradient_from), var(--index-gradient_to));
	position: absolute;
	bottom: 0;
	left: 3vw;
	width: 17vw;
	height: 4vw;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}

.trackCardMainEvalTxt {
	font-size: 0.8vw;
	letter-spacing: 0.06vw;
	color: #fff;
	font-weight: normal;
	margin: 0 0.8vw 0 0;
	padding: 0.3vw 0 0 0;
}

.trackCardMainEvalNbr {
	font-size: 1.8vw;
	font-weight: bolder;
	color: #fff;
	margin: 0 0.3vw 0 0;
	padding: 0.3vw 0 0 0;
}

.trackCardMainEvalPct {
	font-size: 1vw;
	font-weight: bolder;
	color: #fff;
	padding: 0 0 0.6vw 0.2vw;
}

.trackCardBottomCont {
	flex: 0 0 28.56vw;
	display: flex;
	flex-direction: row;
}

.trackCardBottomLeftCont {
	flex: 0 0 37%;
	display: flex;
	flex-direction: column;
	padding: 0 4.8vw 0 3vw;
	height: 28.56vw;
	background-color: #fff;
}

.trackCardEvalsCont {
	padding: 0 2vw 1vw;
	display: flex;
	flex-direction: column;
}

.trackCardEvalCont {
	border-bottom: solid 1px #f5f5f5;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 1vw 0;
	justify-content: space-between;
}

.trackCardEvalHead {
	font-weight: bolder;
	font-size: 0.7vw;
	color: #afafaf;
	letter-spacing: 0.11vw;
	width: 6vw;
	padding: 0.12vw 0 0 0;
}

.trackCardEvalStars {
	width: 6vw;
	display: block
}

.trackCardNoBorder {
	border: none;
}

.trackCardBottomRightCont {
	flex: 0 0 63%;
	display: flex;
	flex-direction: column;
	position: relative;
	padding: 2.5vw 3vw 2vw 1vw;
	overflow-x: hidden;
	overflow-y: auto;
	height: 28.56vw;
	background-color: #fff;
}

.trackCardBottomRightCont .dlg_close_cont {
	top: 0.5vw;
	right: 1vw;
}

.trackCardName {
	font-size: 1.8vw;
	font-weight: bolder;
	color: var(--login-very-dark-gray);
}

.trackCardRegion {
	color: #afafaf;
	font-weight: normal;
	font-size: 0.9vw;
	padding: 0.8vw 0 0 0;
}

.trackCardSep1 {
	background-image: linear-gradient(70deg, var(--index-gradient_from), var(--index-gradient_to));
	width: 1.2vw;
	height: 0.15vw;
	min-height: 2px;
	margin: 1.5vw 0 0 0;
	flex-grow: 0;
	flex-shrink: 0;
}

.trackCardTextCont {
	color: var(--login-very-dark-gray);
	font-size: 0.9vw;
	margin: 1.5vw 0 0 0;
	line-height: 1.5vw;
	flex-grow: 0;
	flex-shrink: 0;
}

.trackCardBuyButts {
	display: flex;
	flex-direction: row;
	margin: 2vw 0 0 0;
	height: 2.68vw;
	flex: 0 0 2.68vw;
}

.trackCardCreditHelp {
	color: #afafaf;
	font-weight: normal;
	font-size: 0.7vw;
	padding: 0.5vw 0 0 1.3vw;
}

.trackCardSep2 {
	background-color: var(--border-gray-color);
	height: 1px;
	margin: 1vw 0 0 0;
	flex-grow: 0;
	flex-shrink: 0;
}

.trackCardVoucherCont {
	display: flex;
	flex-direction: row;
	height: 2vw;
	flex: 0 0 2vw;
	margin: 1vw 0 0 0;
	align-items: center;
}

.trackCardVoucherQ {
	color: var(--login-dark-gray);
	font-size: 0.8vw;
	cursor: pointer;
}

.trackCardVoucherA {
	color: var(--blue-text-color);
	font-size: 0.8vw;
	margin: 0 0 0 0.5vw;
	cursor: pointer;
}

.trackCardTitle2 {
	font-size: 1.4vw;
	font-weight: bold;
	color: var(--login-very-dark-gray);
	margin: 2vw 0 0 0;
}

.trackCardContent {
	display: flex;
	flex-direction: column;
	margin: 2.3vw 0 2.3vw 0;
}

.trackCardRowCont {
	display: flex;
	flex-direction: row;
	height: 12.4vw;
	flex: 0 0 12.4vw;
}

.trackCardRowContBorder {
	border-bottom: solid 1px #fbfbfb;
}

.trackCardContentButt {
	display: flex;
	flex-direction: column;
	height: 12.4vw;
	flex: 0 0 12.4vw;
	align-items: center;
	position: relative;
	justify-content: space-around;
}

.trackCardContentButtBorder {
	border-right: solid 1px #fbfbfb;
}


.trackCardContentButtIcon {
	height: 2.5vw;
	display: block;
}

.trackCardContentButtText {
	text-align: center;
	font-size: 0.8vw;
	color: #afafaf;
	font-weight: bolder;
	/* margin: 1vw 0 0 0; */
	width: 9vw;
}

.trackCardStatCont {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	margin: 1.5vw 0 0 0;
}

.track_len_icon {
	flex: 0 0 4vw;
	width: 4vw;
	height: 4vw;
	/* margin: auto 0 auto 0; */
	cursor: default;
	background-image: url("../images/track_len_icon.svg");
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}

.trackCardStatTxt {
	font-weight: bold;
	font-size: 2vw;
	/* height: 4vw; */
	/* line-height: 4vw; */
	color: var(--blue-text-color);
	margin: 0 0 0 2vw;
	white-space: nowrap;
}

.trackCardStatDesc {
	font-weight: normal;
	font-size: 1vw;
	/* height: 4vw; */
	/* line-height: 4vw; */
	color: var(--blue-text-color);
	margin: 0 0 0 0.4vw;
}

.trackCardChecksCont {
	display: flex;
	flex-direction: column;
	margin: 1vw 0 0 0;
}

.scroll_down_icon {
	flex: 0 0 2vw;
	width: 2vw;
	height: 2vw;
	margin: 0 0 0 5vw;
	padding: 0;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	cursor: pointer;
	background-image: url("../images/scroll_down_icon.svg");
}

.scroll_down_icon:hover {
	background-image: url("../images/scroll_down_icon_hover.svg");
}

.trackCardRowFlexCont {
	display: flex;
	flex-direction: row;
	flex-grow: 0;
	flex-shrink: 0;
}

.trackCardFcstsCont {
	justify-content: space-between;
}

.trackCardFcstCont {
	display: flex;
	flex-direction: column;
	background-color: #fff;
	border: solid 1px #000;
	color: #000;
	text-align: center;
	padding: 0.5vw 0.8vw;
	/* height: 9vw; */
	margin: 0.5vw 0 0 0;
	flex-grow: 0;
	flex-shrink: 0;
}

.trackCardFcstDay {
	font-weight: bold;
	font-size: 0.9vw;
}

.trackCardFcstIcon {
	flex-frow: 0;
	flex-shrink: 0;
	display: block;
}

.trackCardFcstTemp {
	height: 1vw;	
	font-size: 0.7vw;
}

.trackCardFcstWind {
	height: 1vw;	
	font-size: 0.7vw;
}

.trackCardFcstPress {
	height: 1vw;	
	font-size: 0.7vw;
}

.trackCardFcstRain {
	height: 1vw;	
	font-size: 0.7vw;
}

.trackCardGeoattribsCont {
	justify-content: space-between;
}

.trackCardVertProfile {
	margin: 0 0.5vw 0.5vw 0;
	display: block;
	height: 16vw;	
	width: 20vw;
	flex-shrink: 0;
	flex-grow: 0;
}

.trackCardGeoAttribs {
	display: flex;
	flex-direction: column;
	/* width: 23vw; */
	margin: 0 0 0.5vw 0;
	flex-shrink: 0;
	flex-grow: 0;
}

.trackCardGeoRowCont {
	display: flex;
	flex-direction: row;
	margin: 0 0 0.3vw 0;
}

.trackCardGeoRowSep {
	height: 1px;
	flex: 0 0 1px;
	background-color: var(--border-gray-color);
	margin: 0 0 0.4vw 0;
}

.trackCardGeoHead {
	font-weight: bolder;
	font-size: 0.7vw;
	color: #afafaf;
	letter-spacing: 0.11vw;
	width: 7vw;
	padding: 0.12vw 0 0 0;
}

.trackCardPreviewMap {
	height: 20vw;
	flex-shrink: 0;
	margin: 1.5vw 0 0 0;
}

.trackCardPhotosCont {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	flex-shrink: 0;
	justify-content: space-around;
}

.trackCardInsidePhoto {
    height: 12vw;
    width: auto;
    display: block;
    margin: 0 0 0.5vw 0;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}

.trackCardNotesCont {
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
}

.trackCardTitleCont {
	display: flex;
	flex-direction: row;
	flex-shrink: 0;
	justify-content: space-between;
	margin: 1.5vw 0 0.5vw 0;
}

.trackCardSectionTitle {
	font-size: 1vw;
	color: var(--login-very-dark-gray);
	font-family: "AvenirDemi";
	
}

.trackCardNoNotes {
	font-size: 0.8vw;
	color: var(--login-dark-gray);
	margin: 2vw 0 0 0;
}

.trackCardGeoCont {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;	
}

.trackCardGeoNme {
    margin: 1.5vw 0 0 0;
    color: var(--login-very-dark-gray);
    margin-bottom: 0.5vw;
    font-size: 1vw;
    display: block;
    font-family: "AvenirDemi";
}

.geoCardHeadRowCont {
	display: flex;
	flex-direction: row;
	/* flex-wrap: wrap; */
	align-items: flex-start;
	flex-shrink: 0;
	justify-content: center;
	flex-grow: 0;
}

.geoCardImg {
    width: 13vw;
    display: block;
    margin: 0 0.5vw 0.5vw 0;
    flex-shrink: 0;
}

.trackCardGeoText {
    margin: 0 0 0.5vw 0;
    flex-shrink: 0;
    text-align: left;
    font-size: 0.8vw;
    line-height: 1.2vw;
    color: var(--login-dark-gray);
    width: 24vw;
}

.trackCardNotesButtonsCont {
	display: flex;
	flex-direction: row;
}

.trackCardNotesCont {
	display: flex;
	flex-direction: column;
}

.trackCardNoteCont {
	display: flex;
	flex-direction: column;
	margin: 1vw 0 0 0;
}

.trackCardNoteHeadCont {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 1vw 1vw 1vw 1vw;
	align-items: center;
}

.trackCardNoteHeadTexts {
	display: flex;
	flex-direction: row;
	padding: 1vw 0 1vw 0;
	justify-content: center;
}

.trackCardNoteDate {
	font-size: 0.8vw;
	color: var(--login-very-dark-gray);
	font-weight: bold;
	margin: 0 1vw 0 0;
}

.trackCardNoteUser {
	font-size: 0.8vw;
	color: var(--login-very-dark-gray);
	font-family: "AvenirDemi";
	margin: 0 1vw 0 0;
}

.trackCardNoteSep {
	background-color: var(--border-gray-color);
	height: 1px;
	margin: 0 0 0 0;
	flex-grow: 0;
	flex-shrink: 0;
}

.trackCardNoteText {
	
padding: 1vw 1vw 1vw 1vw;
	
font-size: 0.8vw;
	
color: var(--login-dark-gray);
}