// Display Flex
@mixin display() {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

// Flex Wrap
@mixin flex-wrap( $args ) {
    -ms-flex-wrap: $args;
    -webkit-flex-wrap: $args;
    flex-wrap: $args;
}

// Justify Content
@mixin justify-content( $args ) {
    -webkit-justify-content: $args;
    justify-content: $args;
}

// Flex Grow
@mixin flex-grow( $args ) {
    -ms-flex-positive: $args;
    -webkit-box-flex: $args;
    -webkit-flex-grow: $args;
    flex-grow: $args;
}

/*------------------------------------------------------------------
Countdown
-------------------------------------------------------------------*/
.oew-countdown-wrap {
    margin: 0 auto;
    text-align: center;

    .oew-countdown-item-wrap {
        padding: 0 8px;
    }

    .oew-countdown-number {
        font-size: 60px;
        color: #333;
    }
}

.oew-countdown-label-block .oew-countdown-wrap {
    @include display();
    @include justify-content( center );
    @include flex-wrap( wrap );

    .oew-countdown-item-wrap {
        @include flex-grow( 1 );
    }

    .oew-countdown-number {
        display: block;
    }

    .oew-countdown-label {
        display: block;
        margin-top: 8px;
    }
}

.oew-countdown-label-inline .oew-countdown-wrap {
    .oew-countdown-item-wrap {
        display: inline-block;
    }

    .oew-countdown-label {
        margin-left: 4px;
    }
}

.oew-countdown-align-left .oew-countdown-wrap {
    margin-left: 0;
}

.oew-countdown-align-right .oew-countdown-wrap {
    margin-right: 0;
}

.oew-countdown-column-1 .oew-countdown-wrap .oew-countdown-item-wrap {
    width: 100%;
}

.oew-countdown-column-2 .oew-countdown-wrap .oew-countdown-item-wrap {
    width: calc( 100% * 1 / 2 );
}

.oew-countdown-column-3 .oew-countdown-wrap .oew-countdown-item-wrap {
    width: calc( 100% * 1 / 3 );
}

.oew-countdown-column-4 .oew-countdown-wrap .oew-countdown-item-wrap {
    width: calc( 100% * 1 / 4 );
}

/* RTL */
body.rtl {
}

/*------------------------------------------------------------------
Responsive
-------------------------------------------------------------------*/
@media only screen and (max-width: 1024px) {
    .oew-tablet-countdown-column-1 .oew-countdown-wrap .oew-countdown-item-wrap {
        width: 100%;
    }

    .oew-tablet-countdown-column-2 .oew-countdown-wrap .oew-countdown-item-wrap {
        width: calc( 100% * 1 / 2 );
    }

    .oew-tablet-countdown-column-3 .oew-countdown-wrap .oew-countdown-item-wrap {
        width: calc( 100% * 1 / 3 );
    }

    .oew-tablet-countdown-column-4 .oew-countdown-wrap .oew-countdown-item-wrap {
        width: calc( 100% * 1 / 4 );
    }
}

@media only screen and (max-width: 767px) {
    .oew-mobile-countdown-column-1 .oew-countdown-wrap .oew-countdown-item-wrap {
        width: 100%;
    }

    .oew-mobile-countdown-column-2 .oew-countdown-wrap .oew-countdown-item-wrap {
        width: calc( 100% * 1 / 2 );
    }

    .oew-mobile-countdown-column-3 .oew-countdown-wrap .oew-countdown-item-wrap {
        width: calc( 100% * 1 / 3 );
    }

    .oew-mobile-countdown-column-4 .oew-countdown-wrap .oew-countdown-item-wrap {
        width: calc( 100% * 1 / 4 );
    }
}