#styleGuideFrm {
	position: absolute;
}
body.style-guide {
	background-color: black;
}
#theHeader {
	background:url(/images/style-guide/headerbg.jpg) no-repeat center center;
	background-size: cover;
	text-align: center;
-webkit-box-shadow: inset 0px 2px 25px 0px rgba(0, 0, 0, 1);
-moz-box-shadow:    inset 0px 2px 25px 0px rgba(0, 0, 0, 1);
box-shadow:         inset 0px 2px 25px 0px rgba(0, 0, 0, 1);
}
#theHeader>img {
	margin: 0px 15px;
	max-width: 407px;
	width: 100%;
}
#styleGuideContainer {
	position: relative;
	text-align: center;
}
#styleGuideContainer:after {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(0, 0, 0, 0);
	border-bottom-color: #000;
	border-width: 15px;
	margin-left: -15px;
}
#styleGuideContainer.withResults {
	background-color: white;
}
#styleGuideContainer.withResults:after {
	border-bottom-color: white;
}

.paginator>li {
	background-color: #ad8935;
	border-radius: 10px;
	cursor: pointer;
	display: inline-block;
	height: 15px;
	margin: 55px 10px 40px;
	opacity: .5;
	width: 15px;
}
.paginator>li:hover:not(.disabled),
.paginator>li.active {
	opacity: 1;
}
.paginator>li.disabled {
	background-color: #666;
	cursor: default;	
}
.guideStep .intro {
	color: white;
	font-size: 26px;
}
.guideStep {
	padding-bottom: 60px;
}

/* =================== gender ================== */
#gender.guideStep .list-inline>li {
	color: white;
	cursor: pointer;
	font-size: 18px;
	letter-spacing: 0.15em;
	margin: 40px 45px 20px;
	text-align: center;
	vertical-align: top;
}
#gender.guideStep .list-inline img {
	background-color: #271a12;
	border-radius: 80px;
	display: block;
	margin: 0px auto 35px;
}
#gender.guideStep .list-inline>li.active,
#gender.guideStep .list-inline>li:hover {
	color: #af853b;
}
#gender.guideStep .list-inline>li.active img,
#gender.guideStep .list-inline>li:hover img {
	background-color: #af853b;
}
/* =================== end gender ================== */

/* =================== price ================== */
#price.guideStep .list-inline>li {
	color: white;
	cursor: pointer;
	font-size: 18px;
	letter-spacing: 0.15em;
	margin: 40px 30px 20px;
	text-align: center;
	vertical-align: top;
}
#price.guideStep .list-inline>li>div:first-child {
	background-color: #271A12;
	border-radius: 80px;
	color: #af853b;
	height: 160px;
	display: block;
	width: 160px;
	line-height: 160px;
	font-style: italic;
	font-size: 45px;
}
#price.guideStep .list-inline>li>div:first-child+div {
	line-height: 100px;
}
#price.guideStep .list-inline>li:hover>div:first-child,
#price.guideStep .list-inline>li.active>div:first-child {
	background-color: #af853b;
	color: black;
}
#price.guideStep .list-inline>li:hover>div:first-child+div,
#price.guideStep .list-inline>li.active>div:first-child+div {
	color: #af853b;
}
/* =================== end price ================== */

/* =================== color ================== */
#color.guideStep .list-inline>li {
	color: white;
	cursor: pointer;
	font-size: 18px;
	letter-spacing: 0.15em;
	margin: 40px 20px 20px;
	text-align: center;
	text-transform: uppercase;
	vertical-align: top;
}
#color.guideStep .list-inline>li>div {
	border: 4px solid #000;
	background-color: #271a12;
	border-radius: 80px;
	display: block;
	margin: 0px auto 35px;
	overflow: hidden;
}
#color.guideStep .list-inline>li.active,
#color.guideStep .list-inline>li:hover {
	color: #af853b;
}
#color.guideStep .list-inline>li.active>div,
#color.guideStep .list-inline>li:hover>div {
	border: 4px solid #af853b;
}
/* =================== end color ================== */

/* =================== metal ================== */
#metal.guideStep input[type=checkbox] {
	float: left;
	margin-top: 2px;
	position: absolute;
	overflow: hidden;
	clip: rect(0 0 0 0);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
}
#metal.guideStep #metals {
	margin: 40px auto;
	line-height: 50px;
	display: inline-table;
}
#metal.guideStep #metals>li {
	list-style-type: none;
	text-align: left;
	letter-spacing: 0.2em;
}
#metal.guideStep li>label {
	background: url(/images/style-guide/checkbox.png) no-repeat 0px 0px;
	color: #666;
	cursor: pointer;
	font-size: 18px;
	font-weight: normal;
	line-height: 30px;
	padding-left: 35px;
	text-transform: uppercase;
}
#metal.guideStep input[type=checkbox]:checked + label {
	background-position: 0 -33px;
	color: #af853b;
}
#metal button {

}
/* =================== end metal ================== */

/* =================== durable ================== */
#durable.guideStep .list-inline>li {
	color: white;
	cursor: pointer;
	font-size: 18px;
	letter-spacing: 0.15em;
	margin: 40px 35px 20px;
	text-align: center;
	vertical-align: top;
	width: 200px;
}
#durable.guideStep .list-inline img {
	background-color: #271a12;
	border-radius: 80px;
	display: block;
	margin: 0px auto 35px;
}
#durable.guideStep .list-inline>li>div.durTitle {
	border-bottom: 1px solid white;
	padding-bottom: 15px;
	margin-bottom: 15px;
	text-transform: uppercase;
}
#durable.guideStep .list-inline>li>div.durInfo {
	font-size: 13px;
}
#durable.guideStep .list-inline>li.active,
#durable.guideStep .list-inline>li:hover {
	color: #af853b;
}
#durable.guideStep .list-inline>li.active>div.durTitle,
#durable.guideStep .list-inline>li:hover>div.durTitle {
	border-bottom: 1px solid #af853b;
}
#durable.guideStep .list-inline>li.active img,
#durable.guideStep .list-inline>li:hover img {
	background-color: #af853b;
}
/* =================== end durable ================== */

/* =================== style ================== */
#style.guideStep .list-inline>li {
	color: white;
	cursor: pointer;
	font-size: 15px;
	letter-spacing: 0.15em;
	line-height:  25px;
	margin: 40px 35px 20px;
	text-align: center;
	vertical-align: top;
	width: 200px;
}
#style.guideStep .list-inline img {
	background-color: #271a12;
	border-radius: 80px;
	display: block;
	margin: 0px auto 35px;
}
#style.guideStep .list-inline>li>div.durTitle {
	border-bottom: 1px solid white;
	padding-bottom: 15px;
	margin-bottom: 15px;
	text-transform: uppercase;
}
#style.guideStep .list-inline>li>div.durInfo {
	font-size: 13px;
}
#style.guideStep .list-inline>li.active,
#style.guideStep .list-inline>li:hover {
	color: #af853b;
}
#style.guideStep .list-inline>li.active>div.durTitle,
#style.guideStep .list-inline>li:hover>div.durTitle {
	border-bottom: 1px solid #af853b;
}
#style.guideStep .list-inline>li.active img,
#style.guideStep .list-inline>li:hover img {
	background-color: #af853b;
}
/* =================== end style ================== */

/* =================== results ================== */
#guideResults .intro {
	color: black;
	font-size: 26px;
	padding-top: 30px;
	padding-bottom: 20px;
}

/* =================== end results ================== */