/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
body {
  /*background-color: rgb(34, 0, 108);*/
  background-image: url('back-grain_carre.jpg');
  background-repeat: repeat; 
}

@font-face {
  font-family: SuisseIntl;
  src: url('suisseintl-medium.woff2');
}

* {
  
  /*font-family: var(--wp--preset--font-family--suisse-intl) !important;*/
  font-family: SuisseIntl !important;
  color: #FFFFFF !important;
}

/*a {
  cursor: pointer;
}*/

#coupecircuit_menu_sticky {
  background-color: rgba(34, 0, 108, 0.7);
  position: fixed;
  max-width: var(--wp--style--global--content-size);
  width: 100%;
  display: none;
}

.show_small_header {
  display: flex !important;
}

.apropos_main {
  display: flex;
  /*background-color: #000000;*/
}

.programme_main {
  display: flex;
  gap: 1%;
  flex-wrap: wrap; 
}

.programme_main a {
  /*max-width: 20%; 
  width: 18%;*/
  text-decoration: none;
  font-size: 0.7em;
}

.programme_main a img {
  /*width: 210px;*/
  width: 100%;
}

.coupecircuit_contenu_reduit {  
  margin-left: auto !important;
  margin-right: auto !important;
}

.btn-voter a, .btn-voter label, .dvoter a {
  /*margin-bottom: 2rem;*/
  background: #2a2a2a;
  color: var(--font-title-color);;
  display: inline-block;
  font-size: 0.85rem;
  text-transform: uppercase;
  padding: 0.2rem 0.5rem;
  text-decoration: none;
}

.btn-voter a::before, .btn-voter label::before, .dvoter a::before {
    content: "+";
    width: 20px;
    margin-right: 0.3rem;
}

.dvoter a {
  cursor: pointer;
}

.btn-voter {
  display: inline-block; 
}

.btn-voter:nth-of-type(2) {
    margin-right: 2rem;
}

.dvoter,.show {
  /*argin-bottom: 2rem;*/
}

/*.hidden {
  display: none;
}*/

/*.show {
  display: block;
}*/

.titre_jour {
  text-transform: uppercase;
  margin-top: 0.5em;
  margin-bottom: 0.2rem;
  font-size: 1.4rem;
  line-height: 120%;
}

.date_jour, .real_jour, .prod_jour, .synop_jour, .news_input {
  font-size: 1rem;
  line-height: 120%;
}

input[type="text"].news_input {
  color: #000000 !important;
  padding: 0;
  padding-left: 1rem;
}

.synop_jour p {
  margin-top: 0.5rem;
  font-size: 0.9rem;
}

.secallfilms {
  width: 100% !important;
  display:flex;
	gap:4%;
  flex-wrap: wrap;
}

.secallfilms > div {
  width: 48%;
}

.secallfilms .dfilm {
  position: relative;
  margin-top: 2rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid;
}

.secallfilms .dfilm img {
  max-width: 500px;
  width: 100%;
  height: auto;
}

.secallfilms .dfilm a {
  color: #FFFFFF !important;
}

.secallfilms > div, .event-box {
  margin-bottom: 1rem;
  border-bottom: 1px solid;
}

.trailer:hover {
  transform: scale(1.1,1.1);
}

.apropos_main .apropos_block {
  padding: 0;
  margin: 0;
  padding-right: 1em;
  padding-left: 1em;
  width: 100%;
  max-width: 33%;
  border-right: 1px solid #FFFFFF;
}

.apropos_main .apropos_block p span {
  padding: 0.2em;
}

.apropos_main>div:first-child {
  padding-left: 0;
}

.apropos_main>div:last-child {
  border:0;
  padding-right: 0;
}

/*.apropos_main .apropos_block {
  font-size: 0.5em;
}*/

.apropos_main .apropos_block p {
  margin-top: 0.2em;
  padding-top: 0;  
}

.apropos_main .apropos_block p span {
  color: #ffff8d;
  border: 2px solid #ffff8d;
  font-weight: bold;  
}

