@font-face {
  font-family: NuromBoldFont;
  src: url(../src/font/Nurom-Bold.otf);
}

body a {
  color: black;
}
body a:hover{
  color: #0000ff;
}
.sezione {
  background-repeat: no-repeat;
  background-size:cover;
  width:100%;
  height:35rem;
  cursor: pointer;
}

.sezione h1 {
  color: #000000;
  font-family: NuromBoldFont;
  font-size:3rem;

  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.sezione1 {
  background-image: linear-gradient(rgba(255,255,255,0.3), rgba(255,255,255,0.3)), url('../src/lavori_piscina.jpg');
}
.sezione2 {
  background-image: linear-gradient(rgba(255,255,255,0.3), rgba(255,255,255,0.3)), url('../src/lavori_sport.jpg');
}
.sezione3 {
  background-image: linear-gradient(rgba(255,255,255,0.4), rgba(255,255,255,0.4)), url('../src/lavori_edilizia.jpg');
}
.sezione4 {
  background-image: linear-gradient(rgba(255,255,255,0.5), rgba(255,255,255,0.5)), url('../src/lavori_opere.jpg');
}

@media only screen and (min-width: 1024.1px) {
  .sezione1:hover {
    background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0)), url('../src/lavori_piscina.jpg');
  }
  .sezione2:hover {
    background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0)), url('../src/lavori_sport.jpg');
  }
  .sezione3:hover {
    background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0)), url('../src/lavori_edilizia.jpg');
  }
  .sezione4:hover {
    background-image: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0)), url('../src/lavori_opere.jpg');
  }
}

@media only screen and (max-width: 1024px) {
  .myrow {
    padding:2rem;
  }
  .sezione {
    height:25rem;
  }
}

@media only screen and (max-width: 768px) {
  .sezione {
    height:20rem;
  }
  .sezione h1 {
    font-size:2.5rem;
  }
}

@media only screen and (max-width: 576px) {
  .sezione h1 {
    font-size:2rem;
  }
}
