body {
  padding-top: 40px;
  padding-bottom: auto;
}

.theme-dropdown .dropdown-menu {
  position: static;
  display: block;
  margin-bottom: 20px;
}

.theme-showcase > p > .btn {
  margin: 5px 0;
}

.theme-showcase .navbar .container {
  width: auto;
}

/******* Form *********/

body{
font-family: "Fira Sans", Fira Sans, Arial, Helvetica, sans-serif;
	}

.bg{
	background: #CCCCCC;
	border:1px solid #999999;
	padding:5px;
	border-radius:10px;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
}

.form{
	border: 2px solid #ccc;
	height: auto;
	border-radius: 10px;
	padding:0px;
	background: #FFFFFF;
	float: none;
	margin: 0px auto 10px;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
}
.form-group h2{
	font-size:25px;
	font-weight:600;
	color:#000000;
	margin:0px;
	padding:0px;
}	
.pad-all-side{
	padding: 20px 50px 20px 40px;
	}
	
.form h3{
	border: 0px solid #FF8000;
	background: none repeat scroll 0% 0% #FF8000;
	border-radius: 7px 7px 0px 0px ;
	width: 100%;
	float: none;
	margin:0px 0px 0px 0px;
	color: #fff;
	font-size: 23px;
	text-align: center;
	padding: 15px;
	}

.form-group label{
	font-size:17px;
	color: #545454;
	text-align:left !important;
	}
	
.db{
	width:25%; 
	border-radius:4px;
	float:left;
   }
	
.form-group a{
	text-decoration: underline;
	color:#0000FF;
	font-size:13px;
	font-style:italic;
}

/***** Form1 ********/
	
.step{
	color: #999999;
	padding: 5px 0px;
	margin-top:0px;
	text-align:center;
	font-size:16px;
	margin-bottom: 20px;
	background:#e1e1e1
	}
	
.step1{
	border-radius:20px 0px 0px 20px;
	}	
	
.step2{
	border-radius:0px 20px 20px 0px;
	}		
	
.active{
	background:#d4d4d4;
	font-weight:bold;
	color: #333333;
	}

.next-btn {
    display: inline-block;
    float: none;
    width: auto;
	float:right;
    line-height: 50px;
    color: #fff;
    text-decoration: none;
    text-align: center;
    *text-shadow: 1px 1px #20531B;*/
    border-radius: 4px 0px 0px 4px;
   /* border-width: medium medium 5px;
    border-style: none none solid;*/
  /*  border-color: -moz-use-text-color -moz-use-text-color #138611;*/
    background-color: #51B948;
    transition: all 1s ease 0s;
    /*padding: 0px 61px 0px 10px;
    background-image: url("dist/images/form_next_step.png");*/
    background-position: right center;
    background-repeat: no-repeat;
	font-weight:bold;
	font-size:23px;
	border:none;
	padding: 0px 10px 0px;
	margin-right: 20px;
}

/*.next-btn:hover{
	 background:#138611;
	 border-color: -moz-use-text-color -moz-use-text-color #51B948;
}*/

.back-btn {
	 background-color: #000;
	 border-color: -moz-use-text-color -moz-use-text-color  #999999;
	 color: #fff;
	 width: 100%;
	 
	}

.back-btn-left{
	width:70%; 
	float:left;
	margin-left:-5px;
	

	}
.back-left{
	float: left;
	background: none repeat scroll 0% 0% #000;
	line-height: 50px;
	margin-top: 2px;
	margin-left: 19px;
	border-radius: 0px 4px 4px 0px !important;
	}

.back-btn-ext{
	display:none;
	border-radius:4px !important;
	}

.back-btn:hover{
	 background:#999999 !important;
	 border-color: -moz-use-text-color -moz-use-text-color #CCCCCC !important;
	 color:#fff;
}

.next-btn span{
	font-size: 11px;
	color: #00A808;
	border: 1px solid #FFF;
	padding: 5px;
	border-radius: 50%;
	background: none repeat scroll 0% 0% #FFF;
	float: right;
	margin-top: 3px;
	margin-right: 3px;
	margin-left: 8px;
	}
	
.arrow_box { 
position: relative; 
background: #51B948; 
border: 5px solid #51B948; 
}

.arrow_box:after, .arrow_box:before {
    left: 100%;
    top: 93%;
    border: medium solid transparent;
    content: " ";
    height: 0px;
    width: 0px;
    position: absolute;
    pointer-events: none;
    margin-left: 3px;
}
.arrow_box:after {
    border-color: rgba(136, 183, 213, 0) rgba(136, 183, 213, 0) rgba(136, 183, 213, 0) #fff;
    border-width: 25px;
    margin-top: -47px;
}
.arrow_box:before {
    border-color: rgba(194, 225, 245, 0) rgba(194, 225, 245, 0) rgba(194, 225, 245, 0) #51B948;
    border-width: 30px;
    margin-top: -52px;
    margin-left: 5px;
}
	
	
.nxt-btn-left{
	display:none;
	}

