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

body{
    margin:0;
    padding:0;
	width: 100%;
	overflow-x:hidden;
}

#container {
	overflow: auto;
}

/* top menu */

#menuwrapper {
	height: 170px;
	background-color: white;
		width: 100%;
		line-height: 0px;
}

#menu {
	max-width: 700px;
	margin: 50px auto;
	height: auto;
	line-height: 0px;
}
.clear {
	clear: both;
	overflow: auto;
}

/* BUTTONS FOR BIG SCREEN*/

#buttons {
	width: 100%;
	text-align: center;
	padding: 0 0 0 0;
	margin-top: 0px;
	display: inline-block;
	clear: both;
		line-height: 18px;
	
}


.aboutbox {
    float: left;
}
.stretch {
   width: 100%;
    display: inline-block;
    font-size: 0;
    line-height: 0;
}


.aboutbox {
    padding: 0;
    margin: 0;
    vertical-align: top;
    text-align: left;
}

#button1 {
	max-width: 119px;
	width: 12.89%;
	z-index: 200;
	display: block;
}

#button2 {
	max-width: 113px;
	width: 12.24%;
	z-index: 200;
	display: block;
}

#button3 {
	max-width: 149px;
	width: 16.14%;
	z-index: 200;
	display: block;
}

#button4 {
	max-width: 127px;
	width: 13.75%;
	z-index: 200;
	display: block;
}

#button5 {
	max-width: 85px;
	width: 9.21%;
	z-index: 200;
	display: block;
}

#button6 {
	max-width: 81px;
	width: 8.78%;
	z-index: 200;
	display: block;
}

#button7 {
	max-width: 69px;
	width: 7.48%;
	z-index: 200;
	display: block;
}

#button8 {
	max-width: 82px;
	width: 8.88%;
	z-index: 200;
	display: block;
}

#button9 {
	max-width: 98px;
	width: 10.62%;
	z-index: 200;
	display: block;
}

.aboutbox img {
    width: 100%;
    height: auto;
    border: 0;
}
.aboutbox:hover img.off { display: none; overflow: hidden; }
.aboutbox       img.on  { display: none; overflow: hidden; }
.aboutbox:hover img.on  { display: inline-block; overflow: hidden; }

/*BUTTONS FOR SMALL SCREEN*/

#buttonsA {
	width: 100%;
	text-align: center;
	margin-top: 0px;
	padding: 0 0 0 0;
	display: none;
	line-height: 18px;
	clear: both;
}

#buttonsB {
	width: 100%;
	text-align: center;
	padding: 0 0 0 0;
	display: none;
	line-height: 18px;
	clear: both;
}



#button1A {
	max-width: 119px;
	width: 23.43%;
		line-height: 0px;
}

#button2A {
	max-width: 113px;
	width: 22.24%;
		line-height: 0px;
}

#button3A {
	max-width: 149px;
	width: 29.33%;
	line-height: 0px;
}

#button4A {
	max-width: 127px;
	width: 24.99%;
	line-height: 0px;
}

#button5A {
	max-width: 85px;
	width: 16.73%;
	line-height: 0px;
}

#button6A {
	max-width: 81px;
	width: 15.94%;
	line-height: 0px;
}

#button7A {
	max-width: 69px;
	width: 13.58%;
	line-height: 0px;
}

#button8A {
	max-width: 82px;
	width: 16.14%;
	line-height: 0px;
}

#button9A {
	max-width: 98px;
	width: 19.29%;
	line-height: 0px;
}

#buttonwhite {
	max-width: 47px;
	width: 9.25%;
	line-height: 0px;
}

@media (max-width: 1024px) {
	#menuwrapper {
		height: 100px;
		width: 90%;
		margin: 0 auto;
}

#menu {
	margin: 20px auto;
}
}

@media (max-width: 550px) {
	#buttons {
		display: none;
}
	#buttonsA {
		display: inline-block;
				margin-top: 2px;
	}
	
		#buttonsB {
		display: inline-block;
				margin-top: -24px;
	}
	
	#menuwrapper {
		height: 80px;
		width: 70%;
		margin: 0 auto;
}

#menu {
	margin: 20px auto;
	text-align: center;
}	



}

@media (max-width: 400px) {
	#buttons {
		display: none;
}

	#buttonsA {
		display: inline-block;
		margin-top: 2px;
	}
	
		#buttonsB {
		display: inline-block;
		margin-top: -15px;

	}
	
	#menuwrapper {
		height: 100px;
		width: 90%;
		margin: 0 auto;
}

#menu {
	margin: 20px auto;
	text-align: center;
}	

}

/* body */

#bodywrapper {
	position: absolute;
	background-color: #bababa;
	width: 100%;
	bottom: 100px;
	top: 170px;
	overflow: auto;
}

@media (max-width: 1024px) {
	#bodywrapper {
		top: 100px;
		bottom: 40px;
	}
	
}

@media (max-width: 900px) {
	#bodywrapper {
		top: 100px;
		height: 1000px;
		}
}

@media (max-width: 550px) {
	#bodywrapper {
		top: 80px;
		height: 1000px;
}
}

/* bottom */

#bottomwrapper {
	background-color: #FFFFFF;
	width: 100%;
	height: 100px;
	position: absolute;
	bottom: 0px;
	left: 0px;
	display: inline;
	overflow: hidden;
	
}

@media (max-width: 1024px) {
	#bottomwrapper {
		height: 40px;
		
}
}

@media (max-width: 900px) {
	#bottomwrapper {
		display: none;
}
}


@media (max-width: 550px) {
	#bottomwrapper {
		display: none;
	}
}