body
{
 /*margin:0 auto;*/
 /*padding:0px;
 text-align:center;
 width:100%;*/
 font-family: "Myriad Pro","Helvetica Neue",Helvetica,Arial,Sans-Serif;
 overflow-y: scroll;
 
}
#wrapper
{
 margin:0 auto;
 padding:0px;
 text-align:center;
 width:900px;
 display: block;
  max-width: 100% !important;


}

#wrapper p
{
 font-size:12px;
}


/*#html_div input[type="text"]*/
#html_div input
{
 /*margin-top:5px;
 width:250px;
 height:35px;
 padding:10px;*/

  border: 0;
  outline: 0;
  border-bottom: 2px solid blue;
  width:250px;
}

.pdfvals{
  border-bottom: 2px solid blue;
  width:250px;

}
#html_div input[type="submit"]
{
 background-color:#585858;
 width:250px;
 height:35px;
 border:none;
 margin-top:5px;
 color:white;
 margin-left:-5px;
}

form{
   text-align: left;
}

h3{
    text-align: center;
    text-decoration: underline;
}


span {
  display: inline-block;
  vertical-align: top;
}

img {
   text-align:center;
   border: none;
   border-bottom: 2px solid blue;
   width:300px;
   height:70px;

  }
table{
  font-size: 12px;
}

#signature{
 width: 300px; 
 border: 1px solid black;
}

/*canvas{
  width:300px;
  height:70px ;
}

*/

/* #divLoading
{
    display : none;
} */

div.wrapper {
   width : 1000px;
   height : 1000px;
}

#pdfbtn{
  margin-left:35%;
}

#pdfbtn:hover {
  box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
}


 @media only screen and (max-width: 600px) {

table
{
  width: 100%;
  table-layout: fixed;
 }

 #html_div input
{

  width:180px;
}

img{
  width: 180px;
}
#signature, #signature-pad{
  width: 180px;
  height: 70px;
}

#pdfbtn{
  margin-top: 5px;
}

.pdfvals{
  width:180px;

}


 }

 /* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 


table
{
  width: 100%;
  table-layout: fixed;
 }

 #html_div input
{

  width:160px;
}

img{
  width: 160px;
}
#signature, #signature-pad{
  width: 160px;
}

.pdfvals{
  width:160px;

}



}

 /* Portrait */
@media only screen 
  and (min-device-width: 360px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 


table
{
  width: 100%;
  table-layout: fixed;
 }

 #html_div input
{

  width:140px;
}

img{
  width: 140px;
}
#signature, #signature-pad{
  width: 140px;
}

.pdfvals{
  width:140px;

}




}

 /* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px) 
  and (orientation: portrait) { 


table
{
  width: 100%;
  table-layout: fixed;
 }

 #html_div input
{

  width:160px;
}

img{
  width: 160px;
}
#signature, #signature-pad{
  width: 140px;
   height: 70px;
}

.pdfvals{
  width:160px;

}



}

input[type=text],input[type=email]{
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
 /* outline: none;
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid #DDDDDD;*/
}
 
input[type=text]:focus,input[type=email]:focus {
  box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid rgba(81, 203, 238, 1);
}

#signature:focus{
   box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border: 1px solid rgba(81, 203, 238, 1);
}