body {
    background-color: white;
    padding: 0;
    margin: 0;
    -webkit-text-size-adjust: none;
}

div.command {
    position: fixed;
    top: 0;
    width: 100%;
    margin: 0;
    padding: 2px;
    background-color: #FEEDDC;
    overflow: hidden;
    z-index: 1;
}

div.pool {
    margin-top: 50px;
}

.sortable { 
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.sortable li {
    margin: 3px 3px 3px 0; 
    padding: 0px; 
    float: left;
}

img.cardimg{
    width: 200px;
    height: 285px;
}

figure {
  margin: 0;
}

li.commander {
}

.container {
    width: 200px;
    height: 285px;
    position: relative;
    -webkit-perspective: 800px;
    -moz-perspective: 800px;
    -o-perspective: 800px;
    perspective: 800px;
}

.card {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transition: -webkit-transform 0.5s;
    -moz-transition: -moz-transform 0.5s;
    -o-transition: -o-transform 0.5s;
    transition: transform 0.5s;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;

}

.card.flipped {
      -webkit-transform: rotateY( 180deg );
         -moz-transform: rotateY( 180deg );
           -o-transform: rotateY( 180deg );
              transform: rotateY( 180deg )

}

.card figure {
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
}

.card .front {
}

.card .back {
    -webkit-transform: rotateY( 180deg );
    -moz-transform: rotateY( 180deg );
    -o-transform: rotateY( 180deg );
    transform: rotateY( 180deg );
}

.cmdcard {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transition: -webkit-transform 0.5s;
    -moz-transition: -moz-transform 0.5s;
    -o-transition: -o-transform 0.5s;
    transition: transform 0.5s;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;

}

.cmdcard.flipped {
      -webkit-transform: rotateY( 180deg );
         -moz-transform: rotateY( 180deg );
           -o-transform: rotateY( 180deg );
              transform: rotateY( 180deg )

}

.cmdcard figure {
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
}

.cmdcard .front {
}

.cmdcard .back {
    -webkit-transform: rotateY( 180deg );
    -moz-transform: rotateY( 180deg );
    -o-transform: rotateY( 180deg );
    transform: rotateY( 180deg );
}
