/* @import url('https://fonts.googleapis.com/css2?family=Prompt:wght@100;200;300;400;500;600;700;800;900&display=swap'); */
:root {
  --primary : #D0B185;
  --secondary : #AF8F4C;
  --black :#121212;
  --white: #FFF;
  --charcoal-gray : #2E2E2E;
  --slate-gray : #4A4A4A;
  --silver-gray : #BFBFBF;
  --champagne-gray : #E5E1DA;
  --red : #C1001B;
  
  --gold-gradient: linear-gradient(to bottom, #F4EDE2 0%, var(--primary) 40%, var(--secondary) 100%);
  --bg-footer: #E6E6E6;
}

@font-face {
    font-family: 'Scto Grotesk B';
    src: url('../fonts/en_secondary_scto_grotesk_b/Scto_Grotesk_B_Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Central SangBleu';
    src: url('../fonts/en_main_central_sangbleu/CentralSangBleu-Medium.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'TH Nato Sans';
    src: url('../fonts/th_noto_sans/NotoSansThai.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
	margin: 0;
  font-family: 'Scto Grotesk B';

  background: var(--black);
  position:relative;
}
html[data-lang="th"] body{
  font-family: 'TH Nato Sans';
}
h1, h2, h3, h4, h5, h6{
  font-family: 'Central SangBleu';
}
.f-centralscto{
  font-family: 'Scto Grotesk B', sans-serif;
}
.f-centralsang{
  font-family: 'Central SangBleu', sans-serif;
}
.f-nato{
  font-family: 'TH Nato Sans', sans-serif;
}
a{
  outline: none !important;
  text-decoration: none;
  transition: ease-in-out 0.25s;
  word-wrap: break-word;
}
a:hover{
  color:var(--primary);
}
.link-silver-gray{
  color:var(--silver-gray);
}
.link-silver-gray:hover{
  color:var(--primary);
}

.link-slate-gray{
  color:var(--slate-gray);
}
.link-slate-gray:hover{
  color:var(--primary);
}

.text-primary{
  color:var(--primary) !important;
  fill:var(--primary) !important;
}
.text-secondary{
  color:var(--secondary) !important;
  fill:var(--secondary) !important;
}
.text-charcoal-gray{
  color:var(--charcoal-gray) !important;
  fill:var(--charcoal-gray) !important;
}
.text-slate-gray{
  color:var(--slate-gray) !important;
  fill:var(--slate-gray) !important;
}
.text-silver-gray{
  color:var(--silver-gray) !important;
  fill:var(--silver-gray) !important;
}

.fs-7{
  font-size: .875rem;
}
.fs-8{
  font-size: .75rem;
}

#navbarHeader{
  background-color: rgba(46, 46, 46, 0.6);
  backdrop-filter: blur(2px);
  color: white;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  transition: background-color 0.3s ease-in-out;
}
#navbarHeader.scrolled{
  background-color: rgba(18, 18, 18, 0.85);
    backdrop-filter: blur(8px);
}
#navbarHeader .nav-link {
  color: var(--white);
  font-weight: 400;
  font-size: 0.875rem;
  padding: .5rem 0;
  transition: ease-in-out 0.25s;
}
#navbarHeader .nav-link.active, #navbarHeader .nav-link:hover{
  color: var(--primary);
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}
/* #navbarHeader .nav-link:hover{
  transform: translateY(-4px);
} */
.col-custom{
  width:160px;
}
.max-width-container-1600{
  max-width: 1600px;
}
.max-width-container-1140{
  max-width: 1140px;
}

.headerLogo{
  width: 160px;
  max-width: 100%;
  height: auto;
}
.py-section{
  padding-top: 2.5rem !important;
  padding-bottom: 2.5rem !important;
}

footer{
  background-color: var(--bg-footer);
  padding:2.5rem 1rem
}
#menu-footer .list-item a{
  color:var(--black);
  font-size:.875rem;
}
#menu-footer .list-item a:hover{
  color:var(--primary);
}
#downloadApp{
  max-width: 140px;
}
#downloadApp img, .icon-follow{
  transition: all 0.25s ease;
}
#downloadApp img:hover{
  background-color: #FFF;
  border-radius: 100px;
  transform: scale(1.1);
  filter: drop-shadow(0px 0px 6px rgba(0, 0, 0, 0.2));
}

