.owp-home {
  position: relative;
  height: 800px;
}

.owp-home .card {
  position: absolute;
  top: 40%;
  left: 40%;
  
  -o-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  
  padding: 1em;
  background: rgba(0, 0, 0, 0.8);
  color: #dddddd;
  border-radius: 0.2em;

  text-shadow: 0px 0px 1px black;
  box-shadow: 0px 0px 5px black;
}


.owp-home h1 {
  text-align: center;
  font-size: 2em;
  color: #dddddd;
}

.owp-home h3 {
  text-align: center;
  font-size: 1em;
  color: #999999;
}



.owp-circular-callout {
  text-align: center;
}

.owp-circular-callout h3 {
  margin-bottom: 1.0em;
}

.owp-circular-callout img {
  border-radius: 50%;
}


.owp-callout {
  position: relative;
  overflow: hidden;
  /* this fixes the overflow:hidden in Chrome */
  -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);
  border: 2px solid black;
  border-radius: 2em;
  width: 95%;
  padding-bottom: 95%;
  margin: 1em auto 1em auto;
}

.owp-callout > a > img {
  max-width: none;
  max-height: none;
  width: auto;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  -o-transform: translate(-50%, -50%) scale(1);
  -ms-transform: translate(-50%, -50%) scale(1);
  -moz-transform: translate(-50%, -50%) scale(1);
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  transition: 1s;
}

.owp-callout:hover > a > img {
  -o-transform: translate(-50%, -50%) scale(2);
  -ms-transform: translate(-50%, -50%) scale(2);
  -moz-transform: translate(-50%, -50%) scale(2);
  -webkit-transform: translate(-50%, -50%) scale(2);
  transform: translate(-50%, -50%) scale(2);
}

.owp-callout .headline {
  position: absolute;
  top: 100%;
  left: 50%;
  width: 100%;
  -o-transform: translate(-50%, -100%);
  -ms-transform: translate(-50%, -100%);
  -moz-transform: translate(-50%, -100%);
  -webkit-transform: translate(-50%, -100%);
  transform: translate(-50%, -100%);
  padding: 0em 1em;
  background: rgba(0, 0, 0, 0.7);
  color: #eeeeee;
}

.owp-callout .headline h3 {
  text-align: center;
  color: #eeeeee;
}

@media screen and (max-width: 780px) {
  .owp-callout {
    width: 60%;
    padding-bottom: 60%;
  }
}


span.by-phone:before {
   font-family: FontAwesome;
   content: "\f095";
   margin-right: 0.5em;
}

span.by-form:before {
   font-family: FontAwesome;
   content: "\f003";
   margin-right: 0.5em;
}

@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) {

  /* Force table to not be like tables anymore */
  table.contact-us, table.contact-us thead,
  table.contact-us tbody, table.contact-us th,
  table.contact-us td, table.contact-us tr { 
    display: block; 
  }

  /* Hide table headers (but not display: none;, for accessibility) */
  table.contact-us thead tr { 
    position: absolute;
    top: -9999px;
    left: -9999px;
  }

  table.contact-us tr {
    border: 1px solid #ccc;
  }

  table.contact-us td { 
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eee; 
    position: relative;
    padding-left: 1.5em; 
  }

}