@charset "UTF-8";
/* CSS Document */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	
	background-image: url(../images/HomePage_bgnd.jpg);
	background-position: center top;
	color: #C1C1C1;
	font-family: 'Inconsolata';
	font-size: 18px;
	background-repeat: repeat-y;
	background-color: #000000;
}
.clear-float {
	clear: both;
}
.spacerDiv {
	height: 60px;
}
.tighter-margins {
	margin: 10px 0;
}
#container {
	width: 100%;
}
header {
	width: 100%;
	margin: 0 0 6vw 0;
}
#logo-container {
	width: 12%;
	margin: 8px 1% 30px;
	z-index: 100;
	line-height: 0;
	position: absolute;
	top: 0;
	left: 42%;
}
.social-links {
	margin: 0 0 20px 44%;
	width: 30%;
	float: left;
}
.fa-brands {
	margin: 0 5%;
	font-size: 2.5vw;
}
.fa-facebook-square {
  	color: #1977f3;
}
.fa-instagram {
  	color: transparent;
  	background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  	background: -webkit-radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
  	background-clip: text;
  	-webkit-background-clip: text;
}
.fa-twitter-square {
  	color: #1d9bf0!important;
}
.fa-youtube-square {
  	color: #ff0000!important;
}
.fa-tiktok {
  	color: #111111;
  	filter: drop-shadow(2px 0px 0px #FD3E3E) drop-shadow(-2px -2px 0px #4DE8F4);
}
#search_box {
	position: absolute;
	top: 20px;
	right: 4%;
	border: medium solid #797979;
}
#search_box #s {
	padding: 10px;
	background: none;
	border: 0;
	color: #999;
}
#search_box #go {
	float: right;
	margin: 0.6vw 5px 0 0;
}
#search_box input[type='image'] {
   width: 30px;
   height: 25px;
}
#youtube {
	float: left;
	margin-left: 5px;
}
h1 {
	font-family: 'IM Fell English', serif;
	font-size: 3vw;
	letter-spacing: 0.2em;
	text-align: center;
	font-weight: normal;
}
h2 {
	text-align: center;
	font-size: 2.5vw;
}
h3 {
	font-size: 2vw;
	margin-bottom: 1px;
	text-align: center;
}
.main {
	margin: 0 3% 15px;
	text-align: left;
	font-size: 1.6vw;
}
.main a {
	color: #84D077;
	text-decoration: none;
}
.main a:hover {
	color: #fea24f;
}
#halloween-head-text {
	text-align: center;
}
.prodDiv {
	width: 100%;
	clear: left;
	margin-left: auto;
	margin-right: auto;
}
.prodTable {
	width: 25%;
	float: left;
	font-size: 1.5vw;
}
.prodTable td {
	text-align: center;
	background-image: url(../images/polaroid_sm.png);
	background-size: 95%;
	background-repeat: no-repeat;
	background-position: center center;
}
.thumbDiv {
	margin: 0;
	padding: 2.8vw 4.8% 0 ;
	width: 90%;
	color: #666;
}
.thumbDiv img {
	width: 100%;
}
.itemnameDiv,
.itemnameDiv p,
.itemnameDiv strong,
.itemnameDiv a {
	font-family: 'Inconsolata', monospace;
}
.itemnameDiv {
	height: 5vw;
	margin: -1vw auto 0;
	color: #333;
	display: flex;
	align-items:center;
    justify-content:center;
}
.itemnameDiv  a {
	color: #333;
	text-align: center;
	font-weight: 400;
}
.itemnameDiv a:hover {
	color: #fea24f;
	text-decoration: none;
}
.pagerDiv {
	color: #C1C1C1;
	text-align: center;
}
.pagerDiv a {
	font-weight: normal;
	color: #84D077;
}
#imageLg {
	width: 40%;
	float: left;
	background-image: url(../images/polaroid_lg.png);
	background-size: 95%;
	background-repeat: no-repeat;
	margin-left: 10px;
}
.detail-image {
	width: 75%;
	margin: 6vw 0 0 10%;
}
.licensed-image {
	width: 82%;
	margin: 4.5vw 0 0 6.5%;
}
.item-name {
	width: 75%;
	margin: 2vw 0 2vw 10%;
}
.licensed-name {
	margin: 1.5vw 0 1.5vw 10%;
}
sup.reg {
	margin: 0 0 0 0.5em;
    font-size: 0.5em;
    line-height: 0;
}
#imageLg h2 {
	font-family: 'IM Fell English', serif;
	margin: 0;
	color: #333333;
	font-size: 1.75vw;
	text-align: center;	
}
.gallery-photos {
	margin: 2vw 0 -4.5vw 0;
}
.gallery-photos img {
	margin: 0 0 0 0.5%;
	width: 12%;
	height:auto;
	float: left;
}
.descripDiv {
	float: right;
	padding-top: 40px;
	width: 55%;
}
.detailLinks {
	margin: 5vw 0 0 0;
	width: 100%;
}
.detail-link-cont {
	float: left;
	width: 17.5%;
	margin: 0 0.5% 1vw;
	margin-right: 2px;
	margin-bottom: 10px;
}
.detail-link-cont:empty { 
    display: none;
}
.detailLinks img {
	width: 100%;
	border:none;
}
.mobile-display {
	display: none;
}
.videoDiv {
	width: 853px;
	margin-left: auto;
	margin-right: auto;
}
.videoDiv h2 {
	font-family: 'IM Fell English', serif;
	color: #CCC;
	font-size: 30px;
	text-align: center;
}
.admin-content {
	margin: 0 auto;
	width: 75%;
}
.centerDiv {
	text-align: center;
	padding-top: 30px;
}
.licensed-legal {
	font-size: 12px;
}
footer {
	background-image: url(../images/footer_border.png);
	background-position: center top;
	background-repeat: no-repeat;
	padding: 10px 0;
	clear: both;
	height: 50px;
}
footer p {
	text-align: center;
	font-size: 1vw;
	margin-top: 5px;
	margin-bottom: 5px;
}
footer a {
	color: #C1C1C1;
	text-decoration: none;
}
footer a:hover {
	text-decoration: underline;
}
#signature p {
	color: #999;
	text-align: right;
	font-size: 11px;
	float: right;
	margin-top: -20px;
	padding: 0 3% 3vw 0;
}
#signature a  {
	color: #999;
	text-decoration: none;
}
#signature a:hover {
	color: #FFF;
	text-decoration: underline;
}
#adminLinks {
	text-align: center;
}
#spiritLink img {
	width: 100px;
	float: left;
	margin-right: 5px;
	margin-top: -5px;
	border:none;
}
#questionsDiv {
	margin-left: 150px;
	border-bottom: medium solid #999999;
	width: 700px;
}
#questionsDiv p {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 10px;
}
#answersDiv p {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 10px;
}
#answersDiv ul li {
	font-size: 16px;
	font-weight: normal;
	margin-bottom: 50px;
}
#IDdiv {
	visibility: hidden;
}
.video-container {
	width: 80%;
	padding: 0 10%;
	margin: 0 auto 30px;
 }