.icon-follow{
  width:45px;
  height:45px;
  border-radius: 10px;
}
.icon-follow:hover{
  background-color: #FFF;
  transform: scale(1.1);
  filter: drop-shadow(0px 0px 6px rgba(0, 0, 0, 0.2));
}

#searchContent{
  position: fixed;
  top:0;
  left:0;
  width: 100%;
  height: 100%;
  background-color:var(--bg-footer);
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s ease-in-out;
}
#searchContent.open{
  background-color:var(--bg-footer);
  opacity: 1;
  pointer-events: fill;
}
#openSearchMobile{
  width:20px;
}
#openSearch, #openSearchMobile button{
  width: 20px;
  height: 20px;
  background: none;
  padding:0;
  border:none;
}
#openSearch svg > path, #closeSearch svg path{
  transition: all 0.25s ease;
}
#openSearch:hover svg > path{
  fill: var(--primary);
}
#closeSearch{
  position:absolute;
  right:1.5rem;
  top: 1.5rem;
  width: 30px;
  height: 30px;
  background: none;
  padding:0;
  border:none;
}
#formSearch{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items:center;
  width: 100%;
  padding:1rem;
}
#formSearch input[type="search"]{
  border:2px solid #d5d5d5;
  border-right:none;
  width: 500px;
  max-width: 100%;
  height: 60px;
  padding:1rem 1rem 1rem 2rem;
  border-radius: 100px 0 0 100px;
  background-color: var(--white);
  color: var(--black);
  font-size: 1.25rem;
  font-weight: 400;
  outline: none;
}
#formSearch input[type="search"]::placeholder{
  color:#d5d5d5;
}
#formSearch button[type="submit" ]{
  background: none;
  border:2px solid #d5d5d5;
  border-left:none;
  margin:0;
  width: 60px;
  height: 60px;
  padding:1rem;
  padding-left:0.25rem;
  border-radius: 0 100px 100px 0;
  background:var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.25s ease-in-out;
}
#formSearch button[type="submit" ] svg{
  width:24px;
  height:24px;
}
#formSearch button[type="submit" ]:hover svg > path{
  fill: var(--primary);

}
#closeSearch:hover svg > path{
  fill: var(--primary);
}
#drowdownLang{
  right:0;
}
#btnLang{
  color:#FFF;
  display: flex;
  align-items: center;
}
#btnLang::after{
  margin-left:.5rem;
}
#navbarHeader .dropdown-menu{
  background-color: rgba(0, 0, 0, 0.5);
}
#navbarHeader .dropdown-menu .dropdown-item{
  min-height: 40px;
  color:var(--white);
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  gap: .5rem;
  font-weight: bold;
}
#navbarHeader .dropdown-menu .dropdown-item:not(.active):hover{
  color:var(--balck);
  background-color:var(--primary);
}
#navbarHeader .dropdown-item.active, #navbarHeader .dropdown-item:active{
  color:var(--primary);
  background-color:unset !important;
}
#navbarHeader .dropdown-item:focus{
  color:var(--primary)!important;
  background:none;
}

#btnHamburger{
  width: 56px;
  height: 40px;
  border-radius: .5rem;
  position: relative;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  /* background-color: var(--primary); */
  box-shadow: none;
  border-color:var(--white);
  margin-right:18px;
}

#btnHamburger span{
  display: block;
  position: absolute;
  height: 2px;
  width: 24px;
  background: #FFF;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
  transform: translateX(-50%);
}
#btnHamburger span:nth-child(1) {
  top: 10px;
  left: 50%;
}

#btnHamburger span:nth-child(2),#btnHamburger span:nth-child(3) {
  top: 18px;
  left: 50%;
}

#btnHamburger span:nth-child(4) {
  top: 26px;
  left: 50%;
}

#btnHamburger[aria-expanded="true"] span:nth-child(1) {
  top: 18px;
  width: 0%;
  left: 50%;
}

