/* PAGE
============================================================ */
.siyp-body {
	/*background-color: #e3e2e2;*/
	background-color: #fff;
}

/* QUESTION START
============================================================ */
.siyp-question-start-container {
	margin: 50px 0 0 0;
	padding: 0 0 70px 0;
}

@media (min-width: 768px) {
	.siyp-question-start-container {
		margin: 50px 0 0 0;
		padding: 0 30px 70px 30px;
	}
}

.siyp-start-test-image,
.siyp-analysis-start-image {
	width: 250px;
	height: auto;
}

.siyp-question-start-text {
	font-size: 18px;
}

.siyp-question-start-text h1 {
	color: #d3003e;
}

.siyp-start-test-arrow {
	width: 60px;
	height: 60px;
	margin: 0 0 10px 0;
	-webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.siyp-question-start-button a,
.siyp-question-start-button a:hover,
.siyp-question-start-button a:active,
.siyp-question-start-button a:visited {
	color: #333 !important;
	text-decoration: none;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.siyp-about-link {
	color: #aaa;
}

/* QUESTION TYPE: 1, VERTICAL BUTTONS
============================================================ */
.siyp-question-wrapper,
.siyp-analysis-wrapper {
	margin: 80px 0 0 0;
}

.siyp-question-container {
	margin: 0 0 3px 0;
	padding: 45px 30px 30px 30px;
	background-color: #f3f3f3;
	border: 0;
}

.siyp-question-pagination {
	color: #afb3b8;
	font-size: 11px;
	font-family: "HWTArtz";
	letter-spacing: 2px;
	margin-bottom: 10px;
}

.siyp-question-image img {
	width: 250px;
	height: auto;
}

.siyp-question-text {
	width: 100%;
	margin: 20px auto 30px auto;
}

@media (min-width: 768px) {
	.siyp-question-text {
		width: 70%;
	}
}

.siyp-question-text h3 {
	color: #292527;
	font-size: 20px;
	letter-spacing: 0.4px;
}

.siyp-question-answer-container {
	width: 400px;
	max-width: 100%;
	margin: 0 auto;
}

.siyp-question-btn {
	background-color: #fff;
	padding-left: 10px;
	padding-top: 20px;
	padding-right: 10px;
  	border: solid 1px #e9e9e9;
	border-radius: 0;
	white-space: normal;
}

/*.siyp-question-btn:hover {
	background-color: inherit;
}*/


.si-button-active:focus,
.siyp-question-btn:active,
.siyp-question-btn:hover {
	background-color: #fff;
	border: solid 1px #e9e9e9;
	box-shadow: none;
	outline: none;
}

.si-button-active,
.siyp-question-btn-marked {
	background-color: #e9e9e9 !important;
	border: solid 1px #e9e9e9;
	box-shadow: none;
	outline: none;
}

/* QUESTION TYPE: 2, RANGESLIDER
============================================================ */
.siyp-question-rangeslider-container {
	width: 400px;
	max-width: 100%;
	margin: 30px auto 0 auto;
}

.rangeslider,
.rangeslider__fill {
    background: #ccc;
    box-shadow: none;
}

.rangeslider--horizontal {
	height: 10px;
}

.rangeslider--horizontal .rangeslider__handle,
.rangeslider--horizontal .rangeslider__handle:active {
	background-color: #fff;
	background-image: none;
	border: 10px;
	top: -15px;

    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}

.rangeslider--horizontal .rangeslider__handle:after {
	width: 22px;
	height: 22px;
	background-color: #222f3c;
	background-image: none;
	box-shadow: none;
}

.siyp-question-rangeslider-value {
	width: 49%;
	font-family: 'hwt-artz', sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-top: 17px;
}

.siyp-question-rangeslider-value.pull-left {
	text-align: left;
}

.siyp-question-rangeslider-value.pull-right {
	text-align: right;
}

.question-selected .rangeslider__handle:after {
	background-color: #d3003e;
}

.rangeslider--active .rangeslider__handle:after {
	background-color: #d3003e;
}

/* ANALYSIS
============================================================ */
.siyp-analysisquestions {
    padding: 0;
    background-color: transparent;
}

.siyp-analysis-mastodon {
    margin: 0 0 3px 0;
    padding: 45px 30px 30px 30px;
    background-color: #f3f3f3;
    border: 0;
}

.siyp-analysis-answer-row {
	background-color: #e2e2e2;
}

.siyp-analysis-rangeslider-row {

}

.siyp-analysis-rangeslider-title,
.siyp-analysis-rangeslider-title-you {
	width: 80px;
	font-family: 'hwt-artz', sans-serif;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	position: relative;
	left: -40px;
}

.siyp-analysis-rangeslider-title {
	margin-top: 10px;
}

.siyp-analysis-rangeslider-bar,
.siyp-analysis-rangeslider-bar-you {
	width: 100%;
	height: 5px;
	background: #ccc;
	display: block;
	position: relative;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

.siyp-analysis-rangeslider-bar-you {
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

.siyp-analysis-rangeslider-fill,
.siyp-analysis-rangeslider-fill-you {
	width: 23%;
	height: 100%;
	background: transparent;
	position: absolute;
	top: 0;
}

.siyp-analysis-rangeslider-value {
	width: 49%;
	font-family: 'hwt-artz', sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-top: -10px;
}

.siyp-analysis-rangeslider-value.pull-left {
	text-align: left;
}

.siyp-analysis-rangeslider-value.pull-right {
	text-align: right;
}

.siyp-analysis-rangeslider-fill-you:before {
	border: solid;
	border-color: #d3003e transparent;
	border-width: 10px 10px 0 10px;
	bottom: 5px;
	content: "";
	left: 100%;
	margin-left: -10px;
	margin-right: 10px;
	position: absolute;
	z-index: 99;
}

.siyp-analysis-rangeslider-fill:after {
	border: solid;
	border-color: #041425 transparent;
	border-width: 0 10px 10px 10px;
	bottom: -10px;
	content: "";
	left: 100%;
	margin-left: -10px;
	margin-right: 10px;
	position: absolute;
	z-index: 99;
}

.siyp-analysis-icon {
	width: 30px !important;
	height: 30px !important;
	margin: 0 10px 10px 10px;
	float: left;
}

/*.siyp-analysis-header-wrapper {
    margin: 50px auto 0 auto;
	padding: 0 30px 50px 30px;
}

.siyp-analysisquestions {
	padding: 0;
	background-color: transparent;
}

.siyp-analysis-mastodon {
	margin: 0 0 3px 0;
    padding: 45px 30px 30px 30px;
    background-color: #e2e2e2;
    border: 0;
}

.siyp-analysis-answer-row {
	background-color: #f2f2f2;
}

.siyp-analysis-youranswer {
	color: #d3003e;
}

.siyp-analysis-rangeslider-title-you {
	color: #d3003e;
}

.siyp-analysis-rangeslider-bar {
	background: #d8d8d8;
}

.siyp-analysis-rangeslider-fill,
.siyp-analysis-rangeslider-fill-you {
    background: #222f3c;
}

.siyp-analysis-rangeslider-fill-you {
	background: #d3003e;
}*/