@charset "UTF-8";

/*inizio sezione fonts*/
@import url(http://fonts.googleapis.com/css?family=Roboto:400,500,700);
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,500,700);
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:700 italic);

/* -------------------------------- 

Primary style

-------------------------------- */
*, *::after, *::before {
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
  overflow-y: scroll;
}

body {
  font-size: 1.6rem;
  font-family: "Roboto", sans-serif;
  color: #000;
  background-color: #FFFFFF;
  background-image: url(../img/sfondo.jpg);
  background-size: 100%;
  background-repeat: repeat;
  background-attachment: fixed;
}

body::after {
  clear: both;
  content: "";
  display: table;
}

body {
    animation: fadein 1s;
    -moz-animation: fadein 1s; /* Firefox */
    -webkit-animation: fadein 1s; /* Safari and Chrome */
    -o-animation: fadein 1s; /* Opera */
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}

a {
  color: #000;
  text-decoration: none;
}

.quadrato{
    position:fixed;
    margin: 0 auto;
    height: 253px;
    width: 100%;
    background-color: #333;
    z-index: 4;
}

.quadro_p{
    position: relative;
    margin: 0 auto;
    height: 300px;
    width: 1040px;
    background-color: #FFF;
}

/* -------------------------------- 

Main Page Content

-------------------------------- */
.cd-main-content .content-wrapper {
  position:relative;
  margin: 0 auto;
  width: 100%;
  max-width: 1060px;
}
.cd-main-content .content-wrapper h1 {
  text-align: center;
  /* padding: 3em 0;*/
  font-size: 2rem;
}
.cd-main-content::before {
  /* never visible - used to check MQ in jQuery */
  display: none;
  content: 'mobile';
}

@media only screen and (min-width: 130px) {
  .cd-main-content .content-wrapper {
    margin-top: 55px;
  }
  .cd-main-content .content-wrapper h1 {
    font-size: 2.2rem;
    font-weight: 300;
  }
  .cd-main-content::before {
    content: 'mobile';
  }
}


@media only screen and (min-width: 320px) {
  .cd-main-content .content-wrapper {
    margin-top: 55px;
  }
  .cd-main-content .content-wrapper h1 {
    font-size: 3.2rem;
    font-weight: 300;
  }
  .cd-main-content::before {
    content: 'mobile';
  }
}

@media only screen and (min-width: 480px) {
  .cd-main-content .content-wrapper {
    margin-top: 55px;
  }
  .cd-main-content .content-wrapper h1 {
    font-size: 3.2rem;
    font-weight: 300;
  }
  .cd-main-content::before {
    content: 'mobile';
  }
}

@media only screen and (min-width: 600px) {
  .cd-main-content .content-wrapper {
    margin-top: 55px;
  }
  .cd-main-content .content-wrapper h1 {
    font-size: 3.2rem;
    font-weight: 300;
  }
  .cd-main-content::before {
    content: 'mobile';
  }
}

@media only screen and (min-width: 801px) {
  .cd-main-content .content-wrapper {
    margin-top: 55px;
  }
  .cd-main-content .content-wrapper h1 {
    font-size: 3.2rem;
    font-weight: 300;
  }
  .cd-main-content::before {
    content: 'tablet';
  }
}

@media only screen and (min-width: 1025px) {
  .cd-main-content .content-wrapper {
    margin-top: 55px;
  }
  .cd-main-content .content-wrapper h1 {
    font-size: 3.2rem;
    font-weight: 300;
  }
  .cd-main-content::before {
    content: 'desktop';
  }
}
@media only screen and (min-width: 1281px) {
  .cd-main-content .content-wrapper {
  }
  .cd-main-content::before {
    content: 'desktop';
  }
}

/* -------------------------------- 

Header

-------------------------------- */
.cd-main-header {
  position: relative;
  font-family:Courier;
  z-index: 2;
  top: 50px;
  left: 0;
  width: 100%;
  background: rgba(192, 192, 192, 0.92);
}

