

/* BUTTONS AND ICONS  V1.4*/
/* HREF BUTTONS */
.button { 
 font-weight: bold; 
 color: #fff !important;
 text-decoration: none;
 font-family: 'Trebuchet MS', sans-serif;
 font-size: 10px;
 overflow: hidden;
 cursor: pointer;
 background: none;
 border: none;
 padding: 0;
 margin: 0;
 display:inline-block;

 
}

.button:hover {
 color: #999;
 text-decoration: none;
}

.button span, .button i {
 background: transparent url(../img/css/buttons.png) no-repeat 0 0;
 height: 16px;
 line-height: 15px;
 float: left;
}


/*small*/
.button span { padding: 0 3px 0 10px; background-position: 0 -125px; }
.button i { padding: 0 13px 0 0; background-position: 100% -145px; }
.simple i { padding-right: 7px; background-position: 100% -165px; }
.button:hover span { background-position: 0 -185px; }
.button:hover i { background-position: 100% -205px; }
.simple:hover i { background-position: 100% -225px; }


/*large*/
.large { font-size: 12px; }
.large span, .large i { height: 20px; line-height: 19px; }
.large span { background-position: 0 0px; }
.large i { padding-right: 17px; background-position: 100% -20px; }
.large.simple i { padding-right: 7px; background-position: 100% -40px; }
.large:hover span { background-position: 0 -60px; }
.large:hover i { background-position: 100% -80px; }
.large.simple:hover i { background-position: 100% -100px; }

/*Xtra large*/

.xlarge { font-size: 12px; }
.xlarge span, .xlarge i { height: 25px; line-height: 25px; }
.xlarge span { background-position: 0 0px; }
.xlarge i { padding-right: 17px; background-position: 100% -1210px; }
.xlarge.simple i { padding-right: 7px; background-position: 100% -1235px; }
.xlarge:hover span { background-position: 0 -1260px; }
.xlarge:hover i { background-position: 100% -1285px; }
.xlarge.simple:hover i { background-position: 100% -1310px; }


/* Seperated buttons for all layouts*/
.btnTopNavigation span { background-position: 0 -245px; }
.btnTopNavigation i { background-position: 100% -265px; }
.btnTopNavigation.simple i { background-position: 100% -285px; }
.btnTopNavigation:hover span { background-position: 0 -305px; }
.btnTopNavigation:hover i { background-position: 100% -325px; }
.btnTopNavigation.simple:hover i { background-position: 100% -345px; }

.btnShoppingCart span { background-position: 0 -365px; }
.btnShoppingCart i { background-position: 100% -385px; }
.btnShoppingCart.simple i { background-position: 100% -405px; }
.btnShoppingCart:hover span { background-position: 0 -425px; }
.btnShoppingCart:hover i { background-position: 100% -445px; }
.btnShoppingCart.simple:hover i { background-position: 100% -465px; }

.btnActiveSubNav span { background-position: 0 -485px; }
.btnActiveSubNav i { background-position: 100% -505px; }
.btnActiveSubNav.simple i { background-position: 100% -525px; }
.btnActiveSubNav:hover span { background-position: 0 -545px; }
.btnActiveSubNav:hover i { background-position: 100% -565px; }
.btnActiveSubNav.simple:hover i { background-position: 100% -585px; }

.btnPaginationNext span { background-position: 0 -605px; }
.btnPaginationNext i { background-position: 100% -625px; }
.btnPaginationNext.simple i { background-position: 100% -645px; }
.btnPaginationNext:hover span { background-position: 0 -665px; }
.btnPaginationNext:hover i { background-position: 100% -685px; }
.btnPaginationNext.simple:hover i { background-position: 100% -705px; }

.btnPaginationPrev span { background-position: 0 -725px; padding:0 0 0 17px!important;  }
.btnPaginationPrev i { background-position: 100% -745px;  }
.btnPaginationPrev.simple i { background-position: 100% -765px; }
.btnPaginationPrev:hover span { background-position: 0 -785px; }
.btnPaginationPrev:hover i { background-position: 100% -805px; }
.btnPaginationPrev.simple:hover i { background-position: 100% -825px; }

