/* PC SETUP Main css *START* */
	#page > footer2 a {	color:#fff;text-decoration:none;}
@media screen and (min-width: 1000px) and (max-width: 1500px)
{	
	body		{	font-family:Calibri,sans-serif; color: #555555;
			margin: 10px auto 55px auto; font-size: 14pt; max-width:90%;
			}

	h1		{	font-weight: bold; font-size: 16pt; margin: 5px 5px 5px 10px;	}
	h2		{	font-weight: bold; font-size: 15pt; margin: 5px;	}
	h3		{	font-weight: bold; font-size: 14pt; margin: 5px;	}

	p		{	line-height: 1.2;	}
	ul.st-nav, ul.nav, .phone-off
			{	display: inherit !important;	}
	.phone-show
			{	display: none !important;	}	
	#page		{	
			display: grid;
			grid-template-areas:
			"logo logo logo"
			"nav nav nav"
			"showcase showcase showcase"
			"main main main"
			"footer1 footer2 footer3"
			"footer4 footer4 footer4"
                    	  	"end end end";
			grid-gap: 5px;
			grid-template-rows: 1fr;
			grid-template-columns: 25% 1fr 25%;}
	#page		{
		padding: 5px; background-color: #272727; }

	#page > logo	{
		grid-area: logo; 
		background-color: #272727;
		padding: 20px;}
	#page > nav	{
		grid-area: nav;
		background-color: #272727;}
	#page > showcase	{
		grid-area: showcase;
		background-color: #fff;
		color: #555555;}
	#page > main	{
		grid-area: main;
		background-color: #fff;
		color: #555555;}
	#page > footer1	{
		grid-area: footer1;
		text-align: center;
		color: #555555; background-color: #fff;}
	#page > footer2	{
		grid-area: footer2;
		text-align: center;
		color: #fff; background-color: #272727;}
	#page > footer3	{
		grid-area: footer3;
		text-align: center;
		color: #555555; background-color: #fff;}
	#page > footer4	{
		grid-area: footer4;
		text-align: center;
		color: #fff; background-color: #fff;}

	#page > end	{
		grid-area: end;
		text-align: center; 	color: #fff; background-color: #272727;}

	#page > showcase, #page > main
			{	padding: 10px 10px 30px 10px;
				-moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000;
				border: 1px solid #000;}

	#page > footer1, #page > footer2, #page > footer3, #page > footer4, #page > end
			{	padding: 10px;
				-moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000;
				border: 1px solid #000;}
	
	img.top_logo	{	display: block; margin: 10px auto;
				max-width: 750px; height: auto;	}
	img.bot_logo	{	display: inline-block; margin: 30px auto;
				max-width: 400px; height: auto;
 				vertical-align: middle;	}
	img.hallmark	{	display: block; margin: 20px auto;min-width: 100px; max-width: 15%; height: auto;	}

	#feature-holder	{	max-width: 800px; display: block; margin: 0 auto 20px auto;
				text-align: center; text-transform: uppercase;	}

	#feature-holder li
			{	transition: 0.8s;
				width: 626px; display: inline-block; margin: 0 10px;
				padding: 0 0 20px 0;
				background: #f2f2f2;
				border: 1px solid #f2f2f2;
				box-shadow: inset 0 0 10px #000000;	}
	#feature-holder img
			{	width: 250px; height: auto;
				display: inline-block; margin: 20px; padding: 3px;
				border: solid 1px #555555; box-shadow: 0 0 10px #000000;				}
	#feature-holder li:hover {	transition: 0.8s; background: #272727;
				box-shadow: inset 0 0 10px #ffff00;	}

	#categories-holder, #types-holder
			{	max-width: 800px; display: block; margin: 0 auto 20px auto;
				text-align: center; text-transform: uppercase;	}

	#categories-holder li, #types-holder li
			{	transition: 0.8s;
				width: 300px; display: inline-block; margin: 0 10px 20px 10px;
				padding: 0 0 20px 0;
				background: #f2f2f2;
				border: 1px solid #f2f2f2;
				box-shadow: inset 0 0 10px #000000;	}
	#categories-holder img, #types-holder img
			{	width: 250px; height: auto;
				display: block; margin: 20px auto; padding: 3px;
				border: solid 1px #555555; box-shadow: 0 0 10px #000000;				}
	#categories-holder li:hover, #types-holder li:hover
			{	transition: 0.8s; background: #272727;
				box-shadow: inset 0 0 10px #ffff00;	}
	.home-event-map	{	width: 256px; margin: 20px auto; 
				position: relative;
				overflow: hidden;
				padding-top: 256px;
				border: solid 1px #555555; box-shadow: 0 0 10px #000000;				}

	.home-blurb
			{	text-align:  center; width: 60%; margin: 20px auto 40px auto;
				padding: 0;	}
	.home-blurb2
			{	text-align: left; width: 30%; margin: 20px auto 20px auto;padding: 0;	}
	.h2-home-blurb
			{	text-align: center; font-size: 16pt; color: #555555; margin: 20px 0 40px 20px; padding: 0;	}
	img.home-blurb
			{	width: 150px; height: auto;	}
	.left		{	margin: 0 30px 0 0; float: left; clear: both;padding: 3px; border: solid 1px #555555; box-shadow: 0 0 10px #000000;	}
	.right		{	margin: 0 0 0 30px; float: right;padding: 3px; border: solid 1px #555555; box-shadow: 0 0 10px #000000;  }
	.middle		{	display: block; margin: 20px auto; padding: 3px; border: solid 1px #555555; box-shadow: 0 0 10px #000000;	}

	.main-text	{	width: 800px; padding: 0; margin: 0 auto; overflow: hidden;}
	.main-text h1	{	margin: 20px 0 15px 15px;	}
	.main-text h2	{	margin: 15px 0 15px 20px;	}
	.main-text h3	{	margin: 15px 0 15px 30px;	}
	.main-text p	{	margin: 15px 0 15px 40px;	}
	.main-text input[type="checkbox"],.main-text input.inputcheckbox
	{	margin: 0 10px 0 45px; vertical-align: middle; height: 25px; width: 25px; background-color: #eee;}


	#public-list-items-container	{	width:95%; margin: auto;	}

	.public-list-items		{	float: left; width: 25%; height: 330px;
					margin: 20px auto 10px auto;	}

	.public-list-items img	{	display: block; margin: 10px auto; 
					width: 80%; height: auto;
					border: 1px solid #000;
					-moz-box-shadow:    0 0 10px #000000;
					-webkit-box-shadow: 0 0 10px #000000;
					box-shadow: 0 0 10px #000000;}

	.public-list-items p		{	margin-left: 25px;	}

	img.img-jewellery-home-page
				{	width: 175px; height: auto;	border: 1px solid #000;
					-moz-box-shadow:    0 0 10px #000000;
					-webkit-box-shadow: 0 0 10px #000000;
					box-shadow: 0 0 10px #000000;}

	ul.terms, ul.jewellery-care	{	padding-left: 3rem;
					list-style-type: none;	}
	ul.jewellery-care li		{	padding-left: 1.5rem;
					background-image: url(../images/icons/Sapphire2-ul.png);
					background-position: 0 0;
					background-size: 1.3rem 1.1rem;
					background-repeat: no-repeat;	}
	ul.terms li		{	padding-left: 1.5rem;
					background-image: url(../images/icons/Sapphire2-ul.png);
					background-position: 0 0;
					background-size: 1.3rem 1.1rem;
					background-repeat: no-repeat;	}


	#page > links-bottom ul	{ 	margin: 0px 0px 5px 15px; list-style-type: none;}
	#page > links-bottom a	{ 	text-decoration:none;}
	.contact-form		{ }
	.titles			{ 	display: block; text-transform: uppercase; margin: 0; background-color: #e1e3e4; line-height: 50px; text-align: center; padding: 0px;
				 	-moz-box-shadow: inset 0 0 10px #000000;
					-webkit-box-shadow: inset 0 0 10px #000000;
					box-shadow: inset 0 20px 10px -20px #000000,	inset 20px 0px 10px -20px #000000, inset -20px 0px 10px -20px #000000;}

	.phone-off		{	clear: both;	}

	.slturingimg		{	width: 100px; height: auto; margin-left: 125px;	}
	img.hallmark-guarantee
			{	display: block; margin: 10px auto; 
				width: 60%; height: auto;
				border: 1px solid #000;
				box-shadow: 0 0 10px #000000;	}


}

@media screen and (min-width: 1500px)
{	
	body		{	font-family:Calibri,sans-serif; color: #555555;
			margin: 10px auto 55px auto; font-size: 14pt; max-width:90%;
			}

	h1		{	font-weight: bold; font-size: 16pt; margin: 5px 5px 5px 10px;	}
	h2		{	font-weight: bold; font-size: 15pt; margin: 5px;	}
	h3		{	font-weight: bold; font-size: 14pt; margin: 5px;	}

	p		{	line-height: 1.2;	}
	ul.st-nav, ul.nav, .phone-off
			{	display: inherit !important;	}
	.phone-show
			{	display: none !important;	}
	#page		{	
			display: grid;
			grid-template-areas:
			"logo logo logo"
			"nav nav nav"
			"showcase showcase showcase"
			"main main main"
			"footer1 footer2 footer3"
			"footer4 footer4 footer4"
            "end end end";
			grid-gap: 5px;
			grid-template-rows: 1fr;
			grid-template-columns: 25% 1fr 25%;}
	#page		{
		padding: 5px; background-color: #272727; }

	#page > logo	{
		grid-area: logo; 
		background-color: #272727;
		padding: 20px;}
	#page > nav	{
		grid-area: nav;
		background-color: #272727;}
	#page > showcase	{
		grid-area: showcase;
		background-color: #fff;
		color: #555555;}
	#page > main	{
		grid-area: main;
		background-color: #fff;
		color: #555555;}
	#page > footer1	{
		grid-area: footer1;
		text-align: center;
		color: #555555; background-color: #fff;}
	#page > footer2	{
		grid-area: footer2;
		text-align: center;
		color: #fff; background-color: #272727;}
	#page > footer3	{
		grid-area: footer3;
		text-align: center;
		color: #555555; background-color: #fff;}
	#page > footer4	{
		grid-area: footer4;
		text-align: center;
		color: #fff; background-color: #fff;}

	#page > end	{
		grid-area: end;
		text-align: center; 	color: #fff; background-color: #272727;}

	#page > showcase, #page > main
			{	padding: 10px 10px 30px 10px;
				-moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000;
				border: 1px solid #000;}

	#page > footer1, #page > footer2, #page > footer3, #page > footer4, #page > end
			{	padding: 10px;
				-moz-box-shadow: inset 0 0 10px #000000; -webkit-box-shadow: inset 0 0 10px #000000; box-shadow: inset 0 0 10px #000000;
				border: 1px solid #000;}
	
	img.top_logo	{	display: block; margin: 10px auto;
				max-width: 1000px; height: auto;	}
	img.bot_logo	{	display: inline-block; margin: 20px auto;
				max-width: 600px; height: auto;
 				vertical-align: middle;	}
	img.hallmark	{	display: block; margin: 20px auto;min-width: 100px; max-width: 15%; height: auto;	}

	#feature-holder	{	max-width: 800px; display: block; margin: 0 auto 20px auto;
				text-align: center; text-transform: uppercase;	}

	#feature-holder li
			{	transition: 0.8s;
				width: 626px; display: inline-block; margin: 0 10px;
				padding: 0 0 20px 0;
				background: #f2f2f2;
				border: 1px solid #f2f2f2;
				box-shadow: inset 0 0 10px #000000;	}
	#feature-holder img
			{	width: 250px; height: auto;
				display: inline-block; margin: 20px; padding: 3px;
				border: solid 1px #555555; box-shadow: 0 0 10px #000000;				}
	#feature-holder li:hover {	transition: 0.8s; background: #272727;
				box-shadow: inset 0 0 10px #ffff00;	}

	#categories-holder, #types-holder
			{	max-width: 800px; display: block; margin: 0 auto 20px auto;
				text-align: center; text-transform: uppercase;	}

	#categories-holder li, #types-holder li
			{	transition: 0.8s;
				width: 300px; display: inline-block; margin: 0 10px 20px 10px;
				padding: 0 0 20px 0;
				background: #f2f2f2;
				border: 1px solid #f2f2f2;
				box-shadow: inset 0 0 10px #000000;	}
	#categories-holder img, #types-holder img
			{	width: 250px; height: auto;
				display: block; margin: 20px auto; padding: 3px;
				border: solid 1px #555555; box-shadow: 0 0 10px #000000;				}
	#categories-holder li:hover, #types-holder li:hover
			{	transition: 0.8s; background: #272727;
				box-shadow: inset 0 0 10px #ffff00;	}
	.home-event-map	{	width: 256px; margin: 20px auto; 
				position: relative;
				overflow: hidden;
				padding-top: 256px;
				border: solid 1px #555555; box-shadow: 0 0 10px #000000;				}
	.home-blurb
			{	text-align:  center; width: 60%; margin: 20px auto 40px auto;
				padding: 0;	}
	.home-blurb2
			{	text-align: left; width: 50%; margin: 20px auto 20px auto;padding: 0;	}
	.h2-home-blurb
			{	text-align: center; font-size: 16pt; color: #555555; margin: 20px 0 40px 20px; padding: 0;	}
	img.home-blurb
			{	width: 150px; height: auto;	}
	.left		{	margin: 0 30px 0 0; float: left; clear: both;padding: 3px; border: solid 1px #555555; box-shadow: 0 0 10px #000000;	}
	.right		{	margin: 0 0 0 30px; float: right;padding: 3px; border: solid 1px #555555; box-shadow: 0 0 10px #000000;  }
	.middle		{	display: block; margin: 20px auto; padding: 3px; border: solid 1px #555555; box-shadow: 0 0 10px #000000;	}

	.main-text	{	width: 1000px; padding: 0; margin: 0 auto; overflow: hidden;}
	.main-text h1	{	margin: 20px 0 15px 15px;	}
	.main-text h2	{	margin: 15px 0 15px 20px;	}
	.main-text h3	{	margin: 15px 0 15px 30px;	}
	.main-text p	{	margin: 15px 0 15px 40px;	}
	.main-text input[type="checkbox"],.main-text input.inputcheckbox
	{	margin: 0 10px 0 45px; vertical-align: middle; height: 25px; width: 25px; background-color: #eee;}


	#public-list-items-container	{	width:95%; margin: auto;	}

	.public-list-items		{	float: left; width: 20%; height: 330px;
					margin: 20px auto 20px auto;	}

	.public-list-items img	{	display: block; margin: 10px auto; 
					width: 80%; height: auto;
					border: 1px solid #000;
					-moz-box-shadow:    0 0 10px #000000;
					-webkit-box-shadow: 0 0 10px #000000;
					box-shadow: 0 0 10px #000000;}

	.public-list-items p		{	margin-left: 25px;	}

	img.img-jewellery-home-page
				{	width: 175px; height: auto;	border: 1px solid #000;
					-moz-box-shadow:    0 0 10px #000000;
					-webkit-box-shadow: 0 0 10px #000000;
					box-shadow: 0 0 10px #000000;}

	ul.terms, ul.jewellery-care	{	padding-left: 3rem;
					list-style-type: none;	}
	ul.jewellery-care li		{	padding-left: 1.5rem;
					background-image: url(../images/icons/Sapphire2-ul.png);
					background-position: 0 0;
					background-size: 1.3rem 1.1rem;
					background-repeat: no-repeat;	}
	ul.terms li		{	padding-left: 1.5rem;
					background-image: url(../images/icons/Sapphire2-ul.png);
					background-position: 0 0;
					background-size: 1.3rem 1.1rem;
					background-repeat: no-repeat;	}


	#page > links-bottom ul	{ 	margin: 0px 0px 5px 15px; list-style-type: none;}
	#page > links-bottom a	{ 	text-decoration:none;}
	.contact-form		{ }
	.titles
	{ 	display: block; text-transform: uppercase; margin: 0; background-color: #e1e3e4;
		line-height: 50px;	text-align: center; padding: 0px;
		box-shadow: inset 0 20px 10px -20px #000000,	inset 20px 0px 10px -20px #000000, inset -20px 0px 10px -20px #000000;}

	.phone-off		{	clear: both;	}

	.slturingimg		{	width: 100px; height: auto; margin-left: 125px;	}
	img.hallmark-guarantee
			{	display: block; margin: 10px auto; 
				width: 60%; height: auto;
				border: 1px solid #000;
				box-shadow: 0 0 10px #000000;	}
}
@media screen and (min-width: 1000px)
{
#feature-holder img, #categories-holder img
			{background: #fff;}
#feature-holder li a, #categories-holder li a
			{transition: 0.8s;text-decoration: none; color: #555555;}
#feature-holder li a:hover, #categories-holder li a:hover
			{transition: 0.8s; color: #fff;}
}
/* PC SETUP *END* */

