.search_block .tabs li a {
  border-top   : 3px solid transparent;
  color        : var(--grey);
  display      : block;
  font-size    : var(--fs24);
  height       : var(--fs48);
  line-height  : var(--fs48);
  margin-bottom: var(--fs14);
  text-align   : center;
  transition   : var(--transition);
  width        : 100%;
}

@media screen and (max-width: 991px) {
  .search_block .tabs li a {
    font-size: var(--fs16);
  }
}

.search_block .tabs li a.tab:hover,
.search_block .tabs li a.tab.active {
  color           : var(--white);
  background-color: var(--blue);
  transition      : var(--transition);
}

.search .panels .panel {
  display: none;
}

.search .panels .panel.active {
  display: block;
}

.search .titre-widget {
  color    : var(--blue);
  font-size: var(--fs24);
}

.link-event {
  color        : var(--blue);
  padding-right: var(--fs40);
  position     : relative;
}

.link-event:after {
  background: transparent url(../img/yellowharrow.svg) no-repeat right center;
  content   : "";
  display   : block;
  height    : 13px;
  right     : 20px;
  position  : absolute;
  top       : -1px;
  transition: var(--transition);
  width     : 14px;
}

.link-event:hover:after {
  right: 14px;
}

/******************************
FORMULAIRE
******************************/
.form-control {
  border-color : var(--lightgrey);
  border-width : 1px;
  display      : block;
  font-size    : 1rem;
  color        : var(--grey);
  border-radius: 0;
  resize       : none;
}

.form-control:focus {
  color           : var(--grey);
  background-color: var(--white);
  border-color    : 1px solid var(--blue);
  outline         : 0;
  box-shadow      : none;
}

.form-search-icon,
.form-search {
  background-color: var(--white);
  border          : none;
  position        : relative;
  height          : var(--fs50);
  width           : 100%;
}

.form-search-icon {
  padding-left : var(--fs40);
  padding-right: var(--fs16);
  background   : transparent;
}

.form-search {
  padding-left: var(--fs16);
}

.icon-form-search {
  background     : transparent url(../img/search.svg) no-repeat center center;
  background-size: var(--fs20);
  height         : var(--fs20);
  position       : absolute;
  top            : 30%;
  width          : var(--fs20);
}

.input-header {
  border      : none;
  color       : var(--black);
  font-size   : var(--fs11);
  height      : 40px;
  padding-left: var(--fs30);
  width       : 100%;
}

/******************************
BUTTON
******************************/
.btn-search {
  background: #003A72 url(../img/yellowharrow.svg) no-repeat center center;
  border    : none;
  height    : 50px;
  width     : 50px;
}

.btn-research {
  background-color: rgba(0, 58, 114, 1);
  border          : none;
  border-radius   : 0;
  color           : var(--yellow);
  display         : inline-block;
  font-size       : var(--fs16);
  font-weight     : bold;
  padding         : var(--fs10) var(--fs40) var(--fs10) var(--fs20);
  position        : relative;
  transition      : 0.5s;
}

.btn-research:after {
  background: transparent url(../img/yellowharrow.svg) no-repeat right center;
  content   : "";
  display   : block;
  height    : 18px;
  right     : 20px;
  position  : absolute;
  top       : 30%;
  transition: 0.5s;
  width     : 14px;
}

.btn-research:hover:after {
  right     : 14px;
  transition: 0.5s;
}

.btn-research:hover {
  background-color: #003263;
  color           : var(--yellow);
  transition      : var(--transition);
}

.parks_tab {
  background-color: var(--white);
  border          : none;
  border-radius   : 0;
  color           : var(--blue);
  display         : inline-block;
  font-size       : var(--fs16);
  font-weight     : bold;
  padding         : var(--fs10) var(--fs40) var(--fs10) var(--fs20);
  position        : relative;
  transition      : 0.5s;
  margin-left     : var(--fs10);
  margin-bottom   : var(--fs10);
  width           : calc(33.33% - 6.66px);
}

.parks_tab:hover {
  color: var(--blue);
}

.parks_tab:first-child {
  margin-left: 0;
}

.parks_tab:after {
  background: transparent url(../img/blueharrow.svg) no-repeat right center;
  content   : "";
  display   : block;
  height    : 18px;
  right     : 20px;
  position  : absolute;
  top       : 30%;
  transition: 0.5s;
  width     : 14px;
}