#btnHamburger[aria-expanded="true"] span:nth-child(2) {
  left:54%;
  -webkit-transform: rotate(45deg) translate(-45%, 11px);
  -moz-transform: rotate(45deg) translate(-45%, 11px);
  -o-transform: rotate(45deg) translate(-45%, 11px);
  transform: rotate(45deg) translate(-45%, 11px);
}

#btnHamburger[aria-expanded="true"] span:nth-child(3) {
  left:54%;
  -webkit-transform: rotate(-45deg) translate(-45%, -11px);
  -moz-transform: rotate(-45deg) translate(-45%, -11px);
  -o-transform: rotate(-45deg) translate(-45%, -11px);
  transform: rotate(-45deg) translate(-45%, -11px);
}

#btnHamburger[aria-expanded="true"] span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%;
}

main#primary footer{
  background:none;
}
main#primary{
  /* min-height: calc(100dvh - 72px - 400px); */
  /* margin-top:72px; */
  min-height: calc(100dvh - 400px);
  /* padding-top:2.5rem; */
  padding-bottom: 2.5rem;
  color:#f3f3f3;
}
#bannerPage{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 31.25vw;
  max-height:480px;
  min-height:280px;
  position:relative;
}
#bannerPage::after{
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: '';
  z-index: 0;
  background: rgba(18, 18, 18, 5.7);
  background: -webkit-linear-gradient(to bottom,rgba(18, 18, 18, 0.3) 0%, rgba(18, 18, 18, 1) 86%, rgba(18, 18, 18, 1) 100%);
  background: -moz-linear-gradient(to bottom,rgba(18, 18, 18, 0.3) 0%, rgba(18, 18, 18, 1) 86%, rgba(18, 18, 18, 1) 100%);
  background: linear-gradient(to bottom,rgba(18, 18, 18, 0.3) 0%, rgba(18, 18, 18, 1) 86%, rgba(18, 18, 18, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(
    startColorstr="#121212",
    endColorstr="#121212",
    GradientType=0
  );
}
/* #bannerPage .content-lines-wrapper{
  z-index: 1;
}
.content-lines-wrapper {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index:-1;
  pointer-events: none;
}
.content-lines-inner{
  position: absolute;
  width: 1140px;
  left: 50%;
  margin-left: -570px;
  top: 0;
  height: 100%;
  border-left: 1px solid var(--charcoal-gray);
  border-right: 1px solid var(--charcoal-gray);
}
.content-lines {
  position: absolute;
  left: 33.666666%;
  right: 33.666666%;
  height: 100%;
  border-left: 1px solid var(--charcoal-gray);
  border-right: 1px solid var(--charcoal-gray);
} */
.previlege-post-item *, .post-item *{
  transition: ease-in-out 0.3s;
}
.previlege-post-item .post-thumbnail, .tops-news-item .post-thumbnail, .post-item .post-thumbnail{
  width:100%;
  height:auto;
  aspect-ratio: 16/9;
  object-fit: cover;
  object-position: top center;
}
.tops-news-item a h3, .news-post a h3{
  color:var(--white);
  transition : all ease .3s;
}
.tops-news-item a:hover h3, .news-post a:hover h3{
  color:var(--primary);
}
.previlege-post-item{
  background-color:var(--black);
}
/* .privilege-desc{
  position: absolute;
  bottom:-30px;
  left:0;
  width:100%;
  padding:1rem;
  background: linear-gradient(to bottom,rgba(0, 0, 0, 0.01) 2%, rgba(0, 0, 0, 0.75) 90%);
  color:var(--white);
  text-align:center;
  row-gap:.75rem;
}
.privilege-desc > .line{
  width:60px;
  height:1px;
  background: var(--white);
  opacity:.2;
  margin:auto;
  transition: ease-in-out 0.5s;
}
.previlege-post-item:hover .privilege-desc{
  bottom:0;
}
.previlege-post-item:hover .privilege-desc > .line{
  width:100%;
  background:var(--primary);
} */
 .previlege-post-item .privilege-desc{
  color:white;
  margin-top:.5rem;
 }
  .previlege-post-item:hover .privilege-desc{
  color:var(--primary);
 }
.previlege-post-item:hover .post-thumbnail{
  opacity:.5;
}
.post-event-end{
  opacity:.6;
  pointer-events: none !important;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.no-image{
  object-position: center center !important;
}
.previlege-post-item .privilege-post-title{
  color:var(--white);
  font-weight: bold;
  font-size:18px;
}
.previlege-post-item .privilege-post-title:hover{
  color: #AAA;
}

#tabsPrivileges{
  background-color: var(--primary);
  gap:1px;
  border:1px solid var(--primary);
  flex-wrap:nowrap;
  max-width:846px;
  margin-left:auto;
  margin-right:auto;
}
#tabsPrivileges > button{
  border:none;
  min-height:72px;
}
article .post-thumbnail img{
  margin:0 auto;
  max-width: 100%;
  display:block;
  height:auto;
  margin-top:1.5rem;
}
.post-thumbnail[alt~="Placeholder"]{
  object-position:center center !important;
}
.post-date, .post-author{
  line-height:1rem;
}
article img.aligncenter{
  display: block;
  margin:auto;
}
article img.alignleft{
  display: block;
  margin-right:auto;
}
article img.alignright{
  display: block;
  margin-left:auto;
}
.btn-event-register{
  text-align:center;
  padding:.5rem;
  background-color:#404040;
  color:var(--white);
  width:auto;
  position: absolute;
  bottom:0;
  right:0;
  font-weight: bold;
  padding:.5rem 1rem;
  display: flex;
  align-items:center;
  gap:.25rem;
}
.btn-event-register > svg{
  width:16px;
  height:16px;
}
.btn-event-register > svg > path{
  fill:var(--white);
}
.btn-event-register:hover{
  background-color:var(--tertiary);
  color:#404040;
}
.btn-event-register:hover > svg > path{
  fill:#404040;
}


