/* module_news.css 

Dependencies:
<link type="text/css" rel="stylesheet" href="/new-design/css/shared.css" media="all" />
<link type="text/css" rel="stylesheet" href="/new-design/css/module_news.css" media="all" />

FYI - for this module on a navigator page, see "/new-design/css/subpage-news.css"

Rules:
    - News should appear at bottom of the page
    - Use "sticky" class if these is an important news item
    - Important news items should stay at the top of the news stack

Example:

<div class="module_news">
    <div class="header">
        <h2><span>Latest</span> News</h2>
    </div>
    <div class="news">
        
        <div class="news-item sticky">
            <div class="wrapper">
                <div class="text">
                    <h3>July 8, 2020</h3>
                    <div class="news-text">
                        <p>Trading Partner onboarding for the eClaims EDI R3.1 upgrade will be held from November 16, 2020 through February 27, 2021. It is important to begin testing as early as possible in order to receive approval to begin production on March 15, 2021. More information will be shared at the monthly eClaims trading partner webinars.</p>
                        <p>Information on testing can be found in the eClaims EDI R3.1 <a href="/content/ebiz/eclaims/edi-r3-1/R3.1 eClaims Implementation Guide.pdf">Implementation Guide</a>:</p>
                        <ul>
                            <li>Flat Filers – Section 3.7</li>
                            <li>Web Data Entry – Section 3.12</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="news-item">
            <div class="wrapper">
                <div class="text">
                    <h3>July 8, 2020</h3>
                    <div class="news-text">
                        <p>Trading Partner onboarding for the eClaims EDI R3.1 upgrade will be held from November 16, 2020 through February 27, 2021. It is important to begin testing as early as possible in order to receive approval to begin production on March 15, 2021. More information will be shared at the monthly eClaims trading partner webinars.</p>
                        <p>Information on testing can be found in the eClaims EDI R3.1 <a href="/content/ebiz/eclaims/edi-r3-1/R3.1 eClaims Implementation Guide.pdf">Implementation Guide</a>:</p>
                        <ul>
                            <li>Flat Filers – Section 3.7</li>
                            <li>Web Data Entry – Section 3.12</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="news-item last">
            <div class="wrapper">
                <div class="text">
                    <h3>April 28, 2020</h3>
                    <div class="news-text">
                        <p><a href="/content/ebiz/eclaims/faqs.jsp#dataelementreporting">eClaims FAQ</a>&nbsp;&nbsp; Data Element Reporting - #19 has been revised to clarify when letter/correspondence must be filed/submitted.</p>
                    </div>
                </div>
            </div>
        </div>
        
    </div>
    
    <div class="button-wrapper">
        <div class="button">
            <a href="/content/ebiz/eclaims/News.jsp">eClaims News <span class="hidden"></span></a>
        </div>
    </div>
    
</div>

*/

.module_news {
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
    margin: 60px 0 60px 0;
    padding: 0;
    align-items: center;
}

.module_news .header {
    padding: 0 20px;
}

.module_news .header,
.module_news .news {
    width: 100%;
}

.module_news .header h2 {
    margin: 0 0 40px 0;
    text-align: center;
    font-family: "Proxima Nova Extra Bold", Arial, sans-serif;
    font-size: 48px;
    color: #000000;
    line-height: 48px;
}

.module_news .header h2 span {
    /*font-family: "Oswald Bold", Arial, sans-serif;
    font-size: 16px;
    letter-spacing: 2px;
    color: #007481;
    text-transform: uppercase;
    margin: 0 0 4px 0;
    display: block;
    line-height: 16px;*/
}

.module_news .news {
    width: 100%;
    flex-direction: column;
}

.module_news .news .news-item {
    background-color: #ededed;
    margin-bottom: 20px;
    padding: 60px 0;
    justify-content: center;
    display: flex;
}

.module_news .news .news-item.sticky {
    background-color: #F4A71C;
}

.module_news .news .news-item .text .news-text {
    font-size: 18px;
    line-height: 24px;
}

.module_news .news .news-item .text .news-text a {
    /*text-decoration: none;*/
    color: #00629B;
}

.module_news .news .news-item .text .news-text a:hover {
    /*text-decoration: underline;*/
    color: #123F64;
}

.module_news .news .news-item.sticky .text .news-text a {
    color: #000000;
    font-family: "Proxima Nova Extra Bold", Arial, sans-serif;
    text-decoration: underline;
}

.module_news .news .news-item.sticky .text .news-text i {
    color: #000000;
}

.module_news .news .news-item .text .news-text li {
    margin: 0.65em 0;
}

.module_news .news .news-item.last{
    margin-bottom: 0;
}

.module_news .news .news-item .wrapper {
    display: flex;
    flex-direction: row;
    width: 1146px;
    justify-content: center;
    padding: 0 20px;
}

