/* long titles sometimes hide behind riders */

.riders, .pageriders {
filter:alpha(opacity=80); -moz-opacity: 0.8; opacity: 0.8;
}







/* shop layout -------------------------------------------- */



IMG.picture_large {
  border: 0px solid #ddd;
  background-color: white;
  padding: 5px;
  float: right;
}


IMG.picture_small {
  border: 0px solid #ddd;
  padding: 0;
  float: none;
  vertical-align: bottom;

}




DIV.shopdetails DIV.description{
  width: 300px;
  margin-top: 20px;
  margin-bottom: 20px;
}


DIV.subdetails {
  position: relative;
  height: 100px;
  width: 250px;
  margin-bottom: 10px;
}


DIV.subdetails DIV.text, DIV.details DIV.text {
  float: left;
  position: relative;
  bottom: 75px;
  left: 110px;
  width: 290px;
  border-top: 1px solid #DDD;
  border-bottom: 1px solid #DDD;
  padding: 5px 0px ;

}

DIV.details DIV.text  {
  bottom: 0;
  left: 0;
}

DIV.subdetails DIV.image {
  width: 100px; height: 100px;
}



/* 

INPUT.amountfield {
  width: 30px;
  border: 1px inset #CCC;
  height: 20px;
  padding: 0;
  text-align: center;
  nofloat: right;
  margin-top: 6px;
}


*/


/* 
A.addtocart {
   nomargin: 7px;
} 

INPUT.amountfield:focus {
  background-color: #f1f1f1;
}



TABLE.cart {
   border-collapse: collapse;
   width: 100%;
   margin-top: 30px;
} 

TABLE.cart TR TH {
  text-align: left;
}

TABLE.cart TR TD {
  vertical-align: top;
}

TABLE.cart TR.product TD {
  border-bottom: 1px solid #CCC;
}

TABLE.cart TR.product TD:nth-child(1) {
  border-bottom: none;
  padding-right: 5px;
}


TABLE.cart TR.header TH {
  border-bottom: 1px solid #CCC;
  font-size: 9px;
}

TABLE.cart TR TD.price, TABLE.cart TR TH.price {
  text-align: right;
  white-space: nowrap;
}

TABLE.cart TR TD.center, TABLE.cart TR TH.center {
  text-align: center;
}

TABLE.cart INPUT.cartamount {
  width: 30px;
  border: 1px inset #CCC;
  height: 20px;
  padding: 0;
  text-align: center;
}

TR.total TD {
  font-weight: bold;
  border-top: 1px solid #CCC;
  border-bottom: 2px solid #CCC;
}

DIV.methods, DIV.orderinfo, DIV.orderhistory {
  margin-top: 25px;
  border: 1px solid #CCC;
  padding: 8px;
  height: 90px;
  float: left;
  width: 160px;
}

DIV.orderinfo {
  width: 320px;
  height: 150px;
}

DIV.orderhistory {
  width: 720px;
  height: auto !important;
}

DIV.separator {
  width: 20px; height: 10px;
  float: left;
}

DIV.rightfloat {
  float: right;
}

DIV.actionrequired {
  background-color: orange;
  border: 1px solid red;
}

DIV.methods H3 , DIV.address H3, DIV.orderinfo H3, DIV.orderhistory H3 {
  nofont-size: 9px;
  position: relative;
  margin-top: -22px;
  margin-left: -7px;
  border: 0;
  line-height: 11px;
  height: 11px;
  font-weight: bold;
  color: black;
}

DIV.methods A.editbutton , DIV.address A.editbutton {
  float: right;  
  position: relative;
  top: -27px;
  left: 8px;
}

A.editbutton IMG {
  border: 0;
}

A.ccstarter {
  border: 1px outset #CCC;
  text-align: center;
  margin: 5px 10px;
  padding: 2px;
  display: block;
  background-color: #FFFFCC;
}

A.ccstarter IMG {
  border: 0;
}

A.ccstarter:hover {
  background-color: #FFFF55;
}

DIV.address {
  margin-top: 25px;
  border: 1px solid #CCC;
  padding: 8px;
  height: 90px;
  float: right;
  width: 300px;
}

DIV.address H3 {
  font-size: 9px;
  position: relative;
  margin-top: -22px;
  margin-left: -7px;
}

DIV.address A {
  text-decoration: underline;
}

#pageorderadmin {
  right: 5px;
  top: 5px;
  background-color: white;
  width: 92px;
  height: 92px;
  text-align: center;
  position: absolute;
  background: url(/localmedia/cartbackground.gif) top left no-repeat; 
  font-size: 10px;
  border: 1px solid green;
  z-index: 1000;  /* to prevent status (999) from triggering mouseleave */
}

#pageorderadmin {
  left: 50%;
}

#pageorderadmin DIV.inner {
  padding: 10px;
  padding-top: 20px;
}

#pageorderadmin H4 {
  font-size: 12px;
  border: none;
  margin: 0;
}




div.shoppingpage.itemlist {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 170px));
  grid-column-gap: 30px;
  grid-row-gap: 30px;

}


DIV.rootlistitem {
  width: 100%;
  height: 150px;
  margin-right: 30px;
  margin-bottom: 30px;
  text-align:center;
  border: 1px solid #DDD;
  position: relative;
  background-size: cover;
  border-radius: 8px;
}

DIV.rootlistitem A {
  display: block;
  width: 100%;
  height: 150px;
}

