/*
.page-modal > .modal-dialog {
  width:60%;
}
*/
.modal:not(.in) {
  display: none !important;
}

.page-modal > .modal-dialog,
.page-modal > .modal-dialog > .modal-content {
  height:100%;
  margin:0px auto;
}

.page-modal .modal-header {
  position:absolute;
  top:40px;
  width:100%;
  padding:0px 10%;
}

.page-modal .modal-title {
  font-size:28px;
  font-weight: bold;
}

.page-modal .modal-title-desc {
  font-size:14px;
}

.modal .modal-body {
  position:absolute;
  top: 50px;
  bottom:70px;
  width:100%;
  padding:0px 5%;
    height:400px;
    overflow: scroll;
    padding-bottom: 22px;
    
}

.page-modal .modal-body {
  top:180px;
  bottom:105px;
  padding:0px 10%;
 
}

.modal .modal-message {
  background-color:#ecf4fd;
  width:100%;
  height:100%;
  padding:10px;
  overflow-y: auto;
  overflow-x: hidden;
  border-radius:10px; 
  font-size: large;
  font-weight: bold;
  
}

.page-modal .modal-message {
  padding:70px 60px;
}

.page-modal .modal-footer {
  text-align:center;
}


.floating-modal .modal-dialog {
  width:500px;
  height:500px;
}

.vertical-align-helper {
  display:table;
  height: 100%;
  width: 100%;
}

.modal .vertical-align-helper {
  pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
}

.vertical-align-center {
  display: table-cell;
  vertical-align: middle;
}

.modal .vertical-align-center {
  pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
}

.floating-modal .modal-dialog > .modal-content {
  /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
   width:inherit;
   height:inherit;
   /* To center horizontally */
   margin: 0 auto;
   pointer-events: all;
}

.modal-header,
.modal-footer {
  border:none;
}

.modal-footer {
  position:absolute;
  bottom:0px;
  width:100%;
  text-align:center;
}

a.learn-more-link {
  display: block;
}

#mainContent #fcpLabel {
  width:100%;
  text-align: center;
  font-size:22px;
  font-weight:bold;
  color:#485a63;
  text-decoration: underline;
}

@media screen and (max-width: 767px) {
  /*
  .page-modal > .modal-dialog {
    width:100%;
  }
  */

  .floating-modal .modal-dialog {
    width:100%;
    height:100%;
  }
}