/* Tree Chart CSS */
.tree ul {
    padding-top: 20px; position: relative;
	
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
}

.tree li {
	float: left; text-align: center;
	list-style-type: none !important;
	position: relative;
	padding: 20px 5px 0 5px !important;
	transition: all 0.5s !important;
	-webkit-transition: all 0.5s !important; 
	-moz-transition: all 0.5s !important;
}

/*We will use ::before and ::after to draw the connectors*/

.tree li::before, .tree li::after{
	content: '';
	position: absolute; top: 0; right: 50%;
	border-top: 2px solid #666;
	width: 50%; height: 20px;
}
.tree li::after{
	right: auto; left: 50%;
	border-left: 2px solid #666;
}

/*We need to remove left-right connectors from elements without 
any siblings*/
.tree li:only-child::after, .tree li:only-child::before {
	display: none;
}

/*Remove space from the top of single children*/
.tree li:only-child{ padding-top: 0;}

/*Remove left connector from first child and 
right connector from last child*/
.tree li:first-child::before, .tree li:last-child::after{
	border: 0 none;
}
/*Adding back the vertical connector to the last nodes*/
.tree li:last-child::before{
	border-right: 2px solid #666;
	border-radius: 0 5px 0 0;
	-webkit-border-radius: 0 5px 0 0;
	-moz-border-radius: 0 5px 0 0;
}
.tree li:first-child::after{
	border-radius: 5px 0 0 0;
	-webkit-border-radius: 5px 0 0 0;
	-moz-border-radius: 5px 0 0 0;
}

/*Time to add downward connectors from parents*/
.tree ul ul::before{
	content: '';
	position: absolute; top: 0; left: 50%;
	border-left: 2px solid #666;
	width: 0; height: 20px;
}

.tree li span{
	border: 1px solid #C2790A;
	padding: 15px;
	text-decoration: none;
	color: #000;
	font-family: arial, verdana, tahoma;
	font-size: 18px;
	display: inline-block;
	background-color: #F69B11;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
}

/*PIE Chart CSS*/

 .list-text {margin-top:100px; font-size: 25px;}
.reappie-chart {
    border: 1px solid #c0c0c0;
}



/* line 20, ../sass/pizza.scss */
[data-pie-id] li:nth-child(1) {
  color: #1F4E79;
}

/* line 20, ../sass/pizza.scss */
[data-pie-id] li:nth-child(2) {
  color: #BDD7EE;
}

/* line 20, ../sass/pizza.scss */
[data-pie-id] li:nth-child(3) {
  color: #FFC000;
}

/* line 20, ../sass/pizza.scss */
[data-pie-id] li:nth-child(4) {
  color: #92D050;
}

#pie-chart{ border:1px solid #c0c0c0;}


ul.reappie li {
    list-style: none !important;
    margin: 0 0 14px 0;
    font-size: 16px;
}

.reappie span {
    border-radius: 6px;
    padding: 5px;
}

.reappie em {
    color: #000;
    font-style: normal;
}

.darkblue {
    background-color: #1F4E79;
}

.lightblue {
    background-color: #BDD7EE;
}

.yellow {
    background-color: #FFC000;
}

.green {
    background-color: #92D050;
}

.alert-banners article.node--type-alert-banner[data-alert-type="Announcement"]
{
    background: #7f0808 ;
    color: #fff !important;
}



