@charset "utf-8"; @font-face { font-family: 'ChelseaMarket'; src: url('../fonts/ChelseaMarket-Regular.eot'); /* IE9 Compat Modes */ src: url('../fonts/ChelseaMarket-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/ChelseaMarket-Regular.ttf') format('truetype'); /* Safari, Android, iOS */ font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AmaticSC'; src: url('../fonts/AmaticSC-Regular.eot'); /* IE9 Compat Modes */ src: url('../fonts/AmaticSC-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/AmaticSC-Regular.ttf') format('truetype'); /* Safari, Android, iOS */ font-style: normal; font-weight: normal; text-rendering: optimizeLegibility; } @font-face { font-family: 'AmaticSC'; src: url('../fonts/AmaticSC-Bold.eot'); /* IE9 Compat Modes */ src: url('../fonts/AmaticSC-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/AmaticSC-Bold.ttf') format('truetype'); /* Safari, Android, iOS */ font-style: normal; font-weight: bold; text-rendering: optimizeLegibility; } .clearfix:after {clear:both;content:".";display:block;height:0;visibility:hidden;} .clearfix{display:inline-block;} .clearfix{display:block;float:none;} html{-webkit-text-size-adjust:none;} html,body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,a,a:hover,a:link,a:visited{padding:0;margin:0;font-size:17px;font-family:Arial, Helvetica, Microsoft JhengHei, Heiti TC, sans-serif;color:#fff;text-align:center;} body{overflow:auto;min-width:768px;background-color:#fff;} body>.outerContainer{width:100%;height:100%;min-width:768px;max-width:768px;position:relative;margin:0 auto;min-height:768px;} body>.outerContainer>.outerWrapper{width:100%;;min-width:768px;max-width:768px;position:relative;overflow:hidden;} body>.outerContainer>.outerWrapper>.container{min-height:768px;} h1{font-size:72px;color:#356619;font-family:'ChelseaMarket',Arial,Helvetica,Microsoft JhengHei,Heiti TC,sans-serif;font-weight:normal;} h2{font-size:60px;color:#fff;font-family:'ChelseaMarket',Arial,Helvetica,Microsoft JhengHei,Heiti TC,sans-serif;font-weight:normal;} h3{font-size:32px;color:#fff;font-family:'ChelseaMarket',Arial,Helvetica,Microsoft JhengHei,Heiti TC,sans-serif;font-weight:normal;} h4{font-size:36px;font-family:'ChelseaMarket',Arial,Helvetica,Microsoft JhengHei,Heiti TC,sans-serif;font-weight:normal;line-height:45px;} h5{font-size:24px;font-family:'ChelseaMarket',Arial,Helvetica,Microsoft JhengHei,Heiti TC,sans-serif;font-weight:normal;} h6,h6 a,h6 a:hover,h6 a:link,h6 a:visited{font-size:21px;font-family:'ChelseaMarket',Arial,Helvetica,Microsoft JhengHei,Heiti TC,sans-serif;font-weight:normal;} p{font-size:21px;line-height:30px;} a, a:hover, a:link, a:visited {text-decoration:none;} a img{border:none;} input{color:#404040;} input[type="radio"] , label{cursor:pointer;} input[type="text"],input[type="number"],textarea{font-size:17px;line-height:21px;border-radius:5px;} textarea{overflow: auto;} .ie8 input[type="text"]{line-height:26px;} ::-webkit-input-placeholder{font-size:17px;line-height:26px;color:#b3b3b3;opacity:1;} ::-moz-placeholder{font-size:17px;line-height:26px;color:#b3b3b3;opacity:1;} :-ms-input-placeholder{font-size:17px;line-height:26px;color:#b3b3b3;opacity:1;} :-moz-placeholder{font-size:17px;line-height:26px;color:#b3b3b3;opacity:;} .placeholder{color:#b3b3b3;} svg{display:block;} object{display:none;} a:hover svg #icon_info{fill:#fff;} a:hover svg #icon_bg_info{fill:#529DBA;} .bx-wrapper .bx-viewport {background:none;border:none;box-shadow:none;left:0px;} .bx-wrapper .bx-controls-direction a {margin-top: -16px;outline: 0 none;position: absolute;text-indent: -9999px;top:160px;height:80px;width:80px;z-index: 9999;} .bx-wrapper .bx-prev {background:url(../../images/bxslider_btn_left.png) no-repeat scroll 0 0; left:20px;} .bx-wrapper .bx-next {background:url(../../images/bxslider_btn_right.png) no-repeat scroll 0 0; right:20px;} .bx-wrapper .bx-prev:hover {background-position:0 bottom;} .bx-wrapper .bx-next:hover {background-position:0 bottom;} /* iCheck plugin */ .icheckbox_minimal,.iradio_minimal{display:inline-block;*display:inline;vertical-align:middle;margin:0;padding:0;width:24px;height:24px;background:url(../../images/icheck.png) no-repeat;border:none;cursor:pointer;} .icheckbox_minimal{background-position:0 0;} .icheckbox_minimal.hover{background-position:-24px 0;} .icheckbox_minimal.checked{background-position:-48px 0;} .icheckbox_minimal.disabled{background-position:-60px 0;cursor:default;} .icheckbox_minimal.checked.disabled{background-position:-80px 0;} .iradio_minimal{background-position:-120px 0;} .iradio_minimal.hover{background-position:-144px 0;} .iradio_minimal.checked{background-position:-168px 0;} .iradio_minimal.disabled{background-position:-160px 0;cursor:default;} .iradio_minimal.checked.disabled{background-position:-180px 0;} /* HiDPI support */ @media (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi), (min-resolution: 1.25dppx) { .icheckbox_minimal,.iradio_minimal{background-image:url(../../images/icheck2x.png);-webkit-background-size:240px 24px;background-size:240px 24px;} } /* fancySelect plugin */ div.fancy-select{position:relative;font-size:17px;text-align:left;} div.fancy-select.disabled{opacity:0.5;} div.fancy-select div.trigger{color:#b3b3b3;background-color:#fff;border-radius:5px;cursor:pointer;padding:8px 15px;width:253px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative;border:1px solid #b3b3b3;line-height:26px;transition:all 240ms ease-out;-webkit-transition:all 240ms ease-out;-moz-transition:all 240ms ease-out;-ms-transition:all 240ms ease-out;-o-transition:all 240ms ease-out;} div.fancy-select div.trigger:after{content:"";display:block;position:absolute;width:0;height:0;border:5px solid transparent;border-top-color:#4B5468;top:20px;right:15px;} div.fancy-select div.trigger.open{border:1px solid #b3b3b3;border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0;} div.fancy-select div.trigger.selected{color:#000;} div.fancy-select ul.options{list-style:none;margin:0;position:absolute;left:0;visibility:hidden;opacity:0;z-index:1001;overflow:auto;background-color:#fff;border-radius:5px;min-width:283px;max-height:300px;transition:opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out;-webkit-transition:opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out;-moz-transition:opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out;-ms-transition:opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out;-o-transition:opacity 300ms ease-out, top 300ms ease-out, visibility 300ms ease-out;border:1px solid #b3b3b3;border-top:none;border-top-left-radius:0;border-top-right-radius:0;display:none;} div.fancy-select ul.options.open{visibility:visible;top:42px;opacity:1;transition:opacity 300ms ease-out, top 300ms ease-out;-webkit-transition:opacity 300ms ease-out, top 300ms ease-out;-moz-transition:opacity 300ms ease-out, top 300ms ease-out;-ms-transition:opacity 300ms ease-out, top 300ms ease-out;-o-transition:opacity 300ms ease-out, top 300ms ease-out;display:block;} div.fancy-select ul.options li{font-size:17px;color:#b3b3b3;text-align:left;padding:0 15px 9px;cursor:pointer;white-space:nowrap;transition:all 150ms ease-out;-webkit-transition:all 150ms ease-out;-moz-transition:all 150ms ease-out;-ms-transition:all 150ms ease-out;-o-transition:all 150ms ease-out;} div.fancy-select ul.options li.selected{color:#000;} div.fancy-select ul.options li.hover{color:#f58426;} #menu{width:100%;height:100%;overflow:hidden;position:absolute;} #menu #menu_bar_overlayBg{width:100%;height:100%;position:fixed; background-color:#000;top:0; z-index:9997;cursor:pointer; opacity:0; display:none; max-width:1920px;} #menu .menu_bar{ width:370px; height:100%; position:absolute; top:0; left:-390px; z-index:9999; background-color:#eee8c5; box-shadow:0 0 5px #000;} #menu .menu_bar a.title{ position:relative;} #menu .menu_bar a{ border-bottom:1px solid #d4bf95; padding-left:71px; display:block; background-color:#eee8c5;} #menu .menu_bar a p{text-align:left;} #menu .menu_bar a p img{margin-left:5px;} #menu .menu_bar a.title p{line-height:96px; font-size:26px; color:#808080;} #menu .menu_bar a:hover{background-color:#7fb539; cursor:pointer;} #menu .menu_bar a.title:hover{background:none; cursor:default;} #menu .menu_bar>.top_level{padding:30px 30px 30px 70px; background:url(../../images/menu_arrow_r.png) 41px center no-repeat;} #menu .menu_bar>.top_level:hover{background-image:url(../../images/menu_arrow_r_over.png);} #menu .menu_bar>.top_level.game1 p{background:url(../../images/menu_icon1.png) left center no-repeat;} #menu .menu_bar>.top_level.game2 p{background:url(../../images/menu_icon2.png) left center no-repeat;} #menu .menu_bar>.top_level.game3 p{background:url(../../images/menu_icon3.png) left center no-repeat;} #menu .menu_bar>.top_level p{color:#404040; padding-left:55px; font-size:26px; line-height:30px;} #menu .menu_bar>.top_level:hover p{color:#3f6619} #menu .menu_bar>.link_bottom{ width:100%; display:block; position:absolute; bottom:0; right:0;} #menu .menu_bar>.link_bottom a{ padding:15px 30px 15px 70px; border-top:1px solid #d4bf95; border-bottom:none; position:relative; z-index:10000; background-position:40px 21px; background-repeat:no-repeat;} #menu .menu_bar>.link_bottom a p{color:#404040;} #menu .menu_bar>.link_bottom a:hover p{ color:#3f6619;} #menu .menu_bar>.link_bottom .menu_home{ background-image:url(../../images/menuIcon_home.png);} #menu .menu_bar>.link_bottom .menu_home:hover{ background-image:url(../../images/menuIcon_home_over.png);} #menu .menu_bar>.link_bottom .menu_whatIs{ background-image:url(../../images/menuIcon_whatIs.png);} #menu .menu_bar>.link_bottom .menu_whatIs:hover{ background-image:url(../../images/menuIcon_whatIs_over.png);} #menu .menu_bar>.link_bottom .menu_bookTour{ background-image:url(../../images/menuIcon_bookTour.png);} #menu .menu_bar>.link_bottom .menu_bookTour:hover{ background-image:url(../../images/menuIcon_bookTour_over.png);} #menu .menu_bar>.link_bottom .menu_joinScheme{ background-image:url(../../images/menuIcon_joinScheme.png);} #menu .menu_bar>.link_bottom .menu_joinScheme:hover{ background-image:url(../../images/menuIcon_joinScheme_over.png);} #menu .menu_bar>.link_bottom .menu_disclaimer{ background-image:url(../../images/menuIcon_disclaimer.png);} #menu .menu_bar>.link_bottom .menu_disclaimer:hover{ background-image:url(../../images/menuIcon_disclaimer_over.png);} #menu .menu_bar>.link_bottom .menu_disclaimerOfEEP{ background-image:url(../../images/menuIcon_disclaimer.png);} #menu .menu_bar>.link_bottom .menu_disclaimerOfEEP:hover{ background-image:url(../../images/menuIcon_disclaimer_over.png);} #menu .menu_bar>.link_bottom .menu_user{ background-image:url(../../images/menuIcon_user.png);} #menu .menu_bar>.link_bottom .menu_lang{ background-image:url(../../images/menuIcon_lang.png);} #menu .menu_bar>.link_bottom .menu_user{padding:15px 30px 15px 70px; display:block; text-align:left; border-top:1px solid #d4bf95; background-color:#eee8c5; background-position:40px 21px; background-repeat:no-repeat;} #menu .menu_bar>.link_bottom .menu_user a{ padding:0 20px 0 0; display:inline-block; border:none;} #menu .menu_bar>.link_bottom .menu_user a:hover{background:none;cursor:pointer;} .professional #menu .menu_bar>.link_bottom .menu_user .btn_professional:hover, .public #menu .menu_bar>.link_bottom .menu_user .btn_public:hover{cursor:default;} #menu .menu_bar>.link_bottom .menu_user a p{ color:#808080} #menu .menu_bar>.link_bottom .menu_user a:hover p, .professional #menu .menu_bar>.link_bottom .menu_user .btn_professional p, .public #menu .menu_bar>.link_bottom .menu_user .btn_public p{color:#7fb539} #menu .menu_bar>.link_bottom .menu_lang{padding:15px 30px 15px 70px; display:block; text-align:left; border-top:1px solid #d4bf95; background-color:#eee8c5; background-position:40px 21px; background-repeat:no-repeat;} #menu .menu_bar>.link_bottom .menu_lang a{ padding:0 28px 0 0; display:inline-block; border:none;} #menu .menu_bar>.link_bottom .menu_lang a:hover{ background:none;} #menu .menu_bar>.link_bottom .menu_lang a p{ color:#808080;} html:lang(en) #menu .link_bottom .menu_lang .en p, html:lang(tc) #menu .link_bottom .menu_lang .tc p, html:lang(sc) #menu .link_bottom .menu_lang .sc p{color:#7fb539; cursor:default;} #menu .menu_bar>.link_bottom .menu_lang a:hover p{ color:#7fb539;} #menu .sub_menu_bar{ width:370px; height:80%; position:absolute; top:0; left:-360px; background-color:#eee8c5; z-index:9999;} #menu .sub_menu_bar a{ padding:30px 30px 30px 70px; background-color:#eee8c5; background-position:40px 33px; background-repeat:no-repeat;} #menu .sub_menu_bar a:hover{ background-color:#7fb539;} #menu .sub_menu_bar a p{ line-height:24px; color:#404040;} #menu .sub_menu_bar a:hover p{color:#3f6619;} #menu .sub_menu_bar a p img {vertical-align:top; margin-left:0px; margin-right:11px;} #menu .sub_menu_bar a.title p{ color:#808080; font-size:24px; line-height:24px; padding:7px 0;} #menu .sub_menu_bar .menu_introduction{ background-image:url(../../images/menuIcon_introduction.png);} #menu .sub_menu_bar .menu_introduction:hover{ background-image:url(../../images/menuIcon_introduction_over.png);} #menu .sub_menu_bar .menu_quiz{ background-image:url(../../images/menuIcon_quiz.png);} #menu .sub_menu_bar .menu_quiz:hover{ background-image:url(../../images/menuIcon_quiz_over.png);} #menu .sub_menu_bar .menu_survey{ background-image:url(../../images/menuIcon_survey.png);} #menu .sub_menu_bar .menu_survey:hover{ background-image:url(../../images/menuIcon_survey_over.png);} #menu .sub_menu_bar .menu_solar{ background-image:url(../../images/menuIcon_solar.png);} #menu .sub_menu_bar .menu_solar:hover{ background-image:url(../../images/menuIcon_solar_over.png);} #menu .sub_menu_bar .menu_wind{ background-image:url(../../images/menuIcon_wind.png);} #menu .sub_menu_bar .menu_wind:hover{ background-image:url(../../images/menuIcon_wind_over.png);} #menu .sub_menu_bar .menu_coolMaterials{ background-image:url(../../images/menuIcon_coolMaterials.png);} #menu .sub_menu_bar .menu_coolMaterials:hover{ background-image:url(../../images/menuIcon_coolMaterials_over.png);} #menu .sub_menu_bar .menu_passiveDesign{ background-image:url(../../images/menuIcon_passiveDesign.png);} #menu .sub_menu_bar .menu_passiveDesign:hover{ background-image:url(../../images/menuIcon_passiveDesign_over.png);} #menu .sub_menu_bar .menu_activeSystem{ background-image:url(../../images/menuIcon_activeSystem.png);} #menu .sub_menu_bar .menu_activeSystem:hover{ background-image:url(../../images/menuIcon_activeSystem_over.png);} #menu .sub_menu_bar .menu_renewableEnergy{ background-image:url(../../images/menuIcon_renewableEnergy.png);} #menu .sub_menu_bar .menu_renewableEnergy:hover{ background-image:url(../../images/menuIcon_renewableEnergy_over.png);} #menu .sub_menu_bar .menu_carbonCalculator{ background-image:url(../../images/menuIcon_carbonCalculator.png);} #menu .sub_menu_bar .menu_carbonCalculator:hover{ background-image:url(../../images/menuIcon_carbonCalculator_over.png);} #menu .btn_back{ width:320px; height:100%; position:absolute; top:0; left:-340px; z-index:10000; background:#eee8c5 url(../../images/menu_arrow_l.png) 295px 39px no-repeat; display:block; cursor:pointer; box-shadow:0 0 5px #000;} #menu .btn_back:hover{ background-color:#7fb539; background-image:url(../../images/menu_arrow_l_over.png);} .ie8 #menu .btn_back{behavior: url(../../js/PIE/PIE.htc);} #popup_aboutYourself{padding:42px;display:none;} #popup_aboutYourself h4{text-align:left;color:#f58426;padding-bottom:30px;} .ie8 #popup_aboutYourself h4{padding-left:7.5px;} #popup_aboutYourself p{color:#404040;text-align:left;} #popup_aboutYourself .box_user_level>h5{width:285px;float:left;text-align:left;color:#404040;padding-bottom:25px;margin-bottom:30px;border-bottom:1px solid #ccc;line-height:24px;} #popup_aboutYourself .box_user_level>h5:nth-child(odd){padding-right:30px;} .ie8 #popup_aboutYourself .box_user_level>h5{padding:0 7.5px 25px;} #popup_aboutYourself .box_user_level>h5 label{margin:0 0 0 10px; vertical-align:middle;} #popup_aboutYourself .box_user_info>input{ width:253px; padding:8px 15px; border:1px solid #b3b3b3; float:left; margin-bottom:15px; height:26px;} #popup_aboutYourself .box_user_info>.box_fancySelect{position:relative;float:left;height:44px;margin-bottom:15px;width:285px;} #popup_aboutYourself .box_user_info>input:nth-child(odd),#popup_aboutYourself .box_user_info>.box_fancySelect:nth-child(odd){margin-right:30px;} .ie8 #popup_aboutYourself .box_user_info>input,.ie8 #popup_aboutYourself .box_user_info>.box_fancySelect{margin:0 7.5px 15px;} #popup_aboutYourself .btn_aboutYourself{width:140px;padding-right:15px;margin:15px auto 0;display:block;background:url(../images/btn_aboutYourself.png) top center no-repeat;position:relative;z-index:1000;} #popup_aboutYourself .btn_aboutYourself:hover{background-position:bottom center;} #popup_aboutYourself .btn_aboutYourself h3{line-height:57px;} #popup_aboutYourself .btn_skip h5{color:#529dba; position:absolute; right:0; bottom:0;} #popup_aboutYourself .btn_skip:hover h5{color:#008283;} div.fancy-select.box_aboutYourself_age div.trigger.open,div.fancy-select.box_aboutYourself_occupation div.trigger.open{width:568px; position:relative; z-index:1001;} div.fancy-select.box_aboutYourself_age ul.options.open,div.fancy-select.box_aboutYourself_occupation ul.options.open{width:598px; z-index:1001;} div.fancy-select.box_aboutYourself_age ul.options.open li,div.fancy-select.box_aboutYourself_occupation ul.options.open li{width:269px; float:left;} #popup_what_is_ZCB{padding:42px;display:none;} #popup_what_is_ZCB h4{text-align:left;color:#f58426;padding-bottom:30px;} #popup_what_is_ZCB p{color:#404040;text-align:left;} #popup_disclaimer_of_Projects{padding:42px;display:none;} #popup_disclaimer_of_Projects h4{text-align:left;color:#f58426;padding-bottom:30px;} #popup_disclaimer_of_Projects p{color:#404040;text-align:left;} #main_content{padding:42px;display:none;} #main_content h4{text-align:left;color:#f58426;padding-bottom:30px;} #main_content p{color:#404040;text-align:left;} #header { position:relative; width:100%; z-index:99;} #header>div, #header>a{ position:absolute; top:218px;} #header .header_bar{top:0px; width:100%; background-color:#fff; position:relative; z-index:1;} #header .header_bar .logo{padding:20px 0 20px 22px; display:table;} #header .header_bar .logo h6{ color:#808080; text-align:left; margin-bottom:8px; line-height:1.2em;} #header .header_bar .logo a{ margin-right:20px;} #header .header_bar .sponsoring_bodies{ display:table-cell; vertical-align:middle; border-right:1px solid #ccc; padding-right:10px;} #header .header_bar .organizers{display:table-cell; vertical-align:middle; padding-left:30px;} #header #btn_menu{left:20px;top:204px; width:88px; height:88px; background:url(../../images/btn_menu.png) top left no-repeat; cursor:pointer;} #header #btn_menu:hover{ background-position:bottom right;} #header>#btn_lang{right:20px; width:104px; height:52px; padding:8px 0; background:url(../../images/btn_lang.png) top left no-repeat; cursor:pointer; overflow:hidden;} #header>#btn_lang:hover{height:172px; background-position:top right;} #header>#btn_lang a{ display:block; width:42px; padding:0 0 0 15px;} #header>#btn_lang a h6{ line-height:52px; text-align:left; font-size:28px;} #header>#btn_lang a:hover h6{ color:#f7941e;} #header>#btn_user{right:144px;width:230px;height:52px;padding:8px 0; background:url(../../images/btn_user.png) top left no-repeat; cursor:pointer; overflow:hidden;} #header>#btn_user:hover{height:120px; background-position:top right;} #header>#btn_user a{ display:block; margin:0 0 0 15px; position:relative;} #header>#btn_user .btn_public{margin-right:120px;} #header>#btn_user .btn_professional{margin-right:40px;} #header>#btn_user a h6{ line-height:52px; text-align:left; font-size:28px;} #header>#btn_user a:hover h6{ color:#f7941e;} .professional #header>#btn_user a {top:-52px;} .professional #header>#btn_user:hover a {top:0;} #header>#btn_sound{right:413px; width:68px; height:68px; background:url(../../images/btn_sound.png) top left no-repeat; cursor:pointer;} #header>#btn_sound:hover{ background-position:bottom left;} #header>#btn_sound.mute{ background-position:top right;} #header>#btn_sound.mute:hover{background-position:bottom right;} #footer{position:relative; z-index:2; width:100%;background-color:#fff;} #footer .btn_ambassador{float:right; width:343px; height:104px; padding:0 20px; background-color:#529dba; display:block; border-left:1px solid #008283;} #footer .btn_ambassador:hover{background-color:#008283;} #footer .btn_ambassador>div{height:104px; width:100%; display:table;} #footer .btn_ambassador>div>h5{display:table-cell; vertical-align:middle; text-align:center;} #footer .btn_book_a_tour{float:right; width:344px; height:104px; padding:0 20px; background-color:#529dba; display:block;} #footer .btn_book_a_tour:hover{background-color:#008283;} #footer .btn_book_a_tour>div{height:104px; width:100%; display:table;} #footer .btn_book_a_tour>div>h4{display:table-cell; vertical-align:middle; text-align:center;} #footer>div>span{line-height:24px; padding:20px 0; color:#404040; display:block; } #footer>div>span>a{color:#529dba; margin:0 10px;} #footer>div>span>a:hover{text-decoration:underline;} .menu_disclaimerOfEEP{cursor:pointer;} .container{width:100%;height:100%;position:relative;z-index:1;} .wrapper{width:768px; height:100%; margin:0 auto; position:relative;} .content_box{width:100%;} .bg_cloud{position:absolute;z-index:0;} .ie8 .bg_cloud,.ie9 .bg_cloud{display:none;} .bg_cloud.l{width:170px;height:107px;background:url(../../images/bg_cloud_l.png);display:none;} .bg_cloud.s{width:85px;height:54px;background:url(../../images/bg_cloud_s.png);} .btn_popup_info{position:absolute; display:block; cursor:pointer; z-index:1000;} #btn_main_content{top:390px; left:12px; position:absolute; z-index:20; cursor:pointer;} .popup_info_box{ padding:42px; display:none;} .popup_info_box .popup_animate {width:100%; display:block;} .popup_info_box .txt_popup_animate{position:absolute;top:137px;left:47px;font-size:11px;color:#f15a22;text-align:left;font-weight:bold;} _::-moz-svg-foreign-content, :root .popup_info_box .txt_popup_animate{font-weight:normal;} .popup_info_box h4{ text-align:left; color:#f15a22; padding-bottom:30px;} .popup_info_box img{ padding-bottom:30px;} .popup_info_box p{ text-align:left; color:#404040;} .popup_info_box p.caption{padding: 42px 1px 0;} .popupWrapper{width:100%;height:100%;position:absolute; top:0;} .popupWrapper>div{height:824px;margin:174px auto 32px; position:relative; display:table;} .fancybox-overlay{ background:none;} .fancybox-wrap{position:relative !important; margin:0 auto; vertical-align:middle; z-index:inherit; top:398px!important; left:0!important;} #index .fancybox-wrap{top:331px !important;} .fancybox-skin{background: rgba(0, 0, 0, 0.3); box-shadow:none; border-radius:8px; margin:0 auto; width:684px !important; position:relative; z-index:9998;} .ie8 .fancybox-skin{background-image: url(../../images/black30.png); background-color:inherit;} .fancybox-outer{background:#fff; width:684px;} .fancybox-inner{width:684px; overflow:hidden !important;} .fancybox-lock .fancybox-overlay { overflow:auto;} .fancybox-opened .fancybox-skin{box-shadow:none;} .fancybox-close{ background-image: url(../../images/fancy_btn_close.png); width:56px; height:56px; top:-20px; right:-20px;} .fancybox-close:hover{ background-position:center bottom;} .popup_info_content{ position:relative;} .slider{ height:100%; width:100%;} .slider>.wrapper{ position:absolute; width:100%; height:auto; left:0;} .slider .slider_page { overflow:hidden; opacity:1;} .slider .slider_page>.slider_page_wrapper{ float:left; position:relative; left:0;} .slider .slider_page>.slider_page_wrapper>* { float:left; position:relative;} .slider .slider_btn{width:32px; height:32px; display:block; position:absolute; top:112px; cursor:pointer; z-index:1000;} .slider .slider_btn_prev{ background: url(../../images/slider_btn_left.png) center top; left:-16px;} .slider .slider_btn_next{ background: url(../../images/slider_btn_right.png) center top; right:-16px;} .slider .slider_btn:hover{ background-position:center bottom;} .slider .slider_btn.block{ opacity:0.5; cursor:default;} .slider .slider_btn.block:hover{ background-position:center top;} .slider .slider_pager a{width:16px;height:16px;border-radius:8px;margin:0 12px;background-color:#529dba; display:inline-block; cursor:pointer; behavior: url(../../js/PIE/PIE.htc);} .slider .slider_pager a:hover, .slider .slider_pager .active{ background-color:#ffc70e;} .slider .slider_pager .active{ background-color:#ffc70e; cursor:default;} .slider.intro{ height:100%; width:100%; top:0; position:absolute;} .slider.intro>.wrapper{position:relative;width:768px;} .slider.intro>.slider_page { position:absolute; top:0; width:100%; height:100%;} .slider.intro .slider_btn{width:80px; height:80px; display:block; position:absolute; top:628px; cursor:pointer; z-index:1000;} .slider.intro .slider_btn_prev{ background: url(../../images/introslider_btn_left.png) center top; left:20px;} .slider.intro .slider_btn_next{ background: url(../../images/introslider_btn_right.png) center top; right:20px;} .slider.intro .slider_btn:hover{background-position:center center;} .slider.intro .slider_btn.block{background-position:center bottom; cursor:default;} .slider.intro .slider_pager {top:922px; position:absolute; width:100%; z-index:1000;} .content_box.top{z-index:1;position:relative;} .content_box.top>.wrapper>h2{line-height:72px;padding:148px 0 20px;position:relative;z-index:25;} .content_box.top>.wrapper>h4{line-height:60px;position:relative;z-index:25;} .content_box.top .btn_take_the_quiz{width:263px;height:57px;padding-left:19px;margin:0 auto;display:block;background:url(../images/btn_take_the_quiz.png) top center no-repeat;position:relative;top:580px;z-index:1000;} .content_box.top .btn_take_the_quiz:hover{background-position:bottom center;} .content_box.top .btn_take_the_quiz h3{line-height:57px;} .content_box.top .subMenu_btn_back{width:36px;height:60px;display:block;background:url(../../images/subMenu_btn_back.png) left 24px no-repeat;margin:0 0 40px 25px;position:relative;z-index:2;} .content_box.top .subMenu_btn_back:hover{background:url(../../images/subMenu_btn_back_over.png) left 24px no-repeat;} .intro .content_box.top .btn_take_the_quiz{top:604px;} .intro .content_box.top h2{color: #356619;} #index .container{background-color:#eee8c5;} #index .content_box.bottom{background:url(../../images/index/bg_content_box_bottom.png) top center no-repeat;min-height:132px;z-index:-2;margin-top:-87px;} #index .content_box.top h1{position:relative;z-index:25;padding-right:78px;} #index .content_box.top>.wrapper>h4{color:#356619;padding-top:148px;} #index .content_box.top .menu_whatIs{background:url(../../images/index/what_is_ZCB.png) top center repeat-x;width:126px;height:110px;display:block;padding-top:72px;position:absolute;top:130px;left:555px;cursor:pointer;z-index:25;} #index .content_box.top #main_content{ position:relative; display:block; padding:0;} #index .content_box.top #main_content>a{position:absolute;top:0;width:100%;z-index:5;display:block;} #index .content_box.top #main_content>a>svg{margin:0 auto;} #index .content_box.top #main_content>a h4{color:#356619;padding-top:0;width:345px;position:absolute;top:324px;left:212px;z-index:1;text-align:center;} #index .content_box.top .main_image{margin-top:30px;} .quiz .container{background-color:#eee8c5;} .quiz .content_box.top{height:100%; min-height:1210px;} .quiz .content_box.top h2 {color:#356619;position:relative;z-index:1;} .quiz .content_box.top>.wrapper>h4{background:url(../images/titleBg_subLevel_quiz.png) center center no-repeat;position:relative;z-index:1;} .quiz .content_box.bottom{background:url("../../images/index/bg_content_box_bottom.png") no-repeat scroll center top;margin-top:-25px;min-height:130px;} .quiz .content_box.top .questionBox{width:100%;top:365px;position:absolute;display:none;} .quiz .content_box.top .questionBox .quizNumber{background:url(../images/titleBg_quizNumber.png) top center no-repeat;color:#fff;width:201px;height:108px;line-height:108px;margin:40px auto 0;} .quiz .content_box.top .questionBox .question{background:url(../images/titleBg_question.png) top center no-repeat;width:648px;margin:-35px auto 0;padding:0 40px;display:table;} .quiz .content_box.top .questionBox .question>p{color:#404040;font-weight:bold;vertical-align:middle;display:table-cell;height:180px;line-height:26px;margin-left:100px;} .quiz .content_box.top .questionBox .answer>p{margin-top:20px;color:#404040;} .quiz .content_box.top .questionBox .answer>p:first-child{margin-top:40px;} .quiz .content_box.top .questionBox .answer>p>label{width:500px;display:inline-block; text-align:left;vertical-align:top;margin-left:20px;margin-top:15px;} .quiz .content_box.top .questionBox .answer .iradio_minimal{height:60px;width:108px;} .quiz .content_box.top .questionBox .answer #ansA .iradio_minimal{background:url(../../images/icheck_ansA.png) top center no-repeat;} .quiz .content_box.top .questionBox .answer #ansB .iradio_minimal{background:url(../../images/icheck_ansB.png) top center no-repeat;} .quiz .content_box.top .questionBox .answer #ansC .iradio_minimal{background:url(../../images/icheck_ansC.png) top center no-repeat;} .quiz .content_box.top .questionBox .answer #ansD .iradio_minimal{background:url(../../images/icheck_ansD.png) top center no-repeat;} .quiz .content_box.top .questionBox .answer #ansA .iradio_minimal.checked,.quiz .content_box.top .questionBox .answer #ansA .iradio_minimal.hover, .quiz .content_box.top .questionBox .answer #ansB .iradio_minimal.checked,.quiz .content_box.top .questionBox .answer #ansB .iradio_minimal.hover, .quiz .content_box.top .questionBox .answer #ansC .iradio_minimal.checked,.quiz .content_box.top .questionBox .answer #ansC .iradio_minimal.hover, .quiz .content_box.top .questionBox .answer #ansD .iradio_minimal.checked,.quiz .content_box.top .questionBox .answer #ansD .iradio_minimal.hover {background-position:bottom center;} .quiz .content_box.top .btn_okay{width:131px;height:56px;padding-left:45px;margin:40px auto 0;display:block;background:url(../images/btn_okay.png) top center no-repeat;z-index:1000;line-height:56px;cursor:pointer;} .quiz .content_box.top .btn_okay:hover{background-position:bottom center;} .quiz #popup_checkless{padding:42px;display:none;} .quiz #popup_checkless h4{color:#f58426;text-align:center;} .quiz #popup_gameRule{padding:42px;display:none;} .quiz #popup_gameRule h4{color:#f58426;text-align:left;padding-bottom:30px;} .quiz #popup_gameRule p{color: #404040;text-align:left;} .quiz .popup_gameRuleCSS .fancybox-close{background:rgba(0, 0, 0, 0) url("../images/gameRule_poupCloseBtn.png") repeat scroll 0 0;bottom:-15px;height:47px;left:303px; top:inherit;width:94px;} .quiz .popup_gameRuleCSS .fancybox-close:hover{background-position:left bottom;} .result .container{background-color:#eee8c5;} .result .content_box.top h2 {color:#356619;position:relative;z-index:1;} .result .content_box.top>.wrapper>h4{background:url(../images/titleBg_subLevel_quiz.png) center center no-repeat;position:relative;z-index:1;} .result .content_box.bottom{background:url(../../images/index/bg_content_box_bottom.png) top center no-repeat;min-height:130px;} .result .content_box.top>.wrapper>.resultPoint{background:none; color:#f15a22; margin-top:40px;} .result .content_box.top .graphPoint{background:url(../../images/pointBg.png) left bottom no-repeat; padding:0 5px 26px 3px; width:702px; height:77px; margin:20px auto 0;text-align:left; position:relative;} .result .content_box.top .graphPoint .pointTree{position:absolute; bottom:31px; display:none;} .result .content_box.top .quizComment{padding:20px 40px; position:absolute;} .result .content_box.top .quizComment.fair{background:url(../images/titleBg_quizComment_fair.png) center center no-repeat;width:311px;height:107px;left:188.5px;margin-top:45px;} .result .content_box.top .quizComment.nice{background:url(../images/titleBg_quizComment_nice.png) center center no-repeat;width:288px;height:83px;left:200px;margin-top:58px;} .result .content_box.top .quizComment.good{background:url(../images/titleBg_quizComment_good.png) center center no-repeat;width:288px;height:83px;left:200px;margin-top:58px;} .result .content_box.top .quizComment.veryGood{background:url(../images/titleBg_quizComment_veryGood.png) center center no-repeat;width:346px;height:83px;left:171px;margin-top:58px;} .result .content_box.top .quizComment.excellent{background:url(../images/titleBg_quizComment_excellent.png) center center no-repeat;width:384px;height:83px;left:152px;margin-top:58px;} .result .content_box.top .quizComment h2{line-height:45px; margin-bottom:12px; color:#fff;} .result .content_box.top .quizComment h5{line-height:26px;} .result .content_box.top .mediaBox>p{color:#404040; margin:230px 0 32px; padding:0 100px;} .result .content_box.top .btn_facebook{width:56px;height:56px;background:url(../../images/btn_facebook.png) top center no-repeat; display:inline-block; margin:0 10px;} .result .content_box.top .btn_facebook:hover{background-position:bottom center;} .result .content_box.top .btn_mail{width:56px;height:56px;background:url(../../images/btn_mail.png) top center no-repeat; display:inline-block; margin:0 10px;} .result .content_box.top .btn_mail:hover{background-position:bottom center;} .result .content_box.top .btn_takeOurSurvey{width:295px;height:56px;padding-left:50px;margin:0 auto;display:block;background:url(../images/btn_takeOurSurvey.png) top center no-repeat;position:relative;top:36px;z-index:1000;line-height:56px;cursor:pointer;} .result .content_box.top .btn_takeOurSurvey:hover{background-position:bottom center;} .survey .container{background-color:#eee8c5;} .survey .content_box.top h2 {color:#356619;position:relative;z-index:1;} .survey .content_box.top>.wrapper>h4{background:url(../images/titleBg_subLevel_survey.png) center center no-repeat;position:relative;z-index:1;} .survey .content_box.bottom{background:url(../../images/index/bg_content_box_bottom.png) center top no-repeat;min-height:132px; margin-top:-92px} .survey .content_box.top>.wrapper>.mainTitle{background:none; color:#f15a22; margin-top:40px; line-height:45px; width:648px; padding:0 20px; margin:40px auto 0;} .survey .content_box.top>.wrapper>.mainContent{color: #404040; width:648px; padding:0 20px; margin:20px auto 0;} .survey .content_box.top>.wrapper .form{width:628px; padding:0 30px; margin:40px 0 0; position:absolute; left:40px;} .survey .content_box.top>.wrapper .form.row2{background:url(../../images/survey_formBg_row2.png) right 20px no-repeat;} .survey .content_box.top>.wrapper .form.row25{background:url(../../images/survey_formBg_row25.png) right 20px no-repeat;} .survey .content_box.top>.wrapper .form.row3{background:url(../../images/survey_formBg_row3.png) right 20px no-repeat;} .survey .content_box.top>.wrapper .form.row35{background:url(../../images/survey_formBg_row35.png) right 20px no-repeat;} .survey .content_box.top>.wrapper .form.row4{background:url(../../images/survey_formBg_row4.png) right 20px no-repeat;} .survey .content_box.top>.wrapper .form.row5{background:url(../../images/survey_formBg_row5.png) right 20px no-repeat;} .survey .content_box.top>.wrapper .form.rowMax{background:url(../../images/survey_formBg_rowMax.png) right 20px no-repeat;} .survey .content_box.top>.wrapper .form h4{margin:0 auto;line-height:58px; font-size:32px;} .survey .content_box.top>.wrapper #form1 h4{background:url(../images/titleBg_survey4_partTitle1.png) center center no-repeat;} .survey .content_box.top>.wrapper #form2 h4{background:url(../images/titleBg_survey4_partTitle2.png) center center no-repeat;} .survey .content_box.top>.wrapper #form3 h4{background:url(../images/titleBg_survey4_partTitle3.png) center center no-repeat;} .survey .content_box.top>.wrapper #form4 h4{background:url(../images/titleBg_survey4_partTitle4.png) center center no-repeat;} .survey .content_box.top>.wrapper #form5 h4{background:url(../images/titleBg_survey4_partTitle5.png) center center no-repeat;} .survey .content_box.top>.wrapper #form6 h4{background:url(../images/titleBg_survey4_partTitle6.png) center center no-repeat;} .survey .content_box.top>.wrapper #form7 h4{background:url(../images/titleBg_survey4_partTitle7.png) center center no-repeat;} .survey .content_box.top>.wrapper #form8 h4{background:url(../images/titleBg_survey4_partTitle8.png) center center no-repeat;} .survey .content_box.top>.wrapper #form9 h4{background:url(../images/titleBg_survey4_partTitle9.png) center center no-repeat;} .survey .content_box.top>.wrapper .form h5{float:left;width:20%;color:#f15a22;font-size:18px;line-height:21px;text-align:center;margin-top:15px;} .survey .content_box.top>.wrapper .form .box_title h5{color:#404040;margin-top:25px;} .survey .content_box.top>.wrapper #form1 .box_title h5:first-child{padding:0;margin:0;} .survey .content_box.top>.wrapper #form1 h5:first-child{width:100%;text-align:center;padding:5px 0;margin-top:25px;} .survey .content_box.top>.wrapper #form2 .box_title h5:first-child{padding:0;margin:0;} .survey .content_box.top>.wrapper #form2 h5:first-child{width:100%;text-align:center;padding:5px 0;margin-top:25px;} .survey .content_box.top>.wrapper #form3 .box_title h5:first-child{padding:0;margin:0;} .survey .content_box.top>.wrapper #form3 h5:first-child{width:100%;text-align:center;padding:5px 0;margin-top:25px;} .survey .content_box.top>.wrapper #form5 .box_title h5{width:100%;margin-top:25px;} .survey .content_box.top>.wrapper #form5 h5{width:33%;padding-right:0;margin:15px 0 0;text-align:center;} .survey .content_box.top>.wrapper #form6 .box_title h5{width:100%;text-align:center;margin-top:25px;} .survey .content_box.top>.wrapper #form6 h5{width:20%;padding-right:0;margin:15px 0 0;text-align:left;} .survey .content_box.top>.wrapper #form6 h5 label{width:90px;} .survey .content_box.top>.wrapper #form7 .box_title h5{width:100%;margin-top:25px;} .survey .content_box.top>.wrapper #form7 textarea{width:96%;border: 1px solid #b3b3b3; padding:2%;resize: none; height:84px; margin:15px 0 0;} .survey .content_box.top>.wrapper #form8 h5{width:auto;padding-right:0;margin:15px 0 0;text-align:left; padding-left:34px;} .survey .content_box.top>.wrapper #form8 .box_title h5{width:100%;margin-top:25px;} .survey .content_box.top>.wrapper #form8 .box h5{padding:0; margin-right:20px;} .survey .content_box.top>.wrapper #form9 h5{width:auto;padding-right:0;margin:15px 0 0;text-align:left; padding-left:34px;} .survey .content_box.top>.wrapper #form9 .box_title h5{width:100%;margin-top:25px;} .survey .content_box.top>.wrapper #form9 .box h5{padding:0; margin-right:20px;} .survey .content_box.top>.wrapper .form h5 .mark{font-size:15px; color:#b3b3b3;} .survey .content_box.top>.wrapper .form h5 .icheckbox_minimal, .survey .content_box.top>.wrapper .form h5 .iradio_minimal{ vertical-align:top; text-align:left;} .survey .content_box.top>.wrapper .form h5 label{margin:0 0 0 10px; text-align:left; display:inline-block; line-height:24px;} .survey .content_box.top>.wrapper .form h5.solarPath{background:url(../images/titleBg_survey_gameTitle_solarPath.png) center center no-repeat; color:#fff;} .survey .content_box.top>.wrapper .form h5.wind{background:url(../images/titleBg_survey_gameTitle_wind.png) center center no-repeat; color:#fff;} .survey .content_box.top>.wrapper .form h5.coolMaterials{background:url(../images/titleBg_survey_gameTitle_coolMaterials.png) center center no-repeat; color:#fff;} .survey .content_box.top>.wrapper .form h5.passiveDesign{background:url(../images/titleBg_survey_gameTitle_passiveDesign.png) center center no-repeat; color:#fff;} .survey .content_box.top>.wrapper .form h5.activeSystems{background:url(../images/titleBg_survey_gameTitle_activeSystems.png) center center no-repeat; color:#fff;} .survey .content_box.top>.wrapper .form h5.renewableEnergy{background:url(../images/titleBg_survey_gameTitle_renewableEnergy.png) center center no-repeat; color:#fff;} .survey .content_box.top>.wrapper .form label input[type="text"]{border:none; border-bottom:1px solid #f15a22; border-radius:0; padding:0 10px;font-size:18px;font-family:'ChelseaMarket',Arial,Helvetica,Microsoft JhengHei,Heiti TC,sans-serif;font-weight:normal;width:300px;} .survey .content_box.top .btn_next{width:153px;height:57px;padding-right:30px;margin:25px auto 0;display:block;background:url(../images/btn_survey_next.png) top center no-repeat;line-height:57px;cursor:pointer;} .survey .content_box.top .btn_next:hover{background-position:bottom center;} .survey .content_box.top .btn_submit{width:152px;height:57px;padding-right:30px;margin:25px auto 0;display:block;background:url(../images/btn_submit.png) top center no-repeat;line-height:57px;cursor:pointer;} .survey .content_box.top .btn_submit:hover{background-position:bottom center;} .survey .content_box.top .btn_backHome{width:285px;height:57px;padding-right:30px;margin:25px auto 0;display:block;background:url(../images/btn_backHome.png) top center no-repeat;line-height:57px;cursor:pointer;} .survey .content_box.top .btn_backHome:hover{background-position:bottom center;} .survey #popup_allSessions{padding:42px;display:none;} .survey #popup_allSessions h4{color:#f58426;text-align:center;} .survey #popup_atLeastOne{padding:42px;display:none;} .survey #popup_atLeastOne h4{color:#f58426;text-align:center;} .survey #popup_lastForm{padding:42px;display:none;} .survey #popup_lastForm h4{color:#f58426;text-align:center;} .survey #popup_allQuestion{padding:42px;display:none;} .survey #popup_allQuestion h4{color:#f58426;text-align:center;} .survey .content_box.top>.wrapper #thankYou{margin-top:72px;min-height:300px;} #survey4 .content_box.top>.wrapper #form1 h5:first-child{width:20%; padding:0;} #survey4 .content_box.top>.wrapper #form1 h5{margin-top:15px;} #survey4 .content_box.top>.wrapper #form1 .box_title h5{margin-top:25px;} #survey4 .content_box.top>.wrapper #form2 h5:first-child{width:20%; padding:0;} #survey4 .content_box.top>.wrapper #form2 h5{margin-top:15px;} #survey4 .content_box.top>.wrapper #form2 .box_title h5{margin-top:25px;} #survey4 .content_box.top>.wrapper #form3 h5:first-child{width:20%; padding:0;} #survey4 .content_box.top>.wrapper #form3 h5{margin-top:15px;} #survey4 .content_box.top>.wrapper #form3 .box_title h5{margin-top:25px;} #survey4 .content_box.top>.wrapper #form5 h4{background:url(../images/titleBg_survey4_partTitle6.png) center center no-repeat;} #survey4 .content_box.top>.wrapper #form5 .box_title h5{width:100%;} #survey4 .content_box.top>.wrapper #form5 h5{width:20%;} #survey4 .content_box.top>.wrapper #form5 h5 label{width:90px;} #survey4 .content_box.top>.wrapper #form6 h4{background:url(../images/titleBg_survey4_partTitle7.png) center center no-repeat;} #survey4 .content_box.top>.wrapper #form6 .box_title h5{width:100%;} #survey4 .content_box.top>.wrapper #form6 textarea{width:96%;border:1px solid #b3b3b3; padding:2%;resize: none; height:84px; margin:15px 0 0;} #survey4 .content_box.top>.wrapper #form7 h4{background:url(../images/titleBg_survey4_partTitle8.png) center center no-repeat;} #survey4 .content_box.top>.wrapper #form7 h5 {width:auto;} #survey4 .content_box.top>.wrapper #form7 .box_title h5{padding-left:34px;text-align:left;} #survey4 .content_box.top>.wrapper #form7 .box h5{margin-right:20px;} #survey4 .content_box.top>.wrapper #form8 h4{background:url(../images/titleBg_survey4_partTitle9.png) center center no-repeat;} #survey4 .content_box.top>.wrapper #form8 h5 {width:auto;} #survey4 .content_box.top>.wrapper #form8 .box_title h5{padding-left:34px;text-align:left;} #survey4 .content_box.top>.wrapper #form8 .box h5{margin-right:20px;}