body {
	font: 100% Helvetica, sans-serif, Verdana, Arial;
	font-family: Helvetica, sans-serif, Verdana, Arial;
	background: #FFF;
	margin: 0;
	padding: 0;
	text-align: left;
	color: #000000;
}

p{
	font-size: 11px;
	color: #666;
	line-height: 1.3;
	margin: 0;
}

h1 {
	font-size:13px;
	color:#666;
}

a, a:visited, a:active {
	color:#666;
}

a:hover {
	text-decoration: none;
}

form
{
	margin:0;
	padding:0;
}

#carou #textBoxText, #carouBG, .png, #showBox, #footer #footerLL, .carousel-component .carousel-horizontal li, .thumb_new {
	behavior: url("http://www.touchtown.ch/css/iepngfix.htc");
}

/* PANORAMA */

#panorama {
	padding: 0;
	background: #FFF;
	height: 320px;
}

/* SEARCHBAR */

#searchBar {
	height: 10px;
	margin: 0;
	background: #F1F1F1;
	background-image: url(../img/web/vl04.gif);
	/*border: 1px solid;*/
	cursor: move;
}

#inputTxt{
	font-size: 12px;
	width: 196px;
	color: #AAAAAA;
}

#inputTest{
	background-color: blue;
	margin: 0;
	padding: 0;
}

#searchBarBox01 {
	position: relative;
	margin-top: 4px;
	margin-left: 20px;
	float: left;
	height: 14px;
	width: 200px;
}
#searchBarBox02 {
	margin-left: 20px;
	float:left;
	top: 29px;
	left: 25px;
}

#searchBarBox01 h1 {
	font-size: 13px;
	color: #666;
	line-height: 10px;
	/*border: 1px solid;*/
}

#searchBarBox02 a {
	font-size: 10px;
	color: #666;
	line-height: 22px;
}

#searchBarBox02 a:hover {
	text-decoration: none;
}

#dragHere {
	width: 8px;
	height: 8px;
	background-image: url(../img/web/handle02.gif);
	cursor: move;
	left: 50%;
	position:relative;
	top:1px;
	font-size:0px;
}



/* CAROU */
#carou {
	left:0px;
	margin: 0px;
	padding: 0px;
	position: absolute;
	background-image: url(../img/web/carou_bg.jpg);
	background-color: #FFFFFF;
	height:70px;
	width:100%;
}

/* TEXTBOX */

#carouBG {
	position: absolute;
	padding:10px;
	left: 685px;
	width:50px;
	height:57px;
	background-image:url(../img/web/carou_bg_vl.png);
	z-index:8;
}

#carou #textBoxText {
	position: absolute;
	padding:10px;
	padding-left:40px;
	padding-right:75px;
	right: 20px;
	width:288px;
	height:57px;
	font-size: 16px;
	background-image:url(../img/web/carou_bg_vl.png);
	z-index:9;
	text-align: right;
}

#carou #textBoxText h1{
	font-size:15px;
}

#carou #textBoxButton {
	position:absolute;
	right:14px;
	top:0px;
	width:76px;
	height:78px;
	z-index: 10;
}

#carou #textBoxText a{
	text-decoration:none;
	color:#444;
}
#carou #textBoxText a:hover .myLink{
	text-decoration:underline;
}


/* MAIN */

#left {
	padding:10px;
	border: 1px solid #DDD;
	width: 180px;
	display:inline;
	margin-left: 20px;
	position:relative;
	top: 78px;
	margin-bottom: 20px;
	float: left;
}

#logoArea {
text-align:center;
	position:absolute;
	margin-top: 210px;
	left: 20px;
width:180px;
} 

#left #marker_all, #marker_01, #marker_02, #marker_03, #marker_04, #marker_05, #marker_06{
width:5px;
height:5px;
background-position:-5px;
background-repeat:no-repeat;
top:4px;
position:relative;
float:left;
font-size:0px;
}

#left #marker_01{
background-image:url(../img/gm/marker_01a.png);
}

#left #marker_02{
background-image:url(../img/gm/marker_02a.png);
}

#left #marker_03{
background-image:url(../img/gm/marker_03a.png);
}

#left #marker_04{
background-image:url(../img/gm/marker_04a.png);
}

#left #marker_05{
background-image:url(../img/gm/marker_05a.png);
}

#left #marker_06 {
background-image:url(../img/gm/marker_06a.png);	
}

#left p a{
padding-left:6px;
color:#666;
}

#middle {
 	border: 1px solid #f2ad9c;
	width: 300px;
 	height: 244px;
	margin-left: 20px;
	position: relative;
	top: 78px;
	margin-bottom: 20px;
	float:left;
	line-height: 0.01em;
}

#myArrow-top {
	position:relative;
	left:0px;
	top:0px;
	cursor: pointer;
	padding: 0;
	margin: 0;
	width: 300px;
	height:14px;
	background:#ddd;
	background-image: url(../img/web/arrow_up_off.jpg);
	z-index: 1004;
	font-size:0px;
}

#myArrow-top:hover {
	background-image: url(../img/web/arrow_up_on.jpg);
}

#myArrow-bottom {
	position:relative;
	left:0px;
	cursor: pointer;
	float:left;
	width: 300px;
	height:14px;
	background:#ddd;
	background-image: url(../img/web/arrow_down_off.jpg);
	z-index: 1005;
	font-size:0px;
}

