﻿/* Base css file for Zermatt Apartment Rentals */

body {
	font: 9pt/1.2em verdana, arial, sans-serif;
	text-align: center;
	background: url(/images/blueblend-background.jpg) repeat-x;
				/* color: rgb(153,132,91); text copper */
	color: rgb(192,192,192);			/* text copper */
}

* {
	margin: 0;
	padding: 0;
}
p {
	margin: 0 0 10px 0;
	line-height: 1.2em;
	text-align: justify;
}
h1 {
	margin-top: 15px;
	margin-bottom: 10px;
	font: bold 1.8em/1em verdana, arial, sans-serif;
	color: rgb(133,112,71);
	overflow: visible;
}
.sus_h1 {
	margin-top: 15px;
	margin-bottom: 10px;
	font: bold 1.8em/1em verdana, arial, sans-serif;
	color: rgb(133,112,71);
	overflow: visible;
}
h2 {
	margin-bottom: 10px;
	font: bold 1.3em/1em verdana, arial, sans-serif;
	color: rgb(192,192,192);
	overflow: visible;
}
h3 {
	margin-bottom: 10px;
	font: bold 1.3em/0.8em verdana, arial, sans-serif;
	color: rgb(192,192,192);
	overflow: visible;
}
h4 {
	margin-bottom: 5px;
	font: bold 9pt/1em verdana, arial, sans-serif;
	color: rgb(192,192,192);
	overflow: visible;
}

a {
	color: rgb(192,192,192);
}
a:hover {
	color: rgb(203,182,141);
}
a:visited {
	color: rgb(233,202,171);
}
img {
	border: none;
}
.invisibleText {
	display: none;
}
.vSpacer1 {
	margin: 0 auto 0 auto;
	clear: both;
	width: 100px;
	height: 1px;
}
.vSpacer5 {
	margin: 0 auto 0 auto;
	clear: both;
	width: 100px;
	height: 5px;
}
.vSpacer10 {
	margin: 0 auto 0 auto;
	clear: both;
	width: 100px;
	height: 10px;
}
.vSpacer20 {
	margin: 0 auto 0 auto;
	clear: both;
	width: 100px;
	height: 20px;
}
.vSpacer30 {
	margin: 0 auto 0 auto;
	clear: both;
	width: 100px;
	height: 30px;
}

.center {
	text-align: center;
}


/* Seasons and Dates table */
table.seasonDate {
	margin: 10px auto 10px auto;
	background-color: rgb(10%, 10%, 10%);
	border-width: 0;
	border-collapse: collapse;
	border: 1px rgb(153,132,91) solid;
	width: 400px;
	font-size: 12px;
	text-align: center;
}
table.seasonDate th {
	margin: 0;
	height: 1.5em;
	line-height: 1.5em;
	background-color: black;
	border-bottom: 1px rgb(153,132,91) solid;
	background: url(/new/images/tableheader.gif) repeat-x;
}
table.seasonDate td {
	line-height: 1.5em;
	padding: 2px 0 2px 0;
	border: none;
	width: 50%;
}
table.seasonDate .alt {
	font-weight: bold;
	background-color: rgb(5%, 5%, 5%);
	color: white;
}


table.seasonPrices {
	margin: 10px auto 10px auto;
	background-color: rgb(10%, 10%, 10%);
	border-width: 0;
	line-height: 1.5em;
	border-collapse: collapse;
	border: 1px rgb(153,132,91) solid;
	width: 720px;
	font-size: 12px;
	text-align: center;
}
table.seasonPrices th {
	margin: 0;
	height: 1.5em;
	line-height: 1.5em;
	background-color: black;
	border-bottom: 1px rgb(153,132,91) solid;
	background: url(/new/images/tableheader.gif) repeat-x;
	color: white;
}
table.seasonPrices .desc {
	width: 150px;
}
table.seasonPrices .hdRow {
	font-weight: bold;
	background-color: black;
	font-style: italic;
}
table.seasonPrices .altRow {
	color: white;
}













/* Price and Dates table */
table.priceDate {
	margin: 10px auto 10px auto;
	background-color: rgb(10%, 10%, 10%);
	border-width: 0;
	border-collapse: collapse;
	border: 1px rgb(153,132,91) solid;
	width: 700px;
}
table.priceDate th {
	margin: 0;
	height: 1.5em;
	line-height: 1.5em;
	background-color: black;
	border-bottom: 1px rgb(153,132,91) solid;
	background: url(/new/images/tableheader.gif) repeat-x;
}
table.priceDate td {
	line-height: 1.5em;
	padding: 2px 0 2px 0;
	border: none;
	width: 25%;
	font-size: 1em;
}
table.priceDate td.alt {
	line-height: 1.5em;
	padding: 2px 0 2px 0;
	border: none;
	background-color: rgb(5%, 5%, 5%);
}
table.priceDate .premium {
	color: rgb(153,132,91);
	font-weight: bold;
}