.cd-main-header::after {
  clear: both;
  content: "";
  display: table;
}

@media only screen and (min-width: 130px) {
  .cd-main-header {
    position: fixed;
    height: 44px;
    width: 100%;
    min-width: 130px;
    top: 0px;
  }
}

@media only screen and (min-width: 320px) {
  .cd-main-header {
    position: fixed;
    height: 44px;
    width: 100%;
    min-width: 320px;
    top: 0px;
  }
}

@media only screen and (min-width: 480px) {
  .cd-main-header {
    position: fixed;
    height: 44px;
    top: 0px;
  }
}

@media only screen and (min-width: 600px) {
  .cd-main-header {
    position: fixed;
    height: 90px;
    top: 0px;
  }
}

@media only screen and (min-width: 801px) {
  .cd-main-header {
    position: relative;
    height: 90px;
    top: 0px;
  }
}

@media only screen and (min-width: 1025px) {
  .cd-main-header {
    position: relative;
    height: 90px;
    top: 50px;
  }
}

@media only screen and (min-width: 1281px) {
  .cd-main-header {
    position: relative;
    height: 90px;
    top: 50px;
  }
}

.hd{
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 1060px;
    height: 100%;
    /* border: 1px solid red;*/
}

.cd-logo {
  float: left;
  display: block;
  margin: 6px;
  letter-spacing:0.5em;
  font-weight: 700;
  background-image: url(../img/logo.png);
  background-size: 100%;
  background-repeat: no-repeat;
  height: 100%;
  width: 231px;
}
.cd-logo img {
  display: block;
}

.cd-nav-trigger {
  /* navigation trigger - visible on mobile devices only */
  float: right;
  position: relative;
  display: block;
  width: 34px;
  height: 44px;
  margin-right: 5%;
  /* hide text */
  overflow: hidden;
  white-space: nowrap;
  color: transparent;
}
.cd-nav-trigger span, .cd-nav-trigger span::before, .cd-nav-trigger span::after {
  /* hamburger icon in CSS */
  position: absolute;
  display: inline-block;
  height: 3px;
  width: 24px;
  background: #000;
}
.cd-nav-trigger span {
  /* line in the center */
  position: absolute;
  top: 50%;
  right: 5px;
  margin-top: -2px;
  -webkit-transition: background 0.2s;
  -moz-transition: background 0.2s;
  transition: background 0.2s;
}
.cd-nav-trigger span::before, .cd-nav-trigger span::after {
  /* other 2 lines */
  content: '';
  right: 0;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-origin: 0% 50%;
  -moz-transform-origin: 0% 50%;
  -ms-transform-origin: 0% 50%;
  -o-transform-origin: 0% 50%;
  transform-origin: 0% 50%;
  -webkit-transition: -webkit-transform 0.2s;
  -moz-transition: -moz-transform 0.2s;
  transition: transform 0.2s;
}
.cd-nav-trigger span::before {
  /* menu icon top line */
  top: -6px;
}
.cd-nav-trigger span::after {
  /* menu icon bottom line */
  top: 6px;
}
.cd-nav-trigger.nav-is-visible span {
  /* hide line in the center */
  background: rgba(255, 255, 255, 0);
}
.cd-nav-trigger.nav-is-visible span::before, .cd-nav-trigger.nav-is-visible span::after {
  /* keep visible other 2 lines */
  background: #000000;
}
.cd-nav-trigger.nav-is-visible span::before {
  -webkit-transform: translateX(4px) translateY(-3px) rotate(45deg);
  -moz-transform: translateX(4px) translateY(-3px) rotate(45deg);
  -ms-transform: translateX(4px) translateY(-3px) rotate(45deg);
  -o-transform: translateX(4px) translateY(-3px) rotate(45deg);
  transform: translateX(4px) translateY(-3px) rotate(45deg);
}
.cd-nav-trigger.nav-is-visible span::after {
  -webkit-transform: translateX(4px) translateY(2px) rotate(-45deg);
  -moz-transform: translateX(4px) translateY(2px) rotate(-45deg);
  -ms-transform: translateX(4px) translateY(2px) rotate(-45deg);
  -o-transform: translateX(4px) translateY(2px) rotate(-45deg);
  transform: translateX(4px) translateY(2px) rotate(-45deg);
}
@media only screen and (min-width: 801px) {
  .cd-nav-trigger {
    display: none;
  }
}


