
#proprietary-bar {
    background-color: #d6d6d6;
    text-align: center;
    font-weight: bold;
}

#data-info {
    text-align: center;
}

#container-full {
    padding-top: 60px;
}

#container-left {
    text-align: right;
}

.states {
  stroke: #000;
  cursor: pointer;
}

.state-borders {
  fill: none;
  stroke: #000;
  stroke-width: 1px;
  stroke-linejoin: round;
  stroke-linecap: round;
  pointer-events: none;
}

#state-info-container {
    margin-top: 30px;
}

#state-info {
    border: 2px solid #666;
    border-radius: 5px;
    padding: 0;
    text-align: left;
}

#state-info-name {
    min-height: 24px;
    color: #005376;
    font-weight: 600;
}

#state-info hr {
    width: 100%;
    border-top: 2px solid #666;
    margin-top: 0;
    margin-bottom: 5px;
}

#state-info ul {
    padding: 0;
    margin: 0;
}

#state-info span {
    font-weight: 600;
}

#spinner {

    text-align: center;
    margin-top: 15%;
}

#summary-lists,
#top-lists {
    float: right;
}

.text-left {
    text-align: left;
}

#top-partners table {
    width: 100%;
}

.btn-state {
    width: 30px;
}

#agreement-list {
    width: 100%;
    text-align: center;
    border: 2px solid #ccc;
    border-collapse: unset;
}

.agreement-col {
    color: #888;
    border-radius: 5px;
    min-width: 30px;
}

#downloads-table th,
#downloads-table td {
    text-align: center;
}

#about-table th {
    text-align: center;
}

.county-borders {
  fill: none;
  stroke: #000;
  stroke-width: 0.5px;
  stroke-linejoin: round;
  stroke-linecap: round;
  pointer-events: none;
}

/*.states path {
    transition: 500ms linear all;
}*/

.hover-in {
    fill: #f56533 !important;
    transition: none;
}

.hover-out {
    transition: 500ms linear all;
}

#tooltip {
    position: absolute;
    width: 200px;
    /*height: 130px;*/
    /*font-size: */
    background: white;
    box-shadow: 5px 5px 5px;


}

#tooltip-name {
    padding-top: 20px;
    padding-left: 15px;
    font-weight: 700;
    color:rgb(56,97,136);
}

#tooltip ul {
    padding: 0;
    padding-left:30px;
    padding-bottom: 0;
    font-weight: 700;

    color:rgb(118,113,113);
}
#tooltip li{
    padding:0;
    margin:0

}
#tooltip {
    padding: 0;
    padding-bottom: 0;
    margin:0;
    width: 220px;
    font-size: .95em;
    font-weight: 700;
}


#about-table th, 
#about-table td {
    padding: 0 10px 0 10px;
}


body { 
    padding-right: 0 !important;
    font-size: 14px;
}
header
{
    height: 40px;

    background-color: #3d3d3d;
}

#full-container
{
    border: 1px solid #ccc;
    background-color: #e9e9e9;
}

body
{
    background-color: #3d3d3d;
}

#left-container
{
    flex-wrap: wrap;
}

#story-board
{
    width: 97%;
    margin: 0 auto 5% auto;

    background-color: white;
}

#story-images0,#story-images1,#story-images2{
    border: 1px solid black;
}

div
{
    /*border:1px solid black;*/
}

ul
{
    list-style-type: none;
}

#story
{
    background-image: url('../img/storypic.jpg');
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: cover;
       -moz-background-size: cover;
         -o-background-size: cover;
            background-size: cover;
    /*align-self: center;*/
    min-height: 940px;
    flex-grow: 1;
}

#by-state-statistics{
     min-height: 850px;
}

#story-container
{
    width: 100%;
    padding-top: 5%;
    padding-right: 5%;
    padding-left: 5%;
}

footer
{
    height: 40px;

    background-color: #3d3d3d;
}

#state-list
{
    margin-bottom: 0;

    background-color: white;

    flex-grow:1;
}

