body {
font-family: 'Lato', sans-serif;
margin:0;
padding:0;
min-height:970px;
}


.menu li span,
.brand .img, brand, .brand span,
.map-link,
.website,
.multilingua span,
.riquadro__social a
 {
transition:300ms;
-o-transition:300ms;
-moz-transition:300ms;
-webkit-transition:300ms;
}

.contacts__block, .contacts__block .icon
 {
transition:100ms;
-o-transition:100ms;
-moz-transition:100ms;
-webkit-transition:100ms;
}

#container {
width:1004px;
margin:0 auto;
min-height:800px;
overflow:hidden;
padding-bottom:50px;
position:relative;
}

.top {
border-bottom:1px solid #e4e4e4;
height:130px;
width:100%;
margin-bottom:15px;
}

a {text-decoration:none; color:black; }
a:hover{cursor:pointer;}

h1 {font-family: 'Quicksand', sans-serif; width:100%; float:left;}

p {font-size:15px; line-height:23px;}
small {margin: 10px 0 0 0; color: rgba(0,0,0,0.5); display: inline-block;  }

.logo {
width:500px;
display:block;
margin:40px auto;
}


.menu {
padding:0;
display:block;
overflow:hidden;
width:705px;
margin:0 auto 20px auto;
list-style:none;
}

.menu li {float:left; margin:0; padding:0;}
.menu li span {
padding:5px 15px;
margin:0 15px;
font-size:13px;
font-weight:600;
text-transform:uppercase;
color:black;
}

@media (min-width:701px){
    .menu {
        display: flex;
        justify-content: space-evenly;
        width: 90%;
    }
    .menu li {float:none; margin:0; padding:0;}
    .menu li span {
        padding: 5px 0px;
        margin: 0;
    }
}


.selection {width:100%; padding:0 0%; display:block; overflow:hidden; margin:10px auto; box-sizing:border-box; }
.clo-button, .acc-button, .submenu_btn1, .submenu_btn2 {
    width:49.6%; line-height:40px; margin:0 0.2%;
    /*background-color:#ebebeb; border:1px solid white;*/ border:1px solid black; 
    color:black; text-align:center; 
    float:left; box-sizing:border-box; 
    text-transform:uppercase; font-size:14px; letter-spacing:2px;
    transition:300ms; -webkit-transition:300ms; -o-transition:300ms; -moz-transition:300ms;
}
.clo-button:hover, .acc-button:hover, .submenu_btn1:hover, .submenu_btn2:hover
    {background-color:black; color:white; cursor:pointer; }

.selection .selected {background-color:black; color:white; }

.clo, .acc {transition:300ms; -webkit-transition:300ms;  }
.acc { display:none;}


.selection .enabled, .selection div:hover{ background-color:black; color:white;}
.sub__section2 {display: none;}



