/* main CSS Document */

/* DOCUMENT INFORMATION
===========================================
	- Document		: attacVilla Website v3 Placeholder Site
	- Version		: 1.0.0
	- Client		: attacVilla Könnern
	- Author		: Matthias Kretschmann
	- Author Contact: krema@jpberlin.de
	- Author WebSite: www.kremalicious.com
*/

/* CSS RESET*/

html, body {margin: 0; padding: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; border-left: 0;}

body {font-family: "Lucida Grande", Verdana, Arial, sans-serif; color: #ccc; background: white;}
/* END CSS RESET*/

body {font-family: "Lucida Grande", Lucida, Verdana, sans-serif; font-size: small; text-align: center; background: url(images/back.png); background-attachment: fixed;}

#content {margin-right: auto; margin-left: auto; position: relative; margin-top: 140px; width: 641px;}

#bubble {margin-left: auto; margin-bottom: 0px; margin-right: auto; z-index: 2; position: relative; background-repeat: no-repeat; height: 344px; width: 641px; background: url(images/bubble.png);}

#indicator {left: 450px; top: -98px; position: absolute; height: 112px; width: 192px; background-repeat: no-repeat; background: url(images/indicator.png);}

#contact {padding-top: 30px; left: 570px; top: 20px; z-index: 0; position: absolute; text-align: left; height: 226px; width: 206px; background: url(images/contact-back.png) 0; background-repeat: no-repeat;}

#contact p {margin-left: 65px; width: 206px; color: #999999; line-height: 0.8px; text-align: left;}

#footer {height: 74px; z-index: 3; bottom: 0px; font-size: 85%; position: fixed; color: #999999; background-repeat: repeat-x; width: 100%; background: url(images/footer-back.png)}

#footer p {margin-left: auto; margin-bottom: 10px; margin-right: auto; margin-top: 10px; width: 641px;}

p#valid a {display: block; width: 120px; color: #999999; background-position: right center; background-repeat: no-repeat; background-image: url(images/check.png); margin: 0 auto;}

p#valid a:hover { color: white; }

h1 {visibility: hidden; display: none; font-size: 197%; }

a {text-decoration: none; color: #ff6633;}

a:hover {text-shadow: 0px -1px 1px #666666; background-color: #ff6633; color: white; 	
	box-shadow: 0px 0px 10px #999;
	-webkit-box-shadow: 0px 0px 10px #999;
	-khtml-box-shadow: 0px 0px 10px #999;
	-moz-box-shadow: 0px 0px 10px #999;
	border-radius: 3px; 
	-webkit-border-radius: 3px;
	-khtml-border-radius: 3px;
	-moz-border-radius: 3px;}

a:active {border-color: #ff6633; border-style: dotted; border-width: 1px; color: white; background: none;}

a img,img {border: none; display: block;}

a#toggle {top: 240px; left: 510px; position: absolute;}

a#ribbon {
	position: absolute;
	width: 122px;
	height:  122px;
	background: url(images/flickr-ribbon.png) no-repeat right top;
	text-indent: -99999px;
	top: 0;
	right: 0;
	z-index: 2;
}

a#ribbon:hover {
	width: 122px;
	height:  122px;
	background: url(images/flickr-ribbon.png) no-repeat right bottom;
	box-shadow: none;
	-webkit-box-shadow: none;
	-khtml-box-shadow: none;
	-moz-box-shadow: none;
	border-radius: none; 
	-webkit-border-radius: none;
	-khtml-border-radius: none;
	-moz-border-radius: none;
}

/*	=====================================
	========= I CALL IT POETRY ========= 
	=====================================*/