/* +--------------------------------------------------------+
/* | Screen-Stylesheet for Fotokalender.de                  |
/* +--------------------------------------------------------+
/*
/* $Id: style.css, v0.2 2008/09/21 01:42:23 mziesing Exp $ */

BODY {
	margin: 10px;
	padding: 0;
}

#container {
	position: relative;
	width: 858px;
	margin-left: 50px;
}inpt

img {  border: 0px;}
[type="image"] {  border: 0px;}
/******   WORKAROUNDS   ******/

FORM {
	margin: 0;
	padding: 0;
}

IMG {
	border: 0 none;
}

A:focus {
	outline: none;
}

*:focus {
	outline: none;
}

.clear {
	clear: both;
}

.none {
	display: none;
}


/******   CONTENT   ******/

#contentBox {
	width: 671px;
	margin-left: 98px;
	z-index: 50;
}

#contentBoxTop {
	width: 671px;
	height: 46px;
}

#navBreadcrumb {
	margin: 5px 0 6px 26px;
	float: left;
}

#navBreadcrumb A {
}

#navTop {
	margin: 5px 26px 6px 0;
}

#navTop A {
}

#navBreadcrumb A.activeSection, #navTop A.activeSection {
}

#boxLogo {
	width: 410px;
	height: 165px;
	margin: 0 0 18px 26px;
	float: left;
}

#boxCart {
	width: 197px;
	height: 165px;
	margin: 0 0 18px 10px;
	float: left;
}

#cartArticles {
	width: 197px;
	height: 135px;
}

#cartArticles H3 {
	margin: 0;
	padding: 10px 0 0 10px;
}

#cart TD {
	padding-left: 10px;
}

#cartLink {
	width: 197px;
	height: 30px;
}

#cartLink A {
	padding: 7px 0 7px 0;
	display: block;
}

#navMain {
	width: 616px;
	height: 24px;
	margin: 0 0 0 27px;
	padding-top: 6px;
	clear: both;
}

#navMain UL {
	margin: 0;
	padding: 0;
	list-style-type: none;
}


#navMain LI {
	margin: 0;
	padding: 0;
	height: 30px;
	float: left;
}

#navMain A {
	margin-left: 15px;
}

#navMain SPAN.inactive {
	margin-left: 10px;
}

#content {
	width: 566px;
	margin: 0 0 0 27px;
	padding: 10px 25px 10px 25px;
}

#boxContentStart {
	text-align: center;
	clear: both;
}

#content H2 {
	margin: 0 0 10px 0;
	padding: 10px 0 0 0;
	clear: both;
}

#content H3 {
	margin: 0 0 10px 0;
	padding: 10px 0 0 0;
}

.text {
	margin: 0 0 10px 0px;
}

.bold {
}

.boldred {
}

#contentBoxBottom {
	width: 671px;
	height: 42px;
	clear: both;
}

#next {
	float: right;
}


/******   LAYOUTS   ******/

#navBrowse {
	padding-top: 10px;
}

#navBrowse A {
}

DIV.boxLayout {
	margin-top: 15px;
}

IMG.imgLayout {
	margin: 20px 10px 19px 0px;

}


/******   UPLOAD   ******/
#uploadForm div.monthLine {
        clear: left;
        width: 528px;
        overflow: hidden;
        margin-bottom: 3px;
}

#uploadForm div.dummyImg {
    float:left;
    width:80px;
    height: 2em;
}

#uploadForm div  {
    float: left;
    margin: 0 10px 9px 0;
    width: 80px;
}

#uploadForm label {
    width: 100px;
    margin: 3px 0 0 10px;
    display: block;
        float: left;
}

#uploadForm INPUT {
    margin: 0 0 3px 10px;
}

#uploadForm INPUT:hover {
}

#uploadForm INPUT:focus {
}


#uploadForm IMG {
    margin: 0;
    float: left;
}


/******   ATTACH    ******/

#motives {
        position: relative;
	display: block;
        width: 368px;
        margin: 10px 0 0 25px;
	min-height: 400px;
}

#motives IMG {
	float: left;
        margin: 0 10px 10px 0;
        z-index: 750;
}


/******    EDIT   ******/
#cropWrap {
        margin: 20px 0 20px 0px;
        clear: both;
}

/* input hat margin-left 10px , warum ? */
.options  input {
  margin: 0;
}

div.left, div.right {
  text-align: center;
  padding: 2px;
  width: 178px;   /* wg IE ! */
}

div.left {
      float: left;
      }

div.right {
      float: right;
    }

div.center  {
  padding-left: 178px;
  padding-right:178px;
  text-align: center;
  padding-top: 5px;
  }

/******   CONTACT   ******/

LABEL.formular {
	width: 150px;
	margin: 3px 0 0 0px;
	float: left;
	display: block;
}

INPUT.formular, TEXTAREA.formular {
	margin: 0 0 3px 10px;
}

INPUT.formular:hover, TEXTAREA.formular:hover {
}

INPUT.formular:focus, TEXTAREA.formular:focus {
}


/******   FORMS   ******/

LABEL {
	width: 150px;
	margin: 3px 0 0 10px;
	float: left;
	display: block;
}

INPUT, SELECT, TEXTAREA {
	margin: 0 0 3px 10px;
}

/* Artikelauswahl mit Tabelle */

TABLE.articlePricing {
	border-collapse: collapse;
	width:100%px;
        padding:5px;
}

TABLE.articlePricing TH {
	text-align: center;
	padding-left: 6px;
	color: #545454;
	text-align: center;
	border-bottom: 1px solid #545454;
}

TABLE.articlePricing TD.size {
	padding: 0px 4px 0 0;
	color: #028BFF;
	font-weight: bold;
}

