/** ST-Design CSS Framework **/
/** std.css.grid **/
/*

    Type devices and width:

    1. Desktop               1280px - infinity         bl-(number)-d Or bl-(number)
    2. Notebook              992px - 1279px            bl-(number)-n
    3. Tablet                768px - 991px             bl-(number)-t
    4. Mobile-horizontal     576px - 767px             bl-(number)-mh
    5. Mobile-vertical       0px - 576px               bl-(number)-mv

 */
.std.std-container {
    width: 100%;
}

.std.std-container-fix {
    display: block;
    width: 100%;
    clear: both;
}

/**  Default width settings **/
.std.bl-1, .std.bl-2, .std.bl-3, .std.bl-4, .std.bl-5,
.std.bl-1-d, .std.bl-2-d, .std.bl-3-d, .std.bl-4-d, .std.bl-5-d,
.std.bl-1-n, .std.bl-2-n, .std.bl-3-n, .std.bl-4-n, .std.bl-5-n,
.std.bl-1-t, .std.bl-2-t, .std.bl-3-t, .std.bl-4-t, .std.bl-5-t,
.std.bl-1-mh, .std.bl-2-mh, .std.bl-3-mh, .std.bl-4-mh, .std.bl-5-mh,
.std.bl-1-mv, .std.bl-2-mv, .std.bl-3-mv, .std.bl-4-mv, .std.bl-5-mv {
    display: block;
    width: 100%;
}

.std.bl-2, .std.bl-3, .std.bl-4, .std.bl-5,
.std.bl-2-d, .std.bl-3-d, .std.bl-4-d, .std.bl-5-d,
.std.bl-2-n, .std.bl-3-n, .std.bl-4-n, .std.bl-5-n,
.std.bl-2-t, .std.bl-3-t, .std.bl-4-t, .std.bl-5-t,
.std.bl-2-mh, .std.bl-3-mh, .std.bl-4-mh, .std.bl-5-mh,
.std.bl-2-mv, .std.bl-3-mv, .std.bl-4-mv, .std.bl-5-mv {
    float: left;
}


/** Adaptive Settings **/
/**  Desktop **/
@media screen and (min-width: 1280px) {

    .std.bl-1, .std.bl-1-d {
        max-width: 100%;
    }

    .std.bl-2, .std.bl-2-d {
        max-width: 50%;
    }

    .std.bl-3, .std.bl-3-d {
        max-width: 33.33333333%;
    }

    .std.bl-4, .std.bl-4-d {
        max-width: 25%;
    }

    .std.bl-5, .std.bl-5-d {
        max-width: 20%;
    }

    /**  Hidden blocks **/
    .std.bl-1-hidden, .std.bl-2-hidden, .std.bl-3-hidden, .std.bl-4-hidden, .std.bl-5-hidden,
    .std.bl-1-d-hidden, .std.bl-2-d-hidden, .std.bl-3-d-hidden, .std.bl-4-d-hidden, .std.bl-5-d-hidden {
        display: none !important;
    }
}

/**  Notebook **/
@media screen and (max-width: 1279px) {

    .std.bl-1-n {
        max-width: 100%;
    }

    .std.bl-2-n {
        max-width: 50%;
    }

    .std.bl-3-n {
        max-width: 33.33333333%;
    }

    .std.bl-4-n {
        max-width: 25%;
    }

    .std.bl-5-n {
        max-width: 20%;
    }

    /**  Hidden blocks **/
    .std.bl-1-n-hidden, .std.bl-2-n-hidden, .std.bl-3-n-hidden, .std.bl-4-n-hidden, .std.bl-5-n-hidden {
        display: none !important;
    }
}

/**  Tablet settings  **/
@media screen and (max-width: 991px) {

    .std.bl-1-t {
        max-width: 100%;
    }

    .std.bl-2-t {
        max-width: 50%;
    }

    .std.bl-3-t {
        max-width: 33.33333333%;
    }

    .std.bl-4-t {
        max-width: 25%;
    }

    .std.bl-5-t {
        max-width: 20%;
    }

    /**  Hidden blocks **/
    .std.bl-1-t-hidden, .std.bl-2-t-hidden, .std.bl-3-t-hidden, .std.bl-4-t-hidden, .std.bl-5-t-hidden {
        display: none !important;
    }
}

/**  Mobile-horizontal settings  **/
@media screen  and (max-width: 767px) {

    .std.bl-1-mh {
        max-width: 100%;
    }

    .std.bl-2-mh {
        max-width: 50%;
    }

    .std.bl-3-mh {
        max-width: 33.33333333%;
    }

    .std.bl-4-mh {
        max-width: 25%;
    }

    .std.bl-5-mh {
        max-width: 20%;
    }

    /**  Hidden blocks **/
    .std.bl-1-mh-hidden, .std.bl-2-mh-hidden, .std.bl-3-mh-hidden, .std.bl-4-mh-hidden, .std.bl-5-mh-hidden {
        display: none !important;
    }
}

/**  Mobile-vertical settings  **/
@media screen and (max-width: 575px) {
    /**  Hidden blocks **/
    .std.bl-1-mv-hidden, .std.bl-2-mv-hidden, .std.bl-3-mv-hidden, .std.bl-4-mv-hidden, .std.bl-5-mv-hidden {
        display: none !important;
    }
}