@import url(https://fonts.googleapis.com/css?family=Advent+Pro);

body {
  font-family: "Advent Pro", sans-serif;
}

.imgBottom {
  height: 35px;
}

.logoSito {
  text-align: center;
}

.bottom-language-chooser {
  list-style-type: none;
  margin: 20px 0 10px 0 !important;
  padding: 0;
  display: inline-block;
}

.text-color-dark {
  color: #2e4487 !important;
  /* font-size: 1.3vw !important; */
  text-shadow: none !important;
  text-align: justify !important;
}

#carousel-referenze {
  height: 600px;
  border: none;
  padding: 0 10px;
}

#carousel-referenze .carousel-caption {
  position: relative;
  text-shadow: none !important;
}

#carousel-referenze .carousel-control .icon-prev,
#carousel-referenze .carousel-control .glyphicon-chevron-left {
  left: 20%;
}

#carousel-referenze .carousel-control .icon-next,
#carousel-referenze .carousel-control .glyphicon-chevron-right {
  right: 20%;
}

.list-inline > li {
  padding: 0;
}

.menu {
  list-style-type: none;
  margin: 0;
  text-align: center;
  line-height: 90px;
}

.menu > li {
  display: inline;
  font-size: 2vw;
  margin-right: 4%;
}

.menu > li:last-child {
  margin-right: 4px;
}

.menu > li > a {
  color: #939598;
}

.menu > li > a:hover,
.menu > li > a:focus {
  color: #3871c1;
  text-decoration: none;
  background-color: transparent;
}

.squares {
  background-color: #bdbcbc;
  background-image: url("../images/logoQuadratini.svg");
  background-repeat: no-repeat;
  background-position: right bottom;
  background-size: 25%;
  border-width: 25px;
  border-style: solid;
  border-color: white;
}

.col-sm-10 img {
  height: 50px;
}

.bottom-language-chooser {
  display: none;
}

#colonnaMenu {
  margin-right: 0;
  padding-right: 0;
  height: 90px;
}

#colonnaLogo {
  text-align: center;
}

.col-sm-10 {
  padding-right: 0px;
  padding-left: 0px;
  padding-top: 30px;
  font-size: 1.5vw;
  color: white;
  font-weight: bold;
}

.col10-font {
  /*font-weight: bold;*/
  font-size: 1.3vw;
  padding-top: 0;
  color: white;
}

#carousel-home {
  height: 220px;
  z-index: 99;
  overflow: hidden;
}

.carousel {
  background-color: #3871c1;
  background: rgb(0, 156, 229); /* Old browsers */
  background: -moz-linear-gradient(
    left,
    rgba(0, 156, 229, 1) 0%,
    rgba(56, 113, 193, 1) 12%,
    rgba(38, 34, 98, 1) 100%
  ); /* FF3.6+ */
  background: -webkit-gradient(
    linear,
    left top,
    right top,
    color-stop(0%, rgba(0, 156, 229, 1)),
    color-stop(12%, rgba(56, 113, 193, 1)),
    color-stop(100%, rgba(38, 34, 98, 1))
  ); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(
    left,
    rgba(0, 156, 229, 1) 0%,
    rgba(56, 113, 193, 1) 12%,
    rgba(38, 34, 98, 1) 100%
  ); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(
    left,
    rgba(0, 156, 229, 1) 0%,
    rgba(56, 113, 193, 1) 12%,
    rgba(38, 34, 98, 1) 100%
  ); /* Opera 11.10+ */
  background: -ms-linear-gradient(
    left,
    rgba(0, 156, 229, 1) 0%,
    rgba(56, 113, 193, 1) 12%,
    rgba(38, 34, 98, 1) 100%
  ); /* IE10+ */
  background: linear-gradient(
    to right,
    rgba(0, 156, 229, 1) 0%,
    rgba(56, 113, 193, 1) 12%,
    rgba(38, 34, 98, 1) 100%
  ); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#009ce5', endColorstr='#262262', GradientType=1); /* IE6-9 */
}

.carousel-control.left,
.carousel-control.right {
  background-image: none;
  z-index: 99;
}

.carousel-caption {
  width: 100%;
  height: 100%;
  left: 0px;
  right: 0px;
  bottom: auto;
  padding-top: 0px;
  padding-bottom: 0px;
  padding: 15px;
}

.carousel-caption .row {
  max-height: 100%;
}

.carousel-caption .row .col-sm-4 {
  max-height: 100%;
}