.downloadLink {
	text-align: center;
	font: italic 8pt/1.2em verdana, arial, sans-serif;
}
.downloadLink a {
	color: rgb(153,132,91);
}
.downloadLink a:hover {
	color: white;
}
.downloadLink a:visited {
	color: rgb(203,182,141);
}

.requestButton {
	display: inline;
	text-align: center;
	font-weight: bold;
	padding: 0 15px 3px 15px;
	border: 1px rgb(153,132,91) solid;
	width: auto;
	margin: 3px auto 9px auto;
	background: url(/new/images/tableheader.gif) repeat-x;
}
.requestButton a {
	text-decoration: none;
	color: rgb(192,192,192);
	height: 100%;
	width: 100%;
}
.requestButton a:hover {
	text-decoration: none;
	color: white;
}

/* Header, Logo and Main Menus */
#headerBox {
	position: relative;
	margin: 15px auto 0 auto;
	width: 1000px;
	height: 148px;
	background: url(/new/images/header.gif) no-repeat;
}
#headerBox #logo {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 200px;
	height: 107px;
	background: url(/new/images/logo.gif) no-repeat;
}
#headerBox #menuBox {
	margin: 0 auto 0 auto;
	position: relative;
	top: 96px;
	left: 0;
	width: 580px;
	height: 51px;
}
#menuBox a, #menuBox b {
	float: left;
	display: inline;
	margin: 0 25px 0 0;
	height: 51px;
	text-decoration: none;
}
#menuBox #home {
	width: 58px;
	margin-left: 30px;
	background: url(/new/images/menu-home.gif) top left no-repeat;
}
#menuBox #home:hover {
	width: 58px;
	margin-left: 30px;
	background: url(/new/images/menu-home.gif) bottom left no-repeat;
}
#menuBox #homeSel {
	width: 58px;
	margin-left: 30px;
	background: url(/new/images/menu-home.gif) center left no-repeat;
}
#menuBox #aparts { 
	width: 115px;
	background: url(/new/images/menu-apartments.gif) top left no-repeat;
}
#menuBox #aparts:hover {
	width: 115px;
	background: url(/new/images/menu-apartments.gif) bottom left no-repeat;
}
#menuBox #apartsSel {
	width: 115px;
	background: url(/new/images/menu-apartments.gif) center left no-repeat;
}
#menuBox #zermatt {
	width: 82px;
	background: url(/new/images/menu-zermatt.gif) top left no-repeat;
}
#menuBox #zermatt:hover {
	width: 82px;
	background: url(/new/images/menu-zermatt.gif) bottom left no-repeat;
}
#menuBox #zermattSel {
	width: 82px;
	background: url(/new/images/menu-zermatt.gif) center left no-repeat;
}
#menuBox #services {
	width: 87px;
	background: url(/new/images/menu-services.gif) top left no-repeat;
}
#menuBox #services:hover {
	width: 87px;
	background: url(/new/images/menu-services.gif) bottom left no-repeat;
}
#menuBox #servicesSel {
	width: 87px;
	background: url(/new/images/menu-services.gif) center left no-repeat;
}
#menuBox #contact {
	width: 78px;
	margin: 0;
	background: url(/new/images/menu-contact.gif) top left no-repeat;
}
#menuBox #contact:hover {
	width: 78px;
	background: url(/new/images/menu-contact.gif) bottom left no-repeat;
}

#menuBox #contactSel {
	width: 78px;
	background: url(/new/images/menu-contact.gif) center left no-repeat;
}






/* Main Contents */
.breadcrumbs {
	margin: 0 auto 0 auto;
	clear: both;
	height: 30px;
	color: rgb(83,52,11);
	line-height: 2.3em;
	font-size: 8pt;
}
.breadcrumbs a {
	color: rgb(229,194,122);
	text-decoration: none;
}
.breadcrumbs a:hover {
	text-decoration: underline;
}
#goldBox {
	margin: 0 auto 15px auto;
	width: 1000px;
	min-height: 300px;
	background-color: rgb(133,112,71);
	text-align: center;
}
#contentsBox {
	margin: 0 auto 30px auto;
	width: 750px;
	min-height: 240px;
	background-color: black;
}
#contentsBox h1, #contentsBox h2, #contentsBox h3, #contentsBox p {
	margin-left: auto;
	margin-right: auto;
	width: 500px;
	overflow: visible;
	line-height: normal;
}
.picturesContainer {
	margin: 20px auto 20px auto;
	width: 650px;
	text-align: center;
}
.pictureBox {
	float: left;
	display: inline;
	border: 1px rgb(192,192,192) solid;
	background-color: black;
	height: 161px;
	width: 124px;
	text-align: center;
}
.pictureBoxH {
	float: left;
	display: inline;
	border: 1px rgb(192,192,192) solid;
	background-color: black;
	height: 124px;
	width: 161px;
	text-align: center;
}
.apartPictureH {
	margin: 0 auto 0 auto;
	border: 1px rgb(192,192,192) solid;
	background-color: black;
	height: 124px;
	width: 161px;
	text-align: center;
}
.pictureBox img, .pictureBoxH img, .apartPictureH img {
	margin: 6px auto 0 auto;
}
.pictureBox a, .pictureBoxH a, .apartPictureH a {
	display: block;
	width: 100%;
	height: 100%;
	text-decoration: none;
}
.picturesContainer .hSpacer {
	float: left;
	display: inline;
	height: 100px;
	width: 30px;
}
.largeimagelayer {
	background-color: #000000;
	padding: 10px;
	border: thin solid #FFFFFF;
	position: absolute;
	visibility: hidden;
	left: 150px;
	top: 450px;
}