a: hover{
    text-decoration: underline !important;
}

#fiscal-year-text,#fiscal-year-text-large
{
    border: 1px solid #ddd;
    padding-left:6px;
    background: white;
    font-weight: 700;
    float: right;
    margin-right: auto;
    margin-left: auto;
    font-size: 0.85em;
    width: 200px;
}


#fiscal-year-text :hover 
{
    box-shadow: 5px 5px 0  rgba(0,0,0,0);
    
}

#fiscal-year-text button
{
    margin-bottom: 10px;
    margin-left: 5px;
    padding-top: 0;
    padding-bottom: 0;
}

#map-text
{
    line-height: 1.8em;
}

#map-container
{
    width: 100%;
}

#info-button
{
    border-radius: 0;
}

#filter-text
{
    display: flex;
    color:white;
    font-size: 1.15em;
    justify-content: space-between;
}

#filter-sidebar
{
    display: none;

    height: 100%;
    padding-top: 20px;
    border: 1px solid rgb(150, 150, 150);
    background-color: #3d3d3d;
}

#filter-sidebar-overall
{
    padding-top: 20px;
    border: 1px solid rgb(150, 150, 150);
    background-color: #3d3d3d;
}

select.form-control
{
    background-color: #3d3d3d;

    -webkit-appearance: menulist;
}

#filter
{
    width: 75%;
    height: 20%;
    margin-right: auto;
    margin-bottom: 5%;
    margin-left: auto;

    text-align: center;
}

#filter select
{
    font-style: italic;
 
    height: auto;
    margin-bottom: 5px;

    cursor: pointer;
    text-align: left;

    color: white;
    border: 1px solid #ccc;
    background-color: #3d3d3d;
}

#filter option
{
    cursor: pointer;
}

#trend-extension-tab
{
    text-align: center;
    color: white;
}

#overall-trend-extension-tab
{
    height: 45px;
    margin-left: -10px;
    padding-top: 3%;
    padding-right: 3%;

    text-align: center;

    color: white;
    background-color: rgb(28, 176, 217);
}

#overall-trend-statistics
{
    position: inherit;

    width: 75%;
    margin-left: 10%;
    /*padding-top: 10%;*/
    padding-bottom: 5%;

    color: rgb(266, 266, 266);
}

#overall-summary-trend-statistics
{
    position: inherit;

    width: 75%;
    margin-left: 10%;
    /*padding-top: 15%;*/
    padding-bottom: 5%;

    color: rgb(266, 266, 266);
}

#top-agreements
{
    float: right;

    width: 95%;
}


#top-partners
{
    float: right;

    width: 95%;
}

#chart
{
    height: 400px;
}

#story-image
{
    text-align: center;
}

#overall-story-image
{
    /*text-align: center;*/
    padding-top: 0px !important;
    width: 65%;
}
.story-images
{
    padding-right: 0;
    padding-left: 0;
    cursor: pointer;
    text-align: center;
    opacity: 0.85;
    margin: 10px;
    max-height: 300px;
    background-color: white;
}

.story-images:hover
{
    /*box-shadow: 10px 10px 10px #e6f7fa;*/
    opacity: 1;
}




#story-state
{
    width: 40%;
    margin-right: auto;
    margin-bottom: 20px;
    margin-left: auto;

    text-align: center;
}

#color-table
{
    border-spacing: .2em .2em;
    border-collapse: separate;
    min-width: 35px;

}

#Agreements-info
{
    border-spacing: 0;
    border-collapse: separate;
}

#all-states
{
    float: right;
    overflow-y: auto;
    overflow-x: hidden;
    width: 95%;
    height: 1000px;
}

#all-states-agreements
{
    color: rgb(124, 209, 233);
}

#grey-title
{

    float: right;

    width: 100%;
    margin-bottom: 10px;
    padding: 5%;
    padding-left: 5%;

    background-color: rgb(242, 242, 242);
}

