/* default card styles/make the card shapes */

.digi-card{
  border: 1px solid #e3e3e3;
  box-shadow:0px 8px 17px -8px rgb(0 0 0 / 40%);
  border-radius:8px;
  width:600px;
  height:350px;
}
.digi-card-content{
  padding:30px 40px 40px 40px;
}

/* left col - image */
#digi-card-image{
  margin-right:40px;
}
.digi-image{
  /* width:50px; */
  /* height:50px; */
  width:90%;
  position: relative;
  /* padding-top:90%; */
  /* background-color:currentColor; */
  /* border-radius:50%; */
}
.digi-image img{
  max-width:100%;
  opacity:1;
  transition:.25s;
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
}
.digi-image img.hidden{
  opacity:0;
}

/* right col, details */
#digi-card-details-header{
  margin-bottom:40px;
}
#digi-card-details h1,
#digi-card-details h2{
  margin-bottom:18px;
}
#digi-card-details h3,
#digi-card-details h4{
  margin-bottom:8px;
}

/* ???? */
/* additional links section */


/* responsive styles */
/* mobile (700px) */
@media only screen and (max-width: 700px){
  .digi-card{
    box-shadow:none;
    border:none;
    width:100%;
    height:auto;
  }
  .digi-card-content{
    display:block;
    flex:none;
    height:auto;
    padding:0px 40px 40px 40px;
  }
  .digi-card-content > .flex-container{
    flex-wrap: wrap;
  }

  #digi-card-image{
    margin: 0 auto 20px auto;
    max-width:200px;
    height: 200px;
    text-align:center;
    display:block;
    flex:none;
    /* height:100%; */
  }
  .digi-image{
    margin:none;
    height:100%;
    width:100%;
  }
}