/*--------------------------------------------------------------
-----------ALL POPUPS TO BE PLACED IN THIS FILE-----------------
--------------------------------------------------------------*/
/*--PREDEFINED COLOURS--*/
/*--RESPONSIVE BREAKPOINTS--*/
/* FONT FAMILY */
/* PHONE MEDIA QUERY */
/* TABLET MEDIA QUERY */
/* DESKTOP MEDIA QUERY */
/*----------------------- MIXINS -----------------------*/
.middle {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
/*----------------------- ANIMATION -----------------------*/
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    tranform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    tranform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    tranform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    tranform: rotate(360deg);
  }
}
@keyframes bouncing {
  0%,
  100% {
    transform: scale3d(1, 1, 1);
  }
  50% {
    transform: scale3d(0, 0, 1);
  }
}
@-webkit-keyframes bouncing {
  0%,
  100% {
    transform: scale3d(1, 1, 1);
  }
  50% {
    transform: scale3d(0, 0, 1);
  }
}
@keyframes pulse {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  60% {
    box-shadow: 0 0 0 60px rgba(255, 255, 255, 0.1);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes pulse {
  0% {
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  60% {
    box-shadow: 0 0 0 60px rgba(255, 255, 255, 0.1);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes up-and-down {
  0% {
    transform: translate(0, 0);
  }
  50% {
    transform: translate(0, 15px);
  }
  100% {
    transform: translate(0, 0);
  }
}
.no-js .white-overlay {
  display: none;
}
.region-header .alert.alert-status.alert-success.alert-dismissible {
  max-width: 80vw;
  min-width: 80vw;
  position: inherit;
}
.region-header .alert.alert-status.alert-success.alert-dismissible .close {
  position: inherit;
}
.region-header .alert.alert-status.alert-success.alert-dismissible ul.messages__list {
  display: flex;
  flex-direction: column;
}
.region-header .alert.alert-status.alert-success.alert-dismissible ul.messages__list li.messages__item {
  width: 100%;
  min-width: 90%;
  display: flex;
  font-size: initial;
  float: left;
  border: 0;
  align-items: center;
}
.region-header .alert.alert-status.alert-success.alert-dismissible ul.messages__list li.messages__item a {
  width: 120px;
  float: left;
  font-size: 14px;
  color: rgba(0, 159, 218);
}
.ui-resizable-handle {
  display: none!important;
}
/*--IMAGE UPLOAD BOX--*/
#uploadImage {
  border: 0;
  padding: 0px 40px 40px 40px;
}
#uploadImage #checkMessage {
  margin: 15px;
}
#upload-btn {
  width: 100%!important;
  background: #009fda;
  color: #fff;
  font-family: Cairo;
  font-size: 15px;
  font-weight: 700;
  padding: 15px;
  border-radius: 0;
}
#upload-btn:hover {
  opacity: 0.9;
}
.avatar-upload {
  position: relative;
  max-width: 192px;
  max-height: 192px;
  margin: 50px auto;
}
.avatar-upload .avatar-edit {
  position: absolute;
  bottom: 5px;
  right: 5px;
  z-index: 1;
  border-radius: 100%;
  border: 5px solid #fff;
  background: #fff;
  transition: all 0.2s ease-in-out;
  box-shadow: 0 0px 0px rgba(0, 0, 0, 0.19), 0 px px rgba(0, 0, 0, 0.23);
}
.avatar-upload .avatar-edit:hover {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}
.avatar-upload .avatar-edit input {
  display: none;
}
.avatar-upload .avatar-edit input + label {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 62.5px;
  height: 62.5px;
  margin-bottom: 0;
  border-radius: 100%;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.avatar-upload .avatar-edit input + label:hover {
  border-color: #d6d6d6;
}
.avatar-upload .avatar-edit input + label:after {
  content: "";
  background: url(/sites/default/files/dashboard-icon/avatar-plus-icon.png) no-repeat center center;
  background-size: cover;
  width: 62.5px;
  height: 62.5px;
  position: absolute;
  margin: auto;
}
.avatar-upload .avatar-preview {
  width: 192px;
  height: 192px;
  position: relative;
  margin: 0 auto;
  border-radius: 100%;
}
.avatar-upload .avatar-preview > div {
  width: 100%;
  height: 100%;
  border-radius: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
@keyframes moveTop {
  from {
    top: 15px;
  }
  to {
    top: 0px;
  }
}
div[aria-describedby="HomeAddressChangePopUp"].ui-dialog,
div[aria-describedby="MailingAddressChangePopUp"].ui-dialog {
  z-index: 1056;
}