/* Article Search */
.article_header { background: #F5F5F5; margin-bottom: 20px; font-family: 'Quicksand';}
.article_header > div {height: 70px; position: relative; display: flex; align-items: center; justify-content: space-between;}

.article_header .article_search_title {font-size: 20px; text-transform: capitalize; color: #393A3D;}

.article_search_header {display: flex; align-items: center; padding:0; box-sizing: border-box; margin:0 10px 30px 10px;  padding-bottom: 20px; border-bottom: 1px solid #EBE8E8;}
.article_search_header > div {flex: 1 0 0;}

.article_search_wrap {display:flex; align-items:center; gap:20px;}

.category_selection {width:250px;}
.category_selection select {width: 100%; border:1px solid #F7F4EF; background: #fff url(../images/droparrow.svg) no-repeat 95% center; height: 50px; color: #232323; font-size: 16px; padding: 0 10px; box-sizing: border-box; appearance:none; -webkit-appearance:none; -moz-appearance:none;}

.article-search-form {display: flex; align-items: center; width:250px; height: 50px; background:#fff; border:1px solid #F7F4EF; overflow: hidden; position: relative;}
.article-search-form input[type=text] {width: calc(100% - 50px); padding: 0 10px; box-sizing: border-box; height: 100%; border:0; background:none; outline:0; color: #232323; font-size: 16px;}
.article-search-form input[type=text]::placeholder {opacity:1;}
.article-search-form input[type=submit] {width: 50px; height: 100%;  background: url(../images/search_art.svg) no-repeat center; cursor: pointer;  border:0; outline:0; padding: 0; position: relative;}

.article-search-results{display: flex; align-items: flex-start; flex-wrap: wrap; gap:2%;}

.articles_searchfooter {padding: 10px 0 40px; display:flex; align-items:center; justify-content:space-between;}
.articles_searchfooter > div:nth-child(1) {display:flex; align-items:center;}
.articles_searchfooter > div > span {display:block; font-size:16px; color: #232323; line-height:20px; border-right: 1px solid #232323; margin-right:10px; padding-right:10px; position:relative;}
.articles_searchfooter > div .back_to_top {}
.articles_searchfooter > div .back_to_top a {display: block; color:#232323; text-decoration: underline; font-size: 16px; line-height: 20px; scroll-behavior:smooth;}


/*Articles Pager*/
.articles-pager {display: flex;  align-items: center;}
.articles-pager > div {width: 100%; display: flex; flex-direction: row; justify-content: center; align-items: center; position: relative;}
.articles-pager > div > a {height: 100%; color: #232323; background: #F5F5F5; font-size: 18px; line-height:35px; padding: 0 5px; margin: 0 2px; position: relative; display: flex; align-items: center; justify-content: center;}
.articles-pager > div > a.pager-prev {}
.articles-pager > div > a.active{font-weight:bold;}

/* Archive List */
.articles_archives_wrap {width:100%; margin: 10px 0 40px;}
.archives_header {width:100%; height: 70px; background: #F5F5F5; display:flex; align-items:center; justify-content:center;}
.archives_header span {font-size:24px; line-height:34px; color: #393A3D; font-weight:bold;}
.articles_archives {height: auto; max-height:150px; overflow-y:scroll; padding: 20px; position:relative;}
.articles_archives::before {content:""; display:block; width: 2px; height:100%; background: #EBEBEB; position:absolute; top:20px; left:0px;}
.articles_archives {}
.articles_archives a {font-size:16px; line-height:28px; color: #232323; text-decoration:underline; display:block;}



/* Article Block */
.article {width: 32%; margin: 0 0 20px; background: #F5F5F5;}
.article > div {display: flex; flex-direction: column; position: relative; flex-grow: 0; flex-shrink: 0;}
.article .article-image {display:block; width:100%; height: 295px; background-size:cover;}
.article .article-info {position:relative; padding: 40px 10px 20px;}
.article .article-info .article_category {position:absolute; top:-20px; left:50%; transform: translateX(-50%);}
.article .article-info .article_category a {display:block; font-size:12px; line-height:40px; color: #000; font-weight:bold; text-transform:uppercase; padding: 0 20px; background: #D4A809;}
.article .article-info .article-title { height: 70px; line-height: 34px; font-size:24px; color: #393A3D; text-align:center; width: 100%; overflow: hidden; }
.article .article-info .article-title a:hover {color: #393A3D; text-decoration:underline;}
.article .article-info .article_snippet {font-size:16px; line-height:28px; color: #232323; height: 85px; overflow:hidden; text-align:center;}
.article .article_read_now {padding: 10px 0;}
.article .article_read_now a {display: block; font-size:14px; font-weight: bold; color: #000; text-transform:uppercase; position:relative; text-align:center;}
.article .article_read_now a::after {content:""; display:block; width: 7.5px; height:7.5px; border:solid #000; border-width:2px 2px 0 0; transform:rotate(45deg); position:absolute; left: calc(50% + 50px); top:calc(50% - 3.75px); }


/* Article Details */
.article_details .article_title { font-size: 36px; line-height: 46px; color: #393A3D; margin-bottom: 10px; padding: 0; font-family: 'Quicksand', sans-serif;}
.article_details .article-publishDate {padding-left: 30px; background:url(../images/calendar-icon.svg) no-repeat left center; font-size:18px; line-height:28px; color: #393A3D; }
.article_details .article_categories{margin: 0 0 20px; display: flex; flex-wrap: wrap;}
.article_details .article_categories a{margin-right: 15px; color: #5DDADB; font-size: 16px; font-weight: bold; text-decoration: underline; text-transform: capitalize;}
.article_details .art-image { min-height: 30px; text-align: center; margin-bottom: 20px;}
.article_details .art-image img { max-width: 100%; }
.article_details .article-description p{font-size: 16px; line-height: 24px;}

.article_details .art_back {padding: 10px 0;}
.article_details .art_back a {font-size:14px; color: #000000; text-transform: uppercase; font-weight:bold;}

/* Article Gallery */
.article-gallery-wrap {border:1px solid #E5E0E0; position:relative; padding: 0 10px;}
.article-gallery-wrap::before {content:""; display:block; height:115px; width:10%; background: transparent linear-gradient(270deg, #FFFFFF00 0%, #FFFFFFA0 20%, #FFFFFF 75%) 0% 0% no-repeat padding-box; position:absolute; left:10px; top:20px; z-index:1;}
.article-gallery-wrap::after {content:""; display:block; height:115px; width:10%; background: transparent linear-gradient(90deg, #FFF0 0%, #FFFFFFA0 30%, #FFF 55%) 0% 0% no-repeat padding-box;; position:absolute; right:10px; top:20px; z-index:1;}

.article-gallery {width: 100%; height:100%;position: relative; padding: 20px 0; overflow: hidden;}
.ag-container {display: flex; justify-content: flex-start; height:100%; will-change: transform;}
.ag-slide {position: relative; width:auto; padding: 0 5px;}
.ag-slide img {height:115px; width:auto;}
.slick-track {display:flex; justify-content:center;}

.ag_next,
.ag_prev {position: absolute; right: 10px; top: calc(50% - 25px); display: block; width: 25px; height: 50px; background: url(../images/nav-right.svg) no-repeat center;z-index:2; cursor:pointer;}
.ag_prev {right: initial; left: 10px; background:  url(../images/nav-left.svg) no-repeat center;}


/* Sidebar */
.article_sidebar {}
.article_sidebar > div {margin-bottom: 20px;}
.sidebar_header {background: #F5F5F5; width:100%; height:70px; margin: 0 0 20px; display:flex; align-items:center; justify-content:center;}
.sidebar_header span {display:block; font-size:24px; color: #393A3D; font-weight:bold;}
.sidebar_articles {padding:10px; background: #F5F5F5; }

.art_side_block {padding: 10px 0 0; margin: 0 0 10px; background: transparent; transition: all 0.2s ease-in;}
.art_side_title {font-size:20px; line-height:30px; color: #393A3D; padding: 0 10px; transition: all 0.2s ease-in;}
.art_side_snippet {height:80px; overflow:hidden; font-size:16px; line-height:28px; padding: 0 10px; color: #232323;}
.art_side_readmore {width:100%; padding: 0 10px; background: transparent; transition: all 0.2s ease-in;}
.art_side_readmore a {font-size:14px; line-height:48px; text-transform: uppercase; color: #000; font-weight:bold; transition: all 0.2s ease-in;}

.art_side_block:hover {background: #fff;}
.art_side_block:hover .art_side_title {text-decoration: underline;}
.art_side_block:hover .art_side_readmore {background: #D4A809;}
.art_side_block:hover .art_side_readmore a {color: #fff;}

.sidebar_archives {height: auto; max-height:150px; overflow-y:scroll; padding: 0 20px 20px; position:relative;}
.sidebar_archives::before {content:""; display:block; width: 2px; height:100%; background: #EBEBEB; position:absolute; top:0px; left:0px;}
.sidebar_archives a {display:block; font-size:16px; line-height:28px; color: #232323; text-decoration:underline; display:block;}




/*Related Articles*/
.related_articles {margin: 10px 0 20px;}
.related_articles .related_header {width:100%; height: 70px; margin: 0 0 20px; background: #F5F5F5; display:flex; align-items:center; justify-content:center;}
.related_articles .related_header > span {font-size:24px; line-height:34px; color: #393A3D; font-weight:bold;}

.article_details .back_to_top {margin: 10px 0 30px;}
.article_details .back_to_top a {display: block; color:#232323; text-decoration: underline; font-size: 16px; line-height: 20px; }


/* Article List */
.article-list-module { position: relative; padding-top: 20px; margin-top: 20px; margin-bottom: 20px; box-sizing: border-box; }
.article-list-module > div { position: relative; }
.article-list-module .article-title { width:100%; height:70px; background: #F5F5F5; display:flex; align-items:center; justify-content:center; margin-bottom:30px;}
.article-list-module .article-title span { color: #393A3D; font-weight: bold; font-size: 24px; display: block;}
.article-list-module .article-slider { display: flex; align-items: flex-start;}

/*Pagination*/
.article-list-module .articles-gal-pagination  {display: flex; width: 100%; align-items: center; justify-content: center; z-index: 60; height: 60px; }
.article-list-module .articles-gal-pagination a { width: 20px; height: 4px; box-sizing: border-box; transition: ease-in-out all .5s; margin: 0 4px; background: #fff; box-shadow:1px 1px 4px #232323;}
.article-list-module .articles-gal-pagination a.selected { background: #F1C73F; }

/* XXL Desktop */
@media (min-width:1600px) {
    .article-list-module .article {width:500px !important; margin: 0 15px;}
}
/* XL Desktop */
@media (min-width:1400px) and (max-width:1499px) {
    .article-list-module .article {width:430px !important; margin: 0 15px;}
}
/* Desktop */
@media (min-width:1200px) and (max-width:1399px){
    .article-list-module .article {width:372px !important; margin: 0 10px;}
}

@media (min-width:992px) and (max-width:1199px) {
    .article .article-image{height: 205px;}
    .article-list-module .article {width:295px !important; margin: 0 9px;}
}

/*Tablet*/
@media (min-width:768px) and (max-width:991px) {
    
    
    .article_search_wrap {gap:5px;}
    .category_selection {width:180px;}
    .article-search-form {width:180px;}
    
    /*Article Block*/
    .article {width:49%;}
    .article .article-image {height: 210px;}
    .article .article-info .article_snippet {height:135px;}
    
    /*Details Page*/
    
    
    /* Article List */
    .article-list-module .article {width:350px !important; margin: 0 7px;}
    
}

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

    /*Search Page*/
    .article_header {height: 80px;}
    .article_header > div {display: flex; justify-content: space-between;}
    .article_header .article_search_title {font-size: 18px;}

    .article_search_wrap {margin: 10px 0; gap:10px;}
    .category_selection {padding: 0; width:calc(50% - 5px);}
    .search_form_container {width:calc(50% - 5px);}

    .articles_searchfooter {flex-direction: column; gap: 20px; }
    

    /*Article Block*/
    .article-search-results {justify-content:center;}
    .article{width: 100%;}
    .article .article-image{height: 200px;}
    .article .article-info .article_snippet {height:auto;}
    .article .article_read_now a{font-weight: normal;}

    /*Pager*/
    .articles-pager > div > a{display: none;}
    .articles-pager > div > a.active{display: flex;}
    .articles-pager > div > a.pager-next, .articles-pager > div > a.pager-prev{display: block;}

    /*Details*/
    .article_details .back_to_top {text-align:center;}
    .article_details .article-description p{font-size: 14px;}


    /*Article List*/
    .article-list-module > div{width: 310px;}
    .article-list-module .article > div{padding: 0;}
    .article-list-module .article {width:278px !important; margin: 0px;}
    .article-list-module .article .article_category a {line-height:24px; padding: 0 10px ;}
    .articles-gal-pagination{height: 50px;}


}