/* -------------------------------- 

Top Navigation

-------------------------------- */
.cd-nav {
  /* top nav - not visible on mobile devices */
  display: none;
  font-weight: 700;
  /*font-family:Arial, Helvetica, sans-serif;*/
  font: normal normal 700 12px/1.4em 'open sans',sans-serif;
  }
.cd-top-nav > li a{
  margin-right: 3em;
  margin-left: 3em;
  }

@media only screen and (min-width: 801px) {
  .cd-nav {
    display: block;
    float: right;
    line-height: 12px;
    padding-top: 26px;
  }
}

@media only screen and (min-width: 1025px) {
  .cd-nav {
    display: block;
    float: right;
    line-height: 12px;
    padding-top: 26px;
  font: normal normal 700 1em/1.8em 'open sans',sans-serif;    
  }
  /*
    .cd-top-nav > li a {
    padding: 1em 1.6em !important;
    }
  */
  .cd-top-nav > li {
    display: inline-block;
   /* margin-right: 4em;*/
    height: 100%;
  }
}

@media only screen and (min-width: 1281px) {
  .cd-nav {
    display: block;
    float: right;
    line-height: 12px;
    padding-top: 26px;
    font: normal normal 700 1em/1.8em 'open sans',sans-serif;    
  }
  /*
    .cd-top-nav > li a {
    padding: 1em 3.6em !important;
    }
  .cd-top-nav > li {
    display: inline-block;
    margin-right: 5em;
    height: 100%;
  }
  */
}

.cd-top-nav > li > a::before {
  /* reset style */
  display: none;
}

.cd-top-nav > li a {
  padding: 1em 5% !important;
}


@media only screen and (min-width: 801px) {
  .cd-top-nav {
    height: 100%;
  }
  .cd-top-nav a {     
    display: block;
    font-size: 0.9em;
    color: #000;  
  }
  .cd-top-nav > li {
    display: inline-block;
   /* margin-right: 3em;
    margin-left: 3em;*/
    line-height: 12px;
    border-right: solid 1px #000;
  }
  .cd-top-nav > li:last-of-type {
    margin-right: 0;
  }
  
  .cd-top-nav > li a {
    padding: 1em 0.1em !important;
  }
  
  .cd-top-nav img {
    display: block;
  }
}

.cd-top-nav li:not(.has-children) a:hover {
    color: #EFDD8D;
    line-height: 12px; 
  }

.cd-top-nav li a:hover {
    color: #EFDD8D;
  }
  
/* -------------------------------- 

Sidebar

-------------------------------- */
.cd-side-nav {
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  padding: 85px 0 0 0;
  background-color: #FFFFFF;
  visibility: hidden;
  opacity: 0;
  max-height: 100vh;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition: opacity 0.2s 0s, visibility 0s 0.2s;
  -moz-transition: opacity 0.2s 0s, visibility 0s 0.2s;
  transition: opacity 0.2s 0s, visibility 0s 0.2s;
}
.cd-side-nav.nav-is-visible {
  opacity: 1;
  visibility: visible;
  overflow: visible;
  -webkit-overflow-scrolling: touch;
  -webkit-transition: opacity 0.2s 0s, visibility 0s 0s;
  -moz-transition: opacity 0.2s 0s, visibility 0s 0s;
  transition: opacity 0.2s 0s, visibility 0s 0s;
  max-height: none;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}
.cd-side-nav > ul {
  padding: 0.6em 0;
}
.cd-side-nav > ul:last-of-type {
  padding-bottom: 0;
}
.cd-side-nav .cd-label, .cd-side-nav a {
  display: block;
  padding: 1em 5%;
}

