.noSelect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
* {
    box-sizing: border-box;
}
.display-inline {
    display: inline;
}

.clearfix {
    clear: both;
}

/* Global Margins - margin-# or m# increments of five until 50px then jumps to 50px */

.m0, .margin-0 {
    margin: 0px;
}

.m5, .margin-5 {
    margin: 5px;
}

.m10, .margin-10 {
    margin: 10px;
}

.m15, .margin-15 {
    margin: 15px;
}

.m20, .margin-20 {
    margin: 20px;
}

.m25, .margin-25 {
    margin: 25px;
}

.m30, .margin-30 {
    margin: 30px;
}

.m35, .margin-35 {
    margin: 35px;
}

.m40, .margin-40 {
    margin: 40px;
}

.m45, .margin-45 {
    margin: 45px;
}

.m50, .margin-50 {
    margin: 50px;
}

.m100, .margin-100 {
    margin: 100px;
}

.m150, .margin-150 {
    margin: 150px;
}

.m200, .margin-200 {
    margin: 200px;
}

.m250, .margin-250 {
    margin: 250px;
}

/* Global Padding */

.p0, .padding-0 {
    padding: 0px;
}

.p5, .padding-5 {
    padding: 5px;
}

.p10, .padding-10 {
    padding: 10px;
}

.p15, .padding-15 {
    padding: 15px;
}

.p20, .padding-20 {
    padding: 20px;
}

.p25, .padding-25 {
    padding: 25px;
}

.p30, .padding-30 {
    padding: 30px;
}

.p35, .padding-35 {
    padding: 35px;
}

.p40, .padding-40 {
    padding: 40px;
}

.p45, .padding-45 {
    padding: 45px;
}

.p50, .padding-50 {
    padding: 50px;
}

.p100, .padding-100 {
    padding: 100px;
}

.p150, .padding-150 {
    padding: 150px;
}

.p200, .padding-200 {
    padding: 200px;
}

.p250, .padding-250 {
    padding: 250px;
}

/* Specific Margins */

/* Margin Top - mt# or margin-top-# */

/* These should override the global margins so you can use m50 mt5 or margin-50 margin-top-5, yeah i got bored and just went up in 10s */

.mt-5 {
    margin-top: -5px;
}

.mt-10 {
    margin-top: -10px;
}

.mt-15 {
    margin-top: -15px;
}

.mt-20 {
    margin-top: -20px;
}

.mt0, .margin-top-0 {
    margin-top: 0px;
}

.mt5, .margin-top-5 {
    margin-top: 5px;
}

.mt10, .margin-top-10 {
    margin-top: 10px;
}

.mt20, .margin-top-20 {
    margin-top: 20px;
}

.mt30, .margin-top-30 {
    margin-top: 30px;
}

.mt40, .margin-top-40 {
    margin-top: 40px;
}

.mt50, .margin-top-50 {
    margin-top: 50px;
}

.mt100, .margin-top-100 {
    margin-top: 100px;
}

.mt150, .margin-top-150 {
    margin-top: 150px;
}

.mt200, .margin-top-200 {
    margin-top: 200px;
}

.mt250, .margin-top-250 {
    margin-top: 250px;
}

/* Margin Bottom - mb# or margin-bottom-# */

.mb0, .margin-bottom-0 {
    margin-bottom: 0px;
}

.mb5, .margin-bottom-5 {
    margin-bottom: 5px;
}

.mb10, .margin-bottom-10 {
    margin-bottom: 10px;
}

.mb20, .margin-bottom-20 {
    margin-bottom: 20px;
}

.mb30, .margin-bottom-30 {
    margin-bottom: 30px;
}

.mb40, .margin-bottom-40 {
    margin-bottom: 40px;
}

.mb50, .margin-bottom-50 {
    margin-bottom: 50px;
}

.mb100, .margin-bottom-100 {
    margin-bottom: 100px;
}

.mb150, .margin-bottom-150 {
    margin-bottom: 150px;
}

.mb200, .margin-bottom-200 {
    margin-bottom: 200px;
}

.mb250, .margin-bottom-250 {
    margin-bottom: 250px;
}

/* Margin Left - ml# or margin-left-# */

.ml0, .margin-left-0 {
    margin-left: 0px;
}

.ml5, .margin-left-5 {
    margin-left: 5px;
}

.ml10, .margin-left-10 {
    margin-left: 10px;
}

.ml15, .margin-left-15 {
    margin-left: 15px;
}

.ml20, .margin-left-20 {
    margin-left: 20px;
}

.ml30, .margin-left-30 {
    margin-left: 30px;
}

.ml40, .margin-left-40 {
    margin-left: 40px;
}

.ml50, .margin-left-50 {
    margin-left: 50px;
}

.ml100, .margin-left-100 {
    margin-left: 100px;
}

.ml150, .margin-left-150 {
    margin-left: 150px;
}

.ml200, .margin-left-200 {
    margin-left: 200px;
}

.ml250, .margin-left-250 {
    margin-left: 250px;
}

/* Margin Right - mr# or margin-right-# */

.mr0, .margin-right-0 {
    margin-right: 0px;
}

.mr5, .margin-right-5 {
    margin-right: 5px;
}

.mr10, .margin-right-10 {
    margin-right: 10px;
}

.mr20, .margin-right-20 {
    margin-right: 20px;
}

.mr30, .margin-right-30 {
    margin-right: 30px;
}

.mr40, .margin-right-40 {
    margin-right: 40px;
}

.mr50, .margin-right-50 {
    margin-right: 50px;
}

.mr100, .margin-right-100 {
    margin-right: 100px;
}

.mr150, .margin-right-150 {
    margin-right: 150px;
}

