@import url("https://fonts.googleapis.com/css?family=Exo+2:400,700&subset=cyrillic");
html { box-sizing: border-box; }
 *, *::before, *::after {
box-sizing: inherit;
}
body { font-family: 'Exo 2', sans-serif; line-height: 1.5; }
.wrapper { margin: 0 auto; padding: 0 20% 50px; width: 100%; }
article { position: relative; max-width: 980px; margin: 0 auto; }
.timeline__nav { position: fixed; z-index: 99; top: 0; -webkit-transition: top .3s ease-out;
transition: top .3s ease-out;
}
.timeline__nav ul { list-style: none; list-style-position: inside; margin: 15px 0; }
.timeline__nav ul li { margin: 15px 0; padding-left: 0; list-style-type: none; color: #fff; border-bottom: 1px dotted rgba(0, 0, 0, 0.3); cursor: pointer; -webkit-transition: all .3s ease-out;
transition: all .3s ease-out;
font-size:20px; }
.timeline__nav ul li.active { font-weight: bold; color: #f94125; border-bottom: 1px dotted transparent; -webkit-transform: scale(1.2); transform: scale(1.2); color:#ff5a00; font-size:22px; padding-left:15px; }
.timeline__nav ul li:hover { color:#fff; }
.timeLineWrapper { background: url(../images/landing-4.jpg); background-repeat: no-repeat; background-size: cover; background-position: center top; margin:0; padding:200px 0; background-attachment:fixed; }
h2.milestone { color: #fff; font-size:1.7em; }
.timeLineWrapper p { color: #fff; font-size: 20px; padding: 15px 0; /*border: 1px solid #2f2f2f;*/ border-radius: 5px; }
/**/
.timelineContent { position: relative; }
.timelineBg01 { background: url(naaa-building.jpg); height: 500px; border: 7px solid #fff; border-radius: 5px; }
.timelineBg02 { background: url(Yarrows-Spring.jpg); height: 500px; border: 7px solid #fff; border-radius: 5px; }
.timelineBg03 { background: url(lawn1.jpg); height: 500px; border: 7px solid #fff; border-radius: 5px; }
.timelineBg04 { background: url(yarrows.jpg); height: 500px; border: 7px solid #fff; border-radius: 5px; }
.timelineBg05 { background: url(img-beyond-the-classroom.jpg); height: 500px; border: 7px solid #fff; border-radius: 5px; }
.timelineBg06 { background: url(Cedar.jpg); height: 500px; border: 7px solid #fff; border-radius: 5px; }
.timelineBg07 { background: url(Glen.jpg); height: 500px; border: 7px solid #fff; border-radius: 5px; }
.timelineBg08 { background: url(class-room.jpg); height: 500px; border: 7px solid #fff; border-radius: 5px; }
.timelineContent p { position: absolute; bottom: 0; left: 50%; top: 50%; background: rgba(0, 0, 0, 0.7); text-align: center; transform: translate(-50%, -50%); display: inline-table; }
.backtoWebsiteButton { position: relative; }
.backtoWebsiteButton span { position: fixed; right: 30px; top: 45px; }
.backtoWebsiteButton span a { background: #ff5a00; padding: 15px; text-decoration: none; border-radius: 5px; color: #fff; transition: all 350ms ease 0s; -webkit-transition: all 350ms ease 0s; font-size: 17px; }
.backtoWebsiteButton span a:hover { background: #fff; color: #ff5a00; }