.cd-side-nav a {
  position: relative;
  color: #000;
  font-size: 1.4rem;
}

.cd-side-nav ul.cd-top-nav > li:last-of-type > a {
  border-bottom: none;
}
.cd-side-nav > ul > li > a {
  padding-left: calc(5% + 24px);
}
.cd-side-nav > ul > li > a::before {
  /* icon before item name */
  position: absolute;
  content: '';
  left: 5%;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 16px;
  width: 16px;
  background: url(../img/cd-nav-icons.svg) no-repeat 0 0;
}
.cd-side-nav > ul > li.overview > a::before {
  background-position: -64px 0;
}
.cd-side-nav > ul > li.notifications > a::before {
  background-position: -80px 0;
}
.cd-side-nav > ul > li.comments > a::before {
  background-position: -48px 0;
}
.cd-side-nav > ul > li.bookmarks > a::before {
  background-position: -32px 0;
}
.cd-side-nav > ul > li.images > a::before {
  background-position: 0 0;
}
.cd-side-nav > ul > li.users > a::before {
  background-position: -16px 0;
}

@media only screen and (min-width: 801px) {
  .cd-side-nav {
    position: relative;
    float: left;
    top: auto;
    width: 110px;
    min-height: 100vh;
    padding-top: 55px;
    visibility: hidden;
    opacity: 1;
    overflow: visible;
    max-height: none;
  }
  .cd-side-nav.nav-is-visible {
    box-shadow: none;
  }
  .cd-side-nav.is-fixed {
    position: fixed;
  }
  .cd-side-nav > ul {
    /* reset style */
    padding: 0;
  }
  .cd-side-nav .cd-label {
    display: none;
  }
  .cd-side-nav a {
    font-size: 1.2rem;
    text-align: center;
  }
  .cd-side-nav > ul > li > a {
    padding: calc(2.2em + 24px) 0 2.4em;
  }
  .cd-side-nav > ul > li > a::before {
    left: 50%;
    right: auto;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 2.4em;
  }
  .cd-side-nav .active > a {
    box-shadow: inset 3px 0 0 #1784c7;
    background-color: #FFFFFF;
  }

}

.has-children ul {
  position: relative;
  width: 100%;
  display: none;
  /*padding-left: 1em;*/
  font-style:normal;
}

.has-children.selected > ul {
  display: block;
}
.has-children.selected > a::after {
  -webkit-transform: translateY(-50%) rotate(180deg);
  -moz-transform: translateY(-50%) rotate(180deg);
  -ms-transform: translateY(-50%) rotate(180deg);
  -o-transform: translateY(-50%) rotate(180deg);
  transform: translateY(-50%) rotate(180deg);
}

@media only screen and (min-width: 801px) {
  .has-children {
    position: relative;
  }
  .has-children ul {
    position: absolute;
    margin-top: -10px;
    top: 0;
    left: 100%;
    width: 160px;
    padding: 0;
  }
  .has-children ul a {
    text-align: center;
    padding: 1em;
  }
  .no-touch .has-children ul a:hover {
    color: #EFDD8D;
  }
  .has-children > a::after {
    display: none;
  }
  .cd-side-nav .has-children.selected > a {
    /* focus state -> show sub pages */
    background-color: transparent;
  }
  .cd-top-nav .has-children {
    position: relative;
   background-color: transparent;
  }
  .cd-top-nav .has-children > a {
    /*padding: 0 calc(1.8em + 0px) 0 calc(1.8em + 0px) !important;*/
    line-height: 12px;
  }
  .cd-top-nav .has-children > a::after {
    display: block;
    /*right: 1.8em;*/
  }
  .cd-top-nav .has-children ul {
    margin-top: 45px;
    width: 100%;
    top: 50%;
    left: auto;
    background: rgba(192, 192, 192, 0.92);
    text-align:center;
  }
  .cd-top-nav .has-children ul a {
    margin-top: -3px;
    /*padding-left: 25px !important;*/
    height: 10px;
    text-align:center;
  }
}
@media only screen and (min-width: 1070px) {
  .has-children > ul {
    margin-top: -10px;
    width: 100%;
    z-index: 1;
  }
  .has-children ul a {
    margin-top: -3px;
    /*padding-left: 18px;*/
    height: 10px;
        text-align:center;
  }
  .has-children.active > ul {
    position: relative;
    display: block;
    left: 0;
    box-shadow: none;
  }
  .no-touch .cd-side-nav .has-children:hover > ul, .cd-side-nav .has-children.hover > ul {
    display: block;
    opacity: 1;
    visibility: visible;
  }
}