.carousel-caption .row .col-sm-8 {
  height: 100%;
}

.citazioni {
  font-size: 22px;
  margin: 0px;
}

.container {
  height: 100%;
  width: 100%;
  margin-right: 0;
  margin-left: 0;
}

.paragrafo {
  font-size: 30px;
  color: white;
  margin-top: 25px;
  color: #7f7d7d;
  text-align: justify;
}

.paragrafoAzienda {
  background-color: #e9e9e9;
  background-image: url("../images/logoParagrafo.svg");
  background-repeat: no-repeat;
  background-position: 3%;
  background-size: auto auto;
  color: #2e4487;
  font-size: 35px;
  text-align: center;
}

.lineaDivisione {
  margin-right: 12px;
  margin-left: 12px;
  height: 25px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: #e8e8e8;
}

.testataParagrafo {
  margin-right: 12px;
  margin-left: 12px;
}

.paragrafoScelta {
  background-color: #918f90;
  text-align: center;
  font-size: 35px;
  color: white;
  margin-top: 20px;
}

#slogan-txt {
  font-size: 1.8vw;
}

#goTop {
  opacity: 0.5;
}

#goTop:hover,
#goTop:focus {
  cursor: pointer;
  opacity: 1;
}

.clienti > img {
  padding: 10px 30px;
}

.finestraTopRight {
  position: absolute;
  width: 230px;
  /* width: 23%; */
  /* height: 25%; */
  right: 15px;
  top: 15px;
  background-color: #24265d;
  opacity: 0.8;
  color: white;
  overflow: auto;
  max-height: 90%;
  padding: 20px;
  border-radius: 5px;
}

.finestraTopLeft {
  position: absolute;
  width: 20%;
  /*height: 25%;*/
  left: 15px;
  top: 15px;
  background-color: #24265d;
  opacity: 0.8;
  color: white;
  overflow: auto;
  max-height: 90%;
  padding: 20px;
  border-radius: 5px;
}

.finestraBottomLeft {
  position: absolute;
  width: 10%;
  left: 15px;
  bottom: 15px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 0%;
  padding: 15px;
}

.finestraBottomRight {
  position: absolute;
  /* width: 10%; */
  right: 15px;
  bottom: 15px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%;
  padding: 15px;
}

.dimContatto {
  width: 150px;
  height: 150px;
}

.listaContatti {
  list-style-type: none;
  text-align: center;
  padding-left: 30px;
}

.listaAziende {
  list-style-type: none;
  text-align: center;
}

.listaContatti li {
  display: inline-block;
  margin-right: 30px;
}

.listaAziende li {
  display: inline-block;
  padding-right: 30px;
  padding-top: 15px;
}

.centrato {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.toTopButton {
  bottom: 0%;
  right: 0%;
  position: fixed;
  height: 50px;
  width: 50px;
  background-image: url("../images/gotop2.svg");
  background-repeat: no-repeat;
  background-size: contain;
  visibility: hidden;
}

#showProgetti:hover {
  cursor: pointer;
}

#canvas {
  text-align: center;
  margin: 180px auto 0 auto;
  margin-top: 0;
}

#progetti {
  border-top: 3px black;
  margin-top: 20px;
}

.gruppoSocial {
  text-align: center;
  margin-top: 20px;
  margin-bottom: 0px;
}

#facebook {
  height: 25px;
  background-image: url("../images/facebook1.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%;
}

#facebook:hover {
  background-image: url("../images/facebook_hover1.svg");
}

#twitter {
  height: 25px;
  background-image: url("../images/twitter1.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%;
}

#twitter:hover {
  background-image: url("../images/twitter_hover1.svg");
}

#linkedin {
  height: 25px;
  background-image: url("../images/linkedin1.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%;
}

#linkedin:hover {
  background-image: url("../images/linkedin_hover1.svg");
}

.contributi {
  color: #fff;
  font-size: 8px;
  text-align: center;
  display: block;
}

/*
 * Let's target IE to respect aspect ratios and sizes for img tags containing SVG files
 *
 * [1] IE9
 * [2] IE10+
 */
