/********** Normal Styles ***************/ .jflatTimeline{ width :100%; margin :1em auto; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; } /********** Style for the month year bar ***************/ .jflatTimeline .month-year-bar{ background-color : #A9A9A9; display : table; width : 100%; color : #ffffff; font-size : 1.5em; font-weight : 300; padding :0.3em; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor : default; } .jflatTimeline .month-year-bar .prev, .jflatTimeline .month-year-bar .next{ padding : 0 0.875em; font-size : 0.875em; cursor : pointer; color:#FFF; } .jflatTimeline .month-year-bar .year{ float : left; } .jflatTimeline .month-year-bar .month{ float : right; } /********** Style for the bar containing dates ***************/ .jflatTimeline .dates-bar{ border : solid 1px #e7e7e7; display : block; width : 100%; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; padding : 0 50px; position : relative; white-space : nowrap; overflow : hidden; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .jflatTimeline .dates-bar a{ display: block; height: 100%; width: 4em; color : #a2a2a2; vertical-align:middle; text-align : center; display : inline-block; border-right : 1px solid #E7E7E7; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; cursor : pointer; transition : color .2s, transform .2s; -webkit-transition : color .2s, transform .2s; -moz-transition : color .2s, transform .2s; z-index : 0; } .jflatTimeline .dates-bar a:hover{ color : #686666; } .jflatTimeline .dates-bar a span{ transition : color .2s, transform .2s; -webkit-transition : color .2s, -webkit-transform .2s; -moz-transition : color .2s, -moz-transform .2s; } .jflatTimeline .dates-bar a.noevent{ display : none; width : 100%; color: #7B7B7B; font-size: 19px; line-height: 70px; } .jflatTimeline .dates-bar a.selected{ color : #ffF; background-color:#A9A9A9; font-weight:bold; box-shadow:1px 1px 4px #ddd,-1px -1px 4px #ddd; } .jflatTimeline .dates-bar a.selected>span.date{ transform : scale(1.2, 1.2); -moz-transform : scale(1.2, 1.2); -webkit-transform : scale(1.2, 1.2); } .jflatTimeline .dates-bar a.prev, .jflatTimeline .dates-bar a.next{ position : absolute; top : 0; width : 50px; min-width : 0; font-size : 20px; background-color : white; font-size : 30px; line-height : 70px; z-index : 2; display : inline-block; } .jflatTimeline .dates-bar .month span{ display: inline-block; min-width: 60px; text-align: center; } .jflatTimeline .dates-bar a.prev{ left : 0; } .jflatTimeline .dates-bar a.next{ right : 0; border-left : solid 1px #e7e7e7; } .jflatTimeline .dates-bar a span.date{ display : block; font-size : 1.5em; line-height:1.5em; vertical-align:bottom; } .jflatTimeline .dates-bar a span.month{ font-size : 1em; line-height:1.5em; } /********** Whole style for timeline-wrap ***************/ .jflatTimeline .timeline-wrap{ width : 100%; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; border : solid 1px #e7e7e7; border-top : 0; } .jflatTimeline .timeline-wrap .event{ overflow : auto; border-bottom : solid 1px #e7e7e7; display: none; } .jflatTimeline .timeline-wrap .event.selected{ display : block; } .jflatTimeline .timeline-wrap .event .date{ color: #3F3F3F; display: block; font-size: 14px; padding: 0 15px 15px; } .jflatTimeline .timeline-wrap .event .date i{ padding : 0 10px 0 0; } .jflatTimeline .timeline-wrap .event>div{ -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; padding : 15px; width : 100%; display : table; } .jflatTimeline .timeline-wrap .event div.right{ -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; padding : 15px; padding-right : 0; } .jflatTimeline .timeline-wrap .event div.layout1>div{ float : left; width : 50%; } .jflatTimeline .timeline-wrap .event .layout1 div.left>img{ width : 100%; } .jflatTimeline .timeline-wrap .event .layout1 div.right h3{ text-align : center; font-size : 20px; text-transform : uppercase; margin : 5px 0 ; color : #3E3E3E; } .jflatTimeline .timeline-wrap .event .layout1 div.right p{ font-size : 13px; color : #707070; line-height : 21px; } .jflatTimeline .timeline-wrap .event div.layout2>div{ float : left; width : 50%; } .jflatTimeline .timeline-wrap .event .layout2 div.right>img{ width : 100%; } .jflatTimeline .timeline-wrap .event .layout2 div.right h3{ text-align : center; font-size : 20px; text-transform : uppercase; margin : 5px 0 ; color : #3E3E3E; } .jflatTimeline .timeline-wrap .event .layout2 div.right p{ font-size : 13px; color : #707070; line-height : 21px; } .jflatTimeline .timeline-wrap .event h3{ text-align : center; font-size :1.2em; text-transform : uppercase; margin :0.3em; color : #3E3E3E; word-break:break-all; word-wrap:break-word; } .jflatTimeline .timeline-wrap .event p{ font-size :0.875em; color : #707070; line-height :1.5em; margin :0.5em;; word-break:break-all; word-wrap:break-word; } .jflatTimeline .timeline-wrap .event .layout3 img{ width : 100%; } /********** Make it responsive ***************/ .jflatTimeline.s_screen .timeline-wrap .event div.layout1>div{ float : none; width : 100%; } .jflatTimeline.s_screen .timeline-wrap .event div.layout2>div{ float : none; width : 100%; } /* FILE ARCHIVED ON 06:03:47 Aug 25, 2018 AND RETRIEVED FROM THE INTERNET ARCHIVE ON 20:27:21 Dec 21, 2024. JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE. ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C. SECTION 108(a)(3)). */ /* playback timings (ms): captures_list: 0.528 exclusion.robots: 0.027 exclusion.robots.policy: 0.016 esindex: 0.011 cdx.remote: 4.903 LoadShardBlock: 192.503 (3) PetaboxLoader3.datanode: 134.192 (4) PetaboxLoader3.resolve: 99.535 (2) load_resource: 91.016 */