
.spring{flex:1 1 auto}


/* ==================== Article List Control ==================== */
	/* Introduction Three Columns Image */
.article-list-control.three-col-image{}
.article-list-control.three-col-image .content{padding-top:15px;padding-bottom:15px;overflow:hidden}
.article-list-control.three-col-image .content>.title{font-size:2.4em;font-weight:700;text-align:center}
.article-list-control.three-col-image .content>.description{font-weight:700;font-size:1em;line-height:1.9em;text-align:center}
.article-list-control.three-col-image .content .articles{display:flex;flex-wrap:wrap;margin:0 -20px;padding-top:60px}
.article-list-control.three-col-image .content .articles .item{width:33.33%;margin:20px 0;padding:0 20px;color:#1e1e1e;text-decoration:none;box-sizing:border-box; position: relative; padding-bottom: 60px;}
.article-list-control.three-col-image .content .articles .item .image{padding-bottom:61.11111111%;border-radius:5px;background:center;background-size:cover; background-repeat: no-repeat}
.article-list-control.three-col-image .content .articles .item .title{margin:1em 0;font-weight:600}
.article-list-control.three-col-image .content .articles .item .excerpt {font-size: 14px; line-height: 25px; margin-bottom: 1em}

	/* Introduction Three Columns Image B */
.article-list-control.three-col-image-b{}
.article-list-control.three-col-image-b>.Content{overflow:hidden}
.article-list-control.three-col-image-b .content{display:flex;overflow:hidden;margin:0 -15px}
.article-list-control.three-col-image-b .content .panel1{width:25%;padding:0 15px;box-sizing:border-box}
.article-list-control.three-col-image-b .content .panel1 .title{font-size:2em;font-weight:700}
.article-list-control.three-col-image-b .content .panel1 .description{margin-top:10px;font-weight:700;font-size:1em;line-height:1.9em}
.article-list-control.three-col-image-b .content .panel1 .body{margin-top:20px;font-size:1.2em;font-weight:300}
.article-list-control.three-col-image-b .content .panel1 .action{margin-top:30px;padding:9px 0;text-align:center;background:#EC0328;font-size:1.2em;color:#fff;border-radius:6px;transition:background 0.4s}
.article-list-control.three-col-image-b .content .panel1 .action:hover{background:#B2001C}
    
.article-list-control.three-col-image-b .content .articles{display:flex;flex-wrap:wrap;flex:1 1 auto;margin:-15px 0}
.article-list-control.three-col-image-b .content .articles .item{width:33.33%;padding:15px;color:#1e1e1e;text-decoration:none;box-sizing:border-box}
.article-list-control.three-col-image-b .content .articles .item:hover{color:#2a377a}
.article-list-control.three-col-image-b .content .articles .item .image{padding-bottom:61.11111111%;border-radius:5px;background:center;background-size:cover}
.article-list-control.three-col-image-b .content .articles .item .title{margin-top:1.1em;font-weight:500;font-size:1.12em}
.article-list-control.three-col-image-b .content .articles .item .learn-more{display:inline-flex;align-items:center;margin-top:10px;color:#EC0328;text-decoration:none}
.article-list-control.three-col-image-b .content .articles .item .learn-more::after{content:"\e902";margin:2px 0 0 6px;font-family:icomoon;font-size:1.5em}

    /* Introduction Two Columns Image */
.article-list-control.three-col-image{}
.article-list-control.two-col-image .content{padding-top:15px;padding-bottom:15px;overflow:hidden}
.article-list-control.two-col-image .content>.title{margin-top:10px;font-size:2.4em;font-weight:700;text-align:center}
.article-list-control.two-col-image .content>.description{font-weight:700;font-size:1em;line-height:1.9em;text-align:center}
.article-list-control.two-col-image .content .articles{display:flex;flex-wrap:wrap;margin:0 -20px;padding-top:30px}
.article-list-control.two-col-image .content .articles .item{display:flex;align-items:center;width:50%;padding:15px 20px;color:#1e1e1e;box-sizing:border-box}
.article-list-control.two-col-image .content .articles .item .image{flex:0 0 auto;width:260px;height:225px;border-radius:5px;background:center;background-size:cover}
.article-list-control.two-col-image .content .articles .item .panel2{margin:0 40px}
.article-list-control.two-col-image .content .articles .item .panel2 .title{font-weight:500;font-size:1.14em}
.article-list-control.two-col-image .content .articles .item .panel2 .learn-more{margin-top:30px}
.article-list-control.two-col-image .content .articles .item .panel2 .learn-more a{display:inline-flex;align-items:center;color:#ec0328;text-decoration:none}
.article-list-control.two-col-image .content .articles .item .panel2 .learn-more a::after{content:"\e902";margin:2px 0 0 6px;font-family:icomoon;font-size:1.5em}

    

/* Introduction Vertical */
.article-list-control.intro-vertical{}
.article-list-control.intro-vertical>.Content{overflow:hidden}
.article-list-control.intro-vertical .content{padding-top:15px;padding-bottom:15px;overflow:hidden}
.article-list-control.intro-vertical .content>.title{margin-bottom:18px;font-size:2.4em;font-weight:700}
.article-list-control.intro-vertical .content>.description{margin-bottom:15px;font-weight:700;font-size:1em;line-height:1.9em}
.article-list-control.intro-vertical .content>.body{font-size:16px}
.article-list-control.intro-vertical .content .articles{display:flex;flex-direction:column;margin-top:35px;border-top:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6}
.article-list-control.intro-vertical .content .articles .item{display:flex;align-items:center;padding:4px 0px;color:#1e1e1e;text-decoration:none;border-bottom:1px dashed #e6e6e6}
.article-list-control.intro-vertical .content .articles .item:last-child{border-bottom:none}
.article-list-control.intro-vertical .content .articles .item .title-container{display:flex}
.article-list-control.intro-vertical .content .articles .item .title-container .title{padding-bottom:.4em;font-weight:500}
.article-list-control.intro-vertical .content .articles .item .title-container .arrow{width:16px;height:16px;margin-left:10px;overflow:hidden;color:#ec0328}
.article-list-control.intro-vertical .content .articles .item .title-container .arrow::before{content:"\e902";margin-left:-16px;font-family:icomoon;transition:all .4s}
.article-list-control.intro-vertical .content .articles .item .title-container .arrow::after{content:"\e902";font-family:icomoon}
                   
.article-list-control.intro-vertical .content .articles .item .description{font-size:0.8em;color:#7d7d7d}
.article-list-control.intro-vertical .content .articles .item .image{width:240px;height:120px;margin-left:10px;border-radius:5px;background:center;background-size:cover}
.article-list-control.intro-vertical .content .articles .item:hover .title{color:#2a377a}
.article-list-control.intro-vertical .content .articles .item:hover .arrow::before{margin-left:0px;}

.article-list-control.intro-vertical h6{
    color: #222;
}

.vertical-list .h4{font-size: 18px !important; margin-bottom: 20px}
.vertical-list p{font-size: 16px !important;}
.vertical-list .thumb-right-list li .content-list .image-cell {
    min-height: 250px;
    background: top center;
    background-size: cover;
    
}
.article-list-control .thumb-right-list .content-list {
    flex-direction: row !important;
}
.article h2.title{
    font-size: 32px;
    text-align: center;
}
img.articleImg {
    max-width: 100%;
    float: left;
    margin-bottom: 30px;
}
@media (min-width: 1024px){
    .vertical-list .thumb-right-list li .content-list .content-cell {
        width: calc(100% - 300px);
    }
    .vertical-list .thumb-right-list li .content-list .image-cell {
        width: calc(50% - 30px);
        min-height: 400px;
    }
    .article-list-control .thumb-right-list .content-list .content-cell {
        padding-right: 30px;
    }

}
.article-list-control.vertical-list .content>.title {
    font-size: 42px;
    font-weight: 500;
    text-align: center;
    line-height: 60px;
}
.vertical-list .post-tilte{
    margin-bottom: 10px !important;
}
.vertical-list .post-tilte, .vertical-list .post-tilte a{ color: #0091FD}
.vertical-list .post-tilte a:hover{ color: #2ADB98}
.vertical-list .post-tilte .color-primary { color: #2ADB98}
    /* Three Columns Text Only */
.article-list-control.three-columns-text-only{}
.article-list-control.three-columns-text-only>.Content{overflow:hidden}
.article-list-control.three-col-image .content>.title {
    font-size: 42px;
    font-weight: 500;
    text-align: center;
    line-height: 60px;
}
.article-list-control.three-columns-text-only>.Content .content>.description{margin-top:10px;font-weight:700;color:#1e1e1e}
.article-list-control.three-columns-text-only>.Content .content>.articles{display:flex;flex-wrap:wrap;margin:30px -20px 0}
.article-list-control.three-columns-text-only>.Content .content>.articles .item{display:flex;padding:30px 20px;width:33.333%;flex-direction:column;box-sizing:border-box}
.article-list-control.three-columns-text-only>.Content .content>.articles .item>.title{font-weight:700;color:#1e1e1e}
.article-list-control.three-columns-text-only>.Content .content>.articles .item>.description{margin-top:10px;color:#7d7d7d}
.article-list-control.three-columns-text-only>.Content .content>.articles .item>.learn-more{display:flex;align-items:center;margin-top:15px;text-decoration:none;color:#EC0328}
.article-list-control.three-columns-text-only>.Content .content>.articles .item>.learn-more::after{content:"\e902";margin-left:5px;font-family:icomoon}

    /* Video + Media Slider */
.article-list-control.video-media-slider{}
.article-list-control.video-media-slider>.Content{overflow:hidden}
.article-list-control.video-media-slider>.Content .content>.title{font-size:2.4em;font-weight:700}
.article-list-control.video-media-slider>.Content .content>.description{margin-top:10px;font-weight:700;color:#1e1e1e}
.article-list-control.video-media-slider>.Content .content>.articles{margin:30px -10px 0}
.article-list-control.video-media-slider>.Content .content>.articles .item{display:flex;padding:0 10px;width:33.333%;flex-direction:column;box-sizing:border-box;text-decoration:none;color:#1e1e1e}
.article-list-control.video-media-slider>.Content .content>.articles .item:hover{color:#2a377a}
.article-list-control.video-media-slider>.Content .content>.articles .item>.image{padding-bottom: 61.11111111%;background-size:cover;border-radius:6px}
.article-list-control.video-media-slider>.Content .content>.articles .item>.title{margin-top:.8em;font-weight:700}


.article-list-control.video-media-slider>.Content .content>.articles .item.has-video{}
.article-list-control.video-media-slider>.Content .content>.articles .item.has-video>.image{position:relative}
.article-list-control.video-media-slider>.Content .content>.articles .item.has-video>.image::before{content:"\e91c";position:absolute;left:50%;top:50%;margin:-.5em 0 0 -.5em;font-family:icomoon;font-size:4em;color:#fff;transition:color .4s}
.article-list-control.video-media-slider>.Content .content>.articles .item.has-video:hover>.image::before{color:#EC0328}
    

/* =================== Article Data Page =================== */

.article{padding:40px 0 40px 0}
.article .content{max-width: 1000px; margin: 0 auto}
.article .content .feature-top-image, .article .content img.articleImg{
    width: 450px;
    height: 300px;
    margin: 0 40px 20px 0;
    background: top center no-repeat;
    background-size: cover;
    float: left;
}
.article .content h1.title{font-size:2em; text-align: center; line-height: 35px}
.article .content .article-date {text-align: center; color: #666}
.articles .item .article-date{
    margin-top: 1rem;
}
.article .content .article-header{display:flex;align-items:center;margin-top:5px;}
.article .content .article-header .author{font-weight:500}
.article .content .article-header .author:not(:empty){margin-right:10px}
.article .content .article-header .create-date{margin-right:8px;font-weight:500}
.article .content .article-header .update-date{opacity:.7;font-weight:500}

.relatedPost{background-color: #F6F7F8}
.relatedPost h4.title{font-size:1.8em !important; text-align: center; }
.relatedPost .articles {padding-top: 20px !important}
.relatedPost .image {cursor: pointer; transition: all 0.4s ease}
.relatedPost .image:hover {opacity: 0.7}
.relatedPost .title {font-weight: 600 !important;  transition: all 0.4s ease}
.relatedPost .item {padding-bottom: 20px !important}

.article .content .body{margin-top:25px; max-width: 1000px; margin: 20px auto}
.article .content .body p{
    font-size: 16px;
    line-height: 25px;
}
.article .content ul{padding-left:30px}
.article .content ul li{list-style-type:disc}
.article h3, .article h2{
    font-size: 20px;
    line-height: 30px;
    color: #4d917b !important;
}
