:root {
  --vote-banner-height: 55px;
}

.vb-top-banner {
  display: block;
  height: var(--vote-banner-height);
  background-image: url(/block/population-banner/img/sity-desktop.svg);
  background-color: #bfddff;
  z-index: 10;
  position: fixed;
  top: 0;
  width: 100%;
}

.vb-top-banner-text{
	background-image: url(/block/population-banner/img/text.svg);
	width: 409px;
  height: 91px;
  margin-left: 29%;
  margin-top: 16px;
  background-repeat: no-repeat;
}
.vb-top-banner-button{
	background-image: url(/block/population-banner/img/red_button.svg);
	width: 261px;
  height: 71px;
  display: block;
  margin-top: 22px;
  margin-right: 40px;
}
.vb-top-banner-button:hover{
	box-shadow: 0 0 10px rgba(0,0,0,0.5);
	border-radius: 13px;
}
.vb-top-banner-desktop {
  display: flex;
  justify-content: space-between;
  background-image: url(/block/population-banner/img/baner_desktop.svg);
  background-position: left center;
  background-size: contain;
  background-repeat: no-repeat;
  height: var(--vote-banner-height);
}

.vb-top-banner-tablet {
  display: none;
}

.vb-top-banner-mobile {
  display: none;
}

.vb-bottom-banner-mobile {
  display: none;
  background-color: #214083;
}

.vb-bottom-banner-tablet {
  display: none;
  background-color: #214083;
}
@media (min-width: 1260px) and (max-width: 1352px){
  .vb-top-banner-desktop {
  	justify-content: flex-start;
  }
  .vb-top-banner-text {
    background-image: url(/block/population-banner/img/text.svg);
    width: 292px;
    height: 65px;
    margin-left: 41%;
    margin-top: 22px;
    background-size: contain;
	}
	.vb-top-banner-button {
    background-image: url(/block/population-banner/img/red_button.svg);
		width: 191px;
    height: 52px;
    display: block;
    position: absolute;
    top: 5px;
    right: 5em;
    background-size: contain;
  }
}
@media (min-width: 600px) and (max-width: 1279px) {
  .vb-top-banner-desktop {
    display: none;
  }

  .vb-top-banner-tablet {
	  display: flex;
	  justify-content: flex-start;
	  background-image: url(/block/population-banner/img/baner_ipad.svg);
		background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
	  height: var(--vote-banner-height);
  }
  .vb-top-banner-text{
  	margin-left: 1%;
    margin-top: 16px;
    width: 47%;
    background-size: contain;
    background-repeat: no-repeat;
  }
	.vb-top-banner-button{
		background-image: url(/block/population-banner/img/red_button.svg);
	  width: 175px;
	  height: 48px;
	  display: block;
	  position: absolute;
	  top: 40px;
	  right: 5%;
	  background-size: contain;
	  margin-top: 0px;
    margin-right: 0px;
	}
	.vb-top-banner-button:hover{
		box-shadow: 0 0 10px rgba(0,0,0,0.5);
		border-radius: 8px;
	}
  .vb-top-banner-mobile {
    display: none;
  }

  .vb-bottom-banner-tablet {
    display: flex;
    justify-content: center;
  }
}

.homepage-slider__vb {
  margin-top: calc(6rem + var(--vote-banner-height));
}

@media (max-width: 767px) {
  :root {
    --vote-banner-height: 100px;
  }
}

@media (max-width: 600px) {

  .vb-top-banner-desktop {
    display: none;
  }
  .vb-top-banner-tablet {
    display: none;
  }

  .vb-top-banner-mobile {
	  display: flex;
	  justify-content: flex-start;
	  background-image: url(/block/population-banner/img/baner_iphone.svg);
	  background-position: left center;
	  background-size: cover;
	  height: var(--vote-banner-height);
  }
	.vb-top-banner-text{
		width: 185px;
    height: 40px;
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 42%;
    margin-top: 24px;
	}
  .vb-top-banner-button{
  	width: 140px;
    height: 38px;
    background-size: contain;
    top: auto;
    position: absolute;
    bottom: 35px;
    right: 10%;
    margin-top: 0px;
    margin-right: 0px;
  }
	.vb-top-banner-button:hover {
	  border-radius: 7px;
	}
  .homepage-slider__vb {
    margin-top: 4rem;
  }
}

.ph-background__vb {
  top: var(--vote-banner-height);
}

.homepage-video__vb {
  top: var(--vote-banner-height);
}

.ph-darkened-background__vb::after {
  top: var(--vote-banner-height);
}

.pm__vb {
  top: var(--vote-banner-height);
}

@media (max-width: 991px) {
  .content-header__vb {
    margin-top: 152px;
  }
}
.c-banner__button {
  color: #FFF;
}