@CHARSET "ISO-8859-1";

/*Main page stylesheet*/

* {
	margin: 0;
	padding: 0;
}/*solves inter-browser differences*/

/* ################ Main divs ##################### */

/*containers and the body*/

body
	{
		background-color: #6A7940;/*#B0B89B;*/ 
		width: 100%;
		font-size: 0.8em;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		/*margin-bottom: 30px;*/ /*space for the main_bottom*/
	}

#default_page
	{
		position: relative;
		margin: 10%;
		width: 80%;
		color: #FFFFFF;/*by giving it the same color as the background I won't see it*/
	}

#progress
	{
		position:absolute;
		top: 45%;
		left:45%;
		z-index:10;
	}
#progress img
	{
		width:100px; 
		height:100px;		
	}

#content
	{
		position: relative;
		top: 0px;
		height: 825px; /*ie*/
		width: 1000px;
		background-color: #FFFFFF;
		margin: 0px auto;
		/*padding-bottom: 10px;*/ /*space for the ads*/
	}

/*Position of the main divs in the page: Layout*/

#top_menu
	{
		position: relative;
		width: 100%;
		text-align: right;
		
		background-color: #6A7940;
		height:20px;
		/*		 		
		height: 45px;
		background: url(../images/grad_top.gif) repeat-x;
		*/
}

#top_menu a
	{
		text-decoration: none;
		color: #FFFFCC;
		margin: 15px; /*margin between elements*/ 
	}

#top_menu a:hover
	{
		text-decoration: underline;	
	}


#main_top
	{
		position: relative;
		height: 175px;/*134px;*/
		width: 100%;
	}

#main_left
	{
		position: relative;
		float: left;
		left: 0%;
		height: 630px;/*105%;*/
		width: 20%;
		
		font-size: 0.8em;
		background-color: #A49077;/*#D4AF88;*/
		/*font-size: 10pt;
		font-family: Times;*/
	}

#main_center
	{
		position: relative;/*absolute;*/
		top: 0px;/*+20px;*/
		float: left;
		
		/*to fit a 640x480 picture + heading tabs (20px)*/
		height: 500px;
		width: 640px;
		
		/*force a margin to the left and leave an empty 0.5% to the right
			as I noticed that ie6 does not like exact sizes*/
		margin-left: 0.5%;
		max-width: 65%;
		
		font-size: 0.8em;
		/*font-size:12pt;
		font-family: Times;*/
	}

#main_right
	{
		position: relative;/*absolute;*/
		float:right;
		width: 15%;
		height: 630px;/*105%;*//*600px;*/
		
		font-size: 0.8em;
		background-color: #A49077;
	}

#ads_certi_div
	{
		position: absolute;
		/*clear: both;*/		
		/*top: -50px; *//*10px;*/
		bottom: 30px;
		left: 3%;
		width: 850px;
		height: 90px;
	}

#ads_bottom
	{
		position: relative;
		float: right;
/*		clear: both;*/
		width: 728px;
		height: 90px;
/*		top: 10px;
		left: 16%;*/
	}

#quality_stamps
	{
		position: relative;
		float: left;
		left:0;
		width: 88px;
		height: 31px;
	}

/*
#quality_stamps a img
	{
		border: 0;
	}
*/
#main_bottom
	{
		position: relative;
		clear: both;
		width: 100%;
		/*bottom: -30px;*/
		left:0px;
	
		/*this is the line made with the div box*/	
		/*border-width:0px;
		border-top: 1px;
		border-style: solid;
		border-color: #6A7940;*/
		
		font-size: 0.8em;
		background-color: #6A7940;
		/*font-size: 10pt;
		font-family: Times;*/
	}

#main_bottom #bottom_webmaster
	{
		position: relative;
		width: 100%;
		/*top: -10px;*/
		left: 22%;
		/*color: #858585;*/
	}

#main_bottom #bottom_modified
	{
		position: relative;
		width: 100%;
		/*top: -10px;*/
		left: 60%;
		color: #B0B89B;
		/*color: #858585;*/
	}

/*  ###################### Embelishments for the page ############################# */

