/***********************************************************************************************

* Styles for all elements on a page

***********************************************************************************************/



/* Set Margin and Padding of Everything to Zero to overwrite browser default styles  */

* {

    margin:0;

    padding:0;

}



/* Adding Padding to the right of a drop down option - otherwise chops off */

option {

    padding-right: 10px;

}



blockquote {

    margin: 15px;

    padding: 5px;

}



/* Body and HTML */

html, body {

    width: 100%;

    height: 100%;

}



/* Default Size of all Items on a Page */

body {

    font-size: 14px;

}



a:link{

    color: #000099;

    text-decoration:none;


}


a:visited {

    color: red;

    text-decoration:bold;

}



a:hover {

    color: #CC0000;

    text-decoration:underline;


}







/***********************************************************************************************

*  Horizontal, top-2-bottom menu

*  Copyright Aleksandar Vacic, www.aplus.co.yu, some rights reserved http://creativecommons.org/licenses/by-sa/2.0/

***********************************************************************************************/



#menu {

    display: block;

    padding-left: 10px;

    z-index: 100;
    
    float:left;

}



#menu ul {

    margin: 0;

    padding: 0;

    border: 0;

    list-style-type: none;

}



#menu li {

    margin: 0;



    border: 0;

    display: block;

    float: left;

    position: relative;

}



#menu li a {

    padding-right: 30px;

}



#menu a {

    display: block;

}



#menu li li {

    padding: 0;

    width: 100%;

}



/* fix the position for 2nd level submenus. first make sure no horizontal scrollbars are visible on initial page load... */

#menu li li ul {

    top: 0;

    left: 0;

}



/* ...and then place it where it should be when shown */

#menu li li:hover ul {

    left: 100%;

    z-index: 100;

}



/* initialy hide all sub menus */

#menu li ul {

    display: none;

    position: absolute;

    z-index: 101;

    width: 130px; /* Customizable*/

}



/* display them on hover */

#menu li:hover>ul {

    display: block;

    z-index: 101;

}



/* this is needed if you want to style #menu div - force containment of floated LIs inside of main UL */

#menuList:after {

    content: ".";

    height: 0;

    display: block;

    visibility: hidden;

    overflow: hidden;

    clear: both;

}



/* Fix for IE5/Mac \*//*/

#menu a {

    float: left;

}



/* */



/***********************************************************************************************

* CSS for Two & Three Column Layouts

***********************************************************************************************/



div#wrapper{float:left;width:100%}



/* Three Column Layout */

#threecolumn div#wrapper div#content{margin: 0 250px 0 250px}

#threecolumn div#left{float:left;width:250px;margin-left:-100%}

#threecolumn div#right{float:left;width:250px;margin-left:-250px}



/* Two Column Layout */

#twocolumn div#wrapper div#content{margin: 0 0 0 200px}

#twocolumn div#left{float:left;width:200px;margin-left:-100%}

#twocolumn div#right{display:none}



/* Right Column Column Layout */

#rightcolumn div#wrapper div#content{margin: 0 250px 0 0}

#rightcolumn div#left{display:none}

#rightcolumn div#right{float:left;width:250px;margin-left:-250px}



#footer {

    clear:both;

    border-top: 1px solid #E3E8EE;

    padding: 10px 0 30px;

    font-size:86%;

}





/***********************************************************************************************

* Common Styles for Usage

***********************************************************************************************/



/* Use this styles for tables instead of <td nowrap> */

.nowrap {

    white-space: nowrap;

}





/* Confirm message that action has occurred successfully */

.confirm, #confirm

{

    color: #000000;

    background-color: #FFDE39; /* A dark yellow */

}



/* Use for text that is greyed out or dimmed for some reason */

.dim {

    color: #666666;

}



/* Specify certain text that for error messages */

.error

{

    color: red;

}

input.inputerror {
    background-color: red;
    color: white;
}



.HighLightText

{

    background-color: #669900;

    color: #ffffff;

}



.warning /* Specify certain text that you want people to notice or beware of for example: "Please note that the suggestion box

         is for suggestions about KEWL". */

{

    color: #FFA500;

    font-weight: bold;

    padding: 2px;

}



/*  This specify the color of the notes or short little descriptive wording, shown on the login page and

        after you've logged in for example the following text:"Note this is still very experimental and there is

        no translation for most things". */

.minute

{

    font-size: 85%;

    color: #660033;

}



/* Large Font for Indicating no Records*/

.noRecordsMessage {

    font-style: oblique;

    text-align: center;

    font-weight: normal;

    padding-top: 2em;

    padding-bottom: 2em;

    font-size: large;

}



/* Dark Wrapper - for the header*/

.wrapperDarkBkg {

    background-color: #336600;

    padding: 3px;

    color: #FFFFFF;

}



/* Light Wrapper - for the Content*/

.wrapperLightBkg {

    background-color: #FFFFFF;

    padding: 3px;

}



/* Odd table rows - for the Content*/

.sudokuOdd {

    background-color: #a8a8a8;

    padding: 3px;

}



/* Even table rows - for the Content*/

.sudokuEven {

    background-color: #d0d0d0;

    padding: 3px;

}



/* Color of Content in Wrapper*/

.wrapperLightBkg p {

    color: black;

}



/* CSS From Mollio */



/* TYPOGRAPHY */

p, ul, ol {margin: 0 0 1.5em}

h1 {font-size: 196%; margin-top:.6em}

h2 {font-size: 136%}

h3 {font-size: 126%}