tspan{
    font-family: Open Sans;
    
}
.state-title
{
    font-weight: 600;

    text-decoration: none;

    color: #436079;
}

.state-title:hover
{
    cursor: pointer;
    text-decoration: underline;
}

#state-stat
{
    font-weight: 600;
    color: rgb(72, 146, 166);
    font-size: .8em;
}

#state-text
{

    color: black;
}

#selected-state-list
{
    padding-left: 10px;
}

#indiv-state-num
{
    font-weight: 600;

    color: #70a7cc;
}

#indiv-font
{
    font-weight: 600;
}

#stories
{
    display: block;

    min-height: 400px;
    padding-top: 10px;
}

#tooltip-agreements
{
    color: rgb(77, 176, 232);
}

#tooltip-partners
{
    color: rgb(77, 176, 232);
}

#tooltip-stories
{
    font-weight: 800;

    color: #ffbd2b;
}

#p-stories
{
    font-weight: 600;

    padding-left: 20px;
}

.clippier
{
    clip-path: polygon(50% 100%, 100% 80%, 100% 0, 0 0, 0 80%);
}

#story-title
{
    font-weight: 500;
    line-height: 1.5em;
    font-size:90%;
    color: black;
}

.modal-dialog
{
    position: absolute;
    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%) !important;
}

#video-bar
{
    width: 55%;
    min-height: 100%;
    margin-top: 2%;
    margin-right: 2%;
    margin-bottom: 10%;
    margin-left: 2%;
    padding-bottom: 5%;

    background: white;
}

#story-bar
{
    min-height: 800px;
    margin-top: 2%;
    margin-right: 1%;
    margin-bottom: 10%;
    margin-left: 1%;
    padding-bottom: 10%;

    background: white;
}

.videos > img
{
    width: 100%;
    opacity: 0.85;
    margin: 5%   auto;
    color:black !important;
    cursor: pointer;
}
.videos
{

    width: 75%;
    margin: 5px  auto;
    line-height: 1.5em;
    cursor: pointer;
    color:black !important;

}
#videos
{
    margin-top: 40px;
}

#images
{
    padding-top: 25px;
    min-height: 20%;
}

.pagination
{
    padding-right: auto !important;
    padding-left: auto !important;
}
#story-text
{
    overflow-y: auto;
    font-weight: 300;
    line-height: 1.5em;
    height: 200px;
}
#chevron
{
}
#chevron-text
{
    font-family: Open Sans;

    display: inline-block;

    cursor: pointer;
}

.btn-link
{
    color: #6b6b6b;
}
.btn-link:hover,
.btn-link:focus,
.btn-link:active,
.btn-link.active,
.open > .dropdown-toggle.btn-link
{
    color: #3d3d3d;
}


.btn-info
{
    background-color: #003359;
    border-color: #003359;
    font-family: Open Sans;
    color: white;

}
.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-link
{
    border-color: #001424;
    background-color: #001424;
    color: white;

}


.btn-trend{
    background-color: rgb(0, 118, 169);
    border-color: rgb(0, 118, 169)

}

.btn-trend:hover,
.btn-trend:focus,
.btn-trend:active,
.btn-trend.active,
.open > .dropdown-toggle.btn-link
{
    border-color: #005376;
    background-color: #005376;
    color: white;

}

#modal-story-header
{
    padding: 5px;

    color: black;
    border-bottom: aliceblue;
    background-color: #06c;
    box-shadow: 0 8px 4px rgba(0,0,0,.35);
}
#modal-story-header > button
{
    display: inline-block;

    width: 100%;
    margin: 0;
    padding: 0;
    padding-top: 10px;
    padding-right: 10px;
}
button > span
{
    float: right;

    margin-top: 10px;
    padding: 0;
    padding-top: 0;
    padding-right: 10px;
    padding-bottom: 0;
    padding-left: 10px;
}

.btn-link:focus, .btn-link:active {
  outline: none !important;
  box-shadow: none !important;
}