TABLE.articlePricing TD.price {
	text-align: center;
	color: #DF0116;
	font-weight: bold;
}

TABLE.articlePricing TD.button {
	text-align: right;
	width: 120px;
	}

td.size label , td.size input {
	margin: 2px 0 0 0;
	float: left;
	display: block;
     }
td.size label { width: 90px; margin-top: 0;}



INPUT:hover, SELECT:hover, TEXTAREA:hover {
}
input[type="image"]:hover {  border: 0px;}

INPUT:focus, SELECT:focus, TEXTAREA:focus {
}

.button, .button:hover {
	border: 0 none;
	cursor: pointer;
}

#continueShopping LABEL {
	width: 100%;
	text-align: left;
}

#continueShopping .button {
	float: right;
}

#adress .button {
	float: right;
}

#divCartBonus {
	clear: both;
	margin-top: 20px;
}

#formBonus .button {
	float: right;
}

FORM BR {
	clear: both;
}

DIV.error {
	margin: 0 0 15px 0;
	padding: 10px;
	clear: both;
}

DIV.error UL {
	margin: 10px 0 0 10px;
	padding: 0;
}

FORM#selectPaySystem DIV.payoption {
	display: block;
}


/******    FOOTER   ******/

#footer {
	margin: 0 26px;
	padding-top: 11px;
}

#footer A {
}

#copyright {
	float: left;
}

#shipping {
	padding-left: 5px;
	float: left;
}

#toTop A {
	float: right;
}


/******   VALID BUTTONS   ******/

#validBar{
	margin: 5px 93px 0 0;
}


/******   SIDEBARS   ******/

#lSidebar {
	position: absolute;
	left: 4px;
	top: 180px;
	width: 98px;
	z-index: 200;
}

.lSidebarBox {
	position: relative;
	width: 98px;
	height: 84px;
	margin: 0 0 5px 0;
	z-index: 300;
}

.lSidebarBox IMG {
	margin-top: 2px;
}

#rSidebar {
	position: absolute;
	right: -4px;
	top: 269px;
	width: 97px;
	z-index: 200;
}

.rSidebarBox {
	position: relative;
	width: 97px;
	height: 84px;
	margin: 0 0 5px 0;
	z-index: 300;
}

.rSidebarBox IMG {
	margin-top: 2px;
}

.lSBmonth, .rSBmonth {
	width: 97px;
	height: 10px;
}

/******   CART   ******/

TABLE.product-table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0px;
	margin-bottom:10px;

}

TABLE.product-table TH.price {
	text-align: right;
}

TABLE.product-table TD {
	padding: 2px;
	vertical-align: top;
}

TABLE.product-table TD.articleNum {
	text-align: center;
}

TABLE.product-table TD.articleLabel {
}

TABLE.product-table TD.price {
	text-align: right;
}

TABLE.product-table TD.delete {
	width: 5%;
	text-align: center;
}

DIV#adress {
	padding-top: 20px;
	clear: both;
}

FORM#continueShopping {
	margin-top: 20px;
	float: left;
}

FORM#continueShopping INPUT {
	margin: 3px;
}

DIV.kalenderFormular {
	/*text-align: right;*/
}

FORM#calendarParams DIV.kalenderFormular {
	text-align: left;
}

FORM#calendarParams LABEL {
	margin-top: -4px;
}

INPUT#pin {
	float: left;
}

#continueShopping INPUT {
	/*float: right;*/
}

#buttonOrder {
	float: right;
	clear: both;
}

/******   PAYMENT   ******/

.payoption {
	margin-right: 20px;
	float: left;
}

/***** Help / Manual ****/
.helptitle { color:#048FF6; font-weight:bold; }

/* in shipment.comp */
#shipOption input {margin-left: 170px ; margin-right: 10px;}




/**
* Fuer das Motivlisting und die navigation
*
* auch bei ecards
*/
table.motivListing {
    width: 100%;
}

table.motivListing td {
    width: 170px;
    padding: 0px 0px 5px 0px;
}

div.motivMiniPreviewBox {
    width: 170px;
    height: 136px;
}

img.motivMiniPreviewLupe {
    position: relative;
    left: 156px;
    top: 122px;
}

.action .mleft {
    float: left;
}

.action .mright {
    float: right;
}

/** Bildpersonalisierung /bp/
*/
div.title {
	  font-size: 12px;
	  font-weight:bold;
	  margin-bottom: 10px;
}

div.text { }

#ecardpreview {
   text-align: center;
}

div.bpleft, div.bpright {
  width: 250px;
  text-align: center;
  margin-top: 5px;
  margin-bottom: 10px;
}

div.bpleft {
      float: left;
      }

div.bpright {
      float: right;
    }

div.bp_motiv {
    align: center;
    margin-top:10px;
}

/** von drx fuer calendar_create.js und proof */
       .dropHover {background: #ffc;}

div.line {
    padding: 2px 2px 2px 0px;
    overflow: hidden;
}

div.line .num {
    float: left;
    display: block;
}

div.line input {
    float: left;
    display: block;
}


div.line .loading {
    background: url("/cimages/loader-small.gif") no-repeat;
    padding: 8px;
}

div.barBg {
    width: 40px;
    height: 6px;
    border: 1px solid #cfcfcf;
}

       	 div.line span.status {
           font-size: 9px;
           float: left;
           display: block;
           padding-left: 1em;
         }

            div.line .loading {
               background: url("/cimages/loader-small.gif") no-repeat;
               padding: 8px;
            }

div.barBg div.bar {
    height: 6px;
    background: #393;
}

div.barBg div.err {
    height: 6px;
    background: red;
}