/* /node/127, /grants-and-funding -- Start */
        .chart-tooltip {
        position: relative;
        display: inline-block;
        cursor: context-menu;
        }

        /* Tooltip text */
        .chart-tooltip .chart-tooltiptext {
        visibility: hidden;
        width: 200px;
        background-color: #ffe69b;
        color: #000;
        text-align: center;
        border-radius: 6px;
        padding: 10px 0;
        
        /* Position the tooltip text - see examples below! */
        position: absolute;
        z-index: 1;
        bottom: 150%;
        left: 50%;
        margin-left: -60px; /* Use half of the width (120/2 = 60), to center the tooltip */
        }

        /* Show the tooltip text when you mouse over the tooltip container */
        .chart-tooltip .chart-tooltiptext::after {
        content: "";
        position: absolute;
        top: 100%;
        left: 50%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid;
        border-color: #ffe69b transparent transparent transparent;
        }

        .chart-tooltip:hover .chart-tooltiptext {
        visibility: visible;
        }

        #gf-chart {
            margin: 0 auto;
            padding: 0 50px;
            font-size: 14px;
            /* min-width: 550px !important; */ 
            border: 1px solid #c0c0c0;
        }

        #gf-chart p {
            font-size: 20px;
        }


        #gf-chart .note {
            font-size: 0.8em;
            font-weight: 600 !important;
            color: #1B548E;
        }

        #gf-chart .footerNote {
            color: #545454;
            font-size: 1em;
            font-weight: 400;
        }

        .chart-info {
            text-align: center;
        }

        .chart-info h2 {
            font-size: 30px;
        }

        .chart-program-chart {
            white-space: nowrap;
            clear: float;
            margin-bottom: 10px;
            font-size: 110%;
        }

        .chart-program-chart span {
            padding-left: 10px;
            font-weight:bold;
        }

        .chart-program-name {
            width: 12%;
            padding: 0px 15px 0 0;
            font-weight: 500;
        }

         .bar1, .bar2, .bar3 {
            display: inline-block;
            color: #fff;
            padding: 8px 0;
            margin-left: -3px;
 
        }
        .bar0
        {
            display: inline-block;
            padding: 8px 0;
        }
        .bar1 {
            border-top-left-radius: 25px;
            border-bottom-left-radius: 25px;
        }

        .bar3 {
            border-top-right-radius: 25px;
            border-bottom-right-radius: 25px;
        }

        .chart-blue {background-color: #1B468B;}
        .chart-orange {color: #000; background-color: #fd7723;}
        .chart-light-blue {color: #000; background-color: #92b3ea;}
        .chart-green {color: #fff; background-color: #1A8922;}

        .chart-legend {
            margin-bottom: 30px;
            text-align: center;
        }

        .chart-legend div {
            display: inline-block;
            margin: 10px 20px 0 0;
        }

        .chart-legend  ul {
            text-align: left;
            list-style: none;
        }

        .chart-legend ul li {
            padding: 0 0 6px 0;
        }

        .chart-legend span {
            padding: 2px;
            border-radius: 5px;
        }

        /* keep these total at 85% max */
        .mhp1 {width: 50% ;}
        .mhp2 {width: 15%;}
        .mhp3 {width: 20%;}

        .vhhp1 {width: 55% ;}
        .vhhp2 {width: 15%;}
        .vhhp3 {width: 15%;}

        .IIG1 {width: 45% ;}
        .IIG2 {width: 40%;}

        .serna1 {width: 35% ;}
        .serna2 {width: 20%;}
        .serna3 {width: 30%;}

        .tod1 {width: 85%;}

        .nplh1 {width: 55%;}
        .nplh2 {width: 30%;}

        .ahsc {width: 85%; text-align: center;}
        

.bar-chart-bar {
	 background-color: #e8e8e8;
	 display: block;
	 position: relative;
	 width: 100%;
	 height: 20px;
}
 .bar-gf {
	 float: left;
	 height: 100%;
}
 .bar-gf-1 {
	 background-color: green;
}
 .bar-gf-2 {
	 background-color: yellow;
}
 .bar-gf-3 {
	 background-color: red;
}
 .bar-gf-0 {
	 width: 0%;
}
 .bar-gf-1 {
	 width: 1%;
}
 .bar-gf-2 {
	 width: 2%;
}
 .bar-gf-3 {
	 width: 3%;
}
 .bar-gf-4 {
	 width: 4%;
}
 .bar-gf-5 {
	 width: 5%;
}
 .bar-gf-6 {
	 width: 6%;
}
 .bar-gf-7 {
	 width: 7%;
}
 .bar-gf-8 {
	 width: 8%;
}
 .bar-gf-9 {
	 width: 9%;
}
 .bar-gf-10 {
	 width: 10%;
}
 .bar-gf-11 {
	 width: 11%;
}
 .bar-gf-12 {
	 width: 12%;
}
 .bar-gf-13 {
	 width: 13%;
}
 .bar-gf-14 {
	 width: 14%;
}
 .bar-gf-15 {
	 width: 15%;
}
 .bar-gf-16 {
	 width: 16%;
}
 .bar-gf-17 {
	 width: 17%;
}
 .bar-gf-18 {
	 width: 18%;
}
 .bar-gf-19 {
	 width: 19%;
}
 .bar-gf-20 {
	 width: 20%;
}
 .bar-gf-21 {
	 width: 21%;
}
 .bar-gf-22 {
	 width: 22%;
}
 .bar-gf-23 {
	 width: 23%;
}
 .bar-gf-24 {
	 width: 24%;
}
 .bar-gf-25 {
	 width: 25%;
}
 .bar-gf-26 {
	 width: 26%;
}
 .bar-gf-27 {
	 width: 27%;
}
 .bar-gf-28 {
	 width: 28%;
}
 .bar-gf-29 {
	 width: 29%;
}
 .bar-gf-30 {
	 width: 30%;
}
 .bar-gf-31 {
	 width: 31%;
}
 .bar-gf-32 {
	 width: 32%;
}
 .bar-gf-33 {
	 width: 33%;
}
 .bar-gf-34 {
	 width: 34%;
}
 .bar-gf-35 {
	 width: 35%;
}
 .bar-gf-36 {
	 width: 36%;
}
 .bar-gf-37 {
	 width: 37%;
}
 .bar-gf-38 {
	 width: 38%;
}
 .bar-gf-39 {
	 width: 39%;
}
 .bar-gf-40 {
	 width: 40%;
}
 .bar-gf-41 {
	 width: 41%;
}
 .bar-gf-42 {
	 width: 42%;
}
 .bar-gf-43 {
	 width: 43%;
}
 .bar-gf-44 {
	 width: 44%;
}
 .bar-gf-45 {
	 width: 45%;
}
 .bar-gf-46 {
	 width: 46%;
}
 .bar-gf-47 {
	 width: 47%;
}
 .bar-gf-48 {
	 width: 48%;
}
 .bar-gf-49 {
	 width: 49%;
}
 .bar-gf-50 {
	 width: 50%;
}
 .bar-gf-51 {
	 width: 51%;
}
 .bar-gf-52 {
	 width: 52%;
}
 .bar-gf-53 {
	 width: 53%;
}
 .bar-gf-54 {
	 width: 54%;
}
 .bar-gf-55 {
	 width: 55%;
}
 .bar-gf-56 {
	 width: 56%;
}
 .bar-gf-57 {
	 width: 57%;
}
 .bar-gf-58 {
	 width: 58%;
}
 .bar-gf-59 {
	 width: 59%;
}
 .bar-gf-60 {
	 width: 60%;
}
 .bar-gf-61 {
	 width: 61%;
}
 .bar-gf-62 {
	 width: 62%;
}
 .bar-gf-63 {
	 width: 63%;
}
 .bar-gf-64 {
	 width: 64%;
}
 .bar-gf-65 {
	 width: 65%;
}
 .bar-gf-66 {
	 width: 66%;
}
 .bar-gf-67 {
	 width: 67%;
}
 .bar-gf-68 {
	 width: 68%;
}
 .bar-gf-69 {
	 width: 69%;
}
 .bar-gf-70 {
	 width: 70%;
}
 .bar-gf-71 {
	 width: 71%;
}
 .bar-gf-72 {
	 width: 72%;
}
 .bar-gf-73 {
	 width: 73%;
}
 .bar-gf-74 {
	 width: 74%;
}
 .bar-gf-75 {
	 width: 75%;
}
 .bar-gf-76 {
	 width: 76%;
}
 .bar-gf-77 {
	 width: 77%;
}
 .bar-gf-78 {
	 width: 78%;
}
 .bar-gf-79 {
	 width: 79%;
}
 .bar-gf-80 {
	 width: 80%;
}
 .bar-gf-81 {
	 width: 81%;
}
 .bar-gf-82 {
	 width: 82%;
}
 .bar-gf-83 {
	 width: 83%;
}
 .bar-gf-84 {
	 width: 84%;
}
 .bar-gf-85 {
	 width: 85%;
}
 .bar-gf-86 {
	 width: 86%;
}
 .bar-gf-87 {
	 width: 87%;
}
 .bar-gf-88 {
	 width: 88%;
}
 .bar-gf-89 {
	 width: 89%;
}
 .bar-gf-90 {
	 width: 90%;
}
 .bar-gf-91 {
	 width: 91%;
}
 .bar-gf-92 {
	 width: 92%;
}
 .bar-gf-93 {
	 width: 93%;
}
 .bar-gf-94 {
	 width: 94%;
}
 .bar-gf-95 {
	 width: 95%;
}
 .bar-gf-96 {
	 width: 96%;
}
 .bar-gf-97 {
	 width: 97%;
}
 .bar-gf-98 {
	 width: 98%;
}
 .bar-gf-99 {
	 width: 99%;
}
 .bar-gf-100 {
	 width: 100%;
}
 
/* /node/127, /grants-and-funding -- End */