/*Global styles*/

body
{
	background-color:#FFFFFF;
}

body, p, a
{
	font-family:'Arial', sans-serif;
}

h1, h2, h3, h4, h5, h6, .btn, .navbar-nav a, .list-inline, small, #examples
{
	font-family:'Montserrat', sans-serif;
}

.underline
{
	text-decoration: underline;
}

.feature-img
{
	border-radius:10px;
	width:100%;
}

.madewith-preview
{
	border-radius:10px;
	width:100%;
}

.noselect
{
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none; 
}

h1
{
	font-size:55px;
	line-height:55px;
	letter-spacing:-1px;
	color:#FFFFFF;
}

h2
{
	font-size:40px;
	line-height:40px;
	letter-spacing:-0.5px;
	color:#FFFFFF;
}

h3
{
	font-size:20px;
	line-height:30px;
	letter-spacing:0px;
	color:#222222;
}

.lead
{
	font-size:21px;
	line-height:26px;
	color:#FFFFFF;
}

p
{
	font-size:17px;
	line-height:22px;
	color:#777777;
}

/*Colors*/
.black
{
	color:#222222;
}

.white
{
	color:#FFFFFF;
}

a
{
	color:inherit;
	
}

a:hover, a:focus
{
	color:#222222;
	transition:all 0.35s ease-in-out;
}

.fa-lg
{
	font-size:1.33333em;
	line-height:0.75em;
	vertical-align:-10%;
}

::selection
{
	background:#222222; /* Safari */
	color:#FFFFFF;
}

::-moz-selection
{
	background:#222222; /* Firefox */
	color:#FFFFFF;
}


/*Buttons*/
.btn:focus
{
	outline:0px auto -webkit-focus-ring-color;
	outline:none;
}

.btn
{
	text-transform:uppercase;
	border-radius:4px;
	border:none;
}

.btn-lg
{
	font-size:13px;
	line-height:1.33;
	padding:22px 30px;
	font-weight:400;
	letter-spacing:1px;
}

.btn-sm
{
	font-size:11px;
	line-height:1.33;
	padding:10px 18px;
	font-weight:400;
}

.btn-wide
{
	width:100%;
	font-size:13px;
	line-height:1.33;
	padding:18px 28px;
	font-weight:400;
	letter-spacing:1px;
}

.btn-primary
{
	background-color:#333333;
	color:#FFFFFF;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active
{
	background-color:#555555;
	color:#FFFFFF;
	-webkit-transition:all 0.35s ease-in-out;
	-moz-transition:all 0.35s ease-in-out;
	-o-transition:all 0.35s ease-in-out;
	transition:all 0.35s ease-in-out;
}

.btn-secondary
{
	background-color:#FFFFFF;
	color:#222222;
}

.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active, .btn-secondary.active
{
	background-color:#ededed;
	color:#222222;
	-webkit-transition:all 0.35s ease-in-out;
	-moz-transition:all 0.35s ease-in-out;
	-o-transition:all 0.35s ease-in-out;
	transition:all 0.35s ease-in-out;
}

.navbar
{
	border:0px solid rgba(0, 0, 0, 0);
	background-color:#333333EE;
	margin:auto;
	min-height:60px;
	padding-top:8px;
	position:fixed;
	top:0;
	transition:top 0.4s ease 0s;
}

.nav > li > a
{
	position:relative;
	display:block;
	padding:10px 10px;
}

.logo img
{
	margin-top:6px;
}

/*Main styles*/
header
{
	width:100%;
	background-color:#222222;
	height:80vh;
	overflow:hidden;
}

/*nunu*/
#nunu
{
	background:url(img/editor.png) #222222 no-repeat center center fixed;
	min-height:200px;
	background-size:cover;
}

.pad-xl
{
	padding:200px 0px;
}

.pad-lg
{
	padding:160px 0px;
}

.pad-sm
{
	padding:80px 0px;
}

.pad-xs
{
	padding:30px 0px;
}


hr.line
{
	width:100%;
	border:2px solid;
}

.purple
{
	border-color:#6d3f96;
	color:#6d3f96;
}

.blue
{
	border-color:#333333;
	color:#333333
}

.yellow
{
	border-color:#fdc05d;
	color:#fdc05d;
}

.fa-envelope-o
{
	color:#CFCFCF;
	font-size:22px;
	display:block;
	padding-top:15px;
	width:60px;
	height:60px;
	border:2px solid #CFCFCF;
	-moz-border-radius:30px;
	-o-border-radius:30px;
	-webkit-border-radius:30px;
	border-radius:30px;
	margin:auto;
}

footer
{
	background:#FFFFFF;
	padding:40px 0px;
}

.social li a:hover
{
	opacity:0.5;
}

/*Pricing Tables*/
#examples
{
	background:#333333;
}

.headline
{
	background:#222222;
	color:#FFFFFF;
	padding:10px;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
}

.info
{
	padding-top:20px;
	padding-bottom:20px;
	font-weight:300;
	font-size:13px;
	color:#999999;
	background:#FFFFFF;
}

.features
{
	color:#222222;
	font-weight:bold;
	padding-top:12px;
	padding-bottom:15px;
	border-bottom:1px dotted #EEEEEE;
	background:#FFFFFF
}

.features.first
{
	border-top:1px dotted #EEEEEE;
}

.features.last
{
	padding-top:17px;
	padding-bottom:20px;
}

.features.last a
{
	color:#333333;
	font-size:14px;
	letter-spacing:1px;
}

.examples-container .btn
{
	border-radius:0;
}

/*Mobile styles*/
/*Landscape phones and down*/
@media (max-width:480px)
{ 
	.btn-lg
	{
		font-size:12.5px;
		line-height:1.33;
		padding:16px 13px;
		letter-spacing:0px;
	}


	.btn-wide
	{
		width:100%;
		font-size:12.5px;
		line-height:1.33;
		padding:16px 13px;
		letter-spacing:0px;
	}

	#nunu
	{ 
		background-attachment:scroll;
	}
}


/* Landscape phone to portrait tablet */
@media (min-width:481px) and (max-width:767px)
{ 
	#nunu
	{ 
		background-attachment:scroll;
	}
}

/* Portrait tablet to landscape and desktop */
@media (min-width:768px) and (max-width:991px)
{
	#nunu
	{
		background-attachment:scroll;
	}
}