.setup-demo-video {
	overflow: hidden;
	padding-bottom: 56.25%;
	position: relative;
	height: 0;
	-webkit-box-shadow: 5px 5px 5px 5px #666666;
	box-shadow: 5px 5px 5px 5px #666666;
}
.setup-demo-video iframe,
.setup-demo-video object,
.setup-demo-video embed {
	left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}
#videoSetup input {
	color: #999;
}
#videoDemo input {
	color: #999;
}
#videoSetup input:focus {
	color: #000;
}
#videoDemo input:focus {
	color: #000;
}
#noItems {
	width: 400px;
	margin-right: auto;
	margin-left: auto;
}
#noItems h1 {
	color: #99cc66;
	font-family: "Menlo", Helvetica, Arial, sans-serif;
	font-size: 24px;
	text-align: center;
}
.MIT-video-container {
	width: 68%;
	margin-top: 20px;
	float: left;
}
#MITvideo {
	overflow: hidden;
	padding-bottom: 56.25%;
	position: relative;
	height: 0;
}
#MITvideo iframe,
#MITvideo object,
#MITvideo embed {
	left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}
.MIT-list {
	width: 30%;
	float: right;
	font-size: 0.7em;
}
.aboutContainer {
	border: 3px solid #999999;
	width: 90%;
	margin: 0 auto 30px;
	padding: 20px 3%;;
	background-image: -webkit-linear-gradient(270deg,rgba(0,0,0,0.60) 0%,rgba(0,0,0,0.50) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(0,0,0,0.60) 0%,rgba(0,0,0,0.50) 100%);
	background-image: -o-linear-gradient(270deg,rgba(0,0,0,0.60) 0%,rgba(0,0,0,0.50) 100%);
	background-image: linear-gradient(180deg,rgba(0,0,0,0.60) 0%,rgba(0,0,0,0.50) 100%);
}
.aboutLeft {
	float: left;
	width: 29%;
	padding: 0 0.5%;
}
.aboutMiddle {
	float: left;
	width: 36%;
	margin: 0 0.5%;
	padding: 0 0.5%;
}
.aboutRight {
	width: 29%;
	padding: 0 0.5%;
	float: right;
}
.gastwirtDiv {
	font-size: 13px;
	text-align: center;
}
.loreLink {
	float: right;
	height: 31px;
	width: 95%;
	margin-right: 5%;
	background-image: url(../images/gear.png);
	background-repeat: no-repeat;
	background-position: right center;
	padding-top: 10px;
	display: inline;
}
.supportText {
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
}
.terms-cond {
	font-size: 1.6vw!important;
}