/***** left arrow *****/

.left_arrow_box { 
position: relative;
background: #000; 
border: 4px solid #000; 
}

.left_arrow_box:after, .left_arrow_box:before { 
right: 100%; 
top: 50%; 
border: solid transparent; 
content: " ";
height: 0; 
width: 0;
position: absolute; 
pointer-events: none; } 

.left_arrow_box:after { 
    border-color: rgba(136, 183, 213, 0) #FEFEFE rgba(136, 183, 213, 0) rgba(136, 183, 213, 0);
	border-width: 15px;
	margin-top: -15px;
	margin-right: 2px;
} 

.left_arrow_box:before { 
   border-color: rgba(194, 225, 245, 0) #000 rgba(194, 225, 245, 0) rgba(194, 225, 245, 0);
	border-width: 29px;
	margin-top: -29px;
	margin-right: 4px;
}




/*********************************/

/**** 1st ****/
.pension{
	border-radius:4px; 
	margin-top: 7px;
	}	

/*.dd{
	border-radius:4px;
	}

.mm{
	margin-left:2px;
   }

.yyyy{
	margin-left:2px;
	width: 48%;
	}*/

select{
	border-radius:4px; 
	/*margin-top: 12px;*/
	}

.click-here{
	margin-top: 0px;
	}


/**** 2nd *****/

.fn-div{
	width: 30%; 
	margin-left: 0px;
   }
   
.sn{
	width:25%;
	margin-left:-24px;
	}

.sn-div{
	width:33.3%; 
	margin-left:-68px;
	}

.email{
	width:30%;
	}

.email-div{
	 margin-left: -24px; 
	 width:74%;
	}	

.add{
	width:30%;
	}

.add-div{
	margin-left: -24px;
	width:74%
	}

.tw-div{
	width: 30%; 
	margin-left: 0px;
	}

.ps-code{
	width:25%;
	/*margin-left:-24px;*/
	}

.ps-code-div {
	width:33.3%; 
	/*margin-left:-68px;*/
}

.ph-div{
	width: 30%; 
	margin-left: 0px;
	}
	
.mb{
	width:29%; 
	margin-left:-23px;
	}
	
.mb-div{
	width:33.3%;
	margin-left:-69px;
	}	
	
.cmp-div{
	margin-left: 0px; 
	width:100%;
	}	
	
/*********************************/	

/********* Responsive Design **********/

@media only screen and (min-width:550px) and (max-width:619px) {

/****** Form ******/
/*.fn-div {
    width: 40%;
    margin-left: -85px;
}

.sn-div {
    width: 40%;
    margin-left: -126px;
}

.email-div {
    width: 87%;
    margin-left: -120px;
}

.add-div {
    margin-left: -90px;
    width: 82.5%;
}

.tw-div {
    width: 40%;
    margin-left: -85px;
}

.ps-code-div {
    width: 40%;
    margin-left: -126px;
}

.ph-div {
    width: 40%;
    margin-left: -85px;
}

.mb-div {
    width: 40%;
    margin-left: -134px;
}

.cmp-div {
    float: right;
}

.next-btn{
	float:right;
	}*/
	
/**** Form 1 *****/

.step{
	float:left;
	}


.step1 {
    width: 50%;

}

.step2 {
    width: 50%;
}

.cmp-back{
    	float: left;
	}

.back-left {
	float:left;
	}

}


@media only screen and (min-width:480px) and (max-width:550px) {

/***** Form *****/
.pension {
    margin-top:0px;
}


select{
	margin-top:0px;
	margin-bottom:8px;
	}

.fn-div {
    width: 100%;
	margin-bottom:15px;
}


.sn {
    margin-left: 0px;
}

.sn-div {
    width: 100%;
	margin-left: 0px;
}

.email-div {
    margin-left: 0px;
    width: 100%;
}

.add-div {
    margin-left: 0px;
    width: 100%;
}

.tw-div {
    width: 100%;
    margin-left: 0px;
	margin-bottom:15px;
}

.ps-code {
    margin-left: 0px;
}

.ps-code-div {
    width: 100%;
    margin-left: 0px;
}

.ph-div {
    width: 100%;
    margin-left: 0px;
	margin-bottom:15px;
}

.mb {
    width: 29%;
    margin-left: 0px;
}

.mb-div {
    width: 100%;
	 margin-left: 0px;
}

.cmp-div {
    margin-left: 0px;
    width: 74%;
}

.dd{
	padding: 0px;
	width: 16%;
	float:left;
	margin-right:5px;
	
	}
	
.dd select{
	width: 100%;
	}

.mm{
	padding: 0px;
	width: 30%;
	float:left;
	margin-right:5px;
	
	}
	
.mm select{
	width: 100%;
	}

.yyyy{
	padding: 0px;
	width: 51%;
	float:left;
	}
	
.yyyy select{
	width: 100%;
	}


/**** Form 1 *****/

.step{
	float:left;
	}


.step1 {
    width: 50%;

}

.step2 {
    width: 50%;
}

.click-here {
    margin-bottom: 10px;
}


.arrow_box{
	float: right;
	margin-right: -127px;
	}
	


}

