#wrapper {
	height:810px;		/* Of course you need to specify the object height */

	position:relative;	/* On older OS versions "position" and "z-index" must be defined, */
	z-index:1;			/* it seems that recent webkit is less picky and works anyway. */

	width:100%;
	background:#aaa;
/*	background:#aaa url(wrapper-bg.png);*/
}

#scroller {
/*	-webkit-touch-callout:none;*/
/*	-webkit-tap-highlight-color:rgba(0,0,0,0);*/
	width:3300px;
	height:810px;
	float:left;
	padding:0;
	
/*	-webkit-box-shadow:0 0 8px #555;	/* Don't use shadows in production, they slow down drastically CSS animations */
}

.shakoTownImg{
	height:810px;
	width:4500px;
	margin-left:-550px;
}

.viewTown{
	width:768px;
	height:1024px;
	background-color:#ddd;
	position:relative;
}

.optionButtonDiv{
	position:absolute;
	top:20px;
	left:10px;
}

.optionButton{
	background-color:#c5c7c8;
	border:1px solid #b8babb;
	border-radius: 5px;
	height:30px;
	width:135px;
	color:#535154;
}

.optionButtonText{
	color:#535154;
	font-size:12pt;
	padding:5px 5px 5px 30px;
}

.searchFieldDiv{
	position:absolute;
	top:20px;
	right:110px;
	text-align:right;
}

.searchField{
	
	border:1px solid #c5c6c7;
	border-radius: 15px;
	height:30px;
	width:330px;
	color:#535154;
	background: url(../images/search.jpg);
	background-color:#fff;
	background-repeat:no-repeat;
	background-position:3px 3px;
}

.searchFieldContent{
	border:0;
	background-color:white;
	width:270px;
	background: url(../images/white.jpg);
	margin-right:10px;
	height:20px;
	font-size:12px;
	margin-top:3px;
	
}


.viewTown_header{
	width:768px;
	height:50px;
}

.viewTown_main{
	width:675px;
	height:885px;
}

.viewTown_mainBg{
	width:744px;
	height:930px;
	margin:10px;
	background-color:white;
	border-top:1px solid white;
	border-left:1px solid white;
	-moz-box-shadow: 5px 10px 5px #b9b8b9;
	-webkit-box-shadow: 5px 10px 5px #b9b8b9;
	box-shadow: 5px 10px 5px #b9b8b9;
	background: url(../images/paperBGPortrait.jpg);
}

.mainHeader{
	width:720px;
	height:85px;
	border:1px solid #bebfc0;
	margin:10px 10px 10px 10px;
	background: url(../images/logo.jpg);
	background-repeat: no-repeat;
	background-position:250px 10px;
	
}

.mainContent{
	width:720px;
	height:810px;
	border:1px solid #bebfc0;
	margin:10px 10px 0px 10px;
	
}


.mainOverview{
	
}

.mainOverviewTown{
	width:720px;
	height:410px;
	background-color:#7d7b7b;
	float:left;
}

.mainOverviewTownButton{
	width:544px;
	margin:40px;
	margin-left:80px;
	-moz-box-shadow: 10px 10px 10px #424242;
	-webkit-box-shadow: 10px 10px 10px #424242;
	box-shadow: 10px 10px 10px #424242;
	border-radius: 10px;
	height:350px;
	background: url(../images/townButtonPortrait.jpg);
	
}


.mainOverviewCategory{
	width:720px;
	height:410px;
	float:left;
	background-color:#7d7b7b;
}

.innerSpaceOverviewCategory{
	padding:40px;
}

.mainOverviewCategoryButton{
	width:140px;
	margin:20px 20px 15px 40px;
	-moz-box-shadow: 10px 10px 10px #424242;
	-webkit-box-shadow: 10px 10px 10px #424242;
	box-shadow: 10px 10px 10px #424242;
	border-radius: 10px;
	height:140px;
	float:left;
	position:relative;
	
}

.category1Button{
	background: url(../images/cat_1.jpg);
}

.category2Button{
	background: url(../images/cat_2.jpg);
}

.category3Button{
	background: url(../images/cat_3.jpg);
}

