/**
 * EDS - Fichier CSS dédié aux MULTIMEDIA pages CONTENU (nodes).
 * Chargé dans le template.tpl.php
 *
 * @file
 */

body.page-node.multimedia h1#page-title { padding-bottom: 20px; }

/*** TOP LEFT ***/

body.page-node.multimedia .group-media { margin-bottom: 40px; }

/* Service links */
body.page-node.multimedia a.service-links-facebook {
  background: url('../../images/multimedia/social/facebook.png') no-repeat;
  background: url('../../images/multimedia/social/facebook.svg') no-repeat;
}
body.page-node.multimedia a.service-links-twitter {
  background: url('../../images/multimedia/social/twitter.png') no-repeat;
  background: url('../../images/multimedia/social/twitter.svg') no-repeat;
}
body.page-node.multimedia a.service-links-google-plus {
  background: url('../../images/multimedia/social/google-plus.png') no-repeat;
  background: url('../../images/multimedia/social/google-plus.svg') no-repeat;
}
body.page-node.multimedia a.service-links-forward {
  background: url('../../images/multimedia/social/mail.png') no-repeat;
  background: url('../../images/multimedia/social/mail.svg') no-repeat;
}

/* Audios */
body.page-node.multimedia.audios .media-soundcloud-audio iframe {
  width: 620px !important;
  height: 350px !important;
}

/* Photos */
body.page-node.multimedia.photos .field-name-field-2-media-photo-flickrset:after { display: none; }
body.page-node.multimedia.photos .flickr-slideshow { height: 350px; padding-bottom: 0; }
body.page-node.multimedia.photos .flickr-slideshow object {
  width: 620px !important;
  height: 350px !important;
}

/* Jeux */
body.page-node.multimedia.jeux .group-media { position: relative; }
body.page-node.multimedia.jeux .group-media .field-name-field-2-media-lien a {
  position: absolute;
  left: 0; top: 0; right: 0; bottom: 0;
  font-size: 1px;
  color: transparent;
  z-index: 10;
}

/* Idées lecture - mise en page spécifique due au format de l'image */
body.page-node.multimedia.idees-lecture .group-header { margin-bottom: 40px; }
body.page-node.multimedia.idees-lecture .field-name-field-2-explorer-il-couv {
  float: left;
  margin-right: 20px;
  -webkit-box-shadow: 15px 0 20px -15px rgba(0,0,0,0.3), -15px 0 20px -15px rgba(0,0,0,0.3);
  box-shadow: 15px 0 20px -15px rgba(0,0,0,0.3), -15px 0 20px -15px rgba(0,0,0,0.3);
}
body.page-node.multimedia.idees-lecture .group-text {
  padding: 20px;
  width: auto; height: 350px;
  overflow: hidden;
  background-color: #f2f1f0;
}
body.page-node.multimedia.idees-lecture .group-infos .field-label { font-weight: normal; }

/*** TOP RIGHT ***/

body.page-node.multimedia .group-top-right { padding: 30px 20px; min-height: 350px; font-size: .95em; }
body.page-node.multimedia .group-top-right .field-label { font-weight: normal; }
body.page-node.multimedia .group-specs {
  margin-bottom: 15px;
  padding-bottom: 15px;
  background: url('../../images/multimedia/tiret.png') left bottom no-repeat;
  background: url('../../images/multimedia/tiret.svg') left bottom no-repeat;
}
body.page-node.multimedia .categorie-contenu {
  display: inline-block;
  margin-bottom: 5px;
  line-height: 1.4;
  background-repeat: no-repeat;
  background-position: right center;
}
body.page-node.multimedia .categorie-contenu:after { display: none; }
body.page-node.multimedia.videos .categorie-contenu {
  padding-right: 27px;
  background-image: url('../../images/common/categorie/video-noir.png');
  background-image: url('../../images/common/categorie/video-noir.svg');
}
body.page-node.multimedia.audios .categorie-contenu {
  padding-right: 23px;
  background-image: url('../../images/common/categorie/audio-noir.png');
  background-image: url('../../images/common/categorie/audio-noir.svg');
}
body.page-node.multimedia.photos .categorie-contenu {
  padding-right: 42px;
  line-height: 1.6;
  background-image: url('../../images/common/categorie/photos-noir.png');
  background-image: url('../../images/common/categorie/photos-noir.svg');
}
body.page-node.multimedia.jeux .categorie-contenu {
  padding-right: 37px;
  background-image: url('../../images/common/categorie/jeux-noir.png');
  background-image: url('../../images/common/categorie/jeux-noir.svg');
}
body.page-node.multimedia.idees-lecture .categorie-contenu {
  padding-right: 21px;
  background-image: url('../../images/common/categorie/article-noir.png');
  background-image: url('../../images/common/categorie/article-noir.svg');
}
body.page-node.multimedia .quantite .field-label { float: left; margin-right: 5px; }
body.page-node.multimedia .quantite .field-items { float: left; }
body.page-node.multimedia .group-infos .field { margin-bottom: 5px; }
body.page-node.multimedia .group-top-right a.full-screen {
  display: block;
  padding-left: 20px;
  background: url('../../images/multimedia/fleche-puce.png') left .25em no-repeat;
  background: url('../../images/multimedia/fleche-puce.svg') left .25em no-repeat;
  line-height: 1.5;
  color: #0ea9a5;
}

/*** BORDER BOTTOM ***/

body.page-node.multimedia .border-bottom { border-bottom-color: #0ea9a5; }

/*** MOTS CLÉS ***/

body.page-node.multimedia .field-name-field-tags .field-label { color: #0ea9a5; }

/*** COMMENTAIRES ***/

a.comments-button {
  background-image: url('../../images/multimedia/commentaires.png');
  background-image: url('../../images/multimedia/commentaires.svg');
}
#comments h2, #comments .comment-form .form-actions input { background-color: #0ea9a5; }
#comments h2:hover,
#comments .comment-form .form-actions input:hover { background-color: #2ec9c5; }
#comments article h3, #comments article .submitted, #comments article .links li a { color: #0ea9a5; }
#comments article .links li a {
  background: url('../../images/multimedia/fleche-puce.png') left top no-repeat;
  background: url('../../images/multimedia/fleche-puce.svg') left .25em no-repeat;
}

/**
 * RESPONSIVE
 */

/*--------- <= 980px ---------*/

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

  #main {
    margin-left: 3% !important;
    margin-right: 3% !important;
    width: 94% !important;
  }
  .backlink { margin-left: 0 !important; }
  body.page-node.multimedia.audios .media-soundcloud-audio iframe,
  .group-media iframe { width: 100% !important; }
  .group-media img { width: 100% !important; height: auto !important;}
  h1#page-title,
  .node-full .group-bottom { padding-left: 0 !important; padding-right: 0 !important; }
  .service-links { padding-left: 0 !important; padding-right: 0 !important; }

}

/*--------- <= 480px ---------*/

@media only screen and (max-width: 480px) {  /* eq. 384px */

  .field-name-field-2-explorer-il-couv { float: none !important; margin-right: 0 !important; }
  .field-name-field-2-explorer-il-couv img { width: 100% !important; height: auto !important; }
  body.page-node.multimedia.idees-lecture .group-text { height: auto; }

}