@-webkit-keyframes showTab{
    from{
        opacity:0;
        -webkit-transform:translateY(10px);
        transform:translateY(10px)
    }
    to{
        opacity:1;
        -webkit-transform:translateY(0);
        transform:translateY(0)
    }
}
@keyframes showTab{
    from{
        opacity:0;
        -webkit-transform:translateY(10px);
        transform:translateY(10px)
    }
    to{
        opacity:1;
        -webkit-transform:translateY(0);
        transform:translateY(0)
    }
}

.tabsy>.tabButton{
    display:inline-block;
    margin-top:1px;
    background:#fff;
    color:#888;
    font-size: 16px;
    text-align:left;
    -webkit-transition:all 250ms ease-in-out;
    transition:all 250ms ease-in-out;
    border-bottom: 2px solid #fff;
}
.tabsy>input{
    display:none;

}
.tabsy>input:checked+label+.tab{
    display:block;

}
.tabsy>input:checked+label+.tab>.content{
    -webkit-animation:showTab 250ms ease-in-out;
    animation:showTab 250ms ease-in-out
}
.tabsy>.tab{
    background:#fff;
    display:none;
}

label.tabButton {
    padding: 8px 0;
    margin-right: 35px;
    margin-bottom: 8px;
}

/*@media screen and (min-width: 768px){*/

.tabsy>.tabButton{text-align: center;}

.tabsy{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap
}
.tabsy>.tabButton{
    -webkit-box-ordinal-group:2;
    -webkit-order:1;
    -ms-flex-order:1;
    order:1;
    -webkit-box-align:start;
    -webkit-align-items:flex-start;
    -ms-flex-align:start;
    align-items:flex-start;
    cursor:pointer;
}

.tabsy>input:checked+label{
    background:#fff;
    color:#0057a6;
    border-bottom: 2px solid #0057a6;
}
.tabsy>.tab{
    -webkit-box-ordinal-group:3;
    -webkit-order:2;
    -ms-flex-order:2;
    order:2
}
/*}*/
