/* icons 
-------------------------*/

.iconk, [class^="iconk-"], [class*=" iconk-"] {
	.inline-block;
    max-width: 100%;
	vertical-align: middle;
	padding: 2px;
	margin: 0;
    .box-sizing(border-box);
	
	&[class*="-tiny"], &[class*="-tiny-"] {
		width: 14px;
		height: 14px;
		line-height: 14px;
	}
	
	&[class*="-small"], &[class*="-small-"] {
		width: 20px;
		height: 20px;
		line-height: 20px;
	}

	&[class*="-medium"], &[class*="-medium-"] {
		width: 32px;
		height: 32px;
		line-height: 32px;
	}

	&[class*="-large"], &[class*="-large-"]{
		width: 46px;
		height: 46px;
		line-height: 46px;
	}

	&[class*="-huge"], &[class*="-huge-"]{
		width: 52px;
		height: 52px;
		line-height: 52px;
	}

	&[class*="-giant"], &[class*="-giant-"]{
		width: 64px;
		height: 64px;
		line-height: 64px;
	}
	
	&[class*="-doublegiant"], &[class*="-doublegiant-"]{
		width: 128px;
		height: 128px;
		line-height: 128px;
	}
    
    &[class*="-quadgiant"], &[class*="-quadgiant-"]{
    	width: 256px;
		height: 256px;
		line-height: 256px;
	}
	
	&[class*="-fillWidth"], &[class*="-fillWidth-"]{
		width: 100%;
	}
	
	&[class*="-fillHeight"], &[class*="-fillHeight-"]{
		height: 100%;
	}
	
	&[class*="-fillMajority"], &[class*="-fillMajority-"]{
		width: 75%;
	}
	
	&[class*="-topRight"], &[class*="-topRight-"]{
		position: relative;
		top: -2px;
		line-height: 18px;
		float: right;
		padding: 0;
	}

	&[class*="-widthFollow"], &[class*="-widthFollow-"]{
		width: auto;
	}
	&[class*="-heightFollow"], &[class*="-heightFollow-"]{
		height: auto;
	}

	&[class*="-tight"], &[class*="-tight-"]{
		padding: 1px;
	}
	
	&[class*="-spacebottom"], &[class*="-spacebottom-"]{
		padding-bottom: 20px;
	}
	&[class*="-spacetop"], &[class*="-spacetop-"]{
		padding-top: 20px;
	}
	
}