/* 
 * events.css, 3.0 2014-Jun-22
 *
 * (c) 2007 Computer History Museum		http://www.computerhistory.org
 *
 * Edit according to styleguide
 *
 */


/* MISC
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
.chm-event-active, .chm-event-focused { background-color: #f6ffe9 !important; border-top-color: #e6f5d1 !important; }
a:hover .notes { text-decoration: none !important; }

.chm-event-text .title a, .chm-event-show, .chm-event-hide { cursor: pointer; }
.chm-event-expand { background: url(/events/_media/img/event-expand.png) 160px -1px no-repeat; }
.chm-event-collapse { background: url(/events/_media/img/event-collapse.png) 160px -1px no-repeat; }
.chm-event-full { background: url(/events/_media/img/event-expand.png) 160px -1px no-repeat; }
.chm-event-content-visible { display: block !important; }
.chm-event-content-hidden { display: none !important; }
.chm-event-video-play { position: absolute; top: 37px; left: 52px; z-index: 1000; height: 36px; }
.chm-media-object { display: inline-block !important; }






/* MAIN LAYERS AND ELEMENTS 
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
.chm-event, .chm-event-container, .chm-event-main, .chm-event-preview, .chm-event-header, .chm-event-video, .chm-event-sponsors, .chm-event-day, .chm-event-date, .chm-event-speakers, .chm-event-moderators, .chm-event-schedule, .chm-event-footer, .chm-event-registration, .chm-event-location { position: relative; display: block; }


.chm-event { padding: 30px 0px; }
.chm-event:nth-child(odd){ background-color: #f9f9f9; border-top: 1px solid #e8e8e8; }
.chm-event:nth-child(even){ background-color: #f5fafb; border-top: 1px solid #dbecef; }

.chm-event-container { background-image: url(/events/_media/img/event-bg.png); background-repeat: repeat-y; }

.chm-event-header { margin-bottom: 12px; padding-bottom: 12px; }

.chm-event-info { float: left; width: 24%; padding: 0 20px 0 0; text-align: right; display: block; overflow: hidden; }
.chm-event-info .date { display: block; color: #222222; font-size: .8em; line-height: .8em; }
.chm-event-info .starttime { display: block; color: #222222; font-size: .8em; line-height: .8em; margin: 4px 0px; }
.chm-event-info .category { display: block; color: #999999; font-size: .9em; }

.chm-event-info .social a  { display: block; float: right; margin-left: 7px; color: #555555 !important; }
.chm-event-info .social a:hover  { color: #333333; text-decoration: none !important; }

.chm-event-info .title { display: block; color: #000000; }
.chm-event-info .subtitle { display: block; color: #222222; font-size: .8em; line-height: .95em; }

.chm-event-text { float: right; width: 75%; padding: 0 20px; display: block; overflow: hidden; }
.chm-event-text .header { display: block; color: #222222; font-size: .95em; line-height: 11px; padding-bottom: 5px; }
.chm-event-text .title { display: block; color: /*#0099AA*/ #428BCA; font-size: 1.15em; line-height: 1.15em; }
.chm-event-text .title a { display: block; color: #0099AA; }
.chm-event-text .subtitle { display: block; color: #777777; font-size: .9em; line-height: 1.15em; }
.chm-event-text .notes { display: block; margin: 24px 0px; font-size: 1em; color: #000000; line-height: normal; } 

.chm-event-preview .chm-event-image, .chm-event-image { width: 90px; margin-top: 5px; }
.chm-event-preview .chm-event-summary { }
.chm-event-preview .chm-event-abstract { } 
.chm-event-preview .chm-event-abstract .notes {  } 


.chm-event-header, 
.chm-event-preview,
.chm-event-video, 
.chm-event-sponsors, 
.chm-event-day, 
.chm-event-date, 
.chm-event-speakers, 
.chm-event-moderators, 
.chm-event-schedule, 
.chm-event-footer, 
.chm-event-registration, 
.chm-event-location { padding: 12px 0px !important; margin: 0px !important; }

.chm-event-day:nth-child(odd) { background: url(/events/_media/img/day-bg-odd.png); }
.chm-event-day:nth-child(even) { background: url(/events/_media/img/day-bg-even.png); }

.chm-event-speakers, .chm-event-moderators, .chm-event-schedule { margin-bottom: 12px; }
.chm-event-speakers .chm-speaker { margin-bottom: 12px; }
.chm-event-moderators .chm-moderator { margin-bottom: 12px; }


.chm-event-video .title { display: block;  margin: 0px; }
.chm-event-video .stats { display: block; margin: 0px 0px 8px 0px; font-size: 0.8em; line-height: 1em; color: #000000; }
.chm-event-video .description { display: block; }



.chm-event-date .chm-event-text .date { display: block;  margin: 0px; font-size: 1.15em; color: #990000; }
.chm-event-date .chm-event-text .program { display:block; margin: 0px 0px 8px 0px; font-size: 0.9em; }

.chm-event-speakers .chm-event-text .name { display: block; margin: 0px 24px 0px 0px; }
.chm-event-speakers .chm-event-text .notes { display:block; margin: 0px 24px 8px 0px; font-size: 0.8em;  }

.chm-event-moderators .chm-event-text .name { display: block; margin: 0px 24px 0px 0px; }
.chm-event-moderators .chm-event-text .notes { display:block; margin: 0px 24px 8px 0px; font-size: 0.8em;  }

.chm-event-schedule .chm-event-info .endtime, .chm-event-schedule .chm-event-info .starttime { display: block; float: right; font-size: .85em; line-height: .95em;  margin: 0px; color: #990000; } 
.chm-event-schedule .chm-event-info .programtitle { display: block; margin: 0px 0px 8px 0px; font-size: 0.8em; color: #555555; }
.chm-event-schedule .chm-event-text .program { display: block; margin: -4px 0px 0px 0px; }
.chm-event-schedule .chm-event-text .notes { display:block; margin: 0px 0px 8px 0px; font-size: 0.8em; }


.chm-event-footer .chm-event-registration .date { display: block;  margin: 0px; font-size: 1.15em; color: #990000;  }
.chm-event-footer .chm-event-registration .register { display:block; margin: 4px 0px 0px 0px; font-size: 0.9em;  }
.chm-event-footer .chm-event-registration .notes { display:block; margin: 0px 0px 12px 0px; font-size: 0.8em;  }


.chm-event-sponsors .chm-media-object .image { display: block; width: 104px; height: 104px; }
.chm-event-sponsors .chm-media-object .name { display: block; width: 104px; height: 104px; text-align: center; vertical-align: middle; display: -ms-flexbox; -ms-flex-pack:center; -ms-flex-align:center;/* Internet Explorer 10 */ display: -moz-box; -moz-box-pack: center; -moz-box-align: center;/* Firefox */ display: -webkit-box; -webkit-box-pack: center; -webkit-box-align: center; /* Safari, Opera, and Chrome */ display: box; box-pack: center; box-align: center;/* W3C */ }




.chm-event-sponsors .sponsorempty { display: inline-block; vertical-align: top; width: 134px; height: 174px; border: 2px dashed #00FFFF; }
.chm-event-sponsors .sponsor { display: inline-block; vertical-align: top; width: 106px; height: auto; padding: 15px; color: #222222; font-size: .95em; background-color: #ffffff; border: 1px solid #f3f3f3; text-align: center; zoom: 1; *display: inline; }
.chm-event-sponsors .sponsor .image a { display: block; width: 104px; height: 104px; }
.chm-event-sponsors .sponsor .image a img { width: 104px; }
.chm-event-sponsors .sponsor .image .companyname { display: block; padding: 30px 0 0; }
.chm-event-sponsors .sponsor .notes { display: block; width: 106px; height: 3.3em; margin-top: 10px; font-size: .9em; line-height: 1.1em; color: #222222; overflow: hidden; }







/* YEARS NAV ELEMENTS FOR PAST EVENTS PAGE
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
div#eventsnav { display: block; height: 30px; width: 684px; float: left; position: relative; margin: 0 0 20px 0; border-bottom: 1px solid #e2e2e2; background-color: #ffffff; z-index: 1000; }
div#eventsnav a.next, div#awardsnav a.prev { display: block; width: 17px; height: 30px; overflow: hidden; line-height: 30px; }
div#eventsnav a.next img, div#awardsnav a.prev img { vertical-align: middle; }
div#eventsnav a.prev { position: absolute; top: 0; left: 0; z-index: 1000; }
div#eventsnav a.next { position: absolute; top: 0; right: 0; z-index: 1000; }
div#btns { display: block; float: left; height: 30px; width: 649px; margin-top: 1px; margin-left: 17px; overflow: hidden; position: relative; z-index: 1001; }

ul.tabs { list-style:none; margin:0; padding:0; height:30px; }/* root element for tabs  */
ul.tabs li { display: block; float: left; width: 50px; margin-right: 7px; height: 28px; line-height: 28px; text-align: center; border-top-right-radius: 3px; -moz-top-right-border-radius: 3px; -webkit-top-right-border-radius: 3px; -o-top-right-border-radius: 3px; border-top-left-radius: 3px; -moz-top-left-border-radius: 3px; -webkit-top-left-border-radius: 3px; -o-top-left-border-radius: 3px; border: 1px solid #e2e2e2; background-color: #f2f2f2; color: #999999; }/* link inside the tab. uses a background image */
ul.tabs li a { display: block; width: 50px; height: 28px; line-height: 28px; text-align: center; cursor: pointer; color: #999999; }/* link inside the tab. uses a background image */


ul.tabs li a:hover { color: #000000; background-color: #ffffff; }/* when mouse enters the tab move the background image */
ul.tabs li a.current , ul.jtabs li a.current:hover { cursor:default; color:#000000; background-color: #ffffff; border-bottom: 1px solid #ffffff; }/* active tab uses a class name "current". it's highlight is also done by moving the background image. */

.scrollable .items { width:20000em; position:absolute; }

div#pastevents { float:left; width:684px; padding: 0 0 20px 0; position: relative; display: block; margin: 0px; overflow: hidden; }
div#pastevents div.scroll { float: left; position: relative; display: block; width: 684px; margin: 0px; padding: 0; clear: both; }
div#pastevents div.scroll div.yearevents { float: left; position: relative; display: block; width: 684px; margin: 0px; padding: 0; clear: both; }

.bg-bottom { background: url(/highlights/stevejobs/img/div-bg-bottom.jpg) bottom center no-repeat;}









/* PAST EVENTS ELEMENTS 
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
#chm-past-events-content { display: block; float: left; overflow: hidden; box-sizing: content-box; }
#chm-past-events-scroll { display: block; float: left; box-sizing: content-box; }
	
.yearevents { display: block; float: left; padding: 36px 0px 24px 0px; box-sizing: content-box; }
	
a.totop { color: #666666; font-weight: normal; border-top:#E6E6E6 solid 1px; height: 2em; line-height: 2em; margin: 24px 0; text-align: right; }
a.totop:hover { color: #222222; text-decoration: none; cursor: pointer; }
	
#chm-past-events-tabs { border-bottom: 1px solid #cccccc; position: relative; height: 84px; }
#chm-events-years-tabs { position: absolute; bottom: -1px; z-index: 100; }
#chm-past-events-tabs .scrollbar { background: #dddddd; position: relative; height: 1px; line-height: 0; margin: 2em 0 1.5em; }
#chm-past-events-tabs .scrollbar .handle {  background: #292A33; cursor: pointer; height: 5px; width: 100px; position: absolute; top: -2px; }
#chm-past-events-tabs .scrollbar .handle .mousearea { height: 21px; left: 0; position: absolute; top: -10px; width: 100%; }
	
#chm-past-events-tabs .frame { display: block; float: left; width: 100%; height: 42px; overflow: hidden; }
#chm-past-events-tabs .frame .slidee { height: 100%; list-style :none; margin: 0px; padding: 0px; }
#chm-past-events-tabs .frame .slidee li { display: block; float: left; height: 40px; line-height: 40px; border-width: 1px; border-style: solid; border-color: #e2e2e2; border-bottom: none; border-radius: 4px 4px 0px 0px; margin-right: 2px; padding: 0px 20px; text-align: center; color: #CCCCCC; box-sizing: content-box; -webkit-transition: color 0.5s linear; -moz-transition: color 0.5s linear; -ms-transition: color 0.5s linear; -o-transition: color 1s linear; transition: color 0.5s linear; }
#chm-past-events-tabs .frame .slidee li:hover { border-color: #cccccc; background-color: #ffffff; color: #000000; text-shadow: 1px 1px 0 #e2e2e2; cursor: pointer; -webkit-transition: color 0.5s linear; -moz-transition: color 0.5s linear; -ms-transition: color 0.5s linear; -o-transition: color 1s linear; transition: color 0.5s linear; }
#chm-past-events-tabs .frame .slidee li.active { border-color: #cccccc; border-bottom: 2px solid #ffffff; background-color: #ffffff; color: #000000; text-shadow: 1px 1px 0 #e2e2e2; }
	
#chm-past-events-tabs .pages { display: block; list-style: none; margin: 12px 0px 24px 0px; padding: 0px; text-align: center; }
#chm-past-events-tabs .pages li { background: #f2f2f2; border-radius: 10px; box-shadow: rgba(0, 0, 0, 0.2) 0 0 0 1px inset; cursor: pointer; display: inline-block; height: 14px; margin:0 4px; overflow: hidden; text-indent: -9999px; width: 14px; }
#chm-past-events-tabs .pages li.active { background: #666666; }