@charset "utf-8";
/* CSS Document */

.FAPportlet {
background-color: #068484;
width: 100.25%;
}


.FAPblue{
	margin-top:-8px;
	background-color: #1BA8C2;
	padding:0;
	display: inline-block;

}


.FAPbutton {
	 margin: 0;
	border:none;
	border-radius:6px;
	color: white;
	padding: 10px 25px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 14px;
	cursor: pointer;
	 transition: all 0.5s;
	background-color: #F56342;
	
}

.FAPimg{
	width:250px;
	padding-right: 15px;
}


.FAPimgleft2 {
	float: left;
	padding: 20px 50px 20px 40px;
	
}


.FAPimgleft {
	float: left;
	padding: 20px 40px 20px 40px;
	
}

.FAPh4 {
	padding-left: 30px;
	color:#fff;
	font-size: 24px;
	margin-bottom: 0px;
}


.FAPtext_callout{
	padding-right: 20px;
	padding-bottom:10px;
	color:#fff;
	font-size:16px;
	
}

.FAPtable{
		margin-top:-8px;
		background-color: #A8AB3D;
		position:relative;  /*so children div can use 100% height and not go over */ 
		padding:8px; /* will make that spacing you wanted */

}

.FAPa { color:#fff; } 

.FAPwhitetext {
	text-align: center;
	font-weight:600;
font-size: 18px;
/* or 133% */
color: #FFFFFF;
	
}



/***paragraph *****/

.FAPh3{
font-weight: 800;
font-size: 17px;
color: #207392;
}

.FAPp {
	padding-left:15px;
	padding-right: 15px;
}

.FAPp2{
	font-size: 16px;
	margin-right:25px;
}


/***Table Info *******/

.FAPtable2 { 
  width: 90%;
	border-collapse: collapse; 
	margin:50px auto;
	}

.FAPh2 {
	font-size: 1.4vw;
}


.services{
background: #06beb6;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #48b1bf, #06beb6);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #48b1bf, #06beb6); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
color:#fff;
} 


/* bold org*/
table.FAPtable2 td:first-child {
    font-weight: bold;
} 
	

/* Zebra striping */
table.FAPtable2 tr:nth-of-type(odd) { 
	background: #eee; 
	}

table.FAPtable2 th { 
	background: #095579; 
	color: white; 
	font-weight: bold; 
	}

.FAPtable2 td, .FAPtable2 th { 
	padding: 10px; 
	border: 1px solid #ccc; 
	text-align: left; 
	text-size-adjust: none;
-webkit-text-size-adjust: none;
	}

/***/



/****timeline********/


.timelineh3{
	color:#068484;
	margin-top: 5px;
	text-size-adjust: none;
-webkit-text-size-adjust: none;
}

.design-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
background: #f0f3d3;  /* fallback for old browsers */
background: -webkit-linear-gradient(to bottom, #f0f3d3, #E5F07D);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to bottom, #f0f3d3, #E5F07D); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
padding-top: 100px;
  min-height: 90vh;
text-size-adjust: none;
-webkit-text-size-adjust: none;
}

.design {
  display: flex;
  align-items: center;
  justify-content:flex-start;
}

.timeline {
  width: 100%;
  height: auto;
  max-width: 800px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}

.timeline-content {
  padding: 10px;
  background: #fff;
  -webkit-box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
          box-shadow: 0 3px 10px rgb(0 0 0 / 0.2);
  border-radius: 5px;
  color: #000;
  padding: 0.75rem;
  transition: 0.4s ease;
  overflow-wrap: break-word !important;
  margin: 1rem;
  margin-bottom: 20px;
  border-radius: 6px;
}

.timeline-component {
  margin: -60px 20px 20px 20px;
}


@media screen and (min-width: 768px) {
  .timeline {
    display: grid;
    grid-template-columns: 1fr 3px 1fr;
  }
	
  .timeline-middle {
    position: relative;
    background-image: linear-gradient(to bottom, #DAED15, #a8ab3d);
    width: 3px;
    height: 115%;
	top: -34%;
  }
  .main-middle {
	  opacity: 0;}
	  

  }
	
	
  .timeline-circle {
    position: absolute;
    top: -9%;
    left: 50%;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background-image: radial-gradient(#bdc118,#a8ab3d);
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

.timeline-content p {
    margin-bottom: 0px;
	margin-top:0px;
	color:dimgrey;
	font-size: 0.8vw;
}


/****timeline********/


/* If the screen size is 601px wide or more, set the font-size of <div> to 80px */
@media screen and (min-width: 601px) {
  .FAPtext_callout {
    font-size:  0.9vw;
	   }
	
	#FAPservices{
	font-size: 0.25em;
	}
}

/* If the screen size is 600px wide or less, set the font-size of <div> to 30px */
@media screen and (max-width: 600px) {
  .FAPtext_callout{
    font-size: 1vw;
  }
	
		#FAPservices{
	font-size: 0.25em;
	}
}