h4 {font-size: 116%}

h5 {font-size: 106%}

h6 {font-size: 96%}





/* LISTS */

ul {margin: .3em 0 1.5em 0;list-style-type:none}

    ul.related {margin-top: -1em}

ol {margin: .5em .5em 1.5em}

ol li {margin-left: 1.4em;padding-left: 0;background: none; list-style-type: decimal}

li.doc {background-position: 3px -500px}

ul.nomarker li {background:none;padding-left:0}



dl {margin: 0 0 1em 0}

dt {font-weight:bold;margin-top: 1.3em}

dl dl {margin: 0 0 1.5em 30px}

img {border:none}

hr {margin: 1em 0;background:#f2f2f2;height:1px;color:#f2f2f2;border:none;clear:both}

small {font-size:11px}



.clear {clear:both;position:relative;font-size:0px;height:0px;line-height:0px}

.highlight {color:#E17000}

.subdued {color:#999}

.error {color:#c00;font-weight:bold}

.success {color:#390;font-weight:bold}

.caption {color:#999;font-size:11px}

.date {font: bold 82% arial;color:#bbb;display:block;letter-spacing: 1px}





/* Tab boxes */

fieldset.tabbox {

    border: 1px solid #006600;

    margin:0;

    margin-bottom: 10px;

}

/* Legend in Tab boxes */

legend.tabbox {

    background-color:white;

    border: 1px solid #006600;

    color:#000000;

    font-family:Times, serif;

    font-weight:bold;

    padding-left: 5px;

    padding-right: 5px;

}

/* Increase padding of lists in tab boxes*/

fieldset.tabbox ul, fieldset.tabbox ol {

    margin-left: 0px;

    padding-left: 15px;

}



/* Switch menu styles */

.menutitle{

    cursor:pointer;

    margin-bottom: 5px;

    background-color:#ECECFF;

    color:#000000;

    width:98%;

    padding:2px;

    text-align:center;

    font-weight:bold;

    /*/*/border:1px solid #000000;/* */

}



.submenu{

    margin-bottom: 0.5em;

    background-color:#FFFFFF;

}

/* End - Switch menu styles */





/* This CSS prevents content from flowing into the next line*/

table.overflowtable {

    table-layout:fixed;

}

table.overflowtable td.overflowcolumn {

    overflow:hidden;

    white-space:nowrap;

 }



 /***********************************************************************************************

*  BEGIN: Styles to use for creating tabbed boxes such as the login one                        *

***********************************************************************************************/



fieldset.tabbox {

    border: 1px solid #626262;

    margin:0;

    margin-bottom: 10px;

}

legend.tabbox {

    background-color:white;

    border: 1px solid #626262;

    color:#000000;

    font-family:Times, serif;

    font-weight:bold;

    padding-left: 5px;

    padding-right: 5px;

}



fieldset.tabbox ul {

    margin-left: 0px;

    padding-left: 15px;

}



/******************************************************************************************

*  Styles in the Discussion Forum

******************************************************************************************/



.newForumContainer {

    margin: 10px;

    border: 1px solid black;

}



.newForumTopic {

    background-color: #F2F2F2;

    padding: 5px;

}

.newForumContent {

    clear: both;

    background-color: white;

    border-top: 1px solid black;

    padding: 5px;

}



.forumUserPicture {

    float:left;

}



.forumTopicTitle {

    margin-left: 50px;

}



.smallText {

    font-size: 90%;

}



.forumTangentIndent {

    margin: 10px;

    padding: 5px;

    background-color: #ffffcc;

    border: 1px dotted #800080

}





/******************************************************************************************

*  END - Styles in the Discussion Forum - END

******************************************************************************************/





/* SECONDARY NAVIGATION - vertical navigation */

    #nav-secondary, #nav-secondary ul {position:static}

    #nav-secondary, #nav-secondary li {list-style: none;margin:0;padding:0;background:#fff}

    #nav-secondary {padding-top:0;border-top: 1px solid #ccc;margin-top: 1px}

    #nav-secondary a {line-height:1.8;padding: 5px 0 5px 23px;background: #fff;font: bold 86% arial;display:block}

    #nav-secondary a, #nav-secondary a:link, #nav-secondary a:visited, #nav-secondary a:hover, #nav-secondary a:active {text-decoration:none;cursor:pointer;}

    #nav-secondary a:link {color:#000}

    #nav-secondary a:visited {color:#000}

    #nav-secondary a:hover {color:#c00;background: #fee}

    #nav-secondary li.active a:link, #nav-secondary li.active a:visited, #nav-secondary li.active a:hover, #nav-secondary li.active a:active {color:#c00}

    #nav-secondary li {border-top: 1px solid #fff;border-bottom: 1px solid #ccc}



/* SECONDARY NAVIGATION - 2nd TIER */

    #nav-secondary ul {margin: 0 0 1em 23px;padding:0}

    #nav-secondary li.active li a, #nav-secondary li.active li a:link, #nav-secondary li.active li a:visited {line-height:1.5;background-color: #fff ;padding:0 0 0 12px;font-weight:normal;width:auto;color:#000;width:130px;display:block}

    #nav-secondary li.active li a:hover, #nav-secondary li.active li a:active {color: #c00}

    #nav-secondary li.active li {border: none;margin:0}



    #nav-secondary li.active li.active a:link,

    #nav-secondary li.active li.active a:visited,

    #nav-secondary li.active li.active a:hover,

    #nav-secondary li.active li.active a:active {font-weight:bold}



/* SECONDARY NAVIGATION - 3rd TIER */

    #nav-secondary ul ul {margin: 0 0 1em 13px;padding:0}

    #nav-secondary li.active li.active li a, #nav-secondary li.active li.active li a:link, #nav-secondary li.active li.active li a:visited {width:117px}

    #nav-secondary li.active li.active li a:link,

    #nav-secondary li.active li.active li a:visited,

    #nav-secondary li.active li.active li a:hover,

    #nav-secondary li.active li.active li a:active {font-weight:normal}

    #nav-secondary li.active li.active li.active a:link,

    #nav-secondary li.active li.active li.active a:visited,

    #nav-secondary li.active li.active li.active a:hover,

    #nav-secondary li.active li.active li.active a:active {font-weight:bold}



/* SECONDARY NAVIGATION - 4th TIER */

    #nav-secondary ul ul ul {margin: 0 0 1em 13px;padding:0}

    #nav-secondary li.active li.active li.active li a, #nav-secondary li.active li.active li.active li a:link, #nav-secondary li.active li.active li.active li a:visited {width:104px}

    #nav-secondary li.active li.active li.active li a:link,

    #nav-secondary li.active li.active li.active li a:visited,

    #nav-secondary li.active li.active li.active li a:hover,

    #nav-secondary li.active li.active li.active li a:active {font-weight:normal}

    #nav-secondary li.active li.active li.active li.active a:link,

    #nav-secondary li.active li.active li.active li.active a:visited,

    #nav-secondary li.active li.active li.active li.active a:hover,

    #nav-secondary li.active li.active li.active li.active a:active {font-weight:bold}











/******************************************************************************************

*  MOUSE OVER POPUP                                                                       *

******************************************************************************************/





/* Default DOM Tooltip Style */

div.domTT {

    border: none;

    margin: 0em 0em 2em 0em;

    padding: 0;

}

div.domTTCaption {

    background: #000;

    border: 1px solid #000;

    border-style: solid solid none solid;

    color: #FFF;

    padding: 0em 1em 0em 1em;

    text-transform: none;

    text-decoration: none;



    font-size: 1em;

    height: 1em;

    cursor: pointer;

}

div.domTTContent {

     background: transparent;

    border-collapse: collapse;

    border: 1px solid #000;

    padding: 3px;

    overflow: auto;

    background: #FFF;

}







/******************************************************************************************

*  END OF MOUSE OVER POPUP                                                                        *

******************************************************************************************/



ul.sectionfolder li {

    background: transparent url('icons/folder2.gif') no-repeat 0px 1px;

    padding-left: 20px;

    margin-left: 0px;

}



li.sectionfolder {

    background: transparent url('icons/folder2.gif') no-repeat 0px 1px;

    padding-left: 20px;

    margin-left: 0px;

}



ul.treefolder ul {

    margin-bottom: 5px;

}



li.orangefolder {

    background: transparent url('icons/tree/treefolder_orange.gif') no-repeat 0px 1px;

    padding-left: 20px;

    margin-left: 0px;

}



li.greenfolder {

    background: transparent url('icons/tree/treefolder_green.gif') no-repeat 0px 1px;

    padding-left: 20px;

    margin-left: 0px;

}



li.whitefolder {

    background: transparent url('icons/tree/treefolder_white.gif') no-repeat 0px 1px;

    padding-left: 20px;

    margin-left: 0px;

}



/******************************************

* Styles for the tabcontent class

*******************************************/

ul.shadetabs{

padding: 3px 0;

margin-left: 0;

margin-top: 1px;

margin-bottom: 0;

font: bold 12px Verdana;

list-style-type: none;

text-align: left; /*set to left, center, or right to align the menu as desired*/



}



ul.shadetabs li{

display: inline;

margin: 0;

background-image: none;

padding-left: 0px;

}



ul.shadetabs li a{

text-decoration: none;

padding: 3px 7px;

margin-right: 3px;

border: 1px solid #778;

color: #2d2b2b;

background: white url(tabcontent/shade.gif) top left repeat-x;

}



ul.shadetabs li a:visited{

color: #2d2b2b;

}



ul.shadetabs li a:hover{

text-decoration: underline;

color: #2d2b2b;

}



ul.shadetabs li.selected{

position: relative;

top: 1px;

}



ul.shadetabs li.selected a{ /*selected main tab style */

background-image: url(tabcontent/shadeactive.gif);

border-bottom-color: white;

}



ul.shadetabs li.selected a:hover{ /*selected main tab style */

text-decoration: none;

}



div.tabcontentstyle{ /*style of tab content container*/

border: 1px solid gray;

width: 450px;

margin-bottom: 1em;

padding: 10px;

overflow: hidden;

}



div.tabcontent{

display:none;

}



@media print {

    div.tabcontent {

        display:block!important;

    }

}



/**

* END -Styles for the tabcontent class

*/



/**

 * Quotes styling

 */



q {

/*

#background: transparent;

#border: 1px solid gray;

#background-color: yellow;

#width: 50px;*/

}



q:before, q:after {

color: #69c;

font-size: 300%;

/*#width: 10px;*/

}



q:before {

content: open-quote;

height: 0;

/*#margin-left: -0.55em;*/

}

q:after {

content: close-quote;

/*

#height: 50px;

#margin-top: -70px;*/

}

/**

 * END QUOTES

 */



 /***

 * Sub Modal Window

 */

 #popupMask {

    display:none;

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:100%;

    z-index:200;

    background-color:#000;

    -moz-opacity: 0.7;

    opacity:.70;

    filter: alpha(opacity=70);

}

#popupContainer {

    position: absolute;

    z-index: 201;

    top: 0px;

    left: 0px;

    display:none;

    padding: 0px;

}

#popupInner {

    border: 1px solid #000000;

    background-color: #FFFFFF;

}

#popupFrame {

    margin: 0px;

    width: 100%;

    height: 100%;

    position: relative;

    z-index: 202;

}

#popupTitleBar {

    background-color: #333344;

    color: #FFFFFF;

    font-weight: bold;

    height: 1.3em;

    padding: 5px;

    border-bottom: 2px solid #000000;

    border-top: 1px solid #78A3F2;

    border-left: 1px solid #78A3F2;

    border-right: 1px solid #204095;

    position: relative;

    z-index: 203;

}

#popupTitle {

    float:left;

    font-size: 1.1em;

}

#popupControls {

    float: right;

    cursor: pointer;

}

