html {
  box-sizing: border-box;
  font-size: 18px;
}

*, *:before, *:after {
  box-sizing: inherit;
} 

body {
font-family: "Space Grotesk", Courier, "Courier New", monospace;
/* letter-spacing: .08rem; */
font-weight: 700;
font-style: normal;
margin: 0px;
padding: 0px;
color: #ffb700;
background-color: #545e49;
}

h1, h2, h3, h4, h5, h6, ol, ul {
  margin: 0;
  padding: 0;
  font-weight: bold;
}

ol, ul {
  list-style: none;
}

img {
  max-width: 100%;
  height: auto;
}

a {
	color: #ffb700;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

* {
	padding: 0px;
	margin: 0px;
	border: 0px;
}

p {
margin-top: 16px;
margin-bottom: 16px;
margin-left: 4px;
margin-right: 4px;
font-size: 16px;
letter-spacing: 0.06em;
}

#icons_small {
	display: none;
}

.full_bleed {
	clear: both;
	text-align: center;
	position: relative;
	width: 100%;
	margin: 0px;
	padding: 0px;
	border: 0px;
}

.full_bleed img{
	display: block;	
}

#topbar {
	position: relative;
	clear: none;
	width: 100%;
	height: 85px;
	margin: 0px;
	padding: 0px;
	border: 0px;
	background-image: url('../images/top.jpg');
	background-size: cover;
	background-repeat: no-repeat;
}

/* #boxcover {
	position: relative;
	width: 100%;
	margin: 0px;
	padding: 0px;
	border: 0px;
	background-image: url('../images/box.jpg');
	background-size: contain;
	background-repeat: no-repeat;
	padding-top: 76.82%;
} */

#boxcover:hover {
	background-image: url('../images/box_over.jpg');
}

.quotecolumn {
	text-align: left;
	background-color: inherit;
}

.quotebody {
	clear: right;
	padding-top: 16px;
	color:#000000;
}

.quoteby {
	padding-top: 16px;
	padding-left: 24px;
	padding-bottom: 24px;
	color:#ef0003;
}


#quotes_2col {
	clear: both;
	display: flex;
	background-color: #e1a822;
	color: #000000;
	width: 100%;
	margin: 0px;
	padding: 0px;
	border: 0px;
}

#quotes_1col {
	clear: both;
	display: none;
	background-color: #e1a822;
	color: #000000;
	width: 100%;
	margin: 0px;
	padding: 0px;
	border: 0px;
}

#about {
	clear: both;
	width: 100%;
	padding: 0px 24px 60px 24px;
	color: #ffb700;
	text-align: left;
}

#gamecontents_left {
	padding-left: 24px;
	padding-right: 24px;
	width: 60%;
	text-align: left;
	float: left;
	clear: none;
}

#gamecontents_right {
	padding-right: 24px;
	width: 40%;
	text-align: left;
	float: right;
	clear: right;
}

#gamecontents {
	display: none;
	width: 100%;
	text-align: left;
	clear: both;
}

#disclaimer {
	width: 100%;
	color: #ffffff;
	text-align: left;
	font-size: 14px;
	padding: 12px 24px 24px 24px;
}

.pricepoint_name {
	text-align: center;
	clear:right;
	font-size: 36px; 
}

.pricepoint_price {
	text-align: center;
    font-size: 64px;
clear: both;
}

.creamhound_icon {
	position: relative;
	width: 80px;
	float: left;
	clear: none;
	z-index: 10;
}

.social_icon {
	position: relative;
	height: 52px;
	float: right;
	clear: none;
	z-index: 10;
}

.creamhound_icon_small {
	position: relative;
	width: 40px;
	float: left;
	clear: none;
	z-index: 10;
}

.social_icon_small {
	position: relative;
	height: 35px;
	float: right;
	clear: none;
	z-index: 10;
}

.video_box {
	position: relative;
	width: 100%;
	margin: 0px;
	border: 0px;
	padding-bottom: 56.25%;
}

.video_box iframe {
	display: block;	
	position: absolute;
	width: 100%;
	height: 100%;
}

#icons_small {
	display: none;
}


@media (max-width: 960px) {
	
html {
	font-size: 14px;
}

#icons_small {
	display: inline;
}

#icons_large {
	display: none;
}

#quotes_2col {
	display: none;
}

#quotes_1col {
	padding: 0px 24px 0px 24px;
	display: flex;
flex-direction: column;
}

#disclaimer {
	font-size: 12px;
}

#gamecontents_left {
	display: none;
}
#gamecontents_right {
	display: none;
}
#gamecontents {
	display: inline;
}

#about {
	padding: 16px 24px 35px 24px;
	clear: both;
}

.quotebody {
	padding-top: 12px;
}

.quoteby {
	padding-top: 12px;
	padding-left: 24px;
	padding-bottom: 18px;
}

.pricepoint_name {
	font-size: 18px; 
}

.pricepoint_price {
    font-size: 56px;
}

#topbar {
	height: 44px;
}

}