.sub-tops-news-item .post-thumbnail{
  width:200px;
  height:150px;
  object-fit: cover;
  object-position: top center;
  transition: all 1s ease;
}

.tops-news-item .post-thumbnail, .news-post .post-thumbnail, .sub-tops-news-item .post-thumbnail{
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -o-transition: all .5s ease;
  -ms-transition: all .5s ease;
  transition: all .5s ease;

}
.tops-news-item .post-thumbnail:hover, .news-post .post-thumbnail:hover, .sub-tops-news-item .post-thumbnail:hover{
    -webkit-transform: scale(1.09, 1.09);
    transform: scale(1.09, 1.09);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}

.sub-tops-news-item h3{
  color:var(--white);
  transition:all ease .3s;
}
.sub-tops-news-item:hover h3{
  color:var(--primary);
}
.news-post .post-thumbnail{
  width:100%;
  height:auto;
  aspect-ratio: 1/1;
  object-fit: cover;
  object-position: top center;
}



.row-cols-7 > * {
  flex: 0 0 auto;
  width: 14.28%;
}

.row-cols-8 > * {
  flex: 0 0 auto;
  width: 12.5%;
}

.row-cols-9 > * {
  flex: 0 0 auto;
  width: 11.11%;
}

.custom-gallery .gallery-item{
  display: block;
}
.custom-gallery .gallery-item img{
  width:100%;
  height:auto;
  object-fit: cover;
}
.tags-title > span{
  color:var(--primary);
}
.tags{
  display: flex;
  flex-direction: row;
  gap: .5rem;
}

