@charset "UTF-8";
/* CSS Document */

#koalas-logo {
	/*width: calc(100% - 470px);*/
	width: calc(45% - 0px);
	height: 500px;
	float: left;
}

	#koalas-logo a {
		height: 500px;
		background-image: url(../images/artwork/fighting-koalas/koala12.png);
	}
	
			#koalas-logo a:hover {
				height: 500px;
				background-image: url(../images/artwork/fighting-koalas/koala12-hover.png);
			}

#koalas-mascot {
	width: calc(35% - 0px);
	height: 500px;
	float: right;
}

	#koalas-mascot a {
		height: 500px;
		background-image: url(../images/artwork/fighting-koalas/koalamascot.png);
	}
	
			#koalas-mascot a:hover {
				height: 500px;
				background-image: url(../images/artwork/fighting-koalas/koalamascot-hover.png);
			}

#koalas-sketch {
	width: calc(20% - 0px);
	height: 300px;
	float: right;
}

	#koalas-sketch a {
		height: 300px;
		background-image: url(../images/artwork/fighting-koalas/koala3.png);
	}
	
			#koalas-sketch a:hover {
				height: 300px;
				background-image: url(../images/artwork/fighting-koalas/koala3-hover.png);
			}
                    
#koalas-text-logo {
	width: calc(54% - 5px);
	height: 250px;
	float: right;
	margin-left: 9px;
}

	#koalas-text-logo a {
		height: 250px;
		background-image: url(../images/artwork/fighting-koalas/koalatext.png);
	}
	
			#koalas-text-logo a:hover {
				height: 250px;
				background-image: url(../images/artwork/fighting-koalas/koalatext-hover.png);
			}

#koalas-about {
	width: calc(46% - 5px);
	min-height: 200px;
	float: left;
}


@media only screen and (max-width: 880px), only screen and (max-device-width: 880px) {
	
	#koalas-logo {
		height: 400px;
	}
	
	#koalas-mascot {
		height: 400px;
	}
}