287 lines
7.6 KiB
CSS
Executable File
287 lines
7.6 KiB
CSS
Executable File
html
|
|
{width:100%;}
|
|
|
|
body
|
|
{width:100%;
|
|
height:100%;
|
|
color:#777;
|
|
font-family:'Century Gothic', Helvetica, Arial, 'DejaVu Sans', sans-serif;}/*they want helvetica as second font, font-squirrel font to be added if required*/
|
|
|
|
#header
|
|
{width:960px;
|
|
height:140px;
|
|
margin-left:auto;
|
|
margin-right:auto;
|
|
position:relative;}
|
|
|
|
#logo
|
|
{/*font-family:'Century Gothic', Helvetica, Arial, 'DejaVu Sans', sans-serif;
|
|
color:#8a8a8a;
|
|
font-size:30px;*/
|
|
position:absolute;
|
|
top:36px;
|
|
left:4px;
|
|
z-index:-1;
|
|
}
|
|
|
|
#logo span
|
|
{font-size:36px;}
|
|
|
|
#logo span span
|
|
{font-weight:bold;
|
|
color:#f7bd00;}
|
|
|
|
.orange
|
|
{color:#f7bd00;
|
|
font-weight:bold;
|
|
margin-bottom:8px;
|
|
}
|
|
|
|
#search
|
|
{width:114px;
|
|
position:absolute;
|
|
right:4px;
|
|
top:11px;
|
|
border:1px solid #f0f0f0;
|
|
background:url(/static/images/noel/search-icon.png) no-repeat right;
|
|
padding:2px 2px 2px 4px;
|
|
font-family:Arial, Helvetica, 'DejaVu Sans', sans-serif;
|
|
font-size:12px;
|
|
color:#7d7d7d;
|
|
-moz-border-radius:8px;
|
|
-webkit-border-radius:8px;
|
|
border-radius:8px;
|
|
-moz-box-shadow:inset 2px 2px 6px #d7d7d7;
|
|
-webkit-box-shadow:inset 2px 2px 6px #d7d7d7;
|
|
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*/
|
|
|
|
#homeIcon
|
|
{/*display:block;
|
|
position:absolute;
|
|
left:413px;
|
|
top:69px;*/
|
|
cursor:pointer;
|
|
margin-bottom:-1px;
|
|
}
|
|
|
|
#homeList:hover
|
|
{
|
|
background:#FFF !important;}
|
|
|
|
#navMenu
|
|
{background-color:#FFF;
|
|
font-size:16px;
|
|
position:absolute;
|
|
top:64px;
|
|
right:0px;
|
|
z-index:50;
|
|
cursor:pointer;
|
|
text-align:left;}
|
|
|
|
#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;
|
|
}
|
|
|
|
#navMenu>li /*browser compatibility????*/
|
|
{padding:0;
|
|
float:left;
|
|
/*-moz-border-radius:10px;
|
|
-webkit-border-radius:10px;
|
|
border-radius:10px;*/}
|
|
|
|
#navMenu ul
|
|
{/*width:180px;*/
|
|
font-size:14px;
|
|
line-height:24px;
|
|
margin:0;
|
|
position:absolute;
|
|
left:-999em;
|
|
height:auto;
|
|
text-align:left;
|
|
}
|
|
|
|
#navMenu li li
|
|
{width:180px;
|
|
border-bottom:1px solid #e0e0e0;
|
|
text-align:left;
|
|
-moz-box-shadow:1px 1px 3px #e1e1e1;
|
|
-webkit-box-shadow:1px 1px 3px #e1e1e1;
|
|
box-shadow:1px 1px 3px #e1e1e1;
|
|
}
|
|
|
|
/*#navMenu li a img:only-of-type:hover
|
|
{background-image:none !important;
|
|
cursor:drag;}*/
|
|
|
|
#navMenu li li a
|
|
{padding:2px 10px;
|
|
color:#737373;
|
|
} /*menu may break in IE, add JS hack and one for navigation by keyboard*/
|
|
|
|
#navMenu li li:hover
|
|
{background: rgb(254,178,0); /* Old browsers */
|
|
background: -moz-linear-gradient(top, rgba(254,178,0,1) 0%, rgba(231,116,0,1) 100%); /* FF3.6+ */
|
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,178,0,1)), color-stop(100%,rgba(231,116,0,1))); /* Chrome,Safari4+ */
|
|
background: -webkit-linear-gradient(top, rgba(254,178,0,1) 0%,rgba(231,116,0,1) 100%); /* Chrome10+,Safari5.1+ */
|
|
background: -o-linear-gradient(top, rgba(254,178,0,1) 0%,rgba(231,116,0,1) 100%); /* Opera 11.10+ */
|
|
background: -ms-linear-gradient(top, rgba(254,178,0,1) 0%,rgba(231,116,0,1) 100%); /* IE10+ */
|
|
background: linear-gradient(top, rgba(254,178,0,1) 0%,rgba(231,116,0,1) 100%); /* W3C */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feb200', endColorstr='#e77400',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
#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:#FFF;
|
|
}
|
|
|
|
#navMenu li:hover a, #navMenu li.sfhover a
|
|
{color:#FFF;
|
|
}
|
|
|
|
#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:-999em;
|
|
}
|
|
|
|
#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;
|
|
background-color:#FFF;
|
|
border:none;}
|
|
|
|
#navMenu li:hover, #navMenu li.sfhover
|
|
{background: rgb(254,178,0); /* Old browsers */
|
|
background: -moz-linear-gradient(top, rgba(254,178,0,1) 0%, rgba(231,116,0,1) 100%); /* FF3.6+ */
|
|
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(254,178,0,1)), color-stop(100%,rgba(231,116,0,1))); /* Chrome,Safari4+ */
|
|
background: -webkit-linear-gradient(top, rgba(254,178,0,1) 0%,rgba(231,116,0,1) 100%); /* Chrome10+,Safari5.1+ */
|
|
background: -o-linear-gradient(top, rgba(254,178,0,1) 0%,rgba(231,116,0,1) 100%); /* Opera 11.10+ */
|
|
background: -ms-linear-gradient(top, rgba(254,178,0,1) 0%,rgba(231,116,0,1) 100%); /* IE10+ */
|
|
background: linear-gradient(top, rgba(254,178,0,1) 0%,rgba(231,116,0,1) 100%); /* W3C */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feb200', endColorstr='#e77400',GradientType=0 ); /* IE6-9 */
|
|
color:#FFF;}
|
|
|
|
#loginMenu
|
|
{list-style:none;
|
|
/*background-color:#FFF;*/
|
|
font-size:13px; /*font list ok?, will break if user increases font size???*/
|
|
color:#ff8400;
|
|
font-weight:normal;
|
|
position:absolute;
|
|
bottom:0px;
|
|
right:8px;
|
|
cursor:pointer;
|
|
z-index:2;
|
|
clear:both;}
|
|
|
|
#loginMenu li
|
|
{display:inline;
|
|
float:left;
|
|
background-color:#FFF;
|
|
padding:6px 6px;
|
|
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*/
|
|
|
|
#loginMenu li a, #loginMenu li a:link, #loginMenu li a:visited, #loginMenu li a:active
|
|
{text-decoration:none;
|
|
color:#ff8400;}
|
|
|
|
#loginMenu li:hover
|
|
{color:#FFF;
|
|
background-color:#f7bd00;
|
|
border:1px solid transparent;}
|
|
|
|
#loginMenu li:hover a
|
|
{color:#FFF;}
|
|
|
|
.loginMenuSelected
|
|
{color:#FFF;
|
|
background-color:#ff8400;
|
|
border:1px solid transparent;}
|
|
|
|
/*#woodPng
|
|
{width:30%;
|
|
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*/
|
|
/*-moz-border-radius:60px;
|
|
-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;*/
|
|
|
|
#shadow
|
|
{/*width:960px;*/
|
|
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:960px;
|
|
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;
|
|
clear:both;}
|
|
|
|
.clear
|
|
{clear:both;}
|