@import url("webinars.css");

body { background: #FFF; text-align: center; margin: 0; }
#main, #footer, #header { width: 880px; margin: 0 auto; text-align: left; }


/*---- Header ---*/

#headerouter { background: #5E8595; height: 29px; padding: 10px 0;  }

#header { position: relative; }
#header, #header input { font-size: 13px; }
#header label { display: none; }
#signin a, #search a { display: block; position: absolute; right: 24px; top: 16px; }
#header a:link, #header a:visited { color: #F3F3F3; font-weight: normal; text-decoration: underline; }
#header a:hover, #header a:active { color: #FFFFFF; font-weight: normal; }
#header input.input { padding: 1px 5px 4px 5px; margin-right: 6px; background-color: #F3F3F3; border: none; position: relative; top: -2px; }

#signin { position: absolute; top: 0; left: 0; height: 23px; width: 350px; padding: 6px 0 0 94px; background: url(header.gif) 0 -29px no-repeat; }
#signin input.button { position: absolute; top: 5px; left: 308px; }
#signin input.input { width: 90px; height: 16px; }
#signin a { position: absolute; top: 5px; right: 0; }

#account { color: #F3F3F3; position: absolute; top: 0; left: 0; height: 23px; width: 357px; padding: 6px 0 0 106px; background: url(header.gif) 0 0 no-repeat; font-size: 13px; }
#header #account strong a { font-weight: bold; }

#search { position: absolute; top: 0; right: 0; height: 23px; width: 169px; padding: 6px 0 0 88px; background: url(header.gif) 0 -58px no-repeat; }
#search input.button { position: absolute; top: 5px; left: 220px; }
#search input.input { width: 110px; margin: 0; height: 16px; }
#search a { position: absolute; top: 5px; right: 0; }

#social { height: 30px; position: absolute; top: 42px; right: 10px; width: 444px; }
#social #facebook { width: 73px; height: 30px; float: right; }
#social #twitter { width: 210px; height: 30px; float: right; }

#ehahomepage { padding: 3px 0 20px 0; height: 200px; }
#ehahomepage a:hover img { opacity: 0.9; }

#googletranslatetext { position: absolute; top: 21px; left: 312px; opacity: 0.9; }
#googletranslatewidget { position: absolute; top: 38px; left: 312px; text-indent: -9999px; width: 175px; height: 24px; overflow: hidden; z-index: 10; opacity: 0.9; }
#googletranslatewidget span { display: none; }
#googletranslatewidget select { text-indent: 0; position: absolute; top: 2px; left: 0; width: 175px; height: 20px; }


/*---- Main menu ---*/

#menu { height: 32px; position: absolute; top: 86px; right: 0; border-top: 2px solid #ADC2D8; padding: 10px 3px 0 3px; }
#menu ul { padding: 0; margin: 0; }
#menu li { display: block; height: 30px; padding: 0 0 0 15px; float: left; list-style-type: none; margin: 0; }
#menu li a.link { display: block; height: 30px; width: 100%; text-decoration: none; font-size: 15px; font-weight: 600; }
#menu li a.link:hover { color: #F3893E; }
#menu li a.notlink { cursor: default; color: #416F83; }
#menu li a.notlink:hover { color: #416F83; }
#menu li.first { padding-left: 0; }

#menu-admin { width: 146px; background: url(menu/admin.gif) 0 0 no-repeat; }

/*
MENU HIGHLIGHTING IS STILL DONE USING THE OLD MENU SYSTEM. DISABLE THE CSS UNTIL THIS IS FIXED.
#menu.menu-0 #menuitem-0 a.link, #menu.menu-1 #menuitem-1 a.link, #menu.menu-2 #menuitem-2 a.link, #menu.menu-3 #menuitem-3 a.link,
#menu.menu-4 #menuitem-4 a.link, #menu.menu-5 #menuitem-5 a.link, #menu.menu-6 #menuitem-6 a.link { color: #F4924C; } 
*/

#menu div.megamenu { display: none; padding: 40px 25px 20px 35px; width: 479px; background: url(megamenu.png?v=2) 0 0 no-repeat; position: absolute; right: 10px; top: 30px; z-index: 100;overflow: hidden; }
#menu li:hover div.megamenu { display: block; }

#menuitem-1 div.megamenu { right: 100px; background-position: -415px 0; }
#menuitem-2 div.megamenu { right: 80px; background-position: -362px 0; }
#menuitem-3 div.megamenu { right: 60px; background-position: -239px 0; }
#menuitem-4 div.megamenu { right: 30px; background-position: -146px 0; }
#menuitem-5 div.megamenu { right: 0px; background-position: -107px 0; }
#menuitem-6 div.megamenu { right: -20px; background-position: -60px 0; }

#menu.new #menuitem-0 div.megamenu { right: 303px; background-position: -497px 0; width: 220px; }
#menu.new #menuitem-1 div.megamenu { right: 220px; background-position: -437px 0; width: 260px;  }
#menu.new #menuitem-2 div.megamenu { right: 80px; background-position: -270px 0; }
#menu.new #menuitem-3 div.megamenu { right: 50px; background-position: -300px 0; width: 399px; }
#menu.new #menuitem-4 div.megamenu { right: 30px; background-position: -400px 0; width: 220px; }
#menu.new #menuitem-5 div.megamenu { right: 0px; background-position: -320px 0; width: 220px; }

#menu div.megamenu p { margin: 0 0 10px 0; }
#menu div.megamenu, #menu div.megamenu a, #menu div.megamenu p { color: #FFF !important; float: none; font-weight: 600; text-decoration: none; font-size: 14px;  }
#menu div.megamenu a:hover { text-decoration: underline; }
#menu div.megamenu li { float: none; height: auto; padding: 0 0 6px 13px; background: url(megamenubullet.gif) 0 5px no-repeat; }
    #menu div.megamenu ul.left { width: 230px; float: left; }
    #menu div.megamenu ul.right { width: 210px; float: right; }
    #menu div.megamenu div.blog { clear: both; padding-bottom: 0; height: 60px; }
    #menu div.megamenu div.blog p, #menu div.megamenu div.blog p a { font-size: 13px; }
    #menu div.megamenu div.blog h3 { padding-top: 3px; font-size: 15px; margin-bottom: 3px; }


/*---- Main ---*/

#main { padding-top: 26px; position: relative; padding-bottom: 12px; }

#logo { padding-bottom: 26px; height: 95px; }

#breadcrumbs { background-color: #E4EBEF;  padding: 5px 18px; line-height: 1.3em; color: #4E5152; font-size: 13px; }
#breadcrumbs a { text-decoration: none; }


/*---- Footer ---*/

div.bulletin a { display: block; padding-left: 30px; background: url(bulletin.gif) 0 1px no-repeat; height: 23px; text-decoration: none; padding-top: 3px; }
div.bulletin a:hover { text-decoration: underline; }
#footer div.bulletin { float: right; }

#rssfeeds { padding-right: 18px; background: url(rss.gif) right center no-repeat; }


/*---- Divs with corners ---*/

div.dark { background-color: #547D8F; color: #FFFFFF; margin-bottom: 15px; }
div.dark p, div.dark a:link, div.dark a:visited { color: #FFFFFF; }
div.dark a:hover { color: #F3F3F3; }
div.dark h2 { margin-top: 0; }
div.dark h2, div.dark h3 {  color: #FFFFFF; }

div.orange { background-color: #F3893E; color: #416F83; margin-bottom: 25px; width: 100%; }
div.orange p { color: #FFFFFF; }

div.light { background: #F0F0F0; margin-bottom: 15px; }

div.rounded { padding: 16px 16px; border-radius: 8px; }

div.homebox h2 { margin-top: 0; }
div.homebox a.linkbutton { background: #7697AE; text-transform: none; }

div.homefeed { border: 1px #DDD solid; padding: 2px 9px 9px 9px; border-radius: 5px; }
div.homefeed.evaluation { border-color: #BEC9B9; }
div.homefeed.urban { border-color: #E5C7D6; }

div.homefeed.bulletin { padding-top: 10px; background-position: 0 7px; height: 22px; }


/*---- Columns ---*/

div.column-single { float: left; width: 258px; margin-right: 20px; }
div.column-single2 { float: left; width: 280px; margin-right: 20px; }
div.column-balance { float: left; width: 300px; margin-right: 0; }
div.column-double { float: left; width: 555px; margin-right: 20px; }

div.column-left { float: left; width: 248px; margin-right: 30px; }
div.column-right { float: left; width: 597px; margin-bottom: 40px; }
div.sidebar { float: right; width: 260px; margin-left: 30px; margin-bottom: 30px; }

div.column-left div.image { padding-top: 16px; }
div.sidebar div.image { padding-bottom: 16px; padding-top: 3px; }


/*---- Resources ---*/

div.resourcebutton { float: left; margin-right: 30px; margin-bottom: 30px; height: 76px; }
div.resourcebutton a:hover { opacity: 0.85; }
div.resourcebutton.figures { float: left; margin-right: 0;  width: 190px; height: 68px; padding-top: 8px; }
div.resourcebutton.figures span { display: block; font-size: 14px; line-height: 23px; }
div.resourcebutton.figures span.bold { font-weight: bold; font-size: 20px; }

div.resourcesgallery { clear: both; padding-top: 5px; }
    div.resourcesgallery h2 { color: #222; background: #EFEFEF url(resources/sectionbar.gif) 12px 8px no-repeat; padding: 6px 16px 6px 32px; font-size: 18px; margin-top: 0; }
    div.resourcesgallery a { float: right; font-size: 15px; font-weight: normal; }
h2.resourcesgallery { color: #222; background: #EFEFEF url(resources/sectionbar.gif) 12px 8px no-repeat; padding: 6px 16px 6px 32px; font-size: 18px; margin-top: 0; }
    
div.resourcecard { width: 275px; height: 134px; margin: 0 10px 20px 0; float: left; padding-right: 4px; overflow: hidden; }
    div.resourcecard div.resourcecardimage { width: 94px; height: 132px; border: 1px solid #999; background-color: #CCC; float: left; }
    div.resourcecard div.resourcecardinfo { width: 165px; float: right; }
        div.resourcecard div.resourcecardinfo h4 { margin: 0; font-size: 15px; line-height: 1.1em; }
        div.resourcecard div.resourcecardinfo h4 a { color: #222; text-decoration: none; }
        div.resourcecard div.resourcecardinfo h4 a:hover { color: #F3893E; text-decoration: none; }
        div.resourcecard div.resourcecardinfo p { font-size: 11px; line-height: 1.2em; }

#hometop div.resourcecard { width: auto; height: 128px; }
#hometop div.resourcecard div.resourcecardimage { width: 90px; height: 125px; border: none; }
#hometop div.resourcecard div.resourcecardinfo { width: 130px; padding-left: 10px;}
#hometop div.resourcecard div.resourcecardinfo h4 a { color: #FFF;  }

#erdwtf { clear: both; background: url(resources/bigquestion.gif) 830px 20px no-repeat #EFEFEF;  padding: 10px 130px 10px 15px; margin-top: 20px; margin-bottom: 30px; }
    #erdwtf h2 { margin-top: 0; color: #A3865B; font-size: 18px; }

#filterstall { float: left; width: 270px; background-color: #F4F4F4; } 

#results { float: right; width: 570px; background-color: #FFF; }
    #results h1 { background: none; color: #416F83; padding: 10px 0 0 0; }
    #results div.resourcecard { width: 265px; padding: 20px 20px 0 0; margin: 0; }
    #results div.resourcecard div.resourcecardimage { width: 94px; height: 132px; border: 1px solid #999; background-color: #CCC; float: left; }
    #results div.resourcecard div.resourcecardinfo { width: 155px; float: right; }

table.resourcedata td { padding: 2px 10px 2px 0; }

#bigcoverimage { float: right; margin: 0 0 20px 30px; width: 252px; }
    #bigcoverimage #ctl00_cphMain_imgCover { border: 1px solid #666; display: block; margin-bottom: 10px; }
    #bigcoverimage img { display: block; width: 250px; }
    #bigcoverimage a:hover img { opacity: 0.85; }

    #bigcoverimage #sharepanel { background: #CEDADF; margin-top: 11px; padding-top: 10px; padding-bottom: 2px; }
    #bigcoverimage #sharepanel ul.bookmark { margin-top: 0; border-top: none; padding-top: 0; padding-bottom: 6px; }
    #bigcoverimage #sharepanel ul.bookmark li.bookmark-twitter { margin-left: 10px; }

    #favourite { background: #F7EEB8 url(icons/favourite.png) 10px 6px no-repeat; min-height: 36px; }
    #favouriteinner { min-height: 16px; padding: 9px 10px 9px 40px; border: 1px solid #F7EEB8; }
    #favouriteinner.notloggedin { padding-top: 6px; padding-bottom: 6px; }
    #favouriteinner.loggedin:hover { border-color: #F1BE14; cursor: pointer; }
    #favouriteinner.wait { background: url(favouritewait.gif) 220px 12px no-repeat; }
    #favouriteinner.favourite { background: url(favouritetick.gif) 222px 7px no-repeat; }


/* Pager */

#ctl00_cphMain_pnlPager { background: #F0F0F0; padding: 6px 20px; height: 16px; margin-top: 20px; margin-bottom: 20px; text-align: center; position: relative; }
    #ctl00_cphMain_pnlPager #jumparound { width: 380px; position: absolute; height: 20px; overflow: hidden; left: 105px; top: 4px; }
    #ctl00_cphMain_pnlPager #jumparound a { padding: 2px 2px; margin-right: 3px; display: inline-block; text-decoration: none; background-color: #D7DEE0; width: 16px; }
    #ctl00_cphMain_pnlPager #jumparound a.selected { font-weight: bold; background-color: #F79249; color: #FFF; }
#ctl00_cphMain_hypPrevious { font-weight: bold; display: block; float: left; text-align: left; }
#ctl00_cphMain_hypNext { font-weight: bold; display: block; float: right; text-align: right; }


/*---- Toggler ---*/

a.toggle-link { display: block; padding: 0 0 10px 22px; background: url(icons/expand.gif) 0 1px no-repeat; text-decoration: none;  }
a.toggle-link.selected { font-weight: bold; background: url(icons/collapse.gif) 0 1px no-repeat; }
div.toggle-area { display: none; padding-left: 22px; margin-bottom: 30px; background: url(icons/expand-line.gif) 7px 0 repeat-y;  }
table.cells a.toggle-link { padding: 0 0 10px 14px; }
tr.toggle-area { display: none; }
tr.toggle-area td { padding-bottom: 20px; }


/*---- Tags and resources ---*/

div.taglist a { display: block; margin: 0; padding: 0 30px 8px 26px; background: url(buttons/arrow-faded.gif) left 1px no-repeat; text-decoration: none; }
div.taglist a:hover { background: url(buttons/arrow-white.gif) left 1px no-repeat; }


/*----  Forums and blogs ---*/

div.forum { padding: 15px; margin-right: 10px; }
div.forum.shaded { background-color: #F2F2F2; }
div.forum h3 { margin: 0 0 10px 0; padding: 0; }
div.forum p { font-size: 13px; margin-top: 4px; }
div.forum p.summary { color: #666666; font-weight: bold; }
div.forum span.numposts { float: right; font-size: 11px; color: #FFFFFF; width: 69px; text-align: center; height: 30px; padding-top: 6px; background: url(misc/forum.gif) 0 0 no-repeat; }
div.forum span.numposts a { color: #FFFFFF; text-decoration: none; }
div.forum span.numposts a:hover { text-decoration: underline; }

div.blog { padding-bottom: 45px; }
div.blog h3 { margin-top: 0; padding-top: 12px; font-size: 20px; }
div.blog img { float: left; padding-right: 10px; margin-bottom: 4px; }
div.blog p.author { margin-bottom: 20px; }

#signinarrow { height: 245px; width: 74px; background: url(misc/signinarrow.png) 0 0 no-repeat; position: absolute; top: -24px; left: -44px; }


/*---- Comments ---*/

#comments { font-size: 22px; margin-top: 30px; margin-bottom: 16px; padding: 12px 18px; background-color: #8DA8B8; color: #FFF; }
#addcomment { font-size: 22px; margin-top: 30px; margin-bottom: 16px; padding: 12px 18px; background-color: #8DA8B8; color: #FFF; }
div.comment { padding: 15px; min-height: 60px; margin-bottom: 16px; background-color: #F2F2F2; }
div.comment img { float: right; padding-left: 10px; }
#ctl00_cphMain_ucComments_pnlLoggedOut { margin-bottom: 60px; }


/*---- Posts ---*/

div.post { padding: 15px; }
div.post.shaded { background-color: #F2F2F2; }
div.post table td { padding-left: 20px; }
div.post table td.data { width: 240px; padding: 0 20px 0 0; border-right: 4px solid #DDDDDD; }
div.post table td.data img { float: right; padding-left: 10px; }
#addcomment { margin-top: 30px; }


/*---- Bookmark ---*/

#sharelink { display: block; height: 28px; width: 198px; background: url(buttons/share.gif) no-repeat 0 0 ; text-indent: -9999px; text-decoration: none; }

#emailform { padding-top: 10px; clear: both; }

ul.bookmark { list-style-type: none; height: 22px; margin: 0; padding: 15px 0 0 0; border-top: 1px dotted #ADC2D8; }
ul.bookmark li { display: block; height: 28px; margin: 0; padding: 0 2px 0 0; float: left; font-size: 11px; }
ul.bookmark li a { text-decoration: none; }

ul.bookmark li.bookmark-label { font-weight: bold; padding-top: 2px; font-size: 13px; }
ul.bookmark li.bookmark-twitter, ul.bookmark li.bookmark-facebook { margin-left: 16px; }
ul.bookmark li.bookmark-facebook { overflow: hidden; }
ul.bookmark li.bookmark-email a, ul.bookmark li.bookmark-print a { display: block; height: 14px; padding: 2px 7px 2px 26px; margin-left: 16px; border: 1px solid #CCC; border-radius: 4px; }
ul.bookmark li.bookmark-email a { background: #FFF url(icons/email.gif) 6px 4px no-repeat; }
ul.bookmark li.bookmark-print a { background: #FFF url(icons/print.gif) 6px 1px no-repeat; }
ul.bookmark li.bookmark-email a:hover, ul.bookmark li.bookmark-print a:hover { border-color: #AAA; background-color: #EEE; color: #416F83; }


/*---- Vacancies ---*/

div.vacancy { padding: 15px; min-height: 60px; }
div.vacancy.shaded { background-color: #F2F2F2; }
div.vacancy h3 { margin: 0; padding: 0 0 10px 0; font-size: 14px; font-weight: normal; }
div.vacancy img { float: right; padding-left: 10px; }


/*---- Stories ---*/

div.story { padding: 15px; min-height: 60px; }
div.story.shaded { background-color: #F2F2F2; }
div.story h3 { margin: 0; padding: 0 0 10px 0;  }
div.story img { float: right; padding: 0 0 10px 20px; }


/*---- Search snippets ---*/

div.snippet { padding: 10px 0; width: 600px; }
div.snippet p.metadata { font-size: 11px; margin-top: 4px; }
div.snippet p.metadata strong { white-space: nowrap; color: #555555; }
div.snippet h5 { font-size: 14px; font-weight: normal; margin-top: 0; padding-top: 0; }
div.snippet span { font-size: 11px; color: #416F83; }
div.pager { text-align: center; margin-top: 20px; }


/*---- Events ---*/

#eventcalendar { padding-top: 20px; }
#eventcalendar h2 { clear: both; color: #FFF; background: #F79249 url(sectionbar.gif) 12px 8px no-repeat; padding: 6px 32px; font-size: 18px; margin-top: 10px; }

#eventcalendar div.eventcard { background: #EFEFEF; padding: 10px; width: 264px; float: left; margin-bottom: 14px; }
#eventcalendar div.eventcard h3 { margin-top: 0; font-size: 14px; font-weight: 600; }
#eventcalendar div.eventcard p { font-size: 13px; }
    #eventcalendar div.eventcard img { float: right; padding: 0 0 4px 15px; width: 16px; height: 26px; }
    #eventcalendar div.eventcard.hosting { background-color: #DDE7ED; }
    #eventcalendar div.eventcard.takingpart { background-color: #DDE7ED; }
    #eventcalendar div.eventcard.alnapevent { background-color: #8DA8B8; }
    #eventcalendar div.eventcard.alnapevent p { color: #FFF; font-weight: bold; }
    #eventcalendar div.eventcard.alnapevent h3, #eventcalendar div.eventcard.alnapevent a { color: #FFF; font-weight: bold; }
    #eventcalendar div.eventcard strong.eventlabel { color: #FFF; background-color: #8DA8B8; padding: 0 6px; font-weight: 600; }

#eventspager { background: #8DA8B8; color: #FFF; padding: 6px 20px; height: 16px; margin-top: 30px; margin-bottom: 20px; text-align: center; position: relative; font-size: 13px; }
#eventspager a { color: #FFF; }


/*----  ALNAP Publications---*/

.alnappubs-heading { clear: both; color: #FFF; background: #F79249 url(sectionbar.gif) 12px 8px no-repeat; padding: 6px 32px; font-size: 18px; margin-top: 10px; }

.alnappubs-block { background: #EFEFEF; padding: 10px 10px 10px 10px; width: 264px; float: left; margin-bottom: 14px; }
.alnappubs-block div.resourcecard { width: 254px; height: 101px; }
.alnappubs-block div.resourcecardimage { width: 70px !important; height: 99px !important; }
.alnappubs-block div.resourcecardimage img { width: 70px; height: 99px; }
.alnappubs-block div.resourcecardinfo { width: 170px !important; }

.alnappubs-block .alnappubs-subheading { margin-top: 0; font-weight: bold; }


/*----- Colour tiles -----------*/

ul.colourtiles { margin: 30px 0; padding: 0; list-style: none; display: inline-block; }
ul.colourtiles.flush { margin-top: 0; }

    ul.colourtiles li { position: relative; width: 165px; height: 155px; float: left; padding: 0; margin: 0 14px 14px 0; -webkit-perspective: 600; -webkit-backface-visibility: hidden; }
    ul.colourtiles li:nth-child(5n+4) { margin-right: 13px; }
    ul.colourtiles li:nth-child(5n+5) { margin-right: 0; }
    ul.colourtiles li a { display: block;  width: 100%; height: 100%; box-sizing: border-box; padding: 15px; background: #444; color: #FFF; font-weight: 600; font-size: 16px; text-decoration: none; }
    ul.colourtiles li a { -webkit-transition: all 0.4s ease; -webkit-transform-style: preserve-3d; -webkit-transform: rotateY(0deg); }
    ul.colourtiles li:hover a { -webkit-transform: rotateY(-15deg); opacity: 0.9; }

    ul.colourtiles li.colourtiles-brown a { background-color: #AB9374; }
    ul.colourtiles li.colourtiles-purple a { background-color: #A0779E; }
    ul.colourtiles li.colourtiles-red a { background-color: #EE8B7F; }
    ul.colourtiles li.colourtiles-green a { background-color: #7AA777; }
    ul.colourtiles li.colourtiles-yellow a { background-color: #DDBB56; }
    ul.colourtiles li.colourtiles-blue a { background-color: #8DA8B8; }
    ul.colourtiles li.colourtiles-grey a { background-color: #666; }
    ul.colourtiles li.colourtiles-orange a { background-color: #F8A66D; }

    ul.colourtiles li.colourtiles-sohs a { background-color: #91AABE; }
    ul.colourtiles li.colourtiles-innovation a { background-color: #35ACD4; }
    ul.colourtiles li.colourtiles-feedback a { background-color: #F68A35; }
    ul.colourtiles li.colourtiles-leadership a { background-color: #3D5066; }
    ul.colourtiles li.colourtiles-evaluation a { background-color: #33694F; }
    ul.colourtiles li.colourtiles-urban a { background-color: #A13457; }



/*----  General overlay ---*/

#overlay  {
    display: none; 
    width: 610px; height: 370px; padding: 20px; 
    background: url(misc/overlayborder.png) 0 0 repeat; 
    position: fixed; left: 50%; top: 40%; margin-left: -305px; margin-top: -185px; }
    
#overlay #overlaycontent { width: 570px; height: 330px; padding: 20px; background: #FFFFFF; text-align: left; overflow-y: scroll;  }
#overlay #close { position: absolute; z-index: 100; top: 40px; right: 55px; }
#overlay h2:first-child { margin-top: 0; margin-right: 60px; }

#overlaymask { display: none; position: fixed; top: 0; left: 0; background: url(misc/mask.png) 0 0 repeat; }


/*---- List members directory ---*/

#listmembers { width: 900px; }
#listmembers div.person { width: 264px; background-color: #EEE; margin: 0 10px 10px 0; float: left; height: 60px; overflow: hidden; padding: 10px; border: 1px #416F83 dotted; }
#listmembers div.person img { float: right; padding: 0 0 10px 10px; }
    #listmembers h2 { clear: both; padding: 15px 0 2px 0; }
    #listmembers div.person h4 { margin: 0; }
    #listmembers div.person p { margin: 4px 0 0 0; line-height: 1.2em; }


/*----  Interests overlay ---*/

#interestoverlay  {
    display: none; 
    width: 510px; height: 330px; padding: 20px; 
    background: url(misc/overlayborder.png) 0 0 repeat; 
    position: fixed; left: 50%; top: 40%; margin-left: -255px; margin-top: -165px; }
    
#interestoverlay #interestoverlaycontent { width: 470px; height: 290px; padding: 20px; background: #FFFFFF; }
#interestoverlay #close { float: right; }
#interestoverlay h2 { width: 300px; margin-top: 0; }


/*----  Meeting page ---*/

div.funkgrid { margin-bottom: 30px; }
div.funkgrid div.row { height: 139px;  width: 880px; margin-bottom: 10px; }
div.funkgrid div.cell { margin-left: 10px; height: 139px; float: left; }
div.funkgrid div.cell.first { margin-left: 0; }
div.funkgrid a:hover img { opacity: 0.8; }

div.funkgrid #counter { background-color: #B50938; color: #FFF; text-align: center; width: 136px; }
div.funkgrid    #counter span.big { font-size: 50px; font-weight: bold; display: block; padding: 50px 0 20px 0; }
div.funkgrid    #counter span.small { font-size: 15px; display: block; }
div.funkgrid #downloads { background: url(/content/28thmeeting/downloads.jpg) 0 0 no-repeat; padding: 0 0 0 15px; width: 177px; height: 139px; }
div.funkgrid    #downloads h3, #downloads a { color: #0F637D; }
div.funkgrid    #downloads h3 { font-weight: bold; margin-bottom: 0; }
div.funkgrid    #downloads p { line-height: 17px; }
div.funkgrid    #downloads a:hover { color: #F3893E; }
div.funkgrid #flipper { width: 365px; overflow: hidden; position: relative; }
div.funkgrid #flipper div { position: absolute; top: 0; left: 0; width: 9000px; }
div.funkgrid #flipper img { display: block; float: left; width: 365px; }

table.agendagrid { border-collapse: collapse; margin: 30px 0; }
table.agendagrid td { width: 200px; background-color: #E7EFF2; padding: 10px; border-right: 5px solid #FFF; border-bottom: 5px solid #FFF; vertical-align: top; }
table.agendagrid td.spacer { padding: 2px; width: auto; background: #FFF !important; border: 0; }
table.agendagrid td p { margin: 0; }
table.agendagrid td h3 { margin: 0 0 8px 0; }
table.agendagrid td a { color: #0F627D; }
table.agendagrid td a:hover { color: #F3893E; }

table.agendagrid td.col1 { background-color: #0F627D; }
table.agendagrid td.col1 p { color: #FFF; }
table.agendagrid td.col1 h3 { color: #FFF; font-size: 18px; }
table.agendagrid td.col2 { background-color: #C1D6DD; }
table.agendagrid td.col3 { background-color: #D4E3E8; }
table.agendagrid td.col4 { background-color: #E7EFF2; }


/*---- Picture tiles -----*/

div.picturetile { width: 200px; height: 207px; float: left; margin: 20px 0 30px 26px; cursor: pointer; position: relative; overflow: hidden; background: #EEE; }
div.picturetile.first { margin-left: 0; }
div.picturetile h2 { z-index: 2; background-color: #8DA8B8; padding: 10px 18px; width: 164px; height: 37px; position: absolute; bottom: 0; left: 0; display: table; margin: 0; }
div.picturetile:hover h2 { background-color: #F8924C; }
div.picturetile h2 a { font-weight: bold; line-height: 1.2em; color: #FFF; font-size: 15px; display: table-cell; vertical-align: middle; text-decoration: none; }
div.picturetile p { opacity: 0.98; color: #FFF; padding: 14px 18px; background: url(tilefade.png); position: absolute; top: 150px; left: 0; width: 164px; height: 122px; margin: 0; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; }
div.picturetile:hover p { top: 0; }
div.picturetile-background { overflow: hidden; height: 157px; width: 200px; position: absolute; top: 0; left: 0; }
div.picturetile-background img { transition: all 0.3s ease; -webkit-transition: all 0.3s ease; }
div.picturetile:hover div.picturetile-background img { -webkit-filter: blur(6px); -moz-filter: blur(6px); -o-filter: blur(6px); -ms-filter: blur(6px); filter: blur(6px); margin-top: -1px; }


/*----  Event materials ---*/

div.materialrow { height: 150px; width: 880px; margin-bottom: 10px; clear: both; margin-bottom: 15px;  }
div.materialrow h2 { width: 40px; height: 150px; padding: 0; text-indent: -9999px; margin: 0 2px 0 0; float: left; background-repeat: no-repeat; }
div.materialimages { position: relative; float: left; width: 838px; height: 150px; overflow: hidden; }
    div.materialimagesinner { position: relative; height: 150px; width: 9999px; left: 0; }
    div.materialimages div.material { height: 150px; float: left; border-left: 2px #DDD solid; position: relative; overflow: hidden; }
    div.materialimages div.material.first { border-left: none; }
    div.materialimages div.material a { height: 150px; display: block; position: relative; }
    div.materialimages div.material img { height: 150px; display: block; }
    div.materialimages div.material span { display: block; height: 150px; background: url(materials/titleback.png); color: #FFF; padding: 4px 10px; position: absolute; top: 150px; left: 0; }

    div.materialimages div.scrollleft, div.materialimages div.scrollright { display: none; height: 150px; width: 30px; position: absolute; top: 0; opacity: 0.8; }
    div.materialimages div.scrollleft  { background: url(materials/left.png); left: 0; }
    div.materialimages div.scrollright { background: url(materials/right.png); right: 0; }
        div.materialimages div.scrollleft:hover, div.materialimages div.scrollright:hover { opacity: 0.6; }

div.materialrow h2.videos { background-image: url(materials/videos.gif); }
div.materialrow h2.presentations { background-image: url(materials/presentations.gif); }
div.materialrow h2.downloads { background-image: url(materials/downloads.gif); }

div.materialsearch { background-color:#EEEEEE; padding:8px 6px; margin-bottom:16px;}




/*---- Person cards ----- */

div.personcard { width: 275px; height: 96px; margin: 0 10px 20px 0; float: left; padding-right: 4px; overflow: hidden; }
    div.personcard a { float: none; }
    div.personcard div.personcardimage { width: 60px; height: 60px; background-color: #EFEFEF; padding: 17px; border: 1px solid #999; float: left; }
    div.personcard div.personcardinfo { width: 165px; float: right; }
        div.personcard div.personcardinfo h4 { margin: 0 0 12px 0; font-size: 15px; line-height: 1.1em; }
        div.personcard div.personcardinfo h4 a { color: #222; text-decoration: none; }
        div.personcard div.personcardinfo h4 a:hover { color: #F3893E; text-decoration: none; }
        div.personcard div.personcardinfo p { font-size: 13px; line-height: 1.2em; margin: 0 0 6px 0;}


/*----  Download registration overlay ---*/

#downloadregistrationoverlay  {
    display: none; text-align: left;
    width: 600px; height: 420px; padding: 20px; 
    background: url(misc/overlayborder.png) 0 0 repeat; 
    position: fixed; left: 50%; top: 40%; margin-left: -300px; margin-top: -200px; z-index: 1000; }
    
#downloadregistrationcontent { width: 560px; height: 380px; padding: 20px; background: #FFFFFF; }
#downloadregistrationcontent h2 { margin-top: 0; margin-bottom: 0; }
#downloadregistrationcontent h3.moretop { padding-top: 15px; clear: both; }
#downloadregistrationcontent ul { list-style-type: none; margin: 0; padding: 0; }
#downloadregistrationcontent ul li { list-style-type: none; margin: 0 20px 4px 0; padding: 6px; width: 246px; float: left; background-color: #EEE; border-radius: 8px; height: 20px; }
#downloadregistrationcontent ul li label { margin-left: 4px; position: relative; top: -2px; }
#downloadregistrationcontent ul li.other { padding-top: 2px; height: 24px; padding-left: 8px; width: 244px; }
#downloadregistrationcontent ul li.selected { background-color: #DBF9CC; }
#downloadregistrationcontent p.emailaddress { padding: 4px 6px; background-color: #EEE; border-radius: 8px; width: 524px; margin-bottom: -10px; }
#downloadregistrationcontent p.emailaddress input { width: 510px; }
#downloadregistrationcontent p.orgname { padding: 4px 6px; background-color: #EEE; border-radius: 8px; width: 524px; margin-bottom: 20px; }
#downloadregistrationcontent p.orgname input { width: 510px; }
#downloadregistrationsubmit { cursor: pointer; }
#downloadregistrationsubmit:hover { opacity: 0.8; }
#downloadregistrationcontent span.validationerror { display: none; float: right; color: #C00 !important; font-weight: bold; padding-right: 24px; }
#downloadregistrationcontent div.downloading { display: none; padding: 5px 0 0 34px; height: 23px; background: url(misc/loading.gif) 0 0 no-repeat; font-size: 14px; }
#downloadregistrationcontent p.pilotversion { margin-top: 20px; }




/*---- Admin menu ---*/

#adminmenu { position: absolute; height: 30px; width: 530px; right: 40px; top: 76px; }

#adminmenu-dashboard { width: 118px; height: 30px; background: url(admin/dashboard.gif) 0 0 no-repeat; float: left; margin-right: 28px; }
#adminmenu-content { width: 166px; height: 30px; background: url(admin/content.gif) 0 0 no-repeat; float: left; margin-right: 28px; }
#adminmenu-contacts { width: 190px; height: 30px; background: url(admin/contacts.gif) 0 0 no-repeat; float: left; }

#adminmenu-dashboard a, #adminmenu-content strong, #adminmenu-contacts strong  { width: 100%; height: 100%; display: block; text-decoration: none; text-indent: -9999px; outline: none; cursor: pointer; }

#adminmenu ul { position: relative; left: -9999px; top: -2px; margin: 0 20px; padding: 5px 0 5px 0; background-color: #F3F3F3; border-top: #CCCCCC solid 1px; border-bottom: #CCCCCC solid 1px; }
#adminmenu ul li { margin: 0; padding: 2px 15px; list-style: none;  }
#adminmenu ul li.lineabove { padding-top: 5px; margin-top: 5px; border-top: #CCCCCC solid 1px; }
#adminmenu div:hover ul { display: block; left: 0; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }
#adminmenu ul li a { text-decoration: none;  }