/* @override 
	http://localhost/petzinfo/trunk/templates/default/styles/signup.css */


/* Sign in Page */

.signin-page-wrapper{
	padding-top: 40px !important;
	clear: both;
}
.signin-page-wrapper .row{
		background: url(../images/signup/signup_or.png) center top no-repeat;
	
}
.signin-page-wrapper h1{
	font: normal normal 33px/30px Museo-300 !important;
}
.signin-page-wrapper .signup-logo{
	margin-top: 20px;
	margin-bottom: 50px;
	width: 320px;
	background-position: -90px;
}
.signin-page-wrapper .row p{
	margin-bottom: 20px;
	font-size: 18px;
	line-height: 18px;
}
.signin-page-wrapper .page-bg{
	background-image: url(../images/bg-signin.gif);
	width: 400px;
	height: 359px;
	margin: 60px auto 50px;
}

.signin-page-wrapper .errorContainer, .signin-page-wrapper .highlightContianer{
	margin-bottom: 40px;
}
.signin-page-wrapper .signup-social{
	padding-top: 120px;
	font: 20px Museo-300;
}
.signin-page-wrapper .span-or{
	margin-right: 20px;
	margin-left: 20px;
}

/* SIGNUP */



.signup-logo{
	background-image: url(../images/signup/signup_logo.png);
	width: 420px;
	margin: 50px auto 20px;
	background-size: cover;
	height: 80px;
}
.signup-logo2{
	background-image: url(../images/signup/signup_logo2.png);
	width: 700px;
	margin: 50px auto 20px;
	background-size: cover;
	height: 80px;
}
.signup-breadcrumbs{
	margin-top: 30px;
	margin-bottom: 30px;
}
.signup-breadcrumbs .breadcrumbs-step{
	color: #bcbcbc;
	border-radius: 100px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	width: 90px;
	height: 90px;
	line-height: 16px;
	padding-top: 20px;
	padding-right: 0;
	text-align: center;
	background-color: #dedfde;
	padding-left: 0;
	display: inline-block;
	margin-bottom: 20px;
	font-size: 18px;
}
.signup-breadcrumbs .breadcrumbs-step.current-step{
	background-color: #3399ff;
	color: #fff;
	width: 120px;
	height: 120px;
	font-size: 20px;
	padding-right: 0;
	padding-left: 0;
	padding-top: 30px;
	line-height: 20px;
}
.breadcrumbs-separator{
	color: #bcbcbc;
}
.breadcrumbs-step strong{
	font: 16px/16px Museo-300;
	position: relative;
	padding-top: 5px;
	display: inline-block;
}
.breadcrumbs-step.current-step strong{
	font-size: 20px;
	line-height: 20px;
}
/*
 * STEP 1
 */



#signup-step1 .row{
	background: url(../images/signup/signup_or.png) center top no-repeat;
}
#signup-step1 .row .signup-social{
	/*padding-top: 120px;*/
	font: 20px Museo-300;
}
#signup-step1 .row .signup-social .social-icons a{
	width: 60px;
	height: 60px;
	border-radius: 100px;
	-webkit-border-radius: 100px;
	font-size: 20px;
	-webkit-transition: all .3s;
	   -moz-transition: all .3s;
	        transition: all .3s;
	padding-top: 2px;
}
#signup-step1 .form-group{
	margin-bottom: 7px;
}

#signup-step1 .page-bg{
	background: url(../images/signup/bg-signup-step1.png) no-repeat;
	width: 361px;
	height: 316px;
	margin: 60px auto 50px;
}
/*
 * STEP 2
 */
#signup-step2 .row{
	margin-bottom: 50px;
	padding-top: 100px;
}
#signup-premium-wrapper .option-header-image{
	width: 414px;
	height: 110px;
	background-image: url(../images/signup/chameleon.png);
	position: absolute;
	top: -104px;
	left: -120px;
}
.signup-plan{
/*	width: 32%;
	float: left;
	margin-right: 5px;
	margin-left: 5px;*/
	position: relative;
}

.signup-plan ul{
	padding: 10px;
	float: left;
	width: 100%;
}
.signup-plan-header .circle{
	width: 100px;
	height: 100px;
	font: 16px Museo-500;
	color: #fff;
	line-height: 16px;
	background-color: #4697ec;
	border-radius: 100px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 20px;
	padding-top: 42px;
}
.page-gettingstarted2 #signup-basic-wrapper .signup-plan-header .circle{
	line-height: 48px;
}