.btnPromo span { background-position: 0 -845px; }
.btnPromo i { background-position: 100% -865px; }
.btnPromo.simple i { background-position: 100% -885px; }
.btnPromo:hover span { background-position: 0 -905px; }
.btnPromo:hover i { background-position: 100% -925px; }
.btnPromo.simple:hover i { background-position: 100% -945px; }

.btnZoom span { background-position: 0 -965px; }
.btnZoom i { background-position: 100% -985px; }
.btnZoom.simple i { background-position: 100% -1005px; }
.btnZoom:hover span { background-position: 0 -1025px; }
.btnZoom:hover i { background-position: 100% -1045px; }
.btnZoom.simple:hover i { background-position: 100% -1065px; }

.btnContinue span { background-position: 0 -1100px; }
.btnContinue i { background-position: 100% -1120px; }
.btnContinue.simple i { background-position: 100% -1140px; }
.btnContinue:hover span { background-position: 0 -1160px; }
.btnContinue:hover i { background-position: 100% -1180px; }
.btnContinue.simple:hover i { background-position: 100% -1200px; }

.btnCheckoutNext span { background-position: 0 -1230px; }
.btnCheckoutNext i { background-position: 100% -1260px; }
.btnCheckoutNext:hover span { background-position: 0 -1290px; }
.btnCheckoutNext:hover i { background-position: 100% -1320px; }

.btnCheckoutPrev span { background-position: 0 -1360px; padding:0 0 0 20px!important; }
.btnCheckoutPrev i { background-position: 100% -1390px; }
.btnCheckoutPrev:hover span { background-position: 0 -1420px; }
.btnCheckoutPrev:hover i { background-position: 100% -1450px; }

.btnCollection span { background-position: 0 -1480px; }
.btnCollection i { background-position: 100% -1500px; }
.btnCollection.simple i { background-position: 100% -1520px; }
.btnCollection:hover span { background-position: 0 -1540px; }
.btnCollection:hover i { background-position: 100% -1560px; }
.btnCollection.simple:hover i { background-position: 100% -1580px; }

.btnShare span { background-position: 0 -1610px; }
.btnShare i { background-position: 100% -1630px; }
.btnShare:hover span { background-position: 0 -1650px; }
.btnShare:hover i { background-position: 100% -1670px; }

.btnOrder span { background-position: 0 -1810px; }
.btnOrder i { background-position: 100% -1830px; }
.btnOrder:hover span { background-position: 0 -1850px; }
.btnOrder:hover i { background-position: 100% -1870px; }



/* REQUIRED BUTTON STYLES: */		
button { position: relative; border: 0; padding: 0; cursor: pointer; overflow: visible; /* removes extra side padding in IE */ }
button::-moz-focus-inner { border: none;  /* overrides extra padding in Firefox */ }
button span { position: relative; display: block; white-space: nowrap;	 }

@media screen and (-webkit-min-device-pixel-ratio:0) {
	/* Safari and Google Chrome only - fix margins */
	button span {
		margin-top: -1px;
	}
}