.btn:focus, .btn:active {
  outline: none !important;
  box-shadow: none !important;
}

.btn-link
{
    color: #6b6b6b;
}
.btn-link:hover,
.btn-link:focus,
.btn-link:active,
.btn-link.active,
.open > .dropdown-toggle.btn-link
{
      outline: none !important;
    box-shadow: none !important;
}

#top-spinner{
    padding:100px 0 ;
    width: 100%; 
    text-align: center;
}

#story-loader{
    text-align: center;
    display: block;
    width: 100%;

}
   
a {text-decoration: none !important;}
a:hover {text-decoration: underline !important;}
.modal {
 overflow-y: auto;
}

.modal-open {
 overflow: auto;
}


.vertical-alignment-helper {
display:table;
height: 100%;
width: 100%;
pointer-events:none;}

.vertical-align-center {
/* To center vertically */
display: table-cell;
vertical-align: middle;
pointer-events:none;}

.modal-content {
/* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
width:inherit;
max-width:inherit; /* For Bootstrap 4 - to avoid the modal window stretching 
full width */
height:inherit;
/* To center horizontally */
margin: 0 auto;
pointer-events:all;}

.wrapper{
    width:85% !important;
}

#img-story div{
    text-decoration: none;
}
}

#img-story {
    margin: 25px;
}

.hov-story:hover img{
    opacity: 1;

}

.hov-story:hover div{
    cursor: pointer;

}

#text-descr{
    display: none;
    /*line-height: 0px;*/
    font-weight:600;
}

#text-emph{
    font-size: 1.5em;
}

#map-story-title{
  color:white;
  font-style: italic;
  font-weight:600;
  font-size: 1.5em

}

#about-sandia{
    color:snl-blue; font-weight:600;
}

#sandia-ital{
color:white;
 font-style: italic;
  font-size: 1.7em;
   font-weight:600;
}

#sandia-descr{
color:white;
font-weight:600;
}

#link-partner{
    color:white !important;
    text-decoration: underline !important;

}

#featured-stories{
 font-size: 1.7em; 
 color:white; 
 font-weight: 700;   
}
#inc-text{
display: none;    
}

.bolder{
    font-weight: 600;
}

.trend-text{
    font-size: 1.3em; 
    font-weight:600
}

.trend-text-id{
    font-size: 70%;
    font-weight:400
}

#clear-filters{
    font-size: 10px;
    font-weight: 400;
}
.white{
    color:white !important;
}

#view-overall-trends{
    font-size: 75%;
}

#by-state{
  margin-top: 5%; 
  color:#506E88;  
} 

.tooltip-list{

 font-size: .75em;   
}

#tooltip-text{
    line-height: 1em; 
    margin-top:65px;
}
#all-states-states{
    color:#436079; 
    font-weight: 600; 

}

#full-story-title{
    color:#0066cc;
    font-size:24px; 
    margin-top:50px;
     color:#0066cc;
       margin-bottom: 40px
}

#selected-state-name{
    color:#214567;
    font-size:20px;
    font-weight: 700;

}

#loading-overlay{
    z-index:10; 
    background-color: rgba(0,0,0,0.5);
    position: absolute;
    height: 100%;
    width: 100%;
}

.highcharts-loading-inner{
    font-weight: 1000px !important;
    opacity: 1 !important;
}

.popover-content{
    font-size: .85em;
}

.stronger{
    font-weight: 900;
}
.height{
    line-height: 1.5em;
}

.click-popover:hover{
    cursor: pointer;
    opacity: 1;
}

.videos > span:hover{
    color:black;
}
.videos > img:hover{
 opacity: 1;   
}

.videos > span{
    font-size: 90%;
    color:black;
}

#outer-story{
    margin-left:auto;
    margin-right:auto;
    width: 95%;
}
.larger-font{
    font-size: 1.21em
}
.stories-image{
    margin-bottom: 30px;
     margin-right: 10px;
}

