/****************************************************
                This CSS file controls the layout
    and styling of the Issues and Trends main content
    area.
*****************************************************/
.layout-content h1{
    text-align: center;
    margin-top: 10px;
    font-weight: 400;
}

.issues-trends{
    margin: 0 15px;
}

.issues-trends div div div article{
    margin: 15px 0;
}

.issues-trends div div div article h2 a{
    text-decoration: none;
    color: #185930;
}

.issues-trends div div div article h2 a span{
    font-size: 22px;
}
.views-field views-field-field-story-image-1{
    
}
#views-exposed-form-issues-trends-page-1{
   display: grid;
   grid-template-columns: 150px 50px 125px;
   grid-template-rows: 100px auto;
   grid-template-areas: "geo . story-cat"
                        ". submit .";
   grid-row-gap: 10px;
   justify-content: center;  
   margin: 25px 0; 
}

#views-exposed-form-issues-trends-page-1 .js-form-item-taxonomy-vocabulary-9-target-id{
    grid-area: geo;
    display: flex;
    flex-direction: column;
    margin: 0 15px;
}
#views-exposed-form-issues-trends-page-1 .js-form-item-taxonomy-vocabulary-9-target-id label{
    text-align: center;
}

#views-exposed-form-issues-trends-page-1 .js-form-item-taxonomy-vocabulary-16-target-id{
    grid-area: story-cat;
    display: flex;
    flex-direction: column;
}

#views-exposed-form-issues-trends-page-1 .js-form-item-taxonomy-vocabulary-16-target-id label{
    text-align: center;
}

#views-exposed-form-issues-trends-page-1 #edit-actions{
    grid-area: submit;
    justify-self: center;
}

#views-exposed-form-issues-trends-page-1 #edit-submit-issues-trends{
    background: #185930;
    color: white;
    border: none;
    height: 30px;
    width: 50px;
    text-transform: uppercase;  
}
@media (max-width: 725px) {
  .Image{
     
      margin-left: auto;
      margin-right: auto;
      height: auto;
      display: block;
      background-size: 100% 100%;
      text-align: center;

    }
    .field-content{
      width: 93%;
      margin-left: auto;
      margin-right: auto;
      height: auto;
      display: block;
      text-align: center;
    }
}
.js-pager__items{
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
}
.js-pager__items li{
    list-style: none;
    padding: 0 5px;
}
.li-issues{
    color: black;
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-size: 14px;
    margin-bottom: 20px;
}
