@media screen and (max-width: 1400px) {
}
@media screen and (max-width: 1024px) {

h1 {
	position:relative;
	float:left;
	width: 100%;
	height:auto;
	margin: 10px auto 30px auto;
	text-align:left;
	font-family:'Bodoni';
	color: #333;
	font-size: 30px;
	font-weight:500;
	line-height:30px;
}
h2 {
	position:relative;
	float:left;
	width: 100%;
	height:auto;
	margin: 10px auto 30px auto;
	text-align:center;
	font-family:'Bodoni';
	color: #333;
	font-size: 30px;
	font-weight:500;
	line-height:30px;
}
#logos-wrap {
	position:relative;
	float:left;
	width:60%;
	height:auto;
	margin: 0px 0 0 0;
}
#logos-wrap img{
	max-width:100%;
}
.artlegno-logo {
	position:relative;
	float:left;
	top:25px;
	display:inline-block;
	margin:0px 0 0 0;
	width:100px;
	height:auto;	
	border-right:solid 1px #666;
	padding:0 30px 0 0;
}
.carlomagno-logo {
	position:relative;
	float:left;
	display:inline-block;
	margin:0px 0 0 20px;
	width:100px;
	height:auto;	
}
#slider {
	position:relative;
	float:left;
	width: 100%;
	height: auto;
	margin:0px 0 20px 0;
}     
#slider img{
	max-width: 100%;
} 
}
@media screen and (max-width: 850px) {


.index-logo-artlegno {
	position:absolute;
	top:40%;
	left: 50%;
	transform: translateX(-50%);
}
.index-logo-carlomagno {
	position:absolute;
	top:30%;
	left: 50%;
	transform: translateX(-50%);
}
.index-image-left {
	position:relative;
	display:block;
	vertical-align:bottom;
	float:left;
	width:100%;
	height:auto;
	margin:20px 0 0 0;	
}
.index-image-right {
	position:relative;
	display:block;
	float:left;
	width:100%;
	height:auto;
	margin:20px 0 0 0;	
}
.overlay {
    position:relative;
    width:100%;
    height:100%;
}
.overlay img {
    width:100%;
    vertical-align:top;
}
.overlay:after {
    content:'\A';
    position:absolute;
    width:100%; height:100%;
    top:0; left:0;
    background:rgba(0,0,0,0.4);
    opacity:0;
    transition: all 0.5s;
    -webkit-transition: all 0.5s;
}
.overlay:hover:after {
    opacity:1;
}
.index-strap {
	position:absolute;
	top:60%;
	width:100%;
	height:auto;
	font-family: 'Avenir LT Std 35 Light';
	font-size: 18px;
	font-weight:600;
	color:#fff;
	text-align:center;
}
.index-text {
	position:relative;
	float:left;
	width:100%;
	height:auto;
	font-family: 'Avenir LT Std 35 Light';
	font-size: 16px;
	line-height:24px;
	text-align:left;
	margin:0px 0 0 0;	
}
header {
	position: relative;
	float:left;
	top:0px;
	left:0px;
	width: 100%;
	height: 100px;
	padding: 0;
	margin:0 0 0 0;
	background:#fff;
	z-index:9999;
}	
#logos-wrap {
	position:relative;
	float:left;
	width:80%;
	height:auto;
	margin: 0px 0 0 0;
}
#logos-wrap img{
	max-width:100%;
}
.artlegno-logo {
	position:relative;
	float:left;
	top:26px;
	display:inline-block;
	margin:0px 0 0 0;
	width:100px;
	height:auto;	
	border-right:solid 1px #666;
	padding:0 20px 0 0;
}
.carlomagno-logo {
	position:relative;
	float:left;
	display:inline-block;
	margin:0px 0 0 20px;
	width:100px;
	height:auto;	
}
#slider {
	position:relative;
	float:left;
	width: 100%;
	height: auto;
	margin:0px 0 20px 0;
}     
#slider img{
	max-width: 100%;
} 
.panel-text {
	position:relative;
	float:left;
	width:100%;
	height:auto;
	font-size: 16px;
	line-height:24px;
	text-align: justify;
	margin:20px 0 0 0;	
}
.sample {
	position:relative;
	display:inline-block;
	float:left;
	width:23%;
	height:auto;
	margin:5px 1% 5px 1%;
}
}
@media screen and (max-width: 400px) {

#logos-wrap {
	position:relative;
	float:left;
	width:80%;
	height:auto;
	margin: 0px 0 0 0;
}
#logos-wrap img{
	max-width:100%;
}
.artlegno-logo {
	position:relative;
	float:left;
	top:22px;
	display:inline-block;
	margin:0px 0 0 0;
	width:80px;
	height:auto;	
	border-right:solid 1px #666;
	padding:0 20px 0 0;
}
.carlomagno-logo {
	position:relative;
	float:left;
	display:inline-block;
	margin:0px 0 0 20px;
	width:80px;
	height:auto;	
}
.sample {
	position:relative;
	display:inline-block;
	float:left;
	width:48%;
	height:auto;
	margin:5px 1% 5px 1%;
}
}