@charset "UTF-8";
/* CSS Document */

{HTML}
* { margin: 0; padding: 0;}
body { background: #000;}

p { margin-bottom: 1.4em;}
a { text-decoration: none; color: #ff5a00;}
a:hover { text-decoration: underline;}

form {}
input { border: 0px Solid Transparent; background: #f4f5e5; padding: 2px;}
input.f_input { width: 100%;}
input.f_submit { background: #ff5a00; color: #FFF; margin: 5px 0;}

textarea { border: 0px Solid Transparent; background: #f4f5e5; padding: 2px; width: 100%;}

select { border: 1px Solid #AAA;}
select option { padding-right: 1em;}



{100%}
html, body { height: 100%;}
.base { min-height: 100%;}



{Color}
body { color: #333;}
a {}



{Typo}
* { font-family: Arial, sans-serif; font-size: 1em;}
body { font-size: 9pt; line-height: 1.2em;}

.small { font-size: 7pt; color: #999;}



{Element}
.hide { display: none !important;}
.invisible { visibility: hidden !important;}
.clear { clear: both;}

.left { float: left;}
.right { float: right;}

.debug { background: #F99;}

.spacetop { margin-top: 1.4em;}


{Layout}
.base { position: relative; display: block; width: 820px; margin: 0 auto; background: #FFF;}

.layout { position: relative; display: block; width: 796px; left: 12px; background: url(../_media/loading_img.gif) center 175px no-repeat;}

.hdr { display: none;}

.main {}

.content {}



{Header}



{Navi}
.navi { position: absolute; z-index: 99; display: block; top: 0; left: 0;}
.navi ul { list-style-type: none;}
.navi li { display: inline; width: 152px; margin-right: 9px; float: left;}
.navi li h4 a { display: block; height: 27px; font-size: 0.95em; background: #999; color: #CCC;}
.navi li h4 a.on { color: #FFF !important;}
.navi li h4 a:hover { background: #CCC; color: #FFF !important; text-decoration: none;}
.navi li h4 a span { padding: 10px; line-height: 2.2em;}

.navi li#nv_activities { margin-right: 0;}

.dropmenu { display: block; padding: 5px 0; background: #333;}
.dropmenu .dropitem { display: block;}
.dropmenu .dropitem a { display: block; padding: 5px 13px; color: #CCC;}
.dropmenu .dropitem a span { display: block;}
.dropmenu .dropitem a:hover { text-decoration: underline; color: #FFF !important;}

#nv_home h4 a { color: #B3C2E4; background: #4064ba url(../_media/navi_bg_home.gif) top left repeat-x;}
#nv_festivalhub h4 a { color: #FFCECE; background: #4064ba url(../_media/navi_bg_festival.gif) top left repeat-x;}
#nv_outreach h4 a { color: #FFE7B3; background: #4064ba url(../_media/navi_bg_outreach.gif) top left repeat-x;}
#nv_festivalmustknow h4 a { color: #C5B5D3; background: #4064ba url(../_media/navi_bg_essential.gif) top left repeat-x;}
#nv_activities h4 a { color: #BBDB99; background: #4064ba url(../_media/navi_bg_activities.gif) top left repeat-x;}

#nv_festivalhub .dropmenu { background: #7C000C; height: 85px;}
#nv_festivalhub .dropmenu .dropitem a { color: #F85B5B;}

#nv_outreach .dropmenu { background: #bb5000; height: 255px;}
#nv_outreach .dropmenu .dropitem a { color: #FFCC00;}

#nv_festivalmustknow .dropmenu { background: #3b1553; height: 190px;}
#nv_festivalmustknow .dropmenu .dropitem a { color: #CF8BFF;}

#nv_activities .dropmenu { background: #1c3c00; height: 90px;}
#nv_activities .dropmenu .dropitem a { color: #9EE649;}



{Sub Navi}
.subnavi { list-style-type: none;}
.subnavi li { display: block; width: 225px; float: left; line-height: 1em;}
.subnavi li a { display: block; color: #FFF; padding: 0.3em 0;}
.subnavi li a span { display: block; padding-left: 24px;}
.subnavi li a.on { color: #000; text-decoration: underline;}



{Menu}
.menu ul { position: relative; display: block; list-style-type: none; border-top: 7px solid #ebead9; border-bottom: 7px solid #ebead9; font-size: 0.95em; background: #FFF;}
.menu li { display: inline; line-height: 1em;}
.menu li a { font-weight: bold; color: #333;}
.menu li a span { padding: 0 23px;}
.menu li a:hover { color: #ff5a00; text-decoration: none;}
.menu li a.on { color: #FFF; background: #ff5a00;}
.menu li a.on:hover { color: #FFF;}

.generalpg .menu { position: absolute; top: 37px;}
.generalpg .menu ul { width: 796px;}

.subpg .menu { padding-top: 30px;}
.festivalhub .menu { background: url(../_media/ending_festivalhub.gif) center top no-repeat;}
.outreach .menu { background: url(../_media/ending_outreach.gif) center top no-repeat;}
.festivalmustknow .menu { background: url(../_media/ending_essential.gif) center top no-repeat;}
.activities .menu { background: url(../_media/ending_activities.gif) center top no-repeat;}



{Main}
.subpg .main { padding-top: 60px;}
.generalpg .main { padding-top: 90px;}



{Title}
.title h2 {}
.title h2 span { display: none;}

.subpg .title { margin-left: 322px; margin-bottom: 12px;}
.generalpg .title { margin-left: 322px; margin-bottom: 12px;}

.festivalhub .title { height: 150px;}
#heroes_exhibition .title { background: url(../_media/title_heroes_exhibition.gif) left bottom no-repeat;}
#kidszone .title { background: url(../_media/title_kidszone.gif) left bottom no-repeat;}
#culturalperformances .title { background: url(../_media/title_culturalperformances.gif) left bottom no-repeat;}

.outreach .title { height: 195px;}
#outreach_overview .title { background: url(../_media/title_outreach_overview.gif) left bottom no-repeat;}
#fof .title { background: url(../_media/title_fof.gif) left bottom no-repeat;}
#expeditionh .title { background: url(../_media/title_expeditionh.gif) left bottom no-repeat;}
#culture101 .title { background: url(../_media/title_culture101.gif) left bottom no-repeat;}
#soundstories .title { background: url(../_media/title_soundstories.gif) left bottom no-repeat;}
#hotm .title { background: url(../_media/title_hotm.gif) left bottom no-repeat;}
#vintagecar .title { background: url(../_media/title_vintagecar.gif) left bottom no-repeat;}
#heroes_childrenbook .title { background: url(../_media/title_heroes_childrenbook.gif) left bottom no-repeat;}
#launch_yishuntrail .title { background: url(../_media/title_launch_yishuntrail.gif) left bottom no-repeat;}
#heritage_activities .title { background: url(../_media/title_partnersongoingactivities.gif) left bottom no-repeat;}
#culinaryheritage .title { background: url(../_media/title_celebratingourculinaryheritage.gif) left bottom no-repeat;}

.festivalmustknow .title { height: 175px;}
#tenthings .title { background: url(../_media/title_10things.gif) left bottom no-repeat;}
#festival_opening .title { background: url(../_media/title_festivalopening.gif) left bottom no-repeat;}
#festivalcalendar .title { background: url(../_media/title_festivalcalendar.gif) left bottom no-repeat;}
#festival_infobooth .title { background: url(../_media/title_festival_infobooth.gif) left bottom no-repeat;}
#festival_ads_videos .title { background: url(../_media/title_festivaladsandvideo.gif) left bottom no-repeat;}

.activities .title { height: 130px;}
#storywriting_contest .title { background: url(../_media/title_mystory.gif) left bottom no-repeat;}
#heroes_patchcontest .title { background: url(../_media/title_heroes_patchcontest.gif) left bottom no-repeat;}
#heroes_illustcontest .title { background: url(../_media/title_heroes_illustcontest.gif) left bottom no-repeat;}

.general .title { height: 75px;}
#aboutfestival .title { background: url(../_media/title_aboutfestival.gif) left bottom no-repeat;}
#mediaroom .title { background: url(../_media/title_mediaroom.gif) left bottom no-repeat;}
#sponsors .title { background: url(../_media/title_sponsors.gif) left bottom no-repeat;}
#contactus .title { background: url(../_media/title_contactus.gif) left bottom no-repeat;}
#archives .title { background: url(../_media/title_archives.gif) left bottom no-repeat;}
#tellafriend .title { background: url(../_media/title_tellafriend.gif) left bottom no-repeat;}
#alertme .title { background: url(../_media/title_alertme.gif) left bottom no-repeat;}



{Content}
.content { padding: 0 15px 60px 15px; line-height: 1.4em;}

.cimage { display: block; width: 298px; float: left;}
.cbody { display: block; width: 411px; padding: 24px; float: right; background: #FFF;}

.cmenu { list-style-type: none; margin-bottom: 30px; padding: 0 !important;}
.cmenu li { padding: 0 !important;}
.cmenu li a {}
.cmenu li a.on { color: #000; text-decoration: underline;}

.cbody h3 { font-size: 1.4em; font-weight: normal; margin-bottom: 1.4em;}

.cbody table { width: 100%; border-collapse: collapse; margin-bottom: 2em;}
.cbody th { background-color: #999a90; color: #eff3d8; padding: 2px 5px; text-align: left; font-weight: normal;}
.cbody tr { vertical-align: top;}
.cbody td { padding: 2px 5px; border-bottom: 1px Solid #EEE;}
.first_col { width: 35%;}

.cbody ol, .cbody ul { padding-left: 2em;}
.cbody ol li, .cbody ul li { padding-bottom: 1em;}

.patch {}
.patchitem { display: block; width: 70px; margin: 0 6px 6px 0; padding: 2px; text-align: center; border: 1px Solid #CCC; font-size: 0.9em;}

.voted { border: 1px Solid #CCC; padding: 5px; background: #FFFFCC; margin-bottom: 1em;}
.voted img { float: left; border: 3px solid #FFF; margin-right: 3px;}


{Footer}
.footer { padding: 10px 0; text-align: center; font-family: Verdana, sans-serif; font-size: 8pt; color: #777;}

.logo { background: url(../_media/logo_nhb.gif) center top no-repeat; padding-top: 70px; margin-top: 20px;}
.terms a { margin: 0 5px;}



{Customise}
#home .base {}

.mainpg .content { background: #e1e0c7;}

.festivalhub .main { background: #fc5a5a url(../_media/layout_bg_festivalhub.jpg) center top no-repeat;}
.outreach .main { background: #ffc100 url(../_media/layout_bg_outreach.jpg) center top no-repeat;}
.festivalmustknow .main { background: #9664ac url(../_media/layout_bg_essential.jpg) center top no-repeat;}
.activities .main { background: #3eb900 url(../_media/layout_bg_activities.jpg) center top no-repeat;}
.generalpg .main { background: #b8c4d0 url(../_media/layout_bg_general.jpg) center top no-repeat;;}



{home}
#home .banner { position: relative; display: block; height: 648px; background: url(../_media/home_banner.jpg) left top no-repeat;}

#home .banner blockquote span { display: none;}
#home .banner .dialog1 a { position: absolute; top: 220px; left: 470px; display: block; width: 155px; height: 65px;}
#home .banner .dialog2 a { position: absolute; top: 50px; left: 645px; display: block; width: 135px; height: 80px;}
#home .banner .dialog3 a { position: absolute; top: 535px; left: 190px; display: block; width: 150px; height: 95px;}
#home .banner .dialog4 a { position: absolute; top: 315px; left: 360px; display: block; width: 151px; height: 120px;}

#home .title h2 { display: block; width: 796px; height: 48px; background: url(../_media/home_title.gif) no-repeat left top;}

#home .content h3 span { display: none;}

#home .highlights { display: block; width: 370px; padding: 10px 0;}
#home .highlights h3 { display: block; width: 370px; height: 25px; margin-bottom: 5px;}
#home .highlights h3.contest { background: url(../_media/home_label_contest.gif);}
#home .highlights h3.registration { background: url(../_media/home_label_registration.gif);}
#home .highlights h3.announcement { background: url(../_media/home_label_announcement.gif);}

#home .highlights dl { padding-bottom: 10px;}
#home .highlights dt { display: block;}
#home .highlights dt a { color: #FF5A00; font-weight: bold;}
#home .highlights dt a:hover { text-decoration: underline;}
#home .highlights dd {}



{Content Images}
.cimage { display: block; width: 295px; background: no-repeat left top;}

.festivalhub .cimage { margin-top: 300px;}
.outreach .cimage { margin-top: 255px;}
.festivalmustknow .cimage { margin-top: 275px;}
.activities .cimage { margin-top: 255px;}
.generalpg .cimage { margin-top: 205px;}

#ci4 { height: 150px; background: url(../_media/aboutthefestival_festivallogo_logo.gif);}

#ci23 { height: 150px; background: url(../_media/festivalhub_sponsor.jpg);}
#ci24 { height: 313px; background: url(../_media/festivalhub_kidszone_left_img.jpg);}
#ci25 { height: 2419px; background: url(../_media/festivalhub_stage_performances_left_img.jpg);}

#ci30 { height: 476px; background: url(../_media/outreachprogrammes_funonfoot_overview_left_img.jpg);}
#ci47 { height: 313px; background: url(../_media/outreachprogrammes_vintagecar_left_img.jpg);}
#ci26 { height: 313px; background: url(../_media/outreachprogrammes_culture101_overview_left_img.jpg);}
#ci52 { height: 637px; background: url(../_media/outreachprogrammes_soundstories1_left_img.jpg);}
#ci50 { height: 799px; background: url(../_media/outreachprogrammes_soundstories2_left_img.jpg);}
#ci59 { height: 313px; background: url(../_media/outreachprogrammes_culinary_overview_left_img.jpg);}
#ci53 { height: 476px; background: url(../_media/outreachprogrammes_hotm_kidsonb_left_img.jpg);}
#ci54 { height: 637px; background: url(../_media/outreachprogrammes_hotm_rolling_left_img.jpg);}
#ci34 { height: 313px; background: url(../_media/outreachprogrammes_expeditionh_trails_left_img.jpg);}
#ci63 { height: 1447px; background: url(../_media/outreachprogrammes_partners_museums_left_img.jpg);}

#ci29 { height: 150px; background: url(../_media/festivalessentials_opening_sponsor.jpg);}



{Pop up}
.popup { position: absolute; z-index: 999; left: 0; top: 0; display: block; width: 100%; height: 100%; background: transparent url(../_media/popup_bg.png) repeat scroll 0%;}

.popup_img { display: block; width: 680px; background: #FFF; padding: 10px; margin: 20px auto; overflow: hidden;}
.popup_img img { margin-bottom: 1em;}