/* TN Cisco Router Security Solutions v 2016.1 */

.crss-body-photo {
	position: relative;
	width: 100%;
	max-width: 1440px;
	height: 720px;
	margin: 0 auto;
	background-size: 1440px 720px;
	background-position: center;
	background-repeat: no-repeat;
}

.crss-content-backdrop {
	position: absolute;
	top: 310px;
	width: 100%;
	max-width: 1440px;
	height: 410px;
	margin: 0 auto;
	background-color: #DEE8F5;
	background-color: rgba(240,240,250,0.85);
}

.crss-banner {
	position: relative;
	width: 1044px;
	height: 310px;
	margin: 0 auto;
}

.crss-banner-text {
	position: absolute;
	bottom: 24px;
	width: 100%;
	text-align: center;
}

.crss-banner h1 {
	display: inline;
	font-family: "CiscoSansTTExtraLight", Arial, sans-serif;
	font-size: 40px;
	color: #FFF;
	text-align: center;
	line-height: 1.2em;
	font-weight: normal;
}

.crss-banner h2 {
	display: inline;
	font-family: "CiscoSansTTExtraLight", Arial, sans-serif;
	font-size: 24px;
	color: #FFF;
	text-align: center;
	line-height: 1.3em;
	font-weight: normal;
}

.crss-content {
	position: absolute;
	top: 310px;
	left: 0;
	right: 0;
	width: 1044px;
	height: 410px;
	margin: 0 auto;
}


/* ==================== Questionnaire ==================== */

.crss-questionnaire-header {
	height: 120px;
	margin: 20px 100px;
}

.crss-questionnaire-body {
	position: relative;
	min-height: 250px;
}

@media (min-width: 721px) {
	.crss-questionnaire-body {
		overflow: hidden;
	}
}

.crss-branch-defend-graphic {
	display: table-cell;
	width: 120px;
	height: 120px;
	background-size: 100%;
	background-repeat: no-repeat;
}

.crss-questionnaire-question {
	display: table-cell;
	font-family: "CiscoSansTTExtraLight", Arial, sans-serif;
	font-size: 32px;
	text-align: left;
	line-height: 1.2em;
	vertical-align: middle;
	color: #444;
}

.crss-questions {
	width: 1044px;
	text-align: center;
	margin: 0 auto;
	/*padding: 0;*/
}

.crss-questions li {
	display: inline-block;
	margin: 0 0 0 8px;
	width: 250px;
	height: 240px;
	vertical-align: top;
	cursor: pointer;
}

.crss-questions li:first-child {
	margin-left: 0;
}

.crss-questions li a {
	display: block;
	width: 100%;
	height: 150px;
	background-color: #FFF;
	border: 1px solid #A7A9AB;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.crss-questions li a:hover {
	background-color: #F3F6F9;
}

.crss-button-icon-container {
	width: 250px;
}

.crss-button-icon {
	width: 50px;
	height: 50px;
	margin: 20px auto 6px auto;
	background-size: 100%;
	background-repeat: no-repeat;
}

.crss-button-text {
	display: table-cell;
	width: 250px;
	height: 68px;
	padding: 0 14px;
	font-family: "CiscoSansTTExtraLight", Arial, sans-serif;
	font-size: 18px;
	line-height: 1.3em;
	vertical-align: middle;
}

.crss-button-description {
	width: 90%;
	margin: 8px auto 0 auto;
	font-family: "CiscoSansTTExtraLight", Arial, sans-serif;
}

.crss-hidden, h2.crss-hidden, .crss-result.crss-hidden, .crss-questionnaire-question.crss-hidden{
	display: none;
}

.crss-absolute {
	position: absolute;
}


/* ==================== Results ==================== */

.crss-questions li a.crss-solution-button {
	height: 76px;
	background-color: #049FD9;
	border: none;
}

.crss-questions li a.crss-solution-button:hover {
	background-color: #34ADDE;
}

.crss-questions li a.crss-solution-button .crss-button-text {
	height: 76px;
	color: #FFF;
}

.crss-results-cta {
	position: absolute;
	bottom: 24px;
	width: 1044px;
	text-align: center;
	font-size: 16px;
}

.crss-results-cta a {
	color: #004BAF;
}

.crss-questionnaire-padding {
	padding: 0 0 0 10px;
}

/* ==================== Controls ==================== */

.crss-controls {
	margin: 20px 0;
	text-align: center;
}

.crss-circle {
	margin-top: 11px;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: #c6c7ca;
	display: inline-block;
	margin-left: 20px;
	transition: background-color 0.5s ease;
}

.crss-circle-dark {
	background: #58585b;
	transition: background-color 0.5s ease;
	cursor: pointer;
}

.crss-circle-blue {
	background: #00a3db;
	transition: background-color 0.5s ease;
}


/* ==================== Back button ==================== */

.crss-back-container {
	display: table-cell;
	vertical-align: middle;
	padding-right: 35px;

}

.crss-back-button-disabled{
	opacity: 0.4;
}