/* Colours */
/* Font Stacks */
/* Borders and Corners */
/* Shadow */
/* Layout */
.clear {
  clear: both;
}
.clearfix-easy {
  overflow: hidden;
  /* Clearfix! */

  zoom: 1;
  /* Triggering "hasLayout" in IE */

  display: block;
  /* Element must be a block to wrap around contents. Unnecessary if only using block-level elements. */

}
.clearfix {
  zoom: 1;
}
.clearfix:before, .clearfix:after {
  content: "\0020";
  display: block;
  height: 0;
  visibility: hidden;
}
.clearfix:after {
  clear: both;
}
/* 
  For modern browsers; see http://nicolasgallagher.com/micro-clearfix-hack/
  versions of Firefox < 3.5 will still need the visibility:hidden declaration.  
*/
.clearfix-modern {
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */

}
.clearfix-modern:before, .clearfix-modern:after {
  content: "";
  display: table;
  visibility: hidden;
  /* for legacy firefox < 3.5 */

}
.clearfix-modern:after {
  clear: both;
}
/* Hidden */
/* Hide for both screenreaders and browsers
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
/*.hidden {
  display: none;
  visibility: hidden;
}*/
/* Hide only visually, but have it available for screenreaders
   www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden
*/
.visually-hidden {
  border: 0 !important;
  clip: rect(0 0 0 0);
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
}
/* Hide visually and from screenreaders, but maintain layout */
.invisible {
  visibility: hidden;
}


/*}}}*/
/* FORMS {{{*/
form .long {
  width: 260px;
}

form .short {
  width: 110px;
}



.form-field {
  overflow: hidden;
  /* Clearfix! */

  zoom: 1;
  /* Triggering "hasLayout" in IE */

  display: block;
  /* Element must be a block to wrap around contents. Unnecessary if only using block-level elements. */

}

.wpprint-form  {
	max-width:960px;	
}

.form-field label {
  float: left;
  width:100%;
  margin-bottom:2px;
}

.form-field .group-options label {
	width:auto;
	margin-bottom:0px;
	margin-right:20px;	
}


.form-field input {
  float: left;

}

.form-field.optionlabel {
	line-height:30px;
	margin-right:50px;
}


.form-field input[type="submit"] {
	color:#ffffff;
	height:40px;
	width:240px;
	background-color:#00adef;
	text-align:center;
	border:0px;
	text-transform:uppercase;	
	font-size:14px;
	font-weight:600;		
}

.form-row input[type="radio"],
.form-row input[type="checkbox"] {
	float:left;
	margin:8px 15px 0px 2px;
	height:16px;
}

.form-field input[type="text"].long {
	 width:320px;
}

.form-field input[type="text"].short {
	width:110px;
}

.form-field input[type=text].extralong {
  width:492px;
}


input[type="text"].inline,
.form-field input[type="text"].full,
.form-field input[type="text"].email {
  width:468px;
}

.form-field input[type="text"].double {
	width:960px;	
}

.form-field .clearfield {
	clear:both;	
}

input[type="checkbox"].inline,
input.inline {
	float:none;
}
 

.form-field textarea {
  border: 1px solid #00adef;
  width:468px;
  padding:10px;
  height:80px;
  color:#1b1464;
  font-family: 'Fira Sans','Open Sans', Arial, sans-serif;
  font-size:14px;
  font-weight:300;
}

.form-field textarea.double {
	width:960px;
}

.form-field select {
  border: 1px solid #bcbec0;
  min-width:90px;
  color:#202020;
  height:34px
}

/*.form-field label + input, .form-field label + textarea, .form-field label + select {
  margin: 0 0 0 0px;
}*/

.form-row textarea, 
.form-row select,
.form-row input {
	margin-right:20px;
}

.form-row .form-field.last textarea, 
.form-row .form-field.last select,
.form-row .form-field.last input {
	margin-right:0px;
}


.form-field input.s-error, .form-field textarea.s-error, .form-field select.s-error {
  border: 1px solid #f59b2c;
}
.form-field p.s-error {
  clear: both;
  padding: 3px;
  color: #ff9c22;
}
.form-field .form-note {
  font-size: 11px;
  color: #0b3444;
}
.form-field p.form-note {
  clear: both;
  padding: 3px 0 0 0;
}
.form-field.inline {
  float: left;
}
.form-row {
  overflow: hidden;
  /* Clearfix! */

  zoom: 1;
  /* Triggering "hasLayout" in IE */

  display: block;
  /* Element must be a block to wrap around contents. Unnecessary if only using block-level elements. */

  padding: 0px 0;
  margin: 15px 0 15px 0;
  width:100%;
  float:left;
}
.form-row + .form-row {
  /*border-top: 1px solid #4dc1df;*/
}

.form-field select.year {
	width:60px;
	min-width:60px;
}

.form-field select.month {
	width:75px;
	min-width:75px;
}


.form-field select.day {
	width:50px;
	min-width:50px;
}


#form-tabnav-wrap {
	width:100%;
	float:left;	
}

