#formcontainer {
	background-image:url();
	background-color:#F95;
	color:#FFF;
	}
#searchform {
	padding:3%;
}

input[type="checkbox"] {
    display:none;
}

input[type="checkbox"] + label {
    color:#FFFFFF;
}

input[type="checkbox"] + label span {
    display:inline-block;
    width:25px;
    height:25px;
    vertical-align:middle;
    background:url('/assets/images/icons/input.png') top no-repeat;		background-size:contain;
    cursor:pointer;
}

input[type="checkbox"]:checked + label span {
    background:url('/assets/images/icons/input-thick.png') top no-repeat;		background-size:contain;
}

input[type="radio"] {
    display:none;
}

input[type="radio"] + label {
    color:#f2f2f2;
    font-family:Arial, sans-serif;
}

input[type="radio"] + label span {
    display:inline-block;
    width:25px;
    height:25px;
    margin:-2px 10px 0 0;
    vertical-align:middle;
    background:url('/assets/images/icons/input.png') top no-repeat;		background-size:contain;
    cursor:pointer;
}

input[type="radio"]:checked + label span {
    background:url('/assets/images/icons/input-thick.png') top no-repeat contains;
		background-size:contain;
		content="dasda";
}

input[type=range] {
  -webkit-appearance: none; /* Hides the slider so that custom slider can be made */
  width: 100%; /* Specific width is required for Firefox. */
  background: #FFF; /* Otherwise white in Chrome */
	
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
}

input[type=range]:focus {
  outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */
}

input[type=range]::-ms-track {
  width: 100%;
  cursor: pointer;

  /* Hides the slider so custom styles can be added */
  background: transparent; 
  border-color: transparent;
  color: transparent;
  background: #ffffff;
}

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  height: 36px;
  width: 36px;
  border-radius: 100%;
  background: #ffffff;
  cursor: pointer;
  margin-top: -14px; /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
	border:1px solid #FFF;
}

/* All the same stuff for Firefox */
input[type=range]::-moz-range-thumb {
  height: 36px;
  width: 36px;
  border-radius: 36px;
  background: #ffffff;
  cursor: pointer;
	border:1px solid #FFF;
}

/* All the same stuff for IE */
input[type=range]::-ms-thumb {
  height: 36px;
  width: 36px;
  border-radius: 36px;
  background: #ffffff;
  cursor: pointer;
	border:1px solid #FFF;
}


.prodotto {
	padding:5px;
	//border:3px solid #FF8700;
	border:3px solid #2196F3;
	text-align:center;
	margin-bottom:20px;
	border-radius:3px;
	box-shadow:0 0 10px rgba(0,0,0,.2);
}

.prodotto h2 {
	margin-bottom:00px;
	font-size:130%;
	z-index:100;
	position:relative;
	height:1.3em;
	overflow:hidden;
}

.prodotto .thumb {
	display:block;
	height:240px;
	display:block;
	overflow:hidden;
	vertical-align:middle;
	margin-top:5px;
}

.prodotto .thumb img {
	max-width:100%;
	vertical-align:middle;
	
}
.prodotto p {
	color:#666;
	font-size:12px;
	height:4em;
	display:block;
	overflow:hidden;
	
	
}

.tk-half {
	box-sizing:border-box;
	width:46%;
	padding-right:4%;
	display:inline-block;
}

.logo_effect span {
    text-shadow: none !important;
    font-family: 'Russo One', sans-serif;
    font-weight: normal;
		font-size:1em;
    border-radius: .2em;
    display: inline-block;
    background-color: #EF8700;
    color: white;
    margin: .1em;
    padding: .2em;
        padding-left:.2em;
    line-height: 1em;
    width: 1.4em;
    height: 1.4em;
    vertical-align: middle;
    text-align: center;
}
.logo_effect span:empty,.logo_effect span:empty,.logo_effect span:-moz-only-whitespace { 
	background-color:inherit;
	visibility:hidden !important;
}


/*####################################################################
/*  LISTA PRODOTTI   */


	.link  { 
		cursor: pointer;
		
	}
	.link:hover {
  transform:  scale(1.03); /*scale it to a smaller size*/
  transition: all .3s ease-in-out; /*make it smooth*/
	}
	.tk-half {
		display:inline-block; float:left;
		background-color:#2196F3;
		padding:.5% 2% .5% 2%;
		width:50%;
	}
	.tk-half a {
		width:100%;
		display:block;
		padding:1px;
		margin:0px;
		text-align:left;
		padding-left:10px;
		margin-bottom:3px;
		border-radius:3px;
	}
