/*
**	Fonts
*/


@font-face {
	font-family: fgCondDemi;
	src: url(FRADMCN.TTF) format("truetype");
}
@font-face {
	font-family: fgCondMedium;
	src: url(FRAMDCN.TTF) format("truetype");
}
@font-face {
	font-family: fgDemi;
	src: url(FRADM.TTF) format("truetype");
}
@font-face {
	font-family: fgDemiItalic;
	src: url(FRADMIT.TTF) format("truetype");
}
@font-face {
	font-family: fgHeavy;
	src: url(FRAHV.TTF) format("truetype");
}
@font-face {
	font-family: fgHeavyItalic;
	src: url(FRAHVIT.TTF) format("truetype");
}
@font-face {
	font-family: fgMedium;
	src: url(framd.ttf) format("truetype");
}
@font-face {
	font-family: fgMediumItalic;
	src: url(framdit.ttf) format("truetype");
}

body {
	margin-top: 25px;
	font-family: fgMedium,sans-serif;
	font-size: 16pt;
	overflow-y: scroll;	/* This forces the right side scrollbar to always appear */
}

.vlHeaderLogo {
	padding-top: 20px;
	padding-left: 5px;
	padding-bottom: 20px;
}


.recipeNameBar {
	line-height: 100%;
	position: relative;
	top: 50%;
	transform: translateY(-50%); 
}

.base			{ color: #dddddd; text-decoration: none; }
.cheer		{ color: #e8ccf3; text-decoration: none; }
.comet		{ color: #fecc2b; text-decoration: none; }
.crush		{ color: #f17e00; text-decoration: none; }
.eden			{ color: #b0d520; text-decoration: none; }
.festival	{ color: #ffc2d0; text-decoration: none; }
.paradise	{ color: #7dcde7; text-decoration: none; }
.venom		{ color: #eb3d50; text-decoration: none; }
.peachpie	{ color: #e9ec99; text-decoration: none; }


.baseBG		{ background-color: #DDDDDD; }
.cheerBG		{ background-color: #e8ccf3; }
.cometBG		{ background-color: #fecc2b; }
.crushBG		{ background-color: #f17e00; }
.edenBG		{ background-color: #b0d520; }
.festivalBG	{ background-color: #ffc2d0; }
.paradiseBG	{ background-color: #7dcde7; }
.venomBG		{ color: white; background-color: #eb3d50; }
.peachpieBG	{ background-color: #e9ec99; }
.bpBG	{ background-color: #fae230; }
.ccBG	{ background-color: #e1b256; }
.ppBG	{ background-color: #e9ec99; }
.rvBG	{ color: beige; background-color: #9c1d21; }


.highlight {
	background-color: #FFFDD0;	/* Cream */
}

.recipeCell {
	text-align: right;
	padding: 25px 10px;
	vertical-align: middle;
}

.bolden {
	font-family: fgCondDemi;
	font-size: 24pt;
}

.recipeTable {
	border: black solid 2px;
}

.btn-volume {
	width: 90px;
	padding: 15px 20px;
	text-align: middle;
	margin-right: 10px;
	font-family: fgCondDemi;
	font-size: 16pt;
}

.btn { border: white solid 6px; }
.btn.active { border: black solid 6px; }

.btn-blue { color: white; background-color: #0088bf; }
.btn-green {color: white;  background-color: #00A368; }
.btn-red { color: white; background-color: #C40223; }

.btn-flavor {
	width: 130px;
	padding-top: 10px;
	padding-bottom: 10px;
/*	padding: 10px; */
	text-align: middle;
/*	margin-right: 10px; */
	font-family: fgCondDemi;
	font-size: 16pt;
/*	margin-bottom: 8px; */
}
.btn-wide {
	width: 220px;
}

.btn-flavor:checked {
	color: blue;
}

.stepDesc {
	font-family: fgCondDemi;
	font-size: 36pt;
	padding-bottom: 10px;
	padding-top: 20px;
}
.pnButton {
	width: 150px;
	height: 75px;
	font-family: fgDemi;
	font-size: 18pt;
}

.volButtons input[type="radio"]:checked ~ * { 
    background:pink !important;
}

.bottles {
	font-size: 13pt;
	text-align: center;
	padding: 0px 20px 0px;
}
.bottlesNum {
	font-size: 18pt;
	font-family: fgCondDemi;
	text-align: center;
	padding: 0px 20px 0px;
}


.stepBox {
	border: black solid 10px;
	padding-top: 30px;
	padding-bottom: 30px;
}
.flavorBrand {
	font-family: fgDemi;
	font-size: 2em;
}
.flavorName {
	font-family: fgCondDemi;
	font-size: 5em;
	line-height: 1em;
	padding-bottom: 30px;

}
.flavorGrams {
	font-family: fgHeavy;
	font-size: 8em;
	line-height: 0.8em;
}
.flavorGramLabel {
	font-family: fgDemi;
	font-size: 2em;
}



@font-face {
	font-family: FranklinGothicURWBookItalic;
	src: url(/fonts/Franklin-Gothic-URW-Book-Italic.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWBook;
	src: url(/fonts/Franklin-Gothic-URW-Book.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWCompressedBookItalic;
	src: url(/fonts/Franklin-Gothic-URW-Compressed-Book-Italic.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWCompressedBook;
	src: url(/fonts/Franklin-Gothic-URW-Compressed-Book.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWCompressedDemiItalic;
	src: url(/fonts/Franklin-Gothic-URW-Compressed-Demi-Italic.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWCompressedDemi;
	src: url(/fonts/Franklin-Gothic-URW-Compressed-Demi.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWCondensedBookItalic;
	src: url(/fonts/Franklin-Gothic-URW-Condensed-Book-Italic.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWCondensedBook;
	src: url(/fonts/Franklin-Gothic-URW-Condensed-Book.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWCondensedDemiItalic;
	src: url(/fonts/Franklin-Gothic-URW-Condensed-Demi-Italic.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWCondensedDemi;
	src: url(/fonts/Franklin-Gothic-URW-Condensed-Demi.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWCondensedMediumItalic;
	src: url(/fonts/Franklin-Gothic-URW-Condensed-Medium-Italic.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWCondensedMedium;
	src: url(/fonts/Franklin-Gothic-URW-Condensed-Medium.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWDemiItalic;
	src: url(/fonts/Franklin-Gothic-URW-Demi-Italic.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWDemi;
	src: url(/fonts/Franklin-Gothic-URW-Demi.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWExtraCompressedBook;
	src: url(/fonts/Franklin-Gothic-URW-Extra-Compressed-Book.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWExtraCompressedDemi;
	src: url(/fonts/Franklin-Gothic-URW-Extra-Compressed-Demi.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWHeavyItalic;
	src: url(/fonts/Franklin-Gothic-URW-Heavy-Italic.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWHeavy;
	src: url(/fonts/Franklin-Gothic-URW-Heavy.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWLight;
	src: url(/fonts/Franklin-Gothic-URW-Light.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWMediumItalic;
	src: url(/fonts/Franklin-Gothic-URW-Medium-Italic.otf) format("opentype");
}
@font-face {
	font-family: FranklinGothicURWMedium;
	src: url(/fonts/Franklin-Gothic-URW-Medium.otf) format("opentype");
}
-