.apropos_main .apropos_block a {
  color: #ffb6ff !important;
  font-size: 1.5em;
}

 header, footer, main {
  /*max-width: 1200px;*/
  max-width: var(--wp--style--global--content-size);
  margin-left: auto;
  margin-right: auto;
  background-color: rgba(34, 0, 108, 0.7);
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
 }

 .url_footer a {
  text-decoration: none;
 }

 .url_footer a:hover {
  text-decoration: underline;
 }

 /*uniquement pour test. A effacer */
 #coupecircuit_content_video_main {
  position: relative;
  width: 100%;
  height: 36em;
 }

 /*#coupecircuit_content_video {
  position: relative;
  height: 100%;
 }*/

 .coupecircuit_vimeo_wrapper, .coupecircuit_vimeo_interview_wrapper {
  padding-top: 56.25%;
  position: relative;
 }

 .coupecircuit_vimeo_wrapper iframe, .coupecircuit_vimeo_interview_wrapper iframe {
  bottom: 0;
  height: 100%;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
 }

 .coupecircuit_vimeo_interview_wrapper {
  margin-top: 2em;
 }

.coupecircuit_soundcloud_wrapper iframe {
  bottom: 0;  
  left: 0;
  position: relative;
  right: 0;
  top: 0;
  width: 100%;
} 

.cont_accueil_interview {
  margin: 0;
  padding: 0;
  margin-top: 2em;
  display: flex;
  flex-wrap: wrap;  
}

.cont_accueil_interview_left, .cont_accueil_interview_right {
  /*width: 50%;*/
  width: 100%;
}

.cont_accueil_interview_left {
  padding: 0;
  margin: 0;
  /*padding-right: 1em;*/
}

.cont_accueil_interview_left .titre_jour {
  margin-top: 0;
}


.coupe_chaps_vimeo a label {
 cursor: pointer;
}

.wp-block-navigation__responsive-container * {
  color: #000000 !important;
}

.gene_live p {
  padding: 0;
  margin: 0;  
}

.coupecircuit_img_live_wrapper img {
  width: 100% ;
  height: 100%;
}


 @media only screen and (min-device-width: 1400px) {
  body {
    background-image: url('back-grain_modifie.jpg');
    background-repeat: repeat-y;
  }
  .programme_main a {
    font-size: 0.9em;
  }
  
}

@media only screen and (min-device-width: 1200px) {
  .programme_main {
    flex-wrap: nowrap;
  }

  .coupecircuit_contenu_reduit {
    max-width: 60% !important;
  }
}

@media only screen and (min-device-width: 600px) {
  .wp-block-navigation__responsive-container * {
    color: #FFFFFF !important;
  }

  .programme_main a img {
    width: 220px;
  } 

  .cont_accueil_interview {
    flex-wrap: nowrap;  
  }

  .cont_accueil_interview_left, .cont_accueil_interview_right {
    width: 50%;    
  }

  .cont_accueil_interview_left {   
    padding-right: 1em;
  }

  .apropos_main .apropos_block {
    font-size: var(--wp--preset--font-size--medium) !important;
  }

  .apropos_main .apropos_block a {
    font-size: var(--wp--preset--font-size--medium) !important;
  }

  .gene_live p {
    font-size: 0.9em; 
    margin-bottom: 0.2em; 
  }

}

@media only screen and (max-device-width: 628px) {
  .btn-voter {
    margin-top: 0.3em;
    margin-bottom: 0.3em;
  }
}

@media only screen and (max-device-width: 600px) {

  .apropos_main .apropos_block {
    font-size: 0.7em;
  }

  .gene_live p {
    font-size: 0.7em;
    margin-bottom: 0.5em;   
  }
  
}


@media only screen and (max-device-width: 400px) {

  .apropos_main .apropos_block {
    font-size: 0.6em;
  }
}

@media only screen and (max-device-width: 330px) {

  .apropos_main .apropos_block {
    font-size: 0.5em;
  }

}