﻿html					{height:100%;margin:0;font-family:"Trajen Pro",Georgia,Times New Roman,Times,serif;font-size:62.5%;line-height:100%}
body					{margin:0;padding:10px}
body.black				{background-color:#FAFAF2}
body.white				{background-color:#FFF}
img						{display:block}
sup						{position:relative;bottom:-1px}
p						{font-size:1.4rem;line-height:1.6rem}
p:empty					{margin:0;padding:0}

header#intro			{box-sizing:border-box;width:calc(100% - 20px)}
header#intro			{height:88px;position:fixed;top:0px;padding-top:10px;z-index:2;background-color:#FAFAF2}	/* not happy with 84px magic number */
header#intro h1			{margin:0;font-size:1.6rem}
header#intro p			{margin:10px 0 0}
header div				{box-sizing:border-box;xmargin:5px;border:1px solid #AAA;padding:5px}

article					{border-radius:0 5px 5px 5px;margin-bottom:10px;height:80vh;overflow:scroll}
.black article			{color:#DDD;background-color:#272723}
.white article			{color:#222;background-color:#F4F4F4}
article header			{position:relative;border-radius:5px 5px 0 0;padding:2px}
.black article header	{background-color:#444}
.white article header	{background-color:#DDD}

article header h1		{margin:0;padding:0 5px 5px;font-size:1.7rem}
article header p		{margin:5px 5px 2px;padding:0}

/* new for slider */
.article				{border-radius:0 5px 5px 5px;margin-bottom:10px;padding:0}
.article header			{position:relative;border-radius:5px 5px 0 0;padding:2px}
.article > header		{z-index:1;box-sizing:border-box;border:1px solid #888;margin:3px;border-radius:0}
.article header h1		{margin:0;padding:0;font-size:1.6rem;line-height:1.6rem}
.article header p		{font-size:1.3rem;margin:5px 0 2px;padding:0}
.article header p:empty	{margin:0}

.black .article			{color:#DDD;background-color:#272723}
.black .article	h1		{color:#FFF}
.white .article			{color:#222;background-color:#F4F4F4}
.black .article header	{background-color:#444;border-radius:0;border:1px solid #888;padding:5px}
.white .article header	{background-color:#DDD}

/*******************/


section					{z-index:1;font-family:arial,sans-serif;position:relative;overflow:hidden;padding:3px 0 0 0;border-top:1px solid #444}
.article section:first-of-type	{border-top:none}	/* don't show line separator above first row of coins */
.black section			{color:#FFF;border-color:#444}
.white section			{color:#000;border-color:#DDD}
.article section header		{float:left;clear:left;margin:3px;padding:5px;background-color:transparent;height:240px;width:150px;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px}
/* new for slider */
.article section header h1	{width:150px;margin:0;padding:0;font-size:1.4rem;line-height:1.5rem}
.article section header h1 em	{margin-left:10px;font-style:normal;font-weight:normal}
.article section header h1 em sup {font-size:1.0rem}
.article section header h1 em u	{border-bottom:1px white solid;text-decoration:none}
.article section header p	{font-size:1.1rem;line-height:1.3rem;margin:5px 0;padding:0}
/*******************/
section img				{display:block;float:left}
section img.type		{width:150px;position:absolute;bottom:0px;margin:0 0px 5px 0px}
section img.slab		{margin:0;border-radius:20px;-webkit-border-radius:20px;-moz-border-radius:20px}
section img.slab:hover	{cursor:pointer}
.wantDisplay			{display:none}
section div.want		{border:1px dashed #BBB;height:250px;width:100%;float:left;border-radius:20px;-webkit-border-radius:20px;-moz-border-radius:20px}
.typeDetail				{position:fixed;top:170px;left:150px;cursor:pointer;display:none;width:500px;border:1px double black;
						padding:5px;overflow:auto;background-color:#FAFAF2;z-index:3;color:black}
.typeDetail h1			{width:100%;margin:0 0 5px 0}
.typeDetail p			{font-size:1.4rem;margin:5px 0 0 0}
button#display_want		{font-size:1rem}

/* adjustments for fixed header */
.ui-slider-tabs-list-wrapper {position:fixed;top:65px;width:calc(100% - 20px)}	/* not happy with 65px magic number positioning the top of the tabs */
.ui-slider-tab-content	{padding:72px 3px 3px /*!important*/}	/* not happy with 72px magic number positioning the top of the box below the tabs */
.ui-slider-tabs-list	{xborder:3px solid red}
/********************/
#topnav-fade			{z-index:10;position:fixed;top:88px;width:calc(100% - 20px);min-height:10px;
						background-image:url(topnav-gradient.png);background-repeat:repeat-x}
#topnav-fade img		{float:left}/*
 *
 *	Following is the css for the objects created via the JQ code
 *
 */
figure					{box-sizing:border-box;float:left;height:250px;margin:5px 3px}
figure figcaption		{box-sizing:border-box;font-size:1.1rem;line-height:1.1rem;position:relative;bottom:28px;left:0px;margin:250px 0 0 0;height:28px;
						border-radius:0 0 20px 20px;padding:3px 10px;text-align:center}
.black figure figcaption	{background-color:rgba(50,50,90,0.7)}
.white figure figcaption	{background-color:rgba(250,250,250,0.7)}

#mainNavigation			{float:right;margin:5px}
#fader					{display:none;z-index:2;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000;opacity:0}
#coinDisplay			{display:none;xborder:1px solid white;xbackground:#000;position:fixed;z-index:3;xoverflow:hidden;width:90%;height:90%;		/* 1/25/16 */
						left:5%;top:5%;
/*						-webkit-box-shadow: 25px 15px 10px 0px rgba(0,0,0,0.6);  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
/*						-moz-box-shadow:    25px 15px 10px 0px rgba(0,0,0,0.6);  /* Firefox 3.5 - 3.6 */
						box-shadow:         15px 15px 10px 0px rgba(0,0,0,0.6);  /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */
}
#coinFrame				{width:100%;	/* 1/25/16 */
						border:1px solid white;margin:23px 0 0 0;position:absolute;background-color:#000;font-family:arial,sans-serif;
						color:white;
						background-color:#000;overflow:auto;
						background-color:rgba(150, 150, 133, 0.5);
						background-image: -moz-radial-gradient(50% 82%, ellipse closest-side, rgba(150, 150, 133, 0.5), #000000 100%);
						background-image: -webkit-radial-gradient(50% 82%, ellipse closest-side, rgba(150, 150, 133, 0.5), #000000 100%);
						background-image: -o-radial-gradient(50% 82%, ellipse closest-side, rgba(150, 150, 133, 0.5), #000000 100%);
						background-image: -ms-radial-gradient(50% 82%, ellipse closest-side, rgba(150, 150, 133, 0.5), #000000 100%);
						background-image: radial-gradient(50% 82%, ellipse closest-side, rgba(150, 150, 133, 0.5), #000000 100%);
}
#coinFrame .side img		{margin:0;width:100%}	/* 1/25/16 */
#coinFrame img:nth-child(1)	{margin-bottom:0px}
#coinFrame .reflection img	{padding-bottom:0px;
						-webkit-filter:blur(1px);filter:blur(1px);	/* blur 'filter' doesn't work in IE */
						-webkit-filter:brightness(75%);filter:brightness(75%);
				        -moz-transform: scaleY(-1);
				        -o-transform: scaleY(-1);
				        -webkit-transform: scaleY(-1);
				        transform: scaleY(-1);
				        filter: FlipV;
				        -ms-filter: "FlipV";  
}
#coinFrame .side	{width:48.5%;height:100%;background:transparent;overflow:hidden;float:left;position:relative;z-index:5}
#coinFrame .side .image		{position:relative;z-index:5}
#coinFrame .side .shadow	{height:50px;opacity:0;position:relative;top:-20px;z-index:2;
						background-image: -moz-radial-gradient(ellipse 40% 30%, rgba(0,0,0,1), transparent 110%);
						background-image: -webkit-radial-gradient(ellipse 40% 30%, rgba(0,0,0,1), transparent 110%);
						background-image: -o-radial-gradient(ellipse 40% 30%, rgba(0,0,0,1), transparent 110%);
						background-image: -ms-radial-gradient(ellipse 40% 30%, rgba(0,0,0,1), transparent 110%);
						background-image: radial-gradient(ellipse 40% 30%, rgba(0,0,0,1), transparent 110%);
}
#coinFrame .side .reflection	{height:40px;position:relative;opacity:0}
#coinFrame .side .reflection img	{position:relative;top:-10px}

#coinFrame .reflection .fade	{position:absolute;top:0;left:0;bottom: 0;right:0;
						background: -webkit-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1)); /* For Safari 5.1 to 6.0 */
						background: -o-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1)); /* For Opera 11.1 to 12.0 */
						background: -moz-linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1)); /* For Firefox 3.6 to 15 */
						background: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,1)); /* Standard syntax */
}
#coinFrame .cert		{display:block;position:absolute;bottom:60px;left:405px;width:200px;z-index:4;opacity:0}
#coinFrame .title		{font-size:11px;line-height:1.3rem;position:absolute;bottom:0;left:0;margin-bottom:10px;width:100%;display:block;text-align:center;opacity:0}
#coinFrame .title::first-line	{font-size:15px}
#show_details			{float:left;opacity:0.5;z-index:6;position:relative;left:5px;top:0px}
#close_popup			{width:14px;opacity:0.5;z-index:6;position:relative;float:right;right:5px;top:4px}
#prev_popup				{width:9px;opacity:0.5;z-index:6;position:relative;float:right;right:40px;top:4px}
#next_popup				{width:9px;opacity:0.5;z-index:6;position:relative;float:right;right:25px;top:4px}
#direct_link			{float:left;opacity:0.5;z-index:6;position:relative;left:20px;top:4px}