.gogopo-section-title {
  font-size: 1.5em;
  margin: 1em;
  text-align: center;

}

#row-contact {
	color: #A8A7A6;
	background-color: #1B2026;
  padding: 2.5em 0;
}

.container .with-neg-margin{
  margin-top: -3em;
}

.col-sm{
  margin-top: 3em;
}

.bgded{
    background-position:top center;
    background-repeat:no-repeat;
    background-size:cover;
}

.full-height {
    min-height: 100vh; /* Full viewport height */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Distribute space between the rows */
}

canvas {
  overflow-y: hidden;
  overflow-x: hidden;
  width: 100%;
  margin: 0;
}

#home {
  position:relative;
  min-height:100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

#canvasoverlay {
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Space rows evenly with padding at top and bottom */
    height: 100%; /* Make it take full height of parent */
}

#countdown-clock {
  font-size: clamp(2em, 12vw,5em);
  text-align: center;
  text-shadow: #e33a5e 1px 0 10px;
}

#home canvas, #canvasoverlay{
  position:absolute;
}

#home .btn, .btn:focus {
	color: #FFFFFF;
	background-color: #0f7dc1;
	border-color: #e33a5e;
}

#home .btn:hover, .btn.inverse {
	color: inherit;
	background-color: transparent;
	border-color: inherit;
}

.countdown-spacer {
  display: none;
}
@media (min-width: 768px) {
  .countdown-spacer {
    display: block;
  }
}

/* Adjust the layout when countdown-spacer is hidden */
@media (max-width: 767.98px) {
    .col-6:not(.countdown-spacer) {
        flex: 0 0 100%; /* Make remaining col-6 take up full width */
        max-width: 100%;
        text-align: center; /* Center align the content */
    }
}

#about-gift p{
  font-size: 1.2em;
}

#about-gift .btn, .btn:focus {
	color: #FFFFFF;
	background-color: #0f7dc1;
	border-color: #e33a5e;
  font-size: 1.5em;
}

#about-gift .btn:hover, .btn.inverse {
	color: inherit;
	background-color: transparent;
	border-color: inherit;
}

.row-with-margin-top{
  margin-top: 3em;
}


  .vertical-alignment-helper {
    display: table;
    height: 100%;
    width: 100%;
    pointer-events: none;
    /* This makes sure that we can still click outside of the modal to close it */
  }

  .vertical-align-center {
    /* To center vertically */
    display: table-cell;
    vertical-align: middle;
    pointer-events: none;
  }

  .modal-content {
    /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
    width: inherit;
    max-width: inherit;
    /* For Bootstrap 4 - to avoid the modal window stretching full width */
    height: inherit;
    /* To center horizontally */
    margin: 0 auto;
    pointer-events: all;
  }


#savings-chart .btn, .btn:focus {
	color: #FFFFFF;
	background-color: #0f7dc1;
	border-color: #e33a5e;
}

#savings-chart .btn:hover, .btn.inverse {
	color: inherit;
	background-color: transparent;
	border-color: inherit;
}

.countdown-spacer {
  display: none;
}
@media (min-width: 768px) {
  .countdown-spacer {
    display: block;
  }
}