/* ---------------------------------------------------------------------------- 
Import Fonts
---------------------------------------------------------------------------- */
@font-face {
    font-family: 'KhmerOS_battambang';
    src: url('assets/fonts/KhmerOS_battambang.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
         url('assets/fonts/KhmerOS_battambang.ttf') format('truetype'); /* Chrome 4+, Firefox 4+, Opera 10+, Safari 3—5+ */
  }
  
  @font-face {
    font-family: 'KhmerOSNew-Regular';
    src: url('assets/fonts/KhmerOSNew-Regular.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
         url('assets/fonts/KhmerOSNew-Regular.ttf') format('truetype'); /* Chrome 4+, Firefox 1.+, Opera 10+, Safari 3—5+ */
  }
  
  @font-face {
    font-family: 'VC Light';
    src: url('assets/fonts/VC Light.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
         url('assets/fonts/VC Light.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
  }
  
  @font-face {
    font-family: 'VC Italic';
    src: url('assets/fonts/VC Italic.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
         url('assets/fonts/VC Italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
  }
  @font-face {
    font-family: 'Dangrek';
    src: url('assets/fonts/Dangrek.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
         url('assets/fonts/Dangrek.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
  }
@font-face {
  font-family: 'VC Regular';
  src: url('assets/fonts/VC Regular.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('assets/fonts/VC Regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

@font-face {
  font-family: 'VC Bold';
  src: url('assets/fonts/VC Bold.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('assets/fonts/VC Bold.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

@font-face {
  font-family: 'VC Light';
  src: url('assets/fonts/VC Light.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('assets/fonts/VC Light.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

@font-face {
  font-family: 'VC Italic';
  src: url('assets/fonts/VC Italic.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('assets/fonts/VC Italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}
@font-face {
  font-family: 'Dangrek';
  src: url('assets/fonts/Dangrek.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('assets/fonts/Dangrek.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}


/* ---------------------------------------------------------------------------- 
Typography
---------------------------------------------------------------------------- */
body {font-family: 'VC Regular', Suwannaphum, sans-serif; }
h1, h2, h3, h4, h5, h6 { color: #333333; font-family: 'VC Light', Dangrek, sans-serif;}
p, ul { font-size: 0.95em; line-height: 1.6em; }
p.subheader { color: #333333; font-size: 1.1em; margin-bottom: 1em; }
strong, .strong { font-family: 'VC Bold', Suwannaphum; font-weight: normal; }
em, i { font-family: 'VC Italic'; font-weight: normal; }
ul { list-style: none; margin-left: 0; }
.padding-top { padding-top: 1em; }
.padding-bottom { padding-bottom: 1em; }
.margin-top { margin-top: 1em; }
.margin-botton { margin-bottom: 1em; }


blockquote, blockquote p { color: #555555; line-height: 1.6; font-family: 'VC Light', Suwannaphum, sans-serif; font-size: 1.3em; }
blockquote { border-left: none; }

#lang_sel_list { padding-top: 8px; } /* fix flags position */

/* ---------------------------------------------------------------------------- 
Links
---------------------------------------------------------------------------- */
a, a:visited, a:active { color: #444444; }
#main-nav a: { color: #F07D00; }

p a { font-family: 'VC Bold', Suwannaphum; }
a:hover { color: #F07D00; }
.orange a, a.orange { color: #F07D00; }
.orange a:hover, a.orange:hover { color: #A15300; }


.navigation a, .navigation-single li.page_item { list-style: none; line-height: 1.2em; font-size: 0.9em ; } 
.navigation-single li.page_item a { color: #929398; } 
.navigation-single li.page_item a:hover { color: #F07D00; } 

.grey a.credits { color: #fff; }
/* ---------------------------------------------------------------------------- 
Buttons
---------------------------------------------------------------------------- */
button, .button, a.button { background-color: #fff; border: 1px solid #F07D00; color: #F07D00; padding: 0.5em 1em;}
button:hover, button:focus, .button:hover, .button:focus, a.button:hover, a.button:focus { background-color: #F07D00; color: #fff; }
a.button-inverted { background-color: #F07D00; color: #fff; }
a.button-inverted:hover, a.button-inverted:focus { background-color: #fff; border: 1px solid #F07D00; color: #F07D00;}

/* ---------------------------------------------------------------------------- 
Sign Up Form
---------------------------------------------------------------------------- */
input[type="file"], input[type="checkbox"], input[type="radio"] { margin: 0px; }

/* ---------------------------------------------------------------------------- 
Panels
---------------------------------------------------------------------------- */

.row.collapse > .panel.column, .row.collapse > .panel.columns { padding: 20px; } /* Padding adjustement because of row collapse to stay within the grid */

/* 3 columns */
.panel { border: none;}
.panel h4 {padding: 0; }
.panel-black { background-color: #333333; }
.panel-black h4, .panel-black p, .panel-black a { color: #F2F2F2; font-size: 0.80em;}
.panel-black a:hover { color: #F07D00; }

/* Quote */
.row.collapse > .quote.columns { padding: 30px 50px 0 0; } 
.quote { border-top: 1px solid #DDDDDD; border-bottom: 1px solid #DDDDDD; }
.quote h5 { line-height: 1.8em; }
.quote_symbol { font-size: 6em; padding: 0.3em 0.2em 0 0; }

/* Captions page archives */
dd {background-color: }
.panel.caption{ margin-bottom: 0; }
.panel.caption p; { font-size: 0.9em; }

/* Infos & Contact */
p.caption-img { font-size: 0.8em; padding-top: 0.8em; }
.panel-black p.caption-img { color: #929398; }

/* Infos & Contact */
.panel.infos h4 { line-height: 1.3em;}

/* Captions */
dl dt { margin: 0;}
dd { background-color: #333333; color: #F2F2F2; font-size: 0.8em; padding: 0.3em; }

/* ---------------------------------------------------------------------------- 
About
---------------------------------------------------------------------------- */
.missions p { margin-bottom: 0; font-family: 'KhmerOS_battambang';} /* Fix to align the <hr/> */



/* ---------------------------------------------------------------------------- 
Agenda
---------------------------------------------------------------------------- */
.agenda-panel-title { background-color: #333333; margin-bottom: 0; padding: 0.8em; }
.agenda-panel-title h5 { color: #fff; }

.accordion dd { background-color: #EFEFEF; padding: 0 0 0 5px; border-bottom: 2px solid white;}

.accordion dd > a { padding: 0.3em; }
.accordion dd > a h4 { margin: 0; }

.accordion dd > a p.agenda-date {  color: #777777; font-family: 'VC Light', Suwannaphum, sans-serif; font-size: 1.8em; line-height: 0.7em; margin: 0; padding: 0.2em 0 0 0.5em; }
.accordion dd > a span.agenda-month { font-size: 0.5em; }
.accordion dd .inline-list { margin: 0; }
.accordion dd .inline-list > li { font-size: 0.9em; margin: 0 0.3em 0 0; }

.block-list { margin: 0; display: block; background: orange;}
.block-list > li { font-size: 0.9em; margin: 0 0.3em 0 0;}

.accordion dd .content p { color: #333333; margin-bottom: 0.3em; font-size: 1.1em; font-family: 'KhmerOS_battambang';}
p {
	font-family: 'KhmerOS_battambang';
}
.accordion dd p.title { margin: 0.3em 0em 0em 0em; }
.accordion dd .content.active { background-color : #F2F2F2;}
/* ---------------------------------------------------------------------------- 
Events Colors
---------------------------------------------------------------------------- */
.orange, .event-type.mobile-screenings { color: #F07D00; }
.blue, .event-type.cine-club { color: #005FAA; }
.red, .event-type.cine-saturday { color: #d20c18; }
.red, .event-type.cine-weekday { color: #cc0066; }
.red, .event-type.cine-soiree { color: #a70404; }
.green, .event-type.conferences { color: #50A023; }
.yellow, .event-type.exhibitions { color: #E6B90A; }
.purple, .event-type.memory, .event-type.ciff { color: #55378C; }
.dark-grey, .event-type.other { color: #530202; }
.back, .event-type.app-learning{ color: #555555; }
.grey, .grey a { color: #929398; }
.dark-grey { color: #555555; }
.event-type.indian-cinema-week { color: #116939; }
.event-type.acts-of-memory { color: #000000; }
.event-type.app { color: #000000; }
.event-type.special-screening { color: #555555; }
.event-type.services-archives{ color: #50a023; }
.event-type.production-assistance { color: #f34010; }
.event-type.organise-your-events-at-bophana { color: #e6b90a; }
.event-type.festivals-and-audiovisual-projects { color: #005faa; }


/* borders on agenda left */
dd.other { background-color: #530202; }
dd.cine-soiree { background-color: #a70404; }
dd.cine-club { background-color: #005FAA; }
dd.cine-saturday { background-color: #E10019; }
dd.cine-weekday { background-color: #cc0066; }
dd.exhibitions { background-color: #E6B90A; }
dd.conferences { background-color: #50A023; }
dd.memory, dd.ciff { background-color: #55378C; }
dd.mobile-screenings { background-color: #F07D00; }
dd.indian-cinema-week { background-color: #116939; }
dd.special-screening { background-color: #555; }
dd.services-archives { color: #50a023; }
dd.production-assistance { color: #f34010; }
dd.organise-your-events-at-bophana { color: #e6b90a; }
dd.festivals-and-audiovisual-projects{ color: #005faa; }
dd.acts-of-memory{ background-color: #000; }
dd.app{ background-color: #000; }


/* borders on page event, top image */

.cine-club.event-img { border-top: 5px solid #005FAA; }
.cine-saturday.event-img { border-top: 5px solid #E10019; }
.cine-weekday.event-img { border-top: 5px solid #cc0066; }
.exhibitions.event-img { border-top: 5px solid #E6B90A; }
.conferences.event-img { border-top: 5px solid #50A023; }
.memory.event-img, .ciff.event-img { border-top: 5px solid #55378C; }
.mobile-screenings.event-img { border-top: 5px solid #F07D00; }
.indian-cinema-week.event-img { border-top: 5px solid #116939; }
.acts-of-memory.event-img { border-top: 5px solid #000; }
.app.event-img { border-top: 5px solid #000; }
.special-screening.event-img { border-top: 5px solid #555; }
.services-archives.event-img  { border-top: 5px solid #50a023; }
.production-assistance.event-img  { border-top: 5px solid #f34010; }
.organise-your-events-at-bophana.event-img { border-top: 5px solid #e6b90a; }
.festivals-and-audiovisual-projects.event-img  { border-top: 5px solid #005faa; }


/* ---------------------------------------------------------------------------- 
Nav
---------------------------------------------------------------------------- */
ul#secondary-nav { margin: 0.3em 1em 2em 0; }
#secondary-nav li { margin-left: 1em; }
#secondary-nav a { color: #929298; }
#secondary-nav a:hover { color: #333333; }

#main-nav-container { margin-bottom: 2em;}
#main-nav-container hr, #main-nav-container ul, #main-nav-container li { margin-top: 0; margin-bottom: 0; }
#main-nav-container p { padding-top: 0.4em; }
#main-nav a:hover { }
p {
	text-align: justify;
}
#lang_sel { padding-top: 0.3em; }
/* ---------------------------------------------------------------------------- 
Footer
---------------------------------------------------------------------------- */
.footer_container { background-color: #333333; margin-top: 2em; padding: 2em 0;}
footer img { padding-bottom: 1em; }
footer a, footer a:visited, footer a:active { color: #fff; font-family: 'VC Regular', Suwannaphum, sans-serif; }
footer a:hover { color: #929398; } 
footer p, footer ul { color: #fff; font-size: 0.85em; } 
.footer_title { margin-bottom: 0.8em; } 

/* ---------------------------------------------------------------------------- 
Icons
---------------------------------------------------------------------------- */
.icons span, .icons-footer span, .infos span, .icons-agenda { background: url("assets/img/icon.svg"); display: block; height: 28px; width: 25px; }

/* Header */
ul.icons { padding-top: 0.1em; }
.icons li { margin-left: 0.4em; }

span.icon-facebook { background-position: 0px 0px; }
span.icon-twitter {  background-position: -27px 0px; }
span.icon-instagram {  background-position: -55px 0px; }
span.icon-youtube {  background-position: -85px 0px; }
a:hover .icon-facebook { background-position: 0px -27px; }
a:hover .icon-twitter { background-position: -27px -27px; }
a:hover .icon-instagram { background-position: -55px -27px; }
a:hover .icon-youtube { background-position: -85px -27px; }

/* Agenda */
span.icons-agenda{ height: 17px; margin: 0.2em 0.2em 0 0; width: 15px; }
.icons-agenda.icon-location { background-position: -160px -40px; }
.icons-agenda.icon-time { background-position: -175px -40px; }
.icons-agenda.icon-event { background-position: -190px -40px; margin-top: 0.3em; }

/* Footer */
ul.icons-footer, .icons-footer li { margin-left: 0em; }
.icons-footer li { margin-right: 0.4em; }

.icons-footer span.icon-facebook { background-position: 0px -0px; }
.icons-footer span.icon-twitter {  background-position: -27px -0px; }
.icons-footer span.icon-instagram {  background-position: -55px -0px; }
.icons-footer span.icon-youtube {  background-position: -85px -0px; }
.icons-footer a:hover .icon-facebook { background-position: 0px -28px; }
.icons-footer a:hover .icon-twitter{ background-position: -27px -28px; }
.icons-footer a:hover .icon-instagram{ background-position: -55px -28px; }
.icons-footer a:hover .icon-youtube { background-position: -85px -28px; }

/* Infos & Contact */
.infos span { height: 35px; margin: auto; width: 35px; }
span.icon-address { background-position: -160px 0px; }
span.icon-schedule {  background-position: -187px 0px; }
span.icon-language {  background-position: -230px 0px; }

.ajde_evcal_calendar .calendar_header {
    min-height: 0px;
}

/* text animation */
  animation {
    position: relative;
    overflow: hidden;
    background: linear-gradient(90deg, #F07D00, #F07D00, #F07D00);
    background-repeat: no-repeat;
    background-size: 80%;
    animation: animate 5s linear infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: rgba(224, 30, 30, 0);
  }
  
  @keyframes animate {
    0% {
      background-position: -500%;
    }
    100% {
      background-position: 500%;
    }
  }

@keyframes animate {
  0% {
    background-position: -500%;
  }
  100% {
    background-position: 500%;
  }
}

/*
===========================================================
  Corrected Dropdown Menu CSS for Bophana.org Theme
===========================================================
*/

/* #main-nav-container {
  position: relative;
  z-index: 9999;
}
/* --- 1. Resetting the H4 tag inside the menu --- */
.main-navigation-desktop .menu-item h4 {
  margin: 0;
  padding: 0;
  font-size: 20px;
  font-weight: inherit;
}

/* --- 2. Positioning and Overflow Fix (IMPORTANT FIX!) --- */
/* This rule allows the dropdown to show outside the main menu bar */
.main-navigation-desktop,
.main-navigation-desktop ul#main-nav {
  overflow: visible !important; /* NEW AND CRITICAL RULE */
}

/* This is the anchor for the dropdown. It MUST be relative. */
.main-navigation-desktop .menu-item-has-children {
  position: relative;
}

/* --- 3. Hide the Dropdown Sub-Menu by Default --- */
.main-navigation-desktop .sub-menu {
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  background-color: #ffffff;
  min-width: 250px;
  z-index: 1000;
  padding: 10px 0;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
  border-top: 3px solid #F07D00;
  text-align: left;
}

/* --- 4. Show the Dropdown on Hover --- */
.main-navigation-desktop .menu-item-has-children:hover > .sub-menu {
  display: block !important;
}

/* --- 5. Style the Links Inside the Dropdown --- */
.main-navigation-desktop .sub-menu li {
  list-style: none;
}

.main-navigation-desktop .sub-menu a {
  display: block !important;
  padding: 12px 20px;
  color: #333;
  text-decoration: none;
  font-size: 15px;
  font-weight: normal;
  white-space: nowrap;
}

/* --- 6. Add a Hover Effect for the Dropdown Links --- */
.main-navigation-desktop .sub-menu a:hover {
  background-color: #f5f5f5;
  color: #F07D00;
}
/* --- 7. Mobile Click Dropdown Styles --- */
/* This rule shows the submenu when the parent li has the 'submenu-active' class */
.main-navigation-desktop .menu-item-has-children.submenu-active > .sub-menu {
  display: block;
}

/* (Optional but Recommended) Add an arrow to show which items have submenus */
.main-navigation-desktop .menu-item-has-children > h4 > a::after {
  content: ' ▼';
  font-size: 10px;
  display: inline-block;
  margin-left: 6px;
  vertical-align: middle;
} */

/*
====================================================================
  FIX 1: RESTORE THEME'S RESPONSIVE MENU VISIBILITY
====================================================================
*/

/* --- On DESKTOP screens (640px and wider) --- */
@media screen and (min-width: 640px) {
  /* HIDE the mobile-only top bar */
  .tab-bar.show-for-small-only {
    display: none !important;
  }
  /* SHOW the desktop menu container */
  .show-for-medium-up {
    display: block !important;
  }
}

/* --- On MOBILE screens (up to 639px wide) --- */
@media screen and (max-width: 639px) {
  /* SHOW the mobile-only top bar */
  .main-navigation-mobile {
    position: relative;
    z-index: 9999;
	background: orange;
}
	 #secondary-nav {
    float: none; /* Undo the "right" alignment */
    width: 100%;
    margin-top: 15px; /* Add space above the secondary menu */
    padding-top: 15px; /* Add space below the border */
    border-top: 1px solid #555; /* Add a separator line */
    list-style: none; /* Remove any bullet points */
    padding-left: 0; /* Remove default padding */
  }

  /* --- Target the list items inside the secondary menu --- */
  #secondary-nav li {
    display: block; /* Force items to stack vertically */
    float: none; /* Undo the "inline-list" behavior */
    width: 100%;
    margin: 0; /* Reset any horizontal margins */
  }
  /* HIDE the entire desktop menu container */
  .show-for-medium-up {
    display: none !important;
  }
}


/*
====================================================================
  FIX 2: STYLE THE MOBILE DROPDOWN MENU (This works with your script!)
====================================================================
*/

/* The dropdown container (hidden by default) */
#myDropdown.dropdown-content {
  display: none; /* Hidden by default */
/*   position: absolute; */
  top: 75px; /* Adjust this value if it overlaps or is too far down */
  left: 0;
  background-color: #333; /* Dark background */
  width: 100%;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 9999;
  border-top: 1px solid #F07D00;
}

/* This is the class your JavaScript ADDS to SHOW the menu */
#myDropdown.dropdown-content.show {
  display: block !important;
}

/* Style links and other content inside the mobile dropdown */
#myDropdown .columns {
  padding: 0;
}
#myDropdown a {
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}
#myDropdown a:hover {
  background-color: #555;
}
#myDropdown .icons {
  text-align: center;
  padding: 15px 0;
}
#myDropdown .icons li {
  display: inline-block;
  padding: 0 10px;
}