.sotto{
    text-decoration:underline;
}

#selezione{
    color: #EFDD8D;
}

#no_bdr{
    border: none;
}

.bdr{
    border-bottom: solid #000 1px;
    padding-bottom: 5px;
}
/* Sezione home */

div#verticale {
    width: 980px;
    height: 170px;
    background: transparent;
    color: #FFFFFF; 
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -35px;
    margin-left: -490px;
    text-align:center;
    border-top: 1px #FFFFFF solid;
    border-bottom: 1px #FFFFFF solid;
    padding-top: 5px;
}

.titolo{
    font-family: tahoma,tahoma-w01-regular,tahoma-w02-regular,tahoma-w10-regular,tahoma-w15--regular,tahoma-w99-regular,sans-serif;
    word-wrap: break-word;
    font-size: 4.5em;
    padding-top: 15px;
    border-top: 2px #FFFFFF solid; 
}
.sottotitolo{
    font-family: tahoma,tahoma-w01-regular,tahoma-w02-regular,tahoma-w10-regular,tahoma-w15--regular,tahoma-w99-regular,sans-serif;
    word-wrap: break-word;
    letter-spacing: 0.35em;
    font-size: 1.5em;
    line-height: 50px;
    padding-bottom: 15px;
    border-bottom: 2px #FFFFFF solid; 
}

/* Sezione immagini */

.galleria {
   position: absolute;
   width: 100%;
   padding-bottom: 56px;
   max-width: 1044px;
   margin-top: 99px;
   margin-left: 8px;
   padding-left: 2px;
}

.galleria_img{
    float:left; 
    width: 519px;
    height: 390px;
    background-color: transparent;
    overflow:hidden;
    margin-left: 2px;
    }

.galleria_img:hover{
    background-color: #cccccc;
}    





@media only screen and (max-width: 130px) {
    img{
        max-width:100%;
        max-height:100%;
    }
    .galleria {
       position: absolute;
       width:calc(100% - 16px);
       padding-bottom: 56px;
       margin-top: 45px;
       margin-left: 8px;
       padding-left: 2px;
    }  
    .galleria_img{
        position: relative;
        margin: 0 auto;
        width:calc(100% - 8px);
        max-width: 95%;
        padding-bottom: 15%;
        height:calc(390px - (390 * 25%));
        background-color: transparent;
        overflow:hidden;
        }
    .galleria_img:hover{
        background-color: #cccccc;
    }    
}

@media only screen and (max-width: 320px) {
    img{
        max-width:100%;
        max-height:100%;
    }
    .galleria {
       position: absolute;
       width:calc(100% - 16px);
       padding-bottom: 56px;
       margin-top: 45px;
       margin-left: 8px;
       padding-left: 2px;
    }  
    .galleria_img{
        position: relative;
        margin: 0 auto;
        width:calc(100% - 8px);
        max-width: 95%;
        padding-bottom: 15%;
        height:calc(390px - (390 * 25%));
        background-color: transparent;
        overflow:hidden;
        }
    .galleria_img:hover{
        background-color: #cccccc;
    }    
}