.category4Button{
	background: url(../images/cat_4.jpg);
}

.category5Button{
	background: url(../images/cat_5.jpg);
}

.category6Button{
	background: url(../images/cat_6.jpg);
}


.mainOverviewCategoryButton2{
	width:140px;
	margin:20px 20px 15px 40px;
	-moz-box-shadow: 5px 5px 5px #424242;
	-webkit-box-shadow: 5px 5px 5px #424242;
	box-shadow: 5px 5px 5px #424242;
	border-radius: 10px;
	height:140px;
	float:left;
	position:relative;
}

.mainOverviewCategoryText{
	position:absolute;
	bottom:0px;
	padding:5px 15px 5px 15px;
	color:black;
	font-size:10pt;
	font-weight:bold;

}

.mainCategory{
	background-color:#7d7b7b;
	width:720px;
	height:810px;
}

.outerBoxCateogry{
	width:625px;
	height:360px;
	margin:0 auto;
	padding-top:70px;
	
}

.categoryList{
	width:200px;
	height:330px;
	background-color:white;
	float:left;
	border-bottom:8px solid #189a59;
	-moz-box-shadow: 5px 5px 5px #424242;
	-webkit-box-shadow: 5px 5px 5px #424242;
	box-shadow: 5px 5px 5px #424242;
	
}

.productList{
	width:400px;
	margin-left:20px;
	height:700px;
	background-color:white;
	float:left;
	border-bottom:8px solid #189a59;
	-moz-box-shadow: 5px 5px 5px #424242;
	-webkit-box-shadow: 5px 5px 5px #424242;
	box-shadow: 5px 5px 5px #424242;
	
}


#wrapperProduct {
	height:700px;		/* Of course you need to specify the object height */

	position:relative;	/* On older OS versions "position" and "z-index" must be defined (absolute | relative), */
	z-index:1;			/* it seems that recent webkit is less picky and works anyway. */

	width:400px;
	overflow:hidden;
}

#scrollerProduct {
/*	-webkit-touch-callout:none;*/
	-webkit-tap-highlight-color:rgba(0,0,0,0);

	float:left;
	width:400px;
	padding:0;

/*	-webkit-box-shadow:0 0 8px #555;	/* Don't use box shadows, they slow down drastically CSS animations */
}

.productItem{
	margin:0px 15px 0px 15px;
}

.productItemText{
	padding:13px 0px 14px 0px;
	font-size:11pt;
	color:#9e9c9c;
	border-bottom:1px solid #c5c6c7;
	background: url(../images/smallArrow.jpg);
	background-repeat:no-repeat;
	background-position:350px 17px;; 
}

.productItemTextEnd{
	padding:13px 0px 14px 0px;
	font-size:11pt;
	color:#9e9c9c;
	background: url(../images/smallArrow.jpg);
	background-repeat:no-repeat;
	background-position:350px 17px;; 
}


.categoryItem{
	margin:0px 15px 0px 15px;
}

.categoryItemText{
	padding:13px 0px 14px 0px;
	font-size:11pt;
	color:#9e9c9c;
	border-bottom:1px solid #c5c6c7;
	background: url(../images/smallArrow.jpg);
	background-repeat:no-repeat;
	background-position:150px 17px;; 
}

.categoryItemTextEnd{
	padding:13px 0px 14px 0px;
	font-size:11pt;
	color:#9e9c9c;
	background: url(../images/smallArrow.jpg);
	background-repeat:no-repeat;
	background-position:150px 17px;; 
}


.mainProductDetail{
	background-color:#7d7b7b;
	width:720px;
	height:810px;
}

.outerBoxProduct{
	width:630px;
	height:810px;
	margin:0 auto;
	padding-top:70px;
	
}


.productGeneral{
	width:210px;
	margin-left:15px;
	height:420px;
	background-color:white;
	float:left;
	border-bottom:8px solid #189a59;
	-moz-box-shadow: 5px 5px 5px #424242;
	-webkit-box-shadow: 5px 5px 5px #424242;
	box-shadow: 5px 5px 5px #424242;
	overflow:hidden;
	
}

