.clear {clear:both; line-height:0}
#filters, .isotope-mpf {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}

/* Classes générales du portfolio */
.modal-portfolio {overflow:hidden; position:relative; background:#FFF; cursor:pointer}
.modal-portfolio img {max-width:100%; position:relative}
.modal-portfolio .ref-label {position:absolute; width:100%; height:50px; bottom:-50px; z-index:500;}
.modal-portfolio .ref-label-bg {width:100%; height:100%; position:absolute; top:0; left:0}
.modal-portfolio .ref-label-text {font-size:.9em; color:#transparent; height:40px; padding:5px; line-height:1.3em; background:#ffffff; text-align:center}
.modal-portfolio .ref-text-category {display:block; font-family:helvetica, arial, sans-serif; font-size:.8em}

/* Rendu des filtres */
#filters {text-align:center; font-size:.9em}
#filters .button{margin:.3em .3em; background-color:#ffffff; border:1px solid #242424; border-radius:4px 4px 4px45px; color:#000000; cursor:pointer; display:inline-block; padding:.3em 1em; -webkit-transition:all 400ms linear; -moz-transition:all 400ms linear; -ms-transition:all 400ms linear; -o-transition:all 400ms linear; transition:all 400ms linear}
#filters .button:hover {background-color:#ffffff; color:#000000; box-shadow:0 5px 8px -3px #333}
#filters .is-checked {background-color:#ffffff; color:#000000}
.isotope-mpf {margin-top:1em}
.isotope-mpf:after {content:''; display:block; clear:both}
.isotope-mpf .element-item-mpf {margin:1%; width:31%; height:auto; float:left}
.isotope-mpf .element-item-mpf img {width:100%; height:auto; -webkit-transition:all 400ms linear; -moz-transition: all 400ms linear; -ms-transition: all 400ms linear; -o-transition:all 400ms linear; transition: all 400ms linear}

/* Cache la modale par défaut */
.hidden-modal {display:none;}

/* Rendu de la modale (général) */
#simplemodal-container {height:60% !important; width:60%; top:10% !important; color:#333; background-color:#FFF; border:2px solid #666;  position:relative;}
#simplemodal-container .simplemodal-data {padding:8px}
#simplemodal-container a.modalCloseImg {background:url(../img/2x.png) no-repeat; width:25px; height:24px; display:inline; z-index:3200; position:absolute; top:-15px; right:-16px; cursor:pointer}

/* Rendu du contenu de la modale */
#simplemodal-container h2 {padding:.5em 1em 1em; color:#332c2c; border-bottom:1px solid #e5e5e5; margin-bottom:1em}
#simplemodal-container .modal-pf-bloc {padding-bottom:1em; border-bottom:1px solid #e5e5e5}
#simplemodal-container .modal-pf-bloc .modal-pf-img {float:left; width:30%; margin:.2em 2% 0 0}
#simplemodal-container .modal-pf-bloc .modal-pf-img img {width:100%}
#simplemodal-container .modal-pf-bloc .modal-pf-img video {width:100%; max-width:100%; height:auto}
#simplemodal-container .modal-pf-bloc .modal-pf-img .portfolio-video{width:100%;height:100%;padding:0}
#simplemodal-container .modal-pf-bloc .modal-pf-img .portfolio-video-wrap{position:relative;}
#simplemodal-container .modal-pf-bloc .modal-pf-img .portfolio-video-wrap .ratio {display:block;width:100%;height:auto;}
#simplemodal-container .modal-pf-bloc .modal-pf-img .portfolio-video-wrap iframe {position:absolute;top:0;left:0;width:100%; height:100%;}
#simplemodal-container .modal-pf-bloc .modal-pf-content {float:right; width:54%}
#simplemodal-container .modal-pf-bloc .modal-pf-content p {margin-bottom:.6em}
#simplemodal-container .modal-pf-close button {background-color:#fff; border:1px solid #ccc; color:#333; border-radius:5px; font-size:.9em; padding:.3em .6em; cursor:pointer; margin-top:1.2em}
#simplemodal-container .modal-close button:hover {background-color:#e6e6e6}

/* Responsive */
@media (max-width:1024px) {
#simplemodal-container {font-size:.9em; width:75%;}
}
@media (max-width:768px) {
#simplemodal-container {font-size:.9em; width:80%;}
#simplemodal-container .modal-pf-bloc {padding-bottom:2.3em; border-bottom:0}
#simplemodal-container .modal-pf-bloc .modal-pf-img {float:none; width:98%; margin:.2em auto 1em}
#simplemodal-container .modal-pf-bloc .modal-pf-img img {display:block; margin:0 auto}
#simplemodal-container .modal-pf-bloc .modal-pf-content {float:none; width:100%; padding:.2em; margin-top:1em}
#simplemodal-container .modal-pf-close button {left:auto; bottom:.5em; right:1em}
}
@media (max-width:480px) {
#simplemodal-container {font-size:.8em; width:85%;}
}