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

#number-container {
	position: relative;
	width: 90%;
	margin: 0 auto;
	height: 100vh;
}

.number {
	position: absolute;
	width: 33%;
	height: 100%;
	padding: 2.5%;
	box-sizing: border-box;
}
.number img { 
	width: 100%; 
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	margin: auto;
}

#number_hundred {}
#number_ten { left: 33%; }
#number_one { left: 66%; }

p#temp {
	font-family: Helvetica;
	font-size: 20px;
	color: magenta;
	
}

p#rain {
	font-family: Helvetica;
	font-size: 20px;
	color: cyan;
	
}

p#wind {
	font-family: Helvetica;
	font-size: 20px;
	color: yellow;
	
}


#card-a{
	position: absolute;
	z-index:-13;
	display: inline-block;
}

#card-b{
	position: absolute;
	z-index:-9;
	display: inline-block;
}

#card-c{
	position: absolute;
	z-index:-5;
	display: inline-block;
}

#card-d{
	position: absolute;
	z-index:-2;
	display: inline-block;
}

#card-e{
	position: absolute;
	z-index:-12;
	display: inline-block;
}

#card-f{
	position: absolute;
	z-index:-8;
	display: inline-block;
}

#card-g{
	position: absolute;
	z-index:-4;
	display: inline-block;
}

#card-h{
	position: absolute;
	z-index:-1;
	display: inline-block;
}

#card-i{
	position: absolute;
	z-index:-11;
	display: inline-block;
}

#card-j{
	position: absolute;
	display: inline-block;
}

#card-k{
	position: absolute;
	z-index:-3;
	display: inline-block;
}

#card-l{
	position: absolute;
	z-index:-10;
	display: inline-block;
}

#card-m{
	position: absolute;
	z-index:-7;
	display: inline-block;
}

#card-n{
	position: absolute;
	z-index:-6;
	display: inline-block;
}

#background{
	position: absolute;
	z-index: -1;

}

/*#number_hundred{
	position: fixed;
	display: inline-block;
	margin-top:10%;
	
}

#number_ten{
	position: fixed;
	display: inline-block;
	margin-left: 25%;
	margin-top:10%;
}

#number_one{
	position: fixed;
	display: inline-block;
	margin-left: 50%;
	margin-top:10%;
}*/

#shape{
	animation-name: spin;
    animation-duration: 10000ms;
    animation-iteration-count: infinite;
    animation-timing-function: linear;}

    @-webkit-keyframes spin { 
        from { 
            -webkit-transform: rotate(0deg); 
        } to { 
            -webkit-transform: rotate(360deg); 
        }
    }
    @keyframes spin { 
        from { 
            transform: rotate(0deg); 
        } to { 
            transform: rotate(360deg); 
        }
    }
}