
/* 775 by 363 */

body {
    background-color: #000000;
    font-family: 'Inconsolata', sans-serif;
    color: #fff;

}

div {
    /*border: 1px solid #333333;*/

}

.clear {
    clear: both;

}

/*
#container {
    width: 1900px;
    height: 700px;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position:absolute;

}
*/
#logo-efc{
    width: 1450px;
    height: 100px;
    position:absolute;
    color: #00eeee;
    font-size: 24px;
}

#boardroom {
    width: 1450px;
    height: 800px;
    position:absolute;
}


#bottom-border {
    position:absolute;
    top: 875px;
    width: 0px;
    height: 1px;
    margin: 0;
    padding: 0;
    border-top: 1px solid #333;
}

.header{
    color: #fff;
    text-transform:capitalize;
    margin-bottom: 10px;
    padding: 3px;
    border-top: 3px solid #FFCC00;
    border-bottom: 1px solid #FFCC00;
    white-space: nowrap;
    overflow: hidden;
}

.header:before{
    content: "";
    display: block;
    position: absolute;
    left: 0px;
    top: 25px;
    width: 100%;
    height: 3px;
    background: #FFCC00;

}

.header-other{
    border-color: #00EEEE;
}

.header-other:before{
    content: "";
    display: block;
    position: absolute;
    left: 0px;
    top: 25px;
    width: 100%;
    height: 3px;
    background: #00EEEE;

}

.header-other2{
    border-color: #FF9933;
}

.header-other2:before{
    content: "";
    display: block;
    position: absolute;
    left: 0px;
    top: 25px;
    width: 100%;
    height: 3px;
    background: #FF9933;

}

#globalization{
    position: absolute;
    top: -10px;
    left: -10px;
    width: 0px;
    overflow: hidden;
    background: hsla(0, 0%, 0%, 0.45);
    height: 700px;

}

#satbar {
    margin-bottom: 20px;
}

.location-slider {
    font-size: 8pt;
    color: #000;
    border-bottom: 2px solid #333;
    margin-bottom: 15px;
    width: 0px;
    height: 34px;
    overflow: hidden;
    white-space: nowrap;
}

.location-name {
    margin: 0;
    padding: 0;
}

.location-area {
    background-color: #ffcc00;
    padding: 0 2px;
}

.location-area.other {
    background-color: #00eeee;
}

.location-city {
    padding: 0 2px;
    color: #ffcc00;
    float: right;
}

.location-line{
    margin-top: 10px;
    border-bottom: 1px solid #00eeee;

}
.location-slider ul {
    margin: 0;
    padding-left: 15px;
    position: relative;
    top: -12px;
    height: 10px;
    list-style-type:disc;
}

.location-slider li {

    color: #00eeee;
    font-size: 16px;
    margin-bottom: -6px;
    width: 5px;
    float: left;
    height:30px;
    /*display: inline-block;*/

}

.location-gap {
    margin-top: 60px;

}

#logo {
    position: absolute;
    bottom: 40px;
    width: 180px;
    height: 100px;
}

#logo-cover-up {
    position: absolute;
    top: 32px;
    height: 58px;
    left: 10px;
    width: 160px;
    background-color: #000;
}

#logo-cover-side-1 {
    position: absolute;
    top: 90px;
    height: 20px;
    left: 10px;
    width: 160px;
    background-color: #000;
}

#logo-cover-side-2 {
    position: absolute;
    top: 25px;
    height: 8px;
    left: 10px;
    width: 160px;
    background-color: #000;
}

#globe{
    position:absolute;
    width:600px;
    height:650px;
    left: 190px;
    top: 0;
}

#globe-footer{
    position:absolute;
    height:55px;
    top: 820px;
    left: 430px;
    overflow: hidden;
}

.footer-bar{
    width: 1px;
    height: 200px;
    border-left: 1px solid #333;
    float:left;
    margin-right:15px;
    margin-top:100px;
}

#globe-footer a{
    padding-top:5px;
    float:left;
    margin-right: 30px;
}

#globe-footer img{
    opacity: 0;
}

#fullscreen-image {
    width: 25px;
}

#keyboard-image {
    width: 40px;
}

#logout {

    display: inline-block;
    font-size: 18pt;
}

#infect {

    display: inline-block;
    font-size: 18pt;
}


#user-interaction{
    position: absolute;
    top: 160px;
    left: 820px;
    width: 0px;
    height: 495px;
    overflow: hidden;
    background: hsla(0, 0%, 0%, 0.45);
}
#user-interaction-container{
    width: 600px;
    height: 100%;
}
#user-interaction h3{
    padding: 4px;
    font-size: 3pt;
    margin: 0px;
}

