@charset "utf-8";
/* CSS Document */

#signature-pad-wrapper {
	position: fixed;
	top: 50%;
	left: 50%;
	margin: auto;
	width: var(--middle-width);
	height: auto;
	background: var(--zelena-dark);
	transform: translateX(-50%) translateY(-50%);
	box-sizing: border-box;
  padding: 1rem 3rem;
	margin-top: 2rem;
	display: none;
	z-index: 20;
}

#signature-pad-wrapper .heading {
	font-size: 1.5rem;;
	color: var(--bila);
}

#signature-pad-wrapper #signature-pad {
	position: relative;
	background: var(--bila);
	max-width: 100%;
	max-height: 100%;
	aspect-ratio: 880/350;
}

#signature-pad-wrapper #signature-pad canvas {
	position: relative;
	width: 100%;
	height: 100%;
}

#signature-pad-wrapper #sendform {
	position: relative;
	margin-top: 1rem;
}

#signature-pad-wrapper #close-signature-pad.close {
  font-size: 2rem;
  position: absolute;
  right: .5rem;
	top: 1rem;
}

#signature-pad-wrapper #close-signature-pad.close .line {
  background: var(--bila);
}

#signature-pad-wrapper p{
	color: var(--bila);
	margin-top: 1rem;
	margin-bottom: 0;
}

#signature-pad-wrapper p a{
	text-decoration: underline;
}

@media (max-width: 500px){
	#signature-pad-wrapper {
		width: 100vw;
		left: 0;
		transform: translateY(-50%);
	}
}