#privileges-search-form, #newsSearchForm{
  padding-bottom:1rem;
  width:500px;
  max-width:100%;
  display:block;
  margin:0 auto;
}
#newsSearchForm{
  width:100%;
}
#privileges-search-form input[type="text"], .search-form input[type="search"], #newsSearchForm input[type="text"], #monthFilter, #yearFilter{
  box-shadow: none;
  outline:none;
  background-color: var(--charcoal-gray);
  color:var(--white);
  border:none;
  border-right:none;
  max-width: 100%;
  height: 60px;
}
.search-form input[type="search"]{
  max-width:427px;
}
#monthFilter.form-select, #yearFilter.form-select{
  background-image: url(../images/download.svg);
}
.search-form .input-group{
  display: flex;
  flex-direction: row;
  gap: 0;
  align-items: center;
  justify-content:center;
}
#privileges-search-form input[type="text"]::placeholder, .search-form input[type="search"]::placeholder, #newsSearchForm input[type="text"]::placeholder{
  color:var(--slate-gray);
}
#privileges-search-form button[type="submit"], #newsSearchForm button[type="submit"]{
  background-color: var(--charcoal-gray);
}
#newsSelectGroup{
  width:100%;
}
.search-form button[type="submit"]{
  background-color: var(--charcoal-gray);
  height:60px;
  padding: .75rem 1.5rem;
}
.tab-btn{
  background-color:var(--black);
  color:var(--primary);
  font-weight: 400;
  padding:.75rem;
}

.tab-panel {
  display: none;
}

.tab-panel.active {
  display: block;
}

.tab-btn.active, .tab-btn:active, .tab-btn:hover{
  font-weight:600;
  color:var(--black);
  background: var(--gold-gradient);
}
.tab-btn:hover{
  /* background:var(--primary); */
  color:var(--white);
}
.row-gap-40{
  row-gap:2.5rem;
}
.row-gap-60{
  row-gap:3.75rem;
}
.pt-60{
  padding-top:3.75rem;
}
.pb-40{
  padding-bottom:2.5rem;
}
.pb-60{
  padding-bottom:3.75rem;
}

.accordion-item{
  background-color: var(--slate-gray);
  border:none;
  border-radius: .5rem !important;
  overflow: hidden;
}
.accordion-item .accordion-button{
  padding:1.5rem;
  background-color:var(--slate-gray);
  color:var(--white);
  box-shadow: none;
  
}
.accordion-button::after{
  filter:invert(1);
}
.accordion-button:not(.collapsed){
  color: var(--primary);
}
.accordion-item .accordion-collapse.show, .accordion-item .accordion-collapse.collapsing{
 color: var(--white);
}

.min-w-btn{
  width:200px;
}
.max-w-btn{
  width:200px;
}
.btn{
  padding:.75rem 1.5rem;
}
.btn-white, .btn-gray, .btn-the1, .btn-gold {
  border: 1px solid;
  border-radius: 0;
  position: relative;
  overflow: hidden;
}

.btn-white {
  border-color: var(--white);
  color: var(--white);
}

.btn-gray {
  border-color: var(--slate-gray);
  color: var(--silver-gray);
  background: var(--slate-gray) !important;
}

.btn-the1{
  border-color: var(--red);
  color: var(--white);
  background: var(--red) !important;
  border-radius:.5rem;
}

.btn-gold{
  border-color: var(--primary);
  color: var(--black);
  background: var(--primary) !important;
}

.btn-white::after, .btn-gray::after, .btn-the1::after, .btn-gold::after {
  content: '';
  position: absolute;
  width: 0;
  height: 100%;
  bottom: 0;
  left: 100%;
  transition: all 0.3s ease;
  z-index: 0;
}

