/* SIZES - MASUREMENTS */

* {
    box-sizing: border-box;
}

.left-5 {
    padding-left: 5px
}

.left-10 {
    padding-left: 10px
}

.left-20 {
    padding-left: 20px
}

.right-5 {
    padding-right: 5px
}

.right-10 {
    padding-right: 10px
}

.right-20 {
    padding-right: 20px
}

.l100 {
    width: 100%;
}

.l75 {
    width: 75%;
}

.l67 {
    width: 66.777%;
}

.l60 {
    width: 60%;
}

.l50 {
    width: 50%;
}

.l40 {
    width: 40%;
}

.l37 {
    width: 37.5%;
}

.l35 {
    width: 35%;
}

.l33 {
    width: 33.333%;
}

.l30 {
    width: 30%;
}

.l25 {
    width: 25%;
}

.l20 {
    width: 20%;
}

.l15 {
    width: 15%;
}

.l10 {
    width: 10%;
}

a[onclick] {
    cursor: pointer;
}

/* SHORT COMMANDS */

.grid-float {
    float: left;
}

.clearfix {
    clear: both;
}

.right {
    float: right;
}

.hid,
.hide,
.l-hide {
    display: none !important;
}

.block {
    display: block;
}

.show,
.l-show {
    display: block !important;
}

.inline-block {
    display: inline-block;
}

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

.img-responsive {
    max-width: 100%;
    display: inline-block;
    vertical-align: top;
}

.trim-text {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* COLUMNS CONTAINER */

.columns-container-5 {
    margin: 0 -5px;
}

.columns-container-5 > .column {
    padding: 0 5px;
    display: inline-block;
    vertical-align: top;
}

.columns-container-10 {
    margin: 0 -10px;
}

.columns-container-10 > .column {
    padding: 0 10px;
    display: inline-block;
    vertical-align: top;
}

.columns-container-15 {
    margin: 0 -15px;
}

.columns-container-15 > .column {
    padding: 0 15px;
    display: inline-block;
    vertical-align: top;
}

.columns-container-20 {
    margin: 0 -20px;
}

.columns-container-20 > .column {
    padding: 0 20px;
    display: inline-block;
    vertical-align: top;
}

.columns-container-25 {
    margin: 0 -25px;
}

.columns-container-25 > .column {
    padding: 0 25px;
    display: inline-block;
    vertical-align: top;
}

.columns-container-30 {
    margin: 0 -30px;
}

.columns-container-30 > .column {
    padding: 0 30px;
    display: inline-block;
    vertical-align: top;
}

.columns-container-35 {
    margin: 0 -35px;
}

.columns-container-35 > .column {
    padding: 0 35px;
    display: inline-block;
    vertical-align: top;
}

.columns-container-40 {
    margin: 0 -40px;
}

.columns-container-40 > .column {
    padding: 0 40px;
    display: inline-block;
    vertical-align: top;
}

/*::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA SCREEN 999 ::::::::::::::::::::::::::::::::::::::::::::::::*/

@media screen and (max-width: 999px) {

    .m-hide,
    .m-hide.l-show,
    .l-show.m-hide {
        display: none !important;
    }

    .m-show,
    .m-show.l-hide,
    .l-hide.m-show {
        display: block !important;
    }

}

/*::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA SCREEN 700 ::::::::::::::::::::::::::::::::::::::::::::::::*/

@media screen and (max-width: 700px) {

    .s-hide,
    .m-show.s-hide,
    .l-hide.m-hide.s-hide {
        display: none !important;
    }

    .s-show,
    .m-hide.s-show,
    .l-hide.m-hide.s-show {
        display: block !important;
    }

}