#full-story-text{
    margin-right: 5%;
    margin-top:  10px;
    margin-bottom:  10px;
    padding: 0px;
}
#full-story-text > ul {
    padding-left: 0px !important;
}

#full-story-text > ul > li {
    margin: 10px 0px ;
}

#full-chart-filter{
    padding: 100px 0;
}
.w-95{
    width: 95%;
}

#partnership-stories{
    margin-top:40px;
}

.image-space{
    margin-bottom: 30px; 
    margin-right: 10px;
}

.margin-spacing{
    margin-left: 5%;
    margin-right: 5%;
}
.fa-star{
    color:#ffbd2b;
}

#view-trends{
    font-size: 75%;
}

.videos:hover{
    opacity: 1;
    text-decoration: underline;
}
.overall-story-title{
    width: 60%;
    font-size: 0.85em;
}

#stories-overview{
    background-color:white;
}

#stories-title{
    font-size: 2.5rem
}

#stories-title-subtitle{
    font-size: 1.2rem;
    font-weight: 400;
}

#stories-sidebar{
    background-color:white;
}
@media only screen and (max-width: 300px){
    .reports-images{
        height: 200px !important;
    }
    .report-description{
       margin: 0px
    }
   }

@media only screen and (max-width: 800px){
 .reports-images{
    width: 100%;
    height: 100% !important;
 }
 .right33Col {
    width: 100% !important;
    margin: 1em 1em !important;
}
}


@media only screen and (min-device-width: 768px){
    .right33Col {
        width: 100% !important;
        margin: 1em 1em !important;
    }
}

@media only screen and (min-width: 1000px){
    .image-category{
        height: 140px;
        width: 90%;
        opacity: 85%;
        background-size: cover;
    }
}

@media only screen and (min-device-width: 768px){
.right33Col {
    width: 100% !important;
    margin: 0 !important;
}
}

@media only screen and (max-width: 1000px){
    .image-category{
        height: 250px;
        width: 90%;
        opacity: 85%;
        background-size: cover;
    }
}
@media only screen and (min-width: 1400px){
    .image-category{
        height: 250px;
        width: 100%;
        opacity: 85%;
        background-size: cover;
    }
}
/* .image-category{
    height: 250px;
    width: 100%;
    opacity: 85%;
    background-size: cover;
} */
/* .image-category{
    height: 140px;
    opacity: 85%;
    background-size: cover;
} */


#recent-reports-title{
    color: white;
    font-weight: 800;
}

.reports-images{
    height: 200px;
}

.economic-impact{
    height: 250px;
    width: 400px;
}

.report-section{
    background: white;
    padding: 1rem;
    margin-left: 1rem;
    margin-right: 1rem;
}

.category-title{
    font-weight: 600;
    color:white;
}

.card-top:hover div {
    cursor: pointer;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transform: scale(1.02);
    -moz-transform: scale(1.02);
    -ms-transform: scale(1.02);
    transform: scale(1.02);
    opacity: 100%;
    -webkit-filter: hue-rotate(
-10deg
);
    filter: hue-rotate(
-10deg
);
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
}
/* 
position: absolute;
    font-size: 1.6em;
    font-family: "Exo 2", sans-serif;
    font-weight: 300;
    color: #fff;
    bottom: 0;
    padding: 1rem;
    background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(#000));
    background: linear-gradient(transparent, #000);
    margin: 0;
    width: 100%; */

.animate-if {
  background:white;
  border:1px solid black;
  padding:10px;
}

.animate-if.ng-enter, .animate-if.ng-leave {
  transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
}

.animate-if.ng-enter,
.animate-if.ng-leave.ng-leave-active {
  opacity:0;
}

.animate-if.ng-leave,
.animate-if.ng-enter.ng-enter-active {
  opacity:1;
}

.stories-sidebar-desc{
    font-weight: 500;
    line-height: 1.6em;
    margin:0px;
}

.tech-partner-pic{
    min-width: 150px;
}
