/* ==============
   Child Development Tabs
   ============ */
   
#development-stages { width: 100%; }

	#development-stages ul#months {
		padding: 0;
		margin: 0;
		list-style:none outside none;
		}

		#development-stages ul#months li { display: block; }
			
			#development-stages ul#months li a {
				-webkit-flex:1 1 auto; 
				-ms-flex:1 1 auto; 
				flex:1 1 auto;
				display: block;
				overflow:hidden;
				position:relative;
				cursor: pointer;
				margin: 0 0 10px 0;
				padding: 15px 0 15px 5px;
				width: 100%;
				text-decoration: none;
				text-align: center;
				outline: 0;
				font-size: 16px;
				}
				
				#development-stages ul#months li a:hover,
				#development-stages ul#months li.active a {
					z-index: 2;
					margin-top: 0;
					background: #F8931D; /* Change this color to match site */
					color: #FFF; /* Change this color to match site */
					}
			
	#development-stages .info-area { 
		width: 100%;
		position: relative;
		height: 650px;
		}
		
		#development-stages .bx-wrapper { 
			background: none;
			top: 0;
			}
		
		#development-stages .bx-viewport { overflow: visible !important; /* Important so that slides will show when a new tab is opened */ }
			
			#development-stages .info-area img {
				display: block;
				margin: 0 auto;
				}
			
			#development-stages .info-area h3 { padding-left: 30px; }
			
			#development-stages .info-area #slider1 li,
			#development-stages .info-area #slider2 li,
			#development-stages .info-area #slider3 li,
			#development-stages .info-area #slider4 li,
			#development-stages .info-area #slider5 li { 
				z-index: 500;
				width: auto !important; /* Important so that slides will show when a new tab is opened */
				}
			
			#development-stages h4.dev { color: #B57BBB; }
			#development-stages h4.feeding { color: #8CB8FB; }
			#development-stages h4.speech { color: #5CBC62; }
		
	#development-stages .bx-wrapper .bx-pager { 
		top: -15px;
		right: 0;
		width: 100%;
		display: block;
		position: absolute;
		}
		
		#development-stages .bx-pager a { 
			float: right;
			font-size: 11px;
			color: #FFF; /* Match content area background */
			text-decoration: none;
			background: none;
			border: 0;
			border-radius: 0;
			box-shadow: 0 0;
			height: auto;
			width: auto;
			text-indent: 0;
			display: block;
			}

			#development-stages .bx-pager a[data-slide-index="0"]:before { content: "Speech"; background: #5CBC62; padding: 4px; }
			#development-stages .bx-pager a[data-slide-index="1"]:before { content: "Feeding"; background: #8CB8FB; padding: 4px; }
			#development-stages .bx-pager a[data-slide-index="2"]:before { content: "Developmental Stages"; background: #B57BBB; padding: 4px; }
		
			#development-stages .bx-pager a:hover {
				opacity: .8;
				background: none;
				}

			.lt-ie8 #development-stages a.bx-pager-link:hover {
				zoom: 1;
				filter: alpha(opacity=80);
				}
				
@media (min-width: 768px) {
	#development-stages ul#months {
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		-webkit-flex-flow: row nowrap;
		-ms-flex-flow: row nowrap;
		flex-flow: row nowrap;  
		}
		
	/* Flexbox Fallback */
	.no-flexbox #development-stages ul#months { 
		display: table;
		table-layout: auto;
		border-collapse: collapse;
		}
	
		#development-stages ul#months li {
			display: -webkit-flex;
			display: -ms-flexbox;
			display: flex;
			-webkit-flex:1 1 auto;
			-ms-flex:1 1 auto;
			flex:1 1 auto;
			}
			
		.no-flexbox #development-stages ul#months li { 
			display: table-cell;
			width: auto;
			}
			
	#development-stages .info-area { height: auto; }
			
		#development-stages .info-area img { 
			position: absolute;
			top: 30px;
			left: 0;
			z-index: 999;
			}
			
		#development-stages .info-area #slider1 li,
		#development-stages .info-area #slider2 li,
		#development-stages .info-area #slider3 li,
		#development-stages .info-area #slider4 li,
		#development-stages .info-area #slider5 li { padding-left: 215px; /* Width of images */ }
	
		
		#development-stages .bx-wrapper .bx-pager { top: 0; }
	}
	
@media (min-width: 992px) {
	#development-stages ul#months li a { font-size: 18px; }
	}