/* Articles Header */
.article_header{  display: flex; flex-direction: column; gap:20px; margin-bottom: 20px;}
.article_search_title{height: 120px; background: #1b6b6c; display: flex; align-items: center;}
.article_search_title > div{display: flex; flex-direction: column; gap:5px;}
.article_header .article_search_title h1{font-size: 28px; line-height: 1; margin: 0; font-weight: bold; text-transform: uppercase; color: #fff;}
.article_header .article_search_title span{font-size: 16px; color: #fff; line-height: 22px;}

.article_header_controls{display: flex; width: 100%; align-items: center; gap:16px;}

/*Article Category*/
.category_container{width: calc(50% - 8px); display: flex; align-items: center; position: relative; background: #fff; flex-shrink: 0;}
.category_container::after{content: ""; height: 10px; width: 10px; border:solid #292929; border-width:0 3px 3px 0; position: absolute; 
    right:15px; top:calc(50% - 5px); transform:rotate(45deg); pointer-events:none; }
.category_container select{border: 1px solid #D8D9D9; width: 100%; padding: 0 15px; height: 60px; color: #292929; background:none; -moz-appearance: none; 
    text-indent: 1px; -webkit-appearance: none; text-overflow: '';}
.category_container option{color:#292929;}

/*Article Search Form*/
.search_form_container{width: calc(50% - 8px); display: flex; align-items: center; position: relative; background: #fff; flex-shrink: 0;}
.article-search-form{display: flex; align-items: center; width: 100%; height: 60px; border: 1px solid #D8D9D9; width: 100%;}
.article-search-form input[type=text]{width: calc(100% - 60px); box-sizing: border-box; background: none; height: 100%; border:0; padding: 0 15px; 
    outline:0; color: #292929; font-size: 18px;}
.article-search-form input[type=text]::placeholder{color: inherit; font-size: inherit; font-family: inherit;}
.article-search-form input[type=submit]{width: 60px; flex-shrink: 0; height: 100%; background: url(../images/search.svg) no-repeat center; 
    cursor: pointer; border:0; outline:0; padding: 0; position: relative;}

/*Article Search*/
.article-search-results{display: flex; align-items: flex-start; flex-wrap: wrap;}

/*Search Pager*/
.search-pager{ margin: 20px 0; height: 60px; display: flex;  align-items: center;}
.search-pager > div{width: 100%; display: flex; height: 100%; flex-direction: row; justify-content: center; align-items: center; 
    position: relative; margin: 0; background: #fff; overflow: hidden;}
.search-pager > div > a{height: 100%; width: 30px; color: #231F20; font-size: 18px; position: relative; display: flex; align-items: center; 
    justify-content: center; font-weight: 400; text-transform: uppercase;}
.search-pager > div > a.pager-prev{position: absolute; left: 0; top: 0; width: 185px; background: #218F91; height: 100%; color: #fff; font-weight: bold;}
.search-pager > div > a.pager-prev::after{content: ""; height: 10px; width: 10px; position: absolute; left: 55px; top: calc(50% - 5px); 
    border:solid #fff; border-width: 0 0 2px 2px; transform: rotate(45deg); transition: ease-in-out all .3s;}
.search-pager > div > a.pager-next{position: absolute; right: 0; top: 0; width: 185px; background: #218F91; height: 100%; color:#fff; font-weight: bold;}
.search-pager > div > a.pager-next::after{content: ""; height: 10px; width: 10px; position: absolute; right: 55px; 
    top: calc(50% - 5px); border:solid #fff; border-width: 2px 2px 0 0; transform: rotate(45deg); transition: ease-in-out all .3s;}
.search-pager > div > a.active{color: #218F91; font-weight: bold; text-decoration: underline;}
.search-pager > div > a:not(.pager-prev, .pager-next)::after{content:""; height: 20px; width:2px; background:#DBDBDB; position:absolute; right:0; }

/* Article Block */
.article {width: 25%; }
.article > div{display: flex; position: relative; flex-direction: column; margin:0 10px 40px 10px;}
.article .art-image { height: 180px; width: 100%; display: flex; align-items: flex-start; position: relative;}
.article .art-image > a{height: 100%; width: 100%; background-position: center; background-color: #ededed; background-size: cover; 
    background-repeat: no-repeat; transition: ease-in-out all .3s;}
.article .art-info {padding:15px; background: #fff; display: flex; flex-direction: column; justify-content: center; gap: 10px; position: relative; 
    border: 1px solid #ECECEC;}
.article .art-title  {display: flex; align-items: flex-start; width: 100%; height: 105px; overflow: hidden; justify-content: center; width: 100%;}
.article .art-title a {color: #000; font-size: 20px; line-height: 26px; font-weight: 400; text-decoration: none; transition: ease-in-out all .3s;
    display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; text-align: center;}
.article .art-footer{display: flex; justify-content: center; align-items: center;}
.article .art-footer a{color: #218F91; font-weight: bold; font-size: 18px; text-decoration: underline;}

/* Article Details */
.AB-editing .article_image{min-height: 30px;}
.article_details_header{height: 80px; background: #1b6b6c; display: flex; align-items: center; margin-bottom: 30px;}
.article_details_header > div{display: flex; align-items: center;}
.article_details_header h1{margin: 0;}
.article_details_header h1 a{color: #fff; font-weight: bold; font-size: 18px; text-decoration: underline; color: #fff; text-transform: uppercase;}
.article_image{position: relative;}
.article_info{display: flex; flex-direction: column; align-items: flex-start; gap:20px;}
.article_title{font-size: 42px; line-height: 56px; font-weight: bold; color: #292929; margin:0; padding: 0;}
.article_date{font-size: 14px; color:#218F91; }
.article-description :is(p, li){font-size: 16px; color: #404953; line-height:26px;}
.article-description p:last-child{margin: 0;}

.article_details > div > .article_left{width: calc(100% - 390px); flex-shrink: 0; padding: 0 15px; display: flex; flex-direction: column; gap:30px;}
.article_details > div > .article_right{width: 390px; flex-shrink: 0; padding: 0 15px 0 0;}

.article_categories{width: 100%; margin: 0 0 20px 0; padding-top: 20px; display: flex; align-items: center; flex-wrap: wrap; row-gap: 10px;
    border-top: 1px solid #D3D8D9;}
.article_categories a{font-size: 18px; color: #218F91; padding: 0 10px 0 0; margin: 0 10px 0 0; display: flex; align-items: center; position: relative;}
.article_categories a::after{content: ""; height: 14px; width: 1px; background: #218F91; position: absolute; right: 0;}
.article_categories a:last-child{padding: 0; margin: 0;}
.article_categories a:last-child::after{content: none;}

/*Article Sidebar*/
.article_sidebar{ position: relative;}
.article_sidebar > header{display: flex; align-items: center; width: 100%; position: relative; position: relative; z-index: 10;}
.article_sidebar > header >h2{font-size: 28px; color:#292929; margin: 0; font-weight: bold; position: relative; margin-bottom: 15px;}
.as_articles .article{width: 100%;}
.as_articles .article > div{margin: 0 0 20px 0;}

/***** Article List Module *****/
.article-list-module { position: relative; padding: 35px 0; background:#FFFFFF;}
.article-list-module > div{position: relative; display: flex; flex-direction: column; align-items: center; gap:30px; max-width: 1600px;}
.article-list-module .article_slider_wrap{width: 100%; display: flex; position: relative;}
.article-list-module .al_header{display: flex; flex-direction: column; justify-content: center; align-items: center; gap:10px;}
.al_header .al_heading{font-size: 32px; color: #000000; line-height: 40px; font-weight:bold; position: relative;}

/*Article List View*/
.article-list-module.list{}
.article-list-module.list .article-slider{width: 100%;}
.article-list-module.list .article-slider .swiper-wrapper{flex-wrap: wrap; display: flex; margin: 0;}
.article-list-module.list .article-slider .swiper-slide{height: initial;}
.article-list-module.list .article{width: 25%;}
.article-list-module.list .article > div{margin: 0 15px 40px 15px;}

/*Article Carousel View*/
.article-list-module.carousel .article > div{margin: 0;}

/*Article Carousel Pagination*/
.art_pagination {display: flex; align-items: center; justify-content: center; gap:8px; height: 30px;}
.art_pagination .art_bullet{height: 14px; width: 14px; border-radius: 100%; position: relative; display: flex; align-items: center; 
    justify-content: center; cursor: pointer; transition:ease-in-out all .3s; border: 1px solid #2FAAAC; background: #fff;} 
.art_pagination .art_bullet.active{background-color: #2FAAAC;}
.art_pagination.swiper-pagination-lock{display: none;}

.arts_nav_prev{height: 60px; width: 40px; position: absolute; left: -60px; top: calc(50% - 30px); z-index: 20; cursor: pointer;}
.arts_nav_prev::after{content: ""; height: 18px; width: 18px; border:solid #005B5E; border-width:0 0 3px 3px; transform:rotate(45deg); position: absolute; 
    right:6px; top:22px; transition: ease-in-out all .3s;}
.arts_nav_next{height: 60px; width: 40px; position: absolute; right: -60px; top: calc(50% - 30px); z-index: 20; cursor: pointer;}
.arts_nav_next::after{content: ""; height: 18px; width: 18px; border:solid #005B5E; border-width:3px 3px 0 0; transform:rotate(45deg); position: absolute; 
    left:6px; top:22px; transition: ease-in-out all .3s;}
.arts_nav_disabled::after{border-color: #959494;}



/************Responsive states**************/


/* Desktop */
@media (min-width:992px) and (max-width:1199px) {

    /*Search Page*/

    /*Article Block*/
    .article > div{margin: 0 5px 20px 5px;}
    .article .art-image {height: 130px;}

    /*Details Page*/

    /*Sidebar*/
    .article_details > div > .article_left{width: calc(100% - 340px);}
    .article_details > div > .article_right{width: 340px;}

    /*Article List Module*/
    .article-list-module > div{max-width: 960px;}
    .article-list-module.list .article > div{margin: 0 10px 30px 10px;}
    .arts_nav_next{right: -40px;}
    .arts_nav_prev{left: -40px;}

}

/*Mobile & Tablet*/
@media (max-width:991px){

    /*Article Details*/
    .article_details > div > .article_left{flex: initial; width: 100%; padding: 0 10px;}
    .article_details > div > .article_right{width: 100%; padding: 0 10px; display: flex; align-items: center; flex-direction: column; justify-content: center;}

    .article_sidebar{width: 100%; padding: 15px 0;}

}

/*Tablet*/
@media (min-width:768px) and (max-width:991px) {

    /*Search Page*/
    .article_search_title{height: 100px;}
    .article_header .article_search_title h1{font-size: 22px;}
    .article_header .article_search_title span{font-size: 14px;}
    .article-search-form input[type=text], .category_container select{font-size: 16px;}

    /*Article Block*/
    .article > div{margin: 0 5px 20px 5px;}
    .article .art-image {height: 85px;}
    .article .art-title{height: 80px;}
    .article .art-title a{font-size: 16px; -webkit-line-clamp: 3;}
    .article .art-footer a{font-size: 15px;}

    /*Article Details*/
    .as_articles{display: flex; flex-wrap: wrap; align-items: flex-start;}
    .as_articles .article{width: 25%;}
    .as_articles .article > div{margin: 0 5px 20px 5px;}
    .article_sidebar > header >h2{font-size: 22px;}

    /*Article List Module*/
    .article-list-module > div{max-width: 720px;}
    .article-list-module.list .article{width: 25%;}
    .article-list-module.list .article > div{margin: 0 5px 20px 5px;}
    .arts_nav_prev{left: -40px;}
    .arts_nav_next{right: -40px;}

}

/*Mobile*/
@media (max-width:767px) {

    /*Search Page*/
    .article_search_title{height: 80px;}
    .article_header .article_search_title h1{font-size: 22px;}
    .article_header .article_search_title span{font-size: 14px;}
    .article_header_controls{flex-direction: column; gap:10px;}
    .category_container, .search_form_container{width: 100%;}
    .article-search-form input[type=text], .category_container select{font-size: 16px;}

    .article-search-results{flex-direction: column; align-items: center;}

    /*Articles Pager*/
    .search-pager > div > a.pager-prev{width: 90px; padding-left: 10px;}
    .search-pager > div > a.pager-prev::after{left: 17px;}
    .search-pager > div > a.pager-next{width: 90px; padding-right: 10px;}
    .search-pager > div > a.pager-next::after{right: 17px;}
    .search-pager > div > a:not(.pager-next, .pager-prev, .active){display: none;}
    .search-pager > div > a:not(.pager-prev, .pager-next)::after{content:none;}

    /*Article Block*/
    .article{width: 290px;}
    .article > div{margin:0 0 40px 0; }
    .article .art-image{height: 140px;}
    .article .art-info{padding: 10px 10px 20px 10px;}
    .article .art-title a{font-size: 16px;}

    /*Article Details*/
    .article_title{font-size: 24px; line-height: 36px;}
    .article_info{gap:15px;}
    .article_sidebar > header >h2{font-size: 22px;}
    .as_articles .article{width: 300px;}
    .as_articles{display: flex; flex-direction: column; align-items: center;}

    /*Article List*/
    .al_header .al_heading{font-size: 30px;}
    .article-list-module .article-slider{width: 290px;}
    .article-list-module.list .article{width: 100%;}
    .article-list-module.list .article > div{margin: 0 0 30px 0;}
    .arts_nav_next{right: 0; background: rgba(255, 255, 255, .65); height: 32px; width: 20px;}
    .arts_nav_next::after{border-color: #000000; border-width: 2px 2px 0 0; width: 10px; height: 10px; left: 4px; top: 13px;}
    .arts_nav_prev{left:0; background: rgba(255, 255, 255, .65); height: 32px; width: 20px;}
    .arts_nav_prev::after{border-color: #000000; border-width: 0 0 2px 2px; height: 10px; width: 10px; right: 4px; top:13px;}

    .article-list-module.list > div{max-width: 300px;}
}