.content {
width:90%;
min-height:285px;
display:block;
margin:0 auto;
padding:20px 0;
font-size:13px;
color:#333;
overflow:hidden;
}
h1{border-bottom:1px solid #e4e4e4;font-size:45px; font-weight:400; padding-bottom:30px; text-align:center;}
h1.title__submenu {border-bottom: 0; padding-bottom: 10px; }

.content img {
max-width:800px;
width:100%;
display:block;
margin:0px auto 10px auto;
}




.brand {
display:block;
float:left;
position:relative;
padding:0;
width:312px;
height:370px;
margin:10px 10px;
overflow:hidden;
box-shadow: 0px 0px 1px black inset;
}

.brand .img {
width:100%;
height:100%;
display:block;  
background-position:center center;
background-size:cover; 
background-repeat:no-repeat;
margin:0 auto;
}
.brand .img img{
width:auto;
max-width:none;
height:100%;
margin:0 auto;
}


.brand span {
font-size:42px;
font-weight:900;
color:black;
text-align:center;
width:100%;
display:block;
text-shadow:0px -1px 2px white;
position:absolute;
bottom:-4px;
text-transform:uppercase;
line-height:40px;
}
.brand span.white {color:white; text-shadow:0 0px 10px black; }
 
.brand span b {font-size:30px; line-height:20px; }

a .brand:hover{background-color:black;}
a .brand:hover span{color:white; text-shadow:none;}
a .brand:hover .img{ opacity:0.5; transform:scale(1.1); }
a .brand span {
transition:0ms;
-o-transition:0ms;
-webkit-transition:0ms;
-moz-transition:0ms;
}
a .brand .img {
transition:transform 600ms;
-o-transition:transform 600ms;
-webkit-transition:transform 600ms;
-moz-transition:transform 600ms;
}


.social {padding:10px; background-color:black; margin:0 10px 0 0 !important; float:left; width:30px !important; height:30px !important;  
transition:400ms all;
-webkit-transition:400ms all;
-o-transition:400ms all;
-moz-transition:400ms all;
}


.content .img-mappa { max-width: 500px; margin:0 auto; }

.map-link {
    width:100%;
    max-width: 300px;
    display:block;
    margin: 10px auto;
    line-height:40px;
    padding: 10px 0;
    text-align:center;
    font-weight:600;
    border:1px solid black;
    box-sizing:border-box;
}
.map-link:hover{background-color:black; color:white;}


.social:hover{opacity:0.2;}

.column-x3 {margin:50px 0; display: flex; justify-content: space-between;}
.column-x3 img {
   width:32%;
}
@media (max-width:700px){
    .column-x3 img {
        width: 100%; margin: 1.5% 0;
    }
}


.website {
width:100%;
display:block;
line-height:40px;
text-align:center;
font-weight:600;
border:1px solid black;
box-sizing:border-box;
}
.website:hover{background-color:black; color:white;}

.riquadro{
    display: flex;
    align-content: center;
    justify-content: space-around;
    flex-wrap: wrap;
    margin: 50px 0 50px 0;
    padding: 40px 0;
    border:1px solid rgba(0,0,0,0.1);
}
.riquadro__title {width: 100%; text-align: center;
    margin: -52px auto 0 auto;
    border:1px solid rgba(0,0,0,0.1);
    background: white;
    width:200px; height: 20px; line-height: 20px;
    letter-spacing: 3px; text-transform: uppercase; 
    font-size: 12px;
}
.riquadro__social{
    justify-content: center;
    margin: 20px 0px;
    border: none;
}
.riquadro__social .riquadro__title {border: none; margin:20px 0;}
.riquadro__social a {padding: 25px; background: rgba(0,0,0,0.05); margin: 20px; border-radius: 50px;}
.riquadro__social a:hover {background: rgba(0,0,0,0.1); }
.content .riquadro__social .icon {   width: 20px; margin: 0; }



/*CONTATTI FOOTER*/

.riquadro__footer{
    justify-content: center;
    margin: 20px 0px;
    border: none;
    width: 100%;
}
.riquadro__footer .riquadro__title {border: none; margin:0px 0;}
.riquadro__footer p {font-size: 13px; width: 100%; margin: 5px 0 0 0; text-align: center;}
.contacts__block { 
    padding: 40px 0;
    margin:50px 1% 20px 1%;
    width: 47%;
    border:1px solid rgba(0,0,0,0.9); 
    text-align: center;
}

.contacts__block .icon {   
    padding: 25px;
    background: rgb(242, 242, 242);
    margin: 20px;
    width: 30px;
    height: 30px;
    display: block;
    margin: 0px auto 10px auto;
    border-radius: 50px;
}
.contacts__block .icon img{   
    width: 30px; margin: 0;
}
.contacts__block p {text-transform: uppercase; font-weight: 700; font-size: 12px; margin: 0 0 10px 0;}
.contacts__block .contact__text { font-size: 12px;}

.contacts__block:hover {border:1px solid #89f3c3;  }
.contacts__block:hover .icon {background: #89f3c3;}


@media(max-width:700px){
    .contacts__block {
        margin: 50px 1% -50px 1%;
        width: 100%;
        border: none;  
        padding: 20px 0;

    }

    .contacts__block:hover {border:white;}
/*    .contacts__block:hover .icon {background: rgb(242, 242, 242);}*/

}


.linea-sep{display:block; width: 100%; height: 1px; background: #e4e4e4; margin: 15px 0;}





.media-partner__box{
    height: 60px;
    width: 250px;
    margin: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}





.footer {
/*border-top:1px solid #e4e4e4;*/
width:100%;
font-size:11px;
color:black;
/*position:absolute;*/
left:0;
bottom:0px;
padding:10px 20px;
width:100%;
display:block;
color:#373737;
box-sizing:border-box;
}




#menu_call {display:none;}




@media all and (max-width:1024px) {
    #container {width:100%; min-width:320px; box-sizing:border-box; padding:0 20px 20px 20px; padding:0 20px 20px 20px;}    
    img {max-width:100%;}
    .logo{ max-width:90%; }

    
    /*BRAND*/
    .fake {display:none !important;}

    .brand {
    width:32.3%;
    height:370px;
    margin:0.5%;
    overflow:hidden;
    /*background-color:black;*/
    }

    /*.brand .img {opacity:0.8; }*/
    .brand:hover .img{ opacity:0.5;}

    

}


@media all and (max-width:900px) {
    
    .brand {
    width:49%;
    height:370px;
    margin:0.5%;
    }
    .brand .img img{
    width:100%;
    height:auto;
    }
}




@media all and (max-width:700px) {

    h1{
        background-color:black; color:white; font-size:26px;
        line-height:50px !important; padding:0; float:left; width:100%; display:block;
        margin:10px 0 0 0;
    }
    h1.title__submenu {border-bottom: 0; padding-bottom: 0px;margin-bottom: 2px; }
    clo-button, .acc-button { margin:0 0.4%;  width: 49.2%;}
    
    
    

    .top{position:relative; }
    .logo{ max-width:80%; float:left; margin-left:5%; }


    .menu {display:none;}
    #menu_call { display:block; opacity:1; width:55px;  margin:43px 0 0 0; float:right; }
    #menu_call:hover{cursor:pointer;}
    .menu {
    position:absolute;
    top:100px;
    left:0;
    width:100%;
    z-index:1000;
    background-color:white;
    }
    .menu li{width:100%;padding:0; margin:0; }
    .menu li span{
    width:100%;
    display:block;
    padding:15px 0;
    margin:0;
    font-size:12px;
    border-bottom:1px solid #f5f5f5;
    text-align:center;
    }
    .menu li span:hover{
    background-color:black;
    color:white;
    }


    .brand {
    max-width:400px;
    min-width:260px;
    width:75%;
    height:370px;
    margin:3% auto;
    float:none;
    }


    .map-link {
    width:100%;
    display:block;
    line-height:40px;
    text-align:center;
    font-weight:600;
    border:1px solid black;
    box-sizing:border-box;
    }
    .map-link:hover{background-color:black; color:white;}
}

@media all and (max-width:550px) {
    #menu_call { margin:35px 0 0 0; width:50px; }
    .top{height:100px}
    
}


@media all and (max-width:500px) {
    .brand{height:340px;}
}

@media all and (max-width:440px) { 
    #menu_call { margin:35px 0 0 0; width:40px; }

    .brand{height:290px;}
}



.content .ita p, .content .eng p{
    letter-spacing: 0.5px;
    font-size: 14px;
}
.content__text h2 {margin: 60px 0 30px 0; }

.multilingua {
    display:block;
    text-align: center;
    margin: 20px 0 50px 0;
}
.multilingua span {
    margin: 0 10px;
    font-size: 14px;
    letter-spacing: 0.5px;
}
.multilingua .enabled, .multilingua span:hover{ opacity: 1; cursor: pointer;}
.multilingua .disabled {opacity: 0.5; }

.eng {display: none;}


@media all and (max-width:768px) {
    .content__text h2 {
        margin: 50px 0 30px 0;
    }
}










/*  ANIMAZIONI **************************************/  


/*  slide from top **************************************/  
.slide-from-top-1{    
    transform:translateY(-500px);-webkit-transform:translateY(-500px); opacity: 0;
     -webkit-animation: .2s ease-out 0.5s 1 slideInFromTopforwards;
    animation: .2s ease-out 0.5s 1 slideInFromTop forwards;
}
.slide-from-top-2{    
    transform:translateY(-500px);-webkit-transform:translateY(-500px); opacity: 0;
     -webkit-animation: .2s ease-out 1s 1 slideInFromTop forwards;
    animation: .2s ease-out 1s 1 slideInFromTop forwards;
}

/*  slide left **************************************/  
.slide-from-left{    
    transform:translateX(-500px);-webkit-transform:translateX(-500px); opacity: 0;
     -webkit-animation: .2s ease-out 0.5s 1 slideInFromLeft forwards;
    animation: .2s ease-out 0.5s 1 slideInFromLeft forwards;
}

/*  slide right**************************************/  
.slide-from-right{    
    transform:translateX(500px);-webkit-transform:translateX(500px); opacity: 0;
     -webkit-animation: .2s ease-out 0.5s 1 slideInFromRight forwards;
    animation: .2s ease-out 0.5s 1 slideInFromRight forwards;
}

/*  fade in **************************************/  
.fade-in{    
    opacity: 0;
     -webkit-animation: 1s ease-out 1s 1 fadeIn forwards;
    animation: 1s ease-out 1s 1 fadeIn forwards;
}



@-webkit-keyframes fadeIn {
    0% {
    opacity:0; 
    -webkit-transform: scale(0.95);
    }
    100% {
    opacity:1;
    -webkit-transform: scale(1);
    }
}
@keyframes fadeIn {
    0% {
    opacity:0; transform: scale(0.95);
    }
    100% {
    opacity:1; transform: scale(1);
    }
}


@-webkit-keyframes slideInFromTop {
    0% {
    opacity:0;
    -webkit-transform:translateY(-500px);
    }
    100% {
    opacity:1;
    -webkit-transform:none;
    }
}
@keyframes slideInFromTop {
    0% {
    opacity:0;
    transform:translateY(-500px);
    }
    100% {
    opacity:1;
    transform:none;
    }
}


@-webkit-keyframes slideInFromLeft {
    0% {
    opacity:0;
    -webkit-transform:translateX(-500px);
    }
    100% {
    opacity:1;
    -webkit-transform:none;
    }
}
@keyframes slideInFromLeft {
    0% {
    opacity:0;
    transform:translateX(-500px);
    }
    100% {
    opacity:1;
    transform:none;
    }
}


@-webkit-keyframes slideInFromRight {
    0% {
    opacity:0;
    -webkit-transform:translateX(500px);
    }
    100% {
    opacity:1;
    -webkit-transform:none;
    }
}
@keyframes slideInFromRight {
    0% {
    opacity:0;
    transform:translateX(500px);
    }
    100% {
    opacity:1;
    transform:none;
    }
}