/* 

DIV.rootlistitem {
  width: 150px;
  height: 150px;
  margin-right: 30px;
  margin-bottom: 30px;
  text-align:center;
  border: 1px solid #DDD;
  position: relative;
}

DIV.rootlistitem A {
  display: block;
  width: 150px;
  height: 150px;
}

DIV.rootlistitem A SPAN.title {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 150px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  font-size: 15px;
  color: #333;
  z-index: 999;
}

DIV.rootlistitem A DIV.title {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 150px;
  height: 25px;
  background-color: #CCC;
  filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5;
}

DIV.rootlistitem A:hover DIV.title {
  color: #333;
  background-color: white;
  filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5;
}
*/ 

DIV.breadcrumbs {
  border: 1px solid #EEE;
  padding: 5px;
  margin-top: -16px;
}




DIV.rightdocuments {
  width: 180px;
  float: right;
  border: 1px solid #DDD;
  padding: 20px;
  margin-left: 20px;
  margin-bottom: 20px;
}


SPAN.vat {
   font-size: 7px;
   vertical-align: super;
   line-height: 7px;
}




#buttons {
  text-align: center;
}

#saferpay {
  width: 580px;
  height: 400px;
}


TABLE.history {
  border-collapse: collapse;  
}

TABLE.history TD.text {
  vertical-align: top;
  border-bottom: 1px solid #DDD;
}

TABLE.history TD.date  {
  width: 150px;
  vertical-align: top;
  font-size: 9px;
  color: #AAA;
  border-bottom: 1px solid #DDD;
}


DIV.pagebuttons {
  position: relative;
  top: -7px;
}

#footer {
  border: none;
  border-top: 1px solid #DDD;
}

SPAN.addressfooter {
  height: 20px;
}


#rightgallery {
  width: 370px;
  float: right;
  margin-left: 15px;
}

DIV.thumbnail, DIV.squarethumbnail {
  float: left;
  width: 176px;
  height: 123px;
  position: relative;
}

DIV.squarethumbnail {
  height: 176px;
}

DIV.thumbnail A {
  border: 1px solid #ccc;
  display: block;
}

DIV.thumbnail IMG {
  border: 3px solid #FFF;
}

DIV.thumbnail DIV.description {
  padding: 10px;
  position: absolute;
  bottom: 5px;
  font-size: 0.85rem;;
  width: 160px;
}

DIV.thumbnail DIV.description SPAN.title {
  display: block;
  font-weight: bold;
}

DIV.shadow, DIV.floatshadow {
  background: url(/localmedia/thumbnailshader.gif) top left no-repeat;
  padding-left: 8px;
}

DIV.floatshadow {
  float: left;
}

DIV.team DIV.shadow {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
}

DIV.teammember, DIV.teamgroup, DIV.imageborder {
  border: 1px solid #ccc;
  padding: 3px;
  text-align: center;
}


DIV.teammember IMG {
  display: block;
  width: 150px;
  margin-bottom: 4px;
}

DIV.teamgroup IMG {
  margin-bottom: 4px;
  width: 330px;
}

DIV.admin {
  width: 355px;
  float: left;
  height: 600px;
}

DIV.teamright {
  width: 355px;
  float: right;
}

DIV.leftimage {
  float: left;
}

DIV.righttext {
  float: right;
  width: 300px;
}

/* 
DIV.vcards DIV.shadow {
  float: left;
}

DIV.vcards H3 {
  clear: both;
}

DIV.vcard {
  border: 1px solid #ccc;
  padding: 8px;
  width: 210px;
  height: 160px;
  overflow: hidden;
  white-space: nowrap;
  background: url(/files/picts/vcardbg.jpg) top right no-repeat;
}

DIV.vcard LABEL, LABEL.inline {
  float: none;
  margin: 0;
  padding: 0;
  width: 45px;
  text-align: left;
  font-size: 0.8em;
  color: #AAA;
  display: inline-block;
}
*/

DIV.widget {
  float: left;
  width: 180px;
  min-height: 180px;
  border: 1px solid #CCC;
  padding: 8px;
}

DIV.widget H3 {
  margin: 0; margin-bottom: 10px;
}

DIV.shadow {
  float: left;
}

UL.orderlist {
  list-style: none;
  margin: 0;
  padding: 0;
}

UL.orderlist LI {
   margin-bottom: 6px;
}

UL.orderlist LI SPAN.date {
  font-size: 9px;
}

TABLE.data {
}

TABLE.data TD {

}


#fbbreadcrumb {
  float: right;
  margin-top: -3px;
  text-align: right;
}

#fbbreadcrumb iframe {
  text-align: right;
  float: right;
}


DIV.team IMG.mailicon {
  width: 16px;
  height: 16px;
  display: inline;
  position: absolute;
  margin-left: 5px;
}

SPAN.lostpw {
  display: block;
  font-size: 9px;
  margin-top: 15px;

}



a.highlight {
  text-decoration: underline;
  font-weight: bold;
  nocolor: darkblue;
}



div.stats table td.right, div.stats table th.right {
   width: 80px;
}

th.right {
  text-align: right !important;
}



table.syslog col.date {
   width: 120px;
}

table.syslog col.user {
  width: 200px;
}




div.form label {
    display: block;
    width: 110px;
    float: left;
    text-align: right;
    margin-top: 2px;
    text-transform: capitalize;
    overflow: hidden;
    white-space: nowrap;
    clear: both;
}


div.form div.field {
   display: inline-block;
   float: left;
}