@import url(https://fonts.googleapis.com/css?family=Merriweather:400,700italic,700,400italic);
@import url(https://fonts.googleapis.com/css?family=Oswald:400,300,700);
nav li a {
	font-family: 'Oswald', sans-serif;
	color: #000000;
}
p{font-family: 'Oswald', sans-serif; font-weight:300; font-size:14px; line-height:25px;}
.navbar-toggle {
	position: relative;
	float: right;
	padding: 9px 10px;
	margin-top: 20px;
	margin-right: 5px;
	margin-bottom: 15px;
	background-color: #CFCFCF;
	background-image: none;
	border: 1px solid transparent;
	border-radius: 0px;
}
.navbar-brand {
	float: left;
	height: 80px;
	padding: 5px 5px 5px 5px;
	font-size: 14px;
	line-height: 20px;
}
.navbar-nav > li > a {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px;
	margin-top:18px;
}
.icon-bar {
	background-color: #000000;
}
.nav > li > a:hover {
	text-decoration: none;
	background-color: #fff;
	text-decoration: underline;
	color: #2E2E2E;
}
.categoryname {
	position: absolute;
	display: block;
	bottom: 50px;
	color: #000;
	cursor: pointer;
}
.categoryname:hover {

	color: #666;
}
.number {
	font-family: 'Oswald', sans-serif;
	font-size: 18px;
	margin: 0px;
	padding: 0px;
	width:100px;
}
.category-prod {
	font-family: 'Merriweather', serif;
	font-weight: 400;
	font-style: italic;
	font-size: 16px;
	margin: 0px;
	padding: 0px;
		width:150px;

}
.track{ margin-top:4px; border-top:1px dotted #000000;}

footer a { 	font-family: 'Oswald', sans-serif;
 color:#000000; font-size:12px; }
footer a:hover { color:#666; }

footer ul {
    list-style-type: none;
    padding: 0;
    overflow: hidden;

}

footer li {
    float: left;
	text-align:right;
}

footer li a {
    display: block;
    text-align: right;
    padding: 14px 10px;
    text-decoration: none;
}

footer li a:hover {
    display: block;
    text-align: right;
    padding: 14px 10px;
  	text-decoration: underline;
	color: #2E2E2E;

}

.nome-prod {
	font-family: 'Merriweather', serif;
	font-weight: 400;
	font-style: italic;
	font-size: 17px;
	margin: 0px;
	padding: 0px;

}
.casco { width: 287px; height:279px; display:block; background-image: url(../images/prodotti/CascoCafeRace.png);} 

.casco:hover { background-image: url(../images/prodotti/CascoCafeRaceVisiera.png);
width: 287px; height:279px;  
 }
 
 .casco116858 { width: 233px; height:229px; display:block; background-image:url(../images/prodotti/casco_116858.png); 
 } 

.casco116858:hover { background-image: url(../images/prodotti/casco_116858_visiera.png);
width: 233px; height:229px;  
 }
 
 
  .casco116867{ width: 233px; height:229px; display:block; background-image:url(../images/prodotti/casco_116867.png); 
 } 

.casco116867:hover { background-image: url(../images/prodotti/casco_116867_visiera.png);
width: 233px; height:229px;  
 }


  .casco116880{ width: 233px; height:229px; display:block; background-image:url(../images/prodotti/casco_116880.png); 
 } 

.casco116880:hover { background-image: url(../images/prodotti/casco_116880_visiera.png);
width: 233px; height:229px;  
 }
.desc{ width:200px; 	font-family: 'Oswald', sans-serif;
	font-size: 14px; }
	
.desc-jacket{ width:200px; 	font-family: 'Oswald', sans-serif;
	font-size: 14px; color:#000000; }

.jacket1 { width:240px; height:410px; background:url(../images/jacketNera.png) no-repeat; display:block; }
.jacket2 { width:296px; height:410px; background:url(../images/jacketMarrone.png) no-repeat; display:block;}

.fashion1 { width:416px; height:314px; background:url(../images/shirt-pack.png) no-repeat; display:block; }
.fashion2 { width:416px; height:314px; background:url(../images/shirt-pack2.png) no-repeat; display:block; }
.fashion3 { width:416px; height:314px; background:url(../images/shirt-pack3.png) no-repeat; display:block;}
.fashion4 { width:416PX; height:314px; background:url(../images/t-shirt4.png) no-repeat; display:block;}

.felpa1 { width:366px; height:344px; background:url(../images/felpa.png) no-repeat; display:block;}
.felpa2 { width:366PX; height:344px; background:url(../images/felpaC.png) no-repeat; display:block;}

.gloves1 { width:305px; height:288px; background:url(../images/Gloves.png) no-repeat; display:block; }
.gloves2 { width:305px; height:288px; background:url(../images/Gloves2.png) no-repeat; display:block;}


.slider{
	display:block;
	position: relative;
	margin: auto;
	width: auto;
	max-width: 1095px;
	max-height: 410px;
	overflow: hidden;
}
.slider ul{
	display: flex;
	padding: 0;
	width: 400%;

	animation: cambio 20s infinite alternate;
}
.slider li{
	width: 100%;
	list-style: none;
}
.slider img{
	width: 100%;
}

@keyframes cambio {
	0% {margin-left: 0;}
	20% {margin-left: 0;}

	25% {margin-left: -100%;}
	45% {margin-left: -100%;}

	50% {margin-left: -200%;}
	70% {margin-left: -200%;}

	75% {margin-left: -300%;}
	100% {margin-left: -300%;}
}

.slider-resp{
	display:block;
	position: relative;
	margin: auto;
	width: auto;
	max-width: 1095px;
	max-height: 410px;
	overflow: hidden;
}
.boton{
	position: absolute;
	display: block;
	bottom: 30px;
	margin:0;
	padding: 0;
	z-index: 999;
	cursor: pointer;
	opacity: 0;
}
.boton:nth-child(1){
	left:30px;
}
.boton:nth-child(3){
	left:60px;
}
.slider-resp label{
	position: absolute;
	bottom: 30px;
	width: 12px;
	height: 12px;
	background: rgba (50,50,50,.5);
	border-radius: 7px;
	z-index: 100;
	border: 1px solid #777
}
.slider-resp label:nth-child(2) {
	left: 30px;
}
.slider-resp label:nth-child(4) {
	left: 60px;
}
.boton:checked + label{
	background: rgba (0,0,0,.6);
	border-color: #eee;
}
.contenedor-img img{
	display: block;
	float: right;

}
.dos-imagenes {
	width: 200%;
}
.dos-imagenes img {
	width: 50%;

}
.contenedor-img{
	position: relative;
	left: 0;
	transition: left .3s ease;
	-moz-transition: left .3s ease;
	-o-transition: left .3s ease;
	-webkit-transition: left .3s ease;


}
.boton:nth-child(1):checked ~ .contenedor-img{
	left:0;
	animation: fade 10s 5s;
}
.boton:nth-child(3):checked ~ .contenedor-img{
	left:-100%;
	animation: fade 10s 5s;
}
footer{ padding-left:30px; padding-right:20px; padding-top:10px;}
@keyframes fade{
	50% {margin-left: -100%;}
	100% {margin-left: 0%;}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px){
	.number {
	font-size: 14px;
}
.category-prod {
	font-size: 10px;
}
.viewport {
	width:100%;
	height:500px;
}
}
@media only screen and (min-device-width: 300px) and (max-device-width: 768px){
footer a { 	font-family: 'Oswald', sans-serif;
 color:#000000; font-size:12px; }
footer a:hover { color:#666; }

footer ul {
    list-style-type: none;
    padding: 0;
    overflow: hidden;

}
footer{ padding-left:0px; padding-right:0px; padding-top:10px;}
footer li {
    float: left;
	text-align:right;
}

footer li a {
    display: block;
    text-align: right;
    padding: 5px 5px;
    text-decoration: none;
}

footer li a:hover {
    display: block;
    text-align: right;
    padding: 5px 5px;
  	text-decoration: underline;
	color: #2E2E2E;

}
	}