.productContent{
	width:400px;
	margin-left:15px;
	height:420px;
	background-color:white;
	float:left;
	border-bottom:8px solid #189a59;
	-moz-box-shadow: 5px 5px 5px #424242;
	-webkit-box-shadow: 5px 5px 5px #424242;
	box-shadow: 5px 5px 5px #424242;
	
}

.productPicture{
	width:627px;
	margin:20px 0px 0px 15px;
	
	height:230px;
	background-color:white;
	
	border-bottom:8px solid #189a59;
	-moz-box-shadow: 5px 5px 5px #424242;
	-webkit-box-shadow: 5px 5px 5px #424242;
	box-shadow: 5px 5px 5px #424242;
	
}

.breakingDiv{
	clear:both;
}


.outerTopBoxProduct{
	width:620px;
	height:50px;
	margin:0 auto;
	color:white;
	color:white;
	font-size:14pt;
	line-height: 90px

}

.outerBoxProduct{
	width:645px;
	height:425px;
	margin:0 auto;
	padding-top:20px;
}

.productDetailSpacing{
	padding:20px;
}

#goBackCategeory{
	height:35px;
	border-bottom:1px solid #c4c6c6;
	font-weight:bold;
	line-height:35px;
	background: url(../images/smallArrowLeft.jpg);
	background-repeat:no-repeat;
	background-position:0px 11px;
	font-size:13px;
}

.infoProductNumber{
	display:none;
	height:35px;
	border-bottom:1px solid #c4c6c6;
	font-weight:bold;
	line-height:35px;
	color:black !important;
}

.infoPdf{
	height:45px;
	border-bottom:1px solid #c4c6c6;
	line-height:45px;
	color:gray;
	background-image:url(../images/pdf.jpg);
	background-repeat:no-repeat;
	background-position:right center;
}

.infoProduct{
	
	color:black !important;
	padding-bottom:20px;
}

.shortDescription{
	margin:10px 0px 10px 0px;
}

#wrapperDescription {
	height:150px;		/* Of course you need to specify the object height */
	
	position:relative;	/* On older OS versions "position" and "z-index" must be defined (absolute | relative), */
	z-index:1;			/* it seems that recent webkit is less picky and works anyway. */

	width:360px;
	padding-bottom:10px;
	overflow:hidden;
}

#scrollerDescription{
/*	-webkit-touch-callout:none;*/
	-webkit-tap-highlight-color:rgba(0,0,0,0);

	float:left;
	width:350px;
	padding-bottom:10px;

/*	-webkit-box-shadow:0 0 8px #555;	/* Don't use box shadows, they slow down drastically CSS animations */
}


.outerMainText{
	border-bottom:1px solid #c4c6c6;
	padding-bottom:10px;
}

#wrapperMovie {
	height:180px;		/* Of course you need to specify the object height */

	position:relative;	/* On older OS versions "position" and "z-index" must be defined, */
	z-index:1;			/* it seems that recent webkit is less picky and works anyway. */

	width:100%;

/*	background:#aaa url(wrapper-bg.png);*/
}

#scrollerMovie {
/*	-webkit-touch-callout:none;*/
/*	-webkit-tap-highlight-color:rgba(0,0,0,0);*/

	width:1200px;
	height:180px;
	float:left;
	padding:0;
	
/*	-webkit-box-shadow:0 0 8px #555;	/* Don't use shadows in production, they slow down drastically CSS animations */
}

.videoHtm{
	height:100%;
}


#wrapperGallery {

	height:150px;		/* Of course you need to specify the object height */
	
	position:relative;	/* On older OS versions "position" and "z-index" must be defined (absolute | relative), */
	z-index:1;			/* it seems that recent webkit is less picky and works anyway. */
	width:585px;
	padding-bottom:10px;
	overflow:hidden;
}

#scrollerGallery{

/*	-webkit-touch-callout:none;*/
	-webkit-tap-highlight-color:rgba(0,0,0,0);

	float:left;
	height:140px;
	
	padding-bottom:10px;

/*	-webkit-box-shadow:0 0 8px #555;	/* Don't use box shadows, they slow down drastically CSS animations */
}

#gallerySelect{
	margin-bottom:15px;
}