.module_news .news .news-item .wrapper .text {
    /*width: 80%;
    width: 100%;
    padding: 0 70px 0 0;*/
    width: 100%;
    padding: 0;
    margin: 0;
    max-width: 800px;
}

.module_news .news .news-item .wrapper .text h3:first-child {
    margin: 0 0 25px 0;
}

.module_news .news .news-item .wrapper .text h3 {
    /*margin: 0 0 25px 0;*/
    padding: 0;
    font-size: 27px;
    line-height: 33px;
    font-family: "Proxima Nova Extra Bold", Arial, sans-serif;
}

.module_news .news .news-item .wrapper .text .date {
    text-transform: uppercase;
    font-size: 13px;
    font-family: "Proxima Nova Bold", Arial, sans-serif;
    margin: 25px 0;
}

.module_news .news .news-item .wrapper .text .date span {
    font-family: "Proxima Nova Extra Bold", Arial, sans-serif;
}

.module_news .news .news-item .wrapper .text .blurb {
    font-size: 16px;
    line-height: 22px;
    margin: 25px 0 0 0;
}

.module_news .news .news-item .wrapper .button {
    width: 20%;
    padding: 0 0 0 70px;
    display: flex;
    flex-direction: row;
    
    /* fix */
    transition: none;
    background-color: transparent;
    border: 0;
    margin: 0;
    cursor: default;
}

.module_news .news .news-item .wrapper .button:hover {
    /* fix */
    background-color: transparent;
}

.module_news .news .news-item .wrapper .button a {
    font-family: "Proxima Nova Bold", Arial, sans-serif;
    text-transform: uppercase;
    color: #ffffff;
    background-color: #007481;
    font-size: 14px;
    line-height: 14px;
    text-decoration: none;
    letter-spacing: 2px;
    padding: 20px 20px;
    align-self: center;
    flex: auto;
    text-align: center;
}

.module_news .news .news-item .wrapper .button a:hover,
.module_news .news .news-item .wrapper .button a:focus {
    background-color: #052F33;
}

.module_news .news .news-item .wrapper .button a .fas.fa-envelope {
    color: #ffffff;
    margin: 0.25em 0em 0em 0em;
    padding: 0;
}
 



@media only screen and (max-width: 1280px) {
    .module_news .news .news-item .wrapper {
        width: 100%;
    }
    
    .module_news .news .news-item .wrapper .text {
        /*width: 70%;*/
        padding: 0 70px;
    }
    
    .module_news .news .news-item .wrapper .button {
        width: 30%;
        padding: 0 70px;
    }
    
    .module_news .news .news-item .wrapper .button a .fas.fa-envelope {
    margin: 0;
    }
}

@media only screen and (max-width: 1024px) {
    .module_news .news .news-item .wrapper .text {
        padding: 0 20px 0 40px;
    }
    
    .module_news .news .news-item .wrapper .button {
        padding: 0 40px 0 20px;
    }
}

@media only screen and (max-width: 767px) {
    /*.module_news .news .news-item .wrapper {
        display: flex;
        flex-direction: column;
        padding: 0 20px;
    }
    
    .module_news .news .news-item .wrapper .text {
        width: 100%;
        padding: 0;
    }
    
    .module_news .news .news-item .wrapper .button {
        width: 100%;
        margin-top: 37.5px;
        padding: 0;
        justify-content: center;
    }*/
    
    /*.module_news .news .news-item .wrapper .button a {
        flex: none;
    }*/
    
    .module_news .news .news-item .wrapper {
        display: flex;
        flex-direction: column;
        padding: 0 20px;
    }
    
    .module_news .news .news-item .wrapper .text {
        /*width: 100%;*/
        padding: 0;
    }
    
    .module_news .news .news-item .wrapper .button {
        width: 100%;
        margin-top: 37.5px;
        padding: 0;
        justify-content: center;
    }
    
    .module_news .news .news-item .wrapper .button a {
        flex: none;
    }
    
}

@media only screen and (max-width: 640px) {
    /*.module_news .news .news-item .wrapper {
        display: flex;
        flex-direction: column;
        padding: 0 20px;
    }
    
    .module_news .news .news-item .wrapper .text {
        width: 100%;
        padding: 0;
    }
    
    .module_news .news .news-item .wrapper .button {
        width: 100%;
        margin-top: 37.5px;
        padding: 0;
        justify-content: center;
    }*/
    
}

@media only screen and (max-width: 460px) {
    .module_news .header h2 {
        font-size: 40px;
        line-height: 40px;
    }

    .module_news .header h2 span {
        font-size: 13px;
        line-height: 13px;
    }
    
    .module_news .news .news-item .wrapper .button a {
        flex: auto;
        padding: 25px 20px;
    }
}