#popupControls a span {

    display: block;

    height: 14px;

    width: 16px;

    text-indent: -9000px;

    background: url('icons/close_button.gif') no-repeat;

}



/**

* End - Submodal Window

*/





/**

Added styles for float based on language direction. Prevents hardcoding.

For example, these below are for divs that should be left aligned for English.

But for Arabic or Hebrew, they will be floated right, if it gets overridden in the skin stylesheet

*/

.floatlangdir {

    float: left;

}



.clearfloatlangdir {

    clear: left;

}

/* END - styles based on language direction */





/***

* CSS for Round Corners

*/

div.rounded {

  padding: 15px;

  background: #FFFBE6;

  margin-bottom: 20px;

  color: #fff;

}

div.rounded2 {

  background: #FFFBE6 url(roundcorners/tr.gif) no-repeat top right;

  margin-bottom: 20px;

}

div.rounded2 div {

  background: transparent url(roundcorners/tl.gif) no-repeat top left;

}

div.rounded2 div div {

  background: transparent url(roundcorners/br.gif) no-repeat bottom right;

}

div.rounded2 div div div {

  background: transparent url(roundcorners/bl.gif) no-repeat bottom left;

  padding: 15px;

}



/* FORMS */

form {margin: 0 0 1.5em}

/*input {font-family: arial,tahoma,verdana,sans-serif;margin: 2px 0}

*/

