/* override browser defaults */

html {overflow: hidden}

body {width: 100%}

body, h1, h2, h3, h4, h5, h6, p, form, td {margin: 0; padding: 0}

h1, h2, h3, h4, h5, h6 {font-size: 1em; font-weight: normal}

/*
h1 = meta page header / title
h2 = page header
h3 = paragraph header
h4 = non-paragraph header / box header
*/

/* Activate hasLayout (for IE) on all block elements... why not? ;-) */
body, div, p, h1, h2, h3, h4, form, input, img.block {zoom: 1;}
/* seems like this gives particular problems on IE6 with absolutely positioned elements without a fixed witdh */

ul {margin: 0; padding-left: 1.2em}

a {text-decoration: none}
a:hover {text-decoration: underline}

a, *[onclick] {cursor: pointer}

a img {border: none}

/* global structural classes */

img.png {_behavior: url(/png_behavior.htc)} /* PNG fix for IE6 */

img.block {display: block}

a.block {display: block; width: 100%; height: 100%}

.clear_float {clear: both; height: 0; line-height: 0}

.blind /* elements which shouldn't be in plain view, but shouldn't be considered hidden either, i.e. popupmenus, elements that should be able to receive focus, elements that should be read by screen readers */
{
	position: absolute;
	width: 1px; height: 1px;
	top: -9999px !important;
}

/* text mod classes */

.b {font-weight: bold}
.u {text-decoration: underline}
.i {font-style: italic}
.upc {text-transform: uppercase}
.loc {text-transform: lowercase}
.cap {text-transform: capitalize}
.tac {text-align: center}
.tar {text-align: right}
.tal {text-align: left}

/* tables and cells */

table
{
	border: none;
	border-collapse: collapse;
}

	/* template.general.css */

/* styles common for all templates on this site */

/* 2 layer fixation: 
- Body is frozen to the viewport. 100%x100%
- Front end layer scrolls within body
- Back end layer lies transparently on top
*/

html {overflow: hidden}

body
{
	width: 100%; height: 100%;
}

.layer
{
	position: absolute;
	top: 0px; left: 0px; 
	width: 100%; height: 100%; 
	overflow: auto;
}

#page_overlay
{
	display: none;
	z-index: 1;
}
/* ----------------- general --------------------*/


input.image
{
	border: none;
}

sup
{
	font-size: 0.6em;
}