/* Forms
	 ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
textarea {
	font-family: 'Inconsolata'; /* 1 */
	font-size: 100%; /* 1 */
	line-height: 1.15; /* 1 */
	margin: 0; /* 2 */
}
.radio-button {
    margin: 5px 1rem 0 0.2rem;
}
/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers.
 */

legend {
	box-sizing: border-box; /* 1 */
	color: inherit; /* 2 */
	display: table; /* 1 */
	max-width: 100%; /* 1 */
	padding: 0; /* 3 */
	white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
	box-sizing: border-box; /* 1 */
	padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
	-webkit-appearance: textfield; /* 1 */
	outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
	-webkit-appearance: button; /* 1 */
	font: inherit; /* 2 */
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #ccc #ccc #bbb;
	border-radius: 3px;
	background: #e6e6e6;
	color: rgba(0, 0, 0, .8);
	font-size: 16px;
	font-size: 1rem;
	line-height: 1;
	padding: .6em 1em .6em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	font-size: 1rem;
	line-height: 1;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
}
select {
	border: 1px solid #ccc;
	font-size: 80%;
	font-family: 'Inconsolata';
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	
}
textarea {
	width: 100%;
}
#Update-btn {
	margin-left: 45%;
}
.contact-form-container {
	width: 50%;
	margin: 0 auto;
}
.contact-form-container p {
	margin: 5px 0;
}
.contact-form-container input::placeholder {
  	opacity: 60%;
}

/* iPad styles */

