* {font-family:SEGOE UI,Verdana;}
body {background:#EEEEEE;}
.hidden {display:none;}


.menu {
  position:fixed;
  top:0px;
  left:0px;
  height: 60px;
  width:100%;
  margin:0px;
  padding:1.5rem;
  box-shadow:0 1px 2px #aaa;
  background:white;
  box-sizing: border-box;
  z-index: 10;
}

.menu-content {width:75%;margin:0px auto;}

.search {float:right;display:table;}
.search-input {display:table-cell;}
.search-reset {display:table-cell;width:25px;background:url("/images/reset.png");background-size:contain;cursor:pointer;}

.count {text-align:center;margin-top:70px;}


/*Container et card*/
.container {margin:30px auto;width:80%;}

.card {
  min-height:100px;
  box-sizing: border-box;
  padding:1.5rem;
  box-shadow:0 1px 2px #aaa;
  background:white;
  margin:0 1rem 1rem;
  border-radius:3px;
  user-select:none;
  animation:fly-in-from-left .5s 0s ease both;
  transform-origin:top left;
   position: relative;
}

.card-hidden {display:none;}

.card:nth-child(even){
  animation-name:fly-in-from-right;
  animation-delay:0s;
  transform-origin:top right;
}

@keyframes fly-in-from-left {
  from {
    transform:translateY(15rem) rotate(15deg);
    opacity:0;
  }
}

@keyframes fly-in-from-right {
  from {
    transform:translateY(15rem) rotate(-15deg);
    opacity:0;
  }
}


/*Contenu des cartes*/
.classe {color:#AAAAAA;text-transform:capitalize}
.desc {}
.code {color:#FFB000;font-weight:bold;}
.tarif {position:absolute;top:40%;right:10px;color:#309030;}