/* 1 */
.ie9 img[src*=".svg"] {
  width: 100%;
}
/* 2 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  img[src*=".svg"] {
    width: 100%;
  }

  .heightIe55px {
    height: 55px !important;
  }

  .heightIe35px {
    height: 35px !important;
  }
}

.cos,
.quality,
.clickclock,
.tms,
.scratchandscreen,
.memoterapia,
.miami,
.clickiot,
.clickcheck,
.bvlgari,
.lg,
.bnl,
.tesipyb,
.e-int,
.nephro,
.granda,
.zerisk,
.lantek,
.bbtm,
.psm,
.sorting,
.tom,
.cedol,
.gin,
.cover4,
.cover6,
.fondstamp,
.geocap,
.calosso,
.conad,
.edicola,
.video {
  width: 100%;
  height: 600px;
  position: relative;
  /*-webkit-background-size: initial;
	-moz-background-size: initial;
	-o-background-size: initial;
	background-size: initial;*/
}

.quality {
  background: white url(../imagesPortfolio/quality/quality.jpg) no-repeat 50%
    50%;
  background-size: cover;
}

.clickclock {
  background: white url(../imagesPortfolio/clickclock/clickclock.jpg) no-repeat
    50% 50%;
  background-size: cover;
}

.tms {
  background: white url(../imagesPortfolio/tms/tms.png) no-repeat
    50% 50%;
  background-size: cover;
}

.scratchandscreen {
  background: white url(../imagesPortfolio/scratchandscreen/scratchandscreen.png) no-repeat
    50% 50%;
  background-size: cover;
}

.memoterapia {
  background: white url(../imagesPortfolio/memoterapia/memoterapia.png) no-repeat
    50% 50%;
  background-size: cover;
}

.miami {
  background: white url(../imagesPortfolio/miami/miami.png) no-repeat
    50% 50%;
  background-size: cover;
}

.clickiot {
  background: white url(../imagesPortfolio/clickiot/clickiot.png) no-repeat
    50% 50%;
  background-size: cover;
}

.clickcheck {
  background: white url(../imagesPortfolio/clickcheck/clickcheck.png) no-repeat
    50% 50%;
  background-size: cover;
}

.bvlgari {
  background: white url(../imagesPortfolio/bvlgari/bvlgari.png) no-repeat
    50% 50%;
  background-size: cover;
}

.lg {
  background: white url(../imagesPortfolio/lg/lg.png) no-repeat
    50% 50%;
  background-size: cover;
}

