/*Small Displays*/
/*Mobile First*/
/* =Media Queries
-------------------------------------------------------------- */


/*==========================================================================
//SMALLER
==========================================================================*/
@media only screen and (min-width: 26.25em) {
/*420px*/
/*pink/purple*/
    .title {
        color: #FF00FD;
    }
}

/*==========================================================================
//MEDIUM SMALLER
==========================================================================*/
@media only screen and (min-width: 35em) {
/*560px*/
/*Blue*/
    .title {
        color: #0066FF;
    }
    footer .footer-address {
        float: right;
    }
    footer .footer-address {
        width: 35%;
    }
    .alignHeaders h2, .alignHeaders h3 {
        display: inherit;
    }
    .menu {
        margin-top: 0em;
    }
    a.sub-news {
        width: 45%;
        height: 330px;
        float: left;
        margin-right: 1em;
    }
    .inpage--navigation {
        width: 30%;
        float: left;
        padding: 1em;
    }
    .inpage--content {
        width: 68%;
        float: right
    }

    
    .pod, .col {
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }
    .podGroupVillages .pod {
        max-width: 48%;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }    
    .left-panel, .right-panel {
        width: 48%;
    }
    .news-item .left-panel {
        float: left;
        width: 70%;
    }
    .news-item .right-panel {
        float: right;
        width: 25%;
    }
    a.sub-news {
        display: block;
        width: 100%;
        height: auto;
    }    
    .pod--success .website-description, .pod--information .website-description, .pod--neutral .website-description,  .pod--warning .website-description {
        width: 70%;
    }    
}
/*==========================================================================
//MEDIUM > LARGE
==========================================================================*/	
@media only screen and (min-width: 55em) {
/*880px*/	
/*Yellow*/ 
    .title {
        color: #FFFF00;
    }
    .news .left-panel{float:left;width:48%}
    .news .right-panel{float:right;width:48%}
    header #logo {
        width: 165px;
        margin: 0.5em;
        float: left;
    }
    #nav-trigger {
        display: none;
    }
    nav#primary_nav_wrap {
        display: block;
        display: flex;
        display: -webkit-flexbox;
        display: -ms-flexbox;
        display: -webkit-flex;
        float: right;
    }
    nav#nav-mobile {
        display: none;
    }
    

}

/*=========================================================================
//LARGE
==========================================================================*/
@media only screen and (min-width: 75em) {
/*1200px*/
/*Wight*/ 
    .title {
        color: #FFFFFF;
    }
}