input  {

         border : 1px solid #ccc;

        z-index: -3;

        font-size: 11px;

}

fieldset {border: none}

label {display:inline;padding: 5px 0}

label br {clear:left}



/* FORMS - general classes */

    input.f-submit {padding: 1px 3px;background:#666;color:#fff;font-weight:bold;font-size:96%}

    input.button {padding: 1px 3px;background:#666;color:#fff;font-weight:bold;font-size:96%}



/* FORMS - f-wrap-1 - simple form, headings on left, form elements on right */

    form.f-wrap-1 {width:100%;padding: .5em 0;background: #f6f6f6 url("images/featurebox_bg.gif") no-repeat 100% 100%;border-top: 1px solid #d7d7d7;position:relative}

        form.f-wrap-1 fieldset {width:auto;margin: 0 1em}

        form.f-wrap-1 h3 {margin:0 0 .6em;font: bold 155% arial;color:#c00}

        form.f-wrap-1 label {clear:left;float:left;width:100%;border-top: 1px solid #fff}



        /* hide from IE mac \*/

        form.f-wrap-1 label {float:none}

        /* end hiding from IE5 mac */



        form.f-wrap-1 label input, form.f-wrap-1 label textarea, form.f-wrap-1 label select {width:15em;float:left;margin-left:10px}



        form.f-wrap-1 label b {float:left;width:8em;line-height: 1.7;display:block;position:relative}

        form.f-wrap-1 label b .req {color:#c00;font-size:150%;font-weight:normal;position:absolute;top:-0.1em;line-height: 1.2;left:-.4em;width:.3em;height:.3em}

        form.f-wrap-1 div.req {color:#666;font-size:96%;font-weight:normal;position:absolute;top:.4em;right:.4em;left:auto;width:13em;text-align:right}

        form.f-wrap-1 div.req b {color:#c00;font-size:140%}

        form.f-wrap-1 label select {width: 15.5em}

        form.f-wrap-1 label textarea.f-comments {width: 20em}

        form.f-wrap-1 div.f-submit-wrap {padding: 5px 0 5px 8em}

        form.f-wrap-1 input.f-submit {margin: 0 0 0 10px}



        form.f-wrap-1 fieldset.f-checkbox-wrap, form.f-wrap-1 fieldset.f-radio-wrap {clear:left;float:left;width:32em;border:none;margin:0;padding-bottom:.7em}

        form.f-wrap-1 fieldset.f-checkbox-wrap b, form.f-wrap-1 fieldset.f-radio-wrap b {float:left;width:8em;line-height: 1.7;display:block;position:relative;padding-top:.3em}

        form.f-wrap-1 fieldset.f-checkbox-wrap fieldset, form.f-wrap-1 fieldset.f-radio-wrap fieldset {float:left;width:13em;margin: 3px 0 0 10px}

        form.f-wrap-1 fieldset.f-checkbox-wrap label, form.f-wrap-1 fieldset.f-radio-wrap label {float:left;width:13em;border:none;margin:0;padding:2px 0;margin-right:-3px}

        form.f-wrap-1 label input.f-checkbox, form.f-wrap-1 label input.f-radio {width:auto;float:none;margin:0;padding:0}



        form.f-wrap-1 label span.errormsg {position:absolute;top:0;right:-10em;left:auto;display:block;width:16em;background: transparent url(images/errormsg_bg.gif) no-repeat 0 0}

        form.f-wrap-1 label span.errormsg b {padding: 10px 0;margin: 0 10px 0 30px;color:#B30800;font-weight:bold;display:block;width:auto;float:none;line-height:1.3}



/************************************************

* CMS Styles

************************************************/

// add/remove blocks
#selectblocks {
}

#selectblocks div.dropleft {
    border: 1px dashed black;
    background-color: lightyellow;
    z-index: 1;
    float: left;
    position: relative;
    margin-right: 10px;
    margin-bottom: 10px;
    padding: 4px;
}

#selectblocks div.leftblocks {
    border: 1px solid lightgray;
    padding: 5px;
    width: 190px;
    /*float: left;*/
    z-index:1000;
    margin: 0;
}

#selectblocks div.dropblock {
    border: 1px dashed black;
    background-color: lightyellow;
    z-index: 1;
    float: left;
    position: relative;
    padding: 4px;
    margin-right: 10px;
    margin-bottom: 10px;
}

#selectblocks div.usedblock {
    border: 1px solid lightgray;
    padding: 5px;
    width: 190px;
   /* float: left; */
    z-index:1000;
    margin: 0;
}

#selectblocks div.deleteblock {
    border: 1px dashed black;
    background-color: lightyellow;
    position: relative;
    padding: 4px;
    margin-right: 10px;
    margin-bottom: 10px;
    float: left;
}

#selectblocks div.addblocks {
    border: 1px solid lightgray;
    padding: 5px;
    width: 190px;
   /* float: left; */
    z-index:1000;
    margin: 0;
}

#selectblocks div.addblocks div.featurebox, #selectblocks div.usedblock div.featurebox, #selectblocks div.leftblocks div.featurebox {
    margin: 0;
}


/* menu icons / buttons*/

.menuBtnOn {

    color: #FFF;

    font-size: 90%;

    margin: 2px;

    background: #5F7D9C;

}



.menuBtnOn a, .menuBtnOn a:link, .menuBtnOn a:visited {

    font-family: arial-bold,arial,tahoma,verdana,sans-serif;

    font-weight: bold;

    color: #FFF;

    display: block;

    padding: 10px 15px 10px;

    text-decoration: none;

}

.menuBtnOn:hover, .menuBtnOn a:hover, .menuBtnOn a:link:hover, .menuBtnOn a:visited:hover {
    background:#3E19FF;
}


.menuBtn {

    font-family: arial,tahoma,verdana,sans-serif;

    font-size: 90%;

    margin: 2px;

    background: #f6f6f6;

}



.menuBtn a {

    display: block;

    padding: 10px 15px 10px;

    text-decoration: none;

}





/** control panel settings **/



#cpanel div.icon {

    border: 1px solid #A0A0A0;

    height: 97px;

    width: 108px;

    text-align: center;

    font-size: 95%;

    line-height: 97%;

    margin-right: 5px;

    float: left;

    margin-bottom: 5px;

}