@media only screen and (max-width: 518px) {
    img{
        max-width:100%;
        max-height:100%;
    }
    .galleria {
       position: absolute;
       width:calc(100% - 16px);
       padding-bottom: 56px;
       margin-top: 45px;
       margin-left: 8px;
       padding-left: 2px;
    }  
    .galleria_img{
        position: relative;
        margin: 0 auto;
        width:calc(100% - 8px);
        max-width: 95%;
        padding-bottom: 15%;
        height:calc(390px - (390 * 25%));
        background-color: transparent;
        overflow:hidden;
        }
    .galleria_img:hover{
        background-color: #cccccc;
    }    
}

@media only screen and (min-width: 519px) {
    img{
        max-width:100%;
        max-height:100%;
    }
    .galleria {
       position: absolute;
       width:calc(100% - 16px);
       padding-bottom: 56px;
       margin-top: 45px;
       margin-left: 8px;
       padding-left: 2px;
    }  
    .galleria_img{
        position: relative;
        margin: 0 auto;
        width:calc(100% - 8px);
        max-width: 95%;
        height:calc(390px - (100%*75%));
        background-color: transparent;
        overflow:hidden;
        }
    .galleria_img:hover{
        background-color: #cccccc;
    }    
}

@media only screen and (max-width: 1070px) and (min-width: 801px){
    .galleria {
       position: absolute;
       width:calc(100% - 8px);
       padding-bottom: 56px;
       margin-top: 99px;
       margin-left: 8px;
       padding-left: 2px;
    }  
    .galleria_img{
        float:left; 
        width:calc(50% - 4px);
        height: 390px;
        background-color: transparent;
        overflow:hidden;
        margin-left: 2px;
        text-align: center;
        }
    .galleria_img:hover{
        background-color: #cccccc;
    }    
}

@media only screen and (min-width: 1071px){
    .galleria {
       position: absolute;
       width: 100%;
       padding-bottom: 56px;
       max-width: 1044px;
       margin-top: 99px;
       margin-left: 8px;
       padding-left: 2px;
    }
    
    .galleria_img{
        float:left; 
        width: 519px;
        height: 390px;
        background-color: transparent;
        overflow:hidden;
        margin-left: 2px;
        }
    
    .galleria_img:hover{
        background-color: #cccccc;
    }       
}

.galleria_testo{
    margin-top: 18px;
    font-family: 'Roboto', MS Sans Serif, Geneva, sans-serif;
    font-size: 18px;
    text-align: left;
}

.no_float{
    clear: all;
}

.fancy_sub{
    font: normal 13px "Roboto",Helvetica,Arial,sans-serif;
    position: relative;
    z-index: 8050;
}

.fancy_txt{
    position:relative;
    margin-top: 4px;
    font: normal 11px "Roboto",Helvetica,Arial,sans-serif;
    line-height: 18px;
}

/* Sezione about */

.about_img{
    margin:30px 0 0 0;
    text-align: center;
    }

.about {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 1060px;
    border: 1px solid #FFFFFF;
    border-radius: 6px;
    background-color: #FFFFFF;
    padding: 20px;
}

@media only screen and (max-width: 130px) {
img{
        max-width:100%;
        max-height:100%;
    }

.about {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 130px;
    margin-top: 99px;
    padding: 0 0 0 10px;
}
}

@media only screen and (max-width: 320px) {
img{
        max-width:100%;
        max-height:100%;
    }

.about {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 320px;
    margin-top: 99px;
    padding: 10px;
}
}

@media only screen and (max-width: 801px) {
img .about_img{
        max-width:95%;
        max-height:95%;
    }

.about {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 1060px;
    margin-top: 99px;
    padding: 10px;
}
}

@media only screen and (max-width: 1070px) and (min-width: 802px){
img .about_img{
        max-width:95%;
        max-height:95%;
    }

.about {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 1060px;
    margin-top: 99px;
    padding: 10px;
}
}

.about_tit{
    font-size: 1.4em;
    margin: 5px 0 25px 0;
}
.about_text{
    font-size: 16px;
    margin: 10px 0 10px 0;
    line-height: 22px;
}

