.panel {
        height: 123px;
        width:100%
        margin: auto;
        position: relative;
        }

.card {
        width: 100%;
        height: 100%;
        -o-transition: all .5s;
        -ms-transition: all .5s;
        -moz-transition: all .5s;
        -webkit-transition: all .5s;
        transition: all .5s;
        -webkit-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        backface-visibility: hidden;
        position: absolute;
        top: 0px;
        left: 0px;
        }



.front {
        z-index: 92;
        background: -webkit-linear-gradient(#014F83, #0453E8); /* For Safari 5.1 to 6.0 */
        background: -o-linear-gradient(#014F83, #0453E8); /* For Opera 11.1 to 12.0 */
        background: -moz-linear-gradient(#014F83, #0453E8); /* For Firefox 3.6 to 15 */
        background: linear-gradient(#014F83, #0453E8); /* Standard syntax */
        color: white;
        font-family: 'Open Sans', Verdana, Arial;
        font-size: 1em;
        text-align: center;
        padding-top: 50px;
        height: 73px;
        }

.back {
        z-index: 91;
        -webkit-transform: rotateY(-180deg);
        -ms-transform: rotateY(-180deg);
        -moz-transform: rotateY(-180deg);
        transform: rotateY(-180deg);
        background-color: #444;
        color: white;
        font-family: 'Open Sans', Verdana, Arial;
        font-size: 1em;
        text-align: center;
        padding-top: 50px;
        height: 73px;
        }
        
        
.leftcard {
        -moz-border-radius: 0px;
        -webkit-border-radius: 0px 0px 0px 37px;
        border-radius: 0px 0px 0px 37px;
        border-left:3px solid #cccccc;
        border-bottom:3px solid #cccccc;
        }
        
.midcard {
        border-bottom:3px solid #cccccc;
        }
        
.rightcard {
        -moz-border-radius: 0px;
        -webkit-border-radius: 0px 0px 37px 0px;
        border-radius: 0px 0px 37px 0px;
        border-right:3px solid #cccccc;
        border-bottom:3px solid #cccccc;
        }
        

.panel:hover .front {
        z-index: 91;
        -webkit-transform: rotateY(180deg);
        -ms-transform: rotateY(180deg);
        -moz-transform: rotateY(180deg);
        transform: rotateY(180deg);
        }

.panel:hover .back {
        z-index: 92;
        -webkit-transform: rotateY(0deg);
        -ms-transform: rotateY(0deg);
        -moz-transform: rotateY(0deg);
        transform: rotateY(0deg);
        }