#myArrow-bottom:hover {
	background-image: url(../img/web/arrow_down_on.jpg);
}

#showBox {
	position: absolute;
	background-image:url(http://www.touchtown.ch/img/web/sidebar_vl.png);
	background-repeat: repeat;
	display: none;
	margin-top: 14px;
	width: 300px;
	height: 216px;
	z-index:50;
}

#XXXshowBox {
	position: absolute;
	margin-top: 12px;
	width: 300px;
	height: 52px;
}

#middle p{
	margin: 10px;
}

#middle a{
	color: black;
}

#middle h1{
	margin:10px;
	font-size: 18px;
}

#gmInfo {
	font-size:10px;
}

#gmInfo a:hover {
	text-decoration: none;
}

#gmInfo_title {
	font-weight: bold;
}
#right {
	border: 1px solid #DDD;
	height: 244px;
	margin-top: 78px;
	margin-bottom: 20px;
	margin-left: 564px;
	margin-right: 20px;
	min-width: 300px;
}


/* FOOTER */

#footer {
	width: 100%;
	height:34px;
	background:#EEEEEE;
	clear: left;
	text-align: left;
}

#footer #footerLL{
	position:absolute;
height:42px;
width:125px;
	left:0px;
	margin-top:-13px;
	margin-left:20px;
	float:left;
	background-image:url(../img/web/tt_logo_s01.png);
}

#footer #footerL{
	position:absolute;
	left:140px;
	margin-top:12px;
	margin-left:20px;
	float:left;
}


#footer #footerR{
	padding:0px;
	margin-top:12px;
	position:absolute;
	right:20px;
	}

#footer p, #footer a {
	color:#AAA;
}

#footer a:hover {
	color: #555555;
}

/* LIGHTBOX */

#ImpLogo{
	height:80px;
	margin:20px;
	background-image: url(../img/web/tt_logo_l.jpg);
	background-repeat:no-repeat;
	background-position: center;
}

#ImpText{
	margin-left:20px;
	margin-right:20px;
	margin-bottom:16px;
	text-align:center;
}

#ImpBox{
	margin-left:32px;
	margin-bottom:26px;
	width: 200px;
	height:94px;
	float:left;
}

#ImpClose{
position:relative;
top:-30px;
left:488px;
width:22px;
height:22px;
	margin-right:10px;
	margin-bottom:10px;
float:left;
}

#ImpIE{
clear:left;
left:64px;
margin-left:64px;
}


#ImpBox p{
	margin-top:4px;
}

#ImpForm {
padding-left:20px;
}

label {
font-size:11px;
color:#666;
}

textarea {
font-family: Helvetica, sans-serif, Verdana, Arial;
font-size:11px;
height:80px;
width:390px;
}

input.x-small {
width:56px;
font-size:11px;
}
input.small {
width:80px;
font-size:11px;
}
input.medium {
width:100px;
font-size:11px;
}
input.large {
width:124px;
font-size:11px;
}
input.x-large {
width:180px;
font-size:11px;
}
input.button {
font-family: Helvetica, sans-serif, Verdana, Arial;
font-size:12px;
height:22px;
width:60px;
}


/* CODA */

* { margin: 0; padding: 0 }
		/* I've used a hard CSS reset above, but you should consider a more sophisticated reset, such as this one: http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ */

		.wrapper p a, .wrapper li a {
		margin: 0;
		padding-left: 14px;
		padding-top:2px;
		padding-bottom:2px;
		background-position: 190px;
		background-repeat: no-repeat;
		color: #39c;
		text-decoration: none;
		display:block;
		background-image: url(../img/web/arrow.gif)}

		.wrapper p a:hover {
		text-decoration: none;
		background-color: #f1f1f1;
		display: block;
		}
		
		p.intro { border-bottom: 1px solid #ccc; margin-bottom: 20px; padding: 20px 0 30px 0; text-align: center; width: 100% }
		
		p#cross-links { text-align: center }
		
		p#cross-links { border-bottom: 1px solid #ccc; margin-bottom: 30px; padding-bottom: 30px }
		
		noscript p, noscript ol { color: #a00; font-size: 13px; line-height: 1.4em; text-align: left }
		noscript a { color: #a00; text-decoration: underline }
		noscript ol { margin-left: 25px; }
		
		.wrapper a:focus { outline:none }
		
		img { border: 0 }
		
		.stripViewer .panelContainer .panel ul {
			text-align: left;
			margin: 0 15px 0 30px;
		}
		
		.slider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
			margin: 0;
			position: relative;
			width: 100%;
		}

		/* These 2 lines specify style applied while slider is loading */
		.csw {width: 100%; height: 460px; background: #fff; overflow: scroll}
		.csw .loading {margin: 0; text-align: center}

		.stripViewer { /* This is the viewing window */
			position: relative;
			overflow: hidden; 
			/* border: 5px solid #000; /* this is the border. should have the same value for the links */ */
			margin: auto;
			width: 200px; /* Also specified in  .stripViewer .panelContainer .panel  below */
			/* height: 460px; */
			clear: both;
			background: #fff;
		}
		
		.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
			position: relative;
			width: 100%;
			padding: 0;
			margin: 0;
			list-style-type: none;
			/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
		}
		
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
			float:left;
			height: 100%;
			position: relative;
			width: 200px; /* Also specified in  .stripViewer  above */
		}
		
		.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
			padding-left: 0;
		}
		
		.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
			margin: 0;
			display: none;
		}