#cpanel div.icon a {

    display: block;

    float: left;

    border: 1px solid #f0f0f0;

    line-height: 100%;

    height: 97px;

    width: 108px;

    vertical-align: middle;

    text-decoration: none;

}



#cpanel div.icon a:hover {

    border-left: 1px solid #eee;

    border-top: 1px solid #eee;

    border-right: 1px solid #ccc;

    border-bottom: 1px solid #ccc;

    background: #f9f9f9;

}



#cpanel img  { padding: 8px 0; margin: 0 auto; }

#cpanel span { display: block; text-align: center; }



/** Icon + text div links **/



.smallicon {

    height: 75px;

    width: 85px;

    text-align: center;

    font-size: 110%;

    line-height: 100%;

    float: left;

    padding: 0px;

    margin: 2px;

}



.smallicon a, .smallicon a:visited {

    display: block;

    float: left;

    border: 1px solid #f0f0f0;

    height: 75px;

    width: 85px;

    vertical-align: middle;

    font-size: 110%;

    line-height: 100%;

    text-decoration: none;

    padding: 0px;

    margin: 0px;

    background: #fffef3;

}



.smallicon a:hover {

    border-left: 1px solid #eee;

    border-top: 1px solid #eee;

    border-right: 1px solid #ccc;

    border-bottom: 1px solid #ccc;

    background: #f9f9f9;

}



.smallicon img  { padding: 2px 0; padding-bottom: 3px; margin: 0 auto;  }

.smallicon span { display: block; text-align: center; }







/**

* Styles for the Creative Commons Drop down

*/

option.copyright {padding-left:90px;background-image: url(icons/creativecommons_v3/copyright.gif);background-repeat: no-repeat; }

option.by {padding-left:90px;background-image: url(icons/creativecommons_v3/by.gif);background-repeat: no-repeat;}

option.by-sa {padding-left:90px;background-image: url(icons/creativecommons_v3/by-sa.gif);background-repeat: no-repeat;}

option.by-nd {padding-left:90px;background-image: url(icons/creativecommons_v3/by-nd.gif);background-repeat: no-repeat;}

option.by-nc {padding-left:90px;background-image: url(icons/creativecommons_v3/by-nc.gif);background-repeat: no-repeat;}

