.img-width-height-25{
    width:auto;
    height:20px;
}

.hidden {
    display: none;
}
@media (max-width: 600px) {
    body {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    #signature {
        min-width: auto !important;
        min-height: auto !important;
    }
}

#content {
    text-align: left;
    max-width: 600px;
    margin: 2em auto;
    display: block;
    background: #fff;
    padding: 2em;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
}

strong {
    font-weight: 700;
}

a, a .icon {
    color: #136fd2;
    color: #0a3666;
    color: #53777A;
    fill: #0a3666;
    color: #000;
    text-decoration: none;
    border-bottom: solid 1px transparent;
    transition: all 300ms;
}

a:active {
    color: #bf7883;
    border-bottom: solid 1px #bf7883;
    padding-bottom: 0px;
}

.signature-container .font-added {
    position: absolute;
    top: 20%;
    left: 5%;
    font-size: 20px;
    color: #0A4D9B;
}

.signature-container .extra-data {
    position: absolute;
    top: 42%;
    left: 5%;
    font-size: 15px;
    margin-bottom: 0px;
}

.extra-data p {
    font-size: 7px;
    margin-bottom: 0px;
    font-weight: 400;
}

.icon {
    fill: #222;
    width: 12px;
    height: 12px;
    margin: .075em .1em;
    margin-right: .2em;
}


/****** System styles ******/

#signature {
    width: auto;
    box-shadow: 0 0 5px 1px #ddd inset;
    border: dashed 2px #53777A;
    border: dashed 1px #53777A;
    margin: 0;
    text-align: center;
    min-height: 80px;
    min-width: 340px;
    transition: .2s;
}

/*#signature:hover {
  border-color:#54492a;
}
#signature:active {
  border-color:#C02942;
}*/

/* Big Red Button  https://cdpn.io/MwoOeW/ */
.big-red-button {
    border: none;
    outline: none;
    color: #fff;
    text-transform: uppercase;
    font-size: 1.5em;
    letter-spacing: .1rem;
    font-weight: 300;
    width: 5rem;
    height: 4rem;
    line-height: 4rem;
    text-align: center;
    cursor: pointer;
    border-radius: 50%;
    background: #f74d4d;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f74d4d), color-stop(100%, #f86569));
    background-image: -moz-gradient(linear, left top, left bottom, color-stop(0%, #f74d4d), color-stop(100%, #f86569));
    box-shadow: 0 .4rem #e24f4f;
}

.big-red-button:active {
    box-shadow: 0 0 #e24f4f;
    transform: translate(0px, .4rem);
    transition: 0.1s all ease-out;
}

#signature_capture {
    width: 100%;
    height: 7em;

}

.footer {
    text-align: right;
    display: block;
    margin-top: 0rem;
    max-width: 600px;
    margin: auto;
}


#signature-form .font-select{
    width: 100%;
}
#signature-form .ui-accordion .ui-accordion-header::before{
    display: none;
}
#signature-form .ui-accordion .ui-accordion-content{
    padding: .8em !important;
}
#signatureCanvas {
    max-width: 100%;
    height: auto;
    width: 100%;
    border: 1px solid #000;
}