.parks_tab.active {
  background-color: rgba(0, 58, 114, 1);
  color           : var(--yellow);
}

.suggestions .active:after {
  background: transparent url(../img/yellowharrow.svg) no-repeat right center;
  content   : "";
  transform : rotate(90deg);
}

.icon {
  position : absolute;
  top      : 15%;
  font-size: 16px;
}

.searchform .row {
  margin-left : 0;
  margin-right: 0;
}

.searchform .col-lg-5 {
  padding-left: 0;
}

.searchform .small {
  color    : var(--blue);
  font-size: var(--fs8);
  left     : 45px;
  top      : 0;
}

.bandeau-search {
  background     : transparent url(../img/bandeau-resultat.jpg) no-repeat center center;
  background-size: cover;
  padding        : var(--fs50) 0;
  transition     : var(--transition);
}

@media screen and (max-width: 992px) {
  .parks_tab {
    margin-left: 0;
    width      : 100%;
  }

  .offersearch {
    margin-bottom: var(--fs10);
  }
}

@media screen and (min-width: 992px) {
  .date-arrow:after {
    background: transparent url(../img/arrow.svg) no-repeat top left;
    position  : absolute;
    content   : "";
    height    : 20px;
    right     : 0;
    top       : 11px;
    width     : 29px;

  }

  .sticky {
    position  : fixed;
    padding   : 0;
    top       : 0;
    transition: var(--transition);
    width     : 100%;
    z-index   : 1000;
  }
}

/******************************
PARKING RESULT BLOCK
******************************/
.parking-result {
  font-size : var(--fs13);
  position  : relative;
  cursor    : pointer;
  min-height: 17.4rem;
}


@media screen and (max-width: 992px) {
  .parking-result {
    margin-top: 11px;
  }
}

@media screen and (min-width: 992px) {
  .parking-result:before {
    content     : "";
    position    : absolute;
    top         : 0;
    right       : -56px;
    width       : 50px;
    height      : 0;
    border-style: solid;
    border-width: 9.8rem 0 9.8rem 0px;
    border-color: transparent transparent transparent #F1F2F2;
    transition  : 0.5s;
  }

  .parking-result.active:before {
    border-width: 9rem 0 9rem 50px;
    transition  : 0.5s;
  }
}

.parking-result figure {
  margin-bottom: 0;
}

.parking-result .img-parking {
  background-image   : url(../img/bandeau-resultat.jpg);
  background-size    : cover;
  border-bottom      : 3px solid var(--yellow);
  background-position: center center !important;
}

.parking-result .titre-parkingresult {
  background-color: var(--white);
  color           : var(--blue);
  font-weight     : bold;
  margin-bottom   : var(--fs10);
  transition      : var(--transition);
}

.parking-result:hover .titre-parkingresult {
  background-color: var(--blue);
  color           : var(--white);
  transition      : var(--transition);
}

.titre-parkingresult h2 {
  font-size    : var(--fs16);
  font-weight  : bold;
  margin-bottom: 0;
}

.parking-result h3 {
  color        : var(--blue);
  font-size    : var(--fs24);
  margin-bottom: var(--fs10);
}

.parking-result .pop-up-group>div {
  position: relative;
}

.parking-result .pop-up-group .pop-up {
  background    : var(--white);
  border-radius : 5px;
  color         : var(--blue);
  display       : none;
  left          : -85px;
  padding       : 5px var(--fs10);
  pointer-events: none;
  position      : absolute;
  text-align    : center;
  transition    : 0.3s;
  width         : 196px;
  z-index       : 120;
}

.parking-result .pop-up-group .pop-up img {
  height: 20px;
}

.parking-result .pop-up-group>div:hover .pop-up {
  top      : 40px;
  display  : block;
  opacity  : 1;
  animation: animation-popup 0.3s ease-out;
}

.parking-result .pop-up-group .pop-up:before {
  position           : absolute;
  bottom             : 100%;
  right              : calc(50% - 10px);
  content            : '';
  pointer-events     : none;
  border             : solid transparent;
  border-color       : rgba(255, 255, 255, 0);
  border-bottom-color: var(--white);
  height             : 0;
  border-width       : 11px;
  margin-left        : -21px;
  width              : 0;
}

