.ivimQuote{
position: absolute;
top: 15;
left: 30;
visibility: hidden;
font-style: italic;
font-weight: bold;
font-size: 11pt;
color: #990000;
display: block;
width: 500;
margin: 0px 0px 0px 0px;
text-align: center;
}
.contentheading,.componentheading {
font-family : Georgia, Arial, Verdana, Helvetica, sans-serif;
width : 100%;
font-size : 17px;
font-weight : bold;
line-height : 16px;
text-transform : uppercase;
text-align : left;
text-indent : 0;
color : #999999;
padding-bottom : 5px;
margin : 3px 0;
border-bottom : 1px solid #999999;
}
/* NRC-IIT Employee Profile Site template style sheet
Sylvie Tremblay
NRC-IIT Communications
May 2004
INTRODUCTION:
This document is a template (fully working) cascading stylesheet for
Web pages that conform to the Treasury Board and National Research Council
Common Look and Feel (CLF) for the Internet policy. It provides a set of
styles and classes which, along with the (X)HTML templates, will help any
NRC Web developer looking to create a CLF-compliant page. The stylesheet
is commented to make it as understandable as possible.
BREAKDOWN:
1. and styles
2. Link styles
2.1 General (unspecified) link styles
2.2 Breadcrumbs
2.3 Side navigation
2.4 Top navigation
3. Styles for other common HTML elements (tables, lists, headers)
4. Special classes
4.1 Classes to apply convenient names to colours and sizes
4.2 Rounded feature boxes
4.3 I/B/P identifier text
5. XHTML-specific styles for proper image display
INSTRUCTIONS:
(1) Any style specified in this stylesheet which sets a font size does it in
points (e.g. 8pt). Each of these styles is repeated in the percent.css
stylesheet with the font size given in percentages (e.g. 85%). This means
that whenever you add/change/delete a style that affects font sizes you must
do it in both stylesheets. If you only do it in this one, your font sizes
will be fixed and your page will be less accessible! For an explanation of
why the styles are split among two stylesheets, see
http://zone.nrc-cnrc.gc.ca/clf-nsi/infocentre/ic_docs_stylesheet_e.shtml
*/
/* 1. body and p - most text will fit into one of these two styles */
body {
font-size: 10pt; /* This will be overridden in percent.css */
background: #FFFFFF;
color: #000000;
font-family: arial, helvetica, sans-serif;
margin: 0px 10px 0px 10px;
}
/* Inheritance doesn't work in NS4 so re-specify for paragraphs */
p { font-size: 10pt; font-family: arial, helvetica, sans-serif; }
/* 2. Link styles */
/* 2.1 General-purpose link styles */
/* Links without any classes on them will be blue, or grey if visited,
and purple if active or under the mouse cursor */
a:link { color: #666699; }
a:visited { color: #999999; }
a:hover { color: #666699; }
a:active { color: #666699; }
/* 'noline' class can be applied to a link to
prevent it from being underlined */
a.noline { text-decoration: none; }
/* 'nofade' class can be applied to a link to
prevent it from turning grey when visited */
a.nofade:visited { color: #666699; }
a.nofade { color: #666699; }
a.nofade:active { color: #666699; }
a.nofade:hover { color: #666699; }
/* 2.2 Breadcrumb link styles */
.breadcrumb { font-size: 8pt; font-family: arial, helvetica, sans-serif; font-weight: bold; }
.breadcrumb a:link { color: #666699; }
.breadcrumb a:visited { color: #999999; }
.breadcrumb a:hover { color: #999999; text-decoration: none; }
.breadcrumb a:active { color: #999999; }
/* 2.3 Side-navigation button link styles */
/* 'sidenav' class is for toolbox-style left-side navigation buttons */
a.sidenav {
font-family: Arial, Helvetica, sans-serif;
font-size: 9pt;
font-weight: bold;
line-height: 100%;
color: #000000;
text-decoration: none;
text-align: right;
display: block; /* Make clickable area fill the button */
width: 100%;
padding: 0;
margin: 0;
}
/* Specify that sidenav shouldn't fade to grey when visited */
a.sidenav:visited { color: #000000; }
a.sidenav { color: #000000; }
a.sidenav:active { color: #000000; }
a.sidenav:hover { color: #999999; }
/* 2.4 Top-navigation link styles */
/* menuBlack and menuColoured are classes applied to the
tags that contain the top-nav links
The tags that inherit from them are also styled to look as good as possible in all browsers
The menuColouredDoubleWidth class is for horizontally-joined buttons */
.menuBlack {
font-family : Arial, Helvetica, sans-serif;
font-weight : bold;
font-size : 9pt;
color : #999999;
background-color : #000000;
padding: 0px 2px 0px 3px;
width : 20%;
}
.menuBlack a {
padding: 1px;
margin: 0px;
color: #ffffff;
background-color: #000000;
text-decoration: none;
display: block;
width: 95%;
}
.menuBlack a:visited { color: #ffffff; }
.menuBlack a:active { color: #ffffff; }
.menuBlack a:hover { color: #ffffff; }
/* Institutional Menu Bar 1rst Level navigation link styles - aka dark purple bar*/
.menuColoured {
font-family : Arial, Helvetica, sans-serif;
font-weight : bold;
font-size : 9pt;
color : #FFFFFF;
background-color : #666699;
padding: 0px 2px 0px 3px;
width : 20%;
}
.menuColoured a {
color: #FFFFFF; /* Foreground colour of inst menu bar links */
background-color: #666699; /* Background colour of inst menu bar links */
text-decoration: none;
padding: 1px;
margin: 0;
display: block;
width: 95%;
}
.menuColoured a:visited { color: #FFFFFF; }
.menuColoured a:active { color: #FFFFFF; }
.menuColoured a:hover { color: #FFFFFF; }
/* Institutional Menu Bar 2nd Level navigation link styles - aka light purple bar*/
.menuColoured2nd {
font-family : Arial, Helvetica, sans-serif;
font-weight : bold;
font-size : 9pt;
color : #FFFFFF;
background-color : #9999CC;
padding: 0px 2px 0px 3px;
width : 20%;
}
.menuColoured2nd a {
color: #FFFFFF; /* Foreground colour of inst menu bar links */
background-color: #9999CC; /* Background colour of inst menu bar links */
text-decoration: none;
padding: 1px;
margin: 0;
display: block;
width: 95%;
}
.menuColoured2nd a:visited { color: #FFFFFF; }
.menuColoured2nd a:active { color: #FFFFFF; }
.menuColoured2nd a:hover { color: #FFFFFF; }
/* 3 Other page elements */
/* Make things in tables arial in NS4 */
td { font-family: arial, helvetica, sans-serif; }
/* No borders on images by default */
img { border-style: none; }
/* Lists have square bullets by default */
/*ul {
list-style: square;
font-family: arial, helvetica, sans-serif;
margin-top: 0%;
margin-bottom: 0%;
}
*/
/* Have to style this to make it work properly in NS4 */
/*li {
font-size: 10pt;
font-family: arial, helvetica, sans-serif;
}
*/
/* 4 Other classes */
/* 4.1 Convenience classes */
/* Classes to size text for convenience */
.small { font-size: 9pt }
.smaller { font-size: 8pt }
/* 4.2 Rounded feature boxes */
.features {
font-family: Arial, Helvetica, sans-serif;
font-size: 9pt;
line-height: normal;
}
a.features {
font-family: Arial, Helvetica, sans-serif;
font-size: 8pt;
line-height: normal;
}
.featuresTitle {
font-family: Arial, Helvetica, sans-serif;
font-size: 9pt;
line-height: 14px;
color: #003366;
font-weight: bold;
}
.caption {
font-family: Arial, Helvetica, sans-serif;
font-size: 8pt;
line-height: 100%;
color: #990000;
}
.greybgrnd {
font-family: Arial, Helvetica, sans-serif;
background-color: #CCCCCC;
}
.featuresBackground {
background-image: url(/zone/clf-nsi/images/features/headerBackground.gif);
}
/* 5 XHTML-specific styles */
.imgcell img, .imgcell a {
display: block;
margin: 0;
border: 0;
padding: 0;
}
.tight img, .tight a {
margin: 0;
border: 0;
padding: 0;
}
a:active {text-decoration: underline }
A:visited {text-decoration: none;}
A:link {text-decoration: none;}
A:hover {text-decoration: underline;}
/*
a:active { font-weight: bold; text-decoration: underline }
A:visited { font-weight: bold; color:#993300; text-decoration: none;}
A:link { font-weight: bold; color:#12522E; text-decoration: none;}
A:hover { color:#12522E; text-decoration: underline;background-color:#cccccc;}
A:border { border: 1px solid black; }
P {font-family: Verdana, Arial, Helvetica; font-size: 8pt;};
UL {font-family: Verdana, Arial, Helvetica; font-size: 8pt;};
OL {font-family: Verdana, Arial, Helvetica; font-size: 8pt;};
TD {font-family: Verdana, Arial, Helvetica; font-size: 8pt;};
DIV {font-family: Verdana, Arial, Helvetica; font-size: 8pt;};
PRE {font-family: Times New Roman Cyr, Times New Roman; font-size: 9pt;};
BODY {font-family: Verdana, Arial, Helvetica; font-size: 8pt;};
INPUT {font-family: Verdana, Arial, Helvetica; font-size: 8pt;};
TEXTAREA {font-family: Verdana, Arial, Helvetica; font-size: 8pt;};
*/
td.top_left{
margin : 0;
padding: 0;
background : url(images/top_left_red.jpg) no-repeat top left;
width : 171px;
height : 102px;
}
td.top_nav_repeat{
margin : 0;
padding: 0;
background : url(images/top_repeat_red.jpg) repeat-x top left;
height : 102px;
}
td.top_nav_right{
margin : 0;
padding: 0;
background : url(images/top_right_red.jpg) no-repeat top left;
width : 13px;
height : 102px;
}
a.top_nav_repeat{
font-weight: bold;
color: #FFCC33;
text-decoration: none;
/*display: block; Make clickable area fill the button */
width: 100%;
padding: 0;
margin: 0;
}
a.top_nav_repeat:hover { text-decoration: underline;}
/**
author: rgb(raduga) http://mambasana.ru
**/
/**#################### DEFAULT and FORMS CSS ####################**/
/**#################### DEFAULT and FORMS CSS ####################**/
body,html {
padding : 0;
margin : 0;
margin-bottom : 10px;
}
td, tr, p, div {
font-family : Verdana, Arial, Tahoma, Helvetica, sans-serif;
font-size : 12px;
color : #000000;
line-height : 15px;
}
hr {
color : #999999;
height : 1px;
width : 100%;
}
ul {
margin : 2px;
padding-left : 10px;
list-style : none;
}
li {
line-height : 14px;
padding-left : 10px;
padding-top : 0;
background-image : url(images/strelka.gif) ;
background-repeat: no-repeat;
background-position: 0 5px;
}
/* DMitry modified **/
ul {
margin : 1px;
padding-left : 3px;
list-style : none;
}
li {
padding-left : 6px;
background-image : url(images/strelka.gif) ;
background-repeat: no-repeat;
background-position: 0 5px;
}
/* DMitry modified **/
a:link, a:visited {
font-size : 11px;
color : #999999;
text-decoration : none;
font-weight : bold;
}
a:hover {
font-size : 11px;
color : #b40202;
text-decoration : none;
font-weight : bold;
}
form {
margin : 0;
padding : 0;
}
.inputbox {
color : #000000;
background : #ffffff;
border : 1px solid #cccccc;
margin : 3px 0;
}
/**#################### Joomla CSS ####################**/
/** Buttons **/
.back_button {
color : #999999;
font-family : Tahoma, Arial, Verdana, Helvetica, sans-serif;
font-size : 11px;
font-weight : normal;
padding-bottom : 3px;
margin-right : 4px;
float : right;
line-height : 20px;
text-decoration : underline;
}
.button {
font-size : 11px;
color : #333333;
border : 1px solid #cccccc;
margin : 3px 0;
background-color : #f0f0f0;
padding : 2px !important;
padding : 1px;
cursor : pointer;
}
/** Contact **/
.contact_email {
width : 100%;
}
.contact_email .inputbox {
width : 345px;
}
/** Module table **/
table.moduletable {
margin : 0 0 8px 0;
width : 100%;
background : #ffffff;
}
table.moduletable td {
padding-top: 2px;
}
/** modules with rounded corners **/
div.module {
width: 183px;
background: url(images/mod_mid.gif) repeat-y;
margin-bottom: 15px;
}
div.module div {
background: url(images/mod_bot.gif) bottom left no-repeat;
}
div.module div div {
background: url(images/mod_top.gif) top left no-repeat;
padding: 10px 10px 20px 10px;
}
div.module div div div {
background: none;
padding: 0;
width: auto !important;
width: 100%;
}
div.module div div div h3 {
display: block;
padding : 0 0 10px 0;
margin : 0;
font-size : 13px;
font-weight : bold;
color : #999999;
text-align : center;
letter-spacing : 1px;
}
/** Read more **/
a.readon:link, a.readon:visited {
color : #999999;
font-family : Tahoma, Arial, Verdana, Helvetica, sans-serif;
font-size : 11px;
background : url(images/arrow.png) no-repeat;
white-space : normal;
font-weight : bold;
padding : 1px 0 3px 14px;
float : right;
line-height : 13px;
text-decoration : underline;
}
a.readon:hover {
color : #006600;
font-family : Tahoma, Arial, Verdana, Helvetica, sans-serif;
font-size : 11px;
background : url(images/arrow.png) no-repeat;
white-space : normal;
font-weight : bold;
padding : 1px 0 3px 14px;
line-height : 13px;
text-decoration : underline;
}
/** Pagenavigation **/
.pagenavcounter {
font-size : 11px;
color : #999999;
}
.pagenavbar {
border-top : 1px solid #999999;
padding : 2px;
}
.pagenav {
font-weight : bold;
}
a.pagenav:link, a.pagenav:visited {
font-size : 11px;
color : #999999;
text-decoration : none;
}
a.pagenav:hover {
font-size : 11px;
color : #006600;
text-decoration : none;
}
table.contenttoc {
border : 1px solid #dcdcdc;
background : #f1f1f1;
padding : 5px;
margin-left : 2px;
margin-bottom : 2px;
}
/** Pathway **/
.pathway {
font-size : 11px;
color : #333333;
padding-left : 20px;
}
a.pathway:link, a.pathway:visited {
font-size : 11px;
padding-left : 0;
font-weight : bold;
text-decoration : underline;
}
a.pathway:hover {
font-size : 11px;
padding-left : 0;
font-weight : bold;
}
/** Content **/
table.content{
width : 100%;
padding : 0;
border-collapse : collapse;
border-spacing : 0;
margin-bottom : 10px;
}
table.contentpane {
width : 100%;
border-spacing : 0;
padding-left : 5px;
padding-right : 5px;
margin-bottom : 5px;
}
table.contentpaneopen {
width : 100%;
border-spacing : 0;
padding-left : 5px;
padding-right : 5px;
margin-bottom : 5px;
}
.contentheading,.componentheading {
font-family : Georgia, Arial, Verdana, Helvetica, sans-serif;
width : 100%;
font-size : 17px;
font-weight : bold;
line-height : 16px;
text-transform : uppercase;
text-align : left;
text-indent : 0;
color : #999999;
padding-bottom : 5px;
margin : 3px 0;
border-bottom : 1px solid #999999;
}
.contentdescription {
width : auto !important;
margin : 0;
padding : 0;
padding-top : 5px;
text-align : left;
}
.blog_more {
margin : 10px 0 7px 7px;
}
.buttonheading {
padding : 0 2px;
}
.content_vote {
font-size : 10px;
height : 22px;
padding : 2px 0;
}
.content_rating {
font-size : 10px;
color : #999999;
}
.small {
font-size : 11px;
color : #999999;
}
.smalldark {
font-size : 11px;
color : #333333;
}
.createdate, .modifydate {
float : right;
font-size : 10px;
color : #999999;
text-align : right;
width : 100%;
}
a.category:link, a.category:visited {
font-size : 11px;
font-weight : bold;
}
.sectiontableheader {
font-size : 12px;
font-weight : normal;
text-transform : uppercase;
letter-spacing : 1px;
color : #333333;
background : #ffffff;
padding : 1px;
}
.sectiontableentry1 {
vertical-align : top;
padding : 3px;
background : #f6f6f6;
border-bottom : 1px solid #ffffff;
line-height : 15px;
}
.sectiontableentry2 {
vertical-align : top;
padding : 3px;
border-bottom : 1px solid #ffffff;
background : #f0f0f0;
line-height : 15px;
}
.sectiontableentry1 img{
margin-right: 4px;
}
.sectiontableentry2 img{
margin-right: 4px;
}
/** Polls **/
.poll {
color : #333333;
line-height : 13px;
font-weight: normal;
text-align: left;
}
.pollstableborder{
border-color : #999999;
}
/** "Tab" buttons for Joomla frontend **/
.ontab {
border-left : 1px solid #666666;
text-align : center;
font-weight : bold;
color : #333333;
padding : 5px;
cursor : pointer;
line-height : 30px;
}
.offtab {
border-left : 1px solid #666666;
text-align : center;
color : #999999;
font-weight : normal;
padding : 5px;
cursor : pointer;
line-height : 30px;
}
.tabpadding {
border-left : 1px solid #666666;
}
/** CSS for Mainmenu **/
a.mainlevel {
display : block;
width : auto;
margin : 1px 0;
padding : 0;
font-size : 12px;
background : none;
text-indent : 10px;
}
a.mainlevel:link, a.mainlevel:visited {
display : block;
font-size : 12px;
border-bottom : 1px solid #cccccc;
background-color : #f1f1f1;
font-weight : normal;
padding : 2px 0;
color : #666666;
font-weight : bold;
text-indent : 10px;
}
a.mainlevel:hover {
border-bottom : 1px solid #cccccc;
background-color : #e0e0e0;
font-size : 12px;
font-weight : normal;
color : #666666;
text-decoration : none;
text-indent : 10px;
}
#active_menu {
color : #b40202;
border-bottom : 1px solid #cccccc;
background : url(images/menu.gif) #e0e0e0 96% 50% no-repeat;
font-weight : bold;
}
a#active_menu:hover {
color : #333333;
}
/** Sublevel for Mainmenu **/
.sublevel {
font-family : Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size : 10px;
font-weight : bold;
color : #999999;
padding : 3px 1px 3px 5px;
margin : 3px;
}
a.sublevel:link, a.sublevel:visited {
color : #999999;
text-decoration : none;
}
a.sublevel:hover {
color : #006600;
text-decoration : none;
}
a.sublevel#active_menu {
background : transparent;
color : #006600;
}
/** Topmenu styles for BOTTOM navigation **/
#mainlevel-nav {
font-size : 11px;
list-style : none;
padding : 0;
margin : 0;
}
#mainlevel-nav li {
float : left;
display : block;
list-style : none;
background-image : none;
padding-left : 0;
padding-right : 4px;
margin : 0;
width : auto !important;
font-size : 11px;
line-height : 28px;
white-space : nowrap;
}
#mainlevel-nav li a {
padding-left : 0;
padding-right : 10px;
font-size : 11px;
color : #666666;
text-decoration : underline;
}
#mainlevel-nav li a:hover {
font-size : 11px;
color : #999999;
}
/** images **/
.mosimage {
border : 1px solid #dedede;
margin : 5px;
padding-top: 3px;
}
.mosimage_caption {
margin-top: 3px;
padding : 2px;
color : #666666;
font-size : 10px;
background: #f1f1f1;
}
/** #################### index.php #################### **/
.main {
float : left;
width : 100%;
margin : 0;
padding : 0;
}
.mod {
background : #FFFFFF;
width : 2px;
}
.date {
font-size : 11px;
font-weight : bold;
color : #707070;
padding-right : 25px;
}
td.bgline {
margin : 0;
padding: 0;
width : 7px;
}
.www {
background : url(images/www.gif) no-repeat top left;
height : 49px;
width: 370px;
}
td.top_bar {
margin : 0;
padding: 0;
height : 49px;
padding-right : 30px;
}
td.pw{
margin: 0;
padding: 0;
height: 28px;
padding: 3px 0;
text-align: left;
}
.footer {
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 11px;
color : #999999;
font-weight : normal;
height : 70px;
padding-top : 25px;
}
.footer a:link, .footer a:visited {
font-size : 11px;
color : #666666;
text-decoration : underline;
font-weight : normal;
line-height : 17px;
}
.footer a:hover {
font-size : 11px;
color : #999999;
text-decoration : underline;
font-weight : normal;
}
.col {
vertical-align : top;
background : #ffffff;
padding : 0 5px 5px 0;
text-align: left;
}
.rcol {
vertical-align : top;
background : #ffffff;
padding : 0 0 5px 5px;
text-align: left;
}
.foot {
margin-top : 6px;
vertical-align : top;
background: url(images/footer_repeat.gif) repeat-x top left;
}
/** main container **/
#container_out{
text-align: center;
margin:0;
padding:0 2%;
align: center;
}
div#container {
height: 100%;
margin-left: auto;
margin-right: auto;
max-width: 1100px;
width: expression(document.body.clientWidth > 1100? "1100px": "auto" );
}
#maincontainer{
margin:0;
padding:0;
background : url(images/body_bg.gif) repeat-x top left;
width:100%;
height: 100%;
}
|