#interaction {
    padding: 2px 8px;
    margin-top:6px;
    float: left;
    border-right: 1px solid #333;
    width: 286px;
    height: 445px;
    font-size: 10px;
    overflow: hidden;
}

.interaction-data {
    padding: 1px 5px;
    white-space: nowrap;
    color: #00eeee;
    padding: 0px;
    margin: 5px;
}

.interaction-data li {
    display: inline-block;
    padding: 0px;
    padding-right: 10px;
    font-size: 10px;
    line-height: 1em;
}

.interaction-username {
    color: #fff;
}

.interaction-title {
    color: #00eeee;
}

.interaction-type {
    color: #ffcc00;
}

.interaction-size {
    color: #fff;
}

.interaction-popularity {
    color: #00eeee;
}

.interaction-popular {
    color: #00eeee;
    margin-left: -15px;
    padding: 0;
    margin-right: 0;
}


#interaction-overlay {
    position:absolute;
    width: 296px;
    height: 200px;
    bottom: 0px;
    background: -webkit-linear-gradient(transparent, #000); /* For Safari */
    background: -o-linear-gradient(transparent, #000); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(transparent, #000); /* For Firefox 3.6 to 15 */
    background: linear-gradient(transparent, #000); /* Standard syntax */
}
#cube {
    position: absolute;
    left: 302px;
    width: 290px;
    height: 225px;
    border-bottom: 1px solid #333;
    padding:4px;
}
#cube-labels {
    position: absolute;
    bottom: 5px;
    left: 5px;
    font-size: 4pt;
    padding: 0;
    margin: 0;
}

#cube-labels div {
    margin: 3px 0 0 0;
    padding:0 0 0 3px;
}

#cube-label-1{
    border-left: 42px solid #00eeee;
}
#cube-label-2{
    border-left: 10px solid #ffcc00;
}
#cube-label-3{
    border-left: 25px solid #aaa;
}

#swirls {
    position: absolute;
    bottom: 0;
    height: 225px;
    width: 290px;
    left: 305px;
}

#growth{
    position: absolute;
    /*top: 750px;*/
    top: 670px;
    left: 820px;
    width: 0px;
    height: 195px;
    overflow: hidden;
    background: hsla(0, 0%, 0%, 0.45);
}
#growth-container{
    width: 600px;
    height: 100%;
}

#ticker {
    float: left;
    width: 90px;
    height: 105px;
    margin-top: 10px;
    margin-left: 10px;
    color: #fff;
}

#ticker-text{
    margin: 0px;
    padding: 0px;
    font-weight:bold;
    font-size: 18pt;
    line-height: 17pt;
    margin-top: 8px;
}
#ticker-subtext{
    margin: 0px;
    vertical-align: top;
    padding: 0px;
    font-size: 10pt;
    display: inline-block;
    width: 34px;
}

#ticker-lines{
    display: inline-block;
    vertical-align: top;
    width: 34px;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
    margin-top: 2px;
    margin-left: -5px;
}
.ticker-line{
    margin: 0;
    padding: 0;
    font-size: 3px;
    border-left: 20px solid #00eeee;
    background-color: #666;
}

#ticker-value{
    font-size: 18pt;
    font-weight: bold;
    margin-top: 10px;
}
#ticker-ytd{
    font-size: 8pt;
    border-bottom: 1px solid #333;
    padding-bottom: 10px;
    margin-right: 18px;
    margin-bottom: 5px;
}

#ticker-line-1{
    border-left: 8px solid #00eeee;
    margin-bottom: 2px;
    
}

#stock-chart
{
    position: absolute;
    top: 50px;
    left: 105px;
    width: 496px;
    height:105px; 
    overflow: hidden;
}
#stock-chart canvas {

}

#stock-chart div {
    position: absolute;
    top: 0px;
    left: -2px;
    width: 0px;
    overflow: hidden;
    height: 105px;
    border-right: 1px solid #ffcc00;
}

#stock-chart div canvas{
    margin-left: 2px;

}

#stock-subcharts
{
    position: absolute;
    top: 161px;
    left: 110px;
    border: 0px;
    color: #fff;
    width: 500px;
    height: 28px;


}

.stock-subchart{
    display: block;
    float: left;
    width: 100px;
    height: 25px;
    overflow: hidden;
}

.stock-subchart-label{
    display: inline-block;
    font-size: 5pt;

}

