body{
	color:#4a5b65;
	font-family: "Roboto", Arial, sans-serif;
	font-size:14px;
	line-height: 20px;
}


h1, h2, h3, h4, h5, h6 {
	color:#6f828d;
	line-height: 1.6;
	margin-bottom:0.6em;
	margin-top:0.3em;
}

h1{font-family:"Roboto Condensed", Arial, sans-serif;font-size: 30px;}
h2{font-family:"Roboto Condensed", Arial, sans-serif;font-size: 24px;}
h3{font-family:"Roboto Condensed", Arial, sans-serif;font-size: 18px;}
h4{font-size: 14px;font-weight: 900;}
h5{font-family:"Roboto Condensed", Arial, sans-serif;font-size: 14px;font-weight: 300;}
h6{font-family:"Roboto Condensed", Arial, sans-serif;font-size: 14px;font-weight: 300; font-style: italic;}


	/* Links */
	a{color:#f65543;}
	a:hover{color:#cf200c;}


/* Buttons
================================================== */
input[type="button"],
input[type="submit"],
.button{
	background-color:#2ea1f2;
	border:0;
	border-radius: 4px;
	box-shadow:inset 0 -4px 0 0 #0e82d3;
	color:#fff;
	cursor:pointer;
	display:inline-block;
	font-family: "Roboto", Arial, sans-serif;
	font-size:14px;
	font-weight: 500;
	line-height: normal;
	margin:10px;
	padding:12px 20px 14px;
	text-align: center;
	-webkit-transition: background-color .2s linear;
	   -moz-transition: background-color .2s linear;
	     -o-transition: background-color .2s linear;
		    transition: background-color .2s linear;
			
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;  
}

input[type="button"].fullwidth,
input[type="submit"].fullwidth,
.button.fullwidth {
	width: 100%;
}


input[type="button"]:hover,
input[type="submit"]:hover,
.button:hover{
	color:#fff;
}

	input[type="button"].blue,  input[type="submit"].blue,  .button.blue   {background-color:#2ea1f2;box-shadow:inset 0 -4px 0 0 #0e82d3;}
	input[type="button"].green, input[type="submit"].green, .button.green  {background-color:#54db8c;box-shadow:inset 0 -4px 0 0 #25c266;}
	input[type="button"].red,   input[type="submit"].red,   .button.red    {background-color:#f65543;box-shadow:inset 0 -4px 0 0 #e13522;}
	input[type="button"].smoke, input[type="submit"].smoke, .button.smoke  {background-color:#ccd7dd;box-shadow:inset 0 -4px 0 0 #b3c4ce;}
	input[type="button"].yellow,input[type="submit"].yellow,.button.yellow {background-color:#eec52b;box-shadow:inset 0 -4px 0 0 #dcb00a;}
	input[type="button"].black, input[type="submit"].black, .button.black  {background-color:#2a2a2a;box-shadow:inset 0 -4px 0 0 #000000;}

	/* Hover State */
	input[type="button"].blue:hover,  input[type="submit"].blue:hover,  .button.blue:hover   {background-color:#0e82d3;box-shadow:inset 0 -4px 0 0 #026eba;}
	input[type="button"].green:hover, input[type="submit"].green:hover, .button.green:hover  {background-color:#25c266;box-shadow:inset 0 -4px 0 0 #16b257;}
	input[type="button"].red:hover,   input[type="submit"].red:hover,   .button.red:hover    {background-color:#e13522;box-shadow:inset 0 -4px 0 0 #cf200c;}
	input[type="button"].smoke:hover, input[type="submit"].smoke:hover, .button.smoke:hover  {background-color:#b3c4ce;box-shadow:inset 0 -4px 0 0 #a3b5bf;}
	input[type="button"].yellow:hover,input[type="submit"].yellow:hover,.button.yellow:hover {background-color:#dcb00a;box-shadow:inset 0 -4px 0 0 #cea302;}
	input[type="button"].black:hover, input[type="submit"].black:hover, .button.black:hover  {background-color:#000000;box-shadow:inset 0 -4px 0 0 #000000;}

	/* Active State */
	input[type="button"].blue:active,  input[type="submit"].blue:active,  .button.blue:active,
	input[type="button"].blue.active,  input[type="submit"].blue.active,  .button.blue.active   
	{background-color:#0e82d3;box-shadow: inset 0 3px 0 0 #026eba;}
	input[type="button"].green:active, input[type="submit"].green:active, .button.green:active,
	input[type="button"].green.active, input[type="submit"].green.active, .button.green.active  
	{background-color:#25c266;box-shadow: inset 0 3px 0 0 #16b257;}
	input[type="button"].red:active,   input[type="submit"].red:active,   .button.red:active,
	input[type="button"].red.active,   input[type="submit"].red.active,   .button.red.active
	{background-color:#e13522;box-shadow: inset 0 3px 0 0 #cf200c;}
	input[type="button"].smoke:active, input[type="submit"].smoke:active, .button.smoke:active,
	input[type="button"].smoke.active, input[type="submit"].smoke.active, .button.smoke.active
	{background-color:#b3c4ce;box-shadow: inset 0 3px 0 0 #a3b5bf;}
	input[type="button"].yellow:active,input[type="submit"].yellow:active,.button.yellow:active,
	input[type="button"].yellow.active,input[type="submit"].yellow.active,.button.yellow.active
	{background-color:#dcb00a;box-shadow: inset 0 3px 0 0 #cea302;}	
	input[type="button"].black:active, input[type="submit"].black:active, .button.black:active,
	input[type="button"].black.active, input[type="submit"].black.active, .button.black.active
	{background-color:#000000;box-shadow:inset 0 -4px 0 0 #000000;}


input[type="button"]:disabled,
input[type="submit"]:disabled{
	background-color:#ededed;
	box-shadow:inset 0 -4px 0 0 #dedede;
	color:#d3d7d9;
	cursor:default;
}

input[type="button"].large,
input[type="submit"].large,
.large{
	font-size:16px;
	padding:18px 40px 20px;
}


/* Button Group
================================================== */
.button-group{
	height: auto;
	list-style: none;
	overflow: hidden;
	margin: 10px 0;
	padding:0;
}

.button-group .button{
	border-left:1px solid #0e82d3;
	border-radius:0;	
	float:left;
	margin:0;
}

.button-group li:first-child .button{
	border:none;
	border-bottom-left-radius: 4px;
	border-top-left-radius: 4px;
}

.button-group li:last-child .button{
	border-bottom-right-radius: 4px;
	border-top-right-radius: 4px;
}


.button-group .blue   {border-left-color:#0e82d3;}
.button-group .green  {border-left-color:#25c266;}
.button-group .red    {border-left-color:#e13522;}
.button-group .smoke  {border-left-color:#b3c4ce;}
.button-group .yellow {border-left-color:#dcb00a;}
.button-group .black  {border-left-color:#000000;}


/* Inputs
================================================== */
input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select, .tagit{
	background-color: #fff;
	border:1px solid #ccd7dd;
	border-radius: 4px;
	box-shadow: 0 4px 0 0 #edf1f3;
	color:#6f828d;
	font-family: "Roboto", Arial, sans-serif;
	font-size:14px;
	line-height: normal;
	/*margin:10px 0;*/
	padding:10px 15px;
	-webkit-transition: all .2s linear;
	   -moz-transition: all .2s linear;
	     -o-transition: all .2s linear;
		    transition: all .2s linear;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box; 
}

input[type="text"].fullwidth,
input[type="password"].fullwidth,
input[type="email"].fullwidth,
textarea.fullwidth,
select.fullwidth {
	width: 100%;
}

input[type="text"]:hover,
input[type="text"]:focus,
input[type="password"]:hover,
input[type="password"]:focus,
input[type="email"]:hover,
input[type="email"]:focus,
textarea:hover,
textarea:focus,
select:hover,
select:focus{
	border-color:#b3c4ce;
	box-shadow: 0 4px 0 0 #d9e3e8;
	color:#526773;
	outline:0;
}

input[type="text"]:disabled,
input[type="password"]:disabled,
input[type="email"]:disabled,
textarea:disabled,
select:disabled{
	border-color: #dedede;
	box-shadow: 0 4px 0 0 #ededed;
	color:#b2bbc0;
}


input[type="text"].alert,
input[type="password"].alert,
input[type="email"].alert,
textarea.alert,
select.alert{
	border-color:#f65543;
	box-shadow: 0 4px 0 0 #f88a7d;
	color:#f65543;
}

input[type="text"].success,
input[type="password"].success,
input[type="email"].success,
textarea.success{
	border-color:#54db8c;
	box-shadow: 0 4px 0 0 #8bf0b5;
	color:#25c266;
}

input[type="text"].search{
	background:#fff url(../img/search_bg.png) 95% 11px no-repeat;
}

input[type="text"].user{
	background:#fff url(../img/user_bg.png) 95% 11px no-repeat;
}

input[type="password"].password{
	background:#fff url(../img/password_bg.png) 95% 11px no-repeat;
}

/* Dropdown
================================================== */

/* 

	This property only works for -webkit- browsers.
	Uncomment the lines below to see result in Chrome or Safari.

	select{
		background:#fff url(../img/arrow_down_grey.png) 90% 50% no-repeat;
		padding-right:40px;
		-webkit-appearance:none;
	}

*/

.select{
	position: relative;
	width: 100%;
}

.select > span{
	background:#fff url(../img/arrow_down_grey.png) 95% 17px no-repeat;
	border:1px solid #ccd7dd;
	border-radius: 4px;
	box-shadow: 0 4px 0 0 #edf1f3;
	color:#6f828d;
	cursor: pointer;
	display: block;
	/*margin:10px;*/
	padding:10px 15px;
	/*width:217px;*/
	width: 100%;
	-webkit-transition: background-color .2s linear;
	   -moz-transition: background-color .2s linear;
	     -o-transition: background-color .2s linear;
		    transition: background-color .2s linear;
			
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;  
}

.select ul {
	background-color: #fff;
	border:1px solid #ccd7dd;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
	box-shadow: 0 4px 0 0 #edf1f3;
	display:none;
	list-style: none;
	/*margin-left:10px;*/
	padding:0;
	position: absolute;
	top:36px;		
	/*width:247px;*/
	width: 100%;
	z-index: 99;
			
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;  
}

/*.select > span:focus{outline: none;}
.select span:focus ~ ul {display: block; background: #fff;}*/
.select ul li {}
.select a {color:#6f828d;display:block;padding: 10px 15px;}
.select a:hover{background-color:#edf1f3;color:#6f828d;}


/* Green Color */
.select.green > span:focus{background-image:url(../img/arrow_down_green.png);border-color:#54db8c;color:#25c266;}
.select.green ul {border-color:#54db8c;box-shadow: 0 4px 0 0 #8bf0b5;}
.select.green a {color:#25c266;}
.select.green a:hover{background-color:#54db8c;color:#fff;}


/* Checkbox & Radio Button
================================================== */
label{
	display: inline-block;
	margin-bottom:10px;
}

input[type="checkbox"], input[type="radio"]{
	cursor: pointer;
	position: absolute;
	opacity: 0;
	z-index: 2;
}

input[type="checkbox"] + span,
input[type="radio"] + span{
	border:1px solid #ccd7dd;
	border-radius: 4px;
	box-shadow: 0 2px 0 0 #edf1f3;
	display: inline-block;
	height:18px;
	margin-bottom:-4px;
	margin-right:6px;
	width:18px;
}

input[type="checkbox"]:checked + span,
input[type="radio"]:checked + span{
	border-color:#54db8c;
	box-shadow: 0 2px 0 0 #8bf0b5;	
}

input[type="checkbox"]:checked + span:after,
input[type="radio"]:checked + span:after{
	background-color:#54db8c;
	border-radius: 2px;
	content:'';
	display: block;
	height:10px;
	margin:4px 0 0 4px;
	width: 10px;
}


input[type="radio"] + span,
input[type="radio"]:checked + span:after{
	border-radius: 50%;
}

input[type="checkbox"]:checked ~ label, input[type="radio"]:checked ~ label{color:#25c266;}
input[type="checkbox"]:disabled + span, input[type="radio"]:disabled + span{border-color: #dedede;box-shadow: 0 2px 0 0 #ededed;}
input[type="checkbox"]:disabled + span:after, input[type="radio"]:disabled + span:after{background-color:#dedede;}
input[type="checkbox"]:disabled ~ label, input[type="radio"]:disabled ~ label{color:#b2bbc0;}


/* Switches
================================================== */
.switch{
	display: inline-block;
	height:26px;
	margin:0 10px 10px; 
	position: relative;
	width:50px;
}

.switch label{
	cursor:pointer;	
	height:18px;
	position: absolute;
	width:18px;	
	-webkit-transition: all .2s ease-in;
	   -moz-transition: all .2s ease-in;
	     -o-transition: all .2s ease-in;
		    transition: all .2s ease-in;	
}

	/* Switch One */
	.switch-one{
		border:1px solid #ccd7dd;
		border-radius: 4px;
		box-shadow: 0 2px 0 0 #edf1f3;
	}

	.switch-one label{
		background-color:#ccd7dd;
		border-radius: 2px;
		display: block;
		left:4px;
		top:4px;
	}

	.switch-one input[type="checkbox"]:checked + label{
		background-color:#54db8c;	
		left:27px;
	}

	/* Switch Two */
	.switch-two{
		border:1px solid #ccd7dd;
		border-radius:26px;
		box-shadow: 0 2px 0 0 #edf1f3;
	}

	.switch-two label{
		background-color:#ccd7dd;
		border-radius:50%;
		display: block;
		left:4px;
		top:4px;
	}	

	.switch-two input[type="checkbox"]:checked + label{
		background-color:#54db8c;	
		left:27px;
	}


	/* Switch Three */
	.switch-three{
		border:1px solid #ccd7dd;
		border-radius:26px;
		box-shadow: 0 2px 0 0 #edf1f3;
		overflow: hidden;
		width:60px;
	}

	.switch-three label{
		background-color:#ccd7dd;
		border-radius:50%;
		display: block;
		left:4px;
		top:4px;
	}	

	.switch-three label:after{
		content: 'OFF';
		display: block;
		position: absolute;
		left:22px;
	}

	.switch-three label:before{
		content: 'ON';
		display: block;
		position: absolute;
		left:-28px;
	}

	.switch-three input[type="checkbox"]:checked ~ label{
		background-color:#54db8c;	
		left:37px;
	}	

	/* Switch Four */
	.switch-four{
		background-color:#ccd7dd;
		border-radius:26px;
		box-shadow: 0 2px 0 0 #edf1f3;
		overflow: hidden;
		width:60px;
	}

	.switch-four label{
		background-color:#a3b5bf;
		border-radius:50%;
		display: block;
		left:4px;
		top:4px;
	}	

	.switch-four label:after{
		content: 'OFF';
		display: block;
		position: absolute;
		left:22px;
	}

	.switch-four label:before{
		content: 'ON';
		display: block;
		position: absolute;
		left:-28px;
	}

	.switch-four input[type="checkbox"]:checked ~ label{
		background-color:#fff;	
		color:#4a5b65;
		left:37px;
	}		


/* Menu
================================================== */
.menu{
	background-color:#ccd7dd;
	border-radius: 4px;
	box-shadow: 0 4px 0 0 #b3c4ce;
}

.menu ul{
	height:46px;
	list-style: none;
	margin:0;
	padding:0 5px;
}

.menu > ul > li{
	float: left;
	margin:0;
	position: relative;
}

.menu .arrow{
	background: url(../img/arrow_down_grey.png) 0 0 no-repeat;
	display:block;
	height:4px;
	position: absolute;
	right:15px;
	top:23px;
	width:8px;
}

.menu .sub > a{
	padding-right: 40px;
}

.menu a{
	color:#4a5b65;
	display: block;
	font-weight: 500;
	padding:15px 20px 11px;
}

.menu a:hover{
	background-color:#b3c4ce;
	color:#4a5b65;
}

.menu ul ul{
	display: none;
}

.menu .sub:hover > a{
	background-color:#b3c4ce;	
}

.menu .sub:hover > ul{
	background-color:#b3c4ce;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	box-shadow: 0 4px 0 0 #a3b5bf;
	display: block;
	height:auto;
	left:0;
	padding:0;
	position: absolute;
	top:100%;
	width: 200px;
}

.menu .sub:hover > ul a:hover{
	background-color:#a3b5bf;
}


/* Alerts
================================================== */
.box{
	background-color: #fff;
	border: 1px solid #ccd7dd;
	border-radius: 4px;
	margin:10px 0;
	padding:15px;
	position: relative;
}

.box .close{
	background:url(../img/close.png) 0 0 no-repeat;
	height:16px;
	position: absolute;
	right:15px;
	top:17px;
	width: 16px;
	-webkit-transition: all .2s ease-in;
	   -moz-transition: all .2s ease-in;
	     -o-transition: all .2s ease-in;
		    transition: all .2s ease-in;	
}

.box .close:hover{
	-webkit-transform: rotate(180deg);
	    -ms-transform: rotate(180deg);
			transform: rotate(180deg);
}

.alert-box{
	background-color:#f65543;
	border:none;
	color:#fff;
}

.error-box{
	background-color:#f65543;
	border:none;
	color:#fff;
}

.information-box{
	background-color:#96d0f8;
	border:none;
	color:#2c76a9;
}

.success-box{
	background-color:#a9edc5;
	border:none;
	color:#4ba871;
}




/* Icons
================================================== */
.icon{
	display: inline-block;
	height:16px;
	margin-bottom: -3px;
	margin-left: 15px;
	width:16px;
}

.icon-buttons .icon{margin-left:0;}

	.home{background: url(../img/home.png) 0 0 no-repeat;}
	.blog{background:url(../img/blog.png) 0 0 no-repeat;}
	.comment{background: url(../img/comment.png) 0 0 no-repeat;}
	.contact{background: url(../img/contact.png) 0 0 no-repeat;}
	.cross{background:url(../img/close.png) 0 0 no-repeat;}
	.password{background: url(../img/password.png) 0 0 no-repeat;}
	.settings{background: url(../img/settings.png) 0 0 no-repeat;}
	.user{background: url(../img/user.png) 0 0 no-repeat;}
	.world{background: url(../img/world.png) 0 0 no-repeat;}
	.next{background: url(../img/next.png) 0 0 no-repeat;}



/* Samples
================================================== */

.login-box{height:auto;margin:0px auto;width:272px;overflow:hidden;}
.login-box input[type="submit"]{float:right;}