body{
	margin: 0;
	padding: 0;
	border: 0;
	overflow: hidden;
}

p{
	font-family: 'Racing Sans One', cursive;
	font-size: 5em;
	line-height: 1;
	color: white;

	text-align: center;
    margin-right: 15%;
	margin-left: 15%;
	margin-bottom: auto;
    margin-top: -80px;
    position: absolute;
    top: 50%;
    width: 70%;
}
/*---------------Rainy Days--------------*/
#rainy{
	width: 100%;
	height: 100vh;
	background-color: #006ccf;
}

#cloudy{
	width: 100%;
	height: 100vh;
	background-color: #797e8e;
}

#partlyCloudy{
	width: 100%;
	height: 100vh;
	background-color: #0d7f3f;
}

#sunny{
	width: 100%;
	height: 100vh;
	background-color: #f3cc11;
}


#rainy {
	display: block;
}

#cloudy {
	display: none;
}

#partlyCloudy {
	display: none;
}

#sunny {
	display: none;
}


/*-----------Text---------------------*/

.forecast{
	visibility: visible;
}

.middle{
	visibility: hidden;
}

.activity1{
	text-align: center;
   	margin: 15%;
    width: 70%;
    position: relative;
   	top: 50%;
   	color: yellow;

	visibility: hidden;
}

/*fix position*/
.activity2{
	text-align: center;
	margin-left: -500px;
    width: 70%;
    position: relative;
   	top: 60%;
   	color: yellow;

	visibility: hidden;
}


#changeText {
	font-family: 'Racing Sans One', cursive;
	font-size: 5em;
	line-height: 1;
	color: white;

	text-align: center;
    margin-right: 15%;
	margin-left: 15%;
	margin-bottom: auto;
    margin-top: -80px;
    position: absolute;
    top: 50%;
    width: 70%;
}