/*border*/


#main_left_border
	{
		position: absolute;
		top: 0px;
		left: -25px;
		width: 25px;
	}	
#main_left_border span
	{
		background: #FFFFFF url("../images/border_top_left.png") left top no-repeat;
		display: block;
	}
#main_left_border span span
	{
		background: url("../images/border_bottom_left.png") left bottom no-repeat;
		height: 175px;
		display:block;
	}

#main_right_border
	{
		position: absolute;
		top: 0px;
		right: -25px;
		width: 25px;
	}
#main_right_border span
	{
		background: #FFFFFF url("../images/border_top_right.png") right top no-repeat;
		display: block;
	}
#main_right_border span span
	{
		background: url("../images/border_bottom_right.png") right bottom no-repeat;
		height: 175px;
		display:block;
	}
	

#side_top_border 
	{
		position: absolute;
		top: -25px;
		left: 0px;
		height: 25px;
		width: 100%;
		z-index: 10;
	
	}
#side_top_border span
	{
		background: #A49077 url("../images/border_tr.png") right top no-repeat;
		display: block;
	}
#side_top_border span span
	{
		background: url("../images/border_tl.png") left top no-repeat;
		height: 25px;
		display:block;
	}


#side_bottom_left_border 
	{
		position: absolute;
		bottom: 0px;/*-25px;*/
		left: 0px;
		height: 25px;
		width: 100%;	
	}
#side_bottom_left_border span
	{
		background: #A49077 url("../images/border_br.png") right top no-repeat;
		display: block;
	}
#side_bottom_left_border span span
	{
		background: url("../images/border_bl_green.png") left top no-repeat;
		height: 25px;
		display:block;
	}

#side_bottom_right_border 
	{
		position: absolute;
		bottom: 0px;/*-25px;*/
		left: 0px;
		height: 25px;
		width: 100%;	
	}
#side_bottom_right_border span
	{
		background: #A49077 url("../images/border_br_green.png") right top no-repeat;
		display: block;
	}
#side_bottom_right_border span span
	{
		background: url("../images/border_bl.png") left top no-repeat;
		height: 25px;
		display:block;
	}


/* ############### information divs #####################*/

/* CSS definitions for the main_top content */ 

/*general layout*/
#top_left
	{
		position: relative;
		float: left;
		
		/*left: 1px;
		top: 10%;*/
		width: 20%;
		height: 100%;
	}

#top_center
	{
		position: relative;
		float: left;
		
		/*left: 1px;
		top: 10%;*/
		width: 60%;		
		height: 100%;
}

#top_right
	{
		position: relative;
		float: right;
		
		/*right: 5%;*/
		width: 20%;
		height: 100%;
}

/*particular wineries positions*/

.top_copes
	{
		position: relative;
		top: +3%;
		margin-left: 10%;
		width: 100px; /*exact sizes wanted*/
		height: 174px;		
	}

.top_olis
	{
		position: relative;
		top: +2%;
		left: +22%;
		
		width: 147px;
		height: 150px;		
	}

.escut_masgarrian
	{
		position: relative;
		top: +15%;
		width: 200px; /*exact sizes wanted*/
		height: 75px;
	}

.escut_doq
	{
		position: relative;
		top: +15%;
		left: +20%;
		
		width: 75px;
		height: 75px;		
	}

.title_masgarrian
{
	position: relative;
	
	left: 10%;
	top: 10%;
		
	/*type depending on the wineyard's design*/
	color: black;

	/*font-size: 2.5em; this does not work in opera*/
	font-size: 50px; 
	font-family: times;
	

	font-weight: bold;
	margin-top: 2px; 
	margin-bottom: 2px;
	
}

.title_masgarrian2
	{
		position: relative;
		
		left: 17%;
		top: 15%;
		
	
		/*type depending on the wineyard's design*/
		color: black;
		
		/*font-size: 1.2em;*/
		font-size: 20px; 
		font-family: times;

		font-weight: normal;
		margin-top: 2px; 
		margin-bottom: 2px;
	}