.transport-close {
  overflow: hidden;
  height  : 30px;
}

.transport-open {
  height: auto;
}

.plus-transport a,
.moins-transport a {
  display       : inline-block;
  padding-bottom: 30px;
  position      : relative;
  color         : var(--grey);
  font-weight   : 600;
  font-size     : var(--fs14);
}

.plus-transport a:before {
  background         : transparent url(../img/bluearrow.svg) no-repeat;
  background-size    : 15px 15px;
  background-position: 0 0;
  content            : "";
  height             : 15px;
  width              : 15px;
  position           : absolute;
  left               : 50%;
  top                : 20px;
  transform          : rotate(90deg);
  transition         : 0.5s;
}

.moins-transport a:before {
  background         : transparent url(../img/bluearrow.svg) no-repeat;
  background-size    : 15px 15px;
  background-position: 0 0;
  content            : "";
  height             : 15px;
  width              : 15px;
  position           : absolute;
  left               : 50%;
  top                : 20px;
  transform          : rotate(-90deg);
  transition         : 0.5s;
}

@keyframes animation-popup {
  0% {
    top    : 0px;
    opacity: 0;
  }

  100% {
    top    : 40px;
    opacity: 1;
  }
}

@-moz-keyframes animation-popup {
  0% {
    top    : 0px;
    opacity: 0;
  }

  100% {
    top    : 40px;
    opacity: 1;
  }
}

@-o-keyframes animation-popup {
  0% {
    top    : 0px;
    opacity: 0;
  }

  100% {
    top    : 40px;
    opacity: 1;
  }
}

@-webkit-keyframes animation-popup {
  0% {
    top    : 0px;
    opacity: 0;
  }

  100% {
    top    : 40px;
    opacity: 1;
  }
}

/******************************
PARKING INFOS BLOCK
******************************/
.infos-parkings-mobile,
.infos-parkings {
  font-size: var(--fs13);
}

.infos-parkings-mobile .w40,
.infos-parkings .w40 {
  padding-right: 10px;
}

.infos-parkings-mobile .picto.Bus,
.infos-parkings .picto.Bus {
  display      : inline-block;
  line-height  : 10px;
  margin-bottom: 10px;
  height       : 1.5rem;
  line-height  : 17px;
  text-align   : center;
  min-width    : 2rem;
}

.infos-parkings-mobile .picto.Métro,
.infos-parkings .picto.Métro {
  line-height: inherit;
}

.infos-parkings-mobile h3,
.infos-parkings h3 {
  color    : var(--blue);
  font-size: var(--fs32);
}

.infos-parkings-mobile ul.liste-parkings li,
.infos-parkings ul.liste-parkings li {
  color          : var(--grey);
  list-style-type: disc;
}

.infos-parkings-mobile dl dt,
.infos-parkings dl dt {
  margin-bottom: var(--fs5);
}

.infos-parkings-mobile dl dd,
.infos-parkings dl dd {
  margin-bottom: var(--fs3);
}

.infos-parkings-mobile h3 span,
.infos-parkings h3 span {
  color    : var(--grey);
  font-size: var(--fs26);
}

.btn-price {
  background-color: var(--yellow);
  color           : var(--blue);
  font-size       : var(--fs24);
  font-weight     : bold;
  padding         : var(--fs5) var(--fs30);
}

.promo-price {
  font-size      : var(--fs20);
  text-decoration: line-through;
}

.place-dispo {
  color       : var(--orange);
  font-size   : var(--fs16);
  padding-left: 30px;
  position    : relative;
}

.place-dispo:before {
  background: transparent url(../img/pictos/parking/sablier.svg) no-repeat top left;
  content   : "";
  height    : 20px;
  left      : 0;
  position  : absolute;
  width     : 20px;
}

.link-arrow:hover:after {
  right     : -30px;
  transition: var(--transition);
}

.link {
  color        : var(--blue);
  padding-right: var(--fs40);
  position     : relative;
  margin-top   : var(--fs20);
}

@keyframes hourglass {
  0% {
    transform: rotate(0deg)
  }

  40% {
    transform: rotate(180deg)
  }

  50% {
    transform: rotate(180deg)
  }

  80% {
    transform: rotate(360deg)
  }

  100% {
    transform: rotate(360deg)
  }
}