option.by-nc-sa {padding-left:90px;background-image: url(icons/creativecommons_v3/by-nc-sa.gif);background-repeat: no-repeat;}

option.by-nc-nd {padding-left:90px;background-image: url(icons/creativecommons_v3/by-nc-nd.gif);background-repeat: no-repeat;}

option.gnu-fdl {padding-left:90px;background-image: url(icons/creativecommons_v3/gnu-fdl.gif);background-repeat: no-repeat;}

option.by-sa_gnu-fdl {padding-left:90px;background-image: url(icons/creativecommons_v3/by-sa_gnu-fdl.gif);background-repeat: no-repeat;}





/**

* BEGIN: Styles for the FEED parser

*/

.feedhopper {

    height: 400px;

    overflow: scroll;

}

/**

* END: Styles for the FEED parser

*/


/**
* BEGIN: Styles for the wiki diff
*/
.diff_add {
    background-color:#AAFFAA;
    font-weight:bold
}
.diff_remove {
    background-color:#FFAAAA;
    font-weight:bold
}
/**
* END: Styles for the wiki diff
*/

/**
* BEGIN: Styles for wiki tables
*/

.wiki_table {
    border-collapse: collapse;
    border: 2px ridge black;
}
.wiki_td {
    border: 2px ridge black; padding: 2px;
}
.wiki_th {
    border: 2px ridge black; padding: 2px;
}
/**
* END: Styles for the wiki tables
*/

/**
* BEGIN: Styles for wiki lists
*/

.wiki_ul {
    list-style: disc inside none;
}
.wiki_ol {
    list-style:decimal inside none;
}
/**
* END: Styles for the wiki lists
*/



/*

Styles for the Modern Brick Menu
Credits: Dynamic Drive CSS Library
http://www.dynamicdrive.com/style/csslibrary/item/modern-bricks-menu/
*/

#modernbricksmenu{
    padding: 0;
    width: 100%;
    background: transparent;
    voice-family: "\"}\"";
    voice-family: inherit;
}

#modernbricksmenu ul{
    font: bold 11px Arial;
    margin:0;
    margin-left: 40px; /*margin between first menu item and left browser edge*/
    padding: 0;
    list-style: none;
}

#modernbricksmenu li{
    display: inline;
    margin: 0 2px 0 0;
    padding: 0;
    text-transform:uppercase;
}

#modernbricksmenu a{
    float: left;
    display: block;
    color: white;
    margin: 0 1px 0 0; /*Margin between each menu item*/
    padding: 5px 10px;
    text-decoration: none;
    letter-spacing: 1px;
    background-color: black; /*Default menu color*/
    border-bottom: 1px solid white;
}

#modernbricksmenu a:hover{
    background-color: gray; /*Menu hover bgcolor*/
}

#modernbricksmenu #current a{ /*currently selected tab*/
    background-color: #CC0000; /*Red color theme*/
    border-color: #CC0000; /*Red color theme*/
}

#modernbricksmenuline{
    clear: both;
    padding: 0;
    width: 100%;
    height: 5px;
    line-height: 5px;
    background: #CC0000; /*Red color theme*/
}

/*
    END - Styles for the Modern Brick Menu
*/


ul.bookmarkedpages li {
    background-image:url('icons/pushpin.gif');
    background-repeat: no-repeat;
}

#cmsnavigation li {
    background-image: none;
    margin-left: 0;
    padding-left: 5px;
}

/*

YAHOO User Interface CSS

*/

/*

h1 {
    /*18px via YUI Fonts CSS foundation* /
    font-size:138.5%;
}
h2 {
    /*16px via YUI Fonts CSS foundation* /
    font-size:123.1%;
}
h3 {
    /*14px via YUI Fonts CSS foundation* /
    font-size:108%;
}
h1,h2,h3 {
    /* top & bottom margin based on font size * /
    margin:1em 0;
}
h1,h2,h3,h4,h5,h6,strong {
    /*bringing boldness back to headers and the strong element* /
    font-weight:bold;
}
abbr,acronym {
    /*indicating to users that more info is available * /
    border-bottom:1px dotted #000;
    cursor:help;
}
em {
    /*bringing italics back to the em element* /
    font-style:italic;
}
blockquote,ul,ol,dl {
    /*giving blockquotes and lists room to breath* /
    margin:1em;
}
ol,ul,dl {
    /*bringing lists on to the page with breathing room * /
    margin-left:2em;
}
ol li {
    /*giving OL's LIs generated numbers* /
    list-style: decimal outside;
}
ul li {
    /*giving UL's LIs generated disc markers* /

}
dl dd {
    /*giving UL's LIs generated numbers* /
    margin-left:1em;
}
th,td {
    /*borders and padding to make the table readable* /

    padding:.5em;
}
th {
    /*distinguishing table headers from data cells* /
    font-weight:bold;
    text-align:center;
}
caption {
    /*coordinated marking to match cell's padding* /
    margin-bottom:.5em;
    /*centered so it doesn't blend in to other content* /
    text-align:center;
}
p,fieldset,table {
    /*so things don't run into each other* /
    margin-bottom:1em;
}
*/
/*

END - YAHOO User Interface CSS

*/


/*

WebPresent Styles

*/
ul.presentationslides
{
    list-style-type: none;
    margin: 0;
    padding: 0;
}

ul.presentationslides li
{
    display: inline;
    margin: 0;
    padding: 0;
    background-image: none;
    float: left;
    margin-right: 10px;
    width: 162px;
    overflow: hidden;
    white-space: nowrap;
}

