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


header {border-bottom:3px solid #cc4e0b;}

.page_content {font-family: davis-sans,sans-serif;}
.page_content p {font-size:1.3em;}

.image img {width:100%;}

.row00 {margin-top:3%;}
.navigation {}
.navigation .navigation-box {border:1px solid #777777; margin:3% auto; padding:1%; }
.navigation .navigation-box .item {text-align: center;}
.navigation .navigation-box .item .btn {width:100%; font-weight:600; border:0px; border-radius: 0px;}

.navigation .navigation-box .item.item01 .btn {background-color:#006c9a; color:#fff;}
.navigation .navigation-box .item.item02 .btn {background-color:#0b2341; color:#fff;}

.navigation .navigation-box .item .btn:hover {background-color:#eaeaea; color:#0b2341;}
.navigation .navigation-box .item .btn:focus {background-color:#eaeaea; color:#0b2341;}

.row01 .content_container {border-top:1px solid #777;}

.row svg path.petal {fill:#fff; transition:all .5s;}
.row svg path.petal2 {fill:#fff;}
.row svg path.bud {fill:#fff;}

.row.active svg path.petal {fill:#FC6A2B;}
.row.active svg path.petal2 {fill:#3bd86d;}
.row.active svg path.bud {fill:#FFE155;}


.timeline {margin:3% auto; max-width:95%;}
.timeline .item {display:table; width:100%;}
.timeline .item [class*="col-"] {display:table-cell; float:none; vertical-align: middle;}

.timeline .item .middle {background:url("../_assets/images/timeline-line.jpg"); background-repeat: repeat-y; background-size: contain; background-position: center center; text-align: center;}

.timeline .item .content { padding:3%; border-radius: 5px;}
.past .item .content {background-color:#eaeaea; position:relative;}
.timeline .item .content a {text-decoration:none; color:#0b2341; position:absolute; top:0; bottom:0; left:0; right:0;}
.timeline .item .content a .text {color:#0b2341;}
.timeline .item .content a:hover .text, .timeline .item .content a:focus .text   {text-decoration: none;}
.timeline .item .content a:hover .text, .timeline .item .content a:focus .text   {background-color:#fff;}
/* .timeline .item .text  {border-bottom:1px dashed #a7a7a7; color:#0b2341;} */ 

.timeline .item .content .text  .date {font-size:1.75em; font-weight:500; margin:2% auto;}
.timeline .item .content .text  .title {font-size:1.25em; font-weight:500; padding-bottom: 2%; margin-bottom: 2%;}

.timeline .item svg {width:75px; height:75px; background-color:#fff; padding:8px;}

.row .bi-gear-wide-connected {color:#0b2341; transition: all 2s; border-radius:50%;}
.row.active .bi-gear-wide-connected {transform: rotate(270deg);}
.row.active .flower-icon {transform: rotate(270deg);}


@media (min-width:768px) {
	header .header_logos_container .header_logo {text-align: left;}
	.intro img {padding:5%;}
	.small-icon {padding-top:25%;}
	.timeline .item .content .text  .title {font-size:1.45em;}
}


	.image img {width:100%;}
	.promo {font-size:2.1em; font-weight:900; max-width:700px; margin:4% auto; line-height: 1; text-align:center;}
	
	.celebration {font-family: relation-one, sans-serif; font-weight: 400; font-style: normal; color:#cc4e0b; font-size:1.4em; }
	
	.row00 {margin-top:3%;}
	.navigation-container .navigation-box {border:1px solid #777777; margin:1% auto; padding:1%; }
	.navigation-container .navigation-box .item {text-align: center;}
	.navigation-container .navigation-box .item .btn {width:100%; font-weight:600; border:0px; border-radius: 0px;}
	.navigation-container .navigation-box .item.item01 .btn {background-color:#006c9a; color:#fff;}
	.navigation-container .navigation-box .item.item02 .btn {background-color:#0b2341; color:#fff;}
	.navigation-container .navigation-box .item.item03 .btn {background-color:#cc4e0b; color:#fff;}
	.navigation-container .navigation-box .item .btn:hover {background-color:#eaeaea; color:#0b2341;}
	.navigation-container .navigation-box .item .btn:focus {background-color:#eaeaea; color:#0b2341;}
	
	.row01 .content_container {border-top:1px solid #777;}

	@media (min-width:1200px) {
		.timeline {background:url("https://auburn.edu/academic/150-ag-eng/_assets/images/timeline-bg-2.jpg"); background-position: center center;}
		
		.future .timeline .item .content  {border:5px solid #cc4e0b; border-bottom:5px solid #cc4e0b;}
			
		.present .timeline .item .content  {border:5px solid #0b2341; border-bottom:5px solid #0b2341;}
		
		.past .timeline .item .content {border:5px solid #006c9a; border-bottom:5px solid #006c9a;}
		
	}