.btn-white::after { background: var(--white); }
.btn-gray::after { background: var(--primary); }
.btn-the1::after { background: #ff0528; }
.btn-gold::after { background: var(--charcoal-gray); }

.btn-white:hover, .btn-white:active,
.btn-gray:hover, .btn-gray:active {
  color: var(--black) !important;
}

.btn-gold:hover{
  color:var(--white) !important;
  border-color:var(--charcoal-gray);
}

.btn-white:hover::after, .btn-gray:hover::after, .btn-the1:hover::after, .btn-gold:hover::after {
  width: 100%;
  left: 0;
  transition: width 0.3s ease;
}

.btn-gray > span, .btn-white > span, .btn-the1 > span, .btn-the1 > img, .btn-gold > span {
   position: relative; 
   z-index: 1; 
}

.tag{
  padding:.25rem 1rem;
  font-size:.875rem;
}
.article{
  transform: translateY(-160px);
  margin-bottom:-160px;
  position:relative;
  z-index:2;
  word-wrap: break-word !important;
  word-break: break-word !important;
}

.event-post .post-thumbnail, .event-post-item .post-thumbnail{
  width:100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  -webkit-transition: all .5s ease;
  -moz-transition: all .5s ease;
  -o-transition: all .5s ease;
  -ms-transition: all .5s ease;
  transition: all .5s ease;
}
.event-post .post-thumbnail:hover, .event-post-item .post-thumbnail:hover{
  -webkit-transform: scale(1.09, 1.09);
  transform: scale(1.09, 1.09);
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  -ms-transition: all 1s ease;
  transition: all 1s ease;
}
.event-start-date{
  font-size:64px;
  line-height:64px;
  background: linear-gradient(to bottom, #F4EDE2, var(--primary), var(--secondary));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.event-readmore{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  color:var(--primary);
}
.event-readmore:hover{
  color:var(--white);
}
.event-readmore::before{
  content:'';
  display:inline-block;
  height:1px;
  width:30px;
  background:var(--primary);
}
.event-btn-register{
  font-size:12px;
  padding:.875rem .75rem;
  min-width: 200px;
}
.event-btn-register span{
  font-size: 16px !important;
  font-weight: bold;
}
.event-btn-register:hover > svg{
  position:relative;
  z-index:1;
}
.event-btn-register > svg > path{
  transition: all ease .3s;
}
.event-btn-register:hover > svg > path{
  fill:var(--white);
}
.event-btn-register > span{
  line-height:.75rem;
}
.list-events{
  display:flex;
  flex-direction: column;
  row-gap:2.5rem;
}
#filterEvents button{
  font-size:1rem;
  border:none;
  background:none;
  color:var(--silver-gray);
  text-transform: capitalize;
  font-size:500;
  position:relative;
  transition: all ease .3s;
}
#filterEvents button:hover{
  color:var(--primary);
}
#filterEvents button.active{
  color:var(--primary);
}
#filterEvents button:after{
  content:'';
  display:block;
  width:0;
  height:1px;
  background:var(--primary);
  position:absolute;
  bottom:0;
  left:50%;
  transition: all ease .3s;
}
#filterEvents button:hover:after, #filterEvents button.active:after{
  width:100%;
  left:0;
  transition: all ease .5s;
}
.pagination-slide{
  position:absolute;
  top:50%;
  left:0;
  width:100%;
  transform: translateY(-50%);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 1rem;
  gap:1rem;
  z-index:1;
  pointer-events: none !important;
}
.pagination-slide > div{
  font-weight:300;
  display:flex;
  align-items:center;
  gap:.5rem;
  opacity:1;
  transition: all ease .3s;
  pointer-events: all !important;
}
.swiper-button-disabled{
  opacity:0 !important;
  pointer-events: none !important;
}
.upcoming-event{
  display:flex;
}
.upcoming-event-item{
  width:25%;
  height:50vh;
  min-height:500px;
  background-color:var(--black);
  position:relative;
  padding:1.5rem;
  overflow: hidden;
  -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}
/* .upcoming-event-item.event-end *{
  opacity: .7;
} */
  
.upcoming-event-item figure{
  position: absolute;
  width: 100%;
  height:100%;
  left:0;
  top:0;
  z-index:0;
}
.upcoming-event-item figure img{
  width:100%;
  height:100%;
  object-fit: cover;
  object-position: top center;
  -webkit-transition: all 8s linear;
  -o-transition: all 8s linear;
  transition: all 8s linear;
}

.upcoming-event-item:before{
  content:'';
  display:block;
  width:100%;
  height:100%;
  background-color:#111111;
  opacity: .7;
  position:absolute;
  top:0;
  left:0;
  z-index:1;
  transition: all ease .5s;
}
.upcoming-event-item:hover{
  cursor: pointer;
}
.upcoming-event-item:hover figure img{
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}
.upcoming-event-item:hover:before{
  opacity: 0;
}
.event-content{
  position: relative;
  z-index:2;
  display:flex;
  flex-direction: column;
  justify-content: flex-end;
  height:100%;
  opacity: 1;
}
.event-content, .event-content *{
  transition: all ease .5s;
}
.upcoming-event-item:hover .event-content{
  opacity: 0;
}
.upcoming-event-item .event-content > h3{
  transform:translateY(0px);
  color:var(--white);
}
.upcoming-event-item:hover .event-content > h3{
  transform:translateY(10px)
}

