#estimate-retirement-svg,
		#calendar-pay-days-svg,
		#new-to-calPERS-svg, 
		#life-event-svg {
			fill:#FFFFFF;
			position:absolute;
		}
		#new-to-calPERS-svg{
			top:23%;
			left:27%;
		}
		#life-event-svg{
			top:20%;
			left:15%;
		}
		#estimate-retirement-svg{
			top:27%;
			left:31%;
		}
		#calendar-pay-days-svg{
			top:25%;
			left:29%;
		}
		
		.top_task_link:hover .top_task_circle #new-to-calPERS-svg,
		.top_task_link:hover .top_task_circle #life-event-svg,
		.top_task_link:hover .top_task_circle #estimate-retirement-svg,
		.top_task_link:hover .top_task_circle #calendar-pay-days-svg
		
		{
			fill:#B95726;
		}
	.top_task_container{
		height:200px;
	}
	.top_task_link{
		color:#FFF;
	}
	.top_task_circle{
		border-radius:60px;
		background:#B95726; 	
	}
	.top_task_description{
		color:#B95726;
		font-size:20px;
		line-height:22px;
		font-weight:600;
	}
	.top_task_link:hover {
		background-color: #B95726;
		color:#FFF;
	}
	.top_task_link:hover
	.top_task_description{
		background:#B95726;
		color:#FFFFFF;
		text-decoration:underline;
	}
	
	.top_task_link:hover
	.top_task_circle{
		background:#FFFFFF;
		color:#B95726;
	}
	a.top_task_link:focus {
		outline-offset:2px;		
		outline: 2px solid #000000;
	}
	.top_task_link:focus .top_task_circle{ 
		color:#FFF;
	}
	.top_task_link:focus:hover .top_task_circle{
		color: #B95726;
	}
	/*********************** mobile ***********************/

	
	@media (max-width: 991px) {
		
	
		.top_task_container {
			/*border-top: 2px solid #0070aa;*/
			margin-top:30px;
			height: 275px;
			display: block;
		}
		.top_task_md_visibile{  /*md: medium device - https://getbootstrap.com/docs/3.3/css/#grid */
			display:none;
		}
		.top_task_sm_visibile{  /*sm: small device - https://getbootstrap.com/docs/3.3/css/#grid */
			display:block;
		}
		a.top_task_link{
			margin: 10px 0 0 10px;
			display:table;
			width:100%;
			position:relative;
		}
		.top_task_circle {
			position:relative;
			float:left;
			clear:left;
			width:40px;
			height:40px;
		}	
		.top_task_icon{
			position:absolute;
			top:23%;
			left:23%;
		}
		/*#new-to-calPERS-svg{
			width:20px;
			height:26px;
		}*/
		#estimate-retirement-svg{
			transform: scale(1.45);
			top:14px;
			left:17px;
		}
		#top_task_icon-4{
			top:6.5px;
			left:8.5px;
		}
		#top_task_icon-5{
			top:6.5px;
			left:8.5px;
		}
		.top_task_icon:before{
			font-size: 2em;
		}
		#top_task_icon-3:before,
		#top_task_icon-5:before{
			font-size: 1.5em;
		}
		.top_task_description{
			text-align: center;
			position:absolute;
		}
		#top_task_description-1,
		#top_task_description-2,
		#top_task_description-3-mobile,
		#top_task_description-4,
		#top_task_description-5 {
			top: 9px;
			left: 70px;
		}
		
		@media (min-width: 753px) {
			.top_task_container{
				border-top:none;
			}
		}
		
	}/*mobile*/

	/* Medium devices (desktops, 992px and up) */
	@media (min-width: 992px) {
		.top_task_md_visibile{  /*md: medium device - https://getbootstrap.com/docs/3.3/css/#grid */
			display:block;
		}
		.top_task_sm_visibile{  /*sm: small device - https://getbootstrap.com/docs/3.3/css/#grid */
			display:none;
		}
		.top_task_container{
			display:flex;
			margin-left:-10px;
	     }
		 .top_task_outer{
			 width:228px;
			 height:150px;
			 padding: 30px 10px 0px 10px;
		 }
		 
		.top_task_link{
			height:150px;
			display:flex;
			flex-direction: column;  /* make main axis vertical */
			align-items: center;     /* center items horizontally, in this case */
			gap:10px;
			flex: 1 0 0;
			
			justify-content: center; /* center items vertically, in this case */
			position:relative;
		}
		.top_task_circle{
			position:absolute;
			top:15%;
			left:35%;
			width:60px;
			height:60px;
		}
		.top_task_icon{
			position:absolute;
			top:25%;
			left:23%;
			font-size:32px;
		}
		#new-to-calPERS-svg{
			transform:scale(1.10);
			top:16px;
		}
		
		#life-event-svg{
			transform: scale(.90);
		} 
		
		#estimate-retirement-svg{
			transform: scale(1.45);
			top:22px;
			left:25px;
		}
		#top_task_icon-4{
			font-size: 40px;
			top:10px;
			left:15px;
		}
		#calendar-pay-days-svg{
			transform: scale(1.34);
			top:18px;
			left:22px;
		}
		.top_task_description{
			text-align: center;
			position:absolute;
		}
		#top_task_description-1{
			top:60%;
			left:10%;
		}
		#top_task_description-2{
			top:60%;
			left:25%;
		}
		#top_task_description-3-0{
			top:60%;
			left:15%;
		}
		#top_task_description-3-1{
			top:75%;
			left:22%;
		}
		#top_task_description-4{
			top:60%;
			left:8px;
		}
		#top_task_description-5{
			top:60%;
		    left:31%;
		}
	}