/* Layout used in the file classresultspreview.asp.
===================================================================== */
#resultsPreviewContainer {margin: 0px;}
#resultsPreviewItemContainer {	float: left; width: 500px;}
#resultsPreviewSpecsContainer {float: left; margin: 45px 0 0 20px; width: 380px;}
#resultsPreviewItemReturnLink {float: left;}
#resultsPreviewItemReturnLink a {text-decoration: none;}
#resultsPreviewItemNavLinks {float: right;}
#resultsPreviewItem {margin-top: 5px;}
.resultsPreviewIconsDivTablet {display: none;}
.resultsPreviewAddToCart {float: right;}
.resultsPreviewKeyword {float: left; width: 50%;}
#divpreview img {width: 100%;}
#resultsPreviewFooterContainer {float: left; width: 100%; margin-top: 20px; border-top: 1px solid #cccccc;}
#resultsPreviewFooter {float: left; width: 500px; margin-top: 10px; text-align: justify;}

#resultsPreviewNavTablet {display: none;}
#resultsPreviewNavMobile {display: none;}

.resultsPreviewNavButtonBack {
	margin: 0 0 0 0;
	border: none;
	border-top-left-radius: 6px;
	border-bottom-left-radius: 6px;
	padding: 0px 12px 0 12px;
	color: #ffffff;
	background-color: #7c0306;
	font-family: Cursive;
	font-size: 16px;
	cursor: pointer;
	}

.resultsPreviewNavButtonNext {
	margin: 0 0 0 0;
	border: none;
	border-top-right-radius: 6px;
	border-bottom-right-radius: 6px;
	padding: 0px 12px 0 12px;
	color: #ffffff;
	background-color: #7c0306;
	font-family: Cursive;
	font-size: 16px;
	cursor: pointer;
	}

.resultsPreviewNavButtonBack:hover {background-color: #ff0000;}
.resultsPreviewNavButtonBack:active {background-color: #ff0000;}
.resultsPreviewNavButtonNext:hover {background-color: #ff0000;}
.resultsPreviewNavButtonNext:active {background-color: #ff0000;}

.socialMediaDivider {float: left;}
#socialMediaFaceBook {margin: 0 0 0 8px;}

/* Responsive Design
===================================================================== */
@media only screen and (max-width: 1024px) {
	#resultsPreviewItemReturnLink {margin-top: 2px; font-weight: bold;}
	#resultsPreviewNavDesktop {display: none;}
	#resultsPreviewNavTablet {display: block;}
}
@media only screen and (max-width: 1023px) {
	#resultsPreviewItemContainer {float: none; width: 100%; min-width: 200px; max-width: 500px; margin: 0 auto;}
	#resultsPreviewItem img {width: 100%}
	#resultsPreviewSpecsContainer {float: none; width: 100%; min-width: 200px; max-width: 500px; margin: 0 auto; margin-top: 20px; border-top: 1px solid #cccccc; border-radius: 0; padding: 20px 0 0 0;}
	.resultsPreviewAddToCart {float: right; width: auto;}
	.resultsPreviewKeyword {float: left; width: 33%;}
	#resultsPreviewFooterContainer {float: none; width: 100%; min-width: 200px; max-width: 500px; margin: 20px auto 20px auto;}
	#resultsPreviewFooter {float: none; width: auto;}
}
@media only screen and (max-width: 767px) {
	#resultsPreviewItem {margin-top: 20px;}
	#resultsPreviewNavTablet {display: none;}
	#resultsPreviewNavMobile {display: block;}
	.resultsPreviewNavButtonBack {height: 35px; padding: 0px 15px 0 15px;}
	.resultsPreviewNavButtonNext {height: 35px; padding: 0px 15px 0 15px;}
	.resultsPreviewIconsDiv {display: none;}
	.resultsPreviewIconsDivTablet {display: block;}
	#resultsPreviewContainer {margin: 5px 20px 20px 20px;}
	#resultsPreviewItemReturnLink {margin: 0 0 10px 0; float: none;}
	#resultsPreviewItemNavLinks {float: none;}
}
@media only screen and (max-width: 565px) {
	.resultsPreviewKeyword {float: left;javascript:PopupPreview('0065943') width: 50%;}
}
@media only screen and (max-width: 500px) {
	.socialMediaDivider {float: none;}
	#socialMediaFaceBook {margin: 5px 0 0 0;}
	.previewIcons {margin-top: 5px;}
}
@media only screen and (max-width: 479px) {
	.resultsPreviewAddToCart {float: left; width: 100%;}
}
@media only screen and (max-width: 420px) {
	#resultsPreviewContainer {margin: 5px 0 0 0;}
	#resultsPreviewItemContainer {float: none; width: 290px; max-width: 316px;}
	#resultsPreviewSpecsContainer {float: none; width: 290px; max-width: 316px;}
	#resultsPreviewFooterContainer {float: none; width: 290px; max-width: 316px;}
}
@media only screen and (max-width: 380px) {
	#subpage-content .gutter {padding-left: 0; padding-right: 0;}
}
@media only screen and (max-width: 339px) {
	#resultsPreviewItemContainer {float: none; width: 290px; min-width: 290px;}
	#resultsPreviewSpecsContainer {float: none; width: 290px; min-width: 290px;}
	.resultsPreviewKeyword {float: left; width: 100%;}
	#resultsPreviewFooterContainer {float: none; width: 290px; min-width: 290px;}
}