Design Engine auto generated syntax v1

svg-tint-background.css

/* CSS Generator v1.0 */
/* Code snippets by Design Engine. */
/* Made in Mountain View, CA. */
/* -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- */


.congrats {
	position: absolute;
  top: 0px;
  left: 0px;
  width: 375px;
  height: 812px;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 20px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 40px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 60px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 80px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 100px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 120px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 140px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 160px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 180px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 200px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 220px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 240px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 260px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 280px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 300px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 320px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 340px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.rectangle {
  position: absolute;
  top: 0px;
  left: 360px;
  width: 1px;
  height: 812px;
  background-color: #9A9A9A;
}
.tint {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 375px;
  height: 812px;
  background-color: #000000;
}
.svg-tint-background {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 375px;
  height: 812px;
  background-color: #000000;
}
.parcel {
  position: absolute;
  top: 165px;
  left: 98px;
  width: 180px;
  height: 160px;
  background-color: #0073FF;
}
.rectangle-5 {
  position: absolute;
  top: 165px;
  left: 98px;
  width: 180px;
  height: 160px;
  background-color: #0073FF;
}
.header {
  position: absolute;
  top: 446px;
  left: 6px;
  width: 364px;
  height: 106px;
  background-color: #0073FF;
}
.background {
  position: absolute;
  top: 446px;
  left: 6px;
  width: 364px;
  height: 106px;
  background-color: #0073FF;
}
.street {
  position: absolute;
  top: 488px;
  left: 50px;
  width: 275px;
  height: 20px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 25px;
  color: #FFFFFF;
  letter-spacing: 3.80px;
  line-height: 33px;
  text-align: center;
}
.city-state {
  position: absolute;
  top: 522px;
  left: 101px;
  width: 172px;
  height: 14px;
  font-family: "AvenirNext DemiBold", sans-serif;
  font-weight: 600;
  font-size: 15px;
  color: #FFFFFF;
  letter-spacing: 0.00px;
  line-height: 28px;
  text-align: center;
}
.title {
  position: absolute;
  top: 464px;
  left: 136px;
  width: 99px;
  height: 11px;
  font-family: "BourbonGrotesque Regular", sans-serif;
  font-weight: 400;
  font-size: 13px;
  color: #FFFFFF;
  letter-spacing: 3.50px;
  line-height: 128px;
  text-align: center;
}
.owner {
  position: absolute;
  top: 569px;
  left: 28px;
  width: 320px;
  height: 58px;
  background-color: #FFFFFF;
}
.rectangle-4 {
  position: absolute;
  top: 569px;
  left: 28px;
  width: 320px;
  height: 58px;
  background-color: #FFFFFF;
}
.llama19 {
  position: absolute;
  top: 591px;
  left: 143px;
  width: 90px;
  height: 15px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 19px;
  color: #3E3E3E;
  letter-spacing: 0.24px;
  line-height: 24px;
  text-align: center;
}
.owner {
  position: absolute;
  top: 576px;
  left: 34px;
  width: 39px;
  height: 9px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 10px;
  color: #9B9B9B;
  letter-spacing: 0.13px;
  line-height: 24px;
  text-align: left;
}
.price-size {
  position: absolute;
  top: 626px;
  left: 28px;
  width: 320px;
  height: 58px;
  background-color: #FFFFFF;
}
.rectangle-4 {
  position: absolute;
  top: 626px;
  left: 28px;
  width: 160px;
  height: 58px;
  background-color: #FFFFFF;
}
.rectangle-4 {
  position: absolute;
  top: 626px;
  left: 187px;
  width: 161px;
  height: 58px;
  background-color: #FFFFFF;
}
.22872 {
  position: absolute;
  top: 647px;
  left: 72px;
  width: 71px;
  height: 17px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 17px;
  color: #3E3E3E;
  letter-spacing: 0.21px;
  line-height: 24px;
  text-align: center;
}
.22-up2 {
  position: absolute;
  top: 648px;
  left: 237px;
  width: 60px;
  height: 14px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 17px;
  color: #3E3E3E;
  letter-spacing: 0.21px;
  line-height: 24px;
  text-align: center;
}
.price {
  position: absolute;
  top: 633px;
  left: 34px;
  width: 29px;
  height: 9px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 10px;
  color: #9B9B9B;
  letter-spacing: 0.13px;
  line-height: 24px;
  text-align: left;
}
.size {
  position: absolute;
  top: 633px;
  left: 194px;
  width: 21px;
  height: 9px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 10px;
  color: #9B9B9B;
  letter-spacing: 0.13px;
  line-height: 24px;
  text-align: left;
}
.buy {
  position: absolute;
  top: 683px;
  left: 28px;
  width: 320px;
  height: 58px;
  background-color: #FFFFFF;
}
.rectangle-4 {
  position: absolute;
  top: 683px;
  left: 28px;
  width: 320px;
  height: 58px;
  background-color: #FFFFFF;
}
.button {
  position: absolute;
  top: 688px;
  left: 34px;
  width: 309px;
  height: 48px;
  background-color: #02A100;
}
.rectangle-3 {
  position: absolute;
  top: 688px;
  left: 34px;
  width: 309px;
  height: 48px;
  background-color: #02A100;
}
.rectangle-3 {
  position: absolute;
  top: 730px;
  left: 34px;
  width: 309px;
  height: 6px;
  background-color: #FFFFFF;
}
.view-title {
  position: absolute;
  top: 701px;
  left: 121px;
  width: 131px;
  height: 16px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 20px;
  color: #FFFFFF;
  letter-spacing: 2.40px;
  line-height: 26px;
  text-align: center;
}
.rectangle-5 {
  position: absolute;
  top: 329px;
  left: 127px;
  width: 37px;
  height: 37px;
  background-color: #A9A9A9;
}
.rectangle-5 {
  position: absolute;
  top: 245px;
  left: 219px;
  width: 24px;
  height: 37px;
  background-color: #0073FF;
}
.rectangle-5 {
  position: absolute;
  top: 205px;
  left: 170px;
  width: 37px;
  height: 37px;
  background-color: #73DC15;
}
.rectangle-5 {
  position: absolute;
  top: 108px;
  left: 235px;
  width: 37px;
  height: 37px;
  background-color: #FFD600;
}
.rectangle-5 {
  position: absolute;
  top: 41px;
  left: 285px;
  width: 37px;
  height: 37px;
  background-color: #73DC15;
}
.rectangle-5 {
  position: absolute;
  top: 144px;
  left: 285px;
  width: 41px;
  height: 37px;
  background-color: #E0F528;
}
.rectangle-5 {
  position: absolute;
  top: 227px;
  left: 157px;
  width: 37px;
  height: 37px;
  background-color: #E0F528;
}
.rectangle-5 {
  position: absolute;
  top: 179px;
  left: 207px;
  width: 37px;
  height: 37px;
  background-color: #E0F528;
}
.rectangle-5 {
  position: absolute;
  top: 141px;
  left: 170px;
  width: 37px;
  height: 37px;
  background-color: #0073FF;
}
.rectangle-5 {
  position: absolute;
  top: 123px;
  left: 120px;
  width: 41px;
  height: 19px;
  background-color: #0073FF;
}
.rectangle-5 {
  position: absolute;
  top: 164px;
  left: 128px;
  width: 37px;
  height: 37px;
  background-color: #E0F528;
}
.rectangle-5 {
  position: absolute;
  top: 145px;
  left: 41px;
  width: 37px;
  height: 37px;
  background-color: #73DC15;
}
.rectangle-5 {
  position: absolute;
  top: 316px;
  left: 189px;
  width: 37px;
  height: 37px;
  background-color: #E0F528;
}
.rectangle-5 {
  position: absolute;
  top: 258px;
  left: 110px;
  width: 24px;
  height: 37px;
  background-color: #0073FF;
}
.rectangle-5 {
  position: absolute;
  top: 335px;
  left: 204px;
  width: 37px;
  height: 37px;
  background-color: #73DC15;
}
.rectangle-5 {
  position: absolute;
  top: 272px;
  left: 165px;
  width: 37px;
  height: 37px;
  background-color: #73DC15;
}
.rectangle-5 {
  position: absolute;
  top: 299px;
  left: 267px;
  width: 41px;
  height: 19px;
  background-color: #E0F528;
}
.rectangle-5 {
  position: absolute;
  top: 413px;
  left: 159px;
  width: 37px;
  height: 37px;
  background-color: #E0F528;
}
.rectangle-5 {
  position: absolute;
  top: 385px;
  left: 178px;
  width: 37px;
  height: 37px;
  background-color: #73DC15;
}
.rectangle-5 {
  position: absolute;
  top: 78px;
  left: 170px;
  width: 37px;
  height: 37px;
  background-color: #E0F528;
}
.rectangle-5 {
  position: absolute;
  top: 54px;
  left: 47px;
  width: 37px;
  height: 37px;
  background-color: #E0F528;
}
.street {
  position: absolute;
  top: 233px;
  left: 53px;
  width: 273px;
  height: 67px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 68px;
  color: #FFFFFF;
  letter-spacing: -3.00px;
  line-height: 60px;
  text-align: center;
}
.background {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 375px;
  height: 68px;
  background-color: #FFFFFF;
}
.background {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 375px;
  height: 68px;
  background-color: #FFFFFF;
}
.line {
  position: absolute;
  top: 67px;
  left: 0px;
  width: 375px;
  height: 1px;
  background-color: #D8D8D8;
}
.shape {
  position: absolute;
  top: 19px;
  left: 20px;
  width: 30px;
  height: 30px;
  background-color: #3E3E3E;
}
.left {
  position: absolute;
  top: 13px;
  left: 90px;
  width: 99px;
  height: 42px;
  background-color: #E5E5E5;
}
.background {
  position: absolute;
  top: 13px;
  left: 90px;
  width: 99px;
  height: 42px;
  background-color: #E5E5E5;
}
.map-icon-active {
  position: absolute;
  top: 20px;
  left: 126px;
  width: 28px;
  height: 28px;
  background-color: #9B9B9B;
}
.shape {
  position: absolute;
  top: 33px;
  left: 126px;
  width: 28px;
  height: 15px;
  background-color: #9B9B9B;
}
.pin {
  position: absolute;
  top: 20px;
  left: 133px;
  width: 13px;
  height: 20px;
  background-color: #9B9B9B;
}
.shape {
  position: absolute;
  top: 20px;
  left: 133px;
  width: 13px;
  height: 19px;
  background-color: #9B9B9B;
}
.oval {
  position: absolute;
  top: 25px;
  left: 138px;
  width: 3px;
  height: 3px;
  background-color: #9B9B9B;
}
.right {
  position: absolute;
  top: 13px;
  left: 187px;
  width: 99px;
  height: 42px;
  background-color: #FFFFFF;
}
.background {
  position: absolute;
  top: 13px;
  left: 187px;
  width: 99px;
  height: 42px;
  background-color: #FFFFFF;
}
.list-icon-tab-nonactive {
  position: absolute;
  top: 20px;
  left: 226px;
  width: 22px;
  height: 28px;
  background-color: #3E3E3E;
}
.shape {
  position: absolute;
  top: 20px;
  left: 226px;
  width: 22px;
  height: 28px;
  background-color: #3E3E3E;
}
.rectangle-2 {
  position: absolute;
  top: 32px;
  left: 232px;
  width: 10px;
  height: 3px;
  background-color: #3E3E3E;
}
.rectangle-2 {
  position: absolute;
  top: 26px;
  left: 232px;
  width: 10px;
  height: 3px;
  background-color: #3E3E3E;
}
.shape {
  position: absolute;
  top: 20px;
  left: 226px;
  width: 22px;
  height: 28px;
  background-color: #9B9B9B;
}
.rectangle-2 {
  position: absolute;
  top: 32px;
  left: 232px;
  width: 10px;
  height: 3px;
  background-color: #9B9B9B;
}
.rectangle-2 {
  position: absolute;
  top: 26px;
  left: 232px;
  width: 10px;
  height: 3px;
  background-color: #9B9B9B;
}
.background {
  position: absolute;
  top: 764px;
  left: 0px;
  width: 375px;
  height: 48px;
  background-color: #FFFFFF;
}
.background {
  position: absolute;
  top: 764px;
  left: 0px;
  width: 375px;
  height: 48px;
  background-color: #FFFFFF;
}
.user-details {
  position: absolute;
  top: 770px;
  left: 10px;
  width: 129px;
  height: 36px;
  background-color: #E5E5E5;
}
.username {
  position: absolute;
  top: 782px;
  left: 51px;
  width: 76px;
  height: 12px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 15px;
  color: #3E3E3E;
  letter-spacing: 1.00px;
  line-height: 20px;
  text-align: left;
}
.avatar {
  position: absolute;
  top: 773px;
  left: 10px;
  width: 30px;
  height: 30px;
  background-color: #E5E5E5;
}
.combined-shape {
  position: absolute;
  top: 780px;
  left: 331px;
  width: 24px;
  height: 17px;
  background-color: #3E3E3E;
}
.sticky-header {
  position: absolute;
  top: 68px;
  left: 0px;
  width: 375px;
  height: 48px;
  background-color: #000000;
}
.rectangle-2 {
  position: absolute;
  top: 68px;
  left: 0px;
  width: 375px;
  height: 48px;
  background-color: #000000;
}
.you-are-now-the-owne {
  position: absolute;
  top: 86px;
  left: 43px;
  width: 286px;
  height: 13px;
  font-family: "AvenirNext Bold", sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #FFFFFF;
  letter-spacing: 1.71px;
  line-height: 24px;
  text-align: center;
}
.close-button-gray {
  position: absolute;
  top: 376px;
  left: 311px;
  width: 44px;
  height: 44px;
  background-color: #8B8B8B;
}
.oval {
  position: absolute;
  top: 376px;
  left: 311px;
  width: 44px;
  height: 44px;
  background-color: #8B8B8B;
}
.combined-shape {
  position: absolute;
  top: 391px;
  left: 326px;
  width: 14px;
  height: 14px;
  background-color: #FFFFFF;
}