.title_dopriorat
{
	position: relative;
	
	left: 5%;
	top: 10%;
		
	/*type depending on the wineyard's design*/
	color: black;

	/*font-size: 2.5em; this does not work in opera*/
	font-size: 40px; 
	font-family: times;
	

	font-weight: bold;
	margin-top: 2px; 
	margin-bottom: 2px;
	
}

.title_dopriorat2
	{
		position: relative;
		
		left: 25%;
		top: 15%;
		
	
		/*type depending on the wineyard's design*/
		color: black;
		
		/*font-size: 1.2em;*/
		font-size: 25px; 
		font-family: times;

		font-weight: normal;
		margin-top: 2px; 
		margin-bottom: 2px;
	}


/*
.top_name
{
	position: absolute;
	left: 40%;
	top: 10%;
	
	text-align: center;
	
	color: black;
	font-size: 14pt; 
	font-family: Verdana;
	

}

.top_adress
{
	position: absolute;
	left: 40%;
	top: 40%;
	
	text-align: center;
	
	color: black;
	font-size: 14pt; 
	font-family: Verdana;
}
*/


/* ############################ End of main_top definitions ########################## */

/* #################### shop links  and lang_menu ######################## */

#lang_menu #lang_div, #wine_labels
	{
		/*padding-left: 10px;*/	
		
		background-color: #FFFFCC;
		color: #000000;
		
		border-width: 1px; 
		border-style: dotted;
		width: 99%;
	}

#lang_menu #lang_div img
	{
		padding: 3px;
		padding-left: 10px;
		cursor:pointer;
	}
	
#wine_labels div
	{
		position: relative;
		padding-top: 5%;
		width: 80%;
		left: 10%;
	}	

#wine_labels div #wine_link
	{
		position: relative;
	}

#wine_labels div p
	{
		position: relative;
		top: +1%;
		margin-bottom: 10%;
		text-align: center;
	}

#featured_product, #featured_producer
	{
		text-align: center;
	}
	

/* ##################### Main menu box #####################*/

#main_menu ul
{
	/*padding-left: 5px;*/	
	
	border-width: 1px; 
	border-style: dotted;
	width: 99%;
}

#main_menu ul li
	{
	list-style: none; /*take out the bullet in front*/
	border-width: 1px; 
	border-top-style: dotted;
	padding-top: 5px;
	padding-bottom: 5px;				
	}

#main_menu ul li a
	{
		text-decoration: none;		
	}

/*#main_menu ul li*/
.unselected_main_item
{
	padding-left: 7px;
	color: #000000;
}

.unselected_main_item a
	{
	color: #000000;		
	}

/*#main_menu ul li:hover*/
.unselected_main_item:hover, .selected_main_item
{
	cursor: pointer; 
	color: #FFFFCC;
	background-color: #6A7940;
}

.unselected_main_item:hover a, .selected_main_item a
	{
		color: #FFFFCC;
		background-color: #6A7940;		
	}
	
/* ################## End of main menu box ##############*/


/* ################# Multidiv Navigation tabs ######################## */

.nav_div
	{
		position: relative;
		/*top: -20px;*/ /*relative to the top corner of the div it is in*/ 
		z-index:10;
		height: 4%;/*20px;*/
		width: 100%
	}

.nav_div ul
	{
		list-style: none;
		height: 100%;		
	}

.nav_div ul li
	{
		float: left;
		display: block;
		margin: 0;
		padding: 0;
		height: 100%;
	}


/*.nav_div ul li span*/
.unselected_tab span
{
color: #000;
background: #fb0 url("../images/left-tab.gif") left top no-repeat;
text-decoration: none;
padding-left: 10px;
cursor: pointer;
display: block;
float: left;
height: 100%;
}

/*.nav_div ul li span span*/
.unselected_tab span span
	{
background: url("../images/right-tab.gif") right top no-repeat;
padding-right: 10px;
cursor: pointer;
display: block;
float: left;
    }

.selected_tab span
{
color: #fff;
background: #6A7940 url("../images/left-tab-hover.gif") left top no-repeat;/*26a*/
text-decoration: none;
padding-left: 10px;
cursor: pointer;
display: block;
float: left;
height: 100%;
}

