/* mediterraloc */
/* Body */
body{
	background : #d9dadb;
}

a img{
	border: 0px; /*remove border of allimages when they are as a link */
}

.link{
background-color: #8080FF;
}

.link a{
text-decoration: none;
color: #80FFFF;
}

.link a:hover{
text-decoration: underline;
}

/* page container */
div.page{
	width: 100%;
}

/* container of the page */
div.content{
	width: 850px;
	margin: auto;
	border: 1px solid #000000;
}

/* header*/
div.header{
	background-color: #7099d7;
	width: 100%;
	text-align: left;
	border-bottom: 1px solid #000000;
}

/* top horizontal menu + lang menu*/
.menu_top_container{
	
	overflow: auto; /* includes elements with float attribute, this will make the dimensions of the block normal */
	border-bottom: 1px solid #000000;
	background:#267cb2;
	width:100%;
}

/*top menu*/
.menu_top{
	float:left;
	width: 650px;
}

/*lang menu*/
.menu_flags
{
	float:left;
	width: 150px;
}


.menu_top_container ul {
	padding:0px;
	margin:0px;
	list-style-type:none;
	/*height:28px;*/
}


.menu_top_container ul li {
	
	float:left;
	height:28px;
	line-height:28px;
	
			
}

.menu_flags ul li {
	
	margin-right: 5px;
	vertical-align: middle;
	
}

.menu_flags ul li a{
	
margin-top: auto;
margin-bottom: auto;
border: 0px solid;
	
}


.menu_top a, .menu_top a:visited {
	
		display:block;
		float:left;
		height:100%;
		font-size:11px;
		text-decoration:none;
		color:#ffffff;
		background:#267cb2;
		padding:0 21px 0 17px;
		
}
		

.menu_top ul a:hover {
	
	background:#3da1e0;
	text-decoration: none;
}


/* part under the top menu */
.center{
	width: 100%;
	min-height: 600px;
	overflow: auto; /* contains left menu and content of the page with float attribute, this will avoid size problem */
}

/*contains the content of the page */
.right_textbox{

	width:600px;
	margin:10px;
	margin-left: auto;
	margin-right: auto;
}

/* left menu container*/
.menu_left{

	float: left;
	width: 220px;
	height: 100%;
	padding-top: 10px;
	
}


/* left menu element */
.left_box{

	width:200px;
	height:auto;
	border: 1px solid #000000;
	background-color: #7099d7;
	margin: 10px;
}

/* left menu element title */
.left_box_title{
	
	
	width:100%;
	height: 20px;
	padding: 0px;
	background:#267cb2;
	border-bottom: 1px solid #000000;
}

.left_box_title span{
	padding-left: 5px;
	color: #ffffff;
	font-weight:bold;
}

/* left menu element content*/
.left_box_center{

	width:100%;
	height: auto;
	padding: 0px;

}

/* list container for the left menu element */
.left_box_center ul{
	list-style-type: none;
	margin-top: 5px;
	margin-bottom: 5px;
	margin-left: 0px;
	margin-right: 0px;
	padding:0px;
}


.left_box_center ul li{

	margin: 0px;
	padding: 0px;
	height: 20px;
	text-align: left;
	
}


/* make the menu look nice */
.left_box_center ul li a span, .left_box_center ul li a{

	padding-left: 2px;
	display: block;
	text-align: left;
	text-decoration: none;
	color: #000000;
	font-size:14px;
	height:100%;
	cursor: pointer;

}

.left_box_center ul li a{
	padding: 0px;
}

/* chagne the color of the menu item when hover it */
.left_box_center a:hover{

	background:#3da1e0;
	
}

/* contains the principal information */
.center_right{
	
	float: left;
	width: 620px;
	height: auto !important;
	height: 600px; /* IE<=6 does not understand min-height but considers height as a min-height */
	min-height: 600px; /* Other browerses will understand min-height, we tell them it's more important than height (otherwise the height will be fixed and will not adapt to the content) */
	padding-top: 20px;
	
	/*overflow: auto;*/
}


/* box containing information */
.right_box{
	
	min-height: 200px;
	width:550px;
	border: 1px solid #000000;
	background-color: #7099d7;
	margin-left: auto; margin-right: auto;  /* centers the box */

}


/* title of the box */
.right_box_title{
	
	padding-left: 5px;
	background:#267cb2;
	border-bottom: 1px solid #000000;
	text-align:left;
}