/******************************
PARKING EVENT BLOCK
******************************/
.parkings-event {
  color: var(--black);
}

.parkings-event h4 {
  color        : var(--blue);
  font-size    : var(--fs24);
  margin-bottom: 0;
}

.parkings-event .date,
.parkings-event .description {
  color: var(--grey);
}

.parkings-event .img-event {
  flex        : 1 0;
  margin-right: var(--fs10);
}

.parkings-event .img-event img {
  border-bottom: 3px solid var(--yellow);
}

.parkings-event figcaption {
  flex: 2 0;
}

.link-arrow {
  color     : var(--blue);
  display   : inline-block;
  margin-top: var(--fs10);
  position  : relative;
}

.link-arrow:after {
  background: transparent url(../img/yellowharrow.svg) no-repeat right center;
  bottom    : 0;
  content   : "";
  height    : var(--fs20);
  position  : absolute;
  right     : -20px;
  transition: var(--transition);
  width     : var(--fs20);
}

.link-arrow:hover {
  color: var(--blue);
}


.trajet-event nav.tabs li a.tab {
  border-top: 3px solid transparent;
  color     : var(--grey);
  font-size : var(--fs16);
  padding   : var(--fs20) var(--fs10);
  transition: var(--transition);
}

.trajet-event nav.tabs li a.tab:hover,
.trajet-event nav.tabs li a.tab.active {
  background-color: var(--white);
  border-top      : 3px solid var(--blue);
  color           : var(--grey);
  font-size       : var(--fs16);
  padding         : var(--fs20) var(--fs10);
  transition      : var(--transition);
}

.trajet-event .panels {
  background-color: var(--white);
  min-height      : 300px;
  padding         : var(--fs5);
}

#map.panels {
  height: 300px;
}

.trajet-event .panels {
  display: none;
}

.trajet-event .panels.active {
  display: block;
}

.infos-parkings-mobile,
.infos-parkings {
  visibility: hidden;
  height    : 0;
}

.infos-parkings-mobile.active,
.infos-parkings.active {
  visibility: visible;
  height    : auto;
}

.parking-result.active .titre-parkingresult {
  background-color: var(--blue);
  color           : var(--white);
  transition      : var(--transition);
}

@media (min-width: 992px) {

  .infos-parkings-mobile.active,
  .infos-parkings.active {
    display: block !important;
  }

  .d-lg-none.infos-parkings-mobile.active,
  .d-lg-none.infos-parkings.active {
    display: none !important;
  }
}

.pac-container:after {
  /* Disclaimer: not needed to show 'powered by Google' if also a Google Map is shown */

  background-image: none !important;
  height          : 0px;
}

#professionnal_data {
  display: none;
}

#professionnal_data.active {
  display: block;
}

#account_creation {
  display: none;
}

#account_creation.active {
  display: block;
}

.titre-white {
  background-color: var(--blue);
  padding         : var(--fs10);
}

.titre-blue {
  background-color: var(--white);
  padding         : var(--fs10);
}

.titre-white h2 {
  color: var(--white);
}

.titre-blue h2 {
  color: var(--blue);
}

.titre-white h2,
.titre-blue h2 {
  font-size     : var(--fs16);
  font-weight   : bold;
  margin-bottom : 0;
  text-transform: uppercase;
}

.form-control {
  border-color : var(--lightgrey) !important;
  border-width : 1px !important;
  display      : block !important;
  font-size    : 1rem !important;
  color        : var(--grey) !important;
  border-radius: 0 !important;
  resize       : none !important;
}

.col-form-label {
  color      : var(--grey);
  display    : block;
  font-weight: bold;
}

.btn-blue {
  background-color: rgba(0, 58, 114, 1);
  border          : none;
  border-radius   : 0;
  color           : var(--yellow);
  display         : inline-block;
  font-size       : var(--fs16);
  font-weight     : bold;
  padding         : var(--fs7) var(--fs20);
  position        : relative;
  transition      : 0.5s;
}

a.btn-blue:hover {
  color: var(--white);
}

.btn-white {
  background-color: rgba(255, 255, 255, 1);
  border          : none;
  border-radius   : 0;
  color           : var(--blue);
  display         : inline-block;
  font-size       : var(--fs14);
  font-weight     : bold;
  padding         : var(--fs5) var(--fs20);
  position        : relative;
  transition      : 0.5s;
}

