*/
/* This div will hold all textual contents in the core of your page, hence core_container... */
width: 100%; /* Just as wide as the #container, since it's still in there. */
background-color: #FFFFFF; /* Good ol' white. */
}
#core_left { /*
*/
width: 180px; /* A fixed width to display the images correctly below eachother. */
float: left; /* Always stay on the left side of the #core_container. */
padding: 12px; /* 12px space inside this div before anything happens. */
_padding: 6px; /* IE HACK. 6px space for IE, because of the boxmodel error. Remove this and check the page in IE... :( */
height: auto; /* Height is automaticlly calculated. No need to set it. */
background-color: #FFFFFF;
}
#core_left img {
border: 0; /* The images on the left may not have a border. */
}
#core_left p {
font-size: 70%; /* The fontsize is 70% of the fontsize of the body tag. */
}
#core_left a, #core_left a:link, #core_left a:visited {
color: #000000; /* All links, visited or not are black. */
text-decoration: none; /* with no line under it. */
}
#core_left a:hover {
color: #00ACF4; /* Oceanblue linktext on hover. */
}
#core_left h3, #core_left h4 {
position: relative; /* All sizes, paddings and margins are measured relative to #header h1. */
display: inline;
vertical-align: center; /* Appear in the center of the #header. */
font-size: 90%; /* 90% of the size of the font-size from the body. */
font-weight: 500; /* a bolder font. 600 for even bolder, 100 for very sleek. */
text-transform: uppercase; /* ALL CAPS ON THIS LINE OF TEXT */
color: #00ACF4; /* Ocean blue color... */
letter-spacing: 1px; /* spread those letters over your screen a bit more */
font-family: "Trebuchet MS", Verdana, sans-serif; /* I love Trebuchet, should've been the standard font! ;-) */
}
#core_left li { /* The contents of core_left is presented in an unordered list. Here it is. */
font-size: 10px; /* Fontsize and styling. */
font-family: Verdana, Arial, Helvetica, sans-serif;
}
.litxt { /* This is the text in the unordered list within core_left, with 5% space on the left. */
padding-bottom: 10px;
width: 95%;
padding-left: 5%;
}
#core_left ul { /* this is the ul styles for core_left. */
list-style: none; /* No dot in the list please. */
padding-left: 0px; /* Get yourself to the left of the page. */
margin-left: 0; /* IE needs this to do the same as stated above... */
}
/* THIS NAVIGATIONBAR IS COURTESY OF MAXDESIGN > http://css.maxdesign.com.au/listamatic */
#navcontainer {
text-align: right;
margin-top: 3px;
}
ul#navlist {
margin-left: 0;
padding-left: 0;
white-space: nowrap;
}
#navlist li {
display: inline;
list-style-type: none;
}
#current {
border-top: 1px dashed #DD8200;
}
#navlist a {
padding: 3px 10px;
font-size: 11px;
font: Verdana, Arial, Helvetica, sans-serif;
}
#navlist a:link, #navlist a:visited {
color: #007CB0;
background-color: #FFFFFF;
text-decoration: none;
}
#navlist a:hover {
color: #fff;
background-color: #DD8200;
text-decoration: none;
}
#navlist a:active {
color: #fff;
background-color: #00ACF4;
text-decoration: none;
}
/* THIS NAVIGATIONBAR IS COURTESY OF MAXDESIGN > http://css.maxdesign.com.au/listamatic */
#core_right { /*
*/
width: 466px; /* this div is 476px wide and contains all contents on the right of the page. */
float: left; /* Always show up on the rightside of the screen, even when width is changed of the #container. */
margin: 0; /* No margins, no paddings. */
padding: 0;
background-color: #FFFFFF; /* Fresh white! */
}
#core_right h5, #core_right h6 { /* The headers in #core_right */
position: relative; /* All sizes, paddings and margins are measured relative to #header h1. */
vertical-align: center; /* Appear in the center of the #header. */
font-size: 90%; /* 90% of the size of the font-size from the body. */
font-weight: 500; /* a bolder font. 600 for even bolder, 100 for very sleek. */
text-transform: uppercase; /* ALL CAPS ON THIS LINE OF TEXT */
color: #00ACF4; /* Ocean blue color... */
letter-spacing: 1px; /* spread those letters over your screen a bit more */
font-family: "Trebuchet MS", Verdana, sans-serif; /* I love Trebuchet, should've been the standard font! ;-) */
}
#core_right p, #core_right h5, #core_right h6 {
padding-left: 5%; /* The headers and paragraphs in core_right should stay 5% off the edge of div #core_right. */
}
#core_right p { /* The paragraphs in #core_right should have this styling: */
font-family: "Trebuchet MS", Verdana, sans-serif; /* Font... */
font-size: 80%; /* 80% of the font-size from the body tag. */
line-height: 20px; /* The whitespace between the lines. */
}
.bottom_ul { /* The small list of links on the bottom of the page. */
list-style: none; /* no dot next to the list. */
padding-left: 20px; /* 20px of the leftside of #core_right. */
width: 420px; /* Always be 420px wide, to get that cool hover effect. */
height: 12px; /* 10px fontsize, 12px height. Seems enough. */
margin: 0; /* No extra margins anywhere. It's tight enough */
}
.bottom_ul li { /* The actual list on the bottom. */
padding: 0px 10px; /* 0px space above, but 10px space on the right of this list. */
background-color:#FFFFFF; /* Fresh white! */
}
.bottom_ul a { /* The links in the list stated above. */
font-size: 70%; /* small fontsize. */
display: block; /* Get that hover effect, display your links in a block with fixed height and width... */
padding: 3px; /* 3px whitespace everywhere. */
width: 420px; /* Hey, there's that 420px again! */
color: #AAAAAA; /* Lightgrey fontcolor. */
font-family: Verdana, Arial, Helvetica, sans-serif; /* Font. */
}
.bottom_ul a:hover { /* Mouseover that list and you'll see... */
color: #00ACF4; /* Oceanblue fontcolors. */
width: 420px; /* Hey, there it is again! */
background: #F8F8F8 url(arrow_right.jpg) 98% 50% no-repeat; /* And an even lightergrey background! */
}
#footer { /* The bottom, with the copyright notice. */
clear: both; /* Appear UNDER core_right, not next to it. Not even with changed width on #container. */
width: 680px; /* 680px? Yep, the same width as #container. */
height: 20px; /* Give it some height! */
text-align: right; /* The text should appear on the rightside of the footer. */
margin: 0;
}
#footer p { /* The
within the footer is styled here. */
text-transform: uppercase; /* ALL CAPS ON THIS LINE OF TEXT */
background: #FFFFFF url(diags.jpg) 0% 30% repeat-x; /* Those cool diagonal lines in the back. */
font-size: 60%; /* An even smaller font then the list we just did. */
color: #000000; /* Ocean blue color... */
letter-spacing: 1px; /* spread those letters over your screen a bit more */
font-family: "Trebuchet MS", Verdana, sans-serif; /* I love Trebuchet, should've been the standard font! ;-) */
}
#footer a { /* The