/*
TODO: find out how to inherit within this file (info to have bgRed, etc..)
*/

.trace
{
    border-left: 2px solid #f55;
    border-right: 2px solid #f55;
    color: #333333;
    background-color: #ffdddd;
}
.info
{
    border-left: 2px solid blue;
    border-right: 2px solid blue;
    color: blue;
}
.error
{
    border-left: 2px solid red;
    border-right: 2px solid red;
    color: red;
}
.title
{
    font-size: large;
    text-transform: capitalize;
    text-align: center;
}
.bgYellow
{
    background-color: #EBD241;
    color: #000044;
}
.bgLiteBlue, .tabs input
{
    background-color: #E6F0FA;
    color: #0f0f00;
}
.bgRed, .tag:hover
{
    background-color: #C85A5A;
    color: #fff;
}
.bgGreen, .tabs .unselected, .tabs .unselected a
{
    background-color: #5AC873;
    color: #fff;
}
.tabs .unselected a
{
    background-color: transparent;
}
.bgGrey
{
    background-color: #dddddd;
    color: #111111;
}
.bgBlack
{
    background-color: #000000;
    color: #ffffff;
}
.bgWhite
{
    background-color: #ffffff;
    color: #000000;
}
.bgBlue, #frameRight .title, .tabs .selected, #frameBottom .title, .tabs .unselected:hover
{
    background-color: #5AA0C8;
    color: #fff;
}
.tagCloud
{
    list-style:none;
    text-align: center;
    margin:0px;
    padding:0px;
}
.tagCloud li
{
    display:inline;
    margin:0px;
    padding:5px;
}
#framePage
{
    width: 95%;
    margin: auto;
    color: #333;
    border-left: 1px solid gray;
    border-right: 1px solid gray;
    
    position: relative;
    min-height: 100%; /* For Modern Browsers */
    height: auto !important; /* For Modern Browsers */
    height: 100%; /* For IE */
}
#frameTop
{
/*
    background-image: url('img/logo.png');
    background-repeat: no-repeat;
    background-position: left top;
*/
}
#frameMiddle
{
    clear: both;
}
#frameMiddle:after
{
    clear: both;
    display: block;
    font: 1px/0px serif;
    content: ".";
    height: 0;
    visibility: hidden;
    border-bottom: 1px solid gray;
}
#frameLeft
{
    float: left;
    width: 22%;
}
#frameRight
{
    float:right;
    width: 78%;
}
#frameBottom
{
    border-top: 1px solid gray;
    width: 100%;
    position: absolute;
    left: 0%;
    bottom: 0 !important;
    bottom: -1px; /* For Certain IE widths */
}
.frameConsole
{
    position: absolute;
    vertical-align: bottom;
    text-align: left;
    overflow: auto;
    bottom: 0%;
    height: 20%;
    left: 2%;
    width: 0%;
    opacity: 0.8;
}
.buttonSwitchConsole
{
    position: absolute;
    text-align: center;
    overflow: auto;
    bottom: 0%;
    height: 20%;
    left: 1%;
    width: 1%;
}
.frameStatus
{
    position: absolute;
    vertical-align: bottom;
    text-align: center;
    overflow: hidden;
    bottom: 0%;
    left: 0%;
    width: 100%;
}
img
{
    border:0px;
}
img.preview
{
    border:1px solid #aaf;
}
img.preview:hover
{
    border:1px solid #aaf;
    background-color: #5AA0C8;
}
html
{
    margin: 0%;
    padding: 0%;
    height:100%;
}
body
{
    margin: 0%;
    padding: 0%;
    height:100%;
}
.tag
{
    background-color : transparent;
    color: #C85A5A;
    text-decoration: none;
    font-family: arial;
}
.tabs #searchButton
{
    background-color : transparent;
    color: #fff;
    margin: 0px;
    padding:0px;
    border: 0px;
}
.tabs
{
    float:right;
    width:auto;
}
.tabs .tab
{
    float:left;
    width:auto;
    padding:10px;
    height: 100%;
}
.tabs .tab a
{
    text-decoration: none;
}
.tabs .unselected
{
    margin-left:1px;
    margin-right:1px;
    border-style: solid;
    border-width: 1px 1px 0px 1px;
}
.tabs .unselected, .tabs .unselected input
{
    border-color: #005B00;
}
.tabs .selected
{
    margin-left: 1px;
    margin-right: 1px;
    border-style: solid;
    border-width: 2px 2px 0px 2px;
}
.tabs .selected, .tabs .selected input 
{
    border-color: #005782;
}
input
{
    text-align: center;
    margin: 0px;
    padding:0px;
    border-width: 1px;
    border-style: solid;
    border-color: #005782;
}
input:hover
{
    color: #ff0000;
}
div.img
{
      margin: 2px;
      border: 1px solid #5AA0C8;
      width: 120px;
      float: left;
      background-color: #fff;
}	
div.img img
{
    display: inline;
    margin: 0px;
    border: 1px solid #fff;
}
div.img img:hover
{
    border: 1px solid #5AA0C8;
}
div.img a:hover img {
    border-left: 1px solid #5AA0C8;
    border-bottom: 1px solid #5AA0C8;
}
div.desc
{
    clear:both;
    text-align: center;
    font-weight: normal;
    margin: 0px;
}
a
{
    color:#5AA0C8;
}
.selected a
{
    color:#fff;
}