/* Small button */
.smallBtn{  padding: 0 16px 0 0; font-size:11px; background: transparent url(../img/css/buttons.png) no-repeat right -2080px; }
.smallBtn span{ padding: 0 0 0 10px; height:16px; line-height:16px; background: transparent url(../img/css/buttons.png) no-repeat left -2060px; color:#fff; }	
.smallBtn:hover, .smallBtnHover{ background-position: right -2120px; }
.smallBtn:hover span, .smallBtnHover span { background-position: 0 -2100px; }

/* Large button */
.largeBtn{  padding: 0 20px 0 0; font-size:12px; height:20px; background: transparent url(../img/css/buttons.png) no-repeat right -1910px; }
.largeBtn span{ padding: 0 0 0 10px; height:20px; line-height:20px; background: transparent url(../img/css/buttons.png) no-repeat left -1890px; color:#fff; }	
.largeBtn:hover, .largeBtnHover{ background-position: right -1950px; }
.largeBtn:hover span, .largeBtnHover span { background-position: 0 -1930px; }

/* XLarge button */
.xlargeBtn{  padding: 0 22px 0 0; font-size:16px; background: transparent url(../img/css/buttons.png) no-repeat right -1720px; }
.xlargeBtn span{ padding: 0 0 0 10px; height:25px; line-height:25px; background: transparent url(../img/css/buttons.png) no-repeat left -1690px; color:#fff; }	
.xlargeBtn:hover, .xlargeBtnHover{ background-position: right -1780px; }
.xlargeBtn:hover span, .xlargeBtnHover span { background-position: 0 -1750px; }


.btnSearch span{ background-position: left -1980px;  }
.btnSearch { background-position: right -2000px; padding: 0 6px 0 0; }
.btnSearch:hover span, .btnSearch:focus span { background-position: left -2020px; }
.btnSearch:hover, .btnSearch:focus { background-position: right -2040px; }






/* HREF ICONS */

.icon {
 font-size: 12px;
 padding-left: 21px;
 width: 0;
 height: 21px;
 font-weight: bold;
 text-decoration: none;
 background: transparent url(../img/css/iconen.png) no-repeat 0 0;
 overflow: hidden;
 display: inline-block;
 text-indent:-9999em;
}


.viewSelect{
 font-size: 12px;
 width: 36px;
 height: 16px;
 font-weight: bold;
 text-decoration: none;
 background: transparent url(../img/css/iconen.png) no-repeat 0 0;
 overflow: hidden;
 display: inline-block;
 text-indent:-9999em;
}

.collectionView{ background-position: -60px -60px; }
.scrollView { background-position: -60px -90px; }

.close { background-position: -345px 5px; }
.close:hover { background-position: -345px -25px; }
.large.close { background-position: -180px 0; }
.large.close:hover { background-position: -180px -30px; }
.light.large.close { background-position: -180px -60px; }
.light.large.close:hover { background-position: -180px 0 }


.refresh { background-position: -380px 0; }
.refresh:hover { background-position: -380px -30px; }
.crop { background-position: 0 0; }
.crop:hover { background-position: 0 -30px; }
.jump { background-position: -316px 4px; }
.jump:hover { background-position: -316px -26px; }
.plus { background-position: -275px 5px; }
.plus:hover { background-position: -275px -25px; }
.pencil { background-position: -25px 4px; }
.pencil:hover { background-position: -25px -26px; }
.back { background-position: -58px 2px; }
.back:hover { background-position: -58px -28px; }
.forward { background-position: -88px 2px; }
.forward:hover { background-position: -88px -28px; }
.back.arrow { background-position: -115px 5px; }
.back.arrow:hover { background-position: -115px -25px; }
.forward.arrow { background-position: -145px 5px; }
.forward.arrow:hover { background-position: -145px -25px; }
.small.back { background-position: -214px 6px; }
.small.back:hover { background-position: -214px -24px; }
.small.forward { background-position: -244px 6px; }
.small.forward:hover { background-position: -244px -24px; }
.add{ background-position: 0px -60px; }
.add:hover { background-position: 0px -90px;  }
.subtract{ background-position: -30px -60px; }
.subtract:hover { background-position: -30px -90px; }


.pdf{ background-position: -210px -60px; height:16px!important;}
.pdf:hover{ background-position: -210px -90px; height:16px!important;}
.print{ background-position: -240px -60px; height:16px!important;}
.print:hover{ background-position: -240px -90px; height:16px!important;}
.home{ background-position: -270px -60px; height:16px!important;}
.home:hover{ background-position: -270px -90px; height:16px!important;}

.roundedPrev { background-position: -27px -85px;}
.roundedPrev:hover { background-position: 3px -85px; }
.roundedNext { background-position: -57px -85px; }
.roundedNext:hover { background-position: -87px -85px;}


.arrow { color: #FF790B; background: url(../img/css/arrows.png) no-repeat 100% -16px; padding: 0 23px 0 0;}