.error
{
	color: #e00000;
	background: url(http://www.campitello-matese.it/images/icons/icon_error.gif) no-repeat 0px 2px;
	padding-left: 15px;
}

/* ===== LAYOUT ===== */

#languages li
{
	list-style: none;
	padding: 0 1em;
	float: right;
}

	/* ==== TEMPLATE CAMPITELLO ===== */

/* ===== LAYOUT ===== */

#holder
{
	width: 920px;
	margin: 0 auto;
	position: relative;
	z-index: 0;
}

#header
{
	width: 880px; height: 300px;
	padding: 20px 20px 0;
	position: relative;
	background: url(http://www.campitello-matese.it/images/shadow-top.png) no-repeat; 
	z-index: 1;
	_behavior: url(/_cached/996a731b3c821d538a932d6af9b77b12.htc);
}

#main-navigation
{
	position: absolute;
	top: 242px; right: 18px;
	width: 696px;
	z-index: 1;
}

#content
{
	width: 490px; min-height: 582px; _height: 582px;
	padding: 40px 210px 20px 220px;
	position: relative;
	z-index: 0;
	background: url(http://www.campitello-matese.it/images/shadow-repeat.png) repeat-y; 
	_behavior: url(/_cached/996a731b3c821d538a932d6af9b77b12.htc);
}

#sub-navigation
{
	position: absolute;
	top: 0px; left: 20px;
	width: 181px;
}

#quick-links
{
	position: absolute;
	top: 0px; right: 20px;
	width: 172px;
}

#footer
{
	width: 880px; height: 50px;
	padding: 0 20px 40px;
	background: url(http://www.campitello-matese.it/images/shadow-bottom.png) no-repeat;	
	_behavior: url(/_cached/996a731b3c821d538a932d6af9b77b12.htc);
}

#footer ul.contact-info
{
	list-style: none;
	padding: 20px 20px 0;
	text-align: center;
	line-height: 2;
	background: url(http://www.campitello-matese.it/images/index-separator.gif) repeat-x;
}

#footer ul.contact-info li
{
	display: inline;
	margin: 0 0.6em;
}

#footer p
{
	margin-top: 2em;
}

/* ===== ELEMENTS ===== */

h1#page-header
{
	position: absolute;
	top: 320px; left: 218px;
	width: 500px;
	z-index: 1;
}

#header object#home-flash
{
	position: absolute;
	top: 20px; left: 20px;
	width: 880px; height: 280px;
}

#main-navigation ul.level1
{
	list-style: none;
	padding-left: 0;
	height: 22px;
}

#main-navigation li.level1
{
	float: left;
	position: relative;
	width: 172px; height: 23px;
	margin: 0 2px 0 0; _margin-right: -2px; /* ie6 list forced whitespace bug */
	background: url(http://www.campitello-matese.it/images/nav-button.gif) no-repeat;
}

#main-navigation ul.level2
{
	list-style: none;
	padding-left: 0;
	position: absolute;
	top: 23px; left: 0;
	padding-top: 1px;
	display: none;
	overflow: hidden;
}

#main-navigation ul li.mouseover ul
{
	display:block;
}

#main-navigation li.level2
{
	width: 172px; height: 23px;
	margin: 0 0 1px 0;
	background: url(http://www.campitello-matese.it/images/nav-button.gif) repeat-y;
}

#main-navigation ul.level2 li.mouseover
{
	background-position: 0 -23px;
}

#main-navigation li a
{
	display: block;
	width: 164px; height: 15px; _height: 14px;
	padding: 5px 6px;
}

#sub-navigation ul
{
	padding-left: 0;
	list-style: none;
}

#sub-navigation li
{
	width: 181px; height: 22px;
	margin-bottom: 4px;
	opacity: 0.6; filter: alpha(opacity=60);
	background: url(http://www.campitello-matese.it/images/side-nav-button.gif) no-repeat;
}
#sub-navigation li.active, #sub-navigation li.mouseover
{
	opacity: 1; filter: alpha(opacity=100);
}

#sub-navigation li a
{
	display: block;
	padding: 2px 6px;
}

#quick-links .quick-link
{
	position: relative;
	width: 172px; height: 111px;
	margin-bottom: 1px;
}
#quick-links .quick-link.logo
{
	background: url(http://www.campitello-matese.it/images/logo_box.gif) no-repeat;
}

#quick-links .quick-link.meteo
{
	background: url(http://www.campitello-matese.it/images/info-box1.gif) no-repeat;
}
#quick-links .quick-link.piste
{
	background: url(http://www.campitello-matese.it/images/info-box2.gif) no-repeat;
}
#quick-links .quick-link.impianti
{
	background: url(http://www.campitello-matese.it/images/info-box3.gif) no-repeat;
}
#quick-links .quick-link.neve
{
	background: url(http://www.campitello-matese.it/images/info-box4.gif) no-repeat;
}
#quick-links .quick-link.webcam
{
	height: 35px;
	background: url(http://www.campitello-matese.it/images/webcam-button.gif) no-repeat;
}
#quick-links .quick-link.skirama
{
	height: 35px;
	background: url(http://www.campitello-matese.it/images/skirama-button.gif) no-repeat 0 0;
}
#quick-links .quick-link.mouseover
{
	background-position: 0 -35px;
}
#quick-links .quick-link.piste .open
{
	position: absolute;
	top: 51px; right: 7px;
}
#quick-links .quick-link.piste .closed
{
	position: absolute;
	top: 86px; right: 7px;
}

#quick-links .quick-link.impianti .open
{
	position: absolute;
	top: 51px; right: 7px;
}
#quick-links .quick-link.impianti .closed
{
	position: absolute;
	top: 86px; right: 7px;
}

#quick-links .quick-link.neve .min
{
	position: absolute;
	top: 27px; right: 7px;
}
#quick-links .quick-link.neve .max
{
	position: absolute;
	top: 47px; right: 7px;
}
#quick-links .quick-link.neve .quality
{
	position: absolute;
	top: 68px; right: 7px;
}
#quick-links .quick-link.neve .date
{
	position: absolute;
	top: 88px; right: 7px;
}

#quick-links .quick-link a
{
	display: block;
	width: 100%; height: 100%;
}

#content img.illustration
{
	display: block;
	width: 170px;
	height: 114px;
	margin-right: 1em;
	clear: left;
	float: left;
}

#content img.illustration1
{
	padding: 0.2em 0 1.2em;
}

#content p
{

}

/* ===== TEXT + COLORS ===== */

/*
	green: #8bad3f;
*/

body
{
	background-color: #ffffff;
	font-family: Arial, helvetica, sans-serif;
	font-size: 76%;
}

h1#page-header
{
	font-size: 2em;
	color: #8bad3f;
	font-weight: bold;
}

#content
{
	font-size: 1em;
	line-height: 1.4;
	color: #404040;
}

#content h2
{
	margin: 0.6em 0;
	font-size: 1.1em;
	text-transform: uppercase;
	font-weight: bold;
	color: #8bad3f;
}

#content h4
{
	color: #8bad3f;
	font-style: italic;
	text-decoration: underline;
	margin: 1em 0 0;
}
#content h5
{
	font-size: 1.1em;
	color: #8bad3f;
	font-weight: bold;
	margin: 1em 0;
}
#content p
{
	margin-bottom: 1em;
}

#main-navigation
{
	font-size: 0.8em;
}

#main-navigation li a
{
	color: #ffffff;
}
#main-navigation li.level1
{
	text-transform: uppercase;
}
#main-navigation li.level2
{
	text-transform: none;
}

#main-navigation li a:hover
{
	text-decoration: none;
}

#sub-navigation
{
	font-size: 1.1em;
}

#sub-navigation li a
{
	color: #b47900;
}
#sub-navigation li.active a, #sub-navigation li.mouseover a
{
	color: #ffffff;
}

#sub-navigation li a:hover
{
	text-decoration: none;
}

#quick-links .quick-link
{
	font-size: 1.1em;
	color: #ffffff;
	text-decoration: none;
}

#quick-links .quick-link a
{
	text-decoration: none;	
}

#footer
{
	font-size: 0.75em;
	text-align: center;
}

#footer p
{
	color: #a0a0a0;
}


div.separator
{
	border: none;
	background: url(http://www.campitello-matese.it/images/index-separator.gif) no-repeat;
	display: block;
	width: 490px; height: 10px;
	margin: 2em 0; padding: 0;
}

	/* ---- CSS declarations for the typic:alertbox DIV ---- */

div.alertbox
{
	position: absolute;
	top: 0px; left: 0px;
	width: 100%; height: 100%;
	text-align: center;
	/*background: url(../../images/transparent_grid_20x20.gif);*/
}

div.alertbox div#alertbox_background
{
	position: relative;
	width: 100%; height: 100%;
	background: #ffffff;
	opacity: 0.5;
	filter: alpha(opacity=50);
	z-index: 2;
}

div.alertbox div#alertbox_box
{
	position: absolute;
	z-index: 2;
	left: 40%;
	top: 40%;
	width: 20%;
	padding: 20px;
	border: 1px solid #dddddd;
	font-size: 9pt;
}

div.alertbox iframe {display: none}

div.alertbox div.wait
{
	background: #EDF5FE;
	color: #000000;
	font-weight: bold;
}

div.alertbox div.ok
{
	background: #EDF5FE;
	color: #000000;
	font-weight: bold;
}

div.alertbox div.error
{
	background: #ED4040;
	color: #000000;
	font-weight: bold;
}

div.alertbox div.confirm
{
	background: #EDF5FE;
	color: #000000;
	font-weight: bold;
}

div.alertbox div.buttons
{display: none}

div.confirm div.buttons
{
	display: block;
	text-align: center;
	margin-top: 15px;
}

div.buttons input
{
	font-size: 8pt;
	border: 1px solid #404040;
	font-weight: bold;
	color: #ffffff;
	background: #808080;
	padding: 3px;
	width: 50px;
}

div.alertbox div.window
{
	display: none;
}

div.alertbox iframe.window
{
	display: block;
	position: absolute;
	top: 0px; left: 0px;
	width: 100%; height: 100%;
	z-index: 2;
	border: none;
}

/* -------- TYPIC_CLUE -------- */

.typic_clue_list
{
	border: 1px solid #808080;
	background: #f0f0f0;
	color: #0000ff;
}

.typic_clue
{
	padding: 2px;
	width: 75px;
}

.typic_clue_focus
{
	background: #ffff00;
	padding: 2px;
	width: 75px;
}

/* --------- TYPIC_POPUP ---------- */

.typic_popup
{
	position: absolute;
	top: 0px; left: 0px;
	z-index: 2;
	border: 1px solid #808080;
	background: #c0c0c0;
	opacity: 0.8;
	filter: alpha(opacity=80);
	/* elements should also have the class 'blind' */
}

/* --- TYPIC PROTO --- */

.typic_proto
{
	display: none;
}

/* --- OPACITY CLASSES --- */

.opacity0 {opacity: 0; filter: alpha(opacity=0)}
.opacity10 {opacity: 0.1; filter: alpha(opacity=10)}
.opacity20 {opacity: 0.2; filter: alpha(opacity=20)}
.opacity30 {opacity: 0.3; filter: alpha(opacity=30)}
.opacity40 {opacity: 0.4; filter: alpha(opacity=40)}
.opacity50 {opacity: 0.5; filter: alpha(opacity=50)}
.opacity60 {opacity: 0.6; filter: alpha(opacity=60)}
.opacity70 {opacity: 0.7; filter: alpha(opacity=70)}
.opacity80 {opacity: 0.8; filter: alpha(opacity=80)}
.opacity90 {opacity: 0.9; filter: alpha(opacity=90)}
.opacity100 {opacity: 1; filter: alpha(opacity=100)}

h1#page-header
	{
		display: none;
	}
	
	#sub-navigation
	{
		display: none;
	}
	
	#content
	{
		width: 690px;
		padding: 0 200px 0 30px;
	}
	
	#content a
	{
		position: relative;
	}
	
	img#skirama-img
	{
		display: block;
		width: 640px; height: 480px;
		margin: 0 auto;
	}
	
	object#skirama-flash
	{

	}