/* Sezione contact  */

.contact {
    position: relative;
    margin: 0 auto;
    width: 100%;
    max-width: 1060px;
    background-image: url(../img/sfondo.jpg);
}

.fascia{
    position:absolute;
    background-color: #FFFFFF;
    z-index: 0;
    border-radius: 6px;
}

.modulo{
    font-family: 'Roboto', MS Sans Serif, Geneva, sans-serif;
    font-size: 12px;
    text-align: justify;
    line-height: 18px;
    background-color: #FFFFFF;
    border: 1px solid #FFFFFF;
    border-radius: 6px;
    z-index: 2;
}

.contact_text{
    font-family: 'Roboto', MS Sans Serif, Geneva, sans-serif;
    font-size: 18px;
    text-align: justify;
    line-height: 18px;
    margin:20px 10px 0 0;
    background-color: #FFFFFF;
    padding: 20px 20px 20px 40px;
    z-index: 0;
    }

/* Sezione footer */

.footer{
    position: relative;
    width: 100%;
    max-width: 1060px;
    margin: 30px 10px 0 0;
    padding: 30px 0 0 0;
    float: left;
    z-index: 1;
}

@media only screen and (max-width: 130px) {

.footer{
    position: relative;
    width: 98%;
    max-width: 130px;
    margin: 30px 0 0 0;
    padding: 30px 5px 0 0;
    float: left;
    z-index: 1;
}

}
@media only screen and (max-width: 320px) {

.footer{
    position: relative;
    width: 98%;
    max-width: 320px;
    margin: 30px 0 0 0;
    padding: 30px 5px 0 0;
    float: left;
    z-index: 1;
}

}
@media only screen and (max-width: 801px) {

.footer{
    position: relative;
    width: 98%;
    max-width: 801px;
    margin: 30px 0 0 0;
    padding: 30px 5px 0 0;
    float: left;
    z-index: 1;
}

}

.copy{
    width: 50%;
    text-align:left;
    color:#000000;
    font-size:10px;
}

.iva{
    width: 50%;
    text-align:right;
    color:#000000;
    font-size:10px;
    float: right;
    padding:5px 0 5px 0;
}

.foot {
    position: relative;
    margin:0 auto;
    width: 100%;
    border-top:1px solid #000000;
    padding:5px 0 0 0;
}

.foot a {
    text-decoration:underline;
}

.foot p {
    font-size:10px;
}

.foot em {
    font-style:normal;
}

/* -------------------------------- 

Media screen

-------------------------------- */

@media only screen and (min-width: 130px) {
  .cd-logo {
    font-size: 0.6em;
    font-weight: 700;
    width: 100px;
  }
div#verticale {
    width: 120px;
    height: 170px;
    margin-top: -35px;
    margin-left: -60px;
}
.titolo{
    font-size: 1.5em;

}
.sottotitolo{
    font-size: 0.6em;
}
.fascia{
    margin-top: 20px;
    height: 350px;
    width: 100%;
}

.contact_tit{
    font-size: 0.95em;
    margin: 5px 0 25px 0;
}
.contact_text2{
    font-size: 14px;
    margin: 10px 0 10px 0;
    line-height: 22px;
} 
}

@media only screen and (min-width: 320px) {
  .cd-logo {
    font-size: 0.8em;
    font-weight: 700;
    width: 100px;
  }
div#verticale {
    width: 280px;
    height: 170px;
    margin-top: -35px;
    margin-left: -140px;
    font-size: 0.8em;
}
.fascia{
    margin-top: 20px;
    height: 350px;
    width: 100%;
}

.contact_tit{
    font-size: 0.95em;
    margin: 5px 0 25px 0;
}
.contact_text2{
    font-size: 14px;
    margin: 10px 0 10px 0;
    line-height: 22px;
} 
}

@media only screen and (min-width: 480px) {
  .cd-logo {
    font-size: 1.2em;
    font-weight: 700;
    width: 100px;
  }
div#verticale {
    width: 360px;
    height: 170px;
    margin-top: -35px;
    margin-left: -180px;
}
.titolo{
    font-size: 3.5em;
}
.sottotitolo{
    font-size: 1em;
}

