@charset "utf-8";
/* CSS Document */

body, h1, h2, h3, h4, a, p, li, ul {margin: 0; padding: 0; font-family: 'Lato', sans-serif;}
a {text-decoration: none;}
body {background-color: #7B8083;}
#header {width: 100%; height: 254px; text-align: center; background-image: url("immagini/cemento-decorativo.jpg"); background-position: top; background-size: 100%; position: relative;}
#header .fasciamenu {width: 100%; height: 54px; background-color: #000000; margin-top: 20px;}
#header .fasciamenu .menu { width: 960px; height: 54px; margin: 0 auto; }
#header .fasciamenu .menu ul li {list-style: none; float: left;}
#header .fasciamenu .menu ul li a { display: block; color: #fff; text-decoration: none; padding: 17px 24px 18px 24px; }
#header .fasciamenu .menu ul li a:hover {background-color: #DA1622;} 
#header .fasciamenu .menu ul li a.on {background-color: #DA1622;}

.menulavori {width: 100%; height: 30px; background-color: #DA1622; margin-top: 12px; }
.menulavori ul {width: 300px; display: block; margin: 0 auto; padding-left: 240px; }
.menulavori ul li {list-style: none; float:left;}
.menulavori ul li a {color: #e99a9a; padding: 3px 5px; display: block;}
.menulavori ul li a:hover {color:#fff;}

.preventivo {
    width: 300px;
    height: 117px;
    background-image: url(immagini/icone/pennellata.png); background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    left: 659px;
    top: 8px;
}
.preventivo a {color:#fff; font-size: 20px; padding-top: 20px; text-align: center; display: block;}
.preventivo a:hover {color:#000}

.preventivo2 {
    width: 300px;
    height: 117px;
    background-image: url(immagini/icone/pennellata.png); background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    left: 655px;
    top: -13px;
}
.preventivo2 a {color:#fff; font-size: 20px; padding-top: 20px; text-align: center; display: block;}
.preventivo2 a:hover {color:#000}

.preventivo3 {
    width: 300px;
    height: 117px;
    background-image: url(immagini/icone/pennellata.png); background-repeat: no-repeat;
    background-size: 100%;
    position: absolute;
    left: 659px;
    top: 187px;
}
.preventivo3 a {color:#fff; font-size: 20px; padding-top: 20px; text-align: center; display: block;}
.preventivo3 a:hover {color:#000}


#content {width: 960px; margin: 0 auto;}
#content .titoletto {color: #fff; font-size: 50px; font-weight: 300; text-align: center; padding:50px 0;}
#content .sottotitolo {font-size: 22px; color: #fff; line-height: px; text-align: center; font-weight: 300;  }
#content a.ctalavori {font-size: 30px; background-color: #fff; text-align: center; padding: 20px 30px; color: #333; display: block; margin: 190px auto 0 auto; width: 100px; }
#content a:hover.ctalavori {background-color: #333; color: #fff;}
#content .fascia .sx {width: 480px; height: 280px; float: left;/* background-color: #fff;*/}
#content .fascia .sx .titolino {color: #333; font-size: 55px; font-weight: 300; padding-top: 87px; padding-left: 20px; line-height: 55px;}
#content .fascia .dx {width: 480px; height: 280px; float: left; background-color: #666; background-image: url("immagini/servizi/arredo-industriale-labitha.jpg")}
a.cta {padding: 3px 30px 5px 30px; display: block; background-color: #666; border-radius: 3px; color: #fff; margin-top: 20px;}
a:hover.cta {background-color: #333;}
a.mail2 {color:#000; text-decoration: none;}
a:hover.mail2 {color: #49D4FF}

#ico { width: 855px; height:230px; display:block; margin-left: 0px; padding-left: 0px; padding-top: -40px; z-index: 15; margin-top: 30px;}
#ico .iconeGallery { width:960px; display:block;}
#ico .iconeGallery .icone { width:150px; height:150px; display:block; float:left; }
#ico .iconeGallery .gallery img { width:182px; height:182px;}
#ico .iconeGallery .gallery ul {list-style: none; }
#ico .iconeGallery .gallery ul li { float:left; margin-left:6px;}
#ico .iconeGallery .gallery ul li:first-child { margin-left:0;}
#ico .iconeGallery .gallery ul li a img {border: 2px solid #fff; border-width: 2px 2px 2px; text-decoration:none;}
#ico .iconeGallery .gallery ul li a:hover img { border: 2px solid #fff; }

#footer {width: 100%; height: 100px; background-color: #5A5A5A; clear: both; }
#footer .indirizzo { width: 960px; height: 100px; margin: 0 auto;}
#footer .indirizzo .testo {color: #fff; padding-top: 34px; width: 750px; display: block; float: left;}
#footer .social {width: 144px; float: right; height: 40px; padding-top: 30px;}
#footer .social a.fb {width: 38px; height: 38px; background-image: url("immagini/icone/facebook.png"); display: block; background-position: top; float: left; margin-right: 15px;}
#footer .social a:hover.fb {background-image: url("immagini/icone/facebook.png"); display: block; background-position: bottom;}
#footer .social a.in {width: 38px; height: 38px; background-image: url("immagini/icone/instagram.png"); display: block; background-position: top; float: left; margin-right:  15px;}
#footer .social a:hover.in {background-image: url("immagini/icone/instagram.png"); display: block; background-position: bottom;}
#footer .social a.li {width: 38px; height: 38px; background-image: url("immagini/icone/linkedin.png"); display: block; background-position: top; float: left;}
#footer .social a:hover.li {background-image: url("immagini/icone/linkedin.png"); display: block; background-position: bottom;}
#footer a.mail {color:#FDE400; text-decoration: none;}
#footer a:hover.mail {color: #49D4FF}