/**************************************************************************************************************************/
/* HTML5 ******************************************************************************************************************/
/**************************************************************************************************************************/

/* 01 HTML Styles 			***********************************************************************************************/
/* 02 Main Layout Styles	***********************************************************************************************/
/* 03 Page Header Styles	***********************************************************************************************/
/* 04 Navigation Styles		***********************************************************************************************/
/* 05 Footer Styles			***********************************************************************************************/
/* 06 Module Styles			***********************************************************************************************/
/* 07 Form items			***********************************************************************************************/
/* 08 Content				***********************************************************************************************/
/* 09 Modernizr				***********************************************************************************************/

/**************************************************************************************************************************/
/* 01 HTML Styles 			***********************************************************************************************/
/**************************************************************************************************************************/
@font-face {
    font-family: 'DroidSansRegular';
    src: url('DroidSans-webfont.eot');
    src: url('DroidSans-webfont.eot?#iefix') format('embedded-opentype'),
         url('DroidSans-webfont.woff') format('woff'),
         url('DroidSans-webfont.ttf') format('truetype'),
         url('DroidSans-webfont.svg#DroidSansRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
    
    background: #FFF;
    padding: 10px;
    
}

p {
    
    clear: both;
    float: none;

}
p.countdown { font-size: 12px; float: right; margin-right: 20px;  }
h1 { font: 24px/27px 'DroidSansRegular', Arial, sans-serif; color: #367AB7; }
h1.mainTitle { color: #333; color: white; }
fieldset {
    /* This is the colour to change */
    /*background: #F1F6FB;*/
    background: #F4F4F4;
    border: none;
    margin: 10px 0;
    padding: 10px;
    
   	/* Roundies and shadows */
	
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-o-border-radius: 6px;
	border-radius: 6px;
}

/**************************************************************************************************************************/
/* 02 Main Layout Styles **************************************************************************************************/
/**************************************************************************************************************************/

.logo {
max-width: 100%;
margin: 0 auto 0px auto;
}

.helpline {
font: normal 16px Arial;
font-weight: bold;
color: black;
padding-bottom: 2px;
padding-top: 2px;
max-width: 100%;
margin: 0 auto 10px auto;
}


.title {
background: #FF1493;
font: normal 20px/1.4 Arial;
font-weight: bold;
color: white;
padding-bottom: 6px;
padding-top: 6px;
max-width: 100%;
margin: 0 auto 10px auto;
}


.introduction {
background: #66CD00;
font: normal 20px Arial;
font-weight: bold;
color: white;
padding-bottom: 4px;
padding-top: 4px;
max-width: 100%;
margin: 10px auto 10px auto;
}  

.instruction {
font: normal 18px Arial;
font-weight: bold;
color: black;
padding-bottom: 4px;
padding-top: 4px;
max-width: 100%;
margin: 10px auto 10px auto;
}    
    
.main {
    
    /*background: #E4EEF7;*/
    background: white;
    border: 1px solid #CCC;
    padding: 10px;
    
    margin: 0 auto;
    
  /*  max-width: 1024px;*/
    
    
   	/* Roundies and shadows remed by CH 
	
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	-o-border-radius: 6px;
	border-radius: 6px; */

}

/**************************************************************************************************************************/
/* 03 Page Header Styles **************************************************************************************************/
/**************************************************************************************************************************/

/**************************************************************************************************************************/
/* 04 Navigation Styles ***************************************************************************************************/
/**************************************************************************************************************************/

footer nav ul li {
 
    float: left;
    padding: 0;
    margin-right: 20px;
    
}
footer nav ul li a:link, footer nav ul li a:visited {
    
    color: #367AB7;
    
}

/**************************************************************************************************************************/
/* 06 Module / Pod Styles *************************************************************************************************/
/**************************************************************************************************************************/

.radioButtonList {
    
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
    
}

ul.progress {
    
    margin: 0 0 0 2px;
    padding: 0;
    
}

ul.progress li {
 
   background: #afcde7;
   font-size: 0.7em;  
   padding: 10px;
   list-style: none;
   margin:0;
   text-align: center;
}

@media screen and (min-width: 770px) {
	
ul.progress li {

        float: left;
        width: 13.6%; 
        padding: 1.5%;
	position: relative;
	z-index: 2;
	}

}
@media screen and (max-width: 800px) {
	
.done {
    background-image: none;
    }
}
ul.progress li span {
 
   display: block;

    
}

ul.progress li.current {
 
   background: #367ab7;
   color: #FFF;
   box-shadow: 0px 0px 5px #007EFF;
   text-shadow: 1px 1px px #333;
   position: relative;
   z-index: 5;
   
}

ul.progress li.done {
 
   background: #afcde7 url(../images/check_alt_16x16.png) 4% 48% no-repeat;
   color: #FFF;
   text-align: center;
   text-decoration: none;
   
}



/**************************************************************************************************************************/
/* 07 Form items			***********************************************************************************************/
/**************************************************************************************************************************/
.field_green {
    
    /* background: #0F0; was green now white but the name has stuck. The margin and the padding are smaller */
    background: #FFF;
    margin-bottom: 10px;
    padding: 5px;
    
   	/* Roundies and shadows */
   	
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;
	    
}
.field {
    background: white;
    /*background: #FFF;*/
    margin-bottom: 20px;
    padding: 10px;
    
   	/* Roundies and shadows */
   	
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	-o-border-radius: 4px;
	border-radius: 4px;
	    
}

.field label {
    
    display: block;
    float: left;
    padding: 3px 0;
    margin-bottom: 10px;
    max-width: 300px;
    width: 100%;
    
}

.field li label {
    
    border: 1px solid F00;
    width: auto;
    
}

@media screen and (min-width: 770px) {
	
.field label, .field label.input_increased_margin {

        margin-bottom: 0;
		width: 30%;

	}

}

.radioButtonList li {

    margin: 0 0 10px 0;
    padding: 0;
    
}

.radioButtonList li label {
    
    
    display: inline;
    padding-left: 10px;
    float: none;
    
}
.field input.input_autowidth  {

	background:0;
	border:1px solid #CCC;
	color:#000;
    float: right;
	padding: 5px;
	width: 40px;
	
   	/* Roundies and shadows */
   	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;

}
.field input.input, .field textarea.input {

	background:0;
	border:1px solid #CCC;
	color:#000;
        float: left;
	padding: 5px;
	width: 96%;
	
   	/* Roundies and shadows */
   	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;

}
.field input.input_increased_margin   {

	background:0;
	border:1px solid #CCC;
	color:#000;
        float: left;
	padding:  5px;
	 
	width: 96%;
	 
   	/* Roundies and shadows */
   	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
  margin-top: 7px;
}
.field input.inputwithuppercase {

	background:0;
	border:1px solid #CCC;
	color:#000;
        float: left;
	padding: 5px;
	width: 96%;
	text-transform: uppercase;
	
   	/* Roundies and shadows */
   	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;

}
.date-icon {
    
    background: url(../images/date-icon.png) 1% 50% no-repeat !important;
    /*text-indent: 30px;*/
    width: 250px !important;
    padding-left: 25px !important;
    
}

@media screen and (min-width: 770px) {
	
.field input.input, .field textarea.input, .field input.input_increased_margin {

		padding: 5px;
		width: 67%;

	}

}

.guidance {
    
    clear: both;
    color: #999;
    font-size: 0.7em;
    margin-bottom: 0;
    padding: 10px 0 0px;
    
}

.validationAlert {
    
    background: #cd212b url(../images/icon-error.png) 1% 50% no-repeat;
    border: 1px solid #e34f58;
    color: #fff;
    display: block;
    margin-bottom: 10px;
    padding: 5px 10px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -o-border-radius: 3px;
    border-radius :3px;
    text-indent: 25px;
    font-size: 12px;
    
}
.validationAlert ul {

	margin-bottom: 0;

}

.validationAlert ul li {

	list-style: none;

}


.button {

	border: 1px solid #999;  
	background: #EEE;                       
	background: -webkit-gradient(linear,left top, left bottom, from(#EEE),to(#CCC));
	color: #666;
	padding: 4px 18px;
	margin-right: 10px;
	cursor: pointer;
	
	/* Roundies and shadows */

	text-shadow: 0px 1px 2px #FFF;
	
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
	-o-border-radius: 15px;
	border-radius: 15px;

}

.button.start-over {

	float: right;
	text-decoration: none;

}

span.req {

	color: #C00;
	text-indent: 5px;

}

/**************************************************************************************************************************/
/* 08 Content *************************************************************************************************************/
/**************************************************************************************************************************/

/**************************************************************************************************************************/
/* 09 Modernizr ***********************************************************************************************************/
/**************************************************************************************************************************/


/**************************************************************************************************************************/
/* 10 Custome Centered Div for Progress Area ******************************************************************************/
/**************************************************************************************************************************/

 #div_progress_area
 { 
  position: absolute;
	top: 85%;
	left: 50%;
	height: 30%;
	width: 75%;
	margin: -15% 0 0 -25%;
}
li.ruProgressHeader span
     {
         line-height:20px !important;  
     }
.no_display
{
 display: none;   
}     






/* ParonSoft */
p.logo .img-responsive {
  padding: 5px;
}
.nav.nav-pills.clearfix li {
  background: none repeat scroll 0 0 #ddd;
  font-size: 14px;
  font-weight: normal;
  margin-right: 7px;
  padding: 10px;
}
.nav.nav-pills.clearfix li.active {
  background: #888;
  color: #fff;
  font-weight: bold;
}
.radioButtonList input[type="radio"]:checked + label:before {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
  box-shadow: 0 0 0.5em #66cd00;
  color: #66cd00;
  content: "";
  display: block;
  float: left;
  font-family: fontawesome !important;
  font-size: 19px;
  height: 20px;
  line-height: 20px;
}
.radioButtonList input {
  display: none;
}
.radioButtonList label:before {
  content: "";
  font-family: fontawesome !important;
  line-height: 22px;
  font-size: 19px;
  display: block;
  float: left;
  color: #999;
}
fieldset.clearfix.col-md-12.col-sm-12.col-xs-12 {
  margin-bottom: 15px;
    padding-top: 0px;
}
fieldset.clearfix.col-md-12.col-sm-12.col-xs-12.padding-top {
  margin-bottom: 15px;
  padding-top: 20px;
}
.nav.nav-pills.clearfix li:last-child {
  margin-right: 0px !important;
}
.nav.nav-pills.clearfix li.col-md-3 {
  max-width: 270px;
}
.nav.nav-pills.clearfix li {
  min-width: 24.20%;
  text-align: center;
  margin: 9px 9px 5px 0px;
}
@media only screen and (min-width:1200px){
  .nav.nav-pills.clearfix li {
  min-width: 24.35%;
  }
}
.field.clearfix input[type="text"] {
  min-width: 70%;
  float: right;
  min-height: auto;
}
select:hover, select:focus, select:active, textarea:hover, textarea:active, textarea:focus, .field.clearfix input[type="text"]:hover, .field.clearfix input[type="text"]:focus, .field.clearfix input[type="text"]:active {
  border: 1px solid rgba(134, 177, 201, 0.8);
  box-shadow: 0 0 0.2em rgba(134, 177, 201, 0.8) inset;
  transition: all 0.3s ease 0s;
}
.button {
  background: #66CD00;
  color: #fff;
  border: 2px solid #66CD00;
  border-radius: 6px;
  text-shadow: none;
  font-weight: bold;
}
.button:hover {
  background: #FF1493;
  border: 2px solid #FF1493;
  color: #fff;
  transition: all 0.3s ease 0s;
}
footer.main {
  padding: 0 0 0 10px;
}
footer.main ul li {
  padding-top: 10px;
}
select {
  border-radius: 3px;
  min-width: 75px;  /* was 300px before the hours and minutes combos were cut down */
  min-height: 30px;
  padding: 5px;
}
table.address td {
  padding-right: 10px;
}
table.address {
  float: left;
  min-width: 70%;
}
select {
  border: 1px solid #ccc;
}
input.input.date-icon.dateofbirth[type="text"] {
  float: left;
  min-width: 300px !important;
  max-width: 300px !important;
}