body {
    padding-top: 40px; /* body padding for fixed top nav */
    color: #000000;
    background-color: rgba(220, 220, 220,0.05);
    font-family: ubuntu, sans-serif;
    font-size: 16px;
    height: 100%;
    margin: 80px 0px 0px 0px;
    min-width: 800px; 
    overflow-y: auto;
}


.homeform {
    padding: 10px 100px;
}
@media (max-width: 978px) {
    .homeform {
        padding: 10px 10px;
    }
}

@media (max-width: 510px) {
    .navbar-brand img {
        max-width: 200px;
        display: none
    }
    .navbar-brand span {
        display: none;
    }
}
@media (max-width: 410px) {
    .navbar-brand img {
        display: none;
        max-width: 100px;
    }
    .navbar-brand span {
        display: none;
    }
}
@media (max-width: 310px) {
    .navbar-brand img {
        display: none;
    }
    .navbar-brand span {
        display: none;
    }
}

@media (min-width: 1000px) {
    body {
        overflow-x: auto;
    }
}


html {
    height: 100%;
    margin: 0 0;
    padding: 0 0;
}

.container-body {
    min-height: 0%;
    margin: 0 0;
    padding: 0 0;
}

.container {
    width: auto;
    max-width: 1050px;

}
.container-nav {
    max-width: 1150px !important;

}
.container-page {
    margin-top: 30px;
    margin-bottom: 10px;
    padding: 20px 30px;
}

h1,h2,h3,h4,h5,h6{
    color: rgba(66, 66, 66,1);

}

.cl-white{
    color: white !important;
}


/***************** NAVBAR **************************/

.navbar {
    background-color: rgba(77,77,77,1);
    color: white;
    margin-bottom: 0px;
}
.navbar > .container .navbar-brand {
    margin: 10px 10px; 
    padding: 0 0;
}

.navbar-brand a {
    display: block;

}
.navbar-brand span {
    font-size:10px;
    font-family:ubuntu, sans-serif;
    margin-bottom: 10px;
    color: white;
}

.nav {
    margin: 0 0;
    margin-left: 20px;
    padding-top: 0px;
}
/*.navbar-form {
    margin-top: 29px;
    margin-bottom: 30px;
    margin-left: 10px;
    margin-right: 0px;
    padding-right: 0px;
}*/

.navbar-nav > li {

    font-size:20px;
    font-family:arial,helvetica;
    margin-left: 0px;
    margin-right: 0px;
}
.navbar-default .navbar-nav > li > a {
    color: white;
    padding: 37px 10px;
}

.navbar-default .navbar-nav > li > a:hover {
    background-color: white;
    color: rgba(251,133,33,1);
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    background-color: white;
    color: rgba(251,133,33,1);

}

/*.navbar-collapse .navbar-nav.navbar-right:last-child {*/
.navbar-collapse .navbar-nav.navbar-right {
    margin-right: 0px;
    font-size: 14px;
    padding: 0 0;
}


.dropdown-menu {
    background-color: rgba(77,77,77,1);    
}

.dropdown-menu > li {
    font-size:14px;
    font-family: ubuntu, sans-serif;
    margin-left: 0px;
    margin-right: 0px;
}
.dropdown-menu > li > a {
    color: white;
    padding: 2px;
}

.dropdown-menu > li > a:hover {
    background-color: white;
    color: rgba(251,133,33,1);
}

.navbar-default .navbar-nav > .open > a:focus {
    background-color: white;
    color: rgba(251,133,33,1);
}

@media (max-width: 767px) {
    .navbar-default .navbar-nav > li > a {
        padding: 0 0;
        font-size: 14px; 
    }
}

/***** ICONS *****/
.fa-blue{
    color: rgba(251,133,33,1);
}

/***** SECTION *****/
.container-rounded{
    margin-top: 30px;
    margin-bottom: 10px;
    padding: 20px 30px;
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    border-radius: 9px;
    /*IE 7 AND 8 DO NOT SUPPORT BORDER RADIUS*/
    -moz-box-shadow: 0px 0px 20px rgba(251,133,33,1);
    -webkit-box-shadow: 0px 0px 20px rgba(251,133,33,1);
    box-shadow: 0px 0px 20px rgba(251,133,33,1);
    /*IE 7 AND 8 DO NOT SUPPORT BLUR PROPERTY OF SHADOWS*/

}

