@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=latin,latin-ext);
@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700&subset=latin-ext);

/* ==========================================================================
  Stili del Progetto
   ========================================================================== */
html {height: 100%;}
body {
    height: 100%;
    font-family: 'Open Sans', Helvetica, Arial, sans-serif;
    font-weight: 400;
    color: #2a2a2a;
    line-height: 1.5em;
    font-size: 16px;
    margin: 0;
    background: #272a2c;
}

img {border: 0;}
iframe {border: 0;}
strong, b {font-weight: 700;}

/* sistema form */
form {margin: 0;}
fieldset {border: 0; margin: 0; padding: 0;}

.nocompiled {border: 1px solid #f00 !important;}
.nocompiled2 {padding: 0 17px 0 0; color: #f00;}


select {
    padding: 3px 5px;
    margin: 0 10px 0 0;
    vertical-align: middle;
    outline: none;
    border: 1px solid #c8c8c8;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    color: #8c8c8c;
    background: #fff;
    }
select.form-control { border-radius: 0px; }

/*button*/
button {
    padding: 3px 5px;
    outline: none;
    border: 1px solid #c8c8c8;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
    background: #09b156;
}
button:hover {
    color: #09b156;
    background: #fff;
}

/*text area*/
textarea.form-control {border-radius: 0px;}


/*input text*/
input[type=text] {
    padding: 3px 5px;
    outline: none;
    border: 1px solid #c8c8c8;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    color: #8c8c8c;
    background: #fff;
}
input[type=text]:focus {}

/*input password*/
input[type=password] {
    padding: 3px 5px;
    outline: none;
    border: 1px solid #c8c8c8;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    color: #8c8c8c;
    background: #fff;
}
input[type=password]:focus {}


/*set icone*/
.icon-button { /*input */
    outline: none;
    border: none;
    color: #fff;
    cursor: pointer;
    width: 16px;
    height: 16px;    
    text-indent: -9999px;
}

.icon-set { /*link href */
    display: block;
    float: left;
    margin: 0 3px 3px 0;
    width: 16px;
    height: 16px;
    text-indent: -9999px;
}
/**/
a {color: #2795dc; text-decoration: none; outline: none !important;}
a:hover {color: #000; text-decoration: none;}
a:focus {color: #2795dc; text-decoration: none;}

p {margin: 0 0 2em 0;}

h1,h2,h3,h4,h5,h6 {font-family: 'Roboto Condensed', sans-serif; font-weight: 700; color: #fff; margin: 0 0 1em 0; text-transform: uppercase; line-height: 1em; padding:0; clear: both;}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {text-decoration: none;}

h1{ font-size: 2.7em;}
h2{ font-size: 2.4em;}
h3{ font-size: 2.2em;}
h4{ font-size: 2em;}
h5{ font-size: 1.8em;}
h6{ font-size: 1.6em;}

ol {margin:0; padding: 0; line-height:normal;}
ul {margin:0; padding: 0; line-height:normal;}
li {margin:0; padding: 0; line-height:normal;}

dl, dt, dd {margin:0; padding: 0;}

.noborder {border: 0px solid #fff !important;}
.marginclear {margin-right: 0px !important;}
.marginclear-bottom {margin-bottom: 0px !important;}
.paddingclear {padding-right: 0px !important;}
.bgclear {background: none !important;}
.clear {clear: both !important;}

.alignDx {text-align: right !important;}
.alignCenter {text-align: center !important;}
.alignJustify {text-align: justify !important;}
.posrelative {position: relative}

.floatSx {float: left !important; }
.floatDx {float: right !important; }

.title-hide {text-indent: -9999px; font-size: 0; height: 0; margin: 0;}
td.nowrap {text-align: right; white-space: nowrap;}

nav ul {list-style: none;}

/* styles colonna centrata */
.row-centered {text-align:center;}
.col-centered { display:inline-block; float:none; text-align:left;}


/* ==========================================================================
  HEADER
   ========================================================================== */
header {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 50;
    min-height: 100px;
    width: 100%;
    background: #333;
}
.logo {position: absolute; z-index: 110; width: 100%; height: 100px; padding:25px 0 0 0; text-align: center; background: #fff;}
header .toggle {position: absolute; z-index: 120; right: 0;}

/* Menu */
.menu{position: fixed; top: 50px; right: 0; z-index: 100; width: 100%; height: 100%; font-family: 'Roboto Condensed', sans-serif; font-weight: 700;}
.prodMenu {list-style: none; width: 100%; float: right; background: #338cc3;}
.prodMenu li {float: left; position:relative; height: 100px; margin-left: 45px; padding: 40px 0 0 0; font-size: 1.1em;text-transform: uppercase;}
.prodMenu li.fb {padding-top: 34px;}
.prodMenu li.lang {float: right; font-size: 1em; font-weight: 300; margin: 0 30px 0 0; padding-top: 37px; background: none}
.prodMenu li.lang a {display: block; padding: 2px 5px; border: 1px solid #fff;}
.prodMenu li a {color: #fff; text-decoration: none;}
.prodMenu li a:hover{color: #000;}


@media (min-width: 992px) {
    .menu.collapse {
        display: block!important;
        height: auto!important;
        overflow: visible!important;
        visibility: visible!important;
    }
}
@media (max-width: 991px)  {
    header {background: #fff;}
    .logo {text-align: left;}
    .menu {position: static; height: auto; background: #ffa200; margin-top: 100px;}
    .prodMenu {float: none; padding: 0 0;}
    .prodMenu li {float: none; height: auto; margin-right: 40px; padding: 8px 0 8px 0; background: none; border-bottom: 1px solid #fff}
    .prodMenu li.fb {display: none;}
    .prodMenu li.lang {float: none; padding: 8px 0 8px 0; margin-right: 40px;}
    .prodMenu li.lang a {border: 0;}
}

/*toggle menu*/
#nav-toggle {display: block; position: absolute; width: 50px; height: 50px; top: 25px !important; padding: 16px; right: 16px; background: #ffa200; }
#nav-toggle { cursor: pointer; }
#nav-toggle span, #nav-toggle span:before, #nav-toggle span:after { cursor: pointer; height: 3px; width: 18px; background: #fff; position: absolute; top: 23px; display: block; content: ''; }
#nav-toggle:hover span, #nav-toggle:hover span:before, #nav-toggle:hover span:after { background: #fff; }
#nav-toggle span:before { top: -7px; }
#nav-toggle span:after { top: 7px; }
#nav-toggle.active span, #nav-toggle.active span:before, #nav-toggle.active span:after { background: #fff; }


/* ==========================================================================
    GENERICI
   ========================================================================== */
.content {
 padding: 60px 0 60px 0;
 background: #fff;
}
article, aside {margin-bottom: 20px;}
.content ul {list-style: none; padding: 0 20px 0 20px; margin-bottom: 40px}

.max{clear: both; width: 100%}
/*altezze elementi*/
.h100 {height: 100%;}

/* ==========================================================================
    HOME PAGE
   ========================================================================== */
/* banner */
.fullCarousel,
.altBanner {position: relative; width: 100%; height: 75%; min-height: 650px; top: 100px; margin-bottom: 100px; overflow: hidden; background: #000}
.altBanner .inner {position: absolute; opacity: 0.4; z-index: 10;  top: 0; left: 0; width: 100%; height: 100%;}

.fullCarousel .carousel {position:absolute; width: 100%; height: 100%;}
.fullCarousel .carousel-inner {height: 100%;}
.fullCarousel .item {height: 100%;}
.fullCarousel .item .bg-op {position: absolute; z-index: 10; height: 100%; width: 100%; background: rgba(0,0,0,0.6)}

#carousel-home .carousel-caption {position: absolute; z-index: 15; width: 100%; top: 190px; left: 0; right: 0; text-shadow: none; }
#carousel-home .carousel-caption h2 {font-size: 2.8em; position: absolute; padding: 50px; color: #fff; text-align: left; background: rgba(0, 0, 0, 0.3)}
#carousel-home .carousel-caption h2:before {position: absolute; content:''; width: 10px; height: 70%; left: 0; top: 15%; background: #ffa200;}

.titoloitem {position: absolute; z-index: 15; width: 100%; top: 190px; }
.titoloitem h1 {font-size: 2.8em; position: absolute; margin: 0 0 0 15px; padding: 50px; color: #fff; background: rgba(0, 0, 0, 0.3)}
.titoloitem h1:before {position: absolute; content:''; width: 10px; height: 160px; left: 0; top: 40px; background: #ffa200;}

/* Contatto veloce */
.fast-contact {padding: 60px 0; background: #ccc;}
.fast-contact p {margin: 0; font-size: 2em; color: #fff; font-weight: 700; line-height: 1.1em}
.fast-contact a {display: block; float: right; color: #fff; font-size: 0.9em; font-weight: 600; border-radius: 30px; padding: 10px 30px; background: #333;}
.fast-contact a:hover {color: #3c443e; background: #fff;}

/* Clienti */
.content.clients {position: relative; background: #fff;}
.content.clients h3{color: #272a2c;}
.clients #brandCarousel img {max-width: 100%}

@media (max-width: 991px)  {
.altBanner { height: 400px; min-height: inherit;}
}
@media (max-width: 767px)  {
.fast-contact p {margin-bottom: 30px;}
.fast-contact a {float: left;}
}


/* ==========================================================================
    PAGINE
   ========================================================================== */
.content.page {position: relative; background: #fff;}

/* banner */
.altBanner-page {position: relative; width: 100%; height: 50%; min-height: 450px; top: 100px; margin-bottom: 100px; background: #000}
.altBanner-page .inner {position: absolute; opacity: 0.4; z-index: 10; top: 0; left: 0; width: 100%; height: 100%;}
.altBanner-page .titoloitem {position: absolute; z-index: 15; width: 100%; top: inherit; bottom: 0;}
.altBanner-page .titoloitem .container,
.altBanner-page .titoloitem .row,
.altBanner-page .titoloitem .col-md-6 {height: 100%;}
.altBanner-page .titoloitem h1 {position: absolute; padding: 35px; width: 100%; bottom: 0; text-align: center;}
.altBanner-page .titoloitem h1:before {position: absolute; content:''; width: 100%; height: 10px; left: 0; top: inherit; bottom: -10px; background: #ffa200;}

/*pagina*/
.content.page h3 {color: #272a2c;}
.content.page .txt ul {padding: 0;}
.content.page .txt ul li {padding: 2px 10px; margin-bottom: 10px; font-weight: 400; border-left: 1px solid #0f293c;}
.content.page .col-sx {padding: 35px 10px; font-size: 0.9em; color: #fff; background: #ffa200;}
.content.page .col-sx ul {margin:0;}
.content.page .col-sx ul li {position: relative; text-transform: uppercase; padding: 3px 0 3px 15px;}
.content.page .col-sx ul li:before {position: absolute; content:''; width: 10px; height: 2px; left: 0; top: 12px; background: #fff;}
.content.page .col-sx .btn-default {color: #ffa200; padding: 6px 30px; background-color: #fff; border-color: #fff; border-radius:0;}

.content.page .col-sx a {color: #fff;}
.content.page .col-sx p:last-child {margin:0;}
.content.page .gallery {padding: 35px 0;}
.content.page .gallery .item  img {width:100%;}
.content.page .gallery .carousel-indicators {bottom: -35px;}
.content.page .gallery .carousel-indicators li {background-color: #454545; margin: 0; border: 0;}
.content.page .gallery .carousel-indicators .active {width: 10px; height: 10px; background-color: #ffa200;}


/* News
========================================================================== */
.content.news {margin-top: 100px; padding-top: 100px; min-height: 600px}
.content.news h1{color: #000;}

.newsList {
    list-style: none;
    margin: 0;
}
.newsList li {
    margin-bottom: 30px;
    padding-top: 30px;
    padding-bottom: 30px;
    border-bottom: 3px solid #ffa200;
}.newsList.consigli li {min-height: 150px;}
.newsList .img {width: 25%; float: left; margin-right: 5%;}
.newsList .img img {width: 100%; height: auto;}
.newsList .body {width: 70%; float: left; line-height: 1.6em; overflow: hidden;}
.newsList h2.title a {color: #ffa200; text-decoration: none;}
.newsList.consigli h2.title {font-size: 1.2em;}

/* DETTAGLIO NEWS
========================================================================== */
.dettNews .body { font-size: 0.9em; text-align: justify;}
.dettNews .body h1{text-align: left;}
.dettNews .img img {width: 100%;}
.dettNews .body  ul {padding:0;}
.dettNews .body  ul {padding:0;}
.dettNews .body  ul li {line-height: 1.4em; padding: 0 20px 0 20px; margin-bottom: 15px; border-left: 1px solid #ffa200}
.dettNews .body  ol {padding:0; list-style-type: decimal; list-style-position: inside}
.dettNews .body  ol li {line-height: 1.4em; padding: 0 20px 0 20px; padding: 7px 0; border-bottom: 1px solid #dadada}



#googlemap {width: 100%}

@media (max-width: 991px)  {
.altBanner-page .titoloitem h1 {margin-left: -15px;}
.content.page .col-sx {margin-bottom: 30px;}
.newsList .img {width: 100%; float: none; margin-bottom: 20px;}
.newsList .body {width: 100%; float: none;}
}


/* ==========================================================================
    FOOTER
   ========================================================================== */

footer {
    clear: both;
    position: relative;
    min-height: 320px;
    width: 100%;
    font-size: 0.9em;
    line-height: 1.3em;
    color: #fff;
    background: #272a2c;
    z-index: 15;
}
footer img {max-width: 100%}
footer .bottom {padding: 60px 0;}

footer strong {font-size: 1.1em; text-transform: uppercase;}


footer p {margin-bottom: 0.5em;}
footer a {text-decoration: none; color: #fff; }
footer a:hover {color: #000; }
footer small {font-size: 0.7em;}
footer ul {list-style: none; margin-bottom: 80px;}
footer ul li {padding: 3px 0; }
footer ul li a {text-decoration: none; }

footer ul.social li {float:left; margin-right: 10px;}



@media (max-width: 991px) { 
 footer {position: static;}
}
  
/*Modal Credits*/
#modalCredits .modal-content,
#modalInfo .modal-content {border-radius: 0; font-size: 0.8em;}

#msgReg, #msgReg2 {
    display: none;
    padding: 20px;
    margin-top: 20px;
    text-align: center;
    font-style: italic;
    border-top: 2px solid #fff;
}