.upcoming-event-item:hover .event-content > .event-date{
  letter-spacing: 20px;
}
.upcoming-event-item:hover .description{
  transform:translateY(-10px)
}
.upcoming-event-item:after{
  content:'';
  background-image: url(../images/eye-regular.svg);
  background-color:rgba(208, 177, 133, 80%);
  background-repeat: no-repeat;
  background-position: center;
  background-size:32px;
  display:block;
  width:100px;
  height:100px;
  border-radius:100%;
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%) scale(.7);
  opacity: 0;
  z-index:1;
  transition: all ease .5s;
}
.upcoming-event-item.event-end:after {
  content :'EVENT END';
  background-color:#111111e8;
  background-image: unset;
  color:white;
  width:auto;
  height:auto;
  font-size:1.5rem;
  border-radius:0;
  padding:1.5rem;
}
.upcoming-event-item:hover:after{
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

#scrollToTop{
  position:fixed;
  bottom:0rem;
  right:1rem;
  width:40px;
  height:40px;
  border-radius:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor: pointer;
  opacity: 0 !important;
  transition: all ease .3s;
  z-index: 9999;
  border:1px solid var(--primary);
  transition:all ease .3s;
  pointer-events: none;
}

#scrollToTop.scrolled{
  opacity: 1!important;
  bottom:1rem;
  pointer-events: all;
}
#scrollToTop:hover{
  background-color:var(--primary);
  opacity: .6;
}
#scrollToTop svg{
  width:18px;
  height:18px;
}
#scrollToTop svg path{
  fill:var(--primary)
}
#scrollToTop:hover svg path{
  fill:var(--black);
}
ul[data-level="1"] li > a{
  padding-left:2rem;
}
.previlege-post-item .post-desc{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--white);
  opacity: 0;
  transition: all ease .3s;
  text-align:center;
  padding:1rem;
}
.previlege-post-item:hover .post-desc{
  opacity: 1;
}

@media (min-width: 768px) {
  .list-events .event-post:nth-child(even) > .col-12:first-child, .list-events .event-post-item:nth-child(even) > .col-12:first-child{
    order:1;
  }
  #tabsPrivileges > button{
    min-height:unset;
  }
  #scrollToTop{
    right:1.5rem;
  }

  #scrollToTop.scrolled{
    bottom:1.5rem;
  }
  #newsSearchForm{
    max-width:500px;
  }
  #newsSearchForm input[type="text"]{
    max-width:427px;
  }
  #newsSelectGroup{
    width:400px;
  }
}

@media (min-width: 992px) {
  .article{
    transform: translateY(-140px);
    margin-bottom:-140px;
  }
  
}

@media (min-width: 1200px) {
  .article{
    transform: translateY(-220px);
    margin-bottom:-220px;
  }
}

@media (min-width: 1400px) {
  #navbarHeader {
      min-height: 72px;
  }
    .dropdown .dropdown-menu {
    margin-top:0 !important;
    background:transparent !important;
    border:none;
    transition: all 0.3s ease-in-out;
    opacity: 0;
    visibility: hidden;
    padding-top:.25rem;
  }
  .dropdown:hover .dropdown-menu {
    display: block;
    opacity: 1;
    visibility: visible;
    
  }
  .dropdown-menu > li{
    background-color: rgba(0, 0, 0, 0.85);
  }
  .dropdown-menu::before, .dropdown-menu::after {
    background-color: rgba(0, 0, 0, 0.85);
    content: '';
    display: block;
    padding-top:.5rem;
  }
  .dropdown-menu::before{
    border-radius: 1rem 1rem 0 0;
  }
  .dropdown-menu::after{
    border-radius: 0 0 1rem 1rem;
  }
  .navbar-nav .nav-item.dropdown a::after{
    display: none;
  }
}