@media only screen and (min-width:320px) and (max-width:479px) {

select{
	margin-bottom:8px;
	}


.fn-div {
    width: 100%;
	margin-bottom:15px;
}


.sn {
    margin-left: 0px;
}

.sn-div {
    width: 100%;
	margin-left: 0px;
}

.email-div {
    margin-left: 0px;
    width: 100%;
}

.add {
    width: 33%;
}

.add-div {
    margin-left: 0px;
    width: 100%;
}

.tw-div {
    width: 100%;
    margin-left: 0px;
	margin-bottom:15px;
}

.ps-code {
    margin-left: 0px;
}

.ps-code-div {
    width: 100%;
    margin-left: 0px;
}

.ph-div {
    width: 100%;
    margin-left: 0px;
	margin-bottom:15px;
}

.mb {
    width: 29%;
    margin-left: 0px;
}

.mb-div {
    width: 100%;
	 margin-left: 0px;
}

.cmp-div {
    margin-left: 0px;
    width: 100%;
	
}

.next-btn{
	float:none;
	width: 95%;
	}

.dd{
	padding: 0px;
	width: 100%;
	float:left;
	margin-right:5px;
	
	}
	
.dd select{
	width: 100%;
	}

.mm{
	padding: 0px;
	width: 100%;
	float:left;
	margin-right:5px;
	
	}
	
.mm select{
	width: 100%;
	}

.yyyy{
	padding: 0px;
	width: 100%;
	float:left;
	}
	
.yyyy select{
	width: 100%;
	}



/**** Form 1 *****/

.step{
	float:left;
	}


.step1 {
    width: 50%;

}

.step2 {
    width: 50%;
}

.click-here {
    margin-bottom: 10px;
}

/*.next-btn {
    width: 68%;
    float: right;
}

.back-btn-left {
    width: 30% !important;
    float: left !important;
	}*/


.back-left {
    width: 25% !important;
	float:left !important;
}

.next-btn {
    float: right;
    width: 59%;
}

}

@media only screen and (min-width:270px) and (max-width:480px) {

.form h3 {
	font-size:20px;
	}

select{
	margin-bottom:8px;
	}


.fn-div {
    width: 100%;
	margin-bottom:15px;
}


.sn {
    margin-left: 0px;
}

.sn-div {
    width: 100%;
	margin-left: 0px;
}

.email-div {
    margin-left: 0px;
    width: 100%;
}

.add {
    width: 100%;
}

.add-div {
    margin-left: 0px;
    width: 100%;
}

.tw-div {
    width: 100%;
    margin-left: 0px;
	margin-bottom:15px;
}

.ps-code {
    margin-left: 0px;
}

.ps-code-div {
    width: 100%;
    margin-left: 0px;
}

.ph-div {
    width: 100%;
    margin-left: 0px;
	margin-bottom:15px;
}

.mb {
    width: 29%;
    margin-left: 0px;
}

.mb-div {
    width: 100%;
	 margin-left: 0px;
}

.cmp-div {
    margin-left: 0px;
    width: 100%;
	
}

.next-btn{
	float:none;
	width: 92%;
	}

.pad-all-side {
    padding: 15px 5px 0px;
}


.dd{
	padding: 0px;
	width: 21%;
	float:left;
	margin-right:5px;
	
	}
	
.dd select{
	width: 100%;
	}

.mm{
	padding: 0px;
	width: 30%;
	float:left;
	margin-right:5px;
	
	}
	
.mm select{
	width: 100%;
	}

.yyyy{
	padding: 0px;
	width: 45%;
	float:left;
	}
	
.yyyy select{
	width: 100%;
	}


/****** Form 1 ******/

.form-group h2, div.error  {
	padding-left:15px;
}
.step{
	float:left;
	}


.step1 {
    width: 50%;

}

.step2 {
    width: 50%;
}

.back-left {
    width: 22% !important;
	float: left !important;
	margin: 0px !important;
	margin-left: 16px !important;
	padding:0 !important;
	}

.next-btn {
    float: right;
    width: 63%;
	padding:0 !important;
}

.back-btn-ext{
	display:none;
	
		}
	
}