#matthornWebCam, #matthornWebCamClose, #aroleidWebCam {
	float: left;
	display: inline;
	border: 1px rgb(192,192,192) solid;
	background-color: black;
	height: 124px;
	width: 161px;
	text-align: center;
}
#matthornWebCam a {
	display: block;
	width: 149px;
	height: 112px;
	margin: 6px auto 0 auto;
	background: url(http://www.zermatt.ch/html/bergbahnen/webcams/schwarzsee.jpg) -50px -15px no-repeat;
}
#matthornWebCamClose a {
	display: block;
	width: 149px;
	height: 112px;
	margin: 6px auto 0 auto;
	background: url(http://www.zermatt.ch/html/bergbahnen/webcams/zermatt.jpg) -50px -50px no-repeat;
}
#rothornWebCam a {
	display: block;
	width: 149px;
	height: 112px;
	margin: 6px auto 0 auto;
	background: url(http://bergbahnen.zermatt.ch/e/live_fotos/rothorn.jpeg) -20px -50px no-repeat;
}
#aroleidWebCam a {
	display: block;
	width: 149px;
	height: 112px;
	margin: 6px auto 0 auto;
	background: url(http://www.zermatt.ch/html/bergbahnen/webcams/aroleid.jpg) -65px -90px no-repeat;
}






.aptBox {
	float: left;
	display: inline;
	width: 200px;
	text-align: center;
}
.aptBox p {
	clear: both;
	margin: 3px 0 1px 0;
	text-align: center;
	font-size: 8pt;
	border: 1px green solid;
}
.aptBox a {
	text-align: center;
	display: block;
	font-size: 8pt;
	text-decoration: none;
	color: rgb(153,132,91);
}
.aptBox a:hover {
	text-decoration: underline;
	color: white;
}
.aptBoxVBreak {
	margin: 0 auto 0 auto;
	clear: both;
	width: 98%;
	height: 8px;
}
.stars {
	display: inline;
	font-family: mono;
}


.goldHRule {
	clear: both;
	margin: 20px auto 15px auto;
	width: 122px;
	height: 25px;
	background: url(/new/images/sep.gif) center left no-repeat;
}


.btnApartments { 
	margin: 0 auto 5px auto;
	width: 115px;
	height: 51px;
	background: url(/new/images/menu-apartments.gif) top left no-repeat;
}
.btnApartments a { 
	display: block;
	width: 100%;
	height: 100%;
	background: url(/new/images/menu-apartments.gif) bottom left no-repeat;
}
.btnApartments a:hover {
	background: url(/new/images/menu-apartments.gif) center left no-repeat;
}




.picLabel {
	margin: 6px 0 0 0;
	display: block;
	width: 100%;
}




.iconBox {
	margin: 0 20px 0 0;
	float: left;
	display: inline;
	border: 1px rgb(192,192,192) solid;
	background-color: black;
	width: 161px;
	padding: 5px 0 5px 0;
	text-align: center;
}
.iconContainer {
	margin: 0 auto 0 auto;
	background-color: white;
	width: 149px;
	text-align: center;
}
.iconContainer a {
	display: block;
	height: 100%;
	width: 100%;
}
.icon {
	margin: 5px;
}


.linksBox {
	margin: 0 0 0 80px;
	float: left;
	display: inline;
	padding: 10px;
	width: 600px;
	text-align: left;
	line-height: 1.2em;
}
.linksBox a {
	font-weight: bold;
	font-size: 12pt;
	line-height: 1.2em;
	text-decoration: none;
}
.linksBox a:hover {
	text-decoration: underline;
}






/* Footer */
#footerbox {
	font: bold 11px/14px verdana, arial, sans-serif;
	color: rgb(163,142,101);
	cursor: default;
}
#footerbox a {
	color: rgb(133,112,71);
	text-decoration: none;
}
#footerbox a:hover {
	color: rgb(103,82,41);
	text-decoration: underline;
}
#copyright {
	font: 10px/1.5em verdana, arial, sans-serif;
	color: rgb(70%,70%,70%);
	cursor: default;
}
#copyright a {
	color: rgb(50%,50%,50%);
	text-decoration: none;
}
#copyright a:hover {
	color: rgb(20%,20%,20%);
	text-decoration: underline;
}