#form-tabnav-wrap .form-tabnav {
	float:left;
	margin-right:10px;
	background-color:#ffffff;
	border-top:1px solid #e0e0e0;
	border-left:1px solid #e0e0e0;
	border-right:1px solid #e0e0e0;
	padding:5px 10px;	
	cursor:pointer;
}

.form-tab {
	display:none;	
}

.data-display {
	display:none;	
}


#wpprint-form h3 {
	font-size:18px;
	line-height:22px;
	margin:0px 0px 5px 0px;
	text-align:center;
}

#wpprint-form .form-intro h3 {
	text-align:left;	
}

#wpprint-form h2 {
	font-size:24px;
	line-height:28px;
	margin:0px 0px 5px 0px;
	text-align:center;
	font-weight:600;
}


#cscard-form,
#display-card-form {
	background-color:transparent;	
	width:850px;
	float: none;
	margin: 0 auto 40px auto;
}



/* Error Color */

.wpprint-form input.error,
.wpprint-form select.error,
.wpprint-form textarea.error {
	background:#FF8080;
}	


.wpprint-form  input[type='checkbox'].error, 
.wpprint-form  input[type='radio'].error,
.wpprint-form  input.radio.error, 
.wpprint-form  input.checkbox.error, 
.wpprint-form  .checkfield.error  {
	background:transparent;	
	border:2px solid #FF8080;
	outline:2px solid #FF8080;
} 

.wpprint-form input.errorcnf,
.wpprint-form select.errorcnf,
.wpprint-form textarea.errorcnf {
	background-color:#FB7625;
}	


.wpprint-form  .optionlabel.error {
	color:#400000;
}

.wpprint-form .group-options{
	width:auto;	
	float:left;
	margin-left:20px;
	height:30px;
	line-height:30px;
}

.wpprint-form .group-options.screen {
	width:400px;	
}

.wpprint-form .group-options.full {
	width:100%;
}

.wpprint-form .group-options .group-option {
	float:left;
	position:relative;
}


.form-row .group-option input[type="radio"], 
.form-row .group-option input[type="checkbox"] {
	width:30px;
	height:30px;	
	margin:0px 10px 0px 0px;
}

.group-option input + span  {
    width: 30px;
    height: 30px;
    position: absolute;
    left: 0px;
    top: 0px;
    background-color: #f0f0f0;
	border: 1px solid #00adef;
    pointer-events: none;
    cursor: pointer;
}


.group-option input:checked + span {
    background-color: #00adef;
}
		
.screenmessage {
	width:100%;
	float:left;
	text-align:left;	
	margin:0px 0px 40px 0px;
}

span.checklabel {
	float:left;
	margin-left:5px;	
}

span.errormsg {
	width:100%;
	float:left;
	text-align:left;
	color:#CC0000;
	clear:both;
}

span.approval {
	font-size:30px	;
	line-height:44px;
	height:50px;
	padding:0px 30px;
	display:inline-block;	
	color:#ffffff;
	border-radius:5px;
}

span.approval.yes {
	background-color:#090;	
}

span.approval.no {
	background-color:#C30;
}


.content-block-inner .wpprint-form p,
.wpprint-form p {
	margin-bottom:0px;
	margin-top:0px;	
}

.wpprint-form p.feature {
	width:100%;
	font-weight:bold;
	padding:20px;
	border:1px solid #58585b;	
	float:left;
	margin-top:20px;
	margin-bottom:20px;
}


.wpprint-form p.note {
	width:100%;
	float:left;
	margin-top:20px;
	margin-bottom:20px;
}


.wpprint-form .yesno label,
.wpprint-form .group-options label {
	width:auto;
	float:left;
	margin-right:20px;
}
	
.form-head {
	width:100%;
	float:left;
	position:relative;	
	border-bottom:1px solid #00adef;
	padding-bottom:35px;
	margin-bottom:15px;
}

.print-logo {
	position:absolute;
	right:0px;
	top:0px;	
}

.form-intro {
	width:100%;
	float:left;
	margin-top:60px;
}

.form-intro p {
	font-weight:300;
}


.row-sep {
	border-top:1px solid #00adef;
	height:0px;
	float:left;
	width:100%;
	margin:15px 0px 15px 0px;
}

/*}}}*/
/* CS CARD {{{*/

@media only screen and (max-width: 979px)  {
	
	input[type="text"].inline,
	.form-field input[type="text"].full,
	.form-field input[type="text"].email {
	  width:100%;
	}

	.form-field input[type="text"].double {
		width:960px;	
	}
	
	.form-field.inline {
		float: left;
		width: 100%;
	}
	
	.form-field textarea.double {
   		width: 100%;
	}
	
	.form-head {
		padding-top:105px;	
	}
	
	.print-logo {
		left:calc(50vw - 40px);	
		right:auto;
	}
	
	.wpprint-form .group-options {
		height:auto;	
	}
	
	.wpprint-form .group-options .group-option {
		margin-bottom:5px;
	}
	
}