h1 {
    text-align: center;
}

h2 {
    text-align: center;
}

h3 {
    text-align: center;
}

h4 {
    text-align: center;
}

p {
    text-align: center;
}

.block {
  display: block;
  width: 40%;
  border: none;
  background-color: #80e;
  color: #fff;
  padding: 10px 18px;
  font-size: 15px;
  cursor: pointer;
  text-align: center;
  margin-left: 35px;
}

.block:hover {
  background-color: #ddd;
  color: #000;
}

.columns {
  display: grid;
  grid-template-columns: 49% 2% 49%;
  padding: 20px 20px;
  
}

.container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  grid-auto-rows: 150px;
  grid-gap: 12px;
  grid-auto-flow: dense;
}

.container2 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));
  grid-auto-rows: 60px;
  grid-gap: 20px;
  grid-auto-flow: dense;
}

.container3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 320px));
  grid-auto-rows: 200px;
  grid-gap: 10px;
  grid-auto-flow: dense;
}

.container4{
 width: 100vw;
 position: relative;
 height: 100px;
 margin-top: 10px;
}

.citycontainer {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  grid-auto-rows: 45px;
  grid-gap: 12px;
  grid-auto-flow: dense;
}

.container img {
   width: 100%;
   height: 100%;
}

.statecontainer {
  display: flex;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-auto-rows: 100px;
  grid-gap: 12px;
  grid-auto-flow: dense;
  justify-content: center;
  align-items: center;
}

.statecontainer img {
   width: 100%;
   height: 100%;
}

.villagecontainer {
  display: flex;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-auto-rows: 100px;
  grid-gap: 12px;
  grid-auto-flow: dense;
  justify-content: left;
  align-items: left;
}

.airplanecontainer img {
   width: 410px;
   height: 266px;
}

.airplanecontainer {
  display: flex;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-auto-rows: 100px;
  grid-gap: 12px;
  grid-auto-flow: dense;
  justify-content: left;
  align-items: left;
}

.villagecontainer img {
   width: 1584%;
   height: 1327%;
}

.cityname {
    grid-column ;
    width: 100%;
    height: 45px;
    background-color: white;
}
.cityname:hover {
        background: lightblue;
    }

.color-blue-2 {
    grid-column: span 2;
    width: 100%;
    height: 100%;
    background-color: blue;
}

.horizontal {
    grid-column: span 2;
}

.long {
    grid-column: span 3;
}

.long-black {
    grid-column: span 2;
    background-color: black;
}

.long3-black {
    grid-column: span 3;
    background-color: black;
}

.long4 {
    grid-column: span 4;
}

.vertical {
    grid-row: span 2;
}

.verticalmedium {
    grid-row: span 3;
    grid-column: span 2;
}

.verticalbig {
    grid-column: span 2;
    grid-row: span 4;
}

.big {
    grid-column: span 2;
    grid-row: span 2;
}

.horizontalbig {
    grid-column: span 6;
    grid-row: span 2;
}

.bigger {
    grid-column: span 3;
    grid-row: span 3;
}

.biggest{
    grid-column: span 4;
    grid-row: span 4;
}
.sidebar {
    grid-row: span 12;
}

.swap {
	width: 160px;
	height: 150px;
	position: relative;
	display: inline-block;
}

.swap .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.swap:hover .img-front {
	display: inline-block;
}

.swap2 {
    grid-column: span 2;
	position: relative;
	display: inline-block;
}

.swap2 .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.swap2:hover .img-front {
	display: inline-block;
}

.swap22 {
    grid-column: span 2;
    grid-row: span 2;
	position: relative;
	display: inline-block;
}

.swap22 .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.swap22:hover .img-front {
	display: inline-block;
}

.price1 {
	width: 160px;
	height: 150px;
	position: relative;
	display: inline-block;
}

.price1 .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.price1:hover .img-front {
	display: inline-block;
}

.price2 {
    grid-row: span 2;
	position: relative;
	display: inline-block;
}

.price2 .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.price2:hover .img-front {
	display: inline-block;
}

.price2a {
    grid-column: span 2;
	position: relative;
	display: inline-block;
}

.price2a .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.price2a:hover .img-front {
	display: inline-block;
}

.price3 {
    grid-column: span 3;
	position: relative;
	display: inline-block;
}

.price3 .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.price3:hover .img-front {
	display: inline-block;
}

.price4 {
    grid-column: span 2;
    grid-row: span 2;
	position: relative;
	display: inline-block;
}

.price4 .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.price4:hover .img-front {
	display: inline-block;
}

.price4a {
    grid-column: span 3;
	position: relative;
	display: inline-block;
}

.price4a .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.price4a:hover .img-front {
	display: inline-block;
}

.price4:hover .img-front {
	display: inline-block;
}

.price4b {
    grid-column: span 4;
	position: relative;
	display: inline-block;
}

.price4b .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.price4b:hover .img-front {
	display: inline-block;
}

.price5 {
    grid-column: span 2;
    grid-row: span 4;
	position: relative;
	display: inline-block;
}

.price5 .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.price5:hover .img-front {
	display: inline-block;
}

.price6 {
    grid-column: span 3;
    grid-row: span 3;
	position: relative;
	display: inline-block;
}

.price6 .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.price6:hover .img-front {
	display: inline-block;
}

.price6a {
    grid-column: span 4;
    grid-row: span 4;
	position: relative;
	display: inline-block;
}

.price6a .img-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}

.price6a:hover .img-front {
	display: inline-block;
}

ul.no-bullets {
  list-style-type: none;
  margin: 10px;
  padding: 0;
}

/* unvisited link */
a:link {
    text-decoration: none;
    color: #1c1cf0;
}
 /* visited link */
    a:visited {
    text-decoration: none;
    color: #095484;
}
/* mouse over link */
a:hover {
    text-decoration: none;
    color: #000;
}
/* selected link */
a:active {
    text-decoration: none;
    color: #800000;
}

.aspect {
    aspect-ratio: 2/1;
    margin: auto;
}

.logosize-h{
    display: block;
    max-width:150px;
    max-height: 80px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.logosize-v{
    display: block;
    max-width:90px;
    max-height: 150px;
    margin: auto;
}

div.polaroid {
    width: 100%;
    background-color: white;
    margin-bottom: 25px;
}

div.polaroidbig {
    width: 200%;
    height: 200%;
    background-color: white;
    margin-bottom: 25px;
}

div.polaroidmenu {
    width: 15%;
    background-color: white;
    margin-bottom: 10px;
}

        <!--CityElevated is the idea of and owned by John Michael Stewart of The Villages, Florida. The idea originated over 30 years ago when John owned and operated Stewart & Company Designers. This idea is the property of John Michael Stewart. 2015 is the first year John started this project under the name of 1SmartCity.com. This idea and work is protected under Copyright. Copyright 2015 - 2023 CityElevated Inc.-->