@media only screen and ( max-width: 992px )
{
	body {
		font-size: 1.3em;
	}
	h1 {
		font-size: 2em;
	}
	h2 {
		font-size: 1.6em;
	}
	h3 {
		font-size: 1.2em;
	}
	header {
		margin: 0;
	}
	.main {
		font-size: 1.3em;
	}
	#logo-container {
		width: 20%;
		margin: 10px 0 0 3%;
		position: static;
		float: left;
	}
	.social-links {
		margin: 0 0 20px 42%;
		width: 50%;
	}
	.fa-brands {
		font-size: 2em;
	}
	#search_box {
		position: static;
		float: right;
		margin: 10px 3% 50px 0;
	}
	#search_box #s {
		font-size: 24px;
	}
	#search_box input[type='image'] {
   		width: 50px;
   		height: 40px;
	}
	.prodTable {
		width: 50%;
		font-size: 24px;
	}
	.thumbDiv {
		padding: 10px 4.8% 0 ;
	}
	.gallery-photos img {
		margin: 0 0 0 0.5%;
		width: 24%;
		float: left;
	}
	.pagerDiv a {
		font-size: 1em;
	}
	.popup-video {
		display: none;
	}
	.licensed-legal {
		font-size: 16px;
	}
	footer p {
		font-size: 1em;
	}
	#signature p {
		font-size: 14px;
	}
	.aboutLeft {
		width: 98%;
		float: none;
	}
	.aboutMiddle {
		width: 98%;
		float: none;
	}
	.aboutRight {
		width: 98%;
		float: none;
	}
	.supportText {
		width: 100%;
	}
	.contact-form-container {
		width: 80%;
	}
	.terms-cond {
	font-size: 1.3em!important;
	}
			
}
		
		 /* iPhone styles */
		
		@media only screen 
    and (max-device-width : 480px) 
    and (orientation : portrait) 
    and (-webkit-min-device-pixel-ratio : 2)
{ 
	h1 {
		font-size: 2.5em;
	}
	h2 {
		font-size: 2em;
	}
	h3 {
		font-size: 1.5em;
	}
	.desktop-display {
		display: none;
	}
	.mobile-display {
		display: contents;
	}
	.main {
		font-size: 2em;
	}
	#logo-container {
		width: 30%;
	}
	#search_box #s {
		font-size: 36px;
	}
	#search_box #go {
		margin: 10px 5px 0 0;
	}
	.prodTable {
	    width: 50%;
    }
	.thumbDiv {
		padding: 50px 4.8% 0 ;
	}
	.thumbDiv img {
		width: 90%;
	}
	.itemnameDiv {
		margin-top: 10px;
		height: 100px;
	}
	.itemnameDiv p {
		margin: 0;
	}
	.itemnameDiv a {
		font-size: 1.2em;
	}
	#imageLg {
		width: 100%;
		float: none;
	}
	.detail-image {
		margin: 140px 0 0 10%;
	}
	.licensed-image {
		width: 82%;
		margin: 110px 0 0 6.5%;
	}	
	.detail-link-cont {
		width: 18%;
	}
	.detailLinks {
		margin: 120px 0 0 15px;
	}
	.item-name {
		margin: 10px 0 10px 10%;
	}
	#imageLg h2 {
		margin: 0;
		font-size: 1.5em;
	}
	.descripDiv {
		float: none;
		margin: 0 2%;
		padding: 0 0 0 3%;
		width: 95%;
	}
	.pagerDiv {
		
	}
	.video-container {
		width: 100%;
		padding: 0;
 	}
	.MIT-video-container {
		width: 100%;
		float: none;
	}
	.MIT-list {
		width: 100%;
		float: none;
		font-size: 0.9em;
	}
	.MIT-trigger-list {
		width: 50%;
		float: left;
	}
	.MIT-prop-list {
		width: 50%;
		float: right;
	}
	.licensed-legal {
		font-size: 0.5em;
	}
	footer p {
		font-size: 1.5em;
	}
	#signature p {
		font-size: 1em;
		margin-top: 0px;
	}
	.home-social-links {
		margin: 0 0 20px 35%;
		width: 35%;
	}
	.social-links {
		margin: 0 0 20px 35%;
		width: 50%;
	}
	.fa-brands {
	margin: 0 25% 0 0;
	font-size: 5em;
	}
	.fa-tiktok {
  		margin: 0;
	}
	button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	font-size: 2rem;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	font-size: 3rem;
	line-height: 1;
	padding: 5px;
}
.contact-form-container {
	width: 100%;
}
.contact-form-container p {
	margin: 15px 0;
}
select {
	font-size: 1.2em;
}
.terms-cond {
	font-size: 2em!important;
}
			
}
