/* Theme Name: Theme URI: http:// Description: Version: 1.0 Author: Keefe Au Author URL: http://aukeefe.carbonmade.com */ /* RESET */ html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; } h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; } ul,ol { list-style: none; } fieldset,img { border: none; } caption,th { text-align: left; } /* LAYOUT */ .clear { clear: both; display: block; height: 0; overflow: hidden; visibility: hidden; width: 0; } .clearfix { display: block; } .clearfix:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; } /* TYPE */ body { font: 90% 'Helvetica Neue', Helvetica, Arial, sans-serif; background-color: #eef2e3; color: #000; text-align:left; } input, textarea { font-family: Arial, Helvetica, sans-serif; font-size: 100%; } p { font: 90% 'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif; color: #313131; } a { text-decoration:none; color:#78a22e; } a:hover { text-decoration:underline; color:#78a22e; } a:visited {text-decoration:none; } a:hover img { border: solid 1px #78a22e; } /* wrapper */ #header-wrapper, #content-wrapper, #slide-wrapper, #section-wrapper, #footer-wrapper { width:950px; height:auto; position: relative; margin: 0 auto; } /* header */ #header { width:100%; height:32px; background-color:#2b2600; margin: 0 auto; position: relative; border-bottom: solid 4px #637b16; } #logo { width: 265px; height: 138px; position:relative; float:left; top:4px; background:url(../images/logo.png) no-repeat; } img.logo-home { width: 265px; height: 300px; position:relative; float:left; top:4px; z-index:1000; border: none !important; } .logo-lemongrass-page { width:155px; height:220px; position:absolute; } .logo-lemongrass-page a { background:url(../images/img_logo_lemon_grass.png) no-repeat; width: 155px; height: 220px; position: absolute; text-indent: -900em; left:3px; top:-176px; z-index:998; overflow:hidden; } .logo-lemongrass-page a:hover { background:url(../images/img_logo_lemon_grass_hover.png) no-repeat; } /* Main Navigation */ #navigation { width: 635px; height: 32px; position: relative; background:url(../images/nav.jpg) no-repeat; float:left; left:0; } #navigation #nav { margin: 0; padding: 0; } #navigation #nav li { display: inline; } #navigation #nav li a { background:url(../images/nav.jpg) no-repeat; float: left; overflow: hidden; text-indent: -900em; } /* ON STATES */ #navigation #nav li#nav-home a { background-position: 0 0; width:90px; height:32px; position:relative; } #navigation #nav li#nav-menu a { background-position: -90px 0; width:93px; height:32px; position:relative; } #navigation #nav li#nav-specials a { background-position: -183px 0; width:116px; height:32px; position:relative; } #navigation #nav li#nav-press a { background-position: -299px 0; width:92px; height:32px; position:relative; } #navigation #nav li#nav-location a { background-position: -391px 0; width:128px; height:32px; position:relative; } #navigation #nav li#nav-contact a { background-position: -519px 0; width:116px; height:32px; position:relative; } /* OVER STATES */ #navigation #nav li#nav-home a:hover { background-position: 0 -32px; width:90px; height:32px; position:relative; border-bottom: solid 4px #78a22e; } #navigation #nav li#nav-menu a:hover { background-position: -90px -32px; width:93px; height:32px; position:relative; border-bottom: solid 4px #78a22e; } #navigation #nav li#nav-specials a:hover { background-position: -183px -32px; width:116px; height:32px; position:relative; border-bottom: solid 4px #78a22e; } #navigation #nav li#nav-press a:hover { background-position: -299px -32px; width:92px; height:32px; position:relative; border-bottom: solid 4px #78a22e; } #navigation #nav li#nav-location a:hover { background-position: -391px -32px; width:128px; height:32px; position:relative; border-bottom: solid 4px #78a22e; } #navigation #nav li#nav-contact a:hover { background-position: -519px -32px; width:116px; height:32px; position:relative; border-bottom: solid 4px #78a22e; } /* DOWN STATES */ #navigation.home #nav li#nav-home a { background-position: 0 -32px; width:90px; height:32px; position:relative; cursor: default !important; border:none !important; } #navigation.menu #nav li#nav-menu a { background-position: -90px -32px; width:93px; height:32px; position:relative; cursor: default !important; border:none !important; } #navigation.specials #nav li#nav-specials a { background-position: -183px -32px; width:116px; height:32px; position:relative; cursor: default !important; border:none !important; } #navigation.press #nav li#nav-press a { background-position: -299px -32px; width:92px; height:32px; position:relative; cursor: default !important; border:none !important; } #navigation.location #nav li#nav-location a { background-position: -391px -32px; width:128px; height:32px; position:relative; cursor: default !important; border:none !important; } #navigation.contact #nav li#nav-contact a { background-position: -519px -32px; width:116px; height:32px; position:relative; cursor: default !important; border:none !important; } /* sub menu */ #sub-menu { width: 294px; height: 138px; position: relative; background:url(../images/lemongrass_submenu.jpg) no-repeat; margin-top:70px; } #sub-menu #nav { margin: 0; padding: 0; } #sub-menu #nav li { display: inline; } #sub-menu #nav li a { background:url(../images/lemongrass_submenu.jpg) no-repeat; float: left; overflow: hidden; text-indent: -900em; overflow:hidden; } /* ON STATES */ #sub-menu #nav li#nav-appetizers a { background-position: 0 0; width:140px; height:34px; position:relative; } #sub-menu #nav li#nav-vegetarian a { background-position: -140px 0; width:154px; height:34px; position:relative; } #sub-menu #nav li#nav-rice a { background-position: 0 -34px; width:194px; height:38px; position:relative; } #sub-menu #nav li#nav-soup a { background-position: -194px -34px; width:100px; height:38px; position:relative; } #sub-menu #nav li#nav-vermicelli a { background-position: 0 -72px; width:190px; height:26px; position:relative; } #sub-menu #nav li#nav-sandwiches a { background-position: -190px -72px; width:104px; height:26px; position:relative; } #sub-menu #nav li#nav-beverages a { background-position: 0 -98px; width:192px; height:40px; position:relative; } #sub-menu #nav li#nav-dessert a { background-position: -192px -98px; width:102px; height:40px; position:relative; } /* OVER STATES */ #sub-menu #nav li#nav-appetizers a:hover { background-position: 0 -138px; width:140px; height:34px; position:relative; } #sub-menu #nav li#nav-vegetarian a:hover { background-position: -140px -138px; width:154px; height:34px; position:relative; } #sub-menu #nav li#nav-rice a:hover { background-position: 0 -172px; width:194px; height:38px; position:relative; } #sub-menu #nav li#nav-soup a:hover { background-position: -194px -172px; width:100px; height:38px; position:relative; } #sub-menu #nav li#nav-vermicelli a:hover { background-position: 0 -210px; width:190px; height:26px; position:relative; } #sub-menu #nav li#nav-sandwiches a:hover { background-position: -190px -210px; width:104px; height:26px; position:relative; } #sub-menu #nav li#nav-beverages a:hover { background-position: 0 -236px; width:192px; height:40px; position:relative; } #sub-menu #nav li#nav-dessert a:hover { background-position: -192px -236px; width:102px; height:40px; position:relative; } /* slide */ #slide { width:100%; height:258px; background-color:#dde1cf; margin: 0 auto; position: relative; border-bottom: solid 1px #d2d8c1; overflow:hidden; } /* slideshow */ #slideshow-section { width:637px; height:258px; position:relative; float:right; top:0; right:0; } #slideshow { position:relative; border-left: 1px solid #d2d8c1; border-right: 1px solid #d2d8c1; } .pics { width:635px; height:258px; padding:0; margin:0; overflow: hidden; } .pics img { width:635px ; height:258px; } #slideshow img { } /* content */ #content { width:100%; height:auto; margin:0 auto; position: relative; } .dia-line {width:100%; background:url(../images/dia_lines.jpg) repeat-x; height:24px; position: relative; } .column-1 { width:294px; height:auto; padding-right:19px; border-right: 1px solid #dde5c4; float:left; position:relative; margin:-24px 0 0 0; overflow:visible; } .column-2 { width:348px; height:auto; margin:-24px 22px 0 22px; float:left; position:relative; overflow:visible; } .column-3 { width:220px; height:auto; padding-left:23px; border-left: 1px solid #dde5c4; float:right; position:relative; margin:-24px 0 0 0; overflow:visible; } .col-title { color:#78a22e; font: bold 85% 'Helvetica Neue', Helvetica, Arial, sans-serif; text-transform:uppercase; float:left; left:0; top:0; line-height:1.8em; letter-spacing:0.05em; } .col-2-divider { border-bottom:4px double #6a8417; width:348px; height:4px; position:relative; clear:both; margin-bottom:25px; } .sec-title { float:left; left:0; top:22px; position:relative; } .menu-title { float:left; left:0; margin:20px 0 10px 0; position:relative; } .col-1-text { width:290px; height:auto; position:relative; float:left; margin:35px 0 5px 0; } .col-3-text { width:220px; height:auto; position:relative; float:left; margin:30px 0 5px 0; padding-bottom:25px; border-bottom:1px dotted #6a8417; } .img { border: solid 1px #aeb696; margin: 30px 0 30px 0; } .himg { border: solid 1px #aeb696; margin: 50px 0 30px 0; } .pimg { border: solid 1px #aeb696; margin: 64px 0 30px 0; } .bimg { border: solid 1px #54512c; margin-top:10px; } .left { float:left; left:0; position:relative; } .sl { left:-2px; } .sa { left:-8px; } .ml { margin-right:8px; margin-top:9px;} .mp { margin-top:22px;} .sm { padding-bottom:50px; } .sp { position:relative; float:left; } a.img-best-pho { background:url(../images/title_best_pho.jpg) no-repeat; width:220px; height:58px; position:absolute; left:20px; top:42px; text-indent: -900em; overflow:hidden; } a:hover.img-best-pho { background:url(../images/title_best_pho_hover.jpg) no-repeat; } .press-img { width:164px; height:210px; position:relative; float:left; border: solid 1px #aeb696; margin: 30px 8px 0 0; left:0; } .press-img-hr { width:210px; height:164px; position:relative; float:left; border: solid 1px #aeb696; margin: 30px 60px 0 65px; } .photo { width:105px; height:70px; position:relative; float:left; border: solid 1px #aeb696; margin: 12px 13px 4px 0; } .photo-last { width:105px; height:70px; position:relative; float:right; border: solid 1px #aeb696; margin: 12px 0 4px 0; } /* section */ #section { width: 100%; height:auto; background-color:#2b2600; margin:20px 0 0 0; position: relative; border-top: solid 5px #6a8417; } .section-1 { width:460px; height:auto; padding-right:10px; border-right: 1px solid #403d1e; float:left; position:relative; margin:24px 0 48px 0; overflow:visible; } .section-2 { width:210px; height:222px; margin:24px 10px 0 10px; float:left; position:relative; overflow:visible; background:url(../images/img_orchid.jpg) right 70px no-repeat; } .section-3 { width:226px; height:174px; padding-left:10px; border-left: 1px solid #403d1e; float:right; position:relative; margin:24px 0 0 0; overflow:visible; } .section-title { color:#7c7b58; font: bold 80% 'Helvetica Neue', Helvetica, Arial, sans-serif; text-transform:lowercase; float:left; left:0; top:-8px; line-height:1.8em; letter-spacing:0.05em; position:relative; } .sec-text { color:#54512c; font: 80% 'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif; line-height:1.35em; } a.img-get-map { background:url(../images/title_get_map.jpg) no-repeat; width:170px; height:44px; position:absolute; left:0; top:130px; text-indent: -900em; overflow:hidden; } a:hover.img-get-map { background:url(../images/title_get_map_hover.jpg) no-repeat; } .phone { position:relative; float:right; right:3px; } .sm-logo { position:absolute; float:right; right:-8px; bottom:-60px; } /* menu page */ .menupage { background-color:#eef2e3 !important; border: none !important; } .col-left { width:294px; height:auto; padding-right:19px; float:left; position:relative; margin:0 0 30px 0; overflow:visible; } .col-right { width:568px; height:auto; margin:0 22px 20px 22px; float:right; position:relative; overflow:visible; } .col-m-divider { border-bottom:4px double #6a8417; width:568px; height:4px; position:relative; clear:both; margin-bottom:25px; } .col-2 { width:348px; height:auto; margin:24px 0 25px 22px; float:left; position:relative; overflow:visible; } .col-3 { width:220px; height:auto; padding-left:23px; border-left: 1px solid #dde5c4; float:right; position:relative; margin:24px 0 25px 0; overflow:visible; } h2 { color:#313131; font:bold 90% 'Helvetica Neue', Helvetica, Arial, sans-serif; line-height:1.5em; } h4 { font: italic 80% 'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif; color:#6a8417; } .viet { color:#aeb696; font size:80%; margin-left:10px; } .price { color:#6a8417; font size:75%; margin-left:15px; font:'Palatino Linotype', Palatino, 'Book Antiqua', Georgia, serif; letter-spacing:0.05em; } .des { color:#6a8417; } a:hover img.menu-title { border: none !important; } .dia-line-menu {width:100%; background:url(../images/dia_lines.jpg) repeat-x; height:24px; position: relative; margin-top:120px; } a.mg { background:url(../images/title_lemongrass_menu.jpg) no-repeat; width:294px; height:32px; position:absolute; left:0; top:280px; margin:25px 0 25px 0; text-indent: -900em; overflow:hidden; } a:hover.mg { background:url(../images/title_lemongrass_menu_hover.jpg) no-repeat; border: none !important; } /* social */ #social { float:left; position: relative; margin: 0; padding: 0; } #social li { display: block; margin-top:10px; } #social li#twitter a { background:url(../images/social_twitter.jpg) no-repeat; width:120px; height:26px; position: relative; float: left; text-indent: -900em; } #social li#twitter a:hover { background-position: -120px 0; width:120px; height:26px; position: relative; } #social li#facebook a { background:url(../images/social_facebook.jpg) no-repeat; width:90px; height:22px; position: relative; float: left; left:1px; margin:5px 0 5px 0; text-indent: -900em; } #social li#facebook a:hover { background-position: -90px 0; width:90px; height:22px; position: relative; } #social li#flickr a { background:url(../images/social_flickr.jpg) no-repeat; width:100px; height:36px; position: relative; float: left; left:-2px; text-indent: -900em; } #social li#flickr a:hover { background-position: -100px 0; width:100px; height:36px; position: relative; } /* footer */ #footer { width: 100%; height:25px; background-color:#54512c; margin:0; position: relative; } .fl { position: relative; float:left; left:0; } .fr { position: relative; float:right; right:0; } .fl, .fr { top:6px; font-size: 75%; color:#7c7b58; }