@import '_variable.scss';

/*padding css*/
@for $i from 1 to 39 {
	.p-#{$i} {
		padding: #{$i}px !important;
	}
	.pb-#{$i} {
		padding-bottom: #{$i}px !important;
	}
	.pt-#{$i} {
		padding-top: #{$i}px !important;
	}
}



@for $i from 1 to 21 {
	.pr-#{$i*2} {
		padding-right: #{$i*2}px !important;
	}
	.pl-#{$i*2} {
		padding-left: #{$i*2}px !important;
	}
}

/*margin css*/
.m-auto {
	margin: auto;
}

/*margin css*/
/*margin top css*/
.mt-10 {
	margin-top: 10px;
}
.mt-20 {
	margin-top: 20px;
}
.mt-50 {
	margin-top: 50px;
}

/*margin css*/
/*margin bottom css*/
.mb-10 {
	margin-bottom: 20px;
}
.mb-24 {
	margin-bottom: 24px;
}

/*margin css*/
/*margin right css*/
.mr-10 {
	margin-right: 10px;
}
.mr-20 {
	margin-right: 20px;
}

/*margin css*/
/*margin left css*/
.ml-10 {
	margin-left: 10px;
}
.ml-20 {
	margin-left: 20px;
}
.ml-35 {
	margin-left: 35px;
}


/*alignment css*/
.align-right {
	text-align: right;
}
.align-center {
	text-align: center !important;
}
.align-left {
	text-align: left;
}

/*width css*/
/*width css in pixel*/
.w-120 {
	width: 120px;
}
.w-130 {
	width: 130px;
}
.w-160 {
	width: 160px;
}
.w-400 {
	width: 400px;
}
.w-500 {
	width: 500px;
}
.w-600 {
	width: 600px;
}

/*width css*/
/*width css in %*/
.w100 {
	width: 100% !important;
}