@import "variables";
@import "functions";
@import "mixins";

a:link,a:active,a:hover,a:visited
{
	.no-style;
}

.am-notice
{
	z-index: 500;
	display: none;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.88);
	position: fixed;
	bottom: 0;
	height: 80px;
	line-height: 50px;
	text-align: center;
	.padding(15px, 0px, 0px, 0px);
	.font(@font-raleway, 1.4em, @medium, #fff);
}
.features-margin
{
	margin-top:52px;
}

.am-error
{
	z-index: 600;
	display: none;
	width: 100%;
	background-color: rgba(191,16,16,0.87);
	position: fixed;
	bottom: 0;
	height: 80px;
	line-height: 50px;
	text-align: center;
	padding-top: 15px;
	.font(@font-raleway, 1.4em, @normal, #fff);
}

.am-error button
{
	position: relative;
	top: 15px;
	right: 30px;
}
.am-error button:hover
{
	color: #fff;
	text-shadow: none;
	opacity: 1;
	cursor: pointer;
}


header
{
	
	box-shadow: 0px 4px 8px -4px black; 
	position: fixed;
	z-index: 1000;
	top:0;
	width: 100%;
	padding-top:7px;
	.bgcolor(#FFF);
	.logo
	{
		padding-bottom: 8px;
	}
	.menu
	{

		@media screen and (max-width: 767px) {
			li > a {
				text-align: center;
				border: 1px solid transparent;
			}
			li.active > a{
				border-bottom: 1px solid #3F51B5!important;
				border-top: 1px solid #3F51B5 !important;
			}
			li > a:hover {
				background-color: #EEEEEE !important;
				border: 1px solid transparent !important;
			}
			&.pull-right {
				float: none !important;
			}
		}

		a
		{
			padding:24px 16px 22px 16px !important;
			.font(@font-raleway, 17px, @semi-bold, #3F51B5);
			margin: 0px 1px;
			&:hover, &:active
			{
				background: #FFF !important; 
			}
			&:visited
			{
				background-color: #fff !important;
			}
			&:focus
			{				
				background-color: #fff !important;
			}
		}
		li.active > a, li > a:hover {
			border-bottom: 6px solid #303F9F;
		}
	}

}

.bg-noisy-blue {
	background:#5063CC url('../images/noise.png') repeat;	
}
.bdr-blue-trans-6 {
	border-bottom: 6px;
	border-bottom-style: solid;
	border-bottom-color: rgba(48, 63, 159, 0.4);
}
#home
{
	border-bottom: 7px;
	border-bottom-style: solid;
	border-bottom-color: rgba(48, 63, 159, 0.3);
	.heading
	{		
		margin-top:230px;
		.font(@font-raleway, 32px, @semi-bold, #FFFFFF);
	}
	.sub-heading
	{		
		margin-top: 24px;
		.font(@font-pt, 18px, @normal, #FFFFFF);
	}

	form{
		margin-top: 42px;
		label
		{			
			.font(@font-raleway, 16px, @normal, #FFFFFF);
		}

		input, .input-group-addon
		{
			border: 0px !important;
			.no-radius;
			&:focus
			{
				box-shadow: none !important;
				border: 0px !important;
			}
		}
		.input-group
		{
			border: 10px;
			width: 100%;
			border-style: solid;
			border-color: rgba(48, 63, 159, 0.3);
			input[type="text"]
			{
				.font(@font-raleway, 16px, @normal, #777777);
				height: 65px;
			}
			.input-group-addon
			{
				background-color: #303F9F;
				width: 156px;
				height: 65px;
				padding:0px !important;
				button
				{
					width: 156px;
					height: 65px;
					.no-outline;
					background-color: transparent;
					.font(@font-raleway, 18px, @medium, #FFFFFF);
				}
			}
		}
	}
	.scroll-to-down
	{
		margin-top: 136px;
		margin-bottom: 24px;
		.font(@font-raleway, 14px, @medium, #FFFFFF);
	}
}

#features
{
	.bgcolor(#FFF);
	padding:68px 0px 84px 0px;
	.heading
	{		
		.font(@font-raleway, 18px, @semi-bold, #3F51B5);
	}
	.sub-heading
	{		
		.font(@font-pt, 16px, @normal, #404040);
	}
	.thumbnail
	{
		.width(262px);
		.height(262px);
		border: 1px @bdr-style #CCC;
		.bgcolor(#F2F2F2);
		margin-top: 68px;
		border-radius: 0px;
	}
}

#how-it-works
{
	.gradient(#F3F3F3,#FFFFFF);
	border-top:1px solid #D9D9D9;
	padding:68px 0px 52px 0px;
	.heading
	{		
		.font(@font-raleway, 18px, @semi-bold, #3F51B5);
	}
	.sub-heading
	{		
		.font(@font-pt, 16px, @normal, #404040);
	}
	.wk-media
	{
		margin-top: 52px;
	}
}

#pricing
{
	.gradient(#F3F3F3,#FFFFFF);
	border-top:1px solid #D9D9D9;
	padding:68px 0px 52px 0px;
	.heading
	{		
		.font(@font-raleway, 18px, @semi-bold, #3F51B5);
	}
	.sub-heading
	{		
		.font(@font-pt, 16px, @normal, #404040);
	}
}

#contact
{
	.gradient(#F3F3F3,#FFFFFF);
	border-top:1px solid #D9D9D9;
	padding:68px 0px 52px 0px;
	.heading
	{		
		.font(@font-raleway, 18px, @semi-bold, #3F51B5);
	}
	.sub-heading
	{		
		.font(@font-pt, 16px, @normal, #404040);
	}
	form
	{
		margin-top: 42px;

		::-moz-placeholder {
			.font(@font-raleway,16px, @semi-bold, #CCCCCC);
		}
		::-ms-placeholder {
			.font(@font-raleway,16px, @semi-bold, #CCCCCC);
		}
		::-webkit-placeholder {
			.font(@font-raleway,16px, @semi-bold, #CCCCCC);
		}

		.form-control
		{
			.font(@font-raleway, 16px, @normal, #777777);
			.no-radius;
			&:focus
			{
				box-shadow: none !important;
			}
		}
	}
}
.btn-blue {
	.no-radius;
	.no-outline;
	.font(@font-raleway, 16px, @semi-bold, #FFFFFF);			
	.bgcolor(#3F51B5);
	padding-left: 36px !important;
	padding-right: 36px !important;
}
footer
{
	border-top:1px solid #3F51B5;
	.padding(36px, 0px, 36px, 0px);
	.font(@font-raleway, 16px, @normal, #252525);
	
	& a
	{
		.font(@font-raleway, 16px, @semi-bold, #3F51B5);
		.no-style;

		&:hover
		{
			.no-style;
		}
	}
}
.af-heading {
	color: #252525;
    font-family: Raleway;
    font-size: 18px;
    font-weight: 500;
    padding: 15px 20px;
    border-bottom: 1px solid #DFDFDF;
}

.af-sub-heading {
	color: #252525;
    font-family: Raleway;
    font-size: 16px;
    font-weight: 500;
    line-height: 32px;
}

.af-text {
	color: #252525;
    font-family: Raleway;
    font-size: 14px;
    font-weight: 500;
}
.am-mark {
	background-color: #5C6DCB;
    border-radius: 3px;
    color: #ffffff;
    padding: 4px 8px;
}
#am-accordion {
	.accordion-title {
		cursor: pointer;
    	border-bottom: 1px solid #DFDFDF;
    	padding: 8px 15px;
	}
	.accordion-desc {
    	border-bottom: 1px solid #5C6DCB;
    	padding: 15px 15px 15px 32px;
    	display: none;
	}
}
.plus-minus-icon {
	.setSprite('../images/plus-minus-icon.svg', 0, 0);
	width: 15px;
	height: 15px;
	display: inline-block;

	&.open {
		.setSprite('../images/plus-minus-icon.svg', -15px, 0);
	}
}