.mr200, .margin-right-200 {
    margin-right: 200px;
}

.mr250, .margin-right-250 {
    margin-right: 250px;
}

/* Specific Padding */

/* Top Padding - pt# or padding-top-# */

.pt0, .padding-top-0 {
    padding-top: 0px;
}

.pt5, .padding-top-5 {
    padding-top: 5px;
}

.pt10, .padding-top-10 {
    padding-top: 10px;
}

.pt20, .padding-top-20 {
    padding-top: 20px;
}

.pt30, .padding-top-30 {
    padding-top: 30px;
}

.pt40, .padding-top-40 {
    padding-top: 40px;
}

.pt50, .padding-top-50 {
    padding-top: 50px;
}

.pt100, .padding-top-100 {
    padding-top: 100px;
}

.pt150, .padding-top-150 {
    padding-top: 150px;
}

.pt200, .padding-top-200 {
    padding-top: 200px;
}

.pt250, .padding-top-250 {
    padding-top: 250px;
}

.pb0, .padding-bottom-0 {
    padding-bottom: 0px;
}

.pb5, .padding-bottom-5 {
    padding-bottom: 5px;
}

.pb10, .padding-bottom-10 {
    padding-bottom: 10px;
}

.pb20, .padding-bottom-20 {
    padding-bottom: 20px;
}

.pb30, .padding-bottom-30 {
    padding-bottom: 30px;
}

.pb40, .padding-bottom-40 {
    padding-bottom: 40px;
}

.pb50, .padding-bottom-50 {
    padding-bottom: 50px;
}

.pb100, .padding-bottom-100 {
    padding-bottom: 100px;
}

.pb150, .padding-bottom-150 {
    padding-bottom: 150px;
}

.pb200, .padding-bottom-200 {
    padding-bottom: 200px;
}

.pb250, .padding-bottom-250 {
    padding-bottom: 250px;
}

.pr0, .padding-right-0 {
    padding-right: 0px;
}

.pr5, .padding-right-5 {
    padding-right: 5px;
}

.pr10, .padding-right-10 {
    padding-right: 10px;
}

.pr20, .padding-right-20 {
    padding-right: 20px;
}

.pr30, .padding-right-30 {
    padding-right: 30px;
}

.pr40, .padding-right-40 {
    padding-right: 40px;
}

.pr50, .padding-right-50 {
    padding-right: 50px;
}

.pr100, .padding-right-100 {
    padding-right: 100px;
}

.pr150, .padding-right-150 {
    padding-right: 150px;
}

.pr200, .padding-right-200 {
    padding-right: 200px;
}

.pr250, .padding-right-250 {
    padding-right: 250px;
}

.pl0, .padding-left-0 {
    padding-left: 0px;
}

.pl5, .padding-left-5 {
    padding-left: 5px;
}

.pl10, .padding-left-10 {
    padding-left: 10px;
}

.pl20, .padding-left-20 {
    padding-left: 20px;
}

.pl30, .padding-left-30 {
    padding-left: 30px;
}

.pl40, .padding-left-40 {
    padding-left: 40px;
}

.pl50, .padding-left-50 {
    padding-left: 50px;
}

.pl100, .padding-left-100 {
    padding-left: 100px;
}

.pl150, .padding-left-150 {
    padding-left: 150px;
}

.pl200, .padding-left-200 {
    padding-left: 200px;
}

.pl250, .padding-left-250 {
    padding-left: 250px;
}

.maxw-50 {
    max-width: 50px;
}

.maxw-60 {
    max-width: 60px;
}

.maxw-70 {
    max-width: 70px;
}

.maxw-80 {
    max-width: 80px;
}

.maxw-90 {
    max-width: 90px;
}

.maxw-100 {
    max-width: 100px;
}

.maxw-120 {
    max-width: 120px;
}

.maxw-150 {
    max-width: 150px;
}

.maxw-175 {
    max-width: 175px;
}

.maxw-200 {
    max-width: 200px;
}

.maxw-250 {
    max-width: 250px;
}

.maxw-300 {
    max-width: 300px;
}

.maxw-400 {
    max-width: 400px;
}

.maxw-500 {
    max-width: 500px;
}

.full-height {
    height: 100%;
}

.full-width {
    width: 100%;
}

/*Text styles*/

.txt-ls-2 {
    letter-spacing: 2px;
}

.txt-ls-3 {
    letter-spacing: 3px;
}

/*ScrollBar*/

/* width */

::-webkit-scrollbar {
    width: 10px;
}

/* Track */

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.02);
}

/* Handle */

::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.05);
}

/* Handle on hover */

/*Foundation*/

@media only screen and (max-width: 40em) {
    .clear-for-small-only {
        float: none;
        clear: both;
    }
}

@media only screen and (min-width: 40.063em) {
    .clear-for-medium-up {
        float: none;
        clear: both;
    }
}

@media only screen and (min-width: 40.063em) and (max-width: 64em) {
    .clear-for-medium-only {
        float: none;
        clear: both;
    }
}

@media only screen and (max-width: 64.063em) {
    .clear-for-large-down {
        float: none;
        clear: both;
    }
}

@media only screen and (min-width: 64.063em) and (max-width: 90em) {
    .clear-for-large {
        float: none;
        clear: both;
    }
}

@media only screen and (min-width: 90.063em) {
    .clear-for-large-up {
        float: none;
        clear: both;
    }
}

@media only screen and (min-width: 90.063em) and (max-width: 120em) {
    .clear-for-xlarge {
        float: none;
        clear: both;
    }
}

@media only screen and (min-width: 120.063em) {
    .clear-for-xxlarge {
        float: none;
        clear: both;
    }
}
