/* Red Button 
================== */
button.btn.red,
a.btn.red { 
	background: #FF5454;
	color: white;
	
	box-shadow: 0 2px 0 0 #be2e2e;
	-moz-box-shadow: 0 2px 0 0 #be2e2e;
	-webkit-box-shadow: 0 2px 0 0 #be2e2e;
	-o-box-shadow: 0 2px 0 0 #be2e2e;
	-ms-box-shadow: 0 2px 0 0 #be2e2e;
}

button.btn.red:hover,
a.btn.red:hover{ 
	background:#be2e2e; 
	color:#fff; 
}

button.btn.red:hover i,
a.btn.red:hover i{ 
	color:#fff; 
}

/* Yellow Button 
================== */
button.btn.yellow,
a.btn.yellow { 
	background: #FFEE2F;
	color: #857500;
	
	box-shadow: 0 2px 0 0 #E7C335;
	-moz-box-shadow: 0 2px 0 0 #E7C335;
	-webkit-box-shadow: 0 2px 0 0 #E7C335;
	-o-box-shadow: 0 2px 0 0 #E7C335;
	-ms-box-shadow: 0 2px 0 0 #E7C335;
}

button.btn.yellow i,
a.btn.yellow i{ 
	color:#857500; 
}

button.btn.yellow:hover,
a.btn.yellow:hover{ 
	background: #E7C335;
	color: #857500; 
}

button.btn.yellow:hover i,
a.btn.yellow:hover i{ 
	color:#857500; 
}

/* Orange Button 
================== */
button.btn.orange,
a.btn.orange { 
	background: #FD8A20;
	color: #fff;
	
	box-shadow: 0 2px 0 0 #C05F06;
	-moz-box-shadow: 0 2px 0 0 #C05F06;
	-webkit-box-shadow: 0 2px 0 0 #C05F06;
	-o-box-shadow: 0 2px 0 0 #C05F06;
	-ms-box-shadow: 0 2px 0 0 #C05F06;
}

button.btn.orange:hover,
a.btn.orange:hover{ 
	background:#C05F06; 
	color:#fff; 
}

button.btn.orange:hover i,
a.btn.orange:hover i{ 
	color:#fff; 
}

/* #Forms
================================================== */
	textarea, input[type="text"], 
	input[type="password"], 
	input[type="datetime"], 
	input[type="datetime-local"], 
	input[type="date"], 
	input[type="month"],
	input[type="time"],
	input[type="week"],
	input[type="number"], 
	input[type="email"], 
	input[type="url"], 
	input[type="search"], 
	input[type="tel"], 
	input[type="color"]{
		display: block;
		width: 100%;
		border: none;
		background: #f5f5f5;
		height: 40px;
		padding: 0;
		font: 13px "Open Sans", sans-serif;
		outline: none;
		
		transition: all 200ms;
		-moz-transition: all 200ms;
		-webkit-transition: all 200ms;
		
		border-radius: 4px;
		-moz-border-radius: 4px;
		-webkit-border-radius: 4px;
	}
	
	input:hover,
	input:focus {
		background: #ebf1f4;
	}
	
	input::-webkit-input-placeholder {
		color: #34495e;
	}

	input:-moz-placeholder { /* Firefox 18- */
	   color: #34495e;  
	}

	input::-moz-placeholder {  /* Firefox 19+ */
	   color: #34495e;  
	}

	input:-ms-input-placeholder {  
	   color: #34495e;  
	}
	
	
	
/* #Clearing
================================================== */

/* Self Clearing Goodness */
    .container:after {content: "\0020"; display: block; height: 0; clear: both; visibility: hidden;}

/* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
	.clearfix:before,
	.clearfix:after,
	.row:before,
	.row:after {
		content: '\0020';
		display: block;
		overflow: hidden;
		visibility: hidden;
		width: 0;
		height: 0;}
	.row:after,
	.clearfix:after {clear: both;}
	.row,
	.clearfix {zoom: 1;}

	/* You can also use a <br class="clear" /> to clear columns */
	.clear {
		clear: both;
		display: block;
		overflow: hidden;
		visibility: hidden;
		width: 0;
		height: 0;}