.lead_captor_wrap{
	position: fixed;
	opacity: 0;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	.scale(0);
	background-color: rgba(0,0,0,0.7);
	z-index: -998;
	font-family: 'Lato', sans-serif;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
  	-moz-osx-font-smoothing: grayscale;
  	-ms-text-size-adjust: 100%;
  	-webkit-text-size-adjust: 100%;
  	box-sizing: border-box;
  	.transition( opacity 200ms );

  		.lead_captor_popup_open &{
  			display: block;
			opacity: 1;
			.scale(1);
			z-index: 998;
		}

  		p{
  			margin-top: 0;
  		}
  		*{
  			box-sizing: border-box;
  		}
}

.lead_captor_popup{
	position: absolute;
	top: 50%;
	left: 50%;
	.translate(-50%;-40%);
	z-index: 999;
	opacity: 0;
	.transition( ~"opacity 200ms, transform 400ms cubic-bezier(0.075, 0.82, 0.165, 1)" );
	.transition-delay(100ms);
	font-family: 'Lato', sans-serif;
		
		.lead_captor_popup_open &{
			.translate(-50%;-50%);
			opacity: 1;
		}

		.lead_captor_template_preview &{
			position: relative;
			top: 0;
			left: 0;
			.translate(0;0);
			opacity: 1;
		}

}

.lead_captor_modal{
	@shadow: 0 2px 4px rgba(0,0,0,0.25), 0 15px 30px rgba(0,0,0,0.5);
	.box-shadow(@shadow);
	border-radius: 5px;
	overflow: hidden;
}

