/**
 *  SignaturePad: A jQuery plugin for assisting in the creation of an HTML5 canvas
 *  based signature pad. Records the drawn signature in JSON for later regeneration.
 *
 *  @project ca.thomasjbradley.applications.signaturepad
 *  @author Thomas J Bradley <hey@thomasjbradley.ca>
 *  @link http://thomasjbradley.ca/lab/signature-pad
 *  @link http://github.com/thomasjbradley/signature-pad
 *  @copyright Copyright MMXI, Thomas J Bradley
 *  @license New BSD License
 */

@font-face {
  font-family: 'Journal';
  src: url('../assets/journal.eot');
  src: local('Journal Regular'), local('Journal'), url('../assets/journal.woff') format('woff'), url('../assets/journal.ttf') format('truetype'), url('../assets/journal.svg#Journal') format('svg');
  font-weight: normal;
  font-style: normal;
}

.sigPad {
  margin: 0;
  padding: 0;
}

.sigPad label {
  display: block;
  margin: 0 0 0.515em;
  padding: 0;

  color: #000;
  font: italic normal 1em/1.375 Georgia,Times,serif;
}

.sigPad label.error {
  color: #f33;
}

.sigPad input.error {
  border-color: #f33;
}

.sigPad button {
  margin: 1em 0 0 0;
  padding: 0.6em 0.6em 0.7em;

  background-color: #f0e2eb;
  border: 0;
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-radius: 8px;

  cursor: pointer;

  color: #ea088c;
  font: bold 1em/1.375 "Helvetica Neue",Helvetica,Arial,sans-serif;
  text-align: left;
}

.sigPad button:hover {
  background-color: #ea088c;
  color: #fff;
}

ul.sigNav {
	display: none;
	margin: 0;
	padding: 0;
	list-style-type: none;
	position: absolute;
	z-index: 100;
	right: 0;
	background-color: var(--bg-color);
}

#frm_builder_page ul.sigNav {
	display: block;
}

#frm_builder_page .sigPad input{
	display:none;
}

.frm_form_field .sigPad ul.sigNav li {
	display: block;
	margin: 3px 3px 0;
	margin-top: var(--button-margin);
	margin-left: var(--button-side-margin);
	margin-right: var(--button-margin);
	padding: 0;
	background:none;
	line-height:normal;
}

.frm_form_field .sigNav a {
	margin: 0;
	padding: 8px;
	padding: var(--button-padding);
	border: 0;
	text-decoration: none;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	outline: none;
	background-color: var(--inactive);
}

.frm_form_field .sigNav a,
.frm_form_field .sigNav a i {
	display: block;
	font-size: 16px;
	font-size: var(--button-size);
	color: var(--inactive-text);
}

.frm_form_field .sigNav a i {
	width: 20px;
	height: 20px;
	width: var(--icon);
	height: var(--icon);
}

.sigNav a,
.sigNav a:active,
.sigNav a:focus,
.sigNav a:hover{
	box-shadow: none;
}

.frm_form_field .sigNav a.current {
	background-color: #eee;
	background-color: var(--active);
}

.frm_form_field .sigNav a.current,
.frm_form_field .sigNav a.current i {
	color: var(--active-text);
}

.sigWrapper {
	clear: both;
	border: 2px solid #eee;
	background-color: #fff;
	box-sizing:content-box;
	position: relative;
	background-color: var(--bg-color);
}

/*.sigWrapper.current {
  border-color: #b0879f;
  }
*/
.signed .sigWrapper {
  border: 0;
}

.pad {
	position: relative;
	width: 100%;
	height: 100%;
}

.current .pad {
	cursor: crosshair;
	z-index: 1;
}

.typed {
  position: absolute;
  z-index: 90;
  cursor: default;	
  color: #145394;
  font: normal 3em/50px "Journal",Georgia,Times,serif;
  padding: 0;
  margin: 0;
  height: 100%;
}

.typed input[type="text"],
.typed input[type="text"]:focus,
#content .with_frm_style .typed input[type="text"],
.with_frm_style .typed input[type="text"],
.with_frm_style .typed input[type="text"]:focus{
	font: normal 2em "Journal",Georgia,Times,serif !important;
	text-indent: 6%;
    border:none !important;
    padding: 0 !important;
	margin: 0;
    -moz-box-shadow:none !important;
    -webkit-box-shadow:none !important;
    box-shadow:none !important;
	height: 100%;
	width: 100%;
	vertical-align: middle;
	background-color: transparent !important;
}
.typed input[type="text"]:focus{
	background:inherit;
}

.sigPad .clearButton {
	position: absolute;
	font-size: 13px;
	margin: -25px 5% 0;
	z-index: 2;
	display: inherit;
	line-height: 1em;
	left: 0;
	bottom: 5px;
}

.sigPad .clearButton a {
	color: var(--active);
}