playground
/
TimelineJS
mirror of https://github.com/NUKnightLab/TimelineJS.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

Added more responsive behavior for touch devices and skinny embeds. 

Content will fill the slider more and the next and back arrows will hide until you mouseover them when the width is 640 or below
pull/246/head
Zach Wise 12 years ago
parent
2648f7e0d0
commit
27dadfdf22
11 changed files with 159 additions and 79 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 20
      compiled/css/themes/dark.css
  2. BIN
      compiled/css/themes/timeline-dark.png
  3. 121
      compiled/css/timeline.css
  4. BIN
      compiled/css/timeline.png
  5. 7
      examples/example_googlespreadsheet.html
  6. 7
      examples/example_json.html
  7. 7
      examples/example_jsonp.html
  8. 7
      examples/example_storify.html
  9. BIN
      source/gfx/timeline-dark.psd
  10. BIN
      source/gfx/timeline.psd
  11. 69
      source/less/VMM.Timeline.less

20
compiled/css/themes/dark.css
Unescape View File

@ -66,7 +66,7 @@
.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:5px solid #000000;}
.tooltip-inner{max-width:200px;padding:3px 8px;color:#ffffff;text-align:center;text-decoration:none;background-color:#000000;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
.tooltip-arrow{position:absolute;width:0;height:0;}
.vco-slider{width:100%;height:100%;overflow:hidden;}.vco-slider .slider-container-mask{text-align:center;width:100%;height:100%;overflow:hidden;}.vco-slider .slider-container-mask .slider-container{position:absolute;top:0px;left:-2160px;width:100%;height:100%;text-align:center;display:block;}.vco-slider .slider-container-mask .slider-container .slider-item-container{display:table-cell;vertical-align:middle;}
@media only screen and (max-width:480px),only screen and (max-device-width:480px){.vco-slider .nav-next,.vco-slider .nav-previous{display:none;}}@media (max-width:640px){.vco-slider .slider-item .content .layout-text-media .text .container{text-align:center !important;} .vco-slider .slider-item .content .layout-text-media h2,.vco-slider .slider-item .content .layout-text-media h3{display:block !important;width:100% !important;text-align:center !important;} .vco-slider .slider-item .content .content-container{display:block;}.vco-slider .slider-item .content .content-container .text{width:100%;max-width:100%;min-width:120px;display:block;}.vco-slider .slider-item .content .content-container .text .container{display:block;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-wrap:break-word;} .vco-slider .slider-item .content .content-container .media{width:100%;min-width:50%;float:none;}.vco-slider .slider-item .content .content-container .media .media-wrapper{margin-left:0px;margin-right:0px;width:100%;display:block;} .vco-notouch .vco-slider .nav-previous,.vco-notouch .vco-slider .nav-next{z-index:203;}.vco-notouch .vco-slider .nav-previous .nav-container .date,.vco-notouch .vco-slider .nav-next .nav-container .date,.vco-notouch .vco-slider .nav-previous .nav-container .title,.vco-notouch .vco-slider .nav-next .nav-container .title{filter:alpha(opacity=1);-khtml-opacity:0.01;-moz-opacity:0.01;opacity:0.01;} .vco-notouch .vco-slider .nav-previous .nav-container .icon,.vco-notouch .vco-slider .nav-next .nav-container .icon{filter:alpha(opacity=15);-khtml-opacity:0.15;-moz-opacity:0.15;opacity:0.15;} .vco-notouch .vco-slider .nav-previous .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-208px 0;width:24px;height:24px;overflow:hidden;} .vco-notouch .vco-slider .nav-next .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-232px 0;width:24px;height:24px;overflow:hidden;} .vco-notouch .vco-slider .nav-previous:hover,.vco-notouch .vco-slider .nav-next:hover{color:#FFF !important;text-shadow:#000 1px 1px 2px;}.vco-notouch .vco-slider .nav-previous:hover .nav-container .icon,.vco-notouch .vco-slider .nav-next:hover .nav-container .icon,.vco-notouch .vco-slider .nav-previous:hover .nav-container .date,.vco-notouch .vco-slider .nav-next:hover .nav-container .date,.vco-notouch .vco-slider .nav-previous:hover .nav-container .title,.vco-notouch .vco-slider .nav-next:hover .nav-container .title{font-weight:bold;filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}}.vco-slider{width:100%;height:100%;overflow:hidden;}.vco-slider .slider-container-mask{text-align:center;width:100%;height:100%;overflow:hidden;}.vco-slider .slider-container-mask .slider-container{position:absolute;top:0px;left:-2160px;width:100%;height:100%;text-align:center;display:block;}.vco-slider .slider-container-mask .slider-container .slider-item-container{display:table-cell;vertical-align:middle;}
.vco-notouch .vco-slider .nav-previous:hover,.vco-notouch .vco-slider .nav-next:hover{color:#aaaaaa;cursor:pointer;}
.vco-notouch .vco-slider .nav-previous:hover .icon{margin-left:10px;}
.vco-notouch .vco-slider .nav-next:hover .icon{margin-left:66px;}
@ -96,8 +96,8 @@
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .soundcloud{border:0;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-image{display:inline-block;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow{position:relative;z-index:1;background:#1a1a1a;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:before,.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:after{z-index:-1;position:absolute;content:"";bottom:15px;left:10px;width:50%;top:80%;max-width:300px;background:#999999;-webkit-box-shadow:0 15px 10px #999999;-moz-box-shadow:0 15px 10px #999999;box-shadow:0 15px 10px #999999;-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-o-transform:rotate(-2deg);-ms-transform:rotate(-2deg);transform:rotate(-2deg);}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow::after{-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);-o-transform:rotate(2deg);-ms-transform:rotate(2deg);transform:rotate(2deg);right:10px;left:auto;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:before,.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:after{z-index:-1;position:absolute;content:"";bottom:15px;left:10px;width:50%;top:80%;max-width:300px;background:#999999;-webkit-box-shadow:0 15px 10px #999999;-moz-box-shadow:0 15px 10px #999999;box-shadow:0 15px 10px #999999;-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-ms-transform:rotate(-2deg);-o-transform:rotate(-2deg);transform:rotate(-2deg);}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow::after{-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);-ms-transform:rotate(2deg);-o-transform:rotate(2deg);transform:rotate(2deg);right:10px;left:auto;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text{display:table;}.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container{display:table-cell;vertical-align:middle;font-size:15px;line-height:20px;color:#aaaaaa;}.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container p{margin-bottom:20px;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia{font-size:15px;line-height:20px;text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia .wiki-source{margin-bottom:15px;font-size:13px;line-height:19px;font-style:italic;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia h4{border-bottom:1px solid #333333;margin-bottom:5px;}
@ -178,7 +178,7 @@
.vco-storyjs .storify .thumbnail-inline{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-184px -96px;}
.vco-storyjs .googleplus .thumbnail-inline{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-208px -96px;}
.vco-storyjs .zFront{z-index:204;}
@media only screen and (max-width:480px),only screen and (max-device-width:480px){}@media (max-width:600px){.vco-slider .slider-item .content .content-container{display:block;}.vco-slider .slider-item .content .content-container .text{width:100%;max-width:100%;min-width:120px;display:block;}.vco-slider .slider-item .content .content-container .text .container{display:block;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-wrap:break-word;} .vco-slider .slider-item .content .content-container .media{width:100%;min-width:50%;float:none;}.vco-slider .slider-item .content .content-container .media .media-wrapper{margin-left:0px;margin-right:0px;width:100%;display:block;} .vco-slider .slider-item .content .content-container .media.text-media .media-wrapper .media-container{border:none;}}.vco-notouch .vco-navigation .toolbar .zoom-in:hover,.vco-notouch .vco-navigation .toolbar .zoom-out:hover,.vco-notouch .vco-navigation .toolbar .back-home:hover{color:#0bd4e3;cursor:pointer;filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.vco-notouch .vco-navigation .vco-toolbar .zoom-in:hover,.vco-notouch .vco-navigation .vco-toolbar .zoom-out:hover,.vco-notouch .vco-navigation .vco-toolbar .back-home:hover{color:#0bd4e3;cursor:pointer;filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.vco-notouch .vco-navigation .timenav .content .marker.active:hover{cursor:default;}.vco-notouch .vco-navigation .timenav .content .marker.active:hover .flag .flag-content h3,.vco-notouch .vco-navigation .timenav .content .marker.active:hover .flag-small .flag-content h3{color:#0bd4e3;}
.vco-notouch .vco-navigation .timenav .content .marker.active:hover .flag .flag-content h4,.vco-notouch .vco-navigation .timenav .content .marker.active:hover .flag-small .flag-content h4{color:#999999;}
.vco-notouch .vco-navigation .timenav .content .marker:hover .line{z-index:24;background:#999999;}
@ -188,10 +188,14 @@
.vco-notouch .vco-navigation .timenav .content .marker .flag:hover{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}
.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover{height:56px;background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover .flag-content{height:36px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover .flag-content h3{margin-top:5px;}
.vco-notouch .vco-navigation .timenav .content .marker .flag-small.flag-small-last:hover{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:0 -109px;width:153px;height:26px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small.flag-small-last:hover .flag-content{height:14px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small.flag-small-last:hover .flag-content h3{margin-top:4px;}
.vco-timeline .vco-navigation{clear:both;cursor:move;width:100%;height:200px;border-top:1px solid #e3e3e3;position:relative;}.vco-timeline .vco-navigation .toolbar{position:absolute;top:45px;left:0px;z-index:202;background-color:#1a1a1a;border:1px solid #333333;-webkit-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);}.vco-timeline .vco-navigation .toolbar .zoom-in,.vco-timeline .vco-navigation .toolbar .zoom-out,.vco-timeline .vco-navigation .toolbar .back-home{font-weight:normal;font-size:10px;line-height:20px;top:0px;z-index:202;width:18px;height:18px;color:#aaaaaa;text-align:center;font-weight:bold;border:1px solid #1a1a1a;padding:5px;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;}
.vco-timeline .vco-navigation .toolbar .zoom-in .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-256px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation .toolbar .zoom-out .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-280px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation .toolbar .back-home .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-328px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation{clear:both;cursor:move;width:100%;height:200px;border-top:1px solid #e3e3e3;position:relative;}.vco-timeline .vco-navigation .vco-toolbar{position:absolute;top:45px;left:0px;z-index:202;background-color:#1a1a1a;border:1px solid #333333;-webkit-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);}.vco-timeline .vco-navigation .vco-toolbar .zoom-in,.vco-timeline .vco-navigation .vco-toolbar .zoom-out,.vco-timeline .vco-navigation .vco-toolbar .back-home{font-weight:normal;font-size:10px;line-height:20px;top:0px;z-index:202;width:18px;height:18px;color:#aaaaaa;text-align:center;font-weight:bold;border:1px solid #1a1a1a;padding:5px;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;}
.vco-timeline .vco-navigation .vco-toolbar .zoom-in .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-256px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation .vco-toolbar .zoom-out .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-280px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation .vco-toolbar .back-home .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-328px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation .vco-toolbar.touch{-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;background-color:transparent;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}.vco-timeline .vco-navigation .vco-toolbar.touch .zoom-in,.vco-timeline .vco-navigation .vco-toolbar.touch .zoom-out,.vco-timeline .vco-navigation .vco-toolbar.touch .back-home{width:40px;height:40px;padding:5px;background-color:#1a1a1a;border:1px solid #333333;-webkit-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.vco-timeline .vco-navigation .vco-toolbar.touch .zoom-in .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-208px -160px;width:40px;height:40px;}
.vco-timeline .vco-navigation .vco-toolbar.touch .zoom-out .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-256px -160px;width:40px;height:40px;}
.vco-timeline .vco-navigation .vco-toolbar.touch .back-home .icon{background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-304px -160px;width:40px;height:40px;}
.vco-timeline .vco-navigation .timenav-background{position:absolute;cursor:move;top:0px;left:0px;height:150px;width:100%;background-color:#262626;}.vco-timeline .vco-navigation .timenav-background .timenav-interval-background{position:absolute;top:151px;left:0px;background:#1a1a1a;width:100%;height:49px;-webkit-box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);-moz-box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);}.vco-timeline .vco-navigation .timenav-background .timenav-interval-background .top-highlight{position:absolute;top:-1px;left:0px;z-index:30;width:100%;height:1px;background:#1a1a1a;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;-webkit-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);}
.vco-timeline .vco-navigation .timenav-background .timenav-line{position:absolute;top:0px;left:50%;width:3px;height:150px;background-color:#0bd4e3;z-index:1;-webkit-box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);}
.vco-timeline .vco-navigation .timenav-background .timenav-indicator{position:absolute;top:-1px;left:50%;z-index:202;background-image:url(themes/timeline-dark.png?v3.4);background-repeat:no-repeat;background-position:-160px -48px;width:24px;height:24px;}

BIN
compiled/css/themes/timeline-dark.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 19 KiB

121
compiled/css/timeline.css
Unescape View File

@ -66,7 +66,7 @@
.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-top:5px solid transparent;border-bottom:5px solid transparent;border-right:5px solid #000000;}
.tooltip-inner{max-width:200px;padding:3px 8px;color:#ffffff;text-align:center;text-decoration:none;background-color:#000000;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
.tooltip-arrow{position:absolute;width:0;height:0;}
.vco-slider{width:100%;height:100%;overflow:hidden;}.vco-slider .slider-container-mask{text-align:center;width:100%;height:100%;overflow:hidden;}.vco-slider .slider-container-mask .slider-container{position:absolute;top:0px;left:-2160px;width:100%;height:100%;text-align:center;display:block;}.vco-slider .slider-container-mask .slider-container .slider-item-container{display:table-cell;vertical-align:middle;}
@media only screen and (max-width:480px),only screen and (max-device-width:480px){.vco-slider .nav-next,.vco-slider .nav-previous{display:none;}}@media (max-width:640px){.vco-slider .slider-item .content .layout-text-media .text .container{text-align:center !important;} .vco-slider .slider-item .content .layout-text-media h2,.vco-slider .slider-item .content .layout-text-media h3{display:block !important;width:100% !important;text-align:center !important;} .vco-slider .slider-item .content .content-container{display:block;}.vco-slider .slider-item .content .content-container .text{width:100%;max-width:100%;min-width:120px;display:block;}.vco-slider .slider-item .content .content-container .text .container{display:block;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-wrap:break-word;} .vco-slider .slider-item .content .content-container .media{width:100%;min-width:50%;float:none;}.vco-slider .slider-item .content .content-container .media .media-wrapper{margin-left:0px;margin-right:0px;width:100%;display:block;} .vco-notouch .vco-slider .nav-previous,.vco-notouch .vco-slider .nav-next{z-index:203;}.vco-notouch .vco-slider .nav-previous .nav-container .date,.vco-notouch .vco-slider .nav-next .nav-container .date,.vco-notouch .vco-slider .nav-previous .nav-container .title,.vco-notouch .vco-slider .nav-next .nav-container .title{filter:alpha(opacity=1);-khtml-opacity:0.01;-moz-opacity:0.01;opacity:0.01;} .vco-notouch .vco-slider .nav-previous .nav-container .icon,.vco-notouch .vco-slider .nav-next .nav-container .icon{filter:alpha(opacity=15);-khtml-opacity:0.15;-moz-opacity:0.15;opacity:0.15;} .vco-notouch .vco-slider .nav-previous .icon{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-208px 0;width:24px;height:24px;overflow:hidden;} .vco-notouch .vco-slider .nav-next .icon{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-232px 0;width:24px;height:24px;overflow:hidden;} .vco-notouch .vco-slider .nav-previous:hover,.vco-notouch .vco-slider .nav-next:hover{color:#FFF !important;text-shadow:#000 1px 1px 2px;}.vco-notouch .vco-slider .nav-previous:hover .nav-container .icon,.vco-notouch .vco-slider .nav-next:hover .nav-container .icon,.vco-notouch .vco-slider .nav-previous:hover .nav-container .date,.vco-notouch .vco-slider .nav-next:hover .nav-container .date,.vco-notouch .vco-slider .nav-previous:hover .nav-container .title,.vco-notouch .vco-slider .nav-next:hover .nav-container .title{font-weight:bold;filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}}.vco-slider{width:100%;height:100%;overflow:hidden;}.vco-slider .slider-container-mask{text-align:center;width:100%;height:100%;overflow:hidden;}.vco-slider .slider-container-mask .slider-container{position:absolute;top:0px;left:-2160px;width:100%;height:100%;text-align:center;display:block;}.vco-slider .slider-container-mask .slider-container .slider-item-container{display:table-cell;vertical-align:middle;}
.vco-notouch .vco-slider .nav-previous:hover,.vco-notouch .vco-slider .nav-next:hover{color:#333333;cursor:pointer;}
.vco-notouch .vco-slider .nav-previous:hover .icon{margin-left:10px;}
.vco-notouch .vco-slider .nav-next:hover .icon{margin-left:66px;}
@ -80,9 +80,9 @@
.vco-slider .nav-previous .date small,.vco-slider .nav-next .date small,.vco-slider .nav-previous .title small,.vco-slider .nav-next .title small{display:none;}
.vco-slider .nav-previous .date,.vco-slider .nav-next .date{font-size:13px;line-height:13px;font-weight:bold;text-transform:uppercase;margin-bottom:5px;}
.vco-slider .nav-previous .title,.vco-slider .nav-next .title{font-size:11px;line-height:13px;}
.vco-slider .nav-previous{float:left;text-align:left;}.vco-slider .nav-previous .icon{margin-left:15px;background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-160px 0;width:24px;height:24px;overflow:hidden;}
.vco-slider .nav-previous{float:left;text-align:left;}.vco-slider .nav-previous .icon{margin-left:15px;background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-160px 0;width:24px;height:24px;overflow:hidden;}
.vco-slider .nav-previous .date,.vco-slider .nav-previous .title{text-align:left;padding-left:15px;}
.vco-slider .nav-next{float:right;text-align:right;}.vco-slider .nav-next .icon{margin-left:61px;background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-184px 0;width:24px;height:24px;overflow:hidden;}
.vco-slider .nav-next{float:right;text-align:right;}.vco-slider .nav-next .icon{margin-left:61px;background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-184px 0;width:24px;height:24px;overflow:hidden;}
.vco-slider .nav-next .date,.vco-slider .nav-next .title{text-align:right;padding-right:15px;}
.vco-slider .slider-item{position:absolute;width:700px;height:100%;padding:0px;margin:0px;display:table;overflow-y:auto;}.vco-slider .slider-item .content{display:table-cell;vertical-align:middle;}.vco-slider .slider-item .content .pad-top .text .container{padding-top:15px;}
.vco-slider .slider-item .content .pad-right .text .container{padding-right:15px;}
@ -96,8 +96,8 @@
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .soundcloud{border:0;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-image{display:inline-block;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow{position:relative;z-index:1;background:#ffffff;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:before,.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:after{z-index:-1;position:absolute;content:"";bottom:15px;left:10px;width:50%;top:80%;max-width:300px;background:#999999;-webkit-box-shadow:0 15px 10px #999999;-moz-box-shadow:0 15px 10px #999999;box-shadow:0 15px 10px #999999;-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-o-transform:rotate(-2deg);-ms-transform:rotate(-2deg);transform:rotate(-2deg);}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow::after{-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);-o-transform:rotate(2deg);-ms-transform:rotate(2deg);transform:rotate(2deg);right:10px;left:auto;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:before,.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow:after{z-index:-1;position:absolute;content:"";bottom:15px;left:10px;width:50%;top:80%;max-width:300px;background:#999999;-webkit-box-shadow:0 15px 10px #999999;-moz-box-shadow:0 15px 10px #999999;box-shadow:0 15px 10px #999999;-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);-ms-transform:rotate(-2deg);-o-transform:rotate(-2deg);transform:rotate(-2deg);}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-shadow::after{-webkit-transform:rotate(2deg);-moz-transform:rotate(2deg);-ms-transform:rotate(2deg);-o-transform:rotate(2deg);transform:rotate(2deg);right:10px;left:auto;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text{display:table;}.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container{display:table-cell;vertical-align:middle;font-size:15px;line-height:20px;color:#666666;}.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .plain-text .container p{margin-bottom:20px;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia{font-size:15px;line-height:20px;text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia .wiki-source{margin-bottom:15px;font-size:13px;line-height:19px;font-style:italic;}
.vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .wikipedia h4{border-bottom:1px solid #cccccc;margin-bottom:5px;}
@ -110,8 +110,8 @@
.vco-slider .slider-item .content .content-container .media .media-wrapper .caption{text-align:left;margin-top:10px;color:#666666;font-size:11px;line-height:14px;text-rendering:optimizeLegibility;word-wrap:break-word;}
.vco-slider .slider-item .content .media.text-media .media-wrapper .media-container{border:none;background-color:#ffffff;}
.vco-slider .slider-item .content .created-at{width:24px;height:24px;overflow:hidden;margin-left:7.5px;margin-top:2px;display:inline-block;float:right;filter:alpha(opacity=25);-khtml-opacity:0.25;-moz-opacity:0.25;opacity:0.25;}
.vco-slider .slider-item .content .storify .created-at{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-328px -96px;}
.vco-slider .slider-item .content .twitter .created-at{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-256px -24px;}
.vco-slider .slider-item .content .storify .created-at{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-328px -96px;}
.vco-slider .slider-item .content .twitter .created-at{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-256px -24px;}
.vco-slider .slider-item .content .googleplus .googleplus-content{font-size:13px;line-height:19px;margin-bottom:6px;padding-top:10px;background-color:#ffffff;color:#666666;}.vco-slider .slider-item .content .googleplus .googleplus-content p{font-size:13px;line-height:19px;}
.vco-slider .slider-item .content .googleplus .googleplus-content .googleplus-title{font-size:28px;line-height:36px;margin-bottom:6px;padding-top:10px;background-color:#ffffff;color:#000000;}
.vco-slider .slider-item .content .googleplus .googleplus-content .googleplus-annotation{font-size:15px;line-height:20px;color:#000000;border-bottom:1px solid #e3e3e3;padding-bottom:7.5px;margin-bottom:7.5px;}
@ -122,7 +122,7 @@
.vco-slider .slider-item .content .googleplus .googleplus-content .googleplus-attachments p{font-size:11px;line-height:14px;margin-bottom:5px;}
.vco-slider .slider-item .content .googleplus .googleplus-content .googleplus-attachments img{float:left;display:block;bottom:0;left:0;margin:auto;position:relative;right:0;top:0;width:40%;}
.vco-slider .slider-item .content .googleplus .proflinkPrefix{color:#0088cc;}
.vco-slider .slider-item .content .googleplus .created-at{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-208px -72px;}
.vco-slider .slider-item .content .googleplus .created-at{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-208px -72px;}
.vco-slider .slider-item .content .twitter,.vco-slider .slider-item .content .plain-text-quote,.vco-slider .slider-item .content .storify,.vco-slider .slider-item .content .googleplus{text-align:left;margin-left:auto;margin-right:auto;margin-bottom:15px;clear:both;}.vco-slider .slider-item .content .twitter blockquote,.vco-slider .slider-item .content .plain-text-quote blockquote,.vco-slider .slider-item .content .storify blockquote,.vco-slider .slider-item .content .googleplus blockquote{color:#666666;}.vco-slider .slider-item .content .twitter blockquote p,.vco-slider .slider-item .content .plain-text-quote blockquote p,.vco-slider .slider-item .content .storify blockquote p,.vco-slider .slider-item .content .googleplus blockquote p{font-size:28px;line-height:36px;margin-bottom:6px;padding-top:10px;background-color:#ffffff;color:#000000;}
.vco-slider .slider-item .content .twitter blockquote .quote-mark,.vco-slider .slider-item .content .plain-text-quote blockquote .quote-mark,.vco-slider .slider-item .content .storify blockquote .quote-mark,.vco-slider .slider-item .content .googleplus blockquote .quote-mark{color:#666666;}
.vco-slider .slider-item .content-container.layout-text-media .text-media{border-top:1px solid #e3e3e3;padding-top:15px;padding-right:0;}
@ -155,46 +155,50 @@
.vco-storyjs .vcard .avatar{float:left;display:block;width:32px;height:32px;}.vco-storyjs .vcard .avatar img{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;}
.vco-storyjs .thumbnail{width:24px;height:24px;overflow:hidden;float:left;margin:0;margin-right:1px;margin-top:6px;border:0;padding:0;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.vco-storyjs a.thumbnail:hover{-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
.vco-storyjs .thumbnail.thumb-plaintext{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-280px -48px;}
.vco-storyjs .thumbnail.thumb-quote{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-232px -48px;}
.vco-storyjs .thumbnail.thumb-document{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-256px -48px;}
.vco-storyjs .thumbnail.thumb-photo{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-280px -24px;border:0;}.vco-storyjs .thumbnail.thumb-photo img{border:0px none #cccccc !important;}
.vco-storyjs .thumbnail.thumb-twitter{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-256px -24px;}
.vco-storyjs .thumbnail.thumb-vimeo{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-328px -48px;}
.vco-storyjs .thumbnail.thumb-youtube{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-328px -72px;}
.vco-storyjs .thumbnail.thumb-video{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-328px -24px;}
.vco-storyjs .thumbnail.thumb-audio{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-304px -24px;}
.vco-storyjs .thumbnail.thumb-map{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-208px -48px;}
.vco-storyjs .thumbnail.thumb-website{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-232px -24px;}
.vco-storyjs .thumbnail.thumb-link{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-184px -72px;}
.vco-storyjs .thumbnail.thumb-wikipedia{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-184px -48px;}
.vco-storyjs .thumbnail.thumb-storify{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-328px -96px;}
.vco-storyjs .thumbnail.thumb-googleplus{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-208px -72px;}
.vco-storyjs thumbnail.thumb-instagram{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-208px -96px;}
.vco-storyjs thumbnail.thumb-instagram-full{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-232px -96px;width:48px;height:24px;}
.vco-storyjs .thumb-storify-full{height:12px;background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-280px -96px;width:48px;}
.vco-storyjs .thumbnail.thumb-plaintext{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-280px -48px;}
.vco-storyjs .thumbnail.thumb-quote{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-232px -48px;}
.vco-storyjs .thumbnail.thumb-document{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-256px -48px;}
.vco-storyjs .thumbnail.thumb-photo{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-280px -24px;border:0;}.vco-storyjs .thumbnail.thumb-photo img{border:0px none #cccccc !important;}
.vco-storyjs .thumbnail.thumb-twitter{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-256px -24px;}
.vco-storyjs .thumbnail.thumb-vimeo{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-328px -48px;}
.vco-storyjs .thumbnail.thumb-youtube{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-328px -72px;}
.vco-storyjs .thumbnail.thumb-video{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-328px -24px;}
.vco-storyjs .thumbnail.thumb-audio{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-304px -24px;}
.vco-storyjs .thumbnail.thumb-map{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-208px -48px;}
.vco-storyjs .thumbnail.thumb-website{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-232px -24px;}
.vco-storyjs .thumbnail.thumb-link{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-184px -72px;}
.vco-storyjs .thumbnail.thumb-wikipedia{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-184px -48px;}
.vco-storyjs .thumbnail.thumb-storify{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-328px -96px;}
.vco-storyjs .thumbnail.thumb-googleplus{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-208px -72px;}
.vco-storyjs thumbnail.thumb-instagram{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-208px -96px;}
.vco-storyjs thumbnail.thumb-instagram-full{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-232px -96px;width:48px;height:24px;}
.vco-storyjs .thumb-storify-full{height:12px;background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-280px -96px;width:48px;}
.vco-storyjs .thumbnail-inline{width:16px;height:14px;overflow:hidden;display:inline-block;margin-right:1px;margin-left:3px;margin-top:2px;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;}
.vco-storyjs .twitter .thumbnail-inline{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-160px -96px;}
.vco-storyjs .storify .thumbnail-inline{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-184px -96px;}
.vco-storyjs .googleplus .thumbnail-inline{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-208px -96px;}
.vco-storyjs .twitter .thumbnail-inline{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-160px -96px;}
.vco-storyjs .storify .thumbnail-inline{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-184px -96px;}
.vco-storyjs .googleplus .thumbnail-inline{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-208px -96px;}
.vco-storyjs .zFront{z-index:204;}
@media only screen and (max-width:480px),only screen and (max-device-width:480px){}@media (max-width:600px){.vco-slider .slider-item .content .content-container{display:block;}.vco-slider .slider-item .content .content-container .text{width:100%;max-width:100%;min-width:120px;display:block;}.vco-slider .slider-item .content .content-container .text .container{display:block;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;word-wrap:break-word;} .vco-slider .slider-item .content .content-container .media{width:100%;min-width:50%;float:none;}.vco-slider .slider-item .content .content-container .media .media-wrapper{margin-left:0px;margin-right:0px;width:100%;display:block;} .vco-slider .slider-item .content .content-container .media.text-media .media-wrapper .media-container{border:none;}}.vco-notouch .vco-navigation .toolbar .zoom-in:hover,.vco-notouch .vco-navigation .toolbar .zoom-out:hover,.vco-notouch .vco-navigation .toolbar .back-home:hover{color:#0088cc;cursor:pointer;filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.vco-notouch .vco-navigation .vco-toolbar .zoom-in:hover,.vco-notouch .vco-navigation .vco-toolbar .zoom-out:hover,.vco-notouch .vco-navigation .vco-toolbar .back-home:hover{color:#0088cc;cursor:pointer;filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.vco-notouch .vco-navigation .timenav .content .marker.active:hover{cursor:default;}.vco-notouch .vco-navigation .timenav .content .marker.active:hover .flag .flag-content h3,.vco-notouch .vco-navigation .timenav .content .marker.active:hover .flag-small .flag-content h3{color:#0088cc;}
.vco-notouch .vco-navigation .timenav .content .marker.active:hover .flag .flag-content h4,.vco-notouch .vco-navigation .timenav .content .marker.active:hover .flag-small .flag-content h4{color:#999999;}
.vco-notouch .vco-navigation .timenav .content .marker:hover .line{z-index:24;background:#999999;}
.vco-notouch .vco-navigation .timenav .content .marker .flag:hover,.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover{cursor:pointer;}.vco-notouch .vco-navigation .timenav .content .marker .flag:hover .flag-content h3,.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover .flag-content h3{color:#333333;}
.vco-notouch .vco-navigation .timenav .content .marker .flag:hover .flag-content h4,.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover .flag-content h4{color:#aaaaaa;}
.vco-notouch .vco-navigation .timenav .content .marker .flag:hover .flag-content .thumbnail,.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover .flag-content .thumbnail{filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.vco-notouch .vco-navigation .timenav .content .marker .flag:hover{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}
.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover{height:56px;background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover .flag-content{height:36px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover .flag-content h3{margin-top:5px;}
.vco-notouch .vco-navigation .timenav .content .marker .flag-small.flag-small-last:hover{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:0 -109px;width:153px;height:26px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small.flag-small-last:hover .flag-content{height:14px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small.flag-small-last:hover .flag-content h3{margin-top:4px;}
.vco-timeline .vco-navigation{clear:both;cursor:move;width:100%;height:200px;border-top:1px solid #e3e3e3;position:relative;}.vco-timeline .vco-navigation .toolbar{position:absolute;top:45px;left:0px;z-index:202;background-color:#ffffff;border:1px solid #cccccc;-webkit-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);}.vco-timeline .vco-navigation .toolbar .zoom-in,.vco-timeline .vco-navigation .toolbar .zoom-out,.vco-timeline .vco-navigation .toolbar .back-home{font-weight:normal;font-size:10px;line-height:20px;top:0px;z-index:202;width:18px;height:18px;color:#333333;text-align:center;font-weight:bold;border:1px solid #ffffff;padding:5px;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;}
.vco-timeline .vco-navigation .toolbar .zoom-in .icon{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-256px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation .toolbar .zoom-out .icon{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-280px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation .toolbar .back-home .icon{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-328px 0;width:24px;height:24px;}
.vco-notouch .vco-navigation .timenav .content .marker .flag:hover{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}
.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover{height:56px;background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover .flag-content{height:36px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small:hover .flag-content h3{margin-top:5px;}
.vco-notouch .vco-navigation .timenav .content .marker .flag-small.flag-small-last:hover{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:0 -109px;width:153px;height:26px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small.flag-small-last:hover .flag-content{height:14px;}.vco-notouch .vco-navigation .timenav .content .marker .flag-small.flag-small-last:hover .flag-content h3{margin-top:4px;}
.vco-timeline .vco-navigation{clear:both;cursor:move;width:100%;height:200px;border-top:1px solid #e3e3e3;position:relative;}.vco-timeline .vco-navigation .vco-toolbar{position:absolute;top:45px;left:0px;z-index:202;background-color:#ffffff;border:1px solid #cccccc;-webkit-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);}.vco-timeline .vco-navigation .vco-toolbar .zoom-in,.vco-timeline .vco-navigation .vco-toolbar .zoom-out,.vco-timeline .vco-navigation .vco-toolbar .back-home{font-weight:normal;font-size:10px;line-height:20px;top:0px;z-index:202;width:18px;height:18px;color:#333333;text-align:center;font-weight:bold;border:1px solid #ffffff;padding:5px;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;}
.vco-timeline .vco-navigation .vco-toolbar .zoom-in .icon{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-256px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation .vco-toolbar .zoom-out .icon{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-280px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation .vco-toolbar .back-home .icon{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-328px 0;width:24px;height:24px;}
.vco-timeline .vco-navigation .vco-toolbar.touch{-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;background-color:transparent;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}.vco-timeline .vco-navigation .vco-toolbar.touch .zoom-in,.vco-timeline .vco-navigation .vco-toolbar.touch .zoom-out,.vco-timeline .vco-navigation .vco-toolbar.touch .back-home{width:40px;height:40px;padding:5px;background-color:#ffffff;border:1px solid #cccccc;-webkit-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 0px rgba(0, 0, 0, 0.2);-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.vco-timeline .vco-navigation .vco-toolbar.touch .zoom-in .icon{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-208px -160px;width:40px;height:40px;}
.vco-timeline .vco-navigation .vco-toolbar.touch .zoom-out .icon{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-256px -160px;width:40px;height:40px;}
.vco-timeline .vco-navigation .vco-toolbar.touch .back-home .icon{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-304px -160px;width:40px;height:40px;}
.vco-timeline .vco-navigation .timenav-background{position:absolute;cursor:move;top:0px;left:0px;height:150px;width:100%;background-color:#e9e9e9;}.vco-timeline .vco-navigation .timenav-background .timenav-interval-background{position:absolute;top:151px;left:0px;background:#ffffff;width:100%;height:49px;-webkit-box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);-moz-box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);box-shadow:-1px -1px 7px rgba(0, 0, 0, 0.1);}.vco-timeline .vco-navigation .timenav-background .timenav-interval-background .top-highlight{position:absolute;top:-1px;left:0px;z-index:30;width:100%;height:1px;background:#ffffff;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;-webkit-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);box-shadow:1px 1px 5px rgba(0, 0, 0, 0.2);}
.vco-timeline .vco-navigation .timenav-background .timenav-line{position:absolute;top:0px;left:50%;width:3px;height:150px;background-color:#0088cc;z-index:1;-webkit-box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);-moz-box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);box-shadow:1px 1px 7px rgba(0, 0, 0, 0.3);}
.vco-timeline .vco-navigation .timenav-background .timenav-indicator{position:absolute;top:-1px;left:50%;z-index:202;background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-160px -48px;width:24px;height:24px;}
.vco-timeline .vco-navigation .timenav-background .timenav-indicator{position:absolute;top:-1px;left:50%;z-index:202;background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-160px -48px;width:24px;height:24px;}
.vco-timeline .vco-navigation .timenav-background .timenav-tag div{height:50px;display:table;}.vco-timeline .vco-navigation .timenav-background .timenav-tag div h3{display:table-cell;vertical-align:middle;padding-left:65px;font-size:15px;color:#d0d0d0;font-weight:bold;text-shadow:0px 1px 1px #ffffff;}
.vco-timeline .vco-navigation .timenav-background .timenav-tag-size-half{height:25px;}.vco-timeline .vco-navigation .timenav-background .timenav-tag-size-half div{height:25px;}
.vco-timeline .vco-navigation .timenav-background .timenav-tag-size-full{height:50px;}.vco-timeline .vco-navigation .timenav-background .timenav-tag-size-full div{height:50px;}
@ -206,32 +210,32 @@
.vco-timeline .vco-navigation .timenav .content .marker.active .flag,.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small{z-index:200;}.vco-timeline .vco-navigation .timenav .content .marker.active .flag .flag-content,.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small .flag-content{height:36px;}.vco-timeline .vco-navigation .timenav .content .marker.active .flag .flag-content h3,.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small .flag-content h3{color:#0088cc;margin-top:5px;}
.vco-timeline .vco-navigation .timenav .content .marker.active .flag .flag-content .thumbnail,.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small .flag-content .thumbnail{filter:alpha(opacity=100);-khtml-opacity:1;-moz-opacity:1;opacity:1;}
.vco-timeline .vco-navigation .timenav .content .marker.active .flag.row1,.vco-timeline .vco-navigation .timenav .content .marker.active .flag.row2,.vco-timeline .vco-navigation .timenav .content .marker.active .flag.row3,.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small.row1,.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small.row2,.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small.row3{z-index:200;}
.vco-timeline .vco-navigation .timenav .content .marker.active .flag{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}
.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:0 -109px;width:153px;height:26px;}.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small .flag-content{height:14px;}.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small .flag-content h3{margin-top:4px;}
.vco-timeline .vco-navigation .timenav .content .marker.active .flag{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:0 -53px;width:153px;height:53px;}
.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:0 -109px;width:153px;height:26px;}.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small .flag-content{height:14px;}.vco-timeline .vco-navigation .timenav .content .marker.active .flag-small .flag-content h3{margin-top:4px;}
.vco-timeline .vco-navigation .timenav .content .marker{position:absolute;top:0px;left:150px;display:block;}.vco-timeline .vco-navigation .timenav .content .marker .dot{position:absolute;top:150px;left:0px;display:block;width:6px;height:6px;background:#333333;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;z-index:21;}
.vco-timeline .vco-navigation .timenav .content .marker .line{position:absolute;top:0px;left:3px;width:1px;height:150px;background-color:#cccccc;background-color:rgba(204, 204, 204, 0.5);-webkit-box-shadow:1px 0 0 rgba(255, 255, 255, 0.5);-moz-box-shadow:1px 0 0 rgba(255, 255, 255, 0.5);box-shadow:1px 0 0 rgba(255, 255, 255, 0.5);z-index:22;}.vco-timeline .vco-navigation .timenav .content .marker .line .event-line{position:absolute;z-index:22;left:0px;height:1px;width:1px;background:#0088cc;filter:alpha(opacity=15);-khtml-opacity:0.15;-moz-opacity:0.15;opacity:0.15;}
.vco-timeline .vco-navigation .timenav .content .marker .flag,.vco-timeline .vco-navigation .timenav .content .marker .flag-small{position:absolute;top:15px;left:3px;padding:0px;display:block;z-index:23;width:153px;}.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content,.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content{padding:0px 7px 2px 6px;overflow:hidden;}.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content h3,.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content h3{font-weight:bold;font-size:15px;line-height:20px;font-size:11px;line-height:11px;color:#999999;margin-bottom:2px;}.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content h3 small,.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content h3 small{display:none;}
.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content h4,.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content h4{display:none;font-weight:normal;font-size:15px;line-height:20px;margin-top:5px;font-size:10px;line-height:10px;color:#aaaaaa;}.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content h4 small,.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content h4 small{display:none;}
.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content .thumbnail,.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail{margin-bottom:15px;margin-right:3px;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;}.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content .thumbnail img,.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail img{width:22px;height:22px;max-height:none;max-width:none;border:0;border:1px solid #999999;padding:0;margin:0;}
.vco-timeline .vco-navigation .timenav .content .marker .flag{height:56px;background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:0 0;width:153px;height:53px;}.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content{height:36px;}.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content h3{margin-top:5px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:0 -135px;width:153px;height:26px;}.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content{height:14px;}.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content h3{margin-top:4px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag{height:56px;background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:0 0;width:153px;height:53px;}.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content{height:36px;}.vco-timeline .vco-navigation .timenav .content .marker .flag .flag-content h3{margin-top:5px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:0 -135px;width:153px;height:26px;}.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content{height:14px;}.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content h3{margin-top:4px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail{width:16px;height:10px;margin-right:1px;margin-top:6px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-plaintext{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-280px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-quote{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-232px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-document{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-256px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-photo{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-280px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-twitter{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-256px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-vimeo{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-328px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-youtube{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-304px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-video{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-328px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-audio{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-304px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-map{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-208px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-website{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-232px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-link{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-232px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-wikipedia{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-184px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-storify{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-184px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-googleplus{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-208px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content thumbnail.thumb-instagram{background-image:url(timeline.png?v3.4);background-repeat:no-repeat;background-position:-208px -96px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-plaintext{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-280px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-quote{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-232px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-document{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-256px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-photo{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-280px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-twitter{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-256px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-vimeo{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-328px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-youtube{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-304px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-video{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-328px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-audio{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-304px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-map{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-208px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-website{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-232px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-link{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-232px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-wikipedia{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-184px -120px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-storify{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-184px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content .thumbnail.thumb-googleplus{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-208px -130px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag-small .flag-content thumbnail.thumb-instagram{background-image:url(timeline.png?v4.3);background-repeat:no-repeat;background-position:-208px -96px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag.row1{z-index:25;top:48px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag.row2{z-index:24;top:96px;}
.vco-timeline .vco-navigation .timenav .content .marker .flag.row3{z-index:23;top:1px;}
@ -259,3 +263,4 @@
.vco-timeline .vco-navigation .timenav .time .time-interval .era5{color:#00ccaa;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;}
.vco-timeline .vco-navigation .timenav .time .time-interval .era6{color:#0088cc;filter:alpha(opacity=50);-khtml-opacity:0.5;-moz-opacity:0.5;opacity:0.5;}
.vco-timeline .vco-navigation .timenav .time .time-interval-major{white-space:nowrap;position:absolute;top:5px;left:0px;}.vco-timeline .vco-navigation .timenav .time .time-interval-major div{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAQAQMAAADtUYf0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoyOTAzRjI3REIzNDcxMUUxQUQ3QUZCOThEODQ1NDhCNyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDoyOTAzRjI3RUIzNDcxMUUxQUQ3QUZCOThEODQ1NDhCNyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjI5MDNGMjdCQjM0NzExRTFBRDdBRkI5OEQ4NDU0OEI3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjI5MDNGMjdDQjM0NzExRTFBRDdBRkI5OEQ4NDU0OEI3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+DPWNfQAAAANQTFRFzMzMylJEJwAAAAtJREFUCB1jYMAPAAAgAAHDvpOtAAAAAElFTkSuQmCC);background-position:left top;background-repeat:no-repeat;padding-top:15px;position:absolute;height:15px;left:0px;display:block;font-weight:bold;font-size:12px;line-height:20px;text-transform:uppercase;text-align:left;text-indent:0px;white-space:nowrap;color:#333333;margin-left:0px;margin-right:0px;margin-top:1px;z-index:5;}.vco-timeline .vco-navigation .timenav .time .time-interval-major div strong{font-weight:bold;color:#000000;}
@media screen and (-webkit-max-device-pixel-ratio:1){}@media only screen and (-webkit-min-device-pixel-ratio:1.5),only screen and (-o-min-device-pixel-ratio:3/2),only screen and (min--moz-device-pixel-ratio:1.5),only screen and (min-device-pixel-ratio:1.5){}@media screen and (max-device-width:480px) and (orientation:portrait){.storyjs-embed.full-embed{height:557px !important;width:320px !important;}.storyjs-embed.full-embed .vco-feature{height:356px !important;}}@media screen and (max-device-width:480px) and (orientation:landscape){.storyjs-embed.full-embed{height:409px !important;width:480px !important;}.storyjs-embed.full-embed .vco-feature{height:208px !important;}}@media screen and (min-device-width:481px) and (orientation:portrait){}@media screen and (min-device-width:481px) and (orientation:landscape){}@media (max-width:480px){}@media only screen and (max-width:480px){}

BIN
compiled/css/timeline.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 19 KiB

7
examples/example_googlespreadsheet.html
Unescape View File

@ -19,12 +19,13 @@
<meta name="description" content="TimelineJS example">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!-- Style-->
<style>
html, body {
height:100%;
padding: 0px;
margin: 0px;
height:100%;
padding: 0px;
margin: 0px;
}
</style>
<!-- HTML5 shim, for IE6-8 support of HTML elements--><!--[if lt IE 9]>

7
examples/example_json.html
Unescape View File

@ -19,12 +19,13 @@
<meta name="description" content="TimelineJS example">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!-- Style-->
<style>
html, body {
height:100%;
padding: 0px;
margin: 0px;
height:100%;
padding: 0px;
margin: 0px;
}
</style>
<!-- HTML5 shim, for IE6-8 support of HTML elements--><!--[if lt IE 9]>

7
examples/example_jsonp.html
Unescape View File

@ -19,12 +19,13 @@
<meta name="description" content="TimelineJS example">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!-- Style-->
<style>
html, body {
height:100%;
padding: 0px;
margin: 0px;
height:100%;
padding: 0px;
margin: 0px;
}
</style>
<!-- HTML5 shim, for IE6-8 support of HTML elements--><!--[if lt IE 9]>

7
examples/example_storify.html
Unescape View File

@ -19,12 +19,13 @@
<meta name="description" content="TimelineJS example">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!-- Style-->
<style>
html, body {
height:100%;
padding: 0px;
margin: 0px;
height:100%;
padding: 0px;
margin: 0px;
}
</style>
<!-- HTML5 shim, for IE6-8 support of HTML elements--><!--[if lt IE 9]>

BIN
source/gfx/timeline-dark.psd
View File

Binary file not shown.

BIN
source/gfx/timeline.psd
View File

Binary file not shown.

69
source/less/VMM.Timeline.less
Unescape View File

@ -13,7 +13,7 @@
----------------------------------------------------- */
//GFX
.base-sprite() {
background-image: url(timeline.png?v3.4);
background-image: url(timeline.png?v4.3);
}
.loading-sprite() {
background-image: url(loading.gif?v3.4);
@ -42,3 +42,70 @@
@import "VMM.Timeline.TimeNav.less";
/* MEDIA QUERIES
================================================== */
/* Mobile and iPhone
================================================== */
/* Non-Retina */
@media screen and (-webkit-max-device-pixel-ratio: 1) {
}
/* Retina */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
}
/* iPhone Portrait
================================================== */
@media screen and (max-device-width: 480px) and (orientation:portrait) {
.storyjs-embed.full-embed {
height:557px !important;
width:320px !important;
.vco-feature {
height:356px !important;
}
}
}
/* iPhone Landscape
================================================== */
@media screen and (max-device-width: 480px) and (orientation:landscape) {
.storyjs-embed.full-embed {
height:409px !important;
width:480px !important;
.vco-feature {
height:208px !important;
}
}
}
/* iPad Portrait */
@media screen and (min-device-width: 481px) and (orientation:portrait) {
}
/* iPad Landscape */
@media screen and (min-device-width: 481px) and (orientation:landscape) {
}
@media (max-width: 480px) {
}
/* Skinny
================================================== */
@media only screen and (max-width: 480px) {
.storyjs-embed.full-embed {
//max-width: 480px !important;
}
.vco-timeline {
//max-width: 480px !important;
.vco-slider {
}
}
}
Write Preview
Loading…
Cancel
Save