/* 
 * This is the CSS for step 1 of the contract
 */
.drop-shadow {
	-webkit-box-shadow: 0 0 5px 2px rgba(0, 0, 0, .5);
	box-shadow: 0 0 5px 2px rgba(0, 0, 0, .5);
}
.container.drop-shadow {
	padding-left:0;
	padding-right:0;
}
.sticky {
	position: sticky;
	position: -webkit-sticky;
	right: 0;
}
.text-nowrap {
	white-space: nowrap;
}

/*
 * This is the CSS for step 2 of the contract
 */
.progress-indicator {
	background-color: #2A323C;
    color: #FFF;
    padding: 0 10px;
    display: inline-block;
    position: absolute;
    transition: 250ms;
    z-index: 9;
    font-size: 10px;
    font-weight: bold;
    min-width: 70px;
    height: 33px;
    line-height: 33px;
	border-radius: 0 3px 0 0;
}
.inline-form-element {
	display:inline-block;
	width:auto !important;
}

.form-select {
    padding-right: 0 !important;
    width: calc(100% - 90px) !important;
}

span.required {
    position: absolute;
    margin-left: -10px;
    color: red;
    font-size: 16px;
}
body {
	background-color: #F5F5F5;
	position:relative;
	overflow-x:hidden;
	color:#404041;
	padding-top:90px;
}
#layout-wrapper {
	z-index: 1;
    position: relative;
}

a {
    color: #A5C638 !important;
}
.progress-text:before {
	content:'Please Complete';
}
.form-control {
	color:#404041;
	width:100%;
}

img {
	max-width: 100%;
}
.total-holder {
    font-weight: bold;
    border-top: 2px solid #404041;
}
.invalid-email .progress-text:before {
	content:'Invalid Email'
}

.invalid-id .progress-text:before {
	content:'Invalid ID Number'
}

.form-control[type=checkbox] {
	display:inline-block;
	vertical-align: middle;
	width: 25px;
    height: 25px;
	margin-right: 10px;
}

.preloader {
	opacity:0;
	transition:200ms;
}
.preloader.loading {
	opacity:1;
}

.canvas-focused {
	border-color:#A1C238 !important;
}

.form-control {
    padding-right: 90px;
}
.checkbox-wrapper {
	display:inline-block;
	line-height: 40px;
	    white-space: nowrap;
    font-size: 12px;
}
.arrow-left {
	position: absolute;
    content: '';
    width: 0;
    height: 0;
    border-top: 16px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 13px solid #2A323C;
    right: 100%;
    top: 0;
    bottom: 0;
	display:block;
}
.completed-input:focus,
.completed-input {
	border: 1px solid #A1C238 !important;
    background-color: #a1c23814 !important;
}
.focused-input:focus,
.focused-input {
	border: 1px solid #2A323C;
	background-color: #2A323C14;
}
.done-typing {
	cursor:pointer;
	background-color: #A1C238;
	border-radius: 3px 0 0 0;
}
td, th {
    padding: 2px !important;
}
.done-typing .progress-text:before {
	content:'Next Item';
}

.sign-signature .progress-text:before {
	content:'Please Sign';	
}
.done-typing .arrow-left {
    border-right: 0;
    right: auto;
    border-left: 13px solid #A1C238;
    left: 100%;  
}

.sign-signature {
    background-color: #A1C238;
    line-height: 20px;
    height: 20px;
}

.sign-signature .arrow-left {
	display:none;
}

.form-action,
.form-content {
	border: none;
    -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 1px 2px 0px rgb(0 0 0 / 10%);
    box-shadow: 0px 1px 2px 0px rgb(0 0 0 / 10%);
	padding: 30px;
	background-color:#FFF;
	margin-bottom:30px;
}
.signature-wrapper {
	position:relative;
}
.form-action:after {
	content:'';
	display:block;
	height:0;
	clear:both;
}

.form-action .col-xs-12 {
	padding-left:0;
	padding-right:0;
}

.page-header-title {
    background-color: #2a323c;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 0;
    padding: 30px 30px 90px 30px;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 10%);
}
.page-header-title .page-title {
    color: #ffffff;
    font-size: 25px;
    margin-bottom: 0;
}
.container {
    max-width: 100%;
    width: 100%;
    padding: 0 30px;
}
.signature-pad {
        width: 100%;
        height: 300px;
        border: 2px solid;
        border-color: lightgray;
    }

#clearbutton {
    position: absolute;
    top: 5px;
    right: 5px;
}

.formated-list-holder {
	list-style-type:none !important;
}
td {
    padding: 2px !important;
}
td:first-child {
	padding-right:15px;
}
.break-page {
    page-break-before: always;
}
ol {
	margin-top:0 !important;
	margin-bottom:0 !important;
}
ol, ul {
    padding-left: 0 !important;
}
h3,h4,table { margin-top:15px !important;margin-bottom:15px !important; }
table {
	max-width: 500px;
    width: 100%;
}

@media screen and (max-width: 767px) {
	.form-select {
		width: calc(100% - 15px) !important;
	}
	.form-control {
		padding-right: 10px;
	}
	.arrow-left {
	    border-bottom: 17px solid transparent;
	}
	.progress-text {
		display:none;
	}	
	.progress-indicator {
		min-width: auto;
		width: 10px;
		text-indent: 9999px;
		margin-left: 68px;
		padding: 0;
	}
	span.required {
	    margin-left: -3px;
	    margin-top: -5px;
	}
}