.html5-video-player{
  background-color: #fff;
}
	.tk-half a:hover {
		background-color:#2196F3 !important;
	}
	.tk-half a.selected {
		background-image:url('/images/x.png');
		background-size:20px;
		background-repeat:no-repeat;
		background-position:-30px 3px;
		background-color:white;
		
	}
#iframespacer {
	display:none;
	}
	
@media (max-width: 768px) {
	.video {
		height:276px;
	}
}
@media (min-width: 768px) {
	.video {
		height:424px;
	}
}
@media (min-width: 992px) {
	.video {
		height:550px;
	}
}
@media (min-width: 1200px) {
	.video {
		height:660px;
	}
}
@media (min-width: 1200px) {
	.video {
		max-width:100%;
		width: 100vw; 
    height: 56.20vw;
		position:absolute;
		left:0px;
		border:0px;
		margin:0px;
		padding:0px;
		z-index:255;
		top:60px;
		background-color:#FFF!important;
		max-height:660px;
	}
	#iframespacer {
    height: 56vw;
		display:block;
		max-height:660px;
	}
}

	.prodotto {
		background-color:white;
		}

	.prodotto img {
		width:80%;
		height:auto;
		border-radius:5px;
		border:
	}

	.tk-half a.selected:hover {
		background-position:3px 3px;
		padding-left:25px !important;
	}
	
	


/*####################################################################
/*  SINGOLO PRODOTTO */


#about-section {
	padding-top:20px;
}
	#banner {
		background-position:center 60px !important;
		background-size: contain;
		max-height:30vw;
		
		height:100vw;
		box-sizing:content-box;
		background-color:#FFF;
	}
	#banner .container {
		max-width:95%;
	}
	#panel_controls a {
		display:inline-block;
		padding:1%;
		font-size:1em;
		color:white;
		background-color:#DDEFFE;
		margin:0px;
		text-transform:uppercase;
	} 
	.title h1 span {
		font-size:calc(4px + 1.5vw) !important;
		text-shadow:none !important;
		font-family: 'Russo One', sans-serif;
		font-weight:normal;
		border-radius:.3em;
		display:inline-block;
		background-color: #EF8700;
		color: white;
		margin:.2em;
		padding:.1em;
		padding-left:.1em;
		font-size:4em;
		line-height:2em;
		width:2em;
		height:2em;
		vertical-align:middle;
		text-align:center;
		
		}
	#panel_controls .selected {
		background-color:#2196F3;
	}
 	#toggle_panel {
		display:block;
		padding:1%;
		font-size:1em;
		color:white;
		background-color:#2196F3;
		margin:0px;
	}
	.internal_panel {
		background-color:white;
		padding:5px;
	}
	.specifiche th {
			background-color:#2196F3;
			padding-bottom:0px;
			padding-top:10px;
	 }
	.specifiche td {
			background-color:#FFF;
			color:#555;
			padding:2px;
			font-size:80%;
			border:1px solid #DDEFFE;
			text-align:center;
	 }
	.specifiche tr:nth-child(odd) td {  
		background-color:#B7DEFF;
	}
	.specifiche tr:nth-child(even) td {  
		background-color:#DDEFFE;
	}
	.specifiche tr td:nth-child(1) {  
  	text-align:right;
		font-weight:bold;
		white-space:nowrap;
		width:150px;
		padding:2px;
		padding-right:5px;
		//background-color:#FFDEBF;
	}
	
	
	
	.product-gallery {
		text-align:justify;
		font-size:80%;
	}
	.product-gallery:after{content:""; display: inline-block; width: 100%; height: 0;}

	.product-gallery .thumb {
		display:inline-block;
		clear:none;
		width:30%;
		border:1px solid white;
		border-radius:5px;
		
		margin-bottom:1%;
		background-color:white;
		margin:1%;
	}
	.product-gallery .thumb img {
		width:100%;
		background-size:contain;
		background-repeat:no-repeat;
		background-position:center center;
	}