*{
    margin: 0px;
    
}
body{
  background-image: url(FONDO\ RUTA.png);
  background-size:contain
  
}

.radios{
  
}
.canal{
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: white;
  
}
.canal a img{
  width: 80px;
  
}
.canal h1{
  font-family: sans-serif;
  font-weight: 900

}
.color{
  background-color: black;
}

header{
    text-align: center;
    background-size: contain;
    
    background-repeat: no-repeat;
    background-image:url(RC\ RADIOS.jpg);
    margin-bottom: 20%;
}

header a{
   
   border: 50px;
    text-decoration: none;
    background-color: chartreuse;

}
.radios{
    display: flex;
    width: 80%;
    height: 50%;
    margin-top: 5px;
}
.rrock{
  background-position: center;
  border-radius: 10%;
   background-size: cover;
   background-image:linear-gradient(
    0deg,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.6)
)
, url(radio-rock.jpg);
 margin: 50px
}


.fmmas{
   background-position: center;
   border-radius: 10%;
    background-size: cover;
    background-image:linear-gradient(
      0deg,
      rgba(0,0,0,0.6),
      rgba(0,0,0,0.6)
  )
  , url(fm\ mas.jpeg);
  margin: 50px
}
.radios{

}

 .amistad{
    background-position: center;
    border-radius: 10%;
     background-size:contain;
     background-image:linear-gradient(
      0deg,
      rgba(0,0,0,0.6),
      rgba(0,0,0,0.6)
  )
  , url(18ruedas.png);
   margin: 50px
 }
 p {
  text-align: center;
  margin-top: 40px;
  
 }
h3{
 text-align: center;
  margin-top: 60px;
}
a{
  text-align: center;
}
.aires{
  background-position: center;
  border-radius: 10%;
  background-size:contain;
  background-image:linear-gradient(
    0deg,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.6)
)
, url(aires\ del\ sur.jpeg);
margin: 50px

}
.pueblo{
  border-radius: 10%;
  background-position: center;
 
  background-size:contain;
  background-image:linear-gradient(
    0deg,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.6)
)
, url(fm\ pueblo.jpg);
margin: 50px
}
.godeken{
  border-radius: 10%;
  background-position: center;
 
  background-size:contain;
  background-image:linear-gradient(
    0deg,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.6)
)
, url(FM\ sueños.jpeg);
margin: 50px
}
.retro{
  border-radius: 10%;
  background-position: center;
 
  background-size:contain;
  background-image:linear-gradient(
    0deg,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.6)
)
, url(clasicos\ en\ red.jpeg);
margin: 50px
}
.sol{
  border-radius: 10%;
  background-position: center;
 
  background-size:contain;
  background-image:linear-gradient(
    0deg,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.6)
)
, url(FRECUENCIA\ SOL.jpeg);
margin: 50px
}
.virus{
  border-radius: 10%;
  background-position: center;
 
  background-size:contain;
  background-image:linear-gradient(
    0deg,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.6)
)
, url(fmvirus1.jpeg);
margin: 50px
}
.lazona{

  border-radius: 10%;
  background-position: center;
 background-size:contain;
  background-image:url(suma\ tu\ radio\ aquí.gif);
margin: 50px

}

.radios h1,h3,p{
  color:white;
  text-align: center;
  font-weight:700;
}

.publicidad img{
  width: 20%;
 border-radius: 10%;

}
.publicidad{
  text-align: center;
  align-items: center;
  justify-content: center;
}
footer{
  background-color:rgb(60, 60, 60);
  
}
footer p{
  margin: 0;
 
  padding: 12px;
   color:white
}
footer .conteiner{
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: flex-end;}
  .especial{
    text-align: center;
    color: white;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 800;
    
  }
  p.especial{
    padding-bottom: 1%;
    color:white

    
  }
  .btn-wsp{
    position:static;
    width: 45px;
    height: 45px;
    line-height: 55px;
    bottom: 30px;
    right: 30px;
    text-align: center;
    justify-content: center;
    align-items: center;
 }
h4{
  color: white;
}
.btn-wsp1{
  
visibility:none;
}
@media (max-width:720px) {
  body{
    background-image: url(fondo701.png);
  
  
    background-repeat
  }
  .radios{
    display: contents;
  }
  .pueblo{
    border-radius: 10%;
    background-position: center;
   
    background-size:contain;
    background-image:linear-gradient(
      0deg,
      rgba(0,0,0,0.6),
      rgba(0,0,0,0.6)
  )
  , url(fm\ pueblo.jpg);
  margin: 120px
  }
  .rrock{
    margin: 120px;
  }
  .fmmas{
     margin-bottom: 1px;
         margin: 120px;
   
  }
  .amistad{
    margin: 120px;
  }
  .aires{
    margin: 120px;
  }
  .lazona{
    margin: 120px;
    
    background-size:;
  }
  .virus{
    margin: 120px;
  }
  .radios{
    display:block;
    width: 100%;
    height: 10%;
    margin-top: 10px;
  }
  .btn-wsp1{
    position:fixed;
    width: 100px;
    height: 100px;
    line-height: 55px;
    bottom: 25px;
    right: 25px;
    text-align: center;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    background-image: url(BOTON\ conoce.gif);
    background-position:center;
    background-size: cover;
  ;
    
 }
 .aires.p{
  color: white;
 }

}
@media (max-width:720px) {
  .radios{
   align-items: center;
   text-align: center;
     justify-content: center;
   display:contents
    
  }
  .rrock{
    height: 350px;
    width: 300px;
    text-align: center;
    align-items: center;
    margin-left: 50px;
  }
  .rrock audio{
    width: 60%;
  }
  .fmmas{
    height: 350px;
    width: 300px;
    text-align: center;
    align-items: center;
    margin-left: 50px;
  }
  .fmmas audio{
    width: 60%;
  }
  .amistad{
    height: 350px;
    width: 300px;
    text-align: center;
    align-items: center;
    margin-left: 50px;
  }
  .amistad audio{
    width: 60%;
  }
  .aires{
    height: 350px;
    width: 300px;
    text-align: center;
    align-items: center;
    margin-left: 50px;
  }
  .aires audio{
    width: 60%;
}
.pueblo{
  height: 350px;
  width: 300px;
  text-align: center;
  align-items: center;
  margin-left: 50px;
}

.pueblo audio{
  width: 60%;
}
.godeken{
  height: 350px;
  width: 300px;
  text-align: center;
  align-items: center;
  margin-left: 50px;
  background-image:linear-gradient(
    0deg,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.6)
)
, url(FM\ sueños.jpeg);

}
.retro{
  height: 350px;
  width: 300px;
  text-align: center;
  align-items: center;
  margin-left: 50px;
}
.sol{
  height: 350px;
  width: 300px;
  text-align: center;
  align-items: center;
  margin-left: 50px; background-image:linear-gradient(
    0deg,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.6)
)
, url(FRECUENCIA\ SOL.jpeg);
}
.sol audio{
  width: 60%;}
  .virus{
    height: 350px;
  width: 300px;
  text-align: center;
  align-items: center;
  margin-left: 50px; background-image:linear-gradient(
    0deg,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.6)
)
, url(fmvirus1.jpeg);
  }
  .virus audio{
    width: 60%;
  }

   .lazona{
   border-radius: 10%;
  background-position: center;
 background-size:contain;
  background-image:url(suma\ tu\ radio\ aquí.gif);
  height: 350px;
  width: 300px;
  text-align: center;
  align-items: center;
  margin-left: 50px;
}

.lazona P{
  color: black;
}
.lazona h3{
  color:black
}
.canal h1{
  font-size: 15px;
}


}