.offer_details p {
  margin-bottom: 0;
}

.offer_details span {
  font-weight: 700;
}

.arrow:before {
  background: transparent url(../img/arrow.svg) no-repeat center;
  position  : absolute;
  color     : var(--grey);
  content   : "";
  height    : 100%;
  right     : 0;
  width     : 29px;
}

.md-checkbox {
  position  : relative;
  margin    : 1em 0;
  text-align: left;
  flex-wrap : nowrap;
}

.md-checkbox label {
  cursor        : pointer;
  display       : inline;
  font-size     : var(--fs14);
  margin-bottom : 0;
  font-weight   : normal;
  line-height   : 1.25em;
  vertical-align: top;
  clear         : both;
  padding-left  : 20px;
  width         : 100%;
}

.md-checkbox label:before,
.md-checkbox label:after {
  content : "";
  position: absolute;
  left    : 5px;
  top     : 0;
}

.md-checkbox label:before {
  width        : 1.25em;
  height       : 1.25em;
  background   : var(--white);
  border       : 1px solid #ced4da;
  border-radius: 0.125em;
  cursor       : pointer;
  transition   : background .3s;
}

.md-checkbox input[type="checkbox"] {
  outline   : 0;
  visibility: hidden;
  width     : 1.25em;
  margin    : 0;
  display   : block;
  float     : left;
  font-size : inherit;
}

.md-checkbox input[type="checkbox"]:checked+label:before {
  background: var(--blue);
  border    : none;
}

.md-checkbox input[type="checkbox"]:checked+label:after {
  transform         : translate(0.25em, 0.3365384615em) rotate(-45deg);
  width             : 0.75em;
  height            : 0.375em;
  border            : 0.125em solid #fff;
  border-top-style  : none;
  border-right-style: none;
}

.md-checkbox input[type="checkbox"]:disabled+label:before {
  border-color: rgba(0, 0, 0, 0.26);
}

.md-checkbox input[type="checkbox"]:disabled:checked+label:before {
  background: rgba(0, 0, 0, 0.26);
}

.form-row .md-checkbox {
  margin: 0 0 5px 0;
}

/***** ORDER LOADING BLOC */
.bg-loading {
  width          : 100%;
  height         : 100%;
  position       : fixed;
  z-index        : 10;
  background     : rgba(0, 0, 0, 0.5);
  top            : 0;
  display        : none;
  justify-content: center;
  align-items    : center;
}

.bg-loading.active {
  display: flex;
}

.lds-ellipsis {
  display : inline-block;
  position: relative;
  width   : 80px;
  height  : 80px;
}

.lds-ellipsis div {
  position                 : absolute;
  top                      : 33px;
  width                    : 13px;
  height                   : 13px;
  border-radius            : 50%;
  background               : #fff;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
  left     : 8px;
  animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
  left     : 8px;
  animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
  left     : 32px;
  animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
  left     : 56px;
  animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0);
  }
}

@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }

  100% {
    transform: translate(24px, 0);
  }
}

.promo.close-icon.active {
  display: flex;
}

.promo.close-icon {
  display    : none;
  align-items: center;
  font-size  : 20pt;
  position   : absolute;
  right      : 125px;
  bottom     : 0;
  z-index    : 9;
  color      : var(--middleblue);
  cursor     : pointer;
}

/* PICTOS MAPS TRANSPORTS */
span.picto {
  font-weight: 600;
  padding    : 4px;
}

span.picto.RER,
span.picto.Métro {
  padding        : 4px 8px;
  border-radius  : 50%;
  display        : inline-flex;
  height         : 1.5rem;
  width          : 1.5rem;
  align-items    : center;
  justify-content: center;
}

img.icon_service {
  width: 24px;
}

.command_resume figure img {
  height      : auto;
  margin-right: var(--fs16);
  width       : 30%;
}

.command_resume figure figcaption {
  width: 65%;
}

/*** ORDER PAGE */
.order_img {
  background-size: cover;
}

/***** TABS ON SUGGESTION */
.suggestions .searchform {
  display: none;
}

.suggestions .searchform.active {
  display: block;
}

