@import url(https://fonts.googleapis.com/css?family=Raleway:400,600,700);
@import url(https://fonts.googleapis.com/css?family=Pragati+Narrow:400,700);
@import url('reset.css');

/*---------------------------------------------*\
                   common  
\*---------------------------------------------*/

* {margin:0; padding:0; font:14px/1.35 'Raleway', sans-serif, Arial, Verdana, serif; font-weight:600;  color:#000; z-index:1; -webkit-text-size-adjust: none;}
*, *:before, *:after { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; box-sizing: border-box;  }


html, body { min-height:100%; height:auto; width:auto; }
html > body  {min-height:100%; height:auto; width:auto;}
html {width: 100% }
body {background:url(images/bgk.jpg) no-repeat center center; background-size:cover; background-attachment:fixed  }

h1,h2,h3,h4,h5,h6 {line-height:1em; color:#ccc; font-weight:normal; padding:0;  padding-bottom:10px;}
h1 *, h2 *, h3 *, h4 *, h5 *, h6 * {line-height:1em; font-size:inherit; font-family:inherit; }
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {line-height:1em; background:none }


h1 {font-size:38px;}
h2 {font-size:36px; }
h3 {font-size:22px; background:none; color:#E8690C; }
h4 {font-size:22px; }
h5 {font-size:18px; }
h6 {font-size:16px; }

p {margin:5px 0; clear:right;}
a {text-decoration:none;}
hr {height:1px; border:0; border-bottom:1px dotted #ccc; margin:10px 0;}
a:visited, a:link {outline:none;}
a img {border:0;}
p.err {color:red; margin-bottom:10px}

strong {font-weight:bold; }
input {margin:0; padding:0;}
form p { margin:0; padding:0;}
ul { list-style-position:inside; margin:0; padding:0; }

.hide {display:none}
.err {color:#f12 !important; }
strong.err {font-size:inherit; padding:0;}
h3.err {font-size:30px; padding:0;}


/*---------------------------------------------*\
                   general  
\*---------------------------------------------*/
.link {text-transform:uppercase; background:url('images/bgk_link.png') no-repeat center right; padding-right:20px; margin-top:20px; display:inline-block; color:#6b6464}
.titolo {font-size:24px; font-family: 'Pragati Narrow', sans-serif; font-weight:bold; text-transform:uppercase; color:#4b5769; letter-spacing:1px}
.bar{width: 100%;height: 1px; background-color: #dad9d5;}
.anchor {position:absolute; top:0; left:0; width:100%; height:100%; display:block; z-index:2}
.action:hover {cursor:pointer}

.section {background-size:cover !important;}
.section * {text-align:center}
.section .content {width:550px; margin:0px auto;  background:#fff; padding:40px}
.section .content .icona {display:block; margin:30px auto}

.section.bgk {padding:40px 0px}
.section.bgk .titolo {color:#fff; margin-bottom:40px}



/*---------------------------------------------*\
                   wrapper  
\*---------------------------------------------*/
#wrapper {width:1024px; margin:0px auto; background:#fff;}
.lm9{width: 1024px;margin: 0 auto;background-color: white}

.ombra { position:relative; }
.ombra::before { position:relative; box-shadow: -15px 0 15px -18px inset; -webkit-box-shadow: -15px 0 15px -18px inset; -moz-box-shadow: -15px 0 15px -18px inset; content: " "; height: 100%; position: absolute; top: 0; left:-15px; width:15px}
.ombra::after { position:relative; box-shadow: 15px 0 15px -18px inset; -webkit-box-shadow: 15px 0 15px -18px inset; -moz-box-shadow: 15px 0 15px -18px inset; content: " "; height: 100%; position: absolute; top: 0; right:-15px; width:15px}


/*---------------------------------------------*\
                   menu
\*---------------------------------------------*/
#header {width:1024px; margin:0px auto; z-index:2}
#header .cnt {background-color: white;padding: 20px;box-sizing: border-box;height: 110px;}
#header .cnt .img-home {width:200px}
#header .cnt .divisore {height:40px; width:1px; background:#000; display:inline-block; margin:0 30px; position:relative; top:-10px}
#header .cnt .img-schuco {width:100px; position:relative; top:0px}

#header .cnt .div-social {display:inline-block; position:relative; top:-10px}
#header .cnt .div-social p {color:#939392; font-size:12px; font-weight:600; display:inline-block; position:relative; top:-10px; margin-right:10px}
#header .cnt .div-social .social {-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; border:2px solid #858584; display:inline-block; margin-left:5px}
#header .cnt .div-social .social img {padding:5px}
#header .cnt .div-social .social .hover_img {display:none}

#header .cnt .div-social .social:hover {border:2px solid #96b2c1}
#header .cnt .div-social .social:hover img {display:none}
#header .cnt .div-social .social:hover .hover_img {display:inline}

#header .menu {background-color: rgba(67,86,105,.8);overflow: auto;height: 100%;position: fixed;width: 100%;z-index: 9999; left:0; z-index:2; bottom:4000px}
#header .menu *{text-align: center;font-family: 'Pragati Narrow', sans-serif;font-weight: 700;color: white;font-size: 24px;line-height: 24px}
#header .menu .dividi::after{content: '';display: block;margin: 0 auto;background-color: white;height: 4px;width: 40px;margin-top: 25px}
#header .menu ul li{margin-bottom: 25px}
#header .menu ul li:last-child::after, #header .menu ul li:first-child::before{content: '';height: 1px;width: 400px;background-color: white;display: block;margin: 25px auto;}
#header .menu ul li:first-child{margin-top: 140px}
#header .menu ul li:hover a{color:#cf6b28;transition: color .3s}
#header .menu .close{position: absolute;top:48px;}
#header .menu .close{color: #cf6b28;font-size: 16px;line-height: 16px;cursor: pointer}
#header .menu .close img{vertical-align: middle;margin-left: 5px}

#header .burger{position: absolute;top:48px;font-family: 'Pragati Narrow', sans-serif;color: #4b5769;font-size: 16px;line-height: 16px;cursor: pointer;right: 20px}
#header .burger img{vertical-align: middle;margin-left: 5px;}



/*---------------------------------------------*\
                   footer
\*---------------------------------------------*/
#footer {margin: 0 auto;padding: 20px; background:#fff}
#footer *{text-align: center;}
#footer .bld{font-weight: 700}
#footer img{margin: 15px; width:150px}
#footer .detr{margin: 35px auto; border: 1px solid #a09e95;padding: 5px 15px;display: inline-block;color:#6b6464;font-family: 'Pragati Narrow', sans-serif;font-size: 14px}

/*---------------------------------------------*\
                   slider
\*---------------------------------------------*/
.slider-container{overflow: hidden}
.slider-container .slide{width: 100%;height: 370px;background-size: cover;background-repeat: no-repeat;background-position: center center}

/*---------------------------------------------*\
                   banner
\*---------------------------------------------*/
#popu-content{text-align: center;}
#popu-content img{position: relative;}
#popu-content a{position: absolute;top: 0; left: 0; width: 100%;height: 100%;}
/*---------------------------------------------*\
                   home
\*---------------------------------------------*/
.fascia-home .content {padding:30px 180px; overflow:hidden}

.fascia-home .content img {width:25%; float:left}
.fascia-home .content .testo {width:70%; float:left; margin-left:5%}
.fascia-home .content .titolo {color:#4b5769;}
.fascia-home .content .divisore {width:240px; border:1px solid #4b5769; position:relative; left:-45px; margin:0 0 20px 0}

.fascia-home.alternate {background:#c4c1c1}
.fascia-home.alternate * {text-align:right}
.fascia-home.alternate .content .testo {margin-left:0; margin-right:5%}
.fascia-home.alternate .content .titolo {color:#fff;}
.fascia-home.alternate .content .divisore {border:1px solid #fff; position:relative; left:initial; right:-35px; float:right}

.home-ambiente {background:url('images/bgk_ambiente_home.png') no-repeat center center; padding:40px 0px; background-size:cover}
.home-ambiente * {text-align:center;}
.home-ambiente .titolo {color:#fff; margin-top:30px; display:block}
.home-ambiente .content {background:#fff; width:540px; margin:0px auto; padding:30px}

.alberatura {overflow:hidden; width:560px; margin:0px auto 50px auto}
.alberatura img {display:block; margin:0px auto}
.alberatura div {width:200px; float:left}
.alberatura div .titolo {color:#4b5769; margin:10px auto}
.alberatura div + div {margin-left:160px}

.lista-partners {overflow:hidden; padding:20px}
.lista-partners .titolo {text-align:center; margin:30px 0px; color:#4b5769}
.lista-partners .partners {float:left; padding:0px 30px; border-right:1px solid #ccc; height:160px; max-width:245px; position:relative}
.lista-partners .partners img {width:100%}
.lista-partners .partners.last {border-right:none}

/*---------------------------------------------*\
                   faq
\*---------------------------------------------*/
.lista-faq .faq {border-bottom:1px solid #dad9d5; margin-bottom:5px}

.lista-faq .faq .titolo-faq:hover, .lista-faq .faq .titolo-faq.active {cursor:pointer;}
.lista-faq .faq .titolo-faq:hover p, .lista-faq .faq .titolo-faq.active p {color:#cf6b28}
.lista-faq .faq .titolo-faq.active img { transform: rotate(90deg); -ms-transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg);}

.lista-faq .faq .titolo-faq * {display:inline-block}
.lista-faq .faq .titolo-faq img {position:relative;-moz-transition: all 1s ease; -webkit-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;}
.lista-faq .faq .titolo-faq p {width:440px; text-align:left; font-size:18px; text-transform:uppercase; color:#6b6464; margin:0px 0px 0px 10px}

.lista-faq .faq .descr-faq {display:none; width:440px; position:relative; left:30px;}
.lista-faq .faq .descr-faq * {text-align:left}

/*---------------------------------------------*\
                   fornitori e partners
\*---------------------------------------------*/
.lista-partners-page {background:url(images/bgk_partners_page.jpg) no-repeat center center; background-size:cover; padding:40px}
.lista-partners-page .titolo {color:#fff}

.lista-partners-page .partners {position:relative; border:3px solid #4b5769; display:inline-block; margin:20px 27px; background:#fff; width:182px; height:182px;-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;}
.lista-partners-page .partners img {max-width:140px; display:block}

/*---------------------------------------------*\
                   storyboard
\*---------------------------------------------*/
.storyboard {overflow:hidden; position:relative}
.storyboard .titolo {color:#fff}

.storyboard .fascia .info {position:absolute; width:330px}
.storyboard .fascia .divisore {margin:0px; border:1px solid #fff; position:relative}
.storyboard .fascia .titolo {display:inline-block}

.storyboard .fascia.small .left .info, .storyboard .fascia.small .right .info {top:-15px}
.storyboard .fascia.big .left .info {top:20px}

.storyboard .fascia .left {width:340px; float:left; position:relative}
.storyboard .fascia .center {width: 263px; float:left; /*background:#C8C2C2 url(images/riga.png) repeat-y center center;*/ padding:20px 0px}
.storyboard .fascia .right {width:340px; float:left; position:relative}

.storyboard .fascia .left * {text-align: right}
.storyboard .fascia .left .info .titolo {background:url(images/freccia_down.png) no-repeat right center; padding-right:20px; color:#6b6464;}


.storyboard .fascia .right * {text-align: left}
.storyboard .fascia .right .info {left:10px; top:20px}
.storyboard .fascia .right .info .titolo {background:url(images/freccia_down.png) no-repeat left center; padding-left:20px; color:#6b6464;}

.storyboard .linea {position:absolute; width:1px; background:#fff; left:510px; top:80px; height:85%; z-index:1}
.storyboard img {position:relative; z-index:2;}

/*---------------------------------------------*\
                   storia di una azienda
\*---------------------------------------------*/
.storyboard.tappe {background:url(images/bgk_tappe.jpg) repeat center center; padding:40px; background-size:initial !important}

/*---------------------------------------------*\
                   produzione e installazione
\*---------------------------------------------*/
.storyboard.lavori {background:url(images/bgk_lavori.jpg) repeat center center; padding:40px; background-size:initial !important}

/*---------------------------------------------*\
                   contatti
\*---------------------------------------------*/
.mappa {width:100%; overflow:hidden; margin-bottom:10px}

.mappa.left img, .mappa.left .indicazioni {float:left}
.mappa.right img, .mappa.right .indicazioni {float:right}
.mappa.right * {text-align:right}

.mappa .content {padding: 30px 180px; background-size:cover !important; overflow:hidden}
.mappa .content .indicazioni {margin:0 30px}
.mappa .content .link-map {text-transform:uppercase; color:#cf6b28; font-size:18px; font-weight:600; margin-top:10px;}
.mappa .content .link-map img {margin:3px 5px 0px 0px; -moz-transition: all 1s ease; -webkit-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;}
.mappa .content .link-map:hover {cursor:pointer}

.mappa.right .content .link-map img {margin:3px 0px 0px 5px; -webkit-transform:rotate(180deg); -ms-transform:rotate(180deg); transform:rotate(180deg)}
.mappa .content .link-map.active img {-webkit-transform:rotate(90deg); -ms-transform:rotate(90deg); transform:rotate(90deg)}


.mappa .cartina {display:none; position:relative}
.mappa .cartina p {text-align:center; text-transform:uppercase; color:#4b5769; font-size:24px; padding:20px 0px; font-family: 'Pragati Narrow', sans-serif; font-weight:400}
.mappa .cartina .action {position:absolute; top:30px; right:150px;}
.mappa .cartina .mappa {width:100%; height:350px;}


/*---------------------------------------------*\
                   focus on
\*---------------------------------------------*/
.notizia {width:100%; background:#4b5769; margin-bottom:10px}
.notizia .section {width:60%; margin:0px auto; padding:30px 0px; overflow:hidden;}
.notizia .section img {width:30%; max-width:165px; float:left}
.notizia .section .contenuto {float:left; width:65%; margin-left:5%; text-align:left}
.notizia .section .contenuto * {text-align:left}
.notizia .section .contenuto .data {color:#c4c1c1; font-size:18px; font-family: 'Pragati Narrow', sans-serif; font-weight:400; border-bottom:1px solid #c4c1c1; margin-bottom:0px; display:inline; letter-spacing:1px}
.notizia .section .contenuto .titolo {color:#fff; font-size:24px; font-family: 'Pragati Narrow', sans-serif; font-weight:400}
.notizia .section .contenuto .descr-breve * {color:#fff;}
.notizia .section .contenuto .action-gallery {color:#c4c1c1; font-size:18px; font-family: 'Pragati Narrow', sans-serif; font-weight:400; text-transform:uppercase}

.notizia.alternate {background:#c4c1c1}
.notizia.alternate .section .contenuto .data {color:#4b5769; border-bottom:1px solid #4b5769}
.notizia.alternate .section .contenuto {margin-right:5%; margin-left:0; text-align:right}
.notizia.alternate .section .contenuto * {text-align:right}
.notizia.alternate .section .contenuto .action-gallery {color:#4b5769; font-size:18px; font-family: 'Pragati Narrow', sans-serif; font-weight:400; text-transform:uppercase}

.notizia .gallery {background:#fff; padding: 30px 130px; display:none; position:relative}
.notizia .gallery .titolo {text-align:center}
.notizia .gallery .descrizione {width:80%; margin:0px auto; text-align:center}
.notizia .gallery .descrizione * {text-align:center}
.notizia .gallery .action {position:absolute; top:40px; right:140px}

.notizia .lista-image {margin-top:30px;}
.notizia .lista-image .container-image {display:inline-block; width:30%; max-width:230px; vertical-align:top; margin-bottom:30px}
.notizia .lista-image .container-image:hover {cursor:pointer}
.notizia .lista-image .container-image.middle {margin:0 5% 30px 5%}
.notizia .lista-image .container-image .nome {text-transform:uppercase; font-size:18px; color:#6b6464; font-family: 'Pragati Narrow', sans-serif; font-weight:400; background:url(images/bgk_link.png) no-repeat left 3px; padding-left:25px}

.notizia .lista-image .container-image .image {position:relative;}
.notizia .lista-image .container-image .image .img-file {width:100%}
.notizia .lista-image .container-image .image .info {position:absolute; bottom:0px; color:#cf6b28; font-size:14px; padding:5px; display:none; z-index:5}
.notizia .lista-image .container-image .hover {background:rgba(75,87,105,.8); display:none; z-index:3}
.notizia .lista-image .container-image .hover img {margin:40% auto; z-index:4; display:block}

/*---------------------------------------------*\
                   prodotti
\*---------------------------------------------*/
.prodotto {width:100%; margin-bottom:10px}
.prodotto .bgk {background-size:cover !important}
.prodotto .section {width:60%; margin:0px auto; padding:30px 0px; overflow:hidden}
.prodotto .section img {width:30%; max-width:165px; float:left}
.prodotto .section .contenuto {float:left; width:65%; margin-left:5%;}
.prodotto .section .contenuto * {text-align:left}
.prodotto .section .contenuto .titolo {font-size:24px; font-family: 'Pragati Narrow', sans-serif; font-weight:400; color:#4b5769}
.prodotto .section .contenuto .descr-breve {margin-bottom:20px}
.prodotto .section .contenuto .action-gallery {height:22px; font-size:18px; color:#6b6464; font-family: 'Pragati Narrow', sans-serif; font-weight:400; text-transform:uppercase; margin:0px; background:url('images/prod_left.png') no-repeat left center; padding:2px 0px 0px 20px}
.prodotto .section .contenuto .action-gallery:hover {color:#cf6b28; background:url('images/prod_left_hover.png') no-repeat left center;}

.prodotto.alternate .section .contenuto {margin-right:5%; margin-left:0}
.prodotto.alternate .section .contenuto * {text-align:right}
.prodotto.alternate .section .contenuto .action-gallery {background:url('images/prod_right.png') no-repeat right center; padding:2px 20px 0px 0px}
.prodotto.alternate .section .contenuto .action-gallery:hover {color:#cf6b28; background:url('images/prod_right_hover.png') no-repeat right center; }


.prodotto .gallery {background:#fff; padding: 30px 130px; display:none; position:relative}
.prodotto .gallery .titolo {text-align:center}
.prodotto .gallery .descrizione {width:80%; margin:0px auto; text-align:center}
.prodotto .gallery .descrizione * {text-align:center}
.prodotto .gallery .action {position:absolute; top:40px; right:140px}

.prodotto .lista-image {margin-top:30px;}
.prodotto .lista-image .container-image {display:inline-block; width:30%; max-width:230px; vertical-align:top; margin-bottom:30px}
.prodotto .lista-image .container-image:hover {cursor:pointer}
.prodotto .lista-image .container-image.middle {margin:0 5% 30px 5%}
.prodotto .lista-image .container-image .nome {font-size:18px;font-family: 'Pragati Narrow', sans-serif; font-weight:400; background:url(images/bgk_link.png) no-repeat left 3px; padding-left:25px}

.prodotto .lista-image .container-image .image {position:relative;}
.prodotto .lista-image .container-image .image .img-file {width:100%}
.prodotto .lista-image .container-image .image .info {position:absolute; bottom:0px; color:#cf6b28; font-size:14px; padding:5px; display:none; z-index:5}
.prodotto .lista-image .container-image .hover {background:rgba(75,87,105,.8); display:none; z-index:3}
.prodotto .lista-image .container-image .hover img {margin:40% auto; z-index:4; display:block}


/*---------------------------------------------*\
                   realizzazion
\*---------------------------------------------*/
.lista-realizzazione {padding:30px 130px}
.realizzazione {display:inline-block; width:30%; max-width:230px; vertical-align:top; margin-bottom:30px}
.realizzazione.middle {margin:0 5% 30px 5%}

.realizzazione .container-image:hover {cursor:pointer}
.realizzazione .container-image .nome {text-transform:uppercase; font-size:18px;font-family: 'Pragati Narrow', sans-serif; font-weight:400; background:url(images/bgk_link.png) no-repeat left 3px; padding-left:25px}

.realizzazione .container-image .image {position:relative;}
.realizzazione .container-image .image .img-file {width:100%}
.realizzazione .container-image .image .info {position:absolute; bottom:0px; color:#cf6b28; font-size:14px; padding:5px; display:none; z-index:5}
.realizzazione .container-image .hover {background:rgba(75,87,105,.8); display:none; z-index:3}
.realizzazione .container-image .hover img {margin:40% auto; z-index:4; display:block}

/*********************************************
----------- Iubenda  -----------------
*********************************************/
#iubenda-cs-banner .iubenda-banner-content * {color: white !important;}