.section-colored{
    background-color: rgba(251,133,33,0.4);
    color: white;
}

.section{
    padding: 10px 10px;

}

.tiny-hr hr {
    margin-top: 2px;
    margin-bottom: 6px;

}
.tiny-hr h4,h3 {
    margin-top: 20px;
    margin-bottom: 2px;

}

/***** FOOTER *****/

footer{
    padding: 5px 5px;
    margin: 0 0;
}

/************ RESULTS **********/
.hborder{
    border-bottom: 2px solid rgba(251,133,33,1);
}
.hbord{
    border-bottom: 1px solid rgba(251,133,33,1);
}
.grayed{
    background-color: #E8E8E8;
}

.row [class*="col-lg-"]{
    min-height:10px;
}
.tabbable{
    box-shadow: 0 0 7px 0 #000000;
    padding:5px;
}


/***** FORM *****/
.css-form input.ng-invalid.ng-dirty {
    background-color: #FA787E;
}

.css-form input.ng-valid.ng-dirty {
    background-color: #78FA89;
}

.css-form textarea.ng-invalid.ng-dirty {
    background-color: #FA787E;
}

.css-form textarea.ng-valid.ng-dirty {
    background-color: #78FA89;
}

/** tree-graph style **/
.node {
    font-size: 10px;
    cursor: pointer;
}

.node circle {
    fill: #fff;
    stroke: black;
    stroke-width: 1.5px;
}

.bigNode {
    fill: white;
}

.link {
    fill: none;
    stroke: rgba(251, 133, 33, 0.4);
    stroke-width: 1.5px;
}

.root {
    stroke: black;
    fill: #CE5043;
}

.surface {
    stroke: black;
    fill : #B3C833;
}

.interactor {
    stroke: black;
    fill : #1AA1E1;
    cursor: pointer
}

.svgText {
    font-size: 14px;
    stroke: black;
    fill: black;
    cursor: default
}

.dataset {
    stroke: black;
    fill : #3F5CA9;
}

/** stars **/
.golden{
    color: #cc9900
}

.silver{
    color: #858885
}

/** surfaces page **/
.fixedContainer {

    position: fixed;
    padding: 1.5em;
    /*left: 50%;*/
    top: 80px;
    /*rigth: 20%;*/
    /*transform: translateX(-50%);*/
    /*ransform: translateY(-10%);*/
    min-width: 90%;
}


.three-col {
    columns: 3;
    -webkit-columns: 3;
    -moz-columns: 3;
}

.topbar{
    display:block;
    width:100%;
    max-height:300px;
    overflow-y:auto;
}

.axis {
    font: 12px ubuntu;
}

.axis path,
.axis line {
    fill: none;
    stroke: #000;
    stroke-width: 2;
    shape-rendering: crispEdges;
}

.bpBar {
    fill: #FB8521;
    stroke: #000000;
    stroke-width: 2;
    opacity: 0.8;
}

.grid .tick {
    stroke: lightgrey;
    opacity: 0.7;
}
.grid path {
    stroke-width: 0;
}

.noValue {
    font-style: italic;
    color: #858885;
}

.spacedTd {
    padding: 0 15px 0 15px;
}

.littleSpacedTd {
    padding: 0 4px 0 4px;
}

/*Angular UI Grid*/
.myGrid {
    width: 100%;
    height: 100%;

}

.myGridShort {
    width: 100%;
    height: 20%;
}

.my-custom-menu {
    position: absolute;
}

.my-custom-menu .ui-grid-menu {
    padding: 0px;
}

.my-custom-menu .ui-grid-menu-inner {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.blackLink, .blackLink:hover {
    color: #000000;
    text-decoration: none;
}

.goGrid {
    /*min-height: 2%;*/
    /*max-height: 40%;*/
    height: 250px;
}

.twoCol {
    list-style-type: none;
    columns: 3;
    -webkit-columns: 3;
    -moz-columns: 3;
}

.spacedOl > li {
    margin-bottom: 20px;
}

.spacedOl > li > div {
    margin-top: 10px;
}

#submit-container * .row, #submit-container .row {
    margin-top: .3em;
}