/*
Popup 1
==========================================
*/
.lead_captor_popup1{
	background-color: transparent;
	width: 590px;

		.lead_captor_popup_open &{
			.translate(-50%;-50.1%); //Fix in Chrome for blurry text
		}

		.lead_captor_header{
			background: rgb(48,35,174);
			background: -moz-linear-gradient(-45deg,  rgba(48,35,174,1) 0%, rgba(125,185,232,1) 100%, rgba(201,109,216,1) 100%);
			background: -webkit-linear-gradient(-45deg,  rgba(48,35,174,1) 0%,rgba(125,185,232,1) 100%,rgba(201,109,216,1) 100%);
			background: linear-gradient(135deg,  rgba(48,35,174,1) 0%,rgba(125,185,232,1) 100%,rgba(201,109,216,1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3023ae', endColorstr='#c96dd8',GradientType=1 );
			padding: 30px 40px;
			color: #fff;

				.lead_captor_title{
					margin-top: 0;
					font-size: 32px;
					margin-bottom: 10px;
					font-weight: 900;
					color: inherit;
					text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
				}
				.lead_captor_subtitle{
					margin: 0;
					text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
				}
		}

		.lead_captor_image{
			display: none;
		}

		.lead_captor_body{
			background-color: #F5F5F5;
			padding: 40px 50px 50px;
			color: #747474;
			text-align: center;
			font-size: 18px;

				.lead_captor_item{
					color: #007AFF;
					font-weight: 900;
					font-size: 21px;
					margin-bottom: 30px;
				}
				i{
					font-size: 22px;
					margin-right: 10px;
				}
		}
}



/*
Popup 2
==========================================
*/
.lead_captor_popup2{
	background-color: transparent;
	width: 530px;
	 
		.lead_captor_popup_open &{
			.translate(-50%;-51.5%);
		}

		.lead_captor_modal{
			overflow: visible;
		}
	

		.lead_captor_body{
			background: rgb(251,218,97);
			background: -moz-linear-gradient(top,  rgba(251,218,97,1) 0%, rgba(247,107,28,1) 100%);
			background: -webkit-linear-gradient(top,  rgba(251,218,97,1) 0%,rgba(247,107,28,1) 100%);
			background: linear-gradient(to bottom,  rgba(251,218,97,1) 0%,rgba(247,107,28,1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbda61', endColorstr='#f76b1c',GradientType=0 );
			padding: 50px 50px 40px 50px;
			color: #FFF;
			text-align: center;
			font-size: 18px;
			position: relative;
			border-radius: 5px;
			

				.lead_captor_title{
					font-weight: 900;
					font-size: 47px;
					margin-bottom: 20px;
					margin-top: 0;
					text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
					color: inherit;

						i{
							font-size: inherit;
							margin-right: 10px;
						}
				}

				p{
					text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
				}

				.lead_captor_form{
					position: absolute;
					bottom: -10%;
					left: 50%;
					left: 15%;
					width: 70%;
				}
		}
}



/*
Popup 3
==========================================
*/
.lead_captor_popup3{
	background-color: transparent;
	width: 620px;
		
		.lead_captor_modal{
			background-color: #fff;
			position: relative;
		}
		.lead_captor_image{
			display: inline-block;
			width: 40%;
			vertical-align: middle;
			position: absolute;
			top: 0;
			bottom: 0;
			border-radius: 5px;
			overflow: hidden;

				img{
					width: auto;
					height: 100%;
					max-height: 100%;
					margin: 0;
					border: 0;
					vertical-align: middle;
				}
		}

		.lead_captor_body{
			display: inline-block;
			width: 60%;
			margin-left: 40%;
			vertical-align: top;
			text-align: right;
			padding: 50px 50px 50px 30px;
			color: #747474;
			.box-sizing(border-box);
				
				.lead_captor_title{
					font-size: 44px;
					font-weight: 900;
					margin-top: 0;
					color: #007AFF;
					margin-bottom: 20px;
				}
				
				.lead_captor_content{
					margin-bottom: 40px;
				}

				.lead_captor_form{
					width: 100%;
				}
		}

}



/*
Popup 4
==========================================
*/
.lead_captor_popup4{
	background-color: transparent;
	width: 590px;

		.lead_captor_modal{
			overflow: visible;
		}

		.lead_captor_header{
			background: rgb(48,35,174);
			background: -moz-linear-gradient(left,  rgba(48,35,174,1) 0%, rgba(83,160,254,1) 50%, rgba(80,237,161,1) 100%);
			background: -webkit-linear-gradient(left,  rgba(48,35,174,1) 0%,rgba(83,160,254,1) 50%,rgba(80,237,161,1) 100%);
			background: linear-gradient(to right,  rgba(48,35,174,1) 0%,rgba(83,160,254,1) 50%,rgba(80,237,161,1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3023ae', endColorstr='#50eda1',GradientType=1 );
			border-radius: 5px 5px 0 0;
			padding: 40px;
			color: #fff;
			text-align: center;

				.lead_captor_title{
					margin-top: 0;
					font-size: 38px;
					margin-bottom: 0;
					font-weight: 900;
					text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
					color: inherit;
				}
				.lead_captor_subtitle{
					margin: 0;
					text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
				}
		}

		.lead_captor_body{
			background-color: #F5F5F5;
			padding: 50px 60px 50px;
			color: #747474;
			text-align: left;
			font-size: 17.9px;
			position: relative;
			color: #007AFF;
			border-radius: 0 0 5px 5px;

				ul{
					padding-left: 0;
					list-style: none;
					margin-top: 0;

						li{
							padding-left: 25px;
							margin-bottom: 11px;
							position: relative;

								&::before{
									font-family: 'lead-captor' !important;
									speak: none;
									font-style: normal;
									font-weight: normal;
									font-variant: normal;
									text-transform: none;
									line-height: 1;
									content: "\e901";
									position: absolute;
									top: 50%;
									left: 0;
									font-size: 18px;
									width: 18px;
									height: 18px;
									text-align: center;
									text-indent: 0;
									.translate(0;-50%);
									.transition(opacity 200ms);
								}
						}
				}

				.lead_captor_form{
					position: absolute;
					bottom: -10%;
					left: 50%;
					left: 19%;
					width: 60%;
				}
		}
}




/*
Subscribe Form
==========================================
*/
.lead_captor_form{
	position: relative;
	width: 80%;
	margin: 0 auto;

		.lead_captor_subscribe_input{
			background-color: #fff;
			@shadow: 0 2px 4px rgba(0,0,0,0.08), 0 3px 15px rgba(0,0,0,0.13);
			.box-shadow(@shadow);
			height: 43px;
			border: none;
			border-radius: 25px;
			padding: 0 130px 0 25px;
			font-size: 15px;
			
			width: 100%;
			font-family: inherit;
			color: #616161;

				&:focus{
					outline: none;
					@shadow: 0 2px 4px rgba(0,0,0,0.12), 0 3px 15px rgba(0,0,0,0.2);
					.box-shadow(@shadow);
				}
				.lead_captor_form_success &{
					border: 2px solid #60A510;
				}
				.lead_captor_form_error &{
					border: 2px solid #FF3737;
				}
				
		}

		.lead_captor_subscribe_btn{
			position: absolute;
			top: 0;
			right: 0;
			background-color: transparent;
			border: none;
			text-transform: uppercase;
			font-weight: 900;
			font-size: 15px;
			color: #007AFF;
			font-family: inherit;
			display: block;
			cursor: pointer;
			padding: 12px 42px 12px 0;
			height: 43px;
			overflow: hidden;
				
				&:hover{
					color: darken( #007AFF, 5% );
				}
				&:focus{
					outline: none;
				}
				.lead_captor_form_success &{
					color: #60A510;
				}
				.lead_captor_form_error &{
					color: #FF3737;
				}

				&::before{
					font-family: 'lead-captor' !important;
					speak: none;
					font-style: normal;
					font-weight: normal;
					font-variant: normal;
					text-transform: none;
					line-height: 1;
					content: "\e903";
					position: absolute;
					top: 50%;
					right: 15px;
					font-size: 20px;
					width: 20px;
					height: 20px;
					text-align: center;
					text-indent: 0;
					.translate(0;-50%);
					.transition(opacity 200ms);
				}

				.lead_captor_form_loading &::before{
					opacity: 0;
				}
				.lead_captor_form_success &::before{
					opacity: 1;
					content: "\e900";
					color: #60A510;
				}
				.lead_captor_form_error &::before{
					opacity: 1;
					content: "\e905";
					color: #FF3737;
				}
		}
}


/*
Lead Captor Footer
==========================================
*/
p.lead_captor_footer{
	color: #C1C1C1;
	font-size: 12px;
	text-align: right;
	margin-top: 8px;
	margin-bottom: 0;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);

		a{
			color: inherit;
			text-decoration: none;

				&:hover{
					text-decoration: underline;
					color: #fff;
				}
		}
}


/*
Placeholder
==========================================
*/
.lead_captor_popup{
	.placeholder(#9C9C9C);
}



/*
Prefixes
==========================================
*/
@import "../less/vendor-prefixes.less";

/*
Font Icon
==========================================
*/
@import "../less/_font-lead-captor.less";

/*
Loading circle
==========================================
*/
.lead_captor_loading{
	position: absolute;
	top: 50%;
	right: 10px;
	.translate(0;-50%);
	.transition(opacity 200ms);
	opacity: 0;
	z-index: -1;

		.lead_captor_form_loading &{
			opacity: 1;
			z-index: 1;
		}
		.lead_captor_form_success &, .lead_captor_form_error &{
			opacity: 0;
		}
}

.lead_captor_circle {
  width: 25px;
  height: 25px;
  position: relative;
}
.lead_captor_circle .lead_captor_child {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.lead_captor_circle .lead_captor_child:before {
  content: '';
  display: block;
  margin: 0 auto;
  width: 15%;
  height: 15%;
  background-color: #007AFF;
  border-radius: 100%;
  -webkit-animation: lead_captor_circleBounceDelay 1.2s infinite ease-in-out both;
          animation: lead_captor_circleBounceDelay 1.2s infinite ease-in-out both;
}
.lead_captor_circle .lead_captor_circle2 {
  -webkit-transform: rotate(30deg);
      -ms-transform: rotate(30deg);
          transform: rotate(30deg); }
.lead_captor_circle .lead_captor_circle3 {
  -webkit-transform: rotate(60deg);
      -ms-transform: rotate(60deg);
          transform: rotate(60deg); }
.lead_captor_circle .lead_captor_circle4 {
  -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg); }
.lead_captor_circle .lead_captor_circle5 {
  -webkit-transform: rotate(120deg);
      -ms-transform: rotate(120deg);
          transform: rotate(120deg); }
.lead_captor_circle .lead_captor_circle6 {
  -webkit-transform: rotate(150deg);
      -ms-transform: rotate(150deg);
          transform: rotate(150deg); }
.lead_captor_circle .lead_captor_circle7 {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg); }
.lead_captor_circle .lead_captor_circle8 {
  -webkit-transform: rotate(210deg);
      -ms-transform: rotate(210deg);
          transform: rotate(210deg); }
.lead_captor_circle .lead_captor_circle9 {
  -webkit-transform: rotate(240deg);
      -ms-transform: rotate(240deg);
          transform: rotate(240deg); }
.lead_captor_circle .lead_captor_circle10 {
  -webkit-transform: rotate(270deg);
      -ms-transform: rotate(270deg);
          transform: rotate(270deg); }
.lead_captor_circle .lead_captor_circle11 {
  -webkit-transform: rotate(300deg);
      -ms-transform: rotate(300deg);
          transform: rotate(300deg); }
.lead_captor_circle .lead_captor_circle12 {
  -webkit-transform: rotate(330deg);
      -ms-transform: rotate(330deg);
          transform: rotate(330deg); }
.lead_captor_circle .lead_captor_circle2:before {
  -webkit-animation-delay: -1.1s;
          animation-delay: -1.1s; }
.lead_captor_circle .lead_captor_circle3:before {
  -webkit-animation-delay: -1s;
          animation-delay: -1s; }
.lead_captor_circle .lead_captor_circle4:before {
  -webkit-animation-delay: -0.9s;
          animation-delay: -0.9s; }
.lead_captor_circle .lead_captor_circle5:before {
  -webkit-animation-delay: -0.8s;
          animation-delay: -0.8s; }
.lead_captor_circle .lead_captor_circle6:before {
  -webkit-animation-delay: -0.7s;
          animation-delay: -0.7s; }
.lead_captor_circle .lead_captor_circle7:before {
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s; }
.lead_captor_circle .lead_captor_circle8:before {
  -webkit-animation-delay: -0.5s;
          animation-delay: -0.5s; }
.lead_captor_circle .lead_captor_circle9:before {
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s; }
.lead_captor_circle .lead_captor_circle10:before {
  -webkit-animation-delay: -0.3s;
          animation-delay: -0.3s; }
.lead_captor_circle .lead_captor_circle11:before {
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s; }
.lead_captor_circle .lead_captor_circle12:before {
  -webkit-animation-delay: -0.1s;
          animation-delay: -0.1s; }

@-webkit-keyframes lead_captor_circleBounceDelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  } 40% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes lead_captor_circleBounceDelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  } 40% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

/*
Font Icon
==========================================
*/
@import "../less/_mediaquery-xs.less";