.fascia{
    margin-top: 20px;
    height: 350px;
    width: 100%;
}

.contact_tit{
    font-size: 0.95em;
    margin: 5px 0 25px 0;
}
.contact_text2{
    font-size: 14px;
    margin: 10px 0 10px 0;
    line-height: 22px;
} 
}

@media only screen and (min-width: 600px) {
  .cd-logo {
    font-size: 1.2em;
    font-weight: 700;
    width: 180px;
  }
div#verticale {
    width: 580px;
    height: 170px;
    margin-top: -35px;
    margin-left: -290px;
}
.titolo{
    font-size: 3.5em;
}
.sottotitolo{
    font-size: 1em;
}

.contact {
    height: 600px;
    background-size: 100%;
}

.fascia{
    margin-top: 250px;
    height: 350px;
    width: 100%;
}

.modulo{
    float: right;
    width: 40%;
    margin:-250px 30px 0 0;
    padding: 15px;
}

.contact_text{
    float: left;
    height: 200px;
    width: 45%;
    }
    
.contact_tit{
    font-size: 0.95em;
    margin: 5px 0 25px 0;
}
.contact_text2{
    font-size: 14px;
    margin: 10px 0 10px 0;
    line-height: 22px;
}  
}

@media only screen and (min-width: 801px) {
  .cd-logo {
    font-size: 1.2em;
    font-weight: 700;
    width: 201px;
  }
div#verticale {
    width: 780px;
    height: 170px;
    margin-top: -35px;
    margin-left: -390px;
}
.contact {
    height: 600px;
    background-size: 100%;
}

.fascia{
    margin-top: 250px;
    height: 350px;
    width: 100%;
}

.modulo{
    float: right;
    width: 40%;
    margin:-250px 30px 0 0;
    padding: 15px;
}

.contact_text{
    float: left;
    height: 200px;
    width: 45%;
    }
    
.contact_tit{
    font-size: 1.2em;
    margin: 5px 0 25px 0;
}
.contact_text2{
    font-size: 14px;
    margin: 10px 0 10px 0;
    line-height: 22px;
}       
}

@media only screen and (min-width: 1025px) {
  .cd-logo {
    font-size: 1.2em;
    font-weight: 700;
    width: 221px;
  }
  div#verticale {
    width: 980px;
    height: 170px;
    margin-top: -35px;
    margin-left: -490px;
}
.contact {
    height: 700px;
    background-size: 100%;
}

.fascia{
    margin-top: 350px;
    height: 350px;
    width: 100%;
}

.modulo{
    float: right;
    width: 40%;
    margin:-250px 30px 0 0;
    padding: 15px;
}

.contact_text{
    float: left;
    height: 200px;
    width: 45%;
    }
    
.contact_tit{
    font-size: 1.4em;
    margin: 5px 0 25px 0;
}
.contact_text2{
    font-size: 16px;
    margin: 10px 0 10px 0;
    line-height: 22px;
}  
}
@media only screen and (min-width: 1281px) {
  .cd-logo {
    font-size: 1.2em;
    font-weight: 700;
    width: 231px;
  }
div#verticale {
    width: 980px;
    height: 170px;
    margin-top: -35px;
    margin-left: -490px;
}

.contact {
    height: 800px;
    background-size: 100%;
}

.fascia{
    margin-top: 450px;
    height: 350px;
    width: 100%;
}

.modulo{
    float: right;
    width: 40%;
    margin:-250px 30px 0 0;
    padding: 15px;
}

.contact_text{
    float: left;
    height: 200px;
    width: 45%;
    }
    
.contact_tit{
    font-size: 1.4em;
    margin: 5px 0 25px 0;
}
.contact_text2{
    font-size: 16px;
    margin: 10px 0 10px 0;
    line-height: 22px;
}    
}