/*code for apb */

body{margin:0px;

}

.header
{
width:100%;
padding:30px 0px 30px 0px;
box-shadow:#ddd 0px 4px 6px;
background:#CC0000;
}

.wrapper
{
width:95%;
border-radius:10px;
margin:0px auto;
background:#F4F4F4;
border:1px solid #ddd;
margin-top:20px;

}

.container
{
width:50%;
margin-left:20px;
margin-top:40px;
}
.toggle-menu
{
margin:0px auto;
display:none;

}
.term-container{
width:100%;
}
.term-container span
{
padding:2px;
}

.text-area
{
	width:100%;  
	border:none;
	background:#fff; 
	font-size:14px;
	}
	.text-area p{
	padding:5px;
	text-align:justify;
	}
.terms {
	
	height:200px;
	border:1px solid #ccc;
	background:#fff;
	font:normal 11px/15px arial;
	color:#333;
}

.container span
{
margin-left:5px;
color:red;
}

.row
{
border:none;
width:70%;
margin-top:20px;
text-indent:15px;
border-radius:10px;
padding:5px 0px 5px 0px;
background:#fff;
box-shadow:#ddd 0px 0px 4px;
margin-bottom:5px;
float:left;

}
.status
{

float:left;
margin-left:5px;
margin-top:20px;

}
.sel
{
width:80%;

padding:5px 0px 5px 0px;
border:none;
box-shadow:inset 0px 1px 4px #333;
-webkit-box-shadow:inset 0px 1px 4px #333;
-moz-box-shadow:inset 0px 1px 4px #333;
}
.temp
{
width:100%;
margin-bottom:5%;
}
.temp2
{
width:100%;
margin-left:5px;
margin-top:20px;
margin-bottom:25px;


}
.btn
{
width:30%;
padding:5px 0px 5px 0px;
}
.btn2
{
width:80px;
padding:5px 0px 5px 0px;
}
#reg,#submit{
	display:none;
}

/* GENERAL ELEMENTS */



#signupform .label {
  padding-top: 2px;
  padding-right: 15px;
  vertical-align: top;
  text-align: right;
  width: 125px;
  white-space: nowrap;
}

#signupform .field {
  padding-bottom: 10px;
  white-space: nowrap;
}

#signupform .status {
  width:10px;
  width:auto;
 
}

#signupform .textfield {
  width: 150px;
}

#signupform label.error {
  background:url("../images/unchecked.gif") no-repeat 0px 0px;
  padding:10px;
  font-weight: bold;
  color: #EA5200;
}

#signupform label.checked {
  background:url("../images/checked.gif") no-repeat 0px 0px;
}

#signupform .success_msg {
  font-weight: bold;
  color: #0060BF;
  margin-left: 19px;
}



.clear-fix
{
clear:both;
}

.lbl
{
font-size:20px ;
font-weight:bolder;
margin-left:60px;

}
.footer
{
width:100%;
background:#333;
margin-top:20px;
height:40px;
}




/*responsive code*/

@media (min-width:320px) and (max-width:480px)
{
.wrapper
{
width:80%;
}

.toggle-menu
{
display:block;
margin-left:15%;

}
.container
{
width:100%;
}
.lbl{
font-size:15px;
margin-left:20px;
}
textarea
{
margin:0px;
margin-left:18px;
margin-top:10px;

}

}
/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
.wrapper
{
width:80%;
}

.toggle-menu
{
display:block;
margin-left:15%;

}
.container
{
width:100%;
}
.lbl{
font-size:15px;
margin-left:20px;
}
textarea
{
margin:0px;
margin-left:18px;
margin-top:10px;

}

}
 
/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {
.wrapper
{
width:80%;
}

.toggle-menu
{
display:block;
margin-left:15%;

}
.container
{
width:100%;
}
.lbl{
font-size:15px;
margin-left:20px;
}
textarea
{
margin:0px;
margin-left:18px;
margin-top:10px;

}

}
 
/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
.wrapper
{
width:80%;
}

.toggle-menu
{
display:block;
margin-left:15%;

}
.container
{
width:100%;
}
.lbl{
font-size:15px;
margin-left:20px;
}
textarea
{
margin:0px;
margin-left:18px;
margin-top:10px;

}

}
 
/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
.wrapper
{
width:80%;
}

.toggle-menu
{
display:block;
margin-left:15%;

}
.container
{
width:100%;
}
.lbl{
font-size:15px;
margin-left:20px;
}
textarea
{
margin:0px;
margin-left:18px;
margin-top:10px;

}

}
 
/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
.wrapper
{
width:80%;
}

.toggle-menu
{
display:block;
margin-left:15%;

}
.container
{
width:100%;
}
.lbl{
font-size:15px;
margin-left:20px;
}
textarea
{
margin:0px;
margin-left:18px;
margin-top:10px;

}

}
 
/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
.wrapper
{
width:80%;
}

.toggle-menu
{
display:block;
margin-left:15%;

}
.container
{
width:100%;
}
.lbl{
font-size:15px;
margin-left:20px;
}
textarea
{
margin:0px;
margin-left:18px;
margin-top:10px;

}

}
 
/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {
.toggle-menu
{
display:none;
}
.container
{
width:60%;
}
}
 
/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
.toggle-menu
{
display:none;
}
.container
{
width:60%;
}
}
 
/* iPhone 5 (portrait & landscape)----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px) {
.wrapper
{
width:80%;
}

.toggle-menu
{
display:block;
margin-left:15%;

}
.container
{
width:100%;
}
.lbl{
font-size:15px;
margin-left:20px;
}
textarea
{
margin:0px;
margin-left:18px;
margin-top:10px;

}

}
 
/* iPhone 5 (landscape)----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : landscape) {
.wrapper
{
width:80%;
}

.toggle-menu
{
display:block;
margin-left:15%;

}
.container
{
width:100%;
}
.lbl{
font-size:15px;
margin-left:20px;
}
textarea
{
margin:0px;
margin-left:18px;
margin-top:10px;

}

}
 
/* iPhone 5 (portrait)----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : portrait) {
.wrapper
{
width:80%;
}

.toggle-menu
{
display:block;
margin-left:15%;

}
.container
{
width:100%;
}
.lbl{
font-size:15px;
margin-left:20px;
}
textarea
{
margin:0px;
margin-left:18px;
margin-top:10px;

}

}