/* EUMAGINE.CSS     Hauptseite */
/*=============================================================== */

/* ============ */
/* Kalibrierung */

* {padding: 0; margin: 0; border: 0 }
html { height: 101%; }
h1, h2, h3, h5, h6 { margin-bottom: 0.5em; margin-top: 1em}
li { margin-left: 0.5em}
p { margin-top: 3px}
em    { color: #009; font-style: normal; text-decoration: none }

/* =================== */
/* Allgemeine Styles   */

body     { color: #000; font-family: sans-serif, Verdana, Arial, Helvetica, sans-serif; background-color: #000000 }

h1    { color: #003f80; font-size: 115%; text-decoration: none }
h1 a:link { color: maroon; font-size: 100%; text-decoration: none }
h1 a:visited { color: maroon; font-size: 100%; text-decoration: none }
h1 a:hover  { color: maroon; font-size: 100%; text-decoration: none; background-color: white }
h1 a:focus { color: maroon; font-size: 100%; text-decoration: none }
h1 a:active  { color: maroon; font-size: 100%; text-decoration: none }







h2  { color: #2b612f; font-size: 110%; text-decoration: none; margin-top: 200px }
h3    { color: #003f80; font-size: 95%; text-decoration: none }
h4   { color: #000; font-size: 100%; padding-top: 5px }

address  { color: #ffffff; font-style: normal; padding-top: 2px; padding-left: 20px }

img       { background-color: white; margin-left: 0 }
img a:hover  { background-image: none; margin-left: 0 }


/* ================== */
/* Bestimmte Elemente */

#wrapper       { color: black; background-color: white; margin: 12px auto; width: 1000px; border: solid 0 #100 }




#kopf      { color: black; background-image: url("eumagine_logo_long.jpg"); background-repeat: no-repeat; margin-bottom: 0; width: 1000px; height: 147px; border-bottom: 0 solid #d9d9d9 } 	

/* =============== */
/* Hauptnavigation */

#hauptnavigation                  { color: white; font-size: 110%; font-weight: bold; background-color: black; background-image: url("menu_neu.jpg"); background-repeat: no-repeat; text-align: left; height: 101px }
/* eigentlicher Navibalken */
#hauptnavigation ul        { color: white; text-align: left; padding-top: 40px; padding-right: 15px; padding-left: 15px; width: 970px }
#hauptnavigation li    { list-style-type: none; display: inline }
/* Kartenreitergroesse */
#hauptnavigation a,
#hauptnavigation a span
         { color: #003780; font-weight: normal; text-decoration: none; padding-top: 40px; padding-right: 15px; padding-left: 15px; height: 61px; border: solid 0 }
#hauptnavigation a:link       { color: white; font-weight: bold }
#hauptnavigation a:visited     { color: white; font-weight: bold }

#hauptnavigation a:hover    { color: white; background: url("button_r.gif") repeat-x; height: 101px }

#hauptnavigation a:focus     { color: white; font-weight: bold }
#hauptnavigation a:active     { font-weight: bold; background-color: white }



/* Sie sind hier */

#about ul #navi01 span,
#preview ul #navi02 span,
#program ul #navi03 span,
#googlekarte ul #navi04 span,
#faq ul #navi05 span,
#info ul #navi06 span,
#downloads ul #navi07 span,
#pricelist ul #navi08 span,
#contact ul #navi09 span,
#disclaimer ul #navi10 span,
#imprint ul #navi11 span   { color: #8997ff; font-weight: bold; padding-right: 15px; padding-left: 15px }

/* ================== */
/* Bestimmte Seiten */


#kontaktformular  { width: 420px }


#text       { color: #444; font-size: 90%; font-family: sans-serif, Verdana, Arial, Helvetica, sans-serif; background-image: url("page_back.gif"); background-repeat: repeat-x; background-attachment: scroll; background-position: 100% top; text-align: left; padding: 12px 39px; width: 922px; height: 568px }
#text a  { color: #8997ff; font-weight: strong; text-decoration: none; padding: 2px; border: solid 0 #8c8c8c }
#text a:link    { color: #003f80; line-height: 15px }
#text a:visited   { color: #003f80 }
#text a:hover { color: white; background-color: #003f80 }
#text a:focus { color: #003f80; background-color: #ffffff }
#text a:active  { color: white; background-color: #003f80 }




#textprice           { color: #444; font-size: 95%; font-family: sans-serif, Verdana, Arial, Helvetica, sans-serif; background-repeat: no-repeat; text-align: left; width: 922px; height: auto }
#textprice  a   { color: #003780; font-size: 85%; font-weight: normal; text-decoration: none; padding: 2px; border: solid 0 #8c8c8c }
#textprice  a:link   { color: maroon }
#textprice  a:visited   { color: maroon }
#textprice  a:hover { color: #003f80; background-color: #ffffff }
#textprice  a:focus { color: #003f80; background-color: #ffffff }
#textprice  a:active  { color: white; background-color: #003f80 }




#takecare  { font-size: 90%; text-align: center; padding-top: 200px; bottom: 12px; clear: both }


#texttermsleft            { color: black; font-size: 90%; font-family: sans-serif, Verdana, Arial, Helvetica, sans-serif; text-align: justify; margin: 0; width: 440px; height: auto; float: left }
#texttermsleft li  { padding-bottom: 0.5em;}
#texttermsleft ol  { padding-left: 1em;}

#texttermsright           { color: black; font-size: 90%; font-family: sans-serif, Verdana, Arial, Helvetica, sans-serif; text-align: justify; margin: 0; width: 440px; height: auto; float: right }

#texttermsright li  { padding-bottom: 0.5em }
#texttermsright ol  { padding-left: 1em;}

/* =================== */
/* fussnavigation      */



#fussnavigation                   { color: #bbb; font-size: 80%; font-weight: normal; background-color: black; background-image: url("title.gif"); background-repeat: no-repeat; text-align: left; height: 28px }
/* eigentlicher Navibalken */
#fussnavigation ul      { color: white; text-align: right; padding-top: 12px; padding-right: 20px; width: 980px }
#fussnavigation li    { list-style-type: none; display: inline }
/* Kartenreitergroesse */
#fussnavigation a,
#fussnavigation a span
         { color: #bbb; font-weight: normal; text-decoration: none; padding-top: 12px; padding-right: 10px; padding-left: 10px; height: 28px; border: solid 0 }
#fussnavigation a:link         { color: #bbb; font-weight: normal }
#fussnavigation a:visited      { color: #bbb; font-weight: normal }

#fussnavigation a:hover    { color: white; background-color: transparent; }

#fussnavigation a:focus      { color: white; font-weight: normal }
#fussnavigation a:active       { color: white; font-weight: normal }

/* =================== */
/* Das Kontaktformular */

#textemail   { color: #4b4b4b; font-size: 90%; text-align: justify; margin: 20px; width: 984px; height: 546px }

form {
background-color: #eeeeee;
color: #4b4b4b;
width: 450px;
padding: 10px;
border: 1px solid #003f80;
}

label 
 {
 width: 6em;
 float: left;
 text-align: right;
 margin-right: 0.5em;
 display: block
 }
 
 input
 {
 color: black;
 background: white;
 border: 1px solid #003f80
 }

textarea  { color: black; font-size: 1em; font-family: sans-serif, Verdana, Arial, Helvetica, sans-serif }

input#absender, textarea { border: 1px solid #003f80; margin-bottom: 1em }
input#text { border: 4px solid #8c8c8c; margin-bottom: 1em }

input#absender:focus, input#firstname:focus, input#lastname:focus, input#company:focus, input#zipcode:focus,
input#country:focus, input#website:focus, input#mail:focus, input#preferentialdates:focus, input#phone:focus, input#city:focus, textarea:focus  
{ color: black; background-color: #eaecf6}


/* ============================= */
/* Der Online-Calculator-EINGABE */

#calculator form     { color: #444; background-color: #d6e0eb; padding: 10px; width: 30em; border: solid 1px #003f80 }

#calculator form p   { margin-top: 0.5em }
 
#calculator form span   
 { color: #444; background-color: white; text-align: left; display: block; margin-right: 0.5em; padding-left: 0.5em; width: 15em; float: left }
 
#calculator input
   { color: black; background: white; margin-right: 12px; margin-left: 12px; border: solid 1px #003f80 }


/* ============================= */
/* BUDGET-INQUIRY-EINGABE */

#budgetanfrage      { background-color: #ffffff; padding-top: 12px; height: auto; clear: both }

#budgetanfrage form       { color: black; font-size: 90%; background-color: #d6e0eb; width: 902px; height: auto; border: solid 1px #003f80 }

#budgetanfrage form p   { margin-top: 0.5em }
 
#budgetanfrage form span   
  { color: #444; background-color: white; text-align: right; display: block; margin-right: 0.5em; padding-left: 0.5em; width: 20em; float: left }
 
#budgetanfrage input
   { color: black; background: white; margin-right: 12px; margin-left: 12px; border: solid 1px #003f80 }





/* ================ */
/* faqcontainer */

.faqcontainer { text-decoration: none; margin-top: 0px; position: relative }

.thumbnail img { border: 0px solid #b21212; margin: 0 0px 0px 0; }

.thumbnail:hover{
background-color: transparent;}

.thumbnail:hover img{
border: 0px solid #b21212;}

.thumbnail span     { color: #2b612f; font-family: Verdana; font-style: normal; font-weight: bold; text-decoration: none; background-color: #ffffff; text-align: justify; visibility: hidden; padding: 0; position: absolute; top: 220px; left: 2px; width: 500px; border: solid 0 #800 }

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0px;
padding: 0px; }

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 220px; left: 2px; /*position where enlarged image should offset horizontally */
z-index: 50;}


/* ================ */
/* previewcontainer */

.previewcontainer    { color: black; text-decoration: none; position: relative }

.thembnail img { border: 0px solid #b21212; margin: 0 5px 5px 0; }

.thembnail:hover{
background-color: transparent;}

.thembnail:hover img{
border: 0px solid #b21212;}

.thembnail span    { color: #940021; font-family: Verdana; font-style: normal; font-weight: bold; text-decoration: none; background-color: #ffffff; text-align: justify; visibility: hidden; padding: 0; position: absolute; top: 20px; left: 0px; border: solid 0 #800 }

.thembnail span img{ /*CSS for enlarged image*/
border-width: 0px;
padding: 0px; }

.thembnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 20px; left: 0px; /*position where enlarged image should offset horizontally */
z-index: 50;}