.signup-plan-header h2{
	font-size: 30px;
	margin-bottom: 5px;
	border-bottom: 1px solid #dddedd;
	padding-bottom: 30px;
	margin-top: 30px;
	text-transform: uppercase;
}
#signup-premium-wrapper .signup-plan-header .circle{
	background-color: #ff7e00;
}
.signup-selected{
	border: 1px solid #ff7e00;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	padding-bottom: 20px;
	-moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

 #signup-step2 .signup-plan ul li{
 	display: block;
 	float: left;
 	width: 100%;
 	border-bottom: 1px solid #dddedd;
 	padding-top: 7px;
 	padding-bottom: 7px;
 	position: relative;
 }
#signup-step2 .signup-plan ul li .bullet{
	left: 0;
	top: 50%;
	position: absolute;
	margin-top: -15px;
}
#signup-step2 .signup-plan ul li .text{
	float: left;
	/*max-width: 250px;*/
	padding-top: 2px;
	padding-left: 40px;
	color: #3399ff;
	text-align: left;
	width: 100%;
	font: 14px/18px Museo-500;
	padding-right: 30px;
}
.signup-question{
	position: absolute;
	top: 50%;
	right: 0;
	font-size: 20px;
	margin-top: -15px;
}
.signup-plan{
	text-align: center;
}
.signup-plan .btn{
	margin-right: auto;
	margin-left: auto;
	display: inline-block;
	margin-top: 20px;
}
.signup-plan ul li .btn{
	margin-top: 10px;
	margin-bottom: 10px;
}
.bullet{
	width: 30px;
	height: 30px;
	background: url(../images/sprite-icons.png) -150px -120px;
	float: left;
	margin-right: 10px;
}
.bullet.orange-highlight{
	background: url(../images/sprite-icons.png) -180px -120px;
}
#signup-best-deal li:first-child{
	font: 26px Museo-500;
	color: #3399ff;
	padding-top: 15px !important;
	padding-bottom: 15px !important;
}
.icon-best-deal{
	background-image: url(../images/signup/icon-best-deal.png);
	width: 85px;
	height: 85px;
	position: absolute;
	top: -30px;
	left: -40px;
}

#signup-business-wrapper .orange-highlight{
	font: 26px Museo-500;
	margin-top: 20px !;
	padding-top: 20px;
	display: block;
	clear: both;
}
/*
 * STEP 3
 */
#signup-step3 .page-bg2{
	background: url(../images/signup/bg-signup-step3_birds.jpg) center no-repeat;
	position: relative;
	padding-top: 190px;
	margin-bottom: 20px;
}
#signup-step3 .paypal-wrapper{
	text-align: center;
	margin-top: -137px;
	position: relative;
	z-index: 100;
	margin-bottom: 50px;
}
#signup-step3 .paypal-wrapper p{
	border-bottom: 1px solid #dddedd;
	display: block;
	width: 100%;
	float: left;
	margin-top: 15px;
}
#signup-step3 .paypal-wrapper p span{
	font: 20px Museo-500;
	background-color: #FFFFFF;
	display: inline-block;
	padding-right: 20px;
	padding-left: 20px;
	background-color: #fff;
	margin-bottom: -10px;
}
.paypal-btn{
	background: url(../images/signup/paypal-btn.png) center no-repeat;
	width: 181px;
	height: 32px;
	display: inline-block;
	clear: both;
	margin-bottom: 50px;
}
#signup-step3 .page-bg{
	background: url(../images/signup/bg-signup-step3.jpg) center no-repeat;
	width: 446px;
	height: 246px;
	margin: 40px auto 0px;
}
.payment-wrapper{
	width: 32%;
	margin-right: 5px;
	margin-left: 5px;
	float: left;
	padding: 5px;
}
.payment-wrapper h2{
	text-align: center;
	border: 1px solid #dddedd;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-top-left-radius: 5px;
	-moz-border-top-right-radius: 5px;
	background-color: #fff;
	margin-right: auto;
	margin-left: auto;
	float: none;
	width: 80%;
	padding: 10px;
	margin-bottom: -2px;
	border-bottom-style: none;
	position: relative;
	z-index: 100;
}
.payment-form{
	padding: 15px;
}
#promotional-code{
	margin-top: 20px;
	margin-bottom: 40px;
}
#order-summary table td{
	padding-top: 15px;
	padding-bottom: 15px;
}
#order-summary table tr.total{
	border-top: 1px solid #dedfde;
	border-bottom: 1px solid #dedfde;
	padding-top: 10px;
	padding-bottom: 10px;
}
#promotional-code .form-group{
	margin-top: 10px;
}
#promotional-code #code{
	width: 150px;
}
#order-summary #btn-create-account{
	margin-bottom: 50px;
	margin-right: auto;
	margin-left: 15px;
}


 
 
/*
 * STEP 3
 */
 
 #purchase-summary-wrapper{
 	width: 370px;
 	float: right;
 	margin-right: 70px;
 }
