.colourpallete{
  background-color: #E1EF7E;
  background-color: #FFAA01;
  background-color: #12B296;
  background-color: #027A9F;
}


#heading {
  background-color: #E1EF7E;
  justify-content: center;
  font-family: 'Rancho', cursive;
  color: #027A9F;
  
}

h1{
  font-family: 'Rancho', cursive;
}

.homedata {
  justify-content: center;
  text-align: center;
}

#rightNow {
  text-align: center;
}

#today {
  text-align: center;
}

#location {
  text-align: right;
}

#searchPanel, #wildcardPanel {
  background-color: #12B296;
  text-align: center;
  min-width: 200px;
  padding: 5px;
}

.note {
  font-family: 'Rancho', cursive;
  margin-bottom: 5px; 
  font-size: larger;
  color: white;
}


#previous {
  margin-top: 15px;
}

.previousCity {
  border: none;
  margin: 5px;
  /* padding-top: 15px */
  max-width: 200px;
  padding-left: 30px;
  padding-right: 30px;
  color: #027A9F;
  height: 50px;
  background-color: #E1EF7E;
}

#resultsPanel{
  font-family: 'Rancho', cursive;
}

.todayresult {
  margin: 5px;
  font-size: x-large;
}

.wildcard {
    border: none;
    margin: 5px;
    color: #E1EF7E;
    height: 100px;
    max-width: 200px;
    min-width: 100px;
}

.tropical{
    background-image: url(./island.JPG);
}
.mountain{
    background-image: url(./mountain.JPG);
}
.desert{
    background-image: url(./desert.JPG);
}

.polar{
  background-image: url(./polar.JPG);
}

.big{
  background-image: url(./bigcity.JPG);
}


.thundernight{
  background-image: url(./thunder.jpg);
}

.thunder{
  background-image: url(./thunder-day.jpg);
}

.sunny{
  background-image: url(./sunny.jpg);
} 

.stars{
  background-image: url(./stars.jpg);
}

.mist{
  background-image: url(./mist.jpg);
}

.cloudy{
  background-image: url(./cloudy.jpg);
}

.cloudynight{
  background-image: url(./cloudy-night.jpg);
}

.rain{
  background-image: url(./rain.jpg);
}

.rainnight{
  background-image: url(./rainy-night.jpg);
}

.snow{
  background-image: url(./snow.jpg);
}

.snownight {
  background-image: url(./snow-night.jpg);
}

.checking{
  background-image: url(./binoculars.JPG);
}

.lost{
  background-image: url(./lost.jpg);
}



.low {
  background-color: limegreen;
}

.moderate {
  background-color: yellow;
}

.high {
  background-color: orange;
}

.veryhigh {
  background-color: red;
}

.extreme {
  background-color: violet;
}

.card {
  display: flex;
  color: #027A9F;
  background-color: #E1EF7E;
  margin: 2px;
  min-width: 100px;
  list-style: none;
}