/* BUTTONS AND ICONS  V1.4*/

/*****************************

1 HREF BUTTONS
	1.1 SMALL HREF BUTTONS
	1.2 LARGE HREF BUTTONS
	1.3 XTRA LARGE HREF BUTTONS
	
2 SEPERATED BUTTONS FOR ALL LAYOUTS

3 REQUIRED BUTTON STYLES
	3.1 REQUIRED SMALL BUTTON
	3.2 REQUIRED LARGE BUTTON
	3.3 REQUIRED XTRA LARGE BUTTON
	
4 HREF ICONS

*****************************/


/*-- 1 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;
}

	
	/*-- 1.1 SMALL HREF BUTTONS --*/
	
	.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; }

	
	/*-- 1.2 LARGE HREF BUTTONS --*/
	
	.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; }
	
	
	.contact { font-size: 12px; }
	
	.contact span, .contact i { height: 20px; line-height: 19px; }
	
	.contact span { background-position: 0px -2144px;  }
	
	.contact i { padding-right: 17px; background-position: 100% -2164px; }
	
	.contact.simple i { padding-right: 7px; background-position: 100% -2184px; }
	
	.contact:hover span { background-position: 0 -2204px; }
	
	.contact:hover i { background-position: 100% -2224px; }
	
	.contact.simple:hover i { background-position: 100% -2244px; }
	
	
	/*-- 1.3 XTRA LARGE HREF BUTTONS --*/
	
	.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; }




/*-- 2 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; }




/*-- 3 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;
}

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


	/*-- 3.1 REQUIRED SMALL BUTTON --*/	
	
	.smallBtn {
	    padding-right: 16px;
	    font-size: 11px;
	    background: transparent url(../img/css/buttons.png) no-repeat right -2080px;
	}
	
	.smallBtn span {
	    padding-left: 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; }


	/*-- 3.2 REQUIRED LARGE BUTTON --*/	
	
	.largeBtn {
	    padding-right: 20px;
	    font-size: 12px;
	    height: 20px;
	    background: transparent url(../img/css/buttons.png) no-repeat right -1910px;
	}
	
	.largeBtn span {
	    padding-left: 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; }
	

	/*-- 3.3 REQUIRED XTRA LARGE BUTTON --*/
	
	.xlargeBtn {
	    padding-right: 22px;
	    font-size: 16px;
	    background: transparent url(../img/css/buttons.png) no-repeat right -1720px;
	}
	
	.xlargeBtn span {
	    padding-left: 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 -245px;
		width: 32px;
	}
    
    .btnSearch {
		background-position:right -285px;
		padding:0 13px 0 0;
	}


    
    .btnSearch:hover span, .btnSearch:focus span { background-position: left -305px; }
    
    .btnSearch:hover, .btnSearch:focus { background-position: right -345px; }
    
    .btnFit span { background-position: left -245px; padding: 0 2px 0 6px;}
    
    .btnFit {
        background-position:  right -265px;
        padding: 0 13px 0 0;
        
    }
    
    .btnFit:hover span, .btnFit:focus span { background-position: left -305px; }
    
    .btnFit:hover, .btnFit:focus { background-position: right -325px; }
	

/*-- 4 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: 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; }

.true, .false {
    background-position: -120px -60px;
    height: 10px;
    padding-left: 10px;
}

.false { background-position: -350px -60px; }

.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 -90px; height:16px!important; }
/*
.home:hover{ background-position: -270px -90px; height:16px!important;}
*/

.video {
	background-color: #fff;
	background-position: -320px -120px;
	bottom: 5px;
	height: 46px;
	position: absolute;
	right: 2px;
	width: 27px;
}

.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-right: 23px;
}