ul.presentationslides li img
{
    border: 1px solid #000;
}


/*

Styles for a timepicker

*/
select.timepicker, select.timepicker option { text-align:right;}

img.storyimage {
	float: left;
	margin-right: 5px;
	
}

.newsblock {
	width: 120px;
	margin-right: 10px;
	
	float: left;
	text-align: center;
	
}

.newsblockimage {
	height: 100px;
	vertical-align: text-bottom;
	
}


#breadcrumbs {
    clear:both;
}

#tooliconslist {
    float:right;
    padding-right: 10px;
}

#tooliconslist div {

    display: inline;
}


ul.htmlliststyle {
    overflow: auto;
    padding-bottom: 5px;
}

ul.htmlliststyle li {
    white-space: nowrap;
    background: transparent url("icons/text.gif") no-repeat 6px 0 ;
}

/* Calendar Table */
table.calendarTable {
    width: 100%;
}

/* Month Name*/
table.calendarTable thead.monthName {
    font-size: larger;
}

/* Each */
table.calendarTable td {
    height: 100px;
    vertical-align: top;
    width: 14%;
}

th.sunday, th.saturday {
    background-color: #C15C5C;
    color: #FFFFFF;
}

th.monday, th.tuesday, th.wednesday, th.thursday, th.friday {
    background-color: #C15C5C;
    color: #FFFFFF;
}

td.sunday, td.saturday {
    background-color: #D4D4D4;
}

td.monday, td.tuesday, td.wednesday, td.thursday, td.friday {
    background-color: #F7F7F7;
}

td.otherday_sunday, td.otherday_saturday {
    background-color: #FFFFFF;
}

td.otherday_monday, td.otherday_tuesday, td.otherday_wednesday, td.otherday_thursday, td.otherday_friday {
    background-color: #EEEEEE;
}


.bigDayNum {
    font-size: 200%;
    font-weight: bolder;
}

div.daynum {
    background-color: #A2A3AE;
    color: #FFFFFF;
    padding: 2px;
    font-weight: bold;
}

div.today {
    background-color: #31528E;
    color: #FFFF00;
}

li.event_user {
    background: url(calendar/event_user.gif) no-repeat 8px 5px;
}

li.event_context {
    background: url(calendar/event_context.gif) no-repeat 8px 5px;
}

li.event_site {
    background: url(calendar/event_site.gif) no-repeat 8px 5px;
}

li.event_other {
    background: url(calendar/event_other.gif) no-repeat 8px 5px;
}

div.eventlist {
    padding-bottom: 20px;
    padding-left: 40px;
    min-height: 40px;
}

div.event_user {
    background: url(calendar/user.gif) no-repeat;
}

div.event_context {
    background: url(calendar/context.gif) no-repeat;
}

div.event_site {
    background: url(calendar/site.gif) no-repeat;
}

div.event_other {
    background: url(calendar/othercontext.gif) no-repeat;
}

table.eventslist { border: 1px solid #000;}
table.eventslist td { border: 1px solid #000; padding: 4px;}


/** COLOR BOXES TO GO WITH THE COLORBOXES FILTER */

.colorbox {
    margin-top:1em;
    margin-bottom:1em;
    margin-left: 30px;
    margin-right: 30px;
    padding:0 0.5em;
    -moz-border-radius: 8px;
    border-radius: 8px;
    color: #000;
}
.greenbox {
    border:1px solid #98be10;
    background:#f6feda;
}

.yellowbox {
    border:1px solid #F2FF00;
    background:#FBFDDB;
}
.redbox {
    border:1px solid #FF4232;
    background: #FFD2CE;
}
.bluebox {
    border:1px solid #110AFA;
    background: #DEDDFD;
}
.pinkbox {
    border:1px solid #DB00DC;
    background: #FFDFFF;
}
.purplebox {
    border:1px solid #920CEF;
    background: #F2DFFF;
}
.orangebox {
    border:1px solid #FF9E06;
    background: #F6DBB8;
}
.greybox {
    border:1px solid #A2A2A2;
    background: #F0F0F0;
}
.bwbox {
    border:1px solid #000;
    background: #fff;

}
.wbbox {
    border:1px solid #fff;
    background: #000;
    color: #fff;
}




#stepmenu {
    display: block;
}
#stepmenu li{
    height:71px;
    list-style:none;
    float:left;
    background-color:#EBEBEB;
    background-image: url(stepmenu/navBtn.gif);
    background-repeat: no-repeat;
    background-position: right top;
    margin: 0;
    line-height: 110%;
}

#stepmenu li.current{
    background-color:#C36615;
    background-image: url(stepmenu/navCurrentBtn.gif);
}

#stepmenu li.lastdone{
    background-color:#7C8437;
    background-image: url(stepmenu/navLastDoneBtn.gif);
}

#stepmenu li.done{
    background-color:#7C8437;
    background-image: url(stepmenu/navDoneBtn.gif);
}

#stepmenu li a, #stepmenu li a:link, #stepmenu li a:visited, #stepmenu li a:hover, #stepmenu li a:active {
color:#ccc;
}

#stepmenu li.lastdone a, #stepmenu li.lastdone a:link, #stepmenu li.lastdone a:visited, #stepmenu li.lastdone a:hover, #stepmenu li.lastdone a:active, #stepmenu li.current a, #stepmenu li.current a:link, #stepmenu li.current a:visited, #stepmenu li.current a:hover, #stepmenu li.current a:active, #stepmenu li.done a, #stepmenu li.done a:link, #stepmenu li.done a:visited, #stepmenu li.done a:hover, #stepmenu li.done a:active {
color:#fff;
}

