/*	BUTTON TYPES
=================*/

	/* base */

		.btn {
			position:relative;
			display:block;
			font-size:14px;
		}
			
	/* type0 */
	
		.btn.type0 {

		}
		
			.btn.type0:hover {
				
			}
			
			.btn.type0.has-icon,
			.btn.type0.arrow-left {
				padding-left:20px;
			}
			
			.btn.type0.arrow-right {
				padding-right:15px;
			}
			
			.btn.type0 .icon-arrow-left,
			.btn.type0 .icon-arrow-right {
				font-size:9px;
			}
			
			.btn.type0 .icon-arrow-left,
			.btn.type0 .icon {
				left:0;
			}
			
			.btn.type0 .icon-arrow-right {
				right:0;
			}
			
			.btn.type0 .icon {
				padding-right:5px;
				line-height:18px;
			}
	
	/* type1 */
		
		.btn.type1 {
            display:inline-block;
			background:url(../../images/layout/button-bg.png) no-repeat;
			padding: 5px 20px;
			color:#062b48;
			border:1px solid #d5d5d5;
			border-radius:4px;
			width:191px;
			box-sizing:border-box;
			height:36px;
			font-weight:500;
			font-size:17px;	
			letter-spacing:-1px;
		}
		
			.btn.type1:hover,
			.btn-block:hover .btn.type1 {
				background:url(../../images/layout/button-bg-hover.png) no-repeat;
				color: #FFF;
			}
			
			.btn.type1 .icon-arrow-left,
			.btn.type1 .icon-arrow-right {
				position: relative;
				float:right;
				right: -15px;
				font-size: 15px;
				display:block;
				padding:6px 0 0 0;
			}
			
			.btn.type1 .icon {
				font-size:18px;
			}
			
			.btn.type1.arrow-left,
			.btn.type1.has-icon {
				padding-left:45px;
			}
			
		
		
	/* type2 */
		
		.btn.type2 {
			background: rgb(202, 60, 60);
			border-bottom:3px solid rgb(162, 20, 20);
			border-radius: 4px;
			color: #FFF;
			padding:6px 12px;
			text-align:center;
			text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
		}
		
			.btn.type2:hover,
			.btn.type2:active,
			.btn-block:hover .btn.type2 {
				background:rgb(222, 80, 80);
				border-color:rgb(182, 40, 40);
			}
			
			.btn.type2:active {
				border-bottom:0;
				border-top:3px solid rgb(182, 40, 40);
			}
		
		
	/* type3 */
		
		.btn.type3 {
			background: rgb(223, 117, 20);
			padding:8px 12px;
			font-weight:300;
			border-radius:20px;
			color:#FFF;
			text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
		}
		
			.btn.type3:hover,
			.btn-block:hover .btn.type3 {
				background: rgb(243, 137, 40);
			}
			
			.btn.type3 .icon {
				font-size:18px;
			}
	
			
	/* type4 */
			
		.btn.type4 {
			background: rgb(66, 184, 221);
			color:#FFF;
			padding:7px 20px;
			border-radius:4px;
			text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
		}
		
			.btn.type4:hover,
			.btn-block:hover .btn.type4{
				background: rgb(86, 204, 241);
			}

			
/*	PROPERTIES
=======================*/

	.btn.text-xs	{	font-size:10px;	}
	.btn.text-s		{	font-size:12px;	}
	.btn.text-m		{	font-size:14px;	}
	.btn.text-l		{	font-size:16px;	}
	.btn.text-xl	{	font-size:18px;	}
	.btn.text-xxl	{	font-size:24px;	}

	/* alignment */
	
		.btn.left {
			float:left;
		}
		
		.btn.right {
			float:right;
		}
		
		.btn.center {
			text-align:center;
		}
		
		
	/* icons & arrows */	
		
		.btn .icon-arrow-left,
		.btn .icon-arrow-right {
			position:absolute;
			padding-top:2px;
			font-size:14px;
			padding-top:4px;
		}
		
		.btn.arrow-left,
		.btn.has-icon {
			padding-left:35px;
		}
		
		.btn.arrow-right {
			padding-right:35px;
		}
		
		.btn .icon-arrow-left {
			left:12px;
		}
		
		.btn .icon-arrow-right {
			right:12px;
		}
			
		.btn .icon {
			position:absolute;
			left:12px;
		}