﻿/*color constants are copied into ColorsViewModel.cs*/
/* These Z-Indexes Are Intertwined In order to support popups*/
/*-------------------- Top Bar and Main Menu --------------------------*/
/* -------------------------------------- Basic Typography -------------------------------------- */
/* -------------------------------------- Responsive Constants -------------------------------------- */
/* Same widths as Bootstrap's responsive breaks: http://getbootstrap.com/2.3.2/scaffolding.html#responsive */
/* --------------------------------------
	Responsive
	
	Some CSS, Mixins, and Media Queries
	to assist in making things respnosive
	 
   -------------------------------------- */
/*color constants are copied into ColorsViewModel.cs*/
/* These Z-Indexes Are Intertwined In order to support popups*/
/*-------------------- Top Bar and Main Menu --------------------------*/
/* -------------------------------------- Basic Typography -------------------------------------- */
/* -------------------------------------- Responsive Constants -------------------------------------- */
/* Same widths as Bootstrap's responsive breaks: http://getbootstrap.com/2.3.2/scaffolding.html#responsive */
/* Animate the element when it's size/position changes (not just on breakpoints...) */
.breakpoint-animate {
		transition: width 0.5s ease-in-out, top 0.5s ease-in-out, left 0.5s ease-in-out, height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out, right 0.5s ease-in-out, bottom 0.5s ease-in-out;
		-ms-transition: width 0.5s ease-in-out, top 0.5s ease-in-out, left 0.5s ease-in-out, height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out, right 0.5s ease-in-out, bottom 0.5s ease-in-out;
		-moz-transition: width 0.5s ease-in-out, top 0.5s ease-in-out, left 0.5s ease-in-out, height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out, right 0.5s ease-in-out, bottom 0.5s ease-in-out;
		-webkit-transition: width 0.5s ease-in-out, top 0.5s ease-in-out, left 0.5s ease-in-out, height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out, right 0.5s ease-in-out, bottom 0.5s ease-in-out;
		-o-transition: width 0.5s ease-in-out, top 0.5s ease-in-out, left 0.5s ease-in-out, height 0.5s ease-in-out, padding 0.5s ease-in-out, margin 0.5s ease-in-out, right 0.5s ease-in-out, bottom 0.5s ease-in-out; }

/* Use this to build custom responsive shims for elements */
#LearnRetirementBanner {
		background-color: #316195;
		padding: 15px;
		color: #FFF;
		font-weight: 400;
		border-radius: 3px;
		margin-bottom: 20px; }
		#LearnRetirementBanner .btn {
				margin-right: 15px; }

#KBTourMessage.alert-success {
		background-color: #D7F7E3;
		border-color: #7FE4A8;
		color: #424242; }

#KBTourMessage div.system-message-item-text {
		font-size: 14px;
		font-weight: 400; }
		#KBTourMessage div.system-message-item-text #startKBTour {
				background-color: #FFF;
				border-color: #1EBD59;
				color: #1EBD59;
				text-decoration: none;
				margin-right: 15px; }
				#KBTourMessage div.system-message-item-text #startKBTour:hover {
						background-color: #1EBD59;
						color: #FFF; }

.popover {
		background-color: #dff0d8;
		border-color: #3c763d;
		color: #424242; }
		.popover.kb-tour {
				background-color: #fff;
				border-color: #316195; }
				.popover.kb-tour.bottom > .arrow {
						border-bottom-color: #5b218d;
						top: -10px; }
				.popover.kb-tour.right > .arrow {
						border-right-color: #5b218d; }
				.popover.kb-tour.top > .arrow {
						border-top-color: #5b218d; }
				.popover.kb-tour.left > .arrow {
						border-left-color: #5b218d; }
				.popover.kb-tour .popover-title {
						background-color: #316195;
						color: #fff;
						font-weight: bold; }
				.popover.kb-tour .popover > .btn {
						color: #424242; }
				.popover.kb-tour .btn-end, .popover.kb-tour #KBSearchDemo {
						display: none; }
				.popover.kb-tour .next-button {
						float: right; }

#step-2.kb-tour .popover-navigation .btn-end, #step-2.kb-tour .popover-navigation #KBSearchDemo {
		display: block; }

#step-2.kb-tour .popover-navigation .btn-end {
		float: right; }

#step-2.kb-tour .popover-navigation #KBSearchDemo {
		float: left; }

#step-2.kb-tour .popover-navigation .next-button {
		display: none; }