.selected_tab span span
{
background: url("../images/right-tab-hover.gif") right top no-repeat;
padding-right: 10px;
cursor: pointer;
display: block;
float: left
}


/* ################# End of Multidiv Navigation tabs ######################## */

/* others */

#center_bg_text
	{
		position: absolute;
		top: 0px;
		left: 0%; /*for IE*/
		overflow: auto;
		height: 450px;	
	}

#center_bg_image
	{
		position: absolute;
		top: 4%;
		left: 0;
		z-index: 1;
		width: 100%;
		height: 96%; /*in 500px this is 480px*/
	}

/*modifier to write things when there is no image*/
.center_page
	{
		position: relative;
		margin: 5%;	
	}

/*multidiv containing all divs*/
.multidiv
	{
		position: relative;
		height: 100%;
		width: 100%;
		z-index: 10; /*on top of bg image*/
	}
	
.info_div, .info_sub
	{
		position: relative;/*absolute;*/
		overflow: auto;
	}

.info_sub
	{
		border-width: 1px; 
		border-style: dotted;
		width: 100%;
		height: 96%;/*combines with 4% for the tabs*/
	}

/*applies a fixed padding to avoid text next to borders*/
.info_div
	{
		padding: 3%;
		width: 94%;
		height: 90%;/*combines with 4% for the tabs*/
		font-size:1.2em;
	}


/* ##################### define how boxes carry information in the sides ############### */

.box_left, .box_right
	{
		position: relative;
		top: 0%;
		width: 95%; 
		background-color: #FFFFCC;/*#6A7940;*/ 
		z-index: 10;
		/*margin-bottom: 5%;*/
		margin-bottom: 20px;
	}

.box_left
	{
		left:0px;
	}
.box_right
	{
		right:-5%;
	}

.box_right .title
	{
		color: #FFFFCC;
		background: #6A7940 url("../images/left-tab-brown.gif") left top no-repeat;/*26a*/
		padding-left: 10px;
		display: block;
	}

.box_left .title
	{
		color: #FFFFCC;
		background: #6A7940 url("../images/right-tab-brown.gif") right top no-repeat;/*26a*/
		padding-left: 10px;
		display: block;		
	} 
		
#contact_info #address_div
{	
		background-color: #FFFFCC;
		color: #000000;
		border-width: 1px; 
		border-style: dotted;
		width: 99%;
}

#contact_info #address_div span, #contact_info #address_div a
{	
	padding-left: 10px;
}

/*pictures album*/

.album_left
	{
		position: relative;
		float: left;
		height: 477px;
		width: 140px;
		overflow: auto;
		
		border-width: 1px;
		border-style: dotted;
	}
	
.album_center
	{
		position: relative;
		float: right;
		height: 366px;
		width: 486px;
		
		margin-right: 1%;
		margin-top: 1%;
		
}
	
.album_bottom
	{
		position: relative;
		float: right;
		overflow: auto;
		
		height: 100px;
		width: 480px;

}

.album_bottom p
	{
		position: relative;
		margin: 5% 5% 0 5%;		
	}

.album_landscape_small
	{
		position: relative;
		cursor: pointer;
		margin-bottom: 5px;
		height: 75px;
		width: 100px;

		margin-left: 5%;
	}
.album_landscape_big
	{
		position: relative;
		
		height: 360px;
		width: 480px;	
		
		border-width: 3px;
		border-style: groove;		
	}
.album_portrait_small
	{
		position: relative;
		cursor:pointer; 
		margin-bottom: 5px;
		height: 100px;
		width: 75px;	

		margin-left: 10%;
}
.album_portrait_big
	{
		position: relative;

		height:360px;
		width: 270px;
		border-width: 3px;
		border-style: groove;		

		margin-left: 10%;
	}
	
/*general content box*/

#general_content p
	{
		position: relative;
		margin: 5% 5% 0 5%;
	}
	
/*sho access*/

#shopaccess_content a img
	{
		position: relative;
		margin-left: 30%;
		width: 50px;
		height: 50px;
	}