/* content the box */
.right_box_center{
	width:100%;
}

/* this will contain elements with float atributes */
/* the overflow attribute will allow to resize the element properly and put other DIV boxes under */
.horizontal_container{
	overflow: auto; 
	width: 100%;
	min-height:150px;
}

/* a list container with minimum height*/
.list_horizontal_container{

	min-height: 100px;
	width: 100%;

}

.promo_container{

	margin: 10px;
	margin-left: auto;
	margin-right: auto;
	width: 550px;

}

.promo_line{

	overflow: auto;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 10px;

}

.promo_element {
	background-color:#92AAFF;
	border:1px solid #000000;
	float:left;
	margin-left:10px;
	padding:5px;
	text-align:center;
	width:225px;
}

.promo_element_over
{
	cursor: pointer;
	background-color: #7099d7;
	
}

span.promo_price{

	font-size: 18px;
	color: #ff0000;
	font-weight: bold;

}


.promo_title{

    text-align: center;
    margin-bottom: 20px;
 }


.promo_title span{

    font-size: 22px;
    text-decoration: underline;
}


.team_container{
	width:500px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px,
}

.team_element{
	font-size: 16px;
	padding: 10px;
	width: 250px;
	margin-bottom: 10px;
	border-bottom: 1px solid #000000;
}

.team_element span.name{

	font-weight: bold;
}

/* small picture container, for listing */
.small_picture{

	float:left;
	margin: 5px;
	min-width: 50px;
	max-width: 75px;
	height:75px;

}

/* small picture container, for details page */
.picture_announce{
	
	float:left;
	padding: 5px;
	min-width: 100px;
	max-width: 200px;
	min-height: 100px;
	max-height: 200px;
	border-right: 1px solid;
	border-bottom: 1px solid;
	
}

/* container for details information */
.details_announce{
	
	float: left;
	min-height:100px;
	margin-left: 5px;
	padding: 5px;

	
}

/* a detail element */
.details_container .details, .details_announce .details{
	height: 20px;
	margin-bottom:1px;
	width: 100%;
}

/* a detail title */
.details_announce .title{
	
	float: left;
	background: #267cb2;
	width: 170px;
	padding-left: 5px;
	height: 20px;
	
}

/* a detail value */
.details_announce .value,.details .value{
	
	float: left;
	width: 180px;
	min-width: 180px;
	background : #d9dadb;
	padding-left: 5px;
	margin-left: 1px;
	height: 20px;

	
}

/* description container */
.description_announce{
	
	/*width:540px;*/
	margin: 5px;
	text-align: justify;
	height: auto;
	
}

.description_announce .title2, .mini_pictures .title2{
	
	margin-left: 0px;
	margin-right: 0px;
	background: #267cb2;
	padding-left: 5px;
	
}

/* mini pictures conaner */
.mini_pictures{
	/*width:540px;*/
	margin: 5px;
	padding: 5px;
}

.mini_pictures img{

	margin-top:5px;
	margin-left:2px;
}


.big_picture{
	margin: 5px;
	padding: 5px;
	border: 1px solid;
	margin-left: auto;
	margin-right: auto;
}

.big_picture img{
	margin-left: auto;
	margin-right: auto;
}



/* sort elements */
.sort_list_title{

	width: 550px;
	margin: 10px;
	margin-left:auto;
	margin-right:auto;

}

.sort_list_title ul {
	
	padding:0px;
	margin:0px;
	list-style-type:none;
	height:28px;

}

.sort_list_title ul li
{
	
	padding-left: 5px;
	padding-right: 5px;
	float: left;
	margin-right:1px;
	background:#267cb2;
	color: #ffffff;
	min-width: 60px;
	text-decoration: none;
}


.sort_list_title ul li a{

	
	
	min-width:50px;
	display: block;
	color: #ffffff;
	text-decoration: none;
}

.list_title ul li a:hover{
	color: #32eeff;
	background:#3da1e0;
	text-decoration: none;
}


.list_container{

	margin: 10px;
	margin-left: auto;
	margin-right: auto;
	width: 550px;
	
	
}

div.list_element{

	padding-bottom: 5px;
	width:100%;
	overflow: auto;
	border-bottom: 1px solid #000000;
	color: #000000;
	text-decoration: none;
	
}

