/****************VIDEO MODAL****************/

.video-img-wrapper {
  position: relative;
  display: inline-block;
  overflow: hidden;
}

.video-img-wrapper svg {
  position: absolute;
  right: 0;
  margin: auto;
  left: 0;
  top: 50%;
  height: 100%;
  width: 100%;
  transform: translateY(-50%);
}

svg.overlay-svg {
  fill: #00000050;
}

svg.play-svg {
  fill: white;
  width: 5rem;
  filter: drop-shadow(3px 3px 2px rgba(255, 255, 255, .2));
  pointer-events: none;
}

#media-modal {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.7);
  transition: .3s ease;
}


.videowrapper {
  float: none;
  clear: both;
  width: 100%;
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 0;
  height: 0;
  margin-top: 20px;
}

.videowrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#modal-body {
  cursor: pointer;
  float: right;
  margin-bottom: 1rem;
}

.video-img-wrapper {
  position: relative;
  display: block;
}

#media-modal #modal-box {
  position: relative;
  /*top: 90px;*/
  margin-top:1rem;
  margin-left: auto;
  margin-right: auto;
  padding: 10px;
  background-color: #FFFFFF;
  max-width: 1110px;
  border: 1px solid #666666;
  box-shadow: 2px 2px 10px #66666680;
}

.btn-orange {
  background-color: rgb(215, 100, 10 );
}

.btn-orange:hover {
  background-color: rgb(165 77 8);
}

/*OVERWRITE Bootstrap CSS*/
.modal-open {
  padding-right: 0px!important;
}

/*.link-success{
  color:  #00529c!important;
}*/

/*.link-success:hover{
  text-decoration-color: #00529c!important;
}*/

.modal-content {
  background-color: #EEEEEE;
}