.home {
    width: 100%;
    height: 60%;
    background-attachment: fixed;
    background-position: 50% 50%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-image: url(/images/enews-header.jpg);
    transition: 0.3s ease-in-out;
}

.home-exit {
    width: 100% !important;
    height: 110px !important;
    background-color: #ff3e50;
    background-image:unset !important;
}

.news-div, .year-header {
    position: relative;
    animation: auto linear reveal both;
    animation-duration: 18s;
    animation-delay: 10s;
    animation-timeline: view();
    animation-range: entry 10% cover 30%; 
}

.news-div_, .year-header_, .news-div-div, .year-header-div {
    position: relative;
    animation: reveal ease 0.75s !important;
    animation-delay: 0.3s !important;
    animation-iteration-count: 1 !important;
    animation-fill-mode: forwards !important;
    animation-timeline: unset !important;
    animation-range: unset !important;
}

.home-header-text h4 {
    width:50% !important;
    margin: auto;
    padding-bottom: 60px;
}

.news-container {
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 60px;
    padding-bottom: 60px;
    text-align: left;
}

.news-container h2 {
    text-align: left;
    font-size: 1.2em;
    line-height: 1em;
    font-weight: 550 !important;
}

.news-container h3 {
    text-align: left;
    font-size: 1em;
    line-height: 1em;
}

.news-div {
    background-color: #fff;
    padding: 15px;
    margin-bottom: 10px;
    display: inline-block;
    width: 100%;
    transition: 0.3s ease-in-out;
    border-radius: 20px;
}

.news-div:hover {
    background: rgb(2,0,36);
    background: linear-gradient(0deg, rgba(2,0,36,1) 0%, rgba(255,255,255,1) 0%, rgba(228,230,230,1) 100%);
}

.year-head {
    background-color: #ececf0;
    color: #00709e;
    font-size: 2rem;
    font-weight: 550;
    border-radius: 20px;
    padding: 5px;
    margin-top: 10px;
    margin-bottom: 20px;
    padding-left: 20px;
    vertical-align: middle;
}

.news-date {
    font-size: 1rem;
    border-radius: 20px;
    margin-bottom: 8px;
}

.red-line-divider {
    border-top: 4px solid #ff3e50; 
    width: 100%; 
    margin-top: 40px;
    padding-bottom: 10px;
}

.box-content {
    /* font-size: 1.6rem; */
    padding-left: 100px !important;
    padding-right: 100px !important;
    text-align: left;
}

.box-content-mv {
    padding: 40px !important;
}

@media screen and (min-width: 768px) and (max-width: 820px) {

}

@media screen and (min-width: 1024px) and (max-width: 1025px) {

}

@media only screen and (min-width: 280px) and (max-width : 820px) {
    .news-container {
        padding-top: 20px;
        padding-bottom: 20px;
        padding-left: 30px;
        padding-right: 30px;
    }

    .news-div {
        padding: 0px !important;
        margin-bottom: 20px;
        padding-bottom: 20px !important;
        border-bottom: 1px solid #ccc;
        border-radius: 0px;
    }

    .news-div:hover {
        background: unset !important;
    }

    .news-div_, .year-header_, .news-div-div, .year-header-div {
        position: relative;
        animation: unset !important;
        animation-duration: unset !important;
        animation-delay: unset !important;
        animation-timeline: unset !important;
        animation-range: unset !important; 
    }
}