.columns {
    position: relative;
}

.columns > .col-4 {
    width: calc(100% / (12 / 4));
    float: left;
}

.columns > .col-6 {
    width: calc(100% / (12 / 6));
    float: left;
}

/* Utilities */
.invisible { visibility: hidden; }

.hidden { display: none; }

.transparent { opacity: 0; }

/* group = clearfix */
.group:before, .group:after { content: " "; display: table; }

.group:after { clear: both; }

.inline { display: inline-block; *display: inline; *zoom: 1; width: auto; }

.wide { width: 100%; }

.pos-top { top: 0; }

.pos-bottom { bottom: 0; }

.pos-right { right: 0; }

.pos-left { left: 0; }

.z-999 { z-index: 999; }

.z-9999 { z-index: 9999; }

.z-99999 { z-index: 99999; }

.rounded { border-radius: 4px; }

.circle { border-radius: 50%; }

.border { border: solid 1px rgba(0, 0, 0, 0.1); }

.border-top { border-top: solid 1px rgba(0, 0, 0, 0.1); }

.border-bottom { border-bottom: solid 1px rgba(0, 0, 0, 0.1); }

.border-left { border-left: solid 1px rgba(0, 0, 0, 0.1); }

.border-right { border-right: solid 1px rgba(0, 0, 0, 0.1); }

/* Responsive Utilities */
.rel { position: relative; }

.abs { position: absolute; }

.float-none { float: none; }

.float-right { float: right; }

.float-left { float: left; }

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

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

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

.text-dark { color: #234; }

.hidden { display: none; }

.border-0 { border: none; }

.border-top { border-top: solid 1px rgba(0, 0, 0, 0.1); }

.border-bottom { border-bottom: solid 1px rgba(0, 0, 0, 0.1); }

.border-left { border-left: solid 1px rgba(0, 0, 0, 0.1); }

.border-right { border-right: solid 1px rgba(0, 0, 0, 0.1); }

.border-top-0 { border-top: none; }

.border-bottom-0 { border-bottom: none; }

.border-left-0 { border-left: none; }

.border-right-0 { border-right: none; }

.before-hidden:before { display: none; }

.after-hidden:after { display: none; }

/*		Margin      				*/
.m-0 { margin: 0px; }
.m-5 { margin: 5px; }
.m-10 { margin: 10px; }
.m-15 { margin: 15px; }
.m-20 { margin: 20px; }
.m-25 { margin: 25px; }
.m-30 { margin: 30px; }
.m-35 { margin: 35px; }

/*		Margin-left					*/
.ml-3  { margin-left: 3px; }
.ml-5  { margin-left: 5px; }
.ml-10 { margin-left: 10px; }
.ml-15 { margin-left: 15px; }
.ml-20 { margin-left: 20px; }
.ml-25 { margin-left: 25px; }
.ml-30 { margin-left: 30px; }

/*		Margin-right				*/
.mr-3  { margin-right: 3px; }
.mr-5  { margin-right: 5px; }
.mr-10 { margin-right: 10px; }
.mr-15 { margin-right: 15px; }
.mr-20 { margin-right: 20px; }
.mr-25 { margin-right: 25px; }
.mr-30 { margin-right: 30px; }

/*		Margin-Horizontal			*/
.mh-5 	{ margin-left: 5px; margin-right: 5px; }
.mh-10 { margin-left: 10px; margin-right: 10px; }
.mh-15 { margin-left: 15px; margin-right: 15px; }
.mh-20 { margin-left: 20px; margin-right: 20px; }
.mh-25 { margin-left: 25px; margin-right: 25px; }
.mh-30 { margin-left: 30px; margin-right: 30px }

/*		Margin Vertical				*/
.mv-5 	{ margin: 5px 0; }
.mv-10 { margin: 10px 0; }
.mv-15 { margin: 15px 0; }
.mv-20 { margin: 20px 0; }
.mv-25 { margin: 25px 0px; }
.mv-25 { margin:30px 0; }

/*		Margin-bottom			*/
.mb-3  { margin-bottom: 3px; }
.mb-5  { margin-bottom: 5px; }
.mb-10 { margin-bottom: 10px; }
.mb-15 { margin-bottom: 15px; }
.mb-20 { margin-bottom: 20px; }
.mb-25 { margin-bottom: 25px; }
.mb-30 { margin-bottom: 30px; }

/*		Margin-top		*/
.mt-3  { margin-top: 3px; }
.mt-5  { margin-top: 5px; }
.mt-10 { margin-top: 10px; }
.mt-15 { margin-top: 15px; }
.mt-20 { margin-top: 20px; }
.mt-25 { margin-top: 25px; }
.mt-30 { margin-top: 30px; }

/*     Padding                         */
.p-0 { padding: 0px; }
.p-5 { padding: 5px; }
.p-10 { padding: 10px; }
.p-15 { padding: 15px; }
.p-20 { padding: 20px; }
.p-25 { padding: 25px; }
.p-30 { padding: 30px; }
.p-35 { padding: 35px; }

/*		Padding-left					*/
.pl-3  { padding-left: 3px; }
.pl-5  { padding-left: 5px; }
.pl-10 { padding-left: 10px; }
.pl-15 { padding-left: 15px; }
.pl-20 { padding-left: 20px; }
.pl-25 { padding-left: 25px; }
.pl-30 { padding-left: 30px; }

/*		Padding-right				*/
.pr-3  { padding-right: 3px; }
.pr-5  { padding-right: 5px; }
.pr-10 { padding-right: 10px; }
.pr-15 { padding-right: 15px; }
.pr-20 { padding-right: 20px; }
.pr-25 { padding-right: 25px; }
.pr-30 { padding-right: 30px; }

/*		Padding-Horizontal			*/
.ph-5 	{ padding-left: 5px; padding-right: 5px; }
.ph-10 { padding-left: 10px; padding-right: 10px; }
.ph-15 { padding-left: 15px; padding-right: 15px; }
.ph-20 { padding-left: 20px; padding-right: 20px; }
.ph-25 { padding-left: 25px; padding-right: 25px; }
.ph-30 { padding-left: 30px; padding-right: 30px }

/*		Padding Vertical				*/
.pv-5 	{ padding: 5px 0; }
.pv-10 { padding: 10px 0; }
.pv-15 { padding: 15px 0; }
.pv-20 { padding: 20px 0; }
.pv-25 { padding: 25px 0px; }
.pv-25 { padding:30px 0; }

/*		Padding-bottom			*/
.pb-3  { padding-bottom: 3px; }
.pb-5  { padding-bottom: 5px; }
.pb-10 { padding-bottom: 10px; }
.pb-15 { padding-bottom: 15px; }
.pb-20 { padding-bottom: 20px; }
.pb-25 { padding-bottom: 25px; }
.pb-30 { padding-bottom: 30px; }

/*		Padding-top		*/
.pt-3  { padding-top: 3px; }
.pt-5  { padding-top: 5px; }
.pt-10 { padding-top: 10px; }
.pt-15 { padding-top: 15px; }
.pt-20 { padding-top: 20px; }
.pt-25 { padding-top: 25px; }
.pt-30 { padding-top: 30px; }
