﻿/*******************************\ 
  IMPORTANT! Most commonly used 
\*******************************/
.full-width {
	width: 100%;
}

.half-width {
	width: 50%;
}

.max-width {
	max-width: 100%;
}

.center {
	display: block;
	margin: auto;
}

.no-border {
	border: none !important;
}

.no-curve {
	-webkit-border-radius: 0 !important;
	-moz-border-radius: 0 !important;
	border-radius: 0 !important;
}

/*******************************\ 
            Spacing 
\*******************************/
.gap {
	height: 20px;
	width: 100%
}
/* to be use with <div> since <br> is a bad practice... */
.gap-sm {
	height: 10px;
	width: 100%
}

.gap-md {
	height: 40px;
	width: 100%
}

.gap-lg {
	height: 80px;
	width: 100%
}

/*******************************\ 
   Directional Margin Spacing 
\*******************************/
/* Margin ALL */
.m0 {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

.m10 {
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
}

.m20 {
	margin-top: 20px;
	margin-right: 20px;
	margin-bottom: 20px;
	margin-left: 20px;
}

.m30 {
	margin-top: 30px;
	margin-right: 30px;
	margin-bottom: 30px;
	margin-left: 30px;
}

.m40 {
	margin-top: 40px;
	margin-right: 40px;
	margin-bottom: 40px;
	margin-left: 40px;
}

.m50 {
	margin-top: 50px;
	margin-right: 50px;
	margin-bottom: 50px;
	margin-left: 50px;
}

.m60 {
	margin-top: 60px;
	margin-right: 60px;
	margin-bottom: 60px;
	margin-left: 60px;
}

.m70 {
	margin-top: 70px;
	margin-right: 70px;
	margin-bottom: 70px;
	margin-left: 70px;
}

.m80 {
	margin-top: 80px;
	margin-right: 80px;
	margin-bottom: 80px;
	margin-left: 80px;
}

.m90 {
	margin-top: 90px;
	margin-right: 90px;
	margin-bottom: 90px;
	margin-left: 90px;
}

.m100 {
	margin-top: 100px;
	margin-right: 100px;
	margin-bottom: 100px;
	margin-left: 100px;
}

/* Margin Top */
.mt0 {
	margin-top: 0px;
}

.mt10 {
	margin-top: 10px;
}

.mt20 {
	margin-top: 20px;
}

.mt30 {
	margin-top: 30px;
}

.mt40 {
	margin-top: 40px;
}

.mt50 {
	margin-top: 50px;
}

.mt60 {
	margin-top: 60px;
}

.mt70 {
	margin-top: 70px;
}

.mt80 {
	margin-top: 80px;
}

.mt90 {
	margin-top: 90px;
}

.mt100 {
	margin-top: 100px;
}

/* Margin Right */
.mr0 {
	margin-right: 0px;
}

.mr10 {
	margin-right: 10px;
}

.mr20 {
	margin-right: 20px;
}

.mr30 {
	margin-right: 30px;
}

.mr40 {
	margin-right: 40px;
}

.mr50 {
	margin-right: 50px;
}

.mr60 {
	margin-right: 60px;
}

.mr70 {
	margin-right: 70px;
}

.mr80 {
	margin-right: 80px;
}

.mr90 {
	margin-right: 90px;
}

.mr100 {
	margin-right: 100px;
}

/* Margin Bottom */
.mb0 {
	margin-bottom: 0px
}

.mb10 {
	margin-bottom: 10px
}

.mb20 {
	margin-bottom: 20px
}

.mb30 {
	margin-bottom: 30px
}

.mb40 {
	margin-bottom: 40px
}

.mb50 {
	margin-bottom: 50px
}

.mb60 {
	margin-bottom: 60px
}

.mb70 {
	margin-bottom: 70px
}

.mb80 {
	margin-bottom: 80px
}

.mb90 {
	margin-bottom: 90px
}

.mb100 {
	margin-bottom: 100px
}

/* Margin Left */
.ml0 {
	margin-left: 0px;
}

.ml10 {
	margin-left: 10px;
}

.ml20 {
	margin-left: 20px;
}

.ml30 {
	margin-left: 30px;
}

.ml40 {
	margin-left: 40px;
}

.ml50 {
	margin-left: 50px;
}

.ml60 {
	margin-left: 60px;
}

.ml70 {
	margin-left: 70px;
}

.ml80 {
	margin-left: 80px;
}

.ml90 {
	margin-left: 90px;
}

.ml100 {
	margin-left: 100px;
}

/*******************************\ 
   Directional Padding Spacing 
\*******************************/
/* Padding ALL */
.p0 {
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

.p10 {
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
}

.p20 {
	padding-top: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	padding-left: 20px;
}

.p30 {
	padding-top: 30px;
	padding-right: 30px;
	padding-bottom: 30px;
	padding-left: 30px;
}

.p40 {
	padding-top: 40px;
	padding-right: 40px;
	padding-bottom: 40px;
	padding-left: 40px;
}

.p50 {
	padding-top: 50px;
	padding-right: 50px;
	padding-bottom: 50px;
	padding-left: 50px;
}

.p60 {
	padding-top: 60px;
	padding-right: 60px;
	padding-bottom: 60px;
	padding-left: 60px;
}

.p70 {
	padding-top: 70px;
	padding-right: 70px;
	padding-bottom: 70px;
	padding-left: 70px;
}

.p80 {
	padding-top: 80px;
	padding-right: 80px;
	padding-bottom: 80px;
	padding-left: 80px;
}

.p90 {
	padding-top: 90px;
	padding-right: 90px;
	padding-bottom: 90px;
	padding-left: 90px;
}

.p100 {
	padding-top: 100px;
	padding-right: 100px;
	padding-bottom: 100px;
	padding-left: 100px;
}

/* Padding Top */
.pt0 {
	padding-top: 0px;
}

.pt5 {
	padding-top: 5px;
}

.pt10 {
	padding-top: 10px;
}

.pt20 {
	padding-top: 20px;
}

.pt30 {
	padding-top: 30px;
}

.pt40 {
	padding-top: 40px;
}

.pt50 {
	padding-top: 50px;
}

.pt60 {
	padding-top: 60px;
}

.pt70 {
	padding-top: 70px;
}

.pt80 {
	padding-top: 80px;
}

.pt90 {
	padding-top: 90px;
}

.pt100 {
	padding-top: 100px;
}

/* Padding Right */
.pr0 {
	padding-right: 0px;
}

.pr5 {
	padding-right: 5px;
}

.pr10 {
	padding-right: 10px;
}

.pr20 {
	padding-right: 20px;
}

.pr30 {
	padding-right: 30px;
}

.pr40 {
	padding-right: 40px;
}

.pr50 {
	padding-right: 50px;
}

.pr60 {
	padding-right: 60px;
}

.pr70 {
	padding-right: 70px;
}

.pr80 {
	padding-right: 80px;
}

.pr90 {
	padding-right: 90px;
}

.pr100 {
	padding-right: 100px;
}

/* Padding Bottom */
.pb0 {
	padding-bottom: 0px
}

.pb5 {
	padding-bottom: 5px;
}

.pb10 {
	padding-bottom: 10px
}

.pb20 {
	padding-bottom: 20px
}

.pb30 {
	padding-bottom: 30px
}

.pb40 {
	padding-bottom: 40px
}

.pb50 {
	padding-bottom: 50px
}

.pb60 {
	padding-bottom: 60px
}

.pb70 {
	padding-bottom: 70px
}

.pb80 {
	padding-bottom: 80px
}

.pb90 {
	padding-bottom: 90px
}

.pb100 {
	padding-bottom: 100px
}

/* Padding Left */
.pl0 {
	padding-left: 0px;
}

.pl5 {
	padding-left: 5px;
}

.pl10 {
	padding-left: 10px;
}

.pl20 {
	padding-left: 20px;
}

.pl30 {
	padding-left: 30px;
}

.pl40 {
	padding-left: 40px;
}

.pl50 {
	padding-left: 50px;
}

.pl60 {
	padding-left: 60px;
}

.pl70 {
	padding-left: 70px;
}

.pl80 {
	padding-left: 80px;
}

.pl90 {
	padding-left: 90px;
}

.pl100 {
	padding-left: 100px;
}
