@charset "utf-8";
/* CSS Document */


	#merchandiseOuterContainer {
		display: grid;
        grid-template-columns: auto auto;
		vertical-align: top;
		margin-bottom: 40px;
		background-color: #4e5a27;
	}
	
	#leftOuterHolder, #rightOuterHolder {
        box-sizing: border-box;
        padding: 10px;
	}
	  
	#leftOuterHolder {
		width: 100%;
		text-align: center;
	}
	  
	#rightOuterHolder {
		width: 100%;
	}
	  
	@media only screen and (max-width: 768px) {
        #merchandiseOuterContainer {
          display: block;
          width: 100%;
        }
		
		#leftOuterHolder, #rightOuterHolder {
			float: none;
			display: block;
		}
	}
	
	#detailsInnerHolder {
		padding-left: 10px;
		padding-right: 10px;
	}
	
	.productDataTitle {
		text-align: center;
		font: 24px Geneva, Arial, Helvetica, sans-serif;
		color: white;
	}
	
	#productPicFramingContainer {
		vertical-align: top;
		border: 5px solid #a4bd3d;
		padding: 10px 10px 5px 10px;
		display: inline-block;
		text-align: center;
		margin: 0 auto 5px auto;
	}
	
	#productPic {
		max-width: 100%;
		max-height: 900px;
	}
	
	#lblDescription {
		float: left;
		margin-left: 15px;
	}
	
	#descriptionParagraph {
		clear: both;
		margin: 0 10px 10px 15px;
		color: white;
		font-size: 16px;
		text-align: left;
	}
	
	#detailsHorizontalLine {
		border: 3px solid #a4bd3d;
		margin-bottom: 30px;
	}
	
	#priceHolder {
		color: orange;
		font: 46px "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif; 
		margin-bottom: 25px;
	}
	
	#taxHolder {
		font-size: 14px;
		color: #a4bd3d;
	}
	
	select {
		width: 100%;
		height: 32px;
		font-size: 18px;
		margin-bottom: 15px;
		border: 2px inset #a4bd3d;
	}
	
	fieldset {
		width: 85%;
		border-color: #a4bd3d;
	}

	label, legend, .calculatorFields {
		color: white;
		font: 18px "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif; 
	}

	#txtQuantity {
		margin-top: 25px;
		height: 25px;
		width: 30px;
		padding: 0;
		padding-top: 2px;
		padding-left: 8px;
		font-size: 20px;
		border: 2px inset #a4bd3d;
	}
	
	.calculatorFields {
		text-align: right;
	}
	
	#numberSubTotalAsPrice {
		color: orange;
		font: 20px Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
		margin-left: 20px;
	}
	
	#numberHSTasPrice {
		color: #a4bd3d;
		font: 20px Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
		margin-left: 20px;
	}
	
	#numberGrandTotalasPrice {
		color: orange;
		font: 30px Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
		margin-left: 20px;
	}	
	
	.calculationEquals {
		border: 1px solid #a4bd3d;
	}
	
	input[type="submit"] {
		display: block;
		font-size: 16px;
		margin: 25px auto;
	}
	
	#btnCheckTotal {
		height: 30px;
	}
	
	#purchaseSubmit {
		width: 100%;
		height: 40px;
	}
	
	.signInPrompt {
		text-align: center;
	}
	
	#successMessageOutput {
		font: 34px "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif; 
		color: orange;
	}
	
	@media screen and (max-width: 1040px) { /* other styles for all mobile devices  */
		#errorsList {
			position: absolute;
			top: 30%; 
			left: 50%;
			width:240px; 
			background-color: yellow;
			padding: 10px 20px; 
			margin-left: -140px;
			z-index: 200;
			font: 16px Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
			color: red;
		}
	}
	
	@media screen and (min-width: 1041px) { /* styles for all larger devices */
		#errorsList {
			position: absolute;
			top: 380px;
			left: 330px;
			background-color: yellow;
			padding: 0 20px;
			z-index: 200;
			font: 16px Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
			color: red;	
		}
	}
	



