/*Site Leaving overlay*/
/*ID selector to be replaced by class selector after actual implementation*/
.site-leaving-overlay {
  display: none; 
  padding: 60px 30px;
  max-width: 600px;
  max-height: 324px;
  margin: 0 auto;
  position: relative;
  background: #fff;
  border: 5px solid #000;
}

/*To be removed after applying clearfix class to the class which will replace the ID selector*/
.site-leaving-overlay:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* .site-leaving-overlay h2 { */
  /* color: #0649bd; */
/* } */

.mfp-bg {
  background: #4095dd;
}

.site-leaving-overlay.show {
  display: block;
}

.site-leaving-overlay .overlay-close {
  width: 30px;
  height: 30px;
  display: inline-block;
  background: url('/sites/default/themes/custom/peh_template/images/global/overlay-close.png') no-repeat;
  font-size: 0;
  position: absolute;
  top: 15px;
  right: 15px;
  cursor: pointer;
}

.site-leaving-overlay button.mfp-close {
  display: none;
}
.links-content {
  display: table;
  width: 100%;
}
.site-leaving-overlay .btn-primary {  
  float: left;
  display: table-cell;
  width: auto;
}

.site-leaving-overlay .stay-link {  
  color: #0071d1;
  text-decoration: underline;
  background: url('/sites/default/themes/custom/peh_template/images/global/stay-link-arrow.png') no-repeat center right;
  cursor: pointer;
  display: table-cell;
  vertical-align: middle;
  text-align: right;
  padding: 0 20px 0 0;
}

.site-leaving-overlay .stay-link:hover,
.site-leaving-overlay .continue-link:hover {
  text-decoration: none;
}

.site-leaving-overlay .overlay-content {
  margin: 15px 0 40px 0;
}

/*****************************************************************
 ------------------------------------------------------------------
 CSS for Mobile and iPad potrait
 ------------------------------------------------------------------
 *****************************************************************/
@media only screen and (max-width: 999px) , only screen and (max-device-width: 999px) and (orientation: portrait) {

}

/*****************************************************************
------------------------------------------------------------------
CSS FOR iPHONE 5 STARTS HERE
------------------------------------------------------------------
*****************************************************************/
@media only screen and (min-device-width: 320px) and (max-device-width: 568px)
and (-webkit-device-pixel-ratio: 2) and (device-aspect-ratio: 40/71) and (orientation:portrait) {
   .site-leaving-overlay {
    padding: 12% 4%;
  }

}