.stock-subchart-chart{
    display: inline-block;
    width: 60px;
    height: 25px;
    opacity: .3;

}

.stock-subchart-chart:hover{
    opacity: 1;

}

.stock-subchart-bar{

    float: left;
    background-color: #000;
    width: 3px;
    margin-left: 1px;
    height: 20px;
    border-bottom: 10px solid #00eeee;
}

.stock-subchart-bar.subchart-5{
    height: 20px;
    border-bottom: 5px solid #00eeee;


}
.stock-subchart-bar.subchart-10{
    height: 15px;
    border-bottom: 10px solid #00eeee;
}
.stock-subchart-bar.subchart-15{
    height: 10px;
    border-bottom: 15px solid #00eeee;
}
.stock-subchart-bar.subchart-20{
    height: 5px;
    border-bottom: 20px solid #00eeee;
}

.stock-subchart-bar.subchart-yellow{
    border-color: #ffcc00;
}
.stock-subchart-bar.subchart-white{
    border-color: #aaa;
}

#media{
    position: absolute;
    /*top: 611px;
    left: 820px;*/
    top: 0px;
    left: 820px;
    width: 0px;
    height: 250px;
    overflow: hidden;
}
#media-container{
    width: 600px;
    height: 100%;
}


.media-box{
    float: left;
    width: 500px;
    height: 100px;
    padding: 3px;
    margin: 5px;
    border: 1px solid #00eeee;
}

.user-pic{
    position: relative;
    margin: 5px;
    height: 89px;
    width: 89px;
    float: left;
    cursor: pointer;

}
#media-bottom .user-pic{
    float: right;
}
 

.user-pic.larger{
    height: 184px;
    width: 184px;
}
.user-pic span{
    display: box;
    position: absolute;
    bottom: 0px;
    background: hsla(0, 0%, 100%, 0.45);
    color: #000;
    width: 100%;
    font-size: 10px;
    text-align: center;
}

.user-pic.larger span{
    font-size: 13px;
    text-align: center;
}


.media-blinkies{
    float: left;
    height: 200px;
    width: 50px;
    color: #fff;
    font-size: 4px;
    overflow:hidden;
}

.media-blinkies h3{
    margin-top: 5px;
    padding: 0px;
    font-size: 4px;
}

.media-blinkies .bar{
    border-left: 20px solid #fff;
    margin-top: 2px;
    padding-left: 3px;

}

.blinkies-big-number{
    display: inline-block;
    width: 35px;
    font-size: 50px;
    text-align: center;
    line-height: 40px;
}
.blinkies-big-label{
    display: inline-block;
    width: 35px;
    font-size: 6px;
    text-align: center;
}
.blinkies-small-number{
    display: inline-block;
    width: 10px;
    font-size: 20px;
    text-align: center;
    line-height: 20px;
}
.blinkies-small-label{
    display: inline-block;
    width: 10px;
    font-size: 6px;
    text-align: center;
}

.bar.border-10{
    border-left: 20px solid #fff;
}
.bar.border-20{
    border-left: 20px solid #fff;
}
.bar.border-25{
    border-left: 25px solid #fff;
}
.bar.border-30{
    border-left: 30px solid #fff;
}
.bar.border-35{
    border-left: 35px solid #fff;
}
.bar.border-40{
    border-left: 40px solid #fff;
}
.bar.border-blue{
    border-color: #00eeee;
}
.bar.border-yellow{
    border-color: #ffcc00;
}
.bar.border-white{
    border-color: #fff;
}
.bar.last{
    margin-bottom: 10px;

}

.media-info{
    padding-top: 3px;
    margin:0 5px;
    font-size: 6px;
    color: #fff;
    float: left;
    width: 500px;
    border-bottom: 1px solid #aaa;
    margin-bottom: 10px;
    opacity: .4;
}

.media-info span{

    padding-right: 30px;

}

#timer{
    position: absolute;
    top: 670px;
    /* left: 820px; */
    width: 0px;
    height: 235px;
    overflow: hidden;
}

#clock {
    float: left;
    font-size: 40px;
    color: #AAA;
    overflow: hidden;
    margin-top:0px;
    margin-left:10px;
}

/*
#globe-footer-reveal{
position:absolute;
width:600px;
height:35px;
top: 665px;
left: 190px;
}
 */



#clockbar {
    overflow: hidden;
    height: 135px;
}
#simpleclock {
    float: left;
    margin-top: 0px;
    margin-left: 55px;
}


