div.timeline { position: relative; overflow: hidden; margin: 0px auto; padding: 2px; font-family: 'lucida grande', tahoma, verdana, arial, sans-serif; }
/* Date Separator */
div.timeline div.date_separator { position: relative; padding: 20px 0px; clear: both; }
div.timeline div.date_separator span { display: block; width: 150px; height: 40px; line-height: 40px; font-size: 14px; text-align: center; background-color: #252F39; color: #FFFFFF; border-radius: 0; opacity: 0; filter: alpha(opacity=0); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear; -webkit-transform: translateY(-200%); -moz-transform: translateY(-200%); -ms-transform: translateY(-200%); transform: translateY(-200%); }
div.timeline div.date_separator.animated span { opacity: 1; filter: alpha(opacity=100); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
div.timeline_dual div.date_separator span, div.timeline_center div.date_separator span { margin-left: auto; margin-right: auto; }
div.timeline_left div.date_separator span { margin-left: auto; margin-right: 8px; }
div.timeline_right div.date_separator span { margin-left: 8px; margin-right: auto; }
/* Spine */
div.timeline div.spine { position: absolute; top: 0px; bottom: 100%; width: 4px; border-radius: 2px; background-color: #1C262F; -webkit-transition: bottom 0.5s linear; -moz-transition: bottom 0.5s linear; -ms-transition: bottom 0.5s linear; transition: bottom 0.5s linear; }
div.timeline_dual div.spine, div.timeline_center div.spine { left: 50%; margin-left: -2px; }
div.timeline_left div.spine { right: 4px; }
div.timeline_right div.spine { left: 4px; }
div.timeline div.spine.animated { bottom: 0%; }
/* Element */
div.timeline_element { position: relative; margin: 20px 0px; opacity: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; transition: all 0.2s linear; }
div.timeline_dual div.timeline_element_left { width: 50%; margin: 10px 0px; float: left; clear: left; }
div.timeline_dual div.timeline_element_right { width: 50%; margin: 10px 0px; float: right; clear: right; }
div.timeline_left div.timeline_element, div.timeline_dual div.timeline_element_left { -webkit-transform: translateX(20px); -moz-transform: translateX(20px); -mstransform: translateX(20px); transform: translateX(20px); }
div.timeline_right div.timeline_element, div.timeline_dual div.timeline_element_right { -webkit-transform: translateX(-20px); -moz-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); }
div.timeline div.timeline_element.animated { opacity: 1; -webkit-transform: translateX(0px); -moz-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); }
.opacityFilter div.timeline_element { visibility: hidden; }
.opacityFilter div.timeline_element.animated { visibility: visible; }
div.timeline_element_box { overflow: hidden; background-color: #1C262F; border: none; border-radius: 0; color: #EEEEEE; text-shadow: none; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); }
div.timeline_element_box:hover { box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); }
div.timeline_left div.timeline_element_box, div.timeline_dual div.timeline_element_left div.timeline_element_box { margin-right: 30px; }
div.timeline_right div.timeline_element_box, div.timeline_dual div.timeline_element_right div.timeline_element_box { margin-left: 30px; }
div.timeline_left div.timeline_element:before, div.timeline_right div.timeline_element:before, div.timeline_dual div.timeline_element_left:before, div.timeline_dual div.timeline_element_right:before { content: ''; position: absolute; display: block; width: 30px; height: 0px; border-top: 1px dashed #1C262F; }
div.timeline_left div.timeline_element:before { right: 4px; top: 15px; }
div.timeline_dual div.timeline_element_left:before { right: 0px; top: 15px; }
div.timeline_right div.timeline_element:before { left: 4px; top: 35px; }
div.timeline_dual div.timeline_element_right:before { left: 0px; top: 35px; }
div.timeline_left div.timeline_element:after, div.timeline_right div.timeline_element:after, div.timeline_dual div.timeline_element_left:after, div.timeline_dual div.timeline_element_right:after { content: ''; position: absolute; display: block; width: 10px; height: 10px; border-radius: 50%; background-color: #1C262F; border: 2px solid #252F39; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
div.timeline_left div.timeline_element:hover:after, div.timeline_right div.timeline_element:hover:after, div.timeline_dual div.timeline_element_left:hover:after, div.timeline_dual div.timeline_element_right:hover:after { background-color: #FFFFFF; z-index: 100; }
div.timeline_left div.timeline_element:hover:before, div.timeline_right div.timeline_element:hover:before, div.timeline_dual div.timeline_element_left:hover:before, div.timeline_dual div.timeline_element_right:hover:before { border-color: #FFFFFF; }
div.timeline_left div.timeline_element:after { right: 6px; top: 10px; margin-right: -5px; }
div.timeline_dual div.timeline_element_left:after { right: 0px; top: 10px; margin-right: -5px; }
div.timeline_right div.timeline_element:after { left: 6px; top: 30px; margin-left: -5px; }
div.timeline_dual div.timeline_element_right:after { left: 0px; top: 30px; margin-left: -5px; }
div.timeline_left div.timeline_element:after, div.timeline_right div.timeline_element:after, div.timeline_dual div.timeline_element_left:hover:after, div.timeline_dual div.timeline_element_right:hover:after { z-index: 100; }
div.timeline_title { position: relative; overflow: hidden; margin: 10px; color: #FFFFFF; font-size: 10px; text-transform: uppercase; }
div.timeline_title span.timeline_title_label { position: absolute; left: 0px; right: 100px; overflow: hidden; white-space: nowrap; display: block; text-overflow: ellipsis; }
div.timeline_title span.timeline_title_date { float: right; }
div.timeline_element div.img_container { position: relative; }
div.timeline_element div.img_overlay { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; -webkit-transition: background 0.2s linear; -moz-transition: background 0.2s linear; -ms-transition: background 0.2s linear; transition: background 0.2s linear; }
div.timeline_element.notitle div.img_overlay { border-top-left-radius: 2px; border-top-right-radius: 2px; }
div.timeline_element.nocontent div.img_overlay { border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; }
div.timeline_element.gallery div.img_overlay { border-radius: 2px; }
div.timeline_element div.img_container:hover div.img_overlay, div.timeline_element div.img_overlay.loading { background: url('../images/opacity.png') repeat;  /*Fallback for IE*/ background: rgba(0,0,0,0.5); }
div.timeline_element div.img_overlay span { display: block; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 30px; height: 30px; margin: auto; cursor: pointer; background: url('../images/search.png') no-repeat 50% 50%; opacity: 0; filter: alpha(opacity=0); -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; transition: all 0.2s linear; -webkit-transform: scale(0.5); -moz-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); }
div.timeline_element div.img_container:hover div.img_overlay span, div.timeline_element div.img_overlay.loading span { opacity: 1; filter: alpha(opacity=100); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); }
div.timeline_element div.img_overlay.loading span { background: none; }
div.timeline_element div.img_overlay.loading span:before, div.timeline_element div.img_overlay.loading span:after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 20px; height: 20px; margin: auto; border: 2px solid #DDDDDD; border-radius: 50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
div.timeline_element div.img_overlay.loading span:after { border-left-color: rgba(0, 0, 0, 0.8); -webkit-animation: rotate 0.8s linear infinite; -moz-animation: rotate 0.8s linear infinite; -ms-animation: rotate 0.8s linear infinite; animation: rotate 0.8s linear infinite; }
/* Slider Element */
div.timeline_element.blog_post div.slider_container { position: relative; }
div.timeline_element.blog_post div.slider_container img { display: block; width: 100%; height: 100%; border-radius: 0px 0px 5px 5px; }
div.timeline_element.blog_post.notitle div.slider_container img { border-radius: 2px; }
div.timeline_element.blog_post div.content { font-size: 13px; padding: 15px; line-height: 18px; }
div.timeline_element.blog_post div.slider_container span.slider_prev, div.timeline_element.blog_post div.slider_container span.slider_next { position: absolute; z-index: 20; display: block; bottom: 5px; width: 14px; height: 14px; cursor: pointer; background-repeat: no-repeat; opacity: 0; filter: alpha(opacity=0); -webkit-transition: opacity 0.2s linear; -moz-transition: opacity 0.2s linear; -ms-transition: opacity 0.2s linear; transition: opacity 0.2s linear; }
div.timeline_element.blog_post div.slider_container:hover span.slider_prev, div.timeline_element.blog_post div.slider_container:hover span.slider_next { opacity: 1; filter: alpha(opacity=100); }
div.timeline_element.blog_post div.slider_container span.slider_prev { background-image: url('../images/prev.png'); right: 24px; }
div.timeline_element.blog_post div.slider_container span.slider_next { background-image: url('../images/next.png'); right: 5px; }
div.timeline_element.blog_post div.readmore { padding: 10px; font-size: 12px; text-align: right }
div.timeline_element.blog_post a { color: #5E8292; }
div.timeline_element.blog_post div.readmore a { color: #5E8292; text-decoration: underline; }
div.timeline_element.blog_post div.readmore a:hover { text-decoration: none; }
/* iframe Element */
div.timeline_element.iframe div.content.loading:before, div.timeline_element.iframe div.content.loading:after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 20px; height: 20px; margin: auto; border: 2px solid #111111; border-radius: 50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
div.timeline_element.iframe div.content.loading:after { border-left-color: rgba(255, 255, 255, 0.1); -webkit-animation: rotate 0.8s linear infinite; -moz-animation: rotate 0.8s linear infinite; -ms-animation: rotate 0.8s linear infinite; animation: rotate 0.8s linear infinite; }
div.timeline_element.iframe div.content iframe { display: block; width: 100%; height: 100%; border: none; border-radius: 0px 0px 5px 5px; }
div.timeline_element.iframe.notitle div.content iframe { border-radius: 5px; }
/* Gallery Element */
div.timeline_element.gallery div.content { font-size: 13px; margin: 10px; line-height: 18px; }
div.timeline_element.gallery div.scroll_container { position: relative; overflow: auto; overflow-y: hidden; white-space: nowrap; margin: 10px; }
div.timeline_element.gallery div.img_container { display: inline-block; margin-right: 4px; vertical-align: top; }
div.timeline_element.gallery div.img_container img { display: block; border-radius: 2px; }
div.timeline_element.gallery div.img_container:last-child { margin-right: 0px; }
/* Lightbox */
div.timeline_overlay { position: fixed; z-index: 200; top: 0px; bottom: 0px; right: 0px; left: 0px; display: none; background: url('../images/opacity.png') repeat;  /*Fallback for IE*/ background-color: rgba(0, 0, 0, 0.5); }
div.timeline_overlay.open { display: block; }
div.timeline_overlay div.lightbox { position: absolute; width: 64px; height: 64px; top: 0; right: 0; bottom: 0; left: 0; margin: auto; background-repeat: no-repeat; background-position: 50% 50%; border: 5px solid #FFFFFF; background-color: #FFFFFF; opacity: 0; filter: alpha(opacity=0); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; transition: all 0.2s linear; }
div.timeline_overlay div.lightbox.loaded { opacity: 1; filter: alpha(opacity=100); -webkit-box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.4); -moz-box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.4); -ms-box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.4); box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.4); }
div.timeline_overlay div.lightbox.updating { -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -ms-transition: all 0.5s linear; transition: all 0.5s linear; }
div.timeline_overlay div.lightbox.updating:before, div.timeline_overlay div.lightbox.updating:after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 20px; height: 20px; margin: auto; border: 2px solid #DDDDDD; border-radius: 50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
div.timeline_overlay div.lightbox.updating:after { border-left-color: rgba(0, 0, 0, 0.5); -webkit-animation: rotate 0.8s linear infinite; -moz-animation: rotate 0.8s linear infinite; -ms-animation: rotate 0.8s linear infinite; animation: rotate 0.8s linear infinite; }
div.timeline_overlay div.lightbox div.navigation { position: absolute; top: -30px; left: -5px; right: -5px; }
div.timeline_overlay div.lightbox img { display: block; width: 100%; height: 100%; filter: alpha(opacity=100); opacity: 1; -webkit-transition: opacity 0.1s linear; -moz-transition: opacity 0.1s linear; -ms-transition: opacity 0.1s linear; transition: opacity 0.1s linear; }
div.timeline_overlay div.lightbox.updating img { filter: alpha(opacity=0); opacity: 0; -webkit-transition: none; -moz-transition: none; -ms-transition: none; transition: none; }
div.timeline_overlay div.lightbox span { display: block; float: left; width: 14px; height: 14px; margin-right: 10px; background-repeat: no-repeat; background-position: 50% 50%; cursor: pointer; }
div.timeline_overlay div.lightbox span.prev { background-image: url('../images/prev.png'); left: 10px; }
div.timeline_overlay div.lightbox span.next { background-image: url('../images/next.png'); right: 10px; }
div.timeline_overlay div.lightbox a.close { display: block; float: right; width: 14px; height: 14px; background-image: url('../images/cancel.png'); }
/* Social */
div.timeline img.twitter_profile { float: left; margin: 0px 10px 10px 0px; border-radius: 3px; width: auto; height: auto; }
div.timeline div.facebook_left_column { float: left; width: 50px; }
div.timeline div.facebook_right_column { margin-left: 50px; }
div.timeline div.facebook_content { overflow: hidden; text-overflow: ellipsis; }
div.timeline img.facebook_profile { border-radius: 3px; width: 40px; height: 40px; }
div.timeline div.facebook_post { overflow: hidden; clear: both; font-size: 11px; margin-top: 10px; line-height: normal; border-radius: 3px; text-shadow: none; color: #777777; background-color: #252F39; }
div.timeline div.facebook_post img.facebook_picture { max-width: 80px; margin: 5px; float: left; border-radius: 3px; }
div.timeline div.facebook_type_photo div.facebook_post { border: none; }
div.timeline div.facebook_type_photo div.facebook_post img.facebook_picture { max-width: 100%; width: 100%; margin: 0px; }
div.timeline div.description_container { overflow: hidden; margin: 5px 5px 5px 90px; }
div.timeline div.facebook_post a { display: block; margin-bottom: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Load More */
div.timeline_loadmore { font-size: 12px; font-family: 'lucida grande', tahoma, verdana, arial, sans-serif; cursor: pointer; margin: 10px auto; width: 100px; background: red; text-align: center; padding: 10px 0px; border-radius: 4px; text-decoration: none; color: #FFFFFF; background: #D84A38; background: -webkit-linear-gradient(top, #dd4b39, #d14836); background: -moz-linear-gradient(top, #dd4b39, #d14836); background: -ms-linear-gradient(top, #dd4b39, #d14836); background: linear-gradient(top, #dd4b39, #d14836); }
div.timeline_loadmore:hover { background: #CC3524; background: -webkit-linear-gradient(top, #d14836, #dd4b39); background: -moz-linear-gradient(top, #d14836, #dd4b39); background: -ms-linear-gradient(top, #d14836, #dd4b39); background: -linear-gradient(top, #d14836, #dd4b39); }
div.timeline_loadmore:active {; box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.2) inset; }
div.timeline_loadmore.loading { cursor: default; color: #AAAAAA; text-shadow: 0px 1px 1px #FFFFFF; box-shadow: none; background-size: 40px 40px; background-color: #DEDEDE; background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: -ms-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); -webkit-animation: loading 1s linear infinite; -moz-animation: loading 1s linear infinite; -ms-animation: loading 1s linear infinite; animation: loading 1s linear infinite; }
@-webkit-keyframes loading {
 from {
background-position: 0px 0px;
}
 to {
background-position: 40px 0px;
}
}
@-moz-keyframes loading {
 from {
background-position: 0px 0px;
}
 to {
background-position: 40px 0px;
}
}
@-ms-keyframes loading {
 from {
background-position: 0px 0px;
}
 to {
background-position: 40px 0px;
}
}
@keyframes loading {
 from {
background-position: 0px 0px;
}
 to {
background-position: 40px 0px;
}
}
 @-webkit-keyframes rotate {
 from {
 -webkit-transform: rotate(0);
}
 to {
 -webkit-transform: rotate(360deg);
}
}
@-moz-keyframes rotate {
 from {
 -moz-transform: rotate(0);
}
 to {
 -moz-transform: rotate(360deg);
}
}
@-ms-keyframes rotate {
 from {
 -ms-transform: rotate(0);
}
 to {
 -ms-transform: rotate(360deg);
}
}
@keyframes rotate {
 from {
 transform: rotate(0);
}
 to {
 transform: rotate(360deg);
}
}
