#mydiv {
  position:relative;
}
/* front side */
.front-side,
.back-side {
  height: 52.8mm;
  width: 85.6mm;
  background-color: white;
  max-width: 100%;
  position: relative;
 // border: 1px solid #ccc;
  border-radius: 3mm;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.4);
}

.front-side {
  margin-bottom: 5px;
}

.front-side .name-company {
  position: absolute;
  text-align: center;
  width: 100%;
  top: 1mm;
  font-size: 10pt;
  text-transform: UPPERCASE;
  text-align: center;
}
.front-side .card-name {
  width: 50mm;
  position: absolute;
  text-align: center;
  width: 100%;
  top: 6mm;
  font-size: 7pt;
  font-weight: bold;
  text-transform: UPPERCASE;
  text-align: center;
}

.front-side .photo {
  position: absolute;
  width: 30mm;
  height: 40mm;
  top: 11mm;
  max-width: 30mm;
  max-height: 40mm;
  left: 4mm;
  //background-color: #000;
}
.front-side .photo img {
  width: 100%;
  height: 100%;
}

.front-side .data-person {
  position: absolute;
  top: 13mm;
  right: 5mm;
}

.front-side .data-person .title {
  font-size: 8pt;
}
.front-side .data-person .text-form {
  margin-bottom: 1.7mm;
}


/* /back side */
@media print {
  @page {
    padding: 0;
    margin: 0;
  }


  .front-side,
  .back-side {
    margin:0;
    padding: 0;
    box-shadow: none;
  }
  .front-side {
    page-break-after: always;
  }
}