.bnl {
  background: white url(../imagesPortfolio/bnl/bnl.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.e-int {
  background: white url(../imagesPortfolio/eint/tesi-eint.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.edicola {
  background: white url(../imagesPortfolio/edicola/edicola.jpg) no-repeat 50%
    50%;
  background-size: cover;
}

.cos {
  background: white url(../imagesPortfolio/cos/cos.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.tesipyb {
  background: white url(../imagesPortfolio/tesipyb/tesipyb.jpg) no-repeat 50%
    50%;
  background-size: cover;
}

.fondstamp {
  background: white url(../imagesPortfolio/fondstamp/fondstamp.jpg) no-repeat
    50% 50%;
  background-size: cover;
}

.nephro {
  background: white url(../imagesPortfolio/nephro/nephromeet.jpg) no-repeat 50%
    50%;
  background-size: cover;
}

.geocap {
  background: white url(../imagesPortfolio/geocap/geocap.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.granda {
  background: white url(../imagesPortfolio/granda.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.zerisk {
  background: white url(../imagesPortfolio/zerisk.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.cedol {
  background: white url(../imagesPortfolio/cedolnet.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.gin {
  background: white url(../imagesPortfolio/gin/gin.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.calosso {
  background: white url(../imagesPortfolio/calosso/calosso.jpg) no-repeat 50%
    50%;
  background-size: cover;
}

.lantek {
  background: white url(../imagesPortfolio/lantek/lantek.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.bbtm {
  background: white url(../imagesPortfolio/bbtm/bbtm.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.psm {
  background: white url(../imagesPortfolio/psm/psm2.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.sorting {
  background: white url(../imagesPortfolio/sorting/sorting3.jpg) no-repeat 50%
    50%;
  background-size: cover;
}

.tom {
  background: white url(../imagesPortfolio/tom/tom.jpg) no-repeat 50% 50%;
  background-size: cover;
}

.conad {
  background: white url(../imagesPortfolio/conad/conad.jpg) no-repeat 50% 50%;
  background-size: cover;
}

/* iPhone */
@media only screen and (max-width: 320px) {
  .cos,
  .quality,
  .clickclock,
  .tms,
  .scratchandscreen,
  .memoterapia,
  .miami,
  .clickiot,
  .clickcheck,
  .bvlgari,
  .lg,
  .bnl,
  .tesipyb,
  .e-int,
  .nephro,
  .granda,
  .zerisk,
  .lantek,
  .bbtm,
  .psm,
  .sorting,
  .tom,
  .cedol,
  .gin,
  .cover4,
  .cover6,
  .fondstamp,
  .geocap,
  .calosso,
  .conad,
  .edicola,
  .video {
    height: 300px;
  }

  .col-sm-10 {
    font-size: 35px;
    text-align: center;
  }

  .col10-font {
    font-size: 15px;
    text-align: center;
  }

  .logoSitoCarousel {
    display: none;
  }

  .citazioni {
    font-size: 20px;
    /*margin-top: 0px;*/
  }

  .logoSito {
    text-align: center;
  }
}

/* iPhone 4 */
@media only screen and (max-width: 640px) {
  .cos,
  .quality,
  .clickclock,
  .tms,
  .scratchandscreen,
  .memoterapia,
  .miami,
  .clickiot,
  .clickcheck,
  .bvlgari,
  .lg,
  .bnl,
  .tesipyb,
  .e-int,
  .nephro,
  .granda,
  .zerisk,
  .lantek,
  .bbtm,
  .psm,
  .sorting,
  .tom,
  .cedol,
  .gin,
  .cover4,
  .cover6,
  .fondstamp,
  .geocap,
  .calosso,
  .conad,
  .edicola,
  .video {
    height: 300px;
  }

  #carousel-referenze .col-sm-10 {
    font-size: 12px;
  }

  .col-sm-10 {
    font-size: 35px;
    text-align: center;
  }

  .col10-font {
    font-size: 20px;
    text-align: center;
  }

  .logoSitoCarousel {
    display: none;
  }

  .citazioni {
    font-size: 20px;
    /*margin-top: 0px;*/
  }

  .carousel-caption {
    padding: 0px;
  }

  .logoSito {
    text-align: center;
  }
}

@media only screen and (min-width: 640px) {
  .col-sm-10 {
    font-size: 26px;
  }

  .col10-font {
    font-size: 20px;
  }

  .logoSitoCarousel {
    display: none;
  }

  .logoSito {
    text-align: center;
  }
}

/* iPads */
@media only screen and (max-width: 768px) {
  .cos,
  .quality,
  .clickclock,
  .tms,
  .scratchandscreen,
  .memoterapia,
  .miami,
  .clickiot,
  .clickcheck,
  .bvlgari,
  .lg,
  .bnl,
  .tesipyb,
  .e-int,
  .nephro,
  .granda,
  .zerisk,
  .lantek,
  .bbtm,
  .psm,
  .sorting,
  .tom,
  .cedol,
  .gin,
  .cover4,
  .cover6,
  .fondstamp,
  .geocap,
  .calosso,
  .conad,
  .edicola,
  .video {
    height: 300px;
  }

  .bottom-language-chooser {
    display: block;
  }

  #colonnaMenu {
    display: none;
  }

  #colonnaLogo {
    margin-bottom: 15px;
  }

  .col10-font {
    font-size: 18px;
    padding-bottom: 25px;
  }

  .paragrafoAzienda {
    font-size: 18px;
  }

  #valoreArtigiano {
    padding-left: 80px;
    /*height: 50px;
		line-height: 50px;*/
  }

  /*#progetti-title{
    margin-bottom: 20px;
    padding-left: 65px;
    height: 50px;
    line-height: 50px;
  }*/

  #slogan-txt {
    font-size: 15px;
  }

  .list-unstyled > li > h1 {
    font-size: 15px;
    margin-top: 10px;
  }

  .squares {
    height: auto;
    text-align: center;
  }

  .imgBottom {
    height: 40px;
  }

  .col-sm-2 {
    padding: 15px;
  }

  .finestraTopRight,
  .finestraTopLeft {
    display: none;
  }

  .paragrafoScelta {
    font-size: 18px;
    padding: 8px;
  }

  .logoSitoCarousel {
    display: none;
  }

  .citazioni {
    font-size: 20px;
    /*margin-top: 0px;*/
  }

  #carousel-referenze {
    height: 710px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  #carousel-home {
    height: 170px;
  }

  #carousel-referenze {
    height: 500px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #carousel-referenze {
    height: 580px;
  }
}

/* da iPads (portrait and landscape) in su */
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .cos,
  .quality,
  .clickclock,
  .tms,
  .scratchandscreen,
  .memoterapia,
  .miami,
  .clickiot,
  .clickcheck,
  .bvlgari,
  .lg,
  .bnl,
  .tesipyb,
  .e-int,
  .nephro,
  .granda,
  .zerisk,
  .lantek,
  .bbtm,
  .psm,
  .sorting,
  .tom,
  .cedol,
  .gin,
  .cover4,
  .cover6,
  .fondstamp,
  .geocap,
  .calosso,
  .conad,
  .edicola,
  .video {
    height: 600px;
  }

  .col-sm-10 {
    font-size: 3vw;
  }

  .col10-font {
    font-size: 12px;
    padding-bottom: 25px;
  }

  .col-sm-10 img {
    height: 50px;
  }

  #colonnaMenu {
    height: 65px;
  }

  .menu > li {
    font-size: 20px;
  }

  .paragrafoScelta {
    font-size: 25px;
    padding: 8px;
  }

  .logoSitoCarousel {
    display: block;
  }

  .citazioni {
    font-size: 17px;
    /*margin-top: 0px;*/
  }

  .gruppoSocial {
    margin-top: 30px;
    text-align: center;
  }
}

/* iPhone 5 only */
@media only screen and (min-device-width: 560px) and (max-device-width: 1136px) and (-webkit-min-device-pixel-ratio: 2) {
  .cos,
  .quality,
  .clickclock,
  .tms,
  .scratchandscreen,
  .memoterapia,
  .miami,
  .clickiot,
  .clickcheck,
  .bvlgari,
  .lg,
  .bnl,
  .tesipyb,
  .e-int,
  .nephro,
  .granda,
  .zerisk,
  .lantek,
  .bbtm,
  .psm,
  .sorting,
  .tom,
  .cedol,
  .gin,
  .cover4,
  .cover6,
  .fondstamp,
  .geocap,
  .calosso,
  .conad,
  .edicola,
  .video {
    height: 600px;
  }
}

/* pc e laptops */
@media only screen and (min-width: 980px) {
  .cos,
  .quality,
  .clickclock,
  .tms,
  .scratchandscreen,
  .memoterapia,
  .miami,
  .clickiot,
  .clickcheck,
  .bvlgari,
  .lg,
  .bnl,
  .tesipyb,
  .e-int,
  .nephro,
  .granda,
  .zerisk,
  .lantek,
  .bbtm,
  .psm,
  .sorting,
  .tom,
  .cedol,
  .gin,
  .cover3,
  .cover4,
  .cover5,
  .cover6,
  .fondstamp,
  .geocap,
  .calosso,
  .conad,
  .edicola,
  .video {
    height: 600px;
  }

  .col10-font {
    font-size: 14px;
    padding-bottom: 25px;
  }

  .logoSitoCarousel {
    display: block;
  }

  .gruppoSocial {
    margin-top: 30px;
    text-align: center;
  }

  .contributi {
    text-align: center;
    display: block;
  }

  .logoSito {
    text-align: left;
  }

  .registeredOffice {
    padding-left: 80px;
  }
}

/* large desktop */
@media only screen and (min-width: 1200px) {
  .cos,
  .quality,
  .clickclock,
  .tms,
  .scratchandscreen,
  .memoterapia,
  .miami,
  .clickiot,
  .clickcheck,
  .bvlgari,
  .lg,
  .bnl,
  .tesipyb,
  .e-int,
  .nephro,
  .granda,
  .zerisk,
  .lantek,
  .bbtm,
  .psm,
  .sorting,
  .cedol,
  .tom,
  .gin,
  .cover3,
  .cover4,
  .cover5,
  .fondstamp,
  .geocap,
  .calosso,
  .conad,
  .edicola,
  .cover6 {
    height: 600px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-attachment: fixed;
  }

  #carousel-referenze {
    height: 650px;
  }

  .menu {
    text-align: right;
  }

  .col10-font {
    font-size: 1.3vw;
    padding-bottom: 25px;
  }

  .container-fluid {
    max-width: 1200px;
  }

  .menu > li {
    font-size: 24px;
  }

  .logoSitoCarousel {
    display: block;
  }

  .logoSito {
    text-align: left;
  }

  .gruppoSocial {
    margin-top: 30px;
    text-align: right;
  }

  .contributi {
    text-align: center;
    display: block;
    max-width: 40%;
    margin-left: auto;
  }

  .registeredOffice {
    padding-left: 80px;
  }
}