﻿/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */
@-webkit-keyframes flipOutYtest
{
    from
    {
        -webkit-transform: perspective(1400px);
        transform: perspective(1400px);
    }
    40%
    {
        -webkit-transform: perspective(1400px) rotate3d(0,1,0,60deg);
        transform: perspective(1400px) rotate3d(0,1,0,60deg);
        opacity: 1;
    }
    50%
    {
        -webkit-transform: perspective(1400px) rotate3d(0,1,0,90deg);
        transform: perspective(1400px) rotate3d(0,1,0,90deg);
        opacity: 0;
    }
    to
    {
        -webkit-transform: perspective(1400px) rotate3d(0,1,0,180deg);
        transform: perspective(1400px) rotate3d(0,1,0,180deg);
        opacity: 0;
    }
}
.test
{
    -webkit-animation: flipOutYtest .75s linear;
    animation: flipOutYtest .75s linear;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
@-webkit-keyframes flipInYtest
{
    from
    {
        -webkit-transform: perspective(1400px) rotate3d(0,1,0,-180deg);
        transform: perspective(1400px) rotate3d(0,1,0,-180deg);
        opacity: 0;
    }
    50%
    {
        -webkit-transform: perspective(1400px) rotate3d(0,1,0,-90deg);
        transform: perspective(1400px) rotate3d(0,1,0,-90deg);
        opacity: 0;
    }
    60%
    {
        -webkit-transform: perspective(1400px) rotate3d(0,1,0,-60deg);
        transform: perspective(1400px) rotate3d(0,1,0,-60deg);
        opacity: 1;
    }
    to
    {
        -webkit-transform: perspective(1400px);
        transform: perspective(1400px);
        opacity: 1;
    }
}
.test2
{
    -webkit-animation: flipInYtest .75s linear;
    animation: flipInYtest .75s linear;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.well
{
    width: 480px;
    min-height: 150px;/*  margin: auto;
  min-width: 1250px;
  column-width: 250px;
  -webkit-column-width: 250px;
  -webkit-column-gap: 0px;
  column-gap: 0px;*/
    margin-left: auto;
    margin-right: auto;
    height: auto;
    margin-top: 10%;
}
.well a
{
    color: #fff;
    font-size: 14px;
}
.well .well-item
{
    position: relative;
    float: left;
    width: 85px;
    height: 70px;
    margin: 3%;
    text-align: center;
}
.well .well-item img
{
    width: 100%;
}
.correct
{
    position: absolute;
    width: 100%;
}
.opposite
{
    height: 90px;
    width: 100%;
}
.opposite div
{
    min-height: 250px;
    width: 100%;
}
.opposite-content
{
    display: table;
    width: 100%;
    min-height: 250px;
    background-color: #d95e22;
}
.opposite-content-text
{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    color: #fff;
    font-size: 24px;
}/*<980*/
@media screen and (max-width: 979px)
{
    .well
    {
        width: 60%;
        min-height: 180px;/*  margin: auto;
  min-width: 1250px;
  column-width: 250px;
  -webkit-column-width: 250px;
  -webkit-column-gap: 0px;
  column-gap: 0px;*/
        margin-left: auto;
        margin-right: auto;
        height: auto;
        margin-top: 10%;
    }
    .well .well-item
    {
        position: relative;
        float: left;
        width: 85px;
        height: 70px;
        margin: 3%;
    }
}
