.separator{
	height: 1px;
	width: 100%;
	background-color: @color_grey-light;
	margin: 30px 0;

	&.without-border{
		border: none;
	}
}

.placeholder-horizontal{
	width: 100%;
	height: auto;
}

.placeholder-vertical{
	height: 100%;
	width: auto;
}

.helper{
	&.center{ text-align: center; }
	&.left  { text-align: left;   }
	&.right { text-align: right;  }
	&.hide { display: none; }
	&.m0 { margin: 0; }
	&.p0 { padding: 0; }
	&.overflow-hidden-lg{overflow: hidden;}

	&.mb0  { margin-bottom: 0px; }
	&.mb10 { margin-bottom: 10px; }
	&.mb20 { margin-bottom: 20px; }
	&.mb30 { margin-bottom: 30px; }
	&.mb40 { margin-bottom: 40px; }
	&.mb60 { margin-bottom: 60px; }
	&.mb80 { margin-bottom: 80px; }
	&.mb100 { margin-bottom: 100px; }

	&.mr0  { margin-right: 0px; }
	&.mr10 { margin-right: 10px; }
	&.mr20 { margin-right: 20px; }
	&.mr30 { margin-right: 30px; }
	&.mr40 { margin-right: 40px; }
	&.mr60 { margin-right: 60px; }

	&.ml0  { margin-left: 0px; }
	&.ml10 { margin-left: 10px; }
	&.ml20 { margin-left: 20px; }
	&.ml30 { margin-left: 30px; }
	&.ml40 { margin-left: 40px; }
	&.ml60 { margin-left: 58px; }

	&.mt0  { margin-top: 0px; }
	&.mt10 { margin-top: 10px; }
	&.mt20 { margin-top: 20px; }
	&.mt30 { margin-top: 30px; }
	&.mt40 { margin-top: 40px; }
	&.mt60 { margin-top: 60px; }
	
	&.pt0  { padding-top: 0px; }
	&.pt10 { padding-top: 10px; }
	&.pt20 { padding-top: 20px; }
	&.pt30 { padding-top: 30px; }
	&.pt40 { padding-top: 40px; }
	&.pt60 { padding-top: 60px; }
	&.pt80 { padding-top: 80px; }
	&.pt90 { padding-top: 90px; }
	&.pt100 { padding-top: 100px; }
	
	&.pb0  { padding-bottom: 0px; }
	&.pb10 { padding-bottom: 10px; }
	&.pb20 { padding-bottom: 20px; }
	&.pb30 { padding-bottom: 30px; }
	&.pb40 { padding-bottom: 40px; }
	&.pb60 { padding-bottom: 60px; }
	
	&.pl0  { padding-left: 0px; }
	&.pl10 { padding-left: 10px; }
	&.pl20 { padding-left: 20px; }
	&.pl30 { padding-left: 30px; }
	&.pl40 { padding-left: 40px; }
	&.pl60 { padding-left: 60px; }

	&.pr0  { padding-right: 0px; }
	&.pr10 { padding-right: 10px; }
	&.pr20 { padding-right: 20px; }
	&.pr30 { padding-right: 30px; }
	&.pr40 { padding-right: 40px; }
	&.pr60 { padding-right: 60px; }
}

.media-mixin(@break) when (@break = @break-medium){
	.helper{
		&.p0-sm{
			padding: 0;
		}
		&.pt50-sm{
			padding-top: 50px;
		}
	}
}


.media-mixin(@break) when (@break = @break-small){
	.helper{
		&.mb50-sm{
			margin-bottom: 50px;
		}

		&.overflow-hidden-sm{
			overflow: hidden;
		}
	}
}

.media-mixin(@break) when (@break = @break-small-x){
	.helper{
		&.p0-xs{
			padding: 0;
		}
	}
}