/* Stylesheet basics for all pages of Copito */
/* 
<!-- #bbinclude "date.txt" #bbincludeoptions#="inline=true" -->

########### Last updated:    17-Nov-09, 8:46 Uhr +1300
########### File Size:       16791 Byte
########### By:              p.scheuerl@it-ma.de

<!-- end bbinclude -->
*/

/* ######### Global Layout (positioning) Styles ######### */

body 
{
	background:#ccc;
	margin: 0; padding: 0;
	font-weight: normal;
	font-family: Arial, Helvetica, Tahoma, Geneva, Verdana, sans-serif;
	text-align: justify;
	font-size: 12px;
}

input, textarea {font-family: Helvetica, Arial, Tahoma, Geneva, Verdana, sans-serif; color: #69737a; font-size: 1em; }

/* Colours */

body {border-top: 1px solid #9f0021; }

body, div { color: #69737a;}

.lightborder { border: 1px solid #ccc;}
.midborder { border: 1px solid #999;}
.darkborder { border: 1px solid #69737a;}
.rotborder { border: 1px solid #9f0021;}
.weissborder { border: 1px solid #1b7633; }
.roseborder { border: 1px solid #bd7d8b; }
.cavaborder { border: 1px solid #880; }
.portborder { border: 1px solid #940;}

.whiteback {background: #fff}
.lightback {background: #ccc}
.midback {background: #999}
.darkback {background: #69737a}

a:link, a:visited {color: #999; text-decoration: none}
.dark, a:link.dark, a:visited.dark, .dark a:link, .dark a:visited  {color: #333;}

h1, h3, .rot, a:link.rot, a:visited.rot, .rot a:link, .rot a:visited  {color: #9f0021;}

.weiss, a:link.weiss, a:visited.weiss, .weiss a:link, .weiss a:visited  {color: #1b7633;}

.rose, a:link.rose, a:visited.rose, .rose a:link, .rose a:visited  {color: #bd7d8b;}

.cava, a:link.cava, a:visited.cava, .cava a:link, .cava a:visited  {color: #880;}

.port, a:link.port, a:visited.port, .port a:link, .port a:visited  {color: #940;}

a:hover, a:focus, a:active,
a:hover.rot, a:focus.rot, a:active.rot, .rot a:hover, .rot a:focus, .rot a:active
{color: #600; text-decoration: underline; outline: none;}
a:hover.weiss, a:focus.weiss, a:active.weiss, .weiss a:hover, .weiss a:focus, .weiss a:active
{color: #135524; text-decoration: underline; outline: none;}
a:hover.rose, a:focus.rose, a:active.rose, .rose a:hover, .rose a:focus, .rose a:active
{color: #795059; text-decoration: underline; outline: none;}
a:hover.cava, a:focus.cava, a:active.cava, .cava a:hover, .cava a:focus, .cava a:active
{color: #660; text-decoration: underline; outline: none;}
a:hover.port, a:focus.port, a:active.port, .port a:hover, .port a:focus, .port a:active
{color: #620; text-decoration: underline; outline: none;}

/* Global styles */
h1, h2, h3, h4, h5 {font-weight: normal; margin: 5px 0}
h2, h4, h5 { color: #666;}

.cleaner {clear: both; height: 1px; font-size: 1px}

.padder5 {padding: 5px}
.padder10 {padding: 10px}
.padder15 {padding: 15px}

.hpadder5 {padding: 0 5px}
.hpadder10 {padding: 0 10px}
.hpadder15 {padding: 0 15px}

.vpadder5 {padding: 5px 0}
.vpadder10 {padding: 10px 0}
.vpadder15 {padding: 15px 0}

/* Content Block */
#content {
	width: 980px;
	margin: 0 auto;
	padding: 20px 10px 10px 10px;
	text-align: left;
	background: url(bg_logo.gif) center center no-repeat fixed #fff; 
	border: 1px solid #aaa;
	position: relative;
}

/* Background logo position on different pages */
#homepage #content {background-position: 50% 200px}
#regionen #content {background-image: none; }
/* Head Block */

#header {padding-bottom: 10px; height: 100px;position: relative;}
#headleft {float: left}
.headright {float: right; width: 230px; margin: 0; padding: 0 0 0 10px; position: relative;}

.headright form { padding: 5px; overflow: hidden}
.headright label span { display:-moz-inline-box; display: inline-block; width: 100px} /* -moz-inline-box is only for FF 2 */
.headright input.submit {position: relative; left: 100px; width: 116px; margin-top: 5px; border: 1px solid #9f0021; color: #9f0021; background: #ddd }
.headright input.submit:hover, .headright input.submit:active 
	{border: 1px solid #1b7633; color: #1b7633; background: #ddd }
.headright label input {width: 110px; padding: 1px; height: 1.2em;  margin-top: 2px}

.headright .member {overflow: hidden; margin-top: 17px }
.headright .membername {font-size: .9em; float: left}
.headright .logout {font-size: 1.1em; float: right; margin-top: .9em}
.headright .dealerinfo {font-size: .9em; color: #333; margin: 35px 0 5px 0; padding: 0 5px 5px 5px; width: 220px; height: 15px; overflow: hidden; position: absolute; background: #fff; z-index: 10;}
.headright .dealerinfo strong {display: block; line-height: 20px; font-size:1.1em; color:#9f0021;}
.headright .dealerinfo:hover, .headright .rabattinfo:focus, .headright .fullheight {height: auto; z-index: 11;} 

.headright .dealerinfo table {border-collapse: collapse; margin: 0 auto}
.headright .dealerinfo table th {text-align: center}
.headright .dealerinfo table td {text-align: right; padding: 2px 10px; margin: 0}
.headright .dealerinfo table tr:hover {background: #ccc}
.headright .dealerinfo table tr:first-child:hover {background: #fff}

.headright .gastroinfo {font-size: .9em; color: #333; margin: 5px 0; padding: 0 5px 5px 5px; width: 220px; height: 15px; overflow: hidden; position: absolute; background: #fff; z-index: 10;}
.headright .gastroinfo a:link, .headright .gastroinfo a:visited {display: block; line-height: 20px; font-size:1.1em; color:#000; font-weight: bold}

.headright .notes {font-size: .9em; color: #333; margin: 5px 0; padding: 0 5px 5px 5px; width: 220px; height: 15px; overflow: hidden; position: absolute; background: #fff; z-index: 10;}
.headright .notes strong {display: block; line-height: 20px; font-size:1.1em; color:#000;}
.headright .notes:hover, .headright .notes:focus, .headright .fullheight {height: auto; z-index: 11;} 
.headright .notes form {margin: 0}

.button  {margin-top: 5px; border: 1px solid #9f0021; color: #9f0021; background: #ddd; cursor: pointer }
.button:hover {border: 1px solid #1b7633; color: #1b7633; background: #ddd }

/* Middle Block */

.fliess a.button:link, .fliess a.button:visited {display: block; width: 60px; padding: 3px; text-align: center; border: 1px solid #9f0021; color: #9f0021; background: #eee; float: right; margin-right: -20px; text-decoration: none}
.fliess a.button:hover {border: 1px solid #1b7633; color: #1b7633; text-decoration: none}

.weinart {font-size: 3em; line-height: .3em}

table {border-collapse: collapse}
table.sorthelp {margin: 0 auto 10px auto; text-align: center}
table.sorthelp td {padding: 3px 5px}
table.sorthelp a:hover, table.sorthelp a:active {text-decoration: none}
table.weinliste th {text-align: center; vertical-align: bottom}
table.gutsliste th {text-align: center; vertical-align: top}
table.lines td, table.weinliste td, table.gutsliste td {border-bottom: 1px solid #ccc; padding: 3px 5px}
table.showhover tr:hover td, table.weinliste tr:hover td, table.gutsliste tr:hover td {background: #edf0f0}
table.weinliste tr:hover th, table.gutsliste tr:hover th {background: transparent}
.centertext {text-align: center}

/* for png and positioning problem reasons IE6 gets gifs instead in css_ie6.css*/
.sortup, .sortdown {display:-moz-inline-box; display: inline-block; width: 25px; height: 25px;} /* moz-inline-box needed for older FF*/
a:hover.sortup, a:hover.sortdown, a:active.sortup, a:active.sortdown {text-decoration: none}
.sortup {background: url(sort_up.png) left 1px no-repeat transparent}
.sortup:hover {background: url(sort_up.png) left -29px no-repeat transparent}

.sortdown {background: url(sort_down.png) left 1px no-repeat transparent}
.sortdown:hover {background: url(sort_down.png) left -29px no-repeat transparent}

/* START do not show some arrows */
.price2 .sortdown, .price2 .sortup, .price3 .sortdown, .price3 .sortup {display: none}
.price2, .price3  {padding-bottom: 25px}
/* END do not show some arrows */

.weinliste th a.act, .gutsliste th a.act {background-position: left -29px}

/* Table Weinliste */
table.weinliste {width: 100%; margin: 10px auto}
table.weinliste td.art {font-size: 2.5em; line-height: .4em; text-align: center; width: 44px}
table.weinliste td.name { width: 210px}
table.weinliste td.name img {vertical-align: text-bottom; margin-left: 5px}
table.weinliste td.name a:link.rot, table.weinliste td.name a:visited.rot,
table.weinliste td.name a:link.weiss, table.weinliste td.name a:visited.weiss,
table.weinliste td.name a:link.rose, table.weinliste td.name a:visited.rose,
table.weinliste td.name a:link.cava, table.weinliste td.name a:visited.cava,
table.weinliste td.name a:link.port, table.weinliste td.name a:visited.port
{color: #69737a; display: block}

table.weinliste td.name a:hover.rot, table.weinliste td.name a:active.rot {color: #9f0021}
table.weinliste td.name a:hover.weiss, table.weinliste td.name a:active.weiss {color: #1b7633}
table.weinliste td.name a:hover.rose, table.weinliste td.name a:active.rose {color: #bd7d8b}
table.weinliste td.name a:hover.cava, table.weinliste td.name a:active.cava {color: #880}
table.weinliste td.name a:hover.port, table.weinliste td.name a:active.port {color: #940}

table.weinliste td.year { width: 50px}
table.weinliste td.size {width: 50px}
table.weinliste td.region {}
table.weinliste td.yard {}
table.weinliste th.price1 {text-align: right; padding-right: 10px; width: 60px}
table.weinliste td.price1 {text-align: right; padding-right: 10px }
table.weinliste td.price1 span {display: block; font-size: .9em; color: #999}
table.weinliste th.price2 {text-align: right; padding-left: 10px; width: 60px}
table.weinliste td.price2 {text-align: right; padding-left: 10px }
table.weinliste td.price2 span {display: block; font-size: .9em; color: #999}
table.weinliste th.price3 {text-align: right; padding-left: 20px; width: 60px}
table.weinliste td.price3 {text-align: right; padding-left: 20px }
table.weinliste td.price3 span {display: block; font-size: .9em; color: #999}

/* Table Gutsliste */
table.gutsliste {width: 100%; margin: 10px auto}
table.gutsliste td {vertical-align: top; line-height: 1.4em}
table.gutsliste td.yard {font-size: 1.2em; color: #9f0021; }
table.gutsliste td.yard a:hover, table.gutsliste td.yard a:active {text-decoration: none; color: #9f0021; cursor: text }
table.gutsliste td.weine a:link, table.gutsliste td.weine a:visited {display: block; color: #69737a; position: relative; padding-left: 15px;}
table.gutsliste td.weine a:hover, table.gutsliste td.weine a:active {text-decoration: none}
table.gutsliste td.weine a:link span, table.gutsliste td.weine a:visited span, table.gutsliste td.weine a:hover span, table.gutsliste td.weine a:active span {font-size: 2.5em; line-height: .4em; position: absolute; top: 2px; left: 0px; }

table.gutsliste td.weine a.rot:link span, table.gutsliste td.weine a.rot:visited span, table.gutsliste td.weine a.rot:hover, table.gutsliste td.weine a.rot:active {color: #9f0021;}
table.gutsliste td.weine a.weiss:link span, table.gutsliste td.weine a.weiss:visited span, table.gutsliste td.weine a.weiss:hover, table.gutsliste td.weine a.weiss:active {color: #1b7633;}
table.gutsliste td.weine a.rose:link span, table.gutsliste td.weine a.rose:visited span, table.gutsliste td.weine a.rose:hover, table.gutsliste td.weine a.rose:active {color: #bd7d8b;}
table.gutsliste td.weine a.cava:link span, table.gutsliste td.weine a.cava:visited span, table.gutsliste td.weine a.cava:hover, table.gutsliste td.weine a.cava:active {color: #880;}
table.gutsliste td.weine a.port:link span, table.gutsliste td.weine a.port:visited span, table.gutsliste td.weine a.port:hover, table.gutsliste td.weine a.port:active {color: #940;}

table.gutsliste .other .ilink {display: block;}

/* daten formular */
.registerform, .contactform {margin: 0 0 0 100px}

.wwgrp {height: 3em}

.wwgrp br {display: none}

.wwlbl {float: left; line-height: 2em; width: 150px;}

fieldset {border: none; margin-bottom: 10px; padding: 20px}
fieldset.regleft, fieldset.regright { border: 1px solid #ccc;}

fieldset.regleft {width: 320px; float: left; margin-right: 10px}
fieldset.regright {width: 320px;}

fieldset.regleft input, fieldset.regright input { border: 1px solid #9f0021; padding: 2px; opacity: .8}
fieldset.regleft input:focus, fieldset.regright input:focus 
{ border: 1px solid #1b7633; outline: none; background: #fff3f3}

.fieldsetenvelope {overflow: hidden}

fieldset h2 {margin: 0 0 10px 0}

textarea.contact {width: 320px; height: 280px; border: 1px solid #9f0021; padding: 2px; opacity: .8; }
textarea.contact:focus { border: 1px solid #1b7633; outline: none; background: #fff6f6}
.contactbuttons .button {margin-left: 10px}

/* Weindetail */
.wineimage {float: left; width: 250px}

.price {color: #364047; font-size: 1.1em}
.baseprice {color: #69737a; font-size: .9em}

.beschreibung table {margin: 10px; border-collapse: collapse;}
.beschreibung table th, .beschreibung table td {padding: 5px 20px; text-align: right}

/* Feinkost */
.feinkostblock {overflow: hidden; }
.feinkostbild {float: left; width: 150px; text-align: center}
.feinkostbild a:hover {text-decoration: none}

/* Lightbox */
#lightbox{
	background-color:#fff;
	padding: 10px;
	margin: 10px;
	border-top: 1px solid #1b7633;
	border-right: 1px solid #9f0021;
	border-bottom: 1px solid #9f0021;
	border-left: 1px solid #1b7633;
	}
#lightboxDetails {font-size: 1em; padding-top: 0.4em;}	
#lightboxCaption { float: left; color: #9f0021;}
#keyboardMsg {float: right; }
#lightbox img { border: none; } 
#overlay {background: #000; opacity: .2; }

#overlay img { border: none; }
#closeButton {position: absolute; top: 0; right: 0}
#closeButton img {}

/* overlayed window */
#staticoverlay {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:90;   
    background-color:#000;
    opacity:.80;
    -moz-opacity: 0.8;
    filter: alpha(opacity=80);
    }

#staticoverlay[id] { /* IE6 and below Can't See This */
    position:fixed;
    }
    
#weindetail {position: absolute; z-index: 95; text-align: justify; width: 100%;}

#weindetail .fliess {background: #fff; margin: 50px auto 0 auto; width: 700px; padding: 10px; position: relative; overflow: hidden}
#weindetail .close {position: absolute; right: 0px; top: 0px; }
#weindetail .beschreibung {margin-left: 250px; }

/* Just in case standard template is used */
#left, #right {display: none}

#middle {overflow: hidden; margin: 0; } /* min-height: 385px -> would make the homepage more pleasant, but IE6 prohibits it as it gets min-height as height */

#homepage #middle {padding-top: 5px; width:970px;}

#logedout #middle {height: 500px;}

#middle .homepageleft {width: 326px; float: left; }
#middle .homepagemiddle {width: 328px; float: left; padding-top: 30px}
#middle .homepageright {width: 255px; margin-top: 30px; float: left; text-align: center;}

#middle .homepagemiddle h1 {font-size: 1.4em;}
#middle .homepagemiddle p {line-height: 1.5em; font-size: 1.2em}

div.fliess {margin: 0 20px}

/* Footer */
#footer {width: 980px; margin-top: 15px; font-size: 1em; text-align: center}

/* CMS Standards */

.ilink {padding: 0}
a.internal:link, a.internal:visited , 
.internal a:link, .internal a:visited 
{color: #1b7633}
a.external:link, a.external:visited ,
.external a:link, .external a:visited 
{color: #9f0021}
.ipic {margin:0;} 
.ipic img {border:none; margin:0; padding:0;} 
.ipic .caption {font-size: 0.8em; padding: 0; color: #333} 
.floatright {float:right; margin: 0 0 5px 10px;} 
.floatleft {float:left; margin: 0 10px 5px 0;} 

.fliess ul, .fliess ol {padding: 5px 0 5px 20px; margin: 0 }
.fliess li {padding: 0 0 5px 0; }

.datenblatt {padding: 5px 20px; margin-left: 10px; height: 30px;}
.pdf { background: url(icon_pdf_small.gif) left top no-repeat;}

/* General overrides for other styles */
#header a:link img, #header a:visited img, .weinliste a:link img, .weinliste a:visited img, .wineimage a:link img, .wineimage a:visited img, 
#weindetail a.close:link img, #weindetail a.close:visited img, .gutsliste a:link img, .gutsliste a:visited img,
.feinkostbild a:link img, .feinkostbild a:visited img
{border: none;}

/* For Print only content */
.printonly {display: none}

/* + + + + + + + + + + + + */
/*  F A N C Y   S T U F F  */
/* + + + + + + + + + + + + */

a:link { -webkit-transition: color .3s linear } 
.headright input.submit { -webkit-transition: all .3s linear} 

/* A L L   B O R D E R S   H A V E   R O U N D E D   C O R N E R S */
/* Only works in Webkit and Gecko yet */
.lightborder, .midborder, .darkborder, .rotborder, .weissborder, .roseborder, .cavaborder, .portborder, input , fieldset, textarea.contact, #lightbox,
#weindetail .fliess, .fliess a.button:link
{border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px}

/* .headright .dealerinfo { -webkit-transition: height .2s linear } */ /*unfortunately this only looks good if the height is set in pixel, not as "auto" */