#stepmenu li.done a:hover, #stepmenu li.lastdone a:hover  {
color:#FFFF99;
cursor:hand;
}

#stepmenu li a em{

display:block;
margin:6px 0 0 10px;
font-style:normal;
font-weight:bold;
}

#stepmenu li a span{

display:block;
margin-left:10px;
font-weight:normal;
}

#stepmenu li.mainNavNoBg{
background-image:none;
}

#stepmenu li a{
height:71px;
display:block;
}

/* #stepmenu.fiveStep */
#stepmenu.stepmenu5 li{width:182px;}
#stepmenu.stepmenu5 li a{width:182px;}

/* #stepmenu.fourStep */
#stepmenu.stepmenu4 li{width:227px;}
#stepmenu.stepmenu4 li.mainNavNoBg{width:229px;}
#stepmenu.stepmenu4 li a{width:227px;}

/* #stepmenu.threeStep */
#stepmenu.stepmenu3 li{width:303px;}
#stepmenu.stepmenu3 li.mainNavNoBg{width:304px;}
#stepmenu.stepmenu3 li a{width:303px;}

/* #stepmenu.twoStep */
#stepmenu.stepmenu2 li{width:455px;}
#stepmenu.stepmenu2 li a{width:455px;}


/* Styles needed for managing blocks in context and postlogin*/
.blockoptions { text-align: right; }
#editmode {padding: 20px; text-align:center; }

/* Styles for an alert box */
#facebox .b {
  background:url(alertbox/b.png);
}

#facebox .tl {
  background:url(alertbox/tl.png);
}

#facebox .tr {
  background:url(alertbox/tr.png);
}

#facebox .bl {
  background:url(alertbox/bl.png);
}

#facebox .br {
  background:url(alertbox/br.png);
}

#facebox {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 100;
  text-align: left;
}

#facebox .popup {
  position: relative;
}

#facebox table {
  margin: auto;
  border-collapse: collapse;
}

#facebox .body {
  padding: 10px;
  background: #fff;
  width: 600px;
}

#facebox .loading {
  text-align: center;
}

#facebox .image {
  text-align: center;
}

#facebox img {
  border: 0;
}

#facebox .footer {
  border-top: 1px solid #DDDDDD;
  padding-top: 5px;
  margin-top: 10px;
  text-align: right;
}

#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {
  height: 10px;
  width: 10px;
  overflow: hidden;
  padding: 0;
}

/* column container */
.colmask {
    position:relative;		/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
    clear:both;
    float:left;
    width:100%;				/* width of whole page */
    overflow:hidden;		/* This chops off any overhanging divs */
}
/* holy grail 3 column settings */
.holygrail {
    background:#fff;    	/* Right column background colour */
}
.holygrail .colmid {
    float:left;
    width:200%;
    margin-left:-250px; 	/* Width of right column */
    position:relative;
    right:100%;
    background:#fff;    	/* Centre column background colour */
                              
    /* If desired, add left border of right column here*/
    border-right: 1px solid #F4F4F4; 
}
.holygrail .colleft {
    float:left;
    width:100%;
    margin-left:-50%;
    position:relative;
    left:500px;         	/* Left column width + right column width */
    background:#FFF;    	/* Left column background colour */
    
    /* If desired, add right border of left column here*/
    border-right: 1px solid #F4F4F4; 
}
.holygrail .col1wrap {
    float:left;
    width:50%;
    position:relative;
    right:250px;        	/* Width of left column */
    padding-bottom:1em; 	/* Centre column bottom padding. Leave it out if it's zero */
}
.holygrail .col1 {
    margin:0 260px;     	/* Centre column side padding:
                            Left padding = left column width + centre column left padding width
                            Right padding = right column width + centre column right padding width */
    position:relative;
    left:200%;
    overflow:hidden;
}


.holygrail .col2 {
    float:left;
    float:right;			/* This overrides the float:left above */
    width:230px;        	/* Width of left column content (left column width minus left and right padding) */
    position:relative;
    right:10px;         	/* Width of the left-had side padding on the left column */
}
.holygrail .col3 {
    float:left;
    float:right;			/* This overrides the float:left above */
    width:230px;        	/* Width of right column content (right column width minus left and right padding) */
    margin-right:30px;  	/* Width of right column right-hand padding + left column left and right padding */
    position:relative;
    left:50%;
}

/* 2 column left menu settings */
.leftmenu {
    background:#FFF; /* left column color */
}
.leftmenu .colright {
    float:left;
    width:200%;
    position:relative;
    left:230px; /* total width of left */
    background:#fff; /* middle column color */
    
     /* If desired, add right border of left column here*/
    border-left: 1px solid #F4F4F4; 
}
.leftmenu .col1wrap {
    float:right;
    width:50%;
    position:relative;
    right:230px; /* total width of left */
    padding-bottom:1em;
    
   
}
.leftmenu .col1 {
    margin:0 10px 0 240px; /* right margin
                             total left width + margin
                             */
    position:relative;
    right:100%;
    overflow:hidden;
    
    
}
.leftmenu .col2 {
    float:left;
    width:210px; /* Inner Width*/
    position:relative;
    right:220px; /* Inner Width + margin */
    
    
}
    
.col1, .col2, .col3 {
    padding-top: 10px;
}