#bigImageContainer{
	width:768px;
	height:1024px;
	overflow:hidden;
	position:absolute;
	overflow:hidden;
	background-color:black;
	top:0px;
	left:0px;
	display:none;
	z-index:10;
}

.galleryImageInList{
	float:left;
	width:250px;
}

.imageHolderBox{

	width:250px;
	height:150px;
	margin-right:10px;
	float:left;
	overflow:hidden;
}

.bigImageSpacer{
	width:768px;
	height:900px;
	text-align:center;
	vertical-align: middle;
	overflow:hidden;
}




.optionItem{
	height:35px;
	border-bottom:1px solid #c4c6c6;
	background: url("../images/smallArrow.jpg") no-repeat;
	background-position: 150px center;
	color:gray;
	background-color:white !important;
	line-height:35px;
	color:black !important;
}

.optionItemTitel{
	height:35px;
	border-bottom:1px solid #c4c6c6;
	background: url("../images/smallArrow.jpg") no-repeat;
	background-position: 150px center;
	color:gray;
	background-color:white !important;
	line-height:35px;
	color:black !important;
	font-weight:bold;
}

#wrapperOptions {
	height:330px;		/* Of course you need to specify the object height */
	position:relative;	/* On older OS versions "position" and "z-index" must be defined (absolute | relative), */
	z-index:1;			/* it seems that recent webkit is less picky and works anyway. */
	width:170px;
	padding-bottom:10px;
	overflow:hidden;
}

#scrollerOptions{
/*	-webkit-touch-callout:none;*/
	-webkit-tap-highlight-color:rgba(0,0,0,0);

	float:left;
	width:160px;
	padding-bottom:10px;

/*	-webkit-box-shadow:0 0 8px #555;	/* Don't use box shadows, they slow down drastically CSS animations */
}
.outerTopBoxCategory{
	width:620px;
	height:0px;
	margin:0 auto;
	color:white;
	color:white;
	font-size:14pt;
	line-height: 90px
}

.titelVideo{
	margin-top:10px;
	margin-bottom:5px;
	color:gray;
	width:180px;
	font-size:14px;
	height:20px;
	float:left;
}

#imageSlider{
	position:absolute;
	left:0px;
	width:100%;
	height:100%;
	width:20000px;
}


.bigImageHolder{
	width:768px;
	height:1000px;
	overflow:hidden;
	text-align:left;
	margin-right:46px;
	float:left;
}


#wrapperRoom {
	height:155px;		/* Of course you need to specify the object height */
	position:relative;	/* On older OS versions "position" and "z-index" must be defined, */
	z-index:1;			/* it seems that recent webkit is less picky and works anyway. */

	width:100%;
/*	background:#aaa url(wrapper-bg.png);*/
}

#scrollerRoom {
/*	-webkit-touch-callout:none;*/
/*	-webkit-tap-highlight-color:rgba(0,0,0,0);*/
	border:1px solid yelow;
	width:2400px;
	height:155px;
	float:left;
	padding:0;
	
/*	-webkit-box-shadow:0 0 8px #555;	/* Don't use shadows in production, they slow down drastically CSS animations */
}


#roomOuterBox{
	display:none;
	position:absolute;
	z-index:101;
	background-color:white;
	left:200px;
	top:150px;
	height:185px;
	width:570px;
	border-bottom:8px solid #189a59;
}


.arrowRoom{
	position:absolute;
	left:-37px;
	margin-top:10px;
	
}

.arrowRoomRight{
	position:absolute;
	right:-37px;
	margin-top:10px;
	
}

.buildingTitle{
	font-size:11pt;
	color:#535154;
	height:15px;
	padding:11px;
	font-weight:bold;
}

.roomListItem{
	width:127px;
	height:145px;
	margin-right:11px;
	float:left;
}

.roomImageHolder{
	width:127px;
	height:122px;
}

.roomSubTitle{
	font-size:9pt;
	color:#535154;
}

.imgRoom{
	width:127px;
}


.languageOuterDiv{
	position:absolute;
	top:20px;
	right:11px;	
}

.languageDiv{
	width:45px;	
	float:right;
}

.changeLanguage{
	padding-top:3px;
}