

/* Filters */

  #filtering
  {
    background-color: #FFF;  
  }

  #filtering a
  {
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    transition-duration: 0.3s;  
  }

  #techniques,
  #styles,
  #disponibilites
  {
    display: none;
  }
  
  ul#filters
  {
    display: block;
    width: 96%;
    background-color: #FFF;
    height: 40px;
    margin-bottom: 5px;
    padding-right: 4%;
  }

  ul#filters li
  {
    float: right;
    display: block;
    line-height: 40px;
    font-size: 12px; } 

    @media screen and ( max-width: 640px ) {  ul#filters li
    {
     font-size: 11px;
     float: left;
    } 

    ul#filters li:last-child
    {
      display: none;
    }
  }

  ul#filters li strong
  {
    display: block;
    line-height: 40px;
    font-size: 12px;
    text-transform: uppercase;
    padding: 0px 25px;
  }  

  ul#filters li a
  {
    display: block;
    font-family: sans-serif;
    text-transform: uppercase;
    text-decoration: none;    
    padding: 0px 25px;
    background: #FFF url('../img/filters-arrows.png') right 17px no-repeat; } 

    @media screen and ( max-width: 640px ) {    ul#filters li a
    {
         padding: 0px 17px 0px 3px;

    } 
  }

  ul#filters li a:hover,
  ul#filters li a.active
  {
    background: #FFF url('../img/filters-arrows.png') right -20px no-repeat;
  }  
  
  ul.filters li a
  {
    display: block;
    float: left;
    margin: 0px 5px 5px 0px;
    font-family: sans-serif;
    text-transform: uppercase;
    text-decoration: none;    
    padding: 0px 25px;
    font-size: 12px;
    background-color: #FFF;
    padding: 10px 15px 8px 15px;   
  }

  ul.filters li a:hover,
  ul.filters li a.active
  {
    background-color: #DDDD4B;
    color: #666;
  }  

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope figure {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  clear: left;
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope figure {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .photo,
.isotope figure.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

.isotope:after {
  content: '';
  display: block;
  clear: both;
}