img.payment_method {
  width: 70px;
}

/**********************************
ANIMATION FOR BUTTON DURING SEARCH
**********************************/
.searchloader {
  background-color: rgba(0, 58, 114, 1);
  border-radius   : 0;
  border          : none;
  font-size       : var(--fs16);
  color           : var(--yellow);
  font-weight     : bold;
  display         : none;
  position        : relative;
  width           : 50px;
  height          : 50px;
  transition      : 0.5s;
}

.searchloader:after {
  content      : " ";
  display      : block;
  width        : 20px;
  height       : 20px;
  border-radius: 50%;
  border       : 2px solid var(--yellow);
  border-color : var(--yellow) transparent var(--yellow) transparent;
  animation    : searchloader 1.2s linear infinite;
  margin       : 0 auto;
}

@keyframes searchloader {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.legendary {
  font-size  : var(--fs11);
  margin-left: 1rem;
}

/***********
NOTICE BLOC
***********/
.noticebloc {
  max-width    : 90%;
  width        : auto;
  background   : var(--white);
  border-radius: var(--fs10);
  box-shadow   : 0px 0px 10px rgba(0, 0, 0, 0.25);
  display      : none;
  left         : 5%;
  position     : absolute;
  top          : 50px;
  z-index      : 999;
}

.noticebloc p {
  font-size    : var(--fs13);
  margin-bottom: 0;
}

.noticebloc:before {
  border-bottom: 10px solid var(--white);
  border-left  : 10px solid transparent;
  border-right : 10px solid transparent;
  content      : "";
  filter       : drop-shadow(0 -10px 12px #6E81AB);
  position     : absolute;
  top          : -10px;
}

div#notice.active {
  display: block;
}

#price_discount,
#price_discount_mobile,
#price_cancellation {
  display: none;
}

/* ETAPE ACHAT */
.step-purchase {
  margin-bottom: 50px;
}

.step-purchase:before {
  background: var(--blue);
  content   : "";
  height    : 6px;
  left      : 5px;
  position  : absolute;
  top       : 50%;
  transform : translateY(-50%);
  width     : 98%;
}

.step-purchase li a {
  background   : var(--lightgrey);
  border-radius: 50%;
  color        : var(--grey);
  cursor       : pointer;
  height       : var(--fs30);
  line-height  : var(--fs30);
  position     : relative;
  text-align   : center;
  width        : var(--fs30);
  display      : block;
  z-index      : 10;
}

.step-purchase li a.active:hover {
  background: var(--blue);
  color     : var(--white);
}

.step-purchase li a.past {
  background: var(--white);
  border    : 1px solid var(--blue);
}

.step-purchase li a.disable {
  background: var(--white);
  border    : 1px solid var(--blue);
}

.step-purchase li a.past {
  background: var(--blue);
  border    : 1px solid var(--white);
  color     : var(--white);
}

.step-purchase li a.active {
  background: var(--blue);
  color     : var(--white);
}

.step-purchase li a.active:before {
  background: var(--blue);
  color     : var(--white);
}

.step-purchase a.active {
  background: var(--blue);
  color     : var(--white);
}

.border-required-step {
  border : 1px solid red !important;
  outline: none;
}

.our_offer {
  color:var(--blue);
  text-decoration: underline;
}
/* IAO Warning Popup */

div#iao_single_dialog_warning {
  position        : fixed;
  top             : 0;
  left            : 0;
  right           : 0;
  bottom          : 0;
  padding         : 24px;
  z-index         : 666;
  background-color: rgba(0, 0, 0, 0.5);
  display         : flex;
  justify-content : center;
  align-items     : center;
}

div#iao_single_dialog_warning>div {
  background-color: white;
  padding         : 24px;
  max-width       : 720px;
  color           : black;
}

div#iao_single_dialog_warning.close {
  display: none;
}

div#iao_single_dialog_warning nav {
  display: flex;
  justify-content: flex-end;
  column-gap: 12px;
}

div#iao_single_dialog_warning button {
  padding: 12px;
  border: 0;
  font-weight: bolder;
}

div#iao_single_dialog_warning button.btn-research {
  padding-right: var(--fs40);
}
div#iao_single_dialog_warning button.cancel {
  background-color: var(--yellow);
  color: rgba(0, 58, 114, 1);
}