2011-07-15 17:25:00 +00:00
html
{ width : 100 % ; }
2011-06-25 11:23:32 +00:00
body
2011-07-15 17:25:00 +00:00
{ width : 100 % ;
height : 100 % ;
font-family : 'Century Gothic' , Helvetica , Arial , 'DejaVu Sans' , sans-serif ; } /*they want helvetica as second font, font-squirrel font to be added if required*/
2011-06-25 11:23:32 +00:00
# header
{ width : 960 px ;
height : 140px ;
margin-left : auto ;
margin-right : auto ;
position : relative ; }
# logo
2011-07-15 17:25:00 +00:00
{ font-family : 'Century Gothic' , Helvetica , Arial , 'DejaVu Sans' , sans-serif ;
font-size : 30px ;
position : absolute ;
top : 36px ;
left : 4px ;
z-index : -1 ;
color : # 8a8a8a ; }
# logo span
{ font-size : 36 px ; }
# logo span span
{ font-weight : bold ;
color : # f7bd00 ; }
2011-06-25 11:23:32 +00:00
2011-10-13 11:05:32 +00:00
. orange
{ color : #f7bd00 ;
font-weight : bold ;
margin-bottom : 8px ;
}
2011-06-25 11:23:32 +00:00
# search
{ width : 114 px ;
position : absolute ;
2011-07-15 17:25:00 +00:00
right : 4px ;
2011-06-25 11:23:32 +00:00
top : 11px ;
2011-07-15 17:25:00 +00:00
border : 1px solid # f0f0f0 ;
2011-07-15 16:45:21 +00:00
background : url ( / static / images / noel / search-icon . png ) no-repeat right ;
2011-07-15 17:25:00 +00:00
padding : 2px 2px 2px 4px ;
2011-06-25 11:23:32 +00:00
font-family : Arial , Helvetica , 'DejaVu Sans' , sans-serif ;
font-size : 12px ;
2011-07-15 17:25:00 +00:00
color : # 7d7d7d ;
-moz-border-radius : 8px ;
2011-06-25 11:23:32 +00:00
-webkit-border-radius : 8px ;
border-radius : 8px ;
-moz-box-shadow : inset 2px 2px 6px # d7d7d7 ;
-webkit-box-shadow : inset 2px 2px 6px # d7d7d7 ;
2011-07-15 17:25:00 +00:00
box-shadow : inset 2px 2px 6px # d7d7d7 ; } /*placeholder input text supported by html5 for FF3.7 and webkit, add a shiv? also*/
# search : focus
{ outline : none ; } /*to remove outline in webkit-browsers*/
2011-06-25 11:23:32 +00:00
# homeIcon
2011-10-08 06:06:16 +00:00
{ / * display : block ;
2011-06-25 11:23:32 +00:00
position : absolute ;
2011-07-15 17:25:00 +00:00
left : 413px ;
2011-10-08 06:06:16 +00:00
top : 69px ; * /
2011-06-25 11:23:32 +00:00
cursor : pointer ; }
# navMenu
{ background-color : #FFF ;
2011-07-15 17:25:00 +00:00
font-size : 16px ;
2011-06-25 11:23:32 +00:00
position : absolute ;
top : 64px ;
right : 0px ;
2011-10-08 06:06:16 +00:00
z-index : 50 ;
2011-07-15 17:25:00 +00:00
cursor : pointer ;
text-align : left ; }
2011-06-25 11:23:32 +00:00
# navMenu , # navMenu ul
{ list-style : none ;
line-height : 30px ;
padding : 0 ;
margin : 0 ;
float : left ; }
# navMenu a
{ display : block ;
color : # 737373 ;
text-decoration : none ;
padding : 0px 15px ; }
2011-07-15 17:25:00 +00:00
# navMenu > li /*browser compatibility????*/
2011-06-25 11:23:32 +00:00
{ padding : 0 ;
2011-07-15 17:25:00 +00:00
float : left ;
-moz-border-radius : 10px ;
-webkit-border-radius : 10px ;
border-radius : 10px ;
}
2011-06-25 11:23:32 +00:00
# navMenu ul
2011-07-15 17:25:00 +00:00
{ width : 180 px ;
font-size : 14px ;
2011-06-25 11:23:32 +00:00
line-height : 24px ;
margin : 0 ;
position : absolute ;
left : -999em ;
2011-07-15 17:25:00 +00:00
height : auto ;
text-align : left ; }
2011-06-25 11:23:32 +00:00
# navMenu li li
2011-07-15 17:25:00 +00:00
{ width : 180 px ;
2011-06-25 11:23:32 +00:00
border-bottom : 1px solid # e0e0e0 ;
2011-10-08 06:06:16 +00:00
text-align : left ;
box-shadow : 1px 1px 6px # 919191 ; }
2011-06-25 11:23:32 +00:00
2011-10-15 11:20:46 +00:00
# navMenu li : first-child : hover
{ background : none ; }
2011-06-25 11:23:32 +00:00
# navMenu li li a
2011-07-15 17:25:00 +00:00
{ padding : 2 px 10 px ;
2011-06-25 11:23:32 +00:00
color : # 737373 ; } /*menu may break in IE, add JS hack and one for navigation by keyboard*/
# navMenu li li : hover
{ background-color : #e77400 ;
2011-07-15 17:25:00 +00:00
background : -moz-linear-gradient ( top , rgba ( 231 , 116 , 0 , 0 . 7 ) 0 % , rgba ( 254 , 178 , 0 , 0 . 9 ) ) ;
background : -webkit-gradient ( linear , left top , left bottom , from ( rgba ( 231 , 116 , 0 , 0 . 7 ) ) , to ( rgba ( 254 , 178 , 0 , 0 . 9 ) ) ) ;
background : linear-gradient ( top , rgba ( 231 , 116 , 0 , 0 . 7 ) 0 % , rgba ( 254 , 178 , 0 , 0 . 9 ) ) ; }
2011-06-25 11:23:32 +00:00
# navMenu li ul li : hover a , # navMenu li ul li li : hover a , # navMenu li ul li li li : hover a , # navMenu li ul li li li : hover a
{ color : #ebe9e9 ; }
# navMenu li : hover a , # navMenu li . sfhover a
{ color : #ebe9e9 ; }
# navMenu li : hover li a , # navMenu li li : hover li a , # navMenu li li li : hover li a , # navMenu li li li li : hover li a
{ color : #737373 ; }
# navMenu li : hover ul ul , # navMenu li : hover ul ul ul , # navMenu li : hover ul ul ul ul , # navMenu li . sfhover ul ul , # navMenu li . sfhover ul ul ul , # navMenu li . sfhover ul ul ul ul
{ left : -999 em ; }
# navMenu li : hover ul , # navMenu li li : hover ul , # navMenu li li li : hover ul , # navMenu li li li li : hover ul , # navMenu li . sfhover ul , # navMenu li li . sfhover ul , # navMenu li li li . sfhover ul , # navMenu li li li li . sfhover ul
{ left : auto ;
2011-07-15 17:25:00 +00:00
background-color : # FFF ;
}
2011-06-25 11:23:32 +00:00
# navMenu li : hover , # navMenu li . sfhover
{ background-color : #e77400 ;
background : -moz-linear-gradient ( top , # e77400 0 % , # feb200 ) ;
background : -webkit-gradient ( linear , left top , left bottom , from ( # e77400 ) , to ( # feb200 ) ) ;
2011-07-15 17:25:00 +00:00
background : linear-gradient ( top , # e77400 0 % , # feb200 ) ; }
2011-06-25 11:23:32 +00:00
# loginMenu
{ list-style : none ;
background-color : # FFF ;
2011-07-15 17:25:00 +00:00
font-size : 13px ; /*font list ok?, will break if user increases font size???*/
2011-06-25 11:23:32 +00:00
color : # ff8400 ;
font-weight : normal ;
position : absolute ;
bottom : 5px ;
2011-07-15 17:25:00 +00:00
right : 6px ;
2011-06-25 11:23:32 +00:00
cursor : pointer ;
z-index : 2 ;
clear : both ; }
# loginMenu li
{ display : inline ;
background-color : # FFF ;
2011-07-15 17:25:00 +00:00
padding : 2px 4px ;
2011-06-25 11:23:32 +00:00
border : 1px solid # e7e7e7 ;
-moz-border-radius-topright : 8px ;
-webkit-border-top-right-radius : 8px ;
border-top-right-radius : 8px ;
-moz-border-radius-topleft : 8px ;
-webkit-border-top-left-radius : 8px ;
border-top-left-radius : 8px ;
-moz-box-shadow : 0px -1px 3px # d4d4d4 ;
-webkit-box-shadow : 0px -1px 3px # d4d4d4 ;
box-shadow : 0px -1px 3px # d4d4d4 ; } /*not converted to links*/
2011-08-09 19:18:26 +00:00
# loginMenu li a , # loginMenu li a : link , # loginMenu li a : visited , # loginMenu li a : active
2011-07-15 17:25:00 +00:00
{ text-decoration : none ;
color : # ff8400 ; }
2011-08-09 19:18:26 +00:00
# loginMenu li : hover
{ color : #FFF ;
background-color : # ff8400 ; }
2011-08-09 20:55:46 +00:00
# loginMenu li : hover a
2011-08-09 19:18:26 +00:00
{ color : #FFF ; }
2011-06-25 11:23:32 +00:00
2011-10-15 11:20:46 +00:00
/ * # woodPng
2011-10-13 19:35:45 +00:00
{ width : 30 % ;
2011-07-15 17:25:00 +00:00
height : 30 % ;
position : absolute ;
left : 0 ;
right : 0 ;
margin : 0 auto ;
top : 400px ;
background-color : # 989898 ;
opacity : 0 . 4 ; /*plz add JS to detect if browser does not support opacity*/
2011-10-15 11:20:46 +00:00
/ * -moz-border-radius : 60px ;
2011-07-15 17:25:00 +00:00
-webkit-border-radius : 60px ;
border-radius : 60px ;
-moz-box-shadow : 0px 0px 100px 100px # 989898 ;
-webkit-box-shadow : 0px 0px 100px 100px # 989898 ;
box-shadow : 0px 0px 100px 100px # 989898 ; } /*please add moderniser for IE to detect and remove this opacity and shadow;*/
2011-06-25 11:23:32 +00:00
# shadow
{ width : 960 px ;
height : 8px ;
-moz-box-shadow : 10px -20px 40px # cccaca ;
-webkit-box-shadow : 10px -20px 40px # cccaca ;
box-shadow : 10px -20px 40px # cccaca ; } /*shadow looks darker in safari and of course, doesn't show in IE*/
# footer
{ width : 960 px ;
margin-left : auto ;
margin-right : auto ;
padding-bottom : 8px ; }
. footerList
{ list-style : none ;
font-family : Arial , 'Century Gothic' , 'DejaVu Sans' , sans-serif ; /*should test the arial font to see how it looks*/
font-size : 13px ;
color : # 7b7b7b ;
line-height : 16px ;
padding : 14px 24px 46px 24px ;
float : left ; }
. footerList li
{ display : block ; }
. footerList a : link , . footerList a : visited
{ text-decoration : none ;
color : # 7b7b7b ; }
. footerList a : hover
{ text-decoration : none ;
color : # 515050 ; }
. footerList a : active
{ text-decoration : none ; }
# copyright
{ font-family : Arial , Helvetica , 'DejaVu Sans' , sans-serif ;
font-size : 12px ;
color : # ffb400 ;
text-align : left ;
padding-left : 22px ;
2011-07-15 16:45:21 +00:00
clear : both ; }
2011-07-15 17:25:00 +00:00
2011-10-15 17:24:41 +00:00
. clear
{ clear : both ; }