.wtf-table img
{
    max-width: 100%;
    display: block;
    margin: 0 auto;
}
/*-----------------------------------------------------------------------------------------------*/
ul.apps
{
    list-style: none;
    width: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
    min-height: 40px;
}
/*-----------------------------------------------------------------------------------------------*/
ul.apps li
{
    display: inline-block;
    float: left;
    color: white;
    margin: 0 8px;
}
/*-----------------------------------------------------------------------------------------------*/
.see-more
{
    margin: 15px 0;
    display: block;
    text-align: center;
}
/*-----------------------------------------------------------------------------------------------*/
.see-more a
{   
    color: white;
}
/*-----------------------------------------------------------------------------------------------*/
.see-more span
{
    color: white;
    font-size: 9px;
    border: 1px solid transparent;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table
{
    padding: 0 15px;
    text-align: center;
    color: white;
    margin-top: 15px;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .column:after
{
    content: " ";
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
}
.wtf-table .column:hover:after,
.wtf-table .column.active:after{
    display: none;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .active .frame{
    opacity: 1;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame
{
    padding:20px 18px;
    max-height: 140px;
    overflow: hidden;
    cursor: pointer;
    -webkit-transition: height 0.5s;
    transition: max-height 0.5s;
    box-shadow: 0px 0px 50px rgba(0,0,0,0.2);
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame.opened
{
    max-height: 1500px;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame *
{
    pointer-events: none;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame h1,
.wtf-table .frame h2,
.wtf-table .frame h3
{
    padding: 0;
    font-family: "Rational TW bold";
    color: #fddc2e;
    text-align: center;
    margin: 0;
}
/*-----------------------------------------------------------------------------------------------*/
h3.yellow,
p.yellow
{
    color: #fddc2e !important;   
}
/*-----------------------------------------------------------------------------------------------*/
h3.white,
p.white
{
    color: white !important;   
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame h1 span
{
    font-size: 20px;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame .info-group
{
    margin: 35px auto;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .toggle
{
    float: right;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .toggle i
{
    font-size: 24px;
    margin-top: -3px;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame.header
{
    background:#fddc2e;
    color: #3b76b7;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame.data
{
    background:#6f2a7f;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame.comm
{
    background: #a3cd39;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame.gifts
{
    background: #e52686;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame.terms
{
    background: white;
    color: #333;
    text-align: left;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame.terms .title,
.wtf-table .frame.terms .fa
{
    color: #333;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame .title
{
    text-transform: uppercase;
    font-family: "Rational TW bold";
    color: white;
    text-align: left;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame .content
{
    text-align: center;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame .tariff
{
    display: inline-block;
    float: left;
    margin: 0;
    padding: 0;
    font-size: 4.5em;
    color: #e52686;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame.header .title
{
    color: #e52686;
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame.header .money
{
    /*  font-size:15px; */
    font-size: 4vw;
    width:100%;
    display: block;
    text-align: right  
}
/*-----------------------------------------------------------------------------------------------*/
.wtf-table .frame.header .money.price
{
    font-family: "Rational TW bold";
    /*font-size: 28px; */
    font-size: 8vw;
}
/*-----------------------------------------------------------------------------------------------*/
@media screen and ( max-width: 768px)
{
    .wtf-table
    {
        width: 300vw;
        margin-left: -1vw;
        -webkit-transition: margin-left 0.5s;
        transition: margin-left 0.5s;
    }
    /*-------------------------------------------------------------------------------------------*/
    .wtf-table .column
    {
        padding: 0 10vw;
        margin: 0 -5vw;
    }
    /*-------------------------------------------------------------------------------------------*/
    .wtf-table .column:after
    {
        display: none;
    }
    /*-------------------------------------------------------------------------------------------*/
    ul.apps li
    {
        margin: 0 1.5vw;
        width: 10%;
    }
    /*-------------------------------------------------------------------------------------------*/
    .wtf-table .frame .tariff 
    {
        font-size: 8vw;
    }
    /*-------------------------------------------------------------------------------------------*/
    .wtf-table .frame {
        padding: 13px 18px;
        max-height: 30vw;
    }
    /*-------------------------------------------------------------------------------------------*/
    .wtf-table.single-column
    {
        width: 100vw;
        margin-left: -15px;
    }
    .wtf-table.single-column .column
    {
        margin: 0;
    }
}

@media screen and ( min-width: 768px)
{
    .wtf-table .frame .tariff 
    {
        font-size: 30px;
    }
    .wtf-table .frame.header .money.price 
    {
        font-size: 28px;
    }
    .wtf-table .frame.header .money
    {
        font-size: 15px;
    }
}
