@charset "utf-8";

@media only screen and (min-width:1440px) {
	#assessment
		{width:1440px !important; padding-top:749px !important;}
}

body, html
	{box-sizing:border-box; font-size:24px}
*, :after, :before 
	{box-sizing: inherit;}
a 	{color:#7CC7FF;}
p 	{font-size:1em; line-height:1.65;}
ol, ul
	{font-size:0.667rem;}


#ibm-search.ibm-search-link:before, .ibm-masthead-iconsonly button:before
	{font-size:1rem;}
#ibm-footer.ibm-alternate .ibm-col-1-1
	{padding-bottom:0;}
.select2-container--default .select2-selection--single .select2-selection__arrow b:before
	{font-size:1rem;}
#ibm-content-wrapper
	{background:#000;}

#assessment
	{position: relative; width:100%; margin:0 auto; padding-top:56%; font-family:'IBM Plex Sans',ibm-plex-sans,'Helvetica Neue',Arial,sans-serif; background:#000;}

#assessment .progress
	{position:absolute; top:0; left:0; width:100%; z-index:20; background:#000; opacity:0;
	 transition: all 0.5s 0.3s ease-in}
#assessment .progress.on
	{opacity:1;}
#assessment .progress .bg
	{margin:0.9% 1.5%; height:.25em; background:#666;}
#assessment .progress .bar
	{width:0%; height:100%; background:#418CFF;
	 transition: width 0.4s ease-in-out;}

#assessment .credit
	{position:absolute; bottom:1em; left:6.5%; color:#777; font-size:.583em; opacity:0; text-shadow:1px 1px 1px #000; z-index:20;
	 transition: opacity 0.4s 1s ease-in;}
#assessment .credit.on
	{opacity:1;}

#assessment .page
	{position:absolute; width:100%; height:100%; top:0; left:0; color:#fff; opacity:0; z-index:1; 
	 background:#222 no-repeat center center; background-size:auto 100%; opacity:0;
	 transition: all 0.3s ease-in;}
#assessment .page.next
	{background-size:auto 105%}
#assessment .page.on
	{opacity:1; z-index:10; background-size:auto 103%; transition: all 0.5s 0.2s ease-out;}

#assessment .land
	{background-size:auto 105%;}
#assessment .land.on
	{background-size:auto 100%;}

#assessment .next.question.with-answer
	{opacity:1; background-size:auto 103%;}

#assessment .page .content
	{width:92%; margin:2.4em 0 1.1em 5%; padding:7.5em 1.5% 1.15em;}
#assessment .page.question .content
	{height:85%;}
#assessment .page.has-form .content
	{display:flex; flex-flow:row wrap; width:100%; margin:1.25em auto 0; padding-top:3.5em;}
#assessment .land .content
	{padding-top:1.15em;}
#assessment h1 
	{margin:0 0 .25em; font-weight: normal; font-size:1.83em; letter-spacing: -0.01em; }
#assessment h2
	{position:absolute; top:2.25em; display:block; width:90%; font-weight: 400; font-size:1.45em; margin:0 0 0.4em 6.5%; line-height:1.15; letter-spacing: 0.003em; opacity:0; text-shadow: 3px 3px 3px #000;
	 transition:all 0.3s 0.7s ease-in;}
#assessment .has-form h2
	{top:1.5em}
#assessment .next.question.with-answer h2, #assessment .answer h2
	{opacity:1; background-size:auto 103%;}
#assessment .page.on h2
	{opacity:1;}
#assessment h2 span
	{display:block; font-size:.5em; line-height: 2;
	 transition: opacity 0.3s ease-in;}
#assessment .page.has-form .elements
	{flex:1; text-align: right;}
#privacyid-container
	{flex:1; margin-left:3%; margin-right:-1%; opacity:0;
	 transition:opacity 0.4s 1.55s ease-in;}
.page.on #privacyid-container
	{opacity:1;}
#privacyid
	{width:84%; height:30em; padding:1.5em 3% 0; letter-spacing: .02em; font-size:.67em; background:#000;}
#privacyid p
	{line-height:1.4; font-size:1em; padding-bottom:1.2em;}
#privacyid #ncHeading
	{padding-bottom:1.4em;}
#privacyid .ibm-checkbox-wrapper
	{margin-top: -0.4em;}
#privacyid .ibm-checkbox-wrapper:first-child
	{margin-top:0;}
#privacyid  .nc-gdpr-info
	{margin-top:1em; padding-bottom:1.4em;}

#assessment input[type="text"], #assessment select
	{width:68%; margin-right:0%; margin-bottom:.6em; padding:2% 1em; font-size:0.875em; border: 2px solid #ccc; opacity:0;
	 transition: all 0.3s ease-in;}
#assessment .select2-container
	{width:68% !important; margin-right:0%; margin-bottom:0.6em; opacity:0;}
#assessment select[name="agency"] + .select2-container
	{transition-delay: 1.25s !important}
#assessment select[name="country"] + .select2-container
	{transition-delay: 1.45s !important}
#assessment select[name="state"] + .select2-container
	{transition-delay: 1.65s !important}
#assessment .select2-container .select2-selection--single
	{height:2.8em; padding-left:1em; font-size:.875em; border:2px solid #ccc;}
.select2-container--default .select2-selection--single .select2-selection__arrow
	{right:10px;}
footer .select2-container .select2-selection--single .select2-selection__rendered
	{font-size:0.667rem;}
.select2-container--default .select2-selection--single .select2-selection__rendered
	{line-height: 2.5em; text-align: left; padding:0 40px 0 0;}
footer .select2-container--default .select2-selection--single .select2-selection__rendered
	{margin-left:10px;}
.elements .extra 
	{width: 68%; font-size: .667em; text-align: left; margin: 0 0 0 auto; opacity: 1;
	 transition: opacity 0.4s 1.55s ease-in;}
.page.on .elements .extra
	{opacity:1;}
.ibm-styled-checkbox+label::before, .ibm-styled-checkbox~.ibm-field-label::before, .ibm-styled-radio+label::before, .ibm-styled-radio~.ibm-field-label::before
	{width:16px; height:16px; background:transparent; border: 1px solid #fff;}
.ibm-styled-checkbox:checked+label::before, .ibm-styled-checkbox:checked~.ibm-field-label::before, .ibm-styled-radio:checked+label::before, .ibm-styled-radio:checked~.ibm-field-label::before
	{background:transparent; border:1px solid #fff;}
.ibm-styled-checkbox+label, .ibm-styled-checkbox~.ibm-field-label
	{margin-left:0 !important; padding-left:24px;}
.ibm-styled-checkbox+label::after, .ibm-styled-checkbox~.ibm-field-label::after, .ibm-styled-radio+label::after, .ibm-styled-radio~.ibm-field-label::after
	{left:5px; top:3px; height:12px; width:6px;}
#assessment .page.on input:not([type="checkbox"]), #assessment .page.on select, #assessment .page.on .select2-container
	{opacity: 1;
	 transition: all 0.7s ease-in;}
#assessment .page.on input[type="submit"]
	{transition-duration: 0.3s;}

#assessment .question .option
	{position:relative; display: inline-block; width:46%; max-width: 500px; margin:0 3% 1.25em 0; padding:1em 2%; font-size: .875em; cursor: pointer; 
	 background:#000; border:2px solid #0259E7;opacity:0;
	 transition: all 0.3s ease-in;}
#assessment .page.on .option
	{opacity: 1;
	 transition: opacity 0.7s ease-in;}
#assessment .question .option.selected
	{background-color:#0259E7;}
#assessment .question .option:before
	{content:" "; position:absolute; right:-1%; top:40%; font-size:0.8em; padding:.75em; margin:-0.25em 1em -0.25em; border:2px solid #000; color:rgba(0,0,0,0); border-radius: 50%;}
#assessment .question .option.selected:before
	{color:#fff; border-color:#fff; background:url(../images/icon_check.png) no-repeat center;}

#assessment .answer
	{background-size:auto 103%;}
#assessment .answer.on12
	{transition: all 0.7s 0s ease-out}
#assessment .answer .content
	{padding-top:6em; height:85%;}

#assessment .chart
	{float:left; position:relative; width:48%;padding-top:35%; }
#assessment .chart .bg
	{position:absolute; top:1.25em; right:11%; width:64%; height:79%; border:1px solid rgba(255,255,255,0);
	 transition: border-color 0.3s 0.4s ease-in;}
#assessment .answer.ready .chart .bg
	{border-color:rgba(255,255,255,1);}
#assessment .chart .bg .tick
	{position:absolute; left:0; width:100%; border-top:1px solid #fff; opacity:0;
	 transform:translate3d(0,0,0);
	 transition: opacity 0.3s ease-in;}
#assessment .answer.ready .chart .bg .tick
	{opacity: 1;}
#assessment .chart .bg .tick span
	{position:absolute; right:100%; margin:-.5em .5em 0 0; font-size: .5em; color:#fff; }
#assessment .chart .items
	{position:absolute; top:0; left:0; width:100%; height:100%; z-index:2; opacity:0.95}
#assessment .chart .polar-overlay
	{position: absolute; width: 100%; height:100%; left:-50%; top:-50%; z-index:100;}
#assessment .chart .item
	{position:absolute; bottom:0; height:0; width:5%; margin:0 6%; background:#3dbb61; max-height:0;
	 transition: all 0.7s 1s ease-out;}
#assessment .answer.ready .chart .item
	{max-height: 100%; max-width: 100%; opacity:1;}
#assessment .chart .item:nth-child(2) {background-color:#fa75a6;}
#assessment .chart .item:nth-child(3) {background-color:#6ea6ff;}
#assessment .chart .item:nth-child(4) {background-color:#ff767c;}
#assessment .chart .item:nth-child(5) {background-color:#00bab6;}
#assessment .chart .item:nth-child(6) {background-color:#bb8eff;}
#assessment .chart .item:nth-child(7) {background-color:#30b0ff;}
#assessment .chart .item:nth-child(8) {background-color:#9fa5ad;}

#assessment .tails
	{position:absolute; top:1.25em; right:11%; width:64%; height:79%; z-index:2;} 
#assessment .tails .tail
	{position:absolute; bottom:0; height:0; width:0%; margin:0 0 0 8%; border-top: 1px solid #3dbb61; border-left: 1px solid #3dbb61; max-width:0; max-height:0;
	 transform:translate3d(0,0,0);
	 transition:all 0.3s 1.4s ease-in, max-width 0.3s 1.6s ease-out;}
#assessment .answer.ready .tails .tail
	{max-width: 120%; max-height: 100%;}

#assessment .chart.polar .tails
	{right:25%; top:-51%}
#assessment .chart.polar .tails .tail
	{bottom:95.5%; width:auto; right:0; margin-left:0;
	 transition:all 0.3s 1.4s ease-in, max-width 0.3s 1.4s ease-out;}
#assessment .chart.polar .tails .rad-tail
	{position: absolute; bottom:-0%; left:0; height:0%; border-left:1px solid #3dbb61;
	 transform: translate3d(0,0,0) rotateZ(30deg) translateY(-50%);
	 transition:height 0.4s 0.9s ease-in, bottom 0.4s 0.9s ease-in;}
#assessment .answer.ready .chart.polar .tails .rad-tail
	{bottom:-55%; height:110%;}
#assessment .tails .tail.c1, #assessment .chart .tails .rad-tail.c1
	{border-color:#fa75a6;}
#assessment .tails .tail.c2, #assessment .chart .tails .rad-tail.c2
	 {border-color:#6ea6ff;}
#assessment .tails .tail.c3, #assessment .chart .tails .rad-tail.c3
	 {border-color:#ff767c;}
#assessment .tails .tail.c4, #assessment .chart .tails .rad-tail.c4
	 {border-color:#00bab6;}
#assessment .tails .tail.c5, #assessment .chart .tails .rad-tail.c5
	 {border-color:#bb8eff;}
#assessment .tails .tail.c6, #assessment .chart .tails .rad-tail.c6
	 {border-color:#30b0ff;}
#assessment .tails .tail.c7, #assessment .chart .tails .rad-tail.c7
	 {border-color:#9fa5ad;}

#assessment .chart.polar .bg
	{height:88%; top:56%; right:-15%; border:none;}
#assessment .chart.polar .bg .tick
	{border:1px solid #fff; border-radius: 50%;}
#assessment .chart.polar .bg .tick span
	{position:absolute; right:0; width:100%; margin:-1.25em 0 0; text-align: center; font-size: .5em; color:#fff; }
#assessment .chart.polar .item
	{bottom:100%; max-height: 100%; margin:0; background:none; opacity:0;
	 transition:transform 0.7s 0.7s ease-out, opacity 0.4s 0.7s ease-in;}
#assessment .chart.polar .item svg
	{position: absolute; bottom:50%; left:50%; width:100%;}
#assessment .chart.polar .item svg.gt90
	{bottom:0;}
#assessment .chart.polar .item path
	{fill:#3dbb61; z-index:1;}
#assessment .chart.polar .item				
	{z-index:1;}

#assessment .chart .item:nth-child(2) path {fill:#fa75a6;}
#assessment .chart .item:nth-child(3) path {fill:#6ea6ff;}
#assessment .chart .item:nth-child(4) path {fill:#ff767c;}
#assessment .chart .item:nth-child(5) path {fill:#00bab6;}
#assessment .chart .item:nth-child(6) path {fill:#bb8eff;}
#assessment .chart .item:nth-child(7) path {fill:#30b0ff;}
#assessment .chart .item:nth-child(8) path {fill:#9fa5ad;}

#assessment .answer .chart .item .brief
	{display:none;}
#assessment .answer.ready .chart .item.not-selected
	{opacity:0.6;
	 transition:all 0.7s 1s ease-out, opacity 0.4s 1.6s ease-in;}
#assessment .answer.ready .chart .item.not-selected.hover,
#assessment .answer.ready .chart:not(.polar) .item.not-selected:hover
	{opacity: 1; z-index:10 !important; transition: opacity 0.4s ease-in;}
#assessment .answer.ready .chart .item.not-selected.hover .brief,
#assessment .answer.ready .chart:not(.polar) .item.not-selected:hover .brief
	{display:block; position: absolute; bottom:100%; font-size: .5833em; margin:0 0 3px -20px; text-align: center; color:#000; z-index:2; animation:fade-in-from-none 0.3s ease-in;}

@keyframes fade-in-from-none {
	0% {display:block; opacity:0;}
	100% {opacity:1}
}
#assessment .answer.ready .chart .item.not-selected .brief span
	{display:block; background:#fff; padding: 0.25em 1em 0.6em;}
#assessment .answer.ready .chart .item.not-selected .brief:after
	{content:"\0020"; display:block; width:10px; height:10px; margin:-5px 0 0 25px; z-index:1; background:#fff; transform:rotateZ(45deg);}

#assessment .answer.ready .polar.chart .item.not-selected
	{opacity:1;
	 transition:transform 0.7s 0.7s ease-out, opacity 0.4s 0.7s ease-in;}
#assessment .answer.ready .polar.chart .item.not-selected path
	{opacity:0.6;
	 transition:opacity 0.4s 1.6s ease-in;}
#assessment .answer.ready .polar.chart .item.not-selected .brief
	{bottom:70%; left:90%;}
#assessment .answer.ready .polar.chart .item.not-selected .brief:after
	{display:none;}
#assessment .info
	{float:left; width:52%; margin-left:-10px; padding-top:1em;}
#assessment .info .item
	{line-height:1; margin:0.4em 0 0.2em 0; padding-left:1%; font-size:1.08em; border-left:4px solid #3dbb61; opacity:0; text-shadow: 1px 1px 2px #000;
	 transform: translate3d(0,0,0);
	 transition: opacity 0.4s 1.4s ease-in;}
#assessment .answer.ready .info .item
	{opacity:1;}
#assessment .info .item.on
	{display:block;}
#assessment .info .item.c1 {border-color:#fa75a6;}
#assessment .info .item.c2 {border-color:#6ea6ff;}
#assessment .info .item.c3 {border-color:#ff767c;}
#assessment .info .item.c4 {border-color:#00bab6;}
#assessment .info .item.c5 {border-color:#bb8eff;}
#assessment .info .item.c6 {border-color:#30b0ff;}
#assessment .info .item.c7 {border-color:#9fa5ad;}
#assessment .info span
	{display:block; min-width: 20%; margin-right:2%;}
#assessment .info .advice
	{font-size:0.75em; margin-top:1.5em; opacity:0; text-shadow: 1px 1px 2px #000;
	 transition: opacity 0.4s 0s ease-in;}
#assessment .info .advice.on 
	{opacity:1;}

#assessment .btns
	{position:absolute; bottom: 2em; right:9%; width:100%; text-align: right; }
#assessment .btns .shield 
	{display:none;}
#assessment div.btn, input[type="submit"]
	{display: inline-block; margin:0 0 0 1%; padding: 0.5em 3.3em 0.5em 2%; color:#fff; font-size: 0.75em; font-family:'IBM Plex Sans',ibm-plex-sans,'Helvetica Neue',Arial,sans-serif;	 background: #0530AD; cursor: pointer; opacity:0; border:none !important;
	 transition:all 0.3s ease-in;}
#assessment .has-form div.btn-next
	{margin-right:11%}
#assessment .page.on div.btn
	{opacity:1;
	 transition:all 0.5s 0.9s ease-out;}
#assessment .page.answer.on div.btn
	{transition-delay: 2.1s !important;}
#assessment div.btn-prev
	{padding:.5em 0; overflow:hidden; white-space: nowrap; color:rgba(255,255,255,0); vertical-align: top;
	 background-image:url(../images/icon_btn_prev.png); background-repeat: no-repeat; background-position: center;}
#assessment div.btn-next, input[type="submit"]
	{background-image:url(../images/icon_btn_next.png); background-repeat: no-repeat; background-position: 91% center;}
#assessment div.btn-next.disabled
	{cursor:default; background-color:#ccc;}
#assessment div.btn-next.instant
	{transition-delay: 0s !important;}

#assessment .land .content
	{width:63%; margin-top:8em; margin-left:20%; background: rgba(0,0,0,0.7);opacity:0;
	 transition: all 0.3s ease-in;}
#assessment .land.on .content 
	{opacity:1; transform:scale3d(1,1,1);
	 transition:all 0.3s 0.7s ease-out;}
#assessment .land p
	{margin:0}
#assessment .land div.btn
	{margin-left:20%;}

#assessment .repop, #assessment .repop *, #assessment .repop .info .advice
	{transition:none !important;}


@media only screen and (max-width:1290px) {
	#assessment h2
		{top:1.25em;}
	#assessment .land .content
		{margin-top:4.5em;}
	#assessment .page.question .content
		{padding-top:0; margin-top:7.5em;}
	#assessment .page.question.q8 .content
		{margin-top:8.5em;}
	#assessment .page.question.q2 .content, #assessment .page.question.q9 .content, #assessment .page.question.q10 .content
		{margin-top:9.5em;}
	#assessment .page.question.has-form .content
		{margin-top:6.5em;}
	#assessment .answer .content
		{margin-top:4em;}
	#assessment .answer.a2 .content, #assessment .answer.a9 .content, #assessment .answer.a10 .content
		{margin-top:6em;}
}

@media only screen and (max-width:1090px) {
	body, html
		{font-size:20px;}
	
	#assessment
		{padding-top:64%;}
	#assessment h2
		{font-size:1.22em; line-height: 1.2; margin-left:6.5%;}
	#assessment .credit
		{bottom:1em;}
	#assessment .land .content
		{position:absolute; bottom:9em; width:90%; margin-top:4em; margin-left:5%; padding-left:3%; padding-right:3%;}
	#assessment .land div.btn
		{position:absolute; bottom:7em; margin-left:5%; font-size:.875em;}
	#assessment .btns
		{right:8%; bottom:4em; z-index:20;}

	#assessment .answer .content
		{padding-top:2em;}
	
	#assessment .page.question.has-form .content
		{margin-top:5.5em;}
	#privacyid
		{height:29em; overflow:auto;}
	#privacyid-container:after 
		{content: ""; width: 100%; height: 3em; position: absolute; bottom: 0;
		 background: linear-gradient(transparent, rgba(0,0,0,1) 80%, #000) left repeat;}
	
	
}

@media only screen and (max-width: 768px) {
	#assessment
		{padding-top:118%;}
	#assessment .question .option
		{width:97%; margin-right:0; max-width:none;}

	#assessment .btns
		{bottom:3em;}
	
	#assessment .chart
		{width:67%; padding-top:50%; margin-left:16%;}
	#assessment .polar.chart
		{padding-top:63%; margin-bottom:1em; margin-top: -2em;}
	#assessment .chart.polar .bg
		{height:69%;}
	#assessment .chart .item
		{width:8%;}
	#assessment .tails
		{display:none;}

	#assessment .info
		{width:100%; padding-top:0;}
	#assessment .info span
		{display:inline-block; min-width:30%;}
	#assessment .info .advice
		{position:relative; top:0; left:-3%; width:100%; font-size:0.85em;}

	#assessment .page.a8 .content
		{margin-top:7em;}
	#assessment .page.a2 .content, #assessment .page.a9 .content, #assessment .page.a10 .content
		{margin-top:5.5em;}
	#assessment .page.has-form .elements
		{margin-top:0.5em;}
	#assessment input[type="text"]
		{padding:0.5em 1em;}
	#assessment .select2-container .select2-selection--single
		{height:2.4em;}
	.select2-container--default .select2-selection--single .select2-selection__rendered
		{line-height: 2.25;}
	.select2-container--default .select2-selection--single .select2-selection__arrow
		{top:-3px;}

	#assessment .page.has-form .content
		{flex-flow:column; height:auto;}
	#assessment .page.has-form .elements
		{width:90%; margin:0 auto;}
	#assessment input[type="text"], #assessment select, #assessment .select2-container,
	.elements .extra
		{width:100% !important;}
	
	#privacyid-container
		{width:90%; margin:0.5em auto;}
	#privacyid-container:after
		{display:none;}
	#privacyid
		{width:100%; height:auto; margin-bottom:2em; overflow: visible;}
	
	
}

@media only screen and (max-width: 600px) {
	body, html
		{font-size:18px;}
	
	#assessment h1
		{font-size:1.5em;}
	#ibm-masthead
		{position:fixed;}
	#ibm-top
		{position:absolute; top:100%; margin-top:-50px;}
	
	#footerSliddeContainer
		{position: relative; z-index:10;}
	.ibm-footer-corporate-links
		{padding-top:0;}
	
	#assessment
		{position:fixed; top:50px; bottom:50px; padding-top:0;}
	
	#assessment .land .content
		{bottom:6em}
	#assessment .land p
		{font-size:.889em;}
	#assessment .land div.btn
		{bottom:5em;}
	#assessment .question.has-form
		{overflow:auto;}
	#assessment .question .option
		{padding:0.75em 2em 0.75em 2%;}
	#assessment .page.question.q2 .content, #assessment .page.question.q9 .content
		{margin-top:10em;}
	#assessment .page.question.q3 .content, #assessment .page.question.q7 .content
		{margin-top:5.5em;}
	
	#assessment .answer, #assessment .question
		{overflow:auto; padding-bottom:2em;}
	
	#assessment .page.a5 .content
		{margin-top:5em;}
	#assessment .page.a7 .content
		{margin-top:4em;}
	#assessment .page.a10 .content
		{margin-top:6.5em;}

	#assessment .btns
		{position: fixed; bottom:50px; right:0; height:100px; padding:10px 8% 40px 0; clip:rect(auto,auto,auto,auto); background:transparent;}
	#assessment .btns .shield 
		{position: fixed; display:block; top: 50px; bottom: 50px; width:100%; background-position: center center; background-size: auto 103%;
		-webkit-mask-image: -webkit-linear-gradient(bottom, rgba(0,0,0,1), rgba(0,0,0,1) 70px, rgba(0,0,0,0) 100px); mask-image: linear-gradient(bottom, rgba(0,0,0,1), rgba(0,0,0,1) 70px, rgba(0,0,0,0) 100px);}
	#assessment div.btn-prev
		{position:fixed; right:40%; bottom:85px;}
	#assessment div.btn-next
		{position:fixed; right:8%; bottom:85px;}
	
	#assessment .chart
		{width:83%; padding-top:65%; margin-left:2%;}
	#assessment .polar.chart
		{padding-top:80%; margin-bottom:0.3em;}
	#assessment .chart.polar .bg
		{width:67.5%; right:-23%; top:52%;}
	
	#assessment .info
		{margin-left:0; margin-bottom:4em;}
	#assessment .chart.polar + .info
		{margin-top:-1em;}
	#assessment .info .advice
		{left:0;}
	
	#assessment .page.question .content
		{height:auto;}
	#assessment .page.a2 .content, #assessment .page.a9 .content, #assessment .page.a10 .content
		{margin-top:7.5em;}
	
}

