/* 
    Government of Alberta Style Sheet
    CSS2 Definitions for Site Content
    created: YellowPencil.com - February 2007
    edited:
*/


/* Content Details */
#content h1 {font-weight:normal;color:#0d3692;}
#content a {color:#0d3692;}
#content a:hover {color:#333;}
#content img.left {float:left;margin:0 16px 10px 0;}
.clear {clear:both;line-height:.1em;font-size:.1em;}
.layoutTable td {padding:5px;border-bottom:1px solid #f3f3f3;}
.layoutTable th {font-weight:bold;background:#f3f3f3;padding:5px;}
img.alignLeft {float:left;margin: 0 10px 10px 0;}
.lastupdated {font-size:.8em; margin: -15px 0 5px 10px;}
#content th {font-size: 1.2em; padding: .25em; font-weight: bold;}
#content dt {font-size: 1em; margin-top: .3em; font-weight: bold;}
#content dd {margin-left: 2.5em;}




/*
    Page Layout Templates
*/
/* Photo Gallery with Grid Layout image area = 175px */
.photoGallery {}
.photoGalleryBig .galleryItem {width:200px;height:225px;}
.photoGallerySmall .galleryItem {width:120px;height:140px;font-size:.9em;}
.galleryItem {float:left;width:150px;margin:10px 20px 10px 0;text-align:center;}
.galleryItem a {}
.galleryItem p {margin:0;padding:5px;}
.photoGallerySmall .galleryItem p {padding:2px;}
.galleryItem img {}
.galleryItem .caption {}
/* Government and Ministry Main Landing Page */
.govLanding h3, .ministryLanding h3 {margin-bottom:0;}
.govLanding p, .ministryLanding p {margin-top:0;}
.govLanding li, .ministryLanding li {list-style:none;padding:.25em .5em;}
.columnLeft {}
.columnRight {}
.columnLeft .section, .columnRight .section {}

/* Home Page: News and Spotlight List Definitions */
#news {position:relative;}
#news #currentDate {position:absolute;top:12px;right:15px;color:#666;font-size:.9em;}
.newsList .category {margin:0;font-weight:normal;font-size:.9em;}
#content .newsList .category a {color:#666;}
#content .newsList .category a:hover {color:#000;}
.newsList .category a:hover {color:#000;}
.newsList .summary {margin:0 0 12px 0;}
#spotlight {}
#spotlight ul {margin:0;padding:0;list-style:none;}
.spotlightList li {margin:0 0 10px 0;padding:0;}

/* RedDot SmartEdit Classes */

.instructions {font-size:.9em;color:#900;}
.instructionsgrey {font-size:.9em;color:#666;}
.sampletext, .sampletext a {color: #003399; font-family: "courier", times, serif;font-weight:bold;}
.preview {float:right;font-size:.8em;display:inline;margin-top:-10px;}
.thumbnail {border: 1px solid #CCC;}



/* 
    Text Editor Classes - used for RedDots WYSIWYG editor
*/
.rightAlign {float:right;}
.leftAlign {float:left;}
.alignCenter{padding-left: 2px;}
.valignMiddle img {vertical-align: middle}
.small {font-size:.89em;}
.icon {padding: 0;}

/* 

Right Floater box - a simple blue box with a header (title) region - used to create inline boxes to callout content 

*/
.rightFloater {
    clear:both;
    float:right;
    margin:0 20px 20px 10px;
    width:200px;border: thin solid #e6e9f0;
    border-right: thin solid #e6e9f0;
    border-left: thin solid #e6e9f0;
    border-bottom: thin solid #e6e9f0;
    padding: 10px 5px 10px 5px;
 }
.rightFloater h2 {
    line-height:16pt;
    text-align:left;
    font-size:1.3em;
    /*font-family:arial,helvetica,sans-serif;*/
    font-weight:bold;
    color: #0d3692;
    background-color: #ebeef5;
    margin-bottom:2px;
    padding: 5px 5px 5px 10px;
    margin: -10px -5px 0 -5px;
}
.rightFloater p {
    font-size: .89em;
    margin-top:0;
    text-align:left;
    padding: 5px 5px 0px 8px;
    line-height:1.1em;
}
.rightFloater img {
    margin-top:2px;
    vertical-align: bottom;
}

/* 
    Content Modules and layout styles 
*/

#contentColumn li {line-height: 1.6em;}

/* Listing Classes - used to list blocks of content with/without thumbnail images.  Must be nested correctly to work.  See template layout for HTML code examples */
.listing {clear:left;min-height:50px;padding:0.7em 0pt 1em;position:relative;}
.listing h3 {margin:1em 0 0.6em}
.listing-body {padding-left:8px;}
.listing-body p {line-height:1.3;margin:0.2em 0pt 0.1em;}
.listing-icon {float:left; padding:.5em 0.2em 1em;}


/* 

Quicklinks are DIV boxes that can be used to reference URLS, anchors and other links.  They create a list of bullets with arrows.  There are 2 types of quicklinks boxes (both look the same)

quicklinks: (for 1-Column layout or in the left column of a 2 column layout) as an inline DIV class. It will automatically float right
quicklinks3: (for Thirds layout in the right hand column) this div will expand and contract accordingly based on a percentage value.

*/

.quicklinks, .quicklinks3 {
    float: right;
    border:#BCE2D6 solid 1px;
    background: #eff4f5;
    font-family: Tahoma,Verdana, Arial, Helvetica, sans-serif;
    margin: 0 0 1em 2em;
    clear: right;
    padding: 0 20px 10px;
}

.quicklinks {width: 25%;}
.quicklinks3 {width: 83%;}

.quicklinks h3, .quicklinks3 h3{
    background:url(../images/interface/sidebar_tile.gif) repeat-x;
    border-bottom:#BCE2D6 solid 1px;
    font-size:1.2em;
    padding:3px 10px 3px 10px;
    color:#003399;
    margin: 0 -20px 0 -20px;
}
.quicklinks ul, .quicklinks3  ul{list-style-type:none;margin:10px 0 5px 0;padding: 0 0 5px 10px;}
.quicklinks li, .quicklinks3 li{list-style: disc url(../images/interface/bullet_arrow.gif);padding-bottom: 5px;}
.quicklinks a, .quicklinks3 a{text-decoration: none;font-size: 1em;}
.quicklinks a:hover,.quicklinks3 a:hover{text-decoration: underline;}

/* 

Sidebar is a DIV box that can be used to feature content with a heading (optional), thumbnail (optional) and links (optional).  It creates an outlined box, and has padding and formatting settings predefined. .  There are 2 types of sidebar boxes (both look the same)

sidebar: (for 1-Column layout or in the left column of a 2 column layout) as an inline DIV class. It will automatically float right
sidebar3: (for Thirds layout in the right hand column) this div will expand and contract accordingly based on a percentage value

*/

.sidebar, .sidebar3 {
    float: right;
    border:#ccc/*BCE2D6*/ solid 1px;
    font-family: Tahoma,Verdana, Arial, Helvetica, sans-serif;
    color: #666666;
    padding: 10px;
    clear: right;
    margin: 0 0 1em 2em;
}

.sidebar {width: /*32.55%*/27.55%;}
.sidebar3, .columnRight sidebar {width: 91%;}

.sidebar img, .sidebar3 img {float:left;border:#BCE2D6 solid 0px;margin: 5px;}
.sidebar h3, .sidebar3 h3 {font-size: 1.2em;margin:0 0 5px 0;color:#34A281/*3BB590 86b5a9*/}
.sidebar p, .sidebar3 p {font-size: .89em;margin-top:0;color:#666666;}
.sidebar a, .sidebar3 a {text-decoration: none;font-size: 1em;}
.sidebar a:hover, .sidebar3 a:hover {text-decoration: underline;}

.sidebar ul, .sidebar3 ul {margin:-10px 0 0 0;clear:left;}
.sidebar li, .sidebar3 li  {list-style-type: square;font-size:.89em;}
 
 /* Aligns images left or right as well as provides the font styling to add captions */
.photoRight {font-size: .89em; color: #666666;margin:1em 0 1em 1em;padding-left:1em;float:right;}
.photoLeft {font-size: .89em; color: #666666;margin:1em 2em 1em 0;padding-right:1em;float:left;}

/* a simple divider with a rounded corner.  Can be used in any column on any layout */
.subhead1{
    background: #EFF4F5 url(../images/interface/subhead1_left_cnr.gif) no-repeat left top;
    width:100%; 
    color: #003399;
    padding: .3em 0 .1em .8em;
    margin-left: -13px;
    text-align:left;
    clear:both;
    font-family:arial,helvetica,sans-serif;
}
 
/* a basic horizontal rule style */ 
hr {
background:#C3C8CB none repeat scroll 0%;
border:medium none;
clear:both;
color:#C3C8CB;
height:1px;
margin:0pt 0pt 1.35em;
}
span.careershopproductname
{
font-weight:normal;
font-size:15px;
font-weight:bold;
}