.list_element_over{
	/* because hover does not work with IE, use javascript */
	background-color: #7099d7;
	cursor: pointer;
}

.list_element:hover{
	/*does not work with IE */
	background-color: #7099d7;
	cursor: pointer;
}

.small_image_container{

	float: left;
	margin-left: 5px;
	margin-top:5px;
	height: auto;
	width: 120px;

}

.previous_next{
	margin-left: auto;
	margin-right: auto;
	overflow: auto;
	background-color: #7099d7;
	border: 1px solid;
	width: 160px;
	
}

.previous_next div{

	float: left;
	width: 80px;
	text-align: center;
	padding-top:2px;
	padding-bottom:2px;

}

.previous_next div a {

	margin: 0px;
	text-decoration: none;
	color: #000000;	
	
}


.details_container{

	float: left;
	height: auto;
	margin-left: 5px;
	margin-top: 5px;
	color: #000000;
	text-decoration: none;

}

.details_right{

	float: left;
	height:90px;
	vertical-align: middle;
	
}

.list_details_title{
	
	float: left;
	background: #3da1e0;
	width: 150px;
	padding-left: 5px;
	height: 20px;
	
}

.page_select {
	
	margin-top:10px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:10px;
		
}

.page_select ul{

	list-style-type: none;
	overflow: auto;
	padding: 0px;
	
}

.page_select ul li{

	float: left;
	margin-right:5px;
	
}

.page_select ul li a{
	text-decoration: none;
	color: #000000;
	padding: 2px;
}

.page_select ul li a:hover{
	text-decoration: none;
	font-weight:bold;
	color: #ffffff;
	background-color: #7099d7;
}


.message{
	
	padding: 5px;
	margin-top: 10px;
	width: 550px;
	margin-left: auto;
	margin-right: auto;
	background: #dfffdf;
	border: 2px solid #afffaf;
	
}

.message a{
	
	font-weight: bold;
	color: #6ECBFC;
	
}

/*span{
	padding: 15px;
}*/

/*.errors{

width: 550px;
min-height: 20;
border: 2px solid #ff0000;
background: #FFE6E6;
margin:10px;
margin-left: auto;
margin-right: auto;
padding-top: 2px;
padding-bottom: 2px;

}

div.messages{

width: 550px;
min-height: 20;
border: 2px solid #0BF28E;
background: #E1F4EC;
margin:10px;
margin-left: auto;
margin-right: auto;
padding-top: 2px;
padding-bottom: 2px;

}


div.errors div{

margin-left: 5px;
color: #ff0000;

}




div.display_picture_top_bottom a{

color: #8f8f8f;
text-decoration: none;
font-weight:bold;

}*/

div.register{
width: 550px;
margin-left: auto;
background: #CEE2FF;
border: 2px solid #B2D1FD;
margin-right: auto;
padding-top: 5px;
padding-bottom: 5px;
}

/* for forms */

.element, .captcha_element{

margin-left: auto;
margin-right: auto;
margin-bottom: 2px;
overflow: auto;
width: 500px;
text-align: center;

}

.captcha_element
{
	padding: 5px;
}

label.required{
padding-right: 2px;
float: left;
width: 150px;
margin-right: 2px;
text-align: right;
background: #3da1e0;
height: 25px;
}

label.optional{
padding-right: 2px;
float: left;
width: 150px;
margin-right: 2px;
text-align: right;
background: #3da1e0;
height: 25px;
}

div.formvalue{

height: 25px;
float: left;
padding-left: 2px;
text-align: left;


}

.formvalue_textarea{

padding-left: 2px;
text-align: left;

}

.formerror{
color: #ff0000;
list-style-type: none;
margin: 0px;
padding-bottom: 2px;
}



.form
{
	
	width: 100%;
	height: 100%;
	background: #CEE2FF;
	border: 2px solid #B2D1FD;
	padding:10px 0px 10px 0px;


}

.form_contact, .form_register, .form_building, .form_picture, .form_description, .form_booking, .form_login
{
	width: 550px;
	margin-left: auto;
	margin-right: auto;
}





.footer{
	
	padding-left: 5px;
	padding-top: 2px;
	padding-bottom: 2px;
	vertical-align: bottom;
	background-color: #7099d7;
	margin-left: 0px;
	margin-right: 0px;
	text-align: left;
	border-top: 1px solid #000000;
	
}