#purchase-summary-wrapper h3{
	font-size: 18px;
	color: #000;
	margin-bottom: 20px;
}
.summary-row{
	margin-bottom: 10px;
	font: 16px/26px Museo-300;
	float: left;
	width: 100%;
}
.summary-row .amount{
	float: right;
}
.summary-total .purchase-description{
	text-align: right;
	padding-right: 30px;
	width: 100% !important;
}
.summary-promo{
}
.summary-promo .optional{
	font-size: 14px;
	color: #aaa;
}


/* Payment Method */

#payment-method-wrapper{
	border-top: 2px solid #000;
	padding-top: 10px;
	margin-top: 20px;
	background: url(../images/chihuahua.png) 470px bottom no-repeat;
}
#payment-method-wrapper h2{
	text-align: center;
	margin-bottom: 30px;
}

#payment-method-wrapper h3{
	font-size: 20px;
	margin-bottom: 10px;
}
#payment-method-wrapper h4{
	font: 18px/26px Museo-300;
	text-align: center;
}
.payment-method h3, .payment-method p{
		text-align: center;
	
}
#payment-form{
	margin-bottom: 30px;
}
#payment-form .form-group{
	margin-bottom: 5px;
}
.input-inline input{
	width: 48%;
	float: left;
	margin-right: 2px;
}
.cc-icons{
	background: url(../images/sprite.png) 0 -125px;
	width: 288px;
	height: 60px;
	margin-right: auto;
	margin-left: auto;
}
.security-icons{
	width: 219px;
	height: 48px;
	background: url(../images/sprite.png) -5px -192px;
	margin-right: auto;
	margin-left: auto;
}

#payment-paypal{
	border-left: 1px solid #333;
	padding-bottom: 120px;
}
#payment-paypal h3{
	margin-bottom: 50px;
}
#payment-paypal p{
	font: 16px/22px Museo-500;
}

/* STEP4 */
.signup-thankyou{
	margin-top: 60px;
}
.signup-thankyou h1{
	margin-bottom: 10px !important;
}
.signup-thankyou .signup-logo{
	margin-top: 10px;
	width: 320px;
	background-position: right;
}
#signup-step4 h1{
	font-size: 50px;
	margin-bottom: 60px;
}
#signup-upgrade h1, #membership_thankyou h1{
	font-size: 45px;
	margin-bottom: 50px;
	line-height: 52px;
}
#signup-step4 h2{
	font-size: 30px;
	margin-bottom: 20px;
}
#signup-step4 .box-wrapper{
	margin-bottom: 20px;
}
#signup-step4 img.img-circle{
	margin-right: auto;
	margin-left: auto;
	border: 5px solid #fff;
	box-shadow: 0 2px 7px rgba(0, 0, 0, 0.5);
	background-position: 0 0;
	margin-bottom: 20px;
	max-width: 100px;
}
#signup-step4 #uploadForm #uploadFile{
	text-align: center !important;
}
#signup-step4 .customFileInputBootstrap{
	border-style: none;
}
#signup-step4 .customFileInputBootstrap .file-input-name{
	max-width: 100%;
	width: 100%;
}
#signup-step4 textarea{
	margin-bottom: 5px;
}
#save-step4{
	margin-top: 10px;
}
#signup-step4 .page-bg, #membership_thankyou .page-bg{
	background-image: url(../images/signup/bg-signup-step4.png);
	width: 856px;
	height: 324px;
	margin-right: auto;
	margin-left: auto;
	/*margin-top: 700px;*/
clear: both;
}
/* Upgrade */
#signup-upgrade .page-bg{
	background: url(../images/signup/bg-signup-upgrade.png) no-repeat;
	width: 406px;
	height: 427px;
	margin-right: auto;
	margin-left: auto;
	/*margin-top: 700px;*/
clear: both;
}


/* Password Reset */

.password-reset-page .page-bg{
	background-image: url(../images/bg-reset-password.png);
	width: 365px;
	height: 357px;
	margin: 50px auto;
}
.password-reset-page form .input-text{
	margin-bottom: 30px;
	margin-right: auto;
	margin-left: auto;
	max-width: 400px;
}

.password-reset-page .col-xs-8{
	margin-right: auto !important;
	margin-left: auto !important;
	float: none;
}

/* Business Page */
.business-form{
	margin-top: 60px;
	margin-right: auto;
	margin-left: 40px;
}
.business-form label{
	font: 15px Museo-500;
}
.business-form .form-group{
	margin-bottom: 40px;
}
.btn-goback{
	background-image: url(../images/signup/btn-goback.png);
	width: 121px;
	height: 120px;
	display: inline-block;
	position: absolute;
	left: 0;
	top: 0;
}
.btn-goback:hover{
	background-image: url(../images/signup/btn-goback-hover.png);
}

/* RESET PASSWORD */

#form-reset-password{
	margin-right: auto;
	margin-left: auto;
	width: 600px;
}
